@font-face{font-family:Inter;src:url('assets/identity-v2/InterVariable.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:'Bodoni Moda';src:url('assets/fonts/BodoniModa-Italic-500.ttf') format('truetype');font-style:italic;font-weight:500;font-display:swap}
:root{color-scheme:dark;--background:#202923;--foreground:#F5F3EC;--secondary:#B8C0B7;--space:clamp(24px,4vw,56px);--ease-out:cubic-bezier(.23,1,.32,1);--ease-in-out:cubic-bezier(.77,0,.175,1)}
*{box-sizing:border-box}
html{background:var(--background);color:var(--foreground);font-family:Inter,Arial,sans-serif;scroll-behavior:auto}
body{margin:0}
img,video,canvas{display:block;max-width:100%}
.brand{position:absolute;inset:var(--space) auto auto var(--space);z-index:10;width:280px;max-width:calc(100% - 2*var(--space));pointer-events:none}
.brand img{width:100%;height:auto}
.brand{transform-origin:0 0}
.brand-reveal{position:relative;z-index:1}
.brand-echo{display:none;position:absolute;inset:0;opacity:0}
.stage{display:none}
h1,h2{font-size:clamp(36px,4.7vw,64px);font-weight:600;line-height:1.06;letter-spacing:-.035em;margin:0;text-wrap:balance;font-synthesis:none;color:var(--foreground)}
.email{display:block;margin-top:32px;color:var(--secondary);font-size:14px;font-weight:400;letter-spacing:0}
.reading-sequence{width:min(1040px,calc(100% - 48px));margin:auto;padding:170px 0 100px}
.reading-sequence section{margin:0 0 80px}
.reading-sequence h1,.reading-sequence h2{margin-bottom:36px}
.reading-sequence img{width:100%;height:auto;margin:0 0 24px}
.reading-closing{text-align:center;padding:60px 0}
.reading-closing h2{margin-bottom:0}
.reading-tagline{max-width:40ch;font-size:16px;line-height:1.6;color:var(--secondary);margin:0 0 64px}
/* Progressive enhancement: without JS the complete reading sequence stays visible. */
.motion .brand{position:fixed}
.motion .brand-echo{display:block}
.motion .story{--intro-travel:1.35;height:calc(850svh + 100svh*var(--intro-travel));position:relative}
.motion .stage{display:grid;place-items:center;position:sticky;top:0;height:100svh;overflow:hidden;isolation:isolate}
.motion .composition{width:min(1040px,84vw,calc((100svh - 2*var(--space) - 258px)*1.7778));position:relative;top:38px;opacity:0}
.intro{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}
.intro-lockup{width:min(1120px,calc(100% - 2*var(--space)),calc((100svh - 200px)*3.59425))}
.intro-logo-slot{width:100%;aspect-ratio:1125/313}
.intro-tagline{font-size:clamp(24px,2.3vw,32px);font-weight:500;line-height:1.4;letter-spacing:0;text-align:center;margin:36px 0 0;opacity:0;color:var(--foreground);font-synthesis:none}
.intro-cue{position:absolute;bottom:var(--space);left:0;right:0;text-align:center;font-size:12px;line-height:1.5;letter-spacing:.04em;color:var(--secondary)}
.visual{position:relative;width:100%;aspect-ratio:1672/941}
.scene{position:absolute;inset:0;opacity:0;visibility:hidden;overflow:hidden;transform-origin:center}
.scene img,.scene video,.scene canvas{width:100%;height:100%;object-fit:contain}
.scene--video img,.scene--video video,.scene--video canvas{position:absolute;inset:0}
.scene--video video,.scene--video canvas{opacity:0}
/* The packed color/matte file is never shown directly. */
.scene--alpha video{opacity:0!important;pointer-events:none}
.scene:first-child{opacity:1;visibility:visible}
.captions{height:104px;position:relative;margin-top:40px;text-align:center}
.caption{position:absolute;inset:0;opacity:0;visibility:hidden}
.phrase-part{display:inline-block;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.caption:first-child{opacity:1;visibility:visible}
.closing{position:absolute;inset:0;display:grid;grid-template-rows:minmax(0,1fr) auto auto;justify-items:center;padding:var(--space) var(--space) max(24px,env(safe-area-inset-bottom));text-align:center;opacity:0;visibility:hidden}
.closing h2{align-self:center;margin-top:8svh;max-width:1120px;font-size:clamp(52px,6.8vw,96px);line-height:1.02}
.closing .phrase-part:last-child{display:block}
.access-nav{display:flex;align-items:center;justify-content:center;gap:clamp(12px,3.5vw,56px);max-width:100%;font-family:'Bodoni Moda','Times New Roman',serif;font-size:clamp(32px,3.2vw,48px);font-style:italic;font-weight:500;line-height:1.25;font-synthesis:none}
.access-link{display:inline-flex;align-items:center;min-height:44px;padding:10px 3px;color:var(--foreground);white-space:nowrap;text-decoration-line:underline;text-decoration-thickness:1px;text-underline-offset:.22em;text-decoration-color:rgba(245,243,236,.4);transition:text-decoration-color 150ms ease}
.access-link[href]{cursor:pointer}
.access-link:hover,.access-link:focus-visible{color:var(--foreground);text-decoration-color:var(--foreground)}
.access-link:focus-visible,.email:focus-visible{outline:2px solid var(--foreground);outline-offset:5px}
.access-divider{color:var(--secondary);font-family:Inter,Arial,sans-serif;font-size:.5em;font-style:normal;font-weight:400;user-select:none}
.contact-footer{margin-top:clamp(32px,9svh,96px)}
.contact-footer .email{display:inline-flex;align-items:center;min-height:44px;margin:0;padding:8px 4px;font-size:13px;line-height:1.5;color:var(--secondary);text-decoration:none}
.contact-footer .email:hover{text-decoration:underline;text-underline-offset:4px}
.reading-closing .access-nav{margin-top:64px}
.motion .reading-closing .access-nav,.motion .reading-closing .contact-footer{display:none}
.motion .reading-sequence{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.motion .reading-sequence img{display:none}
@media(max-width:700px){
  :root{--space:24px}
  .brand{width:240px}
  .motion .story{height:calc(900svh + 100svh*var(--intro-travel))}
  .intro-lockup{width:min(calc(100% - 32px),calc((100svh - 200px)*3.59425))}
  .intro-tagline{font-size:clamp(19px,5.6vw,24px);line-height:1.4;margin-top:28px}
  .intro-tagline span{display:block}
  .motion .composition{width:calc(100% - 24px);top:0}
  .captions{height:116px;margin:32px 12px 0}
  h1,h2{font-size:clamp(36px,10.25vw,44px)}
  [data-caption="1"],.thesis-heading{font-size:clamp(28px,8.6vw,44px)}
  .caption .phrase-part,.closing .phrase-part{display:block}
  .closing h2{max-width:100%;font-size:clamp(46px,12vw,64px);line-height:1.05}
  .closing{padding-inline:16px;padding-bottom:max(12px,env(safe-area-inset-bottom))}
  .access-nav{font-size:clamp(17px,5.35vw,32px);gap:clamp(6px,1.6vw,12px)}
  .contact-footer{margin-top:clamp(24px,8svh,64px)}
  .reading-sequence{width:calc(100% - 32px);padding-top:140px}
  .reading-sequence section{margin-bottom:56px}
  .reading-sequence h1,.reading-sequence h2{margin-bottom:24px}
  .reading-sequence img{margin-bottom:16px}
}
@media(max-height:500px) and (min-width:701px){
  .brand{width:200px;top:20px;left:24px}
  .motion .composition{width:min(60vw,calc((100svh - 205px)*1.7778));top:25px}
  .captions{height:64px;margin-top:20px}
  h1,h2{font-size:32px}
}
@media(max-height:500px){
  .closing{padding-top:72px;padding-bottom:8px}
  .closing h2{margin-top:0;font-size:clamp(32px,6vw,52px)}
  .access-nav{font-size:clamp(17px,5.35vw,26px)}
  .contact-footer{margin-top:12px}
}
@media(max-height:500px) and (max-width:700px){
  .brand{width:180px;top:16px;left:20px}
  .motion .composition{width:min(calc(100% - 24px),calc((100svh - 170px)*1.7778));top:30px}
  .captions{height:64px;margin-top:20px}
  h1,h2{font-size:30px}
  .caption .phrase-part,.closing .phrase-part{display:inline-block}
  .closing .phrase-part:last-child{display:block}
  .closing h2{font-size:clamp(38px,6vw,52px)}
}
@media(prefers-reduced-motion:reduce){
  .motion .story{height:auto}
  .motion .stage{display:none}
  .motion .brand{position:absolute}
  .motion .reading-sequence{position:static;width:min(1040px,calc(100% - 48px));height:auto;padding:170px 0 100px;margin:auto;overflow:visible;clip-path:none;white-space:normal}
  .motion .reading-sequence img{display:block}
  .motion .reading-closing .access-nav{display:flex}
  .motion .reading-closing .contact-footer{display:block}
  .access-link{transition:none}
}
