/* ══════════════════════════════════════════════════════════════
   MAGALLONES TRAVEL — BRAND RESKIN v1.0
   Brand Blue #1592EC + Brand Gold #FF9F1C over white/mist
   Loaded after style.css — cosmetic overrides only.
   DO NOT edit backend logic, forms, or data bindings here.
   ══════════════════════════════════════════════════════════════ */

/* ─── 1. DESIGN TOKENS ─────────────────────────────────────── */
:root {
  --blue:        #1592EC;
  --blue-deep:   #0A4A8F;
  --blue-tint:   #E7F2FD;
  --gold:        #FF9F1C;
  --gold-soft:   #FFF2DD;
  --gold-deep:   #E07E00;
  --mist:        #F3F7FB;
  --stone:       #5C6B7A;
  --line:        #E1E8EF;
  --ink:         #000000;
  --ink-soft:    #14181A;
  --paper:       #FFFFFF;

  /* Map existing site variable names to brand palette */
  --primary-color:   #1592EC;
  --secondary-color: #0A4A8F;
  --accent-color:    #FF9F1C;
  --surface-color:   #FFFFFF;
  --bg-color:        #F3F7FB;
  --text-color:      #14181A;
  --text-secondary:  #5C6B7A;   /* legacy alias → stone */
  --border-color:    #E1E8EF;
  --card-bg:         #FFFFFF;

  /* Typography */
  --sans: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --mono: 'Spline Sans Mono', ui-monospace, 'Cascadia Code', monospace;

  /* Radius */
  --r-sm:   10px;
  --r-md:   16px;
  --r-lg:   24px;
  --r-pill: 999px;

  /* Shadows */
  --shadow-sm: 0 1px 4px rgba(0,0,0,.06);
  --shadow-md: 0 4px 16px rgba(21,146,236,.10);
  --shadow-lg: 0 8px 32px rgba(21,146,236,.15);
}

/* ─── 2. BASE BODY ──────────────────────────────────────────── */
body {
  background: var(--mist) !important;
  color: var(--ink-soft) !important;
  font-family: var(--sans) !important;
}

/* ─── 3. NAVBAR ─────────────────────────────────────────────── */
.main-navbar {
  background: transparent !important;
}
.navbar-container {
  background: rgba(255, 255, 255, 0.92) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border: 1px solid var(--line) !important;
  box-shadow: 0 2px 20px rgba(21, 146, 236, 0.07) !important;
}
.navbar-scrolled .navbar-container {
  background: rgba(255, 255, 255, 0.98) !important;
  box-shadow: 0 4px 24px rgba(21, 146, 236, 0.11) !important;
}
.navbar-brand img {
  filter: none !important;
}
.nav-link-pill {
  color: var(--ink-soft) !important;
  font-family: var(--sans) !important;
  font-weight: 500 !important;
}
.nav-link-pill:hover {
  color: var(--blue) !important;
  background: var(--blue-tint) !important;
}
.btn-nav-cta {
  background: var(--blue) !important;
  color: #fff !important;
  border-color: var(--blue) !important;
  font-family: var(--sans) !important;
  font-weight: 600 !important;
  border-radius: var(--r-pill) !important;
}
.btn-nav-cta:hover {
  background: var(--blue-deep) !important;
  border-color: var(--blue-deep) !important;
  transform: translateY(-1px);
}
.btn-nav-login {
  color: var(--blue) !important;
  border-color: var(--line) !important;
  font-family: var(--sans) !important;
  border-radius: var(--r-pill) !important;
}
.btn-nav-login:hover {
  background: var(--blue-tint) !important;
  color: var(--blue-deep) !important;
}
.mobile-menu {
  background: #fff !important;
  border-top: 1px solid var(--line) !important;
}
.mobile-nav-link {
  color: var(--ink-soft) !important;
  font-family: var(--sans) !important;
}
.mobile-nav-link:hover {
  color: var(--blue) !important;
  background: var(--blue-tint) !important;
}

/* ─── 4. TRUST BAR ──────────────────────────────────────────── */
.trust-bar {
  background: var(--blue-deep);
  color: #fff;
  overflow: hidden;
  max-height: 44px;
  transition: max-height 0.32s ease;
  font-family: var(--sans);
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.01em;
}
.trust-bar.collapsed {
  max-height: 0;
}
.trust-bar-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  padding: 10px 24px;
  flex-wrap: wrap;
}
.trust-bar-item {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  white-space: nowrap;
  opacity: 0.92;
}
.trust-bar-item i {
  color: var(--gold);
  font-size: 0.8rem;
}
.trust-bar-divider {
  display: inline-block;
  width: 1px;
  height: 14px;
  background: rgba(255,255,255,0.22);
}

/* ─── 5. HERO CAROUSEL ──────────────────────────────────────── */
.hero-brand {
  position: relative;
  width: 100%;
  height: 82vh;
  min-height: 520px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  /* Dark navy fallback — visible if images fail to load or JS is slow */
  background: var(--blue-deep) !important;
}

#heroSlides {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.hslide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 1.5s ease;
  background-size: cover;
  background-position: center;
}
/* !important guards against Tailwind/Bootstrap opacity utilities */
.hslide.active {
  opacity: 1 !important;
}

/* Ken Burns keyframes */
@keyframes kbIn {
  from { transform: scale(1.05); }
  to   { transform: scale(1.20); }
}
@keyframes kbOut {
  from { transform: scale(1.20); }
  to   { transform: scale(1.05); }
}
/* v289: 15s slow Ken Burns to match 15s slide interval. zout = images
   start slightly zoomed, slowly resolve toward natural scale. */
.hslide.zin  { animation: kbIn  15s ease forwards; }
.hslide.zout { animation: kbOut 15s ease forwards; }

/* v289 overlay — further softened so destination images shine through.
   Base linear gradient: 0.28/0.42 → 0.14/0.24 (~half).
   Center radial dim retained but lighter: 0.55 → 0.38 peak, fading to 0.04.
   Text legibility comes from layered text-shadow on .hero-brand-content h1/sub. */
.hslide::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at center,
      rgba(6, 22, 50, 0.38) 0%,
      rgba(6, 22, 50, 0.12) 55%,
      rgba(6, 22, 50, 0.04) 100%),
    linear-gradient(135deg,
      rgba(10, 74, 143, 0.14) 0%,
      rgba(6, 22, 50, 0.24) 100%);
}

/* Hero content layer sits above slides.
   color !important beats body { color: var(--ink-soft) !important } */
.hero-brand-content {
  position: relative;
  z-index: 2;
  text-align: center;
  max-width: 780px;
  padding: 0 24px;
  color: #fff !important;
}
.hero-brand-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(255, 159, 28, 0.16);
  border: 1px solid rgba(255, 159, 28, 0.36);
  color: var(--gold) !important;
  font-family: var(--mono);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 6px 16px;
  border-radius: var(--r-pill);
  margin-bottom: 20px;
}
.hero-brand-content h1 {
  font-family: var(--sans) !important;
  font-size: clamp(2.1rem, 5.5vw, 3.5rem);
  font-weight: 700;
  line-height: 1.13;
  margin-bottom: 18px;
  color: #fff !important;
  text-shadow:
    0 2px 12px rgba(0,0,0,0.55),
    0 4px 28px rgba(0,0,0,0.45);
}
.hero-brand-content h1 em {
  font-style: normal;
  color: var(--gold) !important;
}
/* Use color instead of opacity so body{color:dark!important} can't win */
.hero-brand-sub {
  font-size: 1.05rem;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.95) !important;
  margin-bottom: 32px;
  line-height: 1.65;
  text-shadow: 0 1px 10px rgba(0,0,0,0.55);
}
.hero-cta-row {
  display: flex;
  gap: 14px;
  justify-content: center;
  flex-wrap: wrap;
}
.btn-hero-primary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--gold);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 0.95rem;
  font-weight: 700;
  padding: 14px 30px;
  border-radius: var(--r-pill);
  text-decoration: none !important;
  transition: background 0.18s ease, transform 0.18s ease;
  box-shadow: 0 4px 22px rgba(255, 159, 28, 0.32);
}
.btn-hero-primary:hover {
  background: var(--gold-deep);
  color: #fff !important;
  transform: translateY(-2px);
}
.btn-hero-ghost {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(255,255,255,0.12);
  border: 1.5px solid rgba(255,255,255,0.48);
  color: #fff !important;
  font-family: var(--sans);
  font-size: 0.95rem;
  font-weight: 600;
  padding: 13px 27px;
  border-radius: var(--r-pill);
  text-decoration: none !important;
  transition: background 0.18s ease, transform 0.18s ease;
  backdrop-filter: blur(8px);
}
.btn-hero-ghost:hover {
  background: rgba(255,255,255,0.22);
  color: #fff !important;
  transform: translateY(-2px);
}

