/* ═══════════════════════════════════════════════════════════════════════════
   Awestruck — Mobile + Tablet (≤991.98px) overrides for details page
   Applies to ALL non-desktop viewports. Desktop is untouched.

   Sections (matches the user's batch list):
     2  Hero / image card  → bigger gradient "Drive F1" headline
     4  Section tabs       → bigger, bolder
     5  Booking form       → modern, ticks per field, nicer time-slot popup
     6  Trust strip        → slow marquee
     7  Similar rail       → subtle attention border
     8  Discover more rail → subtle attention border
     9  Contact us         → order BEFORE partner; white fields & borders
    10  App-download AD    → new modern card
    11  Partner form       → white fields & borders, nice category dropdown
    12  Footer             → tightened mobile layout
   ═══════════════════════════════════════════════════════════════════════════ */

/* Brand tokens (alias only — kept local to this file) */
:root {
  --awd-yellow:    #FEB602;
  --awd-yellow-lt: #FFD96B;
  --awd-blue:      #383BF1;
  --awd-ink:       #0F0D0B;
  --awd-paper:     #FFFFFF;
  --awd-night-bg:  #0A0908;
  --awd-night-surf:#171513;
}

/* Hide the App AD section on desktop — only revealed at ≤991.98px below */
.awd-app-cta { display: none; }

