/*
Theme Name: Murchandise
Theme URI: https://murchandisemusic.com
Author: Murchandise Music
Description: Custom theme for Murchandise Music — independent record label, London. White ground, deep navy structure, raspberry accent; type mirrors the label wordmark.
Version: 1.5.0
Requires at least: 6.0
Tested up to: 7.0
Requires PHP: 7.4
License: Proprietary
Text Domain: murchandise
*/

:root{
  --navy:#1b1d2f;
  --navy-2:#262942;
  --navy-ink:#181b31;
  --white:#ffffff;
  --off:#f4f5f9;
  --pink:#fb3a64;
  --pink-2:#da4972;
  --muted:#707281;
  --lav:#a9adc4;
  --line-d:rgba(255,255,255,.14);
  --line-l:rgba(24,27,49,.14);
  --disp:"Archivo",ui-sans-serif,system-ui,"Helvetica Neue",Arial,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
body{
  background:var(--white);
  color:var(--navy-ink);
  font-family:var(--disp);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
a,button{touch-action:manipulation}
a:focus-visible,button:focus-visible{outline:2px solid var(--pink);outline-offset:3px;border-radius:2px}
::selection{background:var(--pink);color:var(--white)}

/* brand strip */
.tristrip{display:block;height:6px;background:
  linear-gradient(to bottom,var(--pink) 0 33.4%,var(--pink-2) 33.4% 66.7%,var(--navy) 66.7% 100%)}

/* --- loading screen --- */
#mm-preloader{
  position:fixed;inset:0;z-index:200;background:var(--navy);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:36px;
  transition:opacity .65s ease,visibility .65s;
}
#mm-preloader .pl-logo{
  width:min(280px,58vw);height:auto;
  animation:pl-in .9s cubic-bezier(.2,.7,.2,1) both,pl-pulse 2.4s ease-in-out .9s infinite;
}
@keyframes pl-in{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:none}}
@keyframes pl-pulse{0%,100%{opacity:.88}50%{opacity:1}}
#mm-preloader .pl-bar{
  width:min(210px,48vw);height:3px;border-radius:99px;overflow:hidden;
  background:rgba(255,255,255,.14);
}
#mm-preloader .pl-bar span{
  display:block;height:100%;width:42%;border-radius:99px;
  background:linear-gradient(90deg,var(--pink),var(--pink-2));
  animation:pl-slide 1.1s ease-in-out infinite alternate;
}
@keyframes pl-slide{from{transform:translateX(-70%)}to{transform:translateX(230%)}}
#mm-preloader .pl-tag{
  font-weight:300;font-size:9.5px;letter-spacing:.5em;text-transform:uppercase;
  color:var(--lav);text-indent:.5em;
}
#mm-preloader.done{opacity:0;visibility:hidden}

