/* ============================================================
   AI Safety Seeding Initiative: design system
   Warm paper base, pine-green ink, wheat-yellow highlight.
   Type: Newsreader (display serif) / Inter (body) / IBM Plex Mono (small labels).
   ============================================================ */

:root {
  /* color */
  --paper:       #FBF8F0;
  --paper-deep:  #F3EEDF;
  --ink:         #22331F;
  --ink-soft:    #55654F;
  --ink-faint:   #8A957F;
  --green:       #2E6B3F;
  --green-deep:  #1F4229;
  /* Seed / wheat accents: deliberately earthier than a bright yellow.
     The deep shade clears 4.5:1 on paper, so it is safe for fine UI marks. */
  --yellow:      #B88720;
  --yellow-deep: #8E6817;
  --yellow-soft: #F1E4BC;
  --rule:        #E2DCC6;

  /* type */
  --serif: "Newsreader", Georgia, serif;
  --sans:  "Inter", -apple-system, "Segoe UI", sans-serif;
  --mono:  "IBM Plex Mono", ui-monospace, "SF Mono", monospace;

  /* layout */
  --col: 42rem;
  --col-wide: 60rem;
  --pad: 1.5rem;
}

* { box-sizing: border-box; }

/* author display rules must never defeat the hidden attribute */
[hidden] { display: none !important; }

html { scroll-behavior: smooth; scroll-padding-top: 5rem; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 1.0625rem;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* soft color blooms behind everything: greens and yellows with
   a hint of gold and sky. Tune with --bloom-opacity via ?tune */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  opacity: var(--bloom-opacity, 1);
  background:
    radial-gradient(55rem 38rem at 82% -8%, rgba(184, 135, 32, 0.18), transparent 65%),
    radial-gradient(48rem 42rem at -12% 26%, rgba(46, 107, 63, 0.15), transparent 65%),
    radial-gradient(46rem 36rem at 108% 76%, rgba(142, 104, 23, 0.10), transparent 70%),
    radial-gradient(42rem 34rem at 16% 108%, rgba(108, 172, 228, 0.09), transparent 70%);
}

/* paper grain: sits behind the content, over the page background */
body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  opacity: var(--grain-opacity, 0.075);
  background-image: var(--grain-img, url("data:image/png;base64,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"));
  background-size: var(--grain-size, 130px) var(--grain-size, 130px);
}

::selection { background: var(--yellow-soft); }

h1, h2, h3 { font-family: var(--serif); font-weight: 500; margin: 0; }

a { color: var(--green); text-decoration-color: color-mix(in srgb, var(--green) 40%, transparent); text-underline-offset: 3px; }
a:hover { text-decoration-color: var(--green); }

/* ── header ─────────────────────────────────────────────── */

.site-banner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.5rem 1.1rem;
  background: var(--green-deep);
  color: var(--paper);
  font-family: var(--mono);
  font-size: 0.88rem;
  letter-spacing: 0.02em;
  text-align: center;
  padding: 0.85rem 3.25rem;
  position: relative;
}
.site-banner p { margin: 0; }
.banner-btn {
  flex: none;
  background: var(--paper);
  color: var(--green-deep);
  text-decoration: none;
  font-size: 0.8rem;
  font-weight: 500;
  padding: 0.4rem 1rem;
  border-radius: 4px;
}
.banner-btn:hover { background: var(--paper-deep); }
.banner-x {
  position: absolute;
  right: 0.7rem;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  color: var(--paper);
  font-size: 1.25rem;
  line-height: 1;
  padding: 0.4rem;
  cursor: pointer;
  opacity: 0.65;
}
.banner-x:hover { opacity: 1; }

/* globe zoom/pan controls: invisible until the map is hovered */
.globe-controls {
  position: absolute;
  right: 0.75rem;
  bottom: 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  opacity: 0;
  transition: opacity 0.25s ease;
}
.map-figure:hover .globe-controls,
.globe-controls:focus-within { opacity: 1; }
@media (hover: none) { .globe-controls { opacity: 0.55; } }
.globe-btn {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 1px solid var(--rule);
  background: color-mix(in srgb, var(--paper) 90%, transparent);
  color: var(--ink-soft);
  font-family: var(--mono);
  font-size: 1rem;
  line-height: 1;
  cursor: pointer;
}
.globe-btn:hover { background: var(--paper); color: var(--ink); }

.site-header {
  position: sticky;
  top: 0;
  z-index: 60;
  background: color-mix(in srgb, var(--paper) 92%, transparent);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border-bottom: 1px solid var(--rule);
}
.site-header-inner {
  max-width: var(--col-wide);
  margin: 0 auto;
  padding: 1.25rem var(--pad);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.wordmark {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--serif);
  font-size: 1.3rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1;
  color: var(--ink);
  text-decoration: none;
}
/* raise the seal to the optical center of the caps (serif caps ride high) */
.wordmark-seal { width: 1.7em; height: 1.7em; display: block; transform: translateY(-0.09em); }

