/* ============ PALETAS ============ */
/* bg = fundo · alt = faixas · ink = texto · brand = hero e final · acc = destaque sobre brand · on-acc = texto sobre acc */
.p-ameixa  {--bg:#FAF6F8;--alt:#F1E4EC;--ink:#2B1626;--brand:#4B2142;--acc:#EDB9D8;--on-acc:#4B2142}
.p-oceano  {--bg:#F5F8F7;--alt:#E1EDEA;--ink:#12292B;--brand:#0F3D40;--acc:#9FE0CF;--on-acc:#0F3D40}
.p-floresta{--bg:#F6F7F2;--alt:#E6EADB;--ink:#1B2619;--brand:#24402B;--acc:#D5E88A;--on-acc:#24402B}
.p-indigo  {--bg:#F6F6FB;--alt:#E6E7F7;--ink:#1A1B33;--brand:#2B2F77;--acc:#C9CBFF;--on-acc:#2B2F77}
.p-grafite {--bg:#F7F6F3;--alt:#ECEAE4;--ink:#1E1E1C;--brand:#232321;--acc:#F2B544;--on-acc:#232321}
.p-cobalto {--bg:#F7F8FC;--alt:#E8EEFB;--ink:#0E1A33;--brand:#1546C9;--acc:#FFD84D;--on-acc:#0E1A33}
/* cores do cliente: troque os 5 valores */
.p-marca   {--bg:#FCF8F9;--alt:#F7E8EE;--ink:#2A1D22;--brand:#541C32;--acc:#F4B8CF;--on-acc:#2A1D22}

/* ============ FONTES ============ */
.f-grotesca {--f-d:"Bricolage Grotesque",system-ui,sans-serif;--f-b:"Instrument Sans",system-ui,sans-serif;--w-d:600;--ls-d:-.025em}
.f-serifada {--f-d:"Newsreader",Georgia,serif;--f-b:"Familjen Grotesk",system-ui,sans-serif;--w-d:400;--ls-d:-.015em}
.f-humanista{--f-d:"Albert Sans",system-ui,sans-serif;--f-b:"Albert Sans",system-ui,sans-serif;--w-d:600;--ls-d:-.025em}

/* ============ BASE ============ */
:root{
  --on-brand:var(--bg);
  --ink2:color-mix(in oklab,var(--ink) 70%,var(--bg));
  --line:color-mix(in oklab,var(--ink) 14%,var(--bg));
  --on-brand2:color-mix(in oklab,var(--on-brand) 78%,var(--brand));
  --brand2:color-mix(in oklab,var(--on-brand) 9%,var(--brand));
  --linha-brand:color-mix(in oklab,var(--on-brand) 20%,var(--brand));
  --r:20px;--rb:12px;
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:80px;--s9:120px;
  --t-sm:.9375rem;--t-md:1.0625rem;--t-lg:1.25rem;
  --t-xl:clamp(1.35rem,2.2vw,1.75rem);
  --t-2xl:clamp(2rem,4vw,3.25rem);
  --t-hero:clamp(2.5rem,6vw,5rem);
  --t-frase:clamp(2rem,5.2vw,4.25rem);
  --ease:cubic-bezier(.2,.7,.2,1);
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scrollbar-color:color-mix(in oklab,var(--ink) 30%,var(--bg)) var(--bg)}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--f-b);font-size:var(--t-md);line-height:1.6;-webkit-font-smoothing:antialiased}
::selection{background:var(--acc);color:var(--on-acc)}
.wrap{max-width:1160px;margin-inline:auto;padding-inline:max(20px,env(safe-area-inset-left,0px))}
h1,h2,h3{font-family:var(--f-d);font-weight:var(--w-d);letter-spacing:var(--ls-d);line-height:1.06;margin:0;text-wrap:balance;overflow-wrap:break-word}
p{margin:0}
a{color:inherit;text-underline-offset:3px}
:focus-visible{outline:2px solid currentColor;outline-offset:3px;border-radius:6px}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pular{position:absolute;left:-9999px;top:0;z-index:100;padding:12px 18px;background:var(--bg);color:var(--brand);font-weight:600;border-radius:0 0 var(--rb) 0}
.pular:focus{left:0}
.ico{width:24px;height:24px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

/* botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:15px 24px;border-radius:999px;font-family:var(--f-b);font-weight:600;font-size:var(--t-sm);text-decoration:none;border:0;cursor:pointer;transition:transform .25s var(--ease),background .25s,color .25s}
.btn .ico{width:20px;height:20px;stroke-width:1.8}
.zap{fill:currentColor;stroke:none}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:none}
.btn-acc{background:var(--acc);color:var(--on-acc)}
.btn-acc:hover{background:color-mix(in oklab,var(--acc) 82%,var(--on-brand))}
.btn-brand{background:var(--brand);color:var(--on-brand)}
.btn-brand:hover{background:var(--brand2)}

/* ============ SEÇÃO topo · começa ============ */
.on-brand{background:var(--brand);color:var(--on-brand)}
.topo .wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--s5);padding-block:var(--s5)}
.marca{display:inline-flex;align-items:center;gap:12px;text-decoration:none;font-family:var(--f-d);font-weight:var(--w-d);font-size:1.25rem;letter-spacing:var(--ls-d);line-height:1}
.marca .mono{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--acc);color:var(--on-acc);font-size:.9rem;letter-spacing:0}
.topo nav{display:flex;align-items:center;gap:var(--s6);font-size:var(--t-sm)}
.topo nav a:not(.btn){text-decoration:none;color:var(--on-brand2);transition:color .2s}
.topo nav a:not(.btn):hover{color:var(--on-brand)}
.topo .btn{padding:11px 20px}
.topo-dir{display:flex;align-items:center;gap:var(--s6)}
.h-centro .topo .wrap{display:grid;grid-template-columns:1fr auto 1fr;gap:var(--s5)}
.h-centro .topo-dir{display:contents}
.h-centro .topo .btn{justify-self:end}
.h-minimo .topo nav{display:none}
/* ============ SEÇÃO topo · termina ============ */

/* ============ SEÇÃO hero · começa ============ */
.hero{min-height:calc(100vh - var(--topo-h,96px));min-height:calc(100svh - var(--topo-h,96px));display:flex;align-items:center;padding-block:var(--s7);position:relative;overflow:clip}
.hero > .wrap{width:100%}
.hero::before{content:"";position:absolute;right:-12vw;top:-18vw;width:46vw;height:46vw;border-radius:50%;background:color-mix(in oklab,var(--acc) 10%,var(--brand));pointer-events:none}
.hero .wrap{position:relative;display:grid;grid-template-columns:1.15fr .85fr;gap:var(--s8);align-items:center}
.hero-txt{display:flex;flex-direction:column;gap:var(--s5);min-width:0}
.hero h1{font-size:var(--t-hero);line-height:1.02}
.hero h1 em{font-style:normal;color:var(--acc)}
.hero .sub{font-size:var(--t-lg);line-height:1.5;color:var(--on-brand2);max-width:36ch}
.hero-acao{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s4) var(--s5);margin-top:var(--s2)}
.hero-acao small{font-size:.8125rem;color:var(--on-brand2)}
.hero-lado{position:relative;min-width:0;justify-self:end;width:100%;max-width:420px}
.hero-foto{display:none;margin:0}
.hero-foto img,.hero-foto .vazia{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:var(--r);box-shadow:0 30px 50px -30px rgba(0,0,0,.55)}
.hero-foto .vazia{display:grid;place-items:center;background:var(--brand2);border:1.5px dashed var(--linha-brand);color:var(--on-brand2);font-size:var(--t-sm)}
.cartao{display:flex;flex-direction:column;gap:var(--s4);padding:var(--s5) var(--s6);border-radius:var(--r);background:var(--brand2);border:1px solid var(--linha-brand);font-size:var(--t-sm);min-width:0}
.cartao h2{font-size:var(--t-lg);color:var(--acc)}
.cartao ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--s4)}
.cartao li{display:flex;gap:var(--s3);align-items:flex-start;line-height:1.4}
.cartao li .ico{color:var(--acc);margin-top:1px}
/* layout: com foto */
.l-foto .hero-foto{display:block}
.l-foto .cartao{position:absolute;left:-36px;bottom:-30px;width:min(280px,80%);background:var(--bg);color:var(--ink);border-color:transparent;box-shadow:0 24px 40px -24px rgba(0,0,0,.5)}
.l-foto .cartao h2{display:none}
.l-foto .cartao li .ico{color:var(--brand)}
.l-foto .cartao li:nth-child(n+3){display:none}
/* layout: esquerda sem foto */
.l-esquerda .hero-lado{max-width:380px}
/* layout: centro */
.l-centro .hero .wrap{grid-template-columns:1fr;justify-items:center;text-align:center}
.l-centro .hero-txt{align-items:center}
.l-centro .hero h1{max-width:16ch}
.l-centro .hero .sub{margin-inline:auto}
.l-centro .hero-acao{justify-content:center}
.l-centro .hero-lado{display:none}
.l-centro .hero{padding-block:var(--s8) calc(var(--s9) + 20px)}
.l-centro .hero::before{right:auto;left:50%;top:auto;bottom:-32vw;width:60vw;height:60vw;transform:translateX(-50%)}
/* ============ SEÇÃO hero · termina ============ */

