/* i-Maths modern shared interface — August 2026 */
:root {
  --im-ink: #0b1b3c;
  --im-text: #3c4b66;
  --im-muted: #6c7890;
  --im-bg: #f8faff;
  --im-surface: rgba(255,255,255,.94);
  --im-white: #fff;
  --im-line: #e6eaf3;
  --im-primary: #7447e6;
  --im-primary-dark: #5930c5;
  --im-primary-soft: #f3efff;
  --im-cyan: #148cff;
  --im-cyan-soft: #edf7ff;
  --im-teal: #05a86b;
  --im-green: #05a86b;
  --im-amber: #ff8a00;
  --im-rose: #ff1f5a;
  --im-radius-sm: 14px;
  --im-radius: 20px;
  --im-radius-lg: 30px;
  --im-shadow-sm: 0 8px 24px rgba(31, 41, 55, .06);
  --im-shadow: 0 20px 55px rgba(31, 41, 55, .10);
  --im-shadow-hover: 0 24px 60px rgba(79, 70, 229, .14);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--im-text);
  background:
    radial-gradient(circle at 8% 0%, rgba(6,182,212,.10), transparent 24rem),
    radial-gradient(circle at 92% 8%, rgba(99,102,241,.10), transparent 27rem),
    linear-gradient(180deg, #fbfcff 0%, var(--im-bg) 52%, #f8fafc 100%);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
a { color: inherit; }
button, input, select, textarea { font: inherit; }
::selection { background: #c7d2fe; color: #1e1b4b; }

/* Shared header/footer */
.site-header {
  position: sticky !important;
  top: 0;
  z-index: 100;
  border-bottom: 1px solid rgba(227,233,242,.86) !important;
  background: rgba(255,255,255,.88) !important;
  box-shadow: 0 8px 30px rgba(15,23,42,.04) !important;
  backdrop-filter: blur(18px) saturate(150%);
}
.header-inner {
  width: min(1200px, calc(100% - 2rem)) !important;
  min-height: 76px !important;
  margin: 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 1rem !important;
}
.header-brand { display: inline-flex; align-items: center; text-decoration: none; flex: 0 0 auto; }
.header-logo {
  width: clamp(154px, 17vw, 205px) !important;
  max-height: 58px;
  object-fit: contain;
  border-radius: 10px;
}
.site-nav, .header-nav {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
  gap: .35rem !important;
}
.site-nav a, .header-nav a {
  min-height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: .62rem .82rem !important;
  border-radius: 12px !important;
  color: #34445e !important;
  font-size: .92rem !important;
  font-weight: 750 !important;
  text-decoration: none !important;
  transition: background .18s ease, color .18s ease, transform .18s ease;
}
.site-nav a:hover, .site-nav a:focus-visible, .site-nav a[aria-current="page"],
.header-nav a:hover, .header-nav a:focus-visible, .header-nav a[aria-current="page"] {
  background: var(--im-primary-soft) !important;
  color: var(--im-primary) !important;
  outline: none !important;
}
.site-nav .nav-account, .header-nav .nav-account {
  border: 1px solid #c7d2fe !important;
  background: #eef2ff !important;
  color: var(--im-primary) !important;
  font-weight: 800 !important;
}
.site-nav .nav-account:hover, .site-nav .nav-account:focus-visible,
.header-nav .nav-account:hover, .header-nav .nav-account:focus-visible {
  border-color: #a5b4fc !important;
  background: #e0e7ff !important;
  color: var(--im-primary-dark) !important;
  transform: translateY(-1px);
}

.site-nav .nav-login, .header-nav .nav-login {
  border: 1px solid transparent !important;
  background: linear-gradient(135deg, var(--im-primary), #6366f1) !important;
  color: #fff !important;
  box-shadow: 0 8px 20px rgba(79,70,229,.18);
}
.site-nav .nav-login:hover, .site-nav .nav-login:focus-visible,
.header-nav .nav-login:hover, .header-nav .nav-login:focus-visible {
  background: linear-gradient(135deg, var(--im-primary-dark), var(--im-primary)) !important;
  color: #fff !important;
  transform: translateY(-1px);
}
.contact-nav-item { display: flex; align-items: center; gap: .15rem; }
.contact-email { display: none !important; }

.site-footer {
  margin-top: auto;
  border-top: 1px solid var(--im-line) !important;
  background: rgba(255,255,255,.82) !important;
}
.footer-inner {
  width: min(1200px, calc(100% - 2rem)) !important;
  margin: 0 auto !important;
  padding: 1.7rem 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 1.4rem !important;
}
.footer-logo { width: 145px !important; max-height: 52px; object-fit: contain; }
.footer-copy { color: var(--im-muted) !important; font-size: .82rem !important; line-height: 1.5 !important; }
.footer-copy strong { color: var(--im-ink) !important; }
.footer-links { display: flex !important; flex-wrap: wrap !important; align-items: center !important; justify-content: flex-end !important; gap: .35rem .75rem !important; }
.footer-links a { color: #526176 !important; font-size: .85rem !important; font-weight: 700 !important; text-decoration: none !important; }
.footer-links a:hover { color: var(--im-primary) !important; }
.footer-contact-item { display: contents; }
.footer-email { color: var(--im-primary) !important; }

.skip-link {
  position: fixed !important;
  top: -5rem !important;
  left: 1rem !important;
  z-index: 1000 !important;
  padding: .75rem 1rem !important;
  border-radius: 12px !important;
  background: var(--im-ink) !important;
  color: #fff !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}
.skip-link:focus { top: 1rem !important; }

/* New marketing/home pages */
.marketing-shell, .curriculum-hub {
  width: min(1200px, calc(100% - 2rem));
  margin: 0 auto;
  padding: clamp(2rem, 5vw, 4.5rem) 0 4rem;
}
.hero-grid {
  display: grid;
  grid-template-columns: minmax(0,1.15fr) minmax(340px,.85fr);
  gap: clamp(1.3rem, 3vw, 2.4rem);
  align-items: center;
}
.hero-copy-panel { padding: clamp(.25rem, 1vw, 1rem) 0; }
.eyebrow-modern {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  margin: 0 0 1rem;
  padding: .48rem .78rem;
  border: 1px solid #c7d2fe;
  border-radius: 999px;
  background: rgba(238,242,255,.88);
  color: var(--im-primary-dark);
  font-size: .78rem;
  font-weight: 850;
  letter-spacing: .045em;
  text-transform: uppercase;
}
.eyebrow-modern::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 0 4px rgba(34,197,94,.12); }
.hero-title-modern {
  margin: 0;
  max-width: 800px;
  color: var(--im-ink);
  font-size: clamp(2.65rem, 6vw, 5.3rem);
  line-height: .98;
  letter-spacing: -.058em;
  font-weight: 850;
}
.hero-title-modern span { color: var(--im-primary); }
.hero-lead-modern {
  max-width: 710px;
  margin: 1.3rem 0 0;
  color: #526176;
  font-size: clamp(1.05rem, 1.8vw, 1.24rem);
  line-height: 1.68;
}
.hero-actions-modern { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.6rem; }
.btn-modern {
  min-height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  padding: .78rem 1.15rem;
  border: 1px solid var(--im-line);
  border-radius: 14px;
  background: #fff;
  color: var(--im-ink);
  box-shadow: var(--im-shadow-sm);
  font-weight: 800;
  text-decoration: none;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.btn-modern:hover, .btn-modern:focus-visible { transform: translateY(-2px); box-shadow: var(--im-shadow); outline: none; }
.btn-modern.primary { border-color: transparent; background: linear-gradient(135deg, var(--im-primary), #6366f1); color: #fff; box-shadow: 0 12px 26px rgba(79,70,229,.23); }
.btn-modern.primary:hover { box-shadow: 0 16px 32px rgba(79,70,229,.28); }

.hero-visual-card {
  position: relative;
  overflow: hidden;
  min-height: 440px;
  padding: 1.2rem;
  border: 1px solid rgba(199,210,254,.8);
  border-radius: var(--im-radius-lg);
  background: linear-gradient(150deg, rgba(255,255,255,.95), rgba(238,242,255,.88));
  box-shadow: var(--im-shadow);
}
.hero-visual-card::before {
  content: "";
  position: absolute;
  width: 240px; height: 240px;
  top: -90px; right: -65px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(34,211,238,.32), rgba(34,211,238,0));
}
.visual-toolbar { display: flex; justify-content: space-between; align-items: center; gap: .6rem; padding: .35rem .25rem 1rem; }
.visual-toolbar strong { color: var(--im-ink); font-size: .95rem; }
.live-pill { padding: .35rem .62rem; border-radius: 999px; background: #dcfce7; color: #166534; font-size: .73rem; font-weight: 850; }
.visual-year-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: .65rem; }
.visual-year {
  min-height: 84px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(226,232,240,.9);
  border-radius: 18px;
  background: rgba(255,255,255,.92);
  color: var(--im-primary-dark);
  font-size: 1.7rem;
  font-weight: 850;
  box-shadow: 0 7px 18px rgba(15,23,42,.05);
}
.visual-year:nth-child(2n) { color: var(--im-cyan); }
.visual-year:nth-child(3n) { color: var(--im-teal); }
.visual-progress { margin-top: .8rem; padding: 1rem; border-radius: 20px; background: #fff; box-shadow: var(--im-shadow-sm); }
.visual-progress-head { display:flex; justify-content:space-between; gap:1rem; color:var(--im-ink); font-size:.85rem; font-weight:800; }
.progress-track { height: 9px; margin-top: .7rem; overflow:hidden; border-radius:999px; background:#eef2f7; }
.progress-track span { display:block; width:72%; height:100%; border-radius:inherit; background:linear-gradient(90deg,#22c55e,#06b6d4); }
.mini-lesson-card { margin-top:.75rem; display:flex; align-items:center; gap:.8rem; padding:.9rem; border:1px solid var(--im-line); border-radius:18px; background:rgba(255,255,255,.95); }
.mini-number { width:42px; height:42px; display:grid; place-items:center; flex:0 0 auto; border-radius:13px; background:var(--im-primary-soft); color:var(--im-primary); font-weight:900; }
.mini-copy strong { display:block; color:var(--im-ink); font-size:.88rem; }
.mini-copy span { display:block; margin-top:.15rem; color:var(--im-muted); font-size:.75rem; }

.stats-strip { margin-top: 2rem; display: grid; grid-template-columns: repeat(3,1fr); gap: .8rem; }
.stat-modern { padding: 1rem 1.1rem; border:1px solid var(--im-line); border-radius:18px; background:rgba(255,255,255,.82); box-shadow:var(--im-shadow-sm); }
.stat-modern strong { display:block; color:var(--im-ink); font-size:1.45rem; letter-spacing:-.03em; }
.stat-modern span { color:var(--im-muted); font-size:.82rem; font-weight:650; }

.section-modern { margin-top: clamp(3.2rem, 7vw, 5.2rem); }
.section-heading-modern { max-width: 720px; margin-bottom: 1.4rem; }
.section-kicker-modern { margin:0 0 .4rem; color:var(--im-primary); font-size:.78rem; font-weight:900; letter-spacing:.07em; text-transform:uppercase; }
.section-heading-modern h2 { margin:0; color:var(--im-ink); font-size:clamp(1.85rem,3vw,2.65rem); letter-spacing:-.035em; }
.section-heading-modern p { margin:.55rem 0 0; color:var(--im-muted); line-height:1.65; }
.feature-grid-modern { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.feature-card-modern { padding:1.35rem; border:1px solid var(--im-line); border-radius:22px; background:rgba(255,255,255,.9); box-shadow:var(--im-shadow-sm); }
.feature-icon-modern { width:46px;height:46px;display:grid;place-items:center;border-radius:14px;background:var(--im-primary-soft);color:var(--im-primary);font-size:1.25rem;font-weight:900; }
.feature-card-modern:nth-child(2) .feature-icon-modern { background:var(--im-cyan-soft);color:var(--im-cyan); }
.feature-card-modern:nth-child(3) .feature-icon-modern { background:#ecfdf5;color:var(--im-teal); }
.feature-card-modern h3 { margin:.9rem 0 .35rem;color:var(--im-ink);font-size:1.06rem; }
.feature-card-modern p { margin:0;color:var(--im-muted);font-size:.9rem;line-height:1.6; }

.role-grid-modern { display:grid;grid-template-columns:repeat(4,1fr);gap:1rem; }
.role-card-modern { position:relative;min-height:170px;padding:1.3rem;border:1px solid var(--im-line);border-radius:22px;background:#fff;box-shadow:var(--im-shadow-sm);text-decoration:none;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease; }
.role-card-modern:hover { transform:translateY(-3px);box-shadow:var(--im-shadow-hover);border-color:#c7d2fe; }
.role-label-modern { display:inline-block;padding:.34rem .55rem;border-radius:999px;background:#f1f5f9;color:#64748b;font-size:.68rem;font-weight:900;letter-spacing:.055em; }
.role-card-modern h3 { margin:.9rem 0 .35rem;color:var(--im-ink);font-size:1.14rem; }
.role-card-modern p { margin:0;color:var(--im-muted);font-size:.86rem;line-height:1.55; }
.role-arrow-modern { position:absolute;right:1.15rem;bottom:1rem;color:var(--im-primary);font-size:1.25rem;font-weight:900; }

.cta-modern { margin-top:4rem;padding:clamp(1.5rem,4vw,2.5rem);display:flex;align-items:center;justify-content:space-between;gap:1.4rem;border:1px solid #c7d2fe;border-radius:28px;background:linear-gradient(135deg,#eef2ff 0%,#ecfeff 100%); }
.cta-modern h2 { margin:0;color:var(--im-ink);font-size:clamp(1.55rem,3vw,2.2rem);letter-spacing:-.03em; }
.cta-modern p { margin:.4rem 0 0;color:var(--im-muted); }

/* Curriculum hub */
.hub-hero { max-width:880px; margin:0 auto 2.3rem; text-align:center; }
.hub-hero .eyebrow-modern { margin-left:auto;margin-right:auto; }
.hub-hero h1 { margin:0;color:var(--im-ink);font-size:clamp(2.45rem,5.5vw,4.6rem);line-height:1.02;letter-spacing:-.055em; }
.hub-hero h1 span { color:var(--im-primary); }
.hub-hero p { max-width:720px;margin:1rem auto 0;color:var(--im-muted);font-size:1.05rem;line-height:1.7; }
.year-grid-modern { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem; }
.year-card-modern { position:relative;min-height:210px;display:grid;grid-template-columns:90px 1fr;gap:1rem;padding:1.3rem;border:1px solid var(--im-line);border-radius:24px;background:rgba(255,255,255,.94);box-shadow:var(--im-shadow-sm);text-decoration:none;overflow:hidden;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease; }
.year-card-modern:hover,.year-card-modern:focus-visible { transform:translateY(-4px);box-shadow:var(--im-shadow-hover);border-color:#c7d2fe;outline:none; }
.year-card-modern::after { content:"→";position:absolute;right:1.25rem;bottom:1.05rem;color:var(--im-primary);font-size:1.2rem;font-weight:900; }
.year-badge-modern { width:78px;height:78px;display:grid;place-items:center;border-radius:22px;background:linear-gradient(145deg,var(--im-primary-soft),#e0e7ff);color:var(--im-primary);font-size:2.2rem;font-weight:900;letter-spacing:-.05em; }
.year-card-modern:nth-child(2n) .year-badge-modern { background:linear-gradient(145deg,#ecfeff,#cffafe);color:var(--im-cyan); }
.year-card-modern:nth-child(3n) .year-badge-modern { background:linear-gradient(145deg,#ecfdf5,#d1fae5);color:var(--im-teal); }
.year-card-copy-modern h2 { margin:.15rem 0 .35rem;color:var(--im-ink);font-size:1.28rem;letter-spacing:-.02em; }
.year-card-copy-modern p { margin:0;color:var(--im-muted);font-size:.88rem;line-height:1.55; }
.year-meta-modern { display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.8rem;padding-right:2rem; }
.year-meta-modern span { padding:.3rem .48rem;border-radius:999px;background:#f8fafc;color:#64748b;font-size:.68rem;font-weight:800; }
.year-access-modern { margin-top:.7rem;color:var(--im-primary);font-size:.75rem;font-weight:850; }
.hub-note-modern { margin-top:1rem;padding:1rem 1.1rem;border:1px solid #dbeafe;border-radius:18px;background:rgba(239,246,255,.7);color:#526176;font-size:.88rem;line-height:1.55; }

/* Existing Year 0–6 curriculum pages */
.year-shell, .page-shell {
  width: min(1200px, calc(100% - 2rem)) !important;
  margin: 0 auto !important;
  padding: 1.5rem 0 3.5rem !important;
}
.breadcrumbs { margin-bottom:1rem !important;color:#8090a5 !important;font-size:.78rem !important;font-weight:750 !important; }
.breadcrumbs a { color:var(--im-primary) !important;text-decoration:none !important; }
.card, .year-hero, .lesson-panel, .overview-card {
  border-color: var(--im-line) !important;
  border-radius: 22px !important;
  background: rgba(255,255,255,.94) !important;
  box-shadow: var(--im-shadow-sm) !important;
}
.year-hero { position:relative;overflow:hidden;padding:clamp(1.45rem,3.5vw,2.5rem) !important;border-radius:28px !important; }
.year-hero::after { content:"";position:absolute;width:250px;height:250px;right:-100px;top:-110px;border-radius:50%;background:radial-gradient(circle,rgba(99,102,241,.15),rgba(99,102,241,0));pointer-events:none; }
.year-eyebrow, .section-label { color:var(--im-primary) !important;letter-spacing:.07em !important;font-weight:900 !important; }
.year-hero h1, .overview-header h1 { color:var(--im-ink) !important;letter-spacing:-.04em !important; }
.year-hero p, .overview-header p { color:var(--im-muted) !important; }
.year-hero-actions a { border-radius:13px !important;font-weight:800 !important; }
.overview-grid { gap:.8rem !important; }
.overview-card { min-height:112px !important; }
.overview-number { color:var(--im-primary) !important; }
.learning-area-section { margin-top:1.9rem !important; }
.section-heading h2 { color:var(--im-ink) !important;letter-spacing:-.025em !important; }
.section-heading > p { color:var(--im-muted) !important; }
.area-selector { gap:.65rem !important; }
.area-tab, .filter-button, .area-button {
  border:1px solid var(--im-line) !important;
  border-radius:15px !important;
  background:#fff !important;
  color:#42536d !important;
  box-shadow:0 5px 15px rgba(15,23,42,.04) !important;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,background .16s ease !important;
}
.area-tab:hover, .filter-button:hover, .area-button:hover { transform:translateY(-2px) !important;box-shadow:var(--im-shadow-sm) !important;border-color:#c7d2fe !important; }
.area-tab.active, .area-tab[aria-selected="true"], .filter-button.active, .area-button[aria-expanded="true"] {
  border-color:#c7d2fe !important;
  background:var(--im-primary-soft) !important;
  color:var(--im-primary-dark) !important;
  box-shadow:0 8px 18px rgba(79,70,229,.09) !important;
}
.area-symbol { filter:saturate(.85); }
.lesson-panel { margin-top:1rem !important;padding:clamp(1rem,2.5vw,1.5rem) !important; }
.lesson-panel-heading h2 { color:var(--im-ink) !important; }
.lesson-count { background:var(--im-primary-soft) !important;color:var(--im-primary) !important;border-radius:999px !important;font-weight:850 !important; }
.lesson-grid { gap:.7rem !important; }
.lesson-button, .lesson-card, .lesson-link {
  border:1px solid var(--im-line) !important;
  border-radius:16px !important;
  background:#fff !important;
  box-shadow:0 5px 16px rgba(15,23,42,.045) !important;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease !important;
}
.lesson-button:hover, .lesson-card:hover, .lesson-link:hover { transform:translateY(-2px) !important;border-color:#c7d2fe !important;box-shadow:0 12px 25px rgba(79,70,229,.10) !important; }
.lesson-number, .lesson-index { background:var(--im-primary-soft) !important;color:var(--im-primary) !important; }
.lesson-search { border:1px solid var(--im-line) !important;border-radius:15px !important;box-shadow:0 4px 12px rgba(15,23,42,.03) !important; }
.lesson-browser { border-color:var(--im-line) !important;border-radius:22px !important;background:rgba(255,255,255,.88) !important; }
.bottom-navigation a, .year-navigation a, .year-nav-card { border-radius:16px !important;border-color:var(--im-line) !important;background:#fff !important;box-shadow:var(--im-shadow-sm) !important; }

/* Year 2's older layout */
.page-shell .year-pill { border:1px solid #c7d2fe !important;border-radius:999px !important;background:var(--im-primary-soft) !important;color:var(--im-primary-dark) !important;box-shadow:none !important; }
.page-shell .area-buttons { gap:.7rem !important; }
.page-shell .area-button { min-height:64px !important; }
.page-shell .area-button.algebra { width:auto !important; }
.page-shell .lesson-selector { border:1px solid var(--im-line) !important;border-radius:22px !important;background:#fff !important;box-shadow:var(--im-shadow) !important; }
.page-shell .curriculum-area { border:1px solid var(--im-line) !important;border-radius:22px !important;background:rgba(255,255,255,.94) !important;box-shadow:var(--im-shadow-sm) !important; }
.page-shell .topic-tag { border-radius:999px !important;background:#f8fafc !important;color:#64748b !important; }


@media (max-width: 900px) {
  .hero-grid { grid-template-columns:1fr; }
  .hero-visual-card { min-height:auto; }
  .feature-grid-modern,.role-grid-modern { grid-template-columns:1fr; }
  .year-grid-modern { grid-template-columns:1fr; }
  .cta-modern { align-items:flex-start;flex-direction:column; }
  .footer-inner { align-items:flex-start !important;flex-direction:column !important; }
  .footer-links { justify-content:flex-start !important; }
}
@media (max-width: 720px) {
  .header-inner { min-height:68px !important;align-items:flex-start !important;padding:.55rem 0 !important;flex-direction:column !important; }
  .header-logo { width:150px !important; }
  .site-nav,.header-nav { width:100%;justify-content:flex-start !important;overflow-x:auto;flex-wrap:nowrap !important;padding-bottom:.15rem;scrollbar-width:none; }
  .site-nav::-webkit-scrollbar,.header-nav::-webkit-scrollbar { display:none; }
  .site-nav a,.header-nav a { flex:0 0 auto;min-height:39px !important;padding:.5rem .68rem !important;font-size:.82rem !important; }
  .marketing-shell,.curriculum-hub,.year-shell,.page-shell { width:min(100% - 1.15rem,1200px) !important;padding-top:1.2rem !important; }
  .hero-title-modern { font-size:clamp(2.45rem,14vw,4rem); }
  .visual-year-grid { grid-template-columns:repeat(4,1fr);gap:.4rem; }
  .visual-year { min-height:68px;border-radius:15px;font-size:1.4rem; }
  .stats-strip { grid-template-columns:1fr; }
  .year-card-modern { grid-template-columns:66px 1fr;padding:1rem;min-height:190px; }
  .year-badge-modern { width:60px;height:60px;border-radius:18px;font-size:1.65rem; }
}
@media (max-width: 520px) {
  .visual-year-grid { grid-template-columns:repeat(2,1fr); }
  .hero-actions-modern .btn-modern { width:100%; }
  .year-card-modern { display:block; }
  .year-badge-modern { margin-bottom:.85rem; }
}

/* Year 2 dynamically-created lesson buttons */
.linked-lessons-grid { gap: .7rem !important; }
.linked-lesson {
  border: 1px solid var(--im-line) !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: 0 5px 16px rgba(15,23,42,.045) !important;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease !important;
}
.linked-lesson:hover, .linked-lesson:focus-visible {
  transform: translateY(-2px) !important;
  border-color: #c7d2fe !important;
  box-shadow: 0 12px 25px rgba(79,70,229,.10) !important;
  outline: none !important;
}
.linked-lesson-number { color: var(--im-primary) !important; }
.linked-lesson-title { color: var(--im-ink) !important; }
.linked-lesson-number-pill { border-radius: 999px !important; }
.linked-lesson-open { color: var(--im-primary) !important; }

@media (min-width: 901px) and (max-width: 1050px) { .role-grid-modern { grid-template-columns: repeat(2, 1fr); } }


/* International positioning */
.international-section { position:relative; }
.international-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem; }
.international-card { padding:1.35rem;border:1px solid var(--im-line);border-radius:22px;background:linear-gradient(180deg,#fff,#f8fafc);box-shadow:var(--im-shadow-sm); }
.international-mark { width:40px;height:40px;display:grid;place-items:center;margin-bottom:.85rem;border-radius:13px;background:#ecfeff;color:#0f766e;font-weight:900;font-size:.78rem; }
.international-card h3 { margin:0;color:var(--im-ink);font-size:1.05rem;letter-spacing:-.02em; }
.international-card p { margin:.5rem 0 0;color:var(--im-muted);font-size:.86rem;line-height:1.65; }
.global-pathway-panel { margin:0 0 1.3rem;padding:clamp(1.2rem,3vw,1.8rem);border:1px solid #dbe4f2;border-radius:26px;background:linear-gradient(135deg,#f8fafc,#eef2ff);box-shadow:var(--im-shadow-sm); }
.global-pathway-copy { max-width:820px; }
.global-pathway-copy h2 { margin:.15rem 0 0;color:var(--im-ink);font-size:clamp(1.45rem,3vw,2.05rem);letter-spacing:-.035em; }
.global-pathway-copy p { margin:.55rem 0 0;color:var(--im-muted);line-height:1.65; }
.region-chip-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem;margin-top:1.15rem; }
.region-chip { padding:.8rem .9rem;border:1px solid #dde5f0;border-radius:15px;background:rgba(255,255,255,.9); }
.region-chip strong { display:block;color:var(--im-ink);font-size:.82rem; }
.region-chip span { display:block;margin-top:.2rem;color:var(--im-muted);font-size:.72rem;line-height:1.4; }
.global-pathway-note { margin-top:.9rem;padding:.8rem .9rem;border-radius:14px;background:#fff7ed;color:#7c5a34;font-size:.78rem;line-height:1.55;border:1px solid #fed7aa; }
.global-pathway-note strong { color:#6b4f2d; }
@media (max-width:900px){.international-grid{grid-template-columns:1fr}.region-chip-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.region-chip-grid{grid-template-columns:1fr}}

/* Pricing & subscription */
.pricing-page { padding-bottom: 5rem; }
.pricing-hero { max-width: 900px; }
.pricing-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; align-items:stretch; }
.pricing-card { position:relative; display:flex; flex-direction:column; padding:1.55rem; border:1px solid var(--im-line); border-radius:26px; background:#fff; box-shadow:var(--im-shadow-sm); }
.pricing-card.featured { border-color:#a5b4fc; box-shadow:0 18px 48px rgba(79,70,229,.13); }
.pricing-badge { position:absolute; right:1rem; top:1rem; padding:.38rem .62rem; border-radius:999px; background:#eef2ff; color:var(--im-primary); font-size:.7rem; font-weight:900; }
.pricing-label { color:var(--im-primary); font-size:.72rem; font-weight:900; letter-spacing:.08em; }
.pricing-top h2 { margin:.35rem 0 .3rem; color:var(--im-ink); font-size:1.55rem; }
.pricing-top p { margin:0; color:var(--im-muted); line-height:1.55; }
.pricing-price { display:flex; align-items:baseline; gap:.45rem; margin:1.3rem 0 1rem; color:var(--im-ink); }
.pricing-price strong { font-size:2.15rem; letter-spacing:-.04em; }
.pricing-price span { color:var(--im-muted); font-weight:700; }
.pricing-features { margin:.2rem 0 1.35rem; padding:0; list-style:none; display:grid; gap:.62rem; color:#526176; }
.pricing-features li { display:flex; gap:.55rem; align-items:flex-start; }
.pricing-features li::before { content:'✓'; color:#16a34a; font-weight:900; }
.pricing-button { width:100%; margin-top:auto; }
.family-picker,.classroom-picker { display:grid; gap:.4rem; margin:.15rem 0 1rem; color:var(--im-ink); font-size:.82rem; font-weight:800; }
.family-picker select,.classroom-picker select { min-height:48px; padding:.65rem .8rem; border:1px solid var(--im-line); border-radius:12px; background:#fff; color:var(--im-ink); font:inherit; }
.school-quote-card { background:linear-gradient(145deg,#f8fafc,#eef2ff); }
.school-quote-card .pricing-price strong { font-size:1.55rem; }
.pricing-note-card { margin-top:1rem; padding:1.3rem 1.45rem; border:1px solid #dbeafe; border-radius:22px; background:#f8fbff; }
.pricing-note-card h2 { margin:0 0 .35rem; font-size:1.1rem; color:var(--im-ink); }
.pricing-note-card p { margin:0; color:var(--im-muted); line-height:1.65; }
.checkout-message { margin:0 0 1rem; padding:1rem 1.1rem; border:1px solid #fde68a; border-radius:16px; background:#fffbeb; color:#92400e; font-weight:750; }
.checkout-shell,.success-shell { min-height:70vh; display:grid; place-items:center; padding-top:2rem; padding-bottom:4rem; }
.checkout-card,.setup-card { width:min(720px,100%); padding:clamp(1.4rem,4vw,2.3rem); border:1px solid var(--im-line); border-radius:28px; background:#fff; box-shadow:var(--im-shadow); }
.checkout-copy h1,.setup-card h1 { margin:.35rem 0 .7rem; color:var(--im-ink); font-size:clamp(2rem,5vw,3rem); letter-spacing:-.045em; line-height:1.03; }
.checkout-copy>p,.setup-intro,.setup-state p,.account-ready>p { color:var(--im-muted); line-height:1.65; }
.selected-plan { margin:1.4rem 0; display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:1.15rem; border:1px solid #c7d2fe; border-radius:18px; background:#f8faff; }
.selected-plan>div:first-child { display:grid; gap:.2rem; }
.selected-plan-label { color:var(--im-primary); font-size:.68rem; font-weight:900; text-transform:uppercase; letter-spacing:.06em; }
.selected-plan strong { color:var(--im-ink); font-size:1.08rem; }
.selected-plan small { color:var(--im-muted); }
.selected-plan-price { color:var(--im-ink); font-size:1.15rem; font-weight:900; text-align:right; }
.checkout-security { display:flex; gap:.8rem; padding:1rem; border-radius:16px; background:#f8fafc; color:var(--im-ink); }
.checkout-security>span { font-size:1.25rem; }
.checkout-security strong { display:block; }
.checkout-security p { margin:.2rem 0 0; color:var(--im-muted); font-size:.84rem; line-height:1.5; }
.checkout-primary { width:100%; margin-top:1.2rem; border:0; cursor:pointer; font:inherit; }
.checkout-primary:disabled { opacity:.6; cursor:wait; transform:none; }
.checkout-back { display:block; margin-top:1rem; color:var(--im-primary); text-align:center; text-decoration:none; font-weight:800; }
.checkout-error { margin-top:1rem; padding:.85rem 1rem; border:1px solid #fecaca; border-radius:14px; background:#fff1f2; color:#b91c1c; font-weight:750; }
.setup-state { text-align:center; padding:1rem 0; }
.setup-spinner { width:46px; height:46px; margin:0 auto 1rem; border:4px solid #e0e7ff; border-top-color:var(--im-primary); border-radius:50%; animation:setup-spin .8s linear infinite; }
@keyframes setup-spin { to { transform:rotate(360deg); } }
.purchase-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:.65rem; margin:1.2rem 0; }
.purchase-summary>div { padding:.8rem; border:1px solid var(--im-line); border-radius:14px; background:#f8fafc; }
.purchase-summary span { display:block; color:var(--im-muted); font-size:.72rem; font-weight:800; }
.purchase-summary strong { display:block; margin-top:.25rem; color:var(--im-ink); font-size:.88rem; overflow-wrap:anywhere; }
.subscription-form { display:grid; gap:.9rem; }
.subscription-form label { display:grid; gap:.38rem; color:var(--im-ink); font-size:.84rem; font-weight:800; }
.subscription-form input { min-height:50px; padding:.7rem .82rem; border:1px solid var(--im-line); border-radius:12px; color:var(--im-ink); font:inherit; }
.subscription-form input:focus { outline:3px solid #e0e7ff; border-color:#818cf8; }
.form-help-modern { margin:0; color:var(--im-muted); font-size:.8rem; line-height:1.5; }
.account-ready { text-align:center; }
.success-mark { width:62px; height:62px; margin:0 auto 1rem; display:grid; place-items:center; border-radius:50%; background:#dcfce7; color:#15803d; font-size:2rem; font-weight:900; }
.login-result { max-width:420px; margin:1.2rem auto; padding:1.1rem; border:1px solid #bbf7d0; border-radius:18px; background:#f0fdf4; }
.login-result span { display:block; color:#166534; font-size:.72rem; font-weight:900; text-transform:uppercase; }
.login-result strong { display:block; margin-top:.3rem; color:#14532d; font-size:1.7rem; letter-spacing:.03em; }
.ready-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:.7rem; }
.ready-actions button { cursor:pointer; font:inherit; }
@media(max-width:760px){ .pricing-grid{grid-template-columns:1fr}.selected-plan{align-items:flex-start;flex-direction:column}.selected-plan-price{text-align:left}.purchase-summary{grid-template-columns:1fr}.ready-actions{flex-direction:column}.ready-actions>*{width:100%} }


/* Home page — mathematical visual identity */
.home-maths .marketing-shell { position: relative; }
.home-maths .math-hero {
  position: relative; isolation: isolate; padding: clamp(1.2rem, 3vw, 2.2rem);
  border: 1px solid rgba(199,210,254,.7); border-radius: 34px;
  background: linear-gradient(rgba(79,70,229,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(79,70,229,.045) 1px, transparent 1px), linear-gradient(145deg, rgba(255,255,255,.96), rgba(248,250,255,.92));
  background-size: 28px 28px, 28px 28px, auto; box-shadow: 0 24px 65px rgba(31,41,55,.08); overflow: hidden;
}
.home-maths .math-hero::after { content:""; position:absolute; width:360px; height:360px; left:-190px; bottom:-230px; border-radius:50%; background:radial-gradient(circle,rgba(34,211,238,.15),rgba(34,211,238,0) 68%); z-index:-1; }
.home-maths .hero-copy-panel,.home-maths .hero-visual-card{position:relative;z-index:2}
.home-maths .math-symbol-field{position:absolute;inset:0;z-index:0;pointer-events:none}
.home-maths .math-symbol-field span{position:absolute;display:grid;place-items:center;color:rgba(79,70,229,.12);font-weight:900;line-height:1;user-select:none}
.home-maths .math-symbol-field span:nth-child(1){left:3%;top:8%;font-size:2.5rem;transform:rotate(-10deg)}
.home-maths .math-symbol-field span:nth-child(2){left:46%;top:4%;font-size:2rem;transform:rotate(9deg)}
.home-maths .math-symbol-field span:nth-child(3){left:39%;bottom:7%;font-size:2.7rem;transform:rotate(-6deg)}
.home-maths .math-symbol-field span:nth-child(4){left:5%;bottom:10%;font-size:2.1rem;transform:rotate(7deg)}
.home-maths .math-symbol-field span:nth-child(5){left:50%;top:46%;font-size:2rem;transform:rotate(-8deg)}
.home-maths .math-symbol-field span:nth-child(6){right:3%;top:5%;font-size:2.35rem;transform:rotate(8deg)}
.home-maths .math-symbol-field span:nth-child(7){right:2%;bottom:8%;font-size:2rem;transform:rotate(-5deg)}
.home-maths .math-symbol-field span:nth-child(8){left:54%;bottom:2%;font-size:2rem;transform:rotate(6deg)}
.home-maths .hero-title-modern{max-width:720px}
.home-maths .hero-title-modern span{position:relative;display:inline-block}
.home-maths .hero-title-modern span::after{content:"";position:absolute;left:.02em;right:.02em;bottom:-.08em;height:.09em;border-radius:999px;background:linear-gradient(90deg,#22c55e,#06b6d4,#6366f1);opacity:.7}
.home-maths .math-showcase{min-height:500px;padding:1.1rem;background:linear-gradient(rgba(99,102,241,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(99,102,241,.04) 1px,transparent 1px),linear-gradient(155deg,#fff,#eef2ff 72%,#ecfeff);background-size:22px 22px,22px 22px,auto}
.home-maths .math-showcase::before{width:285px;height:285px;top:-120px;right:-80px}
.home-maths .math-equation-card{min-height:90px;display:flex;align-items:center;justify-content:center;gap:clamp(.45rem,2vw,.85rem);padding:.9rem;border:1px solid #dbe4f2;border-radius:22px;background:rgba(255,255,255,.96);box-shadow:0 9px 22px rgba(15,23,42,.06)}
.home-maths .math-equation-card span{font-weight:900;line-height:1}.home-maths .equation-number{color:var(--im-ink);font-size:clamp(2rem,5vw,3rem)}.home-maths .equation-sign{color:var(--im-cyan);font-size:clamp(1.7rem,4vw,2.45rem)}
.home-maths .equation-answer{min-width:64px;min-height:64px;display:grid;place-items:center;padding:.2rem .55rem;border-radius:18px;background:linear-gradient(145deg,#dcfce7,#d1fae5);color:#166534;font-size:clamp(2rem,5vw,2.8rem);box-shadow:inset 0 0 0 1px rgba(22,101,52,.08)}
.home-maths .math-numberline-card{margin-top:.72rem;padding:.8rem .9rem 1rem;border:1px solid var(--im-line);border-radius:19px;background:rgba(255,255,255,.95)}
.home-maths .math-card-label{display:block;color:#718096;font-size:.62rem;font-weight:900;letter-spacing:.09em}
.home-maths .home-number-line{position:relative;height:55px;margin:10px 4px 0}.home-maths .home-number-line .line-rule{position:absolute;left:1.5%;right:1.5%;top:22px;height:4px;border-radius:99px;background:#7c8da6}
.home-maths .number-tick{position:absolute;left:calc(var(--i)*9.7%);top:16px;width:14px;height:14px;margin-left:-7px;border:3px solid #fff;border-radius:50%;background:#64748b;box-shadow:0 0 0 1px #64748b}
.home-maths .number-tick b{position:absolute;top:19px;left:50%;transform:translateX(-50%);color:#526176;font-size:.66rem;font-weight:800}.home-maths .number-tick.active{background:#4f46e5;box-shadow:0 0 0 1px #4f46e5,0 0 0 5px rgba(79,70,229,.10)}.home-maths .number-tick.active b{color:#3730a3}
.home-maths .math-mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:.72rem;margin-top:.72rem}.home-maths .math-concept-card{min-height:116px;padding:.78rem;border:1px solid var(--im-line);border-radius:18px;background:rgba(255,255,255,.95)}
.home-maths .fraction-card{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto 1fr;column-gap:.7rem;align-items:center}.home-maths .fraction-card .math-card-label{grid-column:1/-1}.home-maths .fraction-card strong{color:var(--im-primary-dark);font-size:1.5rem}.home-maths .fraction-visual{display:grid;grid-template-columns:repeat(4,1fr);gap:3px;height:44px;margin-top:.45rem}.home-maths .fraction-visual i{min-width:20px;border-radius:7px;background:#6366f1}.home-maths .fraction-visual i.empty{border:2px solid #c7d2fe;background:#f8fafc}
.home-maths .shape-card strong{display:block;margin-top:.48rem;color:#526176;font-size:.72rem}.home-maths .shape-visual{min-height:52px;display:flex;align-items:flex-end;justify-content:center;gap:10px;margin-top:.3rem}.home-maths .triangle-shape{width:0;height:0;border-left:25px solid transparent;border-right:25px solid transparent;border-bottom:43px solid #06b6d4;filter:drop-shadow(0 4px 5px rgba(8,145,178,.13))}.home-maths .square-shape{width:39px;height:39px;border-radius:7px;background:#22c55e;transform:rotate(4deg)}.home-maths .circle-shape{width:41px;height:41px;border-radius:50%;background:#f59e0b}
.home-maths .math-pattern-card{margin-top:.72rem;min-height:57px;display:grid;grid-template-columns:auto repeat(5,1fr);align-items:center;gap:.45rem;padding:.65rem .85rem;border:1px solid var(--im-line);border-radius:18px;background:rgba(255,255,255,.96)}
.home-maths .math-pattern-card strong,.home-maths .math-pattern-card>span:not(.math-card-label),.home-maths .math-pattern-card b{display:grid;place-items:center;min-height:34px;border-radius:10px;background:#f1f5f9;color:var(--im-ink);font-size:1rem;font-weight:900}.home-maths .math-pattern-card strong{background:#eef2ff;color:var(--im-primary)}.home-maths .math-pattern-card b{background:#ecfeff;color:var(--im-cyan)}
.home-maths .math-topic-ribbon{margin-top:1rem;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:.6rem;padding:.8rem;border:1px solid var(--im-line);border-radius:22px;background:rgba(255,255,255,.82);box-shadow:var(--im-shadow-sm)}
.home-maths .math-topic{min-height:82px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3rem;padding:.55rem .35rem;border-radius:15px;background:#f8fafc;text-align:center}.home-maths .math-topic:nth-child(2n){background:#f5f3ff}.home-maths .math-topic:nth-child(3n){background:#ecfeff}.home-maths .math-topic span{color:var(--im-primary);font-size:1.2rem;font-weight:900;line-height:1}.home-maths .math-topic:nth-child(3n) span{color:var(--im-cyan)}.home-maths .math-topic strong{color:#53637b;font-size:.7rem}.home-maths .feature-icon-modern{font-size:1.45rem}
@media(max-width:900px){.home-maths .math-hero{padding:1.1rem}.home-maths .math-topic-ribbon{grid-template-columns:repeat(4,1fr)}}
@media(max-width:520px){.home-maths .math-symbol-field{opacity:.55}.home-maths .math-mini-grid{grid-template-columns:1fr}.home-maths .math-pattern-card{grid-template-columns:auto repeat(5,1fr);gap:.3rem}.home-maths .math-pattern-card .math-card-label{grid-column:1/-1}.home-maths .math-topic-ribbon{grid-template-columns:repeat(2,1fr)}.home-maths .math-topic{min-height:68px}}

/* Wider curriculum lesson cards — 2026-08-16
   Use the available horizontal space so lesson number, title, progress,
   completion status and Reset controls remain easy to read. */
.year-shell .lesson-grid,
.page-shell .linked-lessons-grid {
  width: 94% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

@media (max-width: 1100px) {
  .year-shell .lesson-grid,
  .page-shell .linked-lessons-grid {
    width: 100% !important;
  }
}


/* ============================================================
   iLearn Maths vibrant visual refresh — 2026-08-19
   Homepage matches the selected colourful mathematical direction.
   Shared rules below tidy marketing, curriculum and account shells only.
   ============================================================ */
:root{
  --im-pink:#ff1f5a;
  --im-pink-dark:#e60d49;
  --im-orange:#ff7a00;
  --im-yellow:#ffb000;
  --im-blue:#168cff;
  --im-purple:#7447e6;
  --im-green-bright:#05a86b;
  --im-navy:#0b1b3c;
}
body{
  background:
    radial-gradient(circle at 4% 0%,rgba(22,140,255,.06),transparent 25rem),
    radial-gradient(circle at 98% 6%,rgba(255,31,90,.055),transparent 24rem),
    linear-gradient(180deg,#ffffff 0%,#fbfcff 58%,#f7f9fe 100%);
}
.site-header{background:rgba(255,255,255,.94)!important;border-bottom:1px solid #edf0f6!important;box-shadow:0 6px 24px rgba(11,27,60,.045)!important}
.site-header .header-inner>a:first-child{display:inline-flex!important;align-items:center!important;gap:.55rem!important;text-decoration:none!important;min-width:max-content}
.site-header .header-inner>a:first-child::before{content:"";width:31px;height:31px;border-radius:9px;background:conic-gradient(from 0deg,var(--im-pink) 0 16%,var(--im-orange) 16% 32%,var(--im-yellow) 32% 48%,var(--im-green-bright) 48% 64%,var(--im-blue) 64% 80%,var(--im-purple) 80% 100%);box-shadow:inset 0 0 0 5px #fff,0 3px 8px rgba(11,27,60,.12)}
.site-header .header-inner>a:first-child::after{content:"iLearn Maths";color:var(--im-navy);font-size:clamp(1.18rem,2vw,1.58rem);font-weight:900;letter-spacing:-.045em;white-space:nowrap}
.site-header .header-logo{display:none!important}
.site-nav a,.header-nav a{color:#18243d!important;font-weight:800!important}
.site-nav a:hover,.site-nav a:focus-visible,.site-nav a[aria-current="page"],.header-nav a:hover,.header-nav a:focus-visible,.header-nav a[aria-current="page"]{background:#fff0f5!important;color:var(--im-pink)!important}
.site-nav .nav-account,.header-nav .nav-account{border-color:#d9cef9!important;background:#f6f2ff!important;color:#6540d6!important}
.site-nav .nav-login,.header-nav .nav-login{border-color:transparent!important;background:linear-gradient(135deg,var(--im-pink),#ff3f76)!important;color:#fff!important;box-shadow:0 9px 20px rgba(255,31,90,.20)!important}
.site-nav .nav-login:hover,.site-nav .nav-login:focus-visible,.header-nav .nav-login:hover,.header-nav .nav-login:focus-visible{background:linear-gradient(135deg,var(--im-pink-dark),var(--im-pink))!important;color:#fff!important}
.site-footer{background:#fff!important;border-top:1px solid #edf0f6!important}
.site-footer .footer-logo{display:none!important}
.site-footer .footer-inner::before{content:"iLearn Maths";color:var(--im-navy);font-weight:900;font-size:1rem;letter-spacing:-.025em;white-space:nowrap}
.btn-modern.primary{background:linear-gradient(135deg,var(--im-pink),#ff3f76)!important;box-shadow:0 12px 26px rgba(255,31,90,.20)!important}
.btn-modern.primary:hover{box-shadow:0 16px 32px rgba(255,31,90,.26)!important}
.eyebrow-modern{border-color:#ffd0df!important;background:#fff2f6!important;color:#d9144d!important}
.eyebrow-modern::before{background:var(--im-green-bright)!important}
.section-kicker-modern,.year-eyebrow,.section-label,.pricing-label{color:var(--im-pink)!important}
.hub-hero h1 span{color:var(--im-pink)!important}

/* Shared card polish */
.feature-card-modern,.role-card-modern,.year-card-modern,.pricing-card,.card,.year-hero,.lesson-panel,.overview-card{border-color:#e8ebf3!important;box-shadow:0 10px 28px rgba(11,27,60,.065)!important}
.feature-card-modern:hover,.role-card-modern:hover,.year-card-modern:hover{box-shadow:0 18px 40px rgba(11,27,60,.10)!important}
.role-card-modern{border-top:4px solid #e6defd!important}
.role-card-modern:nth-child(2){border-top-color:#d9efff!important}.role-card-modern:nth-child(3){border-top-color:#d9f5e8!important}.role-card-modern:nth-child(4){border-top-color:#ffd9e5!important}
.year-card-modern{border-top:5px solid var(--im-orange)!important}.year-card-modern:nth-child(2){border-top-color:var(--im-blue)!important}.year-card-modern:nth-child(3){border-top-color:var(--im-yellow)!important}.year-card-modern:nth-child(4){border-top-color:var(--im-purple)!important}.year-card-modern:nth-child(5){border-top-color:var(--im-green-bright)!important}.year-card-modern:nth-child(6){border-top-color:var(--im-pink)!important}.year-card-modern:nth-child(7){border-top-color:#00a6a6!important}
.year-card-modern:nth-child(1) .year-badge-modern{background:#fff3e9!important;color:#ee6900!important}.year-card-modern:nth-child(2) .year-badge-modern{background:#eef7ff!important;color:#0a7de5!important}.year-card-modern:nth-child(3) .year-badge-modern{background:#fff9df!important;color:#b97b00!important}.year-card-modern:nth-child(4) .year-badge-modern{background:#f5f0ff!important;color:#6d3cdb!important}.year-card-modern:nth-child(5) .year-badge-modern{background:#edf9f4!important;color:#078e5b!important}.year-card-modern:nth-child(6) .year-badge-modern{background:#fff0f5!important;color:#e21b54!important}.year-card-modern:nth-child(7) .year-badge-modern{background:#edfbfb!important;color:#008c8c!important}
.area-tab.active,.area-tab[aria-selected="true"],.filter-button.active,.area-button[aria-expanded="true"]{border-color:#ffc3d5!important;background:#fff0f5!important;color:#c91048!important;box-shadow:0 8px 18px rgba(255,31,90,.08)!important}
.lesson-count{background:#fff0f5!important;color:#d9144d!important}.lesson-number,.lesson-index{background:#f5f0ff!important;color:#6840d2!important}
.cta-modern{border-color:#ffd1df!important;background:linear-gradient(135deg,#fff4f7 0%,#f4f0ff 50%,#edf8ff 100%)!important}
.pricing-card.featured{border-color:#f7aac1!important;box-shadow:0 18px 48px rgba(255,31,90,.12)!important}.pricing-badge{background:#fff0f5!important;color:#d9144d!important}.school-quote-card{background:linear-gradient(145deg,#fff,#f6f2ff)!important}

/* Accessibility helper */
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* Selected homepage design */
.vibrant-home .marketing-shell{width:min(1280px,calc(100% - 2rem));padding:clamp(1.35rem,3.5vw,3.2rem) 0 4rem}
.vibrant-hero{position:relative;display:grid;grid-template-columns:minmax(0,.9fr) minmax(430px,1.1fr);gap:1rem;align-items:center;min-height:540px;padding:clamp(1.2rem,3vw,2.6rem);overflow:hidden;border:1px solid #edf0f6;border-radius:34px;background:linear-gradient(145deg,#fff 0%,#fff 58%,#fbfcff 100%);box-shadow:0 24px 60px rgba(11,27,60,.085)}
.vibrant-hero::before,.vibrant-hero::after{content:"";position:absolute;border-radius:50%;pointer-events:none}.vibrant-hero::before{width:300px;height:300px;left:-185px;top:-165px;background:radial-gradient(circle,rgba(22,140,255,.11),transparent 68%)}.vibrant-hero::after{width:350px;height:350px;right:-195px;bottom:-210px;background:radial-gradient(circle,rgba(255,31,90,.10),transparent 68%)}
.vibrant-hero-copy{position:relative;z-index:2;padding:.6rem clamp(.2rem,1.5vw,1rem)}
.vibrant-kicker{display:inline-flex;margin:0 0 1rem;padding:.48rem .72rem;border-radius:999px;background:#f5f0ff;color:#6840d2;font-size:.78rem;font-weight:900;letter-spacing:.04em;text-transform:uppercase}
.vibrant-hero h1{margin:0;color:var(--im-navy);font-size:clamp(3rem,6.2vw,5.55rem);line-height:.94;letter-spacing:-.065em;font-weight:900}.vibrant-hero h1 span{color:var(--im-pink)}
.vibrant-lead{max-width:590px;margin:1.45rem 0 0;color:#35435f;font-size:clamp(1.05rem,1.65vw,1.28rem);line-height:1.62}
.vibrant-actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.55rem}.vibrant-button{min-height:56px;display:inline-flex;align-items:center;justify-content:center;padding:.85rem 1.3rem;border-radius:14px;font-weight:900;text-decoration:none;transition:transform .16s ease,box-shadow .16s ease}.vibrant-button:hover,.vibrant-button:focus-visible{transform:translateY(-2px);outline:none}.vibrant-button.primary{background:linear-gradient(135deg,var(--im-pink),#ff3e76);color:#fff;box-shadow:0 13px 26px rgba(255,31,90,.22)}.vibrant-button.secondary{border:1.5px solid #dfe3ec;background:#fff;color:var(--im-navy);box-shadow:0 8px 18px rgba(11,27,60,.06)}
.trial-note{display:flex;flex-wrap:wrap;gap:.55rem;margin:1rem 0 0;color:#718096;font-size:.82rem;font-weight:750}.trial-note span:first-child{color:var(--im-green-bright)}
.vibrant-hero-art{position:relative;z-index:2;min-height:465px;filter:drop-shadow(0 12px 16px rgba(11,27,60,.04))}
.hero-pie{position:absolute;width:156px;height:156px;left:35%;top:4%;border-radius:50%;background:conic-gradient(#00b89d 0 24%,#7b4ae7 24% 36%,#ff2c62 36% 62%,#ff9d00 62% 100%);border:6px solid #102047;box-shadow:0 12px 18px rgba(11,27,60,.13)}
.hero-pie::after{content:"";position:absolute;inset:8px;border-radius:50%;box-shadow:inset 0 0 0 2px rgba(255,255,255,.25)}
.hero-equation{position:absolute;left:26%;top:34%;color:#05a86b;font-size:clamp(2.7rem,5.5vw,5rem);font-weight:950;letter-spacing:-.07em;transform:rotate(-6deg);text-shadow:0 7px 0 rgba(0,111,73,.06)}
.hero-plus,.hero-times,.hero-equals{position:absolute;font-weight:950;line-height:1;text-shadow:0 6px 0 rgba(11,27,60,.05)}.hero-plus{left:72%;top:2%;color:#118cff;font-size:4.5rem;transform:rotate(4deg)}.hero-times{right:4%;top:13%;color:#ff9d00;font-size:4.7rem;transform:rotate(7deg)}.hero-equals{right:22%;top:53%;color:#7041dd;font-size:4.1rem;transform:rotate(6deg)}
.hero-fraction{position:absolute;right:14%;top:49%;display:grid;place-items:center;color:#ff6b00;font-size:3.2rem;font-weight:950;line-height:.8;transform:rotate(2deg)}.hero-fraction i{width:52px;height:6px;margin:8px 0 6px;border-radius:999px;background:#ff6b00}
.hero-cube{position:absolute;left:21%;bottom:8%;width:100px;height:100px;background:linear-gradient(135deg,#16a1ff 0 49%,#ff2760 50% 100%);transform:rotate(30deg) skewY(-8deg);border-radius:7px;box-shadow:8px 12px 16px rgba(11,27,60,.12)}.hero-cube::after{content:"";position:absolute;right:-28px;top:13px;width:42px;height:82px;background:linear-gradient(180deg,#7447e6,#5d2fc5);transform:skewY(35deg);border-radius:4px}
.hero-bars{position:absolute;left:41%;bottom:4%;height:110px;display:flex;align-items:flex-end;gap:10px}.hero-bars i{width:30px;border-radius:5px 5px 2px 2px;box-shadow:0 6px 10px rgba(11,27,60,.11)}.hero-bars i:nth-child(1){height:48px;background:#ffb000}.hero-bars i:nth-child(2){height:70px;background:#05a86b}.hero-bars i:nth-child(3){height:92px;background:#168cff}.hero-bars i:nth-child(4){height:118px;background:#7447e6}
.hero-ruler{position:absolute;right:2%;bottom:1%;width:205px;height:205px;background:#168cff;clip-path:polygon(50% 0,100% 100%,0 100%);filter:drop-shadow(0 12px 10px rgba(11,27,60,.16))}.hero-ruler::after{content:"";position:absolute;left:50%;top:32%;width:92px;height:92px;background:#fff;transform:translateX(-50%);clip-path:polygon(50% 0,100% 100%,0 100%)}
.hero-doodle{position:absolute;font-weight:900;opacity:.42}.hero-doodle.d1{left:4%;top:28%;color:#ff2e63;font-size:2rem;transform:rotate(-18deg)}.hero-doodle.d2{left:8%;top:62%;color:#1b8fff;font-size:2.4rem}.hero-doodle.d3{right:0;bottom:4%;color:#7447e6;font-size:2.2rem}.hero-doodle.d4{right:2%;top:39%;color:#8cbfff;font-size:2rem}.hero-doodle.d5{left:2%;bottom:8%;color:#64b7ff;font-size:2.1rem}.hero-doodle.d6{left:5%;top:4%;color:#ffc02c;font-size:2.6rem;transform:rotate(-10deg)}

.year-level-strip{position:relative;z-index:3;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.8rem;margin:-1.15rem auto 0;padding:1rem;border:1px solid #e8ebf3;border-radius:24px;background:#fff;box-shadow:0 16px 34px rgba(11,27,60,.09)}
.home-year{--year:#7447e6;--soft:#f5f0ff;min-width:0;display:grid;grid-template-rows:auto 76px auto;overflow:hidden;border:1.5px solid color-mix(in srgb,var(--year) 72%,white);border-radius:16px;background:#fff;text-decoration:none;box-shadow:0 7px 15px rgba(11,27,60,.055);transition:transform .16s ease,box-shadow .16s ease}.home-year:hover,.home-year:focus-visible{transform:translateY(-4px);box-shadow:0 13px 25px rgba(11,27,60,.12);outline:none}.home-year .year-top{display:grid;place-items:center;min-height:52px;background:var(--year);color:#fff;font-size:1.75rem;font-weight:950}.home-year>strong{padding:.5rem .35rem .7rem;color:var(--year);font-size:.82rem;text-align:center}.home-year.year0{--year:#7447e6;--soft:#f5f0ff}.home-year.year1{--year:#ff7a00;--soft:#fff2e7}.home-year.year2{--year:#168cff;--soft:#eef7ff}.home-year.year3{--year:#ff9f00;--soft:#fff8e7}.home-year.year4{--year:#7447e6;--soft:#f5f0ff}.home-year.year5{--year:#05a86b;--soft:#edf9f4}.home-year.year6{--year:#ff1f5a;--soft:#fff0f5}
.year-icon{display:flex;align-items:center;justify-content:center;position:relative;margin:0;background:linear-gradient(180deg,#fff,var(--soft));color:var(--year)}
.counters-icon{gap:5px;flex-wrap:wrap;padding:15px 25px}.counters-icon i{width:20px;height:20px;border-radius:50%;box-shadow:0 3px 5px rgba(11,27,60,.12)}.counters-icon i:nth-child(1){background:#ff2a60}.counters-icon i:nth-child(2){background:#ffb000}.counters-icon i:nth-child(3){background:#05a86b}.counters-icon i:nth-child(4){background:#168cff}.counters-icon i:nth-child(5){background:#7447e6}
.abacus-icon{position:relative;width:64px;height:50px;margin:auto;border:4px solid var(--year);border-radius:5px;background:#fff3e9}.abacus-icon b{position:absolute;left:8px;right:8px;height:2px;background:#bd5a00}.abacus-icon b:nth-child(1){top:12px}.abacus-icon b:nth-child(2){top:23px}.abacus-icon b:nth-child(3){top:34px}.abacus-icon i{position:absolute;width:10px;height:10px;border-radius:50%;background:#ffb000}.abacus-icon i:nth-of-type(1){left:12px;top:7px}.abacus-icon i:nth-of-type(2){left:31px;top:7px}.abacus-icon i:nth-of-type(3){left:19px;top:18px}.abacus-icon i:nth-of-type(4){left:38px;top:18px}.abacus-icon i:nth-of-type(5){left:12px;top:29px}.abacus-icon i:nth-of-type(6){left:31px;top:29px}
.clock-icon{width:58px;height:58px;margin:auto;border:5px solid var(--year);border-radius:50%;background:#fff}.clock-icon::before,.clock-icon::after{content:"";position:absolute;left:50%;top:50%;transform-origin:0 50%;border-radius:999px;background:#22304b}.clock-icon::before{width:17px;height:3px;transform:rotate(0deg)}.clock-icon::after{width:20px;height:3px;transform:rotate(-90deg)}.clock-icon b{position:absolute;inset:5px;border-radius:50%;background:radial-gradient(circle at 50% 9%,#ffb000 0 2px,transparent 3px),radial-gradient(circle at 91% 50%,#ffb000 0 2px,transparent 3px),radial-gradient(circle at 50% 91%,#ffb000 0 2px,transparent 3px),radial-gradient(circle at 9% 50%,#ffb000 0 2px,transparent 3px)}
.bars-icon{align-items:flex-end;gap:6px;padding-bottom:12px}.bars-icon i{width:16px;border-radius:3px 3px 1px 1px}.bars-icon i:nth-child(1){height:24px;background:#ff9f00}.bars-icon i:nth-child(2){height:40px;background:#ff7a00}.bars-icon i:nth-child(3){height:56px;background:#ff1f5a}
.fraction-icon{display:grid;place-items:center;font-size:1.8rem;font-weight:950;line-height:.9}.fraction-icon i{width:34px;height:4px;border-radius:99px;background:var(--year);margin:3px 0}.algebra-icon,.equals-icon{font-size:2.8rem;font-weight:950}.algebra-icon sup{font-size:.52em}.equals-icon{font-size:3.2rem}

.benefit-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:1.15rem 0 0;border:1px solid #e8ebf3;border-radius:24px;background:#fff;box-shadow:0 13px 28px rgba(11,27,60,.06);overflow:hidden}.benefit-strip article{display:grid;grid-template-columns:auto 1fr;gap:.75rem;align-items:start;padding:1.25rem}.benefit-strip article+article{border-left:1px solid #edf0f5}.benefit-icon{width:46px;height:46px;display:grid;place-items:center;border-radius:50%;font-size:1.3rem;font-weight:950}.b-purple{background:#f4efff;color:#7447e6}.b-blue{background:#eef7ff;color:#168cff}.b-green{background:#edf9f4;color:#05a86b}.b-pink{background:#fff0f5;color:#ff1f5a}.benefit-strip h2{margin:.05rem 0 .25rem;color:var(--im-navy);font-size:.98rem;line-height:1.25}.benefit-strip p{margin:0;color:#728096;font-size:.76rem;line-height:1.45}
.vibrant-section{margin-top:4rem}.section-heading-modern h2{color:var(--im-navy)!important}.feature-icon-modern.orange{background:#fff2e7!important;color:#ff7a00!important}.feature-icon-modern.blue{background:#eef7ff!important;color:#168cff!important}.feature-icon-modern.green{background:#edf9f4!important;color:#05a86b!important}.price-accent-one{border-top:4px solid #ff7a00!important}.price-accent-two{border-top:4px solid #7447e6!important}.price-accent-three{border-top:4px solid #05a86b!important}.vibrant-cta{overflow:hidden;position:relative}.vibrant-cta::after{content:"+  ×  ÷  =";position:absolute;right:1.2rem;bottom:-.55rem;color:rgba(116,71,230,.08);font-size:3.3rem;font-weight:950;letter-spacing:.12em;pointer-events:none}

@media(max-width:1050px){.vibrant-hero{grid-template-columns:1fr 1fr}.vibrant-hero-art{min-height:410px}.year-level-strip{grid-template-columns:repeat(4,1fr)}.benefit-strip{grid-template-columns:repeat(2,1fr)}.benefit-strip article:nth-child(3){border-left:0;border-top:1px solid #edf0f5}.benefit-strip article:nth-child(4){border-top:1px solid #edf0f5}}
@media(max-width:780px){.vibrant-home .marketing-shell{width:min(100% - 1rem,1280px);padding-top:.75rem}.vibrant-hero{grid-template-columns:1fr;min-height:0;padding:1.25rem}.vibrant-hero-copy{text-align:center}.vibrant-kicker{margin-left:auto;margin-right:auto}.vibrant-lead{margin-left:auto;margin-right:auto}.vibrant-actions,.trial-note{justify-content:center}.vibrant-hero-art{min-height:390px;transform:scale(.9);transform-origin:center top;margin-bottom:-35px}.year-level-strip{margin-top:.5rem;grid-template-columns:repeat(4,1fr)}.role-grid-modern{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.vibrant-hero h1{font-size:clamp(2.65rem,14vw,4rem)}.vibrant-hero-art{min-height:335px;transform:scale(.76);margin:-10px -60px -70px}.year-level-strip{grid-template-columns:repeat(2,1fr);padding:.75rem;gap:.65rem}.home-year{grid-template-rows:auto 68px auto}.benefit-strip{grid-template-columns:1fr}.benefit-strip article+article,.benefit-strip article:nth-child(3),.benefit-strip article:nth-child(4){border-left:0;border-top:1px solid #edf0f5}.role-grid-modern{grid-template-columns:1fr}.vibrant-button{width:100%}}

/* ============================================================
   Modern curriculum lesson buttons — Years 0–6 — 2026-08-19
   Scope: curriculum index pages only. Lesson files are untouched.
   Stronger contrast keeps lesson choices distinct from page panels.
   ============================================================ */
.modern-lesson-buttons{
  --curriculum-accent:#7447e6;
  --curriculum-accent-dark:#5630b8;
  --curriculum-soft:#f5f0ff;
  --curriculum-border:#cfc1f5;
}
/* Muted curriculum palette: lower saturation while keeping year-level identity and accessible contrast. */
.modern-lesson-buttons.year0-curriculum-page{--curriculum-accent:#67579a;--curriculum-accent-dark:#51447a;--curriculum-soft:#f4f2f8;--curriculum-border:#d3cddd}
.modern-lesson-buttons.year1-curriculum-page{--curriculum-accent:#a95c24;--curriculum-accent-dark:#844718;--curriculum-soft:#f8f2ed;--curriculum-border:#ddc7b7}
.modern-lesson-buttons.year2-curriculum-page{--curriculum-accent:#3e78b2;--curriculum-accent-dark:#2f5f91;--curriculum-soft:#f1f5f9;--curriculum-border:#c3d1df}
.modern-lesson-buttons.year3-curriculum-page{--curriculum-accent:#9e6c24;--curriculum-accent-dark:#7b551d;--curriculum-soft:#f7f3ea;--curriculum-border:#d8c8aa}
.modern-lesson-buttons.year4-curriculum-page{--curriculum-accent:#67579a;--curriculum-accent-dark:#51447a;--curriculum-soft:#f4f2f8;--curriculum-border:#d3cddd}
.modern-lesson-buttons.year5-curriculum-page{--curriculum-accent:#2f7458;--curriculum-accent-dark:#245944;--curriculum-soft:#f0f6f3;--curriculum-border:#bfd4ca}
.modern-lesson-buttons.year6-curriculum-page{--curriculum-accent:#b34d68;--curriculum-accent-dark:#8f3d53;--curriculum-soft:#f8f1f3;--curriculum-border:#ddc4cb}

/* Give the lesson area a little contrast from the individual cards. */
.modern-lesson-buttons .lesson-group,
.modern-lesson-buttons .lesson-panel,
.modern-lesson-buttons .lesson-selector,
.modern-lesson-buttons .curriculum-area{
  border-color:#e1e7f0!important;
  background:linear-gradient(180deg,#f8faff 0%,#f5f8fd 100%)!important;
  box-shadow:0 10px 30px rgba(11,27,60,.055)!important;
}

/* Standard lesson cards used by Years 0, 1, 3, 4, 5 and 6. */
.modern-lesson-buttons .lesson-link:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon){
  position:relative!important;
  overflow:visible!important;
  min-height:96px!important;
  padding:.82rem .86rem!important;
  border:2px solid var(--curriculum-border)!important;
  border-radius:17px!important;
  background:linear-gradient(100deg,var(--curriculum-soft) 0 14%,#ffffff 42% 100%)!important;
  box-shadow:
    inset 5px 0 0 var(--curriculum-accent),
    0 8px 20px rgba(11,27,60,.09)!important;
  transform:translateY(0)!important;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease!important;
}
.modern-lesson-buttons .lesson-link:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon):hover,
.modern-lesson-buttons .lesson-link:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon):focus-visible{
  border-color:var(--curriculum-accent)!important;
  background:linear-gradient(100deg,var(--curriculum-soft) 0 18%,#ffffff 46% 100%)!important;
  box-shadow:
    inset 6px 0 0 var(--curriculum-accent),
    0 14px 28px rgba(11,27,60,.14)!important;
  transform:translateY(-3px)!important;
  outline:none!important;
}
.modern-lesson-buttons .lesson-link:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon) .lesson-number,
.modern-lesson-buttons .lesson-link:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon) .lesson-index{
  width:46px!important;
  height:46px!important;
  min-width:46px!important;
  display:grid!important;
  place-items:center!important;
  border:0!important;
  border-radius:14px!important;
  background:linear-gradient(145deg,var(--curriculum-accent),var(--curriculum-accent-dark))!important;
  color:#fff!important;
  box-shadow:0 6px 12px rgba(11,27,60,.16)!important;
  font-size:.86rem!important;
  font-weight:950!important;
}
.modern-lesson-buttons .lesson-copy strong{
  color:#17233c!important;
  font-size:.88rem!important;
  font-weight:850!important;
  line-height:1.35!important;
}
.modern-lesson-buttons .lesson-copy small{
  color:#66758b!important;
  font-size:.7rem!important;
  font-weight:650!important;
}
.modern-lesson-buttons .lesson-link:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon) .lesson-arrow,
.modern-lesson-buttons .lesson-link:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon) .lesson-open{
  width:34px!important;
  height:34px!important;
  border-radius:50%!important;
  background:var(--curriculum-accent)!important;
  color:#fff!important;
  box-shadow:0 5px 11px rgba(11,27,60,.13)!important;
}

/* Year 2 uses a different lesson-card component; give it the same visual language. */
.modern-lesson-buttons .linked-lesson:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon){
  position:relative!important;
  overflow:hidden!important;
  min-height:126px!important;
  padding:.9rem!important;
  border:2px solid var(--curriculum-border)!important;
  border-radius:18px!important;
  background:linear-gradient(155deg,var(--curriculum-soft) 0 25%,#fff 26% 100%)!important;
  box-shadow:
    inset 0 5px 0 var(--curriculum-accent),
    0 8px 20px rgba(11,27,60,.09)!important;
  transform:translateY(0)!important;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease!important;
}
.modern-lesson-buttons .linked-lesson:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon)::after{
  width:82px!important;
  height:82px!important;
  top:-46px!important;
  right:-42px!important;
  background:color-mix(in srgb,var(--curriculum-accent) 14%,transparent)!important;
}
.modern-lesson-buttons .linked-lesson:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon):hover,
.modern-lesson-buttons .linked-lesson:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon):focus-visible{
  border-color:var(--curriculum-accent)!important;
  box-shadow:
    inset 0 6px 0 var(--curriculum-accent),
    0 14px 28px rgba(11,27,60,.14)!important;
  transform:translateY(-3px)!important;
  outline:none!important;
}
.modern-lesson-buttons .linked-lesson-number{
  display:inline-flex!important;
  width:fit-content!important;
  padding:.3rem .58rem!important;
  border-radius:999px!important;
  background:var(--curriculum-accent)!important;
  color:#fff!important;
  box-shadow:0 4px 9px rgba(11,27,60,.12)!important;
  font-size:.67rem!important;
  font-weight:950!important;
  letter-spacing:.045em!important;
}
.modern-lesson-buttons .linked-lesson-title{
  color:#17233c!important;
  font-size:.86rem!important;
  font-weight:850!important;
  line-height:1.35!important;
}
.modern-lesson-buttons .linked-lesson:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon) .linked-lesson-open{
  width:34px!important;
  height:34px!important;
  background:var(--curriculum-accent)!important;
  color:#fff!important;
  box-shadow:0 5px 11px rgba(11,27,60,.13)!important;
}
.modern-lesson-buttons .linked-lesson-number-pill{
  border-color:var(--curriculum-border)!important;
  background:#fff!important;
  color:var(--curriculum-accent-dark)!important;
}

/* Progress states remain the strongest signal and keep their existing behaviour. */
.modern-lesson-buttons .lesson-link.lesson-in-progress .lesson-number,
.modern-lesson-buttons .linked-lesson.lesson-in-progress .linked-lesson-number{
  background:#397dca!important;color:#fff!important;
}
.modern-lesson-buttons .lesson-link.lesson-needs-practice .lesson-number,
.modern-lesson-buttons .linked-lesson.lesson-needs-practice .linked-lesson-number{
  background:#c58a09!important;color:#fff!important;
}

@media(max-width:700px){
  .modern-lesson-buttons .lesson-link:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon){
    min-height:88px!important;
    padding:.72rem!important;
  }
  .modern-lesson-buttons .lesson-link:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon) .lesson-number,
  .modern-lesson-buttons .lesson-link:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon) .lesson-index{
    width:42px!important;height:42px!important;min-width:42px!important;
  }
  .modern-lesson-buttons .linked-lesson:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon){
    min-height:112px!important;
  }
}

/* ============================================================
   Curriculum experience refresh — Years 0–6 — 2026-08-19
   Presentation only: lesson links, progress state classes and JS
   behaviours are intentionally unchanged.
   ============================================================ */
.curriculum-page.modern-lesson-buttons {
  min-height: 100vh;
  background:
    radial-gradient(circle at 4% 7%, color-mix(in srgb, var(--curriculum-accent) 12%, transparent), transparent 25rem),
    radial-gradient(circle at 96% 15%, rgba(6,182,212,.10), transparent 28rem),
    linear-gradient(rgba(116,71,230,.026) 1px, transparent 1px),
    linear-gradient(90deg, rgba(116,71,230,.026) 1px, transparent 1px),
    #f8faff !important;
  background-size: auto, auto, 34px 34px, 34px 34px, auto !important;
}

.curriculum-page.modern-lesson-buttons .year-shell,
.curriculum-page.modern-lesson-buttons .page-shell {
  width: min(1220px, calc(100% - 2rem)) !important;
  margin: 0 auto !important;
  padding: 1.15rem 0 3.5rem !important;
}

.curriculum-page.modern-lesson-buttons .breadcrumbs {
  width: fit-content;
  max-width: 100%;
  margin: .2rem 0 1rem !important;
  padding: .42rem .72rem !important;
  gap: .45rem !important;
  border: 1px solid #e4e9f2;
  border-radius: 999px;
  background: rgba(255,255,255,.86);
  box-shadow: 0 5px 18px rgba(15,23,42,.04);
  color: #718096 !important;
  font-size: .78rem !important;
  font-weight: 750 !important;
}
.curriculum-page.modern-lesson-buttons .breadcrumbs a {
  color: var(--curriculum-accent-dark) !important;
  font-weight: 850 !important;
  text-decoration: none !important;
}

/* Year hero: bright, mathematical, and clearly separate from the page. */
.curriculum-page.modern-lesson-buttons .year-hero,
.curriculum-page.modern-lesson-buttons .overview-header {
  position: relative !important;
  isolation: isolate;
  overflow: hidden !important;
  min-height: 218px;
  margin: 0 0 1.15rem !important;
  padding: clamp(1.45rem, 3vw, 2.25rem) !important;
  border: 1px solid color-mix(in srgb, var(--curriculum-accent) 28%, #e5e7eb) !important;
  border-radius: 28px !important;
  background:
    linear-gradient(rgba(255,255,255,.09) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.09) 1px, transparent 1px),
    linear-gradient(122deg, color-mix(in srgb, var(--curriculum-accent) 9%, #ffffff) 0%, #fff 61%, color-mix(in srgb, var(--curriculum-accent) 7%, #eff6ff) 100%) !important;
  background-size: 24px 24px, 24px 24px, auto !important;
  box-shadow: 0 20px 52px rgba(15,23,42,.085) !important;
}
.curriculum-page.modern-lesson-buttons .year-hero::before,
.curriculum-page.modern-lesson-buttons .overview-header::before {
  content: "＋  ×  ÷  ½";
  position: absolute;
  z-index: -1;
  right: clamp(1rem, 4vw, 3.2rem);
  top: 28px;
  max-width: 330px;
  color: color-mix(in srgb, var(--curriculum-accent) 15%, transparent);
  font-size: clamp(2rem, 5.5vw, 4.6rem);
  font-weight: 950;
  line-height: 1.2;
  letter-spacing: .12em;
  transform: rotate(-6deg);
  pointer-events: none;
}
.curriculum-page.modern-lesson-buttons.year0-curriculum-page .year-hero::before {
  content: "●  ●  ●  ●";
  letter-spacing: .02em;
}
.curriculum-page.modern-lesson-buttons.year3-curriculum-page .year-hero::before,
.curriculum-page.modern-lesson-buttons.year4-curriculum-page .year-hero::before {
  content: "×  ½  ∠  📊";
}
.curriculum-page.modern-lesson-buttons.year5-curriculum-page .year-hero::before,
.curriculum-page.modern-lesson-buttons.year6-curriculum-page .year-hero::before {
  content: "x  %  ∠  π";
}
.curriculum-page.modern-lesson-buttons .year-hero::after,
.curriculum-page.modern-lesson-buttons .overview-header::after {
  content: "";
  position: absolute;
  z-index: -2;
  width: 280px;
  height: 280px;
  right: -120px;
  bottom: -170px;
  border-radius: 50%;
  background: radial-gradient(circle, color-mix(in srgb, var(--curriculum-accent) 21%, transparent), transparent 69%);
  pointer-events: none;
}
.curriculum-page.modern-lesson-buttons .year-hero-copy,
.curriculum-page.modern-lesson-buttons .overview-header > * {
  position: relative;
  z-index: 1;
}
.curriculum-page.modern-lesson-buttons .year-eyebrow,
.curriculum-page.modern-lesson-buttons .year-pill {
  display: inline-flex !important;
  align-items: center;
  width: fit-content !important;
  margin: 0 0 .7rem !important;
  padding: .42rem .72rem !important;
  border: 1px solid color-mix(in srgb, var(--curriculum-accent) 32%, white) !important;
  border-radius: 999px !important;
  background: color-mix(in srgb, var(--curriculum-accent) 10%, white) !important;
  color: var(--curriculum-accent-dark) !important;
  box-shadow: none !important;
  font-size: .72rem !important;
  font-weight: 950 !important;
  letter-spacing: .08em !important;
}
.curriculum-page.modern-lesson-buttons .year-hero h1,
.curriculum-page.modern-lesson-buttons .overview-header h1 {
  max-width: 790px;
  margin: 0 !important;
  color: #0b1b3c !important;
  font-size: clamp(2.05rem, 4.4vw, 3.65rem) !important;
  font-weight: 900 !important;
  line-height: 1.04 !important;
  letter-spacing: -.045em !important;
}
.curriculum-page.modern-lesson-buttons .overview-header h1 span {
  color: var(--curriculum-accent) !important;
}
.curriculum-page.modern-lesson-buttons .year-hero-copy > p:last-child,
.curriculum-page.modern-lesson-buttons .overview-header > p {
  max-width: 720px !important;
  margin: .8rem 0 0 !important;
  color: #56667d !important;
  font-size: 1rem !important;
  line-height: 1.65 !important;
}
.curriculum-page.modern-lesson-buttons .year-hero-actions {
  position: relative;
  z-index: 2;
  margin-top: 1.15rem !important;
  gap: .7rem !important;
}
.curriculum-page.modern-lesson-buttons .year-hero-actions a,
.curriculum-page.modern-lesson-buttons .secondary-button,
.curriculum-page.modern-lesson-buttons .primary-button {
  min-height: 46px !important;
  padding: .7rem 1rem !important;
  border-radius: 13px !important;
  font-weight: 850 !important;
  text-decoration: none !important;
}
.curriculum-page.modern-lesson-buttons .secondary-button {
  border: 1px solid #dfe5ef !important;
  background: #fff !important;
  color: #34445e !important;
  box-shadow: 0 6px 16px rgba(15,23,42,.055) !important;
}
.curriculum-page.modern-lesson-buttons .primary-button {
  border-color: transparent !important;
  background: linear-gradient(135deg,var(--curriculum-accent),var(--curriculum-accent-dark)) !important;
  color: #fff !important;
  box-shadow: 0 10px 22px color-mix(in srgb, var(--curriculum-accent) 23%, transparent) !important;
}

/* Overview counters. */
.curriculum-page.modern-lesson-buttons .overview-grid {
  gap: .85rem !important;
  margin: 0 0 1.2rem !important;
}
.curriculum-page.modern-lesson-buttons .overview-card {
  min-height: 112px !important;
  padding: 1rem 1.05rem !important;
  border: 1px solid #e3e8f1 !important;
  border-radius: 20px !important;
  background: rgba(255,255,255,.93) !important;
  box-shadow: 0 8px 24px rgba(15,23,42,.05) !important;
}
.curriculum-page.modern-lesson-buttons .overview-number {
  min-width: 58px !important;
  height: 58px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 17px !important;
  background: linear-gradient(145deg,var(--curriculum-accent),var(--curriculum-accent-dark)) !important;
  color: #fff !important;
  box-shadow: 0 7px 16px color-mix(in srgb,var(--curriculum-accent) 24%,transparent) !important;
  font-size: 1.25rem !important;
  font-weight: 950 !important;
}
.curriculum-page.modern-lesson-buttons .overview-card strong {
  color: #15233d !important;
  font-weight: 900 !important;
}
.curriculum-page.modern-lesson-buttons .overview-card p {
  color: #6a7890 !important;
}

/* Topic/learning-area selector. */
.curriculum-page.modern-lesson-buttons .learning-area-section,
.curriculum-page.modern-lesson-buttons .lesson-browser {
  margin: 1.15rem 0 !important;
  padding: clamp(1rem,2vw,1.35rem) !important;
  border: 1px solid #e1e7f0 !important;
  border-radius: 24px !important;
  background: rgba(255,255,255,.90) !important;
  box-shadow: 0 10px 30px rgba(15,23,42,.055) !important;
}
.curriculum-page.modern-lesson-buttons .section-heading,
.curriculum-page.modern-lesson-buttons .browser-heading {
  gap: 1rem !important;
  margin-bottom: 1rem !important;
}
.curriculum-page.modern-lesson-buttons .section-heading h2,
.curriculum-page.modern-lesson-buttons .browser-heading h2,
.curriculum-page.modern-lesson-buttons .lesson-panel-heading h2,
.curriculum-page.modern-lesson-buttons .all-lessons-heading h2,
.curriculum-page.modern-lesson-buttons .lesson-selector-heading h2 {
  color: #12213b !important;
  letter-spacing: -.025em !important;
}
.curriculum-page.modern-lesson-buttons .section-label,
.curriculum-page.modern-lesson-buttons .lesson-selector-kicker {
  color: var(--curriculum-accent-dark) !important;
  font-weight: 950 !important;
  letter-spacing: .07em !important;
}
.curriculum-page.modern-lesson-buttons .area-selector,
.curriculum-page.modern-lesson-buttons .area-buttons {
  gap: .72rem !important;
}
.curriculum-page.modern-lesson-buttons .area-tab,
.curriculum-page.modern-lesson-buttons .area-button {
  position: relative !important;
  min-height: 88px !important;
  padding: .78rem .82rem !important;
  border: 1.5px solid #dfe6ef !important;
  border-radius: 18px !important;
  background: #fff !important;
  color: #22314a !important;
  box-shadow: 0 6px 16px rgba(15,23,42,.055) !important;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease !important;
}
.curriculum-page.modern-lesson-buttons .area-tab:hover,
.curriculum-page.modern-lesson-buttons .area-tab:focus-visible,
.curriculum-page.modern-lesson-buttons .area-button:hover,
.curriculum-page.modern-lesson-buttons .area-button:focus-visible {
  transform: translateY(-2px) !important;
  border-color: var(--curriculum-border) !important;
  background: color-mix(in srgb,var(--curriculum-soft) 55%,white) !important;
  box-shadow: 0 10px 24px rgba(15,23,42,.09) !important;
  outline: none !important;
}
.curriculum-page.modern-lesson-buttons .area-tab.active,
.curriculum-page.modern-lesson-buttons .area-tab[aria-selected="true"],
.curriculum-page.modern-lesson-buttons .area-button[aria-expanded="true"] {
  border-color: var(--curriculum-accent) !important;
  background: linear-gradient(145deg,var(--curriculum-soft),#fff) !important;
  box-shadow: inset 0 0 0 1px color-mix(in srgb,var(--curriculum-accent) 25%,transparent), 0 10px 24px color-mix(in srgb,var(--curriculum-accent) 13%,transparent) !important;
}
.curriculum-page.modern-lesson-buttons .area-symbol,
.curriculum-page.modern-lesson-buttons .area-button > span:first-child {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  display: grid !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: 13px !important;
  background: color-mix(in srgb,var(--curriculum-accent) 11%,white) !important;
  color: var(--curriculum-accent-dark) !important;
  font-size: 1.15rem !important;
  font-weight: 950 !important;
  box-shadow: none !important;
}
.curriculum-page.modern-lesson-buttons .area-tab.active .area-symbol,
.curriculum-page.modern-lesson-buttons .area-tab[aria-selected="true"] .area-symbol,
.curriculum-page.modern-lesson-buttons .area-button[aria-expanded="true"] > span:first-child {
  background: linear-gradient(145deg,var(--curriculum-accent),var(--curriculum-accent-dark)) !important;
  color: #fff !important;
  box-shadow: 0 6px 14px color-mix(in srgb,var(--curriculum-accent) 24%,transparent) !important;
}
.curriculum-page.modern-lesson-buttons .area-tab strong,
.curriculum-page.modern-lesson-buttons .area-button > span:nth-child(2) {
  color: #182842 !important;
  font-weight: 850 !important;
}
.curriculum-page.modern-lesson-buttons .area-tab small,
.curriculum-page.modern-lesson-buttons .area-button-count {
  color: #748198 !important;
  font-weight: 750 !important;
}
.curriculum-page.modern-lesson-buttons .area-button-count {
  padding: .28rem .48rem !important;
  border-radius: 999px !important;
  background: #f4f7fb !important;
}

/* Year 1 search/filter experience. */
.curriculum-page.modern-lesson-buttons .lesson-search label {
  color: #33445f !important;
  font-weight: 850 !important;
}
.curriculum-page.modern-lesson-buttons .lesson-search input {
  min-height: 48px !important;
  border: 1.5px solid #dbe3ee !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: inset 0 1px 2px rgba(15,23,42,.025) !important;
}
.curriculum-page.modern-lesson-buttons .lesson-search input:focus {
  border-color: var(--curriculum-accent) !important;
  outline: 3px solid color-mix(in srgb,var(--curriculum-accent) 14%,transparent) !important;
}
.curriculum-page.modern-lesson-buttons .filter-buttons {
  gap: .55rem !important;
}
.curriculum-page.modern-lesson-buttons .filter-button {
  min-height: 42px !important;
  padding: .58rem .82rem !important;
  border: 1px solid #dfe5ee !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: #42516a !important;
  box-shadow: 0 4px 12px rgba(15,23,42,.035) !important;
  font-weight: 800 !important;
}
.curriculum-page.modern-lesson-buttons .filter-button:hover,
.curriculum-page.modern-lesson-buttons .filter-button:focus-visible,
.curriculum-page.modern-lesson-buttons .filter-button.active {
  border-color: var(--curriculum-accent) !important;
  background: var(--curriculum-soft) !important;
  color: var(--curriculum-accent-dark) !important;
  outline: none !important;
}
.curriculum-page.modern-lesson-buttons .filter-button.active {
  box-shadow: inset 0 0 0 1px color-mix(in srgb,var(--curriculum-accent) 18%,transparent) !important;
}

/* Lesson sections become strong white surfaces above the page background. */
.curriculum-page.modern-lesson-buttons .lesson-panel,
.curriculum-page.modern-lesson-buttons .lesson-selector,
.curriculum-page.modern-lesson-buttons .lesson-group,
.curriculum-page.modern-lesson-buttons .all-lessons-panel {
  position: relative;
  margin-top: 1rem !important;
  padding: clamp(1rem,2vw,1.35rem) !important;
  border: 1px solid #dfe6ef !important;
  border-radius: 24px !important;
  background: rgba(255,255,255,.96) !important;
  box-shadow: 0 12px 34px rgba(15,23,42,.065) !important;
}
.curriculum-page.modern-lesson-buttons .lesson-panel::before,
.curriculum-page.modern-lesson-buttons .lesson-group::before,
.curriculum-page.modern-lesson-buttons .all-lessons-panel::before {
  content: "";
  position: absolute;
  top: 0;
  left: 24px;
  right: 24px;
  height: 4px;
  border-radius: 0 0 999px 999px;
  background: linear-gradient(90deg,var(--curriculum-accent),#22c7d6);
  opacity: .8;
}
.curriculum-page.modern-lesson-buttons .lesson-panel-heading,
.curriculum-page.modern-lesson-buttons .all-lessons-heading,
.curriculum-page.modern-lesson-buttons .lesson-selector-heading {
  margin-bottom: 1rem !important;
  padding-bottom: .9rem !important;
  border-bottom: 1px solid #edf0f5 !important;
}
.curriculum-page.modern-lesson-buttons .lesson-count,
.curriculum-page.modern-lesson-buttons .all-lessons-count {
  padding: .42rem .7rem !important;
  border: 1px solid var(--curriculum-border) !important;
  border-radius: 999px !important;
  background: var(--curriculum-soft) !important;
  color: var(--curriculum-accent-dark) !important;
  font-size: .72rem !important;
  font-weight: 900 !important;
  white-space: nowrap !important;
}
.curriculum-page.modern-lesson-buttons .lesson-grid,
.curriculum-page.modern-lesson-buttons .linked-lessons-grid {
  gap: .85rem !important;
}

/* Year 2 supporting curriculum cards: keep examples but modernise the shells. */
.curriculum-page.modern-lesson-buttons .curriculum-grid {
  gap: 1rem !important;
  margin-top: 1.15rem !important;
}
.curriculum-page.modern-lesson-buttons .curriculum-area {
  overflow: hidden !important;
  padding: clamp(1rem,2vw,1.35rem) !important;
  border: 1px solid #e1e7f0 !important;
  border-radius: 24px !important;
  background: rgba(255,255,255,.94) !important;
  box-shadow: 0 10px 28px rgba(15,23,42,.055) !important;
}
.curriculum-page.modern-lesson-buttons .curriculum-area h2 {
  color: #13213a !important;
  letter-spacing: -.025em !important;
}
.curriculum-page.modern-lesson-buttons .topic-tag {
  border: 1px solid var(--curriculum-border) !important;
  border-radius: 999px !important;
  background: var(--curriculum-soft) !important;
  color: var(--curriculum-accent-dark) !important;
  font-weight: 800 !important;
}
.curriculum-page.modern-lesson-buttons .lesson-selector-close {
  border: 1px solid #dfe5ed !important;
  border-radius: 12px !important;
  background: #fff !important;
  color: #526176 !important;
}

/* Previous/next year navigation. */
.curriculum-page.modern-lesson-buttons .year-navigation,
.curriculum-page.modern-lesson-buttons .bottom-navigation {
  gap: .8rem !important;
  margin-top: 1.2rem !important;
}
.curriculum-page.modern-lesson-buttons .year-navigation a,
.curriculum-page.modern-lesson-buttons .bottom-navigation a,
.curriculum-page.modern-lesson-buttons .year-nav-card {
  min-height: 80px !important;
  padding: .9rem 1rem !important;
  border: 1px solid #dfe5ed !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.94) !important;
  color: #273750 !important;
  box-shadow: 0 7px 20px rgba(15,23,42,.05) !important;
  text-decoration: none !important;
}
.curriculum-page.modern-lesson-buttons .year-navigation a:hover,
.curriculum-page.modern-lesson-buttons .year-navigation a:focus-visible,
.curriculum-page.modern-lesson-buttons .bottom-navigation a:hover,
.curriculum-page.modern-lesson-buttons .bottom-navigation a:focus-visible,
.curriculum-page.modern-lesson-buttons .year-nav-card:hover,
.curriculum-page.modern-lesson-buttons .year-nav-card:focus-visible {
  border-color: var(--curriculum-border) !important;
  background: var(--curriculum-soft) !important;
  transform: translateY(-2px) !important;
  outline: none !important;
}
.curriculum-page.modern-lesson-buttons .nav-arrow,
.curriculum-page.modern-lesson-buttons .year-nav-arrow {
  color: var(--curriculum-accent) !important;
  font-weight: 950 !important;
}

/* Year 2 originally used a text-only brand; make it fit the shared header. */
.curriculum-page.modern-lesson-buttons .site-header .brand {
  color: #0b1b3c !important;
  font-weight: 900 !important;
  text-decoration: none !important;
  letter-spacing: -.025em !important;
}
.curriculum-page.modern-lesson-buttons .site-header .brand span {
  color: var(--curriculum-accent) !important;
}

@media (max-width: 900px) {
  .curriculum-page.modern-lesson-buttons .year-hero,
  .curriculum-page.modern-lesson-buttons .overview-header {
    min-height: 0;
  }
  .curriculum-page.modern-lesson-buttons .year-hero::before,
  .curriculum-page.modern-lesson-buttons .overview-header::before {
    right: .5rem;
    top: 20px;
    opacity: .55;
  }
  .curriculum-page.modern-lesson-buttons .overview-grid {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 700px) {
  .curriculum-page.modern-lesson-buttons .year-shell,
  .curriculum-page.modern-lesson-buttons .page-shell {
    width: min(100% - 1rem, 1220px) !important;
    padding-top: .65rem !important;
  }
  .curriculum-page.modern-lesson-buttons .breadcrumbs {
    border-radius: 13px;
    overflow-x: auto;
    white-space: nowrap;
  }
  .curriculum-page.modern-lesson-buttons .year-hero,
  .curriculum-page.modern-lesson-buttons .overview-header {
    padding: 1.2rem !important;
    border-radius: 22px !important;
  }
  .curriculum-page.modern-lesson-buttons .year-hero h1,
  .curriculum-page.modern-lesson-buttons .overview-header h1 {
    font-size: clamp(2rem,11vw,3rem) !important;
  }
  .curriculum-page.modern-lesson-buttons .year-hero::before,
  .curriculum-page.modern-lesson-buttons .overview-header::before {
    font-size: 2.1rem;
    right: -18px;
    top: 14px;
    opacity: .35;
  }
  .curriculum-page.modern-lesson-buttons .learning-area-section,
  .curriculum-page.modern-lesson-buttons .lesson-browser,
  .curriculum-page.modern-lesson-buttons .lesson-panel,
  .curriculum-page.modern-lesson-buttons .lesson-selector,
  .curriculum-page.modern-lesson-buttons .lesson-group,
  .curriculum-page.modern-lesson-buttons .all-lessons-panel,
  .curriculum-page.modern-lesson-buttons .curriculum-area {
    border-radius: 18px !important;
    padding: .9rem !important;
  }
  .curriculum-page.modern-lesson-buttons .area-selector,
  .curriculum-page.modern-lesson-buttons .area-buttons {
    grid-template-columns: 1fr !important;
  }
  .curriculum-page.modern-lesson-buttons .area-tab,
  .curriculum-page.modern-lesson-buttons .area-button {
    min-height: 76px !important;
  }
  .curriculum-page.modern-lesson-buttons .year-navigation,
  .curriculum-page.modern-lesson-buttons .bottom-navigation {
    grid-template-columns: 1fr !important;
  }
}


/* ============================================================
   Lesson button contrast refinement — Years 0–6 — 2026-08-19
   Purpose: stop lesson buttons blending into curriculum panels.
   Curriculum pages only; lesson files and progress logic untouched.
   ============================================================ */

/* Put the lesson choices on a clearly different surface. */
.curriculum-page.modern-lesson-buttons .lesson-panel,
.curriculum-page.modern-lesson-buttons .lesson-selector,
.curriculum-page.modern-lesson-buttons .lesson-group,
.curriculum-page.modern-lesson-buttons .all-lessons-panel {
  border: 1px solid #cbd6e3 !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.34), rgba(255,255,255,.08)),
    #e9eff6 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.72),
    0 13px 34px rgba(15,23,42,.075) !important;
}

/* Normal lesson buttons are now crisp white floating cards. */
.curriculum-page.modern-lesson-buttons .lesson-link:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon) {
  min-height: 98px !important;
  border: 2px solid #b9c6d6 !important;
  border-left: 7px solid var(--curriculum-accent) !important;
  border-radius: 18px !important;
  background: #ffffff !important;
  box-shadow:
    0 3px 0 rgba(15,23,42,.045),
    0 9px 22px rgba(15,23,42,.11) !important;
}
.curriculum-page.modern-lesson-buttons .lesson-link:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon):hover,
.curriculum-page.modern-lesson-buttons .lesson-link:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon):focus-visible {
  border-color: var(--curriculum-accent) !important;
  border-left-color: var(--curriculum-accent) !important;
  background: #ffffff !important;
  box-shadow:
    0 4px 0 color-mix(in srgb,var(--curriculum-accent) 22%,transparent),
    0 16px 30px rgba(15,23,42,.16) !important;
  transform: translateY(-4px) !important;
}
.curriculum-page.modern-lesson-buttons .lesson-link:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon) .lesson-number,
.curriculum-page.modern-lesson-buttons .lesson-link:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon) .lesson-index {
  border: 2px solid rgba(255,255,255,.75) !important;
  outline: 1px solid color-mix(in srgb,var(--curriculum-accent) 38%,#cbd5e1) !important;
  box-shadow: 0 6px 14px color-mix(in srgb,var(--curriculum-accent) 28%,rgba(15,23,42,.13)) !important;
}
.curriculum-page.modern-lesson-buttons .lesson-copy strong {
  color: #111c31 !important;
  font-size: .9rem !important;
  font-weight: 900 !important;
}
.curriculum-page.modern-lesson-buttons .lesson-copy small {
  color: #596a80 !important;
  font-weight: 700 !important;
}
.curriculum-page.modern-lesson-buttons .lesson-link:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon) .lesson-arrow,
.curriculum-page.modern-lesson-buttons .lesson-link:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon) .lesson-open {
  border: 2px solid color-mix(in srgb,var(--curriculum-accent) 64%,#ffffff) !important;
  box-shadow: 0 5px 13px color-mix(in srgb,var(--curriculum-accent) 25%,rgba(15,23,42,.12)) !important;
}

/* Year 2 has a separate lesson-card structure; match the same contrast. */
.curriculum-page.modern-lesson-buttons .linked-lessons-grid {
  padding: .2rem !important;
}
.curriculum-page.modern-lesson-buttons .linked-lesson:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon) {
  min-height: 128px !important;
  border: 2px solid #b9c6d6 !important;
  border-top: 7px solid var(--curriculum-accent) !important;
  border-radius: 18px !important;
  background: #ffffff !important;
  box-shadow:
    0 3px 0 rgba(15,23,42,.045),
    0 9px 22px rgba(15,23,42,.11) !important;
}
.curriculum-page.modern-lesson-buttons .linked-lesson:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon):hover,
.curriculum-page.modern-lesson-buttons .linked-lesson:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon):focus-visible {
  border-color: var(--curriculum-accent) !important;
  border-top-color: var(--curriculum-accent) !important;
  background: #ffffff !important;
  box-shadow:
    0 4px 0 color-mix(in srgb,var(--curriculum-accent) 22%,transparent),
    0 16px 30px rgba(15,23,42,.16) !important;
  transform: translateY(-4px) !important;
}
.curriculum-page.modern-lesson-buttons .linked-lesson-title {
  color: #111c31 !important;
  font-size: .9rem !important;
  font-weight: 900 !important;
}

/* Keep completed / in-progress / needs-practice states unmistakable. */
.curriculum-page.modern-lesson-buttons .lesson-link.lesson-completed,
.curriculum-page.modern-lesson-buttons .linked-lesson.lesson-completed {
  border-width: 2px !important;
  box-shadow: 0 10px 23px rgba(35,132,84,.20) !important;
}
.curriculum-page.modern-lesson-buttons .lesson-link.lesson-in-progress,
.curriculum-page.modern-lesson-buttons .linked-lesson.lesson-in-progress {
  border-width: 2px !important;
  box-shadow: 0 10px 23px rgba(68,119,181,.19) !important;
}
.curriculum-page.modern-lesson-buttons .lesson-link.lesson-needs-practice,
.curriculum-page.modern-lesson-buttons .linked-lesson.lesson-needs-practice {
  border-width: 2px !important;
  box-shadow: 0 10px 23px rgba(185,130,16,.20) !important;
}

@media (max-width:700px) {
  .curriculum-page.modern-lesson-buttons .lesson-panel,
  .curriculum-page.modern-lesson-buttons .lesson-selector,
  .curriculum-page.modern-lesson-buttons .lesson-group,
  .curriculum-page.modern-lesson-buttons .all-lessons-panel {
    padding: .85rem !important;
  }
  .curriculum-page.modern-lesson-buttons .lesson-link:not(.lesson-completed):not(.lesson-in-progress):not(.lesson-needs-practice):not(.lesson-coming-soon) {
    min-height: 90px !important;
    border-left-width: 6px !important;
  }
}