/* Headliner Music Studio · shared additions (mobile menu, singles, previews) */

/* ---------- Mobile menu ---------- */
.hm-menu{display:none;align-items:center;gap:10px;background:none;border:1px solid rgba(255,255,255,.22);color:inherit;font:600 10px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;padding:9px 12px;cursor:pointer}
.hm-bars{display:inline-flex;flex-direction:column;gap:4px;width:16px}
.hm-bars i{display:block;height:1px;background:currentColor;transition:transform .2s}
nav.hm-open .hm-bars i:first-child{transform:translateY(2.5px) rotate(45deg)}
nav.hm-open .hm-bars i:last-child{transform:translateY(-2.5px) rotate(-45deg)}
.nav-light .hm-menu{border-color:rgba(43,24,19,.25)}
@media(max-width:640px){
  .hm-menu{display:inline-flex}
  nav.hm-open{background:rgba(24,9,10,.97)!important;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
  nav.nav-light.hm-open{background:rgba(246,239,232,.98)!important}
  nav.hm-open ul{display:flex!important;position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0!important;padding:6px 18px 18px!important;background:inherit;border-bottom:1px solid rgba(255,255,255,.08)}
  nav.nav-light.hm-open ul{border-bottom-color:rgba(43,24,19,.1)}
  nav.hm-open ul li{border-top:1px solid rgba(255,255,255,.08)}
  nav.nav-light.hm-open ul li{border-top-color:rgba(43,24,19,.1)}
  nav.hm-open ul a{display:block;padding:15px 0;font-size:15px!important;letter-spacing:.04em}
}

/* ---------- Buttons used by previews / links ---------- */
.hm-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 16px;border:1px solid rgba(255,255,255,.22);font:600 11px/1.2 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:inherit;transition:.2s}
.hm-btn:hover{border-color:var(--rose)}
.hm-btn.primary{background:var(--rose);border-color:var(--rose);color:#251412}
.hm-btn.sm{padding:9px 12px;font-size:10.5px}
.hm-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.hm-links:empty{display:none}

/* ---------- Preview slot ---------- */
.hm-soon{display:inline-flex;align-items:center;gap:8px;margin:0;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--muted,#baa59b)}
.hm-soon span{color:var(--copper,#c98c68);font-size:13px;letter-spacing:0}
.hm-audio{width:100%;height:38px;display:block}

/* ---------- Singles grid ---------- */
.hm-singles{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,26px)}
.hm-single{display:flex;flex-direction:column;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.1)}
.hm-single .art{aspect-ratio:1;overflow:hidden;background:#160a0a}
.hm-single .art img{width:100%;height:100%;object-fit:cover}
.hm-single .body{padding:18px 18px 20px;display:flex;flex-direction:column;gap:6px;flex:1}
.hm-single .k{font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--copper,#c98c68)}
.hm-single h3{font-family:var(--serif);font-weight:500;font-size:clamp(26px,2.4vw,32px);line-height:1.05;margin:0}
.hm-single .when{font-size:13px;color:var(--muted,#baa59b);margin:0 0 10px}
.hm-single .slot{margin-top:auto;padding-top:14px;border-top:1px solid rgba(255,255,255,.1)}
@media(max-width:900px){.hm-singles{grid-template-columns:1fr 1fr}}
@media(max-width:560px){
  .hm-singles{grid-template-columns:1fr}
  .hm-single{display:grid;grid-template-columns:112px 1fr}
  .hm-single .art{aspect-ratio:auto;height:100%}
  .hm-single .body{padding:14px}
  .hm-single h3{font-size:24px}
}

/* ---------- Balanced line breaks for headings and short statements ---------- */
h1,h2,h3,.lead,blockquote,.close,.philosophy,.world-copy,.singles-head p,.page-head p{text-wrap:balance}
p{text-wrap:pretty}

/* ---------- Preview player ---------- */
.hm-player{display:flex;align-items:center;gap:14px;width:100%}
.hm-play{flex:0 0 auto;width:42px;height:42px;border-radius:50%;border:0;display:grid;place-items:center;cursor:pointer;background:var(--rose,#e9b894);color:#251412;transition:transform .15s,background .2s}
.hm-play:hover{transform:scale(1.05)}
.hm-play svg{width:18px;height:18px;fill:currentColor}
.hm-play .i-pause{display:none}
.hm-player.is-playing .i-play{display:none}
.hm-player.is-playing .i-pause{display:inline}
.hm-track{flex:1;min-width:0}
.hm-bar{position:relative;height:4px;background:rgba(255,255,255,.14);cursor:pointer;border-radius:2px}
.hm-bar::before{content:"";position:absolute;inset:-8px 0}
.hm-fill{position:absolute;left:0;top:0;bottom:0;width:0;background:var(--rose,#e9b894);border-radius:2px}
.hm-meta{display:flex;justify-content:space-between;margin-top:8px;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--muted,#baa59b)}
.hm-time{letter-spacing:.06em;font-variant-numeric:tabular-nums}
.hm-player.is-error .hm-play{opacity:.4;pointer-events:none}
/* light sections */
.singles-sec .hm-play{background:var(--night,#120909);color:var(--light,#f7eee7)}
.singles-sec .hm-bar{background:rgba(43,24,19,.14)}
.singles-sec .hm-fill{background:#9e644b}
.singles-sec .hm-meta{color:#6a554d}

/* ---------- Social links (text, understated) ---------- */
.hm-social{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase}
.hm-social a{color:inherit;opacity:.8;transition:opacity .2s,color .2s;padding:4px 0}
.hm-social a:hover{opacity:1;color:var(--rose,#e9b894)}
.hm-social span{opacity:.4}

/* ---------- Accessibility ---------- */
.skip{position:absolute;left:12px;top:-60px;z-index:100;padding:10px 14px;background:#f7eee7;color:#120909;font:600 12px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase}
.skip:focus{top:12px}
a:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--rose,#e9b894);outline-offset:3px}
.nav-light a:focus-visible,.singles-sec :focus-visible,.section.studio :focus-visible,.founder :focus-visible,.meet :focus-visible,.more :focus-visible,.work :focus-visible,.origin :focus-visible,.inspiration :focus-visible{outline-color:#8f5a41}

/* ---------- Footer right column ---------- */
.foot-right{display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.foot-right .hm-social{color:#d5c3b9}
@media(max-width:640px){.foot-right{align-items:flex-start}}

/* ---------- Where to hear the full release ---------- */
.hm-avail{margin-top:14px;display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.hm-note{margin:0;font-size:13px;line-height:1.5;color:var(--muted,#baa59b)}
.hm-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.hm-row-k{color:var(--copper,#c98c68);min-width:52px}
.hm-row-v{display:flex;flex-wrap:wrap;gap:4px 10px}
.hm-row-v a{color:inherit;border-bottom:1px solid currentColor;padding-bottom:1px;opacity:.9}
.hm-row-v a:hover{opacity:1;color:var(--rose,#e9b894)}
.hm-row-v span{opacity:.4}
.singles-sec .hm-note{color:#6a554d}
.singles-sec .hm-row-k{color:#8f5a41}
.singles-sec .hm-row-v a:hover{color:#8f5a41}