/* MathLoom Royal Light Plus · approved white/royal/navy direction, 2026-10-24.
   Existing reviews, diagnostic workflows, forms and privacy boundaries stay unchanged. */
:root{
  color-scheme:light;
  --ml-paper:#fff;--ml-paper-soft:#f4f8ff;--ml-ink:#10233f;
  --ml-text:#485e7a;--ml-muted:#657890;--ml-border:#dce6f5;
  --ml-accent:#1857e8;--ml-accent-hover:#1246bb;
  --ml-vivid:#1857e8;--ml-vivid-hover:#1246bb;
  --ms-blue:var(--ml-accent);--ms-blue-hover:var(--ml-accent-hover);
  --ms-bg:var(--ml-paper);--ms-navy:var(--ml-ink);
}
body,.resource-center,.learning-page{background:#fff!important;color:#10233f}
header,.rc-header,.learning-header{background:#fffffffa!important;border-bottom:1px solid #e1e9f4!important;box-shadow:none!important}
.brand,[data-k="brand"],.rc-brand>span,.learning-brand strong{color:#10233f!important;font-weight:900!important}
header .brand{gap:0!important;font-family:Inter,"Avenir Next","Century Gothic",system-ui,sans-serif;letter-spacing:-.065em!important}
header .brand .brand-math{color:#10233f!important}
header .brand .brand-loom{color:#1857e8!important}
nav a:hover,.nav nav a:hover,.rc-nav nav a:hover,.learning-nav nav a:hover{color:#1857e8!important}
#language,#site-lang,.lang-switch{background:#fff!important;color:#10233f!important;border-color:#dce6f5!important}
.kicker,.rc-kicker,.learning-overline,.ms-eyebrow{color:#1857e8!important}
.primary,.rc-primary,.learning-hero-actions .primary,.hero .buttons .primary{background:#1857e8!important;border:1px solid #1857e8!important;color:#fff!important;box-shadow:none!important}
.primary:hover,.primary:focus-visible,.rc-primary:hover,.learning-hero-actions .primary:hover,.hero .buttons .primary:hover{background:#1246bb!important;border-color:#1246bb!important}
.secondary,.rc-secondary,.learning-secondary,.hero .buttons .secondary{background:#fff!important;color:#10233f!important;border:1px solid #b8c7df!important}
:focus-visible{outline:3px solid #1857e8!important;outline-offset:3px}

/* Tutor-led opening: generous type and a direct consultation path. */
.hero{background:#fff!important;padding:clamp(72px,7vw,112px) 0 clamp(62px,6vw,96px)!important}
.hero .hero-grid{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:0!important;align-items:center!important}
.hero-copy{max-width:930px!important;min-width:0;display:flex;flex-direction:column;align-items:flex-start}
.hero .kicker{font-size:11px!important;font-weight:850!important;margin:0 0 19px!important;color:#1857e8!important}
.hero h1{font-size:clamp(46px,5.3vw,72px)!important;line-height:1.2!important;letter-spacing:-.058em!important;margin:0 0 26px!important;max-width:930px!important;color:#10233f!important;word-break:keep-all!important}
.hero h1 em{color:#1857e8!important}
.hero .intro{color:#485e7a!important;font-size:clamp(15px,1.3vw,18px)!important;line-height:1.85!important;max-width:700px!important;margin:0 0 10px!important}
.hero .buttons{display:flex;gap:11px!important;flex-wrap:wrap;margin:17px 0 0!important;align-items:stretch!important}
.hero .buttons a{padding:14px 17px!important;min-height:52px!important;font-size:13px!important;font-weight:850!important;display:inline-flex!important;align-items:center;justify-content:center}
.hero-signature{margin-top:23px!important;padding-top:13px;border-top:1px solid #e5ecf7;width:100%;max-width:540px}
.hero .sub{font-size:11px!important;color:#72819b!important;margin-top:9px}

/* One thin, substantial navy trust anchor—not multiple large blue panels. */
.ml-trust-band{background:#102a4e!important;color:#fff!important;padding:18px 0!important}
.ml-trust-band .hero-proof{margin:0!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:0!important;align-items:center}
.ml-trust-band .hero-proof span{background:transparent!important;border:0!important;color:#f6f9ff!important;border-radius:0!important;
 font-size:14px!important;font-weight:850!important;line-height:1.6!important;text-align:center;display:flex;align-items:center;justify-content:center;
 min-height:50px;padding:5px 18px!important;box-shadow:none!important}
.ml-trust-band .hero-proof span+span{border-left:1px solid #a7bdd74d!important}
.ml-trust-band .hero-proof span::before{content:"✦";font-size:18px;margin-right:12px;color:#5ea6ff}

/* Services are no longer squeezed into hero; 2 premium cards right below navy band. */
.ml-plus-services{background:#fff!important;padding:32px 0 20px!important}
.ml-plus-services .ml-feature-grid{border:0!important;padding:0!important;margin:0!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px!important}
.ml-plus-services .ml-feature{min-height:195px!important;background:#fff!important;border:1px solid #d9e4f5!important;border-radius:9px!important;padding:25px 30px!important;box-shadow:0 2px 16px #10233f09!important}
.ml-plus-services .ml-feature:hover{border-color:#90b7f7!important;background:#f8fbff!important;transform:none!important}
.ml-plus-services .ml-feature-kicker{font-size:11px!important;font-weight:900!important;color:#1857e8!important}
.ml-plus-services .ml-feature strong{font-size:clamp(19px,1.8vw,24px)!important;color:#10233f!important}
.ml-plus-services .ml-feature p{color:#63758f!important;max-width:470px!important}
.ml-plus-services .ml-feature .ml-feature-link{color:#1857e8!important;font-size:12px!important}

/* Existing verified reviews stay unchanged; only cards, spacing, and typography are recolored. */
.social-proof{background:#fff!important;border:0!important}
.social-proof h2{color:#10233f!important}
.review-summary-snapshot,.review-grid>*{background:#fff!important;border-color:#dce6f5!important;box-shadow:none!important}
.review-source-link,.review-snapshot-score{color:#1857e8!important}

/* Consultation bridge: pale ice blue, three clear steps, a single strong blue CTA. */
.ml-consult-bridge{background:#eaf3ff!important;color:#10233f!important;border-top:1px solid #d8e8ff!important;border-bottom:1px solid #d8e8ff!important;padding:clamp(54px,5vw,73px) 0!important}
.ml-consult-bridge .kicker{color:#1857e8!important}
.ml-consult-bridge h2{color:#10233f!important;max-width:none!important}
.ml-consult-bridge .section-intro{color:#526783!important}
.ml-consult-steps{gap:13px!important}
.ml-consult-steps li{border:1px solid #d1e2f7!important;background:#fff!important;border-radius:8px!important;padding:22px!important;min-height:160px}
.ml-consult-steps li>span{color:#1857e8!important;font-size:15px!important}
.ml-consult-steps li>strong{color:#10233f!important}
.ml-consult-steps li>p{color:#526783!important}
.ml-consult-bridge-actions .primary{background:#1857e8!important;border-color:#1857e8!important;color:#fff!important}
.ml-consult-bridge-actions .secondary{background:#fff!important;border-color:#bdd0e8!important;color:#10233f!important}
.ml-consult-bridge-note{color:#5f7390!important}
.instructor-section,.program-section,.learning-teaser{background:#fff!important}
.teaching-section,.trial-section,.compact-resources,.dark#consult{background:#f6f9ff!important}
.rc-hero,.learning-hero{background:#eff5ff!important}
footer,.rc-footer,.learning-footer{background:#f4f7fc!important;border-color:#dce6f5!important;color:#536985!important}
footer a,.rc-footer a,.learning-footer a,footer b{color:#10233f!important}
@media(max-width:900px){
 .hero .hero-copy{max-width:850px!important}
 .hero h1{max-width:780px!important}
}
@media(max-width:580px){
 .hero{padding:54px 0 52px!important}
 .hero h1{font-size:clamp(32px,8.5vw,42px)!important}
 .hero .buttons{width:100%;flex-direction:column}
 .hero .buttons a{width:100%!important}
 .hero-signature{margin-top:16px!important}
 .ml-trust-band{padding:11px 0!important}
 .ml-trust-band .hero-proof{grid-template-columns:1fr!important}
 .ml-trust-band .hero-proof span{justify-content:flex-start!important;min-height:36px!important;font-size:12px!important;padding:5px 4px!important}
 .ml-trust-band .hero-proof span+span{border-left:0!important;border-top:1px solid #a7bdd73b!important}
 .ml-plus-services{padding:20px 0!important}
 .ml-plus-services .ml-feature-grid{grid-template-columns:1fr!important;gap:10px!important}
 .ml-plus-services .ml-feature{min-height:0!important;padding:19px 20px!important}
 .ml-consult-steps{grid-template-columns:1fr!important}
 .ml-consult-steps li{min-height:0!important}
}
@media print{
 .ml-trust-band{display:none!important}
 .ml-consult-bridge{background:#fff!important;color:#111!important}
 .ml-consult-steps li{background:#fff!important;border:1px solid #aaa!important}
 .rc-report-paper{background:#fff!important;color:#111!important}
}
/* Trust captions and verified testimonial cards: typography only, never content. */
.ml-trust-band .hero-proof span{font-family:Inter,Pretendard,"Malgun Gothic",system-ui,sans-serif!important}
.social-proof .testimonial-card{border:1px solid #dae5f5!important;background:#fff!important;box-shadow:0 3px 18px #1428440b!important;border-radius:9px!important}
.social-proof .review-stars{color:#1857e8!important}


/* Royal Light Plus color-system consolidation (2026-10-24).
   Keep the same royal blue for all action buttons; use navy on pale surfaces
   and WHITE text on saturated blue. Remove the competing dark navy band. */
:root{
  --ml-royal:#1857e8;
  --ml-royal-hover:#1246bb;
  --ml-navy:#10233f;
  --ml-ice:#eff5ff;
  --ml-divider:#d2e1f5;
}

/* Trust summary: light blue replaces the previous almost-black bar. */
.ml-trust-band{
  background:var(--ml-ice)!important;
  color:var(--ml-navy)!important;
  border-top:1px solid var(--ml-divider)!important;
  border-bottom:1px solid var(--ml-divider)!important;
}
.ml-trust-band .hero-proof span{
  background:transparent!important;
  color:var(--ml-navy)!important;
}
.ml-trust-band .hero-proof span+span{
  border-left:1px solid var(--ml-divider)!important;
}
.ml-trust-band .hero-proof span::before{
  color:var(--ml-royal)!important;
}
/* Existing mobile trust items stack vertically: use pale dividers. */
@media(max-width:580px){
  .ml-trust-band .hero-proof span+span{
    border-left:0!important;
    border-top:1px solid var(--ml-divider)!important;
  }
}

/* Original review link was a navy button with blue text: insufficient contrast.
   Use precisely the same royal blue / white treatment as primary CTAs. */
.review-source-link,
.review-source-link:link,
.review-source-link:visited,
.review-copy,
.review-copy:not(:disabled){
  background:var(--ml-royal)!important;
  border:1px solid var(--ml-royal)!important;
  color:#fff!important;
  text-decoration:none!important;
}
.review-source-link:hover,
.review-source-link:focus-visible,
.review-copy:hover,
.review-copy:focus-visible{
  background:var(--ml-royal-hover)!important;
  border-color:var(--ml-royal-hover)!important;
  color:#fff!important;
}
.review-source-link:focus-visible,
.review-copy:focus-visible{
  outline:3px solid #94baff!important;
  outline-offset:3px!important;
}
/* Remove a leftover warm-ivory breadcrumb tint from this blue/white system. */
.ml-site-breadcrumb{
  background:#fff!important;
  border-bottom:1px solid var(--ml-divider)!important;
  color:var(--ml-navy)!important;
}
.ml-site-breadcrumb a{color:var(--ml-royal)!important}


/* MathLoom header typography and vertical rhythm, 2026-10-24.
   Desktop: one balanced row. Tablet/mobile: clearly readable two-row navigation. */
@media(min-width:901px){
  header .wrap.nav{
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr) auto!important;
    grid-template-rows:1fr!important;
    align-items:center!important;
    width:min(1120px,calc(100% - 36px));
    height:82px!important;
    min-height:82px!important;
    gap:clamp(18px,2.4vw,38px)!important;
    padding:0!important;
  }
  header .nav .brand{
    grid-column:1!important;
    grid-row:1!important;
    align-self:center!important;
    font-size:clamp(32px,2.7vw,36px)!important;
    line-height:1.15!important;
  }
  header .nav nav{
    grid-column:2!important;
    grid-row:1!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:clamp(16px,2.05vw,30px)!important;
    width:auto!important;
    padding:0!important;
    margin:0!important;
    overflow:visible!important;
    line-height:1.4!important;
  }
  header .nav nav a{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:46px!important;
    padding:8px 2px!important;
    font-size:15px!important;
    font-weight:700!important;
    line-height:1.4!important;
    white-space:nowrap!important;
  }
  header .nav #language{
    grid-column:3!important;
    grid-row:1!important;
    justify-self:end!important;
    align-self:center!important;
    min-height:42px!important;
  }
}
@media(max-width:900px){
  header .wrap.nav{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    grid-template-rows:auto auto!important;
    align-items:center!important;
    gap:6px 12px!important;
    height:auto!important;
    min-height:0!important;
    padding:11px 0 9px!important;
  }
  header .nav .brand{
    grid-column:1!important;
    grid-row:1!important;
    font-size:clamp(29px,3.8vw,33px)!important;
    line-height:1.25!important;
  }
  header .nav #language{
    grid-column:2!important;
    grid-row:1!important;
    justify-self:end!important;
    min-height:40px!important;
    margin-left:0!important;
  }
  header .nav nav{
    grid-column:1/-1!important;
    grid-row:2!important;
    display:flex!important;
    flex:initial!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:clamp(7px,1.7vw,16px)!important;
    padding:3px 0!important;
    margin:0!important;
    width:100%!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scrollbar-width:thin;
  }
  header .nav nav a{
    display:inline-flex!important;
    flex-shrink:0!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:40px!important;
    padding:7px 3px!important;
    font-size:13px!important;
    font-weight:700!important;
    line-height:1.3!important;
    white-space:nowrap!important;
  }
}
@media(max-width:410px){
  header .nav nav{gap:4px!important}
  header .nav nav a{font-size:12.5px!important;padding:7px 1px!important}
}

/* Parent-facing hero balance: center the content on tablet/desktop, retaining the
   existing left-aligned mobile reading flow and all primary consultation actions. */
@media (min-width: 768px){
  .hero .hero-grid{justify-items:center!important}
  .hero .hero-copy{
    width:100%!important;
    max-width:1040px!important;
    margin-inline:auto!important;
    align-items:center!important;
    text-align:center!important;
  }
  .hero .kicker,.hero h1,.hero .intro,.hero .sub{
    text-align:center!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  .hero h1{max-width:1040px!important}
  .hero .intro{max-width:800px!important}
  .hero .buttons{justify-content:center!important}
  .hero .hero-signature{justify-content:center!important;max-width:580px!important}
  .hero .hero-signature div{text-align:left}
}