/* ===================================================================
   Carlos Filho — Assessor GWM Investments · BTG Pactual

   3.0 (2026-09-04) — "Briefing final de implementação", posicionamento
   Alta Renda / Wealth Management: paleta azul institucional (§7), sem
   dourado; tipografia única Inter variável (§4, §5, §6); grid 1200/720
   (§8); botões 52px, raio 6-8 (§33); animação só como fluidez (§34).

   A paleta segue fora do manual da GWM (#002733/#005779/#e4e5e3) e o
   logotipo SEGUE o manual: SVGs oficiais GWM|BTG, íntegros (p.50).
   Os aliases estruturais (--deep, --blue, --blue-300, --blue-200, --off)
   continuam sendo o ponto único de troca: solucao.css e calculadora.css
   só enxergam esses nomes.
=================================================================== */
:root{
  /* --- camada 1: paleta bruta (briefing 3.0, §7) --- */
  --navy-900:#05132A;   /* azul-marinho principal (base BTG Pactual): footer, blocos premium */
  --navy-800:#0B2859;   /* azul institucional: títulos especiais, detalhes */
  --navy-700:#10408D;   /* degrau entre 800 e o azul de ação */
  --navy-600:#154D9F;   /* degrau claro do fundo escuro */
  --blue-500:#195AB4;   /* azul de ação (botão principal do BTG): CTA, links, estados ativos */
  --blue-600:#10408D;   /* hover do azul de ação */
  --blue-200:#9DBCE6;   /* texto de acento sobre fundo escuro */
  --blue-100:#D6E2F3;   /* azul claro: fundos discretos, filetes */
  --blue-50:#F2F5FA;    /* azul extremamente claro: fundos alternados */
  --ink-900:#0E1E34;    /* texto principal: preto-azulado, mesma família do fundo */
  --ink-500:#536170;    /* texto secundário */

  /* --- aliases estruturais: um ponto único de troca de paleta ---
     Os nomes --gold* ficam por compatibilidade com solucao.css e
     calculadora.css; apontam para azul. Dourado saiu do site (§7). --- */
  --gold:var(--blue-500);
  --gold-100:var(--blue-100);
  --gold-300:var(--blue-200);
  --gold-600:var(--blue-600);
  --gold-800:var(--navy-800);
  --cream:#ffffff;
  --cream-2:var(--blue-50);
  --gray-300:var(--blue-100); /* texto secundário sobre fundo escuro */

  --deep:var(--navy-900);
  --deep-700:var(--navy-700);
  --deep-600:var(--navy-600);
  --blue:var(--navy-800);      /* acento em texto sobre fundo claro (AA) */
  --blue-300:var(--blue-500);  /* filetes/bordas sobre fundo escuro */
  --off:var(--blue-50);
  --off-2:var(--blue-50);
  --white:#ffffff;

  --green:#5b7954;
  --green-900:#344430;
  --gray:var(--ink-900);

  --ink:var(--ink-900);
  --muted:var(--ink-500);
  --line:var(--blue-100);
  --line-soft:var(--blue-50);

  /* semântico — alerta de custo, resultado positivo */
  --alert:#8c3a26;--positive:#4a7a3c;

  /* Os nomes --serif/--sans são estruturais (título/texto). Desde a 3.0
     os dois apontam para Inter: uma família só (§4). */
  --serif:"Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --sans:"Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  --wrap:1200px;
  --wrap-text:920px;   /* 3.7: coluna de leitura mais larga de novo, a pedido do dono (720 → 800 na 3.5 → 920) */
  --radius:4px;
  --radius-img:16px;  /* 3.10: fotos e ilustrações com canto arredondado, a pedido do dono */
  --shadow:0 18px 50px -28px rgba(5,19,42,.28);
  --shadow-sm:0 8px 24px -16px rgba(5,19,42,.28);
}

