/* North Star Business Method, site styles. Production build from Claude Design (May 2026). */
@import url('./tokens.css');

* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { background: var(--ns-ivory); color: var(--ns-fg-1); font-family: var(--ns-font-body); -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; border: none; background: none; color: inherit; }

/* ── Container ── */
.container { max-width: 1180px; margin: 0 auto; padding: 0 32px; }

/* ── Header ── */
.site-header { background: var(--ns-navy); color: #fff; height: 96px; display: flex; align-items: center; position: sticky; top: 0; z-index: 50; transition: box-shadow 240ms var(--ns-ease-standard), background 240ms var(--ns-ease-standard); }
.site-header.is-scrolled { box-shadow: 0 6px 24px rgba(15, 22, 42, 0.32), 0 1px 0 rgba(198, 167, 110, 0.18); }
.site-header .container { display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.site-header .container { max-width: none; padding: 0 40px; flex: 1; width: 100%; }
.site-header .logo-wrap { display: flex; align-items: center; }
.site-header .logo { height: 68px; }
.site-header nav a.members-preview { color: var(--ns-camel); }
.site-header nav a.members-preview::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--ns-camel); margin-right: 8px; vertical-align: 2px; }
.site-header nav a.members-preview:hover { color: #fff; }

.site-header nav { display: flex; gap: 28px; }
.site-header nav a { font-family: var(--ns-font-body); font-weight: 400; font-size: 13px; letter-spacing: 0.04em; color: rgba(255,255,255,0.78); transition: color 220ms var(--ns-ease-standard); position: relative; padding: 8px 2px; }
.site-header nav a::after { content: ""; position: absolute; left: 2px; right: 2px; bottom: 4px; height: 1px; background: var(--ns-camel); transform: scaleX(0); transform-origin: left center; transition: transform 260ms var(--ns-ease-standard); }
.site-header nav a:hover, .site-header nav a.active { color: var(--ns-camel); }
.site-header nav a:hover::after, .site-header nav a.active::after { transform: scaleX(1); }
.site-header .cta { background: var(--ns-camel); color: var(--ns-navy); font-weight: 700; font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; padding: 14px 22px; border-radius: var(--ns-radius-sm); transition: background 220ms var(--ns-ease-standard); white-space: nowrap; }
.site-header .cta:hover { background: var(--ns-camel-deep); }

/* Mobile menu — hamburger + drawer */
.site-header .menu-toggle { display: none; }
.site-header .mobile-menu { display: none; }
@media (max-width: 880px) {
  .site-header .container { padding: 0 24px; }
  .site-header nav { display: none; }
  .site-header .cta { display: none; }
  .site-header .menu-toggle { display: flex; flex-direction: column; justify-content: center; gap: 4px; width: 36px; height: 36px; padding: 0; background: transparent; border: 0; cursor: pointer; }
  .site-header .menu-toggle span { display: block; width: 22px; height: 1.5px; background: #fff; transition: transform 240ms var(--ns-ease-standard), opacity 200ms var(--ns-ease-standard); transform-origin: center; }
  .site-header.is-menu-open .menu-toggle span:nth-child(1) { transform: translateY(5.5px) rotate(45deg); }
  .site-header.is-menu-open .menu-toggle span:nth-child(2) { opacity: 0; }
  .site-header.is-menu-open .menu-toggle span:nth-child(3) { transform: translateY(-5.5px) rotate(-45deg); }
  .site-header .mobile-menu { display: flex; flex-direction: column; gap: 0; position: absolute; top: 100%; left: 0; right: 0; background: var(--ns-navy); padding: 16px 24px 24px; max-height: 0; overflow: hidden; transition: max-height 320ms var(--ns-ease-standard), padding 320ms var(--ns-ease-standard); border-bottom: 1px solid rgba(198, 167, 110, 0.18); }
  .site-header.is-menu-open .mobile-menu { max-height: 80vh; padding: 16px 24px 24px; }
  .site-header .mobile-menu a { font-family: var(--ns-font-display); font-weight: 400; font-size: 22px; line-height: 1.4; color: rgba(255,255,255,0.86); padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,0.08); }
  .site-header .mobile-menu a.active { color: var(--ns-camel); }
  .site-header .mobile-menu a:last-of-type { border-bottom: 0; }
  .site-header .mobile-menu .mobile-cta { display: inline-flex; align-items: center; justify-content: center; background: var(--ns-camel); color: var(--ns-navy); font-family: var(--ns-font-body); font-weight: 700; font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; padding: 16px 24px; margin-top: 12px; border-radius: var(--ns-radius-sm); border: 0; }
}

/* ── Section ── */
.section { padding: 72px 0 80px; position: relative; transition: background 420ms var(--ns-ease-standard); }
.section.tight { padding: 64px 0; }
.section.section-pad-bottom-tight { padding-bottom: 0; background: var(--ns-cream); }
.section.bg-navy { background: var(--ns-navy); color: #fff; }
.section.bg-camel { background: var(--ns-camel); color: var(--ns-navy); }
.section.bg-cream { background: var(--ns-cream); }
.section + .section.divider-top { border-top: 1px solid var(--ns-camel); }

/* Subtle section hover — cream surfaces shift one notch toward paper.
   Mouse leaves and they return. Quiet, not interactive. Applied across pages. */
.hero, .section.section-pad-bottom-tight, .section.definition, .final-cta,
.course-hero, .section.instructor, .section.bg-cream-strong,
.about-bio, .section.origin, .section.beliefs { transition: background 480ms var(--ns-ease-standard); }
.hero:hover, .section.section-pad-bottom-tight:hover, .section.definition:hover, .final-cta:hover,
.course-hero:hover, .section.instructor:hover, .section.bg-cream-strong:hover,
.about-bio:hover, .section.origin:hover, .section.beliefs:hover { background: var(--ns-paper); }

/* Navy sections shift one notch toward navy-deep on hover */
.section.problem, .section.master-model, .section.advisory { transition: background 480ms var(--ns-ease-standard); }
.section.problem:hover, .section.master-model:hover, .section.advisory:hover { background: var(--ns-navy-deep); }

/* ── Eyebrow ── */
.eyebrow { font-family: var(--ns-font-body); font-weight: 700; font-size: 12px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-camel); margin-bottom: 18px; display: inline-flex; align-items: center; gap: 10px; white-space: nowrap; }
.eyebrow-mark { width: 10px; height: 10px; flex-shrink: 0; opacity: 0.85; }
/* Center-aligned containers reset to flex too so the gap stays clean */
.values-head .eyebrow, .hero .eyebrow, .final-cta .eyebrow { justify-content: center; }

/* ── Buttons ── */
.btn { display: inline-block; font-family: var(--ns-font-body); font-weight: 700; font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; padding: 16px 28px; border: 1px solid transparent; border-radius: var(--ns-radius-sm); transition: all 220ms var(--ns-ease-standard); cursor: pointer; white-space: nowrap; }
.btn { display: inline-block; font-family: var(--ns-font-body); font-weight: 700; font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; padding: 16px 28px; border: 1px solid transparent; border-radius: var(--ns-radius-button); transition: all 220ms var(--ns-ease-standard); cursor: pointer; }
.btn-primary { background: var(--ns-camel); color: var(--ns-navy); border-color: var(--ns-camel); box-shadow: 0 1px 0 rgba(15, 22, 42, 0.06); }
.btn-primary:hover { background: var(--ns-camel-deep); border-color: var(--ns-camel-deep); transform: translateY(-2px); box-shadow: 0 12px 24px rgba(154, 122, 64, 0.32), 0 2px 0 rgba(15, 22, 42, 0.1); }
.btn-outline { background: transparent; color: var(--ns-navy); border-color: var(--ns-navy); }
.btn-outline:hover { background: var(--ns-navy); color: var(--ns-ivory); }
.btn-outline-light { background: transparent; color: #fff; border-color: rgba(255,255,255,0.6); }
.btn-outline-light:hover { background: #fff; color: var(--ns-navy); border-color: #fff; }

/* ── Hero (home) ── */
.hero { padding: 112px 0 96px; text-align: left; }
/* ── Hero (home) ── */
.hero { padding: 96px 0 96px; text-align: center; background: var(--ns-cream); transition: background 480ms var(--ns-ease-standard); }
.hero .hero-star { width: 28px; height: 28px; margin: 0 auto 24px; opacity: 0.95; display: block; }
.hero .hero-star svg { width: 100%; height: 100%; display: block; }
.hero .container { display: flex; flex-direction: column; align-items: center; max-width: 1180px; }
.hero .eyebrow { max-width: none; }
.hero h1 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(40px, 5.6vw, 68px); line-height: 1.06; letter-spacing: -0.005em; max-width: 17ch; margin: 0 0 28px; text-wrap: balance; color: var(--ns-navy); }
.hero p.lede { font-family: var(--ns-font-body); font-weight: 300; font-size: 21px; line-height: 1.55; color: var(--ns-fg-2); max-width: 56ch; margin: 0 0 40px; text-wrap: pretty; }
.hero .actions { display: flex; gap: 14px; flex-wrap: wrap; justify-content: center; }

/* ── Value props ── */
.values-head { display: block; max-width: 880px; margin: 0 auto 72px; text-align: center; }
.values-head .eyebrow { margin-bottom: 18px; }
.values-head h2.title { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(32px, 4vw, 48px); line-height: 1.12; letter-spacing: -0.003em; text-wrap: balance; }
.values-head h2 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: "opsz" 144, "SOFT" 30; font-size: clamp(32px, 4vw, 48px); line-height: 1.12; letter-spacing: -0.003em; text-wrap: balance; }
.values-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 64px; }
.value { padding: 28px 24px 36px; margin: 0 -24px; border: 1px solid transparent; transition: background 280ms var(--ns-ease-standard), border-color 280ms var(--ns-ease-standard); cursor: default; }
.value:hover { background: transparent; border-color: var(--ns-emerald); }
.value:hover .value-mark-star { transform: scale(1.08); }
.value-mark-star { transition: transform 320ms var(--ns-ease-standard); }
.value h3 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: "opsz" 144, "SOFT" 30; font-size: 24px; line-height: 1.2; margin-bottom: 14px; }
.value .num { font-family: var(--ns-font-display); font-feature-settings: "lnum","tnum"; color: var(--ns-camel); font-size: 40px; line-height: 1; margin-bottom: 18px; }
.value p { font-size: 16px; line-height: 1.65; color: var(--ns-fg-2); }
.value .rule { width: 32px; height: 1px; background: var(--ns-camel); margin: 0 0 24px; }

/* Value-card mark: small camel sparkle + numeral */
.value-mark { display: flex; align-items: center; gap: 10px; margin-bottom: 22px; }
.value-mark-star { width: 16px; height: 16px; display: block; flex-shrink: 0; transition: transform 320ms var(--ns-ease-standard); }
.value-mark-num { font-family: var(--ns-font-display); font-feature-settings: "lnum","tnum"; color: var(--ns-camel); font-size: 14px; letter-spacing: 0.18em; }

/* Star band divider — sits between sections on cream surfaces */
.star-band { display: block; margin: 0 auto; width: 100%; max-width: 420px; height: 40px; opacity: 0.85; }
.star-band svg { width: 100%; height: 100%; display: block; }
.section-divider { padding: 16px 0; display: flex; justify-content: center; background: var(--ns-cream); }
.section-divider .star-band { margin: 0; }

/* ── Final CTA ── */
.final-cta { position: relative; text-align: center; padding: 64px 0 80px; background: var(--ns-cream); overflow: hidden; }
.final-cta .container { position: relative; max-width: 720px; }
.final-cta .star-band { display: block; margin: 0 auto 32px; max-width: 320px; }
.final-cta h2 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(28px, 3.2vw, 40px); line-height: 1.14; margin: 0 auto 18px; max-width: 22ch; text-wrap: balance; color: var(--ns-navy); }
.final-cta p { font-size: 17px; line-height: 1.55; color: var(--ns-navy); opacity: 0.78; margin: 0 auto 28px; max-width: 46ch; }
.final-cta p.trust { display: none; }
.final-cta .updated-inline { display: block; margin: 40px auto 0; font-family: var(--ns-font-body); font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-fg-3); opacity: 0.7; }

/* ── Footer ── */
.site-footer { position: relative; background: var(--ns-navy-deep); color: #fff; padding: 72px 0 40px; overflow: hidden; }
.site-footer .footer-stars { position: absolute; inset: 0; pointer-events: none; opacity: 0.95; }
.site-footer .footer-stars img { width: 100%; height: 100%; object-fit: cover; }
.site-footer .container { position: relative; }
.site-footer .grid { display: grid; grid-template-columns: 1.4fr 0.85fr 1.35fr 1.1fr; gap: 56px; margin-bottom: 56px; }
.site-footer .col h4 { font-family: var(--ns-font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-camel); margin-bottom: 18px; }
.site-footer .col a { display: block; padding: 6px 0; font-size: 14px; color: rgba(255,255,255,0.72); transition: color 220ms; }
.site-footer .col a:hover { color: #fff; }
.site-footer .col p { font-size: 14px; color: rgba(255,255,255,0.56); line-height: 1.6; max-width: 32ch; }
.site-footer .col-brand { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 28px; }
.site-footer .col-brand p.footer-tagline { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: "opsz" 144, "SOFT" 30; font-size: 18px; line-height: 1.45; color: rgba(255,255,255,0.82); margin: 0; text-align: center; }
.site-footer .col-brand p.footer-tagline span { display: block; white-space: nowrap; }
.site-footer .socials { display: flex; gap: 12px; margin-top: 16px; }
.site-footer .socials a { display: inline-flex; width: 36px; height: 36px; padding: 0; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,0.18); border-radius: 999px; color: rgba(255,255,255,0.72); transition: all 220ms var(--ns-ease-standard); }
.site-footer .socials a:hover { color: var(--ns-camel); border-color: var(--ns-camel); transform: translateY(-1px); }
.site-footer .legal { padding-top: 32px; border-top: 1px solid rgba(255,255,255,0.08); font-size: 12px; color: rgba(255,255,255,0.45); display: flex; justify-content: center; align-items: center; text-align: center; }

/* ── Course sales: hero, cream + centered ── */
.course-hero { background: var(--ns-cream); color: var(--ns-navy); position: relative; padding: 96px 0 96px; overflow: hidden; }
.course-hero .container { position: relative; max-width: 1180px; display: flex; flex-direction: column; align-items: center; text-align: center; }
.course-hero h1 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(38px, 4.4vw, 58px); line-height: 1.1; letter-spacing: -0.005em; max-width: 22ch; margin: 0 0 32px; text-wrap: balance; color: var(--ns-navy); }
.course-hero .hero-prose { max-width: 56ch; margin: 0 auto 32px; }
.course-hero p { font-size: 17px; line-height: 1.7; color: var(--ns-fg-2); margin: 0 0 16px; }
.course-hero p.fills { font-family: var(--ns-font-display); font-style: italic; font-weight: 400; font-size: 19px; color: var(--ns-emerald); margin-top: 8px; }
.course-hero .price { font-family: var(--ns-font-display); font-feature-settings: "lnum","tnum"; font-size: 56px; color: var(--ns-camel-deep); line-height: 1; margin: 8px auto 28px; }
.course-hero .price small { font-family: var(--ns-font-body); font-size: 12px; font-weight: 700; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-fg-3); margin-left: 14px; vertical-align: middle; }
.course-hero .actions { display: flex; gap: 14px; flex-wrap: wrap; justify-content: center; margin: 0; }

