/* ============================================================
   LFP.MED.BR — Dr. Luiz Felipe Pitzer Jacob · Cirurgião Geral
   Design system: porcelana + verde-cirúrgico · precisão editorial
   ============================================================ */

/* ---------- fontes (self-hosted, subset latin) ---------- */
@font-face{
  font-family:'Archivo';
  font-style:normal;
  font-weight:400 700;
  font-display:swap;
  src:url('../fonts/archivo-var-latin.woff2') format('woff2');
}
@font-face{
  font-family:'Newsreader';
  font-style:italic;
  font-weight:400 600;
  font-display:swap;
  src:url('../fonts/newsreader-italic-var-latin.woff2') format('woff2');
}
@font-face{
  font-family:'IBM Plex Mono';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url('../fonts/plex-mono-400-latin.woff2') format('woff2');
}
@font-face{
  font-family:'IBM Plex Mono';
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url('../fonts/plex-mono-500-latin.woff2') format('woff2');
}

/* ---------- tokens ---------- */
:root{
  --porcelana:#F6F7F4;
  --campo:#0F312C;          /* verde-cirúrgico profundo */
  --campo-2:#14423A;        /* variação p/ gradientes   */
  --verde:#2A7A66;          /* acento                   */
  --menta:#9BCDBB;          /* acento sobre escuro      */
  --tinta:#172220;
  --cinza:#5B6661;
  --linha:#DCE2DC;
  --branco:#FFFFFF;
  --whats:#1FA855;
  --maxw:1180px;
  --gutter:clamp(24px,4vw,32px);
  --ruler-w:34px;
  --sans:'Archivo',system-ui,-apple-system,sans-serif;
  --serif:'Newsreader',Georgia,serif;
  --mono:'IBM Plex Mono',ui-monospace,monospace;
  --ease-out:cubic-bezier(.22,.7,.24,1);
  --ease-swift:cubic-bezier(.6,0,.18,1);
}

/* ---------- reset ---------- */
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--sans);
  background:var(--porcelana);
  color:var(--tinta);
  line-height:1.65;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
  overflow-x:clip;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
::selection{background:var(--verde);color:#fff}
:focus-visible{outline:2px solid var(--verde);outline-offset:3px}

.skip-link{
  position:fixed;top:-60px;left:12px;z-index:200;
  background:var(--campo);color:#fff;padding:10px 18px;border-radius:2px;
  font-size:13.5px;transition:top .2s;
}
.skip-link:focus{top:12px}

/* ============================================================
   RÉGUA DE PRECISÃO (assinatura da marca)
   ============================================================ */
.ruler{
  position:fixed;left:0;top:0;bottom:0;width:var(--ruler-w);
  border-right:1px solid var(--linha);background:var(--porcelana);
  z-index:50;display:flex;flex-direction:column;
}
.ruler-ticks{
  flex:1;position:relative;margin:0 8px 0 auto;width:10px;
  background:repeating-linear-gradient(to bottom,transparent 0 9px,var(--linha) 9px 10px);
}
.ruler-ticks::before{
  content:"";position:absolute;left:-8px;right:0;top:0;height:100%;
  background:repeating-linear-gradient(to bottom,transparent 0 49px,var(--linha) 49px 50px);
}
.ruler-marker{
  position:fixed;left:0;width:var(--ruler-w);height:2px;background:var(--verde);
  top:0;z-index:51;
}
.ruler-label{
  position:fixed;left:7px;bottom:14px;writing-mode:vertical-rl;transform:rotate(180deg);
  font-family:var(--mono);font-size:10px;letter-spacing:.18em;color:var(--cinza);z-index:52;
}
.ruler-pct{
  position:fixed;left:5px;top:12px;z-index:52;
  font-family:var(--mono);font-size:9px;letter-spacing:.06em;color:var(--verde);
  writing-mode:vertical-rl;transform:rotate(180deg);
  font-variant-numeric:tabular-nums;
}

/* ============================================================
   CURSOR CUSTOMIZADO (desktop / ponteiro fino)
   ============================================================ */
.cursor-dot,.cursor-ring{
  position:fixed;top:0;left:0;pointer-events:none;z-index:300;
  border-radius:50%;opacity:0;
}
.cursor-dot{width:5px;height:5px;background:var(--verde)}
.cursor-ring{
  width:34px;height:34px;border:1px solid rgba(42,122,102,.55);
  transition:width .25s var(--ease-out),height .25s var(--ease-out),
             border-color .25s,background-color .25s;
}
html.cursor-on .cursor-dot,html.cursor-on .cursor-ring{opacity:1}
html.cursor-hover .cursor-ring{
  width:56px;height:56px;background:rgba(42,122,102,.08);border-color:var(--verde);
}
html.cursor-press .cursor-ring{width:26px;height:26px}
@media (hover:none),(pointer:coarse){
  .cursor-dot,.cursor-ring{display:none}
}

/* ============================================================
   TOPO / NAVEGAÇÃO
   ============================================================ */
.site-head{
  position:fixed;top:0;left:0;right:0;z-index:90;
  background:rgba(246,247,244,.9);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--linha);
  transition:transform .45s var(--ease-swift),box-shadow .3s,
             background-color .4s ease,border-color .4s ease;
}
.site-head .brand b,.site-head .brand .crm,.site-head nav.links{transition:color .4s ease}
.ruler,.ruler-ticks,.ruler-label{transition:background-color .4s ease,border-color .4s ease,color .4s ease}
.site-head.is-hidden{transform:translateY(-100%)}
.nav{
  max-width:var(--maxw);margin:0 auto;height:64px;
  padding:0 var(--gutter) 0 calc(var(--ruler-w) + 28px);
  display:flex;align-items:center;justify-content:space-between;gap:20px;
}
.brand{display:flex;align-items:baseline;gap:12px;white-space:nowrap}
.brand b{font-weight:600;letter-spacing:-.01em}
.brand .crm{font-family:var(--mono);font-size:10.5px;color:var(--cinza);letter-spacing:.08em}
nav.links{display:flex;gap:clamp(14px,2vw,26px);font-size:13.5px;color:var(--cinza)}
nav.links a{position:relative;padding:4px 0;transition:color .2s}
nav.links a::after{
  content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;background:var(--verde);
  transition:right .3s var(--ease-out);
}
nav.links a:hover,nav.links a[aria-current="page"]{color:var(--tinta)}
nav.links a:hover::after,nav.links a[aria-current="page"]::after{right:0}
.nav-cta{display:flex;align-items:center;gap:12px}

