/* Mixology case-study only: shared navigation, hero motif and other pages stay unchanged. */
.mixology-case #product-screens { scroll-margin-top: 110px; }
.mixology-case .mix-content { width: min(100%, var(--max)); margin-inline: auto; }
.mixology-case .mix-intro { max-width: 820px; }
.mixology-case .mix-intro .project-context { margin-top: var(--title-gap); }
.mixology-case .mix-status { display: inline-block; margin: 0 0 22px; color: var(--case-accent); font-family: var(--mono-font); font-size: 14px; line-height: 1.6; letter-spacing: .06em; }
.mixology-case .mix-screens { padding-block: clamp(72px, 10vw, 140px); }
.mixology-case .mix-screen-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 3vw, 48px); margin-top: 52px; align-items: start; }
.mixology-case .mix-screen { margin: 0; min-width: 0; }
.mixology-case .mix-screen-link { display: block; width: min(100%, 340px); margin-inline: auto; border: 1px solid var(--line-strong); border-radius: 24px; background: #060606; overflow: hidden; }
.mixology-case .mix-screen-link img { display: block; width: 100%; height: auto; }
.mixology-case .mix-screen-link:hover { border-color: var(--case-accent); }
.mixology-case .mix-screen-link:focus-visible { outline: 3px solid var(--case-accent); outline-offset: 6px; }
.mixology-case .mix-screen figcaption { padding-top: 28px; }
.mixology-case .mix-step { color: var(--case-accent); font-family: var(--mono-font); font-size: 14px; letter-spacing: .06em; text-transform: uppercase; }
.mixology-case h3 { margin: 12px 0; color: var(--ink); font-family: var(--title-font); font-size: clamp(1.5rem, 2.2vw, 2rem); line-height: 1.12; font-weight: 600; }
.mixology-case .mix-screen p, .mixology-case .mix-collection p, .mixology-case .mix-release p { margin: 0; color: var(--muted); font-size: var(--body-size); line-height: 1.65; }
.mixology-case .mix-evidence-note { margin: 32px 0 0; color: var(--muted); font-family: var(--mono-font); font-size: 14px; line-height: 1.7; }
.mixology-case .mix-collections { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px; margin-top: 56px; }
.mixology-case .mix-collection { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1fr); gap: 26px; align-items: center; margin: 0; padding-top: 32px; border-top: 1px solid var(--line); }
.mixology-case .mix-collection .mix-screen-link { max-width: 220px; border-radius: 18px; }
.mixology-case .mix-release { display: grid; gap: 24px; border-top: 1px solid var(--line); padding-top: 28px; }
.mixology-case .mix-inline-link { color: var(--ink); text-decoration: underline; text-underline-offset: 4px; }
.mixology-case .case-bullets strong { color: var(--ink); font-weight: 600; }
@media (max-width: 900px) {
 .mixology-case .mix-screen-grid { gap: 22px; }
 .mixology-case .mix-collections { gap: 26px; }
 .mixology-case .mix-collection { grid-template-columns: 1fr; align-items: start; }
 .mixology-case .mix-collection .mix-screen-link { max-width: 250px; }
}
@media (max-width: 600px) {
 .mixology-case .mix-screen-grid, .mixology-case .mix-collections { grid-template-columns: 1fr; gap: 56px; }
 .mixology-case .mix-screen-link { max-width: 310px; }
 .mixology-case .mix-screen figcaption { padding-top: 24px; }
 .mixology-case .mix-collection { grid-template-columns: 1fr; gap: 24px; }
 .mixology-case .mix-collection .mix-screen-link { max-width: 280px; }
 .mixology-case .mix-status { font-size: 13px; }
}