/* ── Deliverables ── */
.deliverables { display: grid; grid-template-columns: 1fr 1fr; gap: 56px 80px; }
.deliverable .num { font-family: var(--ns-font-display); font-feature-settings: "lnum","tnum"; font-size: 80px; line-height: 1; color: var(--ns-camel); margin-bottom: 14px; letter-spacing: -0.02em; }
.deliverable h3 { font-family: var(--ns-font-display); font-weight: 400; font-size: 26px; line-height: 1.2; margin-bottom: 12px; }
.deliverable p { font-size: 16px; line-height: 1.65; color: var(--ns-fg-2); }

/* ── Modules list ── */
.modules { border-top: 1px solid var(--ns-bone); }
.module-row { display: grid; grid-template-columns: 64px 1fr auto; gap: 24px; padding: 28px 0; border-bottom: 1px solid var(--ns-bone); align-items: baseline; }
.module-row .num { font-family: var(--ns-font-display); font-feature-settings: "lnum","tnum"; color: var(--ns-camel); font-size: 18px; }
.module-row h4 { font-family: var(--ns-font-display); font-weight: 400; font-size: 22px; line-height: 1.25; }
.module-row .week { font-size: 12px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ns-fg-3); }

/* ── Pricing ── */
.pricing-card { background: #fff; border: 1px solid var(--ns-border); border-radius: var(--ns-radius-lg); padding: 56px; max-width: 560px; margin: 0 auto; box-shadow: var(--ns-shadow-3); }
.pricing-card .label { font-size: 11px; font-weight: 700; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-camel); margin-bottom: 18px; }
.pricing-card .amount { font-family: var(--ns-font-display); font-feature-settings: "lnum","tnum"; font-size: 88px; line-height: 1; letter-spacing: -0.02em; color: var(--ns-navy); margin-bottom: 32px; }
.pricing-card ul { list-style: none; margin-bottom: 36px; }
.pricing-card li { padding: 12px 0; border-bottom: 1px solid var(--ns-bone); font-size: 15px; color: var(--ns-fg-1); display: flex; gap: 14px; align-items: baseline; }
.pricing-card li:last-child { border-bottom: none; }
.pricing-card .check { color: var(--ns-emerald); font-size: 14px; flex-shrink: 0; line-height: 1.4; }
.pricing-card .btn { width: 100%; text-align: center; }

/* ── Mali Bio ── */
.bio { display: grid; grid-template-columns: 5fr 7fr; gap: 80px; align-items: start; }
.bio .portrait { aspect-ratio: 4/5; background: var(--ns-paper); border: 1px solid var(--ns-border); position: relative; overflow: hidden; }
.bio .portrait img { width: 100%; height: 100%; object-fit: cover; display: block; filter: grayscale(1); }
.bio .portrait .placeholder { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: var(--ns-fg-3); font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; font-weight: 700; }
.bio h2 { font-family: var(--ns-font-display); font-weight: 400; font-size: 48px; line-height: 1.1; margin-bottom: 24px; text-wrap: balance; }
.bio .lede { font-size: 21px; line-height: 1.5; color: var(--ns-fg-2); font-weight: 300; margin-bottom: 28px; }
.bio p { font-size: 17px; line-height: 1.7; color: var(--ns-fg-1); margin-bottom: 18px; }
.bio dl { margin-top: 36px; padding-top: 28px; border-top: 1px solid var(--ns-camel); display: grid; grid-template-columns: 140px 1fr; gap: 14px 24px; }
.bio dt { font-size: 11px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ns-fg-3); padding-top: 4px; }
.bio dd { font-size: 16px; line-height: 1.55; }

/* ── Contact form ── */
.contact-form { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.contact-form .full { grid-column: 1 / -1; }
.contact-form label { display: block; font-size: 11px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ns-fg-2); margin-bottom: 8px; }
.contact-form input, .contact-form textarea, .contact-form select {
  width: 100%; font-family: var(--ns-font-body); font-size: 15px; color: var(--ns-fg-1);
  background: #fff; border: 1px solid var(--ns-border); border-radius: var(--ns-radius-sm);
  padding: 14px 16px; transition: border-color 220ms var(--ns-ease-standard);
}
.contact-form input:focus, .contact-form textarea:focus, .contact-form select:focus { outline: none; border-color: var(--ns-camel); }
.contact-form textarea { resize: vertical; min-height: 140px; }

/* ─────────────────────────────────────────────────────────
   May 2026 additions — new sections for updated screens
   ───────────────────────────────────────────────────────── */

/* Hero credentials strip (Home) */
.hero .credentials { position: relative; max-width: 56ch; margin: 56px auto 0; padding: 24px 0 0; text-align: center; }
.hero .credentials::before { content: ""; display: block; width: 56px; height: 1px; background: var(--ns-camel); margin: 0 auto 24px; }
.hero .credentials p { font-family: var(--ns-font-display); font-style: italic; font-weight: 400; font-size: 15px; line-height: 1.55; color: var(--ns-fg-2); text-wrap: pretty; }

/* Definition block (Home) — cream surface, centered, no hairline frame.
   Star band dividers (rendered in JSX) provide the visual break between sections. */
.section.definition { background: var(--ns-cream); padding: 72px 0; position: relative; }
.definition .container { max-width: 820px; text-align: center; position: relative; }
.definition .body { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: "opsz" 144, "SOFT" 50; font-size: clamp(22px, 2.4vw, 28px); line-height: 1.5; color: var(--ns-fg-1); text-wrap: pretty; max-width: 56ch; margin: 0 auto; }
.definition .body em.tool { font-style: italic; color: var(--ns-emerald); font-weight: 500; }
.definition .body em { font-style: italic; color: var(--ns-camel-deep); font-weight: 500; }

/* Problem section (Sales) — navy editorial block, centered. Tight rhythm: head, missing-grid, then prose, then closer. */
.section.problem { background: var(--ns-navy); color: #fff; padding: 72px 0 80px; }
.problem .container { max-width: 1180px; text-align: center; }
.problem .values-head { text-align: center; max-width: 880px; margin: 0 auto 56px; }
.problem .values-head .eyebrow { justify-content: center; color: var(--ns-camel); }
.problem .values-head h2 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(32px, 3.8vw, 44px); line-height: 1.14; text-wrap: balance; color: #fff; max-width: 24ch; margin: 0 auto; }

.problem-layout { display: block; max-width: 880px; margin: 0 auto; text-align: center; }

/* missing-grid sits first, immediately after the headline */
.problem-missing { margin-top: 0; margin-bottom: 56px; }
.problem-missing h3 { font-family: var(--ns-font-display); font-weight: 400; font-style: italic; color: var(--ns-cream); font-size: 19px; line-height: 1.3; margin: 0 0 24px; text-align: center; }
.missing-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: rgba(198,167,110,0.24); border: 1px solid rgba(198,167,110,0.24); max-width: 880px; margin: 0 auto; text-align: left; }
.missing-grid .item { background: var(--ns-navy); padding: 22px 22px 24px; }
.missing-grid .item-mark { font-family: var(--ns-font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ns-camel); margin-bottom: 12px; }
.missing-grid .item p { font-size: 14px; line-height: 1.65; color: rgba(255,255,255,0.82); margin: 0; }

/* Prose follows the grid */
.problem-prose { max-width: 56ch; margin: 0 auto 28px; }
.problem-prose p { font-size: 16px; line-height: 1.75; color: rgba(255,255,255,0.78); margin-bottom: 16px; }

/* Closing italic line sits last */
.problem-closing { font-family: var(--ns-font-display); font-style: italic; font-weight: 400; font-size: clamp(19px, 1.9vw, 22px); line-height: 1.5; color: var(--ns-camel); max-width: 48ch; margin: 8px auto 0; text-wrap: pretty; }

/* Legacy .problem-list rules used elsewhere stay defined below; the Problem section
   now uses .missing-grid above. The old .problem-list selectors are no longer
   referenced from Sales JSX but remain harmless. */
.problem-list { display: grid; gap: 0; border-top: 1px solid var(--ns-bone); }
.problem-list .item { padding: 28px 0; border-bottom: 1px solid var(--ns-bone); display: grid; grid-template-columns: 32px 1fr; gap: 24px; align-items: baseline; }
.problem-list .item .mark { font-family: var(--ns-font-display); font-feature-settings: "lnum","tnum"; color: var(--ns-camel); font-size: 14px; letter-spacing: 0.08em; padding-top: 4px; }
.problem-list .item p { font-family: var(--ns-font-body); font-size: 18px; line-height: 1.6; color: var(--ns-fg-1); }
.problem .closing { font-family: var(--ns-font-display); font-weight: 400; font-style: italic; font-variation-settings: "opsz" 144, "SOFT" 100; font-size: clamp(22px, 2.4vw, 26px); line-height: 1.45; color: var(--ns-navy); margin-top: 56px; max-width: 36ch; text-wrap: balance; }

/* Solution section (Sales) — three-column with vertical hairlines */
.solution-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 48px; padding-top: 8px; }
.solution-grid .col { padding: 0 0 0 28px; border-left: 1px solid var(--ns-camel); }
.solution-grid .col h3 { font-family: var(--ns-font-display); font-weight: 400; font-size: 22px; line-height: 1.25; margin-bottom: 16px; color: var(--ns-navy); }
.solution-grid .col p { font-size: 16px; line-height: 1.65; color: var(--ns-fg-2); }

/* Master Model section (Sales) — navy block with tab visualization */
.section.master-model { background: var(--ns-navy); color: #fff; padding: 120px 0; position: relative; overflow: hidden; }
.master-model .container { display: grid; grid-template-columns: 5fr 7fr; gap: 80px; align-items: start; position: relative; }
.master-model .copy .eyebrow { color: var(--ns-camel); }
.master-model .copy h2 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: "opsz" 144, "SOFT" 30; font-size: clamp(34px, 4vw, 48px); line-height: 1.14; color: #fff; margin-bottom: 28px; text-wrap: balance; }
.master-model .copy p { font-size: 17px; line-height: 1.7; color: rgba(255,255,255,0.78); margin-bottom: 18px; max-width: 42ch; }
.master-model .copy .yellow-cell-note { display: inline-flex; align-items: baseline; gap: 12px; margin-top: 28px; padding: 14px 18px; border: 1px solid rgba(255,255,255,0.16); border-radius: var(--ns-radius-sm); font-size: 13px; line-height: 1.55; color: rgba(255,255,255,0.78); max-width: 38ch; }
.master-model .copy .yellow-cell-note::before { content: ""; display: inline-block; width: 10px; height: 10px; background: #E9C46A; flex-shrink: 0; transform: translateY(2px); }

.tab-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: rgba(198,167,110,0.18); border: 1px solid rgba(198,167,110,0.18); }
.tab-grid .tab { background: var(--ns-navy); padding: 18px 16px; min-height: 96px; display: flex; flex-direction: column; gap: 6px; }
.tab-grid .tab .n { font-family: var(--ns-font-display); font-feature-settings: "lnum","tnum"; color: var(--ns-camel); font-size: 13px; letter-spacing: 0.08em; }
.tab-grid .tab .name { font-family: var(--ns-font-body); font-weight: 500; font-size: 13px; line-height: 1.3; color: rgba(255,255,255,0.86); }

/* Curriculum rows expanded with paragraph description */
.module-row.expanded { display: grid; grid-template-columns: 64px 1fr auto; gap: 24px 32px; padding: 36px 0; align-items: baseline; }
.module-row.expanded .num { padding-top: 4px; }
.module-row.expanded .body { grid-column: 2 / 3; }
.module-row.expanded .body h4 { margin-bottom: 8px; }
.module-row.expanded .body p { font-size: 15px; line-height: 1.65; color: var(--ns-fg-2); max-width: 58ch; }
.module-row.expanded .week { padding-top: 8px; }

/* Instructor section embedded on Sales */
.section.instructor { background: var(--ns-paper); padding: 120px 0; }
.instructor .bio dl { display: none; }
.instructor .credentials-list { margin-top: 36px; padding-top: 28px; border-top: 1px solid var(--ns-camel); display: grid; grid-template-columns: 1fr 1fr; gap: 18px 32px; }
.instructor .credentials-list dt { font-size: 11px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ns-fg-3); margin-bottom: 4px; }
.instructor .credentials-list dd { font-size: 14px; line-height: 1.4; color: var(--ns-fg-1); }
.instructor .learn-more { display: inline-block; margin-top: 36px; font-size: 12px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ns-camel-deep); border-bottom: 1px solid var(--ns-camel); padding-bottom: 4px; }
.instructor .learn-more:hover { color: var(--ns-camel); border-color: var(--ns-camel); }

/* Is This Right For Me — two-column for/not-for */
.fit-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; padding-top: 8px; }
.fit-cols .col h3 { font-family: var(--ns-font-display); font-weight: 400; font-size: 28px; line-height: 1.2; margin-bottom: 28px; color: var(--ns-navy); text-wrap: balance; }
.fit-cols .col.not h3 { color: var(--ns-rust); }
.fit-cols ul { list-style: none; }
.fit-cols li { padding: 16px 0 16px 32px; border-bottom: 1px solid var(--ns-bone); font-size: 16px; line-height: 1.5; color: var(--ns-fg-1); position: relative; }
.fit-cols li:last-child { border-bottom: none; }
.fit-cols li::before { content: ""; position: absolute; left: 0; top: 22px; width: 16px; height: 1px; background: var(--ns-emerald); }
.fit-cols .col.not li::before { background: var(--ns-rust); }

/* Pricing card expanded with comparison */
.pricing-card .comparison { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--ns-bone); display: grid; grid-template-columns: 1fr auto; gap: 8px 16px; font-size: 13px; line-height: 1.4; }
.pricing-card .comparison dt { color: var(--ns-fg-2); }
.pricing-card .comparison dd { color: var(--ns-fg-1); font-family: var(--ns-font-display); font-feature-settings: "lnum","tnum"; font-weight: 500; text-align: right; }
.pricing-card .comparison .featured { color: var(--ns-navy); font-weight: 700; }
.pricing-card .comparison .featured-amount { color: var(--ns-camel-deep); font-weight: 700; font-size: 15px; }
.pricing-card .footnote { margin-top: 18px; font-size: 12px; line-height: 1.5; color: var(--ns-fg-3); font-style: italic; }

/* FAQ section */
.faq-list { max-width: 860px; margin: 0 auto; border-top: 1px solid var(--ns-camel); }
.faq-item { border-bottom: 1px solid var(--ns-bone); }
.faq-item summary { cursor: pointer; padding: 28px 56px 28px 0; font-family: var(--ns-font-display); font-weight: 400; font-size: 22px; line-height: 1.3; color: var(--ns-navy); list-style: none; position: relative; text-wrap: balance; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: "+"; position: absolute; right: 4px; top: 50%; transform: translateY(-50%); font-family: var(--ns-font-display); font-weight: 300; font-size: 28px; color: var(--ns-camel); transition: transform 220ms var(--ns-ease-standard); line-height: 1; }
.faq-item[open] summary::after { content: "−"; }
/* ─────────────────────────────────────────────────────────
   Sales page additions (May 2026)
   ───────────────────────────────────────────────────────── */

