/*
 * Music & Audio refinement layer (2026-08-24), ?v=20260824-music-1.
 *
 * Scope per the reviewed handoff v2.1: behavior and additions only — the
 * approved center and header design is untouched. This layer carries the
 * sticky menu with its compact wordmark, the vertical Cover Story sidebar
 * unit, the article crumb / ink rule / share row, Coming soon pages, and the
 * sector-voiced author page. The palette is mirrored at the .layout- level
 * so pages without the sector body class keep the music colors.
 * Bump the ?v= marker in all six link points on change: index/category/
 * article templates plus the shared _utility/author/404 partials.
 */
.layout-music-verdict { --sector-accent: var(--vuga-color-accent, #b5411f); color: #111; }

/* Sticky menu (mandatory): the approved dark category bar stays pinned; the
   compact Anton wordmark appears beside it once the masthead has scrolled
   away. Colors, fonts, and composition of the header are unchanged. */
.layout-music-verdict .sector-nav[data-music-nav] { position: sticky; top: 0; z-index: 40; background: #111; }
.layout-music-verdict .music-nav-logo { display: none; align-items: center; padding-right: .9rem; margin-right: .35rem; border-right: 1px solid rgba(255,255,255,.25); }
.layout-music-verdict .music-nav-logo strong { font: 400 .95rem/1 Anton, sans-serif; text-transform: uppercase; letter-spacing: .01em; color: #fff; }
.layout-music-verdict .music-nav-logo strong:after { content: '.'; color: var(--sector-accent); }
.mv-scrolled .layout-music-verdict .music-nav-logo { display: inline-flex; }

/* Homepage: the only addition to the approved center — a right rail carrying
   the vertical Cover Story unit (portrait 3:4 cover, two text rows, rubric
   link; Coming soon while the desk is empty). The feed column keeps the
   approved cover/reviews/latest geometry untouched. */
.layout-music-verdict .music-home { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 2.75rem; align-items: start; }
.layout-music-verdict .music-feed { min-width: 0; }
.layout-music-verdict .music-cover-story { border-top: 12px solid var(--sector-accent); padding-top: 1rem; }
.layout-music-verdict .music-cover-story > h2 { font: 400 2rem/0.95 Anton, sans-serif; text-transform: uppercase; letter-spacing: .01em; margin: .35rem 0 0; }
.layout-music-verdict .music-cs-feature { display: block; margin-top: 1rem; }
.layout-music-verdict .music-cs-feature .sector-media { aspect-ratio: 3 / 4; }
.layout-music-verdict .music-cs-feature h3 { font: 600 1.3rem/1.15 Lora, serif; margin: .55rem 0 .3rem; }
.layout-music-verdict .music-cs-feature .music-cs-line { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin: 0; color: #4d4d4d; font: 500 .95rem/1.45 Lora, serif; }
.layout-music-verdict .music-cs-all { display: inline-block; margin-top: 1rem; padding-top: .9rem; border-top: 1px solid var(--music-line, #cfcfcf); font: 700 11px Arial, sans-serif; text-transform: uppercase; letter-spacing: .09em; color: var(--sector-accent); text-decoration: none; }
.layout-music-verdict .music-cs-soon { margin-top: 1rem; padding: 1.4rem 1.2rem; border: 1px dashed var(--music-line, #cfcfcf); background: #f1f0ed; }
.layout-music-verdict .music-cs-soon p { margin: .35rem 0 0; font: 500 .95rem/1.5 Lora, serif; color: #4d4d4d; }

/* Article page: mono HOME/rubric crumb above the chip, ink rule under the
   byline, and a sector-voiced share row carrying the canonical URL. The
   approved article header, verdict block, and body grid are untouched. */
.layout-music-verdict .music-crumb { display: block; margin-bottom: 1rem; font: 700 11px Arial, sans-serif; letter-spacing: .12em; text-transform: uppercase; color: #666; }
.layout-music-verdict .music-crumb a { color: var(--sector-accent); text-decoration: none; }
.layout-music-verdict .music-crumb a:hover { text-decoration: underline; }
.layout-music-verdict .music-article .music-meta { display: block; border-bottom: 3px solid #111; padding-bottom: 1rem; }
.layout-music-verdict .music-share { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; margin: 1rem 0 0; }
.layout-music-verdict .music-share > span { font: 700 10px Arial, sans-serif; letter-spacing: .12em; text-transform: uppercase; color: #666; margin-right: .2rem; }
.layout-music-verdict .music-share a { border: 2px solid #111; padding: .4rem .65rem; font: 700 10px Arial, sans-serif; letter-spacing: .09em; text-transform: uppercase; color: #111; background: #fff; text-decoration: none; }
.layout-music-verdict .music-share a:hover { background: var(--sector-accent); border-color: var(--sector-accent); color: #fff; }

/* Approved-but-empty sections publish a Coming soon page in the standard
   category layout until their first articles land. */
.layout-music-verdict .music-coming-soon { margin-top: 2rem; padding: 2.2rem 1.8rem; border: 1px dashed var(--music-line, #cfcfcf); background: #f1f0ed; }
.layout-music-verdict .music-coming-soon h2 { font: 400 2.6rem/0.95 Anton, sans-serif; text-transform: uppercase; margin: 0; }
.layout-music-verdict .music-coming-soon p { margin: .6rem 0 0; font: 500 1.05rem/1.55 Lora, serif; color: #4d4d4d; max-width: 46rem; }

/* Author page in the sector voice: interface Author label in the accent,
   portrait photo tile, Anton name over an ink rule, Lora bio, card grid. */
.layout-music-verdict .sector-wrap { max-width: 76rem; margin: 0 auto; padding: 2.5rem clamp(1rem, 3vw, 2rem) 4rem; }
.layout-music-verdict .mv-crumb { display: block; margin-bottom: 1rem; font: 700 11px Arial, sans-serif; letter-spacing: .12em; text-transform: uppercase; color: #666; }
.layout-music-verdict .mv-crumb a { color: var(--sector-accent); text-decoration: none; }
.layout-music-verdict .sector-author-page { display: grid; grid-template-columns: 8rem minmax(0, 1fr); gap: 1.8rem; align-items: start; padding-bottom: 1.6rem; border-bottom: 6px solid #111; }
.layout-music-verdict .sector-author-page-photo { width: 8rem; height: 8rem; object-fit: cover; background: #f1f0ed; }
.layout-music-verdict .sector-author-page .sector-kicker { font: 700 11px Arial, sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--sector-accent); }
.layout-music-verdict .sector-author-page h1 { font: 400 clamp(2.4rem, 5vw, 4rem)/0.95 Anton, sans-serif; text-transform: uppercase; margin: .5rem 0 .8rem; }
.layout-music-verdict .sector-author-bio { max-width: 44rem; font: 500 1.1rem/1.6 Lora, serif; color: #242424; }
.layout-music-verdict .sector-author-title, .layout-music-verdict .sector-author-credentials { margin: .5rem 0 0; font: 700 11px Arial, sans-serif; text-transform: uppercase; letter-spacing: .09em; color: #666; }
.layout-music-verdict .sector-card .sector-media { aspect-ratio: 16 / 10; }
.layout-music-verdict .sector-card h3 { font: 600 1.15rem/1.2 Lora, serif; margin: .45rem 0 .3rem; }

/* 404 keeps the sector chrome: ink rule over the utility column. */
.layout-music-verdict .not-found-main { max-width: 46rem; margin: 0 auto; padding: 3rem 1.25rem 5rem; }

@media (max-width: 1020px) {
  .layout-music-verdict .music-home { grid-template-columns: 1fr; }
  .layout-music-verdict .music-cover-story { max-width: 26rem; }
  .layout-music-verdict .sector-author-page { grid-template-columns: 6rem minmax(0, 1fr); gap: 1.2rem; }
}
