/* =========================================================
   Sílvia Castro Licitações — Landing Page
   Paleta extraída da logo: marinho #0D1B38 / âmbar #C8964B / off-white #F5F1E8
   Mobile-first. Tipografia fluida. Sem dependências.
   ========================================================= */

:root{
  /* marca */
  --navy-900:#070F22;
  --navy-800:#0A1730;
  --navy-700:#0D1B38;
  --navy-600:#132447;
  --navy-500:#1B3159;
  --line:rgba(200,150,75,.20);
  --line-soft:rgba(245,241,232,.10);

  --gold-400:#E0AC5F;
  --gold-500:#C8964B;
  --gold-600:#B07E33;

  --ivory:#F5F1E8;
  --white:#FFFFFF;
  --text:#EDE9E0;
  --muted:rgba(237,233,224,.70);
  --muted-2:rgba(237,233,224,.52);

  /* superfícies claras */
  --paper:#FBFAF7;
  --paper-2:#F3F0E9;
  --ink:#101A2E;
  --ink-soft:rgba(16,26,46,.72);
  --ink-mute:rgba(16,26,46,.68);

  /* tipografia fluida */
  --f-h1: clamp(2.3rem, 1.5rem + 3.3vw, 4.15rem);
  --f-h2: clamp(1.65rem, 1.15rem + 2.1vw, 2.85rem);
  --f-h3: clamp(1.06rem, .98rem + .38vw, 1.3rem);
  --f-lead: clamp(1rem, .95rem + .35vw, 1.16rem);
  --f-body: clamp(.945rem, .92rem + .18vw, 1.02rem);
  --f-small: clamp(.8rem, .78rem + .1vw, .875rem);

  /* ritmo */
  --gut: clamp(1.15rem, .8rem + 2.2vw, 2.5rem);
  --sec-y: clamp(3.6rem, 2.2rem + 6vw, 7.5rem);
  --r-lg:4px; --r-md:3px; --r-sm:3px;
  --shell:1200px;

  --ease:cubic-bezier(.22,.72,.26,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:86px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body{
  margin:0; background:var(--navy-800); color:var(--text);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:var(--f-body); line-height:1.62;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,svg{display:block; max-width:100%; height:auto}
ul,ol{margin:0; padding:0; list-style:none}
p{margin:0}
a{color:inherit; text-decoration:none}

h1,h2,h3{
  font-family:"Instrument Sans",Inter,system-ui,sans-serif;
  font-weight:600; line-height:1.12; margin:0;
  letter-spacing:-.03em; text-wrap:balance;
}
h3{letter-spacing:-.02em; line-height:1.2}

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

.skip-link{
  position:absolute; left:-9999px; top:0; z-index:200;
  background:var(--gold-500); color:var(--navy-900);
  padding:.75rem 1.15rem; border-radius:0 0 var(--r-sm) 0; font-weight:700;
}
.skip-link:focus{left:0}

:where(a,button,input,select,textarea,summary,details):focus-visible{
  outline:2px solid var(--gold-400); outline-offset:3px; border-radius:6px;
}

/* ============== BOTÕES ============== */
.btn{
  --bh:54px;
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  min-height:var(--bh); padding:.85rem 1.5rem;
  border:1px solid transparent; border-radius:3px;
  font-family:inherit; font-size:var(--f-small); font-weight:600;
  letter-spacing:.015em; text-align:center; cursor:pointer;
  transition:transform .22s var(--ease), box-shadow .22s var(--ease),
             background .22s var(--ease), border-color .22s var(--ease), color .22s var(--ease);
}
.btn--sm{--bh:44px; padding:.55rem 1.15rem}
.btn--lg{--bh:58px; padding:1rem 1.75rem; font-size:clamp(.875rem,.85rem + .2vw,.98rem)}
.btn--block{width:100%}

.btn--gold{
  background:linear-gradient(135deg,var(--gold-400),var(--gold-600));
  color:#20160A; font-weight:700;
  box-shadow:0 10px 26px -12px rgba(200,150,75,.62);
}
.btn--gold:hover{transform:translateY(-2px); box-shadow:0 16px 34px -12px rgba(200,150,75,.75)}
.btn--gold:active{transform:translateY(0)}

.btn--ghost{
  background:rgba(245,241,232,.04); color:var(--text);
  border-color:rgba(245,241,232,.22);
}
.btn--ghost:hover{border-color:var(--gold-500); color:var(--gold-400); background:rgba(200,150,75,.08)}

/* em seção de fundo claro o fantasma precisa inverter, senão desaparece */
.faq .btn--ghost,.service .btn--ghost,.mkt .btn--ghost{
  background:rgba(16,26,46,.03); color:var(--ink);
  border-color:rgba(16,26,46,.28);
}
.faq .btn--ghost:hover,.service .btn--ghost:hover,.mkt .btn--ghost:hover{
  background:rgba(200,150,75,.12); color:var(--gold-600);
  border-color:var(--gold-600);
}

/* ============== HEADER ============== */
.nav{
  position:sticky; top:0; z-index:100;
  background:rgba(10,23,48,.72);
  backdrop-filter:blur(14px) saturate(1.4);
  -webkit-backdrop-filter:blur(14px) saturate(1.4);
  border-bottom:1px solid transparent;
  transition:background .3s var(--ease), border-color .3s var(--ease);
}
.nav.is-stuck{background:rgba(7,15,34,.93); border-bottom-color:var(--line)}
.nav__inner{display:flex; align-items:center; gap:1rem; min-height:68px}
.nav__brand{display:flex; align-items:center; gap:.65rem; margin-right:auto}
.nav__logo{width:44px; height:44px; border-radius:50%; flex:none}
.nav__brandtext{display:flex; flex-direction:column; line-height:1.1}
.nav__brandtext strong{
  font-family:"Instrument Sans",Inter,system-ui,sans-serif; font-size:1.06rem;
  font-weight:600; color:var(--ivory); letter-spacing:.01em;
}
.nav__brandtext em{
  font-style:normal; font-size:.6rem; letter-spacing:.24em;
  text-transform:uppercase; color:var(--gold-400);
}
.nav__links{display:none}
.nav__cta{display:none}

@media (min-width:640px){ .nav__cta{display:inline-flex} }
@media (min-width:1000px){
  .nav__inner{min-height:78px; gap:1.75rem}
  .nav__logo{width:46px; height:46px}
  .nav__links{display:flex; gap:clamp(.85rem,1.4vw,1.6rem)}
  .nav__links a{
    position:relative; font-size:.83rem; font-weight:500;
    color:var(--muted); padding:.35rem 0; transition:color .2s var(--ease);
  }
  .nav__links a::after{
    content:""; position:absolute; left:0; right:100%; bottom:0; height:1px;
    background:var(--gold-500); transition:right .28s var(--ease);
  }
  .nav__links a:hover{color:var(--ivory)}
  .nav__links a:hover::after{right:0}
}

/* ============== HERO ============== */
.hero{position:relative; isolation:isolate; overflow:hidden;
  background:
    radial-gradient(120% 90% at 82% 6%, rgba(200,150,75,.16), transparent 58%),
    radial-gradient(90% 70% at 0% 100%, rgba(27,49,89,.7), transparent 60%),
    linear-gradient(180deg,var(--navy-800),var(--navy-900));
}
.hero__bg{position:absolute; inset:0; z-index:-1; pointer-events:none}
.hero__grid{position:absolute; inset:0; width:100%; height:100%; opacity:.55;
  mask-image:radial-gradient(70% 60% at 50% 35%,#000 20%,transparent 80%);
  -webkit-mask-image:radial-gradient(70% 60% at 50% 35%,#000 20%,transparent 80%);
}
.hero__glow{position:absolute; border-radius:50%; filter:blur(70px)}
.hero__glow--a{width:46vw; height:46vw; max-width:520px; max-height:520px;
  top:-14%; right:-10%; background:rgba(200,150,75,.22); animation:float 16s var(--ease) infinite alternate}
.hero__glow--b{width:38vw; height:38vw; max-width:420px; max-height:420px;
  bottom:-16%; left:-12%; background:rgba(27,49,89,.85); animation:float 20s var(--ease) infinite alternate-reverse}
@keyframes float{to{transform:translate3d(26px,-22px,0) scale(1.07)}}

.hero__inner{
  display:grid; gap:clamp(2.5rem,5.5vw,4.25rem);
  padding-block:clamp(3.5rem,8vw,7rem) clamp(3.75rem,8vw,7.5rem);
}
.eyebrow{
  display:inline-flex; align-items:center; gap:.55rem;
  font-size:clamp(.66rem,.63rem + .12vw,.745rem); font-weight:600;
  letter-spacing:.17em; text-transform:uppercase; color:var(--gold-400);
  border:0; padding:.4rem .9rem; margin-bottom:1.25rem;
  max-width:100%; text-wrap:balance;
  border-left:2px solid var(--gold-500); border-radius:0;
  background:rgba(200,150,75,.06);
}
.eyebrow__dot{display:none}

.hero__h1{
  font-size:var(--f-h1); color:var(--ivory);
  line-height:1.14; letter-spacing:-.028em;
  margin-bottom:1.5rem; text-wrap:normal;
}
/* em tela estreita as quebras manuais atrapalham: o texto flui */
@media (max-width:560px){
  .hero__h1 br{display:none}
  .hero__h1{text-wrap:balance}
}
.hero__h1 em{font-style:italic; color:var(--gold-400)}
.hero__h1 strong{
  font-weight:700; color:var(--white); position:relative; white-space:nowrap;
}
.hero__h1 strong::after{
  content:""; position:absolute; left:0; right:0; bottom:.06em; height:.14em;
  background:linear-gradient(90deg,var(--gold-500),rgba(200,150,75,0));
  border-radius:2px; transform-origin:left; animation:swipe 1s var(--ease) .5s both;
}
@keyframes swipe{from{transform:scaleX(0)} to{transform:scaleX(1)}}

.hero__lead{
  font-size:var(--f-lead); color:var(--muted); max-width:52ch;
  line-height:1.7; margin-bottom:2rem; text-wrap:pretty;
}
@media (min-width:620px){.hero__lead{margin-bottom:2.25rem}}
.hero__actions{display:flex; flex-direction:column; gap:.7rem; margin-bottom:1.9rem}
@media (min-width:620px){
  .hero__actions{flex-direction:row; flex-wrap:wrap; align-items:center}
  .hero__actions .btn{flex:0 1 auto}
}

.hero__trust{display:grid; gap:.75rem; margin-top:.35rem}
.hero__trust li{
  display:flex; align-items:flex-start; gap:.55rem;
  font-size:var(--f-small); color:var(--muted-2);
}
.hero__trust span{color:var(--gold-400); font-weight:700; flex:none}

/* painel do hero */
.hero__panel{position:relative}
.panel{
  position:relative; border-radius:var(--r-lg);
  background:linear-gradient(165deg,rgba(19,36,71,.92),rgba(10,23,48,.96));
  border:1px solid var(--line);
  padding:clamp(1.25rem,3.2vw,1.75rem);
  box-shadow:0 34px 70px -34px rgba(0,0,0,.8);
}
.panel__top{display:flex; align-items:center; justify-content:space-between; gap:.75rem; flex-wrap:wrap;
  padding-bottom:1rem; margin-bottom:1.15rem; border-bottom:1px solid var(--line-soft)}
.panel__tag{
  font-family:"Instrument Sans",Inter,system-ui,sans-serif; font-size:1.18rem;
  color:var(--ivory); letter-spacing:.01em;
}
.panel__live{
  display:inline-flex; align-items:center; gap:.42rem;
  font-size:.68rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase;
  color:var(--gold-400);
}
.panel__live i{width:7px; height:7px; border-radius:50%; background:var(--gold-400);
  animation:pulse 2.2s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1; box-shadow:0 0 0 0 rgba(200,150,75,.5)}
  50%{opacity:.55; box-shadow:0 0 0 6px rgba(200,150,75,0)}}

.panel__steps{display:grid; gap:1rem}
.panel__steps li{display:flex; gap:.85rem; align-items:flex-start}
.panel__num{
  flex:none; width:29px; height:29px; border-radius:50%;
  display:grid; place-items:center;
  font-size:.76rem; font-weight:700; color:var(--gold-400);
  border:1px solid var(--line); background:rgba(200,150,75,.09);
}
.panel__steps strong{display:block; font-size:.945rem; color:var(--ivory); font-weight:600; line-height:1.35}
.panel__steps p{font-size:var(--f-small); color:var(--muted-2); margin-top:.15rem}
.panel__cta{
  display:inline-flex; align-items:center; gap:.45rem; margin-top:1.1rem;
  padding-top:1.1rem; padding-bottom:.35rem; min-height:50px; position:relative; z-index:2;
  border-top:1px solid var(--line-soft);
  width:100%; font-size:var(--f-small); font-weight:600; color:var(--gold-400);
}
.panel__cta span{transition:transform .22s var(--ease)}
.panel__cta:hover span{transform:translateX(5px)}
.panel__stamp{display:none}

@media (min-width:980px){
  .hero__inner{grid-template-columns:minmax(0,1.22fr) minmax(0,.78fr); align-items:center}
  .panel__stamp{
    display:block; position:absolute; right:-30px; top:-52px;
    padding:9px; border-radius:50%; background:var(--navy-900);
    border:1px solid var(--line); box-shadow:0 18px 36px -18px rgba(0,0,0,.9);
    animation:bob 7s var(--ease) infinite alternate;
  }
  .panel__stamp img{width:64px; height:64px; border-radius:50%}
  @keyframes bob{to{transform:translateY(-9px)}}
}

/* ============== TÍTULOS DE SEÇÃO ============== */
.sec__head{margin-bottom:clamp(1.9rem,4vw,3rem)}
.sec__head--center{text-align:center; max-width:40rem; margin-inline:auto}
.sec__kicker{display:none}
.sec__kicker--gold{color:var(--gold-400)}
.sec__h{font-size:var(--f-h2)}
.sec__h em{font-style:italic; color:var(--gold-500)}
.sec__lead{font-size:var(--f-lead); color:var(--ink-soft); line-height:1.68; margin-top:1.15rem; max-width:58ch}
.sec__lead--center{margin-inline:auto}
.sec__lead strong{color:var(--ink); font-weight:600}

/* ============== CHAMAMENTO / SPOTLIGHT ============== */
.spotlight{
  position:relative; padding-block:clamp(2.5rem,5vw,4rem);
  background:linear-gradient(180deg,var(--navy-900),var(--navy-800));
}
.spot{
  position:relative; overflow:hidden; border-radius:var(--r-lg);
  background:linear-gradient(150deg,rgba(200,150,75,.14),rgba(19,36,71,.55) 42%,rgba(10,23,48,.9));
  border:1px solid rgba(200,150,75,.34);
  padding:clamp(1.3rem,3.6vw,2.3rem);
  box-shadow:0 30px 64px -34px rgba(0,0,0,.75);
}
.spot__ribbon{
  position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg,var(--gold-600),var(--gold-400),var(--gold-600));
  background-size:200% 100%; animation:slide 4.5s linear infinite;
}
@keyframes slide{to{background-position:200% 0}}
.spot__head{
  display:flex; align-items:center; justify-content:space-between;
  gap:.75rem .9rem; flex-wrap:wrap;
  margin:0 0 1.35rem; padding-bottom:1rem;
  border-bottom:1px solid var(--line-soft);
}
.spot__badge{
  display:inline-flex; align-items:center; gap:.45rem;
  font-size:.68rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:#22170A; background:linear-gradient(135deg,var(--gold-400),var(--gold-600));
  padding:.42rem .85rem; border-radius:2px;
}
.spot__badge i{display:none}
.spot__meta{font-size:var(--f-small); color:var(--gold-400); font-weight:600}
.spot__body{display:grid; gap:clamp(1.25rem,3vw,2.25rem); align-items:start}
.spot__h{font-size:clamp(1.42rem,1.1rem + 1.6vw,2.3rem); color:var(--ivory); margin-top:0}
.spot__main{display:flex; flex-direction:column; justify-content:flex-start}
.spot__text{font-size:var(--f-lead); color:var(--muted); margin-top:.85rem; max-width:52ch}
.spot__facts{display:grid; gap:.85rem; margin:0 0 1.25rem}
.spot__facts div{
  padding:.75rem .95rem; border-radius:var(--r-sm);
  background:rgba(7,15,34,.5); border:1px solid var(--line-soft);
}
.spot__facts dt{font-size:.66rem; font-weight:600; letter-spacing:.14em;
  text-transform:uppercase; color:var(--gold-500); margin-bottom:.2rem}
.spot__facts dd{margin:0; font-size:var(--f-small); color:var(--ivory); font-weight:500}
.spot__note{
  text-align:center; font-size:var(--f-small); color:var(--muted-2);
  margin-top:1.25rem; max-width:48ch; margin-inline:auto;
}
@media (min-width:860px){
  .spot__body{grid-template-columns:minmax(0,1.5fr) minmax(0,.95fr); align-items:start}
  .spot__side{border-left:1px solid var(--line-soft); padding-left:clamp(1.25rem,2.5vw,2rem)}
  .spot__facts{grid-template-columns:1fr}
}
@media (min-width:520px) and (max-width:859px){
  .spot__facts{grid-template-columns:1fr 1fr}
}

/* ============== SERVIÇO ============== */
.service{background:var(--paper); color:var(--ink); padding-block:var(--sec-y)}
.service .sec__h{color:var(--ink)}
.srv__grid{display:grid; gap:1rem}
.srv{
  position:relative; overflow:hidden;
  padding:clamp(1.3rem,2.8vw,1.75rem); border-radius:var(--r-md);
  background:var(--white); border:1px solid rgba(16,26,46,.09);
  transition:transform .26s var(--ease), box-shadow .26s var(--ease), border-color .26s var(--ease);
}
.srv::before{
  content:""; position:absolute; inset:0 auto 0 0; width:3px;
  background:linear-gradient(180deg,var(--gold-400),var(--gold-600));
  transform:scaleY(0); transform-origin:top; transition:transform .3s var(--ease);
}
.srv:hover{transform:translateY(-5px); box-shadow:0 22px 44px -22px rgba(16,26,46,.24); border-color:rgba(200,150,75,.42)}
.srv:hover::before{transform:scaleY(1)}
.srv__n{
  display:block; font-family:"Instrument Sans",Inter,system-ui,sans-serif;
  font-size:1.85rem; font-weight:600; line-height:1;
  color:rgba(200,150,75,.5); margin-bottom:.65rem;
}
.srv h3{font-size:var(--f-h3); color:var(--ink); margin-bottom:.45rem}
.srv p{font-size:var(--f-small); color:var(--ink-mute); line-height:1.6}
@media (min-width:640px){.srv__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.srv__grid{grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.15rem}}

/* ============== DIFERENCIAL / COMPARATIVO ============== */
.edge{
  padding-block:var(--sec-y);
  background:
    radial-gradient(80% 60% at 8% 0%,rgba(200,150,75,.13),transparent 58%),
    linear-gradient(180deg,var(--navy-900),var(--navy-800));
}
.edge .sec__h{color:var(--ivory)}
.edge .sec__h em{color:var(--gold-400)}
.edge .sec__lead{color:var(--muted)}
.edge .sec__lead em{color:var(--gold-400); font-style:italic}
.edge__head{max-width:46rem; margin-bottom:clamp(2rem,4vw,3rem)}

.edge__pillars{display:grid; gap:.85rem; margin-top:clamp(1.9rem,4vw,2.75rem)}
.edge__pillars li{
  padding:1.15rem 1.25rem; border-radius:var(--r-sm);
  background:rgba(7,15,34,.5); border:1px solid var(--line-soft);
  border-top:2px solid var(--gold-500);
  transition:transform .24s var(--ease), border-color .24s var(--ease)}
.edge__pillars li:hover{transform:translateY(-4px); border-color:rgba(200,150,75,.5)}
.edge__pillars strong{
  display:block; font-family:"Instrument Sans",Inter,system-ui,sans-serif;
  font-size:1.2rem; font-weight:600; color:var(--gold-400); margin-bottom:.3rem;
}
.edge__pillars span{font-size:var(--f-small); color:var(--muted-2); line-height:1.55}
@media (min-width:600px){.edge__pillars{grid-template-columns:1fr 1fr}}
@media (min-width:1024px){.edge__pillars{grid-template-columns:repeat(4,1fr)}}

/* ============== AUTORIDADE ============== */
.author{
  padding-block:var(--sec-y);
  background:
    radial-gradient(70% 60% at 100% 100%,rgba(200,150,75,.12),transparent 60%),
    linear-gradient(180deg,var(--navy-800),var(--navy-900));
}
.author .sec__h{color:var(--ivory); font-size:clamp(1.9rem,1.3rem + 2.6vw,3.15rem)}
.author .sec__lead{color:var(--muted)}
.author .sec__lead strong{color:var(--gold-400); font-weight:600}
.author__inner{display:grid; gap:clamp(1.9rem,4vw,3.25rem); align-items:center}
.author__mark{margin:0; text-align:center}
.author__mark img{
  width:clamp(140px,34vw,196px); height:auto; margin-inline:auto; border-radius:50%;
  border:1px solid var(--line); box-shadow:0 26px 54px -26px rgba(0,0,0,.85);
}
.author__mark figcaption{
  margin-top:1rem; font-size:.68rem; font-weight:600; letter-spacing:.18em;
  text-transform:uppercase; color:var(--gold-500);
}
.author__badges{display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.5rem}
.badge{
  display:inline-flex; align-items:center; gap:.4rem;
  font-size:var(--f-small); font-weight:500; color:var(--ivory);
  border:1px solid var(--line); background:rgba(200,150,75,.08);
  padding:.5rem 1rem; border-radius:2px;
}
.badge i{font-style:normal; color:var(--gold-400)}
.author__note{
  margin-top:1.25rem; font-size:var(--f-small); color:var(--muted-2);
  padding-left:.95rem; border-left:2px solid rgba(200,150,75,.42); max-width:48ch;
}
.author__ig{
  display:inline-flex; align-items:center; gap:.5rem; margin-top:1.5rem;
  min-height:48px; padding:.65rem 1.1rem .65rem .95rem; border-radius:3px;
  border:1px solid var(--line-soft); background:rgba(200,150,75,.07);
  font-size:var(--f-small); font-weight:600; color:var(--gold-400);
  transition:color .2s var(--ease), gap .2s var(--ease),
             border-color .2s var(--ease), background .2s var(--ease);
}
.author__ig:hover{color:var(--gold-500); gap:.7rem;
  border-color:rgba(200,150,75,.5); background:rgba(200,150,75,.12)}
@media (min-width:860px){
  .author__inner{grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr)}
  .author__mark{text-align:left}
  .author__mark img{margin-inline:0}
}

/* ============== FAQ ============== */
.faq{background:linear-gradient(180deg,var(--paper),var(--paper-2)); color:var(--ink); padding-block:var(--sec-y)}
.faq .sec__h{color:var(--ink)}
.faq__inner{display:grid; gap:clamp(1.75rem,3.5vw,3rem)}
.faq__head .btn{margin-top:1.5rem}
.faq__list{display:grid; gap:.7rem}
.qa{
  background:var(--white); border:1px solid rgba(16,26,46,.1);
  border-radius:var(--r-sm); overflow:hidden;
  transition:border-color .24s var(--ease), box-shadow .24s var(--ease);
}
.qa[open]{border-color:rgba(200,150,75,.5); box-shadow:0 14px 32px -20px rgba(16,26,46,.26)}
.qa summary{
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:1.1rem 1.15rem; cursor:pointer; list-style:none;
  font-size:clamp(.92rem,.9rem + .2vw,1.02rem); font-weight:600; color:var(--ink);
  min-height:56px; transition:color .2s var(--ease);
}
.qa summary::-webkit-details-marker{display:none}
.qa summary:hover{color:var(--gold-600)}
.qa summary i{
  position:relative; flex:none; width:22px; height:22px; border-radius:50%;
  border:1px solid rgba(200,150,75,.5);
}
.qa summary i::before,.qa summary i::after{
  content:""; position:absolute; inset:50% 5px auto 5px; height:1.5px;
  background:var(--gold-600); transform:translateY(-50%); border-radius:2px;
  transition:transform .26s var(--ease), opacity .26s var(--ease);
}
.qa summary i::after{transform:translateY(-50%) rotate(90deg)}
.qa[open] summary i::after{transform:translateY(-50%) rotate(0); opacity:0}
.qa__a{padding:0 1.15rem 1.2rem}
.qa__a p{font-size:var(--f-small); color:var(--ink-mute); line-height:1.66; max-width:62ch}
.qa[open] .qa__a{animation:fadeDown .3s var(--ease) both}
@keyframes fadeDown{from{opacity:0; transform:translateY(-6px)} to{opacity:1; transform:none}}
@media (min-width:980px){
  .faq__inner{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(2rem,4vw,4rem); align-items:start}
  .faq__head{position:sticky; top:110px}
}

/* ============== FECHAMENTO ============== */
.fecha{
  padding-block:var(--sec-y);
  background:
    radial-gradient(80% 60% at 50% 0%,rgba(200,150,75,.15),transparent 60%),
    linear-gradient(180deg,var(--navy-900),#050B18);
  text-align:center;
}
.fecha__in{max-width:38rem; margin-inline:auto}
.fecha .sec__h{color:var(--ivory)}
.fecha .sec__h::before{margin-inline:auto;
  background:linear-gradient(90deg,rgba(200,150,75,0),var(--gold-500),rgba(200,150,75,0))}
.fecha__sub{
  font-size:var(--f-lead); color:var(--muted);
  margin:1rem auto 2rem; max-width:44ch;
}
.fecha__cta{min-width:min(100%,19rem)}
/* ============== RODAPÉ ============== */
/* ============== RODAPÉ ============== */
.foot{border-top:1px solid var(--line); background:var(--navy-900)}
.foot__fim{
  display:flex; flex-direction:column; gap:.4rem;
  padding-block:clamp(1.6rem,3.5vw,2.25rem);
  font-size:.79rem; color:rgba(237,233,224,.62); line-height:1.5;
}
.foot__cred{margin-top:.35rem; color:rgba(237,233,224,.5)}
.foot__cred a{
  color:var(--gold-400); font-weight:600;
  border-bottom:1px solid rgba(200,150,75,.35);
  transition:color .2s var(--ease), border-color .2s var(--ease);
}
.foot__cred a:hover{color:var(--gold-500); border-color:var(--gold-500)}
@media (min-width:720px){
  .foot__fim{
    flex-direction:row; align-items:center; justify-content:space-between;
    flex-wrap:wrap; gap:.5rem 1.5rem;
  }
  .foot__cred{margin-top:0; width:100%}
}
@media (max-width:979px){.foot__fim{padding-bottom:5rem}}

/* ============== DOCK MOBILE ============== */
.dock{
  position:fixed; z-index:95; left:0; right:0; bottom:0;
  display:flex; gap:.55rem; align-items:center;
  padding:.65rem var(--gut) calc(.65rem + env(safe-area-inset-bottom));
  background:rgba(5,11,24,.93);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-top:1px solid var(--line);
  transform:translateY(105%); transition:transform .34s var(--ease);
}
.dock.is-on{transform:translateY(0)}
.dock__btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.4rem;
  min-height:50px; border-radius:3px; font-size:.86rem; font-weight:700;
  padding:.6rem 1rem;
}
.dock__btn--gold{
  flex:1; background:linear-gradient(135deg,var(--gold-400),var(--gold-600)); color:#20160A;
  box-shadow:0 8px 20px -10px rgba(200,150,75,.6);
}
.dock__btn--ghost{
  flex:none; width:auto; min-width:76px; flex-direction:column; gap:.1rem;
  background:rgba(245,241,232,.06); border:1px solid rgba(245,241,232,.2);
  color:var(--text); font-size:.66rem; font-weight:600; letter-spacing:.04em;
}
.dock__btn--ghost svg{width:18px; height:18px}
@media (min-width:1000px){.dock{display:none}}

/* o dock é fixo: reserva espaço para não cobrir conteúdo no fim das seções */
@media (max-width:999px){
  .spot__note{padding-bottom:5.5rem}
  .foot__bar{padding-bottom:calc(1.35rem + 5.5rem)}
}

/* ============== REVEAL / MOTION ============== */
.reveal{opacity:0; transform:translateY(22px); transition:opacity .62s var(--ease), transform .62s var(--ease)}
.reveal.is-in{opacity:1; transform:none}
.reveal[data-d="1"]{transition-delay:.07s}
.reveal[data-d="2"]{transition-delay:.14s}
.reveal[data-d="3"]{transition-delay:.21s}
.reveal[data-d="4"]{transition-delay:.28s}
.reveal[data-d="5"]{transition-delay:.35s}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  .reveal{opacity:1 !important; transform:none !important}
  .hero__glow{animation:none}
}

/* ============== LANDSCAPE BAIXO ============== */
@media (max-height:520px) and (orientation:landscape){
  :root{--sec-y:2.75rem}
  .dock{display:none}
  .faq__head{position:static}

  /* hero em duas colunas para nao virar 2,5 telas de rolagem */
  .hero__inner{padding-block:1.75rem 2.25rem; gap:1.5rem}
  .hero__h1{font-size:clamp(1.7rem,1.1rem + 2.6vw,2.4rem)}
  .eyebrow{margin-bottom:.85rem}
  .hero__lead{margin-bottom:1.1rem; max-width:46ch}
  .hero__actions{flex-direction:row; flex-wrap:wrap; margin-bottom:1.1rem}
  .hero__trust{grid-template-columns:1fr 1fr; gap:.4rem .9rem}
}
@media (max-height:520px) and (orientation:landscape) and (min-width:760px){
  .hero__inner{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); align-items:center}
  .panel__steps{gap:.65rem}
  .panel__steps p{display:none}
}

