/* Concept Zombie: artwork-led case study using the shared site typography. */
body.cz-page { background: var(--color-surface, #f7f5f0); }
.cz-page #main-content { width: min(100% - 3rem, 68rem); margin-inline: auto; padding: 8.5rem 0 1rem; }
.cz-main { --cz-line: #deded5; --cz-muted: #59605a; }
.cz-main h1, .cz-page main h2 { color: var(--color-ink, #1c241e); font-family: inherit; font-weight: 600; letter-spacing: -.045em; }
.cz-main h1 { font-size: clamp(2.6rem, 5.1vw, 4.2rem); line-height: 1.06; margin: 0 0 1rem; }
.cz-page main h2 { font-size: clamp(1.9rem, 3.1vw, 2.75rem); line-height: 1.13; margin: 0; }
.cz-main .cz-kicker { margin: 0 0 1.1rem; font-size: .66rem; font-weight: 600; letter-spacing: .15em; text-transform: uppercase; color: var(--color-accent, #23483c); }
.cz-opening { padding-bottom: 2rem; border-bottom: 1px solid var(--cz-line); }
.cz-intro { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); align-items: start; gap: 2rem; margin-bottom: 2rem; }
.cz-tagline { font-size: clamp(1rem, 1.55vw, 1.3rem); letter-spacing: -.025em; color: var(--cz-muted); }
.cz-intro-copy > p, .cz-section-heading > p, .cz-community > div > p:last-child { font-size: .88rem; line-height: 1.7; color: var(--cz-muted); }
.cz-intro-copy dl { margin-top: 1.2rem; font-size: .75rem; line-height: 1.6; }
.cz-intro-copy dd { margin-top: .25rem; max-width: 26ch; }
.cz-intro-copy dt { color: var(--color-accent); font-size: .62rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.cz-section-heading { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: clamp(2rem, 7vw, 6rem); }
.cz-location { margin: 0; min-width: 0; scroll-margin-top: 7rem; }
.cz-location-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: .75rem; }
.cz-location-grid img { display: block; width: 100%; height: 100%; min-height: 0; aspect-ratio: 2 / 1; object-fit: cover; border-radius: .45rem; }
.cz-location-grid .cz-location-exterior { grid-row: span 2; aspect-ratio: auto; }
.cz-location figcaption { display: flex; justify-content: space-between; gap: .5rem 1rem; flex-wrap: wrap; margin-top: .8rem; font-size: .68rem; line-height: 1.5; color: var(--cz-muted); }
.cz-section { margin-top: 4.75rem; scroll-margin-top: 7rem; }
.cz-section-heading { align-items: end; margin-bottom: 2rem; }
.cz-campaign-pair { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); gap: 1.2rem; }
.cz-campaign-pair + .cz-campaign-pair { margin-top: 2.25rem; }
.cz-art { min-width: 0; margin: 0; }
.cz-art-link { position: relative; display: flex; align-items: center; justify-content: center; background: #eae9e3; border-radius: .45rem; overflow: hidden; padding: clamp(1rem, 2.5vw, 2.25rem); }
.cz-art-link img { display: block; width: 100%; height: 100%; object-fit: contain; min-height: 0; }
.cz-campaign-pair .cz-art-link { height: clamp(18rem, 39vw, 31rem); background: #e5e7e4; }
.cz-campaign-pair .cz-portrait .cz-art-link { background: #dce0de; }
.cz-campaign-pair--warm .cz-art-link { background: #eee3d7; }
.cz-campaign-pair--warm .cz-portrait .cz-art-link { background: #e7d8c8; }
.cz-art figcaption { display: flex; justify-content: space-between; gap: .6rem; padding-top: .75rem; font-size: .68rem; line-height: 1.5; }
.cz-art figcaption > span:last-child { color: var(--cz-muted); text-align: right; }
.cz-enlarge { position: absolute; bottom: .65rem; right: .65rem; display: grid; place-items: center; width: 1.8rem; height: 1.8rem; border-radius: 50%; background: #fff; color: #23483c; box-shadow: 0 1px 5px #0000000c; transition: transform .2s ease; }
.cz-art-link:hover .cz-enlarge { transform: translate(2px, -2px); }
.cz-art-grid { display: grid; gap: 1.2rem; }
.cz-art-grid--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cz-art-grid--three .cz-art-link { height: clamp(15rem, 29vw, 23rem); padding: 1.1rem; }
.cz-art-grid--three .cz-art:nth-child(2) .cz-art-link { background: #e5e9e3; }
.cz-art-grid--three figcaption { display: block; }
.cz-art-grid--three figcaption > span { display: block; text-align: left; }
.cz-art-grid--three figcaption > span + span { margin-top: .2rem; }
.cz-art-grid--event { grid-template-columns: minmax(0, 1fr) minmax(0, 1.65fr); }
.cz-art-grid--event .cz-art-link { height: clamp(18rem, 35vw, 28rem); }
.cz-banners { display: grid; gap: 1.5rem; margin-top: 2rem; }
.cz-banners .cz-art-link { padding: 1.8rem; }
.cz-banners img { height: auto; }
.cz-community { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.65fr); align-items: center; gap: 3rem; padding-block: 3rem; margin-top: 4.75rem; border-block: 1px solid var(--cz-line); }
.cz-community > div > p:last-child { margin-top: 1.2rem; }
.cz-community img { height: auto; }
.cz-video-shell { overflow: hidden; border: 1px solid var(--cz-line); border-radius: .6rem; }
#cz-video-region { background: #141917; }
#concept-zombie-video { display: block; width: 100%; height: min(37rem, 65vw); object-fit: contain; }
.cz-video-toolbar { display: flex; justify-content: space-between; align-items: center; padding: 1rem 1.2rem; gap: 1rem; }
.cz-video-toolbar > p { font-size: .82rem; font-weight: 500; }
.cz-video-navigation { display: flex; align-items: center; flex-shrink: 0; gap: .5rem; }
.cz-video-navigation > span { font-size: .7rem; font-variant-numeric: tabular-nums; color: var(--cz-muted); margin-right: .5rem; }
.cz-video-navigation button { width: 44px; height: 44px; border: 1px solid #b4b9b0; border-radius: 50%; background: transparent; }
.cz-video-navigation button:hover:not(:disabled) { background: #23483c; color: white; border-color: #23483c; }
.cz-video-navigation button:disabled { opacity: .35; cursor: default; }
.cz-account-links { border-top: 1px solid var(--cz-line); }
.cz-account-links > a { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.3rem .25rem; border-bottom: 1px solid var(--cz-line); font-size: 1rem; transition: padding .2s ease; }
.cz-account-links > a:hover { padding-inline: .7rem; color: var(--color-accent); }
.cz-account-links small { display: block; margin-top: .2rem; color: var(--cz-muted); font-size: .7rem; }
.cz-main .project-pagination { margin-top: 4.75rem; padding-inline: 0; }
.cz-main a:focus-visible, .cz-main button:focus-visible, #cz-video-region:focus-visible, .cz-lightbox button:focus-visible { outline: 2px solid #347863; outline-offset: 5px; }
.cz-lightbox { width: min(96vw, 78rem); max-width: none; height: min(94dvh, 60rem); max-height: 94dvh; margin: auto; padding: 1rem; border: 1px solid #d4d7ce; border-radius: .7rem; background: #f7f5f0; color: #1c241e; }
.cz-lightbox[open] { display: flex; flex-direction: column; gap: .75rem; }
.cz-lightbox::backdrop { background: #111914df; }
.cz-lightbox-toolbar, .cz-lightbox-navigation { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-shrink: 0; font-size: .75rem; }
.cz-lightbox-toolbar p { line-height: 1.5; }
.cz-lightbox button { min-height: 44px; padding: .5rem .8rem; border: 1px solid #b4b9b0; border-radius: 2rem; flex-shrink: 0; }
.cz-lightbox button:hover { background: #e6e9e1; }
.cz-lightbox button:disabled { opacity: .35; }
#cz-lightbox-image { flex: 1; min-height: 0; width: 100%; object-fit: contain; }
@media (max-width: 900px) {
  .cz-intro { gap: 1.5rem; grid-template-columns: 1.4fr 1fr; }
  .cz-section-heading { gap: 2rem; }
  .cz-art figcaption { flex-direction: column; gap: .15rem; }
  .cz-art figcaption > span:last-child { text-align: left; }
}
@media (max-width: 640px) {
  .cz-page #main-content { width: calc(100% - 2rem); padding-top: 7rem; }
  .cz-intro, .cz-section-heading, .cz-community { grid-template-columns: 1fr; gap: 1.5rem; }
  .cz-main h1 { font-size: clamp(2.2rem, 10vw, 3.4rem); }
  .cz-intro { margin-bottom: 1.5rem; }
  .cz-intro-copy dl { margin-top: 1rem; }
  .cz-intro-copy dd { max-width: none; }
  .cz-opening { padding-bottom: 1.5rem; }
  .cz-location-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
  .cz-location-grid .cz-location-exterior { grid-column: 1 / -1; grid-row: auto; aspect-ratio: 2 / 1; }
  .cz-section, .cz-community { margin-top: 3.25rem; }
  .cz-section-heading { margin-bottom: 1.5rem; }
  .cz-campaign-pair { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: .7rem; }
  .cz-campaign-pair .cz-art-link { height: clamp(12rem, 56vw, 20rem); padding: .6rem; }
  .cz-art figcaption { font-size: .65rem; }
  .cz-enlarge { width: 1.5rem; height: 1.5rem; font-size: .8rem; bottom: .35rem; right: .35rem; }
  .cz-art-grid--three { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.4rem .7rem; }
  .cz-art-grid--three .cz-art-link { height: clamp(13rem, 58vw, 21rem); padding: .65rem; }
  .cz-art-grid--three .cz-art:last-child { grid-column: 1 / -1; }
  .cz-art-grid--three .cz-art:last-child .cz-art-link { height: auto; padding: 1rem; }
  .cz-art-grid--event { grid-template-columns: 1fr; gap: 1.5rem; }
  .cz-art-grid--event .cz-art-link { height: auto; padding: 1.2rem; }
  .cz-art-grid--event .cz-art:first-child img { max-height: 26rem; }
  .cz-banners .cz-art-link { padding: 1rem .65rem; }
  .cz-video-toolbar { flex-wrap: wrap; padding: .8rem; }
  .cz-video-navigation { margin-left: auto; }
  #concept-zombie-video { height: 72vw; max-height: 27rem; }
  .cz-account-links > a { font-size: .9rem; }
  .cz-lightbox { padding: .65rem; }
  .cz-lightbox-toolbar, .cz-lightbox-navigation { font-size: .65rem; }
}
@media (prefers-reduced-motion: reduce) {
  .cz-main *, .cz-main *::before, .cz-main *::after { transition: none !important; }
}