/* ═══════════════════════════════════════════════════════════
   L.O.R. — Life. On Request.
   styles.css
   ─────────────────────────────────────────────────────────── */

:root{
  /* ── colour ─────────────────────────────── */
  --ink:        #0B0A08;
  --ink-2:      #121009;
  --ink-3:      #1A160E;
  --ivory:      #F2EEE6;
  --parchment:  #E5DDCC;
  --paper:      #E9E2D4;
  --warm-grey:  #8C857A;
  --brown:      #3C3228;
  --gold:       #B49042;   /* brand gold, from the printed identity */
  --gold-soft:  #C9AC76;

  --on-dark:        rgba(242,238,230,.62);
  --on-dark-dim:    rgba(242,238,230,.34);
  --on-light:       #4A4339;
  --hair-dark:      rgba(242,238,230,.13);
  --hair-light:     rgba(11,10,8,.15);

  /* ── type ───────────────────────────────── */
  --f-display: "Bodoni Moda", "Didot", "Times New Roman", serif;
  --f-text:    "EB Garamond", Georgia, "Times New Roman", serif;
  --f-micro:   "Jost", "Futura", "Avenir Next", system-ui, sans-serif;

  /* ── space ──────────────────────────────── */
  --pad-x:  clamp(20px, 5vw, 92px);
  --gap-s:  clamp(14px, 1.6vw, 22px);
  --gap-m:  clamp(28px, 3.4vw, 54px);
  --gap-l:  clamp(60px, 9vw, 150px);
  --gap-xl: clamp(110px, 16vw, 260px);

  /* ── motion ─────────────────────────────── */
  --ease:      cubic-bezier(.19, 1, .22, 1);
  --ease-soft: cubic-bezier(.33, 1, .68, 1);
  --dur:   .9s;
  --dur-l: 1.5s;
}

*,*::before,*::after{ box-sizing:border-box; }

