/* Search-first travel portal. BlackPass stays black/platinum, not Opodo orange. */
:root{--travel-motion:650ms;--travel-radius:14px;--travel-muted:#5b6068;--travel-tab-outline:#9ca3ad;--travel-plus-glow:#ffe60045}
.travel-hero{height:270px;background:#101a22}
.hero-slides{position:absolute;inset:0;z-index:-3}
.travel-hero .hero-image{inset:0;width:100%;max-width:none;height:100%;object-fit:cover;object-position:center 52%;mask-image:none;-webkit-mask-image:none;z-index:auto;opacity:0;transition:opacity var(--travel-motion) ease}
.travel-hero .hero-image.is-active{opacity:1}
.travel-hero .hero-image:nth-child(2){object-position:center top}
.travel-hero .hero-image:last-child{object-position:center 34%}
.travel-hero .hero-shade{background:linear-gradient(90deg,#06131bea 0%,#07141ca8 38%,#07141c26 75%),linear-gradient(0deg,#0817227a,transparent 50%)}
.travel-hero .hero-copy{padding-top:28px}
.travel-hero .hero-copy h1{font-size:clamp(36px,3.4vw,48px);line-height:1.06;letter-spacing:-1.6px}
.travel-hero .hero-copy p{font-size:17px;line-height:1.4;margin-top:12px}
.hero-controls{position:absolute;left:0;right:0;bottom:62px;display:flex;align-items:center;justify-content:flex-end;gap:18px;color:white}
.hero-caption{font-size:10px;text-shadow:0 1px 4px #000;background:#07141c80;padding:5px 8px;border-radius:4px}
.hero-switcher{display:flex;align-items:center;background:#0b162b80;border:1px solid #ffffff4a;border-radius:24px;padding:0 4px;backdrop-filter:blur(8px)}
.hero-switcher button{width:44px;height:44px;border:0;background:transparent;display:grid;place-items:center;color:#fff;border-radius:50%;padding:0}
.hero-switcher button>span{width:7px;height:7px;border-radius:8px;border:1px solid white}
.hero-switcher button[aria-pressed=true]>span{width:19px;background:white}
.hero-switcher button:hover{background:#ffffff24}
.hero-switcher button:focus-visible{outline:2px solid white;outline-offset:-3px}
.service-nav{gap:12px}
.booking-selector{position:relative;flex:none}
.main-tabs{gap:8px;padding-inline:10px;display:grid;grid-template-columns:1fr 1fr}
.main-tabs button{min-width:170px;padding-inline:16px;white-space:nowrap;font-size:15px;gap:8px}
/* Matching concave cutouts let the 44px plus sit inside both tab edges. */
.main-tabs #flight-tab{--notch-x:calc(100% + 4px);padding-right:34px}
.main-tabs #ride-tab{--notch-x:-4px;--tab-outline:var(--travel-tab-outline);--tab-fill:#fff;padding-left:34px;border:1.5px solid var(--tab-outline);background:radial-gradient(circle at var(--notch-x) 50%,transparent 26px,var(--tab-outline) 27px,var(--tab-outline) 28px,transparent 29px) var(--tab-fill);background-origin:border-box}
.main-tabs #ride-tab[aria-selected=true]{--tab-outline:var(--brand-black);--tab-fill:var(--brand-black)}
.main-tabs [role=tab]{-webkit-mask-image:radial-gradient(circle at var(--notch-x) 50%,transparent 26px,#000 27px);mask-image:radial-gradient(circle at var(--notch-x) 50%,transparent 26px,#000 27px)}
.main-tabs button:focus-visible{outline:0;box-shadow:inset 0 0 0 3px var(--ring)}
.main-tabs button[aria-selected=true]:focus-visible{box-shadow:inset 0 0 0 3px var(--brand-platinum)}
#bundle-toggle{position:absolute;left:50%;bottom:3px;transform:translateX(-50%);display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid #c7b400;border-radius:50%;background:var(--brand-yellow);color:var(--brand-black);box-shadow:0 0 0 4px #fff,0 0 14px 3px var(--travel-plus-glow),0 2px 7px #1111111a;z-index:1}
#bundle-toggle .icon{width:22px;height:22px;stroke-width:2}
#bundle-toggle:hover{border-color:#a99a00;background:var(--brand-yellow);box-shadow:0 0 0 4px #fff,0 0 18px 4px var(--travel-plus-glow),0 2px 7px #1111111a}
#bundle-toggle[aria-pressed=true]{background:var(--brand-yellow);color:var(--brand-black);border-color:var(--brand-black);box-shadow:inset 0 0 0 1px var(--brand-black),0 0 0 4px #fff,0 0 18px 4px var(--travel-plus-glow)}
.booking-selector.is-combined #ride-tab{--tab-outline:var(--travel-tab-outline);--tab-fill:var(--membership-surface)}
.main-tabs .blackcab-wordmark{width:106px}
.secondary-services{gap:5px}
.secondary-services button{font-size:12px;padding-inline:6px;background:none}
.booking-card{border-radius:0 var(--travel-radius) var(--travel-radius) var(--travel-radius)}
.bundle-badge{margin-left:auto;display:flex;gap:6px;align-items:center;color:var(--travel-muted);font-size:11px}
.bundle-badge .icon{width:16px;height:16px}
.bundle-flight-row{grid-template-columns:minmax(0,1.15fr) minmax(0,1.3fr) minmax(0,.87fr) minmax(0,.87fr)}
.bundle-flight-row .field{border:1px solid #929292;border-radius:0}
.bundle-flight-row .field+.field{border-left:0}
.bundle-flight-row .field:after,.bundle-transfer-row .field:after{display:none}
.bundle-flight-row .field:first-child{border-radius:9px 0 0 9px}
.bundle-flight-row .field:last-child{border-radius:0 9px 9px 0}
.bundle-transfer-row{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1.3fr) minmax(190px,.9fr);gap:16px;align-items:center;margin-top:12px}
.bundle-transfer-row .field{border:1px solid #929292;border-radius:9px}
.bundle-transfer-row .search-button{margin:0;min-height:70px;font-size:14px;padding-inline:12px}
.bundle-timing{font-size:12px;line-height:1.6;color:var(--travel-muted);margin:0}
.bundle-timing strong{display:block;color:var(--ink);font-size:13px;margin-bottom:2px}
.bundle-note{font-size:11px;line-height:1.55;color:var(--travel-muted);margin:12px 0 0}

@media(min-width:761px) and (max-width:1150px){
  .service-nav{flex-wrap:wrap;gap:0;background:white;border-radius:14px 14px 0 0;padding-top:4px}
  .booking-selector{flex:1}
  .main-tabs{padding-top:5px}
  .main-tabs button{flex:1}
  .secondary-services{padding:0 12px;color:var(--ink);text-shadow:none;flex:1;justify-content:flex-end;gap:1px}
  .secondary-services button{color:var(--travel-muted);font-size:11px;padding-inline:4px}
  .secondary-services span{display:none}
  .booking-card{border-radius:0 0 var(--travel-radius) var(--travel-radius)}
  .bundle-flight-row{grid-template-columns:repeat(4,minmax(0,1fr))}
  .bundle-flight-row .field,.bundle-flight-row .field+.field{grid-column:span 1;border:1px solid #929292}
  .bundle-transfer-row{grid-template-columns:1.5fr 1fr}
  .bundle-transfer-row .field{grid-column:1;grid-row:1}
  .bundle-timing{grid-column:1;grid-row:2}
  .bundle-transfer-row .search-button{grid-column:2;grid-row:1}
}
@media(min-width:761px) and (max-width:1000px){
  .bundle-flight-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .booking-selector{flex-basis:100%}
  .secondary-services{justify-content:flex-start;padding-left:16px}
  .secondary-services button{font-size:12px;padding-inline:10px}
  .travel-hero{height:244px}
  .hero-controls{bottom:57px}
}
@media(max-width:760px){
  .service-nav{gap:0}
  .travel-hero{height:186px}
  .travel-hero .hero-copy{padding-top:14px;margin-inline:16px}
  .travel-hero .hero-copy h1{font-size:29px;letter-spacing:-.8px;line-height:1.04}
  .travel-hero .hero-copy p{font-size:13px;max-width:310px;margin-top:7px}
  .travel-hero .hero-image{object-position:65% center}
  .travel-hero .hero-image:last-child{object-position:65% 40%}
  .travel-hero .hero-shade{background:linear-gradient(90deg,#06131bda,#07141c88 65%,#07141c44)}
  .hero-controls{bottom:5px;justify-content:space-between;gap:5px}
  .hero-caption{font-size:8px;padding:4px 5px;max-width:calc(100% - 140px);line-height:1.4}
  .hero-switcher{padding:0}
  .booking-selector{width:100%}
  .main-tabs{gap:8px;padding:8px 8px 0}
  .main-tabs button{width:auto;min-width:0;min-height:48px;font-size:14px;padding:8px 4px;gap:6px}
  .main-tabs #flight-tab{padding-inline:10px 28px}
  .main-tabs #ride-tab{padding-inline:28px 10px}
  .main-tabs .icon{width:18px;height:18px}
  .main-tabs .blackcab-wordmark{width:100px;max-width:100%}
  #bundle-toggle{bottom:2px}
  .secondary-services{gap:0}
  .secondary-services button{font-size:10px;padding-inline:3px}
  .booking-card{border-radius:0 0 var(--travel-radius) var(--travel-radius)}
  .bundle-badge{display:none}
  .bundle-flight-row{grid-template-columns:1fr 1fr;gap:8px}
  .bundle-flight-row .field,.bundle-flight-row .field+.field{border:1px solid #929292;border-radius:8px}
  .bundle-flight-row .airport{grid-column:span 2}
  .bundle-flight-row .date{grid-column:span 1}
  .bundle-transfer-row{grid-template-columns:1fr;gap:8px;margin-top:8px}
  .bundle-transfer-row .search-button{min-height:52px;font-size:15px;grid-column:auto}
  .bundle-timing{font-size:11px;line-height:1.45;padding:2px 2px 4px}
  .bundle-timing strong{font-size:12px}
  .bundle-note{font-size:10px;margin-top:10px}
}
@media(max-width:380px){
  .main-tabs button{font-size:13px}
  .main-tabs .blackcab-wordmark{width:88px}
  .hero-caption{font-size:7px}
}
@media(max-width:760px) and (max-height:700px){
  .travel-hero{height:130px}
  .travel-hero .hero-copy{padding-top:8px}
  .travel-hero .hero-copy h1{font-size:24px}
  .travel-hero .hero-copy p{font-size:11px;line-height:1.3;margin-top:5px}
  .hero-controls{bottom:0}
  .main-tabs{padding-top:4px}
  .main-tabs button{min-height:44px}
  #bundle-toggle{bottom:0}
  .flight-options{margin-bottom:2px}
  .field{min-height:52px;padding-block:6px}
  .field-label{line-height:1.3}
  .search-row{gap:6px}
  .search-button{min-height:48px;padding-block:10px}
}
@media(prefers-reduced-motion:reduce){
  .travel-hero .hero-image{transition:none}
}