/* MEV Case Studies — reusable gallery system, Pantoufle MASTER grammar. DRAFT. */
.mev-cs-gallery{width:min(100%,880px);max-width:880px;margin:56px auto 0;box-sizing:border-box}
.mev-cs-gallery__grid{width:100%;max-width:880px;display:grid;gap:8px;overflow:hidden;box-sizing:border-box}
.mev-cs-gallery__cell{margin:0;min-width:0;min-height:0;overflow:hidden}
.mev-cs-gallery__open{display:block;width:100%;height:100%;margin:0;padding:0;border:0;background:transparent;cursor:zoom-in;overflow:hidden}
.mev-cs-gallery__img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.mev-cs-gallery__credit{margin:10px 0 0;font:400 11px/1.35 'General Sans',sans-serif;letter-spacing:.02em;color:inherit;opacity:.68}

/* CENTRAL — Pantoufle G1 grammar: a central dominant image completed by four satellites. */
.mev-cs-gallery--central .mev-cs-gallery__grid{height:750px;grid-template-columns:repeat(12,1fr);grid-template-rows:repeat(2,1fr)}
.mev-cs-gallery--central .mev-cs-gallery__cell--1{grid-column:1/4;grid-row:1}
.mev-cs-gallery--central .mev-cs-gallery__cell--2{grid-column:1/4;grid-row:2}
.mev-cs-gallery--central .mev-cs-gallery__cell--3{grid-column:4/10;grid-row:1/3}
.mev-cs-gallery--central .mev-cs-gallery__cell--4{grid-column:10/13;grid-row:1}
.mev-cs-gallery--central .mev-cs-gallery__cell--5{grid-column:10/13;grid-row:2}

/* LEFT — Pantoufle G2 grammar: one vertical dominant image + four satellites. */
.mev-cs-gallery--left .mev-cs-gallery__grid{height:690px;grid-template-columns:repeat(12,1fr);grid-template-rows:repeat(2,1fr)}
.mev-cs-gallery--left .mev-cs-gallery__cell--1{grid-column:1/6;grid-row:1/3}
.mev-cs-gallery--left .mev-cs-gallery__cell--2{grid-column:6/10;grid-row:1}
.mev-cs-gallery--left .mev-cs-gallery__cell--3{grid-column:10/13;grid-row:1}
.mev-cs-gallery--left .mev-cs-gallery__cell--4{grid-column:6/10;grid-row:2}
.mev-cs-gallery--left .mev-cs-gallery__cell--5{grid-column:10/13;grid-row:2}

/* LANDSCAPE — same closed rectangle, adapted to predominantly horizontal/square evidence. */
.mev-cs-gallery--landscape .mev-cs-gallery__grid{height:620px;grid-template-columns:repeat(12,1fr);grid-template-rows:1.08fr .92fr}
.mev-cs-gallery--landscape .mev-cs-gallery__cell--1{grid-column:1/7;grid-row:1}
.mev-cs-gallery--landscape .mev-cs-gallery__cell--2{grid-column:7/13;grid-row:1}
.mev-cs-gallery--landscape .mev-cs-gallery__cell--3{grid-column:1/5;grid-row:2}
.mev-cs-gallery--landscape .mev-cs-gallery__cell--4{grid-column:5/9;grid-row:2}
.mev-cs-gallery--landscape .mev-cs-gallery__cell--5{grid-column:9/13;grid-row:2}

/* HERO HORIZONTAL — approved Anthèse G1 geometry: relational anchor full-width, hospitality strip below. */
.mev-cs-gallery--hero-horizontal .mev-cs-gallery__grid{height:750px;grid-template-columns:repeat(4,1fr);grid-template-rows:2.15fr 1fr}
.mev-cs-gallery--hero-horizontal .mev-cs-gallery__cell--1{grid-column:1/5;grid-row:1}
.mev-cs-gallery--hero-horizontal .mev-cs-gallery__cell--2{grid-column:1/2;grid-row:2}
.mev-cs-gallery--hero-horizontal .mev-cs-gallery__cell--3{grid-column:2/3;grid-row:2}
.mev-cs-gallery--hero-horizontal .mev-cs-gallery__cell--4{grid-column:3/4;grid-row:2}
.mev-cs-gallery--hero-horizontal .mev-cs-gallery__cell--5{grid-column:4/5;grid-row:2}