/* botão hambúrguer */
.burger{
  display:none;width:42px;height:42px;position:relative;z-index:120;
  align-items:center;justify-content:center;
}
.burger span{
  position:absolute;left:10px;right:10px;height:1.5px;background:var(--tinta);
  transition:transform .35s var(--ease-swift),opacity .25s,background .25s;
}
.burger span:nth-child(1){transform:translateY(-5px)}
.burger span:nth-child(3){transform:translateY(5px)}
body.menu-open .burger span{background:#fff}
body.menu-open .burger span:nth-child(1){transform:rotate(45deg)}
body.menu-open .burger span:nth-child(2){opacity:0}
body.menu-open .burger span:nth-child(3){transform:rotate(-45deg)}

/* menu mobile */
.mobile-menu{
  position:fixed;inset:0;z-index:110;background:var(--campo);color:#fff;
  display:flex;flex-direction:column;justify-content:center;
  padding:96px var(--gutter) 48px;
  clip-path:inset(0 0 100% 0);visibility:hidden;
  transition:clip-path .55s var(--ease-swift),visibility 0s .55s;
}
body.menu-open .mobile-menu{
  clip-path:inset(0 0 0% 0);visibility:visible;
  transition:clip-path .55s var(--ease-swift),visibility 0s;
}
.mobile-menu a.mm-link,.mobile-menu .mm-foot{
  opacity:0;transform:translateY(16px);
  transition:opacity .4s ease,transform .45s var(--ease-out);
}
body.menu-open .mobile-menu a.mm-link,body.menu-open .mobile-menu .mm-foot{
  opacity:1;transform:none;
  transition-delay:calc(.16s + var(--i,0)*.055s);
}
.mobile-menu nav{display:flex;flex-direction:column;gap:6px}
.mobile-menu a.mm-link{
  font-size:clamp(28px,7vw,40px);font-weight:500;letter-spacing:-.02em;
  padding:8px 0;border-bottom:1px solid rgba(255,255,255,.1);
  display:flex;justify-content:space-between;align-items:center;
}
.mobile-menu a.mm-link .idx{font-family:var(--mono);font-size:11px;color:var(--menta);letter-spacing:.14em}
.mobile-menu a.mm-link em{font-family:var(--serif);font-style:italic;font-weight:500}
.mobile-menu .mm-foot{
  margin-top:36px;display:flex;flex-wrap:wrap;gap:10px;
}
.mobile-menu .mm-foot a{
  font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;color:var(--menta);
  border:1px solid rgba(255,255,255,.2);padding:9px 16px;border-radius:999px;
}

/* ============================================================
   LAYOUT BASE
   ============================================================ */
main{padding-top:64px}
/* na home o hero cinematográfico passa por baixo do cabeçalho fixo,
   que flutua transparente sobre a foto (ver body.hero-dark) */
main.has-cine{padding-top:0}
.wrap{
  max-width:var(--maxw);margin:0 auto;
  padding-left:calc(var(--ruler-w) + 28px);padding-right:var(--gutter);
}
section{position:relative}
.sec{padding:clamp(72px,10vh,120px) 0;border-bottom:1px solid var(--linha)}
.eyebrow{
  font-family:var(--mono);font-size:11.5px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--verde);display:flex;align-items:center;gap:12px;margin-bottom:22px;
}
.eyebrow::after{content:"";height:1px;width:48px;background:var(--verde)}
.eyebrow .n{color:var(--cinza)}
h1,h2,h3{font-weight:500;letter-spacing:-.02em;line-height:1.1;text-wrap:balance}
h2{font-size:clamp(28px,3.6vw,44px);margin-bottom:18px}
.lede{max-width:62ch;color:var(--cinza);font-size:17px;text-wrap:pretty}
em.h{font-family:var(--serif);font-style:italic;font-weight:500;color:var(--verde)}
.sec-head{margin-bottom:clamp(36px,5vh,56px)}
.sec-head .row{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap}

