/*
Theme Name:  Elite Analyst
Theme URI:   https://eliteanalystacademy.com
Description: Official WordPress theme for Elite Analyst Academy — Claude for Investment Banking.
Author:      Elite Analyst Academy
Author URI:  https://eliteanalystacademy.com
Version:     1.0.0
License:     Proprietary
Text Domain: elite-analyst
Tags:        dark, landing-page, finance, custom-colors, custom-logo, full-width-template

==========================================================================
  Design system
  All spacing on an 8dp grid. Design tokens defined in theme.json;
  aliased here with --ea-* custom properties for readability.
==========================================================================
*/

/* =========================================================================
   1. Design token aliases
   Map --wp--preset--* / --wp--custom--* to shorter --ea-* names.
   ========================================================================= */
:root {
  /* — Colors — */
  --ea-accent:          var(--wp--preset--color--accent);
  --ea-accent-deep:     var(--wp--preset--color--accent-deep);
  --ea-ink:             var(--wp--preset--color--ink);
  --ea-bg-dark:         var(--wp--preset--color--bg-dark);
  --ea-bg-dark-2:       var(--wp--preset--color--bg-dark-2);
  --ea-surface-dark:    var(--wp--preset--color--surface-dark);
  --ea-off-white:       var(--wp--preset--color--off-white);
  --ea-white:           var(--wp--preset--color--white);
  --ea-warm-gray:       var(--wp--preset--color--warm-gray);
  --ea-hairline:        var(--wp--preset--color--hairline);
  --ea-txt-dark:        var(--wp--preset--color--text-dark);
  --ea-txt-dark-mute:   var(--wp--preset--color--text-dark-mute);
  --ea-txt-light:       var(--wp--preset--color--text-light);
  --ea-txt-light-mute:  var(--wp--preset--color--text-light-mute);

  /* Derived surface colours */
  --ea-hairline-dark:      rgba(255,255,255,0.10);
  --ea-hairline-dark-soft: rgba(255,255,255,0.06);

  /* — Typography — */
  --ea-font-display: var(--wp--preset--font-family--display);
  --ea-font-body:    var(--wp--preset--font-family--body);
  --ea-font-mono:    var(--wp--preset--font-family--mono);

  /* — 8dp spacing scale — */
  --ea-sp-1:  var(--wp--preset--spacing--10);   /*   8px */
  --ea-sp-2:  var(--wp--preset--spacing--20);   /*  16px */
  --ea-sp-3:  var(--wp--preset--spacing--30);   /*  24px */
  --ea-sp-4:  var(--wp--preset--spacing--40);   /*  32px */
  --ea-sp-5:  var(--wp--preset--spacing--50);   /*  40px */
  --ea-sp-6:  var(--wp--preset--spacing--60);   /*  48px */
  --ea-sp-7:  var(--wp--preset--spacing--70);   /*  56px */
  --ea-sp-8:  var(--wp--preset--spacing--80);   /*  64px */
  --ea-sp-9:  var(--wp--preset--spacing--90);   /*  72px */
  --ea-sp-10: var(--wp--preset--spacing--100);  /*  80px */
  --ea-sp-11: var(--wp--preset--spacing--110);  /*  88px */
  --ea-sp-12: var(--wp--preset--spacing--120);  /*  96px */
  --ea-sp-16: var(--wp--preset--spacing--160);  /* 128px */

  /* — Border radii — */
  --ea-radius:    var(--wp--custom--radius--md);  /* 12px */
  --ea-radius-lg: var(--wp--custom--radius--xl);  /* 24px — card rounding */

  /* — Containers — */
  --ea-container:        var(--wp--custom--container--wide);    /* 1200px */
  --ea-container-narrow: var(--wp--custom--container--narrow);  /*  920px */
  --ea-container-text:   var(--wp--custom--container--text);    /*  760px */

  /* — Header — */
  --ea-header-h: var(--wp--custom--header--height);  /* 64px */

  /* — Shadows — */
  --ea-shadow-sm:   var(--wp--custom--shadow--sm);
  --ea-shadow-md:   var(--wp--custom--shadow--md);
  --ea-shadow-card: var(--wp--custom--shadow--card);

  /* — Easing — */
  --ea-ease: var(--wp--custom--ease);
}

/* =========================================================================
   2. Reset / base
   ========================================================================= */
*, *::before, *::after { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  font-family: var(--ea-font-body);
  background: var(--ea-bg-dark);
  color: var(--ea-txt-dark);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img, svg { display: block; max-width: 100%; }
a  { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; }

h1, h2, h3, h4 {
  margin: 0;
  font-family: var(--ea-font-display);
  font-weight: 900;
  letter-spacing: -0.02em;
  line-height: 1.02;
}
p  { margin: 0; text-wrap: pretty; }
ul { margin: 0; padding: 0; list-style: none; }

::selection { background: var(--ea-accent); color: var(--ea-bg-dark); }

:focus-visible {
  outline: 2px solid var(--ea-accent);
  outline-offset: 3px;
  border-radius: 4px;
}

/* =========================================================================
   3. Layout primitives
   ========================================================================= */
.ea-container {
  width: 100%;
  max-width: var(--ea-container);
  margin: 0 auto;
  padding: 0 var(--ea-sp-3);  /* 24px */
}

.ea-section {
  padding-block: clamp(var(--ea-sp-9), 11vh, var(--ea-sp-16));  /* 72–128px */
  position: relative;
}

.ea-section--dark    { background: var(--ea-bg-dark);   color: var(--ea-txt-dark); }
.ea-section--dark-2  { background: var(--ea-bg-dark-2); color: var(--ea-txt-dark); }
.ea-section--light   { background: var(--ea-off-white); color: var(--ea-txt-light); }
.ea-section--white   { background: var(--ea-white);     color: var(--ea-txt-light); }

/* =========================================================================
   4. Eyebrow label
   ========================================================================= */
.ea-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--ea-sp-2);            /* 16px */
  font-family: var(--ea-font-body);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--ea-accent);
  margin-bottom: var(--ea-sp-3);  /* 24px */
}
.ea-section--light .ea-eyebrow,
.ea-section--white .ea-eyebrow  { color: var(--ea-accent-deep); }