/* ============== NÚMEROS DO MERCADO ============== */
.mkt{background:linear-gradient(180deg,var(--paper),var(--paper-2)); color:var(--ink); padding-block:var(--sec-y)}
.mkt .sec__h{color:var(--ink)}
.mkt .sec__h em{color:var(--gold-600)}
.mkt__grid{display:grid; gap:1rem}
.mcard{
  padding:clamp(1.3rem,3vw,2rem); border-radius:var(--r-md);
  background:var(--white); border:1px solid rgba(16,26,46,.1);
  transition:transform .26s var(--ease), box-shadow .26s var(--ease), border-color .26s var(--ease);
}
.mcard:hover{transform:translateY(-4px); box-shadow:0 22px 44px -24px rgba(16,26,46,.26);
  border-color:rgba(200,150,75,.5)}
.mcard strong{
  display:block; font-family:"Instrument Sans",Inter,system-ui,sans-serif; font-weight:600;
  font-size:clamp(2.1rem,1.4rem + 3vw,3.3rem); line-height:1;
  color:var(--gold-600); letter-spacing:-.03em; margin-bottom:.55rem;
}
.mcard strong span{font-size:.4em; margin-left:.12em; color:var(--ink-mute)}
.mcard p{font-size:var(--f-small); color:var(--ink-mute); max-width:32ch; line-height:1.55}
.mcard--hero{
  background:linear-gradient(145deg,var(--navy-700),var(--navy-900));
  border-color:var(--navy-600);
}
.mcard--hero strong{color:var(--ivory); font-size:clamp(2.6rem,1.6rem + 4.2vw,4.4rem)}
.mcard--hero strong span{color:var(--gold-400)}
.mcard--hero p{color:var(--muted); max-width:26ch}
.mkt__src{
  margin-top:.9rem; padding-top:.85rem;
  border-top:1px solid rgba(16,26,46,.12);
  font-size:.76rem; color:var(--ink-mute); line-height:1.45;
  max-width:none;
}

