/* ===== CASE PAGE ===== */
.case{background:var(--white)}

/* hero */
.chero{position:relative;min-height:100svh;background:#000;color:#fff;display:flex;align-items:flex-end;overflow:hidden}
.chero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.chero__shade{position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.78) 0%,rgba(0,0,0,.25) 45%,rgba(0,0,0,.35) 100%);transition:opacity .6s}
.chero.is-playing .chero__shade{opacity:.15}
.chero.is-playing .chero__content>*:not(.chero__foot){opacity:0;pointer-events:none}
.chero__content{position:relative;z-index:2;width:100%;padding-top:120px;padding-bottom:clamp(28px,4vw,56px)}
.chero__content>*{transition:opacity .5s}
.back{display:inline-flex;gap:10px;font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;margin-bottom:clamp(40px,10vh,120px);opacity:.85}
.back:hover{opacity:1}
.chero__title{font-family:var(--display);font-weight:600;text-transform:uppercase;font-size:clamp(40px,11.4vw,210px);line-height:.86;letter-spacing:-.03em}
.chero__title .line{display:block;overflow:hidden;padding-bottom:.03em}
.chero__title .line>span{display:inline-block}
.js .chero__title .line>span{transform:translateY(105%);animation:rise 1.1s var(--ease) forwards}
.js .chero__title .line:nth-child(2)>span{animation-delay:.12s}
.chero__foot{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-top:28px;padding-top:22px;border-top:1px solid rgba(255,255,255,.25)}
.chero__line{font-size:clamp(22px,2.4vw,34px);font-weight:500;letter-spacing:-.01em}