.ea-eyebrow::before {
  content: "";
  width: var(--ea-sp-4);  /* 32px */
  height: 2px;
  background: currentColor;
  display: inline-block;
}

.ea-section-head { max-width: var(--ea-container-text); }
.ea-section-head--center {
  max-width: 820px;
  margin-inline: auto;
  text-align: center;
}
.ea-section-head--center .ea-eyebrow::before { display: none; }
.ea-section-head--center .ea-eyebrow         { gap: 0; }

h2.ea-section-title { font-size: clamp(32px, 4.6vw, 56px); }   /* ~33–56px; 8dp floor/ceil */
.ea-section-title .soft { color: var(--ea-warm-gray); display: block; }
.ea-section--dark  .ea-section-title .soft,
.ea-section--dark-2 .ea-section-title .soft { color: var(--ea-txt-dark-mute); }

.ea-lead {
  font-size: clamp(16px, 1.5vw, var(--ea-sp-3));  /* 16–24px (8dp) */
  line-height: 1.62;
  max-width: 640px;
  margin-top: var(--ea-sp-3);
}
.ea-section--dark .ea-lead,
.ea-section--dark-2 .ea-lead  { color: var(--ea-txt-dark-mute); }
.ea-section--light .ea-lead,
.ea-section--white .ea-lead   { color: var(--ea-txt-light-mute); }

/* =========================================================================
   5. Buttons
   ========================================================================= */
.ea-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--ea-sp-1);   /* 8px */
  font-family: var(--ea-font-body);
  font-weight: 700;
  font-size: 16px;
  line-height: 1;
  padding: var(--ea-sp-2) var(--ea-sp-4);   /* 16px 32px */
  border-radius: var(--wp--custom--radius--sm);
  border: 1px solid transparent;
  transition:
    transform .18s var(--ea-ease),
    background .18s var(--ea-ease),
    box-shadow .18s var(--ea-ease),
    color .18s var(--ea-ease);
  text-align: center;
}
.ea-btn--primary {
  background: var(--ea-accent);
  color: #0c1424;
  box-shadow: 0 var(--ea-sp-1) var(--ea-sp-3) rgba(160,206,255,0.22);
}
.ea-btn--primary:hover {
  background: #b6daff;
  transform: translateY(-2px);
  box-shadow: 0 var(--ea-sp-2) var(--ea-sp-4) rgba(160,206,255,0.30);
}
.ea-btn--primary:active { transform: translateY(0); }

.ea-btn--ghost-dark {
  background: transparent;
  color: var(--ea-txt-dark);
  border-color: var(--ea-hairline-dark);
}
.ea-btn--ghost-dark:hover { border-color: var(--ea-accent); color: var(--ea-accent); }

.ea-btn--lg   { font-size: 17px; padding: var(--ea-sp-3) var(--ea-sp-5); }  /* 24px 40px */
.ea-btn--block { display: flex; width: 100%; }

.ea-text-link {
  display: inline-flex;
  align-items: center;
  gap: var(--ea-sp-1);
  font-weight: 700;
  font-size: 15px;
  color: var(--ea-txt-dark);
  border-bottom: 1px solid transparent;
  padding-bottom: 2px;
  transition: color .18s var(--ea-ease), border-color .18s var(--ea-ease);
}
.ea-text-link:hover { color: var(--ea-accent); border-color: var(--ea-accent); }
.ea-text-link .arr  { transition: transform .25s var(--ea-ease); }
.ea-text-link:hover .arr { transform: translateY(3px); }

/* =========================================================================
   6. Logo lockup
   ========================================================================= */
.ea-logo {
  display: inline-flex;
  align-items: center;
  font-family: var(--ea-font-display);
  font-weight: 900;
  letter-spacing: 0.01em;
  font-size: 19px;
  line-height: 1;
  white-space: nowrap;
  user-select: none;
  color: var(--ea-txt-dark);
}
.ea-logo .ea-logo__word  { color: inherit; }
.ea-logo .ea-logo__mark  {
  width: 0.74em; height: 0.74em;
  margin: 0 0.04em;
  transform: translateY(0.02em);
}
.ea-logo .ea-logo__mark svg { width: 100%; height: 100%; }

.ea-logo--on-light { color: var(--ea-ink); }

/* =========================================================================
   7. Header + announcement bar
   ========================================================================= */
.ea-site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  height: var(--ea-header-h);       /* 64px — 8dp */
  display: flex; align-items: center;
  background: rgba(15,16,17,0.72);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid transparent;
  transition: height .28s var(--ea-ease), background .28s var(--ea-ease), border-color .28s var(--ea-ease);
}
.ea-site-header.is-scrolled {
  height: var(--wp--custom--header--height-scrolled);  /* 56px */
  background: rgba(15,16,17,0.92);
  border-bottom-color: var(--ea-hairline-dark);
}
.ea-site-header .ea-container {
  display: flex; align-items: center; justify-content: space-between;
}
.ea-site-header .ea-logo { font-size: 18px; }

