/* ═══════════════════════════════════════════════════════════════
   Chat widget — shared by the home and /chatbot (markup: #cw, script: chatbot.js)
   ═══════════════════════════════════════════════════════════════ */

.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* on the home the corner chat waits until the film is over */
.hdr.is-intro~.cw{opacity:0;visibility:hidden;pointer-events:none;transform:translateY(14px)}

/* ═══ Chat widget: the real chatbot, fixed in the bottom-right corner ═══ */
@keyframes bubIn{from{opacity:0;transform:translateY(8px)}}
@keyframes dot{0%,100%{opacity:.35;transform:translateY(0)}50%{opacity:1;transform:translateY(-3px)}}
@keyframes pulseAv{0%,100%{transform:scale(1)}50%{transform:scale(1.14)}}

.cw{position:fixed;right:max(20px,env(safe-area-inset-right,0px));bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:12;display:flex;flex-direction:column;align-items:flex-end;gap:14px;pointer-events:none;transition:opacity .5s ease,transform .5s var(--ease),visibility .5s}
.cw>*{pointer-events:auto}
.cw__panel{width:392px;height:min(640px,calc(100vh - 126px));height:min(640px,calc(100svh - 126px));display:flex;flex-direction:column;border-radius:28px;background:#F6F6F6;color:var(--t);overflow:hidden;
  box-shadow:0 30px 70px -20px rgba(0,0,0,.5),0 0 0 1px rgba(11,11,11,.08);transform-origin:100% 100%;transition:opacity .3s var(--ease),transform .38s var(--ease),visibility .3s}
