/* =====================================================================
   MBS — Ezine Ministry Business School
   "Executive Heritage" design system  ·  authoritative shared stylesheet
   ---------------------------------------------------------------------
   Loaded LAST in every /school page (after each page's inline <style>), so
   the token values and component rules here are the single source of truth.
   Every page already speaks the same token vocabulary (--ground, --ink,
   --accent, --good, --font-display, --font-body …); this file re-defines
   those tokens with the Heritage palette so all existing component CSS
   recolours coherently, then layers the institutional components on top.

   Fonts are loaded from Google Fonts via a <link> in each page head:
     Libre Baskerville  — institutional / editorial serif (dignified, readable)
     Source Sans 3      — interface sans (labels, buttons, data, mobile)

   PALETTE
     Heritage Navy   #17243A   primary institutional colour
     Oxblood/Burgundy#6A252D   important leadership actions, featured CTAs
     Antique Gold    #B08A45   borders, seals, dividers, active states (sparing)
     Warm Ivory      #F7F1E7   primary page background (replaces stark white)
     Soft Parchment  #EDE1CF   secondary panels, mentor notes, reflections
     Warm Charcoal   #292621   primary body text
     Muted Brown-Gray#6D655B   supporting labels
     Forest Green    #345443   progress, completion, healthy status
   ===================================================================== */

/* ============ TOKENS — LIGHT (primary) ============ */
:root {
  /* Heritage palette (raw) */
  --navy:        #17243A;
  --navy-hover:  #0F1826;   /* gentle darkening for primary button hover */
  --navy-soft:   #223247;
  --burgundy:    #6A252D;
  --burgundy-hover: #571E24;
  --gold:        #B08A45;
  --gold-soft:   #C7A876;
  --ivory:       #F7F1E7;
  --parchment:   #EDE1CF;
  --charcoal:    #292621;
  --brown-gray:  #6D655B;
  --forest:      #345443;
  --forest-soft: #4C7160;

  /* Semantic tokens (consumed by every page's existing component CSS) */
  --ground:      var(--ivory);
  --ground-alt:  var(--parchment);
  --ink:         var(--charcoal);
  --ink-soft:    #46403A;   /* softer charcoal, still strong contrast */
  --muted:       var(--brown-gray);
  --line:        #DCCDB2;   /* warm hairline border */
  --line-soft:   #E7DBC5;
  --line-strong: #C9B896;
  --accent:      var(--navy);      /* primary institutional colour + links */
  --accent-warm: var(--burgundy);  /* link hover / important accents */
  --highlight:   #ECDCB6;          /* soft gold wash for highlighted content */
  --good:        var(--forest);

  /* Gold used only as thin rules / accents, never as text on light ground */
  --gold-rule:   rgba(176, 138, 69, 0.55);
  --gold-faint:  rgba(176, 138, 69, 0.22);

  /* Fonts */
  --font-display: 'Libre Baskerville', 'Georgia', 'Times New Roman', serif;
  --font-body:    'Source Sans 3', 'Helvetica Neue', system-ui, sans-serif;

  /* Layout */
  --max-page: 1120px;
  --max-read: 68ch;
  --pad-x: clamp(1.25rem, 5vw, 3rem);
  --gap-section: clamp(4rem, 9vw, 7.5rem);

  /* Shape & depth — minimal corner rounding, restrained warm shadows */
  --radius-sm: 5px;
  --radius:    7px;
  --radius-lg: 10px;
  --shadow-sm: 0 1px 2px rgba(41, 38, 33, 0.05);
  --shadow-md: 0 2px 10px rgba(23, 36, 58, 0.07);
  --shadow-lg: 0 6px 26px rgba(23, 36, 58, 0.10);

  /* Motion — restrained */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --dur:  180ms;
}

/* ============ TOKENS — DARK (heritage study at night) ============ */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ground:      #14171F;
    --ground-alt:  #1B2130;
    --ink:         #EDE4D3;
    --ink-soft:    #CBBFA9;
    --muted:       #9A9081;
    --line:        #2C3446;
    --line-soft:   #222A39;
    --line-strong: #3A445A;
    --accent:      #C9A45E;   /* gold reads as accent on dark ground */
    --accent-warm: #D08C89;   /* lightened oxblood */
    --highlight:   #27314A;
    --good:        #7FA98C;
    --gold-rule:   rgba(201, 164, 94, 0.55);
    --gold-faint:  rgba(201, 164, 94, 0.22);
    --shadow-sm: 0 1px 2px rgba(0,0,0,0.30);
    --shadow-md: 0 2px 10px rgba(0,0,0,0.35);
    --shadow-lg: 0 6px 26px rgba(0,0,0,0.45);
  }
}
:root[data-theme="dark"] {
  --ground:      #14171F;
  --ground-alt:  #1B2130;
  --ink:         #EDE4D3;
  --ink-soft:    #CBBFA9;
  --muted:       #9A9081;
  --line:        #2C3446;
  --line-soft:   #222A39;
  --line-strong: #3A445A;
  --accent:      #C9A45E;
  --accent-warm: #D08C89;
  --highlight:   #27314A;
  --good:        #7FA98C;
  --gold-rule:   rgba(201, 164, 94, 0.55);
  --gold-faint:  rgba(201, 164, 94, 0.22);
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.30);
  --shadow-md: 0 2px 10px rgba(0,0,0,0.35);
  --shadow-lg: 0 6px 26px rgba(0,0,0,0.45);
}