.ea-announce {
  position: fixed; left: 0; right: 0; z-index: 99;
  top: var(--ea-header-h);
  background: var(--ea-accent);
  color: #0c1424;
  text-align: center;
  font-size: 13px; font-weight: 700;
  letter-spacing: 0.01em;
  padding: var(--ea-sp-1) var(--ea-sp-2);   /* 8px 16px */
  transition: top .28s var(--ea-ease);
}
.ea-site-header.is-scrolled + .ea-announce {
  top: var(--wp--custom--header--height-scrolled);  /* 56px */
}
.ea-announce a        { text-decoration: underline; text-underline-offset: 2px; }
.ea-announce .dot     {
  display: inline-block; width: var(--ea-sp-1); height: var(--ea-sp-1);
  border-radius: 50%; background: #0c1424;
  margin-right: var(--ea-sp-1); transform: translateY(-1px);
}

/* =========================================================================
   8. Hero section
   ========================================================================= */
.ea-hero {
  padding-top: calc(var(--ea-header-h) + var(--ea-sp-11));  /* 64 + 88 = 152px */
  padding-bottom: clamp(var(--ea-sp-9), 10vh, var(--ea-sp-15));
  overflow: hidden;
}

.ea-hero__grid {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: var(--ea-sp-7);   /* 56px */
  align-items: center;
}

.ea-hero h1 {
  font-size: clamp(48px, 7.4vw, 104px);
  line-height: 0.95;
  letter-spacing: -0.035em;
}
.ea-hero h1 .l2 { color: var(--ea-accent); display: block; }

.ea-hero__sub {
  font-size: clamp(16px, 1.7vw, var(--ea-sp-3));
  line-height: 1.5;
  margin-top: var(--ea-sp-4);   /* 32px */
  max-width: 560px;
  font-weight: 400;
}

.ea-hero__body {
  margin-top: var(--ea-sp-4);   /* 32px */
  max-width: 540px;
  display: grid;
  gap: var(--ea-sp-2);          /* 16px */
}
.ea-hero__body p { color: var(--ea-txt-dark-mute); font-size: 16px; line-height: 1.62; }

.ea-hero__cta {
  margin-top: var(--ea-sp-5);   /* 40px */
  display: flex; flex-wrap: wrap; align-items: center;
  gap: var(--ea-sp-2) var(--ea-sp-3);  /* 16px 24px */
}

.ea-hero__micro {
  margin-top: var(--ea-sp-2);   /* 16px */
  display: inline-flex; align-items: center;
  gap: var(--ea-sp-1);          /* 8px */
  color: var(--ea-warm-gray); font-size: 13px; font-weight: 700; letter-spacing: 0.02em;
}
.ea-hero__micro .tick { color: var(--ea-accent); }

.ea-hero__watermark {
  position: absolute; right: -3%; top: 2%;
  width: 38%; max-width: 440px;
  opacity: 0.06; pointer-events: none; z-index: 0;
}
.ea-hero .ea-container { position: relative; z-index: 1; }

/* =========================================================================
   9. Skill-library panel (hero visual)
   ========================================================================= */
