/* =========================================================
   PISCA AUTOESCOLA (projeto conceito VEXA)
   Paleta: ultravioleta + âmbar-pisca + verde-siga · Unbounded + Figtree
   ========================================================= */
@font-face{font-family:'Unbounded';src:url(../fonts/unbounded.woff2) format('woff2');font-weight:200 900;font-style:normal;font-display:swap}
@font-face{font-family:'Figtree';src:url(../fonts/figtree.woff2) format('woff2');font-weight:300 900;font-style:normal;font-display:swap}

:root{
  --fundo:#F6F4FF;
  --fundo-2:#ECE8FF;
  --branco:#FFFFFF;
  --tinta:#160E36;
  --tinta-2:#4D4670;
  --ultra:#4B23E8;
  --ultra-2:#3A16C9;
  --ultra-claro:#B9A8FF;
  --noite:#160E36;
  --noite-2:#22145E;
  --ambar:#FFB21A;
  --ambar-2:#FFC94D;
  --verde:#16C47F;
  --vermelho:#FF4D3D;
  --coral:#FF7A6B;
  --display:'Unbounded','Arial Black',system-ui,sans-serif;
  --sans:'Figtree',system-ui,-apple-system,'Segoe UI',sans-serif;
  --faixa:34px;
  --gut:clamp(16px,4vw,56px);
  --raio:28px;
  --mola:cubic-bezier(.34,1.56,.64,1);
  --ease:cubic-bezier(.2,.7,.1,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--faixa) + 80px)}