/* ============ BASE ============ */
body {
  background: var(--ground);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 1.0625rem;      /* 17px — comfortable for mature readers */
  line-height: 1.7;
}
::selection { background: var(--navy); color: var(--ivory); }

/* Serif display faces: Libre Baskerville is generous, so tighten leading a touch */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  color: var(--ink);
  letter-spacing: 0;
  line-height: 1.22;
  text-wrap: balance;
}
h1 { font-weight: 700; }
h2, h3, h4 { font-weight: 700; }
/* Never let a long word or URL force horizontal overflow on narrow screens */
h1, h2, h3, h4, h5, h6, p, li, blockquote, figcaption { overflow-wrap: break-word; }

a { color: var(--accent); }
a:hover { color: var(--accent-warm); }
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 2px;
  border-radius: 3px;
}

/* ============ INSTITUTIONAL EYEBROW / LABEL ============ */
.mbs-eyebrow,
.eyebrow {
  font-family: var(--font-body);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--brown-gray);
}

/* ============ GOLD DIVIDER (hairline with centred lozenge) ============ */
.mbs-rule {
  display: flex; align-items: center; gap: 0.9rem;
  border: 0; margin: 1.75rem 0;
  color: var(--gold);
}
.mbs-rule::before, .mbs-rule::after {
  content: ""; flex: 1; height: 1px;
  background: var(--gold-rule);
}
.mbs-rule::after { }
.mbs-rule__mark { width: 6px; height: 6px; transform: rotate(45deg); background: var(--gold); flex: 0 0 auto; }

/* ============ BUTTONS ============
   Substantial, calm, confident. The pages use .cta / .btn / bare <button>;
   we retheme those and add feature/secondary variants.               */
.cta, .btn, .mbs-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 1rem;
  line-height: 1.2;
  padding: 0.8rem 1.5rem;
  min-height: 44px;                    /* comfortable touch target */
  background: var(--navy);
  color: var(--ivory);
  border: 1px solid var(--gold-faint);
  border-radius: var(--radius);
  text-decoration: none;
  cursor: pointer;
  box-shadow: var(--shadow-sm);
  transition: background var(--dur) var(--ease), transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.cta:hover, .btn:hover, .mbs-btn:hover {
  background: var(--navy-hover);
  color: var(--ivory);
  transform: translateY(-1px);
  box-shadow: var(--shadow-md);
}
.cta:active, .btn:active, .mbs-btn:active { transform: translateY(0); }

/* Featured / important leadership action — oxblood */
.cta--feature, .mbs-btn--feature, .btn--feature, .cta.feature {
  background: var(--burgundy);
  border-color: var(--gold-faint);
}
.cta--feature:hover, .mbs-btn--feature:hover, .btn--feature:hover, .cta.feature:hover {
  background: var(--burgundy-hover);
}

/* Secondary — quiet, bordered */
.cta--ghost, .mbs-btn--ghost, .btn--ghost {
  background: transparent;
  color: var(--navy);
  border: 1px solid var(--line-strong);
  box-shadow: none;
}
.cta--ghost:hover, .mbs-btn--ghost:hover, .btn--ghost:hover {
  background: var(--parchment);
  color: var(--navy);
  border-color: var(--gold);
}
:root[data-theme="dark"] .cta--ghost,
:root:not([data-theme="light"]) .cta--ghost { color: var(--ink); }

.cta:disabled, .btn:disabled, .mbs-btn:disabled,
.cta[disabled], button:disabled { opacity: 0.55; cursor: default; transform: none; box-shadow: none; }

/* ============ CARDS & PANELS ============ */
.mbs-card {
  background: var(--ground);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  padding: 1.5rem 1.65rem;
}
.mbs-panel {
  background: var(--ground-alt);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius);
  padding: 1.5rem 1.75rem;
}
/* A restrained gold top-rule accent for featured cards */
.mbs-card--featured { border-top: 3px solid var(--gold); }

/* ============ MENTOR'S COUNSEL ============
   Confidential, mature, personal — never a chat bubble.               */
.mbs-counsel {
  position: relative;
  background: var(--parchment);
  border: 1px solid var(--line);
  border-left: 3px solid var(--gold);
  border-radius: var(--radius);
  padding: 1.5rem 1.75rem 1.6rem;
  box-shadow: var(--shadow-sm);
}
.mbs-counsel__head {
  display: flex; align-items: center; gap: 0.85rem;
  margin-bottom: 0.9rem;
}
.mbs-counsel__monogram {
  flex: 0 0 auto;
  width: 42px; height: 42px; border-radius: 50%;
  display: grid; place-items: center;
  background: var(--navy); color: var(--gold);
  font-family: var(--font-display); font-weight: 700; font-size: 1.05rem;
  border: 1px solid var(--gold-rule);
}
.mbs-counsel__title {
  font-family: var(--font-display); font-weight: 700; font-size: 1.15rem;
  color: var(--ink); margin: 0;
}
.mbs-counsel__by { font-size: 0.82rem; color: var(--brown-gray); margin: 0.1rem 0 0; }
.mbs-counsel__body { color: var(--ink-soft); }
.mbs-counsel__body p { margin: 0 0 0.75rem; }

/* ============ PULL-QUOTE / SIGNIFICANT MENTOR STATEMENT ============
   A restrained serif-italic treatment with a thin gold rule, for a mentor's
   key statement or a highlighted principle. MBS teaches the BUSINESS of
   ministry only — this device carries leadership counsel, never doctrine or
   scripture; no such content is added by this system.                   */
