/* ═══════════════════════════════════════════════════════════════
   ELPRINS — Premium English Academy
   Deep royal purple · pure white · soft gold
   ═══════════════════════════════════════════════════════════════ */

:root {
  --ep-purple-950: #14081F;
  --ep-purple-900: #1C0B30;
  --ep-purple-800: #2A1248;
  --ep-purple-700: #3B1A63;
  --ep-purple-600: #4F2680;
  --ep-gold: #C9A24A;
  --ep-gold-soft: #E8D19A;
  --ep-white: #FFFFFF;
  --ep-snow: #FBF9FC;
  --ep-mist: #F3EEF8;
  --ep-ink: #1C1328;
  --ep-body: #4A4258;
  --ep-muted: #7A7188;

  --brand-950: var(--ep-purple-950);
  --brand-900: var(--ep-purple-900);
  --brand-800: var(--ep-purple-800);
  --brand-700: var(--ep-purple-700);
  --brand-600: var(--ep-purple-600);
  --brand-500: #6B3FA0;
  --brand-400: #9B74D1;
  --brand-300: #C4A8E8;
  --brand-100: rgba(42, 18, 72, 0.08);
  --brand-50: rgba(42, 18, 72, 0.04);

  --gold-700: #8F7328;
  --gold-600: #B08A32;
  --gold-500: var(--ep-gold);
  --gold-400: var(--ep-gold-soft);
  --gold-300: #F2E4B8;
  --gold-soft: rgba(201, 162, 74, 0.16);

  --brand: var(--ep-purple-800);
  --accent: var(--ep-purple-800);
  --accent-soft: rgba(42, 18, 72, 0.08);
  --accent-violet: var(--ep-purple-600);
  --accent-cyan: var(--ep-purple-600);
  --accent-amber: var(--ep-gold);
  --accent-green: #3D7A5A;
  --accent-gold: var(--ep-gold);
  --insight: var(--ep-purple-800);
  --insight-strong: var(--ep-purple-900);
  --insight-soft: rgba(42, 18, 72, 0.08);

  --page-bg: var(--ep-snow);
  --page-bg-alt: var(--ep-mist);
  --card-bg: var(--ep-white);
  --card: var(--ep-white);
  --card-bg-strong: var(--ep-white);
  --card-soft: var(--ep-mist);

  --surface-soft: rgba(28, 19, 40, 0.04);
  --surface-strong: rgba(28, 19, 40, 0.07);
  --surface-highlight: rgba(201, 162, 74, 0.12);
  --surface-highlight-strong: rgba(201, 162, 74, 0.22);

  --text: var(--ep-body);
  --text-strong: var(--ep-ink);
  --muted: var(--ep-muted);
  --muted-strong: #5C5468;

  --border: rgba(42, 18, 72, 0.10);
  --border-strong: rgba(42, 18, 72, 0.20);
  --brand-border: var(--border);
  --gold-border: rgba(201, 162, 74, 0.5);
  --shadow: 0 18px 40px rgba(28, 11, 48, 0.08);
  --shadow-soft: 0 8px 20px rgba(28, 11, 48, 0.05);
  --shadow-strong: 0 28px 60px rgba(28, 11, 48, 0.14);
  --shadow-gold: 0 12px 28px rgba(201, 162, 74, 0.2);

  --primary: var(--ep-purple-800);
  --primary-strong: var(--ep-purple-900);
  --primary-weak: rgba(42, 18, 72, 0.1);

  --field-bg: var(--ep-white);
  --field-text: var(--ep-ink);
  --field-border: rgba(42, 18, 72, 0.16);

  --btn-solid-bg: var(--ep-purple-800);
  --btn-solid-text: #FFFFFF;
  --btn-gold-bg: var(--ep-gold);
  --btn-gold-text: #1C0B30;

  --success: #3D7A5A;
  --danger: #B33A2B;
  --warning: #B8860B;
  --success-soft-bg: rgba(61, 122, 90, 0.12);
  --success-soft-border: rgba(61, 122, 90, 0.35);
  --danger-soft-bg: rgba(179, 58, 43, 0.12);
  --danger-soft-border: rgba(179, 58, 43, 0.35);
  --warning-soft-bg: rgba(184, 134, 11, 0.12);
  --warning-soft-border: rgba(184, 134, 11, 0.35);

  --radius: 12px;
  --radius-lg: 18px;
  --radius-xl: 28px;

  --sw-bg: var(--ep-gold);
  --sw-knob: #FFFFFF;

  --hdr-bg: rgba(255, 255, 255, 0.9);
  --hdr-text: var(--ep-ink);
  --hdr-border: rgba(42, 18, 72, 0.08);
  --hdr-fade: transparent;

  --grid-line: rgba(42, 18, 72, 0.04);
  --page-glow-1: rgba(79, 38, 128, 0.08);
  --page-glow-2: rgba(201, 162, 74, 0.08);

  --font-display: "Fraunces", "Playfair Display", Georgia, serif;
  --font-body: "Cairo", "IBM Plex Sans Arabic", Tahoma, sans-serif;
  --font-en: "Fraunces", Georgia, serif;
}

html[data-theme="dark"] {
  --page-bg: #100818;
  --page-bg-alt: #180C24;
  --card-bg: #1C1230;
  --card: #1C1230;
  --card-bg-strong: #241838;
  --card-soft: #1A1028;
  --text: #F2ECF8;
  --text-strong: #FFFFFF;
  --muted: #D8CFE6;
  --muted-strong: #EDE6F5;
  --border: rgba(201, 162, 74, 0.16);
  --border-strong: rgba(201, 162, 74, 0.28);
  --field-bg: #180C24;
  --field-text: #FFFFFF;
  --field-border: rgba(201, 162, 74, 0.22);
  --hdr-bg: rgba(16, 8, 24, 0.92);
  --hdr-text: #FFFFFF;
  --hdr-border: rgba(201, 162, 74, 0.18);
  --btn-solid-bg: #4F2680;
  --shadow: 0 18px 40px rgba(0, 0, 0, 0.4);
  --page-glow-1: rgba(79, 38, 128, 0.2);
  --page-glow-2: rgba(201, 162, 74, 0.08);
}

*,
*::before,
*::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body.legend-platform {
  margin: 0;
  min-height: 100vh;
  font-family: var(--font-body);
  color: var(--text);
  background: var(--page-bg);
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
}

body.legend-platform h1,
body.legend-platform h2,
body.legend-platform h3,
body.legend-platform .ep-brandFont {
  font-family: var(--font-display);
  font-weight: 650;
  letter-spacing: 0.01em;
}

.container,
.ep-container {
  width: min(1100px, calc(100% - 40px));
  margin-inline: auto;
}

img { max-width: 100%; height: auto; display: block; }
a { color: var(--brand-700); text-decoration: none; }
a:hover { color: var(--brand-600); }

:focus-visible {
  outline: 2px solid var(--ep-gold);
  outline-offset: 3px;
}

@keyframes epFadeUp {
  from { opacity: 0; transform: translateY(22px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes epSoftFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}

@keyframes epLineIn {
  from { transform: scaleX(0); }
  to { transform: scaleX(1); }
}