/* Página de professores parceiros no mesmo visual futurista da página de vendas (04/11) */
:root{
  --void:#05031a; --fg:#f2f3ff; --dim:#a9b0db; --line:rgba(140,150,255,.2);
  --cyan:#3ee6ff; --violet:#8b5cff; --magenta:#e64bd8; --pink:#ff5fae; --gold:#ffc53d; --ok:#4ade80;
  --display:'Sora',system-ui,sans-serif; --body:'Nunito',system-ui,sans-serif; --hud:'Orbitron','Sora',system-ui,sans-serif;
  color-scheme:dark;
}
@property --a{syntax:'<angle>';inherits:false;initial-value:0deg}
*{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:clip}
body{margin:0;background:var(--void);color:var(--fg);font:17px/1.6 var(--body);overflow-x:clip}
img{max-width:100%}
a{color:inherit}
code{font-family:ui-monospace,Menlo,monospace;font-size:.88em;padding:2px 7px;border-radius:7px;background:rgba(62,230,255,.1);border:1px solid rgba(62,230,255,.25);color:#cdf8ff;word-break:break-all}
.wrap{max-width:1180px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
h1,h2,h3{font-family:var(--display);text-wrap:balance;margin:0;letter-spacing:-.02em}
.k{font:700 .68rem var(--hud);letter-spacing:.32em;text-transform:uppercase;color:var(--cyan)}
#sky{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.neb{position:fixed;inset:0;z-index:0;pointer-events:none;background:
  radial-gradient(60vmax 50vmax at 10% 5%,hsla(262,90%,60%,.30),transparent 60%),
  radial-gradient(55vmax 45vmax at 95% 40%,hsla(190,95%,55%,.18),transparent 60%),
  radial-gradient(60vmax 50vmax at 60% 105%,hsla(320,90%,60%,.16),transparent 60%)}
main,nav{position:relative;z-index:1}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:40;background:var(--void)}