/* ============ SEÇÃO frase · começa ============ */
.frase{padding-block:var(--s9);text-align:center}
.frase .wrap{display:flex;flex-direction:column;align-items:center;gap:var(--s6)}
.frase h2{font-size:var(--t-frase);max-width:18ch;line-height:1.04}
.frase h2 .p{color:color-mix(in oklab,var(--ink) 40%,var(--bg));transition:color .4s ease}
.frase h2 .p.acesa{color:var(--ink)}
.frase p{font-size:var(--t-lg);color:var(--ink2);max-width:42ch}
/* ============ SEÇÃO frase · termina ============ */

/* títulos de seção */
.cabeca{display:flex;flex-direction:column;gap:var(--s3);margin-bottom:var(--s7)}
.cabeca h2{font-size:var(--t-2xl);max-width:20ch}
.cabeca p{color:var(--ink2);font-size:var(--t-lg);max-width:46ch}

/* ============ SEÇÃO temas · começa ============ */
.temas{padding-block:var(--s9);background:var(--alt);position:relative}
.temas .wrap{position:relative}
.temas-lista{list-style:none;margin:0;padding:0}
.tema{display:grid;grid-template-columns:1fr 1.05fr;gap:var(--s6);align-items:baseline;padding:var(--s5) var(--s4);border-top:1px solid var(--line);transition:background .3s,padding .3s var(--ease)}
.tema:last-child{border-bottom:1px solid var(--line)}
.tema:hover{background:color-mix(in oklab,var(--bg) 55%,var(--alt));padding-left:var(--s5)}
.tema h3{font-size:var(--t-xl)}
.tema p{color:var(--ink2);font-size:var(--t-md);max-width:44ch}
/* ============ SEÇÃO temas · termina ============ */