*{box-sizing:border-box}
[hidden]{display:none !important}
html{scroll-behavior:smooth;font-size:17px}
/* âncoras (#sobre, #contato…) param abaixo do header fixo, não atrás dele */
[id]{scroll-margin-top:92px}
/* 3.11: sem última linha com uma palavra só em títulos (órfã) */
h1,h2,h3{text-wrap:pretty}
::selection{background:var(--blue-500);color:#fff}
::-webkit-scrollbar{width:12px}
::-webkit-scrollbar-track{background:var(--off)}
::-webkit-scrollbar-thumb{background:var(--blue-100);border-radius:4px;border:3px solid var(--off)}
body{
  margin:0;
  font-family:var(--sans);
  font-weight:400;
  font-size:1.0588rem;   /* 18px: corpo 17–18 (§5) */
  color:var(--ink);
  background:var(--white);
  line-height:1.68;
  -webkit-font-smoothing:antialiased;
  font-optical-sizing:auto;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
strong{font-weight:600}
h1,h2,h3,h4{margin:0;font-family:var(--serif);font-weight:600;color:var(--deep)}
/* escala tipográfica (§5, §6): H1 60/42, H2 42/31, H3 26/23 */
h1{font-size:clamp(2.375rem,1.4rem + 2.8vw,3.75rem);line-height:1.05;letter-spacing:-.035em}
h2{font-size:clamp(1.9rem,1.35rem + 1.6vw,2.625rem);line-height:1.12;letter-spacing:-.025em}
h3{font-size:clamp(1.375rem,1.25rem + .4vw,1.625rem);line-height:1.25;letter-spacing:-.01em}

.container{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 40px}
.container--narrow{max-width:var(--wrap-text)}
.container--form{max-width:760px}

.eyebrow{
  font-size:.76rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:var(--blue);margin:0 0 20px;
}
.eyebrow--light{color:var(--blue-200)}
.section--deep .eyebrow,.strip .eyebrow,.hero--short .eyebrow,.sol-hero .eyebrow,.sol-cta .eyebrow{color:var(--blue-200)}
.center{text-align:center}
.light{color:var(--white)}

/* espaçamento entre grandes seções: 112–128 desktop, 72–88 mobile (§8) */
.section{padding:104px 0}
.section--white{background:var(--white)}
.section--soft{background:var(--off)}
.section--deep{position:relative;background:var(--navy-900);color:var(--white)}
.section--deep>*{position:relative;z-index:1}

.section__title{
  font-family:var(--serif);font-weight:600;
  font-size:clamp(1.9rem,1.35rem + 1.6vw,2.625rem);
  line-height:1.12;letter-spacing:-.025em;color:var(--deep);margin:0 0 26px;text-wrap:pretty;
  /* 3.7: sem teto de largura — o título corre até a borda da grade abaixo dele (áudio 22h22) */
}
.section__title.center{margin-left:auto;margin-right:auto}
.section--deep .section__title{color:var(--white)}
.section :where(p){color:var(--muted)}
.section--deep :where(p){color:var(--blue-100)}
.section--deep strong{color:var(--white)}
.section__lead{font-size:clamp(1.125rem,1.05rem + .35vw,1.3rem);font-weight:400;line-height:1.55;color:var(--muted);max-width:48em;margin:0 0 8px}
.section__lead.center{text-align:center;margin-left:auto;margin-right:auto}
.section--deep .section__lead{color:var(--blue-100)}

/* ---------- bloco editorial: título, parágrafos curtos, um negrito (§9, §13) ---------- */
.editorial h2{margin:0 0 26px}
.editorial p{margin:0 0 20px;font-size:clamp(1.125rem,1.05rem + .35vw,1.3rem);line-height:1.6;color:var(--muted);text-wrap:pretty}
.editorial p strong{color:var(--ink)}
.editorial .temas{font-size:clamp(1.2rem,1.1rem + .5vw,1.5rem);font-weight:500;line-height:1.5;color:var(--deep);letter-spacing:-.01em;margin-bottom:28px}
.editorial__cta{margin:36px 0 0 !important}
.editorial__foot{font-size:.9rem !important;margin:28px 0 0 !important}
.editorial--light h2,.editorial--light h3{color:var(--white)}
.editorial--light p{color:var(--blue-100)}
.editorial--light p strong{color:var(--white)}
.editorial--light .temas{color:var(--white)}

/* ---------- buttons (§33) ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  font-family:var(--sans);font-weight:600;font-size:.94rem;letter-spacing:0;
  min-height:52px;padding:0 28px;border-radius:4px;border:1.5px solid transparent;
  cursor:pointer;white-space:nowrap;
  transition:background-color .25s ease,border-color .25s ease,color .25s ease,box-shadow .25s ease;
}
/* CTA principal sobre fundo claro: azul de ação */
.btn--primary{background:var(--blue-500);color:var(--white);border-color:var(--blue-500)}
.btn--primary:hover{background:var(--blue-600);border-color:var(--blue-600)}
/* CTA principal sobre fundo escuro: branco com texto navy */
.btn--light{background:var(--white);color:var(--navy-900);border-color:var(--white)}
.btn--light:hover{background:var(--blue-100);border-color:var(--blue-100)}
.btn--deep{background:var(--deep);color:var(--white);border-color:var(--deep)}
.btn--deep:hover{background:var(--navy-800);border-color:var(--navy-800)}
.btn--ghost{background:transparent;border-color:rgba(255,255,255,.55);color:var(--white)}
.btn--ghost:hover{background:rgba(255,255,255,.1);border-color:var(--white)}
.btn--ghost.btn--dark{border-color:var(--navy-800);color:var(--navy-800)}
.btn--ghost.btn--dark:hover{background:var(--navy-800);color:var(--white)}
.btn--sm{min-height:42px;padding:0 20px;font-size:.88rem}
.btn--lg{min-height:56px;padding:0 32px;font-size:1rem}
.btn--block{width:100%}
.btn:focus-visible{outline:2px solid var(--blue-500);outline-offset:3px}
a:focus-visible,summary:focus-visible,.nav__toggle:focus-visible,.seg__btn:focus-visible{outline:2px solid var(--blue-500);outline-offset:3px;border-radius:2px}

/* link com seta: secundário ao lado do botão, e link das áreas de atuação */
.link-arrow{
  display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:.98rem;
  color:var(--blue-500);transition:color .2s;
}
.link-arrow .cta-arrow{display:inline-block;transition:transform .25s ease}
.link-arrow:hover{color:var(--blue-600)}
.link-arrow:hover .cta-arrow{transform:translateX(4px)}
.link-arrow--light{color:var(--white)}
.link-arrow--light:hover{color:var(--blue-200)}

/* ---------- nav (§10): sticky, limpo, sem sombra forte ---------- */
.nav{
  position:fixed;inset:0 0 auto 0;z-index:60;
  padding:18px 0;
  border-bottom:1px solid transparent;
  transition:background-color .3s ease,border-color .3s ease,padding .3s ease;
}
/* fio de progresso de leitura, embaixo do header */
.nav__progress{
  position:absolute;left:0;bottom:-1px;height:2px;width:100%;
  background:var(--blue-500);transform-origin:left;transform:scaleX(0);
  transition:transform .1s linear;pointer-events:none;
}
.nav__inner{display:flex;align-items:center;justify-content:space-between;gap:24px}

/* marca do assessor em texto: nome e função (§10) */
.brand{display:flex;align-items:center;gap:14px;min-width:0}
.brand__text{display:flex;flex-direction:column;line-height:1.1;color:var(--white)}
.brand__text strong{font-family:var(--serif);font-size:1.02rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:inherit}
.brand__text em{font-style:normal;font-size:.66rem;font-weight:500;letter-spacing:.06em;color:var(--blue-200);margin-top:3px}
/* páginas antigas ainda podem trazer o logotipo dentro do header; fica
   íntegro (manual p.50), separado por um fio. Na home ele não aparece
   aqui: vive na seção institucional e no rodapé (§19). */
.brand__rule{width:1px;height:26px;background:rgba(255,255,255,.24);flex-shrink:0}
.brand__gwm{height:26px;width:auto;flex-shrink:0;opacity:.92}
@media (min-width:901px) and (max-width:1320px){
  .brand__rule,.brand__gwm{display:none}
}

.nav__links{display:flex;align-items:center;flex-wrap:nowrap;gap:clamp(14px,1.6vw,28px)}
.nav__links>a{position:relative;white-space:nowrap;font-size:.92rem;font-weight:500;letter-spacing:-.01em;color:rgba(255,255,255,.88);transition:color .2s}
.nav__links>a:not(.nav__cta)::after{
  content:"";position:absolute;left:0;bottom:-6px;width:100%;height:1.5px;
  background:currentColor;opacity:.6;
  transform:scaleX(0);transform-origin:left;transition:transform .3s ease;
}
.nav__links>a:hover{color:var(--white)}
.nav__links>a:not(.nav__cta):hover::after{transform:scaleX(1)}
.nav__links .nav__cta{font-weight:600;flex-shrink:0;margin-left:8px}
.nav__links .btn--light.nav__cta{color:var(--navy-900)}
.nav__links .nav__cta::after{display:none}

/* seletor de idioma: menu suspenso (details), 9 idiomas */
.lang{position:relative;margin-left:4px}
.lang>summary{display:flex;align-items:center;gap:6px;list-style:none;cursor:pointer;padding:6px 9px;border-radius:4px;font-size:.78rem;font-weight:600;letter-spacing:.04em;color:rgba(255,255,255,.85);border:1px solid rgba(255,255,255,.28);transition:color .2s,background .2s}
.lang>summary::-webkit-details-marker{display:none}
.lang>summary::before{content:"";width:14px;height:14px;background:currentColor;opacity:.85;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3c3 3.2 3 14.8 0 18M12 3c-3 3.2-3 14.8 0 18'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3c3 3.2 3 14.8 0 18M12 3c-3 3.2-3 14.8 0 18'/%3E%3C/svg%3E") center/contain no-repeat}
.lang>summary::after{content:"";width:5px;height:5px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:translateY(-2px) rotate(45deg)}
.lang[open]>summary::after{transform:translateY(1px) rotate(-135deg)}
.lang ul{position:absolute;right:0;top:calc(100% + 8px);z-index:60;margin:0;padding:6px;list-style:none;min-width:190px;background:var(--white);border:1px solid var(--line);border-radius:4px;box-shadow:var(--shadow)}
.lang li a{display:flex;justify-content:space-between;gap:12px;padding:9px 10px;border-radius:3px;font-size:.9rem;font-weight:500;color:var(--navy-900);white-space:nowrap}
.lang li a:hover,.lang li a:focus-visible{background:rgba(5,19,42,.06);color:var(--blue-500)}
.lang li a[aria-current="true"]{font-weight:600;background:rgba(5,19,42,.08)}
.lang li a[aria-current="true"]::after{content:"¹3";color:var(--blue-500)}
.nav.is-solid .lang>summary,.nav--solid .lang>summary,.nav--on-light .lang>summary{color:var(--navy-900);border-color:rgba(5,19,42,.22)}
.nav.is-solid .lang>summary:hover,.nav--solid .lang>summary:hover,.nav--on-light .lang>summary:hover{color:var(--blue-500)}
/* fontes para escritas que a Inter nao cobre */
:lang(zh){font-family:"Inter","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC","Noto Sans SC",sans-serif}
:lang(ja){font-family:"Inter","Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic","Meiryo","Noto Sans CJK JP","Noto Sans JP",sans-serif}
:lang(zh) *,:lang(ja) *{letter-spacing:0!important}
:lang(zh) body,:lang(ja) body,html:lang(zh),html:lang(ja){line-break:strict;word-break:normal;overflow-wrap:anywhere}
.nav__toggle{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px}
.nav__toggle span{width:26px;height:2px;background:var(--white);border-radius:2px;transition:.3s}
.nav__toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav__toggle[aria-expanded="true"] span:nth-child(2){opacity:0;transform:scaleX(0)}
.nav__toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* Estado padrão (páginas internas com hero escuro): texto branco sobre o
   hero; ao rolar, fundo branco sólido e borda inferior discreta (§10). */
.nav.is-solid,.nav--solid{background:rgba(255,255,255,.96);backdrop-filter:blur(10px);border-bottom-color:var(--line);padding:12px 0}
.nav.is-solid .brand__text,.nav--solid .brand__text,
.nav.is-solid .nav__links>a:not(.nav__cta),.nav--solid .nav__links>a:not(.nav__cta){color:var(--navy-900)}
.nav.is-solid .brand__text em,.nav--solid .brand__text em{color:var(--muted)}
.nav.is-solid .nav__links>a:not(.nav__cta):hover,.nav--solid .nav__links>a:not(.nav__cta):hover{color:var(--blue-500)}
.nav.is-solid .nav__toggle span,.nav--solid .nav__toggle span{background:var(--navy-900)}
.nav.is-solid .brand__rule,.nav--solid .brand__rule{background:var(--line)}
.nav.is-solid .brand__gwm,.nav--solid .brand__gwm{filter:invert(1) brightness(.2)}
.nav.is-solid .nav__cta,.nav--solid .nav__cta,
.nav.is-solid .btn--light.nav__cta,.nav--solid .btn--light.nav__cta{background:var(--blue-500);border-color:var(--blue-500);color:var(--white)}
.nav.is-solid .btn--light.nav__cta:hover,.nav--solid .btn--light.nav__cta:hover{background:var(--blue-600);border-color:var(--blue-600)}

/* Home: o hero é claro, então o header já nasce com texto navy (§11, §12). */
.nav--on-light .brand__text,.nav--on-light .nav__links>a:not(.nav__cta){color:var(--navy-900)}
.nav--on-light .brand__text em{color:var(--muted)}
.nav--on-light .nav__links>a:not(.nav__cta):hover{color:var(--blue-500)}
.nav--on-light .nav__toggle span{background:var(--navy-900)}

/* ---------- hero (§11, §12): fundo claro, foto à direita, espaço à esquerda ---------- */
.hero{
  position:relative;padding:168px 0 112px;
  background:linear-gradient(180deg,var(--white) 0%,var(--blue-50) 100%);
  color:var(--ink);overflow:hidden;
}
.hero__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center;position:relative;z-index:2}
.hero__title{
  font-family:var(--serif);font-weight:600;
  font-size:clamp(2.375rem,1.4rem + 2.4vw,3.4rem);
  margin:0 0 28px;line-height:1.05;letter-spacing:-.035em;
  text-wrap:pretty;color:var(--navy-900);
}
.hero__sub{font-size:clamp(1.125rem,1.05rem + .35vw,1.3rem);font-weight:400;line-height:1.55;color:var(--muted);max-width:44em;margin:0 0 18px}
.hero__cta{display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px;margin:36px 0 22px}
.hero__note{font-size:.9rem;color:var(--muted);margin:0;max-width:44em}

.hero__media{display:flex;justify-content:flex-end}
.hero__photo{position:relative;width:min(560px,100%)}
.hero__photo img[data-photo]{
  width:100%;height:auto;border-radius:var(--radius-img);aspect-ratio:4/5;object-fit:cover;object-position:center 10%;
  box-shadow:0 30px 70px -30px rgba(5,19,42,.45);background:var(--blue-100);
}

/* variante escura sem foto (landing de câmbio) — mantém o header claro */
.hero--short{
  padding:160px 0 72px;
  background:var(--navy-900);color:var(--white);
}
.hero--short .hero__copy{max-width:920px}
.hero--short .hero__title,.hero--short h1{color:var(--white)}
.hero--short .hero__sub,.hero--short .hero__note{color:var(--blue-100)}
.hero--short .hero__hook{color:var(--white)}
.hero__hook{font-family:var(--serif);font-size:1.3rem;font-weight:600;line-height:1.3;letter-spacing:-.01em;max-width:40em;margin:-8px 0 30px}

/* ---------- animações de entrada (§34): fade + 8–12px, 250–400ms ---------- */
@keyframes riseIn{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:none}
}
.hero .eyebrow{animation:riseIn .4s .05s ease-out both}
.hero__title{animation:riseIn .4s .12s ease-out both}
.hero__sub{animation:riseIn .4s .2s ease-out both}
.hero__cta{animation:riseIn .4s .28s ease-out both}
.hero__note{animation:riseIn .4s .34s ease-out both}

/* ---------- perfis (§15): três colunas, sem card pesado ---------- */
.perfis{display:grid;grid-template-columns:repeat(3,1fr);gap:40px 48px;margin-top:56px}
.perfil{padding-top:22px;border-top:1px solid var(--navy-800)}
.perfil h3{margin-bottom:12px}
.perfil p{margin:0;font-size:1rem;line-height:1.6}

/* ---------- institucional (§19) ---------- */
.inst__close{color:var(--white);margin:36px 0 0;max-width:32em}
.inst__logos{margin-top:48px;padding-top:36px;border-top:1px solid rgba(255,255,255,.14)}
.inst__logos img{width:min(360px,100%);height:auto;opacity:.95}

/* ---------- áreas de atuação (§20, §21): grid 3×2, ícone linear, título, texto, link ---------- */
.areas{display:grid;grid-template-columns:repeat(3,1fr);gap:56px 48px;margin-top:64px}
.area{display:flex;flex-direction:column;align-items:flex-start}
.area__ico{width:28px;height:28px;fill:none;stroke:var(--blue-500);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;margin-bottom:20px}
.area h3{font-size:1.25rem;margin-bottom:10px}
.area p{margin:0 0 16px;font-size:1rem;line-height:1.6;flex:1}
.area p a{color:var(--blue-500);font-weight:500;border-bottom:1px solid var(--blue-100)}
.area .link-arrow{font-size:.94rem}

/* ---------- perguntas (§22): editorial, números grandes e discretos ---------- */
.asks{list-style:none;margin:40px 0 0;padding:0}
.asks li{
  display:grid;grid-template-columns:96px 1fr;gap:24px;align-items:start;
  padding:34px 0;border-top:1px solid var(--line);
}
.asks li:last-child{border-bottom:1px solid var(--line)}
.asks__n{font-size:clamp(2.2rem,2rem + 1vw,3rem);font-weight:500;line-height:1;letter-spacing:-.03em;color:var(--blue-100);font-variant-numeric:tabular-nums}
.asks li h3{font-size:clamp(1.25rem,1.15rem + .5vw,1.6rem);font-weight:500;line-height:1.3;color:var(--deep);text-wrap:pretty}
.asks__close{margin:48px 0 0;color:var(--deep)}

/* ---------- experiência (§23) ---------- */
.about__grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:72px;align-items:start}
.about__media{position:sticky;top:112px}
.about__frame img{
  width:100%;height:auto;border-radius:var(--radius-img);aspect-ratio:5/6;object-fit:cover;object-position:center 15%;
  box-shadow:var(--shadow);background:var(--blue-100);
}
.about__copy h2{margin-bottom:26px}
.about__copy p{margin:0 0 18px;font-size:1.02rem;line-height:1.68}
.about__copy p strong{color:var(--ink)}
.stats{
  display:grid;grid-template-columns:repeat(3,1fr);gap:24px 28px;margin:36px 0 32px;
  padding:28px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
}
.stat dt{font-family:var(--serif);font-weight:600;font-size:1.5rem;letter-spacing:-.025em;color:var(--navy-800);font-variant-numeric:tabular-nums;line-height:1.1}
.stat dd{margin:8px 0 0;font-size:.88rem;line-height:1.45;color:var(--muted)}