/* ---------- botões ---------- */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  background:var(--campo);color:#fff;padding:12px 22px;border-radius:2px;
  font-size:13.5px;font-weight:500;letter-spacing:.02em;cursor:pointer;
  position:relative;overflow:hidden;transition:color .3s,border-color .3s,background .3s;
  isolation:isolate;
}
.btn::before{
  content:"";position:absolute;inset:0;background:var(--verde);z-index:-1;
  transform:scaleY(0);transform-origin:bottom;transition:transform .35s var(--ease-swift);
}
.btn:hover::before{transform:scaleY(1)}
.btn .arr{transition:transform .3s var(--ease-out)}
.btn:hover .arr{transform:translateX(4px)}
.btn.ghost{background:transparent;color:var(--tinta);border:1px solid var(--tinta)}
.btn.ghost::before{background:var(--campo)}
.btn.ghost:hover{color:#fff;border-color:var(--campo)}
.btn.invert{background:#fff;color:var(--campo)}
.btn.invert::before{background:var(--menta)}
.btn.invert:hover{color:var(--campo)}
.btn.whats{background:var(--whats)}
.btn.whats::before{background:#179447}
.link-more{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--verde);padding:6px 0;position:relative;
}
.link-more::after{
  content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;
  background:var(--verde);transform:scaleX(.35);transform-origin:left;
  transition:transform .35s var(--ease-out);
}
.link-more:hover::after{transform:scaleX(1)}
.link-more .arr{transition:transform .3s}
.link-more:hover .arr{transform:translateX(4px)}

/* ============================================================
   HERO CINEMATOGRÁFICO (home)
   A foto é o fundo da primeira tela. O véu escuro garante o
   contraste do texto; object-position mantém o rosto acima do
   bloco de texto — ver nota em .hc-bg img.
   ============================================================ */
.hero-cine{
  position:relative;min-height:100svh;overflow:hidden;color:#fff;
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:0 0 clamp(52px,9vh,100px);
  border-bottom:1px solid var(--linha);
}
.hc-bg{position:absolute;inset:0;z-index:0}
/* Y=25%: sobe a foto o suficiente para os olhos ficarem acima do nome em
   telas panorâmicas, sem jogar o rosto para o topo. Em telas retrato o
   corte é horizontal e o Y não atua. */
.hc-bg img{width:100%;height:100%;object-fit:cover;object-position:60% 25%}
/* véu leve: a foto já tem fundo escuro, então basta firmar a base */
.hc-veil{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(to top,rgba(10,32,28,.92) 0%,rgba(10,32,28,.78) 30%,rgba(10,32,28,.44) 52%,rgba(10,32,28,.14) 76%,rgba(10,32,28,.26) 100%),
    linear-gradient(100deg,rgba(10,32,28,.72) 0%,rgba(10,32,28,.30) 46%,transparent 74%);
}
.hc-grid{
  position:absolute;inset:0;z-index:2;opacity:.5;pointer-events:none;
  background-image:linear-gradient(rgba(155,205,187,.05) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(155,205,187,.05) 1px,transparent 1px);
  background-size:120px 120px;
}
.hc-inner{
  position:relative;z-index:5;max-width:var(--maxw);margin:0 auto;width:100%;
  padding:0 var(--gutter) 0 calc(var(--ruler-w) + 28px);
}
.hc-kick{
  font-family:var(--mono);font-size:11.5px;letter-spacing:.24em;text-transform:uppercase;
  color:var(--menta);margin-bottom:20px;display:flex;align-items:center;gap:10px;
}
.hc-kick i{width:26px;height:1px;background:var(--menta);display:block;flex:none}
h1.display{
  font-size:clamp(38px,6.6vw,88px);font-weight:500;letter-spacing:-.034em;line-height:1;
  margin-bottom:20px;
}
h1.display .line{display:block;overflow:hidden;padding-bottom:.04em}
h1.display .word{display:inline-block}
.hc-creds{
  font-family:var(--mono);font-size:12.5px;letter-spacing:.06em;
  color:rgba(255,255,255,.74);margin-bottom:16px;
}
.hc-creds b{color:#fff;font-weight:500}
.hc-quote{
  font-family:var(--serif);font-style:italic;font-size:clamp(18px,2.2vw,26px);
  color:#D7E8DF;max-width:32ch;margin-bottom:32px;text-wrap:pretty;
}
.hc-cta{display:flex;gap:14px;flex-wrap:wrap}
.hc-meta{
  margin-top:36px;display:flex;gap:26px;flex-wrap:wrap;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;
  color:rgba(255,255,255,.62);text-transform:uppercase;
}
.hc-meta span{display:flex;align-items:center;gap:8px}
.hc-meta .tick{color:var(--menta)}

/* indicador de rolagem */
.hc-scroll{
  position:absolute;right:clamp(20px,4vw,52px);bottom:clamp(52px,9vh,100px);z-index:5;
  display:flex;flex-direction:column;align-items:center;gap:10px;writing-mode:vertical-rl;
  font-family:var(--mono);font-size:10px;letter-spacing:.2em;color:rgba(255,255,255,.5);
}
.hc-scroll .rail{width:1px;height:56px;background:rgba(255,255,255,.22);position:relative;overflow:hidden}
.hc-scroll .rail::after{
  content:"";position:absolute;top:0;left:0;width:1px;height:40%;background:var(--menta);
  animation:hc-rail 2.2s cubic-bezier(.6,0,.2,1) infinite;
}
@keyframes hc-rail{0%{transform:translateY(-100%)}100%{transform:translateY(250%)}}

/* ------------------------------------------------------------
   Estado "hero escuro": enquanto a primeira tela está visível,
   o cabeçalho e a régua ficam transparentes e claros, para não
   cortar a foto com uma faixa clara. O JS alterna body.hero-dark.
   ------------------------------------------------------------ */
body.hero-dark .site-head{
  background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;
  border-bottom-color:transparent;
}
body.hero-dark .brand b{color:#fff}
body.hero-dark .brand .crm{color:rgba(255,255,255,.58)}
body.hero-dark nav.links{color:rgba(255,255,255,.74)}
body.hero-dark nav.links a:hover,
body.hero-dark nav.links a[aria-current="page"]{color:#fff}
body.hero-dark nav.links a::after{background:var(--menta)}
body.hero-dark .nav-cta .btn{
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.3);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
}
body.hero-dark .nav-cta .btn::before{background:#fff}
body.hero-dark .nav-cta .btn:hover{color:var(--campo);border-color:#fff}
body.hero-dark:not(.menu-open) .burger span{background:#fff}
body.hero-dark .ruler{background:transparent;border-right-color:rgba(255,255,255,.14)}
body.hero-dark .ruler-ticks{
  background:repeating-linear-gradient(to bottom,transparent 0 9px,rgba(255,255,255,.17) 9px 10px);
}
body.hero-dark .ruler-ticks::before{
  background:repeating-linear-gradient(to bottom,transparent 0 49px,rgba(255,255,255,.17) 49px 50px);
}
body.hero-dark .ruler-label{color:rgba(255,255,255,.45)}
body.hero-dark .ruler-marker{background:var(--menta)}

/* fundo suave reaproveitado nos heros internos */
.hero-bg{
  position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(52% 44% at 82% 18%,rgba(42,122,102,.07),transparent 70%),
    radial-gradient(40% 40% at 12% 86%,rgba(42,122,102,.05),transparent 70%);
}
.creds{
  font-family:var(--mono);font-size:13px;color:var(--cinza);letter-spacing:.04em;margin-bottom:24px;
}
.creds b{color:var(--tinta);font-weight:500}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap}

@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}

/* ============================================================
   MARQUEE
   ============================================================ */
.marquee{
  border-bottom:1px solid var(--linha);background:var(--branco);
  overflow:hidden;padding:18px 0;position:relative;
}
.marquee-track{
  display:flex;gap:0;width:max-content;
  animation:marquee 36s linear infinite;
}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee-seq{display:flex;align-items:center;white-space:nowrap}
.marquee-seq span{
  font-family:var(--mono);font-size:12.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--cinza);padding:0 28px;
}
.marquee-seq .plus{color:var(--verde);padding:0;font-size:14px}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ============================================================
   STATS
   ============================================================ */
.stats-band{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--linha)}
.stat-cell{
  padding:clamp(28px,4vh,44px) 28px;border-right:1px solid var(--linha);
  display:flex;flex-direction:column;gap:6px;
}
.stat-cell:last-child{border-right:none}
.stat-cell .n{
  font-size:clamp(34px,3.4vw,46px);font-weight:500;letter-spacing:-.03em;color:var(--campo);
  font-variant-numeric:tabular-nums;line-height:1;
}
.stat-cell .n sup{font-size:.5em;color:var(--verde);font-weight:500}
.stat-cell .d{font-size:13.5px;color:var(--cinza);max-width:24ch}

/* versão em coluna (página sobre) */
.stats{display:grid;border-top:1px solid var(--linha)}
.stat{display:flex;align-items:baseline;gap:20px;padding:22px 0;border-bottom:1px solid var(--linha)}
.stat .n{font-size:38px;font-weight:500;letter-spacing:-.03em;color:var(--campo);min-width:96px}
.stat .d{font-size:14px;color:var(--cinza)}

/* ============================================================
   SPLIT EDITORIAL (sobre resumido, etc.)
   ============================================================ */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,72px);align-items:start}
.split .media{position:relative}
.split .media .frame{position:absolute;top:18px;left:18px;right:-18px;bottom:-18px;border:1px solid var(--linha)}
.split .media .ph-mask{position:relative;overflow:hidden}
.split .media img{width:100%;height:auto;filter:saturate(.92)}
.prose p{margin-bottom:18px;color:var(--cinza);text-wrap:pretty}
.prose p strong{color:var(--tinta);font-weight:500}

/* ============================================================
   CARDS DE ESPECIALIDADE
   ============================================================ */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.card{
  background:var(--branco);border:1px solid var(--linha);border-radius:2px;overflow:hidden;
  display:flex;flex-direction:column;position:relative;
  transition:border-color .3s,transform .45s var(--ease-out),box-shadow .45s;
}
.card:hover{border-color:var(--verde);transform:translateY(-6px);box-shadow:0 24px 48px -28px rgba(15,49,44,.28)}
.card .ph{overflow:hidden;aspect-ratio:16/10}
.card .ph img{width:100%;height:100%;object-fit:cover;filter:saturate(.9);transition:transform .8s var(--ease-out)}
.card:hover .ph img{transform:scale(1.06)}
.card-body{padding:24px 24px 28px;flex:1;display:flex;flex-direction:column;gap:10px}
.card h3{font-size:20px;line-height:1.25}
.card p{font-size:14.5px;color:var(--cinza);flex:1}
.card .tag{
  align-self:flex-start;font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--verde);border:1px solid var(--linha);
  padding:5px 10px;border-radius:2px;
}
.card .card-link{
  display:inline-flex;align-items:center;gap:8px;margin-top:6px;
  font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--tinta);
}
.card .card-link .arr{color:var(--verde);transition:transform .3s}
.card:hover .card-link .arr{transform:translateX(4px)}
a.card-cover{position:absolute;inset:0;z-index:1}
a.card-cover:focus-visible{outline-offset:-2px}

/* ============================================================
   STATEMENT (frase de impacto sobre fundo escuro)
   ============================================================ */
.statement{
  background:linear-gradient(160deg,var(--campo) 0%,var(--campo-2) 100%);
  color:#fff;border-bottom:none;overflow:hidden;position:relative;
}
.statement .grid-lines{
  position:absolute;inset:0;opacity:.35;pointer-events:none;
  background-image:linear-gradient(rgba(155,205,187,.07) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(155,205,187,.07) 1px,transparent 1px);
  background-size:120px 120px;
}
.statement blockquote{
  font-family:var(--serif);font-style:italic;font-weight:400;
  font-size:clamp(26px,3.8vw,46px);line-height:1.28;letter-spacing:-.01em;
  max-width:24em;text-wrap:pretty;
}
.statement blockquote .w{opacity:.18;display:inline-block;transition:opacity .3s}
.statement blockquote .w.on{opacity:1}
.statement figcaption{
  margin-top:28px;font-family:var(--mono);font-size:11.5px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--menta);
}

/* ============================================================
   COMO FUNCIONA (passos com linha de progresso)
   ============================================================ */
