/* ==========================================================================
   Êxito Assessoria Empresarial — landing page
   Reprodução fiel do arquivo Figma "Exito" (frame Desktop 2:381, 1280 × 7210).
   Tipografia, cores, tracking e medidas extraídos via Figma MCP (get_design_context).
   ========================================================================== */

/* ---------- Tokens ---------- */
:root{
  /* Superfícies */
  --creme:#F5F2EC;
  --navy-fundo:#13223B;   /* fundo da seção Os Três Pilares */
  --navy:#1E304E;         /* Dark Blue (única variável do Figma) */
  --navy-deep:#0D1E3A;    /* texto de apoio em cards do Método */
  --obsidiana:#0E1C33;    /* stop escuro do gradiente do CTA final */
  --preto:#040404;        /* rodapé */
  --areia:#C4BCA8;        /* cards do Método */

  /* Texto e acentos */
  --ouro:#C5A880;
  --azul:#657BA0;
  --tinta:#0F172A;
  --corpo-claro:#6D6D6D;                 /* corpo sobre creme */
  --corpo-escuro:#F5F2EC;                /* corpo sobre superfícies escuras */
  --corpo-escuro-muted:rgba(245,242,236,.7);
  --slate-1:#CBD5E1;
  --slate-2:#94A3B8;
  --slate-3:#64748B;
  --linha-clara:rgba(255,255,255,.18);

  /* Layout */
  --container:1280px;
  --gutter:48px;

  /* Geometria de assinatura (chanfros) */
  --chanfro-btn:14px;
  --chanfro-card:20px;
  --chanfro-caixa:35px;
  --chanfro-bloco:28px;   /* chanfro padrão dos blocos grandes (igual aos cards) */

  /* Tipografia — Plus Jakarta Sans (300 / 400 / 500 / 600 / 700).
     Valores fixos do comp Figma (1280). Redução só via @media abaixo de 768px. */
  --fonte:"Plus Jakarta Sans","Helvetica Neue",Helvetica,Arial,sans-serif;

  --t-hero:3rem;        /* 48px | lh 1.15 | tracking -1.5px */
  --t-secao:2.25rem;    /* 36px | 600     | tracking -1.2px */
  --t-cta:3rem;         /* 48px | 600     | tracking -1.2px */
  --t-claim:1.5rem;     /* 24px | tracking -1.2px           */
  --t-corpo:1.125rem;   /* 18px | lh 28px                   */

  /* Motion — arquétipo "Premium" (compartilhado por index.html e
     simples-nacional.html; ver seção MOTION mais abaixo). */
  --mo-ease-entrada:cubic-bezier(.16,1,.3,1);   /* decelerate suave, 0% overshoot */
  --mo-ease-saida:cubic-bezier(.4,0,.68,.06);    /* accelerate, para saídas */
  --mo-ease-hover:cubic-bezier(.2,0,0,1);        /* MD3 standard, on-screen */
  --mo-dur-hero:700ms;      /* reveal dramático — elemento líder da seção */
  --mo-dur-item:550ms;      /* itens secundários */
  --mo-dur-hover:220ms;     /* feedback de interação */
  --mo-stagger:80ms;        /* defasagem Premium entre itens de um grupo */
}