/* ---------- processo (§24): cinco passos ---------- */
.steps{position:relative;list-style:none;margin:56px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:32px 28px}
.step{position:relative;padding-top:22px;border-top:1px solid var(--navy-800)}
.step__n{display:block;font-size:.78rem;font-weight:600;letter-spacing:.08em;color:var(--blue-500);margin-bottom:14px;font-variant-numeric:tabular-nums}
.step h3{font-size:1.15rem;margin-bottom:10px}
.step p{font-size:.96rem;line-height:1.55;margin:0}
.steps--3{grid-template-columns:repeat(3,1fr)}
.section--deep .step{border-top-color:rgba(255,255,255,.22)}
.section--deep .step h3{color:var(--white)}
.section--deep .step__n{color:var(--blue-200)}

/* ---------- cards (páginas de ferramenta) ---------- */
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:30px}
.card{position:relative;overflow:hidden;background:var(--white);border:1px solid var(--line);border-radius:4px;padding:26px}
.card:hover{border-color:var(--blue-200)}
.card__ico{display:grid;place-items:center;width:52px;height:52px;border-radius:4px;background:var(--off);margin-bottom:16px}
.card__ico svg{width:24px;height:24px;fill:none;stroke:var(--blue-500);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.card h3{font-size:1.06rem;color:var(--deep);margin-bottom:8px}
.card p{font-size:.92rem;margin:0}
.card--link{display:flex;flex-direction:column}
.card--link p{flex:1}
.card__go{display:inline-block;margin-top:14px;font-size:.84rem;font-weight:600;color:var(--blue-500)}

/* ---------- tool / calc (ferramentas) ---------- */
.tool__grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.tool__lead{font-size:1.04rem}
.tool__hint{list-style:none;margin:20px 0 28px;padding:0;display:flex;flex-direction:column;gap:10px}
.tool__hint li{position:relative;padding-left:22px;color:var(--blue-100);font-size:.95rem}
.tool__hint li::before{content:"→";position:absolute;left:0;color:var(--blue-200)}
.tool__calc{background:var(--white);border-radius:4px;padding:30px;box-shadow:var(--shadow);color:var(--ink)}
.field{display:flex;flex-direction:column;gap:8px;margin-bottom:18px}
.field--row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.field--row>div{display:flex;flex-direction:column;gap:8px}
.field label{font-size:.86rem;font-weight:600;color:var(--deep)}
.field input,.field select,.field textarea{
  font-family:var(--sans);font-size:1rem;padding:13px 14px;border:1.5px solid var(--line);
  border-radius:4px;background:var(--white);color:var(--ink);transition:border-color .2s,box-shadow .2s;width:100%;min-height:50px;
}
.field input::placeholder,.field textarea::placeholder{color:var(--muted);opacity:.8}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--blue-500);box-shadow:0 0 0 3px rgba(25,90,180,.16)}
.calc__out{margin-top:22px;border-top:1px solid var(--line);padding-top:18px;display:flex;flex-direction:column;gap:10px}
.calc__out-row{display:flex;justify-content:space-between;align-items:baseline;font-size:.95rem;color:var(--muted)}
.calc__out-row strong{font-size:1.04rem;color:var(--deep);font-variant-numeric:tabular-nums}
.calc__out-row--big{border-top:1px dashed var(--line);padding-top:12px;margin-top:4px}
.calc__out-row--big span{font-weight:600;color:var(--deep)}
.calc__out-row--big strong{font-family:var(--serif);font-size:1.7rem;font-weight:600;color:var(--blue)}
.calc__note{font-size:.76rem;color:var(--muted);margin:16px 0 0}

