/* ONYXAURA home. Seven screens, one idea each. */
.hero{position:relative;isolation:isolate;overflow:hidden;min-height:100vh;min-height:100svh;background:#070707}
.hero .wrap{position:relative;z-index:1}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-2;filter:saturate(.72) contrast(1.04)}
.hero-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(7,7,7,.72) 0%,rgba(7,7,7,.34) 52%,rgba(7,7,7,.10) 100%),linear-gradient(180deg,rgba(7,7,7,.5) 0%,rgba(7,7,7,0) 24%,rgba(7,7,7,0) 62%,#070707 100%)}
.hero .sub{max-width:34ch}
.hero .stage::after{content:"";position:absolute;right:6%;top:50%;width:46%;aspect-ratio:1;transform:translateY(-50%);background:radial-gradient(circle,rgba(197,179,88,.16),transparent 62%);pointer-events:none;z-index:-1}

/* image slots: honest placeholders for the shoot list, replaced by real photography */
.slot{position:relative;background:linear-gradient(160deg,#14110b 0%,#0b0a08 55%,#15120a 100%);border:1px solid var(--line);overflow:hidden;margin:0}
.slot::before{content:"";position:absolute;inset:14px;border:1px solid rgba(197,179,88,.14);pointer-events:none}
.slot .slot-in{position:absolute;left:28px;bottom:24px;display:flex;flex-direction:column;gap:6px}
.slot img{width:100%;height:100%;object-fit:cover}

/* 2. statement: words light up with scroll */
.statement{height:190vh;padding:0;position:relative}
.statement .sticky{position:sticky;top:0;height:100vh;display:flex;align-items:center}
.statement .quote{font-size:clamp(34px,5.6vw,84px);line-height:1.1;max-width:20ch;margin:0 auto;text-align:center}
.statement .w{opacity:.14;transition:opacity .6s var(--ease),color .6s}
.statement .w.on{opacity:1}

/* 3. source */
.bleed{padding:0;position:relative}
.bleed .slot{height:min(92vh,880px);border-left:0;border-right:0}
.bleed .overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,7,7,.82),rgba(7,7,7,.15) 60%),linear-gradient(0deg,rgba(7,7,7,.7),transparent 45%);display:flex;align-items:flex-end;padding:0 0 clamp(50px,7vw,100px)}
.bleed .overlay h2{max-width:14ch;margin:20px 0 22px}
.bleed .overlay p.lead{max-width:44ch}
.tlink{display:inline-flex;align-items:center;gap:12px;margin-top:34px;font:600 12px 'Hanken Grotesk',sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--ivory);padding-bottom:6px;background:linear-gradient(var(--gold),var(--gold)) 0 100%/100% 1px no-repeat;transition:color .4s,gap .5s var(--ease)}
.tlink:hover{color:var(--gold);gap:20px}

/* 4. craft */
.craft .split{align-items:center}
.craft .slot{aspect-ratio:4/5}
.craft h2{max-width:11ch;margin:20px 0 24px}