/* A6 HYBRID — dominant first, then geometric closure. */
html.mev-cs-gallery-js body.mev-cs-gallery-motion-a6 .mev-cs-gallery:not(.is-gallery-built) .mev-cs-gallery__credit{opacity:0}
html.mev-cs-gallery-js body.mev-cs-gallery-motion-a6 .mev-cs-gallery.is-gallery-built .mev-cs-gallery__credit{opacity:1;transition:opacity 280ms ease}
html.mev-cs-gallery-js body.mev-cs-gallery-motion-a6 .mev-cs-gallery:not(.is-gallery-built) .mev-cs-gallery__cell{opacity:0;clip-path:inset(0 100% 0 0)}
html.mev-cs-gallery-js body.mev-cs-gallery-motion-a6 .mev-cs-gallery__cell.is-gallery-dominant{clip-path:inset(50% 0 50% 0)}
html.mev-cs-gallery-js body.mev-cs-gallery-motion-a6 .mev-cs-gallery__cell.is-gallery-dominant.is-gallery-cell-building{animation:mev-cs-gallery-dominant 1200ms cubic-bezier(.22,1,.36,1) var(--mev-gallery-delay,0ms) forwards}
html.mev-cs-gallery-js body.mev-cs-gallery-motion-a6 .mev-cs-gallery__cell.is-gallery-cell-building:not(.is-gallery-dominant){animation:mev-cs-gallery-cell-ltr 950ms cubic-bezier(.22,1,.36,1) var(--mev-gallery-delay,0ms) forwards}
html.mev-cs-gallery-js body.mev-cs-gallery-motion-a6 .mev-cs-gallery__cell.is-from-right{clip-path:inset(0 0 0 100%)}
html.mev-cs-gallery-js body.mev-cs-gallery-motion-a6 .mev-cs-gallery__cell.is-from-top{clip-path:inset(0 0 100% 0)}
html.mev-cs-gallery-js body.mev-cs-gallery-motion-a6 .mev-cs-gallery__cell.is-from-bottom{clip-path:inset(100% 0 0 0)}
html.mev-cs-gallery-js body.mev-cs-gallery-motion-a6 .mev-cs-gallery__cell.is-from-right.is-gallery-cell-building{animation-name:mev-cs-gallery-cell-rtl}
html.mev-cs-gallery-js body.mev-cs-gallery-motion-a6 .mev-cs-gallery__cell.is-from-top.is-gallery-cell-building{animation-name:mev-cs-gallery-cell-ttb}
html.mev-cs-gallery-js body.mev-cs-gallery-motion-a6 .mev-cs-gallery__cell.is-from-bottom.is-gallery-cell-building{animation-name:mev-cs-gallery-cell-btt}
@keyframes mev-cs-gallery-dominant{from{opacity:0;clip-path:inset(50% 0 50% 0)}to{opacity:1;clip-path:inset(0 0 0 0)}}
@keyframes mev-cs-gallery-cell-ltr{from{opacity:0;clip-path:inset(0 100% 0 0)}to{opacity:1;clip-path:inset(0 0 0 0)}}
@keyframes mev-cs-gallery-cell-rtl{from{opacity:0;clip-path:inset(0 0 0 100%)}to{opacity:1;clip-path:inset(0 0 0 0)}}
@keyframes mev-cs-gallery-cell-ttb{from{opacity:0;clip-path:inset(0 0 100% 0)}to{opacity:1;clip-path:inset(0 0 0 0)}}
@keyframes mev-cs-gallery-cell-btt{from{opacity:0;clip-path:inset(100% 0 0 0)}to{opacity:1;clip-path:inset(0 0 0 0)}}