.steps{position:relative;display:grid;gap:0;margin-top:8px}
.steps::before{
  content:"";position:absolute;left:19px;top:8px;bottom:8px;width:1px;background:var(--linha);
}
.steps .line-fill{
  position:absolute;left:19px;top:8px;width:1px;background:var(--verde);
  height:100%;transform:scaleY(0);transform-origin:top;
}
.step{
  position:relative;display:grid;grid-template-columns:60px 1fr;gap:18px;
  padding:26px 0;
}
.step .num{
  width:40px;height:40px;border-radius:50%;border:1px solid var(--linha);background:var(--porcelana);
  display:flex;align-items:center;justify-content:center;position:relative;z-index:1;
  font-family:var(--mono);font-size:12.5px;color:var(--verde);
  transition:background .3s,border-color .3s,color .3s;
}
.step.is-active .num{background:var(--campo);border-color:var(--campo);color:#fff}
.step h3{font-size:19px;margin-bottom:6px}
.step p{font-size:14.5px;color:var(--cinza);max-width:56ch}
.step .mini{
  margin-top:10px;display:flex;flex-wrap:wrap;gap:8px;
}
.step .mini span{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--cinza);border:1px solid var(--linha);padding:4px 10px;border-radius:999px;background:var(--branco);
}

/* ============================================================
   EDUCAÇÃO — CARDS DE ARTIGO
   ============================================================ */
.edu-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.edu-card{
  position:relative;background:var(--branco);border:1px solid var(--linha);border-radius:2px;
  padding:26px;display:flex;flex-direction:column;gap:12px;min-height:220px;
  transition:border-color .3s,transform .45s var(--ease-out),box-shadow .45s;
  overflow:hidden;
}
.edu-card::after{
  content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--verde);
  transform:scaleY(0);transform-origin:top;transition:transform .4s var(--ease-out);
}
.edu-card:hover{border-color:var(--verde);transform:translateY(-5px);box-shadow:0 22px 44px -30px rgba(15,49,44,.3)}
.edu-card:hover::after{transform:scaleY(1)}
.edu-card .cat{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--verde);
}
.edu-card h3{font-size:19px;line-height:1.3}
.edu-card p{font-size:14px;color:var(--cinza);flex:1}
.edu-card .meta{
  display:flex;justify-content:space-between;align-items:center;
  font-family:var(--mono);font-size:11px;color:var(--cinza);letter-spacing:.06em;
}
.edu-card .meta .arr{color:var(--verde);font-size:14px;transition:transform .3s}
.edu-card:hover .meta .arr{transform:translateX(4px)}

/* ============================================================
   TRAJETÓRIA / TIMELINE
   ============================================================ */
.tl{border-top:1px solid var(--linha)}
.tl-item{display:grid;grid-template-columns:180px 1fr;gap:32px;padding:26px 0;border-bottom:1px solid var(--linha)}
.tl-when{font-family:var(--mono);font-size:12.5px;color:var(--cinza);letter-spacing:.04em;padding-top:3px}
.tl-when .live{
  display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--verde);
  margin-right:8px;animation:pulse 2.4s infinite;
}
.tl-item h3{font-size:18px;margin-bottom:4px}
.tl-item p{font-size:14.5px;color:var(--cinza)}
.tl-item p b{color:var(--tinta);font-weight:500}
details.past{margin-top:36px}
details.past summary{
  cursor:pointer;font-family:var(--mono);font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--cinza);list-style:none;display:flex;align-items:center;gap:10px;
}
details.past summary::-webkit-details-marker{display:none}
details.past summary::after{content:"+";font-size:16px;color:var(--verde);transition:transform .2s}
details.past[open] summary::after{transform:rotate(45deg)}
details.past .tl{margin-top:20px}
details.past .tl-item h3{font-size:16px}

/* formação + prêmios */
.edu-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:28px}
.edu-item{
  background:var(--branco);border:1px solid var(--linha);border-radius:2px;padding:26px;
  transition:border-color .3s,transform .4s var(--ease-out);
}
.edu-item:hover{border-color:var(--verde);transform:translateY(-4px)}
.edu-item .y{font-family:var(--mono);font-size:12px;color:var(--verde);letter-spacing:.1em;margin-bottom:10px}
.edu-item h3{font-size:18px;margin-bottom:6px}
.edu-item p{font-size:14px;color:var(--cinza)}
/* mentores — "com quem aprendi" */
.mentores{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(24px,4vw,56px);
  border-top:1px solid var(--linha);
}
.mentor{
  display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 16px;
  padding:14px 0;border-bottom:1px solid var(--linha);
}
.mentor b{font-weight:500;font-size:15.5px;letter-spacing:-.01em}
.mentor span{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--cinza);white-space:nowrap;
}
/* abaixo de ~900px a coluna fica estreita e a especialidade quebraria em
   apenas alguns nomes, deixando a lista irregular — aqui empilha em todos */
@media (max-width:880px){
  .mentor{flex-direction:column;align-items:flex-start;gap:4px}
}
.sub-head{margin-bottom:22px}
.sub-head h3{font-size:19px;font-weight:500;margin-bottom:8px}
.sub-head p{font-size:15px;color:var(--cinza);max-width:62ch}

.awards{border-top:1px solid var(--linha)}
.award{
  display:grid;grid-template-columns:1fr 240px;gap:24px;padding:20px 0;
  border-bottom:1px solid var(--linha);align-items:baseline;
}
.award h3{font-size:17px}
.award .m{font-family:var(--mono);font-size:12px;color:var(--cinza);text-align:right;letter-spacing:.04em}

/* ============================================================
   LOCAIS + PLANOS
   ============================================================ */