/* ============ SEÇÃO sobre · começa ============ */
.sobre{padding-block:var(--s9)}
.sobre .wrap{display:grid;grid-template-columns:.85fr 1.15fr;gap:var(--s8);align-items:center}
.sobre .wrap:not(:has(figure)){grid-template-columns:1fr;max-width:820px}
.sobre figure{margin:0;min-width:0}
.sobre figure img,.sobre figure .vazia{display:block;width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:var(--r)}
.sobre figure .vazia{display:grid;place-items:center;background:var(--alt);color:var(--ink2);border:1.5px dashed var(--line);font-size:var(--t-sm)}
.sobre-txt{display:flex;flex-direction:column;gap:var(--s5);min-width:0}
.sobre-txt h2{font-size:var(--t-2xl);max-width:18ch}
.sobre-txt > p{font-size:var(--t-lg);line-height:1.55;color:var(--ink2);max-width:42ch}
.formacao{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--s3);font-size:var(--t-md);color:var(--ink)}
.formacao li{display:flex;gap:var(--s3);align-items:baseline}
.formacao li::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--brand);flex:none;transform:translateY(-1px)}
.sobre-txt .btn{align-self:flex-start;margin-top:var(--s2)}
/* ============ SEÇÃO sobre · termina ============ */

/* ============ SEÇÃO depoimentos · começa (NÃO usar para psicologia, nutrição, advocacia: vedado pelos conselhos) ============ */
.depo{padding-block:var(--s9);background:var(--brand);color:var(--on-brand)}
.depo .wrap{display:grid;grid-template-columns:1.3fr 1fr;gap:var(--s8);align-items:start}
.depo blockquote{margin:0;display:flex;flex-direction:column;gap:var(--s5)}
.depo .grande{font-family:var(--f-d);font-weight:var(--w-d);letter-spacing:var(--ls-d);font-size:clamp(1.6rem,3.2vw,2.5rem);line-height:1.15;text-wrap:balance}
.depo cite{font-style:normal;font-size:var(--t-sm);color:var(--on-brand2)}
.depo .outros{display:flex;flex-direction:column;gap:var(--s6)}
.depo .outros blockquote{padding-top:var(--s5);border-top:1px solid var(--linha-brand);gap:var(--s3)}
.depo .outros p{font-size:var(--t-md);color:var(--on-brand)}
/* ============ SEÇÃO depoimentos · termina ============ */