/* Navegação */
nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;padding-block:12px}
.navbar{display:flex;align-items:center;gap:18px;padding:10px 12px 10px 16px;border-radius:20px;background:rgba(10,8,34,.62);border:1px solid var(--line);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.logo{display:flex;align-items:center;gap:8px;font:800 1.3rem var(--display);text-decoration:none}
.logo img{width:34px;height:34px}
.logo b{color:var(--gold)}
.navlinks{display:flex;gap:22px;margin-left:auto;font-weight:700;font-size:.92rem;color:var(--dim)}
.navlinks a{text-decoration:none;transition:color .2s}
.navlinks a:hover{color:var(--cyan)}
@media (max-width:820px){.navlinks{display:none}.navbar .bt.sm{margin-left:auto}}
@media (max-width:600px){.navbar{gap:8px;padding:8px 8px 8px 12px;border-radius:18px}.logo{font-size:1.1rem;gap:6px}.logo img{width:28px;height:28px}}

/* Botões: vidro neon (estilo 2 da página de vendas) */
.bt{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:14px;cursor:pointer;text-decoration:none;border:0;isolation:isolate;
  font:800 1.06rem var(--body);color:#fff;letter-spacing:.01em;padding:10px 10px 10px 28px;border-radius:999px;background:rgba(14,10,46,.65);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 0 30px -6px rgba(139,92,255,.8),inset 0 0 20px rgba(139,92,255,.25);
  transition:transform .25s cubic-bezier(.2,.9,.3,1.3),box-shadow .25s,background .25s}
.bt::before{content:"";position:absolute;inset:0;padding:2px;border-radius:inherit;pointer-events:none;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  background:conic-gradient(from var(--a),var(--cyan),var(--violet),var(--pink),var(--gold),var(--cyan));animation:spin 4s linear infinite}
.bt::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.4) 48%,transparent 60%) -160% 0/60% 100% no-repeat;transition:background-position .8s}
.bt:hover::after{background-position:260% 0}
.bt:hover{background:linear-gradient(100deg,rgba(62,230,255,.25),rgba(139,92,255,.35),rgba(255,95,174,.3))}
.bt .go{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;flex:0 0 auto;background:linear-gradient(135deg,var(--cyan),var(--violet));color:#fff;transition:transform .3s cubic-bezier(.2,.9,.3,1.4)}
.bt .go svg{width:18px;height:18px}
.bt:hover .go{transform:translateX(5px) rotate(-35deg)}
.bt .crown{width:30px;height:30px;margin-right:-4px;filter:drop-shadow(0 0 8px rgba(255,197,61,.7));animation:rot 6s linear infinite}
.bt.sm{font-size:.88rem;padding:6px 6px 6px 16px;gap:8px}.bt.sm .go{width:26px;height:26px}.bt.sm .go svg{width:14px;height:14px}
.bo{position:relative;display:inline-flex;align-items:center;gap:10px;padding:15px 24px;border-radius:999px;text-decoration:none;cursor:pointer;
  font:800 1rem var(--body);color:#fff;background:rgba(255,255,255,.05);border:1.5px solid rgba(255,255,255,.35);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  transition:transform .25s cubic-bezier(.2,.9,.3,1.3),border-color .25s,background .25s,box-shadow .25s}
.bo:hover{border-color:var(--cyan);background:rgba(62,230,255,.1);box-shadow:0 0 28px rgba(62,230,255,.35)}
.bo .nt{font-size:1.15rem;color:var(--cyan)}
@keyframes spin{to{--a:360deg}}
@keyframes blink{50%{opacity:.35}}
@keyframes bob{50%{translate:0 -10px}}
@keyframes rot{to{rotate:360deg}}
@keyframes vfloat{50%{translate:0 -10px;rotate:-4deg}}
@keyframes ping{to{inset:-34px;opacity:0}}

/* Topo com a VSL */
.hero{display:grid;justify-items:center;text-align:center;gap:18px;padding-block:18px 40px}
.live{display:inline-flex;align-items:center;gap:10px;padding:7px 14px;border-radius:999px;border:1px solid rgba(62,230,255,.3);background:rgba(62,230,255,.06)}
.live i{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 10px var(--ok);animation:blink 1.6s infinite}
.hero h1{font-size:clamp(2rem,4.6vw,3.6rem);line-height:1.05;font-weight:800;max-width:920px}
.hero h1 em{font-style:normal;background:linear-gradient(90deg,var(--gold),#ffe38a 45%,var(--pink));-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{margin:0;color:var(--dim);font-size:1.12rem;max-width:720px}
.cta{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:center}
.note{margin:0;color:var(--dim);font-size:.88rem;max-width:720px}
.hvid{position:relative;width:100%;max-width:900px;margin:34px auto 6px}
.vframe{position:relative;aspect-ratio:16/9;border-radius:26px;overflow:hidden;background:#05031a;border:1px solid rgba(230,75,216,.45);box-shadow:0 30px 90px -20px rgba(230,75,216,.55),0 0 0 1px rgba(34,211,238,.25)}
.vframe video{width:100%;height:100%;display:block;background:#000}
.play{position:absolute;left:50%;top:50%;translate:-50% -50%;width:100px;height:100px;border-radius:50%;border:0;cursor:pointer;display:grid;place-items:center;background:linear-gradient(135deg,#6d3bff,#ff4fa8);box-shadow:0 0 0 10px rgba(230,75,216,.2),0 0 60px rgba(230,75,216,.7)}
.play::before,.play::after{content:"";position:absolute;inset:-10px;border-radius:50%;border:2px solid rgba(255,95,174,.7);animation:ping 2.2s ease-out infinite}
.play::after{animation-delay:1.1s}
.play svg{width:40px;height:40px;margin-left:6px;fill:#fff}
.vtag{position:absolute;left:50%;bottom:14px;translate:-50% 0;padding:8px 16px;border-radius:999px;background:rgba(5,3,26,.72);border:1px solid rgba(255,255,255,.18);font:700 .82rem var(--body);white-space:nowrap;pointer-events:none}
.vframe.on .play,.vframe.on .vtag{display:none}
.hvid .vastro{position:absolute;width:clamp(90px,15vw,170px);right:-4%;top:-14%;z-index:3;pointer-events:none;filter:drop-shadow(0 0 24px rgba(34,211,238,.5));animation:vfloat 4s ease-in-out infinite}
@media (max-width:600px){.vframe{border-radius:16px}.play{width:72px;height:72px}.play svg{width:30px;height:30px}.vtag{font-size:.68rem;bottom:8px;padding:6px 10px}.hvid .vastro{right:-2%;top:-18%}.lead{font-size:.98rem}}

/* Seções */
section{padding-block:60px 0}
.head{display:grid;gap:12px;justify-items:center;text-align:center;margin-bottom:34px}
.head h2{font-size:clamp(1.8rem,3.6vw,2.7rem);font-weight:800}
.head p{margin:0;color:var(--dim);max-width:62ch}
.panel{position:relative;border-radius:22px;background:linear-gradient(180deg,rgba(28,22,78,.6),rgba(12,9,40,.72));border:1px solid var(--line);box-shadow:inset 0 1px 0 rgba(62,230,255,.22),0 20px 50px -20px rgba(0,0,0,.6)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.grid.two{grid-template-columns:repeat(2,1fr)}
.grid.four{grid-template-columns:repeat(4,1fr)}
@media (max-width:900px){.grid,.grid.four{grid-template-columns:1fr 1fr}}
@media (max-width:620px){.grid,.grid.two,.grid.four{grid-template-columns:1fr}}
.card{padding:26px;display:grid;gap:10px;align-content:start;transition:transform .35s cubic-bezier(.2,.9,.3,1.3),border-color .3s}
.card:hover{transform:translateY(-6px);border-color:rgba(230,75,216,.5)}
.card .ic{width:62px;height:62px;filter:drop-shadow(0 8px 16px rgba(0,0,0,.5));transition:transform .35s cubic-bezier(.2,.9,.3,1.4)}
.card:hover .ic{transform:rotate(-8deg) scale(1.1)}
.card h3{font-size:1.15rem}.card p{margin:0;color:var(--dim);font-size:.98rem}
.card p b{color:var(--fg)}
.card.gold{border-color:rgba(255,197,61,.5);box-shadow:inset 0 1px 0 rgba(255,197,61,.3),0 0 40px -10px rgba(255,197,61,.35)}

/* Números grandes */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.stat{padding:26px 20px;text-align:center;display:grid;gap:6px}
.stat small{font:700 .62rem var(--hud);letter-spacing:.24em;color:var(--cyan);text-transform:uppercase}
.stat b{font:800 clamp(2rem,4.4vw,3.2rem) var(--display);line-height:1.1}
.stat b.g{color:var(--gold);text-shadow:0 0 30px rgba(255,197,61,.45)}
.stat span{color:var(--dim);font-size:.95rem}
@media (max-width:700px){.stats{grid-template-columns:1fr}}

/* Simulador */
.calc{max-width:820px;margin:0 auto;padding:30px 26px;display:grid;gap:18px;text-align:center}
.calc .n{font:800 1.2rem var(--display)}.calc .n b{font-size:2rem;color:var(--cyan)}
.calc input[type=range]{width:100%;accent-color:var(--pink);height:28px}
.calc .out{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.calc .out div{padding:18px;border-radius:16px;background:rgba(5,3,26,.5);border:1px solid var(--line)}
.calc .out small{display:block;font:700 .6rem var(--hud);letter-spacing:.24em;color:var(--dim);text-transform:uppercase}
.calc .out b{font:800 clamp(1.6rem,4vw,2.4rem) var(--display)}
.calc .out .y b{color:var(--gold);text-shadow:0 0 26px rgba(255,197,61,.45)}
.calc .disc{margin:0;color:var(--dim);font-size:.85rem}

/* Passo a passo */
.steps{list-style:none;margin:0 auto;padding:0;max-width:880px;display:grid;gap:14px;counter-reset:s}
.steps li{counter-increment:s;display:grid;grid-template-columns:56px 1fr;gap:18px;padding:22px 22px}
.steps li::before{content:counter(s);width:56px;height:56px;border-radius:50%;display:grid;place-items:center;font:800 1.3rem var(--hud);background:linear-gradient(135deg,var(--violet),var(--pink));box-shadow:0 0 24px rgba(230,75,216,.55)}
.steps h3{font-size:1.15rem;margin-bottom:4px}
.steps p{margin:0;color:var(--dim)}
.steps p + p{margin-top:12px}
.lk{color:var(--cyan)}

/* FAQ */
.faq{display:grid;gap:12px;max-width:820px;margin:0 auto}
.faq summary{list-style:none;cursor:pointer;padding:18px 54px 18px 20px;font:700 1.02rem var(--display);position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"♪";position:absolute;right:18px;top:50%;translate:0 -50%;width:28px;height:28px;border-radius:8px;display:grid;place-items:center;color:var(--cyan);border:1px solid rgba(62,230,255,.4);transition:rotate .25s,background .25s}
.faq details[open] summary::after{rotate:-20deg;background:rgba(62,230,255,.15)}
.faq details p{margin:0;padding:0 20px 18px;color:var(--dim)}

.final{margin-top:80px;padding:56px 24px;text-align:center;display:grid;gap:18px;justify-items:center;overflow:hidden}
.final h2{font-size:clamp(1.8rem,4vw,3rem);max-width:18ch}
.final img.astro{width:150px;animation:bob 4s ease-in-out infinite;filter:drop-shadow(0 0 30px rgba(139,92,255,.6))}
footer{padding-block:40px 30px;text-align:center;color:var(--dim);font-size:.85rem}
footer a{color:var(--dim)}footer a:hover{color:var(--fg)}

@supports (animation-timeline: view()){
  .rv{animation:rv linear both;animation-timeline:view();animation-range:entry 0% cover 28%}
  @keyframes rv{from{opacity:.2;transform:translateY(70px) scale(.95)}}
}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}