/* =====================================================================
   DR. NILSON MARQUARDT FILHO — v5.2
   Mesma marca (escala grafite + aço, Playfair Display + Inter).
   O que muda: profundidade (aurora, grão, grelha), movimento e densidade.
   ---------------------------------------------------------------------
   01 Tokens        06 Hero            11 Pesquisa      16 Flutuantes
   (18 Responsivo)
   02 Reset         07 Queixas         12 Blog
   03 Tipografia    08 Tese            13 FAQ           17 Página interna
   04 Botões        09 Áreas           14 Conversão
   05 Cabeçalho     10 Como funciona   15 Rodapé
   ===================================================================== */

/* ============================== 01. TOKENS ========================== */
:root{
  /* escala grafite — brandbook, inalterada */
  --grafite:#4D535F;
  --grafite-claro:#5C6270;
  --grafite-esc:#3B414C;
  --grafite-prof:#2E333C;
  --grafite-noite:#1E2229;   /* extremo escuro derivado, para degradês */
  --tinta:#262B33;
  --chumbo:#464C55;
  --aco:#7E8C9E;          /* só filete, ícone e fundo de tag — nunca texto */
  --aco-txt:#63707F;      /* aço escurecido: o único legível como texto (AA) */

  --bg:#F8FAFC;
  --card:#FFFFFF;
  --wash:#EDEFF3;

  --ink:var(--tinta);
  --ink-2:var(--chumbo);
  --ink-3:#4E5661;
  --on-dark:#F1F3F7;
  --on-dark-2:#C7CFDA;
  --on-dark-3:#AAB4C1;

  --line:rgba(126,140,158,.22);
  --line-strong:rgba(126,140,158,.42);
  --line-dark:rgba(255,255,255,.14);
  --line-dark-2:rgba(255,255,255,.26);

  /* tipografia */
  --display:"Playfair Display",Georgia,"Times New Roman",serif;
  --sans:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;

  --fs-hero:clamp(1.875rem,1.05rem + 2.45vw,2.875rem);  /* 30 → 46 */
  --fs-h2:clamp(1.625rem,1rem + 1.8vw,2.375rem);   /* 26 → 38 */
  --fs-h3:clamp(1.1875rem,1.05rem + .5vw,1.4375rem);
  --fs-lead:clamp(1.0625rem,1rem + .35vw,1.25rem);
  --fs-body:1.0625rem;
  --fs-sm:.9375rem;
  --fs-micro:.75rem;

  --sp-1:8px;  --sp-2:16px; --sp-3:24px; --sp-4:32px; --sp-5:40px;
  --sp-6:48px; --sp-8:64px; --sp-10:80px; --sp-12:96px; --sp-14:112px;
  --secao:clamp(72px,7.5vw,124px);

  --container:1180px;
  --gutter:clamp(20px,4vw,32px);

  --r-sm:8px; --r-md:14px; --r-lg:20px; --r-xl:28px; --r-pill:999px;

  --sh-sm:0 1px 2px rgba(38,43,51,.05), 0 4px 16px rgba(38,43,51,.04);
  --sh-md:0 4px 14px rgba(38,43,51,.06), 0 18px 44px rgba(38,43,51,.07);
  --sh-lg:0 8px 24px rgba(38,43,51,.08), 0 34px 70px rgba(38,43,51,.12);
  --sh-xl:0 20px 50px rgba(38,43,51,.14), 0 50px 100px rgba(38,43,51,.16);

  --ease:cubic-bezier(.22,1,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --t:.32s var(--ease);
  --header-h:76px;

  /* textura de grão — ruído SVG usado como sobreposição */
  --grao:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='160' height='160' filter='url(%23n)' opacity='.42'/></svg>");
}

/* ============================== 02. RESET =========================== */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:var(--header-h)}
body{
  margin:0;background:var(--bg);color:var(--ink-2);
  font-family:var(--sans);font-size:var(--fs-body);line-height:1.65;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:clip;
}
img,svg,picture{max-width:100%;display:block}
/* os atributos width/height do HTML viram dica de apresentação e travam a
   altura, anulando o aspect-ratio. height:auto devolve o controle ao CSS. */
img{height:auto}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ul,ol{margin:0;padding:0;list-style:none}
p{margin:0 0 1em}
p:last-child{margin-bottom:0}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--grafite);outline-offset:3px;border-radius:6px}
::selection{background:rgba(126,140,158,.3);color:var(--tinta)}

.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{
  position:fixed;left:var(--gutter);top:-100px;z-index:300;
  background:var(--tinta);color:#fff;padding:12px 20px;border-radius:0 0 var(--r-sm) var(--r-sm);
  font-weight:600;transition:top .2s var(--ease);
}
.skip:focus{top:0}

.wrap{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter)}
.secao{position:relative;padding-block:var(--secao)}
.secao--curta{padding-block:clamp(56px,5.5vw,88px)}

/* --------- camadas decorativas reutilizáveis --------- */
.grao{
  position:absolute;inset:0;pointer-events:none;z-index:1;
  background-image:var(--grao);background-size:160px 160px;
  opacity:.28;mix-blend-mode:overlay;
}

/* grelha fina com desvanecimento nas bordas */
.grelha{
  position:absolute;inset:0;pointer-events:none;
  background-image:
    repeating-linear-gradient(90deg, rgba(126,140,158,.16) 0 1px, transparent 1px 96px),
    repeating-linear-gradient(0deg, rgba(126,140,158,.1) 0 1px, transparent 1px 96px);
  -webkit-mask-image:radial-gradient(80% 70% at 50% 40%, #000 20%, transparent 78%);
  mask-image:radial-gradient(80% 70% at 50% 40%, #000 20%, transparent 78%);
}

/* manchas de luz que derivam devagar */
.aurora{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.aurora i{
  position:absolute;display:block;border-radius:50%;
  filter:blur(90px);opacity:.5;will-change:transform;
  animation:deriva var(--dur,26s) var(--ease) infinite alternate;
  animation-delay:var(--delay,0s);
}
@keyframes deriva{
  0%  {transform:translate3d(0,0,0) scale(1)}
  50% {transform:translate3d(4%,-6%,0) scale(1.12)}
  100%{transform:translate3d(-5%,5%,0) scale(.94)}
}

/* tipografia fantasma de fundo */
.fantasma{
  position:absolute;font-family:var(--display);font-weight:600;
  line-height:.82;letter-spacing:-.04em;pointer-events:none;user-select:none;
  color:transparent;-webkit-text-stroke:1px rgba(126,140,158,.22);white-space:nowrap;
}

/* ---------------- entradas ---------------- */
.js .reveal{opacity:0;transform:translateY(22px);transition:opacity .8s var(--ease-out),transform .8s var(--ease-out);transition-delay:var(--d,0s)}
.js .reveal.is-in{opacity:1;transform:none}

/* revelação com máscara — para títulos e imagens */
.js .reveal--mask{opacity:0;clip-path:inset(0 0 102% 0);transform:translateY(14px);filter:blur(6px);
  transition:opacity .9s var(--ease-out),clip-path 1s var(--ease-out),transform 1s var(--ease-out),filter .9s var(--ease-out);
  transition-delay:var(--d,0s)}
.js .reveal--mask.is-in{opacity:1;clip-path:inset(0 0 -12% 0);transform:none;filter:none}

/* escalonamento dos filhos diretos — o contentor não anima, só os filhos */
.js .reveal.stagger{opacity:1;transform:none}
.js .stagger>*{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease-out),transform .7s var(--ease-out)}
.js .stagger.is-in>*{opacity:1;transform:none}
.js .stagger.is-in>*:nth-child(1){transition-delay:.04s}
.js .stagger.is-in>*:nth-child(2){transition-delay:.10s}
.js .stagger.is-in>*:nth-child(3){transition-delay:.16s}
.js .stagger.is-in>*:nth-child(4){transition-delay:.22s}
.js .stagger.is-in>*:nth-child(5){transition-delay:.28s}
.js .stagger.is-in>*:nth-child(6){transition-delay:.34s}
.js .stagger.is-in>*:nth-child(7){transition-delay:.40s}
.js .stagger.is-in>*:nth-child(8){transition-delay:.46s}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  html{scroll-behavior:auto}
  .reveal,.reveal--mask,.stagger>*,.hero__col>*{opacity:1!important;transform:none!important;clip-path:none!important;filter:none!important}
  .jornada::after{transform:translateX(-50%) scaleY(1)!important}
  .tese__fig img{transform:none!important}
  .aurora i{animation:none}
}

/* ============================ 03. TIPOGRAFIA ======================== */
h1,h2,h3,h4{font-family:var(--display);font-weight:600;color:var(--ink);margin:0 0 var(--sp-2);letter-spacing:-.018em;text-wrap:balance}
h1{font-size:var(--fs-hero);line-height:1.06;letter-spacing:-.03em}
h2{font-size:var(--fs-h2);line-height:1.15}
h3{font-size:var(--fs-h3);line-height:1.3}
h4{font-family:var(--sans);font-size:var(--fs-sm);font-weight:600;letter-spacing:0}

.olho{
  font-family:var(--sans);font-size:var(--fs-micro);font-weight:600;
  text-transform:uppercase;letter-spacing:.14em;color:var(--ink-2);
  margin:0 0 var(--sp-2);display:flex;align-items:flex-start;gap:10px;line-height:1.5;
}
.olho::before{content:"";width:26px;height:1px;background:var(--aco);flex:none;margin-top:.72em}
.olho--centro{justify-content:center}
.lead{font-size:var(--fs-lead);line-height:1.6;color:var(--ink-2);max-width:60ch}
.centro{text-align:center}
.centro .olho{justify-content:center}
.estreito{max-width:700px;margin-inline:auto}

/* ============================== 04. BOTÕES ========================== */
.btn{
  position:relative;overflow:hidden;isolation:isolate;
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-family:var(--sans);font-size:var(--fs-sm);font-weight:600;letter-spacing:.005em;
  padding:14px 26px;min-height:50px;border-radius:var(--r-pill);
  border:1px solid transparent;cursor:pointer;
  transition:background var(--t),color var(--t),border-color var(--t),transform .35s var(--ease-out),box-shadow var(--t);
  text-align:center;
}
.btn svg{width:16px;height:16px;flex:none;transition:transform var(--t)}
.btn:hover{transform:translateY(-2px)}
.btn:hover svg{transform:translate(2px,-2px)}
/* brilho que atravessa o botão no hover */
.btn::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(105deg,transparent 32%,rgba(255,255,255,.5) 50%,transparent 68%);
  transform:translateX(-130%);transition:transform .8s var(--ease-out);
}
.btn:hover::after{transform:translateX(130%)}