.mbs-quote, .mbs-scripture, blockquote.mbs-quote, blockquote.mbs-scripture {
  font-family: var(--font-display);
  font-style: italic;
  font-size: 1.15rem;
  line-height: 1.55;
  color: var(--ink);
  border-left: 2px solid var(--gold);
  padding: 0.35rem 0 0.35rem 1.15rem;
  margin: 1.4rem 0;
}
.mbs-scripture cite {
  display: block; margin-top: 0.5rem;
  font-family: var(--font-body); font-style: normal;
  font-size: 0.82rem; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--brown-gray);
}

/* ============ CONFIDENTIAL REPORT / BRIEFING ============ */
.mbs-report {
  background: var(--ground);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-md);
}
.mbs-report__cover {
  background: var(--navy);
  color: var(--ivory);
  padding: 2rem 2rem 1.75rem;
  border-bottom: 3px solid var(--gold);
}
.mbs-report__seal { color: var(--gold); }
.mbs-report__kicker {
  font-family: var(--font-body); font-size: 0.72rem; font-weight: 600;
  letter-spacing: 0.2em; text-transform: uppercase; color: var(--gold-soft);
  margin: 0 0 0.5rem;
}
.mbs-report__title {
  font-family: var(--font-display); font-weight: 700;
  font-size: clamp(1.4rem, 3vw, 2rem); color: var(--ivory); margin: 0;
}
.mbs-report__meta { color: #C9BEA8; font-size: 0.9rem; margin: 0.6rem 0 0; }
.mbs-report__body { padding: 1.75rem 2rem 2rem; }

/* Status pills for assessments — never colour alone (icon + word carry meaning) */
.mbs-status {
  display: inline-flex; align-items: center; gap: 0.4rem;
  font-family: var(--font-body); font-size: 0.82rem; font-weight: 600;
  padding: 0.25rem 0.7rem; border-radius: 999px; border: 1px solid transparent;
}
.mbs-status--strong { background: rgba(52,84,67,0.12); color: var(--forest); border-color: rgba(52,84,67,0.35); }
.mbs-status--attention { background: rgba(176,138,69,0.14); color: #7A5E27; border-color: var(--gold-rule); }
.mbs-status--review { background: rgba(106,37,45,0.10); color: var(--burgundy); border-color: rgba(106,37,45,0.30); }
:root[data-theme="dark"] .mbs-status--attention,
:root:not([data-theme="light"]) .mbs-status--attention { color: var(--gold-soft); }
:root[data-theme="dark"] .mbs-status--review,
:root:not([data-theme="light"]) .mbs-status--review { color: var(--accent-warm); }

/* ============ PROGRESS & MILESTONES ============
   Fine gold indicators; forest-green completion.                      */
.progress-bar { background: var(--gold-faint) !important; height: 8px; border-radius: 999px; overflow: hidden; }
.progress-bar .fill { background: var(--gold) !important; }
.progress-bar .fill.complete, .progress-bar.complete .fill { background: var(--forest) !important; }

.mbs-milestone {
  display: flex; align-items: center; gap: 0.75rem;
  padding: 1rem 1.15rem;
  background: var(--ground); border: 1px solid var(--line); border-radius: var(--radius);
}
.mbs-milestone--done { border-color: var(--forest); }
.mbs-milestone__seal {
  flex: 0 0 auto; width: 34px; height: 34px; border-radius: 50%;
  display: grid; place-items: center;
  border: 1.5px solid var(--gold); color: var(--gold);
}
.mbs-milestone--done .mbs-milestone__seal { border-color: var(--forest); color: var(--forest); }

/* ============ FORMS & ASSESSMENTS ============ */
label, .mbs-label {
  font-family: var(--font-body); font-weight: 600; font-size: 0.95rem;
  color: var(--ink);
}
input[type="text"], input[type="email"], input[type="password"],
input[type="number"], input[type="search"], input[type="tel"], input[type="url"],
select, textarea, .mbs-input {
  font-family: var(--font-body); font-size: 1rem; color: var(--ink);
  background: var(--ground);
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-sm);
  padding: 0.7rem 0.85rem;
  min-height: 44px;
  width: 100%;
  transition: border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
textarea, .mbs-input textarea { min-height: 7rem; line-height: 1.6; }
input:focus, select:focus, textarea:focus {
  border-color: var(--gold);
  box-shadow: 0 0 0 3px var(--gold-faint);
  outline: none;
}
input::placeholder, textarea::placeholder { color: var(--brown-gray); opacity: 0.8; }
.mbs-help { font-size: 0.88rem; color: var(--brown-gray); margin-top: 0.3rem; }
.mbs-error { font-size: 0.9rem; color: var(--burgundy); font-weight: 600; margin-top: 0.3rem; }
:root[data-theme="dark"] .mbs-error,
:root:not([data-theme="light"]) .mbs-error { color: var(--accent-warm); }
.mbs-autosave { font-size: 0.82rem; color: var(--forest); }

/* ============ TABLES / BRIEFING DATA ============ */
.mbs-table { width: 100%; border-collapse: collapse; font-family: var(--font-body); }
.mbs-table th {
  text-align: left; font-weight: 600; font-size: 0.82rem; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--ivory); background: var(--navy);
  padding: 0.7rem 0.9rem;
}
.mbs-table td { padding: 0.7rem 0.9rem; border-bottom: 1px solid var(--line-soft); color: var(--ink-soft); }
.mbs-table tr:nth-child(even) td { background: rgba(237,225,207,0.35); }
.mbs-table__scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* ============ MBS CREST ============
   Reusable inline mark: arch + open book + light. Inherits currentColor
   so it sits in navy in the nav, gold on a seal, ivory on dark.        */
.mbs-crest { display: inline-block; vertical-align: middle; color: var(--navy); }
:root[data-theme="dark"] .mbs-crest,
:root:not([data-theme="light"]) .mbs-crest { color: var(--gold); }
.mbs-crest .accent { color: var(--gold); }         /* gold detail lines */
.mbs-crest--nav { width: 34px; height: 34px; }
.mbs-lockup { display: inline-flex; align-items: center; gap: 0.6rem; text-decoration: none; }
.mbs-lockup__name {
  font-family: var(--font-display); font-weight: 700; color: var(--ink);
  font-size: 1.05rem; line-height: 1.05; letter-spacing: 0;
}
.mbs-lockup__name small {
  display: block; font-family: var(--font-body); font-weight: 600;
  font-size: 0.62rem; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--brown-gray); margin-top: 2px;
}
.mbs-lockup:hover .mbs-lockup__name { color: var(--ink); }

