@font-face{font-family:"Schibsted Grotesk";src:url(fonts/schibsted.woff2) format("woff2");font-weight:500 900;font-display:swap}
@font-face{font-family:"Geist";src:url(fonts/geist.woff2) format("woff2");font-weight:400 700;font-display:swap}

:root{
  --janela:#ebebe8; --folha:#f5f5f3; --branco:#fff;
  --tx:#111113; --tx2:#46464c; --tx3:#5c5c63;
  --filete:rgb(17 17 19 / .1); --filete-f:rgb(17 17 19 / .18);
  --noite:#0c0c0d; --n-tx:#f2f2f0; --n-tx2:#b0b0b6; --n-tx3:#92929a;
  --n-filete:rgb(242 242 240 / .14);
  --amarelo:#ffc21a; --amarelo-f:#ffb300; --tinta:#141110;
  --display:"Schibsted Grotesk","Geist",ui-sans-serif,system-ui,sans-serif;
  --corpo:"Geist",ui-sans-serif,system-ui,sans-serif;
  --margem:clamp(22px,4.4vw,64px);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--folha);color:var(--tx);font:400 16px/1.5 var(--corpo);letter-spacing:-.003em;overflow-x:hidden;-webkit-font-smoothing:antialiased}
h1,h2,h3,p,ol{margin:0}
ol{padding:0;list-style:none}
a{color:inherit}
:focus-visible{outline:2px solid var(--tx);outline-offset:2px;border-radius:4px}
.escuro :focus-visible{outline-color:#ffcf4d}
.miolo{width:100%;max-width:calc(1280px + 2 * var(--margem));margin-inline:auto;padding-inline:var(--margem)}
.pular{position:absolute;left:-9999px;top:8px;background:var(--tx);color:#fff;padding:10px 14px;border-radius:10px;z-index:50}
.pular:focus{left:12px}

/* topo */
.topo{position:sticky;top:0;z-index:20;background:rgb(245 245 243 / .82);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid transparent;transition:border-color .2s}
.topo.rolou{border-bottom-color:var(--filete)}
.topo-in{height:72px;display:flex;align-items:center;gap:32px}
.marca{white-space:nowrap;flex:none;display:flex;align-items:center;gap:10px;text-decoration:none;font:750 19px/1 var(--display);letter-spacing:-.025em}
.marca-sinal{width:28px;height:28px;color:var(--tx)}
.topo-nav{display:flex;gap:28px;margin-left:auto;margin-right:8px}
.topo-in{gap:20px}
.topo-nav a{font-size:15px;color:var(--tx2);text-decoration:none;padding:8px 0;background:linear-gradient(var(--tx),var(--tx)) 0 100%/0 2px no-repeat;transition:background-size .2s,color .2s}
.topo-nav a:hover{color:var(--tx);background-size:100% 2px}

.idioma{display:flex;gap:2px;padding:3px;border-radius:10px;background:var(--janela)}
.idioma a{display:grid;place-items:center;min-width:40px;height:34px;padding:0 10px;border-radius:7px;font-size:13px;font-weight:600;letter-spacing:.02em;color:var(--tx2);text-decoration:none;transition:background .15s,color .15s}
.idioma a:hover{color:var(--tx)}
.idioma a[aria-current]{background:var(--branco);color:var(--tx);box-shadow:0 0 0 1px rgb(20 20 24 / .08),0 1px 2px rgb(20 20 24 / .06)}
.btn{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 20px;border-radius:10px;font:600 15px/1 var(--corpo);text-decoration:none;white-space:nowrap;transition:background .18s,transform .12s}
.btn:active{transform:translateY(1px)}
.btn-grafite{background:#18181b;color:#fff}
.btn-grafite:hover{background:#2c2c31}
.btn-acao{background:var(--amarelo);color:var(--tinta);height:52px;padding:0 26px;font-size:16px}
.btn-acao:hover{background:var(--amarelo-f)}

/* herói */
.heroi{padding:clamp(40px,7vw,104px) 0 clamp(56px,8vw,120px)}
.heroi-in{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:center;gap:clamp(24px,4vw,64px)}
h1{font:800 clamp(42px,6.4vw,92px)/1.02 var(--display);letter-spacing:-.045em;text-wrap:balance;max-width:11ch}
.sub{margin-top:clamp(18px,2vw,28px);font-size:clamp(18px,1.6vw,22px);line-height:1.45;color:var(--tx2);max-width:30em;text-wrap:pretty}
.acoes{margin-top:clamp(28px,3vw,40px);display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px}
.estado{display:inline-flex;align-items:center;gap:10px;font-size:15px;font-weight:500;color:var(--tx2)}
.estado i{width:8px;height:8px;border-radius:99px;background:var(--amarelo);box-shadow:0 0 0 4px rgb(255 194 26 / .28)}

.heroi-visual{position:relative;display:grid;place-items:center;min-height:400px}
.disco{position:absolute;width:min(100%,520px);aspect-ratio:1;border-radius:50%;background:var(--janela)}
.celular{position:relative;z-index:1;width:min(100%,300px);aspect-ratio:70.6/146.6;border-radius:46px;padding:7px;background:linear-gradient(145deg,#d9d9d6,#a9a9a6 45%,#cfcfcc);box-shadow:0 0 0 1px rgb(17 17 19 / .22),0 2px 4px rgb(20 20 24 / .06),0 30px 60px -20px rgb(20 20 24 / .4)}
.celular-tela{position:relative;height:100%;border-radius:39px;overflow:hidden;background:#111113;padding:3px}
.celular-tela::before{content:"";position:absolute;inset:0;border-radius:39px;box-shadow:inset 0 0 0 3px #0a0a0b;pointer-events:none;z-index:3}
.ilha{position:absolute;top:12px;left:50%;width:84px;height:24px;margin-left:-42px;border-radius:99px;background:#050505;z-index:4}
.bio{height:100%;border-radius:36px;overflow:hidden;background:#f1efe9;padding:52px 18px 18px;display:flex;flex-direction:column;gap:18px;color:#1c2420}
.bio-topo{text-align:center}
.bio-avatar{width:60px;height:60px;margin:0 auto 10px;border-radius:50%;background:#2f5d50;color:#e9efe9;display:grid;place-items:center;font:750 19px/1 var(--display);letter-spacing:-.02em}
.bio-nome{font:750 18px/1.2 var(--display);letter-spacing:-.025em}
.bio-desc{margin-top:6px;font-size:12px;line-height:1.4;color:#56605b}
.bio-links{display:flex;flex-direction:column;gap:9px}
.bio-link{display:flex;align-items:center;justify-content:center;height:40px;border-radius:99px;background:#fff;box-shadow:0 0 0 1px rgb(28 36 32 / .12);font-size:13px;font-weight:600}
.bio-link-forte{background:#2f5d50;color:#f4f6f2;box-shadow:none}
.bio-nps{margin-top:auto;padding-top:14px;border-top:1px solid rgb(28 36 32 / .12);text-align:center}
.bio-nps-t{font-size:12px;font-weight:600;margin-bottom:9px}
.bio-nps-n{display:flex;justify-content:space-between;gap:2px}
.bio-nps-n b{flex:1;max-width:21px;aspect-ratio:1;border-radius:50%;background:#fff;box-shadow:0 0 0 1px rgb(28 36 32 / .14);display:grid;place-items:center;font:600 8.5px/1 var(--corpo)}
.curto{position:absolute;left:-2%;top:70%;display:flex;align-items:center;gap:8px;padding:10px 14px;border-radius:99px;background:var(--branco);box-shadow:0 0 0 1px rgb(20 20 24 / .07),0 2px 4px rgb(20 20 24 / .05),0 12px 28px -8px rgb(20 20 24 / .18);font:500 13px/1 var(--corpo);z-index:2}
.curto-ponto{width:8px;height:8px;border-radius:50%;background:var(--amarelo)}

/* seções */
.sec{padding:clamp(64px,9vw,136px) 0}
h2{font:780 clamp(30px,3.6vw,52px)/1.06 var(--display);letter-spacing:-.035em;text-wrap:balance}
h2.grande{font-size:clamp(34px,5vw,72px);line-height:1.02;letter-spacing:-.042em;max-width:15ch}
h3{font:750 clamp(19px,1.7vw,22px)/1.25 var(--display);letter-spacing:-.02em}
.apoio{margin-top:16px;font-size:17px;line-height:1.55;color:var(--tx2);max-width:28em;text-wrap:pretty}

.quem{padding-top:clamp(24px,4vw,56px)}
.quem-texto{font:600 clamp(24px,3.3vw,44px)/1.22 var(--display);letter-spacing:-.03em;max-width:26em;text-wrap:pretty}

.duas{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(32px,6vw,96px);align-items:start}
.duas-t{position:sticky;top:112px}
.lista li{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:8px 40px;padding:28px 0;border-top:1px solid var(--filete-f)}
.lista li:last-child{border-bottom:1px solid var(--filete-f)}
.lista p{color:var(--tx2);max-width:34em}

.escuro{background:var(--noite);color:var(--n-tx)}
.clique h2.grande{margin-bottom:clamp(48px,6vw,88px)}
.trilho{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 clamp(24px,4vw,56px)}
.trilho li{position:relative;padding-top:44px}
.trilho li::before{content:"";position:absolute;top:6px;left:0;right:calc(-1 * clamp(24px,4vw,56px));height:2px;background:var(--n-filete)}
.trilho li:last-child::before{display:none}
.est{position:absolute;top:0;left:0;width:14px;height:14px;border-radius:50%;background:var(--noite);box-shadow:inset 0 0 0 2px var(--n-tx2)}
.trilho li:first-child .est{background:var(--n-tx2)}
.trilho .fim .est{background:var(--amarelo);box-shadow:0 0 0 5px rgb(255 197 51 / .22)}
.trilho h3{color:var(--n-tx)}
.trilho p{margin-top:8px;color:var(--n-tx2);max-width:24em}
.notas{margin-top:clamp(56px,7vw,104px);padding-top:28px;border-top:1px solid var(--n-filete);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px clamp(24px,4vw,56px);color:var(--n-tx2);font-size:17px;line-height:1.55}
.notas p{max-width:32em}

.publico h2{max-width:14em}
.colunas{margin-top:clamp(36px,5vw,64px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.colunas>div{padding:0 clamp(20px,3vw,44px);border-left:1px solid var(--filete-f)}
.colunas>div:first-child{padding-left:0;border-left:0}
.colunas>div:last-child{padding-right:0}
.colunas p{margin-top:10px;color:var(--tx2);max-width:24em}

.contato-in{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,5vw,80px);align-items:end}
.contato .apoio{color:var(--n-tx2)}
.email{justify-self:end;font:780 clamp(24px,2.9vw,42px)/1.1 var(--display);letter-spacing:-.035em;text-decoration:none;text-align:right;padding-bottom:6px;background:linear-gradient(var(--amarelo),var(--amarelo)) 0 100%/100% 3px no-repeat;transition:background-size .25s,color .25s}
.email:hover{background-size:100% 100%;color:var(--tinta)}

.pe{background:var(--noite);color:var(--n-tx3);font-size:14px;border-top:1px solid var(--n-filete)}
.pe-in{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;padding-block:24px}

@media (prefers-reduced-motion:no-preference){
  .heroi-texto>*,.heroi-visual{animation:entra .7s cubic-bezier(.2,.7,.2,1) backwards}
  .heroi-texto .sub{animation-delay:.08s}.heroi-texto .acoes{animation-delay:.16s}.heroi-visual{animation-delay:.12s}
}
@keyframes entra{from{opacity:0;transform:translateY(14px)}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

@media (max-width:1023px){
  .topo-nav{display:none}
  .idioma{margin-left:auto}
  .heroi-in{grid-template-columns:1fr;gap:56px}
  h1{max-width:12ch}
  .duas{grid-template-columns:1fr}
  .duas-t{position:static}
  .contato-in{grid-template-columns:1fr;align-items:start}
  .email{justify-self:start;text-align:left}
}
@media (max-width:719px){
  .topo-in{height:64px;gap:10px}
  .idioma a{min-width:32px;height:32px;padding:0 6px}
  .marca{font-size:17px;gap:8px}
  .marca-sinal{width:24px;height:24px}
  .topo-in .btn{height:40px}
  .topo-in .btn{padding:0 14px}
  .lista li{grid-template-columns:1fr}
  .trilho{grid-template-columns:1fr;gap:32px}
  .trilho li{padding:0 0 0 40px}
  .trilho li::before{display:block;top:20px;bottom:-32px;left:6px;right:auto;width:2px;height:auto}
  .trilho li:last-child::before{display:none}
  .est{top:4px}
  .notas{grid-template-columns:1fr}
  .colunas{grid-template-columns:1fr;gap:28px}
  .colunas>div,.colunas>div:last-child{padding:24px 0 0;border-left:0;border-top:1px solid var(--filete-f)}
  .colunas>div:first-child{border-top:0;padding-top:0}
  .curto{left:0;top:70%}
  .heroi-visual{min-height:0;padding-block:8px}
  .disco{width:min(100%,380px)}
  .btn-acao{width:100%}
  .email{font-size:clamp(22px,7vw,32px)}
}