.site-nav { display: flex; align-items: center; gap: 0.75rem; }
.btn-small.btn-small-ghost {
  background: transparent;
  color: var(--green-deep);
  border-color: color-mix(in srgb, var(--green-deep) 45%, transparent);
}
.btn-small.btn-small-ghost:hover { background: color-mix(in srgb, var(--yellow-soft) 40%, transparent); border-color: var(--green-deep); }
@media (max-width: 560px) { .site-nav .btn-small-ghost { display: none; } }
.site-nav .btn-small { white-space: nowrap; }

/* ── buttons ────────────────────────────────────────────── */

.btn {
  display: inline-block;
  font-family: var(--sans);
  font-size: 0.95rem;
  font-weight: 500;
  line-height: 1.25;
  padding: 0.75em 1.3em;
  border-radius: 3px;
  border: 1.5px solid var(--green-deep);
  text-decoration: none;
  cursor: pointer;
  transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}
.btn-big {
  font-size: 1.1rem;
  padding: 0.95em 1.6em;
  border-radius: 7px;
  border-color: var(--green-deep);
  box-shadow: 0 3px 0 color-mix(in srgb, var(--ink) 65%, var(--green-deep));
}
.btn-big:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 0 color-mix(in srgb, var(--ink) 65%, var(--green-deep));
}
.btn-big:active {
  transform: translateY(2px);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--ink) 65%, var(--green-deep));
}
.btn-primary {
  background: var(--green);
  color: var(--paper);
  border-color: var(--green-deep);
  box-shadow: 0 4px 0 var(--green-deep), 0 9px 18px color-mix(in srgb, var(--green-deep) 25%, transparent);
}
.btn-primary:hover {
  background: var(--green-deep);
  border-color: var(--green-deep);
  box-shadow: 0 5px 0 var(--ink), 0 12px 22px color-mix(in srgb, var(--green-deep) 30%, transparent);
}
.btn-primary:active { box-shadow: 0 1px 0 var(--ink); }
.btn-ghost { background: transparent; color: var(--green-deep); border-color: color-mix(in srgb, var(--green-deep) 45%, transparent); }
.btn-ghost:hover { border-color: var(--green-deep); background: color-mix(in srgb, var(--yellow-soft) 40%, transparent); }
.btn-refer { background: var(--yellow-soft); color: var(--ink); border-color: var(--yellow-deep); }
.btn-refer:hover { background: var(--yellow); border-color: var(--yellow-deep); box-shadow: 0 2px 12px color-mix(in srgb, var(--yellow-deep) 28%, transparent); }
.btn-small { padding: 0.55em 1em; font-size: 0.85rem; background: var(--green-deep); color: var(--paper); }
.btn-small:hover { background: var(--green); }
.btn:active { transform: translateY(1px); }

/* ── hero ───────────────────────────────────────────────── */

.hero {
  position: relative;
  max-width: var(--col-wide);
  margin: 0 auto;
  padding: clamp(3rem, 8vh, 6rem) var(--pad) clamp(0.75rem, 2vh, 1.25rem);
}

.pollen-field {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}
.pollen {
  position: absolute;
  bottom: -12px;
  border-radius: 50%;
  background: var(--yellow-deep);
  opacity: 0;
  animation: pollen-rise linear infinite;
}
@keyframes pollen-rise {
  0%   { transform: translateY(0); opacity: 0; }
  12%  { opacity: 0.35; }
  85%  { opacity: 0.25; }
  100% { transform: translateY(-78vh); opacity: 0; }
}

.hero-title {
  font-size: clamp(2.2rem, 6vw, 4.2rem);
  line-height: 1.08;
  letter-spacing: -0.015em;
  max-width: 18em;
}

/* the typed school name gets its own reserved line so the page never shifts.
   height (not min-height) plus a matched line-height locks the line box so
   swapping fonts (different ascent/descent per family) can't resize it */
.hero-school-line {
  display: block;
  white-space: nowrap;
  height: 1.18em;
  line-height: 1.18em;
  overflow: visible;
}
.hero-change-line {
  display: block;
  margin-top: 0.2em;
  color: var(--ink);
}

/* rotator, caret and period are plain inline so they share one
   baseline; the fixed-height container above absorbs any per-font
   metric differences without moving the rest of the page */
.school-rotator {
  color: var(--ink);
}

.type-caret {
  display: inline-block;
  width: 0.05em;
  min-width: 3px;
  height: 0.82em;
  background: var(--ink);
  margin-left: 0.08em;
  vertical-align: -0.04em;
  animation: caret-blink 1.05s steps(1) infinite;
}
@keyframes caret-blink {
  0%, 49% { opacity: 1; }
  50%, 100% { opacity: 0; }
}

