/*
 * The BBOP Center theme.css — the whole visual world for stoa.works/bbopcenter.
 *
 * Non-obvious decisions this file embodies:
 * - The logo's warm colors remain as small signals, while navy, aqua, white,
 *   and cool blue create the clear, future-facing product layer.
 * - A short gradient signal line replaces repeated leaf icons in controls.
 * - Type is fluid (clamp(), 360px→1280px anchors) and vertical rhythm is one
 *   --line unit derived from the body step, so gaps hold their ratio to the
 *   type at every width. Display type tightens at the top of the scale.
 * - ALL motion (reveal, spotlight drift, leaf draw) lives inside
 *   `prefers-reduced-motion: no-preference` AND `html.js`, so the still page
 *   is complete with JS off or reduced motion on; nothing is hidden by default.
 * - Joined controls (the omnibox field + button, the front-desk chips) carry
 *   an INSET focus ring so the ring never lands inside a neighbour.
 */

/* ---------- tokens ---------- */
:root {
	--accent: #0d7f78;
	--accent-50: #eafbf8;
	--accent-100: #cff6ef;
	--accent-200: #9debdc;
	--accent-300: #62d7c5;
	--accent-400: #2dbbac;
	--accent-500: #159c92;
	--accent-600: #0d7f78;
	--accent-700: #0a6864;
	--accent-800: #124c59;
	--accent-900: #10233f;

	--canvas: #f7f9fc;
	--card: #ffffff;
	--mat: #eef3f8;
	--ink: #14213d;
	--ink-soft: #4b5d73;
	--line: #d8e1ea;
	--stage: #10233f;
	--stage-ink: #f5fbff;
	--stage-soft: #c6d9e8;

	--teal: #2dd4bf;
	--teal-ink: #075d58;
	--teal-wash: #e7fbf7;
	--spark: #ff8a24;
	--verm: #ef5a4c;

	--notice-bg: #2a1a06;   /* the one status family: amber on ink */
	--notice-text: #fbe3b0;

	--display: "Sora", "Helvetica Neue", Arial, sans-serif;
	--body: "Onest", "Helvetica Neue", Arial, sans-serif;
	--meta: "Onest", "Helvetica Neue", Arial, sans-serif;

	/* fluid type scale: 360px -> 1280px */
	--fs--1: clamp(0.84rem, 0.8rem + 0.18vw, 0.94rem);
	--fs-0: clamp(1.02rem, 0.96rem + 0.25vw, 1.16rem);
	--fs-1: clamp(1.2rem, 1.1rem + 0.45vw, 1.45rem);
	--fs-2: clamp(1.45rem, 1.28rem + 0.75vw, 1.88rem);
	--fs-3: clamp(1.78rem, 1.5rem + 1.2vw, 2.45rem);
	--fs-4: clamp(2.2rem, 1.7rem + 2.2vw, 3.4rem);
	--fs-5: clamp(2.7rem, 1.9rem + 3.6vw, 4.8rem);
	--leading-body: 1.6;
	--line-unit: calc(var(--fs-0) * var(--leading-body));

	--wrap: 78rem;
	--leaf: 0.9rem;         /* the leaf's one parameter */
	--radius: 14px;
	--shadow: 0 1px 2px rgba(16, 35, 63, 0.06), 0 18px 48px rgba(16, 35, 63, 0.1);
}

/* ---------- base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { font-size: 100%; -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	font-family: var(--body);
	font-size: var(--fs-0);
	line-height: var(--leading-body);
	color: var(--ink);
	background: var(--canvas);
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--accent-700); text-underline-offset: 2px; }
a:hover { color: var(--accent-900); }
:focus-visible { outline: 3px solid var(--accent-600); outline-offset: 2px; border-radius: 2px; }
.stage :focus-visible { outline-color: var(--spark); }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link { position: absolute; left: -999px; top: 0; background: var(--ink); color: #fff; padding: 0.6rem 1rem; z-index: 100; }
.skip-link:focus { left: 0.5rem; top: 0.5rem; }
.wrap { max-width: var(--wrap); margin-inline: auto; padding-inline: 1.1rem; }
.section { padding-block: calc(var(--line-unit) * 2.5); }
.hp { position: absolute; left: -999em; }

h1, h2, h3, h4 { font-family: var(--display); font-weight: 700; line-height: 1.12; margin: 0 0 calc(var(--line-unit) * 0.5); text-wrap: balance; overflow-wrap: break-word; color: var(--ink); }
h1 { font-size: var(--fs-5); letter-spacing: -0.045em; line-height: 1.03; }
.h1--long { font-size: clamp(1.7rem, 1.2rem + 2.2vw, 2.6rem); line-height: 1.16; }
@media (max-width: 480px) { h1 { font-size: clamp(1.9rem, 8.5vw, 2.6rem); } }
h2 { font-size: var(--fs-3); letter-spacing: -0.035em; }
h3 { font-size: var(--fs-1); line-height: 1.22; font-family: var(--body); font-weight: 700; margin-bottom: 0.55rem; }
h4 { font-size: var(--fs-0); font-family: var(--body); font-weight: 700; }
p, ul, ol { margin-block: 0 var(--line-unit); }
p, li, figcaption { text-wrap: pretty; }
.lede { font-size: var(--fs-1); color: var(--ink-soft); max-width: 46ch; line-height: 1.4; }
.fine { font-size: var(--fs--1); color: var(--ink-soft); }
.stage .fine, .stage .lede { color: var(--stage-soft); }
.ledger { font-family: var(--meta); font-size: 0.92em; letter-spacing: 0; font-variant-numeric: tabular-nums; }
strong { font-weight: 700; }

/* ---------- the leaf ---------- */
.leaf {
	display: inline-block;
	width: var(--leaf);
	height: var(--leaf);
	background: var(--accent);
	border-radius: 0 100% 0 100%;
	transform: rotate(-45deg);
	position: relative;
	flex-shrink: 0;
}
.leaf::after { content: ""; position: absolute; left: 50%; top: 12%; bottom: 12%; width: 1px; background: rgba(255, 255, 255, 0.55); transform: translateX(-50%) rotate(45deg); transform-origin: center; }
.leaf--brick { background: var(--accent); }
.leaf--verm { background: var(--verm); }
.leaf--orange { background: var(--spark); }
.leaf--teal { background: var(--teal); }
.leaf--tick { width: calc(var(--leaf) * 0.65); height: calc(var(--leaf) * 0.65); margin-right: 0.55rem; vertical-align: -0.05em; }
.leaf-crown { display: flex; gap: calc(var(--leaf) * 0.5); align-items: flex-end; justify-content: center; margin: calc(var(--line-unit) * 2) auto; width: fit-content; }
.leaf-crown .leaf { width: calc(var(--leaf) * 1.4); height: calc(var(--leaf) * 1.4); }
.leaf-crown .leaf:nth-child(2), .leaf-crown .leaf:nth-child(4) { width: calc(var(--leaf) * 1.7); height: calc(var(--leaf) * 1.7); }
.leaf-crown .leaf:nth-child(3) { width: calc(var(--leaf) * 2); height: calc(var(--leaf) * 2); }
.leaf-crown--footer { margin-block: 0; padding-block: calc(var(--line-unit) * 1.5) 0; }
.stage-leaves { display: inline-flex; gap: 0.3rem; align-items: center; }
.stage-leaves .leaf--stage { width: calc(var(--leaf) * 0.8); height: calc(var(--leaf) * 0.8); background: transparent; border: 1.5px solid var(--accent-300); }
.stage-leaves .leaf--stage::after { display: none; }
.stage-leaves .leaf--stage.is-open { background: var(--accent); border-color: var(--accent); }
.stage-leaves .leaf--stage.is-open::after { display: block; }
.stage .stage-leaves .leaf--stage { border-color: var(--accent-300); }
.stage .stage-leaves .leaf--stage.is-open { background: var(--spark); border-color: var(--spark); }
.ticklist { list-style: none; padding-left: 0; margin: 0; }
.ticklist > li { position: relative; padding-left: 1.6rem; margin-block-end: 0.5rem; }
.ticklist > li::before { content: ""; position: absolute; left: 0; top: 0.5em; width: calc(var(--leaf) * 0.6); height: calc(var(--leaf) * 0.6); background: var(--accent); border-radius: 0 100% 0 100%; transform: rotate(-45deg); }
.stage .ticklist > li::before { background: var(--spark); }
.ticklist--teal > li::before { background: var(--teal); }

/* ---------- eyebrow + breadcrumb ---------- */
.eyebrow { display: flex; align-items: center; font-family: var(--body); font-weight: 700; letter-spacing: 0; font-size: var(--fs--1); color: var(--accent-700); margin: 0 0 calc(var(--line-unit) * 0.45); }
.eyebrow--teal { color: var(--teal-ink); }
.stage .eyebrow { color: var(--accent-200); }
.crumbs { font-size: var(--fs--1); color: var(--ink-soft); padding-block: calc(var(--line-unit) * 0.6) 0; }
.crumbs ol { list-style: none; display: flex; flex-wrap: wrap; gap: 0.4rem; margin: 0; padding: 0; }
.crumbs li + li::before { content: "/"; margin-right: 0.4rem; color: var(--accent-300); }
.crumbs a { color: var(--accent-700); }

/* ---------- plates (the photo system) ---------- */
.plate { margin: 0; display: inline-flex; flex-direction: column; max-width: 100%; position: relative; }
.plate-frame { display: block; background: var(--card); padding: 0; border-radius: calc(var(--radius) + 4px); overflow: hidden; }
.plate-frame img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.plate--portrait .plate-frame img { aspect-ratio: 4 / 5; }
.plate--wide .plate-frame img { aspect-ratio: 16 / 9; }
.plate--square .plate-frame img { aspect-ratio: 1 / 1; }
.plate--natural .plate-frame img { aspect-ratio: auto; }
.plate-caption { font-family: var(--body); font-size: var(--fs--1); color: var(--ink-soft); background: transparent; padding: 0.75rem 0.15rem 0; border: 0; line-height: 1.45; }
.stage .plate-caption { background: transparent; color: var(--stage-soft); border: 0; }
.plate--tilt { transform: rotate(-1.2deg); }

