:root {
  --font-primary:var(--font-brand);
  --font-body:var(--font-brand);
  --ease-in-out:cubic-bezier(.65,0,.35,1);
  color-scheme:dark;
  --ink:#100e16;
  --paper:#f2eee9;
  --muted:#b7b0c5;
  --line:rgba(228,213,245,.22);
  --violet:#af9cda;
  --accent:#bda4ed;
  --work-glow:rgba(136,101,183,.12);
  --soft-surface:rgba(228,213,245,.045);
  --pad:clamp(24px,5vw,80px);
  /* The house curve, as --motion-ease in interface-motion.css (motion plan B17). */
  --ease:cubic-bezier(.22,1,.36,1);
}
* {
  box-sizing:border-box;
}
/* Keep the scene entrance, without a second snapshot layer over live controls. */
@view-transition { navigation:none; }
html {
  scroll-behavior:smooth;
  scrollbar-gutter:stable;
  scroll-padding-top:90px;
  background:var(--ink);
}
body {
  margin:0;
  background:var(--ink);
  color:var(--paper);
  font-family:var(--font-body);
  font-weight:400;
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,p {
  margin:0;
}
h1,h2,h3 {
  font-family:var(--font-primary);
  font-weight:300;
  line-height:1.12;
  letter-spacing:-.025em;
  text-wrap:balance;
}
p {
  text-wrap:pretty;
}
h2 {
  font-size:clamp(36px,6vw,80px);
  line-height:1.08;
}
h3 { font-weight:400; }
a {
  color:inherit;
  text-decoration:none;
}
a,button {
  -webkit-tap-highlight-color:transparent;
}
button {
  font:inherit;
  color:inherit;
}
a:focus-visible,button:focus-visible,summary:focus-visible {
  outline:2px solid var(--accent);
  outline-offset:7px;
}
::selection {
  background:#c9b7e8;
  color:#17111f;
}
img {
  max-width:100%;
  height:auto;
}
.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
}
.skip {
  position:fixed;
  left:24px;
  top:-100px;
  z-index:100;
  background:var(--paper);
  color:var(--ink);
  padding:12px 20px;
}
.skip:focus {
  top:12px;
}
[hidden] {
  display:none!important;
}
.art-header {
  position:fixed;
  inset:0 0 auto;
  z-index:10;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:25px;
  padding:24px clamp(24px,5vw,80px);
  transition:padding .6s var(--ease),background-color .6s var(--ease),box-shadow .6s var(--ease);
}
.art-header.is-scrolled { padding-top:16px; padding-bottom:16px; background:var(--ink); box-shadow:0 1px var(--line); }
.brand-wave {
  position:relative;
  display:flex;
  align-items:center;
  min-height:44px;
}
/* The logos are <picture>s (WebP, PNG fallback); the <img> stays the flex item. */
.brand-wave picture,.footer-brand picture { display:contents; }
.brand-wave img {
  width:auto;
  height:18px;
  object-fit:contain;
  transition:opacity .3s,transform .6s var(--ease);
}
.brand-wave:after {
  content:'';
  position:absolute;
  inset:0;
  background:var(--accent);
  /* PNG first for engines without image-set() type(); the others take the WebP. */
  -webkit-mask:url('/assets/wave-white.png?v=de4f47d4979f') center / contain no-repeat;
  -webkit-mask:image-set(url('/assets/wave-white.webp?v=9f0b0c4be5c1') type('image/webp'),url('/assets/wave-white.png?v=de4f47d4979f') type('image/png')) center / contain no-repeat;
  mask:url('/assets/wave-white.png?v=de4f47d4979f') center / contain no-repeat;
  mask:image-set(url('/assets/wave-white.webp?v=9f0b0c4be5c1') type('image/webp'),url('/assets/wave-white.png?v=de4f47d4979f') type('image/png')) center / contain no-repeat;
  opacity:0;
  transition:opacity .6s var(--ease),transform .6s var(--ease);
  pointer-events:none;
}
.brand-wave:is(:hover,:focus-visible,:active) img { opacity:0; transform:scale(1.08); }
.brand-wave:is(:hover,:focus-visible,:active):after { opacity:1; transform:scale(1.08); }
.brand-on-light { display:none!important; }
.icon { width:22px; height:22px; flex-shrink:0; }
.header-actions {
  display:flex;
  align-items:center;
  flex-shrink:0;
  gap:20px;
}
.art-language { position:relative; }
.header-actions summary {
  list-style:none;
  cursor:pointer;
  -webkit-user-select:none;
  user-select:none;
}
.header-actions summary::-webkit-details-marker { display:none; }
.header-actions summary::marker { content:''; }
.art-language-toggle,.art-menu-toggle {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  width:44px;
  height:44px;
  color:var(--paper);
}
/* Match the cafe header controls; only the Art accent palette is different. */
.art-language-toggle { width:auto; height:auto; padding:8px 12px; border-radius:999px; font-size:12px; font-weight:500; line-height:1; letter-spacing:.1em; transition:background .3s; }
.art-language-toggle:hover { background:var(--soft-surface); }
.language-chevron { width:10px; height:10px; transition:transform .3s var(--ease); color:var(--muted); }
/* Turns with the panel: navigation.js sets aria-expanded at once, [open] stays while it fades out (B18). */
.art-language:not(.is-enhanced)[open] .language-chevron,.art-language-toggle[aria-expanded="true"] .language-chevron { transform:rotate(180deg); }
.art-dropdown-panel {
  position:absolute;
  top:100%;
  margin-top:8px;
  right:0;
  background:var(--ink);
  border:1px solid var(--line);
  border-radius:12px;
  box-shadow:0 12px 32px -12px #00000080;
}
.art-language-panel { min-width:140px; padding:6px; }
.art-language[open] .art-language-panel { animation:language-arrive .3s var(--ease); }
@keyframes language-arrive { from { opacity:0; transform:translateY(-8px); } to { opacity:1; transform:none; } }
.art-language-panel a {
  display:flex;
  justify-content:flex-start;
  align-items:center;
  padding:8px 12px;
  border-radius:8px;
  font-size:12px;
  font-weight:500;
  line-height:1;
  letter-spacing:.05em;
  color:var(--muted);
}
.art-language-panel a + a { margin-top:2px; }
.art-language-panel a[aria-current] {
  color:var(--accent);
  background:var(--soft-surface);
}
.menu-bars { width:24px; display:grid; gap:6px; }
.menu-bars i {
  width:24px;
  height:2px;
  border-radius:1px;
  background:currentColor;
  transition:transform .4s var(--ease),background .4s var(--ease);
}
.art-menu.is-open .menu-bars i:first-child,.art-menu[open]:not(.is-enhanced) .menu-bars i:first-child { transform:translateY(4px) rotate(45deg); }
.art-menu.is-open .menu-bars i:last-child,.art-menu[open]:not(.is-enhanced) .menu-bars i:last-child { transform:translateY(-4px) rotate(-45deg); }
.art-menu.is-open .art-menu-toggle,.art-menu[open]:not(.is-enhanced) .art-menu-toggle { color:var(--accent); }
.art-header > .brand-wave,.art-language,.art-theme-toggle,.art-menu-toggle { position:relative; z-index:2; }
.art-menu-panel {
  position:fixed;
  inset:0;
  z-index:1;
  display:flex;
  background:var(--ink);
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  letter-spacing:0;
  transition:opacity .5s var(--ease);
}
.art-menu.is-enhanced[open] .art-menu-panel { opacity:0; pointer-events:none; }
.art-menu.is-enhanced.is-open .art-menu-panel { opacity:1; pointer-events:auto; }
.art-menu-inner {
  list-style:none;
  margin:0;
  padding:clamp(96px,14vh,132px) 24px max(32px,env(safe-area-inset-bottom));
  display:flex;
  flex-direction:column;
  justify-content:center;
  width:100%;
  min-height:100%;
  text-align:center;
}
.art-menu-panel ol { list-style:none; margin:0; padding:0; }
.art-menu-footer { margin-top:48px; font-size:16px; line-height:1.6; }
.art-menu-tagline { font-size:14px; letter-spacing:.05em; color:var(--muted); }
.art-menu-panel a {
  display:block;
  min-height:48px;
  padding:12px 0;
  font-size:clamp(36px,8vw,56px);
  font-weight:500;
  line-height:1.25;
  color:var(--paper);
  overflow-wrap:anywhere;
  transition:transform .5s var(--ease),opacity .5s var(--ease),color .6s var(--ease),letter-spacing .6s var(--ease);
}
.art-menu.is-enhanced .art-menu-panel a { transform:translateY(30px); opacity:0; }
.art-menu.is-enhanced.is-open .art-menu-panel a { transform:translateY(0); opacity:1; }
.art-menu.is-open li:nth-child(1) a { transition-delay:.1s; }
.art-menu.is-open li:nth-child(2) a { transition-delay:.15s; }
.art-menu.is-open li:nth-child(3) a { transition-delay:.2s; }
.art-menu.is-open li:nth-child(4) a { transition-delay:.25s; }
.art-menu.is-open li:nth-child(5) a { transition-delay:.3s; }
.art-menu-panel a:is(:hover,:focus-visible) { color:var(--accent); letter-spacing:.05em; }
.art-menu-panel a[aria-current] { color:var(--accent); }
.art-menu-panel a:focus-visible { outline-offset:-2px; }
@media(max-height:600px) {
  .art-menu-inner { justify-content:flex-start; padding-top:max(76px,env(safe-area-inset-top)); }
  .art-menu-panel a { font-size:clamp(28px,7.5vh,38px); padding:6px 0; }
  .art-menu-footer { margin-top:24px; }
}
.art-dropdown-panel a:focus-visible { outline-offset:2px; }
.art-theme-toggle { position:relative; display:flex; align-items:center; justify-content:center; width:32px; height:32px; border:0; border-radius:999px; padding:8px; background:transparent; cursor:pointer; color:var(--muted); transition:background .3s; }
@media (hover:hover) and (pointer:fine) { .art-theme-toggle:hover { background:var(--soft-surface); } }
.header-actions :is(a,summary,button):is(:hover,:focus-visible,:active) { color:var(--accent); }
.art-theme-toggle .icon { position:absolute; width:18px; height:18px; transition:opacity .4s var(--ease),transform .4s var(--ease); }
.art-theme-toggle .icon-sun { opacity:0; transform:rotate(90deg) scale(.6); }
.art-theme-toggle .icon-moon { opacity:1; transform:none; }
@media(max-width:1024px) {
  .header-actions { gap:12px; }
  .art-language-toggle,.art-theme-toggle,.art-language-panel a { min-width:44px; min-height:44px; }
}
@media(prefers-reduced-motion:reduce) {
  .art-header,.art-header *,.art-header:after { transition:none!important; animation:none!important; }
}
.hero {
  min-height:820px;
  min-height:max(740px,100svh);
  position:relative;
  isolation:isolate;
  padding:150px var(--pad) 130px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  overflow:hidden;
}
.light-field {
  position:absolute;
  inset:0;
  z-index:-2;
  overflow:hidden;
  background:#100d18;
  pointer-events:none;
}
.light-canvas {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  opacity:0;
  transition:opacity 1.5s;
}
.light-canvas.is-ready {
  opacity:1;
}
.field-fallback {
  position:absolute;
  inset:-20%;
  background:radial-gradient(ellipse at 52% 49%,#f2d8b2 0,transparent 15%),radial-gradient(ellipse at 63% 34%,#8a74b4 0,transparent 33%),radial-gradient(ellipse at 73% 64%,#213e7c 0,transparent 35%),radial-gradient(ellipse at 25% 34%,#b47748 0,transparent 30%);
  opacity:.72;
  transform:rotate(-22deg);
}
.field-fallback:after {
  content:'';
  position:absolute;
  width:50%;
  height:65%;
  border-radius:50%;
  background:#100d18;
  left:26%;
  top:24%;
  filter:blur(25px);
}
.field-vignette {
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(16,14,22,.7),transparent 24%,transparent 50%,rgba(16,14,22,.45) 76%,#100e16 100%);
}
.hero-eyebrow {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.2em;
  color:#ded4e5;
  margin-bottom:54px;
  text-shadow:0 1px 20px #100e16;
}
.hero h1 {
  position:relative;
  font-size:clamp(70px,12.7vw,224px);
  font-weight:300;
  letter-spacing:-.045em;
  line-height:1.05;
  margin-left:-.035em;
  white-space:nowrap;
  text-shadow:0 4px 70px rgba(11,9,20,.16);
}
.hero-bottom {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:40px;
  margin-top:63px;
}
.hero-statement {
  font-weight:300;
  font-family:var(--font-primary);
  font-size:clamp(25px,2.9vw,48px);
  letter-spacing:-.04em;
  line-height:1.22;
  max-width:60%;
  text-shadow:0 2px 30px #100e16;
}
.hero-credit {
  text-align:right;
}
.hero-work {
  font-size:clamp(17px,1.6vw,28px);
  font-variant-numeric:tabular-nums;
}
.hero-work span {
  color:#bfb4d4;
  white-space:nowrap;
}
.hero-artist {
  font-size:12px;
  letter-spacing:.025em;
  margin-top:8px;
  color:#cec4db;
}
.scroll-cue {
  position:absolute;
  bottom:28px;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:14px;
  font-size:11px;
  letter-spacing:.04em;
  color:var(--muted);
  padding:10px;
  min-width:44px;
  z-index:2;
}
.scroll-line {
  display:block;
  position:relative;
  overflow:hidden;
  width:1px;
  height:52px;
  background:#f2eee933;
}
.scroll-line:after {
  content:'';
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:40%;
  background:var(--paper);
}
.scroll-progress {
  position:fixed;
  z-index:20;
  top:0;
  left:0;
  width:100%;
  height:2px;
  transform:scaleX(0);
  transform-origin:left;
  background:linear-gradient(90deg,#b5a1d4,#f0c4a3);
  pointer-events:none;
}
.art-rail {
  position:fixed;
  z-index:6;
  right:19px;
  top:50%;
  transform:translateY(-50%);
  width:44px;
  font-family:var(--font-primary);
}
.art-rail ol {
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  grid-auto-rows:36px;
}
.art-rail-track {
  position:absolute;
  top:0;
  right:7px;
  bottom:0;
  width:2px;
  background:#f2eee916;
  pointer-events:none;
}
.art-rail-indicator {
  position:absolute;
  top:0;
  height:26px;
  width:2px;
  border-radius:2px;
  background:linear-gradient(0deg,transparent,#e0bfb4 22%,#bbaaef 78%,transparent);
  opacity:0;
  /* art.js moves and stretches it with one transform (translateY + scaleY of 26 px). */
  transform-origin:top center;
  transition:transform .55s var(--ease),opacity .3s;
  will-change:transform;
}
.art-rail-item {
  position:relative;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  width:44px;
  height:36px;
  padding-right:18px;
  color:var(--muted);
  font-size:9px;
}
.art-rail-num {
  opacity:0;
  transition:opacity .3s;
}
.art-rail-name {
  position:absolute;
  right:52px;
  white-space:nowrap;
  opacity:0;
  pointer-events:none;
  transition:opacity .3s;
  background:#100e16dd;
  padding:4px 9px;
  border-radius:4px;
}
.art-rail:focus-within .art-rail-num,.art-rail:hover .art-rail-num,.art-rail-item[aria-current] .art-rail-num {
  opacity:.8;
}
.art-rail-item:hover .art-rail-name,.art-rail-item:focus-visible .art-rail-name {
  opacity:1;
}
.art-rail-item:focus-visible {
  outline-offset:1px;
}
@media(max-width:1000px) {
  .art-rail {
    display:none;
  }
}
.section-wrap {
  padding:clamp(80px,12vh,160px) var(--pad);
  max-width:1400px;
  margin:0 auto;
}
.section-label {
  display:flex;
  align-items:center;
  gap:16px;
  font-family:var(--font-primary);
  font-weight:400;
  font-size:13px;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:var(--muted);
  line-height:1.6;
  margin-bottom:40px;
}
.section-number {
  flex:none;
  font-variant-numeric:tabular-nums;
}
.label-line {
  flex:none;
  width:40px;
  height:1px;
  background:var(--line);
}
.section-name {
  min-width:0;
  overflow-wrap:anywhere;
}
.story-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(40px,7vw,100px);
  align-items:start;
  margin-top:0;
}
.body-copy {
  font-size:clamp(16px,1.8vw,20px);
  font-weight:400;
  line-height:1.7;
  max-width:580px;
}
.body-copy p+p {
  margin-top:28px;
}
.muted {
  color:var(--muted);
}
.story h2 {
  max-width:1100px;
  font-size:clamp(40px,7vw,96px);
  margin-bottom:60px;
}
.threshold {
  --sphere-size:min(760px,86vw);
  background:radial-gradient(ellipse at 50% 50%,#28203255 0%,transparent 68%);
  position:relative;
  overflow:hidden;
  isolation:isolate;
  min-height:960px;
  padding:180px var(--pad);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
}
.threshold-orbit {
  position:absolute;
  width:var(--sphere-size);
  height:var(--sphere-size);
  border-radius:46% 54% 49% 51% / 52% 47% 53% 48%;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  z-index:-1;
  background:transparent;
  box-shadow:0 0 100px 16px #a385c812;
  pointer-events:none;
}
/* The travelling light: the span rotates and fades on the compositor; the blurred
   conic ring is painted once on the inner <i> and only turned, never re-blurred. */
.orbit-light {
  position:absolute;
  inset:-1%;
  border-radius:inherit;
  opacity:.82;
  transform:rotate(-20deg) scale(1.025);
}
.orbit-light i {
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:conic-gradient(from 15deg,transparent 0deg,#826aa540 28deg,#c2a8eead 55deg,#f0dfffcf 66deg,#9272c564 83deg,transparent 120deg,transparent 172deg,#a59bea72 204deg,#ddd2f7b5 220deg,#75659854 242deg,transparent 278deg,transparent 360deg);
  filter:blur(clamp(9px,1.7vw,17px));
}
.threshold-orbit:after {
  content:'';
  position:absolute;
  inset:1px;
  border-radius:inherit;
  background:radial-gradient(ellipse at 25% 18%,#615070aa,transparent 56%),radial-gradient(ellipse at 75% 80%,#44345155,transparent 50%),linear-gradient(135deg,#211b2cf5,#15121bf5);
  box-shadow:inset 0 0 60px #0c091744;
}
.threshold .section-label {
  position:absolute;
  top:56px;
  left:50%;
  transform:translateX(-50%);
  width:100%;
  max-width:min(calc(100% - var(--pad) * 2),calc(1400px - var(--pad) * 2));
  text-align:left;
  margin-bottom:0;
}
.threshold h2 {
  font-size:clamp(28px,4vw,56px);
  line-height:1.14;
  max-width:min(600px,72vw);
  letter-spacing:-.025em;
}
.work {
  padding-top:clamp(60px,8vw,120px);
}
.visit {
  position:relative;
  overflow:hidden;
  padding-top:140px;
  background:radial-gradient(ellipse at 95% 100%,#4e3544 0,transparent 65%);
}
.visit h2 {
  font-size:clamp(36px,6vw,80px);
  line-height:1.08;
  margin:0 0 60px;
}
.visit-bottom {
  display:grid;
  grid-template-columns:1fr .8fr 1.2fr;
  gap:45px;
  align-items:start;
}
.visit address {
  max-width:250px;
  font-size:16px;
  font-style:normal;
}
.visit-bottom p {
  font-size:12px;
  color:var(--muted);
}
.visit strong {
  font-weight:400;
  color:var(--paper);
  padding-left:12px;
  font-variant-numeric:tabular-nums;
}
.visit-links {
  display:flex;
  flex-direction:column;
  gap:32px;
  align-items:stretch;
  justify-self:end;
  width:min(100%,300px);
}
.service-group h3 {
  margin:0 0 18px;
  font-size:13px;
  line-height:1.5;
  letter-spacing:0;
}
.service-options {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.service-link {
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  border-radius:32px 32px 8px 8px;
  font-size:11px;
  line-height:1.4;
  text-align:center;
  color:var(--muted);
}
.service-disc {
  display:grid;
  place-items:center;
  width:64px;
  max-width:100%;
  aspect-ratio:1;
  flex:none;
  border:1px solid var(--line);
  border-radius:50%;
  background:var(--soft-surface);
  color:var(--paper);
  transition:transform .3s var(--ease),border-color .3s,box-shadow .3s;
}
.service-monogram {
  font-size:27px;
  font-weight:300;
  line-height:1;
}
.service-primary .service-disc { color:var(--accent); border-color:var(--accent); }
.service-link:hover,.service-link:focus-visible { color:var(--paper); }
.service-link:hover .service-disc,.service-link:focus-visible .service-disc {
  transform:translateY(-3px);
  border-color:var(--accent);
  box-shadow:0 0 25px var(--work-glow);
}
.service-link:active .service-disc { transform:scale(.95); }
.art-footer {
  display:flex;
  align-items:center;
  gap:35px;
  padding:40px var(--pad);
  border-top:1px solid var(--line);
}
.art-footer img {
  width:84px;
  display:block;
  transition:opacity .2s;
}
.footer-brand { position:relative; display:flex; align-items:center; width:84px; min-height:45px; flex-shrink:0; }
.footer-brand:after {
  content:'';
  position:absolute;
  inset:0;
  background:var(--accent);
  /* The same 252 px file the dark footer logo uses: one small download, not the 31 KB PNG,
     which only engines without image-set() type() fall back to. */
  -webkit-mask:url('/assets/logo-white.png?v=23e7cea16b02') center / 84px auto no-repeat;
  -webkit-mask:image-set(url('/assets/logo-white-252.webp?v=f288a0b9f6fd') type('image/webp'),url('/assets/logo-white.png?v=23e7cea16b02') type('image/png')) center / 84px auto no-repeat;
  mask:url('/assets/logo-white.png?v=23e7cea16b02') center / 84px auto no-repeat;
  mask:image-set(url('/assets/logo-white-252.webp?v=f288a0b9f6fd') type('image/webp'),url('/assets/logo-white.png?v=23e7cea16b02') type('image/png')) center / 84px auto no-repeat;
  opacity:0;
  transition:opacity .2s;
  pointer-events:none;
}
.footer-brand:is(:hover,:focus-visible,:active) img { opacity:0; }
.footer-brand:is(:hover,:focus-visible,:active):after { opacity:1; }
.art-footer p {
  font-size:10px;
  color:var(--muted);
  flex:1;
}
.art-footer>span {
  font-size:10px;
  color:var(--muted);
}
@media(prefers-reduced-motion:no-preference) {
  .light-field {
    animation:light-unveil 1.4s var(--ease) both;
  }
  .hero h1 {
    animation:title-arrive .9s var(--ease) both;
  }
  .hero-bottom {
    animation:copy-arrive 1s .12s var(--ease) both;
  }
  .motion-ready .scroll-line:after {
    animation:scrollDown 2s var(--ease-in-out) infinite;
  }
  /* .is-offscreen: art.js marks the hero once it has scrolled out of view (F2). */
  .motion-paused .scroll-line:after,.is-offscreen .scroll-line:after {
    animation-play-state:paused;
  }
  @keyframes scrollDown {
    from {
      transform:translateY(-100%);
    }
    to {
      transform:translateY(250%);
    }
  }
  @keyframes light-unveil {
    from {
      filter:brightness(.72) saturate(.85);
      transform:scale(1.025);
    }
    to {
      filter:brightness(1) saturate(1);
      transform:none;
    }
  }
  .motion-ready .threshold-orbit {
    animation:orbit-breathe 14s ease-in-out infinite alternate;
  }
  .motion-ready .orbit-light {
    animation:orbit-light 18s linear infinite,orbit-glow 7s ease-in-out infinite alternate;
  }
  /* .is-offscreen is set by art.js on #threshold and the hero while they are out of view
     (the hero's scroll cue pauses in its own rule below). */
  .motion-paused .threshold-orbit,.motion-paused .orbit-light,
  .is-offscreen .threshold-orbit,.is-offscreen .orbit-light {
    animation-play-state:paused;
  }
  @keyframes title-arrive {
    from {
      transform:translateY(8px);
      opacity:.85;
    }
    to {
      transform:none;
      opacity:1;
    }
  }
  @keyframes copy-arrive {
    from {
      transform:translateY(8px);
      opacity:.85;
    }
    to {
      transform:none;
      opacity:1;
    }
  }
  @keyframes orbit-breathe {
    from {
      transform:translate(-50%,-50%) rotate(-3deg) scale(.985,1.01);
    }
    to {
      transform:translate(-50%,-50%) rotate(3deg) scale(1.015,.99);
    }
  }
  @keyframes orbit-light {
    from { transform:rotate(-20deg) scale(1.025); }
    to { transform:rotate(340deg) scale(1.025); }
  }
  @keyframes orbit-glow {
    from { opacity:.65; }
    to { opacity:.95; }
  }
}
@media(min-width:1800px) {
  .hero {
    padding-left:max(var(--pad),calc((100vw - 1640px)/2));
    padding-right:max(var(--pad),calc((100vw - 1640px)/2));
  }
  .hero h1 {
    font-size:224px;
  }
}
@media(max-width:900px) {
  .hero {
    min-height:max(760px,100svh);
    padding-top:160px;
    padding-bottom:140px;
  }
  .hero h1 {
    font-size:12.6vw;
  }
  .hero-eyebrow {
    margin-bottom:60px;
  }
  .hero-bottom {
    margin-top:60px;
    gap:24px;
  }
  .hero-statement {
    font-size:32px;
  }
  .hero-work {
    font-size:18px;
  }
  .section-wrap {
    padding-top:85px;
    padding-bottom:85px;
  }
  .story-grid {
    gap:8%;
  }
  .body-copy {
    font-size:16px;
  }
  .visit-bottom {
    gap:20px;
  }
  .art-footer p {
    max-width:180px;
  }
}
@media(max-width:600px) {
  :root {
    --pad:22px;
  }
  .hero {
    min-height:750px;
    min-height:max(690px,100svh);
    padding-top:133px;
    padding-bottom:133px;
    justify-content:center;
  }
  .hero-eyebrow {
    font-size:9px;
    letter-spacing:.1em;
    align-items:flex-start;
    gap:30px;
    margin-bottom:65px;
  }
  .hero-eyebrow span:last-child {
    text-align:right;
    max-width:160px;
  }
  .hero h1 {
    font-size:12.6vw;
    letter-spacing:-.045em;
  }
  .hero-bottom {
    display:block;
    margin-top:43px;
  }
  .hero-statement {
    font-size:30px;
    max-width:90%;
  }
  .hero-credit {
    text-align:left;
    margin-top:35px;
  }
  .hero-work {
    font-size:20px;
  }
  .hero-artist {
    font-size:11px;
  }
  .scroll-cue {
    bottom:18px;
    font-size:10px;
    gap:12px;
  }
  .scroll-line {
    height:40px;
  }
  .scroll-cue>span {
    max-width:180px;
    text-align:center;
  }
  .section-wrap {
    padding-top:70px;
    padding-bottom:70px;
  }
  .section-label {
    font-size:13px;
    gap:16px;
    letter-spacing:.05em;
  }
  .story-grid {
    grid-template-columns:1fr;
    gap:33px;
  }
  .story h2 {
    margin-bottom:40px;
  }
  .body-copy {
    font-size:16px;
  }
  .body-copy p+p {
    margin-top:20px;
  }
  .threshold {
    --sphere-size:88vw;
    min-height:calc(var(--sphere-size) + 150px);
    padding:100px var(--pad);
  }
  .threshold h2 {
    font-size:clamp(24px,5.9vw,34px);
    letter-spacing:-.025em;
  }
  .threshold .section-label {
    top:24px;
    margin-bottom:0;
  }
  .work {
    padding-top:35px;
  }
  .visit h2 {
    font-size:36px;
    margin:0 0 40px;
  }
  .visit-bottom {
    grid-template-columns:1fr;
    gap:25px;
  }
  .visit-links {
    justify-self:start;
    width:100%;
    max-width:300px;
    margin-top:12px;
  }
  .visit address {
    font-size:16px;
    max-width:300px;
  }
  .art-footer {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:23px;
    padding-top:30px;
    padding-bottom:30px;
  }
  .art-footer p {
    text-align:right;
    justify-self:end;
    font-size:9px;
    max-width:160px;
  }
  .art-footer>span {
    text-align:right;
    grid-column:2;
  }
  .art-page:lang(ka) .hero-statement {
    font-size:26px;
  }
  .art-page:lang(ka) h2:not(.threshold h2) {
    font-size:32px;
  }
}
@media(max-width:360px) {
  :root {
    --pad:18px;
  }
  .hero h1 {
    font-size:12.4vw;
  }
  .hero-statement {
    font-size:27px;
  }
  .hero-work {
    font-size:18px;
  }
  .hero-eyebrow {
    gap:16px;
  }
  .visit h2 {
    font-size:36px;
  }
}
@media(min-width:1001px) {
  .hero {
    padding-right:max(90px,var(--pad));
  }
  .section-wrap {
    padding-right:max(90px,var(--pad));
  }
}
@supports(animation-timeline:view()) {
  @media(prefers-reduced-motion:no-preference) {
    [data-reveal] {
      animation:section-arrive linear both;
      animation-timeline:view();
      animation-range:entry 0% entry 60%;
    }
    .motion-paused [data-reveal] {
      animation:none;
    }
    @keyframes section-arrive {
      from {
        opacity:.45;
        transform:translateY(22px);
      }
      to {
        opacity:1;
        transform:none;
      }
    }
  }
}
@media(prefers-reduced-motion:reduce) {
  @view-transition { navigation:none; }
  html {
    scroll-behavior:auto;
  }
  *,*:before,*:after {
    animation:none!important;
    transition:none!important;
  }
}
/* An open artwork caption with three quiet, expandable reading chapters. */
.work { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.35fr); gap:32px clamp(40px,7vw,100px); align-items:start; }
.work-caption { position:relative; padding:0; background:none; border:0; }
.work-kicker { flex-wrap:wrap; gap:8px 24px; margin-bottom:0; padding-bottom:44px; }
.work-kicker span { color:var(--muted); }
.work-artist { display:block; font-size:15px; letter-spacing:.015em; margin-bottom:20px; }
.work-caption h2 { font-weight:300; font-size:clamp(32px,3.5vw,50px); line-height:1.12; max-width:16ch; letter-spacing:-.025em; margin:0; }
.work-material { margin-top:28px; font-size:13px; color:var(--muted); letter-spacing:.015em; max-width:36ch; }
.work-reader { min-width:0; padding-top:0; }
.work-essay { width:100%; }
.reader-chapter { border-top:1px solid var(--line); scroll-margin-top:30px; }
.reader-chapter:last-child { border-bottom:1px solid var(--line); }
.reader-toggle { display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:88px; padding:25px 0; cursor:pointer; list-style:none; }
.reader-toggle::-webkit-details-marker { display:none; }
.reader-toggle::marker { content:''; }
.reader-toggle h3 { display:flex; align-items:baseline; gap:18px; font-size:clamp(21px,2vw,28px); font-weight:300; line-height:1.25; }
.reader-toggle:is(:hover,:focus-visible) { color:var(--accent); }
.reader-number { font-size:11px; color:var(--violet); letter-spacing:0; }
.reader-icon { position:relative; flex:0 0 22px; height:22px; color:var(--accent); }
.reader-icon:before,.reader-icon:after { content:''; position:absolute; width:16px; height:1px; background:currentColor; left:3px; top:10px; }
.reader-icon:after { transform:rotate(90deg); }
.reader-chapter[open] .reader-icon:after { transform:rotate(0); }
/* art.js marks a closing chapter at once; [open] stays until its panel has collapsed (B18). */
.reader-chapter[data-state="closed"] .reader-icon:after { transform:rotate(90deg); }
.reader-panel { overflow:hidden; }
.reader-copy { padding:0 0 30px 32px; font-size:clamp(16px,1.25vw,18px); line-height:1.8; }
.reader-copy p+p { margin-top:24px; }
.work-note { grid-column:2; margin-top:0; max-width:560px; font-size:13px; line-height:1.7; color:var(--muted); }
@media(max-width:900px) {
  .work { grid-template-columns:1fr; gap:40px; }
  .work-kicker { padding-bottom:28px; }
  .work-caption h2 { font-size:clamp(32px,5.4vw,46px); }
  .work-note { grid-column:1; }
}
@media(max-width:600px) {
  .work-caption h2 { font-size:32px; }
  .work-artist { font-size:14px; }
  .reader-toggle { gap:16px; min-height:78px; padding:22px 0; }
  .reader-toggle h3 { gap:12px; font-size:21px; }
  .reader-copy { padding-left:0; }
  .threshold:lang(ka) h2 { font-size:clamp(22px,5.3vw,30px); }
}
@media(prefers-reduced-motion:no-preference) {
  .reader-toggle { transition:color .25s; }
  .reader-icon:after { transition:transform .3s var(--ease); }
}
/* The optional light scene is pigment on warm paper, not a color inversion. */
:root[data-art-theme="light"] {
  color-scheme:light;
  --ink:#f5f1eb; --paper:#25212d; --muted:#675b71; --line:rgba(68,48,83,.21);
  --violet:#705087; --accent:#754a9e; --work-glow:rgba(126,88,176,.10); --soft-surface:rgba(76,50,95,.04);
}
[data-art-theme="light"] .brand-on-dark { display:none!important; }
[data-art-theme="light"] .brand-on-light { display:block!important; }
[data-art-theme="light"] .art-theme-toggle .icon-sun { opacity:1; transform:none; }
[data-art-theme="light"] .art-theme-toggle .icon-moon { opacity:0; transform:rotate(-90deg) scale(.6); }
[data-art-theme="light"] .art-header { border-color:var(--line); }
[data-art-theme="light"] .art-dropdown-panel { box-shadow:0 20px 60px -20px #00000026; }
[data-art-theme="light"] .light-field { background:#f5f1eb; }
[data-art-theme="light"] .field-fallback { opacity:.34; }
[data-art-theme="light"] .field-fallback:after { background:#f5f1eb; }
[data-art-theme="light"] .field-vignette { background:linear-gradient(180deg,#f5f1eb88,transparent 28%,transparent 50%,#f5f1eb99 78%,#f5f1eb); }
[data-art-theme="light"] .hero-eyebrow,[data-art-theme="light"] .hero-statement,[data-art-theme="light"] .hero h1 { text-shadow:none; }
[data-art-theme="light"] .hero-eyebrow,[data-art-theme="light"] .hero-work span,[data-art-theme="light"] .hero-artist,[data-art-theme="light"] .section-label,[data-art-theme="light"] .section-label span { color:var(--muted); }
[data-art-theme="light"] .scroll-line,[data-art-theme="light"] .art-rail-track { background:var(--line); }
[data-art-theme="light"] .art-rail-name { background:#f5f1ebed; }
[data-art-theme="light"] .threshold { background:radial-gradient(ellipse at 50% 50%,#e7dbee33 0%,transparent 68%); }
[data-art-theme="light"] .threshold-orbit { box-shadow:0 0 90px 12px #9277b018; }
[data-art-theme="light"] .orbit-light i { background:conic-gradient(from 15deg,transparent 0deg,#a884c644 28deg,#8053b6bb 55deg,#b18ad8dd 66deg,#9873bb66 83deg,transparent 120deg,transparent 172deg,#8c77bb77 204deg,#8661b4bb 220deg,#b4a0c866 242deg,transparent 278deg,transparent 360deg); }
[data-art-theme="light"] .threshold-orbit:after { background:radial-gradient(ellipse at 28% 20%,#ebe6ee85,transparent 52%),radial-gradient(ellipse at 80% 70%,#c6bad9aa,transparent 65%),linear-gradient(135deg,#ddd5e3ee,#ede7dfed 55%,#cfc2dcf0); box-shadow:inset 0 0 65px #9277ae1a; }
[data-art-theme="light"] .visit { background:radial-gradient(ellipse at 95% 100%,#d8bcca66 0,transparent 65%); }
@media(prefers-reduced-motion:no-preference) {
  body,.work-caption { transition:background-color .55s,color .55s; }
}
