/* ═══════════════════════════════════════════
   HOME — capa, pacotes, galeria e rodapé
═══════════════════════════════════════════ */

.home-wrap{
  position:relative;z-index:2;
  width:100%;max-width:468px;margin:0 auto;
  padding:calc(var(--safe-t) + 8px) 22px calc(var(--safe-b) + 128px);
}

/* ── Capa: a faixa sangra até a borda da tela, não fica presa aos 468px do
   home-wrap. Mas a arte em si nunca passa do tamanho original (851×315): daí
   para cima ela ficaria borrada. O fundo da faixa é o mesmo branco do fundo
   da arte, então em tela grande a emenda não aparece — parece uma capa só,
   sem esticar e sem cortar os desenhos das pontas. ── */
.hero-banner{
  width:100vw;margin-left:calc(50% - 50vw);
  margin-top:calc(-1 * (var(--safe-t) + 8px));
  line-height:0;overflow:hidden;
  background:#fff;
  display:flex;justify-content:center;
}
.hero-banner img{width:100%;max-width:851px;height:auto;display:block}

/* ── Marca: avatar sobreposto à capa + nome ── */
.hdr{
  position:relative;z-index:1;
  display:flex;flex-direction:column;align-items:center;text-align:center;
  /* -40px: a capa nova é mais baixa e tem o nome centralizado, então o avatar
     sobe menos para não encostar em "PSICÓLOGA CLÍNICA". */
  gap:5px;padding:0 0 24px;margin-top:-40px;animation:fadeD .6s ease both;
}
.avatar-shell{position:relative;width:100px;height:100px;margin-bottom:16px}
.avatar-ring{
  position:absolute;inset:-7px;border-radius:50%;
  border:1px solid var(--sage-300);
}
.avatar-ring::before{
  content:'';position:absolute;inset:-7px;border-radius:50%;
  border:1px solid var(--line-soft);
}
.avatar-inner{
  width:100%;height:100%;border-radius:50%;overflow:hidden;
  background:#fff;border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;
  box-shadow:var(--shadow-md);
  font-family:var(--ff-display);font-size:36px;font-style:italic;color:var(--sage-700);
}
.avatar-inner img{width:100%;height:100%;object-fit:cover}
.cname{font-family:var(--ff-display);font-size:34px;line-height:1.08;font-weight:500;color:var(--ink)}
.ctag{
  font-family:var(--ff-mono);font-size:9px;letter-spacing:.24em;
  text-transform:uppercase;color:var(--sage-600);margin-top:4px;
}
.csub{font-size:13px;color:var(--dim);margin-top:2px}

/* ── Capa: texto ── */
.hero-text{padding:6px 2px 0;display:flex;flex-direction:column;gap:14px;align-items:center;text-align:center;animation:fadeU .7s ease both}
.hero-bio{font-size:15.5px;line-height:1.72;color:var(--ink-2);text-wrap:pretty}
.badges{display:flex;flex-wrap:wrap;gap:7px;padding-top:2px;justify-content:center}

/* ── Pilares (públicos atendidos) ── */
.pilares{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;
  margin-top:22px;background:var(--line-soft);
  border:1px solid var(--line-soft);border-radius:var(--r-md);overflow:hidden;
}
.pil{background:rgba(255,255,255,.78);padding:15px 6px;text-align:center;min-width:0}
.pil-v{
  font-family:var(--ff-display);font-size:19px;font-weight:500;color:var(--sage-700);
  line-height:1.15;word-break:break-word;
}
.pil-l{font-family:var(--ff-mono);font-size:8px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-top:6px}

/* ── CTA principal ── */
.hero-cta{margin-top:22px}

/* ── Diferenciais ── */
.diffs{margin-top:11px;display:flex;flex-direction:column;gap:9px}
.diff{
  display:flex;align-items:center;gap:12px;
  background:rgba(255,255,255,.8);border:1px solid var(--line);
  border-radius:var(--r-md);padding:13px 16px;
}
.diff-ico{font-size:16px;flex-shrink:0}
.diff-txt{font-size:13.5px;color:var(--ink-2)}