html{
  background:var(--ink);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
body{
  margin:0;
  background:var(--ink);
  color:var(--ivory);
  font-family:var(--f-micro);
  font-weight:300;
  overflow-x:hidden;
}
img,video{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }

::selection{ background:var(--gold); color:var(--ink); }

:focus-visible{
  outline:1px solid var(--gold);
  outline-offset:5px;
}

.visually-hidden{
  position:absolute; width:1px; height:1px; margin:-1px; padding:0;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}

/* ═══ TYPE PRIMITIVES ═══════════════════════════════════════ */

.micro{
  display:block;
  font-family:var(--f-micro);
  font-size:10px;
  font-weight:400;
  letter-spacing:.34em;
  text-transform:uppercase;
  color:var(--on-dark);
}
.micro--gold{ color:var(--gold); }
.micro--dim{ color:var(--on-dark-dim); letter-spacing:.26em; }

.prose{
  margin:0;
  max-width:46ch;
  font-family:var(--f-micro);
  font-size:clamp(13.5px,1.05vw,15px);
  font-weight:300;
  line-height:2.05;
  color:var(--on-dark);
}
.prose--sm{ font-size:13px; line-height:1.95; max-width:38ch; }
.prose--light{ color:var(--on-light); }

.statement{
  margin:0;
  font-family:var(--f-display);
  font-weight:400;
  font-size:clamp(28px,4.4vw,66px);
  line-height:1.12;
  letter-spacing:-.015em;
  color:var(--ivory);
  max-width:19ch;
}
.statement em{
  display:block;
  font-family:var(--f-text);
  font-style:italic;
  color:var(--on-dark);
}
.statement--light{ color:var(--ink); }
.statement--light em{ color:var(--brown); }

/* ═══ FIXED CHROME ══════════════════════════════════════════ */

.grain{
  position:fixed; inset:0; z-index:900; pointer-events:none;
  opacity:.05; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='260' height='260' filter='url(%23n)'/%3E%3C/svg%3E");
}

.progress{
  position:fixed; top:0; left:0; right:0; height:1px; z-index:905;
  background:rgba(242,238,230,.08); pointer-events:none;
}
.progress__bar{
  display:block; height:100%; width:100%;
  background:var(--gold);
  transform:scaleX(0); transform-origin:left center;
}

/* custom cursor — desktop pointers only */
.cursor{ display:none; }
@media (hover:hover) and (pointer:fine){
  .cursor{
    display:block; position:fixed; top:0; left:0; z-index:950;
    pointer-events:none; mix-blend-mode:difference;
    transform:translate3d(-100px,-100px,0);
    opacity:0; transition:opacity .5s var(--ease);
  }
  .cursor.is-live{ opacity:1; }
  .cursor__dot{
    display:block; width:7px; height:7px; border-radius:50%;
    background:var(--ivory);
    transform:translate(-50%,-50%) scale(1);
    transition:transform .5s var(--ease), opacity .4s linear;
  }
  .cursor__label{
    position:absolute; top:14px; left:14px;
    font-family:var(--f-micro); font-size:9px; letter-spacing:.3em;
    text-transform:uppercase; color:var(--ivory);
    opacity:0; transform:translateY(3px);
    transition:opacity .4s var(--ease), transform .5s var(--ease);
    white-space:nowrap;
  }
  .cursor.is-active .cursor__dot{ transform:translate(-50%,-50%) scale(.45); }
  .cursor.is-active .cursor__label{ opacity:1; transform:translateY(0); }
  html.has-cursor, html.has-cursor *{ cursor:none !important; }
}

/* prelude */
.prelude{
  position:fixed; inset:0; z-index:960;
  background:var(--ink);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:22px;
}
.prelude__mark{
  font-family:var(--f-display); font-weight:500;
  font-size:19px; letter-spacing:.3em; color:var(--ivory);
}
.prelude__mark i, .nav__mark i, .foot__mark i, .note__mark i{
  font-style:normal; color:var(--gold);
}
.prelude__rule{
  width:min(190px,40vw); height:1px; background:var(--gold);
  transform:scaleX(0); transform-origin:left center;
}
html.is-ready .prelude{ opacity:0; visibility:hidden; transition:opacity 1s var(--ease), visibility 0s 1s; }
html:not(.js-motion) .prelude{ display:none; }

/* nav */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:910;
  display:flex; align-items:center; justify-content:space-between;
  padding:clamp(20px,2.4vw,34px) var(--pad-x);
  mix-blend-mode:normal;
  transition:color .6s var(--ease-soft);
  color:var(--ivory);
}
.nav.is-light{ color:var(--ink); }
.nav.is-light .nav__links a,
.nav.is-light .nav__code{ color:rgba(11,10,8,.65); }
.nav.is-hidden{ opacity:0; pointer-events:none; transition:opacity .5s var(--ease); }
.nav__mark{
  font-family:var(--f-display); font-weight:500;
  font-size:17px; letter-spacing:.26em;
}
.nav__links{
  display:flex; align-items:center; gap:clamp(18px,2.4vw,36px);
}
.nav__links a, .nav__code{
  font-family:var(--f-micro); font-size:9.5px; font-weight:300;
  letter-spacing:.28em; text-transform:uppercase;
  color:var(--on-dark);
  position:relative; padding-bottom:4px;
  transition:color .4s var(--ease-soft);
}
.nav__links a::after, .nav__code::after{
  content:""; position:absolute; left:0; bottom:0; height:1px; width:100%;
  background:var(--gold); transform:scaleX(0); transform-origin:left center;
  transition:transform .6s var(--ease);
}
.nav__links a:hover, .nav__code:hover{ color:var(--gold); }
.nav__links a:hover::after, .nav__code:hover::after{ transform:scaleX(1); }
@media (max-width:760px){
  .nav__links a{ display:none; }
}

/* ═══ MEDIA SYSTEM ══════════════════════════════════════════
   Drop a real file into /assets with the name in the comment and
   it simply appears. Until then each slot paints an atmospheric
   plate and shows its own filename.
   ═════════════════════════════════════════════════════════ */