/* Course hero gets actions row and brand-consistent treatment */
.course-hero { padding: 96px 0 104px; }
.course-hero .container { max-width: 1180px; }
.course-hero .actions { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 8px; }
.course-hero h1 { margin-bottom: 32px; max-width: 22ch; }
.course-hero p { font-size: 18px; line-height: 1.65; margin-bottom: 20px; max-width: 56ch; }

/* Slightly stronger cream surface for sections that need an extra notch
   of separation from the cream-everywhere baseline (Four Deliverables, Pricing). */
.section.bg-cream-strong { background: var(--ns-paper); }

/* Problem section prose follows the duo-head (legacy rule, scoped out) */
.problem-list .item p strong { font-weight: 500; color: var(--ns-navy); }

/* Solution section prose */
.solution-prose { max-width: 64ch; margin: 0 auto; }
.solution-prose p { font-size: 17px; line-height: 1.75; color: var(--ns-fg-1); margin-bottom: 20px; }
.solution-prose .kicker-line { font-family: var(--ns-font-display); font-style: italic; font-size: clamp(18px, 1.8vw, 22px); line-height: 1.5; color: var(--ns-camel-deep); margin-top: 36px; padding-top: 32px; border-top: 1px solid var(--ns-camel); max-width: 48ch; }

/* Master Model — 5/7 two-column. Copy left, 4×4 tab grid right, top-aligned with first paragraph. */
.section.master-model { padding: 80px 0 96px; }
.master-model .container { display: grid; grid-template-columns: 5fr 7fr; gap: 64px; align-items: end; max-width: 1180px; }
.master-model .copy { max-width: none; margin: 0; text-align: left; }
.master-model .copy .eyebrow { justify-content: flex-start; }
.master-model .copy h2 { color: #fff; font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(30px, 3.4vw, 42px); line-height: 1.14; text-wrap: balance; max-width: 18ch; margin: 0 0 24px; }
.master-model .copy p { color: rgba(255,255,255,0.78); font-size: 16px; line-height: 1.7; margin: 0 0 18px; max-width: 42ch; }
.master-model .copy p:last-child { margin-bottom: 0; }
.master-model .copy .yellow-cell-note { display: none !important; }

.tab-grid-wrap { width: 100%; padding-top: 0; }
.tab-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: rgba(198,167,110,0.24); border: 1px solid rgba(198,167,110,0.24); }
.tab-grid .tab { background: var(--ns-navy); padding: 18px 14px; min-height: 92px; display: flex; flex-direction: column; gap: 6px; }
.tab-grid .tab .n { font-family: var(--ns-font-body); font-weight: 700; font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ns-camel); }
.tab-grid .tab .name { font-family: var(--ns-font-display); font-style: italic; font-weight: 400; font-size: 14px; line-height: 1.3; color: rgba(255,255,255,0.9); }

/* Curriculum module-row description (Sales page) */
.modules { border-top: 1px solid var(--ns-camel); }
.module-row.expanded { border-bottom: 1px solid var(--ns-bone); padding: 32px 0; }
.module-row.expanded h4 { color: var(--ns-navy); font-size: 24px; }

/* Section-divider on navy (between Master Model and Curriculum) */
.section-divider.on-navy { background: var(--ns-navy); padding: 16px 0; }
.section-divider.on-navy .star-band svg { color: rgba(198,167,110,0.75); }

/* Instructor section: simpler bio layout, centered headline + grid bio */
.section.instructor { background: var(--ns-cream); padding: 96px 0 112px; }
.section.instructor .bio { margin-top: 8px; }
.section.instructor .bio .portrait img { filter: grayscale(0.2) contrast(1.02); }
.section.instructor .bio .lede,
.section.instructor .bio p { font-family: var(--ns-font-body); font-weight: 400; font-size: 17px; line-height: 1.7; color: var(--ns-fg-1); margin-bottom: 20px; }
.section.instructor .bio .lede { color: var(--ns-fg-1); }
.section.instructor .bio .learn-more { display: inline-block; margin-top: 8px; font-family: var(--ns-font-body); font-size: 11px; font-weight: 700; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-emerald); border-bottom: 1px solid var(--ns-emerald); padding-bottom: 4px; }
.section.instructor .bio .learn-more:hover { color: var(--ns-camel-deep); border-color: var(--ns-camel-deep); }

/* Fit columns: stronger visual contrast between "for you" and "not for you" */
.fit-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; padding-top: 8px; }
.fit-cols .col { padding: 32px; background: var(--ns-cream); border: 1px solid var(--ns-bone); transition: border-color 280ms var(--ns-ease-standard); }
.fit-cols .col:hover { border-color: var(--ns-emerald); }
.fit-cols .col.not:hover { border-color: var(--ns-rust); }
.fit-cols .col h3 { font-family: var(--ns-font-display); font-style: italic; font-weight: 400; color: var(--ns-emerald); font-size: 22px; line-height: 1.3; margin-bottom: 24px; padding-bottom: 16px; border-bottom: 1px solid var(--ns-camel); }
.fit-cols .col.not h3 { color: var(--ns-rust); }
.fit-cols ul { list-style: none; padding: 0; margin: 0; }
.fit-cols li { padding: 16px 0; border-bottom: 1px solid var(--ns-bone); font-size: 15px; line-height: 1.6; color: var(--ns-fg-1); }
.fit-cols li:last-child { border-bottom: none; }
.fit-cols li strong { font-weight: 600; color: var(--ns-navy); display: block; margin-bottom: 4px; }

/* Pricing — match the rest, lede line above the list */
.pricing-card { background: var(--ns-ivory); padding: 48px; text-align: center; }
.pricing-card .pricing-lede { font-family: var(--ns-font-display); font-style: italic; font-size: 17px; line-height: 1.5; color: var(--ns-camel-deep); margin: 0 0 24px; text-align: center; }
.pricing-card .label { color: var(--ns-camel-deep); margin-bottom: 12px; }
.pricing-card .amount { font-size: 72px; margin-bottom: 24px; }
.pricing-card ul { text-align: left; }
.pricing-card li { padding: 10px 0; font-size: 14px; line-height: 1.55; }
.pricing-card .check { color: var(--ns-emerald); }
.pricing-card .footnote { margin: 18px auto 0; font-size: 13px; line-height: 1.55; color: var(--ns-fg-2); font-style: italic; max-width: 44ch; text-align: center; }

.pricing-card .comparison { margin: 24px 0 0; padding: 20px 16px; background: var(--ns-cream); border-radius: var(--ns-radius-sm); display: grid; grid-template-columns: 1fr auto; gap: 10px 16px; font-size: 13px; }
.pricing-card .comparison dt { color: var(--ns-fg-2); margin: 0; }
.pricing-card .comparison dd { color: var(--ns-fg-1); font-family: var(--ns-font-display); font-feature-settings: "lnum","tnum"; font-weight: 400; text-align: right; margin: 0; }
.pricing-card .comparison dt.featured,
.pricing-card .comparison dd.featured-amount { color: var(--ns-emerald); font-weight: 700; border-top: 1px solid var(--ns-camel); padding-top: 12px; margin-top: 4px; }
.pricing-card .comparison dd.featured-amount { font-size: 15px; }
.pricing-card .footnote { margin-top: 18px; font-size: 13px; line-height: 1.55; color: var(--ns-fg-2); font-style: italic; max-width: 44ch; }

/* FAQ list scoped to Sales section */
.faq-list { max-width: 860px; margin: 0 auto; border-top: 1px solid var(--ns-camel); }
.faq-item summary:hover { color: var(--ns-emerald); }

/* ─────────────────────────────────────────────────────────
   About page (May 2026)
   ───────────────────────────────────────────────────────── */

/* About hero — cream, centered, no big eyebrow ornament */
.about-hero { padding: 96px 0 88px; }
.about-hero .container { display: block; max-width: 880px; text-align: center; }
.about-hero h1 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(38px, 5vw, 64px); line-height: 1.06; letter-spacing: -0.005em; max-width: 22ch; margin: 16px auto 0; color: var(--ns-navy); text-wrap: balance; }

/* About bio (replaces the legacy .bio rules on this page) */
.about-bio { background: var(--ns-cream); padding: 80px 0 96px; }
.about-bio .container { max-width: 1100px; }
.about-bio .bio { display: grid; grid-template-columns: 5fr 7fr; gap: 64px; align-items: start; }
.about-bio .bio .portrait { aspect-ratio: 4/5; background: var(--ns-paper); border: 1px solid var(--ns-border-soft); overflow: hidden; position: relative; }
.about-bio .bio .portrait img { width: 100%; height: 100%; object-fit: cover; display: block; filter: grayscale(0.15) contrast(1.02); }
.about-bio .bio-prose p { font-family: var(--ns-font-body); font-weight: 400; font-size: 17px; line-height: 1.75; color: var(--ns-fg-1); margin-bottom: 20px; }
.about-bio .bio-prose p:first-child { margin-bottom: 24px; }
.about-bio .bio-prose a { color: var(--ns-camel-deep); border-bottom: 1px solid var(--ns-camel); padding-bottom: 1px; }
.about-bio .bio-prose a:hover { color: var(--ns-emerald); border-color: var(--ns-emerald); }
.about-bio .bio-prose p.ms-sig { font-family: var(--ns-font-display); font-style: italic; font-weight: 400; font-size: 26px; color: var(--ns-emerald); margin-top: 16px; margin-bottom: 0; }

/* Origin section — 5/7 split, head left, body right */
.section.origin { background: var(--ns-cream); padding: 80px 0 96px; }
.section.origin .container { max-width: 1100px; }
.section.origin .grid { display: grid; grid-template-columns: 5fr 7fr; gap: 64px; align-items: start; }
.section.origin .head .eyebrow { justify-content: flex-start; }
.section.origin .head h2 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(30px, 3.4vw, 42px); line-height: 1.14; color: var(--ns-navy); max-width: 18ch; margin: 16px 0 0; text-wrap: balance; }
.section.origin .body p { font-family: var(--ns-font-body); font-size: 17px; line-height: 1.75; color: var(--ns-fg-1); margin-bottom: 20px; max-width: 56ch; }

/* Beliefs — 2×2 grid */
.section.beliefs { background: var(--ns-cream); padding: 80px 0 96px; }
.section.beliefs .container { max-width: 1100px; }
.section.beliefs .values-head h2.title { font-size: clamp(30px, 3.6vw, 44px); max-width: 24ch; margin: 16px auto 0; }
.beliefs-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 56px 64px; padding-top: 8px; }
.belief { padding: 28px 24px 32px; margin: 0 -24px; border: 1px solid transparent; transition: background 280ms var(--ns-ease-standard), border-color 280ms var(--ns-ease-standard); }
.belief:hover { border-color: var(--ns-emerald); }
.belief .value-mark { margin-bottom: 22px; }
.belief h3 { font-family: var(--ns-font-display); font-weight: 400; font-size: clamp(20px, 2vw, 24px); line-height: 1.25; color: var(--ns-navy); margin-bottom: 14px; text-wrap: balance; max-width: 22ch; }
.belief p { font-family: var(--ns-font-body); font-weight: 400; font-size: 16px; line-height: 1.7; color: var(--ns-fg-2); margin: 0; }

/* Advisory — navy block, 5/7 split */
.section.advisory { background: var(--ns-navy); color: #fff; padding: 80px 0 96px; }
.section.advisory .container { display: grid; grid-template-columns: 5fr 7fr; gap: 64px; align-items: start; max-width: 1100px; }
.section.advisory .head .eyebrow { justify-content: flex-start; color: var(--ns-camel); }
.section.advisory .head h2 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(28px, 3.2vw, 40px); line-height: 1.14; color: #fff; max-width: 20ch; margin: 16px 0 0; text-wrap: balance; }
.section.advisory .body { max-width: 56ch; }
.section.advisory .body p { font-family: var(--ns-font-body); font-size: 16px; line-height: 1.75; color: rgba(255,255,255,0.78); margin-bottom: 20px; }
.section.advisory .body a { color: var(--ns-camel); border-bottom: 1px solid var(--ns-camel); padding-bottom: 1px; }
.section.advisory .body a:hover { color: var(--ns-cream); border-color: var(--ns-cream); }
.section.advisory .tiers { margin-top: 32px; display: grid; grid-template-columns: 1fr; gap: 1px; background: rgba(198,167,110,0.24); border: 1px solid rgba(198,167,110,0.24); }
.section.advisory .tier { background: var(--ns-navy); padding: 18px 22px; display: grid; grid-template-columns: 1fr auto; gap: 16px; align-items: baseline; }
.section.advisory .tier .label { font-family: var(--ns-font-body); font-size: 15px; line-height: 1.4; color: rgba(255,255,255,0.92); }
.section.advisory .tier .price { font-family: var(--ns-font-display); font-feature-settings: "lnum","tnum"; color: var(--ns-camel); font-size: 15px; font-weight: 400; }

/* Mobile rules */
@media (max-width: 880px) {
  .about-bio .bio,
  .section.origin .grid,
  .section.advisory .container,
  .beliefs-grid { grid-template-columns: 1fr !important; gap: 32px !important; }
}

/* ─────────────────────────────────────────────────────────
   Contact page (May 2026)
   ───────────────────────────────────────────────────────── */

.contact-hero { padding: 96px 0 72px; }
.contact-hero .container { display: block; max-width: 720px; text-align: center; }
.contact-hero h1 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(48px, 6vw, 80px); line-height: 1.04; margin: 12px auto 0; color: var(--ns-navy); }

.section.contact-main { background: var(--ns-cream); padding: 72px 0 96px; }
.section.contact-main .container { max-width: 1100px; }
.contact-grid { display: grid; grid-template-columns: 5fr 7fr; gap: 80px; align-items: start; }
.contact-prose p { font-family: var(--ns-font-body); font-weight: 400; font-size: 17px; line-height: 1.75; color: var(--ns-fg-1); margin-bottom: 20px; max-width: 38ch; }
.contact-prose a { color: var(--ns-camel-deep); border-bottom: 1px solid var(--ns-camel); padding-bottom: 1px; }
.contact-prose a:hover { color: var(--ns-emerald); border-color: var(--ns-emerald); }

.section.contact-main .contact-form input,
.section.contact-main .contact-form textarea,
.section.contact-main .contact-form select { background: var(--ns-ivory); }

.section.contact-aside-section { background: var(--ns-cream); padding: 64px 0 88px; }
.section.contact-aside-section .container { max-width: 1100px; }
.contact-aside { margin: 0; padding: 0; border: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 56px; }
.contact-aside .col { padding: 28px 24px 32px; border: 1px solid transparent; transition: border-color 280ms var(--ns-ease-standard); }
.contact-aside .col:hover { border-color: var(--ns-emerald); }
.contact-aside .col h4 { font-family: var(--ns-font-display); font-weight: 400; font-style: italic; color: var(--ns-emerald); font-size: 20px; line-height: 1.3; margin-bottom: 14px; padding-bottom: 12px; border-bottom: 1px solid var(--ns-camel); }
.contact-aside .col p { font-family: var(--ns-font-body); font-size: 15px; line-height: 1.7; color: var(--ns-fg-1); }
.contact-aside .col a { color: var(--ns-camel-deep); border-bottom: 1px solid var(--ns-camel); padding-bottom: 1px; }
.contact-aside .col a:hover { color: var(--ns-emerald); border-color: var(--ns-emerald); }

