/**
 * Solutions menu: overview, six school-type pages, five role pages and the seven buyer pages.
 * Tokens only (tokens-school-os.css). Every block works in light, dark/oled and at 390px.
 */

/* ── shared type + actions ─────────────────────────────────────────────── */
.sol-hub, .sol-seg, .sol-persona, .sol-buyer { color: var(--school-ink); padding-block-end: 2rem; }
.sol-eyebrow { margin: 0 0 0.5rem; font: 700 0.8125rem/1 var(--font-mono, monospace); letter-spacing: 0.08em; text-transform: uppercase; color: var(--school-green); }
.sol-headline { margin: 0 0 0.75rem; font-size: clamp(2rem, 5vw, 3.25rem); line-height: 1.1; color: var(--school-ink); max-inline-size: 22ch; }
.sol-lead { margin: 0 0 1.25rem; font-size: 1.1875rem; line-height: 1.55; color: var(--school-ink-muted); max-inline-size: 44rem; }
.sol-actions { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: center; }
.sol-section-title { margin: 0 0 0.5rem; font-size: clamp(1.375rem, 3vw, 1.75rem); line-height: 1.2; color: var(--school-ink); }
.sol-note { margin: 1rem 0 0; color: var(--school-ink-muted); max-inline-size: 44rem; }
.sol-note a, .sol-region a, .sol-close__sub a { color: var(--school-green); font-weight: 600; }
.sol-crumbs { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0 0 1rem; font-size: 0.875rem; color: var(--school-ink-muted); }
.sol-crumbs a { color: var(--school-green); font-weight: 600; text-decoration: none; }
.sol-hub section, .sol-seg section, .sol-seg nav.sol-modules, .sol-persona section, .sol-persona nav.sol-modules, .sol-buyer section { padding-block: 1.75rem; }

/* hero: ruled paper with a margin line, the one material every Solutions page shares */
.sol-hub__hero, .sol-seg__hero, .sol-persona__hero, .sol-buyer__hero {
  padding-block: 2.5rem 2rem;
  padding-inline-start: clamp(1.25rem, 4vw, 2.5rem);
  border-inline-start: 3px solid var(--school-margin);
  background: repeating-linear-gradient(to bottom, transparent 0, transparent 2.1rem, color-mix(in srgb, var(--school-ruled) 55%, transparent) 2.1rem, color-mix(in srgb, var(--school-ruled) 55%, transparent) calc(2.1rem + 1px));
}
.sol-region { margin: 1.25rem 0 0; padding: 0.75rem 1rem; max-inline-size: 44rem; background: var(--school-manila); border-radius: 0.5rem; color: var(--school-ink); }

/* ── overview: school directory ────────────────────────────────────────── */
.sol-index__list { list-style: none; margin: 1.25rem 0 0; padding: 0; background: var(--school-tile); border: 1px solid var(--school-ruled); border-inline-start: 3px solid var(--school-margin); border-radius: 0.5rem; }
.sol-index__row { display: grid; grid-template-columns: 3.25rem minmax(0, 1.6fr) minmax(0, 1fr); gap: 0.5rem 1.5rem; align-items: start; padding: 1.5rem 1.5rem 1.5rem 1rem; border-bottom: 1px solid var(--school-ruled); }
.sol-index__row:last-child { border-bottom: 0; }
.sol-index__n { font: 700 2.25rem/1 var(--font-serif, Georgia, serif); color: var(--school-margin); text-align: end; }
.sol-index__name { margin: 0 0 0.35rem; font-size: 1.5rem; }
.sol-index__name a { color: var(--school-ink); text-decoration: none; }
.sol-index__name a:hover { color: var(--school-green); text-decoration: underline; }
.sol-index__lead { margin: 0 0 0.35rem; color: var(--school-ink); font-weight: 600; }
.sol-index__problem { margin: 0; color: var(--school-ink-muted); }
.sol-index__label { margin: 0 0 0.4rem; font: 700 0.75rem/1 var(--font-mono, monospace); letter-spacing: 0.08em; text-transform: uppercase; color: var(--school-ink-muted); }
.sol-chips { list-style: none; margin: 0 0 0.75rem; padding: 0; display: flex; flex-wrap: wrap; gap: 0.4rem; }
.sol-chips li { padding: 0.2rem 0.65rem; border: 1px solid var(--school-ruled); border-radius: 999px; background: var(--school-paper); color: var(--school-ink-muted); font-size: 0.8125rem; }
.sol-index__go { color: var(--school-green); font-weight: 700; text-decoration: none; }
.sol-index__go:hover { text-decoration: underline; }

