/* ============================================================
   EDLER HUB — Brand foundation (design system)
   Fonts + tokens + typography. Loaded before style.css.
   Source: Edler Hub Design System (colors_and_type.css).
   ============================================================ */

/* ---------- BRAND WEBFONTS (paths relative to this file) ---------- */
@font-face { font-family:"EH Display"; src:url("fonts/EH_Display_ExtraLight.woff2") format("woff2"); font-weight:200; font-style:normal; font-display:swap; }
@font-face { font-family:"EH Display"; src:url("fonts/EH_Display_Light.woff2") format("woff2"); font-weight:300; font-style:normal; font-display:swap; }
@font-face { font-family:"EH Display"; src:url("fonts/EH_Display_Regular.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"EH Display"; src:url("fonts/EH_Display_Medium.woff2") format("woff2"); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:"EH Display"; src:url("fonts/EH_Display_SemiBold.woff2") format("woff2"); font-weight:600; font-style:normal; font-display:swap; }
@font-face { font-family:"EH Display"; src:url("fonts/EH_Display_Bold.woff2") format("woff2"); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:"EH Display"; src:url("fonts/EH_Display_ExtraBold.woff2") format("woff2"); font-weight:800; font-style:normal; font-display:swap; }
@font-face { font-family:"EH Display"; src:url("fonts/EH_Display_Black.woff2") format("woff2"); font-weight:900; font-style:normal; font-display:swap; }

@font-face { font-family:"EH Text"; src:url("fonts/EH_Text_Light.woff2") format("woff2"); font-weight:300; font-style:normal; font-display:swap; }
@font-face { font-family:"EH Text"; src:url("fonts/EH_Text_Light_Italic.woff2") format("woff2"); font-weight:300; font-style:italic; font-display:swap; }
@font-face { font-family:"EH Text"; src:url("fonts/EH_Text_Regular.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"EH Text"; src:url("fonts/EH_Text_Italic.woff2") format("woff2"); font-weight:400; font-style:italic; font-display:swap; }
@font-face { font-family:"EH Text"; src:url("fonts/EH_Text_SemiBold.woff2") format("woff2"); font-weight:600; font-style:normal; font-display:swap; }
/* Body weight bumped a touch: map 500 to SemiBold so copy reads less thin */
@font-face { font-family:"EH Text"; src:url("fonts/EH_Text_SemiBold.woff2") format("woff2"); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:"EH Text"; src:url("fonts/EH_Text_SemiBold_Italic.woff2") format("woff2"); font-weight:600; font-style:italic; font-display:swap; }
@font-face { font-family:"EH Text"; src:url("fonts/EH_Text_Bold.woff2") format("woff2"); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:"EH Text"; src:url("fonts/EH_Text_Bold_Italic.woff2") format("woff2"); font-weight:700; font-style:italic; font-display:swap; }
@font-face { font-family:"EH Text"; src:url("fonts/EH_Text_ExtraBold.woff2") format("woff2"); font-weight:800; font-style:normal; font-display:swap; }

@font-face { font-family:"EH Script"; src:url("fonts/EH_Script_Regular.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"EH Script"; src:url("fonts/EH_Script_Bold.woff2") format("woff2"); font-weight:700; font-style:normal; font-display:swap; }

@font-face { font-family:"EH Accent"; src:url("fonts/EH_Accent_Medium.woff2") format("woff2"); font-weight:500; font-style:normal; font-display:swap; }

/* ---------- DESIGN TOKENS ---------- */
:root {
  --eh-navy:#0A1628; --eh-yellow:#F5B700; --eh-white:#FFFFFF; --eh-teal:#00897B;
  --eh-navy-900:#050B16; --eh-navy-800:#0A1628; --eh-navy-700:#19243A; --eh-navy-600:#2C384F;
  --eh-navy-500:#4A5468; --eh-navy-400:#6E7686; --eh-navy-300:#9097A4; --eh-navy-200:#C3C8D1;
  --eh-navy-100:#E2E5EA; --eh-navy-50:#F3F5F8;
  --eh-yellow-700:#B88800; --eh-yellow-600:#D9A300; --eh-yellow-500:#F5B700;
  --eh-yellow-400:#FFC93C; --eh-yellow-100:#FFF4D1; --eh-yellow-50:#FFFAE8;
  --eh-teal-700:#00665B; --eh-teal-600:#00786A; --eh-teal-500:#00897B;
  --eh-teal-100:#D5EEEA; --eh-teal-50:#EBF6F4;

  --bg:var(--eh-white); --bg-subtle:var(--eh-navy-50); --surface:var(--eh-white);
  --fg:var(--eh-navy-800); --fg-muted:var(--eh-navy-500); --fg-subtle:var(--eh-navy-400);
  --fg-on-yellow:var(--eh-navy-800);
  --border:var(--eh-navy-100); --border-strong:var(--eh-navy-200);
  --accent:var(--eh-yellow-500); --accent-hover:var(--eh-yellow-600);
  --link:var(--eh-teal-500); --link-hover:var(--eh-teal-600);

  --font-display:"EH Display","Segoe UI",system-ui,-apple-system,Arial,sans-serif;
  --font-sans:"EH Text","Segoe UI",system-ui,-apple-system,Arial,sans-serif;
  --font-script:"EH Script","Brush Script MT",cursive;
  --font-accent:"EH Accent","EH Text",system-ui,sans-serif;

  --header-glass:rgba(255,255,255,.90);
  --r-xs:4px; --r-sm:6px; --r-md:10px; --r-lg:14px; --r-xl:20px; --r-2xl:28px; --r-pill:999px;
  --shadow-xs:0 1px 2px rgba(10,22,40,.04);
  --shadow-sm:0 1px 2px rgba(10,22,40,.04),0 2px 6px rgba(10,22,40,.05);
  --shadow-md:0 2px 4px rgba(10,22,40,.05),0 8px 20px rgba(10,22,40,.06);
  --shadow-lg:0 6px 12px rgba(10,22,40,.06),0 18px 40px rgba(10,22,40,.08);
  --ease-out:cubic-bezier(.22,.61,.36,1);
  --t-fast:120ms; --t-base:200ms; --t-slow:320ms;
}

/* ---------- OVERRIDE ELEMENTOR GLOBAL TYPOGRAPHY ----------
   Elementor exposes these per-kit; redefining them re-fonts the
   whole page without editing any Elementor content. */
body,
body.elementor-kit-78,
.elementor-kit-78 {
  --e-global-typography-primary-font-family:"EH Display";
  --e-global-typography-secondary-font-family:"EH Display";
  --e-global-typography-text-font-family:"EH Text";
  --e-global-typography-accent-font-family:"EH Display";
  --e-global-color-primary:#0A1628;
  --e-global-color-secondary:#19243A;
  --e-global-color-text:#4A5468;
  --e-global-color-accent:#00897B;
}

/* ---------- GLOBAL TYPOGRAPHY ---------- */
html { scroll-behavior:smooth; scroll-padding-top:104px; }
body {
  font-family:var(--font-sans);
  color:var(--fg);
  font-weight:500;            /* a touch thicker than Regular (maps to SemiBold file) */
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}

h1,h2,h3,h4,h5,h6,
.elementor-heading-title,
.elementor-widget-heading .elementor-heading-title {
  font-family:var(--font-display) !important;
  color:var(--fg);
  letter-spacing:-0.02em;
  line-height:1.15;
  text-wrap:balance;
}
h1,.elementor-widget-heading[data-widget_type] h1 { font-weight:700; }

p, li, .elementor-widget-text-editor,
.elementor-widget-text-editor p,
.elementor-widget-text-editor li {
  font-family:var(--font-sans) !important;
  font-weight:500;
  line-height:1.65;
}

a { color:var(--link); transition:color var(--t-fast) var(--ease-out); }
a:hover { color:var(--link-hover); }

::selection { background:var(--eh-yellow-300,#FFDA75); color:var(--eh-navy-900); }

.script-accent { font-family:var(--font-script); font-weight:700; font-style:normal; color:var(--accent); }

/* Yellow used as accent only - key highlights */
.eh-accent-text { color:var(--accent); }
mark, .has-yellow-color { background:transparent; color:var(--accent); }

/* ---------- DARK MODE ---------- */
html[data-eh-theme="dark"] {
  --bg:#0A1628; --bg-subtle:#0F1E35; --surface:#0F1E35;
  --fg:#FFFFFF; --fg-muted:#C3C8D1; --fg-subtle:#9097A4;
  --border:rgba(255,255,255,.10); --border-strong:rgba(255,255,255,.20);
  --header-glass:rgba(10,22,40,.88);
}
html[data-eh-theme="dark"] body,
html[data-eh-theme="dark"] body.elementor-kit-78 {
  --e-global-color-primary:#FFFFFF;
  --e-global-color-secondary:#E2E5EA;
  --e-global-color-text:#C3C8D1;
}
html[data-eh-theme="dark"] body { background:var(--bg); color:var(--fg); }
html[data-eh-theme="dark"] h1, html[data-eh-theme="dark"] h2,
html[data-eh-theme="dark"] h3, html[data-eh-theme="dark"] h4,
html[data-eh-theme="dark"] h5, html[data-eh-theme="dark"] h6,
html[data-eh-theme="dark"] .elementor-heading-title { color:var(--fg); }

/* Button text must always read on the yellow fill */
a.eh-btn-primary, .eh-btn-primary,
a.eh-nav-cta, .eh-nav-cta {
  color:#0A1628 !important;
  border-bottom:0 !important;
}

/* Smooth theme transition */
body, .eh-site-header, .eh-program, .eh-step, .eh-cta-card,
.eh-about .pillar, .eh-contact .card {
  transition: background-color var(--t-base) var(--ease-out),
              color var(--t-base) var(--ease-out),
              border-color var(--t-base) var(--ease-out);
}
