.case-page { background: #f7f6f2; }
.case-intro { padding-top: 38px; padding-bottom: 30px; }
.case-back { display: inline-flex; font-size: 12px; color: var(--muted); padding: 5px 0; }
.case-back:hover { color: var(--red); }
.case-heading { display: flex; justify-content: space-between; align-items: end; gap: 30px; margin-top: 38px; }
.case-heading .eyebrow { color: var(--muted); letter-spacing: 1px; }
.case-heading h1 { font: 500 clamp(42px,6.5vw,90px)/1.04 var(--sans); letter-spacing: -.055em; margin: 17px 0 0; max-width: 1000px; overflow-wrap: anywhere; }
.case-jump { flex-shrink: 0; display: flex; align-items: center; gap: 25px; font-size: 11px; padding-bottom: 7px; border-bottom: 1px solid var(--line); }
.case-jump span { font-size: 22px; }
.case-hero { margin-top: 8px; }
.case-zoom { display: block; width: 100%; padding: 0; border: 0; border-radius: 4px; background: transparent; cursor: zoom-in; overflow: hidden; }
.case-zoom img { width: 100%; height: auto; max-width: 100%; object-fit: contain; }
.case-story { display: grid; grid-template-columns: .8fr 1.2fr; gap: 70px; padding-top: 66px; padding-bottom: 64px; }
.case-story .eyebrow { color: var(--muted); margin-bottom: 17px; }
.case-story h2 { font: 500 clamp(25px,3vw,40px)/1.2 var(--sans); letter-spacing: -1.3px; max-width: 470px; }
.case-description { margin: 0; font-size: 16px; line-height: 1.9; color: #575b52; }
.case-scope { margin: 25px 0 0; padding: 0; display: flex; gap: 8px; flex-wrap: wrap; list-style: none; }
.case-scope li { border: 1px solid var(--line); padding: 7px 12px; border-radius: 2px; font-size: 10px; line-height: 1.6; color: #666b60; }
.case-section-title { border-top: 1px solid var(--line); padding-top: 27px; display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 30px; }
.case-section-title h2 { font: 500 clamp(25px,3vw,36px)/1.15 var(--sans); letter-spacing: -1.2px; }
.case-section-title p { font-size: 10px; color: var(--muted); margin: 0; }
.case-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 28px 22px; align-items: start; }
.case-figure { min-width: 0; margin: 0; }
.case-figure.landscape { grid-column: 1/-1; }
.case-figure figcaption { display: flex; gap: 12px; font-size: 10px; line-height: 1.7; color: var(--muted); padding-top: 10px; }
.case-figure figcaption span:nth-child(2) { flex: 1; }
.case-single-note { grid-column: 1/-1; margin: 0; padding: 15px 0; font-size: 14px; color: var(--muted); }
.case-next { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 40px; margin-top: 65px; margin-bottom: 65px; }
.case-next a { border-top: 1px solid var(--line); padding: 22px 0; min-width: 0; }
.case-next a:last-child { text-align: right; }
.case-next span { display: block; font-size: 10px; color: var(--muted); margin-bottom: 12px; }
.case-next strong { font-size: clamp(20px,2.6vw,35px); font-weight: 400; letter-spacing: -1px; line-height: 1.2; }
.case-next a:hover strong { color: var(--red); }
.case-contact { background: #e9e8e0; padding: 60px 0; }
.case-contact h2 { margin: 17px 0 25px; font: 500 clamp(35px,4vw,60px)/1.12 var(--sans); letter-spacing: -2px; }
.image-dialog { position: fixed; inset: 0; width: 100vw; max-width: none; height: 100dvh; max-height: none; margin: 0; border: 0; padding: 68px 60px 62px; background: #141613; color: #fff; }
.image-dialog[open] { display: flex; align-items: center; justify-content: center; }
.image-dialog::backdrop { background: #141613; }
#zoom-image { display: block; width: auto; height: auto; max-width: 100%; max-height: 100%; object-fit: contain; }
.image-dialog-toolbar { position: absolute; inset: 15px 22px auto; display: flex; justify-content: space-between; align-items: center; font-size: 11px; }
.image-dialog-toolbar button { background: transparent; border: 1px solid #ffffff4d; color: white; padding: 8px 14px; border-radius: 3px; }
.image-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 38px; height: 44px; background: #ffffff12; color: white; border: 1px solid #ffffff33; border-radius: 3px; font-size: 22px; }
.image-prev { left: 10px; } .image-next { right: 10px; }
#image-caption { position: absolute; left: 60px; right: 60px; bottom: 14px; margin: 0; text-align: center; font-size: 10px; line-height: 1.5; color: #c4c9be; }
@media(max-width:800px) {
  .case-story { grid-template-columns: 1fr; gap: 23px; padding-block: 40px; }
  .case-heading { margin-top: 25px; }
  .case-jump { display: none; }
  .case-description { font-size: 14px; }
  .case-next { margin-block: 40px; gap: 22px; }
}
@media(max-width:520px) {
  .case-intro { padding-top: 24px; padding-bottom: 22px; }
  .case-heading h1 { font-size: 43px; }
  .case-grid { grid-template-columns: 1fr; gap: 22px; }
  .case-figure.landscape { grid-column: auto; }
  .case-section-title { display: block; }
  .case-section-title p { margin-top: 10px; }
  .case-next strong { font-size: 21px; }
  .case-contact { padding-block: 40px; }
  .image-dialog { padding: 68px 37px 75px; }
  .image-nav { width: 28px; font-size: 18px; }
  .image-prev { left: 3px; } .image-next { right: 3px; }
  #image-caption { left: 22px; right: 22px; }
}