:root{--am:#FFD400;--am-escuro:#E6B800;--am-sombra:#9C8200;--tinta:#111114;--painel:#1B1B21;--painel2:#24242C;--linha:#34343F;--texto:#F2F2F4;--mudo:#9A9AA6;--azul:#2F6BFF;--azul-claro:#5B8CFF;--vermelho:#FF3B3B;--verde:#22C55E}
/* IA no Fácil: estilo do site. As cores (:root) são injetadas por gerar_site.py a partir de 00_MARCA/brand.json. */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:88px}
body{background:var(--tinta);color:var(--texto);font:400 17px/1.6 Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;overflow-x:clip;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background-image:radial-gradient(rgba(255,212,0,.075) 1.5px,transparent 1.7px);background-size:28px 28px}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit}
ul,ol{list-style:none}
b,strong{font-weight:700}
:focus-visible{outline:3px solid var(--am);outline-offset:3px;border-radius:6px}
::selection{background:var(--am);color:var(--tinta)}
.wrap{width:100%;max-width:1180px;margin:0 auto;padding:0 20px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pular{position:absolute;left:12px;top:-60px;z-index:100;background:var(--am);color:var(--tinta);font-weight:800;padding:10px 16px;border-radius:10px;text-decoration:none}
.pular:focus{top:12px}

/* tipografia */
h1,h2,h3,.lilita{font-family:"Lilita One",Inter,sans-serif;font-weight:400;line-height:1.02;letter-spacing:.005em}
h2{font-size:clamp(36px,5.2vw,62px);text-wrap:balance}
h3{font-size:clamp(24px,2.4vw,30px)}
p{text-wrap:pretty}
.mono{font-family:"JetBrains Mono",ui-monospace,Consolas,monospace}
.am{color:var(--am)}
.lead{font-size:clamp(17px,1.5vw,20px);color:#C9C9D2;max-width:36em}
.mudo{color:var(--mudo)}

/* adesivos (etiquetas estilo sticker) */
.adesivo{display:inline-block;font:400 15px/1 "Lilita One",sans-serif;letter-spacing:.03em;text-transform:uppercase;background:var(--am);color:var(--tinta);padding:8px 12px 6px;border-radius:9px;border:3px solid #fff;transform:rotate(-3deg);box-shadow:0 4px 0 rgba(0,0,0,.35);white-space:nowrap}
.adesivo.dir{transform:rotate(2.5deg)}
.adesivo.branco{background:#fff}
.adesivo.tinta{background:var(--tinta);color:var(--am)}
.adesivo.azul{background:var(--azul-claro);color:var(--tinta)}
.adesivo.verde{background:var(--verde);color:var(--tinta)}
.adesivo+h2,.adesivo+h1{margin-top:20px}

/* botões */
.bt{display:inline-flex;align-items:center;justify-content:center;gap:10px;font:800 17px/1.2 Inter,sans-serif;text-decoration:none;padding:16px 24px;border-radius:14px;border:2px solid transparent;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,background-color .16s ease;text-align:center}
.bt svg{width:20px;height:20px;flex:none;transition:transform .2s ease}
.bt:hover svg{transform:translateX(4px)}
.bt-am{background:var(--am);color:var(--tinta);box-shadow:0 6px 0 var(--am-sombra)}
.bt-am:hover{transform:translateY(-2px);box-shadow:0 8px 0 var(--am-sombra)}
.bt-am:active{transform:translateY(4px);box-shadow:0 2px 0 var(--am-sombra)}
.bt-tinta{background:var(--tinta);color:#fff;box-shadow:0 6px 0 rgba(0,0,0,.35)}
.bt-tinta:hover{transform:translateY(-2px);box-shadow:0 8px 0 rgba(0,0,0,.35)}
.bt-tinta:active{transform:translateY(4px);box-shadow:0 2px 0 rgba(0,0,0,.35)}
.bt-linha{background:var(--painel);color:var(--texto);border-color:var(--linha)}
.bt-linha:hover{border-color:var(--am);transform:translateY(-2px)}
.bt-sm{font-size:15px;padding:10px 16px;border-radius:11px}
.bt-am.bt-sm{box-shadow:0 4px 0 var(--am-sombra)}

/* mascote: contorno branco de adesivo em fundo escuro */
.stk{filter:drop-shadow(3px 0 0 #fff) drop-shadow(-3px 0 0 #fff) drop-shadow(0 3px 0 #fff) drop-shadow(0 -3px 0 #fff)}
.stk-g{filter:drop-shadow(4px 0 0 #fff) drop-shadow(-4px 0 0 #fff) drop-shadow(0 4px 0 #fff) drop-shadow(0 -4px 0 #fff) drop-shadow(0 14px 18px rgba(0,0,0,.35))}
.masc-anim .corpo{animation:flutua 4.2s ease-in-out infinite}
.masc-anim .vp{transform-box:fill-box;transform-origin:50% 100%;animation:vapor 2.8s ease-in-out infinite}
.masc-anim .vp2{animation-delay:-.9s}.masc-anim .vp3{animation-delay:-1.8s}
.masc-anim .olhos{transform-box:fill-box;transform-origin:50% 50%;animation:pisca 5.2s infinite}
.masc-anim .braco-xic{transform-box:view-box;transform-origin:308px 262px;animation:gole 7s ease-in-out infinite}
.balanca{animation:balanca 5s ease-in-out infinite;transform-origin:50% 90%}
@keyframes flutua{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes vapor{0%,100%{transform:translateY(0) scaleY(1);opacity:1}50%{transform:translateY(-6px) scaleY(1.1);opacity:.55}}
@keyframes pisca{0%,90%,97%,100%{transform:scaleY(1)}93.5%{transform:scaleY(.08)}}
@keyframes gole{0%,62%,100%{transform:rotate(0)}72%,86%{transform:rotate(-16deg)}}
@keyframes balanca{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}

/* topo */
.topo{position:sticky;top:0;z-index:50;background:var(--tinta);border-bottom:1px solid var(--linha)}
.topo .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;height:72px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;font:400 25px/1 "Lilita One",sans-serif;white-space:nowrap}
.logo img{width:40px;height:40px}
.logo i{font-style:normal;display:inline-block;background:var(--am);color:var(--tinta);padding:4px 9px 2px;border-radius:7px;transform:rotate(-5deg);margin-right:4px}
.nav{display:flex;align-items:center;gap:28px}
.nav ul{display:flex;gap:24px}
.nav ul a{text-decoration:none;font-weight:600;font-size:15px;color:#B9B9C3;padding:6px 0;background:linear-gradient(var(--am),var(--am)) 0 100%/0 3px no-repeat;transition:background-size .2s ease,color .2s}
.nav ul a:hover,.nav ul a[aria-current=page]{color:var(--texto);background-size:100% 3px}
.menu-cel{display:none;position:relative}
.menu-cel summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:8px;font-weight:700;font-size:15px;border:2px solid var(--linha);border-radius:11px;padding:8px 12px;background:var(--painel)}
.menu-cel summary::-webkit-details-marker{display:none}
.menu-cel summary span{display:block;width:18px;height:2px;background:currentColor;position:relative}
.menu-cel summary span::before,.menu-cel summary span::after{content:"";position:absolute;left:0;width:18px;height:2px;background:currentColor;transition:transform .2s}
.menu-cel summary span::before{top:-6px}.menu-cel summary span::after{top:6px}
.menu-cel[open] summary span{background:transparent}
.menu-cel[open] summary span::before{transform:translateY(6px) rotate(45deg)}
.menu-cel[open] summary span::after{transform:translateY(-6px) rotate(-45deg)}
.menu-cel ul{position:absolute;right:0;top:calc(100% + 10px);width:min(280px,calc(100vw - 40px));background:var(--painel);border:2px solid var(--linha);border-radius:16px;padding:10px;box-shadow:0 20px 40px rgba(0,0,0,.5)}
.menu-cel li a{display:block;padding:12px 14px;border-radius:10px;text-decoration:none;font-weight:700}
.menu-cel li a:hover{background:var(--painel2)}
.menu-cel li:last-child a{background:var(--am);color:var(--tinta);margin-top:6px}

/* hero */
.heroi{padding:clamp(40px,6vw,80px) 0 clamp(48px,7vw,88px)}
.heroi-grade{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);gap:clamp(28px,4vw,56px);align-items:center}
.heroi h1{font-size:clamp(50px,7.6vw,100px);line-height:.96;margin:24px 0 26px}
.heroi h1 .bloco{display:inline-block;background:var(--am);color:var(--tinta);padding:.06em .16em 0;border-radius:.13em;transform:rotate(-3deg);box-shadow:0 .08em 0 var(--am-sombra);margin-top:.06em}
.acoes{display:flex;flex-wrap:wrap;gap:14px;margin:32px 0 16px}
.nota{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--mudo)}
.nota svg{width:18px;height:18px;flex:none;color:var(--am)}
.palco{position:relative;min-height:580px;display:flex;align-items:flex-start}
.sol{position:absolute;right:0;bottom:0;width:74%;aspect-ratio:1;border-radius:50%;border:4px solid #fff;overflow:hidden;background:var(--am)}
.sol::before{content:"";position:absolute;inset:0;background:repeating-conic-gradient(var(--am) 0 9deg,var(--am-escuro) 9deg 18deg);animation:gira 90s linear infinite}
@keyframes gira{to{transform:rotate(360deg)}}
.term{position:relative;z-index:2;width:min(100%,440px);background:#0A0A0D;border:2px solid var(--linha);border-radius:16px;box-shadow:10px 10px 0 #000;margin-top:4px}
.term-barra{display:flex;align-items:center;gap:7px;padding:12px 16px;border-bottom:1px solid var(--linha);font-size:12px;color:var(--mudo)}
.term-barra i{width:11px;height:11px;border-radius:50%;background:var(--linha)}
.term-barra i:first-child{background:var(--am)}
.term-barra span{margin-left:8px}
.term pre{font:500 13.5px/1.8 "JetBrains Mono",ui-monospace,Consolas,monospace;padding:16px 18px 20px;color:#D2D2DA;white-space:pre;overflow:hidden}
.term .l{display:block;animation:digita .55s steps(26,end) both}
.term .cmd{color:#fff}.term .cmd b{color:var(--am);font-weight:600}
.term .ok{color:var(--verde)}.term .ag{color:var(--am)}.term .fim{color:var(--am)}
.term .cursor{display:inline-block;width:.6em;height:1.1em;background:var(--am);vertical-align:-.18em;animation:cursor 1s steps(1) infinite}
.term .l:nth-child(1){animation-delay:.3s}.term .l:nth-child(2){animation-delay:.9s}.term .l:nth-child(3){animation-delay:1.25s}.term .l:nth-child(4){animation-delay:1.6s}.term .l:nth-child(5){animation-delay:1.95s}.term .l:nth-child(6){animation-delay:2.3s}.term .l:nth-child(7){animation-delay:2.65s}.term .l:nth-child(8){animation-delay:3s}.term .l:nth-child(9){animation-delay:3.35s}.term .l:nth-child(10){animation-delay:3.9s}.term .l:nth-child(11){animation-delay:4.4s}
@keyframes digita{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes cursor{50%{opacity:0}}
.masc-heroi{position:absolute;z-index:3;right:7%;bottom:0;width:48%;max-width:280px}
.balao{position:absolute;z-index:4;right:50%;bottom:10%;background:#fff;color:var(--tinta);font:400 17px/1.1 "Lilita One",sans-serif;padding:10px 14px 8px;border-radius:14px;border:3px solid var(--tinta);transform:rotate(-4deg);white-space:nowrap}
.balao::after{content:"";position:absolute;right:-14px;bottom:10px;border:9px solid transparent;border-left:14px solid var(--tinta)}

/* fita de ferramentas (marquee) */
.fita-wrap{overflow:hidden;padding:26px 0}
.fita{width:112%;margin-left:-6%;background:var(--am);color:var(--tinta);transform:rotate(-2deg);border-block:4px solid #fff;overflow:hidden}
.fita-trilho{display:flex;width:max-content;animation:rola 42s linear infinite}
.fita ul{display:flex;align-items:center;flex:none}
.fita li{font:400 26px/1 "Lilita One",sans-serif;text-transform:uppercase;padding:16px 0 13px;display:flex;align-items:center;white-space:nowrap}
.fita li::after{content:"";width:12px;height:12px;border-radius:50%;background:var(--tinta);margin:0 28px}
@keyframes rola{to{transform:translateX(-50%)}}

/* seções */
.sec{padding:clamp(60px,7.5vw,104px) 0}
.sec-topo{max-width:780px;margin-bottom:clamp(36px,5vw,60px)}
.sec-topo .lead,h2+.lead{margin-top:18px}

/* canal / pra quem */
.canal-grade{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(32px,5vw,72px);align-items:start}
.canal-grade .lead{margin:22px 0 28px}
.temas{display:flex;flex-wrap:wrap;gap:10px 10px;margin-bottom:34px}
.temas li{font-weight:700;font-size:14px;border:2px solid var(--linha);border-radius:999px;padding:7px 14px;background:var(--painel)}
.citacao{position:relative;display:grid;grid-template-columns:96px 1fr;gap:18px;align-items:center;background:var(--painel);border:2px solid var(--linha);border-radius:18px;padding:20px 22px}
.citacao p{font:400 21px/1.2 "Lilita One",sans-serif}
.citacao small{display:block;margin-top:8px;font:500 14px/1.4 Inter,sans-serif;color:var(--mudo)}
.pra-quem{display:grid;gap:18px}
.lista-bloco{background:var(--painel);border:2px solid var(--linha);border-radius:18px;padding:24px 24px 22px}
.lista-bloco h3{font-size:24px;margin-bottom:14px}
.lista-bloco li{position:relative;padding:9px 0 9px 36px;border-top:1px dashed var(--linha);font-size:16px}
.lista-bloco li:first-child{border-top:0}
.lista-bloco li::before{content:"";position:absolute;left:0;top:11px;width:22px;height:22px;border-radius:7px;background:var(--am)}
.lista-bloco li::after{content:"";position:absolute;left:7px;top:15px;width:6px;height:11px;border:solid var(--tinta);border-width:0 3px 3px 0;transform:rotate(45deg)}
.lista-bloco.nao{background:transparent;border-style:dashed}
.lista-bloco.nao li::before{background:var(--painel2);border:2px solid var(--linha)}
.lista-bloco.nao li::after{content:"\00d7";left:0;top:11px;width:22px;height:22px;border:0;transform:none;font:700 20px/21px Inter,sans-serif;text-align:center;color:var(--mudo)}

/* como funciona: escada */
.escada{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:start;counter-reset:d}
.degrau{position:relative;background:var(--painel);border:2px solid var(--linha);border-radius:20px;padding:26px 24px 28px}
.degrau:nth-child(1){margin-top:120px}.degrau:nth-child(2){margin-top:60px}
.degrau .num{font:400 64px/1 "Lilita One",sans-serif;color:transparent;-webkit-text-stroke:2px var(--linha);display:block;margin-bottom:10px}
.degrau h3{margin-bottom:10px}
.degrau p{color:#BDBDC7;font-size:16px}
.degrau .preco{position:absolute;top:-16px;right:18px}
.degrau.pago{background:var(--am);color:var(--tinta);border-color:var(--am)}
.degrau.pago .num{-webkit-text-stroke-color:rgba(17,17,20,.35)}
.degrau.pago p{color:#2A2A20}
.degrau.pago .masc-degrau{position:absolute;width:118px;left:14px;top:-106px}
.escada-pe{margin-top:34px;color:var(--mudo);font-size:15px;max-width:640px}

/* mapa (seção amarela) */
.sec-am{background:var(--am);color:var(--tinta);position:relative;overflow:hidden}
.sec-am::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(17,17,20,.12) 1.5px,transparent 1.7px);background-size:22px 22px;pointer-events:none}
.sec-am .wrap{position:relative}
.mapa-grade{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(36px,6vw,88px);align-items:center}
.capa{position:relative;max-width:420px;margin:0 auto}
.capa img{border-radius:6%/4.3%;transform:rotate(-4deg);box-shadow:16px 16px 0 var(--tinta);transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.capa:hover img{transform:rotate(-1deg) translateY(-6px)}
.capa .adesivo{position:absolute;top:-14px;right:-6px;font-size:22px;padding:10px 16px 8px;transform:rotate(8deg);z-index:2;background:#fff;border-color:var(--tinta)}
.sec-am .lead{color:#2B2B22}
.etapas{display:grid;grid-template-columns:1fr 1fr;gap:0 28px;margin:28px 0 22px;counter-reset:e}
.etapas li{counter-increment:e;display:grid;grid-template-columns:34px 1fr;gap:10px;align-items:start;padding:11px 0;border-top:2px solid rgba(17,17,20,.16)}
.etapas li::before{content:counter(e);font:400 20px/1 "Lilita One",sans-serif;background:var(--tinta);color:var(--am);width:30px;height:30px;border-radius:8px;display:grid;place-items:center;padding-top:2px}
.etapas b{display:block;font-size:16px;line-height:1.3}
.etapas span{display:block;font-size:14px;color:#4A4A3A;line-height:1.35;margin-top:2px}
.extras{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:30px}
.extras li{font-weight:800;font-size:15px;background:var(--tinta);color:var(--am);border-radius:999px;padding:7px 14px}
.nota-escura{font-size:14px;color:#3D3D30;margin-top:14px;max-width:34em}

/* produtos */
.produto{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);border:2px solid var(--linha);border-radius:26px;overflow:hidden;background:var(--painel)}
.produto+.produto{margin-top:28px}
.produto-visual{position:relative;min-height:420px;background:var(--am);display:grid;place-items:center;overflow:hidden;border-right:2px solid var(--linha)}
.produto-visual .sol-p{position:absolute;width:1500px;height:1500px;left:50%;top:50%;margin:-750px 0 0 -750px;background:repeating-conic-gradient(var(--am) 0 9deg,var(--am-escuro) 9deg 18deg);border-radius:50%;animation:gira 120s linear infinite}
.produto-visual img{position:relative;width:62%;max-width:260px}
.produto-visual .adesivo{position:absolute;left:22px;top:22px;z-index:2}
.produto-visual .etq{position:absolute;right:20px;bottom:22px;z-index:2;font:400 18px/1.1 "Lilita One",sans-serif;background:var(--tinta);color:#fff;padding:9px 13px 7px;border-radius:10px;transform:rotate(3deg)}
.produto-info{padding:clamp(26px,4vw,48px)}
.produto-info h3{font-size:clamp(30px,3.4vw,44px);margin:18px 0 14px}
.produto-info>p{color:#C3C3CC}
.produto-info h4{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--am);margin:28px 0 10px;font-weight:800}
.inclui li{position:relative;padding:7px 0 7px 26px;font-size:15.5px;color:#D7D7DF}
.inclui li::before{content:"";position:absolute;left:2px;top:15px;width:12px;height:3px;background:var(--am);border-radius:2px}
.comp{width:100%;border-collapse:collapse;font-size:15px;margin-top:4px}
.comp th,.comp td{font-weight:500;padding:10px 8px;border-bottom:1px solid var(--linha);text-align:left}
.comp thead th{font-size:13px;color:var(--mudo);font-weight:700;letter-spacing:.04em}
.comp th:not(:first-child),.comp td:not(:first-child){text-align:center;width:92px}
.comp .sim,.comp .nao{display:inline-block;width:22px;height:22px;border-radius:7px;vertical-align:middle;position:relative}
.comp .sim{background:var(--am)}
.comp .sim::after{content:"";position:absolute;left:7px;top:3px;width:6px;height:11px;border:solid var(--tinta);border-width:0 3px 3px 0;transform:rotate(45deg)}
.comp .nao{background:transparent}
.comp .nao::after{content:"";position:absolute;left:5px;top:10px;width:12px;height:2px;background:var(--linha)}
.produto-cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;margin-top:30px}
.produto-cta .preco{font:400 34px/1 "Lilita One",sans-serif}
.produto-cta .preco s{font:500 16px Inter,sans-serif;color:var(--mudo);margin-right:6px}
.aviso-beta{margin-top:18px;font-size:14px;color:var(--mudo);border-left:3px solid var(--am);padding-left:12px}

/* último vídeo */
.video-grade{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(32px,5vw,64px);align-items:center}
.video-card{position:relative;display:block;border-radius:20px;overflow:hidden;border:3px solid #fff;transform:rotate(-1.5deg);box-shadow:14px 14px 0 var(--am);transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.video-card:hover{transform:rotate(0) translateY(-4px)}
.video-card img{width:100%;aspect-ratio:16/9;object-fit:cover}
.video-card .play{position:absolute;left:16px;bottom:16px;width:68px;height:68px;border-radius:50%;background:var(--tinta);border:4px solid #fff;display:grid;place-items:center;transition:transform .2s}
.video-card .play svg{width:26px;height:26px;margin-left:4px;color:var(--am)}
.video-card:hover .play{transform:scale(1.1)}
.video-card .dur{position:absolute;right:12px;bottom:12px;background:rgba(0,0,0,.85);color:#fff;font:600 14px/1 "JetBrains Mono",monospace;padding:6px 8px;border-radius:6px}
.video-info h2{font-size:clamp(30px,3.6vw,46px);margin:20px 0 16px}
.video-info p{color:#C3C3CC}
.video-info .bt{margin-top:26px}
.video-info .agenda{margin-top:18px;font-size:14px;color:var(--mudo)}

/* ferramentas (prévia na home) */
.ferr-grade{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,5vw,72px);align-items:start}
.ferr-lado{position:sticky;top:110px}
.ferr-lado .lead{margin:20px 0 26px}
.ferr-lado img{width:150px;margin:0 0 26px 6px}
.linhas-ferr{border-top:2px solid var(--linha)}
.linhas-ferr a{display:grid;grid-template-columns:150px 1fr 28px;gap:18px;align-items:center;padding:20px 12px;border-bottom:2px solid var(--linha);text-decoration:none;transition:background-color .2s,padding .2s}
.linhas-ferr a:hover{background:var(--painel);padding-left:20px}
.linhas-ferr .cat{font:600 12px/1.3 "JetBrains Mono",monospace;text-transform:uppercase;letter-spacing:.06em;color:var(--am)}
.linhas-ferr strong{display:block;font:400 25px/1.1 "Lilita One",sans-serif;font-weight:400}
.linhas-ferr small{display:block;color:var(--mudo);font-size:15px;margin-top:4px;line-height:1.45}
.linhas-ferr svg{width:24px;height:24px;color:var(--am);transition:transform .2s}
.linhas-ferr a:hover svg{transform:translateX(5px)}
.estrela{color:var(--am)}
.aviso-mini{margin-top:18px;font-size:14px;color:var(--mudo)}

/* confiança */
.conf-grade{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) minmax(0,1fr);gap:18px}
.conf{background:var(--painel);border:2px solid var(--linha);border-radius:20px;padding:26px 24px}
.conf h3{font-size:24px;margin-bottom:10px}
.conf p{color:#BDBDC7;font-size:15.5px}
.conf p a{color:var(--am);font-weight:700}
.conf .ic{width:38px;height:38px;margin-bottom:16px;color:var(--am)}
.conf-grande{grid-row:span 2;background:var(--am);color:var(--tinta);border-color:var(--am);display:flex;flex-direction:column;justify-content:space-between;gap:24px}
.conf-grande .dias{font:400 clamp(92px,11vw,150px)/.85 "Lilita One",sans-serif;display:block}
.conf-grande .dias small{display:block;font-size:.34em;line-height:1;margin-top:10px}
.conf-grande p{color:#2A2A20;font-size:17px}
.conf-grande .lei{font:600 13px/1.4 "JetBrains Mono",monospace;border-top:2px solid rgba(17,17,20,.2);padding-top:14px}
.conf-renda{grid-column:1/-1;display:grid;grid-template-columns:130px 1fr;gap:26px;align-items:center;background:var(--painel2);border-style:dashed}
.conf-renda h3{font-size:clamp(26px,3vw,36px)}
.conf-renda img{width:120px}

/* FAQ */
.faq-grade{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:clamp(32px,5vw,80px);align-items:start}
.faq-lado{position:sticky;top:110px}
.faq-lado .lead{margin:20px 0 22px}
.faq-lado .lead a{color:var(--am);font-weight:700}
.faq-lado img{width:140px;margin-top:10px}
.faq details{border-bottom:2px solid var(--linha)}
.faq details:first-child{border-top:2px solid var(--linha)}
.faq summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:1fr 34px;gap:16px;align-items:center;padding:22px 4px;font-weight:700;font-size:clamp(17px,1.5vw,19px);line-height:1.35;transition:color .2s}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{color:var(--am)}
.faq summary i{position:relative;width:34px;height:34px;border-radius:10px;background:var(--painel);border:2px solid var(--linha);transition:background-color .2s,transform .25s}
.faq summary i::before,.faq summary i::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2.5px;margin:-1.25px 0 0 -6px;background:currentColor;border-radius:2px;transition:transform .25s}
.faq summary i::after{transform:rotate(90deg)}
.faq details[open] summary i{background:var(--am);color:var(--tinta);border-color:var(--am)}
.faq details[open] summary i::after{transform:rotate(0)}
.faq .resp{padding:0 50px 24px 4px;color:#C3C3CC;animation:abre .35s ease}
.faq .resp p+p{margin-top:10px}
.faq .resp a{color:var(--am);font-weight:700}
@keyframes abre{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* chamada final */
.final{position:relative;background:var(--painel);border:2px solid var(--linha);border-radius:28px;padding:clamp(34px,6vw,72px);display:grid;grid-template-columns:minmax(0,1fr) 230px;gap:32px;align-items:center;overflow:hidden}
.final blockquote{font:400 clamp(32px,4.6vw,58px)/1.1 "Lilita One",sans-serif;text-wrap:balance}
.final blockquote mark{background:var(--am);color:var(--tinta);padding:0 .12em;border-radius:.12em;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.final cite{display:block;font:600 14px/1.4 Inter,sans-serif;font-style:normal;color:var(--mudo);margin-top:16px}
.final .acoes{margin-bottom:0}
.final img{width:100%}

/* rodapé */
.rodape{border-top:1px solid var(--linha);margin-top:clamp(24px,4vw,48px);padding:56px 0 36px;font-size:15px;color:var(--mudo)}
.rodape-grade{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:32px}
.rodape .logo{color:var(--texto);margin-bottom:16px}
.rodape h2{font:800 13px/1 Inter,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--texto);margin-bottom:14px}
.rodape li{margin:8px 0}
.rodape a{text-decoration:none}
.rodape a:hover{color:var(--am);text-decoration:underline;text-underline-offset:3px}
.rodape-fim{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 24px;border-top:1px solid var(--linha);margin-top:40px;padding-top:22px;font-size:13.5px}

/* páginas internas */
.pag-topo{padding:clamp(40px,6vw,72px) 0 clamp(30px,4vw,48px)}
.pag-topo-grade{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px;align-items:center}
.pag-topo h1{font-size:clamp(46px,7vw,88px);line-height:.96;margin:22px 0 20px}
.pag-topo h1 .bloco{display:inline-block;background:var(--am);color:var(--tinta);padding:.06em .16em 0;border-radius:.13em;transform:rotate(-2deg)}
.pag-topo .masc{width:clamp(130px,18vw,230px)}
.pag-topo .lead+.aviso-publi,.pag-topo-grade+.aviso-publi{margin-top:30px}
.aviso-publi{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start;background:var(--painel);border:2px dashed var(--am);border-radius:18px;padding:18px 20px;font-size:15.5px;color:#C9C9D2;max-width:880px}
.aviso-publi b{color:var(--texto)}
.aviso-publi .adesivo{justify-self:start}
.filtros{border:0;display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:44px 0 28px}
.filtros legend{float:left;margin-right:6px;font:600 13px/1 "JetBrains Mono",monospace;text-transform:uppercase;letter-spacing:.06em;color:var(--mudo)}
.filtros label{cursor:pointer;display:inline-flex;align-items:center;gap:7px;font-weight:700;font-size:14px;border:2px solid var(--linha);border-radius:999px;padding:8px 14px;background:var(--painel);transition:border-color .2s,background-color .2s,color .2s}
.filtros label:hover{border-color:var(--am)}
.filtros label span{font:600 12px/1 "JetBrains Mono",monospace;color:var(--mudo)}
.filtros input:checked+label{background:var(--am);border-color:var(--am);color:var(--tinta)}
.filtros input:checked+label span{color:var(--tinta)}
.filtros input:focus-visible+label{outline:3px solid var(--am);outline-offset:3px}
.grade-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:18px}
.card{position:relative;display:flex;flex-direction:column;gap:10px;background:var(--painel);border:2px solid var(--linha);border-radius:20px;padding:24px 22px 22px;transition:transform .2s,border-color .2s,box-shadow .2s}
.card:hover{transform:translateY(-4px);border-color:var(--am);box-shadow:8px 8px 0 var(--am)}
.card .cat{font:600 12px/1 "JetBrains Mono",monospace;text-transform:uppercase;letter-spacing:.06em;color:var(--am)}
.card h3{font-size:28px}
.card p{color:#BDBDC7;font-size:15.5px;flex:1}
.card a{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;font-weight:800;text-decoration:none;color:var(--am);padding:4px 0}
.card a::after{content:"";position:absolute;inset:0;border-radius:20px}
.card a svg{width:18px;height:18px;transition:transform .2s}
.card:hover a svg{transform:translateX(4px)}
.card .af{position:absolute;top:-12px;right:16px;font-size:13px}
.como-escolho{margin-top:64px;display:grid;grid-template-columns:120px 1fr;gap:24px;align-items:center;background:var(--painel2);border-radius:20px;padding:26px}
.como-escolho img{width:110px}
.como-escolho h2{font-size:clamp(26px,3vw,34px);margin-bottom:8px}
.como-escolho p{color:#C3C3CC}
.doc{max-width:780px}
.doc h2{font-size:clamp(26px,3vw,34px);margin:40px 0 12px}
.doc p,.doc li{color:#C9C9D2}
.doc p+p{margin-top:12px}
.doc ul{margin-top:10px}
.doc li{position:relative;padding:5px 0 5px 24px}
.doc li::before{content:"";position:absolute;left:2px;top:16px;width:10px;height:3px;background:var(--am);border-radius:2px}
.doc a{color:var(--am);font-weight:700}
.doc .data{font:600 13px/1 "JetBrains Mono",monospace;color:var(--mudo);margin-top:8px}
.aviso-grade{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.8fr);gap:40px;align-items:center;padding:clamp(40px,7vw,96px) 0}
.aviso-grade h1{font-size:clamp(50px,8vw,104px);line-height:.95;margin:22px 0 22px}
.aviso-grade .masc{width:min(100%,360px);margin:0 auto}
.codigo-erro{font:600 14px/1 "JetBrains Mono",monospace;color:var(--mudo);margin-top:22px}

/* revelar no scroll (a classe .js vem de site.js; sem JS tudo aparece normal) */
.js .revela{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.js .revela.visivel{opacity:1;transform:none}
.js .revela.d1{transition-delay:.08s}.js .revela.d2{transition-delay:.16s}.js .revela.d3{transition-delay:.24s}.js .revela.d4{transition-delay:.32s}

/* responsivo */
@media (max-width:1020px){
 .nav ul{gap:18px}
 .conf-grade{grid-template-columns:1fr 1fr}
 .conf-grande{grid-row:auto;grid-column:1/-1}
}
@media (max-width:900px){
 .nav{display:none}.menu-cel{display:block}
 .heroi-grade,.canal-grade,.mapa-grade,.video-grade,.ferr-grade,.faq-grade,.produto,.aviso-grade{grid-template-columns:minmax(0,1fr)}
 .palco{min-height:0;padding-bottom:210px;max-width:520px}
 .sol{width:62%;right:2%}
 .masc-heroi{width:42%;right:8%;bottom:0}
 .balao{right:48%;bottom:18%}
 .escada{grid-template-columns:minmax(0,1fr);gap:26px}
 .degrau:nth-child(1),.degrau:nth-child(2){margin-top:0}
 .degrau.pago{margin-top:70px}
 .ferr-lado,.faq-lado{position:static}
 .produto-visual{min-height:300px;border-right:0;border-bottom:2px solid var(--linha)}
 .produto-visual img{width:44%}
 .capa{max-width:320px}
 .final{grid-template-columns:minmax(0,1fr)}
 .final img{width:150px;order:-1}
 .rodape-grade{grid-template-columns:1fr 1fr}
 .rodape-grade>div:first-child{grid-column:1/-1}
 .aviso-grade .masc{width:220px;order:-1;margin:0}
}
@media (max-width:600px){
 body{font-size:16px}
 .wrap{padding:0 18px}
 .topo .wrap{height:64px}
 .logo{font-size:22px}.logo img{width:34px;height:34px}
 .heroi h1{font-size:clamp(46px,13.4vw,64px)}
 .acoes .bt{width:100%}
 .term pre{font-size:11.6px;padding:14px 14px 16px}
 .palco{padding-bottom:170px}
 .sol{width:66%}
 .masc-heroi{width:44%;right:4%}
 .balao{font-size:15px;right:46%;bottom:16%}
 .fita li{font-size:20px;padding:13px 0 10px}
 .fita li::after{margin:0 18px;width:9px;height:9px}
 .etapas{grid-template-columns:1fr}
 .citacao{grid-template-columns:64px 1fr;padding:18px}
 .citacao p{font-size:18px}
 .linhas-ferr a{grid-template-columns:1fr 24px;gap:6px 12px;padding:18px 6px}
 .linhas-ferr .cat{grid-column:1/-1}
 .linhas-ferr a:hover{padding-left:10px}
 .conf-grade{grid-template-columns:1fr}
 .conf-renda{grid-template-columns:1fr;gap:14px}
 .conf-renda img{width:92px}
 .comp{font-size:14px}
 .comp th:not(:first-child),.comp td:not(:first-child){width:64px}
 .comp thead th{font-size:12px}
 .produto-info h3{margin-top:14px}
 .faq .resp{padding-right:4px}
 .pag-topo-grade{grid-template-columns:1fr}
 .pag-topo .masc{display:none}
 .aviso-publi{grid-template-columns:1fr}
 .como-escolho{grid-template-columns:1fr}
 .como-escolho img{width:84px}
 .rodape-grade{grid-template-columns:1fr 1fr}
 .video-card{box-shadow:8px 8px 0 var(--am)}
 .capa img{box-shadow:10px 10px 0 var(--tinta)}
 .capa{max-width:260px}
 .faq-lado img{display:none}
 .rodape-grade>div:nth-child(3){grid-column:1/-1;order:3}
 .rodape-grade>div:nth-child(4){order:2}
}
@media (prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*::before,*::after{animation:none!important;transition:none!important}
 .js .revela{opacity:1;transform:none}
 .fita-trilho ul+ul{display:none}
}
@media print{.js .revela{opacity:1;transform:none}.topo,.fita-wrap{display:none}}

/* filtro de categorias de /ferramentas (gerado) */
.ferr-pag:has(#f-imagem-e-video:checked) .card:not([data-cat="imagem-e-video"]){display:none}
.ferr-pag:has(#f-pagina-e-e-mail:checked) .card:not([data-cat="pagina-e-e-mail"]){display:none}
.ferr-pag:has(#f-som:checked) .card:not([data-cat="som"]){display:none}
.ferr-pag:has(#f-cerebro:checked) .card:not([data-cat="cerebro"]){display:none}
.ferr-pag:has(#f-montagem:checked) .card:not([data-cat="montagem"]){display:none}