@media (max-width: 991.98px) {

/* ───────────────────────── 2 · Hero / Drive F1 headline ──────────────────── */
.hero-title {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.035em !important;
  line-height: 1.02 !important;
  text-wrap: balance;
  text-align: left !important;
  margin: 0 !important;
  font-size: clamp(36px, 9vw, 56px) !important;
  background: linear-gradient(110deg, var(--awd-yellow) 0%, #FFE08A 25%, var(--awd-yellow) 50%, #FFE08A 75%, var(--awd-yellow) 100%);
  background-size: 250% 100%;
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
  animation: awd-hero-sweep 7s linear infinite,
             awd-hero-pop  900ms cubic-bezier(.2,.9,.25,1.1) both;
}
/* 1 · Provider name (Awestruck) — black on light, white on dark. NO gradient. */
.provider-name {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.03em !important;
  line-height: 1.05 !important;
  text-align: left !important;
  margin-left: 10px !important;
  font-size: clamp(28px, 7vw, 40px) !important;
  color: var(--awd-ink) !important;
  background: none !important;
  -webkit-text-fill-color: currentColor !important;
  animation: none !important;
}
[data-bs-theme="dark"] .provider-name { color: #ffffff !important; }

/* 4 · Share icon — inline SVG fallback so it always shows, plus lift on hover */
.hero-share {
  position: relative;
  width: 44px; height: 44px;
  display: inline-flex; align-items: center; justify-content: center;
  background: rgba(15,13,11,0.55);
  border-radius: 999px;
  color: #fff;
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  transition: transform 220ms cubic-bezier(.2,.8,.2,1);
}
.hero-share > i { position: relative; z-index: 1; color: #fff; font-size: 18px; line-height: 1; }
.hero-share::before {
  content: "";
  position: absolute; inset: 0;
  background: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='18' cy='5' r='3'/%3E%3Ccircle cx='6' cy='12' r='3'/%3E%3Ccircle cx='18' cy='19' r='3'/%3E%3Cline x1='8.59' y1='13.51' x2='15.42' y2='17.49'/%3E%3Cline x1='15.41' y1='6.51' x2='8.59' y2='10.49'/%3E%3C/svg%3E") center / 18px 18px no-repeat;
  pointer-events: none; z-index: 0;
}
.hero-share:hover { transform: translateY(-2px) scale(1.04); }

/* ───────────────────────── 4 · Section tabs (What's Included etc) ─────────── */
.aw-tabs, .aw-tab {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif !important;
}
.aw-tab {
  font-size: 17px !important;
  font-weight: 700 !important;
  letter-spacing: -0.015em !important;
  padding: 14px 8px !important;
  line-height: 1.1 !important;
  position: relative;
}
.aw-tab[aria-selected="true"],
.aw-tab.active {
  color: var(--awd-ink) !important;
  font-weight: 800 !important;
}
.aw-tab[aria-selected="true"]::after,
.aw-tab.active::after {
  content: ""; position: absolute; left: 8px; right: 8px; bottom: -2px;
  height: 3px; border-radius: 2px;
  background: var(--awd-yellow);
  animation: awd-tab-rule 320ms cubic-bezier(.2,.8,.2,1) both;
}
@keyframes awd-tab-rule {
  from { transform: scaleX(0); transform-origin: left; }
  to   { transform: scaleX(1); transform-origin: left; }
}

/* ───────────────────────── 5 · Booking form modernization ─────────────────── */
.booking-card {
  background: var(--awd-paper);
  border-radius: 20px !important;
  padding: 22px !important;
  border: 1px solid rgba(15,13,11,0.06);
  box-shadow:
    0 1px 0 rgba(255,255,255,0.6) inset,
    0 24px 60px -28px rgba(15,13,11,0.15);
}
/* 9 · Mobile booking heading → "Book Now" (bigger, bolder) */
.booking-card h2 {
  visibility: hidden;
  position: relative;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif !important;
  font-weight: 900 !important;
  font-size: 34px !important;
  letter-spacing: -0.03em !important;
  line-height: 1 !important;
  height: 34px;
  margin: 0 0 22px !important;
  overflow: visible;
}
.booking-card h2::before {
  content: "Book Now";
  visibility: visible;
  position: absolute; inset: 0;
  background: #FFD153;
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}

[data-bs-theme="dark"] .booking-card h2::before{

  color:#FFD153 !important;
}

.aw-field {
  position: relative;
  background: #FAF8F3;
  border-radius: 14px;
  padding: 10px 14px;
  border: 1.5px solid var(--awd-ink);
  transition: border-color 200ms ease, box-shadow 200ms ease, transform 200ms ease;
}
.aw-field label {
  display: block;
  font-family: 'Space Grotesk', system-ui, sans-serif !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: rgba(15,13,11,0.55) !important;
  margin-bottom: 2px !important;
}
.aw-field input,
.aw-field select,
.aw-field textarea {
  background: transparent !important;
  border: 0 !important;
  outline: none !important;
  padding: 0 !important;
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--awd-ink) !important;
  width: 100% !important;
}
.aw-field:focus-within {
  border-color: var(--awd-blue);
  box-shadow: 0 0 0 4px rgba(56,59,241,0.10);
}
.aw-field.is-valid {
  border-color: rgba(43,194,106,0.55);
  background: linear-gradient(180deg, rgba(43,194,106,0.04), #FAF8F3);
}
/* 2 · NO green tick on the People (qty) field */
.aw-field:has(#bookingNumberOfPeopleDetailPage)::after { display: none !important; }
.aw-field.is-valid::after {
  content: ""; position: absolute; top: 50%; right: 14px;
  width: 22px; height: 22px; transform: translateY(-50%) scale(0);
  background: #2BC26A url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
  border-radius: 999px;
  animation: awd-tick-pop 320ms cubic-bezier(.2,.9,.25,1.2) forwards;
  pointer-events: none;
}
@keyframes awd-tick-pop {
  0%   { transform: translateY(-50%) scale(0)   rotate(-30deg); }
  60%  { transform: translateY(-50%) scale(1.18) rotate(8deg); }
  100% { transform: translateY(-50%) scale(1)   rotate(0); }
}

/* Qty stepper polish */
.qty-control {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px; border-radius: 999px;
  background: #fff; border: 1px solid rgba(15,13,11,0.10);
}
.qty-control button {
  width: 32px; height: 32px; border: 0; border-radius: 999px;
  background: var(--awd-yellow); color: var(--awd-ink);
  font-size: 18px; font-weight: 800; line-height: 1; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  transition: transform 140ms cubic-bezier(.2,.8,.2,1);
}
.qty-control button:hover  { transform: translateY(-1px); }
.qty-control button:active { transform: scale(0.92); }

/* Time-slot popup polish (the niceselect dropdown) */
.aw-field .niceselect,
.aw-field .nice-select {
  background: transparent !important;
  border: 0 !important;
  padding-left: 0 !important;
  padding-right: 18px !important;
  height: auto !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--awd-ink) !important;
}
.aw-field .niceselect::after,
.aw-field .nice-select::after {
  border-color: var(--awd-ink) !important;
}
.nice-select .list,
.aw-field .niceselect .list {
  margin-top: 6px !important;
  border: 1px solid rgba(15,13,11,0.08) !important;
  border-radius: 14px !important;
  padding: 6px !important;
  box-shadow: 0 28px 70px -28px rgba(15,13,11,0.35) !important;
  background: #fff !important;
  overflow: hidden !important;
}
.nice-select .option,
.aw-field .niceselect .option {
  border-radius: 10px !important;
  padding: 10px 12px !important;
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--awd-ink) !important;
  margin-bottom: 2px;
  transition: background 160ms ease;
}
.nice-select .option:hover,
.nice-select .option.focus,
.nice-select .option.selected.focus {
  background: rgba(254,182,2,0.18) !important;
  color: var(--awd-ink) !important;
}
.nice-select .option.selected {
  background: var(--awd-yellow) !important;
  color: var(--awd-ink) !important;
}

/* Checkout button */
.aw-checkout {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  width: 100%;
  height: 56px;
  padding: 0 22px;
  background: linear-gradient(105deg, var(--awd-blue) 0%, #5B5EFF 50%, var(--awd-blue) 100%);
  background-size: 200% 100%;
  color: #fff;
  border: 0;
  border-radius: 16px;
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-weight: 800 !important;
  font-size: 15px !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  cursor: pointer;
  box-shadow:
    0 14px 36px -12px rgba(56,59,241,0.55),
    inset 0 1px 0 rgba(255,255,255,0.22);
  transition: transform 140ms cubic-bezier(.2,.8,.2,1),
              box-shadow 240ms ease,
              background-position 600ms ease;
}
.aw-checkout:hover {
  transform: translateY(-2px);
  background-position: 100% 0;
  box-shadow: 0 18px 44px -14px rgba(56,59,241,0.7);
}
.aw-checkout:active { transform: translateY(1px) scale(0.99); }
.aw-checkout .tick {
  width: 22px; height: 22px; border-radius: 999px;
  background: var(--awd-yellow); color: var(--awd-ink);
  display: inline-flex; align-items: center; justify-content: center;
  font-weight: 900; font-size: 12px; line-height: 1;
}
.aw-checkout.is-shake { animation: awd-shake 480ms cubic-bezier(.36,.07,.19,.97); }
@keyframes awd-shake {
  10%, 90% { transform: translateX(-1px); }
  20%, 80% { transform: translateX(2px); }
  30%, 50%, 70% { transform: translateX(-4px); }
  40%, 60% { transform: translateX(4px); }
}

/* ───────────────────────── 6 · Trust strip marquee ─────────────────────────── */
.trust-strip {
  position: relative;
  overflow: hidden;
  mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%);
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%);
  display: block !important;
  width: 100% !important;
  padding: 14px 0 !important;
}
.trust-strip-track {
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  width: max-content !important;
  min-width: 100%;
  gap: 28px !important;
  will-change: transform;
  animation: awd-trust-marquee 28s linear infinite;
}
.trust-strip-track > .trust-item {
  flex: 0 0 auto !important;
  margin-right: 28px !important;
}
.trust-strip-track:hover { animation-play-state: paused; }
@keyframes awd-trust-marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* ───────────────────────── 7 + 8 · Rail attention sweep ────────────────────── */
.rail-section { position: relative; }
.rail-section::before {
  content: ""; position: absolute; inset: -1px;
  border-radius: 22px;
  padding: 1px;
  background: linear-gradient(110deg,
    transparent 0%, transparent 45%,
    rgba(254,182,2,0.45) 50%, rgba(254,182,2,0.05) 55%,
    transparent 60%, transparent 100%);
  background-size: 200% 100%;
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  pointer-events: none;
  animation: awd-rail-sweep 6s linear infinite;
  opacity: 0.7;
}
@keyframes awd-rail-sweep { to { background-position: -200% 0; } }
.rail-section .rail-head h2 {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif !important;
  font-weight: 800 !important;
  font-size: 22px !important;
  letter-spacing: -0.02em !important;
  margin: 0 !important;
}

/* ───────────────────────── 9 + 11 · Contact + Partner forms ─────────────────
   Re-order so Contact comes FIRST on mobile/tablet, fields all dark with
   white text + white border (per brief), nicer category dropdown.       */
.reach-section {
  display: flex !important;
  flex-direction: column !important;
  gap: 20px !important;
}
.reach-section .contact-form { order: 0 !important; }
.reach-section .partner-form { order: 1 !important; }

/* Dark card treatment for BOTH forms */
.reach-section .contact-form,
.reach-section .partner-form {
  background: var(--awd-ink) !important;
  color: #fff !important;
  border-radius: 22px !important;
  padding: 26px 22px !important;
  border: 1px solid rgba(255,255,255,0.06) !important;
  position: relative;
  overflow: hidden;
}
.reach-section .contact-form::before,
.reach-section .partner-form::before {
  content: ""; position: absolute; top: -60px; right: -60px;
  width: 220px; height: 220px; border-radius: 50%;
  background: radial-gradient(circle, rgba(254,182,2,0.20), rgba(0,0,0,0) 70%);
  filter: blur(20px); pointer-events: none;
}
.reach-section .contact-form h2,
.reach-section .partner-form h2 {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif !important;
  font-weight: 800 !important;
  color: #fff !important;
  font-size: 26px !important;
  letter-spacing: -0.025em !important;
  margin: 0 0 6px !important;
  position: relative;
}
.reach-section .contact-form p,
.reach-section .partner-form p {
  color: rgba(255,255,255,0.65) !important;
  font-size: 14px !important;
  margin: 0 0 18px !important;
  position: relative;
}

/* All input/textarea/select fields inside both forms */
.reach-section .contact-form input,
.reach-section .contact-form textarea,
.reach-section .partner-form input,
.reach-section .partner-form select,
.reach-section .partner-form textarea {
  background: transparent !important;
  color: #fff !important;
  border: 1.5px solid rgba(255,255,255,0.55) !important;
  border-radius: 12px !important;
  padding: 14px 16px !important;
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  outline: none !important;
  width: 100% !important;
  margin-bottom: 10px !important;
  transition: border-color 200ms ease, box-shadow 200ms ease, transform 140ms ease;
}
.reach-section .contact-form input::placeholder,
.reach-section .contact-form textarea::placeholder,
.reach-section .partner-form input::placeholder,
.reach-section .partner-form textarea::placeholder {
  color: rgba(255,255,255,0.55) !important;
}
.reach-section .contact-form input:focus,
.reach-section .contact-form textarea:focus,
.reach-section .partner-form input:focus,
.reach-section .partner-form select:focus,
.reach-section .partner-form textarea:focus {
  border-color: #fff !important;
  box-shadow: 0 0 0 4px rgba(254,182,2,0.20) !important;
  transform: translateY(-1px);
}

/* Category dropdown — custom chevron and dark popup */
.reach-section .partner-form select {
  appearance: none; -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round'%3E%3Cpolyline points='2 4 6 8 10 4'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 18px center !important;
  background-size: 12px !important;
  padding-right: 44px !important;
}
.reach-section .partner-form select option {
  background: var(--awd-night-surf);
  color: #fff;
  padding: 12px;
}

/* Captcha row + Submit buttons in the dark cards */
.reach-section .captcha-row {
  display: flex; align-items: center; gap: 12px;
  background: rgba(255,255,255,0.04);
  border: 1.5px solid rgba(255,255,255,0.18);
  border-radius: 12px;
  padding: 10px 14px;
  margin-bottom: 12px;
}
.reach-section .captcha-row .captcha-q {
  font-family: 'Space Grotesk', system-ui, sans-serif !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  color: #fff !important;
  letter-spacing: 0.04em;
  height: 50px;
}
.reach-section .captcha-row input {
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  padding: 4px 8px !important;
  width: auto !important;
  max-width: 80px;
}
.reach-section .contact-form button[type="submit"],
.reach-section .partner-form button[type="submit"] {
  background: var(--awd-yellow) !important;
  color: var(--awd-ink) !important;
  border: 0 !important;
  border-radius: 14px !important;
  padding: 14px 22px !important;
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-weight: 800 !important;
  font-size: 14px !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  width: 100% !important;
  display: inline-flex !important;
  align-items: center; justify-content: center; gap: 10px;
  cursor: pointer;
  box-shadow: 0 12px 30px -12px rgba(254,182,2,0.55), inset 0 1px 0 rgba(255,255,255,0.45);
  transition: transform 140ms cubic-bezier(.2,.8,.2,1), box-shadow 240ms ease;
}
.reach-section .contact-form button[type="submit"]:hover,
.reach-section .partner-form button[type="submit"]:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 40px -14px rgba(254,182,2,0.75), inset 0 1px 0 rgba(255,255,255,0.55);
}
.reach-section .contact-form button[type="submit"] .arrow,
.reach-section .partner-form button[type="submit"] .arrow {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; border-radius: 999px;
  background: var(--awd-ink); color: var(--awd-yellow);
  font-size: 12px; font-weight: 900;
}

/* Perk chips (Partner) */
.partner-form .perks {
  display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px;
  position: relative;
}
.partner-form .perks span {
  display: inline-flex; align-items: center;
  padding: 6px 12px;
  background: rgba(255,255,255,0.08) !important;
  border: 1px solid rgba(255,255,255,0.20);
  border-radius: 999px;
  color: rgba(255,255,255,0.85) !important;
  font-family: 'Space Grotesk', system-ui, sans-serif !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

/* Thank-you panel */
.contact-thanks, .partner-thanks {
  display: flex; flex-direction: column; align-items: center;
  text-align: center; padding: 30px 16px; gap: 6px;
  position: relative;
}
.contact-thanks .thanks-icon, .partner-thanks .thanks-icon {
  width: 56px; height: 56px;
  border-radius: 999px;
  background: var(--awd-yellow);
  color: var(--awd-ink);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 28px; font-weight: 900;
  margin-bottom: 10px;
  animation: awd-thanks-pop 480ms cubic-bezier(.2,.9,.25,1.2) both;
  box-shadow: 0 12px 30px -12px rgba(254,182,2,0.6);
}
.contact-thanks h4, .partner-thanks h4 {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif !important;
  font-weight: 800 !important; color: #fff !important;
  font-size: 22px !important; margin: 0 !important;
  letter-spacing: -0.02em;
}
.contact-thanks p, .partner-thanks p {
  color: rgba(255,255,255,0.65) !important;
  font-size: 14px !important; margin: 0 !important;
}
@keyframes awd-thanks-pop {
  0%   { transform: scale(0)   rotate(-30deg); }
  60%  { transform: scale(1.2) rotate(8deg); }
  100% { transform: scale(1)   rotate(0); }
}

/* ───────────────────────── 10 · App download AD ────────────────────────────── */
.awd-app-cta {
  display: block;
  margin: 16px 0;
  background: linear-gradient(135deg, var(--awd-ink) 0%, #1F1C2E 100%);
  border-radius: 22px;
  padding: 28px 22px;
  color: #fff;
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.08);
}

/* .awd-app-cta::before {
  content: ""; position: absolute; top: -80px; right: -80px;
  width: 280px; height: 280px; border-radius: 50%;
  background: radial-gradient(circle, rgba(254,182,2,0.25), rgba(0,0,0,0) 70%);
  filter: blur(28px);
  animation: awd-cta-blob 9s ease-in-out infinite;
}
.awd-app-cta::after {
  content: ""; position: absolute; bottom: -80px; left: -80px;
  width: 240px; height: 240px; border-radius: 50%;
  background: radial-gradient(circle, rgba(56,59,241,0.32), rgba(0,0,0,0) 70%);
  filter: blur(28px);
  animation: awd-cta-blob 11s ease-in-out infinite reverse;
} */

@keyframes awd-cta-blob {
  0%, 100% { transform: translate(0,0)   scale(1); }
  50%      { transform: translate(20px,12px) scale(1.08); }
}
.awd-app-cta__head { position: relative; }
.awd-app-cta__eyebrow {
  font-family: 'Space Grotesk', system-ui, sans-serif;
  font-size: 11px; font-weight: 600;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--awd-yellow); margin: 0 0 6px;
}
.awd-app-cta__title {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800; font-size: 28px;
  letter-spacing: -0.025em; line-height: 1.05;
  margin: 0 0 6px; color: #fff;
}
.awd-app-cta__title em {
  font-style: italic;
  background: linear-gradient(90deg, var(--awd-yellow), #FFE08A);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
.awd-app-cta__sub {
  font-size: 14px; line-height: 1.5;
  color: rgba(255,255,255,0.65); margin: 0 0 18px;
}
.awd-app-cta__buttons {
  display: flex; gap: 10px; flex-wrap: wrap; position: relative;
}
.awd-app-cta__btn {
  flex: 1 1 0; min-width: 140px;
  display: inline-flex; align-items: center; gap: 10px;
  background: #fff; color: var(--awd-ink);
  padding: 10px 14px;
  border-radius: 14px;
  text-decoration: none;
  border: 1px solid rgba(255,255,255,0.4);
  transition: transform 180ms cubic-bezier(.2,.8,.2,1);
}
.awd-app-cta__btn:hover { transform: translateY(-2px); }
.awd-app-cta__btn svg { flex-shrink: 0; }
.awd-app-cta__btn span { display: flex; flex-direction: column; line-height: 1.1; }
.awd-app-cta__btn small {
  font-family: 'Space Grotesk', system-ui, sans-serif;
  font-size: 9px; font-weight: 600;
  letter-spacing: 0.10em; text-transform: uppercase;
  color: rgba(15,13,11,0.6);
}
.awd-app-cta__btn strong {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 14px; font-weight: 700; letter-spacing: -0.01em;
}

/* ───────────────────────── 12 · Footer (mobile tightening) ─────────────────── */
.aw-footer { padding: 28px 20px !important; }
.aw-footer .footer-row {
  display: flex !important; flex-direction: column !important;
  gap: 18px !important; align-items: flex-start !important;
}
.aw-footer .footer-brand img { height: 36px !important; width: auto !important; }
.aw-footer .footer-nav {
  display: flex !important; flex-wrap: wrap !important; gap: 14px 18px !important;
}
.aw-footer .footer-nav a {
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  color: rgba(255,255,255,0.7) !important;
  text-decoration: none !important;
  transition: color 200ms ease;
}
.aw-footer .footer-nav a:hover { color: var(--awd-yellow) !important; }
.aw-footer .footer-copy {
  font-family: 'Space Grotesk', system-ui, sans-serif !important;
  font-size: 11px !important;
  letter-spacing: 0.10em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,0.45) !important;
  margin-top: 18px !important;
}


/* ───────────────────────── 1 · Dark mode coverage (mobile + tablet) ───────── */
[data-bs-theme="dark"] .booking-card {
  background: #14110F !important;
  border-color: rgba(255,255,255,0.10) !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,0.06) inset,
    0 24px 60px -28px rgba(0,0,0,0.6) !important;
}
[data-bs-theme="dark"] .booking-card h2 {
  /* gradient was ink→blue; force a bright variant for dark */
  background: linear-gradient(95deg, #FFFFFF 0%, #8A8DFF 100%) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
  -webkit-text-fill-color: transparent !important; color: transparent !important;
}
[data-bs-theme="dark"] .aw-field {
  background: #1F1C1A !important;
  border-color: #FFFFFF !important;
  color: #FFFFFF !important;
}
[data-bs-theme="dark"] .aw-field label { color: rgba(255,255,255,0.65) !important; }
[data-bs-theme="dark"] .aw-field input,
[data-bs-theme="dark"] .aw-field select,
[data-bs-theme="dark"] .aw-field textarea,
[data-bs-theme="dark"] .aw-field .qty-text {
  color: #FFFFFF !important;
  caret-color: var(--awd-yellow) !important;
}
[data-bs-theme="dark"] .aw-field input::placeholder,
[data-bs-theme="dark"] .aw-field textarea::placeholder {
  color: rgba(255,255,255,0.45) !important;
}
[data-bs-theme="dark"] .qty-control {
  background: #14110F !important;
  border-color: rgba(255,255,255,0.20) !important;
}
/* Nice-select popup in dark */
[data-bs-theme="dark"] .nice-select .list,
[data-bs-theme="dark"] .aw-field .niceselect .list {
  background: #1F1C1A !important;
  border-color: rgba(255,255,255,0.10) !important;
  box-shadow: 0 28px 70px -28px rgba(0,0,0,0.7) !important;
}
[data-bs-theme="dark"] .nice-select .option,
[data-bs-theme="dark"] .aw-field .niceselect .option {
  color: #FFFFFF !important;
}
[data-bs-theme="dark"] .nice-select .option:hover,
[data-bs-theme="dark"] .nice-select .option.focus,
[data-bs-theme="dark"] .nice-select .option.selected.focus {
  background: rgba(254,182,2,0.18) !important;
  color: #FFFFFF !important;
}
[data-bs-theme="dark"] .nice-select .option.selected {
  background: var(--awd-yellow) !important;
  color: var(--awd-ink) !important;
}
[data-bs-theme="dark"] .aw-field .niceselect::after,
[data-bs-theme="dark"] .aw-field .nice-select::after {
  border-color: #FFFFFF !important;
}

/* Rail headings in dark */
[data-bs-theme="dark"] .rail-section .rail-head h2 { color: #FFFFFF !important; }
[data-bs-theme="dark"] .rail-section .rail-head .sub { color: rgba(255,255,255,0.65) !important; }

/* Service provider label / duration row in dark */
[data-bs-theme="dark"] .provider-label { color: rgba(255,255,255,0.65) !important; }
/* [data-bs-theme="dark"] .duration { color: rgba(255,255,255,0.85) !important; } */
[data-bs-theme="dark"] .duration b { color: #8A8DFF !important; }

/* Tabs in dark */
[data-bs-theme="dark"] .aw-tab { color: rgba(255,255,255,0.65) !important; }
[data-bs-theme="dark"] .aw-tab[aria-selected="true"],
[data-bs-theme="dark"] .aw-tab.active { color: #FFFFFF !important; }
[data-bs-theme="dark"] .tab-panel { color: rgba(255,255,255,0.78) !important; }
[data-bs-theme="dark"] .trimmed-text { color: rgba(255,255,255,0.78) !important; }

/* Trust strip text */
[data-bs-theme="dark"] .trust-title { color: #FFFFFF !important; }
[data-bs-theme="dark"] .trust-sub   { color: rgba(255,255,255,0.65) !important; }

/* Breadcrumb */
[data-bs-theme="dark"] .breadcrumb a       { color: rgba(255,255,255,0.65) !important; }
[data-bs-theme="dark"] .breadcrumb .current{ color: #FFFFFF !important; }
[data-bs-theme="dark"] .crumb-sep          { color: rgba(255,255,255,0.30) !important; }

/* FAQ */
[data-bs-theme="dark"] .aw-faq summary    { color: #FFFFFF !important; }
[data-bs-theme="dark"] .aw-faq .answer    { color: rgba(255,255,255,0.78) !important; }

/* Generic card-crumb / left/right panels */
[data-bs-theme="dark"] .card-body { color: rgba(255,255,255,0.85) !important; }
[data-bs-theme="dark"] .price-bar .total-amt #selectedExperienceTotalPrice,
[data-bs-theme="dark"] .price-bar .total-amt { color: #FFFFFF; }

/* ───────────────────────── 2 · Provider name spacing ──────────────────────── */
.provider-name { margin-top: 18px !important; }

/* ───────────────────────── 3 · App AD: more attention-grabbing BG ─────────── */
.awd-app-cta {
  background: linear-gradient(135deg, #1A1530 0%, #2D2467 45%, #1A1530 100%) !important;
  border: 2px solid var(--awd-yellow) !important;
  box-shadow:
    0 0 0 4px rgba(254,182,2,0.10),
    0 30px 60px -28px rgba(56,59,241,0.45) !important;
  position: relative;
}
/* Stripe-y top bar to differentiate */
.awd-app-cta::before {
  /* override the blob that was here */
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 4px;
  background: linear-gradient(90deg,
    var(--awd-yellow) 0%, #FFD96B 25%, var(--awd-yellow) 50%, #FFD96B 75%, var(--awd-yellow) 100%);
  background-size: 200% 100%;
  animation: aw-stripe 6s linear infinite;
  top: 0; left: 0; right: 0;
  width: auto; height: 4px;
  border-radius: 22px 22px 0 0;
  filter: none;
}
.awd-app-cta::after {
  /* keep the soft glow but more vibrant */
  content: ""; position: absolute; bottom: -80px; left: -60px;
  width: 240px; height: 240px; border-radius: 50%;
  background: radial-gradient(circle, rgba(254,182,2,0.32), rgba(0,0,0,0) 70%);
  filter: blur(28px);
  animation: awd-cta-blob 9s ease-in-out infinite;
}
.awd-app-cta__row {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 6px;
  line-height: 1;
}
.awd-app-cta__row .awd-app-cta__eyebrow { margin: 0 !important; }
.awd-app-cta__badge {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 4px 10px;
  background: var(--awd-yellow);
  color: var(--awd-ink);
  font-family: 'Space Grotesk', system-ui, sans-serif;
  font-size: 10px; font-weight: 800;
  letter-spacing: 0.16em;
  border-radius: 999px;
  line-height: 1;
  flex-shrink: 0;
  box-shadow: 0 0 0 4px rgba(254,182,2,0.18);
  animation: awd-badge-glow 2.2s ease-in-out infinite;
}
.awd-app-cta__badge svg { animation: awd-spark 2.4s ease-in-out infinite; }
@keyframes awd-spark {
  0%, 100% { transform: scale(1) rotate(0); }
  50%      { transform: scale(1.18) rotate(15deg); }
}
@keyframes awd-badge-glow {
  0%, 100% { box-shadow: 0 0 0 4px rgba(254,182,2,0.18); }
  50%      { box-shadow: 0 0 0 8px rgba(254,182,2,0.10); }
}
.awd-app-cta__title { font-size: 32px !important; }
.awd-app-cta__title em {
  font-style: italic;
  background: linear-gradient(90deg, var(--awd-yellow), #FFE08A);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
.awd-app-cta__sub { color: rgba(255,255,255,0.78) !important; }
.awd-app-cta__buttons { gap: 12px !important; }
.awd-app-cta__btn { background: rgba(255,255,255,0.96) !important; backdrop-filter: blur(6px); }
.awd-app-cta__btn:hover { background: #FFFFFF !important; }
@keyframes aw-stripe { to { background-position: -200% 0; } }


/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .hero-title,
  .trust-strip,
  .rail-section::before,
  .awd-app-cta::before, .awd-app-cta::after,
  .aw-tab[aria-selected="true"]::after,
  .aw-field.is-valid::after,
  .contact-thanks .thanks-icon, .partner-thanks .thanks-icon { animation: none !important; }
}

@media (max-width: 767px) {
  html, body {
    overflow-x: hidden !important;
  }
  .trust-row,
  .trust-strip-wrap,
  .trust-strip {
    max-width: 100% !important;
    overflow: hidden !important;
    box-sizing: border-box;
  }
  .trust-strip {
    width: 100% !important;
  }
}

/* 7 · Marquee fix — outer strip stays fixed, inner track scrolls */
.trust-strip {
  position: relative;
  width: 100% !important;
  padding: 14px 0 !important;
  margin: 0 !important;
  mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
  overflow: hidden !important;
}
.trust-strip-track {
  display: flex !important;
  align-items: center !important;
  gap: 28px !important;
  width: max-content !important;
  min-width: 100% !important;
  flex-wrap: nowrap !important;
  animation: awd-trust-marquee 28s linear infinite;
}
.trust-strip-track > .trust-item {
  flex: 0 0 auto !important;
  margin: 0 !important;
  white-space: nowrap !important;
}
/* The .trust-strip lives inside .reach-section sometimes — give it a clean,
   full-width wrapper that handles the overflow + edge fade. */
.trust-row, .trust-strip-wrap {
  overflow: hidden !important;
  width: 100% !important;
  margin: 16px 0 !important;
}

/* 1 · Footer alignment + logo */
.aw-footer .footer-row {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 20px !important;
  align-items: start !important;
}
.aw-footer .footer-brand {
  display: inline-flex; align-items: center;margin:auto ;
}
.aw-footer .footer-brand img {
  height: 34px !important; width: auto !important; display: block;
  /* In dark theme the logo file might be dark-on-dark; tint to yellow */
  filter: none;
}
[data-bs-theme="dark"] .aw-footer .footer-brand img {
  /* Convert any dark logo silhouette to brand yellow in dark mode */
  filter: brightness(0) invert(78%) sepia(78%) saturate(2000%) hue-rotate(0deg) brightness(105%) contrast(105%);
}
.aw-footer .footer-nav {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 14px 22px !important;
  align-items: center !important;
}
.aw-footer .footer-icons {
  display: flex; flex-direction: column; gap: 12px; align-items: flex-start;
}
.aw-footer .lp-footer-social-row,
.aw-footer .lp-footer-app-row {
  display: flex; gap: 12px; flex-wrap: wrap; align-items: center;
}
.aw-footer .lp-footer-app-row .ico.app {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 12px; border-radius: 999px;
  background: rgba(255,255,255,0.08);
  color: #fff !important;
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: 12px !important; font-weight: 600 !important;
  text-decoration: none;
}
.aw-footer .ico { color: #fff; }
.aw-footer .footer-copy { margin-top: 6px !important; }


} /* end @media max-width 991.98px */
@media (max-width: 768px) {

  /* ── PRICE BAR — full width, fixed bottom ── */
  .aw-v2 .price-bar {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 998;
    border-radius: 0 !important;
    margin: 0 !important;
    padding: 22px 160px 10px 14px !important;
    min-height: 74px !important;
    background: linear-gradient(135deg, var(--aw-blue) 0%, #2d30d0 100%) !important;
    box-shadow: 0 -4px 20px rgba(0,0,0,0.2);
    overflow: visible !important;
    display: flex !important;
    align-items: flex-start !important;
    flex-direction: row !important;
    justify-content: center !important;
    padding-top: 8px !important;
    /* min-height: 76px !important; */
    min-height: 68px !important;
  }

  /* Orb glow */
  .aw-v2 .price-bar::before {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    background: radial-gradient(circle at 80% 50%, rgba(255,209,83,0.18), transparent 60%) !important;
    animation: none !important;
  }

  /* ── TOTAL BLOCK ── */
  .aw-v2 .price-bar .total-block {
    position: relative !important;
    /* padding-top: 18px !important; */
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    z-index: 1;
    width: calc(100% - 160px) !important;
    min-width: 0 !important;
    flex: 1 !important;
    justify-content: flex-start !important;
    gap: 6px !important;
    /* padding-top: 18px !important; */
    padding-top: 20px !important;
  }

  /* Hide — label, links, per person */
  .aw-v2 .total-lbl         { display: none !important; }
  .aw-v2 .price-bar .links  { display: none !important; }
  .aw-v2 .perPersonAmt       { display: none !important; }

  /* Save badge — absolute, price ke upar */
  .aw-v2 .save-badge {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    background: var(--aw-yellow) !important;
    color: #0a0a0a !important;
    font-size: 10.5px !important;
    font-weight: 800 !important;
    padding: 2px 7px !important;
    border-radius: 4px !important;
    letter-spacing: 0.03em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    line-height: 1.4 !important;
  }

  /* Price — big white */
  .aw-v2 .total-amt {
    font-size: 28px !important;
    font-weight: 900 !important;
    color: #fff !important;
    line-height: 1 !important;
    letter-spacing: -0.03em !important;
    display: block !important;
    margin-top: 2px !important;
    margin-top: 0 !important;
    line-height: 1 !important;
  }

  /* Total sub — original strikethrough */
  .aw-v2 .total-sub {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    margin-top: 3px !important;
    flex-wrap: nowrap !important;
    margin-top: 2px !important;
    position: static !important;
  }

  /* Original price — strikethrough */
  .aw-v2 .total-sub .was,
  .aw-v2 .was.originlAmountFromPriceApi {
    display: inline !important;
    font-size: 16.5px !important;
    font-weight: 600 !important;
    color: var(--aw-yellow) !important;
    text-decoration: line-through !important;
    text-decoration-color: var(--aw-yellow) !important;
    /* text-decoration-color: #ff3b6e !important; */
    text-decoration-thickness: 2px !important;
    white-space: nowrap !important;
  }

  /* ── CHECKOUT BUTTON — right side, layered style ── */
  .aw-v2 .aw-checkout {
    position: fixed !important;
    right: 10px !important;
    bottom: 8px !important;
    left: auto !important;
    width:50px!important;
    z-index: 999;
    border-radius: 12px !important;
    margin: 0 !important;
    padding: 10px 40px 10px 16px !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    background: #fff !important;
    color: #000 !important;
    text-transform: capitalize !important;
    white-space: nowrap !important;
    min-width: 138px !important;
    height: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 6px !important;
    letter-spacing: 0 !important;
    overflow: visible !important;
    box-shadow:
      -8px  0   0   #fef3c7,
      -8px  2px 3px  rgba(0,0,0,0.12),
      -16px 0   0   #fde68a,
      -16px 3px 4px  rgba(0,0,0,0.16),
      -24px 0   0   #fcd34d,
      -24px 4px 6px  rgba(0,0,0,0.20),
      -3px  0   4px  rgba(0,0,0,0.18),
      0 8px 16px     rgba(0,0,0,0.28),
      inset 0 -2px 3px rgba(0,0,0,0.12) !important;
    transition: transform 0.15s ease !important;
  }

  /* Tick icon */
  .aw-v2 .aw-checkout .tick {
    position: absolute !important;
    right: 12px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    font-size: 15px !important;
    color: #000 !important;
  }

  /* Remove default shine */
  .aw-v2 .aw-checkout::before { display: none !important; }

  /* Page padding */
  .aw-v2 { padding-bottom: 68px !important; }

  .aw-v2 .only-mobile{
  /* display: block !important; */
  margin-top: 12px;
  font-size: 12px;
  display: flex !important;
  justify-content: center !important;
  flex-direction: row !important;
  gap: 15px !important;
}

}
/* ═══════════════════════════════════════════════════════════════════════════
   awd-bottom-wrapper mobile overrides
   These extend the existing section 9+11 rules to work with the new
   separated section structure. No old rules are removed — these layer on top.
   ═══════════════════════════════════════════════════════════════════════════ */

@media (max-width: 991.98px) {

  /* Wrapper: flex column with gap, same as old reach-section */
  .awd-bottom-wrapper {
    display: flex;
    flex-direction: column;
    gap: 0;           /* sections handle their own margin-bottom */
  }

  /* Section order on mobile:
     contact → mobile-ad → partner */
  .aw-section--contact                  { order: 1; }
  .aw-section--mobile-ad                { order: 2; }
  .aw-section--partner, .lp-partner-section { order: 3; }

  /* The aw-section wrappers themselves are transparent on mobile —
     the inner .contact-form and .partner-form carry all the dark styling.
     NOTE: .lp-partner-section is intentionally excluded — it IS the card
     and must keep its indigo gradient from listing.scss */
  .aw-section--contact,
  .aw-section--partner,
  .aw-section--mobile-ad {
    background: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    margin-bottom: 0 !important;
  }

  /* Re-apply the dark card styling via the inner divs (already set in
     section 9+11 rules above via .reach-section .contact-form etc).
     These selectors extend those rules to the new structure: */
  .aw-section--contact .contact-form,
  .aw-section--partner .partner-form {
    background: var(--awd-ink) !important;
    color: #fff !important;
    border-radius: 22px !important;
    padding: 26px 22px !important;
    border: 1px solid rgba(255,255,255,0.06) !important;
    position: relative;
    overflow: hidden;
    margin-bottom: 16px;
    margin-top:10px;
  }

  /* Partner section keeps its desktop indigo gradient — only reset layout */
  .lp-partner-section {
    color: #fff !important;
    border-radius: 16px !important;
    padding: 28px 20px !important;
    margin-bottom: 16px;
    /* background intentionally NOT overridden — inherits indigo gradient from listing.scss */
  }

  /* Field styles — extend to new selectors */
  .aw-section--contact .contact-form input,
  .aw-section--contact .contact-form textarea,
  .aw-section--partner .partner-form input,
  .aw-section--partner .partner-form select,
  .aw-section--partner .partner-form textarea,
  .lp-partner-section input,
  .lp-partner-section select,
  .lp-partner-section textarea {
    background: transparent !important;
    color: #fff !important;
    border: 1.5px solid rgba(255,255,255,0.55) !important;
    border-radius: 12px !important;
    padding: 14px 16px !important;
    font-family: 'DM Sans', system-ui, sans-serif !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    outline: none !important;
    width: 100% !important;
    margin-bottom: 10px !important;
  }

  .aw-section--contact .contact-form input::placeholder,
  .aw-section--contact .contact-form textarea::placeholder,
  .aw-section--partner .partner-form input::placeholder,
  .aw-section--partner .partner-form textarea::placeholder,
  .lp-partner-section input::placeholder,
  .lp-partner-section textarea::placeholder {
    color: rgba(255,255,255,0.55) !important;
  }

  /* Submit buttons */
  .aw-section--contact .contact-form button[type="submit"],
  .aw-section--partner .partner-form button[type="submit"],
  .lp-partner-section button[type="button"] {
    background: var(--awd-yellow) !important;
    color: var(--awd-ink) !important;
    border: 0 !important;
    border-radius: 14px !important;
    padding: 14px 22px !important;
    font-family: 'DM Sans', system-ui, sans-serif !important;
    font-weight: 800 !important;
    font-size: 14px !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    width: 100% !important;
    cursor: pointer;
  }

  [data-bs-theme="dark"] .aw-field .niceselect, .aw-field .nice-select{
    color:white ;
  }
} /* end @media max-width 991.98px */
/* ══════════════════════════════════════════════════════════════════════════ */