.section.contact-aside-section .updated-inline { display: block; margin: 56px auto 0; text-align: center; font-family: var(--ns-font-body); font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-fg-3); }

@media (max-width: 880px) {
  .contact-grid, .contact-aside { grid-template-columns: 1fr !important; gap: 32px !important; }
}

/* ─────────────────────────────────────────────────────────
   Method page (May 2026)
   ───────────────────────────────────────────────────────── */

.method-hero { padding: 96px 0 72px; }
.method-hero .container { display: block; max-width: 880px; text-align: center; }
.method-hero h1 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(44px, 5.6vw, 72px); line-height: 1.04; margin: 12px auto 24px; color: var(--ns-navy); }
.method-hero p.lede { font-family: var(--ns-font-body); font-weight: 300; font-size: 20px; line-height: 1.55; color: var(--ns-fg-2); max-width: 56ch; margin: 0 auto; text-align: center; }

.section.method-intro { background: var(--ns-cream); padding: 64px 0 80px; }
.section.method-intro .container { max-width: 720px; }
.section.method-intro .intro-prose p { font-family: var(--ns-font-body); font-size: 18px; line-height: 1.8; color: var(--ns-fg-1); margin-bottom: 20px; }

.section.method-modules-section { background: var(--ns-cream); padding: 72px 0 96px; }
.section.method-modules-section .container { max-width: 1180px; }
.method-layout { display: grid; grid-template-columns: 280px 1fr; gap: 72px; align-items: start; }

.method-nav { position: sticky; top: 120px; align-self: start; }
.method-nav-inner { padding: 0; }
.method-nav-label { font-family: var(--ns-font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-camel); margin-bottom: 18px; padding-bottom: 16px; border-bottom: 1px solid var(--ns-camel); }
.method-nav ol { list-style: none; padding: 0; margin: 0; }
.method-nav li { border-bottom: 1px solid var(--ns-bone); }
.method-nav li:last-child { border-bottom: 0; }
.method-nav li a { display: grid; grid-template-columns: 28px 1fr; gap: 12px; padding: 12px 0; align-items: baseline; color: var(--ns-fg-2); transition: color 220ms var(--ns-ease-standard); }
.method-nav li a:hover { color: var(--ns-navy); }
.method-nav li.active a { color: var(--ns-emerald); }
.method-nav li.active a .n { color: var(--ns-emerald); }
.method-nav .n { font-family: var(--ns-font-display); font-style: italic; font-feature-settings: "lnum","tnum"; font-size: 13px; color: var(--ns-camel); }
.method-nav .t { font-family: var(--ns-font-display); font-weight: 400; font-size: 14px; line-height: 1.35; text-wrap: balance; }

.method-modules { display: block; }
.method-module { padding: 0 0 36px; margin-bottom: 36px; border-bottom: 1px solid var(--ns-bone); scroll-margin-top: 100px; }
.method-module:last-child { border-bottom: 0; margin-bottom: 0; padding-bottom: 16px; }
.method-module .m-num { font-family: var(--ns-font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-camel); margin-bottom: 14px; }
.method-module h2 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(28px, 3.2vw, 38px); line-height: 1.12; color: var(--ns-navy); margin-bottom: 24px; text-wrap: balance; }
.method-module .in-this-module { font-family: var(--ns-font-display); font-style: italic; font-size: 17px; color: var(--ns-camel-deep); margin-bottom: 16px; }
.method-module ul { list-style: none; padding: 0; margin: 0; }
.method-module li { font-family: var(--ns-font-body); font-size: 16px; line-height: 1.7; color: var(--ns-fg-1); padding: 14px 0 14px 32px; position: relative; border-bottom: 1px solid var(--ns-bone); }
.method-module li:last-child { border-bottom: 0; }
.method-module li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 18px;
  width: 18px;
  height: 18px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-12 -12 24 24'%3E%3Cg fill='%23C6A76E'%3E%3Cpath d='M 0 -10 L 0.72 0 L 0 10 L -0.72 0 Z'/%3E%3Cpath d='M -6.1 0 L 0 0.5 L 6.1 0 L 0 -0.5 Z'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

@media (max-width: 880px) {
  .method-layout { grid-template-columns: 1fr; gap: 32px; }
  .method-nav { position: static; }
  .method-nav-inner { padding: 16px; background: var(--ns-paper); }
}

/* ─────────────────────────────────────────────────────────
   Glossary index (May 2026)
   ───────────────────────────────────────────────────────── */

.glossary-hero { padding: 96px 0 72px; }
.glossary-hero .container { display: block; max-width: 820px; text-align: center; }
.glossary-hero h1 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(48px, 6vw, 80px); line-height: 1.04; margin: 12px auto 24px; color: var(--ns-navy); }
.glossary-hero p.lede { font-family: var(--ns-font-body); font-weight: 300; font-size: 19px; line-height: 1.6; color: var(--ns-fg-2); max-width: 56ch; margin: 0 auto; text-align: center; }

.section.glossary-index { background: var(--ns-cream); padding: 72px 0 96px; }
.section.glossary-index .container { max-width: 1100px; }
.glossary-letters { display: grid; grid-template-columns: 1fr; gap: 0; }
.letter-group { display: grid; grid-template-columns: 80px 1fr; gap: 32px; align-items: start; padding: 28px 0; border-bottom: 1px solid var(--ns-camel); }
.letter-group:last-child { border-bottom: 0; }
.letter-group .letter { font-family: var(--ns-font-display); font-weight: 400; font-style: italic; font-size: clamp(40px, 4.4vw, 56px); line-height: 1; color: var(--ns-camel); letter-spacing: -0.01em; }
.letter-group ul { list-style: none; padding: 0; margin: 0; }
.letter-group li { border-bottom: 1px solid var(--ns-bone); }
.letter-group li:last-child { border-bottom: 0; }
.letter-group li a { display: block; padding: 16px 4px; color: var(--ns-navy); transition: color 220ms var(--ns-ease-standard), padding 220ms var(--ns-ease-standard); }
.letter-group li a:hover { color: var(--ns-emerald); padding-left: 12px; }
.letter-group .t { font-family: var(--ns-font-display); font-weight: 400; font-size: clamp(20px, 2vw, 24px); line-height: 1.25; }

@media (max-width: 640px) {
  .letter-group { grid-template-columns: 56px 1fr; gap: 20px; }
  .letter-group .letter { font-size: 36px; }
}

.method-hero, .section.method-intro, .section.method-modules-section { transition: background 480ms var(--ns-ease-standard); }
.method-hero:hover, .section.method-intro:hover, .section.method-modules-section:hover { background: var(--ns-paper); }

/* ─────────────────────────────────────────────────────────
   Insights index (May 2026)
   ───────────────────────────────────────────────────────── */

.insights-hero { padding: 96px 0 72px; }
.insights-hero .container { display: block; max-width: 880px; text-align: center; }
.insights-hero h1 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(40px, 5vw, 64px); line-height: 1.06; margin: 12px auto 24px; color: var(--ns-navy); text-wrap: balance; max-width: 22ch; }
.insights-hero p.lede { font-family: var(--ns-font-display); font-style: italic; font-weight: 400; font-size: 19px; color: var(--ns-camel-deep); margin: 0 auto; text-align: center; }

.section.insights-index { background: var(--ns-cream); padding: 56px 0 96px; }
.section.insights-index .container { max-width: 1100px; }
.insights-list { display: grid; grid-template-columns: 1fr; gap: 0; }
.insight-card { display: grid; grid-template-columns: 1fr; gap: 14px; padding: 36px 0 40px; border-bottom: 1px solid var(--ns-camel); color: var(--ns-navy); transition: padding 280ms var(--ns-ease-standard); }
.insight-card:hover { padding-left: 12px; }
.insight-card:last-child { border-bottom: 0; }

.insight-meta { display: flex; align-items: center; gap: 14px; }
.insight-meta .kind { font-family: var(--ns-font-body); font-weight: 700; font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; padding: 4px 10px; border: 1px solid currentColor; }
.insight-meta .kind.reference { color: var(--ns-camel-deep); }
.insight-meta .kind.essay { color: var(--ns-emerald); }
.insight-meta .date { font-family: var(--ns-font-display); font-style: italic; font-feature-settings: "lnum","tnum"; font-size: 14px; color: var(--ns-fg-3); }

.insight-title { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(24px, 2.8vw, 32px); line-height: 1.16; color: var(--ns-navy); margin: 0; text-wrap: balance; transition: color 280ms var(--ns-ease-standard); }
.insight-card:hover .insight-title { color: var(--ns-emerald); }
.insight-excerpt { font-family: var(--ns-font-body); font-size: 16px; line-height: 1.7; color: var(--ns-fg-2); margin: 0; max-width: 72ch; }
.insight-read { font-family: var(--ns-font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-camel-deep); transition: color 280ms var(--ns-ease-standard); margin-top: 8px; }
.insight-card:hover .insight-read { color: var(--ns-emerald); }

/* ─────────────────────────────────────────────────────────
   Insight article template (May 2026)
   ───────────────────────────────────────────────────────── */

.insights-hero, .section.insights-index { transition: background 480ms var(--ns-ease-standard); }
.insights-hero:hover, .section.insights-index:hover { background: var(--ns-paper); }

.insight-article-hero { padding: 72px 0 64px; background: var(--ns-cream); }
.insight-article-hero .container { display: block; max-width: 760px; text-align: left; margin: 0 auto; }
.insight-article-hero .breadcrumb { margin-bottom: 28px; }
.insight-article-hero .article-meta { display: flex; align-items: center; gap: 12px; margin-bottom: 28px; }
.insight-article-hero .article-meta .kind { font-family: var(--ns-font-body); font-weight: 700; font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; padding: 4px 10px; border: 1px solid currentColor; }
.insight-article-hero .article-meta .kind.essay { color: var(--ns-emerald); }
.insight-article-hero .article-meta .kind.reference { color: var(--ns-camel-deep); }
.insight-article-hero .article-meta .dot { color: var(--ns-camel); }
.insight-article-hero .article-meta .date,
.insight-article-hero .article-meta .read-time { font-family: var(--ns-font-display); font-style: italic; font-size: 14px; color: var(--ns-fg-3); }
.insight-article-hero h1 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(40px, 5.2vw, 64px); line-height: 1.04; margin: 0; color: var(--ns-navy); text-wrap: balance; max-width: 22ch; }

.section.insight-article-body { background: var(--ns-cream); padding: 56px 0 80px; }
.section.insight-article-body .container { max-width: 720px; }
.article-prose { display: block; }
.article-intro { margin-bottom: 24px; }
.article-intro p:first-child { font-family: var(--ns-font-display); font-weight: 400; font-size: clamp(20px, 2.2vw, 24px); line-height: 1.5; color: var(--ns-fg-1); margin-bottom: 24px; text-wrap: pretty; }
.article-intro p { font-family: var(--ns-font-body); font-size: 17px; line-height: 1.8; color: var(--ns-fg-1); margin-bottom: 18px; }

.article-section { padding: 24px 0; }
.article-section h2 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(24px, 2.6vw, 32px); line-height: 1.16; color: var(--ns-navy); margin-bottom: 18px; text-wrap: balance; }
.article-section p { font-family: var(--ns-font-body); font-size: 17px; line-height: 1.8; color: var(--ns-fg-1); margin: 0 0 18px; }
.article-section p strong { font-weight: 600; color: var(--ns-navy); }
.article-section p:last-child { margin-bottom: 0; }

.pullquote { margin: 32px 0; padding: 24px 32px; border-left: 2px solid var(--ns-camel); background: transparent; }
.pullquote p { font-family: var(--ns-font-display); font-style: italic; font-weight: 400; font-size: clamp(22px, 2.6vw, 28px); line-height: 1.4; color: var(--ns-emerald); margin: 0; text-wrap: pretty; }

.section.insight-related { background: var(--ns-paper); padding: 72px 0 88px; }
.section.insight-related .container { max-width: 1100px; }
.insight-related .related-head { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(28px, 3vw, 36px); line-height: 1.14; color: var(--ns-navy); margin: 16px 0 40px; text-wrap: balance; }
.insight-related .related-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.insight-related .related-card { display: flex; flex-direction: column; gap: 8px; padding: 24px; background: var(--ns-cream); border: 1px solid var(--ns-bone); transition: border-color 280ms var(--ns-ease-standard), transform 280ms var(--ns-ease-standard); }
.insight-related .related-card:hover { border-color: var(--ns-emerald); transform: translateY(-2px); }
.insight-related .related-card.module { background: var(--ns-paper); border-color: var(--ns-camel); }
.insight-related .related-card .kind { font-family: var(--ns-font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-camel); }
.insight-related .related-card .t { font-family: var(--ns-font-display); font-weight: 400; font-size: 20px; line-height: 1.3; color: var(--ns-navy); }
.insight-related .related-card:hover .t { color: var(--ns-emerald); }

/* ─────────────────────────────────────────────────────────
   Members Area: Start Here (May 2026)
   ───────────────────────────────────────────────────────── */

.insight-article-hero, .section.insight-article-body, .section.insight-related { transition: background 480ms var(--ns-ease-standard); }
.insight-article-hero:hover, .section.insight-article-body:hover { background: var(--ns-paper); }
   Visual register matches the partial members kit: navy header chrome,
   paper background, editorial reader column, right rail with progress
   and quick reference.
   ───────────────────────────────────────────────────────── */

.members-shell { background: var(--ns-paper); color: var(--ns-fg-1); min-height: 100vh; }
/* Member pages keep the public site-header but suppress the public footer for an
   app-like reader experience. The .members-header below is a slim cream subheader
   that stacks under the public navy header (Option A subheader treatment). */
.members-shell + .site-footer { display: none; }

.members-header { background: var(--ns-paper); color: var(--ns-navy); position: sticky; top: 96px; z-index: 49; border-bottom: 1px solid var(--ns-camel); }
@media (max-width: 880px) {
  .members-header { top: 72px; }
}

/* Sign-out form sits in the cream subheader. Navy text, emerald hover, no chrome. */
.mh-signout { font-family: var(--ns-font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-fg-2); padding: 8px 2px; border: 0; background: transparent; cursor: pointer; transition: color 220ms var(--ns-ease-standard); }
.mh-signout:hover { color: var(--ns-emerald); }
.mh-inner { max-width: none; padding: 0 40px; height: 68px; display: flex; align-items: center; gap: 16px; }
.mh-spacer { flex: 1; }
.mh-meta { font-family: var(--ns-font-body); font-size: 12px; font-weight: 700; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-camel); white-space: nowrap; }
.mh-avatar { width: 36px; height: 36px; border-radius: 50%; background: var(--ns-camel); color: var(--ns-navy); display: flex; align-items: center; justify-content: center; font-family: var(--ns-font-display); font-size: 13px; font-weight: 500; letter-spacing: 0.04em; }

.members-page { display: grid; grid-template-columns: 1fr 320px; min-height: calc(100vh - 164px); }
.members-reader { padding: 56px 64px 80px; max-width: 760px; width: 100%; margin: 0 auto; }