@media (min-width:640px){
  .mkt__grid{grid-template-columns:1fr 1fr}
  .mcard--hero,.mcard--wide{grid-column:span 2}
}
@media (min-width:1000px){
  .mkt__grid{grid-template-columns:1.2fr 1fr 1fr}
  .mcard--hero{grid-column:1; grid-row:1 / span 2; display:flex; flex-direction:column; justify-content:center}
  .mcard--wide{grid-column:2 / span 2}
}

/* ============== A LEI A SEU FAVOR ============== */
.law{
  padding-block:var(--sec-y);
  background:
    radial-gradient(75% 60% at 95% 0%,rgba(200,150,75,.12),transparent 58%),
    linear-gradient(180deg,var(--navy-800),var(--navy-900));
}
.law .sec__h{color:var(--ivory); max-width:24ch}
.law .sec__lead{color:var(--muted)}
.law__inner{display:grid; gap:clamp(1.9rem,4vw,3rem)}
.law__list{display:grid; gap:.9rem}
.law__list li{
  padding:clamp(1.1rem,2.6vw,1.6rem); border-radius:var(--r-md);
  background:rgba(19,36,71,.5); border:1px solid var(--line-soft);
  border-top:2px solid var(--gold-500);
  transition:transform .24s var(--ease), border-color .24s var(--ease), background .24s var(--ease);
}
.law__list li:hover{transform:translateY(-4px); border-color:rgba(200,150,75,.5); background:rgba(27,49,89,.66)}
.law__list strong{
  display:block; font-family:"Instrument Sans",Inter,system-ui,sans-serif; font-weight:600;
  font-size:clamp(1.55rem,1.2rem + 1.5vw,2.2rem); line-height:1;
  color:var(--gold-400); letter-spacing:-.02em; margin-bottom:.5rem;
}
.law__list h3{font-size:var(--f-h3); color:var(--ivory); margin-bottom:.3rem}
.law__list p{font-size:var(--f-small); color:var(--muted-2); line-height:1.55}
.law__cta{margin-top:1.6rem}
.law__src{
  margin-top:1rem; padding-top:.9rem;
  border-top:1px solid var(--line-soft);
  font-size:.78rem; color:rgba(237,233,224,.62);
}
@media (min-width:560px){.law__list{grid-template-columns:1fr 1fr}}
@media (min-width:1000px){
  /* duas colunas com linhas explicitas: cards e fonte colados,
     e o texto da esquerda alinhado ao topo sem esticar */
  .law__inner{
    grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
    grid-template-rows:auto auto;
    column-gap:clamp(2rem,4vw,3.5rem); row-gap:0;
    align-items:start;
  }
  .law__head{grid-column:1; grid-row:1 / span 2; align-self:start}
  .law__list{grid-column:2; grid-row:1}
  .law__src{grid-column:2; grid-row:2; margin-top:.9rem; padding-top:.85rem}
}