/* input + toggle de unidade */
.input-unit{display:flex;gap:10px;align-items:stretch}
.input-unit input{flex:1;min-width:0}
.seg{display:inline-flex;flex-shrink:0;background:var(--off);border:1.5px solid var(--line);border-radius:4px;padding:3px;gap:2px}
.seg__btn{
  border:0;background:transparent;cursor:pointer;font-family:var(--sans);
  font-size:.8rem;font-weight:600;color:var(--muted);padding:8px 12px;border-radius:4px;
  transition:.2s;white-space:nowrap;line-height:1;
}
.seg__btn:hover{color:var(--deep)}
.seg__btn.is-active{background:var(--deep);color:var(--white)}
.calc__bar{display:flex;height:12px;border-radius:99px;overflow:hidden;margin:16px 0 10px;background:var(--off);box-shadow:inset 0 1px 2px rgba(0,0,0,.06)}
.calc__bar-inv{background:var(--blue-500);transition:width .6s ease}
.calc__bar-jur{background:var(--green);transition:width .6s ease}
.calc__legend{display:flex;justify-content:space-between;gap:16px;font-size:.82rem;color:var(--muted)}
.calc__legend b{color:var(--deep);font-weight:600;margin-left:4px}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px;vertical-align:middle}
.dot--inv{background:var(--blue-500)}
.dot--jur{background:var(--green)}