.members-head { margin-bottom: 48px; padding-bottom: 32px; border-bottom: 1px solid var(--ns-bone); }
.ms-crumb { font-family: var(--ns-font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-camel); margin-bottom: 18px; }
.members-head h1 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(48px, 6vw, 72px); line-height: 1.04; letter-spacing: -0.008em; color: var(--ns-navy); margin-bottom: 14px; }
.ms-subhead { font-family: var(--ns-font-display); font-style: italic; font-size: clamp(20px, 2.2vw, 24px); line-height: 1.45; color: var(--ns-fg-2); margin: 0; }

.ms-section { padding: 40px 0; border-top: 1px solid var(--ns-bone); }
.ms-section:first-of-type { border-top: 0; padding-top: 0; }
.ms-eyebrow { font-family: var(--ns-font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-camel); margin-bottom: 20px; }
.ms-prose p { font-family: var(--ns-font-body); font-size: 17px; line-height: 1.8; color: var(--ns-fg-1); margin: 0 0 18px; max-width: 60ch; }
.ms-prose p:last-child { margin-bottom: 0; }
.ms-prose a { color: var(--ns-camel-deep); border-bottom: 1px solid var(--ns-camel); padding-bottom: 1px; }
.ms-prose a:hover { color: var(--ns-emerald); border-color: var(--ns-emerald); }
.ms-sig,
.ms-prose p.ms-sig { font-family: var(--ns-font-display); font-style: italic; font-weight: 400; font-size: 26px; line-height: 1; color: var(--ns-emerald); margin-top: 16px !important; }
.ms-prose-after { font-family: var(--ns-font-body); font-size: 17px; line-height: 1.8; color: var(--ns-fg-1); margin: 28px 0 0; max-width: 60ch; font-style: italic; color: var(--ns-camel-deep); }
.ms-section-lede { font-family: var(--ns-font-body); font-weight: 400; font-size: 17px; line-height: 1.7; color: var(--ns-fg-2); margin: 0 0 24px; max-width: 56ch; }

/* Numbering system: Members area uses Nº 01 style throughout for consistency.
   This replaces the star+number ValueMark used on Home/About marketing surfaces.
   The marketing pages keep their star marks; member surfaces use the editorial
   Nº prefix to read as a learning rail rather than a brand mark. */
.ms-deliverables { list-style: none; padding: 0; margin: 24px 0 0; display: grid; grid-template-columns: 1fr; gap: 0; }
.ms-deliverables li { display: grid; grid-template-columns: 56px 1fr; gap: 16px; padding: 18px 0; border-top: 1px solid var(--ns-bone); align-items: baseline; }
.ms-deliverables li:first-child { border-top: 1px solid var(--ns-camel); }
.ms-deliverables .ms-d-mark { font-family: var(--ns-font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-camel); }
.ms-deliverables li > span:last-child { font-family: var(--ns-font-display); font-weight: 400; font-size: 19px; line-height: 1.4; color: var(--ns-navy); }

.ms-readylist { list-style: none; padding: 0; margin: 24px 0 24px; display: grid; gap: 0; }
.ms-readylist li { display: grid; grid-template-columns: 56px 1fr; gap: 16px; padding: 18px 0; border-top: 1px solid var(--ns-bone); align-items: baseline; }
.ms-readylist li:first-child { border-top: 1px solid var(--ns-camel); }
.ms-readylist .ms-r-mark { font-family: var(--ns-font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-camel); }
.ms-readylist .ms-r-mark::before { content: ""; }
.ms-readylist li > span:last-child { font-family: var(--ns-font-body); font-size: 16px; line-height: 1.7; color: var(--ns-fg-1); }

.ms-fineprint { font-family: var(--ns-font-body); font-style: italic; font-size: 14px; line-height: 1.6; color: var(--ns-fg-2); margin: 16px 0 0; max-width: 60ch; }
.ms-fineprint a { color: var(--ns-camel-deep); border-bottom: 1px solid var(--ns-camel); padding-bottom: 1px; }

/* Master Model open-in-sheets card */
.ms-model-cta { display: grid; grid-template-columns: 40px 1fr auto; gap: 18px; align-items: center; padding: 20px 22px; background: var(--ns-navy); color: #fff; border-radius: var(--ns-radius-md); margin: 28px 0 16px; box-shadow: var(--ns-shadow-2); }
.ms-mc-mark { width: 40px; height: 40px; border-radius: 6px; background: rgba(255,255,255,0.08); display: flex; align-items: center; justify-content: center; }
.ms-mc-eyebrow { font-family: var(--ns-font-body); font-weight: 700; font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-camel); margin-bottom: 4px; }
.ms-mc-name { font-family: var(--ns-font-display); font-size: 19px; line-height: 1.2; color: #fff; margin-bottom: 2px; }
.ms-mc-meta { font-family: var(--ns-font-body); font-size: 12px; color: rgba(255,255,255,0.6); }

/* Yellow-cells callout */
.ms-callout.yellow-cells { display: grid; grid-template-columns: 8px 1fr; gap: 24px; margin: 24px 0 8px; padding: 24px 28px; background: var(--ns-ivory); border-radius: var(--ns-radius-md); border: 1px solid var(--ns-bone); }
.ms-callout.yellow-cells .ms-callout-mark { background: #E9C46A; border-radius: 2px; }
.ms-callout-eyebrow { font-family: var(--ns-font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-camel-deep); margin-bottom: 12px; }
.ms-callout-body p { font-family: var(--ns-font-body); font-size: 16px; line-height: 1.7; color: var(--ns-fg-1); margin: 0; max-width: 60ch; }
.ms-callout-body p strong { font-weight: 600; color: var(--ns-navy); }

/* Final section */
.ms-final { margin-top: 48px; padding: 40px 0 8px; border-top: 1px solid var(--ns-camel); }
.ms-final h2 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(32px, 4vw, 48px); line-height: 1.08; color: var(--ns-navy); margin-bottom: 18px; }
.ms-final p { font-family: var(--ns-font-body); font-size: 17px; line-height: 1.7; color: var(--ns-fg-1); max-width: 60ch; margin-bottom: 32px; }
.ms-begin { display: inline-flex; align-items: center; gap: 12px; }

/* Right rail - sticky so it stays visible as the user scrolls the reader */
.members-rail { padding: 56px 32px 56px; border-left: 1px solid var(--ns-bone); background: var(--ns-cream); position: sticky; top: 170px; align-self: start; max-height: calc(100vh - 170px); overflow-y: auto; }
.ms-rail-card { background: var(--ns-ivory); border: 1px solid var(--ns-bone); border-radius: var(--ns-radius-md); padding: 24px; margin-bottom: 20px; }
.ms-rail-card h3 { font-family: var(--ns-font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-camel); margin: 0 0 18px; }

.ms-rail-card.progress { display: flex; flex-direction: column; align-items: center; gap: 0; }
.ms-rail-card.progress h3 { align-self: flex-start; }
.ms-progress-ring { width: 116px; height: 116px; position: relative; margin: 8px 0 12px; }
.ms-progress-ring svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.ms-progress-num { font-family: var(--ns-font-display); font-feature-settings: "lnum","tnum"; font-size: 34px; line-height: 1; color: var(--ns-navy); position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }
.ms-progress-num small { font-size: 14px; color: var(--ns-fg-3); margin-left: 2px; }
.ms-progress-label { font-family: var(--ns-font-body); font-weight: 700; font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-fg-2); margin-bottom: 8px; }

.ms-roadmap { list-style: none; padding: 0; margin: 0; }
.ms-roadmap li { display: grid; grid-template-columns: 28px 1fr; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--ns-bone); align-items: baseline; cursor: default; }
.ms-roadmap li:last-child { border-bottom: 0; }
.ms-roadmap .n { font-family: var(--ns-font-display); font-feature-settings: "lnum","tnum"; font-size: 12px; color: var(--ns-camel); }
.ms-roadmap .t { font-family: var(--ns-font-body); font-size: 13px; line-height: 1.4; color: var(--ns-fg-2); }
.ms-roadmap li.active { padding-left: 6px; margin-left: -6px; border-left: 2px solid var(--ns-emerald); }
.ms-roadmap li.active .n { color: var(--ns-emerald); }
.ms-roadmap li.active .t { color: var(--ns-navy); font-weight: 500; }

/* Roadmap entries on module pages are wrapped in <a> for navigation. The link
   uses display:contents so the li's grid layout still positions the spans, and
   the underlying anchor stays semantically clickable. */
.ms-roadmap li > a { display: contents; color: inherit; text-decoration: none; }
.ms-roadmap li:has(> a) .n,
.ms-roadmap li:has(> a) .t { cursor: pointer; }

/* Completed-module state in the roadmap: camel check next to the number. */
.ms-roadmap li.done .n { color: var(--ns-camel-deep); }
.ms-roadmap li.done .n::after { content: " ✓"; font-family: var(--ns-font-body); font-weight: 700; font-size: 10px; color: var(--ns-emerald); margin-left: 2px; }
.ms-roadmap li.done .t { color: var(--ns-fg-2); }

.ms-rail-card.help p { font-family: var(--ns-font-body); font-size: 13px; line-height: 1.6; color: var(--ns-fg-2); margin: 0 0 14px; }
.ms-rail-card.help .ms-rail-link { letter-spacing: 0.12em; font-size: 10px; border-bottom: 0; padding-bottom: 0; }
.ms-rail-card.help .ms-rail-link:hover { border-bottom: 0; }
.ms-rail-link { display: inline-block; font-family: var(--ns-font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ns-camel-deep); border-bottom: 1px solid var(--ns-camel); padding-bottom: 3px; word-break: break-all; max-width: 100%; }
.ms-rail-link:hover { color: var(--ns-emerald); border-color: var(--ns-emerald); }