body{margin:0;background:var(--fundo);color:var(--tinta);font-family:var(--sans);font-size:17px;line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img,svg{display:block}
a{color:inherit}
button,input{font:inherit;color:inherit}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
main{overflow-x:clip}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--ambar);outline-offset:3px;border-radius:8px}
.pular{position:fixed;left:12px;top:-60px;z-index:300;background:var(--tinta);color:#fff;padding:10px 14px;border-radius:10px;text-decoration:none}
.pular:focus{top:calc(var(--faixa) + 8px)}

/* ---------- faixa VEXA ---------- */
.vexa-faixa{position:fixed;inset:0 0 auto;height:var(--faixa);z-index:200;display:flex;align-items:center;justify-content:center;gap:18px;padding:0 12px;background:var(--noite);color:#CFCBE6;font-size:12.5px;letter-spacing:.02em}
.vexa-faixa strong{color:#fff;font-weight:800}
.vexa-faixa a{color:#fff;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.35);white-space:nowrap}
.vexa-faixa a:hover{color:var(--ambar);border-color:var(--ambar)}

/* ---------- tipografia ---------- */
.rotulo{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--ultra);margin:0 0 18px}
.rotulo::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--ambar);box-shadow:0 0 0 4px rgba(255,178,26,.25)}
.rotulo-claro{color:var(--ambar)}
.titulo-sec{font-family:var(--display);font-weight:700;font-size:clamp(32px,4.6vw,66px);line-height:1.04;letter-spacing:-.03em;margin:0;max-width:16ch}
.marca-texto{color:var(--ultra)}
.sec-intro{max-width:560px;color:var(--tinta-2);font-size:18px;margin:20px 0 0}

/* ---------- botões ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 26px;border-radius:999px;font-weight:800;font-size:16px;text-decoration:none;border:2px solid transparent;cursor:pointer;transition:background-color .25s,color .25s,border-color .25s,box-shadow .3s;will-change:transform}
.btn svg{width:20px;height:20px;transition:transform .35s var(--mola)}
.btn:hover svg{transform:translateX(4px)}
.btn-ambar{background:var(--ambar);color:var(--tinta);box-shadow:0 10px 24px -10px rgba(255,178,26,.9)}
.btn-ambar:hover{background:var(--ambar-2)}
.btn-vidro{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.4)}
.btn-vidro:hover{background:rgba(255,255,255,.22);border-color:#fff}
.btn-grande{min-height:62px;font-size:17px;padding:0 30px}

/* ---------- topo ---------- */
.topo{position:fixed;top:var(--faixa);left:0;right:0;z-index:150;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px var(--gut);transition:transform .45s var(--ease)}
.topo::before{content:"";position:absolute;inset:0;background:rgba(246,244,255,.94);box-shadow:0 1px 0 rgba(22,14,54,.08);opacity:0;transition:opacity .3s;z-index:-1}
.topo.rolou::before{opacity:1}
.topo.some{transform:translateY(-130%)}
.marca{display:flex;align-items:center;gap:10px;text-decoration:none}
.marca-pisca{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:var(--tinta)}
.marca-pisca svg{width:30px;height:18px;fill:none;stroke:var(--ambar);stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round}
.marca-pisca circle{fill:#fff;stroke:none}
.mp-e{animation:piscaE 1.6s steps(1) infinite}
.mp-d{animation:piscaE 1.6s steps(1) infinite .8s}
@keyframes piscaE{0%{opacity:1}50%{opacity:.18}}
.marca-nome{font-family:var(--display);font-weight:800;font-size:26px;letter-spacing:-.04em;line-height:1}
.marca-sub{font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--tinta-2);margin-top:4px}
.topo-nav{display:flex;gap:6px;padding:6px;border-radius:999px;background:#fff;box-shadow:0 6px 20px -12px rgba(22,14,54,.3)}
.topo-nav a{text-decoration:none;font-weight:700;font-size:14.5px;padding:8px 16px;border-radius:999px;transition:background-color .25s,color .25s}
.topo-nav a:hover{background:var(--fundo-2);color:var(--ultra)}
.topo-btn{min-height:46px;padding:0 22px;font-size:15px}

/* =========================================================
   HERO
   ========================================================= */
.hero{padding:calc(var(--faixa) + 84px) var(--gut) 0}
.hero-bloco{position:relative;overflow:hidden;border-radius:clamp(24px,3vw,44px);background:var(--ultra);color:#fff;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:2vw;padding:clamp(36px,5vw,72px) clamp(24px,5vw,72px) 0;min-height:min(820px,calc(100svh - var(--faixa) - 100px))}
.hero-bloco::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 12% 110%,rgba(255,122,107,.55),transparent 40%),radial-gradient(circle at 90% -10%,rgba(22,196,127,.45),transparent 42%),radial-gradient(circle at 60% 60%,rgba(255,255,255,.08),transparent 50%);pointer-events:none}
.hero-luz{position:absolute;left:0;top:0;width:620px;height:620px;margin:-310px 0 0 -310px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.18),rgba(255,255,255,0) 62%);pointer-events:none;opacity:0;transition:opacity .5s;will-change:transform}
.hero-bloco.luz-on .hero-luz{opacity:1}
.hero-texto{position:relative;z-index:2;align-self:center;padding-bottom:clamp(36px,5vw,72px)}
.selo{display:inline-flex;align-items:center;gap:10px;margin:0 0 26px;padding:8px 16px 8px 10px;border-radius:999px;background:rgba(255,255,255,.14);font-weight:700;font-size:14px}
.selo-seta{width:22px;height:22px;border-radius:50%;background:var(--ambar);position:relative;animation:piscaE 1.2s steps(1) infinite}
.selo-seta::after{content:"";position:absolute;left:8px;top:6px;width:7px;height:7px;border-right:2.5px solid var(--tinta);border-bottom:2.5px solid var(--tinta);transform:rotate(-45deg)}
.hero-titulo{font-family:var(--display);font-weight:800;font-size:clamp(40px,5.4vw,84px);line-height:1.02;letter-spacing:-.045em;margin:0 0 26px}
.hl{display:block;overflow:hidden;padding:.04em 0 .08em;margin:-.04em 0 -.08em}
.hl>span{display:inline-block}
.js .hl>span{transform:translateY(110%);transition:transform 1s var(--ease)}
.js .hl:nth-child(2)>span{transition-delay:.12s}
.js .hl:nth-child(3)>span{transition-delay:.24s}
.js .pronto .hl>span{transform:none}
.hero-titulo mark{display:inline-block;background:none;color:var(--tinta);position:relative;padding:0 .18em;z-index:0}
.hero-titulo mark::before{content:"";position:absolute;inset:.06em 0 .02em;border-radius:.3em;background:var(--ambar);z-index:-1;transform:rotate(-2deg) scaleX(0);transform-origin:0 50%;transition:transform .8s var(--mola) .7s}
.pronto .hero-titulo mark::before,html:not(.js) .hero-titulo mark::before{transform:rotate(-2deg) scaleX(1)}
.hero-sub{max-width:500px;font-size:clamp(16px,1.4vw,19px);color:#E7E1FF;margin:0 0 32px}
.hero-acoes{display:flex;flex-wrap:wrap;gap:12px}
.js .hero-sub,.js .hero-acoes,.js .selo{opacity:0;transform:translateY(18px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.js .pronto .selo{opacity:1;transform:none}
.js .pronto .hero-sub{opacity:1;transform:none;transition-delay:.45s}
.js .pronto .hero-acoes{opacity:1;transform:none;transition-delay:.6s}

.cabine-caixa{position:relative;z-index:2;align-self:end;width:100%;max-width:580px;justify-self:center;touch-action:pan-y}
.cabine{width:100%;height:auto;overflow:hidden}
.js .cabine-caixa{opacity:0;transform:translateY(60px) scale(.96);transition:opacity 1s var(--ease) .2s,transform 1.2s var(--ease) .2s}
.js .pronto .cabine-caixa{opacity:1;transform:none}
.faixa-central{animation:faixa .55s linear infinite}
@keyframes faixa{to{stroke-dashoffset:-34}}
.pausado .faixa-central,.pausado .sol,.pausado .ponteiro,.pausado .chip-flut,.pausado .tela-barra{animation-play-state:paused}
.sol{animation:sol 6s ease-in-out infinite alternate;transform-origin:388px 168px}
@keyframes sol{to{transform:translateY(8px) scale(1.05)}}
.ponteiro{animation:ponteiro 2.4s ease-in-out infinite alternate;transform-origin:0 0}
@keyframes ponteiro{0%{transform:rotate(-30deg)}100%{transform:rotate(18deg)}}
.tela-barra{transform-box:fill-box;transform-origin:0 50%;animation:barra 4s var(--ease) infinite}
@keyframes barra{0%{transform:scaleX(.1)}70%,100%{transform:scaleX(1)}}
.cab-txt{fill:#9E8FE0;font-size:13px;font-weight:700;font-family:var(--sans)}
.cab-mini{fill:#9E8FE0;font-size:11px;font-weight:800;letter-spacing:.12em;font-family:var(--sans)}
.cab-grande{fill:#fff;font-size:22px;font-weight:800;font-family:var(--display);letter-spacing:-.03em}
.seta-pisca path{fill:#3A2A86;transition:fill .15s}
.seta-pisca.on path{animation:seta-on .7s steps(1) infinite}
@keyframes seta-on{0%{fill:var(--ambar)}50%{fill:#3A2A86}}
.chip-flut{position:absolute;display:flex;align-items:center;gap:10px;padding:10px 16px 10px 10px;border-radius:18px;background:#fff;color:var(--tinta);box-shadow:0 20px 40px -18px rgba(22,14,54,.6);font-weight:800;font-size:14px;line-height:1.15;animation:flutua 5s ease-in-out infinite alternate}
.chip-flut small{display:block;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--tinta-2)}
.cf-ico{display:grid;place-items:center;width:34px;height:34px;border-radius:12px;background:var(--verde);color:#fff;font-weight:900}
.cf-ambar{background:var(--ambar);color:var(--tinta);font-family:var(--display)}
.chip-1{left:-4%;top:12%}
.chip-2{right:-2%;top:34%;animation-delay:-2.5s}
@keyframes flutua{to{transform:translateY(-14px) rotate(-1.5deg)}}
.cabine-dica{position:absolute;left:0;right:0;bottom:12px;margin:0;text-align:center;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#9E8FE0}
.so-toque{display:none}
@media (hover:none){.so-mouse{display:none}.so-toque{display:inline}}

/* =========================================================
   TICKER
   ========================================================= */
.ticker{margin-top:28px;overflow:hidden;background:var(--ambar);transform:rotate(-1.2deg);margin-inline:-20px;padding:18px 0;box-shadow:0 16px 30px -20px rgba(22,14,54,.5)}
.ticker-trilho{display:flex;width:max-content;animation:ticker 36s linear infinite}
.ticker.pausado .ticker-trilho{animation-play-state:paused}
.ticker-lista{display:flex;margin:0;padding:0;list-style:none}
.ticker-lista li{display:flex;align-items:center;gap:28px;padding-right:28px;font-family:var(--display);font-weight:700;font-size:clamp(17px,1.8vw,24px);letter-spacing:-.02em;white-space:nowrap}
.ticker-lista li::after{content:"";width:0;height:0;border-left:14px solid var(--tinta);border-top:9px solid transparent;border-bottom:9px solid transparent}
@keyframes ticker{to{transform:translateX(-50%)}}

/* =========================================================
   JORNADA
   ========================================================= */
.jornada{padding:clamp(90px,11vw,150px) var(--gut) clamp(60px,8vw,120px);position:relative}
.jornada-cab{max-width:900px;margin:0 auto clamp(40px,6vw,80px);text-align:center;display:flex;flex-direction:column;align-items:center}
.jornada-cab .titulo-sec{max-width:20ch}
.pista{position:relative;max-width:1180px;margin:0 auto}
.pista-svg{position:absolute;left:0;top:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.pista-borda{fill:none;stroke:#fff;stroke-width:70;stroke-linecap:round;stroke-linejoin:round}
.pista-asfalto{fill:none;stroke:#2A2156;stroke-width:56;stroke-linecap:round;stroke-linejoin:round}
.pista-feito{fill:none;stroke:var(--ultra);stroke-width:56;stroke-linecap:round;stroke-linejoin:round}
.pista-faixa{fill:none;stroke:var(--ambar);stroke-width:3;stroke-dasharray:14 16;stroke-linecap:round}
.marco-c{fill:#fff;stroke:var(--tinta);stroke-width:3;transition:fill .3s}
.marco-t{font-family:var(--display);font-size:13px;font-weight:700;fill:var(--tinta);text-anchor:middle;dominant-baseline:central}
.marco-ok .marco-c{fill:var(--verde);stroke:#fff}
.marco-ok .marco-t{fill:#fff}
.marco-g{transform-box:fill-box;transform-origin:center;transition:transform .5s var(--mola)}
.marco-ok.marco-g{transform:scale(1.25)}
.pista-carro{will-change:transform}
.pista-carro .pisca-e,.pista-carro .pisca-d{opacity:0}
.virando-e .pisca-e,.virando-d .pisca-d{animation:seta-pisca .6s steps(1) infinite}
@keyframes seta-pisca{0%{opacity:1}50%{opacity:0}}
.etapas{position:relative;list-style:none;margin:0;padding:40px 0;display:flex;flex-direction:column;gap:clamp(90px,16vh,170px)}
.etapa{position:relative;width:min(420px,40%);background:#fff;border-radius:var(--raio);padding:30px 30px 26px;box-shadow:0 30px 60px -36px rgba(22,14,54,.45);border:1px solid rgba(22,14,54,.06)}
.etapa:nth-child(even){margin-left:auto}
.etapa-num{display:inline-grid;place-items:center;min-width:48px;height:34px;padding:0 10px;border-radius:999px;background:var(--fundo-2);color:var(--ultra);font-family:var(--display);font-weight:700;font-size:14px;transition:background-color .4s,color .4s}
.etapa h3{font-family:var(--display);font-weight:700;font-size:clamp(21px,2vw,27px);letter-spacing:-.03em;line-height:1.1;margin:16px 0 10px}
.etapa p{margin:0 0 18px;color:var(--tinta-2);font-size:16px}
.etapa-tag{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:800;color:var(--tinta);background:var(--ambar);padding:6px 12px;border-radius:999px}
.etapa-tag::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--tinta)}
.etapa-final{background:var(--tinta);color:#fff}
.etapa-final p{color:#CFC8F0}
.etapa-final .etapa-num{background:var(--verde);color:#fff}
.js .com-pista .etapa{opacity:.5;transform:translateY(30px) scale(.96);transition:opacity .6s var(--ease),transform .7s var(--mola)}
.js .com-pista .etapa.ativa{opacity:1;transform:none}
.js .com-pista .etapa.ativa .etapa-num{background:var(--ultra);color:#fff}
.js .com-pista .etapa-final.ativa .etapa-num{background:var(--verde)}

/* =========================================================
   SIMULADO
   ========================================================= */
.simulado{background:var(--noite);color:#fff;padding:clamp(90px,11vw,150px) var(--gut);position:relative;overflow:hidden}
.simulado::before{content:"";position:absolute;right:-200px;top:-200px;width:600px;height:600px;border-radius:50%;background:radial-gradient(circle,rgba(75,35,232,.5),transparent 65%);pointer-events:none}
.simulado .marca-texto{color:var(--ambar)}
.simulado .sec-intro{color:#CFC8F0}
.sim-cab{max-width:1180px;margin:0 auto clamp(36px,5vw,60px)}
.quiz{position:relative;max-width:1180px;margin:0 auto;background:var(--noite-2);border-radius:clamp(24px,3vw,40px);padding:clamp(22px,3.5vw,48px);border:1px solid rgba(255,255,255,.08)}
.quiz-topo{display:flex;align-items:center;gap:18px;margin-bottom:clamp(24px,3vw,40px);font-weight:800;font-size:14px;letter-spacing:.06em;text-transform:uppercase}
.quiz-cont{white-space:nowrap}
.quiz-pontos{white-space:nowrap;color:var(--verde)}
.quiz-barra{position:relative;flex:1;height:10px;border-radius:10px;background:rgba(255,255,255,.1)}
.quiz-cheio{position:absolute;inset:0;border-radius:inherit;background:linear-gradient(90deg,var(--ultra),var(--verde));transform-origin:0 50%;transform:scaleX(0);transition:transform .7s var(--ease)}
.quiz-carro{position:absolute;left:0;top:50%;width:24px;height:42px;margin:-21px 0 0 -12px;transform:translateX(0) rotate(90deg);transition:transform .7s var(--ease)}
.quiz-corpo{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,5vw,70px);align-items:center}
.quiz-placa{display:grid;place-items:center;aspect-ratio:1;max-width:360px;width:100%;margin:0 auto;border-radius:32px;background:radial-gradient(circle at 50% 40%,rgba(255,255,255,.12),transparent 65%);perspective:800px}
.quiz-placa svg{width:78%;height:auto;filter:drop-shadow(0 24px 30px rgba(0,0,0,.45))}
.placa-entra svg{animation:placa-entra .7s var(--mola)}
@keyframes placa-entra{from{transform:rotateY(-90deg) scale(.7);opacity:0}}
.placa-certa svg{animation:placa-certa .7s var(--mola)}
@keyframes placa-certa{30%{transform:scale(1.12) rotate(-4deg)}60%{transform:scale(.96) rotate(3deg)}}
.placa-errada svg{animation:placa-errada .5s ease}
@keyframes placa-errada{20%,60%{transform:translateX(-14px) rotate(-3deg)}40%,80%{transform:translateX(14px) rotate(3deg)}}
.quiz-perg{font-family:var(--display);font-weight:700;font-size:clamp(22px,2.4vw,32px);letter-spacing:-.03em;line-height:1.15;margin:0 0 22px}
.quiz-opcoes{display:grid;gap:12px}
.opc{display:flex;align-items:center;gap:14px;width:100%;min-height:62px;padding:12px 18px;border-radius:18px;border:2px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04);text-align:left;font-weight:700;font-size:17px;cursor:pointer;transition:transform .35s var(--mola),background-color .25s,border-color .25s}
.opc:hover:not(:disabled){transform:translateX(6px);border-color:var(--ultra-claro);background:rgba(255,255,255,.08)}
.opc-letra{flex:0 0 34px;height:34px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.1);font-family:var(--display);font-size:14px}
.opc:disabled{cursor:default}
.opc.certa{background:var(--verde);border-color:var(--verde);color:var(--tinta);animation:pulo .5s var(--mola)}
.opc.certa .opc-letra{background:rgba(255,255,255,.4)}
.opc.errada{background:var(--vermelho);border-color:var(--vermelho);color:#fff;animation:treme .45s ease}
.opc.apagada{opacity:.45}
@keyframes pulo{40%{transform:scale(1.03)}}
@keyframes treme{20%,60%{transform:translateX(-8px)}40%,80%{transform:translateX(8px)}}
.quiz-feedback{min-height:52px;margin:20px 0 0;font-size:16px;color:#E7E1FF}
.quiz-feedback strong{color:var(--ambar)}
.quiz-prox{margin-top:8px}
.quiz-fim{text-align:center;padding:30px 0 10px}
.quiz-fim-num{font-family:var(--display);font-weight:800;font-size:clamp(80px,12vw,150px);line-height:1;margin:0;letter-spacing:-.06em;color:var(--ambar)}
.quiz-fim-num small{font-size:.35em;color:#CFC8F0;letter-spacing:-.02em}
.quiz-fim h3{font-family:var(--display);font-size:clamp(24px,2.6vw,34px);letter-spacing:-.03em;margin:10px 0 8px}
.quiz-fim p{color:#CFC8F0;max-width:520px;margin:0 auto 26px}
.quiz-fim-acoes{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.quiz-fim:not([hidden]){animation:sobe .7s var(--mola)}
@keyframes sobe{from{opacity:0;transform:translateY(24px)}}
.confete{position:absolute;inset:0;pointer-events:none;overflow:hidden;border-radius:inherit}
.confete i{position:absolute;left:var(--x0);top:var(--y0);width:10px;height:14px;border-radius:3px;background:var(--c);animation:confete 1.1s cubic-bezier(.2,.6,.3,1) forwards}
@keyframes confete{0%{transform:translate(0,0) rotate(0);opacity:1}100%{transform:translate(var(--dx),var(--dy)) rotate(var(--r));opacity:0}}

/* =========================================================
   POR QUE — cartas que empilham
   ========================================================= */
.porque{padding:clamp(90px,11vw,150px) var(--gut) clamp(60px,8vw,100px)}
.porque-cab{max-width:1180px;margin:0 auto clamp(40px,5vw,60px)}
.pilha{max-width:1180px;margin:0 auto;display:flex;flex-direction:column;gap:5vh}
.carta{position:sticky;top:calc(var(--faixa) + 96px + var(--i,0) * 26px);display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-items:center;gap:30px;min-height:min(380px,60vh);padding:clamp(28px,4vw,56px);border-radius:clamp(26px,3vw,40px);transform-origin:50% 0;will-change:transform;box-shadow:0 -10px 40px -20px rgba(22,14,54,.35)}
.carta-1{--i:0;background:var(--ambar)}
.carta-2{--i:1;background:var(--ultra);color:#fff}
.carta-3{--i:2;background:var(--verde)}
.carta-4{--i:3;background:var(--coral)}
.carta-n{font-family:var(--display);font-weight:800;font-size:15px;padding:6px 12px;border-radius:999px;background:rgba(22,14,54,.12)}
.carta-2 .carta-n{background:rgba(255,255,255,.18)}
.carta h3{font-family:var(--display);font-weight:800;font-size:clamp(26px,3.4vw,48px);line-height:1.04;letter-spacing:-.04em;margin:20px 0 14px}
.carta p{margin:0;font-size:clamp(16px,1.4vw,19px);max-width:480px}
.carta-ilu{width:100%;max-width:300px;justify-self:center;overflow:visible}
.ilu-pulso{transform-box:fill-box;transform-origin:center;animation:ilu-pulso 1.6s var(--mola) infinite}
@keyframes ilu-pulso{50%{transform:scale(1.18)}}
.ilu-pedal-2{animation:pedal 2s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 0}
@keyframes pedal{50%{transform:scaleY(.86) translateY(6px)}}
.ilu-baliza{animation:baliza 4s ease-in-out infinite}
@keyframes baliza{0%,15%{transform:translate(-70px,-50px) rotate(0)}55%{transform:translate(-14px,-6px) rotate(-12deg)}80%,100%{transform:translate(0,0) rotate(0)}}
.ilu-coracao{transform-box:fill-box;transform-origin:center;animation:bate 1.4s ease-in-out infinite}
@keyframes bate{10%{transform:scale(1.12)}20%{transform:scale(1)}30%{transform:scale(1.08)}45%{transform:scale(1)}}
.anima-pausa .carta-ilu *{animation-play-state:paused!important}

/* =========================================================
   PACOTES
   ========================================================= */
.pacotes{padding:clamp(80px,10vw,140px) var(--gut);background:#fff;border-radius:clamp(30px,4vw,56px) clamp(30px,4vw,56px) 0 0}
.pac-cab{max-width:1180px;margin:0 auto clamp(36px,5vw,56px)}
.pac-grade{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;perspective:1000px}
.pac{position:relative;cursor:pointer;display:block;transform-style:preserve-3d;will-change:transform}
.pac input{position:absolute;opacity:0;width:1px;height:1px}
.pac-corpo{position:relative;display:flex;flex-direction:column;height:100%;padding:30px 28px 28px;border-radius:var(--raio);background:var(--fundo);border:3px solid transparent;transition:border-color .3s,background-color .3s,transform .5s var(--mola),box-shadow .4s}
.pac:hover .pac-corpo{box-shadow:0 30px 60px -34px rgba(22,14,54,.5)}
.pac input:checked+.pac-corpo{border-color:var(--ultra);background:#fff;box-shadow:0 30px 70px -30px rgba(75,35,232,.55);transform:translateY(-8px)}
.pac input:focus-visible+.pac-corpo{outline:3px solid var(--ambar);outline-offset:4px}
.pac-cat{align-self:flex-start;font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ultra);background:var(--fundo-2);padding:6px 12px;border-radius:999px}
.pac-nome{font-family:var(--display);font-weight:800;font-size:clamp(22px,2.1vw,29px);letter-spacing:-.04em;line-height:1.08;margin:18px 0 18px}
.pac-lista{display:grid;gap:10px;margin-bottom:22px}
.pac-lista span{display:flex;gap:10px;align-items:flex-start;font-size:15.5px;color:var(--tinta-2)}
.pac-lista span::before{content:"";flex:0 0 18px;height:18px;margin-top:3px;border-radius:50%;background:var(--verde) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M5 9.5l2.6 2.5L13 6.5' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat}
.pac-sel{margin-top:auto;display:flex;align-items:center;justify-content:center;min-height:48px;border-radius:999px;border:2px dashed rgba(22,14,54,.2);font-weight:800;font-size:15px;color:var(--tinta-2)}
.pac-sel span::before{content:"Escolher"}
.pac-sel span{font-size:0}
.pac-sel span::before{font-size:15px}
.pac input:checked+.pac-corpo .pac-sel{background:var(--ultra);border:2px solid var(--ultra);color:#fff;animation:pulo .5s var(--mola)}
.pac input:checked+.pac-corpo .pac-sel span::before{content:"Escolhido \2713"}
.pac-destaque .pac-corpo{background:var(--fundo-2)}
.extras{max-width:1180px;margin:28px auto 0;border:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.extras legend{float:left;margin-right:10px;font-weight:800;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--tinta-2)}
.extra{position:relative;cursor:pointer}
.extra input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.extra span{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:999px;border:2px solid rgba(22,14,54,.15);font-weight:700;font-size:15px;transition:background-color .25s,border-color .25s,color .25s,transform .4s var(--mola)}
.extra:hover span{border-color:var(--ultra);transform:translateY(-2px)}
.extra input:checked+span{background:var(--tinta);border-color:var(--tinta);color:var(--ambar)}
.extra input:focus-visible+span{outline:3px solid var(--ambar);outline-offset:3px}

/* =========================================================
   MATRÍCULA
   ========================================================= */
.matricula{background:var(--ultra);color:#fff;padding:clamp(80px,10vw,140px) var(--gut);position:relative;overflow:hidden}
.matricula::before{content:"";position:absolute;left:-160px;bottom:-220px;width:620px;height:620px;border-radius:50%;background:radial-gradient(circle,rgba(255,178,26,.35),transparent 65%);pointer-events:none}
.matricula .marca-texto{color:var(--ambar)}
.matricula .sec-intro{color:#E7E1FF}
.mat-grade{position:relative;max-width:1180px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(30px,6vw,90px);align-items:center}
.mat-form{margin-top:34px;display:grid;gap:20px;max-width:520px}
.campo{display:grid;gap:8px;font-weight:800;font-size:14px;letter-spacing:.04em}
.campo input[type=text]{min-height:56px;padding:0 18px;border-radius:16px;border:2px solid transparent;background:#fff;color:var(--tinta);font-size:17px;font-weight:600;transition:border-color .25s,box-shadow .25s}
.campo input[type=text]::placeholder{color:#8C86A8}
.campo input[type=text]:focus{outline:none;border-color:var(--ambar);box-shadow:0 0 0 4px rgba(255,178,26,.35)}
.seg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:6px;border-radius:18px;background:rgba(22,14,54,.3)}
.seg-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.seg label{position:relative;cursor:pointer}
.seg input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.seg span{display:grid;place-items:center;min-height:46px;border-radius:13px;font-weight:800;font-size:15px;letter-spacing:0;transition:background-color .25s,color .25s,transform .4s var(--mola)}
.seg input:checked+span{background:var(--ambar);color:var(--tinta);transform:scale(1.02)}
.seg input:focus-visible+span{outline:3px solid #fff;outline-offset:2px}
.mat-pacote{margin:0;font-size:15.5px;color:#E7E1FF}
.mat-pacote strong{color:#fff}
.mat-pacote a{color:var(--ambar);font-weight:800;margin-left:6px}
.mat-obs{margin:0;font-size:13.5px;color:#D9D2FF}
.mat-dir{display:grid;place-items:center}
.celular{width:min(330px,100%);border-radius:44px;background:var(--noite);padding:14px;box-shadow:0 40px 80px -30px rgba(10,4,40,.8),inset 0 0 0 2px rgba(255,255,255,.08);transform:rotate(3deg);will-change:transform}
.cel-topo{display:flex;align-items:center;gap:12px;padding:14px 14px 12px;border-radius:32px 32px 10px 10px;background:#2B1C72;color:#fff;line-height:1.15}
.cel-topo small{display:block;font-size:12px;color:var(--verde);font-weight:700}
.cel-avatar{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--ambar)}
.cel-avatar svg{width:22px;height:14px}
.cel-chat{display:flex;flex-direction:column;gap:10px;min-height:340px;padding:18px 12px;border-radius:10px 10px 30px 30px;background:#EFEAFF;color:var(--tinta)}
.bolha{margin:0;max-width:86%;padding:12px 14px;border-radius:18px;font-size:14.5px;line-height:1.45}
.bolha-eles{background:#fff;border-bottom-left-radius:6px;align-self:flex-start}
.bolha-eu{background:#D6F7E6;border-bottom-right-radius:6px;align-self:flex-end;white-space:pre-line}
.bolha-eu.nova{animation:bolha .5s var(--mola)}
@keyframes bolha{from{transform:scale(.6) translateY(20px);opacity:0}}
.digitando{display:none;align-self:flex-end;gap:4px;padding:12px 14px;margin:0;border-radius:18px;background:#D6F7E6}
.digitando.on{display:flex}
.digitando span{width:7px;height:7px;border-radius:50%;background:#3E8A66;animation:dig 1s infinite}
.digitando span:nth-child(2){animation-delay:.15s}
.digitando span:nth-child(3){animation-delay:.3s}
@keyframes dig{0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-5px)}}

/* =========================================================
   DÚVIDAS
   ========================================================= */
.duvidas{padding:clamp(80px,10vw,140px) var(--gut)}
.duv-cab{max-width:900px;margin:0 auto clamp(30px,4vw,50px)}
.faq{max-width:900px;margin:0 auto;display:grid;gap:12px}
.faq details{background:#fff;border-radius:22px;border:1px solid rgba(22,14,54,.07);transition:box-shadow .3s}
.faq details[open]{box-shadow:0 24px 50px -30px rgba(22,14,54,.4)}
.faq summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 24px;cursor:pointer;font-family:var(--display);font-weight:700;font-size:clamp(16px,1.6vw,20px);letter-spacing:-.02em}
.faq summary::-webkit-details-marker{display:none}
.faq-ico{position:relative;flex:0 0 36px;height:36px;border-radius:50%;background:var(--fundo-2);transition:transform .45s var(--mola),background-color .3s}
.faq-ico::before,.faq-ico::after{content:"";position:absolute;left:50%;top:50%;width:14px;height:2.5px;margin:-1.25px 0 0 -7px;border-radius:2px;background:var(--ultra)}
.faq-ico::after{transform:rotate(90deg)}
.faq details[open] .faq-ico{transform:rotate(135deg);background:var(--ambar)}
.faq details[open] .faq-ico::before,.faq details[open] .faq-ico::after{background:var(--tinta)}
.faq details p{margin:0;padding:0 24px 24px;color:var(--tinta-2)}
.faq details[open] p{animation:sobe .45s var(--ease)}

/* =========================================================
   RODAPÉ
   ========================================================= */
.rodape{background:var(--noite);color:#E7E1FF;padding:clamp(70px,9vw,110px) var(--gut) 0;overflow:hidden}
.rodape-grade{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(30px,6vw,80px)}
.rodape-p{margin:0;font-size:17px;max-width:520px}
.rodape-vexa{display:grid;gap:18px;justify-items:start}
.rodape-vexa p{margin:0;font-family:var(--display);font-weight:700;font-size:clamp(22px,2.4vw,32px);letter-spacing:-.03em;line-height:1.1;color:#fff}
.rodape-voltar{font-size:14px;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.3)}
.rodape-voltar:hover{color:var(--ambar);border-color:var(--ambar)}
.rodape-marca{display:flex;align-items:center;justify-content:center;gap:2vw;margin-top:clamp(40px,6vw,70px);font-family:var(--display);font-weight:800;font-size:clamp(90px,22vw,340px);letter-spacing:-.07em;line-height:.8;color:#fff;transform:translateY(12%)}
.rm-seta{width:clamp(40px,7vw,110px);height:auto;fill:none;stroke:var(--ambar);stroke-width:7;stroke-linecap:round;stroke-linejoin:round;animation:piscaE 1.2s steps(1) infinite}
.rm-d{animation-delay:.6s}
.rodape.anima-pausa .rm-seta{animation-play-state:paused}

/* ---------- revelação ---------- */
.js .rv{opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.js .rv.vis{opacity:1;transform:none}

/* =========================================================
   RESPONSIVO
   ========================================================= */
@media (max-width:1060px){
  .topo-nav{display:none}
  .hero-bloco{grid-template-columns:minmax(0,1fr);min-height:0}
  .hero-texto{padding-bottom:10px}
  .cabine-caixa{max-width:520px}
  .quiz-corpo{grid-template-columns:minmax(0,1fr)}
  .quiz-placa{max-width:260px}
  .pac-grade{grid-template-columns:minmax(0,1fr);max-width:560px}
  .extras{max-width:560px}
  .mat-grade{grid-template-columns:minmax(0,1fr)}
  .rodape-grade{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:760px){
  .etapas{gap:56px;padding:20px 0 20px 64px}
  .etapa{width:auto}
  .etapa:nth-child(even){margin-left:0}
  .pista-borda{stroke-width:40}
  .pista-asfalto,.pista-feito{stroke-width:30}
  .pista-faixa{stroke-width:2;stroke-dasharray:8 10}
  .carta{grid-template-columns:minmax(0,1fr);gap:14px;min-height:0;top:calc(var(--faixa) + 80px + var(--i,0) * 16px)}
  .carta-ilu{max-width:150px;justify-self:start;order:-1}
  .carta h3{margin-top:14px}
}
@media (max-width:640px){
  body{font-size:16px}
  .vexa-faixa{gap:10px;font-size:11.5px}
  .vexa-faixa span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .topo{padding:10px 16px}
  .marca-sub{display:none}
  .marca-pisca{width:40px;height:40px}
  .topo-btn{min-height:42px;padding:0 18px}
  .hero{padding:calc(var(--faixa) + 74px) 12px 0}
  .hero-bloco{padding:30px 20px 0;border-radius:26px}
  .hero-titulo{font-size:clamp(34px,10.4vw,48px)}
  .hero-acoes .btn{flex:1 1 auto}
  .chip-flut{font-size:12px;padding:8px 12px 8px 8px}
  .cf-ico{width:28px;height:28px}
  .chip-1{left:0;top:4%}
  .chip-2{right:0;top:30%}
  .etapa{padding:22px 20px}
  .quiz-topo{flex-wrap:wrap;gap:10px 14px}
  .quiz-barra{order:3;flex-basis:100%}
  .opc{font-size:15.5px;min-height:56px}
  .rodape-marca{gap:3vw;font-size:18vw}
  .quiz-placa{max-width:190px}
  .quiz-perg{margin-bottom:16px}
}

/* ---------- movimento reduzido ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .js .hl>span,.js .hero-sub,.js .hero-acoes,.js .selo,.js .cabine-caixa,.js .rv{opacity:1!important;transform:none!important}
  .hero-titulo mark::before{transform:rotate(-2deg) scaleX(1)}
  .js .com-pista .etapa{opacity:1;transform:none}
  .cabine-dica{display:none}
  .ticker-trilho{transform:none}
}