/* music.eprisjournal.com - standalone showcase.
   Tokens copied from src/index.css in eprisjournal-site (not reinvented):
   ink #180D13 / cream #F7F2EC is the exact pair the main site's own footer
   already stands on; --c-accent/--c-bg/--c-gold match the reading pages. */
:root{
  --ink:#180D13; --cream:#F7F2EC;
  --accent:#4a1728; --accent-rgb:74,23,40;
  --bg:#f5f0eb; --gold:#b8956e;
  --font-display:'Crimson Text','PT Serif',serif;
  --font-body:'PT Sans',sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--bg); color:var(--accent); font-family:var(--font-body);
  line-height:1.6; -webkit-font-smoothing:antialiased;
}
a{color:inherit}
img{max-width:100%;display:block}

.mh-nav{
  display:flex; align-items:center; justify-content:space-between;
  padding:20px clamp(16px,4vw,64px); border-bottom:1px solid rgba(var(--accent-rgb),.12);
}
.mh-nav-mark{
  font-family:var(--font-body); font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; font-size:14px; text-decoration:none; color:var(--accent);
}
.mh-nav-mark span{font-weight:400; color:var(--gold); margin-left:6px}
.mh-nav-back{
  font-family:var(--font-body); font-size:11px; letter-spacing:.08em;
  text-transform:uppercase; text-decoration:none; color:rgba(var(--accent-rgb),.6);
  border:1px solid rgba(var(--accent-rgb),.25); border-radius:999px; padding:8px 16px;
  transition:border-color .15s,color .15s;
}
.mh-nav-back:hover{border-color:var(--accent); color:var(--accent)}

.mh-hero{
  background:var(--ink); color:var(--cream); text-align:center;
  padding:clamp(56px,10vw,112px) clamp(16px,4vw,64px);
}
.mh-hero-eyebrow{
  font-family:var(--font-body); font-size:11px; letter-spacing:.35em;
  text-transform:uppercase; color:var(--gold); margin:0 0 24px;
}
.mh-hero-title{
  font-family:var(--font-display); font-weight:600; line-height:1.05;
  font-size:clamp(40px,8vw,84px); margin:0 0 24px;
}
.mh-hero-desc{
  font-family:'PT Serif',serif; font-size:clamp(15px,2vw,19px); line-height:1.6;
  color:rgba(247,242,236,.72); max-width:38rem; margin:0 auto;
}

.mh-wrap{max-width:1100px; margin:0 auto; padding:0 clamp(16px,4vw,64px)}

.mh-group{margin:56px auto 0; max-width:1100px; padding:0 clamp(16px,4vw,64px)}
.mh-group:first-of-type{margin-top:64px}
.mh-group-head{
  display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between;
  gap:12px; border-bottom:1px solid rgba(var(--accent-rgb),.2); padding-bottom:20px; margin-bottom:32px;
}
.mh-group-eyebrow{
  font-family:var(--font-body); font-size:9px; letter-spacing:.2em; text-transform:uppercase;
  color:rgba(var(--accent-rgb),.5); margin:0 0 8px;
}
.mh-group-title{font-family:var(--font-display); font-size:32px; margin:0; color:var(--accent)}
.mh-group-desc{
  font-family:'PT Serif',serif; font-size:14px; line-height:1.6;
  color:rgba(var(--accent-rgb),.68); max-width:34ch; margin:0;
}

.mh-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:32px 28px}
.mh-card{text-decoration:none; color:inherit; display:block}
.mh-card-img{
  width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:2px;
  background:rgba(var(--accent-rgb),.06); margin-bottom:16px;
}
.mh-card-eyebrow{
  font-family:var(--font-body); font-size:9px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold); margin:0 0 8px;
}
.mh-card-title{
  font-family:var(--font-display); font-size:22px; line-height:1.25; margin:0 0 8px;
  transition:color .15s;
}
.mh-card:hover .mh-card-title{color:var(--gold)}
.mh-card-excerpt{
  font-family:'PT Serif',serif; font-size:14px; line-height:1.55;
  color:rgba(var(--accent-rgb),.7); margin:0 0 10px;
}
.mh-card-byline{
  font-family:var(--font-body); font-size:11px; letter-spacing:.08em; text-transform:uppercase;
  color:rgba(var(--accent-rgb),.5); margin:0;
}

