
.retro-variant .topbar{background:#090909d9;backdrop-filter:blur(15px)}
.retro-intro{position:relative;isolation:isolate;min-height:100svh;background:#080909;overflow:hidden;display:flex;align-items:center;padding:140px max(7vw,24px) 120px;color:#f8eee5}
.retro-light{position:absolute;inset:0;overflow:hidden;z-index:-2;background:radial-gradient(ellipse at 85% 35%,#351108,transparent 65%)}
.glass-slats{position:absolute;width:1080px;height:1500px;left:48%;top:50%;transform:translateY(-50%) rotate(-39deg);display:flex;gap:4px;animation:light-drift 18s ease-in-out infinite alternate}
.glass-slats i{height:100%;width:132px;flex:none;background:linear-gradient(90deg,#080908 1%,#421009 25%,#a0270b 65%,#ff7431 98%,#ffcd85);box-shadow:inset -2px 0 4px #ffb366,12px 0 36px #ff3b1220;mask-image:linear-gradient(0deg,transparent 2%,#000 28%,#000 70%,transparent 99%);transform:translateY(calc(var(--n)*-32px));animation:glass-glow 9s ease-in-out infinite alternate;animation-delay:calc(var(--n)*-.8s)}
.retro-light:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#080909 3%,#080909ef 24%,#08090955 58%,transparent),linear-gradient(0deg,#080909,transparent 22%)}
.retro-grain{position:absolute;inset:0;pointer-events:none;z-index:2;opacity:.13;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23ffffff' filter='url(%23n)' opacity='.7' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
.retro-intro .hero-copy{position:relative;z-index:3;max-width:610px;margin:0;padding:0;transform:none}.retro-intro .eyebrow{font-size:11px;letter-spacing:.18em;color:#d6a48e;margin-bottom:30px}.retro-intro h1{font-family:'Space Grotesk',sans-serif;font-size:clamp(90px,12vw,172px);line-height:.95;font-weight:500;letter-spacing:-.075em;margin:0 0 34px;color:#fff4ea;text-shadow:none}.retro-intro .studio-description{font-size:16px;line-height:1.85;max-width:465px;color:#c3b5ad}.retro-intro .hero-actions{display:flex;gap:24px;align-items:center;flex-wrap:wrap;margin-top:32px}.retro-intro .hero-primary{background:#f3e7dc;color:#20120e;border:0;border-radius:2px;padding:15px 20px;font-size:12px}.retro-intro .hero-contact{color:#e5b8a1;font-size:12px}.retro-bottom{position:absolute;bottom:35px;left:7vw;right:7vw;display:flex;justify-content:space-between;font-size:10px;letter-spacing:.12em;color:#a98979;z-index:3}
@keyframes light-drift{from{transform:translateY(-51%) translateX(-30px) rotate(-39deg)}to{transform:translateY(-46%) translateX(45px) rotate(-33deg)}}@keyframes glass-glow{from{filter:brightness(.72)}to{filter:brightness(1.3)}}
@media(max-width:700px){.retro-intro{padding:145px 25px 105px;align-items:flex-end;min-height:850px;min-height:100svh}.glass-slats{left:32%;top:22%;width:800px;height:1100px}.glass-slats i{width:85px}.retro-light:after{background:linear-gradient(0deg,#080909 8%,#080909df 40%,#08090922 90%)}.retro-intro h1{font-size:100px;margin-bottom:24px}.retro-intro .studio-description{font-size:14px}.retro-intro .eyebrow{font-size:9px}.retro-bottom{left:25px;right:25px;bottom:26px}.retro-intro .hero-actions{gap:18px}}
@media(prefers-reduced-motion:reduce){.glass-slats,.glass-slats i{animation:none}}

.retro-intro{width:100vw;margin-left:calc(50% - 50vw)}.retro-intro .hero-copy{text-align:left}.retro-intro .studio-description{margin-left:0}.retro-intro .hero-actions{justify-content:flex-start}.retro-intro .eyebrow{justify-content:flex-start}

.spline-scene{position:absolute;inset:0;width:100%;height:100%;border:0;z-index:0}.retro-intro .hero-copy,.retro-bottom{pointer-events:none}.retro-intro .hero-copy a,.retro-bottom a{pointer-events:auto}.retro-intro .hero-copy{background:linear-gradient(90deg,#080909e8,#080909a8 75%,transparent);padding:28px 28px 28px 0}.retro-bottom{background:#080909b0;padding:8px}.retro-intro{background:#080909}

.retro-intro .hero-copy{background:none}.retro-bottom{right:260px;background:none}@media(max-width:700px){.retro-bottom{right:25px;bottom:72px;gap:15px;font-size:8px}}

#spline-canvas{filter:url(#alopex-crimson)}

#spline-canvas{filter:none;display:block;width:100%!important;height:100%!important;touch-action:pan-y}

@supports (background-clip:text){
 .retro-intro .hero-copy h1,.retro-intro .hero-copy .eyebrow,.retro-intro .hero-copy .studio-description{
  --grain-ink:#fff4ea;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Cpath fill='%23fff' opacity='.68' filter='url(%23n)' d='M0 0h160v160H0z'/%3E%3C/svg%3E"),linear-gradient(var(--grain-ink),var(--grain-ink));
  background-size:160px 160px,100% 100%;background-blend-mode:multiply;
  -webkit-background-clip:text;background-clip:text;color:transparent;
 }
 .retro-intro .hero-copy .eyebrow{--grain-ink:#d6a48e}
 .retro-intro .hero-copy .studio-description{--grain-ink:#c3b5ad}
}

@supports (background-clip:text){
 .retro-intro .hero-copy h1,.retro-intro .hero-copy .eyebrow,.retro-intro .hero-copy .studio-description{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.72' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='1.5' intercept='-.28'/%3E%3CfeFuncG type='linear' slope='1.5' intercept='-.28'/%3E%3CfeFuncB type='linear' slope='1.5' intercept='-.28'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Cpath fill='%23fff' opacity='.78' filter='url(%23n)' d='M0 0h160v160H0z'/%3E%3Cpath stroke='%23000' opacity='.26' stroke-width='.6' d='M17 8v13M79 56v7M125 120v17M39 105h4M143 32h3'/%3E%3C/svg%3E"),linear-gradient(var(--grain-ink),var(--grain-ink));
  background-size:115px 115px,100% 100%;
 }
 .retro-intro .hero-copy h1{--grain-ink:#f3e8d9;text-shadow:none}
 .retro-intro .hero-copy .studio-description{background-size:150px 150px,100% 100%;--grain-ink:#dbccbd}
}

.retro-intro .hero-copy h1{text-shadow:none;filter:drop-shadow(1px 1px 0 #998775) drop-shadow(1px 1px 0 #594b40) drop-shadow(1px 1px 0 #302721) drop-shadow(3px 5px 5px #0008)}
.retro-intro .hero-copy .eyebrow,.retro-intro .hero-copy .studio-description{text-shadow:none;filter:drop-shadow(1px 1px 0 #352c2570)}

.retro-intro{background:#030202}