/* ============ SEÇÃO passos · começa ============ */
.passos-sec{padding-block:var(--s9)}
.passos{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s7)}
.passo{display:flex;flex-direction:column;gap:var(--s4);position:relative;min-width:0}
.passo .no{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--acc);color:var(--on-acc);position:relative;z-index:1}
.passo .no .ico{width:28px;height:28px}
.passo::after{content:"";position:absolute;top:32px;left:72px;right:calc(var(--s7) * -1 + 8px);height:0;border-top:1.5px dashed color-mix(in oklab,var(--ink) 30%,var(--bg))}
.passo:last-child::after{display:none}
.passo h3{font-size:var(--t-xl)}
.passo p{color:var(--ink2);font-size:var(--t-md);max-width:34ch}
/* ============ SEÇÃO passos · termina ============ */

/* ============ SEÇÃO onde · começa ============ */
.onde{padding-bottom:var(--s9)}
.painel{display:grid;grid-template-columns:1fr 1fr;border-radius:var(--r);background:var(--alt);overflow:clip}
.local{display:flex;flex-direction:column;gap:var(--s3);padding:var(--s7) var(--s7);min-width:0}
.local + .local{border-left:1px solid var(--line)}
.local .ico{width:32px;height:32px;color:var(--brand);margin-bottom:var(--s2)}
.local h3{font-size:var(--t-xl)}
.local p{color:var(--ink2);max-width:40ch}
.local a{font-weight:600;color:var(--brand);margin-top:var(--s2);display:inline-flex;gap:8px;align-items:center}
/* ============ SEÇÃO onde · termina ============ */

