/* --------------------------------------------------------------------------
   Shared hero polish + first-paint entrance animations (all pages)
   Load after page-specific CSS.
   Text enters from above (descends into place) for a premium feel.
   -------------------------------------------------------------------------- */

/* Primary headline / titles: slightly longer travel, crisp landing */
@keyframes hero-descend {
  from {
    opacity: 0;
    transform: translate3d(0, -36px, 0);
    filter: blur(4px);
  }
  50% {
    filter: blur(0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    filter: blur(0);
  }
}

/* Subtext, labels, stats: softer motion from above */
@keyframes hero-descend-soft {
  from {
    opacity: 0;
    transform: translate3d(0, -22px, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes hero-kenburns {
  from {
    transform: scale(1.08);
  }
  to {
    transform: scale(1);
  }
}

@keyframes hero-overlay-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* --- Dark heroes: stronger, more “premium” type --- */

.hero .hero-content > h1,
.hero .hero-content .hero-title,
.hero .hero-inner .hero-copy h1,
.page-hero .page-header-inner > h1,
.page-hero .page-header-inner .page-title,
.page-hero .container > h1 {
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 1.08;
  text-shadow:
    0 2px 18px rgba(0, 0, 0, 0.35),
    0 10px 42px rgba(0, 0, 0, 0.28);
  /* Unified hero title sizing (slightly larger) */
  font-size: calc(clamp(2.25rem, 4.2vw, 4.05rem) + 0.375rem) !important;
}

.hero .hero-content > p,
.hero .hero-content .hero-subtext,
.hero .hero-inner .hero-copy p,
.page-hero .page-header-inner > p,
.page-hero .page-header-inner .page-desc,
.page-hero .container > p {
  font-weight: 500;
  letter-spacing: -0.01em;
  text-shadow:
    0 2px 14px rgba(0, 0, 0, 0.32),
    0 12px 36px rgba(0, 0, 0, 0.22);
  /* Unified hero subtext sizing */
  font-size: calc(clamp(1.05rem, 1.45vw, 1.28rem) + 0.15rem) !important;
}

/* Index: stats follow same “from above” rhythm, staggered */
.hero .stats-grid > article {
  animation: hero-descend-soft 0.82s cubic-bezier(0.16, 1, 0.3, 1) both;
}
.hero .stats-grid > article:nth-child(1) {
  animation-delay: 0.42s;
}
.hero .stats-grid > article:nth-child(2) {
  animation-delay: 0.52s;
}
.hero .stats-grid > article:nth-child(3) {
  animation-delay: 0.62s;
}
.hero .stats-grid > article:nth-child(4) {
  animation-delay: 0.72s;
}

/* --- Motion (respect reduced motion) --- */

.hero,
.page-header.page-hero{
  /* Global hero sizing consistency across pages */
  min-height: clamp(440px, 85vh, 820px) !important;
  padding: clamp(3.5rem, 7vw, 5.75rem) 0 !important;
  position: relative;
  overflow: hidden;
  display: grid;
  place-items: center;
  text-align: center;
}

.hero .hero-content > p,
.hero .hero-content .hero-subtext,
.hero .hero-inner .hero-copy p,
.page-hero .page-header-inner > p,
.page-hero .page-header-inner .page-desc,
.page-hero .container > p{
  /* More eye-catching than plain white */
  color: rgba(255, 235, 242, 0.96) !important;
}

.hero .hero-bg {
  animation: hero-kenburns 1.35s cubic-bezier(0.22, 1, 0.36, 1) both;
  will-change: transform;
}

.hero .hero-overlay,
.page-hero .hero-overlay {
  animation: hero-overlay-in 0.75s ease-out both;
  /* Admissions-like premium overlay depth */
  background:
    linear-gradient(120deg, rgba(7,21,39,.82), rgba(13,36,70,.58)) !important,
    radial-gradient(900px 520px at 50% 0%, rgba(255,255,255,.14), transparent 65%) !important;
}

/* Titles: drop in from above + subtle blur clear */
.hero .hero-content > h1,
.hero .hero-content .hero-title,
.hero .hero-inner .hero-copy h1,
.page-hero .page-header-inner > h1,
.page-hero .page-header-inner .page-title,
.page-hero .container > h1 {
  animation: hero-descend 1s cubic-bezier(0.16, 1, 0.3, 1) both;
  animation-delay: 0.08s;
}

/* Body copy: same direction, slightly later */
.hero .hero-content > p,
.hero .hero-content .hero-subtext,
.hero .hero-inner .hero-copy p,
.page-hero .page-header-inner > p,
.page-hero .page-header-inner .page-desc,
.page-hero .container > p {
  animation: hero-descend-soft 0.95s cubic-bezier(0.16, 1, 0.3, 1) both;
  animation-delay: 0.24s;
}

.page-hero .page-header-inner > .section-label {
  animation: hero-descend-soft 0.78s cubic-bezier(0.16, 1, 0.3, 1) both;
  animation-delay: 0.02s;
}

.page-hero .page-header-inner > .page-title {
  animation-delay: 0.1s;
}

.page-hero .page-header-inner > .page-desc {
  animation-delay: 0.28s;
}

@media (prefers-reduced-motion: reduce) {
  .hero .hero-bg,
  .hero .hero-overlay,
  .page-hero .hero-overlay,
  .hero .hero-content > h1,
  .hero .hero-content .hero-title,
  .hero .hero-inner .hero-copy h1,
  .hero .hero-content > p,
  .hero .hero-content .hero-subtext,
  .hero .hero-inner .hero-copy p,
  .page-hero .page-header-inner > h1,
  .page-hero .page-header-inner .page-title,
  .page-hero .container > h1,
  .page-hero .page-header-inner > p,
  .page-hero .page-header-inner .page-desc,
  .page-hero .container > p,
  .page-hero .page-header-inner > .section-label,
  .hero .stats-grid > article {
    animation: none !important;
    filter: none !important;
  }
}