/* Musical Vision concept case study. Shared typography and structure: case-study.css. */
.musical-vision-case { --mv-dark:#10161d; --mv-aqua:#61d5cc; }
.musical-vision-case .case-dark { background:var(--mv-dark); }
.mv-original-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.mv-screen > a { padding:0; background:#d9d9d9; }
.mv-screen > a img { width:100%; max-width:none; object-fit:cover; object-position:top center; }
.mv-screen--original > a { aspect-ratio:4/3; }
.mv-screen--original > a img { height:100%; }
.mv-screen--home > a { aspect-ratio:16/9; }
.mv-screen--home > a img { height:100%; }
.mv-identity-board { display:grid; grid-template-columns:.85fr 1.15fr; min-height:430px; border:1px solid var(--line); background:var(--mv-dark); color:#fff; }
.mv-logo-panel { display:grid; place-items:center; padding:clamp(38px,6vw,88px); background:var(--paper); }
.mv-logo-panel img { display:block; width:min(100%,420px); height:auto; }
.mv-identity-copy { display:flex; flex-direction:column; justify-content:center; padding:clamp(34px,6vw,84px); }
.mv-identity-copy span { color:var(--mv-aqua); font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; }
.mv-identity-copy strong { margin-block:24px; font:400 clamp(52px,6vw,88px)/.95 var(--font-display); }
.mv-identity-copy p { max-width:48ch; }
.mv-notes { display:grid; grid-template-columns:1fr 1fr; gap:10%; margin-top:32px; padding-top:26px; border-top:1px solid var(--line); }
.mv-notes h3 { margin:0 0 10px; font-size:19px; }
.mv-responsive-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; align-items:start; }
.mv-screen--service > a { aspect-ratio:4/5; }
.mv-screen--service > a img { height:100%; }
.mv-screen--mobile { grid-column:2; width:68%; justify-self:center; }
.mv-screen--mobile > a { aspect-ratio:1/2; background:var(--mv-dark); }
.mv-screen--mobile > a img { width:100%; height:100%; object-fit:cover; }
.musical-vision-case [id] { scroll-margin-top:24px; }
#identity > .section-back-to-top,
#responsive > .section-back-to-top { transform:translateY(-30px); }
@media(max-width:900px) {
  .mv-original-grid { grid-template-columns:1fr 1fr; }
  .mv-responsive-grid { grid-template-columns:1fr 1fr; }
  .mv-screen--mobile { grid-column:1/-1; width:min(52%,360px); justify-self:center; }
}
@media(max-width:760px) {
  .mv-original-grid,.mv-identity-board,.mv-notes,.mv-responsive-grid { grid-template-columns:1fr; }
  .mv-original-grid .mv-screen:last-child { display:none; }
  .mv-screen figcaption { flex-wrap:wrap; }
  .mv-identity-board { min-height:0; }
  .mv-screen--home > a,.mv-screen--service > a { aspect-ratio:4/5; }
  .mv-screen--mobile { grid-column:auto; width:min(78%,340px); }
}