/* ============ IMAGERY CONTAINERS (placeholders for production art) ============ */
.mbs-figure {
  position: relative; overflow: hidden;
  background: linear-gradient(135deg, var(--navy) 0%, #1E3049 100%);
  border: 1px solid var(--line); border-radius: var(--radius);
  color: var(--ivory);
  display: grid; place-items: center; text-align: center;
  min-height: 220px; padding: 1.5rem;
}
.mbs-figure__note {
  font-size: 0.82rem; letter-spacing: 0.04em; color: #C9BEA8; max-width: 34ch;
}
.mbs-figure__note b { color: var(--gold-soft); font-weight: 600; }

/* ============ ACCESSIBILITY: reduced motion ============ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}

/* ============ LANDING — featured enrollment CTA in oxblood ============ */
.btn-primary--feature { background: var(--burgundy) !important; border-color: var(--burgundy) !important; color: var(--ivory) !important; }
.btn-primary--feature:hover { background: var(--burgundy-hover) !important; border-color: var(--burgundy-hover) !important; }

/* ============ LESSON PAGE — advisor rendered as mentor's counsel ============
   The lesson page defines .advisor-* itself; here we add the heritage
   finish (soft gold left rule, restrained shadow) in a theme-safe way.  */
.advisor-result { border-left: 3px solid var(--gold); box-shadow: var(--shadow-sm); }
.advisor-result .advisor-badge { border: 1px solid var(--gold-rule); }

/* ============ HERO ACTION ROW ============ */
.hero-actions { display: flex; flex-wrap: wrap; gap: 0.75rem; margin: 1.35rem 0 0; }
.hero-actions .cta { font-size: 0.98rem; }

/* ============ SECTION HEADING WITH GOLD UNDERLINE ============ */
.mbs-section-title {
  font-family: var(--font-display); font-weight: 700;
  font-size: clamp(1.35rem, 2.6vw, 1.75rem); color: var(--ink);
  display: inline-block; padding-bottom: 0.35rem; margin: 0 0 1rem;
  border-bottom: 2px solid var(--gold);
}

/* ============ NAV LOCKUP SPACING IN STICKY HEADERS ============ */
header .mbs-lockup { padding: 0.15rem 0; }

/* ============ GUARDRAIL: never let the body scroll sideways ============ */
html, body { overflow-x: hidden; }

/* ============ VISIBILITY UTILITY (authoritative) ============
   The pages toggle `.hidden` / the `hidden` attribute to gate app state
   (sign-in, not-enrolled, loading). Component display rules above (e.g.
   .hero-actions{display:flex}) share specificity with the pages' own
   `.hidden{display:none}` and, loading later, would otherwise win and reveal
   gated UI early. Force hidden to always win.                            */
.hidden, [hidden] { display: none !important; }
.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;
}

/* =====================================================================
   MBS SITE CHROME — shared header/footer for new-generation MBS pages
   Injected by /assets/js/mbs-chrome.js. Legacy pages keep their inline
   chrome and are unaffected.
   ===================================================================*/