/* Login Screen */
.login-shell { min-height: 100vh; background: var(--ns-ivory); display: grid; grid-template-columns: 1fr 1fr; }
.login-art { background: var(--ns-navy); color: #fff; position: relative; padding: 64px; display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; }
.login-art-stars { position: absolute; inset: 0; opacity: 0.42; pointer-events: none; }
.login-art-stars img { width: 100%; height: 100%; object-fit: cover; }
.login-art-top, .login-art-bottom { position: relative; z-index: 1; }
.login-art-top { font-family: var(--ns-font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-camel); }
.login-art-bottom h2 { font-family: var(--ns-font-display); font-weight: 400; font-size: clamp(32px, 3.6vw, 46px); line-height: 1.06; max-width: 14ch; margin-bottom: 18px; text-wrap: balance; color: #fff; }
.login-art-bottom p { font-family: var(--ns-font-body); font-size: 16px; line-height: 1.55; color: rgba(255,255,255,0.72); max-width: 38ch; }
.login-form-wrap { display: flex; align-items: center; justify-content: center; padding: 48px; background: var(--ns-ivory); }
.login-card { width: 100%; max-width: 420px; }
.login-logo { display: block; margin-bottom: 48px; }
.login-card h1 { font-family: var(--ns-font-display); font-weight: 400; font-size: 36px; line-height: 1.1; margin-bottom: 8px; color: var(--ns-navy); text-wrap: balance; }
.login-card .lede { font-family: var(--ns-font-body); font-size: 15px; color: var(--ns-fg-2); margin-bottom: 36px; }
.login-card .field { margin-bottom: 18px; }
.login-card .field label { display: block; font-family: var(--ns-font-body); font-size: 11px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ns-fg-2); margin-bottom: 8px; }
.login-card .field input { width: 100%; padding: 14px 16px; border: 1px solid var(--ns-border); border-radius: var(--ns-radius-sm); font-family: var(--ns-font-body); font-size: 15px; background: #fff; transition: border-color 220ms; }
.login-card .field input:focus { outline: none; border-color: var(--ns-camel); }
.login-card .btn-primary { display: block; width: 100%; text-align: center; background: var(--ns-navy); color: #fff; border: 1px solid var(--ns-navy); padding: 14px 24px; font-family: var(--ns-font-body); font-weight: 700; font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; border-radius: var(--ns-radius-sm); transition: background 220ms; }
.login-card .btn-primary:hover { background: var(--ns-navy-deep); }
.login-meta { display: flex; justify-content: space-between; align-items: center; margin-top: 24px; font-family: var(--ns-font-body); font-size: 13px; color: var(--ns-fg-2); flex-wrap: wrap; gap: 8px; }
.login-meta a { color: var(--ns-camel-deep); border-bottom: 1px solid var(--ns-camel); padding-bottom: 1px; }
.login-meta a:hover { color: var(--ns-emerald); border-color: var(--ns-emerald); }
@media (max-width: 760px) { .login-shell { grid-template-columns: 1fr; } .login-art { display: none; } }

/* Members area buttons — ensure icons align vertically when used alongside text */
.members-shell .btn { display: inline-flex; align-items: center; gap: 10px; }
.members-shell .btn svg { display: block; flex-shrink: 0; }

/* Camel button used inside members area */
.members-shell .btn-camel { background: var(--ns-camel); color: var(--ns-navy); border-color: var(--ns-camel); }
.members-shell .btn-camel:hover { background: var(--ns-camel-deep); border-color: var(--ns-camel-deep); transform: translateY(-1px); }

/* Section hover dim — cream surface members section blocks shift one notch
   toward paper on hover. Matches marketing surface treatment. */
.ms-section { transition: background 480ms var(--ns-ease-standard); padding-left: 24px; padding-right: 24px; margin-left: -24px; margin-right: -24px; border-radius: 2px; }
.ms-section:hover { background: var(--ns-paper); }

/* Emerald hairline hover on right rail cards */
.ms-rail-card { transition: border-color 280ms var(--ns-ease-standard), transform 280ms var(--ns-ease-standard); }
.ms-rail-card:hover { border-color: var(--ns-emerald); transform: translateY(-1px); }

/* Roadmap items shift to emerald on hover */
.ms-roadmap li { transition: padding 220ms var(--ns-ease-standard), border-color 220ms var(--ns-ease-standard); }
.ms-roadmap li:not(.active):hover { padding-left: 6px; border-left: 2px solid var(--ns-camel); margin-left: -6px; }
.ms-roadmap li:not(.active):hover .t { color: var(--ns-navy); }

/* Master Model CTA gets a soft lift on hover */
.ms-model-cta { transition: transform 280ms var(--ns-ease-standard), box-shadow 280ms var(--ns-ease-standard); }
.ms-model-cta:hover { transform: translateY(-2px); box-shadow: var(--ns-shadow-3); }

/* Final CTA section also gets the hover dim, matching marketing final-cta */
.ms-final { transition: background 480ms var(--ns-ease-standard); padding-left: 24px; padding-right: 24px; margin-left: -24px; margin-right: -24px; }
.ms-final:hover { background: var(--ns-paper); }

/* Yellow-cell callout gets emerald hairline on hover */
.ms-callout.yellow-cells { transition: border-color 280ms var(--ns-ease-standard); }
.ms-callout.yellow-cells:hover { border-color: var(--ns-emerald); }

@media (max-width: 1100px) {
  .members-page { grid-template-columns: 1fr; }
  .members-rail { border-left: 0; border-top: 1px solid var(--ns-bone); }
  .members-reader { padding: 40px 32px 64px; max-width: none; }
}

/* ─────────────────────────────────────────────────────────
   Module Page (Member, May 2026)
   ───────────────────────────────────────────────────────── */

/* Module reader fills the entire 1fr cell. Stepper and inner blocks share a single
   40px-from-cell-left / 40px-from-cell-right alignment so "Overview" lines up with
   "The Owner's Financial Playbook" in the members-header above. */
.mm-reader { padding: 48px 0 80px; max-width: none; margin: 0; width: 100%; }
.mm-reader > .mm-head,
.mm-reader > .mm-phase { margin-left: 80px; margin-right: 80px; padding-left: 0; padding-right: 0; max-width: none; }
.mm-head { margin-bottom: 40px; padding-bottom: 32px; border-bottom: 1px solid var(--ns-bone); }
.mm-crumb { font-family: var(--ns-font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-fg-3); margin-bottom: 22px; }
.mm-crumb a { color: var(--ns-camel-deep); border-bottom: 1px solid var(--ns-camel); padding-bottom: 1px; }
.mm-crumb a:hover { color: var(--ns-emerald); border-color: var(--ns-emerald); }
.mm-crumb .sep { margin: 0 12px; color: var(--ns-camel); }
.mm-head h1 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(40px, 5.6vw, 64px); line-height: 1.04; letter-spacing: -0.008em; color: var(--ns-navy); margin: 0; }

.mm-section { padding: 36px 24px; border-top: 1px solid var(--ns-bone); transition: background 480ms var(--ns-ease-standard); margin: 0; }
.mm-section:hover { background: var(--ns-paper); }
.mm-section:first-of-type { border-top: 0; padding-top: 16px; }
.mm-eyebrow { font-family: var(--ns-font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-camel); margin-bottom: 20px; }
.mm-lead { font-family: var(--ns-font-body); font-weight: 400; font-size: 18px; line-height: 1.75; color: var(--ns-fg-1); margin: 0; }

/* What you will learn list */
.mm-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 0; }
.mm-list li { display: grid; grid-template-columns: 56px 1fr; gap: 16px; padding: 12px 0; align-items: baseline; }
.mm-list .mm-list-mark { font-family: var(--ns-font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-camel); }
.mm-list li > span:last-child { font-family: var(--ns-font-body); font-size: 16px; line-height: 1.65; color: var(--ns-fg-1); }
.mm-list-your-turn li.named-step > span:last-child strong { font-weight: 600; color: var(--ns-navy); display: block; margin-bottom: 4px; }

/* Deliverable card */
.mm-deliverable { padding: 28px 32px; background: var(--ns-navy); color: #fff; border-radius: var(--ns-radius-md); box-shadow: var(--ns-shadow-2); }
.mm-deliverable p { font-family: var(--ns-font-display); font-weight: 400; font-size: clamp(18px, 1.8vw, 21px); line-height: 1.5; color: rgba(255,255,255,0.94); margin: 0; }

/* Teaching content */
.mm-teaching h2 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(28px, 3.4vw, 38px); line-height: 1.1; color: var(--ns-navy); margin: 0 0 24px; text-wrap: balance; }
.mm-prose p { font-family: var(--ns-font-body); font-size: 17px; line-height: 1.8; color: var(--ns-fg-1); margin: 0 0 18px; }
.mm-prose .mm-h3 { font-family: var(--ns-font-display); font-weight: 400; font-size: 22px; line-height: 1.2; color: var(--ns-navy); margin: 28px 0 14px; }

/* Financial table — used in modules with numeric content (Module 3 P&L, etc) */
.mm-table { margin: 24px 0 28px; padding: 0; }
.mm-table figcaption { font-family: var(--ns-font-display); font-style: italic; font-size: 15px; color: var(--ns-camel-deep); margin-bottom: 12px; }
.mm-table table { width: 100%; border-collapse: collapse; background: var(--ns-ivory); border: 1px solid var(--ns-bone); }
.mm-table td { padding: 12px 22px; font-family: var(--ns-font-body); font-size: 16px; line-height: 1.4; color: var(--ns-fg-1); border-bottom: 1px solid var(--ns-bone); }
.mm-table tr:last-child td { border-bottom: 0; }
.mm-table td:last-child { text-align: right; font-family: var(--ns-font-display); font-feature-settings: "lnum","tnum"; font-weight: 400; color: var(--ns-navy); white-space: nowrap; }
.mm-table tr.is-neg td:last-child { color: var(--ns-rust); }
.mm-table tr.is-total td { font-weight: 500; color: var(--ns-navy); border-top: 1px solid var(--ns-camel); background: var(--ns-paper); }
.mm-table tr.is-total td:last-child { color: var(--ns-emerald); }
.mm-table tr.is-final td { font-weight: 700; }
.mm-table tr.is-header td { font-family: var(--ns-font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-camel); padding-top: 18px; padding-bottom: 10px; border-bottom: 1px solid var(--ns-camel); background: var(--ns-paper); }
.mm-table tr.is-subhead td { font-family: var(--ns-font-display); font-style: italic; font-size: 14px; color: var(--ns-fg-2); padding-top: 14px; padding-bottom: 8px; }
.mm-table tr.is-balance td { background: var(--ns-paper); border-top: 2px solid var(--ns-camel); padding-top: 16px; }
.mm-table tr.is-balance td:last-child { color: var(--ns-emerald); font-weight: 700; }

/* 3-column variant: Item / Baseline / Adjusted */
.mm-table-3 table { table-layout: fixed; }
.mm-table-3 thead th { font-family: var(--ns-font-body); font-weight: 700; font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-camel); padding: 14px 22px; text-align: left; border-bottom: 1px solid var(--ns-camel); background: var(--ns-paper); }
.mm-table-3 thead th:nth-child(2),
.mm-table-3 thead th:nth-child(3) { text-align: right; }
.mm-table-3 td:nth-child(2),
.mm-table-3 td:nth-child(3) { text-align: right; font-family: var(--ns-font-display); font-feature-settings: "lnum","tnum"; font-weight: 400; color: var(--ns-navy); white-space: nowrap; }
.mm-table-3 td:first-child { font-family: var(--ns-font-body); color: var(--ns-fg-1); }
.mm-table-3 tr.is-neg td:nth-child(2),
.mm-table-3 tr.is-neg td:nth-child(3) { color: var(--ns-rust); }
.mm-table-3 tr.is-total td { font-weight: 500; color: var(--ns-navy); border-top: 1px solid var(--ns-camel); background: var(--ns-paper); }
.mm-table-3 tr.is-total td:nth-child(3) { color: var(--ns-emerald); }
.mm-table-3 tr.is-final td { font-weight: 700; }

/* 4-column variant: Item / Baseline / Adjusted / Status */
.mm-table-4 table { table-layout: fixed; }
.mm-table-4 th:nth-child(1) { width: 38%; }
.mm-table-4 th:nth-child(2),
.mm-table-4 th:nth-child(3) { width: 24%; }
.mm-table-4 th:nth-child(4) { width: 14%; text-align: right; }
.mm-table-4 td.status { text-align: right; font-family: var(--ns-font-body); }
.mm-table-4 td.status .pill { display: inline-block; font-family: var(--ns-font-body); font-weight: 700; font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; padding: 4px 10px; border-radius: 2px; }
.mm-table-4 td.status .pill.changed { background: var(--ns-emerald-soft); color: var(--ns-emerald); }
.mm-table-4 td.status .pill.same    { background: transparent; color: var(--ns-fg-3); border: 1px solid var(--ns-bone); }
.mm-table-4 td:nth-child(3) { white-space: normal; }
.mm-table-4 tr.is-changed td:nth-child(3) { color: var(--ns-emerald); }

/* Generic n-column data table — used by Module 7 and forward */
.mm-data-table table { table-layout: auto; width: 100%; }
.mm-data-table thead th { font-family: var(--ns-font-body); font-weight: 700; font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-camel); padding: 14px 18px; text-align: left; border-bottom: 1px solid var(--ns-camel); background: var(--ns-paper); }
.mm-data-table thead th.is-num { text-align: right; }
.mm-data-table td { padding: 12px 18px; font-family: var(--ns-font-body); font-size: 15px; line-height: 1.45; color: var(--ns-fg-1); border-bottom: 1px solid var(--ns-bone); }
.mm-data-table tr:last-child td { border-bottom: 0; }
.mm-data-table td.is-num { text-align: right; font-family: var(--ns-font-display); font-feature-settings: "lnum","tnum"; color: var(--ns-navy); white-space: nowrap; }
.mm-data-table tr.is-favorable td:last-child { color: var(--ns-emerald); }
.mm-data-table tr.is-unfavorable td:last-child { color: var(--ns-rust); }

/* Formula block — emerald italic Playfair on paper surface */
.mm-formula { font-family: var(--ns-font-display); font-style: italic; font-weight: 400; font-size: clamp(17px, 1.8vw, 19px); line-height: 1.5; color: var(--ns-emerald); background: var(--ns-paper); padding: 14px 20px; margin: 18px 0; border-left: 2px solid var(--ns-camel); border-radius: 0 var(--ns-radius-sm) var(--ns-radius-sm) 0; }

/* Calc block — worked example */
.mm-calc { margin: 12px 0 22px; padding: 14px 20px; background: var(--ns-cream); border-radius: var(--ns-radius-sm); }
.mm-calc-label { font-family: var(--ns-font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ns-camel-deep); margin-bottom: 6px; }
.mm-calc-row { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 14px; font-family: var(--ns-font-display); font-feature-settings: "lnum","tnum"; font-size: 18px; line-height: 1.4; color: var(--ns-navy); }
.mm-calc-expr { font-style: italic; }
.mm-calc-eq { color: var(--ns-camel); }
.mm-calc-result { color: var(--ns-emerald); font-weight: 500; }

/* Ladder block — the three-step Gross→Operating→Net progression */
.mm-ladder { list-style: none; padding: 0; margin: 16px 0 24px; display: grid; gap: 0; counter-reset: ladder; background: var(--ns-paper); border-radius: var(--ns-radius-md); }
.mm-ladder li { display: grid; grid-template-columns: 56px 1fr; gap: 16px; padding: 18px 22px; border-bottom: 1px solid var(--ns-bone); align-items: baseline; }
.mm-ladder li:last-child { border-bottom: 0; }
.mm-ladder-step { font-family: var(--ns-font-display); font-feature-settings: "lnum","tnum"; font-style: italic; font-size: 15px; color: var(--ns-camel); }
.mm-ladder-name { font-family: var(--ns-font-display); font-weight: 400; font-size: 19px; line-height: 1.2; color: var(--ns-navy); margin-bottom: 4px; }
.mm-ladder-formula { font-family: var(--ns-font-body); font-size: 14px; line-height: 1.5; color: var(--ns-fg-2); font-style: italic; }

/* Step blocks (numbered, structured) */
.mm-step { display: grid; grid-template-columns: 80px 1fr; gap: 20px; padding: 16px 0; align-items: baseline; }
.mm-step-note { margin: 4px 0 12px 80px; padding: 12px 18px; background: var(--ns-cream); border-left: 2px solid var(--ns-camel); border-radius: 0 var(--ns-radius-sm) var(--ns-radius-sm) 0; }
.mm-step-note p { font-family: var(--ns-font-display); font-style: italic; font-weight: 400; font-size: 15px; line-height: 1.55; color: var(--ns-camel-deep); margin: 0; }
.mm-step-num { font-family: var(--ns-font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-camel); padding-top: 4px; }
.mm-step h4 { font-family: var(--ns-font-display); font-weight: 400; font-size: 19px; line-height: 1.25; color: var(--ns-navy); margin: 0 0 8px; }
.mm-step p { font-family: var(--ns-font-body); font-size: 15px; line-height: 1.7; color: var(--ns-fg-1); margin: 0; }

/* Yellow note callout (matches Start Here's yellow-cells treatment) */
.mm-note { display: grid; grid-template-columns: 6px 1fr; gap: 20px; margin: 24px 0; padding: 18px 22px; background: var(--ns-ivory); border-radius: var(--ns-radius-md); border: 1px solid var(--ns-bone); transition: border-color 280ms var(--ns-ease-standard); }
.mm-note:hover { border-color: var(--ns-emerald); }
.mm-note-mark { background: #E9C46A; border-radius: 2px; }
.mm-note p { font-family: var(--ns-font-body); font-size: 14px; line-height: 1.65; color: var(--ns-fg-1); margin: 0; }

/* Takeaways */
.mm-takeaways { list-style: none; padding: 0; margin: 0; display: grid; gap: 0; }
.mm-takeaways li { display: grid; grid-template-columns: 28px 1fr; gap: 14px; padding: 14px 0; align-items: baseline; }
.mm-takeaways .bullet { color: var(--ns-camel); display: inline-flex; align-items: center; line-height: 1; }
.mm-takeaways .bullet svg { display: block; }
.mm-takeaways li > span:last-child { font-family: var(--ns-font-body); font-size: 16px; line-height: 1.7; color: var(--ns-fg-1); }

/* Key Takeaways capsule — emerald hairline frame, paper surface */
.mm-section.takeaways-capsule { background: var(--ns-paper); border: 1px solid var(--ns-emerald); border-radius: var(--ns-radius-md); padding: 36px 32px !important; margin: 40px 0 16px; }
.mm-section.takeaways-capsule:hover { background: var(--ns-paper); border-color: var(--ns-emerald); }
.mm-section.takeaways-capsule .mm-eyebrow { color: var(--ns-emerald); margin-bottom: 24px; }
.mm-section.takeaways-capsule .mm-takeaways li { padding: 12px 0; }

/* Your Turn */
.mm-your-turn { background: var(--ns-ivory); margin: 32px 0; padding: 32px 24px !important; border-radius: var(--ns-radius-md); border: 1px solid var(--ns-bone); border-top: 1px solid var(--ns-bone); }
.mm-yourturn-closer { font-family: var(--ns-font-display); font-style: italic; font-size: 17px; line-height: 1.65; color: var(--ns-fg-1); margin: 24px 0 0; }

/* Before you move on */
.mm-checklist-section { padding: 40px 24px 32px !important; background: var(--ns-paper); border-radius: var(--ns-radius-md); margin: 32px 0 0; border-top: 1px solid var(--ns-bone); }
.mm-h2 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(26px, 3vw, 36px); line-height: 1.1; color: var(--ns-navy); margin: 0 0 16px; }
.mm-instructions { font-family: var(--ns-font-body); font-size: 16px; line-height: 1.7; color: var(--ns-fg-2); margin: 0 0 28px; }
.mm-checklist { list-style: none; padding: 0; margin: 0 0 32px; display: grid; gap: 8px; }
.mm-checklist li { display: grid; grid-template-columns: 32px 1fr; gap: 14px; padding: 14px 18px; align-items: center; background: var(--ns-ivory); border: 1px solid var(--ns-bone); border-radius: var(--ns-radius-sm); transition: border-color 220ms var(--ns-ease-standard); cursor: pointer; }
.mm-checklist li:hover { border-color: var(--ns-emerald); }
.mm-checklist .cb { width: 22px; height: 22px; border: 1.5px solid var(--ns-border); border-radius: 4px; background: #fff; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 12px; font-weight: 700; transition: background 220ms, border-color 220ms; }
.mm-checklist li.done .cb { background: var(--ns-emerald); border-color: var(--ns-emerald); }
.mm-checklist li.done .ct { color: var(--ns-fg-3); text-decoration: line-through; text-decoration-color: var(--ns-bone); }
.mm-checklist li:hover .cb { border-color: var(--ns-emerald); }
.mm-checklist .ct { font-family: var(--ns-font-body); font-size: 15px; line-height: 1.5; color: var(--ns-fg-1); }
.mm-actions { display: flex; gap: 12px; padding-top: 8px; justify-content: space-between; align-items: center; }
/* When a signature directly precedes the action row (More Help, post-program landings),
   add deliberate breathing room so the sign-off and the CTAs do not crowd each other. */
.ms-sig + .mm-actions { margin-top: 36px; }
.members-shell .btn-ghost { background: transparent; color: var(--ns-navy); border: 1px solid var(--ns-border); }
.members-shell .btn-ghost:hover { background: var(--ns-cream); border-color: var(--ns-camel); }

/* Rail variations for module page */
.mm-toc h3 { margin-bottom: 14px; }
.mm-toc ol { list-style: none; padding: 0; margin: 0; }
.mm-toc li { border-left: 2px solid transparent; padding-left: 0; transition: padding 220ms; }
.mm-toc li button { display: grid; grid-template-columns: 28px 1fr; gap: 8px; width: 100%; padding: 10px 14px; text-align: left; background: transparent; border: 0; cursor: pointer; align-items: baseline; }
.mm-toc li .n { font-family: var(--ns-font-display); font-feature-settings: "lnum","tnum"; font-size: 11px; color: var(--ns-camel); }
.mm-toc li .t { font-family: var(--ns-font-body); font-size: 13px; line-height: 1.4; color: var(--ns-fg-2); }
.mm-toc li:hover .t { color: var(--ns-navy); }
.mm-toc li.active { border-left-color: var(--ns-emerald); padding-left: 6px; margin-left: -6px; }
.mm-toc li.active .n { color: var(--ns-emerald); }
.mm-toc li.active .t { color: var(--ns-navy); font-weight: 500; }

.mm-model .mm-model-tab { padding-bottom: 14px; margin-bottom: 14px; border-bottom: 1px solid var(--ns-bone); }
.mm-model-tab-name { font-family: var(--ns-font-display); font-size: 17px; line-height: 1.2; color: var(--ns-navy); margin-bottom: 4px; }
.mm-model-tab-meta { font-family: var(--ns-font-body); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ns-fg-3); font-weight: 700; }