.hero-sub {
  margin: 1.5rem 0 0;
  font-family: var(--serif);
  font-size: 1.3rem;
  line-height: 1.5;
  color: var(--ink-soft);
}

/* ── the wish ───────────────────────────────────────────── */

.wish {
  margin-top: 2.5rem;
  text-align: center;
}
.hero-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.75rem;
}
.hero-actions[hidden] { display: none; }
@media (max-width: 480px) {
  .hero-actions { display: grid; }
  .hero-actions .btn { width: 100%; }
}

.wish-panel {
  max-width: 36rem;
  margin: 0 auto;
  border: 1px solid var(--rule);
  border-radius: 6px;
  background: color-mix(in srgb, var(--yellow-soft) 22%, var(--paper));
  padding: 1.75rem 1.75rem 1.5rem;
  text-align: left;
}
.wish-panel[hidden] { display: none; }

.wish-label {
  display: block;
  font-family: var(--serif);
  font-size: 1.35rem;
  margin-bottom: 0.9rem;
}

.wish-row { display: flex; gap: 0.6rem; }
.wish-row input {
  flex: 1;
  min-width: 0;
  font-family: var(--sans);
  font-size: 1rem;
  padding: 0.65em 0.9em;
  border: 1.5px solid var(--rule);
  border-radius: 6px;
  background: var(--paper);
  color: var(--ink);
  outline: none;
}
.wish-row input:focus { border-color: var(--green); }

@media (max-width: 480px) {
  .wish-panel { padding: 1.25rem; }
  .wish-row { flex-direction: column; }
  .wish-row .btn { width: 100%; }
}

.wish-result[hidden] { display: none; }
.wish-result { margin-top: 0.25rem; }

.wish-verdict {
  font-family: var(--serif);
  font-size: 1.25rem;
  line-height: 1.45;
  margin: 0 0 1.1rem;
  overflow-wrap: break-word; /* pasted garbage can't blow out the layout */
}

.wish-branches {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}
.wish-branches[hidden] { display: none; }
#wish-visit[hidden] { display: none; }

.wish-reset {
  display: block;
  margin-top: 1rem;
  background: none;
  border: none;
  padding: 0;
  color: var(--ink-faint);
  font-family: var(--mono);
  font-size: 0.8rem;
  cursor: pointer;
  border-bottom: 1px dotted currentColor;
}
.wish-reset:hover { color: var(--ink-soft); }

.wish-intl {
  margin: 0.8rem 0 0;
  font-family: var(--mono);
  font-size: 0.75rem;
  color: var(--ink-faint);
}
.wish-intl a { color: var(--ink-soft); }

/* ── sections ───────────────────────────────────────────── */

.section {
  max-width: var(--col-wide);
  margin: 0 auto;
  padding: clamp(2.75rem, 6vh, 4.5rem) var(--pad) 0;
}

.section h2 {
  font-size: clamp(1.7rem, 3.4vw, 2.3rem);
  line-height: 1.15;
  letter-spacing: -0.01em;
  margin-bottom: 0.5rem;
}
/* a short double rule under each heading */
.section h2::after {
  content: "";
  display: block;
  width: 72px;
  height: 4px;
  margin-top: 0.6rem;
  border-top: 1px solid var(--yellow-deep);
  border-bottom: 1px solid var(--yellow-deep);
}

/* ── map ────────────────────────────────────────────────── */

.map-legend {
  display: flex;
  gap: 1.5rem;
  margin: 0.9rem 0 1rem;
  font-family: var(--mono);
  font-size: 0.8rem;
  color: var(--ink-soft);
}
.legend-item { display: inline-flex; align-items: center; gap: 0.5em; }
.legend-dot { width: 0.65em; height: 0.65em; border-radius: 50%; }
.legend-has { background: var(--green); }
.legend-needs { background: var(--paper); border: 2px solid var(--yellow-deep); }

.map-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(15rem, 1fr);
  gap: 2rem;
  align-items: stretch;
}
@media (max-width: 1000px) {
  .map-layout { grid-template-columns: 1fr; gap: 1.25rem; }
}

.map-figure { position: relative; margin: 0; align-self: center; }
#us-map { display: block; width: 100%; height: auto; }

/* ── school table beside the map ────────────────────────── */

.school-table-wrap {
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.table-search { margin-bottom: 0.5rem; }
.table-search #school-search {
  display: block;
  width: 100%;
  font-family: var(--mono);
  font-size: 0.78rem;
  padding: 0.5em 0.8em;
  border: 1px solid var(--rule);
  border-radius: 5px;
  background: var(--paper);
  color: var(--ink);
  outline: none;
}
.table-search #school-search::placeholder { color: var(--ink-faint); }
.table-search #school-search:focus { border-color: var(--green); }