.sol-roles__grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(18rem, 100%), 1fr)); margin-top: 1rem; }
.sol-roles__col { padding: 1.25rem 1.5rem; background: var(--school-manila); border-radius: 0.5rem; border-top: 3px solid var(--school-highlighter); }
.sol-roles__head { margin: 0 0 0.75rem; font-size: 1.0625rem; color: var(--school-ink); }
.sol-roles__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.4rem; }
.sol-roles__list a { color: var(--school-green); font-weight: 600; text-decoration: none; }
.sol-roles__list a:hover { text-decoration: underline; }
.sol-faq__list { margin: 1rem 0 0; display: grid; gap: 0; border-top: 1px solid var(--school-ruled); }
.sol-faq__item { padding: 1rem 0; border-bottom: 1px solid var(--school-ruled); display: grid; gap: 0.25rem 2rem; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); }
.sol-faq__item dt { font-weight: 700; color: var(--school-ink); }
.sol-faq__item dd { margin: 0; color: var(--school-ink-muted); }
.sol-close { display: flex; flex-wrap: wrap; gap: 1rem 2rem; justify-content: space-between; align-items: center; padding-block: 1.5rem 2.5rem; }
.sol-close__title { margin: 0 0 0.25rem; font-weight: 700; font-size: 1.125rem; color: var(--school-ink); }
.sol-close__sub { margin: 0; color: var(--school-ink-muted); }
.sol-hub .sol-close { justify-content: flex-start; }

/* ── segment pages: problem note, rows, pathway, modules ───────────────── */
.sol-problem { display: grid; gap: 1.5rem; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); align-items: start; }
.sol-problem__main p { margin: 0; color: var(--school-ink-muted); font-size: 1.0625rem; line-height: 1.6; max-inline-size: 42rem; }
.sol-problem__aside { padding: 1rem 1.25rem; background: var(--school-manila); border-inline-start: 4px solid var(--school-highlighter); border-radius: 0.375rem; }
.sol-problem__aside p { margin: 0; color: var(--school-ink); }
.sol-problem__label { margin-bottom: 0.4rem !important; font: 700 0.75rem/1 var(--font-mono, monospace); letter-spacing: 0.08em; text-transform: uppercase; color: var(--school-ink-muted) !important; }
.sol-lead-block__head { margin-bottom: 1.25rem; }
.sol-lead-block__intro { margin: 0; color: var(--school-ink-muted); max-inline-size: 44rem; font-size: 1.0625rem; }
.sol-lead-block a { color: var(--school-green); font-weight: 600; }

.sol-rows__list, .sol-pathway__steps { list-style: none; margin: 1rem 0 0; padding: 0; background: var(--school-tile); border: 1px solid var(--school-ruled); border-inline-start: 3px solid var(--school-margin); border-radius: 0.5rem; }
.sol-rows__row { display: grid; grid-template-columns: 2.5rem minmax(10rem, 16rem) 1fr; gap: 0.25rem 1rem; align-items: baseline; padding: 1rem 1.25rem; border-bottom: 1px solid var(--school-ruled); }
.sol-rows__row:last-child { border-bottom: 0; }
.sol-rows__n + p { grid-column: 2 / -1; margin: 0; color: var(--school-ink); }
.sol-rows__n { font: 700 0.8125rem/1 var(--font-mono, monospace); color: var(--school-green); }
.sol-rows__row h3 { margin: 0; font-size: 1.0625rem; color: var(--school-ink); }
.sol-rows__row p { margin: 0; color: var(--school-ink-muted); }
.sol-pathway__steps { counter-reset: pw; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(14rem, 100%), 1fr)); background: transparent; border: 0; gap: 0.75rem; }
.sol-pathway__steps li { counter-increment: pw; padding: 1rem 1.1rem; background: var(--school-tile); border: 1px solid var(--school-ruled); border-top: 3px solid var(--school-green); border-radius: 0.5rem; color: var(--school-ink); }
.sol-pathway__steps li::before { content: counter(pw, decimal-leading-zero); display: block; margin-bottom: 0.4rem; font: 700 0.8125rem/1 var(--font-mono, monospace); color: var(--school-green); }
.sol-modules__list { list-style: none; margin: 0.75rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.75rem; }
.sol-modules__list a { display: inline-block; padding: 0.55rem 1rem; border: 1px solid var(--school-ruled); border-radius: 999px; background: var(--school-tile); color: var(--school-green); font-weight: 600; text-decoration: none; }
.sol-modules__list a:hover { border-color: var(--school-green); }

