:root{
    --bg:#0a0a0a; --bg-2:#101010;
    --paper:#f4f1ea; --paper-2:#ebe7dd;
    --ink:#16140f;
    --fg:#f4f1ea;
    --muted:rgba(244,241,234,.62); --quiet:rgba(244,241,234,.40);
    --muted-l:rgba(22,20,15,.66); --quiet-l:rgba(22,20,15,.40);
    --line:rgba(244,241,234,.14); --line-l:rgba(22,20,15,.12);
    --accent:#b8a47a;
    --accent-2:#8c7757;
    --chrome:#d5cdb8;
    --ease:cubic-bezier(.23,1,.32,1);
    --font:'Neue Haas Grotesk Display','Söhne','Avenir Next','Helvetica Neue',Arial,system-ui,sans-serif;
    --mono:'JetBrains Mono','IBM Plex Mono','SFMono-Regular',ui-monospace,Menlo,monospace;
    --maxw:1540px;
  }
  *{box-sizing:border-box}
  html{background:var(--bg);scroll-behavior:smooth;overflow-x:hidden}
  body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--font);-webkit-font-smoothing:antialiased;text-rendering:geometricPrecision;overflow-x:hidden}
  img{display:block;max-width:100%;height:auto}
  a,button{font:inherit;color:inherit}
  a{text-decoration:none}
  button{border:0;background:transparent;cursor:pointer;font:inherit}
  ::selection{background:var(--accent);color:var(--ink)}
  h1,h2,h3,h4{margin:0;font-weight:900;letter-spacing:-.055em}
  p{margin:0}

  body:before{content:"";position:fixed;inset:-18%;z-index:80;pointer-events:none;opacity:.04;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 220 220' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.72' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");mix-blend-mode:screen}
  @keyframes grain{50%{transform:translate3d(1.2%,-1%,0)}}

  img[loading="lazy"]{opacity:0;transform:scale(1.018);transition:opacity .9s var(--ease),transform 1.6s var(--ease)}
  img[loading="lazy"].is-loaded{opacity:1;transform:scale(1)}
  @media (prefers-reduced-motion:reduce){
    img[loading="lazy"]{transition:opacity .3s linear;transform:none}
  }

  main{position:relative;z-index:2}
  section{position:relative}
  .section-inner{max-width:var(--maxw);margin:0 auto;padding:clamp(80px,11vw,160px) clamp(22px,5vw,76px)}

  /* ============ HERO — KEN BURNS + SOFT-FOCUS IRIS + BOKEH FLARE ============
     Crossfade-Slideshow ohne clip-path/Wipe-Kante. Pro Slide:
       1) Ken-Burns (langsamer Zoom/Pan, drei Richtungsvarianten)
       2) Soft-Focus-Iris als ::after — gleiches Bild stark unscharf,
          radial ausgespart; die Schärfe-Apertur wandert via @property-
          getriebenen --iris-x/--iris-y (eine CSS-Quelle).
       3) Bokeh-Flare-Video Overlay mit mix-blend-mode:screen — der schwarze
          Hintergrund des Footage fällt automatisch weg; hue-rotate warmt
          den Bokeh zu Bronze/Amber. Eigene langsame transform-Drift.
     Genau eine setInterval-Quelle treibt nur den Active-Toggle;
     alle anderen Bewegungen sind CSS-Loops. */
  @property --iris-x{ syntax:'<percentage>'; inherits:true; initial-value:55% }
  @property --iris-y{ syntax:'<percentage>'; inherits:true; initial-value:42% }

  .hero-mp{position:relative;height:100svh;max-height:100svh;overflow:hidden;background:#050505;color:var(--fg);
    --patina:color-mix(in oklch, var(--accent) 62%, oklch(36% .08 42));
    --bronze:color-mix(in oklch, var(--accent-2) 72%, oklch(48% .06 60));
    --iris-x:55%; --iris-y:42%;
  }
  .hero-mp.is-animated{animation:mpIrisDrift 26s ease-in-out infinite alternate}
  @keyframes mpIrisDrift{
    0%   { --iris-x:46%; --iris-y:38% }
    33%  { --iris-x:62%; --iris-y:46% }
    66%  { --iris-x:54%; --iris-y:40% }
    100% { --iris-x:60%; --iris-y:50% }
  }
  .hero-mp__stage{position:absolute;inset:0;z-index:1;background:#040404}

  /* Slide system — diagonaler clip-path Page-Turn (zurück) + ruhiger Ken Burns.
     Active-Slide steht zunächst voll sichtbar als Polygon mit voller Fläche;
     wird Slide inaktiv, läuft sein clip-path zur rechten Kante zusammen
     (Page-Turn). Der nachfolgende Slide liegt darunter und wird sofort sichtbar.
     Ken Burns ist sehr subtil (kein Translate, nur leichter Zoom) damit nichts
     mehr "hackelt". Drei minimale Varianten für leichte Wiederholungsvermeidung. */
  .hero-mp__slides{position:absolute;inset:0;z-index:1}
  .hero-mp__slide{position:absolute;inset:0;
    background-image:var(--hero-bg-desktop,none);
    background-size:cover;background-position:center 54%;
    filter:contrast(1.07) saturate(.92) brightness(.94);
    clip-path:polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
    transition:clip-path 1500ms cubic-bezier(.76,0,.24,1);
    will-change:clip-path, transform;
    z-index:1;
  }
  .hero-mp__slide.is-active{
    clip-path:polygon(-22% 0, 100% 0, 100% 100%, 22% 100%);
    z-index:3;
    animation:none;
  }
  .hero-mp__slide.is-prev{
    clip-path:polygon(-22% 0, 100% 0, 100% 100%, 22% 100%);
    z-index:2;
    transition:none;
  }
  .hero-mp.is-animated .hero-mp__slide.is-active{animation:mpKB1 14s ease-out forwards}
  .hero-mp.is-animated .hero-mp__slide[data-kb="2"].is-active{animation-name:mpKB2}
  .hero-mp.is-animated .hero-mp__slide[data-kb="3"].is-active{animation-name:mpKB3}
  @keyframes mpKB1{
    0%   { transform:scale(1.02) }
    100% { transform:scale(1.08) }
  }
  @keyframes mpKB2{
    0%   { transform:scale(1.04) }
    100% { transform:scale(1.09) }
  }
  @keyframes mpKB3{
    0%   { transform:scale(1.07) }
    100% { transform:scale(1.02) }
  }

  /* Soft-Focus-Iris ::after — gleiches Bild (background:inherit) STARK
     unscharf + entsättigt + dunkler, FULL OPAQUE Layer über dem scharfen
     Slide. Radial-Mask: in der Iris-Mitte voll transparent (scharfes Bild
     darunter sichtbar), nach außen hart zu #000 (Blur-Layer voll opak).
     Iris-Position folgt --iris-x/--iris-y aus .hero-mp. Inset:-3%
     verhindert harte Bildkanten beim Blur. Wie Portrait-Hero: deutlich
     sichtbarer Schärfe-Sweetspot, Rest ist „Bokeh-Bett". */
  .hero-mp__slide::after{
    content:none;position:absolute;inset:-3%;
    background:inherit;background-size:cover;background-position:center 54%;
    filter:blur(15px) saturate(.86) brightness(.88) contrast(1.04);
    -webkit-mask:radial-gradient(circle at var(--iris-x) var(--iris-y),
      transparent 0%, transparent 24%,
      rgba(0,0,0,.32) 40%, rgba(0,0,0,.72) 56%, #000 74%);
    mask:radial-gradient(circle at var(--iris-x) var(--iris-y),
      transparent 0%, transparent 24%,
      rgba(0,0,0,.32) 40%, rgba(0,0,0,.72) 56%, #000 74%);
    opacity:.82;
    pointer-events:none;
    z-index:2;
  }
  .hero-mp.is-animated .hero-mp__slide::after{content:""}

  /* Bokeh-Flare Overlay — sehr dezent. Nur die hellen Bokeh-Bälle dringen
     durch (mix-blend-mode:screen, schwarzer Hintergrund fällt weg). Saturation
     stark zurück und opacity sehr niedrig, damit das Bild dominant bleibt. */
  .hero-mp__bokeh{position:absolute;inset:-6%;width:112%;height:112%;
    display:none;
    object-fit:cover;object-position:center;
    mix-blend-mode:screen;
    opacity:.18;
    filter:hue-rotate(-22deg) saturate(.55) contrast(.92) brightness(.78);
    pointer-events:none;z-index:5;
    will-change:transform;
  }
  .hero-mp.is-animated .hero-mp__bokeh{display:block;animation:mpBokehDrift 46s ease-in-out infinite alternate}
  @keyframes mpBokehDrift{
    0%   { transform:scale(1.04) translate(-2%, -1%) }
    50%  { transform:scale(1.08) translate(1%, .8%) }
    100% { transform:scale(1.05) translate(2%, -.4%) }
  }

  /* VIGNETTE — kräftiger Randabfall, zieht Auge ins Zentrum. Zwei radiale
     Layer (großer weicher + harter Eckabfall) + leichter Bottom-Gradient
     für die Headline-Lesbarkeit. */
  .hero-mp__vignette{position:absolute;inset:0;pointer-events:none;z-index:4;
    background:
      radial-gradient(ellipse 88% 92% at 50% 48%,
        transparent 0%, transparent 38%,
        rgba(4,4,6,.18) 58%, rgba(4,4,6,.46) 78%, rgba(2,2,4,.78) 100%),
      radial-gradient(ellipse 130% 110% at 50% 50%,
        transparent 50%, rgba(0,0,0,.55) 100%);
  }

  /* FILMKÖRNUNG — SVG fractal noise als data-URI, mix-blend:overlay legt
     die helle/dunkle Korn-Information über das Bild ohne Farbe zu kippen.
     animation-driven translate macht die Körnung „lebendig" (kein
     statisches Pattern). Bewusst stark (opacity .42) wie 35-mm-Push. */
  .hero-mp__grain{position:absolute;inset:-12%;width:124%;height:124%;
    display:none;
    pointer-events:none;z-index:8;
    opacity:.42;mix-blend-mode:overlay;
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 280 280'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.92' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.94  0 0 0 0 0.92  0 0 0 0 0.88  0 0 0 1 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
    background-size:280px 280px;
    will-change:transform;
  }
  .hero-mp.is-animated .hero-mp__grain{display:block;animation:mpGrainShift 1.2s steps(6) infinite}
  @keyframes mpGrainShift{
    0%   { transform:translate(0,0) }
    16%  { transform:translate(-3%,2%) }
    33%  { transform:translate(2%,-3%) }
    50%  { transform:translate(-2%,-2%) }
    66%  { transform:translate(3%,3%) }
    83%  { transform:translate(-1%,2%) }
    100% { transform:translate(0,0) }
  }

  .hero-mp__stage:before{content:"";position:absolute;inset:0;background:
    radial-gradient(78% 88% at 50% 52%, rgba(0,0,0,0) 0%, rgba(0,0,0,.2) 36%, rgba(0,0,0,.62) 72%, rgba(0,0,0,.92) 100%),
    linear-gradient(180deg, rgba(0,0,0,.42) 0%, rgba(0,0,0,0) 24%, rgba(0,0,0,0) 60%, rgba(0,0,0,.92) 100%);
    z-index:3;pointer-events:none}
  .hero-mp__stage:after{content:"";position:absolute;left:0;right:0;bottom:0;height:36%;background:linear-gradient(180deg, rgba(184,164,122,0) 0%, rgba(184,164,122,.08) 100%);z-index:3;pointer-events:none;mix-blend-mode:overlay}

  .hero-mp__overlay{position:absolute;inset:0;z-index:6;display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(56px,7vw,96px) clamp(22px,5vw,76px) clamp(40px,5vw,72px);pointer-events:none}
  .hero-mp__overlay > *{pointer-events:auto}

  /* Letterpress title — Iowan Old Style serif, 7-layer engraving */
  .hero-mp__title{
    font-family:'Iowan Old Style','Charter','Hoefler Text','Georgia',serif;
    font-size:clamp(58px,12.4vw,206px);line-height:.84;letter-spacing:-.025em;
    max-width:1500px;font-weight:600;
    color:color-mix(in oklch, #f4f1ea 88%, var(--accent) 12%);
    hanging-punctuation:first last;
    text-shadow:
      0 1px 0 rgba(255,248,228,.10),
      0 -1px 0 rgba(0,0,0,.55),
      0 -2px 1px rgba(0,0,0,.40),
      0 -3px 2px rgba(0,0,0,.28),
      0 -4px 3px rgba(0,0,0,.18),
      0 2px 14px rgba(0,0,0,.55),
      0 8px 36px rgba(0,0,0,.42);
    transition:opacity 1.4s var(--ease), transform 1.6s var(--ease), filter 1.2s var(--ease);
  }
  .hero-mp__title > span,
  .hero-mp__title > em{display:block}
  .hero-mp__title em{
    font-style:italic;font-weight:400;letter-spacing:-.02em;
    color:color-mix(in oklch, var(--accent) 78%, oklch(40% .08 40));
  }
  @starting-style{
    .hero-mp__title{opacity:0;transform:translateY(14px) scale(.985);filter:blur(4px)}
    .hero-mp__sub{opacity:0;transform:translateY(8px)}
    .hero-mp__actions{opacity:0;transform:translateY(8px)}
  }

  .hero-mp__sub{margin-top:clamp(22px,2.4vw,32px);max-width:640px;
    font-size:clamp(14px,1.05vw,16.5px);line-height:1.66;color:var(--muted);
    hanging-punctuation:first;
    transition:opacity 1.2s var(--ease) .55s, transform 1.2s var(--ease) .55s;
  }
  .hero-mp__actions{margin-top:clamp(28px,3vw,40px);display:flex;gap:14px;flex-wrap:wrap;
    transition:opacity 1.2s var(--ease) .75s, transform 1.2s var(--ease) .75s;
  }
  .hero-mp__actions a{min-height:44px;display:inline-flex;align-items:center;gap:10px;padding:14px 22px;border:1px solid var(--accent);color:var(--fg);font:11px var(--mono);letter-spacing:.22em;text-transform:uppercase;transition:background .35s var(--ease),color .35s var(--ease);font-variant-numeric:tabular-nums}
  .hero-mp__actions a:hover{background:var(--accent);color:var(--ink)}
  .hero-mp__actions a.ghost{border-color:rgba(244,241,234,.28);color:var(--muted)}
  .hero-mp__actions a.ghost:hover{border-color:var(--fg);color:var(--fg)}

  /* ============ STATEMENT ============ */
  .st{background:var(--paper);color:var(--ink);min-height:64svh;max-height:68svh;display:flex;align-items:center;overflow:hidden;position:relative}
  .st .section-inner{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(48px,7vw,120px);align-items:center;height:100%;padding:clamp(70px,8vw,120px) clamp(22px,5vw,76px)}
  .st h2{font-size:clamp(46px,7vw,128px);line-height:.86;letter-spacing:-.075em;font-weight:900;color:var(--ink);max-width:760px}
  .st h2 em{font-style:italic;color:var(--accent-2);font-weight:300;letter-spacing:-.04em}
  .st-body{display:grid;gap:18px;max-width:520px;justify-self:end}
  .st-body p{color:var(--muted-l);font-size:clamp(15px,1.1vw,17px);line-height:1.66;margin:0}
  .st-body p strong{color:var(--ink);font-weight:600}
  .st-cta{min-height:44px;margin-top:14px;font:11px var(--mono);letter-spacing:.24em;text-transform:uppercase;color:var(--ink);display:inline-flex;align-items:center;gap:10px;border-bottom:1px solid var(--ink);padding-bottom:6px;align-self:flex-start;transition:letter-spacing .4s var(--ease);width:fit-content}
  .st-cta:hover{letter-spacing:.3em}

  /* ============ PROVENANCE ============ */
  .pv{background:var(--bg);color:var(--fg)}
  .pv-head{max-width:1100px;margin-bottom:clamp(48px,6vw,80px)}
  .pv-head h2{font-size:clamp(42px,6.4vw,116px);line-height:.86;letter-spacing:-.07em;font-weight:900;margin-bottom:24px}
  .pv-head h2 em{font-style:italic;color:var(--accent);font-weight:300;letter-spacing:-.04em}
  .pv-head p{color:var(--muted);font-size:clamp(15px,1.1vw,17px);line-height:1.6;max-width:680px}
  .pv-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,2vw,32px)}
  .pv-card{display:flex;flex-direction:column;gap:18px}
  .pv-img{position:relative;aspect-ratio:4/5;overflow:hidden;background:#0a0a0a}
  .pv-img img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease),filter .6s var(--ease);filter:saturate(.88) contrast(1.06)}
  .pv-card:hover .pv-img img{transform:scale(1.045);filter:saturate(1.06) contrast(1.1)}
  .pv-card h3{font-size:clamp(22px,2.1vw,32px);font-weight:800;letter-spacing:-.035em;line-height:1.05}
  .pv-card p{color:var(--muted);font-size:15px;line-height:1.6}

  /* ============ MINI PORTFOLIO ============ */
  .po{background:#0a0a0a;color:#fff;height:100svh;max-height:100svh;overflow:hidden;position:relative}
  .po-grid{position:absolute;inset:0;display:grid;grid-template-columns:repeat(12,1fr);grid-template-rows:repeat(12,1fr);gap:6px;padding:6px}
  .po-head{grid-column:8 / 13;grid-row:1 / 5;display:flex;flex-direction:column;justify-content:space-between;padding:clamp(20px,2.2vw,40px);position:relative;z-index:3;background:linear-gradient(180deg,rgba(10,10,10,.45),rgba(10,10,10,.78))}
  .po-head h2{font-size:clamp(40px,5.4vw,96px);line-height:.88;letter-spacing:-.06em;font-weight:900;color:#fff;margin:0}
  .po-head h2 em{font-style:italic;color:rgba(184,164,122,.85);font-weight:300;letter-spacing:-.035em}
  .po-head p{color:rgba(255,255,255,.62);font-size:clamp(13px,.95vw,15px);line-height:1.55;max-width:340px;margin:0}
  .po-tile{position:relative;overflow:hidden;background:#0a0a0a;cursor:zoom-in;border:0;padding:0;margin:0;display:block;opacity:0;transform:translateY(18px) scale(.985);transition:opacity 1s var(--ease),transform 1s var(--ease),filter .7s var(--ease)}
  .po-tile.is-in{opacity:1;transform:translateY(0) scale(1)}
  .po-tile img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.8s var(--ease),filter .7s var(--ease);filter:brightness(.78) saturate(.86) contrast(1.04)}
  .po-tile:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 55%,rgba(0,0,0,.62) 100%);opacity:0;transition:opacity .55s var(--ease);z-index:2;pointer-events:none}
  .po-tile .corner{position:absolute;width:14px;height:14px;border:1px solid rgba(255,255,255,.85);opacity:0;transition:opacity .45s var(--ease),transform .55s var(--ease);z-index:3;pointer-events:none}
  .po-tile .corner.tl{top:10px;left:10px;border-right:none;border-bottom:none}
  .po-tile .corner.tr{top:10px;right:10px;border-left:none;border-bottom:none}
  .po-tile .corner.bl{bottom:10px;left:10px;border-right:none;border-top:none}
  .po-tile .corner.br{bottom:10px;right:10px;border-left:none;border-top:none}
  .po-tile:hover img{transform:scale(1.04);filter:brightness(1) saturate(1.08) contrast(1.02)}
  .po-tile:hover:before{opacity:1}
  .po-tile:hover .corner{opacity:.9}
  .po-tile:focus-visible{outline:1px solid rgba(255,255,255,.7);outline-offset:-1px}
  .po-grid:hover .po-tile:not(:hover){filter:brightness(.55)}
  .po-tile.t1{grid-column:1 / 8;grid-row:1 / 8}
  .po-tile.t2{grid-column:8 / 13;grid-row:5 / 8}
  .po-tile.t3{grid-column:1 / 4;grid-row:8 / 13}
  .po-tile.t4{grid-column:4 / 7;grid-row:8 / 13}
  .po-tile.t5{grid-column:7 / 10;grid-row:8 / 13}
  .po-tile.t6{grid-column:10 / 13;grid-row:8 / 13}

  /* ============ LIGHTBOX ============ */
  .lb{position:fixed;inset:0;z-index:120;display:none;background:rgba(6,6,6,.95);backdrop-filter:blur(18px);align-items:center;justify-content:center;opacity:0;transition:opacity .35s var(--ease)}
  .lb.open{display:flex;opacity:1}
  .lb-stage{position:relative;width:min(94vw,1500px);height:min(86vh,1000px);display:flex;align-items:center;justify-content:center}
  .lb-img{max-width:100%;max-height:100%;object-fit:contain;box-shadow:0 30px 80px -30px rgba(0,0,0,.7);opacity:0;transition:opacity .4s var(--ease)}
  .lb-img.show{opacity:1}
  .lb-close,.lb-prev,.lb-next{position:absolute;background:transparent;border:1px solid rgba(255,255,255,.22);color:#fff;font:11px var(--mono);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:background .3s var(--ease),border-color .3s var(--ease)}
  .lb-close{top:-52px;right:0;width:44px;height:44px;font-size:18px}
  .lb-prev,.lb-next{top:50%;width:54px;height:54px;transform:translateY(-50%);font-size:20px;font-weight:300}
  .lb-prev{left:-78px} .lb-next{right:-78px}
  .lb-prev:hover,.lb-next:hover,.lb-close:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.55)}
  .lb-counter{position:absolute;bottom:-44px;left:0;font:10px var(--mono);letter-spacing:.26em;text-transform:uppercase;color:rgba(255,255,255,.55)}
  @media (max-width:720px){
    .lb-stage{width:96vw;height:80vh}
    .lb-prev{left:6px;background:rgba(0,0,0,.5)} .lb-next{right:6px;background:rgba(0,0,0,.5)}
  }

  /* ============ FUER WEN ============ */
  .fw{background:var(--paper);color:var(--ink);min-height:52svh}
  .fw .section-inner{display:grid;grid-template-columns:1fr;gap:clamp(36px,5vw,60px);padding:clamp(60px,7vw,100px) clamp(22px,5vw,76px)}
  .fw-head{display:flex;align-items:baseline;justify-content:space-between;gap:32px;flex-wrap:wrap}
  .fw-head h2{font-size:clamp(32px,4.6vw,68px);line-height:.92;letter-spacing:-.06em;font-weight:900}
  .fw-head h2 em{font-style:italic;color:var(--accent-2);font-weight:300}
  .fw-head .lead{color:var(--muted-l);font-size:14.5px;line-height:1.6;max-width:420px}
  .fw-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(8px,1.2vw,18px)}
  .fw-card{position:relative;padding:18px 16px 14px;border-left:1px solid rgba(22,20,15,.18);transition:padding-left .4s var(--ease)}
  .fw-card:hover{border-left-color:var(--accent-2);padding-left:22px}
  .fw-card .no{font:10px var(--mono);letter-spacing:.24em;color:var(--quiet-l);text-transform:uppercase;margin-bottom:8px;display:block}
  .fw-card strong{display:block;font-size:clamp(15px,1.1vw,18px);font-weight:700;letter-spacing:-.02em;color:var(--ink);line-height:1.18;margin-bottom:6px}
  .fw-card .lbl{font:9.5px var(--mono);letter-spacing:.22em;text-transform:uppercase;color:var(--accent-2);display:block;margin-top:4px}
  .fw-foot{margin-top:clamp(24px,3vw,40px);padding-top:clamp(24px,3vw,40px);border-top:1px solid rgba(22,20,15,.12);display:flex;align-items:baseline;justify-content:space-between;gap:32px;flex-wrap:wrap}
  .fw-foot p{color:var(--muted-l);font-size:14.5px;line-height:1.5}
  .fw-foot p em{font-style:italic;color:var(--accent-2)}
  .fw-foot a{min-height:44px;font:11px var(--mono);letter-spacing:.24em;text-transform:uppercase;color:var(--ink);display:inline-flex;align-items:center;gap:10px;border-bottom:1px solid var(--ink);padding-bottom:6px;transition:letter-spacing .4s var(--ease)}
  .fw-foot a:hover{letter-spacing:.3em}

  /* ============ RELATED ============ */
  .rl{background:var(--bg);color:var(--fg)}
  .rl-head{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:end;margin-bottom:clamp(40px,5vw,72px)}
  .rl-head h2{font-size:clamp(42px,6.2vw,108px);line-height:.86;letter-spacing:-.068em;font-weight:900}
  .rl-head h2 em{font-style:italic;color:var(--accent);font-weight:300}
  .rl-head p{color:var(--muted);font-size:16px;line-height:1.6;max-width:420px;justify-self:end}
  .rl-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.6vw,22px)}
  .rl-card{position:relative;aspect-ratio:4/5;overflow:hidden;background:#0a0a0a;display:block}
  .rl-card img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease),filter .6s var(--ease);filter:brightness(.7) grayscale(.22)}
  .rl-card:hover img{transform:scale(1.05);filter:brightness(.96) grayscale(0)}
  .rl-card .overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.1) 0%,rgba(0,0,0,0) 35%,rgba(0,0,0,.88) 100%);pointer-events:none}
  .rl-card .content{position:absolute;left:20px;right:20px;bottom:22px;display:flex;align-items:flex-end;justify-content:space-between;gap:12px;pointer-events:none}
  .rl-card .content > div{display:grid;gap:6px}
  .rl-card span{font:10px var(--mono);letter-spacing:.24em;color:var(--accent);text-transform:uppercase}
  .rl-card strong{font-size:clamp(18px,1.8vw,28px);font-weight:800;letter-spacing:-.025em;color:#fff}
  .rl-card .arrow{color:rgba(255,255,255,.7);font-size:20px;transition:transform .35s var(--ease),color .35s var(--ease)}
  .rl-card:hover .arrow{transform:translateX(6px);color:#fff}

  /* ============ Responsive ============ */
  @media (max-width:1180px){
    .pv-grid{grid-template-columns:repeat(2,1fr)}
    .fw-grid{grid-template-columns:repeat(3,1fr)}
    .rl-grid{grid-template-columns:repeat(2,1fr)}
  }
  @media (max-width:900px){
    .hero-mp__slide{background-image:var(--hero-bg-mobile,var(--hero-bg-desktop,none))}
    .hero-mp{height:auto;max-height:none;min-height:88svh}
    .hero-mp__title{font-size:clamp(48px,13.5vw,92px);line-height:.88}
    .st{height:auto;max-height:none;min-height:auto}
    .st .section-inner{grid-template-columns:1fr;gap:32px;padding:clamp(80px,12vw,120px) 22px clamp(60px,8vw,90px)}
    .st-body{justify-self:start}
    .pv-grid{grid-template-columns:1fr}
    .po{height:auto;max-height:none}
    .po-grid{position:relative;grid-template-columns:repeat(2,1fr);grid-template-rows:none;grid-auto-rows:38vh;padding:8px;gap:8px}
    .po-head{grid-column:1 / 3;grid-row:auto;padding:clamp(30px,6vw,48px) clamp(16px,4vw,28px);min-height:38vh}
    .po-head h2{font-size:clamp(34px,8vw,56px)}
    .po-tile.t1,.po-tile.t2,.po-tile.t3,.po-tile.t4,.po-tile.t5,.po-tile.t6{grid-column:auto;grid-row:auto}
    .po-tile.t1{grid-column:1 / 3}
    .fw-head{flex-direction:column;align-items:flex-start}
    .fw-grid{grid-template-columns:1fr 1fr}
    .rl-head{grid-template-columns:1fr;gap:18px}
    .rl-head p{justify-self:start}
  }
  @media (max-width:600px){
    .fw-grid{grid-template-columns:1fr}
    .rl-grid{grid-template-columns:1fr}
  }
  @media (prefers-reduced-motion:reduce){
    .hero-mp{animation:none;--iris-x:55%;--iris-y:42%}
    .hero-mp__slide{filter:contrast(1.07) saturate(.92) brightness(.94);transition:none;transform:none;
      clip-path:polygon(100% 0, 100% 0, 100% 100%, 100% 100%);}
    .hero-mp__slide.is-active{clip-path:polygon(-22% 0, 100% 0, 100% 100%, 22% 100%);animation:none}
    .hero-mp__slide::after{filter:blur(13px) saturate(.88) brightness(.9);opacity:.82}
    .hero-mp__bokeh{display:none}
    .hero-mp__grain{animation:none;opacity:.32}
    .hero-mp__title,.hero-mp__sub,.hero-mp__actions{transition:none}
    .po-tile{opacity:1;transform:none;transition:none}
    .po-grid:hover .po-tile:not(:hover){filter:none}
  }
