/* ════════════════════════════════════════════════════════════════════════
   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.
   ════════════════════════════════════════════════════════════════════════ */

   @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Plus+Jakarta+Sans:wght@500;600;700;800&display=swap');

   /* ─────────────────────────────────────────────────────────────────────
      DESIGN TOKENS
   ───────────────────────────────────────────────────────────────────── */
   :root {
     /* ── Brand palette ─────────────────────────────────────────── */
     --navy:            #111827;
     --navy-700:        #16213D;
     --navy-600:        #1E2A4A;
     --navy-500:        #2A3B5C;
   
     --royal:           #1E88E5;
     --royal-hover:     #1565C0;
     --royal-light:     #EFF4FF;
     --royal-border:    #C7DAFE;
   
     --sky:             #5CC8FF;
     --sky-light:       #EFF9FF;
     --sky-deep:        #1E88E5;
   
     /* ── Semantic ───────────────────────────────────────────────── */
     --success:         #10B981;
     --success-light:   #ECFDF5;
     --success-border:  #A7F3D0;
     --warning:         #FF8A00;
     --warning-light:   #FFF3E0;
     --warning-border:  #FDE3A7;
     --danger:          #EF4444;
     --danger-light:    #FEF2F2;
     --danger-border:   #FBC8C8;
   
     /* ── Neutrals ───────────────────────────────────────────────── */
     --bg:              #F7FBFF;
     --bg-raised:       #EEF6FF;
     --surface:         #FFFFFF;
     --surface-sunken:  #F7FBFF;
   
     --text-1:          #111827;
     --text-2:          #1F2937;
     --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:          #D8E8F7;
     --border-soft:     #EAF2FA;
     --border-strong:   #D8E8F7;
   
     /* ── 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);
   }

/* === WohoCars Brand Theme Tokens === */
:root {
  --primary: #0F4C81;
  --primary-dark: #0A355C;
  --primary-light: #EAF4FF;

  --secondary: #1E88E5;
  --secondary-dark: #1565C0;
  --secondary-light: #E8F3FF;

  --accent: #5CC8FF;
  --accent-light: #EEF9FF;

  --highlight: #FF8A00;
  --highlight-dark: #E67800;
  --highlight-light: #FFF3E0;

  --dark: #111827;
  --dark-soft: #1F2937;

  --surface: #FFFFFF;
  --bg: #F7FBFF;
  --bg-2: #EEF6FF;

  --border: #D8E8F7;
  --border-light: #EAF2FA;

  --text: #111827;
  --muted: #64748B;

  --success: #22A06B;
  --danger: #D64545;

  --shadow-soft: 0 10px 30px rgba(15, 76, 129, 0.10);
  --shadow-card: 0 14px 40px rgba(15, 76, 129, 0.14);
}

:root {
  --navy: var(--dark);
  --navy-700: var(--primary-dark);
  --navy-600: var(--primary);
  --navy-500: var(--secondary-dark);
  --navy-deep: var(--primary-dark);
  --navy-mid: var(--primary);
  --royal: var(--secondary);
  --royal-hover: var(--secondary-dark);
  --royal-light: var(--secondary-light);
  --royal-border: var(--border);
  --sky: var(--accent);
  --sky-light: var(--accent-light);
  --sky-deep: var(--secondary);
  --warning: var(--highlight);
  --warning-light: var(--highlight-light);
  --warning-border: #FFD8A8;
  --danger-light: #FFF1F1;
  --danger-border: #F4B8B8;
  --success-light: #EAFBF4;
  --success-border: #B8E8D4;
  --bg-raised: var(--bg-2);
  --surface-sunken: var(--bg);
  --text-1: var(--text);
  --text-2: var(--dark-soft);
  --text-3: var(--muted);
  --text-4: #94A3B8;
  --border-soft: var(--border-light);
  --border-strong: #B9D3EA;
  --shadow-sm: 0 6px 18px rgba(15, 76, 129, .08);
  --shadow-md: var(--shadow-soft);
  --shadow-lg: var(--shadow-card);
  --shadow-xl: 0 22px 60px rgba(15, 76, 129, .16);
  --shadow-royal: 0 14px 30px rgba(30, 136, 229, .26);
  --shadow-focus: 0 0 0 4px rgba(30, 136, 229, .16);
  --black: var(--dark);
  --white: var(--surface);
  --blue: var(--secondary);
  --orange: var(--highlight);
  --orange-hover: var(--highlight-dark);
  --orange-light: var(--highlight-light);
  --orange-border: #FFD8A8;
  --accent-hover: var(--secondary-dark);
  --accent-border: var(--border);
  --ink: var(--text);
  --ink-2: var(--dark-soft);
  --subtle: var(--muted);
  --line: var(--border);
  --warn: var(--highlight);
  --bs-primary: var(--primary);
  --bs-primary-rgb: 15, 76, 129;
  --bs-link-color: var(--primary);
  --bs-link-hover-color: var(--secondary-dark);
  color-scheme: light;
}
/* === End WohoCars Brand Theme Tokens === */

   
   /* ─────────────────────────────────────────────────────────────────────
      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; }

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

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

   .wohocars-site-brand .wohocars-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 {
       background: var(--surface);
       padding: 14px;
       border-radius: var(--r-lg);
       box-shadow: var(--shadow-lg);
       border: 1px solid var(--border);
       transition: none !important;
     }
     .navbar-collapse.collapsing { background: var(--surface); }
     .navbar-collapse .nav-link {
       color: var(--text-2) !important;
       background: transparent;
       margin: 2px 0;
       border-radius: var(--r-sm);
     }
     .navbar-collapse .nav-link:hover {
       background: var(--royal-light);
       color: var(--royal) !important;
     }
   }
   /* ─────────────────────────────────────────────────────────────────────
      HERO
   ───────────────────────────────────────────────────────────────────── */
   .wohocars-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;
   }
   
   .wohocars-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 */
   .wohocars-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); }
   }
   
   .wohocars-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);
   }
   
   .wohocars-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;
   }
   
   .wohocars-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;
   }
   
   .wohocars-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
   ───────────────────────────────────────────────────────────────────── */
   .wohocars-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 */
   .wohocars-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);
   }
   
   .wohocars-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;
   }
   
   .wohocars-trip-tab.active {
     background: var(--navy);
     color: var(--text-inverse);
     box-shadow: var(--shadow-sm);
   }
   
   /* field */
   .wohocars-field-label {
     font-size: .72rem;
     font-weight: 700;
     letter-spacing: .05em;
     text-transform: uppercase;
     color: var(--text-3);
     margin-bottom: 7px;
   }
   
   .wohocars-field-input { position: relative; }
   
   .wohocars-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;
   }
   
   .wohocars-field-input input,
   .wohocars-field-input .wohocars-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;
   }
   
   .wohocars-field-input input:focus {
     border-color: var(--royal);
     background: var(--surface);
     outline: none;
     box-shadow: var(--shadow-focus);
   }
   
   .wohocars-field-input.is-invalid input {
     border-color: var(--danger);
     box-shadow: 0 0 0 4px rgba(239,68,68,.1);
   }
   
   .wohocars-field-error {
     display: block;
     font-size: .72rem;
     color: var(--danger);
     margin-top: 5px;
     min-height: 1em;
     font-weight: 500;
   }
   
   /* Swap button */
   .wohocars-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);
   }
   
   .wohocars-swap-btn:hover {
     background: var(--royal-hover);
     transform: rotate(180deg);
   }
   
   /* Search button */
   .wohocars-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;
   }
   
   .wohocars-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;
   }
   
   .wohocars-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);
   }
   
   .wohocars-ac-item {
     padding: 10px 14px;
     cursor: pointer;
     border-bottom: 1px solid var(--border-soft);
     transition: background var(--t-fast) var(--ease);
   }
   
   .wohocars-ac-item:hover,
   .wohocars-ac-item.active { background: var(--royal-light); }
   
   .wohocars-ac-main { font-size: .88rem; color: var(--text-1); font-weight: 600; }
   .wohocars-ac-sub  { font-size: .73rem; color: var(--text-3); margin-top: 1px; }
   .wohocars-ac-empty { padding: 14px; color: var(--text-3); font-size: .84rem; text-align: center; }
   
   /* Traveller dropdown */
   #travellerBox { cursor: pointer; }
   
   .wohocars-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); }
   }
   
   .wohocars-trav-row {
     display: flex;
     justify-content: space-between;
     align-items: center;
     margin-bottom: .85rem;
   }
   
   .wohocars-trav-row strong { font-size: .88rem; color: var(--text-1); font-weight: 700; }
   .wohocars-trav-row small  { font-size: .72rem; color: var(--text-3); }
   
   .wohocars-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);
   }
   
   .wohocars-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 */
   .wohocars-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);
   }
   
   .wohocars-airline-tag-remove {
     cursor: pointer;
     font-size: .68rem;
     color: var(--royal);
     line-height: 1;
     transition: color var(--t-fast) var(--ease);
   }
   .wohocars-airline-tag-remove:hover { color: var(--danger); }
   
   /* Non-stop checkbox */
   .form-check-input:checked {
     background-color: var(--royal);
     border-color: var(--royal);
   }
   /* ─────────────────────────────────────────────────────────────────────
      STATS BAR
   ───────────────────────────────────────────────────────────────────── */
   .wohocars-stats-bar {
     background: var(--surface);
     padding: 1.5rem 0;
     border-bottom: 1px solid var(--border-soft);
     position: relative;
     z-index: 5;
   }
   
   .wohocars-stat-item {
     text-align: center;
     padding: .5rem .8rem;
     position: relative;
     transition: transform var(--t-base) var(--ease);
   }
   
   .wohocars-stat-item:hover { transform: translateY(-3px); }
   
   .wohocars-stat-num {
     font-family: var(--font-display);
     font-size: 1.7rem;
     color: var(--navy);
     font-weight: 800;
     line-height: 1;
     letter-spacing: -.04em;
   }
   
   .wohocars-stat-num span { color: var(--text-3); font-size: .86rem; font-weight: 500; }
   
   .wohocars-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;
   }
   
   .wohocars-stat-label i { color: var(--sky); }
   
   .wohocars-stat-item::after {
     content: '';
     position: absolute;
     right: 0; top: 20%;
     height: 60%; width: 1px;
     background: var(--border-soft);
   }
   
   .col-md-3:last-child .wohocars-stat-item::after { display: none; }
   
   /* ─────────────────────────────────────────────────────────────────────
      SECTION HEADINGS
   ───────────────────────────────────────────────────────────────────── */
   .wohocars-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;
   }
   
   .wohocars-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;
   }
   
   .wohocars-sec-sub {
     font-size: .9rem;
     color: var(--text-3);
     margin-top: .4rem;
   }
   
   /* ─────────────────────────────────────────────────────────────────────
      DESTINATION CARDS
   ───────────────────────────────────────────────────────────────────── */
   .wohocars-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);
   }
   
   .wohocars-dest-card:hover {
     transform: translateY(-6px);
     box-shadow: var(--shadow-lg);
     border-color: var(--border);
   }
   
   .wohocars-dest-card img {
     width: 100%;
     object-fit: cover;
     transition: transform .6s var(--ease-out);
   }
   
   .wohocars-dest-card:hover img { transform: scale(1.06); }
   
   .wohocars-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);
   }
   
   .wohocars-dest-city {
     font-family: var(--font-display);
     font-size: 1.05rem;
     font-weight: 700;
     display: flex;
     align-items: center;
     gap: 5px;
     letter-spacing: -.02em;
   }
   
   .wohocars-dest-price {
     font-size: .77rem;
     color: var(--text-inverse-70);
     margin-top: 4px;
   }
   
   .wohocars-dest-price strong {
     color: var(--sky);
     font-size: .92rem;
     font-weight: 700;
   }
   
   .wohocars-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);
   }
   
   .wohocars-footer-brand {
     display: flex;
     align-items: center;
     gap: 10px;
   }

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

   .wohocars-footer-logo {
     display: block;
     width: auto;
     height: 52px;
     max-width: 230px;
     object-fit: contain;
   }
   
   .wohocars-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
   ───────────────────────────────────────────────────────────────────── */
   .wohocars-sr-page {
     background: var(--bg);
     height: auto;
     overflow: visible;
     display: block;
     margin-top: 0;
   }
   
   /* sticky route summary bar */
   .wohocars-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);
   }
   
   .wohocars-sr-search-summary {
     display: flex;
     align-items: center;
     justify-content: space-between;
     gap: 1rem;
     height: auto;
     padding: 4px 0;
     flex-wrap: wrap;
   }
   
   .wohocars-sr-route {
     display: flex;
     align-items: center;
     gap: .55rem;
   }
   
   .wohocars-sr-route-iata {
     font-family: var(--font-display);
     font-size: 20px;
     font-weight: 800;
     color: var(--navy);
     letter-spacing: -.02em;
   }
   
   .wohocars-sr-route-arrow { color: var(--sky-deep); font-size: 14px; margin: 0 2px; }
   
   .wohocars-sr-route-meta { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
   
   .wohocars-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;
   }
   
   .wohocars-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);
   }
   
   .wohocars-sr-modify-btn:hover {
     background: var(--royal-light);
     border-color: var(--royal-border);
     color: var(--royal);
   }
   
   .wohocars-sr-modify-panel {
     border-top: 1px solid var(--border);
     background: var(--surface-sunken);
     padding: 1.2rem 0;
   }
   
   /* Body layout */
   .wohocars-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
   ───────────────────────────────────────────────────────────────────── */
   .wohocars-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);
   }
   
   .wohocars-sr-sidebar::-webkit-scrollbar { width: 4px; }
   .wohocars-sr-sidebar::-webkit-scrollbar-track { background: transparent; }
   .wohocars-sr-sidebar::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 4px; }
   
   .wohocars-sr-sidebar-head {
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding-bottom: .6rem;
     border-bottom: 1px solid var(--border-soft);
   }
   
   .wohocars-sr-sidebar-title {
     font-size: .72rem;
     font-weight: 800;
     letter-spacing: .07em;
     text-transform: uppercase;
     color: var(--navy);
   }
   
   .wohocars-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);
   }
   
   .wohocars-sr-reset-btn:hover { background: var(--royal); color: var(--text-inverse); }
   
   .wohocars-sr-filter-count {
     font-size: .68rem;
     color: var(--text-4);
     margin-top: -.1rem;
   }
   
   .wohocars-sr-filter-section { display: flex; flex-direction: column; gap: .4rem; }
   
   .wohocars-sr-filter-label {
     font-size: .7rem;
     font-weight: 700;
     letter-spacing: .04em;
     color: var(--navy);
     text-transform: uppercase;
   }
   
   /* Stops */
   .wohocars-stop-filter-row {
     display: flex;
     justify-content: space-between;
     align-items: center;
     padding: 4px 0;
   }
   
   .wohocars-stop-filter-row label {
     font-size: .82rem;
     color: var(--text-2);
     cursor: pointer;
     margin: 0;
     font-weight: 400;
   }
   
   .wohocars-stop-filter-row .wohocars-stop-price {
     font-size: .71rem;
     color: var(--text-3);
     font-family: var(--font-mono);
     font-weight: 600;
   }
   
   .wohocars-stop-price sup { font-size: .6em; vertical-align: super; }
   
   input[type=radio].wohocars-filter-stop:checked { accent-color: var(--royal); }
   
   /* Time slots */
   .wohocars-sr-time-slots { display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; }
   
   .wohocars-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;
   }
   
   .wohocars-time-slot-btn i { font-size: 14px; display: block; margin-bottom: 4px; color: var(--text-4); }
   
   .wohocars-time-slot-btn.active {
     border-color: var(--royal);
     background: var(--royal-light);
     color: var(--royal-hover);
   }
   
   .wohocars-time-slot-btn.active i { color: var(--royal); }
   
   /* Airlines in sidebar */
   .wohocars-sr-airline-row {
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding: 3px 0;
   }
   
   .wohocars-sr-airline-row label {
     display: flex;
     align-items: center;
     gap: 7px;
     font-size: .79rem;
     color: var(--text-2);
     cursor: pointer;
     margin: 0;
     font-weight: 400;
   }
   
   .wohocars-sr-airline-row .wohocars-sr-price-hint {
     font-size: .68rem;
     color: var(--text-3);
     font-family: var(--font-mono);
   }
   
   input[type=checkbox].wohocars-filter-airline:checked,
   input[type=checkbox].wohocars-filter-dep-airport:checked,
   input[type=checkbox].wohocars-filter-ret-airport:checked {
     accent-color: var(--royal);
   }
   
   /* Price slider */
   .wohocars-sr-price-range-labels {
     display: flex;
     justify-content: space-between;
   }
   
   .wohocars-sr-price-range-labels small {
     font-size: .7rem;
     color: var(--text-3);
     font-family: var(--font-mono);
   }
   
   #priceSliderWrap {
     position: relative;
     height: 22px;
     margin: 8px 0;
   }
   
   #priceSliderWrap input[type=range] {
     position: absolute;
     width: 100%;
     pointer-events: none;
     height: 4px;
     -webkit-appearance: none;
     background: transparent;
     top: 8px;
   }
   
   #priceSliderWrap input[type=range]::-webkit-slider-thumb {
     -webkit-appearance: none;
     width: 17px; height: 17px;
     border-radius: 50%;
     background: var(--royal);
     cursor: pointer;
     pointer-events: all;
     border: 2.5px solid var(--surface);
     box-shadow: 0 2px 6px rgba(37,99,235,.4);
   }
   
   #priceSliderWrap input[type=range]::-webkit-slider-runnable-track {
     height: 4px;
     background: var(--border);
     border-radius: 2px;
   }
   
   #priceValue {
     font-size: .71rem;
     color: var(--text-3);
     text-align: center;
     font-family: var(--font-mono);
     margin-top: 4px;
     font-weight: 600;
   }
   
   .wohocars-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
   ───────────────────────────────────────────────────────────────────── */
   .wohocars-sr-results-col {
     flex: 1;
     overflow: visible;
     padding: 0;
     display: flex;
     flex-direction: column;
     background: transparent;
     min-width: 0;
   }
   
   .wohocars-sr-results-col::-webkit-scrollbar { width: 4px; }
   .wohocars-sr-results-col::-webkit-scrollbar-track { background: transparent; }
   .wohocars-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) */
   .wohocars-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);
   }
   
   .wohocars-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);
   }
   
   .wohocars-flight-sort-tab:last-child { border-right: none; }
   
   .wohocars-flight-sort-tab:hover { background: var(--surface-sunken); }
   
   .wohocars-flight-sort-tab.active {
     background: var(--royal-light);
     border-bottom: 3px solid var(--royal);
     box-shadow: none;
   }
   
   .wohocars-flight-sort-tab.active::after { display: none; }
   
   .wohocars-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;
   }
   
   .wohocars-flight-sort-tab.active .wohocars-flight-sort-label { color: var(--royal-hover); }
   
   .wohocars-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;
   }
   
   .wohocars-flight-sort-tab.active .wohocars-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: #E67800; border-left: 3px solid var(--warning); }
   .alert-danger  { background: var(--danger-light); color: #991B1B; border-left: 3px solid var(--danger); }
   
   /* ─────────────────────────────────────────────────────────────────────
      FLIGHT CARDS
   ───────────────────────────────────────────────────────────────────── */
   .wohocars-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);
   }
   
   .wohocars-fc-card:hover {
     box-shadow: var(--shadow-lg);
     border-color: var(--royal-border);
     transform: translateY(-2px);
   }
   
   /* legacy top row — superseded by .wohocars-fc-card-inner, kept hidden so older
      markup variants never double-render airline/route info */
   .wohocars-fc-top { display: none; }
   
   /* ── Card inner: airline | route | price, three-column row ── */
   .wohocars-fc-card-inner {
     display: flex;
     align-items: stretch;
     min-height: 96px;
   }
   
   /* Airline column */
   .wohocars-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);
   }
   
   .wohocars-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);
   }
   
   .wohocars-fc-airline-name {
     font-size: .76rem;
     font-weight: 700;
     color: var(--navy);
     letter-spacing: -.01em;
     line-height: 1.3;
   }
   
   .wohocars-fc-airline-code {
     font-size: .66rem;
     color: var(--text-3);
     margin-top: 1px;
   }
   
   .wohocars-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 */
   .wohocars-fc-col-route {
     flex: 1;
     padding: 14px 18px;
     display: flex;
     flex-direction: column;
     justify-content: center;
     gap: 4px;
   }
   
   .wohocars-fc-route {
     display: grid;
     grid-template-columns: minmax(0,1fr) minmax(0,150px) minmax(0,1fr);
     align-items: center;
     gap: 8px;
   }
   
   .wohocars-fc-route-row {
     display: flex;
     align-items: center;
     gap: 14px;
   }
   
   .wohocars-fc-endpoint { display: flex; flex-direction: column; }
   .wohocars-fc-endpoint--right { align-items: flex-start; text-align: left; }
   
   .wohocars-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;
   }
   
   .wohocars-fc-date {
     font-size: .67rem;
     color: var(--text-3);
     margin-top: 3px;
   }
   
   .wohocars-fc-airport { display: flex; align-items: flex-start; gap: 4px; margin-top: 4px; }
   .wohocars-fc-airport-code-row { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
   
   .wohocars-fc-iata {
     font-size: .76rem;
     font-weight: 700;
     color: var(--text-2);
     letter-spacing: .03em;
   }
   
   .wohocars-fc-city-name { font-size: .66rem; color: var(--text-3); }
   .wohocars-fc-airport-name { font-size: .61rem; color: var(--text-4); margin-top: 1px; line-height: 1.3; }
   
   .wohocars-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 */
   .wohocars-fc-middle {
     flex: 1;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     gap: 4px;
     padding: 0 10px;
   }
   
   .wohocars-fc-duration {
     font-size: .71rem;
     color: var(--text-3);
     font-weight: 600;
     font-family: var(--font-body);
   }
   
   .wohocars-fc-path-line { display: flex; align-items: center; width: 100%; gap: 4px; }
   .wohocars-fc-path-line-bar { flex: 1; height: 1.5px; background: var(--border-strong); }
   .wohocars-fc-plane-icon { width: 14px; height: 14px; color: var(--sky-deep); flex-shrink: 0; }
   .wohocars-fc-via { font-size: .64rem; color: var(--royal); text-align: center; min-height: 13px; font-weight: 600; }
   .wohocars-fc-stop-count { font-size: .68rem; color: var(--text-2); text-align: center; font-weight: 600; margin-top: 1px; }
   
   .wohocars-fc-cabin-info {
     font-size: .63rem;
     color: var(--text-4);
     display: flex;
     align-items: center;
     gap: 4px;
   }
   
   .wohocars-fc-dot { color: var(--border-strong); }
   
   /* card divider between legs (round-trip) */
   .wohocars-fc-divider { border: none; border-top: 1px dashed var(--border); margin: 0; }
   .wohocars-fc-leg { margin-bottom: 0; }
   .wohocars-fc-leg-label {
     font-size: .6rem;
     font-weight: 800;
     letter-spacing: .09em;
     text-transform: uppercase;
     color: var(--text-4);
     margin-bottom: 7px;
   }
   
   /* stop popup */
   .wohocars-fc-stop-wrapper { position: relative; }
   .wohocars-fc-stop-toggle { border: none; cursor: pointer; transition: all var(--t-fast) var(--ease); background: transparent; }
   .wohocars-fc-stop-toggle:hover { background: var(--royal-light) !important; }
   
   .wohocars-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;
   }
   
   .wohocars-fc-stop-item:not(:last-child) {
     border-bottom: 1px solid var(--border-soft);
     padding-bottom: 8px; margin-bottom: 8px;
   }
   
   .wohocars-fc-stop-city    { font-size: .82rem; font-weight: 700; color: var(--navy); }
   .wohocars-fc-stop-airport { font-size: .7rem; color: var(--text-3); margin-top: 2px; }
   .wohocars-fc-stop-layover { font-size: .7rem; color: var(--royal); margin-top: 4px; font-weight: 700; }
   
   /* Price column */
   .wohocars-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);
   }
   
   .wohocars-fc-price { display: flex; align-items: baseline; gap: 2px; flex-direction: row; }
   
   .wohocars-fc-currency { font-size: .76rem; color: var(--text-2); font-weight: 700; }
   
   .wohocars-fc-amount {
     font-size: 1.6rem;
     font-weight: 800;
     color: var(--navy);
     line-height: 1;
     font-family: var(--font-display);
     letter-spacing: -.03em;
   }
   
   .wohocars-fc-price-sub { font-size: .61rem; color: var(--text-4); text-align: right; line-height: 1.3; }
   
   .wohocars-fc-seats-label {
     font-size: .62rem;
     color: var(--warning);
     display: flex;
     align-items: center;
     gap: 3px;
     white-space: nowrap;
     font-weight: 600;
   }
   
   /* Buttons */
   .wohocars-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;
   }
   
   .wohocars-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;
   }
   .wohocars-fc-btn--primary:hover {
     background: var(--royal-hover);
     transform: translateY(-1px);
     box-shadow: 0 12px 26px rgba(37,99,235,.34);
   }
   
   .wohocars-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);
   }
   .wohocars-fc-btn--secondary:hover {
     background: transparent;
     color: var(--sky-deep);
     border-color: transparent;
   }
   
   .wohocars-fc-actions { display: flex; align-items: center; gap: 10px; }
   
   /* ── Bottom strip: flight details toggle + badges ── */
   .wohocars-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 */
   .wohocars-fc-badges { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
   
   .wohocars-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);
   }
   
   .wohocars-fc-via-click { cursor: pointer; color: var(--royal); transition: color var(--t-fast) var(--ease); }
   .wohocars-fc-via-click:hover { color: var(--sky-deep); text-decoration: underline; }
   
   .wohocars-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;
   }
   
   .wohocars-fc-badge--success { background: var(--success-light); color: #047857; }
   .wohocars-fc-badge--danger  { background: var(--danger-light); color: #B91C1C; }
   .wohocars-fc-badge--warning { background: var(--warning-light); color: #B45309; }
   .wohocars-fc-badge--neutral { background: var(--surface-sunken); color: var(--text-2); border: 1px solid var(--border); }
   
   /* Details panel */
   .wohocars-fc-details-panel { margin-top: 0; }
   
   .wohocars-fc-details-section {
     background: var(--surface-sunken);
     border-top: 1px solid var(--border-soft);
     border-radius: 0;
     padding: 14px 18px;
     margin-bottom: 0;
   }
   
   .wohocars-fc-details-title {
     font-size: .67rem;
     font-weight: 800;
     color: var(--text-3);
     letter-spacing: .08em;
     text-transform: uppercase;
     margin-bottom: 9px;
   }
   
   .wohocars-fc-details-leg-label {
     font-size: .63rem;
     font-weight: 800;
     color: var(--text-4);
     text-transform: uppercase;
     letter-spacing: .07em;
     margin: 7px 0 5px;
   }
   
   .wohocars-fc-segment-row {
     background: var(--surface);
     border: 1px solid var(--border-soft);
     border-radius: var(--r-sm);
     padding: 9px 13px;
     margin-bottom: 6px;
   }
   
   .wohocars-fc-segment-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 3px; }
   .wohocars-fc-segment-flight { font-size: .8rem; font-weight: 700; color: var(--navy); font-family: var(--font-mono); }
   .wohocars-fc-segment-aircraft { font-size: .68rem; color: var(--text-4); display: flex; align-items: center; gap: 4px; }
   .wohocars-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);
   }
   .wohocars-fc-segment-time { color: var(--text-3); font-weight: 400; }
   .wohocars-fc-segment-arrow { color: var(--border-strong); }
   .wohocars-fc-segment-meta { display: flex; align-items: center; gap: 5px; font-size: .68rem; color: var(--text-3); flex-wrap: wrap; }
   
   /* Fare table */
   .wohocars-fc-fare-table { width: 100%; border-collapse: collapse; font-size: .79rem; }
   .wohocars-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);
   }
   .wohocars-fc-fare-table td { padding: 7px 0; color: var(--text-1); border-bottom: 1px solid var(--border-soft); }
   .wohocars-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
   ───────────────────────────────────────────────────────────────────── */
   .wohocars-skeleton {
     position: relative;
     overflow: hidden;
     background: var(--bg-raised);
     border-radius: var(--r-sm);
     display: block;
   }
   
   .wohocars-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%); } }
   
   .wohocars-skeleton-circle    { width: 32px; height: 32px; border-radius: 50%; }
   .wohocars-skeleton-circle-lg { width: 44px; height: 44px; border-radius: 50%; }
   .wohocars-skeleton-text-lg   { height: 14px; border-radius: 4px; }
   .wohocars-skeleton-text-sm   { height: 10px; border-radius: 4px; }
   .wohocars-skeleton-text-xs   { height: 8px;  border-radius: 4px; }
   .wohocars-skeleton-badge     { height: 22px; border-radius: var(--r-pill); }
   .wohocars-skeleton-time      { height: 26px; border-radius: 4px; }
   .wohocars-skeleton-duration  { height: 11px; border-radius: 4px; }
   .wohocars-skeleton-line      { height: 3px;  border-radius: var(--r-pill); }
   .wohocars-skeleton-price     { height: 28px; border-radius: 4px; }
   .wohocars-skeleton-btn       { height: 34px; border-radius: var(--r-sm); }
   
   .wohocars-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;
   }
   
   .wohocars-flight-skeleton-top    { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
   .wohocars-flight-skeleton-route  { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
   .wohocars-flight-skeleton-middle { flex: 1; padding: 0 20px; display: flex; flex-direction: column; gap: 6px; align-items: center; }
   .wohocars-flight-skeleton-bottom { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: .85rem; border-top: 1px solid var(--border-soft); }
   
   .wohocars-filter-skeleton-wrap { display: flex; flex-direction: column; gap: 10px; }
   /* ─────────────────────────────────────────────────────────────────────
      BOOKING PAGE
   ───────────────────────────────────────────────────────────────────── */
   .wohocars-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;
   }
   
   .wohocars-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;
   }
   
   .wohocars-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;
   }
   
   .wohocars-booking-header p {
     font-size: .9rem;
     color: var(--text-inverse-70);
     margin: 0;
   }
   
   /* Shared cards */
   .wohocars-main-card,
   .wohocars-passenger-card,
   .wohocars-sidebar-card,
   .wohocars-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);
   }
   
   .wohocars-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;
   }
   
   .wohocars-card-title i { color: var(--royal); }
   
   /* Flight box in booking page */
   .wohocars-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);
   }
   
   .wohocars-flight-box:hover {
     box-shadow: var(--shadow-sm);
     border-color: var(--royal-border);
   }
   
   .wohocars-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);
   }
   
   .wohocars-airline-name {
     font-size: .88rem;
     font-weight: 700;
     margin-top: 9px;
     color: var(--text-1);
     letter-spacing: -.01em;
   }
   
   .wohocars-flight-time {
     font-size: 1.65rem;
     font-weight: 800;
     color: var(--navy);
     font-family: var(--font-display);
     letter-spacing: -.03em;
   }
   
   .wohocars-airport-code {
     font-size: 1.02rem;
     font-weight: 700;
     margin-top: 3px;
     color: var(--text-2);
     letter-spacing: -.01em;
   }
   
   .wohocars-flight-date { font-size: .77rem; color: var(--text-3); }
   
   .wohocars-flight-line {
     position: relative;
     text-align: center;
     margin-top: 11px;
   }
   
   .wohocars-flight-line::before {
     content: '';
     position: absolute;
     left: 0; right: 0; top: 10px;
     border-top: 1px dashed var(--border-strong);
   }
   
   .wohocars-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;
   }
   
   .wohocars-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 */
   .wohocars-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);
   }
   
   .wohocars-baggage-box i { color: var(--sky-deep); margin-right: 6px; }
   
   /* Booking sidebar */
   .wohocars-sidebar-card.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);
   }
   
   .wohocars-timer-card h5 {
     font-size: .7rem;
     font-weight: 700;
     letter-spacing: .1em;
     text-transform: uppercase;
     color: var(--text-inverse-45);
     margin-bottom: .55rem;
   }
   
   .wohocars-timer-card h1 {
     font-family: var(--font-display);
     font-size: 2.9rem;
     font-weight: 800;
     color: var(--sky);
     margin: .25rem 0;
     letter-spacing: -.04em;
   }
   
   .wohocars-timer-card p {
     font-size: .77rem;
     color: var(--text-inverse-45);
     margin: 0;
   }
   
   /* Fare summary */
   .wohocars-fare-row {
     display: flex;
     justify-content: space-between;
     align-items: center;
     margin-bottom: .85rem;
     font-size: .875rem;
     color: var(--text-3);
   }
   
   .wohocars-fare-row strong { color: var(--text-1); font-weight: 600; }
   
   .wohocars-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 */
   .wohocars-side-card { position: sticky; top: calc(var(--navbar-h) + 16px + 300px + 24px); }
   
   .wohocars-heading {
     font-family: var(--font-display);
     font-size: 1.02rem;
     font-weight: 800;
     color: var(--navy);
     letter-spacing: -.02em;
   }
   
   .wohocars-why-list { list-style: none; padding: 0; margin: 0; }
   
   .wohocars-why-list li {
     position: relative;
     padding-left: 22px;
     margin-bottom: 9px;
     font-size: .85rem;
     color: var(--text-2);
     font-weight: 400;
   }
   
   .wohocars-why-list li::before {
     content: "✓";
     position: absolute;
     left: 0; top: 0;
     color: var(--success);
     font-weight: 800;
     font-size: .82rem;
   }
   
   .wohocars-secure-text {
     font-size: .75rem;
     line-height: 1.75;
     color: var(--text-4);
     margin-top: 13px;
   }
   
   /* Passenger form */
   .wohocars-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;
   }
   
   .wohocars-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 */
   .wohocars-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;
   }
   
   .wohocars-btn-pay:hover {
     transform: translateY(-2px);
     filter: brightness(1.05);
     box-shadow: 0 14px 30px rgba(37,99,235,.36);
   }
   
   /* Expiry modal */
   .wohocars-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);
   }
   
   .wohocars-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);
   }
   
   .wohocars-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;
   }
   
   .wohocars-expiry-content p {
     font-size: .88rem;
     color: var(--text-3);
     line-height: 1.75;
     margin-bottom: 1.6rem;
   }
   
   .wohocars-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;
   }
   
   .wohocars-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
   ───────────────────────────────────────────────────────────────────── */
   .wohocars-booking-success-wrapper {
     max-width: 1060px;
     margin: auto;
     padding: 2.75rem 0 4.5rem;
   }
   
   .wohocars-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);
   }
   
   .wohocars-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;
   }
   
   .wohocars-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); }
   }
   
   .wohocars-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);
   }
   
   .wohocars-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;
   }
   
   .wohocars-success-content p {
     font-size: .9rem;
     line-height: 1.8;
     color: var(--text-inverse-70);
     margin: 0;
     max-width: 600px;
   }
   
   /* Success summary card */
   .wohocars-booking-summary-card,
   .wohocars-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);
   }
   
   .wohocars-summary-header,
   .wohocars-section-header {
     display: flex;
     align-items: center;
     justify-content: space-between;
     margin-bottom: 1.4rem;
   }
   
   .wohocars-summary-header h4,
   .wohocars-section-header h4 {
     font-family: var(--font-display);
     font-size: 1.05rem;
     font-weight: 800;
     margin: 0;
     color: var(--navy);
     letter-spacing: -.02em;
   }
   
   .wohocars-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);
   }
   
   .wohocars-booking-id span { color: var(--royal-hover); font-weight: 800; }
   
   .wohocars-summary-grid {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
     gap: 13px;
   }
   
   .wohocars-summary-item {
     background: var(--surface-sunken);
     border-radius: var(--r-lg);
     padding: 1.15rem 1.25rem;
     border: 1px solid var(--border-soft);
   }
   
   .wohocars-summary-item label {
     display: block;
     font-size: .68rem;
     font-weight: 800;
     letter-spacing: .05em;
     text-transform: uppercase;
     color: var(--text-4);
     margin-bottom: 8px;
   }
   
   .wohocars-summary-item div {
     font-size: .96rem;
     font-weight: 700;
     color: var(--navy);
     word-break: break-word;
     letter-spacing: -.01em;
   }
   
   /* Passenger table */
   .wohocars-passenger-table { margin: 0; vertical-align: middle; }
   
   .wohocars-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;
   }
   
   .wohocars-passenger-table tbody td {
     padding: 15px;
     border-color: var(--border-soft);
     font-size: .875rem;
     color: var(--text-1);
   }
   
   .wohocars-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);
   }
   
   .wohocars-passenger-name { font-weight: 700; letter-spacing: -.01em; color: var(--navy); }
   
   .wohocars-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 */
   .wohocars-success-actions {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 13px;
     margin-top: .6rem;
   }
   
   .wohocars-btn-home,
   .wohocars-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;
   }
   
   .wohocars-btn-home {
     background: var(--royal);
     color: var(--text-inverse);
     box-shadow: var(--shadow-royal);
   }
   
   .wohocars-btn-home:hover { background: var(--royal-hover); transform: translateY(-2px); color: var(--text-inverse); box-shadow: 0 12px 26px rgba(37,99,235,.34); }
   
   .wohocars-btn-print {
     background: var(--surface);
     color: var(--text-2);
     border: 1.5px solid var(--border);
   }
   
   .wohocars-btn-print:hover { background: var(--surface-sunken); border-color: var(--border-strong); }
   /* ─────────────────────────────────────────────────────────────────────
      INLINE SEARCH BAR
   ───────────────────────────────────────────────────────────────────── */
   .wohocars-search-card-inline {
     background: var(--surface);
     border-radius: var(--r-xl);
     padding: 18px;
     border: 1px solid var(--border-soft);
     box-shadow: var(--shadow-sm);
   }
   
   .wohocars-search-form-inline { width: 100%; }
   .wohocars-search-inline-top { margin-bottom: 15px; }
   .wohocars-inline-trip-tabs { display: inline-flex; gap: 4px; }
   
   .wohocars-search-inline-wrap {
     display: flex;
     align-items: flex-end;
     gap: 13px;
     flex-wrap: nowrap;
   }
   
   .wohocars-inline-field { flex: 1; min-width: 150px; }
   
   .wohocars-inline-field label {
     display: block;
     margin-bottom: 6px;
     font-size: 10px;
     font-weight: 700;
     color: var(--text-3);
     text-transform: uppercase;
     letter-spacing: .05em;
   }
   
   .wohocars-search-card-inline .wohocars-field-input { height: 50px; border-radius: var(--r-lg); }
   .wohocars-search-card-inline .wohocars-field-input input { height: 50px; font-size: .9rem; font-weight: 500; }
   
   .wohocars-inline-swap { flex: 0 0 auto; padding-bottom: 2px; }
   .wohocars-search-card-inline .wohocars-swap-btn { width: 44px; height: 44px; }
   
   .wohocars-inline-search-btn { flex: 0 0 165px; }
   /* .wohocars-inline-search-btn { flex: 1; } */
   .wohocars-inline-search-btn .wohocars-btn-search { width: 100%; height: 50px; border-radius: var(--r-lg); }
   .wohocars-search-card-inline .wohocars-trav-dropdown { top: calc(100% + 10px); right: 0; }
   
   @media (max-width: 1400px) {
     .wohocars-search-inline-wrap { flex-wrap: wrap; }
     .wohocars-inline-field { min-width: calc(33.33% - 10px); }
   }
   
   @media (max-width: 992px) {
     .wohocars-inline-field { min-width: calc(50% - 10px); }
     .wohocars-inline-search-btn { flex: 1 1 100%; }
   }
   
   @media (max-width: 768px) {
     .wohocars-search-card-inline { padding: 14px; }
     .wohocars-search-inline-wrap { flex-direction: column; gap: 10px; }
     .wohocars-inline-field, .wohocars-inline-search-btn { width: 100%; min-width: 100%; }
     .wohocars-inline-swap { width: 100%; display: flex; justify-content: center; padding-bottom: 0; }
   }
   
   /* ─────────────────────────────────────────────────────────────────────
      MOBILE — Traveller dropdown
   ───────────────────────────────────────────────────────────────────── */
   @media (max-width: 767px) {
     .wohocars-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) {
     .wohocars-sr-page { height: auto; overflow: visible; }
     .wohocars-sr-body { flex-direction: column; overflow: visible; padding: 10px; }
     .wohocars-sr-sidebar {
       width: 100%; min-width: 0;
       border-right: none;
       position: static;
       max-height: none;
     }
     .wohocars-sr-results-col { overflow: visible; padding: 0; }
     .wohocars-flight-sort-price { font-size: 1rem; }
     .wohocars-fc-col-price { width: 130px; min-width: 130px; }
     .wohocars-fc-col-airline { width: 112px; min-width: 112px; }
     .wohocars-fc-bottom { padding-left: 124px; }
   }
   
   @media (max-width: 640px) {
     .wohocars-sr-search-bar { padding: 10px .75rem; }
     .wohocars-sr-search-summary { height: auto; padding: .65rem 0; }
     .wohocars-sr-route-iata { font-size: 14px; }
     .wohocars-flight-sort-tabs { gap: 0; }
     .wohocars-flight-sort-tab  { padding: 9px 7px; }
     .wohocars-flight-sort-label { font-size: .7rem; }
     .wohocars-flight-sort-price { font-size: .9rem; margin-top: 3px; }
     .wohocars-flight-sort-tab.active::after { display: none; }
   
     .wohocars-fc-card-inner { flex-direction: column; }
     .wohocars-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);
     }
     .wohocars-fc-col-airline .wohocars-fc-airline-logo { margin-bottom: 0; }
     .wohocars-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;
     }
     .wohocars-fc-btn--primary { width: auto; padding: 9px 22px; }
     .wohocars-fc-bottom { padding-left: 15px; }
     .wohocars-fc-amount { font-size: 1.32rem; }
     .wohocars-fc-time { font-size: 1.05rem; min-width: 0; }
   }
   
   /* ─────────────────────────────────────────────────────────────────────
      RESPONSIVE — Booking & Success
   ───────────────────────────────────────────────────────────────────── */
   @media (max-width: 991px) {
     .wohocars-sidebar-card,
     .wohocars-side-card { position: relative; top: 0; }
   }
   
   @media (max-width: 768px) {
     .wohocars-booking-header { padding: 1.9rem 1rem; }
     .wohocars-success-hero { padding: 1.9rem; flex-direction: column; text-align: center; }
     .wohocars-success-content h1 { font-size: 1.5rem; }
     .wohocars-summary-grid { grid-template-columns: 1fr; }
     .wohocars-success-actions { flex-direction: column; }
     .wohocars-btn-home, .wohocars-btn-print { width: 100%; }
     .wohocars-flight-time { font-size: 1.3rem; }
     .wohocars-airport-code { font-size: .92rem; }
     .wohocars-main-card, .wohocars-passenger-card, .wohocars-sidebar-card, .wohocars-side-card { padding: 1.15rem; }
   }
   
   /* ─────────────────────────────────────────────────────────────────────
      UTILITY
   ───────────────────────────────────────────────────────────────────── */
   .wohocars-cursor-pointer { cursor: pointer; }
   .wohocars-hide { display: none !important; }
   .wohocars-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 */
   .wohocars-mobile-filter-wrap {
     display: flex;
     justify-content: flex-start;
     margin-bottom: 10px;
   }
   
   .wohocars-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);
   }
   
   .wohocars-mobile-filter-icon i { font-size: 18px; }
   
   .wohocars-mobile-filter-icon:hover {
     background: var(--royal-hover);
     transform: translateY(-1px);
   }
   
   .wohocars-mobile-filter-icon:active { transform: scale(.96); }