/* ============================================================
   Dr. IAgo — Dock conversacional (estética WhatsApp, discreto)
   Cor própria (verde WhatsApp) destacada do azul da página.
   ============================================================ */
:root{
  --wa-green:#25835b; --wa-green-d:#1c6d4a; --wa-header:#0f6b4a;
  --wa-paper:#e7ddd3; --wa-bubble-in:#ffffff; --wa-bubble-out:#d6fbcf;
  --wa-ink:#11251c; --chat-r:20px;
}

/* ---------- Launcher flutuante (discreto, canto) ---------- */
.dockx{position:fixed;right:20px;bottom:calc(20px + env(safe-area-inset-bottom));z-index:60;
  display:flex;align-items:center;gap:10px;cursor:pointer;
  background:#fff;border:1px solid rgba(16,24,40,.10);border-radius:999px;
  padding:8px 16px 8px 8px;box-shadow:0 14px 34px rgba(16,24,40,.20);
  transition:transform .2s var(--ease,ease),box-shadow .2s;max-width:calc(100vw - 40px)}
.dockx:hover{transform:translateY(-2px);box-shadow:0 18px 44px rgba(16,24,40,.26)}
.dockx__av{position:relative;width:46px;height:46px;border-radius:50%;flex:none}
.dockx__av img{width:100%;height:100%;border-radius:50%;object-fit:cover;object-position:center top;border:2px solid var(--wa-green)}
.dockx__av::after{content:"";position:absolute;right:1px;bottom:1px;width:11px;height:11px;border-radius:50%;background:#25d366;border:2px solid #fff;animation:dotPulse 2.4s ease-in-out infinite}
@keyframes dotPulse{0%{box-shadow:0 0 0 0 rgba(37,211,102,.65)}70%{box-shadow:0 0 0 7px rgba(37,211,102,0)}100%{box-shadow:0 0 0 0 rgba(37,211,102,0)}}
.dockx__txt{display:flex;flex-direction:column;line-height:1.15;text-align:left}
.dockx__txt strong{font-family:var(--font-d,'Sora',sans-serif);font-size:.92rem;color:var(--ink,#11151c)}
.dockx__txt small{font-size:.76rem;color:var(--wa-green)}
.dockx[hidden]{display:none}
@media(max-width:520px){.dockx__txt small{display:none}}

/* ---------- Painel de chat (compacto, não toma a tela) ---------- */
.cx{position:fixed;right:20px;bottom:20px;z-index:65;
  width:368px;max-width:calc(100vw - 32px);height:min(590px,76vh);
  display:flex;flex-direction:column;overflow:hidden;border-radius:var(--chat-r);
  background:var(--wa-paper);box-shadow:0 26px 70px rgba(8,14,20,.42);
  border:1px solid rgba(8,14,20,.18);transform-origin:bottom right;
  animation:cxIn .46s cubic-bezier(.2,.7,.3,1.05)}
/* efeito "gênio/dock": surge de dentro da bolinha do canto e cresce */
@keyframes cxIn{0%{opacity:0;transform:scale(.16) translate(30px,30px)}50%{opacity:1}100%{opacity:1;transform:none}}
/* saída: encolhe de volta pra bolinha */
.cx--fade{animation:cxFade .34s cubic-bezier(.42,0,.7,.4) forwards}
@keyframes cxFade{to{opacity:0;transform:scale(.16) translate(30px,30px)}}
.cx[hidden]{display:none}
@media(max-width:520px){
  /* ocupa ~1/3 da tela: a pessoa continua vendo e rolando a página por trás */
  .cx{right:8px;left:8px;bottom:8px;width:auto;max-width:none;height:42vh;height:42dvh;min-height:320px;border-radius:18px}
  .cx__head{padding:8px 12px}
  .cx__av{width:34px;height:34px}
  .cx__log{padding:10px 11px;gap:7px}
  .cxm{max-width:88%;font-size:.9rem;padding:7px 10px}
  .cxform{padding:8px 10px calc(8px + env(safe-area-inset-bottom))}
  .cxinput{padding:9px 13px}
  .cxsend{width:38px;height:38px}
  /* chips numa linha rolável, pra não empilhar e roubar altura */
  .cxquick{flex-wrap:nowrap;overflow-x:auto;max-height:none;padding:0 10px 4px;-webkit-overflow-scrolling:touch}
  .cxchip{flex:none;font-size:.8rem;padding:6px 12px}
}

/* header verde WhatsApp */
.cx__head{display:flex;align-items:center;gap:11px;padding:15px 14px 12px;position:relative;
  background:linear-gradient(180deg,var(--wa-header),var(--wa-green));color:#fff;flex:none}
/* alça pra arrastar e aumentar o chat */
.cx__grab{position:absolute;top:5px;left:50%;transform:translateX(-50%);width:46px;height:5px;border-radius:99px;background:rgba(255,255,255,.45);cursor:ns-resize;touch-action:none}
.cx__grab:hover{background:rgba(255,255,255,.7)}
.cx__av{position:relative;width:40px;height:40px;border-radius:50%;flex:none}
.cx__av img{width:100%;height:100%;border-radius:50%;object-fit:cover;object-position:center top;border:1.5px solid rgba(255,255,255,.5)}
.cx__av::after{content:"";position:absolute;right:0;bottom:0;width:10px;height:10px;border-radius:50%;background:#25d366;border:2px solid var(--wa-green);animation:dotPulse 2.4s ease-in-out infinite}
.cx__id{flex:1;min-width:0;line-height:1.2}
.cx__id strong{font-family:var(--font-d,'Sora',sans-serif);font-size:.98rem;display:block}
.cx__id small{font-size:.74rem;opacity:.9;display:flex;align-items:center;gap:5px}
.cx__id small::before{content:"";width:7px;height:7px;border-radius:50%;background:#8ff0b6}
.cx__close{background:rgba(255,255,255,.12);border:none;color:#fff;width:30px;height:30px;border-radius:50%;
  cursor:pointer;font-size:1rem;display:grid;place-items:center;transition:background .2s;flex:none}
.cx__close:hover{background:rgba(255,255,255,.24)}

/* corpo (papel WhatsApp) */
.cx__log{flex:1;overflow-y:auto;padding:14px 12px;display:flex;flex-direction:column;gap:8px;
  background:var(--wa-paper);
  background-image:radial-gradient(rgba(16,37,28,.03) 1px,transparent 1px);background-size:20px 20px}
.cx__log::-webkit-scrollbar{width:6px}
.cx__log::-webkit-scrollbar-thumb{background:rgba(16,37,28,.22);border-radius:99px}

/* balões — cor própria, amistosa */
.cxm{max-width:82%;padding:8px 11px;border-radius:12px;font-size:.93rem;line-height:1.46;
  color:#0a1d13;font-weight:500;white-space:pre-wrap;word-wrap:break-word;box-shadow:0 1px 2px rgba(8,14,20,.14);
  animation:cxmIn .22s ease}
@keyframes cxmIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.cxm--bot{align-self:flex-start;background:var(--wa-bubble-in);border-top-left-radius:4px}
.cxm--user{color:#08301c}
.cxm--bot .cxm__nm{display:block;font-family:var(--font-d,'Sora',sans-serif);font-size:.73rem;font-weight:800;color:#0e9552;margin-bottom:2px}
.cxm--user{align-self:flex-end;background:var(--wa-bubble-out);border-top-right-radius:4px}
.cxcursor{display:inline-block;width:.5em;height:1em;background:var(--wa-green);margin-left:1px;vertical-align:-2px;animation:cxblink .9s steps(2) infinite;border-radius:1px}
@keyframes cxblink{50%{opacity:0}}

/* typing */
.cxtyping{align-self:flex-start;background:#fff;border-radius:12px;border-top-left-radius:4px;padding:10px 12px;display:inline-flex;gap:4px;box-shadow:0 1px 1px rgba(8,14,20,.1)}
.cxtyping span{width:7px;height:7px;border-radius:50%;background:#9fb3a8;animation:cxtype 1.2s infinite}
.cxtyping span:nth-child(2){animation-delay:.18s}.cxtyping span:nth-child(3){animation-delay:.36s}
@keyframes cxtype{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-4px);opacity:1}}

/* offer card dentro do chat */
.cxoffer{align-self:stretch;background:#fff;border:1px solid rgba(47,95,176,.28);border-left:4px solid var(--accent,#2f5fb0);
  border-radius:12px;padding:12px 14px;box-shadow:0 6px 18px rgba(16,24,40,.12);animation:cxmIn .28s ease}
.cxoffer__nm{font-family:var(--font-d,'Sora',sans-serif);font-weight:700;font-size:1rem;color:var(--ink,#11151c);display:flex;justify-content:space-between;align-items:center;gap:8px}
.cxoffer__price{color:var(--accent,#2f5fb0)}
.cxoffer__why{color:#586a78;font-size:.85rem;margin:.35rem 0 .55rem}
.cxoffer__list{list-style:none;margin:0 0 .7rem;padding:0;display:flex;flex-direction:column;gap:.3rem}
.cxoffer__list li{position:relative;padding-left:1.3em;font-size:.84rem;color:#16222e}
.cxoffer__list li::before{content:"✓";position:absolute;left:0;color:#1e9e5b;font-weight:800}
.cxoffer .btn{width:100%;justify-content:center;font-size:.9rem;padding:11px}
.cxoffer__guar{font-size:.74rem;color:#8a97a4;text-align:center;margin-top:.5rem}

/* quick replies */
.cxquick{display:flex;flex-wrap:wrap;gap:6px;padding:0 12px 4px;max-height:112px;overflow-y:auto;background:var(--wa-paper)}
.cxquick:empty{display:none}
.cxchip{font-family:var(--font-d,'Sora',sans-serif);font-size:.82rem;font-weight:600;cursor:pointer;
  background:linear-gradient(180deg,#ffffff,#eef6f0);border:1.5px solid var(--wa-green);color:var(--wa-green-d);
  border-radius:999px;padding:8px 15px;transition:transform .15s,box-shadow .18s,background .18s;animation:cxmIn .2s ease;
  box-shadow:0 3px 7px rgba(12,60,42,.22),inset 0 1px 0 rgba(255,255,255,.85)}
.cxchip:hover{background:var(--wa-green);color:#fff;transform:translateY(-1px);box-shadow:0 6px 13px rgba(12,60,42,.32)}
.cxchip:active{transform:translateY(0);box-shadow:0 2px 5px rgba(12,60,42,.28)}

/* input compacto (ocupa menos) */
.cxform{display:flex;gap:8px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:#f0f0f0;border-top:1px solid rgba(8,14,20,.08);align-items:center;flex:none}
.cxinput{flex:1;background:#fff;border:1px solid rgba(8,14,20,.14);color:var(--wa-ink);
  border-radius:999px;padding:10px 15px;font-family:var(--font-b,sans-serif);font-size:16px;outline:none;transition:border-color .2s}
.cxinput:focus{border-color:var(--wa-green)}
.cxsend{display:grid;place-items:center;width:42px;height:42px;flex:none;border:none;cursor:pointer;border-radius:50%;
  color:#fff;background:var(--wa-green);transition:.18s}
.cxsend:hover{background:var(--wa-green-d);transform:scale(1.05)}
.cxsend:disabled{opacity:.5;cursor:default;transform:none}

/* botão recuar (setinha) no header */
.cx__min{background:rgba(255,255,255,.12);border:none;color:#fff;width:30px;height:30px;border-radius:50%;cursor:pointer;display:grid;place-items:center;transition:background .2s;flex:none;margin-right:2px}
.cx__min:hover{background:rgba(255,255,255,.24)}
.cx__min svg{display:block}
/* recolher deslizando pro lado */
.cx--out{animation:cxOut .24s ease forwards}
@keyframes cxOut{to{opacity:0;transform:translateX(34px) scale(.98)}}

/* ===== TEASER — Ian aparece e comenta a seção que a pessoa lê ===== */
.cxteaser{position:fixed;right:20px;bottom:calc(20px + env(safe-area-inset-bottom));z-index:66;
  width:314px;max-width:calc(100vw - 40px);
  background:linear-gradient(158deg,var(--wa-header),var(--wa-green));
  border-radius:16px;border:1px solid rgba(255,255,255,.16);
  box-shadow:0 20px 52px rgba(10,60,40,.55);padding:14px 14px 14px 60px;cursor:pointer;transform-origin:bottom right}
.cxteaser__av{position:absolute;left:12px;top:14px;width:38px;height:38px;border-radius:50%;object-fit:cover;object-position:center top;border:2px solid rgba(255,255,255,.65)}
.cxteaser::after{content:"";position:absolute;left:41px;top:42px;width:11px;height:11px;border-radius:50%;background:#25d366;border:2px solid #0f6b4a;animation:dotPulse 2.4s ease-in-out infinite;z-index:2;pointer-events:none}
.cxteaser__x{position:absolute;top:5px;right:7px;background:none;border:none;color:rgba(255,255,255,.72);font-size:.88rem;cursor:pointer;line-height:1;padding:5px}
.cxteaser__x:hover{color:#fff}
.cxteaser__body strong{font-family:var(--font-d,'Sora',sans-serif);font-size:.82rem;color:#eafff2;display:block;margin-bottom:2px}
.cxteaser__msg{font-size:.9rem;line-height:1.42;color:#fff;margin-bottom:7px}
.cxteaser__cta{font-family:var(--font-d,'Sora',sans-serif);font-size:.8rem;font-weight:700;color:#c8f7dd}
.cxteaser[hidden]{display:none}
.cxteaser--in{animation:cxTeaserIn .44s cubic-bezier(.2,.72,.3,1.06)}
.cxteaser--out{animation:cxTeaserOut .36s cubic-bezier(.4,0,.5,.5) forwards}
/* mesmo efeito gênio: nasce da bolinha do canto */
@keyframes cxTeaserIn{0%{opacity:0;transform:scale(.18) translate(22px,18px)}55%{opacity:1}100%{opacity:1;transform:none}}
@keyframes cxTeaserOut{to{opacity:0;transform:scale(.18) translate(22px,18px)}}

/* ===== IDENTIFICAÇÃO — perguntas acolhedoras (na página) ===== */
.ident{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;max-width:940px;margin:0 auto}
@media(max-width:640px){.ident{grid-template-columns:1fr}}
.ident .qc{display:flex;gap:15px;align-items:flex-start;background:var(--card,#fff);border:1px solid var(--line,#e3e7ec);border-radius:16px;padding:24px 26px;box-shadow:var(--shadow);transition:transform .2s var(--ease,ease),box-shadow .2s,border-color .2s}
.ident .qc:hover{transform:translateY(-3px);border-color:var(--accent,#2f5fb0);box-shadow:var(--shadow-lg)}
.ident .qc__ic{flex:none;width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,#eaf1ff,#d8e6fb);display:grid;place-items:center;box-shadow:inset 0 0 0 1px rgba(47,95,176,.22)}
.ident .qc__ic svg{width:23px;height:23px;color:var(--accent,#2f5fb0);stroke:var(--accent,#2f5fb0)}
.ident .qc h4{font-family:var(--font-d,'Sora',sans-serif);font-weight:700;font-size:1.1rem;color:var(--ink,#11151c);margin-bottom:6px;letter-spacing:-.01em;line-height:1.2}
.ident .qc p{color:var(--ink2,#39424f);font-size:.95rem;line-height:1.55}

/* nav fica SÓ no topo — não gruda na rolagem (libera tela pro conteúdo + chat) */
.nav{position:absolute !important}

/* ===== CONTENÇÃO DE OVERFLOW HORIZONTAL (a página escorregava pro lado no mobile) ===== */
html,body{overflow-x:hidden;max-width:100%}
.hero,.sec,#oque-iago{overflow-x:clip}
.iago-stage{overflow:hidden}          /* as órbitas giratórias estouravam a lateral */
@media(max-width:520px){
  .nav .links .btn.primary{display:none}   /* o launcher do Ian já dá acesso ao chat */
  .dockx{right:12px}
  .cxteaser{right:12px;left:12px;width:auto;max-width:none}
  .hero .inner{padding-right:6px}
}

/* ===== Fundos de imagem cinematográficos (Higgsfield) nas faixas escuras ===== */
#capacidades.band{
  background:linear-gradient(rgba(6,10,16,.9),rgba(6,10,16,.87)),url(/assets/img/bg-office.webp) center/cover no-repeat;
}
#planos.band{
  background:linear-gradient(rgba(6,10,16,.9),rgba(6,10,16,.93)),url(/assets/img/bg-abstract.webp) center/cover no-repeat;
}
.cta-band{
  background:linear-gradient(rgba(6,10,16,.8),rgba(6,10,16,.9)),url(/assets/img/bg-desk.webp) center/cover no-repeat !important;
}

/* ===== Seção "quem é o Dr. IAgo": menos espaço vazio em cima da foto ===== */
#oque-iago{padding-top:clamp(2rem,4vw,3rem)}
.iago-stage{min-height:380px}
@media(max-width:880px){
  .iago-stage{min-height:294px}
  .iago-intro{gap:1.4rem}
  #oque-iago{padding-top:1.4rem}
}

/* ===== Seção "Juntos": iconezinho nos labels (WhatsApp / app) ===== */
.jcard .k{display:inline-flex;align-items:center;gap:6px}
.jcard .k__ic{width:14px;height:14px;flex:none}
.jcard--iago .k__ic{color:#25835b}
.jcard--escriba .k__ic{color:#2f5fb0}

/* ===== Seção Escriba: símbolo menor + menos espaço vazio ===== */
section.escriba{padding-top:clamp(2.8rem,6vw,4.2rem);padding-bottom:clamp(2.8rem,6vw,4.2rem)}
.escriba-grid{align-items:center;gap:clamp(1.4rem,3vw,2.6rem)}
.escriba-art{min-height:auto;padding:4px 0}
.escriba-art img{max-width:296px;filter:drop-shadow(0 22px 42px rgba(43,76,126,.20))}
.escriba-p{margin:14px 0 16px}
.escriba-list{gap:9px;margin-bottom:18px}

/* destaque do card do plano quando o Ian rola até ele */
.plan.plan-flash{animation:planFlash 1.9s ease}
@keyframes planFlash{0%,100%{box-shadow:0 0 0 0 rgba(47,95,176,0)}22%{box-shadow:0 0 0 3px var(--accent,#2f5fb0),0 18px 44px rgba(47,95,176,.42)}}

/* FAQ: a resposta desliza suave ao abrir (motion) */
.faq__i[open] > p{animation:faqSlide .36s cubic-bezier(.2,.7,.3,1) both}
@keyframes faqSlide{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}

@media(prefers-reduced-motion:reduce){.cx,.cxm,.cxchip,.cxoffer,.cxteaser,.cx--out,.cx--fade,.faq__i[open] > p,.dockx__av::after,.cx__av::after,.cxteaser::after{animation:none}}
