/**
 * Visa Services page layout — Golden Eagle GS.
 *
 * Scoped to the page and composed from existing design tokens and components.
 * No image asset is used because the available office image includes a disputed
 * logo treatment.
 */

.ge-visa-services__hero {
  padding-block: var(--ge-space-7);
}

.ge-visa-services__hero-content {
  display: flex;
  flex-direction: column;
  gap: var(--ge-space-3);
  max-width: 46rem;
}

.ge-visa-services__section {
  padding-block: var(--ge-space-7);
}

.ge-visa-services__section--audiences {
  background: var(--ge-color-navy-900);
  border-block: 1px solid var(--ge-color-border-subtle);
}

.ge-visa-services__card {
  min-height: 0;
}

.ge-visa-services__number {
  color: var(--ge-color-gold-300);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.12em;
}

.ge-visa-services__audience-card {
  display: flex;
  flex-direction: column;
  gap: var(--ge-space-3);
}

.ge-visa-services__audience-card p {
  color: var(--ge-color-text-secondary);
  line-height: 1.6;
  margin: 0;
}

.ge-visa-services__cta-actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--ge-space-3);
}

@media (min-width: 480px) {
  .ge-visa-services__cta-actions {
    flex-direction: row;
    justify-content: center;
  }
}

@media (min-width: 768px) {
  .ge-visa-services__hero,
  .ge-visa-services__section {
    padding-block: var(--ge-space-8);
  }
}

/* ==========================================================================
   V17 — SERVICE PAGE COHERENCE (2026-10-04)
   Matches the Recruitment page's section rhythm, card alignment and CTA
   spacing so all four service pages read as one system. Existing tokens
   and components only; no copy, no markup and no claim is changed here.
   ========================================================================== */

/* Consistent band alternation across the service pages. */
.ge-visa-services__section--audiences {
  background: var(--ge-color-navy-900);
  border-block: 1px solid var(--ge-color-border-subtle);
}

/* Equal-height, top-aligned category cards so the numbered grid scans
   cleanly instead of stepping with content length. */
.ge-visa-services__card {
  display: flex;
  flex-direction: column;
  gap: var(--ge-space-2);
}

.ge-visa-services__number {
  color: var(--ge-color-gold-300);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.12em;
}

/* Readable measure on the supporting paragraph. */
.ge-visa-services__section p {
  max-width: 60ch;
}

/* CTA actions: stack on narrow screens, inline from 480px — identical to
   the Recruitment page's CTA behaviour. */
.ge-visa-services__cta-actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--ge-space-3);
}

@media (min-width: 480px) {
  .ge-visa-services__cta-actions {
    flex-direction: row;
    justify-content: center;
  }
}

/* ==========================================================================
   V18 — PAGE SURFACE FIX (2026-10-04)
   Same defect and same remedy as the Homepage: this page's section headings
   use --ge-color-text-primary (#FFFFFF) and had no surface beneath them.
   Section rhythm is now dark-on-dark (navy-900 base, navy-850 band) rather
   than dark-on-white, which is what the design tokens always intended. */
.ge-visa-services__section {
  background-color: var(--ge-color-navy-900);
}

.ge-visa-services__section--audiences {
  background-color: var(--ge-color-navy-850);
}