/* 5. collection */
.collection .head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:70px;flex-wrap:wrap}
.collection .head h2{max-width:14ch;margin-top:20px}
.pieces{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.piece{background:var(--obsidian);padding:0 0 38px;display:flex;flex-direction:column;transition:background .6s var(--ease)}
.piece:hover{background:#0c0c0c}
.piece .slot{aspect-ratio:4/5;border:0;border-bottom:1px solid var(--line)}
.piece .slot img{transition:transform 1.4s var(--ease)}
.piece:hover .slot img{transform:scale(1.035)}
.piece .meta{padding:28px 34px 0}
.piece .num{font:italic 400 15px 'Bodoni Moda',serif;color:var(--gold);letter-spacing:.2em}
.piece h3{margin:10px 0 10px}
.piece p{color:var(--mute);font-size:15px}
.goldtile{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:46px 40px;margin-top:1px;border:1px solid var(--line);border-top:0;background:var(--obsidian);position:relative;transition:background .6s var(--ease);flex-wrap:wrap}
.goldtile::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:var(--gold)}
.goldtile:hover{background:var(--charcoal)}
.goldtile h3{font-size:clamp(34px,4vw,56px)}
.goldtile h3 em{font:italic 400 15px 'Bodoni Moda',serif;color:var(--gold);letter-spacing:.2em;margin-right:18px;vertical-align:middle}
.goldtile p{color:var(--mute)}

/* 6. gold feature */
.goldfeat{height:240vh;padding:0;position:relative;background:radial-gradient(ellipse 50% 60% at 62% 50%,rgba(197,179,88,.10),transparent 70%),#060606}
.goldfeat .sticky{position:sticky;top:0;height:100vh;display:flex;align-items:center}
.goldfeat .wrap{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:32px;width:100%}
.goldfeat h2{font-size:clamp(80px,13vw,200px);line-height:.9;color:var(--gold)}
.goldfeat p.lead{margin-top:30px;max-width:36ch}
.goldfeat .bottle{position:relative;height:min(86vh,820px)}
.goldfeat .bottle canvas{display:block;width:100%!important;height:100%!important}
.goldfeat .bottle .foot-fallback{position:absolute;inset:6% 0;margin:auto;height:88%;width:auto}
.goldfeat .bottle.live .foot-fallback{display:none}

@media(max-width:1000px){
  .hero{align-items:flex-end;padding:120px 0 64px}
  .hero .stage{display:none}
  .hero .wrap{grid-template-columns:1fr}
  .hero-shade{background:linear-gradient(180deg,rgba(7,7,7,.55) 0%,rgba(7,7,7,.15) 30%,rgba(7,7,7,.55) 70%,#070707 100%)}
  .hero .scroll{display:none}
  .statement{height:160vh}
  .pieces{grid-template-columns:1fr}
  .collection .head{margin-bottom:44px}
  .goldfeat{height:200vh}
  .goldfeat .wrap{grid-template-columns:1fr;gap:0}
  .goldfeat .bottle{height:46vh;order:-1}
  .goldfeat h2{font-size:clamp(70px,22vw,120px)}
  .bleed .overlay{background:linear-gradient(0deg,rgba(7,7,7,.88),rgba(7,7,7,.2) 70%)}
}
@media (prefers-reduced-motion:reduce){.statement{height:auto;padding:120px 0}.statement .sticky{position:static;height:auto}.statement .w{opacity:1}.goldfeat{height:auto;padding:100px 0}.goldfeat .sticky{position:static;height:auto}}

/* ---------- launch round ---------- */
.slot.photo::before{display:none}
.bleed .slot.photo img{filter:sepia(.25) saturate(.8) brightness(.78)}
.pieces.four{grid-template-columns:repeat(4,1fr)}
.piece .meta{padding:26px 28px 0}
.mrp-line{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-top:18px;padding-top:14px;border-top:1px solid var(--line)}
.mrp-line i{font-style:normal;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.mrp-line b{font:400 24px 'Bodoni Moda',serif;color:var(--ivory)}
.piece.soon .slot{display:grid;place-items:center;background:radial-gradient(120% 90% at 50% 40%,#16130c 0,#060606 70%)}
.piece.soon .slot img{position:absolute;inset:0}
.piece.soon .soon-art{width:56%;height:auto;overflow:visible}
.piece.soon .soon-tag{position:absolute;right:16px;top:16px;color:var(--obsidian);background:var(--gold);padding:7px 10px;font-size:10px;letter-spacing:.22em}
.mrp-note{margin-top:22px;text-transform:none;letter-spacing:.02em}
.numbers{border-top:1px solid var(--line);background:#060606}
.num-row{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-top:34px}
.num-row li{background:var(--obsidian);padding:clamp(24px,2.6vw,38px);display:flex;flex-direction:column;gap:6px}
.num-row b{font:400 clamp(48px,5.4vw,84px)/1 'Bodoni Moda',serif;color:var(--gold);letter-spacing:-.02em;white-space:nowrap}
.num-row .u{font:600 11px 'Hanken Grotesk',sans-serif;letter-spacing:.22em;text-transform:uppercase;color:var(--ivory);margin-top:6px}
.num-row .d{color:var(--mute);font-size:14px;line-height:1.6;margin-top:6px;flex:1}
.num-row .src{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:rgba(197,179,88,.8);margin-top:14px;align-self:flex-start;border-bottom:1px solid rgba(197,179,88,.35)}
.num-row .src:hover{color:var(--ivory)}
@media(max-width:1100px){.pieces.four{grid-template-columns:repeat(2,1fr)}.num-row{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.pieces.four{grid-template-columns:1fr}.num-row{grid-template-columns:1fr}}