/* ---------- spread / calculadora (landing de câmbio) ---------- */
.spread__grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.spread__copy p{font-size:1.04rem}
.spread__hint{list-style:none;margin:22px 0 24px;padding:0;display:flex;flex-direction:column;gap:12px}
.spread__hint li{position:relative;padding-left:26px;color:var(--deep)}
.spread__hint li::before{content:"✓";position:absolute;left:0;color:var(--blue-500);font-weight:600}
.spread__note{font-size:.8rem;color:var(--muted);line-height:1.6;border-left:2px solid var(--line);padding-left:14px}
.spread__calc{background:var(--white);border-radius:4px;padding:30px;box-shadow:var(--shadow);border:1px solid var(--line);border-top:3px solid var(--blue-500)}
.spread__result{margin-top:24px;border-top:1px solid var(--line);padding-top:18px;display:flex;flex-direction:column;gap:10px}
.spread__row{display:flex;justify-content:space-between;align-items:baseline;gap:16px;font-size:.95rem;color:var(--muted)}
.spread__row em{font-style:normal;font-size:.78rem;color:var(--muted)}
.spread__row strong{color:var(--deep);font-variant-numeric:tabular-nums;white-space:nowrap}
.spread__row--big{border-top:1px dashed var(--line);padding-top:12px;margin-top:4px}
.spread__row--big span{font-weight:600;color:var(--deep)}
.spread__row--big strong{font-family:var(--serif);font-size:1.7rem;font-weight:600;color:var(--alert)}
.spread__row--year strong{color:var(--alert);font-size:1.1rem}
.spread__verdict{font-size:.92rem;color:var(--deep);background:var(--off);border-radius:4px;padding:12px 16px;margin:6px 0 4px}
.spread__calc .btn[disabled]{opacity:.6;cursor:wait}

/* ---------- faq (§26) ---------- */
.faq{margin-top:40px;display:flex;flex-direction:column}
.faq__item{border-top:1px solid var(--line);padding:4px 0}
.faq__item:last-child{border-bottom:1px solid var(--line)}
.faq__item summary{
  list-style:none;cursor:pointer;padding:22px 0;font-weight:500;color:var(--deep);
  font-size:1.1rem;display:flex;justify-content:space-between;align-items:center;gap:16px;
}
.faq__item summary::-webkit-details-marker{display:none}
.faq__item summary:hover{color:var(--blue-500)}
.faq__item summary::after{content:"+";font-size:1.5rem;color:var(--blue-500);font-weight:400;transition:transform .25s}
.faq__item[open] summary::after{transform:rotate(45deg)}
.faq__item p{margin:0 0 24px;color:var(--muted);font-size:1rem;max-width:80ch}