/* ============== POR QUE VENDER ============== */
.porque{
  padding-block:var(--sec-y);
  background:
    radial-gradient(80% 60% at 85% 0%,rgba(200,150,75,.14),transparent 58%),
    linear-gradient(180deg,var(--navy-800),var(--navy-900));
}
.porque__topo{max-width:44rem; margin-bottom:clamp(2rem,4vw,3.25rem)}
.porque .sec__h{color:var(--ivory)}
.porque .sec__lead{color:var(--muted)}
.porque__dor{max-width:56ch}
.porque__dor strong{color:var(--gold-400); font-weight:600}

/* palavra que gira */
.sr{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
.gira{
  display:inline-block; position:relative; overflow:hidden;
  height:1.15em; vertical-align:bottom;
  min-width:var(--giraW,8ch);
  transition:min-width .5s var(--ease);
}
/* em tela estreita a palavra ocupa a linha toda, sem risco de apertar */
@media (max-width:520px){
  .gira{display:block; min-width:0; width:100%}
}
.gira__lista{display:block; position:relative; height:100%}
.gira__lista b{
  position:absolute; inset:0 auto auto 0;
  display:block; line-height:1.15em; white-space:nowrap;
  color:var(--gold-400); font-weight:600;
  opacity:0; transform:translateY(.5em);
  transition:opacity .45s var(--ease), transform .45s var(--ease);
}
.gira__lista b.on{opacity:1; transform:none}
.gira__lista b.out{opacity:0; transform:translateY(-.5em)}
/* traço âmbar sob a palavra, reforçando que ela muda */
/* o traço acompanha a palavra ativa, não a caixa reservada */
.gira__lista b::after{
  content:""; position:absolute; left:0; right:0; bottom:-.02em; height:2px;
  background:linear-gradient(90deg,var(--gold-500),rgba(200,150,75,.2));
}
.gira__lista b{position:absolute}
@media (prefers-reduced-motion:reduce){
  .gira{min-width:0; height:auto; overflow:visible}
  .gira__lista{height:auto}
  .gira__lista b{position:relative; opacity:1; transform:none}
  .gira__lista b:not(:first-child){display:none}
}

.porque__grade{display:grid; gap:1rem}
.benef{
  position:relative; padding:clamp(1.25rem,2.8vw,1.75rem);
  border-radius:var(--r-md);
  background:rgba(19,36,71,.5); border:1px solid var(--line-soft);
  border-top:2px solid var(--gold-500);
  transition:transform .26s var(--ease), border-color .26s var(--ease), background .26s var(--ease);
}
.benef:hover{transform:translateY(-4px); border-color:rgba(200,150,75,.55); background:rgba(27,49,89,.66)}
.benef .ico{width:36px; height:36px; margin-bottom:.9rem; color:var(--gold-400)}
.benef:hover .ico{transform:translateY(-3px) scale(1.08)}
.benef h3{font-size:var(--f-h3); color:var(--ivory); margin-bottom:.4rem}
.benef p{font-size:var(--f-small); color:var(--muted-2); line-height:1.55}

@media (min-width:640px){.porque__grade{grid-template-columns:1fr 1fr}}
@media (min-width:1024px){.porque__grade{grid-template-columns:repeat(4,1fr)}}

/* ============== CALCULADORA EM PASSOS ============== */
.calc{
  padding-block:var(--sec-y);
  background:
    radial-gradient(85% 60% at 12% 0%,rgba(200,150,75,.13),transparent 58%),
    linear-gradient(180deg,var(--navy-900),var(--navy-800));
}
.calc .sec__h{color:var(--ivory)}
.calc__wrap{max-width:43rem; margin-inline:auto}

.calc__box{
  position:relative; overflow:hidden;
  background:linear-gradient(165deg,rgba(19,36,71,.94),rgba(7,15,34,.97));
  border:1px solid var(--line); border-radius:var(--r-lg);
  padding:clamp(1.3rem,3.4vw,2.25rem);
  box-shadow:0 34px 70px -34px rgba(0,0,0,.82);
}
.calc__box[hidden]{display:none}

.cbar{height:2px; background:rgba(245,241,232,.12); margin:-.25rem -.25rem 1.6rem; border-radius:2px}
.cbar__fill{
  display:block; height:100%; width:25%;
  background:linear-gradient(90deg,var(--gold-600),var(--gold-400));
  transition:width .4s var(--ease);
}

.cpane{border:0; padding:0; margin:0; display:none}
.cpane.is-on{display:block; animation:paneIn .34s var(--ease) both}
@keyframes paneIn{from{opacity:0; transform:translateX(14px)} to{opacity:1; transform:none}}
.cpane legend{
  display:block; padding:0; margin-bottom:1.15rem;
  font-family:"Instrument Sans",Inter,system-ui,sans-serif;
  font-size:clamp(1.3rem,1.1rem + .9vw,1.85rem); line-height:1.15;
  color:var(--ivory); letter-spacing:-.01em;
}
.cpane__c{
  display:block; margin-bottom:.5rem;
  font-family:Inter,sans-serif; font-size:.68rem; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase; color:var(--gold-500);
}

.copts{display:grid; gap:.6rem}
.copts--2{grid-template-columns:1fr 1fr}
@media (max-width:480px){.copts--2{grid-template-columns:1fr}}
.copt{
  position:relative; display:flex; flex-direction:column; gap:.12rem;
  min-height:66px; justify-content:center; padding:.85rem 1rem; cursor:pointer;
  background:rgba(7,15,34,.5); border:1px solid rgba(245,241,232,.14);
  border-radius:var(--r-sm);
  transition:border-color .2s var(--ease), background .2s var(--ease), transform .2s var(--ease);
}
.copt--full{grid-column:1/-1}
.copt:hover{border-color:rgba(200,150,75,.6); background:rgba(19,36,71,.75); transform:translateY(-2px)}
.copt input{position:absolute; opacity:0; width:0; height:0}
.copt b{font-size:.96rem; font-weight:600; color:var(--ivory)}
.copt i{font-style:normal; font-size:.79rem; color:var(--muted-2); line-height:1.35}
.copt:has(input:checked){
  background:linear-gradient(135deg,rgba(200,150,75,.22),rgba(200,150,75,.08));
  border-color:var(--gold-500);
}
.copt:has(input:checked) b{color:var(--gold-400)}
.copt:has(input:focus-visible){outline:2px solid var(--gold-400); outline-offset:2px}

.crange{margin-bottom:1.5rem}
.crange__out{
  display:block; margin-bottom:.4rem; text-align:center;
  font-family:"Instrument Sans",Inter,system-ui,sans-serif;
  font-size:clamp(1.5rem,1.2rem + 1.4vw,2.2rem); color:var(--gold-400); letter-spacing:-.01em;
}
.crange input[type=range]{
  width:100%; height:48px; margin:0; background:transparent; cursor:pointer;
  -webkit-appearance:none; appearance:none; touch-action:pan-y;
}
.crange input[type=range]::-webkit-slider-runnable-track{height:2px; background:rgba(245,241,232,.2)}
.crange input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none; width:30px; height:30px; margin-top:-14px; border-radius:50%;
  background:linear-gradient(135deg,var(--gold-400),var(--gold-600));
  box-shadow:0 4px 16px -4px rgba(200,150,75,.75);
}
.crange input[type=range]::-moz-range-track{height:2px; background:rgba(245,241,232,.2)}
.crange input[type=range]::-moz-range-thumb{
  width:26px; height:26px; border:0; border-radius:50%;
  background:linear-gradient(135deg,var(--gold-400),var(--gold-600));
}
.crange__marks{display:flex; justify-content:space-between; font-size:.74rem; color:var(--muted-2)}