.media{
  position:relative; margin:0; overflow:hidden;
  background:var(--ink-2);
}
.media__el{
  width:100%; height:100%; object-fit:cover; display:block;
}
.media__slug{
  position:absolute; left:14px; bottom:11px;
  font-family:var(--f-micro); font-size:8.5px; font-weight:300;
  letter-spacing:.2em; text-transform:uppercase;
  color:rgba(242,238,230,.3);
  opacity:0; pointer-events:none;
}
.media.is-empty{
  background:
    radial-gradient(118% 88% at 24% 14%, rgba(180,144,66,.12), transparent 58%),
    radial-gradient(92% 88% at 82% 88%, rgba(180,144,66,.07), transparent 56%),
    linear-gradient(162deg, #16120B 0%, #201A11 46%, #0C0B07 100%);
}
.media.is-empty .media__el{ opacity:0; }
.media.is-empty .media__slug{ opacity:1; }
[data-theme="light"] .media.is-empty,
[data-theme="paper"] .media.is-empty{
  background:
    radial-gradient(118% 88% at 24% 14%, rgba(180,144,66,.16), transparent 58%),
    linear-gradient(162deg, #E2DAC8 0%, #D4C9B3 60%, #C9BCA3 100%);
}
[data-theme="light"] .media.is-empty .media__slug,
[data-theme="paper"] .media.is-empty .media__slug{ color:rgba(11,10,8,.32); }

/* ═══ LAYOUT SHELL ══════════════════════════════════════════ */

.act{ position:relative; }
section[data-theme="light"]{ background:var(--ivory); color:var(--ink); }
section[data-theme="paper"]{ background:var(--paper); color:var(--ink); }

/* ═══ ACT I — HERO ══════════════════════════════════════════ */

.act--hero{ height:240vh; }
.hero__stage{
  position:sticky; top:0; height:100vh; overflow:hidden;
  display:block;
}
.media--hero{ position:absolute; inset:0; }
.media--hero .media__el{ height:100%; }
.hero__veil{
  position:absolute; inset:0;
  background:
    radial-gradient(75% 60% at 50% 110%, rgba(180,144,66,.16), transparent 62%),
    linear-gradient(180deg, rgba(11,10,8,.74) 0%, rgba(11,10,8,.52) 40%, rgba(11,10,8,.88) 100%);
}
.hero__type{
  position:absolute; inset:0; margin:0;
  display:grid; grid-template-columns:repeat(12,1fr);
  align-content:center; gap:0;
  padding:0 var(--pad-x);
  font-family:var(--f-display); font-weight:400;
  line-height:.86; letter-spacing:-.03em;
  color:var(--ivory);
}
.w{ display:block; }
.w i{ font-style:normal; color:var(--gold); }
.w--life{
  grid-column:1 / span 9; justify-self:start;
  font-size:clamp(58px,15.5vw,250px);
}
.w--on{
  grid-column:9 / span 4; justify-self:end; align-self:center;
  font-family:var(--f-text); font-style:italic;
  font-size:clamp(22px,3.4vw,54px);
  letter-spacing:.02em; color:var(--on-dark);
  margin-top:clamp(6px,1.4vw,22px);
}
.w--req{
  grid-column:2 / span 11; justify-self:end;
  font-size:clamp(50px,13vw,214px);
}
.hero__eyebrow{
  position:absolute; left:var(--pad-x); top:clamp(92px,13vh,150px);
  color:var(--gold); letter-spacing:.42em;
}
.hero__foot{
  position:absolute; left:var(--pad-x); right:var(--pad-x);
  bottom:clamp(24px,4vh,46px);
  display:flex; align-items:flex-end; justify-content:space-between; gap:20px;
}
.hero__scroll{
  display:flex; align-items:center; gap:12px;
  color:var(--on-dark-dim); letter-spacing:.3em;
}
.hero__scrollline{
  display:block; width:46px; height:1px; background:var(--gold);
  transform-origin:left center;
  animation:scrollPulse 3.4s var(--ease-soft) infinite;
}
@keyframes scrollPulse{
  0%,100%{ transform:scaleX(.25); opacity:.5; }
  50%    { transform:scaleX(1);   opacity:1;  }
}
@media (max-width:760px){
  .act--hero{ height:200vh; }
  .w--life{ grid-column:1 / span 12; font-size:clamp(54px,20vw,120px); }
  .w--on{ grid-column:1 / span 12; justify-self:start; margin:6px 0 0; }
  .w--req{ grid-column:1 / span 12; justify-self:start; font-size:clamp(44px,17vw,104px); }
  .hero__foot{ flex-direction:column; align-items:flex-start; gap:12px; }
}

/* ═══ THRESHOLD ═════════════════════════════════════════════ */

.act--threshold{
  padding:var(--gap-xl) var(--pad-x);
  min-height:76vh; display:flex; align-items:center;
}
.threshold{
  margin:0 auto; max-width:17ch;
  font-family:var(--f-display); font-weight:400;
  font-size:clamp(26px,5vw,76px); line-height:1.1; letter-spacing:-.02em;
  text-align:center; color:var(--ivory);
}

/* ═══ THE OFFICE ════════════════════════════════════════════ */

.act--office{ padding:var(--gap-l) var(--pad-x) var(--gap-xl); }
.office{
  display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
  gap:var(--gap-l); align-items:center;
  max-width:1420px; margin:0 auto;
}
.office__text{ display:flex; flex-direction:column; gap:var(--gap-m); }
.media--portrait{
  aspect-ratio:3 / 4.3;
  transform:translateY(clamp(-50px,-4vw,0px));
}
@media (max-width:900px){
  .office{ grid-template-columns:1fr; gap:var(--gap-m); }
  .media--portrait{ transform:none; aspect-ratio:3/4; }
}

/* ═══ PLATE ═════════════════════════════════════════════════ */

.act--plate{ position:relative; }
.media--bleed{
  height:clamp(420px,86vh,980px);
}
.media--bleed .media__el{ height:100%; transform:scale(1.08); }
.plate__caption{
  position:absolute; left:var(--pad-x); bottom:clamp(20px,3vw,40px);
  display:flex; flex-direction:column; gap:7px;
}

/* ═══ ACT II — ON ═══════════════════════════════════════════ */

.act--on{
  position:relative; overflow:hidden;
  min-height:92vh; display:flex; align-items:center; justify-content:center;
  padding:var(--gap-xl) var(--pad-x);
  background:
    radial-gradient(100% 70% at 20% 20%, rgba(180,144,66,.10), transparent 60%),
    linear-gradient(180deg, var(--ink) 0%, #15110A 50%, var(--ink) 100%);
}
.watermark{
  position:absolute; left:50%; top:50%;
  transform:translate(-50%,-50%);
  font-family:var(--f-display); font-weight:400;
  font-size:clamp(150px,34vw,520px); line-height:.8; letter-spacing:-.04em;
  color:rgba(242,238,230,.045);
  pointer-events:none; user-select:none; white-space:nowrap;
}
.watermark i{ font-style:normal; color:rgba(180,144,66,.16); }
.manifesto{
  position:relative; margin:0; text-align:center;
  font-family:var(--f-display); font-weight:400;
  font-size:clamp(25px,4.1vw,58px);
  max-width:min(17em, 92vw);
}
.manifesto p{
  margin:0;
  font-size:1em; line-height:1.2; letter-spacing:-.015em;
}
.manifesto__turn{ margin-top:.42em !important; }
.manifesto__turn em{
  font-family:var(--f-text); font-style:italic; color:var(--gold);
}

/* ═══ SCOPE ═════════════════════════════════════════════════ */

.act--scope{
  position:relative; padding:var(--gap-xl) var(--pad-x);
}
.scope__eyebrow{ margin-bottom:var(--gap-m); }
.scope__list{ list-style:none; margin:0; padding:0; position:relative; z-index:2; }
.scope__item{
  display:grid; grid-template-columns:78px minmax(0,1fr) minmax(0,.62fr);
  gap:clamp(14px,2.2vw,40px); align-items:baseline;
  padding:clamp(22px,2.9vw,40px) 0;
  border-top:1px solid var(--hair-dark);
  transition:padding-left .8s var(--ease);
}
.scope__item:last-child{ border-bottom:1px solid var(--hair-dark); }
.scope__name{
  font-family:var(--f-display); font-weight:400;
  font-size:clamp(30px,6.2vw,96px); line-height:1; letter-spacing:-.025em;
  color:var(--ivory);
  transition:color .6s var(--ease-soft), opacity .6s var(--ease-soft);
}
.scope__name--tail{
  font-family:var(--f-text); font-style:italic;
  font-size:clamp(22px,3.6vw,54px); color:var(--on-dark);
}
.scope__num{ color:var(--gold); }
.scope__note{ align-self:center; }
@media (hover:hover) and (pointer:fine){
  .act--scope.is-hovering .scope__name{ opacity:.26; }
  .scope__item.is-on .scope__name{ opacity:1; color:var(--gold-soft); }
  .scope__item.is-on{ padding-left:clamp(10px,1.6vw,26px); }
}
.scope__visual{
  position:absolute; z-index:1; top:0; left:0;
  width:clamp(230px,24vw,380px); aspect-ratio:4/5;
  pointer-events:none; opacity:0;
  transition:opacity .7s var(--ease);
  will-change:transform;
}
.act--scope.is-hovering .scope__visual{ opacity:1; }
.scope__img{
  position:absolute; inset:0;
  opacity:0; transform:scale(1.06);
  transition:opacity .85s var(--ease), transform 1.3s var(--ease);
}
.scope__img.is-on{ opacity:1; transform:scale(1); }

@media (max-width:900px){
  .scope__item{ grid-template-columns:48px minmax(0,1fr); }
  .scope__note{ grid-column:2 / -1; margin-top:10px; }
  /* touch: the visual sits inside the flow, swapped on scroll */
  .scope__visual{
    position:relative; width:100%; aspect-ratio:16/10;
    opacity:1; margin-bottom:var(--gap-m);
  }
  .scope__img:first-child{ opacity:1; }
}

/* ═══ EXHIBITION (horizontal) ═══════════════════════════════ */

.exhibit__sticky{ position:relative; }
.exhibit__track{
  display:flex; gap:0;
  overflow-x:auto; scroll-snap-type:x mandatory;
  scrollbar-width:none;
}
.exhibit__track::-webkit-scrollbar{ display:none; }
.room{
  position:relative; flex:0 0 min(86vw,560px);
  scroll-snap-align:center;
  min-height:92vh;
  padding:clamp(60px,9vh,120px) clamp(22px,3.4vw,56px);
  display:flex; flex-direction:column; justify-content:flex-end; gap:16px;
  border-left:1px solid var(--hair-dark);
}
.room__media{
  position:absolute; inset:0; z-index:0; opacity:.42;
}
.room__num, .room__word, .room__line{ position:relative; z-index:2; }
.room__num{ color:var(--gold); }
.room__word{
  margin:0;
  font-family:var(--f-display); font-weight:400;
  font-size:clamp(34px,5.4vw,76px); line-height:1; letter-spacing:-.025em;
}
.room__line{
  margin:0; max-width:30ch;
  font-family:var(--f-micro); font-size:13px; font-weight:300;
  line-height:1.95; color:var(--on-dark);
}
/* pinned variant, switched on by JS on wide screens */
.act--exhibit.is-pinned{ height:420vh; }
.act--exhibit.is-pinned .exhibit__sticky{
  position:sticky; top:0; height:100vh; overflow:hidden;
}
.act--exhibit.is-pinned .exhibit__track{
  overflow:visible; height:100vh; align-items:stretch;
  will-change:transform;
}
.act--exhibit.is-pinned .room{
  flex:0 0 clamp(380px,38vw,620px); min-height:100vh;
}

/* ═══ METHOD ════════════════════════════════════════════════ */

.act--method{ padding:var(--gap-xl) var(--pad-x); }
.act--method .statement{ margin:var(--gap-s) 0 var(--gap-l); }
.method{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--gap-m);
  max-width:1420px;
}
.method__step{
  display:flex; flex-direction:column; gap:14px;
  padding-top:22px; border-top:1px solid var(--hair-light);
}
.method__num{
  font-family:var(--f-display); font-size:clamp(42px,5vw,74px);
  line-height:1; color:rgba(11,10,8,.13);
}
.method__title{
  margin:0; font-family:var(--f-display); font-weight:500;
  font-size:clamp(17px,1.5vw,21px); letter-spacing:.01em;
}
@media (max-width:900px){ .method{ grid-template-columns:1fr; } }

/* ═══ PLACES ════════════════════════════════════════════════ */

.act--places{
  position:relative; overflow:hidden;
  padding:var(--gap-xl) var(--pad-x);
}
.media--bg{
  position:absolute; inset:-12% 0; z-index:0; opacity:.3;
}
.media--bg .media__el{ height:100%; }
.act--places::after{
  content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg, rgba(11,10,8,.86), rgba(11,10,8,.66) 45%, rgba(11,10,8,.94));
}
.places{ position:relative; z-index:2; max-width:1420px; margin:0 auto; }
.places__grid{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--gap-m); margin-top:var(--gap-l);
}
.places__item{
  display:flex; flex-direction:column; gap:12px;
  padding-top:22px; border-top:1px solid var(--hair-dark);
}
.places__name{
  font-family:var(--f-display); font-weight:400;
  font-size:clamp(28px,3.4vw,50px); line-height:1;
}
.places__name--it em{ font-family:var(--f-text); font-style:italic; }
@media (max-width:900px){ .places__grid{ grid-template-columns:1fr; } }

