:root{
  --bg:#090706;
  --ink:#261a14;
  --cream:#f4eee6;
  --cream-2:#ebe1d5;
  --paper:#faf7f2;
  --warm:#9a7353;
  --warm-deep:#725038;
  --muted:#756356;
  --line:rgba(57,41,31,.16);
  --ease:cubic-bezier(.22,1,.36,1);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:#fff;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;scroll-behavior:smooth}
body{overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{font:inherit}
.logo-on-light{filter:brightness(0) saturate(100%) invert(13%) sepia(13%) saturate(1702%) hue-rotate(338deg) brightness(98%) contrast(89%)}
.eyebrow,.scene-kicker{text-transform:uppercase;letter-spacing:.27em;font-size:9px;line-height:1.3;font-weight:650}
.eyebrow{color:#cdb39d;margin:0}

/* ---------------------------------------------------------
   ARRIVAL — continues the final Google-map photo portal
   --------------------------------------------------------- */
.gallery-arrival{
  position:relative;
  height:100vh;height:100svh;
  min-height:620px;
  overflow:hidden;
  background:#17100c;
  color:#f7efe6;
  isolation:isolate;
}
.arrival-media,.arrival-shade{position:absolute;inset:0}
.arrival-media img{width:100%;height:100%;object-fit:cover;filter:saturate(.91) contrast(1.025);transform:scale(1.018);transform-origin:47% 52%}
.arrival-shade{
  background:
    linear-gradient(90deg,rgba(12,8,6,.82) 0%,rgba(12,8,6,.52) 34%,rgba(12,8,6,.08) 70%),
    linear-gradient(180deg,rgba(10,7,5,.08) 30%,rgba(10,7,5,.48) 100%);
  pointer-events:none;
}
.arrival-copy{
  position:absolute;z-index:3;
  left:clamp(26px,6vw,96px);bottom:clamp(74px,11vh,128px);
  width:min(700px,74vw);
}
.arrival-copy h2{
  font:400 clamp(62px,8.2vw,126px)/.82 Georgia,serif;
  letter-spacing:-.062em;
  margin:18px 0 28px;
  text-wrap:balance;
}
.arrival-copy h2 em{font-weight:400;color:#d9bda5}
.arrival-copy>p:not(.eyebrow){font:400 clamp(16px,1.35vw,21px)/1.62 Georgia,serif;color:#e1d4c8;max-width:610px;margin:0}
.arrival-mark{position:absolute;left:calc(100% + clamp(40px,7vw,110px));top:-17vh;width:min(23vw,330px);opacity:.10;pointer-events:none}
.arrival-mark img{width:100%;filter:brightness(0) invert(1)}
.continue{display:inline-flex;margin-top:34px;align-items:center;gap:15px;text-transform:uppercase;letter-spacing:.22em;font-size:8px;color:#d8c0ab}
.continue b{font-size:18px;font-weight:400;transform:translateY(-1px)}
.arrival-index{position:absolute;z-index:3;right:clamp(24px,4vw,64px);bottom:clamp(26px,4vh,46px);display:flex;align-items:center;gap:12px;color:#d8c6b8;font-size:8px;letter-spacing:.18em;text-transform:uppercase}
.arrival-index i{width:44px;height:1px;background:rgba(255,255,255,.38)}

/* ---------------------------------------------------------
   MODULAR CINEMATIC GALLERY
   --------------------------------------------------------- */
.gallery-story{position:relative;background:var(--cream);color:var(--ink);height:950svh}
.gallery-sticky{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:var(--cream);isolation:isolate}
.gallery-stage{position:absolute;inset:0;overflow:hidden}
.gallery-scene{
  --scene-opacity:0;
  --scene-enter:0;
  --scene-exit:0;
  --scene-reveal:100%;
  --door-inset:46%;
  --scene-in-shift:54px;
  --scene-out-shift:0px;
  --scene-scale:1.035;
  --copy-opacity:0;
  --team-intro-opacity:0;
  --person-copy-opacity:0;
  position:absolute;inset:0;
  opacity:var(--scene-opacity);
  overflow:hidden;
  will-change:auto;
  background:var(--cream);
}
.gallery-brand{
  position:absolute;z-index:30;
  top:clamp(20px,3.6vh,42px);left:clamp(22px,4vw,62px);
  display:flex;align-items:center;gap:14px;
  mix-blend-mode:multiply;
  pointer-events:none;
}
.gallery-brand img{width:96px;height:auto}
.gallery-brand span{text-transform:uppercase;letter-spacing:.24em;font-size:7px;color:#8a705d;border-left:1px solid #bda791;padding-left:14px;min-width:120px}
.gallery-counter{position:absolute;z-index:30;right:clamp(22px,4vw,62px);bottom:clamp(22px,4vh,42px);display:flex;align-items:center;gap:10px;font-size:8px;letter-spacing:.2em;color:#725e4d;pointer-events:none}
.gallery-counter i{width:36px;height:1px;background:#a68a72}
.gallery-progress-line{position:absolute;z-index:30;left:0;right:0;bottom:0;height:2px;background:rgba(92,68,51,.11);pointer-events:none}
.gallery-progress-line i{display:block;width:100%;height:100%;transform-origin:left;background:#846248;transform:scaleX(var(--gallery-progress,0));opacity:.8}

/* Studio scenes */
.studio-scene{display:grid;grid-template-columns:minmax(0,1.24fr) minmax(340px,.76fr);background:#f1e9df}
.studio-scene.editorial-right{grid-template-columns:minmax(340px,.76fr) minmax(0,1.24fr)}
.studio-media{position:relative;height:100%;overflow:hidden;background:#d8cbbb;box-shadow:0 34px 90px rgba(47,31,20,.12);z-index:2}
.studio-media img{width:100%;height:100%;object-fit:cover;filter:saturate(.9) contrast(1.02);transform:scale(var(--scene-scale)) translate3d(0,var(--scene-out-shift),0);will-change:transform}
.editorial-left .studio-media{grid-column:1;clip-path:inset(0 var(--scene-reveal) 0 0)}
.editorial-right .studio-media{grid-column:2;clip-path:inset(0 0 0 var(--scene-reveal))}
.media-hairline{position:absolute;inset:auto 0 0;height:1px;background:rgba(255,255,255,.36)}
.scene-signature{position:absolute;z-index:8;display:block;height:auto;pointer-events:none;user-select:none}
.studio-signature{top:clamp(24px,3.4vh,38px);width:clamp(27px,2.15vw,36px);opacity:.78}
.editorial-left .studio-signature{right:clamp(24px,4vw,62px)}
.editorial-right .studio-signature{left:clamp(24px,4vw,62px)}
.portrait-signature{top:clamp(22px,3vh,34px);width:clamp(25px,2vw,34px);opacity:.72;filter:drop-shadow(0 2px 12px rgba(0,0,0,.22))}
.portrait-left .portrait-signature{left:clamp(22px,2.4vw,34px)}
.portrait-right .portrait-signature{right:clamp(22px,2.4vw,34px)}

.scene-copy{position:relative;z-index:4;align-self:center;opacity:var(--copy-opacity);transform:translate3d(0,var(--scene-in-shift),0);will-change:opacity,transform}
.studio-copy{padding:clamp(86px,9vw,150px) clamp(36px,6vw,96px)}
.editorial-left .studio-copy{grid-column:2}
.editorial-right .studio-copy{grid-column:1;grid-row:1}
.scene-kicker{display:block;color:#987355;margin-bottom:18px}
.studio-copy h3,.team-intro-copy h3,.closing-copy h3{
  font:400 clamp(46px,5.45vw,82px)/.92 Georgia,serif;
  letter-spacing:-.052em;margin:0 0 24px;color:#2b1d16;
}
.studio-copy h3 em,.team-intro-copy h3 em,.closing-copy h3 em{font-weight:400;color:#8b6549}
.studio-copy>p,.team-intro-copy>p{font:400 clamp(15px,1.13vw,18px)/1.72 Georgia,serif;color:#715e50;max-width:470px;margin:0}
.scene-ghost{position:absolute;right:-.02em;bottom:-.1em;font:400 clamp(110px,17vw,270px)/.72 Georgia,serif;letter-spacing:-.07em;color:rgba(82,57,41,.035);white-space:nowrap;text-transform:lowercase;pointer-events:none;user-select:none}
.editorial-right .scene-ghost{right:auto;left:-.04em}

/* People chapter */
.person-scene{background:#f5efe7;color:#281c16}
.portrait-field{position:absolute;top:0;bottom:0;width:44vw;max-width:790px;min-width:520px;background:#0b0a09;overflow:hidden;z-index:3;box-shadow:0 36px 100px rgba(38,23,14,.18)}
.portrait-left .portrait-field{left:0;clip-path:inset(0 var(--scene-reveal) 0 0)}
.portrait-right .portrait-field{right:0;clip-path:inset(0 0 0 var(--scene-reveal))}
.first-person .portrait-field{clip-path:inset(0 var(--door-inset) 0 var(--door-inset))}
.portrait-field:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.06),rgba(0,0,0,.18));pointer-events:none}
.portrait-field img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.02);transform:scale(var(--scene-scale)) translate3d(0,var(--scene-out-shift),0);will-change:transform}
.portrait-index{position:absolute;left:28px;bottom:26px;z-index:2;color:rgba(255,255,255,.42);font:500 8px/1 Inter,sans-serif;letter-spacing:.28em}
.person-copy,.team-intro-copy{position:absolute;z-index:5;top:50%;width:min(46vw,690px);transform:translateY(calc(-50% + var(--scene-in-shift)));padding:clamp(52px,6vw,100px);will-change:opacity,transform}
.portrait-left .person-copy,.portrait-left .team-intro-copy{right:0}
.portrait-right .person-copy,.portrait-right .team-intro-copy{left:0}
.person-copy{opacity:var(--person-copy-opacity)}
.person-copy h3{font:400 clamp(44px,5.3vw,82px)/.93 Georgia,serif;letter-spacing:-.052em;margin:0 0 16px;color:#2b1d16;max-width:650px;text-wrap:balance}
.person-role{text-transform:uppercase;letter-spacing:.16em;font-size:10px;line-height:1.5;font-weight:750;color:#895f3f;margin:0 0 24px;max-width:520px}
.person-bio{font:400 clamp(15px,1.12vw,18px)/1.72 Georgia,serif;color:#655448;max-width:560px;margin:0}
.person-detail{font:500 10px/1.65 Inter,sans-serif;letter-spacing:.02em;color:#8b7767;border-top:1px solid rgba(78,56,42,.16);padding-top:18px;margin:24px 0 0;max-width:540px}
.team-intro-copy{opacity:var(--team-intro-opacity);pointer-events:none}
.team-intro-copy h3{font-size:clamp(52px,6.3vw,98px)}
.name-ghost{position:absolute;z-index:1;bottom:-.08em;font:400 clamp(140px,18vw,300px)/.7 Georgia,serif;letter-spacing:-.075em;color:rgba(79,54,39,.035);white-space:nowrap;pointer-events:none;user-select:none}
.portrait-left .name-ghost{right:-.02em}.portrait-right .name-ghost{left:-.02em}

/* Closing team portrait — supplied authored group composition */
.closing-scene{background:#090706;color:#f6eee5;display:grid;place-items:center}
.closing-wall{position:absolute;inset:0;background:#090706;overflow:hidden;transform:none;will-change:auto}
.closing-wall img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block;filter:grayscale(1) contrast(1.025);opacity:calc(.84 + (var(--scene-enter) * .14));transform:none;transform-origin:center top}
.closing-scene:after{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:
    linear-gradient(180deg,rgba(9,7,6,.03) 0%,rgba(9,7,6,.04) 45%,rgba(9,7,6,.38) 68%,rgba(9,7,6,.92) 100%),
    radial-gradient(circle at 50% 34%,rgba(9,7,6,0) 22%,rgba(9,7,6,.16) 68%,rgba(9,7,6,.34) 100%);
}
.closing-copy{
  position:absolute;z-index:5;
  left:clamp(28px,5vw,84px);right:clamp(28px,5vw,84px);bottom:clamp(34px,5.6vh,64px);
  width:auto;text-align:center;
  opacity:var(--copy-opacity);transform:translateY(var(--scene-in-shift));
  color:#f6eee5;
}
.closing-copy h3{
  color:#f7eee5;
  font-size:clamp(48px,6.35vw,96px);
  line-height:.88;
  margin:0 auto 17px;
  max-width:1000px;
  text-shadow:0 4px 34px rgba(0,0,0,.34);
}
.closing-copy h3 em{color:#dbc0a9}
.closing-copy p{font:400 clamp(14px,1.08vw,17px)/1.58 Georgia,serif;color:#e1d4c9;margin:0 auto 22px;max-width:620px;text-shadow:0 2px 18px rgba(0,0,0,.36)}
.archive-link{display:inline-flex;gap:18px;align-items:center;text-transform:uppercase;letter-spacing:.22em;font-size:9px;border-bottom:1px solid rgba(255,255,255,.42);padding-bottom:8px}
.archive-link span{font-size:18px;font-weight:400}

/* ---------------------------------------------------------
   EXPANDABLE ARCHIVE
   --------------------------------------------------------- */
.archive{position:relative;background:var(--paper);color:#35251c;padding:clamp(82px,10vw,150px) clamp(22px,6vw,96px) clamp(90px,11vw,170px)}
.archive-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.34fr);gap:70px;align-items:end;margin-bottom:clamp(54px,7vw,95px)}
.archive-head .eyebrow{color:#8f6d52;margin-bottom:18px}
.archive-head h2{font:400 clamp(58px,7.6vw,112px)/.85 Georgia,serif;letter-spacing:-.058em;margin:0;color:#2d1f18}
.archive-head h2 em{font-weight:400;color:#987052}
.archive-intro{justify-self:end;width:min(330px,100%)}
.archive-logo{width:54px;height:auto;margin-bottom:24px}
.archive-intro p{font:400 15px/1.65 Georgia,serif;color:#766256;margin:0}
.archive-grid{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-flow:dense;gap:16px}
.archive-item{appearance:none;border:0;padding:0;margin:0;background:#e5d9cb;position:relative;overflow:hidden;cursor:zoom-in;min-height:280px;text-align:left;color:#fff}
.archive-item img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease),filter .9s var(--ease);filter:saturate(.92) contrast(1.02)}
.archive-item.archive-person img{filter:grayscale(1) contrast(1.03)}
.archive-item.archive-team{background:#090706}
.archive-item.archive-team img{object-fit:contain;background:#090706;filter:grayscale(1) contrast(1.025)}
.archive-item:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 54%,rgba(14,9,6,.6));opacity:.72;transition:opacity .5s ease}
.archive-item span{position:absolute;z-index:2;left:18px;bottom:16px;text-transform:uppercase;letter-spacing:.17em;font-size:7px;font-weight:700;opacity:.86}
.archive-item:hover img,.archive-item:focus-visible img{transform:scale(1.035)}
.archive-item:hover:after,.archive-item:focus-visible:after{opacity:.92}
.archive-item:focus-visible{outline:2px solid #8d6749;outline-offset:3px}
.archive-item:nth-child(8n+1){grid-column:span 5;grid-row:span 2;min-height:580px}
.archive-item:nth-child(8n+2){grid-column:span 4;min-height:300px}
.archive-item:nth-child(8n+3){grid-column:span 3;min-height:300px}
.archive-item:nth-child(8n+4){grid-column:span 3;min-height:360px}
.archive-item:nth-child(8n+5){grid-column:span 4;min-height:360px}
.archive-item:nth-child(8n+6){grid-column:span 5;min-height:360px}
.archive-item:nth-child(8n+7){grid-column:span 6;min-height:430px}
.archive-item:nth-child(8n+8){grid-column:span 6;min-height:430px}

/* Lightbox */
.gallery-lightbox{width:100vw;max-width:none;height:100vh;max-height:none;margin:0;border:0;padding:0;background:rgba(8,6,5,.96);color:#fff;overflow:hidden}
.gallery-lightbox::backdrop{background:#080605}
.gallery-lightbox[open]{display:grid;place-items:center}
.gallery-lightbox figure{margin:0;width:min(88vw,1500px);height:min(84vh,1000px);display:grid;grid-template-rows:1fr auto;gap:14px;place-items:center}
.gallery-lightbox figure img{width:100%;height:100%;object-fit:contain;min-height:0}
.gallery-lightbox figcaption{text-transform:uppercase;letter-spacing:.18em;font-size:8px;color:#cdbbad;text-align:center}
.lightbox-close,.lightbox-nav{position:absolute;z-index:3;border:0;background:transparent;color:#efe5db;cursor:pointer}
.lightbox-close{right:28px;top:20px;font:300 38px/1 Georgia,serif}
.lightbox-nav{top:50%;transform:translateY(-50%);font-size:28px;padding:28px 20px}.lightbox-prev{left:14px}.lightbox-next{right:14px}

@media(max-width:1100px){
  .studio-scene{grid-template-columns:minmax(0,1.08fr) minmax(310px,.92fr)}
  .studio-scene.editorial-right{grid-template-columns:minmax(310px,.92fr) minmax(0,1.08fr)}
  .portrait-field{width:46vw;min-width:430px}
  .person-copy,.team-intro-copy{width:54vw;padding:clamp(42px,5vw,70px)}
  .person-copy h3{font-size:clamp(42px,5vw,66px)}
}

@media (min-width:761px) and (max-width:1100px) and (orientation:portrait){
  /* Portrait tablets get a dedicated composition instead of the narrow desktop split. */
  .studio-scene,.studio-scene.editorial-right{display:grid;grid-template-columns:1fr;grid-template-rows:62svh 38svh;background:#f4eee6}
  .studio-media,.editorial-left .studio-media,.editorial-right .studio-media{grid-column:1;grid-row:1;clip-path:inset(var(--scene-reveal) 0 0 0);box-shadow:none}
  .studio-copy,.editorial-left .studio-copy,.editorial-right .studio-copy{grid-column:1;grid-row:2;padding:34px clamp(42px,7vw,70px) 54px;align-self:start}
  .studio-copy h3{font-size:clamp(48px,7.5vw,66px);margin-bottom:17px}
  .studio-copy>p{font-size:15px;line-height:1.6;max-width:650px}
  .scene-ghost{display:none}
  .studio-signature{top:22px;width:27px}
  .editorial-left .studio-signature,.editorial-right .studio-signature{right:28px;left:auto}

  .person-scene{display:grid;grid-template-rows:62svh 38svh;background:#f6f0e8}
  .portrait-field,.portrait-left .portrait-field,.portrait-right .portrait-field{position:relative;left:auto;right:auto;top:auto;bottom:auto;width:100%;max-width:none;min-width:0;height:62svh;grid-row:1;clip-path:inset(var(--scene-reveal) 0 0 0);box-shadow:none;background:#090807}
  .first-person .portrait-field{clip-path:inset(0 var(--door-inset) 0 var(--door-inset))}
  .portrait-field img{object-fit:contain;object-position:center center!important;transform:scale(1) translate3d(0,var(--scene-out-shift),0)}
  .person-copy,.team-intro-copy,.portrait-left .person-copy,.portrait-left .team-intro-copy,.portrait-right .person-copy,.portrait-right .team-intro-copy{position:absolute;left:0;right:0;top:62svh;width:100%;height:38svh;transform:translateY(0);padding:28px clamp(46px,7vw,72px) 46px;overflow:hidden}
  .person-copy h3{font-size:clamp(45px,6.4vw,58px);margin-bottom:10px}
  .person-role{font-size:9px;margin-bottom:13px}
  .person-bio{font-size:14px;line-height:1.52;max-width:680px}
  .person-detail{font-size:9px;line-height:1.5;margin-top:13px;padding-top:11px;max-width:680px}
  .team-intro-copy h3{font-size:clamp(52px,7vw,68px);margin-bottom:14px}
  .team-intro-copy>p{font-size:14px;line-height:1.55;max-width:650px}
  .name-ghost{display:none}

  .closing-scene{display:flex;flex-direction:column;min-height:100svh;background:#090706;place-items:initial}
  .closing-wall{position:relative;inset:auto;width:100%;height:auto;aspect-ratio:1672 / 941;flex:0 0 auto;transform:none;background:#090706}
  .closing-wall img{width:100%;height:100%;object-fit:cover;object-position:center top!important;transform:none;opacity:.98}
  .closing-scene:after{display:none}
  .closing-copy{position:relative;left:auto;right:auto;top:auto;bottom:auto;width:100%;flex:1;padding:34px clamp(46px,7vw,72px) 58px;text-align:left;transform:translateY(var(--scene-in-shift));background:#090706}
  .closing-copy h3{font-size:clamp(58px,8.4vw,78px);line-height:.9;margin:0 0 17px;max-width:760px}
  .closing-copy p{font-size:15px;max-width:620px;margin:0 0 22px}
}

@media(max-width:760px){
  .gallery-arrival{min-height:600px}
  .arrival-media img{object-position:52% 46%!important}
  .arrival-shade{background:linear-gradient(180deg,rgba(12,8,6,.04) 28%,rgba(12,8,6,.9) 92%)}
  .arrival-copy{left:22px;right:22px;bottom:78px;width:auto}
  .arrival-copy h2{font-size:clamp(55px,16vw,76px);margin:14px 0 20px}
  .arrival-copy>p:not(.eyebrow){font-size:15px;line-height:1.55;max-width:94%}
  .arrival-mark{display:none}
  .arrival-index{right:20px;bottom:22px}.arrival-index span:last-child{display:none}.arrival-index i{width:28px}

  .gallery-brand{top:18px;left:20px}.gallery-brand img{width:76px}.gallery-brand span{min-width:0;font-size:6px}
  .gallery-counter{right:20px;bottom:18px}.gallery-counter i{width:25px}
  .studio-signature{top:18px;width:24px}
  .editorial-left .studio-signature,.editorial-right .studio-signature{right:18px;left:auto}
  .portrait-signature{top:18px;width:24px}
  .portrait-left .portrait-signature{left:18px}.portrait-right .portrait-signature{right:18px}
  .gallery-scene{min-height:100svh}

  .studio-scene,.studio-scene.editorial-right{display:grid;grid-template-columns:1fr;grid-template-rows:58svh 42svh;background:#f4eee6}
  .studio-media,.editorial-left .studio-media,.editorial-right .studio-media{grid-column:1;grid-row:1;clip-path:inset(var(--scene-reveal) 0 0 0);box-shadow:none}
  .studio-copy,.editorial-left .studio-copy,.editorial-right .studio-copy{grid-column:1;grid-row:2;padding:34px 22px 62px;align-self:start}
  .studio-copy h3{font-size:clamp(42px,12vw,60px);margin-bottom:16px}
  .studio-copy>p{font-size:14px;line-height:1.58;max-width:none}
  .scene-kicker{font-size:7px;margin-bottom:11px}
  .scene-ghost{display:none}

  .person-scene{display:grid;grid-template-rows:57svh 43svh;background:#f6f0e8}
  .portrait-field,.portrait-left .portrait-field,.portrait-right .portrait-field{position:relative;left:auto;right:auto;top:auto;bottom:auto;width:100%;max-width:none;min-width:0;height:57svh;grid-row:1;clip-path:inset(var(--scene-reveal) 0 0 0);box-shadow:none}
  .first-person .portrait-field{clip-path:inset(0 var(--door-inset) 0 var(--door-inset))}
  .portrait-field img{object-fit:contain;object-position:center center!important;transform:scale(1) translate3d(0,var(--scene-out-shift),0);background:#090807}
  .person-copy,.team-intro-copy,.portrait-left .person-copy,.portrait-left .team-intro-copy,.portrait-right .person-copy,.portrait-right .team-intro-copy{position:absolute;left:0;right:0;top:57svh;width:100%;height:43svh;transform:translateY(0);padding:26px 22px 58px;overflow:hidden}
  .person-copy h3{font-size:clamp(35px,9.7vw,48px);margin-bottom:10px}
  .person-role{font-size:8px;margin-bottom:12px;letter-spacing:.13em}
  .person-bio{font-size:13px;line-height:1.5}
  .person-detail{font-size:8px;line-height:1.5;margin-top:12px;padding-top:11px}
  .team-intro-copy h3{font-size:clamp(42px,11vw,58px);margin-bottom:14px}
  .team-intro-copy>p{font-size:13px;line-height:1.5}
  .name-ghost{display:none}

  .closing-scene{display:flex;flex-direction:column;min-height:100svh;background:#090706;place-items:initial}
  .closing-wall{position:relative;inset:auto;width:100%;height:auto;aspect-ratio:1672 / 941;flex:0 0 auto;transform:none;background:#090706}
  .closing-wall img{width:100%;height:100%;object-fit:cover;object-position:center top!important;transform:none;opacity:.98}
  .closing-scene:after{display:none}
  .closing-copy{position:relative;left:auto;right:auto;top:auto;bottom:auto;width:100%;flex:1;padding:28px 22px 48px;text-align:left;transform:translateY(var(--scene-in-shift));background:#090706}
  .closing-copy h3{font-size:clamp(43px,12vw,62px);line-height:.9;margin:0 0 16px;max-width:96%}
  .closing-copy p{font-size:14px;max-width:96%;margin:0 0 22px}

  .archive{padding:74px 18px 95px}
  .archive-head{display:block;margin-bottom:42px}.archive-head h2{font-size:clamp(54px,15vw,78px)}
  .archive-intro{justify-self:auto;margin-top:32px;width:100%;display:flex;align-items:end;justify-content:space-between;gap:24px}.archive-logo{width:44px;margin:0}.archive-intro p{max-width:210px;font-size:13px}
  .archive-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .archive-item,.archive-item:nth-child(n){grid-column:span 1;grid-row:auto;min-height:0;height:64vw}
  .archive-item:nth-child(5n+1){grid-column:span 2;height:112vw;max-height:620px}
  .gallery-lightbox figure{width:92vw;height:82vh}.lightbox-nav{padding:26px 10px}.lightbox-prev{left:2px}.lightbox-next{right:2px}
}

@media(prefers-reduced-motion:reduce){
  html,body{scroll-behavior:auto}
  .gallery-story{height:auto!important}
  .gallery-sticky{position:relative;height:auto;overflow:visible}
  .gallery-stage{position:relative;inset:auto;overflow:visible}
  .gallery-scene{position:relative;opacity:1!important;pointer-events:auto!important;min-height:100svh;--scene-reveal:0%!important;--door-inset:0%!important;--scene-scale:1!important;--scene-in-shift:0px!important;--scene-out-shift:0px!important;--copy-opacity:1!important;--person-copy-opacity:1!important}
  .gallery-brand,.gallery-counter,.gallery-progress-line{display:none}
  .team-intro-copy{display:none}
  .archive-item img{transition:none}
}

/* R8: authored team group image always uses its native frame ratio. */
.archive-item.archive-team{height:auto!important;min-height:0!important;aspect-ratio:1672 / 941;grid-row:auto!important}
.archive-item.archive-team img{width:100%;height:100%;object-fit:cover;object-position:center top}
@media(max-width:760px){.archive-item.archive-team,.archive-item.archive-team:nth-child(n){height:auto!important;aspect-ratio:1672 / 941;grid-column:span 2}}

/* R8 tablet-landscape closing composition: preserve the complete authored team image. */
@media (min-width:761px) and (max-width:1100px) and (orientation:landscape){
  .portrait-field img{object-fit:contain;object-position:center center!important;transform:scale(1) translate3d(0,var(--scene-out-shift),0);background:#090807}
}

@media (min-width:761px) and (max-width:1100px) and (orientation:landscape){
  .closing-scene{display:flex;flex-direction:column;min-height:100svh;background:#090706;place-items:initial}
  .closing-wall{position:relative;inset:auto;width:100%;height:auto;aspect-ratio:1672 / 941;flex:0 0 auto;transform:none;background:#090706}
  .closing-wall img{width:100%;height:100%;object-fit:cover;object-position:center top!important;transform:none;opacity:.98}
  .closing-scene:after{display:none}
  .closing-copy{position:relative;left:auto;right:auto;top:auto;bottom:auto;width:100%;flex:1;padding:14px 36px 18px;text-align:left;transform:translateY(var(--scene-in-shift));background:#090706}
  .closing-copy h3{font-size:clamp(40px,5vw,50px);line-height:.88;margin:0 0 8px;max-width:760px}
  .closing-copy p{font-size:12.5px;line-height:1.38;max-width:620px;margin:0 0 9px}
  .closing-copy .archive-link{font-size:8px;padding-bottom:5px}
}

.archive-item.archive-team:hover img,.archive-item.archive-team:focus-visible img{transform:none}

/* ---------------------------------------------------------
   CLEAN FINAL — LIVED STUDIO MOMENTS + QUIET CLOSE
   --------------------------------------------------------- */
.moment-scene{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);background:#f4eee6;color:#2b1d16}
.moment-scene.moment-right{grid-template-columns:minmax(360px,.9fr) minmax(0,1.1fr)}
.moment-media{position:relative;height:100%;overflow:hidden;background:#ded2c5;box-shadow:0 34px 90px rgba(47,31,20,.12);z-index:2}
.moment-left .moment-media{grid-column:1;clip-path:inset(0 var(--scene-reveal) 0 0)}
.moment-right .moment-media{grid-column:2;clip-path:inset(0 0 0 var(--scene-reveal))}
.moment-media img{width:100%;height:100%;object-fit:cover;filter:saturate(.92) contrast(1.015);transform:scale(var(--scene-scale)) translate3d(0,var(--scene-out-shift),0);will-change:transform}
.moment-contain .moment-media{background:#e9dfd4;padding:clamp(26px,3.5vw,54px)}
.moment-contain .moment-media img{object-fit:contain;background:#e9dfd4;box-shadow:0 24px 58px rgba(52,34,23,.15)}
.moment-wide{grid-template-columns:minmax(0,1.35fr) minmax(340px,.65fr)}
.moment-wide .moment-media{background:#e9dfd4;padding:clamp(20px,2.5vw,38px)}
.moment-wide .moment-media img{object-fit:contain;background:#e9dfd4;box-shadow:0 24px 58px rgba(52,34,23,.12)}

.moment-copy{padding:clamp(78px,8vw,132px) clamp(36px,6vw,96px)}
.moment-left .moment-copy{grid-column:2}
.moment-right .moment-copy{grid-column:1;grid-row:1}
.moment-copy h3{font:400 clamp(46px,5.25vw,80px)/.92 Georgia,serif;letter-spacing:-.052em;margin:0 0 24px;color:#2b1d16}
.moment-copy h3 em{font-weight:400;color:#8b6549}
.moment-copy>p{font:400 clamp(15px,1.13vw,18px)/1.72 Georgia,serif;color:#715e50;max-width:500px;margin:0}
.moment-signature{top:clamp(24px,3.4vh,38px);width:clamp(27px,2.15vw,36px);opacity:.78}
.moment-left .moment-signature{right:clamp(24px,4vw,62px)}
.moment-right .moment-signature{left:clamp(24px,4vw,62px)}

.final-close-scene{display:grid;place-items:center;background:#f5efe7;color:#2b1d16;text-align:center}
.final-close-inner{width:min(930px,84vw);padding:70px 24px;opacity:var(--copy-opacity);transform:translateY(var(--scene-in-shift));will-change:opacity,transform}
.final-close-mark{width:clamp(38px,4vw,58px);height:auto;margin:0 auto 30px;opacity:.82}
.final-close-inner .scene-kicker{display:block;margin-bottom:22px;color:#8d684d}
.final-close-inner h3{font:400 clamp(58px,7.7vw,116px)/.85 Georgia,serif;letter-spacing:-.062em;margin:0 0 28px;color:#2b1d16}
.final-close-inner h3 em{font-weight:400;color:#947052}
.final-close-inner>p{font:400 clamp(15px,1.18vw,19px)/1.65 Georgia,serif;color:#6e5b4e;max-width:650px;margin:0 auto}
.final-archive-link{display:inline-flex;gap:18px;align-items:center;margin-top:38px;text-transform:uppercase;letter-spacing:.22em;font-size:9px;color:#6f513d;border-bottom:1px solid rgba(89,61,43,.36);padding-bottom:8px}
.final-archive-link span{font-size:18px;font-weight:400}

/* CLEAN FINAL responsive-fit pass: preserve faces and top framing across desktop, tablet and mobile. */
/* CLEAN FINAL hero: the new architectural room remains the single full-bleed arrival image. */
.arrival-media img{transform:scale(1.006);transform-origin:50% 49%}

/* CLEAN FINAL archive: preserve the two new documentary photographs cleanly. */
.archive-item[data-id="vita-dello-studio"] img{object-position:center 44%}
.archive-item[data-id="valore-del-confronto"] img{object-position:center 48%}

@media (min-width:761px) and (max-width:1100px) and (orientation:portrait){
  .moment-scene,.moment-scene.moment-right{display:grid;grid-template-columns:1fr;grid-template-rows:62svh 38svh;background:#f4eee6}
  .moment-media,.moment-left .moment-media,.moment-right .moment-media{grid-column:1;grid-row:1;clip-path:inset(var(--scene-reveal) 0 0 0);box-shadow:none}
  .moment-contain .moment-media,.moment-wide .moment-media{padding:28px 42px}
  .moment-copy,.moment-left .moment-copy,.moment-right .moment-copy{grid-column:1;grid-row:2;padding:30px clamp(42px,7vw,70px) 48px;align-self:start}
  .moment-copy h3{font-size:clamp(46px,7vw,62px);margin-bottom:16px}
  .moment-copy>p{font-size:14px;line-height:1.58;max-width:660px}
  .moment-signature{top:22px;right:28px!important;left:auto!important;width:27px}
  .final-close-inner{width:min(760px,86vw)}
}

@media(max-width:760px){
  .arrival-media img{object-position:50% 46%!important}
  .moment-scene,.moment-scene.moment-right{display:grid;grid-template-columns:1fr;grid-template-rows:58svh 42svh;background:#f4eee6}
  .moment-media,.moment-left .moment-media,.moment-right .moment-media{grid-column:1;grid-row:1;clip-path:inset(var(--scene-reveal) 0 0 0);box-shadow:none}
  .moment-contain .moment-media,.moment-wide .moment-media{padding:18px 22px}
  .moment-contain .moment-media img,.moment-wide .moment-media img{object-fit:contain}
  .moment-copy,.moment-left .moment-copy,.moment-right .moment-copy{grid-column:1;grid-row:2;padding:30px 22px 54px;align-self:start}
  .moment-copy h3{font-size:clamp(40px,11vw,56px);margin-bottom:15px}
  .moment-copy>p{font-size:13.5px;line-height:1.56;max-width:none}
  .moment-signature{top:18px;right:18px!important;left:auto!important;width:24px}
  .final-close-inner{width:92vw;padding:54px 20px}
  .final-close-mark{width:38px;margin-bottom:24px}
  .final-close-inner h3{font-size:clamp(52px,14vw,72px);margin-bottom:22px}
  .final-close-inner>p{font-size:14px;line-height:1.58;max-width:94%}
  .final-archive-link{margin-top:30px;font-size:8px}
}

/* CLEAN FINAL responsive rule for the horizontal meeting: the frame follows the 4:3 source,
   so the complete photograph fills its available frame without crop or letterboxing. */
@media (min-width:761px) and (max-width:1100px) and (orientation:portrait){
  .moment-wide{grid-template-rows:auto 1fr}
  .moment-wide .moment-media{height:auto;aspect-ratio:4/3;padding:0;background:#e9dfd4}
  .moment-wide .moment-media img{width:100%;height:100%;object-fit:cover;box-shadow:none}
  .moment-wide .moment-copy{grid-row:2}
}
@media(max-width:760px){
  .moment-wide{grid-template-rows:auto 1fr}
  .moment-wide .moment-media{height:auto;aspect-ratio:4/3;padding:0;background:#e9dfd4}
  .moment-wide .moment-media img{width:100%;height:100%;object-fit:cover;box-shadow:none}
  .moment-wide .moment-copy{grid-row:2}
}

/* CLEAN FINAL archive focal tuning: keep faces comfortably visible in the thumbnail mosaic. */
.archive-item[data-id="hero"] img{object-position:center 48%}
.archive-item[data-id="maria-vittoria-pegoli"] img{object-position:center 24%}
.archive-item[data-id="stefania-pegoli"] img{object-position:center 23%}
.archive-item[data-id="tommaso-di-pasquale"] img{object-position:center 25%}
.archive-item[data-id="valeria-nicoletti"] img{object-position:center 24%}
.archive-item[data-id="giuseppe-pegoli"] img{object-position:center 24%}
.archive-item[data-id="studio-pegoli"] img{object-position:center top}

/* CLEAN FINAL swapped scene focal tuning. */
.gallery-scene[data-scene="storia-contemporaneita"] .studio-media img{object-position:72% 49%!important}
.gallery-scene[data-scene="equilibrio-accoglienza"] .studio-media img{object-position:50% 49%!important}
.archive-item[data-id="storia-contemporaneita"] img{object-position:center 42%}
.archive-item[data-id="equilibrio-accoglienza"] img{object-position:center 48%}
.archive-item[data-id="vita-dello-studio"] img{object-position:center 46%}

@media(max-width:760px){
  .gallery-scene[data-scene="storia-contemporaneita"] .studio-media img{object-position:68% 48%!important}
  .gallery-scene[data-scene="equilibrio-accoglienza"] .studio-media img{object-position:47% 49%!important}
}

@media (min-width:761px) and (max-width:1100px) and (orientation:portrait){
  .gallery-scene[data-scene="storia-contemporaneita"] .studio-media img{object-position:70% 48%!important}
  .gallery-scene[data-scene="equilibrio-accoglienza"] .studio-media img{object-position:49% 49%!important}
}

/* =============================================================
   MOBILE CINEMATIC PORTRAITS V2
   Immersive image first, readable overlay only on explicit request.
   Original desktop and tablet editorial compositions are unchanged.
   ============================================================= */
.person-expand{display:none}
@supports(height:100dvh){
  .gallery-sticky{height:100dvh}
  .gallery-arrival{height:100dvh}
}
@media (max-width:760px) and (orientation:portrait){
  /* The sticky stage follows Safari's changing visual viewport, not its svh. */
  .gallery-scene{min-height:0}
  .gallery-arrival{min-height:0}
  .person-scene,.person-scene.portrait-left,.person-scene.portrait-right{
    display:block;position:absolute;inset:0;background:#090807;color:#fff;
  }
  .person-scene .portrait-field,
  .person-scene.portrait-left .portrait-field,
  .person-scene.portrait-right .portrait-field{
    position:absolute;inset:0;width:100%;height:100%;min-width:0;max-width:none;
    display:block;clip-path:inset(var(--scene-reveal) 0 0 0);
    background:#111010;box-shadow:none;
  }
  .person-scene.first-person .portrait-field{clip-path:inset(0 var(--door-inset) 0 var(--door-inset))}
  .person-scene .portrait-field img{
    display:block;width:100%;height:100%;object-fit:cover;
    object-position:50% 42%!important;
    background:#121010;filter:grayscale(1) contrast(1.045);
    transform:scale(calc(var(--scene-scale) * 1.018)) translate3d(0,var(--scene-out-shift),0);
    transform-origin:center 43%;
  }
  /* Individual framing follows each portrait rather than an arbitrary global crop. */
  .person-scene[data-scene="maria-vittoria-pegoli"] .portrait-field img{object-position:52% 38%!important}
  .person-scene[data-scene="stefania-pegoli"] .portrait-field img{object-position:50% 40%!important}
  .person-scene[data-scene="tommaso-di-pasquale"] .portrait-field img{object-position:51% 39%!important}
  .person-scene[data-scene="valeria-nicoletti"] .portrait-field img{object-position:50% 40%!important}
  .person-scene[data-scene="giuseppe-pegoli"] .portrait-field img{object-position:50% 41%!important}
  .person-scene .portrait-field::after{
    z-index:1;inset:0;
    background:linear-gradient(180deg,rgba(5,5,5,.30) 0%,transparent 20%,transparent 43%,rgba(4,3,3,.13) 54%,rgba(4,3,3,.52) 73%,rgba(4,3,3,.91) 100%);
  }
  .person-scene .portrait-index{left:22px;bottom:22px;font-size:8px;opacity:.38}
  .person-scene .name-ghost{display:none}
  .person-scene .person-copy,
  .person-scene.portrait-left .person-copy,
  .person-scene.portrait-right .person-copy{
    display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;
    position:absolute;z-index:5;left:0;right:0;top:auto;bottom:0;
    width:100%;height:auto;max-height:calc(100% - 77px);
    padding:28px 25px max(78px,calc(env(safe-area-inset-bottom) + 58px));
    overflow:visible;background:transparent;color:#fff;
    opacity:var(--person-copy-opacity);
    transform:translate3d(0,calc(var(--scene-in-shift) * .32),0);
    pointer-events:none;
  }
  .person-scene .person-copy .scene-kicker{
    color:#e6c7a8;letter-spacing:.27em;font-size:8px;font-weight:600;margin:0 0 14px;
    text-shadow:0 1px 15px rgba(0,0,0,.6);
  }
  .person-scene .person-copy h3{
    max-width:100%;font:400 clamp(37px,10.3vw,57px)/.95 Georgia,'Times New Roman',serif;
    color:#fff;letter-spacing:-.057em;margin:0 0 12px;
    text-shadow:0 2px 24px rgba(0,0,0,.27);text-wrap:balance;
  }
  .person-scene .person-role{
    color:#e5d1c0;font-size:9px;font-weight:700;letter-spacing:.135em;
    line-height:1.5;margin:0 0 15px;max-width:310px;text-shadow:0 2px 15px rgba(0,0,0,.5);
  }
  .person-scene .person-expand{
    display:inline-flex;align-items:center;justify-content:space-between;gap:19px;
    min-height:43px;padding:11px 16px;border:1px solid rgba(255,255,255,.5);
    border-radius:999px;background:rgba(14,12,11,.35);
    color:#fff;font:650 10px/1 Inter,system-ui,sans-serif;
    letter-spacing:.13em;text-transform:uppercase;
    -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
    cursor:pointer;pointer-events:auto;transition:background .25s,border-color .25s;
    -webkit-tap-highlight-color:transparent;
  }
  .person-scene .person-expand svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transform:rotate(180deg);transition:transform .35s cubic-bezier(.22,1,.36,1)}
  .person-scene.is-profile-open .person-expand svg{transform:rotate(0)}
  .person-scene .person-expand:hover,.person-scene .person-expand:focus-visible{background:rgba(40,30,24,.87);border-color:#e0c4ad}
  .person-scene .person-expand:focus-visible{outline:2px solid #f2d2af;outline-offset:3px}
  .person-scene .person-details{
    display:block;width:100%;min-width:0;max-height:0;overflow:hidden;
    opacity:0;visibility:hidden;pointer-events:none;
    transform:translateY(12px);
    transition:max-height .43s cubic-bezier(.22,1,.36,1), opacity .27s ease, transform .43s cubic-bezier(.22,1,.36,1),visibility 0s linear .43s;
  }
  .person-scene.is-profile-open .person-details{
    max-height:min(46dvh,420px);opacity:1;visibility:visible;
    transform:translateY(0);pointer-events:auto;overflow-y:auto;
    overscroll-behavior-y:auto;-webkit-overflow-scrolling:touch;
    scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.3) transparent;
    transition:max-height .43s cubic-bezier(.22,1,.36,1),opacity .30s ease .06s,transform .43s cubic-bezier(.22,1,.36,1),visibility 0s;
  }
  .person-scene .person-details-inner{
    padding:17px 1px 5px;margin-top:16px;
    border-top:1px solid rgba(248,224,201,.35);
  }
  .person-scene .person-bio{
    font:400 clamp(14px,3.8vw,16px)/1.54 Georgia,serif;color:#f5f0ed;margin:0;
    text-shadow:0 2px 12px rgba(0,0,0,.4);
  }
  .person-scene .person-detail{
    font:450 11px/1.56 Inter,system-ui,sans-serif;color:#d8c8bd;
    letter-spacing:0;margin:15px 0 0;padding:13px 0 0;
    border-top:1px solid rgba(248,224,201,.23);
  }
  .person-scene.is-profile-open .portrait-field::after{
    background:linear-gradient(180deg,rgba(5,5,5,.35) 0%,rgba(5,5,5,.13) 25%,rgba(5,5,5,.35) 43%,rgba(5,4,4,.78) 64%,rgba(4,3,3,.98) 100%);
  }
  .person-scene.is-profile-open .person-copy{max-height:calc(100% - 77px)}
  .person-scene .team-intro-copy,
  .person-scene.portrait-left .team-intro-copy{
    position:absolute;z-index:7;left:25px;right:25px;top:auto;bottom:clamp(118px,18dvh,186px);
    width:auto;height:auto;padding:0;overflow:visible;transform:translateY(0);
    opacity:var(--team-intro-opacity);pointer-events:none;
    filter:drop-shadow(0 4px 22px rgba(0,0,0,.48));
  }
  .person-scene .team-intro-copy .scene-kicker{color:#e3bb93}
  .person-scene .team-intro-copy h3{font-size:clamp(40px,10vw,55px);color:#fff;margin:0 0 15px}
  .person-scene .team-intro-copy h3 em{color:#ebcbb0}
  .person-scene .team-intro-copy p{color:#e4d6cc;font-size:14px;line-height:1.5}
  html.gallery-in-portrait .gallery-counter{color:#fff;bottom:max(23px,env(safe-area-inset-bottom));text-shadow:0 2px 12px #000}
  html.gallery-in-portrait .gallery-counter i{background:rgba(255,255,255,.68)}
  html.gallery-in-portrait .gallery-progress-line{background:rgba(255,255,255,.15)}
  html.gallery-in-portrait .gallery-progress-line i{background:#dfc3a7}
}
@media (max-width:760px) and (orientation:portrait) and (max-height:720px){
  .person-scene .person-copy,.person-scene.portrait-left .person-copy,.person-scene.portrait-right .person-copy{padding-bottom:max(58px,calc(env(safe-area-inset-bottom) + 48px))}
  .person-scene .person-copy h3{font-size:clamp(31px,9vw,45px)}
  .person-scene.is-profile-open .person-details{max-height:min(36dvh,300px)}
}
@media(prefers-reduced-motion:reduce){
  .person-scene .person-expand svg,.person-scene .person-details{transition:none!important}
}

/* Prevent invisible scenes from intercepting taps via their disclosure button. */
@media (max-width:760px) and (orientation:portrait){
  .person-scene:not(.is-interactive) .person-expand,
  .person-scene:not(.is-interactive) .person-details{pointer-events:none!important}
}

/* Accessible non-animated reading path: portraits stack normally instead of
   occupying the same absolute stage when reduced motion is requested. */
@media (max-width:760px) and (orientation:portrait) and (prefers-reduced-motion:reduce){
  .gallery-sticky{height:auto!important;position:relative;overflow:visible}
  .gallery-scene.person-scene{position:relative!important;inset:auto!important;min-height:100svh!important;opacity:1!important}
  .person-scene .person-copy,.person-scene.portrait-left .person-copy,.person-scene.portrait-right .person-copy{opacity:1!important;transform:none!important}
}


/* =============================================================
   MOBILE TEAM COLLAGE V2.1 — HEADER-SAFE FRAMING
   The five-person authored montage is deliberately offset below
   fixed iPhone Safari navigation, rather than obscuring faces.
   Static safe-area spacing does not vary with browser-toolbar DVH.
   Desktop and individual immersive portraits remain untouched.
   ============================================================= */
@media (max-width: 760px) and (orientation: portrait) {
  .gallery-scene.closing-scene {
    /* nav top = safe-area + 10px, nav height = 39px; gap >= 13px */
    padding-top: clamp(62px, calc(55px + env(safe-area-inset-top, 0px)), 112px);
    min-height: 100dvh;
    background: #090706;
  }
  .closing-scene .closing-wall {
    margin-top: 0;
    flex: 0 0 auto;
    width: 100%;
    max-width: 100%;
    aspect-ratio: 1672 / 941;
  }
  .closing-scene .closing-copy {
    padding-top: clamp(21px, 3.1vh, 29px);
    padding-bottom: max(49px, calc(env(safe-area-inset-bottom, 0px) + 28px));
    min-height: 0;
  }
}


/* =============================================================
   RESPONSIVE QA V3 — stable tablet/mobile scene sizing
   All dimensions below affect non-desktop gallery compositions.
   The existing svh rules above remain as fallbacks for browsers
   without dynamic viewport unit support.
   ============================================================= */
@supports (height: 100dvh) {
  /* Sticky scenes are 100dvh; their internal grids must sum to 100dvh too.
     Otherwise retracting Safari's toolbar reveals an unpainted strip. */
  @media (min-width: 761px) and (max-width: 1100px) and (orientation: portrait) {
    .studio-scene,.studio-scene.editorial-right,
    .person-scene,.moment-scene,.moment-scene.moment-right {
      grid-template-rows: 62dvh 38dvh;
    }
    .person-scene .portrait-field,
    .person-scene.portrait-left .portrait-field,
    .person-scene.portrait-right .portrait-field {height:62dvh}
    .person-scene .person-copy,.person-scene .team-intro-copy,
    .person-scene.portrait-left .person-copy,.person-scene.portrait-left .team-intro-copy,
    .person-scene.portrait-right .person-copy,.person-scene.portrait-right .team-intro-copy {
      top:62dvh;height:38dvh;
    }
  }
  @media (max-width: 760px) {
    .studio-scene,.studio-scene.editorial-right,
    .moment-scene,.moment-scene.moment-right {grid-template-rows:58dvh 42dvh}
    .gallery-scene.studio-scene,.gallery-scene.moment-scene {min-height:0}
    /* Applies only to non-cinematic portrait layout, e.g. landscape. */
    .person-scene:not(.is-profile-open) {min-height:0}
  }
  @media (max-width: 760px) and (orientation:landscape) {
    .person-scene{grid-template-rows:57dvh 43dvh}
    .portrait-field,.portrait-left .portrait-field,.portrait-right .portrait-field{height:57dvh}
    .person-copy,.team-intro-copy,.portrait-left .person-copy,.portrait-left .team-intro-copy,
    .portrait-right .person-copy,.portrait-right .team-intro-copy {top:57dvh;height:43dvh}
  }
}

/* The original group photo must remain fully legible. Let the editorial
   heading occupy the center of the unused lower part on tall tablets. */
@media (min-width: 761px) and (max-width: 1100px) and (orientation: portrait) {
  .closing-scene .closing-copy {
    display:flex;flex-direction:column;justify-content:center;align-items:flex-start;
    padding-bottom:clamp(58px,8dvh,112px);
    min-height:0;
  }
  .closing-scene .closing-copy h3 {
    font-size:clamp(49px,7.2vw,72px);
    line-height:.94;
  }
}
@media (max-width: 760px) and (orientation: portrait) {
  /* Maintain V2.1's safe zone above the collage; rebalance below it. */
  .closing-scene .closing-copy {
    display:flex;flex-direction:column;justify-content:center;align-items:flex-start;
    padding-bottom:max(70px,calc(env(safe-area-inset-bottom,0px) + 38px));
  }
  .closing-scene .closing-copy h3{font-size:clamp(42px,11.3vw,58px)}
}
/* Only shorten the dark panel; keep its text out of the navigation zone. */
@media (min-width:761px) and (max-width:1100px) and (orientation:landscape){
  .closing-scene .closing-copy{justify-content:center}
}

/* Taller cards need a visible reading path when resized mid-animation. */
@media (min-width:761px) and (max-width:1100px) and (orientation:portrait){
  .person-scene .person-copy{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none}
  .person-scene .person-copy::-webkit-scrollbar{display:none}
}

/* QA V3: tablet group image must never sit beneath floating navigation. */
@media (min-width:761px) and (max-width:1100px) and (orientation:portrait){
  .gallery-scene.closing-scene{
    padding-top:clamp(70px,calc(60px + env(safe-area-inset-top,0px)),108px);
  }
  .closing-scene .closing-copy{
    padding-top:14px;
    padding-bottom:clamp(46px,6dvh,86px);
  }
}
@media (min-width:761px) and (max-width:1200px) and (orientation:landscape){
  /* Fit the authored group panorama between header and title, rather than
     allowing tablet navigation to obscure anyone's face. */
  .gallery-scene.closing-scene{
    padding-top:clamp(62px,calc(58px + env(safe-area-inset-top,0px)),92px);
    display:flex;flex-direction:column;align-items:stretch;
  }
  .closing-scene .closing-wall{
    position:relative;inset:auto;align-self:center;
    width:auto;max-width:100%;height:auto;
    aspect-ratio:1672 / 941;
    /* Native aspect ratio; capped by the available vertical room. */
    max-height:calc(100dvh - 204px);
    flex:0 1 auto;
  }
  .closing-scene .closing-wall img{object-fit:contain;object-position:center center!important}
  .closing-scene .closing-copy{
    position:relative;left:auto;right:auto;top:auto;bottom:auto;
    flex:1;min-height:0;display:flex;flex-direction:column;
    justify-content:center;align-items:flex-start;
    padding:12px clamp(24px,3.2vw,42px) max(24px,env(safe-area-inset-bottom));
  }
  .closing-scene .closing-copy h3{font-size:clamp(32px,4vw,46px);margin-bottom:6px;line-height:.92}
  .closing-scene .closing-copy p{font-size:12px;line-height:1.36;margin-bottom:0}
}

/* Older WebKit/Firefox fallback for the profile sheet when dvh is absent.
   Place before the dvh override, so modern browsers keep precise sizing. */
@media (max-width:760px) and (orientation:portrait) {
  @supports not (height:100dvh) {
    .person-scene.is-profile-open .person-details {max-height:min(46vh,420px)}
    .person-scene .team-intro-copy,.person-scene.portrait-left .team-intro-copy {bottom:clamp(118px,18vh,186px)}
  }
}
@media (max-width:760px) and (orientation:portrait) and (max-height:720px) {
  @supports not (height:100dvh) {
    .person-scene.is-profile-open .person-details {max-height:min(36vh,300px)}
  }
}

/* The 701–760px compact-tablet header is 42px tall (not the 39px phone
   header); give its five-person group photo the same comfortable clearance. */
@media (min-width:701px) and (max-width:760px) and (orientation:portrait){
  .gallery-scene.closing-scene{padding-top:max(74px,calc(66px + env(safe-area-inset-top,0px)))}
}

/* V4: reserve composited layers for chapters currently participating in a transition. */
.gallery-scene.is-render-near { will-change: opacity,transform; }
.gallery-scene:not(.is-render-near) .studio-media img,
.gallery-scene:not(.is-render-near) .portrait-field img,
.gallery-scene:not(.is-render-near) .moment-media img,
.gallery-scene:not(.is-render-near) .scene-copy,
.gallery-scene:not(.is-render-near) .team-intro-copy { will-change:auto; }
@media (prefers-reduced-motion: reduce) {
  .gallery-scene,.gallery-scene.is-render-near {will-change:auto;}
}