.ea-skillpanel {
  background: linear-gradient(180deg, #16181d 0%, #121317 100%);
  border: 1px solid var(--ea-hairline-dark);
  border-radius: var(--ea-radius-lg);
  box-shadow: var(--ea-shadow-card);
  overflow: hidden;
  transform: rotate(0.4deg);
}
.ea-skillpanel__bar {
  display: flex; align-items: center; gap: var(--ea-sp-1);
  padding: var(--ea-sp-2);       /* 16px */
  border-bottom: 1px solid var(--ea-hairline-dark-soft);
  background: rgba(255,255,255,0.015);
}
.ea-skillpanel__dots        { display: flex; gap: var(--ea-sp-1); }
.ea-skillpanel__dots i      {
  width: var(--ea-sp-1); height: var(--ea-sp-1);
  border-radius: 50%; background: rgba(255,255,255,0.16); display: block;
}
.ea-skillpanel__title       {
  font-family: var(--ea-font-mono); font-size: 12px;
  color: var(--ea-txt-dark-mute); letter-spacing: 0.02em;
}
.ea-skillpanel__title b     { color: var(--ea-accent); font-weight: 600; }
.ea-skillpanel__body        { padding: var(--ea-sp-2); display: grid; gap: var(--ea-sp-1); }

.ea-skillrow {
  display: grid; grid-template-columns: 32px 1fr auto; align-items: center;
  gap: var(--ea-sp-2);          /* 16px */
  padding: var(--ea-sp-2);      /* 16px */
  border-radius: var(--wp--custom--radius--sm);  /* 8px */
  background: rgba(255,255,255,0.022);
  border: 1px solid var(--ea-hairline-dark-soft);
}
.ea-skillrow__ico {
  width: 32px; height: 32px;
  border-radius: var(--wp--custom--radius--sm);
  background: rgba(160,206,255,0.12);
  display: grid; place-items: center;
  color: var(--ea-accent);
}
.ea-skillrow__ico svg       { width: 17px; height: 17px; }
.ea-skillrow__name          { font-size: 13px; font-weight: 700; color: var(--ea-txt-dark); }
.ea-skillrow__meta          {
  font-family: var(--ea-font-mono); font-size: 10px;
  color: var(--ea-warm-gray); margin-top: 2px; letter-spacing: 0.02em;
}
.ea-skillrow__tag           {
  font-family: var(--ea-font-mono); font-size: 10px;
  color: var(--ea-accent); background: rgba(160,206,255,0.1);
  padding: 4px var(--ea-sp-1);  /* 4px 8px */
  border-radius: 999px; letter-spacing: 0.04em;
}
.ea-skillpanel__foot {
  padding: var(--ea-sp-2);      /* 16px */
  border-top: 1px solid var(--ea-hairline-dark-soft);
  display: flex; justify-content: space-between; align-items: center;
  font-family: var(--ea-font-mono); font-size: 11px; color: var(--ea-warm-gray);
}
.ea-skillpanel__foot b { color: var(--ea-accent); font-weight: 600; }

/* =========================================================================
   10. Social proof (logo wordmarks)
   ========================================================================= */
.ea-proof { padding-block: clamp(var(--ea-sp-5), 6vh, var(--ea-sp-8)); }
.ea-proof + .ea-proof { padding-top: 0; }

/* Light-grey proof band (replaces dark social-proof strip) */
.ea-proof-band { background: #EAEAEC; }
.ea-proof-band--top  { border-top:    1px solid var(--ea-hairline); }
.ea-proof-band--bottom { border-bottom: 1px solid var(--ea-hairline); padding-bottom: clamp(48px, 7vh, 72px); }
.ea-proof-band .ea-proof__label { color: #5f5c57; }
.ea-proof-band .ea-logo-mark   { color: #6f6c66; }

.ea-logo-row.ea-logo-row--logos {
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  gap: clamp(14px, 2.2vw, 34px);
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}
.ea-logo-row--logos img {
  height: 38px;
  width: auto;
  max-width: 100%;
  min-width: 0;
  flex: 0 1 auto;
  object-fit: contain;
  display: block;
}
.ea-logo-row--logos img.ea-logo--tall { height: 52px; }
@media (max-width: 1040px) {
  .ea-logo-row--logos img { height: 32px; }
  .ea-logo-row--logos img.ea-logo--tall { height: 44px; }
}
@media (max-width: 760px) {
  .ea-logo-row--logos { flex-wrap: wrap; justify-content: center; gap: 24px 32px; }
  .ea-logo-row--logos img { height: 30px; }
  .ea-logo-row--logos img.ea-logo--tall { height: 42px; }
}

.ea-proof__label {
  text-align: center;
  font-size: 12px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--ea-warm-gray);
  margin-bottom: var(--ea-sp-4);  /* 32px */
}

.ea-logo-row {
  display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
  gap: var(--ea-sp-4) var(--ea-sp-7);  /* 32px 56px */
}
.ea-logo-mark {
  font-family: var(--ea-font-display);
  font-weight: 900;
  font-size: clamp(16px, 1.7vw, var(--ea-sp-3));  /* 16–24px */
  letter-spacing: -0.01em;
  color: #6c6e74; opacity: 0.85;
  transition: color .2s var(--ea-ease), opacity .2s var(--ea-ease);
  white-space: nowrap;
}
.ea-logo-mark:hover { color: var(--ea-accent); opacity: 1; }

.ea-proof__note {
  text-align: center;
  margin-top: var(--ea-sp-4);   /* 32px */
  font-size: 12px; color: var(--ea-warm-gray);
  max-width: 560px; margin-inline: auto;
}

/* =========================================================================
   11. Problem section
   ========================================================================= */
.ea-problem h2          { font-size: clamp(32px, 4.8vw, 56px); max-width: 16ch; }
.ea-problem__body       {
  margin-top: var(--ea-sp-4);  /* 32px */
  max-width: 620px; display: grid; gap: var(--ea-sp-3);  /* 24px */
}
.ea-problem__body p     {
  font-size: 17px; line-height: 1.62; color: var(--ea-txt-light-mute);
}
.ea-problem__body strong{ color: var(--ea-ink); font-weight: 700; }
.ea-problem__grid       {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: var(--ea-sp-7); align-items: start;  /* 56px */
}

/* =========================================================================
   12. Feature cards
   ========================================================================= */
.ea-card-grid  { display: grid; gap: var(--ea-sp-3); margin-top: var(--ea-sp-7); }  /* 24px gap, 56px top */
.ea-cols-3     { grid-template-columns: repeat(3, 1fr); }
.ea-cols-2     { grid-template-columns: repeat(2, 1fr); }

.ea-feature {
  padding: var(--ea-sp-4) var(--ea-sp-4) var(--ea-sp-4);  /* 32px */
  border-radius: var(--ea-radius);
  position: relative;
}
.ea-section--dark  .ea-feature,
.ea-section--dark-2 .ea-feature {
  background: rgba(255,255,255,0.025);
  border: 1px solid var(--ea-hairline-dark);
}
.ea-section--light .ea-feature,
.ea-section--white .ea-feature {
  background: var(--ea-white);
  border: 1px solid var(--ea-hairline);
  box-shadow: var(--ea-shadow-sm);
}
.ea-feature__ico {
  width: var(--ea-sp-6); height: var(--ea-sp-6);  /* 48px */
  border-radius: var(--ea-sp-2);                  /* 16px */
  background: rgba(160,206,255,0.12);
  border: 1px solid rgba(160,206,255,0.22);
  display: grid; place-items: center;
  color: var(--ea-accent);
  margin-bottom: var(--ea-sp-3);                  /* 24px */
}
.ea-feature__ico svg { width: 24px; height: 24px; }
.ea-feature h3       { font-size: var(--ea-sp-3); letter-spacing: -0.01em; line-height: 1.15; }  /* 24px */
.ea-section--light .ea-feature h3,
.ea-section--white .ea-feature h3  { color: var(--ea-ink); }
.ea-feature p        { margin-top: var(--ea-sp-1); font-size: 15px; line-height: 1.56; }
.ea-section--dark  .ea-feature p,
.ea-section--dark-2 .ea-feature p  { color: var(--ea-txt-dark-mute); }
.ea-section--light .ea-feature p,
.ea-section--white .ea-feature p   { color: var(--ea-txt-light-mute); }

/* — Stat tiles — */
.ea-stats {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: var(--ea-sp-3); margin-top: var(--ea-sp-4);  /* 24px, 32px */
}
.ea-stat {
  padding: var(--ea-sp-4) var(--ea-sp-4);  /* 32px */
  border-radius: var(--ea-radius);
  border: 1px solid var(--ea-hairline-dark);
  background: linear-gradient(180deg, rgba(160,206,255,0.05), rgba(255,255,255,0.012));
}
.ea-stat__num   {
  font-family: var(--ea-font-display); font-weight: 900;
  font-size: clamp(40px, 5vw, 64px); line-height: 1;
  color: var(--ea-accent); letter-spacing: -0.03em;
}
.ea-stat__label { margin-top: var(--ea-sp-2); font-size: 14px; color: var(--ea-txt-dark-mute); font-weight: 700; letter-spacing: 0.02em; }

.ea-center-note {
  text-align: center; margin-top: var(--ea-sp-5);  /* 40px */
  font-size: 15px; color: var(--ea-txt-dark-mute); font-weight: 700;
}
.ea-center-note .hl { color: var(--ea-accent); }

/* =========================================================================
   13. Curriculum accordion
   ========================================================================= */
.ea-curriculum__grid {
  display: grid; grid-template-columns: 1fr; gap: var(--ea-sp-2);  /* 16px */
  margin-top: var(--ea-sp-6); max-width: var(--ea-container-narrow);  /* 48px top */
}
.ea-module {
  border: 1px solid var(--ea-hairline);
  border-radius: var(--ea-radius);
  background: var(--ea-white);
  overflow: hidden;
  transition: border-color .2s var(--ea-ease), box-shadow .2s var(--ea-ease);
}
.ea-module.is-open {
  border-color: rgba(118,178,245,0.5);
  box-shadow: var(--ea-shadow-sm);
}
.ea-module__head {
  width: 100%; text-align: left; background: none; border: none;
  display: flex; align-items: center; gap: var(--ea-sp-3);  /* 24px */
  padding: var(--ea-sp-3) var(--ea-sp-4);  /* 24px 32px */
  color: var(--ea-ink);
}
.ea-module__idx    {
  font-family: var(--ea-font-mono); font-size: 12px;
  color: var(--ea-accent-deep); font-weight: 600; min-width: 32px;
}
.ea-module__title  {
  font-family: var(--ea-font-display); font-weight: 900;
  font-size: 18px; letter-spacing: -0.01em; flex: 1; line-height: 1.2;
}
.ea-module__toggle {
  width: var(--ea-sp-4); height: var(--ea-sp-4);  /* 32px */
  border-radius: 50%;
  border: 1px solid var(--ea-hairline);
  display: grid; place-items: center; flex-shrink: 0;
  color: var(--ea-ink);
  transition: transform .28s var(--ea-ease), background .2s var(--ea-ease), color .2s var(--ea-ease);
}
.ea-module.is-open .ea-module__toggle {
  transform: rotate(45deg); background: var(--ea-accent);
  border-color: var(--ea-accent); color: #0c1424;
}
.ea-module__toggle svg { width: 14px; height: 14px; }
.ea-module__meta   {
  font-family: var(--ea-font-mono); font-size: 12px;
  color: var(--ea-warm-gray); font-weight: 500; letter-spacing: 0.02em;
  white-space: nowrap; margin-left: var(--ea-sp-1);
}
.ea-module__panel  { height: 0; overflow: hidden; transition: height .3s var(--ea-ease); }
.ea-module__inner  { padding: 4px var(--ea-sp-4) var(--ea-sp-3) 80px; }  /* 32px right/left-indent */

.ea-lesson-list    { display: grid; }
.ea-lesson {
  display: grid; grid-template-columns: var(--ea-sp-3) 1fr; align-items: center;
  gap: var(--ea-sp-2);   /* 16px */
  padding: var(--ea-sp-2) 2px;
  border-top: 1px solid var(--ea-hairline);
}
.ea-lesson:first-child  { border-top: none; }
.ea-lesson__play        { color: var(--ea-accent-deep); display: grid; place-items: center; }
.ea-lesson__play svg    { width: 15px; height: 15px; }
.ea-lesson__title       { font-size: 15px; color: var(--ea-ink); font-weight: 400; line-height: 1.35; }

/* — Skills & Prompts library — */
.ea-library {
  margin-top: var(--ea-sp-9);   /* 72px */
  padding-top: var(--ea-sp-7);  /* 56px */
  border-top: 1px solid var(--ea-hairline);
}
.ea-library__head          {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: var(--ea-sp-3); flex-wrap: wrap;
}
.ea-library__head h3       {
  font-family: var(--ea-font-display); font-weight: 900;
  font-size: clamp(24px, 3vw, 40px); letter-spacing: -0.02em; color: var(--ea-ink);
}
.ea-library__head p        { color: var(--ea-txt-light-mute); font-size: 16px; max-width: 42ch; }
.ea-lib-group              { margin-top: var(--ea-sp-5); }   /* 40px */
.ea-lib-group__label       {
  display: flex; align-items: center; gap: var(--ea-sp-2);
  font-family: var(--ea-font-body); font-weight: 700; font-size: 13px;
  letter-spacing: 0.16em; text-transform: uppercase; color: var(--ea-accent-deep);
  margin-bottom: var(--ea-sp-3);  /* 24px */
}
.ea-lib-group__label .count {
  font-family: var(--ea-font-mono); font-size: 12px;
  color: var(--ea-warm-gray); letter-spacing: 0.04em; font-weight: 500; text-transform: none;
}
.ea-lib-group__label .rule { flex: 1; height: 1px; background: var(--ea-hairline); }

.ea-chips     { display: flex; flex-wrap: wrap; gap: var(--ea-sp-1); }
.ea-chip {
  display: inline-flex; align-items: center; gap: var(--ea-sp-1);
  font-size: 13px; font-weight: 500; color: var(--ea-ink);
  background: var(--ea-white); border: 1px solid var(--ea-hairline);
  border-radius: 999px; padding: var(--ea-sp-1) var(--ea-sp-2) var(--ea-sp-1) var(--ea-sp-2);
  transition: border-color .18s var(--ea-ease), transform .18s var(--ea-ease), box-shadow .18s var(--ea-ease);
}
.ea-chip:hover { border-color: rgba(118,178,245,0.6); transform: translateY(-1px); box-shadow: var(--ea-shadow-sm); }
.ea-chip::before {
  content: ""; width: var(--ea-sp-1); height: var(--ea-sp-1);  /* 8px dot */
  border-radius: 50%; background: var(--ea-accent); flex-shrink: 0;
}
.ea-chip--more {
  background: rgba(160,206,255,0.1); border-style: dashed;
  border-color: rgba(118,178,245,0.5); color: var(--ea-accent-deep);
  font-family: var(--ea-font-mono); font-size: 12px;
}
.ea-chip--more::before { display: none; }

/* =========================================================================
   14. Audience tabs
   ========================================================================= */
.ea-tabs   { margin-top: var(--ea-sp-7); }   /* 56px */
.ea-tabbar {
  display: flex; flex-wrap: wrap; gap: var(--ea-sp-1);
  border-bottom: 1px solid var(--ea-hairline-dark);
}
.ea-tab {
  background: none; border: none;
  padding: var(--ea-sp-2) var(--ea-sp-3);  /* 16px 24px */
  font-family: var(--ea-font-body); font-weight: 700; font-size: 15px;
  color: var(--ea-txt-dark-mute);
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  transition: color .18s var(--ea-ease), border-color .18s var(--ea-ease);
}
.ea-tab:hover       { color: var(--ea-txt-dark); }
.ea-tab.is-active   { color: var(--ea-accent); border-bottom-color: var(--ea-accent); }

.ea-tabpanels       { margin-top: var(--ea-sp-5); position: relative; }  /* 40px */
.ea-tabpanel        { display: none; }
.ea-tabpanel.is-active { display: block; animation: ea-fadeUp .4s var(--ea-ease) both; }

.ea-audience {
  display: grid; grid-template-columns: 0.8fr 1.2fr;
  gap: var(--ea-sp-5); align-items: start;  /* 40px */
}
.ea-audience__lead h3  { font-size: clamp(32px, 3.4vw, 48px); color: var(--ea-accent); }
.ea-audience__lead p   { margin-top: var(--ea-sp-2); color: var(--ea-txt-dark-mute); font-size: 16px; max-width: 30ch; }
.ea-audience__points   { display: grid; gap: var(--ea-sp-3); }  /* 24px */
.ea-point {
  display: flex; gap: var(--ea-sp-2); align-items: flex-start;
  padding-bottom: var(--ea-sp-3);   /* 24px */
  border-bottom: 1px solid var(--ea-hairline-dark-soft);
}
.ea-point:last-child { border-bottom: none; padding-bottom: 0; }
.ea-point__n { font-family: var(--ea-font-mono); font-size: 12px; color: var(--ea-accent); font-weight: 600; padding-top: 3px; min-width: var(--ea-sp-3); }
.ea-point p  { font-size: 16px; line-height: 1.55; color: var(--ea-txt-dark); }

/* =========================================================================
   15. Who built this
   ========================================================================= */
.ea-builder__lead {
  max-width: var(--ea-container-text);
  margin-top: var(--ea-sp-4);  /* 32px */
  font-size: 18px; line-height: 1.62; color: var(--ea-txt-light-mute);
}
.ea-builder__lead strong { color: var(--ea-ink); font-weight: 700; }

.ea-cred-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: var(--ea-sp-3); margin-top: var(--ea-sp-7);  /* 24px, 56px */
}
.ea-cred {
  padding: var(--ea-sp-4);  /* 32px */
  border-radius: var(--ea-radius);
  background: var(--ea-white);
  border: 1px solid var(--ea-hairline);
  border-top: 3px solid var(--ea-accent);
  box-shadow: var(--ea-shadow-sm);
}
.ea-cred h3 { font-size: 18px; color: var(--ea-ink); letter-spacing: -0.01em; }
.ea-cred p  { margin-top: var(--ea-sp-1); font-size: 14px; line-height: 1.55; color: var(--ea-txt-light-mute); }

/* =========================================================================
   16. Pricing
   ========================================================================= */
.ea-pricing__wrap {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: var(--ea-sp-6); align-items: center;
  max-width: 1000px; margin: var(--ea-sp-7) auto 0;  /* 48px gap, 56px top */
}
.ea-pricing__sell h3 { font-size: clamp(24px, 3vw, 40px); color: var(--ea-txt-dark); line-height: 1.1; }
.ea-pricing__sell p  { margin-top: var(--ea-sp-3); color: var(--ea-txt-dark-mute); font-size: 16px; max-width: 38ch; }

.ea-guarantee-inline {
  margin-top: var(--ea-sp-4);   /* 32px */
  display: flex; gap: var(--ea-sp-2); align-items: flex-start;
  padding: var(--ea-sp-3);      /* 24px */
  border: 1px solid var(--ea-hairline-dark);
  border-left: 3px solid var(--ea-accent);
  border-radius: var(--wp--custom--radius--sm);
  background: rgba(255,255,255,0.02);
}
.ea-guarantee-inline .shield { color: var(--ea-accent); flex-shrink: 0; margin-top: 2px; }
.ea-guarantee-inline p       { margin: 0; font-size: 14px; color: var(--ea-txt-dark-mute); }
.ea-guarantee-inline b       { color: var(--ea-txt-dark); }

.ea-pricecard {
  background: linear-gradient(180deg, #1a1c22 0%, #141519 100%);
  border: 1px solid var(--ea-hairline-dark);
  border-radius: var(--ea-radius-lg);
  padding: var(--ea-sp-5) var(--ea-sp-5);  /* 40px */
  box-shadow: var(--ea-shadow-card);
  position: relative; overflow: hidden;
}
.ea-pricecard::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--ea-accent), transparent);
}
.ea-pricecard__eyebrow {
  font-size: 12px; font-weight: 700; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--ea-warm-gray);
}
.ea-pricecard__price   {
  display: flex; align-items: baseline; gap: var(--ea-sp-2);
  margin-top: var(--ea-sp-2); flex-wrap: wrap;
}
.ea-pricecard__amount  {
  font-family: var(--ea-font-display); font-weight: 900;
  font-size: var(--ea-sp-8); letter-spacing: -0.03em;  /* 64px */
  color: var(--ea-txt-dark); line-height: 1;
}
.ea-pricecard__plan    { font-size: 13px; color: var(--ea-txt-dark-mute); }
.ea-pricecard__list    { margin: var(--ea-sp-4) 0; display: grid; gap: var(--ea-sp-2); }  /* 32px, 16px */
.ea-pricecard__list li {
  display: flex; gap: var(--ea-sp-2); align-items: flex-start;
  font-size: 14px; color: var(--ea-txt-dark); line-height: 1.45;
}
.ea-pricecard__list .tick { color: var(--ea-accent); flex-shrink: 0; margin-top: 1px; }
.ea-pricecard__reassure   {
  text-align: center; margin-top: var(--ea-sp-2);
  font-size: 12px; color: var(--ea-warm-gray);
}

