/* Persistent 3D atmosphere with readable, independent content layers. */
body{isolation:isolate}
.scene-layer{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;background:radial-gradient(ellipse at 95% 15%,#ff33482c,transparent 50%),radial-gradient(ellipse at 0% 70%,#4bdbe81c,transparent 45%)}
main,footer{position:relative;z-index:1}
.scene-layer canvas{display:block;width:100%;height:100%;mask-image:linear-gradient(90deg,#000 0%,#0006 35%,#0006 65%,#000 100%)}
.game-theme .scene-layer{background:radial-gradient(ellipse at 90% 30%,#eab44b1c,transparent 60%)}
header{perspective:900px;background:#080a12df;backdrop-filter:blur(16px);box-shadow:0 10px 40px #0004}
nav{perspective:850px;align-items:center;padding-block:12px}
.depth-link{position:relative;display:inline-block;transform-style:preserve-3d;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .18s ease,background .2s,box-shadow .2s;border-radius:5px}
nav .depth-link{padding:9px 5px;border-bottom:2px solid transparent}
nav .depth-link:hover,nav .depth-link:focus-visible{background:#ff334818;box-shadow:0 6px 0 #651724,0 12px 22px #0007;transform:perspective(600px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(-4px) translateZ(12px);color:#fff}
nav .depth-link.active{border-bottom-color:var(--accent);background:#ffffff07}
.game-theme nav .depth-link:hover,.game-theme nav .depth-link:focus-visible{background:#edb85120;box-shadow:0 6px 0 #67481e,0 12px 22px #0007}
.lang:hover{transform:perspective(600px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateZ(10px);box-shadow:0 5px 0 #323c54}
.motion-toggle{position:fixed;bottom:18px;inset-inline-end:18px;z-index:15;border:1px solid #ffffff38;border-radius:30px;padding:7px 14px;background:#0c101ee8;color:#dbe1f0;font-size:11px;box-shadow:0 6px 22px #0005;backdrop-filter:blur(10px)}
.motion-toggle:hover{border-color:var(--accent);color:white}
.motion-paused .depth-link,.motion-paused .depth-link:hover{transform:none!important}
.motion-paused .browser-orbit{animation-play-state:paused}
.play-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:40px}
.play-step{position:relative;border:1px solid #d4a45b55;background:linear-gradient(140deg,#38291ce8,#17120fea);padding:28px;overflow:hidden;border-radius:2px}
.step-top{display:flex;justify-content:space-between;align-items:center;color:#ebbc73;font:14px Arial}
.step-top b{font-size:42px;font-weight:400}.play-step h3{font-size:22px;color:#ffe6b9}.play-step p{font-size:14px}
.puzzle-loop{display:flex;justify-content:center;flex-wrap:wrap;gap:22px;border-block:1px solid #bd924b40;padding:22px;margin-top:30px;color:#f1c680}
.build-story{display:grid;grid-template-columns:1fr 1fr;gap:60px}.build-stack article{display:flex;gap:24px;border-bottom:1px solid #dbb16a40;padding:18px 0}.build-stack article>span{color:#eebd6c;font:26px Arial;padding-top:20px}.build-stack h3{margin:10px 0}.build-stack p{font-size:14px}
.browser-teaser{display:grid;grid-template-columns:1.2fr 1fr;gap:55px;align-items:center}.browser-teaser h2{font-weight:bold}.browser-teaser p{max-width:650px}.browser-emblem{position:relative;min-height:340px;display:flex;flex-direction:column;align-items:center;justify-content:center;isolation:isolate;background:radial-gradient(ellipse,#f52b4926,transparent 68%);overflow:hidden}.browser-emblem strong{font:900 clamp(40px,6vw,72px)/.96 Arial;letter-spacing:-3px;transform:skewY(-5deg);text-shadow:4px 5px #4c1426}.browser-emblem em{color:#ff3f56;font-style:normal}.browser-emblem>span{font:11px Arial;letter-spacing:5px;margin-top:30px;color:#77e8f4}.browser-orbit{position:absolute;width:250px;height:250px;border:2px solid #57d4e8;border-radius:25px;transform:perspective(650px) rotateX(60deg) rotateZ(30deg);animation:portal-orbit 14s linear infinite;z-index:-1;box-shadow:0 0 40px #50e4f118,inset 0 0 40px #50e4f118}.browser-orbit:after{content:'';position:absolute;inset:-38px;border:1px solid #ff405b;border-radius:50%}@keyframes portal-orbit{to{transform:perspective(650px) rotateX(60deg) rotateZ(390deg)}}
.direct-contact{max-width:1160px;margin:0 auto 50px;padding:28px 5%;display:flex;align-items:center;justify-content:space-between;gap:30px;background:#10281de8;border:1px solid #31d18a55}.direct-contact h2{font-size:28px;margin:0}.whatsapp-btn{background:#146d43;border-color:#33cc85;flex-wrap:wrap}.whatsapp-btn:hover{background:#198653}.whatsapp-float{position:fixed;bottom:64px;inset-inline-end:18px;z-index:15;display:flex;align-items:center;gap:9px;background:#12613d;color:#fff;border:1px solid #53e29d;border-radius:30px;padding:10px 18px;font-size:13px;box-shadow:0 8px 25px #0006}.whatsapp-float:hover{background:#198653}.whatsapp-float span{font:22px Arial}
.footer-identity{width:100%;border-block:1px solid #ffffff20;padding:35px 0;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:25px}.identity-heading{max-width:360px}.identity-heading .eyebrow{margin-bottom:8px;font-size:14px}.identity-heading p{font-size:12px}.identity-logos{display:flex;gap:16px;align-items:stretch}.identity-logo{display:flex;align-items:center;justify-content:center;padding:12px;width:130px;min-height:116px;border:1px solid #ffffff20;border-radius:8px}.identity-logo.light{background:#fff}.identity-logo img{width:100%;height:88px;object-fit:contain}.freelance-identity{display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid #486878;background:#122431;border-radius:8px;padding:16px 22px;gap:5px}.freelance-identity img{width:112px;height:50px;object-fit:contain}.freelance-identity span{font-size:11px;color:#c1d6de}.freelance-identity strong{font:600 14px Arial;letter-spacing:1px;color:#fff}.asset-credit{font-size:10px;color:#9ca9bd;width:100%;text-align:end}
@media(max-width:1000px){.play-steps{grid-template-columns:repeat(2,1fr)}.footer-identity{justify-content:center}.identity-heading{text-align:center}.asset-credit{text-align:center}}
@media(max-width:750px){.build-story,.browser-teaser{grid-template-columns:1fr;gap:25px}.play-step{padding:20px}.direct-contact{margin-inline:6%;display:block}.direct-contact .btn{margin-top:20px}.identity-logos{flex-wrap:wrap;justify-content:center}.identity-logo{width:112px}.freelance-identity{min-width:240px}.whatsapp-float{bottom:55px;inset-inline-end:10px;font-size:12px}.browser-emblem{min-height:300px}}
@media(max-width:420px){.play-steps{grid-template-columns:1fr}}
@media(max-width:1100px){nav{gap:9px}nav .depth-link{padding-inline:2px}}
@media(max-width:750px){nav{padding-bottom:12px;gap:20px}.scene-layer canvas{opacity:.65}.motion-toggle{bottom:10px;inset-inline-end:10px;font-size:10px}}
@media(prefers-reduced-motion:reduce){.depth-link,.depth-link:hover{transform:none!important}}