/* Shared hero/title spacing for internal pages (Journal, Courses, About, Contact, etc.).
   This file is the single source of truth for `.ga-page-hero`.
   Purpose: prevent conflicting `!important` overrides between `css/layout.css` and `css/page-hero.css`.
*/

.ga-page-hero {
  width: 100%;
  position: relative;
}

/* Hero wrapper (main.ga-hero) */
.main.ga-hero.ga-page-hero,
main.ga-hero.ga-page-hero {
  /* Ensure consistent layout under fixed navbar */
  padding-top: var(--nav-h) !important;

  /* Internal pages use compact hero spacing; remove the big default hero bottom padding */
  padding-bottom: 0 !important;

  /* Prevent accidental hero media overflow from affecting the rest of the page */
  overflow: hidden;
}

/* Compact, unified hero inner padding across all internal pages */
.ga-page-hero .hero-inner {
  padding: 40px 0 32px !important;
}

/* Keep hero text spacing aligned across pages */
.ga-page-hero .hero-eyebrow {
  margin-bottom: 10px !important;
}

.ga-page-hero .hero-title {
  margin-bottom: 12px !important;
}

.ga-page-hero .hero-subtitle {
  margin-bottom: 16px !important;
}

/* Tablet spacing */
@media (max-width: 768px) {
  .ga-page-hero .hero-inner {
    padding: 34px 0 26px !important;
  }
}

/* Mobile spacing */
@media (max-width: 560px) {
  .ga-page-hero .hero-inner {
    padding: 28px 0 24px !important;
  }

  .ga-page-hero .hero-subtitle {
    margin-bottom: 12px !important;
  }
}