.school-table-scroll {
  flex: 1;
  min-height: 0;
  max-height: min(30rem, 68vh);
  overflow-y: auto;
  border: 1px solid var(--rule);
  border-radius: 6px;
  background: var(--paper);
  scrollbar-width: thin;
  scrollbar-color: transparent transparent;
}
/* the scrollbar keeps its lane but only shows its thumb on hover,
   so the idle auto-scroll stays clean while dragging stays possible */
.school-table-scroll:hover,
.school-table-scroll.is-searching {
  scrollbar-color: color-mix(in srgb, var(--green) 45%, transparent) transparent;
}
.school-table-scroll::-webkit-scrollbar { width: 10px; }
.school-table-scroll::-webkit-scrollbar-track { background: transparent; }
.school-table-scroll::-webkit-scrollbar-thumb {
  background-color: transparent;
  border-radius: 99px;
  border: 2.5px solid transparent;
  background-clip: padding-box;
}
.school-table-scroll:hover::-webkit-scrollbar-thumb,
.school-table-scroll.is-searching::-webkit-scrollbar-thumb {
  background-color: color-mix(in srgb, var(--green) 45%, transparent);
}
.school-table-scroll::-webkit-scrollbar-thumb:hover,
.school-table-scroll::-webkit-scrollbar-thumb:active {
  background-color: var(--green);
}
/* touch screens have no scrollbar to grab, so an always-scrollable
   table would swallow the page swipe; keep it inert until a search */
@media (hover: none) {
  .school-table-scroll { overflow-y: hidden; }
  .school-table-scroll.is-searching { overflow-y: auto; }
}
@media (max-width: 1000px) { .school-table-scroll { max-height: min(20rem, 55vh); } }

.school-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.82rem;
  /* fixed layout so long school names can't shove the other
     columns past the edge; they ellipsize instead */
  table-layout: fixed;
}
.school-table th:nth-child(2) { width: 6.9em; }
.school-table th:nth-child(3) { width: 5.9em; }
.school-table th {
  position: sticky;
  top: 0;
  background: var(--paper-deep);
  font-family: var(--mono);
  font-weight: 500;
  font-size: 0.72rem;
  color: var(--ink-soft);
  text-align: left;
  padding: 0.55em 0.7em;
  border-bottom: 1px solid var(--rule);
}
.school-table td {
  padding: 0.42em 0.7em;
  border-bottom: 1px solid color-mix(in srgb, var(--rule) 55%, transparent);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.school-table tr:last-child td { border-bottom: none; }
.school-table .t-num {
  text-align: right;
  font-family: var(--mono);
  font-size: 0.78rem;
  color: var(--ink-soft);
}
.school-table .t-status {
  font-family: var(--mono);
  font-size: 0.72rem;
}
.row-has .t-status { color: var(--green); }
.t-status a {
  color: inherit;
  text-decoration: underline dotted;
  text-underline-offset: 2px;
}
.row-needs .t-status {
  color: var(--yellow-deep);
  text-decoration: underline dotted;
}

.school-table tbody tr { cursor: pointer; }
.school-table tbody tr:hover { background: color-mix(in srgb, var(--yellow-soft) 35%, transparent); }
.row-needs:hover .t-status { color: var(--green); }

.t-dot {
  display: inline-block;
  width: 0.55em;
  height: 0.55em;
  border-radius: 50%;
  margin-right: 0.55em;
  vertical-align: 0.02em;
  background: var(--green);
}
.row-needs .t-dot {
  background: var(--paper);
  border: 1.5px solid var(--yellow-deep);
}

.table-note {
  margin: 0.6rem 0 0;
  font-family: var(--mono);
  font-size: 0.72rem;
  color: var(--ink-faint);
}

.us-outline {
  /* light sage so the country reads as a shape against the paper,
     not just a watermark; tint tracks the brand green */
  fill: color-mix(in srgb, var(--green) 16%, var(--paper));
  stroke: color-mix(in srgb, var(--green) 30%, var(--rule));
  stroke-width: 1;
}

/* ── globe experiment (intl-globe branch) ──────────────── */
/* land/ocean draw on a canvas below the dot SVG (perf: no per-frame
   SVG path strings); both stack inside the relative .map-figure */
.globe-canvas { position: absolute; inset: 0; }
#us-map { position: relative; }
.dot-partner {
  fill: var(--paper);
  stroke: var(--ink-faint);
  stroke-width: 2;
  cursor: default;
  transition: stroke-width 0.15s ease;
}
.legend-partner { background: var(--paper); border: 2px solid var(--ink-faint); }
.globe-region-label {
  position: absolute;
  left: 0.4rem;
  bottom: 0.2rem;
  margin: 0;
  font-family: var(--mono);
  font-size: 0.75rem;
  letter-spacing: 0.05em;
  color: var(--ink-faint);
  opacity: 0;
  transition: opacity 0.6s ease;
  pointer-events: none;
}
.globe-region-label.is-visible { opacity: 1; }

.dot-has { opacity: 0.8; }
.dot-has.is-link { cursor: pointer; }

.dot-needs {
  fill: var(--paper);
  stroke: var(--yellow-deep);
  stroke-width: 2.5;
  cursor: pointer;
  transition: stroke-width 0.15s ease;
}
.dot-halo {
  fill: none;
  stroke: var(--yellow-deep);
  stroke-width: 1.5;
  opacity: 0;
  pointer-events: none;
  transform-box: fill-box;
  transform-origin: center;
  animation: halo 3.4s ease-out infinite;
}
@keyframes halo {
  0%   { transform: scale(1);   opacity: 0.5; }
  70%  { transform: scale(2.6); opacity: 0; }
  100% { transform: scale(2.6); opacity: 0; }
}

.dot-hit { fill: transparent; cursor: pointer; }

.map-tooltip {
  position: absolute;
  pointer-events: none;
  background: var(--ink);
  color: var(--paper);
  font-family: var(--mono);
  font-size: 0.78rem;
  padding: 0.35em 0.7em;
  border-radius: 4px;
  white-space: nowrap;
  transform: translate(-50%, -140%);
  z-index: 2;
}
.map-tooltip[hidden] { display: none; }

.map-caption {
  margin: 0.75rem 0 0;
  font-family: var(--serif);
  font-style: italic;
  font-size: 1.05rem;
  color: var(--ink-soft);
}

.map-fallback {
  border: 1px dashed var(--rule);
  border-radius: 8px;
  padding: 2rem;
  font-family: var(--mono);
  font-size: 0.85rem;
  color: var(--ink-faint);
}

/* ── stats ──────────────────────────────────────────────── */

/* the lone stat, tucked under the school table */
.stat-aside {
  margin-top: 1.25rem;
  display: flex;
  align-items: center;
  gap: 1rem;
  border: 1px solid var(--rule);
  border-radius: 6px;
  background: var(--paper);
  padding: 0.85rem 1.1rem;
}
.stat-aside-figure {
  margin: 0;
  font-family: var(--serif);
  font-size: 1.9rem;
  line-height: 1;
  color: var(--green-deep);
}
.stat-aside-text { margin: 0; font-size: 0.88rem; color: var(--ink-soft); }

/* ── timeline ───────────────────────────────────────────── */

.timeline {
  list-style: none;
  margin: 2rem 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2.5rem;
  position: relative;
}
@media (max-width: 720px) { .timeline { grid-template-columns: 1fr; gap: 2rem; } }

.timeline-step { position: relative; padding-top: 1.4rem; }
.timeline-step::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 0.85rem; height: 0.85rem;
  border-radius: 50%;
  background: var(--yellow);
  border: 2.5px solid var(--green-deep);
}
.timeline-step::after {
  content: "";
  position: absolute;
  top: 0.42rem; left: 1.4rem; right: -2rem;
  border-top: 2px dotted var(--rule);
}
.timeline-step:last-child::after { display: none; }
@media (max-width: 720px) {
  .timeline-step::after { display: none; }
}

