@font-face {
  font-family: "Bodoni Moda";
  src: url("../fonts/bodoni-moda-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

:root {
  color-scheme: light dark;
  --ink: #111111;
  --truffle: #73706c;
  --paper: #faf9f6;
  --paper-2: #f2efe9;
  --surface: #faf9f6;
  --surface-raised: #fffdf9;
  --white: #faf9f6;
  --gold: #b89b5e;
  --gold-soft: #c2a66a;
  --red: #651c2c;
  --burgundy-dark: #4c1421;
  --line: rgba(17, 17, 17, .16);
  --hardware-0: #090a0b;
  --hardware-1: #111214;
  --hardware-2: #1b1c1f;
  --hardware-3: #292a2e;
  --hardware-ink: #d7d7d8;
  --hardware-muted: #8d8e91;
  --hardware-edge: rgba(255, 255, 255, .11);
  --hardware-gold: linear-gradient(112deg, #694311 0%, #b77a24 18%, #f1d58a 42%, #a86a1d 63%, #dcc17c 81%, #75501f 100%);
  --pad: clamp(1.5rem, 4vw, 3.5rem);
  --max: 1392px;
}

html[data-theme="light"] { color-scheme: light; }

@media (prefers-color-scheme: dark) {
  html:not([data-theme]) {
    color-scheme: dark;
    --ink: #f1efea;
    --truffle: #aaa6a0;
    --paper-2: #151619;
    --surface: #0b0c0d;
    --surface-raised: #151619;
    --line: rgba(250, 249, 246, .16);
  }
}

html[data-theme="dark"] {
  color-scheme: dark;
  --ink: #f1efea;
  --truffle: #aaa6a0;
  --paper-2: #151619;
  --surface: #0b0c0d;
  --surface-raised: #151619;
  --line: rgba(250, 249, 246, .16);
}

* { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  background: var(--surface);
  color: var(--ink);
  cursor: default;
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  transition: background-color 240ms ease, color 240ms ease;
}

a { color: inherit; text-decoration: none; }
a[href], button, summary, label[for], [role="button"] { cursor: pointer; }
input, textarea, [contenteditable="true"] { cursor: text; }
button, input { font: inherit; }
button { color: inherit; }
img { display: block; max-width: 100%; }

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

.landing-intro {
  position: fixed;
  inset: 0;
  z-index: 4000;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: var(--burgundy-dark);
  color: var(--paper);
  transform-origin: top center;
  animation:
    intro-layer-exit .76s cubic-bezier(.76, 0, .24, 1) 1.52s forwards,
    intro-dismiss 0s linear 2.3s forwards;
  will-change: transform;
  contain: strict;
  isolation: isolate;
}

.landing-intro::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 1px;
  background: var(--gold);
  opacity: .55;
}

.intro-composition {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: min(90vw, 1100px);
  animation: intro-composition-out .28s cubic-bezier(.4, 0, 1, 1) 1.28s forwards;
}

.intro-line {
  width: min(120px, 22vw);
  height: 1px;
  margin-bottom: 1.45rem;
  background: var(--gold);
  transform-origin: center;
  animation: intro-line-in .56s cubic-bezier(.22, 1, .36, 1) .08s both;
}

.intro-lockup {
  display: inline-flex;
  align-items: center;
  gap: clamp(1rem, 2.4vw, 2rem);
}

.brand-seal.intro-seal {
  width: clamp(58px, 7vw, 88px);
  height: clamp(58px, 7vw, 88px);
  flex-basis: clamp(58px, 7vw, 88px);
  color: var(--paper);
  animation: intro-name-in .72s cubic-bezier(.22, 1, .36, 1) .24s both;
}

.brand-seal.intro-seal::before { box-shadow: -14px 0 0 rgba(184,155,94,.55), 14px 0 0 rgba(184,155,94,.55); }
.brand-seal.intro-seal::after { inset: 10px; border-color: rgba(250,249,246,.28); }
.brand-seal.intro-seal span { color: var(--paper); font-size: clamp(.78rem, 1.35vw, 1.15rem); }

.intro-name {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .11em;
  margin: 0;
  color: var(--paper);
  font-family: Arial, Helvetica, sans-serif;
  font-size: clamp(1.75rem, 5.2vw, 5rem);
  font-weight: 510;
  letter-spacing: -.04em;
  line-height: .76;
  text-align: left;
  text-transform: uppercase;
  animation: intro-name-in .72s cubic-bezier(.22, 1, .36, 1) .32s both;
}

.intro-label {
  margin-top: 1.35rem;
  color: rgba(250, 249, 246, .68);
  font-size: .58rem;
  font-weight: 650;
  letter-spacing: .2em;
  text-transform: uppercase;
  animation: intro-label-in .48s cubic-bezier(.22, 1, .36, 1) .72s both;
}

html.intro-seen .landing-intro { display: none; }

html:not(.intro-seen) .home-page .hero-title:not(.hero-title-image) {
  animation:
    hero-after-intro .66s cubic-bezier(.22, 1, .36, 1) 1.72s both,
    hero-metal-shimmer 9s ease-in-out 2.25s infinite;
}

html:not(.intro-seen) .home-page .hero-title.hero-title-image {
  animation: hero-after-intro .66s cubic-bezier(.22, 1, .36, 1) 1.72s both;
}

html:not(.intro-seen) .home-page .hero-link {
  animation: hero-after-intro .58s cubic-bezier(.22, 1, .36, 1) 1.84s both;
}

html:not(.intro-seen) .home-page .hero-positioning {
  animation: hero-after-intro .58s cubic-bezier(.22, 1, .36, 1) 1.78s both;
}

@keyframes intro-line-in {
  from { opacity: 0; transform: scaleX(.04); }
  to { opacity: 1; transform: scaleX(1); }
}

@keyframes intro-name-in {
  from { opacity: 0; clip-path: inset(0 0 100% 0); transform: translateY(10px) scale(.995); }
  to { opacity: 1; clip-path: inset(0 0 0 0); transform: translateY(0) scale(1); }
}

@keyframes intro-label-in {
  from { opacity: 0; transform: translateY(5px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes intro-composition-out { to { opacity: 0; transform: translateY(-5px); } }
@keyframes intro-layer-exit { to { transform: translateY(-101%); } }
@keyframes hero-after-intro {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes intro-dismiss { to { visibility: hidden; pointer-events: none; } }

.skip-link {
  position: fixed;
  top: .75rem;
  left: .75rem;
  z-index: 3000;
  padding: .7rem 1rem;
  background: var(--paper);
  color: var(--ink);
  transform: translateY(-160%);
}

.skip-link:focus { transform: translateY(0); }

:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
}

.container {
  width: min(100%, var(--max));
  margin-inline: auto;
  padding-inline: var(--pad);
}

.site-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 1000;
  color: var(--ink);
  transition: color 240ms ease, background 240ms ease;
}

.site-header::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(to bottom, rgba(250, 249, 246, .98), rgba(250, 249, 246, .72) 65%, transparent);
  pointer-events: none;
}

.home-page {
  position: relative;
  height: 100svh;
  min-height: 100svh;
  overflow: hidden;
  background: #0d090b;
}

.home-page .site-header {
  border: 0;
  background: transparent;
  color: var(--paper);
  box-shadow: none;
}

.home-page .site-header::after {
  display: none;
}

.topbar {
  height: 64px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding-inline: clamp(1rem, 2.2vw, 2rem);
}

.topbar-actions {
  grid-column: 3;
  justify-self: end;
  display: flex;
  align-items: center;
  gap: .75rem;
}

.icon-button {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  transition: opacity 160ms ease;
}

.icon-button:hover { opacity: .62; }
.search-button { justify-self: end; }
.topbar-actions .search-button { justify-self: auto; }

.lucide {
  width: 1em;
  height: 1em;
  flex: 0 0 auto;
  stroke-width: 1.65;
}

.icon-button > .lucide {
  width: 20px;
  height: 20px;
}

.theme-button .lucide {
  transform-origin: 50% 50%;
  transition: transform 240ms cubic-bezier(.22, 1, .36, 1);
}

.theme-button:hover .lucide { transform: rotate(14deg) scale(1.04); }

.wordmark {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  gap: .55rem;
}

.hero-name-wordmark {
  display: block;
  width: min(100%, clamp(300px, 47vw, 620px));
  height: auto;
  aspect-ratio: 3 / 1;
  background-color: transparent;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

html[data-theme="dark"] .hero-name-wordmark {
  background-image: url("../img/mohammed_perves_logo_white.png");
  /* Match the silver artwork's opaque bounds to the gold artwork exactly. */
  background-position: 46.5% 65.6%;
  background-size: 101.35% 107.34%;
}

html[data-theme="light"] .hero-name-wordmark {
  background-image: url("../img/mohammed_perves_logo_color.png");
  background-position: center;
  background-size: 100% 100%;
}

.wordmark span { color: inherit; }

.wordmark .brand-name {
  align-items: center;
  text-align: center;
}

.menu-overlay,
.search-overlay {
  position: fixed;
  inset: 0;
  z-index: 1100;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s linear 280ms, opacity 280ms ease;
}

.menu-overlay.is-open,
.search-overlay.is-open {
  visibility: visible;
  opacity: 1;
  transition-delay: 0s;
}

.overlay-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(17, 17, 17, .48);
  cursor: default;
}

.menu-overlay .overlay-backdrop {
  display: none;
}

.menu-overlay {
  pointer-events: none;
  transition: visibility 0s linear 540ms, opacity 180ms ease 330ms;
}

.menu-overlay.is-open {
  pointer-events: none;
  transition: opacity 120ms ease;
}

.search-overlay .overlay-backdrop {
  display: none;
}

.search-overlay { pointer-events: none; }

.menu-drawer {
  position: absolute;
  inset: 0 auto 0 0;
  width: min(292px, calc(100% - 1rem));
  overflow: visible;
  border: 0;
  border-right: 1px solid rgba(250, 249, 246, .17);
  border-radius: 0;
  background: linear-gradient(155deg, rgba(97, 35, 47, .58), rgba(24, 16, 19, .75) 46%, rgba(8, 7, 8, .88));
  color: rgba(250, 249, 246, .76);
  box-shadow: 18px 0 64px rgba(8, 3, 4, .24), inset -1px 0 0 rgba(255,255,255,.035);
  -webkit-backdrop-filter: blur(30px) saturate(130%);
  backdrop-filter: blur(30px) saturate(130%);
  transform: translateX(calc(-100% - 2rem));
  transition: transform 420ms cubic-bezier(.76, 0, .24, 1);
  will-change: transform;
  pointer-events: auto;
}

/* Projects — editorial portfolio */
.projects-page {
  --projects-warm: #f7f5f0;
  --projects-copy: #171515;
  background: var(--projects-warm);
}

html[data-theme="dark"] .projects-page {
  --projects-warm: #0b0c0d;
  --projects-copy: #f1efea;
}

html[data-theme="light"] .projects-page[data-header-tone="dark"] .topbar > .icon-button,
html[data-theme="light"] .projects-page[data-header-tone="dark"] .topbar-actions .icon-button { color: #f3efe8; }

html[data-theme="light"] .projects-page[data-header-tone="dark"] .topbar > .icon-button:hover,
html[data-theme="light"] .projects-page[data-header-tone="dark"] .topbar-actions .icon-button:hover { color: #d2b674; }

html[data-theme="light"] .projects-page[data-header-tone="light"] .topbar > .icon-button,
html[data-theme="light"] .projects-page[data-header-tone="light"] .topbar-actions .icon-button { color: #201e1c; }

.projects-main { position: relative; padding-top: 0; }

.projects-hero {
  position: relative;
  isolation: isolate;
  min-height: min(880px, 100svh);
  overflow: hidden;
  background:
    radial-gradient(ellipse at 77% 19%, rgba(194,166,106,.17), transparent 29%),
    radial-gradient(ellipse at 84% 83%, rgba(101,28,44,.5), transparent 32%),
    linear-gradient(112deg, #070607 0%, #16090d 28%, #3c111e 63%, #10070a 100%);
  color: #faf9f6;
}

.projects-hero::before,
.projects-hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
}

.projects-hero::before {
  top: -22%;
  right: -10%;
  width: min(72vw, 1050px);
  aspect-ratio: 1;
  border: 1px solid rgba(226,199,137,.16);
  border-radius: 50%;
  box-shadow: 0 0 0 8rem rgba(226,199,137,.023), 0 0 0 16rem rgba(250,249,246,.014);
}

.projects-hero::after {
  inset: 0;
  opacity: .22;
  background-image:
    linear-gradient(rgba(250,249,246,.15) 1px, transparent 1px),
    linear-gradient(90deg, rgba(250,249,246,.15) 1px, transparent 1px);
  background-size: 72px 72px;
  -webkit-mask-image: linear-gradient(110deg, transparent 28%, #000 84%);
  mask-image: linear-gradient(110deg, transparent 28%, #000 84%);
}

.projects-hero-grid {
  position: relative;
  min-height: min(880px, 100svh);
  display: grid;
  grid-template-columns: minmax(0,1.35fr) minmax(280px,.65fr);
  gap: clamp(3rem,7vw,7.5rem);
  align-items: end;
  padding-top: clamp(8rem,16vh,11rem);
  padding-bottom: clamp(4.5rem,9vh,6.5rem);
}

.projects-hero-copy .page-kicker { margin-bottom: 1.8rem; color: #d2b674; letter-spacing: .2em; }

.projects-hero-copy h1 {
  max-width: 10.5ch;
  margin: 0;
  font-family: "Bodoni Moda", Didot, "Iowan Old Style", Georgia, serif;
  font-size: clamp(4.3rem,8.4vw,8.8rem);
  font-weight: 400;
  letter-spacing: -.065em;
  line-height: .84;
  text-wrap: balance;
}

.projects-hero-copy h1 em { color: #d2b674; font-style: italic; }

.projects-hero-note { align-self: end; padding-bottom: .8rem; }
.projects-hero-note > p { max-width: 40ch; margin: 0 0 2rem; color: rgba(250,249,246,.7); font-size: clamp(.95rem,1.2vw,1.07rem); line-height: 1.72; }

.projects-signal {
  position: absolute;
  top: 18%;
  right: var(--pad);
  display: flex;
  align-items: end;
  gap: 5px;
  height: 34px;
  color: #d2b674;
}

.projects-signal span { width: 2px; height: 20%; background: currentColor; opacity: .75; animation: project-signal 1.4s ease-in-out infinite alternate; }
.projects-signal span:nth-child(2) { height: 54%; animation-delay: -.9s; }
.projects-signal span:nth-child(3) { height: 100%; animation-delay: -.45s; }
.projects-signal span:nth-child(4) { height: 68%; animation-delay: -.75s; }
.projects-signal span:nth-child(5) { height: 35%; animation-delay: -.2s; }
@keyframes project-signal { to { transform: scaleY(.4); opacity: .35; } }

.projects-index {
  position: relative;
  isolation: isolate;
  padding-block: clamp(6rem,9vw,9rem);
  background: var(--projects-warm);
  color: var(--projects-copy);
}

.projects-index::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(to bottom, rgba(255,255,255,.56), transparent 34rem);
}

html[data-theme="dark"] .projects-index::before { background: linear-gradient(to bottom, rgba(101,28,44,.11), transparent 34rem); }

.projects-index-head {
  display: grid;
  grid-template-columns: 120px minmax(0,1.25fr) minmax(260px,.55fr);
  gap: clamp(2rem,4vw,4.25rem);
  align-items: end;
  padding-bottom: clamp(2.5rem,5vw,4rem);
  border-bottom: 1px solid var(--line);
}

.projects-index-head .page-kicker { align-self: start; padding-top: .35rem; color: var(--gold); letter-spacing: .18em; }
.projects-index-head h2 { margin: 0; font-family: "Bodoni Moda", Didot, Georgia, serif; font-size: clamp(3.8rem,6.5vw,7rem); font-weight: 400; letter-spacing: -.06em; line-height: .84; }
.projects-index-head > p:last-child { max-width: 39ch; margin: 0; color: var(--truffle); font-size: .9rem; line-height: 1.68; }

.project-feature {
  display: grid;
  grid-template-columns: minmax(0,1.3fr) minmax(300px,.7fr);
  gap: clamp(2.5rem,4.5vw,4.5rem);
  padding-block: clamp(3rem,5vw,5rem);
  border-bottom: 1px solid var(--line);
}

.project-feature-media { position: relative; align-self: start; overflow: hidden; background: #101114; box-shadow: 0 26px 64px rgba(15,10,11,.18); }
.project-feature-media::after { content: ""; position: absolute; inset: 0; border: 1px solid rgba(255,255,255,.14); pointer-events: none; }
.project-feature-media img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; object-position: top center; filter: saturate(.72) contrast(1.04); transition: transform .7s cubic-bezier(.22,1,.36,1), filter .35s ease; }
.project-feature:hover .project-feature-media img { transform: scale(1.025); filter: saturate(.92) contrast(1.03); }
.project-screen-label { position: absolute; right: 1rem; bottom: 1rem; padding: .4rem .65rem; border: 1px solid rgba(250,249,246,.24); background: rgba(9,10,11,.78); color: rgba(250,249,246,.8); font-size: .54rem; font-weight: 650; letter-spacing: .12em; text-transform: uppercase; backdrop-filter: blur(8px); }

.project-feature-copy { align-self: center; }
.project-number { color: var(--gold); font-family: "Bodoni Moda", Didot, Georgia, serif; font-size: 1.05rem; }
.project-type { margin: 2rem 0 .8rem; color: var(--truffle); font-size: .61rem; font-weight: 680; letter-spacing: .14em; text-transform: uppercase; }
.project-feature-copy h3,
.project-card h3 { margin: 0; font-family: "Bodoni Moda", Didot, Georgia, serif; font-weight: 400; letter-spacing: -.045em; line-height: .96; text-wrap: balance; }
.project-feature-copy h3 { font-size: clamp(3.2rem,5.2vw,5.4rem); }
.project-feature-copy > p:not(.project-type) { max-width: 44ch; margin: 1.5rem 0 1.8rem; color: var(--truffle); font-size: .91rem; line-height: 1.75; }

.project-stack { display: flex; flex-wrap: wrap; gap: .45rem; margin: 0 0 2rem; padding: 0; list-style: none; }
.project-stack li { padding: .38rem .62rem; border: 1px solid var(--line); border-radius: 999px; color: var(--truffle); font-size: .57rem; font-weight: 620; letter-spacing: .07em; text-transform: uppercase; }

.project-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); border-left: 1px solid var(--line); }
.project-card { position: relative; min-height: 600px; overflow: hidden; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: transparent; }
.project-card-link { display: flex; flex-direction: column; height: 100%; }
.project-card-media { position: relative; height: clamp(250px,22vw,320px); overflow: hidden; background: #151619; }
.project-card-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(8,8,9,.18), transparent 42%); pointer-events: none; }
.project-card-media img { width: 100%; height: 100%; object-fit: cover; object-position: top center; filter: saturate(.72); transition: transform .65s cubic-bezier(.22,1,.36,1), filter .3s ease; }
.project-card-media--contain { padding: 1.75rem; background: #e9e8e4; }
.project-card-media--contain img { object-fit: contain; object-position: center; }
.project-card:hover .project-card-media img { transform: scale(1.035); filter: saturate(.95); }
.project-card-body { position: relative; z-index: 1; flex: 1; padding: clamp(2rem,3vw,3.25rem); }
.project-card h3 { max-width: 14ch; font-size: clamp(2.3rem,3.2vw,3.7rem); transition: color 180ms ease, transform 220ms cubic-bezier(.22,1,.36,1); }
.project-card-body > p:not(.project-type) { max-width: 52ch; margin: 1.25rem 0 0; color: var(--truffle); font-size: .91rem; line-height: 1.7; }
.project-card .project-type { margin: 1.8rem 0 .7rem; }
.project-card-cta { display: inline-flex; gap: .55rem; align-items: center; margin-top: 1.8rem; color: var(--projects-copy); font-size: .62rem; font-weight: 680; letter-spacing: .1em; text-transform: uppercase; }
.project-card-cta .lucide { width: 15px; height: 15px; transition: transform 180ms ease; }
.project-card:hover .project-card-cta .lucide { transform: translate(3px,-3px); }
.project-card:hover h3 { color: #651c2c; transform: translateX(.2rem); }
html[data-theme="dark"] .project-card:hover h3 { color: #d2b674; }

.project-card--research { background: rgba(101,28,44,.035); }
.project-card-graphic { position: relative; height: clamp(250px,22vw,320px); overflow: hidden; background: linear-gradient(135deg,#ece9e1,#d9d1c5); }
html[data-theme="dark"] .project-card-graphic { background: linear-gradient(135deg,#151619,#261920); }
.project-card-graphic::before,
.project-card-graphic::after { content: ""; position: absolute; border: 1px solid rgba(101,28,44,.24); border-radius: 50%; }
.project-card-graphic::before { width: 330px; height: 330px; top: -120px; right: -40px; box-shadow: 0 0 0 54px rgba(101,28,44,.035),0 0 0 108px rgba(101,28,44,.02); }
.project-card-graphic::after { width: 180px; height: 180px; left: 13%; bottom: -55px; }
.project-card-graphic i { position: absolute; width: 6px; height: 6px; border-radius: 50%; background: #651c2c; box-shadow: 0 0 0 5px rgba(101,28,44,.09); }
.project-card-graphic i:nth-of-type(1) { left: 22%; top: 29%; }.project-card-graphic i:nth-of-type(2) { left: 29%; top: 43%; }.project-card-graphic i:nth-of-type(3) { left: 20%; top: 61%; }.project-card-graphic i:nth-of-type(4) { left: 61%; top: 28%; }.project-card-graphic i:nth-of-type(5) { left: 69%; top: 44%; }.project-card-graphic i:nth-of-type(6) { left: 58%; top: 60%; }.project-card-graphic i:nth-of-type(7) { left: 74%; top: 67%; }
.cluster { position: absolute; border: 1px solid rgba(184,155,94,.7); border-radius: 50%; }.cluster-a { left: 13%; top: 18%; width: 26%; aspect-ratio: 1; }.cluster-b { left: 52%; top: 16%; width: 30%; aspect-ratio: 1; }.cluster-c { left: 47%; top: 52%; width: 23%; aspect-ratio: 1; }

.project-card--dark { grid-column: 1 / -1; isolation: isolate; min-height: 480px; background: linear-gradient(135deg,#0d0d0f,#231017 75%,#111214); color: #faf9f6; }
.project-card--dark .project-card-body { max-width: 55%; padding-right: clamp(3rem,6vw,7rem); }
.project-card--dark .project-number,.project-card--dark .project-type { color: #d2b674; }
.project-card--dark .project-card-body > p:not(.project-type) { color: rgba(250,249,246,.64); }
.project-card--dark .project-stack li { border-color: rgba(250,249,246,.18); color: rgba(250,249,246,.66); }
.project-card--dark:hover h3 { color: #d2b674; }
.project-trace { position: absolute; top: 0; right: 0; bottom: 0; left: 55%; height: auto; opacity: .56; }
.project-trace::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(210,182,116,.1) 1px,transparent 1px),linear-gradient(90deg,rgba(210,182,116,.1) 1px,transparent 1px); background-size: 38px 38px; }
.project-trace i { position: absolute; bottom: 24%; width: 1px; background: linear-gradient(to top,#d2b674,transparent); transform-origin: bottom; }
.project-trace i:nth-child(1) { left: 12%; height: 28%; }.project-trace i:nth-child(2) { left: 31%; height: 50%; }.project-trace i:nth-child(3) { left: 49%; height: 38%; }.project-trace i:nth-child(4) { left: 68%; height: 70%; }.project-trace i:nth-child(5) { left: 85%; height: 92%; }

.projects-current { position: relative; isolation: isolate; overflow: hidden; padding-block: clamp(7rem,10vw,10rem); background: linear-gradient(116deg,#090708,#250c13 58%,#0b0809); color: #faf9f6; }
.projects-current::after { content: ""; position: absolute; z-index: -1; top: -45%; right: -12%; width: min(64vw,900px); aspect-ratio: 1; border: 1px solid rgba(210,182,116,.18); border-radius: 50%; box-shadow: 0 0 0 7rem rgba(210,182,116,.02),0 0 0 14rem rgba(250,249,246,.012); }
.projects-current-grid { display: grid; grid-template-columns: minmax(140px,.38fr) minmax(0,1.62fr); gap: clamp(3rem,7vw,8rem); }
.projects-current-grid > .page-kicker { padding-top: .7rem; color: #d2b674; letter-spacing: .18em; }
.projects-current h2 { max-width: 13ch; margin: 0; font-family: "Bodoni Moda",Didot,Georgia,serif; font-size: clamp(3.3rem,6.2vw,6.25rem); font-weight: 400; letter-spacing: -.055em; line-height: .92; text-wrap: balance; }
.projects-current h2 + p { max-width: 57ch; margin: 2rem 0 2.3rem; color: rgba(250,249,246,.66); font-size: .98rem; line-height: 1.76; }

@media (max-width: 1000px) {
  .projects-index-head { grid-template-columns: 100px 1fr; }
  .projects-index-head > p:last-child { grid-column: 2; }
  .project-feature { grid-template-columns: 1fr; }
  .project-feature-copy { max-width: 700px; }
  .project-card { min-height: 560px; }
  .project-card-body { padding: clamp(1.75rem,3.5vw,2.5rem); }
  .project-card h3 { font-size: clamp(2.25rem,5vw,3rem); }
  .project-card--dark { min-height: 460px; }
  .project-card--dark .project-card-body { max-width: 62%; }
  .project-trace { left: 62%; }
}

@media (max-width: 760px) {
  .projects-hero { min-height: 100svh; }

  .projects-hero::before {
    top: -5%;
    right: -62%;
    width: 145vw;
  }

  .projects-hero::after { background-size: 52px 52px; }

  .projects-hero-grid {
    min-height: 100svh;
    grid-template-columns: minmax(0, 1fr);
    gap: clamp(1.75rem, 5svh, 2.5rem);
    align-content: end;
    padding-top: calc(5.5rem + env(safe-area-inset-top));
    padding-bottom: calc(clamp(3rem, 8svh, 4.5rem) + env(safe-area-inset-bottom));
  }

  .projects-hero-copy .page-kicker {
    margin-bottom: 1.15rem;
    font-size: .62rem;
  }

  .projects-hero-copy h1 {
    max-width: 100%;
    font-size: clamp(3rem, 15vw, 5.2rem);
    letter-spacing: -.055em;
    line-height: .84;
  }

  .projects-hero-note { padding-bottom: 0; }

  .projects-hero-note > p {
    max-width: 34ch;
    margin-bottom: 1.4rem;
    font-size: .94rem;
    line-height: 1.65;
  }

  .projects-signal {
    top: calc(4.75rem + env(safe-area-inset-top));
    height: 28px;
  }

  .projects-index {
    padding-block: 4.75rem 5.75rem;
    scroll-margin-top: 58px;
  }

  .projects-index-head {
    grid-template-columns: minmax(0, 1fr);
    gap: .9rem;
    padding-bottom: 2.25rem;
  }

  .projects-index-head .page-kicker { padding-top: 0; }

  .projects-index-head h2 {
    font-size: clamp(3.1rem, 15vw, 4.75rem);
    line-height: .88;
  }

  .projects-index-head > p:last-child {
    grid-column: 1;
    max-width: 42ch;
    margin-top: .65rem;
    font-size: .93rem;
  }

  .project-feature {
    gap: 2rem;
    padding-block: 2.25rem 3.75rem;
  }

  .project-feature-media { box-shadow: 0 16px 38px rgba(15,10,11,.16); }

  .project-screen-label {
    right: .75rem;
    bottom: .75rem;
    max-width: calc(100% - 1.5rem);
  }

  .project-feature-copy h3 {
    font-size: clamp(2.8rem, 13.5vw, 4.25rem);
    line-height: .94;
  }

  .project-type { margin-top: 1.5rem; }

  .project-feature-copy > p:not(.project-type) {
    margin-block: 1.2rem 1.5rem;
    font-size: .93rem;
    line-height: 1.68;
  }

  .project-stack { margin-bottom: 1.75rem; }

  .project-grid { grid-template-columns: minmax(0, 1fr); }

  .project-card { min-height: 0; }

  .project-card-media,
  .project-card-graphic { height: clamp(210px, 60vw, 300px); }

  .project-card-media--contain { padding: 1.25rem; }

  .project-card-body {
    min-height: 0;
    padding: 2rem clamp(1.35rem, 6vw, 2rem) 2.75rem;
  }

  .project-card h3 {
    max-width: 15ch;
    overflow-wrap: break-word;
    font-size: clamp(2.25rem, 11.5vw, 3.35rem);
    line-height: .98;
  }

  .project-card-body > p:not(.project-type) {
    font-size: .92rem;
    line-height: 1.68;
  }

  .project-card-cta { margin-top: 1.5rem; }

  .project-card:hover h3 { transform: none; }

  .project-card--dark .project-card-body {
    max-width: none;
    min-height: 450px;
    padding-bottom: 9.5rem;
  }

  .project-card--dark .project-trace {
    top: auto;
    left: 0;
    height: 31%;
  }

  .projects-current {
    padding-block: 5.5rem calc(5.5rem + env(safe-area-inset-bottom));
  }

  .projects-current::after {
    top: -12%;
    right: -58%;
    width: 130vw;
  }

  .projects-current-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
  }

  .projects-current-grid > .page-kicker { padding-top: 0; }

  .projects-current h2 {
    max-width: 14ch;
    font-size: clamp(2.75rem, 12.5vw, 4.3rem);
    line-height: .94;
  }

  .projects-current h2 + p {
    margin-block: 1.5rem 2rem;
    font-size: .95rem;
    line-height: 1.7;
  }
}

@media (max-width: 380px) {
  .projects-hero-copy h1 { font-size: clamp(2.85rem, 14.5vw, 3.45rem); }
  .projects-index-head h2 { font-size: clamp(2.85rem, 14vw, 3.35rem); }
  .project-card h3 { font-size: clamp(2.05rem, 10.8vw, 2.6rem); }
  .projects-current h2 { font-size: clamp(2.45rem, 12vw, 3rem); }
}

@media (prefers-reduced-motion: reduce) {
  .projects-signal span { animation: none; }
}

.menu-overlay.is-open .menu-drawer {
  transform: translateX(0);
}

.menu-drawer nav {
  position: relative;
  height: 100%;
  overflow: hidden;
}

.drawer-close {
  position: absolute;
  top: 1.35rem;
  right: -18px;
  z-index: 5;
  width: 36px;
  height: 36px;
  border: 1px solid rgba(250,249,246,.22);
  border-radius: 50%;
  background: rgba(16, 14, 15, .78);
  color: var(--paper);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}

.drawer-close > .lucide,
.search-close > .lucide { width: 18px; height: 18px; }

.menu-panel {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  padding: 1.35rem 1.15rem 1.15rem;
  background: transparent;
  overflow-y: auto;
  transform: translateX(100%);
  opacity: 0;
  transition: transform 360ms cubic-bezier(.77, 0, .18, 1), opacity 240ms ease;
}

.menu-panel.root-panel { transform: translateX(0); opacity: 1; }
.menu-panel.is-active { transform: translateX(0); opacity: 1; }
.menu-panel.root-panel.is-behind { transform: translateX(-22%); opacity: 0; }

.menu-identity {
  display: flex;
  align-items: center;
  gap: .85rem;
  min-height: 72px;
  padding: 0 2.5rem 1rem 0;
  border-bottom: 1px solid rgba(250, 249, 246, .11);
}

.menu-person { min-width: 0; display: flex; flex-direction: column; }
.menu-person strong { color: var(--paper); }
.menu-person small { overflow: hidden; color: rgba(250,249,246,.48); font-size: .63rem; text-overflow: ellipsis; white-space: nowrap; }

.brand-seal.menu-brand-seal {
  width: 54px;
  height: 54px;
  flex-basis: 54px;
  color: var(--ink);
}

.brand-seal.menu-brand-seal::before { box-shadow: -8px 0 0 rgba(184,155,94,.55), 8px 0 0 rgba(184,155,94,.55); }
.brand-seal.menu-brand-seal::after { inset: 6px; }
.brand-seal.menu-brand-seal span { font-size: .69rem; }

.menu-person .brand-name {
  align-items: flex-start;
}

.menu-list {
  display: flex;
  flex-direction: column;
  gap: .75rem;
  margin: 1rem 0 0;
  padding: 0;
  list-style: none;
}

.menu-list li { position: relative; }

.menu-link,
.submenu-trigger {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 1rem;
  padding: .82rem .85rem;
  border: 0;
  border-radius: 14px;
  background: transparent;
  color: rgba(250,249,246,.68);
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  font-size: .94rem;
  font-weight: 430;
  line-height: 1.25;
  text-align: left;
  cursor: pointer;
  transition: color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.menu-link > .lucide,
.submenu-trigger > .lucide { width: 18px; height: 18px; opacity: .76; }

.menu-link:hover,
.submenu-trigger:hover,
.menu-link[aria-current="page"] {
  background: rgba(250,249,246,.1);
  color: var(--paper);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}

.chevron { font-family: Arial, sans-serif; font-size: 1rem; }

.panel-top {
  min-height: 2.25rem;
  display: flex;
  align-items: center;
  gap: 1rem;
  margin: 0 0 1rem;
  padding-bottom: 1.1rem;
  border-bottom: 1px solid rgba(250,249,246,.12);
}

.back-button {
  border: 0;
  padding: .25rem .4rem .25rem 0;
  background: transparent;
  color: var(--paper);
  cursor: pointer;
}

.panel-title {
  color: var(--paper);
  font-size: .9rem;
  font-weight: 520;
}

.sub-links {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.sub-links a {
  padding: .85rem 1rem;
  border-radius: 13px;
  color: rgba(250,249,246,.68);
  font-size: .9rem;
  font-weight: 350;
}

.sub-links a:hover { background: rgba(250,249,246,.1); color: var(--paper); }

.menu-socials {
  grid-column: 2 / -1;
  width: 100%;
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  justify-items: center;
  gap: 0;
}

.menu-footer {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  align-items: center;
  justify-items: center;
  gap: 0;
  margin-top: auto;
  padding: 1rem .2rem 0;
  border-top: 1px solid rgba(250,249,246,.1);
}

.menu-theme-button,
.footer-theme-button {
  flex: 0 0 auto;
  color: currentColor;
}

.menu-theme-button {
  width: 38px;
  height: 38px;
}

.menu-theme-button .lucide,
.footer-theme-button .lucide {
  filter: drop-shadow(0 1px 0 rgba(255,255,255,.2)) drop-shadow(0 2px 4px rgba(0,0,0,.48));
}

.menu-theme-button:hover,
.footer-theme-button:hover {
  color: var(--gold-soft);
  opacity: 1;
}

.menu-socials .social-circle { border-color: rgba(250,249,246,.2); color: rgba(250,249,246,.72); }
.menu-socials .social-circle:hover { background: rgba(250,249,246,.12); color: var(--paper); }

.social-circle {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 50%;
  font-size: .67rem;
  font-weight: 700;
  letter-spacing: .02em;
  transition: background 160ms ease, color 160ms ease;
}

.social-circle:hover { background: var(--ink); color: var(--paper); }

.search-box {
  position: absolute;
  top: calc(11px + env(safe-area-inset-top));
  right: clamp(1rem, 2.2vw, 2rem);
  width: min(360px, calc(100% - 2rem));
  color: var(--paper);
  pointer-events: auto;
}

.search-input-wrap {
  position: relative;
  height: 42px;
  overflow: hidden;
  border: 1px solid rgba(250, 249, 246, .2);
  border-radius: 999px;
  background: rgba(91, 55, 55, .46);
  box-shadow:
    0 18px 50px rgba(12, 3, 5, .22),
    inset 0 1px 0 rgba(255, 255, 255, .09),
    inset 0 0 0 1px rgba(255, 255, 255, .025);
  -webkit-backdrop-filter: blur(28px) saturate(128%);
  backdrop-filter: blur(28px) saturate(128%);
  clip-path: inset(0 21px 0 calc(100% - 21px) round 999px);
  transition: clip-path 520ms cubic-bezier(.76, 0, .24, 1), box-shadow 240ms ease;
  will-change: clip-path;
}

.search-overlay.is-open .search-input-wrap {
  clip-path: inset(0 0 0 0 round 999px);
}

.search-input-wrap::before {
  content: none;
}

.search-input-wrap::after {
  content: none;
}

.search-box input {
  width: 100%;
  height: 40px;
  padding: .25rem 3.25rem .25rem 1rem;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--paper);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(.84rem, 1.05vw, .94rem);
  letter-spacing: -.02em;
  outline: none;
  opacity: 0;
  transition: opacity 180ms ease 0ms;
}

.search-overlay.is-open .search-box input { opacity: 1; transition-delay: 230ms; }

.search-box input::placeholder { color: rgba(250, 249, 246, .76); }
.search-box input::-webkit-search-cancel-button { display: none; }
.search-input-wrap:focus-within { box-shadow: 0 20px 60px rgba(12, 3, 5, .28), inset 0 0 0 1px rgba(250, 249, 246, .1); }

.search-close {
  position: absolute;
  top: 3px;
  right: 4px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  opacity: 0;
  transition: background 160ms ease, opacity 180ms ease 0ms;
}

.search-overlay.is-open .search-close { opacity: 1; transition-delay: 230ms; }
.search-close:hover { background: rgba(250, 249, 246, .08); }

.search-results {
  display: none;
  max-height: min(56vh, 420px);
  margin-top: .65rem;
  padding: .45rem;
  overflow-y: auto;
  border: 1px solid rgba(250, 249, 246, .14);
  border-radius: 18px;
  background: rgba(60, 30, 34, .58);
  box-shadow: 0 18px 50px rgba(12, 3, 5, .18), inset 0 1px 0 rgba(255,255,255,.06);
  -webkit-backdrop-filter: blur(28px) saturate(125%);
  backdrop-filter: blur(28px) saturate(125%);
  animation: search-results-in 220ms cubic-bezier(.22, 1, .36, 1) both;
}

.search-results.has-results { display: block; }
.search-results a {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: .72rem .65rem;
  border-radius: 11px;
  font-size: .82rem;
  line-height: 1.35;
  transition: background 140ms ease, color 140ms ease;
}
.search-results a:hover,
.search-results a:focus-visible { background: rgba(250, 249, 246, .1); color: var(--gold-soft); }
.search-results > span { display: block; padding: .72rem .65rem; color: rgba(250,249,246,.65); font-size: .8rem; }

@keyframes search-results-in {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); }
}

.home-main {
  height: 100svh;
  min-height: 100svh;
}

.home-hero {
  position: relative;
  height: 100svh;
  min-height: 100svh;
  display: flex;
  align-items: end;
  overflow: hidden;
  isolation: isolate;
  background: #0d090b;
  color: var(--paper);
}

.home-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(to top, rgba(5, 3, 4, .96) 0%, rgba(5, 3, 4, .48) 27%, transparent 63%),
    linear-gradient(to right, rgba(6, 4, 5, .58) 0%, transparent 46%);
  pointer-events: none;
}

.hero-atmosphere {
  position: absolute;
  inset: -8%;
  z-index: 0;
  overflow: hidden;
  background:
    radial-gradient(ellipse at 72% 28%, rgba(194, 166, 106, .14), transparent 34%),
    linear-gradient(112deg, #080607 0%, #170a0e 25%, #36101b 58%, #12080c 82%, #080607 100%);
}

.hero-atmosphere::before {
  content: "";
  position: absolute;
  inset: -12%;
  background:
    radial-gradient(ellipse at 20% 32%, rgba(250, 249, 246, .13), transparent 19%),
    radial-gradient(ellipse at 66% 8%, rgba(184, 155, 94, .12), transparent 26%),
    radial-gradient(ellipse at 78% 68%, rgba(101, 28, 44, .34), transparent 32%);
  animation: atmosphere-breathe 16s steps(160, end) infinite alternate;
  will-change: transform, opacity;
}

.hero-atmosphere::after {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .16;
  background-image:
    repeating-linear-gradient(90deg, transparent 0, transparent calc(12.5% - 1px), rgba(250, 249, 246, .12) 12.5%),
    repeating-linear-gradient(0deg, transparent 0, transparent 5px, rgba(250, 249, 246, .025) 6px);
  -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,.75), transparent 78%);
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.75), transparent 78%);
}

.light-band {
  position: absolute;
  top: -30%;
  bottom: -30%;
  display: block;
  width: 15%;
  opacity: .32;
  filter: blur(38px);
  transform: rotate(7deg) translate3d(0, 0, 0);
  transform-origin: center;
  will-change: transform, opacity;
}

.light-band-one {
  left: 10%;
  background: linear-gradient(to bottom, transparent 8%, rgba(250, 249, 246, .44) 31%, rgba(184, 155, 94, .14) 57%, transparent 84%);
  animation: light-drift-one 14s steps(140, end) infinite alternate;
}

.light-band-two {
  left: 47%;
  width: 21%;
  opacity: .25;
  background: linear-gradient(to bottom, transparent 3%, rgba(194, 166, 106, .36) 24%, rgba(101, 28, 44, .7) 61%, transparent 91%);
  animation: light-drift-two 19s steps(190, end) infinite alternate;
}

.light-band-three {
  right: 3%;
  width: 12%;
  opacity: .2;
  background: linear-gradient(to bottom, transparent 12%, rgba(250, 249, 246, .28) 34%, rgba(184, 155, 94, .22) 64%, transparent 88%);
  animation: light-drift-three 17s steps(170, end) infinite alternate;
}

@keyframes atmosphere-breathe {
  from { opacity: .78; transform: scale(1) translate3d(-1.5%, 0, 0); }
  to { opacity: 1; transform: scale(1.08) translate3d(1.5%, -1%, 0); }
}

@keyframes light-drift-one {
  from { opacity: .23; transform: rotate(7deg) translate3d(-14%, -1%, 0) scaleX(.82); }
  to { opacity: .38; transform: rotate(4deg) translate3d(18%, 2%, 0) scaleX(1.16); }
}

@keyframes light-drift-two {
  from { transform: rotate(9deg) translate3d(10%, -3%, 0) scaleX(1); }
  to { transform: rotate(5deg) translate3d(-14%, 3%, 0) scaleX(.78); }
}

@keyframes light-drift-three {
  from { opacity: .14; transform: rotate(5deg) translate3d(18%, 0, 0) scaleX(.84); }
  to { opacity: .27; transform: rotate(9deg) translate3d(-22%, -2%, 0) scaleX(1.18); }
}

/* Ideas in orbit — a lightweight, code-native galaxy */
.idea-galaxy {
  --galaxy-opacity: .82;
  --galaxy-line: rgba(226, 199, 137, .27);
  --galaxy-line-soft: rgba(250, 249, 246, .13);
  --galaxy-star: rgba(250, 249, 246, .58);
  --galaxy-text: rgba(250, 249, 246, .68);
  --galaxy-glow: rgba(194, 166, 106, .34);
  --galaxy-core: #e0c078;
  position: absolute;
  top: 1%;
  right: -6%;
  z-index: 2;
  width: min(64vw, 920px);
  aspect-ratio: 1.32;
  overflow: visible;
  color: var(--galaxy-text);
  opacity: var(--galaxy-opacity);
  pointer-events: none;
  contain: layout style;
  animation: galaxy-reveal 1.15s cubic-bezier(.22, 1, .36, 1) .28s both;
}

.galaxy-field {
  position: absolute;
  inset: -8%;
  border-radius: 50%;
  background:
    radial-gradient(circle at 13% 31%, var(--galaxy-star) 0 1px, transparent 1.6px),
    radial-gradient(circle at 24% 68%, var(--galaxy-line-soft) 0 1px, transparent 1.7px),
    radial-gradient(circle at 37% 15%, var(--galaxy-star) 0 1px, transparent 1.5px),
    radial-gradient(circle at 48% 79%, var(--galaxy-star) 0 1.2px, transparent 1.8px),
    radial-gradient(circle at 61% 22%, var(--galaxy-line-soft) 0 1px, transparent 1.6px),
    radial-gradient(circle at 73% 61%, var(--galaxy-star) 0 1px, transparent 1.6px),
    radial-gradient(circle at 87% 36%, var(--galaxy-line-soft) 0 1.2px, transparent 1.8px),
    radial-gradient(ellipse at 52% 49%, rgba(101, 28, 44, .22), transparent 36%);
  -webkit-mask-image: radial-gradient(ellipse, #000 0 44%, transparent 78%);
  mask-image: radial-gradient(ellipse, #000 0 44%, transparent 78%);
  animation: galaxy-field-drift 18s ease-in-out infinite alternate;
  will-change: transform, opacity;
}

.galaxy-axis {
  position: absolute;
  top: 49%;
  left: 12%;
  width: 76%;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--galaxy-line-soft) 17%, var(--galaxy-line) 50%, var(--galaxy-line-soft) 83%, transparent);
  transform-origin: center;
  animation: galaxy-axis-breathe 7s ease-in-out infinite alternate;
}

.galaxy-axis-one { transform: rotate(17deg); }
.galaxy-axis-two { opacity: .58; transform: rotate(-38deg); animation-delay: -3.5s; }

.galaxy-core {
  position: absolute;
  top: 49%;
  left: 50%;
  width: 12px;
  height: 12px;
  border: 1px solid rgba(250, 249, 246, .55);
  border-radius: 50%;
  background: var(--galaxy-core);
  box-shadow: 0 0 0 7px rgba(194, 166, 106, .06), 0 0 24px var(--galaxy-glow), 0 0 72px rgba(101, 28, 44, .28);
  transform: translate(-50%, -50%);
  animation: galaxy-core-pulse 3.8s ease-in-out infinite alternate;
}

.galaxy-core::before,
.galaxy-core::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  background: var(--galaxy-line);
  transform: translate(-50%, -50%);
}

.galaxy-core::before { width: 44px; height: 1px; }
.galaxy-core::after { width: 1px; height: 44px; }

.galaxy-core i {
  position: absolute;
  inset: -17px;
  border: 1px solid var(--galaxy-line-soft);
  border-radius: 50%;
  animation: galaxy-core-ring 9s linear infinite;
}

.galaxy-caption {
  position: absolute;
  top: calc(49% + 28px);
  left: 50%;
  color: var(--galaxy-text);
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  font-size: clamp(.46rem, .52vw, .56rem);
  font-weight: 560;
  letter-spacing: .24em;
  text-transform: uppercase;
  white-space: nowrap;
  transform: translateX(-50%);
  animation: galaxy-caption-breathe 5.2s ease-in-out infinite alternate;
}

.galaxy-orbit {
  --orbit-duration: 24s;
  --orbit-delay: 0s;
  position: absolute;
  top: 49%;
  left: 50%;
  border: 1px solid var(--galaxy-line);
  border-radius: 50%;
  box-shadow: inset 0 0 18px rgba(194, 166, 106, .025), 0 0 24px rgba(101, 28, 44, .035);
  transform-origin: center;
  animation: galaxy-orbit-spin var(--orbit-duration) linear infinite;
  animation-delay: var(--orbit-delay);
  will-change: transform;
}

.galaxy-orbit-one { --orbit-duration: 19s; --orbit-delay: -7s; width: 34%; height: 21%; }
.galaxy-orbit-two { --orbit-duration: 27s; --orbit-delay: -17s; width: 62%; height: 40%; border-color: var(--galaxy-line-soft); }
.galaxy-orbit-three { --orbit-duration: 36s; --orbit-delay: -28s; width: 88%; height: 62%; opacity: .78; }

.idea-token {
  position: absolute;
  top: 50%;
  right: 0;
  display: inline-flex;
  align-items: center;
  gap: .48rem;
  color: var(--galaxy-text);
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  font-size: clamp(.52rem, .62vw, .66rem);
  font-style: normal;
  font-weight: 560;
  letter-spacing: .16em;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
  text-shadow: 0 1px 8px rgba(0, 0, 0, .55);
  animation: galaxy-token-counter var(--orbit-duration) linear infinite;
  animation-delay: var(--orbit-delay);
  will-change: transform;
}

.idea-token::before {
  content: "";
  width: 4px;
  height: 4px;
  flex: 0 0 4px;
  border-radius: 50%;
  background: var(--galaxy-core);
  box-shadow: 0 0 10px var(--galaxy-glow);
}

.idea-spark {
  position: absolute;
  width: 2px;
  height: 2px;
  border-radius: 50%;
  background: var(--galaxy-star);
  box-shadow: 0 0 8px var(--galaxy-glow);
  animation: idea-spark-pulse 4.8s ease-in-out infinite;
}

.idea-spark-one { top: 19%; left: 35%; animation-delay: -.8s; }
.idea-spark-two { top: 32%; left: 78%; animation-delay: -2.1s; }
.idea-spark-three { top: 67%; left: 19%; animation-delay: -3.6s; }
.idea-spark-four { top: 78%; left: 64%; animation-delay: -1.4s; }
.idea-spark-five { top: 43%; left: 91%; animation-delay: -4.2s; }

@keyframes galaxy-reveal {
  from { opacity: 0; transform: translate3d(4%, -1%, 0) scale(.96) rotate(-4deg); }
  to { opacity: var(--galaxy-opacity); transform: translate3d(0, 0, 0) scale(1) rotate(0); }
}

@keyframes galaxy-field-drift {
  from { opacity: .58; transform: translate3d(-1.5%, 1%, 0) scale(.98) rotate(-1deg); }
  to { opacity: .92; transform: translate3d(1.5%, -1%, 0) scale(1.03) rotate(1deg); }
}

@keyframes galaxy-axis-breathe {
  from { opacity: .28; }
  to { opacity: .72; }
}

@keyframes galaxy-core-pulse {
  from { opacity: .72; transform: translate(-50%, -50%) scale(.86); }
  to { opacity: 1; transform: translate(-50%, -50%) scale(1.12); }
}

@keyframes galaxy-core-ring {
  to { transform: rotate(360deg); }
}

@keyframes galaxy-caption-breathe {
  from { opacity: .28; letter-spacing: .2em; }
  to { opacity: .76; letter-spacing: .27em; }
}

@keyframes galaxy-orbit-spin {
  from { transform: translate(-50%, -50%) rotate(0deg); }
  to { transform: translate(-50%, -50%) rotate(360deg); }
}

@keyframes galaxy-token-counter {
  from { transform: translate(50%, -50%) rotate(0deg); }
  to { transform: translate(50%, -50%) rotate(-360deg); }
}

@keyframes idea-spark-pulse {
  0%, 100% { opacity: .18; transform: scale(.65); }
  45% { opacity: .9; transform: scale(1.4); }
}

/* Static portrait plus a single-draw-call GPU layer for the ambient dots. */
.profile-silhouette {
  position: absolute;
  top: 2%;
  right: 2%;
  z-index: 2;
  width: min(52vw, 82svh, 980px);
  aspect-ratio: 1;
  pointer-events: none;
  opacity: 1;
  animation: profile-silhouette-reveal 1.15s cubic-bezier(.22, 1, .36, 1) .28s both;
  contain: layout style;
  isolation: isolate;
}

.profile-silhouette::before {
  content: "";
  position: absolute;
  inset: 5%;
  background: radial-gradient(circle at 50% 42%, rgba(150, 170, 194, .12), transparent 58%);
  opacity: .55;
  filter: blur(22px);
  -webkit-mask-image: linear-gradient(to bottom, #000 0 80%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 0 80%, transparent 100%);
  animation: profile-portrait-breathe 4.8s steps(96, end) infinite alternate;
}

.profile-silhouette-halo {
  position: absolute;
  inset: 12%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(250, 249, 246, .1) 0, rgba(184, 155, 94, .075) 35%, transparent 71%);
  filter: blur(24px);
  animation: profile-silhouette-halo 5.4s steps(108, end) infinite alternate;
}

.profile-silhouette-art {
  position: absolute;
  inset: -2.667%;
  display: block;
  width: 105.334%;
  height: 105.334%;
  max-width: none;
  object-fit: contain;
  overflow: visible;
  filter: drop-shadow(0 28px 52px rgba(0, 0, 0, .42));
}

.profile-silhouette-motion {
  position: absolute;
  inset: -2.667%;
  z-index: 1;
  display: block;
  width: 105.334%;
  height: 105.334%;
  pointer-events: none;
  contain: strict;
}

html[data-theme="dark"] .profile-silhouette-art {
  filter: brightness(0) invert(.72) sepia(.08) saturate(.65) opacity(.82) drop-shadow(0 28px 52px rgba(0, 0, 0, .42)) drop-shadow(0 0 14px rgba(213, 219, 226, .09));
}

html[data-theme="dark"] .profile-silhouette::before {
  background: radial-gradient(circle at 50% 42%, rgba(150, 164, 180, .09), transparent 58%);
  opacity: .34;
}

html[data-theme="dark"] .profile-silhouette-halo {
  background: radial-gradient(circle, rgba(213, 219, 226, .055) 0, rgba(184, 155, 94, .045) 35%, transparent 70%);
}

@keyframes profile-silhouette-reveal {
  from { opacity: 0; transform: translate3d(7%, 2%, 0) scale(.88) rotate(-5deg); }
  to { opacity: 1; transform: translate3d(0, 0, 0) scale(1) rotate(0); }
}

@keyframes profile-silhouette-halo {
  from { opacity: .45; transform: scale(.91); }
  to { opacity: .9; transform: scale(1.07); }
}

@keyframes profile-portrait-breathe {
  from { opacity: .2; transform: translate3d(-1%, 0, 0) scale(.985); }
  to { opacity: .36; transform: translate3d(1%, -1%, 0) scale(1.015); }
}

.hero-content {
  position: relative;
  z-index: 3;
  padding-top: 7rem;
  padding-bottom: clamp(12rem, 20vh, 15rem);
}

.hero-title {
  position: relative;
  isolation: isolate;
  display: block;
  max-width: 100%;
  margin: 0 0 1.25rem;
  color: #fffdf4;
  background: linear-gradient(112deg, #b58b43 0%, #f5df9d 16%, #ffffff 28%, #d2ad60 40%, #fffdf7 51%, #c79c4f 63%, #ffffff 73%, #ddbd72 84%, #aa7d35 100%);
  background-size: 260% 100%;
  background-position: 115% 50%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  font-family: "Bodoni Moda", Didot, "Iowan Old Style", "Times New Roman", serif;
  font-size: clamp(2.25rem, 4.15vw, 4.45rem);
  font-weight: 400;
  font-optical-sizing: auto;
  font-kerning: normal;
  letter-spacing: .012em;
  word-spacing: .15em;
  line-height: .92;
  text-transform: uppercase;
  white-space: nowrap;
  animation: hero-metal-shimmer 9s ease-in-out infinite;
}

.hero-title::before {
  content: attr(data-text);
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.hero-title::before {
  z-index: -1;
  color: #9b7131;
  -webkit-text-fill-color: #9b7131;
  text-shadow:
    1px 1px 0 #c49a50,
    2px 2px 0 #a87d37,
    3px 3px 0 #805b25;
  transform: translate(1px, 1px);
}

.hero-title.hero-title-image {
  max-width: 100%;
  background: none;
  -webkit-text-fill-color: initial;
  font-size: 0;
  line-height: 1;
  animation: none;
}

.hero-title.hero-title-image::before {
  content: none;
}

@keyframes hero-metal-shimmer {
  0%, 18% { background-position: 115% 50%; }
  52%, 68% { background-position: -15% 50%; }
  100% { background-position: 115% 50%; }
}

.hero-support {
  display: flex;
  align-items: center;
  gap: clamp(1.5rem, 4vw, 3.5rem);
}

.hero-positioning {
  margin: 0;
  color: rgba(250, 249, 246, .82);
  font-size: clamp(.82rem, 1.2vw, .98rem);
  font-weight: 430;
  letter-spacing: .015em;
}

.hero-positioning span {
  margin-inline: .35em;
  color: var(--gold);
}

.hero-link {
  display: inline-flex;
  align-items: center;
  gap: .75rem;
  font-size: .82rem;
  color: rgba(250, 249, 246, .82);
}

.long-arrow {
  display: inline-block;
  font-size: 2.2rem;
  transition: transform 180ms ease;
}

.hero-link:hover .long-arrow { transform: translateX(.45rem); }

.hero-signal {
  position: absolute;
  right: max(var(--pad), calc((100% - var(--max)) / 2 + var(--pad)));
  bottom: clamp(12.5rem, 20vh, 15.5rem);
  z-index: 3;
  display: grid;
  place-items: center;
  color: var(--gold);
}

.hero-signal .lucide {
  width: 23px;
  height: 23px;
  animation: signal-pulse 2.8s steps(56, end) infinite alternate;
}

@keyframes signal-pulse {
  from { opacity: .45; transform: scale(.92); }
  to { opacity: 1; transform: scale(1); }
}

.site-footer {
  position: relative;
  z-index: 10;
  padding-block: 2.2rem 1.5rem;
  border-top: 1px solid rgba(17, 17, 17, .14);
  background: var(--paper-2);
  color: var(--truffle);
}

.home-page .site-footer {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10;
  border: 0;
  background: transparent;
  color: rgba(250, 249, 246, .68);
}

.home-page .site-footer .brand-lockup { color: var(--paper); }
.home-page .site-footer .brand-seal { border-color: rgba(250, 249, 246, .88); }
.home-page .site-footer .brand-seal::after { border-color: rgba(250, 249, 246, .28); }
.home-page .site-footer .brand-seal span { color: var(--paper); }
.home-page .site-footer .social-circle { border-color: rgba(250, 249, 246, .28); color: var(--paper); }
.home-page .site-footer a:hover { color: var(--paper); }

.footer-inner {
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 3rem;
  align-items: center;
}

.footer-brand { display: flex; flex-direction: column; align-items: start; gap: .65rem; }

.brand-lockup {
  display: inline-flex;
  align-items: center;
  gap: .85rem;
  color: var(--ink);
}

.brand-seal {
  position: relative;
  width: 58px;
  height: 58px;
  flex: 0 0 58px;
  display: grid;
  place-items: center;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.brand-seal::before {
  content: none;
  display: none;
}

.brand-seal::after {
  content: none;
  display: none;
}

.brand-seal img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: transparent;
  filter: none;
}

.brand-name {
  display: flex;
  flex-direction: column;
  gap: .2em;
  font-family: Arial, Helvetica, sans-serif;
  font-size: .93rem;
  font-weight: 500;
  letter-spacing: -.04em;
  line-height: .88;
  text-transform: uppercase;
}

.footer-tagline {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: .84rem;
  letter-spacing: -.015em;
}

.footer-right {
  display: flex;
  flex-wrap: wrap;
  justify-content: end;
  align-items: center;
  gap: 1.25rem;
  font-size: .72rem;
}

.footer-socials { display: flex; gap: .75rem; flex-basis: 100%; justify-content: end; }
.footer-socials .social-circle,
.footer-socials .footer-theme-button { width: 34px; height: 34px; }
.footer-socials .brand-social-icon,
.footer-socials .lucide { width: 16px; height: 16px; }
.footer-socials .lucide { stroke-width: 1.9; }

/* Interior pages */
.interior-page .site-header {
  color: var(--ink);
  background: transparent;
  border-bottom: 0;
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.interior-page .site-header::after { display: none; }

.interior-page[data-header-tone="dark"] .site-header { color: var(--paper); }
.interior-page[data-header-tone="light"] .site-header { color: var(--ink); }

.page-main { padding-top: 0; }

.page-kicker {
  margin: 0;
  font-size: .69rem;
  font-weight: 650;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.about-intro {
  min-height: min(790px, calc(100svh - 64px));
  display: grid;
  grid-template-columns: minmax(210px, .65fr) minmax(380px, 1.25fr) minmax(220px, .65fr);
  gap: clamp(2rem, 4vw, 4.5rem);
  align-items: center;
  padding-top: clamp(5rem, 10vw, 9rem);
  padding-bottom: clamp(5rem, 10vw, 9rem);
}

.display-title {
  margin: -.11em 0 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(4.2rem, 10vw, 9.5rem);
  font-weight: 400;
  letter-spacing: -.075em;
  line-height: .86;
}

.intro-copy {
  max-width: 860px;
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.65rem, 3vw, 3rem);
  letter-spacing: -.035em;
  line-height: 1.18;
}

.intro-copy em { color: var(--red); font-style: normal; }

.portrait-band {
  position: relative;
  width: min(100%, 320px);
  aspect-ratio: 4 / 5;
  margin-left: auto;
  overflow: hidden;
  background: var(--ink);
}

.portrait-band img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 31%;
  filter: grayscale(1) contrast(1.06) brightness(.83);
}

.portrait-band::after {
  content: "AI / PRODUCT / CAPITAL";
  position: absolute;
  right: var(--pad);
  bottom: 2rem;
  color: var(--gold-soft);
  font-size: .67rem;
  font-weight: 650;
  letter-spacing: .15em;
}

.dark-section {
  padding-block: clamp(5rem, 10vw, 9rem);
  background: var(--burgundy-dark);
  color: var(--paper);
}

.split-heading {
  display: grid;
  grid-template-columns: .72fr 1.5fr;
  gap: clamp(3rem, 9vw, 10rem);
}

.split-heading h2 {
  max-width: 12em;
  margin: -.12em 0 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2.7rem, 6vw, 6rem);
  font-weight: 400;
  letter-spacing: -.055em;
  line-height: .94;
}

.split-heading .section-copy { max-width: 780px; }
.section-copy > p { margin: 0 0 2rem; font-size: clamp(1rem, 1.6vw, 1.28rem); }

.stat-line {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin-top: clamp(4rem, 8vw, 7rem);
  border-top: 1px solid rgba(250,249,246,.34);
}

.stat {
  padding: 2rem 1.5rem 0 0;
  border-right: 1px solid rgba(250,249,246,.2);
}

.stat:last-child { border-right: 0; padding-left: 1.5rem; }
.stat:nth-child(2) { padding-left: 1.5rem; }
.stat strong { display: block; color: var(--paper); font-family: Georgia, serif; font-size: clamp(2.7rem, 6vw, 5.6rem); font-weight: 400; letter-spacing: -.06em; line-height: 1; }
.stat span { display: block; margin-top: .65rem; font-size: .74rem; }

.explore-section { padding-block: clamp(5rem, 10vw, 9rem); }
.explore-header { display: flex; justify-content: space-between; align-items: end; gap: 2rem; margin-bottom: 4rem; }
.explore-header h2 { margin: 0; font-family: Georgia, serif; font-size: clamp(3rem, 6vw, 6rem); font-weight: 400; letter-spacing: -.06em; line-height: .9; }

.focus-list { border-top: 1px solid var(--line); }
.focus-row {
  display: grid;
  grid-template-columns: 90px 1.1fr 1fr 32px;
  gap: 2rem;
  align-items: start;
  padding-block: 2.2rem;
  border-bottom: 1px solid var(--line);
}
.focus-row .number { font-size: .68rem; letter-spacing: .12em; }
.focus-row h3 { margin: -.12em 0 0; font-family: Georgia, serif; font-size: clamp(1.8rem, 3.4vw, 3.4rem); font-weight: 400; letter-spacing: -.04em; line-height: 1; }
.focus-row p { max-width: 44ch; margin: 0; font-size: .92rem; }
.focus-row .row-arrow { font-size: 1.6rem; transition: transform 180ms ease; }
.focus-row:hover .row-arrow { transform: translateX(.35rem); }

.principles { background: var(--red); color: var(--white); }
.principles-lead { padding-block: clamp(5rem, 10vw, 9rem); }
.principles-lead blockquote { max-width: 1100px; margin: 2.5rem 0 0; font-family: Georgia, serif; font-size: clamp(2.8rem, 6.5vw, 6.6rem); letter-spacing: -.06em; line-height: .92; }
.principle-grid { border-top: 1px solid rgba(250,249,246,.35); }
.principle { display: grid; grid-template-columns: 90px 1fr 1fr; gap: 2rem; padding-block: 2.4rem; border-bottom: 1px solid rgba(250,249,246,.35); }
.principle h3 { margin: 0; font-family: Georgia, serif; font-size: clamp(1.75rem, 3vw, 3rem); font-weight: 400; line-height: 1; }
.principle p { max-width: 48ch; margin: 0; }

.career-strip { padding-block: clamp(4rem, 7vw, 6rem); }
.career-row { display: grid; grid-template-columns: 1fr 1.5fr; gap: 3rem; padding-block: 1.4rem; border-bottom: 1px solid var(--line); }
.career-row:first-of-type { border-top: 1px solid var(--line); margin-top: 3rem; }
.career-row strong { font-weight: 550; }
.career-row span { color: var(--truffle); }

/* Writing */
.writing-hero { background: var(--burgundy-dark); color: var(--paper); }
.feature-story { min-height: 640px; display: grid; grid-template-columns: .8fr 1.2fr; align-items: end; gap: clamp(3rem, 8vw, 9rem); padding-top: clamp(6rem, 11vw, 10rem); padding-bottom: clamp(4rem, 8vw, 7rem); }
.feature-label { align-self: start; color: var(--gold); }
.feature-content h1 { max-width: 12ch; margin: 0 0 2rem; font-family: Georgia, serif; font-size: clamp(3.5rem, 7.4vw, 7.5rem); font-weight: 400; letter-spacing: -.065em; line-height: .88; }
.feature-content p { max-width: 55ch; margin: 0 0 2rem; color: rgba(250,249,246,.78); }
.inline-link { display: inline-flex; gap: .7rem; align-items: center; padding-bottom: .25rem; border-bottom: 1px solid currentColor; font-size: .76rem; font-weight: 650; letter-spacing: .08em; text-transform: uppercase; }

.writing-index { padding-block: clamp(5rem, 9vw, 8rem); }
.writing-index-head { display: flex; justify-content: space-between; align-items: end; gap: 2rem; padding-bottom: 2rem; border-bottom: 1px solid var(--line); }
.writing-index-head h2 { margin: 0; font-family: Georgia, serif; font-size: clamp(3.5rem, 7vw, 7rem); font-weight: 400; letter-spacing: -.065em; line-height: .85; }
.filter-bar { display: flex; flex-wrap: wrap; gap: .5rem; margin: 2rem 0 1.5rem; }
.filter-button { padding: .55rem 1rem; border: 1px solid var(--line); border-radius: 999px; background: transparent; cursor: pointer; font-size: .72rem; }
.filter-button[aria-pressed="true"], .filter-button:hover { background: var(--ink); color: var(--paper); }
.story-list { border-top: 1px solid var(--line); }
.story-row { display: grid; grid-template-columns: 150px 1.25fr 1fr 30px; gap: 2rem; align-items: start; padding-block: 2rem; border-bottom: 1px solid var(--line); }
.story-row.is-hidden { display: none; }
.story-meta { font-size: .66rem; font-weight: 650; letter-spacing: .1em; text-transform: uppercase; }
.story-row h3 { margin: -.08em 0 0; font-family: Georgia, serif; font-size: clamp(1.65rem, 3vw, 3rem); font-weight: 400; letter-spacing: -.04em; line-height: 1.04; }
.story-row p { max-width: 50ch; margin: 0; font-size: .88rem; }
.story-row .row-arrow { font-size: 1.35rem; transition: transform 180ms ease; }
.story-row:hover .row-arrow { transform: translate(3px, -3px); }
.subscribe-band { padding-block: clamp(5rem, 9vw, 8rem); border-top: 1px solid var(--gold); background: var(--paper-2); color: var(--ink); }
.subscribe-band .split-heading h2 { max-width: 10ch; }

/* Precision hardware interface system */
.topbar > .icon-button,
.topbar-actions .icon-button,
.drawer-close,
.search-close,
.back-button,
.social-circle,
.hero-link,
.inline-link,
.filter-button {
  -webkit-tap-highlight-color: transparent;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.09),
    inset 0 -1px 0 rgba(0,0,0,.72),
    0 5px 14px rgba(0,0,0,.16);
}

.topbar > .icon-button,
.topbar-actions .icon-button {
  position: relative;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #f3efe8;
  opacity: 1;
  box-shadow: none;
  transition: transform 180ms cubic-bezier(.22, 1, .36, 1), color 180ms ease, opacity 180ms ease;
}

.topbar > .icon-button::after,
.topbar-actions .icon-button::after {
  content: none;
}

.topbar > .icon-button .lucide,
.topbar-actions .icon-button .lucide {
  filter: drop-shadow(0 1px 0 rgba(255,255,255,.22)) drop-shadow(0 2px 4px rgba(0,0,0,.72));
  transition: filter 180ms ease, transform 240ms cubic-bezier(.22, 1, .36, 1);
}

.topbar > .icon-button:hover,
.topbar-actions .icon-button:hover {
  color: #d2b674;
  opacity: 1;
  box-shadow: none;
  transform: translateY(-1px) scale(1.04);
}

.topbar > .icon-button:hover .lucide,
.topbar-actions .icon-button:hover .lucide {
  filter: drop-shadow(0 1px 0 rgba(255,255,255,.3)) drop-shadow(0 0 7px rgba(184,155,94,.38));
}

.topbar > .icon-button:active,
.topbar-actions .icon-button:active { transform: translateY(1px); }

.topbar-actions .search-button {
  border: 0;
  border-radius: 50%;
  box-shadow: none;
}

.topbar-actions .search-button:focus-visible {
  outline: 2px solid #d2b674;
  outline-offset: 1px;
}

.topbar > .icon-button[aria-expanded="true"],
.topbar-actions .icon-button[aria-expanded="true"] {
  border-color: transparent;
  background: transparent;
  color: #d2b674;
  box-shadow: none;
}

.hero-link,
.inline-link {
  min-height: 42px;
  padding: .64rem 1rem;
  border: 1px solid #303136;
  border-radius: 13px;
  background: linear-gradient(145deg, #202124, #0c0d0e);
  color: var(--hardware-ink);
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  font-size: .72rem;
  font-weight: 590;
  letter-spacing: .055em;
  line-height: 1;
  text-transform: uppercase;
  transition: transform 160ms ease, color 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.hero-link:hover,
.inline-link:hover {
  border-color: transparent;
  background: linear-gradient(145deg, #202124, #0c0d0e) padding-box, var(--hardware-gold) border-box;
  color: var(--paper);
  box-shadow: 0 0 0 3px rgba(8,9,10,.82), 0 0 0 4px rgba(194,166,106,.36), inset 0 1px 0 rgba(255,255,255,.1), 0 8px 22px rgba(0,0,0,.22);
  transform: translateY(-1px);
}

.hero-link:active,
.inline-link:active { transform: translateY(1px); }
.inline-link { border-bottom-width: 1px; }

.long-arrow { font-size: 1.55rem; }

.social-circle {
  width: 40px;
  height: 40px;
  border: 1px solid #2d2e32;
  border-radius: 12px;
  background: linear-gradient(145deg, #202124, #0d0e0f);
  color: var(--hardware-muted);
  transition: transform 160ms ease, color 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.brand-social-icon {
  display: block;
  width: 16px;
  height: 16px;
  background-color: currentColor;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
}

.brand-x {
  -webkit-mask-image: url("https://cdn.jsdelivr.net/npm/simple-icons@v16/icons/x.svg");
  mask-image: url("https://cdn.jsdelivr.net/npm/simple-icons@v16/icons/x.svg");
}

.social-circle .lucide-linkedin {
  width: 16px;
  height: 16px;
  stroke-width: 1.9;
}

.brand-substack {
  -webkit-mask-image: url("https://cdn.jsdelivr.net/npm/simple-icons@v16/icons/substack.svg");
  mask-image: url("https://cdn.jsdelivr.net/npm/simple-icons@v16/icons/substack.svg");
}

.inline-link-icon { width: 16px; height: 16px; }
.search-results .lucide { width: 15px; height: 15px; }

.social-circle:hover,
.menu-socials .social-circle:hover,
.home-page .site-footer .social-circle:hover {
  border-color: rgba(194,166,106,.52);
  background: linear-gradient(145deg, #252629, #101112);
  color: var(--paper);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 0 0 3px rgba(8,9,10,.6), 0 0 0 4px rgba(184,155,94,.27);
  transform: translateY(-1px);
}

.drawer-close,
.search-close,
.back-button {
  border: 1px solid #303136;
  background: linear-gradient(145deg, #232428, #0d0e0f);
  color: var(--hardware-ink);
}

.drawer-close:hover,
.search-close:hover,
.back-button:hover {
  border-color: rgba(194,166,106,.55);
  background: linear-gradient(145deg, #292a2e, #111214);
  color: var(--paper);
}

.search-input-wrap .search-close,
.search-input-wrap .search-close:hover {
  border: 0;
  background: transparent;
  box-shadow: none;
}

.back-button {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  padding: 0;
  border-radius: 11px;
}

.search-input-wrap {
  border: 1px solid #323338;
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(31,32,35,.96), rgba(10,11,12,.96));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.085), inset 0 -2px 6px rgba(0,0,0,.6), 0 12px 34px rgba(0,0,0,.22);
  -webkit-backdrop-filter: blur(24px) saturate(112%);
  backdrop-filter: blur(24px) saturate(112%);
  clip-path: inset(0 21px 0 calc(100% - 21px) round 18px);
}

.search-overlay.is-open .search-input-wrap { clip-path: inset(-5px -5px -5px -5px round 23px); }

.search-field-icon {
  position: absolute;
  top: 50%;
  left: 11px;
  z-index: 2;
  width: 20px;
  height: 20px;
  color: #d2b674;
  filter: drop-shadow(0 1px 0 rgba(255,255,255,.22)) drop-shadow(0 2px 4px rgba(0,0,0,.72));
  pointer-events: none;
  transform: translate3d(calc(min(360px, calc(100vw - 2rem)) - 42px), -50%, 0);
  transition: transform 520ms cubic-bezier(.76, 0, .24, 1), color 220ms ease, filter 220ms ease;
  will-change: transform;
}

.search-overlay.is-open .search-field-icon {
  transform: translate3d(0, -50%, 0);
  color: var(--hardware-muted);
  filter: none;
}

.search-input-wrap:focus-within {
  border-color: transparent;
  background: linear-gradient(145deg, #202124, #0b0c0d) padding-box, var(--hardware-gold) border-box;
  box-shadow: 0 0 0 3px rgba(8,9,10,.82), 0 0 0 4px rgba(194,166,106,.36), inset 0 1px 0 rgba(255,255,255,.09), 0 14px 40px rgba(0,0,0,.26);
}

.search-box input {
  padding-left: 2.75rem;
  border-radius: 18px;
  color: var(--hardware-ink);
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  font-size: clamp(.9rem, 1.3vw, 1.05rem);
  font-weight: 420;
  letter-spacing: -.012em;
}

.search-box input::placeholder { color: var(--hardware-muted); }

.search-results {
  border-color: #303136;
  border-radius: 16px;
  background: linear-gradient(155deg, rgba(31,32,35,.97), rgba(9,10,11,.97));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.075), 0 18px 46px rgba(0,0,0,.28);
  -webkit-backdrop-filter: blur(24px) saturate(110%);
  backdrop-filter: blur(24px) saturate(110%);
}

.search-results a {
  border: 1px solid transparent;
  border-radius: 11px;
  color: var(--hardware-muted);
}

.search-results a:hover,
.search-results a:focus-visible {
  border-color: #303136;
  background: linear-gradient(145deg, #202124, #101112);
  color: var(--paper);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}

.menu-drawer {
  background:
    radial-gradient(circle at 18% 20%, rgba(101,28,44,.2), transparent 38%),
    linear-gradient(155deg, rgba(31,32,35,.96), rgba(8,9,10,.98));
  border-right-color: #303136;
  box-shadow: 18px 0 64px rgba(0,0,0,.32), inset -1px 0 0 rgba(255,255,255,.04);
}

.menu-link,
.submenu-trigger {
  border: 1px solid transparent;
  color: var(--hardware-muted);
}

.menu-link:hover,
.submenu-trigger:hover {
  border-color: #303136;
  background: linear-gradient(145deg, #1f2023, #0e0f10);
  color: var(--hardware-ink);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055), 0 5px 14px rgba(0,0,0,.16);
}

.menu-link[aria-current="page"] {
  border-color: transparent;
  background: linear-gradient(145deg, #202124, #0b0c0d) padding-box, var(--hardware-gold) border-box;
  color: var(--paper);
  box-shadow: 0 0 0 3px #0b0c0d, 0 0 0 4px rgba(194,166,106,.38), inset 0 1px 0 rgba(255,255,255,.08);
}

.sub-links a {
  border: 1px solid transparent;
  color: var(--hardware-muted);
  transition: border-color 160ms ease, background 160ms ease, color 160ms ease, transform 160ms ease;
}

.sub-links a:hover {
  border-color: #303136;
  background: linear-gradient(145deg, #202124, #0f1011);
  color: var(--paper);
  transform: translateX(2px);
}

.filter-bar {
  width: fit-content;
  max-width: 100%;
  flex-wrap: nowrap;
  gap: .75rem;
  padding: 8px;
  overflow-x: auto;
  border: 1px solid #2c2d30;
  border-radius: 19px;
  background: linear-gradient(145deg, #1c1d20, #090a0b);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.075), inset 0 -1px 0 rgba(0,0,0,.8), 0 10px 26px rgba(0,0,0,.18);
  scrollbar-width: none;
}

.filter-bar::-webkit-scrollbar { display: none; }

.filter-button {
  flex: 0 0 auto;
  min-height: 38px;
  padding: .55rem .92rem;
  border: 1px solid transparent;
  border-radius: 11px;
  background: transparent;
  color: var(--hardware-muted);
  box-shadow: none;
  font-weight: 560;
  letter-spacing: .025em;
  transition: color 160ms ease, background 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.filter-button + .filter-button { margin-left: 0; }

.filter-button:hover {
  background: linear-gradient(145deg, #242529, #111214);
  color: var(--hardware-ink);
}

.filter-button[aria-pressed="true"] {
  border-color: transparent;
  background: linear-gradient(145deg, #202124, #0b0c0d) padding-box, var(--hardware-gold) border-box;
  color: var(--paper);
  box-shadow: 0 0 0 3px #0a0b0c, 0 0 0 4px rgba(194,166,106,.4), inset 0 1px 0 rgba(255,255,255,.08);
}

.filter-button:active { transform: translateY(1px); }

@media (prefers-contrast: more) {
  .topbar > .icon-button,
  .topbar-actions .icon-button,
  .hero-link,
  .inline-link,
  .social-circle,
  .filter-bar,
  .filter-button { border-color: currentColor; }
}

@media (max-width: 900px) {
  .about-intro, .split-heading, .feature-story { grid-template-columns: 1fr; }
  .about-intro { min-height: auto; gap: 3rem; }
  .display-title { max-width: 5ch; }
  .focus-row { grid-template-columns: 50px 1fr 28px; }
  .focus-row p { grid-column: 2; }
  .principle { grid-template-columns: 50px 1fr; }
  .principle p { grid-column: 2; }
  .story-row { grid-template-columns: 100px 1fr 26px; }
  .story-row p { grid-column: 2; }
}

@media (max-width: 760px) {
  .topbar { height: 58px; }
  .page-main { padding-top: 0; }
  .wordmark { gap: .4rem; }
  .search-box { top: calc(8px + env(safe-area-inset-top)); right: .75rem; width: min(320px, calc(100% - 1.5rem)); }
  .search-input-wrap { height: 42px; }
  .search-box input { height: 40px; padding-left: 2.65rem; padding-right: 3.25rem; font-size: .86rem; }
  .search-close { top: 3px; right: 4px; }
  .idea-galaxy { --galaxy-opacity: .68; top: 5%; right: -57%; width: 145vw; }
  .idea-token { font-size: .5rem; letter-spacing: .13em; }
  .galaxy-orbit-three { opacity: .58; }
  .home-page .home-hero {
    --home-footer-reserve: calc(7rem + env(safe-area-inset-bottom));
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto var(--home-footer-reserve);
    align-items: stretch;
    row-gap: clamp(.5rem, 1.5svh, .85rem);
    padding-top: calc(58px + env(safe-area-inset-top));
  }
  .hero-content { padding-bottom: 0; }
  .hero-title:not(.hero-title-image) { max-width: 10em; font-size: clamp(2rem, 8.8vw, 3.35rem); line-height: .94; white-space: normal; }
  .hero-title.hero-title-image { max-width: 100%; }
  .hero-support { align-items: start; flex-direction: column; gap: .9rem; }
  .hero-signal { bottom: clamp(8rem, 18vh, 10rem); }
  .home-page .site-footer {
    position: absolute;
    padding: .9rem 0 calc(.75rem + env(safe-area-inset-bottom));
    background: transparent;
  }
  .home-page .footer-inner { grid-template-columns: minmax(0, 1fr) auto; gap: 1rem; align-items: end; }
  .home-page .footer-brand { gap: .35rem; }
  .home-page .brand-seal { width: 44px; height: 44px; flex-basis: 44px; }
  .home-page .brand-seal::after { inset: 5px; }
  .home-page .footer-tagline { font-size: .7rem; }
  .home-page .footer-right { max-width: none; gap: .7rem 1rem; font-size: .6rem; }
  .home-page .footer-socials { align-items: center; gap: .65rem; justify-content: end; }
  .home-page .footer-socials .social-circle,
  .home-page .footer-theme-button {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    border: 1px solid #2d2e32;
    border-radius: 50%;
    background: linear-gradient(145deg, #202124, #0d0e0f);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.09), inset 0 -1px 0 rgba(0,0,0,.72), 0 5px 14px rgba(0,0,0,.16);
  }
  .home-page .footer-socials .brand-social-icon,
  .home-page .footer-socials .lucide {
    width: 18px;
    height: 18px;
  }
  .home-page .footer-socials .social-circle:focus-visible,
  .home-page .footer-theme-button:focus-visible {
    outline: 2px solid var(--gold-soft);
    outline-offset: 3px;
  }
  html[data-theme="light"] .home-page .footer-socials .social-circle,
  html[data-theme="light"] .home-page .footer-theme-button {
    border-color: #cbc6bd;
    background: linear-gradient(145deg, #fffdf9, #dedad2);
    box-shadow: inset 0 1px 0 #ffffff, inset 0 -1px 0 rgba(17,17,17,.13), 0 5px 14px rgba(45,38,31,.1);
  }
  .interior-page .footer-inner { grid-template-columns: 1fr; }
  .interior-page .footer-right, .interior-page .footer-socials { justify-content: start; }
  .menu-drawer { inset: 0 auto 0 0; border-radius: 0; }
  .menu-overlay.is-open .menu-drawer { width: min(292px, calc(100% - 1rem)); }
  .menu-panel { padding: 1rem .9rem; }
  .about-intro { padding-top: 4rem; }
  .portrait-band { width: min(82vw, 320px); margin-inline: auto 0; }
  .stat-line { grid-template-columns: 1fr; }
  .stat, .stat:nth-child(2), .stat:last-child { padding: 1.5rem 0; border-right: 0; border-bottom: 1px solid rgba(250,249,246,.2); }
  .explore-header, .writing-index-head { align-items: start; flex-direction: column; }
  .focus-row { grid-template-columns: 36px 1fr 24px; gap: 1rem; }
  .principle { grid-template-columns: 32px 1fr; gap: 1rem; }
  .career-row { grid-template-columns: 1fr; gap: .35rem; }
  .feature-story { min-height: 100svh; align-content: space-between; }
  .story-row { grid-template-columns: 1fr 24px; gap: 1rem; }
  .story-meta { grid-column: 1; }
  .story-row h3 { grid-column: 1; }
  .story-row p { grid-column: 1; }
  .story-row .row-arrow { grid-column: 2; grid-row: 2; }
}

@media (max-width: 480px) {
  .home-page .home-hero { --home-footer-reserve: calc(5rem + env(safe-area-inset-bottom)); }
  .home-page .footer-inner { align-items: center; gap: .75rem; }
  .home-page .brand-lockup { gap: .55rem; }
  .home-page .brand-seal { width: 38px; height: 38px; flex-basis: 38px; }
  .home-page .footer-tagline,
  .home-page .footer-right > span,
  .home-page .footer-right > a { display: none; }
  .home-page .footer-right { max-width: none; }
  .home-page .footer-socials { align-items: center; gap: .55rem; }
  .home-page .footer-socials .social-circle,
  .home-page .footer-theme-button {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
  }
  .home-page .footer-socials .brand-social-icon,
  .home-page .footer-socials .lucide {
    width: 17px;
    height: 17px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .landing-intro { display: none; }
  .hero-title, .hero-positioning, .hero-link { animation: none !important; }
  .hero-atmosphere::before, .light-band, .hero-signal .lucide { animation: none !important; }
  .idea-galaxy, .galaxy-field, .galaxy-axis, .galaxy-core, .galaxy-core i, .galaxy-caption, .galaxy-orbit, .idea-token, .idea-spark { animation: none !important; }
  .idea-galaxy { opacity: var(--galaxy-opacity); transform: none; }
  .galaxy-orbit-one { transform: translate(-50%, -50%) rotate(18deg); }
  .galaxy-orbit-one .idea-token { transform: translate(50%, -50%) rotate(-18deg); }
  .galaxy-orbit-two { transform: translate(-50%, -50%) rotate(142deg); }
  .galaxy-orbit-two .idea-token { transform: translate(50%, -50%) rotate(-142deg); }
  .galaxy-orbit-three { transform: translate(-50%, -50%) rotate(252deg); }
  .galaxy-orbit-three .idea-token { transform: translate(50%, -50%) rotate(-252deg); }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* Complete color modes */
html[data-theme="dark"] .skip-link {
  background: var(--surface-raised);
  color: var(--ink);
}

html[data-theme="dark"] .interior-page .site-header {
  background: transparent;
  border-bottom-color: rgba(250, 249, 246, .13);
}

html[data-theme="dark"] .intro-copy em { color: var(--gold-soft); }
html[data-theme="dark"] .brand-seal::after { border-color: rgba(250, 249, 246, .22); }

html[data-theme="light"] .home-page,
html[data-theme="light"] .home-hero {
  background: #f7f5f0;
  color: #111111;
}

html[data-theme="light"] .home-page .site-header {
  background: transparent;
  color: #111111;
}

html[data-theme="light"] .home-page .site-header::after {
  display: none;
}

html[data-theme="light"] .home-hero::after {
  background:
    linear-gradient(to top, rgba(247, 245, 240, .98) 0%, rgba(247, 245, 240, .58) 27%, transparent 63%),
    linear-gradient(to right, rgba(247, 245, 240, .68) 0%, transparent 48%);
}

html[data-theme="light"] .hero-atmosphere {
  background:
    radial-gradient(ellipse at 72% 28%, rgba(184, 155, 94, .2), transparent 35%),
    linear-gradient(112deg, #faf9f6 0%, #eee8e3 26%, #d9c3c8 57%, #eee7df 82%, #f8f6f1 100%);
}

html[data-theme="light"] .hero-atmosphere::before {
  background:
    radial-gradient(ellipse at 20% 32%, rgba(255, 255, 255, .72), transparent 20%),
    radial-gradient(ellipse at 66% 8%, rgba(184, 155, 94, .2), transparent 28%),
    radial-gradient(ellipse at 78% 68%, rgba(101, 28, 44, .2), transparent 34%);
}

html[data-theme="light"] .hero-atmosphere::after {
  opacity: .2;
  background-image:
    repeating-linear-gradient(90deg, transparent 0, transparent calc(12.5% - 1px), rgba(17, 17, 17, .08) 12.5%),
    repeating-linear-gradient(0deg, transparent 0, transparent 5px, rgba(17, 17, 17, .025) 6px);
}

html[data-theme="light"] .light-band-one {
  background: linear-gradient(to bottom, transparent 8%, rgba(255,255,255,.82) 31%, rgba(184,155,94,.2) 57%, transparent 84%);
}

html[data-theme="light"] .light-band-two {
  background: linear-gradient(to bottom, transparent 3%, rgba(194,166,106,.32) 24%, rgba(101,28,44,.35) 61%, transparent 91%);
}

html[data-theme="light"] .light-band-three {
  background: linear-gradient(to bottom, transparent 12%, rgba(255,255,255,.7) 34%, rgba(184,155,94,.26) 64%, transparent 88%);
}

html[data-theme="light"] .idea-galaxy {
  --galaxy-opacity: .64;
  --galaxy-line: rgba(101, 28, 44, .24);
  --galaxy-line-soft: rgba(101, 28, 44, .12);
  --galaxy-star: rgba(101, 28, 44, .48);
  --galaxy-text: rgba(70, 23, 33, .7);
  --galaxy-glow: rgba(184, 155, 94, .3);
  --galaxy-core: #8a6d36;
}

html[data-theme="light"] .galaxy-field {
  background:
    radial-gradient(circle at 13% 31%, var(--galaxy-star) 0 1px, transparent 1.6px),
    radial-gradient(circle at 24% 68%, var(--galaxy-line-soft) 0 1px, transparent 1.7px),
    radial-gradient(circle at 37% 15%, var(--galaxy-star) 0 1px, transparent 1.5px),
    radial-gradient(circle at 48% 79%, var(--galaxy-star) 0 1.2px, transparent 1.8px),
    radial-gradient(circle at 61% 22%, var(--galaxy-line-soft) 0 1px, transparent 1.6px),
    radial-gradient(circle at 73% 61%, var(--galaxy-star) 0 1px, transparent 1.6px),
    radial-gradient(circle at 87% 36%, var(--galaxy-line-soft) 0 1.2px, transparent 1.8px),
    radial-gradient(ellipse at 52% 49%, rgba(184, 155, 94, .16), transparent 36%);
}

html[data-theme="light"] .galaxy-core {
  border-color: rgba(101, 28, 44, .38);
  box-shadow: 0 0 0 7px rgba(184, 155, 94, .07), 0 0 24px var(--galaxy-glow), 0 0 64px rgba(101, 28, 44, .13);
}

html[data-theme="light"] .idea-token { text-shadow: 0 1px 7px rgba(255, 255, 255, .82); }

html[data-theme="light"] .hero-title {
  color: #651c2c;
  background-image: linear-gradient(112deg, #3d0e19 0%, #68192c 18%, #9d5c36 29%, #e2c57b 38%, #721d32 50%, #ad874d 63%, #f0d99f 71%, #651c2c 84%, #390c17 100%);
}

html[data-theme="light"] .hero-title::before {
  color: #4c1421;
  -webkit-text-fill-color: #4c1421;
  text-shadow:
    1px 1px 0 #7b2638,
    2px 2px 0 #5b1828,
    3px 3px 0 #351018;
}

html[data-theme="light"] .hero-title.hero-title-image {
  background: none;
  background-image: none;
  -webkit-background-clip: border-box;
  background-clip: border-box;
  -webkit-text-fill-color: currentColor;
}

html[data-theme="light"] .hero-title.hero-title-image::before {
  content: none;
}

html[data-theme="light"] .hero-positioning { color: rgba(17, 17, 17, .72); }

html[data-theme="light"] .home-page .site-footer {
  border: 0;
  background: transparent;
  color: #73706c;
}

html[data-theme="light"] .home-page .site-footer .brand-lockup { color: #111111; }
html[data-theme="light"] .home-page .site-footer .brand-seal { border-color: rgba(17,17,17,.72); }
html[data-theme="light"] .home-page .site-footer .brand-seal::after { border-color: rgba(17,17,17,.2); }
html[data-theme="light"] .home-page .site-footer .brand-seal span { color: #111111; }
html[data-theme="light"] .home-page .site-footer .social-circle { color: #000000; }
html[data-theme="light"] .home-page .site-footer .footer-theme-button { color: #000000; }
html[data-theme="light"] .home-page .site-footer a:hover { color: #111111; }

html[data-theme="light"] .interior-page .site-header {
  background: transparent;
  border-bottom-color: rgba(17, 17, 17, .12);
}

html[data-theme="light"] .topbar > .icon-button,
html[data-theme="light"] .topbar-actions .icon-button {
  border-color: transparent;
  background: transparent;
  color: #201e1c;
  box-shadow: none;
}

html[data-theme="light"] .topbar > .icon-button::after,
html[data-theme="light"] .topbar-actions .icon-button::after { content: none; }

html[data-theme="light"] .topbar > .icon-button .lucide,
html[data-theme="light"] .topbar-actions .icon-button .lucide {
  filter: drop-shadow(0 1px 0 rgba(255,255,255,.9)) drop-shadow(0 2px 3px rgba(56,45,35,.18));
}

html[data-theme="light"] .topbar > .icon-button:hover,
html[data-theme="light"] .topbar-actions .icon-button:hover {
  border-color: transparent;
  color: #8f6c2d;
  box-shadow: none;
}

html[data-theme="light"] .topbar > .icon-button[aria-expanded="true"],
html[data-theme="light"] .topbar-actions .icon-button[aria-expanded="true"] {
  border-color: transparent;
  background: transparent;
  color: #8f6c2d;
  box-shadow: none;
}

html[data-theme="light"] .hero-link,
html[data-theme="light"] .inline-link {
  border-color: #c9c4bb;
  background: linear-gradient(145deg, #fffdf9, #dedad2);
  color: #292724;
  box-shadow: inset 0 1px 0 #ffffff, inset 0 -1px 0 rgba(17,17,17,.13), 0 6px 16px rgba(45,38,31,.1);
}

html[data-theme="light"] .hero-link:hover,
html[data-theme="light"] .inline-link:hover {
  border-color: transparent;
  background: linear-gradient(145deg, #fffdf9, #dedad2) padding-box, var(--hardware-gold) border-box;
  color: #111111;
  box-shadow: 0 0 0 3px rgba(250,249,246,.9), 0 0 0 4px rgba(160,123,53,.38), inset 0 1px 0 #ffffff, 0 8px 22px rgba(45,38,31,.13);
}

html[data-theme="light"] .social-circle,
html[data-theme="light"] .drawer-close,
html[data-theme="light"] .search-close,
html[data-theme="light"] .back-button {
  border-color: #cbc6bd;
  background: linear-gradient(145deg, #fffdf9, #dedad2);
  color: #5f5b55;
  box-shadow: inset 0 1px 0 #ffffff, inset 0 -1px 0 rgba(17,17,17,.13), 0 5px 14px rgba(45,38,31,.1);
}

html[data-theme="light"] .social-circle:hover,
html[data-theme="light"] .menu-socials .social-circle:hover,
html[data-theme="light"] .home-page .site-footer .social-circle:hover,
html[data-theme="light"] .drawer-close:hover,
html[data-theme="light"] .search-close:hover,
html[data-theme="light"] .back-button:hover {
  border-color: rgba(160,123,53,.62);
  background: linear-gradient(145deg, #fffdf9, #e5e0d7);
  color: #111111;
  box-shadow: inset 0 1px 0 #ffffff, 0 0 0 3px rgba(250,249,246,.75), 0 0 0 4px rgba(184,155,94,.28);
}

html[data-theme="light"] .search-input-wrap {
  border-color: #c9c4bb;
  background: linear-gradient(145deg, rgba(255,253,249,.97), rgba(225,221,213,.97));
  box-shadow: inset 0 1px 0 #ffffff, inset 0 -2px 6px rgba(45,38,31,.1), 0 12px 34px rgba(45,38,31,.13);
}

html[data-theme="light"] .search-input-wrap:focus-within {
  border-color: transparent;
  background: linear-gradient(145deg, #fffdf9, #e2ded6) padding-box, var(--hardware-gold) border-box;
  box-shadow: 0 0 0 3px rgba(240,237,230,.92), 0 0 0 4px rgba(160,123,53,.42), inset 0 1px 0 #ffffff, 0 14px 40px rgba(45,38,31,.14);
}

html[data-theme="light"] .topbar-actions .search-button:focus-visible {
  outline-color: #8f6c2d;
}

html[data-theme="light"] .search-input-wrap .search-close,
html[data-theme="light"] .search-input-wrap .search-close:hover {
  border: 0;
  background: transparent;
  box-shadow: none;
}

html[data-theme="light"] .search-box input { color: #242321; }
html[data-theme="light"] .search-box input::placeholder { color: #77726b; }
html[data-theme="light"] .search-field-icon { color: #8f6c2d; filter: drop-shadow(0 1px 0 rgba(255,255,255,.9)); }
html[data-theme="light"] .search-overlay.is-open .search-field-icon { color: #77726b; filter: none; }

html[data-theme="light"] .search-results {
  border-color: #c9c4bb;
  background: linear-gradient(155deg, rgba(255,253,249,.98), rgba(229,225,217,.98));
  box-shadow: inset 0 1px 0 #ffffff, 0 18px 46px rgba(45,38,31,.15);
}

html[data-theme="light"] .search-results a { color: #68635d; }
html[data-theme="light"] .search-results > span { color: #73706c; }

html[data-theme="light"] .search-results a:hover,
html[data-theme="light"] .search-results a:focus-visible {
  border-color: #c9c4bb;
  background: linear-gradient(145deg, #fffdf9, #e3dfd7);
  color: #111111;
  box-shadow: inset 0 1px 0 #ffffff;
}

html[data-theme="light"] .menu-drawer {
  background:
    radial-gradient(circle at 18% 20%, rgba(101,28,44,.09), transparent 39%),
    linear-gradient(155deg, rgba(255,253,249,.97), rgba(225,221,213,.98));
  border-right-color: #c7c2b9;
  color: #706b64;
  box-shadow: 18px 0 64px rgba(45,38,31,.17), inset -1px 0 0 rgba(255,255,255,.68);
}

html[data-theme="light"] .menu-identity,
html[data-theme="light"] .panel-top,
html[data-theme="light"] .menu-socials,
html[data-theme="light"] .menu-footer { border-color: rgba(17,17,17,.12); }
html[data-theme="light"] .menu-person strong,
html[data-theme="light"] .panel-title { color: #1d1c1a; }
html[data-theme="light"] .menu-person small { color: #77726b; }

html[data-theme="light"] .menu-link,
html[data-theme="light"] .submenu-trigger,
html[data-theme="light"] .sub-links a { color: #69645e; }

html[data-theme="light"] .menu-link:hover,
html[data-theme="light"] .submenu-trigger:hover,
html[data-theme="light"] .sub-links a:hover {
  border-color: #cbc6bd;
  background: linear-gradient(145deg, #fffdf9, #dedad2);
  color: #1d1c1a;
  box-shadow: inset 0 1px 0 #ffffff, 0 5px 14px rgba(45,38,31,.08);
}

html[data-theme="light"] .menu-link[aria-current="page"] {
  border-color: transparent;
  background: linear-gradient(145deg, #fffdf9, #dedad2) padding-box, var(--hardware-gold) border-box;
  color: #111111;
  box-shadow: 0 0 0 3px rgba(240,237,230,.92), 0 0 0 4px rgba(160,123,53,.42), inset 0 1px 0 #ffffff;
}

html[data-theme="light"] .filter-bar {
  border-color: #c7c2b9;
  background: linear-gradient(145deg, #e4e0d8, #faf8f3);
  box-shadow: inset 0 1px 0 #ffffff, inset 0 -1px 0 rgba(17,17,17,.13), 0 10px 26px rgba(45,38,31,.11);
}

html[data-theme="light"] .filter-button { color: #716c65; }

html[data-theme="light"] .filter-button:hover {
  background: linear-gradient(145deg, #fffdf9, #dedad2);
  color: #242321;
}

html[data-theme="light"] .filter-button[aria-pressed="true"] {
  border-color: transparent;
  background: linear-gradient(145deg, #fffdf9, #dedad2) padding-box, var(--hardware-gold) border-box;
  color: #111111;
  box-shadow: 0 0 0 3px rgba(240,237,230,.92), 0 0 0 4px rgba(160,123,53,.42), inset 0 1px 0 #ffffff;
}

/* About — editorial reveal system */
html.about-opening-active,
html.about-opening-active body { height: 100%; overflow: hidden; }

.about-page {
  --about-warm: #f7f5f0;
  --about-copy: #111111;
  background: var(--burgundy-dark);
}

html[data-theme="dark"] .about-page {
  --about-warm: #0b0c0d;
  --about-copy: #f1efea;
}

.about-page .site-header {
  color: var(--paper);
  background: transparent;
  border-bottom-color: rgba(250,249,246,.14);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.about-page[data-header-tone="light"] .site-header {
  color: #111111;
  background: transparent;
  border-bottom-color: rgba(17,17,17,.13);
}

html[data-theme="dark"] .about-page[data-header-tone="light"] .site-header {
  color: #f1efea;
  background: transparent;
  border-bottom-color: rgba(250,249,246,.13);
}

.about-opening {
  --opening-duration: 1.58s;
  position: fixed;
  inset: 0;
  z-index: 5000;
  display: grid;
  place-items: center;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 45%, rgba(218,188,121,.1), transparent 26%),
    linear-gradient(155deg, #35101a 0%, #4c1421 52%, #2d0b14 100%);
  color: var(--paper);
  transform: translateY(0);
  will-change: transform, opacity;
  contain: layout paint style;
  isolation: isolate;
}

html.about-intro-seen .about-opening { display: none; }

.about-opening::before {
  content: "";
  position: absolute;
  inset: clamp(4.5rem,10vh,7rem) clamp(1.25rem,4vw,4rem);
  border-inline: 1px solid rgba(250,249,246,.055);
  background: linear-gradient(90deg, transparent 49.95%, rgba(250,249,246,.06) 50%, transparent 50.05%);
  pointer-events: none;
}

.about-opening::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at center, transparent 0 28%, rgba(9,2,4,.08) 58%, rgba(9,2,4,.32) 100%);
  pointer-events: none;
}

.about-opening.is-running { animation: about-opening-exit .62s cubic-bezier(.76,0,.24,1) var(--opening-duration) forwards; }
.about-opening.is-skipped { animation: about-opening-exit .36s cubic-bezier(.76,0,.24,1) forwards; }

.about-opening-pattern {
  position: absolute;
  top: 45%;
  left: 50%;
  width: min(66vmin, 560px);
  aspect-ratio: 1;
  border: 1px solid rgba(225,205,161,.065);
  border-radius: 50%;
  opacity: 0;
  transform: translate(-50%,-50%) scale(.88);
}

.about-opening-pattern::before,
.about-opening-pattern::after {
  content: "";
  position: absolute;
  border: 1px solid rgba(250,249,246,.04);
  border-radius: 50%;
}

.about-opening-pattern::before { inset: 12%; }
.about-opening-pattern::after { inset: 31%; border-color: rgba(225,205,161,.08); }
.about-opening.is-running .about-opening-pattern { animation: about-pattern-in .8s cubic-bezier(.22,1,.36,1) .08s forwards; }

.about-opening-skip {
  position: absolute;
  top: calc(1.25rem + env(safe-area-inset-top));
  right: clamp(1.25rem,3vw,2.5rem);
  z-index: 4;
  padding: .35rem 0;
  border: 0;
  border-bottom: 1px solid rgba(250,249,246,.24);
  border-radius: 0;
  background: transparent;
  color: rgba(250,249,246,.56);
  font-size: .58rem;
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
  cursor: pointer;
  opacity: 0;
  transition: border-color 180ms ease, color 180ms ease;
}

.about-opening.is-running .about-opening-skip { animation: about-meta-in .42s ease .22s forwards; }
.about-opening-skip:hover,
.about-opening-skip:focus-visible { border-color: var(--gold-soft); color: var(--paper); }

.about-mark-scene {
  position: absolute;
  top: 45%;
  left: 50%;
  width: clamp(108px,13vmin,148px);
  aspect-ratio: 1;
  opacity: 0;
  transform: translate(-50%,-50%) scale(.92);
  will-change: transform, opacity;
}

.about-opening.is-running .about-mark-scene { animation: about-mark-arrive .66s cubic-bezier(.22,1,.36,1) .16s forwards; }

.about-orbit,
.about-opening-seal {
  position: absolute;
  top: 50%;
  left: 50%;
  border-radius: 50%;
}

.about-orbit {
  border: 1px solid rgba(225,205,161,.28);
  transform: translate(-50%,-50%);
}

.about-orbit::after {
  content: "";
  position: absolute;
  top: -2px;
  left: 50%;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--gold-soft);
  box-shadow: 0 0 12px rgba(194,166,106,.55);
}

.about-orbit-one { width: 100%; height: 100%; }
.about-opening.is-running .about-orbit-one { animation: about-orbit-one 1.35s cubic-bezier(.22,.7,.25,1) .2s both; }

.brand-seal.about-opening-seal {
  width: 72%;
  height: 72%;
  color: var(--paper);
  opacity: 0;
  transform: translate(-50%,-50%) translateY(4px) scale(.96);
  box-shadow: none;
}

.brand-seal.about-opening-seal img { mix-blend-mode: screen; filter: none; }
.about-opening.is-running .about-opening-seal { animation: about-seal-in .6s cubic-bezier(.22,1,.36,1) .28s forwards; }

.about-opening-name {
  position: absolute;
  top: calc(45% + clamp(72px,8.5vmin,92px));
  left: 50%;
  margin: 0;
  color: rgba(250,249,246,.64);
  font-size: .58rem;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  opacity: 0;
  transform: translateX(-50%) translateY(6px);
  white-space: nowrap;
}

.about-opening.is-running .about-opening-name { animation: about-name-in .48s ease .38s forwards; }

.about-opening-slogan {
  position: absolute;
  inset: auto clamp(1.25rem,4vw,4rem) 12%;
  z-index: 2;
  display: flex;
  justify-content: center;
  gap: .38em;
  margin: 0;
  color: var(--paper);
  font-family: "Bodoni Moda", Didot, Georgia, serif;
  font-size: clamp(1.9rem, 5.2vw, 5.5rem);
  font-weight: 400;
  letter-spacing: -.045em;
  line-height: 1.05;
  text-wrap: balance;
}

.about-opening-word { display:inline-block; padding:.06em .04em .1em; opacity:0; transform:translateY(18px); }
.about-opening.is-running .about-opening-word { animation:about-word-in .58s cubic-bezier(.22,1,.36,1) .5s forwards; }
.about-opening.is-running .about-opening-word:nth-child(2) { animation-delay:.57s; color:rgba(250,249,246,.52); font-style:italic; }

.about-opening-progress {
  position: absolute;
  left: 50%;
  bottom: calc(2rem + env(safe-area-inset-bottom));
  z-index: 3;
  width: min(116px,28vw);
  height: 1px;
  overflow: hidden;
  background: rgba(250,249,246,.18);
  transform: translateX(-50%);
}

.about-opening-progress i { display: block; width: 100%; height: 100%; background: var(--gold-soft); transform: translateX(-100%); }
.about-opening.is-running .about-opening-progress i { animation: about-progress var(--opening-duration) cubic-bezier(.22,.7,.25,1) forwards; }

@keyframes about-mark-arrive { to { opacity: 1; transform: translate(-50%,-50%) scale(1); } }
@keyframes about-pattern-in { to { opacity:1; transform:translate(-50%,-50%) scale(1); } }
@keyframes about-meta-in { to { opacity:1; transform:translateY(0); } }
@keyframes about-orbit-one { from { opacity:0; transform:translate(-50%,-50%) rotate(-38deg) scale(.9); } to { opacity:1; transform:translate(-50%,-50%) rotate(72deg) scale(1); } }
@keyframes about-seal-in { to { opacity:.95; transform:translate(-50%,-50%) translateY(0) scale(1); } }
@keyframes about-name-in { to { opacity: 1; transform: translateX(-50%) translateY(0); } }
@keyframes about-word-in { to { opacity:1; transform:translateY(0); } }
@keyframes about-progress { to { transform: translateX(0); } }
@keyframes about-opening-exit { to { opacity:.98; transform:translateY(-101%); } }

.about-main { position: relative; padding-top: 0; }

.about-who {
  position: relative;
  isolation: isolate;
  min-height: 100svh;
  overflow: hidden;
  padding: clamp(6rem, 8vw, 7rem) 0 clamp(6rem, 10vw, 9rem);
  background:
    radial-gradient(ellipse at 82% 22%, rgba(194,166,106,.12), transparent 28%),
    linear-gradient(118deg, #35000f 0%, #570018 48%, #390010 100%);
  color: var(--paper);
}

.about-who::before,
.about-who::after {
  content: "";
  position: absolute;
  z-index: -1;
  border: 1px solid rgba(226,199,137,.1);
  border-radius: 50%;
  pointer-events: none;
}

.about-who::before {
  top: 4%;
  right: -12%;
  width: min(64vw, 880px);
  aspect-ratio: 1.5;
  transform: rotate(18deg);
}

.about-who::after {
  top: 13%;
  right: -3%;
  width: min(42vw, 610px);
  aspect-ratio: 1.72;
  border-color: rgba(250,249,246,.065);
  transform: rotate(-31deg);
}

.about-editorial {
  position: relative;
  z-index: 1;
  max-width: var(--max);
}

.about-who-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: clamp(4rem,7vw,6rem);
  align-items: center;
}

.about-who-copy { width:100%; max-width:540px; }
.about-who .page-kicker { color:var(--gold-soft); letter-spacing:.2em; }
.about-who-copy h1 { max-width:none; margin:.55rem 0 1.75rem; font-family:"Bodoni Moda",Didot,Georgia,serif; font-size:clamp(2.3rem,3.4vw,3.2rem); font-weight:400; letter-spacing:-.045em; line-height:1; text-wrap:balance; }
.about-title-line { display:block; }
.about-lede { max-width:43ch; margin:0 0 1.45rem; font-family:Georgia,"Times New Roman",serif; font-size:clamp(1.08rem,1.65vw,1.3rem); letter-spacing:-.015em; line-height:1.58; }
.about-lede strong { color:var(--gold-soft); font-weight:500; }
.about-who-copy > p:not(.page-kicker):not(.about-lede) { max-width: 58ch; margin: 0 0 1.45rem; color: rgba(250,249,246,.78); font-size: 1rem; line-height:1.78; }
.about-who-copy .about-thesis { margin:2rem 0; color:var(--gold-soft); font-size:clamp(1.25rem,2vw,1.6rem); font-style:italic; line-height:1.45; }
.about-who-copy .about-closing { color:var(--paper); font-size:clamp(1.1rem,1.5vw,1.3rem); font-weight:500; }
.about-education { margin-top:2.75rem; padding-top:1.5rem; border-top:1px solid rgba(250,249,246,.2); }
.about-education h3 { margin:0 0 .85rem; color:var(--paper); font-size:clamp(1.25rem,2vw,1.55rem); font-weight:400; letter-spacing:-.025em; line-height:1.2; }
.about-education p { margin:0; color:rgba(250,249,246,.68); font-size:.82rem; line-height:1.6; }
.about-education strong { display:block; margin-bottom:.3rem; color:rgba(250,249,246,.92); font-size:.94rem; font-weight:500; letter-spacing:-.01em; }
.about-education small { display:block; color:rgba(250,249,246,.58); font:inherit; }

.about-portrait { position:relative; isolation:isolate; justify-self:end; width:min(100%,440px); margin:0; }
.about-portrait::before { content:""; position:absolute; top:-9px; left:-9px; z-index:0; width:calc(100% - 1px); aspect-ratio:4 / 5; border:1px solid rgba(194,166,106,.34); pointer-events:none; }
.about-portrait::after { content:""; position:absolute; top:-9px; right:-9px; z-index:2; width:54px; height:1px; background:linear-gradient(90deg,transparent,var(--gold-soft)); pointer-events:none; }
.about-portrait-frame { position:relative; z-index:1; width:100%; aspect-ratio:4 / 5; overflow:hidden; border:1px solid rgba(250,249,246,.18); box-shadow:0 26px 70px rgba(3,2,3,.32); }
.about-portrait img { position:absolute; inset:0; width:100%; height:100%; max-width:none; object-fit:cover; object-position:center 44%; border:0; filter:none; }
.about-portrait figcaption { position:relative; z-index:1; margin-top:.85rem; color:var(--gold-soft); font-size:.6rem; font-weight:650; letter-spacing:.16em; text-transform:uppercase; }

.about-compact-details {
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr);
  gap:clamp(3rem,7vw,7rem);
  margin-top:clamp(5rem,9vw,8rem);
  padding-top:clamp(2rem,4vw,3rem);
}

.about-compact-section h2 { margin:0 0 1.15rem; font-size:clamp(1.85rem,3vw,2.8rem); font-weight:400; letter-spacing:-.045em; line-height:1; }
.about-compact-section p { margin:0; color:rgba(250,249,246,.76); font-size:1rem; line-height:1.72; }
.about-compact-section p + p { margin-top:1rem; }
.about-compact-education strong { display:block; color:rgba(250,249,246,.94); font-weight:500; }
.about-education-details {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0 2rem;
  margin:1.15rem 0;
  padding:0;
  border-top:1px solid rgba(194,166,106,.28);
}
.about-education-details > div { padding:.9rem 0 1rem; border-bottom:1px solid rgba(250,249,246,.13); }
.about-education-details dt { margin:0 0 .28rem; color:var(--gold-soft); font-size:.58rem; font-weight:650; letter-spacing:.16em; line-height:1.2; text-transform:uppercase; }
.about-education-details dd { margin:0; color:rgba(250,249,246,.9); font-size:.9rem; line-height:1.4; }
.about-education-details dd span { margin-left:.25rem; color:rgba(250,249,246,.55); font-size:.78em; white-space:nowrap; }

.about-background {
  display:grid;
  grid-template-columns:minmax(180px,.5fr) minmax(0,1.5fr);
  gap:clamp(3rem,8vw,7.5rem);
  margin-top:clamp(6rem,10vw,9rem);
  padding-top:clamp(2.5rem,4vw,3.75rem);
  border-top:1px solid rgba(250,249,246,.22);
}

.about-background > h2 { margin:0; font-size:clamp(2.6rem,4.2vw,4rem); font-weight:400; letter-spacing:-.045em; line-height:.95; }
.about-background-copy { max-width:760px; }
.about-background-copy > p { margin:0; color:rgba(250,249,246,.78); font-size:clamp(1rem,1.2vw,1.08rem); line-height:1.82; }
.about-background-copy > p + p { margin-top:1.75rem; }
.about-background .about-education { margin-top:2.75rem; }

.about-facts {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap:clamp(.7rem,1.4vw,1rem);
  margin-top:clamp(5rem,8vw,7rem);
}

.about-facts > div {
  position:relative;
  isolation:isolate;
  min-width:0;
  overflow:hidden;
  padding:1.65rem clamp(1.1rem,2.3vw,1.75rem) 1.75rem;
  border:1px solid rgba(255,255,255,.105);
  border-radius:18px;
  background:
    linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.025) 48%,rgba(194,166,106,.035)),
    rgba(255,255,255,.018);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.13),
    inset 0 -1px 0 rgba(255,255,255,.025),
    0 14px 34px rgba(18,0,7,.12);
  -webkit-backdrop-filter:blur(18px) saturate(135%);
  backdrop-filter:blur(18px) saturate(135%);
  transition:transform 220ms cubic-bezier(.22,1,.36,1),border-color 220ms ease,background-color 220ms ease,box-shadow 220ms ease;
}
.about-facts > div::before { content:""; position:absolute; inset:0; z-index:-1; background:radial-gradient(circle at 18% 0%,rgba(255,255,255,.12),transparent 42%); pointer-events:none; }
.about-facts > div::after { content:""; position:absolute; top:0; left:12%; width:52%; height:1px; background:linear-gradient(90deg,transparent,rgba(225,205,161,.7),transparent); opacity:.65; pointer-events:none; }
.about-facts > div:hover { transform:translateY(-3px); border-color:rgba(225,205,161,.22); background-color:rgba(255,255,255,.028); box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 18px 40px rgba(18,0,7,.18); }
.about-facts small { display:block; margin-bottom:.65rem; color:var(--gold-soft); font-size:.56rem; font-weight:700; letter-spacing:.14em; line-height:1.2; text-transform:uppercase; }
.about-facts strong { display:block; font-family:"Bodoni Moda",Didot,Georgia,serif; font-size:clamp(2.6rem,4.4vw,4.15rem); font-weight:400; font-variant-numeric:lining-nums tabular-nums; letter-spacing:-.045em; line-height:1; }
.about-facts span { display:block; max-width:25ch; margin-top:.7rem; color:rgba(250,249,246,.62); font-size:.7rem; font-weight:500; letter-spacing:.02em; line-height:1.45; }

.about-beliefs {
  position: relative;
  padding: clamp(5.5rem,10vw,9rem) 0 clamp(5rem,9vw,8rem);
  background:
    linear-gradient(to bottom, rgba(255,255,255,.42), transparent 34rem),
    var(--about-warm);
  color: var(--about-copy);
}

html[data-theme="dark"] .about-beliefs { background:linear-gradient(to bottom, rgba(101,28,44,.1), transparent 34rem),var(--about-warm); }

.about-beliefs-intro { max-width: 980px; margin:0 auto clamp(5rem,9vw,8rem); text-align:center; }
.about-quote-mark { display:block; height:3.6rem; color:var(--gold); font-family:Georgia,serif; font-size:5.5rem; line-height:1; }
.about-beliefs-intro blockquote { max-width:900px; margin:1.6rem auto; font-family:Georgia,"Times New Roman",serif; font-size:clamp(2.5rem,5.5vw,5.3rem); font-style:italic; letter-spacing:-.055em; line-height:.96; text-wrap:balance; }
.about-beliefs-intro p { max-width:42rem; margin:0 auto; color:var(--truffle); }

.about-principles { border-bottom:1px solid var(--line); }
.about-principle { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(300px,.86fr); gap:clamp(3rem,7vw,7rem); padding:clamp(2.6rem,5vw,4.5rem) 0; border-top:1px solid var(--line); }
.about-principle-heading { display:grid; grid-template-columns:clamp(64px,7vw,100px) 1fr; gap:clamp(1rem,3vw,2.5rem); align-items:start; padding:0; border:0; background:transparent; color:inherit; text-align:left; cursor:default; }
.about-principle-number { color:var(--gold); font-family:Georgia,serif; font-size:clamp(3.6rem,7vw,6.8rem); line-height:.78; text-align:center; }
.about-principle-title { font-family:Georgia,"Times New Roman",serif; font-size:clamp(2rem,3.8vw,3.7rem); letter-spacing:-.045em; line-height:.98; }
.about-principle-content { align-self:start; color:var(--truffle); }
.about-principle-content p { margin:0; max-width:48ch; }
.about-principle-plus { display:none; }

.about-manifesto {
  padding: clamp(6rem,11vw,10rem) 0;
  background:
    radial-gradient(circle at 50% 0%, rgba(184,155,94,.14), transparent 32%),
    linear-gradient(112deg, #080607 0%, #170a0e 28%, #36101b 58%, #12080c 84%, #080607 100%);
  color:var(--paper);
  text-align:center;
}

.about-manifesto .container { max-width:960px; }
.about-manifesto blockquote { margin:1.6rem auto 1.8rem; font-family:Georgia,"Times New Roman",serif; font-size:clamp(2.5rem,5.5vw,5.3rem); font-style:italic; letter-spacing:-.055em; line-height:.94; }
.about-manifesto p { margin:0 auto 2rem; color:rgba(250,249,246,.68); }

.about-page.has-reveal-motion .about-reveal { opacity:0; transform:translateY(24px); transition:opacity .8s cubic-bezier(.22,1,.36,1),transform .8s cubic-bezier(.22,1,.36,1); }
.about-page.has-reveal-motion .about-reveal.is-visible { opacity:1; transform:translateY(0); }
.about-page.has-reveal-motion .about-principle.about-reveal { transform:translateY(32px) scale(.99); transition-duration:.72s; }
.about-page.has-reveal-motion .about-principle.about-reveal.is-visible { transform:translateY(0) scale(1); }

@media (min-width: 980px) {
  .about-who {
    min-height:100vh;
    padding:clamp(3.75rem,5svh,4.75rem) 0 clamp(1.5rem,3svh,2.5rem);
  }

  .about-editorial {
    display:grid;
    min-height:calc(100svh - clamp(3.75rem,5svh,4.75rem) - clamp(1.5rem,3svh,2.5rem));
    grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr);
    grid-template-areas:
      "identity identity"
      "details portrait"
      "impact impact";
    column-gap:clamp(3.5rem,5.5vw,5.5rem);
    row-gap:clamp(1.1rem,2.2svh,1.8rem);
    align-content:space-between;
  }

  .about-who-grid { display:contents; }
  .about-who-copy { grid-area:identity; align-self:start; width:100%; max-width:none; }
  .about-who-copy h1 { margin:0 0 1.15rem; font-size:clamp(2.55rem,3.4vw,3.45rem); }
  .about-lede { max-width:none; margin-bottom:1rem; font-size:clamp(1.18rem,1.55vw,1.4rem); line-height:1.48; }
  .about-who-copy > p:not(.page-kicker):not(.about-lede) { max-width:none; margin:0; font-size:clamp(1.02rem,1.15vw,1.1rem); line-height:1.62; }
  .about-who-copy > p + p { margin-top:.8rem; }
  .about-who-copy > .about-thesis { margin:.85rem 0 0; color:var(--gold-soft); font-size:clamp(1.08rem,1.35vw,1.25rem); font-style:italic; line-height:1.5; }
  .about-who-copy > .about-closing { color:var(--paper); font-size:1.05rem; font-weight:500; }

  .about-portrait {
    grid-area:portrait;
    align-self:stretch;
    display:grid;
    grid-template-rows:minmax(0,1fr) auto;
    width:100%;
    max-width:440px;
  }
  .about-portrait-frame { height:100%; min-height:0; aspect-ratio:auto; }
  .about-portrait::before { height:calc(100% - 1.15rem); aspect-ratio:auto; }
  .about-portrait figcaption { margin-top:.6rem; font-size:.54rem; }

  .about-compact-details {
    grid-area:details;
    grid-template-columns:minmax(0,1fr);
    gap:clamp(1.75rem,3svh,2.75rem);
    margin:0;
    padding-top:.35rem;
  }

  .about-compact-section h2 { margin:0 0 .75rem; font-size:clamp(1.65rem,2.2vw,2.15rem); }
  .about-compact-section p { max-width:76ch; font-size:clamp(.96rem,1.05vw,1.03rem); line-height:1.58; }
  .about-compact-section p + p { margin-top:.75rem; }
  .about-compact-education strong { font-size:clamp(.96rem,1vw,1rem); line-height:1.5; }
  .about-education-details { margin:.9rem 0; }
  .about-education-details > div { padding:.7rem 0 .75rem; }
  .about-education-details dd { font-size:clamp(.86rem,.95vw,.94rem); }

  .about-background {
    grid-area:experience;
    grid-template-columns:minmax(170px,.42fr) minmax(0,1.58fr);
    gap:clamp(2.25rem,4vw,3.5rem);
    margin:0;
    padding-top:1.35rem;
  }

  .about-background > h2 { font-size:clamp(2rem,2.7vw,2.65rem); white-space:nowrap; }
  .about-background-copy { max-width:none; }
  .about-background-copy > p { font-size:.88rem; line-height:1.58; }
  .about-background-copy > p + p { margin-top:.8rem; }
  .about-background .about-education { margin-top:1rem; padding-top:.85rem; }
  .about-education { display:grid; grid-template-columns:90px minmax(0,1fr); gap:1rem; align-items:start; }
  .about-education h3 { margin:0; font-size:1rem; }
  .about-education p { font-size:.7rem; line-height:1.45; }
  .about-education strong { margin-bottom:.15rem; font-size:.78rem; }

  .about-facts {
    grid-area:impact;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:clamp(.55rem,1vw,.9rem);
    margin:0;
    padding:0;
  }

  .about-facts > div {
    display:block;
    padding:clamp(.85rem,1.7svh,1.15rem) clamp(.85rem,1.5vw,1.35rem);
  }

  .about-facts strong { font-size:clamp(2.25rem,3vw,3rem); }
  .about-facts span { margin-top:.45rem; font-size:.7rem; line-height:1.4; }

}

@media (min-width: 980px) and (max-height: 820px) {
  .about-who { padding-top:3.65rem; padding-bottom:1.15rem; }
  .about-editorial {
    min-height:calc(100svh - 4.8rem);
    row-gap:.65rem;
  }
  .about-who-copy h1 { margin-bottom:.65rem; font-size:2.45rem; }
  .about-lede { margin-bottom:.55rem; font-size:1.05rem; line-height:1.4; }
  .about-who-copy > p:not(.page-kicker):not(.about-lede) { font-size:.88rem; line-height:1.48; }
  .about-who-copy > p + p { margin-top:.45rem; }
  .about-who-copy > .about-thesis { margin-top:.45rem; font-size:1rem; line-height:1.4; }
  .about-portrait { width:100%; max-width:360px; }
  .about-compact-details { gap:1.35rem; padding-top:0; }
  .about-compact-section h2 { margin-bottom:.4rem; font-size:1.5rem; }
  .about-compact-section p { font-size:.78rem; line-height:1.45; }
  .about-compact-section p + p { margin-top:.45rem; }
  .about-compact-education strong { font-size:.78rem; }
  .about-education-details { margin:.55rem 0; }
  .about-education-details > div { padding:.42rem 0 .48rem; }
  .about-education-details dt { margin-bottom:.18rem; font-size:.5rem; }
  .about-education-details dd { font-size:.72rem; line-height:1.25; }
  .about-facts { padding:0; }
  .about-facts strong { font-size:2.05rem; }
  .about-facts span { margin-top:.25rem; font-size:.59rem; }
}

@media (max-width: 760px) {
  .about-opening-slogan { bottom:14%; flex-wrap:nowrap; gap:.3em; font-size:clamp(1.8rem,9vw,3rem); }
  .about-opening-name { top:calc(43% + 72px); }
  .about-opening-skip { top:calc(.8rem + env(safe-area-inset-top)); right:.8rem; }
  .about-opening-progress { bottom:calc(1.25rem + env(safe-area-inset-bottom)); }
  .about-mark-scene { top:43%; width:112px; }
  .about-who { padding-top:5.75rem; }
  .about-who-grid { grid-template-columns:1fr; gap:2rem; }
  .about-who-copy h1 { font-size:clamp(2.35rem,10vw,3.25rem); line-height:.94; }
  .about-who::before { top:18%; right:-52%; width:130vw; }
  .about-who::after { top:25%; right:-28%; width:88vw; }
  .about-portrait { justify-self:start; width:min(88vw,390px); margin:.75rem 0 0; }
  .about-background { grid-template-columns:1fr; gap:1.75rem; margin-top:4.5rem; padding-top:2rem; }
  .about-compact-details { grid-template-columns:1fr; gap:2.5rem; margin-top:4.5rem; padding-top:2rem; }
  .about-education-details { grid-template-columns:1fr; }
  .about-facts { grid-template-columns:1fr; }
  .about-facts > div,
  .about-facts > div + div { padding:1.35rem; }
  .about-beliefs-intro blockquote { font-size:clamp(1.9rem,9vw,2.4rem); }
  .about-principle { display:block; padding:0; }
  .about-principle-heading { position:relative; grid-template-columns:48px 1fr 20px; gap:1rem; align-items:center; width:100%; min-height:108px; cursor:pointer; }
  .about-principle-number { font-size:2.6rem; }
  .about-principle-title { font-size:1.7rem; }
  .about-principle-plus { position:relative; display:grid; place-items:center; width:16px; height:16px; }
  .about-principle-plus .lucide { width:16px; height:16px; }
  .about-principle-plus .lucide path:last-child { transition:opacity 180ms ease,transform 180ms ease; transform-origin:center; }
  .about-principle-heading[aria-expanded="true"] .about-principle-plus .lucide path:last-child { opacity:0; transform:scaleY(0); }
  .about-principle-content { max-height:0; overflow:hidden; opacity:0; transition:max-height .45s cubic-bezier(.22,1,.36,1),opacity .25s ease,padding .45s ease; }
  .about-principle-heading[aria-expanded="true"] + .about-principle-content { max-height:320px; padding:0 0 2rem 64px; opacity:1; }
}

@media (prefers-reduced-motion: reduce) {
  .about-opening { display:none; }
  .about-page.has-reveal-motion .about-reveal { opacity:1; transform:none; }
}

/* Writing — premium editorial system */
.writing-page {
  --writing-warm: #f7f5f0;
  --writing-copy: #171515;
  background: var(--writing-warm);
}

html[data-theme="dark"] .writing-page {
  --writing-warm: #0b0c0d;
  --writing-copy: #f1efea;
}

html[data-theme="light"] .writing-page[data-header-tone="dark"] .topbar > .icon-button,
html[data-theme="light"] .writing-page[data-header-tone="dark"] .topbar-actions .icon-button {
  color: #f3efe8;
}

html[data-theme="light"] .writing-page[data-header-tone="dark"] .topbar > .icon-button:hover,
html[data-theme="light"] .writing-page[data-header-tone="dark"] .topbar-actions .icon-button:hover { color: #d2b674; }

html[data-theme="light"] .writing-page[data-header-tone="light"] .topbar > .icon-button,
html[data-theme="light"] .writing-page[data-header-tone="light"] .topbar-actions .icon-button { color: #201e1c; }

.writing-page .page-main { padding-top: 0; }

.writing-page .writing-hero {
  position: relative;
  isolation: isolate;
  min-height: min(880px, 100svh);
  overflow: hidden;
  background:
    radial-gradient(ellipse at 76% 20%, rgba(194,166,106,.15), transparent 30%),
    radial-gradient(ellipse at 90% 76%, rgba(101,28,44,.38), transparent 32%),
    linear-gradient(112deg, #080607 0%, #170a0e 25%, #36101b 58%, #12080c 82%, #080607 100%);
  color: #faf9f6;
}

.writing-page .writing-hero::before,
.writing-page .writing-hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
}

.writing-page .writing-hero::before {
  top: -12%;
  right: -12%;
  width: min(76vw, 1080px);
  aspect-ratio: 1.55;
  border: 1px solid rgba(226,199,137,.18);
  border-radius: 50%;
  box-shadow:
    0 0 0 7.5rem rgba(226,199,137,.025),
    0 0 0 15rem rgba(250,249,246,.018);
  transform: rotate(17deg);
  animation: writing-orbit-drift 18s steps(180, end) infinite alternate;
}

.writing-page .writing-hero::after {
  inset: 0;
  opacity: .25;
  background-image: radial-gradient(circle, rgba(250,249,246,.42) .65px, transparent .75px);
  background-size: 48px 48px;
  -webkit-mask-image: linear-gradient(105deg, transparent 25%, #000 78%, transparent 100%);
  mask-image: linear-gradient(105deg, transparent 25%, #000 78%, transparent 100%);
}

@keyframes writing-orbit-drift {
  from { transform: rotate(17deg) translate3d(0, 0, 0); }
  to { transform: rotate(20deg) translate3d(-1.2%, 1.2%, 0); }
}

.writing-page .feature-story {
  position: relative;
  z-index: 1;
  min-height: min(880px, 100svh);
  grid-template-columns: minmax(150px,.48fr) minmax(0,1.52fr);
  align-items: end;
  gap: clamp(3rem,9vw,10rem);
  padding-top: clamp(9rem,16vh,12rem);
  padding-bottom: clamp(5rem,10vh,8rem);
}

.writing-page .feature-label {
  align-self: end;
  margin: 0 0 .8rem;
  color: #d2b674;
  letter-spacing: .2em;
}

.writing-page .feature-content { max-width: 980px; }

.writing-page .feature-content h1 {
  max-width: 10ch;
  margin: 0 0 2rem;
  font-family: "Bodoni Moda", Didot, "Iowan Old Style", Georgia, serif;
  font-size: clamp(4.2rem,8.4vw,8.8rem);
  font-weight: 400;
  letter-spacing: -.06em;
  line-height: .86;
  text-wrap: balance;
  text-shadow: 0 1px 0 rgba(255,255,255,.08);
}

.writing-page .feature-content > p {
  max-width: 58ch;
  margin: 0 0 2.2rem;
  color: rgba(250,249,246,.7);
  font-size: clamp(.96rem,1.3vw,1.08rem);
  line-height: 1.75;
}

.writing-page .writing-index {
  position: relative;
  isolation: isolate;
  padding-block: clamp(6rem,10vw,9rem);
  color: var(--writing-copy);
}

.writing-page .writing-index::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0 50%;
  width: 100vw;
  transform: translateX(-50%);
  background:
    linear-gradient(to bottom, rgba(255,255,255,.46), transparent 28rem),
    var(--writing-warm);
}

html[data-theme="dark"] .writing-page .writing-index::before {
  background:
    linear-gradient(to bottom, rgba(101,28,44,.1), transparent 28rem),
    var(--writing-warm);
}

.writing-page .writing-index-head {
  align-items: end;
  padding-bottom: clamp(2.2rem,4vw,3.5rem);
  border-bottom-color: var(--line);
}

.writing-page .writing-index-head .page-kicker {
  margin-bottom: 1rem;
  color: var(--gold);
  letter-spacing: .18em;
}

.writing-page .writing-index-head h2 {
  font-family: "Bodoni Moda", Didot, "Iowan Old Style", Georgia, serif;
  font-size: clamp(4rem,7.5vw,7.8rem);
  letter-spacing: -.06em;
  line-height: .84;
}

.writing-page .writing-index-head .inline-link { margin-bottom: .35rem; }

.writing-page .story-list { border-top-color: var(--line); }

.writing-page .story-row {
  position: relative;
  isolation: isolate;
  grid-template-columns: 118px minmax(0,1.35fr) minmax(240px,.8fr) 24px;
  gap: clamp(1.5rem,3.4vw,3.5rem);
  align-items: start;
  padding-block: clamp(2rem,3.4vw,2.8rem);
  border-bottom-color: var(--line);
}

.writing-page .story-row::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: rgba(101,28,44,.045);
  opacity: 0;
  transition: opacity 180ms ease;
}

html[data-theme="dark"] .writing-page .story-row::before { background: rgba(194,166,106,.055); }

.writing-page .story-row:hover::before { opacity: 1; }

.writing-page .story-meta {
  padding-top: .28rem;
  color: var(--gold);
  font-size: .61rem;
  font-weight: 650;
  letter-spacing: .13em;
  line-height: 1.5;
}

.writing-page .story-row h3 {
  margin: 0;
  font-family: "Bodoni Moda", Didot, "Iowan Old Style", Georgia, serif;
  font-size: clamp(1.85rem,3.25vw,3.35rem);
  font-weight: 400;
  letter-spacing: -.045em;
  line-height: .98;
  text-wrap: balance;
  transition: color 180ms ease, transform 220ms cubic-bezier(.22,1,.36,1);
}

.writing-page .story-row p {
  max-width: 46ch;
  margin: 0;
  color: var(--truffle);
  font-size: .86rem;
  line-height: 1.68;
}

.writing-page .story-row .row-arrow {
  width: 18px;
  height: 18px;
  margin-top: .25rem;
  color: var(--truffle);
  transition: color 180ms ease, transform 220ms cubic-bezier(.22,1,.36,1);
}

.writing-page .story-row:hover h3 {
  color: #651c2c;
  transform: translateX(.3rem);
}

.writing-page .story-row:hover .row-arrow {
  color: var(--gold);
  transform: translate(3px,-3px);
}

html[data-theme="dark"] .writing-page .story-row:hover h3 { color: #d2b674; }

.writing-page .subscribe-band {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding-block: clamp(6rem,11vw,10rem);
  border-top: 0;
  background:
    radial-gradient(ellipse at 18% 10%, rgba(194,166,106,.13), transparent 28%),
    radial-gradient(ellipse at 84% 84%, rgba(101,28,44,.3), transparent 32%),
    linear-gradient(112deg, #080607 0%, #170a0e 28%, #36101b 58%, #12080c 84%, #080607 100%);
  color: #faf9f6;
}

.writing-page .subscribe-band::after {
  content: "";
  position: absolute;
  right: -12%;
  bottom: -52%;
  z-index: -1;
  width: min(66vw, 900px);
  aspect-ratio: 1.7;
  border: 1px solid rgba(226,199,137,.14);
  border-radius: 50%;
  transform: rotate(-16deg);
}

.writing-page .subscribe-band .page-kicker {
  color: #d2b674;
  letter-spacing: .19em;
}

.writing-page .subscribe-band .split-heading {
  position: relative;
  grid-template-columns: minmax(150px,.56fr) minmax(0,1.44fr);
  padding-block: clamp(2.5rem,5vw,4.5rem);
  border-top: 1px solid rgba(226,199,137,.28);
  border-bottom: 1px solid rgba(250,249,246,.14);
}

.writing-page .subscribe-band .split-heading h2 {
  max-width: 11ch;
  margin-top: 0;
  font-family: "Bodoni Moda", Didot, "Iowan Old Style", Georgia, serif;
  font-size: clamp(3rem,6vw,6rem);
  font-weight: 400;
  letter-spacing: -.055em;
  line-height: .92;
  text-wrap: balance;
}

.writing-page .subscribe-band .subscribe-footer {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: clamp(2rem,5vw,5rem);
  max-width: 820px;
  margin-top: clamp(2.5rem,4vw,4rem);
  padding-top: clamp(1.5rem,2.5vw,2.2rem);
  border-top: 1px solid rgba(250,249,246,.16);
}

.writing-page .subscribe-band .subscribe-footer p {
  max-width: 55ch;
  margin: 0;
  color: rgba(250,249,246,.68);
  font-size: clamp(.96rem,1.3vw,1.08rem);
  line-height: 1.7;
}

.writing-page .subscribe-band .subscribe-footer .inline-link {
  flex: 0 0 auto;
  color: #e2c789;
  white-space: nowrap;
}

@media (max-width: 900px) {
  .writing-page .feature-story { grid-template-columns: 1fr; align-content: end; gap: 2rem; }
  .writing-page .feature-label { align-self: auto; }
  .writing-page .story-row { grid-template-columns: 96px minmax(0,1fr) 22px; }
  .writing-page .story-row p { grid-column: 2; }
  .writing-page .subscribe-band .split-heading { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .writing-page .writing-hero,
  .writing-page .feature-story { min-height: 100svh; }
  .writing-page .feature-story { padding-top: 8rem; padding-bottom: 4rem; }
  .writing-page .feature-content h1 { font-size: clamp(3.7rem,17vw,5.8rem); }
  .writing-page .writing-hero::before { top: 5%; right: -58%; width: 138vw; }
  .writing-page .writing-index-head { gap: 2rem; }
  .writing-page .story-row { grid-template-columns: 1fr 22px; gap: .85rem 1rem; }
  .writing-page .story-meta,
  .writing-page .story-row h3,
  .writing-page .story-row p { grid-column: 1; }
  .writing-page .story-row .row-arrow { grid-column: 2; grid-row: 2; }
  .writing-page .story-row:hover h3 { transform: none; }
  .writing-page .subscribe-band .split-heading { gap: 2.2rem; }
  .writing-page .subscribe-band .subscribe-footer { align-items: start; flex-direction: column; gap: 1.75rem; }
}

@media (prefers-reduced-motion: reduce) {
  .writing-page .writing-hero::before { animation: none; }
  .writing-page .story-row h3,
  .writing-page .story-row .row-arrow { transition: none; }
}

/* Full-screen mobile navigation */
html.menu-open { overflow: hidden; }

@media (max-width: 760px) {
  .menu-overlay {
    background: #0b0c0d;
    opacity: 1;
    transition: visibility 0s linear 420ms;
  }

  .menu-overlay.is-open {
    transition-delay: 0s;
  }

  .menu-drawer,
  .menu-overlay.is-open .menu-drawer {
    inset: 0;
    width: 100%;
    height: 100%;
    min-height: 100dvh;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  .menu-drawer {
    overflow: hidden;
    background-color: #0b0c0d;
    background-image:
      radial-gradient(ellipse at 110% -8%, rgba(194,166,106,.2), transparent 39%),
      radial-gradient(ellipse at -16% 44%, rgba(101,28,44,.3), transparent 47%),
      linear-gradient(145deg, #171417 0%, #0c0d0f 48%, #070809 100%);
    color: rgba(250,249,246,.68);
    transform: translateX(-100%);
    transition: transform 420ms cubic-bezier(.76,0,.24,1);
  }

  .menu-drawer::before {
    content: "";
    position: absolute;
    right: -58%;
    bottom: -9%;
    width: 132vw;
    aspect-ratio: 1.7;
    border: 1px solid rgba(226,199,137,.13);
    border-radius: 50%;
    box-shadow: inset 0 0 80px rgba(184,155,94,.035), 0 0 70px rgba(101,28,44,.08);
    pointer-events: none;
    transform: rotate(-17deg);
  }

  .menu-overlay.is-open .menu-drawer {
    transform: translateX(0);
  }

  .menu-drawer nav {
    height: 100%;
    min-height: 100dvh;
  }

  .drawer-close {
    top: calc(1.15rem + env(safe-area-inset-top));
    right: 1.15rem;
    width: 44px;
    height: 44px;
    border: 1px solid #303136;
    border-radius: 50%;
    background: linear-gradient(145deg, #25262a, #0c0d0e);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.1), inset 0 -1px 0 rgba(0,0,0,.72), 0 7px 18px rgba(0,0,0,.24);
    color: var(--hardware-ink);
  }

  .drawer-close:hover {
    border-color: rgba(194,166,106,.55);
    background: linear-gradient(145deg, #2c2d31, #111214);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 0 0 3px rgba(8,9,10,.72), 0 0 0 4px rgba(194,166,106,.3);
  }

  .menu-panel {
    padding:
      calc(1rem + env(safe-area-inset-top))
      clamp(1.25rem,5vw,2rem)
      calc(1.25rem + env(safe-area-inset-bottom));
    overscroll-behavior: contain;
  }

  .menu-identity {
    min-height: 64px;
    padding: 0 4.5rem 0 0;
    border: 0;
  }

  .brand-seal.menu-brand-seal {
    width: 46px;
    height: 46px;
    flex-basis: 46px;
  }

  .menu-person .brand-name {
    color: var(--paper);
    font-size: .92rem;
    font-weight: 600;
    letter-spacing: -.02em;
    line-height: 1.05;
  }

  .menu-list {
    gap: .65rem;
    margin: clamp(3.5rem,10vh,6rem) 0 2rem;
  }

  .menu-link,
  .submenu-trigger {
    min-height: 70px;
    justify-content: flex-start;
    gap: 1rem;
    padding: 1rem 1.05rem;
    border: 1px solid #2d2e32;
    border-radius: 15px;
    background: linear-gradient(145deg, rgba(35,36,40,.9), rgba(12,13,14,.88));
    color: rgba(250,249,246,.9);
    font-size: clamp(1.85rem,9vw,2.55rem);
    font-weight: 400;
    letter-spacing: -.055em;
    line-height: 1;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.075), inset 0 -1px 0 rgba(0,0,0,.65), 0 8px 22px rgba(0,0,0,.13);
    transition: transform 170ms ease, color 170ms ease, border-color 170ms ease, box-shadow 170ms ease;
  }

  .menu-link > .lucide,
  .submenu-trigger > .lucide {
    display: block;
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    opacity: .76;
    stroke-width: 1.55;
  }

  .menu-link::after,
  .submenu-trigger::after {
    content: none;
  }

  .menu-link:hover,
  .submenu-trigger:hover {
    border-color: rgba(194,166,106,.5);
    background: linear-gradient(145deg, #292a2e, #111214);
    color: var(--paper);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 9px 24px rgba(0,0,0,.2);
    transform: translateX(2px);
  }

  .menu-link[aria-current="page"] {
    border-color: transparent;
    background: linear-gradient(145deg, #222327, #0d0e0f) padding-box, var(--hardware-gold) border-box;
    color: var(--gold-soft);
    box-shadow: 0 0 0 3px rgba(8,9,10,.76), 0 0 0 4px rgba(194,166,106,.32), inset 0 1px 0 rgba(255,255,255,.1), 0 9px 24px rgba(0,0,0,.2);
  }

  .menu-footer {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    align-items: center;
    justify-items: center;
    gap: 0;
    margin-top: auto;
    padding: 1.1rem 0 0;
    border-top: 1px solid rgba(250,249,246,.14);
  }

  .menu-footer::before {
    content: none;
  }

  .menu-theme-button {
    flex: 0 0 clamp(38px,10vw,42px);
    width: clamp(38px,10vw,42px);
    height: clamp(38px,10vw,42px);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid #2d2e32;
    border-radius: 50%;
    background: linear-gradient(145deg, #202124, #0d0e0f);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.09), inset 0 -1px 0 rgba(0,0,0,.7), 0 5px 14px rgba(0,0,0,.16);
  }

  .menu-theme-button::after {
    content: none;
  }

  .menu-socials {
    grid-column: 2 / -1;
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    justify-items: center;
    gap: 0;
    padding: 0;
  }

  .menu-socials .social-circle {
    width: clamp(38px,10vw,42px);
    height: clamp(38px,10vw,42px);
    border-radius: 50%;
    border-color: #2d2e32;
    background: linear-gradient(145deg, #202124, #0d0e0f);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.09), inset 0 -1px 0 rgba(0,0,0,.7), 0 5px 14px rgba(0,0,0,.16);
  }

  html[data-theme="light"] .menu-overlay {
    background: #f4f5f4;
  }

  html[data-theme="light"] .menu-drawer,
  html[data-theme="light"] .menu-overlay.is-open .menu-drawer {
    background-color: #f7f5f0;
    background-image:
      radial-gradient(ellipse at 108% -6%, rgba(184,155,94,.2), transparent 41%),
      radial-gradient(ellipse at -18% 42%, rgba(101,28,44,.09), transparent 48%),
      linear-gradient(145deg, #fffdf9 0%, #f5f2ec 52%, #ece8e0 100%);
    color: #686d69;
    box-shadow: none;
  }

  html[data-theme="light"] .menu-drawer::before {
    border-color: rgba(160,123,53,.16);
    box-shadow: inset 0 0 80px rgba(184,155,94,.05), 0 0 70px rgba(101,28,44,.04);
  }

  html[data-theme="light"] .drawer-close {
    border-color: #cbc6bd;
    background: linear-gradient(145deg, #fffdf9, #dedad2);
    color: #5f5b55;
    box-shadow: inset 0 1px 0 #ffffff, inset 0 -1px 0 rgba(17,17,17,.13), 0 5px 14px rgba(45,38,31,.1);
  }

  html[data-theme="light"] .menu-person .brand-name { color: #1d1c1a; }

  html[data-theme="light"] .menu-link,
  html[data-theme="light"] .submenu-trigger {
    border-color: #cbc6bd;
    background: linear-gradient(145deg, rgba(255,253,249,.94), rgba(222,218,210,.9));
    color: #1d1c1a;
    box-shadow: inset 0 1px 0 #ffffff, inset 0 -1px 0 rgba(17,17,17,.13), 0 8px 22px rgba(45,38,31,.1);
  }

  html[data-theme="light"] .menu-link:not([aria-current="page"]):hover,
  html[data-theme="light"] .submenu-trigger:hover {
    border-color: #cbc6bd;
    background: linear-gradient(145deg, #fffdf9, #dedad2);
    color: #1d1c1a;
    box-shadow: inset 0 1px 0 #ffffff, 0 5px 14px rgba(45,38,31,.08);
  }

  html[data-theme="light"] .menu-link[aria-current="page"] {
    border-color: transparent;
    background: linear-gradient(145deg, #fffdf9, #dedad2) padding-box, var(--hardware-gold) border-box;
    color: #111111;
    box-shadow: 0 0 0 3px rgba(240,237,230,.92), 0 0 0 4px rgba(160,123,53,.42), inset 0 1px 0 #ffffff;
  }

  html[data-theme="light"] .menu-footer {
    border-color: rgba(17,17,17,.12);
  }

  html[data-theme="light"] .menu-footer::before {
    color: #6d716e;
  }

  html[data-theme="light"] .menu-theme-button,
  html[data-theme="light"] .menu-socials .social-circle {
    border-color: #cbc6bd;
    background: linear-gradient(145deg, #fffdf9, #dedad2);
    color: #5f5b55;
    box-shadow: inset 0 1px 0 #ffffff, inset 0 -1px 0 rgba(17,17,17,.13), 0 5px 14px rgba(45,38,31,.1);
  }

  html[data-theme="light"] .drawer-close:hover {
    border-color: rgba(160,123,53,.62);
    background: linear-gradient(145deg, #fffdf9, #e5e0d7);
    color: #111111;
    box-shadow: inset 0 1px 0 #ffffff, 0 0 0 3px rgba(250,249,246,.75), 0 0 0 4px rgba(184,155,94,.28);
  }
}

@media (max-width: 760px) and (prefers-reduced-motion: reduce) {
  .menu-drawer { transition: none; }
}

@media (max-width: 760px) {
  .home-page .search-input-wrap,
  .home-page .search-results {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }

  .profile-silhouette {
    position: relative;
    top: auto;
    right: auto;
    left: auto;
    grid-row: 1;
    align-self: center;
    justify-self: center;
    width: auto;
    height: min(96vw, 100%, 480px);
    translate: none;
    opacity: .64;
  }

  html[data-theme="dark"] .profile-silhouette { opacity: .78; }

  /* Keep the portrait alive while avoiding continuous compositing of four
     large, blurred layers behind it on thermally constrained displays. */
  .home-page .hero-atmosphere::before,
  .home-page .light-band,
  .profile-silhouette::before,
  .profile-silhouette-halo {
    animation: none;
    will-change: auto;
  }

  .home-page .light-band {
    filter: none;
    opacity: .12;
  }

  .home-page .hero-content {
    grid-row: 2;
    width: 100%;
    padding-top: 0;
    text-align: center;
  }

  .home-page .hero-title.hero-title-image,
  .home-page .hero-name-wordmark { margin-inline: auto; }

  .home-page .hero-name-wordmark { width: min(100%, 340px); }

  .home-page .hero-support {
    align-items: center;
    justify-content: center;
  }

  .home-page .hero-link { justify-content: center; }
}

@media (pointer: coarse), (update: slow), (prefers-reduced-data: reduce) {
  .home-page .hero-atmosphere::before,
  .home-page .light-band,
  .profile-silhouette::before,
  .profile-silhouette-halo {
    animation: none;
    will-change: auto;
  }

  .projects-signal span,
  .writing-page .writing-hero::before,
  .hero-signal .lucide,
  .hero-title:not(.hero-title-image) {
    animation: none;
  }
}

/* Pause decorative animation clocks when their region is outside the viewport
   or the page is backgrounded. This releases compositor work without changing
   the animation's visible state when the user returns. */
html.is-page-motion-paused .hero-atmosphere::before,
html.is-page-motion-paused .light-band,
html.is-page-motion-paused .profile-silhouette::before,
html.is-page-motion-paused .profile-silhouette-halo,
html.is-page-motion-paused .hero-signal .lucide,
html.is-page-motion-paused .projects-signal span,
html.is-page-motion-paused .writing-page .writing-hero::before,
.home-hero.is-motion-paused .hero-atmosphere::before,
.home-hero.is-motion-paused .light-band,
.home-hero.is-motion-paused .profile-silhouette::before,
.home-hero.is-motion-paused .profile-silhouette-halo,
.home-hero.is-motion-paused .hero-signal .lucide,
.projects-hero.is-motion-paused .projects-signal span,
.writing-hero.is-motion-paused::before {
  animation-play-state: paused !important;
}

@media (prefers-reduced-motion: reduce) {
  .profile-silhouette,
  .profile-silhouette::before,
  .profile-silhouette-halo { animation: none !important; }
  .profile-silhouette { opacity: .94; transform: none; }
}

html[data-theme="light"] .profile-silhouette {
  opacity: .9;
}

html[data-theme="light"] .profile-silhouette-art {
  filter: drop-shadow(0 28px 46px rgba(76, 20, 33, .16));
}

html[data-theme="light"] .profile-silhouette::before {
  opacity: .42;
  filter: blur(22px);
}

html[data-theme="light"] .profile-silhouette-halo {
  background: radial-gradient(circle, rgba(101, 28, 44, .09) 0, rgba(184, 155, 94, .09) 36%, transparent 71%);
}

/* Project case study */
.case-page {
  --case-warm: #f7f5f0;
  --case-copy: #171515;
  background: var(--case-warm);
  color: var(--case-copy);
}

html[data-theme="dark"] .case-page {
  --case-warm: #0b0c0d;
  --case-copy: #f1efea;
}

html[data-theme="light"] .case-page[data-header-tone="dark"] .topbar > .icon-button,
html[data-theme="light"] .case-page[data-header-tone="dark"] .topbar-actions .icon-button { color: #f3efe8; }
html[data-theme="light"] .case-page[data-header-tone="light"] .topbar > .icon-button,
html[data-theme="light"] .case-page[data-header-tone="light"] .topbar-actions .icon-button { color: #201e1c; }

.case-main { padding-top: 0; }
.case-hero {
  position: relative;
  isolation: isolate;
  min-height: min(920px,100svh);
  overflow: hidden;
  background:
    radial-gradient(ellipse at 82% 20%,rgba(73,117,196,.2),transparent 29%),
    radial-gradient(ellipse at 76% 76%,rgba(101,28,44,.38),transparent 33%),
    linear-gradient(118deg,#07080b 0%,#10182c 36%,#271019 76%,#090708 100%);
  color: #faf9f6;
}

.case-hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  opacity: .22;
  background-image: radial-gradient(circle,rgba(250,249,246,.36) .7px,transparent .8px);
  background-size: 44px 44px;
  -webkit-mask-image: linear-gradient(105deg,transparent 20%,#000 86%);
  mask-image: linear-gradient(105deg,transparent 20%,#000 86%);
}

.case-hero-inner {
  position: relative;
  min-height: min(920px,100svh);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding-top: clamp(6rem,13vh,9rem);
  padding-bottom: clamp(4rem,9vh,7rem);
}

.case-back { position: relative; z-index: 2; display: inline-flex; align-items: center; gap: .6rem; align-self: flex-start; color: rgba(250,249,246,.62); font-size: .66rem; font-weight: 650; letter-spacing: .1em; text-transform: uppercase; }
.case-back .lucide { width: 15px; height: 15px; transition: transform 180ms ease; }
.case-back:hover { color: #d2b674; }
.case-back:hover .lucide { transform: translateX(-3px); }
.case-hero-grid { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0,1.42fr) minmax(280px,.58fr); gap: clamp(3rem,8vw,9rem); align-items: end; }
.case-hero-grid .page-kicker { margin-bottom: 1.8rem; color: #d2b674; letter-spacing: .2em; }
.case-hero h1 { margin: 0; font-family: "Bodoni Moda",Didot,Georgia,serif; font-size: clamp(4rem,8.6vw,9rem); font-weight: 400; letter-spacing: -.065em; line-height: .8; text-wrap: balance; }
.case-hero h1 em { color: #d2b674; font-style: italic; }
.case-hero-summary > p { max-width: 38ch; margin: 0 0 2.5rem; color: rgba(250,249,246,.72); font-family: Georgia,serif; font-size: clamp(1.1rem,1.7vw,1.45rem); line-height: 1.48; }
.case-hero-summary dl { margin: 0; border-top: 1px solid rgba(250,249,246,.2); }
.case-hero-summary dl > div { display: grid; grid-template-columns: 82px 1fr; gap: 1rem; padding: .8rem 0; border-bottom: 1px solid rgba(250,249,246,.14); }
.case-hero-summary dt { color: #d2b674; font-size: .54rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.case-hero-summary dd { margin: 0; color: rgba(250,249,246,.68); font-size: .72rem; }

.case-hero-art { position: absolute; z-index: 1; top: 5%; right: -16%; width: min(68vw,920px); aspect-ratio: 1; opacity: .7; pointer-events: none; }
.case-orbit { position: absolute; top: 50%; left: 50%; border: 1px solid rgba(91,139,221,.28); border-radius: 50%; transform: translate(-50%,-50%) rotate(-18deg); }
.case-orbit-one { width: 82%; height: 50%; }
.case-orbit-two { width: 55%; height: 88%; border-color: rgba(210,182,116,.2); transform: translate(-50%,-50%) rotate(37deg); }
.case-node { position: absolute; width: 9px; height: 9px; border-radius: 50%; background: #d2b674; box-shadow: 0 0 0 8px rgba(210,182,116,.08),0 0 28px rgba(210,182,116,.45); }
.case-node-one { top: 29%; left: 18%; }.case-node-two { top: 62%; left: 69%; }.case-node-three { top: 39%; left: 76%; background: #5b8bdd; }

.case-overview,.case-flow,.case-evidence,.case-gallery { background: var(--case-warm); color: var(--case-copy); }
.case-overview { padding-block: clamp(6rem,11vw,11rem); }
.case-overview-grid { display: grid; grid-template-columns: minmax(130px,.42fr) minmax(0,1.58fr); gap: clamp(3rem,9vw,10rem); }
.case-overview .page-kicker,.case-section-head .page-kicker { padding-top: .65rem; color: var(--gold); letter-spacing: .18em; }
.case-overview h2,.case-section-head h2,.case-ethics h2 { margin: 0; font-family: "Bodoni Moda",Didot,Georgia,serif; font-size: clamp(3.1rem,6.6vw,6.8rem); font-weight: 400; letter-spacing: -.055em; line-height: .9; text-wrap: balance; }
.case-overview h2 { max-width: 12ch; }
.case-overview .case-lede { max-width: 56ch; margin: 2.5rem 0 1.4rem; font-family: Georgia,serif; font-size: clamp(1.3rem,2vw,1.75rem); line-height: 1.48; }
.case-overview .case-lede + p { max-width: 66ch; margin: 0; color: var(--truffle); line-height: 1.8; }

.case-model { position: relative; isolation: isolate; padding-block: clamp(6rem,11vw,10rem); overflow: hidden; background: linear-gradient(125deg,#08090c,#131b2c 45%,#241017); color: #faf9f6; }
.case-model::after { content: ""; position: absolute; z-index: -1; inset: 0; opacity: .16; background-image: linear-gradient(rgba(250,249,246,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(250,249,246,.12) 1px,transparent 1px); background-size: 64px 64px; }
.case-section-head { display: grid; grid-template-columns: minmax(130px,.42fr) minmax(0,1.58fr); gap: clamp(3rem,9vw,10rem); align-items: start; margin-bottom: clamp(4rem,7vw,7rem); }
.case-model .case-section-head .page-kicker { color: #d2b674; }
.case-model .case-section-head h2 { color: #faf9f6; }
.case-model-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); border-top: 1px solid rgba(250,249,246,.18); border-left: 1px solid rgba(250,249,246,.18); }
.case-model-card { padding: clamp(2rem,4vw,4rem); border-right: 1px solid rgba(250,249,246,.18); border-bottom: 1px solid rgba(250,249,246,.18); }
.case-model-number { color: #d2b674; font-family: "Bodoni Moda",Georgia,serif; font-size: 1.1rem; }
.case-model-label { margin: 2.6rem 0 .8rem; color: #7ea7e8; font-size: .6rem; font-weight: 680; letter-spacing: .14em; text-transform: uppercase; }
.case-model-card h3 { margin: 0 0 1.6rem; font-family: "Bodoni Moda",Georgia,serif; font-size: clamp(2.6rem,4.8vw,4.8rem); font-weight: 400; letter-spacing: -.045em; line-height: .94; }
.case-model-card > p:not(.case-model-label) { max-width: 57ch; margin: 0; color: rgba(250,249,246,.66); font-size: .9rem; line-height: 1.75; }
.case-model-card ul { display: grid; gap: .7rem; margin: 2rem 0 0; padding: 1.6rem 0 0; border-top: 1px solid rgba(250,249,246,.15); list-style: none; }
.case-model-card li { position: relative; padding-left: 1.15rem; color: rgba(250,249,246,.78); font-size: .76rem; }
.case-model-card li::before { content: ""; position: absolute; top: .62em; left: 0; width: 5px; height: 5px; border-radius: 50%; background: #d2b674; }

.case-flow { padding-block: clamp(6rem,11vw,10rem); }
.case-flow-list { margin: 0; padding: 0; border-top: 1px solid var(--line); list-style: none; }
.case-flow-list li { display: grid; grid-template-columns: 100px minmax(0,1fr); gap: clamp(1.5rem,4vw,4rem); padding-block: clamp(2rem,4vw,3.2rem); border-bottom: 1px solid var(--line); }
.case-flow-list > li > span { color: var(--gold); font-family: "Bodoni Moda",Georgia,serif; font-size: clamp(2.4rem,4vw,4rem); line-height: 1; }
.case-flow-list h3 { margin: 0 0 .65rem; font-family: "Bodoni Moda",Georgia,serif; font-size: clamp(2rem,3.5vw,3.5rem); font-weight: 400; letter-spacing: -.04em; line-height: 1; }
.case-flow-list p { max-width: 62ch; margin: 0; color: var(--truffle); font-size: .9rem; line-height: 1.7; }

.case-evidence { padding-block: clamp(6rem,10vw,9rem); border-top: 1px solid var(--line); }
.case-evidence-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: clamp(2rem,4vw,4rem); }
.case-evidence figure { margin: 0; }
.case-evidence img { width: 100%; aspect-ratio: 16/9; object-fit: contain; background: #fff; border: 1px solid var(--line); box-shadow: 0 20px 50px rgba(15,10,11,.11); }
.case-evidence figcaption,.case-gallery figcaption { margin-top: .8rem; color: var(--truffle); font-size: .62rem; letter-spacing: .06em; }

.case-ethics { position: relative; isolation: isolate; overflow: hidden; padding-block: clamp(7rem,12vw,11rem); background: linear-gradient(120deg,#13090d,#4c1421 62%,#170a0f); color: #faf9f6; }
.case-ethics::after { content: ""; position: absolute; z-index: -1; top: -50%; right: -15%; width: min(65vw,900px); aspect-ratio: 1; border: 1px solid rgba(210,182,116,.17); border-radius: 50%; box-shadow: 0 0 0 8rem rgba(210,182,116,.02),0 0 0 16rem rgba(250,249,246,.012); }
.case-ethics-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(340px,.78fr); gap: clamp(4rem,9vw,10rem); }
.case-ethics .page-kicker { margin-bottom: 1.25rem; color: #d2b674; }
.case-ethics h2 { max-width: 9ch; }
.case-ethics-grid > div:last-child > p { max-width: 48ch; margin: .4rem 0 2rem; color: rgba(250,249,246,.7); font-family: Georgia,serif; font-size: 1.15rem; line-height: 1.55; }
.case-ethics ul { margin: 0; padding: 0; border-top: 1px solid rgba(250,249,246,.2); list-style: none; }
.case-ethics li { padding: 1.15rem 0; border-bottom: 1px solid rgba(250,249,246,.15); color: rgba(250,249,246,.63); font-size: .82rem; line-height: 1.65; }
.case-ethics strong { color: #faf9f6; font-weight: 590; }

.case-gallery { padding-block: clamp(6rem,10vw,9rem); overflow: hidden; }
.case-gallery-track { display: grid; grid-auto-flow: column; grid-auto-columns: min(78vw,860px); gap: clamp(1.2rem,3vw,2.6rem); width: 100vw; margin-left: max(0px,calc((100vw - min(var(--max),100vw)) / -2)); padding: 0 var(--pad) 1.5rem; overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: x mandatory; scrollbar-color: var(--gold) transparent; }
.case-gallery-track figure { margin: 0; scroll-snap-align: start; }
.case-gallery-track img { width: 100%; aspect-ratio: 16/9; object-fit: contain; background: #fff; border: 1px solid var(--line); }

.case-next { padding-block: clamp(4rem,7vw,6rem); background: #0b0c0d; color: #faf9f6; }
.case-next .container { display: flex; justify-content: space-between; gap: 2rem; align-items: center; }
.case-next .page-kicker { color: #d2b674; }
.case-next a { display: inline-flex; gap: 1rem; align-items: center; font-family: "Bodoni Moda",Georgia,serif; font-size: clamp(2rem,4vw,4rem); letter-spacing: -.04em; line-height: 1; }
.case-next a .lucide { width: .8em; height: .8em; transition: transform 180ms ease; }
.case-next a:hover { color: #d2b674; }.case-next a:hover .lucide { transform: translateX(5px); }

@media (max-width: 900px) {
  .case-hero-grid,.case-overview-grid,.case-section-head,.case-ethics-grid { grid-template-columns: 1fr; }
  .case-hero-grid { gap: 3rem; }
  .case-hero-summary { max-width: 580px; }
  .case-overview-grid,.case-section-head { gap: 1.5rem; }
  .case-model-grid { grid-template-columns: 1fr; }
  .case-evidence-grid { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .case-hero-inner { min-height: 100svh; }
  .case-hero h1 { font-size: clamp(3.7rem,18vw,6rem); }
  .case-hero-art { top: 0; right: -66%; width: 150vw; opacity: .48; }
  .case-overview h2,.case-section-head h2,.case-ethics h2 { font-size: clamp(2.8rem,13vw,4.6rem); }
  .case-flow-list li { grid-template-columns: 55px 1fr; }
  .case-gallery-track { grid-auto-columns: 88vw; }
  .case-next .container { align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  .case-gallery-track { scroll-behavior: auto; }
}