@font-face { font-family: "Pixelify Sans"; font-weight: 500; font-style: normal; font-display: swap; src: url(fonts/pixelify-sans-latin-500-normal.woff2) format("woff2"); }
@font-face { font-family: "Pixelify Sans"; font-weight: 600; font-style: normal; font-display: swap; src: url(fonts/pixelify-sans-latin-600-normal.woff2) format("woff2"); }
@font-face { font-family: "Onest"; font-weight: 400; font-style: normal; font-display: swap; src: url(fonts/onest-latin-400-normal.woff2) format("woff2"); }
@font-face { font-family: "Onest"; font-weight: 500; font-style: normal; font-display: swap; src: url(fonts/onest-latin-500-normal.woff2) format("woff2"); }
@font-face { font-family: "Onest"; font-weight: 600; font-style: normal; font-display: swap; src: url(fonts/onest-latin-600-normal.woff2) format("woff2"); }
@font-face { font-family: "JetBrains Mono"; font-weight: 400; font-style: normal; font-display: swap; src: url(fonts/jetbrains-mono-latin-400-normal.woff2) format("woff2"); }
@font-face { font-family: "JetBrains Mono"; font-weight: 500; font-style: normal; font-display: swap; src: url(fonts/jetbrains-mono-latin-500-normal.woff2) format("woff2"); }

:root {
  --bg: oklch(0.27 0.055 165);
  --surface: oklch(0.34 0.06 165);
  --mute: oklch(0.74 0.04 165);
  --ink: oklch(0.95 0.025 150);
  --accent: oklch(0.76 0.15 58);
  --line: color-mix(in oklch, var(--ink) 18%, transparent);

  --display: "Pixelify Sans", monospace;
  --body: "Onest", system-ui, sans-serif;
  --utility: "JetBrains Mono", ui-monospace, monospace;

  --gutter: 12px;
  --gap: 12px;
  --pad-right: 20px;
  --section: 64px;
}
@media (min-width: 760px) {
  :root { --gutter: 56px; --gap: 24px; --pad-right: 56px; --section: 104px; }
}

* { box-sizing: border-box; margin: 0; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 88px; }
body {
  background: var(--bg);
  color: var(--ink);
  font-family: var(--body);
  font-size: 1rem;
  line-height: 1.6;
}
img { display: block; max-width: 100%; }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }

html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }

.sr {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip-path: inset(50%); white-space: nowrap;
}

/* ---------- Type ---------- */
.d-xl {
  font-family: var(--display); font-weight: 600;
  font-size: clamp(2.4rem, 1.4rem + 4vw, 4.5rem);
  line-height: 1.05; text-wrap: balance;
}
.d-l {
  font-family: var(--display); font-weight: 600;
  font-size: clamp(1.9rem, 1.3rem + 2vw, 2.9rem);
  line-height: 1.1; text-wrap: balance;
}
.d-m {
  font-family: var(--display); font-weight: 500;
  font-size: 1.5rem; line-height: 1.2;
}
.d-xl, .d-l, .d-m { font-variant-ligatures: none; font-feature-settings: "liga" 0, "clig" 0; }
.lede { font-size: 1.125rem; line-height: 1.6; max-width: 56ch; }
.util { font-family: var(--utility); font-size: 0.8125rem; line-height: 1.4; }
.ph { color: var(--mute); }

/* ---------- Actions ---------- */
.btn {
  position: relative; isolation: isolate;
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 48px; padding: 0 24px 0 28px;
  font-family: var(--utility); font-size: 0.875rem; font-weight: 500;
  color: var(--bg); text-decoration: none;
  transition: transform 0.2s ease;
}
.btn::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: var(--accent);
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 0 68%, 8px 68%, 8px 32%, 0 32%);
}
.btn:hover { transform: translateY(-1px); }
.btn--sm { min-height: 40px; padding: 0 16px 0 22px; font-size: 0.8125rem; }
.btn--lg { min-height: 56px; padding: 0 32px 0 36px; font-size: 1rem; }

.link {
  font-family: var(--utility); font-size: 0.875rem; font-weight: 500;
  text-decoration: underline; text-decoration-color: var(--line);
  text-underline-offset: 6px; text-decoration-thickness: 2px;
  transition: text-decoration-color 0.2s ease;
}
.link:hover { text-decoration-color: var(--accent); }

