/**
 * Golden Eagle GS — Homepage Part 4 (page-specific layout)
 * Stage 5, Part 4 — Testimonials, Partners, FAQ Excerpt, Blog Preview,
 * CTA Section
 *
 * SCOPE DISCIPLINE: two new component groups only, each filling a
 * genuine gap the existing library (components-core.css,
 * components-interactive.css) does not cover — see
 * inc/homepage-part4.php's per-section docblocks for the full
 * reasoning behind each:
 *
 * 1. `.ge-partner-grid` / `.ge-partner-logo` — a logo-only grid item.
 *    No existing card variant renders a bare logo without a title/
 *    description/padding-heavy `.ge-card` treatment, which would look
 *    wrong for an accreditation/partner mark.
 * 2. `.ge-blog-card` — the one card variant this system didn't yet
 *    have: featured image + published date. No other `.ge-card`
 *    modifier carries an image or a date field.
 *
 * Testimonials, CTA Section, and FAQ Excerpt need ZERO new CSS —
 * they're built entirely from already-approved classes
 * (`.ge-testimonial-card`, `.ge-cta-block`, the accordion system).
 *
 * `.ge-footer` (the Global Footer structure) originally lived here too
 * but was extracted to its own sitewide file, `site-footer.css` —
 * Priority 2 (Performance) Task 4, the scheduled cleanup this file's
 * own prior docblock and `PROJECT_STATE.md`/`CORE_PLATFORM.md` §6
 * already flagged. Nothing else in this file changed.
 *
 * LOADING: registered only, conditionally enqueued on the front page
 * (Testimonials/Partners/FAQ/Blog/CTA) and on archive/search pages
 * (Partner grid + Blog card only) — see
 * inc/homepage-part4.php's `ge_homepage_part4_enqueue_assets()` and
 * inc/archive-search-assets.php's `ge_archive_search_enqueue_assets()`.
 */

/* ==========================================================================
   1. PARTNER LOGO GRID
   ========================================================================== */

.ge-section-header__description {
  font-size: 16px;
  color: var(--ge-color-text-secondary);
  max-width: 40em;
  margin: 0;
}

.ge-partner-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr); /* Mobile: 2 per row. */
  gap: var(--ge-space-5);
  align-items: center;
  justify-items: center;
}

/* SINGLE SOURCE OF TRUTH for `.ge-partner-logo` (v12, 2026-10-03).
   A September revision had added a competing definition in
   components-core.css; it was removed there and the non-conflicting
   parts of its card treatment merged here, so every property of this
   component is declared exactly once, in one file.

   LAYOUT below is the approved v11 behaviour, unchanged: a flex cell
   that fills its grid track, with the image constrained by max-height
   so logos of different aspect ratios optically match. The September
   version's `display: inline-block` + `width/height: 100%` on the image
   is deliberately NOT adopted — it would stretch each logo to its cell
   and break the equal-sizing the Partners grid depends on. */
.ge-partner-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: var(--ge-space-3);

  /* Card surface — carried over from the September treatment. Purely
     decorative, so it composes with the layout above rather than
     competing with it. */
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(201, 162, 75, 0.1);
  border-radius: var(--ge-radius-sm);
  overflow: hidden;
  transition:
    transform var(--ge-duration-base) var(--ge-ease-standard),
    border-color var(--ge-duration-base) var(--ge-ease-standard),
    box-shadow var(--ge-duration-base) var(--ge-ease-standard);
}

/* Hover lift — also from the September treatment. Paired with the
   focus-visible selector below so keyboard users get the same feedback
   a mouse user gets, which the September version did not provide. */
.ge-partner-logo:hover,
.ge-partner-logo:focus-within {
  transform: translateY(-2px);
  border-color: var(--ge-color-gold-300);
  box-shadow: var(--ge-shadow-md), 0 0 0 1px rgba(201, 162, 75, 0.15);
}

.ge-partner-logo__image {
  max-width: 100%;
  max-height: 64px;
  width: auto;
  height: auto;
  object-fit: contain;
  filter: grayscale(100%) opacity(0.7);
  transition: filter var(--ge-duration-base) var(--ge-ease-standard);
}

.ge-partner-logo a {
  display: inline-flex;
}

.ge-partner-logo:hover .ge-partner-logo__image,
.ge-partner-logo a:focus-visible .ge-partner-logo__image {
  filter: grayscale(0%) opacity(1);
}

@media (min-width: 1024px) {
  .ge-partner-grid {
    grid-template-columns: repeat(4, 1fr); /* Desktop: 4 per row. */
  }
}

@media (prefers-reduced-motion: reduce) {
  .ge-partner-logo__image {
    transition: none;
  }

  /* The hover lift merged in from the September treatment is motion, so
     it has to honour the same preference the rest of this project does.
     Colour/shadow feedback is kept — only the movement is removed. */
  .ge-partner-logo {
    transition: none;
  }

  .ge-partner-logo:hover,
  .ge-partner-logo:focus-within {
    transform: none;
  }
}

/* ==========================================================================
   2. BLOG CARD
   ========================================================================== */

.ge-blog-card {
  display: flex;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
}

.ge-blog-card__media {
  aspect-ratio: 16 / 10;
  overflow: hidden;
}

.ge-blog-card__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.ge-blog-card__body {
  display: flex;
  flex-direction: column;
  gap: var(--ge-space-2);
  padding: var(--ge-space-5);
}

.ge-blog-card__date {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ge-color-gold-300);
}

.ge-blog-card__title {
  font-size: 20px;
  font-weight: 600;
  color: var(--ge-color-text-primary);
  margin: 0;
}

.ge-blog-card__excerpt {
  font-size: 15px;
  line-height: 1.6;
  color: var(--ge-color-text-secondary);
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}