/* sound / play button */
.sound{display:inline-flex;align-items:center;gap:12px;height:48px;padding:0 20px 0 16px;background:#fff;color:var(--ink);font-size:14px;font-weight:700;letter-spacing:.04em;flex-shrink:0;transition:background .25s,color .25s}
.sound:hover{background:var(--red);color:#fff}
.sound__icon{width:0;height:0;border-left:11px solid currentColor;border-top:7px solid transparent;border-bottom:7px solid transparent}
.sound[aria-pressed=true] .sound__icon{width:11px;height:14px;border:0;border-left:4px solid currentColor;border-right:4px solid currentColor}
.sound--float{position:absolute;right:var(--gut);bottom:var(--gut);z-index:2}

/* intro */
.cintro{padding-block:var(--sec)}
.cintro__grid{display:grid;grid-template-columns:minmax(260px,1fr) 2fr;gap:clamp(40px,7vw,140px);align-items:start}
.cmeta{position:sticky;top:110px}
.cmeta dl>div{padding:18px 0;border-top:1px solid var(--line)}
.cmeta dt{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--red);margin-bottom:6px}
.cmeta dd{font-weight:500;font-size:17px;line-height:1.45}
.scope{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.scope li{font-size:13px;font-weight:600;border:1px solid var(--ink);padding:6px 10px}
.award{display:flex;gap:16px;align-items:center;padding:20px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.award img{width:112px;height:auto;mix-blend-mode:multiply;flex-shrink:0}
.award p{font-size:14px;line-height:1.45}
.cintro__lead{font-family:var(--display);font-weight:600;font-size:clamp(30px,3.6vw,58px);line-height:1.04;letter-spacing:-.02em}
.cintro__lead em{color:var(--red);font-size:1.04em}
.cintro__body{font-size:clamp(18px,1.5vw,23px);line-height:1.55;max-width:56ch;margin-top:clamp(28px,3vw,48px);color:#3a3735}

/* chapters */
.chapter{padding-bottom:clamp(16px,2vw,24px)}
.chapter__head{display:flex;align-items:baseline;gap:clamp(16px,2vw,32px);padding-block:clamp(60px,8vw,120px) clamp(28px,3vw,48px);border-top:1px solid var(--line)}
.chapter__n{font-family:var(--display);font-weight:600;font-size:clamp(16px,1.4vw,20px);color:var(--red)}
.media{display:flex;flex-direction:column;gap:clamp(8px,1vw,16px);padding-inline:clamp(8px,1vw,16px)}
.media__row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(8px,1vw,16px)}
.m{overflow:hidden;background:#eee;aspect-ratio:16/9}
.m--full{aspect-ratio:16/8.2}
.m img,.m video{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.m__open{display:block;width:100%;height:100%;cursor:zoom-in}
.m:hover img{transform:scale(1.035)}

/* films */
.cfilm{position:relative;background:#929292;margin-top:clamp(8px,1vw,16px)}
.cfilm--dark{background:#000}
.cfilm video{width:100%;aspect-ratio:16/9;object-fit:cover}

/* closing */
.cclose{padding-block:var(--sec)}
.cclose__line{font-family:var(--display);font-weight:600;font-size:clamp(48px,8.6vw,160px);line-height:.92;letter-spacing:-.03em;text-transform:uppercase;max-width:12ch}
.cclose__line em{text-transform:none;color:var(--red);font-size:1.03em}

/* next */
.cnext{background:var(--paper)}
.cnext__link{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,64px);align-items:center;padding-block:clamp(56px,7vw,110px)}
.cnext__title{font-family:var(--display);font-weight:600;font-size:clamp(40px,6vw,96px);line-height:.95;text-transform:uppercase;letter-spacing:-.02em;transition:color .3s}
.cnext__line{font-family:var(--serif);font-style:italic;font-size:clamp(20px,1.8vw,28px);margin-top:12px}
.cnext__img{aspect-ratio:16/10;overflow:hidden}
.cnext__img img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.cnext__link:hover .cnext__title{color:var(--red)}
.cnext__link:hover .cnext__img img{transform:scale(1.05)}

/* lightbox */
.lightbox{position:fixed;inset:0;z-index:80;background:rgba(10,9,9,.94);display:flex;align-items:center;justify-content:center;padding:64px clamp(56px,7vw,110px)}
.lightbox img{max-width:100%;max-height:100%;object-fit:contain}
.lightbox__close{position:absolute;top:18px;right:var(--gut);color:#fff;font-size:14px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.lightbox__nav{position:absolute;top:50%;transform:translateY(-50%);width:52px;height:52px;background:#fff;color:var(--ink);font-size:20px}
.lightbox__nav:hover{background:var(--red);color:#fff}
.lightbox__prev{left:var(--gut)}.lightbox__next{right:var(--gut)}
.lightbox__count{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);color:rgba(255,255,255,.7);font-size:13px;font-weight:600;letter-spacing:.1em}

@media (max-width:900px){
  .cintro__grid{grid-template-columns:1fr}
  .cmeta{position:static;order:2}
  .cnext__link{grid-template-columns:1fr}
}
@media (max-width:760px){
  .chero__foot{flex-direction:column;align-items:flex-start}
  .media__row{grid-template-columns:1fr}
  .m--full{aspect-ratio:16/10}
  .sound--float{right:12px;bottom:12px;height:40px;padding:0 14px 0 12px;font-size:12px}
  .lightbox{padding:56px 12px}
  .lightbox__nav{top:auto;bottom:12px;transform:none;width:44px;height:44px}
}

/* ---------- additions: light hero, chapter text, grids ---------- */
.chero--light{background:#fff;color:var(--ink)}
.chero--light .chero__video{inset:12% auto auto 50%;width:calc(50% - var(--gut));height:74%;object-fit:contain;object-position:center}
body:has(.chero--light) .nav{background:rgba(17,16,16,.78)}
.chero--light .chero__foot{border-top-color:var(--line)}
.chero--light .back{color:var(--ink)}
.chapter__text{display:grid;grid-template-columns:minmax(260px,1fr) 2fr;gap:clamp(40px,7vw,140px);margin:0 auto clamp(40px,5vw,80px)}
.chapter__text>span{grid-column:2;font-family:var(--display);font-weight:600;font-size:clamp(22px,2.3vw,36px);line-height:1.12;letter-spacing:-.015em;max-width:30ch}
.chapter:has(> .chapter__text:last-child){padding-bottom:0}
.media__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(8px,1vw,16px)}
.media__trio{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(8px,1vw,16px)}
.m--sign{aspect-ratio:4/5;background:#fff;border:1px solid var(--line)}
.m--sign video{object-fit:contain}
.award+.award{border-top:0}
@media (max-width:760px){
  .chapter__text{display:block}
  .media__grid{gap:6px}
  .media__trio{gap:6px}
  .chero--light .chero__video{inset:72px auto auto var(--gut);width:calc(100% - 2*var(--gut));height:36%}
}
/* phones: while a film plays with sound, show the full 16:9 frame instead of the portrait crop */
@media (max-width:760px){
  .chero.is-playing{background:#000}
  .chero.is-playing .chero__video{object-fit:contain;inset:0 0 auto 0;height:calc(100% - 150px);z-index:2}
  .chero.is-playing .chero__shade{opacity:0}
}

/* ---------- media formats: tall (9:16), square, portrait, contain; 4-up grid; closing quote ---------- */
.m--tall{aspect-ratio:9/16}
.m--sq{aspect-ratio:1/1}
.m--port{aspect-ratio:4/5}
.m--contain{background:#F1EFEC}
.m--contain img,.m--contain video{object-fit:contain}
.media__quad{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(8px,1vw,16px)}
.media__row>.m--tall{max-height:none}
.cclose__quote{margin-top:clamp(40px,5vw,72px);max-width:46ch;border-top:1px solid var(--line);padding-top:24px}
.cclose__quote p{font-family:var(--serif);font-style:italic;font-size:clamp(22px,2vw,30px);line-height:1.3;color:var(--ink)}
.cclose__quote cite{display:block;margin-top:12px;font-style:normal;font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--red)}
@media (max-width:760px){
  .media__quad{grid-template-columns:1fr 1fr;gap:6px}
  .media__row:has(> .m--tall){grid-template-columns:1fr 1fr}
}
/* panoramic formats (Cersaie) */
.m--pano{aspect-ratio:1920/536}
.m--wide{aspect-ratio:1150/450}

/* Red Dot seal on case heroes and next-project blocks */
.chero__badge{margin-bottom:22px}
.cnext__img{position:relative}
img.cnext__badge{position:absolute;top:16px;left:16px;z-index:2;width:112px!important}
@media (max-width:760px){img.chero__badge{width:80px!important;margin-bottom:16px}img.cnext__badge{width:84px!important;top:12px;left:12px}}
.media__solo{display:grid;justify-items:center}
.media__solo>.m{width:min(100%,760px)}