/* =========================================================
   Colégio Standard — Landing Page Técnico em Enfermagem
   Paleta extraída do design original (Figma) e do emblema
   institucional: azul #062D68, dourado #FFB902, vermelho #BC0823
   ========================================================= */

:root{
  /* cor */
  --deep:#062D68;
  --deep-2:#041F4B;
  --deep-3:#0D3E7B;
  --royal:#1250C4;
  --royal-lt:#2E6FE8;
  --sky:#8FB9FF;
  /* azuis da padronagem institucional */
  --cyan:#036EA6;
  --cyan-dk:#00497A;
  /* destaque do hero — o dourado fica reservado aos botões */
  --accent:#2BABEE;
  --accent-dk:#0E8FCB;
  --gold:#FEB902;
  --gold-2:#FFD24A;
  --gold-dk:#D89600;
  --red:#C11120;
  --paper:#F3F6FC;
  --white:#fff;
  --ink:#0A1B36;
  --ink-2:#43536F;
  --line:rgba(6,45,104,.12);
  --line-lt:rgba(255,255,255,.16);

  /* forma */
  --r-s:8px; --r-m:14px; --r-l:22px;
  --wrap:1240px;
  --pad:clamp(18px,5vw,44px);
  --sec-y:clamp(72px,9vw,132px);

  /* sombra */
  --sh-1:0 2px 8px rgba(4,26,63,.06), 0 10px 30px rgba(4,26,63,.07);
  --sh-2:0 18px 50px rgba(4,26,63,.16);
  --sh-gold:0 10px 26px rgba(216,150,0,.34);

  /* tipografia */
  --ff:"Kanit",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--ff); font-weight:300; font-size:clamp(16px,1.06vw,17.5px);
  line-height:1.62; -webkit-font-smoothing:antialiased; overflow-x:clip;
}
img{max-width:100%; height:auto; display:block}
a{color:inherit; text-decoration:none}
button,input,select,textarea{font:inherit; color:inherit}
h1,h2,h3,h4{margin:0; font-weight:600; line-height:1.06; letter-spacing:-.022em}
p{margin:0}
ul,ol{margin:0; padding:0; list-style:none}
::selection{background:var(--gold); color:var(--deep)}

.sprite{position:absolute; width:0; height:0; overflow:hidden}
.skip{position:absolute; left:-9999px; top:0; z-index:200; background:var(--gold); color:var(--deep); padding:12px 20px; border-radius:0 0 var(--r-s) 0; font-weight:600}
.skip:focus{left:0}
:where(a,button,input,select,summary):focus-visible{outline:3px solid var(--gold); outline-offset:3px; border-radius:4px}

.wrap{width:min(100% - var(--pad)*2, var(--wrap)); margin-inline:auto}
/* o header é sticky: as âncoras precisam de folga para não ficarem embaixo dele */
:where(section,main)[id]{scroll-margin-top:96px}

/* ---------- ícones ----------
   Os símbolos são instanciados via <use>, que cria shadow tree:
   seletor descendente não alcança os nós clonados. Por isso o estilo
   vai por HERANÇA no host (fill/stroke/stroke-width são herdáveis) e
   o detalhe de destaque usa a custom property --ia. */
.ic{
  display:inline-block; vertical-align:middle; flex:none;
  fill:none; stroke:currentColor; stroke-width:2.4;
  stroke-linecap:round; stroke-linejoin:round;
}
.ic--lg{stroke-width:2}
.ic--xl{stroke-width:1.7}

/* ---------- tipografia utilitária ---------- */
.h1{font-size:clamp(2.05rem,3.8vw,3.5rem); font-weight:600; letter-spacing:-.034em; line-height:1.02}
.h2{font-size:clamp(1.85rem,3.5vw,3.1rem); letter-spacing:-.03em; line-height:1.06}
.h3{font-size:clamp(1.35rem,2vw,1.95rem); letter-spacing:-.024em}
.h3--light{color:var(--white)}
.lede{font-size:clamp(1.05rem,1.35vw,1.28rem); line-height:1.6; font-weight:300}

.hl{font-style:normal; color:var(--gold)}
.u-line{
  background-image:linear-gradient(var(--gold),var(--gold));
  background-size:100% 3px; background-repeat:no-repeat; background-position:0 92%;
  padding-bottom:2px;
}
.u-mark{
  position:relative; display:inline-block; z-index:0;
}
.u-mark::after{
  content:""; position:absolute; inset:auto -.16em -.1em -.16em; height:.3em; z-index:-1;
  background:linear-gradient(100deg,rgba(255,185,2,.95),rgba(255,210,74,.6));
  transform:skewX(-9deg);
}

.eyebrow{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  font-size:.82rem; font-weight:500; letter-spacing:.16em; text-transform:uppercase;
  color:var(--royal); margin-bottom:20px;
}
.eyebrow--light{color:var(--sky)}
.eyebrow__n{
  display:inline-grid; place-items:center; min-width:34px; height:26px; padding:0 8px;
  background:var(--gold); color:var(--deep); font-weight:600; letter-spacing:.06em;
  clip-path:polygon(0 0,100% 0,100% 100%,7px 100%);
}
.eyebrow__dot{width:9px; height:9px; border-radius:50%; background:var(--gold); box-shadow:0 0 0 5px rgba(255,185,2,.2)}
.eyebrow__bar{width:26px; height:2px; background:currentColor; opacity:.5}

/* ---------- botões ---------- */
.btn{
  --bg:var(--gold); --fg:var(--deep);
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:10px;
  background:var(--bg); color:var(--fg); font-weight:600; letter-spacing:-.01em;
  padding:15px 26px; border:0; border-radius:10px; cursor:pointer; overflow:hidden;
  transition:transform .22s cubic-bezier(.2,.7,.3,1), box-shadow .22s, background .22s;
  text-align:center;
}
.btn::after{
  content:""; position:absolute; inset:0; translate:-120% 0; pointer-events:none;
  background:linear-gradient(100deg,transparent 20%,rgba(255,255,255,.55) 50%,transparent 80%);
  transition:translate .6s cubic-bezier(.3,.7,.3,1);
}
.btn:hover::after{translate:120% 0}
.btn--gold{box-shadow:var(--sh-gold), inset 0 -3px 0 rgba(0,0,0,.14)}
.btn--gold:hover{background:var(--gold-2); transform:translateY(-2px)}
.btn--gold:active{transform:translateY(0)}
.btn--ghost{background:transparent; color:var(--white); box-shadow:inset 0 0 0 1.6px rgba(255,255,255,.34)}
.btn--ghost:hover{background:rgba(255,255,255,.09); box-shadow:inset 0 0 0 1.6px rgba(255,255,255,.6)}
.btn--lg{padding:19px 32px; font-size:1.06rem}
.btn--sm{padding:11px 18px; font-size:.92rem}
.btn--block{width:100%}
.btn .ic{stroke-width:2.6}
.btn--gold .ic{--ia:currentColor}