*, *::before, *::after { box-sizing: border-box; }
body.mbs-page {
  margin: 0;
  background: var(--ground);
  color: var(--ink);
  font-family: var(--font-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.mbs-skip {
  position: absolute; left: -9999px; top: 0;
  background: var(--navy); color: var(--ivory);
  padding: 0.6rem 1rem; text-decoration: none;
  z-index: 200; border-radius: 0 0 4px 0;
  font-weight: 600;
}
.mbs-skip:focus { left: 0; }

.mbs-siteheader {
  position: sticky; top: 0; z-index: 40;
  background: var(--ground);
  border-bottom: 1px solid var(--line);
  box-shadow: 0 1px 0 var(--gold-faint);
}
.mbs-siteheader__inner {
  max-width: var(--max-page);
  margin: 0 auto;
  padding: 0.9rem var(--pad-x);
  display: flex; align-items: center; justify-content: space-between; gap: 1.5rem;
}
.mbs-siteheader .mbs-lockup__name { color: var(--navy); font-size: 1.05rem; }
:root[data-theme="dark"] .mbs-siteheader .mbs-lockup__name,
:root:not([data-theme="light"]) .mbs-siteheader .mbs-lockup__name { color: var(--ink); }

.mbs-nav { display: flex; align-items: center; gap: 1.25rem; }
.mbs-nav__links {
  display: flex; align-items: center; gap: 1.15rem;
  font-family: var(--font-body); font-size: 0.9375rem; font-weight: 500;
}
.mbs-nav__links a {
  color: var(--ink-soft); text-decoration: none;
  padding: 0.35rem 0; border-bottom: 2px solid transparent;
  transition: color var(--dur) var(--ease), border-color var(--dur) var(--ease);
}
.mbs-nav__links a:hover { color: var(--navy); border-bottom-color: var(--gold-rule); }
.mbs-nav__links a[aria-current="page"] {
  color: var(--navy); border-bottom-color: var(--gold);
}
:root[data-theme="dark"] .mbs-nav__links a:hover,
:root:not([data-theme="light"]) .mbs-nav__links a:hover { color: var(--ink); }

.mbs-nav__cta { display: flex; align-items: center; gap: 0.5rem; }
.mbs-nav__cta .cta { padding: 0.55rem 1.05rem; font-size: 0.92rem; min-height: 40px; }

.mbs-nav__toggle {
  display: none;
  width: 44px; height: 44px;
  background: transparent; border: 1px solid var(--line-strong); border-radius: var(--radius-sm);
  cursor: pointer; align-items: center; justify-content: center;
}
.mbs-nav__bars, .mbs-nav__bars::before, .mbs-nav__bars::after {
  display: block; width: 22px; height: 2px; background: var(--navy); border-radius: 2px;
  content: ""; position: relative;
}
.mbs-nav__bars::before { top: -6px; }
.mbs-nav__bars::after  { top: 4px; }

.mbs-nav__drawer {
  border-top: 1px solid var(--line);
  background: var(--ground);
}
.mbs-nav__drawer-inner {
  max-width: var(--max-page); margin: 0 auto;
  padding: 0.5rem var(--pad-x) 1rem;
  display: grid; gap: 0.65rem;
}
.mbs-nav__drawer-inner a {
  padding: 0.7rem 0.25rem;
  color: var(--ink); text-decoration: none; font-weight: 500;
  border-bottom: 1px solid var(--line-soft);
}
.mbs-nav__drawer-inner .cta { justify-content: center; }

@media (max-width: 960px) {
  .mbs-nav__links, .mbs-nav__cta .mbs-nav__login { display: none; }
  .mbs-nav__toggle { display: inline-flex; }
}
body.mbs-nav-open { overflow: hidden; }

/* ---- FOOTER ---------------------------------------------------------- */
.mbs-footer {
  margin-top: clamp(3rem, 6vw, 5rem);
  background: var(--navy);
  color: #DCD3BF;
  font-family: var(--font-body);
}
.mbs-footer a { color: var(--ivory); text-decoration: none; }
.mbs-footer a:hover { color: var(--gold-soft); text-decoration: underline; text-underline-offset: 3px; }
.mbs-footer__inner {
  max-width: var(--max-page); margin: 0 auto;
  padding: clamp(2.5rem, 5vw, 4rem) var(--pad-x) 2rem;
  display: grid; gap: 2.5rem;
  grid-template-columns: minmax(240px, 1.1fr) 3fr;
}
.mbs-footer__brand .mbs-lockup__name { color: var(--ivory); }
.mbs-footer__brand .mbs-lockup__name small { color: var(--gold-soft); }
.mbs-footer__brand .mbs-crest { color: var(--gold); }
.mbs-footer__mission { margin: 1rem 0 0; max-width: 34ch; font-size: 0.95rem; }
.mbs-footer__powered { margin: 1rem 0 0; font-size: 0.85rem; color: #B8AE94; }
.mbs-footer__powered a { color: var(--gold-soft); text-decoration: underline; text-underline-offset: 3px; }

.mbs-footer__cols {
  display: grid; gap: 2rem;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.mbs-footer__cols h4 {
  font-family: var(--font-body); font-weight: 600;
  font-size: 0.78rem; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--gold-soft); margin: 0 0 0.85rem;
}
.mbs-footer__cols ul { list-style: none; padding: 0; margin: 0; }
.mbs-footer__cols li { margin-bottom: 0.5rem; font-size: 0.94rem; }

.mbs-footer__baseline {
  max-width: var(--max-page); margin: 0 auto;
  padding: 1.4rem var(--pad-x) 2rem;
  border-top: 1px solid #2A3448;
  display: grid; gap: 0.75rem;
  font-size: 0.82rem; color: #B0A78D;
}
.mbs-footer__legal { max-width: 78ch; }

@media (max-width: 900px) {
  .mbs-footer__inner { grid-template-columns: 1fr; }
  .mbs-footer__cols  { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
  .mbs-footer__cols  { grid-template-columns: 1fr; }
}

/* =====================================================================
   MBS PAGE LAYOUT — shared shells & hero pattern for new pages
   ===================================================================*/
.mbs-main { display: block; }
.mbs-container {
  max-width: var(--max-page); margin: 0 auto;
  padding: 0 var(--pad-x);
}
.mbs-container--narrow { max-width: 860px; }
.mbs-container--reading { max-width: var(--max-read); }

.mbs-section { padding: clamp(3rem, 6vw, 5rem) 0; }
.mbs-section--tight { padding: clamp(2rem, 4vw, 3.25rem) 0; }
.mbs-section--alt { background: var(--ground-alt); border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); }
.mbs-section--navy { background: var(--navy); color: var(--ivory); border: 0; }
.mbs-section--navy h1, .mbs-section--navy h2, .mbs-section--navy h3, .mbs-section--navy h4 { color: var(--ivory); }
.mbs-section--navy p, .mbs-section--navy li { color: #DCD3BF; }
.mbs-section--navy a { color: var(--gold-soft); }

.mbs-hero {
  padding: clamp(3.25rem, 8vw, 6rem) 0 clamp(2.75rem, 6vw, 4.5rem);
  border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, var(--ground) 0%, var(--ground-alt) 100%);
}
.mbs-hero__eyebrow {
  font-size: 0.72rem; font-weight: 600; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--brown-gray); margin: 0 0 1rem;
}
.mbs-hero__title {
  font-family: var(--font-display); font-weight: 700;
  font-size: clamp(2rem, 5vw, 3.4rem);
  line-height: 1.15; margin: 0 0 1.15rem; max-width: 22ch;
}
.mbs-hero__lede {
  font-size: 1.125rem; line-height: 1.65; color: var(--ink-soft);
  max-width: 62ch; margin: 0;
}
.mbs-hero__actions {
  display: flex; flex-wrap: wrap; gap: 0.75rem; margin: 1.75rem 0 0;
}

.mbs-hero--split {
  padding-top: clamp(3rem, 6vw, 4.5rem);
}
.mbs-hero__grid {
  display: grid; gap: clamp(2rem, 5vw, 3.5rem);
  grid-template-columns: 1.15fr 1fr; align-items: center;
}
@media (max-width: 900px) { .mbs-hero__grid { grid-template-columns: 1fr; } }

.mbs-hero__aside {
  padding: 1.5rem 1.75rem;
  background: var(--ground); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow-md);
}
.mbs-hero__stat { display: flex; align-items: baseline; gap: 0.5rem; }
.mbs-hero__stat b { font-family: var(--font-display); font-size: 1.85rem; color: var(--navy); }
:root[data-theme="dark"] .mbs-hero__stat b,
:root:not([data-theme="light"]) .mbs-hero__stat b { color: var(--accent); }
.mbs-hero__stat span { color: var(--brown-gray); font-size: 0.92rem; }

/* Breadcrumb ---------------------------------------------------------- */
.mbs-crumbs {
  font-size: 0.85rem; color: var(--brown-gray);
  padding: 1rem var(--pad-x);
  max-width: var(--max-page); margin: 0 auto;
}
.mbs-crumbs a { color: var(--brown-gray); text-decoration: none; border-bottom: 1px dotted var(--line-strong); }
.mbs-crumbs a:hover { color: var(--navy); }
.mbs-crumbs [aria-current="page"] { color: var(--ink); }

/* Grids --------------------------------------------------------------- */
.mbs-grid { display: grid; gap: 1.5rem; }
.mbs-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.mbs-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.mbs-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 900px) {
  .mbs-grid--3, .mbs-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  .mbs-grid--2, .mbs-grid--3, .mbs-grid--4 { grid-template-columns: 1fr; }
}

