/* Styles for the "infime" showcase variants. Every rule is scoped under .sc-infime-a, .sc-infime-b, .sc-infime-c. */

/* ---------- still version (no motion / reduced motion), shared by the three ---------- */
.sc-infime-a .sp-still,.sc-infime-b .sp-still,.sc-infime-c .sp-still{display:grid;grid-template-columns:repeat(4,1fr);gap:6vh 3vw;padding:0 var(--gutter)}
.sc-infime-a .sp-still-fig,.sc-infime-b .sp-still-fig,.sc-infime-c .sp-still-fig{margin:0}
.sc-infime-a .sp-still-ph,.sc-infime-b .sp-still-ph,.sc-infime-c .sp-still-ph{display:block;position:relative;overflow:hidden;background:#141110;box-shadow:0 0 0 1px rgba(214,170,120,.14)}
.sc-infime-a .sp-still img,.sc-infime-b .sp-still img,.sc-infime-c .sp-still img{width:100%;height:auto;filter:brightness(.78) contrast(1.05);transition:filter .7s}
.sc-infime-a .sp-still a:hover img,.sc-infime-b .sp-still a:hover img,.sc-infime-c .sp-still a:hover img{filter:brightness(1) contrast(1.02)}
.sc-infime-a .sp-still figcaption,.sc-infime-b .sp-still figcaption,.sc-infime-c .sp-still figcaption{display:flex;gap:12px;margin-top:12px;letter-spacing:.14em}
.sc-infime-a .sp-still figcaption b,.sc-infime-b .sp-still figcaption b,.sc-infime-c .sp-still figcaption b{font-weight:400;color:var(--brass)}
.sc-infime-b .sp-round .sp-still-ph{aspect-ratio:1;border-radius:50%;box-shadow:none;outline:1px solid rgba(201,154,106,.4);outline-offset:7px;max-width:180px;margin:0 auto}
.sc-infime-b .sp-round img{height:100%;object-fit:cover}
.sc-infime-b .sp-round figcaption{justify-content:center;margin-top:22px}
@media (max-width:820px){.sc-infime-a .sp-still,.sc-infime-b .sp-still,.sc-infime-c .sp-still{grid-template-columns:1fr 1fr;gap:5vh 4vw}}

/* ======================================================================
   A · SPÉCIMEN
   ====================================================================== */
.sc-infime-a .spa-stage{position:relative;height:100vh;height:100svh;overflow:hidden;background:radial-gradient(60% 50% at 50% 50%,#14100d 0%,var(--soot) 72%)}
/* faint reticle: the stage is a measuring glass */
.sc-infime-a .spa-stage::before,.sc-infime-a .spa-stage::after{content:"";position:absolute;background:rgba(233,225,212,.05);pointer-events:none}
.sc-infime-a .spa-stage::before{left:50%;top:0;bottom:0;width:1px}
.sc-infime-a .spa-stage::after{top:50%;left:0;right:0;height:1px}
.sc-infime-a .spa-glow{position:absolute;left:50%;top:50%;width:140vh;height:140vh;translate:-50% -50%;pointer-events:none;background:radial-gradient(circle at 50% 50%,rgba(214,150,96,.16),rgba(214,150,96,.05) 30%,rgba(214,150,96,0) 58%)}
.sc-infime-a .spa-spec{position:absolute;left:50%;top:50%;margin:0;z-index:2;background:#141110;pointer-events:none;will-change:transform,opacity}
.sc-infime-a .spa-spec.on{pointer-events:auto}
.sc-infime-a .spa-spec a{display:block;width:100%;height:100%}
.sc-infime-a .spa-spec img{width:100%;height:100%;object-fit:cover}
.sc-infime-a .spa-ring{position:absolute;left:50%;top:50%;translate:-50% -50%;z-index:3;border-radius:50%;border:1px solid rgba(201,154,106,.65);box-shadow:0 0 0 1px rgba(10,9,8,.6),0 0 50px rgba(201,154,106,.12);pointer-events:none}
.sc-infime-a .spa-tag{position:absolute;left:50%;top:50%;z-index:4;display:flex;flex-direction:column;gap:7px;white-space:nowrap;pointer-events:none;color:var(--plaster);letter-spacing:.16em}
.sc-infime-a .spa-tag .spa-x{color:var(--brass);font-size:11px;letter-spacing:.1em}
.sc-infime-a .spa-stage.narrow .spa-tag{top:auto;bottom:6vh;flex-direction:row;gap:18px;align-items:baseline;max-width:84vw;white-space:normal;justify-content:center;text-align:center}
.sc-infime-a .spa-count{position:absolute;left:var(--gutter);bottom:6vh;z-index:4;color:var(--dim)}
.sc-infime-a .spa-count .spa-n{color:var(--plaster)}
.sc-infime-a .spa-rail{position:absolute;right:var(--gutter);top:50%;translate:0 -50%;z-index:4;height:26vh;width:9px;display:flex;flex-direction:column;justify-content:space-between;align-items:center;pointer-events:none}
.sc-infime-a .spa-rail::before{content:"";position:absolute;left:4px;top:0;bottom:0;width:1px;background:var(--line)}
.sc-infime-a .spa-fill{position:absolute;left:4px;top:0;bottom:0;width:1px;background:var(--brass);transform-origin:top;transform:scaleY(0)}
.sc-infime-a .spa-rail b{position:relative;width:5px;height:5px;border-radius:50%;border:1px solid rgba(233,225,212,.35);background:var(--soot);transition:background .4s,border-color .4s,transform .4s var(--ease)}
.sc-infime-a .spa-rail b.on{background:var(--brass);border-color:var(--brass);transform:scale(1.5)}
@media (max-width:720px){
  .sc-infime-a .spa-count{bottom:auto;top:10vh;left:var(--gutter)}
  .sc-infime-a .spa-rail{height:22vh}
}

/* ======================================================================
   B · LOUPE
   ====================================================================== */
.sc-infime-b .spb-stage{--L:300px;--W:115px;position:relative;height:100vh;height:100svh;overflow:hidden;background:radial-gradient(80% 70% at 50% 50%,#120f0d 0%,var(--soot) 75%)}
.sc-infime-b .spb-field{position:absolute;inset:0;z-index:1}
.sc-infime-b .spb-pin{position:absolute;display:block;width:var(--W);height:calc(var(--W) * var(--ar,1.5));translate:-50% -50%;opacity:.8;transition:opacity .9s var(--ease)}
.sc-infime-b .spb-field.on .spb-pin{opacity:.48}
.sc-infime-b .spb-field .spb-pin.cur,.sc-infime-b .spb-field .spb-pin:hover{opacity:1}
.sc-infime-b .spb-ph{position:absolute;left:0;top:50%;width:var(--W);height:var(--W);translate:0 -50%;display:block;border-radius:50%;overflow:hidden;background:#141110}
.sc-infime-b .spb-ph img{width:100%;height:100%;object-fit:cover;filter:brightness(.72) contrast(1.05);transition:filter .7s}
.sc-infime-b .spb-pin:hover .spb-ph img{filter:brightness(1) contrast(1.02)}
.sc-infime-b .spb-pin::before{content:"";position:absolute;left:50%;top:50%;width:calc(var(--W) + 16px);height:calc(var(--W) + 16px);translate:-50% -50%;border-radius:50%;border:1px solid rgba(201,154,106,.42);transition:border-color .5s,transform .6s var(--ease)}
.sc-infime-b .spb-pin:hover::before{border-color:rgba(201,154,106,.95)}
.sc-infime-b .spb-n{position:absolute;left:calc(50% + var(--W) / 2 + 14px);top:50%;translate:0 -50%;font:400 9px/1 var(--mono);letter-spacing:.2em;color:var(--dim);font-style:normal}
/* the copy of the field that lives under the glass: whole rectangles, bright */
.sc-infime-b .spb-cl{opacity:1 !important;pointer-events:none}
.sc-infime-b .spb-cl::before{display:none}
.sc-infime-b .spb-cl .spb-ph{top:0;height:100%;translate:0 0;border-radius:0;box-shadow:0 0 0 1px rgba(214,170,120,.18)}
.sc-infime-b .spb-cl .spb-ph img{filter:brightness(1.02) contrast(1.04)}
.sc-infime-b .spb-veil{position:absolute;left:0;top:0;width:4000px;height:4000px;z-index:2;pointer-events:none;background:radial-gradient(circle at 50% 50%,rgba(10,9,8,0) calc(var(--L) * .55),rgba(10,9,8,.5) calc(var(--L) * 2.4),rgba(10,9,8,.72) 100%)}
.sc-infime-b .spb-loupe{position:absolute;left:0;top:0;z-index:3;display:block;width:var(--L);height:var(--L);border-radius:50%;will-change:transform}
.sc-infime-b .spb-glass{position:absolute;inset:0;display:block;border-radius:50%;overflow:hidden;background:#070606;transform:translateZ(0)}
.sc-infime-b .spb-clone{position:absolute;left:0;top:0;display:block;transform-origin:0 0;will-change:transform}
.sc-infime-b .spb-hl{position:absolute;inset:0;display:block;border-radius:50%;pointer-events:none;
  box-shadow:0 0 0 1px var(--brass),0 0 0 2px rgba(10,9,8,.7),0 50px 100px -30px rgba(0,0,0,.95),inset 0 0 0 1px rgba(255,255,255,.06),inset 0 0 70px rgba(0,0,0,.28);
  background:radial-gradient(circle at 31% 24%,rgba(255,255,255,.14),rgba(255,255,255,0) 38%),radial-gradient(circle at 70% 80%,rgba(255,255,255,.04),rgba(255,255,255,0) 30%);transition:box-shadow .5s}
.sc-infime-b .spb-loupe:hover .spb-hl{box-shadow:0 0 0 1px var(--plaster),0 0 0 2px rgba(10,9,8,.7),0 50px 100px -30px rgba(0,0,0,.95),inset 0 0 0 1px rgba(255,255,255,.08),inset 0 0 70px rgba(0,0,0,.2)}
.sc-infime-b .spb-loupe::after{content:"";position:absolute;inset:-12px;border-radius:50%;border:1px dashed rgba(201,154,106,.32);pointer-events:none;animation:spb-turn 90s linear infinite}
@keyframes spb-turn{to{transform:rotate(360deg)}}
.sc-infime-b .spb-cap{position:absolute;left:0;top:0;z-index:4;pointer-events:none;display:flex;flex-direction:column;gap:7px;white-space:nowrap;letter-spacing:.16em;color:var(--plaster);text-transform:lowercase}
.sc-infime-b .spb-cap b{font-weight:400;color:var(--brass);letter-spacing:.2em}
.sc-infime-b .spb-stage.narrow .spb-cap{white-space:normal;text-align:center;max-width:72vw;align-items:center}
.sc-infime-b .spb-count{position:absolute;left:var(--gutter);bottom:6vh;z-index:4;color:var(--dim)}
.sc-infime-b .spb-count .spb-n2{color:var(--plaster)}
@media (max-width:720px){
  .sc-infime-b .spb-count{bottom:auto;top:10vh}
  .sc-infime-b .spb-n{display:none}
}

/* ======================================================================
   C · SOUFFLE
   ====================================================================== */
.sc-infime-c .spc-stage{position:relative;height:100vh;height:100svh;overflow:hidden;background:radial-gradient(55% 50% at 50% 50%,#16110e 0%,var(--soot) 74%)}
.sc-infime-c .spc-ring{position:absolute;left:50%;top:50%;z-index:3;width:min(94vh,98vw);aspect-ratio:1;border-radius:50%;border:1px solid rgba(201,154,106,.14);pointer-events:none;will-change:transform}
.sc-infime-c .spc-ring i{position:absolute;left:50%;top:-1px;width:1px;height:16px;margin-left:-.5px;background:var(--brass);opacity:.85}
.sc-infime-c .spc-ring::before{content:"";position:absolute;inset:-1px;border-radius:50%;
  background:repeating-conic-gradient(from -0.07deg,rgba(201,154,106,.7) 0 0.14deg,transparent 0.14deg 15deg);
  -webkit-mask:radial-gradient(circle closest-side,transparent calc(100% - 10px),#000 calc(100% - 9px));mask:radial-gradient(circle closest-side,transparent calc(100% - 10px),#000 calc(100% - 9px));opacity:.6}
.sc-infime-c .spc-fig{position:absolute;left:50%;top:50%;margin:0;z-index:1;height:min(78vh,calc(86vw * var(--h) / var(--w)));aspect-ratio:var(--w) / var(--h);pointer-events:none;will-change:transform,opacity,filter}
.sc-infime-c .spc-fig.on{pointer-events:auto}
.sc-infime-c .spc-fig a{position:relative;display:block;width:100%;height:100%;overflow:hidden;background:#141110;box-shadow:0 0 0 1px rgba(214,170,120,.12),0 70px 120px -50px rgba(0,0,0,.9)}
.sc-infime-c .spc-fig img{width:100%;height:100%;object-fit:cover;filter:brightness(.9) contrast(1.04);animation:spc-breathe 26s ease-in-out infinite alternate;animation-delay:var(--d,0s);transition:filter .8s}
.sc-infime-c .spc-fig a:hover img{filter:brightness(1.02) contrast(1.02)}
@keyframes spc-breathe{from{transform:scale(1.02) translate(0,0)}to{transform:scale(1.1) translate(-1.4%,.9%)}}
.sc-infime-c .spc-fig a::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(70% 70% at 50% 50%,rgba(10,9,8,0) 48%,rgba(10,9,8,.62) 100%)}
.sc-infime-c .spc-vig{position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(80% 80% at 50% 50%,rgba(10,9,8,0) 40%,rgba(10,9,8,.5) 100%)}
.sc-infime-c .spc-cap{position:absolute;left:50%;bottom:6vh;translate:-50% 0;z-index:4;margin:0;text-align:center;letter-spacing:.3em;text-transform:lowercase;color:var(--plaster);max-width:80vw;pointer-events:none}
.sc-infime-c .spc-count{position:absolute;right:var(--gutter);bottom:6vh;z-index:4;display:flex;align-items:center;gap:12px;color:var(--dim)}
.sc-infime-c .spc-count .spc-k{margin-right:6px}
.sc-infime-c .spc-count .spc-n{color:var(--plaster)}
.sc-infime-c .spc-count i{position:relative;width:64px;height:1px;background:var(--line2);overflow:hidden}
.sc-infime-c .spc-count i::after{content:"";position:absolute;inset:0;background:var(--brass);transform-origin:left;transform:scaleX(var(--p,0))}
@media (max-width:720px){
  .sc-infime-c .spc-count{bottom:auto;top:10vh;right:auto;left:var(--gutter)}
  .sc-infime-c .spc-count .spc-k{display:none}
  .sc-infime-c .spc-cap{bottom:5vh;letter-spacing:.22em}
}
@media (prefers-reduced-motion:reduce){
  .sc-infime-b .spb-loupe::after,.sc-infime-c .spc-fig img{animation:none}
}

/* ======================================================================
   Second round — D · Planche, E · Lumière, F · Diptyques. Scoped under .sc-infime-d / -e / -f.
   No stage, no instrument: the pictures, the dark around them, a few hairlines.
   ====================================================================== */

/* ---------------------------------------------------------------------
   D · PLANCHE — a 12-column sheet; one world, seven details, a brass thread
   --------------------------------------------------------------------- */
.sc-infime-d .spd-sheet{position:relative;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:0 2vw;align-items:start;padding:0 var(--gutter)}
.sc-infime-d .spd-fig{position:relative;z-index:1;margin:0;min-width:0;will-change:transform,opacity}
.sc-infime-d .spd-ph{position:relative;display:block;overflow:hidden;background:#141110;box-shadow:0 0 0 1px rgba(214,170,120,.12)}
.sc-infime-d .spd-ph img{display:block;width:100%;height:auto;filter:brightness(.86) contrast(1.04);transition:filter 1.1s var(--ease)}
.sc-infime-d .spd-ph:hover img{filter:brightness(1) contrast(1.02)}
.sc-infime-d .spd-cap{display:block;margin:10px 0 0;font-size:9px;letter-spacing:.18em;text-transform:lowercase;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* the world: 8 columns, 80 vh, a wide window on a tall picture, the settle is on the image itself */
.sc-infime-d .spd-fig[data-p="0"]{grid-column:1/9;grid-row:1}
.sc-infime-d .spd-fig[data-p="0"] .spd-ph{height:80vh;height:80svh}
.sc-infime-d .spd-fig[data-p="0"] .spd-ph img{height:100%;object-fit:cover;filter:brightness(.92) contrast(1.03);transform-origin:50% 50%;will-change:transform}
.sc-infime-d .spd-fig[data-p="0"] .spd-cap{font-size:10px}
/* the details */
.sc-infime-d .spd-fig[data-p="7"]{grid-column:11;grid-row:1;align-self:end;width:120px;margin-bottom:10vh}
.sc-infime-d .spd-fig[data-p="1"]{grid-column:2/5;grid-row:2;margin-top:18vh}
.sc-infime-d .spd-fig[data-p="5"]{grid-column:7/9;grid-row:2;margin-top:30vh}
.sc-infime-d .spd-fig[data-p="2"]{grid-column:12;grid-row:2;justify-self:end;width:120px;margin-top:6vh}
.sc-infime-d .spd-fig[data-p="6"]{grid-column:4/6;grid-row:3;margin-top:12vh}
.sc-infime-d .spd-fig[data-p="4"]{grid-column:8;grid-row:3;width:120px;margin-top:34vh}
.sc-infime-d .spd-fig[data-p="3"]{grid-column:11/13;grid-row:3;margin-top:6vh;margin-bottom:4vh}
/* the thread: one brass hairline, grid line 10, drawn from the top of the sheet to its foot */
.sc-infime-d .spd-thread{grid-column:10;grid-row:1/4;justify-self:start;align-self:stretch;z-index:0;width:1px;margin-left:-1vw;pointer-events:none;
  background:linear-gradient(to bottom,rgba(201,154,106,0),rgba(201,154,106,.85) 6%,rgba(201,154,106,.85) 94%,rgba(201,154,106,0));transform-origin:top;transform:scaleY(0);will-change:transform}
.sc-infime-d .spd-thread::after{content:"";position:absolute;left:-2px;bottom:-2px;width:5px;height:5px;border-radius:50%;background:var(--brass);box-shadow:0 0 14px rgba(201,154,106,.6)}
.sc-infime-d .is-static .spd-thread{transform:none}
@media (max-width:720px){
  .sc-infime-d .spd-sheet{grid-template-columns:repeat(6,minmax(0,1fr));gap:0 3vw}
  .sc-infime-d .spd-fig[data-p="0"]{grid-column:1/7}
  .sc-infime-d .spd-fig[data-p="0"] .spd-ph{height:64vh;height:64svh}
  .sc-infime-d .spd-fig[data-p="7"]{grid-column:5/7;grid-row:2;align-self:start;justify-self:end;width:96px;margin:9vh 0 0}
  .sc-infime-d .spd-fig[data-p="1"]{grid-column:1/4;grid-row:2;margin-top:12vh}
  .sc-infime-d .spd-fig[data-p="5"]{grid-column:4/7;grid-row:3;margin-top:10vh}
  .sc-infime-d .spd-fig[data-p="2"]{grid-column:1/3;grid-row:3;justify-self:start;width:96px;margin-top:26vh}
  .sc-infime-d .spd-fig[data-p="6"]{grid-column:1/4;grid-row:4;margin-top:10vh}
  .sc-infime-d .spd-fig[data-p="4"]{grid-column:5/7;grid-row:4;justify-self:end;width:96px;margin-top:24vh}
  .sc-infime-d .spd-fig[data-p="3"]{grid-column:3/6;grid-row:5;margin-top:9vh;margin-bottom:2vh}
  .sc-infime-d .spd-thread{grid-column:4;grid-row:1/6;margin-left:-1.5vw}
}

/* ---------------------------------------------------------------------
   E · LUMIÈRE — the light table
   --------------------------------------------------------------------- */
.sc-infime-e .spe-table{--H:56vh;--H:56svh;position:relative}
.sc-infime-e .spe-table::before{content:"";position:absolute;left:0;right:0;top:0;bottom:11vh;pointer-events:none;
  background:linear-gradient(to bottom,rgba(214,150,96,0),rgba(214,150,96,.045) 35%,rgba(214,150,96,.06) 60%,rgba(214,150,96,0));border-top:1px solid rgba(233,225,212,.05);border-bottom:1px solid rgba(233,225,212,.07)}
.sc-infime-e .spe-row{position:relative;display:flex;align-items:flex-start;gap:clamp(28px,4vw,72px);padding:12vh calc(50% - var(--H) * .3333) 6vh;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scrollbar-width:none;touch-action:pan-x pan-y}
.sc-infime-e .spe-row::-webkit-scrollbar{display:none}
body:not(.has-cursor) .sc-infime-e .spe-row{cursor:grab}
body:not(.has-cursor) .sc-infime-e .spe-row.is-drag{cursor:grabbing}
.sc-infime-e .spe-row.is-drag .spe-ph{pointer-events:none}
.sc-infime-e .spe-slide{position:relative;flex:none;margin:0;width:calc(var(--H) * var(--w) / var(--h));user-select:none;-webkit-user-select:none}
.sc-infime-e .spe-halo{position:absolute;left:50%;top:50%;z-index:0;width:190%;height:136%;translate:-50% -53%;pointer-events:none;border-radius:50%;
  background:radial-gradient(closest-side,rgba(228,170,110,.5),rgba(228,170,110,.16) 46%,rgba(228,170,110,0) 100%);opacity:calc(.22 + var(--near) * .78);will-change:opacity}
.sc-infime-e .spe-ph{position:relative;z-index:1;display:block;height:var(--H);overflow:hidden;background:#141110;box-shadow:0 0 0 1px rgba(214,170,120,calc(.14 + var(--near) * .3)),0 30px 70px -30px rgba(0,0,0,.9);transform:scale(calc(.965 + var(--near) * .035));transform-origin:50% 100%;will-change:transform}
.sc-infime-e .spe-ph img{display:block;width:100%;height:100%;object-fit:cover;filter:brightness(calc(.58 + var(--near) * .44)) contrast(1.04);will-change:filter}
.sc-infime-e .spe-ph::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(to bottom,rgba(255,255,255,.05),rgba(255,255,255,0) 18%)}
.sc-infime-e .spe-cap{position:relative;z-index:1;display:flex;gap:12px;align-items:baseline;margin:16px 0 0;font-size:9px;letter-spacing:.18em;text-transform:lowercase;white-space:nowrap;opacity:calc(.45 + var(--near) * .55)}
.sc-infime-e .spe-cap b{font-weight:400;color:var(--brass);letter-spacing:.2em}
.sc-infime-e .spe-cap span{color:var(--plaster)}
.sc-infime-e .spe-cap em{font-style:normal;color:var(--dim)}
.sc-infime-e .spe-foot{display:flex;flex-direction:column;gap:14px;padding:0 var(--gutter)}
.sc-infime-e .spe-bar{position:relative;height:1px;background:var(--line)}
.sc-infime-e .spe-fill{position:absolute;inset:0;background:var(--brass);transform-origin:left;transform:scaleX(0);box-shadow:0 0 10px rgba(201,154,106,.35)}
.sc-infime-e .spe-hint{margin:0;text-align:right;color:var(--dim)}
/* still: native scroll-snap, no drift, no drag */
.sc-infime-e .is-static .spe-row{scroll-snap-type:x mandatory;cursor:auto !important;scroll-behavior:smooth}
.sc-infime-e .is-static .spe-slide{scroll-snap-align:center}
@media (max-width:720px){
  .sc-infime-e .spe-table{--H:50vh;--H:50svh}
  .sc-infime-e .spe-row{gap:7vw;padding-top:9vh;padding-bottom:5vh}
  .sc-infime-e .spe-cap{white-space:normal}
  .sc-infime-e .spe-hint{text-align:left}
}

/* ---------------------------------------------------------------------
   F · DIPTYQUES — three pairs, a world and a detail
   --------------------------------------------------------------------- */
.sc-infime-f .spf-stack{padding:0 var(--gutter)}
.sc-infime-f .spf-pair{position:relative;margin:0 0 26vh}
.sc-infime-f .spf-pair:last-child{margin-bottom:6vh}
.sc-infime-f .spf-duo{display:flex;align-items:flex-end;padding-left:var(--inset,0)}
.sc-infime-f .r .spf-duo{flex-direction:row-reverse;padding-left:0;padding-right:var(--inset,0)}
.sc-infime-f .top .spf-duo{align-items:flex-start}
.sc-infime-f .spf-big,.sc-infime-f .spf-small{position:relative;flex:none;aspect-ratio:var(--w)/var(--h);will-change:transform}
.sc-infime-f .spf-big{z-index:1;height:min(76vh,46vw);height:min(76svh,46vw)}
.sc-infime-f .spf-small{z-index:2;height:min(27vh,16vw);height:min(27svh,16vw);margin-left:-14px}
.sc-infime-f .r .spf-small{margin-left:0;margin-right:-14px}
.sc-infime-f .spf-frame{position:relative;display:block;width:100%;height:100%;overflow:hidden;background:#141110;box-shadow:0 0 0 1px rgba(214,170,120,.14),0 50px 90px -40px rgba(0,0,0,.95);will-change:transform,opacity}
.sc-infime-f .spf-small .spf-frame{box-shadow:0 0 0 1px rgba(214,170,120,.3),0 0 0 7px var(--soot),0 30px 60px -20px rgba(0,0,0,.9)}
.sc-infime-f .spf-frame img{display:block;width:100%;height:100%;object-fit:cover;filter:brightness(.88) contrast(1.04);transition:filter 1s var(--ease)}
.sc-infime-f .spf-frame:hover img{filter:brightness(1) contrast(1.02)}
.sc-infime-f .spf-cap{margin:26px 0 0 var(--inset,0);max-width:min(100%,560px)}
.sc-infime-f .r .spf-cap{margin:26px var(--inset,0) 0 auto;text-align:right}
.sc-infime-f .spf-hair{display:block;height:1px;width:min(100%,360px);background:linear-gradient(90deg,var(--brass),rgba(201,154,106,.25));transform-origin:left;transform:scaleX(0)}
.sc-infime-f .r .spf-hair{margin-left:auto;transform-origin:right;background:linear-gradient(270deg,var(--brass),rgba(201,154,106,.25))}
.sc-infime-f .spf-t{display:block;margin-top:14px;font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(22px,2.2vw,32px);line-height:1.1;letter-spacing:-.01em;color:var(--plaster)}
.sc-infime-f .spf-t i{font-style:normal;color:var(--brass);padding:0 .1em}
.sc-infime-f .is-static .spf-hair{transform:none}
@media (max-width:720px){
  .sc-infime-f .spf-pair{margin-bottom:14vh}
  .sc-infime-f .spf-duo{padding-left:0 !important;padding-right:0 !important}
  .sc-infime-f .spf-big{height:min(56vh,100vw);height:min(56svh,100vw)}
  .sc-infime-f .spf-small{height:min(20vh,36vw);height:min(20svh,36vw);margin-left:-22px}
  .sc-infime-f .r .spf-small{margin-left:0;margin-right:-22px}
  .sc-infime-f .spf-cap,.sc-infime-f .r .spf-cap{margin:18px 0 0}
  .sc-infime-f .spf-hair{width:min(100%,200px)}
}

/* ======================================================================
   Third round — G · Plein cadre, H · Cinéma, I · Fragments. Scoped under .sc-infime-g / -h / -i.
   Big pictures, bold type, motion that belongs to the photographs.
   ====================================================================== */

/* ---------------------------------------------------------------------
   G · PLEIN CADRE — six full-bleed windows, a huge word rising behind each
   --------------------------------------------------------------------- */
.sc-infime-g .sc-title{font-size:clamp(72px,13vw,220px);line-height:.86;letter-spacing:-.03em}
.sc-infime-g .spg-reel{padding-top:12vw}
.sc-infime-g .spg-fig{position:relative;margin:0 0 30vh}
.sc-infime-g .spg-fig:last-child{margin-bottom:6vh}
.sc-infime-g .spg-word{position:absolute;top:0;left:var(--gutter);z-index:0;margin:0;font-family:var(--serif);font-weight:400;font-size:22vw;line-height:.8;letter-spacing:-.035em;color:var(--plaster);opacity:.92;white-space:nowrap;pointer-events:none;transform:translateY(-30%);will-change:transform}
.sc-infime-g .r .spg-word{left:auto;right:var(--gutter)}
.sc-infime-g .spg-ph{position:relative;z-index:1;display:block;width:100%;height:calc(var(--hd) * 1vh);height:calc(var(--hd) * 1svh);overflow:hidden;background:#0d0b0a;will-change:clip-path}
.sc-infime-g .spg-ph img{display:block;width:100%;height:100%;object-fit:cover;object-position:var(--pos,50% 50%);filter:brightness(.92) contrast(1.03);transition:filter 1s var(--ease);will-change:transform}
.sc-infime-g .spg-ph:hover img{filter:brightness(1) contrast(1.02)}
.sc-infime-g .spg-cap{position:absolute;left:var(--gutter);top:100%;z-index:2;display:flex;gap:14px;align-items:baseline;margin:16px 0 0;letter-spacing:.16em;color:var(--dim)}
.sc-infime-g .r .spg-cap{left:auto;right:var(--gutter);text-align:right}
.sc-infime-g .spg-cap b{font-weight:400;color:var(--brass)}
.sc-infime-g .spg-cap span{color:var(--plaster)}
.sc-infime-g .spg-cap em{font-family:var(--serif);font-style:italic;font-size:14px;letter-spacing:.02em;text-transform:none;color:var(--dim)}
.sc-infime-g .is-static .spg-word{transform:translateY(-62%)}
@media (max-width:720px){
  .sc-infime-g .spg-reel{padding-top:22vw}
  .sc-infime-g .spg-fig{margin-bottom:20vh}
  .sc-infime-g .spg-word{font-size:28vw}
  .sc-infime-g .spg-ph{height:calc(var(--hm) * 1vh);height:calc(var(--hm) * 1svh)}
  .sc-infime-g .spg-cap{margin-top:12px;flex-wrap:wrap;gap:6px 12px;max-width:calc(100% - 2 * var(--gutter))}
  .sc-infime-g .r .spg-cap{justify-content:flex-end}
}

/* ---------------------------------------------------------------------
   H · CINÉMA — one pinned letterbox, the pictures pass through it
   --------------------------------------------------------------------- */
.sc-infime-h .sc-title{font-size:clamp(88px,16vw,260px);line-height:.85;letter-spacing:-.03em}
.sc-infime-h .sph-stage{position:relative;display:flex;flex-direction:column;justify-content:center;height:100vh;height:100svh;padding:0 var(--gutter);box-sizing:border-box}
.sc-infime-h .sph-frame{position:relative;display:block;width:100%;max-width:calc((100vh - 200px) * 21 / 9);max-width:calc((100svh - 200px) * 21 / 9);margin:0 auto;aspect-ratio:21/9;overflow:hidden;background:#0d0b0a;box-shadow:0 0 0 1px rgba(214,170,120,.14),0 70px 140px -50px rgba(0,0,0,.95)}
.sc-infime-h .sph-frame::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(to bottom,rgba(10,9,8,.16),rgba(10,9,8,0) 20%,rgba(10,9,8,0) 78%,rgba(10,9,8,.26))}
.sc-infime-h .sph-reel{position:absolute;inset:0}
.sc-infime-h .sph-cell{position:absolute;inset:0;display:block;overflow:hidden;background:#0d0b0a;will-change:transform,opacity}
.sc-infime-h .sph-cell img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.94) contrast(1.03);will-change:transform}
.sc-infime-h .sph-link{position:absolute;inset:0;z-index:3;display:block}
.sc-infime-h .sph-strip{width:100%;max-width:calc((100vh - 200px) * 21 / 9);max-width:calc((100svh - 200px) * 21 / 9);margin:18px auto 0}
.sc-infime-h .sph-row{display:flex;justify-content:space-between;align-items:baseline;gap:24px}
.sc-infime-h .sph-nums{display:flex;flex-wrap:wrap;gap:clamp(10px,1.4vw,22px);letter-spacing:.18em}
.sc-infime-h .sph-nums span{color:var(--dim);opacity:.5;transition:color .5s,opacity .5s}
.sc-infime-h .sph-nums span.on{color:var(--brass);opacity:1}
.sc-infime-h .sph-cap{display:flex;gap:14px;align-items:baseline;justify-content:flex-end;text-align:right;min-height:1em}
.sc-infime-h .sph-title{font-family:var(--serif);font-weight:400;font-size:clamp(22px,2.2vw,34px);line-height:1;color:var(--plaster)}
.sc-infime-h .sph-meta{color:var(--dim)}
.sc-infime-h .sph-rule{position:relative;height:1px;margin-top:14px;background:var(--line)}
.sc-infime-h .sph-rule i{position:absolute;inset:0;background:var(--brass);transform-origin:left;transform:scaleX(0);box-shadow:0 0 10px rgba(201,154,106,.35)}
/* still: the letterboxes stacked */
.sc-infime-h .sph-still{display:flex;flex-direction:column;gap:9vh;padding:0 var(--gutter)}
.sc-infime-h .sph-sfig{margin:0}
.sc-infime-h .sph-sfig .sph-frame{max-width:none}
.sc-infime-h .sph-sfig .sph-strip{max-width:none}
.sc-infime-h .sph-sfig .sph-frame:hover img{filter:brightness(1) contrast(1.02)}
@media (max-width:720px){
  .sc-infime-h .sph-frame,.sc-infime-h .sph-strip{max-width:calc((100vh - 170px) * 4 / 5);max-width:calc((100svh - 170px) * 4 / 5)}
  .sc-infime-h .sph-frame{aspect-ratio:4/5}
  .sc-infime-h .sph-row{flex-direction:column;align-items:flex-start;gap:10px}
  .sc-infime-h .sph-cap{justify-content:flex-start;text-align:left}
  .sc-infime-h .sph-still{gap:7vh}
}

/* ---------------------------------------------------------------------
   I · FRAGMENTS — the grid of details, each opening onto its world
   --------------------------------------------------------------------- */
.sc-infime-i .sc-title{font-size:clamp(72px,14vw,240px);line-height:.86;letter-spacing:-.03em}
.sc-infime-i .spi-grid{display:flex;flex-direction:column;gap:2px;will-change:transform}
.sc-infime-i .spi-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px;will-change:transform}
.sc-infime-i .spi-tile{position:relative;display:block;aspect-ratio:1;overflow:hidden;background:#0c0a09}
.sc-infime-i .spi-ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;overflow:hidden}
.sc-infime-i .spi-ph img{display:block;flex:none;transform-origin:var(--ox,50%) var(--oy,50%);transform:translate(var(--tx,0),var(--ty,0)) scale(var(--s,2.4));filter:brightness(.9) contrast(1.05);transition:transform .9s var(--ease-in-out),filter .9s var(--ease-in-out);will-change:transform;backface-visibility:hidden}
.sc-infime-i .port img{height:100%;width:auto}
.sc-infime-i .land img{width:100%;height:auto}
.sc-infime-i .spi-t{position:absolute;left:18px;right:18px;bottom:16px;z-index:2;display:flex;gap:12px;align-items:baseline;opacity:0;transform:translateY(8px);transition:opacity .6s var(--ease) .25s,transform .6s var(--ease) .25s;pointer-events:none;font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);text-shadow:0 1px 12px rgba(0,0,0,.9),0 0 2px rgba(0,0,0,.8)}
.sc-infime-i .spi-t b{font-weight:400;color:var(--brass)}
.sc-infime-i .spi-t span{font-family:var(--serif);font-size:clamp(20px,1.7vw,26px);letter-spacing:0;text-transform:none;color:var(--plaster)}
.sc-infime-i .spi-tile.open img,.sc-infime-i .spi-tile:focus-visible img{transform:none;filter:brightness(1) contrast(1.02)}
.sc-infime-i .spi-tile.open .spi-t,.sc-infime-i .spi-tile:focus-visible .spi-t{opacity:1;transform:none}
@media (hover:hover){
  .sc-infime-i .spi-tile:hover img{transform:none;filter:brightness(1) contrast(1.02)}
  .sc-infime-i .spi-tile:hover .spi-t{opacity:1;transform:none}
}
.sc-infime-i .spi-hint{margin:16px var(--gutter) 0;text-align:right;color:var(--dim)}
@media (max-width:720px){
  .sc-infime-i .spi-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sc-infime-i .spi-t{left:12px;right:12px;bottom:10px}
}
@media (prefers-reduced-motion:reduce){
  .sc-infime-i .spi-ph img,.sc-infime-i .spi-t{transition:none}
}