/* ── lead kinds ─────────────────────────────────────────────────────────── */
/* path: four desks joined by a rule */
.sol-path { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(13rem, 100%), 1fr)); position: relative; }
.sol-path__step { position: relative; padding: 3rem 1.1rem 1.1rem; background: var(--school-tile); border: 1px solid var(--school-ruled); border-radius: 0.5rem; }
.sol-path__step::after { content: ""; position: absolute; inset-block-start: 1.25rem; inset-inline-start: 3rem; inset-inline-end: -1rem; border-block-start: 2px dashed var(--school-ruled); }
.sol-path__step:last-child::after { display: none; }
.sol-path__n { position: absolute; inset-block-start: 0.55rem; inset-inline-start: 0.85rem; display: grid; place-items: center; inline-size: 1.75rem; block-size: 1.75rem; border-radius: 50%; background: var(--school-green); color: var(--school-tile); font: 700 0.8125rem/1 var(--font-mono, monospace); }
.sol-path__name { margin: 0 0 0.35rem; font-size: 1.125rem; }
.sol-path__name a { color: var(--school-ink); text-decoration: none; }
.sol-path__name a:hover { color: var(--school-green); text-decoration: underline; }
.sol-path__step p { margin: 0; color: var(--school-ink-muted); }

/* config + ledger: ruled tables */
.sol-table-wrap { overflow-x: auto; }
.sol-table { inline-size: 100%; border-collapse: collapse; background: var(--school-tile); border: 1px solid var(--school-ruled); }
.sol-table th, .sol-table td { padding: 0.9rem 1.1rem; text-align: start; vertical-align: top; border-bottom: 1px solid var(--school-ruled); color: var(--school-ink); }
.sol-table thead th { background: var(--school-manila); font: 700 0.75rem/1 var(--font-mono, monospace); letter-spacing: 0.08em; text-transform: uppercase; color: var(--school-ink-muted); }
.sol-table tbody th { font-weight: 700; inline-size: 40%; }
.sol-table__sub { display: block; margin-top: 0.25rem; font-weight: 400; color: var(--school-ink-muted); }
.sol-table--ledger { border-inline-start: 3px solid var(--school-margin); }
.sol-table--ledger tbody th { font: 700 0.9375rem/1.3 var(--font-mono, monospace); inline-size: 28%; }
.sol-table--ledger tbody tr:nth-child(even) { background: var(--school-paper); }

/* day: a timetable with the slot in the margin */
.sol-day { list-style: none; margin: 0; padding: 0; background: var(--school-tile); border: 1px solid var(--school-ruled); border-radius: 0.5rem; overflow: hidden; }
.sol-day__slot { display: grid; grid-template-columns: minmax(8rem, 12rem) 1fr; border-bottom: 1px solid var(--school-ruled); }
.sol-day__slot:last-child { border-bottom: 0; }
.sol-day__when { padding: 1rem 1.1rem; background: var(--school-manila); border-inline-end: 3px solid var(--school-margin); font: 700 0.875rem/1.3 var(--font-mono, monospace); color: var(--school-ink); }
.sol-day__what { padding: 1rem 1.25rem; }
.sol-day__what p { margin: 0 0 0.25rem; color: var(--school-ink); }

/* split: two panels with a margin rule between */
.sol-split { display: grid; grid-template-columns: 1fr 1fr; background: var(--school-tile); border: 1px solid var(--school-ruled); border-radius: 0.5rem; overflow: hidden; }
.sol-split__panel { padding: 1.5rem; }
.sol-split__panel--campus { border-inline-start: 3px solid var(--school-margin); background: var(--school-paper); }
.sol-split__panel h3 { margin: 0 0 0.75rem; font-size: 1.125rem; color: var(--school-ink); }
.sol-split__panel ul { margin: 0; padding-inline-start: 1.1rem; display: grid; gap: 0.5rem; color: var(--school-ink); }
.sol-split__panel--group h3 { color: var(--school-green); }