.timeline-when {
  font-family: var(--mono);
  font-size: 0.82rem;
  color: var(--green);
  margin: 0.5rem 0 0.2rem;
}
.timeline-step h3 { font-size: 1.35rem; margin-bottom: 0.35rem; }
.timeline-step p:not(.timeline-when) { margin: 0; font-size: 0.95rem; color: var(--ink-soft); }

/* ── people + booking ───────────────────────────────────── */

.book-sub, .section-sub { margin: 0.75rem 0 1.75rem; font-family: var(--serif); font-size: 1.15rem; color: var(--ink-soft); }
.book-alt { margin: 1.75rem 0 0; font-family: var(--serif); font-size: 1.05rem; color: var(--ink-soft); }
.who-kairos { margin: 2rem 0 0; font-family: var(--serif); font-size: 1.15rem; color: var(--ink-soft); }
/* follow-on line to .who-kairos, so it sits closer than a new block would */
.who-writeup { margin: 0.75rem 0 0; font-family: var(--serif); font-size: 1.15rem; color: var(--ink-soft); }
.funded-by { display: flex; align-items: center; gap: 0.7rem; }
.funded-by-label { font-family: var(--mono); font-size: 0.78rem; color: var(--ink-faint); line-height: 1; transform: translateY(1px); }
/* grayscale keeps the purple mark from fighting the green/cream palette;
   it colors up on hover so it still reads as a real link */
.funded-by img { display: block; height: 24px; width: auto; filter: grayscale(1); opacity: 0.6; transition: filter 0.2s ease, opacity 0.2s ease; }
.funded-by a:hover img { filter: none; opacity: 1; }
.hero-funded { margin: 2.5rem 0 0; justify-content: center; }