/* =========================================================================
   17. Final CTA
   ========================================================================= */
.ea-finalcta { text-align: center; overflow: hidden; }
.ea-finalcta__watermark {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);
  width: 46%; max-width: 460px; opacity: 0.05; pointer-events: none; z-index: 0;
}
.ea-finalcta .ea-container { position: relative; z-index: 1; }
.ea-finalcta h2 { font-size: clamp(32px, 5.6vw, 80px); line-height: 0.98; }
.ea-finalcta h2 .l2 { color: var(--ea-accent); display: block; }
.ea-finalcta p { margin-top: var(--ea-sp-3); font-size: clamp(16px, 1.6vw, var(--ea-sp-3)); color: var(--ea-txt-dark-mute); }
.ea-finalcta .ea-btn { margin-top: var(--ea-sp-5); }  /* 40px */

/* =========================================================================
   18. FAQ
   ========================================================================= */
.ea-faq__grid  {
  max-width: 880px; margin: var(--ea-sp-7) auto 0;  /* 56px */
  display: grid; gap: 0;
}
.ea-faq-item        { border-bottom: 1px solid var(--ea-hairline); }
.ea-faq-item:first-child { border-top: 1px solid var(--ea-hairline); }
.ea-faq-item__head  {
  width: 100%; text-align: left; background: none; border: none;
  display: flex; align-items: center; gap: var(--ea-sp-3);  /* 24px */
  padding: var(--ea-sp-4) var(--ea-sp-1);   /* 32px 8px */
  color: var(--ea-ink);
}
.ea-faq-item__q     {
  font-family: var(--ea-font-display); font-weight: 900;
  font-size: 18px; letter-spacing: -0.01em; flex: 1; line-height: 1.3;
}
.ea-faq-item__toggle {
  flex-shrink: 0; color: var(--ea-accent-deep);
  transition: transform .28s var(--ea-ease);
}
.ea-faq-item.is-open .ea-faq-item__toggle { transform: rotate(45deg); }
.ea-faq-item__toggle svg { width: 18px; height: 18px; }
.ea-faq-item__panel { height: 0; overflow: hidden; transition: height .3s var(--ea-ease); }
.ea-faq-item__inner { padding: 0 var(--ea-sp-1) var(--ea-sp-4); max-width: var(--ea-container-text); }
.ea-faq-item__inner p { color: var(--ea-txt-light-mute); font-size: 16px; line-height: 1.62; }