.cw:not(.is-open) .cw__panel{opacity:0;visibility:hidden;transform:translateY(14px) scale(.96);pointer-events:none}
.cw__top{flex:none;display:flex;justify-content:space-between;padding:10px 10px 0}
.cw__rb{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#E4E4E4;color:#111;transition:background .2s ease}
.cw__rb:hover{background:#d6d6d6}
.cw__rb svg{width:18px;height:18px}
.cw__id{position:relative;flex:none;align-self:center;margin-top:-30px;display:flex;align-items:center;gap:12px;padding:8px 24px 8px 8px;border-radius:99px;background:#fff;box-shadow:0 8px 24px -10px rgba(0,0,0,.25),0 0 0 1px rgba(11,11,11,.05)}
.cw__id img{width:44px;height:44px;border-radius:50%}
.cw__id b{display:block;font-size:15px;line-height:1.2;font-weight:700}
.cw__id b i{font-style:normal;color:var(--indigo)}
.cw__id small{display:block;font-size:13px;line-height:1.3;color:#6b6b6b}
.cw__id .cw__dot{position:absolute;left:42px;top:6px}
.cw__dot{width:12px;height:12px;border-radius:50%;background:#16a34a;box-shadow:0 0 0 2.5px #fff}
.cw__log{flex:1;min-height:0;padding:20px 16px 8px;-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 22px);mask-image:linear-gradient(to bottom,transparent 0,#000 22px);overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:14px;scroll-behavior:smooth}
.cw__log .msg{display:flex;align-items:flex-start;gap:10px;align-self:flex-start;max-width:96%}
.cw__log .msg img{flex:none;width:28px;height:28px;border-radius:50%;margin-top:-1px}
.cw__log .msg.is-thinking img{animation:pulseAv 1.1s ease-in-out infinite}
.cw__log .bub{font-size:15px;line-height:1.5;overflow-wrap:anywhere;animation:bubIn .4s var(--ease) both}
.cw__log .bub--you{max-width:none;padding:0;background:none;box-shadow:none;border-radius:0}
.cw__log .bub--me{max-width:84%;padding:9px 14px;border-radius:18px 18px 5px 18px;font-size:15px}
.cw__log .bub a{text-decoration:underline;text-underline-offset:3px;font-weight:500}
.bub--typing{display:inline-flex;align-items:center;gap:5px;height:24px}
.bub--typing i{width:7px;height:7px;border-radius:50%;background:rgba(11,11,11,.35);animation:dot 1s ease-in-out infinite}
.bub--typing i:nth-child(2){animation-delay:.15s}.bub--typing i:nth-child(3){animation-delay:.3s}
.cw__chips{flex:none;display:flex;gap:8px;padding:6px 34px 10px 14px;overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 30px),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 30px),transparent)}
.cw__chips::-webkit-scrollbar{display:none}
.cw__chips:empty{display:none}
.chip-q{flex:none;min-height:44px;padding:0 16px;border-radius:99px;border:1px solid rgba(11,11,11,.14);background:#fff;font-size:14px;font-weight:500;white-space:nowrap;transition:background .2s ease,border-color .2s ease}
.chip-q:hover{background:#efefef;border-color:rgba(11,11,11,.26)}
.cw__note{flex:none;margin:0 14px 10px;padding:9px 14px;border-radius:18px;background:#fff;color:#6b6b6b;font-size:12px;line-height:1.4}
.cw__in{flex:none;display:flex;align-items:center;gap:8px;margin:0 14px;padding:4px 4px 4px 18px;border-radius:99px;background:#fff;box-shadow:0 0 0 1.5px #0b0b0b}
.cw__in input{flex:1;min-width:0;height:44px;border:0;outline:0;background:none;font:400 16px/1 var(--sans);color:var(--t)}
.cw__in input::placeholder{color:#7a7a7a}
.cw__send{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#0b0b0b;color:#fff;transition:transform .3s var(--ease)}
.cw__send:hover{transform:scale(1.06)}
.cw__send svg{width:18px;height:18px}
.cw__pw{flex:none;padding:9px 0 12px;text-align:center;font-size:12px;color:#6b6b6b}
.cw__pw b{font-weight:600;color:#111}.cw__pw i{font-style:normal;color:var(--indigo)}

.cw__launch{position:relative;flex:none;width:64px;height:64px;border-radius:50%;box-shadow:0 14px 30px -8px rgba(11,11,11,.55),0 0 0 4px rgba(255,255,255,.92);transition:transform .35s var(--ease)}
.cw__launch:hover{transform:scale(1.07)}
.cw__launch img{width:64px;height:64px;border-radius:50%}
.cw__launch .cw__dot{position:absolute;right:0;top:2px}
.cw.is-open .cw__launch{transform:scale(.9)}
.cw__tease{margin:0;padding:11px 16px;border-radius:18px 18px 4px 18px;background:#fff;box-shadow:0 12px 28px -12px rgba(0,0,0,.4),0 0 0 1px rgba(11,11,11,.06);font-size:15px;font-weight:500;cursor:pointer;animation:bubIn .5s var(--ease) both}
.cw__tease[hidden],.cw.is-open .cw__tease{display:none}

/* phone: lift above the Telegram / WhatsApp bar, and open as a full-screen sheet like a messaging app */
@media (max-width:809px){
  .cw{right:max(14px,env(safe-area-inset-right,0px))}
  .cw.is-open{top:0;left:0;right:0;bottom:0;gap:0}
  .cw.is-open .cw__panel{width:100%;height:100%;height:100dvh;border-radius:0;box-shadow:none;padding-top:env(safe-area-inset-top,0px)}
  .cw.is-open .cw__launch{display:none}
  .cw.is-open .cw__pw{padding-bottom:calc(12px + env(safe-area-inset-bottom,0px))}
  html.cw-lock,html.cw-lock body{overflow:hidden}
}
@media (prefers-reduced-motion:reduce){.cw,.cw__panel,.cw__launch{transition:none}.cw__log{scroll-behavior:auto}.cw__log .bub,.cw__tease{animation:none}.cw__log .msg.is-thinking img,.bub--typing i{animation:none}}


/* phone held sideways: give the conversation the room — drop the note and the footer line */
@media (max-height:520px) and (max-width:1000px){
  .cw.is-open .cw__note,.cw.is-open .cw__pw{display:none}
  .cw.is-open .cw__chips{padding-bottom:8px}
  .cw.is-open .cw__in{margin-bottom:calc(10px + env(safe-area-inset-bottom,0px))}
}