.founder-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 15rem));
  justify-content: center;
  gap: 1.25rem;
}
@media (max-width: 720px) { .founder-row { gap: 0.75rem; } }

.founder-card {
  display: block;
  border: 1px solid var(--rule);
  border-radius: 6px;
  padding: 1.5rem 1rem 1.25rem;
  background: var(--paper);
  text-align: center;
  text-decoration: none;
  color: inherit;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.founder-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 3px 14px color-mix(in srgb, var(--ink) 10%, transparent);
}

.founder-photo {
  position: relative;
  width: 6.5rem; height: 6.5rem;
  margin: 0 auto 0.9rem;
  border-radius: 50%;
  overflow: hidden;
  background: var(--paper-deep);
  border: 1px solid var(--rule);
}
.founder-photo img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: 1;
}
.founder-initials {
  position: absolute; inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--serif);
  font-size: 2rem;
  color: var(--ink-faint);
}

.founder-name { font-family: var(--serif); font-size: 1.15rem; font-weight: 600; margin: 0; }
.founder-school {
  font-family: var(--mono);
  font-size: 0.78rem;
  color: var(--green);
  margin: 0.3rem 0 0;
}
.school-short { display: none; }

/* The advisor row mirrors the "funded by" pattern in the hero: a small mono
   label, then bare circular photos with names, no cards. */
.advisor-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.6rem 1.6rem;
  margin-top: 1.75rem;
}
.advisor-label {
  font-family: var(--mono);
  font-size: 0.78rem;
  color: var(--ink-faint);
  line-height: 1;
}
.advisor {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  text-decoration: none;
  color: inherit;
}
.advisor-photo {
  display: block;
  width: 2.4rem; height: 2.4rem;
  border-radius: 50%;
  overflow: hidden;
  background: var(--paper-deep);
  border: 1px solid var(--rule);
  flex: none;
}
.advisor-photo img {
  display: block;
  width: 100%; height: 100%;
  object-fit: cover;
}
.advisor-name {
  font-family: var(--serif);
  font-size: 1rem;
  white-space: nowrap;
}
.advisor:hover .advisor-name { text-decoration: underline; text-underline-offset: 3px; }
/* the advisors get more visual weight than the volunteer row below */
.advisor-row-lg .advisor-photo { width: 3.6rem; height: 3.6rem; }
.advisor-row-lg .advisor-name { font-size: 1.2rem; }
.advisor-row-tight { margin-top: 1rem; }
@media (max-width: 560px) {
  .advisor-label { width: 100%; text-align: center; }
  .advisor-row { gap: 0.9rem 1.4rem; }
}

/* On phones, the founders remain horizontal. They keep distinct cards,
   but scale down together rather than becoming a long vertical stack. */
@media (max-width: 480px) {
  .founder-row {
    gap: 0.4rem;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
  }
  .founder-card {
    min-width: 0;
    border: 1px solid var(--rule);
    border-radius: 6px;
    padding: 0.75rem 0.3rem 0.7rem;
  }
  .founder-photo {
    width: clamp(3rem, 15vw, 4.3rem);
    height: clamp(3rem, 15vw, 4.3rem);
    margin-bottom: 0.5rem;
  }
  .founder-name {
    font-size: clamp(0.76rem, 3.35vw, 1rem);
    line-height: 1.1;
    letter-spacing: -0.02em;
  }
  .founder-school { display: block; margin-top: 0.3rem; font-size: clamp(0.62rem, 2.7vw, 0.75rem); }
  .school-full { display: none; }
  .school-short { display: inline; }
}

.cal-wrap {
  margin-top: 1.5rem;
  border: 1px solid var(--rule);
  border-radius: 6px;
  overflow: hidden;
  background: #fff;
  min-height: 24rem;
}

.cal-placeholder {
  min-height: 24rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  text-align: center;
  padding: 2rem;
  background:
    repeating-linear-gradient(-45deg, transparent 0 14px, color-mix(in srgb, var(--rule) 40%, transparent) 14px 15px),
    var(--paper);
}
.cal-placeholder p { margin: 0; color: var(--ink-soft); max-width: 30em; }
.cal-placeholder .mono-note { font-family: var(--mono); font-size: 0.8rem; color: var(--ink-faint); }

/* ── pull quote (slot for a real testimonial) ───────────── */

.pull-quote {
  margin: 2.75rem 0 0;
  max-width: var(--col);
  padding-left: 1.25rem;
  border-left: 2px solid var(--yellow-deep);
}
.pull-quote blockquote {
  margin: 0;
  font-family: var(--serif);
  font-size: 1.5rem;
  line-height: 1.4;
}
.pull-quote figcaption { margin-top: 0.75rem; font-size: 0.9rem; color: var(--ink-soft); }