/* --- nav --- */
header.nav{
  position:sticky;top:0;z-index:80; /* stays above the mobile menu overlay */
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:9px clamp(16px,4vw,48px);
  background:rgba(27,29,47,.94); /* fallback for browsers without color-mix */
  background:color-mix(in srgb,var(--navy) 92%,transparent);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line-d);
  color:var(--white);
}
body.admin-bar header.nav{top:32px}
@media(max-width:782px){body.admin-bar header.nav{top:46px}}
.wordmark{display:flex;align-items:center}
.wordmark img{height:52px;width:auto;display:block;transition:opacity .2s}
.wordmark:hover img{opacity:.85}
nav.links{display:flex;align-items:center;gap:clamp(12px,2.4vw,30px)}
nav.links .m-only,nav.links .m-foot{display:none} /* mobile-menu extras */
nav.links a{
  font-size:12px;letter-spacing:.18em;text-transform:uppercase;font-weight:600;
  color:var(--lav);transition:color .2s;
}
nav.links a:hover{color:var(--pink)}
.navcta{
  background:var(--pink);border-radius:99px;padding:9px 18px;
  font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;
  transition:background .2s;white-space:nowrap;color:var(--white)!important;
}
.navcta:hover{background:var(--pink-2)}
.burger{
  display:none;flex-direction:column;justify-content:center;gap:5px;
  width:44px;height:44px;padding:10px;background:none;border:0;cursor:pointer;
  position:relative;z-index:70;
}
.burger span{display:block;height:2px;width:100%;background:var(--white);border-radius:2px;
  transition:transform .3s cubic-bezier(.2,.7,.2,1),opacity .2s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
body.menu-open{overflow:hidden}

/* --- brand opening --- */
.brand-intro{
  position:relative;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;
  min-height:min(74vh,700px);
  padding:clamp(56px,9vh,110px) clamp(18px,4vw,48px) clamp(40px,6vh,72px);
  background:
    radial-gradient(760px 460px at 50% 32%,rgba(251,58,100,.13),transparent 62%),
    var(--navy);
  color:var(--white);
  overflow:hidden;
}
.brand-intro .bi-star{position:absolute;color:var(--lav);opacity:.34;user-select:none;pointer-events:none}
.bi-star-a{top:16%;left:12%;font-size:22px}
.bi-star-b{bottom:22%;right:11%;font-size:30px}
.bi-logo{
  width:min(330px,72vw);height:auto;margin-bottom:clamp(22px,3.4vh,34px);
}
.bi-tagline{
  font-weight:300;text-transform:uppercase;
  font-size:clamp(12px,1.55vw,19px);letter-spacing:.34em;line-height:1.7;
  color:var(--white);max-width:22ch;text-indent:.34em;
}
.bi-rule{
  width:96px;margin:clamp(20px,3vh,30px) 0 clamp(14px,2vh,20px);border-radius:99px;
}
.bi-sub{
  font-weight:600;text-transform:uppercase;font-size:10.5px;letter-spacing:.28em;color:var(--lav);
}
@keyframes bi-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
/* Entrance animation is an enhancement only: it runs when JS has confirmed it can.
   Without it the brand opening is fully visible, never hidden by a stalled animation. */
@media (prefers-reduced-motion:no-preference){
  .mm-js .bi-logo   {animation:bi-rise .85s cubic-bezier(.2,.7,.2,1) both}
  .mm-js .bi-tagline{animation:bi-rise .85s cubic-bezier(.2,.7,.2,1) .12s both}
  .mm-js .bi-rule   {animation:bi-rise .85s cubic-bezier(.2,.7,.2,1) .2s both}
  .mm-js .bi-sub    {animation:bi-rise .85s cubic-bezier(.2,.7,.2,1) .26s both}
  .mm-js .bi-cue    {animation:bi-rise .85s cubic-bezier(.2,.7,.2,1) .36s both}
}
.bi-cue{
  position:absolute;left:50%;bottom:clamp(20px,3.4vh,34px);transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:9px;
}
.bi-cue-line{
  display:block;width:1px;height:34px;background:linear-gradient(var(--lav),transparent);
  animation:bi-drop 1.9s ease-in-out infinite;
}
@keyframes bi-drop{0%,100%{opacity:.35;transform:scaleY(.72);transform-origin:top}50%{opacity:1;transform:scaleY(1);transform-origin:top}}
.bi-cue-txt{
  font-weight:300;text-transform:uppercase;font-size:9.5px;letter-spacing:.32em;
  color:var(--lav);text-indent:.32em;transition:color .2s;
}
.bi-cue:hover .bi-cue-txt{color:var(--pink)}

/* --- hero --- */
.hero{
  position:relative;
  display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(24px,5vw,72px);
  align-items:center;
  padding:clamp(48px,8vh,96px) clamp(16px,4vw,48px) clamp(56px,9vh,110px);
  min-height:auto;
  border-top:1px solid var(--line-d);
  background:
    radial-gradient(1000px 600px at 85% 10%,rgba(251,58,100,.16),transparent 60%),
    radial-gradient(700px 500px at 5% 95%,rgba(38,41,66,.9),transparent 70%),
    var(--navy);
  color:var(--white);
  overflow:hidden;
}
.hero .star{position:absolute;color:var(--lav);opacity:.45;font-size:28px;user-select:none;pointer-events:none}
.eyebrow{
  font-weight:300;font-size:12px;letter-spacing:.42em;text-transform:uppercase;
  color:var(--pink);margin-bottom:16px;
}
.release-tag{
  display:inline-block;font-size:11px;letter-spacing:.22em;text-transform:uppercase;font-weight:700;
  border:1px solid var(--line-d);border-radius:99px;padding:6px 14px;margin-bottom:22px;color:var(--lav);
}
.release-tag b{color:var(--white)}
h1.feature{
  font-weight:900;font-stretch:95%;text-transform:uppercase;
  font-size:clamp(40px,6.4vw,92px);line-height:.94;letter-spacing:.01em;
  margin-bottom:14px;
}
.feature-sub{
  font-weight:300;font-size:clamp(14px,1.6vw,21px);letter-spacing:.3em;text-transform:uppercase;
  color:var(--lav);line-height:1.6;margin-bottom:26px;
}
.feature-sub em{color:var(--pink);font-style:normal;font-weight:600}
.hero p.lede{max-width:52ch;color:var(--lav);font-size:clamp(15px,1.25vw,18px);margin-bottom:30px}
.hero p.lede strong{color:var(--white);font-weight:600}
.cta-row{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:30px}
.btn{
  display:inline-flex;align-items:center;gap:10px;
  font-size:13px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;
  padding:15px 26px;border-radius:99px;transition:transform .15s,background .2s,color .2s,border-color .2s;
  cursor:pointer;border:0;font-family:var(--disp);
}
.btn:active{transform:scale(.97)}
.btn.solid{background:var(--pink);color:var(--white)}
.btn.solid:hover{background:var(--pink-2)}
.btn.ghost{border:1px solid var(--white);color:var(--white);background:transparent}
.btn.ghost:hover{background:var(--white);color:var(--navy-ink)}
.credits-line{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--lav);font-weight:300}
.credits-line span{color:var(--pink)}

