:root{
  --bg:#0b090d;
  --ink:#f2eadc;
  --muted:#a9a095;
  --line:rgba(242,234,220,.14);
  --blue:#27c9ee;
  --pink:#ff2c69;
  --orange:#d95b2b;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:Inter,system-ui,sans-serif;overflow-x:hidden
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.grain{
  position:fixed;inset:0;pointer-events:none;z-index:100;opacity:.045;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 220 220' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.85'/%3E%3C/svg%3E")
}
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:50;height:76px;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 4vw;border-bottom:1px solid transparent;
  transition:.35s ease;background:linear-gradient(to bottom,rgba(0,0,0,.48),transparent)
}
.site-header.scrolled{
  background:rgba(11,9,13,.88);backdrop-filter:blur(16px);
  border-color:var(--line)
}
.brand{font-family:"Bebas Neue",sans-serif;letter-spacing:.11em;font-size:1.15rem}
nav{display:flex;gap:2rem}
nav a{font-size:.74rem;text-transform:uppercase;letter-spacing:.14em;color:#d8d0c5}
.hero{
  min-height:100svh;position:relative;display:flex;align-items:center;
  overflow:hidden;padding:120px 6vw 70px
}
.hero-bg{
  position:absolute;inset:0;
  background:url("assets/hero-cover.png") center/cover no-repeat;
  transform:scale(1.03)
}
.hero-overlay{
  position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(7,5,9,.95) 0%,rgba(7,5,9,.78) 34%,rgba(7,5,9,.26) 63%,rgba(7,5,9,.5) 100%),
    linear-gradient(0deg,rgba(11,9,13,1) 0%,transparent 28%)
}
.hero-inner{position:relative;z-index:2;max-width:780px}
.hero-logo{width:min(240px,40vw);margin-bottom:2rem;filter:drop-shadow(0 12px 34px rgba(0,0,0,.35))}
.eyebrow,.kicker{
  text-transform:uppercase;letter-spacing:.24em;font-size:.68rem;font-weight:600
}
.eyebrow{color:#e8d2a6;margin-bottom:1.2rem}
.hero h1,.about h2,.listen h2{
  font-family:"Cormorant Garamond",serif;font-weight:500;line-height:.92;margin:0
}
.hero h1{font-size:clamp(3.6rem,7vw,7.4rem);letter-spacing:-.035em}
.hero-copy{
  max-width:650px;color:#d3cabc;line-height:1.75;font-family:"Cormorant Garamond",serif;
  font-size:clamp(1.15rem,1.7vw,1.5rem);margin:1.8rem 0 2.2rem
}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.btn{
  display:inline-flex;align-items:center;justify-content:center;min-width:180px;
  padding:14px 20px;border:1px solid rgba(255,255,255,.35);font-size:.75rem;
  text-transform:uppercase;letter-spacing:.12em;transition:.25s ease
}
.btn-solid{background:var(--ink);color:#111;border-color:var(--ink)}
.btn:hover{transform:translateY(-2px)}
.scroll-cue{position:absolute;bottom:28px;right:4vw;z-index:2;width:34px;height:50px;border:1px solid rgba(255,255,255,.3);border-radius:30px}
.scroll-cue span{display:block;width:4px;height:4px;background:#fff;border-radius:50%;margin:10px auto;animation:scroll 1.8s infinite}
@keyframes scroll{0%{transform:translateY(0);opacity:0}25%{opacity:1}100%{transform:translateY(20px);opacity:0}}
.intro{
  padding:110px 8vw 130px;display:grid;grid-template-columns:1fr 4fr;gap:4vw;
  border-bottom:1px solid var(--line)
}
.kicker{color:#9c9387;margin-top:.65rem}
.manifesto{
  margin:0;max-width:1050px;font-family:"Cormorant Garamond",serif;
  font-size:clamp(2.2rem,4.6vw,5rem);line-height:1.02;letter-spacing:-.03em
}
.manifesto em{font-weight:500;color:#e7c790}
.records{padding:0 4vw}
.record{
  min-height:84vh;display:grid;grid-template-columns:1.2fr .8fr;gap:6vw;
  align-items:center;padding:100px 3vw;border-bottom:1px solid var(--line)
}
.record:nth-child(even){grid-template-columns:.8fr 1.2fr}
.record:nth-child(even) .record-image-wrap{order:2}
.record-image-wrap{position:relative}
.record-image-wrap:before{
  content:"";position:absolute;inset:-22px;z-index:-1;filter:blur(60px);opacity:.18
}
.record-blue .record-image-wrap:before{background:var(--blue)}
.record-pink .record-image-wrap:before{background:var(--pink)}
.record-image{
  border:1px solid rgba(255,255,255,.09);
  box-shadow:0 30px 80px rgba(0,0,0,.42)
}
.release-label{font-size:.65rem;letter-spacing:.2em;text-transform:uppercase;color:#a99f91}
.record-copy h2{
  font-family:"Bebas Neue",sans-serif;font-size:clamp(5rem,9.5vw,9.8rem);
  line-height:.78;letter-spacing:.01em;margin:.2rem 0 1.5rem
}
.record-blue h2{color:var(--blue)}
.record-pink h2{color:var(--pink)}
.tagline{
  font-family:"Cormorant Garamond",serif;font-style:italic;font-size:1.65rem;color:#e7dccb;margin-bottom:1.5rem
}
.record-copy>p:not(.release-label):not(.tagline){
  max-width:580px;color:#afa69a;line-height:1.8;font-size:.95rem
}
.record-links{display:flex;gap:18px;flex-wrap:wrap;margin-top:2.2rem}
.record-links a{
  padding-bottom:5px;border-bottom:1px solid rgba(255,255,255,.4);
  font-size:.72rem;text-transform:uppercase;letter-spacing:.12em
}
.visual-break{position:relative;height:70vh;min-height:520px;overflow:hidden}
.visual-break img{width:100%;height:100%;object-fit:cover;filter:saturate(.86) contrast(1.05)}
.visual-break:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(11,9,13,.7),transparent 45%)}
.visual-caption{
  position:absolute;z-index:2;left:6vw;right:6vw;bottom:5vw;display:flex;gap:3vw;
  font-family:"Bebas Neue";font-size:clamp(2rem,5vw,5.5rem);letter-spacing:.04em
}
.about{
  padding:130px 8vw;display:grid;grid-template-columns:1.2fr .8fr;gap:10vw;
  border-bottom:1px solid var(--line)
}
.about h2{font-size:clamp(3.2rem,6vw,6.6rem);margin-top:1rem}
.about-copy{padding-top:3.2rem}
.about-copy p{
  font-family:"Cormorant Garamond",serif;color:#c9c0b5;font-size:1.35rem;line-height:1.65
}
.listen{
  padding:110px 8vw;display:grid;grid-template-columns:1fr 1fr;gap:8vw;align-items:end
}
.listen h2{font-size:clamp(4rem,8vw,8.2rem)}
.platforms{display:flex;flex-direction:column}
.platforms a{
  display:flex;justify-content:space-between;align-items:center;padding:20px 0;
  border-bottom:1px solid var(--line);font-family:"Cormorant Garamond",serif;
  font-size:1.6rem;transition:.2s ease
}
.platforms a:hover{padding-left:10px}
footer{
  min-height:230px;padding:48px 4vw;display:grid;grid-template-columns:1fr 1fr 1fr;
  align-items:end;border-top:1px solid var(--line);color:#756f68;font-size:.72rem
}
.footer-logo{width:105px;opacity:.8}
.footer-note{text-align:right}
@media(max-width:900px){
  nav{gap:1rem}.site-header{padding:0 20px}
  .hero{padding-left:24px;padding-right:24px}
  .intro,.about,.listen{grid-template-columns:1fr;padding-left:24px;padding-right:24px}
  .intro{gap:18px}
  .record,.record:nth-child(even){grid-template-columns:1fr;padding:76px 0}
  .record:nth-child(even) .record-image-wrap{order:0}
  .record-copy{padding:0 4px}
  .record-copy h2{font-size:clamp(5rem,22vw,8rem)}
  .visual-caption{flex-direction:column;gap:0}
  footer{grid-template-columns:1fr;gap:22px}.footer-note{text-align:left}
}
@media(max-width:560px){
  nav a:nth-child(2){display:none}
  .hero-logo{width:190px}
  .hero h1{font-size:3.6rem}
  .btn{width:100%}
  .intro{padding-top:80px;padding-bottom:90px}
  .records{padding:0 20px}
  .record{min-height:auto}
  .visual-break{height:58vh;min-height:420px}
}