/* Lightbox — same Pantoufle interaction grammar. */
.mev-cs-lightbox[hidden]{display:none!important}
html.mev-cs-lightbox-open,body.mev-cs-lightbox-open{overflow:hidden!important}
.mev-cs-lightbox{position:fixed;inset:0;z-index:2147483000;display:flex;align-items:center;justify-content:center;background:#F9F9EF;padding:38px 88px 54px;box-sizing:border-box;pointer-events:auto}
.mev-cs-lightbox__stage{position:relative;z-index:2;margin:0;max-width:calc(100vw - 176px);max-height:calc(100vh - 92px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;pointer-events:none}
.mev-cs-lightbox__img{display:block;max-width:min(1280px,calc(100vw - 176px));max-height:calc(100vh - 150px);width:auto;height:auto;margin:0 auto;object-fit:contain;pointer-events:none}
.mev-cs-lightbox__counter{margin:12px 0 0;color:#111;font:500 12px/1.3 'General Sans',sans-serif;letter-spacing:.08em;pointer-events:none}
.mev-cs-lightbox__credit{margin:5px 0 0;color:#111;font:400 11px/1.3 'General Sans',sans-serif;letter-spacing:.03em;opacity:.72;pointer-events:none}
.mev-cs-lightbox__close,.mev-cs-lightbox__prev,.mev-cs-lightbox__next{position:fixed;z-index:4;display:flex;align-items:center;justify-content:center;border:0;background:transparent;color:#111;cursor:pointer;font-family:Arial,sans-serif;pointer-events:auto;touch-action:manipulation}
.mev-cs-lightbox__close{right:22px;top:18px;width:52px;height:52px;font-size:38px;line-height:1}
.mev-cs-lightbox__prev,.mev-cs-lightbox__next{top:50%;width:64px;height:96px;transform:translateY(-50%);font-size:58px;line-height:1}
.mev-cs-lightbox__prev{left:12px}.mev-cs-lightbox__next{right:12px}
.mev-cs-lightbox__close:hover,.mev-cs-lightbox__prev:hover,.mev-cs-lightbox__next:hover{opacity:.68}
.mev-cs-lightbox__close:focus-visible,.mev-cs-lightbox__prev:focus-visible,.mev-cs-lightbox__next:focus-visible,.mev-cs-gallery__open:focus-visible{outline:2px solid #FD0600;outline-offset:2px}

/* Draft witness presentation only. */
.mev-cs-gallery-witness{width:min(100% - 40px,1000px);margin:0 auto;padding:72px 0 100px}
.mev-cs-gallery-witness__head{width:min(100%,880px);margin:0 auto 64px}
.mev-cs-gallery-witness__head p{margin:0 0 12px;font:500 11px/1.3 'General Sans',sans-serif;letter-spacing:.12em}
.mev-cs-gallery-witness__head h1{margin:0;font-family:'Karrik',sans-serif;font-size:clamp(2.2rem,5vw,4.5rem);font-weight:400;line-height:.98}

@media(max-width:700px){
  .mev-cs-gallery{margin-top:40px}
  .mev-cs-gallery__grid{height:600px!important;gap:8px!important;grid-template-columns:repeat(6,1fr)!important;grid-template-rows:repeat(3,1fr)!important}
  .mev-cs-gallery__cell--1{grid-column:1/4!important;grid-row:1/3!important}
  .mev-cs-gallery__cell--2{grid-column:4/7!important;grid-row:1!important}
  .mev-cs-gallery__cell--3{grid-column:4/7!important;grid-row:2!important}
  .mev-cs-gallery__cell--4{grid-column:1/4!important;grid-row:3!important}
  .mev-cs-gallery__cell--5{grid-column:4/7!important;grid-row:3!important}
  .mev-cs-lightbox{padding:16px 8px}
  .mev-cs-lightbox__stage{max-width:calc(100vw - 84px);max-height:calc(100vh - 42px)}
  .mev-cs-lightbox__img{max-width:calc(100vw - 100px);max-height:78vh}
  .mev-cs-lightbox__prev,.mev-cs-lightbox__next{width:42px;font-size:44px}
  .mev-cs-lightbox__prev{left:0}.mev-cs-lightbox__next{right:0}
  .mev-cs-gallery-witness{width:min(100% - 28px,1000px);padding-top:48px}
}

@media(prefers-reduced-motion:reduce){
  html.mev-cs-gallery-js body.mev-cs-gallery-motion-a6 .mev-cs-gallery .mev-cs-gallery__cell,
  html.mev-cs-gallery-js body.mev-cs-gallery-motion-a6 .mev-cs-gallery .mev-cs-gallery__credit{opacity:1!important;clip-path:none!important;animation:none!important;transition:none!important}
}