.mh-empty{
  text-align:center; padding:80px 16px; font-family:'PT Serif',serif; font-size:16px;
  color:rgba(var(--accent-rgb),.55);
}

/* Reading page */
.mh-article{max-width:760px; margin:0 auto; padding:56px clamp(16px,4vw,0) 96px}
.mh-article-eyebrow{
  font-family:var(--font-body); font-size:10px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--gold); text-align:center; margin:0 0 20px;
}
.mh-article-title{
  font-family:var(--font-display); font-weight:600; font-size:clamp(32px,5vw,52px);
  line-height:1.1; text-align:center; margin:0 0 24px; color:var(--accent);
}
.mh-article-meta{
  font-family:var(--font-body); font-size:11px; letter-spacing:.1em; text-transform:uppercase;
  color:rgba(var(--accent-rgb),.55); text-align:center; margin:0 0 48px;
}
.mh-article-hero{width:100%; border-radius:2px; margin-bottom:48px}
.mh-block-text{font-family:'PT Serif',serif; font-size:18px; line-height:1.75; margin:0 0 28px}
.mh-block-header{font-family:var(--font-display); font-size:26px; margin:40px 0 20px}
.mh-block-quote{
  font-family:var(--font-display); font-style:italic; font-size:22px; line-height:1.5;
  border-left:3px solid var(--gold); padding-left:24px; margin:36px 0; color:var(--accent);
}
.mh-block-note{
  font-family:'PT Serif',serif; font-size:15px; background:rgba(var(--accent-rgb),.05);
  border-radius:4px; padding:18px 20px; margin:28px 0;
}
.mh-block-image{margin:40px 0}
.mh-block-image img{border-radius:2px}
.mh-block-image figcaption{
  font-family:var(--font-body); font-size:11px; text-transform:uppercase; letter-spacing:.06em;
  color:rgba(var(--accent-rgb),.55); text-align:center; margin-top:12px;
}
.mh-block-image figcaption a{color:var(--gold); text-decoration:underline; text-underline-offset:3px}
.mh-video-frame{position:relative; aspect-ratio:16/9; background:#000; border-radius:2px; overflow:hidden}
.mh-video-frame iframe{position:absolute; inset:0; width:100%; height:100%; border:0}
.mh-block-video figcaption{
  font-family:var(--font-body); font-size:11px; text-transform:uppercase; letter-spacing:.06em;
  color:rgba(var(--accent-rgb),.55); text-align:center; margin-top:12px;
}

/* Review-specific bits */
.mh-verdict{
  font-family:var(--font-display); font-style:italic; font-size:24px; line-height:1.45;
  text-align:center; color:var(--accent); max-width:44ch; margin:0 auto 48px;
}
.mh-proscons{display:grid; grid-template-columns:1fr 1fr; gap:24px; margin:48px 0}
.mh-proscons h3{
  font-family:var(--font-body); font-size:10px; letter-spacing:.2em; text-transform:uppercase;
  margin:0 0 12px;
}
.mh-proscons ul{list-style:none; margin:0; padding:0; font-family:'PT Serif',serif; font-size:14px; line-height:1.6}
.mh-proscons li{margin-bottom:8px; padding-left:18px; position:relative}
.mh-pros h3{color:#4A7C59}
.mh-pros li::before{content:'+'; position:absolute; left:0; color:#4A7C59}
.mh-cons h3{color:#8B3A3A}
.mh-cons li::before{content:'\2212'; position:absolute; left:0; color:#8B3A3A}
@media(max-width:600px){.mh-proscons{grid-template-columns:1fr}}

.mh-foot{
  text-align:center; padding:48px 16px 64px; font-family:var(--font-body); font-size:11px;
  letter-spacing:.08em; text-transform:uppercase; color:rgba(var(--accent-rgb),.5);
}
.mh-foot a{color:var(--gold); text-decoration:none}
.mh-foot p{margin:6px 0}
