:root{--bg:#060b16;--accent:#54baff;--glow:34,116,198;--warm:55,86,150;--text:#f6f4ef}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:2px solid var(--accent);outline-offset:6px}header{height:96px;display:flex;align-items:center;justify-content:space-between;padding:0 5%;border-bottom:1px solid #ffffff18;position:absolute;inset:0 0 auto;z-index:5}.brand{display:flex;align-items:center;gap:19px}.brand img{width:89px;height:auto}.brand span{font-size:12px;letter-spacing:.28em}nav{display:flex;gap:36px;font-size:12px;color:#c9cdd5}.nav-cta{font-size:12px;padding:13px 17px;border:1px solid #ffffff38}.nav-cta span{margin-left:24px}.hero{height:max(810px,100svh);max-height:1150px;position:relative;overflow:hidden;isolation:isolate;background:var(--bg);transition:background 1.2s}.atmosphere{position:absolute;inset:0;background:radial-gradient(ellipse at 74% 50%,rgba(var(--glow),.43),transparent 43%),radial-gradient(ellipse at 80% 78%,rgba(var(--warm),.34),transparent 48%);transition:background 1.2s;z-index:-3}.halo{position:absolute;width:40vw;height:40vw;max-width:680px;max-height:680px;right:8%;top:18%;border-radius:50%;border:1px solid rgba(var(--glow),.55);box-shadow:0 0 24px rgba(var(--glow),.10),inset 0 0 32px rgba(var(--glow),.09);z-index:-2;mask-image:linear-gradient(black 30%,transparent 93%)}.horizon{position:absolute;top:70%;left:22%;right:-20%;height:1px;background:linear-gradient(90deg,transparent,var(--accent),transparent);box-shadow:0 0 40px 5px rgba(var(--glow),.35);opacity:.6;z-index:-1}.floor-lines{position:absolute;top:70%;bottom:0;left:0;right:0;background:repeating-radial-gradient(ellipse at 74% 0%,transparent 0 40px,rgba(var(--glow),.08) 42px,transparent 44px 76px);transform:perspective(250px) rotateX(28deg);transform-origin:top;mask-image:linear-gradient(black,transparent 92%);z-index:-2}.grain{position:absolute;inset:0;opacity:.055;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='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.5' filter='url(%23n)'/%3E%3C/svg%3E");z-index:4}.hero-copy{position:absolute;left:5%;top:26%;z-index:2;pointer-events:none}.hero-copy a{pointer-events:auto}.eyebrow{font:10px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.26em;font-weight:400}.eyebrow i{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent);margin-right:14px;box-shadow:0 0 15px var(--accent)}h1{font-size:clamp(68px,7.2vw,112px);line-height:.88;letter-spacing:-.075em;margin:30px 0;font-weight:600}h1 span{color:var(--accent);transition:color 1s}.intro{font-size:15px;line-height:1.9;color:#aab4c4;margin:0 0 29px}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:35px;background:#f3f1e9;color:#10141c;border:0;border-radius:2px;padding:19px 23px;font-size:13px;transition:transform .2s}.button:hover{transform:translateY(-3px)}.button span{font-size:20px}#viewer{position:absolute;inset:13% -1% 19% 37%;touch-action:pan-y}#logoCanvas{width:100%;height:100%;display:block;cursor:grab;touch-action:pan-y;position:relative;z-index:1}#logoCanvas:active{cursor:grabbing}#fallback{position:absolute;width:75%;top:35%;left:12%;filter:drop-shadow(0 0 35px rgba(var(--glow),.5));opacity:.85}#loading3d{position:absolute;bottom:18%;left:0;right:0;text-align:center;font:10px monospace;letter-spacing:.15em;color:#bcc6d5}.stage-label{position:absolute;right:5%;top:17%;display:flex;gap:16px;align-items:start;color:#d8deea}.stage-label>span{font-size:23px;color:var(--accent);line-height:1}.stage-label p{margin:0;font:10px/2 monospace;letter-spacing:.24em}.stage-label small{font-size:7px;letter-spacing:.2em;color:#8994a9}.viewer-tools{position:absolute;right:12%;bottom:24%;display:flex;align-items:center;gap:11px;z-index:3}.viewer-tools button{background:#ffffff08;border:1px solid #ffffff25;color:#c8d2e1;border-radius:30px;padding:9px 13px;font-size:11px}.drag-hint{font:8px monospace;letter-spacing:.19em;color:#a5b5cb;margin-right:13px}.hero-bottom{position:absolute;left:5%;right:5%;bottom:5%;display:grid;grid-template-columns:1fr 1fr auto 1fr;align-items:center;gap:30px;padding-top:25px;border-top:1px solid #ffffff25;z-index:3}.swatches{display:flex;gap:13px;margin-top:14px}.swatch{height:24px;width:24px;border-radius:50%;border:4px solid var(--bg);outline:1px solid #ffffff38;background:var(--swatch);padding:0;transition:transform .25s,outline-color .25s}.swatch:hover{transform:scale(1.15)}.swatch[aria-pressed=true]{outline:1.5px solid var(--accent);box-shadow:0 0 16px rgba(var(--glow),.25)}.colour-name small{font:10px monospace;letter-spacing:.25em;color:#8d9baf}.colour-name h2{font-size:22px;font-weight:400;margin:10px 0 0;letter-spacing:-.04em}.next-controls{display:flex;gap:12px}.next-controls button{width:43px;height:43px;border-radius:50%;background:transparent;border:1px solid #ffffff3b;color:#e4e9f0;font-size:24px}.scroll-cue{font:8px monospace;letter-spacing:.2em;justify-self:end;color:#b6c0ce}.scroll-cue span{margin-left:20px;font-size:22px}.collection{background:#f1efe9;color:#171b21;padding:100px 5% 90px}.section-top{display:flex;align-items:end;justify-content:space-between;margin-bottom:46px}.section-top h2,.detail-copy h2{font-size:clamp(34px,4.6vw,66px);font-weight:500;letter-spacing:-.055em;line-height:1.08;margin:20px 0 0}.section-top h2 span{color:#787b7d}.section-top>p{color:#707478;font-size:13px;line-height:1.8}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.card{background:none;border:0;text-align:left;padding:0;color:inherit}.card-photo{background:#e9e7e1;aspect-ratio:4/5;overflow:hidden;position:relative}.card img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;transition:transform .7s}.card:hover img{transform:scale(1.055) rotate(-3deg)}.card-photo span{position:absolute;right:16px;bottom:13px;font-size:24px}.card h3{font-size:17px;font-weight:400;letter-spacing:-.03em;margin:18px 0 8px}.card small{font:9px monospace;letter-spacing:.15em;color:#858889}.details{display:grid;grid-template-columns:1.25fr 1fr;gap:7%;padding:100px 5%;background:#e6e4de;color:#1c2026;align-items:center}.detail-photo img{width:100%;display:block;mix-blend-mode:multiply}.detail-copy>p:not(.eyebrow){color:#6b6d70;font-size:14px;line-height:1.85;max-width:340px;margin:24px 0}.detail-line{padding:16px 0;border-top:1px solid #151d2520;font-size:12px}.detail-line span{font:10px monospace;color:#86888a;margin-right:30px}.detail-copy .button{margin-top:24px;background:#121923;color:white}footer{padding:44px 5%;display:flex;justify-content:space-between;align-items:center;gap:20px}footer>span{font:9px monospace;letter-spacing:.2em}footer small{font-size:10px;color:#8c94a2}dialog{padding:40px;border:1px solid #ffffff30;border-radius:5px;background:#eeece6;color:#171b22;width:min(1100px,92vw);max-height:90svh}dialog::backdrop{background:#050811d9;backdrop-filter:blur(12px)}.modal-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:40px;align-items:center}.modal-grid img{width:100%;mix-blend-mode:multiply}.modal-grid h2{font-size:38px;font-weight:500;letter-spacing:-.05em}.modal-grid .button{background:#101722;color:white;margin:20px 0}.modal-grid small{display:block}.muted{color:#6d747c;font-size:12px;line-height:1.8}.close{position:absolute;right:12px;top:8px;border:0;background:none;font-size:30px}.modal-grid .swatch{border-color:#eeece6;outline-color:#9da5af}
@media(min-width:1600px){.hero-copy{left:9%}header{padding-inline:9%}.hero-bottom{left:9%;right:9%}}
@media(max-width:900px){header{height:78px}nav{display:none}.hero{height:1020px;max-height:none}.hero-copy{top:135px}h1{font-size:80px}.intro{font-size:14px}#viewer{inset:395px -10% 190px 0}.halo{width:75vw;height:75vw;right:2%;top:410px;max-height:540px;max-width:540px}.stage-label{top:465px;left:5%;right:auto}.stage-label small{display:none}.viewer-tools{bottom:188px;right:5%}.horizon{top:75%}.floor-lines{top:75%}.hero-bottom{grid-template-columns:1fr 1fr auto;gap:14px;bottom:40px}.scroll-cue{display:none}.cards{grid-template-columns:repeat(2,1fr);gap:35px 18px}.details{gap:35px;grid-template-columns:1fr}.detail-copy{max-width:580px}footer{flex-wrap:wrap}footer small{width:100%}.collection,.details{padding-top:65px;padding-bottom:65px}}
@media(max-width:540px){header{padding:0 6%;height:80px}.brand img{width:66px}.brand span{font-size:9px;letter-spacing:.2em}.brand{gap:12px}.nav-cta{font-size:10px;padding:11px}.nav-cta span{margin-left:8px}.hero{height:960px}.hero-copy{top:129px;left:6%}.eyebrow{font-size:8px}h1{font-size:69px;margin:24px 0}.intro{line-height:1.7}.button{padding:16px 18px;font-size:12px}#viewer{inset:430px -15% 196px -15%}.stage-label{top:437px;left:6%}.stage-label p{font-size:8px}.halo{width:95vw;height:95vw;right:2.5%;top:440px}.horizon{top:74%}.floor-lines{top:74%}.viewer-tools{bottom:180px;right:6%;left:6%;justify-content:center}.drag-hint{font-size:7px}.hero-bottom{left:6%;right:6%;bottom:35px;gap:15px;padding-top:23px;grid-template-columns:1fr auto}.colour-name{grid-column:1;grid-row:2}.colour-name h2{font-size:21px;display:inline;margin-left:14px}.colour-name small{font-size:8px}.next-controls{grid-column:2;grid-row:1 / 3}.next-controls button{width:36px;height:36px}.swatches{gap:13px}.section-top{gap:20px;align-items:start}.section-top>p{font-size:10px}.section-top h2{font-size:35px}.card h3{font-size:15px}.card small{font-size:8px}.modal-grid{grid-template-columns:1fr;gap:10px}dialog{padding:40px 20px 25px}.modal-grid h2{font-size:28px}.modal-grid img{max-height:43svh;object-fit:contain}footer>span{font-size:7px}.collection,.details{padding-inline:6%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}

/* Oversized brand silhouette, beneath the entire hero composition. */
.brand-watermark{position:absolute;inset:0;z-index:-2;pointer-events:none;overflow:hidden;opacity:.085;-webkit-mask-image:linear-gradient(180deg,transparent 8%,#000 32%,#000 62%,transparent 92%);mask-image:linear-gradient(180deg,transparent 8%,#000 32%,#000 62%,transparent 92%)}
.brand-watermark>div{position:absolute;width:116%;aspect-ratio:600/251;left:-8%;top:22%;transform:rotate(-12deg);background:var(--accent);-webkit-mask:url('assets/ob-mark.svg') center/contain no-repeat;mask:url('assets/ob-mark.svg') center/contain no-repeat;transition:background 1.2s}
@media(max-width:900px){.brand-watermark{opacity:.095}.brand-watermark>div{width:160%;left:-30%;top:31%;transform:rotate(-17deg)}}
@media(max-width:540px){.brand-watermark>div{width:190%;left:-43%;top:34%;transform:rotate(-19deg)}}