@import url('https://fonts.googleapis.com/css2?family=Archivo+Black&family=Montserrat:wght@400;500;600&display=swap');

:root { --black:#050505; --charcoal:#171717; --coral:#d95757; --pink:#e36b79; --muted:#9e999b; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--black); color:#f7f4f4; font-family:Montserrat,Arial,sans-serif; font-size:16px; line-height:1.55; }
a { color:inherit; }
iframe { border:0; }
h1,h2,h3,p,blockquote { margin-top:0; }
.section-charcoal { background:var(--charcoal); }

.site-header { height:74px; display:grid; place-items:center; background:#151515; }
.site-header a { color:#fff; font-family:"Archivo Black",sans-serif; font-size:19px; letter-spacing:.035em; text-decoration:none; }

.hero { position:relative; min-height:705px; display:grid; grid-template-columns:42% 58%; align-items:center; padding:0 6.55%; overflow:hidden; isolation:isolate; }
.hero::before { position:absolute; z-index:0; inset:-45px; content:""; background:url('assets/just-friends.png') center/cover; filter:blur(30px); transform:scale(1.08); }
.hero::after { position:absolute; z-index:0; inset:0; content:""; background:rgba(0,0,0,.15); }
.hero-copy { position:relative; z-index:1; }
.hero h1 { margin:0 0 14px; font:52px/1.25 "Archivo Black",sans-serif; letter-spacing:.01em; text-transform:uppercase; }
.hero-copy p { margin:0 0 19px; font-size:20px; }
.button { display:inline-block; padding:16px 31px; background:var(--coral); color:#fff; font-size:14px; font-weight:600; letter-spacing:.02em; text-decoration:none; text-transform:uppercase; }
.hero-art { position:relative; z-index:1; width:min(100%,650px); height:auto; aspect-ratio:1/1; object-fit:cover; object-position:center; justify-self:end; align-self:center; }

.home-section { padding-left:6.55%; padding-right:6.55%; }
.quote-video { min-height:565px; display:grid; grid-template-columns:1fr 1fr; gap:7.5%; align-items:center; padding-top:105px; padding-bottom:105px; }
.quote-video blockquote { color:var(--pink); font-size:29px; line-height:1.25; text-align:center; }
.quote-mark { display:block; height:42px; color:#8b8989; font:76px/1 Georgia,serif; }
.rule { display:block; width:56px; height:1px; margin:34px auto 27px; background:#7c7879; }
.quote-video cite { display:block; color:#eee; font-size:16px; font-style:normal; }
.video-frame { aspect-ratio:16/9; background:#000; }
.video-frame iframe { display:block; width:100%; height:100%; }

.shows { padding-top:55px; padding-bottom:65px; text-align:center; }
.shows h2,.release h2,.epk-live>h2,.photos h2 { margin-bottom:38px; color:var(--coral); font:36px/1.15 "Archivo Black",sans-serif; letter-spacing:.015em; text-transform:uppercase; }
.event-list { max-width:1112px; margin:0 auto; text-align:left; }
.event-row { min-height:178px; display:grid; grid-template-columns:245px minmax(0,1fr) 280px; column-gap:75px; align-items:start; padding:22px 0 35px; border-bottom:1px solid #777; }
.event-date span { display:block; }
.event-weekday { margin-bottom:7px; color:#eee; font-size:16px; line-height:1.3; }
.event-month,.event-day { color:var(--coral); font-size:32px; line-height:1.08; }
.event-details h3,.event-time { margin:0; color:#eee; font-size:23px; font-weight:400; line-height:1.3; }
.event-details p,.event-location { margin:15px 0 0; color:var(--muted); font-size:16px; line-height:1.5; white-space:pre-line; }
.event-meta { text-align:right; }
.no-events,.calendar-status { margin:0; color:var(--muted); }

.newsletter { min-height:355px; padding-top:64px; padding-bottom:72px; text-align:center; }
.newsletter h2 { margin-bottom:40px; color:var(--coral); font-size:32px; font-weight:400; }
.newsletter iframe { width:min(480px,100%); height:150px; background:#151318; }

.testimonial { min-height:350px; padding:80px 20px 75px; background:linear-gradient(rgba(0,0,0,.4),rgba(0,0,0,.4)),url('assets/bio.jpg') center 46%/cover; text-align:center; }
.testimonial h2 { margin:26px 0 0; color:#fff; font:36px/1.28 "Archivo Black",sans-serif; letter-spacing:.015em; text-transform:uppercase; }
.testimonial p { margin:0; color:#ddd; }

.ep-copy-home { min-height:720px; display:grid; grid-template-columns:1fr 1fr; gap:8%; align-items:center; padding-top:95px; padding-bottom:95px; }
.ep-copy-home p,.bio-home p,.epk-ep-story p,.epk-bio p { color:var(--muted); }
.ep-copy-home img { display:block; width:100%; height:540px; object-fit:cover; object-position:center 44%; }

.release { min-height:420px; padding-top:60px; padding-bottom:80px; text-align:center; }
.release h2 { margin-bottom:45px; }
.bandcamp-player { display:block; width:min(700px,100%); margin:0 auto; }
.album-player { height:307px; }
.track-player { height:120px; }

.bio-home { display:grid; grid-template-columns:1fr 1fr; gap:7.5%; align-items:start; padding-top:95px; padding-bottom:95px; }
.bio-home img { width:100%; height:600px; object-fit:cover; object-position:center; }
.bio-home h2 { margin-bottom:42px; color:#eee; font-size:26px; font-weight:400; }
.bio-home p { margin-bottom:27px; }

.site-footer { min-height:490px; padding:75px 20px 90px; background:var(--charcoal); color:#aaa; text-align:center; }
.site-footer h3 { margin-bottom:18px; color:#eee; font-size:22px; font-weight:400; }
.booking-link { color:var(--pink); }
.socials { display:flex; justify-content:center; gap:20px; margin:75px 0 28px; }
.socials a { display:grid; width:22px; height:22px; place-items:center; border-radius:50%; background:#f4f4f4; color:#111; font-size:13px; font-weight:700; text-decoration:none; }
.copyright { font-size:14px; }
.site-footer nav { display:flex; justify-content:center; gap:22px; margin-top:30px; color:var(--pink); }

/* EPK */
.site-header + .epk-banner { margin-top:0; }
.epk-banner { height:205px; display:grid; place-items:center; padding:30px; background:linear-gradient(rgba(0,0,0,.24),rgba(0,0,0,.24)),url('assets/hero.jpg') center 48%/cover; text-align:center; }
.epk-banner h1 { margin:0; font:34px/1.2 "Archivo Black",sans-serif; letter-spacing:.015em; text-transform:uppercase; }
.epk-live { min-height:970px; padding:60px 6.55% 105px; text-align:center; }
.live-grid { display:grid; grid-template-columns:1fr 1fr; gap:8%; }
.live-grid article { min-width:0; }
.live-grid h3 { margin:24px 0 25px; font-size:20px; font-weight:400; }
.live-grid p { max-width:480px; margin:0 auto; color:var(--muted); font-size:14px; }
.studio-title { margin-top:112px; }
.epk-live .track-player { margin-top:15px; }
.epk-testimonial { background:linear-gradient(rgba(0,0,0,.4),rgba(0,0,0,.4)),url('assets/bio.jpg') center 46%/cover; }

.epk-ep-story { display:grid; grid-template-columns:1fr 1fr; align-items:stretch; }
.epk-ep-story .copy { padding:60px 11% 80px 18.5%; }
.epk-ep-story p { margin-bottom:28px; }
.epk-ep-story img { display:block; width:100%; height:100%; min-height:780px; object-fit:cover; object-position:center; }
.epk-release { min-height:415px; }

.fan-quote { min-height:405px; padding:70px 20px; background:linear-gradient(rgba(0,0,0,.42),rgba(0,0,0,.42)),url('assets/ep-art.png') center 42%/cover; text-align:center; }
.fan-quote h2 { margin:28px 0 0; font:38px/1.25 "Archivo Black",sans-serif; text-transform:uppercase; }
.fan-quote p { margin:0; }

.epk-bio { display:grid; grid-template-columns:1fr 1fr; align-items:stretch; background:var(--charcoal); }
.epk-bio>div { padding:70px 14% 100px 18.5%; }
.epk-bio h2 { margin-bottom:75px; color:var(--coral); font:36px/1.15 "Archivo Black",sans-serif; text-transform:uppercase; }
.epk-bio p { margin-bottom:28px; }
.epk-bio img { display:block; width:100%; height:100%; min-height:1200px; object-fit:cover; object-position:center 38%; }

.photos { padding:70px 6.55% 100px; background:#000; text-align:center; }
.photo-grid { column-count:3; column-gap:8px; max-width:1120px; margin:0 auto; }
.photo-grid img { display:block; width:100%; height:auto; margin:0 0 8px; break-inside:avoid; }

.epk-details { display:grid; grid-template-columns:1fr 1fr; gap:10%; padding:90px 12%; color:var(--muted); }
.epk-details h3 { color:#eee; font-size:22px; font-weight:400; }
.epk-details a { color:var(--pink); }

@media (max-width:900px) {
  .hero h1 { font-size:44px; }
  .quote-video { gap:5%; }
  .event-row { grid-template-columns:150px minmax(0,1fr) 220px; column-gap:32px; }
  .epk-ep-story .copy,.epk-bio>div { padding-left:10%; padding-right:10%; }
}

@media (max-width:760px) {
  body { font-size:15px; }
  .hero { display:block; min-height:0; padding:55px 24px; background-position:center; }
  .hero h1 { font-size:clamp(37px,11vw,44px); line-height:1.27; }
  .hero-art { width:100%; height:auto; margin-top:45px; }
  .home-section { padding-left:24px; padding-right:24px; }
  .quote-video { display:block; min-height:0; padding-top:72px; padding-bottom:72px; }
  .quote-video blockquote { margin-bottom:50px; font-size:25px; }
  .shows { padding-top:52px; padding-bottom:55px; }
  .shows h2,.release h2,.epk-live>h2,.photos h2 { font-size:30px; }
  .event-row { min-height:0; grid-template-columns:82px minmax(0,1fr); column-gap:22px; padding:24px 0 29px; }
  .event-date { grid-row:1 / span 2; }
  .event-month,.event-day { font-size:25px; }
  .event-details h3,.event-time { font-size:18px; }
  .event-details p,.event-location { margin-top:9px; font-size:14px; }
  .event-meta { grid-column:2; margin-top:18px; text-align:left; }
  .newsletter { min-height:330px; }
  .testimonial { min-height:0; padding:68px 22px 74px; }
  .testimonial h2 { font-size:27px; }
  .ep-copy-home { display:block; min-height:0; padding-top:70px; padding-bottom:70px; }
  .ep-copy-home img { height:auto; margin-bottom:45px; }
  .release { min-height:0; padding-top:55px; padding-bottom:65px; }
  .album-player { height:470px; }
  .bio-home { display:block; padding-top:70px; padding-bottom:70px; }
  .bio-home img { height:auto; margin-bottom:50px; }
  .site-footer { min-height:440px; }

  .site-header + .epk-banner { margin-top:0; }
  .epk-banner { height:180px; padding:24px; }
  .epk-banner h1 { font-size:27px; }
  .epk-live { min-height:0; padding:55px 24px 75px; }
  .live-grid { display:block; }
  .live-grid article + article { margin-top:60px; }
  .studio-title { margin-top:85px; }
  .epk-ep-story,.epk-bio { display:block; min-height:0; }
  .epk-ep-story .copy,.epk-bio>div { padding:65px 24px; }
  .epk-ep-story img,.epk-bio img { height:auto; min-height:0; }
  .fan-quote { min-height:360px; padding-top:65px; }
  .fan-quote h2 { font-size:29px; }
  .epk-bio h2 { margin-bottom:50px; font-size:31px; }
  .photos { padding:60px 12px 70px; }
  .photo-grid { column-count:2; column-gap:6px; }
  .photo-grid img { margin-bottom:6px; }
  .epk-details { display:block; padding:70px 24px; }
  .epk-details>div + div { margin-top:55px; }
}