/* ============================================================
   maths-advanced-y12-theme.css — Mathematics Advanced Year 12
   Palette: Deep navy / indigo / slate (mature, HSC-focused)
   ============================================================ */
:root {
  --primary:       #1e3a8f;
  --primary-mid:   #1e40af;
  --primary-light: rgba(30, 58, 143, 0.12);
  --accent:        #4338ca;
  --accent-dark:   #3730a3;
  --accent-light:  rgba(67, 56, 202, 0.12);
  --accent-bg:     rgba(255, 255, 255, 0.88);
  --surface:       rgba(255, 255, 255, 0.96);
  --surface-solid: #ffffff;
  --mesh-1: #dbeafe;
  --mesh-2: #e0e7ff;
  --mesh-3: #eff6ff;
  --mesh-gradient: radial-gradient(ellipse at 20% 20%, var(--mesh-1) 0%, transparent 55%),
                   radial-gradient(ellipse at 80% 80%, var(--mesh-2) 0%, transparent 55%),
                   radial-gradient(ellipse at 50% 50%, var(--mesh-3) 0%, transparent 70%),
                   #f8fafc;
  --h2-color:      var(--heading-color);
  --shadow-accent: 0 4px 20px var(--accent-light);
}

body {
  background: radial-gradient(ellipse at 10% 20%, rgba(191, 219, 254, 0.9) 0%, transparent 55%),
              radial-gradient(ellipse at 85% 10%, rgba(224, 231, 255, 0.85) 0%, transparent 50%),
              radial-gradient(ellipse at 60% 80%, rgba(191, 219, 254, 0.8) 0%, transparent 50%),
              linear-gradient(155deg, #eff6ff 0%, #dbeafe 40%, #e0e7ff 75%, #f5f3ff 100%);
  min-height: 100vh;
}

body[data-subject="maths-advanced"] .hero {
  color: #fff;
  background:
    linear-gradient(90deg, rgba(15, 30, 80, 0.94) 0%, rgba(30, 58, 143, 0.82) 48%, rgba(67, 56, 202, 0.34) 100%),
    url('assets/heroes/maths-adv-subject-hero.webp') 56% center/cover no-repeat;
}

body[data-subject="maths-advanced"] .hero h1,
body[data-subject="maths-advanced"] .hero-hook {
  color: #fff;
}

body[data-subject="maths-advanced"] .hero-hook {
  border-left-color: rgba(255, 255, 255, 0.35);
  opacity: 0.9;
}

body[data-subject="maths-advanced"] .hero::after,
body[data-subject="maths-advanced"] .hero-emoji {
  display: none;
}

body[data-subject="maths-advanced"] .badge-outline {
  border-color: rgba(255, 255, 255, 0.32);
  color: rgba(255, 255, 255, 0.82);
}