.locais{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.local{
  border:1px solid var(--linha);background:var(--branco);border-radius:3px;
  padding:26px 24px;position:relative;overflow:hidden;
  display:flex;flex-direction:column;align-items:flex-start;
  transition:border-color .3s,transform .4s var(--ease-out),box-shadow .4s,background-color .3s;
}
.local::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--verde)}
.local:hover{border-color:var(--verde);transform:translateY(-4px);box-shadow:0 20px 40px -30px rgba(15,49,44,.3)}
.local h3{font-size:19px;line-height:1.3;margin-bottom:10px;letter-spacing:-.015em}
.local .badge{
  font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--verde);border:1px solid rgba(42,122,102,.32);background:rgba(42,122,102,.07);
  padding:5px 10px;border-radius:999px;margin-bottom:16px;
}
.local h3+address{margin-top:6px}
.local address{
  font-style:normal;font-size:14px;color:var(--cinza);line-height:1.55;
  display:flex;gap:10px;align-items:flex-start;
}
.local .pin{flex:none;width:16px;height:16px;margin-top:3px}
.local .pin svg{width:16px;height:16px;fill:var(--verde);display:block}
.local-tel{display:flex;flex-direction:column;gap:2px;margin-top:12px;padding-left:26px}
.local-tel a{
  font-family:var(--mono);font-size:12.5px;letter-spacing:.04em;color:var(--tinta);
  width:fit-content;border-bottom:1px solid transparent;transition:color .2s,border-color .2s;
}
.local-tel a:hover{color:var(--verde);border-color:var(--verde)}
.local-acoes{display:flex;gap:8px;flex-wrap:wrap;margin-top:auto;padding-top:22px;width:100%}
.local-acoes a{
  display:inline-flex;align-items:center;gap:6px;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--verde);border:1px solid var(--linha);padding:8px 13px;border-radius:2px;
  transition:background .25s,border-color .25s,color .25s;
}
.local-acoes a:hover{background:var(--campo);border-color:var(--campo);color:#fff}
.nota-unimed{
  margin-top:26px;max-width:78ch;font-size:13.5px;color:var(--cinza);
  border-left:2px solid var(--verde);padding-left:16px;
}
.nota-unimed b{color:var(--tinta);font-weight:500}
@media (hover:none),(pointer:coarse){
  .local-tel{gap:0}
  .local-tel a{padding:9px 0}
  .local-acoes a{padding:12px 16px}
}
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip{
  font-size:13px;border:1px solid var(--linha);background:var(--branco);
  padding:7px 16px;border-radius:2px;color:var(--cinza);transition:border-color .25s,color .25s;
}
.chip:hover{border-color:var(--verde);color:var(--tinta)}
.note{font-size:12.5px;color:var(--cinza);margin-top:16px;font-style:italic}
.filterbar{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:40px}
.filterbar .chip{cursor:pointer;font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase}
.filterbar .chip.active{background:var(--campo);color:#fff;border-color:var(--campo)}

/* ============================================================
   PUBLICAÇÕES
   ============================================================ */
.pub-list{border-top:1px solid var(--linha)}
.pub-item{
  display:grid;grid-template-columns:96px minmax(0,1fr) auto;gap:clamp(18px,3vw,36px);
  align-items:start;padding:clamp(20px,3vh,30px) 0;border-bottom:1px solid var(--linha);
  position:relative;transition:padding-left .4s var(--ease-out);
}
.pub-item:hover{padding-left:12px}
.pub-item .year{
  font-family:var(--mono);font-size:13px;color:var(--verde);letter-spacing:.06em;padding-top:3px;
  font-variant-numeric:tabular-nums;
}
.pub-item h3{font-size:17.5px;line-height:1.35;margin-bottom:6px;font-weight:500}
.pub-item .authors{font-size:14px;color:var(--cinza);margin-bottom:6px}
.pub-item .authors b{color:var(--tinta);font-weight:500}
.pub-item .venue{
  font-family:var(--mono);font-size:12px;color:var(--cinza);letter-spacing:.04em;
  display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;
}
.pub-item .venue em{font-style:normal;color:var(--verde)}
.pub-item .type{
  align-self:start;font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--verde);border:1px solid var(--linha);padding:5px 10px;border-radius:2px;white-space:nowrap;
  background:var(--branco);
}
.pub-item .pub-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.pub-item .pub-links a{
  display:inline-flex;align-items:center;gap:6px;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--verde);border:1px solid var(--linha);padding:7px 12px;border-radius:2px;
  background:var(--branco);transition:background .25s,border-color .25s,color .25s;
}
.pub-item .pub-links a:hover{background:var(--campo);border-color:var(--campo);color:#fff}

/* documentos incorporados (Scribd) */
.docs{display:grid;gap:clamp(30px,5vh,48px)}
.doc{border:1px solid var(--linha);background:var(--branco);border-radius:2px;overflow:hidden}
.doc-head{
  padding:20px 22px;border-bottom:1px solid var(--linha);
  display:flex;align-items:flex-start;justify-content:space-between;gap:14px;flex-wrap:wrap;
}
.doc-head h3{font-size:16.5px;font-weight:500;line-height:1.35;max-width:60ch}
.doc-head .type{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--verde);border:1px solid var(--linha);padding:5px 10px;border-radius:2px;white-space:nowrap;
}
.doc-frame{background:var(--porcelana)}
.doc-frame iframe{display:block;width:100%;height:600px;border:0}
.doc-foot{
  padding:13px 22px;border-top:1px solid var(--linha);
  display:flex;gap:8px 18px;flex-wrap:wrap;align-items:center;
  font-family:var(--mono);font-size:11px;letter-spacing:.08em;color:var(--cinza);
}
.doc-foot a{color:var(--verde);border-bottom:1px solid transparent;transition:border-color .2s}
.doc-foot a:hover{border-color:var(--verde)}

.pub-empty{
  border:1px dashed var(--linha);border-radius:2px;background:var(--branco);
  padding:clamp(28px,5vw,44px);text-align:center;
}
.pub-empty .ic{
  width:44px;height:44px;margin:0 auto 18px;border:1px solid var(--linha);border-radius:50%;
  display:flex;align-items:center;justify-content:center;color:var(--verde);font-size:18px;
}
.pub-empty h3{font-size:19px;margin-bottom:10px}
.pub-empty p{font-size:14.5px;color:var(--cinza);max-width:52ch;margin:0 auto 22px}

/* ============================================================
   FAQ / ACCORDION
   ============================================================ */
