/* ===== Home v2: hero assimétrico + produto em camadas ===== */
:root{--o5:oklch(.6559 .2328 34.52);--o7:oklch(.4829 .1679 34.5);--o1:oklch(.94 .04 36);--o05:oklch(.975 .015 36);--n9:oklch(.2046 0 0);--n6:oklch(.4017 0 0);--n5:oklch(.52 0 0);--n2:oklch(.86 0 0);--n1:oklch(.9249 0 0);--n025:oklch(.9851 0 0);
--sh:0.5px 1px 1px oklch(.2046 0 0/.05),1px 2px 2px oklch(.2046 0 0/.05),2px 4px 4px oklch(.2046 0 0/.05),4px 8px 8px oklch(.2046 0 0/.05),16px 32px 48px oklch(.2046 0 0/.10);--xo:cubic-bezier(.16,1,.3,1)}
.hv-hero{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,3vw,48px);align-items:center;padding:clamp(56px,7vw,104px) clamp(20px,4vw,64px) clamp(64px,7vw,112px);max-width:1440px;margin:0 auto;min-height:min(88vh,860px)}
.hv-wave{position:absolute;inset:-10% -12% -20% 28%;background:url(assets/hp/wave.webp) center/cover no-repeat;z-index:0;animation:hvWave 18s ease-in-out infinite alternate;transform-origin:70% 70%}
.hv-grain{position:absolute;inset:0;width:100%;height:100%;z-index:1;opacity:.22;mix-blend-mode:multiply;pointer-events:none}
@keyframes hvWave{to{transform:scale(1.08) translate(-2%,-3%)}}
.hv-copy{position:relative;z-index:3}
.hv-kick{display:inline-flex;align-items:center;gap:10px;font:500 13px/1 "Departure Mono",ui-monospace,monospace;letter-spacing:.02em;color:var(--n6);background:#fff;border:1px solid var(--n1);padding:8px 12px;border-radius:999px;margin:0 0 28px}
.hv-live{width:8px;height:8px;border-radius:50%;background:#FF4000;box-shadow:0 0 0 0 rgb(255 64 0/.5);animation:hvPulse 1.6s infinite;flex:none;display:inline-block}
@keyframes hvPulse{70%{box-shadow:0 0 0 8px rgb(255 64 0/0)}100%{box-shadow:0 0 0 0 rgb(255 64 0/0)}}
.hv-h1{font-family:Geist,system-ui,sans-serif;font-weight:700;font-size:clamp(2.5rem,4.4vw,4.25rem);line-height:1.02;letter-spacing:-.04em;color:#000;margin:0 0 24px;max-width:14ch}
.hv-h1 em{font-style:normal;color:#FF4000}
.hv-lead{font-size:clamp(1.0625rem,1.2vw,1.25rem);line-height:1.5;color:var(--n6);max-width:40ch;margin:0 0 32px}
.hv-cta{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:32px}
.hv-assure{list-style:none;padding:0;margin:0;display:grid;gap:10px;font-size:14px;color:var(--n6)}
.hv-assure li{display:flex;gap:10px;align-items:center}.hv-assure li:before{content:"";width:8px;height:8px;background:#000;flex:none}
/* palco */
.hv-stage{position:relative;z-index:2;height:600px;perspective:1800px}
.hv-tilt{position:absolute;inset:0;transform:rotateY(-9deg) rotateX(5deg) rotateZ(.5deg);transform-style:preserve-3d;transform-origin:30% 50%}
.hv-note{position:absolute;right:4px;bottom:-30px;margin:0;font-size:11px;color:#000;opacity:.7;letter-spacing:.06em;text-transform:uppercase}
.hw{position:absolute;background:#fff;border-radius:12px;box-shadow:var(--sh),0 0 0 1px oklch(.2046 0 0/.06);font-family:Geist,system-ui,sans-serif;color:var(--n9);overflow:hidden}
.mono,.hw .mono{font-family:"Departure Mono",ui-monospace,monospace}
.hw-main{left:0;top:20px;width:760px;height:500px;transform:translateZ(0)}
.hw-bar{height:30px;display:flex;align-items:center;gap:6px;padding:0 12px;background:var(--n025);border-bottom:1px solid var(--n1)}
.hw-bar i{width:9px;height:9px;border-radius:50%;background:var(--n2)}.hw-bar span{margin-left:14px;font:11px "Departure Mono",monospace;color:var(--n5);background:#fff;border:1px solid var(--n1);border-radius:6px;padding:3px 10px}
.ap{display:grid;grid-template-columns:168px 1fr;height:calc(100% - 30px)}
.ap-side{border-right:1px solid var(--n1);padding:14px 10px;display:flex;flex-direction:column;gap:12px;background:var(--n025);font-size:12.5px}
.ap-org{display:flex;align-items:center;gap:8px;font-size:13px}.ap-org svg{width:18px;height:18px;fill:#FF4000}
.ap-scope{border:1px solid var(--n1);background:#fff;border-radius:8px;padding:7px 9px;font:11px "Departure Mono",monospace}.ap-scope small{display:block;color:var(--n5);margin-top:3px}
.ap-side nav{display:grid;gap:1px}.ap-side nav a{padding:6px 8px;border-radius:6px;color:var(--n6);display:flex;justify-content:space-between}
.ap-side nav a.on{background:#fff;color:#000;font-weight:600;box-shadow:0 0 0 1px var(--n1)}.ap-side nav em{font-style:normal;font:10px "Departure Mono",monospace;background:#FF4000;color:#fff;border-radius:4px;padding:2px 5px}
.ap-guard{margin-top:auto;border:1px solid var(--n2);border-radius:8px;padding:8px;font-size:11.5px}.ap-guard span{display:block;font-size:10px;color:var(--n5)}
.ap-main{display:flex;flex-direction:column;min-width:0}
.ap-top{height:46px;display:flex;align-items:center;gap:12px;padding:0 16px;border-bottom:1px solid var(--n1);font-size:12.5px}
.ap-crumb i{color:var(--n2);font-style:normal}.ap-search{flex:1;max-width:200px;border:1px solid var(--n1);border-radius:6px;padding:5px 9px;color:var(--n5);font-size:11.5px}
.ap-run{margin-left:auto;display:flex;align-items:center;gap:8px;font:11px "Departure Mono",monospace;color:var(--n6)}
.ap-filters{display:flex;gap:6px;padding:12px 16px 8px;font-size:11.5px}.ap-filters span{padding:4px 9px;border-radius:999px;border:1px solid var(--n1);color:var(--n6)}.ap-filters .on{background:#000;color:#fff;border-color:#000}
.ap-table{padding:0 16px;font-size:12.5px}
.ap-th,.ap-tr{display:grid;grid-template-columns:70px 1fr 82px 104px 74px;gap:10px;align-items:center;padding:9px 6px;border-bottom:1px solid var(--n1)}
.ap-th{font:10px "Departure Mono",monospace;color:var(--n5);text-transform:uppercase;letter-spacing:.04em;padding:6px}
.ap-tr small{display:block;font:10.5px "Departure Mono",monospace;color:var(--n5);margin-top:2px}.ap-tr>.mono{font-size:10.5px;color:var(--n6)}
.ow{font-size:11px;color:var(--n5)}
.sv{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:600}.sv:before{content:"";width:9px;height:9px;flex:none}
.sv-c:before{background:var(--o7)}.sv-h:before{background:#FF4000}.sv-m:before{background:oklch(.78 .16 36)}.sv-l:before{border:1.5px solid var(--n5)}
.st{position:relative;display:inline-grid}.st b{grid-area:1/1;font-weight:500;font-size:11px;padding:3px 8px;border-radius:999px;border:1px solid var(--n2);white-space:nowrap;justify-self:start;color:var(--n6)}
.ap-tr .st b:not(.st-a){background:var(--n025)}
.st-a{border-style:dashed!important;animation:stA 10s infinite}.st-b{background:#000!important;color:#fff!important;border-color:#000!important;opacity:0;animation:stB 10s infinite}
@keyframes stA{0%,44%{opacity:1}48%,100%{opacity:0}}@keyframes stB{0%,46%{opacity:0;transform:scale(.8)}52%,96%{opacity:1;transform:none}100%{opacity:0}}
.ap-new{animation:rowIn 10s var(--xo) infinite;transform-origin:top}
@keyframes rowIn{0%,8%{background:var(--o05);opacity:0;transform:translateY(-8px)}14%{opacity:1;transform:none;background:var(--o1)}40%{background:var(--o05)}60%,100%{background:transparent;opacity:1}}
/* detalhe */
.hw-detail{right:-8px;top:-6px;width:330px;padding:18px;transform:translateZ(60px);font-size:12.5px}
.dt-head{display:flex;justify-content:space-between;align-items:center;font-size:10.5px;color:var(--n6)}
.hw-detail h3{font-size:17px;line-height:1.2;letter-spacing:-.02em;margin:10px 0 12px;font-weight:650}
.dt-cvss{display:flex;gap:12px;align-items:center;padding:10px;background:var(--o05);border-radius:8px;margin-bottom:12px;line-height:1.3}.dt-cvss b{font-size:28px;letter-spacing:-.03em;color:#FF4000}.dt-cvss small{font-size:9.5px;color:var(--n6)}
.dt-steps{margin:0 0 12px;padding-left:18px;display:grid;gap:4px;color:var(--n6)}
.dt-proof{margin:0 0 12px;background:#000;color:#eee;border-radius:8px;padding:10px;font-size:10.5px;line-height:1.55;white-space:pre-wrap}.dt-proof .k{color:#FF7A45}.dt-proof u{text-decoration-color:#FF4000}
.dt-val{display:flex;gap:10px;align-items:center;margin-bottom:12px;opacity:.35;animation:valOn 10s infinite}.dt-val small{display:block;color:var(--n5);font-size:11px}
@keyframes valOn{0%,46%{opacity:.25}52%,100%{opacity:1}}
.dt-av{width:28px;height:28px;border-radius:50%;background:#FFD2BF;display:grid;place-items:center;font-weight:700;font-size:11px}
.dt-act{display:flex;gap:8px}.dt-act span{flex:1;text-align:center;padding:8px;border-radius:7px;font-size:12px;font-weight:600}.b1{background:#FF4000;color:#fff;animation:press 10s infinite}.b2{border:1px solid var(--n2)}
@keyframes press{0%,60%,66%,100%{transform:none}63%{transform:scale(.94)}}
/* superfície */
.hw-surf{left:-36px;bottom:-24px;width:250px;padding:14px;transform:translateZ(90px)}
.sf-h{display:flex;justify-content:space-between;font-size:12px}.sf-h .mono{font-size:10px;color:var(--n5)}
.hw-surf svg{width:100%;height:auto;margin:6px 0}.sf-e path{stroke:var(--n2);stroke-width:1.2;fill:none}
.sf-n circle{fill:#000}.sf-n .c0{fill:#FF4000}.sf-n .hot{fill:#FF4000;animation:hot 1.6s infinite;transform-box:fill-box;transform-origin:center}.sf-n .new{fill:#fff;stroke:#FF4000;stroke-width:1.5;stroke-dasharray:3 2;animation:spin 6s linear infinite;transform-box:fill-box;transform-origin:center}
@keyframes hot{50%{transform:scale(1.5)}}@keyframes spin{to{transform:rotate(360deg)}}
.sf-bars{display:flex;gap:5px;align-items:end;height:34px}.sf-bars span{flex:1;height:var(--h);background:var(--o1);border-radius:2px}.sf-bars span:last-child{background:#FF4000}
/* feed */
.hw-feed{left:300px;bottom:-44px;width:330px;padding:12px 14px;background:#0b0b0b;color:#eee;transform:translateZ(120px)}
.fd-h{display:flex;gap:8px;align-items:center;font-size:12px;margin-bottom:8px}
.hw-feed ul{list-style:none;margin:0;padding:0;font-size:10.5px;line-height:1.75}.hw-feed i{font-style:normal;color:#777;margin-right:8px}
.hw-feed li{opacity:0;animation:feed 10s infinite}.hw-feed li:nth-child(2){animation-delay:.9s}.hw-feed li:nth-child(3){animation-delay:1.8s}.hw-feed li:nth-child(4){animation-delay:4.4s}
.hw-feed .hit{color:#FF7A45}.hw-feed .ok:after{content:" ✓";color:#FF7A45}
@keyframes feed{0%{opacity:0;transform:translateX(-6px)}4%,88%{opacity:1;transform:none}96%,100%{opacity:0}}
/* toast */
.hw-toast{right:16px;bottom:34px;display:flex;gap:10px;align-items:center;padding:12px 14px;font-size:12.5px;transform:translateZ(150px);animation:toast 10s var(--xo) infinite;border-left:3px solid #FF4000}
.hw-toast small{display:block;color:var(--n5);font-size:11px}.tk{width:24px;height:24px;border-radius:6px;background:#000;color:#fff;display:grid;place-items:center;font-size:13px}
@keyframes toast{0%,62%{opacity:0;transform:translateZ(150px) translateY(16px)}67%,94%{opacity:1;transform:translateZ(150px)}100%{opacity:0;transform:translateZ(150px)}}
/* ilustrações dos passos */
.hp-step .ill{position:relative;aspect-ratio:1/1;display:grid;place-items:center;margin-bottom:20px;background:radial-gradient(60% 50% at 50% 60%,#FFD2BF 0,rgb(255 210 191/0) 70%);border-radius:16px;overflow:hidden}
.hp-step .ill img{width:86%;height:auto;max-height:92%;object-fit:contain;background:none!important;border:0!important;box-shadow:none!important;aspect-ratio:auto!important;animation:float 6s ease-in-out infinite;filter:drop-shadow(0 18px 18px rgb(0 0 0/.12))}
.ill-attack img{animation-delay:-2s!important}.ill-confirm img{animation-delay:-4s!important}
@keyframes float{50%{transform:translateY(-10px) rotate(-.6deg)}}
.ill-fx{position:absolute;inset:0;pointer-events:none;z-index:2}
.ill-map .ill-fx{background:conic-gradient(from 0deg at 50% 55%,rgb(255 64 0/.22),rgb(255 64 0/0) 18%);border-radius:50%;inset:8%;animation:spin 5s linear infinite;mix-blend-mode:multiply}
.ill-attack .ill-fx:before,.ill-attack .ill-fx:after{content:"";position:absolute;left:52%;top:50%;width:14px;height:14px;margin:-7px;border-radius:50%;border:2px solid #FF4000;animation:ping 2.2s var(--xo) infinite}
.ill-attack .ill-fx:after{animation-delay:1.1s}
@keyframes ping{0%{transform:scale(.5);opacity:1}100%{transform:scale(9);opacity:0}}
.ill-confirm .ill-fx{background:linear-gradient(180deg,rgb(255 64 0/0),rgb(255 64 0/.18) 48%,#FF4000 50%,rgb(255 64 0/0) 52%);background-size:100% 40%;background-repeat:no-repeat;animation:scan 3.4s ease-in-out infinite;mix-blend-mode:multiply}
@keyframes scan{0%{background-position:0 -40%}100%{background-position:0 140%}}
/* responsivo */
@media (max-width:1180px){.hv-stage{transform:scale(.82);transform-origin:left center;height:520px}}
@media (max-width:960px){.hv-hero{grid-template-columns:1fr;min-height:0}.hv-wave{inset:40% -30% -10% -20%}.hv-stage{height:520px;transform:scale(.62);transform-origin:left top;width:760px;margin-bottom:-180px}.hv-h1{max-width:16ch}}
@media (max-width:560px){.hv-stage{transform:scale(.44);margin-bottom:-280px}.hw-feed{display:none}}
@media (prefers-reduced-motion:reduce){.hv-hero *,.hp-step .ill *{animation:none!important}.st-a,.dt-val{opacity:1}.st-b{opacity:0}.hw-feed li{opacity:1}.hw-toast{opacity:1}}
.hv-grain{inset:-10% -12% -20% 28%;width:auto;height:auto;opacity:.16;-webkit-mask:url(assets/hp/wave.webp) center/cover;mask:none;mix-blend-mode:overlay}
.hv-note{top:-18px;bottom:auto;left:8px;right:auto}
.hw-main{width:800px}.ap{grid-template-columns:150px 1fr}
@media (max-width:960px){.hv-grain{inset:40% -30% -10% -20%}}
.hv-wave,.hv-grain{-webkit-mask:linear-gradient(90deg,transparent,#000 22%);mask:linear-gradient(90deg,transparent,#000 22%)}
@media (max-width:960px){.hv-hero{grid-template-columns:minmax(0,1fr)}.hv-stage{width:100%;transform:none;margin-bottom:0;height:calc(600px*.5)}.hv-tilt{width:1130px;transform:scale(.5) rotateY(-6deg) rotateX(4deg);transform-origin:left top}}
@media (max-width:560px){.hv-stage{transform:none;margin-bottom:0;height:calc(600px*.32)}.hv-tilt{transform:scale(.28);}.hv-h1{font-size:2.25rem}}
