@charset "UTF-8";

/* Case CMS lists share the fixed material film with the local archive.
   All selectors stay inside this list; CMS detail and other channels are unchanged. */
body.zm-cms-page .cms-case-main .cms-case-flow { --cms-case-hero-top: 93px; }
body.zm-cms-page .cms-case-main .cms-case-surface { background: #fff; }
body.zm-cms-page .cms-case-main .cms-case-media { position: absolute; z-index: -2; inset: 0; pointer-events: none; }
body.zm-cms-page .cms-case-main .cms-case-media .cms-material-image { z-index: auto; }

@supports (clip-path: inset(0)) {
  @media (min-width: 761px) and (prefers-reduced-motion: no-preference) {
    body.zm-cms-page .cms-case-main .cms-case-flow { position: relative; isolation: isolate; clip-path: inset(calc(0px - var(--cms-case-hero-top)) 0 0); }
    body.zm-cms-page .cms-case-main .cms-case-flow > .cms-material-hero { isolation: auto; overflow: visible; background: transparent; }
    body.zm-cms-page .cms-case-main .cms-material-hero > .cms-case-media { position: fixed; inset: 0 0 auto; height: max(calc(475px + var(--cms-case-hero-top)), 100lvh); }
    body.zm-cms-page .cms-case-main .cms-case-surface { position: relative; background: rgba(247,249,250,.68); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); border-top: 1px solid rgba(255,255,255,.7); }
    body.zm-cms-page .cms-case-main :is(.cms-section-heading, .cms-catalog-tools, .cms-categories, .cms-pagination) { padding: 24px; background: rgba(255,255,255,.88); }
    body.zm-cms-page .cms-case-main .cms-catalog-tools .cms-search { margin-bottom: 0; }
    body.zm-cms-page .cms-case-main .cms-case-copy { padding: 22px 24px 24px; background: rgba(255,255,255,.94); }
    body.zm-cms-page .cms-case-main .cms-case-image { isolation: isolate; }
    body.zm-cms-page .cms-case-main :is(.cms-section-heading p, .cms-case-copy > p, .cms-categories, .cms-item-bottom time) { color: #465158; }
  }
}

@media (min-width: 761px) and (max-width: 1200px) {
  body.zm-cms-page .cms-case-main .cms-case-flow { --cms-case-hero-top: 87px; }
}
@media (min-width: 761px) and (max-width: 1000px) {
  body.zm-cms-page .cms-case-main .cms-case-flow { --cms-case-hero-top: 81px; }
}
@media (max-width: 760px) {
  body.zm-cms-page .cms-case-main .cms-case-media { inset: auto 0 0; height: 315px; }
}
@media (max-width: 480px) {
  body.zm-cms-page .cms-case-main .cms-case-media { height: 283px; }
}
