/* Cursos de IA — Glec.ia. Tokens e componentes do design system Glec.ia (v1, set/2026). */
:root{
  --marinho:#0E1527; --marinho-2:#16203A; --azul:#3378F9; --azul-luz:#4C8CFF; --gelo:#E9F0FF;
  --tinta:#1B2236; --cinza:#5B6478; --risco:#DCE3F2; --suave:#F4F7FD; --branco:#fff;
  --card:#fff; --papel:#fff; --on-brand:#fff; --on-deep-hi:#fff; --on-deep-2:#C9D6F2; --on-deep-3:#9FB2DA;
  --dbtn-bg:var(--azul); --dbtn-fg:var(--on-brand); --grad:linear-gradient(90deg,var(--azul),var(--azul-luz));
  --glow:radial-gradient(circle,color-mix(in srgb,var(--azul) 38%,transparent),transparent 65%);
  --f-h:'Saira',system-ui,sans-serif; --f-b:'Saira',system-ui,sans-serif; --f-k:'Michroma',sans-serif; --rb:12px; --rpill:12px;
  --acc:var(--azul); --acc-luz:var(--azul-luz); --acento:#3378F9; /* acento discreto de cada curso (so em detalhes pequenos) */
  --r:14px; --sombra:0 1px 2px rgba(14,21,39,.06),0 8px 24px rgba(14,21,39,.06);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--f-b);color:var(--tinta);background:var(--papel);font-size:17px;line-height:1.55;overflow-x:hidden}
img,svg{max-width:100%;display:block}
a{color:var(--acc);text-decoration:none}
button{font:inherit;cursor:pointer;color:inherit}
[hidden]{display:none!important}
.wrap{width:min(1120px,100% - 32px);margin-inline:auto}
.kicker{font-family:var(--f-k);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--acc)}
.dark .kicker,.escura .kicker{color:var(--acc-luz)}
h1,h2,h3{font-family:var(--f-h);font-weight:600;color:var(--marinho);line-height:1.12;letter-spacing:-.01em}
h1 em,h2 em{font-style:normal;color:var(--acc)}
h1{font-size:clamp(30px,6.4vw,52px)} h2{font-size:clamp(25px,4.6vw,38px)} h3{font-size:19px}
.lead{font-size:clamp(17px,2.4vw,20px);font-weight:300;color:var(--cinza);max-width:60ch}
.mono{font-family:'JetBrains Mono',monospace}
.tag{display:inline-block;font-family:'JetBrains Mono',monospace;font-size:12px;padding:2px 10px;border-radius:99px;background:var(--gelo);color:var(--acc)}
.tag.escuro{background:var(--marinho);color:var(--gelo)}
.ic{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.icone{width:44px;height:44px;border-radius:11px;background:var(--marinho);color:var(--acc-luz);display:grid;place-items:center;flex:none}

/* botoes */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 24px;border-radius:var(--rpill);border:1.5px solid transparent;font-weight:600;font-size:17px;transition:transform .18s,box-shadow .18s,background .18s;min-height:48px;text-align:center}
.btn:hover{transform:translateY(-2px)}
.btn-p{background:var(--azul);color:var(--on-brand);box-shadow:0 6px 18px color-mix(in srgb,var(--azul) 35%,transparent)}
.btn-p:hover{background:var(--azul-luz)}
.btn-g{background:transparent;border-color:var(--risco);color:var(--marinho)}
.dark .btn-g{border-color:color-mix(in srgb,var(--gelo) 30%,transparent);color:var(--gelo)}
.btn-g:hover{border-color:var(--acc)}
.btn[aria-disabled=true]{opacity:.55;pointer-events:none}
.btn-sm{padding:9px 16px;font-size:15px;min-height:40px}

/* brilho azul das paginas escuras */
.dark{background:var(--marinho);color:var(--gelo);position:relative;overflow:hidden}
.dark::before{content:"";position:absolute;right:-12%;top:-45%;width:min(760px,120vw);aspect-ratio:1;background:var(--glow);pointer-events:none}
.dark>*{position:relative}
.dark h1,.dark h2,.dark h3{color:var(--on-deep-hi)} .dark h1 em,.dark h2 em{color:var(--acc-luz)}
.dark .lead{color:var(--on-deep-2)}