/* trio: three tabs */
.sol-trio { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr)); }
.sol-trio__col { position: relative; padding: 2.5rem 1.25rem 1.25rem; background: var(--school-tile); border: 1px solid var(--school-ruled); border-radius: 0.5rem; }
.sol-trio__tab { position: absolute; inset-block-start: 0; inset-inline-start: 1rem; margin: 0; padding: 0.35rem 0.85rem; border-radius: 0 0 0.5rem 0.5rem; background: var(--school-highlighter); color: var(--school-chalkboard) !important; font: 700 0.8125rem/1.2 var(--font-mono, monospace); letter-spacing: 0.04em; text-transform: uppercase; }
html body .sol-trio .sol-trio__tab, html[data-theme="dark"] body .sol-trio .sol-trio__tab, html[data-theme="oled"] body .sol-trio .sol-trio__tab { color: var(--school-chalkboard) !important; -webkit-text-fill-color: var(--school-chalkboard); }
.sol-trio__col p { margin: 0 0 0.6rem; color: var(--school-ink); }

/* timeline: a vertical rule with dots */
.sol-timeline { list-style: none; margin: 0; padding: 0 0 0 1.75rem; border-inline-start: 3px solid var(--school-green); display: grid; gap: 1.25rem; }
.sol-timeline__item { position: relative; padding: 0.9rem 1.1rem; background: var(--school-tile); border: 1px solid var(--school-ruled); border-radius: 0.5rem; }
.sol-timeline__item::before { content: ""; position: absolute; inset-block-start: 1.25rem; inset-inline-start: -2.45rem; inline-size: 1rem; block-size: 1rem; border-radius: 50%; background: var(--school-paper); border: 3px solid var(--school-green); }
.sol-timeline__item h3 { margin: 0 0 0.25rem; font-size: 1.0625rem; color: var(--school-ink); }
.sol-timeline__item p { margin: 0 0 0.25rem; color: var(--school-ink-muted); }

/* brief: questions on a manila sheet, the question highlighted */
.sol-brief { margin: 0; padding: 1.25rem 1.5rem; background: var(--school-manila); border-radius: 0.5rem; border-inline-start: 4px solid var(--school-highlighter); display: grid; gap: 0.25rem; }
.sol-brief__item { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 0.5rem 2rem; padding: 0.9rem 0; border-bottom: 1px dashed var(--school-ruled); }
.sol-brief__item:last-child { border-bottom: 0; }
.sol-brief dt { font: 600 1.1875rem/1.3 var(--font-serif, Georgia, serif); color: var(--school-ink); }
.sol-brief dd { margin: 0; color: var(--school-ink-muted); }

/* card: one family card, drawn as a phone-width sheet */
.sol-card-wrap { display: grid; grid-template-columns: minmax(0, 24rem) minmax(0, 1fr); gap: 2rem; align-items: start; }
.sol-card-side { padding: 1.25rem 1.5rem; background: var(--school-manila); border-inline-start: 4px solid var(--school-highlighter); border-radius: 0.375rem; }
.sol-card-side h3 { margin: 0 0 0.75rem; font-size: 1.125rem; color: var(--school-ink); }
.sol-card-side ul { margin: 0; padding-inline-start: 1.1rem; display: grid; gap: 0.5rem; color: var(--school-ink); }
.sol-card { inline-size: min(100%, 24rem); padding: 1rem; background: var(--school-tile); border: 2px solid var(--school-ink); border-radius: 1.75rem; display: grid; gap: 0.75rem; }
.sol-card__row { padding: 0.9rem 1rem; background: var(--school-paper); border-radius: 1rem; border: 1px solid var(--school-ruled); }
.sol-card__row p { margin: 0.35rem 0 0; color: var(--school-ink); }
.sol-card__tag { display: inline-block; padding: 0.15rem 0.6rem; border-radius: 999px; background: var(--school-ledger); color: var(--school-ink); font: 700 0.75rem/1.2 var(--font-mono, monospace); text-transform: uppercase; letter-spacing: 0.06em; }
.sol-card__action { justify-self: start; }