/* ---------- Placeholder blocks ---------- */
.slot {
  position: relative; overflow: hidden;
  background: var(--surface);
  border: 1px dashed color-mix(in oklch, var(--mute) 55%, transparent);
  border-radius: 2px;
  display: flex; align-items: flex-end;
}
.slot > .label {
  position: relative; z-index: 1;
  font-family: var(--utility); font-size: 0.8125rem; line-height: 1.4;
  color: var(--mute); padding: 12px 14px;
}
.slot > .label b { display: block; font-weight: 500; color: var(--ink); }

/* ---------- Nav ---------- */
.nav {
  position: sticky; top: 0; z-index: 20;
  background: var(--bg);
  border-bottom: 1px solid var(--line);
}
.nav-in {
  max-width: calc(1200px + var(--gutter) + var(--gap) + var(--pad-right));
  margin: 0 auto;
  padding: 10px var(--pad-right) 10px var(--gap);
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.brandmark { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.brandmark img { width: 44px; height: 44px; object-fit: cover; border-radius: 2px; }
.brandmark span { font-family: var(--utility); font-size: 0.8125rem; font-weight: 500; line-height: 1.3; display: none; }
.nav-links { display: none; gap: 28px; }
.nav-links a { font-family: var(--utility); font-size: 0.8125rem; text-decoration: none; color: var(--mute); }
.nav-links a:hover { color: var(--ink); }
.btn .short { display: inline; }
.btn .long { display: none; }
@media (min-width: 760px) {
  .brandmark span { display: block; }
  .btn .short { display: none; }
  .btn .long { display: inline; }
}
@media (min-width: 1100px) { .nav-links { display: flex; } }

/* ---------- Board + trace ---------- */
.board {
  position: relative;
  max-width: calc(1200px + var(--gutter) + var(--gap) + var(--pad-right));
  margin: 0 auto;
  padding: 0 var(--pad-right) 0 calc(var(--gutter) + var(--gap));
}
#trace {
  position: absolute; left: 0; top: 0;
  pointer-events: none; overflow: visible;
}
#trace .ghost { fill: none; stroke: var(--line); stroke-width: 2; }
#trace .live { fill: none; stroke: var(--accent); stroke-width: 2; }
#trace .pad { fill: var(--bg); stroke: var(--accent); stroke-width: 2; transition: fill 0.25s ease; }
#trace .pad.on { fill: var(--accent); }

section { padding-block: var(--section); }
.head { display: grid; gap: 16px; margin-bottom: 48px; }
.head h2 { max-width: 20ch; }
.head .eyebrow { font-family: var(--utility); font-size: 0.8125rem; color: var(--mute); }

/* ---------- Hero ---------- */
.hero {
  padding-top: 40px; padding-bottom: var(--section);
  display: grid; gap: 40px; align-items: center;
}
@media (min-width: 900px) {
  .hero { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 64px; padding-top: 72px; }
}
.hero-text { display: grid; gap: 28px; justify-items: start; }
.hero h1 { max-width: 15ch; }
.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 24px; }
.next-event {
  display: flex; flex-wrap: wrap; gap: 8px 28px;
  padding-top: 20px; border-top: 1px solid var(--line);
  color: var(--mute); width: 100%; max-width: 56ch;
}
.next-event strong { font-weight: 500; color: var(--ink); }

