
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#08080a;color:#e4e6ea;font-family:'Trebuchet MS', Tahoma, sans-serif;line-height:1.6;
  -webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
.lb{max-width:1400px;margin:0 auto}

.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:1.4rem;
  background:rgba(8,8,10,0.78);backdrop-filter:blur(8px);padding:.9rem clamp(1rem,4vw,3rem);
  border-bottom:1px solid rgba(228,230,234,0.22)}
.house{font-family:Impact, Haettenschweiler, 'Arial Black', sans-serif;font-weight:600;letter-spacing:.28em;text-transform:uppercase;font-size:.9rem}
.season{font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;color:rgba(228,230,234,0.55)}
.lb-nav{margin-left:auto;display:flex;gap:1.4rem}
.lb-nav a{text-decoration:none;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(228,230,234,0.55)}
.lb-nav a:hover{color:#7cff2f}

.eyebrow{font-family:Impact, Haettenschweiler, 'Arial Black', sans-serif;font-size:.7rem;letter-spacing:.32em;text-transform:uppercase;
  color:#7cff2f;display:block;margin-bottom:1rem}

.title-card{min-height:82vh;display:flex;flex-direction:column;justify-content:center;
  padding:4rem clamp(1rem,5vw,4rem)}
.title-card h1{font-family:Impact, Haettenschweiler, 'Arial Black', sans-serif;font-weight:300;font-size:clamp(3rem,11vw,9rem);
  line-height:.94;letter-spacing:-.02em;margin:0 0 1.4rem;max-width:16ch}
.title-card p{font-size:1.3rem;color:rgba(228,230,234,0.55);max-width:44ch;margin:0 0 2rem;font-weight:300}
.enter{font-family:Impact, Haettenschweiler, 'Arial Black', sans-serif;text-decoration:none;letter-spacing:.24em;text-transform:uppercase;
  font-size:.78rem;border-bottom:1px solid #7cff2f;padding-bottom:.3rem;align-self:flex-start}

.intro{padding:2rem clamp(1rem,5vw,4rem) 4rem;max-width:70ch}
.intro-p{font-family:Impact, Haettenschweiler, 'Arial Black', sans-serif;font-weight:300;font-size:clamp(1.4rem,3vw,2rem);line-height:1.5}

.look{min-height:96vh;display:grid;grid-template-columns:1.15fr .85fr;align-items:stretch;
  border-top:1px solid rgba(228,230,234,0.22)}
.look.right{grid-template-columns:.85fr 1.15fr}
.look.right .look-img{order:2}.look.right .look-copy{order:1}
.look-img{margin:0;overflow:hidden}
.look-img img{width:100%;height:100%;min-height:60vh;object-fit:cover}
.look-copy{position:relative;padding:clamp(1.6rem,5vw,5rem);display:flex;flex-direction:column;
  justify-content:center}
.look-no{font-family:Impact, Haettenschweiler, 'Arial Black', sans-serif;font-weight:200;font-size:clamp(6rem,18vw,16rem);line-height:.8;
  color:rgba(228,230,234,0.10);letter-spacing:-.04em}
.look-label{font-family:Impact, Haettenschweiler, 'Arial Black', sans-serif;letter-spacing:.4em;font-size:.74rem;color:#7cff2f;margin:.4rem 0 1rem}
.look-copy h3{font-family:Impact, Haettenschweiler, 'Arial Black', sans-serif;font-weight:400;font-size:clamp(1.6rem,4vw,2.6rem);margin:0 0 .7rem}
.look-note{color:rgba(228,230,234,0.55);max-width:40ch;margin:0 0 2rem;font-weight:300}
.credits{display:grid;grid-template-columns:auto 1fr;gap:.3rem 1.4rem;margin:0;max-width:24rem}
.credits dt{font-family:Impact, Haettenschweiler, 'Arial Black', sans-serif;font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:rgba(228,230,234,0.55)}
.credits dd{margin:0;font-size:.82rem;letter-spacing:.06em}

.lb-voices{padding:6rem clamp(1rem,5vw,4rem);border-top:1px solid rgba(228,230,234,0.22)}
.q-row{display:grid;grid-template-columns:repeat(3,1fr);gap:3rem}
.lb-q{margin:0}
.lb-q p{font-family:Impact, Haettenschweiler, 'Arial Black', sans-serif;font-weight:300;font-size:1.4rem;line-height:1.4;margin:0 0 1rem}
.lb-q cite{font-style:normal;font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;color:#7cff2f}

.lb-contact{padding:6rem clamp(1rem,5vw,4rem);border-top:1px solid rgba(228,230,234,0.22);text-align:center}
.lb-contact h2{font-family:Impact, Haettenschweiler, 'Arial Black', sans-serif;font-weight:300;font-size:clamp(2rem,6vw,4rem);margin:0 0 2.4rem}
.stockist{display:flex;justify-content:center;flex-wrap:wrap;gap:2.4rem}
.stockist a,.stockist span{text-decoration:none;font-family:Impact, Haettenschweiler, 'Arial Black', sans-serif;letter-spacing:.14em;
  text-transform:uppercase;font-size:.82rem}
.stockist a:hover{color:#7cff2f}

.lb-foot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;
  padding:2.4rem clamp(1rem,5vw,4rem) 3rem;border-top:1px solid rgba(228,230,234,0.22);
  font-family:Impact, Haettenschweiler, 'Arial Black', sans-serif;font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:rgba(228,230,234,0.55)}

@media(max-width:820px){
  .look,.look.right{grid-template-columns:1fr}
  .look.right .look-img{order:1}.look.right .look-copy{order:2}
  .look-img img{min-height:64vh}
  .q-row{grid-template-columns:1fr;gap:2rem}
  .lb-nav{display:none}
}


.xq{box-sizing:border-box;font-family:'Trebuchet MS', Tahoma, sans-serif;color:#e4e6ea;padding:56px 24px;width:100%}
.xq *{box-sizing:border-box;margin:0}
.xq .xq-wrap{max-width:1060px;margin:0 auto}
.xq h2{font-family:Impact, Haettenschweiler, 'Arial Black', sans-serif;font-size:1.7rem;line-height:1.2;margin-bottom:8px}
.xq .xq-kick{display:block;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:#7cff2f;margin-bottom:10px;font-weight:700}

.xq-badges{padding:26px 24px;border-top:1px solid rgba(228,230,234,0.14);border-bottom:1px solid rgba(228,230,234,0.14);background:rgba(228,230,234,0.05)}
.xq-badge-row{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px}
.xq-badgehead{font-family:Impact, Haettenschweiler, 'Arial Black', sans-serif;font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;margin-right:8px}
.xq-badge{border:1.5px solid #7cff2f;color:#7cff2f;border-radius:999px;padding:7px 16px;font-size:.8rem;font-weight:700;letter-spacing:.04em}


.xq-teamgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:20px;margin-top:22px}
.xq-person img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:0px;display:block;filter:saturate(.9)}
.xq-person figcaption{padding-top:10px}
.xq-person strong{display:block;font-family:Impact, Haettenschweiler, 'Arial Black', sans-serif}
.xq-person span{font-size:.82rem;color:#52565e}


/* =====================================================
   DESIGN DNA: giant-ghost
   Whole-page visual system applied over the layout
   archetype. Appended last so it wins the cascade.
   ===================================================== */
html::before{content:'hardcore';position:fixed;left:50%;top:42%;transform:translate(calc(-50% + var(--gpx,0px)),calc(-50% + var(--gpy,0px))) rotate(0deg);z-index:99980;pointer-events:none;font-family:'Arial Black', 'Arial Bold', Arial, sans-serif;font-weight:900;font-size:26vw;letter-spacing:.04em;white-space:nowrap;color:#e9ebee;opacity:.06;text-transform:uppercase}
img,a[class*="btn"],button,span[class*="btn"],div[class*="card"]:not([class*="cards"]),article[class*="card"],a[class*="card"],figure[class*="card"],li[class*="card"]{box-shadow:none !important}
h1,h2,h3{letter-spacing:-0.03em !important;font-weight:800 !important}
img{border-radius:0 !important;filter:grayscale(.25) contrast(1.04)}
a[class*="btn"],button,span[class*="btn"]{border-radius:0 !important;border:1.5px solid currentColor !important;background:transparent !important;color:inherit !important;text-transform:uppercase;letter-spacing:.24em;font-size:.78em}
div[class*="card"]:not([class*="cards"]),article[class*="card"],a[class*="card"],figure[class*="card"],li[class*="card"]{border:none !important;border-top:2px solid #e9ebee !important;border-radius:0 !important}
