/* MICHAEL CUNO PHOTOGRAPHY — MUSIC DESIGNSTUDIE v0.6
   Only music.html includes this stylesheet. v0.5 remains intact. */
body[data-page="music"]{background:#fff!important;color:#171717}
body[data-page="music"] #view{min-height:65svh}
body[data-page="music"] .music-intro{padding:calc(var(--head-h) + 20px) var(--gut) 26px}
body[data-page="music"] .music-eyebrow{display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid #d9d9d6;padding-top:12px;color:#5a5a56;font:500 13px/1.4 var(--sans);letter-spacing:.045em}
body[data-page="music"] .music-intro-main{display:flex;justify-content:space-between;align-items:baseline;gap:22px;margin-top:18px}
body[data-page="music"] .music-intro h1{font:500 clamp(28px,2.7vw,39px)/1.1 var(--sans);letter-spacing:-.026em;margin:0}
body[data-page="music"] .music-intro p{font:400 clamp(14px,1.1vw,17px)/1.4 var(--sans);color:#575752;margin:0}
body[data-page="music"] .music-artists,
body[data-page="music"] .music-records{padding:0 var(--gut)}
body[data-page="music"] .music-section-head{display:grid;grid-template-columns:32px 1fr auto;align-items:baseline;gap:12px;border-top:1px solid #dadad7;padding:15px 0 24px;font-family:var(--sans)}
body[data-page="music"] .music-section-head h2{font:500 clamp(19px,1.5vw,23px)/1.15 var(--sans);letter-spacing:-.015em;margin:0}
body[data-page="music"] .music-section-n,
body[data-page="music"] .music-section-count{font:500 13px/1.25 var(--sans);color:#62625d;letter-spacing:.04em}
body[data-page="music"] .music-portrait-grid,
body[data-page="music"] .music-record-grid{padding:0;margin:0;list-style:none}
/* Portraits: direct gaze vs inward-facing figure; deliberately asymmetric, not a cover wall. */
body[data-page="music"] .music-portrait-grid{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);gap:clamp(28px,5vw,92px);align-items:end}
body[data-page="music"] .music-portrait-grid .music-tile:nth-child(2){padding-top:clamp(50px,9vw,120px)}
body[data-page="music"] .music-tile{min-width:0}
body[data-page="music"] .music-tile-link{display:block;text-decoration:none}
body[data-page="music"] .music-tile-visual{display:flex;width:100%;align-items:end;justify-content:flex-start;overflow:hidden}
body[data-page="music"] .music-portrait .music-tile-visual{max-width:600px}
body[data-page="music"] .music-portrait img{display:block;width:100%;height:auto;object-fit:contain;object-position:left bottom;max-height:74svh;max-width:100%}
body[data-page="music"] .music-portrait-grid .music-tile:nth-child(2) .music-tile-visual{max-width:515px}
body[data-page="music"] .music-tile-caption{display:block;max-width:100%;padding-top:14px;color:#171717}
body[data-page="music"] .music-tile-titleline{display:flex;align-items:baseline;justify-content:space-between;gap:12px;max-width:600px}
body[data-page="music"] .music-tile-titleline strong{font:500 clamp(20px,2vw,28px)/1.16 var(--sans);letter-spacing:-.025em}
body[data-page="music"] .music-tile-arrow{font:400 22px/1 var(--sans);transition:transform .2s ease}
body[data-page="music"] .music-tile-link:hover .music-tile-arrow,
body[data-page="music"] .music-tile-link:focus-visible .music-tile-arrow{transform:translate(3px,-3px)}
body[data-page="music"] .music-tile-kicker{display:block;margin-top:5px;font:400 14px/1.35 var(--sans);color:#51514e;letter-spacing:.015em}
/* Record artwork: a single aligned shelf. No shadow, no forced crop, no hover zoom. */
body[data-page="music"] .music-records{padding-top:clamp(65px,9svh,112px);padding-bottom:80px}
body[data-page="music"] .music-record-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(22px,3.5vw,60px);align-items:start}
body[data-page="music"] .music-record .music-tile-visual{width:100%;aspect-ratio:1.03;align-items:center;justify-content:center}
body[data-page="music"] .music-record img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;box-shadow:none}
body[data-page="music"] .music-record .music-tile-titleline strong{font-size:clamp(18px,1.6vw,23px)}
body[data-page="music"] .music-record .music-tile-caption{padding-top:15px}
/* The project interior has its own image-first rhythm instead of Editorial's scene machinery. */
body[data-page="music"] .music-project-head{padding:calc(var(--head-h) + 20px) var(--gut) 23px;border-bottom:1px solid #dededb}
body[data-page="music"] .music-back{font:500 13px/1.4 var(--sans);letter-spacing:.045em;display:inline-block;margin-bottom:30px}
body[data-page="music"] .music-kicker{font:500 13px/1.4 var(--sans);color:#64645f;letter-spacing:.05em;text-transform:uppercase;margin:0 0 10px}
body[data-page="music"] .music-project-head h1{font:500 clamp(27px,3.4vw,48px)/1.1 var(--sans);letter-spacing:-.028em;margin:0 0 8px}
body[data-page="music"] .music-project-meta{font:400 14px/1.4 var(--sans);color:#595955;margin:0}
body[data-page="music"] .music-project-images{padding:clamp(20px,3vw,44px) var(--gut) 0;display:grid;column-gap:clamp(18px,3vw,55px);row-gap:clamp(30px,5vw,78px);align-items:start}
body[data-page="music"] .music-project-images.is-portrait{grid-template-columns:repeat(2,minmax(0,1fr))}
body[data-page="music"] .music-project-images.is-portrait .is-feature{grid-column:1 / -1;display:flex;justify-content:center}
body[data-page="music"] .music-project-images.is-record{grid-template-columns:repeat(2,minmax(0,1fr))}
body[data-page="music"] .music-project-images.is-record .is-feature{grid-column:1 / -1;display:flex;justify-content:center}
body[data-page="music"] .music-project-photo{margin:0;min-width:0}
body[data-page="music"] .music-image-open{display:flex;justify-content:center;align-items:center;cursor:zoom-in;width:100%;border:0;background:transparent}
body[data-page="music"] .music-project-photo img{display:block;width:auto;height:auto;max-width:100%;max-height:min(74svh,800px);object-fit:contain}
body[data-page="music"] .music-project-photo:not(.is-feature) img{max-height:62svh}
body[data-page="music"] .music-project-images.is-record .is-feature img{max-height:min(77svh,810px)}
body[data-page="music"] .music-project-next{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:60px var(--gut) 50px;padding-top:18px;border-top:1px solid #d6d6d2;font-family:var(--sans)}
body[data-page="music"] .music-project-next span{font-size:13px;color:#5d5d58}
body[data-page="music"] .music-project-next a{font-size:17px;font-weight:500}
body[data-page="music"] .music-project-next a:hover{text-decoration:underline;text-underline-offset:4px}
body[data-page="music"] .music-project-view .rv{opacity:1;transform:none}
@media(max-width:760px){
  body[data-page="music"] .music-intro{padding:calc(var(--head-h) + 16px) var(--gut) 20px}
  body[data-page="music"] .music-intro-main{display:block;margin-top:12px}
  body[data-page="music"] .music-intro-main p{margin-top:6px}
  body[data-page="music"] .music-section-head{grid-template-columns:24px minmax(0,1fr) auto;padding:13px 0 17px;gap:8px}
  body[data-page="music"] .music-section-head h2{font-size:19px}
  body[data-page="music"] .music-section-count{font-size:12px}
  body[data-page="music"] .music-portrait-grid{display:grid;grid-template-columns:1fr;gap:38px}
  body[data-page="music"] .music-portrait-grid .music-tile:nth-child(2){padding-top:0}
  body[data-page="music"] .music-portrait img{width:100%;max-height:none}
  body[data-page="music"] .music-portrait-grid .music-tile:nth-child(2) .music-tile-visual{max-width:none}
  body[data-page="music"] .music-records{padding-top:58px}
  body[data-page="music"] .music-record-grid{grid-template-columns:1fr;gap:40px}
  body[data-page="music"] .music-record .music-tile-visual{aspect-ratio:auto}
  body[data-page="music"] .music-record img{width:100%;height:auto}
  body[data-page="music"] .music-tile-titleline strong{font-size:23px}
  body[data-page="music"] .music-project-head{padding-top:calc(var(--head-h) + 18px)}
  body[data-page="music"] .music-back{margin-bottom:20px}
  body[data-page="music"] .music-project-images.is-portrait,
  body[data-page="music"] .music-project-images.is-record{display:block}
  body[data-page="music"] .music-project-photo{margin:0 0 28px}
  body[data-page="music"] .music-project-photo img{max-height:none}
  body[data-page="music"] .music-project-next{align-items:flex-start}
}
@media(prefers-reduced-motion:reduce){
  body[data-page="music"] .music-tile-arrow{transition:none}
}

/* v0.6c — Artist portraits as one centered pair. The previous full-width
   grid left both photos in oversized columns, causing a left-heavy layout.
   Keep the original image heights/sizes, descriptions and record shelf. */
@media(min-width:761px){
  body[data-page="music"] .music-portrait-grid{
    display:flex;
    justify-content:center;
    align-items:flex-end;
    gap:clamp(48px,5.0vw,82px);
    width:100%;
    margin-inline:auto;
  }
  body[data-page="music"] .music-portrait-grid .music-tile:first-child{
    width:min(600px,60.4svh);
    flex:0 1 auto;
    transform:none;
  }
  body[data-page="music"] .music-portrait-grid .music-tile:nth-child(2){
    width:min(515px,50.1svh);
    flex:0 1 auto;
    transform:none;
  }
}

/* v0.6e — Add ~3 cm more breathing room at desktop scale.
   The pair remains centered; image sizes and the record shelf are unchanged.
   Below 1300px retain v0.6d to avoid squeezing the photographs. */
@media (min-width:1300px){
  body[data-page="music"] .music-portrait-grid{
    gap:calc(clamp(48px, 5vw, 82px) + 113px);
  }
}


/* v0.7 MUSIC: Tracy Bonham complete eight-image photo essay, no cropping.
   Only Tracy's project interior changes; artist overview and record artworks stay as they were. */
body[data-page="music"] .music-project-images.is-tracy-eight {
  display:block;
  padding-top:clamp(20px,3vw,44px);
}
body[data-page="music"] .is-tracy-eight .tracy-chapter {
  width:100%;
  margin:0 auto clamp(48px,7vw,112px);
  display:flex;
  align-items:flex-start;
  justify-content:center;
  gap:clamp(30px,4.7vw,86px);
}
body[data-page="music"] .is-tracy-eight .tracy-chapter:last-child {margin-bottom:0}
body[data-page="music"] .is-tracy-eight .tracy-pair .music-project-photo {
  flex:0 1 48%;
  max-width:min(46%,580px);
}
body[data-page="music"] .is-tracy-eight .tracy-solo .music-project-photo {
  flex:0 1 auto;
  width:min(56vw,650px);
}
body[data-page="music"] .is-tracy-eight .tracy-finale .music-project-photo {
  width:min(47vw,540px);
}
body[data-page="music"] .is-tracy-eight .music-image-open {display:block;width:100%;}
body[data-page="music"] .is-tracy-eight .music-project-photo img,
body[data-page="music"] .is-tracy-eight .music-project-photo:not(.is-feature) img {
  width:auto;
  max-width:100%;
  height:auto;
  max-height:none;
  margin-inline:auto;
  object-fit:contain;
}
@media(max-width:760px){
  body[data-page="music"] .is-tracy-eight .tracy-chapter {
    display:block;
    margin-bottom:clamp(28px,7svh,58px);
  }
  body[data-page="music"] .is-tracy-eight .tracy-chapter .music-project-photo {
    max-width:100%;
    width:100%;
    margin:0 0 25px;
  }
  body[data-page="music"] .is-tracy-eight .tracy-chapter .music-project-photo:last-child {margin-bottom:0}
}

/* v0.8a — image pairs visually meet toward the centre, preserving full compositions. */
@media(min-width:761px){
  body[data-page="music"] .music-project-images.is-record{
    column-gap:clamp(20px,2.2vw,36px);
    max-width:1240px;
    margin-inline:auto;
  }
  body[data-page="music"] .music-project-images.is-record .music-project-photo:not(.is-feature):nth-child(even) .music-image-open{
    justify-content:flex-end;
  }
  body[data-page="music"] .music-project-images.is-record .music-project-photo:not(.is-feature):nth-child(odd) .music-image-open{
    justify-content:flex-start;
  }
}


/* v0.9e — MUSIC opening only. Less empty space before Artist portraits.
   The approved portrait pairing, record shelf, and every story remain unchanged.
   Desktop/tablet only; mobile layout retains the former measurements. */
@media (min-width:761px){
  body[data-page="music"] #view:not(.music-project-view) .music-intro {
    padding-top:calc(var(--head-h) + 8px);
    padding-bottom:12px;
  }
  body[data-page="music"] #view:not(.music-project-view) .music-intro-main {
    margin-top:10px;
  }
  body[data-page="music"] #view:not(.music-project-view) .music-artists .music-section-head {
    padding-top:10px;
    padding-bottom:14px;
  }
  body[data-page="music"] #view:not(.music-project-view) .music-portrait-grid .music-tile:nth-child(2) {
    padding-top:clamp(18px,3vw,42px);
  }
}


/* v0.9k — Only the two approved MUSIC text adjustments.
   Preserve the overview layout and right-hand credits exactly.
   Keep its semantic heading readable for assistive technology. */
body[data-page="music"] .music-intro-main > h1 { opacity:0; }
/* Tracy's back-link grows visibly, but keeps its old line-box height. */
@media (min-width:761px) {
  body[data-page="music"] #view.music-cine-tracy .music-back {
    font-size:17px;
    line-height:18.2px;
  }
}


/* v0.9m - MUSIC OVERVIEW ONLY: actually reclaim the hidden heading's space.
   No change to the three right-side labels or to Tracy's detail pages.
   Preserve Music as an accessible h1 while removing it from visual flow. */
@media (min-width:761px){
  body[data-page="music"] #view:not(.music-project-view) .music-intro-main {margin-top:0;}
  body[data-page="music"] #view:not(.music-project-view) .music-intro-main > h1 {
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip-path:inset(50%);
    white-space:nowrap;
    opacity:1;
  }
  body[data-page="music"] #view:not(.music-project-view) .music-intro-main > p {
    margin-left:auto;
    transform:translateY(26px);
  }
  body[data-page="music"] #view:not(.music-project-view) .music-intro {padding-bottom:5px;}
  body[data-page="music"] #view:not(.music-project-view) .music-artists .music-section-count {
    transform:translateY(36px);
  }
}

/* Keep the fixed right subtitle clear of the section divider after reclaiming space.
   Transparent border preserves the exact 1px layout geometry. */
@media (min-width:761px){
  body[data-page="music"] #view:not(.music-project-view) .music-artists .music-section-head {border-top-color:transparent;}
}


/* v0.9n — restore the MUSIC overview heading, without reflowing the approved
   right-hand labels or the portraits. The title replaces the left eyebrow,
   and remains the original semantic <h1>. Tracy/project layouts unchanged. */
@media (min-width:761px) {
  body[data-page="music"] #view:not(.music-project-view) .music-intro { position:relative; }
  body[data-page="music"] #view:not(.music-project-view) .music-eyebrow > span:first-child { visibility:hidden; }
  body[data-page="music"] #view:not(.music-project-view) .music-intro-main > h1 {
    position:absolute;
    top:calc(var(--head-h) + 21px);
    left:var(--gut);
    width:auto;
    height:auto;
    margin:0;
    overflow:visible;
    clip-path:none;
    opacity:1;
    white-space:nowrap;
    font-size:clamp(26px,2vw,30px);
    line-height:1.15;
  }
}
@media (max-width:760px) {
  body[data-page="music"] #view:not(.music-project-view) .music-intro-main > h1 { opacity:1; }
}