/* =================================================================
   Concrete Beach — style.css
   Recreation of the black + gold identity, built mobile-first.
   ================================================================= */

:root{
  --gold:#F5B301; --gold-deep:#D99900; --gold-soft:rgba(245,179,1,.14);
  --ink:#0C0C0D; --ink-2:#151517; --ink-3:#1F1F24;
  --paper:#FFFFFF; --paper-2:#F5F4F1;
  --text:#17171A; --muted:#6E6E75; --line:rgba(0,0,0,.10);
  --wrap:1120px; --radius:14px;
  --shadow:0 10px 30px rgba(0,0,0,.12);
  --ff-display:"Anton",system-ui,sans-serif;
  --ff:"Inter",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; font-family:var(--ff); color:var(--text);
  background:var(--paper); line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{margin:0;line-height:1.05}

/* ---- Branded image placeholders (swap for <img> when assets land) -- */
.ph{
  position:relative; background:
    repeating-linear-gradient(135deg,rgba(245,179,1,.06) 0 12px,transparent 12px 24px),
    var(--ink-2);
  border:1px dashed rgba(245,179,1,.45); border-radius:var(--radius);
  min-height:120px; display:flex; align-items:center; justify-content:center;
}
.ph::after{
  content:attr(data-ph); color:rgba(245,179,1,.75);
  font-size:.72rem; letter-spacing:.06em; text-transform:uppercase;
  padding:.4em .7em; text-align:center;
}

/* ---- Buttons ------------------------------------------------------ */
.btn{
  display:inline-flex; align-items:center; gap:.4em;
  font-weight:700; font-size:.95rem; padding:.7em 1.15em;
  border-radius:999px; border:2px solid transparent; cursor:pointer;
  transition:transform .12s ease, background .18s ease, color .18s ease;
}
.btn:active{transform:translateY(1px)}
.btn--gold{background:var(--gold); color:#171100}
.btn--gold:hover{background:var(--gold-deep)}
.btn--ghost{border-color:currentColor;color:var(--ink)}
.btn--ghost:hover{background:var(--ink);color:#fff}

/* ---- Announcement bar --------------------------------------------- */
.announce{
  background:var(--gold); color:#171100; text-align:center;
  font-weight:600; font-size:.86rem; letter-spacing:.01em;
  padding:.55em 1em; display:flex; gap:.5em; justify-content:center; align-items:center;
}
.announce b{font-weight:800}
.announce__dot{color:#B00; font-size:.7em; animation:pulse 1.8s infinite}
@keyframes pulse{50%{opacity:.35}}

/* ---- Header / nav ------------------------------------------------- */
.site{position:sticky; top:0; z-index:40; background:var(--ink); color:#fff;}
.site__bar{
  max-width:var(--wrap); margin:0 auto; padding:.7em 1em;
  display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:.6em;
}
.brand{display:flex; align-items:center; gap:.55em; justify-self:center}
.brand__logo{height:40px;width:auto;min-height:0;object-fit:contain;flex:0 0 auto}
.brand__logo--sm{height:56px;width:auto}
.brand__name{font-family:var(--ff-display); font-size:1.15rem; letter-spacing:.02em; color:var(--gold)}
.nav{display:none}
.site__actions{display:flex; align-items:center; gap:.5em; justify-self:end}
.social{
  width:34px;height:34px;display:grid;place-items:center;border-radius:50%;
  background:var(--ink-3); color:var(--gold); font-size:.9rem; line-height:1;
}
.social:hover{background:var(--gold);color:#171100}
.site__actions .btn{display:none}

.nav-toggle{
  width:40px;height:40px;background:transparent;border:0;cursor:pointer;
  display:flex;flex-direction:column;justify-content:center;gap:5px;padding:8px;justify-self:start
}
.nav-toggle span{height:2px;background:#fff;border-radius:2px;transition:.2s}
body.nav-open .nav-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
body.nav-open .nav-toggle span:nth-child(2){opacity:0}
body.nav-open .nav-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* Mobile dropdown nav */
.nav{
  position:fixed; inset:0 0 auto 0; top:0; background:var(--ink);
  padding:5.2em 1.4em 1.6em; flex-direction:column; gap:.2em;
  transform:translateY(-110%); transition:transform .28s ease; display:flex;
}
body.nav-open .nav{transform:translateY(0)}
.nav a{
  font-family:var(--ff-display); font-size:1.6rem; color:#fff; padding:.45em 0;
  border-bottom:1px solid rgba(255,255,255,.08); letter-spacing:.02em;
}
.nav a[aria-current="page"]{color:var(--gold)}

/* ---- Section rhythm ----------------------------------------------- */
.section{padding:3.2em 1em}
.kicker{
  display:inline-block; font-weight:700; font-size:.72rem; letter-spacing:.18em;
  text-transform:uppercase; color:var(--gold-deep); margin-bottom:.7em;
}

/* ---- Hero --------------------------------------------------------- */
.hero{position:relative; color:#fff; overflow:hidden; background:var(--ink)}
.hero__media{
  position:absolute; inset:0; min-height:0; border:0; border-radius:0;
  background:
    radial-gradient(120% 90% at 70% 0%,rgba(245,179,1,.18),transparent 60%),
    repeating-linear-gradient(135deg,rgba(245,179,1,.05) 0 14px,transparent 14px 28px),
    linear-gradient(180deg,#1a1712,#0a0a0b);
}
.hero__media::after{color:rgba(245,179,1,.45)}
.hero__scrim{position:absolute; inset:0; background:linear-gradient(180deg,rgba(12,12,13,.35),rgba(12,12,13,.86))}
.hero__inner{
  position:relative; max-width:var(--wrap); margin:0 auto;
  padding:3.4em 1.2em 3.2em; text-align:center;
}
.hero__eyebrow{color:var(--gold); font-weight:600; letter-spacing:.14em; text-transform:uppercase; font-size:.78rem; margin:0 0 .8em}
.hero__title{display:flex; flex-direction:column; gap:.06em; align-items:center; margin:0 0 .5em}
.hero__title-1{font-family:var(--ff-display); font-size:clamp(2.7rem,11vw,5.4rem); letter-spacing:.01em; line-height:.92}
.hero__title-2{font-family:var(--ff-display); font-size:clamp(2rem,8.5vw,4.2rem); color:var(--gold); line-height:.92}
.hero__sub{max-width:34ch; margin:.6em auto 1.8em; color:rgba(255,255,255,.82)}

.listen{margin:0 auto 1.6em}
.listen__label{display:block; font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color:rgba(255,255,255,.6); margin-bottom:.7em}
.listen__row{display:flex; gap:.6em; justify-content:center; flex-wrap:wrap}
.listen__btn{
  display:inline-flex; align-items:center; gap:.5em; background:#fff; color:#171100;
  font-weight:600; font-size:.85rem; padding:.55em .95em; border-radius:999px;
  transition:transform .12s ease, box-shadow .18s ease;
}
.listen__btn:hover{transform:translateY(-2px); box-shadow:0 8px 18px rgba(0,0,0,.35)}
.listen__ico{width:16px;height:16px;border-radius:4px;background:var(--ink);display:inline-block}
.ico--spotify{background:#1DB954;border-radius:50%}
.ico--youtube{background:#FF0000;border-radius:4px}
.ico--apple{background:linear-gradient(135deg,#FB5C74,#A44BD3);border-radius:4px}
.hero__rating{margin:.4em 0 0; font-size:.9rem; color:rgba(255,255,255,.8)}
.stars{color:var(--gold); letter-spacing:.12em}

/* ---- Next show ---------------------------------------------------- */
.nextshow{background:var(--ink-2); color:#fff}
.nextshow__inner{max-width:var(--wrap); margin:0 auto}
.nextshow .kicker{color:var(--gold)}
.nextshow__row{display:flex; align-items:center; gap:1.1em; flex-wrap:wrap}
.nextshow__date{
  flex:0 0 auto; width:78px; height:78px; border-radius:14px; background:var(--gold); color:#171100;
  display:flex; flex-direction:column; align-items:center; justify-content:center; line-height:1;
}
.nextshow__d{font-family:var(--ff-display); font-size:2rem}
.nextshow__m{font-weight:700; font-size:.8rem; text-transform:uppercase; letter-spacing:.08em}
.nextshow__meta{flex:1 1 220px}
.nextshow__venue{margin:0; font-weight:800; font-size:1.25rem}
.nextshow__where{margin:.15em 0 0; color:rgba(255,255,255,.7)}
.nextshow__note{margin:.35em 0 0; font-size:.85rem; color:var(--gold)}

/* ---- About -------------------------------------------------------- */
.about{background:var(--paper)}
.about__inner{max-width:var(--wrap); margin:0 auto; display:grid; gap:1.6em}
.about__text h2{font-size:clamp(1.7rem,6vw,2.5rem); font-weight:800; margin:.1em 0 .5em}
.about__usp{color:var(--muted)}
.about__text .btn{margin-top:.6em}
.about__media{min-height:240px}

/* ---- Press -------------------------------------------------------- */
.press{background:var(--paper-2)}
.press__inner{max-width:var(--wrap); margin:0 auto}
.press__row{display:grid; gap:1em}
.press__card{
  background:var(--paper); border:1px solid var(--line); border-radius:var(--radius);
  padding:1.1em 1.2em; box-shadow:var(--shadow); transition:transform .14s ease;
}
.press__card:hover{transform:translateY(-3px)}
.press__src{display:block; font-family:var(--ff-display); font-size:1.25rem; color:var(--gold-deep); margin-bottom:.2em}
.press__quote{color:var(--text)}

/* ---- Footer ------------------------------------------------------- */
.foot{background:var(--ink); color:#fff; padding:2.6em 1em 1.2em}
.foot__inner{max-width:var(--wrap); margin:0 auto; display:grid; gap:1.6em}
.foot__brand .brand__logo{margin-bottom:.5em}
.foot__name{font-family:var(--ff-display); font-size:1.3rem; color:var(--gold); margin:0}
.tm{font-size:.6em; vertical-align:super}
.foot__tag{color:rgba(255,255,255,.6); margin:.2em 0 0; font-size:.9rem}
.foot__col h4{font-size:.75rem; letter-spacing:.14em; text-transform:uppercase; color:var(--gold); margin:0 0 .6em}
.foot__col a{display:block; color:rgba(255,255,255,.82); padding:.22em 0}
.foot__col a:hover{color:#fff}
.foot__legal{
  max-width:var(--wrap); margin:1.8em auto 0; padding-top:1.1em;
  border-top:1px solid rgba(255,255,255,.1); display:flex; justify-content:space-between;
  gap:.8em; flex-wrap:wrap; color:rgba(255,255,255,.55); font-size:.82rem;
}
.foot__top:hover{color:var(--gold)}

/* ---- Focus & motion ----------------------------------------------- */
:focus-visible{outline:3px solid var(--gold); outline-offset:2px; border-radius:4px}
@media (prefers-reduced-motion:reduce){
  *{animation:none !important; transition:none !important; scroll-behavior:auto !important}
}

/* ===================================================================
   Tablet / desktop
   =================================================================== */
@media (min-width:760px){
  .section{padding:4.2em 1.4em}
  .nav-toggle{display:none}
  .nav{
    position:static; inset:auto; transform:none; display:flex; flex-direction:row;
    background:transparent; padding:0; gap:1.4em; justify-self:center;
  }
  .nav a{
    font-family:var(--ff); font-size:.98rem; font-weight:600; color:rgba(255,255,255,.85);
    border:0; padding:.2em 0; position:relative;
  }
  .nav a:hover{color:#fff}
  .nav a[aria-current="page"]{color:var(--gold)}
  .nav a[aria-current="page"]::after{
    content:""; position:absolute; left:0; right:0; bottom:-6px; height:2px; background:var(--gold);
  }
  .site__bar{grid-template-columns:auto 1fr auto}
  .brand{justify-self:start}
  .site__actions .btn{display:inline-flex}

  .about__inner{grid-template-columns:1.05fr .95fr; align-items:center; gap:2.4em}
  .press__row{grid-template-columns:1fr 1fr}
  .foot__inner{grid-template-columns:1.4fr 1fr 1fr; gap:2em}
}

@media (min-width:1000px){
  .hero__inner{padding:5em 1.2em 4.4em}
}

/* ===================================================================
   Interior pages: Meet the Band + Contact
   =================================================================== */
.pagehead{background:var(--ink); color:#fff; padding:2.6em 1em 2.2em}
.pagehead__inner{max-width:var(--wrap); margin:0 auto}
.pagehead .kicker{color:var(--gold)}
.pagehead h1{font-family:var(--ff-display); font-size:clamp(2.2rem,9vw,3.6rem); letter-spacing:.01em}
.pagehead p{color:rgba(255,255,255,.72); margin:.5em 0 0}

.story{background:var(--paper)}
.story__inner{max-width:760px; margin:0 auto}
.story__inner p{margin:0 0 1em; color:var(--text)}

.members{background:var(--paper-2)}
.members__inner{max-width:var(--wrap); margin:0 auto}
.members__grid{display:grid; gap:1.4em; grid-template-columns:1fr}
.member{background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); padding:1.1em; box-shadow:var(--shadow)}
.member__photo{aspect-ratio:4/5; width:100%; height:auto; object-fit:cover; border-radius:calc(var(--radius) - 4px); margin-bottom:.9em}
.member__name{font-size:1.3rem; font-weight:800}
.member__role{color:var(--gold-deep); font-weight:700; margin:.15em 0 0; font-size:.9rem}
.member__meta{color:var(--muted); font-size:.82rem; margin:.15em 0 .6em}
.member__bio{color:var(--text); font-size:.95rem; margin:0}

.disco{background:var(--paper)}
.disco__inner{max-width:760px; margin:0 auto}
.disco__list{list-style:none; margin:0; padding:0}
.disco__item{display:grid; grid-template-columns:auto 1fr; gap:.2em 1em; padding:1em 0; border-bottom:1px solid var(--line)}
.disco__year{font-family:var(--ff-display); color:var(--gold-deep); font-size:1.2rem; grid-row:span 2}
.disco__title{font-weight:800; font-size:1.1rem}
.disco__note{color:var(--muted); font-size:.9rem}

.thanks{background:var(--ink); color:#fff}
.thanks__inner{max-width:760px; margin:0 auto}
.thanks .kicker{color:var(--gold)}
.thanks p{color:rgba(255,255,255,.8); margin:0}

.contact{background:var(--paper)}
.contact__inner{max-width:var(--wrap); margin:0 auto; display:grid; gap:1.6em}
.contact__card,.contact__shows{background:var(--paper-2); border:1px solid var(--line); border-radius:var(--radius); padding:1.4em}
.contact__card h2,.contact__shows h2{font-size:1.4rem; font-weight:800; margin:0 0 .5em}
.contact__card .btn{margin:.4em 0}
.contact__email{margin:.6em 0 0}
.contact__email a{color:var(--gold-deep); font-weight:600}
.contact__social{display:flex; gap:1em; margin-top:.9em; flex-wrap:wrap}
.contact__social a{color:var(--text); font-weight:600; border-bottom:2px solid var(--gold)}
.showlist{list-style:none; margin:0; padding:0}
.showlist__item{display:flex; flex-direction:column; padding:.8em 0; border-bottom:1px solid var(--line)}
.showlist__date{font-family:var(--ff-display); color:var(--gold-deep); font-size:1.1rem}
.showlist__venue{font-weight:700}
.showlist__time{color:var(--muted); font-size:.88rem}

@media (min-width:760px){
  .members__grid{grid-template-columns:repeat(3,1fr)}
  .contact__inner{grid-template-columns:1.1fr .9fr; align-items:start}
  .disco__item{grid-template-columns:auto 1fr auto; align-items:baseline}
  .disco__note{text-align:right}
}
@media (min-width:1000px){
  .members__grid{grid-template-columns:repeat(5,1fr)}
  .members .member__bio{font-size:.88rem}
}

/* Listen / Spotify */
.listen-sec{background:var(--ink-2);color:#fff}
.listen-sec__inner{max-width:820px;margin:0 auto;text-align:center}
.listen-sec .kicker{color:var(--gold)}
.listen-sec h2{font-size:clamp(1.7rem,6vw,2.4rem);font-weight:800;margin:.1em 0 .45em}
.listen-sec__sub{color:rgba(255,255,255,.72);margin:0 auto 1.4em;max-width:46ch}
.spotify-embed{margin:0 auto 1.2em}
.listen-sec__links{display:flex;gap:.6em;justify-content:center;flex-wrap:wrap}

/* Featured / Rebelution spotlight */
.featured{background:var(--ink);color:#fff}
.featured__inner{max-width:760px;margin:0 auto;text-align:center}
.featured .kicker{color:var(--gold)}
.featured h2{font-size:clamp(1.6rem,6vw,2.3rem);font-weight:800;margin:.1em 0 .7em}
.featured__card{display:block;background:var(--ink-3);border:1px solid var(--gold-soft);border-radius:var(--radius);padding:1.4em 1.2em;text-decoration:none;color:#fff;transition:transform .15s ease,border-color .15s ease}
.featured__card:hover{transform:translateY(-2px);border-color:var(--gold)}
.featured__quote{font-family:var(--ff-display);font-size:clamp(1.05rem,4.2vw,1.4rem);line-height:1.45;margin:0 0 .8em}
.featured__meta{display:block;color:rgba(255,255,255,.65);font-size:.9rem;margin-bottom:1.1em}
.featured__cta{display:inline-block}
.featured__follow{margin-top:1.3em;color:rgba(255,255,255,.72);font-size:.95rem}
.featured__follow a{color:var(--gold)}

/* Hero credential */
.hero__cred{margin-top:.5em;font-size:.95rem;opacity:.92}
.hero__cred a{color:var(--gold);text-decoration:none;border-bottom:1px solid var(--gold-soft)}
.hero__cred a:hover{border-color:var(--gold)}

/* Featured video embed */
.featured__video{aspect-ratio:16/9;margin:0 0 .55em;border-radius:var(--radius);overflow:hidden;border:1px solid var(--gold-soft);background:#000}
.featured__video iframe{width:100%;height:100%;border:0;display:block}
.featured__caption{color:rgba(255,255,255,.65);font-size:.9rem;margin:0 0 1.2em}
.featured__caption a{color:var(--gold)}

/* ---- Newsletter signup -------------------------------------------- */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.signup{background:var(--ink-2);color:#fff}
.signup__inner{max-width:640px;margin:0 auto;text-align:center}
.signup .kicker{color:var(--gold)}
.signup h2{font-size:clamp(1.7rem,6vw,2.4rem);font-weight:800;margin:.1em 0 .5em}
.signup__sub{color:rgba(255,255,255,.75);margin:0 auto 1.4em;max-width:44ch}
.signup__form{display:flex;gap:.6em;justify-content:center;flex-wrap:wrap}
.signup__hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.signup__input{
  flex:1 1 260px;max-width:340px;padding:.75em 1em;border-radius:999px;
  border:2px solid rgba(255,255,255,.18);background:var(--ink-3);color:#fff;
  font-size:.95rem;font-family:var(--ff);
}
.signup__input::placeholder{color:rgba(255,255,255,.5)}
.signup__input:focus{outline:none;border-color:var(--gold)}
.signup__form .btn{flex:0 0 auto}
.signup__fine{color:rgba(255,255,255,.5);font-size:.78rem;margin:1em 0 0}
.signup__ok{color:var(--gold);font-weight:600;font-size:1.05rem;margin:.4em 0 0}
.signup__err{color:#ff9d9d;font-size:.9rem;margin:0 0 .8em}

/* ---- Follow along: Instagram grid + Facebook timeline ------------- */
.follow{background:var(--paper)}
.follow__inner{max-width:var(--wrap);margin:0 auto;text-align:center}
.follow h2{font-size:clamp(1.7rem,6vw,2.4rem);font-weight:800;margin:.1em 0 .45em}
.follow__sub{color:var(--muted);margin:0 auto 1.6em;max-width:48ch}
.follow__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.7em;margin:0 auto 1.5em}
.follow__item{position:relative;display:block;aspect-ratio:1/1;overflow:hidden;border-radius:var(--radius);background:var(--ink-2);box-shadow:var(--shadow)}
.follow__img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.follow__item:hover .follow__img,.follow__item:focus-visible .follow__img{transform:scale(1.06)}
.follow__play{position:absolute;top:.45em;right:.55em;color:#fff;font-size:.85rem;text-shadow:0 1px 5px rgba(0,0,0,.7);pointer-events:none}
.follow__cap{
  position:absolute;inset:auto 0 0 0;padding:1.6em .8em .7em;text-align:left;color:#fff;
  font-size:.78rem;line-height:1.3;background:linear-gradient(180deg,transparent,rgba(0,0,0,.85));
  opacity:0;transform:translateY(10px);transition:opacity .2s ease,transform .2s ease;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}
.follow__item:hover .follow__cap,.follow__item:focus-visible .follow__cap{opacity:1;transform:none}
.follow__ctas{display:flex;gap:.6em;justify-content:center;flex-wrap:wrap;margin:0 0 2em}
.ico--ig{background:radial-gradient(circle at 30% 107%,#fdf497 0,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285AEB 90%);border-radius:5px}
.ico--fb{background:#1877F2;border-radius:5px}
.follow__subhead{display:flex;align-items:center;justify-content:center;gap:.45em;font-size:.9rem;font-weight:700;letter-spacing:.02em;color:var(--muted);margin:1.4em 0 1em}
/* Facebook block sits in a dark panel so the posts pop off the white section */
.follow__fbpanel{background:var(--ink);border-radius:calc(var(--radius) + 4px);padding:1.6em 1.3em 1.9em;margin:1.6em auto;max-width:980px;box-shadow:var(--shadow)}
.follow__fbpanel .follow__subhead{color:#fff;margin:.1em 0 1.1em}
.fbfeed{display:grid;grid-template-columns:1fr;gap:1em;text-align:left}
.fbcard{display:flex;flex-direction:column;background:var(--ink-3);border:1px solid var(--gold-soft);border-radius:var(--radius);overflow:hidden;transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease}
.fbcard:hover{transform:translateY(-4px);border-color:var(--gold);box-shadow:0 10px 26px rgba(0,0,0,.35)}
.fbcard__imgwrap{display:block;aspect-ratio:16/10;overflow:hidden;background:var(--ink-2)}
.fbcard__img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.fbcard:hover .fbcard__img{transform:scale(1.05)}
.fbcard__text{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;padding:.85em .95em;color:rgba(255,255,255,.82);font-size:.9rem;line-height:1.45}
@media (min-width:640px){.fbfeed{grid-template-columns:repeat(3,1fr)}}

@media (min-width:760px){
  .follow__grid{grid-template-columns:repeat(4,1fr);gap:.9em}
}

/* ---- Watch: YouTube uploads --------------------------------------- */
.watch{background:var(--paper)}
.watch__inner{max-width:var(--wrap);margin:0 auto;text-align:center}
.watch h2{font-size:clamp(1.7rem,6vw,2.4rem);font-weight:800;margin:.1em 0 .45em}
.watch__sub{color:var(--muted);margin:0 auto 1.6em;max-width:46ch}
.watch__grid{display:grid;grid-template-columns:1fr;gap:1em;margin:0 auto 1.6em;text-align:left}
.watch__item{display:block;background:var(--ink-2);color:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);transition:transform .15s ease}
.watch__item:hover{transform:translateY(-3px)}
.watch__thumb{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:#000}
.watch__thumb img{width:100%;height:100%;object-fit:cover}
.watch__play{position:absolute;inset:0;display:grid;place-items:center;font-size:1.7rem;color:#fff;background:rgba(0,0,0,.28);transition:background .15s ease}
.watch__item:hover .watch__play{background:rgba(0,0,0,.12)}
.watch__title{display:block;padding:.7em .9em;font-weight:700;font-size:.95rem;color:#fff}
.watch__ctas{display:flex;justify-content:center}
@media (min-width:640px){.watch__grid{grid-template-columns:1fr 1fr}}
@media (min-width:1000px){.watch__grid{grid-template-columns:repeat(3,1fr)}}

/* ---- Shows page --------------------------------------------------- */
.shows{background:var(--paper)}
.shows__inner{max-width:760px;margin:0 auto}
.shows__list{list-style:none;margin:0 0 1.4em;padding:0;display:grid;gap:1em}
.showcard{display:flex;flex-wrap:wrap;align-items:center;gap:.4em 1.1em;background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius);padding:1.1em 1.2em;box-shadow:var(--shadow)}
.showcard__date{flex:0 0 auto;width:70px;height:70px;border-radius:14px;background:var(--gold);color:#171100;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1}
.showcard__d{font-family:var(--ff-display);font-size:1.9rem}
.showcard__m{font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.08em}
.showcard__body{flex:1 1 220px}
.showcard__venue{margin:0;font-weight:800;font-size:1.2rem}
.showcard__where{margin:.1em 0 0;color:var(--muted)}
.showcard__note{margin:.3em 0 0;color:var(--gold-deep);font-size:.88rem}
.showcard__actions{flex:1 1 100%;display:flex;gap:.5em;flex-wrap:wrap}
.showcard__actions .btn{font-size:.85rem;padding:.5em .95em}
.shows__empty{text-align:center;color:var(--muted);font-size:1.05rem}
.shows__empty a{color:var(--gold-deep);font-weight:600}
.shows__cta{text-align:center;margin-top:.6em}
@media (min-width:620px){
  .showcard__actions{flex:0 0 auto;margin-left:auto}
}

/* ---- EPK / press kit ---------------------------------------------- */
.epk{background:var(--paper-2)}
.epk__inner{max-width:var(--wrap);margin:0 auto}
.epk__facts{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.fact{background:var(--paper);padding:1em 1.1em}
.fact__k{display:block;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);font-weight:700;margin-bottom:.25em}
.fact__v{font-weight:700;color:var(--text)}
.epk__usp{color:var(--gold-deep);font-weight:600;margin-top:1.1em}
.epk-book{background:var(--ink);color:#fff;text-align:center}
.epk-book__inner{max-width:640px;margin:0 auto}
.epk-book .kicker{color:var(--gold)}
.epk-book h2{font-size:clamp(1.6rem,6vw,2.3rem);font-weight:800;margin:.1em 0 .5em}
.epk-book p{color:rgba(255,255,255,.8)}
.epk-book .btn{margin:1em .3em .3em}
.epk-book__email a{color:var(--gold)}
.epk-book__links{display:flex;gap:1.2em;justify-content:center;flex-wrap:wrap;margin-top:1em}
.epk-book__links a{color:#fff;font-weight:600;border-bottom:2px solid var(--gold)}
.epk-book__links a:hover{color:var(--gold)}
@media (min-width:760px){ .epk__facts{grid-template-columns:repeat(3,1fr)} }

/* ---- Blog index --------------------------------------------------- */
.blog{background:var(--paper)}
.blog__inner{max-width:820px;margin:0 auto}
.blog__list{display:grid;gap:1.4em}
.blogcard{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);transition:transform .15s ease}
.blogcard:hover{transform:translateY(-3px)}
.blogcard__imgwrap{display:block;aspect-ratio:16/9;overflow:hidden;background:var(--ink-2)}
.blogcard__imgwrap img{width:100%;height:100%;object-fit:cover}
.blogcard__body{padding:1.2em 1.3em}
.blogcard__date{font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-deep);font-weight:700}
.blogcard__title{font-size:1.35rem;font-weight:800;margin:.25em 0 .35em;line-height:1.15}
.blogcard__title a:hover{color:var(--gold-deep)}
.blogcard__excerpt{color:var(--muted);margin:0 0 .7em}
.blogcard__more{color:var(--gold-deep);font-weight:700;font-size:.9rem}
.blog__empty{text-align:center;color:var(--muted);font-size:1.05rem;padding:1em 0}
.blog__empty a{color:var(--gold-deep);font-weight:600}

/* ---- Single post -------------------------------------------------- */
.post{background:var(--paper)}
.post__inner{max-width:720px;margin:0 auto}
.post__back{display:inline-block;color:var(--gold-deep);font-weight:700;font-size:.9rem;margin-bottom:1em}
.post .kicker{color:var(--gold-deep)}
.post__title{font-size:clamp(1.8rem,6vw,2.7rem);font-weight:800;line-height:1.1;margin:.1em 0 .6em}
.post__hero{width:100%;border-radius:var(--radius);margin:.4em 0 1.2em}
.post__body{color:var(--text);font-size:1.05rem;line-height:1.7}
.post__body p{margin:0 0 1.1em}
.post__body h2{font-size:1.5rem;font-weight:800;margin:1.4em 0 .5em}
.post__body h3{font-size:1.2rem;font-weight:800;margin:1.2em 0 .4em}
.post__body ul,.post__body ol{margin:0 0 1.1em 1.2em;padding:0}
.post__body li{margin:.4em 0}
.post__body a{color:var(--gold-deep);font-weight:600;border-bottom:1px solid var(--gold-soft)}
.post__body a:hover{border-color:var(--gold-deep)}
.post__body img{max-width:100%;border-radius:var(--radius);margin:.6em 0}
.post__body blockquote{margin:1.1em 0;padding:.4em 0 .4em 1.1em;border-left:3px solid var(--gold);color:var(--muted);font-style:italic}
.post__share{display:flex;align-items:center;gap:1em;flex-wrap:wrap;margin:1.8em 0 .4em;padding-top:1.2em;border-top:1px solid var(--line)}
.post__share-label{font-weight:700;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.post__share a{color:var(--gold-deep);font-weight:600;border-bottom:2px solid var(--gold)}
.post__backbtn{margin-top:1.2em}
.draftbar{background:var(--gold);color:#171100;text-align:center;font-weight:700;padding:.6em 1em;font-size:.9rem}