/* ── Cards de link ── */
.links{margin-top:22px;display:flex;flex-direction:column;gap:9px}
.lcard{
  position:relative;overflow:hidden;cursor:pointer;
  display:flex;align-items:center;gap:14px;
  background:rgba(255,255,255,.84);border:1px solid var(--line);
  border-radius:var(--r-md);padding:14px 16px;
  transition:border-color .2s,background .2s,transform .15s;
}
.lcard:active{transform:scale(.99)}
@media(hover:hover){.lcard:hover{border-color:var(--clay-500);background:#fff}}
.cico{
  width:42px;height:42px;flex-shrink:0;border-radius:12px;overflow:hidden;
  display:flex;align-items:center;justify-content:center;font-size:17px;
  background:var(--sage-100);border:1px solid var(--line-soft);
}
.cico svg{width:21px;height:21px}
.cico img{width:100%;height:100%;object-fit:cover}
.cico.mono{font-family:var(--ff-display);font-size:18px;font-weight:600;color:var(--sage-700)}
.ctxt{flex:1;min-width:0}
.ct{font-size:15px;font-weight:400;color:var(--ink)}
.cs{font-size:12px;color:var(--dim);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.carr{font-size:14px;color:var(--clay-500);flex-shrink:0}

/* ── Legenda abaixo dos carrosséis ── */
.gal-hint{
  font-family:var(--ff-mono);font-size:8px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--sage-400);text-align:center;padding-bottom:2px;
}

/* ── Visualizador em tela cheia ── */
.lb{
  position:fixed;inset:0;z-index:60;display:none;
  align-items:center;justify-content:center;padding:22px;
  background:rgba(24,30,22,.9);backdrop-filter:blur(8px);
  animation:lb-in .2s ease;
}
.lb.open{display:flex}
.lb-stage{max-width:100%;max-height:100%;display:flex}
.lb-stage img{
  max-width:100%;width:auto;height:auto;
  max-height:calc(100vh - 44px);
  max-height:calc(100dvh - 44px);   /* respeita a barra do navegador no celular */
  border-radius:var(--r-md);box-shadow:var(--shadow-lg);
}
.lb-close{
  position:absolute;top:calc(var(--safe-t) + 12px);right:16px;
  width:38px;height:38px;border-radius:50%;font-size:22px;line-height:1;
  background:rgba(255,255,255,.14);color:#F8FBF5;
  display:flex;align-items:center;justify-content:center;
}
@keyframes lb-in{from{opacity:0}to{opacity:1}}

/* ── Rodapé ── */
.foot{padding:40px 0 0;display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}
.foot-logo{width:180px;max-width:60%;height:auto;opacity:.9}
.ft{font-size:12.5px;line-height:1.9;color:var(--dim)}
.ft a{color:var(--clay-600)}
.fb{font-family:var(--ff-mono);font-size:8px;letter-spacing:.24em;text-transform:uppercase;color:var(--sage-400);margin-top:6px}
.fb-autor{font-family:var(--ff-mono);font-size:8px;letter-spacing:.2em;text-transform:uppercase;color:var(--sage-400);opacity:.75}

/* ── FABs ── */
.fabs{
  position:fixed;right:0;bottom:calc(var(--safe-b) + 20px);z-index:30;
  display:flex;align-items:center;gap:10px;
  padding-right:22px;pointer-events:none;transition:opacity .3s;
}
.fab-ai,.fab-wa{pointer-events:auto}
.fab-ai{
  display:flex;align-items:center;gap:7px;flex-shrink:0;
  padding:11px 16px 11px 13px;border-radius:999px;white-space:nowrap;
  background:rgba(46,58,43,.92);color:#F8FBF5;font-size:12.5px;
  box-shadow:var(--shadow-md);backdrop-filter:blur(6px);
}
.fab-ai i{width:7px;height:7px;border-radius:50%;background:var(--clay-500);animation:bk 1.6s ease-in-out infinite}
.fab-wa{
  width:46px;height:46px;flex-shrink:0;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:#25D366;box-shadow:var(--shadow-md);
  font-size:0;   /* botão é só ícone — evita texto vazando do círculo */
}
.fab-wa svg{width:22px;height:22px;fill:#fff}