/* Feature card — an institutional tile */
.mbs-feature {
  background: var(--ground); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 1.4rem 1.5rem 1.5rem;
  box-shadow: var(--shadow-sm);
  display: flex; flex-direction: column; gap: 0.6rem;
}
.mbs-feature__seal {
  width: 40px; height: 40px; border-radius: 50%;
  display: grid; place-items: center;
  background: var(--parchment); color: var(--navy); border: 1px solid var(--gold-rule);
  font-family: var(--font-display); font-weight: 700;
}
.mbs-feature h3 { font-size: 1.15rem; margin: 0.15rem 0 0.2rem; }
.mbs-feature p  { margin: 0; color: var(--ink-soft); }
.mbs-feature__link {
  margin-top: auto; padding-top: 0.6rem;
  font-weight: 600; color: var(--accent); text-decoration: none;
  border-top: 1px dotted var(--line-strong);
}
.mbs-feature__link:hover { color: var(--accent-warm); }

/* Pillar block for four-semester teasers */
.mbs-pillar {
  border: 1px solid var(--line); border-radius: var(--radius);
  padding: 1.5rem; background: var(--ground);
  display: grid; gap: 0.75rem;
  box-shadow: var(--shadow-sm);
}
.mbs-pillar__num {
  font-family: var(--font-display); font-weight: 700;
  color: var(--gold); letter-spacing: 0.05em;
  font-size: 0.9rem; text-transform: uppercase;
}
.mbs-pillar h3 { margin: 0; font-size: 1.2rem; }
.mbs-pillar ul { margin: 0.25rem 0 0 1.1rem; padding: 0; color: var(--ink-soft); }
.mbs-pillar ul li { margin-bottom: 0.25rem; }

/* Testimonial */
.mbs-testimonial {
  background: var(--ground); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 1.75rem 1.85rem; box-shadow: var(--shadow-sm);
}
.mbs-testimonial__body {
  font-family: var(--font-display); font-style: italic;
  font-size: 1.1rem; line-height: 1.55; color: var(--ink);
}
.mbs-testimonial__attribution {
  margin-top: 1.1rem;
  display: flex; align-items: center; gap: 0.85rem;
}
.mbs-testimonial__mono {
  width: 42px; height: 42px; border-radius: 50%;
  background: var(--navy); color: var(--gold);
  display: grid; place-items: center;
  font-family: var(--font-display); font-weight: 700;
  border: 1px solid var(--gold-rule);
}
.mbs-testimonial__who {
  display: grid; gap: 0.15rem;
}
.mbs-testimonial__name { font-weight: 700; color: var(--ink); }
.mbs-testimonial__role { font-size: 0.86rem; color: var(--brown-gray); }

