:root{
  --sky-top:#221a2b; --sky-mid:#6a4a59; --sky-low:#c9a08a;
  --paper:#f6f2ec; --paper-2:#ece5db; --ink:#14100d; --ink-soft:#6b5f55;
  --hair:#ddd3c6; --ember:#ff4a17;
  --font:'Helvetica Neue',Helvetica,'Inter Tight',Arial,sans-serif;
  --mono:'JetBrains Mono','SF Mono',Consolas,monospace;
  color-scheme:light;
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);
  font-size:17px;line-height:1.6;letter-spacing:-.01em;-webkit-font-smoothing:antialiased}
a{color:inherit}
.wrap{max-width:860px;margin:0 auto;padding-inline:24px}
.top{background:linear-gradient(180deg,var(--sky-top) 0%,var(--sky-mid) 52%,var(--sky-low) 84%,var(--paper) 100%);
  padding:34px 0 64px}
.nav{display:flex;justify-content:space-between;align-items:baseline;gap:20px;flex-wrap:wrap}
.brand{font-size:30px;font-weight:700;letter-spacing:-.05em;color:#fff;text-decoration:none}
.nav .links{display:flex;gap:20px;font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase}
.nav .links a{color:rgba(255,255,255,.9);text-decoration:none}
.nav .links a:hover{color:#fff}
.kicker{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(255,255,255,.72);margin:52px 0 14px}
h1{margin:0;font-size:clamp(38px,7vw,74px);line-height:.94;letter-spacing:-.05em;font-weight:700;color:#fff}
.lede{margin:20px 0 0;max-width:52ch;color:rgba(255,255,255,.86);font-size:19px}
main{padding:56px 0 20px}
h2{font-size:clamp(26px,4vw,38px);line-height:1.05;letter-spacing:-.04em;margin:46px 0 14px}
h3{font-size:19px;letter-spacing:-.02em;margin:28px 0 6px}
p{margin:0 0 16px;max-width:64ch}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;background:var(--hair);
  border:1px solid var(--hair);margin:30px 0}
.facts div{background:var(--paper);padding:15px 17px}
.facts dt{font-family:var(--mono);font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-soft)}
.facts dd{margin:5px 0 0;font-size:19px;font-weight:700;letter-spacing:-.02em}
.tracks{list-style:none;padding:0;margin:22px 0 0;border-top:1px solid var(--hair)}
.tracks li{border-bottom:1px solid var(--hair)}
.tracks a{display:flex;justify-content:space-between;gap:16px;align-items:baseline;
  padding:15px 0;text-decoration:none;transition:padding-left .22s,background .22s}
.tracks a:hover{padding-left:11px;background:var(--paper-2)}
.tracks b{font-size:19px;font-weight:700;letter-spacing:-.03em;text-transform:uppercase}
.tracks span{font-family:var(--mono);font-size:11px;letter-spacing:.11em;text-transform:uppercase;
  color:var(--ink-soft);white-space:nowrap}
.pills{display:flex;gap:9px;flex-wrap:wrap;margin:26px 0 0}
.pill{text-decoration:none;padding:12px 20px;font-size:12.5px;font-weight:700;
  letter-spacing:.07em;text-transform:uppercase;border:1px solid}
.sp{background:#1db954;border-color:#1db954;color:#fff}
.ap{background:#fff;border-color:var(--hair);color:#fa243c}
.yt{background:#ff2800;border-color:#ff2800;color:#fff}
.more{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:1px;background:var(--hair);
  border:1px solid var(--hair);margin:16px 0 0}
.more a{background:var(--paper);padding:18px;text-decoration:none;transition:background .2s}
.more a:hover{background:var(--paper-2)}
.more b{display:block;font-size:17px;letter-spacing:-.03em;text-transform:uppercase}
.more span{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
footer{border-top:1px solid var(--hair);margin-top:60px;padding:30px 0 50px;
  font-size:13px;color:var(--ink-soft)}
footer a{color:var(--ink-soft)}
@media (max-width:640px){ .nav .links{gap:14px} }