/* obviously-unfinished look until a real quote lands */
.quote-placeholder { border-left-style: dashed; border-left-color: var(--rule); }
.quote-placeholder blockquote { color: var(--ink-faint); }
.quote-placeholder figcaption { font-family: var(--mono); font-size: 0.78rem; color: var(--ink-faint); }

/* ── booking gate: school first, then the calendar ──────── */

.book-gate {
  max-width: 34rem;
  margin: 0 0 1.5rem;
}
.book-gate-label {
  display: block;
  font-family: var(--serif);
  font-size: 1.25rem;
  margin-bottom: 0.75rem;
}
.book-bypass {
  display: block;
  margin-top: 0.9rem;
  background: none;
  border: none;
  padding: 0;
  color: var(--ink-faint);
  font-family: var(--mono);
  font-size: 0.8rem;
  cursor: pointer;
  border-bottom: 1px dotted currentColor;
}
.book-bypass:hover { color: var(--ink-soft); }

.book-status {
  margin: 0 0 0.4rem;
  font-family: var(--serif);
  font-size: 1.1rem;
}
.book-status .book-bypass { display: inline; margin: 0 0 0 0.6rem; }
.book-person {
  margin: 0 0 1.25rem;
  color: var(--ink-soft);
  font-size: 0.95rem;
}

/* the locked preview: real calendar, blurred, veiled, inert */
.cal-preview { position: relative; min-height: 26rem; overflow: hidden; }
.cal-preview-embed {
  filter: blur(3px) saturate(0.7);
  opacity: 0.7;
  pointer-events: none;
  user-select: none;
  min-height: 26rem;
}
/* static stand-in for the blurred scheduler: pure CSS, so first
   paint costs nothing; warmPreview() swaps in the real embed */