/* artwork deck */
.deck{position:relative;justify-self:center;width:min(440px,86%);aspect-ratio:1/1.02}
.deck .card{
  position:absolute;inset:0;border-radius:6px;overflow:hidden;
  box-shadow:0 30px 80px rgba(11,12,22,.6);
  transition:transform .5s cubic-bezier(.2,.7,.2,1);
  background:var(--navy-2);
}
.deck .card img{width:100%;height:100%;object-fit:cover}
.deck .card.back{transform:rotate(-6deg) translate(-7%,4%);opacity:.92}
.deck .card.front{transform:rotate(2.5deg)}
.deck:hover .card.front{transform:rotate(0deg) translateY(-6px)}
.deck:hover .card.back{transform:rotate(-8deg) translate(-9%,5%)}
.deck .card::before{content:"";position:absolute;top:0;left:0;right:0;height:6px;z-index:2;background:
  linear-gradient(to bottom,var(--pink) 0 33.4%,var(--pink-2) 33.4% 66.7%,var(--navy) 66.7% 100%)}

/* --- ticker --- */
.ticker{border-bottom:1px solid var(--line-l);overflow:hidden;white-space:nowrap;background:var(--white)}
.ticker .track{display:inline-block;padding:14px 0;animation:tick 36s linear infinite}
.ticker:hover .track{animation-play-state:paused}
@keyframes tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.ticker span{
  font-weight:300;font-size:12px;letter-spacing:.3em;text-transform:uppercase;
  color:var(--muted);margin:0 22px;
}
.ticker .st{color:var(--pink);font-weight:600;letter-spacing:0;font-size:14px}

/* --- sections --- */
section.mm{padding:clamp(64px,10vh,120px) clamp(16px,4vw,48px)}
.sect-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-bottom:clamp(32px,5vh,56px);flex-wrap:wrap}
.kicker{
  font-size:11px;letter-spacing:.42em;text-transform:uppercase;font-weight:300;color:var(--pink);
  display:flex;align-items:center;gap:12px;margin-bottom:10px;
}
.kicker::before{content:"";width:26px;height:6px;background:
  linear-gradient(to bottom,var(--pink) 0 33.4%,var(--pink-2) 33.4% 66.7%,var(--navy) 66.7% 100%)}
h2.mm-h2{
  font-weight:900;font-stretch:95%;text-transform:uppercase;
  font-size:clamp(30px,4.4vw,56px);line-height:1;color:var(--navy-ink);
}
.sect-note{font-weight:300;font-size:11.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--muted)}