/* FAQ */
.mbs-faq { display: grid; gap: 0.85rem; }
.mbs-faq details {
  background: var(--ground); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 0.25rem 1.1rem;
}
.mbs-faq summary {
  padding: 0.95rem 0; cursor: pointer;
  font-family: var(--font-display); font-weight: 700; font-size: 1.05rem;
  list-style: none; display: flex; justify-content: space-between; gap: 1rem;
}
.mbs-faq summary::-webkit-details-marker { display: none; }
.mbs-faq summary::after {
  content: "+"; color: var(--gold); font-family: var(--font-body); font-weight: 700;
  font-size: 1.3rem; transition: transform var(--dur) var(--ease);
}
.mbs-faq details[open] summary::after { content: "–"; }
.mbs-faq details > p, .mbs-faq details > div {
  padding: 0 0 1rem; color: var(--ink-soft);
}

/* Highlight banner */
.mbs-banner {
  background: var(--parchment);
  border-top: 1px solid var(--gold-faint);
  border-bottom: 1px solid var(--gold-faint);
  padding: 1.25rem var(--pad-x);
  text-align: center; font-family: var(--font-display); font-style: italic;
  color: var(--ink-soft);
}

/* CTA band */
.mbs-cta-band {
  padding: clamp(3rem, 6vw, 5rem) 0;
  background: var(--navy); color: var(--ivory);
}
.mbs-cta-band__inner { max-width: 780px; margin: 0 auto; padding: 0 var(--pad-x); text-align: center; }
.mbs-cta-band h2 { color: var(--ivory); font-size: clamp(1.7rem, 3.5vw, 2.4rem); margin: 0 0 0.85rem; }
.mbs-cta-band p  { color: #DCD3BF; font-size: 1.05rem; margin: 0 0 1.5rem; }
.mbs-cta-band .cta { min-width: 180px; }
.mbs-cta-band .cta--ghost { color: var(--ivory); border-color: var(--gold-rule); background: transparent; }
.mbs-cta-band .cta--ghost:hover { background: rgba(176,138,69,0.15); color: var(--ivory); border-color: var(--gold); }

/* Comparison / matrix table */
.mbs-matrix { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.mbs-matrix table { width: 100%; border-collapse: collapse; font-family: var(--font-body); font-size: 0.98rem; }
.mbs-matrix th, .mbs-matrix td { padding: 0.85rem 1rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line-soft); }
.mbs-matrix thead th { background: var(--navy); color: var(--ivory); font-weight: 600; letter-spacing: 0.04em; font-size: 0.82rem; text-transform: uppercase; }
.mbs-matrix tbody tr:nth-child(even) td { background: rgba(237, 225, 207, 0.35); }

/* Timeline */
.mbs-timeline { display: grid; gap: 1rem; }
.mbs-timeline__item {
  display: grid; grid-template-columns: 108px 1fr; gap: 1.25rem;
  padding: 1rem 1.15rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--ground);
}
.mbs-timeline__when {
  font-family: var(--font-display); font-weight: 700; color: var(--navy);
  border-right: 2px solid var(--gold-faint); padding-right: 1rem;
}
:root[data-theme="dark"] .mbs-timeline__when,
:root:not([data-theme="light"]) .mbs-timeline__when { color: var(--accent); }
@media (max-width: 640px) {
  .mbs-timeline__item { grid-template-columns: 1fr; }
  .mbs-timeline__when { border-right: 0; border-bottom: 1px solid var(--gold-faint); padding: 0 0 0.4rem; }
}

/* Definition list — course/module */
.mbs-dl {
  display: grid; grid-template-columns: 190px 1fr; gap: 0.75rem 1.5rem;
  font-family: var(--font-body);
}
.mbs-dl dt { color: var(--brown-gray); font-weight: 600; font-size: 0.9rem; text-transform: uppercase; letter-spacing: 0.06em; }
.mbs-dl dd { margin: 0; color: var(--ink-soft); }
@media (max-width: 640px) { .mbs-dl { grid-template-columns: 1fr; gap: 0.15rem 0; } .mbs-dl dd { margin-bottom: 0.85rem; } }

/* Program card — used on Programs page */
.mbs-program {
  border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--ground); overflow: hidden;
  box-shadow: var(--shadow-sm);
  display: grid; grid-template-rows: auto 1fr auto;
}
.mbs-program__banner { background: var(--navy); color: var(--ivory); padding: 1.1rem 1.3rem; }
.mbs-program__banner small { color: var(--gold-soft); letter-spacing: 0.14em; text-transform: uppercase; font-size: 0.7rem; }
.mbs-program__banner h3 { color: var(--ivory); margin: 0.25rem 0 0; font-size: 1.25rem; }
.mbs-program__body { padding: 1.15rem 1.3rem 0.6rem; color: var(--ink-soft); }
.mbs-program__meta { display: flex; flex-wrap: wrap; gap: 0.75rem; margin: 0.6rem 0 0; font-size: 0.85rem; color: var(--brown-gray); }
.mbs-program__meta span { padding: 0.15rem 0.55rem; border: 1px solid var(--line-strong); border-radius: 999px; }
.mbs-program__foot { padding: 1rem 1.3rem 1.3rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }

/* Church-pathway header (used on /school/churches/*.html) */
.mbs-pathway-header {
  padding: clamp(3rem, 6vw, 4.5rem) 0 clamp(2rem, 4vw, 3rem);
  border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, var(--ground) 0%, var(--ground-alt) 100%);
}
.mbs-pathway-header__kicker {
  font-family: var(--font-body); font-size: 0.72rem; font-weight: 600;
  letter-spacing: 0.16em; text-transform: uppercase; color: var(--brown-gray);
}
.mbs-pathway-header h1 { font-size: clamp(1.8rem, 4vw, 2.6rem); margin: 0.75rem 0; max-width: 28ch; }
.mbs-pathway-header p  { font-size: 1.075rem; color: var(--ink-soft); max-width: 62ch; margin: 0; }