.lnk-arrow{
  display:inline-flex; align-items:center; gap:10px; font-weight:500; color:var(--royal);
  border-bottom:2px solid rgba(18,80,196,.28); padding-bottom:4px; transition:gap .2s, border-color .2s;
}
.lnk-arrow:hover{gap:16px; border-color:var(--gold)}
.lnk-whats{display:inline-flex; align-items:center; gap:9px; font-weight:400; font-size:.95rem; color:var(--white); opacity:.9}
.lnk-whats:hover{opacity:1}
.lnk-whats .ic{stroke-width:2}

/* ---------- reveal ---------- */
@media (prefers-reduced-motion:no-preference){
  .reveal{opacity:0; transform:translateY(26px); transition:opacity .7s cubic-bezier(.2,.7,.3,1) var(--d,0ms), transform .7s cubic-bezier(.2,.7,.3,1) var(--d,0ms)}
  .reveal.in{opacity:1; transform:none}
}

/* =========================================================
   TOPBAR + HEADER
   ========================================================= */
.topbar{background:var(--deep-2); color:#CFE0FF; font-size:.83rem; font-weight:300; position:relative; z-index:60}
.topbar__in{display:flex; align-items:center; gap:14px; min-height:42px; padding-block:8px; flex-wrap:wrap; justify-content:center}
.topbar strong{font-weight:500; color:var(--accent)}
.topbar__sep{opacity:.4; margin-inline:4px}
.topbar__pulse{width:8px; height:8px; border-radius:50%; background:var(--accent); flex:none; animation:pulse 2.4s infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(43,171,238,.55)}50%{box-shadow:0 0 0 7px rgba(43,171,238,0)}}
.topbar__count{margin-left:auto; letter-spacing:.02em}
.topbar__count b{font-weight:500; color:#fff; font-variant-numeric:tabular-nums}
@media (max-width:860px){.topbar__count{margin-left:0}}
@media (max-width:560px){.topbar__count{display:none}}

.site-head{position:sticky; top:0; z-index:50; background:rgba(6,45,104,.82); backdrop-filter:blur(14px) saturate(1.3); border-bottom:1px solid rgba(255,255,255,.09); transition:background .3s, border-color .3s}
.site-head[data-stuck]{background:rgba(4,25,58,.94); box-shadow:0 10px 34px rgba(3,16,40,.32)}
.site-head__in{display:flex; align-items:center; gap:26px; min-height:72px}
.brand{display:flex; align-items:center; gap:14px; color:#fff}
.brand__logo{width:112px; height:auto; flex:none}
.brand__txt{display:grid; line-height:1.12; padding-left:14px; border-left:1px solid rgba(255,255,255,.22)}
.brand__txt i{font-style:normal; font-size:.7rem; letter-spacing:.19em; text-transform:uppercase; color:#B7CDEF; font-weight:300}
@media (max-width:520px){
  .brand__logo{width:92px}
  .brand__txt{display:none}
}

.nav{display:flex; gap:30px; margin-left:auto; font-size:.95rem; color:#DCE7FA; font-weight:300}
.nav a{position:relative; padding-block:6px}
.nav a::after{content:""; position:absolute; left:0; bottom:0; width:0; height:2px; background:var(--gold); transition:width .28s cubic-bezier(.2,.7,.3,1)}
.nav a:hover::after{width:100%}
.site-head__cta{display:flex; align-items:center; gap:18px; margin-left:auto}
@media (max-width:1080px){.nav{display:none} }
@media (max-width:720px){.lnk-whats span{display:none} .site-head__in{min-height:64px; gap:14px}}
/* no celular o CTA fixo de rodapé assume o papel do botão do topo */
@media (max-width:600px){.site-head__cta .btn{display:none} .site-head__cta{gap:0}}

/* =========================================================
   HERO
   ========================================================= */
.hero{position:relative; background:var(--deep); color:#fff; isolation:isolate; overflow:hidden}
/* No hero o destaque é o azul claro: o dourado fica só nos botões, para o
   olho ir direto na ação. --ia troca o detalhe dos ícones por herança. */
.hero{--ia:var(--accent)}
.hero .hl{color:var(--accent)}
.hero .eyebrow__dot{background:var(--accent); box-shadow:0 0 0 5px rgba(43,171,238,.22)}
.hero .h1__pre b{background-image:linear-gradient(var(--accent),var(--accent))}
.hero .scarcity__top b{color:var(--accent)}
.hero .meter__fill{background:linear-gradient(90deg,var(--accent-dk),var(--accent),#7FD2F8)}
.hero .btn--gold{--ia:currentColor}
.hero__art{position:absolute; inset:0; z-index:-3; display:block}
.hero__art img{width:100%; height:100%; object-fit:cover; object-position:64% 18%}
/* Camada de vídeo. Ocupa só a faixa direita, como a arte oficial faz:
   a aluna fica à direita e a esquerda continua azul para o texto.
   Cobrir a seção inteira jogava o rosto embaixo do headline — e num
   container mais estreito o 720p ainda reduz, em vez de ampliar. */
.hero__video{
  position:absolute; top:0; bottom:0; right:0; left:auto; z-index:-2;
  width:66%; height:100%; object-fit:cover; object-position:52% center;
  opacity:0; transition:opacity 1s ease;
  -webkit-mask-image:linear-gradient(to right,transparent 0%,#000 26%);
  mask-image:linear-gradient(to right,transparent 0%,#000 26%);
}
.hero__video[data-playing]{opacity:1}
/* com o vídeo no ar a arte estática sai, para não haver duas alunas */
.hero__art{transition:opacity .8s ease}
.hero[data-video] .hero__art{opacity:0}
.hero__veil{
  position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:
    linear-gradient(100deg,
      var(--deep) 0%, rgba(6,45,104,.97) 32%, rgba(6,45,104,.8) 48%,
      rgba(6,45,104,.34) 64%, rgba(6,45,104,.06) 78%),
    linear-gradient(to bottom, rgba(6,45,104,.55), transparent 24%);
}
.glow{position:absolute; width:52vw; height:52vw; right:-6%; top:-10%; border-radius:50%; background:radial-gradient(circle,rgba(46,111,232,.34),transparent 62%); filter:blur(10px)}
.glow--gold{background:radial-gradient(circle,rgba(254,185,2,.2),transparent 62%)}

.hero__grid{
  display:grid; grid-template-columns:1.04fr .96fr; gap:clamp(26px,4vw,64px); align-items:center;
  padding-block:clamp(46px,6vw,86px) clamp(52px,7vw,96px);
  /* acompanha a proporção 1920x1015 da arte para ela não sofrer zoom */
  min-height:clamp(560px,46vw,860px);
}
.hero__copy{max-width:690px}
.h1 em.hl{font-style:normal; display:inline}
.h1__pre{
  display:block; font-size:.46em; font-weight:300; line-height:1.32; letter-spacing:-.012em;
  color:#B7CDEF; margin-bottom:.5em;
}
.h1__pre b{
  font-weight:500; color:#fff;
  background-image:linear-gradient(var(--gold),var(--gold));
  background-size:100% 2px; background-repeat:no-repeat; background-position:0 100%;
  padding-bottom:3px;
}
.h1__post{display:block; font-size:.6em; font-weight:400; line-height:1.14; margin-top:.16em; letter-spacing:-.026em; color:#EAF1FD}
.hero .lede{margin-top:22px; color:#D3E1F8; max-width:54ch}
.hero__actions{display:flex; gap:14px; flex-wrap:wrap; margin-top:34px}

.scarcity{margin-top:34px; padding:20px 22px; border-radius:var(--r-m); background:rgba(3,20,48,.42); border:1px solid rgba(255,255,255,.16); max-width:560px; backdrop-filter:blur(8px)}
.scarcity__top{display:flex; gap:12px; align-items:flex-start}
.scarcity__top p{font-size:.98rem; color:#E4EDFC; line-height:1.5}
.scarcity__top b{font-weight:600; color:var(--gold)}
.meter{position:relative; height:8px; border-radius:99px; background:rgba(255,255,255,.16); overflow:hidden; margin-top:16px}
.meter__fill{position:absolute; inset:0 auto 0 0; width:var(--pct); border-radius:99px;
  background:linear-gradient(90deg,var(--gold-dk),var(--gold),var(--gold-2));
  transform-origin:left; animation:fillbar 1.4s .3s cubic-bezier(.2,.7,.3,1) backwards}
@keyframes fillbar{from{transform:scaleX(0)}}
.meter--gold{background:rgba(6,45,104,.16)}
.scarcity__legend{margin-top:12px; font-size:.85rem; color:#AFC6EA}
.scarcity__legend b{color:#fff; font-weight:500}
.scarcity__legend span{opacity:.4; margin-inline:5px}

/* Visual do hero — selo e etiquetas.
   Ficam num flex ancorado na BASE da coluna, não em posições absolutas com
   percentuais: era isso que deixava o selo subir até o rosto da aluna
   conforme a altura da viewport mudava. Agora eles nunca passam da linha
   dos ombros. */
.hero__visual{
  position:relative; justify-self:end; align-self:stretch; width:min(100%,430px);
  display:flex; align-items:flex-end; justify-content:flex-end;
  gap:clamp(10px,1.6vw,20px); padding-bottom:clamp(18px,4vh,48px);
  pointer-events:none;
}
.hero__visual > *{pointer-events:auto}

.seal{
  width:clamp(84px,8vw,104px); aspect-ratio:1; flex:none; margin-bottom:2px;
  border-radius:50%; background:radial-gradient(circle,rgba(4,31,75,.94) 58%,rgba(4,31,75,.82) 100%);
  box-shadow:0 0 0 1px rgba(43,171,238,.5), 0 14px 34px rgba(2,14,36,.5);
}
.seal svg{width:100%; height:100%; animation:spin 26s linear infinite}
@media (prefers-reduced-motion:reduce){.seal svg{animation:none}}
@keyframes spin{to{rotate:360deg}}
.seal text{font-size:10.4px; font-weight:500; letter-spacing:.185em; fill:var(--accent); text-transform:uppercase}
.seal__core path{stroke:var(--accent); stroke-width:3.4; stroke-linecap:round}

.hero__badges{display:grid; gap:10px; justify-items:end}
.hero__tag{
  display:flex; align-items:center; gap:12px; padding:13px 17px; border-radius:var(--r-m);
  background:rgba(255,255,255,.96); color:var(--deep); box-shadow:var(--sh-2);
  font-size:.82rem; line-height:1.25; backdrop-filter:blur(4px);
}
.hero__tag b{font-size:1.9rem; font-weight:600; letter-spacing:-.04em; line-height:1; color:var(--royal)}
.hero__tag span{font-weight:400}
/* fundo azul claro pede texto azul escuro: branco daria 2,57:1 */
.hero__tag--b{background:var(--accent); color:var(--deep-2); --ia:currentColor}

/* faixa intermediária: duas colunas apertadas, texto ainda sobre a arte */
@media (min-width:701px) and (max-width:1100px){
  .hero__grid{grid-template-columns:1.24fr .76fr; min-height:clamp(520px,62vw,660px)}
  .h1{font-size:clamp(1.85rem,3.4vw,2.5rem)}
  .hero .lede{font-size:1rem}
  .hero__art img{object-position:78% 16%}
  .hero__veil{
    background:
      linear-gradient(100deg,
        var(--deep) 0%, rgba(6,45,104,.97) 40%, rgba(6,45,104,.82) 58%,
        rgba(6,45,104,.34) 74%, rgba(6,45,104,0) 88%),
      linear-gradient(to bottom, rgba(6,45,104,.5), transparent 22%);
  }
  .hero__visual{width:100%}
  .hero__video{width:54%; object-position:44% center}
  .hero__tag{font-size:.75rem; padding:11px 14px}
  .hero__tag b{font-size:1.65rem}
}

@media (max-width:700px){
  /* no celular a arte ocupa só a faixa inferior — o texto fica sobre o azul
     e a aluna aparece inteira embaixo, em vez de a seção cortá-la no tronco */
  .hero{--art-h:min(96vw,470px)}
  .hero__grid{grid-template-columns:1fr; min-height:0; padding-bottom:calc(var(--art-h) - 40px)}
  .hero__art, .hero__veil{top:auto; bottom:0; height:var(--art-h)}
  .hero__art img{object-position:center top}
  .hero__veil{
    background:linear-gradient(to bottom,
      var(--deep) 0%, rgba(6,45,104,.72) 20%, rgba(6,45,104,.12) 48%, rgba(6,45,104,0) 68%);
  }
  /* position:static faz as etiquetas se ancorarem em .hero — e assim
     pousarem sobre a arte, não no vazio azul acima dela */
  .hero__visual{position:static; display:block; width:100%; height:0}
  /* no celular a arte já carrega o peso visual: o selo giratório sai de cena */
  .seal{display:none}
  .hero__badges{
    position:absolute; left:var(--pad); right:var(--pad); bottom:20px;
    display:flex; justify-content:space-between; align-items:flex-end; gap:10px;
  }
  .hero__tag{max-width:47%; padding:11px 14px; font-size:.73rem}
  .hero__tag b{font-size:1.5rem}
  .hero__actions .btn{width:100%}
}

/* faixa de confiança */
.trust{background:var(--deep-2); color:#fff; border-top:1px solid rgba(255,255,255,.1)}
.trust__in{display:grid; grid-template-columns:repeat(4,1fr); gap:8px}
.trust__item{display:flex; align-items:center; gap:14px; padding:22px 20px 22px 0; font-size:.88rem; color:#CBDCF6; line-height:1.35; position:relative}
.trust__item + .trust__item{padding-left:26px}
.trust__item + .trust__item::before{content:""; position:absolute; left:0; top:22%; bottom:22%; width:1px; background:rgba(255,255,255,.14)}
.trust__item b{color:#fff; font-weight:500}
.trust__item .ic{color:#fff; opacity:.95}
@media (max-width:900px){
  .trust__in{grid-template-columns:repeat(2,1fr)}
  .trust__item:nth-child(odd) + .trust__item::before{top:14%; bottom:14%}
  .trust__item:nth-child(3)::before{display:none}
  .trust__item{padding-block:16px}
}
@media (max-width:420px){.trust__in{grid-template-columns:1fr} .trust__item + .trust__item{padding-left:0} .trust__item + .trust__item::before{display:none}}

/* =========================================================
   SEÇÕES — base
   ========================================================= */
.sec{position:relative; padding-block:var(--sec-y)}
.sec--paper{background:var(--paper)}
.sec--paper::before{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.55;
  background:
    radial-gradient(60% 40% at 100% 0,rgba(18,80,196,.07),transparent 60%),
    radial-gradient(50% 40% at 0 100%,rgba(255,185,2,.09),transparent 60%);
}
.sec--paper > .wrap{position:relative}
.sec--deep{background:var(--deep); color:#fff; isolation:isolate}
.deep-bg{position:absolute; inset:0; overflow:hidden; z-index:-1}
.chev--4{width:50vw; height:50vw; top:-18%; left:-10%; background:linear-gradient(135deg,rgba(29,87,159,.5),transparent 62%); clip-path:polygon(0 0,100% 0,0 100%)}
.chev--5{width:46vw; height:46vw; bottom:-14%; right:-10%; background:linear-gradient(315deg,rgba(29,87,159,.5),transparent 62%); clip-path:polygon(100% 100%,100% 0,0 100%)}
.grid-dots{position:absolute; inset:0; opacity:.22;
  background-image:radial-gradient(rgba(255,255,255,.55) 1px,transparent 1px);
  background-size:34px 34px;
  -webkit-mask-image:radial-gradient(70% 60% at 70% 30%,#000,transparent 75%);
  mask-image:radial-gradient(70% 60% at 70% 30%,#000,transparent 75%)}

.sec-head{max-width:830px; margin-bottom:clamp(44px,5vw,72px); position:relative}
/* bloco geométrico da marca */
.brand-tile{width:clamp(120px,13vw,168px); height:auto; margin-top:26px; border-radius:4px}
@media (min-width:1100px){
  .brand-tile{position:absolute; right:-180px; bottom:6px; margin-top:0}
}
.sec-head__sub{margin-top:22px; font-size:clamp(1rem,1.2vw,1.16rem); color:var(--ink-2); max-width:64ch}
.sec-head--light .sec-head__sub{color:#C6D8F4}

/* =========================================================
   02 · PROBLEMA
   ========================================================= */
.fears{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(20px,3vw,10px)}
.fear{position:relative; padding:clamp(24px,2.4vw,34px) clamp(20px,2vw,32px) 30px; }
.fear + .fear::before{content:""; position:absolute; left:0; top:8%; bottom:8%; width:1px; background:var(--line)}
.fear__num{position:absolute; right:clamp(14px,1.6vw,26px); top:10px; font-size:5.4rem; font-weight:600; line-height:1; color:rgba(18,80,196,.09); letter-spacing:-.06em}
.fear .ic{color:var(--royal); margin-bottom:22px}
.fear h3{font-size:clamp(1.15rem,1.5vw,1.4rem); letter-spacing:-.026em; margin-bottom:12px}
.fear p{color:var(--ink-2); font-size:.99rem}
.fear__ans{display:inline-flex; align-items:center; gap:9px; margin-top:20px; padding:9px 15px; border-radius:99px;
  background:rgba(18,80,196,.07); color:var(--royal); font-size:.87rem; font-weight:400}
.fear__ans b{font-weight:600}
.fear__ans .ic{--ia:currentColor; stroke-width:3}
@media (max-width:880px){
  .fears{grid-template-columns:1fr; gap:0}
  .fear{padding-inline:0; padding-block:30px}
  .fear + .fear::before{left:0; right:0; top:0; bottom:auto; width:auto; height:1px}
}

.answer{
  margin-top:clamp(48px,6vw,84px); display:grid; grid-template-columns:.92fr 1.08fr; gap:clamp(24px,4vw,60px);
  align-items:center; background:var(--white); border-radius:var(--r-l); padding:clamp(18px,2vw,26px);
  box-shadow:var(--sh-1); position:relative; overflow:hidden;
}
.answer::before{content:""; position:absolute; left:0; top:0; bottom:0; width:6px; background:linear-gradient(var(--gold),var(--red))}
.answer__img{
  margin:0; position:relative; border-radius:var(--r-m); overflow:hidden; isolation:isolate;
  display:flex; align-items:flex-end; justify-content:center; aspect-ratio:4/4.3;
  background:linear-gradient(150deg,var(--cyan) 0%,var(--cyan-dk) 55%,var(--deep) 100%);
}
/* padronagem institucional atrás da aluna */
.answer__img::before{
  content:""; position:absolute; inset:0; z-index:-1; opacity:.5;
  background:url("../img/padronagem.svg") left top/58% auto repeat-y;
  mask-image:linear-gradient(115deg,#000 30%,transparent 78%);
  -webkit-mask-image:linear-gradient(115deg,#000 30%,transparent 78%);
}
.answer__img img{width:97%; height:auto; align-self:flex-end; filter:drop-shadow(0 22px 34px rgba(0,30,60,.42))}
.answer__txt{padding-right:clamp(0px,2vw,26px)}
.answer__quote{display:block; color:var(--gold); margin-bottom:14px}
.answer__quote svg{fill:currentColor; stroke:none}
.answer__lead{font-size:clamp(1.2rem,1.9vw,1.6rem); font-weight:400; letter-spacing:-.02em; line-height:1.3; color:var(--ink)}
.answer__lead b{font-weight:600}
.answer__list{margin:26px 0 30px; display:grid; gap:12px}
.answer__list li{display:flex; align-items:flex-start; gap:14px; font-size:1.02rem; color:var(--ink-2)}
.answer__list li::before{
  content:""; flex:none; width:26px; height:26px; margin-top:2px; border-radius:8px;
  background:var(--deep) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFB902' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4 12.5 5 5L20 6.5'/%3E%3C/svg%3E") center/15px no-repeat;
}
.answer__list li span{padding-top:1px}
@media (max-width:880px){
  .answer{grid-template-columns:1fr}
  /* a foto agora é um recorte com fundo transparente: quem define o
     enquadramento é o painel, não um aspect-ratio forçado na imagem */
  .answer__img{aspect-ratio:4/3.3}
  .answer__img img{width:88%}
}

/* =========================================================
   03 · MERCADO / INFOGRÁFICO
   ========================================================= */
.info{display:grid; grid-template-columns:.95fr 1.05fr; gap:clamp(30px,5vw,72px); align-items:center}
.bignum{
  font-size:clamp(4.2rem,10vw,8.4rem); font-weight:600; line-height:.86; letter-spacing:-.055em;
  color:var(--gold); font-variant-numeric:tabular-nums;
}
.bignum__cap{margin-top:18px; font-size:clamp(1.1rem,1.6vw,1.42rem); font-weight:400; line-height:1.3; letter-spacing:-.02em; max-width:19ch; color:#fff}
.info__note{margin-top:24px; padding-top:24px; border-top:1px solid var(--line-lt); color:#B9CEEE; font-size:.98rem; max-width:52ch}
.info__note b{color:#fff; font-weight:500}

.chart{margin:0; background:rgba(255,255,255,.05); border:1px solid var(--line-lt); border-radius:var(--r-l); padding:clamp(20px,2.6vw,34px)}
.chart__cap{font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:var(--sky); margin-bottom:26px}
.chart__plot{display:grid; grid-template-columns:1fr 1.1fr 1fr; gap:clamp(8px,1.6vw,20px); align-items:end; min-height:290px}
.col{display:flex; flex-direction:column; align-items:center; gap:12px}
.col__val{font-size:clamp(1.1rem,1.7vw,1.5rem); font-weight:500; letter-spacing:-.03em; color:#fff}
.col__val i{font-style:normal; font-size:.62em; font-weight:300; color:var(--sky); display:block; text-align:center; letter-spacing:0}
.col__stack{display:flex; flex-direction:column-reverse; gap:4px; width:100%; max-width:104px}
.col__stack b{
  display:block; height:14px; border-radius:3px; background:linear-gradient(90deg,#2E6FE8,#5C93FF);
  transform-origin:bottom; opacity:0;
}
.col__stack b.gain{background:linear-gradient(90deg,var(--gold-dk),var(--gold-2)); box-shadow:0 0 18px rgba(255,185,2,.35)}
.chart.in .col__stack b{animation:blockin .5s cubic-bezier(.2,.8,.3,1) forwards; animation-delay:var(--bd,0ms)}
@keyframes blockin{from{opacity:0; transform:translateY(10px) scaleY(.2)} to{opacity:1; transform:none}}
@media (prefers-reduced-motion:reduce){.col__stack b{opacity:1 !important; animation:none !important}}
.col__yr{font-size:.95rem; letter-spacing:.1em; color:#A9C2E8; padding-top:10px; border-top:1px solid var(--line-lt); width:100%; text-align:center}
.col--now .col__yr{color:#fff}

.chart__delta{position:relative; height:230px; align-self:end; margin-bottom:38px}
.chart__delta svg{width:100%; height:100%; overflow:visible}
.delta__line{fill:none; stroke:var(--gold); stroke-width:2.6; stroke-dasharray:6 7; stroke-linecap:round;
  stroke-dashoffset:300; }
.chart.in .delta__line{animation:dash 1.6s .6s ease forwards}
@keyframes dash{to{stroke-dashoffset:0}}
.delta__head{fill:none; stroke:var(--gold); stroke-width:2.8; stroke-linecap:round; stroke-linejoin:round; opacity:0}
.chart.in .delta__head{animation:fadein .4s 2s forwards}
@keyframes fadein{to{opacity:1}}
.delta__badge{
  position:absolute; left:50%; top:38%; translate:-50% -50%; background:var(--gold); color:var(--deep);
  font-weight:600; font-size:1.02rem; padding:7px 15px; border-radius:99px; box-shadow:var(--sh-gold); white-space:nowrap;
}
.chart__legend{display:flex; align-items:center; flex-wrap:wrap; gap:8px 14px; margin-top:26px; padding-top:20px; border-top:1px solid var(--line-lt); font-size:.82rem; color:#A9C2E8}
.key{width:22px; height:9px; border-radius:3px; display:inline-block}
.key--base{background:linear-gradient(90deg,#2E6FE8,#5C93FF)}
.key--gain{background:linear-gradient(90deg,var(--gold-dk),var(--gold-2)); margin-left:8px}
.chart__legend em{font-style:normal; opacity:.66; margin-left:auto}
@media (max-width:980px){.info{grid-template-columns:1fr} .chart__delta{height:190px}}
@media (max-width:480px){.chart__legend em{margin-left:0; width:100%}}

/* onde atuar */
.where{margin-top:clamp(56px,7vw,104px)}
.where .h3{margin-bottom:36px}
.where__grid{display:grid; grid-template-columns:repeat(6,1fr); gap:clamp(14px,2vw,30px)}
.where__i{
  position:relative; display:flex; flex-direction:column; align-items:center; text-align:center; gap:9px;
  padding:8px 6px 4px; transition:transform .35s cubic-bezier(.2,.7,.3,1);
}
.where__i + .where__i::before{
  content:""; position:absolute; left:calc(clamp(14px,2vw,30px)/-2); top:12%; bottom:12%;
  width:1px; background:linear-gradient(transparent,rgba(255,255,255,.22),transparent);
}
.where__i .ic{color:#fff; margin-bottom:6px; transition:color .3s, transform .35s cubic-bezier(.2,.7,.3,1)}
.where__i:hover{transform:translateY(-6px)}
.where__i:hover .ic{color:var(--gold-2); --ia:#fff}
.where__i b{font-weight:500; font-size:1.06rem; letter-spacing:-.02em}
.where__i span{font-size:.82rem; color:#A9C2E8; line-height:1.35; font-weight:300; max-width:20ch}
@media (max-width:1080px){
  .where__grid{grid-template-columns:repeat(3,1fr); row-gap:38px}
  .where__i:nth-child(3n+1)::before{display:none}
}
@media (max-width:560px){
  .where__grid{grid-template-columns:repeat(2,1fr)}
  .where__i:nth-child(3n+1)::before{display:block}
  .where__i:nth-child(odd)::before{display:none}
}

.where__close{margin-top:clamp(36px,4vw,56px); font-size:clamp(1.08rem,1.7vw,1.44rem); font-weight:300; line-height:1.45; letter-spacing:-.02em; max-width:60ch; color:#DCE8FA}
.where__close b{font-weight:500; color:#fff}
.source{margin-top:26px; font-size:.8rem; color:#7E9BC8; max-width:70ch}
.source i{font-style:italic}

/* =========================================================
   04 · TRILHA DO CURSO
   ========================================================= */
.track{display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(28px,4.5vw,72px); align-items:start}
.track__sticky{position:sticky; top:104px}
.mosaic{position:relative; margin:0 0 24px}
.mosaic img{border-radius:var(--r-m); box-shadow:var(--sh-1)}
.mosaic__a{width:78%; aspect-ratio:4/5; object-fit:cover}
.mosaic__b{width:56%; aspect-ratio:3/4; object-fit:cover; position:absolute; right:0; bottom:-34px; border:6px solid var(--paper)}
.mosaic__stamp{
  position:absolute; left:-10px; top:24px; display:grid; place-items:center; padding:12px 16px; border-radius:12px;
  background:var(--deep); color:#fff; box-shadow:var(--sh-2); line-height:1.1; text-align:center;
}
.mosaic__stamp b{color:var(--gold); font-size:1.25rem; font-weight:600; letter-spacing:-.03em}
.mosaic__stamp i{font-style:normal; font-size:.72rem; letter-spacing:.08em; color:#BBD1F2}
.track__note{display:flex; gap:12px; align-items:flex-start; margin-top:58px; padding-top:22px; border-top:1px solid var(--line); font-size:.95rem; color:var(--ink-2)}
.track__note .ic{color:var(--royal)}

.steps{position:relative; padding-left:clamp(30px,4vw,54px)}
.steps__rail{position:absolute; left:0; top:14px; bottom:34px; width:2px; background:var(--line)}
.steps__rail i{position:absolute; inset:0 0 auto 0; height:0; background:linear-gradient(var(--gold),var(--royal)); transition:height .25s linear}
.step{position:relative; padding-bottom:clamp(38px,4.5vw,58px)}
.step::before{
  content:""; position:absolute; left:calc(clamp(30px,4vw,54px)*-1 - 5px); top:16px; width:12px; height:12px; border-radius:50%;
  background:var(--paper); border:2.5px solid var(--royal); transition:background .3s, border-color .3s, scale .3s;
}
.step.in::before{background:var(--gold); border-color:var(--gold); scale:1.15}
.step__idx{
  position:absolute; right:0; top:-6px; font-size:clamp(3.4rem,6vw,5.6rem); font-weight:600; line-height:1;
  color:transparent; -webkit-text-stroke:1.4px rgba(18,80,196,.2); letter-spacing:-.05em; pointer-events:none;
}
.step__ic{margin-bottom:18px}
.step__ic .ic{color:var(--deep)}
.step__body h3{font-size:clamp(1.24rem,2vw,1.7rem); letter-spacing:-.028em; margin-bottom:12px; max-width:22ch}
.step__body p{color:var(--ink-2); max-width:56ch}
.step__tag{display:inline-block; margin-top:16px; font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; color:var(--royal); font-weight:500;
  border-left:3px solid var(--gold); padding-left:11px}
@media (max-width:900px){
  .track{grid-template-columns:1fr}
  .track__sticky{position:static}
  .mosaic{max-width:440px}
  .track__note{margin-top:56px}
}

/* turnos */
.shifts{
  margin-top:clamp(56px,7vw,96px); display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(24px,4vw,56px);
  align-items:center; padding:clamp(34px,4vw,54px) 0 0; border-top:1px solid var(--line);
}
.shifts__head p{margin-top:14px; color:var(--ink-2)}
.shifts__list{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(14px,2vw,30px)}
.shifts__list li{position:relative; display:flex; flex-direction:column; gap:5px; padding:6px 10px 6px 0; text-align:left}
.shifts__list li + li{padding-left:clamp(14px,2vw,30px)}
.shifts__list li + li::before{content:""; position:absolute; left:0; top:6%; bottom:6%; width:1px; background:var(--line)}
.shifts__list .ic{color:var(--royal); margin-bottom:10px}
.shifts__list b{font-size:1.15rem; font-weight:600; letter-spacing:-.02em}
.shifts__list span{font-size:.85rem; color:var(--ink-2); line-height:1.35}
@media (max-width:900px){.shifts{grid-template-columns:1fr}}
@media (max-width:620px){.shifts__list{grid-template-columns:1fr; gap:22px} .shifts__list li + li{padding-left:0} .shifts__list li + li::before{left:0; right:0; top:0; bottom:auto; width:auto; height:1px}}

/* =========================================================
   05 · PROVA SOCIAL
   ========================================================= */
.numbers{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2vw,10px); margin-bottom:clamp(44px,5vw,70px)}
.numbers__i{position:relative; padding:6px clamp(14px,2vw,30px)}
.numbers__i + .numbers__i::before{content:""; position:absolute; left:0; top:6%; bottom:14%; width:1px; background:var(--line-lt)}
.numbers__i .bignum{font-size:clamp(3rem,6.4vw,5.4rem)}
.numbers__i > p:last-child{margin-top:12px; color:#C6D8F4; font-size:1rem; line-height:1.35}
.stars{display:block; margin-top:6px; color:var(--gold); letter-spacing:.1em; font-size:.95rem}
.stars i{opacity:.35; font-style:normal}
.stars i.half{position:relative; opacity:1; color:rgba(255,185,2,.32)}
.stars i.half::before{content:"★"; position:absolute; left:0; top:0; width:.5em; overflow:hidden; color:var(--gold)}
.fn{color:var(--gold); text-decoration:none; font-weight:500; padding-left:2px}
@media (max-width:760px){
  .numbers{grid-template-columns:1fr; gap:0}
  .numbers__i{display:flex; align-items:baseline; gap:18px; padding-block:18px}
  .numbers__i + .numbers__i::before{left:0; right:0; top:0; bottom:auto; width:auto; height:1px}
  .numbers__i .bignum{font-size:3.2rem; min-width:4.4ch}
  .numbers__i > p:last-child{margin-top:0}
}

.testi{
  margin:0 0 clamp(44px,5vw,68px); display:grid; grid-template-columns:auto 1fr; gap:clamp(22px,3.4vw,54px);
  align-items:center; padding:clamp(26px,3.4vw,46px); border-radius:var(--r-l);
  background:linear-gradient(120deg,rgba(255,255,255,.1),rgba(255,255,255,.03));
  border:1px solid var(--line-lt); position:relative; overflow:hidden;
}
.testi::before{content:""; position:absolute; right:-60px; top:-60px; width:260px; height:260px; border-radius:50%; background:radial-gradient(circle,rgba(255,185,2,.16),transparent 65%)}
.testi__media{position:relative; text-align:center}
.avatar{
  display:grid; place-items:center; width:clamp(96px,11vw,140px); aspect-ratio:1; border-radius:50%;
  background:linear-gradient(140deg,var(--gold),var(--gold-dk)); color:var(--deep);
  font-size:clamp(2.6rem,4vw,3.8rem); font-weight:600; line-height:1; box-shadow:var(--sh-2);
}
.testi__badge{
  display:inline-flex; align-items:center; gap:6px; margin-top:14px; padding:6px 12px; border-radius:99px;
  background:rgba(255,255,255,.12); font-size:.76rem; letter-spacing:.06em; color:#DCE8FA; white-space:nowrap;
}
.testi__badge .ic{stroke-width:3}
.testi__quote{margin:0; position:relative}
.testi__mark{color:var(--gold); fill:currentColor; stroke:none; opacity:.32; margin-bottom:14px}
.testi__quote p{font-size:clamp(1.24rem,2.4vw,2.05rem); font-weight:300; line-height:1.34; letter-spacing:-.026em; color:#fff}
.testi__quote figcaption{margin-top:24px; display:flex; align-items:center; gap:12px; flex-wrap:wrap; font-size:.95rem; color:#B9CEEE}
.testi__quote figcaption b{font-weight:500; color:var(--gold); font-size:1.05rem}
.testi__quote figcaption b::after{content:""; display:inline-block; width:22px; height:1px; background:currentColor; margin-left:12px; vertical-align:middle; opacity:.5}
@media (max-width:700px){.testi{grid-template-columns:1fr; text-align:left} .testi__media{text-align:left}}

.gallery{display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(10px,1.4vw,18px)}
.gallery li{position:relative; border-radius:var(--r-m); overflow:hidden; aspect-ratio:4/3; box-shadow:var(--sh-1)}
.gallery img{width:100%; height:100%; object-fit:cover; transition:transform .7s cubic-bezier(.2,.7,.3,1), filter .5s;
  filter:saturate(.82) contrast(1.05)}
.gallery li::after{content:""; position:absolute; inset:0; background:linear-gradient(to top,rgba(4,25,58,.85),rgba(4,25,58,.05) 55%); pointer-events:none}
.gallery li:hover img{transform:scale(1.06); filter:saturate(1.05) contrast(1.04)}
.gallery span{position:absolute; left:14px; bottom:12px; z-index:2; font-size:.82rem; color:#fff; letter-spacing:.02em}
.gallery span::before{content:""; display:block; width:20px; height:2px; background:var(--gold); margin-bottom:7px}
@media (max-width:900px){.gallery{grid-template-columns:repeat(2,1fr)}}

/* =========================================================
   06 · OBJEÇÕES
   ========================================================= */
.obj{display:grid; gap:clamp(34px,4.5vw,60px)}
.obj__row{
  display:grid; grid-template-columns:.92fr 1.08fr; gap:clamp(24px,4vw,64px); align-items:center;
  padding-bottom:clamp(34px,4.5vw,60px); border-bottom:1px solid var(--line);
}
.obj__row:last-child{border-bottom:0; padding-bottom:0}
.obj__label{
  font-size:.74rem; letter-spacing:.18em; text-transform:uppercase; color:var(--royal);
  font-weight:500; margin-bottom:16px; display:flex; align-items:center; gap:10px;
}
.obj__label::after{content:""; flex:1; height:1px; background:var(--line)}
.bubble{
  position:relative; display:block; padding:26px 30px; border-radius:20px 20px 20px 5px;
  background:var(--white); border:1px solid var(--line); box-shadow:var(--sh-1);
  font-size:clamp(1.24rem,2.1vw,1.85rem); font-weight:400; letter-spacing:-.028em; line-height:1.2; color:var(--ink);
}
.bubble::before{
  content:""; position:absolute; left:26px; top:-9px; width:34px; height:4px; border-radius:99px;
  background:var(--gold);
}
.obj__a{display:flex; gap:clamp(18px,2.6vw,34px); align-items:center}
.obj__ic{color:var(--deep); flex:none; --ia:var(--gold)}
.obj__hd{font-size:clamp(1.06rem,1.5vw,1.32rem); font-weight:600; letter-spacing:-.024em; color:var(--ink); margin-bottom:10px; line-height:1.2}
.obj__txt p:last-child{font-size:clamp(1rem,1.2vw,1.1rem); color:var(--ink-2); line-height:1.55; max-width:46ch}
.obj__row--alt .obj__side{order:2}
@media (max-width:900px){
  .obj__row, .obj__row--alt{grid-template-columns:1fr; gap:26px}
  .obj__row--alt .obj__side{order:0}
  .obj__ic{width:84px; height:84px}
  .bubble{padding:22px 24px}
}
@media (max-width:520px){
  .obj__a{flex-direction:column; align-items:flex-start; gap:16px}
}

.faq{margin-top:clamp(48px,6vw,80px); max-width:900px}
.faq__title{margin-bottom:22px; font-size:clamp(1.1rem,1.5vw,1.35rem); color:var(--ink-2); font-weight:400; letter-spacing:0}
.qa{border-top:1px solid var(--line)}
.qa:last-of-type{border-bottom:1px solid var(--line)}
.qa summary{
  display:flex; align-items:center; gap:16px; padding:22px 4px; cursor:pointer; list-style:none;
  font-size:clamp(1.02rem,1.3vw,1.18rem); font-weight:400; letter-spacing:-.015em; transition:color .2s;
}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{
  content:""; flex:none; margin-left:auto; width:30px; height:30px; border-radius:50%;
  border:1.6px solid var(--line);
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231250C4' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center/15px no-repeat;
  transition:rotate .3s cubic-bezier(.2,.7,.3,1), background-color .3s, border-color .3s;
}
.qa[open] summary{color:var(--royal)}
.qa[open] summary::after{rotate:135deg; background-color:rgba(18,80,196,.08); border-color:transparent}
.qa summary:hover{color:var(--royal)}
.qa__body{padding:0 60px 24px 4px; color:var(--ink-2)}
@media (prefers-reduced-motion:no-preference){
  .qa[open] .qa__body{animation:qain .38s cubic-bezier(.2,.7,.3,1)}
  @keyframes qain{from{opacity:0; transform:translateY(-6px)}}
}

/* =========================================================
   07 · CTA FINAL
   ========================================================= */
.sec--cta{background:linear-gradient(150deg,var(--deep-2),var(--deep) 45%,#0B3C86); color:#fff; isolation:isolate; overflow:hidden}
.cta-bg{position:absolute; inset:0; z-index:-1; overflow:hidden}
.chev--6{position:absolute; width:60vw; height:60vw; bottom:-24%; left:-16%; background:linear-gradient(45deg,rgba(46,111,232,.34),transparent 60%); clip-path:polygon(0 100%,100% 100%,0 0)}
.pattern-rail{
  position:absolute; left:0; top:0; height:100%; width:auto; opacity:.26;
  mask-image:linear-gradient(to bottom,transparent,#000 18%,#000 72%,transparent);
  -webkit-mask-image:linear-gradient(to bottom,transparent,#000 18%,#000 72%,transparent);
}
@media (max-width:1240px){.pattern-rail{display:none}}
.cta__grid{display:grid; grid-template-columns:1.02fr .98fr; gap:clamp(30px,5vw,72px); align-items:center}
.cta__copy .lede{margin-top:20px; color:#D3E1F8; max-width:46ch}
.cta__list{margin:32px 0 30px; display:grid; gap:13px}
.cta__list li{display:flex; align-items:center; gap:13px; font-size:1.02rem; color:#E6EEFB; font-weight:300}
.cta__list .ic{color:var(--gold); stroke-width:3}
.cta__scarcity{margin-top:14px; font-size:.88rem; color:#B9CEEE}
.cta__scarcity b{color:#fff; font-weight:500}
.cta__scarcity span{opacity:.4; margin-inline:5px}

.form-wrap{position:relative}
.form{
  background:var(--white); color:var(--ink); border-radius:var(--r-l); padding:clamp(24px,3vw,40px);
  box-shadow:0 30px 70px rgba(2,14,36,.4); border-top:5px solid var(--gold);
}
.form__title{font-size:clamp(1.32rem,2vw,1.7rem); font-weight:600; letter-spacing:-.028em; line-height:1.1}
.form__sub{margin-top:8px; margin-bottom:26px; font-size:.93rem; color:var(--ink-2)}
.field{margin-bottom:16px}
.field label{display:block; font-size:.82rem; font-weight:500; letter-spacing:.03em; color:var(--ink-2); margin-bottom:7px}
.field input, .select select{
  width:100%; padding:14px 16px; border:1.6px solid var(--line); border-radius:10px; background:#FAFBFE;
  font-weight:300; font-size:1rem; transition:border-color .2s, background .2s, box-shadow .2s;
}
.field input::placeholder{color:#9AA8BF}
.field input:focus, .select select:focus{outline:0; border-color:var(--royal); background:#fff; box-shadow:0 0 0 4px rgba(18,80,196,.1)}
.select{position:relative}
.select::after{
  content:""; position:absolute; right:16px; top:50%; translate:0 -50%; width:12px; height:8px; pointer-events:none;
  background:var(--ink-2); clip-path:polygon(0 0,100% 0,50% 100%);
}
.select select{appearance:none; padding-right:40px; cursor:pointer}
.check{display:flex; gap:12px; align-items:flex-start; margin-top:20px; font-size:.86rem; color:var(--ink-2); cursor:pointer; line-height:1.4}
.check input{flex:none; width:20px; height:20px; margin-top:1px; accent-color:var(--royal)}
.err{display:none; margin-top:6px; font-size:.8rem; color:var(--red); font-weight:400}
.field.invalid .err, .check.invalid + .err--block{display:block}
.field.invalid input, .field.invalid select{border-color:var(--red); background:#FFF6F7}
.form .btn{margin-top:22px}
.form__legal{display:flex; align-items:center; gap:8px; margin-top:16px; font-size:.76rem; color:var(--ink-2); text-align:left}
.form__legal .ic{color:var(--royal)}
.form__ok{margin-top:16px; padding:14px 16px; border-radius:10px; background:rgba(18,80,196,.07); color:var(--royal); font-size:.92rem}
@media (max-width:940px){.cta__grid{grid-template-columns:1fr}}

/* =========================================================
   FOOTER + DOCK
   ========================================================= */
.foot{background:var(--deep-2); color:#A9BEDF; font-size:.9rem; font-weight:300; padding-top:clamp(48px,6vw,72px)}
.foot__in{display:grid; grid-template-columns:1.2fr 1fr 1.4fr; gap:clamp(24px,4vw,52px); padding-bottom:40px}
.foot__brand{display:grid; gap:14px; justify-items:start}
.foot__brand img{width:132px; height:auto}
.foot__brand p{display:grid; line-height:1.2}
.foot__brand span{font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color:var(--sky)}
.foot__col h4{font-size:.76rem; letter-spacing:.16em; text-transform:uppercase; color:#fff; margin-bottom:14px; font-weight:500}
.foot__col p{margin-bottom:8px; line-height:1.5}
.foot__col a, .foot__bar a{display:inline-block; padding-block:5px}
.foot__col a{border-bottom:1px solid rgba(255,255,255,.2)}
.foot__col a:hover{color:#fff; border-color:var(--gold)}
.foot__col b{color:var(--gold)}
.foot__bar{display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; padding-block:20px; border-top:1px solid rgba(255,255,255,.1); font-size:.8rem}
/* faixa intermediária: duas colunas apertadas, texto ainda sobre a arte */
@media (min-width:701px) and (max-width:1100px){
  .hero__grid{grid-template-columns:1.24fr .76fr; min-height:clamp(520px,62vw,660px)}
  .h1{font-size:clamp(1.85rem,3.4vw,2.5rem)}
  .hero .lede{font-size:1rem}
  .hero__art img{object-position:78% 16%}
  .hero__veil{
    background:
      linear-gradient(100deg,
        var(--deep) 0%, rgba(6,45,104,.97) 40%, rgba(6,45,104,.82) 58%,
        rgba(6,45,104,.34) 74%, rgba(6,45,104,0) 88%),
      linear-gradient(to bottom, rgba(6,45,104,.5), transparent 22%);
  }
  .hero__visual{width:100%}
  /* faixa estreita: o vídeo encolhe para o rosto não invadir o texto */
  .hero__video{width:54%; object-position:44% center}
  .seal{width:92px; height:92px; right:0; top:6%}
  .hero__tag{font-size:.76rem; padding:11px 14px}
  .hero__tag b{font-size:1.7rem}
}

@media (max-width:820px){.foot__in{grid-template-columns:1fr}}

.dock{
  position:fixed; left:0; right:0; bottom:0; z-index:70; display:none; align-items:center; gap:14px;
  padding:12px 16px calc(12px + env(safe-area-inset-bottom)); background:rgba(4,25,58,.96);
  backdrop-filter:blur(12px); border-top:1px solid rgba(255,255,255,.12);
  translate:0 130%; transition:translate .35s cubic-bezier(.2,.7,.3,1);
}
.dock[data-show]{translate:0 0}
.dock__txt{display:grid; line-height:1.2; color:#fff}
.dock__txt b{font-size:.95rem; font-weight:500}
.dock__txt span{font-size:.75rem; color:#A9C2E8}
.dock .btn{margin-left:auto; padding:13px 20px; font-size:.94rem; white-space:nowrap}
/* faixa intermediária: duas colunas apertadas, texto ainda sobre a arte */
@media (min-width:701px) and (max-width:1100px){
  .hero__grid{grid-template-columns:1.24fr .76fr; min-height:clamp(520px,62vw,660px)}
  .h1{font-size:clamp(1.85rem,3.4vw,2.5rem)}
  .hero .lede{font-size:1rem}
  .hero__art img{object-position:78% 16%}
  .hero__veil{
    background:
      linear-gradient(100deg,
        var(--deep) 0%, rgba(6,45,104,.97) 40%, rgba(6,45,104,.82) 58%,
        rgba(6,45,104,.34) 74%, rgba(6,45,104,0) 88%),
      linear-gradient(to bottom, rgba(6,45,104,.5), transparent 22%);
  }
  .hero__visual{width:100%}
  /* faixa estreita: o vídeo encolhe para o rosto não invadir o texto */
  .hero__video{width:54%; object-position:44% center}
  .seal{width:92px; height:92px; right:0; top:6%}
  .hero__tag{font-size:.76rem; padding:11px 14px}
  .hero__tag b{font-size:1.7rem}
}

@media (max-width:820px){.dock{display:flex} body{padding-bottom:0}}

@media (prefers-reduced-motion:reduce){
  .topbar__pulse, .meter__fill, .seal svg, .hero__figure img, .btn::after{animation:none !important; transition:none !important}
  .meter__fill{transform:none}
  .gallery img, .where__i, .btn{transition:none !important}
}

@media print{
  .topbar,.site-head,.dock,.hero__bg,.deep-bg,.cta-bg{display:none!important}
  body{background:#fff; color:#000}
}