/* ============================================================
   Ephesus Academy — Landing page motion & polish (front-page only)
   Additive: scroll-reveal, hero animation, count-up, rich hovers.
   Respects prefers-reduced-motion. Brand tokens from main.css.
   ============================================================ */

/* ---- scroll-reveal (only active once JS adds .ea-anim) ---- */
.ea-anim .ea-rv{opacity:0;transform:translateY(28px);transition:opacity .7s cubic-bezier(.2,.7,.3,1),transform .7s cubic-bezier(.2,.7,.3,1);will-change:opacity,transform}
.ea-anim .ea-rv.ea-in{opacity:1;transform:none}
.ea-anim .ea-rv--scale{transform:translateY(18px) scale(.96)}
.ea-anim .ea-rv--scale.ea-in{transform:none}
.ea-anim .ea-rv--left{transform:translateX(-32px)}
.ea-anim .ea-rv--left.ea-in{transform:none}

/* ---- HERO — theme-aware (flips light/dark like the hub) + entrance + orbs ---- */
.ea-hero--home{position:relative;overflow:hidden;isolation:isolate}
.ea-hero--home::before{content:none}
.ea-hero--home .ea-hero__inner{position:relative;z-index:2}
/* LIGHT (default) — light gradient, dark text (theme tokens), light media card */
.ea-hero--home{background:linear-gradient(160deg,var(--ea-navy-50) 0%,var(--ea-bg) 100%);color:var(--ea-text)}
.ea-hero--home .ea-hero__media{position:relative;overflow:hidden;background:var(--ea-navy-50);border:1px solid var(--ea-border)}
.ea-hero--home .ea-hero__vcap{color:var(--ea-text-muted)}
.ea-hero--home .ea-hero__play{background:var(--ea-gold);color:#111;box-shadow:0 8px 22px var(--ea-cta-glow);transition:transform .25s cubic-bezier(.34,1.56,.64,1)}
.ea-hero--home .ea-hero__media:hover .ea-hero__play{transform:scale(1.12)}
/* DARK — dramatic navy gradient + light text (data-theme is always concrete via the pre-paint controller) */
[data-theme="dark"] .ea-hero--home{background:linear-gradient(158deg,var(--ea-navy-50) 0%,var(--ea-navy-100) 52%,var(--ea-navy-200) 100%);color:#fff}
[data-theme="dark"] .ea-hero--home .ea-hero__title{color:#fff}
[data-theme="dark"] .ea-hero--home .ea-hero__subtitle{color:rgba(255,255,255,.82)}
[data-theme="dark"] .ea-hero--home .ea-hero__eyebrow{color:var(--ea-gold-200);background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.20)}
[data-theme="dark"] .ea-hero--home .ea-hero__free{color:var(--ea-gold-200)}
[data-theme="dark"] .ea-hero--home .ea-btn--outline{color:#fff;border-color:rgba(255,255,255,.42);background:transparent}
[data-theme="dark"] .ea-hero--home .ea-btn--outline:hover{background:rgba(255,255,255,.12);border-color:#fff}
[data-theme="dark"] .ea-hero--home .ea-hero__media{background:linear-gradient(140deg,rgba(255,255,255,.14),rgba(255,255,255,.04));border-color:rgba(255,255,255,.18)}
[data-theme="dark"] .ea-hero--home .ea-hero__vcap{color:rgba(255,255,255,.72)}
/* JS-off fallback: honour OS dark for the hero too */
@media (prefers-color-scheme: dark){
  html:not([data-theme="light"]) .ea-hero--home{background:linear-gradient(158deg,var(--ea-navy-50) 0%,var(--ea-navy-100) 52%,var(--ea-navy-200) 100%);color:#fff}
  html:not([data-theme="light"]) .ea-hero--home .ea-hero__title{color:#fff}
  html:not([data-theme="light"]) .ea-hero--home .ea-hero__subtitle{color:rgba(255,255,255,.82)}
  html:not([data-theme="light"]) .ea-hero--home .ea-hero__eyebrow{color:var(--ea-gold-200);background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.20)}
  html:not([data-theme="light"]) .ea-hero--home .ea-hero__free{color:var(--ea-gold-200)}
  html:not([data-theme="light"]) .ea-hero--home .ea-btn--outline{color:#fff;border-color:rgba(255,255,255,.42)}
  html:not([data-theme="light"]) .ea-hero--home .ea-hero__media{background:linear-gradient(140deg,rgba(255,255,255,.14),rgba(255,255,255,.04));border-color:rgba(255,255,255,.18)}
  html:not([data-theme="light"]) .ea-hero--home .ea-hero__vcap{color:rgba(255,255,255,.72)}
}

/* accent word: drawing gold underline (works on light or dark) */
.ea-hero--home .ea-hero__title-accent{position:relative;color:var(--ea-gold);z-index:0}
.ea-hero--home .ea-hero__title-accent::after{content:"";position:absolute;left:-2px;right:-2px;bottom:4px;height:11px;background:var(--ea-underline);border-radius:3px;transform:scaleX(0);transform-origin:left;z-index:-1}
.ea-anim .ea-hero--home .ea-hero__title-accent::after{animation:ea-draw .65s cubic-bezier(.2,.7,.3,1) 1s forwards}
@keyframes ea-draw{to{transform:scaleX(1)}}

/* floating orbs (injected by motion.js) — subtle in light, brighter in dark */
.ea-hero__orb{position:absolute;border-radius:50%;pointer-events:none;z-index:1;filter:blur(3px)}
.ea-hero__orb--1{width:230px;height:230px;background:var(--ea-navy-300);opacity:.28;top:-60px;right:6%;animation:ea-float 7s ease-in-out infinite}
.ea-hero__orb--2{width:140px;height:140px;background:var(--ea-gold);opacity:.14;bottom:-40px;left:10%;animation:ea-float2 9.5s ease-in-out infinite}
.ea-hero__orb--3{width:90px;height:90px;background:var(--ea-navy-200);opacity:.4;top:42%;left:40%;animation:ea-float 8s ease-in-out infinite}
[data-theme="dark"] .ea-hero__orb--1{background:var(--ea-navy-500);opacity:.45}
[data-theme="dark"] .ea-hero__orb--3{background:var(--ea-navy-400);opacity:.4}
@media (prefers-color-scheme: dark){
  html:not([data-theme="light"]) .ea-hero__orb--1{background:var(--ea-navy-500);opacity:.45}
  html:not([data-theme="light"]) .ea-hero__orb--3{background:var(--ea-navy-400);opacity:.4}
}
@keyframes ea-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-18px)}}
@keyframes ea-float2{0%,100%{transform:translate(0,0)}50%{transform:translate(-12px,16px)}}

/* hero entrance stagger (on load) */
@keyframes ea-hero-in{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
.ea-anim .ea-hero--home .ea-hero__eyebrow{opacity:0;animation:ea-hero-in .7s cubic-bezier(.2,.7,.3,1) .10s both}
.ea-anim .ea-hero--home .ea-hero__title{opacity:0;animation:ea-hero-in .7s cubic-bezier(.2,.7,.3,1) .20s both}
.ea-anim .ea-hero--home .ea-hero__subtitle{opacity:0;animation:ea-hero-in .7s cubic-bezier(.2,.7,.3,1) .30s both}
.ea-anim .ea-hero--home .ea-hero__free{opacity:0;animation:ea-hero-in .7s cubic-bezier(.2,.7,.3,1) .38s both}
.ea-anim .ea-hero--home .ea-hero__ctas{opacity:0;animation:ea-hero-in .7s cubic-bezier(.2,.7,.3,1) .46s both}
.ea-anim .ea-hero--home .ea-hero__media{opacity:0;animation:ea-hero-in .8s cubic-bezier(.2,.7,.3,1) .54s both}

/* ---- gold button: shine sweep + lift + arrow nudge ---- */
.ea-btn--gold{position:relative;overflow:hidden}
.ea-btn--gold::after{content:"";position:absolute;top:0;left:-130%;width:55%;height:100%;background:linear-gradient(105deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-18deg);transition:left .6s ease;pointer-events:none}
.ea-btn--gold:hover{transform:translateY(-3px);box-shadow:0 14px 30px var(--ea-cta-glow-strong)}
.ea-btn--gold:hover::after{left:140%}
.ea-btn svg{transition:transform .2s ease}
.ea-btn--gold:hover svg,.ea-btn--accent:hover svg,.ea-btn--outline:hover svg{transform:translateX(4px)}

/* ---- stats: hover lift + icon ---- */
.ea-stats__item{transition:transform .2s ease}
.ea-stats__item:hover{transform:translateY(-4px)}
.ea-stats__item:hover .ea-stats__icon{color:var(--ea-gold)}
.ea-stats__icon{transition:color .2s ease}

/* ---- spotlight: lift + cover zoom ---- */
.ea-spotlight{transition:transform .28s cubic-bezier(.2,.7,.3,1),box-shadow .28s ease}
.ea-spotlight:hover{transform:translateY(-6px);box-shadow:var(--ea-shadow-xl)}
.ea-spotlight__cover{overflow:hidden}
.ea-spotlight__cover-img{transition:transform .5s cubic-bezier(.2,.7,.3,1)}
.ea-spotlight:hover .ea-spotlight__cover-img{transform:scale(1.06)}

/* ---- mini cards: slide + shadow ---- */
.ea-mini-card{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.ea-mini-card:hover{transform:translateX(5px);box-shadow:var(--ea-shadow-lg);border-color:var(--ea-navy-200)}
.ea-mini-card__cover{transition:transform .3s ease}
.ea-mini-card:hover .ea-mini-card__cover{transform:scale(1.05)}

/* ---- expect cards: lift + icon pop ---- */
.ea-expect__card{transition:transform .24s cubic-bezier(.2,.7,.3,1),box-shadow .24s ease}
.ea-expect__card:hover{transform:translateY(-6px);box-shadow:var(--ea-shadow-lg)}
.ea-expect__icon{transition:transform .28s cubic-bezier(.34,1.56,.64,1)}
.ea-expect__card:hover .ea-expect__icon{transform:scale(1.1) rotate(-4deg)}

/* ---- category cards: lift + top-border draw + icon pop ---- */
.ea-category-card{position:relative;overflow:hidden;transition:transform .22s cubic-bezier(.2,.7,.3,1),box-shadow .22s ease,border-color .22s ease}
.ea-category-card::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;transform:scaleX(0);transform-origin:left;transition:transform .26s ease;background:var(--ea-accent)}
.ea-category-card--indigo::before{background:var(--ea-cat-theology)}
.ea-category-card--gold::before{background:var(--ea-cat-leadership)}
.ea-category-card--pink::before{background:var(--ea-cat-family)}
.ea-category-card--green::before{background:var(--ea-cat-ministry)}
.ea-category-card:hover{transform:translateY(-6px);box-shadow:var(--ea-shadow-lg)}
.ea-category-card:hover::before{transform:scaleX(1)}
.ea-category-card__icon{transition:transform .26s cubic-bezier(.34,1.56,.64,1)}
.ea-category-card:hover .ea-category-card__icon{transform:scale(1.12) rotate(-5deg)}

/* ---- testimonials: lift ---- */
.ea-testimonial-card{transition:transform .24s cubic-bezier(.2,.7,.3,1),box-shadow .24s ease}
.ea-testimonial-card:hover{transform:translateY(-5px);box-shadow:var(--ea-shadow-lg)}

/* ---- give band + CTA: subtle hover on buttons already covered; give band lift ---- */
.ea-give-band{transition:box-shadow .25s ease,transform .25s ease}
.ea-give-band:hover{box-shadow:var(--ea-shadow-lg)}

/* ---- FAQ item: smooth hover ---- */
.ea-faq__item{transition:border-color .2s ease,box-shadow .2s ease}
.ea-faq__item:hover{border-color:var(--ea-navy-200)}


/* ============================================================
   SITE-WIDE — card hovers, button polish, focus ring, reveals
   ============================================================ */

/* course cards (archive / related) — enhance the existing lift with a cover zoom */
.ea-course-card{transition:transform .22s cubic-bezier(.2,.7,.3,1),box-shadow .22s ease,border-color .22s ease}
.ea-course-card__cover{overflow:hidden}
.ea-course-card__cover-img{transition:transform .5s cubic-bezier(.2,.7,.3,1)}
.ea-course-card:hover .ea-course-card__cover-img{transform:scale(1.06)}

/* instructor cards */
.ea-instructor-grid-card{transition:transform .22s cubic-bezier(.2,.7,.3,1),box-shadow .22s ease,border-color .22s ease}
.ea-instructor-grid-card:hover{transform:translateY(-5px);box-shadow:var(--ea-shadow-lg)}
.ea-instructor-grid-card__avatar,.ea-instructor-grid-card__avatar-placeholder{transition:transform .26s cubic-bezier(.34,1.56,.64,1)}
.ea-instructor-grid-card:hover .ea-instructor-grid-card__avatar,.ea-instructor-grid-card:hover .ea-instructor-grid-card__avatar-placeholder{transform:scale(1.08)}

/* about "our values" cards */
.ea-about-values__item{transition:transform .24s cubic-bezier(.2,.7,.3,1),box-shadow .24s ease}
.ea-about-values__item:hover{transform:translateY(-6px);box-shadow:var(--ea-shadow-lg)}
.ea-about-values__icon{transition:transform .28s cubic-bezier(.34,1.56,.64,1)}
.ea-about-values__item:hover .ea-about-values__icon{transform:scale(1.1) rotate(-4deg)}

/* buttons — subtle lift site-wide (gold shine already defined above) */
.ea-btn{transition:transform .18s ease,box-shadow .18s ease,background .18s ease,border-color .18s ease,color .18s ease}
.ea-btn--accent:hover,.ea-btn--outline:hover,.ea-btn--outline-light:hover{transform:translateY(-2px)}

/* tabs / breadcrumb / faq chevrons keep smooth */
.ea-tabs__tab{transition:color .18s ease,border-color .18s ease}
.ea-faq__chevron{transition:transform .25s ease}

/* keyboard focus ring — Blueprint accessibility rule (site-wide) */
:focus-visible{outline:2px solid var(--ea-gold);outline-offset:2px;border-radius:3px}
.ea-btn:focus-visible{outline-offset:3px}

/* ---- reduced motion: honour user preference across the whole site ---- */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .ea-hero__orb{display:none!important}
  .ea-btn--gold::after{display:none!important}
  .ea-anim .ea-rv{opacity:1!important;transform:none!important}
  .ea-hero--home .ea-hero__title-accent::after{transform:scaleX(1)!important}
}

/* ============================================================
   HEADER — theme toggle (hub-style circular button + gold dot) + logo swap
   ============================================================ */
.ea-header__theme-toggle{position:relative;width:42px;height:42px;border-radius:50%;border:1px solid var(--ea-border);background:var(--ea-surface-hover);color:var(--ea-text-secondary);display:inline-flex;align-items:center;justify-content:center;transition:color .18s ease,background .18s ease,border-color .18s ease}
.ea-header__theme-toggle:hover{color:var(--ea-text);border-color:var(--ea-border-hover);background:var(--ea-bg-muted)}
.ea-header__theme-toggle svg{width:20px;height:20px}
/* gold "explicit choice" dot (bottom-right) */
.ea-header__theme-dot{position:absolute;right:7px;bottom:7px;width:7px;height:7px;border-radius:50%;background:var(--ea-gold);box-shadow:0 0 0 2px var(--ea-surface-hover);display:none;pointer-events:none;transition:box-shadow .18s ease}
.ea-header__theme-toggle:hover .ea-header__theme-dot{box-shadow:0 0 0 2px var(--ea-bg-muted)}
/* match the other header action buttons to the same circular pill */
.ea-header__search-toggle{width:42px;height:42px;border-radius:50%;border:1px solid var(--ea-border);background:var(--ea-surface-hover);color:var(--ea-text-secondary);display:inline-flex;align-items:center;justify-content:center;transition:color .18s ease,background .18s ease,border-color .18s ease}
.ea-header__search-toggle:hover{color:var(--ea-text);border-color:var(--ea-border-hover);background:var(--ea-bg-muted)}
/* Match the theme toggle's 20px icon (:182). This button was resized 36px->42px here but
   its svg was left at main.css's 16px, so the magnifier sat visibly smaller than the moon
   in the identical neighbouring circle. */
.ea-header__search-toggle svg{width:20px;height:20px}

/* logo emblem swap — black in light, white in dark (data-theme is always concrete) */
.ea-header__logo-icon{display:inline-flex;align-items:center;background:none !important;width:auto;height:auto;min-width:0;padding:0;border-radius:0;box-shadow:none}
.ea-header__logo-icon img{width:38px;height:38px;display:block}
.ea-header__logo-icon .ea-logo-light{display:block}
.ea-header__logo-icon .ea-logo-dark{display:none}
[data-theme="dark"] .ea-header__logo-icon .ea-logo-light{display:none}
[data-theme="dark"] .ea-header__logo-icon .ea-logo-dark{display:block}
@media (prefers-color-scheme: dark){
  html:not([data-theme="light"]) .ea-header__logo-icon .ea-logo-light{display:none}
  html:not([data-theme="light"]) .ea-header__logo-icon .ea-logo-dark{display:block}
}

/* Dark hero: keep the media panel navy (don't flood it with the cream CTA fill) */
[data-theme="dark"] .ea-hero--home .ea-hero__play{background:transparent;box-shadow:none}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]) .ea-hero--home .ea-hero__play{background:transparent;box-shadow:none}}