/* Icon list */
.mbs-list-check { list-style: none; padding: 0; margin: 0; display: grid; gap: 0.55rem; }
.mbs-list-check li { position: relative; padding-left: 1.65rem; color: var(--ink-soft); }
.mbs-list-check li::before {
  content: ""; position: absolute; left: 0; top: 0.5rem;
  width: 10px; height: 10px; transform: rotate(45deg);
  background: var(--gold);
}

/* Application form specifics */
.mbs-form {
  display: grid; gap: 1.15rem;
  background: var(--ground); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 1.75rem 1.85rem;
  box-shadow: var(--shadow-sm);
}
.mbs-form .mbs-field { display: grid; gap: 0.4rem; }
.mbs-form .mbs-field--row { grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 620px) { .mbs-form .mbs-field--row { grid-template-columns: 1fr; } }
.mbs-form fieldset { border: 1px dashed var(--line-strong); border-radius: var(--radius); padding: 1rem 1.1rem; }
.mbs-form legend { font-weight: 700; padding: 0 0.45rem; color: var(--navy); }
:root[data-theme="dark"] .mbs-form legend,
:root:not([data-theme="light"]) .mbs-form legend { color: var(--accent); }
.mbs-form__foot { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }

/* Two-column reading with side rail */
.mbs-read {
  display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: clamp(2rem, 4vw, 3rem);
}
.mbs-read__aside {
  align-self: start; position: sticky; top: 88px;
  border-left: 2px solid var(--gold-faint);
  padding-left: 1.15rem;
  font-size: 0.92rem;
  color: var(--brown-gray);
}
.mbs-read__aside a { display: block; padding: 0.35rem 0; color: var(--ink-soft); text-decoration: none; }
.mbs-read__aside a:hover { color: var(--navy); }
@media (max-width: 900px) {
  .mbs-read { grid-template-columns: 1fr; }
  .mbs-read__aside { position: static; border-left: 0; border-top: 1px solid var(--line); padding: 1rem 0 0; }
}

/* Rich prose */
.mbs-prose h2 { font-size: clamp(1.4rem, 2.6vw, 1.85rem); margin: 2.25rem 0 0.6rem; }
.mbs-prose h3 { font-size: clamp(1.15rem, 2vw, 1.35rem); margin: 1.75rem 0 0.5rem; }
.mbs-prose p, .mbs-prose li { font-size: 1.02rem; color: var(--ink-soft); line-height: 1.7; }
.mbs-prose p { margin: 0 0 1rem; }
.mbs-prose ul, .mbs-prose ol { padding-left: 1.2rem; margin: 0 0 1rem; }
.mbs-prose li { margin: 0.2rem 0; }
.mbs-prose blockquote {
  border-left: 3px solid var(--gold); padding: 0.6rem 0 0.6rem 1.15rem; margin: 1.5rem 0;
  font-family: var(--font-display); font-style: italic; color: var(--ink);
}

/* Assessment (Growth Assessment questionnaire) */
.mbs-assessment { display: grid; gap: 1.25rem; }
.mbs-assessment fieldset {
  border: 1px solid var(--line); border-radius: var(--radius);
  padding: 1.2rem 1.35rem; background: var(--ground);
}
.mbs-assessment legend {
  font-family: var(--font-display); font-weight: 700; padding: 0 0.45rem;
  color: var(--navy);
}
:root[data-theme="dark"] .mbs-assessment legend,
:root:not([data-theme="light"]) .mbs-assessment legend { color: var(--accent); }
.mbs-assessment__question { margin-bottom: 1rem; }
.mbs-assessment__question p { margin: 0 0 0.5rem; color: var(--ink); font-weight: 500; }
.mbs-scale { display: flex; flex-wrap: wrap; gap: 0.45rem; }
.mbs-scale label {
  padding: 0.5rem 0.75rem; border: 1px solid var(--line-strong); border-radius: var(--radius-sm);
  background: var(--ground-alt); cursor: pointer;
  font-weight: 500; font-size: 0.92rem;
}
.mbs-scale input { position: absolute; opacity: 0; }
.mbs-scale input:checked + span, .mbs-scale label:has(input:checked) { background: var(--navy); color: var(--ivory); border-color: var(--navy); }

/* Result readout used by the assessment client-side script */
.mbs-result {
  padding: 1.5rem 1.75rem;
  background: var(--parchment); border: 1px solid var(--gold-rule); border-radius: var(--radius);
}
.mbs-result h3 { margin: 0 0 0.5rem; color: var(--navy); }
:root[data-theme="dark"] .mbs-result h3,
:root:not([data-theme="light"]) .mbs-result h3 { color: var(--accent); }
.mbs-result__score { font-family: var(--font-display); font-size: 2.4rem; font-weight: 700; color: var(--navy); }
:root[data-theme="dark"] .mbs-result__score,
:root:not([data-theme="light"]) .mbs-result__score { color: var(--accent); }
.mbs-result__bar { height: 10px; border-radius: 999px; background: var(--gold-faint); overflow: hidden; margin: 0.6rem 0 1rem; }
.mbs-result__bar-fill { height: 100%; background: var(--gold); transition: width var(--dur) var(--ease); }
.mbs-result__bar-fill--good { background: var(--forest); }
.mbs-result__bar-fill--warn { background: var(--burgundy); }