/* =========================================================================
   19. Footer
   ========================================================================= */
.ea-footer {
  background: var(--ea-bg-dark);
  padding-block: var(--ea-sp-7);  /* 56px */
  border-top: 1px solid var(--ea-hairline-dark);
}
.ea-footer__top   {
  display: flex; justify-content: space-between; align-items: flex-start;
  gap: var(--ea-sp-4); flex-wrap: wrap;
}
.ea-footer .ea-logo { font-size: 21px; }
.ea-footer__contact {
  display: grid; gap: var(--ea-sp-1); margin-top: var(--ea-sp-3);
  font-size: 14px; color: var(--ea-txt-dark-mute);
}
.ea-footer__contact a:hover { color: var(--ea-accent); }
.ea-footer__links           {
  display: flex; gap: var(--ea-sp-3);
  font-size: 13px; color: var(--ea-warm-gray);
}
.ea-footer__links a:hover   { color: var(--ea-accent); }
.ea-footer__nav             {
  display: flex; gap: var(--ea-sp-3);
  font-size: 14px; color: var(--ea-warm-gray);
}
.ea-footer__nav a:hover { color: var(--ea-accent); }
.ea-footer__bottom  {
  margin-top: var(--ea-sp-5); padding-top: var(--ea-sp-3);
  border-top: 1px solid var(--ea-hairline-dark-soft);
  display: flex; justify-content: space-between; gap: var(--ea-sp-2); flex-wrap: wrap;
  font-size: 13px; color: var(--ea-warm-gray);
}

