@font-face{font-family:Sora;src:url(/fonte/sora.woff2) format('woff2');font-weight:100 800;font-display:swap}

:root{
  --noite:#060a1a;--noite2:#0a1230;--azul:#3557ff;--azul2:#8ea6ff;
  --ouro1:#fff3c4;--ouro2:#ffd975;--ouro3:#f3b53a;
  --texto:#eef1ff;--claro:#dfe5ff;--suave:#b3bde2;
  --linha:rgba(142,166,255,.16);--borda-ouro:rgba(244,207,115,.34);
  --gut:clamp(16px,4vw,40px);--raio:22px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:88px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{background:var(--noite);color:var(--texto);font:400 17px/1.6 Sora,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
img,video{display:block;max-width:100%;height:auto}
ul{list-style:none}
a{color:var(--ouro2)}
a:focus-visible,video:focus-visible{outline:3px solid var(--ouro2);outline-offset:3px;border-radius:8px}

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

b{font-weight:inherit;color:var(--ouro2)}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  b{background:linear-gradient(180deg,var(--ouro1) 0%,var(--ouro2) 42%,var(--ouro3) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
}

h1,h2,.resposta{font-weight:700;letter-spacing:-.028em;line-height:1.1;text-wrap:balance}
h2{font-size:clamp(30px,3.9vw,46px)}
h3{font-size:18px;line-height:1.35;font-weight:700;letter-spacing:-.01em}
.kicker{color:var(--ouro2);font-size:13.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;margin-bottom:12px}
.lead{color:var(--claro);font-size:clamp(17px,1.5vw,19px);margin-top:16px}
.nota{color:var(--suave);font-size:15px;margin-top:12px}

/* botões */
.btn{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;min-height:54px;padding:0 30px;border-radius:999px;background:linear-gradient(180deg,var(--ouro1) 0%,var(--ouro2) 34%,var(--ouro3) 100%);color:#1a1204;font-weight:700;font-size:17px;letter-spacing:-.01em;text-decoration:none;box-shadow:0 14px 34px rgba(243,181,58,.24);transition:transform .15s ease,box-shadow .15s ease}
.btn:hover{transform:translateY(-1px);box-shadow:0 18px 42px rgba(243,181,58,.34)}
.btn-peq{min-height:44px;padding:0 20px;font-size:14.5px;box-shadow:none}
.btn-gde{min-height:62px;padding:0 42px;font-size:19px;margin-top:30px}
.btn-sec{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;min-height:54px;padding:0 26px;border-radius:999px;border:1px solid var(--borda-ouro);color:var(--texto);font-weight:600;font-size:16px;text-decoration:none;background:rgba(19,36,107,.4);transition:background .15s ease}
.btn-sec:hover{background:rgba(19,36,107,.75)}
@media (prefers-reduced-motion:reduce){.btn,.btn-sec{transition:none}.btn:hover{transform:none}}

/* topo */
.topo{position:sticky;top:0;z-index:20;background:rgba(6,10,26,.86);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--linha)}
.topo-in{display:flex;align-items:center;justify-content:space-between;gap:12px;height:68px}
.marca{display:flex;align-items:center;gap:6px;min-height:44px;text-decoration:none;flex:none}
.marca img{width:44px;height:44px}
.marca img.palavra{width:auto;height:28px}

/* herói */
.heroi{position:relative;overflow:hidden;background:linear-gradient(170deg,#0c1538 0%,#080d24 56%,var(--noite) 100%)}
.heroi::before{content:'';position:absolute;left:-340px;top:-520px;width:1200px;height:1200px;border-radius:50%;background:radial-gradient(closest-side,rgba(53,87,255,.32),rgba(53,87,255,0));pointer-events:none}
.heroi::after{content:'';position:absolute;inset:0;background-image:radial-gradient(rgba(142,166,255,.16) 1.2px,transparent 1.4px);background-size:34px 34px;-webkit-mask-image:radial-gradient(ellipse 70% 70% at 30% 40%,#000 10%,transparent 100%);mask-image:radial-gradient(ellipse 70% 70% at 30% 40%,#000 10%,transparent 100%);opacity:.5;pointer-events:none}
.heroi-in{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);align-items:center;gap:clamp(36px,5vw,72px);padding-block:clamp(44px,7vw,96px) clamp(72px,8vw,112px)}
h1{font-size:clamp(38px,5vw,62px)}
.resposta{font-size:clamp(32px,4vw,50px);margin-top:18px}
.resposta b{display:block;width:fit-content;font-size:2em;line-height:1;font-weight:800;letter-spacing:-.04em;margin-top:2px;padding-bottom:.08em}
.sub{color:var(--claro);font-size:clamp(18px,1.6vw,20px);margin-top:22px;max-width:30em}
.acoes{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.heroi-midia{position:relative;padding-right:9%;padding-bottom:7%}
.heroi-midia .fone-sobre{position:absolute;right:0;bottom:-8%;width:27%;margin:0}

/* molduras das telas */
.tela{border-radius:var(--raio);overflow:hidden;border:1px solid var(--borda-ouro);background:var(--noite);box-shadow:0 34px 70px rgba(0,0,0,.55),0 0 70px rgba(53,87,255,.14)}
.tela img{width:100%}
.fone{width:min(100%,300px);margin-inline:auto;padding:7px;border-radius:38px;background:#04060e;box-shadow:0 0 0 1px rgba(244,207,115,.5),0 34px 70px rgba(0,0,0,.55),0 0 70px rgba(53,87,255,.16)}
.fone img{width:100%;border-radius:31px}
.heroi-midia .fone{padding:clamp(3px,.5vw,6px);border-radius:clamp(16px,2.4vw,30px)}
.heroi-midia .fone img{border-radius:clamp(13px,2vw,25px)}

/* seis apps e vídeo */
.um-so{border-top:1px solid var(--linha);background:var(--noite2)}
.um-so-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,400px);align-items:center;gap:clamp(36px,6vw,88px);padding-block:clamp(56px,7vw,96px)}
.seis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:30px}
.seis li{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:16px;border:1px solid var(--linha);border-radius:16px;background:rgba(19,36,107,.28);font-size:15px;font-weight:600;line-height:1.3}
.seis svg{width:28px;height:28px;color:var(--azul2);fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.video video{width:100%;border-radius:var(--raio);border:1px solid var(--borda-ouro);background:var(--noite);box-shadow:0 34px 70px rgba(0,0,0,.55)}

/* recursos */
.recurso-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.14fr);align-items:center;gap:clamp(32px,6vw,88px);padding-block:clamp(48px,6.5vw,88px)}
.recurso+.recurso{border-top:1px solid var(--linha)}
.recurso:nth-of-type(even) .midia{order:-1}
.recurso:nth-of-type(even) .recurso-in{grid-template-columns:minmax(0,1.14fr) minmax(0,1fr)}
.lista{margin-top:20px;display:grid;gap:10px}
.lista li{position:relative;padding-left:22px;color:var(--suave);font-size:16px;line-height:1.5}
.lista li::before{content:'';position:absolute;left:0;top:.56em;width:8px;height:8px;border-radius:50%;background:var(--ouro3)}
.obs{margin-top:18px;padding:12px 14px;border-left:2px solid var(--borda-ouro);color:var(--suave);font-size:14.5px;line-height:1.5}

/* blocos em cartões */
.bloco{border-top:1px solid var(--linha);padding-block:clamp(52px,6.5vw,88px)}
.grade{display:grid;gap:14px;margin-top:28px}
.grade-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grade-5{grid-template-columns:repeat(5,minmax(0,1fr))}
.cartao{padding:22px;border:1px solid var(--linha);border-radius:18px;background:var(--noite2)}
.cartao p{color:var(--suave);font-size:15.5px;line-height:1.5;margin-top:6px}
.mais{margin-top:20px;font-size:15.5px}

/* fim */
.fim{position:relative;overflow:hidden;text-align:center;border-top:1px solid var(--linha);padding-block:clamp(64px,9vw,124px);background:radial-gradient(ellipse 70% 90% at 50% 0%,rgba(53,87,255,.24),rgba(53,87,255,0)),var(--noite)}
.fim-marca{width:84px;height:84px;margin-inline:auto;margin-bottom:18px}
.fim h2{font-size:clamp(34px,4.6vw,56px)}
.contato{color:var(--suave);font-size:15.5px;margin-top:32px}
.contato a{overflow-wrap:anywhere}

/* rodapé */
.rodape{border-top:1px solid var(--linha);padding-block:26px}
.rodape-in{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 24px;color:var(--suave);font-size:14px}
.rodape nav{display:flex;flex-wrap:wrap;gap:4px 20px}
.rodape a{color:var(--claro);display:inline-block;padding-block:10px}

/* telas médias */
@media (max-width:1040px){
  .grade-5{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* celular e tablet em pé */
@media (max-width:860px){
  .heroi-in,.um-so-in,.recurso-in,.recurso:nth-of-type(even) .recurso-in{grid-template-columns:minmax(0,1fr)}
  .recurso:nth-of-type(even) .midia{order:0}
  .um-so-in .video{max-width:420px;width:100%;margin-inline:auto}
  .heroi-midia{padding-right:7%}
}

@media (max-width:520px){
  body{font-size:16px}
  .acoes .btn,.acoes .btn-sec{width:100%}
  .grade-2{grid-template-columns:minmax(0,1fr)}
  .grade-5{grid-template-columns:repeat(2,minmax(0,1fr))}
  .plataformas .cartao:last-child{grid-column:1/-1}
  .fone{width:min(78%,300px)}
  .marca img{width:38px;height:38px}
  .marca img.palavra{height:23px}
  .btn-peq{padding:0 16px;font-size:14px}
  .cartao{padding:18px}
  .btn-gde{width:100%;padding-inline:20px}
}

@media (max-width:360px){
  .btn-peq{padding:0 13px;font-size:13px}
  .marca img{width:32px;height:32px}
  .marca img.palavra{height:20px}
  .seis{grid-template-columns:repeat(2,minmax(0,1fr))}
}
