/* The personal archive: real photographs, a restrained cinematic presentation. */
.hero-portrait{position:absolute;right:calc(var(--pad) + 28px);top:50%;transform:translateY(-35%);width:clamp(230px,23vw,355px);margin:0;isolation:isolate}
.hero-portrait::before{content:'';position:absolute;inset:-13px;z-index:-1;border:1px solid #badde224;border-right-color:transparent;border-bottom-color:transparent;pointer-events:none}
.hero-portrait>a{display:block;overflow:hidden;background:#17222a;aspect-ratio:465/621}
.hero-portrait img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.73) brightness(.9) contrast(1.05);transition:filter .7s ease,transform 1.4s var(--cinema-ease)}
.hero-portrait>a:hover img{filter:saturate(.95) brightness(.98) contrast(1.02);transform:scale(1.025)}
.hero-portrait figcaption{position:absolute;bottom:0;left:0;right:0;padding:65px 22px 21px;background:linear-gradient(transparent,#081016ed);display:flex;flex-direction:column;gap:9px;pointer-events:none}
.hero-portrait figcaption>span{font-size:7px;letter-spacing:.16em;color:#a1bdc8;line-height:1.6}
.hero-portrait figcaption>strong{font-size:17px;letter-spacing:-.025em;font-weight:400}
.hero-portrait figcaption>small{font-size:8px;color:#839da9;line-height:1.5}
.archive-sequence{border-top:1px solid var(--line);position:relative;background:#0b1116}
.archive-scene{position:relative;isolation:isolate;min-height:720px;height:95svh;max-height:1100px;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:110px var(--pad) 135px}
.archive-scene-photo{position:absolute;z-index:-3;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 52%;transform:scale(calc(1.045 + var(--archive-progress,.5)*.035)) translate3d(0,calc((var(--archive-progress,.5) - .5)*-2%),0);filter:saturate(.68) contrast(1.12) brightness(.85);will-change:transform}
.archive-scene-shade{position:absolute;z-index:-2;inset:0;background:linear-gradient(90deg,#030a11b0 0%,#030a115e 34%,#030a1100 70%),linear-gradient(0deg,#060b11eb 0%,#060b115c 24%,transparent 58%,#060b1145 85%,#060b11bb 100%)}
.archive-scene::after{content:'';position:absolute;inset:0;border-top:22px solid #080d12;border-bottom:22px solid #080d12;pointer-events:none;z-index:1}
.archive-scene-top,.archive-scene-bottom{position:absolute;left:var(--pad);right:var(--pad);display:flex;justify-content:space-between;gap:24px;align-items:center;font-size:8px;letter-spacing:.17em;line-height:1.6;color:#b3c8d1;z-index:2}
.archive-scene-top{top:55px}.archive-scene-bottom{bottom:52px;color:#829eac}
.archive-scene-bottom>a{font-size:10px;letter-spacing:normal;color:#d6e9ed;border-bottom:1px solid #badde244;padding-bottom:8px}
.archive-scene-bottom>a>span{margin-left:16px;color:var(--ice)}
.archive-scene-copy{max-width:700px;transform:translate3d(0,calc((var(--archive-progress,.5) - .5)*-30px),0)}
.archive-scene-copy>.eyebrow{color:#bbd8e1;margin-bottom:28px}
.archive-scene-copy h2{font-size:clamp(75px,8.3vw,135px);line-height:.98;letter-spacing:-.065em;text-shadow:0 2px 50px #0005}
.archive-scene-copy>p:last-child{color:#b0c7d2;font-size:12px;line-height:1.85;margin-top:24px;margin-bottom:0}
.archive-frame-line{position:absolute;left:var(--pad);top:43%;height:72px;width:1px;background:linear-gradient(transparent,#c5e8ee,transparent);opacity:.45}
.archive-strip{padding:100px var(--pad) 110px;display:grid;grid-template-columns:1.05fr .8fr;gap:9vw;align-items:start;max-width:1540px;margin:0 auto}
.archive-figure{margin:0;min-width:0}
.archive-figure>a{display:block;position:relative;overflow:hidden;background:#18232b}
.archive-figure img{display:block;width:100%;object-fit:cover;filter:saturate(.72) brightness(.9) contrast(1.07);transition:filter .7s ease,transform 1.2s var(--cinema-ease)}
.archive-figure>a:hover img,.archive-figure>a:focus-visible img{filter:saturate(.95) brightness(1) contrast(1.03);transform:scale(1.025)}
.working-figure img{aspect-ratio:1;object-position:40% 48%;filter:saturate(.8) brightness(1.12) contrast(1.04)}
.working-figure>a:hover img,.working-figure>a:focus-visible img{filter:saturate(.95) brightness(1.16) contrast(1.02)}
.panasonic-figure{margin-top:135px}.panasonic-figure img{aspect-ratio:1;object-position:center}
.photo-expand{position:absolute;right:18px;bottom:18px;display:grid;place-items:center;width:34px;height:34px;border:1px solid #d7f1f455;border-radius:50%;color:#e1f0f4;font-size:18px;background:#08151b40;backdrop-filter:blur(8px)}
.archive-figure figcaption{margin-top:24px;padding-top:20px;border-top:1px solid var(--line)}
.archive-figure figcaption>span{font-size:8px;letter-spacing:.17em;color:#7894a2;display:block;margin-bottom:13px}
.archive-figure figcaption>strong{font-size:28px;font-weight:400;letter-spacing:-.035em}
.archive-figure figcaption>p{font-size:12px;color:#8fa6b3;line-height:1.8;margin-top:14px;max-width:340px;margin-bottom:0}
.publication{display:grid;grid-template-columns:1.1fr .8fr;gap:10vw;align-items:center;border-top:1px solid var(--line);background:radial-gradient(ellipse at 85% 60%,#22363f50,transparent 55%),#0c1319;overflow:hidden}
.publication-copy{max-width:650px}.publication-copy h2{font-size:clamp(44px,4.8vw,78px)}
.publication-copy>p:not(.eyebrow):not(.small-note){font-size:13px;color:#a5b7c3;line-height:1.9;margin-top:30px;max-width:480px}
.publication-source{display:flex;flex-direction:column;gap:12px;margin:34px 0;border-top:1px solid var(--line);padding-top:23px}
.publication-source>span:first-child{font-size:7px;letter-spacing:.17em;color:#8aa7b5}
.publication-source strong{font-size:12px;font-weight:400;color:#c9d9df;line-height:1.7}
.publication-source>span:last-child{font-size:10px;color:#819aa8;line-height:1.8}
.publication-copy .button{font-size:11px;gap:25px}
.publication-copy>.small-note{font-size:9px;margin-top:16px;line-height:1.8}
.publication-preview{display:block;position:relative;padding:27px;background:linear-gradient(145deg,#20333e,#121e26);box-shadow:0 25px 80px #0005;transform:rotate(2deg);max-width:400px;justify-self:end;width:100%;transition:transform .7s var(--cinema-ease)}
.publication-preview:hover{transform:rotate(0) translateY(-5px)}
.js-enabled .publication-preview.is-visible{transform:rotate(2deg)}
.js-enabled .publication-preview.is-visible:hover{transform:rotate(0) translateY(-5px)}
.publication-preview img{display:block;width:100%;height:auto;box-shadow:0 7px 26px #0007}
.publication-date{position:absolute;left:-29px;top:-21px;background:#bddbe0;color:#0a161f;font-size:9px;letter-spacing:.12em;padding:18px 20px;z-index:1;line-height:1.9;box-shadow:0 10px 30px #0004}
.publication-date strong{font-size:22px;font-weight:400;letter-spacing:-.04em}
.publication-preview-caption{display:flex;justify-content:space-between;gap:20px;margin-top:22px;font-size:7px;letter-spacing:.13em;color:#a6c0cb;line-height:1.6}
.photo-dialog{max-width:none;max-height:none;width:100vw;height:100dvh;margin:0;padding:0;border:0;background:#070c12f5;color:var(--text)}
.photo-dialog::backdrop{background:#020609ed;backdrop-filter:blur(15px)}
.viewer-shell{height:100%;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:20px;padding:30px clamp(20px,4vw,65px)}
.viewer-header{display:flex;justify-content:space-between;gap:30px;align-items:center;padding-bottom:15px;border-bottom:1px solid #badde21c}
.viewer-counter{font-size:9px;letter-spacing:.13em;color:#92b0bf}
.viewer-header>button{background:transparent;color:#bcd3dd;font-size:11px;padding:10px 0 10px 25px;display:flex;align-items:center;gap:20px}
.viewer-header>button>span{font-size:27px;font-weight:300;line-height:1}
.viewer-stage{min-height:0;display:grid;grid-template-columns:40px minmax(0,1fr) 40px;gap:25px;align-items:center;justify-content:center}
.viewer-stage>img{display:block;width:100%;height:100%;max-height:100%;min-height:0;object-fit:contain}
.viewer-stage>button{width:40px;height:40px;border-radius:50%;border:1px solid #a5cfdd35;background:#b9edff08;color:#cae4ed;font-size:22px;justify-self:center}
#viewer-caption{text-align:center;font-size:11px;color:#a7bdc8;margin:0;line-height:1.8}
body.photo-viewer-open{overflow:hidden}
.motion-off .archive-scene-photo,.motion-off .archive-scene-copy{transform:none!important}
.motion-off .hero-portrait>a:hover img,.motion-off .archive-figure>a:hover img,.motion-off .publication-preview,.motion-off .publication-preview:hover{transform:none!important}
@media(max-width:1200px){.hero-portrait{width:23vw;right:calc(var(--pad) + 10px)}.hero-copy{max-width:650px}.hero-portrait figcaption{padding:55px 17px 18px}.hero-portrait figcaption>span{font-size:6px}.publication{gap:7vw}.publication-preview{padding:20px}.publication-date{left:-20px}}
@media(max-width:1050px){.hero-portrait{display:none}.archive-scene{min-height:620px;height:85svh;padding-bottom:120px}.archive-scene-copy h2{font-size:90px}.archive-strip{gap:7vw;padding-top:80px;padding-bottom:85px}.panasonic-figure{margin-top:100px}.publication{gap:6vw}.publication-copy h2{font-size:49px}.publication-copy .eyebrow{font-size:8px}.publication-source>span:last-child{font-size:9px}}
@media(max-width:760px){
  .hero-portrait{display:block;top:155px;right:var(--pad);width:70px;transform:none}
  .hero-portrait::before,.hero-portrait figcaption{display:none}
  .hero-portrait>a{aspect-ratio:70/84;border-radius:2px}.hero-portrait img{object-position:center 25%;filter:saturate(.8) brightness(.97)}
  .hero-role{max-width:230px}
  .archive-scene{min-height:590px;height:85svh;max-height:850px;padding:105px var(--pad) 122px}
  .archive-scene-photo{object-position:51% 45%;filter:saturate(.74) contrast(1.1) brightness(.82)}
  .archive-scene-shade{background:linear-gradient(90deg,#030a1170,#030a1100 85%),linear-gradient(0deg,#060b11f5 0%,#060b1166 28%,transparent 58%,#060b1155 85%,#060b11bb 100%)}
  .archive-scene::after{border-top-width:16px;border-bottom-width:16px}
  .archive-scene-top{top:39px;font-size:6px;letter-spacing:.11em;gap:15px}
  .archive-scene-bottom{bottom:37px;font-size:6px;letter-spacing:.09em;gap:20px;align-items:end}
  .archive-scene-bottom>span{max-width:175px;line-height:1.9}
  .archive-scene-bottom>a{font-size:9px;white-space:nowrap}.archive-scene-bottom>a>span{margin-left:8px}
  .archive-scene-copy h2{font-size:clamp(61px,13vw,95px)}
  .archive-scene-copy>.eyebrow{font-size:8px;margin-bottom:22px}
  .archive-scene-copy>p:last-child{font-size:10px;line-height:1.9;margin-top:21px}
  .archive-frame-line{display:none}
  .archive-strip{padding:65px var(--pad) 75px;grid-template-columns:1fr;gap:45px}
  .panasonic-figure{margin-top:0;max-width:420px;margin-left:30px}
  .working-figure{margin-right:20px}.archive-figure figcaption{margin-top:19px;padding-top:18px}
  .archive-figure figcaption>strong{font-size:26px}.archive-figure figcaption>p{font-size:11px;margin-top:11px}
  .publication{grid-template-columns:1fr;gap:57px;padding-top:80px;padding-bottom:80px}
  .publication-copy h2{font-size:clamp(42px,9vw,62px)}
  .publication-copy>p:not(.eyebrow):not(.small-note){font-size:12px;margin-top:24px}
  .publication-source{margin:27px 0;padding-top:20px;gap:10px}
  .publication-source strong{font-size:11px}.publication-copy .button{font-size:10px;gap:20px}
  .publication-preview{max-width:330px;width:calc(100% - 25px);margin-right:0;justify-self:center;padding:20px}
  .publication-date{left:-15px;top:-18px;padding:12px 15px;font-size:8px}.publication-date strong{font-size:20px}
  .viewer-shell{padding:18px 16px 24px;gap:18px}.viewer-header{padding-bottom:9px}.viewer-stage{grid-template-columns:26px minmax(0,1fr) 26px;gap:8px}
  .viewer-stage>button{width:28px;height:34px;font-size:19px;border-color:transparent;background:transparent}
  #viewer-caption{font-size:10px;line-height:1.7}.viewer-counter{font-size:8px}
}
@media(prefers-reduced-motion:reduce){.archive-scene-photo,.archive-scene-copy{transform:none!important}.hero-portrait>a:hover img,.archive-figure>a:hover img,.publication-preview:hover{transform:none!important}}
@media print{.hero-portrait,.archive-sequence,.publication-preview,.photo-dialog{display:none!important}.publication{display:block}.publication-copy{max-width:none}.publication-copy h2{font-size:35px}}