/* ═══ NOTE ══════════════════════════════════════════════════ */

.act--note{
  padding:var(--gap-xl) var(--pad-x);
  border-top:1px solid rgba(180,144,66,.4);
}
.note{ max-width:68ch; margin:0 auto; display:flex; flex-direction:column; gap:var(--gap-m); }
.note__lede{
  margin:0;
  font-family:var(--f-text); font-style:italic; font-weight:400;
  font-size:clamp(21px,2.6vw,33px); line-height:1.62; color:#231F19;
}
.note__sign{ display:flex; flex-direction:column; gap:10px; margin-top:var(--gap-s); }
.note__rule{ width:54px; height:1px; background:var(--gold); }
.note__mark{
  font-family:var(--f-display); font-weight:500;
  font-size:21px; letter-spacing:.17em; color:var(--ink); margin-top:6px;
}
.note__phrase, .foot__phrase{
  font-family:var(--f-text); font-style:italic; font-size:16px;
  color:rgba(11,10,8,.6);
}
.note__phrase i, .foot__phrase i{ font-style:italic; color:var(--gold); }

/* ═══ ACT III — REQUEST ═════════════════════════════════════ */

.act--request{
  position:relative; overflow:hidden;
  min-height:96vh; display:flex; align-items:center;
  padding:var(--gap-xl) var(--pad-x);
  background:
    radial-gradient(66% 56% at 50% 0%, rgba(180,144,66,.15), transparent 62%),
    linear-gradient(180deg, var(--ink) 0%, #110F09 58%, var(--ink) 100%);
}
.watermark--req{
  top:auto; bottom:-4%; left:50%;
  font-size:clamp(120px,26vw,420px);
}
.request{
  position:relative; z-index:2; max-width:1420px; margin:0 auto;
  display:flex; flex-direction:column; gap:var(--gap-m);
}
.request__head{
  margin:0; max-width:17ch;
  font-family:var(--f-display); font-weight:400;
  font-size:clamp(30px,5.4vw,80px); line-height:1.1; letter-spacing:-.02em;
}
.request__head em{ font-family:var(--f-text); font-style:italic; color:var(--on-dark); }
.mailto{
  position:relative; align-self:flex-start;
  font-family:var(--f-text); font-style:italic;
  font-size:clamp(22px,2.8vw,38px); color:var(--ivory);
  padding-bottom:9px;
}
.mailto__rule{
  position:absolute; left:0; bottom:0; height:1px; width:100%;
  background:var(--gold); transform:scaleX(1); transform-origin:right center;
  transition:transform .7s var(--ease);
}
.mailto:hover .mailto__rule{ transform:scaleX(0); }
.ghost{
  align-self:flex-start;
  padding:16px 40px; border:1px solid rgba(180,144,66,.5);
  font-family:var(--f-micro); font-size:9.5px; font-weight:400;
  letter-spacing:.32em; text-transform:uppercase; color:var(--gold);
  transition:background-color .6s var(--ease-soft), color .6s var(--ease-soft), border-color .6s var(--ease-soft);
}
.ghost:hover{ background:var(--gold); border-color:var(--gold); color:var(--ink); }
.ghost--sm{ padding:13px 28px; }

/* ═══ FOOTER ════════════════════════════════════════════════ */

.foot{
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:var(--gap-m);
  padding:clamp(40px,5vw,66px) var(--pad-x);
  border-top:1px solid var(--hair-dark);
  background:var(--ink);
}
.foot__row{ display:flex; align-items:center; gap:18px; }
.foot__row--end{ gap:26px; }
.foot__mark{
  font-family:var(--f-display); font-weight:500;
  font-size:17px; letter-spacing:.17em;
}
.foot__phrase{ color:var(--gold); }
.foot a:hover{ color:var(--gold); }

/* ═══ ACCESS OVERLAY ════════════════════════════════════════ */

.access{
  position:fixed; inset:0; z-index:940;
  display:flex; align-items:center; justify-content:center;
  padding:var(--pad-x);
  background:rgba(8,7,5,.9);
  backdrop-filter:blur(6px);
  opacity:0; transition:opacity .6s var(--ease);
}
.access[hidden]{ display:none; }
.access.is-open{ opacity:1; }
.access__panel{
  position:relative; width:min(520px,100%);
  padding:clamp(34px,4vw,56px);
  background:var(--ink-2); border:1px solid rgba(180,144,66,.26);
  display:flex; flex-direction:column; gap:18px;
}
.access__close{
  position:absolute; top:18px; right:20px;
  font-family:var(--f-micro); font-size:9px; letter-spacing:.3em;
  text-transform:uppercase; color:var(--on-dark-dim);
}
.access__close:hover{ color:var(--gold); }
.access__title{
  margin:0; font-family:var(--f-display); font-weight:400;
  font-size:clamp(28px,3.4vw,42px); letter-spacing:-.015em;
}
.access__form{ display:flex; gap:12px; margin-top:6px; flex-wrap:wrap; }
.access__input{
  flex:1 1 180px; min-width:0;
  padding:14px 16px; background:transparent;
  border:1px solid var(--hair-dark); color:var(--ivory);
  font-family:var(--f-micro); font-size:12px; letter-spacing:.24em;
  text-transform:uppercase;
}
.access__input::placeholder{ color:var(--on-dark-dim); letter-spacing:.24em; }
.access__input:focus{ outline:none; border-color:var(--gold); }

/* ═══ MOTION STATES (only with JS + motion allowed) ═════════
   Nothing is hidden unless motion is actually running, so a
   blocked CDN or a failed script never costs a word of copy.
   ═════════════════════════════════════════════════════════ */

/* word splitting */
.word{
  display:inline-block; overflow:hidden; vertical-align:top;
  padding-bottom:.14em; margin-bottom:-.14em;
}
.word__i{ display:inline-block; will-change:transform, opacity; }

html.js-motion [data-reveal]{ opacity:0; }
html.js-motion [data-split]{ opacity:0; }

/* hero words arrive out of blur */
html.js-motion .w{
  opacity:0; filter:blur(14px);
  transition:opacity 1.7s var(--ease), filter 2s var(--ease);
}
html.js-motion .w--life{ transition-delay:.05s; }
html.js-motion .w--on  { transition-delay:.45s; }
html.js-motion .w--req { transition-delay:.72s; }
html.is-ready .w{ opacity:1; filter:blur(0); }

html.js-motion .hero__eyebrow,
html.js-motion .hero__foot{
  opacity:0; transition:opacity 1.6s var(--ease) 1s;
}
html.is-ready .hero__eyebrow,
html.is-ready .hero__foot{ opacity:1; }

html.js-motion .prelude__rule{ animation:ruleDraw 1.15s var(--ease) .18s forwards; }
@keyframes ruleDraw{ to{ transform:scaleX(1); } }

/* ═══ REDUCED MOTION ════════════════════════════════════════ */

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
  .hero__scrollline{ animation:none; transform:scaleX(1); }
  .act--hero{ height:100vh; }
  .act--exhibit.is-pinned{ height:auto; }
  .act--exhibit.is-pinned .exhibit__sticky{ position:static; height:auto; }
  .act--exhibit.is-pinned .exhibit__track{ overflow-x:auto; height:auto; }
  .prelude{ display:none; }
}