:root{color-scheme:dark;--bg:#090b0a;--text:#eeeae0;--muted:#a6afa8;--green:#72ac87;font-family:Arial,Helvetica,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text)}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;background:transparent;cursor:pointer;border:1px solid #425046;border-radius:0;min-height:44px;padding:10px 16px}button:disabled{opacity:.45;cursor:wait}a:focus-visible,button:focus-visible,canvas:focus-visible{outline:2px solid var(--green);outline-offset:5px}[hidden]{display:none!important}.skip{position:fixed;left:16px;top:-80px;z-index:20;background:#152b1c;padding:12px}.skip:focus{top:12px}header{height:86px;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;position:absolute;inset:0 0 auto;z-index:4}.brand{display:flex;gap:12px;align-items:center;font-size:22px;letter-spacing:-1px}nav{display:flex;gap:28px;font-size:14px}.experience{height:260svh;position:relative}.stage{height:100svh;min-height:650px;position:sticky;top:0;overflow:hidden;display:grid;grid-template-columns:35% 65%;align-items:center;padding:110px 5vw 110px;background:radial-gradient(ellipse at 70% 40%,#15241b 0,#090b0a 65%)}.intro{z-index:2}.eyebrow{font:12px/1.7 monospace;letter-spacing:.12em;color:var(--muted)}h1{font-size:clamp(68px,7vw,126px);line-height:.94;letter-spacing:-.07em;font-weight:500;margin:38px 0 28px}em{font-style:normal;color:var(--green)}.lead{font-size:clamp(21px,2.1vw,32px);line-height:1.25;letter-spacing:-.025em}.hint{font-size:14px;color:var(--muted);margin:28px 0}.phase-tabs{display:flex;flex-wrap:wrap;gap:4px}.phase-tabs button{border:0;border-bottom:1px solid #3b4940;font-size:12px;padding:9px 10px;color:var(--muted)}.phase-tabs button[aria-pressed=true]{border-color:var(--green);color:var(--text)}.phase-copy{font-size:15px;max-width:29ch;line-height:1.6;color:var(--muted);min-height:4em}.visual{position:relative;height:100%;min-height:380px;display:flex;align-items:center}.model-stage{width:100%;height:100%;position:relative;transition:width .65s ease}.model-stage canvas,.model-stage>img{width:100%;height:100%;object-fit:contain;display:block}.model-stage canvas{touch-action:pan-y;cursor:default}.manual .model-stage canvas{cursor:grab;touch-action:none}.manual .model-stage canvas:active{cursor:grabbing}.model-stage>img{mix-blend-mode:luminosity;object-fit:contain;opacity:.92}.model-label{position:absolute;bottom:0;left:50%;transform:translateX(-50%);white-space:nowrap;font:10px monospace;letter-spacing:.06em;color:var(--muted)}.load-model{position:absolute;bottom:52px;left:50%;transform:translateX(-50%);background:#11261b;white-space:nowrap}.physical{position:absolute;right:0;width:45%;margin:0;opacity:0;transform:translateY(35px);transition:opacity .65s,transform .65s;pointer-events:none}.physical img{width:100%;height:auto;display:block}.physical figcaption{font:10px/1.6 monospace;margin-top:15px;color:var(--muted);letter-spacing:.05em}.compare .model-stage{width:52%}.compare .physical{opacity:1;transform:none}.bottom{position:absolute;bottom:35px;left:5vw;right:5vw;display:flex;align-items:center;justify-content:space-between;gap:20px}.bottom p{font-size:12px;line-height:1.5;max-width:52ch;color:var(--muted)}.controls{display:flex;gap:8px}.controls button{font-size:13px}#explore{background:var(--text);color:var(--bg);border-color:var(--text)}.progress{position:absolute;bottom:0;left:0;right:0;height:2px;background:#233328}.progress span{display:block;background:var(--green);height:100%;transform:scaleX(0);transform-origin:left}.after{max-width:1100px;padding:110px 5vw 130px;margin:auto}.after h2{font-size:clamp(38px,5.4vw,76px);font-weight:400;letter-spacing:-.05em;line-height:1.06}.after>p:not(.eyebrow){font-size:19px;line-height:1.7;max-width:58ch;color:var(--muted)}.links{display:flex;gap:30px;flex-wrap:wrap;margin-top:35px}.links a{border-bottom:1px solid var(--green);padding-bottom:10px}footer{border-top:1px solid #26342a;padding:32px 5vw 90px;display:flex;justify-content:space-between;gap:30px;font-size:13px;color:var(--muted)}.whatsapp{position:fixed;bottom:18px;right:20px;padding:13px 18px;background:#173a27;border:1px solid #3c7350;z-index:5;font-size:13px}.paused .physical,.paused .model-stage{transition:none}@media(max-width:800px),(max-height:650px){header{position:relative;height:76px;padding:0 6vw}nav{gap:16px;font-size:12px}.experience{height:auto}.stage{position:relative;height:auto;min-height:0;display:flex;flex-direction:column;padding:26px 6vw 36px;overflow:visible;align-items:stretch}.intro{width:100%}h1{font-size:clamp(62px,17vw,98px);margin:20px 0}.lead{font-size:23px}.hint{display:none}.phase-copy{min-height:0}.visual{height:64svh;min-height:330px;max-height:700px;display:block}.model-stage{height:100%;width:100%}.model-label{font-size:9px}.physical{position:relative;opacity:1;transform:none;width:100%;margin:40px 0 0;pointer-events:auto}.compare .model-stage{width:100%}.visual{height:auto;max-height:none}.model-stage{height:62svh;min-height:320px;max-height:680px}.physical img{max-height:70svh;object-fit:contain}.physical figcaption{text-align:center}.bottom{position:static;display:flex;flex-direction:column;align-items:stretch;margin-top:35px;gap:8px}.controls{flex-wrap:wrap}.bottom p{font-size:13px}.progress{display:none}.after{padding:70px 6vw}.after>p:not(.eyebrow){font-size:17px}footer{flex-direction:column;padding:28px 6vw 100px}.phase-tabs button{font-size:12px;padding:12px}.whatsapp{bottom:14px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.experience{height:auto}.stage{position:relative}.physical,.model-stage{transition:none}.hint{display:none}}body.reduced .experience{height:auto}body.reduced .stage{position:relative}body.reduced .physical{opacity:1;transform:none}body.reduced .model-stage{width:52%}@media(max-width:800px),(max-height:650px){body.reduced .model-stage{width:100%}}

.whatsapp{width:56px;height:56px;padding:0;border-radius:50%;display:flex;align-items:center;justify-content:center}.whatsapp svg{width:28px;height:28px}

.whatsapp{background:#25D366;color:#fff;border:0}.whatsapp:hover{background:#1fb85a}
/* Touch targets and phone safe areas */
.controls button{min-width:44px}
.whatsapp{bottom:calc(18px + env(safe-area-inset-bottom,0px))}
@media(max-width:800px),(max-height:650px){nav a,.links a,footer>a{display:inline-flex;align-items:center;min-height:44px}nav{font-size:14px;gap:16px;flex-wrap:wrap}header{height:auto;min-height:76px;gap:12px;flex-wrap:wrap;padding-block:12px}.whatsapp{bottom:calc(14px + env(safe-area-inset-bottom,0px))}}