/* =========================================================================
   20. Placeholder treatment
   ========================================================================= */
.ea-ph {
  font-family: var(--ea-font-mono); font-size: 0.82em;
  font-weight: 500; letter-spacing: 0.01em;
  color: var(--ea-accent-deep);
  background: rgba(160,206,255,0.10);
  border: 1px dashed rgba(118,178,245,0.55);
  border-radius: 5px; padding: 1px var(--ea-sp-1);
  white-space: nowrap;
}
.ea-section--dark .ea-ph, .ea-section--dark-2 .ea-ph { color: var(--ea-accent); }

/* =========================================================================
   21. Scroll reveal
   ========================================================================= */
.ea-reveal { opacity: 1; }
html.ea-anim .ea-reveal { transform: translateY(20px); transition: transform .7s var(--ea-ease); }
html.ea-anim .ea-reveal.is-in { transform: none; }
.ea-reveal.d1 { transition-delay: .07s; }
.ea-reveal.d2 { transition-delay: .14s; }
.ea-reveal.d3 { transition-delay: .21s; }
.ea-reveal.d4 { transition-delay: .28s; }
.ea-reveal.d5 { transition-delay: .35s; }

@keyframes ea-fadeUp {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .ea-reveal { opacity: 1 !important; transform: none !important; transition: none; }
  * { animation-duration: .001ms !important; }
}