.faq{border-top:1px solid var(--linha);max-width:820px}
.faq-item{border-bottom:1px solid var(--linha)}
.faq-q{
  width:100%;display:flex;justify-content:space-between;align-items:center;gap:20px;
  padding:20px 2px;text-align:left;font-size:16.5px;font-weight:500;letter-spacing:-.01em;
  transition:color .25s;
}
.faq-q:hover{color:var(--verde)}
.faq-q .ic{
  flex:none;width:30px;height:30px;border:1px solid var(--linha);border-radius:50%;
  display:flex;align-items:center;justify-content:center;color:var(--verde);
  transition:transform .35s var(--ease-swift),background .3s,color .3s,border-color .3s;
}
.faq-item.open .faq-q .ic{transform:rotate(45deg);background:var(--campo);border-color:var(--campo);color:#fff}
.faq-a{
  display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s var(--ease-swift);
}
.faq-item.open .faq-a{grid-template-rows:1fr}
.faq-a>div{overflow:hidden}
.faq-a p{padding:0 44px 22px 2px;color:var(--cinza);font-size:15px;max-width:68ch}
.faq-a p+p{padding-top:0}
.faq-a a{color:var(--verde);border-bottom:1px solid currentColor}

/* ============================================================
   CONTATO (fundo escuro)
   ============================================================ */
/* ------------------------------------------------------------
   .sec-dark — utilitário que inverte qualquer seção para o
   fundo verde-cirúrgico. Aplicado hoje em "Atendimento".
   ------------------------------------------------------------ */
.sec-dark{background:var(--campo);color:#fff;border-bottom:none}
.sec-dark .eyebrow{color:var(--menta)}
.sec-dark .eyebrow::after{background:var(--menta)}
.sec-dark .eyebrow .n{color:rgba(255,255,255,.45)}
.sec-dark .lede{color:rgba(255,255,255,.66)}
.sec-dark em.h{color:var(--menta)}
.sec-dark .note{color:rgba(255,255,255,.5)}

/* cards de local sobre fundo escuro — superfície e borda reforçadas
   para o card se destacar do verde-cirúrgico (antes ficava em 1,15:1) */
.sec-dark .local{background:rgba(255,255,255,.075);border-color:rgba(155,205,187,.26)}
.sec-dark .local::before{background:var(--menta)}
.sec-dark .local:hover{
  background:rgba(255,255,255,.11);border-color:var(--menta);
  box-shadow:0 22px 44px -26px rgba(0,0,0,.55);
}
.sec-dark .local h3{color:#fff}
.sec-dark .local address{color:rgba(255,255,255,.72)}
.sec-dark .local .pin svg{fill:var(--menta)}
.sec-dark .local .badge{
  color:var(--menta);border-color:rgba(155,205,187,.4);background:rgba(155,205,187,.12);
}
.sec-dark .local-tel a{color:#fff}
.sec-dark .local-tel a:hover{color:var(--menta);border-color:var(--menta)}
.sec-dark .local-acoes a{color:var(--menta);border-color:rgba(255,255,255,.24)}
.sec-dark .local-acoes a:hover{background:#fff;border-color:#fff;color:var(--campo)}
.sec-dark .nota-unimed{border-left-color:var(--menta);color:rgba(255,255,255,.7)}
.sec-dark .nota-unimed b{color:#fff}
.sec-dark .planos h3{color:#fff}
.sec-dark .chip{
  background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.18);color:rgba(255,255,255,.78);
}
.sec-dark .chip:hover{border-color:var(--menta);color:#fff}

/* ------------------------------------------------------------
   Agendamento (fundo claro)
   ------------------------------------------------------------ */
.contato-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,80px);align-items:start}
.contato-grid .quote{
  font-family:var(--serif);font-style:italic;font-size:21px;color:var(--campo);
  margin-bottom:32px;max-width:34ch;
}
.contato-grid .tel{
  margin-top:18px;font-family:var(--mono);font-size:13px;color:var(--verde);letter-spacing:.06em;
}

/* formulário → mensagem WhatsApp */
.form label{
  display:block;font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--verde);margin:22px 0 8px;
}
.form input,.form textarea,.form select{
  width:100%;background:transparent;border:none;border-bottom:1px solid var(--linha);
  color:var(--tinta);font-family:var(--sans);font-size:15px;padding:10px 2px;outline:none;
  transition:border-color .25s;border-radius:0;
}
.form input::placeholder,.form textarea::placeholder{color:var(--cinza);opacity:.7}
.form select{appearance:none;-webkit-appearance:none;cursor:pointer}
.form input:focus,.form textarea:focus,.form select:focus{border-color:var(--verde)}
.form textarea{resize:vertical;min-height:90px}
.form .hint{font-size:12.5px;color:var(--cinza);margin-top:14px}

/* mesmo formulário, caso volte a ficar sobre fundo escuro */
.sec-dark .contato-grid .quote{color:#D7E8DF}
.sec-dark .contato-grid .tel{color:var(--menta)}
.sec-dark .form label{color:var(--menta)}
.sec-dark .form input,.sec-dark .form textarea,.sec-dark .form select{
  border-bottom-color:rgba(255,255,255,.25);color:#fff;
}
.sec-dark .form select option{color:var(--tinta)}
.sec-dark .form input:focus,.sec-dark .form textarea:focus,.sec-dark .form select:focus{border-color:var(--menta)}
.sec-dark .form .hint{color:rgba(255,255,255,.5)}

/* ============================================================
   CTA FINAL (banda escura reutilizável)
   ============================================================ */
.cta-band{
  background:linear-gradient(150deg,var(--campo) 0%,var(--campo-2) 100%);
  color:#fff;border-bottom:none;position:relative;overflow:hidden;
}
.cta-band .halo{
  position:absolute;width:60%;aspect-ratio:1;border-radius:50%;right:-20%;top:-40%;
  background:radial-gradient(circle,rgba(155,205,187,.14),transparent 66%);filter:blur(40px);
}
.cta-band h2{font-size:clamp(30px,4.4vw,54px)}
.cta-band em.h{color:var(--menta)}
.cta-band .lede{color:rgba(255,255,255,.66)}
.cta-band .actions{margin-top:36px;display:flex;gap:14px;flex-wrap:wrap}

/* ============================================================
   PÁGINAS INTERNAS — HERO COMPACTO
   ============================================================ */
.page-hero{border-bottom:1px solid var(--linha);position:relative;overflow:hidden}
.page-hero .hero-bg{opacity:.8}
.page-hero .inner{padding-top:clamp(48px,8vh,80px);padding-bottom:clamp(40px,6vh,64px)}
.breadcrumb{
  display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:26px;
  font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--cinza);
}
.breadcrumb a{transition:color .2s}
.breadcrumb a:hover{color:var(--verde)}
.breadcrumb .sep{color:var(--linha)}
.page-hero h1{font-size:clamp(34px,4.6vw,58px);letter-spacing:-.025em;margin-bottom:16px;max-width:20ch}
.page-hero .lede{font-size:clamp(16px,1.6vw,18px)}

/* ============================================================
   ARTIGO — EDUCAÇÃO DO PACIENTE
   ============================================================ */
.art-meta{
  margin-top:28px;display:flex;flex-wrap:wrap;gap:22px;
  font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;color:var(--cinza);
}
.art-meta span b{color:var(--tinta);font-weight:500}
.art-meta .rev{display:flex;align-items:center;gap:8px}
.art-meta .rev .dot{width:6px;height:6px;border-radius:50%;background:var(--verde)}

.art-layout{
  display:grid;grid-template-columns:220px minmax(0,1fr);gap:clamp(40px,5vw,72px);
  padding:clamp(48px,7vh,72px) 0;
}
.art-toc{position:sticky;top:96px;align-self:start}
.art-toc .t{
  font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--cinza);margin-bottom:14px;
}
.art-toc nav{display:flex;flex-direction:column;gap:2px;border-left:1px solid var(--linha)}
.art-toc a{
  font-size:13.5px;color:var(--cinza);padding:7px 0 7px 16px;margin-left:-1px;
  border-left:1px solid transparent;transition:color .2s,border-color .2s;
}
.art-toc a:hover{color:var(--tinta)}
.art-toc a.active{color:var(--verde);border-color:var(--verde)}
.art-toc .toc-cta{margin-top:24px}

.article{max-width:720px}
.article section{padding:0;border:none;scroll-margin-top:96px}
.article section+section{margin-top:clamp(40px,6vh,56px)}
.article h2{
  font-size:clamp(23px,2.6vw,30px);padding-top:6px;
  display:flex;align-items:baseline;gap:14px;
}
.article h2 .idx{font-family:var(--mono);font-size:12px;color:var(--verde);letter-spacing:.08em;flex:none}
.article h3{font-size:19px;margin:26px 0 10px}
.article p{color:#3d4744;margin-bottom:16px;text-wrap:pretty}
.article p strong,.article li strong{color:var(--tinta);font-weight:500}
.article ul,.article ol{margin:0 0 18px;padding-left:0;list-style:none;display:grid;gap:10px}
.article ul li{position:relative;padding-left:24px;color:#3d4744}
.article ul li::before{content:"—";position:absolute;left:0;color:var(--verde)}
.article ol{counter-reset:li}
.article ol li{position:relative;padding-left:34px;color:#3d4744;counter-increment:li}
.article ol li::before{
  content:counter(li,decimal-leading-zero);position:absolute;left:0;top:2px;
  font-family:var(--mono);font-size:12px;color:var(--verde);
}
.article a:not(.btn){color:var(--verde);border-bottom:1px solid rgba(42,122,102,.35);transition:border-color .2s}
.article a:not(.btn):hover{border-color:var(--verde)}

/* ------------------------------------------------------------
   Figuras / diagramas
   SVG autoral, desenhado para este site — sem direitos de terceiros.
   Traço em vetor: nítido em qualquer tela, poucos KB, tema do site.
   ------------------------------------------------------------ */
.fig{
  margin:32px 0;border:1px solid var(--linha);background:var(--branco);
  border-radius:3px;overflow:hidden;
}
.fig-canvas{padding:clamp(16px,3vw,26px) clamp(14px,3vw,26px);background:var(--porcelana)}
.fig svg,.fig img{width:100%;height:auto;display:block}
.fig-credito{
  display:block;margin-top:8px;font-family:var(--mono);font-size:10.5px;
  letter-spacing:.05em;color:var(--cinza);opacity:.85;
}
.fig-credito a{color:var(--verde);border-bottom:1px solid transparent}
.fig-credito a:hover{border-color:var(--verde)}
.fig figcaption{
  padding:13px 18px;border-top:1px solid var(--linha);
  font-size:12.5px;color:var(--cinza);line-height:1.55;
}
.fig figcaption b{color:var(--tinta);font-weight:500}

/* traços dos diagramas */
.dg-l{stroke:var(--cinza);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.dg-f{stroke:var(--tinta);fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.dg-a{stroke:var(--verde);fill:none;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
.dg-tr{stroke:var(--verde);fill:none;stroke-width:1.8;stroke-dasharray:5 5;stroke-linecap:round}
.dg-sf{fill:rgba(42,122,102,.10)}
.dg-st{fill:rgba(23,34,32,.05)}
.dg-pt{fill:var(--verde)}
.dg-t{font-family:var(--mono);font-size:11px;fill:var(--cinza);letter-spacing:.05em}
.dg-tf{font-family:var(--mono);font-size:11px;fill:var(--verde);letter-spacing:.05em}
.dg-n{font-family:var(--mono);font-size:10.5px;fill:#fff;letter-spacing:.04em}

/* animação de traçado, disparada ao entrar na tela */
html.js [data-draw]{stroke-dashoffset:var(--len,600);stroke-dasharray:var(--len,600)}
html.js [data-draw].drawn{stroke-dashoffset:0;transition:stroke-dashoffset 1.15s var(--ease-out)}
html.js [data-pop]{opacity:0;transform:scale(.6);transform-origin:center;transform-box:fill-box}
html.js [data-pop].drawn{
  opacity:1;transform:none;
  transition:opacity .4s ease var(--d,0s),transform .5s var(--ease-out) var(--d,0s);
}
@media (prefers-reduced-motion:reduce){
  html.js [data-draw]{stroke-dashoffset:0}
  html.js [data-pop]{opacity:1;transform:none}
}

/* caixas de destaque */
.callout{
  border:1px solid var(--linha);border-left:2px solid var(--verde);background:var(--branco);
  border-radius:2px;padding:22px 24px;margin:26px 0;
}
.callout .ct{
  font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--verde);margin-bottom:10px;display:flex;align-items:center;gap:8px;
}
.callout p{margin-bottom:0;font-size:14.5px}
.callout p+p{margin-top:8px}
.callout ul{margin:0;padding:0}
.callout.alert{border-left-color:#B4552D;background:#FCF6F2}
.callout.alert .ct{color:#B4552D}
.callout.deep{background:var(--campo);border-color:var(--campo);color:#fff}
.callout.deep .ct{color:var(--menta)}
.callout.deep p{color:rgba(255,255,255,.82)}

/* linha do tempo de recuperação */
.rec-tl{border-top:1px solid var(--linha);margin-top:8px}
.rec-item{display:grid;grid-template-columns:150px 1fr;gap:24px;padding:18px 0;border-bottom:1px solid var(--linha)}
.rec-item .w{font-family:var(--mono);font-size:12px;color:var(--verde);letter-spacing:.06em;padding-top:2px}
.rec-item p{margin:0;font-size:14.5px}

/* tabela comparativa */
.tbl{width:100%;border-collapse:collapse;margin:22px 0;font-size:14.5px}
.tbl th{
  text-align:left;font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--cinza);font-weight:500;padding:12px 14px;border-bottom:1px solid var(--tinta);
}
.tbl td{padding:12px 14px;border-bottom:1px solid var(--linha);color:#3d4744;vertical-align:top}
.tbl tr td:first-child{color:var(--tinta);font-weight:500}
.tbl-scroll{overflow-x:auto}

/* autor / revisão */
.author-box{
  display:grid;grid-template-columns:88px 1fr;gap:22px;align-items:center;
  border:1px solid var(--linha);background:var(--branco);border-radius:2px;padding:24px;
  margin-top:clamp(40px,6vh,56px);
}
.author-box img{width:88px;height:88px;object-fit:cover;object-position:center top;border-radius:2px;filter:saturate(.92)}
.author-box .t{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--verde);margin-bottom:6px}
.author-box h3{font-size:17px;margin-bottom:2px}
.author-box p{font-size:13px;color:var(--cinza);margin:0}
.author-box .links{margin-top:8px;display:flex;gap:14px;font-family:var(--mono);font-size:11px;letter-spacing:.08em}
.author-box .links a{color:var(--verde)}

.disclaimer{
  margin-top:22px;padding:18px 22px;border:1px dashed var(--linha);border-radius:2px;
  font-size:12.5px;color:var(--cinza);
}
.disclaimer b{color:var(--tinta);font-weight:500}

/* relacionados */
.related{padding:clamp(48px,7vh,72px) 0;border-top:1px solid var(--linha)}

/* ============================================================
   FOOTER
   ============================================================ */
footer.site-foot{background:var(--campo);color:rgba(255,255,255,.66)}
.foot-main{
  display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:clamp(28px,4vw,56px);
  padding:clamp(48px,7vh,72px) 0 40px;
}
.foot-brand b{color:#fff;font-weight:600;font-size:18px;letter-spacing:-.01em}
.foot-brand .crm{font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;color:var(--menta);margin-top:8px}
.foot-brand p{font-size:13.5px;margin-top:16px;max-width:34ch}
.foot-col .t{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--menta);margin-bottom:16px;
}
.foot-col nav{display:flex;flex-direction:column;gap:9px;font-size:13.5px}
.foot-col nav a{transition:color .2s;width:fit-content}
.foot-col nav a:hover{color:#fff}
.foot-base{
  border-top:1px solid rgba(255,255,255,.12);padding:22px 0 26px;
  display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
  font-size:12px;
}
.foot-base .mono{font-family:var(--mono);font-size:11px;letter-spacing:.06em}
.foot-base a{color:var(--menta)}
.foot-disc{
  border-top:1px solid rgba(255,255,255,.12);padding:18px 0;
  font-size:11.5px;color:rgba(255,255,255,.45);
}

/* ============================================================
   LEQUE DE AGENDAMENTO
   Abre a partir do FAB (ou de qualquer botão "agendar") e deixa o
   visitante escolher o local antes de cair no WhatsApp.
   ============================================================ */
.fan-backdrop{
  position:fixed;inset:0;z-index:95;background:rgba(8,26,23,.62);
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
  opacity:0;visibility:hidden;transition:opacity .35s var(--ease-out),visibility 0s .35s;
}
body.fan-open .fan-backdrop{opacity:1;visibility:visible;transition-delay:0s}

.agenda-fan{
  position:fixed;right:22px;bottom:88px;z-index:96;
  width:min(330px,calc(100vw - 44px));
  display:flex;flex-direction:column;gap:10px;
  visibility:hidden;transition:visibility 0s .4s;
}
body.fan-open .agenda-fan{visibility:visible;transition-delay:0s}

.fan-titulo{
  align-self:flex-end;background:var(--campo);color:#fff;
  font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  padding:8px 14px;border-radius:999px;white-space:nowrap;
}
.fan-op{
  display:flex;align-items:center;gap:13px;width:100%;text-align:left;
  background:var(--branco);border:1px solid var(--linha);border-radius:3px;
  padding:12px 15px;box-shadow:0 16px 32px -20px rgba(8,26,23,.6);
}
.fan-op:hover{border-color:var(--verde)}
.fan-op .ic{
  flex:none;width:34px;height:34px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;background:rgba(31,168,85,.12);
}
.fan-op .ic svg{width:17px;height:17px;fill:var(--whats);display:block}
.fan-op.is-tel .ic{background:rgba(42,122,102,.12)}
.fan-op.is-tel .ic svg{fill:var(--verde)}
.fan-op .txt{min-width:0}
.fan-op b{display:block;font-weight:500;font-size:14.5px;letter-spacing:-.01em;line-height:1.3}
.fan-op i{
  display:block;font-style:normal;font-family:var(--mono);font-size:9.5px;
  letter-spacing:.08em;text-transform:uppercase;color:var(--cinza);margin-top:3px;
}

/* entrada em leque: de baixo (junto ao FAB) para cima */
.fan-titulo,.fan-op{
  opacity:0;transform:translateY(14px) scale(.96);transform-origin:bottom right;
  transition:opacity .3s ease,transform .38s var(--ease-out),border-color .25s;
}
body.fan-open .fan-titulo,body.fan-open .fan-op{
  opacity:1;transform:none;transition-delay:calc(var(--i,0) * .05s);
}
body.fan-open .fan-op:hover{transform:translateY(-2px)}

/* o FAB vira botão de fechar enquanto o leque está aberto */
body.fan-open .fab{z-index:97;background:var(--campo)}
body.fan-open .fab svg{opacity:0}
body.fan-open .fab .fab-ping{display:none}
.fab .fab-x{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  opacity:0;transition:opacity .25s;
}
.fab .fab-x::before,.fab .fab-x::after{
  content:"";position:absolute;width:17px;height:2px;background:#fff;border-radius:2px;
}
.fab .fab-x::before{transform:rotate(45deg)}
.fab .fab-x::after{transform:rotate(-45deg)}
body.fan-open .fab .fab-x{opacity:1}
.fab svg{transition:opacity .25s}

@media (max-width:520px){
  .agenda-fan{right:16px;left:16px;width:auto;bottom:84px}
}
@media (prefers-reduced-motion:reduce){
  .fan-titulo,.fan-op{transform:none}
  body.fan-open .fan-op:hover{transform:none}
}

/* ============================================================
   FAB WHATSAPP
   ============================================================ */
.fab{
  position:fixed;right:22px;bottom:22px;z-index:80;
  background:var(--whats);color:#fff;width:54px;height:54px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 10px 28px rgba(15,49,44,.32);
  transition:transform .25s var(--ease-out),box-shadow .25s;
}
.fab:hover{transform:scale(1.08);box-shadow:0 14px 34px rgba(15,49,44,.4)}
.fab svg{width:26px;height:26px;fill:#fff}
.fab .fab-ping{
  position:absolute;inset:0;border-radius:50%;border:1px solid var(--whats);
  animation:ping 2.6s var(--ease-out) infinite;
}
@keyframes ping{0%{transform:scale(1);opacity:.7}80%,100%{transform:scale(1.55);opacity:0}}

/* ============================================================
   ESPECIALIDADES — BLOCOS ALTERNADOS
   ============================================================ */
.spec-block{
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,72px);align-items:center;
  padding:clamp(48px,7vh,72px) 0;border-bottom:1px solid var(--linha);
}
.spec-block:last-child{border-bottom:none}
.spec-block .media{position:relative}
.spec-block .media .ph-mask{overflow:hidden;position:relative}
.spec-block .media img{width:100%;aspect-ratio:16/11;object-fit:cover;filter:saturate(.9)}
.spec-block .media .num{
  position:absolute;top:-14px;left:-8px;z-index:2;
  font-family:var(--mono);font-size:12px;letter-spacing:.14em;color:#fff;
  background:var(--campo);padding:8px 14px;
}
.spec-block.flip .media{order:2}
.spec-block h2{font-size:clamp(24px,3vw,36px)}
.spec-block h2 img{background:var(--campo);padding:12px 18px;border-radius:2px;box-sizing:content-box}
.spec-block .feats{list-style:none;margin:20px 0 26px;display:grid;gap:10px}
.spec-block .feats li{position:relative;padding-left:24px;font-size:14.5px;color:var(--cinza)}
.spec-block .feats li::before{content:"+";position:absolute;left:0;color:var(--verde);font-family:var(--mono)}
.spec-block .actions{display:flex;gap:14px;flex-wrap:wrap;align-items:center}

/* ============================================================
   REVEALS (estado inicial só com JS ativo)
   ============================================================ */
html.js [data-reveal]{opacity:0;transform:translateY(26px);will-change:transform,opacity}
html.js [data-reveal="fade"]{transform:none}
html.js [data-reveal="left"]{transform:translateX(-26px)}
html.js [data-reveal="right"]{transform:translateX(26px)}
html.js [data-intro]{opacity:0;transform:translateY(24px)}
html.js .ph-mask{clip-path:inset(0 0 100% 0)}
html.js .ph-mask [data-img]{transform:scale(1.14);will-change:transform}
html.js h1.display .word{transform:translateY(115%)}
html.js .hc-bg img{transform:scale(1.12);will-change:transform}
html.js .hc-scroll{opacity:0}

/* âncoras respeitam o header fixo */
[id]{scroll-margin-top:84px}

/* ============================================================
   MOVIMENTO REDUZIDO
   ============================================================ */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
  html.js [data-reveal],html.js [data-intro]{opacity:1;transform:none}
  html.js .ph-mask{clip-path:none}
  html.js .ph-mask [data-img]{transform:none}
  html.js h1.display .word{transform:none}
  html.js .hc-bg img{transform:none}
  html.js .hc-scroll{opacity:1}
  .hc-scroll .rail::after{animation:none}
  .marquee-track{animation:none}
  .fab .fab-ping{display:none}
  .statement blockquote .w{opacity:1}
}

/* ============================================================
   RESPONSIVO
   ============================================================ */
@media (max-width:1080px){
  .stats-band{grid-template-columns:repeat(2,1fr)}
  .stat-cell:nth-child(2){border-right:none}
  .stat-cell:nth-child(-n+2){border-bottom:1px solid var(--linha)}
  .cards,.edu-grid{grid-template-columns:repeat(2,1fr)}
  .foot-main{grid-template-columns:1fr 1fr}
}
/* o menu tem 6 itens: troca para hambúrguer antes de ficar apertado */
@media (max-width:1080px){
  nav.links{display:none}
  .burger{display:flex}
}
@media (max-width:980px){
  .split,.contato-grid,.spec-block{grid-template-columns:1fr}
  .spec-block.flip .media{order:0}
  .split .media{max-width:560px}
  .art-layout{grid-template-columns:minmax(0,1fr)}
  .art-toc{position:static;order:-1;border:1px solid var(--linha);background:var(--branco);padding:20px;border-radius:2px}
  .art-toc nav{border-left:none;flex-direction:row;flex-wrap:wrap;gap:4px 18px}
  .art-toc a{padding:4px 0;border-left:none}
  .art-toc .toc-cta{display:none}
  .nav-cta .btn{display:none}
}
@media (max-width:720px){
  .ruler,.ruler-marker,.ruler-label,.ruler-pct{display:none}
  .wrap{padding-left:var(--gutter)}
  .nav{padding-left:var(--gutter)}
  .hc-inner{padding-left:var(--gutter)}
  .hc-kick{font-size:10.5px;letter-spacing:.16em}
  .hc-scroll{display:none}
  /* em retrato a foto não sofre corte vertical: encurtar o bloco de texto
     é o que mantém o rosto inteiro acima do nome (os selos se repetem no
     marquee logo abaixo) */
  .hc-meta{display:none}
  .hc-quote{margin-bottom:26px}
  .cards,.edu-grid,.locais,.edu-cards{grid-template-columns:1fr}
  .stats-band{grid-template-columns:1fr 1fr}
  .stat-cell{padding:22px 18px}
  .tl-item{grid-template-columns:1fr;gap:6px}
  .mentores{grid-template-columns:1fr}
  .pub-item{grid-template-columns:1fr;gap:8px}
  .doc-frame iframe{height:460px}
  .doc-head{flex-direction:column;gap:10px}
  .pub-item .type{justify-self:start}
  .award{grid-template-columns:1fr;gap:4px}
  .award .m{text-align:left}
  .rec-item{grid-template-columns:1fr;gap:4px}
  .author-box{grid-template-columns:64px 1fr;gap:16px}
  .author-box img{width:64px;height:64px}
  .foot-main{grid-template-columns:1fr;gap:32px}
  .fab{right:16px;bottom:16px}
}