:root { color-scheme: dark; --paper:#f6f1e9; --muted:#bfbcb8; --orange:#ffae66; }
* { box-sizing:border-box; }
body { margin:0; background:#111214; color:var(--paper); font-family:Arial,Helvetica,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
button { font:inherit; color:inherit; cursor:pointer; }
a,button { -webkit-tap-highlight-color:transparent; }
:focus-visible { outline:3px solid #ffbd79; outline-offset:5px; }
[hidden] { display:none !important; }
.skip-link { position:fixed; z-index:5; top:12px; left:12px; padding:14px 20px; background:#fff; color:#111; transform:translateY(-180%); }
.skip-link:focus { transform:none; }
.ambient { position:fixed; z-index:-1; inset:0; background:radial-gradient(ellipse at 15% 25%,#6a321f40,transparent 48%),radial-gradient(ellipse at 94% 74%,#53315524,transparent 48%); pointer-events:none; }
.shell { width:min(1280px,calc(100% - 96px)); margin:auto; }
.masthead { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:30px 0 0; }
.glass { border:1px solid #ffffff38; background:linear-gradient(125deg,#ffffff17,#ffffff04 45%,#ffffff0b),#242326c9; box-shadow:inset 0 1px 0 #ffffff22,inset 0 -1px 0 #00000030,0 10px 32px #00000020; -webkit-backdrop-filter:blur(18px) saturate(135%); backdrop-filter:blur(18px) saturate(135%); }
.home { display:flex; align-items:center; gap:11px; padding:8px 17px 8px 9px; border-radius:40px; font-size:11px; font-weight:700; letter-spacing:.13em; }
.home img { object-fit:contain; }
.location { color:var(--muted); font-size:10px; letter-spacing:.2em; }
.location span { margin-left:13px; color:var(--orange); font-size:17px; }
.hero { display:grid; grid-template-columns:1.06fr 1fr; gap:8%; align-items:center; padding:54px 0 50px; }
.identity { position:relative; }
.identity::before { content:""; position:absolute; inset:15%; background:#dd592a1c; filter:blur(60px); z-index:-1; }
.wordmark { display:block; width:100%; height:auto; }
.status { display:flex; align-items:center; gap:9px; margin:0 0 20px; font-size:10px; font-weight:700; letter-spacing:.23em; color:#e8c19e; }
.status span { width:6px; height:6px; background:var(--orange); border-radius:50%; box-shadow:0 0 12px #ff9c3b55; }
h1 { font-size:clamp(34px,3.7vw,53px); letter-spacing:-.055em; line-height:1.06; font-weight:500; margin:0 0 29px; }
.full-stop { color:var(--orange); }
.actions { display:flex; flex-wrap:wrap; gap:10px; }
.button { padding:15px 20px; display:inline-flex; gap:25px; justify-content:space-between; align-items:center; border-radius:28px; font-size:12px; font-weight:600; transition:transform .25s,background-color .25s,border-color .25s; min-height:48px; }
.primary { background-color:#6a422ce6; border-color:#f6bc8766; }
.button span { color:#e0c1a7; }
.email { display:inline-block; color:var(--muted); font-size:12px; line-height:1.5; margin-top:16px; padding:9px 0; }
.email span { margin-left:10px; }
.email:hover,footer a:hover { color:#fff; text-decoration:underline; text-underline-offset:5px; }
.section-head { display:flex; justify-content:space-between; align-items:center; gap:16px; min-height:44px; margin-bottom:14px; }
h2 { font-size:10px; font-weight:500; letter-spacing:.23em; margin:0; color:var(--muted); }
.motion { border-radius:24px; font-size:10px; min-height:44px; padding:10px 16px; display:flex; align-items:center; gap:18px; }
.motion span { color:var(--orange); }
.world-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:15px; }
.world { position:relative; height:252px; overflow:hidden; border-radius:22px; isolation:isolate; border:1px solid #ffffff24; background:#222; }
.scene { position:absolute; inset:-5px; overflow:hidden; }
.motion-ready .scene { animation:glimpse 14s ease-in-out infinite alternate; }
.world:nth-child(2) .scene { animation-delay:-5s; }
.world:nth-child(3) .scene { animation-delay:-9s; }
.world:nth-child(4) .scene { animation-delay:-2s; }
.world::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,#0008,transparent 50%); pointer-events:none; }
.world-label { position:absolute; z-index:1; bottom:13px; left:12px; right:12px; border-radius:13px; padding:13px 12px; min-height:58px; display:flex; gap:10px; align-items:center; background-color:#171719bc; }
.number { font-size:9px; color:#d5c3b6; align-self:flex-start; margin-top:3px; }
h3 { margin:0; font-size:12px; line-height:1.3; font-weight:500; letter-spacing:-.015em; }
h3 span { display:block; font-size:9px; color:#c1bcbc; margin-top:3px; }
.graffiti { background:#514a3d; }
.graffiti-ground { position:absolute; inset:0; background:linear-gradient(135deg,#6d341940,transparent),url('assets/bg-texture-teaser.webp') center/cover; }
.graffiti-skyline { position:absolute; width:130%; height:auto; left:-15%; top:0; opacity:.7; }
.fox { position:absolute; width:104%; height:auto; left:0; top:9%; transform:rotate(-7deg); }
.miami { background:#42274c; }
.miami-art { position:absolute; inset:0; background-image:url('assets/miami-board-teaser.webp'); background-size:auto 205%; background-position:0 0; opacity:.88; }
.miami-skyline { position:absolute; width:110%; height:auto; bottom:-17%; left:-5%; opacity:.6; filter:drop-shadow(0 0 4px #f42ec5); }
.craft { background:#b9a281; }
.weave { position:absolute; inset:0; background:repeating-linear-gradient(0deg,#67554329 0 1px,transparent 1px 4px),repeating-linear-gradient(90deg,#fcf0db66 0 1px,transparent 1px 4px),radial-gradient(ellipse at 20% 0%,#e9d2a7,transparent 65%); }
.thread { position:absolute; border:2px dashed #644c38; border-radius:50%; width:205px; height:250px; transform:rotate(35deg); left:35%; top:-25%; box-shadow:0 0 0 8px #ddc29c,0 0 0 10px #98775388,0 8px 30px #50392355; }
.thread-two { left:-30%; top:15%; transform:rotate(-45deg); border-color:#bd9777; box-shadow:0 0 0 10px #806342,0 0 0 12px #59463755,0 8px 30px #50392355; }
.craft-light { position:absolute; inset:0; background:radial-gradient(circle at 24% 20%,#fff4c9d9,transparent 5%),radial-gradient(circle at 75% 38%,#ffe6a18c,transparent 7%); }
.cinematic { background:#17191a; }
.light-beam { position:absolute; inset:-40%; transform:rotate(-28deg); background:linear-gradient(90deg,transparent 45%,#eea75188 49%,#ffde9eaa 50%,#fba34622 56%,transparent 67%); filter:blur(4px); }
.dark-skyline { position:absolute; width:140%; height:auto; bottom:-1%; left:-15%; filter:grayscale(1) brightness(.24) sepia(.3); }
.rain { position:absolute; inset:0; opacity:.28; background:repeating-linear-gradient(105deg,transparent 0 20px,#c4b09377 21px,transparent 22px 42px); mask-image:linear-gradient(transparent,#000,transparent); }
footer { margin-top:35px; padding:23px 0 28px; border-top:1px solid #ffffff16; display:flex; justify-content:space-between; gap:20px; font-size:10px; letter-spacing:.025em; color:var(--muted); }
footer a { padding:10px 0; margin-top:-10px; margin-bottom:-10px; }
@keyframes glimpse { from { transform:scale(1.015) translateY(0); } to { transform:scale(1.075) translateY(-3px); } }
.motion-paused .scene { animation-play-state:paused; }
@media (hover:hover) and (pointer:fine) { .button:hover { transform:translateY(-3px); background-color:#4c4039; border-color:#ffffff80; } }
@media (min-width:1500px) { .hero { padding-top:75px; padding-bottom:65px; } .world { height:285px; } }
@media (max-width:1000px) { .shell { width:calc(100% - 56px); } .hero { gap:5%; } .button { padding:14px 16px; gap:14px; } .world-grid { gap:10px; } .world { height:230px; } .world-label { left:8px; right:8px; padding:11px 9px; gap:6px; } h3 { font-size:11px; } }
@media (max-width:720px) { .shell { width:calc(100% - 36px); } .masthead { padding-top:20px; } .home { font-size:9px; padding-right:12px; gap:7px; } .home img { width:26px; height:26px; } .location { font-size:8px; letter-spacing:.09em; } .location span { display:none; } .hero { grid-template-columns:1fr; padding:35px 0 28px; gap:27px; } .identity { width:min(390px,94%); margin:auto; } .launch-copy { text-align:center; } .status { justify-content:center; margin-bottom:14px; font-size:9px; } h1 { font-size:40px; margin-bottom:23px; } .actions { justify-content:center; } .email { margin-top:12px; } .world-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; } .world { height:218px; border-radius:18px; } .world-label { bottom:9px; } h3 { font-size:12px; } .section-head { margin-bottom:12px; } footer { margin-top:27px; flex-direction:column; align-items:center; gap:20px; padding-bottom:30px; } }
@media (max-width:360px) { .shell { width:calc(100% - 28px); } .home span { font-size:8px; letter-spacing:.08em; } h1 { font-size:35px; } .world { height:195px; } h3 { font-size:10px; } .world-label { padding:10px 7px; } .number { font-size:8px; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; } .button:hover { transform:none; } }
@supports not (backdrop-filter:blur(1px)) { .glass { background-color:#28272b; } .primary { background-color:#65412f; } }