:root {
  --paper: #f9f8f6;
  --white: #fff;
  --page-bg: var(--white);
  --overlay-bg: var(--white);
  --ink: #252323;
  --muted: #656163;
  --line: #d9d5d4;
  --pink: #fff0f3;
  --signal: #ff0066;
  --accent: #bb0046;
  --display: "MOISEIKIN Bodoni",Georgia,"Times New Roman",serif;
  --body: "MOISEIKIN Futura","Segoe UI",Arial,sans-serif;
  --space: clamp(64px,7.5vw,112px);
  --ease: cubic-bezier(.2,.7,.25,1);
  --duration: 240ms;
  color-scheme: light;
  --gutter: clamp(20px,4vw,64px);
  --radius-control: 6px;
  --radius-media: 10px;
  --radius-dialog: 20px;
  --motion-fast: 150ms;
  --brand-hover-scale: 1.02;
  --brand-hover-enter: 450ms;
  --brand-hover-leave: 550ms;
  --shadow-floating: 0 24px 80px rgb(37 35 35 / .16),0 2px 8px rgb(37 35 35 / .05)
}
* {
  box-sizing: border-box
}
html {
  scroll-behavior: smooth;
  scroll-padding-top: 24px
}
body {
  margin: 0;
  background: var(--page-bg);
  color: var(--ink);
  font: 400 18px/1.7 var(--body);
  -webkit-font-smoothing: antialiased
}
body:has(dialog[open]) {
  overflow: hidden
}
img {
  display: block;
  max-width: 100%;
  height: auto
}
a {
  color: inherit;
  text-decoration: none
}
button,input {
  font: inherit
}
button {
  cursor: pointer;
  color: inherit
}
button {
  background: none;
  border: 0
}
h1,h2,h3,p,figure,blockquote {
  margin: 0
}
h1,h2,h3 {
  font-weight: 400
}
h1,h2 {
  font-family: var(--display);
  line-height: 1.12;
  letter-spacing: -.032em
}
h1 {
  font-size: clamp(44px,5.7vw,82px)
}
h2 {
  font-size: clamp(34px,4vw,58px)
}
h3 {
  font-family: var(--display);
  font-size: clamp(23px,2.3vw,33px);
  line-height: 1.28;
  letter-spacing: -.018em
}
em {
  font-style: normal;
  color: var(--accent)
}
p {
  max-width: 65ch
}
p+p {
  margin-top: 20px
}
button,a,input,summary {
  -webkit-tap-highlight-color: transparent
}
:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 4px
}
summary {
  cursor: pointer
}
[hidden] {
  display: none!important
}
.wrap {
  width: calc(100% - var(--gutter) * 2);
  max-width: 1376px;
  margin-inline: auto
}
.section {
  padding-block: var(--space)
}
.eyebrow {
  font: 500 11px/1.6 var(--body);
  letter-spacing: .1em;
  text-transform: uppercase;
  display: flex;
  gap: 6px 20px;
  color: var(--muted);
  font-size: 11px;
  flex-wrap: wrap
}
.eyebrow>span {
  color: var(--accent)
}
.caption,figcaption {
  font-size: 13px;
  line-height: 1.6;
  color: var(--muted)
}
figcaption {
  margin-top: 13px
}
.lead {
  font-size: clamp(19px,1.65vw,24px);
  line-height: 1.6
}
.button {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  background: var(--accent);
  color: white;
  padding: 15px 22px;
  min-height: 56px;
  font-size: 16px;
  font-weight: 700;
  transition: background var(--motion-fast) var(--ease),border-color var(--motion-fast) var(--ease),transform var(--motion-fast) var(--ease);
  border: 1px solid var(--accent);
  border-radius: var(--radius-control);
  max-width: 100%;
  text-align: left
}
.button:hover {
  background: #910037;
  border-color: #910037
}
.button span {
  font-size: 22px;
  line-height: 1;
  flex-shrink: 0
}
.text-link {
  display: inline-flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  border-bottom: 1px solid var(--ink);
  padding: 10px 0;
  min-height: 44px;
  font-size: 16px;
  line-height: 1.5;
  transition: color var(--motion-fast) var(--ease),border-color var(--motion-fast) var(--ease)
}
.text-link span {
  font-size: 21px;
  transition: transform var(--motion-fast) var(--ease);
  flex-shrink: 0
}
.text-link:hover {
  color: var(--accent);
  border-color: var(--accent)
}
.text-link:hover span {
}
.skip {
  position: fixed;
  top: 8px;
  left: 20px;
  padding: 12px 24px;
  background: var(--white);
  z-index: 100;
  transform: translateY(-150%)
}
.skip:focus {
  transform: none
}
.header {
  min-height: 108px;
  display: flex;
  align-items: center;
  border-bottom: 1px solid var(--line);
  gap: 32px
}
.brand {
  display: block;
  padding-block: 20px;
  flex-shrink: 0
}
.brand img {
  width: 204px;
  height: auto;
  object-fit: contain
}
@media screen and (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
 .brand img {
  transform-origin: left center;
  transition: transform var(--brand-hover-leave) var(--ease)
}
 .brand:hover img {
  transform: scale(var(--brand-hover-scale));
  transition-duration: var(--brand-hover-enter)
}
}
.header-caption {
  font-size: 9px;
  letter-spacing: .13em;
  line-height: 1.8;
  border-left: 1px solid var(--line);
  padding-left: 28px
}
.desktop-nav {
  margin-left: auto;
  display: flex;
  gap: 30px;
  font-size: 14px
}
.desktop-nav a {
  padding: 14px 0;
  border-bottom: 1px solid transparent
}
.desktop-nav a:hover,.desktop-nav [aria-current] {
  color: var(--accent);
  border-color: var(--accent)
}
.menu-toggle {
  display: flex;
  align-items: center;
  gap: 15px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .12em;
  min-width: 44px;
  min-height: 48px;
  padding: 0 0 0 18px;
  border-left: 1px solid var(--line);
  border-radius: 0 var(--radius-control) var(--radius-control) 0;
  transition: color var(--motion-fast) var(--ease)
}
.menu-toggle:hover {
  color: var(--accent)
}
dialog {
  color: var(--ink);
  border: 0;
  padding: 0;
  border-radius: var(--radius-dialog);
  box-shadow: var(--shadow-floating)
}
dialog::backdrop {
  background: rgb(25 20 23 / .45)
}
.menu-dialog {
  margin: 0 0 0 auto;
  max-height: 100dvh;
  height: 100dvh;
  width: min(640px,100%);
  max-width: 100%;
  background: var(--overlay-bg);
  padding: 0 clamp(24px,4vw,56px) max(24px,env(safe-area-inset-bottom,0px));
  border-radius: 20px 0 0 20px;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-top: 0;
  padding-bottom: max(24px,env(safe-area-inset-bottom,0px));
  scroll-padding-top: 96px;
  scroll-padding-bottom: 24px
}
.menu-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
  padding-block: max(20px,env(safe-area-inset-top,0px)) 16px;
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--overlay-bg);
  border-bottom: 1px solid var(--line)
}
.close-button {
  font: 400 36px/1 var(--body);
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  border-radius: 50%;
  transition: background var(--motion-fast) var(--ease),color var(--motion-fast) var(--ease)
}
.close-button:hover {
  color: var(--accent)
}
.menu-dialog nav {
  display: grid
}
.menu-dialog nav a {
  display: flex;
  align-items: center;
  gap: 16px;
  border-bottom: 1px solid var(--line);
  padding: 16px 0;
  font: 400 clamp(22px,2.6vw,34px)/1.4 var(--display);
  font-size: clamp(24px,2.4vw,34px);
  transition: color var(--motion-fast) var(--ease)
}
.menu-dialog nav a>span:first-child {
  font: 12px var(--body);
  color: var(--accent)
}
.menu-dialog nav a>span:last-child {
  margin-left: auto;
  font: 24px var(--body)
}
.menu-dialog nav a:hover {
  color: var(--accent)
}
.menu-contact {
  margin-top: 28px
}
.hero {
  padding-top: clamp(32px,4.5vw,64px);
  display: grid;
  grid-template-columns: 1fr 1.03fr;
  column-gap: clamp(32px,4.5vw,64px);
  position: relative;
  align-items: center
}
.hero-copy {
  position: relative;
  z-index: 1;
  padding: 0
}
.hero h1 {
  font-size: clamp(48px,5.8vw,84px);
  line-height: 1.06;
  margin-top: 28px;
  letter-spacing: -.035em
}
.hero h1 span {
  color: var(--accent)
}
.hero-intro {
  font-size: 19px;
  line-height: 1.65;
  max-width: 35ch;
  margin: 28px 0
}
.hero-author {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 14px;
  margin-top: 16px;
  min-height: 44px
}
.author-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--accent)
}
.hero-author:hover {
  color: var(--accent)
}
.hero-art {
  position: relative;
  padding-top: 0
}
.hero-art img {
  height: clamp(480px,42vw,620px);
  width: 100%;
  object-fit: cover;
  object-position: 53% 50%;
  border-radius: var(--radius-media)
}
.hero-art figcaption {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding-top: 4px;
  font-size: 12px;
  letter-spacing: .025em
}
.hero-art figcaption>span:first-child {
  font-weight: 400;
  letter-spacing: .08em
}
.hero-foot {
  grid-column: 1/-1;
  display: flex;
  justify-content: space-between;
  padding-block: 24px 32px;
  font-size: 11px;
  letter-spacing: .07em;
  color: var(--muted)
}
.hero-foot a {
  display: flex;
  gap: 28px;
  align-items: center;
  font-size: 12px;
  letter-spacing: 0
}
.hero-foot a span {
  font-size: 18px
}
.event-strip {
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line)
}
.event-strip>a {
  display: grid;
  grid-template-columns: 175px 1fr 110px;
  align-items: center;
  gap: 28px;
  padding-block: 26px
}
.event-date {
  display: flex;
  gap: 18px;
  align-items: center;
  border-right: 1px solid var(--line)
}
.event-date>span {
  font: 54px/1 var(--display);
  color: var(--accent);
  letter-spacing: -.06em
}
.event-date>div {
  font-size: 11px;
  letter-spacing: .1em;
  line-height: 1.8
}
.event-strip-title .eyebrow {
  font-size: 10px;
  letter-spacing: .12em
}
.event-strip h2 {
  font: 400 clamp(20px,1.8vw,28px)/1.4 var(--display);
  letter-spacing: -.03em;
  margin-top: 6px;
  max-width: 36ch;
  line-height: 1.3
}
.event-strip-action {
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 28px
}
.event-strip-action span {
  font-size: 22px
}
.event-strip>a:hover h2 {
  color: var(--accent)
}
.author-section>.eyebrow {
  margin-bottom: 40px
}
.author-grid {
  display: grid;
  grid-template-columns: .9fr 1fr;
  gap: clamp(45px,8vw,145px);
  align-items: center
}
.portrait {
  padding-right: 32px
}
.portrait img {
  width: 100%;
  aspect-ratio: 1.04;
  object-fit: cover;
  object-position: 50% 35%;
  border-radius: var(--radius-media)
}
.author-copy h2 {
  margin-bottom: 30px
}
.author-copy>p {
  font-size: 18px;
  max-width: 42ch;
  line-height: 1.75
}
.author-copy blockquote {
  font: 400 clamp(23px,2.2vw,32px)/1.55 var(--display);
  letter-spacing: -.025em;
  margin-top: 36px;
  padding-top: 30px;
  border-top: 1px solid var(--line);
  max-width: 28ch
}
.author-copy .quote-source {
  font-size: 12px;
  color: var(--muted);
  margin-top: 12px
}
.author-copy .text-link {
  margin-top: 22px
}
.section-head {
  display: grid;
  grid-template-columns: 1fr 2.2fr;
  gap: 34px;
  margin-bottom: 48px
}
.section-head>.eyebrow {
  padding-top: 9px
}
.section-intro {
  font-size: 18px;
  max-width: 51ch;
  margin-top: 24px;
  color: var(--muted)
}
.art-section {
  background: var(--paper)
}
.art-tabs {
  display: flex;
  gap: 34px;
  border-bottom: 1px solid #c9c4c6;
  margin-bottom: 36px
}
.art-tabs button {
  font-size: 15px;
  min-height: 52px;
  padding: 12px 0;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  transition: color var(--motion-fast) var(--ease),border-color var(--motion-fast) var(--ease)
}
.art-tabs [aria-selected=true] {
  color: var(--accent);
  border-color: var(--accent)
}
.art-pair {
  display: grid;
  grid-template-columns: 1fr 120px 1fr;
  align-items: center
}
.art-pair figure {
  align-self: start;
  min-width: 0
}
.art-pair figure img {
  width: 100%;
  height: 470px;
  object-fit: cover;
  border-radius: var(--radius-media)
}
.art-pair figure:last-child img {
  object-fit: contain;
  background: #0d1824
}
.art-pair figcaption {
  display: flex;
  align-items: baseline;
  gap: 28px;
  margin-top: 18px;
  font-size: 14px;
  line-height: 1.6
}
.art-pair figcaption>span {
  font-size: 11px;
  letter-spacing: .12em;
  flex-shrink: 0
}
.art-translation {
  display: grid;
  gap: 18px;
  text-align: center;
  margin-bottom: 80px
}
.translation-symbol {
  font-size: 32px;
  color: var(--accent)
}
.art-translation>span:last-child {
  font-size: 9px;
  letter-spacing: .12em;
  line-height: 1.8
}
.selected-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 30px;
  align-items: start
}
.selected-grid>.work:nth-child(2) {
  margin-top: 80px
}
.work {
  min-width: 0
}
.work-image {
  position: relative;
  background: #0d1824;
  overflow: hidden;
  border-radius: var(--radius-media)
}
.work-image img {
  width: 100%;
  height: 410px;
  object-fit: contain;
  transition: transform 400ms var(--ease)
}
.work-open:hover img {
}
.enlarge {
  position: absolute;
  right: 14px;
  bottom: 14px;
  width: 44px;
  height: 44px;
  border: 1px solid #ffffff70;
  color: white;
  display: grid;
  place-items: center;
  font-size: 21px;
  background: rgb(13 24 36 / .9);
  border-radius: 50%
}
.work-caption {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: start;
  margin-top: 18px
}
.work-caption h3 {
  font-size: 25px;
  line-height: 1.4
}
.work-caption>span {
  font-size: 13px;
  line-height: 1.6;
  text-align: right;
  color: var(--muted);
  max-width: 20ch;
  margin-top: 5px
}
.section-end {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 32px;
  margin-top: 48px;
  padding-top: 30px;
  border-top: 1px solid var(--line)
}
.section-end>p {
  font-size: 16px;
  color: var(--muted)
}
.technology {
  background: var(--pink)
}
.technology-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 42px 90px
}
.technology .eyebrow {
  margin-bottom: 28px
}
.technology h2 {
  margin-bottom: 28px
}
.technology p:not(.eyebrow) {
  font-size: 18px;
  max-width: 45ch
}
.technology .text-link {
  margin-top: 22px
}
.craft-image img {
  width: 100%;
  height: 410px;
  object-fit: cover;
  border-radius: var(--radius-media)
}
.tech-demo {
  grid-column: 1/-1;
  border-top: 1px solid #d7b8c3;
  padding-top: 20px
}
.tech-demo summary {
  list-style: none;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: center;
  min-height: 48px;
  font-size: 16px
}
.tech-demo summary span {
  font-size: 28px
}
.tech-demo[open] summary span {
  transform: rotate(45deg)
}
.demo-body {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 60px;
  margin-top: 20px
}
.gem-schematic {
  max-width: 380px;
  color: var(--accent)
}
#moving-gem {
  transform-origin: 180px 118px;
  transform: rotate(var(--gem-angle,0deg))
}
.demo-body input {
  width: 100%;
  accent-color: var(--accent);
  margin: 24px 0;
  height: 44px
}
.demo-body label {
  display: flex;
  justify-content: space-between
}
.demo-body .caption {
  font-size: 12px!important
}
.journal-feature {
  display: grid;
  grid-template-columns: 1.18fr 1fr;
  gap: 70px;
  align-items: center
}
.journal-feature img {
  width: 100%;
  height: 450px;
  object-fit: cover;
  border-radius: var(--radius-media)
}
.journal-feature h2,.journal-feature h3 {
  font: 400 clamp(32px,3.5vw,52px)/1.25 var(--display);
  letter-spacing: -.035em;
  margin-top: 20px
}
.journal-feature p:not(.eyebrow) {
  font-size: 18px;
  margin-top: 26px;
  max-width: 37ch
}
.journal-feature .text-link {
  margin-top: 24px
}
.journal-feature:hover .text-link {
  color: var(--accent)
}
.cities {
  background: var(--page-bg)
}
.city-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px
}
.city-top {
  border-top: 1px solid #c9c4c6;
  padding-top: 30px;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: center
}
.city-top h3 {
  font-size: clamp(28px,2.5vw,36px)
}
.city-top time {
  font-size: 26px;
  font-weight: 300;
  font-variant-numeric: tabular-nums;
  color: var(--accent)
}
.city-grid p {
  font-size: 15px;
  margin-top: 24px
}
.city-grid .text-link {
  margin-top: 20px
}
.footer {
  margin-top: var(--space);
  border-top: 1px solid var(--line);
  content-visibility: auto;
  contain-intrinsic-size: auto 900px
}
body[data-page="home"] .footer {
  margin-top: 0
}
.club {
  padding-block: 70px 80px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center
}
.club h2 {
  margin-top: 22px
}
.club>div:last-child>p {
  font-size: 18px;
  max-width: 37ch
}
.club .button {
  margin-top: 26px
}
.club .caption {
  font-size: 13px!important;
  margin-top: 12px;
  color: var(--muted)
}
.footer-main {
  border-top: 1px solid var(--line);
  display: grid;
  grid-template-columns: 1.3fr 1fr 1fr 1.2fr;
  gap: 40px;
  padding-block: 45px
}
.footer-main>div {
  display: grid;
  gap: 6px;
  align-content: start
}
.footer-main>div>a {
  font-size: 15px;
  min-height: 40px
}
.footer-main>div>a:hover {
  color: var(--accent)
}
.footer-main .eyebrow {
  margin-bottom: 10px;
  font-size: 11px
}
.footer-main .brand {
  padding: 10px 0
}
.footer-bottom {
  display: flex;
  justify-content: space-between;
  gap: 30px;
  border-top: 1px solid var(--line);
  padding-block: 24px;
  font-size: 12px;
  color: var(--muted)
}
.crumb {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  font-size: 13px;
  color: var(--muted);
  margin-top: 34px;
  align-items: center
}
.crumb a:hover {
  color: var(--accent)
}
.page-intro {
  padding-block: 54px 60px
}
.page-intro h1 {
  margin-top: 28px
}
.page-intro .lead {
  margin-top: 30px;
  max-width: 55ch
}
.page-intro>.caption {
  margin-top: 16px
}
.page-intro .status-line {
  margin-top: 26px
}
.status-line {
  color: var(--accent);
  font-size: 13px;
  padding-left: 18px;
  border-left: 2px solid var(--accent);
  max-width: 50ch
}
.author-intro {
  padding-bottom: 48px
}
.author-long {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 80px;
  align-items: start
}
.author-long>figure img {
  width: 100%;
  height: 580px;
  object-fit: cover;
  object-position: 45% 50%;
  border-radius: var(--radius-media)
}
.author-long h2 {
  font-size: clamp(32px,3vw,44px);
  margin-bottom: 30px
}
.author-long p {
  font-size: 18px;
  line-height: 1.75
}
.author-long .text-link {
  margin-top: 28px
}
.timeline {
  margin-left: 32%;
  border-top: 1px solid var(--line)
}
.timeline article {
  display: grid;
  grid-template-columns: 100px 1fr;
  gap: 35px;
  padding-block: 32px;
  border-bottom: 1px solid var(--line)
}
.timeline article>span {
  font: 32px var(--display);
  color: var(--accent)
}
.timeline p {
  font-size: 17px;
  margin-top: 16px
}
.source-note {
  font-size: 13px;
  color: var(--muted);
  margin-top: 32px;
  max-width: 80ch;
  line-height: 1.7
}
.source-note>a:not(.text-link) {
  text-decoration: underline;
  text-underline-offset: 4px
}
.author-quote {
  text-align: center;
  border-top: 1px solid var(--line)
}
.author-quote blockquote {
  font: 400 clamp(32px,4.4vw,64px)/1.4 var(--display);
  letter-spacing: -.04em
}
.author-quote .eyebrow {
  display: block;
  max-width: none;
  margin-top: 32px
}
.author-quote .text-link {
  margin-top: 24px
}
/* External publications share the site's editorial typography and surfaces. */
.press-intro .caption {
  max-width: 65ch
}
.press-list {
  list-style: none;
  margin: 0;
  padding: 0
}
.press-list>li {
  border-top: 1px solid var(--line)
}
.press-list>li:last-child {
  border-bottom: 1px solid var(--line)
}
.press-card {
  display: grid;
  grid-template-columns: minmax(0,.7fr) minmax(0,1.8fr);
  gap: clamp(32px,5vw,80px);
  padding: clamp(32px,4vw,56px) 0;
  text-decoration: none
}
.press-meta {
  color: var(--muted);
  font-size: 15px;
  line-height: 1.6;
  overflow-wrap: anywhere
}
.press-publisher {
  color: var(--ink);
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 14px
}
.press-meta>p:last-child {
  margin-top: 8px
}
.press-story {
  min-width: 0;
  overflow-wrap: anywhere
}
.press-story h2 {
  font-size: clamp(28px,3vw,42px);
  line-height: 1.18;
  letter-spacing: -.025em;
  overflow-wrap: anywhere;
  text-wrap: pretty
}
.press-excerpt {
  max-width: 66ch;
  margin-top: 22px;
  font-size: 18px;
  line-height: 1.65
}
.press-author {
  margin-top: 16px;
  color: var(--muted);
  font-size: 14px
}
.press-action {
  display: inline-flex;
  align-items: center;
  gap: 24px;
  min-height: 44px;
  margin-top: 20px;
  border-bottom: 1px solid var(--ink);
  font-size: 15px
}
.press-card:hover .press-action {
  color: var(--accent);
  border-color: currentColor
}
.menu-dialog nav a[aria-current=page],.footer-main a[aria-current=page] {
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 5px
}
.press-empty {
  padding-block: 40px;
  border-block: 1px solid var(--line)
}
@media(max-width:800px) {
 .press-card {
  grid-template-columns: 1fr;
  gap: 24px
}
 .press-publisher {
  margin-bottom: 8px
}
 .press-excerpt {
  font-size: 17px
}
}
.gallery-toolbar {
  display: flex;
  gap: 20px;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
  margin-bottom: 40px
}
.filters {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  padding-block: 12px
}
.filters button {
  font-size: 15px;
  min-height: 44px;
  padding: 9px 16px;
  border-bottom: 2px solid transparent;
  margin-bottom: 0;
  border-radius: var(--radius-control);
  border: 1px solid transparent;
  transition: background var(--motion-fast) var(--ease),color var(--motion-fast) var(--ease)
}
.filters button[aria-pressed=true] {
  color: var(--accent);
  border-color: var(--accent);
  background: var(--pink)
}
#work-count {
  font-size: 13px;
  color: var(--muted);
  white-space: nowrap
}
.gallery-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 44px 28px
}
.gallery-grid .work-image img {
  height: 360px
}
.gallery-grid .work-caption h3 {
  font-size: 24px
}
.gallery-grid .work-caption {
  display: block
}
.gallery-grid .work-caption>span {
  display: block;
  max-width: none;
  text-align: left;
  font-size: 13px;
  margin-top: 7px;
  line-height: 1.6
}
.lightbox {
  width: min(1120px,calc(100% - 40px));
  max-width: none;
  max-height: calc(100dvh - 32px);
  background: var(--overlay-bg);
  padding: 20px 28px;
  border-radius: var(--radius-dialog)
}
.lightbox-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 14px;
  color: var(--muted)
}
.lightbox-art {
  display: grid;
  grid-template-columns: 48px 1fr 48px;
  gap: 18px;
  align-items: center
}
.lightbox-art img {
  max-width: 100%;
  height: min(64dvh,620px);
  width: 100%;
  object-fit: contain
}
.lightbox-art button {
  width: 48px;
  min-height: 52px;
  font-size: 26px;
  border-radius: var(--radius-control)
}
.lightbox-art button:hover {
  color: var(--accent)
}
.lightbox-caption {
  text-align: center;
  padding: 22px 0 12px
}
.lightbox-caption h2 {
  font-size: 28px
}
.lightbox-caption p {
  font-size: 14px;
  margin: 10px auto 0;
  color: var(--muted)
}
.event-intro {
  display: grid;
  grid-template-columns: 1.45fr 1fr;
  gap: 56px;
  align-items: center
}
.event-intro h1 {
  font-size: clamp(40px,4.6vw,66px);
  line-height: 1.2;
  margin-top: 24px
}
.event-intro h1 em {
  font-size: .77em
}
.event-state {
  font-size: 12px;
  color: var(--muted);
  margin-top: 20px
}
.event-intro .lead {
  font-size: 18px;
  max-width: 40ch;
  margin-top: 26px
}
.event-intro .button {
  margin-top: 26px;
  font-size: 16px;
  min-height: 56px;
  padding: 15px 22px;
  gap: 24px
}
.event-art {
  padding: 10px 28px 0 0
}
.event-art img {
  width: 100%;
  height: 550px;
  object-fit: contain;
  background: #0d1824;
  border-radius: var(--radius-media)
}
.event-art figcaption {
  text-align: right
}
.event-logistics {
  display: grid;
  grid-template-columns: .7fr 1.1fr 1fr;
  padding-block: 34px;
  gap: 35px;
  border-block: 1px solid var(--line)
}
.event-logistics p:not(.eyebrow) {
  font-size: 20px;
  margin-top: 16px
}
.event-logistics .eyebrow {
  font-size: 10px
}
.programme {
  margin-left: 32%
}
.programme article {
  display: grid;
  grid-template-columns: 45px 1fr;
  gap: 24px;
  padding: 32px 0;
  border-top: 1px solid var(--line)
}
.programme article>span {
  font: 25px var(--display);
  color: var(--accent)
}
.programme article h3 {
  margin-top: 18px;
  font-size: clamp(26px,2.6vw,38px)
}
.programme article p:not(.eyebrow) {
  margin-top: 18px;
  font-size: 15px;
  color: var(--muted)
}
.hospitality {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
  border-block: 1px solid var(--line);
  padding: 22px 0;
  margin-top: 25px;
  font-size: 14px
}
.hospitality span:before {
  content: '·';
  color: var(--accent);
  margin-right: 16px
}
.participation {
  background: var(--pink)
}
.participation-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px
}
.participation-grid article {
  border-top: 1px solid #d7b8c3;
  padding-top: 30px
}
.participation-grid h3 {
  margin-top: 16px;
  margin-bottom: 22px
}
.participation-grid p:not(.eyebrow) {
  font-size: 16px;
  max-width: 45ch
}
.invitation-note {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 65px;
  margin-top: 56px;
  border-top: 1px solid #d7b8c3;
  padding-top: 40px;
  align-items: center
}
.invitation-note h3 {
  font-size: 28px
}
.invitation-note p {
  font-size: 16px;
  margin-top: 18px
}
.contact-actions {
  display: grid;
  justify-items: start;
  gap: 18px
}
.archive-note {
  margin-top: 40px;
  padding-top: 30px;
  border-top: 1px solid #d7b8c3
}
.archive-note p {
  margin-top: 20px
}
.questions {
  display: grid;
  grid-template-columns: 1fr 1.25fr;
  gap: 60px
}
.questions .section-head {
  display: block
}
.questions .section-head h2 {
  margin-top: 30px
}
.questions details {
  border-bottom: 1px solid var(--line);
  padding-block: 22px
}
.questions summary {
  font-size: 18px;
  min-height: 44px
}
.questions details p {
  font-size: 17px;
  margin-top: 20px
}
.journal-external {
  display: grid;
  grid-template-columns: 1fr .7fr;
  gap: 70px;
  align-items: center;
  padding-block: 70px;
  border-bottom: 1px solid var(--line);
  margin-top: 40px;
  border-top: 1px solid var(--line)
}
.journal-external h2 {
  font-size: clamp(30px,3vw,46px);
  margin-top: 25px
}
.journal-external p:not(.eyebrow) {
  font-size: 18px;
  margin-top: 25px
}
.journal-external .text-link {
  margin-top: 20px
}
.journal-future p {
  font-size: 17px;
  margin-top: 30px
}
.journal-future .text-link {
  margin-top: 24px
}
.reading {
  max-width: 1100px
}
.reading .page-intro {
  max-width: 950px
}
.reading .page-intro h1 {
  font-size: clamp(40px,5vw,72px)
}
.reading-cover img {
  width: 100%;
  max-height: 610px;
  object-fit: cover;
  border-radius: var(--radius-media)
}
.chapter-nav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 50px;
  padding-block: 50px
}
.chapter-nav a {
  display: flex;
  gap: 22px;
  border-bottom: 1px solid var(--line);
  padding: 16px 0;
  font-size: 14px
}
.chapter-nav a>span {
  color: var(--accent);
  font-size: 11px
}
.chapter-nav a:hover {
  color: var(--accent)
}
.reading-chapter {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  padding-block: 65px;
  border-top: 1px solid var(--line);
  align-items: center
}
.reading-chapter:nth-of-type(2n)>figure {
  order: -1
}
.reading-chapter h2 {
  font-size: clamp(30px,3.2vw,46px);
  margin-top: 24px
}
.reading-chapter p:not(.eyebrow) {
  font-size: 18px;
  margin-top: 28px
}
.reading-chapter img {
  width: 100%;
  height: 390px;
  object-fit: contain;
  background: #0d1824;
  border-radius: var(--radius-media)
}
.travel-hero {
  display: grid;
  grid-template-columns: 1.25fr 1fr;
  gap: 70px;
  align-items: center
}
.travel-hero>img {
  width: 100%;
  height: 480px;
  object-fit: cover;
  object-position: center 25%;
  border-radius: var(--radius-media)
}
.travel-hero p {
  font-size: 18px;
  margin-top: 30px
}
.travel-list article {
  display: grid;
  grid-template-columns: 50px 1fr 1.2fr;
  gap: 28px;
  border-top: 1px solid var(--line);
  padding-block: 32px
}
.travel-list article>span {
  font-size: 12px;
  color: var(--accent)
}
.travel-list h2 {
  font-size: 36px
}
.travel-list h3 {
  font: 500 17px var(--body);
  letter-spacing: 0
}
.travel-list p {
  font-size: 17px;
  margin-top: 16px
}
.contact-banner {
  border-block: 1px solid var(--line);
  padding-block: 55px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center
}
.contact-banner p {
  font-size: 17px
}
.contact-banner .button,.contact-banner .text-link {
  margin-top: 28px
}
.tea-feature {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 70px;
  align-items: center;
  margin-bottom: 85px
}
.tea-feature img {
  width: 100%;
  height: 450px;
  object-fit: contain;
  background: #0d1824;
  border-radius: var(--radius-media)
}
.tea-feature p {
  font-size: 18px;
  margin-top: 28px
}
.tea-feature .button {
  margin-top: 30px;
  font-size: 16px;
  gap: 24px;
  min-height: 56px;
  padding: 15px 22px
}
@media(min-width:1600px) {
 .hero {
  grid-template-columns: 1fr 1.15fr;
  gap: 60px;
  padding-top: 28px;
  column-gap: clamp(32px,4.5vw,64px);
  align-items: stretch
}
 .hero-art img {
  height: auto;
  border-radius: var(--radius-media)
}
 .hero h1 {
  font-size: 84px;
  letter-spacing: -.035em;
  line-height: 1.06;
  margin-top: 28px
}
 .hero-copy {
  padding-top: 38px;
  padding: 0
}
}
@media(max-width:1199px) {
 .wrap {
  width: calc(100% - var(--gutter) * 2)
}
 .header {
  gap: 24px
}
 .header-caption {
  display: none
}
 .desktop-nav {
  gap: 24px
}
 .hero {
  gap: 25px;
  padding-top: clamp(32px,4.5vw,64px);
  column-gap: clamp(32px,4.5vw,64px);
  align-items: center
}
 .hero h1 {
  font-size: clamp(48px,5.8vw,68px);
  letter-spacing: -.035em;
  line-height: 1.06;
  margin-top: 28px
}
 .hero-art img {
  height: clamp(480px,42vw,620px);
  border-radius: var(--radius-media)
}
 .hero-copy {
  padding-top: 12px;
  padding: 0
}
 .hero-intro {
  font-size: 19px;
  line-height: 1.65;
  max-width: 35ch;
  margin: 28px 0
}
 .hero h1 {
  margin-top: 28px;
  font-size: clamp(48px,5.8vw,68px);
  letter-spacing: -.035em;
  line-height: 1.06
}
 .hero .button {
  font-size: 16px;
  gap: 24px;
  min-height: 56px;
  padding: 15px 22px
}
 .hero-foot {
  padding-bottom: 30px;
  font-size: 11px;
  letter-spacing: .07em;
  padding-block: 24px 32px
}
 .event-strip>a {
  grid-template-columns: 150px 1fr 95px;
  gap: 24px
}
 .event-date {
  gap: 12px
}
 .event-date>span {
  font-size: 48px
}
 .author-grid {
  gap: 50px
}
 .portrait {
  padding: 0
}
 .art-pair {
  grid-template-columns: 1fr 70px 1fr
}
 .art-pair figure img {
  height: 400px;
  border-radius: var(--radius-media)
}
 .art-pair figcaption {
  display: block;
  font-size: 13px;
  line-height: 1.6
}
 .art-pair figcaption>span {
  display: block;
  margin-bottom: 6px;
  font-size: 11px
}
 .work-image img {
  height: 340px;
  transition: transform 400ms var(--ease)
}
 .work-caption {
  display: block
}
 .work-caption>span {
  display: block;
  text-align: left;
  max-width: 20ch;
  font-size: 13px
}
 .technology-grid {
  gap: 36px 55px
}
 .craft-image img {
  height: 380px;
  border-radius: var(--radius-media)
}
 .journal-feature {
  gap: 45px
}
 .journal-feature img {
  height: 400px;
  border-radius: var(--radius-media)
}
 .city-grid {
  gap: 45px
}
 .city-top {
  align-items: start;
  flex-wrap: wrap
}
 .city-top h3 {
  font-size: clamp(28px,2.5vw,36px)
}
 .footer-main {
  gap: 28px
}
 .footer-main .brand img {
  width: 160px
}
 .author-long {
  gap: 48px
}
 .author-long>figure img {
  height: 500px;
  border-radius: var(--radius-media)
}
 .gallery-grid .work-image img {
  height: 290px
}
 .event-intro {
  grid-template-columns: 1.4fr 1fr;
  gap: 35px
}
 .event-art {
  padding-right: 0
}
 .event-art img {
  height: 480px;
  border-radius: var(--radius-media)
}
 .participation-grid {
  gap: 50px
}
 .questions {
  gap: 40px
}
 .tea-feature,.travel-hero {
  gap: 45px
}
 .tea-feature img {
  height: 380px;
  border-radius: var(--radius-media)
}
}
@media(max-width:800px) {
 .wrap {
  width: calc(100% - var(--gutter) * 2)
}
 .header {
  min-height: 88px;
  gap: 20px
}
 .brand img {
  width: 204px
}
 .desktop-nav {
  gap: 18px;
  font-size: 12px
}
 .menu-toggle {
  padding-left: 14px;
  border-radius: 0 var(--radius-control) var(--radius-control) 0;
  transition: color var(--motion-fast) var(--ease)
}
 .menu-toggle>span {
  display: none
}
 .hero {
  padding-top: clamp(32px,4.5vw,64px);
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  column-gap: clamp(32px,4.5vw,64px);
  align-items: center
}
 .hero h1 {
  font-size: clamp(40px,5.8vw,48px);
  letter-spacing: -.035em;
  line-height: 1.06;
  margin-top: 28px
}
 .hero-copy>.eyebrow {
  font-size: 11px;
  letter-spacing: .1em
}
 .hero-art img {
  height: clamp(480px,42vw,620px);
  border-radius: var(--radius-media)
}
 .hero-intro {
  font-size: 19px;
  line-height: 1.65;
  max-width: 35ch;
  margin: 28px 0
}
 .hero .button {
  padding: 15px 22px;
  min-height: 56px;
  font-size: 16px;
  gap: 24px
}
 .hero-author {
  font-size: 14px;
  gap: 9px;
  min-height: 44px;
  margin-top: 16px
}
 .hero-foot {
  font-size: 11px;
  gap: 20px;
  letter-spacing: .07em;
  padding-block: 24px 32px
}
 .hero-foot a {
  gap: 12px;
  font-size: 12px;
  letter-spacing: 0
}
 .event-strip>a {
  grid-template-columns: 128px 1fr;
  gap: 22px
}
 .event-strip-action {
  display: none;
  font-size: 14px
}
 .event-strip h2 {
  font-size: 19px;
  line-height: 1.3
}
 .section-head {
  grid-template-columns: 1fr 2fr;
  gap: 24px;
  margin-bottom: 32px
}
 .eyebrow {
  font-size: 11px;
  gap: 6px 20px;
  letter-spacing: .1em;
  flex-wrap: wrap
}
 .author-grid {
  gap: 35px
}
 .author-copy>p {
  font-size: 18px;
  line-height: 1.75
}
 .author-copy blockquote {
  font-size: 23px
}
 .author-copy h2 {
  font-size: 34px
}
 .author-copy .quote-source {
  font-size: 12px
}
 .art-tabs {
  gap: 24px
}
 .art-tabs button {
  font-size: 14px;
  min-height: 52px;
  transition: color var(--motion-fast) var(--ease),border-color var(--motion-fast) var(--ease)
}
 .art-pair {
  grid-template-columns: 1fr 55px 1fr
}
 .art-pair figure img {
  height: 350px;
  border-radius: var(--radius-media)
}
 .art-translation>span:last-child {
  font-size: 7px
}
 .selected-grid {
  gap: 18px
}
 .work-image img {
  height: 285px;
  transition: transform 400ms var(--ease)
}
 .work-caption h3 {
  font-size: 22px
}
 .technology-grid {
  gap: 32px
}
 .technology p:not(.eyebrow) {
  font-size: 18px
}
 .craft-image img {
  height: 360px;
  border-radius: var(--radius-media)
}
 .journal-feature {
  gap: 35px
}
 .journal-feature img {
  height: 340px;
  border-radius: var(--radius-media)
}
 .city-grid {
  gap: 35px
}
 .city-top h3 {
  font-size: clamp(28px,2.5vw,36px)
}
 .city-top time {
  font-size: 23px
}
 .club {
  gap: 40px
}
 .footer-main {
  grid-template-columns: 1fr 1fr 1fr
}
 .footer-main>.brand {
  grid-column: 1/-1
}
 .footer-main .brand img {
  width: 180px
}
 .menu-dialog {
  width: min(640px,100%);
  border-radius: 0;
  padding-inline: 24px
}
 .author-long {
  gap: 35px
}
 .author-long>figure img {
  height: 440px;
  border-radius: var(--radius-media)
}
 .author-long h2 {
  font-size: 32px
}
 .author-long p {
  font-size: 18px;
  line-height: 1.75
}
 .timeline {
  margin-left: 0
}
 .gallery-grid {
  grid-template-columns: 1fr 1fr;
  gap: 35px 24px
}
 .gallery-grid .work-image img {
  height: 330px
}
 .filters {
  gap: 8px;
  padding-block: 12px
}
 .filters button {
  font-size: 15px;
  min-height: 44px;
  padding: 9px 16px;
  border-radius: var(--radius-control);
  border: 1px solid transparent;
  margin-bottom: 0;
  transition: background var(--motion-fast) var(--ease),color var(--motion-fast) var(--ease)
}
 .gallery-toolbar {
  align-items: end
}
 #work-count {
  padding-bottom: 14px;
  font-size: 13px
}
 .event-intro {
  grid-template-columns: 1.4fr 1fr;
  gap: 25px
}
 .event-intro h1 {
  font-size: 39px
}
 .event-art img {
  height: 430px;
  border-radius: var(--radius-media)
}
 .event-intro .lead {
  font-size: 18px
}
 .event-intro .button {
  font-size: 16px;
  gap: 24px;
  min-height: 56px;
  padding: 15px 22px
}
 .event-logistics {
  gap: 28px
}
 .event-logistics p:not(.eyebrow) {
  font-size: 17px
}
 .event-logistics .eyebrow {
  font-size: 9px
}
 .programme {
  margin-left: 20%
}
 .participation-grid {
  gap: 40px
}
 .invitation-note {
  grid-template-columns: 1fr;
  gap: 25px
}
 .contact-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 25px
}
 .questions {
  grid-template-columns: 1fr;
  gap: 0
}
 .questions .section-head {
  display: grid;
  grid-template-columns: 1fr 2fr;
  margin-bottom: 30px
}
 .questions .section-head h2 {
  margin: 0
}
 .journal-external {
  gap: 40px
}
 .reading-chapter {
  gap: 45px
}
 .reading-chapter img {
  height: 330px;
  border-radius: var(--radius-media)
}
 .travel-hero,.tea-feature {
  gap: 35px
}
 .travel-list article {
  grid-template-columns: 30px 1fr 1fr;
  gap: 20px
}
 .travel-list h2 {
  font-size: 29px
}
 .travel-hero>img {
  height: 440px;
  border-radius: var(--radius-media)
}
 .contact-banner {
  gap: 40px
}
 .tea-feature .button {
  padding: 15px 22px;
  font-size: 16px;
  min-height: 56px;
  gap: 24px
}
 .lightbox-art {
  gap: 12px
}
}
@media(max-width:600px) {
 :root {
  --space: clamp(64px,7.5vw,112px);
  --display: "MOISEIKIN Bodoni",Georgia,"Times New Roman",serif;
  --body: "MOISEIKIN Futura","Segoe UI",Arial,sans-serif;
  --duration: 240ms
}
 .wrap {
  width: calc(100% - var(--gutter) * 2)
}
 h1 {
  font-size: clamp(44px,5.7vw,82px)
}
 h2 {
  font-size: 34px;
  letter-spacing: -.045em
}
 .header {
  min-height: 80px;
  gap: 16px
}
 .brand img {
  width: 204px
}
 .desktop-nav {
  display: none
}
 .menu-toggle {
  margin-left: auto;
  padding-left: 16px;
  border-radius: 0 var(--radius-control) var(--radius-control) 0;
  transition: color var(--motion-fast) var(--ease)
}
 .menu-toggle>span {
  display: inline;
  font-size: 10px
}
 .header-caption {
  display: none
}
 .hero {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding-top: 28px;
  column-gap: clamp(32px,4.5vw,64px);
  align-items: stretch
}
 .hero-copy {
  padding-top: 0;
  padding: 0
}
 .hero-copy>.eyebrow {
  font-size: 11px;
  letter-spacing: .1em
}
 .hero h1 {
  font-size: clamp(38px,11.8vw,54px);
  line-height: 1.06;
  margin-top: 28px;
  letter-spacing: -.035em
}
 .hero-intro {
  font-size: 19px;
  line-height: 1.65;
  max-width: 35ch;
  margin: 28px 0
}
 .hero .button {
  min-height: 56px;
  font-size: 16px;
  gap: 24px;
  padding: 15px 22px
}
 .hero-author {
  margin-top: 16px;
  font-size: 14px;
  min-height: 44px
}
 .hero-art {
  padding: 28px 0 0;
  padding-top: 0
}
 .hero-art img {
  height: auto;
  aspect-ratio: 1.2;
  object-fit: cover;
  object-position: center;
  border-radius: var(--radius-media)
}
 .hero-art figcaption {
  font-size: 12px;
  margin-top: 10px;
  letter-spacing: .025em;
  padding-top: 4px
}
 .hero-foot {
  padding: 24px 0;
  font-size: 11px;
  letter-spacing: .07em;
  padding-block: 24px 32px
}
 .hero-foot>span {
  max-width: 22ch;
  font-size: 11px
}
 .hero-foot a {
  font-size: 12px;
  letter-spacing: 0
}
 .event-strip>a {
  grid-template-columns: 90px 1fr;
  gap: 16px;
  padding-block: 23px
}
 .event-date {
  gap: 9px
}
 .event-date>span {
  font-size: 38px
}
 .event-date>div {
  font-size: 11px
}
 .event-strip .eyebrow {
  font-size: 10px;
  letter-spacing: .08em
}
 .event-strip h2 {
  font-size: 16px;
  line-height: 1.3;
  margin-top: 8px
}
 .author-section>.eyebrow {
  margin-bottom: 24px
}
 .author-grid {
  grid-template-columns: 1fr;
  gap: 35px
}
 .portrait {
  max-width: 90%
}
 .portrait img {
  aspect-ratio: 1.12;
  border-radius: var(--radius-media)
}
 .portrait figcaption {
  font-size: 12px
}
 .author-copy h2 {
  font-size: 36px;
  margin-bottom: 22px
}
 .author-copy>p {
  font-size: 18px;
  max-width: 40ch;
  line-height: 1.75
}
 .author-copy blockquote {
  font-size: 24px;
  padding-top: 25px;
  margin-top: 28px;
  max-width: 26ch
}
 .author-copy .text-link {
  margin-top: 15px
}
 .section-head {
  display: block;
  margin-bottom: 32px
}
 .section-head>.eyebrow {
  padding: 0;
  margin-bottom: 24px
}
 .section-intro {
  font-size: 18px;
  margin-top: 22px
}
 .art-tabs {
  gap: 20px;
  overflow-x: auto;
  scrollbar-width: thin;
  margin-bottom: 24px
}
 .art-tabs button {
  font-size: 14px;
  flex-shrink: 0;
  min-height: 52px;
  transition: color var(--motion-fast) var(--ease),border-color var(--motion-fast) var(--ease)
}
 .art-pair {
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  align-items: start
}
 .art-translation {
  display: none
}
 .art-pair figure img {
  height: 245px;
  object-fit: cover;
  border-radius: var(--radius-media)
}
 .art-pair figure:last-child img {
  object-fit: contain
}
 .art-pair figcaption {
  font-size: 13px;
  line-height: 1.6;
  margin-top: 14px
}
 .art-pair figcaption>span {
  font-size: 11px
}
 .selected-grid {
  grid-template-columns: 1fr 1fr;
  gap: 30px 18px
}
 .selected-grid>.work:nth-child(2) {
  margin-top: 50px
}
 .selected-grid>.work:last-child {
  grid-column: 1/-1;
  max-width: 72%;
  margin-inline: auto
}
 .work-image img {
  height: 240px;
  transition: transform 400ms var(--ease)
}
 .selected-grid>.work:last-child img {
  height: 330px
}
 .work-caption {
  margin-top: 12px
}
 .work-caption h3 {
  font-size: 22px
}
 .work-caption>span {
  font-size: 13px;
  line-height: 1.5;
  max-width: 20ch
}
 .section-end {
  align-items: start;
  gap: 22px;
  flex-direction: column;
  margin-top: 32px;
  padding-top: 22px
}
 .section-end p {
  font-size: 13px
}
 .technology-grid {
  grid-template-columns: 1fr;
  gap: 28px
}
 .technology .eyebrow {
  margin-bottom: 24px
}
 .technology h2 {
  margin-bottom: 24px
}
 .technology p:not(.eyebrow) {
  font-size: 18px;
  max-width: 43ch
}
 .craft-image {
  margin-top: 12px
}
 .craft-image img {
  height: auto;
  aspect-ratio: 1.2;
  border-radius: var(--radius-media)
}
 .demo-body {
  grid-template-columns: 1fr;
  gap: 12px
}
 .gem-schematic {
  width: 100%;
  max-width: 300px;
  margin: auto
}
 .tech-demo summary {
  font-size: 16px
}
 .journal-feature {
  grid-template-columns: 1fr;
  gap: 28px
}
 .journal-feature img {
  height: auto;
  aspect-ratio: 1.17;
  border-radius: var(--radius-media)
}
 .journal-feature h2,.journal-feature h3 {
  font-size: 36px;
  line-height: 1.25;
  margin-top: 18px
}
 .journal-feature p:not(.eyebrow) {
  font-size: 18px;
  margin-top: 22px
}
 .journal-feature .text-link {
  margin-top: 15px
}
 .city-grid {
  grid-template-columns: 1fr;
  gap: 40px
}
 .city-top {
  padding-top: 24px;
  align-items: center
}
 .city-top h3 {
  font-size: clamp(28px,2.5vw,36px)
}
 .city-top time {
  font-size: 23px
}
 .city-grid p {
  font-size: 15px;
  margin-top: 18px
}
 .city-grid .text-link {
  margin-top: 14px
}
 .footer {
  margin-top: 68px;
  contain-intrinsic-size: auto 1400px
}
 .club {
  padding: 52px 0;
  grid-template-columns: 1fr;
  gap: 28px
}
 .club h2 {
  margin-top: 16px;
  font-size: 40px
}
 .club>div:last-child>p {
  font-size: 18px
}
 .club .button {
  margin-top: 20px
}
 .footer-main {
  grid-template-columns: 1fr 1fr;
  gap: 32px 22px;
  padding-block: 32px
}
 .footer-main .brand {
  padding-left: 1px
}
 .footer-main>div:last-child {
  grid-column: 1/-1
}
 .footer-main>div>a {
  font-size: 15px;
  min-height: 40px
}
 .footer-bottom {
  gap: 20px;
  font-size: 12px;
  align-items: start
}
 .footer-bottom>p {
  max-width: 28ch
}
 .footer-bottom>a {
  white-space: nowrap
}
 .menu-dialog {
  width: min(640px,100%);
  border-radius: 0;
  padding-inline: 24px
}
 .menu-top {
  margin-bottom: 16px;
  padding-block: max(20px,env(safe-area-inset-top,0px)) 16px
}
 .menu-top .eyebrow {
  font-size: 11px;
  max-width: 23ch
}
 .menu-dialog nav a {
  font-size: clamp(24px,2.4vw,34px);
  padding: 16px 0;
  gap: 16px;
  transition: color var(--motion-fast) var(--ease)
}
 .menu-contact {
  margin-top: 20px
}
 .crumb {
  margin-top: 24px;
  font-size: 13px;
  gap: 12px;
  align-items: center
}
 .page-intro {
  padding-block: 35px 40px
}
 .page-intro h1 {
  margin-top: 24px;
  font-size: 42px;
  line-height: 1.2
}
 .page-intro .lead {
  font-size: 17px;
  margin-top: 25px
}
 .page-intro .eyebrow {
  font-size: 12px;
  flex-wrap: wrap;
  gap: 8px 20px
}
 .author-long {
  grid-template-columns: 1fr;
  gap: 35px
}
 .author-long>figure img {
  height: auto;
  aspect-ratio: 1.05;
  border-radius: var(--radius-media)
}
 .author-long h2 {
  font-size: 36px
}
 .author-long p {
  font-size: 18px;
  line-height: 1.75
}
 .timeline article {
  grid-template-columns: 65px 1fr;
  gap: 20px;
  padding-block: 26px
}
 .timeline article>span {
  font-size: 26px
}
 .timeline h3 {
  font-size: 24px
}
 .timeline p {
  font-size: 17px
}
 .source-note {
  font-size: 13px;
  margin-top: 26px;
  line-height: 1.7
}
 .author-quote blockquote {
  font-size: 31px
}
 .author-quote .eyebrow {
  font-size: 8px;
  margin-top: 25px
}
 .gallery-toolbar {
  display: block
}
 .filters {
  gap: 8px;
  padding-block: 12px
}
 .filters button {
  font-size: 15px;
  min-height: 44px;
  padding: 9px 16px;
  border-radius: var(--radius-control);
  border: 1px solid transparent;
  margin-bottom: 0;
  transition: background var(--motion-fast) var(--ease),color var(--motion-fast) var(--ease)
}
 .gallery-toolbar #work-count {
  padding: 0;
  margin: 18px 0;
  font-size: 11px
}
 .gallery-grid {
  gap: 30px 16px
}
 .gallery-grid .work-image img {
  height: 225px
}
 .gallery-grid .work-caption h3 {
  font-size: 22px
}
 .gallery-grid .work-caption>span {
  font-size: 13px;
  line-height: 1.6
}
 .gallery-grid .enlarge {
  width: 44px;
  height: 44px;
  bottom: 9px;
  right: 9px;
  font-size: 20px
}
 .lightbox {
  width: calc(100% - 20px);
  padding: 12px;
  border-radius: 12px
}
 .lightbox-art {
  grid-template-columns: 38px 1fr 38px;
  gap: 2px
}
 .lightbox-art button {
  width: 38px;
  border-radius: var(--radius-control)
}
 .lightbox-art img {
  height: 58dvh
}
 .lightbox-caption h2 {
  font-size: 25px
}
 .lightbox-caption {
  padding: 20px 12px
}
 .event-intro {
  grid-template-columns: 1fr;
  gap: 30px
}
 .event-intro h1 {
  font-size: 43px;
  line-height: 1.18
}
 .event-intro h1 em {
  font-size: .71em
}
 .event-intro .lead {
  font-size: 18px
}
 .event-intro .button {
  font-size: 16px;
  padding: 15px 22px;
  min-height: 56px;
  gap: 24px
}
 .event-art {
  max-width: 78%;
  margin-left: auto
}
 .event-art img {
  height: 340px;
  border-radius: var(--radius-media)
}
 .event-art figcaption {
  font-size: 11px
}
 .event-logistics {
  grid-template-columns: 1fr;
  gap: 24px;
  padding-block: 28px
}
 .event-logistics>div {
  display: grid;
  grid-template-columns: 100px 1fr;
  gap: 20px
}
 .event-logistics p:not(.eyebrow) {
  margin: 0;
  font-size: 16px
}
 .event-logistics .eyebrow {
  font-size: 9px;
  align-self: start
}
 .programme {
  margin-left: 0
}
 .programme article {
  gap: 16px;
  grid-template-columns: 28px 1fr;
  padding-block: 26px
}
 .programme article h3 {
  font-size: 28px
}
 .programme article .eyebrow {
  font-size: 10px
}
 .hospitality {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  font-size: 12px;
  margin-top: 14px
}
 .participation-grid {
  grid-template-columns: 1fr;
  gap: 36px
}
 .participation-grid h3 {
  font-size: 30px
}
 .participation-grid .eyebrow {
  font-size: 10px
}
 .participation-grid p:not(.eyebrow) {
  font-size: 16px
}
 .invitation-note {
  margin-top: 35px;
  padding-top: 30px
}
 .invitation-note h3 {
  font-size: 28px
}
 .contact-actions {
  display: grid;
  gap: 10px
}
 .contact-actions .button {
  font-size: 13px;
  gap: 50px
}
 .questions .section-head {
  display: block
}
 .questions .section-head h2 {
  margin-top: 20px
}
 .questions details {
  padding-block: 21px
}
 .questions summary {
  font-size: 17px;
  min-height: 44px
}
 .journal-external {
  grid-template-columns: 1fr;
  gap: 30px;
  padding-block: 42px
}
 .journal-external figure {
  max-width: 80%;
  margin-left: auto
}
 .journal-external h2 {
  font-size: 32px
}
 .journal-future p {
  font-size: 16px
}
 .reading .page-intro h1 {
  font-size: 39px
}
 .reading-cover img {
  height: auto;
  aspect-ratio: 1.25;
  border-radius: var(--radius-media)
}
 .chapter-nav {
  grid-template-columns: 1fr;
  gap: 0;
  padding-block: 30px
}
 .chapter-nav a {
  font-size: 13px
}
 .reading-chapter {
  grid-template-columns: 1fr;
  gap: 30px;
  padding-block: 40px
}
 .reading-chapter:nth-of-type(2n)>figure {
  order: 0
}
 .reading-chapter img {
  height: 360px;
  border-radius: var(--radius-media)
}
 .reading-chapter h2 {
  font-size: 34px;
  margin-top: 18px
}
 .reading-chapter p:not(.eyebrow) {
  font-size: 18px;
  margin-top: 24px
}
 .travel-hero,.tea-feature {
  grid-template-columns: 1fr;
  gap: 30px
}
 .travel-hero>img {
  height: 330px;
  border-radius: var(--radius-media)
}
 .travel-hero h2,.tea-feature h2 {
  font-size: 36px
}
 .travel-hero p {
  font-size: 18px;
  margin-top: 23px
}
 .travel-list article {
  grid-template-columns: 30px 1fr;
  gap: 14px;
  padding-block: 26px
}
 .travel-list article>div {
  grid-column: 2
}
 .travel-list h2 {
  font-size: 30px
}
 .travel-list h3 {
  font-size: 16px
}
 .travel-list p {
  font-size: 17px
}
 .contact-banner {
  grid-template-columns: 1fr;
  gap: 28px;
  padding-block: 40px
}
 .contact-banner p {
  font-size: 16px
}
 .tea-feature img {
  height: 310px;
  border-radius: var(--radius-media)
}
 .tea-feature {
  margin-bottom: 50px
}
 .tea-feature .button {
  font-size: 16px;
  min-height: 56px;
  padding: 15px 22px;
  gap: 24px
}
 .status-line {
  font-size: 12px
}
}
@media(max-width:359px) {
 .wrap {
  width: calc(100% - var(--gutter) * 2)
}
 .hero h1 {
  font-size: clamp(34px,11.8vw,42px);
  letter-spacing: -.035em;
  line-height: 1.06;
  margin-top: 28px
}
 .hero-intro {
  font-size: 19px;
  line-height: 1.65;
  max-width: 35ch;
  margin: 28px 0
}
 .hero-art img {
  aspect-ratio: 1.1;
  border-radius: var(--radius-media);
  height: auto
}
 .event-strip>a {
  grid-template-columns: 80px 1fr;
  gap: 12px
}
 .event-date>span {
  font-size: 33px
}
 .event-date {
  gap: 6px
}
 .event-strip h2 {
  font-size: 15px;
  line-height: 1.3
}
 .art-tabs {
  gap: 16px
}
 .art-tabs button {
  font-size: 14px;
  min-height: 52px;
  transition: color var(--motion-fast) var(--ease),border-color var(--motion-fast) var(--ease)
}
 .art-pair figure img {
  height: 200px;
  border-radius: var(--radius-media)
}
 .selected-grid {
  gap: 25px 14px
}
 .work-image img {
  height: 210px;
  transition: transform 400ms var(--ease)
}
 .gallery-grid .work-image img {
  height: 195px
}
 .page-intro h1 {
  font-size: 36px
}
 .event-intro h1 {
  font-size: 37px
}
 .event-logistics>div {
  grid-template-columns: 85px 1fr
}
 .menu-dialog nav a {
  font-size: clamp(24px,2.4vw,34px);
  padding: 16px 0;
  gap: 16px;
  transition: color var(--motion-fast) var(--ease)
}
 .lightbox-caption h2 {
  font-size: 22px
}
 .city-top h3 {
  font-size: clamp(28px,2.5vw,36px)
}
}
@media(prefers-reduced-motion:reduce) {
 html {
  scroll-behavior: auto
}
 *,*:before,*:after {
  animation: none!important;
  transition: none!important;
  scroll-behavior: auto!important
}
 .button:hover,.work-open:hover img,.text-link:hover span {
  transform: none
}
}
.techniques {
  border-top: 1px solid var(--line);
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 70px
}
.techniques details {
  border-bottom: 1px solid var(--line);
  padding-block: 22px
}
.techniques summary {
  font-size: 18px;
  min-height: 44px
}
.techniques details p {
  font-size: 17px;
  margin-top: 20px
}
@media(max-width:800px) {
 .techniques {
  gap: 35px
}
}
@media(max-width:600px) {
 .techniques {
  grid-template-columns: 1fr;
  gap: 25px
}
}
.footer-legal {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 45px;
  padding-block: 32px;
  border-top: 1px solid var(--line)
}
.footer-legal nav {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 25px;
  margin-top: 17px;
  max-width: 760px
}
.footer-legal nav a {
  font-size: 14px;
  line-height: 1.6;
  text-decoration: underline;
  text-decoration-color: var(--line);
  text-underline-offset: 5px;
  padding-block: 6px;
  min-height: 40px
}
.footer-legal nav a:hover {
  color: var(--accent);
  text-decoration-color: currentColor
}
.social-links {
  display: flex;
  align-items: flex-start;
  gap: 26px;
  padding-top: 3px
}
.social-item {
  display: flex;
  align-items: center;
  gap: 11px;
  min-height: 44px;
  font-size: 14px;
  line-height: 1.4
}
.social-item svg {
  width: 32px;
  height: 32px;
  flex-shrink: 0
}
.social-item small {
  display: block;
  font-size: 11px;
  color: var(--muted);
  margin-top: 3px
}
/* Official social links: reuse brand tokens without moving footer elements. */
.social-links a.social-item {
  color: var(--ink)
}
@media(hover:hover) and (pointer:fine) {
 .social-links a.social-item:hover {
  color: var(--accent)
 }
}
.social-links a.social-item:focus-visible {
  color: var(--accent)
}
.social-links a.social-item:active {
  opacity: .8
}
/* End official social link states. */
.social-placeholder {
  cursor: default
}
.legal-wrap {
  padding-bottom: 100px
}
.legal-heading {
  padding-block: 55px 38px;
  max-width: 970px
}
.legal-heading h1 {
  font-size: clamp(36px,4.4vw,64px);
  line-height: 1.2;
  margin-top: 24px;
  overflow-wrap: anywhere
}
.legal-version {
  font-size: 14px;
  color: var(--muted);
  line-height: 1.8;
  margin-top: 25px;
  overflow-wrap: anywhere
}
.legal-notice {
  border-left: 3px solid var(--accent);
  background: var(--pink);
  padding: 22px 28px;
  margin: 0 0 45px;
  max-width: 970px;
  border-radius: 0 var(--radius-media) var(--radius-media) 0
}
.legal-notice strong {
  font-size: 16px;
  font-weight: 500
}
.legal-notice p {
  font-size: 16px;
  line-height: 1.7;
  margin-top: 8px;
  max-width: 84ch
}
.legal-index {
  border-top: 1px solid var(--line)
}
.legal-index>a {
  display: grid;
  grid-template-columns: 45px 1fr 24px;
  gap: 25px;
  padding-block: 30px;
  border-bottom: 1px solid var(--line);
  align-items: start
}
.legal-index h2 {
  font-size: clamp(25px,2.7vw,38px);
  line-height: 1.3
}
.legal-index p {
  font-size: 15px;
  margin-top: 15px
}
.legal-index>a:hover h2 {
  color: var(--accent)
}
.legal-number {
  font-size: 12px;
  color: var(--accent);
  letter-spacing: .08em
}
.legal-layout {
  display: grid;
  grid-template-columns: 260px minmax(0,780px);
  gap: clamp(40px,5vw,72px);
  align-items: start
}
.legal-toc {
  position: sticky;
  top: 30px
}
.legal-toc nav {
  display: grid;
  margin-top: 22px;
  gap: 2px
}
.legal-toc nav a {
  display: grid;
  grid-template-columns: 22px 1fr;
  gap: 10px;
  font-size: 15px;
  line-height: 1.5;
  padding: 11px 0
}
.legal-toc nav span {
  font-size: 10px;
  color: var(--accent);
  padding-top: 3px
}
.legal-toc nav a:hover {
  color: var(--accent)
}
.legal-toc>.text-link {
  margin-top: 24px
}
.legal-copy section {
  padding: 0 0 45px;
  scroll-margin-top: 30px
}
.legal-copy section+section {
  padding-top: 36px;
  border-top: 1px solid var(--line)
}
.legal-copy h2 {
  font-size: clamp(26px,2.5vw,36px);
  line-height: 1.3;
  margin: 12px 0 25px;
  letter-spacing: -.025em
}
.legal-copy h3 {
  font: 500 18px/1.5 var(--body);
  letter-spacing: 0;
  margin: 28px 0 14px
}
.legal-copy p {
  font-size: 18px;
  line-height: 1.8;
  max-width: none;
  overflow-wrap: anywhere
}
.legal-copy p+p {
  margin-top: 18px
}
.legal-copy a {
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 4px
}
.legal-copy strong {
  font-weight: 500
}
.legal-details {
  margin: 15px 0 30px
}
.legal-details>div {
  display: grid;
  grid-template-columns: 180px minmax(0,1fr);
  gap: 25px;
  padding-block: 16px;
  border-bottom: 1px solid var(--line)
}
.legal-details dt {
  font-size: 13px;
  color: var(--muted)
}
.legal-details dd {
  margin: 0;
  font-size: 17px;
  overflow-wrap: anywhere
}
.legal-pending {
  color: var(--muted);
  font-size: 14px
}
@media(max-width:1100px) {
 .footer-legal {
  grid-template-columns: 1fr
}
 .legal-layout {
  grid-template-columns: 210px minmax(0,1fr);
  gap: clamp(40px,5vw,72px)
}
 .social-links {
  gap: 35px
}
}
@media(max-width:700px) {
 .legal-layout {
  grid-template-columns: 1fr;
  gap: clamp(40px,5vw,72px)
}
 .legal-toc {
  position: static;
  border-block: 1px solid var(--line);
  padding-block: 25px
}
 .legal-heading {
  padding-block: 35px 28px
}
 .legal-notice {
  padding: 20px;
  border-radius: 0 var(--radius-media) var(--radius-media) 0
}
 .legal-copy p {
  font-size: 18px;
  line-height: 1.8
}
 .legal-details>div {
  grid-template-columns: 1fr;
  gap: 5px
}
 .legal-wrap {
  padding-bottom: 60px
}
 .legal-index>a {
  grid-template-columns: 24px 1fr 16px;
  gap: 12px
}
 .footer-legal {
  gap: 25px
}
 .footer-legal nav {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3px
}
 .footer-legal nav a {
  padding-block: 9px;
  font-size: 14px;
  min-height: 40px
}
 .legal-copy section {
  padding-bottom: 28px
}
}
@media print {
 body:has(.legal-wrap) {
  background: white;
  color: #111
}
 body:has(.legal-wrap) .header,body:has(.legal-wrap) .footer,body:has(.legal-wrap) .skip,.legal-toc,.legal-wrap>.crumb {
  display: none
}
 .legal-wrap {
  width: auto;
  max-width: none;
  margin: 0;
  padding: 0
}
 .legal-heading {
  padding: 0 0 18pt
}
 .legal-heading h1 {
  font-size: 26pt
}
 .legal-layout {
  display: block;
  gap: clamp(40px,5vw,72px)
}
 .legal-copy h2 {
  font-size: 18pt;
  break-after: avoid
}
 .legal-copy h3 {
  break-after: avoid
}
 .legal-copy p {
  font-size: 18px;
  line-height: 1.8
}
 .legal-copy section {
  padding-bottom: 15pt
}
 .legal-notice {
  background: white;
  border: 1px solid #555;
  border-radius: 0 var(--radius-media) var(--radius-media) 0
}
 .legal-copy a {
  color: #111
}
 .legal-details>div {
  break-inside: avoid
}
}
/* Persistent navigation: one full-width surface, no scroll-triggered resizing. */
:root {
  --header-size: 93px;
  --header-height: calc(var(--header-size) + env(safe-area-inset-top,0px));
  --display: "MOISEIKIN Bodoni",Georgia,"Times New Roman",serif;
  --body: "MOISEIKIN Futura","Segoe UI",Arial,sans-serif;
  --space: clamp(64px,7.5vw,112px);
  --duration: 240ms
}
html {
  scroll-padding-top: calc(var(--header-height) + 16px)
}
.site-header {
  position: sticky;
  top: 0;
  z-index: 40;
  background: var(--page-bg);
  border-bottom: 1px solid var(--line);
  padding-top: env(safe-area-inset-top,0px);
  box-shadow: 0 1px 0 rgb(37 35 35 / .02)
}
.site-header .header {
  min-height: 92px;
  border-bottom: 0;
  flex-wrap: wrap;
  gap: 12px 24px
}
.site-header .brand {
  padding-block: 16px;
  max-width: 100%
}
.site-header .desktop-nav {
  font-size: 16px;
  flex-wrap: wrap;
  gap: 8px 24px
}
.site-header .desktop-nav a {
  min-height: 44px;
  display: inline-flex;
  align-items: center
}
.site-header .header-caption {
  font-size: 11px;
  letter-spacing: .07em
}
.site-header .menu-toggle {
  margin-left: auto;
  min-height: 48px;
  flex-shrink: 0;
  font-size: 12px
}
.site-header .menu-toggle>span {
  font-size: inherit
}
.menu-dialog nav a {
  font-size: clamp(24px,2.4vw,34px);
  overflow-wrap: anywhere;
  padding: 16px 0;
  gap: 16px;
  transition: color var(--motion-fast) var(--ease)
}
.legal-toc {
  top: calc(var(--header-height) + 24px);
  max-height: calc(100dvh - var(--header-height) - 48px);
  overflow: auto;
  scrollbar-width: thin;
  padding: 6px
}
@media(max-width:900px) {
 :root {
  --header-size: 73px;
  --display: "MOISEIKIN Bodoni",Georgia,"Times New Roman",serif;
  --body: "MOISEIKIN Futura","Segoe UI",Arial,sans-serif;
  --space: clamp(64px,7.5vw,112px);
  --duration: 240ms
}
 .site-header .header {
  min-height: 72px;
  gap: 8px 16px
}
 .site-header .desktop-nav,.site-header .header-caption {
  display: none
}
 .site-header .menu-toggle>span {
  display: inline
}
 .site-header .brand img {
  width: 165px
}
}
@media(max-width:600px) {
 :root {
  --header-size: 69px;
  --display: "MOISEIKIN Bodoni",Georgia,"Times New Roman",serif;
  --body: "MOISEIKIN Futura","Segoe UI",Arial,sans-serif;
  --space: clamp(64px,7.5vw,112px);
  --duration: 240ms
}
 .site-header .header {
  min-height: 68px
}
 .site-header .brand {
  padding-block: 12px
}
 .site-header .brand img {
  width: 155px
}
 .site-header .menu-toggle {
  font-size: 12px
}
 .menu-dialog {
  padding-inline: 24px;
  width: min(640px,100%);
  border-radius: 0
}
 .menu-dialog nav a {
  font-size: clamp(24px,2.4vw,34px);
  padding: 16px 0;
  gap: 16px;
  transition: color var(--motion-fast) var(--ease)
}
}
@media(max-width:700px) {
 .legal-toc {
  max-height: none;
  overflow: visible
}
}
@media(max-height:500px) and (min-width:701px) {
 .legal-toc {
  position: static;
  max-height: none;
  overflow: visible
}
}
@media print {
 .site-header {
  display: none;
  box-shadow: 0 1px 0 rgb(37 35 35 / .02)
}
 html {
  scroll-padding-top: 0
}
}
/* Shop addresses remain readable and usable without loading third-party widgets. */
.location-card {
  min-width: 0
}
.location-card .location-name {
  font-size: 17px;
  font-weight: 700;
  margin: 22px 0 12px
}
.location-card address {
  font: 400 17px/1.75 var(--body);
  overflow-wrap: anywhere
}
.location-card address>span {
  color: var(--muted)
}
.location-card .location-hours {
  font-size: 16px;
  margin: 16px 0 0
}
.location-phone {
  display: table;
  font-size: 19px;
  min-height: 44px;
  padding-block: 8px;
  margin-top: 10px;
  font-variant-numeric: tabular-nums
}
.location-phone:hover {
  color: var(--accent)
}
.location-actions {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 12px 28px;
  margin-top: 2px
}
.location-actions .text-link,.location-card .map-link {
  margin-top: 0;
  font-size: 15px;
  gap: 20px
}
.location-card .map-link {
  margin-top: 22px;
  max-width: 100%;
  font-size: 15px
}
.map-link>span {
  flex-shrink: 0
}
.max-contact {
  font-size: 14px;
  max-width: 100%
}
.max-contact summary {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 25px;
  min-height: 44px;
  padding: 10px 0;
  border-bottom: 1px solid var(--ink)
}
.max-contact summary::-webkit-details-marker {
  display: none
}
.max-contact summary:hover {
  color: var(--accent)
}
.max-contact[open] {
  flex: 1 1 100%
}
.max-contact[open] summary span {
  transform: rotate(45deg)
}
.max-contact>div {
  padding: 16px 20px;
  background: var(--paper);
  border: 1px solid var(--line);
  margin-top: 14px;
  max-width: 380px
}
.max-contact>div>p {
  font-size: 14px;
  line-height: 1.7;
  margin: 0
}
.max-contact strong {
  white-space: nowrap;
  font-weight: 500
}
.max-contact button.text-link {
  margin-top: 12px;
  padding-inline: 0;
  text-align: left
}
.copy-status {
  display: block;
  font-size: 12px;
  line-height: 1.5;
  margin-top: 8px;
  color: var(--muted)
}
.copy-status:empty {
  display: none
}
.event-logistics .map-link {
  font-size: 13px;
  gap: 16px;
  margin-top: 12px
}
@media(max-width:600px) {
 .location-actions {
  gap: 12px 24px
}
 .location-card .map-link {
  font-size: 15px;
  gap: 14px
}
}
/* Keep the close control reachable while scrolling a short-screen menu. */
/* The menu bar owns its top inset so scrolled links cannot show above it. */
/* Editorial development keeps the approved type, colour and subject photography. */
.art-pair + .art-pair {
  margin-top: 34px
}
.art-pair[hidden] + .art-pair {
  margin-top: 0
}
.menu-toggle[role="button"] {
  cursor: pointer
}
.menu-contact {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 30px
}
.events-section {
  border-top: 1px solid var(--line);
  padding-top: 38px
}
.events-section>.section-intro {
  margin: 22px 0 36px;
  font-size: 18px
}
.event-card {
  display: grid;
  grid-template-columns: minmax(170px,.6fr) minmax(0,1.4fr);
  gap: 50px;
  align-items: center;
  padding: 38px 0;
  border-bottom: 1px solid var(--line)
}
.event-card figure img {
  width: 100%;
  height: 310px;
  object-fit: contain;
  background: #0d1824;
  border-radius: var(--radius-media)
}
.event-card h3 {
  margin: 20px 0;
  font-size: clamp(26px,3.2vw,44px)
}
.event-card .text-link {
  margin-top: 20px;
  font-size: 15px
}
.event-intro .text-link {
  display: table;
  margin-top: 15px
}
.event-report {
  border-top: 1px solid var(--line)
}
.event-report>.section-intro {
  font-size: 18px;
  margin-top: 25px
}
.report-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  margin-top: 45px
}
.report-columns h3 {
  font-size: 30px;
  margin-bottom: 20px
}
.report-photos {
  display: grid;
  gap: 24px
}
.report-columns video {
  width: 100%;
  max-height: 580px;
  background: #0d1824
}
.event-summary {
  margin-top: 35px;
  max-width: 75ch
}
.event-summary h3 {
  margin-bottom: 22px
}
.event-report + .contact-banner {
  margin-top: 0
}
.exhibition-cover {
  max-width: none;
  margin-left: 0;
  padding: 0
}
.exhibition-cover img {
  height: auto;
  max-height: none;
  aspect-ratio: 4 / 3;
  object-fit: contain;
  background: var(--page-bg)
}
.exhibition-intro .material-date {
  margin-top: 24px;
  font-size: 14px
}
.exhibited-works {
  list-style: none;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 32px
}
.exhibited-works li {
  border-top: 1px solid var(--line);
  padding-top: 24px
}
.exhibited-works h3 {
  font-size: clamp(28px,3vw,40px);
  margin: 20px 0
}
.exhibited-works a {
  font-size: 15px
}
.exhibition-report .report-columns {
  display: block
}
.exhibition-report .report-columns>section+section {
  margin-top: 70px
}
.exhibition-report .report-photos {
  grid-template-columns: repeat(3,minmax(0,1fr));
  margin-top: 24px
}
.report-photos img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  border-radius: var(--radius-media)
}
.report-photos a {
  display: block;
  cursor: zoom-in
}
.report-photos figcaption {
  margin-top: 14px;
  font-size: 15px;
  line-height: 1.5
}
.report-videos {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 48px;
  margin-top: 26px
}
.report-video:first-child {
  grid-column: 1 / -1
}
.report-video video {
  display: block;
  height: auto;
  max-height: none;
  border-radius: var(--radius-media);
  background: #171717
}
.report-video.portrait video {
  width: min(100%,360px);
  aspect-ratio: 9 / 16
}
.report-video figcaption {
  margin-top: 20px;
  max-width: 65ch
}
.report-video h4 {
  font-family: var(--body);
  font-weight: 400;
  font-size: 20px;
  line-height: 1.4;
  margin: 0 0 8px
}
.report-video figcaption>p+p {
  margin-top: 10px
}
.exhibition-contact .caption {
  margin-top: 24px;
  font-size: 14px
}
.lecture-report .report-video:first-child {
  grid-column: auto
}
.lecture-report .report-video.portrait {
  width: min(100%,360px);
  justify-self: center
}
.report-audio {
  margin-top: 70px
}
.report-audio>h3 {
  font-size: 30px;
  margin-bottom: 20px
}
.audio-recordings {
  max-width: 840px;
  margin-top: 28px
}
.audio-recordings article {
  padding-block: 28px;
  border-top: 1px solid var(--line)
}
.audio-recordings h4 {
  font: 400 22px/1.4 var(--body);
  margin: 0 0 8px
}
.audio-recordings audio {
  display: block;
  width: 100%;
  margin-block: 20px;
  min-width: 0
}
.audio-recordings .text-link {
  margin-top: 16px;
  font-size: 15px
}
.lecture-themes .exhibited-works p {
  font-size: 17px
}
@media(max-width:900px) {
  .exhibition-report .report-photos {grid-template-columns: repeat(2,minmax(0,1fr))}
}
@media(max-width:600px) {
  .exhibited-works,.exhibition-report .report-photos,.report-videos {grid-template-columns: minmax(0,1fr)}
  .report-videos {gap:40px}
  .exhibition-cover img {height:auto;min-height:0;max-height:none}
}
.work-story {
  padding-bottom: 20px
}
.story-intro {
  max-width: 970px
}
.story-layout {
  display: grid;
  grid-template-columns: minmax(0,1.05fr) minmax(0,1fr);
  gap: 70px;
  padding-bottom: 90px;
  align-items: start
}
.story-image {
  position: sticky;
  top: calc(var(--header-height) + 25px)
}
.story-image img {
  width: 100%;
  height: min(70dvh,720px);
  object-fit: contain;
  background: #0d1824;
  border-radius: var(--radius-media)
}
.story-copy h2 {
  font-size: clamp(30px,3vw,42px);
  margin-bottom: 30px
}
.story-copy p {
  font-size: 18px;
  line-height: 1.8
}
.story-copy .source-note {
  font-size: 14px
}
.story-details {
  margin: 35px 0
}
.story-details>div {
  padding: 18px 0;
  border-top: 1px solid var(--line)
}
.story-details dt {
  font-size: 13px;
  color: var(--muted)
}
.story-details dd {
  margin: 6px 0 0;
  font-size: 17px
}
.related-stories {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 55px;
  margin-top: 35px
}
.related-stories article {
  border-top: 1px solid var(--line);
  padding-top: 25px
}
.related-stories p {
  margin: 20px 0;
  font-size: 17px
}
.lightbox {
  max-height: calc(100dvh - 24px);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 20px 28px;
  border-radius: var(--radius-dialog)
}
.lightbox-caption #lightbox-context {
  font-size: 14px;
  max-width: 70ch;
  margin: 15px auto;
  color: var(--muted)
}
.lightbox-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px 28px
}
.lightbox-actions .text-link {
  font-size: 15px;
  gap: 15px
}
.longevity-home {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  border-top: 1px solid var(--line)
}
.longevity-home .eyebrow {
  margin-bottom: 25px
}
.longevity-home>div:last-child {
  align-self: center
}
.longevity-home>div:last-child>p {
  font-size: 20px
}
.longevity-home .text-link {
  margin-top: 28px
}
.journal-topic {
  border-block: 1px solid var(--line);
  padding-block: 45px
}
.journal-topic p {
  font-size: 18px;
  margin: 25px 0
}
.longevity-intro {
  max-width: 1040px
}
.longevity-intro .caption {
  margin-top: 24px
}
.longevity-opening {
  display: grid;
  grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr);
  gap: 80px;
  align-items: center;
  padding-bottom: 95px
}
.longevity-opening figure {
  max-width: 440px
}
.longevity-opening img {
  width: 100%;
  height: 500px;
  object-fit: contain;
  background: #0d1824;
  border-radius: var(--radius-media)
}
.longevity-opening h2 {
  margin-bottom: 30px
}
.longevity-opening p {
  font-size: 19px
}
.longevity-opening .text-link {
  margin-top: 25px
}
.longevity-layout {
  display: grid;
  grid-template-columns: 230px minmax(0,780px);
  gap: 80px;
  padding-block: 50px 100px;
  border-top: 1px solid var(--line)
}
.reading-toc {
  position: sticky;
  top: calc(var(--header-height) + 25px);
  align-self: start;
  display: grid;
  gap: 4px
}
.reading-toc a {
  font-size: 14px;
  line-height: 1.5;
  padding-block: 10px
}
.reading-toc a:hover {
  color: var(--accent)
}
.editorial-copy section {
  padding-bottom: 55px;
  scroll-margin-top: 25px
}
.editorial-copy section+section {
  border-top: 1px solid var(--line);
  padding-top: 40px
}
.editorial-copy h2 {
  font-size: clamp(30px,3vw,42px);
  margin-bottom: 28px
}
.editorial-copy p {
  font-size: 18px;
  line-height: 1.85
}
.editorial-copy p a,.source-list a {
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 4px
}
.medical-questions {
  padding-left: 24px;
  font-size: 18px;
  line-height: 1.75
}
.medical-questions li {
  padding-left: 8px;
  margin-bottom: 18px
}
.editorial-copy .editorial-note {
  font-size: 15px;
  border-left: 2px solid var(--accent);
  padding-left: 22px;
  margin-top: 30px
}
.source-list {
  list-style: none;
  padding: 0;
  margin: 0
}
.source-list li {
  border-bottom: 1px solid var(--line);
  padding: 20px 0;
  font-size: 16px
}
.source-list span {
  display: block;
  font-size: 13px;
  color: var(--muted);
  margin-top: 7px
}
.editorial-copy .caption {
  font-size: 13px;
  margin-top: 25px
}
.analytics-dialog {
  width: min(620px,calc(100% - 32px));
  max-height: calc(100dvh - 32px);
  overflow: auto;
  padding: clamp(24px,4vw,40px);
  background: var(--overlay-bg);
  border-radius: var(--radius-dialog)
}
.analytics-dialog h2 {
  font-size: 32px;
  letter-spacing: -.02em;
  line-height: 1.15;
  margin-bottom: 24px
}
.analytics-dialog p {
  font-size: 17px;
  line-height: 1.7
}
.analytics-dialog a {
  color: var(--accent);
  text-decoration: underline
}
.analytics-actions {
  display: grid;
  gap: 15px;
  margin-top: 25px
}
.analytics-actions .button {
  justify-content: center;
  font-size: 15px
}
.secondary-button {
  background: transparent;
  color: var(--accent)
}
.secondary-button:hover {
  background: var(--pink);
  color: var(--accent)
}
.analytics-dialog>.text-link {
  font-size: 13px;
  margin: 10px 0
}
.analytics-dialog .caption {
  font-size: 13px;
  color: var(--muted)
}
.footer-settings {
  margin: 0 max(var(--gutter),calc((100% - 1376px)/2));
  font-size: 15px;
  padding: 12px 0;
  min-height: 44px
}
@media(max-width:1000px) {
 .story-layout,.longevity-opening {
  gap: 40px
}
 .longevity-layout {
  grid-template-columns: 180px minmax(0,1fr);
  gap: 40px
}
 .longevity-home {
  gap: 40px
}
 .event-card {
  gap: 35px
}
}
@media(max-width:700px) {
 .event-card {
  grid-template-columns: 110px minmax(0,1fr);
  gap: 22px;
  padding-block: 28px
}
 .event-card figure img {
  height: 190px;
  border-radius: var(--radius-media)
}
 .event-card h3 {
  font-size: 23px
}
 .event-card .eyebrow {
  font-size: 11px;
  letter-spacing: .05em
}
 .event-card p {
  font-size: 16px
}
 .event-card .text-link {
  font-size: 15px;
  gap: 12px
}
 .report-columns,.story-layout,.related-stories,.longevity-home,.longevity-opening,.longevity-layout {
  grid-template-columns: 1fr;
  gap: 35px
}
 .story-image {
  position: static
}
 .story-layout {
  padding-bottom: 55px
}
 .story-image img {
  height: 500px;
  border-radius: var(--radius-media)
}
 .story-copy p,.longevity-opening p,.longevity-home>div:last-child>p,.editorial-copy p {
  font-size: 17px
}
 .longevity-opening {
  padding-bottom: 55px
}
 .longevity-opening figure {
  max-width: 85%;
  margin-left: auto
}
 .longevity-opening img {
  height: 390px;
  border-radius: var(--radius-media)
}
 .longevity-layout {
  padding-block: 30px 60px
}
 .reading-toc {
  position: static;
  border-bottom: 1px solid var(--line);
  padding-bottom: 25px
}
 .editorial-copy h2 {
  font-size: 32px
}
 .medical-questions {
  font-size: 17px
}
 .analytics-dialog {
  padding: clamp(24px,4vw,40px);
  border-radius: var(--radius-dialog)
}
 .analytics-dialog h2 {
  font-size: 27px;
  line-height: 1.15
}
 .lightbox-art img {
  height: 48dvh
}
 .lightbox-actions {
  gap: 0 20px
}
 .lightbox-caption {
  padding-top: 15px
}
 .lightbox-caption #lightbox-context {
  font-size: 13px
}
}
@media(max-width:359px) {
 .wrap {
  width: calc(100% - var(--gutter) * 2)
}
 .story-image img {
  height: 390px;
  border-radius: var(--radius-media)
}
 .event-card {
  grid-template-columns: 1fr
}
 .event-card figure {
  max-width: 65%
}
 .event-card figure img {
  height: 240px;
  border-radius: var(--radius-media)
}
 .longevity-intro h1 {
  font-size: 34px
}
 .longevity-opening img {
  height: 330px;
  border-radius: var(--radius-media)
}
 .lightbox-art img {
  height: 42dvh
}
}
@media print {
 .reading-toc,.analytics-dialog,.footer-settings {
  display: none
}
 .story-image {
  position: static
}
 .longevity-layout {
  display: block
}
 .editorial-copy p {
  font-size: 11pt
}
 .editorial-copy h2 {
  font-size: 19pt;
  break-after: avoid
}
}
/* Source-led longform material; existing site rhythm and colours retained. */
.japan-article {
  padding-bottom: 80px
}
.japan-body {
  max-width: 740px;
  margin: 56px auto 0
}
.japan-body h2 {
  font-size: clamp(30px,3vw,44px);
  margin: 54px 0 24px;
  line-height: 1.18
}
.japan-body p {
  margin-top: 20px;
  line-height: 1.8
}
.japan-source {
  max-width: 900px;
  margin: 30px 0;
  padding: clamp(24px,3vw,36px);
  border: 1px solid var(--line);
  border-radius: var(--radius-media)
}
.japan-source .caption {
  font-size: 15px;
  margin-top: 18px;
  color: var(--muted)
}
.japan-source .text-link {
  margin-top: 20px;
  max-width: 100%
}
.japan-takeaways {
  max-width: 740px;
  margin: 52px auto
}
.japan-takeaways h2 {
  font-size: clamp(30px,3vw,44px)
}
.japan-takeaways ul,.japan-questions ol {
  padding-left: 24px
}
.japan-takeaways li,.japan-questions li {
  margin-top: 16px
}
.japan-body a:not(.text-link) {
  text-decoration: underline;
  text-underline-offset: 4px
}
.japan-related {
  margin-top: 60px;
  padding-top: 32px;
  border-top: 1px solid var(--line)
}
.japan-related .text-link {
  margin: 18px 22px 0 0
}
.japan-related p {
  margin-top: 20px
}
@media(max-width:600px) {
 .japan-source {
  padding: clamp(24px,3vw,36px);
  border-radius: var(--radius-media)
}
 .japan-source .text-link {
  gap: 12px
}
 .japan-source .text-link span {
  flex-shrink: 0
}
}
.breygel-article {
  padding-bottom: 100px
}
.breygel-film {
  margin-top: 32px
}
.breygel-film video {
  width: 100%;
  height: auto;
  display: block;
  background: #000;
  aspect-ratio: 16/9;
  border-radius: var(--radius-media)
}
.breygel-film figcaption {
  font-size: 14px;
  margin-top: 14px;
  color: var(--muted)
}
/* Shared interaction states: native controls, no scroll-gated content. */
.button:active {
  transform: translateY(1px)
}
.button:disabled,.button[aria-disabled="true"] {
  opacity: .5;
  cursor: not-allowed;
  transform: none
}
.button:disabled:hover {
  background: var(--accent);
  border-color: var(--accent)
}
.close-button:hover,.lightbox-art button:hover {
  background: var(--pink)
}
.work-open {
  display: block;
  border-radius: var(--radius-media)
}
.work-open:focus-visible .enlarge {
  background: var(--accent);
  border-color: var(--accent)
}
.filters button:hover,.art-tabs button:hover {
  color: var(--accent);
  background: var(--pink)
}
summary {
  border-radius: var(--radius-control)
}
input[type="range"] {
  cursor: ew-resize;
  border-radius: var(--radius-control)
}
.menu-toggle svg,.menu-dialog nav a>span:last-child {
  flex-shrink: 0
}
.location-actions .text-link {
  max-width: 100%
}
.japan-body,.editorial-copy,.legal-copy {
  min-width: 0
}
.legal-copy section,.editorial-copy section {
  scroll-margin-top: 24px
}
.footer-main>div>a,.footer-legal a {
  width: fit-content
}
@supports(backdrop-filter:blur(12px)) {
 .site-header {
  background: rgb(255 255 255 / .94);
  backdrop-filter: blur(12px)
}
}
@media(hover:hover) and (pointer:fine) {
 .work-open:hover img {
  transform: scale(1.025)
}
 .text-link:hover span {
  transform: translate(2px,-2px)
}
}
@media(prefers-reduced-motion:no-preference) {
 dialog[open] {
  animation: dialog-in 240ms var(--ease)
}
 dialog[open]::backdrop {
  animation: backdrop-in 180ms var(--ease)
}
 .menu-dialog[open] {
  animation: menu-in 240ms var(--ease)
}
}
@keyframes dialog-in {
 from {
  opacity: 0;
  transform: translateY(8px) scale(.99)
}
 to {
  opacity: 1;
  transform: none
}
}
@keyframes menu-in {
 from {
  opacity: 0;
  transform: translateX(20px)
}
 to {
  opacity: 1;
  transform: none
}
}
@keyframes backdrop-in {
 from {
  opacity: 0
}
 to {
  opacity: 1
}
}
@media(max-width:600px) {
 .hero .button {
  gap: 20px;
  padding-inline: 20px
}
 .hero-art figcaption {
  flex-wrap: wrap;
  gap: 6px 16px
}
 .hero-foot {
  gap: 16px
}
 .work-caption {
  overflow-wrap: anywhere
}
 .enlarge,.gallery-grid .enlarge {
  right: 8px;
  bottom: 8px
}
 .location-actions {
  gap: 16px 24px
}
 .footer-bottom {
  flex-wrap: wrap
}
 .footer-main>div>a {
  min-height: 44px
}
}
@media(forced-colors:active) {
 .button,.enlarge,.filters button[aria-pressed="true"] {
  border: 1px solid ButtonText
}
 :focus-visible {
  outline: 2px solid Highlight
}
 .site-header {
  background: Canvas;
  backdrop-filter: none
}
}

@font-face{font-family:"MOISEIKIN Futura";src:url("futura-book.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"MOISEIKIN Futura";src:url("futura-bold.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"MOISEIKIN Bodoni";src:url("bodoni-regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"MOISEIKIN Bodoni";src:url("bodoni-italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"MOISEIKIN Bodoni";src:url("bodoni-bold.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
:root{--display:"MOISEIKIN Bodoni",Georgia,"Times New Roman",serif;--serif:"MOISEIKIN Bodoni",Georgia,"Times New Roman",serif;--body:"MOISEIKIN Futura","Segoe UI",Arial,sans-serif;--sans:"MOISEIKIN Futura","Segoe UI",Arial,sans-serif;font-synthesis:none}
h1 em,h2 em,h3 em{font-style:italic}strong,b{font-weight:700}