@media (max-width:768px){
  :root{
    --t-hero:2.25rem;   /* 36px */
    --t-secao:1.75rem;  /* 28px */
    --t-cta:2rem;       /* 32px */
    --t-claim:1.3125rem;/* 21px */
    --t-corpo:1rem;     /* 16px */
  }
}
@media (max-width:420px){
  :root{--t-hero:2rem;--t-cta:1.75rem}
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:97px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* Smooth scroll (Lenis, js/smooth-scroll.js): quando assume o controle da
   rolagem, evita a dupla-suavização com o scroll-behavior nativo acima. */
html.tem-lenis{scroll-behavior:auto}
body{
  margin:0;
  font-family:var(--fonte);
  font-size:var(--t-corpo);
  line-height:1.556;
  font-weight:400;
  color:var(--tinta);
  background:var(--creme);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,p,ul,ol,figure{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
strong{font-weight:700}
hr{border:0}

.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
.skip-link{
  position:absolute;left:var(--gutter);top:-100px;z-index:200;
  background:var(--creme);color:var(--navy);
  padding:.75rem 1.25rem;font-size:.8125rem;font-weight:700;
  transition:top .2s ease;
}
.skip-link:focus{top:1rem}

/* Foco visível — box-shadow interno para sobreviver ao clip-path */
:focus-visible{outline:2px solid var(--ouro);outline-offset:3px}
.btn:focus-visible{
  outline:none;
  box-shadow:inset 0 0 0 2px var(--navy),inset 0 0 0 4px var(--creme);
}
.acordeao__botao:focus-visible{
  outline:none;
  box-shadow:inset 0 0 0 2px var(--ouro);
}

.container{
  width:100%;max-width:var(--container);
  margin-inline:auto;padding-inline:var(--gutter);
}

/* ---------- Tipografia compartilhada ---------- */
.sobrelinha{
  font-size:.75rem;                 /* 12px */
  font-weight:700;
  letter-spacing:.22em;             /* ≈ 2.64px */
  text-transform:uppercase;
  line-height:1.35;
}
.sobrelinha--ouro{color:var(--ouro);letter-spacing:.24em}   /* ≈ 2.88px */
.sobrelinha--azul{color:var(--azul)}
.sobrelinha--clara{color:var(--slate-1);font-weight:600;letter-spacing:.2em}
.sobrelinha--escura{color:var(--navy);font-weight:600;letter-spacing:.2em}

.titulo-secao{
  font-size:var(--t-secao);
  font-weight:600;
  line-height:1.2;
  letter-spacing:-.033em;           /* -1.2px @ 36px */
  color:var(--navy);
  text-wrap:balance;
}
.titulo-secao--claro{color:#fff}
.titulo-secao--creme{color:var(--creme)}

.corpo{
  font-size:var(--t-corpo);
  line-height:1.556;                /* 28px @ 18px */
  color:var(--corpo-claro);
  max-width:56ch;
}
.corpo--claro{color:var(--corpo-escuro);max-width:64ch}

/* ---------- Botão (chanfro superior-esq + inferior-dir, ~352 × 52) ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:352px;min-height:52px;
  padding:.75rem 2.5rem;
  font-size:.875rem;               /* 14px */
  font-weight:700;
  letter-spacing:.16em;            /* ≈ 2.24px */
  text-transform:uppercase;
  line-height:1.43;               /* 20px */
  color:var(--navy);
  clip-path:polygon(
    var(--chanfro-btn) 0, 100% 0,
    100% calc(100% - var(--chanfro-btn)),
    calc(100% - var(--chanfro-btn)) 100%,
    0 100%, 0 var(--chanfro-btn));
  transition:background-color .25s ease,color .25s ease,transform .25s ease;
}
.btn--claro{background:var(--creme)}
.btn--claro:hover{background:#fff;transform:translateY(-2px)}
.btn--claro:active{transform:translateY(0)}
@media (prefers-reduced-motion:reduce){
  .btn{transition:background-color .25s ease,color .25s ease}
  .btn--claro:hover{transform:none}
}

/* ---------- Seções ---------- */
.secao{position:relative}
.secao--clara{background:var(--creme)}
.secao--navy{background:var(--navy-fundo)}

/* ==========================================================================
   CABEÇALHO — fixo: transparente sobre o hero, vira caixa com blur ao rolar
   ========================================================================== */
.cabecalho{
  position:fixed;inset:0 0 auto;z-index:100;
  height:97px;
  background:transparent;
  border-bottom:1px solid transparent;
  transition:background-color .35s ease,backdrop-filter .35s ease,
             border-color .35s ease,height .35s ease;
}
.cabecalho--scrolled{
  height:76px;
  background:rgba(15,26,42,.72);
  -webkit-backdrop-filter:blur(14px) saturate(140%);
  backdrop-filter:blur(14px) saturate(140%);
  border-bottom-color:rgba(255,255,255,.1);
}
@media (prefers-reduced-motion:reduce){
  .cabecalho{transition:background-color .2s ease}
}
.cabecalho__inner{
  max-width:var(--container);height:100%;
  margin-inline:auto;padding-inline:var(--gutter);
  display:flex;align-items:center;gap:2rem;
}
.cabecalho__logo img{width:183px;height:auto;transition:width .35s ease}
.cabecalho--scrolled .cabecalho__logo img{width:160px}

.nav{display:flex;align-items:center;gap:2.25rem;margin-left:auto}
.nav__lista{display:flex;align-items:center;gap:2.25rem}
.nav__lista a{
  font-size:.75rem;font-weight:500;letter-spacing:.14em;   /* 1.68px */
  text-transform:uppercase;color:rgba(203,213,225,.9);
  padding-block:.5rem;position:relative;white-space:nowrap;
}
.nav__cta{white-space:nowrap}
.nav__lista a::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:var(--ouro);transform:scaleX(0);transform-origin:left;
  transition:transform .3s ease;
}
.nav__lista a:hover::after,
.nav__lista a:focus-visible::after{transform:scaleX(1)}
.nav__cta{
  min-width:0;min-height:40px;
  padding:.75rem 1.5rem;
  font-size:.75rem;letter-spacing:.1em;   /* 1.2px */
  font-weight:600;color:var(--obsidiana);
}

.nav-toggle{display:none;width:44px;height:44px;position:relative;margin-left:auto}
.nav-toggle__barras,
.nav-toggle__barras::before,
.nav-toggle__barras::after{
  position:absolute;left:10px;width:24px;height:2px;background:#fff;
  transition:transform .3s ease,opacity .2s ease;
}
.nav-toggle__barras{top:21px}
.nav-toggle__barras::before{content:"";top:-7px;left:0}
.nav-toggle__barras::after{content:"";top:7px;left:0}
.nav-toggle[aria-expanded="true"] .nav-toggle__barras{background:transparent}
.nav-toggle[aria-expanded="true"] .nav-toggle__barras::before{transform:translateY(7px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-toggle__barras::after{transform:translateY(-7px) rotate(-45deg)}

/* ==========================================================================
   HERO — 832px
   ========================================================================== */
.hero{
  position:relative;
  min-height:832px;
  display:flex;align-items:flex-start;
  padding-top:214px;padding-bottom:4rem;
  background:#0E1A28;
  isolation:isolate;
  overflow:hidden; /* contém o parallax sutil da imagem de fundo */
}
.hero__media{
  position:absolute;inset:-8px;z-index:-2;     /* -8px: compensa a borda do blur */
  background-image:-webkit-image-set(url("../img/hero-index.jpg") 1x,url("../img/hero-index@2x.jpg") 2x);
  background-image:image-set(url("../img/hero-index.jpg") 1x,url("../img/hero-index@2x.jpg") 2x);
  background-size:cover;background-position:center;
  filter:blur(2px);
}
.hero::before{                     /* overlay — Figma node 2:435: azul escuro 20% + degradê diagonal */
  content:"";position:absolute;inset:0;z-index:-1;
  background:
    linear-gradient(112deg,rgba(9,16,26,.82) 0%,rgba(9,16,26,.5) 40%,rgba(9,16,26,.12) 72%,rgba(9,16,26,0) 100%),
    linear-gradient(0deg,rgba(9,16,26,.55) 0%,rgba(9,16,26,0) 55%),
    rgba(13,30,58,.2);
}
.hero__conteudo{max-width:var(--container)}
.hero__eyebrow{                     /* mesmo tamanho/estilo de "Antes de pagar, entenda.", cor dourada */
  font-size:var(--t-claim);
  font-weight:400;
  line-height:1.2;
  letter-spacing:-.031em;
  color:var(--ouro);
}
.hero__titulo{
  margin-top:1.5rem;
  font-size:var(--t-hero);
  font-weight:400;                 /* 1ª linha Regular */
  line-height:1.15;
  letter-spacing:-.031em;          /* -1.5px @ 48px */
  color:var(--creme);
}
.hero__titulo strong{font-weight:700}   /* 2ª linha Bold */
.hero__texto{
  margin-top:1.75rem;max-width:41rem;
  font-weight:300;                 /* Light */
  line-height:1.556;
  color:var(--creme);
}
.hero .btn{margin-top:1.875rem}
.hero__claim{
  margin-top:1.5rem;
  font-size:var(--t-claim);font-weight:400;
  letter-spacing:-.031em;color:var(--creme);
}

/* ==========================================================================
   INSTITUCIONAL
   ========================================================================== */
.institucional{padding-top:112px}
.institucional__grid{
  display:grid;
  grid-template-columns:minmax(0,600px) 532px;
  justify-content:space-between;
  align-items:stretch;               /* foto acompanha a altura do texto */
}
.institucional__texto{max-width:552px;align-self:start}
.institucional__sobre1{margin-bottom:.4rem}
.institucional__texto .titulo-secao{margin-top:1.25rem}
.institucional__texto .corpo{margin-top:2rem}
.institucional__img{
  width:532px;height:100%;min-height:312px;
  object-fit:cover;
  clip-path:polygon(
    var(--chanfro-bloco) 0, 100% 0,
    100% calc(100% - var(--chanfro-bloco)), calc(100% - var(--chanfro-bloco)) 100%,
    0 100%, 0 var(--chanfro-bloco));
}

/* ==========================================================================
   TRÊS CARDS — 384 × 507, gap 16
   ========================================================================== */
.cards{padding-top:100px}
.cards__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card{
  position:relative;
  aspect-ratio:384/507;
  background-color:var(--navy);
  background-size:cover;background-position:center;
  /* chanfro no canto superior-esq + inferior-dir da foto (Figma) */
  clip-path:polygon(
    var(--chanfro-bloco) 0, 100% 0,
    100% calc(100% - var(--chanfro-bloco)), calc(100% - var(--chanfro-bloco)) 100%,
    0 100%, 0 var(--chanfro-bloco));
}
.card--tributaria{
  background-image:-webkit-image-set(url("../img/pilar-1.jpg") 1x,url("../img/pilar-1@2x.jpg") 2x);
  background-image:image-set(url("../img/pilar-1.jpg") 1x,url("../img/pilar-1@2x.jpg") 2x);
}
.card--credito{
  background-image:-webkit-image-set(url("../img/pilar-2.jpg") 1x,url("../img/pilar-2@2x.jpg") 2x);
  background-image:image-set(url("../img/pilar-2.jpg") 1x,url("../img/pilar-2@2x.jpg") 2x);
}
.card--contabilidade{
  background-image:-webkit-image-set(url("../img/pilar-3.jpg") 1x,url("../img/pilar-3@2x.jpg") 2x);
  background-image:image-set(url("../img/pilar-3.jpg") 1x,url("../img/pilar-3@2x.jpg") 2x);
}
.card::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(to bottom,rgba(8,14,26,.05) 30%,rgba(8,14,26,.68) 100%);
}
/* só o texto, sem shape — Figma node 25:1348 */
.card__caixa{
  position:absolute;
  left:60px;bottom:56px;right:24px;
}
.card__titulo{
  font-size:24px;font-weight:600;line-height:1.16;
  letter-spacing:-.05em;color:var(--creme);   /* -1.2px @ 24px (Figma) */
}

/* ==========================================================================
   DECLARAÇÃO
   ========================================================================== */
.declaracao{padding-top:74px;text-align:center}
.declaracao__sobre{margin-bottom:.75rem}
.declaracao__frase{
  max-width:773px;margin-inline:auto;
  font-size:var(--t-claim);
  font-weight:600;color:var(--navy);
  letter-spacing:-.033em;text-wrap:balance;
}

/* ==========================================================================
   BLOCO ESPECIALISTAS — 1184 × 706, chanfro superior-esquerdo 144 × 110
   ========================================================================== */
#simples-nacional{padding-top:82px;padding-bottom:133px}
.bloco-especialistas{
  position:relative;
  min-height:706px;
  display:flex;align-items:center;
  padding:4rem 3rem;
  background-color:var(--navy);
  clip-path:polygon(
    var(--chanfro-bloco) 0, 100% 0,
    100% calc(100% - var(--chanfro-bloco)), calc(100% - var(--chanfro-bloco)) 100%,
    0 100%, 0 var(--chanfro-bloco));
  isolation:isolate;
  overflow:hidden;
}
.bloco-especialistas__media{
  position:absolute;inset:-2px;z-index:-2;   /* overshoot: cobre a franja de anti-alias do clip-path */
  background-color:var(--navy);
  background-image:-webkit-image-set(url("../img/especialistas.jpg") 1x,url("../img/especialistas@2x.jpg") 2x);
  background-image:image-set(url("../img/especialistas.jpg") 1x,url("../img/especialistas@2x.jpg") 2x);
  background-size:cover;background-position:right center;
}
.bloco-especialistas::before{
  content:"";position:absolute;inset:-2px;z-index:-1;
  background:linear-gradient(90deg,
    var(--navy) 0%,
    rgba(30,48,78,.94) 34%,
    rgba(30,48,78,.55) 52%,
    rgba(30,48,78,0) 70%);
}
.bloco-especialistas__conteudo{max-width:540px}   /* metade esquerda — não cobre a pessoa */
.bloco-especialistas__conteudo .corpo{margin-top:1.5rem;max-width:100%}
.bloco-especialistas__conteudo .titulo-secao{margin-bottom:.5rem}
.formula{
  margin-top:2rem;
  font-size:var(--t-claim);font-weight:600;
  letter-spacing:-.033em;color:#AABCDA;
}
.bloco-especialistas .btn{margin-top:2rem}

/* ==========================================================================
   OS TRÊS PILARES — acordeão (fundo navy, altura 1190)
   ========================================================================== */
.pilares{padding:113px 0}
.pilares__titulo{margin-top:1.25rem}
.acordeao{margin-top:4rem;border-top:1px solid var(--linha-clara)}
.acordeao__item{border-bottom:1px solid var(--linha-clara)}
.acordeao__cabecalho{margin:0;font-size:inherit;font-weight:inherit}
.acordeao__botao{
  width:100%;
  display:flex;
  align-items:center;justify-content:space-between;gap:1.5rem;
  padding:2rem 0;
  text-align:left;
}
.acordeao__textos{
  display:flex;flex-direction:column;gap:.35rem;
}
/* linha de cima: menor, em azul */
.acordeao__resumo{
  font-size:.9375rem;font-weight:600;letter-spacing:.01em;   /* 15px */
  color:var(--azul);
  transition:color .25s ease;
}
/* linha de baixo: maior, em creme */
.acordeao__rotulo{
  font-size:var(--t-claim);font-weight:400;letter-spacing:-.05em;
  color:var(--creme);
}
.acordeao__seta{
  width:26px;height:26px;flex:0 0 auto;
  display:block;color:rgba(255,255,255,.85);
  transform:rotate(180deg);                 /* fechado → chevron para baixo */
  transition:transform .35s cubic-bezier(.4,0,.2,1);
}
.acordeao__seta svg{width:100%;height:100%;display:block}
.acordeao__seta svg path{stroke-width:2}
.acordeao__botao:hover .acordeao__resumo{color:#93A9C8}
.acordeao__item[data-aberto="true"] .acordeao__seta{transform:rotate(0deg)}  /* aberto → chevron para cima */

.acordeao__painel{overflow:hidden}
.acordeao__interno{padding:0 0 2.5rem}
.acordeao__interno .corpo{max-width:62rem;font-size:1rem;line-height:1.75}
.acordeao__subtitulo{
  margin-top:2rem;font-size:1rem;font-weight:600;color:#fff;
}
.acordeao__lista{margin-top:.75rem}
.acordeao__lista li{
  position:relative;padding-left:1.5rem;
  font-size:1rem;color:var(--corpo-escuro);line-height:1.9;
}
.acordeao__lista li::before{
  content:"";position:absolute;left:.375rem;top:.9em;
  width:4px;height:4px;border-radius:50%;background:rgba(255,255,255,.65);
}
.acordeao__claim{
  margin-top:2rem;font-size:var(--t-claim);font-weight:600;color:var(--creme);
}
.acordeao__interno .btn{margin-top:1.75rem}

/* ==========================================================================
   A JORNADA ÊXITO — 4 círculos de 315px, passo 288 (sobreposição 27)
   ========================================================================== */
.jornada{
  position:relative;
  min-height:803px;
  padding:112px 0 96px;
  background:#071323;
  isolation:isolate;
}
.jornada__media{
  position:absolute;inset:0;z-index:-1;
  background-image:-webkit-image-set(url("../img/jornada.jpg") 1x,url("../img/jornada@2x.jpg") 2x);
  background-image:image-set(url("../img/jornada.jpg") 1x,url("../img/jornada@2x.jpg") 2x);
  background-size:cover;background-position:center;
}
.jornada__titulo{margin-top:1.25rem}
.jornada__fluxo{
  margin-top:3.75rem;
  display:grid;grid-template-columns:repeat(4,288px);
  justify-content:center;
}
.etapa{display:flex;flex-direction:column;align-items:center}
.etapa__circulo{
  width:315px;height:315px;flex:0 0 auto;
  border:1px solid rgba(255,255,255,.42);
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
}
.etapa__nome{
  font-size:var(--t-claim);font-weight:400;color:var(--creme);
  letter-spacing:-.05em;
}
.etapa__texto{
  margin-top:2rem;max-width:224px;
  font-size:1.125rem;line-height:1.2;
  text-align:center;color:var(--corpo-escuro-muted);
}

/* ==========================================================================
   MÉTODO ÊXITO — 5 cards de 217 × 184, gap 25
   ========================================================================== */
.metodo{padding-top:124px}
.metodo__titulo{margin-top:1.125rem}
.metodo__grid{
  margin-top:1.625rem;
  display:grid;grid-template-columns:repeat(5,1fr);gap:25px;
}
.passo{
  min-height:184px;
  padding:26px 14px 20px;
  background:var(--areia);
  clip-path:polygon(
    var(--chanfro-card) 0, 100% 0,
    100% calc(100% - var(--chanfro-card)),
    calc(100% - var(--chanfro-card)) 100%,
    0 100%, 0 var(--chanfro-card));
  display:flex;flex-direction:column;
}
.passo__num{
  width:46px;height:48px;flex:0 0 auto;
  display:flex;align-items:center;justify-content:center;
  background:var(--navy);color:var(--creme);
  font-size:1.5rem;font-weight:300;
}
.passo__titulo{
  margin-top:.875rem;
  font-size:.875rem;font-weight:700;letter-spacing:.05em;   /* 14px, 0.7px */
  color:var(--tinta);text-transform:uppercase;
}
.passo__texto{
  margin-top:auto;padding-top:1.25rem;
  font-size:.75rem;line-height:1.2;color:var(--navy-deep);
}

/* ==========================================================================
   O ESPECIALISTA — bloco navy 1190 × 644, chanfro inferior-direito 78px.
   Retrato (cutout) transborda o topo do bloco.
   ========================================================================== */
#o-especialista{padding-top:170px;padding-bottom:135px}
.bloco-autoridade{
  position:relative;
  min-height:644px;
  display:grid;grid-template-columns:600px 1fr;
  align-items:center;gap:0;
  /* sem clip-path aqui: o retrato precisa transbordar o topo da caixa */
}
.bloco-autoridade::before{           /* a caixa azul, chanfrada (topo-esq + base-dir) */
  content:"";position:absolute;inset:0;z-index:0;
  background:var(--navy);
  clip-path:polygon(
    var(--chanfro-bloco) 0, 100% 0,
    100% calc(100% - var(--chanfro-bloco)), calc(100% - var(--chanfro-bloco)) 100%,
    0 100%, 0 var(--chanfro-bloco));
}
.bloco-autoridade__retrato{
  position:absolute;left:8px;bottom:0;z-index:1;
  width:min(592px,46%);
  height:calc(100% + 96px);       /* cabeça do Esdras vaza ~96px acima da caixa */
  object-fit:cover;object-position:top center;
}
.bloco-autoridade__conteudo{
  position:relative;z-index:1;
  grid-column:2;
  padding:3rem 4rem 3rem 0;
  max-width:537px;
}
.bloco-autoridade__nome{
  margin-top:1.25rem;
  font-size:var(--t-secao);font-weight:600;
  letter-spacing:-.033em;color:#fff;
}
.bloco-autoridade__cargo{
  margin-top:.25rem;
  font-size:var(--t-claim);font-weight:400;color:#fff;letter-spacing:-.033em;
}
.bloco-autoridade__conteudo .corpo{margin-top:2rem}
.bloco-autoridade__manifesto{
  margin-top:2rem;
  font-size:var(--t-corpo);font-weight:600;line-height:1.75;color:#fff;
}

/* ==========================================================================
   CTA FINAL — gradiente diagonal navy → dark (Figma -55°)
   ========================================================================== */
.cta-final{
  background:linear-gradient(145deg,var(--navy) 6%,var(--obsidiana) 90%);
  padding:145px 0 96px;
}
.cta-final__inner{text-align:center;display:flex;flex-direction:column;align-items:center}
.cta-final__titulo{
  font-size:var(--t-cta);font-weight:600;line-height:1.15;
  letter-spacing:-.025em;color:#fff;text-wrap:balance;
}
.cta-final__sobre{
  margin-top:1.75rem;
  font-size:.875rem;font-weight:600;letter-spacing:.26em;   /* 14px, 3.64px */
  color:var(--slate-2);
}
.cta-final__texto{
  margin-top:1.25rem;max-width:38rem;
  font-weight:300;color:var(--slate-1);
}
.cta-final .btn{margin-top:2rem}
.cta-final__divisor{
  width:448px;max-width:100%;height:1px;
  margin:2.75rem 0 0;background:rgba(255,255,255,.22);
}
.cta-final__assinatura{
  margin-top:2rem;
  font-size:1rem;font-weight:600;color:#fff;letter-spacing:.025em;   /* 16px, 0.4px */
}
.cta-final__selo{
  margin-top:.5rem;
  font-size:.75rem;font-weight:400;letter-spacing:.1em;color:var(--slate-2);   /* 12px, 1.2px */
}

/* ---------- CTA final com formulário — duas colunas (igual à conversão da simples-nacional) ---------- */
.cta-final--form{padding:120px 0}
.cta-final__grid{
  display:flex;flex-direction:column;align-items:center;gap:56px;
}
.cta-final__grid .cta-final__inner{width:100%}
.cta-final--form .cta-final__divisor{margin-bottom:0}

/* ---------- Formulário (compartilhado com css/simples-nacional.css) ---------- */
.sn-form{
  padding:40px;
  background:rgba(245,242,236,.05);
  border:1px solid var(--linha-clara);
  clip-path:polygon(
    var(--chanfro-bloco) 0, 100% 0,
    100% calc(100% - var(--chanfro-bloco)), calc(100% - var(--chanfro-bloco)) 100%,
    0 100%, 0 var(--chanfro-bloco));
  display:flex;flex-direction:column;gap:1.25rem;
}
.sn-form__linha{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem}
.sn-form__campo{display:flex;flex-direction:column;gap:.5rem}
.sn-form__campo label{
  font-size:.6875rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--slate-1);
}
.sn-form__opcional{
  font-weight:400;letter-spacing:.08em;color:var(--slate-3);text-transform:none;
}
.sn-form input[type="text"],
.sn-form input[type="email"],
.sn-form input[type="tel"],
.sn-form select,
.sn-form textarea{
  width:100%;
  padding:.875rem 1rem;
  font-family:inherit;font-size:1rem;color:#fff;
  background:rgba(9,16,26,.45);
  border:1px solid rgba(255,255,255,.16);
  border-radius:0;
  transition:border-color .25s ease,background-color .25s ease;
  appearance:none;
}
.sn-form textarea{resize:vertical;min-height:110px}
.sn-form select{
  background-image:
    linear-gradient(45deg,transparent 50%,var(--slate-1) 50%),
    linear-gradient(135deg,var(--slate-1) 50%,transparent 50%);
  background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;
  background-size:6px 6px,6px 6px;
  background-repeat:no-repeat;
  padding-right:2.75rem;
}
.sn-form select option{color:var(--tinta);background:var(--creme)}
.sn-form input::placeholder,
.sn-form textarea::placeholder{color:rgba(203,213,225,.45)}
.sn-form input:hover,.sn-form select:hover,.sn-form textarea:hover{
  border-color:rgba(255,255,255,.3);
}
.sn-form input:focus-visible,
.sn-form select:focus-visible,
.sn-form textarea:focus-visible{
  outline:2px solid var(--ouro);outline-offset:1px;
  border-color:transparent;background:rgba(9,16,26,.65);
}
.sn-form__consent{
  display:flex;align-items:flex-start;gap:.75rem;
  margin-top:.25rem;
  font-size:.8125rem;line-height:1.5;color:var(--slate-1);cursor:pointer;
}
.sn-form__consent input{
  flex:0 0 auto;width:18px;height:18px;margin-top:.15rem;accent-color:var(--ouro);
}
.sn-form__enviar{width:100%;min-width:0;margin-top:.5rem}
.sn-form__nota{
  font-size:.75rem;letter-spacing:.04em;color:var(--slate-2);text-align:center;
}

@media (min-width:901px){
  .cta-final__grid{
    display:grid;grid-template-columns:minmax(0,1fr) 520px;
    gap:80px;align-items:start;
  }
  .cta-final__grid .cta-final__inner{text-align:left;align-items:flex-start}
  .cta-final__grid .cta-final__divisor{width:100%;max-width:360px}
}
@media (min-width:901px) and (max-width:1279px){
  .cta-final__grid{grid-template-columns:minmax(0,1fr) 44%;gap:48px}
}
@media (max-width:1024px){
  .sn-form{padding:32px}
}
@media (max-width:900px){
  .sn-form{padding:24px}
  .sn-form__linha{grid-template-columns:1fr}
}

/* ==========================================================================
   RODAPÉ — 165px
   ========================================================================== */
.rodape{background:var(--areia);min-height:165px;display:flex;align-items:center}
.rodape__inner{
  display:flex;align-items:center;justify-content:space-between;gap:2rem;width:100%;
}
.rodape__logo{width:143px;height:auto}
.rodape__info{text-align:right;display:flex;flex-direction:column;gap:.25rem}
.rodape__info p{line-height:1.4;letter-spacing:.05em}          /* 0.6px */
.rodape__info p:first-child{font-size:.75rem;color:var(--navy)}
.rodape__info p:last-child{font-size:.6875rem;color:rgba(30,48,78,.62)}

/* ==========================================================================
   MOTION — arquétipo "Premium": elegante, sem overshoot, propriedades mínimas
   (opacity + transform), stagger de 80ms, easing suave de desaceleração.
   Compartilhado por index.html e simples-nacional.html — única fonte de
   verdade para as duas páginas (tokens em :root, acima).
   ========================================================================== */

/* ---------- Camada primária: revelação em scroll ---------- */
@media (prefers-reduced-motion:no-preference){
  .js .revelar{
    opacity:0;
    transform:translateY(20px) scale(.975);
    transition:opacity var(--mo-dur-item) var(--mo-ease-entrada),
               transform var(--mo-dur-item) var(--mo-ease-entrada);
  }
  .js .revelar.is-visivel{opacity:1;transform:none}
  /* elemento-herói de cada seção: entra primeiro, com leve mais fôlego */
  .js .revelar--hero{
    transform:translateY(26px) scale(.97);
    transition-duration:var(--mo-dur-hero);
  }
  .js .revelar--hero.is-visivel{transform:none}
}

/* ---------- Camada secundária: hover/feedback ----------
   Especificidade: elementos hoverados também recebem .revelar.is-visivel
   (2 classes) ao entrar em cena, cuja regra fixa transform:none. Os
   seletores de :hover abaixo repetem a classe base (".card.card:hover")
   só para IGUALAR essa especificidade — sem isso, o transform do hover
   seria ignorado depois que o elemento já foi revelado. */
.card,
.passo{
  transition:transform var(--mo-dur-hover) var(--mo-ease-hover),
             box-shadow var(--mo-dur-hover) var(--mo-ease-hover),
             border-color var(--mo-dur-hover) var(--mo-ease-hover);
}
.card.card:hover,.card.card:focus-within{
  transform:translateY(-4px) scale(1.015);
  box-shadow:0 18px 32px -18px rgba(30,48,78,.35);
}
.passo.passo:hover,.passo.passo:focus-within{
  transform:translateY(-4px) scale(1.015);
  box-shadow:0 18px 28px -16px rgba(13,30,58,.45);
}

.etapa__circulo{
  transition:transform var(--mo-dur-hover) var(--mo-ease-hover),
             border-color var(--mo-dur-hover) var(--mo-ease-hover);
}
.etapa__circulo:hover{
  transform:translateY(-4px) scale(1.02);
  border-color:var(--ouro);
}

.acordeao__botao{transition:background-color var(--mo-dur-hover) ease}
.acordeao__item:hover .acordeao__botao,
.acordeao__botao:focus-visible{background:rgba(255,255,255,.03)}

/* botões: mesmo padrão sem overshoot das duas páginas */
.btn{
  transition:background-color var(--mo-dur-hover) ease,
             color var(--mo-dur-hover) ease,
             transform var(--mo-dur-hover) var(--mo-ease-hover),
             box-shadow var(--mo-dur-hover) var(--mo-ease-hover);
}
.btn--claro.btn--claro:hover{
  transform:translateY(-2px) scale(1.015);
  box-shadow:0 14px 26px -14px rgba(9,16,26,.55);
}

/* ---------- Camada ambiente: movimento contínuo e sutil ---------- */
@media (prefers-reduced-motion:no-preference){
  @keyframes respirar{
    0%,100%{box-shadow:0 0 0 0 rgba(197,168,128,.45)}
    50%{box-shadow:0 0 0 7px rgba(197,168,128,0)}
  }
  /* último passo de cada fluxo ("Resultado"/"Acompanhamento"): destaque sutil */
  .metodo__grid .passo:last-child{
    animation:respirar 3.2s ease-in-out infinite;
  }
  .metodo__grid .passo:last-child:hover{animation-play-state:paused}

  .hero__media{will-change:transform}
}

/* ==========================================================================
   RESPONSIVO
   ========================================================================== */
@media (max-width:1279px){
  .institucional__grid{grid-template-columns:1fr minmax(0,44%);gap:2.5rem}
  .institucional__img{width:100%;min-height:0;aspect-ratio:532/312}
  .jornada__fluxo{grid-template-columns:repeat(4,1fr);gap:0}
  .etapa__circulo{width:100%;max-width:315px;height:auto;aspect-ratio:1}
  .bloco-autoridade{grid-template-columns:minmax(0,46%) 1fr}
}

@media (max-width:1024px){
  :root{--gutter:32px}
  .btn{min-width:0;padding-inline:2rem}
  .metodo__grid{grid-template-columns:repeat(3,1fr);gap:20px}
  .bloco-especialistas{min-height:0;padding:4rem 2rem}
  .bloco-especialistas__media{background-position:75% center}
  .jornada__fluxo{grid-template-columns:repeat(2,1fr);row-gap:3rem}
  .hero{min-height:0;padding-top:180px;padding-bottom:5rem}
}

@media (max-width:900px){
  .nav{
    position:fixed;inset:0 0 auto;
    flex-direction:column;align-items:stretch;gap:0;
    padding:97px var(--gutter) 2.5rem;
    background:var(--navy-fundo);
    transform:translateY(-100%);
    transition:transform .4s cubic-bezier(.4,0,.2,1);
    max-height:100dvh;overflow-y:auto;overscroll-behavior:contain;
  }
  .nav.esta-aberto{transform:translateY(0)}
  .nav__lista{flex-direction:column;align-items:stretch;gap:0}
  .nav__lista a{
    display:block;padding:1.125rem 0;font-size:.875rem;
    border-bottom:1px solid var(--linha-clara);
  }
  .nav__cta{margin-top:2rem;text-align:center}
  .nav-toggle{display:block}
  @media (prefers-reduced-motion:reduce){
    .nav{transition:none}
  }

  .institucional__grid{grid-template-columns:1fr;gap:2.5rem}
  .institucional__img{max-width:532px}
  .cards__grid{grid-template-columns:1fr;gap:20px;max-width:420px}
  .card{aspect-ratio:384/420}
  .bloco-especialistas::before{
    background:linear-gradient(180deg,rgba(30,48,78,.55) 0%,rgba(30,48,78,.9) 100%);
  }
  .bloco-autoridade{
    grid-template-columns:1fr;align-items:start;
    padding-top:0;
  }
  /* mobile: inverte a ordem — texto em cima, retrato alinhado à base do quadro */
  .bloco-autoridade__conteudo{
    grid-column:1;order:1;
    padding:2.5rem 2rem 1.5rem;
  }
  .bloco-autoridade__retrato{
    order:2;
    position:static;justify-self:center;align-self:end;
    width:min(420px,calc(100% - 24px));height:auto;aspect-ratio:592/739;
    margin:.75rem 0 0;
  }
  #o-especialista{padding-top:120px}
  .rodape{padding-block:2.5rem}
  .rodape__inner{flex-direction:column;align-items:flex-start;gap:1.5rem}
  .rodape__info{text-align:left;align-items:flex-start}
}

@media (max-width:640px){
  :root{--gutter:24px;--chanfro-caixa:22px}
  .hero{padding-top:150px}
  .institucional,.cards,.declaracao{padding-top:72px}
  #simples-nacional{padding-top:72px;padding-bottom:72px}
  .pilares{padding:80px 0}
  .jornada{padding:80px 0 72px;min-height:0}
  .jornada__fluxo{grid-template-columns:1fr;row-gap:2.5rem}
  .etapa__circulo{max-width:260px}
  .metodo{padding-top:80px}
  .metodo__grid{grid-template-columns:1fr;gap:16px}
  .passo{min-height:0}
  .passo__texto{font-size:.8125rem;padding-top:1rem}
  #o-especialista{padding-top:80px;padding-bottom:72px}
  .cta-final{padding:88px 0 72px}
  .acordeao__interno{padding-bottom:2.5rem}
}

/* ==========================================================================
   Contact Form 7 dentro de .sn-form — herda o visual do formulário estático.
   (Só entra em ação quando o form é servido pelo CF7.)
   ========================================================================== */
.sn-form .wpcf7-form-control-wrap{display:block}
.sn-form.wpcf7-form{gap:1.25rem}
.sn-form .wpcf7-spinner{margin:.5rem auto 0;display:block}

.sn-form .wpcf7-acceptance .wpcf7-list-item{margin:0}
.sn-form .wpcf7-acceptance label{
  display:flex;align-items:flex-start;gap:.75rem;margin-top:.25rem;
  font-size:.8125rem;line-height:1.5;color:var(--slate-1);cursor:pointer;
}
.sn-form .wpcf7-acceptance input{
  flex:0 0 auto;width:18px;height:18px;margin-top:.15rem;accent-color:var(--ouro);
}

.sn-form .wpcf7-response-output{
  margin:1rem 0 0;padding:.75rem 1rem;
  font-size:.8125rem;line-height:1.5;
  border:1px solid var(--linha-clara);color:var(--slate-1);
}
.sn-form .wpcf7-not-valid-tip{
  display:block;margin-top:.35rem;font-size:.75rem;letter-spacing:.02em;color:#ffb4a2;
}
.sn-form input.wpcf7-not-valid,
.sn-form select.wpcf7-not-valid,
.sn-form textarea.wpcf7-not-valid{border-color:#ffb4a2}