@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,500;0,600;0,700;0,800;0,900;1,700;1,800&family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700&display=swap');

:root { --bg:#0a0a0f; --surface:#111116; --line:rgba(255,255,255,.14); --muted:#b7b7c0; --white:#f8f8fc; --violet:#7c3aed; --blue:#3b82f6; --gradient:linear-gradient(100deg,var(--violet),var(--blue)); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--bg); }
body { margin:0; color:var(--white); background:var(--bg); font-family:Manrope,Arial,sans-serif; overflow-x:hidden; }
a { color:inherit; text-decoration:none; }
button,input { font:inherit; }
.container { width:min(100% - 40px, 1240px); margin-inline:auto; }
.hero { min-height:100svh; position:relative; isolation:isolate; display:flex; overflow:hidden; }
.hero__image,.hero__image::after { position:absolute; inset:0; }
.hero__image { z-index:-3; background:url('assets/images/hero-lounge.webp') 69% center/cover no-repeat; }
.hero__image::after { content:""; background:linear-gradient(90deg,rgba(5,5,10,.96) 0%,rgba(6,6,13,.77) 41%,rgba(6,6,13,.26) 77%,rgba(6,6,13,.38)),linear-gradient(0deg,rgba(10,10,15,.92),transparent 45%); }
.noise { position:absolute; z-index:-1; inset:0; opacity:.22; pointer-events:none; 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='.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.38'/%3E%3C/svg%3E"); mix-blend-mode:soft-light; }
.hero__content { display:flex; flex-direction:column; padding:26px 0 21px; min-height:100svh; }
.wordmark { display:inline-flex; align-items:center; gap:9px; font:800 14px/.72 'Barlow Condensed',sans-serif; letter-spacing:.11em; width:max-content; }
.wordmark__mark { position:relative; width:20px; height:20px; border:2px solid var(--white); transform:rotate(45deg); }
.wordmark__mark::after { content:""; position:absolute; inset:4px; background:var(--gradient); }
.hero__grid { display:grid; grid-template-columns:minmax(0,1.22fr) minmax(340px,.78fr); align-items:end; gap:70px; flex:1; padding:70px 0 38px; }
.eyebrow,.section-label { margin:0; font:500 10px/1.2 'DM Mono',monospace; letter-spacing:.13em; color:#d8d8e2; }
.eyebrow { display:flex; align-items:center; gap:10px; margin-bottom:17px; }
.eyebrow span { width:26px; height:1px; background:var(--blue); box-shadow:0 0 8px 1px var(--blue); }
h1,h2,h3 { margin:0; text-transform:uppercase; font-family:'Barlow Condensed',Impact,sans-serif; }
h1 { max-width:780px; font-size:clamp(60px,8.4vw,126px); line-height:.79; letter-spacing:-.037em; font-weight:900; }
h1 em,h2 em { font-style:normal; background:var(--gradient); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hero__intro { max-width:440px; margin:25px 0 20px; color:#d0d0da; font-size:14px; line-height:1.7; }
.hero__signal { display:flex; align-items:center; gap:9px; font:500 9px 'DM Mono',monospace; letter-spacing:.12em; color:#dadbe5; }
.live-dot { width:7px; height:7px; border-radius:50%; background:#9f77ff; box-shadow:0 0 0 4px rgba(124,58,237,.2),0 0 15px var(--violet); }
.signup-card { padding:27px; background:rgba(18,18,27,.86); border:1px solid rgba(255,255,255,.16); box-shadow:0 12px 50px rgba(0,0,0,.3),0 0 60px rgba(71,65,201,.12); backdrop-filter:blur(12px); }
.signup-card__kicker { color:#a68cff; font:500 10px 'DM Mono',monospace; letter-spacing:.14em; margin:0 0 12px; }
.signup-card h2 { font-size:31px; line-height:.94; letter-spacing:-.01em; }
.signup-card > p:not(.signup-card__kicker) { color:var(--muted); font-size:12px; line-height:1.55; margin:11px 0 20px; }
.waitlist-form { display:grid; gap:13px; }
.waitlist-form label { display:grid; gap:7px; font:500 9px 'DM Mono',monospace; letter-spacing:.1em; color:#d9d9e3; }
.waitlist-form label small { color:#7e7e8b; font-size:8px; margin-left:4px; }
.waitlist-form input { min-width:0; width:100%; padding:13px 0 10px; color:var(--white); background:transparent; border:0; border-bottom:1px solid rgba(255,255,255,.25); outline:0; font-size:13px; transition:border-color .2s; }
.waitlist-form input::placeholder { color:#777783; }
.waitlist-form input:focus { border-color:#7c8dff; }
.button { display:flex; justify-content:space-between; align-items:center; gap:18px; width:100%; padding:15px 17px; color:#fff; background:var(--gradient); border:0; cursor:pointer; font:700 13px/1 'Barlow Condensed',sans-serif; letter-spacing:.075em; transition:transform .18s,filter .18s; }
.button:hover { filter:brightness(1.12); transform:translateY(-2px); }
.button span { font-size:19px; line-height:10px; }
.form-note,.form-message { min-height:14px; margin:0; font-size:9px; line-height:1.4; color:#9595a1; }
.form-message { color:#bbaaff; }
.hero__footer { display:flex; justify-content:space-between; align-items:flex-end; color:#92929f; font:500 9px 'DM Mono',monospace; letter-spacing:.1em; }
.hero__footer p { margin:0; }
.scroll-cue { display:flex; align-items:center; gap:8px; color:#e6e6ee; }
.scroll-cue span { font-size:17px; color:#9a7bff; }
.section { padding:124px 0; }
.concept { border-top:1px solid var(--line); background:radial-gradient(ellipse 60% 45% at 90% 10%,rgba(63,54,165,.15),transparent); }
.section-label { display:flex; gap:14px; color:#a5a5b0; }
.section-label span { color:#8474ff; }
.concept__heading { display:grid; grid-template-columns:1fr 280px; gap:70px; align-items:end; margin:60px 0 68px; }
h2 { font-size:clamp(47px,6vw,90px); line-height:.8; letter-spacing:-.032em; font-weight:900; }
.concept__heading > p { margin:0 0 3px; color:var(--muted); font-size:14px; line-height:1.75; }
.features { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line); }
.feature { position:relative; min-height:280px; padding:19px 19px 19px 0; border-right:1px solid var(--line); }
.feature:not(:first-child) { padding-left:22px; }
.feature:last-child { border-right:0; }
.feature__number { color:#777782; font:500 9px 'DM Mono',monospace; }
.feature__icon { position:absolute; top:77px; left:0; width:44px; height:44px; opacity:.9; }
.feature:not(:first-child) .feature__icon { left:22px; }
.feature h3 { position:absolute; top:151px; font-size:29px; line-height:.82; }
.feature p { position:absolute; bottom:13px; max-width:180px; margin:0; color:#9f9faa; font-size:11px; line-height:1.65; }
.icon-controller { border:2px solid #a386ff; border-radius:15px 15px 19px 19px; transform:rotate(-10deg); box-shadow:0 0 18px rgba(124,58,237,.35); }
.icon-controller::before,.icon-controller::after { content:""; position:absolute; top:17px; width:11px; height:2px; background:#a386ff; }.icon-controller::before { left:8px; }.icon-controller::after { right:7px; transform:rotate(90deg); }
.icon-trophy::before { content:""; position:absolute; left:12px; width:20px; height:25px; border:2px solid #7b9cff; border-radius:0 0 12px 12px; border-top:0; }.icon-trophy::after { content:""; position:absolute; bottom:3px; left:6px; width:31px; height:11px; border-bottom:2px solid #7b9cff; border-radius:50%; box-shadow:0 -10px 0 -8px #7b9cff; }
.icon-live { border:2px solid #b497ff; border-radius:5px; }.icon-live::after { content:""; position:absolute; inset:11px 14px; border-left:12px solid #b497ff; border-top:7px solid transparent; border-bottom:7px solid transparent; }
.icon-glass { border:2px solid #77a1ff; border-radius:1px 1px 12px 12px; border-top:0; transform:perspective(30px) rotateX(-3deg); }.icon-glass::after { content:""; position:absolute; width:16px; height:2px; background:#77a1ff; top:-7px; left:13px; transform:rotate(-48deg); }
.gallery { background:#0d0d13; overflow:hidden; }
.gallery__top { display:flex; justify-content:space-between; align-items:end; margin-bottom:54px; }.gallery__top h2 { text-align:right; }
.gallery-grid { display:grid; grid-template-columns:1.25fr .75fr .75fr; gap:14px; height:485px; }
.gallery-card { position:relative; overflow:hidden; margin:0; background:#171720; }.gallery-card img { width:100%; height:100%; object-fit:cover; display:block; filter:saturate(.86) contrast(1.05); transition:transform .5s ease; }.gallery-card:hover img { transform:scale(1.04); }.gallery-card::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(0,0,0,.78),transparent 48%); pointer-events:none; }.gallery-card--tall img { object-position:57% center; }.gallery-card--detail img { object-position:82% center; }
.gallery-card figcaption { position:absolute; z-index:1; left:16px; bottom:15px; display:flex; gap:10px; font:500 10px 'DM Mono',monospace; letter-spacing:.12em; }.gallery-card figcaption span { color:#a689ff; }.gallery-note { margin:21px 0 0; color:#888893; font:500 9px 'DM Mono',monospace; letter-spacing:.09em; }
.closing { position:relative; overflow:hidden; min-height:650px; display:flex; align-items:center; background:linear-gradient(130deg,#0c0b14,#101027); }.closing__glow { position:absolute; width:65vw; aspect-ratio:1; border-radius:50%; right:-18vw; top:0; background:radial-gradient(circle,rgba(81,91,255,.46),rgba(115,50,227,.15) 32%,transparent 68%); filter:blur(14px); }.closing__inner { position:relative; width:min(100% - 40px,1240px); }.closing h2 { margin:52px 0 44px; }.closing__form-wrap { display:grid; grid-template-columns:250px minmax(0,1fr); align-items:start; gap:45px; max-width:900px; }.closing__form-wrap > p { margin:0; color:#c2c2cc; font-size:13px; line-height:1.7; }.waitlist-form--inline { grid-template-columns:.7fr 1fr auto; gap:10px; align-items:center; }.waitlist-form--inline .button { width:auto; min-height:47px; }.waitlist-form--inline input { height:47px; padding:0 0 0 13px; background:rgba(6,6,13,.35); border:1px solid rgba(255,255,255,.24); }.form-message--wide { grid-column:1/-1; }
.footer { background:#08080b; border-top:1px solid var(--line); }.footer__inner { padding:26px 0; display:flex; align-items:center; justify-content:space-between; }.footer p,.footer__social { margin:0; color:#888893; font:500 9px/1.5 'DM Mono',monospace; letter-spacing:.1em; }.footer__social { color:#d6d6dd; }.footer__social span { color:#9276ff; font-size:15px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (max-width:780px) { .container,.closing__inner { width:min(100% - 32px,1240px); }.hero__content { padding:21px 0 16px; }.hero__image { background-position:68% center; }.hero__image::after { background:linear-gradient(90deg,rgba(5,5,10,.92),rgba(6,6,13,.37)),linear-gradient(0deg,rgba(10,10,15,.95),transparent 65%); }.hero__grid { display:flex; flex-direction:column; align-items:stretch; justify-content:flex-end; gap:30px; padding:62px 0 23px; }.hero__copy { max-width:510px; }.hero__intro { margin:20px 0 16px; max-width:350px; font-size:13px; }.signup-card { padding:21px; }.signup-card h2 { font-size:28px; }.hero__footer p { display:none; }.hero__footer { justify-content:flex-end; }.section { padding:81px 0; }.concept__heading { display:block; margin:38px 0 45px; }.concept__heading > p { max-width:300px; margin-top:24px; font-size:13px; }.features { grid-template-columns:repeat(2,1fr); }.feature { min-height:248px; border-bottom:1px solid var(--line); }.feature:nth-child(2) { border-right:0; }.feature:nth-child(3) { padding-left:0; }.feature:nth-child(3) .feature__icon { left:0; }.feature h3 { font-size:26px; }.gallery__top { display:block; margin-bottom:36px; }.gallery__top h2 { margin-top:37px; text-align:left; }.gallery-grid { grid-template-columns:1fr 1fr; height:530px; gap:9px; }.gallery-card--large { grid-column:1/-1; height:280px; }.gallery-card--tall,.gallery-card--detail { height:240px; }.gallery-card figcaption { left:10px; bottom:10px; font-size:8px; }.gallery-note { font-size:8px; line-height:1.6; }.closing { min-height:620px; }.closing h2 { margin:39px 0 35px; }.closing__form-wrap { display:block; }.closing__form-wrap > p { margin-bottom:24px; max-width:290px; }.waitlist-form--inline { grid-template-columns:1fr; }.waitlist-form--inline .button { width:100%; }.footer__inner { padding:22px 0; }.footer p { display:none; } }
@media (max-width:380px) { h1 { font-size:54px; }.hero__grid { padding-top:40px; }.feature h3 { font-size:23px; } }