.mm-up-next-title { font-family: var(--ns-font-display); font-size: 18px; line-height: 1.25; color: var(--ns-navy); }

/* Enrollment success page (May 2026) — bridge surface between marketing and members */
.enroll-hero { padding: 96px 0 64px; }
.enroll-hero .container { display: block; max-width: 760px; text-align: center; }
.enroll-hero .confirmation-mark { width: 56px; height: 56px; margin: 0 auto 28px; border: 1px solid var(--ns-emerald); border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--ns-emerald-soft); }
.enroll-hero h1 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(40px, 5.2vw, 64px); line-height: 1.04; margin: 12px auto 24px; color: var(--ns-navy); max-width: 22ch; }
.enroll-hero p.lede { font-family: var(--ns-font-display); font-style: italic; font-size: 19px; line-height: 1.5; color: var(--ns-camel-deep); margin: 0 auto; max-width: 52ch; text-align: center; }

.section.enroll-recap, .section.enroll-next { background: var(--ns-cream); padding: 72px 0 80px; transition: background 480ms var(--ns-ease-standard); }
.section.enroll-recap:hover, .section.enroll-next:hover { background: var(--ns-paper); }
.section.enroll-recap .container, .section.enroll-next .container { max-width: 760px; }

.enroll-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 0; }
.enroll-list li { display: grid; grid-template-columns: 32px 1fr; gap: 16px; padding: 20px 0; border-top: 1px solid var(--ns-bone); align-items: start; }
.enroll-list li:first-child { border-top: 1px solid var(--ns-camel); }
.enroll-list .check { color: var(--ns-emerald); font-size: 14px; padding-top: 4px; }
.enroll-list strong { display: block; font-family: var(--ns-font-display); font-weight: 400; font-size: 19px; line-height: 1.25; color: var(--ns-navy); margin-bottom: 4px; }
.enroll-list p { font-family: var(--ns-font-body); font-size: 15px; line-height: 1.65; color: var(--ns-fg-2); margin: 0; }

.enroll-steps { list-style: none; padding: 0; margin: 0; display: grid; gap: 0; }
.enroll-steps li { display: grid; grid-template-columns: 72px 1fr; gap: 16px; padding: 20px 0; border-top: 1px solid var(--ns-bone); align-items: start; }
.enroll-steps li:first-child { border-top: 1px solid var(--ns-camel); }
.enroll-steps .num { font-family: var(--ns-font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-camel); padding-top: 6px; }
.enroll-steps strong { display: block; font-family: var(--ns-font-display); font-weight: 400; font-size: 19px; line-height: 1.25; color: var(--ns-navy); margin-bottom: 4px; }
.enroll-steps p { font-family: var(--ns-font-body); font-size: 15px; line-height: 1.65; color: var(--ns-fg-2); margin: 0; }

.enroll-sig { font-family: var(--ns-font-display); font-style: italic; font-size: 22px; color: var(--ns-emerald); margin-top: 28px; }

/* More Help page — three tier cards inside members shell */
.more-help .mh-tier { display: grid; grid-template-columns: 140px 1fr; gap: 24px; padding: 24px 24px 28px; background: var(--ns-ivory); border: 1px solid var(--ns-bone); border-radius: var(--ns-radius-md); transition: border-color 280ms var(--ns-ease-standard); align-items: start; }
.more-help .mh-tier:hover { border-color: var(--ns-emerald); }
.more-help .mh-tier-price { font-family: var(--ns-font-display); font-weight: 400; font-feature-settings: "lnum","tnum"; font-size: 36px; line-height: 1.1; letter-spacing: -0.01em; color: var(--ns-camel-deep); }
.more-help .mh-tier p { font-family: var(--ns-font-body); font-size: 16px; line-height: 1.7; color: var(--ns-fg-1); margin: 0; }
@media (max-width: 820px) {
  .more-help .mh-tier { grid-template-columns: 1fr; gap: 12px; }
}

@media (max-width: 1100px) {
  .mm-reader { padding: 40px 0 64px; }
  .mm-reader > .mm-head,
  .mm-reader > .mm-phase { margin-left: 48px; margin-right: 48px; }
  .mh-inner { padding: 0 24px; }
}

/* ─────────────────────────────────────────────────────────
   Module Stepper (May 2026)
   Four-phase wizard inside the module page reader column.
   ───────────────────────────────────────────────────────── */

.mm-stepper { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; padding: 20px 40px; position: sticky; top: 164px; z-index: 40; margin: -48px 0 32px; background: var(--ns-paper); border-bottom: 1px solid var(--ns-bone); box-shadow: 0 4px 12px rgba(31,42,68,0.04); }
.mm-stepper-rail { position: absolute; left: 62px; right: 62px; top: 36px; height: 1px; background: var(--ns-bone); z-index: 0; }
.mm-step-pill { display: grid; grid-template-columns: 32px 1fr; gap: 12px; align-items: start; background: transparent; border: 0; padding: 0; cursor: pointer; text-align: left; position: relative; z-index: 1; transition: opacity 220ms var(--ns-ease-standard); }
.mm-pill-dot { width: 32px; height: 32px; border-radius: 50%; background: var(--ns-cream); border: 1.5px solid var(--ns-bone); color: var(--ns-fg-3); display: flex; align-items: center; justify-content: center; font-family: var(--ns-font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.04em; transition: all 220ms var(--ns-ease-standard); }
.mm-pill-body { display: flex; flex-direction: column; gap: 3px; min-width: 0; padding-top: 4px; }
.mm-pill-name { font-family: var(--ns-font-display); font-weight: 400; font-size: 16px; line-height: 1.15; color: var(--ns-fg-2); text-wrap: balance; }
.mm-pill-sub { font-family: var(--ns-font-body); font-size: 11px; letter-spacing: 0.04em; color: var(--ns-fg-3); }

.mm-step-pill:hover .mm-pill-dot { border-color: var(--ns-camel); color: var(--ns-camel-deep); }
.mm-step-pill:hover .mm-pill-name { color: var(--ns-navy); }

.mm-step-pill.done .mm-pill-dot { background: var(--ns-emerald); border-color: var(--ns-emerald); color: #fff; }
.mm-step-pill.done .mm-pill-name { color: var(--ns-fg-3); }
.mm-step-pill.done .mm-pill-sub { color: var(--ns-fg-3); }

.mm-step-pill.active .mm-pill-dot { background: var(--ns-emerald); border-color: var(--ns-emerald); color: #fff; box-shadow: 0 0 0 4px rgba(15, 77, 63, 0.12); }
.mm-step-pill.active .mm-pill-name { color: var(--ns-emerald); font-weight: 500; }
.mm-step-pill.active .mm-pill-sub { color: var(--ns-emerald); opacity: 0.7; }

.mm-step-pill.upcoming { opacity: 0.55; }
.mm-step-pill.upcoming:hover { opacity: 1; }

/* Phase footer with prev/next buttons */
.mm-foot { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-top: 56px; padding-top: 32px; border-top: 1px solid var(--ns-bone); }
.mm-foot-meta { font-family: var(--ns-font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-fg-3); }
.mm-foot .btn { display: inline-flex; align-items: center; gap: 10px; }
.mm-foot .btn-ghost svg { margin-right: 2px; }
.mm-foot .btn-camel svg { margin-left: 2px; }
.mm-foot > .btn-ghost:only-child { margin-right: auto; }

/* When there's only a back button (final phase), align it left */
.mm-foot:has(> .btn:only-child:first-child) { justify-content: flex-start; }

/* Your-turn h2 alignment within centered phase block */
.mm-your-turn .mm-h2 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(26px, 3vw, 36px); line-height: 1.1; color: var(--ns-navy); margin: 0 0 18px; }

@media (max-width: 820px) {
  .mm-stepper { grid-template-columns: 1fr 1fr; gap: 24px 14px; padding: 16px 24px; margin: -40px 0 24px; }
  .mm-stepper-rail { display: none; }
}




.glossary-entry-hero { padding: 80px 0 64px; background: var(--ns-cream); }
.glossary-entry-hero .container { display: block; max-width: 720px; text-align: left; margin: 0 auto; }
.breadcrumb { font-family: var(--ns-font-body); font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-fg-3); margin-bottom: 24px; }
.breadcrumb a { color: var(--ns-camel-deep); border-bottom: 1px solid var(--ns-camel); padding-bottom: 1px; }
.breadcrumb a:hover { color: var(--ns-emerald); border-color: var(--ns-emerald); }
.breadcrumb .sep { margin: 0 10px; color: var(--ns-camel); }
.breadcrumb .current { color: var(--ns-navy); }
.glossary-entry-hero h1 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(44px, 5.6vw, 72px); line-height: 1.04; margin: 0 0 32px; color: var(--ns-navy); }
.glossary-entry-hero .lead { font-family: var(--ns-font-display); font-weight: 400; font-size: clamp(20px, 2.2vw, 24px); line-height: 1.5; color: var(--ns-fg-1); margin: 0; text-wrap: pretty; }

.section.glossary-entry-body { background: var(--ns-cream); padding: 64px 0 80px; }
.section.glossary-entry-body .container { max-width: 720px; }
.entry-prose { display: block; }
.entry-section { padding: 24px 0; }
.entry-section:first-child { padding-top: 0; }
.entry-section h2 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(24px, 2.6vw, 32px); line-height: 1.18; color: var(--ns-navy); margin-bottom: 18px; text-wrap: balance; }
.entry-section p { font-family: var(--ns-font-body); font-size: 17px; line-height: 1.8; color: var(--ns-fg-1); margin: 0 0 16px; }
.entry-section p:last-child { margin-bottom: 0; }
.entry-section .formula { font-family: var(--ns-font-display); font-weight: 500; font-size: clamp(17px, 1.8vw, 20px); line-height: 1.5; color: var(--ns-emerald); background: var(--ns-paper); padding: 18px 24px; margin: 18px 0; border-left: 2px solid var(--ns-camel); text-wrap: pretty; }

.section.glossary-related { background: var(--ns-paper); padding: 72px 0 88px; }
.section.glossary-related .container { max-width: 1100px; }
.related-head { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(28px, 3vw, 36px); line-height: 1.14; color: var(--ns-navy); margin: 16px 0 40px; text-wrap: balance; }
.related-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.related-card { display: flex; flex-direction: column; gap: 8px; padding: 24px; background: var(--ns-cream); border: 1px solid var(--ns-bone); transition: border-color 280ms var(--ns-ease-standard), transform 280ms var(--ns-ease-standard); }
.related-card:hover { border-color: var(--ns-emerald); transform: translateY(-2px); }
.related-card .kind { font-family: var(--ns-font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-camel); }
.related-card .t { font-family: var(--ns-font-display); font-weight: 400; font-size: 20px; line-height: 1.3; color: var(--ns-navy); }
.related-card:hover .t { color: var(--ns-emerald); }

.glossary-entry-hero, .section.glossary-entry-body, .section.glossary-related { transition: background 480ms var(--ns-ease-standard); }
.glossary-entry-hero:hover, .section.glossary-entry-body:hover { background: var(--ns-paper); }



.contact-hero, .section.contact-main, .section.contact-aside-section { transition: background 480ms var(--ns-ease-standard); }
.contact-hero:hover, .section.contact-main:hover, .section.contact-aside-section:hover { background: var(--ns-paper); }




/* About: Why I Built This — two-paragraph editorial block */
.section.origin { background: var(--ns-cream); padding: 120px 0; }
.origin .container { max-width: 920px; }
.origin .grid { display: grid; grid-template-columns: 5fr 7fr; gap: 80px; align-items: start; }
.origin h2 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: "opsz" 144, "SOFT" 30; font-size: clamp(36px, 4.2vw, 52px); line-height: 1.1; text-wrap: balance; }
.origin .body p { font-size: 17px; line-height: 1.75; color: var(--ns-fg-1); margin-bottom: 20px; }

/* About: Beliefs — four numbered blocks */
.beliefs-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 64px 80px; padding-top: 8px; }
.belief { padding-top: 24px; }
.belief .n { font-family: var(--ns-font-display); font-feature-settings: "lnum","tnum"; color: var(--ns-camel); font-size: 14px; letter-spacing: 0.18em; margin-bottom: 14px; }
.belief h3 { font-family: var(--ns-font-display); font-weight: 400; font-size: 26px; line-height: 1.2; margin-bottom: 16px; color: var(--ns-navy); text-wrap: balance; }
.belief p { font-size: 16px; line-height: 1.7; color: var(--ns-fg-2); }