/* releases */
.rel-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:clamp(16px,2.5vw,30px)}
.rel{
  border-radius:6px;overflow:hidden;background:var(--white);
  border:1px solid var(--line-l);
  transition:transform .35s cubic-bezier(.2,.7,.2,1),border-color .3s,box-shadow .3s;
}
.rel:hover{transform:translateY(-6px);border-color:var(--pink);box-shadow:0 18px 44px rgba(24,27,49,.14)}
.rel .art{aspect-ratio:1/1;overflow:hidden;position:relative;background:var(--off)}
.rel .art img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.rel:hover .art img{transform:scale(1.045)}
.rel .art .fmt{
  position:absolute;top:10px;left:10px;z-index:2;
  background:var(--navy);color:var(--white);font-size:10px;font-weight:700;
  letter-spacing:.18em;text-transform:uppercase;padding:5px 10px;border-radius:99px;opacity:.94;
}
.rel:hover .art .fmt{background:var(--pink)}
.rel .meta{padding:14px 16px 16px}
.rel .meta .t{font-weight:900;font-stretch:96%;font-size:15px;line-height:1.25;text-transform:uppercase;letter-spacing:.02em;color:var(--navy-ink)}
.rel .meta .a{font-weight:300;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-size:11.5px;margin-top:4px}
.rel .meta .y{font-size:11px;letter-spacing:.2em;color:var(--pink);margin-top:8px;text-transform:uppercase;font-weight:600}
.rel.hi{grid-column:span 2;grid-row:span 2}
@media(max-width:560px){.rel.hi{grid-column:1/-1;grid-row:auto}}
.rel.hi .meta .t{font-size:19px}
/* view-all tile at the end of the front-page grid */
.rel-more{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  aspect-ratio:1/1.34;border-radius:6px;background:var(--navy);color:var(--white);
  border:1px solid var(--navy);text-align:center;padding:18px;
  transition:transform .35s cubic-bezier(.2,.7,.2,1),background .3s,box-shadow .3s;
}
.rel-more:hover{transform:translateY(-6px);background:var(--pink);border-color:var(--pink);box-shadow:0 18px 44px rgba(24,27,49,.2)}
.rel-more .num{font-weight:900;font-stretch:95%;font-size:clamp(38px,4vw,56px);line-height:1}
.rel-more .lbl{font-weight:300;letter-spacing:.28em;text-transform:uppercase;font-size:10.5px;color:var(--lav)}
.rel-more:hover .lbl{color:rgba(255,255,255,.85)}
@media(max-width:560px){.rel-more{aspect-ratio:auto;min-height:120px;grid-column:1/-1}}

/* cast */
#cast{background:var(--off)}
.feature-card{
  display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(24px,4vw,56px);
  align-items:center;margin-bottom:clamp(36px,6vh,64px);
}
.feature-card .photo{
  border-radius:6px;overflow:hidden;max-height:620px;position:relative;
  box-shadow:0 24px 60px rgba(24,27,49,.22);
}
.feature-card .photo img{width:100%;height:100%;object-fit:cover;object-position:center 30%}
.cast-name{
  font-weight:900;font-stretch:95%;text-transform:uppercase;
  font-size:clamp(44px,6vw,84px);line-height:.95;margin-bottom:10px;color:var(--navy-ink);
}
.cast-role{font-weight:300;font-size:clamp(11px,1.2vw,13px);letter-spacing:.34em;text-transform:uppercase;color:var(--pink);margin-bottom:20px}
.cast-bio{color:var(--muted);max-width:56ch;margin-bottom:12px}
.cast-bio strong{color:var(--navy-ink);font-weight:700}
.cast-quote{
  font-weight:300;font-style:italic;font-size:19px;color:var(--navy-ink);
  border-left:3px solid var(--pink);padding-left:16px;margin:20px 0 24px;max-width:48ch;
}
.chip-row{display:flex;flex-wrap:wrap;gap:10px}
.chip{
  border:1px solid var(--line-l);border-radius:99px;padding:9px 18px;background:var(--white);
  font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);
  transition:border-color .2s,color .2s,background .2s;
}
.chip:hover{border-color:var(--pink);color:var(--white);background:var(--pink)}
.cast-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:clamp(16px,2.5vw,30px)}
.cast-card{border-radius:6px;overflow:hidden;border:1px solid var(--line-l);background:var(--white);transition:transform .35s,box-shadow .3s}
.cast-card:hover{transform:translateY(-6px);box-shadow:0 18px 44px rgba(24,27,49,.14)}
.cast-card .ph{aspect-ratio:1/1.05;overflow:hidden;filter:grayscale(22%);background:var(--off)}
.cast-card .ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.cast-card:hover .ph img{transform:scale(1.05)}
.cast-card .nm{padding:14px 16px 16px}
.cast-card .nm .n{font-weight:900;font-stretch:96%;text-transform:uppercase;font-size:16px;color:var(--navy-ink)}
.cast-card .nm .r{font-weight:300;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);font-size:10.5px;margin-top:4px}

