/* Crisoft */
@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Nunito+Sans:wght@400;500;600;700;800;900&display=swap');

:root{--azul:#087df5;--ciano:#39d6ff;--marinho:#031329;--tinta:#102039;--cinza:#556a83;--branco:#f7fbff}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--branco)}
body{margin:0;min-width:320px;overflow-x:hidden;color:var(--tinta);font-family:'Nunito Sans',Arial,sans-serif}
.skip-link{position:fixed;z-index:20;top:-60px;left:18px;padding:12px 18px;border-radius:6px;background:white;color:var(--marinho);font-weight:800}
.skip-link:focus{top:18px}
.hero{min-height:790px;height:min(1000px,100svh);position:relative;isolation:isolate;overflow:hidden;color:#fff;background:radial-gradient(ellipse at 50% 45%,#0c3572 0,#071e41 45%,#031329 100%)}
.hero__cena{position:absolute;z-index:-3;inset:31% 0 0;overflow:hidden}
.hero__cena img{width:100%;height:100%;display:block;object-fit:cover;object-position:center 46%;animation:cena-chega 1.4s ease-out both,cena-respira 18s 1.4s ease-in-out infinite alternate;transform-origin:center 70%;translate:var(--deslocamento-x,0) var(--deslocamento-y,0)}
.hero__filtro{position:absolute;z-index:-2;inset:0;background:linear-gradient(180deg,#031329 0%,rgba(3,19,41,.96) 22%,rgba(3,19,41,.82) 42%,rgba(3,19,41,.08) 66%,rgba(2,12,27,.38) 100%),linear-gradient(90deg,rgba(3,19,41,.52),transparent 55%,rgba(3,19,41,.15))}
.hero__estrelas{position:absolute;z-index:-1;inset:0;pointer-events:none;opacity:.6;background-image:radial-gradient(2px 2px at 8% 13%,#fff 50%,transparent 100%),radial-gradient(1px 1px at 22% 28%,#58dfff 50%,transparent 100%),radial-gradient(2px 2px at 71% 11%,#8beaff 50%,transparent 100%),radial-gradient(1px 1px at 91% 33%,#fff 50%,transparent 100%),radial-gradient(1px 1px at 57% 19%,#6daaff 50%,transparent 100%),radial-gradient(2px 2px at 39% 8%,#fff 50%,transparent 100%);background-size:340px 280px;animation:estrelas-descem 48s linear infinite}
.hero__conteudo{width:min(1190px,calc(100% - 52px));height:100%;margin:auto;position:relative;display:flex;flex-direction:column}
.topo{height:110px;flex:0 0 110px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(131,200,255,.2)}
.marca{width:216px;height:68px;padding:5px 11px;position:relative;display:flex;align-items:center;overflow:hidden;border:1px solid rgba(255,255,255,.78);border-radius:8px;background:linear-gradient(120deg,#fff,#eff7ff);box-shadow:0 9px 35px rgba(0,0,0,.27)}
.marca::after{content:"";position:absolute;top:-80%;left:-40%;width:22px;height:260%;transform:rotate(25deg);background:rgba(255,255,255,.9);filter:blur(3px);animation:logo-brilho 7s ease-in-out infinite}
.marca img{display:block;width:100%;height:auto}
.status{display:flex;align-items:center;gap:10px;color:#c9e6ff;font:500 9px 'DM Mono',monospace;letter-spacing:.13em}
.status i{width:7px;height:7px;border-radius:50%;background:#5cffc7;box-shadow:0 0 13px #5cffc7;animation:pulsa 1.8s ease-in-out infinite}
.mensagem{position:relative;z-index:2;width:min(760px,100%);margin:auto;text-align:center;padding:34px 0 14px;animation:mensagem-entra .8s .12s ease both}
.sobretitulo{display:flex;align-items:center;justify-content:center;gap:9px;margin:0 0 16px;color:#8edfff;font:500 9px 'DM Mono',monospace;letter-spacing:.18em}
.sobretitulo span{width:20px;height:2px;background:var(--ciano);box-shadow:0 0 12px var(--ciano)}
.mensagem h1{margin:0;font-size:clamp(44px,6.1vw,76px);line-height:.99;letter-spacing:-.052em;font-weight:800;text-shadow:0 3px 35px rgba(0,0,0,.25)}
.mensagem h1 strong{display:block;color:#22c4ff;text-shadow:0 0 28px rgba(21,164,255,.3)}
.apresentacao{max-width:650px;margin:20px auto 23px;color:#d0e2f5;font-size:16px;line-height:1.57;text-shadow:0 2px 12px #031329}
.botao{width:248px;height:54px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:0 7px 0 20px;color:#fff;text-decoration:none;border:1px solid rgba(141,233,255,.77);border-radius:40px;background:linear-gradient(100deg,#087df5,#0cacf4);box-shadow:0 0 0 4px rgba(32,169,255,.11),0 12px 30px rgba(0,89,255,.35);font:700 10px 'DM Mono',monospace;letter-spacing:.11em;transition:transform .2s,box-shadow .2s}
.botao:hover{transform:translateY(-3px);box-shadow:0 0 0 5px rgba(32,169,255,.17),0 14px 40px rgba(0,122,255,.5)}
.botao b{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;color:#0679d9;background:#fff;font-size:18px;transition:transform .25s}
.botao:hover b{transform:rotate(45deg)}
.sinal{width:min(440px,90%);margin:26px auto 0}
.sinal span{display:block;margin-bottom:9px;color:#b2cce8;font:500 8px 'DM Mono',monospace;letter-spacing:.17em}
.sinal>i{height:5px;display:block;position:relative;overflow:hidden;border:1px solid rgba(112,213,255,.58);border-radius:10px;background:rgba(0,14,35,.58);box-shadow:0 0 17px rgba(10,170,255,.19)}
.sinal>i b{position:absolute;inset:0 auto 0 0;width:38%;border-radius:8px;background:linear-gradient(90deg,#087df5,#36e3ff);box-shadow:0 0 16px #22cfff;animation:varredura 3.2s ease-in-out infinite alternate}
.cena-legenda{height:40px;display:flex;align-items:center;justify-content:center;gap:14px;color:#ccecff;font:500 8px 'DM Mono',monospace;letter-spacing:.16em;text-shadow:0 2px 8px #00152c}
.cena-legenda i{height:1px;width:33px;background:#50d7ff;box-shadow:0 0 10px #50d7ff}
.sobre{padding:28px 24px 36px;text-align:center;background:linear-gradient(180deg,#f7fbff,#eaf6ff)}
.obrigado{margin:0 0 5px;color:#55708d;font-size:13px}
.sobre h2{margin:0 0 22px;color:#132844;font-size:clamp(21px,3vw,30px);line-height:1.2;letter-spacing:-.025em}
.sobre h2 em{color:#087df5;font-style:normal}
.cartoes{width:min(960px,100%);margin:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.cartao{min-height:160px;padding:16px 21px 14px;position:relative;overflow:hidden;border:1px solid #dceafa;border-radius:12px;background:rgba(255,255,255,.91);box-shadow:0 7px 22px rgba(38,91,141,.07);transition:transform .25s,box-shadow .25s}
.cartao:hover{transform:translateY(-5px);box-shadow:0 14px 30px rgba(35,117,190,.15)}
.cartao__icone{width:39px;height:39px;margin:0 auto 5px;display:grid;place-items:center;border-radius:50%;background:#e7f4ff;color:#087df5;font-size:25px;font-weight:800;box-shadow:0 0 20px rgba(0,125,245,.14)}
.cartao__icone--ideia{color:#f28b20;background:#fff3dd}.cartao__icone--pessoas{color:#6755ed;background:#efedff}
.cartao h3{margin:2px 0 3px;color:#132844;font-size:17px;font-weight:800}
.cartao p{max-width:255px;margin:0 auto;color:#61758e;font-size:12px;line-height:1.45}
.cartao>i{width:41px;height:3px;margin:10px auto 0;display:block;border-radius:4px;background:linear-gradient(90deg,#168bff,#16c9ed)}
.rodape{color:#abc0d7;background:#06162c;border-top:1px solid rgba(112,194,248,.2)}
.rodape__inner{width:min(1190px,calc(100% - 48px));min-height:58px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.rodape p,.rodape a{margin:0;color:#bdd1e4;text-decoration:none;font:500 8px 'DM Mono',monospace;letter-spacing:.07em}.rodape p span{color:#29c4ed}.rodape a:hover{color:#4ce3ff}
@keyframes pulsa{50%{opacity:.36;transform:scale(.72)}}@keyframes varredura{0%{left:0;width:23%}100%{left:77%;width:23%}}@keyframes logo-brilho{0%,70%{left:-40%}88%,100%{left:130%}}@keyframes estrelas-descem{to{background-position:0 560px}}@keyframes cena-chega{from{opacity:.45;transform:scale(1.06)}to{opacity:1;transform:scale(1)}}@keyframes cena-respira{to{transform:scale(1.025)}}@keyframes mensagem-entra{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:720px){.hero{height:auto;min-height:980px}.hero__cena{inset:48% 0 0}.hero__cena img{object-position:54% center}.hero__filtro{background:linear-gradient(180deg,#031329 0%,rgba(3,19,41,.98) 32%,rgba(3,19,41,.77) 52%,rgba(3,19,41,.08) 80%,rgba(2,12,27,.5) 100%),linear-gradient(90deg,rgba(3,19,41,.38),transparent)}.hero__conteudo{width:calc(100% - 36px)}.topo{height:86px;flex-basis:86px}.marca{width:168px;height:55px;padding:4px 8px}.status{max-width:144px;font-size:7px;line-height:1.5;letter-spacing:.07em}.mensagem{margin:45px auto 0;padding:0 0 15px}.sobretitulo{font-size:7px;letter-spacing:.12em}.mensagem h1{font-size:clamp(39px,10.8vw,55px)}.apresentacao{max-width:430px;margin:17px auto 19px;font-size:14px}.botao{height:49px}.sinal{margin-top:23px}.hero__cena{inset:49% -25% 0}.hero__cena img{width:150%;max-width:none;transform:translateX(-16%);object-position:center center;animation:cena-chega-mobile 1.2s ease-out both}.cena-legenda{height:36px;gap:8px;font-size:6px;letter-spacing:.1em}.cena-legenda i{width:20px}.sobre{padding:24px 18px 27px}.obrigado{font-size:12px}.sobre h2{max-width:460px;margin:0 auto 16px;font-size:22px}.cartoes{grid-template-columns:1fr;gap:9px;max-width:480px}.cartao{min-height:0;padding:12px 14px;display:grid;grid-template-columns:42px 1fr;grid-template-rows:auto auto;column-gap:11px;text-align:left;align-items:center}.cartao__icone{grid-row:1/3;margin:0;width:38px;height:38px}.cartao h3{align-self:end;margin:0;font-size:15px}.cartao p{max-width:none;margin:0;align-self:start;font-size:11px}.cartao>i{display:none}.rodape__inner{width:calc(100% - 36px);padding:13px 0;display:grid;gap:9px}.rodape p,.rodape a{font-size:7px}}
@keyframes cena-chega-mobile{from{opacity:.45;transform:translateX(-16%) scale(1.05)}to{opacity:1;transform:translateX(-16%) scale(1)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}
.mensagem{translate:0 -34px}
.mensagem::before{content:"";position:absolute;z-index:-1;inset:-24px -110px;background:radial-gradient(ellipse at center,rgba(3,19,41,.86) 0%,rgba(3,19,41,.6) 48%,transparent 76%);filter:blur(10px);pointer-events:none}
@media(max-width:720px){.mensagem{translate:0 0}.mensagem::before{inset:-18px -20px}}
.topo{width:100vw;position:relative;left:50%;transform:translateX(-50%);padding:0 max(20px,calc((100vw - 1190px)/2));height:112px;flex-basis:112px;border:0;border-bottom:3px solid #1188f4;background:linear-gradient(90deg,#fff,#f7fbff)}
.topo__inner{width:min(1190px,100%);height:100%;margin:auto;display:flex;align-items:center;justify-content:space-between}
.marca{width:292px;height:102px;padding:2px 12px;border:0;border-radius:0;background:transparent;box-shadow:none}
.marca::after{display:none}
.marca img{max-height:100%;object-fit:contain}
.topo .status{color:#294967}
.topo .status i{background:#0a94ef;box-shadow:0 0 10px rgba(10,148,239,.65)}
.experimento{position:relative;overflow:hidden;padding:76px max(24px,calc((100% - 1120px)/2)) 82px;color:#f5faff;background:radial-gradient(ellipse at 16% 14%,rgba(14,128,245,.22),transparent 39%),radial-gradient(ellipse at 92% 82%,rgba(15,199,230,.13),transparent 34%),linear-gradient(130deg,#06152b,#092246 58%,#06152b)}
.experimento::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.15;background-image:linear-gradient(rgba(104,186,255,.24) 1px,transparent 1px),linear-gradient(90deg,rgba(104,186,255,.24) 1px,transparent 1px);background-size:45px 45px;mask-image:linear-gradient(115deg,#000,transparent 70%)}
.experimento__intro,.experimento__painel{position:relative;z-index:1}
.experimento__intro{max-width:660px;margin:0 auto 30px;text-align:center}
.experimento__rotulo{display:flex;align-items:center;justify-content:center;gap:9px;margin:0 0 13px;color:#81deff;font:500 9px 'DM Mono',monospace;letter-spacing:.15em}
.experimento__rotulo span{width:18px;height:2px;background:#20c6f4;box-shadow:0 0 10px #20c6f4}
.experimento__intro h2{margin:0;font-size:clamp(34px,4vw,49px);line-height:1.04;letter-spacing:-.04em}
.experimento__intro h2 em{color:#25c7ff;font-style:normal}
.experimento__intro>p:last-child{max-width:550px;margin:13px auto 0;color:#b4c9df;font-size:14px;line-height:1.6}
.experimento__painel{width:min(960px,100%);margin:auto;display:grid;grid-template-columns:1fr .9fr;column-gap:36px;row-gap:16px;padding:28px 32px 18px;border:1px solid rgba(100,192,255,.33);border-radius:17px;background:linear-gradient(130deg,rgba(11,34,67,.93),rgba(5,20,42,.96));box-shadow:0 25px 75px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.04)}
.queda{min-height:310px;position:relative;display:grid;grid-template-columns:49px 1fr;align-items:stretch;padding:14px 18px 42px 2px;border-right:1px solid rgba(118,184,231,.18)}
.queda__marcadores{display:flex;flex-direction:column;justify-content:space-between;padding:4px 0 5px;color:#7f9fbe;font:9px 'DM Mono',monospace}
.queda__trilho{position:relative;width:102px;height:100%;min-height:230px;margin:0 auto;border-left:1px solid rgba(89,193,255,.6);border-right:1px solid rgba(89,193,255,.25);background:linear-gradient(90deg,rgba(35,138,230,.03),rgba(50,155,240,.11),rgba(35,138,230,.02))}
.queda__trilho::before,.queda__trilho::after{content:"";position:absolute;left:-6px;width:112px;height:1px;background:rgba(107,210,255,.5)}
.queda__trilho::before{top:0}.queda__trilho::after{bottom:0}
.queda__rastro{position:absolute;left:50%;top:0;bottom:0;width:1px;background:repeating-linear-gradient(to bottom,rgba(93,199,255,.23) 0 4px,transparent 4px 9px)}
.queda__bola{position:absolute;z-index:2;left:50%;top:0;width:28px;height:28px;margin-left:-14px;border:1px solid rgba(255,255,255,.83);border-radius:50%;background:radial-gradient(circle at 31% 26%,#fff,#54dcff 28%,#087df5 67%,#064990);box-shadow:0 0 0 5px rgba(26,179,255,.12),0 0 24px rgba(24,195,255,.9)}
.queda__chao{position:absolute;left:50px;right:18px;bottom:40px;height:14px;display:flex;align-items:flex-end;justify-content:space-between}
.queda__chao span{width:1px;height:7px;background:#42bfff;box-shadow:0 0 7px #42bfff}.queda__chao span:nth-child(2n){height:12px}
.queda>p{position:absolute;left:50px;right:18px;bottom:0;margin:0;display:flex;justify-content:space-between;color:#7794b3;font:8px 'DM Mono',monospace;letter-spacing:.1em}
.queda>p b{color:#dcefff;font-weight:500}
.controles{display:flex;flex-direction:column;align-items:stretch;padding:8px 3px}
.controles>label,.controle__titulo label{color:#94afca;font:500 9px 'DM Mono',monospace;letter-spacing:.1em}
.controles select{width:100%;height:43px;margin:9px 0 20px;padding:0 12px;color:#f2f8ff;border:1px solid rgba(100,187,241,.35);border-radius:7px;background:#0c284a;font:600 13px 'Nunito Sans',Arial,sans-serif}
.controles select:focus-visible,.controles input:focus-visible,.botao-queda:focus-visible{outline:3px solid #6de9ff;outline-offset:3px}
.controle__titulo{display:flex;align-items:center;justify-content:space-between;gap:12px}
.controle__titulo output{color:#54dcff;font:500 12px 'DM Mono',monospace}
.controles input[type=range]{width:100%;height:5px;margin:14px 0 7px;accent-color:#21c5f4;cursor:pointer}
.controle__limites{display:flex;justify-content:space-between;color:#7894b1;font:8px 'DM Mono',monospace}
.botao-queda{width:100%;height:47px;margin:21px 0 17px;display:flex;align-items:center;justify-content:space-between;padding:0 8px 0 16px;color:white;border:1px solid rgba(90,223,255,.7);border-radius:7px;background:linear-gradient(95deg,#087df5,#0ca7df);box-shadow:0 7px 21px rgba(0,115,230,.23);font:700 10px 'DM Mono',monospace;letter-spacing:.1em;cursor:pointer;transition:transform .2s,filter .2s,box-shadow .2s}
.botao-queda:hover{transform:translateY(-2px);filter:brightness(1.11);box-shadow:0 10px 26px rgba(0,150,255,.37)}
.botao-queda b{width:31px;height:31px;display:grid;place-items:center;color:#0878df;border-radius:5px;background:white;font-size:17px}
.resultados{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.resultados>div{padding:11px 12px;border:1px solid rgba(105,179,231,.19);border-radius:7px;background:rgba(3,15,32,.39)}
.resultados span{display:block;color:#829db9;font:8px 'DM Mono',monospace;letter-spacing:.055em}
.resultados b{display:block;margin-top:6px;color:#53dcff;font:600 18px 'Nunito Sans',Arial,sans-serif}
.queda__status{min-height:18px;margin:10px 0 0;color:#b8cde2;font-size:10px}
.experimento__nota{grid-column:1/-1;margin:0;padding-top:12px;color:#7f9ab5;border-top:1px solid rgba(118,184,231,.14);font-size:10px;text-align:center}
.experimento__nota span{margin-right:8px;color:#55d8ff;font:500 10px 'DM Mono',monospace}
@media(max-width:720px){.topo{height:86px;flex-basis:86px;padding-inline:18px}.marca{width:200px;height:74px;padding:1px 8px}.topo__inner{width:100%}.status{max-width:116px;font-size:6px}.experimento{padding:57px 18px 60px}.experimento__intro{margin-bottom:22px}.experimento__intro h2{font-size:36px}.experimento__intro>p:last-child{font-size:13px}.experimento__painel{grid-template-columns:1fr;gap:14px;padding:20px 17px 15px}.queda{min-height:255px;border-right:0;border-bottom:1px solid rgba(118,184,231,.18);padding-bottom:40px}.queda__trilho{min-height:195px}.queda__chao{bottom:38px}.controles{padding:3px}.experimento__nota{font-size:9px;line-height:1.5}}
.queda__trilho{--cor-astro:#39d6ff;border-color:var(--cor-astro);box-shadow:0 0 28px color-mix(in srgb,var(--cor-astro),transparent 88%);transition:border-color .35s,box-shadow .35s}
.queda__trilho::before,.queda__trilho::after{background:var(--cor-astro);box-shadow:0 0 10px var(--cor-astro);transition:background .35s,box-shadow .35s}
.queda__rastro{z-index:1;transform:scaleY(0);transform-origin:top;background:repeating-linear-gradient(to bottom,rgba(176,229,255,.55) 0 4px,transparent 4px 9px)}
.queda__rastro::after{content:"";position:absolute;inset:0 -1px;background:linear-gradient(to bottom,#fff,var(--cor-astro) 42%,rgba(70,165,255,.45));box-shadow:0 0 11px var(--cor-astro)}
.queda__bola{z-index:2;border-color:#fff;box-shadow:0 0 0 5px color-mix(in srgb,var(--cor-astro),transparent 82%),0 0 26px var(--cor-astro),inset -5px -7px 12px rgba(1,20,53,.35);will-change:transform}
.queda__bola::after{content:"";position:absolute;inset:-9px;border:1px solid var(--cor-astro);border-radius:50%;opacity:0;pointer-events:none}
.queda__bola.impacto::after{animation:onda-impacto .64s ease-out}
.queda__chao{isolation:isolate}
.queda__chao::before{content:"";position:absolute;z-index:-1;left:50%;bottom:-3px;width:42px;height:13px;border:1px solid var(--cor-astro);border-radius:50%;opacity:0;transform:translateX(-50%) scale(.6);box-shadow:0 0 15px var(--cor-astro)}
.queda__chao.impacto::before{animation:onda-chao .62s ease-out}
.queda__particula{position:absolute;z-index:4;width:6px;height:6px;border-radius:50%;background:var(--cor-particula);box-shadow:0 0 11px var(--cor-particula);pointer-events:none;animation:impulso-particula .78s cubic-bezier(.16,.72,.32,1) both}
@keyframes onda-impacto{0%{opacity:.85;transform:scale(.45)}100%{opacity:0;transform:scale(2.1)}}
@keyframes onda-chao{0%{opacity:.9;transform:translateX(-50%) scale(.55)}100%{opacity:0;transform:translateX(-50%) scale(2.2)}}
@keyframes impulso-particula{0%{opacity:1;transform:translate(-50%,-50%) scale(.75)}100%{opacity:0;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) scale(0)}}