/* ---------- formulário (§28) ---------- */
.form__head{text-align:left;margin-bottom:40px}
.cta__form{background:var(--white);border:1px solid var(--line);border-radius:4px;padding:40px}
.cta__grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.cta__copy p{font-size:1.04rem}
.cta__list{list-style:none;margin:22px 0 28px;padding:0;display:flex;flex-direction:column;gap:12px}
.cta__list li{position:relative;padding-left:28px;color:var(--deep)}
.cta__list li::before{content:"✓";position:absolute;left:0;color:var(--blue-500);font-weight:600}
.cta__wa{display:inline-flex;align-items:center;gap:8px;font-weight:600;color:var(--blue-500)}
/* honeypot: precisa existir no DOM e ser inalcancavel por humano.
   display:none nao serve — parte dos robos ignora campo escondido assim.
   NAO renomear para .hp: essa classe ja e da maquina HP-12C em
   calculadora.css, e a colisao colapsa a calculadora inteira. */
.armadilha{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

.fset{border:0;padding:0;margin:8px 0 22px;min-width:0}
.fset legend{font-size:.86rem;font-weight:600;color:var(--deep);margin:0 0 12px;padding:0}
.opts{display:flex;flex-direction:column;gap:8px}
.opt{position:relative;display:flex;align-items:flex-start;gap:12px;cursor:pointer;padding:12px 14px;border:1.5px solid var(--line);border-radius:4px;transition:border-color .2s,background-color .2s}
.opt:hover{border-color:var(--blue-200)}
.opt input{width:18px;height:18px;flex:0 0 auto;margin:2px 0 0;accent-color:var(--blue-500)}
.opt span{font-size:.96rem;line-height:1.45;color:var(--ink)}
.opt:has(input:checked){border-color:var(--blue-500);background:var(--blue-50)}
.opt:has(input:focus-visible){box-shadow:0 0 0 3px rgba(25,90,180,.16)}

/* consentimento LGPD: caixa e rotulo lado a lado, rotulo em texto corrido */
.field--check{flex-direction:row;align-items:flex-start;gap:10px}
.field--check input{width:18px;height:18px;flex:0 0 auto;margin-top:3px;accent-color:var(--blue-500);min-height:0}
.field--check label{font-size:.84rem;font-weight:400;line-height:1.5;color:var(--muted)}
.field--check a{color:var(--blue-500);font-weight:500}

.cta__form-status{font-size:.98rem;font-weight:500;margin:18px 0 0;text-align:left;line-height:1.5;color:var(--deep)}
.cta__form-status:empty{display:none}
.cta__form-status[data-estado="ok"]{color:var(--deep)}
.cta__form-status[data-estado="aviso"]{color:var(--alert)}

.cta__form-note{font-size:.8rem;color:var(--muted);margin:16px 0 0;text-align:left}
.cta__form-note a{color:var(--blue-500);font-weight:500}

/* ---------- footer ---------- */
.footer{position:relative;background:var(--navy-900);color:var(--blue-100);padding:72px 0 28px}
.footer__grid{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:48px;padding-bottom:40px;border-bottom:1px solid rgba(255,255,255,.1)}
.brand--footer .brand__text strong{color:var(--white)}
.brand--footer .brand__text em{color:var(--blue-200)}
.footer__brand>p{margin:22px 0;font-size:.98rem;max-width:30em;color:var(--blue-100);line-height:1.6}
.footer__partners{display:flex;align-items:center;margin-top:22px}
.footer__partners img{width:min(320px,100%);height:auto;opacity:.95}
.footer__col h3{color:var(--white);font-size:.76rem;letter-spacing:.08em;text-transform:uppercase;margin-bottom:18px;font-weight:600}
.footer__col a{display:block;color:var(--blue-100);font-size:.94rem;margin-bottom:12px;transition:color .2s}
.footer__col a:hover{color:var(--white)}
.footer__addr{display:block;color:var(--blue-100);font-size:.88rem;margin-top:6px}
.footer__legal{position:relative;padding-top:28px}
.footer__legal p{font-size:.8rem;line-height:1.65;color:var(--blue-100);margin:0 0 12px;max-width:none;opacity:.9}
.footer__legal strong{color:var(--white);font-weight:600}
.footer__legal a{color:var(--white);font-weight:500;border-bottom:1px solid rgba(255,255,255,.3)}
.footer__meta{display:flex;flex-wrap:wrap;gap:8px 26px;margin-top:18px;color:var(--blue-100)}
.footer__meta span{font-size:.8rem}

/* ---------- WhatsApp flutuante (§29): discreto, com texto ---------- */
.wa-float{
  position:fixed;right:22px;bottom:22px;z-index:70;
  display:inline-flex;align-items:center;gap:10px;
  min-height:48px;padding:0 18px 0 14px;border-radius:4px;
  background:#25d366;color:#fff;font-weight:600;font-size:.9rem;
  box-shadow:var(--shadow-sm);transition:filter .2s;
}
.wa-float:hover{filter:brightness(.95)}

/* ---------- reveal (§34): fade + 10px, 350ms ---------- */
.reveal{opacity:0;transform:translateY(10px);transition:opacity .35s ease,transform .35s ease}
.reveal.is-in{opacity:1;transform:none}
/* grades: o container fica visível; cada item entra em sequência curta */
.perfis.reveal,.areas.reveal,.steps.reveal,.faq.reveal,.asks.reveal,.cards.reveal,.dims.reveal{opacity:1;transform:none}
.perfis.reveal .perfil,.areas.reveal .area,.steps.reveal .step,.faq.reveal .faq__item,.asks.reveal li,.cards.reveal .card,.dims.reveal .dim{
  opacity:0;transform:translateY(10px);transition:opacity .35s ease,transform .35s ease;
}
.perfis.reveal.is-in .perfil,.areas.reveal.is-in .area,.steps.reveal.is-in .step,.faq.reveal.is-in .faq__item,.asks.reveal.is-in li,.cards.reveal.is-in .card,.dims.reveal.is-in .dim{opacity:1;transform:none}
.perfis.reveal :nth-child(2),.areas.reveal :nth-child(2),.steps.reveal :nth-child(2),.faq.reveal :nth-child(2),.asks.reveal :nth-child(2),.cards.reveal :nth-child(2),.dims.reveal :nth-child(2){transition-delay:.06s}
.perfis.reveal :nth-child(3),.areas.reveal :nth-child(3),.steps.reveal :nth-child(3),.faq.reveal :nth-child(3),.asks.reveal :nth-child(3),.cards.reveal :nth-child(3),.dims.reveal :nth-child(3){transition-delay:.12s}
.areas.reveal :nth-child(4),.steps.reveal :nth-child(4),.faq.reveal :nth-child(4),.asks.reveal :nth-child(4),.cards.reveal :nth-child(4){transition-delay:.18s}
.areas.reveal :nth-child(5),.steps.reveal :nth-child(5),.faq.reveal :nth-child(5){transition-delay:.24s}
.areas.reveal :nth-child(6),.faq.reveal :nth-child(6){transition-delay:.3s}

@media (prefers-reduced-motion:reduce){
  .reveal,.perfis.reveal .perfil,.areas.reveal .area,.steps.reveal .step,.faq.reveal .faq__item,.asks.reveal li,.cards.reveal .card,.dims.reveal .dim{opacity:1;transform:none;transition:none;transition-delay:0s}
  html{scroll-behavior:auto}
  .hero .eyebrow,.hero__title,.hero__sub,.hero__cta,.hero__note{animation:none;opacity:1;transform:none}
}

/* ---------- links dentro de prosa: precisam ser visíveis ---------- */
.about__copy p a,.dim__oque a,.how__item p a,.mx-prose a,.mx-source a,.sol-hero__lead a{
  color:var(--blue-500);font-weight:500;border-bottom:1px solid var(--blue-100);transition:border-color .2s,color .2s;
}
.about__copy p a:hover,.dim__oque a:hover,.how__item p a:hover,.mx-prose a:hover,.mx-source a:hover,.sol-hero__lead a:hover{
  color:var(--blue-600);border-bottom-color:var(--blue-500);
}

/* ---------- dimensões (landing de câmbio ainda usa .dims/.dim) ---------- */
.dims{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:44px}
.dim{position:relative;display:flex;flex-direction:column;background:var(--white);border:1px solid var(--line);border-radius:4px;padding:30px 28px;transition:border-color .25s ease}
.dim:hover{border-color:var(--blue-200)}
.dim__n{font-size:.78rem;font-weight:600;letter-spacing:.08em;color:var(--blue-500);margin-bottom:14px}
.dim h3{font-size:1rem;font-weight:600;letter-spacing:0;color:var(--muted);margin-bottom:12px}
.dim h3 a{color:inherit}
.dim__q{font-family:var(--serif);font-weight:500;font-size:1.22rem;line-height:1.3;letter-spacing:-.01em;color:var(--deep);margin:0 0 14px;text-wrap:pretty}
.dim__oque{font-size:.9rem;line-height:1.5;color:var(--muted);margin:0;flex:1}
.dim__go{display:inline-block;margin-top:18px;font-size:.86rem;font-weight:600;color:var(--blue-500)}

/* ---------- fecho editorial (ferramentas ainda usa .ultima) ---------- */
.ultima{text-align:center}
.ultima__title{font-family:var(--serif);font-weight:600;font-size:clamp(1.9rem,1.35rem + 1.6vw,2.625rem);line-height:1.12;letter-spacing:-.025em;color:var(--deep);margin:0 0 22px;text-wrap:balance}
.ultima__title span{display:block}
.ultima__title span+span{color:var(--blue);margin-top:14px}
.ultima__lead{font-size:1.1rem;color:var(--muted);max-width:34em;margin:0 auto}
.offer__cta{display:flex;flex-direction:column;align-items:center;gap:14px;margin:40px 0 0;text-align:center}
.offer__cta span{font-size:.9rem;color:var(--muted)}
.ultima .offer__cta{margin-top:30px}
.cambio-pj{text-align:center}
.cambio-pj__cta{margin:32px 0 0}

/* ---------- CTA fixo no mobile (§35): CTA em ~100% da largura, WhatsApp ao lado ---------- */
.cta-fixa{display:none}

/* ===================================================================
   Responsive (§6, §8, §35)
=================================================================== */
@media (max-width:1024px){
  .container{padding:0 32px}
  .section{padding:96px 0}
  .areas{gap:44px 36px}
}
@media (max-width:960px){
  .hero__grid,.about__grid,.tool__grid,.cta__grid,.spread__grid{grid-template-columns:1fr}
  .hero{padding:136px 0 72px}
  .hero__media{justify-content:flex-start}
  .hero__photo{width:min(380px,100%)}
  .about__media{max-width:420px;position:static;top:auto}
  .steps{grid-template-columns:1fr 1fr}
  .cards{grid-template-columns:1fr 1fr}
  .perfis,.areas{grid-template-columns:1fr 1fr}
  .dims{grid-template-columns:1fr 1fr}
}
/* nav colapsa em tablet/laptop estreito para o CTA nunca vazar */
@media (max-width:900px){
  .nav__links{
    position:fixed;inset:72px 16px auto 16px;flex-direction:column;align-items:stretch;gap:4px;
    background:var(--white);padding:16px;border-radius:4px;border:1px solid var(--line);
    box-shadow:var(--shadow);transform:translateY(-8px);opacity:0;visibility:hidden;pointer-events:none;transition:.25s,visibility 0s .25s;
  }
  .nav__links.is-open{transform:none;opacity:1;visibility:visible;pointer-events:auto;transition:.25s}
  .nav__links>a,.nav__links>a:not(.nav__cta){padding:14px 8px;border-bottom:1px solid var(--line);color:var(--navy-900);font-size:1rem}
  .nav__links>a:not(.nav__cta)::after{display:none}
  .nav__links .nav__cta{margin:10px 0 0;justify-content:center;background:var(--blue-500);color:var(--white);border-color:var(--blue-500);border-bottom:0}
  .lang{margin:10px 0 0}
  .lang>summary,.nav .lang>summary{color:var(--navy-900);border-color:rgba(5,19,42,.22);justify-content:center}
  .lang ul{position:static;margin-top:6px;box-shadow:none}
  .nav__toggle{display:flex}
  /* no celular o header é sempre sólido: texto navy sobre branco */
  .nav,.nav.is-solid{background:rgba(255,255,255,.96);backdrop-filter:blur(10px);border-bottom-color:var(--line);padding:12px 0}
  .nav .brand__text,.nav .brand__text strong{color:var(--navy-900)}
  .nav .brand__text em{color:var(--muted)}
  .nav .nav__toggle span{background:var(--navy-900)}
  .nav .brand__gwm{filter:invert(1) brightness(.2)}
}

@media (max-width:640px){
  html{font-size:16px}
  .container{padding:0 22px}
  .section{padding:80px 0}
  .hero{padding:120px 0 64px}
  .steps,.cards,.field--row,.perfis,.areas,.dims{grid-template-columns:1fr}
  .stats{grid-template-columns:1fr}
  .footer__grid{grid-template-columns:1fr}
  .btn{width:100%;white-space:normal;text-align:center}
  .hero__cta{flex-direction:column;align-items:stretch}
  .hero__cta .link-arrow{justify-content:center}
  .editorial p{font-size:1.06rem}
  /* 3.14: títulos no celular — um degrau menor e com quebra balanceada.
     A 3.7 tirou o teto e o balance para o desktop encher a grade; a 331px
     de coluna isso virava h1 de 6 linhas e última linha órfã. */
  .hero__title{font-size:2rem;line-height:1.08;text-wrap:balance}
  .hero__sub{font-size:1.05rem}
  .section__title,.editorial h2{font-size:1.7rem;line-height:1.16;text-wrap:balance}
  .inst__close,.asks__close{text-wrap:balance}
  .editorial .temas{font-size:1.15rem}
  .asks li{grid-template-columns:56px 1fr;gap:16px;padding:26px 0}
  .cta__form{padding:26px 20px}
  .brand__rule,.brand__gwm{display:none}
  .wa-float{display:none}
  .cta-fixa{
    position:fixed;left:0;right:0;bottom:0;z-index:70;display:flex;gap:10px;
    padding:10px 14px calc(10px + env(safe-area-inset-bottom));
    background:rgba(255,255,255,.97);backdrop-filter:blur(10px);
    border-top:1px solid var(--line);
    transition:transform .3s ease;
  }
  .cta-fixa.is-hidden{transform:translateY(110%)}
  .cta-fixa .btn{flex:1;width:auto;min-height:50px;padding:0 16px;font-size:.95rem}
  .cta-fixa__wa{flex:0 0 50px;display:grid;place-items:center;border-radius:4px;border:1.5px solid var(--line);color:var(--navy-900)}
  body{padding-bottom:76px}
}

/* 3.6: figura ilustrativa ao lado do texto dos blocos temáticos da home */
.editorial__fig{margin:22px 0 0}
.editorial__fig img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius-img);border:1px solid var(--line);background:var(--blue-50)}
.editorial__fig figcaption{margin:10px 0 0;font-size:.88rem;color:var(--muted)}
@media (min-width:1000px){
  .editorial:has(.editorial__fig){max-width:1120px;display:grid;grid-template-columns:minmax(0,1fr) 400px;column-gap:56px;align-items:start}
  .editorial:has(.editorial__fig)>*{grid-column:1}
  /* 3.7: o título corre sobre as duas colunas; a figura começa na linha do primeiro parágrafo */
  .editorial:has(.editorial__fig)>h2{grid-column:1/-1}
  /* 3.8: sem sticky (a imagem "corria" junto com a rolagem, áudio 23h53);
     a figura estica até a altura do texto e a foto preenche por recorte */
  .editorial:has(.editorial__fig)>.editorial__fig{grid-column:2;grid-row:2/span 9;margin:6px 0 0;align-self:stretch;display:flex;flex-direction:column;min-height:0}
  /* flex-basis 0: a foto não impõe a altura natural dela; ocupa a altura que o texto der (mín. 300px) */
  .editorial:has(.editorial__fig)>.editorial__fig img{flex:1 1 0;min-height:300px;height:auto;aspect-ratio:auto}
}