/* =========================================================================
   22. Site nav / page tabs + CTA band + page-top offset + video slot
   ========================================================================= */
.ea-site-header__right {
  display: flex;
  align-items: center;
  gap: 22px;
}
.ea-site-nav {
  display: flex;
  gap: 4px;
}
.ea-nav-tab {
  font-family: var(--ea-font-body);
  font-weight: 700;
  font-size: 14px;
  color: var(--ea-txt-dark-mute);
  padding: 8px 14px;
  border-radius: 8px;
  transition: color .18s var(--ea-ease), background .18s var(--ea-ease);
}
.ea-nav-tab:hover { color: var(--ea-txt-dark); }
.ea-nav-tab.is-active {
  color: var(--ea-accent);
  background: rgba(160, 206, 255, 0.10);
}

.ea-cta-band {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 36px;
  flex-wrap: wrap;
}
.ea-cta-band .ea-section-title { font-size: clamp(28px, 3.6vw, 46px); }
.ea-cta-band__copy { max-width: 640px; }
.ea-cta-band .ea-lead { margin-top: 16px; }
.ea-cta-band .ea-btn { flex-shrink: 0; }

.ea-section--page-top {
  padding-top: clamp(122px, 16vh, 172px);
}

/* Video slot (16:9 placeholder for intro video) */
.ea-video-slot {
  position: relative;
  width: 100%; max-width: 960px;
  margin: var(--ea-sp-6) auto 0;
  aspect-ratio: 16 / 9;
  border-radius: var(--ea-radius-lg);
  border: 1px dashed rgba(118, 178, 245, 0.45);
  background:
    repeating-linear-gradient(135deg, rgba(160,206,255,0.045) 0 14px, transparent 14px 28px),
    linear-gradient(180deg, #16181d 0%, #121317 100%);
  display: grid;
  place-items: center;
  overflow: hidden;
}
.ea-video-slot video,
.ea-video-slot iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.ea-video-slot__inner {
  display: flex; flex-direction: column; align-items: center; gap: 14px;
  text-align: center; padding: var(--ea-sp-3);
}
.ea-video-slot__play {
  width: 74px; height: 74px; border-radius: 50%;
  background: rgba(160, 206, 255, 0.12);
  border: 1px solid rgba(160, 206, 255, 0.30);
  display: grid; place-items: center;
  color: var(--ea-accent);
}
.ea-video-slot__play svg { width: 28px; height: 28px; margin-left: 4px; }
.ea-video-slot__label { font-weight: 700; font-size: 16px; color: var(--ea-txt-dark); }
.ea-video-slot__hint { font-family: var(--ea-font-mono); font-size: 12px; color: var(--ea-warm-gray); letter-spacing: 0.02em; }

/* =========================================================================
   23. Responsive breakpoints
   ========================================================================= */
@media (max-width: 980px) {
  .ea-hero__grid     { grid-template-columns: 1fr; gap: var(--ea-sp-6); }
  .ea-hero__visual   { order: 2; max-width: 520px; }
  .ea-problem__grid  { grid-template-columns: 1fr; gap: var(--ea-sp-4); }
  .ea-cols-3         { grid-template-columns: 1fr 1fr; }
  .ea-cred-grid      { grid-template-columns: 1fr 1fr; }
  .ea-pricing__wrap  { grid-template-columns: 1fr; gap: var(--ea-sp-5); }
  .ea-audience       { grid-template-columns: 1fr; gap: var(--ea-sp-3); }
}
@media (max-width: 760px) {
  .ea-site-nav { display: none; }
}
@media (max-width: 680px) {
  .ea-container      { padding: 0 var(--ea-sp-3); }
  .ea-cols-3, .ea-cols-2, .ea-cred-grid, .ea-stats { grid-template-columns: 1fr; }
  .ea-hero           { padding-top: calc(var(--ea-header-h) + var(--ea-sp-8)); }
  .ea-hero__cta      { gap: var(--ea-sp-2); }
  .ea-hero__cta .ea-btn { width: 100%; }
  .ea-footer__top    { flex-direction: column; }
  .ea-logo-row       { gap: var(--ea-sp-3) var(--ea-sp-4); }
  .ea-tabbar         { gap: 4px; }
  .ea-tab            { padding: var(--ea-sp-2) var(--ea-sp-2); font-size: 14px; }
  .ea-module__inner  { padding-left: var(--ea-sp-4); }
  .ea-module__meta   { display: none; }
  .ea-pricecard      { padding: var(--ea-sp-4) var(--ea-sp-3); }
  .ea-cta-band .ea-btn { width: 100%; }
}