/* news */
#news{background:var(--navy);color:var(--white)}
#news h2.mm-h2{color:var(--white)}
#news .sect-note{color:var(--lav)}
.news-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:clamp(16px,2.5vw,30px)}
.news-card{
  border:1px solid var(--line-d);border-radius:6px;padding:26px 24px 24px;
  background:var(--navy-2);display:flex;flex-direction:column;gap:12px;
  transition:transform .3s,box-shadow .3s;position:relative;overflow:hidden;
}
.news-card::before{content:"";position:absolute;top:0;left:0;right:0;height:6px;background:
  linear-gradient(to bottom,var(--pink) 0 33.4%,var(--pink-2) 33.4% 66.7%,var(--white) 66.7% 100%);
  opacity:0;transition:opacity .3s}
.news-card:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(11,12,22,.5)}
.news-card:hover::before{opacity:1}
.news-card .d{font-size:11px;letter-spacing:.26em;text-transform:uppercase;font-weight:300;color:var(--lav)}
.news-card .h{font-weight:900;font-stretch:96%;font-size:19px;line-height:1.25;text-transform:uppercase;color:var(--white)}
.news-card .b{color:var(--lav);font-size:15px}
.news-card .lnk{font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--pink);margin-top:auto}
.news-card.now{background:var(--pink);border-color:var(--pink)}
.news-card.now .d{color:rgba(255,255,255,.75)}
.news-card.now .b{color:rgba(255,255,255,.88)}
.news-card.now .lnk{color:var(--white)}
.news-card.now:hover::before{opacity:0}

/* contact */
#contact{position:relative;text-align:center;background:var(--white)}
#contact .kicker{justify-content:center}
.statement{
  font-weight:900;font-stretch:95%;text-transform:uppercase;
  font-size:clamp(26px,4.2vw,54px);line-height:1.08;max-width:24ch;margin:0 auto 20px;color:var(--navy-ink);
}
.statement em{color:var(--pink);font-style:normal}
#contact .sub{color:var(--muted);max-width:56ch;margin:0 auto 36px;font-size:16px}
.mail{
  display:inline-block;font-weight:900;font-stretch:96%;text-transform:uppercase;
  font-size:clamp(17px,2.6vw,30px);letter-spacing:.03em;color:var(--navy-ink);
  border-bottom:3px solid var(--pink);padding-bottom:6px;margin-bottom:34px;
  transition:color .2s;
}
.mail:hover{color:var(--pink)}
#contact .btn.ghost{border-color:var(--navy-ink);color:var(--navy-ink)}
#contact .btn.ghost:hover{background:var(--navy-ink);color:var(--white)}