/* duotone hero: a real <img> under a brick-to-orange scrim that keeps AA for the type */
.hero { position: relative; isolation: isolate; color: var(--stage-ink); background: var(--accent-900); overflow: hidden; }
.hero-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; filter: none; }
.hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(105deg, rgba(67, 0, 7, 0.95) 0%, rgba(110, 2, 19, 0.86) 38%, rgba(165, 59, 61, 0.5) 64%, rgba(247, 142, 44, 0.3) 100%); mix-blend-mode: normal; }
.hero-photo { mix-blend-mode: normal; }
.hero .hero-tint { position: absolute; inset: 0; z-index: -1; background: var(--accent-600); mix-blend-mode: multiply; opacity: 0.55; pointer-events: none; }
.hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(26, 17, 19, 0.22) 0%, rgba(26, 17, 19, 0) 35%, rgba(26, 17, 19, 0.5) 100%); }
.hero .btn--ghost { color: #fff; border-color: rgba(255, 255, 255, 0.78); }
.hero .btn--ghost:hover, .hero .btn--ghost:focus-visible { background: rgba(255, 255, 255, 0.14); color: #fff; border-color: #fff; }
.hero h1, .hero h2 { color: #fff; }
.hero .eyebrow { color: var(--accent-100); }
.hero .lede { color: var(--stage-ink); }
.hero .hero-inner { position: relative; padding-block: calc(var(--line-unit) * 3) calc(var(--line-unit) * 2.5); max-width: 40rem; }
.hero .hero-caption { position: absolute; right: 1rem; bottom: 0.8rem; font-family: var(--meta); font-size: var(--fs--1); color: var(--stage-ink); background: rgba(26, 17, 19, 0.7); padding: 0.25rem 0.6rem; margin: 0; }

/* ---------- chrome: banner, quick rail, masthead ---------- */
.proto-banner { background: var(--ink); color: #fff; font-size: var(--fs--1); text-align: center; padding: 0.5rem 1rem; }
.quick-rail { background: var(--accent-900); color: var(--accent-100); }
.rail-items { list-style: none; display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 0.2rem 1.3rem; min-height: 2.4rem; margin: 0; }
.rail-items a { color: var(--accent-100); text-decoration: none; font-size: var(--fs--1); padding-block: 0.6rem; display: inline-block; }
.rail-items a:hover { color: #fff; text-decoration: underline; }
.rail-items .rail-emphasis { color: var(--spark); font-weight: 700; }
@media (max-width: 640px) { .rail-items .rail-more { display: none; } }

.site-header { background: var(--canvas); border-bottom: 1px solid var(--line); position: relative; z-index: 40; }
.masthead { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 0.7rem 1rem; padding-block: 0.75rem; }
.brand-lockup { display: inline-flex; align-items: center; }
.brand-logo { width: clamp(9rem, 14vw, 12rem); height: auto; }
.nav-disclosure { grid-column: 1 / -1; }

/* ---------- omnibox (one joined control; inset rings so neither half clips) ---------- */
.omnibox { position: relative; min-width: 0; }
.omnibox--desktop { display: none; }
.omnibox--mobile { display: block; }
.omnibox-field { display: flex; }
.omnibox input[type="search"] { flex: 1; min-width: 0; font: inherit; font-size: var(--fs-0); color: var(--ink); background: #fff; border: 2px solid var(--accent-800); border-right: 0; border-radius: var(--radius) 0 0 var(--radius); padding: 0.55rem 0.8rem; min-height: 44px; -webkit-appearance: none; appearance: none; }
.omnibox input[type="search"]:focus-visible { outline: 3px solid var(--accent-600); outline-offset: -3px; }
.omnibox button[type="submit"] { font-family: var(--body); font-weight: 700; font-size: var(--fs-0); color: #fff; background: var(--accent-800); border: 2px solid var(--accent-800); border-radius: 0 var(--radius) var(--radius) 0; padding: 0.55rem 1.1rem; min-height: 44px; cursor: pointer; }
.omnibox button[type="submit"]:hover { background: var(--accent-900); border-color: var(--accent-900); color: #fff; }
.omnibox button[type="submit"]:focus-visible { outline: 3px solid var(--spark); outline-offset: -6px; }
.omni-suggestions { list-style: none; margin: 0.3rem 0 0; padding: 0.3rem; position: absolute; inset-inline: 0; top: 100%; background: #fff; color: var(--ink); border: 1px solid var(--accent-200); border-radius: var(--radius); box-shadow: var(--shadow); z-index: 50; max-height: 24rem; overflow: auto; }
.omni-suggestions:empty { display: none; }
.omni-suggestions [role="option"] { padding: 0.5rem 0.65rem; border-radius: 3px; cursor: pointer; display: flex; gap: 0.6rem; align-items: baseline; min-height: 44px; }
.omni-suggestions [role="option"] .tag { font-family: var(--meta); font-size: 0.78rem; color: var(--accent-700); flex-shrink: 0; margin-inline-start: auto; }
.omni-suggestions [role="option"][aria-selected="true"], .omni-suggestions [role="option"]:hover { background: var(--accent-50); }
.omni-suggestions .omni-ask-row { border-bottom: 1px solid var(--accent-100); font-weight: 700; }
.omni-group-label { font-family: var(--meta); font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--ink-soft); padding: 0.5rem 0.65rem 0.15rem; }
.omni-empty { padding: 0.6rem 0.65rem; color: var(--ink-soft); font-size: var(--fs--1); }
.omnibox--standalone { max-width: 34rem; margin-block: var(--line-unit); }

/* ---------- primary nav (native details; mobile-first) ---------- */
.menu-btn { display: inline-flex; align-items: center; font-family: var(--body); font-weight: 700; font-size: var(--fs-0); color: var(--ink); background: var(--mat); border: 1px solid var(--line); border-radius: var(--radius); padding: 0.55rem 1.1rem; min-height: 44px; cursor: pointer; list-style: none; }
.menu-btn::-webkit-details-marker { display: none; }
.primary-nav .omnibox--mobile { display: block; margin-block: 0.9rem; }
.nav-list { list-style: none; display: flex; flex-direction: column; gap: 0; margin: 0.5rem 0 0; padding: 0; }
.nav-list a { color: var(--ink); text-decoration: none; font-weight: 700; font-size: var(--fs-1); display: block; padding: 0.7rem 0; position: relative; min-height: 44px; }
.nav-list a::before { content: ""; position: absolute; left: 0; bottom: 0.2rem; width: calc(var(--leaf) * 0.55); height: calc(var(--leaf) * 0.55); border-radius: 0 100% 0 100%; transform: rotate(-45deg); background: transparent; }
.nav-list a:hover { color: var(--accent-700); }
.nav-list a:hover::before, .nav-list a[aria-current="page"]::before { background: var(--accent); }
.nav-list a[aria-current="page"] { color: var(--accent-700); }

/* ---------- buttons ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; min-height: 44px; padding: 0.6rem 1.25rem; border-radius: var(--radius); font-family: var(--body); font-weight: 700; text-decoration: none; cursor: pointer; border: 2px solid transparent; font-size: var(--fs-0); }
.btn--primary { background: var(--accent); color: #fff; border-color: var(--accent); }
.btn--primary:hover { background: var(--accent-800); border-color: var(--accent-800); color: #fff; }
.btn--ghost { background: transparent; color: var(--accent-700); border-color: var(--accent-600); }
.btn--ghost:hover { background: var(--accent-50); color: var(--accent-900); }
.btn--teal { background: var(--teal-ink); color: #fff; border-color: var(--teal-ink); }
.btn--teal:hover { background: #1b4c4a; border-color: #1b4c4a; color: #fff; }
.btn--spark { background: var(--spark); color: var(--ink); border-color: var(--spark); }
.btn--spark:hover { background: #ffa650; border-color: #ffa650; color: var(--ink); }
.stage .btn--ghost { color: var(--stage-ink); border-color: var(--accent-300); }
.stage .btn--ghost:hover { background: rgba(255, 255, 255, 0.08); color: #fff; }
.stage a:not(.btn) { color: var(--accent-200); }
.stage a:not(.btn):hover { color: #fff; }

/* ---------- the stage (dark room) ---------- */
.stage { background: var(--stage); color: var(--stage-ink); position: relative; isolation: isolate; -webkit-font-smoothing: antialiased; }
.stage h1, .stage h2, .stage h3, .stage h4 { color: #fff; }
.stage--spot::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse 60% 70% at 78% 20%, rgba(247, 142, 44, 0.28), rgba(165, 59, 61, 0.14) 45%, transparent 70%); pointer-events: none; }
.stage .ledger { color: var(--accent-200); }

/* ---------- the Kinetic AI band ---------- */
.kinetic-band { background: var(--teal-wash); border-block: 1px solid #c9e0de; }
.kinetic-inner { display: grid; gap: var(--line-unit); padding-block: calc(var(--line-unit) * 2); }
.kinetic-band h2 { font-size: var(--fs-2); line-height: 1.16; }
.kinetic-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.5rem; align-content: start; }
.kinetic-list li { display: flex; align-items: baseline; font-size: var(--fs--1); color: var(--ink); }
.kinetic-price { color: var(--teal-ink); margin-left: 0.6rem; }

/* ---------- ledger tables ---------- */
.ledger-table { width: 100%; border-collapse: collapse; font-size: var(--fs--1); margin-block: var(--line-unit); }
.ledger-table th, .ledger-table td { text-align: left; padding: 0.6rem 0.5rem; border-bottom: 1px solid var(--line); vertical-align: top; }
.ledger-table th { font-family: var(--meta); font-weight: 400; text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.75rem; color: var(--ink-soft); }
.ledger-table td.num, .ledger-table th.num { text-align: right; font-family: var(--meta); white-space: nowrap; }
.ledger-table caption { text-align: left; font-family: var(--meta); font-size: var(--fs--1); color: var(--ink-soft); padding-block: 0 0.5rem; }
.stage .ledger-table th, .stage .ledger-table td { border-bottom-color: #3a292c; }
.stage .ledger-table th { color: var(--stage-soft); }
.table-wrap { overflow-x: auto; }

/* ---------- cards: three shapes, not one ---------- */
.pathway-card { display: grid; grid-template-rows: subgrid; grid-row: span 4; row-gap: 0.6rem; background: var(--card); border: 1px solid var(--line); border-top: 5px solid var(--accent); padding: 1.2rem 1.2rem 1.4rem; text-decoration: none; color: var(--ink); position: relative; }
.pathway-card:hover { box-shadow: var(--shadow); border-color: var(--accent-300); }
.pathway-card h3 { font-family: var(--display); font-weight: 400; font-size: var(--fs-2); margin: 0; line-height: 1.14; }
.pathway-card p { margin: 0; color: var(--ink-soft); font-size: var(--fs--1); }
.pathway-card .go { font-weight: 700; color: var(--accent-700); align-self: end; }
.pathway-card--workforce { border-top-color: var(--spark); }
.pathway-card--capital { border-top-color: var(--verm); }
.pathway-card--center { border-top-color: var(--teal); }
.pathway-grid { display: grid; grid-template-columns: 1fr; gap: 1rem; margin-top: var(--line-unit); }

.program-row { display: grid; grid-template-columns: 1fr; gap: 0.4rem 1.2rem; padding-block: var(--line-unit); border-top: 1px solid var(--line); }
.program-row:last-child { border-bottom: 1px solid var(--line); }
.program-row h3 { margin: 0; }
.program-row .program-meta { font-family: var(--meta); font-size: var(--fs--1); color: var(--ink-soft); }
.program-row .program-body { margin: 0; }
.program-row .program-actions { display: flex; flex-wrap: wrap; gap: 0.6rem 1rem; align-items: center; margin: 0.8rem 0 0; }

.service-tile { background: var(--mat); border-left: 4px solid var(--accent); padding: 1rem 1.1rem; }
.service-tile h3 { margin-bottom: 0.3rem; }
.service-tile .price { font-family: var(--meta); color: var(--accent-700); font-size: var(--fs-1); }
.service-grid { display: grid; grid-template-columns: 1fr; gap: 1rem; }

/* ---------- the front desk (Your next move) ---------- */
.desk { background: var(--card); border: 1px solid var(--line); box-shadow: var(--shadow); padding: 1.4rem 1.2rem; }
.desk fieldset { border: 0; margin: 0 0 var(--line-unit); padding: 0; min-width: 0; }
.desk legend { font-family: var(--display); font-size: var(--fs-2); line-height: 1.1; margin-bottom: 0.7rem; padding: 0; color: var(--ink); }
.chips { display: flex; flex-wrap: wrap; gap: 0.6rem; }
.chip { position: relative; }
.chip input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.chip label { display: inline-flex; align-items: center; gap: 0.5rem; min-height: 44px; padding: 0.5rem 0.95rem; border: 2px solid var(--accent-200); border-radius: 999px; background: #fff; color: var(--ink); cursor: pointer; font-weight: 600; font-size: var(--fs--1); }
.chip label:hover { border-color: var(--accent-500); }
.chip input:checked + label { background: var(--accent); border-color: var(--accent); color: #fff; }
.chip input:focus-visible + label { outline: 3px solid var(--accent-600); outline-offset: 2px; }
.chip label .leaf { width: calc(var(--leaf) * 0.5); height: calc(var(--leaf) * 0.5); }
.chip input:checked + label .leaf { background: #fff; }
.desk-actions { display: flex; flex-wrap: wrap; gap: 0.7rem 1rem; align-items: center; }
.desk-results { margin-top: var(--line-unit); }
.desk-results h2 { font-size: var(--fs-2); }
.desk-group { margin-bottom: var(--line-unit); }
.desk-group-label { font-family: var(--meta); text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.75rem; color: var(--ink-soft); margin: 0 0 0.4rem; }
.desk-hit { display: grid; grid-template-columns: 1fr auto; gap: 0.2rem 1rem; padding: 0.7rem 0; border-top: 1px solid var(--line); align-items: baseline; }
.desk-hit:last-child { border-bottom: 1px solid var(--line); }
.desk-hit a { font-weight: 700; color: var(--ink); text-decoration: none; }
.desk-hit a:hover { color: var(--accent-700); text-decoration: underline; }
.desk-hit .why { grid-column: 1; font-size: var(--fs--1); color: var(--ink-soft); margin: 0; }
.desk-hit .ledger { grid-column: 2; grid-row: 1 / span 2; color: var(--accent-700); text-align: right; }
.desk-person { display: grid; grid-template-columns: auto 1fr; gap: 0.9rem; align-items: center; background: var(--accent-50); padding: 0.9rem 1rem; margin-top: var(--line-unit); }
.desk-person img { width: 64px; height: 64px; object-fit: cover; border-radius: 50%; }
.desk-empty { background: var(--mat); padding: 1rem; }

/* ---------- contact card, forms, notices ---------- */
.contact-card { display: grid; grid-template-columns: auto 1fr; gap: 1rem; align-items: center; background: var(--accent-50); border-left: 4px solid var(--accent); padding: 1rem 1.1rem; margin-block: var(--line-unit); }
.contact-photo { width: 84px; height: 84px; object-fit: cover; border-radius: 50%; }
.contact-card--vanessa .contact-photo { object-position: 50% 18%; }
.contact-name { font-weight: 700; margin: 0; }
.contact-title { margin: 0 0 0.3rem; color: var(--ink-soft); font-size: var(--fs--1); }
.contact-lines { margin: 0; font-size: var(--fs--1); }
.form { display: grid; gap: 0.9rem; max-width: 40rem; }
.form label { font-weight: 700; display: block; margin-bottom: 0.25rem; }
.form input[type="text"], .form input[type="email"], .form input[type="tel"], .form input[type="date"], .form select, .form textarea { width: 100%; font: inherit; color: var(--ink); background: #fff; border: 2px solid var(--line); border-radius: var(--radius); padding: 0.6rem 0.75rem; min-height: 44px; }
.form input:focus-visible, .form select:focus-visible, .form textarea:focus-visible { outline: 3px solid var(--accent-600); outline-offset: 2px; border-color: var(--accent-400); }
.form .hint { font-size: var(--fs--1); color: var(--ink-soft); margin: 0.2rem 0 0; }
.form-note { margin-top: 0.5rem; }
.form-status { background: var(--teal-wash); border-left: 4px solid var(--teal); padding: 0.9rem 1rem; margin-top: var(--line-unit); }
.notice { background: var(--notice-bg); color: var(--notice-text); padding: 0.8rem 1rem; }
.notice a { color: #fff; }
.newsletter-field { display: flex; gap: 0; }
.newsletter-field input { flex: 1; min-width: 0; font: inherit; padding: 0.55rem 0.75rem; border: 2px solid var(--accent-300); border-right: 0; border-radius: var(--radius) 0 0 var(--radius); min-height: 44px; background: #fff; color: var(--ink); }
.newsletter-field input:focus-visible { outline: 3px solid var(--spark); outline-offset: -3px; }
.newsletter-field .btn { border-radius: 0 var(--radius) var(--radius) 0; }
.newsletter-field .btn:focus-visible { outline: 3px solid #fff; outline-offset: -6px; }
.newsletter label { display: block; margin-bottom: 0.45rem; }

/* ---------- related + last updated ---------- */
.related { margin-block: calc(var(--line-unit) * 2) var(--line-unit); border-top: 1px solid var(--line); padding-top: var(--line-unit); }
.related-heading { font-family: var(--meta); text-transform: uppercase; letter-spacing: 0.08em; font-size: var(--fs--1); color: var(--ink-soft); margin: 0 0 0.5rem; }
.related ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.5rem 1.4rem; }
.related a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; color: var(--accent-700); font-weight: 700; }
.related a:hover { text-decoration: underline; }
.last-updated { margin-top: 0.4rem; }

/* ---------- footer (on the stage) ---------- */
.site-footer { margin-top: calc(var(--line-unit) * 2); }
.footer-grid { display: grid; gap: 2rem; grid-template-columns: 1fr; padding-block: var(--line-unit) calc(var(--line-unit) * 2); }
.footer-logo { width: 10rem; background: #fff; padding: 0.5rem 0.7rem; border-radius: var(--radius); }
.footer-address, .footer-lines { margin: 0.7rem 0 0.3rem; color: var(--stage-ink); }
.footer-lines a { color: var(--accent-200); text-decoration: none; }
.footer-lines a:hover { color: #fff; text-decoration: underline; }
.footer-parent a { color: var(--accent-200); }
.footer-heading { font-family: var(--meta); text-transform: uppercase; letter-spacing: 0.08em; font-size: var(--fs--1); color: var(--accent-200); margin: 0 0 0.5rem; }
.footer-col ul { list-style: none; margin: 0; padding: 0; }
.footer-col li { margin-bottom: 0.45rem; }
.footer-col a { color: var(--stage-ink); text-decoration: none; }
.footer-col a:hover { color: #fff; text-decoration: underline; }
.footer-a11y, .footer-feedback { margin-top: 0.9rem; }
.footer-a11y a, .footer-feedback a { color: var(--accent-200); text-decoration: underline; }
.footer-legal { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.5rem 1.5rem; border-top: 1px solid #3a292c; padding-block: var(--line-unit); font-size: var(--fs--1); color: var(--stage-soft); }
.footer-legal p { margin: 0; }
.footer-legal a { color: var(--accent-200); }

/* ---------- 404 + empty states ---------- */
.notfound { padding-block: calc(var(--line-unit) * 3); }
.notfound .leaf--bud { width: calc(var(--leaf) * 3); height: calc(var(--leaf) * 3); background: transparent; border: 3px solid var(--accent); margin-bottom: var(--line-unit); }
.notfound .leaf--bud::after { display: none; }
.notfound-links { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 0.6rem 1.5rem; }
.notfound-links a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }
.search-empty-state { background: var(--mat); padding: 1rem 1.1rem; }
.search-empty-state .leaf--bud { width: calc(var(--leaf) * 1.4); height: calc(var(--leaf) * 1.4); background: transparent; border: 2px solid var(--accent); margin-bottom: 0.5rem; }
.search-empty-state .leaf--bud::after { display: none; }

/* ---------- search page ---------- */
.search-page .lede { max-width: 56ch; }
.search-pills { list-style: none; padding: 0; margin: var(--line-unit) 0; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.search-pills a { display: inline-flex; align-items: center; min-height: 44px; padding: 0.4rem 0.9rem; border: 1px solid var(--accent-300); border-radius: 999px; text-decoration: none; color: var(--accent-800); font-size: var(--fs--1); background: #fff; }
.search-pills a:hover { background: var(--accent-50); border-color: var(--accent-600); }
.answer-panel { background: var(--accent-50); border-left: 4px solid var(--accent); padding: 1rem 1.2rem; margin-block: var(--line-unit); }
.answer-panel[hidden] { display: none; }
.answer-panel p { margin-bottom: 0.6rem; }
.answer-sources { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 0.5rem 1.2rem; }
.answer-sources a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 700; }
.answer-sources-label { margin: 0.6rem 0 0.2rem; }
.result-count { margin-block: 0.5rem; }
.search-group { margin-block: var(--line-unit); }
.search-group-heading { font-family: var(--meta); font-size: var(--fs--1); text-transform: uppercase; letter-spacing: 0.08em; color: var(--ink-soft); font-weight: 400; }
.result-list { list-style: none; padding: 0; margin: 0; }
.result-row { padding: 0.7rem 0; border-top: 1px solid var(--line); }
.result-heading { margin: 0 0 0.2rem; font-weight: 700; }
.result-type { color: var(--accent-700); margin-left: 0.5rem; font-weight: 400; }
.result-body { margin: 0; color: var(--ink-soft); font-size: var(--fs--1); }
.chip-btn { display: inline-flex; align-items: center; min-height: 44px; padding: 0.3rem 0.8rem; border: 1px solid var(--accent-300); border-radius: 999px; background: #fff; color: var(--accent-800); cursor: pointer; font: inherit; font-size: var(--fs--1); }
.chip-btn:hover { background: var(--accent-50); }

/* ---------- accessibility page ---------- */
.a11y-grid { display: grid; gap: var(--line-unit); grid-template-columns: 1fr; }

/* ---------- print ---------- */
@media print {
	.proto-banner, .quick-rail, .site-header, .site-footer, .crumbs, .cta-desk, .notice, .related { display: none; }
	body { background: #fff; color: #000; }
	a { color: #000; text-decoration: none; }
	.stage { background: #fff; color: #000; }
	.stage h1, .stage h2, .stage h3 { color: #000; }
	.leaf-crown { filter: grayscale(1); }
}

/* ---------- responsive (mobile-first; desktop at 960px) ---------- */
@media (min-width: 640px) {
	.pathway-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.program-row { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); }
	.program-row h3, .program-row .program-meta { grid-column: 1; }
	.program-row .program-body, .program-row .program-actions { grid-column: 2; }
	.kinetic-inner { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); align-items: start; }
	.footer-grid { grid-template-columns: 1fr 1fr; }
	.a11y-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 960px) {
	.nav-disclosure .menu-btn { display: none; }
	.omnibox--desktop { display: block; }
	.omnibox--mobile, .primary-nav .omnibox--mobile { display: none; }
	.nav-list { flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 0.3rem 1.6rem; margin: 0; margin-inline: auto; }
	.nav-list a { padding: 0.7rem 0; min-height: auto; font-size: var(--fs-0); }
	.pathway-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.service-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.footer-grid { grid-template-columns: 1.3fr 1fr 1fr 1.3fr; }
	.hero .hero-inner { padding-block: calc(var(--line-unit) * 4) calc(var(--line-unit) * 3.5); max-width: 44rem; }
}

/* ---------- motion: gated behind html.js AND no-preference (still page is complete by construction) ---------- */
@media (prefers-reduced-motion: no-preference) {
	
	html.js .reveal.in { animation: bbopRise 0.6s ease forwards; }
	html.js .leaf-crown.reveal .leaf { transform: rotate(-45deg) scale(0.4); }
	html.js .leaf-crown.reveal.in .leaf { animation: bbopLeafOpen 0.5s ease forwards; }
	html.js .leaf-crown.reveal.in .leaf:nth-child(2) { animation-delay: 0.08s; }
	html.js .leaf-crown.reveal.in .leaf:nth-child(3) { animation-delay: 0.16s; }
	html.js .leaf-crown.reveal.in .leaf:nth-child(4) { animation-delay: 0.24s; }
	html.js .leaf-crown.reveal.in .leaf:nth-child(5) { animation-delay: 0.32s; }
	html.js .stage--spot::before { animation: bbopSpot 18s ease-in-out infinite alternate; }
	.pathway-card, .btn, .chip label, .plate--tilt { transition: box-shadow 0.2s ease, border-color 0.2s ease, background-color 0.2s ease, transform 0.2s ease; }
	.plate--tilt:hover { transform: rotate(0deg); }
	@view-transition { navigation: auto; }
	.brand-logo { view-transition-name: bbop-brand; }
}
@media (prefers-reduced-motion: reduce) {
	::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }
}
@keyframes bbopRise { to { opacity: 1; transform: translateY(0); } }
@keyframes bbopLeafOpen { to { transform: rotate(-45deg) scale(1); } }
@keyframes bbopSpot { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(-4%, 3%, 0); } }

/* ---------- homepage: hero grid with the desk, today, impact, stories, building, partners ---------- */
.hero--home .hero-grid { display: grid; gap: var(--line-unit); padding-block: calc(var(--line-unit) * 2) calc(var(--line-unit) * 2.5); position: relative; }
.hero--home .hero-inner { padding-block: 0; max-width: none; }
.hero--home .hero-numbers { color: var(--accent-100); margin: 0; font-size: var(--fs--1); }
.hero-desk .desk { border: 0; box-shadow: 0 18px 50px rgba(0, 0, 0, 0.35); }
.hero-desk .desk-results:empty { display: none; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 0.7rem 1rem; margin-top: var(--line-unit); }
.hero--pathway .hero-inner { position: relative; }
.hero--pathway .crumbs, .hero--pathway .crumbs a { color: var(--accent-100); }
.hero--pathway .crumbs li + li::before { color: var(--accent-300); }
.today-grid { display: grid; gap: calc(var(--line-unit) * 1.5); }
.today-list { list-style: none; padding: 0; margin: var(--line-unit) 0; border-top: 1px solid var(--line); }
.today-row { display: grid; grid-template-columns: 6.2rem 1fr; gap: 0.4rem 1rem; padding: 0.8rem 0; border-bottom: 1px solid var(--line); align-items: baseline; }
.today-date { color: var(--accent-700); font-size: var(--fs--1); }
.today-body { display: grid; gap: 0.15rem; }
.today-body a { font-weight: 700; color: var(--ink); text-decoration: none; }
.today-body a:hover { color: var(--accent-700); text-decoration: underline; }
.pathway-card .plate { display: block; }
.pathway-card .plate--card .plate-frame { padding: 0; background: transparent; }
.pathway-card .plate--card .plate-frame img { aspect-ratio: 16 / 10; }
.impact-ledger { display: grid; gap: var(--line-unit) 2rem; margin: var(--line-unit) 0 calc(var(--line-unit) * 1.5); }
.impact-item { border-top: 1px solid #4a3438; padding-top: 0.8rem; }
.impact-value { font-family: var(--display); font-size: clamp(1.9rem, 1.1rem + 2.6vw, var(--fs-4)); line-height: 1.1; color: var(--spark); letter-spacing: -0.02em; margin: 0 0 0.35rem; overflow-wrap: anywhere; }
.impact-item dd { margin: 0; color: var(--stage-ink); }
.impact-source { display: block; margin-top: 0.3rem; font-size: 0.8rem; color: var(--accent-200); }
.stage-quote { margin: calc(var(--line-unit) * 1.5) 0 0; max-width: 46rem; border-left: 4px solid var(--spark); padding-left: 1.2rem; }
.stage-quote p { font-family: var(--display); font-size: var(--fs-2); line-height: 1.2; color: #fff; }
.stage-quote cite { font-style: normal; font-family: var(--meta); color: var(--accent-200); font-size: var(--fs--1); }
.story-grid { display: grid; gap: var(--line-unit) 1.5rem; margin-block: var(--line-unit); }
.story-card .plate { display: block; margin-bottom: 0.7rem; }
.story-card .plate-frame img { aspect-ratio: 16 / 10; }
.story-date { color: var(--accent-700); margin-bottom: 0.3rem; }
.story-card h3 { font-family: var(--display); font-weight: 400; font-size: var(--fs-1); line-height: 1.18; margin-bottom: 0.55rem; }
.story-card h3 a { color: var(--ink); text-decoration: none; }
.story-card h3 a:hover { color: var(--accent-700); text-decoration: underline; }
.building-strip { display: grid; gap: 1rem; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-block: var(--line-unit) calc(var(--line-unit) * 1.5); }
.building-strip .plate { display: block; }
.building-strip .plate-frame img { aspect-ratio: 4 / 3; }
.partners-inner { display: grid; gap: var(--line-unit) 2rem; align-items: end; }
.sponsor-list { columns: 2; column-gap: 2rem; }
.partners-parent { font-size: var(--fs--1); color: var(--ink-soft); max-width: 36ch; margin: 0; border-left: 3px solid var(--accent-200); padding-left: 1rem; }
.stage-legend { display: flex; flex-wrap: wrap; gap: 0.6rem 1.6rem; margin-block: var(--line-unit); }
.stage-legend-item { display: inline-flex; gap: 0.6rem; align-items: center; }
.programs-rows { border-top: 1px solid var(--line); }
.program-row h3 { font-family: var(--display); font-weight: 400; font-size: var(--fs-2); margin-top: 0.4rem; }
.program-row h3 a { color: var(--ink); text-decoration: none; }
.program-row h3 a:hover { color: var(--accent-700); text-decoration: underline; }
.pitch-grid { display: grid; gap: calc(var(--line-unit) * 1.5); align-items: center; }
.pitch-grid .plate { display: inline-flex; }
.next-move-grid { display: grid; gap: calc(var(--line-unit) * 1.5); margin-top: var(--line-unit); }
.next-move-aside .plate { display: inline-flex; max-width: 26rem; }
.desk-directory-heading { font-size: var(--fs-2); }
@media (min-width: 640px) {
	.impact-ledger { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.story-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.building-strip { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.today-grid { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); }
}
@media (min-width: 960px) {
	.hero--home .hero-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 30rem); align-items: start; gap: 3rem; padding-block: calc(var(--line-unit) * 3) calc(var(--line-unit) * 3.5); }
	.hero--home .hero-inner { padding-top: calc(var(--line-unit) * 1.5); }
	.impact-ledger { grid-template-columns: repeat(auto-fit, minmax(12.5rem, 1fr)); }
	.partners-inner { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); }
	.pitch-grid { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); }
	.next-move-grid { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); }
}

.sponsor-sheet { display: block; max-width: 22rem; height: auto; margin-top: var(--line-unit); background: #fff; border: 1px solid var(--accent-100); padding: 0.75rem; }

/* ---- The Center: floor guide, rates, membership stage, timeline, visit ---- */
.floor-guide { list-style: none; margin: var(--line-unit) 0 0; padding: 0; display: grid; gap: calc(var(--line-unit) * 1.25) var(--line-unit); grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); }
.floor-stop h3 { font-size: var(--fs-1); margin: 0.6rem 0 0.2rem; display: flex; align-items: center; gap: 0.4rem; }
.floor-stop .fine { margin: 0; }
.rates-grid, .membership-grid, .story-grid-2, .visit-grid, .studio-grid, .offices-grid, .booking-grid { display: grid; gap: calc(var(--line-unit) * 1.5); align-items: start; }
.rates-grid .table-wrap { margin: 0; }
.ledger-table th .fine { display: block; font-weight: 400; }
.stage-price { font-size: var(--fs-3); color: var(--spark); margin: 0 0 0.5rem; }
.membership-stage .ticklist li { margin-bottom: 0.4rem; }
.timeline { list-style: none; margin: var(--line-unit) 0; padding: 0; border-left: 3px solid var(--accent-200); }
.timeline li { display: grid; grid-template-columns: 4.5rem 1fr; gap: 0.75rem; padding: 0.35rem 0 0.35rem 1rem; position: relative; }
.timeline li::before { content: ""; position: absolute; left: -0.55rem; top: 0.85rem; width: 0.8rem; height: 0.45rem; background: var(--accent-600); border-radius: 0 0.5rem 0 0.5rem; }
.timeline-year { color: var(--accent-700); font-weight: 700; }
.visit-address { font-style: normal; line-height: 1.5; margin-bottom: 0.5rem; }
.room-cards { display: grid; gap: calc(var(--line-unit) * 1.25); grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); margin-top: var(--line-unit); }
.room-card { border-top: 3px solid var(--accent-600); padding-top: 0.75rem; }
.room-card h3 { font-size: var(--fs-2); margin: 0.6rem 0 0.2rem; }
.room-card h3 .fine { display: block; font-family: var(--meta); font-weight: 400; }
.rates { display: grid; grid-template-columns: repeat(auto-fit, minmax(6.5rem, 1fr)); gap: 0.5rem; margin: 0.75rem 0; padding: 0; }
.rates div { border-top: 1px solid var(--accent-100); padding-top: 0.35rem; }
.rates dt { font-size: var(--fs--1); color: var(--ink-soft, #5a4a4d); }
.rates dd { margin: 0; font-size: var(--fs-1); color: var(--accent-800); }
.rates--stage dt { color: var(--accent-100); }
.rates--stage dd { color: var(--spark); }
.rates--stage div { border-top-color: rgba(255, 255, 255, 0.2); }
.studio-terms { margin: var(--line-unit) 0; border: 1px solid rgba(255, 255, 255, 0.25); padding: 0.5rem 0.9rem; }
.studio-terms summary { cursor: pointer; font-weight: 700; padding: 0.3rem 0; }
.addons li .ledger { margin-left: 0.5rem; color: var(--accent-700); }
.office-row { margin-bottom: var(--line-unit); }
.office-row h3 { margin-bottom: 0.2rem; }
.booking-form { background: #fff; border: 1px solid var(--accent-100); padding: calc(var(--line-unit) * 1.2); }
.form-row { margin-bottom: 0.9rem; }
.form-row label { display: block; font-weight: 700; margin-bottom: 0.25rem; }
input:where(.form-row *), select:where(.form-row *), textarea:where(.form-row *) { width: 100%; font: inherit; padding: 0.55rem 0.7rem; border: 2px solid var(--accent-200); border-radius: var(--radius); background: #fff; min-height: 44px; }
input:where(.form-row *):focus-visible, select:where(.form-row *):focus-visible, textarea:where(.form-row *):focus-visible { outline: 3px solid var(--accent-600); outline-offset: 2px; }
.form-row--split { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
@media (min-width: 960px) {
	.rates-grid { grid-template-columns: 1fr 1.4fr; }
	.membership-grid, .story-grid-2, .offices-grid { grid-template-columns: 1.2fr 1fr; }
	.studio-grid { grid-template-columns: 1fr 1fr; }
	.visit-grid { grid-template-columns: 1fr 1fr; }
	.booking-grid { grid-template-columns: 1fr 1.3fr; }
}

/* ---- Capital path, workshops grid, openings ---- */
.capital-path { list-style: none; margin: var(--line-unit) 0 0; padding: 0; display: grid; gap: var(--line-unit); grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); counter-reset: none; }
.capital-step { border-top: 3px solid var(--accent-600); padding-top: 0.6rem; position: relative; }
.capital-step h3 { font-size: var(--fs-1); margin: 0.3rem 0 0.2rem; }
.capital-step-price { color: var(--accent-700); margin: 0.3rem 0 0; }
.workshops-grid { display: grid; gap: calc(var(--line-unit) * 1.5); align-items: start; }
.jobs-list li .ledger { margin-left: 0.5rem; color: var(--accent-700); }
@media (min-width: 960px) { .workshops-grid { grid-template-columns: 1.2fr 1fr; } }

/* ---- Academy and About ---- */
.academy-grid, .founder-grid, .why-grid, .reality-grid { display: grid; gap: calc(var(--line-unit) * 1.5); align-items: start; }
.academy-program--alt { background: var(--accent-50); }
.academy-compare td .fine { display: inline; margin-left: 0.4rem; }
.reality-grid { grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); margin-bottom: calc(var(--line-unit) * 1.5); }
.reality-item { border-top: 3px solid var(--accent-600); padding-top: 0.6rem; }
.reality-item .impact-value { color: var(--accent-700); margin: 0 0 0.3rem; }
.why-grid { grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); }
.why-item h3 { display: flex; align-items: center; gap: 0.4rem; font-size: var(--fs-1); }
.timeline--stage { border-left-color: rgba(255, 255, 255, 0.25); }
.timeline--stage .timeline-year { color: var(--spark); }
.impact-ledger--light .impact-value { color: var(--accent-700); }
.impact-ledger--light .impact-label { color: var(--ink); }
.impact-ledger--light .impact-source a { color: var(--accent-700); }
.founder-grid { grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); margin-bottom: var(--line-unit); }
.founder-card h3 { margin: 0.6rem 0 0.1rem; }
@media (min-width: 960px) { .academy-grid { grid-template-columns: 1.1fr 1fr; } }

/* ---- Kinetic AI Hub ---- */
.hero--kinetic::before { background: linear-gradient(105deg, rgba(20, 52, 50, 0.95) 0%, rgba(37, 100, 97, 0.86) 38%, rgba(97, 162, 158, 0.5) 64%, rgba(247, 142, 44, 0.3) 100%); }
.hero--kinetic .hero-tint { background: var(--teal-ink); }
.hero--kinetic .eyebrow { color: #cfe9e7; }
.tools-list { columns: 2; column-gap: 1.5rem; }
.tools-list li { break-inside: avoid; }
.kinetic-levels { background: var(--teal-ink); }
.level-ladder { list-style: none; margin: var(--line-unit) 0; padding: 0; display: grid; gap: var(--line-unit); grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); }
.level-rung { border-top: 3px solid var(--teal); padding-top: 0.6rem; }
.level-rung h3 { font-size: var(--fs-1); margin: 0.3rem 0 0.2rem; color: #fff; }
.level-meta { color: #cfe9e7; margin: 0 0 0.4rem; }
.level-rung p { color: var(--stage-ink); }
@media (max-width: 640px) { .tools-list { columns: 1; } }

/* ---- Give and pitch ---- */
.tier-grid { list-style: none; margin: var(--line-unit) 0; padding: 0; display: grid; gap: var(--line-unit); grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); }
.tier-card { border-top: 3px solid var(--accent-600); padding-top: 0.6rem; }
.tier-amount { font-family: var(--display); font-size: var(--fs-3); color: var(--accent-700); margin: 0; line-height: 1.1; }
.tier-card h3 { font-size: var(--fs-1); margin: 0.2rem 0 0.4rem; }
.ripple-grid { display: grid; gap: var(--line-unit); grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); margin-bottom: calc(var(--line-unit) * 1.5); }
.ripple-item { border-top: 2px solid var(--spark); padding-top: 0.5rem; }
.ripple-item h3 { font-size: var(--fs-1); color: var(--spark); margin: 0 0 0.3rem; }
.ripple-item p { color: var(--stage-ink); }
.division-grid, .gain-grid, .rules-grid, .past-grid { display: grid; gap: calc(var(--line-unit) * 1.5); align-items: start; }
.division-card { border-top: 3px solid var(--accent-600); padding-top: 0.6rem; }
.division-card h3 .ledger { font-weight: 400; margin-left: 0.4rem; }
.eyebrow-like { font-family: var(--meta); font-size: var(--fs--1); text-transform: uppercase; letter-spacing: 0.08em; color: var(--accent-100); margin: 0 0 0.5rem; }
.rule-list { padding-left: 1.2rem; }
.rule-list li { margin-bottom: 0.4rem; }
.past-card h3 { margin: 0.2rem 0 0.4rem; }
@media (min-width: 960px) {
	.division-grid, .gain-grid, .past-grid { grid-template-columns: 1fr 1fr; }
	.rules-grid { grid-template-columns: 1fr 1.2fr; }
}

.timeline--dates li { grid-template-columns: 8.5rem 1fr; }

/* ---- Overflow safety: long strings wrap, cards never exceed their column ---- */
p, li, dd, td, figcaption, .lede, .fine { overflow-wrap: anywhere; }
.contact-card { min-width: 0; max-width: 100%; box-sizing: border-box; }
.contact-card > * { min-width: 0; }
@media (max-width: 640px) { .contact-card { grid-template-columns: minmax(0, 1fr); } .contact-photo { max-width: 4.5rem; } }
input:where(.form-row *), select:where(.form-row *), textarea:where(.form-row *) { min-width: 0; }
.form-row--split > div { min-width: 0; }
.booking-grid, .rates-grid, .membership-grid, .story-grid-2, .visit-grid, .studio-grid, .offices-grid, .academy-grid, .workshops-grid, .grid-photo { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 480px) { .form-row--split { grid-template-columns: minmax(0, 1fr); } }

/* ---- Rhythm contract: card titles clear their next block, labels clear their figures ---- */
main h3 { margin-bottom: 0.6rem !important; }
.pathway-card h3 { line-height: 1.2; }
.impact-label { display: block; line-height: 1.35; margin-bottom: 0.35rem; }
.impact-item dd.impact-value { padding-top: 0.05rem; }
.impact-item .impact-source { display: block; margin-top: 0.3rem; }
@media (max-width: 1100px) { .hero--home h1 { font-size: clamp(2.2rem, 5vw, 4.4rem); } }

/* ---- Reveal: content is always present; the rise plays only when the observer marks it ---- */
@media (prefers-reduced-motion: no-preference) {
	html.js .reveal.is-visible { animation: reveal-rise 0.5s ease both; }
	@keyframes reveal-rise { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
}
@media (max-width: 960px) { .section { padding-block: calc(var(--line-unit) * 1.7); } }
.pitch-grid .plate--portrait, .membership-grid .plate--portrait { max-width: 22rem; }

/* ---- Critique fixes: emphasis in ink not decoration orange; band links in teal ink; visit rhythm ---- */
.rail-items .rail-emphasis { color: #fff; }
.kinetic-band a:not(.btn), .kinetic-band .kinetic-price, .kinetic-band .eyebrow, .kinetic-band .ledger { color: var(--teal-ink); }
.kinetic-band .btn--teal { color: #fff; }
.visit-grid .contact-card { margin-block: 0; }
/* The crown's top margin stacks on the stage section's bottom padding and the
   stories section's top padding; at 1.5 units that opened a 232px hole between
   the stage quote and "From the Center" at compact-wide widths, past the 220px
   the rhythm contract allows. It keeps its breathing room, just not three
   helpings of it. */
.leaf-crown--section { margin: calc(var(--line-unit) * 0.8) auto 0; }
.story-card .plate--thumb { margin-bottom: 0.6rem; }

.impact-ledger { margin-bottom: calc(var(--line-unit) * 1.1); }

.kinetic-levels .eyebrow, .kinetic-levels .level-meta, .kinetic-levels .ledger { color: #e3f2f0; }

@media (max-width: 1100px) { .stage.section { padding-block: calc(var(--line-unit) * 2.2); } }

.stage .service-tile .btn--ghost { color: var(--accent-700); border-color: var(--accent-600); }
.stage .service-tile .btn--ghost:hover, .stage .service-tile .btn--ghost:focus-visible { background: var(--accent-50); color: var(--accent-900); }

/* ---- Home hero: a dark stage with the Center's people in a visible plate beside the desk ---- */
.hero--home { background: radial-gradient(120% 90% at 18% 20%, #6e0213 0%, var(--accent-900) 55%, #2a0509 100%); }
.hero--home::before, .hero--home::after, .hero--home .hero-tint { display: none; }
.hero--home .hero-plate { margin-top: calc(var(--line-unit) * 0.6); max-width: 34rem; border-color: var(--spark); box-shadow: 0.5rem 0.5rem 0 rgba(0, 0, 0, 0.35); }
.hero--home .hero-plate .plate-caption, .hero--home .hero-plate figcaption { color: var(--ink); }
@media (min-width: 960px) { .hero--home .hero-inner { display: grid; grid-template-rows: auto auto auto auto 1fr; } }

.impact-ledger { grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); }
.impact-value { white-space: nowrap; overflow-wrap: normal; font-size: clamp(1.6rem, 0.9rem + 2.2vw, 2.8rem); }
@media (max-width: 480px) { .impact-value { white-space: normal; } }

/* The hero plate takes the leaf's opposite rounded corners: the motif as a photo treatment. */
.hero--home .hero-plate .plate-frame, .hero--home .hero-plate img { clip-path: inset(0 round 0 2rem 0 2rem); }
/* The building strip is the one place on the homepage that is about rooms you
   walk into, so its four photographs are cut as doorways rather than as the
   hard-edged plates the pathway cards and story cards use. Two treatments, two
   jobs: a plate is a picture of something, an arch is a way in. */
.building-strip .plate .plate-frame,
.building-strip .plate img { clip-path: inset(0 round 46% 46% 0 0 / 30% 30% 0 0); }
.building-strip .plate .plate-frame { box-shadow: none; }
.building-strip .plate figcaption { text-align: center; border-left: 0; padding-left: 0; }

@media (min-width: 960px) { .hero--home .hero-grid { padding-block: calc(var(--line-unit) * 1.4) calc(var(--line-unit) * 2); } .hero--home h1 { font-size: clamp(2.6rem, 4.6vw, 4.4rem); } .hero--home .lede { margin-bottom: 0.4rem; } .hero--home .hero-numbers { margin-top: 0.6rem; } }

/* ---- The founder's magazine, literal: cover lines beside the founder's portrait ---- */
.cover-lines { list-style: none; margin: 0.4rem 0 0.8rem; padding: 0.5rem 0 0.4rem; border-top: 3px solid var(--accent); border-bottom: 1px solid var(--accent-200); display: grid; gap: 0.15rem; }
.cover-lines li { font-family: var(--display); font-size: var(--fs-1); line-height: 1.2; color: var(--deep, var(--accent-900)); }
.cover-lines li::before { content: ""; display: inline-block; width: 0.6rem; height: 0.32rem; margin-right: 0.45rem; background: var(--spark); border-radius: 0 0.5rem 0 0.5rem; vertical-align: middle; }
.desk__prompt { font-family: var(--meta); font-size: var(--fs--1); color: var(--ink-soft, #5a4a4d); margin: 0 0 0.8rem; max-width: 46ch; }
.desk-directory > summary { cursor: pointer; font-family: var(--display); font-weight: 400; font-size: var(--fs-2); color: var(--deep, var(--accent-900)); margin: 0 0 0.4rem; }

/* Directory fold: the heading stays a real h2 inside the summary control */
.desk-directory-heading h2 { display: inline; font: inherit; margin: 0; }
.desk-directory-count { font-weight: 500; opacity: 0.8; }

/* Stacked pathway hero: the photograph keeps its own band above the copy at every width, so body text never crosses a face and the whole group stays in frame (on-site training, 2026-09-02 photo review). */
.hero--stack { display: grid; grid-template-rows: auto auto; }
.hero--stack .hero-photo { position: relative; inset: auto; grid-row: 1; width: 100%; height: clamp(220px, 42vw, 560px); z-index: 0; }
.hero--stack .hero-tint { inset: 0 0 auto 0; height: clamp(220px, 42vw, 560px); z-index: 1; }
.hero--stack .hero-inner { grid-row: 2; position: relative; z-index: 2; padding-top: 1.5rem; }

/* ---- 2026 future-facing refresh: quieter type, brighter rooms, generous controls ---- */
.proto-banner {
	background: var(--stage);
	color: var(--stage-soft);
	padding-block: 0.55rem;
}
.proto-banner a { color: #fff; font-weight: 700; }
.quick-rail { background: #fff; color: var(--ink); border-bottom: 1px solid var(--line); }
.rail-items { min-height: 2.75rem; gap: 0.2rem 1.6rem; }
.rail-items a, .rail-items .rail-emphasis { color: var(--ink-soft); }
.rail-items a:hover, .rail-items a:focus-visible { color: var(--accent-700); text-decoration: none; }
.site-header { background: rgba(255,255,255,0.96); box-shadow: 0 10px 30px rgba(16,35,63,0.05); }
.masthead { gap: 0.9rem 1.2rem; padding-block: 0.9rem; }
.brand-logo { width: clamp(8.25rem, 12vw, 10.5rem); }
.menu-btn { border-radius: 999px; background: #fff; padding-inline: 1.2rem; }

.omnibox-field { min-width: 0; }
.omnibox input[type="search"] {
	border-color: var(--line);
	border-width: 1px;
	border-right: 0;
	border-radius: 14px 0 0 14px;
	padding: 0.78rem 1rem;
	min-height: 50px;
}
.omnibox button[type="submit"] {
	background: var(--stage);
	border-color: var(--stage);
	border-width: 1px;
	border-radius: 0 14px 14px 0;
	padding: 0.78rem 1.15rem;
	min-height: 50px;
	white-space: nowrap;
}
.omnibox button[type="submit"]:hover { background: var(--accent-800); border-color: var(--accent-800); }
.omni-suggestions { border-color: var(--line); border-radius: 14px; padding: 0.45rem; }
.omni-group-label { font-family: var(--body); font-weight: 700; text-transform: none; letter-spacing: 0; }
.omni-suggestions [role="option"] .tag { font-family: var(--body); font-weight: 600; }

.nav-list a { font-size: var(--fs-0); padding: 0.8rem 0.15rem; }
.nav-list a::before { display: none; }
.nav-list a:hover, .nav-list a[aria-current="page"] { color: var(--accent-700); }

.btn {
	min-height: 50px;
	max-width: 100%;
	padding: 0.78rem 1.2rem;
	border-radius: 14px;
	line-height: 1.2;
	text-align: center;
	white-space: normal;
}
.btn--primary { background: var(--stage); border-color: var(--stage); }
.btn--primary:hover, .btn--primary:focus-visible { background: var(--accent-800); border-color: var(--accent-800); }
.btn--ghost { color: var(--accent-800); border-color: var(--accent-300); background: #fff; }
.btn--ghost:hover, .btn--ghost:focus-visible { background: var(--accent-50); color: var(--stage); border-color: var(--accent-500); }
.btn--teal { background: var(--accent-700); border-color: var(--accent-700); }
.btn--teal:hover { background: var(--stage); border-color: var(--stage); }
.btn--spark { background: var(--spark); border-color: var(--spark); color: var(--stage); }
.hero .btn--ghost,
.stage .btn--ghost { color: var(--stage); background: #fff; border-color: #fff; }
.hero .btn--ghost:hover, .hero .btn--ghost:focus-visible,
.stage .btn--ghost:hover, .stage .btn--ghost:focus-visible { color: #fff; background: var(--accent-700); border-color: var(--accent-700); }
.hero-actions,
.kinetic-actions,
.desk-actions,
.section p:has(> .btn) {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.75rem;
}
.section p:has(> .btn) .btn { margin: 0; }

.leaf-crown { width: 3.5rem; margin-block: calc(var(--line-unit) * 1.5); padding: 0; }
.leaf-crown .leaf { display: none; }
.leaf-crown::before {
	content: "";
	display: block;
	width: 100%;
	height: 4px;
	border-radius: 999px;
	background: linear-gradient(90deg, var(--teal), var(--spark), var(--verm));
}
.chip .leaf, .related .leaf, .why-item .leaf { display: none; }
.stage-leaves .leaf--stage {
	width: 0.55rem;
	height: 0.55rem;
	border-radius: 50%;
	transform: none;
	border-color: var(--accent-300);
}
.stage-leaves .leaf--stage::after { display: none !important; }
.stage-leaves .leaf--stage.is-open { background: var(--teal); border-color: var(--teal); }
.ticklist > li { padding-left: 1.25rem; }
.ticklist > li::before {
	width: 0.48rem;
	height: 0.48rem;
	top: 0.62em;
	border-radius: 50%;
	transform: none;
	background: var(--teal);
}

.plate { display: flex; width: 100%; }
.plate-frame { box-shadow: none; }
.plate-frame img { border-radius: calc(var(--radius) + 4px); }
.plate--tilt { transform: none; }
.hero--home .hero-plate,
.stage .plate {
	border: 0;
	box-shadow: none;
}
.hero--home .hero-plate .plate-frame,
.hero--home .hero-plate img,
.building-strip .plate .plate-frame,
.building-strip .plate img { clip-path: none; border-radius: 20px; }

.hero { background: var(--stage); }
.hero::before { background: linear-gradient(105deg, rgba(16,35,63,.96), rgba(16,76,89,.84) 54%, rgba(13,127,120,.36)); }
.hero::after { background: linear-gradient(180deg, rgba(16,35,63,.08), rgba(16,35,63,.58)); }
.hero .hero-tint { display: none; }
.hero .eyebrow { color: #b9efe7; }
.hero .hero-caption { font-family: var(--body); background: rgba(16,35,63,.82); border-radius: 8px; }
.hero--home {
	background:
		radial-gradient(circle at 86% 10%, rgba(45,212,191,.18), transparent 32%),
		linear-gradient(145deg, #f5fbff 0%, #eafbf8 58%, #fff4e8 100%);
	color: var(--ink);
}
.hero--home h1, .hero--home h2 { color: var(--stage); }
.hero--home .eyebrow { color: var(--accent-700); }
.hero--home .lede, .hero--home .hero-numbers { color: var(--ink-soft); }
.hero--home .hero-grid { gap: clamp(2rem, 5vw, 5rem); }
.hero--home .hero-inner { max-width: 42rem; }
.hero--home .hero-plate { max-width: 38rem; margin-top: 1rem; }
.hero--home .hero-numbers { margin-top: 0.9rem; display: flex; flex-wrap: wrap; gap: 0.25rem; }
.hero--home .hero-numbers strong { color: var(--stage); }

.home-ask {
	position: relative;
	background:
		radial-gradient(circle at 100% 0, rgba(45,212,191,.18), transparent 34%),
		var(--stage);
	color: var(--stage-ink);
	border: 0;
	border-radius: 26px;
	box-shadow: 0 26px 70px rgba(16,35,63,.24);
	padding: clamp(1.35rem, 3vw, 2.1rem);
}
.home-ask::before {
	content: "";
	display: block;
	width: 7.5rem;
	height: 5px;
	margin-bottom: 1.2rem;
	border-radius: 999px;
	background: linear-gradient(90deg, var(--teal) 0 35%, var(--spark) 35% 70%, var(--verm) 70%);
}
.home-ask label { display: grid; gap: 0.45rem; margin-bottom: 0.7rem; }
.home-ask label strong { font-family: var(--display); font-size: clamp(1.45rem, 2.4vw, 2rem); line-height: 1.15; letter-spacing: -0.03em; }
.home-ask-label { color: var(--teal); font-weight: 800; font-size: var(--fs--1); }
.home-ask > p { color: var(--stage-soft); max-width: 35ch; }
.home-ask .omnibox-field { display: grid; grid-template-columns: 1fr; gap: 0.65rem; }
.home-ask .omnibox-field input[type="search"],
.home-ask .omnibox-field button[type="submit"] { border-radius: 14px; border: 1px solid var(--line); }
.home-ask .omnibox-field button[type="submit"] { border-color: var(--spark); background: var(--spark); color: var(--stage); }
.home-ask .omnibox-field button[type="submit"]:hover { border-color: #ffa650; background: #ffa650; color: var(--stage); }
.home-ask-links { display: flex; flex-wrap: wrap; gap: 0.5rem 1.1rem; margin-top: 1rem; font-size: var(--fs--1); font-weight: 700; }
.home-ask-links a { color: #b9efe7; }
.home-ask-links a:hover { color: #fff; }
.ask-proof { margin-top: 1rem; padding: 1rem; border-radius: 16px; background: rgba(234,251,248,.1); border: 1px solid rgba(157,235,220,.28); }
.ask-proof p { margin-bottom: 0.45rem; color: var(--stage-ink); }
.ask-proof .ask-proof-question { color: var(--teal); font-size: var(--fs--1); font-weight: 750; }
.ask-proof-meta { display: flex; flex-wrap: wrap; gap: 0.35rem 1rem; font-size: var(--fs--1); }
.ask-proof-meta a { color: #b9efe7; }
.ask-proof-meta a:hover { color: #fff; }

.desk { background: #fff; border: 1px solid var(--line); border-radius: 24px; padding: clamp(1.2rem, 3vw, 2rem); box-shadow: var(--shadow); }
.desk-kicker { color: var(--accent-700); font-size: var(--fs--1); font-weight: 800; margin-bottom: 0.7rem; }
.desk fieldset { border: 0; padding: 0; margin: 0 0 1.35rem; }
.desk legend { font-family: var(--display); font-size: var(--fs-2); font-weight: 700; letter-spacing: -0.025em; margin-bottom: 0.75rem; }
.chips { gap: 0.6rem; }
.chip label { border-color: var(--line); background: #fff; border-radius: 999px; min-height: 48px; padding: 0.68rem 1rem; }
.chip input:checked + label { background: var(--stage); border-color: var(--stage); color: #fff; }
.desk-actions { margin-top: 0.25rem; }
.desk-actions .fine { padding: 0.65rem 0; font-weight: 700; }

.section { padding-block: clamp(3rem, 6vw, 5.25rem); }
.section + .section { border-top: 1px solid rgba(216,225,234,.72); }
.impact.section { padding-bottom: 2.5rem; }
.stories.section { padding-top: 2.5rem; }
#sent.section { padding-top: 2rem; }
.page-about-team .hero + .section { padding-top: 2.5rem; }
.stage {
	background:
		radial-gradient(circle at 84% 18%, rgba(45,212,191,.16), transparent 32%),
		var(--stage);
}
.stage--spot::before { background: radial-gradient(circle at 12% 86%, rgba(255,138,36,.14), transparent 30%); }
.stage .ledger { color: #c6d9e8; }
.impact-item { border-top-color: rgba(198,217,232,.24); padding-top: 1rem; }
.impact-value, .stage-price { font-family: var(--display); font-weight: 700; color: var(--teal); }
.stage-quote { border-left-color: var(--teal); }
.stage-quote p { font-family: var(--display); font-weight: 600; }
.stage-quote cite { font-family: var(--body); color: var(--stage-soft); }

.kinetic-band {
	background:
		radial-gradient(circle at 90% 0%, rgba(45,212,191,.3), transparent 28%),
		linear-gradient(125deg, #e7fbf7, #edf7ff);
	border: 0;
}
.kinetic-inner { gap: clamp(1.5rem, 4vw, 3rem); padding-block: clamp(3.5rem, 7vw, 6rem); }
.kinetic-list { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 0.7rem; }
.kinetic-list li { background: rgba(255,255,255,.78); border: 1px solid rgba(13,127,120,.16); border-radius: 12px; padding: 0.8rem; }
.kinetic-actions { margin-bottom: 0; }
.kinetic-price { display: none; }

.ledger-table th { font-family: var(--body); font-weight: 700; text-transform: none; letter-spacing: 0; color: var(--ink-soft); }
.ledger-table td.num, .ledger-table th.num { font-family: var(--body); }
.ledger-table caption { font-family: var(--body); }
.table-wrap { border: 1px solid var(--line); border-radius: 16px; background: #fff; padding-inline: 0.8rem; }

.pathway-card {
	background: #fff;
	border: 1px solid var(--line);
	border-radius: 20px;
	padding: 1rem;
	box-shadow: 0 10px 28px rgba(16,35,63,.06);
}
.pathway-card { overflow: hidden; }
.pathway-card .plate { margin: -1rem -1rem 1rem; width: calc(100% + 2rem); max-width: none; }
.pathway-card .plate-frame img { border-radius: 0; }
.pathway-photo-treatment { position: relative; isolation: isolate; }
.pathway-photo-treatment::after {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: linear-gradient(135deg, rgba(45,212,191,.14), transparent 48%, rgba(255,138,36,.12));
	mix-blend-mode: color;
}
.pathway-card .go { color: var(--accent-700); font-weight: 800; }
.story-card { min-width: 0; }
.story-card h3 { font-family: var(--display); font-weight: 700; letter-spacing: -0.025em; }
.service-tile, .division-card, .capital-step {
	background: transparent;
	border: 0;
	border-top: 3px solid var(--accent-300);
	border-radius: 0;
	box-shadow: none;
	padding: 1rem 0 1.35rem;
}
.page-the-center-rooms .room-card {
	background: linear-gradient(145deg, #fff, var(--teal-wash));
	border: 1px solid rgba(13,127,120,.2);
	border-top: 5px solid var(--teal);
	border-radius: 12px;
	box-shadow: none;
	padding: 1.2rem;
}
.page-about-team .room-card, .page-contact .room-card, .founder-card {
	background: transparent;
	border: 0;
	border-top: 3px solid var(--line);
	border-radius: 0;
	box-shadow: none;
	padding: 1rem 0;
}
.reality-item, .tier-card {
	background: linear-gradient(145deg, rgba(255,255,255,.07), rgba(45,212,191,.08));
	border: 1px solid rgba(157,235,220,.22);
	border-radius: 12px;
	box-shadow: none;
	padding: 1.2rem;
}
.stories .story-grid { gap: clamp(1.5rem, 4vw, 3rem); }
.stories .story-card { border-top: 3px solid var(--line); padding-top: 1rem; }
.stories .story-card:nth-child(2) { border-top-color: var(--teal); }
.stories .story-card:nth-child(3) { border-top-color: var(--spark); }
.program-row h3 { font-size: var(--fs-1); line-height: 1.2; }
.cover-lines li { font-family: var(--display); font-weight: 650; }
.cover-lines li::before { display: none; }
.desk__prompt, .desk-directory > summary { font-family: var(--body); }
.desk-directory > summary { font-weight: 700; }
.eyebrow-like { font-family: var(--body); text-transform: none; letter-spacing: 0; font-weight: 700; }
.rates dd, .tier-amount { font-family: var(--display); font-weight: 700; color: var(--accent-700); }
.booking-form { border-radius: 20px; box-shadow: var(--shadow); }
.footer-heading { font-family: var(--body); font-weight: 800; }
.site-footer { border-top: 0; }
.site-footer .leaf-crown { opacity: 0.9; }

/* The BBOP signal line recurs as chrome, selection, hover, and recovery. */
.signal-line-divider {
	display: block;
	width: 100%;
	height: 4px;
	background: linear-gradient(90deg, var(--teal) 0 33%, var(--spark) 33% 66%, var(--verm) 66%);
}
.signal-line-hover { transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease; }
.signal-line-hover:hover { transform: translateY(-3px); border-color: rgba(13,127,120,.38); box-shadow: 0 16px 38px rgba(16,35,63,.11); }
.signal-line-empty::before {
	content: "";
	display: block;
	width: 9rem;
	height: 6px;
	margin-bottom: 1.4rem;
	border-radius: 999px;
	background: linear-gradient(90deg, var(--teal), var(--spark), var(--verm));
}
.chip label { position: relative; overflow: hidden; }
.chip input:checked + label::after {
	content: "";
	position: absolute;
	inset: auto 0 0;
	height: 4px;
	background: linear-gradient(90deg, var(--teal), var(--spark), var(--verm));
}
.omni-suggestions [role="option"][aria-selected="true"] { box-shadow: inset 5px 0 0 var(--teal); }
.home-impact { overflow: hidden; }
.home-impact-grid { display: grid; gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.home-impact-copy h2 { max-width: 16ch; }
.home-impact-numbers { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1rem; margin: 1.5rem 0; }
.home-impact-numbers div { border-top: 1px solid rgba(198,217,232,.3); padding-top: 0.8rem; }
.home-impact-numbers dt { color: var(--stage-soft); font-size: var(--fs--1); }
.home-impact-numbers dd { margin: 0.15rem 0 0; font-family: var(--display); font-weight: 750; font-size: clamp(2rem, 5vw, 3.5rem); color: var(--teal); }
.home-impact-plate .plate-frame, .home-impact-plate img { border-radius: 18px; }
.home-impact-plate .plate-caption { color: var(--stage-soft); }
[data-photo-story-id="workforce-header-plate"] { filter: brightness(1.28) contrast(.92); }
.notfound { position: relative; max-width: 68rem; padding-block: clamp(4rem, 9vw, 8rem); display: grid; gap: clamp(2rem, 6vw, 5rem); align-items: center; }
.notfound-ask { max-width: 43rem; margin: 1.5rem 0; padding: 1.2rem; border-radius: 18px; background: var(--teal-wash); border: 1px solid rgba(13,127,120,.2); }
.notfound-ask > label { display: block; margin-bottom: 0.65rem; font-family: var(--display); font-weight: 700; }
.notfound-links { display: flex; flex-wrap: wrap; gap: 0.6rem 1.4rem; list-style: none; padding: 0; }
.notfound-links a { font-weight: 750; }
.notfound-mark { padding: clamp(1.6rem, 5vw, 3rem); border-radius: 24px; background: linear-gradient(145deg, #fff, var(--teal-wash)); border: 1px solid rgba(13,127,120,.18); box-shadow: var(--shadow); }
.notfound-mark img { display: block; width: min(100%, 17rem); height: auto; }
.notfound-mark p { margin: 1.4rem 0 0; color: var(--ink-soft); }

@media (min-width: 760px) {
	.home-ask .omnibox-field { grid-template-columns: minmax(0,1fr) auto; gap: 0; }
	.home-ask .omnibox-field input[type="search"] { border-radius: 14px 0 0 14px; border-right: 0; }
	.home-ask .omnibox-field button[type="submit"] { border-radius: 0 14px 14px 0; }
}
@media (min-width: 960px) {
	.hero--home .hero-grid { grid-template-columns: minmax(0,1.06fr) minmax(25rem,.94fr); align-items: center; padding-block: clamp(3rem, 6vw, 6rem); }
	.hero--home .hero-inner { padding-top: 0; }
	.kinetic-inner { grid-template-columns: minmax(0,1.15fr) minmax(0,.85fr); }
	.home-impact-grid { grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); }
	.notfound { grid-template-columns: minmax(0,1.05fr) minmax(18rem,.95fr); }
	.nav-list { flex-direction: row; gap: clamp(1rem,2.1vw,2.2rem); justify-content: center; }
	.nav-list a { padding-inline: 0; }
}
@media (max-width: 700px) {
	.wrap { padding-inline: 1rem; }
	.masthead { grid-template-columns: 1fr auto; }
	.cta-nav { display: none; }
	.omnibox-field { flex-direction: column; gap: 0.55rem; }
	.omnibox input[type="search"], .omnibox button[type="submit"] { width: 100%; border: 1px solid var(--line); border-radius: 12px; }
	.omnibox button[type="submit"] { border-color: var(--stage); }
	.hero--home .hero-grid { padding-block: 2.5rem 3.25rem; }
	.hero--home .hero-inner { padding-block: 0; }
	.hero--home .hero-plate { margin-bottom: 0.5rem; }
	.kinetic-list { grid-template-columns: 1fr; }
	.hero-actions, .kinetic-actions, .desk-actions, .section p:has(> .btn) { align-items: stretch; }
	.hero-actions .btn, .desk-actions .btn { width: 100%; }
	.today-row { grid-template-columns: 1fr; }
	.sponsor-list { columns: 1; }
}

/* The masthead behaves like the Center's front desk and building wayfinding. */
.quick-rail {
	background: #0a1a30;
	color: var(--stage-soft);
	border-bottom: 1px solid rgba(198,217,232,.16);
	display: none;
}
.rail-items { justify-content: flex-end; gap: .2rem 1.35rem; }
.rail-items a, .rail-items .rail-emphasis { color: var(--stage-soft); }
.rail-items a:hover, .rail-items a:focus-visible { color: #fff; }
.rail-location { margin-right: auto; }
.rail-location a { display: flex; gap: .45rem; align-items: baseline; }
.rail-location strong { color: var(--teal); font-weight: 800; }
.rail-location span { color: var(--stage-soft); }
.site-header {
	background: linear-gradient(110deg, #effcf9 0%, #f7fbff 72%);
	color: var(--ink);
	box-shadow: 0 16px 36px rgba(10,26,48,.12);
}
.masthead { position: relative; padding-block: 1rem .8rem; gap: .8rem 1.25rem; }
.masthead::before {
	content: "";
	position: absolute;
	right: 8%;
	top: .25rem;
	width: 12rem;
	height: 12rem;
	background: var(--teal);
	-webkit-mask: url("img/logo-mark.png") center / contain no-repeat;
	mask: url("img/logo-mark.png") center / contain no-repeat;
	opacity: .13;
	pointer-events: none;
}
.brand-lockup {
	position: relative;
	display: inline-flex;
	background: transparent;
	border-radius: 0;
	padding: 0;
	box-shadow: none;
}
.brand-logo { width: clamp(8.25rem, 12vw, 10.5rem); }
.site-header .omnibox input[type="search"] { border-color: var(--stage); }
.site-header .omnibox button[type="submit"] { color: var(--stage); background: var(--teal); border-color: var(--teal); }
.site-header .omnibox button[type="submit"]:hover,
.site-header .omnibox button[type="submit"]:focus-visible { color: var(--stage); background: #72e8d8; border-color: #72e8d8; }
.nav-disclosure { border-top: 0; }
.menu-btn { margin-top: .8rem; color: var(--stage); background: #fff; border-color: rgba(16,35,63,.3); }
.menu-btn:hover, .menu-btn:focus-visible { background: var(--teal-wash); }
.center-directory { margin: 0; padding: .8rem 1rem; background: var(--stage); color: var(--stage-soft); }
.center-directory strong { display: block; color: var(--teal); font-family: var(--display); font-size: var(--fs--1); font-weight: 850; text-transform: uppercase; letter-spacing: .08em; }
.center-directory span { display: block; max-width: 18rem; margin-top: .1rem; font-size: .78rem; line-height: 1.35; }
.nav-list { counter-reset: bbop-wayfinding; }
.nav-list li { counter-increment: bbop-wayfinding; border-top: 1px solid var(--line); }
.nav-list a { color: var(--stage); display: grid; grid-template-columns: auto minmax(0,1fr); align-items: center; gap: .65rem; padding: .75rem 1rem; }
.nav-list a::before {
	content: counter(bbop-wayfinding);
	display: block;
	position: static;
	width: auto;
	height: auto;
	margin: 0;
	background: none;
	border-radius: 0;
	transform: none;
	color: var(--teal);
	font-size: .72rem;
	font-weight: 800;
	letter-spacing: .12em;
}
.nav-list a { transition: color .16s ease, background-color .16s ease; }
.nav-list a:hover,
.nav-list a:focus-visible,
.nav-list a[aria-current="page"] { color: var(--stage); background: var(--teal-wash); }
.nav-list a:hover::before,
.nav-list a:focus-visible::before,
.nav-list a[aria-current="page"]::before { background: transparent; }
.nav-list li:nth-child(3n + 2) a::before { color: var(--spark); }
.nav-list li:nth-child(3n) a::before { color: var(--verm); }

/* Suggested questions make the Ask surface visibly usable before typing. */
.home-ask-links { gap: .55rem; }
.home-ask-links a {
	display: inline-flex;
	align-items: center;
	min-height: 42px;
	padding: .55rem .75rem;
	border: 1px solid rgba(157,235,220,.38);
	border-radius: 10px;
	text-decoration: none;
}
.home-ask-links a:hover, .home-ask-links a:focus-visible { background: rgba(45,212,191,.12); }
.ask-proof-next { color: #ffd5a7 !important; font-weight: 800; }

/* 599 operates as a dark, active room: what's happening and what can be booked. */
.today { background: var(--stage); color: var(--stage-ink); }
.today h2 { color: #fff; }
.today a:not(.btn) { color: var(--teal); }
.today .fine, .today .ledger { color: var(--stage-soft); }
.today .today-row { border-color: rgba(198,217,232,.22); }
.today .table-wrap { background: rgba(255,255,255,.05); border-color: rgba(198,217,232,.24); }
.today .ledger-table th, .today .ledger-table td, .today .ledger-table caption { color: var(--stage-ink); border-color: rgba(198,217,232,.22); }
.today .ledger-table caption { color: var(--stage-soft); }
.today .btn--ghost { color: var(--stage); background: #fff; border-color: #fff; }

/* Pathways are directional panels, not another family of soft cards. */
.pathway-card {
	border: 0;
	border-left: 8px solid var(--teal);
	border-radius: 0;
	box-shadow: none;
	clip-path: polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 0 100%);
}
.pathway-grid { counter-reset: bbop-path; }
.pathway-card { counter-increment: bbop-path; }
.pathway-card::after {
	content: counter(bbop-path);
	position: absolute;
	right: .8rem;
	bottom: .3rem;
	font-family: var(--display);
	font-size: 2.8rem;
	font-weight: 850;
	line-height: 1;
	color: var(--teal);
	opacity: .12;
}
.pathway-card--workforce { border-left-color: var(--spark); }
.pathway-card--capital { border-left-color: var(--verm); }
.pathway-card--center { border-left-color: var(--teal); }
.pathway-card:hover { box-shadow: 0 12px 28px rgba(16,35,63,.1); }

/* Room listings read like a floor guide instead of interchangeable product cards. */
.page-the-center-rooms .room-card {
	border: 0;
	border-left: 7px solid var(--teal);
	border-radius: 0;
	background: #fff;
	clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%);
}

.search-answer-demo {
	position: relative;
	overflow: hidden;
	max-width: 54rem;
	margin: 1.5rem 0 2rem;
	padding: clamp(1.25rem,3vw,2rem);
	background: var(--stage);
	color: var(--stage-ink);
	border-left: 8px solid var(--teal);
	clip-path: polygon(0 0, calc(100% - 26px) 0, 100% 26px, 100% 100%, 0 100%);
}
.search-answer-demo::after {
	content: "";
	position: absolute;
	right: -2rem;
	top: -2.5rem;
	width: 11rem;
	height: 11rem;
	background: var(--teal);
	-webkit-mask: url("img/logo-mark.png") center / contain no-repeat;
	mask: url("img/logo-mark.png") center / contain no-repeat;
	opacity: .09;
	pointer-events: none;
}
.search-answer-demo > * { position: relative; z-index: 1; }
.search-answer-demo p { margin-bottom: .5rem; }
.search-answer-question { color: var(--teal); font-weight: 800; }
.search-answer-value { font-size: var(--fs-1); }
.search-answer-demo div { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; margin-top: 1rem; }
.search-answer-demo a { color: #fff; font-weight: 750; }

/* The press archive works like a media desk: a format pulse, then read/listen/watch channels. */
.coverage-pulse {
	display: grid;
	grid-template-columns: auto minmax(6rem,1fr);
	gap: 1rem 2rem;
	align-items: center;
	margin: 1.25rem 0 2rem;
	padding: clamp(1.25rem,3vw,2rem);
	background: var(--stage);
	color: var(--stage-ink);
	border-radius: 18px;
}
.coverage-pulse-total { display: flex; align-items: baseline; gap: .65rem; }
.coverage-pulse-total strong { font-family: var(--display); font-size: clamp(3rem,8vw,5.5rem); line-height: 1; color: var(--teal); }
.coverage-pulse-total span { color: var(--stage-soft); font-weight: 700; }
.coverage-pulse-track { display: grid; grid-template-columns: 3fr 1fr 1fr; align-items: center; height: 10px; overflow: hidden; border-radius: 999px; }
.coverage-pulse-track span { height: 100%; background: var(--teal); }
.coverage-pulse-track span:nth-child(2) { background: var(--spark); }
.coverage-pulse-track span:nth-child(3) { background: var(--verm); }
.coverage-pulse-formats { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .75rem; margin: 0; }
.coverage-pulse-formats div { display: flex; justify-content: space-between; gap: 1rem; padding-top: .65rem; border-top: 1px solid rgba(198,217,232,.24); }
.coverage-pulse-formats dt { color: var(--stage-soft); }
.coverage-pulse-formats dd { margin: 0; color: #fff; font-weight: 800; }
.press-wall { display: grid; gap: clamp(2rem, 5vw, 4.5rem); margin-top: 2rem; }
.press-channel { display: grid; gap: 1.25rem; }
.press-channel-head { align-self: start; padding-top: 1rem; border-top: 6px solid var(--teal); }
.press-channel--radio .press-channel-head { border-top-color: var(--spark); }
.press-channel--video .press-channel-head { border-top-color: var(--verm); }
.press-channel-head > span { color: var(--ink-soft); font-weight: 800; letter-spacing: .1em; }
.press-channel-head p { margin: .25rem 0 0; color: var(--accent-700); font-weight: 800; text-transform: uppercase; letter-spacing: .08em; font-size: .72rem; }
.press-channel-head h3 { margin: .25rem 0 0; font-size: var(--fs-2); }
.press-channel-list { border-top: 1px solid var(--line); }
.press-mention {
	display: grid;
	grid-template-columns: minmax(7rem,.7fr) minmax(0,1.6fr);
	gap: clamp(1rem,3vw,2rem);
	align-items: start;
	padding: 1.35rem 0;
	border-bottom: 1px solid var(--line);
}
.press-outlet-mark {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	min-height: 6rem;
	padding: .8rem;
	background: var(--teal-wash);
	color: var(--stage);
	font-family: var(--display);
	font-size: clamp(.72rem,1.3vw,.95rem);
	font-weight: 750;
	line-height: 1.15;
	box-shadow: inset 5px 0 0 var(--teal);
}
.press-outlet-mark span { color: var(--teal-ink); font-size: 1.3rem; font-weight: 850; letter-spacing: .08em; }
.press-channel--radio .press-outlet-mark { background: #fff2df; box-shadow: inset 5px 0 0 var(--spark); }
.press-channel--video .press-outlet-mark { background: #fff0ee; box-shadow: inset 5px 0 0 var(--verm); }
.press-mention h4 { font-size: var(--fs-1); line-height: 1.25; margin-bottom: .45rem; }
.press-mention-copy > p:last-child { margin: 0; color: var(--ink-soft); font-size: var(--fs--1); }

@media (min-width: 840px) {
	.press-channel { grid-template-columns: minmax(10rem,.35fr) minmax(0,1.65fr); }
}

/* Venue rates become labeled blocks on small screens instead of compressed columns. */
@media (max-width: 700px) {
	.proto-banner { padding-block: .35rem; font-size: .67rem; }
	.quick-rail .rail-items { flex-wrap: nowrap; justify-content: flex-start; min-height: 2.2rem; }
	.quick-rail .rail-items li:not(.rail-location) { display: none; }
	.rail-location a { padding-block: .45rem; }
	.masthead { grid-template-columns: minmax(0,1fr) auto; padding-block: .65rem; }
	.brand-lockup { padding: .3rem .5rem; border-radius: 10px; }
	.brand-logo { width: 7.5rem; }
	.nav-disclosure { grid-column: 2; grid-row: 1; border: 0; }
	.menu-btn { margin: 0; }
	.nav-disclosure .primary-nav { position: absolute; inset: 100% 0 auto; padding: 1rem; background: #effcf9; border-top: 1px solid rgba(16,35,63,.16); box-shadow: 0 18px 30px rgba(10,26,48,.2); }
	.center-directory { margin-bottom: .75rem; }
	.coverage-pulse { grid-template-columns: 1fr; gap: 1rem; }
	.coverage-pulse-track, .coverage-pulse-formats { grid-column: 1; }
	.press-mention { grid-template-columns: 1fr; gap: .8rem; }
	.press-outlet-mark { min-height: 0; flex-direction: row; align-items: baseline; gap: 1rem; }
	.page-the-center-rooms .venue-table,
	.page-the-center-rooms .venue-table tbody,
	.page-the-center-rooms .venue-table tr,
	.page-the-center-rooms .venue-table th,
	.page-the-center-rooms .venue-table td { display: block; width: 100%; }
	.page-the-center-rooms .venue-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.page-the-center-rooms .venue-table tr { padding: 1rem 0; border-top: 1px solid var(--line); }
	.page-the-center-rooms .venue-table tr:first-child { border-top: 0; }
	.page-the-center-rooms .venue-table th,
	.page-the-center-rooms .venue-table td { border: 0; padding: .25rem 0; }
	.page-the-center-rooms .venue-table th[scope="row"] { margin-bottom: .35rem; color: var(--stage); font-size: var(--fs-1); }
	.page-the-center-rooms .venue-table td { display: flex; justify-content: space-between; gap: 1rem; text-align: right; }
	.page-the-center-rooms .venue-table td::before { content: attr(data-label); color: var(--ink-soft); font-weight: 700; text-align: left; }
	.footer-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1.5rem 1rem; }
	.footer-col--brand, .footer-grid > .footer-col:last-child { grid-column: 1 / -1; }
	.footer-col li { margin-bottom: .3rem; }
}

@media (min-width: 960px) {
	.primary-nav { display: grid; grid-template-columns: minmax(10rem,.3fr) minmax(0,1.7fr); gap: 0; align-items: stretch; margin-top: .25rem; background: #fff; border: 1px solid var(--line); }
	.nav-list { margin-inline: 0; justify-content: stretch; display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 0; }
	.nav-list li { display: grid; border-top: 0; border-left: 1px solid var(--line); }
	.nav-list a { align-content: center; }
}