/* Search and booking interface: designed for provider APIs without exposing supplier credentials. */
/* Components set their own display values, but the semantic state must win. */
[hidden] { display:none !important; }

:root { --booking-yellow:#f6ca4b; --booking-green:#008b68; --booking-green-dark:#006e54; }

.site-header { height:104px; position:absolute; background:rgba(255,253,248,.98); color:#075180; border-bottom:1px solid rgba(9,21,34,.11); backdrop-filter:blur(14px); }
.site-header .brand-name > span { color:#0875a9; }
.site-header .brand-name b { color:#075180; }
.site-header .brand-mark { border-color:#0a78a8; color:#0a78a8; }
.desktop-nav { gap:28px; margin-left:62px; color:#075180; font-size:14px; }
.header-actions { gap:28px; color:#075180; font-size:14px; }
.site-header .text-button { color:#075180; }
.header-choice { position:relative; }
.dropdown-toggle { display:inline-flex; align-items:center; gap:7px; white-space:nowrap; }
.dropdown-toggle > span:last-child { font-size:13px; transform:translateY(-1px); }
.flag { font-size:17px; line-height:1; }
.header-popover { position:absolute; z-index:20; top:calc(100% + 13px); right:-12px; width:155px; padding:7px; border:1px solid var(--bone); border-radius:6px; background:var(--chalk); box-shadow:0 15px 30px rgba(9,21,34,.16); }
.header-popover button { display:block; width:100%; padding:9px 10px; border:0; border-radius:3px; background:transparent; color:var(--ink); text-align:left; cursor:pointer; font-size:12px; }
.header-popover button:hover { background:#f0eee8; }
.login-button { display:inline-flex; align-items:center; gap:8px; font-size:14px; }
.site-header .menu-button { border-color:rgba(9,21,34,.3); }
.site-header .menu-button span { background:var(--ink); }

.hero { min-height:875px; padding-top:104px; }
.hero-image { object-position:center; }
.hero-wash { background:linear-gradient(90deg,rgba(4,19,34,.91) 0%,rgba(4,19,34,.7) 38%,rgba(4,19,34,.14) 75%),linear-gradient(0deg,rgba(4,13,24,.82),rgba(4,13,24,.03) 58%); }
.hero-search-kicker { position:absolute; z-index:2; top:124px; left:50%; transform:translateX(-50%); }
.hero-search-kicker .eyebrow { margin:0; color:rgba(255,255,255,.72); }
.hero-search-kicker .eyebrow span { background:var(--booking-yellow); }
.hero-content { position:absolute; z-index:1; top:607px; left:50%; transform:translateX(-50%); padding:0; }
.hero h1 { max-width:680px; margin-bottom:12px; font-size:clamp(42px,4.5vw,66px); }
.hero h1 em { color:var(--booking-yellow); }
.hero-intro { max-width:570px; margin-bottom:0; font-size:16px; }

.booking-panel { top:151px; bottom:auto; width:min(1220px,calc(100% - 80px)); padding:0 20px 13px; border:1px solid rgba(255,255,255,.88); border-radius:12px; background:var(--booking-yellow); box-shadow:0 28px 64px rgba(0,0,0,.31); backdrop-filter:blur(14px); }
.booking-tabs { height:55px; gap:6px; }
.booking-tab { height:45px; color:#61522c; padding:0 14px 11px; font-weight:700; }
.booking-tab.is-active { color:var(--ink); }
.booking-tab.is-active:after { height:3px; background:#0874a7; }
.tab-icon { color:#0874a7; }
.search-form { display:block; min-height:0; overflow:visible; background:transparent; }
.booking-mode-line { display:flex; align-items:center; gap:8px; min-height:42px; color:var(--ink); }
.booking-mode-line strong { font-size:14px; }
.flight-icon { font-size:22px; line-height:1; color:#075180; }
.flight-toggle { padding:0; border:0; border-bottom:1px solid currentColor; background:none; color:#075180; cursor:pointer; font-weight:700; font-size:14px; line-height:1.25; }
.flight-toggle:hover { color:var(--booking-green-dark); }
.flight-search { display:flex; align-items:center; gap:18px; margin:0 0 10px; padding:10px 13px; border:1px dashed rgba(9,21,34,.31); border-radius:6px; background:rgba(255,253,248,.35); }
.flight-search[hidden] { display:none; }
.flight-number { display:flex; align-items:center; gap:10px; min-width:310px; }
.flight-number span { color:#566270; font-size:10px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.flight-number input { flex:1; min-width:0; padding:5px 0; border:0; border-bottom:1px solid rgba(9,21,34,.24); outline:0; background:transparent; color:var(--ink); font-weight:600; }
.flight-search p { margin:0; color:#4e5965; font-size:11px; }
.form-location { width:100%; min-height:84px; margin:0; padding:13px 18px; border:1px solid rgba(9,21,34,.18); border-radius:6px; background:var(--chalk); }
.form-location + .field-dropoff:not([hidden]) { margin-top:10px; }
.field-dropoff[hidden] { display:none; }
.field span { margin-bottom:4px; color:#697889; font-size:10px; }
.field input,.field select { color:#192233; font-size:17px; }
.form-location input { font-size:20px; }
.return-toggle { display:inline-flex; align-items:center; gap:9px; min-height:42px; cursor:pointer; color:#273142; font-size:14px; font-weight:600; }
.return-toggle input { width:20px; height:20px; margin:0; accent-color:#0874a7; }
.booking-time-grid { display:grid; grid-template-columns:1.42fr .92fr 1.42fr .92fr; overflow:hidden; border:1px solid rgba(9,21,34,.18); border-radius:6px; background:var(--chalk); }
.booking-time-grid .field { min-height:78px; padding:12px 18px; border-right:1px solid var(--bone); }
.booking-time-grid .field:last-child { border-right:0; }
.booking-time-grid input { min-height:27px; }
.booking-bottom-row { display:flex; align-items:center; justify-content:space-between; gap:22px; min-height:72px; }
.booking-qualifiers { display:flex; align-items:center; flex-wrap:wrap; gap:8px 22px; }
.compact-choice { display:flex; align-items:center; gap:7px; color:#263142; font-size:13px; }
.compact-choice span { color:#263142; }
.compact-choice select { max-width:145px; padding:0 20px 0 0; border:0; border-bottom:1px solid rgba(9,21,34,.35); outline:0; appearance:auto; background:transparent; color:#075180; cursor:pointer; font-weight:700; }
.search-button { min-width:166px; height:51px; padding:0 20px; border-radius:28px; background:var(--booking-green); color:white; box-shadow:none; }
.search-button:hover { background:var(--booking-green-dark); transform:translateY(-1px); }
.search-button .arrow { margin-left:10px; }
.panel-note { margin:1px 1px 0; color:#5c512f; font-size:10px; }
.panel-note .availability-dot { background:var(--booking-green); box-shadow:0 0 0 3px rgba(0,139,104,.12); }
.concierge-form { min-height:138px; border-radius:6px; }
.concierge-reply { border-radius:6px; }

.promise-strip { background:#fffdf8; }
.promise-grid { max-width:1220px; }
.promise-grid p { min-height:67px; padding:20px 25px; color:#344151; }
.serial { color:#0874a7; }

/* Supplier-response surface retained for the real search endpoint. */
.search-results { min-height:220px; margin-bottom:46px; }
.results-state { min-height:220px; display:flex; flex-direction:column; justify-content:center; padding:36px 42px; border:1px solid var(--line); background:linear-gradient(120deg,#fdfbf5 0%,#f2eee6 100%); }
.results-state[data-state="loading"] { background:linear-gradient(110deg,#fdfbf5 25%,#f4eee2 40%,#fdfbf5 55%); background-size:220% 100%; animation:inventory-scan 1.8s linear infinite; }
.results-state[data-state="error"] { border-color:rgba(255,110,74,.35); }
.results-kicker { margin-bottom:13px; color:var(--signal); font-family:var(--mono); font-size:10px; letter-spacing:.09em; }
.results-state h3 { max-width:600px; margin:0 0 8px; font-size:28px; letter-spacing:-.045em; }
.results-state p { max-width:600px; margin:0; color:#55616d; font-size:13px; line-height:1.55; }
.comparison-intro { display:flex; align-items:center; gap:10px; margin-bottom:16px; }
.comparison-intro span { width:21px; height:1px; background:var(--signal); }
.comparison-intro p { margin:0; color:#6a737c; font-family:var(--mono); font-size:10px; letter-spacing:.04em; text-transform:uppercase; }
.api-offer-cards { margin-bottom:0; }
.api-offer-card .vehicle-visual { height:155px; margin:13px 0 12px; overflow:hidden; background:#dfe5e4; }
.vehicle-visual img { width:100%; height:100%; object-fit:contain; mix-blend-mode:multiply; }
.vehicle-visual--fallback { position:relative; background:linear-gradient(145deg,#e8ece8,#c6d0cf); }
.vehicle-visual--fallback:before { content:""; position:absolute; left:13%; right:8%; bottom:26px; height:48px; border-radius:42% 45% 15% 11% / 68% 79% 20% 22%; background:#263646; box-shadow:0 4px 0 #152330; }
.vehicle-visual--fallback:after { content:""; position:absolute; left:29%; width:44%; bottom:55px; height:30px; transform:skew(-24deg); border-radius:21% 43% 0 0; background:linear-gradient(110deg,#7eabbf,#d7e3e6 45%,#7194a6 46%); }
@keyframes inventory-scan { to { background-position:-220% 0; } }

@media (max-width:1180px) {
  .site-header { padding:0 32px; }
  .desktop-nav { gap:19px; margin-left:38px; }
  .header-actions { gap:16px; }
  .booking-panel { width:calc(100% - 48px); }
  .booking-bottom-row { align-items:flex-end; }
  .booking-qualifiers { gap:8px 14px; }
}
@media (max-width:900px) {
  .site-header { height:72px; padding:0 20px; }
  .desktop-nav,.header-actions .header-choice,.header-actions .help,.header-actions .booking,.header-actions .login-button { display:none; }
  .menu-button { display:block; }
  .mobile-nav.is-open { top:62px; right:16px; z-index:25; width:235px; border:1px solid rgba(255,255,255,.2); background:var(--ink); color:var(--chalk); }
  .hero { display:block; min-height:0; padding:96px 0 54px; }
  .hero-search-kicker { position:relative; top:auto; left:auto; transform:none; width:min(100% - 40px,690px); margin:0 auto 10px; }
  .hero-content { position:relative; top:auto; left:auto; transform:none; width:min(100% - 40px,690px); margin:42px auto 0; }
  .hero h1 { font-size:clamp(40px,8vw,56px); }
  .booking-panel { position:relative; top:auto; bottom:auto; left:auto; transform:none; width:calc(100% - 40px); margin:0 auto; }
  .booking-time-grid { grid-template-columns:1.42fr .92fr; }
  .booking-time-grid .field:nth-child(2) { border-right:0; }
  .booking-time-grid .field:nth-child(-n+2) { border-bottom:1px solid var(--bone); }
  .booking-bottom-row { align-items:stretch; flex-direction:column; padding:12px 0 1px; }
  .booking-qualifiers { justify-content:space-between; }
  .search-button { width:100%; min-height:56px; }
  .promise-grid p { padding:16px 12px; font-size:10px; }
}
@media (max-width:560px) {
  .hero { padding-top:84px; }
  .hero-search-kicker,.hero-content { width:calc(100% - 28px); }
  .hero-content { margin-top:32px; }
  .hero h1 { font-size:39px; }
  .hero-intro { font-size:14px; }
  .hero-proof { gap:7px; }
  .booking-panel { width:calc(100% - 28px); padding:0 11px 10px; border-radius:9px; }
  .booking-tabs { height:47px; }
  .booking-tab { padding-left:7px; padding-right:7px; font-size:12px; }
  .booking-mode-line { min-height:38px; gap:6px; }
  .booking-mode-line strong,.flight-toggle { font-size:12px; }
  .flight-icon { font-size:18px; }
  .flight-search { align-items:stretch; flex-direction:column; gap:7px; }
  .flight-number { min-width:0; }
  .form-location { min-height:76px; padding:11px 13px; }
  .form-location input { font-size:15px; }
  .return-toggle { min-height:39px; font-size:12px; }
  .return-toggle input { width:18px; height:18px; }
  .booking-time-grid .field { min-height:69px; padding:10px 12px; }
  .booking-time-grid input { font-size:13px; }
  .booking-qualifiers { display:grid; grid-template-columns:1fr 1fr; gap:11px; }
  .compact-choice { display:block; }
  .compact-choice span { display:block; margin-bottom:2px; font-size:10px; }
  .compact-choice select { width:100%; max-width:none; font-size:12px; }
  .car-choice { grid-column:span 2; }
  .panel-note { margin-top:3px; font-size:9px; }
  .concierge-form { min-height:120px; }
  .results-state { min-height:245px; padding:28px 23px; }
  .results-state h3 { font-size:24px; }
  .comparison-intro { align-items:flex-start; }
}