/* footer */
footer.mm-footer{text-align:center;padding:56px 20px 40px;background:var(--navy);color:var(--white)}
footer.mm-footer .presented{font-size:10px;letter-spacing:.42em;text-transform:uppercase;color:var(--lav);font-weight:300;margin-bottom:18px}
footer.mm-footer .flogo{width:min(230px,60vw);height:auto;margin:0 auto 30px;display:block}
footer.mm-footer nav{display:flex;justify-content:center;flex-wrap:wrap;gap:22px;margin-bottom:26px}
footer.mm-footer nav a{font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--lav)}
footer.mm-footer nav a:hover{color:var(--pink)}
footer.mm-footer .fine{font-size:12px;color:#5c5f77}

/* reveal on scroll */
.rv{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}

/* anchor targets clear the sticky nav */
section[id],main[id]{scroll-margin-top:90px}

/* social icon buttons */
.social-row{display:flex;flex-wrap:wrap;gap:10px}
.sbtn{
  width:44px;height:44px;border:1px solid var(--line-l);border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  color:var(--navy-ink);background:var(--white);
  transition:background .2s,border-color .2s,color .2s,transform .2s;
}
.sbtn svg{width:20px;height:20px;display:block}
.sbtn:hover{background:var(--pink);border-color:var(--pink);color:var(--white);transform:translateY(-2px)}

/* screening room — featured video + mosaic */
.video-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2.5vw,28px);align-items:start}
.vwrap{grid-column:span 2}
.vwrap.vfeat{grid-column:span 2} /* featured goes 2x2 on desktop only */
@media(min-width:921px){
  .vwrap{grid-column:span 1}
  .vwrap.vfeat{grid-column:span 2;grid-row:span 2}
}
.vid{
  position:relative;display:block;width:100%;aspect-ratio:16/9;border:0;padding:0;
  border-radius:8px;overflow:hidden;background:var(--navy);cursor:pointer;
  box-shadow:0 10px 30px rgba(24,27,49,.12);
  transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .3s;
}
.vid:hover{transform:translateY(-4px);box-shadow:0 20px 46px rgba(24,27,49,.2)}
.vid img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.vid:hover img{transform:scale(1.04)}
.vid::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(11,12,22,.45));pointer-events:none;transition:opacity .3s}
.vid:hover::after{opacity:.6}
.vid .play{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:56px;height:56px;border-radius:50%;
  background:rgba(11,12,22,.55);border:1.5px solid rgba(255,255,255,.85);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  transition:transform .2s,background .2s,border-color .2s;
}
.vid .play::after{
  content:"";position:absolute;top:50%;left:54%;transform:translate(-50%,-50%);
  border-style:solid;border-width:9px 0 9px 14px;border-color:transparent transparent transparent var(--white);
}
.vid:hover .play{transform:translate(-50%,-50%) scale(1.1);background:var(--pink);border-color:var(--pink)}
.vfeat .vid .play{width:72px;height:72px}
.vfeat .vid .play::after{border-width:12px 0 12px 19px}
.vid iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.vid.playing::after{display:none}
.vmeta{display:flex;align-items:baseline;gap:10px;margin-top:12px;flex-wrap:wrap}
.vt{font-weight:900;font-stretch:96%;text-transform:uppercase;font-size:14px;color:var(--navy-ink);line-height:1.3}
.vfeat .vt{font-size:17px}
.va{font-weight:300;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-size:10.5px}

/* page-transition veil (re-uses the preloader look) */
#mm-preloader.veil{transition:opacity .35s ease,visibility .35s}
#mm-preloader.veil .pl-logo{animation:pl-in .45s cubic-bezier(.2,.7,.2,1) both}

/* ============ inner pages ============ */
.page-hero{
  background:
    radial-gradient(800px 420px at 80% 0%,rgba(251,58,100,.14),transparent 60%),
    var(--navy);
  color:var(--white);
  padding:clamp(48px,8vh,90px) clamp(16px,4vw,48px);
}
.page-hero h1{
  font-weight:900;font-stretch:95%;text-transform:uppercase;
  font-size:clamp(30px,4.8vw,64px);line-height:1;margin-bottom:12px;
}
.page-hero .pmeta{font-weight:300;font-size:11.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--lav)}
.wrap{max-width:820px;margin:0 auto;padding:clamp(40px,7vh,80px) 20px}
.wrap-wide{max-width:1100px;margin:0 auto;padding:clamp(40px,7vh,80px) 20px}

.prose{color:#3a3d52;font-size:17px}
.prose p,.prose ul,.prose ol,.prose blockquote,.prose figure,.prose h2,.prose h3,.prose iframe{margin-bottom:1.2em}
.prose h2,.prose h3{font-weight:900;font-stretch:96%;text-transform:uppercase;color:var(--navy-ink);line-height:1.15;margin-top:1.6em}
.prose h2{font-size:26px}.prose h3{font-size:20px}
.prose a{color:var(--pink);font-weight:600;border-bottom:1px solid currentColor}
.prose blockquote{border-left:3px solid var(--pink);padding-left:18px;font-style:italic;color:var(--muted)}
.prose img{border-radius:6px}
.prose ul,.prose ol{padding-left:1.4em}
.prose iframe{max-width:100%}

/* album single */
.album-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,4vw,60px);align-items:start}
.album-art{border-radius:6px;overflow:hidden;box-shadow:0 24px 60px rgba(24,27,49,.25);position:relative}
.album-art::before{content:"";position:absolute;top:0;left:0;right:0;height:6px;z-index:2;background:
  linear-gradient(to bottom,var(--pink) 0 33.4%,var(--pink-2) 33.4% 66.7%,var(--navy) 66.7% 100%)}