/* topo do site */
.top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 0}
.top img{height:22px;width:auto}
.top nav{display:flex;gap:20px;align-items:center;font-size:15px}
.top nav a{color:var(--on-deep-2)}
@media(max-width:640px){.top nav a.hide-m{display:none}}

/* ---------- vitrine ---------- */
.hero{padding:0 0 64px}
.hero-grid{display:grid;gap:36px;align-items:center;padding-top:28px}
.hero h1{margin:18px 0 18px}
.hero .cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.hero .prova{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:22px;font-size:14px;color:var(--on-deep-3)}
.hero .prova span{display:inline-flex;gap:6px;align-items:center}
.hero-art{max-width:460px;margin-inline:auto;width:100%}
@media(min-width:900px){.hero-grid{grid-template-columns:1.15fr .85fr}}
section.sec{padding:64px 0}
section.sec.suave{background:var(--suave)}
.sec-head{max-width:720px;margin-bottom:34px}
.sec-head h2{margin:10px 0 12px}
.grid{display:grid;gap:18px}
.g2{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.cartao{background:var(--suave);border:1px solid var(--risco);border-radius:var(--r);padding:22px}
.cartao p{color:var(--cinza);font-size:16px}
.cartao h3{margin:12px 0 6px}
.cartao .num{font-family:'JetBrains Mono',monospace;color:var(--acc);font-size:13px;letter-spacing:.08em}
section.suave .cartao{background:var(--card)}
.curso-card{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--risco);border-radius:18px;overflow:hidden;box-shadow:var(--sombra);transition:transform .25s,box-shadow .25s}
.curso-card:hover{transform:translateY(-4px)}
.curso-card .capa{background:var(--marinho);padding:18px 18px 8px;position:relative;border-bottom:4px solid var(--acento)}
.curso-card .capa svg{width:100%;height:auto}
.curso-card .corpo{padding:22px;display:flex;flex-direction:column;gap:10px;flex:1}
.curso-card ul{list-style:none;display:grid;gap:6px;font-size:15.5px;color:var(--cinza)}
.curso-card li{display:flex;gap:8px}
.curso-card li::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--azul);margin-top:9px;flex:none}
.curso-card .preco{font-size:30px;font-weight:600;color:var(--marinho);line-height:1}
.curso-card .preco small{font-size:14px;font-weight:400;color:var(--cinza)}
.curso-card .acoes{display:grid;gap:10px;margin-top:auto;padding-top:12px}
.curso-card.breve .capa{filter:saturate(.7)}
.badge-breve{position:absolute;right:14px;top:14px;background:var(--gelo);color:var(--marinho);font-family:'JetBrains Mono',monospace;font-size:12px;padding:3px 10px;border-radius:99px}
.combo{border-radius:20px;padding:32px 24px;display:grid;gap:26px;align-items:center}
.combo .preco-combo{font-size:clamp(48px,11vw,76px);font-weight:600;color:var(--on-deep-hi);line-height:1}
.combo .preco-combo small{font-size:18px;font-weight:300;color:var(--on-deep-2)}
.combo .de{color:var(--on-deep-3);text-decoration:line-through;font-family:'JetBrains Mono',monospace}
.combo .eco{display:inline-block;margin-top:10px;background:var(--azul);color:var(--on-brand);border-radius:99px;padding:3px 14px;font-size:14px;font-weight:600}
.combo ul{list-style:none;display:grid;gap:10px;margin:18px 0 24px;color:var(--on-deep-2)}
.combo li{display:flex;gap:10px;align-items:center}
.combo li .ic{color:var(--acc-luz)}
@media(min-width:860px){.combo{grid-template-columns:1.1fr .9fr;padding:44px}}
.garantia{display:flex;gap:18px;align-items:center;background:var(--suave);border:1px solid var(--risco);border-left:4px solid var(--azul);border-radius:var(--r);padding:22px}
details{border-bottom:1px solid var(--risco);padding:4px 0}
summary{cursor:pointer;list-style:none;padding:16px 36px 16px 0;font-weight:600;color:var(--marinho);position:relative;min-height:48px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";position:absolute;right:6px;top:12px;font-size:26px;color:var(--acc);transition:transform .2s}
details[open] summary::after{transform:rotate(45deg)}
details p{padding:0 0 18px;color:var(--cinza)}
footer.rodape{padding:34px 0;font-size:14px;color:var(--on-deep-3)}
footer.rodape .wrap{display:flex;flex-wrap:wrap;gap:10px 24px;justify-content:space-between;align-items:center}
footer.rodape img{height:20px;width:auto}

/* ---------- curso ---------- */
.curso-top{position:sticky;top:0;z-index:30;background:var(--marinho);color:var(--gelo);display:flex;align-items:center;gap:12px;padding:10px 16px;border-bottom:3px solid var(--acento)}
.curso-top img{height:20px;width:auto}
.curso-top .nome{font-weight:600;font-size:16px;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.curso-top .btn-aulas{background:color-mix(in srgb,var(--gelo) 10%,transparent);border:1px solid color-mix(in srgb,var(--gelo) 25%,transparent);border-radius:10px;padding:8px 14px;color:var(--on-deep-hi);font-size:15px;display:inline-flex;gap:8px;align-items:center;min-height:40px}
.ring{position:relative;width:44px;height:44px;flex:none}
.ring svg{width:44px;height:44px;transform:rotate(-90deg)}
.ring circle{fill:none;stroke-width:4}
.ring .bg{stroke:color-mix(in srgb,var(--gelo) 18%,transparent)}
.ring .fg{stroke:var(--azul-luz);stroke-linecap:round;transition:stroke-dashoffset .9s cubic-bezier(.2,.8,.2,1)}
.ring b{position:absolute;inset:0;display:grid;place-items:center;font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:500;color:var(--on-deep-hi)}
.layout{display:block}
.side{position:fixed;inset:0 auto 0 0;width:min(320px,88vw);background:var(--card);z-index:40;transform:translateX(-102%);transition:transform .28s;overflow-y:auto;padding:18px 14px 40px;border-right:1px solid var(--risco);box-shadow:var(--sombra)}
.side.open{transform:none}
.veu{position:fixed;inset:0;background:color-mix(in srgb,var(--marinho) 50%,transparent);z-index:35;opacity:0;pointer-events:none;transition:opacity .25s}
.veu.open{opacity:1;pointer-events:auto}
.side h4{font-family:'Michroma',sans-serif;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--acc);margin:6px 8px 12px}
.side a{display:flex;gap:10px;align-items:center;padding:11px 10px;border-radius:10px;color:var(--tinta);font-size:15.5px;line-height:1.25;min-height:48px}
.side a:hover{background:var(--suave)}
.side a.on{background:var(--gelo);color:var(--marinho);font-weight:600}
.side a .n{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--acc);width:26px;flex:none}
.side a .ok{margin-left:auto;width:20px;height:20px;border-radius:50%;border:1.5px solid var(--risco);display:grid;place-items:center;flex:none;color:var(--on-brand)}
.side a.feita .ok{background:var(--azul);border-color:var(--acc)}
.side a .ok svg{width:12px;height:12px;stroke-width:3;opacity:0}
.side a.feita .ok svg{opacity:1}
.side .sep{height:1px;background:var(--risco);margin:10px 4px}
@media(min-width:1000px){
  .layout{display:grid;grid-template-columns:300px 1fr}
  .side{position:sticky;top:60px;height:calc(100vh - 60px);transform:none;box-shadow:none;width:auto;z-index:1}
  .veu,.btn-aulas{display:none!important}
}
main{padding:28px 16px 80px;min-width:0}
.col{max-width:820px;margin-inline:auto}
.prevbar{background:var(--gelo);color:var(--marinho);font-size:14px;padding:8px 16px;text-align:center}
.aula-head{margin-bottom:20px}
.aula-head h1{margin-top:12px}
.aula-head .meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px;align-items:center}
.faixa{background:var(--marinho);color:var(--gelo);border-radius:var(--r);padding:22px 24px;position:relative;overflow:hidden;margin:18px 0}
.faixa::after{content:"";position:absolute;right:-60px;top:-90px;width:240px;height:240px;background:var(--glow)}
.faixa p{font-size:clamp(19px,3vw,23px);font-weight:500;line-height:1.35;color:var(--on-deep-hi);margin-top:10px;position:relative}
.fig{background:var(--suave);border:1px solid var(--risco);border-radius:var(--r);padding:18px 14px 12px;margin:18px 0}
.fig svg{width:100%;max-width:560px;height:auto;margin-inline:auto}
.fig figcaption{text-align:center;font-size:14px;color:var(--cinza);margin-top:8px}
.blocos{display:grid;gap:14px;margin:18px 0}
@media(min-width:720px){.blocos.n3{grid-template-columns:repeat(3,1fr)}.blocos.n2{grid-template-columns:repeat(2,1fr)}.blocos.n4{grid-template-columns:repeat(2,1fr)}}
.bloco{background:var(--card);border:1px solid var(--risco);border-radius:var(--r);padding:18px}
.bloco h3{font-size:17px;margin:12px 0 4px}
.bloco p{font-size:15.5px;color:var(--cinza)}
.bloco .icone{width:38px;height:38px}
.prompt{border-radius:var(--r);background:var(--marinho);color:var(--gelo);margin:20px 0;overflow:hidden}
.prompt-h{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px 12px 18px;border-bottom:1px solid color-mix(in srgb,var(--gelo) 12%,transparent);font-family:'JetBrains Mono',monospace;font-size:12.5px;color:var(--acc-luz);letter-spacing:.04em}
.prompt pre{white-space:pre-wrap;word-break:break-word;font-family:'JetBrains Mono',monospace;font-size:14px;line-height:1.65;padding:16px 18px 20px;color:var(--gelo)}
.copiar{display:inline-flex;gap:7px;align-items:center;background:var(--azul);color:var(--on-brand);border:0;border-radius:9px;padding:8px 14px;font-weight:600;font-size:14px;min-height:40px;transition:background .2s,transform .15s}
.copiar:hover{background:var(--azul-luz)} .copiar:active{transform:scale(.96)}
.copiar.ok{background:var(--on-deep-hi);color:var(--marinho)}
.tabs{display:flex;gap:6px;flex-wrap:wrap;padding:10px 12px 0}
.tabs button{background:transparent;border:1px solid color-mix(in srgb,var(--gelo) 25%,transparent);color:var(--on-deep-2);border-radius:99px;padding:6px 14px;font-size:14px;min-height:36px}
.tabs button[aria-selected=true]{background:var(--azul);border-color:var(--acc);color:var(--on-brand)}
.exercicio{display:flex;gap:16px;background:var(--suave);border:1px solid var(--risco);border-left:4px solid var(--azul);border-radius:0 var(--r) var(--r) 0;padding:18px;margin:20px 0}
.exercicio h3{font-size:17px;margin-bottom:4px}
.exercicio p{font-size:16px}
.check{display:flex;gap:10px;align-items:center;margin-top:12px;font-size:15px;color:var(--cinza);cursor:pointer;min-height:36px}
.check input{width:22px;height:22px;accent-color:var(--acc)}
.miniquiz{border:1px solid var(--risco);border-radius:var(--r);padding:18px;margin:22px 0;background:var(--card)}
.miniquiz>h3{display:flex;gap:10px;align-items:center;margin-bottom:12px}
.q{margin:16px 0}
.q-t{font-weight:600;color:var(--marinho);margin-bottom:10px}
.opts{display:grid;gap:8px}
.opt{display:flex;gap:12px;align-items:flex-start;text-align:left;background:var(--suave);border:1.5px solid var(--risco);border-radius:12px;padding:12px 14px;font-size:16px;line-height:1.35;min-height:48px;transition:border-color .15s,background .15s,transform .15s;width:100%}
.opt:hover:not(:disabled){border-color:var(--acc);transform:translateX(3px)}
.opt .l{font-family:'JetBrains Mono',monospace;font-size:12px;width:22px;height:22px;border-radius:50%;border:1.5px solid var(--risco);display:grid;place-items:center;flex:none;margin-top:1px;color:var(--cinza);background:var(--card)}
.opt:disabled{cursor:default}
.opt.certa{background:var(--azul);border-color:var(--acc);color:var(--on-brand);animation:pop .45s}
.opt.certa .l{background:var(--card);color:var(--acc);border-color:var(--on-deep-hi)}
.opt.errada{background:var(--marinho);border-color:var(--marinho);color:var(--gelo);animation:tremer .4s}
.opt.errada .l{border-color:var(--gelo);color:var(--gelo);background:transparent}
.opt.apagada{opacity:.55}
.fb{font-size:15px;color:var(--tinta);background:var(--gelo);border-radius:10px;padding:12px 14px;margin-top:10px;animation:sobe .35s}
.fb b{color:var(--marinho)}
.resumo{margin-top:16px;display:flex;gap:12px;align-items:center;flex-wrap:wrap;background:var(--marinho);color:var(--on-deep-hi);border-radius:12px;padding:14px 16px;animation:sobe .4s}
.resumo .ic{color:var(--acc-luz)}
.aula-nav{display:flex;justify-content:space-between;gap:12px;margin-top:30px;flex-wrap:wrap}
.aula-nav .btn-p.pulsa{animation:pulsa 1.6s 2}
@keyframes pop{0%{transform:scale(.97)}50%{transform:scale(1.025)}100%{transform:scale(1)}}
@keyframes tremer{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
@keyframes sobe{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes pulsa{0%,100%{box-shadow:0 6px 18px color-mix(in srgb,var(--azul) 35%,transparent)}50%{box-shadow:0 0 0 10px color-mix(in srgb,var(--azul) 18%,transparent)}}
.js .reveal{opacity:0;transform:translateY(18px);transition:opacity .65s cubic-bezier(.2,.7,.2,1),transform .65s cubic-bezier(.2,.7,.2,1)}
.js .reveal.in{opacity:1;transform:none}
.js .reveal.d1{transition-delay:.08s}.js .reveal.d2{transition-delay:.16s}

/* inicio do curso */
.intro-hero{border-radius:20px;padding:30px 22px;margin-bottom:26px}
.intro-hero h1{margin:12px 0}
.intro-hero .acoes{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.lista-aulas{display:grid;gap:10px;margin-top:14px}
.lista-aulas a{display:flex;gap:14px;align-items:center;padding:14px 16px;border:1px solid var(--risco);border-radius:12px;color:var(--tinta);background:var(--card);transition:border-color .2s,transform .2s;min-height:60px}
.lista-aulas a:hover{border-color:var(--acc);transform:translateX(4px)}
.lista-aulas .n{font-family:'JetBrains Mono',monospace;color:var(--acc);font-size:14px;width:28px}
.lista-aulas b{display:block;color:var(--marinho);font-weight:600;line-height:1.25}
.lista-aulas small{color:var(--cinza)}
.lista-aulas a.feita .ok{background:var(--azul);color:var(--on-brand);border-color:var(--acc)}
.lista-aulas .ok{margin-left:auto;width:24px;height:24px;border-radius:50%;border:1.5px solid var(--risco);display:grid;place-items:center;flex:none;color:transparent}
.lista-aulas .ok svg{width:14px;height:14px;stroke-width:3}

/* quiz final */
.qf-bar{height:8px;background:var(--risco);border-radius:9px;overflow:hidden;margin:14px 0 6px}
.qf-bar i{display:block;height:100%;background:var(--azul);width:0;transition:width .5s}
.qf-meta{display:flex;justify-content:space-between;font-family:'JetBrains Mono',monospace;font-size:13px;color:var(--cinza)}
.qf-card{border:1px solid var(--risco);border-radius:var(--r);padding:20px;margin-top:14px;background:var(--card)}
.qf-card .q-t{font-size:19px}
.score{font-size:64px;font-weight:600;color:var(--acc);line-height:1;font-family:var(--f-b)}
.nome-form{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.nome-form input{flex:1;min-width:220px;border:1.5px solid var(--risco);border-radius:12px;padding:13px 14px;font:inherit;font-size:17px;min-height:48px}
.nome-form input:focus{outline:2px solid var(--azul);border-color:var(--acc)}
.confete{position:fixed;top:-12px;width:9px;height:14px;z-index:60;pointer-events:none;animation:cai 2.6s linear forwards}
@keyframes cai{to{transform:translateY(105vh) rotate(540deg);opacity:.9}}

/* certificado */
.cert{background:var(--marinho);color:var(--gelo);border-radius:18px;padding:clamp(24px,5vw,56px);position:relative;overflow:hidden;aspect-ratio:1.414/1;display:flex;flex-direction:column;justify-content:space-between;border:6px double color-mix(in srgb,var(--azul-luz) 45%,transparent);animation:monta .9s both}
.cert::before{content:"";position:absolute;right:-20%;top:-40%;width:80%;aspect-ratio:1;background:var(--glow)}
.cert>*{position:relative}
.cert img{height:clamp(16px,3vw,28px);width:auto}
.cert .t1{font-family:'Michroma',sans-serif;font-size:clamp(8px,1.5vw,12px);letter-spacing:.3em;text-transform:uppercase;color:var(--acc-luz)}
.cert .nome{font-size:clamp(26px,6.5vw,60px);font-weight:600;color:var(--on-deep-hi);line-height:1.05;margin:.3em 0;word-break:break-word}
.cert p{font-size:clamp(12px,2vw,19px);font-weight:300;color:var(--on-deep-2);max-width:46ch}
.cert .curso{font-size:clamp(18px,3.8vw,34px);font-weight:600;color:var(--on-deep-hi)}
.cert .curso em{font-style:normal;color:var(--acc-luz)}
.cert .rod{display:flex;justify-content:space-between;align-items:flex-end;font-family:'JetBrains Mono',monospace;font-size:clamp(9px,1.5vw,13px);color:var(--on-deep-3);gap:10px;flex-wrap:wrap}
@keyframes monta{from{opacity:0;transform:scale(.94) translateY(14px)}to{opacity:1;transform:none}}
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,30px);background:var(--marinho);color:var(--on-deep-hi);padding:12px 20px;border-radius:12px;font-size:15px;opacity:0;pointer-events:none;transition:.3s;z-index:70}
.toast.on{opacity:1;transform:translate(-50%,0)}
/* diagramas */
svg text{font-family:var(--f-b)}
.s-box{fill:var(--card);stroke:var(--risco);stroke-width:1.5}
.s-suave{fill:var(--suave);stroke:var(--risco);stroke-width:1.5}
.s-dark{fill:var(--marinho)} .s-blue{fill:var(--azul)} .s-gelo{fill:var(--gelo)}
.s-line{stroke:var(--azul);stroke-width:2;fill:none;stroke-dasharray:5 5}
.s-solid{stroke:var(--azul);stroke-width:2.5;fill:none}
.s-ar{fill:var(--azul)}
.t{fill:var(--tinta)} .tw{fill:#fff} .tc{fill:var(--cinza)} .tb{fill:var(--azul)} .tl{fill:var(--azul-luz)} .tm{fill:var(--marinho)}
.b{font-weight:600}
.ico{fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.ic-b{color:var(--acc)} .ic-l{color:var(--acc-luz)} .ic-w{color:var(--on-deep-hi)} .ic-m{color:var(--marinho)} .ic-c{color:var(--cinza)}
.riscado{text-decoration:line-through}

@media print{
  .curso-top,.side,.veu,.aula-nav,.toast,.prevbar,.no-print{display:none!important}
  body.imprime-cert main>*:not(#certificado){display:none!important}
  body.imprime-cert #certificado .no-print{display:none!important}
  .cert{break-inside:avoid;width:100%;animation:none;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  @page{size:A4 landscape;margin:10mm}
}
@media(max-width:480px){.curso-top .nome{display:none}.curso-top{justify-content:space-between}}

/* vitrine por curso (publica) e linha de suporte */
.lista-vitrine li{display:flex;gap:14px;align-items:center;padding:14px 16px;border:1px solid var(--risco);border-radius:12px;background:var(--card)}
.lista-vitrine .n{font-family:'JetBrains Mono',monospace;color:var(--acc);font-size:14px;width:28px;flex:none}
.lista-vitrine b{display:block;color:var(--marinho);font-weight:600;line-height:1.25}
.lista-vitrine small{color:var(--cinza)}
.suporte{margin-top:10px;font-size:15px;color:var(--cinza)}.suporte a{color:var(--acc);text-decoration:underline}

/* ---------- movimento sutil (so transform/opacity) ---------- */
:focus-visible{outline:3px solid var(--azul-luz);outline-offset:3px;border-radius:6px}
.dark :focus-visible,.curso-top :focus-visible,.prompt :focus-visible{outline-color:var(--on-deep-hi)}
.btn:active{transform:translateY(0) scale(.97)}
.btn-p:hover{box-shadow:0 10px 24px color-mix(in srgb,var(--azul) 40%,transparent)}
.opt:active:not(:disabled){transform:scale(.985)}
.opt:focus-visible{border-color:var(--acc)}
.cartao,.bloco,.garantia{transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s,border-color .25s}
.cartao:hover,.bloco:hover{transform:translateY(-3px);box-shadow:var(--sombra);border-color:color-mix(in srgb,var(--acc) 45%,var(--risco))}
.curso-card:hover{box-shadow:0 2px 4px rgba(14,21,39,.08),0 18px 40px rgba(14,21,39,.14)}
.curso-card .capa svg{transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.curso-card:hover .capa svg{transform:scale(1.03)}
.lista-aulas a:active,.side a:active{transform:scale(.99)}
.side a{transition:background .15s,transform .15s}
.lista-vitrine li{transition:transform .2s,border-color .2s}.lista-vitrine li:hover{transform:translateX(4px);border-color:var(--acc)}
.tabs button{transition:background .15s,transform .15s}.tabs button:active{transform:scale(.95)}
.check input{transition:transform .15s}.check input:active{transform:scale(.9)}
details{transition:background .2s}
details[open] p{animation:sobe .3s both}

/* troca de aula */
[data-view].entra{animation:troca .4s cubic-bezier(.2,.7,.2,1) both}
@keyframes troca{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* entrada do topo da vitrine */
.hero .kicker,.hero h1,.hero .lead,.hero .cta,.hero .prova{animation:sobe .7s cubic-bezier(.2,.7,.2,1) both}
.hero h1{animation-delay:.08s}.hero .lead{animation-delay:.16s}.hero .cta{animation-delay:.24s}.hero .prova{animation-delay:.32s}
.hero-art{animation:flutua 7s ease-in-out infinite}
@keyframes flutua{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

/* numeros */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px;margin:0 0 22px}
.stat{background:var(--card);border:1px solid var(--risco);border-radius:var(--r);padding:16px 14px;text-align:center}
.stat b{display:block;font-size:clamp(30px,6vw,42px);font-weight:600;color:var(--acc);line-height:1;font-variant-numeric:tabular-nums}
.stat span{display:block;margin-top:6px;font-size:14px;color:var(--cinza)}
section.suave .stat{background:var(--card)}
.faixa-num{margin-top:-28px;position:relative;z-index:2}
[data-count]{font-variant-numeric:tabular-nums}

/* barra de progresso do curso */
.barra{height:8px;background:var(--risco);border-radius:9px;overflow:hidden;margin-top:12px}
.barra i{display:block;height:100%;width:100%;background:var(--grad);border-radius:9px;transform-origin:left;transform:scaleX(0);transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.qf-bar i{width:100%!important;transform-origin:left;transform:scaleX(var(--p,0));transition:transform .55s cubic-bezier(.2,.8,.2,1)}

/* bonus */
.bonus{display:flex;gap:16px;align-items:center;flex-wrap:wrap;background:var(--marinho);color:var(--gelo);border-radius:var(--r);padding:20px 22px;margin:22px 0;position:relative;overflow:hidden}
.bonus::after{content:"";position:absolute;right:-60px;top:-90px;width:240px;height:240px;background:var(--glow);pointer-events:none}
.bonus>*{position:relative}
.bonus .corpo{flex:1;min-width:220px}
.bonus h3{color:var(--on-deep-hi);font-size:18px;margin:6px 0 4px}
.bonus p{color:var(--on-deep-2);font-size:15.5px}
.bonus.publico{background:var(--suave);color:var(--tinta);border:1px solid var(--risco)}
.bonus.publico h3{color:var(--marinho)}.bonus.publico p{color:var(--cinza)}.bonus.publico::after{display:none}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;animation-iteration-count:1!important;transition-duration:.01ms!important;transition-delay:0s!important;scroll-behavior:auto!important}
  .js .reveal{opacity:1!important;transform:none!important}
  .hero-art{animation:none!important}
  .cartao:hover,.bloco:hover,.btn:hover,.curso-card:hover,.curso-card:hover .capa svg,.lista-vitrine li:hover,.opt:hover:not(:disabled),.lista-aulas a:hover{transform:none!important}
}
@media print{
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js .reveal,.reveal{opacity:1!important;transform:none!important}
  .hero-art{animation:none!important}
}