.cvolta{
  display:block; width:100%; min-height:44px; margin-top:.75rem;
  background:none; border:0; cursor:pointer;
  font-family:inherit; font-size:var(--f-small); color:var(--muted-2);
  transition:color .2s var(--ease);
}
.cvolta:hover{color:var(--gold-400)}
.cvolta--c{width:auto; margin:0; padding:.5rem 1rem}
.calc__nota{margin-top:.9rem; font-size:.76rem; color:var(--muted-2); text-align:center}
.calc .field{margin-bottom:1rem}

/* resultado: só existe depois de preenchido */
.cres{
  background:linear-gradient(160deg,rgba(200,150,75,.17),rgba(19,36,71,.62) 45%,rgba(7,15,34,.96));
  border:1px solid rgba(200,150,75,.45); border-radius:var(--r-lg);
  padding:clamp(1.4rem,3.4vw,2.35rem);
  box-shadow:0 34px 70px -34px rgba(0,0,0,.82);
  animation:cresIn .5s var(--ease) both;
}
.cres[hidden]{display:none}
@keyframes cresIn{from{opacity:0; transform:translateY(16px) scale(.99)} to{opacity:1; transform:none}}
.cres__tag{
  display:inline-block; margin-bottom:1rem; padding:.36rem .8rem; border-radius:2px;
  font-size:.7rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase;
  background:linear-gradient(135deg,var(--gold-400),var(--gold-600)); color:#20160A;
}
.cres__tag[data-t="nao"]{background:rgba(245,241,232,.18); color:var(--ivory)}
.cres h3{
  font-family:"Instrument Sans",Inter,system-ui,sans-serif; font-weight:600;
  font-size:clamp(1.5rem,1.2rem + 1.4vw,2.25rem); line-height:1.1;
  color:var(--ivory); margin-bottom:.85rem; letter-spacing:-.01em;
}
.cres__txt{color:var(--text); margin-bottom:1.35rem}
.cres__list{
  display:grid; gap:.8rem; margin-bottom:1.6rem;
  padding-top:1.35rem; border-top:1px solid rgba(200,150,75,.3);
}
.cres__list li{position:relative; padding-left:1.2rem; font-size:var(--f-small); line-height:1.6; color:var(--text)}
.cres__list li::before{content:""; position:absolute; left:0; top:.55em; width:6px; height:6px; background:var(--gold-400)}
.cres__list b{color:var(--gold-400); font-weight:600}
.cres__acao{display:flex; flex-direction:column; gap:.5rem; align-items:stretch}
@media (min-width:520px){
  .cres__acao{flex-direction:row; align-items:center}
  .cres__acao .btn{flex:1}
}
.cres__lei{margin-top:1rem; font-size:.75rem; color:rgba(237,233,224,.62); line-height:1.5}