/* spec: a terminal-style sheet on the chalkboard */
.sol-spec { margin: 0; padding: 0.5rem 1.5rem; background: var(--school-chalkboard); border-radius: 0.5rem; color: var(--school-chalk); }
.sol-spec__row { display: grid; grid-template-columns: 9rem 1fr; gap: 0.5rem 1.5rem; padding: 0.9rem 0; border-bottom: 1px solid color-mix(in srgb, var(--school-chalk) 22%, transparent); }
.sol-spec__row:last-child { border-bottom: 0; }
.sol-spec dt { font: 700 0.875rem/1.4 var(--font-mono, monospace); letter-spacing: 0.06em; color: var(--school-highlighter); }
.sol-spec dd { margin: 0; color: var(--school-chalk); }
.sol-spec dd a { color: var(--school-chalk) !important; text-decoration: underline; }

/* ── buyer pages ───────────────────────────────────────────────────────── */
.sol-buyer__hero .mkt-save-offline { margin: 0; }
.sol-evidence__grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(16rem, 100%), 1fr)); margin-top: 1rem; list-style: none; padding: 0; }
.sol-evidence__item { padding: 1.1rem 1.25rem; background: var(--school-tile); border: 1px solid var(--school-ruled); border-inline-start: 4px solid var(--school-green); border-radius: 0.5rem; color: var(--school-ink); }
.sol-evidence__item::before { display: block; margin-bottom: 0.4rem; font: 700 0.75rem/1 var(--font-mono, monospace); letter-spacing: 0.08em; text-transform: uppercase; color: var(--school-green); content: attr(data-n); }
.sol-rail-list { list-style: none; margin: 0.75rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.sol-rail-list li { padding: 0.35rem 0.85rem; border: 1px solid var(--school-green); border-radius: 999px; background: var(--school-ledger); color: var(--school-ink); font-weight: 600; }
.sol-links { display: flex; flex-wrap: wrap; gap: 0.75rem; margin: 1rem 0 0; padding: 0; list-style: none; }
.sol-links a { display: inline-block; padding: 0.55rem 1rem; border: 1px solid var(--school-ruled); border-radius: 999px; background: var(--school-tile); color: var(--school-green); font-weight: 600; text-decoration: none; }
.sol-steps { list-style: none; counter-reset: bs; margin: 1rem 0 0; padding: 0; display: grid; gap: 0.75rem; grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr)); }
.sol-steps li { counter-increment: bs; padding: 1rem 1.1rem; background: var(--school-tile); border: 1px solid var(--school-ruled); border-top: 3px solid var(--school-green); border-radius: 0.5rem; }
.sol-steps li::before { content: counter(bs); display: block; margin-bottom: 0.4rem; font: 700 0.8125rem/1 var(--font-mono, monospace); color: var(--school-green); }
.sol-steps a { color: var(--school-ink); font-weight: 600; }
.sol-pack { padding: 1.25rem 1.5rem; background: var(--school-manila); border-radius: 0.5rem; border-inline-start: 4px solid var(--school-highlighter); }
.sol-pack p { margin: 0 0 0.75rem; color: var(--school-ink); max-inline-size: 44rem; }
.sol-pack a { color: var(--school-green); font-weight: 600; }

/* ── phone ─────────────────────────────────────────────────────────────── */
@media (max-width: 48rem) {
  .sol-index__row { grid-template-columns: 2.25rem minmax(0, 1fr); padding-inline-end: 1rem; }
  .sol-index__side { grid-column: 2; }
  .sol-index__n { font-size: 1.75rem; }
  .sol-problem, .sol-faq__item, .sol-brief__item, .sol-split, .sol-card-wrap { grid-template-columns: 1fr; }
  .sol-split__panel--campus { border-inline-start: 0; border-block-start: 3px solid var(--school-margin); }
  .sol-rows__row { grid-template-columns: 2rem 1fr; }
  .sol-rows__row p { grid-column: 2; }
  .sol-day__slot { grid-template-columns: 1fr; }
  .sol-day__when { border-inline-end: 0; border-block-end: 3px solid var(--school-margin); }
  .sol-spec__row { grid-template-columns: 1fr; gap: 0.15rem; }
  .sol-path__step::after { display: none; }
  .sol-table tbody th, .sol-table--ledger tbody th { inline-size: auto; }
  .sol-table th, .sol-table td { padding: 0.7rem 0.75rem; }
}