/* About: Work With Me Directly */
.section.advisory { background: var(--ns-navy); color: #fff; padding: 120px 0; }
.advisory .container { display: grid; grid-template-columns: 5fr 7fr; gap: 80px; align-items: start; }
.advisory .eyebrow { color: var(--ns-camel); }
.advisory h2 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: "opsz" 144, "SOFT" 30; font-size: clamp(34px, 4vw, 48px); line-height: 1.14; color: #fff; text-wrap: balance; }
.advisory .body p { font-size: 17px; line-height: 1.75; color: rgba(255,255,255,0.78); margin-bottom: 18px; }
.advisory .tiers { margin-top: 36px; display: grid; grid-template-columns: 1fr; gap: 1px; background: rgba(198,167,110,0.24); border: 1px solid rgba(198,167,110,0.24); }
.advisory .tier { background: var(--ns-navy); padding: 22px 24px; display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: baseline; }
.advisory .tier .label { font-size: 14px; color: rgba(255,255,255,0.86); }
.advisory .tier .price { font-family: var(--ns-font-display); font-feature-settings: "lnum","tnum"; color: var(--ns-camel); font-size: 18px; font-weight: 400; }
.advisory .link { display: inline-block; margin-top: 24px; font-size: 12px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ns-camel); border-bottom: 1px solid var(--ns-camel); padding-bottom: 4px; }

/* Contact: below-form section */
.contact-aside { margin-top: 96px; padding-top: 64px; border-top: 1px solid var(--ns-bone); display: grid; grid-template-columns: 1fr 1fr; gap: 56px; }
.contact-aside .col h4 { font-family: var(--ns-font-display); font-weight: 400; font-size: 22px; line-height: 1.25; margin-bottom: 14px; color: var(--ns-navy); }
.contact-aside .col p { font-size: 15px; line-height: 1.7; color: var(--ns-fg-2); }
.contact-aside .col a { color: var(--ns-camel-deep); border-bottom: 1px solid var(--ns-camel); padding-bottom: 1px; }

/* Last-updated freshness signal */
.last-updated { padding: 32px 0; text-align: center; background: var(--ns-ivory); font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ns-fg-3); }
.last-updated .sep { margin: 0 12px; color: var(--ns-camel); }

/* Section eyebrow heading wrapper used by new sections (left-aligned variant) */
.section-head { max-width: 860px; margin: 0 auto 64px; text-align: center; }
.section-head .eyebrow { justify-content: center; margin-bottom: 18px; }
.section-head h2 { font-family: var(--ns-font-display); font-weight: 400; font-variation-settings: var(--ns-fraunces-display); font-size: clamp(36px, 4.4vw, 52px); line-height: 1.1; text-wrap: balance; }
.section-head p.lede { margin-top: 22px; font-size: 18px; line-height: 1.6; color: var(--ns-fg-2); max-width: 56ch; margin-inline: auto; }
.section-head.left { text-align: left; margin-left: 0; }
.section-head.left .eyebrow { justify-content: flex-start; }

/* ─────────────────────────────────────────────────────────
   Editorial system — § markers, vertical labels, two-tone heads,
   camel italic kickers. Mirrors the malirichlen.com register.
   ───────────────────────────────────────────────────────── */

/* § section marker. Camel section sign + emerald label, on one line. */
.section-marker { display: inline-flex; align-items: center; gap: 14px; margin-bottom: 32px; font-family: var(--ns-font-body); font-size: 12px; letter-spacing: 0.22em; text-transform: uppercase; font-weight: 700; }
.section-marker .section-rule { display: block; width: 28px; height: 1px; background: var(--ns-camel); flex-shrink: 0; }
.section-marker .section-num  { color: var(--ns-camel); font-family: var(--ns-font-display); font-style: italic; font-weight: 400; font-size: 13px; letter-spacing: 0.06em; text-transform: none; }
.section-marker .section-label { color: var(--ns-emerald); }
.section-marker .section-label-rule { display: block; width: 28px; height: 1px; background: var(--ns-emerald); flex-shrink: 0; }
/* When marker sits inside a navy section, swap label/rule to camel for legibility */
.bg-navy .section-marker .section-label,
.master-model .section-marker .section-label,
.advisory .section-marker .section-label,
.course-hero .section-marker .section-label { color: var(--ns-camel); }
.bg-navy .section-marker .section-label-rule,
.master-model .section-marker .section-label-rule,
.advisory .section-marker .section-label-rule,
.course-hero .section-marker .section-label-rule { background: var(--ns-camel); }

/* Vertical rotated rail label — sits in the left margin.
   Anchor to hero / section parents so the rail stays inside its section across all pages. */
.hero, .course-hero, .about-hero, .contact-hero, .method-hero, .glossary-hero, .insights-hero, .insight-article-hero, .glossary-entry-hero, .enroll-hero { position: relative; }
.v-label { position: absolute; left: 24px; top: 96px; font-family: var(--ns-font-body); font-size: 11px; letter-spacing: 0.28em; text-transform: uppercase; color: rgba(31, 42, 68, 0.32); font-weight: 500; writing-mode: vertical-rl; transform: rotate(180deg); transform-origin: center; user-select: none; }
/* On dark sections the rail label tints toward camel-on-navy at low alpha. */
.section.problem .v-label,
.section.master-model .v-label,
.section.advisory .v-label,
.bg-navy .v-label { color: rgba(198, 167, 110, 0.5); }
.section { position: relative; }

/* Two-tone display heads — emerald italic on the emphasized phrase. */
.ns-emph { color: var(--ns-emerald); font-style: italic; font-weight: 400; }
/* On navy surfaces, emerald loses contrast — switch to camel. */
.section.problem .ns-emph,
.section.master-model .ns-emph,
.section.advisory .ns-emph,
.bg-navy .ns-emph,
.course-hero.bg-navy .ns-emph { color: var(--ns-camel); }

/* Camel italic kicker — the secondary subhead used after a duo head.
   Mirrors malirichlen.com's "Most advisors work on one..." line. */
.kicker { font-family: var(--ns-font-display); font-style: italic; font-weight: 400; font-size: clamp(18px, 1.9vw, 22px); line-height: 1.5; color: var(--ns-camel-deep); max-width: 48ch; text-wrap: pretty; margin: 0 auto; }
.kicker.left { margin-left: 0; }

/* Header hairline divider, edge-to-edge */
.site-header { box-shadow: inset 0 -1px 0 rgba(198, 167, 110, 0.18); }

/* Value cards get an editorial № mark; subtler than module numerals. */
.value .num-mark { display: inline-flex; align-items: center; gap: 8px; font-family: var(--ns-font-body); font-weight: 700; font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ns-emerald); margin-bottom: 24px; }
.value .num-mark .num-rule { display: block; width: 20px; height: 1px; background: var(--ns-camel); }
.value .num-mark .num-n { font-family: var(--ns-font-display); font-feature-settings: "lnum","tnum"; font-style: italic; font-weight: 400; font-size: 13px; letter-spacing: 0.04em; color: var(--ns-camel); text-transform: none; }


/* Hero actions: secondary outline button on Home */
.hero .actions .btn-outline { color: var(--ns-navy); border-color: var(--ns-navy); }

/* Bio card on Sales (instructor) — reuse but scoped */
.section.instructor .bio { grid-template-columns: 4fr 8fr; gap: 64px; }

/* ── Emerald accent — for outcome phrases. Used sparingly per SKILL.md ── */
.ns-accent-emerald { color: var(--ns-emerald); font-weight: 500; }
.ns-accent-emerald-italic { color: var(--ns-emerald); font-style: italic; font-weight: 500; }

/* ── Mobile ── */
@media (max-width: 880px) {
  .site-header { height: 72px; }
  .site-header nav { display: none; }
  .values-head, .values-grid, .deliverables, .bio, .contact-form { grid-template-columns: 1fr; gap: 40px; }
  .site-footer .grid { grid-template-columns: 1fr; gap: 40px; }
  .section { padding: 64px 0; }
  .hero { padding: 56px 0 72px; }
  .hero h1 { font-size: clamp(34px, 9vw, 44px); }
  .hero p.lede { font-size: 17px; }
  .values-head h2.title { font-size: clamp(32px, 8vw, 42px); }
  .values-head h2 { font-size: clamp(28px, 7vw, 36px); }
  .final-cta { padding: 56px 0 64px; }
  .final-cta h2 { font-size: clamp(28px, 7vw, 36px); }
  .final-cta p { font-size: 16px; }
  .deliverable .num, .value .num { font-size: 32px; }
  h2 { font-size: clamp(30px, 7vw, 38px) !important; }
  .container { padding: 0 24px; }
  .solution-grid, .fit-cols, .beliefs-grid, .master-model .container, .origin .grid, .advisory .container, .contact-aside, .problem-layout { grid-template-columns: 1fr !important; gap: 32px !important; }
  .missing-grid { grid-template-columns: 1fr !important; }
  .tab-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .definition .body { font-size: 19px; }
  .problem-list .item { grid-template-columns: 28px 1fr; gap: 16px; }
  .module-row.expanded { grid-template-columns: 48px 1fr; }
  .module-row.expanded .week { grid-column: 2 / 3; padding-top: 0; }
  .faq-item summary { font-size: 18px; padding-right: 36px; }
}

/* ═══════════════════════════════════════════════════════════════
   MOBILE RESPONSIVE PASS — June 2026
   Addresses 18-item iOS Safari punch list.
   ═══════════════════════════════════════════════════════════════ */

/* ── 2. Vertical rail labels: hide at tablet and below ──
   The v-label is decorative only; at narrow widths it overlaps content.
   The design calls for display:none below 1024px per design-handoff-notes. */
@media (max-width: 1024px) {
  .v-label { display: none; }
}

/* ── 3. Eyebrow sparkle/cross glyph: remove site-wide ──
   The SVG mark (eyebrow-mark) used in section eyebrows is misaligned
   on mobile and has been removed at Mali's request. */
.eyebrow-mark { display: none; }

/* ── Primary mobile fixes (≤ 880px) ── */
@media (max-width: 880px) {

  /* 1. Hamburger: collapse the drawer cleanly.
     Base state must have zero y-padding so max-height:0 truly collapses the box.
     The existing is-menu-open rule already applies the full 16px 24px 24px padding. */
  .site-header .mobile-menu { padding: 0 24px; }

  /* 4. Hero eyebrow: allow text to wrap on narrow viewports.
     The global rule sets white-space:nowrap which causes overflow on phones. */
  .eyebrow { white-space: normal; }

  /* 5. Values head: reduce the oversized margin below the section headline. */
  .values-head { margin-bottom: 40px; }

  /* 6. Values grid: tighten gap between the three value cards. */
  .values-grid { gap: 32px !important; }

  /* 7. Sales hero pricing block: stack "One payment" below the dollar amount.
     On desktop the <small> sits inline; on mobile it overflows the screen. */
  .course-hero .price { display: flex; flex-direction: column; align-items: center; gap: 4px; }
  .course-hero .price small { display: block; margin-left: 0; vertical-align: initial; }

  /* 8. Master Model: center copy when the two columns collapse to one. */
  .master-model .copy { text-align: center; }
  .master-model .copy .eyebrow { justify-content: center; }
  .master-model .copy h2 { margin-left: auto; margin-right: auto; }

  /* 9+11. All hero sections: unified 56px top, 40px bottom on mobile. */
  .hero, .course-hero, .method-hero, .glossary-hero, .insights-hero,
  .about-hero, .contact-hero { padding-top: 56px; padding-bottom: 40px; }

  /* 9b. Method intro and modules section: tighten following sections. */
  .section.method-intro { padding: 40px 0 48px; }

  /* 10. Method modules section: reduce bottom padding and clamp last module. */
  .section.method-modules-section { padding-bottom: 56px; }
  .method-module:last-child { padding-bottom: 0; margin-bottom: 0; }

  /* 11b. Index sections: unified 36px top padding. */
  .section.glossary-index, .section.insights-index { padding-top: 36px; }

  /* 12. About page: tighten inter-section spacing. */
  .about-bio              { padding: 48px 0 56px; }
  .section.origin         { padding: 48px 0 56px; }
  .section.beliefs        { padding: 48px 0 56px; }
  .section.advisory       { padding: 48px 0 56px; }

  /* 13. Beliefs/philosophy grid: reduce gap between numbered cards. */
  .beliefs-grid { gap: 24px !important; }

  /* 14a. Members shell: reduce subheader horizontal padding. */
  .mh-inner { padding: 0 20px; }

  /* 14b. Members reader (Start Here): reduce generous desktop padding. */
  .members-reader { padding: 32px 20px 56px; }
  .members-head h1 { font-size: clamp(32px, 9vw, 48px); }
  .ms-subhead { font-size: 17px; }
  .ms-prose p { font-size: 16px; }

  /* 15. Module stepper: fix sticky offset for the shorter mobile header stack.
     Mobile nav = 72px; members-header = 68px; total = 140px.
     Also widen stepper to fill the narrower reader column. */
  .mm-stepper {
    top: 140px;
    margin: -40px 0 20px;
    padding: 12px 20px;
    grid-template-columns: 1fr 1fr;
    gap: 16px 12px;
  }
  .mm-stepper-rail { display: none; }
  .mm-pill-name { font-size: 14px; line-height: 1.2; }
  .mm-pill-sub  { font-size: 10px; }

  /* 16. Module reader: reduce outer margins so content breathes correctly. */
  .mm-reader { padding: 32px 0 56px; }
  .mm-reader > .mm-head,
  .mm-reader > .mm-phase { margin-left: 20px; margin-right: 20px; }
  .mm-head h1 { font-size: clamp(26px, 8vw, 40px); }
  .mm-crumb { font-size: 10px; letter-spacing: 0.16em; }

  /* 17. Teaching section: reduce padding and scale prose type. */
  .mm-section { padding: 22px 16px; }
  .mm-lead { font-size: 16px; }
  .mm-teaching h2 { font-size: clamp(22px, 6vw, 30px); }
  .mm-prose p { font-size: 16px; }

  /* 18. Your Turn and Confirm (Before You Move On) sections. */
  .mm-your-turn { padding: 24px 16px !important; margin: 20px 0; }
  .mm-checklist-section { padding: 24px 16px 20px !important; margin: 20px 0 0; }
  .mm-h2 { font-size: clamp(22px, 6vw, 30px); }
  .mm-instructions { font-size: 15px; }
  .mm-actions { flex-direction: column; align-items: stretch; gap: 10px; }
  .mm-actions .btn { justify-content: center; }
  .mm-foot { flex-wrap: wrap; gap: 12px; }
}

/* ── Very narrow phones (≤ 420px) ── */
@media (max-width: 420px) {
  .container { padding: 0 16px; }
  .mm-reader > .mm-head,
  .mm-reader > .mm-phase { margin-left: 16px; margin-right: 16px; }
  .pricing-card { padding: 32px 16px; }
  .pricing-card .amount { font-size: 56px; }
}

/* ── Header "Sign In" link: sits outside <nav>, match nav typography ── */
.site-header .container > a[href="/login"] {
  font-family: var(--ns-font-body);
  font-weight: 400;
  font-size: 13px;
  letter-spacing: 0.04em;
  color: rgba(255, 255, 255, 0.78);
  text-decoration: none;
  padding: 8px 2px;
  margin-right: 16px;
  transition: color 220ms var(--ns-ease-standard);
}
.site-header .container > a[href="/login"]:hover {
  color: var(--ns-camel);
}

/* Hide the desktop Sign In link on mobile — the mobile drawer has its own */
@media (max-width: 880px) {
  .site-header .container > a[href="/login"] { display: none; }
}