/* ============== CAMPOS DE FORMULÁRIO ============== */
.field{margin-bottom:1.1rem}
.field label{
  display:block; font-size:.79rem; font-weight:600; letter-spacing:.02em;
  color:var(--muted); margin-bottom:.42rem;
}
.field input,.field textarea{
  width:100%; min-height:52px; padding:.85rem 1rem;
  font-family:inherit; font-size:1rem; color:var(--ivory);
  background:rgba(7,15,34,.6); border:1px solid rgba(245,241,232,.17);
  border-radius:var(--r-sm);
  transition:border-color .2s var(--ease), background .2s var(--ease);
  -webkit-appearance:none; appearance:none;
}
.field textarea{min-height:90px; resize:vertical; line-height:1.55}
.field input::placeholder,.field textarea::placeholder{color:rgba(237,233,224,.35)}
.field input:hover,.field textarea:hover{border-color:rgba(200,150,75,.45)}
.field input:focus,.field textarea:focus{border-color:var(--gold-500); background:rgba(7,15,34,.85)}
.field input[aria-invalid="true"],.field textarea[aria-invalid="true"]{border-color:#E0705F}
.err{font-size:.78rem; color:#F09482; margin-top:.32rem}

/* ============== PORTÃO DE CONTATO ============== */
.gate{position:fixed; inset:0; z-index:200; display:grid; place-items:center; padding:var(--gut)}
.gate[hidden]{display:none}
.gate__bg{
  position:absolute; inset:0; background:rgba(3,8,20,.86);
  backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px);
  animation:bgIn .28s var(--ease) both; cursor:pointer;
}
@keyframes bgIn{from{opacity:0} to{opacity:1}}
.gate__box{
  position:relative; width:100%; max-width:26rem; max-height:90vh; overflow-y:auto;
  background:linear-gradient(165deg,rgba(19,36,71,.98),rgba(7,15,34,.99));
  border:1px solid rgba(200,150,75,.4); border-radius:var(--r-lg);
  padding:clamp(1.4rem,4vw,2.1rem); text-align:center;
  box-shadow:0 40px 90px -30px rgba(0,0,0,.9);
  animation:boxIn .34s var(--ease) both;
}
@keyframes boxIn{from{opacity:0; transform:translateY(20px) scale(.97)} to{opacity:1; transform:none}}
.gate__x{
  position:absolute; top:.5rem; right:.5rem;
  width:46px; height:46px; display:grid; place-items:center;
  background:none; border:0; cursor:pointer;
  font-size:1.6rem; line-height:1; color:var(--muted-2);
  transition:color .2s var(--ease);
}
.gate__x:hover{color:var(--ivory)}
.gate__logo{width:52px; height:52px; margin:0 auto .9rem; border-radius:50%}
.gate__h{
  font-family:"Instrument Sans",Inter,system-ui,sans-serif; font-weight:600;
  font-size:clamp(1.5rem,1.3rem + 1vw,1.95rem); color:var(--ivory); margin-bottom:.5rem;
}
.gate__sub{font-size:var(--f-small); color:var(--muted); margin-bottom:1.5rem; max-width:30ch; margin-inline:auto}
.gate__form{text-align:left}
.gate .field{margin-bottom:1rem}
.gate .opt{color:var(--muted-2); font-weight:400}
.gate__nota{margin-top:.9rem; font-size:.74rem; color:var(--muted-2); text-align:center; line-height:1.45}
.gate__ok{animation:cresIn .4s var(--ease) both}
.gate__ok[hidden]{display:none}
.gate__ico{display:block; width:54px; height:54px; margin:0 auto 1rem; color:var(--gold-400)}
.gate__okt{font-size:1.02rem; color:var(--ivory); font-weight:600; margin-bottom:1.35rem}
body.gate-on{overflow:hidden}

/* botões do portão que eram links viram botões */
button.panel__cta{
  background:none; border:0; border-top:1px solid var(--line-soft);
  font-family:inherit; text-align:left; cursor:pointer;
}
button.contact__link{
  width:100%; font-family:inherit; text-align:left; cursor:pointer;
}
button.dock__btn--gold{font-family:inherit; border:0; cursor:pointer}

/* telefone do rodapé também passa pelo portão */
button.pe-zap{
  background:none; border:0; padding:.35rem 0; min-height:44px; cursor:pointer;
  display:inline-flex; align-items:center;
  font-family:inherit; font-size:var(--f-small); color:var(--muted);
  text-align:left; transition:color .2s var(--ease);
}
button.pe-zap:hover{color:var(--gold-400)}

/* ============== ÍCONES VETORIAIS ============== */
.ico{
  display:block; width:44px; height:44px; margin-bottom:1rem;
  color:var(--gold-500);
  transition:color .3s var(--ease), transform .4s var(--ease);
}
.ico svg{width:100%; height:100%; overflow:visible}
/* o traço se desenha quando o card entra em cena */
.ico svg :is(path,circle,rect,line){
  stroke-dasharray:var(--len,90); stroke-dashoffset:var(--len,90);
}
.reveal.is-in .ico svg :is(path,circle,rect,line),
.is-in .ico svg :is(path,circle,rect,line){
  animation:traco 1.1s var(--ease) forwards;
}
@keyframes traco{to{stroke-dashoffset:0}}
.ico svg :nth-child(2){animation-delay:.1s}
.ico svg :nth-child(3){animation-delay:.2s}
.ico svg :nth-child(4){animation-delay:.3s}
.ico svg :nth-child(5){animation-delay:.4s}

/* fundo claro: ícone em âmbar escuro para contraste */
.srv .ico{color:var(--gold-600)}
/* numero e icone na mesma linha, o numero como marca d'agua */
.srv{display:flex; flex-direction:column}
.srv__n{order:2; position:absolute; top:clamp(1.1rem,2.4vw,1.5rem); right:clamp(1.1rem,2.4vw,1.5rem);
  margin:0; font-size:clamp(1.9rem,1.5rem + 1.2vw,2.6rem); color:rgba(142,101,53,.82)}
.srv .ico{order:1; width:46px; height:46px; margin-bottom:1.1rem}
.srv h3{order:3}
.srv p{order:4}
.srv:hover .ico{color:var(--gold-500); transform:translateY(-3px) scale(1.06)}
/* fundo escuro */
.edge__pillars .ico,.law__list .ico{width:34px; height:34px; margin-bottom:.75rem; color:var(--gold-400)}
.edge__pillars li:hover .ico,.law__list li:hover .ico{transform:translateY(-3px) scale(1.08)}

@media (prefers-reduced-motion:reduce){
  .ico svg :is(path,circle,rect,line){stroke-dashoffset:0!important; animation:none!important}
}

/* ============== ANIMAÇÕES EXTRAS ============== */
/* números grandes contam ao aparecer */
.mcard strong,.law__list strong,.bignum strong{
  transition:transform .5s var(--ease), opacity .5s var(--ease);
}
.reveal:not(.is-in) .mcard strong{opacity:0; transform:translateY(10px)}

/* linha âmbar que cresce sob os títulos de seção */
.sec__h{position:relative}
/* separador abaixo do titulo, em elemento proprio para nao cruzar texto */
.sec__h::before{
  content:""; display:block; width:0; height:2px; margin-bottom:.85rem;
  background:linear-gradient(90deg,var(--gold-500),rgba(200,150,75,0));
  transition:width .8s var(--ease) .15s;
}
.sec__head--center .sec__h::before{margin-inline:auto;
  background:linear-gradient(90deg,rgba(200,150,75,0),var(--gold-500),rgba(200,150,75,0))}
.reveal.is-in .sec__h::before,.is-in .sec__h::before{width:72px}
.sec__head--center.is-in .sec__h::before,.reveal.is-in .sec__head--center .sec__h::before{width:96px}

/* cards sobem em sequência e ganham brilho na borda */
.srv,.mcard,.law__list li,.edge__pillars li,.qa{
  will-change:transform;
}
.srv::after{
  content:""; position:absolute; inset:0; border-radius:inherit;
  box-shadow:inset 0 0 0 1px rgba(200,150,75,0);
  transition:box-shadow .3s var(--ease); pointer-events:none;
}
.srv{position:relative}
.srv:hover::after{box-shadow:inset 0 0 0 1px rgba(200,150,75,.45)}

/* barra do topo indica progresso de leitura */
.lerbar{
  position:fixed; top:0; left:0; z-index:110; height:2px; width:0;
  background:linear-gradient(90deg,var(--gold-600),var(--gold-400));
  transition:width .1s linear; pointer-events:none;
}

/* itens de lista entram deslizando */
/* só esconde quando ha um ancestral .reveal ainda nao revelado,
   para nunca deixar conteudo invisivel por engano */
.reveal:not(.is-in) :is(.hero__trust li){
  opacity:0; transform:translateX(-10px);
}
.hero__trust li{
  transition:opacity .45s var(--ease), transform .45s var(--ease);
}
.is-in .hero__trust li,.is-in.hero__trust li,
.hero__trust.is-in li{opacity:1; transform:none}
.is-in .hero__trust li:nth-child(2){transition-delay:.08s}
.is-in .hero__trust li:nth-child(3){transition-delay:.16s}

/* o selo do hero gira de leve ao passar o mouse no painel */
.panel:hover ~ .panel__stamp img,.hero__panel:hover .panel__stamp img{
  transform:rotate(-8deg) scale(1.05);
}
.panel__stamp img{transition:transform .5s var(--ease)}

@media (prefers-reduced-motion:reduce){
  .hero__trust li{opacity:1!important; transform:none!important}
  .sec__head .sec__h::after{transition:none; width:88px}
  .lerbar{display:none}
}

/* ============== LISTA DE OPORTUNIDADES ============== */
.spots{display:grid; gap:1rem}

/* 2 ou 3 cards: ficam lado a lado e o miolo empilha dentro de cada um */
@media (min-width:860px){
  .spots[data-qtd="2"]{grid-template-columns:1fr 1fr}
  .spots[data-qtd="3"]{grid-template-columns:repeat(3,1fr)}
  .spots[data-qtd="2"] .spot__body,
  .spots[data-qtd="3"] .spot__body{grid-template-columns:1fr; gap:1.25rem}
  .spots[data-qtd="2"] .spot__side,
  .spots[data-qtd="3"] .spot__side{border-left:0; padding-left:0;
    border-top:1px solid var(--line-soft); padding-top:1.25rem}
  .spots[data-qtd="2"] .spot__h,
  .spots[data-qtd="3"] .spot__h{font-size:clamp(1.2rem,1rem + .7vw,1.5rem)}
  .spots[data-qtd="3"] .spot{padding:clamp(1.15rem,2.4vw,1.6rem)}
  /* os cards crescem juntos e o botão fica sempre na base */
  .spots[data-qtd="2"] .spot,.spots[data-qtd="3"] .spot{display:flex; flex-direction:column}
  .spots[data-qtd="2"] .spot__body,.spots[data-qtd="3"] .spot__body{flex:1}
  .spots[data-qtd="2"] .spot__side,.spots[data-qtd="3"] .spot__side{margin-top:auto}
}
/* cabeçalho do card empilha quando o espaço aperta */
.spots[data-qtd="3"] .spot__head{flex-direction:column; align-items:flex-start; gap:.5rem}
@media (min-width:860px){
  .spots[data-qtd="2"] .spot__head{flex-direction:column; align-items:flex-start; gap:.5rem}
}

/* texto da barra mobile */
.dock__t{
  flex:1; min-width:0; font-size:.76rem; line-height:1.25;
  color:var(--muted-2);
}
@media (max-width:400px){.dock__t{display:none}}