/* ============ SEÇÃO duvidas · começa ============ */
.faq{padding-bottom:var(--s9)}
.faq .wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:var(--s7)}
.faq-txt{display:flex;flex-direction:column;gap:var(--s3)}
.faq h2{font-size:var(--t-2xl)}
.faq-txt p{color:var(--ink2)}
.faq-txt a{font-weight:600}
.perguntas{min-width:0}
details{border-top:1px solid var(--line)}
details:last-child{border-bottom:1px solid var(--line)}
summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:var(--s4);padding-block:var(--s5);font-family:var(--f-d);font-weight:var(--w-d);letter-spacing:var(--ls-d);font-size:var(--t-lg);line-height:1.2}
summary::-webkit-details-marker{display:none}
summary::after{content:"";width:12px;height:12px;flex:none;border-right:2px solid var(--brand);border-bottom:2px solid var(--brand);transform:rotate(45deg) translate(-3px,-3px);transition:transform .3s var(--ease)}
details[open] summary::after{transform:rotate(-135deg)}
details p{padding-bottom:var(--s5);color:var(--ink2);max-width:58ch}
/* ============ SEÇÃO duvidas · termina ============ */

/* ============ SEÇÃO aviso · começa (texto muda por profissão, ver INSTRUCOES.md) ============ */
.aviso{padding-bottom:var(--s8)}
.aviso p{background:var(--alt);border-radius:var(--r);padding:var(--s5) var(--s6);font-size:var(--t-sm);line-height:1.55}
.aviso strong{display:block;font-family:var(--f-d);font-weight:var(--w-d);font-size:var(--t-lg);letter-spacing:var(--ls-d);margin-bottom:var(--s2)}
.aviso a{font-weight:600;color:var(--brand)}
/* ============ SEÇÃO aviso · termina ============ */

/* ============ SEÇÃO final · começa ============ */
.final{padding-block:var(--s9);text-align:center}
.final .wrap{display:flex;flex-direction:column;align-items:center;gap:var(--s5)}
.final h2{font-size:var(--t-2xl);max-width:22ch}
.final h2 em{font-style:normal;color:var(--acc)}
.final p{color:var(--on-brand2);max-width:42ch}
.final .btn{margin-top:var(--s3)}
.contatos{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--s3) var(--s6);margin-top:var(--s3);font-size:var(--t-sm)}
.contatos a{display:inline-flex;align-items:center;gap:8px;color:var(--on-brand2);text-decoration:none;padding-block:6px;transition:color .2s}
.contatos a:hover{color:var(--on-brand)}
.contatos .ico{width:18px;height:18px}
/* ============ SEÇÃO final · termina ============ */

/* ============ SEÇÃO rodape · começa ============ */
footer{font-size:var(--t-sm);padding-bottom:var(--s7)}
footer .linha{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--s3) var(--s6);border-top:1px solid var(--linha-brand);padding-top:var(--s5)}
footer .marca{font-size:1.05rem}
footer .marca .mono{width:30px;height:30px;font-size:.75rem}
footer a:not(.marca){color:var(--on-brand2);text-decoration:none;padding-block:6px}
footer a:not(.marca):hover{color:var(--on-brand)}
footer .assina span{color:var(--acc);margin-right:6px}
/* ============ SEÇÃO rodape · termina ============ */

.fixo{display:none}

