/* ════════════════════════════════════════════════════════════════════════
   SKYROUTE — Premium Travel Platform Design System
   ----------------------------------------------------------------------
   A complete visual redesign built on a single rule: nothing competes
   with the route. Deep navy grounds the interface like a night sky at
   cruising altitude; royal blue carries every action; sky blue marks the
   single moment that matters most on each screen — the live price.

   All existing HTML structure, PHP templates, JS hooks, class names and
   IDs are preserved exactly. Only the visual layer changes.
   ════════════════════════════════════════════════════════════════════════ */


   /* ─────────────────────────────────────────────────────────────────────
      DESIGN TOKENS
   ───────────────────────────────────────────────────────────────────── */
   :root {
     /* ── Brand palette ─────────────────────────────────────────── */
     --navy:            #0F172A;
     --navy-700:        #16213D;
     --navy-600:        #1E2A4A;
     --navy-500:        #2A3B5C;
   
     --royal:           #2563EB;
     --royal-hover:     #1D4ED8;
     --royal-light:     #EFF4FF;
     --royal-border:    #C7DAFE;
   
     --sky:             #38BDF8;
     --sky-light:       #EFF9FF;
     --sky-deep:        #0EA5E9;
   
     /* ── Semantic ───────────────────────────────────────────────── */
     --success:         #10B981;
     --success-light:   #ECFDF5;
     --success-border:  #A7F3D0;
     --warning:         #F59E0B;
     --warning-light:   #FFFBEB;
     --warning-border:  #FDE3A7;
     --danger:          #EF4444;
     --danger-light:    #FEF2F2;
     --danger-border:   #FBC8C8;
   
     /* ── Neutrals ───────────────────────────────────────────────── */
     --bg:              #F8FAFC;
     --bg-raised:       #F1F5F9;
     --surface:         #FFFFFF;
     --surface-sunken:  #F8FAFC;
   
     --text-1:          #0F172A;
     --text-2:          #334155;
     --text-3:          #64748B;
     --text-4:          #94A3B8;
     --text-inverse:    #FFFFFF;
     --text-inverse-70: rgba(255,255,255,.72);
     --text-inverse-45: rgba(255,255,255,.46);
   
     --border:          #E2E8F0;
     --border-soft:     #EDF1F6;
     --border-strong:   #CBD5E1;
   
     /* ── Typography ─────────────────────────────────────────────── */
     --font-display:    'Plus Jakarta Sans', 'Inter', -apple-system, sans-serif;
     --font-body:       'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
     --font-mono:       'Inter', ui-monospace, 'SF Mono', monospace;
   
     /* ── Spacing scale (4px base) ───────────────────────────────── */
     --sp-1:  4px;
     --sp-2:  8px;
     --sp-3:  12px;
     --sp-4:  16px;
     --sp-5:  20px;
     --sp-6:  24px;
     --sp-8:  32px;
     --sp-10: 40px;
     --sp-12: 48px;
     --sp-16: 64px;
     --sp-20: 80px;
   
     /* ── Radius scale ───────────────────────────────────────────── */
     --r-xs:   4px;
     --r-sm:   8px;
     --r-md:   10px;
     --r-lg:   14px;
     --r-xl:   18px;
     --r-2xl:  24px;
     --r-pill: 999px;
   
     /* ── Shadow scale ───────────────────────────────────────────── */
     --shadow-xs:  0 1px 2px rgba(15,23,42,.05);
     --shadow-sm:  0 2px 6px rgba(15,23,42,.06), 0 1px 2px rgba(15,23,42,.04);
     --shadow-md:  0 6px 16px rgba(15,23,42,.08), 0 2px 6px rgba(15,23,42,.04);
     --shadow-lg:  0 16px 40px rgba(15,23,42,.12), 0 4px 12px rgba(15,23,42,.05);
     --shadow-xl:  0 28px 70px rgba(15,23,42,.18), 0 8px 24px rgba(15,23,42,.08);
     --shadow-navy: 0 12px 28px rgba(15,23,42,.28);
     --shadow-royal: 0 10px 24px rgba(37,99,235,.28);
     --shadow-focus: 0 0 0 4px rgba(37,99,235,.14);
   
     /* ── Motion scale ───────────────────────────────────────────── */
     --ease:        cubic-bezier(.4,0,.2,1);
     --ease-out:    cubic-bezier(.16,1,.3,1);
     --t-fast:      .14s;
     --t-base:      .22s;
     --t-slow:      .42s;
   
     /* ── Z-index scale ──────────────────────────────────────────── */
     --z-base:      1;
     --z-raised:    5;
     --z-sticky:    100;
     --z-dropdown:  9999;
     --z-overlay:   99999;
     --z-modal:     100000;
   
     /* ── Layout ─────────────────────────────────────────────────── */
     --navbar-h:    68px;
     --container-xl: 1240px;
   
     /* ── Back-compat aliases (legacy token names still referenced
          in inline overrides further down the stylesheet) ────────── */
     --black:          var(--navy);
     --white:          var(--surface);
     --accent:         var(--royal);
     --accent-hover:   var(--royal-hover);
     --accent-light:   var(--royal-light);
     --accent-border:  var(--royal-border);
     --muted:          var(--text-3);
     --subtle:         var(--text-4);
     --ink:            var(--text-1);
     --ink-2:          var(--text-2);
     --ink-3:          var(--text-2);
     --border-light:   var(--border-soft);
     --border-dark:    var(--border-strong);
     --warn:           var(--warning);
     --warn-light:     var(--warning-light);
   }
   
   /* ─────────────────────────────────────────────────────────────────────
      RESET & BASE
   ───────────────────────────────────────────────────────────────────── */
   *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
   
   html { scroll-behavior: smooth; }
   
   body {
     font-family: var(--font-body);
     background: var(--bg);
     color: var(--text-1);
     padding-top: var(--navbar-h);
     line-height: 1.6;
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
     font-size: 15px;
     letter-spacing: -.01em;
   }
   
   img { display: block; max-width: 100%; }
   
   @media (prefers-reduced-motion: reduce) {
     *, *::before, *::after {
       animation-duration: .001ms !important;
       animation-iteration-count: 1 !important;
       transition-duration: .001ms !important;
       scroll-behavior: auto !important;
     }
   }
   /* ─────────────────────────────────────────────────────────────────────
      NAVBAR
   ───────────────────────────────────────────────────────────────────── */
   .navbar {
     position: fixed;
     top: 0; left: 0;
     width: 100%;
     z-index: var(--z-sticky);
     height: var(--navbar-h);
     background: rgba(255,255,255,.78);
     backdrop-filter: blur(20px) saturate(180%);
     -webkit-backdrop-filter: blur(20px) saturate(180%);
     border-bottom: 1px solid rgba(226,232,240,.6);
     box-shadow: none;
     transition: background var(--t-base) var(--ease), border-color var(--t-base) var(--ease), box-shadow var(--t-base) var(--ease);
     padding: 0;
   }
   
   .navbar.scrolled {
     background: rgba(255,255,255,.92);
     border-bottom-color: var(--border);
     box-shadow: var(--shadow-sm);
   }
   
   .navbar .container {
     height: 100%;
     display: flex;
     align-items: center;
   }
   
   .navbar-brand {
     display: flex;
     align-items: center;
     gap: 10px;
     text-decoration: none;
   }
   
   .navbar-brand img { height: 26px; width: auto; }

   .worldhub-site-brand {
     flex: 0 0 auto;
     max-width: min(250px, 38vw);
   }

   .worldhub-site-brand picture {
     display: flex;
     align-items: center;
   }

   .worldhub-site-brand .worldhub-site-logo {
     display: block;
     width: auto;
     height: 58px;
     max-width: 100%;
     object-fit: contain;
   }
   
   .navbar-brand span {
     font-family: var(--font-display);
     font-weight: 800;
     font-size: 1.05rem;
     color: var(--navy);
     letter-spacing: -.03em;
   }
   
   .nav-link {
     font-family: var(--font-body);
     font-size: .86rem;
     font-weight: 500;
     color: var(--text-2) !important;
     padding: .5rem .9rem !important;
     border-radius: var(--r-sm);
     transition: background var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
     display: flex;
     align-items: center;
     gap: 6px;
     letter-spacing: -.01em;
   }
   
   .nav-link:hover {
     background: var(--royal-light);
     color: var(--royal) !important;
   }
   
   .nav-link.btn-signin {
     background: var(--navy);
     color: var(--text-inverse) !important;
     padding: .5rem 1.15rem !important;
     font-weight: 600;
     font-size: .84rem;
     border-radius: var(--r-pill);
     box-shadow: var(--shadow-navy);
     transition: background var(--t-fast) var(--ease), transform var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
   }
   
   .nav-link.btn-signin:hover {
     background: var(--royal);
     color: var(--text-inverse) !important;
     transform: translateY(-1px);
     box-shadow: var(--shadow-royal);
   }
   
   .navbar-toggler {
     border: none !important;
     color: var(--navy) !important;
     padding: 6px;
   }
   
    @media (max-width: 768px) {
      .navbar-collapse {
        width: 100%;
        background: var(--surface);
        padding: 14px;
        border-radius: var(--r-lg);
        box-shadow: var(--shadow-lg);
        border: 1px solid var(--border);
        overflow-x: hidden;
      }
      .navbar-collapse.collapsing { background: var(--surface); }
      .navbar-collapse .navbar-nav {
        align-items: flex-start !important;
        width: 100%;
      }
      .navbar-collapse .nav-item {
        width: 100%;
      }
      .navbar-collapse .nav-link {
        justify-content: flex-start;
        width: 100%;
        color: var(--text-2) !important;
        background: transparent;
        margin: 2px 0;
        border-radius: var(--r-sm);
        padding: .72rem .9rem !important;
        text-align: left;
      }
      .navbar-collapse .nav-link:hover {
        background: var(--royal-light);
        color: var(--royal) !important;
      }
    }
   /* ─────────────────────────────────────────────────────────────────────
      HERO
   ───────────────────────────────────────────────────────────────────── */
   .worldhub-hero {
     /* min-height: 92vh; */
     background:
       radial-gradient(ellipse 900px 500px at 14% 18%, rgba(56,189,248,.16) 0%, transparent 60%),
       radial-gradient(ellipse 700px 600px at 88% 82%, rgba(37,99,235,.20) 0%, transparent 60%),
       linear-gradient(165deg, rgba(15,23,42,.94) 0%, rgba(22,33,61,.88) 52%, rgba(30,42,74,.82) 100%),
       url('../images/bg3.jpg') center/cover no-repeat;
     display: flex;
     align-items: center;
     padding: 1rem 0 2rem;
     overflow: hidden;
     position: relative;
   }
   
   .worldhub-hero::before {
     content: '';
     position: absolute;
     inset: 0;
     background-image:
       linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
       linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
     background-size: 64px 64px;
     -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,.7), transparent 75%);
     mask-image: linear-gradient(180deg, rgba(0,0,0,.7), transparent 75%);
     pointer-events: none;
   }
   
   /* floating decorative orbit + plane-path flourish — signature element */
   .worldhub-hero::after {
     content: '';
     position: absolute;
     top: 8%;
     right: 6%;
     width: 460px;
     height: 460px;
     border: 1px solid rgba(255,255,255,.08);
     border-radius: 50%;
     background: radial-gradient(circle at 30% 30%, rgba(56,189,248,.08), transparent 70%);
     pointer-events: none;
     animation: heroOrbit 40s linear infinite;
   }
   
   @keyframes heroOrbit {
     from { transform: rotate(0deg); }
     to   { transform: rotate(360deg); }
   }
   
   .worldhub-hero-eyebrow {
     display: inline-flex;
     align-items: center;
     gap: 6px;
     color: var(--text-inverse-70);
     font-size: .72rem;
     font-weight: 600;
     letter-spacing: .12em;
     text-transform: uppercase;
     margin-bottom: 1rem;
     background: rgba(255,255,255,.07);
     border: 1px solid rgba(255,255,255,.14);
     padding: 6px 14px;
     border-radius: var(--r-pill);
     backdrop-filter: blur(6px);
   }
   
   .worldhub-hero-headline {
     font-family: var(--font-display);
     font-size: clamp(2.6rem, 5.4vw, 4.2rem);
     font-weight: 800;
     line-height: 1.08;
     color: var(--text-inverse);
     letter-spacing: -.035em;
     margin-bottom: 1rem;
   }
   
   .worldhub-hero-headline em {
     font-style: normal;
     font-weight: 500;
     background: linear-gradient(95deg, var(--sky) 0%, #93D9FB 100%);
     -webkit-background-clip: text;
     background-clip: text;
     color: transparent;
   }
   
   .worldhub-hero-sub {
     color: var(--text-inverse-70);
     font-size: .98rem;
     font-weight: 400;
     margin-bottom: 0;
     max-width: 480px;
     line-height: 1.75;
   }
   
   /* ─────────────────────────────────────────────────────────────────────
      SEARCH CARD
   ───────────────────────────────────────────────────────────────────── */
   .worldhub-search-card {
     background: var(--surface);
     border-radius: var(--r-2xl);
     box-shadow: var(--shadow-xl);
     padding: 2rem;
     margin-top: 2.25rem;
     position: relative;
     z-index: 10;
     border: 1px solid rgba(255,255,255,.6);
   }
   
   /* trip tabs */
   .worldhub-trip-tabs {
     display: inline-flex;
     background: var(--bg-raised);
     border-radius: var(--r-md);
     padding: 4px;
     gap: 2px;
     margin-bottom: 1.4rem;
     border: 1px solid var(--border-soft);
   }
   
   .worldhub-trip-tab {
     border: none;
     background: transparent;
     padding: .42rem 1.1rem;
     border-radius: 7px;
     font-size: .81rem;
     font-weight: 600;
     color: var(--text-3);
     cursor: pointer;
     transition: all var(--t-fast) var(--ease);
     font-family: var(--font-body);
     letter-spacing: -.01em;
   }
   
   .worldhub-trip-tab.active {
     background: var(--navy);
     color: var(--text-inverse);
     box-shadow: var(--shadow-sm);
   }
   
   /* field */
   .worldhub-field-label {
     font-size: .72rem;
     font-weight: 700;
     letter-spacing: .05em;
     text-transform: uppercase;
     color: var(--text-3);
     margin-bottom: 7px;
   }
   
   .worldhub-field-input { position: relative; }
   
   .worldhub-field-input .fi-icon {
     position: absolute;
     left: 13px;
     top: 50%;
     transform: translateY(-50%);
     color: var(--royal);
     z-index: 2;
     font-size: .9rem;
     pointer-events: none;
   }
   
   .worldhub-field-input input,
   .worldhub-field-input .worldhub-field-input-inner {
     width: 100%;
     border: 1.5px solid var(--border);
     border-radius: var(--r-md);
     padding: .65rem .85rem .65rem 2.4rem;
     background: var(--surface-sunken);
     font-size: .9rem;
     font-family: var(--font-body);
     color: var(--text-1);
     transition: border-color var(--t-fast) var(--ease), background var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
     height: 50px;
     letter-spacing: -.01em;
     font-weight: 500;
   }
   
   .worldhub-field-input input:focus {
     border-color: var(--royal);
     background: var(--surface);
     outline: none;
     box-shadow: var(--shadow-focus);
   }
   
   .worldhub-field-input.is-invalid input {
     border-color: var(--danger);
     box-shadow: 0 0 0 4px rgba(239,68,68,.1);
   }
   
   .worldhub-field-error {
     display: block;
     font-size: .72rem;
     color: var(--danger);
     margin-top: 5px;
     min-height: 1em;
     font-weight: 500;
   }
   
   /* Swap button */
   .worldhub-swap-btn {
     width: 38px;
     height: 38px;
     border-radius: 50%;
     background: var(--royal);
     color: var(--text-inverse);
     display: flex;
     align-items: center;
     justify-content: center;
     cursor: pointer;
     margin: 28px auto 0;
     box-shadow: var(--shadow-royal);
     transition: background var(--t-base) var(--ease), transform var(--t-slow) var(--ease-out);
   }
   
   .worldhub-swap-btn:hover {
     background: var(--royal-hover);
     transform: rotate(180deg);
   }
   
   /* Search button */
   .worldhub-btn-search {
     width: 100%;
     background: linear-gradient(135deg, var(--royal) 0%, var(--royal-hover) 100%);
     color: var(--text-inverse);
     border-radius: var(--r-md);
     padding: .7rem;
     font-weight: 700;
     font-size: .9rem;
     border: none;
     height: 50px;
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 8px;
     font-family: var(--font-body);
     box-shadow: var(--shadow-royal);
     transition: transform var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease), filter var(--t-fast) var(--ease);
     letter-spacing: -.01em;
   }
   
   .worldhub-btn-search:hover {
     transform: translateY(-2px);
     filter: brightness(1.05);
     box-shadow: 0 14px 30px rgba(37,99,235,.36);
   }
   
   /* Autocomplete dropdowns */
   #fromCitylist,
   #toCitylist,
   #prefferedAirlineList {
     position: absolute;
     width: 100%;
     background: var(--surface);
     border-radius: var(--r-lg);
     box-shadow: var(--shadow-lg);
     border: 1px solid var(--border);
     z-index: var(--z-dropdown);
     display: none;
     max-height: 290px;
     overflow-y: auto;
     top: calc(100% + 8px);
     left: 0;
   }
   
   .worldhub-ac-group-title {
     font-size: .68rem;
     font-weight: 700;
     letter-spacing: .08em;
     text-transform: uppercase;
     color: var(--text-4);
     padding: 9px 14px 5px;
     background: var(--surface-sunken);
   }
   
   .worldhub-ac-item {
     padding: 10px 14px;
     cursor: pointer;
     border-bottom: 1px solid var(--border-soft);
     transition: background var(--t-fast) var(--ease);
   }
   
   .worldhub-ac-item:hover,
   .worldhub-ac-item.active { background: var(--royal-light); }
   
   .worldhub-ac-main { font-size: .88rem; color: var(--text-1); font-weight: 600; }
   .worldhub-ac-sub  { font-size: .73rem; color: var(--text-3); margin-top: 1px; }
   .worldhub-ac-empty { padding: 14px; color: var(--text-3); font-size: .84rem; text-align: center; }
   
   /* Traveller dropdown */
   #travellerBox { cursor: pointer; }
   
   .worldhub-trav-dropdown {
     position: absolute;
     top: calc(100% + 9px);
     left: 0;
     width: 310px;
     max-width: 92vw;
     background: var(--surface);
     border-radius: var(--r-xl);
     box-shadow: var(--shadow-lg);
     border: 1px solid var(--border);
     padding: 1.1rem;
     z-index: var(--z-overlay);
     animation: fadeUp .2s var(--ease-out);
   }
   
   @keyframes fadeUp {
     from { opacity: 0; transform: translateY(6px); }
     to   { opacity: 1; transform: translateY(0); }
   }
   
   .worldhub-trav-row {
     display: flex;
     justify-content: space-between;
     align-items: center;
     margin-bottom: .85rem;
   }
   
   .worldhub-trav-row strong { font-size: .88rem; color: var(--text-1); font-weight: 700; }
   .worldhub-trav-row small  { font-size: .72rem; color: var(--text-3); }
   
   .worldhub-trav-row button {
     width: 30px; height: 30px;
     border-radius: var(--r-sm);
     border: 1.5px solid var(--border);
     background: var(--surface);
     font-weight: 700;
     font-size: .94rem;
     color: var(--royal);
     cursor: pointer;
     transition: background var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);
   }
   
   .worldhub-trav-row button:hover {
     background: var(--royal-light);
     border-color: var(--royal-border);
   }
   
   #travellerError {
     font-size: .73rem;
     color: var(--danger);
     margin-top: 6px;
     display: none;
   }
   
   /* Airline tags */
   .worldhub-airline-tag {
     display: inline-flex;
     align-items: center;
     gap: 6px;
     background: var(--royal-light);
     color: var(--royal-hover);
     border-radius: var(--r-sm);
     padding: 4px 9px;
     font-size: .74rem;
     font-weight: 700;
     margin: 3px 3px 3px 0;
     border: 1px solid var(--royal-border);
   }
   
   .worldhub-airline-tag-remove {
     cursor: pointer;
     font-size: .68rem;
     color: var(--royal);
     line-height: 1;
     transition: color var(--t-fast) var(--ease);
   }
   .worldhub-airline-tag-remove:hover { color: var(--danger); }
   
   /* Non-stop checkbox */
   .form-check-input:checked {
     background-color: var(--royal);
     border-color: var(--royal);
   }
   /* ─────────────────────────────────────────────────────────────────────
      STATS BAR
   ───────────────────────────────────────────────────────────────────── */
   .worldhub-stats-bar {
     background: var(--surface);
     padding: 1.5rem 0;
     border-bottom: 1px solid var(--border-soft);
     position: relative;
     z-index: 5;
   }
   
   .worldhub-stat-item {
     text-align: center;
     padding: .5rem .8rem;
     position: relative;
     transition: transform var(--t-base) var(--ease);
   }
   
   .worldhub-stat-item:hover { transform: translateY(-3px); }
   
   .worldhub-stat-num {
     font-family: var(--font-display);
     font-size: 1.7rem;
     color: var(--navy);
     font-weight: 800;
     line-height: 1;
     letter-spacing: -.04em;
   }
   
   .worldhub-stat-num span { color: var(--text-3); font-size: .86rem; font-weight: 500; }
   
   .worldhub-stat-label {
     font-size: .7rem;
     color: var(--text-3);
     margin-top: 6px;
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 4px;
     font-weight: 600;
     letter-spacing: .03em;
     text-transform: uppercase;
   }
   
   .worldhub-stat-label i { color: var(--sky); }
   
   .worldhub-stat-item::after {
     content: '';
     position: absolute;
     right: 0; top: 20%;
     height: 60%; width: 1px;
     background: var(--border-soft);
   }
   
   .col-md-3:last-child .worldhub-stat-item::after { display: none; }
   
   /* ─────────────────────────────────────────────────────────────────────
      SECTION HEADINGS
   ───────────────────────────────────────────────────────────────────── */
   .worldhub-sec-eyebrow {
     font-size: .7rem;
     font-weight: 700;
     text-transform: uppercase;
     letter-spacing: .12em;
     color: var(--royal);
     margin-bottom: .5rem;
     display: flex;
     align-items: center;
     gap: 6px;
   }
   
   .worldhub-sec-title {
     font-family: var(--font-display);
     font-size: clamp(1.7rem, 3vw, 2.35rem);
     font-weight: 800;
     color: var(--navy);
     letter-spacing: -.03em;
     line-height: 1.15;
   }
   
   .worldhub-sec-sub {
     font-size: .9rem;
     color: var(--text-3);
     margin-top: .4rem;
   }
   
   /* ─────────────────────────────────────────────────────────────────────
      DESTINATION CARDS
   ───────────────────────────────────────────────────────────────────── */
   .worldhub-dest-card {
     border-radius: var(--r-xl);
     overflow: hidden;
     cursor: pointer;
     position: relative;
     border: 1px solid var(--border-soft);
     transition: transform var(--t-base) var(--ease-out), box-shadow var(--t-base) var(--ease-out);
   }
   
   .worldhub-dest-card:hover {
     transform: translateY(-6px);
     box-shadow: var(--shadow-lg);
     border-color: var(--border);
   }
   
   .worldhub-dest-card img {
     width: 100%;
     object-fit: cover;
     transition: transform .6s var(--ease-out);
   }
   
   .worldhub-dest-card:hover img { transform: scale(1.06); }
   
   .worldhub-dest-info {
     position: absolute;
     inset: 0;
     top: auto;
     background: linear-gradient(transparent 15%, rgba(15,23,42,.92));
     padding: 3rem 1.2rem 1.1rem;
     color: var(--text-inverse);
   }
   
   .worldhub-dest-city {
     font-family: var(--font-display);
     font-size: 1.05rem;
     font-weight: 700;
     display: flex;
     align-items: center;
     gap: 5px;
     letter-spacing: -.02em;
   }
   
   .worldhub-dest-price {
     font-size: .77rem;
     color: var(--text-inverse-70);
     margin-top: 4px;
   }
   
   .worldhub-dest-price strong {
     color: var(--sky);
     font-size: .92rem;
     font-weight: 700;
   }
   
   .worldhub-dest-badge {
     position: absolute;
     top: 12px; right: 12px;
     background: var(--surface);
     color: var(--navy);
     font-size: .62rem;
     font-weight: 800;
     padding: 4px 10px;
     border-radius: var(--r-pill);
     letter-spacing: .06em;
     text-transform: uppercase;
     box-shadow: var(--shadow-sm);
   }
   
   /* ─────────────────────────────────────────────────────────────────────
      FOOTER
   ───────────────────────────────────────────────────────────────────── */
   footer {
     background: var(--navy);
     padding: 3rem 0;
     border-top: 1px solid rgba(255,255,255,.06);
   }
   
   .worldhub-footer-brand {
     display: flex;
     align-items: center;
     gap: 10px;
   }

   .worldhub-footer-logo-link {
     display: inline-flex;
     align-items: center;
     padding: 7px 12px;
     border-radius: 12px;
     background: rgba(255,255,255,.96);
   }

   .worldhub-footer-logo {
     display: block;
     width: auto;
     height: 52px;
     max-width: 230px;
     object-fit: contain;
   }
   
   .worldhub-footer-brand span {
     font-family: var(--font-display);
     font-size: 1rem;
     font-weight: 800;
     color: rgba(255,255,255,.86);
     letter-spacing: -.02em;
   }
   
   footer p {
     font-size: .8rem;
     color: rgba(255,255,255,.4);
     margin: 0;
   }
   
   footer a {
     font-size: .8rem;
     color: rgba(255,255,255,.45);
     text-decoration: none;
     transition: color var(--t-fast) var(--ease);
   }
   
   footer a:hover { color: var(--sky); }
   /* ─────────────────────────────────────────────────────────────────────
      SEARCH RESULTS — Page Shell
   ───────────────────────────────────────────────────────────────────── */
   .worldhub-sr-page {
     background: var(--bg);
     height: auto;
     overflow: visible;
     display: block;
     margin-top: 0;
   }
   
   /* sticky route summary bar */
   .worldhub-sr-search-bar {
     background: var(--surface);
     border-bottom: 1px solid var(--border-soft);
     padding: 12px 20px;
     flex-shrink: 0;
     z-index: var(--z-sticky);
     box-shadow: var(--shadow-xs);
   }
   
   .worldhub-sr-search-summary {
     display: flex;
     align-items: center;
     justify-content: space-between;
     gap: 1rem;
     height: auto;
     padding: 4px 0;
     flex-wrap: wrap;
   }
   
   .worldhub-sr-route {
     display: flex;
     align-items: center;
     gap: .55rem;
   }
   
   .worldhub-sr-route-iata {
     font-family: var(--font-display);
     font-size: 20px;
     font-weight: 800;
     color: var(--navy);
     letter-spacing: -.02em;
   }
   
   .worldhub-sr-route-arrow { color: var(--sky-deep); font-size: 14px; margin: 0 2px; }
   
   .worldhub-sr-route-meta { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
   
   .worldhub-sr-route-pill {
     background: var(--royal-light);
     border: 1px solid var(--royal-border);
     border-radius: var(--r-pill);
     font-size: 11.5px;
     color: var(--royal-hover);
     padding: 4px 11px;
     white-space: nowrap;
     font-weight: 600;
     display: flex;
     align-items: center;
     gap: 4px;
   }
   
   .worldhub-sr-modify-btn {
     display: inline-flex;
     align-items: center;
     gap: 6px;
     font-size: .82rem;
     font-weight: 600;
     padding: 7px 16px;
     border-radius: var(--r-pill);
     border: 1.5px solid var(--border);
     background: var(--surface);
     color: var(--text-2);
     cursor: pointer;
     transition: all var(--t-fast) var(--ease);
     font-family: var(--font-body);
   }
   
   .worldhub-sr-modify-btn:hover {
     background: var(--royal-light);
     border-color: var(--royal-border);
     color: var(--royal);
   }
   
   .worldhub-sr-modify-panel {
     border-top: 1px solid var(--border);
     background: var(--surface-sunken);
     padding: 1.2rem 0;
   }
   
   /* Body layout */
   .worldhub-sr-body {
     display: flex;
     flex-direction: row;
     flex: 1;
     overflow: visible;
     height: auto;
     align-items: flex-start;
     /* padding: 18px; */
     gap: 18px;
     background: var(--bg);
   }
   
   /* ─────────────────────────────────────────────────────────────────────
      SIDEBAR — Filters
   ───────────────────────────────────────────────────────────────────── */
   .worldhub-sr-sidebar {
     width: 280px;
     min-width: 280px;
     background: var(--surface);
     border: 1px solid var(--border-soft);
     border-radius: var(--r-lg);
     overflow-x: visible;
     padding: 16px;
     display: flex;
     flex-direction: column;
     gap: .65rem;
     flex-shrink: 0;
     position: sticky;
     top: calc(var(--navbar-h) + 12px);
     max-height: calc(100vh - var(--navbar-h) - 32px);
     overflow-y: auto;
     box-shadow: var(--shadow-sm);
     font-family: var(--font-body);
   }

   .worldhub-sr-sidebar button,
   .worldhub-sr-sidebar input,
   .worldhub-sr-sidebar label {
     font-family: inherit;
   }
   
   .worldhub-sr-sidebar::-webkit-scrollbar { width: 4px; }
   .worldhub-sr-sidebar::-webkit-scrollbar-track { background: transparent; }
   .worldhub-sr-sidebar::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 4px; }
   
   .worldhub-sr-sidebar-head {
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding-bottom: .6rem;
     border-bottom: 1px solid var(--border-soft);
   }
   
   .worldhub-sr-sidebar-title {
     font-size: .72rem;
     font-weight: 800;
     letter-spacing: .07em;
     text-transform: uppercase;
     color: var(--navy);
   }
   
   .worldhub-sr-reset-btn {
     font-size: .72rem;
     font-weight: 700;
     color: var(--royal);
     background: var(--royal-light);
     border: none;
     border-radius: var(--r-pill);
     padding: 5px 12px;
     cursor: pointer;
     display: flex;
     align-items: center;
     gap: 4px;
     font-family: var(--font-body);
     transition: background var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
   }
   
   .worldhub-sr-reset-btn:hover { background: var(--royal); color: var(--text-inverse); }
   
   .worldhub-sr-filter-count {
     font-size: .68rem;
     color: var(--text-4);
     margin-top: -.1rem;
   }
   
   .worldhub-sr-filter-section { display: flex; flex-direction: column; gap: .4rem; }
   
   .worldhub-sr-filter-label {
     font-size: .7rem;
     font-weight: 700;
     letter-spacing: .04em;
     color: var(--navy);
     text-transform: uppercase;
   }
   
   /* Stops */
   .worldhub-stop-filter-row {
     display: flex;
     justify-content: space-between;
     align-items: center;
     padding: 4px 0;
   }
   
   .worldhub-stop-filter-row label {
     font-size: .82rem;
     color: var(--text-2);
     cursor: pointer;
     margin: 0;
     font-weight: 400;
   }
   
   .worldhub-stop-filter-row .worldhub-stop-price {
     font-size: .71rem;
     color: var(--text-3);
     font-family: var(--font-body);
     font-weight: 600;
   }
   
   .worldhub-stop-price sup { font-size: .6em; vertical-align: super; }
   
   input[type=radio].worldhub-filter-stop:checked { accent-color: var(--royal); }
   
   /* Time slots */
   .worldhub-sr-time-slots { display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; }
   
   .worldhub-time-slot-btn {
     border: 1.5px solid var(--border);
     border-radius: var(--r-sm);
     padding: 8px 2px 7px;
     background: var(--surface-sunken);
     font-size: 9px;
     font-weight: 700;
     text-align: center;
     cursor: pointer;
     color: var(--text-3);
     transition: all var(--t-fast) var(--ease);
     line-height: 1.3;
     font-family: var(--font-body);
     text-transform: uppercase;
     letter-spacing: .03em;
   }
   
   .worldhub-time-slot-btn i { font-size: 14px; display: block; margin-bottom: 4px; color: var(--text-4); }
   
   .worldhub-time-slot-btn.active {
     border-color: var(--royal);
     background: var(--royal-light);
     color: var(--royal-hover);
   }
   
   .worldhub-time-slot-btn.active i { color: var(--royal); }
   
   /* Airlines in sidebar */
   .worldhub-sr-sidebar .worldhub-sr-airline-row {
     display: flex;
     align-items: center;
     gap: 9px;
     min-width: 0;
     padding: 5px 0;
   }
   
   .worldhub-sr-sidebar .worldhub-sr-airline-row label {
     display: flex;
     align-items: center;
     gap: 9px;
     min-width: 0;
     flex: 1;
     font-size: .79rem;
     color: var(--text-2);
     cursor: pointer;
     margin: 0;
     font-weight: 400;
   }

   .worldhub-sr-sidebar .worldhub-sr-airline-logo {
     flex: 0 0 24px;
     width: 24px;
     height: 24px;
     object-fit: contain;
   }

   .worldhub-sr-sidebar .worldhub-sr-airline-copy {
     display: flex;
     flex: 1;
     min-width: 0;
     flex-direction: column;
     gap: 2px;
   }

   .worldhub-sr-sidebar .worldhub-sr-airline-name {
     display: block;
     overflow: hidden;
     color: var(--text-2);
     line-height: 1.25;
     text-overflow: ellipsis;
     white-space: nowrap;
   }
   
   .worldhub-sr-sidebar .worldhub-sr-airline-row .worldhub-sr-price-hint {
     display: block;
     font-size: .7rem;
     color: var(--text-3);
     font-family: var(--font-body);
     font-weight: 600;
     line-height: 1.25;
   }
   
   input[type=checkbox].worldhub-filter-airline:checked,
   input[type=checkbox].worldhub-filter-dep-airport:checked,
   input[type=checkbox].worldhub-filter-ret-airport:checked {
     accent-color: var(--royal);
   }
   
   /* Price slider */
   .worldhub-sr-sidebar .worldhub-sr-price-range-labels {
     display: flex;
     justify-content: space-between;
     gap: 10px;
   }
   
   .worldhub-sr-sidebar .worldhub-sr-price-endpoint {
     display: flex;
     flex: 1;
     min-width: 0;
     flex-direction: column;
     gap: 2px;
     padding: 8px 10px;
     border: 1px solid var(--border);
     border-radius: var(--r-sm);
     background: var(--surface-sunken);
   }

   .worldhub-sr-sidebar .worldhub-sr-price-endpoint-max { align-items: flex-end; text-align: right; }

   .worldhub-sr-sidebar .worldhub-sr-price-endpoint small {
     font-size: .62rem;
     color: var(--text-3);
     font-family: var(--font-body);
     font-weight: 600;
     letter-spacing: .04em;
     line-height: 1.2;
     text-transform: uppercase;
   }

   .worldhub-sr-sidebar .worldhub-sr-price-endpoint strong {
     color: var(--navy);
     font-size: .84rem;
     font-weight: 700;
     line-height: 1.2;
   }
   
   .worldhub-sr-sidebar #priceSliderWrap {
     position: relative;
     height: 28px;
     margin: 6px 2px 0;
   }

   .worldhub-sr-sidebar .worldhub-sr-price-track {
     position: absolute;
     z-index: 1;
     top: 50%;
     right: 0;
     left: 0;
     height: 6px;
     overflow: hidden;
     border-radius: var(--r-pill);
     background: var(--border);
     transform: translateY(-50%);
   }

   .worldhub-sr-sidebar .worldhub-sr-price-track-fill {
     position: absolute;
     top: 0;
     right: 0;
     bottom: 0;
     left: 0;
     border-radius: inherit;
     background: linear-gradient(90deg, var(--royal), var(--sky-deep));
   }
   
   .worldhub-sr-sidebar #priceSliderWrap input[type=range] {
     position: absolute;
     z-index: 2;
     top: 50%;
     left: 0;
     width: 100%;
     height: 28px;
     margin: 0;
     pointer-events: none;
     -webkit-appearance: none;
     appearance: none;
     background: transparent;
     transform: translateY(-50%);
   }
   
   .worldhub-sr-sidebar #priceSliderWrap input[type=range]::-webkit-slider-thumb {
     -webkit-appearance: none;
     width: 18px;
     height: 18px;
     border-radius: 50%;
     background: var(--surface);
     cursor: pointer;
     pointer-events: all;
     border: 2px solid var(--royal);
     box-shadow: 0 2px 7px rgba(15,23,42,.18);
   }
   
   .worldhub-sr-sidebar #priceSliderWrap input[type=range]::-webkit-slider-runnable-track {
     height: 6px;
     background: transparent;
   }

   .worldhub-sr-sidebar #priceSliderWrap input[type=range]::-moz-range-track {
     height: 6px;
     background: transparent;
   }

   .worldhub-sr-sidebar #priceSliderWrap input[type=range]::-moz-range-thumb {
     width: 14px;
     height: 14px;
     border: 2px solid var(--royal);
     border-radius: 50%;
     background: var(--surface);
     box-shadow: 0 2px 7px rgba(15,23,42,.18);
     cursor: pointer;
     pointer-events: all;
   }

   .worldhub-sr-sidebar #priceSliderWrap input[type=range]:focus-visible::-webkit-slider-thumb {
     box-shadow: var(--shadow-focus);
   }
   
   .worldhub-sr-sidebar #priceValue {
     padding: 6px 8px;
     border-radius: var(--r-xs);
     background: var(--royal-light);
     font-size: .71rem;
     color: var(--text-3);
     text-align: center;
     font-family: var(--font-body);
     margin-top: 0;
     font-weight: 600;
   }
   
   .worldhub-sr-divider {
     border: none;
     border-top: 1px solid var(--border-soft);
     margin: .15rem 0;
   }
   
   /* sidebar skeleton */
   #sidebarSkeleton {
     position: absolute;
     inset: 0;
     background: var(--surface);
     padding: 16px;
     z-index: var(--z-raised);
     border-radius: var(--r-lg);
   }
   /* ─────────────────────────────────────────────────────────────────────
      RESULTS COLUMN
   ───────────────────────────────────────────────────────────────────── */
   .worldhub-sr-results-col {
     flex: 1;
     overflow: visible;
     padding: 0;
     display: flex;
     flex-direction: column;
     background: transparent;
     min-width: 0;
   }
   
   .worldhub-sr-results-col::-webkit-scrollbar { width: 4px; }
   .worldhub-sr-results-col::-webkit-scrollbar-track { background: transparent; }
   .worldhub-sr-results-col::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 4px; }
   
   #resultCount {
     font-size: .84rem;
     font-weight: 700;
     color: var(--navy);
   }
   
   #filterCount {
     font-size: .76rem;
     color: var(--text-3);
     margin-top: 1px;
   }
   
   /* Sort tabs (Earliest / Cheapest / Fastest) */
   .worldhub-flight-sort-tabs {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
     gap: 0;
     margin-bottom: 14px;
     flex-shrink: 0;
     background: var(--surface);
     border: 1px solid var(--border-soft);
     border-radius: var(--r-lg);
     overflow: hidden;
     box-shadow: var(--shadow-xs);
   }
   
   .worldhub-flight-sort-tab {
     position: relative;
     border: none;
     border-right: 1px solid var(--border-soft);
     border-radius: 0;
     background: var(--surface);
     padding: 11px 16px 13px;
     text-align: center;
     cursor: pointer;
     transition: background var(--t-fast) var(--ease);
     font-family: var(--font-body);
   }
   
   .worldhub-flight-sort-tab:last-child { border-right: none; }
   
   .worldhub-flight-sort-tab:hover { background: var(--surface-sunken); }
   
   .worldhub-flight-sort-tab.active {
     background: var(--royal-light);
     border-bottom: 3px solid var(--royal);
     box-shadow: none;
   }
   
   .worldhub-flight-sort-tab.active::after { display: none; }
   
   .worldhub-flight-sort-label {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 5px;
     font-size: .76rem;
     font-weight: 600;
     color: var(--text-3);
     text-transform: none;
     letter-spacing: 0;
   }
   
   .worldhub-flight-sort-tab.active .worldhub-flight-sort-label { color: var(--royal-hover); }
   
   .worldhub-flight-sort-price {
     font-size: 1.12rem;
     font-weight: 800;
     color: var(--navy);
     margin-top: 4px;
     font-family: var(--font-display);
     letter-spacing: -.02em;
     text-align: center;
   }
   
   .worldhub-flight-sort-tab.active .worldhub-flight-sort-price { color: var(--navy); }
   
   /* Alert box */
   #alertBox { margin-bottom: 10px; }
   .alert { border-radius: var(--r-md); font-size: .875rem; border: none; }
   .alert-warning { background: var(--warning-light); color: #92400E; border-left: 3px solid var(--warning); }
   .alert-danger  { background: var(--danger-light); color: #991B1B; border-left: 3px solid var(--danger); }
   
   /* ─────────────────────────────────────────────────────────────────────
      FLIGHT CARDS
   ───────────────────────────────────────────────────────────────────── */
   .worldhub-fc-card {
     background: var(--surface);
     border: 1px solid var(--border-soft);
     border-radius: var(--r-lg);
     padding: 0;
     margin-bottom: 12px;
     overflow: hidden;
     transition: box-shadow var(--t-base) var(--ease), border-color var(--t-base) var(--ease), transform var(--t-base) var(--ease);
   }
   
   .worldhub-fc-card:hover {
     box-shadow: var(--shadow-lg);
     border-color: var(--royal-border);
     transform: translateY(-2px);
   }
   
   /* legacy top row — superseded by .worldhub-fc-card-inner, kept hidden so older
      markup variants never double-render airline/route info */
   .worldhub-fc-top { display: none; }
   
   /* ── Card inner: airline | route | price, three-column row ── */
   .worldhub-fc-card-inner {
     display: flex;
     align-items: stretch;
     min-height: 96px;
   }
   
   /* Airline column */
   .worldhub-fc-col-airline {
     width: 148px;
     min-width: 148px;
     padding: 16px 12px;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     border-right: 1px solid var(--border-soft);
     text-align: center;
     background: var(--surface-sunken);
   }
   
   .worldhub-fc-airline-logo {
     width: 40px;
     height: 40px;
     object-fit: contain;
     border-radius: 50%;
     border: 1px solid var(--border-soft);
     padding: 3px;
     background: var(--surface);
     margin-bottom: 6px;
     box-shadow: var(--shadow-xs);
   }
   
   .worldhub-fc-airline-name {
     font-size: .76rem;
     font-weight: 700;
     color: var(--navy);
     letter-spacing: -.01em;
     line-height: 1.3;
   }
   
   .worldhub-fc-airline-code {
     font-size: .66rem;
     color: var(--text-3);
     margin-top: 1px;
   }
   
   .worldhub-fc-dep-date-label {
     font-size: .63rem;
     color: var(--royal-hover);
     margin-top: 5px;
     font-weight: 600;
     background: var(--royal-light);
     border: 1px solid var(--royal-border);
     border-radius: var(--r-xs);
     padding: 2px 7px;
     white-space: nowrap;
   }
   
   /* Route column */
   .worldhub-fc-col-route {
     flex: 1;
     padding: 14px 18px;
     display: flex;
     flex-direction: column;
     justify-content: center;
     gap: 4px;
   }
   
   .worldhub-fc-route {
     display: grid;
     grid-template-columns: minmax(0,1fr) minmax(0,150px) minmax(0,1fr);
     align-items: center;
     gap: 8px;
   }
   
   .worldhub-fc-route-row {
     display: flex;
     align-items: center;
     gap: 14px;
   }
   
   .worldhub-fc-endpoint { display: flex; flex-direction: column; }
   .worldhub-fc-endpoint--right { align-items: flex-start; text-align: left; }
   
   .worldhub-fc-time {
     font-size: 1.45rem;
     font-weight: 800;
     color: var(--navy);
     line-height: 1;
     font-family: var(--font-display);
     letter-spacing: -.03em;
     min-width: 82px;
   }
   
   .worldhub-fc-date {
     font-size: .67rem;
     color: var(--text-3);
     margin-top: 3px;
   }
   
   .worldhub-fc-airport { display: flex; align-items: flex-start; gap: 4px; margin-top: 4px; }
   .worldhub-fc-airport-code-row { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
   
   .worldhub-fc-iata {
     font-size: .76rem;
     font-weight: 700;
     color: var(--text-2);
     letter-spacing: .03em;
   }
   
   .worldhub-fc-city-name { font-size: .66rem; color: var(--text-3); }
   .worldhub-fc-airport-name { font-size: .61rem; color: var(--text-4); margin-top: 1px; line-height: 1.3; }
   
   .worldhub-fc-terminal {
     font-size: .59rem;
     color: var(--text-3);
     background: var(--surface-sunken);
     border: 1px solid var(--border);
     border-radius: var(--r-xs);
     padding: 1px 5px;
   }
   
   /* middle — flight path */
   .worldhub-fc-middle {
     flex: 1;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     gap: 4px;
     padding: 0 10px;
   }
   
   .worldhub-fc-duration {
     font-size: .71rem;
     color: var(--text-3);
     font-weight: 600;
     font-family: var(--font-body);
   }
   
   .worldhub-fc-path-line { display: flex; align-items: center; width: 100%; gap: 4px; }
   .worldhub-fc-path-line-bar { flex: 1; height: 1.5px; background: var(--border-strong); }
   .worldhub-fc-plane-icon { width: 14px; height: 14px; color: var(--sky-deep); flex-shrink: 0; }
   .worldhub-fc-via { font-size: .64rem; color: var(--royal); text-align: center; min-height: 13px; font-weight: 600; }
   .worldhub-fc-stop-count { font-size: .68rem; color: var(--text-2); text-align: center; font-weight: 600; margin-top: 1px; }
   
   .worldhub-fc-cabin-info {
     font-size: .63rem;
     color: var(--text-4);
     display: flex;
     align-items: center;
     gap: 4px;
   }
   
   .worldhub-fc-dot { color: var(--border-strong); }
   
   /* card divider between legs (round-trip) */
   .worldhub-fc-divider { border: none; border-top: 1px dashed var(--border); margin: 0; }
   .worldhub-fc-leg { margin-bottom: 0; }
   .worldhub-fc-leg-label {
     font-size: .6rem;
     font-weight: 800;
     letter-spacing: .09em;
     text-transform: uppercase;
     color: var(--text-4);
     margin-bottom: 7px;
   }
   
   /* stop popup */
   .worldhub-fc-stop-wrapper { position: relative; }
   .worldhub-fc-stop-toggle { border: none; cursor: pointer; transition: all var(--t-fast) var(--ease); background: transparent; }
   .worldhub-fc-stop-toggle:hover { background: var(--royal-light) !important; }
   
   .worldhub-fc-stop-collapse {
     position: absolute;
     top: 30px; left: 50%;
     transform: translateX(-50%);
     z-index: 30;
     width: 210px;
     background: var(--surface);
     border: 1px solid var(--border);
     border-radius: var(--r-lg);
     box-shadow: var(--shadow-lg);
     padding: 12px;
   }
   
   .worldhub-fc-stop-item:not(:last-child) {
     border-bottom: 1px solid var(--border-soft);
     padding-bottom: 8px; margin-bottom: 8px;
   }
   
   .worldhub-fc-stop-city    { font-size: .82rem; font-weight: 700; color: var(--navy); }
   .worldhub-fc-stop-airport { font-size: .7rem; color: var(--text-3); margin-top: 2px; }
   .worldhub-fc-stop-layover { font-size: .7rem; color: var(--royal); margin-top: 4px; font-weight: 700; }
   
   /* Price column */
   .worldhub-fc-col-price {
     width: 168px;
     min-width: 168px;
     padding: 16px 16px;
     display: flex;
     flex-direction: column;
     align-items: flex-end;
     justify-content: center;
     border-left: 1px solid var(--border-soft);
     gap: 8px;
     background: var(--surface-sunken);
   }
   
   .worldhub-fc-price { display: flex; align-items: baseline; gap: 2px; flex-direction: row; }
   
   .worldhub-fc-currency { font-size: .76rem; color: var(--text-2); font-weight: 700; }
   
   .worldhub-fc-amount {
     font-size: 1.6rem;
     font-weight: 800;
     color: var(--navy);
     line-height: 1;
     font-family: var(--font-display);
     letter-spacing: -.03em;
   }
   
   .worldhub-fc-price-sub { font-size: .61rem; color: var(--text-4); text-align: right; line-height: 1.3; }
   
   .worldhub-fc-seats-label {
     font-size: .62rem;
     color: var(--warning);
     display: flex;
     align-items: center;
     gap: 3px;
     white-space: nowrap;
     font-weight: 600;
   }
   
   /* Buttons */
   .worldhub-fc-btn {
     display: inline-flex;
     align-items: center;
     gap: 5px;
     font-size: .8rem;
     font-weight: 600;
     padding: 8px 16px;
     border-radius: var(--r-sm);
     cursor: pointer;
     border: none;
     font-family: var(--font-body);
     transition: all var(--t-fast) var(--ease);
     letter-spacing: -.01em;
   }
   
   .worldhub-fc-btn--primary {
     background: var(--royal);
     color: var(--text-inverse);
     border: none;
     border-radius: var(--r-sm);
     font-size: .82rem;
     font-weight: 700;
     padding: 9px 0;
     width: 100%;
     text-align: center;
     cursor: pointer;
     font-family: var(--font-body);
     letter-spacing: .02em;
     box-shadow: var(--shadow-royal);
     transition: background var(--t-fast) var(--ease), transform var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 5px;
   }
   .worldhub-fc-btn--primary:hover {
     background: var(--royal-hover);
     transform: translateY(-1px);
     box-shadow: 0 12px 26px rgba(37,99,235,.34);
   }
   
   .worldhub-fc-btn--secondary {
     background: transparent;
     color: var(--royal);
     border: none;
     font-size: .76rem;
     font-weight: 700;
     padding: 0;
     cursor: pointer;
     font-family: var(--font-body);
     display: flex;
     align-items: center;
     gap: 4px;
     letter-spacing: .01em;
     transition: color var(--t-fast) var(--ease);
   }
   .worldhub-fc-btn--secondary:hover {
     background: transparent;
     color: var(--sky-deep);
     border-color: transparent;
   }
   
   .worldhub-fc-actions { display: flex; align-items: center; gap: 10px; }
   
   /* ── Bottom strip: flight details toggle + badges ── */
   .worldhub-fc-bottom {
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding: 9px 16px 10px 164px;
     border-top: 1px solid var(--border-soft);
     background: var(--surface-sunken);
     flex-wrap: nowrap;
     gap: 0;
     margin-top: 0;
   }
   
   /* Badges */
   .worldhub-fc-badges { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
   
   .worldhub-fc-badge-group {
     display: flex;
     align-items: center;
     gap: 5px;
     padding: 2px 7px;
     border-radius: var(--r-sm);
     background: var(--surface);
     border: 1px solid var(--border-soft);
   }
   
   .worldhub-fc-via-click { cursor: pointer; color: var(--royal); transition: color var(--t-fast) var(--ease); }
   .worldhub-fc-via-click:hover { color: var(--sky-deep); text-decoration: underline; }
   
   .worldhub-fc-badge {
     display: inline-flex;
     align-items: center;
     gap: 4px;
     font-size: .68rem;
     font-weight: 700;
     padding: 3px 9px;
     border-radius: var(--r-pill);
     white-space: nowrap;
     font-family: var(--font-body);
     letter-spacing: .01em;
   }
   
   .worldhub-fc-badge--success { background: var(--success-light); color: #047857; }
   .worldhub-fc-badge--danger  { background: var(--danger-light); color: #B91C1C; }
   .worldhub-fc-badge--warning { background: var(--warning-light); color: #B45309; }
   .worldhub-fc-badge--neutral { background: var(--surface-sunken); color: var(--text-2); border: 1px solid var(--border); }
   
   /* Details panel */
   .worldhub-fc-details-panel { margin-top: 0; }
   
   .worldhub-fc-details-section {
     background: var(--surface-sunken);
     border-top: 1px solid var(--border-soft);
     border-radius: 0;
     padding: 14px 18px;
     margin-bottom: 0;
   }
   
   .worldhub-fc-details-title {
     font-size: .67rem;
     font-weight: 800;
     color: var(--text-3);
     letter-spacing: .08em;
     text-transform: uppercase;
     margin-bottom: 9px;
   }
   
   .worldhub-fc-details-leg-label {
     font-size: .63rem;
     font-weight: 800;
     color: var(--text-4);
     text-transform: uppercase;
     letter-spacing: .07em;
     margin: 7px 0 5px;
   }
   
   .worldhub-fc-segment-row {
     background: var(--surface);
     border: 1px solid var(--border-soft);
     border-radius: var(--r-sm);
     padding: 9px 13px;
     margin-bottom: 6px;
   }
   
   .worldhub-fc-segment-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 3px; }
   .worldhub-fc-segment-flight { font-size: .8rem; font-weight: 700; color: var(--navy); font-family: var(--font-mono); }
   .worldhub-fc-segment-aircraft { font-size: .68rem; color: var(--text-4); display: flex; align-items: center; gap: 4px; }
   .worldhub-fc-segment-route {
     display: flex; align-items: center; gap: 5px;
     font-size: .77rem; font-weight: 700; color: var(--navy);
     margin-bottom: 3px; font-family: var(--font-mono);
   }
   .worldhub-fc-segment-time { color: var(--text-3); font-weight: 400; }
   .worldhub-fc-segment-arrow { color: var(--border-strong); }
   .worldhub-fc-segment-meta { display: flex; align-items: center; gap: 5px; font-size: .68rem; color: var(--text-3); flex-wrap: wrap; }
   
   /* Fare table */
   .worldhub-fc-fare-table { width: 100%; border-collapse: collapse; font-size: .79rem; }
   .worldhub-fc-fare-table th {
     text-align: left; font-weight: 700; color: var(--text-3);
     font-size: .64rem; text-transform: uppercase; letter-spacing: .06em;
     padding: 0 0 7px; border-bottom: 1px solid var(--border);
   }
   .worldhub-fc-fare-table td { padding: 7px 0; color: var(--text-1); border-bottom: 1px solid var(--border-soft); }
   .worldhub-fc-fare-table tfoot td {
     font-weight: 800; color: var(--navy);
     border-bottom: none; padding-top: 9px;
     font-size: .9rem; font-family: var(--font-display);
   }
   
   /* Load more */
   #loadMoreBtn {
     background: var(--surface);
     color: var(--royal);
     border: 1.5px solid var(--royal-border);
     border-radius: var(--r-pill);
     padding: 11px 34px;
     font-size: .85rem;
     font-weight: 700;
     cursor: pointer;
     font-family: var(--font-body);
     transition: all var(--t-fast) var(--ease);
     letter-spacing: -.01em;
     margin: 10px auto;
     display: block;
   }
   
   #loadMoreBtn:hover {
     background: var(--royal);
     color: var(--text-inverse);
     border-color: var(--royal);
     transform: translateY(-1px);
     box-shadow: var(--shadow-royal);
   }
   /* ─────────────────────────────────────────────────────────────────────
      SKELETON LOADERS
   ───────────────────────────────────────────────────────────────────── */
   .worldhub-skeleton {
     position: relative;
     overflow: hidden;
     background: var(--bg-raised);
     border-radius: var(--r-sm);
     display: block;
   }
   
   .worldhub-skeleton::after {
     content: '';
     position: absolute;
     inset: 0;
     transform: translateX(-100%);
     background: linear-gradient(90deg, transparent, rgba(255,255,255,.8), transparent);
     animation: shimmer 1.5s infinite;
   }
   
   @keyframes shimmer { 100% { transform: translateX(100%); } }
   
   .worldhub-skeleton-circle    { width: 32px; height: 32px; border-radius: 50%; }
   .worldhub-skeleton-circle-lg { width: 44px; height: 44px; border-radius: 50%; }
   .worldhub-skeleton-text-lg   { height: 14px; border-radius: 4px; }
   .worldhub-skeleton-text-sm   { height: 10px; border-radius: 4px; }
   .worldhub-skeleton-text-xs   { height: 8px;  border-radius: 4px; }
   .worldhub-skeleton-badge     { height: 22px; border-radius: var(--r-pill); }
   .worldhub-skeleton-time      { height: 26px; border-radius: 4px; }
   .worldhub-skeleton-duration  { height: 11px; border-radius: 4px; }
   .worldhub-skeleton-line      { height: 3px;  border-radius: var(--r-pill); }
   .worldhub-skeleton-price     { height: 28px; border-radius: 4px; }
   .worldhub-skeleton-btn       { height: 34px; border-radius: var(--r-sm); }
   
   .worldhub-flight-skeleton-card {
     background: var(--surface);
     border: 1px solid var(--border-soft);
     border-radius: var(--r-lg);
     padding: 14px 16px;
     margin-bottom: 12px;
     display: flex;
     flex-direction: column;
     gap: 16px;
   }
   
   .worldhub-flight-skeleton-top    { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
   .worldhub-flight-skeleton-route  { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
   .worldhub-flight-skeleton-middle { flex: 1; padding: 0 20px; display: flex; flex-direction: column; gap: 6px; align-items: center; }
   .worldhub-flight-skeleton-bottom { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: .85rem; border-top: 1px solid var(--border-soft); }
   
   .worldhub-filter-skeleton-wrap { display: flex; flex-direction: column; gap: 10px; }
   /* ─────────────────────────────────────────────────────────────────────
      BOOKING PAGE
   ───────────────────────────────────────────────────────────────────── */
   .worldhub-booking-header {
     background: linear-gradient(135deg, var(--navy) 0%, var(--navy-600) 100%);
     padding: 3rem 0;
     color: var(--text-inverse);
     margin-bottom: 2.75rem;
     position: relative;
     overflow: hidden;
   }
   
   .worldhub-booking-header::before {
     content: '';
     position: absolute;
     inset: 0;
     background-image: radial-gradient(rgba(255,255,255,.08) 1px, transparent 1px);
     background-size: 22px 22px;
     pointer-events: none;
   }
   
   .worldhub-booking-header h2 {
     font-family: var(--font-display);
     font-size: clamp(1.6rem, 3vw, 2.1rem);
     font-weight: 800;
     margin-bottom: .55rem;
     letter-spacing: -.02em;
   }
   
   .worldhub-booking-header p {
     font-size: .9rem;
     color: var(--text-inverse-70);
     margin: 0;
   }
   
   /* Shared cards */
   .worldhub-main-card,
   .worldhub-passenger-card,
   .worldhub-sidebar-card,
   .worldhub-side-card {
     background: var(--surface);
     border-radius: var(--r-xl);
     padding: 1.75rem;
     margin-bottom: 1.3rem;
     border: 1px solid var(--border-soft);
     box-shadow: var(--shadow-sm);
   }
   
   .worldhub-card-title {
     font-family: var(--font-display);
     font-size: 1.05rem;
     font-weight: 800;
     color: var(--navy);
     margin-bottom: 1.3rem;
     display: flex;
     align-items: center;
     gap: 9px;
     letter-spacing: -.02em;
   }
   
   .worldhub-card-title i { color: var(--royal); }
   
   /* Flight box in booking page */
   .worldhub-flight-box {
     border: 1px solid var(--border-soft);
     border-radius: var(--r-lg);
     padding: 1.3rem;
     margin-bottom: 1.15rem;
     transition: box-shadow var(--t-base) var(--ease), border-color var(--t-base) var(--ease);
     background: var(--surface);
   }
   
   .worldhub-flight-box:hover {
     box-shadow: var(--shadow-sm);
     border-color: var(--royal-border);
   }
   
   .worldhub-airline-logo {
     width: 50px; height: 50px;
     border-radius: var(--r-lg);
     background: var(--royal-light);
     color: var(--royal);
     display: flex;
     align-items: center;
     justify-content: center;
     margin: auto;
     font-size: 21px;
     border: 1px solid var(--royal-border);
   }
   
   .worldhub-airline-name {
     font-size: .88rem;
     font-weight: 700;
     margin-top: 9px;
     color: var(--text-1);
     letter-spacing: -.01em;
   }
   
   .worldhub-flight-time {
     font-size: 1.65rem;
     font-weight: 800;
     color: var(--navy);
     font-family: var(--font-display);
     letter-spacing: -.03em;
   }
   
   .worldhub-airport-code {
     font-size: 1.02rem;
     font-weight: 700;
     margin-top: 3px;
     color: var(--text-2);
     letter-spacing: -.01em;
   }
   
   .worldhub-flight-date { font-size: .77rem; color: var(--text-3); }
   
   .worldhub-flight-line {
     position: relative;
     text-align: center;
     margin-top: 11px;
   }
   
   .worldhub-flight-line::before {
     content: '';
     position: absolute;
     left: 0; right: 0; top: 10px;
     border-top: 1px dashed var(--border-strong);
   }
   
   .worldhub-flight-duration {
     position: relative;
     z-index: 2;
     background: var(--surface);
     padding: 0 13px;
     font-size: .77rem;
     color: var(--text-3);
     font-family: var(--font-body);
     font-weight: 600;
   }
   
   .worldhub-stops-badge {
     display: inline-block;
     margin-top: 11px;
     background: var(--royal-light);
     color: var(--royal-hover);
     border-radius: var(--r-pill);
     padding: 5px 13px;
     font-size: .7rem;
     font-weight: 700;
     border: 1px solid var(--royal-border);
   }
   
   /* Baggage box */
   .worldhub-baggage-box {
     margin-top: 1.05rem;
     background: var(--surface-sunken);
     border-radius: var(--r-md);
     padding: .9rem;
     border: 1px solid var(--border-soft);
     font-size: .84rem;
     color: var(--text-2);
   }
   
   .worldhub-baggage-box i { color: var(--sky-deep); margin-right: 6px; }
   
   /* Booking sidebar */
   .worldhub-sidebar-card.worldhub-timer-card {
     background: linear-gradient(135deg, var(--navy) 0%, var(--navy-600) 100%);
     color: var(--text-inverse);
     text-align: center;
     position: sticky;
     top: calc(var(--navbar-h) + 16px);
     border-color: var(--navy-500);
     box-shadow: var(--shadow-navy);
   }
   
   .worldhub-timer-card h5 {
     font-size: .7rem;
     font-weight: 700;
     letter-spacing: .1em;
     text-transform: uppercase;
     color: var(--text-inverse-70);
     margin-bottom: .55rem;
   }
   
   .worldhub-timer-card h1 {
     font-family: var(--font-display);
     font-size: 2.9rem;
     font-weight: 800;
     color: var(--sky);
     margin: .25rem 0;
     letter-spacing: -.04em;
   }
   
   .worldhub-timer-card p {
     font-size: .77rem;
     color: var(--text-inverse-70);
     margin: 0;
   }
   
   /* Fare summary */
   .worldhub-fare-row {
     display: flex;
     justify-content: space-between;
     align-items: center;
     margin-bottom: .85rem;
     font-size: .875rem;
     color: var(--text-3);
   }
   
   .worldhub-fare-row strong { color: var(--text-1); font-weight: 600; }
   
   .worldhub-fare-total {
     border-top: 1px solid var(--border);
     padding-top: .95rem;
     margin-top: .95rem;
     font-size: 1.25rem;
     font-weight: 800;
     color: var(--navy);
     font-family: var(--font-display);
     letter-spacing: -.02em;
   }
   
   /* Why book with us */
   .worldhub-side-card { position: sticky; top: calc(var(--navbar-h) + 16px + 300px + 24px); }
   
   .worldhub-heading {
     font-family: var(--font-display);
     font-size: 1.02rem;
     font-weight: 800;
     color: var(--navy);
     letter-spacing: -.02em;
   }
   
   .worldhub-why-list { list-style: none; padding: 0; margin: 0; }
   
   .worldhub-why-list li {
     position: relative;
     padding-left: 22px;
     margin-bottom: 9px;
     font-size: .85rem;
     color: var(--text-2);
     font-weight: 400;
   }
   
   .worldhub-why-list li::before {
     content: "✓";
     position: absolute;
     left: 0; top: 0;
     color: var(--success);
     font-weight: 800;
     font-size: .82rem;
   }
   
   .worldhub-secure-text {
     font-size: .75rem;
     line-height: 1.75;
     color: var(--text-4);
     margin-top: 13px;
   }
   
   /* Passenger form */
   .worldhub-passenger-heading {
     font-size: .96rem;
     font-weight: 700;
     color: var(--navy);
     margin-bottom: 1.15rem;
     display: flex;
     align-items: center;
     gap: 9px;
     letter-spacing: -.02em;
   }
   
   .worldhub-passenger-heading::before {
     content: '';
     display: inline-block;
     width: 3px; height: 17px;
     background: var(--royal);
     border-radius: 2px;
   }
   
   label {
     font-size: .76rem;
     font-weight: 700;
     margin-bottom: 7px;
     color: var(--text-3);
     display: inline-block;
     letter-spacing: .01em;
     text-transform: uppercase;
   }
   
   .form-control,
   .form-select {
     height: 46px;
     border-radius: var(--r-md);
     border: 1.5px solid var(--border);
     padding: .55rem .85rem;
     font-size: .89rem;
     font-family: var(--font-body);
     color: var(--text-1);
     box-shadow: none !important;
     transition: border-color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
     background: var(--surface-sunken);
     letter-spacing: -.01em;
   }
   
   .form-control:focus,
   .form-select:focus {
     border-color: var(--royal);
     box-shadow: var(--shadow-focus) !important;
     background: var(--surface);
     outline: none;
   }
   
   /* Pay button */
   .worldhub-btn-pay {
     height: 52px;
     border: none;
     border-radius: var(--r-md);
     background: linear-gradient(135deg, var(--royal) 0%, var(--royal-hover) 100%);
     color: var(--text-inverse);
     font-size: .96rem;
     font-weight: 700;
     font-family: var(--font-body);
     box-shadow: var(--shadow-royal);
     transition: transform var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease), filter var(--t-fast) var(--ease);
     letter-spacing: -.01em;
   }
   
   .worldhub-btn-pay:hover {
     transform: translateY(-2px);
     filter: brightness(1.05);
     box-shadow: 0 14px 30px rgba(37,99,235,.36);
   }

   /* Compact flight booking experience (booking page only) */
   .worldhub-booking-page > .container { max-width: 1180px; }

   .worldhub-booking-page .worldhub-main-card,
   .worldhub-booking-page .worldhub-passenger-card,
   .worldhub-booking-page .worldhub-sidebar-card,
   .worldhub-booking-page .worldhub-side-card {
     padding: 1.3rem;
     margin-bottom: 1rem;
   }

   .worldhub-booking-page .worldhub-card-title { margin-bottom: 1rem; }

   .worldhub-booking-page .worldhub-itinerary-heading {
     display: inline-flex;
     align-items: center;
     margin: 0 0 .65rem;
     padding: 5px 10px;
     border: 1px solid var(--royal-border);
     border-radius: var(--r-pill);
     background: var(--royal-light);
     color: var(--royal-hover);
     font-size: .72rem;
     font-weight: 800;
     letter-spacing: .04em;
     text-transform: uppercase;
   }

   .worldhub-booking-page .worldhub-booking-segment-card + .worldhub-itinerary-heading {
     margin-top: .45rem;
   }

   .worldhub-booking-page .worldhub-booking-segment-card {
     padding: .9rem 1rem;
     margin-bottom: .7rem;
     border-radius: var(--r-md);
   }

   .worldhub-booking-page .worldhub-booking-segment-card > .row {
     --bs-gutter-x: 1rem;
   }

   .worldhub-booking-page .worldhub-airline-logo {
     width: 38px;
     height: 38px;
     border-radius: var(--r-md);
     font-size: 16px;
   }

   .worldhub-booking-page .worldhub-airline-name {
     margin-top: 5px;
     font-size: .8rem;
   }

   .worldhub-booking-page .worldhub-flight-time { font-size: 1.25rem; }
   .worldhub-booking-page .worldhub-airport-code { font-size: .88rem; }
   .worldhub-booking-page .worldhub-flight-date { font-size: .7rem; }
   .worldhub-booking-page .worldhub-flight-line { margin-top: 7px; }

   .worldhub-booking-page .worldhub-stops-badge {
     margin-top: 8px;
     padding: 3px 9px;
     font-size: .64rem;
   }

   .worldhub-booking-page .worldhub-baggage-box.mt-4 {
     margin-top: .7rem !important;
     padding: .65rem .75rem;
     font-size: .75rem;
   }

   .worldhub-booking-page .worldhub-baggage-box .mb-2 {
     margin-bottom: 0 !important;
   }

   .worldhub-booking-page .worldhub-sidebar-card.worldhub-timer-card {
     padding: 1.15rem 1.25rem;
   }

   .worldhub-booking-page .worldhub-timer-card h1 {
     margin: .1rem 0;
     font-size: 2.35rem;
   }

   .worldhub-booking-page #bookingForm .worldhub-passenger-heading {
     margin-bottom: .85rem;
   }

   .worldhub-booking-page #bookingForm label { margin-bottom: 5px; }

   .worldhub-booking-page #bookingForm .form-control,
   .worldhub-booking-page #bookingForm .form-select {
     height: 42px;
     padding: .45rem .75rem;
   }

   .worldhub-booking-page #bookingForm .mb-3 {
     margin-bottom: .75rem !important;
   }

   .worldhub-booking-page #bookingForm .worldhub-btn-pay {
     display: block;
     width: auto !important;
     min-width: 190px;
     height: 44px;
     margin-left: auto;
     padding: 0 1.4rem;
     font-size: .88rem;
   }
   
   /* Expiry modal */
   .worldhub-expiry-modal {
     position: fixed;
     inset: 0;
     background: rgba(15,23,42,.6);
     display: none;
     align-items: center;
     justify-content: center;
     z-index: var(--z-modal);
     backdrop-filter: blur(5px);
   }
   
   .worldhub-expiry-content {
     width: 410px;
     max-width: 92%;
     background: var(--surface);
     border-radius: var(--r-2xl);
     padding: 2.4rem;
     text-align: center;
     box-shadow: var(--shadow-xl);
     border: 1px solid var(--border-soft);
   }
   
   .worldhub-expiry-content h4 {
     font-family: var(--font-display);
     font-size: 1.4rem;
     font-weight: 800;
     margin: 1.1rem 0 .55rem;
     color: var(--navy);
     letter-spacing: -.02em;
   }
   
   .worldhub-expiry-content p {
     font-size: .88rem;
     color: var(--text-3);
     line-height: 1.75;
     margin-bottom: 1.6rem;
   }
   
   .worldhub-expiry-content button {
     width: 100%;
     height: 48px;
     border: none;
     border-radius: var(--r-md);
     background: var(--royal);
     color: var(--text-inverse);
     font-weight: 700;
     font-size: .92rem;
     cursor: pointer;
     font-family: var(--font-body);
     transition: background var(--t-fast) var(--ease);
     letter-spacing: -.01em;
   }
   
   .worldhub-expiry-content button:hover { background: var(--royal-hover); }
   
   /* Booking form inline errors */
   .is-invalid { border-color: var(--danger) !important; }
   .invalid-feedback {
     font-size: .71rem;
     color: var(--danger);
     font-weight: 600;
     margin-top: 4px;
   }
   /* ─────────────────────────────────────────────────────────────────────
      BOOKING SUCCESS PAGE
   ───────────────────────────────────────────────────────────────────── */
   .worldhub-booking-success-wrapper {
     max-width: 1060px;
     margin: auto;
     padding: 2.75rem 0 4.5rem;
   }
   
   .worldhub-success-hero {
     background: linear-gradient(135deg, var(--navy) 0%, var(--navy-600) 60%, var(--royal) 140%);
     border-radius: var(--r-2xl);
     padding: 3rem 3.25rem;
     color: var(--text-inverse);
     display: flex;
     align-items: center;
     gap: 1.9rem;
     margin-bottom: 1.6rem;
     position: relative;
     overflow: hidden;
     box-shadow: var(--shadow-navy);
   }
   
   .worldhub-success-hero::before {
     content: '';
     position: absolute;
     inset: 0;
     background-image: radial-gradient(rgba(255,255,255,.09) 1px, transparent 1px);
     background-size: 24px 24px;
     pointer-events: none;
   }
   
   .worldhub-success-check {
     width: 84px; height: 84px;
     min-width: 84px;
     border-radius: var(--r-xl);
     background: rgba(255,255,255,.1);
     display: flex;
     align-items: center;
     justify-content: center;
     color: var(--sky);
     flex-shrink: 0;
     border: 1px solid rgba(255,255,255,.16);
     position: relative;
     z-index: 1;
     animation: successPop .5s var(--ease-out);
   }
   
   @keyframes successPop {
     0%   { transform: scale(.6); opacity: 0; }
     60%  { transform: scale(1.08); opacity: 1; }
     100% { transform: scale(1); }
   }
   
   .worldhub-success-badge {
     display: inline-flex;
     align-items: center;
     gap: 6px;
     padding: 5px 13px;
     background: rgba(255,255,255,.1);
     border: 1px solid rgba(255,255,255,.18);
     border-radius: var(--r-pill);
     font-size: .68rem;
     font-weight: 800;
     letter-spacing: .1em;
     text-transform: uppercase;
     margin-bottom: 1rem;
     color: var(--text-inverse-70);
   }
   
   .worldhub-success-content h1 {
     font-family: var(--font-display);
     font-size: clamp(1.6rem, 3vw, 2.15rem);
     font-weight: 800;
     margin-bottom: .7rem;
     line-height: 1.2;
     letter-spacing: -.02em;
   }
   
   .worldhub-success-content p {
     font-size: .9rem;
     line-height: 1.8;
     color: var(--text-inverse-70);
     margin: 0;
     max-width: 600px;
   }
   
   /* Success summary card */
   .worldhub-booking-summary-card,
   .worldhub-passenger-section {
     background: var(--surface);
     border-radius: var(--r-xl);
     padding: 1.85rem;
     margin-bottom: 1.3rem;
     border: 1px solid var(--border-soft);
     box-shadow: var(--shadow-sm);
   }
   
   .worldhub-summary-header,
   .worldhub-section-header {
     display: flex;
     align-items: center;
     justify-content: space-between;
     margin-bottom: 1.4rem;
   }
   
   .worldhub-summary-header h4,
   .worldhub-section-header h4 {
     font-family: var(--font-display);
     font-size: 1.05rem;
     font-weight: 800;
     margin: 0;
     color: var(--navy);
     letter-spacing: -.02em;
   }
   
   .worldhub-booking-id {
     background: var(--royal-light);
     padding: 8px 13px;
     border-radius: var(--r-md);
     font-size: .79rem;
     font-weight: 600;
     color: var(--text-3);
     border: 1px solid var(--royal-border);
   }
   
   .worldhub-booking-id span { color: var(--royal-hover); font-weight: 800; }
   
   .worldhub-summary-grid {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
     gap: 13px;
   }
   
   .worldhub-summary-item {
     background: var(--surface-sunken);
     border-radius: var(--r-lg);
     padding: 1.15rem 1.25rem;
     border: 1px solid var(--border-soft);
   }
   
   .worldhub-summary-item label {
     display: block;
     font-size: .68rem;
     font-weight: 800;
     letter-spacing: .05em;
     text-transform: uppercase;
     color: var(--text-4);
     margin-bottom: 8px;
   }
   
   .worldhub-summary-item div {
     font-size: .96rem;
     font-weight: 700;
     color: var(--navy);
     word-break: break-word;
     letter-spacing: -.01em;
   }
   
   /* Passenger table */
   .worldhub-passenger-table { margin: 0; vertical-align: middle; }
   
   .worldhub-passenger-table thead th {
     background: var(--surface-sunken);
     border: none;
     padding: 13px 15px;
     font-size: .66rem;
     text-transform: uppercase;
     letter-spacing: .07em;
     color: var(--text-3);
     font-weight: 800;
   }
   
   .worldhub-passenger-table tbody td {
     padding: 15px;
     border-color: var(--border-soft);
     font-size: .875rem;
     color: var(--text-1);
   }
   
   .worldhub-passenger-count {
     width: 32px; height: 32px;
     border-radius: 50%;
     background: var(--royal-light);
     color: var(--royal-hover);
     display: flex;
     align-items: center;
     justify-content: center;
     font-weight: 800;
     font-size: .8rem;
     border: 1px solid var(--royal-border);
   }
   
   .worldhub-passenger-name { font-weight: 700; letter-spacing: -.01em; color: var(--navy); }
   
   .worldhub-gender-badge {
     display: inline-flex;
     align-items: center;
     padding: 5px 11px;
     border-radius: var(--r-pill);
     background: var(--surface-sunken);
     color: var(--text-2);
     font-size: .76rem;
     font-weight: 700;
     border: 1px solid var(--border);
   }
   
   /* Success actions */
   .worldhub-success-actions {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 13px;
     margin-top: .6rem;
   }
   
   .worldhub-btn-home,
   .worldhub-btn-print {
     height: 48px;
     padding: 0 26px;
     border-radius: var(--r-pill);
     font-weight: 700;
     font-size: .88rem;
     border: none;
     text-decoration: none;
     display: inline-flex;
     align-items: center;
     justify-content: center;
     transition: transform var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease), background var(--t-fast) var(--ease);
     cursor: pointer;
     font-family: var(--font-body);
     letter-spacing: -.01em;
   }
   
   .worldhub-btn-home {
     background: var(--royal);
     color: var(--text-inverse);
     box-shadow: var(--shadow-royal);
   }
   
   .worldhub-btn-home:hover { background: var(--royal-hover); transform: translateY(-2px); color: var(--text-inverse); box-shadow: 0 12px 26px rgba(37,99,235,.34); }
   
   .worldhub-btn-print {
     background: var(--surface);
     color: var(--text-2);
     border: 1.5px solid var(--border);
   }
   
   .worldhub-btn-print:hover { background: var(--surface-sunken); border-color: var(--border-strong); }
   /* ─────────────────────────────────────────────────────────────────────
      INLINE SEARCH BAR
   ───────────────────────────────────────────────────────────────────── */
   .worldhub-search-card-inline {
     background: var(--surface);
     border-radius: var(--r-xl);
     padding: 18px;
     border: 1px solid var(--border-soft);
     box-shadow: var(--shadow-sm);
   }
   
   .worldhub-search-form-inline { width: 100%; }
   .worldhub-search-inline-top { margin-bottom: 15px; }
   .worldhub-inline-trip-tabs { display: inline-flex; gap: 4px; }
   
   .worldhub-search-inline-wrap {
     display: flex;
     align-items: flex-end;
     gap: 13px;
     flex-wrap: nowrap;
   }
   
   .worldhub-inline-field { flex: 1; min-width: 150px; }
   
   .worldhub-inline-field label {
     display: block;
     margin-bottom: 6px;
     font-size: 10px;
     font-weight: 700;
     color: var(--text-3);
     text-transform: uppercase;
     letter-spacing: .05em;
   }
   
   .worldhub-search-card-inline .worldhub-field-input { height: 50px; border-radius: var(--r-lg); }
   .worldhub-search-card-inline .worldhub-field-input input { height: 50px; font-size: .9rem; font-weight: 500; }
   
   .worldhub-inline-swap { flex: 0 0 auto; padding-bottom: 2px; }
   .worldhub-search-card-inline .worldhub-swap-btn { width: 44px; height: 44px; }
   
   .worldhub-inline-search-btn { flex: 0 0 165px; }
   /* .worldhub-inline-search-btn { flex: 1; } */
   .worldhub-inline-search-btn .worldhub-btn-search { width: 100%; height: 50px; border-radius: var(--r-lg); }
   .worldhub-search-card-inline .worldhub-trav-dropdown { top: calc(100% + 10px); right: 0; }
   
   @media (max-width: 1400px) {
     .worldhub-search-inline-wrap { flex-wrap: wrap; }
     .worldhub-inline-field { min-width: calc(33.33% - 10px); }
   }
   
   @media (max-width: 992px) {
     .worldhub-inline-field { min-width: calc(50% - 10px); }
     .worldhub-inline-search-btn { flex: 1 1 100%; }
   }
   
   @media (max-width: 768px) {
     .worldhub-search-card-inline { padding: 14px; }
     .worldhub-search-inline-wrap { flex-direction: column; gap: 10px; }
     .worldhub-inline-field, .worldhub-inline-search-btn { width: 100%; min-width: 100%; }
     .worldhub-inline-swap { width: 100%; display: flex; justify-content: center; padding-bottom: 0; }
   }
   
   /* ─────────────────────────────────────────────────────────────────────
      MOBILE — Traveller dropdown
   ───────────────────────────────────────────────────────────────────── */
   @media (max-width: 767px) {
     .worldhub-trav-dropdown {
       position: absolute;
       top: auto;
       bottom: 20px;
       left: 50%;
       transform: translateX(-50%);
       width: 92%;
       max-width: 340px;
       z-index: var(--z-overlay);
       border-radius: var(--r-xl);
     }
   }
   /* ─────────────────────────────────────────────────────────────────────
      RESPONSIVE — Search Results
   ───────────────────────────────────────────────────────────────────── */
   @media (max-width: 991px) {
     .worldhub-sr-page { height: auto; overflow: visible; }
     .worldhub-sr-body { flex-direction: column; overflow: visible; padding: 10px; }
     .worldhub-sr-sidebar {
       width: 100%; min-width: 0;
       border-right: none;
       position: static;
       max-height: none;
     }
     .worldhub-sr-results-col { overflow: visible; padding: 0; }
     .worldhub-flight-sort-price { font-size: 1rem; }
     .worldhub-fc-col-price { width: 130px; min-width: 130px; }
     .worldhub-fc-col-airline { width: 112px; min-width: 112px; }
     .worldhub-fc-bottom { padding-left: 124px; }
   }
   
   @media (max-width: 640px) {
     .worldhub-sr-search-bar { padding: 10px .75rem; }
     .worldhub-sr-search-summary { height: auto; padding: .65rem 0; }
     .worldhub-sr-route-iata { font-size: 14px; }
     .worldhub-flight-sort-tabs { gap: 0; }
     .worldhub-flight-sort-tab  { padding: 9px 7px; }
     .worldhub-flight-sort-label { font-size: .7rem; }
     .worldhub-flight-sort-price { font-size: .9rem; margin-top: 3px; }
     .worldhub-flight-sort-tab.active::after { display: none; }
   
     .worldhub-fc-card-inner { flex-direction: column; }
     .worldhub-fc-col-airline {
       width: 100%;
       border-right: none;
       border-bottom: 1px solid var(--border-soft);
       flex-direction: row;
       justify-content: flex-start;
       gap: 11px;
       padding: 11px 13px;
       background: var(--surface-sunken);
     }
     .worldhub-fc-col-airline .worldhub-fc-airline-logo { margin-bottom: 0; }
     .worldhub-fc-col-price {
       width: 100%;
       border-left: none;
       border-top: 1px solid var(--border-soft);
       flex-direction: row;
       align-items: center;
       justify-content: space-between;
       padding: 11px 15px;
     }
     .worldhub-fc-btn--primary { width: auto; padding: 9px 22px; }
     .worldhub-fc-bottom { padding-left: 15px; }
     .worldhub-fc-amount { font-size: 1.32rem; }
     .worldhub-fc-time { font-size: 1.05rem; min-width: 0; }
   }
   
   /* ─────────────────────────────────────────────────────────────────────
      RESPONSIVE — Booking & Success
   ───────────────────────────────────────────────────────────────────── */
   @media (max-width: 991px) {
     .worldhub-sidebar-card,
     .worldhub-side-card { position: relative; top: 0; }

     .worldhub-booking-page .col-lg-4 { margin-top: .25rem; }
   }
   
   @media (max-width: 768px) {
     .worldhub-booking-header { padding: 1.9rem 1rem; }
     .worldhub-success-hero { padding: 1.9rem; flex-direction: column; text-align: center; }
     .worldhub-success-content h1 { font-size: 1.5rem; }
     .worldhub-summary-grid { grid-template-columns: 1fr; }
     .worldhub-success-actions { flex-direction: column; }
     .worldhub-btn-home, .worldhub-btn-print { width: 100%; }
     .worldhub-flight-time { font-size: 1.3rem; }
     .worldhub-airport-code { font-size: .92rem; }
     .worldhub-main-card, .worldhub-passenger-card, .worldhub-sidebar-card, .worldhub-side-card { padding: 1.15rem; }

     .worldhub-booking-page .worldhub-booking-header {
       padding: 1.4rem .75rem;
       margin-bottom: 1.25rem;
     }

     .worldhub-booking-page .worldhub-booking-header h2 { font-size: 1.35rem; }

     .worldhub-booking-page > .container {
       padding-right: 12px;
       padding-left: 12px;
     }

     .worldhub-booking-page .worldhub-main-card,
     .worldhub-booking-page .worldhub-passenger-card,
     .worldhub-booking-page .worldhub-sidebar-card,
     .worldhub-booking-page .worldhub-side-card {
       padding: .9rem;
       border-radius: var(--r-lg);
     }

     .worldhub-booking-page .worldhub-booking-segment-card {
       padding: .75rem;
     }

     .worldhub-booking-page .worldhub-booking-segment-card > .row {
       display: grid;
       grid-template-columns: minmax(0, 1fr) minmax(72px, .7fr) minmax(0, 1fr);
       gap: 9px;
       align-items: center;
     }

     .worldhub-booking-page .worldhub-booking-segment-card > .row > [class*="col-"] {
       width: auto;
       max-width: none;
       padding: 0;
     }

     .worldhub-booking-page .worldhub-booking-airline {
       display: grid;
       grid-column: 1 / -1;
       grid-template-columns: 34px minmax(0, 1fr) auto;
       gap: 8px;
       align-items: center;
       padding-bottom: 8px !important;
       border-bottom: 1px solid var(--border-soft);
       text-align: left !important;
     }

     .worldhub-booking-page .worldhub-booking-airline .worldhub-airline-logo {
       width: 34px;
       height: 34px;
       margin: 0;
     }

     .worldhub-booking-page .worldhub-booking-airline .worldhub-airline-name {
       overflow: hidden;
       margin: 0;
       text-overflow: ellipsis;
       white-space: nowrap;
     }

     .worldhub-booking-page .worldhub-booking-airline small { color: var(--text-3); }
     .worldhub-booking-page .worldhub-flight-time { font-size: 1.05rem; }
     .worldhub-booking-page .worldhub-airport-code { font-size: .8rem; }
     .worldhub-booking-page .worldhub-flight-date { font-size: .65rem; }

     .worldhub-booking-page .worldhub-baggage-box > .row {
       display: grid;
       grid-template-columns: repeat(3, minmax(0, 1fr));
       gap: 8px;
     }

     .worldhub-booking-page .worldhub-baggage-box > .row > [class*="col-"] {
       width: auto;
       max-width: none;
       padding: 0;
     }
   }

   @media (max-width: 480px) {
     .worldhub-booking-page .worldhub-baggage-box > .row {
       grid-template-columns: 1fr;
       gap: 5px;
     }

     .worldhub-booking-page #bookingForm .worldhub-btn-pay {
       width: 100% !important;
       min-width: 0;
     }
   }
   
   /* ─────────────────────────────────────────────────────────────────────
      UTILITY
   ───────────────────────────────────────────────────────────────────── */
   .worldhub-cursor-pointer { cursor: pointer; }
   .worldhub-hide { display: none !important; }
   .worldhub-field-label.invisible { visibility: hidden; }
   
   .form-check-label { font-size: .84rem; color: var(--text-2); font-weight: 400; }
   
   .btn.btn-warning { background: var(--royal); border-color: var(--royal); color: var(--text-inverse); font-weight: 700; }
   .btn.btn-light   { background: var(--surface-sunken); border-color: var(--border); color: var(--text-1); font-weight: 500; }
   
   /* Mobile filter button */
   .worldhub-mobile-filter-wrap {
     display: flex;
     justify-content: flex-start;
     margin-bottom: 10px;
   }
   
   .worldhub-mobile-filter-icon {
     width: 42px;
     height: 42px;
     border: none;
     border-radius: var(--r-lg);
     background: var(--royal);
     color: var(--text-inverse);
     display: flex;
     align-items: center;
     justify-content: center;
     transition: all var(--t-fast) var(--ease);
     cursor: pointer;
     box-shadow: var(--shadow-royal);
   }
   
   .worldhub-mobile-filter-icon i { font-size: 18px; }
   
   .worldhub-mobile-filter-icon:hover {
     background: var(--royal-hover);
     transform: translateY(-1px);
   }
   
   .worldhub-mobile-filter-icon:active { transform: scale(.96); }