/* ===== 3.15: resposta imediata ao toque, progresso do formulário, fechamento ===== */
.btn{transition:background-color .25s ease,border-color .25s ease,color .25s ease,box-shadow .25s ease,transform .12s ease}
.btn:active{transform:scale(.985)}
.story__card{transition:transform .25s ease,box-shadow .25s ease}
.story__card:hover{transform:translateY(-3px);box-shadow:var(--shadow-sm)}
.link-arrow:active .cta-arrow{transform:translateX(6px)}

.form-progress{display:flex;align-items:center;gap:12px;margin:0 0 18px;font-size:.86rem;color:var(--muted)}
.form-progress__bar{flex:0 0 120px;height:4px;border-radius:2px;background:var(--blue-100);overflow:hidden}
.form-progress__bar i{display:block;height:100%;width:0;background:var(--blue-500);border-radius:2px;transition:width .35s ease}
.form-progress.is-done{color:var(--navy-800);font-weight:500}
.form-progress.is-done .form-progress__bar i{background:var(--positive)}

.cta__form-status[data-estado="ok"]{display:flex;align-items:flex-start;gap:10px}
.cta__form-status[data-estado="ok"]::before{
  content:"";flex:0 0 22px;width:22px;height:22px;margin-top:2px;border-radius:50%;
  background:var(--positive) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7'/%3E%3C/svg%3E") center/14px no-repeat;
  animation:popIn .35s cubic-bezier(.2,.9,.3,1.3) both;
}
@keyframes popIn{from{transform:scale(.4);opacity:0}to{transform:none;opacity:1}}
.form-next{margin:14px 0 0;padding:0 0 0 22px;font-size:.94rem;line-height:1.6;color:var(--muted)}
.form-next li{margin:4px 0}
@media (prefers-reduced-motion:reduce){
  .btn:active,.story__card:hover{transform:none}
  .cta__form-status[data-estado="ok"]::before{animation:none}
  .form-progress__bar i{transition:none}
}
