:root{--bg: #050505;--bg-soft: #0a0a0a;--ink: #f4f1ec;--ink-dim: rgba(244, 241, 236, .55);--glass: rgba(10, 10, 10, .65);--glass-border: rgba(255, 255, 255, .09);--gold: #e8a33d;--pink: #ff4f7b;--magenta: #d43dbb;--font-display: "Space Grotesk", system-ui, sans-serif;--font-body: "Inter", system-ui, sans-serif}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--ink);font-family:var(--font-body);-webkit-font-smoothing:antialiased}#root,.app{width:100%;height:100%;position:relative}.experience-canvas{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(120% 90% at 50% 42%,#17090e 0%,#0b0508 42%,var(--bg) 78%)}.experience-canvas canvas{display:block}.vignette{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(115% 100% at 50% 50%,transparent 55%,rgba(0,0,0,.55) 100%);z-index:5}.brand{position:absolute;top:clamp(18px,3.4vh,34px);left:clamp(20px,3vw,42px);z-index:40;cursor:pointer;-webkit-user-select:none;user-select:none}.brand h1{margin:0;font-family:var(--font-display);font-size:clamp(20px,2.1vw,30px);font-weight:700;letter-spacing:.34em;text-shadow:0 1px 12px rgba(0,0,0,.55),0 0 2px rgba(0,0,0,.4)}.brand p{margin:6px 0 0 2px;font-size:clamp(9px,.75vw,11px);letter-spacing:.42em;color:var(--ink-dim)}.home-tagline{position:absolute;left:50%;bottom:clamp(48px,9vh,96px);transform:translate(-50%);text-align:center;z-index:30;pointer-events:none;animation:fadeUp 1.4s ease both;animation-delay:.4s}.home-main{margin:0;font-family:var(--font-display);font-weight:300;font-size:clamp(16px,1.7vw,24px);letter-spacing:.28em;text-shadow:0 1px 10px rgba(0,0,0,.6)}.home-sub{margin:10px 0 0;font-size:clamp(10px,.85vw,13px);letter-spacing:.5em;color:var(--ink-dim)}@keyframes fadeUp{0%{opacity:0;transform:translate(-50%,18px)}to{opacity:1;transform:translate(-50%)}}.ribbon{position:absolute;top:0;right:0;bottom:0;left:0;z-index:20;pointer-events:none}.ribbon-item{position:absolute;top:0;left:0;visibility:hidden;pointer-events:auto;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid rgba(255,255,255,calc(.06 + var(--glow, 0) * .22));background:rgba(8,8,8,calc(.35 + var(--glow, 0) * .3));backdrop-filter:blur(calc(var(--glow, 0) * 10px));-webkit-backdrop-filter:blur(calc(var(--glow, 0) * 10px));color:var(--ink);font-family:var(--font-display);font-size:clamp(15px,1.5vw,22px);font-weight:500;letter-spacing:.3em;padding:.9em 1.6em .9em 1.9em;border-radius:999px;cursor:grab;white-space:nowrap;will-change:transform,opacity;transition:border-color .3s ease,box-shadow .3s ease,color .3s ease;touch-action:none}.ribbon-item:active{cursor:grabbing}.ribbon-item.is-active{color:#fff;border-color:#e8a33da6;box-shadow:0 0 24px #e8a33d47,0 0 80px #ff4f7b1f,inset 0 0 18px #e8a33d14;text-shadow:0 0 18px rgba(232,163,61,.55)}.ribbon-hint{position:absolute;top:0;left:0;z-index:25;pointer-events:auto;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid rgba(255,255,255,.16);background:#08080880;color:var(--ink-dim);font-family:var(--font-display);font-size:10px;letter-spacing:.5em;padding:7px 14px 7px 19px;border-radius:999px;cursor:pointer;opacity:0;transition:opacity .4s ease,color .3s ease,border-color .3s ease;will-change:transform}.ribbon-hint.is-visible{opacity:1}.ribbon-hint:hover{color:var(--gold);border-color:#e8a33d80}.nav-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:35;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:none;color:#f4f1ecbf;width:clamp(54px,6vw,92px);height:clamp(120px,22vh,220px);cursor:pointer;display:grid;place-items:center;transition:color .3s ease,transform .3s ease,filter .3s ease;touch-action:none;filter:drop-shadow(0 0 6px rgba(232,163,61,.55)) drop-shadow(0 0 18px rgba(232,163,61,.3));animation:arrowGlow 2.8s ease-in-out infinite}@keyframes arrowGlow{0%,to{filter:drop-shadow(0 0 6px rgba(232,163,61,.45)) drop-shadow(0 0 16px rgba(232,163,61,.22))}50%{filter:drop-shadow(0 0 9px rgba(232,163,61,.75)) drop-shadow(0 0 26px rgba(232,163,61,.4))}}.nav-arrow svg{width:55%;height:70%;overflow:visible}.nav-arrow--left{left:clamp(6px,1.5vw,28px)}.nav-arrow--right{right:clamp(6px,1.5vw,28px)}.nav-arrow:hover,.nav-arrow:active{color:var(--gold);transform:translateY(-50%) scale(1.06);animation:none;filter:drop-shadow(0 0 12px rgba(232,163,61,.85)) drop-shadow(0 0 30px rgba(232,163,61,.5))}.nav-arrow:focus-visible{outline:1px solid var(--gold);outline-offset:4px}.panel{position:absolute;top:clamp(14px,3vh,30px);bottom:clamp(14px,3vh,30px);width:min(42vw,620px);z-index:45;display:flex;flex-direction:column;background:var(--glass);border:1px solid var(--glass-border);border-radius:22px;backdrop-filter:blur(18px) saturate(1.15);-webkit-backdrop-filter:blur(18px) saturate(1.15);box-shadow:0 30px 90px #0000008c;overflow:hidden}.panel--current{right:clamp(14px,2vw,30px);animation:panelInRight .75s cubic-bezier(.22,1,.3,1) both}.panel--prev{left:clamp(14px,2vw,30px);top:clamp(90px,13vh,130px);width:min(30vw,430px);opacity:.55;filter:blur(.4px) brightness(.8);transform:scale(.94);cursor:pointer;animation:panelToLeft .75s cubic-bezier(.22,1,.3,1) both;transition:opacity .3s ease,filter .3s ease}.panel--prev:hover{opacity:.8;filter:none}.panel--prev .panel-scroll{pointer-events:none}@keyframes panelInRight{0%{transform:translate(120%) scale(.96);opacity:0}to{transform:translate(0) scale(1);opacity:1}}@keyframes panelToLeft{0%{transform:translate(60%) scale(1);opacity:.2}to{transform:translate(0) scale(.94);opacity:.55}}.panel-head{display:flex;align-items:flex-start;justify-content:space-between;padding:clamp(18px,2.6vh,30px) clamp(20px,2vw,32px) 12px;border-bottom:1px solid rgba(255,255,255,.06)}.panel-head h2{margin:0;font-family:var(--font-display);font-size:clamp(24px,2.6vw,40px);font-weight:600;letter-spacing:.18em;background:linear-gradient(100deg,var(--ink) 30%,var(--gold) 75%,var(--pink));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.panel-sub{margin:6px 0 0;font-size:11px;letter-spacing:.4em;color:var(--ink-dim);text-transform:uppercase}.panel-close{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:1px solid rgba(255,255,255,.14);color:var(--ink-dim);width:38px;height:38px;border-radius:50%;font-size:20px;line-height:1;cursor:pointer;transition:all .25s ease}.panel-close:hover{color:var(--pink);border-color:var(--pink);transform:rotate(90deg)}.panel-close--floating{display:none}.panel-scroll{overflow-y:auto;padding:clamp(16px,2.4vh,26px) clamp(20px,2vw,32px) 34px;scrollbar-width:thin;scrollbar-color:rgba(232,163,61,.4) transparent}.panel-scroll::-webkit-scrollbar{width:5px}.panel-scroll::-webkit-scrollbar-thumb{background:#e8a33d59;border-radius:4px}.page-body{display:flex;flex-direction:column;gap:20px}.lead{font-size:15px;line-height:1.75;color:#f4f1ecd9;margin:0}.duo{display:flex;align-items:center;gap:14px}.duo-card{flex:1;border:1px solid var(--glass-border);border-radius:14px;padding:16px;background:#ffffff06}.duo-card h3{margin:0 0 6px;font-family:var(--font-display);letter-spacing:.2em;font-size:15px}.duo-card p{margin:0;font-size:11.5px;color:var(--ink-dim);letter-spacing:.05em}.duo-x{font-family:var(--font-display);font-size:22px;color:var(--gold)}.tag-cloud{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0}.tag-cloud li{font-size:11px;letter-spacing:.12em;padding:6px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.12);color:#f4f1ecbf}.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.project-card{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;background:transparent;padding:0;text-align:left;cursor:pointer;color:var(--ink);perspective:700px}.project-thumb{position:relative;display:block;aspect-ratio:16 / 10;border-radius:12px;overflow:hidden;border:1px solid var(--glass-border);background:radial-gradient(130% 120% at 20% 15%,color-mix(in srgb,var(--accent) 45%,transparent),transparent 55%),radial-gradient(120% 130% at 85% 90%,color-mix(in srgb,var(--accent) 25%,#000),#0c0709 70%);transition:transform .45s cubic-bezier(.22,1,.3,1),box-shadow .45s ease;transform-style:preserve-3d}.project-card:hover .project-thumb{transform:rotateX(6deg) rotateY(-7deg) translateY(-4px) scale(1.02);box-shadow:0 24px 50px #00000080,0 0 40px color-mix(in srgb,var(--accent) 30%,transparent)}.project-thumb-glow{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.14) 48%,transparent 60%);transform:translate(-120%);transition:transform .8s ease}.project-card:hover .project-thumb-glow{transform:translate(120%)}.project-thumb-title{position:absolute;left:12px;bottom:10px;font-family:var(--font-display);font-size:13px;letter-spacing:.22em;color:#ffffffeb;text-shadow:0 2px 12px rgba(0,0,0,.7)}.project-meta{display:flex;flex-direction:column;gap:3px;padding:10px 2px 0}.project-meta strong{font-family:var(--font-display);font-size:13px;letter-spacing:.14em}.project-meta span{font-size:11px;color:var(--ink-dim)}.project-detail{position:relative;border:1px solid color-mix(in srgb,var(--accent) 40%,transparent);border-radius:14px;padding:20px;background:#ffffff08;animation:fadeIn .4s ease both}.project-detail h3{margin:0 0 4px;font-family:var(--font-display);letter-spacing:.2em}.detail-sub{color:var(--ink-dim);font-size:12px;margin:0 0 10px}.detail-close{position:absolute;top:10px;right:12px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;color:var(--ink-dim);font-size:20px;cursor:pointer}.tag-row{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.tag-row span{font-size:10px;letter-spacing:.14em;padding:4px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.14);color:var(--ink-dim)}.cta{display:inline-block;font-family:var(--font-display);font-size:12px;letter-spacing:.3em;color:#0a0a0a;background:linear-gradient(100deg,var(--gold),#ffcf7d);padding:12px 22px 12px 26px;border-radius:999px;text-decoration:none;border:none;cursor:pointer;transition:transform .25s ease,box-shadow .25s ease}.cta:hover{transform:translateY(-2px);box-shadow:0 10px 30px #e8a33d59}.cta--big{align-self:flex-start;font-size:13px;padding:15px 30px 15px 34px}.web3d-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px;border:1px solid var(--glass-border);border-left:3px solid var(--accent);border-radius:12px;background:#ffffff05;flex-wrap:wrap}.web3d-info{flex:1;min-width:220px}.web3d-row strong{display:block;font-family:var(--font-display);letter-spacing:.16em;font-size:14px}.web3d-row span{font-size:11px;color:var(--ink-dim)}.web3d-desc{margin:8px 0 0;font-size:12.5px;line-height:1.6;color:#f4f1ecbf}.web3d-actions{display:flex;gap:8px;flex-wrap:wrap}.chip{font-size:10px;letter-spacing:.18em;padding:8px 13px;border-radius:999px;border:1px solid rgba(255,255,255,.16);color:var(--ink);text-decoration:none;transition:all .25s ease}.chip:hover{border-color:var(--gold);color:var(--gold)}.chip--accent{background:color-mix(in srgb,var(--accent) 25%,transparent);border-color:var(--accent)}.video-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.video-card{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;background:transparent;padding:0;color:var(--ink);text-align:left;cursor:pointer;display:flex;flex-direction:column;gap:6px}.video-thumb{position:relative;aspect-ratio:16 / 9;border-radius:12px;border:1px solid var(--glass-border);background:radial-gradient(100% 130% at 70% 20%,color-mix(in srgb,var(--accent) 35%,transparent),transparent 60%),linear-gradient(160deg,#14090f,#060406);display:grid;place-items:center;overflow:hidden;transition:transform .4s cubic-bezier(.22,1,.3,1),box-shadow .4s ease}.video-card:hover .video-thumb{transform:translateY(-3px) scale(1.02);box-shadow:0 18px 40px #00000080,0 0 34px color-mix(in srgb,var(--accent) 28%,transparent)}.video-play{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(255,255,255,.4);background:#00000059;font-size:13px;padding-left:3px}.video-dur{position:absolute;right:10px;bottom:8px;font-size:10px;letter-spacing:.1em;color:var(--ink-dim)}.video-card strong{font-family:var(--font-display);font-size:13px;letter-spacing:.14em}.video-type{font-size:10px;letter-spacing:.25em;color:var(--ink-dim)}.video-player{position:relative;animation:fadeIn .4s ease both;display:flex;flex-direction:column;gap:10px}.video-frame{aspect-ratio:16 / 9;border-radius:14px;overflow:hidden;border:1px solid var(--glass-border);background:#000;display:grid;place-items:center}.video-frame video{width:100%;height:100%;object-fit:cover}.video-frame--hero{background:linear-gradient(150deg,#170a10,#05030a)}.video-placeholder{text-align:center;font-family:var(--font-display);letter-spacing:.3em;font-size:14px;color:var(--ink-dim);line-height:2.2}.video-placeholder small{letter-spacing:.1em;font-family:var(--font-body);font-size:11px}.service-row{display:grid;grid-template-columns:150px 1fr;gap:14px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.06)}.service-row strong{font-family:var(--font-display);font-size:12px;letter-spacing:.24em;color:var(--gold)}.service-row p{margin:0;font-size:13.5px;line-height:1.6;color:#f4f1eccc}.contact-brand{display:flex;flex-direction:column;gap:4px}.contact-brand strong{font-family:var(--font-display);letter-spacing:.3em;font-size:17px}.contact-brand span{font-size:10px;letter-spacing:.4em;color:var(--ink-dim)}.contact-data{font-style:normal;display:flex;flex-direction:column;gap:6px;font-size:13.5px;color:#f4f1ecd9}.contact-data a{color:var(--gold);text-decoration:none}.contact-data a:hover{text-decoration:underline}.contact-data span{font-weight:600}.contact-form{display:flex;flex-direction:column;gap:14px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.contact-form label{display:flex;flex-direction:column;gap:6px;font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-dim)}.contact-form input,.contact-form select,.contact-form textarea{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#ffffff0b;border:1px solid rgba(255,255,255,.12);border-radius:10px;color:var(--ink);font-family:var(--font-body);font-size:14px;padding:11px 13px;transition:border-color .25s ease,background .25s ease}.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{outline:none;border-color:#e8a33d99;background:#e8a33d0f}.contact-form select option{background:#111}.form-sent{font-family:var(--font-display);letter-spacing:.2em;color:var(--gold)}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.loader{position:absolute;top:0;right:0;bottom:0;left:0;z-index:100;background:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;transition:opacity .9s ease,visibility .9s}.loader--done{opacity:0;visibility:hidden;pointer-events:none}.loader-brand{font-family:var(--font-display);font-size:clamp(26px,4vw,46px);font-weight:700;letter-spacing:.4em;padding-left:.4em;background:linear-gradient(100deg,var(--ink) 30%,var(--gold) 70%,var(--pink));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.loader-sub{font-size:10px;letter-spacing:.5em;color:var(--ink-dim)}.loader-progress{margin-top:26px;font-size:11px;letter-spacing:.3em;color:var(--ink-dim);font-variant-numeric:tabular-nums}.loader-bar{width:min(240px,60vw);height:2px;background:#ffffff1a;border-radius:2px;overflow:hidden}.loader-bar span{display:block;height:100%;background:linear-gradient(90deg,var(--gold),var(--pink));transition:width .25s ease}.sound-toggle{position:absolute;left:clamp(20px,3vw,42px);bottom:clamp(16px,3vh,30px);z-index:40;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:1px solid rgba(255,255,255,.14);border-radius:999px;color:var(--ink-dim);font-family:var(--font-display);font-size:9px;letter-spacing:.4em;padding:8px 14px 8px 18px;cursor:pointer;transition:all .25s ease}.sound-toggle:hover{color:var(--gold);border-color:#e8a33d80}.orbit-hint{position:absolute;right:clamp(20px,3vw,42px);bottom:clamp(16px,3vh,30px);z-index:40;display:flex;align-items:center;gap:10px;color:var(--ink-dim);pointer-events:none;text-shadow:0 1px 8px rgba(0,0,0,.5);transition:opacity .8s ease;animation:orbitPulse 3.2s ease-in-out infinite}.orbit-hint svg{width:34px;height:32px;filter:drop-shadow(0 1px 6px rgba(0,0,0,.45))}.orbit-hint span{font-family:var(--font-display);font-size:9px;letter-spacing:.38em}.orbit-hint--used{opacity:.28;animation:none}@keyframes orbitPulse{0%,to{opacity:.55}50%{opacity:1}}@media(prefers-reduced-motion:reduce){.orbit-hint{animation:none}}@media(max-width:820px){.project-grid,.video-grid,.form-grid{grid-template-columns:1fr}.service-row{grid-template-columns:1fr;gap:4px}.panel--current{top:auto;left:0;right:0;bottom:0;width:100%;height:88vh;border-radius:22px 22px 0 0;animation:panelInUp .6s cubic-bezier(.22,1,.3,1) both}.panel--prev{display:none}.home-tagline{bottom:clamp(90px,14vh,130px)}.ribbon-item{letter-spacing:.2em}.nav-arrow{color:#fff;width:58px;height:118px;background:#08080880;border:1px solid rgba(232,163,61,.45);border-radius:999px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 0 16px #e8a33d59,0 6px 22px #00000073,inset 0 0 12px #e8a33d1f}.panel-close--floating{display:grid;place-items:center;position:absolute;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));width:54px;height:54px;font-size:26px;background:#080808bf;border:1px solid rgba(232,163,61,.55);color:var(--ink);box-shadow:0 0 18px #e8a33d4d,0 8px 26px #00000080;z-index:10}}@keyframes panelInUp{0%{transform:translateY(110%)}to{transform:translateY(0)}}@media(prefers-reduced-motion:reduce){.panel--current,.panel--prev,.home-tagline{animation-duration:.01s}.project-card:hover .project-thumb,.video-card:hover .video-thumb{transform:none}*{transition-duration:.01s!important}}