.chip {
  width: 96px; height: 96px; color: var(--accent); display: block; overflow: visible;
}
.chip .c { transform-box: fill-box; }
@keyframes snap-top { from { transform: translateY(-34px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes snap-bottom { from { transform: translateY(34px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes snap-left { from { transform: translateX(-34px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes snap-right { from { transform: translateX(34px); opacity: 0; } to { transform: none; opacity: 1; } }
.js .chip .c-top { animation: snap-top 0.9s cubic-bezier(0.2, 0.8, 0.2, 1) 0.1s both; }
.js .chip .c-right { animation: snap-right 0.9s cubic-bezier(0.2, 0.8, 0.2, 1) 0.25s both; }
.js .chip .c-bottom { animation: snap-bottom 0.9s cubic-bezier(0.2, 0.8, 0.2, 1) 0.4s both; }
.js .chip .c-left { animation: snap-left 0.9s cubic-bezier(0.2, 0.8, 0.2, 1) 0.55s both; }

@keyframes rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
.js .hero-text > * { animation: rise 0.7s cubic-bezier(0.2, 0.8, 0.2, 1) both; }
.js .hero-text > :nth-child(2) { animation-delay: 0.2s; }
.js .hero-text > :nth-child(3) { animation-delay: 0.32s; }
.js .hero-text > :nth-child(4) { animation-delay: 0.44s; }
.js .hero-text > :nth-child(5) { animation-delay: 0.56s; }
.js .hero-media { animation: rise 0.9s cubic-bezier(0.2, 0.8, 0.2, 1) 0.35s both; }

.hero-media { aspect-ratio: 4 / 4.6; min-height: 320px; }
.hero-media .inner {
  position: absolute; left: 0; right: 0; top: -8%; height: 116%;
  background: var(--surface); will-change: transform;
}
.hero-media .label { position: absolute; left: 0; bottom: 0; z-index: 1; }

/* ---------- Thesis moment ---------- */
.thesis { padding-block: calc(var(--section) * 0.8); border-top: 1px solid var(--line); }
.thesis .d-xl { max-width: 22ch; }
.thesis .eyebrow { font-family: var(--utility); font-size: 0.8125rem; color: var(--mute); margin-bottom: 20px; }

/* ---------- Event rows ---------- */
.rows { border-bottom: 1px solid var(--line); }
.event, .past-row, .topic {
  display: grid; gap: 14px 24px;
  padding: 28px 0; border-top: 1px solid var(--line);
}
.event .when, .event .where { display: grid; gap: 4px; font-family: var(--utility); font-size: 0.8125rem; line-height: 1.4; }
.event .when span:first-child { color: var(--ink); font-weight: 500; }
.event .where { color: var(--mute); }
.event .what h3 { margin-bottom: 6px; }
.tag {
  display: inline-block; margin-bottom: 10px;
  font-family: var(--utility); font-size: 0.75rem; font-weight: 500;
  color: var(--accent); border: 1px solid var(--accent); border-radius: 2px; padding: 2px 8px;
}
@media (min-width: 900px) {
  .event { grid-template-columns: 150px minmax(0, 1fr) 220px auto; align-items: start; }
  .event .reg { align-self: center; }
}
.past-row { grid-template-columns: 1fr; }
@media (min-width: 760px) { .past-row { grid-template-columns: 150px minmax(0, 1fr); } }
.past-row .date { font-family: var(--utility); font-size: 0.8125rem; color: var(--ink); font-weight: 500; }
.past-row h3 { margin-bottom: 6px; }

/* ---------- Gallery ---------- */
.gallery {
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-auto-rows: clamp(170px, 24vw, 300px); gap: 16px; margin-top: 48px;
}
.gallery .slot { grid-column: span 12; }
@media (min-width: 760px) {
  .gallery .g1 { grid-column: span 7; }
  .gallery .g2 { grid-column: span 5; }
  .gallery .g3, .gallery .g4, .gallery .g5 { grid-column: span 4; }
}

/* ---------- Teach ---------- */
.topic { grid-template-columns: 1fr; align-items: baseline; }
@media (min-width: 760px) { .topic { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); } }

/* ---------- Team ---------- */
.team-grid {
  display: grid; gap: 40px 24px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (min-width: 900px) { .team-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 900px) { .team-grid .member:nth-child(even) { margin-top: 32px; } }
.member .slot { aspect-ratio: 1; margin-bottom: 14px; }
.slot.has-img { border: 0; background: var(--surface); }
.slot > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.member h3 { font-family: var(--body); font-weight: 600; font-size: 1rem; line-height: 1.3; }
.member p { font-family: var(--utility); font-size: 0.8125rem; color: var(--mute); margin-top: 2px; }

/* ---------- Join / sponsor ---------- */
.two { display: grid; gap: 56px; }
@media (min-width: 900px) { .two { grid-template-columns: 1fr 1fr; gap: 64px; } }
.two > div { display: grid; gap: 20px; align-content: start; justify-items: start; }
.two p { max-width: 44ch; }

.visit { display: grid; gap: 40px; margin-top: var(--section); padding-top: 48px; border-top: 1px solid var(--line); }
@media (min-width: 900px) { .visit { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 64px; } }
.visit dl { display: grid; gap: 22px; align-content: start; }
.visit dt { font-family: var(--utility); font-size: 0.8125rem; color: var(--mute); margin-bottom: 4px; }
.visit dd { font-size: 1rem; }
.finds { display: flex; flex-wrap: wrap; gap: 8px 24px; }
.map { min-height: 320px; position: relative; border: 1px solid var(--line); border-radius: 2px; overflow: hidden; background: var(--surface); }
.map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* ---------- Register band ---------- */
.register {
  border-top: 1px solid var(--line);
  display: grid; gap: 28px; justify-items: start;
}
.register .d-xl { max-width: 16ch; }

/* ---------- Footer ---------- */
footer { border-top: 1px solid var(--line); padding-block: 48px 64px; display: grid; gap: 28px; }
@media (min-width: 900px) { footer { grid-template-columns: minmax(0, 1fr) auto; align-items: end; } }
footer .name { font-weight: 600; }
footer .meta { display: grid; gap: 6px; color: var(--mute); font-size: 0.9375rem; }
footer .socials { display: flex; gap: 24px; flex-wrap: wrap; }


/* ---------- Illustrations ---------- */
.il { display: block; width: 100%; height: 100%; }
.il rect, .il polygon { shape-rendering: crispEdges; }
.il .f-s { fill: var(--surface); } .il .f-b { fill: var(--bg); } .il .f-i { fill: var(--ink); }
.il .f-m { fill: var(--mute); } .il .f-a { fill: var(--accent); }
.il .f-d { fill: color-mix(in oklch, var(--ink) 16%, transparent); }
.il .st-m { stroke: var(--mute); stroke-width: 3; } .il .st-d { stroke: color-mix(in oklch, var(--ink) 22%, transparent); stroke-width: 2; }
.il .s-m, .il .s-a, .il .s-d { fill: none; stroke-width: 3; stroke-linejoin: miter; }
.il .s-m { stroke: var(--mute); } .il .s-a { stroke: var(--accent); } .il .s-d { stroke: color-mix(in oklch, var(--ink) 12%, transparent); stroke-width: 2; }
.il .pad { fill: var(--bg); stroke: var(--accent); stroke-width: 3; }
.il .tea { fill: color-mix(in oklch, var(--accent) 52%, var(--bg)); }
.il text { font-family: var(--utility); font-size: 14px; }

.hero-media .inner svg { position: absolute; inset: 0; }

.builds { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 44px 16px; }
.build { grid-column: span 12; display: grid; gap: 14px; align-content: start; }
@media (min-width: 760px) {
  .b1 { grid-column: span 7; } .b2 { grid-column: span 5; } .b3 { grid-column: span 12; }
}
.art { position: relative; overflow: hidden; background: var(--surface); border-radius: 2px; aspect-ratio: 3 / 2; }
.b3 .art { aspect-ratio: 2 / 1; }
@media (min-width: 760px) { .b3 .art { aspect-ratio: 3.4 / 1; } }
.build figcaption { display: grid; gap: 4px; }
.build figcaption p { color: var(--mute); }

.socket { align-items: center; justify-content: center; }
.sock { width: 40%; height: auto; fill: none; stroke: var(--mute); stroke-width: 2.5; stroke-dasharray: 5 4; }
.team-note { margin-top: 48px; max-width: 52ch; display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: baseline; }
.more { margin-top: 24px; color: var(--mute); }


/* ---------- Navigation: pages ---------- */
.nav-end { display: flex; align-items: center; gap: 10px; }
.nav-links a[aria-current="page"] { color: var(--ink); border-bottom-color: var(--accent); }
.menu-btn {
  font-family: var(--utility); font-size: 0.8125rem; font-weight: 500; color: var(--ink);
  background: transparent; border: 1px solid var(--line); border-radius: 2px;
  min-height: 40px; padding: 0 14px; cursor: pointer;
}
.nav.menu-open { background: var(--bg); border-bottom-color: var(--line); }
.menu { border-top: 1px solid var(--line); padding: 8px var(--pad-right) 20px var(--gap); max-width: calc(1200px + var(--gutter) + var(--gap) + var(--pad-right)); margin: 0 auto; }
.menu[hidden] { display: none; }
.menu a {
  display: block; padding: 14px 0; border-bottom: 1px solid var(--line);
  font-family: var(--display); font-weight: 500; font-size: 1.25rem; line-height: 1.2; text-decoration: none;
}
.menu a[aria-current="page"] { color: var(--accent); }
@media (min-width: 1100px) { .menu-btn, .menu { display: none !important; } }

/* ---------- Page heads ---------- */
.page-head { padding-top: 56px; padding-bottom: var(--section); display: grid; gap: 28px; align-content: start; }
.page-head .eyebrow { font-family: var(--utility); font-size: 0.8125rem; color: var(--mute); }
.page-head h1 { max-width: 16ch; }
.ph-text { display: grid; gap: 24px; align-content: start; }
@media (min-width: 900px) {
  .page-head { padding-top: 88px; }
  .ph-split { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 64px; align-items: end; }
}
.facts { background: var(--surface); border-radius: 2px; padding: 28px; display: grid; gap: 20px; }
.facts dt { font-family: var(--utility); font-size: 0.8125rem; color: var(--mute); margin-bottom: 2px; }
.facts dd { font-size: 1rem; }

/* Events: steps */
.steps { display: grid; gap: 36px; }
@media (min-width: 760px) { .steps { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; } }
.step { display: grid; gap: 14px; align-content: start; }
.step-top { display: flex; align-items: center; gap: 12px; }
.step-top .n {
  width: 40px; height: 40px; flex: none; display: grid; place-items: center; border-radius: 50%;
  border: 2px solid var(--accent); font-family: var(--utility); font-size: 0.875rem; font-weight: 500;
}
.step-top .ln { flex: 1; height: 2px; background: var(--line); }
.step:last-child .ln { display: none; }
@media (max-width: 759px) { .step-top .ln { display: none; } }
.step p { color: var(--mute); max-width: 32ch; }
.empty { display: grid; gap: 12px; padding: 32px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.empty p { max-width: 52ch; color: var(--mute); }

/* Home: routes */
.route {
  display: grid; gap: 6px 24px; padding: 28px 0; border-top: 1px solid var(--line);
  text-decoration: none; color: inherit;
}
.routes { border-bottom: 1px solid var(--line); }
.route p { color: var(--mute); }
@media (min-width: 760px) { .route { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: baseline; } }
@media (hover: hover) and (pointer: fine) {
  .route { position: relative; isolation: isolate; }
  .route::before { content: ""; position: absolute; z-index: -1; inset: 0 -16px; background: var(--surface); opacity: 0; transition: opacity 0.2s ease; }
  .route::after { content: ""; position: absolute; left: -16px; top: 0; bottom: 0; width: 4px; background: var(--accent); transform: scaleY(0); transform-origin: top; transition: transform 0.25s cubic-bezier(0.2, 0.8, 0.2, 1); }
  .route:hover::before { opacity: 1; } .route:hover::after { transform: scaleY(1); }
}

/* Learn: track bands */
.track { display: grid; gap: 32px; padding-block: 56px; border-top: 1px solid var(--line); align-items: center; }
.track .art { aspect-ratio: 3 / 2; }
.track-text { display: grid; gap: 16px; align-content: center; }
.track-text .util { color: var(--mute); }
.track-text p { max-width: 46ch; }
@media (min-width: 900px) {
  .track { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 72px; padding-block: 72px; }
  .track:nth-child(even) { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); }
  .track:nth-child(even) .art { order: -1; }
}

/* Team: leader */
.leader { display: grid; gap: 32px; align-items: end; }
.leader .slot { aspect-ratio: 1; }
.leader-text { display: grid; gap: 18px; align-content: end; justify-items: start; }
.leader-text .role { font-family: var(--utility); font-size: 0.875rem; color: var(--mute); }
.leader-text p { max-width: 44ch; }
@media (min-width: 900px) { .leader { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 72px; } }
.seats { display: grid; gap: 32px 20px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 760px) { .seats { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* Join: panels */
.panels { display: grid; gap: 20px; }
@media (min-width: 900px) { .panels { grid-template-columns: 1fr 1fr; gap: 24px; } }
.panel { padding: 40px 32px; display: grid; gap: 20px; align-content: start; justify-items: start; border-radius: 2px; }
.panel p { max-width: 42ch; }
.panel--fill { background: var(--surface); }
.panel--line { border: 1px solid var(--line); }
.find { display: grid; gap: 40px; }
.find dl { display: grid; gap: 22px; }
.find dt { font-family: var(--utility); font-size: 0.8125rem; color: var(--mute); margin-bottom: 4px; }
.map.wide { min-height: 380px; }
@media (min-width: 900px) { .map.wide { min-height: 460px; } }

/* Footer links */
.foot-right { display: grid; gap: 16px; justify-items: start; }
.foot-nav { display: flex; flex-wrap: wrap; gap: 8px 24px; }
@media (min-width: 900px) { .foot-right { justify-items: end; } }

/* ---------- Reveal ---------- */
.js [data-reveal] { opacity: 0; transform: translateY(16px); transition: opacity 0.5s ease, transform 0.5s ease; }
.js [data-reveal].in { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  .js [data-reveal] { opacity: 1; transform: none; transition: none; }
  .js .chip .c, .js .hero-text > *, .js .hero-media { animation: none; }
  .btn, .btn:hover { transition: none; transform: none; }
  #trace .pad { transition: none; }
}

/* ---------- Polish ---------- */
/* Film grain: static, faint */
body::after {
  content: ""; position: fixed; inset: 0; z-index: 60; pointer-events: none;
  opacity: 0.06;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.93  0 0 0 0 0.97  0 0 0 0 0.93  0 0 0 0.9 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}

/* Nav: clear over the hero, a quiet blurred bar after it */
.nav {
  background: transparent; border-bottom-color: transparent;
  transition: background-color 0.3s ease, border-color 0.3s ease;
}
.nav.is-scrolled {
  background: color-mix(in oklch, var(--bg) 92%, transparent);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  border-bottom-color: var(--line);
}
.nav-links a { padding-block: 6px; border-bottom: 2px solid transparent; transition: color 0.2s ease, border-color 0.2s ease; }
.nav-links a:hover { border-bottom-color: var(--accent); }

/* Reveals are driven by GSAP when it is present */
html.gsap [data-reveal] { transition: none; }

/* Row hover: a surface wash and a copper tick */
@media (hover: hover) and (pointer: fine) {
  .event, .topic, .past-row { position: relative; isolation: isolate; }
  .event::before, .topic::before, .past-row::before {
    content: ""; position: absolute; z-index: -1; inset: 0 -16px;
    background: var(--surface); opacity: 0; transition: opacity 0.2s ease;
  }
  .event::after, .topic::after, .past-row::after {
    content: ""; position: absolute; left: -16px; top: 0; bottom: 0; width: 4px;
    background: var(--accent); transform: scaleY(0); transform-origin: top;
    transition: transform 0.25s cubic-bezier(0.2, 0.8, 0.2, 1);
  }
  .event:hover::before, .topic:hover::before, .past-row:hover::before { opacity: 1; }
  .event:hover::after, .topic:hover::after, .past-row:hover::after { transform: scaleY(1); }
}

/* Custom cursor: fine pointers only, added by script */
.has-cursor, .has-cursor * { cursor: none !important; }
.cursor-dot, .cursor-ring {
  position: fixed; left: 0; top: 0; z-index: 100; pointer-events: none;
  border-radius: 50%; opacity: 0; transition: opacity 0.2s ease;
}
.cursor-dot { width: 8px; height: 8px; margin: -4px 0 0 -4px; background: var(--accent); }
.cursor-dot.on-btn { background: var(--bg); }
.cursor-ring {
  width: 34px; height: 34px; margin: -17px 0 0 -17px;
  border: 1.5px solid var(--accent);
  transition: opacity 0.2s ease, width 0.25s ease, height 0.25s ease, margin 0.25s ease, background-color 0.25s ease;
}
.cursor-ring.on-link {
  width: 60px; height: 60px; margin: -30px 0 0 -30px;
  background: color-mix(in oklch, var(--accent) 14%, transparent);
}
.cursor-dot.show, .cursor-ring.show { opacity: 1; }

@media (prefers-reduced-motion: reduce) {
  .nav, .nav-links a { transition: none; }
  .event::before, .topic::before, .past-row::before, .event::after, .topic::after, .past-row::after { transition: none; }
  .cursor-dot, .cursor-ring { display: none; }
  .route::before, .route::after { transition: none; }
}