/* ─── Modern homepage ───────────*
 * Black-and-white editorial composition for the homepage only. Every rule is
 * scoped to [data-theme="modern"] and to the .home-modern composition (or a
 * page that contains it), so Classic and every other page are untouched.
 * Fonts are self-hosted from app/assets/fonts (SIL OFL 1.1, licences beside
 * the files) and only download when a rule here uses them. */

@font-face { font-family: "Basteleur"; src: url("/assets/basteleur-bold-e5680b03.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Basteleur"; src: url("/assets/basteleur-moonlight-af4e53f5.woff2") format("woff2"); font-weight: 300; font-display: swap; }
@font-face { font-family: "Sporting Grotesque"; src: url("/assets/sporting-grotesque-regular-7af31b4e.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Sporting Grotesque"; src: url("/assets/sporting-grotesque-bold-1a5117c6.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Instrument Sans"; src: url("/assets/instrument-sans-latin-400-normal-bd21e1f0.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Instrument Sans"; src: url("/assets/instrument-sans-latin-400-italic-89614dce.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Instrument Sans"; src: url("/assets/instrument-sans-latin-600-normal-a075817c.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("/assets/ibm-plex-mono-latin-400-normal-d803141a.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("/assets/ibm-plex-mono-latin-500-normal-3f7bbac1.woff2") format("woff2"); font-weight: 500; font-display: swap; }

/* Each theme hides the other's homepage markup. */
[data-theme="classic"] .home-modern { display: none; }
[data-theme="modern"] main:has(> .home-modern) > :not(.home-modern) { display: none; }

/* ─── Homepage aliases for the shared Modern tokens (tokens.css) ─── */
[data-theme="modern"]:has(.home-modern) {
  --mh-display: var(--font-display);
  --mh-editorial: var(--font-editorial);
  --mh-ease: var(--ease-editorial);
  --mh-gutter: var(--gutter);
}

[data-theme="modern"]:has(.home-modern) .site-footer { margin-top: 0; }

/* Full-bleed: the composition measures off the viewport, not the container. */
[data-theme="modern"] main:has(> .home-modern) { max-width: none; padding: 0; }

[data-theme="modern"] .home-modern {
  --mh-bg: #000000;
  --mh-fg: #ffffff;
  background: var(--mh-bg);
  color: var(--mh-fg);
  font-family: var(--font-sans);
}
[data-theme="modern"] .home-modern > section {
  position: relative;
  overflow: clip;
  padding-inline: var(--mh-gutter);
}
[data-theme="modern"] .home-modern em { font-style: normal; }

/* ─── Shared bits ─── */
[data-theme="modern"] .home-modern .mh-meta {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  line-height: 1.5;
  text-transform: uppercase;
  color: #cccccc;
}
[data-theme="modern"] .home-modern .mh-mask { display: inline-block; overflow: clip; overflow-clip-margin: 0.08em; vertical-align: top; }
[data-theme="modern"] .home-modern .mh-empty { font-family: var(--mh-editorial); font-size: 1.25rem; color: #cccccc; padding-block: 2rem 4rem; }

[data-theme="modern"] .home-modern a:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 6px;
}

/* Primary action: label slides up and is replaced by its twin, arrow drives through. */
[data-theme="modern"] .home-modern .mh-cta {
  display: inline-flex;
  align-items: center;
  gap: 1.25rem;
  min-height: 3.25rem;
  padding: 0.85rem 1.4rem;
  background: #ffffff;
  color: #000000;
  font-family: var(--mh-editorial);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
[data-theme="modern"] .home-modern .mh-cta--invert { background: #000000; color: #ffffff; }
[data-theme="modern"] .home-modern .mh-cta__arrow { display: inline-block; font-family: var(--font-mono); }
@media (prefers-reduced-motion: no-preference) {
  [data-theme="modern"] .home-modern .mh-cta__arrow,
  [data-theme="modern"] .home-modern .mh-link__arrow { transition: transform 450ms var(--mh-ease); }
}
[data-theme="modern"] .home-modern .mh-cta:hover .mh-cta__arrow,
[data-theme="modern"] .home-modern .mh-cta:focus-visible .mh-cta__arrow { transform: translateX(0.6rem); }
[data-theme="modern"] .home-modern .mh-cta:hover,
[data-theme="modern"] .home-modern .mh-cta:focus-visible { letter-spacing: 0.08em; }
@media (prefers-reduced-motion: no-preference) {
  [data-theme="modern"] .home-modern .mh-cta { transition: letter-spacing 450ms var(--mh-ease); }
}

/* Text links: a rule that draws in from the reading edge. */
[data-theme="modern"] .home-modern .mh-link {
  position: relative;
  display: inline-flex;
  align-items: baseline;
  gap: 0.6rem;
  padding-block: 0.5rem;
  font-family: var(--font-mono);
  font-size: 0.8rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: inherit;
}
[data-theme="modern"] .home-modern .mh-link::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0.2rem;
  height: 1px;
  background: currentColor;
  transform: scaleX(0.25);
  transform-origin: left;
}
[data-theme="modern"] .home-modern .mh-link:hover::after,
[data-theme="modern"] .home-modern .mh-link:focus-visible::after { transform: scaleX(1); }
[data-theme="modern"] .home-modern .mh-link:hover .mh-link__arrow,
[data-theme="modern"] .home-modern .mh-link:focus-visible .mh-link__arrow { transform: translateX(0.4rem); }
@media (prefers-reduced-motion: no-preference) {
  [data-theme="modern"] .home-modern .mh-link::after { transition: transform 500ms var(--mh-ease); }
}
[data-theme="modern"] .home-modern .mh-link__arrow { display: inline-block; }

/* ─── The fragmented diamond ─── */
[data-theme="modern"] .home-modern .mh-symbol { display: block; width: 100%; height: auto; overflow: visible; color: currentColor; }
[data-theme="modern"] .home-modern .mh-symbol__field { opacity: 0.55; }
[data-theme="modern"] .home-modern .mh-symbol__echo { fill: none; stroke: currentColor; stroke-width: 0.6; }
[data-theme="modern"] .home-modern .mh-symbol__echo--2 { stroke-dasharray: 2 3; }
[data-theme="modern"] .home-modern .mh-symbol__q { fill: currentColor; }
[data-theme="modern"] .home-modern .mh-symbol__cut { fill: var(--mh-bg); }
[data-theme="modern"] .home-modern .mh-symbol__q,
[data-theme="modern"] .home-modern .mh-symbol__echo,
[data-theme="modern"] .home-modern .mh-symbol__core { transform-box: view-box; transform-origin: 50% 50%; }

@keyframes mh-drift-n { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(7px, -7px); } }
@keyframes mh-drift-e { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(7px, 7px); } }
@keyframes mh-drift-s { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(-7px, 7px); } }
@keyframes mh-drift-w { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(-7px, -7px); } }
@keyframes mh-turn { to { transform: rotate(360deg); } }
@keyframes mh-assemble { from { transform: scale(0.4) rotate(-45deg); opacity: 0; } }

@media (prefers-reduced-motion: no-preference) {
  [data-theme="modern"] .home-modern .mh-symbol__q--n { animation: mh-drift-n 7s var(--mh-ease) infinite; }
  [data-theme="modern"] .home-modern .mh-symbol__q--e { animation: mh-drift-e 7s var(--mh-ease) infinite 0.35s; }
  [data-theme="modern"] .home-modern .mh-symbol__q--s { animation: mh-drift-s 7s var(--mh-ease) infinite 0.7s; }
  [data-theme="modern"] .home-modern .mh-symbol__q--w { animation: mh-drift-w 7s var(--mh-ease) infinite 1.05s; }
  [data-theme="modern"] .home-modern .mh-symbol__echo--2 { animation: mh-turn 60s linear infinite; }
  [data-theme="modern"] .home-modern .mh-hero__symbol .mh-symbol__core { animation: mh-assemble 1.4s var(--mh-ease) both 0.2s; }
}

/* ─── Load-in reveal — short, staggered, never blocks interaction ─── */
@keyframes mh-rise { from { transform: translateY(105%); } }
@keyframes mh-fade { from { opacity: 0; transform: translateY(1rem); } }
@media (prefers-reduced-motion: no-preference) {
  [data-theme="modern"] .home-modern .mh-mask > .mh-rise,
  [data-theme="modern"] .home-modern .mh-hero__sv.mh-rise { display: inline-block; animation: mh-rise 900ms var(--mh-ease) both calc(var(--d, 0) * 90ms); }
  [data-theme="modern"] .home-modern .mh-hero__meta.mh-rise,
  [data-theme="modern"] .home-modern .mh-hero__intro.mh-rise { animation: mh-fade 700ms var(--mh-ease) both calc(var(--d, 0) * 90ms); }
}

/* ─── 01 Hero ─── */
[data-theme="modern"] .home-modern .mh-hero {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-template-rows: auto 1fr auto auto;
  column-gap: 1rem;
  min-height: calc(100svh - 4.85rem);
  padding-block: 1.5rem 2rem;
  isolation: isolate;
}
[data-theme="modern"] .home-modern .mh-hero__meta {
  grid-column: 1 / -1;
  grid-row: 1;
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 2.5rem;
  z-index: 3;
}
[data-theme="modern"] .home-modern .mh-hero__title {
  grid-column: 1 / -1;
  grid-row: 2 / 4;
  align-self: end;
  position: relative;
  z-index: 1;
  margin: 0 calc(var(--mh-gutter) * -1) 0 -0.04em;
  font-family: var(--mh-display);
  font-weight: 700;
  line-height: 0.74;
  white-space: nowrap;
  pointer-events: none;
}
[data-theme="modern"] .home-modern .mh-hero__sv {
  position: absolute;
  left: 0.15em;
  bottom: 0.1em;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font-family: var(--mh-editorial);
  font-size: clamp(2rem, 5vw, 5rem);
  line-height: 1;
}
[data-theme="modern"] .home-modern .mh-hero__ada {
  display: block;
  font-size: clamp(9rem, 41vw, 46rem);
  letter-spacing: -0.06em;
  transform: translateX(12vw);
}
[data-theme="modern"] .home-modern .mh-hero__ada .mh-mask { overflow-clip-margin: 0.2em; padding-top: 0.06em; }
[data-theme="modern"] .home-modern .mh-hero__symbol {
  grid-column: 7 / -1;
  grid-row: 1 / 3;
  align-self: start;
  justify-self: end;
  width: min(44vw, 42rem);
  margin-right: calc(var(--mh-gutter) * -0.5);
  margin-top: -1rem;
  z-index: 2;
  mix-blend-mode: difference;
  color: #ffffff;
  pointer-events: none;
}
[data-theme="modern"] .home-modern .mh-hero__statement {
  grid-column: 1 / 8;
  grid-row: 2;
  align-self: start;
  z-index: 3;
  margin-top: clamp(2rem, 7vh, 5rem);
  display: flex;
  flex-direction: column;
  font-size: clamp(2.2rem, 5.6vw, 6.5rem);
  line-height: 0.92;
  mix-blend-mode: difference;
}
[data-theme="modern"] .home-modern .mh-hero__w1 { font-family: var(--mh-display); font-weight: 700; }
[data-theme="modern"] .home-modern .mh-hero__w2 {
  font-family: var(--mh-editorial);
  font-weight: 700;
  color: transparent;
  -webkit-text-stroke: 1.5px #ffffff;
  text-transform: uppercase;
  font-size: 0.82em;
  margin-left: 1.4em;
}
[data-theme="modern"] .home-modern .mh-hero__statement .mh-mask:nth-child(2) { align-self: flex-start; }
[data-theme="modern"] .home-modern .mh-hero__w3 {
  font-family: var(--mh-display);
  font-weight: 300;
  font-style: oblique 12deg;
  margin-left: 0.5em;
}
[data-theme="modern"] .home-modern .mh-hero__intro {
  grid-column: 9 / -1;
  grid-row: 2;
  align-self: end;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.5rem;
  max-width: 24rem;
  margin-bottom: 2rem;
  padding: 1.25rem 0 0;
  background: #000000;
  box-shadow: 0 0 0 1.25rem #000000;
}
[data-theme="modern"] .home-modern .mh-hero__intro p { font-size: 1.05rem; line-height: 1.55; color: #ffffff; }
[data-theme="modern"] .home-modern .mh-hero__cue {
  grid-column: 1 / -1;
  grid-row: 4;
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-top: 1.5rem;
  color: #777777 !important;
}
[data-theme="modern"] .home-modern .mh-hero__cue-line { display: block; width: 4rem; height: 1px; background: #777777; transform-origin: left; }
@keyframes mh-cue { 0% { transform: scaleX(0); } 50% { transform: scaleX(1); transform-origin: left; } 51% { transform-origin: right; } 100% { transform: scaleX(0); transform-origin: right; } }
@media (prefers-reduced-motion: no-preference) {
  [data-theme="modern"] .home-modern .mh-hero__cue-line { animation: mh-cue 2.4s var(--mh-ease) infinite 1.2s; }
}

/* ─── 02 Programme ─── */
[data-theme="modern"] .home-modern .mh-programme { padding-block: 0 clamp(4rem, 10vw, 9rem); }
[data-theme="modern"] .home-modern .mh-tape {
  margin-inline: calc(var(--mh-gutter) * -1);
  padding-block: 0.6rem;
  background: #ffffff;
  color: #000000;
  font-family: var(--mh-editorial);
  font-weight: 700;
  font-size: clamp(1rem, 2vw, 1.5rem);
  text-transform: uppercase;
  white-space: nowrap;
  transform: rotate(-2deg) scaleX(1.05);
  margin-block: 1rem clamp(3rem, 7vw, 6rem);
}
[data-theme="modern"] .home-modern .mh-tape span { display: inline-block; padding-left: 2rem; }
[data-theme="modern"] .home-modern .mh-programme__head {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  align-items: end;
  column-gap: 1rem;
  margin-bottom: clamp(2rem, 5vw, 4rem);
}
[data-theme="modern"] .home-modern .mh-programme__head .mh-meta { grid-column: 1 / 4; align-self: start; padding-top: 1rem; }
[data-theme="modern"] .home-modern .mh-programme__title {
  grid-column: 3 / 11;
  font-family: var(--mh-display);
  font-weight: 700;
  font-size: clamp(3.5rem, 13vw, 14rem);
  line-height: 0.8;
  letter-spacing: -0.03em;
}
[data-theme="modern"] .home-modern .mh-programme__title em { font-weight: 300; font-style: oblique 12deg; }
[data-theme="modern"] .home-modern .mh-programme__all { grid-column: 11 / -1; justify-self: end; }

[data-theme="modern"] .home-modern .mh-events { list-style: none; margin: 0; padding: 0; border-top: 1px solid #777777; }
[data-theme="modern"] .home-modern .mh-event { border-bottom: 1px solid #777777; }
[data-theme="modern"] .home-modern .mh-event__link {
  display: grid;
  grid-template-columns: minmax(9rem, 2fr) 7fr minmax(5rem, 1.5fr);
  align-items: center;
  gap: 1.5rem;
  padding-block: clamp(1.25rem, 3vw, 2.5rem);
  color: #ffffff;
}
/* Asymmetric programme: every other row steps in from the reading edge. */
[data-theme="modern"] .home-modern .mh-event:nth-child(even) .mh-event__link { padding-left: clamp(0rem, 12vw, 12rem); }
[data-theme="modern"] .home-modern .mh-event__date { display: flex; align-items: flex-start; gap: 0.75rem; }
[data-theme="modern"] .home-modern .mh-event__day {
  font-family: var(--mh-display);
  font-weight: 700;
  font-size: clamp(3.5rem, 8vw, 7.5rem);
  line-height: 0.8;
  letter-spacing: -0.04em;
}
[data-theme="modern"] .home-modern .mh-event__body { display: flex; flex-direction: column; gap: 0.75rem; min-width: 0; }
[data-theme="modern"] .home-modern .mh-event__title {
  font-family: var(--mh-editorial);
  font-weight: 700;
  font-size: clamp(1.6rem, 3.6vw, 3.25rem);
  line-height: 1;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}
[data-theme="modern"] .home-modern .mh-event__info { display: flex; flex-wrap: wrap; gap: 0.25rem 2rem; color: #cccccc; }
[data-theme="modern"] .home-modern .mh-event__flag { align-self: flex-start; padding: 0.15rem 0.5rem; background: #ffffff; color: #000000 !important; }
[data-theme="modern"] .home-modern .mh-event__go { justify-self: end; padding-right: 1rem; color: #ffffff; }
[data-theme="modern"] .home-modern .mh-event__go .mh-link__arrow { display: inline-block; }

/* Hover/focus: title drives right, the date hollows out, the arrow travels. */
[data-theme="modern"] .home-modern .mh-event__link:hover .mh-event__title,
[data-theme="modern"] .home-modern .mh-event__link:focus-visible .mh-event__title { transform: translateX(1.25rem); }
[data-theme="modern"] .home-modern .mh-event__link:hover .mh-event__day,
[data-theme="modern"] .home-modern .mh-event__link:focus-visible .mh-event__day { color: transparent; -webkit-text-stroke: 1.5px #ffffff; }
[data-theme="modern"] .home-modern .mh-event__link:hover .mh-link__arrow,
[data-theme="modern"] .home-modern .mh-event__link:focus-visible .mh-link__arrow { transform: translateX(0.75rem); }
[data-theme="modern"] .home-modern .mh-event__link:focus-visible { outline-offset: -2px; }
@media (prefers-reduced-motion: no-preference) {
  [data-theme="modern"] .home-modern .mh-event__title { transition: transform 600ms var(--mh-ease); }
}

/* ─── 03 Association ─── */
[data-theme="modern"] .home-modern .mh-assoc {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: 1rem;
  row-gap: clamp(3rem, 6vw, 6rem);
  padding-block: clamp(4rem, 10vw, 10rem);
  border-top: 1px solid #181818;
}
[data-theme="modern"] .home-modern .mh-assoc__glyph {
  position: absolute;
  right: -0.12em;
  top: -0.2em;
  font-family: var(--mh-display);
  font-weight: 300;
  font-size: clamp(22rem, 62vw, 60rem);
  line-height: 1;
  color: #181818;
  z-index: 0;
  pointer-events: none;
}
[data-theme="modern"] .home-modern .mh-assoc > :not(.mh-assoc__glyph) { position: relative; z-index: 1; }
[data-theme="modern"] .home-modern .mh-assoc__label {
  grid-column: 1 / 3;
  grid-row: 1 / 3;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  justify-self: start;
}
[data-theme="modern"] .home-modern .mh-assoc__intro {
  grid-column: 3 / 12;
  font-family: var(--mh-editorial);
  font-size: clamp(1.6rem, 3.6vw, 3.6rem);
  line-height: 1.08;
  letter-spacing: -0.01em;
}
[data-theme="modern"] .home-modern .mh-assoc__intro::first-line { font-weight: 700; }
[data-theme="modern"] .home-modern .mh-assoc__mission {
  grid-column: 5 / -1;
  margin: 0;
  padding-left: 1.5rem;
  border-left: 1px solid #ffffff;
}
[data-theme="modern"] .home-modern .mh-assoc__mission p {
  font-family: var(--mh-display);
  font-weight: 300;
  font-style: oblique 10deg;
  font-size: clamp(1.75rem, 4.5vw, 4.75rem);
  line-height: 1.02;
}
[data-theme="modern"] .home-modern .mh-assoc__pillars {
  grid-column: 3 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 4rem;
  list-style: none;
  margin: 0;
  padding: 0;
  color: #ffffff;
}
[data-theme="modern"] .home-modern .mh-assoc__pillars span { color: #777777; margin-right: 0.5rem; }
[data-theme="modern"] .home-modern .mh-assoc__video { grid-column: 3 / -1; }

/* ─── 04 Identity — the one inverted, white plate on the page ─── */
[data-theme="modern"] .home-modern .mh-identity {
  --mh-bg: #ffffff;
  --mh-fg: #000000;
  background: #ffffff;
  color: #000000;
  min-height: clamp(34rem, 95svh, 64rem);
  display: grid;
  place-items: center;
  padding-block: 6rem;
  clip-path: polygon(0 4rem, 100% 0, 100% calc(100% - 4rem), 0 100%);
}
[data-theme="modern"] .home-modern .mh-identity__strips {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0;
  pointer-events: none;
}
[data-theme="modern"] .home-modern .mh-strip {
  font-family: var(--mh-display);
  font-weight: 700;
  font-size: clamp(5rem, 15vw, 16rem);
  line-height: 0.82;
  white-space: nowrap;
  letter-spacing: -0.04em;
}
[data-theme="modern"] .home-modern .mh-strip span { display: inline-block; transform: translateX(calc(var(--dir) * 8%)); }
[data-theme="modern"] .home-modern .mh-strip--outline { color: transparent; -webkit-text-stroke: 1.5px #000000; }
[data-theme="modern"] .home-modern .mh-strip:nth-child(2) span { margin-left: -30%; }
[data-theme="modern"] .home-modern .mh-strip:nth-child(4) span { margin-left: -55%; }
[data-theme="modern"] .home-modern .mh-identity__symbol {
  position: relative;
  width: min(62vw, 36rem);
  mix-blend-mode: difference;
  color: #ffffff;
}
[data-theme="modern"] .home-modern .mh-identity__symbol .mh-symbol__cut { fill: #000000; }
[data-theme="modern"] .home-modern .mh-identity__cap { position: absolute; color: #000000 !important; }
[data-theme="modern"] .home-modern .mh-identity__cap--a { left: var(--mh-gutter); top: 6rem; }
[data-theme="modern"] .home-modern .mh-identity__cap--b { right: var(--mh-gutter); bottom: 6rem; text-align: right; }

/* ─── 05 Study community ─── */
[data-theme="modern"] .home-modern .mh-studies { padding-block: clamp(5rem, 12vw, 11rem) clamp(3rem, 6vw, 5rem); }
[data-theme="modern"] .home-modern .mh-studies__head {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: 1rem;
  row-gap: 1rem;
  margin-bottom: clamp(2.5rem, 6vw, 5rem);
}
[data-theme="modern"] .home-modern .mh-studies__head .mh-meta { grid-column: 1 / -1; }
[data-theme="modern"] .home-modern .mh-studies__title {
  grid-column: 1 / 9;
  font-family: var(--mh-editorial);
  font-weight: 700;
  font-size: clamp(2rem, 5vw, 5rem);
  line-height: 0.95;
  text-transform: uppercase;
}
[data-theme="modern"] .home-modern .mh-studies__title em { color: transparent; -webkit-text-stroke: 1.5px #ffffff; }
[data-theme="modern"] .home-modern .mh-studies__note { grid-column: 9 / -1; align-self: end; color: #cccccc; max-width: 22rem; }

[data-theme="modern"] .home-modern .mh-programs { list-style: none; margin: 0; padding: 0; counter-reset: none; }
[data-theme="modern"] .home-modern .mh-program {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  padding-block: 0.4rem;
  border-top: 1px solid #181818;
}
/* The stack zig-zags: odd names hug the left, even names push to the right edge. */
[data-theme="modern"] .home-modern .mh-program:nth-child(even) { flex-direction: row-reverse; text-align: right; }
[data-theme="modern"] .home-modern .mh-program__num { padding-top: 0.6em; color: #777777; }
[data-theme="modern"] .home-modern .mh-program__name {
  font-family: var(--mh-display);
  font-weight: 700;
  font-size: clamp(2.25rem, 7.5vw, 8rem);
  line-height: 0.9;
  letter-spacing: -0.03em;
  overflow-wrap: anywhere;
  hyphens: auto;
}
[data-theme="modern"] .home-modern .mh-program:nth-child(3n + 2) .mh-program__name { font-weight: 300; font-style: oblique 12deg; }

/* ─── 05b Board — a magazine masthead, not a card grid ─── */
[data-theme="modern"] .home-modern .mh-board {
  padding-block: clamp(3rem, 8vw, 7rem) clamp(5rem, 12vw, 10rem);
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: 1rem;
}
[data-theme="modern"] .home-modern .mh-board__head {
  grid-column: 1 / 5;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.5rem;
  position: sticky;
  top: 6rem;
  align-self: start;
}
[data-theme="modern"] .home-modern .mh-board__title {
  font-family: var(--mh-display);
  font-weight: 700;
  font-size: clamp(3rem, 8vw, 8rem);
  line-height: 0.85;
}
[data-theme="modern"] .home-modern .mh-board__title em { display: block; font-weight: 300; font-style: oblique 12deg; padding-left: 0.6em; }
[data-theme="modern"] .home-modern .mh-board > .mh-empty,
[data-theme="modern"] .home-modern .mh-masthead { grid-column: 6 / -1; }
[data-theme="modern"] .home-modern .mh-masthead { list-style: none; margin: 0; padding: 0; }
[data-theme="modern"] .home-modern .mh-masthead__row {
  display: grid;
  grid-template-columns: 9rem 1fr 4.5rem;
  align-items: center;
  gap: 1.25rem;
  padding-block: 1.1rem;
  border-bottom: 1px solid #777777;
}
[data-theme="modern"] .home-modern .mh-masthead__row:first-child { border-top: 1px solid #777777; }
[data-theme="modern"] .home-modern .mh-masthead__role { color: #777777; }
[data-theme="modern"] .home-modern .mh-masthead__name {
  font-family: var(--mh-editorial);
  font-size: clamp(1.4rem, 2.6vw, 2.4rem);
  line-height: 1.05;
}
[data-theme="modern"] .home-modern .mh-masthead__photo {
  width: 4.5rem;
  aspect-ratio: 1;
  overflow: hidden;
  background: #181818;
  display: grid;
  place-items: center;
  font-family: var(--mh-display);
  font-weight: 700;
  font-size: 2rem;
}
[data-theme="modern"] .home-modern .mh-masthead__photo img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.15); }

/* ─── 06 Join — closes on an inverted, oversized plate ─── */
[data-theme="modern"] .home-modern .mh-join {
  --mh-bg: #ffffff;
  background: #ffffff;
  color: #000000;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: 1rem;
  padding-block: clamp(4rem, 8vw, 7rem) 0;
  clip-path: polygon(0 0, 100% 3rem, 100% 100%, 0 100%);
}
[data-theme="modern"] .home-modern .mh-join__label { grid-column: 1 / -1; color: #000000 !important; padding-top: 2rem; }
[data-theme="modern"] .home-modern .mh-join__title {
  grid-column: 1 / -1;
  grid-row: 2 / 4;
  font-family: var(--mh-display);
  font-weight: 700;
  font-size: clamp(7rem, 30vw, 34rem);
  line-height: 0.76;
  letter-spacing: -0.05em;
  margin-bottom: -0.12em;
}
[data-theme="modern"] .home-modern .mh-join__l1 { display: block; }
[data-theme="modern"] .home-modern .mh-join__l2 {
  display: block;
  padding-left: 0.9em;
  font-weight: 300;
  font-style: oblique 10deg;
}
[data-theme="modern"] .home-modern .mh-join__body {
  grid-column: 8 / -1;
  grid-row: 2;
  align-self: start;
  margin-top: 2rem;
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.5rem;
  max-width: 26rem;
  justify-self: end;
}
[data-theme="modern"] .home-modern .mh-join__body p { font-size: 1.1rem; line-height: 1.55; color: #000000; }

/* ─── Scroll-linked composition (progressive; static where unsupported) ─── */
@keyframes mh-hero-exit { to { transform: translateY(-18%) scale(0.92); opacity: 0.25; } }
@keyframes mh-symbol-exit { to { transform: rotate(45deg) translateY(12%); } }
@keyframes mh-tape-run { from { transform: translateX(0); } to { transform: translateX(-35%); } }
@keyframes mh-strip-run { from { transform: translateX(calc(var(--dir) * -12%)); } to { transform: translateX(calc(var(--dir) * 12%)); } }
@keyframes mh-identity-turn { from { transform: rotate(-30deg) scale(0.75); } to { transform: rotate(30deg) scale(1.1); } }
@keyframes mh-glyph-drift { from { transform: translateY(-10%); } to { transform: translateY(15%); } }
@keyframes mh-slide-in { from { transform: translateX(-6%); opacity: 0; } }
@keyframes mh-join-rise { from { transform: translateY(25%); } }

@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    [data-theme="modern"] .home-modern .mh-hero__ada {
      animation: mh-hero-exit linear both;
      animation-timeline: view();
      animation-range: exit 0% exit 100%;
    }
    [data-theme="modern"] .home-modern .mh-hero__symbol .mh-symbol {
      animation: mh-symbol-exit linear both;
      animation-timeline: view();
      animation-range: exit 0% exit 100%;
    }
    [data-theme="modern"] .home-modern .mh-tape span {
      animation: mh-tape-run linear both;
      animation-timeline: view();
    }
    [data-theme="modern"] .home-modern .mh-event {
      animation: mh-slide-in linear both;
      animation-timeline: view();
      animation-range: entry 0% entry 90%;
    }
    [data-theme="modern"] .home-modern .mh-assoc__glyph {
      animation: mh-glyph-drift linear both;
      animation-timeline: view();
    }
    [data-theme="modern"] .home-modern .mh-strip span {
      animation: mh-strip-run linear both;
      animation-timeline: view();
    }
    [data-theme="modern"] .home-modern .mh-identity__symbol .mh-symbol {
      animation: mh-identity-turn linear both;
      animation-timeline: view();
    }
    [data-theme="modern"] .home-modern .mh-program {
      animation: mh-slide-in linear both;
      animation-timeline: view();
      animation-range: entry 0% entry 100%;
    }
    [data-theme="modern"] .home-modern .mh-join__title {
      animation: mh-join-rise linear both;
      animation-timeline: view();
      animation-range: entry 0% cover 50%;
    }
  }
}

/* ─── Tablet — the word stack sits under the symbol, the intro under the ADA ─── */
@media (max-width: 1023px) {
  [data-theme="modern"] .home-modern .mh-hero { min-height: calc(100svh - 2.6rem); grid-template-rows: auto auto auto auto auto; }
  [data-theme="modern"] .home-modern .mh-hero__statement { grid-column: 1 / 9; grid-row: 2; }
  [data-theme="modern"] .home-modern .mh-hero__symbol { grid-column: 6 / -1; grid-row: 2 / 4; width: 56vw; }
  [data-theme="modern"] .home-modern .mh-hero__title { grid-row: 3; margin-top: 1rem; }
  [data-theme="modern"] .home-modern .mh-hero__ada { font-size: 52vw; transform: translateX(8vw); }
  [data-theme="modern"] .home-modern .mh-hero__intro { grid-column: 5 / -1; grid-row: 4; margin: -2rem 0 0; max-width: none; }
  [data-theme="modern"] .home-modern .mh-hero__cue { grid-row: 5; }
  [data-theme="modern"] .home-modern .mh-board__head { grid-column: 1 / -1; position: static; margin-bottom: 2.5rem; flex-direction: row; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; }
  [data-theme="modern"] .home-modern .mh-board > .mh-empty,
  [data-theme="modern"] .home-modern .mh-masthead { grid-column: 1 / -1; }
  [data-theme="modern"] .home-modern .mh-join__body { grid-column: 6 / -1; }
}

/* ─── Mobile — its own composition: ADA stacks down the right edge ─── */
@media (max-width: 639px) {
  [data-theme="modern"] .home-modern .mh-hero {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    grid-template-rows: auto auto auto auto auto;
    padding-block: 1.25rem 1.5rem;
  }
  [data-theme="modern"] .home-modern .mh-hero__meta { flex-direction: column; gap: 0.1rem; font-size: 0.65rem; }
  [data-theme="modern"] .home-modern .mh-hero__title {
    grid-column: 1 / -1;
    grid-row: 2;
    align-self: start;
    margin: 1.5rem 0 0;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
  }
  [data-theme="modern"] .home-modern .mh-hero__sv { position: static; margin-bottom: 0.3em; font-size: 2.4rem; }
  [data-theme="modern"] .home-modern .mh-hero__ada {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    font-size: 47vw;
    line-height: 0.74;
    transform: translateX(0.12em);
  }
  [data-theme="modern"] .home-modern .mh-hero__symbol {
    grid-column: 1 / 5;
    grid-row: 2;
    align-self: center;
    justify-self: start;
    width: 68vw;
    margin: 6rem 0 0 -8vw;
  }
  [data-theme="modern"] .home-modern .mh-hero__statement { grid-column: 1 / -1; grid-row: 3; margin-top: 1.75rem; font-size: 2.6rem; }
  [data-theme="modern"] .home-modern .mh-hero__w2 { margin-left: 0.6em; }
  [data-theme="modern"] .home-modern .mh-hero__intro { grid-column: 1 / -1; grid-row: 4; margin: 2rem 0 0; box-shadow: none; padding: 0; }
  [data-theme="modern"] .home-modern .mh-hero__intro .mh-cta { align-self: stretch; justify-content: space-between; }
  [data-theme="modern"] .home-modern .mh-hero__cue { grid-row: 5; }

  [data-theme="modern"] .home-modern .mh-programme__head .mh-meta,
  [data-theme="modern"] .home-modern .mh-programme__title,
  [data-theme="modern"] .home-modern .mh-programme__all { grid-column: 1 / -1; justify-self: start; }
  [data-theme="modern"] .home-modern .mh-programme__title { margin-block: 0.5rem 1rem; }
  [data-theme="modern"] .home-modern .mh-event__link { grid-template-columns: auto 1fr; gap: 0.5rem 1rem; align-items: start; }
  [data-theme="modern"] .home-modern .mh-event:nth-child(even) .mh-event__link { padding-left: 0; }
  [data-theme="modern"] .home-modern .mh-event__date { flex-direction: column; gap: 0.25rem; }
  [data-theme="modern"] .home-modern .mh-event__day { font-size: 3.5rem; }
  [data-theme="modern"] .home-modern .mh-event__go { grid-column: 2; justify-self: start; }

  [data-theme="modern"] .home-modern .mh-assoc__label { grid-column: 1 / -1; grid-row: auto; writing-mode: horizontal-tb; transform: none; }
  [data-theme="modern"] .home-modern .mh-assoc__intro,
  [data-theme="modern"] .home-modern .mh-assoc__pillars,
  [data-theme="modern"] .home-modern .mh-assoc__video { grid-column: 1 / -1; }
  [data-theme="modern"] .home-modern .mh-assoc__mission { grid-column: 2 / -1; padding-left: 1rem; }
  [data-theme="modern"] .home-modern .mh-assoc__pillars { flex-direction: column; }

  [data-theme="modern"] .home-modern .mh-identity { min-height: 36rem; clip-path: polygon(0 2rem, 100% 0, 100% calc(100% - 2rem), 0 100%); }
  [data-theme="modern"] .home-modern .mh-strip { font-size: 7.5rem; }
  [data-theme="modern"] .home-modern .mh-identity__symbol { width: 78vw; }
  [data-theme="modern"] .home-modern .mh-identity__cap--a { top: 3.5rem; }
  [data-theme="modern"] .home-modern .mh-identity__cap--b { bottom: 3.5rem; }

  [data-theme="modern"] .home-modern .mh-studies__title,
  [data-theme="modern"] .home-modern .mh-studies__note { grid-column: 1 / -1; }
  [data-theme="modern"] .home-modern .mh-program:nth-child(even) { flex-direction: row; text-align: left; padding-left: 2rem; }
  [data-theme="modern"] .home-modern .mh-program__name { font-size: 2.1rem; }

  [data-theme="modern"] .home-modern .mh-board__title { font-size: 3.5rem; }
  [data-theme="modern"] .home-modern .mh-masthead__row { grid-template-columns: 1fr 3.5rem; gap: 0.25rem 1rem; }
  [data-theme="modern"] .home-modern .mh-masthead__role { grid-column: 1; grid-row: 1; }
  [data-theme="modern"] .home-modern .mh-masthead__name { grid-column: 1; grid-row: 2; }
  [data-theme="modern"] .home-modern .mh-masthead__photo { grid-column: 2; grid-row: 1 / 3; width: 3.5rem; }

  [data-theme="modern"] .home-modern .mh-join { clip-path: polygon(0 0, 100% 1.5rem, 100% 100%, 0 100%); }
  [data-theme="modern"] .home-modern .mh-join__title { grid-row: 3; font-size: 38vw; }
  [data-theme="modern"] .home-modern .mh-join__body { grid-column: 1 / -1; grid-row: 2; justify-self: start; margin: 1.5rem 0 2.5rem; }
  [data-theme="modern"] .home-modern .mh-join__body .mh-cta { align-self: stretch; justify-content: space-between; }
}