/* Carousel dot indicators */
.hero-dots {
  position: absolute;
  bottom: 22px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 3;
  display: flex;
  gap: 8px;
}
.hero-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgba(255,255,255,0.38);
  cursor: pointer;
  transition: background 0.3s ease, transform 0.3s ease;
}
.hero-dot.active {
  background: var(--gold);
  transform: scale(1.3);
}

/* Reduced motion gate */
@media (prefers-reduced-motion: reduce) {
  .hslide            { animation: none !important; }
  .hslide.zin,
  .hslide.zout       { transform: scale(1.1); }
  .hslide            { transition: opacity 0.4s ease; }
}

/* ─── 5b. HERO TRUST STATS (v290 — under CTA row) ───────────── */
.hero-stats {
  display: flex;
  gap: clamp(20px, 4vw, 56px);
  margin-top: 32px;
  flex-wrap: wrap;
  justify-content: center;
}
.hero-stat {
  text-align: center;
  min-width: 110px;
}
.hero-stat__num {
  font-family: var(--sans) !important;
  font-size: clamp(1.4rem, 2.6vw, 1.95rem);
  font-weight: 700;
  color: #fff !important;
  line-height: 1.05;
  text-shadow:
    0 2px 12px rgba(0,0,0,0.55),
    0 4px 24px rgba(0,0,0,0.40);
}
.hero-stat__label {
  font-size: 0.78rem;
  color: rgba(255,255,255,0.88) !important;
  margin-top: 4px;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-shadow: 0 1px 8px rgba(0,0,0,0.55);
}

/* ─── 5c. HERO SMART BOOKING CARD (v290 — top-right illustration) ─ */
.hero-booking-card {
  position: absolute;
  right: clamp(20px, 5vw, 80px);
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  width: clamp(260px, 26vw, 320px);
  background: rgba(255, 255, 255, 0.96);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
  border-radius: 18px;
  padding: 22px 24px;
  border: 1px solid rgba(255, 255, 255, 0.55);
  box-shadow: 0 24px 60px rgba(6, 22, 50, 0.30);
  color: var(--ink-soft) !important;
  font-family: var(--sans);
}
.hero-booking-card__title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: var(--mono) !important;
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--blue) !important;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 12px;
}
.hero-booking-card__route {
  font-family: var(--sans) !important;
  font-size: 0.98rem;
  font-weight: 600;
  color: var(--ink-soft) !important;
  margin-bottom: 8px;
  line-height: 1.3;
}
.hero-booking-card__arrow {
  color: var(--blue) !important;
  margin: 0 4px;
}
.hero-booking-card__price-row {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin: 6px 0 12px;
}
.hero-booking-card__price-from {
  font-size: 0.78rem;
  color: var(--stone) !important;
  font-weight: 500;
}
.hero-booking-card__price {
  font-family: var(--sans) !important;
  font-size: 1.95rem;
  font-weight: 700;
  color: var(--ink-soft) !important;
  line-height: 1;
}
.hero-booking-card__price-ccy {
  font-size: 0.78rem;
  color: var(--stone) !important;
  font-weight: 600;
}
.hero-booking-card__savings {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(255, 159, 28, 0.16);
  border: 1px solid rgba(255, 159, 28, 0.40);
  color: var(--gold-deep) !important;
  font-size: 0.76rem;
  font-weight: 700;
  padding: 6px 11px;
  border-radius: 999px;
}
.hero-booking-card__note {
  font-size: 0.66rem;
  color: var(--stone) !important;
  margin-top: 10px;
  font-style: italic;
}

/* Mobile: hide booking card to avoid overlapping the headline */
@media (max-width: 991px) {
  .hero-booking-card { display: none; }
  .hero-stats        { margin-top: 24px; gap: 18px; }
}

/* ─── 6. SEARCH SECTION ─────────────────────────────────────── */
.search-section {
  background: transparent !important;
  position: relative;
  z-index: 10;
  margin-top: -60px;
}
.search-card {
  background: #fff !important;
  border: 1px solid var(--line) !important;
  box-shadow: 0 8px 40px rgba(21, 146, 236, 0.11) !important;
  border-radius: var(--r-lg) !important;
}
.search-tabs-bar {
  border-bottom-color: var(--line) !important;
}
.search-tabs-bar .stab {
  color: var(--stone) !important;
  font-family: var(--sans) !important;
}
.search-tabs-bar .stab.active {
  color: var(--blue) !important;
  border-bottom-color: var(--blue) !important;
}
.f-input {
  background: var(--mist) !important;
  border-color: var(--line) !important;
  color: var(--ink-soft) !important;
  font-family: var(--sans) !important;
}
.f-input:focus {
  border-color: var(--blue) !important;
  box-shadow: 0 0 0 3px var(--blue-tint) !important;
  background: #fff !important;
}
.f-label {
  color: var(--stone) !important;
  font-family: var(--sans) !important;
}
.f-input:not(:placeholder-shown) ~ .f-label,
.f-input:focus ~ .f-label {
  color: var(--blue) !important;
}
.btn-search-main {
  background: var(--gold) !important;
  color: var(--ink) !important;
  font-family: var(--sans) !important;
  font-weight: 700 !important;
  border-radius: var(--r-pill) !important;
  border: none !important;
  box-shadow: 0 4px 18px rgba(255,159,28,.28) !important;
  transition: background 0.18s ease, transform 0.18s ease !important;
}
.btn-search-main:hover {
  background: var(--gold-deep) !important;
  color: #fff !important;
  transform: translateY(-1px) !important;
}
.btn-advisor-help {
  border-color: var(--line) !important;
  color: var(--stone) !important;
  font-family: var(--sans) !important;
  border-radius: var(--r-pill) !important;
}
.btn-advisor-help:hover {
  border-color: var(--blue) !important;
  color: var(--blue) !important;
  background: var(--blue-tint) !important;
}
.trip-pill span {
  color: var(--stone) !important;
  font-family: var(--sans) !important;
}
.trip-pill input:checked + span {
  color: var(--blue) !important;
}
.ai-hint {
  color: var(--stone) !important;
  font-family: var(--sans) !important;
  border-top-color: var(--line) !important;
}
.ai-hint a {
  color: var(--blue) !important;
}
.pax-dropdown {
  background: #fff !important;
  border-color: var(--line) !important;
  box-shadow: var(--shadow-md) !important;
}
.pax-btn {
  border-color: var(--line) !important;
  color: var(--blue) !important;
  background: var(--blue-tint) !important;
}
.pax-btn:hover {
  background: var(--blue) !important;
  color: #fff !important;
}
.pax-done {
  background: var(--blue) !important;
  color: #fff !important;
  border-radius: var(--r-pill) !important;
  border: none !important;
}
.cabin-select {
  border-color: var(--line) !important;
  background: var(--mist) !important;
  color: var(--ink-soft) !important;
  font-family: var(--sans) !important;
  border-radius: var(--r-md) !important;
}