.stream-list{display:flex;flex-direction:column;gap:12px;margin:26px 0}
.stream-list .btn{justify-content:space-between;width:100%}
.stream-list .btn.ghost{border-color:var(--navy-ink);color:var(--navy-ink)}
.stream-list .btn.ghost:hover{background:var(--navy-ink);color:var(--white)}
.album-facts{border-top:1px solid var(--line-l);margin-top:26px;padding-top:20px;display:grid;gap:10px}
.album-facts .row{display:flex;gap:14px;font-size:14px}
.album-facts .k{font-weight:300;letter-spacing:.2em;text-transform:uppercase;font-size:10.5px;color:var(--muted);min-width:110px;padding-top:3px}
.album-facts .v{color:var(--navy-ink);font-weight:600}
.backlink{display:inline-block;margin-top:34px;font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--pink)}

/* blog archive cards on white */
.post-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:clamp(16px,2.5vw,30px)}
.post-card{
  border:1px solid var(--line-l);border-radius:6px;padding:26px 24px 24px;background:var(--white);
  display:flex;flex-direction:column;gap:12px;transition:transform .3s,box-shadow .3s;
}
.post-card:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(24,27,49,.12)}
.post-card .d{font-size:11px;letter-spacing:.26em;text-transform:uppercase;font-weight:300;color:var(--muted)}
.post-card .h{font-weight:900;font-stretch:96%;font-size:19px;line-height:1.25;text-transform:uppercase;color:var(--navy-ink)}
.post-card .b{color:var(--muted);font-size:15px}
.post-card .lnk{font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--pink);margin-top:auto}
.pagenav{display:flex;justify-content:center;gap:14px;margin-top:40px}
.pagenav a,.pagenav span{border:1px solid var(--line-l);border-radius:99px;padding:8px 16px;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.pagenav a:hover{border-color:var(--pink);color:var(--pink)}

/* comments — keep simple and legible */
.comments-area{margin-top:50px;border-top:1px solid var(--line-l);padding-top:34px}
.comments-area input,.comments-area textarea{
  width:100%;border:1px solid var(--line-l);border-radius:6px;padding:12px 14px;
  font-family:var(--disp);font-size:15px;margin-bottom:12px;background:var(--white);color:var(--navy-ink);
}
.comments-area input[type=submit]{
  width:auto;background:var(--pink);color:var(--white);border:0;border-radius:99px;
  padding:12px 26px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:12px;cursor:pointer;
}
.comments-area input[type=submit]:hover{background:var(--pink-2)}
.comment-list{list-style:none;margin:0 0 26px;padding:0}
.comment-list .comment{border:1px solid var(--line-l);border-radius:6px;padding:16px 18px;margin-bottom:14px}

/* WooCommerce & misc plugin output containment */
.mm-plain{padding:clamp(40px,7vh,80px) 20px;max-width:1100px;margin:0 auto}

/* ============ responsive — tablet ============ */
@media(max-width:920px){
  .wordmark img{height:44px}
  .hero{grid-template-columns:1fr;min-height:0;padding-top:40px}
  .deck{width:min(380px,90%);margin-top:8px}
  .feature-card{grid-template-columns:1fr}
  .feature-card .photo{max-height:460px}
  .album-grid{grid-template-columns:1fr}

  /* ---- mobile menu: full-height sheet under a persistent header bar ---- */
  .burger{display:flex}
  nav.links{
    position:fixed;inset:0;z-index:60;
    padding:calc(env(safe-area-inset-top,0px) + 74px) 22px calc(env(safe-area-inset-bottom,0px) + 26px);
    background:#1b1d2f;              /* solid, fully opaque */
    background:var(--navy);
    flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;
    overflow-y:auto;-webkit-overflow-scrolling:touch;
    opacity:0;visibility:hidden;transform:translateY(-8px);
    transition:opacity .28s ease,transform .32s cubic-bezier(.2,.7,.2,1),visibility .32s;
  }
  nav.links.open{opacity:1;visibility:visible;transform:none}
  body.admin-bar nav.links{padding-top:120px}

  nav.links .m-only{display:flex}

  /* menu rows */
  nav.links > a:not(.navcta){
    display:flex;align-items:center;justify-content:space-between;
    font-size:19px;letter-spacing:.09em;font-weight:900;font-stretch:96%;
    color:var(--white);padding:19px 2px;border-bottom:1px solid rgba(255,255,255,.1);
    transform:translateY(8px);
    transition:transform .32s cubic-bezier(.2,.7,.2,1),color .2s;
  }
  nav.links > a:not(.navcta)::after{
    content:"";width:7px;height:7px;flex:none;
    border-right:1.6px solid var(--lav);border-bottom:1.6px solid var(--lav);
    transform:rotate(-45deg);transition:border-color .2s,transform .2s;
  }
  nav.links > a:not(.navcta):active{color:var(--pink)}
  nav.links > a:not(.navcta):active::after{border-color:var(--pink)}
  nav.links.open > a:not(.navcta){transform:none}
  nav.links.open > a:nth-child(1){transition-delay:.05s}
  nav.links.open > a:nth-child(2){transition-delay:.10s}
  nav.links.open > a:nth-child(3){transition-delay:.15s}
  nav.links.open > a:nth-child(4){transition-delay:.20s}
  nav.links.open > a:nth-child(5){transition-delay:.25s}

  /* primary action */
  nav.links .navcta{
    display:flex;align-items:center;justify-content:center;
    font-size:13px;letter-spacing:.18em;padding:17px 24px;margin:26px 0 0;
    transform:translateY(8px);
    transition:transform .32s cubic-bezier(.2,.7,.2,1) .28s,background .2s;
  }
  nav.links.open .navcta{transform:none}

  /* menu footer */
  nav.links .m-foot{
    display:block;margin-top:auto;padding-top:32px;text-align:center;
  }
  nav.links .m-mail{
    display:inline-block;font-size:13px;font-weight:600;letter-spacing:.03em;
    color:var(--white);border-bottom:2px solid var(--pink);padding-bottom:3px;
  }
  nav.links .m-tag{
    margin-top:14px;font-weight:300;font-size:9.5px;letter-spacing:.28em;
    text-transform:uppercase;color:var(--lav);text-indent:.28em;
  }
}

/* ============ responsive — phones ============ */
@media(max-width:560px){
  section.mm{padding-left:18px;padding-right:18px}
  .brand-intro{min-height:auto;padding-top:clamp(44px,7vh,70px);padding-bottom:78px}
  .bi-logo{width:min(250px,66vw)}
  .bi-tagline{letter-spacing:.24em;font-size:12px;max-width:20ch}
  .bi-cue{bottom:22px}
  .bi-cue-line{height:26px}

  .hero{padding-left:18px;padding-right:18px;padding-bottom:48px}
  .hero p.lede{font-size:15px}
  .eyebrow{letter-spacing:.28em;font-size:11px}
  h1.feature{overflow-wrap:break-word}
  .feature-sub{letter-spacing:.2em}
  .cta-row .btn{width:100%;justify-content:center}
  .deck{width:min(320px,86%)}
  .ticker span{margin:0 14px;font-size:11px}

  .rel-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .rel .meta{padding:10px 12px 12px}
  .rel .meta .t{font-size:12.5px}
  .rel .meta .a{font-size:10px;letter-spacing:.1em}
  .rel .art .fmt{font-size:9px;padding:4px 8px}

  .cast-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .cast-card .nm{padding:10px 12px 12px}
  .cast-card .nm .n{font-size:14px}
  .feature-card .photo{max-height:400px}
  .cast-quote{font-size:17px}
  .chip{padding:8px 14px;font-size:10px}

  .video-grid{grid-template-columns:1fr}
  .vwrap,.vwrap.vfeat{grid-column:auto;grid-row:auto}

  .news-card{padding:20px 18px 18px}
  .statement{font-size:clamp(24px,7.4vw,32px)}
  .mail{font-size:16px;letter-spacing:.02em}
  footer.mm-footer .flogo{width:min(190px,55vw)}
}