/* fail-safe reveal: guarantee content is visible even if the IntersectionObserver/transition is interrupted */
html.ea-rv-safe .ea-rv{opacity:1!important;transform:none!important}

/* ============================================================
   MOTION & HOVER UPGRADE (v2.19.0) — premium micro-interactions
   ============================================================ */
@media (prefers-reduced-motion: no-preference){
  /* Buttons: spring raise + shadow bloom + press, CTA arrow slide */
  .ea-btn{ transition:transform .18s cubic-bezier(.34,1.56,.64,1), box-shadow .22s ease, background-color .18s ease, border-color .18s ease, color .18s ease; }
  .ea-btn:hover{ transform:translateY(-2px); }
  .ea-btn:active{ transform:translateY(0) scale(.98); }
  .ea-btn--accent:hover{ box-shadow:0 9px 22px var(--ea-accent-bg); }
  .ea-btn svg{ transition:transform .25s cubic-bezier(.34,1.56,.64,1); }
  .ea-btn:hover svg{ transform:translateX(3px); }

  /* Course cards: lift + cover zoom + sheen sweep + icon pop */
  .ea-course-card{ transition:transform .3s cubic-bezier(.34,1.56,.64,1), box-shadow .3s ease, border-color .25s ease; }
  .ea-course-card:hover{ transform:translateY(-6px); box-shadow:var(--ea-shadow-lg); }
  .ea-course-card__cover{ position:relative; overflow:hidden; }
  .ea-course-card__cover-img{ transition:transform .55s cubic-bezier(.2,.6,.2,1); }
  .ea-course-card:hover .ea-course-card__cover-img{ transform:scale(1.07); }
  .ea-course-card__cover-icon{ transition:transform .4s cubic-bezier(.34,1.56,.64,1); }
  .ea-course-card:hover .ea-course-card__cover-icon{ transform:scale(1.12) rotate(-3deg); }
  .ea-course-card__cover::before{ content:""; position:absolute; inset:0; background:linear-gradient(120deg,transparent 32%,rgba(255,255,255,.20) 50%,transparent 68%); transform:translateX(-130%); transition:transform .8s ease; z-index:1; pointer-events:none; }
  .ea-course-card:hover .ea-course-card__cover::before{ transform:translateX(130%); }

  /* Category cards (landing): lift + icon spin-pop */
  .ea-category-card{ transition:transform .28s cubic-bezier(.34,1.56,.64,1), box-shadow .28s ease, border-color .25s; }
  .ea-category-card:hover{ transform:translateY(-5px); }
  .ea-category-card__icon{ transition:transform .35s cubic-bezier(.34,1.56,.64,1); }
  .ea-category-card:hover .ea-category-card__icon{ transform:scale(1.12) rotate(4deg); }

  /* Instructor directory + spotlight/mini */
  .ea-instructor-dir-card{ transition:transform .28s cubic-bezier(.34,1.56,.64,1), box-shadow .28s ease, border-color .25s; }
  .ea-instructor-dir-card:hover{ transform:translateY(-5px); }
  .ea-instructor-dir-card__avatar img{ transition:transform .5s ease; }
  .ea-instructor-dir-card:hover .ea-instructor-dir-card__avatar img{ transform:scale(1.06); }
  .ea-mini-card{ transition:transform .25s ease, box-shadow .25s ease; }
  .ea-mini-card:hover{ transform:translateX(3px); }

  /* Course-page body links: underline slide-in */
  .ea-cscope a:not(.ea-btn){ background-image:linear-gradient(currentColor,currentColor); background-size:0% 1.5px; background-position:0 100%; background-repeat:no-repeat; transition:background-size .3s ease, color .2s ease; }
  .ea-cscope a:not(.ea-btn):hover{ background-size:100% 1.5px; }

  /* Studio micro-interactions */
  .ea-st-pane{ transition:background-color .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease; }
  .ea-st-pane:not(.on):hover{ transform:translateY(-1px); }
  .ea-st-console .ea-st-rtab{ transition:background-color .18s ease, color .18s ease, padding-left .2s ease; }
  .ea-st-console .ea-st-rtab:not(.on):hover{ padding-left:14px; }
  .ea-st-icard{ transition:transform .25s cubic-bezier(.34,1.56,.64,1), box-shadow .25s, border-color .2s; }
  .ea-st-icard:hover{ transform:translateY(-3px); }
  .ea-st-hchip{ transition:transform .18s ease, border-color .18s ease, background-color .18s; }
  .ea-st-row{ transition:background-color .16s ease; }
}

/* Focus-visible rings (always on, accessibility) */
.ea-btn:focus-visible,.ea-header__nav-link:focus-visible,.ea-course-card a:focus-visible,.ea-category-card:focus-visible,.ea-instructor-dir-card:focus-visible{ outline:2px solid var(--ea-accent); outline-offset:2px; border-radius:6px; }

@media (prefers-reduced-motion: reduce){
  .ea-btn,.ea-course-card,.ea-course-card__cover-img,.ea-course-card__cover-icon,.ea-category-card,.ea-category-card__icon,.ea-instructor-dir-card,.ea-mini-card,.ea-st-pane,.ea-st-console .ea-st-rtab,.ea-st-icard,.ea-st-hchip{ transition:none !important; }
  .ea-btn:hover,.ea-course-card:hover,.ea-category-card:hover,.ea-instructor-dir-card:hover,.ea-mini-card:hover{ transform:none !important; }
  .ea-course-card__cover::before{ display:none !important; }
  .ea-cscope a:not(.ea-btn){ background:none !important; }
}