/* ─── 7. SERVICES GRID ──────────────────────────────────────── */
.services-ai {
  background: var(--paper) !important;
}
.services-ai h2 { color: var(--ink-soft) !important; font-family: var(--sans) !important; }
.services-ai .overline { color: var(--blue) !important; font-family: var(--mono) !important; }
.card-glass {
  background: var(--paper) !important;
  border: 1px solid var(--line) !important;
  color: var(--ink-soft) !important;
  box-shadow: var(--shadow-sm) !important;
  transition: box-shadow 0.25s ease, border-color 0.25s ease, transform 0.25s ease !important;
}
.card-glass:hover {
  box-shadow: var(--shadow-md) !important;
  border-color: var(--blue) !important;
  transform: translateY(-4px) !important;
}
.card-glass h4 { color: var(--ink-soft) !important; font-family: var(--sans) !important; }
.card-glass p  { color: var(--stone)    !important; font-family: var(--sans) !important; }
.svc-icon {
  color: var(--blue) !important;
  background: var(--blue-tint) !important;
  border-radius: var(--r-md) !important;
}

/* ─── 8. AIKO REVEAL SECTION ────────────────────────────────── */
.aiko-reveal {
  background: var(--blue-deep) !important;
  color: #fff !important;
}
.aiko-reveal h2 { color: #fff !important; font-family: var(--sans) !important; }
.aiko-reveal h2 span { color: var(--gold) !important; }
.aiko-reveal p  { color: rgba(255,255,255,0.82) !important; font-family: var(--sans) !important; }
.aiko-features-list li { color: rgba(255,255,255,0.88) !important; font-family: var(--sans) !important; }
.aiko-features-list .fa-check-circle { color: var(--gold) !important; }
.btn-glow {
  background: var(--gold) !important;
  color: var(--ink) !important;
  font-family: var(--sans) !important;
  font-weight: 700 !important;
  border-radius: var(--r-pill) !important;
  border: none !important;
  transition: background 0.18s ease, transform 0.18s ease !important;
}
.btn-glow:hover {
  background: var(--gold-deep) !important;
  color: #fff !important;
  transform: translateY(-2px) !important;
}
.aiko-chat-preview {
  background: rgba(255,255,255,0.07) !important;
  border: 1px solid rgba(255,255,255,0.14) !important;
  border-radius: var(--r-lg) !important;
}
.aiko-chat-header { border-bottom-color: rgba(255,255,255,0.12) !important; }
.chat-bubble.ai   { background: rgba(255,255,255,0.10) !important; color: #fff !important; }
.chat-bubble.user { background: var(--blue) !important; color: #fff !important; }
.chip {
  background: rgba(255,255,255,0.12) !important;
  color: rgba(255,255,255,0.88) !important;
  border-radius: var(--r-pill) !important;
}

/* ─── 9. TRUST SECTION ──────────────────────────────────────── */
.trust-ai {
  background: var(--mist) !important;
}
.trust-ai h2 { color: var(--ink-soft) !important; font-family: var(--sans) !important; }
.trust-ai .overline { color: var(--blue) !important; }
.trust-icon { color: var(--blue) !important; }

/* ─── 10. SECTION LABELS ────────────────────────────────────── */
.section-label h2 {
  color: var(--ink-soft) !important;
  font-family: var(--sans) !important;
}
.section-label .overline {
  color: var(--blue) !important;
  font-family: var(--mono) !important;
  letter-spacing: 0.08em;
}

/* ─── 11. DEALS SECTIONS ────────────────────────────────────── */
.deals-section {
  background: var(--paper) !important;
}
.deals-section h2 { color: var(--ink-soft) !important; font-family: var(--sans) !important; }
.deals-section .overline { color: var(--blue) !important; }
.deal-premium-badge {
  background: var(--gold) !important;
  color: var(--ink) !important;
  font-family: var(--mono) !important;
}
.deal-badge {
  background: var(--blue) !important;
  color: #fff !important;
}
.prime-deal-card {
  background: var(--paper) !important;
  border-color: var(--line) !important;
  color: var(--ink-soft) !important;
}

/* ─── 12. AIRLINE PARTNERS ──────────────────────────────────── */
.partners-section {
  background: var(--mist) !important;
}
.partner-header {
  color: var(--stone) !important;
  font-family: var(--sans) !important;
}
.airline-logo-box {
  background: var(--paper) !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--r-md) !important;
}
.airline-logo-item span {
  color: var(--stone) !important;
  font-family: var(--sans) !important;
}
.airline-carousel-fade--left {
  background: linear-gradient(to right, var(--mist), transparent) !important;
}
.airline-carousel-fade--right {
  background: linear-gradient(to left, var(--mist), transparent) !important;
}

/* ─── 13. FOOTER ─────────────────────────────────────────────── */
.site-footer {
  background: var(--blue-deep) !important;
  color: rgba(255,255,255,0.82) !important;
}
.footer-logo-plate {
  display: inline-block;
  background: #fff;
  border-radius: var(--r-md);
  padding: 7px 14px;
}
.footer-desc {
  color: rgba(255,255,255,0.65) !important;
  font-family: var(--sans) !important;
}
.footer-col-heading {
  color: rgba(255,255,255,0.48) !important;
  font-family: var(--mono) !important;
  font-size: 0.68rem !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
}
.footer-link-list a,
.footer-link-list li a {
  color: rgba(255,255,255,0.72) !important;
  font-family: var(--sans) !important;
}
.footer-link-list a:hover {
  color: var(--gold) !important;
  text-decoration: none !important;
}
.footer-social-btn {
  background: rgba(255,255,255,0.10) !important;
  color: rgba(255,255,255,0.72) !important;
  border-radius: 50% !important;
  transition: background 0.18s ease !important;
}
.footer-social-btn:hover {
  background: var(--gold) !important;
  color: var(--ink) !important;
}
.footer-bottom {
  border-top-color: rgba(255,255,255,0.10) !important;
  color: rgba(255,255,255,0.42) !important;
  font-size: 0.78rem !important;
  font-family: var(--sans) !important;
}
.footer-bottom a {
  color: rgba(255,255,255,0.42) !important;
}
.footer-bottom a:hover {
  color: var(--gold) !important;
}
.footer-newsletter-input {
  background: rgba(255,255,255,0.08) !important;
  border-color: rgba(255,255,255,0.14) !important;
  color: #fff !important;
  border-radius: var(--r-pill) 0 0 var(--r-pill) !important;
}
.footer-newsletter-input::placeholder { color: rgba(255,255,255,0.38) !important; }
.footer-newsletter-btn {
  background: var(--gold) !important;
  color: var(--ink) !important;
  border-radius: 0 var(--r-pill) var(--r-pill) 0 !important;
  font-weight: 700 !important;
  border: none !important;
}
.footer-newsletter-btn:hover {
  background: var(--gold-deep) !important;
  color: #fff !important;
}

/* ─── 14. AIKO FAB ───────────────────────────────────────────── */
.aiko-fab {
  background: var(--blue) !important;
  box-shadow: 0 4px 22px rgba(21, 146, 236, 0.42) !important;
  position: relative;
}
.aiko-fab:hover {
  background: var(--blue-deep) !important;
  transform: scale(1.08) !important;
}
/* Pulsing ring animation */
.aiko-fab::before {
  content: '';
  position: absolute;
  inset: -5px;
  border-radius: 50%;
  border: 2px solid var(--blue);
  opacity: 0.48;
  animation: aikoRing 2.6s ease-in-out infinite;
}
@keyframes aikoRing {
  0%, 100% { transform: scale(1);   opacity: 0.48; }
  50%       { transform: scale(1.22); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .aiko-fab::before { animation: none; }
}

/* ─── 15. GLASS UTILITIES (light-mode) ───────────────────────── */
.glass-panel,
.glass-card,
.surface-panel-refined {
  background: rgba(255,255,255,0.90) !important;
  border: 1px solid var(--line) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  color: var(--ink-soft) !important;
}

/* ─── 15b. DARK-CONTEXT GLASS (auth / luxury-viewport pages) ── */
/* Specificity (0,2,0) beats §15's (0,1,0) — dark background wins
   on any page that wraps content in .luxury-viewport (register,
   select-plan, agent-register, etc.)                             */
.luxury-viewport .glass-panel,
.luxury-viewport .glass-card {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(255, 255, 255, 0.10) !important;
  backdrop-filter: blur(22px) !important;
  -webkit-backdrop-filter: blur(22px) !important;
  box-shadow: 0 40px 80px rgba(0, 0, 0, 0.45) !important;
  color: #fff !important;
}
/* Ensure descendant text helpers read correctly on dark glass */
.luxury-viewport .text-white-50 { color: rgba(255,255,255,0.55) !important; }
.luxury-viewport .text-gold     { color: #C8A96B !important; }
.luxury-viewport .btn-gold      { color: #000 !important; }

/* ─── 16. TEXT UTILITIES ─────────────────────────────────────── */
.text-gold  { color: var(--gold) !important; }
.text-blue  { color: var(--blue) !important; }
.text-stone { color: var(--stone) !important; }

/* ─── 17. BADGE OVERRIDES ────────────────────────────────────── */
.badge-primary { background: var(--blue)      !important; }
.badge-warning { background: var(--gold-soft) !important; color: var(--gold-deep) !important; }

/* ─── 18. TRUST BAR TICKER — brand colour override ──────────── */
.trust-bar-ticker {
  background: var(--blue-deep) !important;
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
  overflow: hidden;
  max-height: 56px;
  transition: max-height 0.32s ease, padding 0.32s ease;
}
.trust-bar-ticker.collapsed {
  max-height: 0 !important;
  padding: 0 !important;
}
.trust-bar-ticker .trust-bar-ticker-item {
  font-family: var(--sans) !important;
  color: rgba(255,255,255,0.92) !important;
  font-weight: 500 !important;
}
.trust-bar-ticker .trust-bar-ticker-sep {
  color: rgba(255,255,255,0.30) !important;
}

/* ─── 19. BOOKING PAGES: CARD / PANEL BACKGROUNDS ───────────── */
/* rs_results.html — flight result cards */
.rs-card {
  background: #ffffff !important;
  border: 1px solid rgba(21,146,236,0.12) !important;
  box-shadow: 0 4px 20px rgba(21,146,236,0.07) !important;
}
.rs-card:hover {
  border-color: rgba(21,146,236,0.30) !important;
  box-shadow: 0 8px 32px rgba(21,146,236,0.12) !important;
}
.rs-card::before {
  background: linear-gradient(90deg, transparent, rgba(21,146,236,0.26), transparent) !important;
}
.rs-price-pane {
  background: rgba(21,146,236,0.04) !important;
  border: 1px solid rgba(21,146,236,0.12) !important;
}
.rs-price-pane .label { color: var(--stone) !important; }
/* rs_review.html — review panels */
.panel {
  background: #ffffff !important;
  border: 1px solid rgba(21,146,236,0.14) !important;
  box-shadow: 0 8px 40px rgba(21,146,236,0.08) !important;
}
.panel::before {
  background: linear-gradient(135deg, rgba(21,146,236,0.26), rgba(255,159,28,0.14), rgba(21,146,236,0.04)) !important;
}
/* rs_booking_status.html — booking cards */
.bk-card {
  background: #ffffff !important;
  border: 1px solid rgba(21,146,236,0.14) !important;
  box-shadow: 0 8px 40px rgba(21,146,236,0.08) !important;
}
.bk-card::before {
  background: linear-gradient(135deg, rgba(21,146,236,0.26), rgba(255,159,28,0.14), rgba(21,146,236,0.04)) !important;
}
.bk-ref-number {
  background: linear-gradient(135deg, var(--blue-deep) 0%, var(--blue) 55%, var(--gold) 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

/* ─── 20. BOOKING PAGES: HARDCODED WHITE TEXT FIX ───────────── */
/* These elements use rgba(255,255,255,X) — invisible on light bg */
.rs-control-bar   { background: rgba(21,146,236,0.03) !important; border: 1px solid var(--line) !important; }
.rs-control-label { color: var(--stone) !important; }
.rs-control-divider { background: var(--line) !important; }
.rs-result-count  { color: var(--stone) !important; }
.rs-filter-btn    { background: rgba(21,146,236,0.04) !important; border: 1px solid var(--line) !important; color: var(--ink-soft) !important; }
.rs-filter-btn:hover      { border-color: rgba(21,146,236,0.28) !important; color: var(--blue) !important; }
.rs-filter-btn.is-active  { border-color: rgba(21,146,236,0.38) !important; background: rgba(21,146,236,0.07) !important; color: var(--blue) !important; }
.rs-filter-btn.is-active-gold { border-color: rgba(255,159,28,0.30) !important; background: rgba(255,159,28,0.07) !important; }
.rs-chip          { background: rgba(21,146,236,0.04) !important; border-color: var(--line) !important; }
.rs-overline      { border-color: rgba(21,146,236,0.18) !important; background: rgba(21,146,236,0.06) !important; }
.rs-engine        { border-color: rgba(255,159,28,0.22) !important; background: rgba(255,159,28,0.06) !important; color: var(--ink-soft) !important; }
.rs-trust         { background: rgba(21,146,236,0.03) !important; border-color: var(--line) !important; }
.rs-badge         { border-color: rgba(21,146,236,0.16) !important; background: rgba(21,146,236,0.06) !important; }
.rs-airline-meta  { background: rgba(21,146,236,0.03) !important; border-color: var(--line) !important; color: var(--stone) !important; }
.rs-airline-code  { background: rgba(21,146,236,0.06) !important; border-color: var(--line) !important; color: var(--ink-soft) !important; }
.rs-family-chip.is-derived { border-color: var(--line) !important; background: rgba(21,146,236,0.03) !important; color: var(--stone) !important; font-style: italic; }
.rs-bags-chip.no-bags      { border-color: var(--line) !important; background: rgba(21,146,236,0.03) !important; color: var(--stone) !important; }
.rs-rec-badge.rs-rec-fastest { border-color: rgba(21,146,236,0.28) !important; background: rgba(21,146,236,0.06) !important; color: var(--blue) !important; }
.bk-ref-eyebrow { color: var(--stone) !important; }
.bk-chip        { background: rgba(21,146,236,0.04) !important; border-color: var(--line) !important; color: var(--stone) !important; }
.bk-chip i      { color: var(--gold) !important; }
.bk-copy-btn    { background: var(--gold-soft) !important; border-color: rgba(255,159,28,0.26) !important; }
.bk-copy-btn:hover { background: rgba(255,159,28,0.16) !important; }
.summary-badge  { border-color: rgba(21,146,236,0.18) !important; background: rgba(21,146,236,0.07) !important; color: var(--blue) !important; }
.hero-note      { border-color: rgba(255,159,28,0.22) !important; background: rgba(255,159,28,0.07) !important; }

/* ─── 21. PUBLIC PAGE CONTENT — DARK TEXT ON LIGHT PANELS ───── */
/* Panels (surface-panel, adventure-card, contact-card) are now white.
   Override Bootstrap text-white / text-white-50 classes that were
   designed for the old dark-background site. */
.surface-panel {
  border-color: var(--line) !important;
  background: #fff !important;
}
.surface-panel h2,
.surface-panel h3,
.surface-panel h4,
.surface-panel h5 { color: var(--ink-soft) !important; font-family: var(--sans) !important; }
.surface-panel .text-white  { color: var(--ink-soft) !important; }
.surface-panel .text-white-50 { color: var(--stone) !important; }
.surface-panel p  { color: var(--stone) !important; font-family: var(--sans) !important; }
.adventure-card {
  background: #fff !important;
  border-color: var(--line) !important;
}
.adventure-card h5.text-white,
.adventure-card strong.text-white { color: var(--ink-soft) !important; }
.adventure-card .text-white-50,
.adventure-card p.text-white-50,
.adventure-card small.text-white-50 { color: var(--stone) !important; }
.adventure-card img { filter: brightness(1.0) !important; }
/* Section headings on white background */
.section h2.text-white       { color: var(--ink-soft) !important; }
.section p.text-white-50     { color: var(--stone)    !important; }
.section .lead.text-white-50 { color: var(--stone)    !important; }

/* ─── 22. FAQ PAGE ──────────────────────────────────────────── */
.faq-header-section {
  background: linear-gradient(135deg, var(--blue-tint) 0%, var(--mist) 100%) !important;
}
.faq-title {
  color: var(--ink-soft) !important;
  font-family: var(--sans) !important;
}
.faq-header-section .text-white-50,
.faq-header-section .lead { color: var(--stone) !important; }
.faq-accordion .card {
  background: #fff !important;
  border-color: var(--line) !important;
}
.faq-accordion .card:hover { border-color: rgba(21,146,236,0.30) !important; }
/* Higher specificity beats template's .faq-btn { color: #fff !important } */
.faq-accordion .faq-btn {
  color: var(--ink-soft) !important;
  font-family: var(--sans) !important;
}
.faq-accordion .faq-btn:hover,
.faq-accordion .faq-btn:not(.collapsed) { color: var(--blue) !important; }
.faq-accordion .faq-btn:not(.collapsed) i.fa-chevron-down { color: var(--blue) !important; }
.faq-body { color: var(--stone) !important; font-family: var(--sans) !important; }
.faq-body strong.text-white { color: var(--ink-soft) !important; }
.contact-card {
  background: #fff !important;
  border-color: var(--line) !important;
}

/* ─── 23. MEMBERSHIP STRIP — 3-TIER BRAND CARDS ─────────────── */
.membership-strip {
  background: var(--mist) !important;
  padding-top: 72px !important;
  padding-bottom: 72px !important;
}
.mem-strip-eyebrow {
  font-family: var(--mono);
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--gold);
}
.mem-strip-heading {
  font-family: var(--sans);
  font-size: clamp(1.6rem, 3vw, 2.2rem);
  font-weight: 800;
  color: var(--ink-soft);
  margin: 8px 0 6px;
}
.mem-strip-sub {
  font-family: var(--sans);
  font-size: 1rem;
  color: var(--stone);
}
.mem-tier-card {
  background: #fff;
  border: 1.5px solid var(--line);
  border-radius: 24px;
  padding: 32px 28px;
  display: flex;
  flex-direction: column;
  position: relative;
  transition: box-shadow 0.25s ease, border-color 0.25s ease, transform 0.25s ease;
}
.mem-tier-card:hover {
  box-shadow: 0 12px 40px rgba(21,146,236,0.12);
  border-color: rgba(21,146,236,0.28);
  transform: translateY(-4px);
}
.mem-tier-card.is-featured {
  background: var(--blue-deep);
  border-color: var(--gold);
  box-shadow: 0 8px 32px rgba(10,74,143,0.22);
}
.mem-tier-card.is-featured:hover {
  box-shadow: 0 16px 48px rgba(10,74,143,0.30);
  border-color: var(--gold-deep);
}
.mem-tier-card.is-agent { border-color: rgba(21,146,236,0.36); }
.mem-tier-badge {
  position: absolute;
  top: -14px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--gold);
  color: var(--ink);
  font-family: var(--mono);
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  padding: 4px 16px;
  border-radius: var(--r-pill);
  white-space: nowrap;
}
.mem-tier-eyebrow {
  font-family: var(--mono);
  font-size: 0.64rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--stone);
  margin-bottom: 6px;
}
.mem-tier-card.is-featured .mem-tier-eyebrow { color: rgba(255,255,255,0.55); }
.mem-tier-name {
  font-family: var(--sans);
  font-size: 1.75rem;
  font-weight: 800;
  color: var(--ink-soft);
  line-height: 1.1;
  margin-bottom: 4px;
}
.mem-tier-card.is-featured .mem-tier-name { color: #fff; }
.mem-tier-price {
  font-family: var(--sans);
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--gold);
  margin-bottom: 20px;
}
.mem-tier-card.is-featured .mem-tier-price { color: var(--gold); }
.mem-tier-divider {
  border: none;
  border-top: 1px solid var(--line);
  margin: 0 0 20px;
}
.mem-tier-card.is-featured .mem-tier-divider { border-color: rgba(255,255,255,0.14); }
.mem-tier-feature {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-family: var(--sans);
  font-size: 0.88rem;
  color: var(--stone);
  line-height: 1.55;
  margin-bottom: 10px;
}
.mem-tier-card.is-featured .mem-tier-feature { color: rgba(255,255,255,0.80); }
.mem-tier-check { color: var(--gold); flex-shrink: 0; margin-top: 2px; font-size: 0.78rem; }
.mem-tier-foot {
  font-family: var(--sans);
  font-size: 0.78rem;
  color: var(--stone);
  margin-top: 24px;
  text-align: center;
}
.btn-mem-gold {
  display: block;
  text-align: center;
  background: var(--gold);
  color: var(--ink) !important;
  font-family: var(--sans);
  font-size: 0.9rem;
  font-weight: 700;
  padding: 12px 24px;
  border-radius: var(--r-pill);
  text-decoration: none !important;
  border: none;
  margin-top: auto;
  transition: background 0.18s ease, transform 0.18s ease;
  box-shadow: 0 4px 16px rgba(255,159,28,.22);
}
.btn-mem-gold:hover { background: var(--gold-deep); color: #fff !important; transform: translateY(-1px); }
.btn-mem-outline {
  display: block;
  text-align: center;
  background: transparent;
  color: var(--blue) !important;
  font-family: var(--sans);
  font-size: 0.9rem;
  font-weight: 700;
  padding: 11px 24px;
  border-radius: var(--r-pill);
  text-decoration: none !important;
  border: 1.5px solid var(--blue);
  margin-top: auto;
  transition: background 0.18s ease, transform 0.18s ease;
}
.btn-mem-outline:hover { background: var(--blue-tint); color: var(--blue-deep) !important; transform: translateY(-1px); }
.btn-mem-ghost {
  display: block;
  text-align: center;
  background: rgba(255,255,255,0.12);
  color: #fff !important;
  font-family: var(--sans);
  font-size: 0.9rem;
  font-weight: 700;
  padding: 11px 24px;
  border-radius: var(--r-pill);
  text-decoration: none !important;
  border: 1.5px solid rgba(255,255,255,0.38);
  margin-top: auto;
  transition: background 0.18s ease, transform 0.18s ease;
}
.btn-mem-ghost:hover { background: rgba(255,255,255,0.22); transform: translateY(-1px); }

/* ─── 24. SEARCH PAGE LOCAL VAR OVERRIDES ────────────────────── */
/* The local <style> in search.html sets --neon-cyan on links;
   override those usages to brand blue */
.ai-hint a[style*="neon-cyan"],
.search-card a[style*="neon-cyan"] { color: var(--blue) !important; }

/* ─── 25. PAGE-HERO ON PUBLIC PAGES ─────────────────────────── */
/* Hero sections keep their photo/dark overlay — text stays white.
   Only override if a page-hero is on a light/mist background. */
.page-hero .text-white { color: #ffffff !important; }  /* keep white in hero */

/* ─── 26. BOOTSTRAP BUTTON — BRAND COLOR OVERRIDE ───────────── */
/* Bootstrap CDN compiles btn-primary as #007bff (not our CSS var).
   Override globally so all .btn-primary matches brand blue. */
.btn-primary {
  background-color: var(--blue) !important;
  border-color: var(--blue) !important;
  color: #fff !important;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active {
  background-color: var(--blue-deep) !important;
  border-color: var(--blue-deep) !important;
  color: #fff !important;
}
.btn-outline-primary {
  border-color: var(--blue) !important;
  color: var(--blue) !important;
}
.btn-outline-primary:hover,
.btn-outline-primary:focus {
  background-color: var(--blue) !important;
  border-color: var(--blue) !important;
  color: #fff !important;
}

/* ─── 26. RESULTS PAGE — HARDCODED DARK FIX ─────────────────── */
/* rs_results.html: classes that use rgba(0,0,0,X) or rgba(8,18,30,X)
   backgrounds and rgba(255,255,255,X) text — invisible on light bg */

/* Hero panel (summary block at top of results) */
.rs-hero-panel {
  background: #ffffff !important;
  border-color: var(--line) !important;
  box-shadow: 0 8px 40px rgba(21,146,236,.08) !important;
}
.rs-hero-panel::before {
  background: linear-gradient(135deg,
    rgba(21,146,236,.22) 0%,
    rgba(255,159,28,.12) 60%,
    rgba(21,146,236,.04) 100%) !important;
}

/* Stats grid */
.rs-stat {
  background: var(--mist) !important;
  border-color: var(--line) !important;
}
.rs-stat .eyebrow { color: var(--stone) !important; }

/* Itinerary leg layout */
.rs-leg-label {
  background: var(--mist) !important;
  border-color: var(--line) !important;
  color: var(--stone) !important;
}
.rs-leg-track {
  background: #ffffff !important;
  border-color: var(--line) !important;
}
.rs-track-duration  { color: var(--stone) !important; }
.rs-track-line .line { background: var(--line) !important; }

/* Price breakdown */
.rs-breakdown-panel {
  border-top-color: var(--line) !important;
}
.rs-breakdown-row                  { color: var(--ink-soft) !important; }
.rs-breakdown-row .brow-label      { color: var(--stone) !important; }
.rs-breakdown-row.total-row        { border-top-color: var(--line) !important; }
.rs-breakdown-toggle               { color: var(--stone) !important; }
.rs-breakdown-toggle:hover         { color: var(--blue) !important; }
.rs-note, .rs-fee-note             { color: var(--stone) !important; }

/* Fare drawer trigger */
.rs-drawer-trigger {
  background: var(--mist) !important;
  border-color: var(--line) !important;
  color: var(--stone) !important;
}
.rs-drawer-trigger:hover {
  border-color: rgba(21,146,236,.30) !important;
  color: var(--blue) !important;
  background: var(--blue-tint) !important;
}
.rs-drawer-trigger.is-open {
  border-color: rgba(21,146,236,.35) !important;
  color: var(--blue) !important;
  background: var(--blue-tint) !important;
}

/* Fare drawer panel */
.rs-fare-drawer {
  background: #ffffff !important;
  border-color: rgba(21,146,236,.14) !important;
}
.rs-drawer-cell .dc-label          { color: var(--stone) !important; }
.rs-drawer-cell .dc-value.muted    { color: var(--stone) !important; }
.rs-drawer-rules                   { border-top-color: var(--line) !important; }
.rs-rule-item {
  background: var(--mist) !important;
  border-color: var(--line) !important;
}
.rs-rule-item .rule-detail         { color: var(--stone) !important; }

/* Actions row */
.rs-actions                        { border-top-color: var(--line) !important; }
.rs-helper                         { color: var(--stone) !important; }

/* Select / Book CTA — replaces dark gradient with brand gold */
.rs-select-btn {
  background: var(--gold) !important;
  color: var(--ink) !important;
  box-shadow: 0 4px 22px rgba(255,159,28,.32) !important;
}
.rs-select-btn:hover {
  background: var(--gold-deep) !important;
  color: #ffffff !important;
  filter: none !important;
}

/* Client note */
.rs-client-note                    { color: var(--ink-soft) !important; }

/* ─── 27. 3-TIER PRICING DISPLAY (PRICING_ENGINE v1.0) ────────── */
/* Base fare strikethrough — shown above main price when discount > 0 */
.rs-base-fare-orig {
  font-family: var(--mono);
  font-size: 0.85rem;
  color: var(--stone);
  text-decoration: line-through;
  text-decoration-color: rgba(92,107,122,0.55);
  margin-top: 6px;
  opacity: 0.75;
}
/* Savings pill — Basic / Member tier: gold */
.rs-savings.rs-savings--basic,
.rs-savings.rs-savings--member {
  background: rgba(255,159,28,0.10) !important;
  border: 1px solid rgba(255,159,28,0.30) !important;
  color: var(--gold-deep) !important;
}
/* Savings pill — Premium tier: brand blue */
.rs-savings.rs-savings--premium {
  background: rgba(21,146,236,0.09) !important;
  border: 1px solid rgba(21,146,236,0.28) !important;
  color: var(--blue) !important;
}
/* Small tier label chip inside the savings pill */
.rs-tier-label {
  display: inline-block;
  font-family: var(--mono);
  font-size: 0.55rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 1px 6px;
  border-radius: 999px;
  border: 1px solid currentColor;
  line-height: 1.5;
  opacity: 0.80;
}
/* Agent commission pill — B2B only, shown below the price */
.rs-commission-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 8px;
  padding: 5px 10px;
  border-radius: 999px;
  border: 1px solid rgba(21,146,236,0.22);
  background: rgba(21,146,236,0.05);
  color: var(--blue);
  font-size: 0.64rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-family: var(--mono);
}

/* Step bar (outbound-first flow) */
.rs-step-bar                       { color: var(--stone) !important; }
.rs-step {
  background: var(--mist) !important;
  color: var(--stone) !important;
  border-color: var(--line) !important;
}
.rs-step.is-active {
  background: var(--blue-tint) !important;
  color: var(--blue) !important;
  border-color: rgba(21,146,236,.30) !important;
}
.rs-step-divider                   { color: var(--line) !important; }

/* Empty / no-filter-results state */
.rs-no-filter-results.visible      { color: var(--stone) !important; }

/* Advanced filter panel */
.rs-filter-panel {
  background: #ffffff !important;
  border-color: rgba(21,146,236,.14) !important;
}
.rs-fp-label                       { color: var(--stone) !important; }
.rs-airline-check {
  background: var(--mist) !important;
  border-color: var(--line) !important;
  color: var(--stone) !important;
}
.rs-price-slider {
  background: var(--line) !important;
}
.rs-price-labels                   { color: var(--stone) !important; }

/* rs_review.html — unavailable fare chip */
.summary-fare-chip.unavailable {
  border-color: var(--line) !important;
  background: var(--mist) !important;
  color: var(--stone) !important;
}

/* ─── 27. BOOKING STATUS PAGE — HARDCODED DARK FIX ──────────── */
/* rs_booking_status.html: hardcoded dark bg / white text */

.bk-airline-logo {
  background: var(--mist) !important;
  border-color: var(--line) !important;
}
.bk-meta-cell {
  background: var(--mist) !important;
  border-color: var(--line) !important;
}
.bk-meta-label                     { color: var(--stone) !important; }
.bk-meta-value small               { color: var(--stone) !important; }
.bk-timeline-icon {
  background: #ffffff !important;
  border-color: var(--line) !important;
  color: var(--stone) !important;
}
.bk-timeline-sub                   { color: var(--stone) !important; }
.bk-timeline-label                 { color: var(--stone) !important; }
.bk-reassurance {
  background: var(--mist) !important;
  border-color: var(--line) !important;
}
.bk-btn-primary {
  background: var(--gold) !important;
  color: var(--ink) !important;
  box-shadow: 0 4px 22px rgba(255,159,28,.28) !important;
}
.bk-btn-primary:hover {
  background: var(--gold-deep) !important;
  color: #ffffff !important;
}

/* ─── 27. ABOUT / CONTACT / FAQ — REMAINING DETAIL FIXES ────── */

/* feature-card (about.html "Our Core Values") on white background */
.feature-card {
  background: var(--surface-color) !important;
  border-color: var(--line) !important;
}
.feature-card .text-white,
.feature-card h3.text-white,
.feature-card h4.text-white {
  color: var(--ink-soft) !important;
  font-family: var(--sans) !important;
}
.feature-card .text-white-50,
.feature-card p.text-white-50 { color: var(--stone) !important; }

/* Testimonial cards on light background (about.html carousel) */
.testimonial-card {
  background: #ffffff !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--r-lg) !important;
  box-shadow: var(--shadow-sm) !important;
  min-width: 300px;
  flex-shrink: 0;
}
.testimonial-card .text-white,
.testimonial-card h5.text-white { color: var(--ink-soft) !important; }
.testimonial-card .text-white-50,
.testimonial-card p.text-white-50 { color: var(--stone) !important; }
.testimonial-avatar {
  width: 46px;
  height: 46px;
  border-radius: 50% !important;
  object-fit: cover;
  flex-shrink: 0;
}

/* Testimonial carousel scroll animation */
.testimonial-carousel-wrapper { overflow: hidden; }
.testimonial-track {
  display: flex;
  gap: 20px;
  animation: testimonialScroll 48s linear infinite;
}
@keyframes testimonialScroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
  .testimonial-track { animation: none; flex-wrap: wrap; }
}

/* Review badge chips */
.badge-outline-cyan {
  display: inline-block;
  background: var(--blue-tint) !important;
  color: var(--blue) !important;
  border: 1px solid rgba(21,146,236,0.28) !important;
  border-radius: var(--r-pill) !important;
  font-family: var(--mono) !important;
  font-size: 0.67rem !important;
  font-weight: 600 !important;
  padding: 3px 10px !important;
  letter-spacing: 0.04em;
}
.badge-outline-purple {
  display: inline-block;
  background: var(--gold-soft) !important;
  color: var(--gold-deep) !important;
  border: 1px solid rgba(255,159,28,0.32) !important;
  border-radius: var(--r-pill) !important;
  font-family: var(--mono) !important;
  font-size: 0.67rem !important;
  font-weight: 600 !important;
  padding: 3px 10px !important;
  letter-spacing: 0.04em;
}
.text-warning-stars .fas,
.text-warning-stars .far { color: var(--gold) !important; }

/* faq.html contact-card text (§22 covers background/border, not text) */
.contact-card h3.text-white,
.contact-card h4.text-white {
  color: var(--ink-soft) !important;
  font-family: var(--sans) !important;
}
.contact-card .text-white-50,
.contact-card p.text-white-50 { color: var(--stone) !important; }

/* contact.html operating hours day labels — inline color:white on white panel */
.surface-panel span[style*="color: white"],
.surface-panel span[style*="color:white"] { color: var(--ink-soft) !important; }

/* contact.html form control (minimal underline style) */
.form-control-minimal {
  width: 100% !important;
  background: transparent !important;
  border: none !important;
  border-bottom: 2px solid var(--line) !important;
  border-radius: 0 !important;
  color: var(--ink-soft) !important;
  font-family: var(--sans) !important;
  font-size: 0.95rem !important;
  padding: 8px 0 !important;
  outline: none !important;
  box-shadow: none !important;
  transition: border-color 0.2s ease !important;
}
.form-control-minimal:focus {
  border-bottom-color: var(--blue) !important;
  box-shadow: none !important;
  background: transparent !important;
}
.form-control-minimal::placeholder { color: var(--stone) !important; }
textarea.form-control-minimal { resize: vertical !important; }

/* contact.html form labels (var(--text-secondary) — now defined in :root) */
.custom-input-group label { color: var(--stone) !important; }

/* ─── 28. rs_review.html — HARDCODED DARK FIX ───────────────── */
/* The review page uses rgba(8,18,30,x) panel backgrounds and
   rgba(255,255,255,x) text that was legible on dark bg but invisible
   on the brand light bg. All cosmetic — no form/logic touched.      */

/* Panels: white cards, brand border + shadow */
.review-shell .panel {
  background: #ffffff !important;
  border-color: var(--line) !important;
  box-shadow: 0 8px 40px rgba(21,146,236,0.08) !important;
  color: var(--ink-soft) !important;
}
.review-shell .panel::before {
  background: linear-gradient(135deg,
    rgba(21,146,236,0.22) 0%,
    rgba(255,159,28,0.12) 60%,
    rgba(21,146,236,0.04) 100%) !important;
}

/* Back link, copy, and overline text */
.review-back             { color: var(--stone) !important; }
.review-back:hover       { color: var(--blue)  !important; }
.review-back i           { color: var(--stone) !important; }
.review-title            { color: var(--ink-soft) !important; font-family: var(--sans) !important; }
.review-copy             { color: var(--stone) !important; }
.overline                { color: var(--blue)  !important; font-family: var(--mono) !important; }
.hero-note               { color: var(--gold-deep) !important; border-color: rgba(255,159,28,0.22) !important; background: rgba(255,159,28,0.07) !important; }

/* Summary section */
.summary-airline         { color: var(--ink-soft) !important; }
.summary-meta            { color: var(--stone) !important; }
.summary-fare-chip       { border-color: rgba(21,146,236,0.20) !important; background: rgba(21,146,236,0.06) !important; color: var(--blue) !important; }
.summary-fare-chip.business,
.summary-fare-chip.first { border-color: rgba(255,159,28,0.30) !important; background: rgba(255,159,28,0.08) !important; color: var(--gold-deep) !important; }

/* Price box (standalone and inline) */
.price-box {
  background: rgba(21,146,236,0.04) !important;
  border-color: var(--line) !important;
}
.price-box .label  { color: var(--stone) !important; }
.price-box .amount { color: var(--ink-soft) !important; }
.price-box .note,
.price-box .fee    { color: var(--stone) !important; }
.price-box .savings {
  background: rgba(21,146,236,0.07) !important;
  border-color: rgba(21,146,236,0.22) !important;
  color: var(--blue) !important;
}
.price-box .savings.savings-prem {
  background: rgba(255,159,28,0.08) !important;
  border-color: rgba(255,159,28,0.28) !important;
  color: var(--gold-deep) !important;
}

/* Itinerary route cards */
.route-card {
  background: var(--mist) !important;
  border-color: var(--line) !important;
}
.point-code          { color: var(--ink-soft) !important; }
.point-time          { color: var(--stone) !important; }
.route-mid i         { color: var(--gold) !important; }
.route-duration      { color: var(--stone) !important; }
.route-line span     { background: var(--line) !important; }

/* Passenger form: section labels and inputs */
.section-title       { color: var(--stone) !important; font-family: var(--mono) !important; }
.form-group label    { color: var(--stone) !important; }
.form-group input,
.form-group select {
  background: #ffffff !important;
  border-color: var(--line) !important;
  color: var(--ink-soft) !important;
}
.form-group input::placeholder { color: var(--stone) !important; opacity: 0.7; }
.form-group input:focus,
.form-group select:focus {
  border-color: rgba(21,146,236,0.50) !important;
  box-shadow: 0 0 0 3px rgba(21,146,236,0.09) !important;
}
.form-group select option { background: #ffffff !important; color: var(--ink-soft) !important; }

/* Quick-fill dropdown (v264) — update from cream to brand whites */
.v264-quick-fill {
  background-color: #ffffff !important;
  color: var(--ink-soft) !important;
  border: 1px solid rgba(21,146,236,0.28) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%231592EC'/%3E%3C/svg%3E") !important;
}
.v264-quick-fill option { background-color: #ffffff !important; color: var(--ink-soft) !important; }
.v264-quick-fill option[value=""] { color: var(--stone) !important; }
.v264-quick-fill:focus {
  border-color: rgba(21,146,236,0.50) !important;
  box-shadow: 0 0 0 3px rgba(21,146,236,0.09) !important;
}

/* Legal block */
.legal-block label { color: var(--ink-soft) !important; }
.legal-block a     { color: var(--gold-deep) !important; }
.legal-block input[type=checkbox] { accent-color: var(--gold) !important; }

/* CTA confirm button — brand gold replaces dark gradient */
.cta {
  background: var(--gold) !important;
  color: var(--ink) !important;
  box-shadow: 0 4px 22px rgba(255,159,28,0.30) !important;
  font-family: var(--sans) !important;
}
.cta:hover:not(:disabled) {
  background: var(--gold-deep) !important;
  color: #ffffff !important;
}
.cta:disabled { opacity: 0.55 !important; }

/* Escalate note and advisor link */
.escalate-note         { color: var(--stone) !important; }
.escalate-note a       { color: var(--blue) !important; }

/* Pricing note (stale price warning) — amber/info style */
.pricing-note {
  border-color: rgba(255,159,28,0.30) !important;
  background: rgba(255,159,28,0.06) !important;
  color: var(--ink-soft) !important;
}

/* Right column: assist card */
.assist-card           { background: #ffffff !important; border-color: var(--line) !important; }
.assist-pill           { border-color: rgba(21,146,236,0.20) !important; background: rgba(21,146,236,0.06) !important; color: var(--blue) !important; }
.assist-copy           { color: var(--stone) !important; }
.flow-item             { background: var(--mist) !important; border-color: var(--line) !important; }
.flow-item span        { color: var(--ink-soft) !important; }
.flow-index            { background: #ffffff !important; border-color: var(--line) !important; color: var(--blue) !important; }

/* Conversion banners on light bg */
.conv-banner-guest {
  border-color: rgba(21,146,236,0.22) !important;
  background: rgba(21,146,236,0.05) !important;
  color: var(--ink-soft) !important;
}
.conv-banner-guest .conv-banner-icon {
  background: rgba(21,146,236,0.10) !important;
  border-color: rgba(21,146,236,0.20) !important;
  color: var(--blue) !important;
}
.conv-banner-guest .conv-banner-cta {
  background: rgba(21,146,236,0.10) !important;
  border-color: rgba(21,146,236,0.28) !important;
  color: var(--blue) !important;
}
.conv-banner-upgrade {
  border-color: rgba(255,159,28,0.26) !important;
  background: rgba(255,159,28,0.06) !important;
  color: var(--ink-soft) !important;
}
.conv-banner-upgrade .conv-banner-icon {
  background: rgba(255,159,28,0.10) !important;
  border-color: rgba(255,159,28,0.24) !important;
  color: var(--gold-deep) !important;
}
.conv-banner-upgrade .conv-banner-cta {
  background: rgba(255,159,28,0.10) !important;
  border-color: rgba(255,159,28,0.28) !important;
  color: var(--gold-deep) !important;
}
.conv-banner-amount    { color: var(--ink-soft) !important; }

/* ─── 29. HOVER LIFT ANIMATIONS (prefers-reduced-motion safe) ── */
/*
 * Spring easing: cubic-bezier(.34,1.3,.5,1)
 * All transforms are gated behind prefers-reduced-motion: no-preference
 * so users who opt-out of motion see content normally (just the border/shadow).
 * Ref: IMPLEMENTATION_GUIDE.md §4 Motion
 */

/* ── Base transitions (border/shadow always; transform only with motion pref) ── */
.rs-card {
  transition: border-color 0.25s ease, box-shadow 0.25s ease !important;
}
.deal-card {
  transition: transform 0.35s cubic-bezier(.34,1.3,.5,1),
              box-shadow 0.35s ease !important;
  overflow: hidden;
}
.deal-card .deal-card-image {
  transition: transform 0.5s cubic-bezier(.34,1.3,.5,1) !important;
}
.prime-deal-card {
  transition: transform 0.35s cubic-bezier(.34,1.3,.5,1),
              box-shadow 0.35s ease,
              border-color 0.25s ease !important;
}
.airline-logo-item {
  transition: transform 0.3s cubic-bezier(.34,1.3,.5,1),
              opacity 0.25s ease !important;
}
.airline-logo-item .airline-logo-box {
  transition: box-shadow 0.3s ease, border-color 0.3s ease !important;
}
/* Sibling dim: when the row is hovered, unfocused items fade */
.partners-section:hover .airline-logo-item {
  opacity: 0.55;
}
.partners-section:hover .airline-logo-item:hover {
  opacity: 1;
}

/* ── Actual lifts — only for users who haven't requested reduced motion ── */
@media (prefers-reduced-motion: no-preference) {
  /* Flight result cards */
  .rs-card {
    transition: border-color 0.3s ease,
                box-shadow 0.3s ease,
                transform 0.35s cubic-bezier(.34,1.3,.5,1) !important;
    will-change: transform;
  }
  .rs-card:hover {
    transform: translateY(-10px) scale(1.02) !important;
    border-color: rgba(21,146,236,0.40) !important;
    box-shadow: 0 20px 48px rgba(21,146,236,0.16) !important;
  }

  /* Deal / destination photo cards */
  .deal-card:hover {
    transform: translateY(-12px) scale(1.035) !important;
    box-shadow: 0 24px 56px rgba(21,146,236,0.18) !important;
  }
  .deal-card:hover .deal-card-image {
    transform: scale(1.08) !important;
  }

  /* Prime / featured deal cards */
  .prime-deal-card:hover {
    transform: translateY(-8px) !important;
    box-shadow: 0 16px 40px rgba(21,146,236,0.14) !important;
    border-color: rgba(21,146,236,0.30) !important;
  }

  /* Membership tier cards */
  .mem-tier-card {
    transition: transform 0.35s cubic-bezier(.34,1.3,.5,1),
                box-shadow 0.35s ease,
                border-color 0.25s ease !important;
    will-change: transform;
  }
  .mem-tier-card:hover {
    transform: translateY(-10px) scale(1.02) !important;
    box-shadow: 0 20px 48px rgba(21,146,236,0.14) !important;
  }
  .mem-tier-card.is-featured:hover {
    transform: translateY(-12px) scale(1.03) !important;
    box-shadow: 0 24px 56px rgba(255,159,28,0.22) !important;
  }

  /* Airline partner logos */
  .airline-logo-item:hover {
    transform: scale(1.14) !important;
    opacity: 1 !important;
  }
  .airline-logo-item:hover .airline-logo-box {
    box-shadow: 0 8px 24px rgba(21,146,236,0.18) !important;
    border-color: rgba(21,146,236,0.30) !important;
  }

  /* Services grid cards (search.html .svc-card) */
  .svc-card {
    transition: transform 0.35s cubic-bezier(.34,1.3,.5,1),
                box-shadow 0.35s ease,
                border-color 0.25s ease !important;
    will-change: transform;
  }
  .svc-card:hover {
    transform: translateY(-10px) scale(1.02) !important;
    box-shadow: 0 20px 44px rgba(21,146,236,0.14) !important;
  }
}

/* ─── 30. PUBLIC PAGES — PHASE C FIXES ──────────────────────── */

/* Bootstrap 4.5 .btn-primary hardcodes #007bff.
   Override globally so about.html, hotels.html, cruises.html all
   use brand blue. Using .btn selector for specificity parity.       */
.btn.btn-primary,
a.btn.btn-primary {
  background-color: var(--blue) !important;
  border-color:     var(--blue) !important;
  color: #fff !important;
}
.btn.btn-primary:hover,
.btn.btn-primary:focus,
.btn.btn-primary:active,
.btn.btn-primary.active,
a.btn.btn-primary:hover,
a.btn.btn-primary:focus,
.btn.btn-primary:not(:disabled):not(.disabled):active {
  background-color: var(--blue-deep) !important;
  border-color:     var(--blue-deep) !important;
  color: #fff !important;
  box-shadow: 0 6px 24px rgba(21,146,236,0.28) !important;
}

/* hotels.html / cruises.html — .surface-panel sits inside a dark
   .page-hero overlay. §21 sets .surface-panel{background:#fff!important}
   which kills the glassmorphism. This 2-class selector (.page-hero +
   .surface-panel) has higher specificity and wins.                  */
.page-hero .surface-panel {
  background:          rgba(255, 255, 255, 0.07) !important;
  border:              1px solid rgba(255, 255, 255, 0.14) !important;
  backdrop-filter:     blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  box-shadow:          0 8px 40px rgba(0, 0, 0, 0.22) !important;
}
/* §21's .surface-panel h2/.surface-panel p would turn text dark —
   restore white text inside the dark-hero panel.                    */
.page-hero .surface-panel,
.page-hero .surface-panel h1,
.page-hero .surface-panel h2,
.page-hero .surface-panel h3,
.page-hero .surface-panel p       { color: #fff !important; }
.page-hero .surface-panel .text-white     { color: #fff !important; }
.page-hero .surface-panel .lead           { color: #fff !important; }
.page-hero .surface-panel .text-white-50  { color: rgba(255,255,255,0.65) !important; }

/* rs_booking_status.html — .bk-ref-copy and .bk-subheadline use
   color:var(--mist), but brand-reskin.css sets --mist:#F3F7FB (light).
   Invisible light text on the now-light .bk-card background.        */
.bk-ref-copy    { color: var(--stone) !important; }
.bk-subheadline { color: var(--stone) !important; }