.cal-facade {
  display: flex;
  gap: 2.25rem;
  background: #fff;
  border-radius: 10px;
  padding: 2.25rem;
  min-height: 26rem;
  box-sizing: border-box;
}
.facade-side {
  width: 26%;
  display: flex;
  flex-direction: column;
  gap: 0.9rem;
}
.facade-title { height: 20px; width: 78%; border-radius: 4px; background: #c8c5ba; }
.facade-line { height: 11px; width: 92%; border-radius: 4px; background: #e7e5dc; }
.facade-line-short { width: 58%; }
/* dot grid roughly where the mini month calendar sits */
.facade-month {
  margin-top: auto;
  height: 9.5rem;
  border-radius: 6px;
  background: radial-gradient(circle, #dcd9ce 4px, transparent 5px) 0 0 / 24px 24px;
}
.facade-main { flex: 1; display: flex; flex-direction: column; gap: 1rem; }
.facade-head { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.1rem; }
.facade-head span { height: 13px; width: 55%; margin: 0 auto; border-radius: 4px; background: #d6d3c8; }
.facade-grid {
  flex: 1;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.1rem;
}
.facade-col {
  border-radius: 6px;
  background: repeating-linear-gradient(180deg, #e6ebe6 0 34px, transparent 34px 46px);
}
@media (max-width: 560px) { .facade-side { display: none; } }
.cal-preview-veil {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem;
  cursor: pointer;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--paper) 20%, transparent),
    color-mix(in srgb, var(--paper) 75%, transparent)
  );
}
.cal-preview-note {
  margin: 0;
  font-family: var(--serif);
  font-size: 1.25rem;
  background: var(--paper);
  border: 1px solid var(--rule);
  border-radius: 8px;
  padding: 0.85em 1.3em;
  box-shadow: 0 4px 18px color-mix(in srgb, var(--ink) 10%, transparent);
}
/* "this school already has a group" notice above the calendar */
.book-group-note {
  margin: 0 0 1.25rem;
  max-width: 44rem;
  font-family: var(--serif);
  font-size: 1.05rem;
  color: var(--ink-soft);
  border: 1px solid var(--rule);
  border-left: 3px solid var(--yellow-deep);
  border-radius: 6px;
  padding: 0.8em 1.1em;
  background: color-mix(in srgb, var(--yellow-soft) 25%, var(--paper));
}

.book-gate-error {
  margin: 0.6rem 0 0;
  font-family: var(--serif);
  font-style: italic;
  color: var(--ink-soft);
}

/* ── FAQ ─────────────────────────────────────────────────── */

/* Questions use the full centered content column, so their controls land on
   a shared right edge. Expanded answers keep a shorter reading measure. */
.faq { max-width: var(--col-wide); margin-top: 2rem; }
.faq-item {
  padding: 0;
  border-top: 1px solid var(--rule);
}
.faq-item:first-child { border-top: none; }
.faq-item summary {
  position: relative;
  padding: 1.15rem 2.25rem 1.15rem 0;
  font-family: var(--serif);
  font-size: 1.2rem;
  font-weight: 500;
  cursor: pointer;
  list-style: none;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after {
  content: "+";
  position: absolute;
  right: 0.2rem;
  color: var(--yellow-deep);
  font-family: var(--mono);
  font-size: 1.25rem;
  line-height: 1;
}
.faq-item[open] summary::after { content: "−"; }
.faq-item summary:focus-visible { outline: 2px solid var(--yellow-deep); outline-offset: -2px; }
.faq-item[open] summary { padding-bottom: 0.55rem; }
.faq-item p {
  padding: 0 2.25rem 1.35rem 0;
}
.faq-callout {
  max-width: var(--col-wide);
  margin-top: 1.5rem;
  padding: 1.25rem 1.4rem;
  border: 1px solid var(--rule);
  border-radius: 6px;
  background: color-mix(in srgb, var(--yellow-soft) 24%, var(--paper));
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.faq-callout p { margin: 0; font-family: var(--serif); font-size: 1.15rem; }
@media (max-width: 560px) {
  .faq-callout { align-items: flex-start; flex-direction: column; }
}

/* ── directory strip ────────────────────────────────────── */

.school-page-index {
  max-width: var(--col-wide);
  margin: clamp(2rem, 5vh, 3.5rem) auto 0;
  padding: 2rem var(--pad) 2.5rem;
  border-top: 1px solid var(--rule);
  text-align: center;
  font-family: var(--mono);
  font-size: 0.75rem;
  line-height: 2;
  color: var(--ink-faint);
}
.school-page-index-title { margin: 0 0 0.4rem; }
.school-page-index-links { margin: 0; }
.school-page-index-links a { color: var(--ink-soft); text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--ink-soft) 40%, transparent); text-underline-offset: 3px; }
.school-page-index-links a:hover { text-decoration-color: var(--ink-soft); }

/* ── footer ─────────────────────────────────────────────── */

.site-footer {
  max-width: var(--col-wide);
  margin: clamp(3rem, 7vh, 5rem) auto 0;
  padding: 2.5rem var(--pad) 3rem;
  border-top: 3px double var(--rule);
  font-size: 0.9rem;
  color: var(--ink-soft);
}
.footer-sponsor { margin: 1.25rem 0 0; font-family: var(--mono); font-size: 0.78rem; color: var(--ink-faint); }
.footer-people { margin: 0 0 0.6rem; font-family: var(--mono); font-size: 0.78rem; color: var(--ink-faint); }
.footer-links { margin: 0 0 0.4rem; }
.footer-join { margin: 0; }

/* ── tuning panel (?tune) ───────────────────────────────── */

.tune-panel {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  z-index: 105;
  width: 15.5rem;
  background: var(--ink);
  color: var(--paper);
  font-family: var(--mono);
  font-size: 0.72rem;
  padding: 0.9rem 1rem;
  border-radius: 6px;
  box-shadow: 0 4px 18px color-mix(in srgb, var(--ink) 35%, transparent);
  display: grid;
  gap: 0.55rem;
}
.tune-panel label { display: grid; gap: 0.2rem; }
.tune-panel input[type="range"] { width: 100%; accent-color: var(--yellow); }
.tune-panel .tune-patterns { display: flex; gap: 0.4rem; }
.tune-panel .tune-patterns button {
  flex: 1;
  font-family: var(--mono);
  font-size: 0.72rem;
  padding: 0.3em 0;
  border: 1px solid color-mix(in srgb, var(--paper) 35%, transparent);
  border-radius: 5px;
  background: none;
  color: var(--paper);
  cursor: pointer;
}
.tune-panel .tune-patterns button.is-active {
  background: var(--yellow);
  color: var(--ink);
  border-color: var(--yellow);
}
.tune-readout {
  color: var(--yellow-soft);
  user-select: all;
  line-height: 1.5;
}

/* ── edit mode (?edit) ──────────────────────────────────── */

.edit-bar {
  position: fixed;
  left: 50%;
  bottom: 1.25rem;
  transform: translateX(-50%);
  z-index: 100;
  display: flex;
  align-items: center;
  gap: 1rem;
  background: var(--ink);
  color: var(--paper);
  font-family: var(--mono);
  font-size: 0.8rem;
  padding: 0.6rem 1rem;
  border-radius: 8px;
  box-shadow: 0 4px 18px color-mix(in srgb, var(--ink) 35%, transparent);
}
.edit-bar button {
  font-family: var(--mono);
  font-size: 0.8rem;
  background: var(--yellow);
  color: var(--ink);
  border: none;
  border-radius: 5px;
  padding: 0.4em 0.8em;
  cursor: pointer;
}
.edit-bar a { color: var(--yellow-soft); }

/* ── reveal on scroll ───────────────────────────────────── */

.reveal {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 0.55s ease, transform 0.55s ease;
}
.reveal.is-visible { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
  .type-caret { animation: none; }
  .dot-halo { animation: none; }
  .pollen { animation: none; display: none; }
  .btn-big, .btn-big:hover, .btn-big:active { transform: none; }
}