.btn--solido{background:var(--tinta);color:#fff;box-shadow:var(--sh-sm)}
.btn--solido:hover{background:var(--grafite);box-shadow:var(--sh-md)}
.btn--solido::after{background:linear-gradient(105deg,transparent 32%,rgba(255,255,255,.22) 50%,transparent 68%)}

/* primário sobre escuro — única peça branca sólida da página */
.btn--claro{background:#fff;color:var(--tinta);box-shadow:0 6px 24px rgba(0,0,0,.24)}
.btn--claro:hover{box-shadow:0 14px 40px rgba(0,0,0,.34)}
.btn--claro::after{background:linear-gradient(105deg,transparent 32%,rgba(38,43,51,.1) 50%,transparent 68%)}

.btn--linha{border-color:var(--line-strong);color:var(--tinta);background:transparent}
.btn--linha:hover{border-color:var(--tinta);background:rgba(38,43,51,.04)}
.btn--linha::after{background:linear-gradient(105deg,transparent 32%,rgba(38,43,51,.06) 50%,transparent 68%)}
.btn--linha-clara{border-color:var(--line-dark-2);color:var(--on-dark);background:transparent}
.btn--linha-clara:hover{border-color:#fff;background:rgba(255,255,255,.09)}

.btn--sm{min-height:42px;padding:10px 20px;font-size:.875rem}
.btn--lg{min-height:58px;padding:18px 32px;font-size:1rem}
.btn--bloco{display:flex;width:100%}

/* botão que acompanha o cursor (JS define --mx/--my) */
.magnetico{transform:translate(var(--mx,0px),var(--my,0px))}
.magnetico:hover{transform:translate(var(--mx,0px),calc(var(--my,0px) - 2px))}

/* link com seta */
.seta{
  position:relative;display:inline-flex;align-items:center;gap:8px;
  font-size:var(--fs-sm);font-weight:600;color:var(--tinta);padding-bottom:4px;
  transition:color var(--t),gap var(--t);
}
.seta::before{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--line-strong)}
.seta::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:0;background:var(--tinta);transition:width .45s var(--ease-out)}
.seta:hover{gap:13px}
.seta:hover::after{width:100%}
.seta svg{width:15px;height:15px;transition:transform var(--t)}
.seta:hover svg{transform:translate(3px,-3px)}
.seta--clara{color:var(--on-dark)}
.seta--clara::before{background:var(--line-dark-2)}
.seta--clara::after{background:#fff}
.seta--clara:hover{color:#fff}

/* ============================ 05. CABEÇALHO ========================= */
.cab{
  position:fixed;inset:0 0 auto;z-index:120;
  background:transparent;border-bottom:1px solid transparent;
  transition:background .4s var(--ease),border-color .4s var(--ease),backdrop-filter .4s var(--ease);
}
.cab.is-stuck{
  background:rgba(30,34,41,.82);backdrop-filter:saturate(170%) blur(16px);
  border-bottom-color:var(--line-dark);
}
/* barra de progresso da leitura */
.cab__progresso{
  position:absolute;left:0;bottom:-1px;height:2px;width:0;
  background:linear-gradient(90deg,var(--aco),#fff);opacity:0;transition:opacity .4s;
}
.cab.is-stuck .cab__progresso{opacity:.9}

.cab__inner{display:flex;align-items:center;gap:var(--sp-4);height:var(--header-h)}
.marca{flex:none;display:block;transition:transform var(--t)}
.marca:hover{transform:translateY(-1px)}
.marca img{height:38px;width:auto}

.nav{display:flex;align-items:center;gap:4px;margin-left:auto}
.nav__link{
  position:relative;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;
  padding:9px 14px;border-radius:var(--r-pill);
  font-size:var(--fs-sm);font-weight:500;color:var(--on-dark-2);
  transition:color var(--t),background var(--t);
}
.nav__link::after{
  content:"";position:absolute;left:14px;right:14px;bottom:5px;height:1px;
  background:currentColor;transform:scaleX(0);transform-origin:left;
  transition:transform .4s var(--ease-out);
}
.nav__link:hover::after{transform:scaleX(1)}
.nav__link:hover,.nav__link[aria-expanded="true"]{color:#fff;background:rgba(255,255,255,.09)}
.nav__link svg{width:9px;height:6px;transition:transform var(--t)}
.nav__link[aria-expanded="true"] svg{transform:rotate(180deg)}
.cab .btn{margin-left:var(--sp-2);white-space:nowrap}

.mega{
  position:absolute;left:0;right:0;top:100%;
  background:rgba(30,34,41,.96);backdrop-filter:blur(18px);
  border-top:1px solid var(--line-dark);border-bottom:1px solid var(--line-dark);
  opacity:0;visibility:hidden;transform:translateY(-10px);
  transition:opacity .3s var(--ease),transform .35s var(--ease-out),visibility .35s;
}
.mega.is-open{opacity:1;visibility:visible;transform:none}
.mega__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-5);padding-block:var(--sp-5)}
.mega__col h4{color:var(--on-dark-3);font-size:var(--fs-micro);text-transform:uppercase;letter-spacing:.14em;margin-bottom:var(--sp-2)}
.mega__col li+li{margin-top:2px}
.mega__col a{
  display:block;padding:7px 0;font-size:var(--fs-sm);color:var(--on-dark-2);
  transition:color var(--t),padding-left var(--t);
}
.mega.is-open .mega__col a{animation:megaEntra .5s var(--ease-out) backwards}
.mega.is-open .mega__col:nth-child(2) a{animation-delay:.05s}
.mega.is-open .mega__col:nth-child(3) a{animation-delay:.1s}
.mega.is-open .mega__col:nth-child(4) a{animation-delay:.15s}
@keyframes megaEntra{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.mega__col a:hover{color:#fff;padding-left:8px}

.burger{display:none;width:44px;height:44px;place-items:center;border-radius:var(--r-pill);color:#fff}
.burger span,.burger span::before,.burger span::after{
  content:"";display:block;width:20px;height:1.5px;background:currentColor;border-radius:2px;
  transition:transform var(--t),opacity var(--t);
}
.burger span::before{transform:translateY(-6px)}
.burger span::after{transform:translateY(4.5px)}
.burger[aria-expanded="true"] span{background:transparent}
.burger[aria-expanded="true"] span::before{transform:rotate(45deg)}
.burger[aria-expanded="true"] span::after{transform:translateY(-1.5px) rotate(-45deg)}

.gaveta{
  position:fixed;inset:var(--header-h) 0 0;z-index:110;
  background:var(--grafite-noite);padding:var(--sp-4) var(--gutter) var(--sp-10);
  overflow-y:auto;transform:translateX(100%);visibility:hidden;
  transition:transform .45s var(--ease-out),visibility .45s;
}
.gaveta.is-open{transform:none;visibility:visible}
.gaveta a{display:block;padding:12px 0;color:var(--on-dark);font-size:1.0625rem;border-bottom:1px solid var(--line-dark)}
.gaveta.is-open a,.gaveta.is-open h4{animation:gavetaEntra .5s var(--ease-out) backwards}
@keyframes gavetaEntra{from{opacity:0;transform:translateX(24px)}to{opacity:1;transform:none}}
.gaveta h4{color:var(--on-dark-3);font-size:var(--fs-micro);text-transform:uppercase;letter-spacing:.14em;margin:var(--sp-4) 0 var(--sp-1)}
.gaveta .btn{margin-top:var(--sp-5)}

/* ============================== 06. HERO ============================ */
.hero{
  position:relative;isolation:isolate;overflow:hidden;
  background:var(--grafite-noite);color:var(--on-dark);
  padding-top:calc(var(--header-h) + clamp(32px,4.5vw,64px));
  padding-bottom:clamp(40px,5vw,72px);
  min-height:min(82vh,760px);display:flex;align-items:center;
}
.hero__fundo{position:absolute;inset:-8% 0;z-index:-3;will-change:transform}
.hero__fundo img{width:100%;height:100%;object-fit:cover;opacity:.55}
.hero__aurora{z-index:-2}
.hero__aurora i:nth-child(1){width:52vw;height:52vw;left:-14vw;top:-16vw;
  background:radial-gradient(circle,rgba(126,140,158,.5),transparent 65%);--dur:30s}
.hero__aurora i:nth-child(2){width:40vw;height:40vw;right:6vw;top:26vh;
  background:radial-gradient(circle,rgba(77,83,95,.75),transparent 65%);--dur:24s;--delay:-8s}
.hero__aurora i:nth-child(3){width:34vw;height:34vw;left:26vw;bottom:-14vw;
  background:radial-gradient(circle,rgba(126,140,158,.32),transparent 68%);--dur:34s;--delay:-16s}
.hero__grelha{z-index:-2;opacity:.55}
.hero::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:
    radial-gradient(115% 88% at 6% 42%, rgba(30,34,41,.96) 0%, rgba(30,34,41,.86) 34%, rgba(30,34,41,.42) 64%, rgba(30,34,41,.1) 100%),
    linear-gradient(180deg, rgba(30,34,41,.9) 0%, rgba(30,34,41,.18) 24%, rgba(30,34,41,.3) 68%, rgba(30,34,41,.92) 100%);
}
.hero .grao{z-index:2;opacity:.32}

.hero__grid{position:relative;z-index:3;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.82fr);gap:var(--sp-6);align-items:center}
.hero__col{max-width:680px}

/* entrada do hero — dispara no load, via .is-ready no <body> */
.js .hero__col>*{opacity:0;transform:translateY(26px);filter:blur(4px)}
body.is-ready .hero__col>*{
  animation:heroEntra 1s var(--ease-out) forwards;
  animation-delay:calc(var(--i,0) * .09s + .1s);
}
@keyframes heroEntra{to{opacity:1;transform:none;filter:none}}
body.is-ready .hero__figura{animation:heroFoto 1.4s var(--ease-out) .18s backwards}
@keyframes heroFoto{from{opacity:0;transform:translateY(40px) scale(.97)}to{opacity:1;transform:none}}

.hero h1{color:#fff;margin-bottom:var(--sp-3)}
.hero h1 em{
  font-style:normal;font-weight:400;
  background:linear-gradient(100deg,var(--on-dark-2) 0%,#fff 42%,var(--on-dark-3) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero__lead{font-size:clamp(1rem,.95rem + .28vw,1.125rem);line-height:1.6;color:var(--on-dark-2);max-width:56ch;margin-bottom:var(--sp-5)}

.regs{display:flex;flex-wrap:wrap;gap:0;border-top:1px solid var(--line-dark);border-bottom:1px solid var(--line-dark);padding-block:var(--sp-3);margin-bottom:var(--sp-3)}
.regs li{padding-right:var(--sp-5);margin-right:var(--sp-5);border-right:1px solid var(--line-dark)}
.regs li:last-child{border-right:0;margin-right:0;padding-right:0}
/* variante de uma linha, usada no hero: o bloco em duas colunas com
   filete em cima e embaixo pesava demais para um dado de apoio */
.regs--linha{
  display:flex;flex-wrap:wrap;gap:6px 28px;align-items:baseline;
  border-bottom:0;padding-block:var(--sp-3) 0;margin-bottom:var(--sp-5);
}
.regs--linha li{display:flex;align-items:baseline;gap:8px;border:0;margin:0;padding:0}
.regs--linha strong,.regs--linha span{display:inline;font-size:.8125rem;margin:0}

.regs strong{display:block;font-size:var(--fs-sm);font-weight:600;color:#fff;letter-spacing:.01em}
.regs span{display:block;font-size:var(--fs-micro);color:var(--on-dark-3);letter-spacing:.06em;margin-top:2px}

.hero__acoes{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-3)}

/* O retrato sai do encaixe da grelha: como item de grelha com justify-self:end
   ele encolhia para o fit-content e ficava pequeno. Agora é posicionado contra
   o contentor e a segunda coluna existe só para reservar o espaço. */
.hero__figura{
  position:absolute;right:calc(-1 * var(--gutter));bottom:calc(-1 * clamp(40px,5vw,72px));
  width:clamp(400px,44vw,660px);margin:0;will-change:transform;
}
.hero__figura img{width:100%;max-width:none;height:auto;filter:drop-shadow(0 34px 66px rgba(0,0,0,.55))}
/* halo atrás do retrato */
.hero__figura::before{
  content:"";position:absolute;left:50%;top:20%;width:76%;aspect-ratio:1;
  transform:translateX(-50%);border-radius:50%;z-index:-1;
  background:radial-gradient(circle,rgba(126,140,158,.45),transparent 68%);filter:blur(46px);
}

/* =========================== 07. QUEIXAS ============================ */
.queixas{position:relative;background:var(--card);border-bottom:1px solid var(--line);overflow:hidden}
.queixas::before{
  content:"";position:absolute;left:50%;top:0;width:70%;height:190px;transform:translateX(-50%);
  background:radial-gradient(60% 100% at 50% 0%, rgba(126,140,158,.2), transparent 70%);
}
.queixas__inner{position:relative;display:grid;grid-template-columns:minmax(0,260px) minmax(0,1fr);gap:var(--sp-6);align-items:start;padding-block:var(--sp-6)}
.queixas__rot h2{font-size:1.375rem;line-height:1.25;margin-bottom:6px}
.queixas__rot p{font-size:var(--fs-sm);color:var(--ink-3);margin:0}
.queixas__lista{display:flex;flex-wrap:wrap;gap:10px}
.queixa{
  position:relative;overflow:hidden;isolation:isolate;
  display:inline-flex;align-items:center;gap:9px;
  padding:11px 18px;border:1px solid var(--line);border-radius:var(--r-pill);
  font-size:var(--fs-sm);font-weight:500;color:var(--ink-2);background:var(--bg);
  transition:border-color var(--t),color var(--t),transform .35s var(--ease-out),box-shadow var(--t);
}
/* preenchimento que sobe no hover */
.queixa::before{
  content:"";position:absolute;inset:0;z-index:-1;background:var(--tinta);
  transform:translateY(101%);transition:transform .45s var(--ease-out);
}
.queixa svg{width:13px;height:13px;color:var(--aco);transition:transform var(--t),color var(--t)}
.queixa:hover{color:#fff;border-color:var(--tinta);transform:translateY(-3px);box-shadow:var(--sh-md)}
.queixa:hover::before{transform:translateY(0)}
.queixa:hover svg{transform:translate(2px,-2px);color:#fff}

/* ============================== 08. TESE ============================ */
.tese__grid{position:relative;display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(32px,5vw,72px);align-items:center}
.tese__fig{position:relative;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-xl)}
.tese__fig img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:50% 42%;
  transition:transform 1.6s var(--ease-out)}
.js .tese__fig img{transform:scale(1.07)}
.reveal.is-in .tese__fig img{transform:scale(1)}
.tese__fig::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(30,34,41,.16),transparent 32%);
}
.tese__selo{
  position:absolute;left:0;right:0;bottom:0;z-index:2;
  padding:var(--sp-6) var(--sp-3) var(--sp-3);
  background:linear-gradient(180deg,rgba(30,34,41,0),rgba(30,34,41,.92));
  display:flex;gap:var(--sp-4);
}
.tese__selo div strong{display:block;font-size:.8125rem;color:#fff;font-weight:600}
.tese__selo div span{display:block;font-size:var(--fs-micro);color:var(--on-dark-3);letter-spacing:.06em}
/* arcos decorativos atrás da foto */
/* um arco só, e discreto: dois círculos concêntricos brigavam com o
   retrato em vez de emoldurá-lo */
.tese__arco{
  position:absolute;left:-7%;top:-9%;width:64%;aspect-ratio:1;z-index:-1;
  border:1px solid rgba(126,140,158,.16);border-radius:50%;
}
.tese h2{font-size:clamp(1.625rem,.95rem + 2vw,2.5rem);line-height:1.14;margin-bottom:var(--sp-3)}
.tese p{max-width:56ch}
.tese .seta{margin-top:var(--sp-3)}

/* ============================== 09. ÁREAS =========================== */
/* Sai a grade de cartões soltos: as quatro frentes passam a dividir uma
   malha única, separada por filete, como um quadro editorial. O cartão
   se materializa no hover — o branco sobe e a célula ganha relevo. */
.areas{
  display:grid;grid-template-columns:repeat(2,1fr);
  margin-top:var(--sp-8);
  border-top:1px solid var(--line-strong);
  border-left:1px solid var(--line-strong);
}
.area{
  position:relative;isolation:isolate;overflow:hidden;
  display:flex;flex-direction:column;
  border-right:1px solid var(--line-strong);
  border-bottom:1px solid var(--line-strong);
  padding:clamp(28px,3.2vw,48px);
  transition:box-shadow .45s var(--ease-out),transform .45s var(--ease-out);
}
.area::before{
  content:"";position:absolute;inset:0;z-index:-1;background:var(--card);
  transform:translateY(101%);transition:transform .55s var(--ease-out);
}
.area:hover::before{transform:translateY(0)}
.area:hover{box-shadow:var(--sh-lg);z-index:2}

.area__ic{
  width:46px;height:46px;display:grid;place-items:center;border-radius:50%;
  border:1px solid var(--line-strong);color:var(--aco-txt);
  margin-bottom:var(--sp-4);
  transition:background .45s var(--ease-out),color .45s var(--ease-out),
             border-color .45s var(--ease-out),transform .55s var(--ease-out);
}
.area__ic svg{width:22px;height:22px}
.area:hover .area__ic{background:var(--tinta);border-color:var(--tinta);color:#fff;transform:rotate(-6deg)}

.area h3{margin-bottom:12px;transition:transform .45s var(--ease-out)}
.area:hover h3{transform:translateX(3px)}
.area>p{font-size:var(--fs-sm);color:var(--ink-3);line-height:1.7;margin-bottom:var(--sp-4);max-width:50ch}
.area__links{margin-top:auto;border-top:1px solid var(--line);padding-top:var(--sp-2);display:grid;grid-template-columns:1fr 1fr;gap:0 var(--sp-4)}
.area__links a{
  display:flex;align-items:center;justify-content:space-between;gap:var(--sp-2);
  padding:9px 0;font-size:var(--fs-sm);font-weight:500;color:var(--ink-2);
  transition:color var(--t),padding-left var(--t);
}
.area__links a::after{content:"→";color:var(--aco);opacity:0;transform:translateX(-4px);transition:opacity var(--t),transform var(--t)}
.area__links a:hover{color:var(--tinta);padding-left:4px}
.area__links a:hover::after{opacity:1;transform:none}

/* ========================= 10. COMO FUNCIONA ======================== */
/* Jornada em zigue-zague sobre uma espinha central. A espinha se preenche
   com o avanço da rolagem (--p, definido em home-v5.js) e cada estação
   acende quando o preenchimento a alcança (.is-on). */
.percurso{position:relative;isolation:isolate;overflow:hidden}
.percurso__luz{
  position:absolute;left:50%;top:12%;width:min(900px,90vw);aspect-ratio:1.6;
  transform:translateX(-50%);z-index:-1;pointer-events:none;
  background:radial-gradient(50% 50% at 50% 50%, rgba(126,140,158,.2), transparent 70%);
}
.percurso .grao{opacity:.4;mix-blend-mode:multiply}
.percurso>.wrap{position:relative;z-index:2}
.percurso__fim{margin-top:var(--sp-8)}

.jornada{position:relative;margin-top:clamp(48px,6vw,88px)}
/* espinha */
.jornada::before,.jornada::after{
  content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;
  transform:translateX(-50%);
}
.jornada::before{background:linear-gradient(180deg,transparent,var(--line-strong) 7%,var(--line-strong) 93%,transparent)}
.jornada::after{
  background:linear-gradient(180deg,var(--aco),var(--tinta));
  transform:translateX(-50%) scaleY(var(--p,0));transform-origin:top;
}

.etapa{
  position:relative;display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  align-items:center;gap:var(--vao);
  padding-block:clamp(24px,3vw,44px);
  --vao:clamp(24px,4vw,64px);
}
/* Sem grid-row explícito o corpo cairia para a linha 2: a marca vem antes
   no DOM e a colocação automática nunca volta para uma coluna anterior. */
.etapa__marca{grid-column:2;grid-row:1;position:relative}
.etapa__corpo{grid-column:1;grid-row:1;position:relative;text-align:right}
.etapa:nth-child(even) .etapa__corpo{grid-column:3;text-align:left}

/* marcador na espinha */
.etapa__ic{
  position:relative;z-index:2;width:66px;height:66px;display:grid;place-items:center;
  border-radius:50%;background:var(--card);border:1px solid var(--line-strong);
  color:var(--aco-txt);box-shadow:var(--sh-sm);
  transition:background .5s var(--ease-out),color .5s var(--ease-out),
             border-color .5s var(--ease-out),transform .5s var(--ease-out);
}
.etapa__ic svg{width:24px;height:24px}
.etapa.is-on .etapa__ic{background:var(--tinta);border-color:var(--tinta);color:#fff;box-shadow:var(--sh-md)}
.etapa h3{font-size:clamp(1.3125rem,1.05rem + .7vw,1.75rem);margin-bottom:12px;position:relative}
.etapa__corpo p{font-size:var(--fs-body);color:var(--ink-2);line-height:1.7;max-width:44ch;margin:0}
.etapa .etapa__corpo p{margin-left:auto}
.etapa:nth-child(even) .etapa__corpo p{margin-left:0;margin-right:auto}

/* ============================= 11. PESQUISA ========================= */
/* painel escuro como cartão, não como laje: contraste sem virar túnel */
.pesquisa{
  position:relative;isolation:isolate;overflow:hidden;
  background:var(--grafite-noite);color:var(--on-dark);
  border-radius:var(--r-xl);padding:clamp(36px,4.5vw,64px);
}
.pesquisa .aurora i:nth-child(1){width:46%;aspect-ratio:1;left:-10%;top:-30%;
  background:radial-gradient(circle,rgba(126,140,158,.45),transparent 65%);--dur:28s}
.pesquisa .aurora i:nth-child(2){width:38%;aspect-ratio:1;right:-8%;bottom:-30%;
  background:radial-gradient(circle,rgba(77,83,95,.7),transparent 65%);--dur:22s;--delay:-6s}
.pesquisa .grao{opacity:.3}
.pesquisa__grid{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(32px,4vw,64px);align-items:start}
.pesquisa h2{color:#fff}
.pesquisa__intro p{color:var(--on-dark-2)}
.pesquisa .olho{color:var(--on-dark-3)}
.pesquisa .artigos li+li{margin-top:10px}
.pesquisa .artigo{
  position:relative;overflow:hidden;isolation:isolate;
  display:grid;grid-template-columns:auto 1fr auto;gap:var(--sp-3);align-items:start;
  padding:var(--sp-3);border:1px solid var(--line-dark);border-radius:var(--r-md);
  background:rgba(255,255,255,.045);
  transition:border-color var(--t),transform .4s var(--ease-out),background var(--t);
}
.pesquisa .artigo::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:2px;z-index:-1;
  background:linear-gradient(var(--aco),#fff);transform:scaleY(0);transform-origin:top;
  transition:transform .5s var(--ease-out);
}
.pesquisa .artigo:hover{border-color:var(--line-dark-2);background:rgba(255,255,255,.08);transform:translateX(5px)}
.pesquisa .artigo:hover::before{transform:scaleY(1)}
.pesquisa .artigo__n{font-family:var(--display);font-size:.875rem;color:var(--on-dark-3);padding-top:3px}
.pesquisa .artigo__t{display:block;font-size:var(--fs-sm);font-weight:600;color:#fff;line-height:1.45;margin-bottom:5px}
.pesquisa .artigo__ref{display:block;font-size:var(--fs-micro);color:var(--on-dark-3);letter-spacing:.04em;text-transform:uppercase}
.pesquisa .artigo__go{align-self:center;color:var(--on-dark-3);transition:transform var(--t),color var(--t)}
.pesquisa .artigo__go svg{width:15px;height:15px}
.pesquisa .artigo:hover .artigo__go{transform:translate(3px,-3px);color:#fff}

/* ============================== 12. BLOG ============================ */
.secao__topo{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--sp-4);flex-wrap:wrap}
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-3);margin-top:var(--sp-6)}
.post{
  position:relative;overflow:hidden;
  display:flex;flex-direction:column;gap:var(--sp-2);
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);
  padding:var(--sp-4);transition:border-color var(--t),box-shadow .4s var(--ease-out),transform .4s var(--ease-out);
}
/* filete que se desenha no topo do cartão */
.post::before{
  content:"";position:absolute;left:0;right:0;top:0;height:2px;
  background:linear-gradient(90deg,var(--aco),var(--tinta));
  transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease-out);
}
.post:hover::before{transform:scaleX(1)}
.post:hover{border-color:var(--line-strong);box-shadow:var(--sh-lg);transform:translateY(-4px)}
.post h3{font-size:1.125rem;line-height:1.32;margin:0}
.chip{
  align-self:flex-start;font-size:var(--fs-micro);font-weight:600;text-transform:uppercase;
  letter-spacing:.11em;color:var(--ink-2);background:rgba(126,140,158,.15);
  padding:5px 11px;border-radius:var(--r-pill);transition:background var(--t),color var(--t);
}
.post:hover .chip{background:var(--tinta);color:#fff}
.post__meta{
  margin-top:auto;padding-top:var(--sp-2);border-top:1px solid var(--line);
  display:flex;flex-wrap:wrap;gap:var(--sp-2);font-size:.8125rem;color:var(--ink-3);
}
.post__meta span+span::before{content:"·";margin-right:var(--sp-2);color:var(--aco)}

/* =============================== 13. FAQ ============================ */
.faq__grid{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:clamp(32px,5vw,72px);align-items:start}
.faq__aside{position:sticky;top:calc(var(--header-h) + 32px)}
.faq__aside p{font-size:var(--fs-sm);color:var(--ink-3);max-width:34ch}
.faq details{
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);
  transition:border-color var(--t),box-shadow .4s var(--ease-out),transform .4s var(--ease-out);
}
.faq details+details{margin-top:10px}
.faq details[open]{border-color:var(--line-strong);box-shadow:var(--sh-md)}
.faq details:hover{transform:translateX(3px)}
.faq summary{
  list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;
  gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);
  font-family:var(--display);font-size:1.0625rem;font-weight:600;color:var(--ink);line-height:1.35;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";width:12px;height:12px;flex:none;
  background:currentColor;color:var(--aco-txt);
  clip-path:polygon(45% 0,55% 0,55% 45%,100% 45%,100% 55%,55% 55%,55% 100%,45% 100%,45% 55%,0 55%,0 45%,45% 45%);
  transition:transform .45s var(--ease-out),color var(--t);
}
.faq details[open] summary::after{transform:rotate(135deg);color:var(--tinta)}
.faq__corpo,.faq__body{padding:0 var(--sp-4) var(--sp-4);font-size:var(--fs-sm);color:var(--ink-2);line-height:1.65;max-width:66ch}
.faq details[open] .faq__corpo,.faq details[open] .faq__body{animation:faqAbre .45s var(--ease-out)}
@keyframes faqAbre{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

/* ============================= 14. CONVERSÃO ======================== */
.cta{
  position:relative;isolation:isolate;overflow:hidden;
  background:var(--grafite-noite);color:var(--on-dark);
  border-radius:var(--r-xl);padding:clamp(40px,5vw,76px) clamp(24px,4vw,64px);
}
.cta .aurora i:nth-child(1){width:44%;aspect-ratio:1;left:6%;top:-34%;
  background:radial-gradient(circle,rgba(126,140,158,.5),transparent 64%);--dur:26s}
.cta .aurora i:nth-child(2){width:40%;aspect-ratio:1;right:-6%;bottom:-32%;
  background:radial-gradient(circle,rgba(77,83,95,.8),transparent 66%);--dur:20s;--delay:-7s}
.cta .grao{opacity:.3}
.cta__marca{
  position:absolute;right:clamp(20px,3vw,44px);bottom:clamp(20px,3vw,40px);
  width:clamp(90px,11vw,150px);opacity:.09;z-index:1;pointer-events:none;
}
.cta__grid{position:relative;z-index:2;max-width:620px;margin-inline:auto;text-align:center}
.cta__grid .btn{margin-top:var(--sp-6)}
.cta h2{color:#fff;margin-bottom:var(--sp-3)}
.cta p{color:var(--on-dark-2);max-width:50ch;margin-inline:auto}
.cta__aviso{position:relative;z-index:2;display:block;text-align:center;margin-top:var(--sp-8);padding-top:var(--sp-3);border-top:1px solid var(--line-dark);font-size:var(--fs-micro);color:var(--on-dark-3)}

/* ============================== 15. RODAPÉ ========================== */
.rodape{position:relative;overflow:hidden;background:var(--tinta);color:var(--on-dark-2);padding-block:var(--sp-10);font-size:var(--fs-sm)}
.rodape .grao{opacity:.25}
.rodape__fantasma{
  left:50%;bottom:-2%;transform:translateX(-50%);
  font-size:clamp(2.5rem,9.6vw,8.5rem);-webkit-text-stroke:1px rgba(255,255,255,.07);
}
.rodape__grid{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:var(--sp-6) var(--sp-4)}
.rodape__marca img{height:44px;width:auto;margin-bottom:var(--sp-3)}
.rodape__marca>p{font-size:var(--fs-sm);color:var(--on-dark-3);margin-bottom:var(--sp-3)}
.rodape .regs{border:0;padding:0;margin:0;display:grid;gap:10px}
.rodape .regs li{border:0;padding:0;margin:0}
.rodape h4{color:#fff;font-size:var(--fs-micro);text-transform:uppercase;letter-spacing:.14em;margin-bottom:var(--sp-3)}
.rodape li+li{margin-top:9px}
.rodape__grid a{position:relative;color:var(--on-dark-2);transition:color var(--t),padding-left var(--t)}
.rodape__grid a:hover{color:#fff;padding-left:5px}
.rodape__base{
  position:relative;z-index:2;
  margin-top:var(--sp-8);padding-top:var(--sp-4);border-top:1px solid var(--line-dark);
  display:flex;justify-content:space-between;gap:var(--sp-4);flex-wrap:wrap;
  font-size:var(--fs-micro);color:var(--on-dark-3);line-height:1.6;
}
.rodape__base p{margin:0;max-width:62ch}

/* =========================== 16. FLUTUANTES ========================= */
.fab{
  position:fixed;right:20px;bottom:20px;z-index:100;
  display:inline-flex;align-items:center;gap:11px;
  background:var(--tinta);color:#fff;border-radius:var(--r-pill);
  padding:11px 20px 11px 12px;box-shadow:0 12px 34px rgba(38,43,51,.34);
  transition:transform .4s var(--ease-out),box-shadow var(--t);
}
.fab:hover{transform:translateY(-3px);box-shadow:0 18px 44px rgba(38,43,51,.42)}
.fab__wa{position:relative;width:34px;height:34px;display:grid;place-items:center;background:#25D366;border-radius:var(--r-pill);flex:none}
.fab__wa::after{
  content:"";position:absolute;inset:0;border-radius:50%;border:2px solid #25D366;
  animation:pulso 3s var(--ease) infinite;
}
@keyframes pulso{0%{transform:scale(1);opacity:.7}70%,100%{transform:scale(1.65);opacity:0}}
.fab__wa svg{width:19px;height:19px;fill:#fff;position:relative;z-index:1}
.fab__txt{display:grid;line-height:1.25;font-size:var(--fs-micro);color:var(--on-dark-2)}
.fab__txt strong{font-size:.8125rem;color:#fff;font-weight:600}

.cookies{
  position:fixed;left:20px;right:20px;bottom:20px;z-index:130;
  max-width:640px;margin-inline:auto;
  display:flex;align-items:center;gap:var(--sp-4);flex-wrap:wrap;
  background:rgba(255,255,255,.93);backdrop-filter:blur(14px);
  border:1px solid var(--line);border-radius:var(--r-md);
  padding:var(--sp-3) var(--sp-4);box-shadow:var(--sh-lg);
  transform:translateY(140%);transition:transform .55s var(--ease-out);
}
.cookies.is-visible{transform:none}
.cookies p{flex:1 1 260px;font-size:var(--fs-sm);color:var(--ink-2);margin:0}
.cookies__acoes{display:flex;gap:10px;margin-left:auto}

/* ======================= 17. PÁGINA INTERNA ========================= */
/* Capa: mesma laje escura do hero da home, mais baixa, com o retrato
   emoldurado no lugar do recorte. */
.phero{
  position:relative;isolation:isolate;overflow:hidden;
  background:var(--grafite-noite);color:var(--on-dark);
  padding-top:calc(var(--header-h) + clamp(32px,4vw,56px));
  padding-bottom:clamp(40px,5vw,72px);
}
.phero__aurora{z-index:-2}
.phero__aurora i:nth-child(1){width:46vw;height:46vw;left:-12vw;top:-18vw;
  background:radial-gradient(circle,rgba(126,140,158,.46),transparent 66%);--dur:30s}
.phero__aurora i:nth-child(2){width:34vw;height:34vw;right:2vw;bottom:-16vw;
  background:radial-gradient(circle,rgba(77,83,95,.72),transparent 66%);--dur:24s;--delay:-8s}
.phero__grelha{z-index:-2;opacity:.5}
.phero::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:
    radial-gradient(110% 90% at 8% 45%, rgba(30,34,41,.94) 0%, rgba(30,34,41,.8) 38%, rgba(30,34,41,.4) 70%, rgba(30,34,41,.14) 100%),
    linear-gradient(180deg, rgba(30,34,41,.86) 0%, rgba(30,34,41,.22) 30%, rgba(30,34,41,.88) 100%);
}
.phero .grao{z-index:2;opacity:.3}
.phero__fantasma{
  left:50%;bottom:-6%;transform:translateX(-8%);z-index:-1;
  font-size:clamp(7rem,22vw,19rem);
  -webkit-text-stroke:1px rgba(255,255,255,.09);
}
.phero__grid{position:relative;z-index:3;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(32px,5vw,72px);align-items:center}
.phero__col{max-width:660px}
.phero h1{color:#fff;margin-bottom:var(--sp-3)}
.phero h1 em{
  font-style:normal;font-weight:400;
  background:linear-gradient(100deg,var(--on-dark-2) 0%,#fff 42%,var(--on-dark-3) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.phero .regs--linha{margin-bottom:var(--sp-5)}
.phero__acoes{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-3)}
.olho--claro{color:var(--on-dark-3)}

.phero__fig{position:relative;justify-self:end;width:100%;max-width:400px;margin:0}
/* fotografia de contexto (consultório), clara sobre a laje escura:
   a moldura e a sombra fazem o recorte ler como retrato emoldurado */
.phero__fig img{
  width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:50% 22%;
  border-radius:var(--r-lg);border:1px solid rgba(255,255,255,.12);
  box-shadow:0 34px 76px rgba(0,0,0,.5);
}
/* arco discreto, o mesmo gesto do bloco da tese na home */
.phero__fig::before{
  content:"";position:absolute;left:-16%;top:-12%;width:70%;aspect-ratio:1;z-index:-1;
  border:1px solid rgba(255,255,255,.1);border-radius:50%;
}

/* migalhas */
.crumbs{margin-bottom:var(--sp-4)}
.crumbs ol{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:var(--fs-micro);
  text-transform:uppercase;letter-spacing:.12em;color:var(--on-dark-3)}
.crumbs li+li::before{content:"/";margin-right:8px;color:var(--aco)}
.crumbs a{color:var(--on-dark-2);transition:color var(--t)}
.crumbs a:hover{color:#fff}

/* Corpo: sumário fixo à esquerda, prosa à direita */
.pagina{display:grid;grid-template-columns:minmax(0,240px) minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:start}
.pagina__lado{position:sticky;top:calc(var(--header-h) + 32px)}
.toc h4{
  font-size:var(--fs-micro);text-transform:uppercase;letter-spacing:.14em;
  color:var(--ink-3);margin-bottom:var(--sp-3);
}
.toc li+li{margin-top:2px}
.toc a{
  position:relative;display:block;padding:8px 0 8px 18px;
  font-size:var(--fs-sm);color:var(--ink-3);line-height:1.4;
  transition:color var(--t),padding-left var(--t);
}
.toc a::before{
  content:"";position:absolute;left:0;top:calc(8px + .7em);width:8px;height:1px;
  background:var(--line-strong);transition:width var(--t),background var(--t);
}
.toc a:hover{color:var(--ink)}
.toc a.is-active{color:var(--ink);font-weight:600}
.toc a.is-active::before{width:12px;background:var(--tinta)}

.prose{max-width:70ch}
.prose>section+section{margin-top:var(--sp-10)}
.prose h2{margin-bottom:var(--sp-3)}
/* filete de aço acima de cada título, o mesmo gesto do olho */
.prose h2::before{content:"";display:block;width:34px;height:1px;background:var(--aco);margin-bottom:var(--sp-3)}
.prose p{font-size:var(--fs-body);line-height:1.75;color:var(--ink-2);margin-bottom:var(--sp-3)}
.prose p:last-child{margin-bottom:0}
/* a primeira frase da página abre em corpo maior, como o lead da home */
.prose>section:first-child>p:first-of-type{font-size:var(--fs-lead);line-height:1.65;color:var(--ink)}
/* capitular na abertura */
.prose>section:first-child>p:first-of-type::first-letter{
  font-family:var(--display);font-weight:600;
  font-size:3.1em;line-height:.82;
  float:left;padding:.06em .14em 0 0;color:var(--tinta);
}
/* parágrafo-manifesto em serifada, com filete à esquerda */
.prose .destaque{
  font-family:var(--display);font-size:clamp(1.1875rem,1.05rem + .5vw,1.375rem);
  line-height:1.6;color:var(--ink);letter-spacing:-.01em;
  border-left:2px solid var(--aco);padding-left:var(--sp-4);
  margin-block:var(--sp-4);
}
/* só links corridos de texto: navegação dentro da prosa tem estilo próprio */
.prose p a,.prose li:not(.roteiro li) a,.prose dd a{
  color:var(--tinta);font-weight:500;text-decoration:underline;
  text-decoration-color:var(--line-strong);text-underline-offset:3px;
  transition:text-decoration-color var(--t);
}
.prose p a:hover,.prose li:not(.roteiro li) a:hover,.prose dd a:hover{text-decoration-color:var(--tinta)}
.roteiro a,.book a{text-decoration:none}
.prose__nota{font-size:var(--fs-sm)!important;color:var(--ink-3)!important;padding-top:var(--sp-2);border-top:1px solid var(--line)}

/* cartão de registros */
.registros{
  margin-top:var(--sp-6);padding:var(--sp-4) var(--sp-5);
  background:var(--card);border:1px solid var(--line);border-left:2px solid var(--tinta);
  border-radius:var(--r-md);box-shadow:var(--sh-sm);
}
.registros h3{
  font-family:var(--sans);font-size:var(--fs-micro);font-weight:600;
  text-transform:uppercase;letter-spacing:.14em;color:var(--ink-3);margin-bottom:var(--sp-3);
}
.registros ul{display:flex;flex-wrap:wrap;gap:var(--sp-2) var(--sp-6)}
.registros strong{display:block;font-size:var(--fs-sm);color:var(--ink);font-weight:600}
.registros span{display:block;font-size:var(--fs-micro);color:var(--ink-3);letter-spacing:.06em;margin-top:2px}

/* item atual da navegação */
.nav__link.is-atual{color:#fff}
.nav__link.is-atual::after{transform:scaleX(1)}

/* ================== 17b. PÁGINAS INTERNAS — CONTEÚDO ================= */
/* Classes herdadas do gerador (roteiro, deflist, side, book, filters…),
   reestilizadas nos tokens v5 para as 19 páginas migradas. */

/* capa só de texto (sem retrato) */
.phero--txt{padding-bottom:clamp(40px,4.5vw,64px)}
.phero--txt .phero__col{max-width:820px;display:block}
.phero--centro .phero__col{margin-inline:auto;text-align:center}
.phero--centro .crumbs ol{justify-content:center}
.phero--centro .olho{justify-content:center}
.phero__lead{font-size:var(--fs-lead);line-height:1.65;color:var(--on-dark-2);max-width:64ch;margin:0}
.phero--centro .phero__lead{margin-inline:auto}
.phero__meta{display:flex;flex-wrap:wrap;gap:10px var(--sp-3);align-items:center;margin-bottom:var(--sp-3);
  font-size:var(--fs-micro);text-transform:uppercase;letter-spacing:.08em;color:var(--on-dark-3)}
.phero__meta .chip{background:rgba(255,255,255,.12);color:var(--on-dark)}

/* seções e utilitários legados */
.section{position:relative;padding-block:var(--secao)}
.section--tight{padding-block:clamp(48px,5vw,80px)}
.section--alt{background:var(--wash)}
.narrow{max-width:700px;margin-inline:auto}
.center{text-align:center}
.eyebrow{font-family:var(--sans);font-size:var(--fs-micro);font-weight:600;
  text-transform:uppercase;letter-spacing:.14em;color:var(--ink-2);margin:0 0 var(--sp-2);
  display:flex;align-items:flex-start;gap:10px;line-height:1.5}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--aco);flex:none;margin-top:.72em}
.meta{font-size:var(--fs-sm);color:var(--ink-3)}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-3)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-3)}
.grid-4{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-3)}
[class^="stack-"]{margin-bottom:var(--sp-4)}

/* botões legados → papéis v5 */
.btn--primary{background:var(--tinta);color:#fff;box-shadow:var(--sh-sm)}
.btn--primary:hover{background:var(--grafite)}
.btn--light,.btn--invert{background:#fff;color:var(--tinta);box-shadow:0 6px 24px rgba(0,0,0,.22)}
.btn--secondary,.btn--ghost{border-color:var(--line-strong);color:var(--tinta);background:transparent}
.btn--secondary:hover,.btn--ghost:hover{border-color:var(--tinta);background:rgba(38,43,51,.04)}
.btn--block{display:flex;width:100%}

/* corpo com sumário lateral à direita (páginas de doença) */
.page-grid{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter);
  display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:clamp(32px,5vw,72px);
  align-items:start;padding-block:var(--secao)}
.side{position:sticky;top:calc(var(--header-h) + 32px);display:grid;gap:var(--sp-3)}
.side__box{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:var(--sp-4)}
.side__box h4{font-size:var(--fs-micro);text-transform:uppercase;letter-spacing:.14em;color:var(--ink-3);margin-bottom:var(--sp-2)}
.side__box ul li+li{margin-top:2px}
.side__box ul a{display:block;padding:7px 0;font-size:var(--fs-sm);color:var(--ink-2);transition:color var(--t),padding-left var(--t)}
.side__box ul a:hover{color:var(--tinta);padding-left:5px}
.side .toc{padding:var(--sp-4)}

/* cartão de agendamento contextual */
.book{position:relative;isolation:isolate;overflow:hidden;background:var(--grafite-noite);color:var(--on-dark);
  border-radius:var(--r-md);padding:var(--sp-4)}
.book::before{content:"";position:absolute;inset:0;z-index:-1;
  background:radial-gradient(80% 100% at 20% 0%,rgba(126,140,158,.24),transparent 65%)}
.book h4{font-family:var(--display);font-size:1.0625rem;color:#fff;margin-bottom:8px}
.book p{font-size:var(--fs-sm);color:var(--on-dark-2);margin-bottom:var(--sp-3)}
.book--inline{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:var(--sp-3);margin-block:var(--sp-8);padding:var(--sp-5)}
.book--inline>div{flex:1 1 340px}
.book--inline h4{font-size:1.1875rem}
.book--inline p{margin-bottom:0}

/* Roteiro "o que esta página cobre": repete exatamente a lista do sumário
   lateral. No desktop fica escondido — quem manda é a lateral, que é fixa e
   marca a seção em leitura. Reaparece abaixo de 940px, onde a lateral some. */
.roteiro{display:none;border:1px solid var(--line);border-left:2px solid var(--aco);
  border-radius:var(--r-md);background:var(--card);padding:var(--sp-4);margin-bottom:var(--sp-6)}
.roteiro .eyebrow{margin-bottom:var(--sp-2)}
.roteiro ol li+li{margin-top:2px}
.roteiro a{position:relative;display:block;padding:7px 0 7px 20px;font-size:var(--fs-sm);
  color:var(--ink-2);transition:color var(--t),padding-left var(--t)}
.roteiro a span{display:none}
.roteiro a::before{content:"";position:absolute;left:0;top:calc(7px + .8em);width:10px;height:1px;background:var(--aco)}
.roteiro a:hover{color:var(--tinta);padding-left:24px}

/* lista de definições clínica */
.deflist{display:grid;gap:0;margin-block:var(--sp-4);border-top:1px solid var(--line)}
.deflist>div{padding-block:var(--sp-3);border-bottom:1px solid var(--line)}
.deflist dt{font-family:var(--display);font-weight:600;font-size:1.0625rem;color:var(--ink);margin-bottom:6px}
.deflist dd{margin:0;font-size:var(--fs-sm);color:var(--ink-2);line-height:1.7;max-width:64ch}

/* alerta clínico */
.callout{background:var(--wash);border-left:2px solid var(--tinta);border-radius:var(--r-sm);
  padding:var(--sp-4);margin-block:var(--sp-5)}
.callout h3{font-size:1.0625rem;margin-bottom:8px}
.callout p{font-size:var(--fs-sm);margin:0}

/* Fotografia dentro do texto. As imagens temáticas vêm em proporções muito
   diferentes (de 1,17:1 a 3,10:1): forçar um quadro único cortaria umas e
   deformaria outras, então cada uma mantém a própria altura. */
.foto{margin-block:var(--sp-8);border-radius:var(--r-md);overflow:hidden;box-shadow:var(--sh-md)}
.foto img{width:100%;height:auto;display:block}
.phead__fig{display:none}

/* filtros do blog e das publicações */
.filters{display:flex;flex-wrap:wrap;gap:10px;margin-block:var(--sp-2) var(--sp-6)}
.filters button{padding:9px 18px;border:1px solid var(--line);border-radius:var(--r-pill);
  font-size:var(--fs-sm);font-weight:500;color:var(--ink-2);background:var(--card);
  transition:border-color var(--t),background var(--t),color var(--t)}
.filters button:hover{border-color:var(--tinta);color:var(--tinta)}
.filters button[aria-pressed="true"]{background:var(--tinta);border-color:var(--tinta);color:#fff}
.is-hidden{display:none!important}

/* cards de post com capa (blog) */
.post .post__img{width:calc(100% + 2*var(--sp-4));max-width:none;margin:calc(-1*var(--sp-4)) calc(-1*var(--sp-4)) 0;
  aspect-ratio:16/9;object-fit:cover;border-radius:calc(var(--r-md) - 1px) calc(var(--r-md) - 1px) 0 0}
.post__body{display:flex;flex-direction:column;gap:var(--sp-2);padding-top:var(--sp-3);flex:1}
.post__body>p{font-size:var(--fs-sm);color:var(--ink-3);margin:0}

/* publicações */
/* Cartões de publicação: fundo claro. O nome .artigo é o mesmo da lista do
   painel escuro da home, por isso aquelas regras ficam escopadas em .pesquisa. */
article.artigo{
  display:block;background:var(--card);border:1px solid var(--line);
  border-radius:var(--r-md);padding:var(--sp-5);
  transition:border-color var(--t),box-shadow .4s var(--ease-out),transform .4s var(--ease-out);
}
article.artigo+article.artigo{margin-top:var(--sp-3)}
article.artigo:hover{border-color:var(--line-strong);box-shadow:var(--sh-md);transform:translateY(-3px)}
.artigo__topo{display:flex;gap:10px;align-items:baseline;margin:0 0 var(--sp-2);
  font-size:var(--fs-micro);text-transform:uppercase;letter-spacing:.1em;color:var(--ink-3)}
.artigo__n{font-family:var(--display);font-size:.9375rem;color:var(--aco-txt);letter-spacing:.03em}
article.artigo h3{font-size:1.0625rem;line-height:1.45;margin-bottom:10px;max-width:70ch}
article.artigo .artigo__ref{display:block;font-family:var(--sans);font-size:var(--fs-sm);
  font-style:normal;text-transform:none;letter-spacing:0;color:var(--ink-3);margin-bottom:10px}
article.artigo p{font-size:var(--fs-sm);color:var(--ink-2);line-height:1.7;max-width:74ch}
article.artigo .pub__link{display:inline-block;margin-top:var(--sp-3)}
.pub__link{font-weight:600;font-size:var(--fs-sm);color:var(--tinta);text-decoration:underline;
  text-decoration-color:var(--line-strong);text-underline-offset:3px}
.pub__link:hover{text-decoration-color:var(--tinta)}
.outros li{padding-block:var(--sp-3);border-bottom:1px solid var(--line)}
.outros li:first-child{padding-top:0}
.outros h3{font-size:1rem;line-height:1.45;margin-bottom:6px}
.outros p{font-size:var(--fs-sm);color:var(--ink-3);margin:0}

/* congressos: ano como marcador na coluna da esquerda */
.congressos li{display:grid;grid-template-columns:auto 1fr;gap:var(--sp-3);
  padding-block:var(--sp-3);border-bottom:1px solid var(--line)}
.congressos li:first-child{padding-top:0}
.congresso__ano{font-family:var(--display);font-size:1rem;color:var(--aco-txt);letter-spacing:.03em}
.congressos p{font-size:var(--fs-sm);color:var(--ink-2);line-height:1.6;margin:0}
.grid-2--pub{align-items:start;gap:clamp(32px,5vw,72px)}

/* autor (blog-post) */
.author{display:flex;gap:var(--sp-3);align-items:center;margin-block:var(--sp-6);
  padding:var(--sp-4);background:var(--card);border:1px solid var(--line);border-radius:var(--r-md)}
.author__ph{width:64px;height:64px;border-radius:50%;object-fit:cover;flex:none}
.author strong{font-family:var(--display);font-size:1.0625rem;color:var(--ink)}
.author p{font-size:var(--fs-micro);color:var(--ink-3);margin:4px 0 0;line-height:1.6}
.article__meta{display:flex;flex-wrap:wrap;gap:8px var(--sp-2);align-items:center;
  font-size:var(--fs-micro);color:var(--ink-3);text-transform:uppercase;letter-spacing:.06em}

/* contato */
.contact-card{display:grid;gap:10px;justify-items:start;background:var(--card);
  border:1px solid var(--line);border-radius:var(--r-md);padding:var(--sp-4)}
.contact-card strong{font-family:var(--display);font-size:1.125rem;color:var(--ink)}
.contact-card span{font-size:var(--fs-sm);color:var(--ink-3);line-height:1.6}

/* landing pages */
.lp-head{position:fixed;inset:0 0 auto;z-index:120;background:rgba(30,34,41,.9);
  backdrop-filter:blur(14px);border-bottom:1px solid var(--line-dark)}
.lp-head .header__inner{display:flex;align-items:center;height:var(--header-h)}
.lp-head .brand img{height:36px;width:auto}
.lp-note{background:var(--wash);border-left:2px solid var(--tinta);border-radius:var(--r-sm);
  padding:var(--sp-4);margin-top:var(--sp-4)}
.lp-note h3{font-size:1rem;margin-bottom:6px}
.lp-note p{font-size:var(--fs-sm);margin:0}
.section--brand{background:var(--wash)}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-3)}
.step{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:var(--sp-4)}
.step h3{font-size:1.0625rem;margin-bottom:6px}
.step p{font-size:var(--fs-sm);color:var(--ink-3);margin:0}
.lp-sticky{position:fixed;left:0;right:0;bottom:0;z-index:100;display:none;
  padding:10px var(--gutter);background:rgba(30,34,41,.94);backdrop-filter:blur(12px);
  border-top:1px solid var(--line-dark)}
.lp-sticky .btn{width:100%}
.badge{display:inline-flex;gap:8px;align-items:baseline;font-size:var(--fs-micro);color:var(--on-dark-2)}

/* prosa numerada e modificadores sem estilo próprio */
.prose--num{counter-reset:sec}
.slot--vazio{}

/* publicações: tema e resumo do artigo */
.artigo__tema{color:var(--ink-3)}
.artigo__res{font-size:var(--fs-sm);color:var(--ink-2);line-height:1.7;max-width:74ch;margin:0}
.artigo__aberto{display:inline-block;margin-left:8px;font-size:var(--fs-micro);
  text-transform:uppercase;letter-spacing:.08em;color:var(--aco-txt)}

/* corpo do post do blog */
.article__body>img{border-radius:var(--r-md);margin-bottom:var(--sp-5)}

/* rodapé enxuto das landing pages */
.footer{background:var(--tinta);color:var(--on-dark-2);padding-block:var(--sp-6);font-size:var(--fs-sm)}
.footer__bottom{display:flex;justify-content:space-between;gap:var(--sp-4);flex-wrap:wrap;
  font-size:var(--fs-micro);color:var(--on-dark-3);line-height:1.6}
.footer__bottom p{margin:0;max-width:70ch}
.footer__note{margin:0}
.footer a{color:var(--on-dark-2);transition:color var(--t)}
.footer a:hover{color:#fff}
.cookies__actions{display:flex;gap:10px;margin-left:auto}

/* faixa de números (publicações) */
.section--numeros{padding-block:var(--sp-8);border-bottom:1px solid var(--line)}
.numeros{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-4)}
.numeros li{border-left:1px solid var(--line-strong);padding-left:var(--sp-3)}
.numeros strong{display:block;font-family:var(--display);font-size:clamp(1.75rem,1.3rem + 1.4vw,2.5rem);
  line-height:1.1;color:var(--ink);margin-bottom:4px}
.numeros span{display:block;font-size:var(--fs-sm);color:var(--ink-3);line-height:1.5}
.numeros__nota{margin-top:var(--sp-4);max-width:70ch}

/* cartões do 404 */
.tcard{display:block;background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);
  padding:var(--sp-4);transition:border-color var(--t),box-shadow .4s var(--ease-out),transform .4s var(--ease-out)}
.tcard:hover{border-color:var(--line-strong);box-shadow:var(--sh-md);transform:translateY(-3px)}
.tcard h3{margin-bottom:6px}

/* ============================ 18. RESPONSIVO ======================== */
/* A navegação completa só cabe acima de 1080px: abaixo disso os itens
   quebravam em várias linhas. O menu em gaveta entra antes de o layout empilhar. */
@media (max-width:1080px){
  .nav,.cab .btn{display:none}
  .burger{display:grid}
  .hero__grid{grid-template-columns:minmax(0,1fr) minmax(0,.74fr)}
  .rodape__grid{grid-template-columns:1fr 1fr}
}

@media (max-width:940px){
  .hero{min-height:0}
  .hero__grid{grid-template-columns:1fr;gap:var(--sp-6)}
  .hero__col{max-width:none}
  .hero__figura{position:static;width:100%;margin-bottom:calc(-1 * clamp(40px,5vw,72px));justify-self:center}
  .hero__figura img{max-width:420px;margin-inline:auto}
  .queixas__inner{grid-template-columns:1fr;gap:var(--sp-4)}
  .tese__grid,.pesquisa__grid,.faq__grid{grid-template-columns:1fr}
  .phero__grid{grid-template-columns:1fr;gap:var(--sp-6)}
  .phero__col{max-width:none}
  .phero__fig{justify-self:start;max-width:320px}
  .phero__fig::before{display:none}
  /* o sumário some: em coluna única o texto já é linear */
  .pagina{grid-template-columns:1fr}
  .pagina__lado{display:none}
  .page-grid{grid-template-columns:1fr}
  .numeros{grid-template-columns:repeat(2,1fr)}
  .side{position:static}
  .side .toc{display:none}
  .roteiro{display:block}
  .grid-2,.grid-3,.grid-4{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
  .lp-sticky{display:block}
  /* a barra fixa já leva o CTA no mobile: o botão do topo só apertava o logotipo */
  .lp-head .btn{display:none}
  /* espaço para a barra fixa não cobrir o fim do conteúdo */
  body.is-lp{padding-bottom:76px}
  .faq__aside{position:static}
  .tese__fig{max-width:420px;margin-inline:auto}
  .tese__arco{display:none}
  /* espinha encosta à esquerda e a jornada vira linha do tempo */
  .jornada::before,.jornada::after{left:33px}
  .etapa{grid-template-columns:auto minmax(0,1fr);gap:var(--sp-4);padding-block:var(--sp-5)}
  .etapa__marca{grid-column:1}
  .etapa__corpo,.etapa:nth-child(even) .etapa__corpo{grid-column:2;text-align:left}
  .etapa__ic{width:56px;height:56px}
  .etapa__ic svg{width:21px;height:21px}
  .etapa .etapa__corpo p,.etapa:nth-child(even) .etapa__corpo p{margin-inline:0}

  .posts{grid-template-columns:1fr}
  .areas{grid-template-columns:1fr;border-left:0}
  .area{border-right:0}
  .area__links{grid-template-columns:1fr 1fr}
}

@media (max-width:640px){
  :root{--header-h:66px}
  .marca img{height:32px}
  .area__links{grid-template-columns:1fr}
  .rodape__grid{grid-template-columns:1fr}
  .secao__topo{align-items:flex-start}
  .regs li{padding-right:var(--sp-3);margin-right:var(--sp-3)}
  .prose>section+section{margin-top:var(--sp-8)}
  .registros{padding:var(--sp-3) var(--sp-4)}
  .fab{right:12px;bottom:12px;padding:10px}
  .fab__txt{display:none}
  .cookies{left:12px;right:12px;bottom:12px;padding:var(--sp-3)}
  .cookies__acoes,.cookies__actions{width:100%;margin-left:0}
  .cookies__acoes .btn{flex:1}
  /* sem o formulário o painel encurtou e o monograma caía sobre o aviso */
  .cta__marca{display:none}
  .hero__acoes{flex-direction:column;align-items:flex-start;gap:var(--sp-3)}
  .hero__acoes .btn{width:100%}
  .hero__lead{margin-bottom:var(--sp-4)}
  .regs--linha{padding-block:var(--sp-2) 0;margin-bottom:var(--sp-4)}
  .hero__figura img{max-width:320px}

  /* As pílulas empilhadas uma por linha ficavam com larguras irregulares e
     comiam meia tela. No mobile viram uma lista: um cartão só, linhas de
     largura cheia separadas por filete, seta alinhada à direita. */
  .queixas__lista{
    display:block;border:1px solid var(--line);border-radius:var(--r-md);
    background:var(--card);overflow:hidden;
  }
  .queixa{
    display:flex;width:100%;justify-content:space-between;
    border:0;border-radius:0;background:transparent;padding:15px 16px;
  }
  .queixa+.queixa{border-top:1px solid var(--line)}
  .queixa:hover,.queixa:active{transform:none;box-shadow:none;color:var(--ink-2)}
  /* o preenchimento que sobe é gesto de ponteiro; no toque o hover fica
     preso depois do tap e deixaria a linha escura sem motivo */
  .queixa::before{display:none}
  .queixa:active{background:var(--wash)}
  .queixa:hover svg,.queixa:active svg{color:var(--aco)}
  .queixas__inner{padding-block:var(--sp-5)}
}

/* o banner de cookies sobe o FAB no mobile para os dois não colidirem */
body:has(.cookies.is-visible) .fab{transform:translateY(-96px)}
@media (min-width:641px){body:has(.cookies.is-visible) .fab{transform:none}}

/* Instagram — só o símbolo, sem o handle em texto.
   No rodapé o ícone alinha à esquerda com os links de texto acima, e herda
   o mesmo deslocamento de 5px no hover que os irmãos, então lê como parte da lista. */
.rodape__ig{display:inline-flex;padding-block:4px}
.rodape__ig svg{width:20px;height:20px;display:block}

/* Dentro de botão: o .btn:hover svg desloca na diagonal, gesto desenhado para
   as setas. Num logo isso lê como defeito, então o ícone de marca não se move. */
.btn .ic-ig{width:17px;height:17px}
.btn:hover .ic-ig{transform:none}

/* ============================================================
   Correções de UI — 23/08/2026
   ============================================================ */

/* A margem lateral de 40px nas figuras não estava no CSS: é o padrão do
   navegador para <figure> (margin: 1em 40px). O .foto definia margin-block e
   nunca zerava o lateral, então a imagem ficava 80px mais estreita que o texto
   e desalinhada dele em 13 páginas. No celular custava 21% da largura útil. */
figure{margin-inline:0}

/* Proporção única para a imagem temática das páginas clínicas.
   As fontes variam de 1.17 a 3.10, o que fazia o mesmo bloco medir de 217px a
   575px de altura conforme a página. Agora o layout dita a proporção e a
   imagem se ajusta por recorte, não o contrário. */
.foto{aspect-ratio:16/9;background:var(--wash)}
.foto img{width:100%;height:100%;object-fit:cover;display:block}

/* Ritmo vertical do corpo clínico.
   Os espaços entre blocos vinham em 42, 64, 80 e 86px — quatro valores sem
   critério, porque figure e aside traziam margem própria que ora colapsava com
   a da seção, ora não. Um valor só, e o colapso deixa de importar. */
.prose>section+section,
.prose>figure+section,
.prose>aside+section,
.prose>section+figure,
.prose>section+aside{margin-top:var(--sp-10)}
.prose>figure,.prose>aside{margin-block:var(--sp-10)}

/* Separador entre seções: numa página de 4.600px, blocos só com espaço em
   branco não deixam ver onde um assunto termina e o outro começa. */
.prose>section+section{border-top:1px solid var(--line);padding-top:var(--sp-8)}

@media (max-width:700px){
  /* No celular a imagem ocupa a largura toda do texto e fica mais alta,
     porque 16/9 num bloco de 335px vira uma faixa de 188px. */
  .foto{aspect-ratio:4/3}
}