@media (max-width:860px){
  :root{--s8:56px;--s9:80px}
  .topo nav{display:none}
  .h-centro .topo .wrap{grid-template-columns:1fr auto}
  .hero .wrap,.sobre .wrap,.faq .wrap,.depo .wrap{grid-template-columns:1fr;gap:var(--s7)}
  .hero{padding-block:var(--s6) var(--s8)}
  .hero-txt{align-items:center;text-align:center}
  .hero .sub{margin-inline:auto}
  .hero-acao{justify-content:center}
  .hero-lado{justify-self:center;max-width:min(100%,24rem)}
  .l-foto .hero-lado{margin-bottom:var(--s6)}
  .l-foto .cartao{left:var(--s4);right:var(--s4);bottom:-28px;width:auto}
  .l-foto .hero-foto img,.l-foto .hero-foto .vazia{aspect-ratio:auto;height:clamp(180px,30svh,300px)}
  .tema{grid-template-columns:1fr;gap:var(--s2);padding-inline:0}
  .tema:hover{padding-left:0}
  .passos{grid-template-columns:1fr;gap:var(--s6);max-width:520px}
  .passo{flex-direction:row;flex-wrap:wrap;column-gap:var(--s4);align-items:center}
  .passo .no{width:52px;height:52px}
  .passo h3{flex:1}
  .passo p{flex-basis:100%;padding-left:calc(52px + var(--s4))}
  .passo::after{display:none}
  .painel{grid-template-columns:1fr}
  .local{padding:var(--s6)}
  .local + .local{border-left:0;border-top:1px solid var(--line)}
  .sobre figure img,.sobre figure .vazia{aspect-ratio:4/5;max-width:420px}
  footer{padding-bottom:calc(var(--s6) + env(safe-area-inset-bottom,0px))}
  .fixo{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:20;padding:var(--s3) max(16px,env(safe-area-inset-right,0px)) calc(var(--s3) + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));background:var(--bg);border-top:1px solid var(--line);box-shadow:0 -14px 28px -22px rgba(0,0,0,.45);transform:translateY(120%);opacity:0;pointer-events:none;transition:transform .35s var(--ease),opacity .25s}
  .fixo.visivel{transform:none;opacity:1;pointer-events:auto}
  .fixo .btn{flex:1}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition:none!important}
}
/* ============ COMPONENTES EXTRAS · bento · paraquem · galeria (+ ilustrações) ============ */
:root{--rc:20px;--c-bd:0;--c-sh:none;--cx-alt:var(--alt);--cx-ink2:var(--ink2);--cx-brand:var(--brand);--cx-on-brand:var(--on-brand)}
.il{width:64px;height:64px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.bento{padding-top:var(--s9)}
.cx-cabeca{display:flex;flex-direction:column;gap:var(--s3);margin-bottom:var(--s7)}
.cx-cabeca h2{font-size:var(--t-2xl);max-width:18ch}
.cx-cabeca p{color:var(--cx-ink2);font-size:var(--t-lg);max-width:46ch}
/* bento: cards de tamanhos e cores diferentes, com ilustração */
.bento{padding-bottom:var(--s9)}
.bento-grade{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--s4)}
.cx-card{position:relative;overflow:hidden;display:flex;flex-direction:column;gap:var(--s3);padding:var(--s6);border-radius:var(--rc);border:var(--c-bd);box-shadow:var(--c-sh);background:var(--cx-alt);color:var(--ink);min-width:0;--cheio:color-mix(in oklab,var(--acc) 75%,var(--cx-brand))}
.cx-card h3{font-size:var(--t-xl)}
.cx-card p{opacity:.85;max-width:34ch}
.cx-card .il{margin-bottom:var(--s3)}
.cx-card.grande{grid-column:span 3;grid-row:span 2;background:var(--cx-brand);color:var(--cx-on-brand);justify-content:flex-end;min-height:360px;--cheio:var(--acc)}
.cx-card.grande .il{width:132px;height:132px;margin-bottom:auto}
.cx-card.grande h3{font-size:var(--t-2xl);max-width:12ch}
.cx-card.medio{grid-column:span 3}
.cx-card.peq{grid-column:span 2}
.cx-card.acc{background:var(--acc);color:var(--on-acc);--cheio:var(--bg)}
/* para quem é: dois cards com ilustração recortada no canto */
.paraquem{padding-bottom:var(--s9)}
.pq-grade{display:grid;grid-template-columns:1fr 1fr;gap:var(--s5)}
.pq-card{position:relative;overflow:hidden;padding:var(--s7) var(--s6);border-radius:var(--rc);border:var(--c-bd);box-shadow:var(--c-sh);display:flex;flex-direction:column;gap:var(--s5);min-width:0}
.pq-card.sim{background:var(--cx-alt);color:var(--ink)}
.pq-card.nao{background:var(--cx-brand);color:var(--cx-on-brand)}
.pq-card h3{font-size:var(--t-xl);position:relative;z-index:1}
.pq-card ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--s4);position:relative;z-index:1}
.pq-card li{display:flex;gap:var(--s3);align-items:flex-start;line-height:1.45}
.pq-card li::before{content:"";flex:none;width:22px;height:22px;margin-top:1px;background:currentColor;-webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='12' r='10.5' fill='none' stroke='black' stroke-width='1.6'/><path d='M7.5 12.5l3 3 6-6.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/></svg>") center/contain no-repeat;mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><circle cx='12' cy='12' r='10.5' fill='none' stroke='black' stroke-width='1.6'/><path d='M7.5 12.5l3 3 6-6.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/></svg>") center/contain no-repeat}
.pq-card .il.canto{position:absolute;right:-22px;bottom:-22px;width:170px;height:170px;opacity:.16;stroke-width:1.4}
/* galeria: mosaico do espaço (troque os .vazia por <img>) */
.galeria{padding-bottom:var(--s9)}
.gal-grade{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:190px;gap:var(--s4)}
.gal-grade figure{margin:0;position:relative;overflow:hidden;border-radius:var(--rc);border:var(--c-bd);box-shadow:var(--c-sh);background:var(--cx-alt)}
.gal-grade figure:nth-child(1){grid-column:span 2;grid-row:span 2}
.gal-grade figure:nth-child(4){grid-column:span 2}
.gal-grade img{display:block;width:100%;height:100%;object-fit:cover}
.gal-grade .vazia{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--s2);color:var(--ink);font-size:var(--t-sm);text-align:center;--cheio:var(--acc)}
.gal-grade .vazia .il{width:60px;height:60px}
.gal-grade .vazia span{color:var(--cx-ink2)}
.gal-grade figcaption{position:absolute;left:var(--s3);bottom:var(--s3);margin:0;padding:6px 14px;border-radius:999px;border:0;background:var(--bg);color:var(--ink);font-size:.8125rem;font-weight:500;letter-spacing:0;text-transform:none}
@media (max-width:860px){
  .bento-grade{grid-template-columns:1fr}
  .cx-card.grande,.cx-card.medio,.cx-card.peq{grid-column:auto;grid-row:auto}
  .cx-card.grande{min-height:0;justify-content:flex-start}
  .cx-card.grande h3{font-size:var(--t-xl)}
  .pq-grade{grid-template-columns:1fr}
  .gal-grade{grid-template-columns:1fr 1fr;grid-auto-rows:150px}
  .gal-grade figure:nth-child(1){grid-column:span 2;grid-row:span 2}
  .gal-grade figure:nth-child(4){grid-column:span 2}
}
/* ============ VERSÕES: cards extras e ilustrações (ligar/desligar por classe no <body>) ============ */
body:not(.x-extras) .bento,body:not(.x-extras) .paraquem,body:not(.x-extras) .galeria{display:none}
.i-nao .il,.i-nao .sticker,.i-nao .solta,.i-nao .selo{display:none}
/* ILUSTRAÇÕES: um tamanho e um traço só (consistência). */
.il{width:56px!important;height:56px!important;stroke-width:1.75}
.sprite{position:absolute}
.painel.um{grid-template-columns:1fr}
.hero-foto img{height:auto;object-position:center 18%}
/* eixo tom · .on-brand.claro: o bloco usa fundo claro do matiz do cliente em vez da cor de marca escura */
.on-brand.claro{--on-brand:var(--ink);--on-brand2:color-mix(in oklab,var(--ink) 75%,transparent);--brand2:color-mix(in oklab,var(--acc) 22%,var(--bg));--linha-brand:color-mix(in oklab,var(--ink) 14%,transparent);background:color-mix(in oklab,var(--acc) 30%,var(--bg));color:var(--ink)}
.claro .btn-acc,.claro .marca .mono{background:var(--brand);color:var(--bg)}
.claro .btn-acc:hover{background:color-mix(in oklab,var(--on-brand) 9%,var(--brand))}
.claro .hero::before{background:color-mix(in oklab,var(--acc) 55%,var(--bg))}
/* blocos próprios da Eliane */
.cx-card a{margin-top:auto;padding-top:var(--s3);font-weight:600;color:inherit;text-decoration:underline;text-underline-offset:4px;align-self:flex-start}
.cx-card .il{color:inherit}
.antes-depois{padding-top:var(--s9)}
.antes-depois .gal-grade{grid-template-columns:repeat(4,1fr);grid-auto-rows:280px}
.antes-depois .gal-grade figure{grid-column:auto;grid-row:auto}
.sobre .citacao{font-family:var(--f-d);font-size:var(--t-lg);line-height:1.4;color:var(--ink);border-left:3px solid var(--acc);padding-left:var(--s5);max-width:48ch}
@media (max-width:860px){.antes-depois .gal-grade{grid-template-columns:1fr 1fr;grid-auto-rows:200px}.antes-depois .gal-grade figure{grid-column:auto!important;grid-row:auto!important}}
/* CTA em cartão suspenso */
.cta-sec{padding:var(--s8) 0 var(--s9)}
.cta-card{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--s5);padding:clamp(48px,7vw,96px) clamp(24px,5vw,80px);border-radius:32px;box-shadow:0 40px 80px -40px color-mix(in oklab,var(--brand) 70%,transparent)}
.cta-card::before{content:"";position:absolute;width:460px;height:460px;border-radius:50%;right:-140px;top:-200px;background:color-mix(in oklab,var(--acc) 20%,var(--brand));pointer-events:none}
.cta-card > *{position:relative}
.cta-card h2{font-size:var(--t-2xl);max-width:20ch}
.cta-card p{color:var(--on-brand2);max-width:42ch}
.cta-foto{width:84px;height:84px;border-radius:50%;object-fit:cover;object-position:center 18%;border:3px solid var(--acc)}
/* rodapé */
.rodape{background:radial-gradient(70% 140% at 50% 0%,color-mix(in oklab,var(--acc) 16%,var(--brand)),var(--brand));color:var(--bg);padding:var(--s8) 0 var(--s6);font-size:var(--t-md)}
.rod-grade{display:grid;grid-template-columns:1fr 1fr;gap:var(--s7)}
.rod-nome{font-family:var(--f-d);font-weight:600;font-size:1.75rem;letter-spacing:.01em;color:var(--bg)!important;text-decoration:none}
.rod-sub{display:block;margin-top:6px;font-size:.75rem;letter-spacing:.32em;text-transform:uppercase;color:color-mix(in oklab,var(--bg) 70%,transparent)}
.rod-marca p{margin-top:var(--s5);line-height:1.6}
.rod-info p{line-height:1.9}
.rodape a:not(.rod-nome){color:var(--bg);text-decoration:none;padding-block:4px}
.rodape a:not(.rod-nome):hover{color:var(--acc)}
.rod-aviso{margin-top:var(--s4);font-size:var(--t-sm);line-height:1.6!important;color:color-mix(in oklab,var(--bg) 68%,transparent);max-width:44ch}
.rod-base{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--s3);margin-top:var(--s7);padding-top:var(--s5);border-top:1px solid color-mix(in oklab,var(--bg) 16%,transparent);font-size:var(--t-sm);color:color-mix(in oklab,var(--bg) 70%,transparent)}
.rodape .assina span{color:var(--acc);margin-right:6px}
@media (max-width:860px){.rod-grade{grid-template-columns:1fr;gap:var(--s6)}.cta-sec{padding-top:var(--s6)}}
/* cartão do hero: cada item numa linha só */
.l-foto .cartao{width:auto;max-width:none}
.cartao li{white-space:nowrap;align-items:center}
.cartao li .ico{margin-top:0}
