/* ==========================================================================
   AIR TICKETING PAGE — hero split, process steps, capability list
   ========================================================================== */

/* ---------------------------------------------------------------------- *
 * Full-bleed photo hero — background photo with a legibility scrim and
 * text overlaid, in place of the old split text+illustration layout.
 * ---------------------------------------------------------------------- */
.page-header--photo {
  position: relative;
  background-size: cover;
  background-position: center;
  min-height: 480px;
  display: flex;
  align-items: center;
  overflow: hidden;
  padding-block: var(--space-8);
}
.page-header__scrim {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(100deg, rgba(8,37,57,0.90) 0%, rgba(8,37,57,0.72) 35%, rgba(8,37,57,0.38) 65%, rgba(8,37,57,0.12) 100%);
}
.page-header--photo .container { position: relative; z-index: 2; }
.page-header--photo h1 { text-shadow: 0 2px 16px rgba(8,37,57,0.55); }
.page-header--photo p { text-shadow: 0 1px 10px rgba(8,37,57,0.5); }

@media (max-width: 767px) {
  .page-header--photo { min-height: 420px; }
  .page-header__scrim { background: rgba(8,37,57,0.72); }
}

/* ---------------------------------------------------------------------- *
 * Process steps — numbered sequence (this content genuinely is a
 * sequence, so numbering earns its place here)
 * ---------------------------------------------------------------------- */
.process { background: var(--color-ivory); }

.process__row {
  margin-top: var(--space-7);
  position: relative;
}
.process__row::before {
  content: "";
  position: absolute;
  top: 26px;
  left: 6%;
  right: 6%;
  height: 2px;
  background: var(--color-line);
  z-index: 0;
}
.process-step {
  position: relative;
  z-index: 1;
}
.process-step__num {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--color-ocean-800);
  color: var(--color-white);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--text-h4);
  font-weight: var(--weight-bold);
}
.process-step h3 { margin-top: var(--space-4); font-size: var(--text-body-lg); }
.process-step p { margin-top: var(--space-2); font-size: var(--text-small); color: var(--color-ink-soft); }

@media (max-width: 991px) {
  .process__row::before { display: none; }
}

/* ---------------------------------------------------------------------- *
 * Capability list — what we handle
 * ---------------------------------------------------------------------- */
.capability-list {
  margin-top: var(--space-7);
}
.capability-list li {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  font-weight: var(--weight-medium);
  min-width: 0;
}
.capability-list img { width: 24px; height: 24px; flex-shrink: 0; margin-top: 2px; }