:root{--ch:#1E1E1E;--iv:#F7F7F5;--nv:#243447;--gd:#C8A96B;--disp:'Anton',Impact,sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--ch);color:var(--iv);font:400 16px/1.6 Inter,system-ui,sans-serif;letter-spacing:-.01em;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
.eyebrow{font-size:12px;font-weight:500;letter-spacing:.28em;text-transform:uppercase;color:var(--gd);margin-bottom:18px}
.eyebrow.dark{color:var(--nv)}
.nav{position:fixed;inset:0 0 auto;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:14px clamp(16px,4vw,48px);background:linear-gradient(#1E1E1Ee6,#1E1E1E00)}
.brand img{height:34px;width:auto;display:block}
.links{display:flex;gap:32px;font-size:13px;letter-spacing:.14em;text-transform:uppercase}
.links a{text-decoration:none;opacity:.75}.links a:hover{opacity:1;color:var(--gd)}
.pill{border:1px solid #C8A96B88;border-radius:99px;padding:8px 18px;font-size:14px;text-decoration:none;color:var(--gd)}
.btn{display:inline-block;padding:15px 28px;border-radius:2px;font:500 13px Inter;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;border:1px solid var(--gd);cursor:pointer;transition:.3s}
.btn.gold{background:var(--gd);color:var(--ch)}.btn.gold:hover{background:var(--iv);border-color:var(--iv)}
.btn.ghost{color:var(--iv);border-color:#F7F7F555}.btn.ghost:hover{border-color:var(--gd);color:var(--gd)}
/* hero */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;padding:110px clamp(20px,6vw,90px) 80px;overflow:hidden;background:linear-gradient(90deg,#1E1E1Ef2 0%,#1E1E1Ec0 45%,#24344766 100%),var(--hero) center/cover no-repeat,#1E1E1E}
.sun{position:absolute;right:8vw;top:16vh;width:min(42vw,520px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 40% 35%,#E3CC97,#C8A96B 55%,#9c8150);opacity:.55;mix-blend-mode:soft-light;filter:saturate(.9);transform:translateY(calc(var(--s,0)*.25px))}
.layer{position:absolute;left:0;right:0;bottom:0;pointer-events:none}
.l1{height:46vh;background:linear-gradient(180deg,transparent,#1E1E1E 90%),repeating-linear-gradient(90deg,#24344700 0 6vw,#2434475e 6vw 6.4vw);clip-path:polygon(0 40%,8% 40%,8% 15%,16% 15%,16% 35%,27% 35%,27% 5%,33% 5%,33% 30%,46% 30%,46% 20%,58% 20%,58% 0,64% 0,64% 25%,78% 25%,78% 10%,88% 10%,88% 35%,100% 35%,100% 100%,0 100%);background-color:#243447;opacity:.55;transform:translateY(calc(var(--s,0)*.12px))}
.l2{height:28vh;background:linear-gradient(180deg,#1E1E1E00,#1E1E1E 70%),#151515;clip-path:polygon(0 50%,12% 50%,12% 20%,22% 20%,22% 45%,40% 45%,40% 10%,47% 10%,47% 40%,70% 40%,70% 25%,84% 25%,84% 55%,100% 55%,100% 100%,0 100%)}
.hero-inner{position:relative;z-index:2;max-width:1100px}
.mega{font-family:var(--disp);font-weight:400;text-transform:uppercase;line-height:.86;font-size:clamp(84px,17vw,260px);letter-spacing:-.01em;color:var(--iv);display:flex;flex-direction:column;mix-blend-mode:normal}
.mega span{display:block;opacity:0;transform:translateY(40px);animation:rise 1.1s cubic-bezier(.2,.7,.1,1) forwards}
.mega span:nth-child(2){animation-delay:.15s;color:transparent;-webkit-text-stroke:2px var(--iv)}
@keyframes rise{to{opacity:1;transform:none}}
.lede{max-width:560px;margin:28px 0 34px;font-size:clamp(15px,1.4vw,18px);font-weight:300;color:#F7F7F5cc}
.ctas{display:flex;flex-wrap:wrap;gap:14px}
.cea{position:absolute;left:clamp(20px,6vw,90px);bottom:24px;z-index:2;font-size:12px;letter-spacing:.08em;color:#F7F7F599}
/* walkthrough */
.walk{height:420vh;position:relative;background:#141414}
.stage{position:sticky;top:0;height:100vh;overflow:hidden;perspective:900px;perspective-origin:50% 45%}
.scene{position:absolute;inset:0;transform-style:preserve-3d;will-change:transform}
.room{position:absolute;left:50%;top:50%;width:min(86vw,980px);height:min(64vh,560px);margin:calc(min(64vh,560px)/-2) 0 0 calc(min(86vw,980px)/-2);transform-style:preserve-3d;transform:translateZ(calc(var(--i)*-1400px))}
.room::before,.room::after{content:"";position:absolute;inset:0;border:1px solid #C8A96B55}
.room::before{background:linear-gradient(0deg,#1E1E1Ef0 0%,#1E1E1E66 45%,#24344722 100%),var(--img) center/cover !important;box-shadow:inset 0 0 0 1px #F7F7F510,0 40px 120px #000a}
.room::after{inset:auto 0 -30% 0;height:30%;transform-origin:top;transform:rotateX(80deg);background:repeating-linear-gradient(90deg,#C8A96B22 0 1px,transparent 1px 80px),#191919;border:0}
.room[data-i="1"]::before{background:radial-gradient(60% 70% at 70% 30%,#C8A96B33,transparent),linear-gradient(#2a3b50,#1E1E1E)}
.room[data-i="2"]::before{background:repeating-linear-gradient(90deg,#F7F7F508 0 2px,transparent 2px 60px),linear-gradient(#1f2c3c,#1E1E1E)}
.room[data-i="3"]::before{background:radial-gradient(circle at 75% 35%,#C8A96B 0 12%,#C8A96B33 13%,transparent 40%),linear-gradient(#243447,#2c2a26)}
.frame{position:absolute;inset:0;padding:clamp(24px,5vw,64px);display:flex;flex-direction:column;justify-content:flex-end;transform:translateZ(1px)}
.frame .num{font:400 14px Inter;letter-spacing:.3em;color:var(--gd)}
.frame h2{font-family:var(--disp);font-weight:400;text-transform:uppercase;font-size:clamp(40px,8.5vw,130px);line-height:.92;margin:8px 0 14px;overflow-wrap:break-word;max-width:100%}
.frame p{max-width:440px;color:#F7F7F5cc;font-weight:300}
.hud{white-space:nowrap;position:absolute;left:50%;bottom:28px;transform:translateX(-50%);display:flex;align-items:center;gap:16px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:#F7F7F5aa}
.bar{width:140px;height:1px;background:#F7F7F533}.bar i{display:block;height:100%;width:0;background:var(--gd)}
/* services */
.services{background:var(--iv);color:var(--ch);padding:clamp(80px,12vw,160px) clamp(20px,6vw,90px)}
.mega-sm{font-family:var(--disp);font-weight:400;text-transform:uppercase;font-size:clamp(48px,7vw,104px);line-height:.95;margin-bottom:48px}
.mega-sm em{font-style:normal;color:var(--gd)}
.grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #1E1E1E22}
.grid article{padding:32px 28px 32px 0;border-right:1px solid #1E1E1E14;transition:transform .4s}
.grid article:last-child{border:0}
.grid article:hover{transform:translateY(-6px)}
.grid span{font-size:12px;letter-spacing:.3em;color:var(--gd)}
.grid h3{font:600 20px Inter;margin:12px 0 10px;color:var(--nv)}
.grid p{font-size:15px;color:#1E1E1Ebb}
/* about */
.about{background:var(--nv);padding:clamp(80px,12vw,160px) clamp(20px,6vw,90px)}
.about-in{max-width:900px}
.about p{max-width:640px;font-weight:300;color:#F7F7F5d9;font-size:17px}
.tags{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin-top:32px}
.tags li{border:1px solid #C8A96B77;padding:8px 16px;font-size:13px;letter-spacing:.06em;color:var(--gd)}
/* contact */
.contact{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,96px);padding:clamp(80px,12vw,160px) clamp(20px,6vw,90px);background:var(--ch)}
.c-left p{margin-bottom:8px;word-break:break-word}
.big{font-family:var(--disp);font-size:clamp(40px,5vw,64px);color:var(--gd)}
.big a{text-decoration:none}
.muted{color:#F7F7F588;font-size:13px}
.form{display:grid;gap:18px}
.form label{display:grid;gap:6px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#F7F7F5aa}
.form input,.form select,.form textarea{font:400 16px Inter;color:var(--iv);background:transparent;border:0;border-bottom:1px solid #F7F7F544;padding:10px 0;outline:none;border-radius:0}
.form select option{color:#1E1E1E}
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--gd)}
.form .chk{display:flex;gap:10px;align-items:flex-start;text-transform:none;letter-spacing:0;font-size:13px}
.chk input{margin-top:4px;accent-color:var(--gd)}
.foot{padding:48px clamp(20px,6vw,90px);border-top:1px solid #F7F7F51a;font-size:13px;color:#F7F7F5bb;display:grid;gap:10px}
.foot img{height:30px;width:auto}
@media (max-width:820px){
  .links{display:none}
  .brand img{height:26px}
  .sun{width:70vw;right:-12vw;top:12vh;opacity:.75}
  .grid{grid-template-columns:1fr 1fr}
  .grid article:nth-child(2){border-right:0}
  .contact{grid-template-columns:1fr}
  .walk{height:720vh;height:720lvh}
  .stage{height:100vh;height:100svh;perspective:1100px}
  .room{width:88vw;height:62vh;height:62svh;margin:-31vh 0 0 -44vw;margin:-31svh 0 0 -44vw}
  .hud{bottom:calc(84px + env(safe-area-inset-bottom));font-size:11px;letter-spacing:.14em}
  .cea{right:20px;font-size:11px}
}
@media (max-width:480px){.grid{grid-template-columns:1fr}.grid article{border-right:0;border-bottom:1px solid #1E1E1E14}.hero{align-items:flex-end;padding-bottom:110px}}
@media (prefers-reduced-motion:reduce){.mega span{animation:none;opacity:1;transform:none}html{scroll-behavior:auto}}

.film{background:#141414;padding:clamp(70px,10vw,130px) clamp(20px,6vw,90px)}
.film-head .mega-sm{margin-bottom:32px}
.film-frame{position:relative;aspect-ratio:16/9;overflow:hidden;border:1px solid #C8A96B55;background:#1E1E1E}
.vid,.vid-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.vid-poster{display:none}
.film-cap{position:absolute;left:16px;bottom:12px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#F7F7F5bb;background:#1E1E1E99;padding:4px 10px}
.grid article img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;margin-bottom:18px;filter:saturate(.85)}
.about{background:linear-gradient(90deg,#243447f5 0%,#243447e0 55%,#24344766 100%),url(assets/img/infinity-lap-pool.webp) center/cover}
.c-img{width:100%;aspect-ratio:16/10;object-fit:cover;margin-bottom:28px;border:1px solid #C8A96B44}
.note{margin-top:18px}
@media (prefers-reduced-motion:reduce){.vid{display:none}.vid-poster{display:block}}
.snd{position:fixed;left:clamp(14px,3vw,32px);bottom:clamp(14px,3vw,28px);z-index:45;display:flex;align-items:center;gap:10px;padding:10px 16px 10px 14px;background:#1E1E1Ed9;backdrop-filter:blur(8px);border:1px solid #C8A96B88;color:#F7F7F5;font:500 11px/1 Inter,sans-serif;letter-spacing:.2em;text-transform:uppercase;cursor:pointer;border-radius:99px;transition:border-color .3s,background .3s}
.snd:hover,.snd:focus-visible{border-color:#C8A96B;outline:none;background:#243447e6}
.snd:focus-visible{box-shadow:0 0 0 2px #1E1E1E,0 0 0 4px #C8A96B}
.eq{display:flex;align-items:flex-end;gap:2px;height:14px}
.eq i{display:block;width:2px;height:3px;background:#C8A96B;transition:height .3s}
.snd[aria-pressed=true] .eq i{animation:eq 1.1s ease-in-out infinite}
.snd[aria-pressed=true] .eq i:nth-child(2){animation-delay:-.4s}.snd[aria-pressed=true] .eq i:nth-child(3){animation-delay:-.8s}.snd[aria-pressed=true] .eq i:nth-child(4){animation-delay:-.2s}
@keyframes eq{0%,100%{height:3px}50%{height:14px}}
@media (prefers-reduced-motion:reduce){.snd[aria-pressed=true] .eq i{animation:none;height:10px}}

@media (pointer:coarse) and (min-width:769px){.walk{height:720vh;height:720lvh}.stage{height:100svh}}
.walk-static .walk{height:auto}
.walk-static .stage{position:relative;height:auto;overflow:visible;perspective:none;padding:60px 0}
.walk-static .scene{position:relative;transform:none!important;display:flex;flex-direction:column;gap:28px;align-items:center}
.walk-static .room{position:relative;left:auto;top:auto;margin:0;transform:none;opacity:1!important}
.walk-static .room::after,.walk-static .hud{display:none}
