:root {
  --bg: #eef4e3;
  --surface: rgba(255, 255, 255, 0.86);
  --surface-strong: #ffffff;
  --surface-soft: rgba(237, 248, 232, 0.85);
  --ink: #183222;
  --muted: #627062;
  --line: rgba(24, 50, 34, 0.12);
  --green: #54b948;
  --green-deep: #267b31;
  --green-soft: #def6d7;
  --green-wash: rgba(84, 185, 72, 0.1);
  --gold-soft: #f4ecd2;
  --shadow: 0 24px 54px rgba(31, 66, 31, 0.14);
  --radius-xl: 32px;
  --radius-lg: 24px;
  --radius-md: 18px;
  --viewport-width: 100vw;
  --font-sans: "Manrope", "Segoe UI", system-ui, sans-serif;
  --font-display: "DM Serif Display", Georgia, serif;
}

/* Hotel-first flight bundle flow */
body.hotel-detail-page .hotel-flight-estimate {
  display: grid;
  gap: 12px;
  padding: 17px;
  border-radius: 11px;
  background: #f7f9f6;
  color: #102417;
}

body.hotel-detail-page .hotel-flight-estimate[hidden] {
  display: none;
}

.hotel-flight-estimate-head,
.hotel-flight-price-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.hotel-flight-estimate-head h3,
.hotel-flight-estimate-head p,
.hotel-flight-estimate p,
.hotel-flight-price-row span {
  margin: 0;
}

body.hotel-detail-page .hotel-flight-estimate-head h3 {
  margin-top: 3px;
  font-size: 0.96rem;
  line-height: 1.35;
}

.hotel-flight-estimate-check {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  flex: 0 0 30px;
  border-radius: 50%;
  background: #54b948;
  color: #ffffff;
  font-weight: 900;
}

.hotel-flight-distance,
.hotel-flight-note,
.hotel-flight-total {
  color: #58645b;
  font-size: 0.73rem;
  line-height: 1.45;
}

.hotel-flight-route {
  display: grid;
  gap: 3px;
  padding: 12px 0;
  border-top: 1px solid #e2ebe0;
  border-bottom: 1px solid #e2ebe0;
}

.hotel-flight-route strong {
  font-size: 0.9rem;
}

.hotel-flight-route span {
  color: #58645b;
  font-size: 0.72rem;
  line-height: 1.45;
}

.hotel-flight-price-row span {
  color: #58645b;
  font-size: 0.72rem;
  font-weight: 700;
}

.hotel-flight-price-row strong {
  font-size: 1.05rem;
}

.hotel-flight-skeleton-line,
.hotel-flight-estimate.is-loading #hotel-flight-airport,
.hotel-flight-estimate.is-loading #hotel-flight-distance,
.hotel-flight-estimate.is-loading #hotel-flight-price,
.hotel-flight-estimate.is-loading #hotel-flight-total {
  overflow: hidden;
  color: transparent !important;
  border-radius: 999px;
  background: linear-gradient(90deg, #e8ede7 25%, #f5f7f4 50%, #e8ede7 75%);
  background-size: 200% 100%;
  animation: bundle-loading-shimmer 1.35s linear infinite;
}

.hotel-flight-skeleton-line {
  width: 82%;
  height: 13px;
}

.hotel-flight-skeleton-line.is-short {
  width: 56%;
}

.hotel-flight-estimate.is-loading #hotel-flight-airport {
  min-height: 18px;
}

.hotel-flight-estimate.is-loading #hotel-flight-distance,
.hotel-flight-estimate.is-loading #hotel-flight-total {
  min-height: 11px;
}

.hotel-flight-estimate.is-loading #hotel-flight-price {
  min-width: 72px;
  min-height: 18px;
}

.hotel-room-flight-next {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 15px;
  border-radius: 14px;
  background: #eef8eb;
  color: #102417;
}

.hotel-room-flight-next[hidden] {
  display: none;
}

.hotel-room-flight-next-icon {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  flex: 0 0 34px;
  border-radius: 50%;
  background: #54b948;
  color: #ffffff;
}

.hotel-room-flight-next strong,
.hotel-room-flight-next p,
.hotel-room-flight-next small {
  display: block;
  margin: 0;
}

.hotel-room-flight-next p {
  margin-top: 3px;
  color: #405044;
  font-size: 0.82rem;
  line-height: 1.45;
}

.hotel-room-flight-next small {
  margin-top: 5px;
  color: #267b31;
  font-weight: 700;
  line-height: 1.4;
}

.hotel-flight-handoff {
  display: block;
  margin-top: 22px;
  padding: 17px 20px;
  border-radius: 16px;
  background: #eff8ed;
}

.hotel-flight-handoff-track {
  display: grid;
  grid-template-columns: auto minmax(30px, 1fr) auto auto;
  align-items: center;
  gap: 14px;
}

.hotel-flight-handoff[hidden] {
  display: none;
}

.hotel-flight-handoff-step {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.hotel-flight-handoff-step > span {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  flex: 0 0 30px;
  border-radius: 50%;
  background: #102417;
  color: #ffffff;
  font-size: 0.78rem;
  font-weight: 800;
}

.hotel-flight-handoff-step.is-current > span {
  background: #54b948;
}

.hotel-flight-handoff-step div {
  display: grid;
  min-width: 0;
}

.hotel-flight-handoff-step small {
  color: #647067;
  font-size: 0.68rem;
}

.hotel-flight-handoff-step strong {
  overflow: hidden;
  max-width: 260px;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.84rem;
}

.hotel-flight-handoff-line {
  height: 2px;
  background: #c9ddc5;
}

.hotel-flight-handoff-track > p {
  margin: 0;
  color: #405044;
  font-size: 0.76rem;
  font-weight: 700;
}

.hotel-flight-airport-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: end;
  gap: 14px;
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid rgba(38, 123, 49, 0.16);
}

.hotel-flight-airport-form[hidden] {
  display: none;
}

.hotel-flight-airport-toggle {
  display: inline-flex;
  margin: 12px 0 0 40px;
  padding: 0;
  border: 0;
  color: var(--green-deep);
  background: transparent;
  font: inherit;
  font-size: 0.76rem;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}

.hotel-flight-airport-form .field-group {
  margin: 0;
}

.hotel-flight-airport-form label {
  color: #294333;
  font-size: 0.75rem;
  font-weight: 750;
}

.hotel-flight-airport-form input {
  min-height: 48px;
  border-color: rgba(38, 123, 49, 0.22);
  background: #ffffff;
}

.hotel-flight-airport-form .button {
  grid-column: 1 / -1;
  justify-self: start;
  min-height: 48px;
  white-space: nowrap;
}

.hotel-flight-airport-help {
  margin: 10px 0 0;
  color: #56665a;
  font-size: 0.75rem;
  line-height: 1.45;
}

body.results-page .results-dual-grid {
  grid-template-columns: 1fr;
}

body.results-page .results-panel {
  border: 0;
  box-shadow: none;
}

.bundle-flight-card {
  display: grid;
  gap: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid rgba(24, 50, 34, 0.1);
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 10px 30px rgba(24, 50, 34, 0.05);
}

.bundle-flight-card.selected {
  border: 2px solid #54b948;
  box-shadow: 0 14px 36px rgba(38, 123, 49, 0.12);
}

.bundle-flight-card-head,
.bundle-flight-card-footer,
.bundle-flight-fare-details {
  padding: 20px 22px;
}

.bundle-flight-card-head {
  display: flex;
  justify-content: space-between;
  align-items: start;
  gap: 24px;
}

.bundle-flight-card-head .offer-tag {
  margin-bottom: 8px;
  padding: 5px 9px;
}

.bundle-flight-card-head h3,
.bundle-flight-card-head p,
.bundle-flight-card-footer p,
.bundle-flight-baggage p {
  margin: 0;
}

.bundle-flight-card-head h3 {
  font-size: 1.12rem;
}

.bundle-flight-card-head p {
  margin-top: 4px;
  color: #647067;
  font-size: 0.76rem;
  text-transform: capitalize;
}

.bundle-flight-card-price {
  display: grid;
  justify-items: end;
  gap: 3px;
  text-align: right;
}

.bundle-flight-card-price strong {
  font-size: 1.55rem;
  line-height: 1;
}

.bundle-flight-card-price small {
  color: #647067;
  font-size: 0.7rem;
}

.bundle-flight-select-top {
  min-width: 190px;
  margin-top: 9px;
  box-shadow: 0 8px 18px rgba(44, 128, 53, 0.2);
}

.bundle-flight-card.selected .bundle-flight-select-top {
  box-shadow: none;
}

.bundle-flight-legs {
  display: grid;
  border-top: 1px solid #edf0ed;
  border-bottom: 1px solid #edf0ed;
}

.bundle-flight-leg {
  display: grid;
  grid-template-columns: 90px minmax(70px, 0.65fr) minmax(120px, 1fr) minmax(70px, 0.65fr) minmax(130px, 0.9fr);
  align-items: center;
  gap: 16px;
  padding: 18px 22px;
}

.bundle-flight-leg + .bundle-flight-leg {
  border-top: 1px solid #edf0ed;
}

.bundle-flight-leg-label,
.bundle-flight-time,
.bundle-flight-carrier {
  display: grid;
  gap: 2px;
}

.bundle-flight-leg-label > span {
  width: fit-content;
  padding: 4px 8px;
  border-radius: 999px;
  background: #eef8eb;
  color: #267b31;
  font-size: 0.68rem;
  font-weight: 800;
}

.bundle-flight-leg-label small,
.bundle-flight-time span,
.bundle-flight-carrier small,
.bundle-flight-path span,
.bundle-flight-path small {
  color: #647067;
  font-size: 0.7rem;
}

.bundle-flight-time strong {
  font-size: 1.05rem;
}

.bundle-flight-time.is-arrival {
  text-align: right;
}

.bundle-flight-path {
  display: grid;
  justify-items: center;
  gap: 5px;
  text-align: center;
}

.bundle-flight-path i {
  position: relative;
  width: 100%;
  height: 2px;
  background: #b9c8b6;
}

.bundle-flight-path i::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -1px;
  width: 7px;
  height: 7px;
  border-top: 2px solid #54b948;
  border-right: 2px solid #54b948;
  transform: translateY(-50%) rotate(45deg);
}

.bundle-flight-carrier {
  padding-left: 8px;
}

.bundle-flight-carrier strong {
  font-size: 0.8rem;
}

.bundle-flight-fare-details {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 0.75fr);
  gap: 24px;
  background: #f7faf6;
}

.bundle-flight-baggage {
  display: flex;
  align-items: flex-start;
  gap: 11px;
}

.bundle-flight-detail-icon {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  flex: 0 0 28px;
  border-radius: 8px;
  background: #54b948;
  color: #ffffff;
  font-size: 0.68rem;
}

.bundle-flight-baggage strong,
.bundle-flight-bag-choice > span {
  display: block;
  font-size: 0.78rem;
}

.bundle-flight-baggage p {
  margin-top: 4px;
  color: #58645b;
  font-size: 0.72rem;
  line-height: 1.45;
}

.bundle-flight-bag-choice {
  display: grid;
  gap: 6px;
}

.bundle-flight-bag-choice select {
  width: 100%;
  min-height: 42px;
  padding: 0 12px;
  border: 1px solid #cfd9cd;
  border-radius: 9px;
  background: #ffffff;
  color: #102417;
  font: inherit;
  font-size: 0.78rem;
}

.bundle-flight-bag-choice small {
  color: #647067;
  font-size: 0.66rem;
  line-height: 1.4;
}

.bundle-flight-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
}

.bundle-flight-card-footer p {
  color: #647067;
  font-size: 0.7rem;
}

.bundle-flight-card-footer .button {
  min-width: 220px;
}

.bundle-flight-skeleton {
  display: grid;
  gap: 16px;
  padding: 24px;
  border-radius: 18px;
  background: #ffffff;
}

.bundle-flight-skeleton span {
  height: 18px;
  border-radius: 999px;
  background: linear-gradient(90deg, #e8ede7 25%, #f5f7f4 50%, #e8ede7 75%);
  background-size: 200% 100%;
  animation: bundle-loading-shimmer 1.35s linear infinite;
}

.bundle-flight-skeleton span:nth-child(1) { width: 28%; }
.bundle-flight-skeleton span:nth-child(2) { width: 78%; height: 48px; }
.bundle-flight-skeleton span:nth-child(3) { width: 92%; height: 48px; }
.bundle-flight-skeleton span:nth-child(4) { width: 44%; }

@keyframes bundle-loading-shimmer {
  from { background-position: 200% 0; }
  to { background-position: -200% 0; }
}

@media (max-width: 980px) {
  body.hotel-detail-page .hotel-flight-estimate {
    grid-column: 1 / -1;
  }

  .bundle-flight-leg {
    grid-template-columns: 82px minmax(64px, 0.6fr) minmax(110px, 1fr) minmax(64px, 0.6fr);
  }

  .bundle-flight-carrier {
    grid-column: 2 / -1;
    grid-row: 2;
    padding-left: 0;
  }
}

@media (max-width: 720px) {
  .hotel-flight-handoff {
    padding: 15px;
  }

  .hotel-flight-handoff-track,
  .hotel-flight-airport-form {
    grid-template-columns: 1fr;
    gap: 11px;
  }

  .hotel-flight-handoff-line {
    display: none;
  }

  .hotel-flight-handoff-step strong {
    max-width: calc(100vw - 110px);
  }

  .hotel-flight-handoff-track > p {
    padding-left: 40px;
  }

  .hotel-flight-airport-form .button {
    width: 100%;
  }

  .hotel-flight-airport-toggle {
    margin-left: 40px;
  }

  .bundle-flight-card-head,
  .bundle-flight-card-footer,
  .bundle-flight-fare-details {
    padding: 17px;
  }

  .bundle-flight-card-head,
  .bundle-flight-card-footer {
    align-items: stretch;
    flex-direction: column;
  }

  .bundle-flight-card-price {
    justify-items: start;
    text-align: left;
    width: 100%;
  }

  .bundle-flight-select-top {
    width: 100%;
    min-width: 0;
  }

  .bundle-flight-leg {
    grid-template-columns: minmax(62px, 0.7fr) minmax(80px, 1fr) minmax(62px, 0.7fr);
    gap: 10px;
    padding: 17px;
  }

  .bundle-flight-leg-label {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  .bundle-flight-path {
    grid-column: 2;
  }

  .bundle-flight-time.is-arrival {
    grid-column: 3;
  }

  .bundle-flight-carrier {
    grid-column: 1 / -1;
    grid-row: auto;
    padding-top: 5px;
  }

  .bundle-flight-fare-details {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .bundle-flight-card-footer .button {
    width: 100%;
    min-width: 0;
  }
}

/* Business accounts */
.auth-business-link,
.account-menu-business {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  color: #1f672a;
  font-size: 0.76rem;
  font-weight: 750;
  text-decoration: none;
}

.auth-business-link:hover,
.account-menu-business:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

body.business-auth-page .business-auth-layout {
  width: min(1220px, 100%);
}

body.business-auth-page .business-auth-card {
  align-content: start;
}

.business-auth-section,
.business-signup-fields {
  display: grid;
  gap: 17px;
}

.business-auth-section[hidden],
.business-auth-switches[hidden],
body.auth-page .business-auth-form > .auth-field[hidden] {
  display: none;
}

.business-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 17px;
}

.business-form-grid-three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.business-form-grid-address {
  grid-template-columns: 130px minmax(0, 1fr);
}

.business-budget-fields {
  grid-template-columns: minmax(100px, 0.35fr) minmax(0, 1fr);
}

body.business-auth-page .auth-field select {
  width: 100%;
  min-height: 54px;
  padding: 13px 15px;
  border: 1px solid #d3d3d3;
  border-radius: 10px;
  background: #ffffff;
  color: #111111;
  font: inherit;
  font-size: 0.92rem;
}

body.business-auth-page .auth-field small {
  color: #858585;
  font-size: 0.66rem;
  font-weight: 560;
}

.business-form-divider {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px;
  align-items: center;
  margin-top: 8px;
  color: #585858;
  font-size: 0.68rem;
  font-weight: 780;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.business-form-divider::after {
  content: "";
  height: 1px;
  background: #dedede;
}

.business-budget-note,
.business-invite-note {
  margin: -4px 0 0;
  color: #6b6b6b;
  font-size: 0.72rem;
  line-height: 1.55;
}

.business-auth-switches {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
  color: #888888;
  font-size: 0.76rem;
}

.business-auth-switches button,
.business-auth-switches a {
  border: 0;
  background: transparent;
  color: #111111;
  cursor: pointer;
  font: inherit;
  font-weight: 720;
  text-decoration: underline;
  text-underline-offset: 3px;
}

body.business-signup-mode .business-auth-main {
  min-height: 0;
}

body.business-signup-mode .business-auth-layout {
  grid-template-columns: 1fr;
  width: min(940px, 100%);
}

body.business-signup-mode .business-auth-story {
  display: none;
}

body.business-signup-mode .business-auth-card {
  padding: clamp(30px, 6vw, 68px);
}

body.business-invite-mode .business-auth-layout {
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
}

body.business-page {
  background: #f5f7f4;
}

body.business-page .business-main {
  width: min(1240px, 100%);
  margin: 0 auto;
  padding: clamp(34px, 5vw, 64px) 0 clamp(70px, 9vw, 118px);
}

.business-loading-card,
.business-access-gate {
  display: flex;
  gap: 16px;
  align-items: center;
  width: min(680px, 100%);
  margin: clamp(50px, 8vw, 100px) auto;
  padding: 28px;
  border: 1px solid #dce2da;
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 16px 42px rgba(24, 50, 34, 0.06);
}

.business-loading-card[hidden],
.business-access-gate[hidden],
.business-dashboard[hidden] {
  display: none;
}

.business-loading-mark {
  display: inline-grid;
  flex: 0 0 auto;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: #1f672a;
  color: #ffffff;
  font-weight: 850;
}

.business-loading-card strong,
.business-loading-card p {
  display: block;
  margin: 0;
}

.business-loading-card p {
  margin-top: 4px;
  color: #697169;
  font-size: 0.8rem;
}

.business-access-gate {
  display: grid;
  justify-items: start;
}

.business-access-gate h1,
.business-access-gate p {
  margin: 0;
}

.business-dashboard {
  display: grid;
  gap: 24px;
}

.business-dashboard-hero {
  display: flex;
  justify-content: space-between;
  gap: 28px;
  align-items: end;
  padding: 8px 0 26px;
  border-bottom: 1px solid #d8ded6;
}

.business-dashboard-hero h1 {
  max-width: 760px;
  margin: 8px 0 10px;
  font-size: clamp(2.6rem, 6vw, 5.4rem);
  letter-spacing: -0.06em;
  line-height: 0.94;
}

.business-dashboard-hero .hero-text {
  margin: 0;
}

.business-hero-actions {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.business-role-badge {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 8px 13px;
  border-radius: 999px;
  background: #e5f4e2;
  color: #1f672a;
  font-size: 0.7rem;
  font-weight: 800;
  text-transform: capitalize;
}

.business-metric-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.business-metric-card,
.business-panel {
  border: 1px solid #dce2da;
  border-radius: 17px;
  background: #ffffff;
  box-shadow: 0 10px 30px rgba(24, 50, 34, 0.045);
}

.business-metric-card {
  display: grid;
  gap: 6px;
  min-height: 150px;
  padding: 22px;
  align-content: end;
}

.business-metric-card span,
.business-metric-card small {
  color: #6d756e;
  font-size: 0.7rem;
}

.business-metric-card span {
  font-weight: 750;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.business-metric-card strong {
  color: #17201a;
  font-size: clamp(1.35rem, 2.6vw, 2.1rem);
  letter-spacing: -0.04em;
}

.business-metric-card-primary {
  border-color: #1f672a;
  background: #1f672a;
}

.business-metric-card-primary span,
.business-metric-card-primary small {
  color: rgba(255, 255, 255, 0.7);
}

.business-metric-card-primary strong {
  color: #ffffff;
}

.business-dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 18px;
}

.business-panel {
  padding: clamp(22px, 3vw, 32px);
}

.business-permission-gate {
  margin: 0;
}

.business-overview-links {
  display: grid;
  gap: 8px;
}

.business-overview-links a {
  display: grid;
  gap: 4px;
  padding: 15px 16px;
  border: 1px solid #e0e6de;
  border-radius: 12px;
  color: #263029;
  text-decoration: none;
}

.business-overview-links a:hover {
  border-color: #a8cda3;
  background: #f1f8ef;
  color: #1f672a;
}

.business-overview-links strong {
  font-size: 0.82rem;
}

.business-overview-links span {
  color: #6d756e;
  font-size: 0.7rem;
  line-height: 1.45;
}

.business-panel-head {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: start;
  margin-bottom: 22px;
}

.business-panel-head h2,
.business-panel-head p {
  margin: 0;
}

.business-panel-head h2 {
  margin-top: 6px;
  color: #182019;
  font-size: clamp(1.35rem, 2.4vw, 2rem);
  letter-spacing: -0.04em;
}

.business-panel-head > div > p:last-child:not(.eyebrow) {
  max-width: 680px;
  margin-top: 8px;
  color: #6d756e;
  font-size: 0.78rem;
  line-height: 1.55;
}

.business-detail-list {
  display: grid;
  margin: 0;
  border-top: 1px solid #e1e5df;
}

.business-detail-list div {
  display: grid;
  grid-template-columns: minmax(110px, 0.42fr) minmax(0, 1fr);
  gap: 20px;
  padding: 14px 0;
  border-bottom: 1px solid #e1e5df;
}

.business-detail-list dt,
.business-detail-list dd {
  margin: 0;
  font-size: 0.78rem;
}

.business-detail-list dt {
  color: #7a827a;
  font-weight: 700;
}

.business-detail-list dd {
  color: #252b26;
  font-weight: 650;
}

.business-budget-panel .business-panel-head > strong {
  color: #1f672a;
  font-size: 1.35rem;
}

.business-budget-bar {
  overflow: hidden;
  height: 12px;
  border-radius: 999px;
  background: #e8ede6;
}

.business-budget-bar span {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: #54b948;
  transition: width 220ms ease;
}

.business-budget-panel > p {
  color: #6d756e;
  font-size: 0.78rem;
}

.business-inline-form {
  display: grid;
  gap: 8px;
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid #e1e5df;
}

.business-inline-form[hidden] {
  display: none;
}

.business-inline-form > label {
  color: #505851;
  font-size: 0.72rem;
  font-weight: 750;
}

.business-inline-form > div {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.business-inline-form > div > span,
.business-inline-form input {
  min-height: 44px;
  border: 1px solid #d7ddd5;
  background: #ffffff;
}

.business-inline-form > div > span {
  display: inline-flex;
  align-items: center;
  padding: 0 11px;
  border-radius: 9px;
  color: #4f5850;
  font-size: 0.72rem;
  font-weight: 800;
}

.business-inline-form input {
  min-width: 0;
  padding: 10px 12px;
  border-radius: 9px;
  font: inherit;
}

.business-invite-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(130px, 0.4fr) auto;
  gap: 12px;
  align-items: end;
  margin-bottom: 20px;
  padding: 20px;
  border: 1px solid #d8dfd6;
  border-radius: 14px;
  background: #f7faf6;
}

.business-invite-form[hidden],
.business-invite-result[hidden] {
  display: none;
}

.business-invite-form label {
  display: grid;
  gap: 7px;
  color: #4e564f;
  font-size: 0.7rem;
  font-weight: 750;
}

.business-invite-form input,
.business-invite-form select,
.business-invite-link-row input {
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid #d4dbd2;
  border-radius: 9px;
  background: #ffffff;
  color: #202520;
  font: inherit;
}

.business-invite-result {
  display: grid;
  grid-template-columns: minmax(180px, 0.55fr) minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  margin-bottom: 20px;
  padding: 18px;
  border: 1px solid #b8d8b3;
  border-radius: 14px;
  background: #eff8ed;
}

.business-invite-result strong,
.business-invite-result p {
  margin: 0;
}

.business-invite-result p {
  margin-top: 4px;
  color: #59705b;
  font-size: 0.72rem;
}

.business-invite-link-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}

.business-member-list,
.business-order-list {
  display: grid;
  border-top: 1px solid #e1e5df;
}

.business-member-row {
  display: grid;
  grid-template-columns: 42px minmax(150px, 1.35fr) minmax(70px, 0.45fr) minmax(105px, 0.55fr) minmax(120px, 0.65fr) auto;
  gap: 14px;
  align-items: center;
  min-height: 76px;
  padding: 12px 0;
  border-bottom: 1px solid #e1e5df;
}

.business-member-avatar {
  display: inline-grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 11px;
  background: #e5f4e2;
  color: #1f672a;
  font-size: 0.77rem;
  font-weight: 850;
}

.business-member-identity {
  display: grid;
  min-width: 0;
}

.business-member-identity strong,
.business-member-identity span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.business-member-identity strong {
  color: #252b26;
  font-size: 0.82rem;
}

.business-member-identity span,
.business-member-role,
.business-member-status {
  color: #747c75;
  font-size: 0.7rem;
}

.business-member-role,
.business-member-status {
  text-transform: capitalize;
}

.business-status-active {
  color: #1f672a;
}

.business-status-disabled {
  color: #a13a33;
}

.business-member-spend {
  display: grid;
  color: #252b26;
  font-size: 0.79rem;
  text-align: right;
}

.business-member-spend small {
  color: #8a918a;
  font-size: 0.61rem;
  font-weight: 550;
}

.business-member-action {
  min-height: 36px;
  padding: 7px 10px;
  border: 1px solid #d4dbd2;
  border-radius: 8px;
  background: #ffffff;
  color: #4a524b;
  cursor: pointer;
  font: inherit;
  font-size: 0.66rem;
  font-weight: 720;
}

.business-member-action:hover {
  border-color: #277832;
  color: #1f672a;
}

.business-order-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(120px, 0.4fr) minmax(120px, 0.35fr);
  gap: 18px;
  align-items: center;
  padding: 16px 0;
  border-bottom: 1px solid #e1e5df;
}

.business-order-row > div {
  display: grid;
}

.business-order-row strong {
  color: #272c28;
  font-size: 0.8rem;
}

.business-order-row > strong {
  text-align: right;
}

.business-order-row span {
  color: #747c75;
  font-size: 0.69rem;
  text-transform: capitalize;
}

.business-empty-state {
  padding: 28px 0;
  color: #747c75;
  font-size: 0.78rem;
}

.business-empty-state strong,
.business-empty-state p {
  margin: 0;
}

.business-empty-state p {
  margin-top: 4px;
}

@media (max-width: 980px) {
  .business-metric-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .business-dashboard-grid {
    grid-template-columns: 1fr;
  }

  .business-invite-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .business-member-row {
    grid-template-columns: 42px minmax(0, 1fr) auto auto;
  }

  .business-member-role,
  .business-member-status {
    grid-row: 2;
  }

  .business-member-role {
    grid-column: 2;
  }

  .business-member-status {
    grid-column: 3;
  }

  .business-member-spend {
    grid-column: 3;
    grid-row: 1;
  }

  .business-member-action {
    grid-column: 4;
    grid-row: 1 / span 2;
  }
}

@media (max-width: 700px) {
  .business-form-grid,
  .business-form-grid-three,
  .business-form-grid-address,
  .business-budget-fields,
  body.business-invite-mode .business-auth-layout {
    grid-template-columns: 1fr;
  }

  .business-dashboard-hero {
    align-items: flex-start;
    flex-direction: column;
  }

  .business-hero-actions,
  .business-hero-actions .button {
    width: 100%;
  }

  .business-metric-grid {
    grid-template-columns: 1fr;
  }

  .business-metric-card {
    min-height: 126px;
  }

  .business-panel-head {
    flex-direction: column;
  }

  .business-panel-head .button {
    width: 100%;
  }

  .business-invite-form,
  .business-invite-result,
  .business-invite-link-row,
  .business-order-row {
    grid-template-columns: 1fr;
  }

  .business-member-row {
    grid-template-columns: 38px minmax(0, 1fr) auto;
    gap: 10px;
  }

  .business-member-spend {
    grid-column: 3;
  }

  .business-member-role {
    grid-column: 2;
  }

  .business-member-status {
    grid-column: 3;
  }

  .business-member-action {
    grid-column: 2 / -1;
    grid-row: 3;
  }

  .business-order-row > strong {
    text-align: left;
  }

  .business-inline-form > div {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .business-inline-form .button {
    grid-column: 1 / -1;
  }
}

* {
  box-sizing: border-box;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

html {
  scroll-behavior: smooth;
  overflow-x: clip;
  scrollbar-gutter: stable;
}

body {
  margin: 0;
  font-family: var(--font-sans);
  line-height: 1.5;
  color: var(--ink);
  background: #ffffff;
  min-height: 100vh;
  overflow-x: clip;
}

body.boot-loading {
  overflow: hidden;
}

body.boot-loading .page-shell,
body.boot-loading .toast,
body.boot-loading .mobile-bottom-dock {
  opacity: 0;
  visibility: hidden;
}

body.app-ready .page-shell,
body.app-ready .toast,
body.app-ready .mobile-bottom-dock {
  opacity: 1;
  visibility: visible;
  transition: opacity 320ms ease;
}

.site-loader {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: 28px;
  background:
    radial-gradient(circle at top, rgba(84, 185, 72, 0.18), transparent 42%),
    linear-gradient(180deg, #ffffff 0%, #f6fbf1 100%);
  transition: opacity 280ms ease, visibility 280ms ease;
}

body.app-ready .site-loader {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.site-loader-mark {
  width: min(320px, 100%);
  display: grid;
  justify-items: center;
  gap: 18px;
}

.site-loader-logo {
  width: min(144px, 42vw);
  height: auto;
  filter: drop-shadow(0 18px 28px rgba(38, 123, 49, 0.12));
}

.site-loader-line {
  width: 100%;
  height: 6px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(24, 50, 34, 0.08);
  box-shadow: inset 0 1px 2px rgba(24, 50, 34, 0.06);
}

.site-loader-line-bar {
  display: block;
  width: 42%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--green-deep), var(--green), #8bd95f);
  animation: site-loader-sweep 1.1s ease-in-out infinite;
  transform-origin: left center;
}

@keyframes site-loader-sweep {
  0% {
    transform: translateX(-115%) scaleX(0.72);
  }

  50% {
    transform: translateX(92%) scaleX(1);
  }

  100% {
    transform: translateX(220%) scaleX(0.82);
  }
}

body::before {
  display: none;
}

body.search-page {
  background: #ffffff;
}

body.search-page::before {
  display: none;
}

.page-shell {
  width: min(1180px, calc(100% - 32px));
  margin: 0 auto;
  padding: 24px 0 96px;
}

body.search-page .page-shell {
  width: min(1240px, calc(100% - 32px));
}

.simple-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}

.site-header {
  position: relative;
  z-index: 12;
  width: var(--viewport-width, 100vw);
  margin-left: calc(50% - (var(--viewport-width, 100vw) / 2));
  margin-right: calc(50% - (var(--viewport-width, 100vw) / 2));
  padding: 16px max(20px, calc((var(--viewport-width, 100vw) - 1240px) / 2 + 16px));
  border-radius: 0;
  background: rgba(255, 255, 255, 0.98);
  border: 0;
  box-shadow: 0 10px 28px rgba(24, 50, 34, 0.08);
}

.site-nav,
.header-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

@media (min-width: 721px) {
  .site-header .nav-link-flights {
    order: 3;
  }

  .site-header .nav-link-map {
    order: 4;
  }
}

.nav-link-text,
.header-action-button {
  font: inherit;
  text-decoration: none;
  border: 0;
  background: transparent;
  color: var(--ink);
}

.site-header .wordmark,
.site-header .nav-link-text,
.site-header .header-action-button {
  color: var(--ink);
}

.header-action-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: 12px 16px;
  border: 1px solid rgba(24, 50, 34, 0.1);
  background: #ffffff;
  cursor: pointer;
  font-weight: 600;
}

.map-search-toggle {
  display: none;
}

.profile-action-button {
  width: 48px;
  min-width: 48px;
  height: 48px;
  padding: 0;
}

.header-utility-link {
  background: rgba(84, 185, 72, 0.1);
  border-color: rgba(84, 185, 72, 0.18);
}

.nav-link-text {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 10px 0;
  color: var(--muted);
  font-weight: 600;
  transition: color 180ms ease;
}

.nav-link-text:hover {
  color: inherit;
}

.nav-link-active {
  color: var(--ink);
}

.nav-link-active::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -2px;
  height: 2px;
  border-radius: 999px;
  background: var(--green-deep);
}

.cart-button {
  gap: 8px;
}

.cart-count {
  display: inline-grid;
  place-items: center;
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--ink);
  color: #fff;
  font-size: 0.8rem;
}

.back-link,
.hero-text,
.results-head p,
.checkout-message,
.offer-card p,
.suggestion-item small,
.highlight-card p,
.search-subtext,
.price-stack small,
.rate-meta p {
  color: var(--muted);
  line-height: 1.65;
}

.wordmark {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  flex-shrink: 0;
}

.wordmark-logo-frame {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px 0;
}

.wordmark-logo {
  display: block;
  width: auto;
  height: clamp(42px, 4.4vw, 68px);
  max-width: min(332px, 40vw);
}

.footer-brand-block .wordmark-logo-frame {
  padding: 4px 0;
}

.footer-brand-block .wordmark-logo {
  width: auto;
  height: clamp(40px, 4.1vw, 64px);
  max-width: min(316px, 38vw);
}

.wordmark {
  text-decoration: none;
  color: var(--green);
  font-family: var(--font-display);
  font-size: clamp(2rem, 4vw, 3rem);
  letter-spacing: 0;
  line-height: 0.95;
}

.back-link {
  text-decoration: none;
  font-weight: 500;
}

.search-main,
.results-main {
  margin-top: 32px;
}

.search-hero,
.results-hero {
  max-width: 780px;
}

.homepage-hero {
  max-width: none;
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(300px, 0.72fr);
  gap: 24px;
  align-items: stretch;
}

.hero-copy {
  padding: 18px 0 4px;
}

.hero-side-panel {
  align-self: start;
  padding: 24px;
  border-radius: 28px;
  background: #f8fbf7;
  border: 1px solid rgba(24, 50, 34, 0.08);
  box-shadow: 0 18px 38px rgba(24, 50, 34, 0.06);
  display: grid;
  gap: 16px;
}

.homepage-hero-refined {
  align-items: start;
}

.trip-search-form {
  margin-top: 28px;
  display: grid;
  gap: 14px;
}

.trip-search-bar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  padding: 10px;
  border-radius: 24px;
  background: #f8fbf7;
  border: 1px solid rgba(24, 50, 34, 0.08);
  box-shadow: 0 20px 42px rgba(24, 50, 34, 0.06);
}

.trip-search-bar input {
  min-width: 0;
  border: 0;
  outline: none;
  background: transparent;
  padding: 14px 16px;
  font: inherit;
  font-size: 1rem;
  color: var(--ink);
}

.trip-search-bar input::placeholder {
  color: #7d8c7c;
}

.trip-search-chip-row,
.trip-search-pill-row,
.download-badge-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.trip-search-chip-row {
  margin-top: 16px;
}

.chip-ghost-button,
.app-store-badge {
  border: 1px solid rgba(24, 50, 34, 0.1);
  border-radius: 999px;
  background: #ffffff;
  color: var(--ink);
  padding: 12px 16px;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}

.chip-ghost-button {
  background: #f8fbf7;
}

.chip-ghost-button:hover,
.app-store-badge:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 26px rgba(24, 50, 34, 0.08);
}

.ai-summary-card,
.app-promo-card,
.hero-side-list-card,
.download-banner-card {
  border-radius: 28px;
  border: 1px solid rgba(24, 50, 34, 0.08);
  background: #ffffff;
  box-shadow: 0 18px 38px rgba(24, 50, 34, 0.06);
}

.ai-summary-card {
  margin-top: 22px;
  padding: 22px;
  display: grid;
  gap: 16px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.98)),
    linear-gradient(135deg, #ebf7e8, #fff4de);
}

.ai-summary-copy h2,
.app-promo-card h2,
.download-banner-card h2 {
  margin: 0;
}

.ai-summary-copy p,
.app-promo-card p,
.download-banner-card p {
  margin-bottom: 0;
}

.trip-search-pill {
  display: inline-flex;
  align-items: center;
  padding: 9px 13px;
  border-radius: 999px;
  background: rgba(84, 185, 72, 0.1);
  color: var(--green-deep);
  font-size: 0.88rem;
  font-weight: 700;
}

.app-promo-card,
.hero-side-list-card,
.download-banner-card {
  padding: 22px;
  display: grid;
  gap: 16px;
}

.app-promo-card {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.98)),
    linear-gradient(135deg, #eef8ff, #fff0df);
}

.app-store-badge {
  background: #ffffff;
  min-width: 148px;
}

.app-download-banner {
  margin-top: 42px;
}

.download-banner-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.98)),
    linear-gradient(135deg, #edf7ea, #eef8ff);
}

.hero-side-list {
  display: grid;
  gap: 12px;
}

.mini-hotel-link {
  display: grid;
  gap: 4px;
  text-decoration: none;
  color: var(--ink);
  padding: 14px 16px;
  border-radius: 18px;
  background: #ffffff;
  border: 1px solid rgba(24, 50, 34, 0.08);
}

.mini-hotel-link.hotel-cta-button {
  border: 1px solid rgba(24, 50, 34, 0.08);
  background: #ffffff;
  text-align: left;
}

.mini-hotel-link span {
  color: var(--muted);
  line-height: 1.5;
}

.hero-highlights {
  margin-top: 26px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.highlight-card {
  padding: 18px;
  border-radius: 24px;
  background: #f7faf6;
  border: 1px solid rgba(24, 50, 34, 0.08);
  box-shadow: none;
}

.highlight-card span {
  display: inline-flex;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-size: 0.74rem;
  font-weight: 700;
  color: var(--green-deep);
}

.highlight-card strong {
  display: block;
  margin-top: 8px;
  font-size: 1.12rem;
}

.highlight-card p {
  margin: 10px 0 0;
}

.mode-note {
  margin-top: 18px;
  padding: 14px 16px;
  border-radius: 18px;
  background: rgba(38, 123, 49, 0.12);
  color: var(--green-deep);
  border: 1px solid rgba(38, 123, 49, 0.16);
  font-weight: 500;
}

.eyebrow {
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--green-deep);
}

h1,
h2,
h3 {
  margin: 0;
  line-height: 1.02;
}

h1,
h2 {
  font-family: var(--font-display);
  letter-spacing: 0;
}

h1 {
  font-size: clamp(3rem, 6vw, 5rem);
  margin-top: 12px;
  max-width: 12ch;
}

h2 {
  font-size: clamp(2rem, 4vw, 3rem);
}

h3 {
  font-size: 1.2rem;
}

.search-card-wrap,
.chat-wrap {
  margin-top: 30px;
}

.search-card,
.chat-card,
.results-panel,
.checkout-panel,
.checkout-card,
.offer-card,
.passenger-card {
  background: var(--surface);
  border: 1px solid rgba(255, 255, 255, 0.76);
  backdrop-filter: blur(20px);
  box-shadow: var(--shadow);
  border-radius: var(--radius-xl);
}

.search-card,
.chat-card,
.results-panel,
.checkout-panel,
.checkout-card,
.offer-card,
.passenger-card {
  padding: 24px;
}

.search-card,
.chat-card,
.checkout-card,
.passenger-card,
.checkout-panel {
  display: grid;
  gap: 18px;
}

body.search-page .search-card,
body.search-page .chat-card {
  background: #ffffff;
  border: 1px solid rgba(24, 50, 34, 0.08);
  box-shadow: 0 24px 60px rgba(24, 50, 34, 0.07);
}

.search-form-head,
.bundle-intro,
.stay-meta-row,
.stay-card-top {
  display: flex;
  justify-content: space-between;
  gap: 18px;
}

.search-form-head,
.bundle-intro {
  align-items: start;
}

.trip-toggle {
  display: inline-grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  padding: 8px;
  background: rgba(84, 185, 72, 0.1);
  border-radius: 999px;
  width: min(320px, 100%);
}

.trip-option {
  border: 0;
  border-radius: 999px;
  padding: 12px 16px;
  font: inherit;
  font-weight: 600;
  color: var(--muted);
  background: transparent;
  cursor: pointer;
}

.trip-option.active {
  background: var(--green-deep);
  color: #fff;
  box-shadow: none;
}

.field-grid,
.bundle-field-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.bundle-card {
  padding: 20px;
  border-radius: 26px;
  background: #f8fbf7;
  border: 1px solid rgba(24, 50, 34, 0.08);
  display: grid;
  gap: 18px;
}

.hotel-card {
  border: 1px solid rgba(38, 123, 49, 0.18);
  box-shadow: 0 18px 42px rgba(38, 123, 49, 0.12);
}

.hotel-card-head {
  align-items: center;
}

.hotel-card-inactive {
  opacity: 0.75;
}

.hotel-card-inactive .pill-button {
  opacity: 0.9;
}

.hotel-card-inactive input:disabled,
.hotel-card-inactive select:disabled {
  background: rgba(248, 248, 248, 0.92);
  color: rgba(24, 50, 34, 0.58);
  cursor: not-allowed;
}

.hotel-status-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  border-radius: 18px;
  padding: 14px 16px;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(24, 50, 34, 0.08);
}

.hotel-status-row strong {
  font-size: 0.96rem;
}

.hotel-status-row span {
  color: var(--muted);
  font-size: 0.9rem;
}

.switch-pill {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid var(--line);
  cursor: pointer;
  align-self: start;
}

.switch-pill input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.switch-pill-track {
  position: relative;
  width: 48px;
  height: 28px;
  border-radius: 999px;
  background: rgba(24, 50, 34, 0.16);
  transition: background 180ms ease;
}

.switch-pill-track::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 8px 18px rgba(17, 34, 17, 0.16);
  transition: transform 180ms ease;
}

.switch-pill-label {
  font-weight: 700;
  color: var(--ink);
}

.switch-pill input:checked + .switch-pill-track {
  background: var(--green-deep);
}

.switch-pill input:checked + .switch-pill-track::after {
  transform: translateX(20px);
}

.pill-row,
.stay-amenities {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.pill-button,
.amenity-pill,
.stay-badge {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 8px 12px;
  font-size: 0.85rem;
}

.pill-button {
  border: 0;
  font: inherit;
  cursor: pointer;
  background: #ffffff;
  color: var(--ink);
  border: 1px solid rgba(24, 50, 34, 0.1);
  text-decoration: none;
}

.amenity-pill {
  background: rgba(222, 246, 215, 0.72);
  color: var(--green-deep);
}

.stay-badge {
  background: var(--gold-soft);
  color: #70580a;
  font-weight: 700;
}

.search-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.search-subtext {
  max-width: 420px;
  margin: 0;
}

.flights-main {
  padding-top: 28px;
}

.flights-workspace {
  display: grid;
  grid-template-columns: minmax(360px, 0.9fr) minmax(0, 1.1fr);
  gap: 24px;
  align-items: start;
}

.flights-search-panel,
.flights-results-panel {
  min-width: 0;
}

.flights-search-panel {
  position: sticky;
  top: 92px;
  display: grid;
  gap: 18px;
}

.flights-page-head,
.flights-results-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 18px;
}

.flights-page-head h1,
.flights-results-head h2 {
  margin-bottom: 0;
}

.flights-search-card {
  gap: 20px;
}

.flights-field-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.flight-quick-routes {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.flights-results-panel {
  min-height: 520px;
}

.flights-results-panel .results-state {
  margin: 0 0 18px;
}

.inline-flight-summary {
  margin-top: 20px;
  gap: 16px;
}

body.flights-search-page .flights-search-panel,
body.flights-search-page .flights-results-panel {
  gap: 14px;
}

body.flights-search-page .flights-page-head,
body.flights-search-page .flights-results-head {
  gap: 14px;
}

body.flights-search-page .trip-toggle {
  gap: 6px;
  padding: 6px;
  width: min(280px, 100%);
  border-radius: 18px;
}

body.flights-search-page .trip-option {
  padding: 10px 14px;
  min-height: 40px;
  border-radius: 14px;
  font-size: 0.95rem;
}

body.flights-search-page .flights-search-card {
  gap: 16px;
}

body.flights-search-page .field-grid.flights-field-grid {
  gap: 12px;
}

body.flights-search-page .field-group {
  gap: 6px;
}

body.flights-search-page label {
  font-size: 0.84rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: uppercase;
}

body.flights-search-page input,
body.flights-search-page select {
  border-radius: 14px;
  padding: 11px 14px;
  min-height: 44px;
}

body.flights-search-page .flight-quick-routes {
  gap: 8px;
}

body.flights-search-page .pill-button {
  padding: 7px 11px;
  min-height: 34px;
  border-radius: 12px;
  font-size: 0.8rem;
  font-weight: 700;
}

body.flights-search-page .search-actions {
  align-items: center;
  gap: 12px;
}

body.flights-search-page .button {
  border-radius: 14px;
  padding: 11px 18px;
}

body.flights-search-page .button.button-primary,
body.flights-search-page .button.button-secondary {
  min-height: 44px;
}

body.flights-search-page #flight-search-submit,
body.flights-search-page #inline-flight-checkout-button {
  padding-inline: 18px;
  letter-spacing: 0.01em;
}

body.flights-search-page .results-panel .button.button-secondary {
  padding: 10px 16px;
}

.field-group {
  display: grid;
  gap: 8px;
}

.autocomplete {
  position: relative;
  z-index: 1;
}

.autocomplete:focus-within {
  z-index: 30;
}

.hidden {
  display: none !important;
}

label {
  font-size: 0.95rem;
  font-weight: 500;
}

input,
select {
  width: 100%;
  border: 1px solid rgba(24, 50, 34, 0.13);
  background: rgba(255, 255, 255, 0.96);
  color: var(--ink);
  border-radius: 16px;
  padding: 14px 16px;
  font: inherit;
  outline: none;
}

input:focus,
select:focus {
  border-color: var(--green);
  box-shadow: 0 0 0 4px rgba(84, 185, 72, 0.14);
}

.suggestions {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  display: none;
  gap: 8px;
  z-index: 10;
  padding: 8px;
  background: rgba(255, 255, 255, 0.98);
  border: 1px solid var(--line);
  border-radius: 20px;
  box-shadow: var(--shadow);
}

.suggestions.visible {
  display: grid;
}

@media (max-width: 820px) {
  body.flights-search-page .autocomplete,
  body.flights-search-page .field-group {
    scroll-margin-top: 14px;
  }

  body.flights-search-page .flights-search-card,
  body.flights-search-page .field-grid.flights-field-grid,
  body.flights-search-page .field-group,
  body.flights-search-page .autocomplete {
    overflow: visible;
  }

  body.flights-search-page .autocomplete {
    align-content: start;
  }

  body.flights-search-page .suggestions {
    position: static;
    top: auto;
    left: auto;
    right: auto;
    width: 100%;
    margin-top: 8px;
    max-height: min(240px, 34vh);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
}

.suggestion-item {
  border: 0;
  text-align: left;
  border-radius: 16px;
  padding: 12px 14px;
  background: rgba(222, 246, 215, 0.66);
  color: var(--ink);
  display: grid;
  gap: 2px;
  cursor: pointer;
}

.button {
  border: 0;
  cursor: pointer;
  border-radius: 999px;
  padding: 14px 22px;
  font: inherit;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform 180ms ease, box-shadow 180ms ease, opacity 180ms ease;
}

.button:hover {
  transform: translateY(-1px);
}

.button:disabled {
  cursor: not-allowed;
  opacity: 0.7;
  transform: none;
}

.button-primary {
  background: var(--green-deep);
  color: #fff;
  box-shadow: none;
}

.button-secondary {
  background: rgba(255, 255, 255, 0.9);
  color: var(--ink);
  border: 1px solid var(--line);
}

.button-full {
  width: 100%;
}

.button-select {
  padding: 10px 16px;
  flex-shrink: 0;
}

.chat-model-row {
  display: grid;
  gap: 8px;
  max-width: 360px;
}

.chat-log {
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 14px;
  background: rgba(255, 255, 255, 0.9);
  min-height: 220px;
  max-height: 360px;
  overflow-y: auto;
  display: grid;
  gap: 12px;
}

.chat-bubble {
  max-width: min(85%, 680px);
  border-radius: 16px;
  padding: 12px 14px;
  line-height: 1.5;
  white-space: pre-wrap;
}

.chat-bubble.user {
  margin-left: auto;
  background: linear-gradient(135deg, var(--green), var(--green-deep));
  color: #fff;
}

.chat-bubble.assistant {
  margin-right: auto;
  background: rgba(222, 246, 215, 0.66);
  color: var(--ink);
}

.chat-form {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: center;
}

.featured-hotels-section {
  margin-top: 34px;
  display: grid;
  gap: 18px;
}

.section-head {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: end;
}

.section-copy {
  max-width: 420px;
  margin: 0;
  color: var(--muted);
  line-height: 1.6;
}

.featured-hotels-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 18px;
}

.featured-hotel-card {
  display: grid;
  overflow: hidden;
  border-radius: 24px;
  border: 1px solid rgba(24, 50, 34, 0.08);
  background: #ffffff;
  box-shadow: 0 18px 38px rgba(24, 50, 34, 0.06);
  transition:
    border-color 180ms ease,
    box-shadow 180ms ease,
    transform 180ms ease;
}

.hotel-card-media {
  position: relative;
  overflow: hidden;
  min-height: 220px;
  aspect-ratio: 16 / 11;
  padding: 14px;
  display: flex;
  align-items: start;
}

.hotel-card-media-swipe,
.hotel-gallery-stage-detail {
  cursor: pointer;
  user-select: none;
  touch-action: pan-y;
}

.hotel-card-photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 240ms ease;
}

.featured-hotel-card:hover .hotel-card-photo {
  transform: scale(1.04);
}

.featured-hotel-card.hotel-browse-card:hover .hotel-card-photo {
  transform: none;
}

.hotel-card-media-live::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(7, 18, 11, 0.02) 0%, rgba(7, 18, 11, 0.08) 42%, rgba(7, 18, 11, 0.5) 100%),
    linear-gradient(135deg, rgba(84, 185, 72, 0.1), rgba(255, 209, 102, 0.1));
}

.hotel-card-media-top {
  position: relative;
  z-index: 1;
  width: 100%;
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: start;
}

.hotel-card-chip {
  display: inline-flex;
  align-items: center;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.9);
  color: var(--ink);
  font-size: 0.74rem;
  font-weight: 800;
}

.featured-hotel-status {
  display: inline-flex;
  align-items: center;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(17, 36, 22, 0.82);
  color: #ffffff;
  font-size: 0.73rem;
  font-weight: 800;
}

.hotel-card-media-counter {
  position: absolute;
  right: 16px;
  bottom: 16px;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(17, 24, 39, 0.72);
  color: #ffffff;
  font-size: 0.76rem;
  font-weight: 700;
  backdrop-filter: blur(10px);
}

.hotel-card-media-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  border: 0;
  min-width: 56px;
  min-height: 36px;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(17, 24, 39, 0.68);
  color: #ffffff;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 700;
  cursor: pointer;
  backdrop-filter: blur(10px);
}

.hotel-card-media-nav-prev {
  left: 16px;
}

.hotel-card-media-nav-next {
  right: 16px;
}

.hotel-theme-coast .hotel-card-media {
  background:
    linear-gradient(180deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.02)),
    linear-gradient(135deg, #8fd3ff, #dff7ff 46%, #fce8bb);
}

.hotel-theme-city .hotel-card-media {
  background:
    linear-gradient(180deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.02)),
    linear-gradient(135deg, #d7dbe5, #eef1f7 50%, #c3d3ea);
}

.hotel-theme-luxury .hotel-card-media {
  background:
    linear-gradient(180deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.02)),
    linear-gradient(135deg, #f2dbb8, #fff2df 48%, #d7b076);
}

.hotel-theme-test .hotel-card-media {
  background:
    linear-gradient(180deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.02)),
    linear-gradient(135deg, #bfe8bb, #ecffea 50%, #b6dcb1);
}

.hotel-card-body {
  padding: 16px;
  display: grid;
  gap: 10px;
}

.hotel-card-body h3 {
  margin: 0;
  color: var(--ink);
  font-size: 1.08rem;
  line-height: 1.12;
}

.hotel-card-body p {
  margin: 0;
  color: var(--muted);
  font-size: 0.88rem;
  line-height: 1.48;
}

.hotel-card-footer {
  display: grid;
  gap: 10px;
}

.hotel-card-footer span {
  color: var(--muted);
  font-size: 0.82rem;
}

.featured-hotel-location {
  margin: 0;
  color: var(--ink);
  font-size: 0.78rem;
  font-weight: 800;
}

.featured-hotel-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.featured-hotel-link {
  color: var(--green-deep);
  text-decoration: none;
  font-weight: 700;
}

.featured-hotel-link:hover {
  text-decoration: underline;
}

.showcase-live-note {
  margin: 0;
  color: var(--muted);
  line-height: 1.6;
}

.showcase-destination-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.showcase-destination-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 11px 16px;
  border-radius: 999px;
  border: 1px solid rgba(24, 50, 34, 0.12);
  background: rgba(255, 255, 255, 0.88);
  color: var(--ink);
  text-decoration: none;
  font-weight: 600;
}

.showcase-destination-pill:hover {
  border-color: rgba(24, 50, 34, 0.22);
  transform: translateY(-1px);
}

.hotel-card-photo-fallback,
.hotel-card-media-skeleton {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, #f1f5f2, #dfe8e2);
}

.hotel-card-photo-fallback {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ink);
  font-weight: 700;
}

.featured-hotel-card-skeleton {
  opacity: 0.86;
}

.featured-hotel-card-fallback {
  min-height: 100%;
}

.hotel-card-body-skeleton {
  gap: 12px;
}

.hotel-card-line {
  display: block;
  width: 100%;
  height: 12px;
  border-radius: 999px;
  background: linear-gradient(90deg, #edf3ee, #dfe8e2, #edf3ee);
  background-size: 220% 100%;
  animation: shimmer 1.4s ease infinite;
}

.hotel-card-line-short {
  width: 34%;
}

.hotel-card-line-medium {
  width: 62%;
}

.hotel-card-line-price {
  width: 44%;
  height: 16px;
}

.hotel-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  min-height: 40px;
  padding: 10px 14px;
  border-radius: 999px;
  background: var(--ink);
  color: #ffffff;
  text-decoration: none;
  font-size: 0.86rem;
  font-weight: 800;
}

.results-anchor-bar {
  margin-top: 22px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.anchor-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: var(--ink);
  background: rgba(255, 255, 255, 0.84);
  border: 1px solid rgba(24, 50, 34, 0.1);
  border-radius: 999px;
  padding: 10px 14px;
  font-weight: 600;
}

.bundle-summary-grid {
  margin-top: 24px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 20px;
}

.summary-card {
  min-width: 0;
}

.summary-total-card {
  background:
    linear-gradient(135deg, rgba(222, 246, 215, 0.86), rgba(255, 255, 255, 0.94)),
    rgba(255, 255, 255, 0.9);
}

.results-dual-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
  gap: 24px;
  align-items: start;
  margin-top: 28px;
}

.results-column {
  min-width: 0;
}

.results-head {
  margin-bottom: 18px;
}

.results-state {
  color: var(--muted);
  margin-bottom: 18px;
}

.offer-list,
.rate-stack,
.passenger-forms {
  display: grid;
  gap: 18px;
}

.offer-card {
  min-width: 0;
  overflow-wrap: anywhere;
}

.result-card.selected,
.stay-card.selected,
.stay-rate-card.selected {
  border: 2px solid rgba(38, 123, 49, 0.48);
  box-shadow: 0 18px 38px rgba(38, 123, 49, 0.18);
}

.offer-tag {
  display: inline-flex;
  padding: 8px 12px;
  border-radius: 999px;
  background: var(--green-soft);
  color: var(--green-deep);
  margin-bottom: 16px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 0.74rem;
  font-weight: 700;
}

.result-price-row,
.checkout-total-row {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
}

.result-price-row strong,
.checkout-total-row strong {
  font-size: 1.85rem;
}

.price-stack strong {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 6px;
}

.price-inline-label {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--muted);
}

.stay-card-top {
  align-items: stretch;
}

.stay-card-top.no-media {
  justify-content: flex-start;
}

.stay-media {
  width: 148px;
  min-width: 148px;
  height: 124px;
  border-radius: 22px;
  overflow: hidden;
  background: linear-gradient(135deg, rgba(84, 185, 72, 0.22), rgba(38, 123, 49, 0.4));
  display: flex;
  align-items: center;
  justify-content: center;
}

.stay-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.stay-media-placeholder {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  font-family: var(--font-display);
  font-size: 2.8rem;
  color: rgba(255, 255, 255, 0.92);
}

.stay-info {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.stay-card-top.no-media .stay-info {
  width: 100%;
}

.stay-rates-shell {
  display: none;
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}

.stay-rates-shell.visible {
  display: block;
}

.stay-room-card,
.stay-rate-card {
  background: rgba(255, 255, 255, 0.86);
  border-radius: 22px;
  border: 1px solid rgba(24, 50, 34, 0.08);
  padding: 18px;
}

.stay-rate-card {
  display: grid;
  gap: 14px;
}

.rate-meta strong {
  display: block;
  margin-bottom: 6px;
}

.rate-meta p {
  margin: 0;
}

.checkout-card,
.passenger-card {
  display: grid;
  gap: 16px;
}

.checkout-message,
.order-status {
  margin: 0;
}

.order-status {
  font-weight: 700;
  color: var(--green-deep);
}

.card-element-shell {
  min-height: 52px;
  border-radius: 18px;
  border: 1px solid rgba(24, 50, 34, 0.13);
  background: rgba(255, 255, 255, 0.96);
  padding: 16px;
}

.floating-trip-button {
  position: fixed;
  left: 50%;
  bottom: 18px;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto 20px;
  align-items: center;
  gap: 12px;
  transform: translateX(-50%) translateY(120%);
  width: min(650px, calc(100% - 24px));
  min-height: 72px;
  padding: 10px 14px 10px 11px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 20px;
  background: linear-gradient(135deg, #174c2e, #0e3821);
  color: #fff;
  font: inherit;
  text-align: left;
  box-shadow: 0 18px 48px rgba(8, 39, 21, 0.28);
  z-index: 60;
  opacity: 0;
  pointer-events: none;
  transition: transform 300ms cubic-bezier(0.16, 1, 0.3, 1), opacity 220ms ease, box-shadow 220ms ease;
}

.floating-trip-button.visible {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}

.floating-trip-button.visible:hover {
  box-shadow: 0 22px 56px rgba(8, 39, 21, 0.36);
  transform: translateX(-50%) translateY(-2px);
}

.floating-trip-button.visible:active {
  transform: translateX(-50%) translateY(0) scale(0.98);
}

.floating-trip-icon {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.16);
}

.floating-trip-icon svg {
  width: 23px;
  height: 23px;
}

.floating-trip-copy,
.floating-trip-price {
  display: grid;
  min-width: 0;
}

.floating-trip-copy {
  gap: 1px;
}

.floating-trip-copy small,
.floating-trip-price small {
  color: rgba(255, 255, 255, 0.7);
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.floating-trip-copy strong {
  font-size: 0.88rem;
  line-height: 1.25;
}

.floating-trip-price {
  justify-items: end;
  padding: 6px 9px;
  border-radius: 11px;
  background: rgba(255, 255, 255, 0.12);
}

.floating-trip-price strong {
  color: #ffffff;
  font-size: 0.9rem;
  line-height: 1.25;
  white-space: nowrap;
}

.floating-trip-chevron {
  width: 20px;
  height: 20px;
  transition: transform 200ms ease;
}

.floating-trip-button:hover .floating-trip-chevron {
  transform: translateX(3px);
}

.floating-trip-label {
  min-width: 0;
  padding: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: left;
  white-space: nowrap;
}

.mobile-bottom-dock {
  position: fixed;
  left: 50%;
  bottom: max(14px, env(safe-area-inset-bottom));
  z-index: 45;
  display: none;
  width: min(360px, calc(100% - 28px));
  min-height: 66px;
  padding: 8px;
  border: 1px solid rgba(17, 24, 39, 0.1);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 18px 42px rgba(17, 24, 39, 0.18);
  backdrop-filter: blur(18px);
  transform: translateX(-50%);
}

.mobile-dock-action {
  display: grid;
  grid-template-rows: 22px auto;
  place-items: center;
  align-content: center;
  gap: 3px;
  flex: 1 1 0;
  min-width: 0;
  min-height: 50px;
  padding: 7px 8px;
  border-radius: 999px;
  color: #111827;
  text-decoration: none;
  font-size: 0.66rem;
  font-weight: 800;
  line-height: 1;
}

.mobile-dock-action svg {
  width: 21px;
  height: 21px;
}

.mobile-dock-action span {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mobile-dock-action-map {
  color: #000000;
  background: #f4f7f3;
  box-shadow: inset 0 0 0 1px rgba(17, 24, 39, 0.08);
}

.toast {
  position: fixed;
  right: 20px;
  bottom: 90px;
  background: rgba(24, 50, 34, 0.94);
  color: #fff;
  padding: 14px 18px;
  border-radius: 16px;
  box-shadow: var(--shadow);
  opacity: 0;
  transform: translateY(16px);
  pointer-events: none;
  transition: opacity 180ms ease, transform 180ms ease;
  z-index: 25;
}

.toast.visible {
  opacity: 1;
  transform: translateY(0);
}

.toast:empty {
  display: none !important;
}

body.hotels-page {
  background: #ffffff;
}

body.hotels-page .floating-trip-button {
  display: none !important;
}

body.cart-page {
  background: #ffffff;
}

body.hotels-page::before {
  display: none;
}

body.cart-page::before {
  display: none;
}

body.hotels-page .page-shell {
  width: min(1280px, calc(100% - 32px));
}

body.cart-page .page-shell {
  width: min(1280px, calc(100% - 32px));
}

.nav-link-text,
.header-action-button,
.pill-button,
.hotel-cta,
.anchor-pill,
.mini-hotel-link {
  transition:
    transform 180ms ease,
    box-shadow 180ms ease,
    border-color 180ms ease,
    background 180ms ease;
}

.nav-link-text:hover,
.header-action-button:hover,
.pill-button:hover,
.hotel-cta:hover,
.anchor-pill:hover,
.mini-hotel-link:hover {
  transform: translateY(-1px);
}

.hero-actions,
.quick-link-row,
.market-footer-actions,
.market-rate-actions,
.hotel-spec-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.hero-actions {
  margin-top: 28px;
}

.hero-stat-grid {
  margin-top: 28px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.hero-stat-card,
.callout-card,
.browse-sidebar-card,
.idea-card {
  border-radius: 28px;
  border: 1px solid rgba(24, 50, 34, 0.08);
  background: #ffffff;
  box-shadow: 0 18px 38px rgba(24, 50, 34, 0.06);
}

.hero-stat-card,
.callout-card,
.browse-sidebar-card {
  padding: 20px;
}

.hero-stat-card span,
.callout-card span,
.idea-tag {
  display: inline-flex;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-size: 0.74rem;
  font-weight: 700;
  color: var(--green-deep);
}

.hero-stat-card strong,
.callout-card strong {
  display: block;
  margin-top: 8px;
  font-size: 1.12rem;
}

.hero-stat-card p,
.callout-card p,
.browse-sidebar-card p,
.idea-card p {
  margin: 10px 0 0;
  color: var(--muted);
  line-height: 1.6;
}

.marketplace-strip {
  margin-top: 28px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.marketplace-pill {
  display: inline-flex;
  align-items: center;
  padding: 12px 16px;
  border-radius: 999px;
  background: #f7faf6;
  border: 1px solid rgba(24, 50, 34, 0.08);
  color: var(--ink);
  font-weight: 600;
}

.flight-ideas-section,
.page-section {
  margin-top: 38px;
}

.editorial-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.editorial-card {
  padding: 24px;
  border-radius: 28px;
  border: 1px solid rgba(24, 50, 34, 0.08);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(255, 255, 255, 0.97)),
    linear-gradient(135deg, #edf7ea, #fff6e1);
  box-shadow: 0 18px 38px rgba(24, 50, 34, 0.06);
  display: grid;
  gap: 14px;
}

.story-kicker {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(84, 185, 72, 0.1);
  color: var(--green-deep);
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.03em;
}

.editorial-card h3 {
  margin: 0;
  font-size: 1.26rem;
  line-height: 1.18;
}

.editorial-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.65;
}

.story-button {
  justify-self: start;
}

.insight-list {
  margin: 0;
  padding-left: 18px;
  color: var(--muted);
  display: grid;
  gap: 8px;
  line-height: 1.6;
}

.flight-ideas-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

.idea-card {
  padding: 22px;
  display: grid;
  gap: 16px;
}

.idea-card h3,
.browse-sidebar-card h3,
.market-room-body h4 {
  margin: 0;
}

.idea-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.idea-meta span,
.hotel-spec-pill {
  display: inline-flex;
  align-items: center;
  padding: 8px 12px;
  border-radius: 999px;
  background: #f4f7f3;
  border: 1px solid rgba(24, 50, 34, 0.08);
  color: var(--ink);
  font-size: 0.84rem;
}

.idea-button {
  justify-self: start;
}

.idea-theme-sun {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(255, 255, 255, 0.94)),
    linear-gradient(135deg, #dff2ff, #fff4c7);
}

.idea-theme-city {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(255, 255, 255, 0.94)),
    linear-gradient(135deg, #e2e8f2, #f8fbff);
}

.idea-theme-luxe {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(255, 255, 255, 0.94)),
    linear-gradient(135deg, #fff0dd, #f0dbc0);
}

.idea-theme-test {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(255, 255, 255, 0.94)),
    linear-gradient(135deg, #e9fbe6, #dff2dd);
}

.concierge-card {
  background: #ffffff;
}

.hotels-main {
  margin-top: 30px;
  display: grid;
  gap: 8px;
}

.hotel-detail-main {
  margin-top: 30px;
  display: grid;
  gap: 24px;
}

.cart-main {
  margin-top: 30px;
  display: grid;
  gap: 24px;
}

.cart-hero {
  display: grid;
  gap: 14px;
}

.cart-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.42fr);
  gap: 24px;
  align-items: start;
}

.cart-item-card,
.cart-empty-card {
  padding: 24px;
  border-radius: 30px;
  border: 1px solid rgba(24, 50, 34, 0.08);
  background: #ffffff;
  box-shadow: 0 18px 40px rgba(24, 50, 34, 0.06);
}

.cart-item-layout {
  display: grid;
  grid-template-columns: minmax(260px, 0.48fr) minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

.cart-item-media {
  min-height: 300px;
  border-radius: 28px;
  overflow: hidden;
  background: linear-gradient(135deg, rgba(84, 185, 72, 0.22), rgba(38, 123, 49, 0.42));
  display: flex;
  align-items: center;
  justify-content: center;
}

.cart-item-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.cart-item-copy,
.cart-empty-card {
  display: grid;
  gap: 18px;
}

.cart-kpi-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.cart-kpi-card,
.cart-dates-card {
  padding: 18px;
  border-radius: 24px;
  border: 1px solid rgba(24, 50, 34, 0.08);
  background: #f7faf6;
  display: grid;
  gap: 8px;
}

.cart-kpi-card span,
.cart-dates-card p:last-child {
  color: var(--muted);
}

.cart-kpi-card strong {
  font-size: 1.28rem;
}

.cart-summary-card {
  position: sticky;
  top: 108px;
  gap: 18px;
}

.cart-empty-card h2,
.cart-item-copy h2 {
  margin: 0;
}

.cart-actions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, max-content));
  gap: 12px;
}

.hotel-detail-product {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.4fr);
  gap: 24px;
  align-items: start;
}

.hotel-detail-main {
  display: grid;
  gap: 18px;
}

.hotel-detail-gallery-hero-shell {
  width: var(--viewport-width, 100vw);
  margin-left: calc(50% - (var(--viewport-width, 100vw) / 2));
  margin-right: calc(50% - (var(--viewport-width, 100vw) / 2));
  padding: 0 0 4px;
}

.hotel-detail-primary,
.hotel-detail-sidebar,
.hotel-detail-copy,
.hotel-detail-pill-row,
.hotel-detail-sidebar-actions,
.hotel-detail-key-list,
.hotel-detail-room-list,
.hotel-detail-highlight-grid,
.hotel-detail-booking-grid,
.hotel-detail-rate-list {
  display: grid;
  gap: 14px;
}

.hotel-detail-primary {
  gap: 24px;
}

.hotel-detail-head-card,
.hotel-detail-amenities-card,
.hotel-detail-location-card,
.hotel-detail-summary-card,
.hotel-detail-info-card,
.hotel-detail-gallery-card,
.hotel-detail-rooms-section {
  background: #ffffff;
}

.hotel-detail-head-card {
  gap: 18px;
  padding: 28px;
}

.hotel-detail-star-row {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.hotel-detail-stars {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.hotel-detail-star {
  color: rgba(214, 167, 17, 0.26);
  font-size: 1.1rem;
  line-height: 1;
}

.hotel-detail-star.is-filled {
  color: #f4c430;
}

.hotel-detail-star-copy {
  margin: 0;
  display: grid;
  gap: 2px;
  color: var(--muted);
  line-height: 1.35;
}

.hotel-detail-star-copy strong {
  color: var(--ink);
  font-size: 0.96rem;
}

.hotel-detail-star-copy span {
  font-size: 0.82rem;
}

.hotel-detail-back-link {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  color: #111827;
  text-decoration: none;
  font-weight: 700;
}

.hotel-detail-back-link:hover {
  text-decoration: underline;
}

.hotel-detail-gallery-back-link {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  margin: 0 0 10px 12px;
  color: #27682a;
  font-size: 0.9rem;
  font-weight: 800;
  letter-spacing: 0.01em;
  text-decoration: none;
}

.hotel-detail-gallery-back-link:hover,
.hotel-detail-gallery-back-link:focus-visible {
  color: #1f5a2b;
  text-decoration: underline;
}

.hotel-detail-head-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 0.34fr);
  gap: 18px;
  align-items: start;
}

.hotel-detail-copy {
  gap: 12px;
}

.hotel-detail-location {
  margin: 0;
  color: var(--ink);
  font-size: 1.02rem;
  font-weight: 600;
}

.hotel-detail-summary-text {
  margin: 0;
  max-width: 760px;
}

.hotel-detail-head-price-card {
  display: grid;
  gap: 6px;
  padding: 18px 20px;
  border-radius: 24px;
  background: #ffffff;
  border: 1px solid rgba(17, 24, 39, 0.12);
  box-shadow: 0 14px 34px rgba(17, 24, 39, 0.05);
}

.hotel-detail-head-price-card strong {
  font-size: clamp(1.8rem, 4vw, 2.5rem);
  line-height: 1;
}

.hotel-detail-head-price-card p:last-child {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.hotel-detail-pill-row {
  grid-template-columns: repeat(auto-fit, minmax(160px, max-content));
}

.hotel-detail-sidebar {
  position: sticky;
  top: 20px;
}

.hotel-detail-layout,
.hotel-detail-content {
  display: grid;
  gap: 24px;
}

.hotel-detail-gallery-card {
  padding: 24px;
  border-radius: 30px;
  border: 1px solid rgba(24, 50, 34, 0.08);
  box-shadow: 0 18px 40px rgba(24, 50, 34, 0.06);
}

.hotel-detail-gallery-card-hero {
  width: min(1280px, calc(100% - 28px));
  margin-inline: auto;
  padding: 10px;
  border-radius: 36px;
  background: #ffffff;
  border: 1px solid rgba(17, 24, 39, 0.08);
  box-shadow: 0 28px 56px rgba(17, 24, 39, 0.1);
}

.hotel-detail-gallery-grid,
.hotel-detail-info-grid {
  display: grid;
  gap: 18px;
}

.hotel-detail-info-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.hotel-detail-highlight-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.hotel-detail-booking-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.hotel-detail-info-item,
.hotel-detail-key-item {
  display: grid;
  gap: 6px;
  padding: 16px 18px;
  border-radius: 20px;
  border: 1px solid rgba(17, 24, 39, 0.1);
  background: #ffffff;
}

.hotel-detail-info-item strong,
.hotel-detail-key-item strong {
  font-size: 1rem;
  line-height: 1.35;
}

.hotel-detail-info-item small,
.hotel-detail-key-item small {
  color: var(--muted);
  line-height: 1.45;
}

.hotel-detail-info-label,
.hotel-detail-key-label,
.hotel-detail-total-label {
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #4b5563;
}

.hotel-detail-gallery-hero {
  height: clamp(720px, 56vw, 980px);
  border-radius: 26px;
  object-fit: cover;
  object-position: center 44%;
  background: #eef3ee;
}

.hotel-detail-thumb-row {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.hotel-detail-thumb-row img {
  height: 108px;
}

@media (min-width: 821px) {
  .hotel-detail-gallery-card-hero {
    width: min(1220px, calc(100% - 36px));
  }

  .hotel-detail-gallery-hero {
    height: auto;
    max-height: none;
    object-fit: unset;
    object-position: initial;
    background: transparent;
  }
}

.hotel-detail-key-list p {
  margin: 0;
  color: var(--muted);
  line-height: 1.6;
}

.hotel-detail-amenities {
  margin-top: 8px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
}

.hotel-detail-summary-card {
  gap: 18px;
}

.hotel-detail-total-block {
  display: grid;
  gap: 8px;
  padding: 18px 20px;
  border-radius: 22px;
  background: #ffffff;
  border: 1px solid rgba(17, 24, 39, 0.12);
  box-shadow: 0 14px 34px rgba(17, 24, 39, 0.05);
}

.hotel-detail-total-block strong {
  font-size: clamp(1.8rem, 4vw, 2.35rem);
  line-height: 1;
}

.hotel-detail-sidebar-actions {
  grid-template-columns: 1fr;
}

.hotel-detail-mobile-bookbar,
.hotel-detail-date-feedback {
  display: none;
}

.hotel-detail-date-feedback {
  margin: 0;
  color: #b42318;
  font-weight: 600;
}

.hotel-detail-date-range-summary {
  display: grid;
  gap: 10px;
}

.hotel-detail-date-summary-card {
  display: grid;
  gap: 3px;
  padding: 14px 16px;
  border: 1px solid rgba(24, 50, 34, 0.1);
  border-radius: 18px;
  background: #ffffff;
}

.hotel-detail-date-summary-card span,
.hotel-detail-date-summary-meta {
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #4b5563;
}

.hotel-detail-date-summary-card strong {
  font-size: 1rem;
  line-height: 1.25;
  color: var(--ink);
}

.hotel-detail-date-summary-card.is-active {
  border-color: rgba(17, 24, 39, 0.2);
  background: #ffffff;
}

.hotel-detail-date-summary-meta {
  text-transform: none;
  letter-spacing: 0;
  color: var(--muted);
}

.hotel-detail-calendar-shell {
  display: grid;
  gap: 18px;
}

.hotel-detail-calendar-month {
  display: grid;
  gap: 12px;
}

.hotel-detail-calendar-month-head h4 {
  margin: 0;
  font-size: 1.02rem;
}

.hotel-detail-calendar-weekdays,
.hotel-detail-calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.hotel-detail-calendar-weekdays {
  gap: 4px;
}

.hotel-detail-calendar-weekdays span {
  text-align: center;
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--muted);
}

.hotel-detail-calendar-grid {
  gap: 4px;
}

.hotel-detail-calendar-day {
  position: relative;
  min-height: 42px;
  padding: 0;
  border: 0;
  border-radius: 14px;
  background: transparent;
  color: var(--ink);
  font: inherit;
  cursor: pointer;
}

.hotel-detail-calendar-day span {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.hotel-detail-calendar-day.is-outside {
  color: rgba(24, 50, 34, 0.3);
}

.hotel-detail-calendar-day.is-disabled {
  color: rgba(24, 50, 34, 0.22);
  cursor: not-allowed;
}

.hotel-detail-calendar-day.is-in-range {
  background: rgba(84, 185, 72, 0.14);
  border-radius: 0;
}

.hotel-detail-calendar-day.is-start,
.hotel-detail-calendar-day.is-end {
  background: var(--green-deep);
  color: #ffffff;
}

.hotel-detail-section-head {
  margin-bottom: 4px;
}

.hotel-detail-rooms-section {
  display: grid;
  gap: 18px;
  margin-top: 28px;
  padding: 28px;
  border-radius: 30px;
  border: 1px solid rgba(24, 50, 34, 0.08);
  box-shadow: 0 18px 40px rgba(24, 50, 34, 0.06);
}

.hotel-detail-rooms-head {
  align-items: end;
}

.hotel-detail-rooms-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.hotel-detail-room-card {
  background: #ffffff;
  border: 1px solid rgba(17, 24, 39, 0.1);
  box-shadow: 0 16px 36px rgba(17, 24, 39, 0.05);
}

.hotel-detail-room-body {
  gap: 18px;
}

.hotel-detail-room-header {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: start;
}

.hotel-detail-room-price-badge {
  min-width: 180px;
  display: grid;
  gap: 4px;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid rgba(17, 24, 39, 0.1);
  background: #ffffff;
  text-align: right;
}

.hotel-detail-room-price-badge strong {
  font-size: 1.12rem;
  line-height: 1.1;
  color: #111827;
}

.hotel-detail-room-price-badge span {
  font-size: 0.78rem;
  color: #4b5563;
  line-height: 1.4;
}

.hotel-detail-room-summary,
.hotel-detail-rate-note {
  margin: 0;
  color: var(--muted);
  line-height: 1.6;
}

.hotel-detail-rate-list {
  gap: 12px;
}

.hotel-detail-rate-card {
  gap: 16px;
  padding: 18px;
  border-radius: 24px;
  background: #ffffff;
  border: 1px solid rgba(17, 24, 39, 0.1);
}

.hotel-detail-rate-main,
.hotel-detail-rate-footer {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: start;
}

.hotel-detail-rate-copy {
  gap: 10px;
}

.hotel-detail-rate-price {
  min-width: 170px;
  text-align: right;
  display: grid;
  gap: 4px;
}

.hotel-detail-rate-actions {
  justify-content: flex-end;
}

.hotel-detail-rate-upgrade {
  color: #4b5563;
  font-size: 0.78rem;
  line-height: 1.35;
}

.hotel-spec-pill-accent {
  background: rgba(84, 185, 72, 0.16);
  color: #173b12;
}

.hotel-detail-location-grid {
  display: grid;
  grid-template-columns: minmax(240px, 0.72fr) minmax(0, 1.28fr);
  gap: 18px;
  align-items: stretch;
}

.hotel-detail-location-copy {
  display: grid;
  gap: 12px;
  padding: 22px;
  border-radius: 24px;
  border: 1px solid rgba(17, 24, 39, 0.1);
  background: #ffffff;
}

.hotel-detail-location-label {
  margin: 0;
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #6b7280;
}

.hotel-detail-location-copy strong {
  font-size: 1.08rem;
  line-height: 1.4;
  color: #111827;
}

.hotel-detail-location-note {
  margin: 0;
  color: #4b5563;
  line-height: 1.6;
}

.hotel-detail-map-box {
  position: relative;
  display: block;
  min-height: 260px;
  overflow: hidden;
  border-radius: 28px;
  border: 1px solid rgba(17, 24, 39, 0.12);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.18)),
    linear-gradient(135deg, #f8fafc, #eef2f7);
  box-shadow: 0 20px 44px rgba(17, 24, 39, 0.08);
  text-decoration: none;
}

.hotel-detail-map-embed {
  width: 100%;
  height: 100%;
  min-height: 260px;
  border: 0;
  display: block;
}

.hotel-detail-map-fallback {
  position: absolute;
  inset: 0;
  display: grid;
  place-content: center;
  gap: 10px;
  padding: 24px;
  text-align: center;
  color: #111827;
  background:
    radial-gradient(circle at 20% 20%, rgba(84, 185, 72, 0.14), transparent 32%),
    radial-gradient(circle at 80% 30%, rgba(17, 24, 39, 0.08), transparent 28%),
    linear-gradient(135deg, #f8fafc, #eef2f7);
}

.hotel-detail-map-fallback[hidden] {
  display: none;
}

.hotel-detail-map-fallback-pin {
  width: 20px;
  height: 20px;
  margin: 0 auto;
  border-radius: 999px;
  background: #54b948;
  box-shadow: 0 0 0 8px rgba(84, 185, 72, 0.14);
}

.hotel-detail-map-fallback strong,
.hotel-detail-map-fallback p {
  margin: 0;
}

.hotel-detail-map-fallback p {
  color: #4b5563;
  line-height: 1.55;
}

.hotel-detail-map-overlay {
  position: absolute;
  right: 16px;
  bottom: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 14px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  color: #111827;
  font-size: 0.84rem;
  font-weight: 700;
  box-shadow: 0 10px 26px rgba(17, 24, 39, 0.14);
}

body.hotel-detail-page .amenity-pill {
  width: 100%;
  justify-content: center;
  padding: 12px 14px;
  border: 1px solid rgba(17, 24, 39, 0.1);
  background: #ffffff;
  color: #111827;
  border-radius: 16px;
  text-align: center;
}

body.hotel-detail-page .button.button-primary {
  background: #54b948;
  color: #08130b;
}

body.hotel-detail-page .button.button-primary:hover {
  background: #4cad41;
}

body.hotel-detail-page .button.button-secondary {
  background: #ffffff;
  color: #111827;
  border: 1px solid rgba(17, 24, 39, 0.14);
}

body.hotel-detail-page .button.button-secondary:hover {
  border-color: rgba(17, 24, 39, 0.28);
}

body.hotel-detail-page .hotel-detail-hero-action[data-detail-share] {
  border: 1px solid rgba(17, 24, 39, 0.12);
  background: rgba(255, 255, 255, 0.94);
  color: #111827;
  box-shadow: 0 12px 28px rgba(17, 24, 39, 0.12);
}

body.hotel-detail-page .hotel-detail-hero-action[data-detail-share]:hover,
body.hotel-detail-page .hotel-detail-hero-action[data-detail-share]:focus-visible {
  background: #ffffff;
}

body.hotel-detail-page .hotel-detail-hero-action-wishlist {
  color: #ffffff;
  text-shadow: 0 6px 18px rgba(17, 24, 39, 0.42);
}

body.hotel-detail-page .hotel-gallery-counter {
  display: inline-flex;
}

.hotels-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.04fr) minmax(360px, 0.96fr);
  gap: 24px;
  align-items: start;
}

.hotels-hero-copy {
  padding-top: 10px;
}

.hero-callout-grid {
  margin-top: 26px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.search-surface {
  padding: 24px;
  border-radius: 30px;
  background: #f7faf6;
  border: 1px solid rgba(24, 50, 34, 0.08);
  box-shadow: 0 20px 42px rgba(24, 50, 34, 0.06);
  display: grid;
  gap: 16px;
}

.market-search-form {
  display: grid;
  gap: 18px;
}

.market-search-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: end;
}

.market-search-head .search-subtext {
  max-width: 320px;
}

.browse-layout {
  display: grid;
  grid-template-columns: minmax(260px, 0.34fr) minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

.browse-sidebar {
  display: grid;
  gap: 18px;
  position: sticky;
  top: 108px;
}

.browse-results {
  min-width: 0;
}

.market-results-head {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: end;
  margin-bottom: 18px;
}

.hotel-market-grid {
  display: grid;
  gap: 20px;
}

.hotel-market-card {
  border-radius: 30px;
  border: 1px solid rgba(24, 50, 34, 0.08);
  background: #ffffff;
  box-shadow: 0 18px 40px rgba(24, 50, 34, 0.06);
  padding: 22px;
  display: grid;
  gap: 18px;
}

.hotel-market-card.selected {
  border: 2px solid rgba(38, 123, 49, 0.34);
  box-shadow: 0 18px 42px rgba(38, 123, 49, 0.14);
}

.hotel-market-layout,
.market-room-layout {
  display: grid;
  grid-template-columns: minmax(250px, 0.52fr) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}

.market-room-layout.no-gallery {
  grid-template-columns: 1fr;
}

.hotel-market-body,
.market-room-body {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.hotel-market-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.hotel-gallery,
.room-gallery {
  display: grid;
  gap: 10px;
}

.hotel-gallery-stage {
  position: relative;
}

.hotel-gallery-hero {
  width: 100%;
  height: 220px;
  object-fit: cover;
  border-radius: 22px;
  display: block;
}

.hotel-gallery-badge {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(17, 24, 39, 0.76);
  color: #ffffff;
  font-size: 0.86rem;
  font-weight: 700;
  backdrop-filter: blur(10px);
}

.hotel-gallery-badge-detail {
  top: 18px;
  left: 18px;
}

.hotel-detail-hero-actions {
  position: absolute;
  top: 18px;
  left: 18px;
  right: 18px;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  pointer-events: none;
}

.hotel-detail-hero-action {
  pointer-events: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border: 0;
  border-radius: 999px;
  background: rgba(17, 24, 39, 0.72);
  color: #ffffff;
  box-shadow: 0 12px 28px rgba(17, 24, 39, 0.22);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  cursor: pointer;
  transition:
    transform 180ms ease,
    background 180ms ease,
    color 180ms ease,
    box-shadow 180ms ease;
}

.hotel-detail-hero-action:hover,
.hotel-detail-hero-action:focus-visible {
  transform: translateY(-1px);
  background: rgba(17, 24, 39, 0.84);
  box-shadow: 0 16px 30px rgba(17, 24, 39, 0.26);
}

.hotel-detail-hero-action:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.92);
  outline-offset: 2px;
}

.hotel-detail-hero-action-wishlist.is-active {
  color: #d1496b;
}

.hotel-detail-hero-action-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.2rem;
  height: 1.2rem;
  line-height: 1;
}

.hotel-detail-hero-action-icon svg {
  width: 100%;
  height: 100%;
  display: block;
}

.hotel-detail-hero-action-wishlist {
  width: auto;
  height: auto;
  padding: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  color: #ffffff;
}

.hotel-detail-hero-action-wishlist:hover,
.hotel-detail-hero-action-wishlist:focus-visible {
  background: transparent;
  box-shadow: none;
}

.hotel-detail-hero-action-wishlist .hotel-detail-hero-action-icon {
  width: 2.2rem;
  height: 2.2rem;
  text-shadow: 0 6px 18px rgba(17, 24, 39, 0.42);
  filter: drop-shadow(0 6px 18px rgba(17, 24, 39, 0.42));
}

.hotel-detail-hero-action-icon-share {
  width: 1.28rem;
  height: 1.28rem;
}

.hotel-detail-hero-action[data-detail-share] {
  width: 50px;
  height: 50px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: rgba(17, 24, 39, 0.62);
}

.hotel-detail-hero-action-wishlist.is-bouncing .hotel-detail-hero-action-icon {
  animation: hotel-heart-pop 420ms cubic-bezier(0.2, 0.9, 0.2, 1);
}

@keyframes hotel-heart-pop {
  0% {
    transform: scale(0.88);
  }

  35% {
    transform: scale(1.26);
  }

  60% {
    transform: scale(0.95);
  }

  100% {
    transform: scale(1);
  }
}

@media (min-width: 821px) {
  .hotel-detail-hero-action[data-detail-share] {
    width: 56px;
    height: 56px;
  }

  .hotel-detail-hero-action-wishlist .hotel-detail-hero-action-icon {
    width: 2.65rem;
    height: 2.65rem;
  }

  .hotel-detail-hero-action-icon-share {
    width: 1.42rem;
    height: 1.42rem;
  }
}

.room-gallery .hotel-gallery-hero {
  height: 180px;
}

.hotel-gallery-dots {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding-top: 14px;
}

.hotel-gallery-dot {
  width: 9px;
  height: 9px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: rgba(17, 24, 39, 0.2);
  cursor: pointer;
  transition: transform 180ms ease, background 180ms ease;
}

.hotel-gallery-dot.active {
  background: #111827;
  transform: scale(1.22);
}

.hotel-gallery-empty {
  position: relative;
  min-height: 220px;
  border-radius: 22px;
  background: linear-gradient(135deg, rgba(84, 185, 72, 0.22), rgba(38, 123, 49, 0.42));
  overflow: hidden;
}

.room-gallery.hotel-gallery-empty {
  min-height: 180px;
}

.hotel-gallery-empty .stay-media-placeholder {
  min-height: inherit;
}

.showcase-gallery {
  position: relative;
}

.showcase-chip-wrap {
  position: absolute;
  top: 16px;
  left: 16px;
  z-index: 1;
}

.hotel-market-card-showcase .market-footer-actions {
  margin-top: 4px;
}

.hotel-gallery-stage-detail .hotel-gallery-hero {
  cursor: pointer;
}

.hotel-gallery-nav,
.hotel-gallery-counter {
  position: absolute;
  z-index: 2;
}

.hotel-gallery-nav {
  top: 50%;
  transform: translateY(-50%);
  border: 0;
  width: 48px;
  height: 48px;
  padding: 0;
  border-radius: 50%;
  background: rgba(17, 24, 39, 0.68);
  color: #ffffff;
  font: inherit;
  font-weight: 700;
  font-size: 1.2rem;
  line-height: 1;
  cursor: pointer;
  backdrop-filter: blur(10px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.hotel-gallery-nav-prev {
  left: 18px;
}

.hotel-gallery-nav-next {
  right: 18px;
}

.hotel-gallery-counter {
  right: 18px;
  bottom: 18px;
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(17, 24, 39, 0.72);
  color: #ffffff;
  font-size: 0.82rem;
  font-weight: 700;
  backdrop-filter: blur(10px);
}

@media (max-width: 767px) {
  .hotel-gallery-stage-detail .hotel-gallery-nav {
    display: none;
  }
}

.hotel-location-line {
  font-weight: 600;
  color: var(--ink);
}

.hotel-detail-list {
  display: grid;
  gap: 6px;
}

.hotel-detail-list p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.hotel-market-footer {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: center;
}

.market-room-shell {
  display: none;
  padding-top: 18px;
  border-top: 1px solid rgba(24, 50, 34, 0.1);
}

.market-room-shell.visible {
  display: block;
}

.market-room-card {
  border-radius: 24px;
  border: 1px solid rgba(24, 50, 34, 0.08);
  background: #f9fbf8;
  padding: 18px;
}

.market-rate-card {
  border-radius: 22px;
  border: 1px solid rgba(24, 50, 34, 0.08);
  background: #ffffff;
  padding: 18px;
  display: grid;
  gap: 14px;
}

.market-rate-card.selected {
  border-color: rgba(38, 123, 49, 0.28);
  box-shadow: 0 12px 28px rgba(38, 123, 49, 0.1);
}

.quote-note {
  margin: 0;
  color: var(--green-deep);
  font-weight: 600;
}

.hotel-cta-button {
  border: 0;
  cursor: pointer;
  font: inherit;
}

@media (max-width: 1080px) {
  .hero-highlights {
    grid-template-columns: 1fr;
  }

  .hotels-search-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .hotels-filter-bar {
    grid-template-columns: 1fr;
  }

  .homepage-hero,
  .featured-hotels-grid,
  .flight-ideas-grid,
  .hero-stat-grid,
  .hero-callout-grid,
  .editorial-grid,
  .cart-layout,
  .cart-item-layout,
  .hotel-detail-product,
  .hotel-detail-info-grid,
  .hotel-detail-highlight-grid,
  .hotel-detail-booking-grid,
  .hotels-hero,
  .browse-layout,
  .flights-workspace {
    grid-template-columns: 1fr;
  }

  .browse-sidebar,
  .cart-summary-card,
  .hotel-detail-sidebar,
  .flights-search-panel {
    position: static;
  }

  .hotel-detail-gallery-card-hero {
    width: calc(100% - 12px);
    padding: 8px;
    border-radius: 30px;
  }

  .hotel-detail-gallery-hero {
    height: clamp(500px, 58vw, 760px);
  }

  .hotel-detail-location-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 820px) {
  .field-grid,
  .bundle-field-grid,
  .flights-field-grid,
  .search-actions,
  .cart-kpi-grid {
    grid-template-columns: 1fr;
  }

  .search-form-head,
  .bundle-intro,
  .hotel-status-row,
  .section-head,
  .stay-card-top,
  .result-price-row,
  .checkout-total-row,
  .market-search-head,
  .market-results-head,
  .hotel-market-footer,
  .hotel-detail-rate-main,
  .hotel-detail-rate-footer,
  .flights-page-head,
  .flights-results-head {
    flex-direction: column;
    align-items: stretch;
  }

  .stay-media {
    width: 100%;
    min-width: 0;
    height: 220px;
  }

  .search-actions {
    display: grid;
  }

  .search-subtext {
    max-width: none;
  }

  .results-anchor-bar {
    gap: 8px;
  }

  .hotel-market-layout,
  .market-room-layout {
    grid-template-columns: 1fr;
  }

  .hotel-detail-head-main {
    grid-template-columns: 1fr;
  }

  .hotel-detail-gallery-hero {
    height: clamp(360px, 62vw, 520px);
  }

  .hotel-detail-map-box,
  .hotel-detail-map-embed {
    min-height: 220px;
  }

  .site-header,
  .site-nav,
  .header-actions {
    flex-wrap: wrap;
  }

  .trip-search-bar,
  .download-banner-card {
    grid-template-columns: 1fr;
    flex-direction: column;
    align-items: stretch;
  }

  .hotels-search-grid {
    grid-template-columns: 1fr;
  }

  .hotels-search-card {
    padding: 24px;
  }

  .hotels-search-form {
    width: 100%;
  }

  .hotels-search-head {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }

  .hotels-search-head h1 {
    max-width: none;
  }

  .hotels-filter-group {
    gap: 8px;
  }

  .hotel-browse-track {
    grid-auto-columns: minmax(280px, 86vw);
  }
}

@media (max-width: 720px) {
  .page-shell {
    width: calc(100% - 20px);
    padding-top: 12px;
  }

  .site-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "brand actions"
      "nav nav";
    align-items: center;
    gap: 8px 8px;
    width: var(--viewport-width, 100vw);
    margin-left: calc(50% - (var(--viewport-width, 100vw) / 2));
    margin-right: calc(50% - (var(--viewport-width, 100vw) / 2));
    border-radius: 0;
    padding: 12px max(12px, calc((var(--viewport-width, 100vw) - 100%) / 2 + 12px));
  }

  .site-header > .wordmark {
    grid-area: brand;
    font-size: 1.72rem;
  }

  .wordmark-logo {
    height: 46px;
    max-width: min(248px, 62vw);
  }

  .footer-brand-block .wordmark-logo {
    height: 48px;
    max-width: min(252px, 64vw);
  }

  .site-header > .header-actions {
    grid-area: actions;
    width: auto;
    display: flex;
    justify-content: flex-end;
    gap: 6px;
  }

  .site-header > .site-nav {
    grid-area: nav;
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    gap: 14px;
    overflow-x: auto;
    padding-top: 8px;
    border-top: 1px solid rgba(24, 50, 34, 0.08);
    scrollbar-width: none;
  }

  .site-header > .site-nav::-webkit-scrollbar {
    display: none;
  }

  .site-header .nav-link-map {
    display: none;
  }

  body.primary-travel-page .site-header > .site-nav {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    overflow: visible;
    padding-top: 8px;
    text-align: center;
  }

  .hero-highlights {
    grid-template-columns: 1fr;
  }

  .search-card,
  .chat-card,
  .results-panel,
  .checkout-panel,
  .offer-card,
  .checkout-card,
  .passenger-card,
  .hotel-detail-gallery-card,
  .hotel-market-card {
    padding: 22px;
  }

  .chat-form {
    grid-template-columns: 1fr;
  }

  .chat-bubble {
    max-width: 100%;
  }

  h1 {
    font-size: 2.85rem;
  }

  .mini-hotel-link,
  .market-footer-actions .button,
  .market-rate-actions .button,
  .hero-actions .button {
    display: inline-flex;
    align-items: center;
    width: 100%;
    justify-content: center;
  }

  .site-header .nav-link-text,
  .site-header .header-action-button {
    width: auto;
    white-space: nowrap;
  }

  .site-header .nav-link-text {
    min-height: 32px;
    padding: 4px 0;
    font-size: 0.88rem;
  }

  body.primary-travel-page .site-header .nav-link-text {
    justify-content: center;
  }

  .site-header .header-action-button {
    min-height: 34px;
    padding: 8px 10px;
    font-size: 0.84rem;
  }

  .site-header .header-utility-link {
    max-width: 110px;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .site-header .cart-count {
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    font-size: 0.72rem;
  }

  .auth-grid,
  .account-card-head {
    grid-template-columns: 1fr;
    flex-direction: column;
  }

  .trip-search-bar {
    padding: 12px;
  }

  .trip-search-bar input {
    padding: 12px 10px;
  }

  .quick-link-row,
  .market-footer-actions,
  .market-rate-actions,
  .hotel-spec-row,
  .idea-meta,
  .hotel-detail-rooms-steps {
    flex-direction: column;
  }

  .cart-actions {
    grid-template-columns: 1fr;
  }

  .hotel-thumb-row {
    grid-template-columns: 1fr 1fr 1fr;
  }

  .hotel-detail-gallery-hero-shell {
    padding: 0 0 2px;
  }

  .hotel-detail-gallery-card-hero {
    width: calc(100% - 8px);
    padding: 4px;
    border-radius: 18px;
  }

  .hotel-gallery-badge {
    top: 12px;
    left: 12px;
    min-height: 34px;
    padding: 7px 10px;
    font-size: 0.78rem;
  }

  .hotel-gallery-nav {
    min-width: 56px;
    min-height: 36px;
    padding: 0 12px;
    font-size: 0.82rem;
  }

  .hotel-gallery-nav-prev {
    left: 12px;
  }

  .hotel-gallery-nav-next {
    right: 12px;
  }

  .hotel-gallery-counter {
    right: 12px;
    bottom: 12px;
    min-height: 30px;
    padding: 6px 10px;
    font-size: 0.76rem;
  }

  .hotel-card-media-counter {
    right: 12px;
    bottom: 12px;
    min-height: 30px;
    padding: 6px 10px;
    font-size: 0.74rem;
  }

  .hotel-card-media-nav {
    min-width: 50px;
    min-height: 34px;
    padding: 0 10px;
    font-size: 0.74rem;
  }

  .hotel-card-media-nav-prev {
    left: 12px;
  }

  .hotel-card-media-nav-next {
    right: 12px;
  }

  .hotel-detail-head-card,
  .hotel-detail-rooms-section,
  .hotel-detail-location-card {
    padding: 22px;
  }

  .hotel-detail-rate-price {
    min-width: 0;
    text-align: left;
  }

  .hotel-detail-room-price-badge {
    min-width: 0;
    width: 100%;
    text-align: left;
  }

  .floating-trip-button {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
  }

  body.hotels-page .page-shell {
    width: calc(100% - 16px);
    padding: 12px 0 52px;
  }

  .hotels-main-refined {
    margin-top: 18px;
    gap: 18px;
  }

  .hotels-search-card {
    padding: 18px 14px;
    border-radius: 28px;
    min-height: 0;
  }

  .hotels-search-form {
    padding: 14px;
    gap: 14px;
    border-radius: 22px;
  }

  .hotels-search-head h1 {
    font-size: clamp(2.15rem, 8vw, 2.8rem);
  }

  .hotels-quick-row {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 10px;
    padding-bottom: 4px;
    scrollbar-width: none;
  }

  .hotels-quick-row::-webkit-scrollbar {
    display: none;
  }

  .hotels-quick-row .pill-button {
    flex: 0 0 auto;
  }

  .hotels-browse-section {
    gap: 16px;
    padding: 18px;
    border-radius: 26px;
  }

  .hotels-selected-card {
    padding: 18px;
    border-radius: 22px;
  }

  .hotels-filter-bar {
    gap: 14px;
  }

  .hotels-filter-group {
    gap: 8px;
  }

  .filter-chip {
    min-width: 0;
    justify-content: flex-start;
    padding: 0 12px;
    font-size: 0.86rem;
  }

  .hotel-filter-dialog-panel {
    padding: 22px;
    border-radius: 24px;
  }

  .hotel-filter-options-grid {
    grid-template-columns: 1fr;
  }

  .hotel-lane-section {
    gap: 10px;
  }

  .hotel-browse-track {
    grid-auto-columns: minmax(248px, 86vw);
    gap: 14px;
    padding: 4px 0 8px;
  }

  body.hotels-page .featured-hotel-card {
    border-radius: 24px;
  }

  body.hotels-page .hotel-card-media {
    min-height: 212px;
  }
}

@media (max-width: 540px) {
  .hotel-detail-main {
    gap: 0;
  }

  .hotel-detail-gallery-hero-shell {
    padding: 0;
  }

  .hotel-detail-gallery-card-hero {
    width: 100%;
    padding: 0;
    border-radius: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
  }

  .hotel-detail-gallery-hero {
    height: clamp(300px, 78vw, 420px);
    border-radius: 0;
  }

  .hotel-detail-hero-actions {
    top: 14px;
    left: 14px;
    right: 14px;
  }

  .hotel-detail-hero-action {
    width: 42px;
    height: 42px;
  }

  .hotel-detail-product {
    width: var(--viewport-width, 100vw);
    margin-left: calc(50% - (var(--viewport-width, 100vw) / 2));
    margin-right: calc(50% - (var(--viewport-width, 100vw) / 2));
    margin-top: -22px;
    padding: 18px 12px 0;
    background: #ffffff;
    border-radius: 26px 26px 0 0;
    position: relative;
    z-index: 2;
  }

  .hotel-detail-primary,
  .hotel-detail-sidebar {
    gap: 16px;
  }

  .hotel-detail-head-card,
  .hotel-detail-summary-card,
  .hotel-detail-info-card,
  .hotel-detail-amenities-card,
  .hotel-detail-location-card {
    border-radius: 22px;
  }

  .hotel-detail-head-card {
    padding-top: 18px;
  }

  .hotel-detail-location-copy {
    padding: 18px;
    border-radius: 20px;
  }

  .hotel-filter-dialog {
    padding: 12px;
  }

  .hotel-filter-dialog-head {
    flex-direction: column;
  }

  .hotel-filter-dialog-close,
  .hotel-filter-dialog-actions .button {
    width: 100%;
  }

  .hotel-filter-dialog-actions {
    flex-direction: column-reverse;
  }

  .hotels-search-card {
    padding: 14px 10px;
    border-radius: 22px;
  }

  .hotels-search-form {
    padding: 12px;
    border-radius: 18px;
  }

  .hotels-search-head h1 {
    font-size: 1.95rem;
    line-height: 1;
  }

  .hotels-filter-group {
    gap: 8px;
  }

  .home-showcase-controls {
    width: 100%;
    justify-content: stretch;
  }

  .home-showcase-controls .home-rail-button {
    flex: 1 1 0;
    min-width: 0;
  }

  .hotel-browse-track {
    grid-auto-columns: minmax(230px, 88vw);
  }
}

body.home-page {
  --home-bg: #f4f8f1;
  --home-card: rgba(255, 255, 255, 0.94);
  --home-card-soft: #eef7ea;
  --home-card-cool: #f7fbf6;
  --home-ink: #183222;
  --home-muted: #5f6f60;
  --home-line: rgba(24, 50, 34, 0.09);
  --home-accent: #54b948;
  --home-accent-deep: #267b31;
  --home-accent-soft: rgba(84, 185, 72, 0.1);
  background: #ffffff;
}

body.home-page,
body.home-page .nav-link-text,
body.home-page .header-action-button,
body.home-page .home-footer-links a,
body.home-page .home-inline-link,
body.home-page .featured-hotel-link {
  color: var(--home-ink);
}

body.home-page .page-shell {
  width: min(1280px, calc(100% - 36px));
  padding: 20px 0 72px;
}

body.home-page .site-header {
  padding: 18px max(20px, calc((var(--viewport-width, 100vw) - 1280px) / 2 + 18px));
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 10px 28px rgba(17, 24, 39, 0.08);
}

body.home-page .wordmark {
  color: var(--home-accent-deep);
}

body.home-page .nav-link-text {
  color: var(--home-muted);
}

body.home-page .header-action-button {
  border-color: var(--home-line);
}

body.home-page .nav-link-active::after {
  background: var(--home-accent-deep);
}

body.home-page .header-action-button {
  background: rgba(255, 255, 255, 0.92);
}

body.home-page .profile-action-button {
  width: 48px;
  min-width: 48px;
  height: 48px;
  padding: 0;
}

.profile-icon {
  width: 22px;
  height: 22px;
  display: block;
}

body.home-page .cart-count {
  background: var(--home-accent-deep);
}

body.hotels-page {
  --home-bg: #f4f8f1;
  --home-card: rgba(255, 255, 255, 0.94);
  --home-card-soft: #eef7ea;
  --home-card-cool: #f7fbf6;
  --home-ink: #183222;
  --home-muted: #5f6f60;
  --home-line: rgba(24, 50, 34, 0.09);
  --home-accent: #54b948;
  --home-accent-deep: #267b31;
  --home-accent-soft: rgba(84, 185, 72, 0.1);
  background: #ffffff;
}

body.hotels-page .page-shell {
  width: min(1280px, calc(100% - 36px));
  padding: 20px 0 72px;
}

body.hotels-page .site-header {
  padding: 18px max(20px, calc((var(--viewport-width, 100vw) - 1280px) / 2 + 18px));
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 10px 28px rgba(17, 24, 39, 0.08);
}

body.hotels-page .wordmark {
  color: var(--home-accent-deep);
}

body.hotels-page .nav-link-text {
  color: var(--home-muted);
}

body.hotels-page .header-action-button {
  border-color: var(--home-line);
  background: rgba(255, 255, 255, 0.92);
}

body.hotels-page .nav-link-active::after {
  background: var(--home-accent-deep);
}

body.hotels-page .cart-count {
  background: var(--home-accent-deep);
}

body.primary-travel-page {
  --home-bg: #f4f8f1;
  --home-card: rgba(255, 255, 255, 0.94);
  --home-card-soft: #eef7ea;
  --home-card-cool: #f7fbf6;
  --home-ink: #183222;
  --home-muted: #5f6f60;
  --home-line: rgba(24, 50, 34, 0.09);
  --home-accent: #54b948;
  --home-accent-deep: #267b31;
  --home-accent-soft: rgba(84, 185, 72, 0.1);
  background: #ffffff;
}

body.primary-travel-page,
body.primary-travel-page .nav-link-text,
body.primary-travel-page .header-action-button,
body.primary-travel-page .home-footer-links a,
body.primary-travel-page .home-inline-link,
body.primary-travel-page .featured-hotel-link {
  color: var(--home-ink);
}

body.primary-travel-page .page-shell {
  width: min(1280px, calc(100% - 36px));
  padding: 20px 0 72px;
}

body.primary-travel-page .site-header {
  padding: 18px max(20px, calc((var(--viewport-width, 100vw) - 1280px) / 2 + 18px));
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 10px 28px rgba(17, 24, 39, 0.08);
}

body.primary-travel-page .wordmark {
  color: var(--home-accent-deep);
}

body.primary-travel-page .nav-link-text {
  color: var(--home-muted);
}

body.primary-travel-page .header-action-button {
  border-color: var(--home-line);
  background: rgba(255, 255, 255, 0.92);
}

body.primary-travel-page .nav-link-active {
  color: var(--home-ink);
}

body.primary-travel-page .nav-link-active::after {
  background: var(--home-accent-deep);
}

body.primary-travel-page .cart-count {
  background: var(--home-accent-deep);
}

body.info-page {
  --home-bg: #f4f8f1;
  --home-card: rgba(255, 255, 255, 0.94);
  --home-card-soft: #eef7ea;
  --home-card-cool: #f7fbf6;
  --home-ink: #183222;
  --home-muted: #5f6f60;
  --home-line: rgba(24, 50, 34, 0.09);
  --home-accent: #54b948;
  --home-accent-deep: #267b31;
  --home-accent-soft: rgba(84, 185, 72, 0.1);
}

body.info-page,
body.info-page .nav-link-text,
body.info-page .header-action-button {
  color: var(--home-ink);
}

body.info-page .page-shell {
  width: min(1280px, calc(100% - 36px));
  padding: 20px 0 72px;
}

body.info-page .site-header {
  padding: 18px max(20px, calc((var(--viewport-width, 100vw) - 1280px) / 2 + 18px));
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 10px 28px rgba(17, 24, 39, 0.08);
}

body.info-page .wordmark {
  color: var(--home-accent-deep);
}

body.info-page .nav-link-text {
  color: var(--home-muted);
}

body.info-page .header-action-button {
  border-color: var(--home-line);
  background: rgba(255, 255, 255, 0.92);
}

body.info-page .nav-link-active {
  color: var(--home-ink);
}

body.info-page .nav-link-active::after {
  background: var(--home-accent-deep);
}

body.info-page .cart-count {
  background: var(--home-accent-deep);
}

body.hotels-page .button-primary {
  background: var(--green-deep);
  box-shadow: none;
}

body.hotels-page .button-secondary {
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid var(--home-line);
  color: var(--home-ink);
}

.hotels-main-refined {
  margin-top: 20px;
  display: grid;
  gap: 24px;
}

body.hotels-page .hotels-search-stage {
  width: min(1120px, calc(100% - 32px));
  margin: 16px auto 0;
}

body.hotels-page .hotels-search-card {
  min-height: 0;
  grid-template-columns: 1fr;
  gap: 0;
  padding: 0;
  align-items: stretch;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.hotels-page .hotels-search-form {
  width: 100%;
  display: block;
  padding: 20px;
  border: 1px solid rgba(24, 50, 34, 0.1);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 12px 28px rgba(17, 24, 39, 0.07);
  justify-self: center;
}

body.hotels-page .search-overlay-trigger-hotels {
  max-width: 920px;
  margin: 0 auto;
}

body.hotels-page .hotels-lane-stack {
  display: grid;
  gap: 18px;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card {
  display: grid;
  grid-template-columns: minmax(280px, 0.72fr) minmax(0, 1.28fr);
  align-items: stretch;
  border-radius: 26px;
  overflow: hidden;
  min-height: 278px;
  height: 278px;
  cursor: pointer;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card:hover {
  transform: none;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-media {
  min-height: 100%;
  aspect-ratio: auto;
  padding: 0;
  display: block;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-photo-grid {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 170px 88px;
  gap: 4px;
  width: 100%;
  height: 100%;
  min-height: 100%;
  padding: 4px;
  box-sizing: border-box;
  align-items: stretch;
  position: relative;
  z-index: 0;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-photo-hero-wrap,
body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-photo-stack {
  width: 100%;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-photo-hero-wrap {
  background: #eef3ee;
  height: 170px;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-photo-stack {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px;
  height: 88px;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-photo-hero,
body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-photo-thumb,
body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-photo-placeholder {
  position: relative;
  inset: auto;
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  border-radius: 0;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-photo-hero {
  object-fit: cover;
  object-position: center;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-photo-placeholder {
  overflow: hidden;
  background: linear-gradient(145deg, rgba(221, 230, 222, 0.92), rgba(241, 246, 241, 0.98));
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-photo-placeholder .stay-media-placeholder {
  width: 100%;
  height: 100%;
  border-radius: 0;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-media-top {
  padding: 16px;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-media-counter {
  right: 14px;
  bottom: 14px;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-body {
  padding: 18px 20px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas:
    "location price"
    "title price"
    "summary price"
    "specs price";
  gap: 8px 16px;
  align-items: start;
  background: #ffffff;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .featured-hotel-location {
  grid-area: location;
  font-size: 0.84rem;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-body h3 {
  grid-area: title;
  font-size: 1.18rem;
  line-height: 1.12;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-body > p:not(.featured-hotel-location) {
  grid-area: summary;
  font-size: 0.82rem;
  line-height: 1.28;
  margin: 0;
  max-width: 34ch;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-spec-row {
  grid-area: specs;
  gap: 8px;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-spec-pill {
  font-size: 0.74rem;
  padding: 6px 9px;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-price-stack {
  grid-area: price;
  min-width: 220px;
  text-align: left;
  align-self: stretch;
  display: grid;
  align-content: start;
  justify-items: start;
  gap: 8px;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-price-primary {
  font-size: 0.92rem;
  line-height: 1.02;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-price-primary span,
body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-price-secondary {
  font-size: 0.8rem;
}

.hotels-search-head {
  display: grid;
  justify-items: center;
  gap: 8px;
  text-align: center;
}

.hotels-search-head h1 {
  max-width: none;
  font-size: clamp(2.35rem, 4.5vw, 4.15rem);
  line-height: 0.98;
}

.hotels-search-head .search-subtext {
  max-width: 560px;
}

.hotel-customer-search {
  display: grid;
  grid-template-columns:
    minmax(260px, 2fr)
    minmax(220px, 1.45fr)
    minmax(104px, 0.7fr)
    minmax(104px, 0.7fr)
    minmax(164px, 0.9fr);
  align-items: end;
  gap: 12px;
  width: 100%;
  min-height: 0;
  margin: 0 auto;
  padding: 0;
  border-radius: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.hotel-form-field {
  position: relative;
  display: grid;
  gap: 7px;
  min-width: 0;
}

.hotel-form-field-date,
.hotel-form-field-compact {
  min-width: 0;
}

.hotel-form-field-date-range {
  grid-column: span 1;
}

.hotel-date-panel {
  width: min(520px, 100%);
}

.hotel-form-label {
  display: block;
  min-width: 0;
  overflow: hidden;
  color: #4d6255;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hotel-form-control {
  width: 100%;
  height: 50px;
  min-width: 0;
  max-width: 100%;
  padding: 0 13px;
  border: 1px solid rgba(24, 50, 34, 0.13);
  border-radius: 10px;
  background: #ffffff;
  color: var(--home-ink);
  font: inherit;
  font-weight: 700;
  font-size: 16px;
  line-height: 1.2;
  outline: none;
  text-overflow: ellipsis;
  transition:
    border-color 180ms ease,
    box-shadow 180ms ease,
    background 180ms ease;
}

.hotel-form-control[type="date"] {
  min-width: 0;
}

.hotel-form-control::placeholder {
  color: rgba(24, 50, 34, 0.52);
  font-weight: 600;
}

.hotel-form-control:focus {
  border-color: rgba(84, 185, 72, 0.55);
  box-shadow: 0 0 0 3px rgba(84, 185, 72, 0.12);
}

.hotel-search-date-row {
  display: grid;
  gap: 10px;
  align-items: end;
}

.hotel-search-date-row {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.hotel-search-date-row label {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.hotel-form-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  align-self: end;
  min-width: 0;
  width: 100%;
  height: 50px;
  padding: 0 18px;
  border: 0;
  border-radius: 10px;
  background: var(--green-deep);
  color: #ffffff;
  box-shadow: none;
  cursor: pointer;
  font: inherit;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
  transition:
    box-shadow 180ms ease,
    transform 180ms ease;
}

.hotel-form-submit span:not(.sr-only) {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.hotel-form-submit svg {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
}

.hotel-form-submit:hover {
  transform: translateY(-1px);
  box-shadow: none;
}

.hotels-destination-field {
  position: relative;
}

.hotels-search-head h1,
.hotel-lane-section h3 {
  margin: 0;
}

.hotels-quick-row {
  justify-content: center;
  margin-top: 16px;
}

.hotels-browse-section {
  display: grid;
  gap: 22px;
}

body.hotels-page .hotels-browse-section {
  width: var(--viewport-width, 100vw);
  margin-left: calc(50% - (var(--viewport-width, 100vw) / 2));
  margin-right: calc(50% - (var(--viewport-width, 100vw) / 2));
  padding: 30px 0 36px;
  border-left: 0;
  border-right: 0;
  border-radius: 0;
}

body.hotels-page .hotels-browse-section > .results-head,
body.hotels-page .hotels-browse-section > .hotel-map-section,
body.hotels-page .hotels-browse-section > .hotels-results-layout,
body.hotels-page .hotels-browse-section > .results-state {
  width: min(1280px, calc(100% - 40px));
  margin-inline: auto;
}

.hotels-results-layout {
  display: grid;
  gap: 18px;
}

.hotels-results-main {
  display: grid;
  gap: 18px;
  min-width: 0;
}

body.hotel-map-page .hotels-search-stage {
  margin-top: 18px;
}

body.hotel-map-page .hotel-map-page-section {
  padding-top: 18px;
}

body.hotel-map-page .hotel-map-stage {
  min-height: clamp(430px, 64vh, 720px);
}

body.hotel-map-page .hotel-map-shell {
  grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
}

.hotel-map-section {
  scroll-margin-top: 96px;
}

.hotel-map-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 320px);
  gap: 14px;
  align-items: stretch;
}

.hotel-map-stage {
  position: relative;
  min-height: 390px;
  overflow: hidden;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 8px;
  background:
    linear-gradient(132deg, rgba(241, 245, 249, 0.98), rgba(255, 255, 255, 0.96) 42%, rgba(235, 242, 246, 0.98)),
    repeating-linear-gradient(25deg, transparent 0 68px, rgba(255, 255, 255, 0.7) 69px 76px, transparent 77px 152px),
    repeating-linear-gradient(112deg, transparent 0 92px, rgba(203, 213, 225, 0.55) 93px 99px, transparent 100px 188px);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85), 0 16px 34px rgba(15, 23, 42, 0.08);
  isolation: isolate;
}

.hotel-map-stage.has-leaflet-map {
  background: #edf2f7;
}

.hotel-map-stage.has-leaflet-map::before,
.hotel-map-stage.has-leaflet-map::after {
  display: none;
}

.hotel-map-stage .leaflet-container,
.hotel-map-stage .leaflet-pane,
.hotel-map-stage .leaflet-control-container {
  font-family: inherit;
}

.hotel-map-stage .leaflet-tile-pane {
  filter: saturate(0.68) contrast(0.98) brightness(1.04);
}

.hotel-map-stage .leaflet-tile {
  transition: opacity 120ms ease-out;
}

.hotel-map-stage .leaflet-container {
  background: #edf2f7;
}

.hotel-map-stage.leaflet-container {
  z-index: 0;
}

.hotel-map-stage .leaflet-control-zoom {
  overflow: hidden;
  border: 0;
  border-radius: 8px;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.16);
}

.hotel-map-stage .leaflet-control-zoom a {
  width: 36px;
  height: 36px;
  border: 0;
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
  background: rgba(255, 255, 255, 0.96);
  color: #111827;
  font-size: 1.1rem;
  font-weight: 900;
  line-height: 36px;
}

.hotel-map-stage .leaflet-control-zoom a:hover,
.hotel-map-stage .leaflet-control-zoom a:focus {
  background: #111827;
  color: #ffffff;
}

.hotel-map-stage .leaflet-control-attribution {
  padding: 2px 6px;
  border-radius: 6px 0 0 0;
  background: rgba(255, 255, 255, 0.82);
  color: #475569;
  font-size: 0.64rem;
}

.hotel-map-stage::before,
.hotel-map-stage::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.hotel-map-stage::before {
  z-index: 0;
  background:
    linear-gradient(90deg, transparent 0 48%, rgba(255, 255, 255, 0.74) 48% 51%, transparent 51%),
    linear-gradient(0deg, transparent 0 54%, rgba(255, 255, 255, 0.58) 54% 57%, transparent 57%);
  opacity: 0.72;
}

.hotel-map-stage::after {
  z-index: 1;
  border: 1px solid rgba(255, 255, 255, 0.58);
  border-radius: inherit;
  box-shadow: inset 0 0 0 999px rgba(255, 255, 255, 0.08);
}

.hotel-map-empty {
  position: absolute;
  inset: 26px;
  z-index: 900;
  display: grid;
  place-content: center;
  gap: 8px;
  max-width: 440px;
  margin: auto;
  padding: 24px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.92);
  text-align: center;
  box-shadow: 0 18px 34px rgba(15, 23, 42, 0.1);
}

.hotel-map-empty[hidden],
.hotel-map-card[hidden] {
  display: none;
}

.hotel-map-empty h3,
.hotel-map-empty p,
.hotel-map-card h3,
.hotel-map-card p {
  margin: 0;
}

.hotel-map-empty p:last-child,
.hotel-map-card p {
  color: var(--home-muted);
  line-height: 1.55;
}

.hotel-map-pin {
  position: absolute;
  z-index: 3;
  transform: translate(-50%, -50%);
  min-width: 52px;
  min-height: 30px;
  padding: 6px 10px;
  border: 1px solid rgba(38, 123, 49, 0.32);
  border-radius: 999px;
  background: var(--green-deep);
  color: #ffffff;
  box-shadow: none;
  cursor: pointer;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
  transition:
    transform 160ms ease,
    background 160ms ease,
    color 160ms ease,
    box-shadow 160ms ease;
}

.hotel-map-pin::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -4px;
  width: 8px;
  height: 8px;
  border-right: inherit;
  border-bottom: inherit;
  background: inherit;
  transform: translateX(-50%) rotate(45deg);
}

.hotel-map-marker-icon {
  width: auto !important;
  height: auto !important;
  background: transparent;
  border: 0;
  overflow: visible;
}

.hotel-map-marker-icon .hotel-map-pin {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transform: translate(-50%, -50%);
}

.hotel-map-pin:hover,
.hotel-map-pin:focus-visible,
.hotel-map-pin.active {
  transform: translate(-50%, -50%) scale(1.08);
  border-color: rgba(24, 50, 34, 0.42);
  background: #1f5a2b;
  color: #ffffff;
  box-shadow: none;
  outline: none;
}

.hotel-map-marker-icon .hotel-map-pin:hover,
.hotel-map-marker-icon .hotel-map-pin:focus-visible,
.hotel-map-marker-icon .hotel-map-pin.active {
  transform: translate(-50%, -50%) scale(1.08);
}

.hotel-map-card {
  display: grid;
  align-content: start;
  gap: 10px;
  min-width: 0;
  padding: 20px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.97);
  box-shadow: 0 18px 38px rgba(15, 23, 42, 0.1);
}

.hotel-map-card strong {
  color: #111827;
  font-size: 1.85rem;
  line-height: 1.05;
}

.hotel-map-card-link {
  margin-top: 4px;
}

.hotels-selected-card {
  display: grid;
  gap: 12px;
  padding: 22px 24px;
  border-radius: 28px;
  border: 1px solid var(--home-line);
  background: rgba(255, 255, 255, 0.92);
}

.hotels-filter-bar {
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
  align-items: start;
  padding: 22px 24px;
  border-radius: 28px;
  border: 1px solid var(--home-line);
  background: rgba(255, 255, 255, 0.92);
}

.hotels-filter-section {
  display: grid;
  gap: 12px;
}

.hotels-filter-section-head h3 {
  margin: 0;
  font-size: 1.08rem;
  line-height: 1.1;
}

.hotel-filter-chip-list,
.hotel-filter-radio-list {
  display: grid;
  gap: 10px;
}

.hotel-filter-chip-option,
.hotel-filter-radio-option {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-height: 48px;
  padding: 12px 14px;
  border: 1px solid var(--home-line);
  border-radius: 16px;
  background: rgba(247, 251, 245, 0.96);
  color: var(--home-ink);
  font-weight: 700;
}

.hotel-filter-chip-option input,
.hotel-filter-radio-option input {
  margin: 0;
}

.hotel-filter-chip-option small {
  color: var(--home-muted);
  font-size: 0.82rem;
}

.hotel-filter-price-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.hotel-filter-price-field {
  display: grid;
  gap: 6px;
}

.hotel-filter-price-field span {
  color: var(--home-muted);
  font-size: 0.82rem;
  font-weight: 700;
}

.hotel-filter-price-field input {
  width: 100%;
  min-height: 46px;
  padding: 0 12px;
  border: 1px solid var(--home-line);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.98);
  font: inherit;
}

.hotels-filter-field,
.hotels-filter-group {
  display: grid;
  gap: 10px;
}

.hotels-filter-field label,
.hotels-filter-label {
  font-size: 0.86rem;
  font-weight: 700;
  color: var(--home-muted);
}

.hotels-filter-field select {
  min-height: 52px;
  border-radius: 18px;
  border: 1px solid var(--home-line);
  background: rgba(255, 255, 255, 0.98);
  padding: 0 14px;
  font: inherit;
}

.hotels-filter-group {
  align-content: start;
}

.hotels-filter-group-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.hotels-filter-label {
  min-width: 100%;
}

.hotels-filter-trigger {
  min-height: 52px;
  justify-content: space-between;
  padding-inline: 18px;
  border-radius: 18px;
  border-color: var(--home-line);
  font-weight: 700;
}

.hotels-filter-summary {
  margin: 0;
  color: var(--home-muted);
  font-size: 0.92rem;
  line-height: 1.5;
}

.hotel-filter-sidebar-list {
  display: grid;
  gap: 10px;
  max-height: 460px;
  padding-right: 4px;
  overflow-y: auto;
}

.hotel-filter-sidebar-empty {
  margin: 0;
  color: var(--home-muted);
  font-size: 0.9rem;
  line-height: 1.45;
}

.hotel-filter-dialog {
  position: fixed;
  inset: 0;
  z-index: 40;
  display: grid;
  place-items: center;
  padding: 20px;
}

.hotel-filter-dialog[hidden] {
  display: none !important;
}

body.hotel-filter-dialog-open {
  overflow: hidden;
}

.hotel-filter-dialog-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(9, 19, 13, 0.58);
  backdrop-filter: blur(6px);
}

.hotel-filter-dialog-panel {
  position: relative;
  z-index: 1;
  width: min(720px, 100%);
  display: grid;
  gap: 18px;
  padding: 28px;
  border-radius: 28px;
  background: #ffffff;
  border: 1px solid rgba(24, 50, 34, 0.08);
  box-shadow: 0 30px 70px rgba(9, 19, 13, 0.2);
}

.hotel-filter-dialog-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 16px;
}

.hotel-filter-dialog-head h3 {
  margin: 4px 0 0;
  font-size: clamp(1.6rem, 3vw, 2.2rem);
  line-height: 1.05;
}

.hotel-filter-dialog-copy {
  margin: 0;
  color: var(--home-muted);
}

.hotel-filter-dialog-close {
  flex: 0 0 auto;
}

.hotel-filter-options-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.hotel-filter-option {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  min-height: 60px;
  padding: 16px 18px;
  border-radius: 20px;
  border: 1px solid var(--home-line);
  background: rgba(247, 251, 245, 0.92);
  cursor: pointer;
  font-weight: 700;
  color: var(--home-ink);
}

.hotel-filter-option input {
  width: 18px;
  height: 18px;
  margin: 0;
}

.hotel-filter-option span {
  line-height: 1.35;
}

.hotel-filter-option-inline {
  min-height: 0;
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(247, 251, 245, 0.96);
}

.hotel-filter-option-inline span {
  font-size: 0.92rem;
}

.hotels-filter-see-more {
  justify-self: start;
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid var(--home-line);
  border-radius: 999px;
  background: #ffffff;
  color: var(--home-ink);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.hotel-filter-dialog-actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
}

@media (min-width: 1024px) {
  body.hotels-page .hotels-results-layout {
    grid-template-columns: minmax(280px, 320px) minmax(0, 1fr);
    align-items: start;
  }

  body.hotels-page .hotels-filters-sidebar {
    position: sticky;
    top: 106px;
    display: grid;
    gap: 18px;
    max-height: calc(100vh - 124px);
    overflow-y: auto;
    padding-right: 6px;
  }

  body.hotel-map-page .hotels-results-layout {
    grid-template-columns: minmax(280px, 320px) minmax(0, 1fr);
    align-items: start;
  }

  body.hotel-map-page .hotels-filters-sidebar {
    position: sticky;
    top: 106px;
    display: grid;
    gap: 18px;
  }

  .hotels-filter-trigger {
    display: none;
  }

  .hotel-filter-dialog {
    display: none !important;
  }
}

@media (max-width: 1023px) {
  .hotels-filter-section-desktop,
  .hotel-filter-sidebar-list,
  .hotels-filter-see-more,
  .hotels-selected-card {
    display: none;
  }

  .hotels-filter-bar {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
  }
}

.filter-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  min-width: 0;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid var(--home-line);
  background: rgba(255, 255, 255, 0.96);
  color: var(--home-ink);
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
}

.filter-chip input {
  margin: 0;
  flex: 0 0 auto;
}

.filter-chip span {
  display: inline-flex;
  align-items: center;
  min-width: 0;
}

.hotels-lane-stack {
  display: grid;
  gap: 22px;
}

.hotel-lane-section {
  display: grid;
  gap: 12px;
}

body.hotels-page .hotels-lane-stack,
body.hotels-page .hotel-lane-section,
body.hotels-page .hotel-browse-track {
  width: 100%;
}

body.hotels-page .hotel-lane-section .home-showcase-toolbar {
  width: min(1280px, calc(100% - 40px));
  margin-inline: auto;
}

.hotel-browse-track {
  grid-auto-columns: minmax(336px, 386px);
}

body.hotels-page .hotel-browse-track {
  padding: 6px max(18px, calc((var(--viewport-width, 100vw) - 1280px) / 2 + 18px)) 12px;
}

.featured-hotel-card.hotel-browse-card {
  border: 1px solid var(--home-line);
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 20px 42px rgba(17, 24, 39, 0.06);
}

.featured-hotel-card.hotel-browse-card:hover {
  border-color: var(--home-line);
  transform: none;
  box-shadow: 0 20px 42px rgba(17, 24, 39, 0.06);
}

.featured-hotel-card.hotel-browse-card .hotel-card-media {
  min-height: 224px;
}

.featured-hotel-card.hotel-browse-card .hotel-card-body {
  padding: 12px;
  gap: 7px;
  background: #ffffff;
}

.featured-hotel-card.hotel-browse-card:nth-child(4n + 1) .hotel-card-body {
  background: linear-gradient(180deg, #ffffff 0%, #f3fbef 100%);
}

.featured-hotel-card.hotel-browse-card:nth-child(4n + 2) .hotel-card-body {
  background: linear-gradient(180deg, #ffffff 0%, #eef8f8 100%);
}

.featured-hotel-card.hotel-browse-card:nth-child(4n + 3) .hotel-card-body {
  background: linear-gradient(180deg, #ffffff 0%, #fff7e5 100%);
}

.featured-hotel-card.hotel-browse-card:nth-child(4n) .hotel-card-body {
  background: linear-gradient(180deg, #ffffff 0%, #f6f0ff 100%);
}

.featured-hotel-card.hotel-browse-card .hotel-card-chip,
.featured-hotel-card.hotel-browse-card .featured-hotel-status {
  backdrop-filter: blur(10px);
}

.featured-hotel-card.hotel-browse-card .hotel-card-chip {
  color: #12331c;
  box-shadow: 0 10px 22px rgba(17, 24, 39, 0.1);
}

.featured-hotel-card.hotel-browse-card .featured-hotel-status {
  background: rgba(16, 39, 23, 0.78);
}

.featured-hotel-card.hotel-browse-card .hotel-card-body h3 {
  font-size: 0.94rem;
  line-height: 1.08;
}

.featured-hotel-card.hotel-browse-card .hotel-card-body > p:not(.featured-hotel-location) {
  font-size: 0.74rem;
  line-height: 1.34;
}

.featured-hotel-card.hotel-browse-card .featured-hotel-location {
  font-size: 0.68rem;
}

.featured-hotel-card.hotel-browse-card .hotel-spec-row {
  gap: 5px;
}

.featured-hotel-card.hotel-browse-card .hotel-spec-pill {
  padding: 5px 7px;
  font-size: 0.66rem;
  line-height: 1;
}

.featured-hotel-card.hotel-browse-card .hotel-price-stack {
  margin-top: 2px;
  padding: 0;
  border-radius: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.featured-hotel-card.hotel-browse-card .hotel-price-primary {
  font-size: 0.82rem;
  line-height: 1;
}

.featured-hotel-card.hotel-browse-card .hotel-price-primary-static {
  font-size: 0.98rem;
}

.featured-hotel-card.hotel-browse-card .hotel-price-primary span,
.featured-hotel-card.hotel-browse-card .hotel-price-secondary {
  font-size: 0.68rem;
}

.featured-hotel-card.hotel-browse-card .hotel-cta {
  width: 100%;
  min-height: 36px;
  padding: 8px 10px;
  font-size: 0.76rem;
  background: var(--green-deep);
  box-shadow: none;
}

.featured-hotel-card.hotel-nearby-card {
  background: linear-gradient(145deg, #f1faee, #ffffff 48%, #eef8f8);
}

.featured-hotel-card.hotel-nearby-card .hotel-card-body {
  min-height: 100%;
  align-content: center;
}

body.hotels-page .home-search-form .field-group input,
body.hotels-page .home-search-form .field-group select {
  width: 100%;
  min-width: 0;
  min-height: 58px;
  border-radius: 22px;
  border: 1px solid var(--home-line);
  background: rgba(255, 255, 255, 0.98);
  padding: 0 16px;
  font: inherit;
  color: var(--home-ink);
}

body.hotels-page .home-search-form .field-group select {
  appearance: none;
}

@media (max-width: 980px) {
  body.hotels-page .hotels-search-stage {
    width: calc(100% - 20px);
    margin-top: 12px;
  }

  body.hotels-page .hotels-search-card {
    padding: 0;
  }

  body.hotels-page .hotels-search-form {
    padding: 16px;
    border-radius: 20px;
  }

  .hotels-search-head {
    text-align: left;
    justify-items: start;
    gap: 10px;
  }

  .hotels-search-head h1 {
    max-width: none;
  }

  .hotel-customer-search {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .hotel-map-shell {
    grid-template-columns: 1fr;
  }

  .hotel-map-stage {
    min-height: 340px;
  }

  .hotel-map-card {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
  }

  .hotel-map-card .eyebrow,
  .hotel-map-card h3,
  .hotel-map-card p {
    grid-column: 1;
  }

  .hotel-map-card strong,
  .hotel-map-card-link {
    grid-column: 2;
    justify-self: end;
  }

  .hotel-form-field-location,
  .hotel-form-submit {
    grid-column: 1 / -1;
  }

  .hotel-form-control,
  .hotel-form-submit {
    height: 50px;
  }

  .hotel-form-submit {
    width: 100%;
  }
}

@media (max-width: 560px) {
  body.hotels-page .hotels-search-stage {
    width: calc(100% - 16px);
  }

  body.hotels-page .hotels-search-form {
    padding: 14px;
    border-radius: 18px;
  }

  .hotel-customer-search {
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
  }

  .hotel-form-field-location,
  .hotel-form-submit {
    grid-column: auto;
  }

  .hotel-form-field {
    gap: 6px;
    width: 100%;
  }

  .hotel-form-field-date {
    width: 100%;
    min-width: 0;
    overflow: hidden;
  }

  .hotel-form-label {
    font-size: 0.75rem;
  }

  .hotel-form-control,
  .hotel-form-submit {
    height: 48px;
    min-width: 0;
    width: 100%;
    max-width: 100%;
  }

  .hotel-form-control {
    padding-inline: 12px;
    font-size: 16px;
  }

  .hotel-form-control[type="date"] {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    padding-inline: 12px;
    font-size: 16px;
    appearance: none;
    -webkit-appearance: none;
    background-clip: padding-box;
  }

  .hotel-form-control[type="date"]::-webkit-date-and-time-value {
    text-align: left;
  }

  .hotel-form-control[type="date"]::-webkit-datetime-edit {
    padding: 0;
  }

  .hotel-form-control[type="date"]::-webkit-calendar-picker-indicator {
    margin-left: 6px;
    opacity: 0.9;
  }

  .hotel-form-submit {
    margin-top: 2px;
    padding-inline: 14px;
  }

  body.hotels-page .hotels-browse-section > .hotel-map-section {
    width: calc(100% - 20px);
  }

	  .hotel-map-stage {
	    min-height: 300px;
	    border-radius: 20px;
	  }

	  .hotel-map-empty {
	    inset: 14px;
	    padding: 18px;
	    border-radius: 16px;
	  }

	  .hotel-map-pin {
	    min-width: 50px;
	    min-height: 31px;
	    padding: 6px 9px;
	    font-size: 0.75rem;
	  }

	  .hotel-map-card {
	    grid-template-columns: 1fr;
	    padding: 16px;
	    border-radius: 20px;
	  }

	  .hotel-map-card strong,
	  .hotel-map-card-link {
	    grid-column: 1;
	    justify-self: stretch;
	  }
	}

body.home-page .button-primary {
  background: var(--green-deep);
  box-shadow: none;
}

@media (max-width: 420px) {
  .hotel-form-field-date,
  .hotel-form-field-compact,
  .hotel-form-field-location,
  .hotel-form-submit {
    grid-column: auto;
  }

  body.hotels-page .hotels-search-stage {
    width: calc(100% - 12px);
  }

  body.hotels-page .hotels-search-form {
    padding: 12px;
  }

  .hotel-form-control,
  .hotel-form-submit {
    font-size: 16px;
  }

  .hotel-form-control[type="date"] {
    font-size: 16px;
    padding-inline: 10px;
  }
}

@media (max-width: 560px) {
  .search-flight-fields .home-search-input,
  .search-flight-fields .hotel-form-control {
    font-size: 16px !important;
  }
}

body.home-page .button-secondary {
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid var(--home-line);
  color: var(--home-ink);
}

.home-main {
  margin-top: 28px;
  display: grid;
  gap: 28px;
}

.home-search-stage {
  display: grid;
  width: var(--viewport-width, 100vw);
  margin-left: calc(50% - (var(--viewport-width, 100vw) / 2));
  margin-right: calc(50% - (var(--viewport-width, 100vw) / 2));
  margin-top: 4px;
}

.home-search-card {
  border: 1px solid rgba(24, 50, 34, 0.08);
  border-radius: 0 0 36px 36px;
  background:
    radial-gradient(circle at top left, rgba(84, 185, 72, 0.12), transparent 26%),
    linear-gradient(180deg, #f8fcf6 0%, #ffffff 100%);
  box-shadow: 0 24px 46px rgba(17, 24, 39, 0.08);
  padding: 42px max(24px, calc((var(--viewport-width, 100vw) - 1280px) / 2 + 18px));
  display: grid;
  grid-template-columns: minmax(260px, 0.82fr) minmax(0, 1.18fr);
  gap: 28px;
  align-items: center;
}

.home-search-intro {
  display: grid;
  gap: 14px;
  align-content: start;
}

.home-search-intro h1 {
  margin: 0;
  color: #102417;
  font-size: clamp(2.4rem, 4vw, 4rem);
  line-height: 0.96;
  letter-spacing: 0;
  font-weight: 800;
}

.home-search-copy {
  margin: 0;
  max-width: 28rem;
  color: #314538;
  line-height: 1.68;
  font-size: 1.02rem;
  font-weight: 600;
}

body.search-overlay-open {
  overflow: hidden;
  position: fixed;
  inset: 0;
  width: 100%;
}

.search-overlay-trigger {
  width: 100%;
  min-height: 82px;
  padding: 18px 20px;
  border: 1px solid rgba(24, 50, 34, 0.1);
  border-radius: 26px;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 14px 34px rgba(17, 24, 39, 0.08);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  text-align: left;
  cursor: pointer;
}

.search-overlay-trigger-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.search-overlay-trigger-copy strong {
  color: #102417;
  font-size: 1.05rem;
  line-height: 1.2;
}

.search-overlay-trigger-copy span {
  color: #5b6e60;
  font-size: 0.92rem;
  line-height: 1.3;
}

.search-overlay-trigger-action {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 88px;
  min-height: 46px;
  padding: 0 16px;
  border-radius: 999px;
  background: #1f5a2b;
  color: #ffffff;
  font-weight: 800;
}

.search-overlay {
  position: fixed;
  inset: 0;
  z-index: 80;
}

.search-overlay-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(11, 18, 13, 0.4);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.search-overlay-panel {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  max-height: 100vh;
  margin: 0;
  overflow: auto;
  padding: 28px;
  border-radius: 0;
  background:
    radial-gradient(circle at top left, rgba(84, 185, 72, 0.12), transparent 28%),
    linear-gradient(180deg, #f8fcf6 0%, #ffffff 100%);
  box-shadow: 0 28px 68px rgba(17, 24, 39, 0.24);
}

.search-overlay-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}

.search-overlay-head h2 {
  margin: 0;
}

.home-search-form {
  width: 100%;
  display: grid;
  gap: 16px;
  padding: 30px;
  border-radius: 32px;
  background: #ffffff;
  border: 1px solid rgba(24, 50, 34, 0.08);
  box-shadow: 0 18px 36px rgba(17, 24, 39, 0.08);
}

.home-showcase-toolbar {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-end;
}

.home-showcase-toolbar-compact {
  justify-content: flex-end;
}

.home-search-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 12px;
  align-items: end;
}

.home-search-form .field-group {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.field-group-stay-dates {
  position: relative;
}

.home-search-form .field-group:first-child {
  grid-column: span 5;
}

.home-search-form .field-group:nth-child(2) {
  grid-column: span 4;
}

.home-search-form .field-group:nth-child(3) {
  grid-column: span 3;
}

.home-input-shell,
.home-date-trigger,
.home-date-input,
.home-search-form .home-search-input {
  min-height: 54px;
  border-radius: 22px;
  border: 1px solid var(--home-line);
  background: rgba(255, 255, 255, 0.98);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

.home-input-shell {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 16px;
}

.home-input-shell:focus-within,
.home-date-trigger:focus-visible,
.home-date-input:focus,
.home-search-form .home-search-input:focus {
  border-color: var(--green);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.35),
    0 0 0 4px rgba(84, 185, 72, 0.12);
  outline: none;
}

.home-input-icon {
  width: 18px;
  height: 18px;
  color: #111111;
  flex-shrink: 0;
}

.home-search-form .home-search-input {
  padding: 0 16px;
  font: inherit;
  font-size: 16px;
  color: #102417;
  font-weight: 700;
  letter-spacing: 0;
  min-width: 0;
  width: 100%;
  max-width: 100%;
}

.home-input-shell .home-search-input {
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.home-date-picker {
  position: relative;
}

.home-date-trigger {
  width: 100%;
  padding: 0 16px;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  font: inherit;
  color: rgba(16, 36, 23, 0.58);
  font-weight: 600;
  letter-spacing: 0;
  cursor: pointer;
  pointer-events: auto;
}

.home-date-trigger.has-value {
  color: #102417;
  font-weight: 700;
}

.home-date-panel {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  width: min(420px, 100%);
  padding: 12px;
  border-radius: 22px;
  border: 1px solid rgba(24, 50, 34, 0.08);
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 18px 38px rgba(17, 24, 39, 0.14);
  z-index: 14;
}

.home-date-panel[hidden] {
  display: none;
}

.home-date-panel-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.range-calendar-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}

.range-calendar-summary-card {
  display: grid;
  gap: 3px;
  padding: 14px 16px;
  border: 1px solid rgba(24, 50, 34, 0.1);
  border-radius: 18px;
  background: #ffffff;
}

.range-calendar-summary-card span,
.range-calendar-summary-meta {
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--green-deep);
}

.range-calendar-summary-card strong {
  font-size: 1rem;
  line-height: 1.25;
  color: var(--ink);
}

.range-calendar-summary-card.is-active {
  border-color: rgba(38, 123, 49, 0.22);
  background: #f8fbf7;
}

.range-calendar-summary-meta {
  grid-column: 1 / -1;
  text-transform: none;
  letter-spacing: 0;
  color: var(--muted);
}

.range-calendar-scroll {
  display: grid;
  gap: 18px;
}

.range-calendar-month {
  display: grid;
  gap: 12px;
}

.range-calendar-month-head {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 12px;
}

.range-calendar-month-head h4 {
  margin: 0;
  font-size: 1.02rem;
  text-align: center;
}

.range-calendar-nav {
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid rgba(24, 50, 34, 0.1);
  border-radius: 999px;
  background: #ffffff;
  color: var(--ink);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.range-calendar-weekdays,
.range-calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.range-calendar-weekdays {
  gap: 4px;
}

.range-calendar-weekdays span {
  text-align: center;
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--muted);
}

.range-calendar-grid {
  gap: 4px;
}

.range-calendar-day {
  min-height: 42px;
  padding: 0;
  border: 0;
  border-radius: 14px;
  background: transparent;
  color: var(--ink);
  font: inherit;
  cursor: pointer;
}

.range-calendar-day span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.range-calendar-day-placeholder {
  min-height: 42px;
  border-radius: 14px;
  background: transparent;
}

.range-calendar-day.is-disabled {
  color: rgba(24, 50, 34, 0.22);
  cursor: not-allowed;
}

.range-calendar-day.is-in-range {
  background: rgba(84, 185, 72, 0.14);
  border-radius: 0;
}

.range-calendar-day.is-start,
.range-calendar-day.is-end {
  background: var(--green-deep);
  color: #ffffff;
}

.range-calendar-actions {
  display: flex;
  justify-content: flex-end;
}

.range-calendar-save {
  min-width: 142px;
}

.home-date-field {
  display: grid;
  gap: 6px;
}

.home-date-field span {
  font-size: 0.8rem;
  font-weight: 800;
  color: #1a2f20;
  letter-spacing: 0;
}

.home-date-input {
  width: 100%;
  max-width: 100%;
  padding: 0 14px;
  font: inherit;
  font-size: 0.92rem;
  color: #102417;
  font-weight: 700;
}

.home-search-form .home-search-input::placeholder {
  color: rgba(16, 36, 23, 0.58);
  font-weight: 600;
}

.home-search-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: flex-start;
  padding-top: 0;
}

.search-flight-shell {
  display: grid;
  gap: 12px;
}

.search-flight-toggle {
  width: 100%;
  display: grid;
  gap: 3px;
  padding: 14px 16px;
  border: 1px solid rgba(24, 50, 34, 0.12);
  border-radius: 22px;
  background: #f4f8f3;
  color: #102417;
  text-align: left;
  cursor: pointer;
  transition:
    border-color 180ms ease,
    background 180ms ease,
    transform 180ms ease;
}

.search-flight-toggle span {
  font-size: 0.98rem;
  font-weight: 800;
}

.search-flight-toggle small {
  color: #5f7262;
  font-size: 0.82rem;
}

.search-flight-toggle.is-active {
  border-color: rgba(31, 90, 43, 0.26);
  background: rgba(225, 241, 228, 0.88);
}

.search-flight-toggle:hover {
  transform: translateY(-1px);
}

.search-flight-fields {
  display: grid;
  gap: 10px;
}

.search-flight-fields .suggestions {
  max-height: min(240px, 42vh);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.search-flight-fields .home-search-input,
.search-flight-fields .hotel-form-control {
  font-size: 16px;
}

.search-flight-shell-hotels {
  margin-top: 14px;
}

.home-search-actions .button.button-primary {
  width: 100%;
  min-width: 0;
  min-height: 46px;
  padding: 11px 24px;
  justify-content: center;
  background: #1f5a2b;
  border: 1px solid #1f5a2b;
  box-shadow: none;
  font-weight: 800;
  letter-spacing: 0;
}

.home-search-actions .button.button-primary:hover {
  background: #184823;
  border-color: #184823;
  box-shadow: none;
}

.home-showcase-rail-section {
  display: grid;
  gap: 12px;
}

.home-showcase-controls {
  display: flex;
  gap: 10px;
}

.home-showcase-controls[hidden] {
  display: none;
}

.home-rail-button {
  min-width: 74px;
}

.home-rail-button:disabled {
  opacity: 0.42;
}

.home-showcase-track {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(300px, 340px);
  gap: 18px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  padding: 6px 2px 10px;
  scrollbar-width: none;
}

.home-showcase-track::-webkit-scrollbar {
  display: none;
}

.home-showcase-track .featured-hotel-card {
  width: 100%;
  scroll-snap-align: start;
}

.home-showcase-track .featured-hotel-card-live,
.home-showcase-track .featured-hotel-card-fallback,
.home-showcase-track .featured-hotel-card-skeleton {
  min-height: 100%;
}

.featured-hotel-rating-line {
  margin: 0;
  color: var(--home-accent-deep);
  font-weight: 700;
}

.hotel-price-stack {
  display: grid;
  gap: 3px;
  padding: 0;
  border-radius: 0;
  border: 0;
  background: transparent;
}

.hotel-price-primary,
.hotel-price-secondary {
  margin: 0;
}

.hotel-price-primary {
  color: var(--green-deep);
  font-size: 1.48rem;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1;
}

.hotel-price-primary span {
  color: #536657;
  font-size: 0.82rem;
  font-weight: 800;
}

.hotel-price-primary-static {
  font-size: 1.12rem;
  letter-spacing: 0;
}

.hotel-price-secondary {
  color: #536657;
  font-size: 0.78rem;
  line-height: 1.36;
}

.hotel-price-secondary-trip {
  color: #184823;
  font-weight: 700;
  display: grid;
  gap: 2px;
  font-size: 0.9rem;
  line-height: 1.1;
}

.hotel-price-secondary-trip span {
  color: #56715c;
  font-weight: 600;
  font-size: 0.86rem;
}

.hotel-price-secondary-trip .hotel-price-secondary-trip-label {
  color: #56715c;
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.1;
}

.hotel-price-secondary-trip .hotel-price-secondary-trip-amount {
  color: #184823;
  font-size: 1.42rem;
  font-weight: 800;
  line-height: 1;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-price-secondary.hotel-price-secondary-trip,
.featured-hotel-card.hotel-browse-card .hotel-price-secondary.hotel-price-secondary-trip {
  font-size: 0.9rem;
  line-height: 1.1;
  font-weight: 800;
  color: #184823;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-price-secondary.hotel-price-secondary-trip span,
.featured-hotel-card.hotel-browse-card .hotel-price-secondary.hotel-price-secondary-trip span {
  font-size: 0.86rem;
  color: #56715c;
  font-weight: 600;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-price-secondary.hotel-price-secondary-trip .hotel-price-secondary-trip-label,
.featured-hotel-card.hotel-browse-card .hotel-price-secondary.hotel-price-secondary-trip .hotel-price-secondary-trip-label {
  font-size: 0.72rem;
  line-height: 1.1;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-price-secondary.hotel-price-secondary-trip .hotel-price-secondary-trip-amount,
.featured-hotel-card.hotel-browse-card .hotel-price-secondary.hotel-price-secondary-trip .hotel-price-secondary-trip-amount {
  font-size: 1.42rem;
  line-height: 1;
  color: #184823;
}

.home-hero,
.home-panel-grid,
.home-lane-grid,
.home-story-grid {
  display: grid;
  gap: 20px;
}

.home-hero {
  grid-template-columns: minmax(0, 1.06fr) minmax(360px, 0.94fr);
  align-items: stretch;
}

.home-hero-copy,
.home-panel-card,
.home-lane-card,
.home-story-card,
.home-showcase-section,
.home-routes-section,
.home-footer {
  border: 1px solid var(--home-line);
  background: var(--home-card);
  box-shadow: 0 24px 46px rgba(17, 24, 39, 0.06);
}

.home-hero-copy {
  border-radius: 40px;
  padding: 54px;
  display: grid;
  gap: 24px;
  min-height: 100%;
}

.home-kicker {
  color: var(--home-accent-deep);
  letter-spacing: 0.18em;
}

.home-hero-copy h1 {
  font-size: clamp(3.35rem, 7vw, 5.5rem);
  line-height: 0.92;
  letter-spacing: 0;
  color: var(--home-ink);
}

.home-intro,
.home-panel-copy,
.home-lane-card p,
.home-footer-copy {
  margin: 0;
  color: var(--home-muted);
  line-height: 1.75;
}

.home-intro {
  max-width: 34rem;
  font-size: 1.08rem;
}

.home-hero-actions,
.home-hero-pills,
.home-card-actions,
.home-popular-row,
.home-footer-links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.home-hero-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  max-width: 470px;
  align-items: stretch;
}

.home-hero-actions .button,
.home-card-actions .button,
body.home-page .download-badge-row .app-store-badge {
  min-height: 52px;
  justify-content: center;
}

.home-hero-actions .button {
  width: 100%;
}

.home-card-actions {
  align-items: stretch;
}

.home-card-actions .button {
  min-width: 240px;
}

body.home-page .download-badge-row {
  align-items: stretch;
}

body.home-page .download-badge-row .app-store-badge {
  min-width: 180px;
  display: inline-flex;
  align-items: center;
}

.home-hero-pills span,
.home-popular-row a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 11px 15px;
  border-radius: 999px;
  border: 1px solid var(--home-line);
  background: rgba(255, 255, 255, 0.92);
  color: var(--home-muted);
  font-weight: 600;
  text-decoration: none;
}

.home-panel-stack {
  display: grid;
  gap: 20px;
}

.home-panel-card {
  border-radius: 34px;
  padding: 28px;
  display: grid;
  gap: 16px;
}

.home-panel-card-primary {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.96)),
    linear-gradient(135deg, #edf7ea, #ffffff 58%, #f6fbf4);
}

.home-panel-card-soft {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(255, 255, 255, 0.97)),
    linear-gradient(135deg, #f3faef, #f9fcf8);
}

.home-panel-card h2,
.home-panel-card h3,
.home-lane-card h3,
.home-story-card h2,
.home-footer-mark {
  margin: 0;
}

.home-panel-card h2,
.home-story-card h2 {
  color: var(--home-ink);
  font-size: clamp(2rem, 3vw, 2.8rem);
  line-height: 1;
}

.home-panel-card h3,
.home-lane-card h3 {
  font-size: 1.55rem;
  line-height: 1.1;
  color: var(--home-ink);
}

.home-panel-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.home-inline-link,
.home-footer-links a,
body.home-page .featured-hotel-link {
  text-decoration: none;
  font-weight: 700;
  color: var(--home-accent-deep);
}

.home-inline-link:hover,
.home-footer-links a:hover,
body.home-page .featured-hotel-link:hover {
  text-decoration: underline;
}

.home-lanes-section,
.home-showcase-section,
.home-routes-section {
  padding: 34px;
  border-radius: 36px;
}

.home-section-head {
  align-items: flex-start;
}

.home-section-head .section-copy {
  max-width: 470px;
  color: var(--home-muted);
}

.home-lane-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.home-lane-card {
  border-radius: 30px;
  padding: 28px;
  display: grid;
  gap: 16px;
}

.home-step {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border-radius: 16px;
  background: var(--home-accent-soft);
  color: var(--home-accent-deep);
  font-weight: 700;
}

.home-list {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
  color: var(--home-muted);
}

.home-list li {
  position: relative;
  padding-left: 18px;
  line-height: 1.65;
}

.home-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.72rem;
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: var(--home-accent);
}

.home-showcase-section {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.98)),
    linear-gradient(135deg, #f2f9ee, #fbfdfb);
}

body.home-page .home-showcase-section {
  border: 0;
  background: transparent;
  box-shadow: none;
  padding: 0;
}

body.home-page .showcase-live-note {
  margin-top: 4px;
  color: var(--home-muted);
}

body.home-page .featured-hotels-grid {
  gap: 20px;
}

body.home-page .featured-hotel-card {
  border-radius: 30px;
  border-color: var(--home-line);
  box-shadow: 0 18px 34px rgba(17, 24, 39, 0.06);
  transition: transform 180ms ease, box-shadow 180ms ease;
}

body.home-page .featured-hotel-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 24px 40px rgba(17, 24, 39, 0.08);
}

body.home-page .hotel-card-body {
  padding: 24px;
  display: grid;
  gap: 12px;
}

body.home-page .hotel-card-chip,
body.home-page .featured-hotel-status {
  box-shadow: 0 10px 20px rgba(17, 24, 39, 0.08);
}

body.home-page .hotel-spec-pill {
  background: #f4f8f3;
  border-color: rgba(38, 123, 49, 0.08);
}

body.home-page .hotel-cta {
  background: var(--home-accent-deep);
  width: 100%;
}

.home-story-grid {
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
}

.home-story-card {
  border-radius: 34px;
  padding: 30px;
  display: grid;
  gap: 18px;
}

.home-story-card-accent {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(255, 255, 255, 0.97)),
    linear-gradient(135deg, #eef7ea, #f9fcf8);
}

.home-app-banner-card {
  position: relative;
  overflow: hidden;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 22px 24px;
}

.home-app-banner-card::after {
  content: "";
  position: absolute;
  right: -42px;
  top: -48px;
  width: 180px;
  height: 180px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(84, 185, 72, 0.18), rgba(84, 185, 72, 0));
  pointer-events: none;
}

.home-app-banner-main {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 12px;
}

.home-app-banner-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(38, 123, 49, 0.1);
  color: var(--home-accent-deep);
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.home-app-banner-actions {
  position: relative;
  z-index: 1;
  justify-content: flex-end;
}

.home-story-head {
  display: grid;
  gap: 10px;
}

.home-example-list {
  display: grid;
  gap: 12px;
}

.home-example {
  padding: 16px 18px;
  border-radius: 24px;
  border: 1px solid var(--home-line);
  background: rgba(255, 255, 255, 0.88);
  color: var(--home-muted);
  line-height: 1.65;
}

.home-example strong {
  display: block;
  margin-bottom: 6px;
  color: var(--home-ink);
}

body.home-page .app-store-badge {
  background: var(--home-accent-deep);
  color: #ffffff;
  border-color: transparent;
}

body.home-page .app-store-badge:hover {
  background: #1f6128;
}

.home-routes-section {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.98)),
    linear-gradient(135deg, #f3f9ef, #fbfdfb);
}

body.home-page .flight-ideas-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

body.home-page .idea-card {
  border-radius: 30px;
  border-color: var(--home-line);
  box-shadow: 0 18px 34px rgba(17, 24, 39, 0.06);
}

.home-footer {
  margin-top: 6px;
  border-radius: 34px;
  padding: 28px 30px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
}

.home-footer-mark {
  display: inline-block;
  margin-bottom: 8px;
}

.home-footer-copy {
  max-width: 34rem;
}

.home-daily-city-section,
.home-flight-spotlight-section,
.home-flight-globe-section,
.home-explore-section,
.home-planner-section,
.home-app-strip {
  display: grid;
  gap: 22px;
}

.home-daily-city-slider {
  display: grid;
  gap: 16px;
}

.home-daily-city-slides {
  display: grid;
}

.home-daily-city {
  grid-area: 1 / 1;
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 0.88fr) minmax(360px, 1.12fr);
  min-height: 460px;
  overflow: hidden;
  border-radius: 36px;
  background: #12251a;
  color: #ffffff;
  box-shadow: 0 24px 46px rgba(17, 24, 39, 0.14);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateX(28px) scale(0.985);
  transition:
    opacity 320ms ease,
    transform 420ms ease,
    visibility 320ms ease;
}

.home-daily-city.is-active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(0) scale(1);
  z-index: 1;
}

.home-daily-city--gallery {
  grid-template-columns: minmax(360px, 1.05fr) minmax(0, 0.95fr);
  background: #f7fbf5;
  color: var(--home-ink);
}

.home-daily-city--gallery .home-daily-city-media {
  order: -1;
}

.home-daily-city--gallery .home-daily-city-copy .eyebrow,
.home-daily-city--compact .home-daily-city-copy .eyebrow {
  color: var(--home-accent-deep);
}

.home-daily-city--gallery .home-daily-city-copy h2,
.home-daily-city--gallery .home-daily-city-copy p,
.home-daily-city--compact .home-daily-city-copy h2,
.home-daily-city--compact .home-daily-city-copy p {
  color: var(--home-ink);
}

.home-daily-city--gallery .home-daily-city-copy p,
.home-daily-city--compact .home-daily-city-copy p {
  color: var(--home-muted);
}

.home-daily-city--gallery .home-daily-city-meta span,
.home-daily-city--compact .home-daily-city-meta span {
  background: rgba(38, 123, 49, 0.1);
  color: var(--home-accent-deep);
}

.home-daily-city--poster {
  grid-template-columns: minmax(0, 1fr);
  min-height: 540px;
  isolation: isolate;
}

.home-daily-city--poster::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(90deg, rgba(9, 19, 13, 0.88), rgba(9, 19, 13, 0.34) 58%, rgba(9, 19, 13, 0.08));
  pointer-events: none;
}

.home-daily-city--poster .home-daily-city-copy {
  position: relative;
  z-index: 2;
  max-width: 680px;
  min-height: 540px;
}

.home-daily-city--poster .home-daily-city-media {
  position: absolute;
  inset: 0;
  z-index: 0;
  min-height: 100%;
}

.home-daily-city--poster .home-daily-city-media img,
.home-daily-city--poster .home-daily-city-photo-placeholder {
  min-height: 540px;
}

.home-daily-city--poster .home-daily-city-media figcaption {
  z-index: 3;
  left: auto;
  max-width: 420px;
}

.home-daily-city--compact {
  grid-template-columns: minmax(0, 0.72fr) minmax(340px, 1.28fr);
  min-height: 380px;
  background: #eef7ef;
  color: var(--home-ink);
}

.home-daily-city--compact .home-daily-city-copy {
  padding: 34px;
}

.home-daily-city--compact .home-daily-city-copy h2 {
  font-size: clamp(2.6rem, 5vw, 4.25rem);
}

.home-daily-city--compact .home-daily-city-media,
.home-daily-city--compact .home-daily-city-media img,
.home-daily-city--compact .home-daily-city-photo-placeholder {
  min-height: 380px;
}

.home-daily-city-copy {
  display: grid;
  align-content: center;
  gap: 20px;
  padding: 46px;
}

.home-daily-city-copy .eyebrow {
  color: #a8ef9e;
}

.home-daily-city-copy h2,
.home-app-strip h2 {
  margin: 0;
  font-size: clamp(3rem, 6vw, 5rem);
  line-height: 0.9;
  letter-spacing: 0;
}

.home-daily-city-copy p {
  margin: 0;
  max-width: 35rem;
  color: rgba(255, 255, 255, 0.78);
  font-size: 1.05rem;
  line-height: 1.7;
}

.home-daily-city-meta,
.home-daily-city-actions,
.home-app-strip-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.home-daily-city-meta span {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  color: #ffffff;
  font-weight: 700;
}

.home-daily-city-actions {
  margin-top: 4px;
  align-items: stretch;
}

.home-daily-city-actions .button {
  min-height: 52px;
  justify-content: center;
}

.home-daily-city-media {
  position: relative;
  min-height: 420px;
  margin: 0;
  overflow: hidden;
}

.home-daily-city-media img {
  width: 100%;
  height: 100%;
  min-height: 420px;
  object-fit: cover;
  display: block;
}

.home-daily-city-photo-placeholder,
.hotel-card-photo-placeholder {
  width: 100%;
  min-height: inherit;
  display: grid;
  place-items: center;
  padding: 24px;
  background: linear-gradient(135deg, #193421, #255b31);
  color: rgba(255, 255, 255, 0.84);
  font-weight: 800;
  text-align: center;
}

.home-daily-city-photo-placeholder {
  height: 100%;
  min-height: 420px;
}

.hotel-card-photo-placeholder {
  min-height: 220px;
}

.home-daily-city-media figcaption {
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 18px;
  padding: 14px 16px;
  border-radius: 18px;
  background: rgba(10, 18, 14, 0.72);
  color: rgba(255, 255, 255, 0.92);
  line-height: 1.45;
  font-weight: 650;
  backdrop-filter: blur(12px);
}

.home-daily-city-slider-ui {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.home-daily-city-nav,
.home-daily-city-dots {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.home-daily-city-nav-button {
  min-width: 88px;
}

.home-daily-city-dot {
  width: 12px;
  height: 12px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: rgba(24, 50, 34, 0.18);
  cursor: pointer;
  transition:
    transform 180ms ease,
    background 180ms ease,
    width 180ms ease;
}

.home-daily-city-dot.is-active {
  width: 34px;
  background: var(--green-deep);
}

.home-flight-globe-section {
  grid-template-columns: minmax(0, 1.08fr) minmax(340px, 0.92fr);
  align-items: center;
  gap: 34px;
  padding: 18px 0 42px;
  overflow: visible;
}

.home-realistic-globe {
  position: relative;
  width: 100%;
  height: clamp(460px, 48vw, 650px);
  overflow: visible;
  cursor: grab;
  touch-action: pan-y;
  background: radial-gradient(
    circle at center,
    rgba(105, 237, 197, 0.16) 0,
    rgba(105, 237, 197, 0.06) 38%,
    transparent 68%
  );
}

.home-realistic-globe:active {
  cursor: grabbing;
}

.home-realistic-globe canvas {
  display: block;
  width: 100%;
  height: 100%;
}

.home-realistic-globe-loading {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: var(--home-muted);
  font-weight: 800;
  letter-spacing: 0.02em;
}

.home-realistic-globe.has-globe-error {
  min-height: 360px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(84, 185, 72, 0.14), transparent 66%);
}

.home-flight-promo {
  position: relative;
  display: grid;
  gap: 20px;
  padding: clamp(30px, 4vw, 48px);
  overflow: hidden;
  border-radius: 36px;
  border: 1px solid rgba(24, 50, 34, 0.1);
  background:
    radial-gradient(circle at 92% 8%, rgba(128, 237, 203, 0.28), transparent 34%),
    linear-gradient(145deg, #f7fcf8 0%, #eaf7ef 100%);
  box-shadow: 0 24px 50px rgba(17, 48, 31, 0.1);
}

.home-flight-promo::after {
  content: "";
  position: absolute;
  right: -62px;
  bottom: -78px;
  width: 190px;
  height: 190px;
  border-radius: 50%;
  border: 34px solid rgba(84, 185, 72, 0.08);
  pointer-events: none;
}

.home-flight-promo .eyebrow {
  color: var(--home-accent-deep);
  font-family: "Manrope", sans-serif;
  letter-spacing: 0.14em;
}

.home-flight-promo h2 {
  position: relative;
  z-index: 1;
  margin: 0;
  max-width: 12ch;
  font-family: "League Spartan", sans-serif;
  font-size: clamp(2.65rem, 4.4vw, 4.35rem);
  font-weight: 800;
  line-height: 0.82;
  letter-spacing: -0.055em;
  color: var(--home-ink);
}

.home-flight-promo-copy {
  position: relative;
  z-index: 1;
  margin: 0;
  max-width: 34rem;
  font-family: "Manrope", sans-serif;
  color: var(--home-muted);
  font-size: 1.02rem;
  line-height: 1.7;
}

.home-flight-promo-points {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

.home-flight-promo-points span {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(38, 123, 49, 0.1);
  color: var(--home-accent-deep);
  font-family: "Manrope", sans-serif;
  font-size: 0.84rem;
  font-weight: 800;
}

.home-flight-globe-actions {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 2px;
}

.home-flight-globe-actions .button {
  min-width: 156px;
  justify-content: center;
  font-family: "Manrope", sans-serif;
  font-weight: 800;
}

.home-flight-spotlight-card {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(300px, 0.85fr);
  gap: 28px;
  align-items: center;
  padding: 34px;
  border-radius: 36px;
  overflow: hidden;
  border: 1px solid rgba(24, 50, 34, 0.08);
  background:
    radial-gradient(circle at top right, rgba(84, 185, 72, 0.22), transparent 34%),
    linear-gradient(135deg, #0f251a 0%, #163525 55%, #1f4e32 100%);
  color: #ffffff;
  box-shadow: 0 24px 46px rgba(17, 24, 39, 0.12);
}

.home-flight-spotlight-copy {
  display: grid;
  gap: 18px;
}

.home-flight-spotlight-copy .eyebrow {
  color: #a8ef9e;
}

.home-flight-spotlight-copy h2 {
  margin: 0;
  font-size: clamp(2.4rem, 5vw, 4.2rem);
  line-height: 0.95;
}

.home-flight-spotlight-copy p {
  margin: 0;
  color: rgba(255, 255, 255, 0.8);
  font-size: 1.02rem;
  line-height: 1.65;
  max-width: 34rem;
}

.home-flight-spotlight-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.home-flight-spotlight-routes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.home-flight-route-pill {
  display: grid;
  gap: 6px;
  min-height: 88px;
  padding: 14px 16px;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(12px);
}

.home-flight-route-pill span {
  color: rgba(255, 255, 255, 0.64);
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.home-flight-route-pill strong {
  font-size: 0.98rem;
  line-height: 1.3;
}

.home-flight-visual {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 360px;
}

.home-flight-globe {
  position: relative;
  width: min(100%, 340px);
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  filter: drop-shadow(0 28px 50px rgba(10, 26, 18, 0.22));
}

.home-flight-globe-halo {
  position: absolute;
  inset: -4%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(128, 243, 214, 0.24), rgba(128, 243, 214, 0.06) 48%, transparent 72%);
  filter: blur(8px);
  animation: home-flight-halo-breathe 5s ease-in-out infinite;
}

.home-flight-globe-shell {
  position: absolute;
  inset: 10%;
  border-radius: 50%;
  background:
    radial-gradient(circle at 34% 28%, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.42) 24%, transparent 28%),
    radial-gradient(circle at 72% 74%, rgba(157, 232, 255, 0.22), transparent 18%),
    linear-gradient(180deg, #effbff 0%, #dff5ff 42%, #d8f1ff 100%);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.72),
    inset -26px -34px 50px rgba(144, 203, 228, 0.38),
    0 16px 34px rgba(9, 27, 18, 0.14);
}

.home-flight-globe-grid,
.home-flight-continent,
.home-flight-node,
.home-flight-arc-map {
  position: absolute;
}

.home-flight-globe-grid {
  inset: 10%;
  border-radius: 50%;
  overflow: hidden;
  opacity: 0.92;
}

.home-flight-globe-grid::before,
.home-flight-globe-grid::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
}

.home-flight-globe-grid::before {
  background:
    repeating-linear-gradient(
      90deg,
      transparent 0 24px,
      rgba(92, 168, 224, 0.2) 24px 25px
    ),
    repeating-linear-gradient(
      0deg,
      transparent 0 24px,
      rgba(92, 168, 224, 0.18) 24px 25px
    );
  transform: scaleX(0.88);
}

.home-flight-globe-grid::after {
  inset: 7%;
  border: 1px solid rgba(94, 168, 223, 0.22);
  transform: scaleX(0.88);
}

.home-flight-continent {
  background:
    radial-gradient(circle, rgba(86, 214, 206, 0.9) 0 2px, transparent 2.8px) 0 0 / 10px 10px,
    radial-gradient(circle at center, rgba(101, 224, 214, 0.35), rgba(101, 224, 214, 0.12));
  opacity: 0.95;
  filter: drop-shadow(0 0 8px rgba(72, 218, 198, 0.18));
}

.home-flight-continent-na {
  top: 23%;
  left: 17%;
  width: 38%;
  height: 24%;
  clip-path: polygon(0 18%, 32% 0, 72% 10%, 100% 36%, 86% 60%, 72% 58%, 64% 72%, 42% 100%, 24% 82%, 8% 66%);
}

.home-flight-continent-eu {
  top: 28%;
  right: 17%;
  width: 26%;
  height: 19%;
  clip-path: polygon(10% 26%, 44% 0, 84% 12%, 100% 36%, 88% 66%, 68% 70%, 58% 100%, 24% 82%, 0 54%);
}

.home-flight-continent-sa {
  bottom: 23%;
  left: 34%;
  width: 14%;
  height: 24%;
  clip-path: polygon(24% 0, 62% 8%, 86% 34%, 66% 60%, 70% 100%, 30% 82%, 18% 48%, 0 20%);
}

.home-flight-arc-map {
  inset: 10%;
  width: 80%;
  height: 80%;
  overflow: visible;
}

.home-flight-arc-map path {
  stroke: rgba(121, 109, 255, 0.9);
  stroke-width: 2.25;
  stroke-linecap: round;
  opacity: 0.85;
  filter: drop-shadow(0 0 6px rgba(121, 109, 255, 0.24));
  animation: home-flight-arc-glow 4.6s ease-in-out infinite;
}

.home-flight-arc-map path:nth-child(2) {
  stroke: rgba(107, 174, 255, 0.88);
  animation-delay: 0.8s;
}

.home-flight-arc-map path:nth-child(3) {
  stroke: rgba(94, 224, 214, 0.9);
  animation-delay: 1.4s;
}

.home-flight-arc-map circle {
  fill: #6cc7ff;
  opacity: 0.95;
}

.home-flight-arc-map circle:nth-child(4),
.home-flight-arc-map circle:nth-child(7) {
  fill: #7f6bff;
}

.home-flight-node {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #66d9ff;
  box-shadow: 0 0 0 6px rgba(102, 217, 255, 0.14);
  animation: home-flight-node-pulse 3.8s ease-in-out infinite;
}

.home-flight-node-one {
  top: 33%;
  left: 22%;
}

.home-flight-node-two {
  top: 44%;
  left: 36%;
  background: #7f6bff;
  box-shadow: 0 0 0 6px rgba(127, 107, 255, 0.14);
  animation-delay: 0.8s;
}

.home-flight-node-three {
  top: 36%;
  right: 24%;
  animation-delay: 1.6s;
}

.home-flight-node-four {
  top: 57%;
  right: 20%;
  background: #7f6bff;
  box-shadow: 0 0 0 6px rgba(127, 107, 255, 0.14);
  animation-delay: 1.1s;
}

.home-flight-node-five {
  bottom: 28%;
  left: 38%;
  animation-delay: 2s;
}

.home-flight-line {
  position: absolute;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, rgba(151, 240, 218, 0.9), transparent);
  opacity: 0.72;
}

.home-flight-line-one {
  top: 26%;
  left: 8%;
  width: 44%;
  height: 2px;
  transform: rotate(8deg);
  animation: home-flight-line-sweep 4.8s linear infinite;
}

.home-flight-line-two {
  top: 52%;
  right: 4%;
  width: 42%;
  height: 2px;
  transform: rotate(-16deg);
  animation: home-flight-line-sweep 5.6s linear infinite reverse;
}

.home-flight-line-three {
  bottom: 24%;
  left: 20%;
  width: 34%;
  height: 2px;
  transform: rotate(42deg);
  animation: home-flight-line-sweep 4.2s linear infinite;
}

@keyframes home-flight-halo-breathe {
  0%,
  100% {
    transform: scale(0.98);
    opacity: 0.84;
  }
  50% {
    transform: scale(1.03);
    opacity: 1;
  }
}

@keyframes home-flight-line-sweep {
  0%,
  100% {
    opacity: 0.28;
    filter: blur(0);
  }
  50% {
    opacity: 1;
    filter: blur(0.2px);
  }
}

@keyframes home-flight-node-pulse {
  0%,
  100% {
    transform: scale(1);
    opacity: 0.88;
  }
  50% {
    transform: scale(1.28);
    opacity: 1;
  }
}

@keyframes home-flight-arc-glow {
  0%,
  100% {
    opacity: 0.56;
  }
  50% {
    opacity: 0.96;
  }
}

.home-explore-section,
.home-planner-section {
  padding: 34px;
  border-radius: 36px;
  border: 1px solid var(--home-line);
  background: #ffffff;
  box-shadow: 0 24px 46px rgba(17, 24, 39, 0.06);
}

.home-explore-grid,
.home-route-grid {
  display: grid;
  gap: 18px;
}

.home-explore-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.home-route-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.home-explore-card,
.home-route-card {
  display: grid;
  gap: 14px;
  min-height: 100%;
  padding: 24px;
  border-radius: 28px;
  border: 1px solid rgba(17, 24, 39, 0.08);
  background: #f8fbf7;
  box-shadow: 0 16px 30px rgba(17, 24, 39, 0.05);
}

.home-explore-card span,
.home-route-label {
  width: fit-content;
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.78);
  color: #173d2a;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.home-explore-card h3,
.home-route-card h3,
.home-app-strip h2 {
  color: var(--home-ink);
}

.home-explore-card h3,
.home-route-card h3 {
  margin: 0;
  font-size: 1.48rem;
  line-height: 1.04;
  letter-spacing: 0;
}

.home-explore-card p,
.home-route-card p {
  margin: 0;
  color: var(--home-muted);
  line-height: 1.62;
}

.home-explore-card-sun {
  background: #fff8e8;
}

.home-explore-card-city {
  background: #edf6f7;
}

.home-explore-card-luxe {
  background: #f5f0ea;
}

.home-explore-card-coast {
  background: #eef7ef;
}

.home-route-card {
  background: #ffffff;
}

.home-route-card .idea-meta {
  margin-top: auto;
}

.home-route-card .idea-button {
  width: 100%;
  justify-content: center;
}

.home-app-strip {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  padding: 34px;
  border-radius: 36px;
  border: 1px solid rgba(24, 50, 34, 0.1);
  background: #eef7ef;
  box-shadow: 0 24px 46px rgba(17, 24, 39, 0.06);
}

.home-app-strip .section-copy {
  max-width: 40rem;
}

.site-footer {
  margin-top: 40px;
  margin-left: calc(50% - (var(--viewport-width, 100vw) / 2));
  margin-right: calc(50% - (var(--viewport-width, 100vw) / 2));
  padding: 44px 0 28px;
  border-radius: 0;
  border: 0;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  background: linear-gradient(180deg, #1f462a 0%, #183222 100%);
  box-shadow: none;
  display: grid;
  gap: 24px;
}

.footer-main {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  gap: 24px;
  align-items: start;
  width: min(1240px, calc(100% - 40px));
  margin: 0 auto;
}

.footer-brand-block,
.footer-grid,
.footer-column {
  display: grid;
  gap: 12px;
}

.footer-brand-block .wordmark {
  width: fit-content;
  color: #ffffff;
}

.footer-brand-tag {
  margin: -2px 0 0;
  color: rgba(255, 255, 255, 0.62);
  text-transform: uppercase;
  letter-spacing: 0.16em;
  font-size: 0.74rem;
  font-weight: 700;
}

.footer-note,
.footer-legal-row {
  margin: 0;
  color: rgba(244, 247, 241, 0.76);
  line-height: 1.7;
}

.footer-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.footer-heading {
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-size: 0.75rem;
  font-weight: 700;
  color: #9fd6a8;
}

.footer-column a {
  text-decoration: none;
  color: rgba(255, 255, 255, 0.96);
  font-weight: 600;
}

.footer-column a:hover {
  color: #9fd6a8;
}

.footer-legal-row {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  width: min(1240px, calc(100% - 40px));
  margin: 0 auto;
  padding-top: 18px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  flex-wrap: wrap;
}

body.home-page .site-footer {
  background: linear-gradient(180deg, #1f462a 0%, #183222 100%);
  border-top-color: rgba(255, 255, 255, 0.12);
}

body.home-page .footer-heading,
body.home-page .footer-column a:hover {
  color: #9fd6a8;
}

body.home-page .footer-brand-tag,
body.home-page .footer-note,
body.home-page .footer-legal-row {
  color: rgba(244, 247, 241, 0.76);
}

body.info-page,
body.info-page.search-page {
  background: #ffffff;
}

.info-main {
  margin-top: 32px;
  display: grid;
  gap: 28px;
}

.info-hero {
  max-width: 760px;
  display: grid;
  gap: 14px;
}

.info-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(300px, 0.92fr);
  gap: 24px;
  align-items: start;
}

.info-stack {
  display: grid;
  gap: 18px;
}

.info-card {
  padding: 24px;
  border-radius: 28px;
  border: 1px solid rgba(24, 50, 34, 0.08);
  background: #ffffff;
  box-shadow: 0 18px 40px rgba(24, 50, 34, 0.06);
  display: grid;
  gap: 14px;
}

.info-card-soft {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.98)),
    linear-gradient(135deg, #f3faef, #fafcf9);
}

.info-card h2,
.info-card h3,
.info-grid-card h3 {
  margin: 0;
}

.info-card p,
.info-grid-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.7;
}

.info-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.info-grid-card {
  padding: 22px;
  border-radius: 24px;
  border: 1px solid rgba(24, 50, 34, 0.08);
  background: #f8fbf7;
  display: grid;
  gap: 10px;
}

.info-list {
  display: grid;
  gap: 10px;
  margin: 0;
  padding-left: 18px;
  color: var(--muted);
  line-height: 1.7;
}

.info-list strong {
  color: var(--ink);
}

.info-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.auth-main,
.account-main {
  gap: 26px;
}

.auth-layout {
  display: grid;
  grid-template-columns: minmax(0, 440px);
  justify-content: center;
  width: 100%;
  align-items: start;
}

.auth-card,
.account-profile-card {
  gap: 18px;
}

.auth-card h1 {
  margin: 0;
  font-size: 2.55rem;
  line-height: 1;
  text-align: center;
}

.auth-form,
.account-form {
  display: grid;
  gap: 14px;
}

.auth-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.auth-field {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.auth-field span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.auth-field input {
  width: 100%;
  min-height: 48px;
  padding: 12px 14px;
  border: 1px solid rgba(24, 50, 34, 0.12);
  border-radius: 10px;
  background: #ffffff;
  color: var(--ink);
  font: inherit;
  outline: none;
}

.auth-field input:focus {
  border-color: rgba(38, 123, 49, 0.42);
  box-shadow: 0 0 0 4px rgba(84, 185, 72, 0.12);
}

.auth-status,
.auth-help {
  min-height: 1.4em;
  margin: 0;
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.55;
}

.auth-status.error {
  color: #a52323;
}

.auth-status.success {
  color: var(--green-deep);
}

.auth-switch-copy {
  margin: -2px 0 0;
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.45;
  text-align: center;
}

.auth-switch-copy button {
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--green-deep);
  cursor: pointer;
  font: inherit;
  font-weight: 850;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.account-card-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 16px;
}

.account-summary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.account-summary-card {
  gap: 8px;
}

.account-summary-label {
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.account-summary-value {
  font-size: 2rem;
  line-height: 1;
  color: var(--ink);
}

.account-library-stack {
  display: grid;
  gap: 18px;
}

.account-library-card {
  gap: 16px;
}

.account-section-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 16px;
}

.account-library-list {
  display: grid;
  gap: 12px;
}

.account-library-item {
  padding: 16px 18px;
  border-radius: 18px;
  border: 1px solid rgba(24, 50, 34, 0.08);
  background: #f8fbf7;
  display: grid;
  gap: 8px;
}

.account-library-item-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
}

.account-library-item h3,
.account-library-item p,
.account-library-item strong {
  margin: 0;
}

.account-library-item p {
  color: var(--muted);
  line-height: 1.6;
}

.account-library-item-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.account-library-pill {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 6px 10px;
  background: rgba(84, 185, 72, 0.1);
  color: var(--green-deep);
  font-size: 0.78rem;
  font-weight: 700;
}

.account-library-total {
  color: var(--ink);
  font-size: 1rem;
}

.account-library-empty {
  padding: 18px;
  border-radius: 18px;
  border: 1px dashed rgba(24, 50, 34, 0.16);
  background: rgba(248, 251, 247, 0.8);
  color: var(--muted);
}

@media (max-width: 1160px) {
  .home-search-grid,
  .home-hero,
  .home-story-grid,
  .home-panel-grid,
  .home-lane-grid,
  .home-daily-city,
  .home-daily-city--gallery,
  .home-daily-city--compact,
  .home-flight-spotlight-card,
  .home-flight-globe-section,
  .home-route-grid,
  .home-app-strip,
  .footer-main,
  .info-layout,
  .auth-layout {
    grid-template-columns: 1fr;
  }

  .home-explore-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .account-summary-grid {
    grid-template-columns: 1fr;
  }

  .home-search-card {
    grid-template-columns: 1fr;
    align-items: start;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card {
    grid-template-columns: minmax(170px, 0.92fr) minmax(0, 1.08fr);
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-media {
    min-height: 220px;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-body {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "location"
      "title"
      "summary"
      "specs"
      "price"
      "footer";
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-price-stack {
    min-width: 0;
    text-align: left;
  }

  .home-search-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .home-search-form .field-group:first-child {
    grid-column: 1 / -1;
  }

  .home-search-form .field-group:nth-child(2),
  .home-search-form .field-group:nth-child(3) {
    grid-column: span 1;
  }

  body.home-page .flight-ideas-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .home-showcase-toolbar {
    flex-direction: column;
    align-items: stretch;
  }

  .home-search-card {
    padding-inline: 32px;
  }

  .home-showcase-controls {
    justify-content: flex-end;
  }

  .home-app-banner-card {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .home-app-banner-actions {
    justify-content: flex-start;
  }

  .home-app-strip-actions {
    justify-content: flex-start;
  }

  .home-flight-spotlight-routes {
    grid-template-columns: 1fr;
  }

  .home-flight-globe-section {
    gap: 8px;
  }

  .home-realistic-globe {
    width: min(700px, 100%);
    justify-self: center;
  }

  .home-flight-promo {
    width: min(720px, 100%);
    justify-self: center;
  }

  .home-flight-visual {
    min-height: 300px;
  }

  .home-daily-city-slider-ui {
    align-items: flex-start;
    flex-direction: column;
  }

  .home-daily-city--poster {
    min-height: 460px;
  }

  .home-daily-city--poster .home-daily-city-copy {
    min-height: 460px;
  }

  .home-daily-city--poster .home-daily-city-media img,
  .home-daily-city--poster .home-daily-city-photo-placeholder {
    min-height: 460px;
  }

  .home-hero-copy {
    padding: 42px;
  }
}

@media (max-width: 760px) {
  body.hotels-page .hotels-browse-section > .results-head,
  body.hotels-page .hotels-browse-section > .hotel-map-section,
  body.hotels-page .hotels-browse-section > .hotels-results-layout,
  body.hotels-page .hotels-browse-section > .results-state {
    width: calc(100% - 12px);
  }

  body.hotels-page .hotels-results-layout,
  body.hotels-page .hotels-results-main,
  body.hotels-page .hotels-lane-stack {
    gap: 12px;
  }

  .range-calendar-summary {
    gap: 8px;
    margin-bottom: 8px;
  }

  .range-calendar-summary-card {
    padding: 10px 12px;
    border-radius: 14px;
  }

  .range-calendar-summary-card span,
  .range-calendar-summary-meta {
    font-size: 0.68rem;
  }

  .range-calendar-summary-card strong {
    font-size: 0.9rem;
  }

  .range-calendar-scroll {
    gap: 10px;
  }

  .range-calendar-month {
    gap: 8px;
  }

  .range-calendar-month-head {
    gap: 8px;
  }

  .range-calendar-month-head h4 {
    font-size: 0.94rem;
  }

  .range-calendar-nav {
    min-height: 32px;
    padding: 0 10px;
    font-size: 0.82rem;
  }

  .range-calendar-weekdays,
  .range-calendar-grid {
    gap: 2px;
  }

  .range-calendar-weekdays span {
    font-size: 0.64rem;
  }

  .range-calendar-day,
  .range-calendar-day-placeholder {
    min-height: 34px;
    border-radius: 10px;
  }

  .range-calendar-day span {
    font-size: 0.84rem;
  }

  .range-calendar-actions {
    justify-content: stretch;
  }

  .range-calendar-save {
    width: 100%;
    min-width: 0;
    min-height: 42px;
  }

  .search-overlay {
    background: #f8fcf6;
    min-height: 100vh;
  }

  .search-overlay-backdrop {
    background: #f8fcf6;
    min-height: 100vh;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  .search-overlay-panel {
    width: 100%;
    height: 100vh;
    min-height: 100vh;
    max-height: none;
    margin: 0;
    padding: 18px 18px calc(28px + env(safe-area-inset-bottom));
    border-radius: 0;
    background: #f8fcf6;
  }

  .search-overlay-head {
    flex-direction: column;
    align-items: stretch;
  }

  .search-overlay-head .header-action-button {
    width: 100%;
  }

  .search-overlay-trigger {
    min-height: 76px;
    padding: 16px 16px;
    border-radius: 22px;
  }

  .search-overlay-trigger-action {
    min-width: 78px;
    min-height: 42px;
    padding: 0 14px;
  }

  .mobile-bottom-dock {
    display: flex;
    align-items: center;
    gap: 4px;
  }

  body.mobile-dock-page .site-footer {
    padding-bottom: 126px;
  }

  body.mobile-dock-page .toast {
    bottom: 104px;
  }

  body.primary-travel-page .page-shell,
  body.info-page .page-shell {
    width: calc(100% - 20px);
  }

  body.primary-travel-page .site-header,
  body.info-page .site-header {
    border-radius: 18px;
    padding: 10px 12px;
  }

  .site-header > .header-actions {
    gap: 8px;
    flex-wrap: nowrap;
    align-items: center;
  }

  body.primary-travel-page .profile-action-button,
  body.info-page .profile-action-button {
    width: 40px;
    min-width: 40px;
    height: 40px;
  }

  body.home-page .site-header > .site-nav {
    justify-content: center;
    overflow-x: visible;
    gap: 18px;
    text-align: center;
  }

  .home-hero-copy,
  .home-search-card,
  .home-panel-card,
  .home-lane-card,
  .home-story-card,
  .home-showcase-section,
  .home-routes-section,
  .home-daily-city,
  .home-flight-spotlight-card,
  .home-flight-promo,
  .home-explore-section,
  .home-planner-section,
  .home-app-strip,
  .home-footer {
    border-radius: 26px;
  }

  .home-search-stage {
    width: auto;
    margin-left: 0;
    margin-right: 0;
  }

  .home-hero-copy,
  .home-search-card,
  .home-panel-card,
  .home-lane-card,
  .home-story-card,
  .home-showcase-section,
  .home-routes-section,
  .home-flight-spotlight-card,
  .home-flight-promo,
  .home-explore-section,
  .home-planner-section,
  .home-app-strip,
  .home-footer {
    padding: 24px;
  }

  .home-daily-city-copy {
    padding: 28px;
  }

  .home-daily-city-copy h2,
  .home-flight-spotlight-copy h2,
  .home-app-strip h2 {
    font-size: 2.8rem;
  }

  .home-flight-spotlight-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .home-realistic-globe {
    width: min(620px, 100%);
    height: clamp(400px, 86vw, 560px);
  }

  .home-flight-promo h2 {
    font-size: 2.8rem;
  }

  .home-flight-visual {
    min-height: 260px;
  }

  .home-flight-globe {
    width: min(100%, 270px);
  }

  .home-flight-globe-actions {
    width: 100%;
    margin-top: 0;
  }

  .home-flight-globe-actions .button {
    flex: 1 1 180px;
  }

  .home-daily-city-media,
  .home-daily-city-media img,
  .home-daily-city-photo-placeholder,
  .home-daily-city--poster .home-daily-city-media img,
  .home-daily-city--poster .home-daily-city-photo-placeholder,
  .home-daily-city--compact .home-daily-city-media,
  .home-daily-city--compact .home-daily-city-media img,
  .home-daily-city--compact .home-daily-city-photo-placeholder {
    min-height: 280px;
  }

  .home-daily-city--poster {
    min-height: 0;
  }

  .home-daily-city--poster::before {
    background: linear-gradient(180deg, rgba(9, 19, 13, 0.78), rgba(9, 19, 13, 0.24));
  }

  .home-daily-city--poster .home-daily-city-copy {
    min-height: 420px;
  }

  .home-daily-city-media figcaption {
    position: static;
    border-radius: 0;
    background: #12251a;
  }

  .home-daily-city-nav {
    width: 100%;
  }

  .home-daily-city-nav-button {
    flex: 1 1 0;
  }

  .home-hero-copy h1 {
    font-size: 2.9rem;
  }

  .home-search-intro h1 {
    font-size: 2.55rem;
  }

  .home-hero-actions {
    grid-template-columns: 1fr;
    max-width: none;
  }

  .home-hero-actions,
  .home-search-actions,
  .home-footer-links,
  .home-popular-row,
  .home-hero-pills,
  .home-card-actions {
    flex-direction: column;
  }

  .home-search-actions,
  .home-card-actions,
  body.home-page .download-badge-row,
  .home-app-banner-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .home-search-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .home-search-form .field-group:first-child,
  .home-search-form .field-group:nth-child(2),
  .home-search-form .field-group:nth-child(3) {
    grid-column: 1 / -1;
  }

  .home-input-shell,
  .home-date-trigger,
  .home-date-input,
  .home-search-form .home-search-input {
    min-height: 52px;
    border-radius: 18px;
  }

  .home-date-trigger {
    padding: 0 14px;
  }

  .home-date-panel {
    width: 100%;
    padding: 10px;
  }

  .home-date-panel-grid {
    grid-template-columns: 1fr;
  }

  .home-search-card {
    min-height: 0;
    padding: 18px;
  }

  .home-search-form {
    padding: 18px;
    border-radius: 24px;
    width: 100%;
  }

  .home-search-actions .button {
    width: 100%;
    min-width: 0;
    justify-content: center;
  }

  .home-card-actions .button,
  body.home-page .app-store-badge {
    width: 100%;
    min-width: 0;
    justify-content: center;
  }

  .home-showcase-controls {
    justify-content: stretch;
  }

  .home-showcase-controls .home-rail-button {
    flex: 1;
  }

  body.home-page .flight-ideas-grid,
  body.home-page .featured-hotels-grid,
  .home-explore-grid,
  .home-route-grid {
    grid-template-columns: 1fr;
  }

  .home-showcase-track {
    grid-auto-columns: minmax(84vw, 84vw);
    gap: 14px;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card {
    grid-template-columns: minmax(148px, 0.92fr) minmax(0, 1.08fr);
    width: 100%;
    min-height: 212px;
    height: 212px;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-media {
    min-height: 212px;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-photo-grid {
    grid-template-columns: 1fr;
    grid-template-rows: 122px 84px;
    min-height: 212px;
    gap: 3px;
    padding: 3px;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-photo-stack {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: none;
    gap: 3px;
    height: 84px;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-photo-thumb,
  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-photo-placeholder {
    min-height: 84px;
    height: 84px;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-photo-hero-wrap {
    background: transparent;
    height: 122px;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-body {
    grid-template-columns: 1fr;
    grid-template-areas:
      "location"
      "title"
      "summary"
      "specs"
      "price";
    padding: 8px 10px 8px 6px;
    gap: 4px 6px;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-body h3 {
    -webkit-line-clamp: 1;
    font-size: 0.72rem;
    line-height: 1.14;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-body > p:not(.featured-hotel-location) {
    -webkit-line-clamp: 1;
    max-width: none;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-price-stack {
    min-width: 0;
    text-align: left;
    gap: 4px;
  }

  body.hotels-page .hotel-browse-track {
    grid-auto-columns: calc((100% - 10px) / 2);
    gap: 10px;
    padding-inline: 0;
  }

  body.hotels-page .hotel-card-media {
    min-height: 176px;
    aspect-ratio: 1 / 1.18;
    padding: 8px;
  }

  body.hotels-page .hotel-card-body {
    padding: 9px;
    gap: 6px;
  }

  body.hotels-page .hotel-card-chip,
  body.hotels-page .featured-hotel-status {
    padding: 5px 7px;
    font-size: 0.62rem;
  }

  body.hotels-page .featured-hotel-status {
    display: none;
  }

  .featured-hotel-card.hotel-browse-card .hotel-card-body h3 {
    font-size: 0.72rem;
  }

  .featured-hotel-card.hotel-browse-card .featured-hotel-location {
    font-size: 0.56rem;
    line-height: 1.18;
  }

  .featured-hotel-card.hotel-browse-card .hotel-price-stack {
    padding: 0;
    border-radius: 11px;
  }

  .featured-hotel-card.hotel-browse-card .hotel-price-primary {
    font-size: 0.62rem;
    line-height: 0.98;
  }

  .featured-hotel-card.hotel-browse-card .hotel-price-primary-static {
    font-size: 0.74rem;
  }

  .featured-hotel-card.hotel-browse-card .hotel-card-body > p:not(.featured-hotel-location) {
    font-size: 0.58rem;
    line-height: 1.16;
  }

  .featured-hotel-card.hotel-browse-card .hotel-price-primary span,
  .featured-hotel-card.hotel-browse-card .hotel-price-secondary {
    font-size: 0.52rem;
    line-height: 1.14;
  }

  .featured-hotel-card.hotel-browse-card .hotel-price-secondary-trip {
    font-size: 0.7rem;
    line-height: 1.08;
  }

  .featured-hotel-card.hotel-browse-card .hotel-price-secondary-trip span {
    font-size: 0.56rem;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-price-secondary.hotel-price-secondary-trip,
  .featured-hotel-card.hotel-browse-card .hotel-price-secondary.hotel-price-secondary-trip {
    font-size: 0.7rem;
    line-height: 1.08;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-price-secondary.hotel-price-secondary-trip span,
  .featured-hotel-card.hotel-browse-card .hotel-price-secondary.hotel-price-secondary-trip span {
    font-size: 0.56rem;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-price-secondary.hotel-price-secondary-trip .hotel-price-secondary-trip-label,
  .featured-hotel-card.hotel-browse-card .hotel-price-secondary.hotel-price-secondary-trip .hotel-price-secondary-trip-label {
    font-size: 0.5rem;
    line-height: 1.06;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-price-secondary.hotel-price-secondary-trip .hotel-price-secondary-trip-amount,
  .featured-hotel-card.hotel-browse-card .hotel-price-secondary.hotel-price-secondary-trip .hotel-price-secondary-trip-amount {
    font-size: 0.96rem;
    line-height: 1;
  }

  .featured-hotel-card.hotel-browse-card .hotel-spec-row {
    display: none;
  }

  .home-app-banner-card {
    padding: 18px;
    gap: 14px;
  }

  .home-app-banner-card h2 {
    font-size: 1.65rem;
    line-height: 1.02;
  }

  .home-app-banner-card .section-copy {
    font-size: 0.96rem;
    line-height: 1.5;
  }

  .home-app-banner-card .download-badge-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
  }

  body.home-page .home-app-banner-card .app-store-badge {
    min-width: 0;
    width: 100%;
    padding: 11px 12px;
    font-size: 0.92rem;
  }

  .home-footer {
    flex-direction: column;
    align-items: flex-start;
  }

  .footer-grid,
  .info-grid {
    grid-template-columns: 1fr;
  }

  .info-card,
  .info-grid-card {
    padding: 22px;
  }
}

html:has(body.hotel-map-page) {
  height: 100%;
  overflow: hidden;
}

body.hotel-map-page {
  min-height: 100vh;
  overflow: hidden;
  background: #edf2f7;
  color: #111827;
}

body.hotel-map-page .page-shell {
  width: 100vw;
  height: 100vh;
  max-width: none;
  margin: 0;
  padding: 0;
}

body.hotel-map-page {
  --travel-grass: #174c2e;
  --travel-grass-deep: #123f27;
  --travel-grass-pale: #eaf1ec;
}

body.hotel-map-page .site-header {
  position: fixed;
  top: 12px;
  left: 12px;
  right: 12px;
  z-index: 1200;
  width: auto;
  margin: 0;
  padding: 10px 14px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.12);
  backdrop-filter: blur(18px);
}

body.hotel-map-page .hotels-main-refined {
  position: fixed;
  inset: 0;
  display: block;
  margin: 0;
}

body.hotel-map-page .hotels-search-stage {
  position: fixed;
  top: 88px;
  left: 50%;
  z-index: 1150;
  width: min(1040px, calc(100vw - 32px));
  margin: 0;
  transform: translateX(-50%);
}

body.hotel-map-page .hotels-search-form {
  padding: 10px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 16px 38px rgba(15, 23, 42, 0.14);
  backdrop-filter: blur(18px);
}

body.hotel-map-page .hotel-customer-search {
  grid-template-columns:
    minmax(240px, 2.2fr)
    minmax(132px, 1fr)
    minmax(132px, 1fr)
    minmax(86px, 0.58fr)
    minmax(86px, 0.58fr)
    minmax(132px, 0.76fr);
  gap: 8px;
}

body.hotel-map-page .hotel-form-label {
  font-size: 0.68rem;
}

body.hotel-map-page .hotel-form-control,
body.hotel-map-page .hotel-form-submit {
  height: 42px;
  border-radius: 6px;
  font-size: 0.86rem;
}

body.hotel-map-page .hotel-map-page-section {
  position: fixed;
  inset: 0;
  display: block;
  width: 100vw;
  margin: 0;
  padding: 0;
}

body.hotel-map-page .hotel-map-page-head,
body.hotel-map-page .hotels-filter-bar,
body.hotel-map-page .hotels-selected-card,
body.hotel-map-page .hotels-lane-stack:not(.hotel-map-results-list) {
  display: none !important;
}

body.hotel-map-page .hotel-map-section,
body.hotels-page.hotel-map-page .hotels-browse-section > .hotel-map-section {
  position: absolute;
  inset: 0;
  width: 100vw;
  margin: 0;
  scroll-margin-top: 0;
}

body.hotel-map-page .hotel-map-shell {
  position: absolute;
  inset: 0;
  display: block;
}

body.hotel-map-page .hotel-map-stage {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: 100vh;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

body.hotel-map-page .hotel-map-stage .leaflet-top.leaflet-right {
  top: 106px;
  right: 16px;
}

body.hotel-map-page .hotel-map-empty {
  display: none !important;
}

body.hotel-map-page .hotel-map-card {
  position: fixed;
  right: 20px;
  top: 150px;
  bottom: 20px;
  z-index: 1150;
  width: min(340px, calc(100vw - 32px));
  max-height: none;
  overflow: auto;
  gap: 8px;
  padding: 14px;
  border-radius: 8px;
  box-shadow: 0 20px 48px rgba(15, 23, 42, 0.18);
  animation: hotel-map-panel-in 180ms ease-out;
  scrollbar-width: thin;
}

body.hotel-map-page .hotel-map-card[hidden],
body.hotel-map-page .mobile-bottom-dock {
  display: none !important;
}

body.hotel-map-page .hotel-map-card-close {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 20;
  display: inline-grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  color: #111827;
  cursor: pointer;
  font: inherit;
  font-size: 1.15rem;
  font-weight: 900;
  line-height: 1;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.12);
  pointer-events: auto;
  touch-action: manipulation;
}

body.hotel-map-page .hotel-map-card-close:hover,
body.hotel-map-page .hotel-map-card-close:focus-visible {
  background: #111827;
  color: #ffffff;
  outline: none;
}

body.hotel-map-page .hotel-map-card-media {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 142px;
  max-height: 170px;
  margin: -4px -4px 2px;
  overflow: hidden;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(84, 185, 72, 0.9), rgba(38, 123, 49, 0.92)),
    linear-gradient(45deg, rgba(255, 255, 255, 0.16) 25%, transparent 25% 50%, rgba(255, 255, 255, 0.12) 50% 75%, transparent 75%);
  color: #ffffff;
}

body.hotel-map-page .hotel-map-card-image {
  width: 100%;
  height: 100%;
  min-height: 142px;
  object-fit: cover;
}

body.hotel-map-page .hotel-map-card-media.is-loading::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(110deg, transparent 0 28%, rgba(255, 255, 255, 0.26) 44%, transparent 62%);
  transform: translateX(-100%);
  animation: hotel-map-image-loading 950ms ease-in-out infinite;
}

body.hotel-map-page .hotel-map-card-image-placeholder {
  font-size: 0.82rem;
  font-weight: 950;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

body.hotel-map-page .hotel-map-card-amenities {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

body.hotel-map-page .hotel-map-card-amenities[hidden],
body.hotel-map-page .hotel-map-card-rating[hidden] {
  display: none;
}

body.hotel-map-page .hotel-map-card-amenities span {
  max-width: 100%;
  padding: 5px 8px;
  overflow: hidden;
  border: 1px solid rgba(38, 123, 49, 0.12);
  border-radius: 999px;
  background: rgba(84, 185, 72, 0.09);
  color: #267b31;
  font-size: 0.72rem;
  font-weight: 850;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.hotel-map-page .hotel-map-card h3 {
  color: #111827;
  display: -webkit-box;
  overflow: hidden;
  font-size: 1.02rem;
  line-height: 1.22;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

body.hotel-map-page .hotel-map-card p {
  color: #64748b;
  display: -webkit-box;
  overflow: hidden;
  font-size: 0.82rem;
  line-height: 1.42;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

body.hotel-map-page .hotel-map-card strong {
  font-size: 1.38rem;
}

body.hotel-map-page .hotel-map-card-link {
  display: inline-flex;
  justify-content: center;
  width: 100%;
  min-height: 42px;
  margin-top: 2px;
}

@keyframes hotel-map-panel-in {
  from {
    opacity: 0;
    transform: translateX(18px) scale(0.98);
  }

  to {
    opacity: 1;
    transform: translateX(0) scale(1);
  }
}

@keyframes hotel-map-sheet-up {
  from {
    opacity: 0;
    transform: translateY(24px) scale(0.96);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes hotel-map-image-loading {
  to {
    transform: translateX(100%);
  }
}

body.hotel-map-page .results-state {
  position: fixed;
  left: 24px;
  bottom: 24px;
  z-index: 1150;
  display: none;
  max-width: min(360px, calc(100vw - 32px));
  margin: 0;
  padding: 10px 14px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.95);
  color: #111827;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.13);
  font-size: 0.86rem;
  font-weight: 800;
  backdrop-filter: blur(16px);
}

body.hotel-map-page .results-state.visible {
  display: block;
}

@media (max-width: 920px) {
  body.hotel-map-page .site-header {
    top: 0;
    left: 0;
    right: 0;
    border-radius: 0;
  }

  body.hotel-map-page .hotels-search-stage {
    top: 82px;
    width: calc(100vw - 16px);
  }

  body.hotel-map-page .hotel-customer-search {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  body.hotel-map-page .hotel-form-field-location,
  body.hotel-map-page .hotel-form-submit {
    grid-column: 1 / -1;
  }
}

@media (max-width: 640px) {
  body.hotel-map-page .site-header {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "brand actions";
    gap: 8px;
    padding: max(8px, env(safe-area-inset-top)) 10px 8px;
    border-bottom: 1px solid rgba(17, 24, 39, 0.08);
  }

  body.hotel-map-page .hotels-search-stage {
    top: 62px;
    left: 10px;
    right: 10px;
    z-index: 1190;
    width: auto;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-10px);
    transition: opacity 160ms ease, transform 160ms ease;
  }

  body.hotel-map-search-open .hotels-search-stage {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
  }

  body.hotel-map-page .hotels-search-form {
    padding: 10px;
    border-radius: 8px;
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.16);
  }

  body.hotel-map-page .hotel-customer-search {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  body.hotel-map-page .hotel-form-control,
  body.hotel-map-page .hotel-form-submit {
    height: 40px;
    font-size: 0.8rem;
  }

  body.hotel-map-page .hotel-map-card,
  body.hotel-map-page .results-state {
    right: 12px;
    left: 12px;
    bottom: 12px;
    width: auto;
    max-width: none;
  }

  body.hotel-map-page .site-header > .site-nav {
    display: none;
  }

  body.hotel-map-page .site-header > .header-actions {
    gap: 6px;
  }

  body.hotel-map-page .map-search-toggle {
    display: inline-flex;
    min-height: 38px;
    padding: 8px 13px;
    border-color: rgba(15, 23, 42, 0.1);
    border-radius: 6px;
    background: #ffffff;
    color: #111827;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
    font-weight: 850;
  }

  body.hotel-map-page .map-search-toggle[aria-expanded="true"] {
    background: #111827;
    color: #ffffff;
  }

  body.hotel-map-page .cart-button {
    display: none;
  }

  body.hotel-map-page .profile-action-button {
    color: #111827;
    background: #ffffff;
  }

  body.hotel-map-page .results-state {
    bottom: 92px;
    text-align: center;
  }

  body.hotel-map-page .hotel-map-card {
    top: auto;
    right: 10px;
    bottom: max(12px, env(safe-area-inset-bottom));
    left: 10px;
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 7px 10px;
    align-items: start;
    width: auto;
    max-height: min(46vh, 360px);
    padding: 10px;
    border-radius: 12px;
    animation: hotel-map-sheet-up 190ms ease-out;
    transform-origin: center bottom;
  }

  body.hotel-map-page .hotel-map-card-media {
    grid-row: 1 / span 4;
    width: 96px;
    height: 96px;
    min-height: 96px;
    margin: 0;
    border-radius: 10px;
  }

  body.hotel-map-page .hotel-map-card-image {
    height: 96px;
    min-height: 96px;
  }

  body.hotel-map-page .hotel-map-card > .eyebrow {
    display: none;
  }

  body.hotel-map-page .hotel-map-card h3 {
    grid-column: 2;
    padding-right: 34px;
    font-size: 0.96rem;
  }

  body.hotel-map-page .hotel-map-card p,
  body.hotel-map-page .hotel-map-card-rating {
    grid-column: 2;
    font-size: 0.78rem;
    line-height: 1.32;
  }

  body.hotel-map-page .hotel-map-card-amenities {
    grid-column: 1 / -1;
    max-height: 2.1rem;
    overflow: hidden;
  }

  body.hotel-map-page .hotel-map-card-amenities span {
    padding: 4px 7px;
    font-size: 0.68rem;
  }

  body.hotel-map-page .hotel-map-card strong {
    grid-column: 1;
    align-self: center;
    font-size: 1.16rem;
  }

  body.hotel-map-page .hotel-map-card-link {
    grid-column: 1 / -1;
    align-self: center;
    min-height: 40px;
    margin: 0;
    padding-inline: 12px;
  }

  body.hotel-map-page .hotel-map-card-close {
    top: 6px;
    right: 6px;
    width: 44px;
    height: 44px;
  }

  body.hotel-map-page .hotel-map-stage .leaflet-top.leaflet-right {
    top: 68px;
    right: 10px;
  }

body.hotel-map-page .mobile-bottom-dock {
  display: none !important;
}
}

@media (min-width: 821px) {
  .hotel-detail-gallery-card-hero {
    width: min(1220px, calc(100% - 36px)) !important;
  }

  .hotel-detail-gallery-hero {
    height: auto !important;
    min-height: 0 !important;
    max-height: 74vh !important;
    aspect-ratio: auto !important;
    object-fit: unset !important;
    object-position: initial !important;
    background: transparent !important;
  }
}

@media (max-width: 760px) {
body.hotel-detail-page .mobile-bottom-dock {
    display: none !important;
  }
}

/* Professional homepage refresh */
body.home-page-pro {
  --home-pro-green: #54b948;
  --home-pro-green-dark: #2d7f29;
  --home-pro-black: #101310;
  --home-pro-muted: #667067;
  --home-pro-wash: #f2f7f0;
  color: var(--home-pro-black);
  background: #ffffff;
}

body.home-page-pro .home-shell-pro {
  width: min(1340px, calc(100% - 40px));
}

body.home-page-pro .home-main-pro {
  display: grid;
  gap: clamp(72px, 8vw, 116px);
  margin-top: 24px;
}

body.home-page-pro .home-main-pro h1,
body.home-page-pro .home-main-pro h2,
body.home-page-pro .home-main-pro h3 {
  font-family: var(--font-sans);
}

body.home-page-pro .home-main-pro .eyebrow {
  margin: 0 0 12px;
  color: var(--home-pro-green-dark);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

body.home-page-pro .home-pro-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(330px, 0.72fr);
  gap: 26px;
  min-height: 650px;
  padding: clamp(46px, 7vw, 92px);
  padding-bottom: 166px;
  overflow: hidden;
  border-radius: 30px;
  background:
    radial-gradient(circle at 82% 12%, rgba(84, 185, 72, 0.35), transparent 27%),
    radial-gradient(circle at 58% 90%, rgba(84, 185, 72, 0.12), transparent 30%),
    var(--home-pro-black);
  color: #ffffff;
  isolation: isolate;
}

body.home-page-pro .home-pro-hero::before {
  content: "";
  position: absolute;
  top: -180px;
  right: -120px;
  z-index: -1;
  width: 520px;
  height: 520px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 50%;
  box-shadow:
    0 0 0 64px rgba(255, 255, 255, 0.025),
    0 0 0 128px rgba(255, 255, 255, 0.018);
}

body.home-page-pro .home-pro-hero-copy {
  align-self: center;
  max-width: 730px;
}

body.home-page-pro .home-pro-hero-copy .eyebrow,
body.home-page-pro .home-map-discovery .eyebrow {
  color: #8fdf83;
}

body.home-page-pro .home-pro-hero-copy h1 {
  max-width: 760px;
  margin: 0;
  color: #ffffff;
  font-size: clamp(3.45rem, 6.4vw, 6.6rem);
  font-weight: 780;
  letter-spacing: -0.07em;
  line-height: 0.87;
}

body.home-page-pro .home-pro-hero-copy h1 span {
  color: var(--home-pro-green);
}

body.home-page-pro .home-pro-lede {
  max-width: 600px;
  margin: 26px 0 0;
  color: rgba(255, 255, 255, 0.72);
  font-size: clamp(1rem, 1.45vw, 1.18rem);
  line-height: 1.7;
}

body.home-page-pro .home-pro-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 30px;
}

body.home-page-pro .home-pro-hero-actions .button {
  min-height: 50px;
}

body.home-page-pro .home-pro-hero-actions .button-secondary {
  border-color: rgba(255, 255, 255, 0.24);
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
}

body.home-page-pro .home-pro-route-spotlight {
  align-self: center;
  display: grid;
  gap: 34px;
  min-height: 348px;
  padding: 30px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.07);
  box-shadow: 0 26px 80px rgba(0, 0, 0, 0.22);
  backdrop-filter: blur(18px);
}

body.home-page-pro .home-pro-route-topline,
body.home-page-pro .home-pro-route-footer,
body.home-page-pro .home-flight-deal-kicker,
body.home-page-pro .home-flight-deal-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

body.home-page-pro .home-pro-route-topline span,
body.home-page-pro .home-pro-route-topline strong {
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

body.home-page-pro .home-pro-route-topline strong {
  color: #8fdf83;
}

body.home-page-pro .home-pro-route-codes {
  display: grid;
  grid-template-columns: auto minmax(50px, 1fr) auto;
  align-items: center;
  gap: 18px;
}

body.home-page-pro .home-pro-route-codes > div {
  display: grid;
  gap: 2px;
}

body.home-page-pro .home-pro-route-codes > div:last-child {
  text-align: right;
}

body.home-page-pro .home-pro-route-codes strong {
  color: #ffffff;
  font-size: clamp(2.6rem, 4vw, 4rem);
  letter-spacing: -0.06em;
  line-height: 1;
}

body.home-page-pro .home-pro-route-codes div span {
  color: rgba(255, 255, 255, 0.58);
  font-size: 0.78rem;
}

body.home-page-pro .home-pro-route-line,
body.home-page-pro .home-flight-deal-route > span {
  position: relative;
  height: 1px;
  background: rgba(255, 255, 255, 0.28);
}

body.home-page-pro .home-pro-route-line::after,
body.home-page-pro .home-flight-deal-route > span::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  width: 7px;
  height: 7px;
  border-top: 1px solid currentColor;
  border-right: 1px solid currentColor;
  transform: translateY(-50%) rotate(45deg);
}

body.home-page-pro .home-pro-route-line i,
body.home-page-pro .home-flight-deal-route > span i {
  position: absolute;
  top: 50%;
  left: 35%;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--home-pro-green);
  box-shadow: 0 0 0 5px rgba(84, 185, 72, 0.18);
  transform: translateY(-50%);
}

body.home-page-pro .home-pro-route-footer {
  align-self: end;
  padding-top: 18px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}

body.home-page-pro .home-pro-route-footer span {
  color: rgba(255, 255, 255, 0.66);
  font-size: 0.78rem;
}

body.home-page-pro .home-pro-route-footer a {
  color: #ffffff;
  font-size: 0.82rem;
  font-weight: 800;
  text-decoration: none;
}

body.home-page-pro .home-pro-search-card {
  position: absolute;
  right: clamp(28px, 5vw, 70px);
  bottom: 0;
  left: clamp(28px, 5vw, 70px);
  z-index: 5;
  display: grid;
  grid-template-columns: minmax(220px, 0.46fr) minmax(420px, 1fr);
  align-items: center;
  gap: 26px;
  min-height: 118px;
  padding: 22px 24px;
  border-radius: 24px 24px 0 0;
  background: #ffffff;
  color: var(--home-pro-black);
  box-shadow: 0 -16px 50px rgba(0, 0, 0, 0.12);
}

body.home-page-pro .home-pro-search-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 18px;
}

body.home-page-pro .home-pro-search-heading .eyebrow {
  margin-bottom: 4px;
}

body.home-page-pro .home-pro-search-heading h2 {
  margin: 0;
  font-size: 1.24rem;
  letter-spacing: -0.035em;
  line-height: 1.15;
}

body.home-page-pro .home-pro-search-modes {
  display: flex;
  gap: 4px;
  padding: 4px;
  border-radius: 999px;
  background: var(--home-pro-wash);
}

body.home-page-pro .home-pro-search-modes a {
  padding: 7px 11px;
  border-radius: 999px;
  color: var(--home-pro-muted);
  font-size: 0.7rem;
  font-weight: 850;
  text-decoration: none;
}

body.home-page-pro .home-pro-search-modes a.is-active {
  background: var(--home-pro-black);
  color: #ffffff;
}

body.home-page-pro .home-pro-search-card .search-overlay-trigger {
  min-height: 70px;
  border: 0;
  border-radius: 16px;
  background: var(--home-pro-wash);
  box-shadow: none;
}

body.home-page-pro .home-pro-search-card .search-overlay-trigger-action {
  min-height: 48px;
  padding-inline: 20px;
  border-radius: 12px;
  background: var(--home-pro-green);
  color: #0d1b0d;
}

body.home-page-pro .home-trust-row {
  display: flex;
  justify-content: center;
  gap: clamp(24px, 7vw, 86px);
  margin-top: -82px;
  color: #566057;
  font-size: 0.84rem;
  font-weight: 750;
}

body.home-page-pro .home-trust-row span {
  display: inline-flex;
  align-items: center;
  gap: 9px;
}

body.home-page-pro .home-trust-row i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--home-pro-green);
  box-shadow: 0 0 0 4px rgba(84, 185, 72, 0.13);
}

body.home-page-pro .home-pro-section {
  display: grid;
  gap: 30px;
}

body.home-page-pro .home-pro-section-head {
  align-items: end;
  margin: 0;
}

body.home-page-pro .home-pro-section-head h2,
body.home-page-pro .home-map-discovery-copy h2,
body.home-page-pro .home-pro-final-banner h2 {
  max-width: 780px;
  margin: 0;
  color: var(--home-pro-black);
  font-size: clamp(2.2rem, 4vw, 4rem);
  font-weight: 760;
  letter-spacing: -0.06em;
  line-height: 0.98;
}

body.home-page-pro .home-pro-section-head .section-copy {
  max-width: 350px;
  margin: 0;
  color: var(--home-pro-muted);
  font-size: 0.88rem;
  line-height: 1.55;
  text-align: right;
}

body.home-page-pro .home-pro-text-link {
  color: var(--home-pro-black);
  font-size: 0.86rem;
  font-weight: 850;
  text-decoration: none;
}

body.home-page-pro .home-pro-text-link:hover,
body.home-page-pro .home-flight-deal-bottom a:hover {
  color: var(--home-pro-green-dark);
}

body.home-page-pro .home-flight-deal-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

body.home-page-pro .home-flight-deal-card {
  display: grid;
  gap: 28px;
  min-height: 240px;
  padding: 24px;
  border-radius: 18px;
  background: var(--home-pro-wash);
  transition: transform 180ms ease, background 180ms ease;
}

body.home-page-pro .home-flight-deal-card:hover {
  background: #eaf3e7;
  transform: translateY(-3px);
}

body.home-page-pro .home-flight-deal-kicker span,
body.home-page-pro .home-flight-deal-kicker em {
  color: var(--home-pro-muted);
  font-size: 0.72rem;
  font-style: normal;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

body.home-page-pro .home-flight-deal-kicker em {
  color: var(--home-pro-green-dark);
}

body.home-page-pro .home-flight-deal-route {
  display: grid;
  grid-template-columns: auto minmax(50px, 1fr) auto;
  align-items: center;
  gap: 16px;
}

body.home-page-pro .home-flight-deal-route strong {
  color: var(--home-pro-black);
  font-size: clamp(2.1rem, 3.3vw, 3.15rem);
  letter-spacing: -0.07em;
  line-height: 1;
}

body.home-page-pro .home-flight-deal-route > span {
  color: var(--home-pro-black);
  background: rgba(16, 19, 16, 0.22);
}

body.home-page-pro .home-flight-deal-bottom {
  align-items: end;
  min-height: 44px;
}

body.home-page-pro .home-flight-deal-bottom > div {
  display: grid;
  gap: 2px;
}

body.home-page-pro .home-flight-deal-bottom small {
  color: var(--home-pro-muted);
  font-size: 0.7rem;
}

body.home-page-pro .home-flight-deal-bottom strong {
  color: var(--home-pro-black);
  font-size: 1.28rem;
  line-height: 1.1;
}

body.home-page-pro .home-flight-deal-bottom strong span {
  color: var(--home-pro-muted);
  font-size: 0.7rem;
  font-weight: 700;
}

body.home-page-pro .home-flight-deal-bottom a {
  color: var(--home-pro-black);
  font-size: 0.77rem;
  font-weight: 900;
  text-decoration: none;
}

body.home-page-pro .home-price-disclaimer {
  margin: -14px 0 0;
  color: #7b847b;
  font-size: 0.7rem;
}

body.home-page-pro .home-skeleton-line,
body.home-page-pro .home-skeleton-dot,
body.home-page-pro .home-destination-skeleton,
body.home-page-pro .home-realistic-globe-loading span {
  display: block;
  overflow: hidden;
  border-radius: 999px;
  background: #dce3da;
  background-image: linear-gradient(100deg, transparent 25%, rgba(255, 255, 255, 0.75) 45%, transparent 65%);
  background-size: 220% 100%;
  animation: home-pro-skeleton 1.2s ease-in-out infinite;
}

body.home-page-pro .home-skeleton-dot {
  width: 54px;
  height: 18px;
}

body.home-page-pro .home-skeleton-line {
  height: 13px;
}

body.home-page-pro .home-skeleton-line-wide {
  width: 104px;
}

body.home-page-pro .home-skeleton-line-price {
  width: 74px;
  height: 24px;
}

@keyframes home-pro-skeleton {
  from { background-position: 110% 0; }
  to { background-position: -110% 0; }
}

body.home-page-pro .home-destination-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-rows: 310px;
  gap: 14px;
}

body.home-page-pro .home-destination-banner {
  position: relative;
  min-height: 310px;
  overflow: hidden;
  border-radius: 20px;
  color: #ffffff;
  text-decoration: none;
  isolation: isolate;
}

body.home-page-pro .home-destination-banner-wide {
  grid-row: span 1;
}

body.home-page-pro .home-destination-media,
body.home-page-pro .home-destination-media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

body.home-page-pro .home-destination-media {
  z-index: -2;
  border-radius: 0;
  background-color: #dce3da;
}

body.home-page-pro .home-destination-media img {
  display: block;
  object-fit: cover;
  opacity: 0;
  transform: scale(1.02);
  transition: opacity 320ms ease, transform 500ms ease;
}

body.home-page-pro .home-destination-media.is-ready img {
  opacity: 1;
}

body.home-page-pro .home-destination-fallback {
  background:
    radial-gradient(circle at 72% 24%, rgba(255, 255, 255, 0.18), transparent 25%),
    linear-gradient(145deg, #4faa43, #173c1b);
}

body.home-page-pro .home-destination-banner:hover .home-destination-media img {
  transform: scale(1.055);
}

body.home-page-pro .home-destination-shade {
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, rgba(7, 12, 8, 0.04) 25%, rgba(7, 12, 8, 0.82) 100%);
}

body.home-page-pro .home-destination-copy {
  position: absolute;
  right: 26px;
  bottom: 24px;
  left: 26px;
  display: grid;
  gap: 2px;
}

body.home-page-pro .home-destination-copy small {
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.74rem;
  font-weight: 700;
}

body.home-page-pro .home-destination-copy strong {
  color: #ffffff;
  font-size: clamp(1.8rem, 3vw, 3rem);
  font-weight: 780;
  letter-spacing: -0.055em;
  line-height: 1.05;
}

body.home-page-pro .home-destination-copy > span {
  margin-top: 9px;
  color: #a2e598;
  font-size: 0.76rem;
  font-weight: 850;
}

body.home-page-pro .home-showcase-controls {
  display: flex;
  gap: 8px;
}

body.home-page-pro .home-pro-arrow-button {
  display: inline-grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 50%;
  background: var(--home-pro-black);
  color: #ffffff;
  cursor: pointer;
  font: inherit;
  font-size: 1rem;
}

body.home-page-pro .home-pro-arrow-button:disabled {
  background: #edf0ec;
  color: #a2a9a2;
  cursor: default;
}

body.home-page-pro .home-showcase-track {
  gap: 16px;
  margin: 0;
  padding: 0 0 12px;
  scroll-padding-left: 0;
}

body.home-page-pro .home-showcase-track > .featured-hotel-card,
body.home-page-pro .featured-hotel-card.hotel-browse-card {
  flex: 0 0 min(310px, 82vw);
  min-width: min(310px, 82vw);
  overflow: hidden;
  border: 0;
  border-radius: 16px;
  background: #ffffff;
  box-shadow: none;
  cursor: pointer;
}

body.home-page-pro .featured-hotel-card .hotel-card-media {
  min-height: 222px;
  border-radius: 16px;
}

body.home-page-pro .featured-hotel-card .hotel-card-body {
  gap: 6px;
  padding: 14px 2px 0;
}

body.home-page-pro .featured-hotel-card .featured-hotel-location {
  color: var(--home-pro-green-dark);
  font-size: 0.68rem;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

body.home-page-pro .featured-hotel-card .hotel-card-body h3 {
  color: var(--home-pro-black);
  font-size: 1.08rem;
  letter-spacing: -0.025em;
  line-height: 1.25;
}

body.home-page-pro .home-hotel-card-title-link {
  color: inherit;
  text-decoration: none;
}

body.home-page-pro .home-hotel-card-title-link:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

body.home-page-pro .home-hotel-card-title-link:focus-visible {
  border-radius: 4px;
  outline: 3px solid rgba(38, 123, 49, 0.34);
  outline-offset: 3px;
}

body.home-page-pro .featured-hotel-card .hotel-card-body > p:not(.featured-hotel-location):not(.hotel-price-primary):not(.hotel-price-secondary),
body.home-page-pro .featured-hotel-card .hotel-spec-row {
  display: none;
}

body.home-page-pro .featured-hotel-card .hotel-card-footer {
  display: flex;
  margin-top: 8px;
}

body.home-page-pro .featured-hotel-card .hotel-cta {
  width: fit-content;
  min-height: 38px;
  padding: 8px 14px;
  background: var(--home-pro-green-dark);
}

body.home-page-pro .home-hotel-gallery-nav {
  width: 38px;
  height: 38px;
  opacity: 0.88;
  transition: opacity 160ms ease, background 160ms ease;
}

body.home-page-pro .hotel-card-media:hover .home-hotel-gallery-nav,
body.home-page-pro .home-hotel-gallery-nav:focus-visible {
  opacity: 1;
}

body.home-page-pro .home-hotel-gallery-nav.hotel-gallery-nav-prev {
  left: 12px;
}

body.home-page-pro .home-hotel-gallery-nav.hotel-gallery-nav-next {
  right: 12px;
}

body.home-page-pro .featured-hotel-card .hotel-price-stack {
  margin-top: 4px;
}

body.home-page-pro .featured-hotel-card .hotel-price-primary {
  color: var(--home-pro-black);
  font-size: 1rem;
}

body.home-page-pro .featured-hotel-card .hotel-price-secondary {
  color: var(--home-pro-muted);
  font-size: 0.7rem;
}

.hotel-price-due-at-property,
body.home-page-pro .featured-hotel-card .hotel-price-due-at-property {
  color: #8a4b08;
  font-weight: 800;
}

body.home-page-pro .hotel-card-media-top {
  padding: 12px;
}

body.home-page-pro .hotel-card-chip,
body.home-page-pro .featured-hotel-status {
  border: 0;
  background: rgba(255, 255, 255, 0.92);
  color: var(--home-pro-black);
  box-shadow: none;
}

body.home-page-pro .home-map-discovery {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.82fr);
  align-items: center;
  min-height: 590px;
  overflow: hidden;
  border-radius: 28px;
  background: var(--home-pro-black);
  color: #ffffff;
}

body.home-page-pro .home-map-globe-wrap {
  position: relative;
  min-width: 0;
  height: 590px;
  overflow: hidden;
  isolation: isolate;
}

body.home-page-pro .home-map-globe-wrap::after {
  content: "";
  position: absolute;
  inset: auto 8% 3%;
  z-index: -1;
  height: 26%;
  border-radius: 50%;
  background: rgba(84, 185, 72, 0.22);
  filter: blur(55px);
}

body.home-page-pro .home-realistic-globe {
  width: 100%;
  height: 100%;
  min-height: 0;
  background: transparent;
}

body.home-page-pro .home-realistic-globe canvas {
  display: block;
  width: 100% !important;
  height: 100% !important;
}

body.home-page-pro .home-realistic-globe-loading {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

body.home-page-pro .home-realistic-globe-loading span {
  width: 13px;
  height: 13px;
  background-color: rgba(255, 255, 255, 0.2);
}

body.home-page-pro .home-realistic-globe-loading span:nth-child(2) { animation-delay: 140ms; }
body.home-page-pro .home-realistic-globe-loading span:nth-child(3) { animation-delay: 280ms; }

body.home-page-pro .home-map-orbit {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: -1;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 50%;
  transform: translate(-50%, -50%);
}

body.home-page-pro .home-map-orbit-one {
  width: 74%;
  aspect-ratio: 1;
}

body.home-page-pro .home-map-orbit-two {
  width: 94%;
  aspect-ratio: 1;
}

body.home-page-pro .home-map-discovery-copy {
  display: grid;
  justify-items: start;
  align-content: center;
  min-height: 100%;
  padding: clamp(36px, 5vw, 68px);
  padding-left: 24px;
}

body.home-page-pro .home-map-discovery-copy h2 {
  color: #ffffff;
}

body.home-page-pro .home-map-discovery-copy > p:not(.eyebrow) {
  max-width: 520px;
  margin: 24px 0 0;
  color: rgba(255, 255, 255, 0.68);
  line-height: 1.7;
}

body.home-page-pro .home-map-discovery-copy ul {
  display: grid;
  gap: 10px;
  margin: 24px 0 30px;
  padding: 0;
  color: rgba(255, 255, 255, 0.84);
  font-size: 0.88rem;
  list-style: none;
}

body.home-page-pro .home-map-discovery-copy li {
  position: relative;
  padding-left: 20px;
}

body.home-page-pro .home-map-discovery-copy li::before {
  content: "";
  position: absolute;
  top: 0.56em;
  left: 0;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--home-pro-green);
}

body.home-page-pro .home-pro-final-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  min-height: 220px;
  padding: clamp(34px, 5vw, 60px);
  border-radius: 24px;
  background: var(--home-pro-green);
}

body.home-page-pro .home-pro-final-banner .eyebrow {
  color: #173d18;
}

body.home-page-pro .home-pro-final-banner h2 {
  font-size: clamp(2.1rem, 4vw, 3.8rem);
}

body.home-page-pro .home-pro-final-banner .button-secondary {
  flex: 0 0 auto;
  border-color: var(--home-pro-black);
  background: var(--home-pro-black);
  color: #ffffff;
}

body.home-page-pro .home-footer {
  margin-top: 0;
}

@media (max-width: 1020px) {
  body.home-page-pro .home-pro-hero {
    grid-template-columns: minmax(0, 1fr) minmax(290px, 0.7fr);
    padding-inline: 44px;
    padding-bottom: 190px;
  }

  body.home-page-pro .home-pro-search-card {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  body.home-page-pro .home-pro-search-heading {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  body.home-page-pro .home-trust-row {
    margin-top: -74px;
  }
}

@media (max-width: 820px) {
  body.home-page-pro .home-shell-pro {
    width: min(100% - 24px, 720px);
  }

  body.home-page-pro .home-main-pro {
    gap: 72px;
    margin-top: 12px;
  }

  body.home-page-pro .home-pro-hero {
    grid-template-columns: 1fr;
    gap: 34px;
    min-height: 0;
    padding: 54px 30px 184px;
    border-radius: 24px;
  }

  body.home-page-pro .home-pro-route-spotlight {
    align-self: stretch;
    min-height: 280px;
  }

  body.home-page-pro .home-pro-search-card {
    right: 18px;
    left: 18px;
    padding: 18px;
    border-radius: 18px 18px 0 0;
  }

  body.home-page-pro .home-pro-search-heading h2 {
    font-size: 1.05rem;
  }

  body.home-page-pro .home-trust-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: -48px;
    font-size: 0.7rem;
  }

  body.home-page-pro .home-flight-deal-grid {
    display: flex;
    gap: 12px;
    margin-inline: -12px;
    padding-inline: 12px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }

  body.home-page-pro .home-flight-deal-grid::-webkit-scrollbar {
    display: none;
  }

  body.home-page-pro .home-flight-deal-card {
    flex: 0 0 min(330px, 86vw);
    scroll-snap-align: start;
  }

  body.home-page-pro .home-map-discovery {
    grid-template-columns: 1fr;
  }

  body.home-page-pro .home-map-globe-wrap {
    height: 440px;
  }

  body.home-page-pro .home-map-discovery-copy {
    padding: 0 34px 48px;
  }
}

@media (max-width: 600px) {
  body.home-page-pro .home-shell-pro {
    width: calc(100% - 20px);
    padding-bottom: 116px;
  }

  body.home-page-pro .home-main-pro {
    gap: 64px;
  }

  body.home-page-pro .home-pro-hero {
    padding: 42px 20px 170px;
    border-radius: 20px;
  }

  body.home-page-pro .home-pro-hero-copy h1 {
    font-size: clamp(3.25rem, 15vw, 4.7rem);
  }

  body.home-page-pro .home-pro-hero-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  body.home-page-pro .home-pro-hero-actions .button {
    min-width: 0;
    padding-inline: 14px;
    font-size: 0.8rem;
  }

  body.home-page-pro .home-pro-route-spotlight {
    gap: 26px;
    min-height: 250px;
    padding: 22px;
    border-radius: 18px;
  }

  body.home-page-pro .home-pro-route-codes strong {
    font-size: 2.65rem;
  }

  body.home-page-pro .home-pro-route-footer {
    align-items: flex-end;
  }

  body.home-page-pro .home-pro-route-footer span {
    max-width: 126px;
  }

  body.home-page-pro .home-pro-search-card {
    right: 10px;
    left: 10px;
    min-height: 138px;
    padding: 15px;
  }

  body.home-page-pro .home-pro-search-heading {
    gap: 10px;
  }

  body.home-page-pro .home-pro-search-heading .eyebrow {
    display: none;
  }

  body.home-page-pro .home-pro-search-modes a {
    padding: 6px 9px;
    font-size: 0.64rem;
  }

  body.home-page-pro .home-pro-search-card .search-overlay-trigger {
    min-height: 62px;
    padding: 8px 8px 8px 14px;
  }

  body.home-page-pro .home-pro-search-card .search-overlay-trigger-action {
    min-height: 44px;
    padding-inline: 13px;
    font-size: 0.72rem;
  }

  body.home-page-pro .home-trust-row {
    display: flex;
    justify-content: flex-start;
    gap: 18px;
    margin: -42px -2px 0;
    padding: 0 2px 8px;
    overflow-x: auto;
    white-space: nowrap;
    scrollbar-width: none;
  }

  body.home-page-pro .home-pro-section-head {
    align-items: flex-start;
  }

  body.home-page-pro .home-pro-section-head .section-copy {
    display: none;
  }

  body.home-page-pro .home-pro-section-head h2 {
    font-size: 2.35rem;
  }

  body.home-page-pro .home-pro-text-link {
    margin-top: 8px;
    font-size: 0.74rem;
  }

  body.home-page-pro .home-flight-deal-card {
    flex-basis: 84vw;
    min-height: 222px;
    padding: 21px;
  }

  body.home-page-pro .home-destination-grid {
    grid-template-columns: 1fr;
    grid-auto-rows: 255px;
  }

  body.home-page-pro .home-destination-banner {
    min-height: 255px;
    border-radius: 16px;
  }

  body.home-page-pro .home-destination-copy {
    right: 20px;
    bottom: 20px;
    left: 20px;
  }

  body.home-page-pro .home-showcase-track {
    margin-right: -10px;
  }

  body.home-page-pro .home-showcase-track > .featured-hotel-card,
  body.home-page-pro .featured-hotel-card.hotel-browse-card {
    flex-basis: 76vw;
    min-width: 76vw;
  }

  body.home-page-pro .home-map-discovery {
    border-radius: 20px;
  }

  body.home-page-pro .home-map-globe-wrap {
    height: 360px;
  }

  body.home-page-pro .home-map-discovery-copy {
    padding: 0 24px 36px;
  }

  body.home-page-pro .home-map-discovery-copy h2 {
    font-size: 2.4rem;
  }

  body.home-page-pro .home-pro-final-banner {
    align-items: flex-start;
    flex-direction: column;
    min-height: 0;
    padding: 30px 24px;
    border-radius: 18px;
  }

  body.home-page-pro .home-pro-final-banner .button {
    width: 100%;
  }

  .mobile-bottom-dock .mobile-dock-action-map {
    position: relative;
    overflow: hidden;
    background:
      linear-gradient(135deg, rgba(255, 255, 255, 0.16), transparent 48%),
      linear-gradient(145deg, #65c956, #359c35);
    color: #ffffff;
    box-shadow: 0 7px 16px rgba(47, 139, 49, 0.24);
    isolation: isolate;
  }

  .mobile-bottom-dock .mobile-dock-action-map::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
      linear-gradient(90deg, transparent 47%, rgba(255, 255, 255, 0.14) 48% 52%, transparent 53%),
      linear-gradient(0deg, transparent 47%, rgba(255, 255, 255, 0.12) 48% 52%, transparent 53%);
    background-size: 22px 22px;
    opacity: 0.72;
    transform: rotate(-8deg) scale(1.2);
  }

  .mobile-bottom-dock .mobile-dock-action-map svg {
    padding: 2px;
    border-radius: 6px;
    filter: drop-shadow(0 2px 3px rgba(17, 64, 20, 0.28));
  }
}

/* Cleaner full-screen hotel map */
body.hotel-map-page {
  background: #e9eee8;
  color: #101310;
}

body.hotel-map-page .site-header {
  top: 14px;
  left: 14px;
  right: 14px;
  padding: 9px 14px;
  border: 0;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 12px 38px rgba(16, 19, 16, 0.12);
}

body.hotel-map-page .hotels-search-stage {
  top: 94px;
  width: min(980px, calc(100vw - 40px));
}

body.hotel-map-page .hotels-search-form {
  padding: 9px;
  border: 0;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 14px 42px rgba(16, 19, 16, 0.13);
}

body.hotel-map-page .hotel-customer-search {
  gap: 6px;
}

body.hotel-map-page .hotel-form-label {
  padding-left: 2px;
  color: #697169;
  font-size: 0.62rem;
  font-weight: 850;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

body.hotel-map-page .hotel-form-control,
body.hotel-map-page .hotel-form-submit {
  height: 44px;
  border: 0;
  border-radius: 10px;
  background: #f1f5f0;
}

body.hotel-map-page .hotel-form-control:focus {
  box-shadow: inset 0 0 0 2px #54b948;
}

body.hotel-map-page .hotel-form-submit {
  background: #54b948;
  color: #0d1a0d;
  font-weight: 900;
}

body.hotel-map-page .hotel-form-submit svg {
  width: 18px;
  height: 18px;
}

body.hotel-map-page .hotel-map-stage {
  background: #e8ede7;
}

body.hotel-map-page .hotel-map-stage .leaflet-tile-pane {
  filter: saturate(0.94) contrast(0.98) brightness(1.015);
}

body.hotel-map-page .hotel-map-stage .leaflet-control-zoom {
  overflow: hidden;
  border: 0;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(16, 19, 16, 0.14);
}

body.hotel-map-page .hotel-map-stage .leaflet-control-zoom a {
  width: 38px;
  height: 38px;
  border-color: #edf0ec;
  color: #101310;
  font: 700 20px/38px var(--font-sans);
}

body.hotel-map-page .hotel-map-stage .leaflet-control-attribution {
  border-radius: 8px 0 0;
  background: rgba(255, 255, 255, 0.84);
  color: #727972;
  font-size: 0.58rem;
}

body.hotel-map-page .hotel-map-pin {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 64px;
  min-height: 36px;
  padding: 7px 12px 7px 8px;
  border: 2px solid #ffffff;
  border-radius: 999px;
  background: linear-gradient(145deg, #62c854, #3ea43a);
  color: #ffffff;
  box-shadow: 0 5px 16px rgba(35, 105, 39, 0.3);
  font-size: 0.76rem;
  font-weight: 900;
}

body.hotel-map-page .hotel-map-pin-place {
  position: relative;
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
  border: 2px solid currentColor;
  border-radius: 50% 50% 50% 0;
  transform: rotate(-45deg);
}

body.hotel-map-page .hotel-map-pin-place::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: currentColor;
  transform: translate(-50%, -50%);
}

body.hotel-map-page .hotel-map-pin-price {
  line-height: 1;
}

body.hotel-map-page .hotel-map-pin::after {
  bottom: -5px;
  border-right-color: #ffffff;
  border-bottom-color: #ffffff;
}

body.hotel-map-page .hotel-map-pin:hover,
body.hotel-map-page .hotel-map-pin:focus-visible,
body.hotel-map-page .hotel-map-pin.active {
  background: #101310;
  color: #ffffff;
  box-shadow:
    0 7px 20px rgba(16, 19, 16, 0.28),
    0 0 0 4px rgba(84, 185, 72, 0.34);
  transform: translate(-50%, calc(-50% - 2px)) scale(1.06);
}

body.hotel-map-page .hotel-map-pin:hover::after,
body.hotel-map-page .hotel-map-pin:focus-visible::after,
body.hotel-map-page .hotel-map-pin.active::after {
  border-top-color: #101310;
}

body.hotel-map-page .hotel-map-card {
  top: 158px;
  right: 22px;
  bottom: 22px;
  width: min(350px, calc(100vw - 36px));
  padding: 12px 16px 18px;
  border: 0;
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 22px 60px rgba(16, 19, 16, 0.18);
}

body.hotel-map-page .hotel-map-card-media {
  min-height: 190px;
  max-height: 220px;
  margin: 0 -4px 8px;
  border-radius: 14px;
  background: linear-gradient(145deg, #54b948, #235f26);
}

body.hotel-map-page .hotel-map-card-image {
  min-height: 190px;
}

body.hotel-map-page .hotel-map-card-close {
  top: 18px;
  right: 20px;
  width: 38px;
  height: 38px;
  border: 0;
  background: rgba(255, 255, 255, 0.94);
  color: #101310;
  box-shadow: 0 5px 16px rgba(16, 19, 16, 0.15);
}

body.hotel-map-page .hotel-map-card-close:hover,
body.hotel-map-page .hotel-map-card-close:focus-visible {
  background: #101310;
}

body.hotel-map-page .hotel-map-card > .eyebrow {
  margin: 2px 0 0;
  color: #2d7f29;
  font-size: 0.62rem;
}

body.hotel-map-page .hotel-map-card h3 {
  margin: 0;
  font-size: 1.18rem;
  letter-spacing: -0.025em;
}

body.hotel-map-page .hotel-map-card p {
  margin: 0;
  color: #6a726a;
}

body.hotel-map-page .hotel-map-card-amenities span {
  border: 0;
  background: #eff6ed;
  color: #2d7f29;
}

body.hotel-map-page .hotel-map-card strong {
  color: #101310;
  font-size: 1.5rem;
}

body.hotel-map-page .hotel-map-card-link {
  border-radius: 11px;
  background: #54b948;
  color: #0d1a0d;
}

body.hotel-map-page .hotel-map-sheet-backdrop {
  display: none;
}

body.hotel-map-page .results-state {
  border: 0;
  border-radius: 12px;
  color: #101310;
}

@media (max-width: 920px) {
  body.hotel-map-page .hotels-search-stage {
    top: 84px;
  }
}

@media (max-width: 640px) {
  body.hotel-map-page .site-header {
    top: 0;
    right: 0;
    left: 0;
    border-radius: 0 0 14px 14px;
    box-shadow: 0 8px 26px rgba(16, 19, 16, 0.1);
  }

  body.hotel-map-page .map-search-toggle {
    border: 0;
    border-radius: 10px;
    background: #54b948;
    color: #0d1a0d;
    box-shadow: none;
  }

  body.hotel-map-page .map-search-toggle[aria-expanded="true"] {
    background: #101310;
    color: #ffffff;
  }

  body.hotel-map-page .hotels-search-stage {
    top: 64px;
    max-height: calc(100dvh - 76px);
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  body.hotel-map-page .hotels-search-form {
    padding: 10px;
    border-radius: 14px;
  }

  body.hotel-map-page .hotel-form-control,
  body.hotel-map-page .hotels-search-form input,
  body.hotel-map-page .hotels-search-form select {
    font-size: 16px;
  }

  body.hotel-map-page.hotel-map-preview-open .hotel-map-sheet-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1204;
    display: block;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: rgba(10, 14, 10, 0.34);
    backdrop-filter: blur(1.5px);
    cursor: default;
  }

  body.hotel-map-page .hotel-map-card {
    top: auto;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1205;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-auto-flow: row;
    align-content: start;
    gap: 9px;
    width: 100%;
    height: 75vh;
    height: 75dvh;
    max-width: none;
    max-height: 75vh;
    max-height: 75dvh;
    padding: 24px 16px calc(16px + env(safe-area-inset-bottom));
    overflow-x: hidden;
    overflow-y: auto;
    border-radius: 24px 24px 0 0;
    box-shadow: 0 -24px 60px rgba(10, 14, 10, 0.24);
    overscroll-behavior: contain;
    animation: hotel-map-sheet-up 240ms cubic-bezier(0.22, 0.8, 0.3, 1);
    transform-origin: center bottom;
  }

  body.hotel-map-page .hotel-map-card::before {
    content: "";
    position: absolute;
    top: 8px;
    left: 50%;
    width: 44px;
    height: 5px;
    border-radius: 999px;
    background: #d9ded8;
    transform: translateX(-50%);
  }

  body.hotel-map-page .hotel-map-card-media {
    grid-column: 1;
    grid-row: auto;
    width: 100%;
    height: clamp(190px, 31dvh, 270px);
    min-height: 190px;
    max-height: 270px;
    margin: 0 0 5px;
    border-radius: 16px;
  }

  body.hotel-map-page .hotel-map-card-image {
    width: 100%;
    height: 100%;
    min-height: 190px;
    object-fit: cover;
  }

  body.hotel-map-page .hotel-map-card > .eyebrow {
    display: block;
    grid-column: 1;
    margin: 1px 0 0;
  }

  body.hotel-map-page .hotel-map-card h3,
  body.hotel-map-page .hotel-map-card p,
  body.hotel-map-page .hotel-map-card-rating,
  body.hotel-map-page .hotel-map-card-amenities,
  body.hotel-map-page .hotel-map-card strong,
  body.hotel-map-page .hotel-map-card-link {
    grid-column: 1;
  }

  body.hotel-map-page .hotel-map-card h3 {
    padding-right: 44px;
    font-size: 1.3rem;
    line-height: 1.18;
  }

  body.hotel-map-page .hotel-map-card p,
  body.hotel-map-page .hotel-map-card-rating {
    font-size: 0.82rem;
    line-height: 1.4;
  }

  body.hotel-map-page .hotel-map-card-amenities {
    max-height: none;
    overflow: visible;
  }

  body.hotel-map-page .hotel-map-card strong {
    margin-top: 2px;
    font-size: 1.4rem;
  }

  body.hotel-map-page .hotel-map-card-close {
    top: 34px;
    right: 26px;
    width: 42px;
    height: 42px;
  }

  body.hotel-map-page .hotel-map-card-link {
    min-height: 48px;
    margin-top: 2px;
    border-radius: 10px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.home-page-pro .home-skeleton-line,
  body.home-page-pro .home-skeleton-dot,
  body.home-page-pro .home-destination-skeleton,
  body.home-page-pro .home-realistic-globe-loading span {
    animation: none;
  }
}

/* Full-screen map uses the shared header and a viewport-aware mobile hotel sheet. */
body.hotel-map-page .page-shell {
  display: flex;
  flex-direction: column;
  width: 100vw;
  height: 100vh;
  height: 100dvh;
  min-height: 0;
}

body.hotel-map-page .site-header {
  position: relative;
  inset: auto;
  flex: 0 0 auto;
  width: 100vw;
  min-height: 78px;
  margin: 0;
  padding: 11px max(20px, calc((var(--viewport-width, 100vw) - 1280px) / 2 + 18px));
  border: 0;
  border-bottom: 1px solid rgba(24, 50, 34, 0.09);
  border-radius: 0;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 8px 26px rgba(24, 50, 34, 0.07);
  backdrop-filter: blur(18px);
}

body.hotel-map-page .hotels-main-refined {
  position: relative;
  inset: auto;
  flex: 1 1 auto;
  width: 100%;
  min-height: 0;
  overflow: hidden;
}

body.hotel-map-page .hotels-search-stage {
  position: absolute;
  top: 16px;
  left: 50%;
  z-index: 1150;
  width: min(980px, calc(100vw - 40px));
  margin: 0;
  transform: translateX(-50%);
}

body.hotel-map-page .hotel-map-page-section,
body.hotel-map-page .hotel-map-section,
body.hotels-page.hotel-map-page .hotels-browse-section > .hotel-map-section,
body.hotel-map-page .hotel-map-shell,
body.hotel-map-page .hotel-map-stage {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: 0;
}

body.hotel-map-page .hotel-map-page-section,
body.hotel-map-page .hotel-map-section,
body.hotels-page.hotel-map-page .hotels-browse-section > .hotel-map-section {
  margin: 0;
  padding: 0;
}

body.hotel-map-page .hotel-map-results-sheet {
  display: none;
}

body.hotel-map-page .hotel-map-pin {
  gap: 0;
  min-width: 48px;
  min-height: 30px;
  padding: 6px 9px;
  border: 1px solid rgba(16, 19, 16, 0.22);
  border-radius: 9px;
  background: #ffffff;
  color: #101310;
  box-shadow: 0 4px 12px rgba(16, 19, 16, 0.18);
  font-size: 0.7rem;
  font-weight: 900;
  letter-spacing: -0.01em;
  transform: translate(-50%, -100%);
}

body.hotel-map-page .hotel-map-pin::after {
  bottom: -4px;
  width: 7px;
  height: 7px;
  border-right-color: rgba(16, 19, 16, 0.22);
  border-bottom-color: rgba(16, 19, 16, 0.22);
  background: #ffffff;
}

body.hotel-map-page .hotel-map-marker-icon .hotel-map-pin,
body.hotel-map-page .hotel-map-marker-icon .hotel-map-pin:hover,
body.hotel-map-page .hotel-map-marker-icon .hotel-map-pin:focus-visible,
body.hotel-map-page .hotel-map-marker-icon .hotel-map-pin.active,
body.hotel-map-page .hotel-map-pin:hover,
body.hotel-map-page .hotel-map-pin:focus-visible,
body.hotel-map-page .hotel-map-pin.active {
  transform: translate(-50%, -100%);
}

body.hotel-map-page .hotel-map-pin:hover,
body.hotel-map-page .hotel-map-pin:focus-visible,
body.hotel-map-page .hotel-map-pin.active {
  border-color: #174c2e;
  background: #174c2e;
  color: #ffffff;
  box-shadow: 0 6px 18px rgba(16, 55, 31, 0.3), 0 0 0 3px rgba(84, 185, 72, 0.23);
}

body.hotel-map-page .hotel-map-pin:hover::after,
body.hotel-map-page .hotel-map-pin:focus-visible::after,
body.hotel-map-page .hotel-map-pin.active::after {
  border-color: #174c2e;
  background: #174c2e;
}

body.hotel-map-page .map-sheet-hotel-card {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 190px 290px;
  flex: 0 0 480px;
  width: 100%;
  min-width: 0;
  min-height: 480px;
  height: 480px;
  max-height: 480px;
  overflow: hidden;
  border: 1px solid #d6d6d0;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: none;
  cursor: pointer;
  scroll-snap-align: start;
  scroll-snap-stop: normal;
}

body.hotel-map-page .map-sheet-hotel-media {
  position: relative;
  display: block;
  width: 100%;
  height: 190px;
  min-height: 190px;
  overflow: hidden;
  background: #e9edf2;
}

body.hotel-map-page .map-sheet-hotel-media > img,
body.hotel-map-page .map-sheet-hotel-placeholder {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

body.hotel-map-page .map-sheet-hotel-placeholder {
  display: grid;
  place-items: center;
  color: #667085;
  font-size: 2.2rem;
  font-weight: 800;
}

body.hotel-map-page .map-sheet-hotel-chip {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 2;
  display: inline-flex;
  padding: 6px 9px;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.94);
  color: #344054;
  box-shadow: 0 2px 8px rgba(23, 34, 56, 0.12);
  font-size: 0.68rem;
  font-weight: 800;
}

body.hotel-map-page .map-sheet-hotel-content {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
  min-width: 0;
  min-height: 0;
  padding: 16px;
  overflow: hidden;
  background: #ffffff;
  color: #172238;
  visibility: visible;
  opacity: 1;
}

body.hotel-map-page .map-sheet-hotel-copy {
  display: block;
  min-width: 0;
}

body.hotel-map-page .map-sheet-hotel-location {
  margin: 0 0 5px;
  color: #667085;
  font-size: 0.75rem;
  font-weight: 600;
}

body.hotel-map-page .map-sheet-hotel-copy h3 {
  display: -webkit-box;
  min-height: 2.5em;
  overflow: hidden;
  margin: 0;
  color: #172238;
  font-size: 1.12rem;
  font-weight: 780;
  line-height: 1.25;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

body.hotel-map-page .map-sheet-hotel-rating {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
}

body.hotel-map-page .map-sheet-hotel-rating strong {
  padding: 4px 7px;
  border-radius: 4px;
  background: #123f27;
  color: #ffffff;
  font-size: 0.72rem;
}

body.hotel-map-page .map-sheet-hotel-rating span {
  overflow: hidden;
  color: #344054;
  font-size: 0.79rem;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.hotel-map-page .map-sheet-hotel-amenities,
body.hotel-map-page .map-sheet-hotel-policy {
  display: block;
  overflow: hidden;
  margin: 10px 0 0;
  color: #536070;
  font-size: 0.76rem;
  line-height: 1.45;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.hotel-map-page .map-sheet-hotel-policy {
  color: #174c2e;
  font-weight: 800;
}

body.hotel-map-page .map-sheet-hotel-price {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 12px;
  min-width: 0;
  padding-top: 14px;
  border-top: 1px solid #e4e4df;
}

body.hotel-map-page .map-sheet-hotel-price small {
  color: #667085;
  font-size: 0.7rem;
}

body.hotel-map-page .map-sheet-hotel-price-primary {
  margin: 3px 0 0;
  color: #172238;
  font-size: 1.38rem;
  font-weight: 800;
  line-height: 1.15;
}

body.hotel-map-page .map-sheet-hotel-price-primary span,
body.hotel-map-page .map-sheet-hotel-price-total {
  color: #667085;
  font-size: 0.7rem;
  font-weight: 500;
}

body.hotel-map-page .map-sheet-hotel-price-total {
  margin: 3px 0 0;
}

body.hotel-map-page .map-sheet-hotel-action {
  min-width: 116px;
  min-height: 40px;
  padding: 9px 14px;
  border-radius: 6px;
  background: #174c2e;
  color: #ffffff;
  font-size: 0.78rem;
  font-weight: 750;
}

@media (max-width: 390px) {
  body.hotel-map-page .map-sheet-hotel-card {
    grid-template-rows: 175px 305px;
  }

  body.hotel-map-page .map-sheet-hotel-media {
    height: 175px;
    min-height: 175px;
  }
}

body.hotel-map-page .results-state {
  position: absolute;
  bottom: 24px;
}

@media (max-width: 720px) {
  body.hotel-map-page .site-header {
    position: relative;
    inset: auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "brand actions"
      "ai ai"
      "nav nav";
    gap: 8px;
    width: 100vw;
    min-height: 0;
    margin: 0;
    padding: 10px 12px;
    border: 0;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 10px 28px rgba(17, 24, 39, 0.08);
  }

  body.hotel-map-page .site-header > .site-nav {
    display: grid;
    grid-area: nav;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
    gap: 8px;
    overflow: visible;
    padding-top: 8px;
    border-top: 1px solid rgba(24, 50, 34, 0.08);
    text-align: center;
  }

  body.hotel-map-page .site-header > .header-ai-search {
    grid-area: ai;
    width: calc(100vw - 16px);
    min-width: 0;
    max-width: none;
    justify-self: center;
  }

  body.hotel-map-page .site-header > .header-actions {
    display: flex;
    grid-area: actions;
    gap: 8px;
  }

  body.hotel-map-page .site-header .cart-button {
    display: inline-flex;
  }

  body.hotel-map-page .mobile-bottom-dock {
    display: flex !important;
  }

  body.hotel-map-page .hotels-search-stage {
    position: absolute;
    top: 10px;
    right: 10px;
    left: 10px;
    z-index: 1190;
    width: auto;
    max-height: calc(100% - 20px);
    overflow-x: hidden;
    overflow-y: auto;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-10px);
    transition: opacity 180ms ease, transform 240ms cubic-bezier(0.16, 1, 0.3, 1);
    overscroll-behavior: contain;
  }

  body.hotel-map-search-open .hotels-search-stage {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
  }

  body.hotel-map-page .hotel-map-search-control {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 1100;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    padding: 9px 13px;
    border: 1px solid rgba(16, 19, 16, 0.12);
    border-radius: 999px;
    background: #ffffff;
    color: #101310;
    box-shadow: 0 8px 24px rgba(16, 19, 16, 0.15);
    cursor: pointer;
    font: inherit;
    font-size: 0.76rem;
    font-weight: 850;
  }

  body.hotel-map-page .hotel-map-search-control svg {
    width: 18px;
    height: 18px;
  }

  body.hotel-map-page .hotel-map-search-control[aria-expanded="true"] {
    border-color: #174c2e;
    background: #174c2e;
    color: #ffffff;
  }

  body.hotel-map-page .hotel-map-stage .leaflet-top.leaflet-right {
    top: 12px;
    right: 10px;
  }

  body.hotel-map-page .hotel-map-stage .leaflet-control-zoom a {
    width: 36px;
    height: 36px;
    font-size: 18px;
    line-height: 36px;
  }

  body.hotel-map-page .hotel-map-results-sheet {
    --hotel-map-sheet-drag-y: 0px;
    position: absolute;
    right: 8px;
    bottom: calc(60px + env(safe-area-inset-bottom));
    left: 8px;
    z-index: 1120;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    width: auto;
    height: min(60dvh, 540px);
    max-height: calc(100% - 18px);
    overflow: hidden;
    border: 1px solid rgba(16, 19, 16, 0.12);
    border-radius: 22px 22px 16px 16px;
    background: #ffffff;
    box-shadow: 0 -10px 38px rgba(16, 19, 16, 0.2);
    transform: translate3d(0, calc(100% - 52px + var(--hotel-map-sheet-drag-y)), 0);
    transition: transform 360ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 240ms ease;
    will-change: transform;
  }

  body.hotel-map-page .hotel-map-results-sheet[data-state="expanded"] {
    position: fixed;
    inset: 0;
    z-index: 1320;
    width: 100vw;
    height: 100vh;
    height: 100dvh;
    max-height: none;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    transform: translate3d(0, var(--hotel-map-sheet-drag-y), 0);
  }

  body.hotel-map-page .hotel-map-results-sheet.is-dragging {
    transition: none;
  }

  .hotel-map-results-handle {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 28px;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 52px;
    padding: 17px 16px 6px;
    border: 0;
    border-bottom: 1px solid #e4e8e2;
    background: #ffffff;
    color: #101310;
    cursor: grab;
    font: inherit;
    text-align: left;
    touch-action: none;
    user-select: none;
  }

  .hotel-map-results-handle:active {
    cursor: grabbing;
  }

  .hotel-map-results-grabber {
    position: absolute;
    top: 9px;
    left: 50%;
    width: 42px;
    height: 5px;
    border-radius: 999px;
    background: #cfd5ce;
    transform: translateX(-50%);
  }

  .hotel-map-results-summary {
    display: grid;
    gap: 3px;
    min-width: 0;
  }

  .hotel-map-results-summary strong {
    overflow: hidden;
    color: #161a16;
    font-size: 0.92rem;
    font-weight: 850;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .hotel-map-results-summary small {
    overflow: hidden;
    color: #687068;
    font-size: 0.68rem;
    font-weight: 650;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.hotel-map-page .hotel-map-results-sheet[data-state="collapsed"] .hotel-map-results-summary small {
    display: none;
  }

  .hotel-map-results-handle > svg {
    width: 24px;
    height: 24px;
    transition: transform 260ms ease;
  }

  .hotel-map-results-handle > svg.is-expanded {
    transform: rotate(180deg);
  }

  body.hotel-map-page .hotel-map-results-list.hotels-lane-stack {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    align-content: normal;
    min-height: 0;
    padding: 4px 10px 18px;
    overflow-x: hidden;
    overflow-y: scroll;
    background: #ffffff;
    scrollbar-width: thin;
    scrollbar-gutter: stable;
    scroll-padding: 10px;
    scroll-snap-type: y proximity;
    touch-action: pan-y;
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
  }

  .hotel-map-result-card {
    margin-top: 8px;
    overflow: hidden;
    border: 1px solid #e0e4de;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 5px 16px rgba(24, 50, 34, 0.06);
    transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
  }

  .hotel-map-result-card.is-active {
    border-color: #267b31;
    box-shadow: 0 0 0 2px rgba(84, 185, 72, 0.18), 0 8px 22px rgba(24, 50, 34, 0.1);
  }

  .hotel-map-result-card > a {
    display: grid;
    grid-template-columns: 102px minmax(0, 1fr) 18px;
    gap: 12px;
    align-items: center;
    min-height: 112px;
    padding: 9px 10px 9px 9px;
    color: inherit;
    text-decoration: none;
  }

  .hotel-map-result-card > a:active {
    transform: scale(0.992);
  }

  .hotel-map-result-media {
    display: grid;
    place-items: center;
    width: 102px;
    height: 94px;
    overflow: hidden;
    border-radius: 12px;
    background: linear-gradient(145deg, #e6f1e2, #cadbc7);
    color: #174c2e;
    font-size: 1.5rem;
    font-weight: 900;
  }

  .hotel-map-result-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .hotel-map-result-copy {
    display: grid;
    gap: 3px;
    min-width: 0;
  }

  .hotel-map-result-copy > small,
  .hotel-map-result-rating {
    overflow: hidden;
    color: #6b736c;
    font-size: 0.66rem;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .hotel-map-result-copy > strong {
    display: -webkit-box;
    overflow: hidden;
    color: #171a17;
    font-size: 0.82rem;
    font-weight: 850;
    line-height: 1.25;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .hotel-map-result-price {
    margin-top: 3px;
    color: #565e57;
    font-size: 0.66rem;
  }

  .hotel-map-result-price b {
    color: #174c2e;
    font-size: 0.9rem;
  }

  .hotel-map-result-arrow {
    color: #174c2e;
    font-size: 1.7rem;
    font-weight: 500;
  }

  .hotel-map-results-empty {
    display: grid;
    place-items: center;
    gap: 6px;
    min-height: 190px;
    padding: 26px;
    color: #697169;
    text-align: center;
  }

  .hotel-map-results-empty > span {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: #e9f2e6;
    color: #174c2e;
    font-size: 1.25rem;
  }

  .hotel-map-results-empty strong {
    color: #222722;
    font-size: 0.86rem;
  }

  .hotel-map-results-empty p {
    max-width: 260px;
    margin: 0;
    font-size: 0.72rem;
    line-height: 1.5;
  }

  body.hotel-map-page .hotel-map-card,
  body.hotel-map-page.hotel-map-preview-open .hotel-map-sheet-backdrop {
    display: none !important;
  }

  body.hotel-map-page .hotel-map-results-sheet[data-state="expanded"] .hotel-map-results-handle {
    min-height: 82px;
    padding: max(25px, calc(15px + env(safe-area-inset-top))) 18px 12px;
    background: #ffffff;
  }

  body.hotel-map-page .hotel-map-results-sheet[data-state="expanded"] .hotel-map-results-grabber {
    top: max(9px, env(safe-area-inset-top));
  }

  body.hotel-map-page .hotel-map-results-sheet[data-state="expanded"] .hotel-map-results-summary strong {
    font-size: 1rem;
  }

  body.hotel-map-page .hotel-map-results-sheet[data-state="expanded"] .hotel-map-results-list {
    gap: 14px;
    padding: 14px 10px calc(28px + env(safe-area-inset-bottom));
    background: #ffffff;
  }

  body.hotel-map-page .hotel-map-results-list .button-primary {
    border-color: var(--travel-grass);
    background: var(--travel-grass);
    color: #ffffff;
  }

  body.hotel-map-results-open .mobile-bottom-dock {
    display: none !important;
  }

  body.hotel-map-page .results-state {
    right: 12px;
    bottom: calc(142px + env(safe-area-inset-bottom));
    left: 12px;
    z-index: 1110;
    width: auto;
    max-width: none;
    text-align: center;
  }

  body.hotel-map-results-open .results-state {
    display: none !important;
  }

  body.hotel-map-page .hotel-map-pin {
    min-width: 44px;
    min-height: 28px;
    padding: 5px 8px;
    border-radius: 8px;
    font-size: 0.67rem;
  }
}

@media (max-width: 390px) {
  .hotel-map-result-card > a {
    grid-template-columns: 82px minmax(0, 1fr) 14px;
    gap: 9px;
    min-height: 101px;
  }

  .hotel-map-result-media {
    width: 82px;
    height: 82px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.hotel-map-page .hotel-map-results-sheet,
  body.hotel-map-page .hotels-search-stage,
  .hotel-map-results-handle > svg,
  .hotel-map-result-card {
    transition: none;
  }
}

@media (max-width: 760px) {
  body.hotel-detail-page .site-footer {
    padding-bottom: 156px;
  }

  body.hotel-detail-page .toast {
    bottom: 118px;
  }

  .hotel-detail-mobile-bookbar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 55;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 14px 18px calc(14px + env(safe-area-inset-bottom));
    border-top: 1px solid rgba(17, 24, 39, 0.08);
    border-radius: 0;
    background: rgba(255, 255, 255, 0.985);
    box-shadow: 0 -8px 24px rgba(17, 24, 39, 0.08);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
  }

  .hotel-detail-mobile-dates {
    display: grid;
    gap: 2px;
    min-width: 0;
    padding: 0;
    border: 0;
    background: transparent;
    text-align: left;
    color: var(--ink);
    cursor: pointer;
  }

  .hotel-detail-mobile-dates-label,
  .hotel-detail-mobile-price-label {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--green-deep);
  }

  .hotel-detail-mobile-dates strong,
  .hotel-detail-mobile-price strong {
    display: block;
    font-size: 0.92rem;
    line-height: 1.25;
  }

  .hotel-detail-mobile-price {
    min-width: 0;
  }

  .hotel-detail-mobile-reserve {
    min-width: 126px;
    min-height: 52px;
    padding: 0 18px;
    border-radius: 999px;
    background: #2f7d32;
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    letter-spacing: 0.01em;
    cursor: pointer;
    transition:
      background 180ms ease,
      opacity 180ms ease,
      transform 180ms ease;
  }

  .hotel-detail-mobile-reserve:hover,
  .hotel-detail-mobile-reserve:focus-visible {
    background: #27682a;
  }

  .hotel-detail-mobile-reserve:focus-visible {
    outline: 2px solid rgba(47, 125, 50, 0.28);
    outline-offset: 2px;
  }

  .hotel-detail-mobile-reserve.is-disabled,
  .hotel-detail-mobile-reserve[aria-disabled="true"] {
    opacity: 0.5;
    cursor: default;
  }

  .hotel-detail-date-grid {
    grid-template-columns: 1fr;
  }

  .hotel-detail-date-range-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
  }

  .hotel-detail-date-summary-meta {
    grid-column: 1 / -1;
  }

  .hotel-detail-calendar-shell {
    max-height: min(52vh, 440px);
    overflow-y: auto;
    padding-right: 2px;
  }

  .hotel-detail-date-feedback[hidden] {
    display: none;
  }

  .hotel-detail-date-feedback:not([hidden]) {
    display: block;
  }
}

body.hotel-detail-page {
  --hotel-detail-border: rgba(17, 24, 39, 0.14);
  --hotel-detail-soft-border: rgba(17, 24, 39, 0.08);
  --hotel-detail-copy: #4b5563;
}

body.hotel-detail-page .hotel-detail-main {
  gap: 34px;
}

body.hotel-detail-page .hotel-room-picker-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

body.hotel-detail-page .hotel-room-picker-card {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--hotel-detail-border);
  border-radius: 18px;
  background: #ffffff;
}

body.hotel-detail-page .hotel-room-picker-media {
  position: relative;
  overflow: hidden;
  min-height: 124px;
  border-radius: 12px;
  background: #eef3ee;
}

body.hotel-detail-page .hotel-room-picker-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

body.hotel-detail-page .hotel-room-picker-placeholder {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  font-size: 1.5rem;
  font-weight: 800;
  color: #173b12;
  background: linear-gradient(135deg, #dcefd8, #f3f8f2);
}

body.hotel-detail-page .hotel-room-picker-copy {
  display: grid;
  gap: 4px;
}

body.hotel-detail-page .hotel-room-picker-copy h3,
body.hotel-detail-page .hotel-room-picker-copy p,
body.hotel-detail-page .hotel-room-picker-copy small {
  margin: 0;
}

body.hotel-detail-page .hotel-room-picker-copy h3 {
  font-size: 1rem;
  line-height: 1.25;
}

body.hotel-detail-page .hotel-room-discount-badge {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(47, 125, 50, 0.12);
  color: #27682a;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.01em;
}

body.hotel-detail-page .hotel-room-picker-copy strong {
  font-size: 1.05rem;
  line-height: 1.2;
}

body.hotel-detail-page .hotel-room-picker-copy p,
body.hotel-detail-page .hotel-room-picker-copy small {
  color: var(--hotel-detail-copy);
}

body.hotel-detail-page .hotel-room-discount-copy {
  color: #27682a;
}

body.hotel-detail-page .hotel-room-picker-button {
  min-height: 44px;
}

body.hotel-detail-page .hotel-detail-gallery-hero-shell {
  padding-bottom: 12px;
}

body.hotel-detail-page .browse-sidebar-card,
body.hotel-detail-page .hotel-detail-gallery-card,
body.hotel-detail-page .hotel-detail-rooms-section {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

body.hotel-detail-page .hotel-detail-gallery-card-hero {
  width: min(1280px, calc(100% - 40px));
  padding: 0;
}

body.hotel-detail-page .hotel-detail-gallery-hero {
  height: min(68vh, 760px);
  border-radius: 14px;
  object-fit: cover;
  object-position: center;
  background: #f3f4f6;
}

body.hotel-detail-page .hotel-detail-product {
  gap: 40px;
}

body.hotel-detail-page .hotel-detail-primary,
body.hotel-detail-page .hotel-detail-sidebar,
body.hotel-detail-page .hotel-detail-copy,
body.hotel-detail-page .hotel-detail-key-list,
body.hotel-detail-page .hotel-detail-room-list,
body.hotel-detail-page .hotel-detail-highlight-grid,
body.hotel-detail-page .hotel-detail-booking-grid,
body.hotel-detail-page .hotel-detail-rate-list {
  gap: 22px;
}

body.hotel-detail-page .hotel-detail-head-card,
body.hotel-detail-page .hotel-detail-info-card,
body.hotel-detail-page .hotel-detail-amenities-card,
body.hotel-detail-page .hotel-detail-location-card,
body.hotel-detail-page .hotel-detail-rooms-section {
  padding: 0 0 28px;
  border-bottom: 1px solid var(--hotel-detail-soft-border);
}

body.hotel-detail-page .hotel-detail-head-card {
  gap: 20px;
}

body.hotel-detail-page .hotel-detail-head-main {
  gap: 28px;
  align-items: end;
}

body.hotel-detail-page .hotel-detail-summary-text,
body.hotel-detail-page .hotel-detail-location-note,
body.hotel-detail-page .hotel-detail-room-summary,
body.hotel-detail-page .hotel-detail-rate-note,
body.hotel-detail-page .hotel-detail-map-fallback p,
body.hotel-detail-page .hotel-detail-key-list p {
  color: var(--hotel-detail-copy);
}

body.hotel-detail-page .hotel-detail-head-price-card {
  gap: 4px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  justify-items: end;
  text-align: right;
}

body.hotel-detail-page .hotel-detail-pill-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
}

body.hotel-detail-page .hotel-detail-pill-row .hotel-spec-pill,
body.hotel-detail-page .hotel-detail-rooms-steps .hotel-spec-pill {
  min-height: auto;
  padding: 0 0 0 14px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #111827;
  font-size: 0.86rem;
  font-weight: 600;
  line-height: 1.5;
  position: relative;
}

body.hotel-detail-page .hotel-detail-pill-row .hotel-spec-pill::before,
body.hotel-detail-page .hotel-detail-rooms-steps .hotel-spec-pill::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.58rem;
  width: 5px;
  height: 5px;
  border-radius: 999px;
  background: #111827;
}

body.hotel-detail-page .hotel-detail-pill-row .hotel-spec-pill:first-child,
body.hotel-detail-page .hotel-detail-rooms-steps .hotel-spec-pill:first-child {
  padding-left: 0;
}

body.hotel-detail-page .hotel-detail-pill-row .hotel-spec-pill:first-child::before,
body.hotel-detail-page .hotel-detail-rooms-steps .hotel-spec-pill:first-child::before {
  display: none;
}

body.hotel-detail-page .hotel-detail-info-grid {
  gap: 32px;
}

body.hotel-detail-page .hotel-detail-info-item,
body.hotel-detail-page .hotel-detail-key-item {
  gap: 6px;
  padding: 14px 0 0;
  border: 0;
  border-top: 1px solid var(--hotel-detail-soft-border);
  border-radius: 0;
  background: transparent;
}

body.hotel-detail-page .hotel-detail-info-item strong,
body.hotel-detail-page .hotel-detail-key-item strong {
  font-size: 1rem;
}

body.hotel-detail-page .hotel-detail-amenities {
  margin-top: 0;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 30px;
}

body.hotel-detail-page .amenity-pill {
  width: auto;
  min-height: auto;
  justify-content: flex-start;
  padding: 0 0 0 18px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #111827;
  font-weight: 500;
  text-align: left;
  position: relative;
}

body.hotel-detail-page .amenity-pill::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.6rem;
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: #111827;
}

body.hotel-detail-page .hotel-detail-location-grid {
  grid-template-columns: minmax(240px, 0.58fr) minmax(0, 1.42fr);
  gap: 24px;
}

body.hotel-detail-page .hotel-detail-location-copy {
  gap: 10px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

body.hotel-detail-page .hotel-detail-map-box {
  min-height: 260px;
  border-radius: 14px;
  border: 1px solid var(--hotel-detail-border);
  background:
    linear-gradient(rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.7)),
    linear-gradient(90deg, rgba(17, 24, 39, 0.06) 1px, transparent 1px),
    linear-gradient(rgba(17, 24, 39, 0.06) 1px, transparent 1px),
    linear-gradient(135deg, #ffffff, #f4f4f3);
  background-size: auto, 34px 34px, 34px 34px, auto;
  box-shadow: none;
}

body.hotel-detail-page .hotel-detail-map-fallback {
  place-content: end start;
  text-align: left;
  background:
    radial-gradient(circle at 20% 22%, rgba(84, 185, 72, 0.14), transparent 26%),
    radial-gradient(circle at 82% 26%, rgba(17, 24, 39, 0.08), transparent 22%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.82));
}

body.hotel-detail-page .hotel-detail-map-overlay {
  right: 18px;
  bottom: 18px;
  min-height: 38px;
  padding: 0 14px;
  border-radius: 999px;
  background: #111827;
  color: #ffffff;
  box-shadow: none;
}

body.hotel-detail-page .hotel-detail-summary-card {
  gap: 18px;
  padding: 20px;
  border: 1px solid var(--hotel-detail-border);
  border-radius: 14px;
  background: #ffffff;
}

body.hotel-detail-page .hotel-detail-total-block {
  gap: 6px;
  padding: 18px 0;
  border: 0;
  border-top: 1px solid var(--hotel-detail-soft-border);
  border-bottom: 1px solid var(--hotel-detail-soft-border);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.hotel-detail-page .hotel-detail-room-card {
  padding: 18px;
  border: 1px solid var(--hotel-detail-border);
  border-radius: 14px;
  background: #ffffff;
  box-shadow: none;
}

body.hotel-detail-page .market-room-layout {
  grid-template-columns: minmax(260px, 0.42fr) minmax(0, 1fr);
  gap: 24px;
}

body.hotel-detail-page .room-gallery .hotel-gallery-hero {
  height: 100%;
  min-height: 250px;
  border-radius: 10px;
}

body.hotel-detail-page .hotel-detail-room-body {
  gap: 20px;
}

body.hotel-detail-page .hotel-detail-room-price-badge {
  min-width: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  text-align: right;
}

body.hotel-detail-page .hotel-detail-rate-list {
  gap: 0;
  border-top: 1px solid var(--hotel-detail-soft-border);
}

body.hotel-detail-page .hotel-detail-rate-card {
  gap: 14px;
  padding: 18px 0;
  border: 0;
  border-top: 1px solid var(--hotel-detail-soft-border);
  border-radius: 0;
  background: transparent;
}

body.hotel-detail-page .hotel-detail-rate-list .hotel-detail-rate-card:first-child {
  border-top: 0;
}

body.hotel-detail-page .hotel-spec-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
}

body.hotel-detail-page .hotel-spec-row .hotel-spec-pill {
  min-height: auto;
  padding: 0 0 0 14px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #111827;
  position: relative;
}

body.hotel-detail-page .hotel-spec-row .hotel-spec-pill::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.58rem;
  width: 5px;
  height: 5px;
  border-radius: 999px;
  background: rgba(17, 24, 39, 0.46);
}

body.hotel-detail-page .hotel-spec-row .hotel-spec-pill:first-child {
  padding-left: 0;
}

body.hotel-detail-page .hotel-spec-row .hotel-spec-pill:first-child::before {
  display: none;
}

body.hotel-detail-page .hotel-spec-row .hotel-spec-pill-accent {
  padding: 4px 10px;
  border: 1px solid rgba(84, 185, 72, 0.42);
  border-radius: 999px;
  background: rgba(84, 185, 72, 0.12);
  color: #173b12;
}

body.hotel-detail-page .hotel-spec-row .hotel-spec-pill-accent::before {
  display: none;
}

body.hotel-detail-page .hotel-detail-rate-price {
  min-width: 170px;
}

body.hotel-detail-page .hotel-gallery-dots {
  gap: 10px;
  padding-top: 16px;
}

body.hotel-detail-page .hotel-gallery-dot {
  width: 32px;
  height: 2px;
  border-radius: 999px;
  background: rgba(17, 24, 39, 0.16);
  transform: none;
}

body.hotel-detail-page .hotel-gallery-dot.active {
  background: #111827;
  transform: none;
}

body.hotel-detail-page .button {
  border-radius: 999px;
  box-shadow: none;
}

body.hotel-detail-page .button.button-primary {
  background: #2f7d32;
  color: #ffffff;
  border: 1px solid #2f7d32;
}

body.hotel-detail-page .button.button-primary:hover {
  background: #27682a;
  border-color: #27682a;
}

body.hotel-detail-page .button.button-secondary {
  background: #ffffff;
  color: #111827;
  border: 1px solid var(--hotel-detail-border);
}

body.hotel-detail-page .button.button-secondary:hover {
  border-color: rgba(17, 24, 39, 0.26);
  background: #f9fafb;
}

body.hotel-detail-page .hotel-detail-hero-action[data-detail-share] {
  box-shadow: none;
}

body.hotel-room-page {
  --hotel-room-border: rgba(17, 24, 39, 0.12);
}

body.hotel-room-page .hotel-room-main {
  gap: 28px;
}

body.hotel-room-page .hotel-room-shell {
  width: min(1120px, calc(100% - 28px));
  margin: 0 auto 48px;
}

body.hotel-room-page .hotel-room-card,
body.hotel-room-page .hotel-room-summary,
body.hotel-room-page .hotel-room-panel {
  display: grid;
  gap: 18px;
}

body.hotel-room-page .hotel-room-top {
  display: grid;
  grid-template-columns: minmax(0, 1.06fr) minmax(300px, 0.94fr);
  gap: 28px;
  align-items: start;
}

body.hotel-room-page .hotel-room-gallery .hotel-gallery-hero {
  height: min(56vh, 520px);
  border-radius: 18px;
  object-fit: cover;
}

body.hotel-room-page .hotel-room-price-box,
body.hotel-room-page .hotel-room-panel {
  padding: 20px;
  border: 1px solid var(--hotel-room-border);
  border-radius: 20px;
  background: #ffffff;
}

body.hotel-room-page .hotel-room-price-box {
  display: grid;
  gap: 6px;
}

body.hotel-room-page .hotel-room-price-box strong {
  font-size: clamp(1.9rem, 4vw, 2.6rem);
  line-height: 1;
}

body.hotel-room-page .hotel-room-price-box p {
  margin: 0;
  color: var(--muted);
}

body.hotel-room-page .hotel-room-actions,
body.hotel-room-page .hotel-room-facts {
  display: grid;
  gap: 12px;
}

body.hotel-room-page .hotel-room-list {
  display: grid;
  gap: 10px;
}

body.hotel-room-page .hotel-room-list-item {
  padding-left: 16px;
  color: #111827;
  line-height: 1.5;
  position: relative;
}

body.hotel-room-page .hotel-room-list-item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.6rem;
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: #2f7d32;
}

body.hotel-room-page .hotel-room-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
}

@media (min-width: 821px) {
  body.hotel-detail-page .hotel-detail-gallery-hero {
    height: min(72vh, 760px);
    object-fit: cover;
    object-position: center;
  }
}

@media (max-width: 820px) {
  body.hotel-detail-page .hotel-detail-head-main,
  body.hotel-detail-page .market-room-layout {
    grid-template-columns: 1fr;
  }

  body.hotel-detail-page .hotel-detail-rate-main,
  body.hotel-detail-page .hotel-detail-rate-footer,
  body.hotel-detail-page .hotel-detail-room-header {
    flex-direction: column;
  }

  body.hotel-detail-page .hotel-detail-head-price-card,
  body.hotel-detail-page .hotel-detail-room-price-badge,
  body.hotel-detail-page .hotel-detail-rate-price {
    min-width: 0;
    justify-items: start;
    text-align: left;
  }

  body.hotel-detail-page .hotel-detail-summary-card {
    padding: 20px;
  }

  body.hotel-room-page .hotel-room-shell {
    width: min(100%, calc(100% - 24px));
  }

  body.hotel-room-page .hotel-room-top,
  body.hotel-room-page .hotel-room-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 540px) {
  body.hotel-detail-page .hotel-detail-gallery-card-hero {
    width: 100%;
  }

  body.hotel-detail-page .hotel-detail-gallery-hero {
    border-radius: 0;
  }

  body.hotel-detail-page .hotel-detail-product {
    margin-top: -18px;
    border-radius: 22px 22px 0 0;
  }

  body.hotel-detail-page .hotel-detail-head-card,
  body.hotel-detail-page .hotel-detail-info-card,
  body.hotel-detail-page .hotel-detail-amenities-card,
  body.hotel-detail-page .hotel-detail-location-card,
  body.hotel-detail-page .hotel-detail-rooms-section {
    padding-bottom: 22px;
  }

  body.hotel-detail-page .hotel-detail-summary-card,
  body.hotel-detail-page .hotel-detail-room-card {
    padding: 18px;
    border-radius: 12px;
  }

  body.hotel-detail-page .hotel-detail-info-grid,
  body.hotel-detail-page .hotel-detail-highlight-grid,
  body.hotel-detail-page .hotel-detail-booking-grid,
  body.hotel-detail-page .hotel-detail-location-grid,
  body.hotel-detail-page .hotel-detail-amenities {
    grid-template-columns: 1fr;
  }

  body.hotel-detail-page .hotel-room-picker-grid {
    gap: 10px;
  }

  body.hotel-detail-page .hotel-room-picker-card {
    gap: 10px;
    padding: 10px;
    border-radius: 14px;
  }

  body.hotel-detail-page .hotel-room-picker-media {
    min-height: 88px;
  }

  body.hotel-detail-page .hotel-room-picker-copy h3 {
    font-size: 0.9rem;
  }

  body.hotel-detail-page .hotel-room-picker-copy strong {
    font-size: 0.96rem;
  }

  body.hotel-detail-page .hotel-room-picker-copy p,
  body.hotel-detail-page .hotel-room-picker-copy small {
    font-size: 0.78rem;
    line-height: 1.3;
  }

  body.hotel-detail-page .hotel-room-picker-button {
    min-height: 40px;
    padding-inline: 12px;
    font-size: 0.84rem;
  }

  body.hotel-room-page .hotel-room-gallery .hotel-gallery-hero {
    height: 280px;
    border-radius: 14px;
  }

  body.hotel-room-page .hotel-room-price-box,
  body.hotel-room-page .hotel-room-panel {
    padding: 16px;
    border-radius: 16px;
  }
}

/* Durable single-product checkout */
.checkout-layout,
.confirmation-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(340px, 0.62fr);
  gap: 24px;
  align-items: start;
  margin-top: 30px;
}

.checkout-main-column,
.confirmation-primary-card,
.confirmation-section,
.confirmation-summary-column {
  display: grid;
  gap: 24px;
  min-width: 0;
}

.checkout-panel,
.confirmation-summary-column {
  position: sticky;
  top: 108px;
}

.checkout-product-panel,
.checkout-disclosure-panel,
.confirmation-primary-card {
  min-width: 0;
}

.checkout-detail-list {
  display: grid;
  gap: 16px;
}

.checkout-detail-card {
  box-shadow: none;
  border-color: rgba(24, 50, 34, 0.1);
  background: rgba(248, 251, 247, 0.96);
}

.checkout-detail-card h3,
.checkout-detail-card p,
.checkout-disclosure-grid h3,
.confirmation-section h2,
.confirmation-status-banner p,
.confirmation-help-card p {
  margin: 0;
}

.checkout-detail-card p + p {
  margin-top: 6px;
}

.checkout-price-lines {
  display: grid;
  gap: 0;
  border: 1px solid rgba(24, 50, 34, 0.1);
  border-radius: 20px;
  overflow: hidden;
}

.checkout-price-line {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 20px;
  padding: 14px 16px;
  background: rgba(255, 255, 255, 0.82);
}

.checkout-price-line + .checkout-price-line {
  border-top: 1px solid rgba(24, 50, 34, 0.08);
}

.checkout-price-line span {
  color: var(--muted);
}

.checkout-price-line strong {
  color: var(--green-deep);
  text-align: right;
}

.checkout-price-line-due-at-accommodation {
  background: #f2f8f0;
}

.checkout-price-line-due-at-accommodation span,
.checkout-price-line-due-at-accommodation strong {
  color: var(--green-deep);
  font-weight: 800;
}

.checkout-payment-timing {
  display: grid;
  gap: 10px;
  padding: 18px;
  border-radius: 22px;
  background: #f2f8f0;
  border: 1px solid rgba(38, 123, 49, 0.13);
}

.checkout-payment-timing-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 20px;
}

.checkout-payment-timing-row span {
  color: var(--muted);
}

.checkout-payment-timing-row strong {
  text-align: right;
}

.checkout-payment-timing-primary strong {
  color: var(--green-deep);
  font-size: 1.28rem;
}

.checkout-payment-timing-total {
  margin-top: 4px;
  padding-top: 12px;
  border-top: 1px solid rgba(24, 50, 34, 0.13);
}

.checkout-payment-timing-total strong {
  font-size: 1.18rem;
}

.checkout-disclosure-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.checkout-disclosure-grid section,
.checkout-card > section {
  display: grid;
  gap: 10px;
  padding: 16px;
  border: 1px solid rgba(24, 50, 34, 0.09);
  border-radius: 18px;
  background: rgba(248, 251, 247, 0.82);
}

.checkout-policy-list {
  display: grid;
  gap: 8px;
  margin: 0;
  padding-left: 20px;
  color: var(--muted);
  line-height: 1.5;
}

.checkout-purchase-scope-card {
  border: 2px solid rgba(38, 123, 49, 0.2);
}

.checkout-purchase-scope-card h2 {
  font-size: clamp(1.65rem, 3vw, 2.3rem);
}

.checkout-scope-callout {
  padding: 14px 16px;
  border-radius: 16px;
  background: #fff8de;
  border: 1px solid rgba(143, 103, 0, 0.18);
  color: #624b08;
  font-weight: 700;
  line-height: 1.45;
}

.checkout-form-intro,
.checkout-security-note,
.cart-transaction-note {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.checkout-contact-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.field-group textarea {
  width: 100%;
  resize: vertical;
  min-height: 96px;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid rgba(24, 50, 34, 0.13);
  background: rgba(255, 255, 255, 0.96);
  color: var(--ink);
  font: inherit;
}

.field-group textarea:focus {
  outline: 2px solid rgba(38, 123, 49, 0.22);
  border-color: var(--green);
}

.field-optional,
#checkout-card-amount-label {
  color: var(--muted);
  font-weight: 500;
}

.checkout-terms-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 16px;
  border-radius: 18px;
  background: #f7faf6;
  border: 1px solid rgba(24, 50, 34, 0.1);
  line-height: 1.48;
  cursor: pointer;
}

.checkout-terms-row input {
  width: 20px;
  height: 20px;
  margin-top: 2px;
  accent-color: var(--green);
}

.checkout-security-note {
  font-size: 0.9rem;
  text-align: center;
}

.confirmation-hero {
  max-width: 860px;
}

.confirmation-primary-card {
  padding: 26px;
}

.confirmation-status-banner {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  padding: 18px;
  border-radius: 20px;
  border: 1px solid rgba(24, 50, 34, 0.1);
  background: #f7faf6;
}

.confirmation-status-banner > div {
  display: grid;
  gap: 5px;
}

.confirmation-status-dot {
  width: 14px;
  height: 14px;
  margin-top: 5px;
  border-radius: 999px;
  background: #bd8d00;
  box-shadow: 0 0 0 6px rgba(189, 141, 0, 0.12);
}

.confirmation-status-banner.is-confirmed {
  background: #edf8eb;
  border-color: rgba(38, 123, 49, 0.22);
}

.confirmation-status-banner.is-confirmed .confirmation-status-dot {
  background: var(--green);
  box-shadow: 0 0 0 6px rgba(38, 123, 49, 0.13);
}

.confirmation-status-banner.is-failed,
.confirmation-status-banner.is-refunded {
  background: #fff4f0;
  border-color: rgba(150, 50, 30, 0.18);
}

.confirmation-status-banner.is-failed .confirmation-status-dot,
.confirmation-status-banner.is-refunded .confirmation-status-dot {
  background: #a23f2a;
  box-shadow: 0 0 0 6px rgba(162, 63, 42, 0.12);
}

.confirmation-reference-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.confirmation-reference-grid > div {
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: 15px;
  border-radius: 18px;
  background: #f7faf6;
  border: 1px solid rgba(24, 50, 34, 0.08);
}

.confirmation-reference-grid span {
  color: var(--muted);
  font-size: 0.86rem;
}

.confirmation-reference-grid strong {
  overflow-wrap: anywhere;
}

.confirmation-reference-grid small {
  color: var(--muted);
  font-size: 0.76rem;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.confirmation-section {
  padding-top: 4px;
}

.confirmation-section h2 {
  font-size: clamp(1.8rem, 3vw, 2.6rem);
}

@media (max-width: 1040px) {
  .checkout-layout,
  .confirmation-layout {
    grid-template-columns: 1fr;
  }

  .checkout-panel,
  .confirmation-summary-column {
    position: static;
  }
}

@media (max-width: 680px) {
  .checkout-disclosure-grid,
  .checkout-contact-grid,
  .confirmation-reference-grid {
    grid-template-columns: 1fr;
  }

  .checkout-payment-timing-row,
  .checkout-price-line {
    align-items: flex-start;
  }

  .checkout-payment-timing-row strong,
  .checkout-price-line strong {
    max-width: 48%;
  }

  .confirmation-primary-card {
    padding: 18px;
  }
}

/* Unified customer booking journey */

:where(a, button, input, textarea, select):focus-visible {
  outline: 3px solid rgba(84, 185, 72, 0.34);
  outline-offset: 3px;
}

.site-header {
  position: sticky;
  top: 0;
  min-height: 78px;
  padding-top: 11px;
  padding-bottom: 11px;
  border-bottom: 1px solid rgba(24, 50, 34, 0.09);
  box-shadow: 0 8px 26px rgba(24, 50, 34, 0.07);
  backdrop-filter: blur(18px);
}

.site-header .wordmark-logo {
  height: 56px;
  max-width: min(258px, 36vw);
}

.site-header .site-nav {
  gap: 6px;
  padding: 4px;
  border-radius: 14px;
  background: #f4f7f2;
}

.site-header .nav-link-text {
  min-height: 42px;
  padding: 10px 14px;
  border-radius: 11px;
  color: #5f6e62;
  font-size: 0.9rem;
  font-weight: 700;
}

.site-header .nav-link-text:hover {
  color: var(--ink);
  background: rgba(255, 255, 255, 0.72);
  transform: none;
}

.site-header .nav-link-active {
  color: var(--ink);
  background: #ffffff;
  box-shadow: 0 2px 9px rgba(24, 50, 34, 0.08);
}

.site-header .nav-link-active::after {
  display: none;
}

.site-header .header-actions {
  gap: 8px;
}

.site-header .header-action-button {
  min-height: 46px;
  padding: 10px 14px;
  border-radius: 13px;
  border-color: rgba(24, 50, 34, 0.11);
  font-size: 0.88rem;
  font-weight: 700;
}

.site-header .header-action-button:hover {
  border-color: rgba(38, 123, 49, 0.25);
  background: #f7faf5;
  box-shadow: 0 5px 14px rgba(24, 50, 34, 0.07);
  transform: none;
}

.site-header .profile-action-button {
  width: 46px;
  min-width: 46px;
  height: 46px;
}

.site-header .cart-button {
  position: relative;
  min-width: 96px;
  gap: 7px;
}

.site-header .cart-button.is-active {
  color: #ffffff;
  background: var(--ink);
  border-color: var(--ink);
}

.header-cart-icon {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
}

.site-header .cart-count {
  min-width: 20px;
  height: 20px;
  padding: 0 5px;
  color: #ffffff;
  background: var(--green-deep);
  font-size: 0.7rem;
  font-weight: 800;
}

.site-header .cart-button.is-active .cart-count {
  color: var(--ink);
  background: #a8e985;
}

.booking-progress {
  display: grid;
  grid-template-columns: 142px minmax(0, 1fr);
  align-items: center;
  gap: 24px;
  width: 100%;
  padding: 17px 20px;
  border: 1px solid rgba(24, 50, 34, 0.1);
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 8px 24px rgba(24, 50, 34, 0.05);
}

.booking-progress-heading {
  display: grid;
  gap: 2px;
  padding-right: 20px;
  border-right: 1px solid rgba(24, 50, 34, 0.1);
}

.booking-progress-heading span {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.booking-progress-heading strong {
  font-size: 0.88rem;
}

.booking-progress ol {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.booking-progress li {
  position: relative;
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
  color: #8a948b;
  font-size: 0.78rem;
  font-weight: 700;
}

.booking-progress-step {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
  color: inherit;
  text-decoration: none;
}

.booking-progress-link {
  border-radius: 6px;
  cursor: pointer;
}

.booking-progress-link:hover,
.booking-progress-link:focus-visible {
  color: var(--green-deep);
}

.booking-progress-link:focus-visible {
  outline: 2px solid var(--green-deep);
  outline-offset: 4px;
}

.booking-progress li:not(:last-child)::after {
  content: "";
  position: absolute;
  z-index: 0;
  top: 50%;
  left: 31px;
  right: 9px;
  height: 2px;
  background: #e3e9e1;
  transform: translateY(-50%);
}

.booking-progress li.is-complete:not(:last-child)::after {
  background: #83ca67;
}

.booking-progress-marker {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 27px;
  height: 27px;
  flex: 0 0 27px;
  border: 2px solid #dce4da;
  border-radius: 999px;
  color: #738075;
  background: #ffffff;
  font-size: 0.7rem;
}

.booking-progress-label {
  position: relative;
  z-index: 1;
  overflow: hidden;
  padding-right: 10px;
  background: #ffffff;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.booking-progress .is-complete,
.booking-progress .is-current {
  color: var(--ink);
}

.booking-progress .is-complete .booking-progress-marker {
  color: #ffffff;
  border-color: var(--green-deep);
  background: var(--green-deep);
}

.booking-progress .is-current .booking-progress-marker {
  color: var(--ink);
  border-color: var(--green);
  background: #e6f8df;
  box-shadow: 0 0 0 4px rgba(84, 185, 72, 0.12);
}

body:is(.hotel-detail-page, .hotel-room-page, .cart-page, .checkout-page, .checkout-confirmation-page) {
  color: #17291c;
  background: #f5f7f3;
}

body:is(.hotel-detail-page, .hotel-room-page, .cart-page, .checkout-page, .checkout-confirmation-page) h1,
body:is(.hotel-detail-page, .hotel-room-page, .cart-page, .checkout-page, .checkout-confirmation-page) h2 {
  font-family: var(--font-sans);
  letter-spacing: -0.045em;
}

body:is(.hotel-detail-page, .hotel-room-page, .cart-page, .checkout-page, .checkout-confirmation-page) .eyebrow {
  margin: 0;
  color: var(--green-deep);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.12em;
}

body.hotel-detail-page .page-shell,
body.hotel-room-page .page-shell,
body.cart-page .page-shell,
body.checkout-page .page-shell,
body.checkout-confirmation-page .page-shell {
  width: min(1240px, calc(100% - 32px));
}

body.hotel-detail-page .hotel-detail-main,
body.hotel-room-page .hotel-room-main,
body.cart-page .cart-main,
body.checkout-page .results-main,
body.checkout-confirmation-page .confirmation-main {
  margin-top: 24px;
}

body.hotel-detail-page .hotel-detail-head-card,
body.hotel-detail-page .hotel-detail-info-card,
body.hotel-detail-page .hotel-detail-amenities-card,
body.hotel-detail-page .hotel-detail-location-card,
body.hotel-detail-page .hotel-detail-summary-card,
body.hotel-detail-page .hotel-detail-rooms-section {
  border: 1px solid rgba(24, 50, 34, 0.1);
  border-radius: 20px;
  background: #ffffff;
  box-shadow: 0 10px 28px rgba(24, 50, 34, 0.05);
}

body.hotel-detail-page .hotel-detail-copy h1 {
  max-width: 18ch;
  font-size: clamp(2.25rem, 4vw, 4rem);
  line-height: 1.04;
}

body.hotel-detail-page .hotel-detail-summary-card {
  top: 102px;
  padding: 24px;
}

body.hotel-detail-page .hotel-detail-total-block {
  border-radius: 16px;
  background: #f1f7ef;
}

body.hotel-detail-page .hotel-detail-rooms-section {
  padding: 28px;
}

body.hotel-detail-page .hotel-detail-rooms-steps .hotel-spec-pill {
  border-color: rgba(38, 123, 49, 0.12);
  background: #f1f7ef;
  color: #305238;
}

body.hotel-detail-page .hotel-detail-room-card {
  border-color: rgba(24, 50, 34, 0.1);
  border-radius: 18px;
  box-shadow: none;
}

body.hotel-room-page .hotel-room-shell {
  width: 100%;
  margin-bottom: 48px;
}

body.hotel-room-page .hotel-room-card {
  padding: 28px;
  border: 1px solid rgba(24, 50, 34, 0.1);
  border-radius: 24px;
  background: #ffffff;
  box-shadow: 0 12px 34px rgba(24, 50, 34, 0.06);
}

body.hotel-room-page .hotel-room-summary h1 {
  max-width: 17ch;
  font-size: clamp(2.2rem, 4vw, 3.75rem);
  line-height: 1.05;
}

body.hotel-room-page .hotel-room-price-box {
  border-color: rgba(38, 123, 49, 0.14);
  border-radius: 16px;
  background: #f1f7ef;
}

body.hotel-room-page .hotel-room-panel {
  border-radius: 16px;
  background: #fbfcfa;
  box-shadow: none;
}

.hotel-room-cart-note {
  display: flex;
  gap: 8px;
  margin: 0;
  padding: 12px 14px;
  border-radius: 13px;
  color: #4d5e50;
  background: #f6f8f5;
  font-size: 0.82rem;
  line-height: 1.5;
}

.hotel-room-cart-note::before {
  content: "✓";
  color: var(--green-deep);
  font-weight: 800;
}

body.cart-page .cart-main {
  gap: 22px;
}

body.cart-page .cart-hero {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 32px;
  padding: 12px 2px 4px;
}

body.cart-page .cart-hero h1 {
  max-width: none;
  margin-top: 6px;
  font-size: clamp(2.5rem, 5vw, 4.25rem);
  line-height: 1;
}

body.cart-page .cart-hero .hero-text {
  max-width: 520px;
  margin: 0 0 5px;
  font-size: 0.96rem;
}

body.cart-page .cart-layout {
  grid-template-columns: minmax(0, 1.2fr) minmax(330px, 0.52fr);
  gap: 22px;
}

body.cart-page .cart-item-card,
body.cart-page .cart-empty-card,
body.cart-page .cart-summary-card {
  border: 1px solid rgba(24, 50, 34, 0.1);
  border-radius: 20px;
  background: #ffffff;
  box-shadow: 0 10px 30px rgba(24, 50, 34, 0.05);
}

body.cart-page .cart-item-card {
  padding: 20px;
}

body.cart-page .cart-item-layout {
  grid-template-columns: minmax(220px, 0.62fr) minmax(0, 1fr);
  gap: 24px;
}

body.cart-page .cart-item-media {
  min-height: 330px;
  border-radius: 15px;
  background: #e9efe7;
}

body.cart-page .stay-meta-row {
  align-items: center;
}

.cart-saved-label {
  color: #55705b;
  font-size: 0.76rem;
  font-weight: 700;
}

.cart-saved-label::before {
  content: "✓ ";
  color: var(--green-deep);
}

body.cart-page .cart-item-copy h2 {
  font-size: clamp(1.75rem, 3vw, 2.6rem);
  line-height: 1.08;
}

body.cart-page .cart-kpi-card,
body.cart-page .cart-dates-card {
  padding: 15px;
  border-radius: 14px;
  background: #f6f8f5;
}

body.cart-page .cart-kpi-card span {
  font-size: 0.76rem;
  font-weight: 700;
}

body.cart-page .cart-kpi-card strong {
  font-size: 1rem;
}

body.cart-page .cart-summary-card {
  top: 102px;
  padding: 24px;
}

body.cart-page .cart-summary-card h2 {
  font-size: 1.65rem;
  line-height: 1.12;
}

.cart-summary-total {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: baseline;
  gap: 5px 16px;
  padding: 18px 0;
  border-top: 1px solid rgba(24, 50, 34, 0.1);
  border-bottom: 1px solid rgba(24, 50, 34, 0.1);
}

.cart-summary-total > span {
  font-weight: 700;
}

.cart-summary-total > strong {
  color: var(--ink);
  font-size: 1.6rem;
  letter-spacing: -0.04em;
}

.cart-summary-total > small {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 0.73rem;
}

body.cart-page .hotel-detail-sidebar-actions {
  gap: 10px;
}

.cart-text-link,
.cart-remove-button {
  justify-self: center;
  border: 0;
  color: #506253;
  background: transparent;
  font: inherit;
  font-size: 0.82rem;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}

.cart-remove-button {
  color: #945348;
}

.cart-security-note {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 13px;
  border-radius: 13px;
  background: #f3f7f1;
}

.cart-security-note p {
  margin: 0 !important;
  font-size: 0.76rem;
  line-height: 1.45 !important;
}

.cart-security-note strong {
  display: block;
  color: var(--ink);
}

body.cart-page .cart-empty-card {
  justify-items: center;
  max-width: 680px;
  margin: 18px auto 60px;
  padding: 54px 36px;
  text-align: center;
}

.cart-empty-icon {
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  border-radius: 18px;
  background: #e8f5e3;
  font-size: 1.7rem;
}

body.checkout-page .results-hero,
body.checkout-confirmation-page .results-hero {
  max-width: 760px;
  padding-top: 10px;
}

body.checkout-page .results-hero h1,
body.checkout-confirmation-page .results-hero h1 {
  max-width: none;
  margin-top: 7px;
  font-size: clamp(2.5rem, 5vw, 4rem);
  line-height: 1.02;
}

body.checkout-page .results-hero .hero-text,
body.checkout-confirmation-page .results-hero .hero-text {
  margin-bottom: 0;
}

body.checkout-page .checkout-layout,
body.checkout-confirmation-page .confirmation-layout {
  grid-template-columns: minmax(0, 1.08fr) minmax(350px, 0.66fr);
  gap: 22px;
  margin-top: 24px;
}

body.checkout-page .results-panel,
body.checkout-page .checkout-card,
body.checkout-confirmation-page .results-panel,
body.checkout-confirmation-page .checkout-card {
  border: 1px solid rgba(24, 50, 34, 0.1);
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 10px 30px rgba(24, 50, 34, 0.05);
  backdrop-filter: none;
}

body.checkout-page .results-panel,
body.checkout-page .checkout-card {
  padding: 22px;
}

body.checkout-page aside.checkout-panel {
  top: 102px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

body.checkout-page .results-head h2,
body.checkout-page .checkout-card h2 {
  font-size: clamp(1.55rem, 3vw, 2.15rem);
  line-height: 1.12;
}

body.checkout-page .checkout-detail-card,
body.checkout-page .checkout-disclosure-grid section,
body.checkout-page .checkout-card > section {
  border-radius: 14px;
  background: #ffffff;
}

body.checkout-page .checkout-payment-timing {
  border-radius: 15px;
  background: #eff7ec;
}

body.checkout-page .checkout-purchase-scope-card {
  border-top: 4px solid var(--green-deep);
}

body.checkout-page .checkout-scope-callout {
  border-radius: 13px;
  background: #fff9e8;
  font-size: 0.82rem;
}

body.checkout-page .field-group input,
body.checkout-page .field-group textarea,
body.checkout-page .card-element-shell {
  border-radius: 12px;
  background: #ffffff;
}

body.checkout-page .checkout-terms-row {
  border-radius: 13px;
  font-size: 0.82rem;
}

body.checkout-page #pay-now-button {
  min-height: 54px;
  border-radius: 13px;
  font-weight: 800;
}

.button,
body.hotel-detail-page .button {
  min-height: 48px;
  border-radius: 13px;
  font-weight: 750;
}

.button-primary {
  background: var(--green-deep);
}

.button-primary:hover {
  background: #1f6829;
}

.mobile-dock-cart {
  position: relative;
  color: #ffffff;
  background: var(--ink);
}

.mobile-dock-cart .cart-count {
  position: absolute;
  top: 5px;
  right: calc(50% - 21px);
  display: grid;
  min-width: 17px;
  height: 17px;
  padding: 0 4px;
  color: #ffffff;
  background: var(--green-deep);
  font-size: 0.58rem;
}

@media (max-width: 1080px) {
  body.cart-page .cart-layout,
  body.checkout-page .checkout-layout,
  body.checkout-confirmation-page .confirmation-layout {
    grid-template-columns: 1fr;
  }

  body.cart-page .cart-summary-card,
  body.checkout-page aside.checkout-panel {
    position: static;
  }
}

@media (max-width: 820px) {
  .booking-progress {
    grid-template-columns: 1fr;
    gap: 13px;
    padding: 14px;
  }

  .booking-progress-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 0 10px;
    border-right: 0;
    border-bottom: 1px solid rgba(24, 50, 34, 0.1);
  }

  .booking-progress li {
    display: grid;
    justify-items: center;
    gap: 6px;
    text-align: center;
  }

  .booking-progress-step {
    display: grid;
    justify-items: center;
    gap: 6px;
    width: 100%;
  }

  .booking-progress li:not(:last-child)::after {
    top: 13px;
    left: calc(50% + 14px);
    right: calc(-50% + 14px);
    transform: none;
  }

  .booking-progress-label {
    width: 100%;
    padding: 0 3px;
    font-size: 0.66rem;
    line-height: 1.2;
    white-space: normal;
  }

  body.cart-page .cart-hero {
    display: grid;
    gap: 12px;
  }

  body.cart-page .cart-item-layout {
    grid-template-columns: 1fr;
  }

  body.cart-page .cart-item-media {
    min-height: 260px;
    max-height: 360px;
  }

  body.hotel-room-page .hotel-room-card {
    padding: 20px;
  }

  body.checkout-page .checkout-main-column,
  body.checkout-page aside.checkout-panel {
    gap: 16px;
  }
}

@media (max-width: 720px) {
  .site-header {
    min-height: auto;
    padding-top: 9px;
    padding-bottom: 8px;
  }

  .site-header .wordmark-logo {
    height: 44px;
    max-width: min(188px, 47vw);
  }

  .site-header > .site-nav {
    gap: 4px;
    padding: 5px 0 0;
    border-radius: 0;
    background: transparent;
  }

  .site-header .nav-link-text {
    min-height: 38px;
    padding: 8px 12px;
    white-space: nowrap;
  }

  .site-header > .header-actions .profile-action-button {
    display: none;
  }

  .site-header .cart-button {
    width: 46px;
    min-width: 46px;
    padding: 9px;
  }

  .site-header .cart-button-label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
  }

  .site-header .cart-count {
    position: absolute;
    top: -3px;
    right: -3px;
    border: 2px solid #ffffff;
  }

  .site-header .header-utility-link {
    min-height: 42px;
    padding: 8px 11px;
    font-size: 0.76rem;
  }

  body:is(.hotel-detail-page, .hotel-room-page, .cart-page, .checkout-page, .checkout-confirmation-page) .page-shell {
    width: calc(100% - 20px);
  }

  body.hotel-detail-page .hotel-detail-main,
  body.hotel-room-page .hotel-room-main,
  body.cart-page .cart-main,
  body.checkout-page .results-main,
  body.checkout-confirmation-page .confirmation-main {
    margin-top: 14px;
  }

  body.hotel-detail-page .hotel-detail-rooms-section,
  body.cart-page .cart-item-card,
  body.cart-page .cart-summary-card,
  body.checkout-page .results-panel,
  body.checkout-page .checkout-card {
    padding: 18px;
  }

  body.hotel-room-page .hotel-room-card {
    padding: 14px;
    border-radius: 18px;
  }

  body.cart-page .cart-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 440px) {
  .booking-progress {
    margin-inline: -2px;
  }

  .booking-progress-heading span {
    display: none;
  }

  .booking-progress-heading {
    justify-content: flex-end;
  }

  .booking-progress-marker {
    width: 24px;
    height: 24px;
    flex-basis: 24px;
  }

  .booking-progress li:not(:last-child)::after {
    top: 12px;
  }

  body.cart-page .cart-kpi-grid {
    grid-template-columns: 1fr;
  }

  body.cart-page .cart-item-media {
    min-height: 220px;
  }

  body.cart-page .cart-empty-card {
    padding: 40px 18px;
  }
}

/* Streamlined cart and checkout flow */
body.cart-page .cart-main {
  gap: 26px;
}

body.cart-page .cart-hero {
  align-items: center;
  padding: 10px 2px 0;
}

body.cart-page .cart-hero h1 {
  font-size: clamp(2.5rem, 4.4vw, 3.7rem);
}

body.cart-page .cart-hero .hero-text {
  max-width: 430px;
}

body.cart-page .cart-layout {
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.42fr);
  gap: 24px;
}

.cart-items-panel,
body.cart-page .cart-summary-card {
  border: 1px solid rgba(24, 50, 34, 0.1);
  border-radius: 22px;
  background: #ffffff;
  box-shadow: 0 10px 30px rgba(24, 50, 34, 0.05);
}

.cart-items-panel {
  min-width: 0;
  padding: 24px;
}

.cart-section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(24, 50, 34, 0.09);
}

.cart-section-heading h2,
.cart-product-heading h2,
.cart-flight-copy h2,
.cart-readiness h2 {
  margin: 0;
}

.cart-section-heading h2 {
  font-size: 1.35rem;
}

.cart-section-heading span {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 700;
}

.cart-product-card {
  display: grid;
  grid-template-columns: minmax(190px, 0.38fr) minmax(0, 1fr);
  gap: 22px;
  padding-top: 22px;
}

body.cart-page .cart-item-media {
  width: 100%;
  min-height: 230px;
  max-height: 280px;
  border-radius: 16px;
}

body.cart-page .cart-item-copy {
  align-content: start;
  gap: 18px;
}

.cart-product-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.cart-product-heading > div {
  display: grid;
  gap: 7px;
  min-width: 0;
}

body.cart-page .cart-product-heading h2 {
  margin-top: 2px;
  font-size: clamp(1.55rem, 2.5vw, 2.2rem);
}

.cart-product-heading .hotel-location-line {
  margin: 0;
  color: var(--muted);
}

.cart-stay-facts {
  display: grid;
  grid-template-columns: 1.35fr 0.72fr 1fr;
  gap: 1px;
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(24, 50, 34, 0.09);
  border-radius: 14px;
  background: rgba(24, 50, 34, 0.09);
}

.cart-stay-facts > div {
  display: grid;
  align-content: start;
  gap: 5px;
  padding: 13px 14px;
  background: #f8faf7;
}

.cart-stay-facts dt,
.cart-product-price span,
.cart-product-price small {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 700;
}

.cart-stay-facts dd {
  margin: 0;
  font-size: 0.88rem;
  font-weight: 750;
  line-height: 1.35;
}

.cart-product-footer {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
}

.cart-product-price {
  display: grid;
  gap: 2px;
}

.cart-product-price strong {
  color: var(--ink);
  font-size: 1.45rem;
  letter-spacing: -0.035em;
}

.cart-edit-link,
.cart-back-link {
  color: var(--green-deep);
  font-size: 0.82rem;
  font-weight: 800;
  text-underline-offset: 3px;
}

.cart-item-status {
  padding: 11px 13px;
  border-radius: 12px;
  color: #31593a;
  background: #eef7eb;
  font-size: 0.8rem;
  font-weight: 650;
  line-height: 1.45;
}

.cart-item-status.is-action-needed {
  color: #765409;
  background: #fff7dc;
}

body.cart-page .cart-remove-button {
  flex: 0 0 auto;
  padding: 4px 0;
  color: #815248;
  font-size: 0.78rem;
  text-decoration: none;
}

body.cart-page .cart-remove-button:hover {
  text-decoration: underline;
}

.cart-flight-product {
  grid-template-columns: 54px minmax(0, 1fr) auto;
  align-items: center;
  margin-top: 22px;
  border-top: 1px solid rgba(24, 50, 34, 0.09);
}

.cart-layout.flight-only .cart-flight-product {
  margin-top: 0;
  border-top: 0;
}

body.cart-page #cart-flight-remove-button {
  grid-column: 3;
  justify-self: end;
}

.cart-layout.has-trip-bundle .cart-items-panel {
  border-color: rgba(38, 123, 49, 0.22);
  box-shadow: 0 16px 38px rgba(38, 123, 49, 0.08);
}

.cart-layout.has-trip-bundle .cart-flight-product {
  margin-top: 18px;
  padding: 18px;
  border: 1px solid rgba(38, 123, 49, 0.15);
  border-radius: 16px;
  background: linear-gradient(135deg, #f1f8ee, #ffffff);
}

.cart-layout.has-trip-bundle .cart-section-heading span {
  padding: 6px 10px;
  border-radius: 999px;
  background: #e8f4e4;
  color: var(--green-deep);
}

.cart-flight-icon {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  border-radius: 14px;
  color: var(--green-deep);
  background: #edf6ea;
}

.cart-flight-icon svg {
  width: 28px;
  height: 28px;
}

.cart-flight-copy {
  display: grid;
  gap: 5px;
}

.cart-flight-copy h2 {
  font-size: 1.15rem;
}

.cart-flight-copy p {
  margin: 0;
  color: var(--muted);
  font-size: 0.83rem;
}

.cart-flight-price {
  font-size: 1.15rem;
}

body.cart-page .cart-summary-card {
  display: grid;
  gap: 20px;
  top: 102px;
  padding: 24px;
}

.cart-readiness {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}

.cart-readiness-icon {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 999px;
  color: #ffffff;
  background: var(--green-deep);
  font-weight: 900;
}

.cart-readiness.is-action-needed .cart-readiness-icon {
  color: #684c08;
  background: #f5d77a;
}

.cart-readiness > div {
  display: grid;
  gap: 5px;
}

.cart-readiness h2 {
  font-size: 1.3rem;
  line-height: 1.2;
}

.cart-readiness p {
  margin: 0;
  color: var(--muted);
  font-size: 0.86rem;
  line-height: 1.45;
}

body.cart-page .cart-summary-total {
  padding: 17px 0;
}

.cart-summary-actions {
  display: grid;
  gap: 10px;
}

.cart-summary-actions .cart-back-link {
  justify-self: center;
  padding-top: 4px;
  color: #506253;
}

body.cart-page .cart-security-note {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin: -3px 0 0;
  padding: 0;
  color: var(--muted);
  background: transparent;
  font-size: 0.75rem;
}

/* Checkout review and form */
body.checkout-page .checkout-hero {
  max-width: 680px;
}

body.checkout-page .checkout-layout {
  grid-template-columns: minmax(0, 1.06fr) minmax(390px, 0.68fr);
  gap: 24px;
}

body.checkout-page .checkout-main-column {
  gap: 0;
}

body.checkout-page .checkout-review-panel,
body.checkout-page .checkout-form-card {
  padding: 26px;
}

.checkout-review-head,
.checkout-price-heading {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 20px;
}

.checkout-review-head > div,
.checkout-price-heading > div {
  display: grid;
  gap: 7px;
}

.checkout-review-head h2,
.checkout-price-heading h2 {
  margin: 0;
}

.checkout-review-head p,
.checkout-price-heading p {
  margin: 0;
  color: var(--muted);
}

.checkout-verified-badge {
  flex: 0 0 auto;
  padding: 8px 10px;
  border-radius: 999px;
  color: #31593a;
  background: #eef7eb;
  font-size: 0.72rem;
  font-weight: 800;
}

body.checkout-page .checkout-detail-list {
  margin-top: 22px;
}

body.checkout-page .checkout-detail-card {
  padding: 17px;
  border-radius: 14px;
}

body.checkout-page .checkout-detail-card h3 {
  margin-top: 8px;
  font-size: 1.08rem;
}

body.checkout-page .checkout-detail-card p {
  color: var(--muted);
  font-size: 0.84rem;
}

.checkout-price-section {
  display: grid;
  gap: 18px;
  margin-top: 24px;
  padding-top: 24px;
  border-top: 1px solid rgba(24, 50, 34, 0.1);
}

.checkout-price-heading > p {
  max-width: 260px;
  text-align: right;
  font-size: 0.76rem;
  line-height: 1.4;
}

body.checkout-page .checkout-price-lines,
body.checkout-page .checkout-payment-timing {
  border-radius: 14px;
}

body.checkout-page .checkout-disclosure-grid {
  grid-template-columns: 1fr;
  gap: 10px;
}

body.checkout-page .checkout-disclosure-grid details {
  padding: 14px 16px;
  border: 1px solid rgba(24, 50, 34, 0.09);
  border-radius: 13px;
  background: #f8faf7;
}

body.checkout-page .checkout-disclosure-grid summary {
  color: var(--ink);
  font-size: 0.86rem;
  font-weight: 800;
  cursor: pointer;
}

body.checkout-page .checkout-disclosure-grid .checkout-policy-list {
  margin-top: 12px;
  font-size: 0.81rem;
}

body.checkout-page aside.checkout-panel {
  position: sticky;
  top: 102px;
}

body.checkout-page .checkout-form-card {
  display: grid;
  gap: 0;
}

.checkout-form-summary {
  display: grid;
  gap: 7px;
  padding-bottom: 20px;
}

.checkout-form-summary h2,
.checkout-form-summary p,
.checkout-form-section-head h3,
.checkout-form-section-head p {
  margin: 0;
}

body.checkout-page .checkout-form-summary h2 {
  font-size: 1.55rem;
}

.checkout-form-summary > p:not(.eyebrow):not(.checkout-scope-callout) {
  color: var(--muted);
  font-size: 0.84rem;
}

body.checkout-page .checkout-scope-callout {
  margin-top: 7px;
  padding: 10px 12px;
  border: 0;
  color: #4c5d4f;
  background: #f4f7f3;
  font-size: 0.78rem;
  font-weight: 650;
}

body.checkout-page .checkout-card > .checkout-form-section {
  display: grid;
  gap: 16px;
  padding: 20px 0;
  border: 0;
  border-top: 1px solid rgba(24, 50, 34, 0.1);
  border-radius: 0;
  background: transparent;
}

body.checkout-page .checkout-card > .checkout-form-section:last-child {
  padding-bottom: 0;
}

.checkout-form-section-head {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
}

.checkout-form-section-head > span {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  color: #ffffff;
  background: var(--green-deep);
  font-size: 0.76rem;
  font-weight: 850;
}

.checkout-form-section-head > div {
  display: grid;
  gap: 3px;
}

.checkout-form-section-head h3 {
  font-size: 1rem;
}

.checkout-form-section-head p,
.checkout-form-intro {
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.4;
}

body.checkout-page .checkout-contact-grid {
  grid-template-columns: 1fr;
}

body.checkout-page .checkout-terms-row {
  padding: 13px;
}

.checkout-submit-status {
  display: grid;
  gap: 4px;
  padding: 12px 13px;
  border-radius: 12px;
  background: #f5f8f4;
  text-align: center;
}

.checkout-submit-status .order-status,
.checkout-submit-status .checkout-message {
  margin: 0;
}

.checkout-submit-status .order-status {
  font-size: 0.76rem;
}

.checkout-submit-status .checkout-message {
  font-size: 0.76rem;
  line-height: 1.4;
}

.hotel-room-checkout-label {
  color: #865b0b;
  font-weight: 750;
}

.hotel-room-checkout-label.is-eligible {
  color: var(--green-deep);
}

.hotel-room-checkout-notice {
  margin-bottom: 16px;
}

.hotel-room-picker-button:disabled {
  opacity: 0.7;
  cursor: not-allowed;
}

@media (max-width: 1080px) {
  body.checkout-page .checkout-layout {
    grid-template-columns: 1fr;
  }

  body.checkout-page aside.checkout-panel {
    position: static;
  }
}

@media (max-width: 820px) {
  .cart-product-card {
    grid-template-columns: 1fr;
  }

  body.cart-page .cart-item-media {
    aspect-ratio: 16 / 8;
    min-height: 220px;
  }

  .cart-stay-facts {
    grid-template-columns: 1fr 0.7fr;
  }

  .cart-stay-facts > div:first-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 600px) {
  .cart-items-panel,
  body.cart-page .cart-summary-card,
  body.checkout-page .checkout-review-panel,
  body.checkout-page .checkout-form-card {
    padding: 18px;
    border-radius: 18px;
  }

  body.cart-page .cart-hero .hero-text {
    font-size: 0.88rem;
  }

  .cart-product-heading,
  .cart-product-footer {
    align-items: start;
  }

  .cart-product-heading {
    gap: 10px;
  }

  .cart-stay-facts {
    grid-template-columns: 1fr;
  }

  .cart-stay-facts > div:first-child {
    grid-column: auto;
  }

  .cart-flight-product {
    grid-template-columns: 46px minmax(0, 1fr);
  }

  .cart-flight-icon {
    width: 46px;
    height: 46px;
  }

  .cart-flight-price {
    grid-column: 2;
  }

  body.cart-page #cart-flight-remove-button {
    grid-column: 1 / -1;
    justify-self: end;
  }

  .checkout-review-head,
  .checkout-price-heading {
    display: grid;
  }

  .checkout-verified-badge {
    justify-self: start;
  }

  .checkout-price-heading > p {
    max-width: none;
    text-align: left;
  }

body.checkout-page .checkout-payment-timing-row,
body.checkout-page .checkout-price-line {
    align-items: start;
  }
}

/* Clean hotel and flight search experiences */
body.hotels-page:not(.hotel-map-page),
body.flights-search-page {
  background: #f5f7fa;
  color: #172238;
}

body.hotels-page:not(.hotel-map-page) .page-shell,
body.flights-search-page .page-shell {
  width: min(1240px, calc(100% - 40px));
}

body.hotels-page:not(.hotel-map-page) .eyebrow,
body.flights-search-page .eyebrow {
  color: #1668e3;
}

body.hotels-page:not(.hotel-map-page) .button-primary,
body.flights-search-page .button-primary {
  background: #1668e3;
  color: #ffffff;
  border-color: #1668e3;
  box-shadow: none;
}

body.hotels-page:not(.hotel-map-page) .button-primary:hover,
body.flights-search-page .button-primary:hover {
  background: #0d55bd;
  border-color: #0d55bd;
  transform: none;
}

/* Hotels */
.hotels-main-clean {
  display: grid;
  gap: 34px;
  padding-top: 20px;
}

.hotel-search-hero {
  display: grid;
  gap: 18px;
}

.hotel-search-hero-copy {
  max-width: 700px;
}

.hotel-search-hero-copy .eyebrow,
.flight-search-hero-copy .eyebrow {
  margin: 0 0 6px;
}

.hotel-search-hero-copy h1,
.flight-search-hero-copy h1 {
  max-width: none;
  margin: 0;
  color: #172238;
  font-family: var(--font-sans);
  font-size: clamp(2.1rem, 4vw, 3.4rem);
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: -0.045em;
}

.hotel-search-hero-copy > p:last-child,
.flight-search-hero-copy > p:last-child {
  margin: 9px 0 0;
  color: #536070;
  font-size: 1rem;
}

.hotel-expedia-search {
  position: relative;
  z-index: 4;
  padding: 18px;
  border: 1px solid #d7dce3;
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 8px 24px rgba(23, 34, 56, 0.08);
}

.hotel-expedia-search-row {
  display: grid;
  grid-template-columns: minmax(230px, 2fr) minmax(220px, 1.5fr) minmax(92px, 0.58fr) minmax(92px, 0.58fr) auto;
  gap: 10px;
  align-items: end;
}

.hotel-search-field {
  position: relative;
  display: grid;
  gap: 5px;
  min-width: 0;
}

.hotel-search-field > label {
  color: #364152;
  font-size: 0.75rem;
  font-weight: 750;
  letter-spacing: 0;
  text-transform: none;
}

.hotel-search-control {
  width: 100%;
  min-height: 52px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 13px;
  border: 1px solid #98a2b3;
  border-radius: 10px;
  background: #ffffff;
  color: #344054;
  font: inherit;
}

.hotel-search-control:focus-within,
.hotel-search-date-button:focus-visible {
  border-color: #1668e3;
  box-shadow: 0 0 0 2px rgba(22, 104, 227, 0.16);
  outline: none;
}

.hotel-search-control svg {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
}

.hotel-search-control input {
  min-width: 0;
  min-height: 48px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: #172238;
  font-size: 0.94rem;
  font-weight: 650;
}

.hotel-search-control input:focus {
  box-shadow: none;
}

.hotel-search-date-button {
  cursor: pointer;
  text-align: left;
}

.hotel-search-date-button span {
  min-width: 0;
  overflow: hidden;
  color: #172238;
  font-size: 0.9rem;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hotel-search-submit {
  min-width: 104px;
  min-height: 52px;
  border-radius: 10px;
  font-weight: 750;
}

.hotel-date-panel {
  width: min(460px, calc(100vw - 48px));
  padding: 14px;
  border: 1px solid #d7dce3;
  border-radius: 14px;
  box-shadow: 0 18px 46px rgba(23, 34, 56, 0.18);
}

.hotel-flight-addon {
  margin-top: 13px;
}

.hotel-flight-addon-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #344054;
  font: inherit;
  font-size: 0.86rem;
  font-weight: 650;
  cursor: pointer;
}

.hotel-flight-addon-check {
  width: 18px;
  height: 18px;
  display: inline-grid;
  place-items: center;
  border: 1.5px solid #667085;
  border-radius: 4px;
  background: #ffffff;
}

.hotel-flight-addon-toggle.is-active .hotel-flight-addon-check {
  border-color: #1668e3;
  background: #1668e3;
}

.hotel-flight-addon-toggle.is-active .hotel-flight-addon-check::after {
  content: "✓";
  color: #ffffff;
  font-size: 0.74rem;
  line-height: 1;
}

.hotel-flight-addon-fields {
  width: min(400px, 100%);
  margin-top: 12px;
}

.hotel-popular-shortcuts,
.flight-quick-routes {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
  color: #667085;
  font-size: 0.82rem;
}

.hotel-popular-shortcuts button,
.flight-quick-routes button {
  padding: 0;
  border: 0;
  background: transparent;
  color: #1668e3;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.hotel-popular-shortcuts button:hover,
.flight-quick-routes button:hover {
  text-decoration: underline;
}

.hotel-results-section {
  display: grid;
  gap: 20px;
}

.hotel-results-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 20px;
}

.hotel-results-toolbar .eyebrow,
.hotel-results-toolbar h2,
.hotel-results-toolbar p {
  margin: 0;
}

.hotel-results-toolbar h2 {
  margin-top: 5px;
  color: #172238;
  font-family: var(--font-sans);
  font-size: clamp(1.65rem, 3vw, 2.25rem);
  font-weight: 800;
  letter-spacing: -0.035em;
}

.hotel-results-toolbar p:last-child {
  margin-top: 6px;
  color: #667085;
}

.hotel-sort-control {
  min-width: 190px;
  display: grid;
  gap: 4px;
  color: #475467;
  font-size: 0.75rem;
  font-weight: 700;
}

.hotel-sort-control select {
  min-height: 44px;
  padding: 9px 34px 9px 12px;
  border-color: #b7c0cc;
  border-radius: 9px;
  background-color: #ffffff;
  font-size: 0.86rem;
}

.hotels-results-layout-clean {
  grid-template-columns: 232px minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

.hotels-results-layout-clean.is-landing {
  grid-template-columns: minmax(0, 1fr);
}

.hotels-results-layout-clean.is-landing .hotels-filters-sidebar {
  display: none;
}

.hotels-filter-bar {
  overflow: hidden;
  border: 1px solid #dfe3e8;
  border-radius: 12px;
  background: #ffffff;
}

.hotel-filter-title-row,
.hotels-filter-section {
  padding: 17px;
}

.hotel-filter-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid #e7eaf0;
}

.hotel-filter-title-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

.hotel-filter-mobile-toggle {
  display: none;
  padding: 0;
  border: 0;
  background: transparent;
  color: #267b31;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 750;
  cursor: pointer;
}

.hotel-filter-sections {
  display: contents;
}

.hotel-filter-title-row h3,
.hotels-filter-section h4 {
  margin: 0;
  color: #172238;
  font-family: var(--font-sans);
}

.hotel-filter-title-row h3 {
  font-size: 1rem;
}

.hotel-filter-reset {
  padding: 0;
  border: 0;
  background: transparent;
  color: #1668e3;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 750;
  cursor: pointer;
}

.hotels-filter-section + .hotels-filter-section {
  border-top: 1px solid #e7eaf0;
}

.hotels-filter-section h4 {
  margin-bottom: 12px;
  font-size: 0.88rem;
}

.hotel-filter-price-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.hotel-filter-price-field {
  display: grid;
  gap: 4px;
  color: #667085;
  font-size: 0.7rem;
}

.hotel-filter-price-field input {
  min-height: 40px;
  padding: 8px;
  border-radius: 8px;
  font-size: 0.8rem;
}

.hotel-filter-radio-list,
.hotel-filter-chip-list {
  display: grid;
  gap: 10px;
}

.hotel-filter-radio-list label,
.hotel-filter-chip-list label {
  display: flex;
  align-items: center;
  gap: 9px;
  color: #475467;
  font-size: 0.82rem;
  font-weight: 550;
}

.hotel-filter-radio-list input,
.hotel-filter-chip-list input {
  width: 17px;
  height: 17px;
  min-height: 0;
  margin: 0;
  padding: 0;
  accent-color: #1668e3;
}

.hotel-filter-sidebar-empty {
  margin: 0;
  color: #98a2b3;
  font-size: 0.78rem;
}

.hotel-destination-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.hotel-destination-card {
  min-height: 176px;
  display: grid;
  align-content: end;
  justify-items: start;
  gap: 3px;
  padding: 20px;
  overflow: hidden;
  border: 1px solid rgba(23, 34, 56, 0.08);
  border-radius: 14px;
  color: #172238;
  text-align: left;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(23, 34, 56, 0.05);
  transition: transform 160ms ease, box-shadow 160ms ease;
}

.hotel-destination-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(23, 34, 56, 0.11);
}

.hotel-destination-card span {
  margin-bottom: auto;
  padding: 5px 8px;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.82);
  color: #1668e3;
  font-size: 0.72rem;
  font-weight: 800;
}

.hotel-destination-card strong {
  font-size: 1.08rem;
}

.hotel-destination-card small {
  color: #536070;
}

.hotel-destination-card-miami {
  background: linear-gradient(145deg, #dff5f9, #f8ffff 58%, #a9e5ed);
}

.hotel-destination-card-new-york {
  background: linear-gradient(145deg, #e8edf5, #ffffff 58%, #c8d4e7);
}

.hotel-destination-card-beverly {
  background: linear-gradient(145deg, #f7edda, #fffdf8 58%, #ead4ae);
}

.hotel-destination-card-santa-monica {
  background: linear-gradient(145deg, #e1f0eb, #fbfffd 58%, #b7dccf);
}

body.hotels-page .hotel-clean-results {
  display: grid;
  gap: 14px;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card {
  height: auto;
  min-height: 226px;
  grid-template-columns: 270px minmax(0, 1fr);
  overflow: hidden;
  border: 1px solid #dfe3e8;
  border-radius: 13px;
  background: #ffffff;
  box-shadow: 0 3px 10px rgba(23, 34, 56, 0.05);
  transition: border-color 160ms ease, box-shadow 160ms ease;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card:hover {
  border-color: #9abcf0;
  box-shadow: 0 8px 22px rgba(23, 34, 56, 0.1);
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-media {
  min-height: 226px;
  height: 100%;
  padding: 0;
  aspect-ratio: auto;
  background: #e9edf2;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-media::after {
  background: linear-gradient(180deg, transparent 55%, rgba(23, 34, 56, 0.2));
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-photo-hero {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border-radius: 0;
  object-fit: cover;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .stay-media-placeholder {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  background: #e9edf2;
  color: #667085;
  font-size: 2.2rem;
  font-weight: 800;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-chip {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 2;
  padding: 6px 9px;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.94);
  color: #344054;
  font-size: 0.68rem;
  box-shadow: 0 2px 8px rgba(23, 34, 56, 0.12);
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(172px, auto);
  grid-template-areas: none;
  gap: 20px;
  padding: 19px 20px;
  background: #ffffff;
}

.hotel-result-copy {
  min-width: 0;
}

body.hotels-page .hotel-result-copy .featured-hotel-location {
  margin: 0 0 5px;
  color: #667085;
  font-size: 0.75rem;
  font-weight: 600;
}

body.hotels-page .hotel-result-copy h3 {
  margin: 0;
  color: #172238;
  font-family: var(--font-sans);
  font-size: 1.12rem;
  font-weight: 780;
  line-height: 1.25;
}

.hotel-result-rating {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
}

.hotel-result-rating strong {
  padding: 4px 7px;
  border-radius: 5px;
  background: #1f7a4c;
  color: #ffffff;
  font-size: 0.72rem;
}

.hotel-result-rating span {
  color: #344054;
  font-size: 0.79rem;
  font-weight: 650;
}

.hotel-result-amenities,
.hotel-result-policy {
  margin: 10px 0 0;
  color: #536070;
  font-size: 0.76rem;
  line-height: 1.45;
}

.hotel-result-policy {
  color: #1f7a4c;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-price-stack.hotel-result-price {
  min-width: 172px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 4px;
  margin: 0;
  padding: 0;
  text-align: right;
}

.hotel-result-price > small {
  color: #667085;
  font-size: 0.7rem;
}

body.hotels-page .hotel-result-price .hotel-price-primary {
  margin: 0;
  color: #172238;
  font-size: 1.38rem;
  font-weight: 800;
  line-height: 1.15;
}

body.hotels-page .hotel-result-price .hotel-price-primary span,
body.hotels-page .hotel-result-price .hotel-price-secondary {
  color: #667085;
  font-size: 0.7rem;
  font-weight: 500;
}

body.hotels-page .hotel-result-price .hotel-price-secondary {
  margin: 0;
}

body.hotels-page .hotel-result-price .hotel-price-secondary-trip {
  color: #1f7a4c;
  font-weight: 700;
}

.hotel-result-view-button {
  min-height: 38px;
  margin-top: 8px;
  padding: 9px 14px;
  border-radius: 8px;
  font-size: 0.78rem;
  font-weight: 750;
}

/* Flights */
.flights-main {
  display: grid;
  gap: 28px;
  padding-top: 20px;
}

.flight-search-hero {
  display: grid;
  gap: 18px;
}

.flight-search-shell {
  position: relative;
  z-index: 3;
  padding: 18px;
  border: 1px solid #d7dce3;
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 8px 24px rgba(23, 34, 56, 0.08);
}

.flight-search-topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 16px;
}

body.flights-search-page .trip-toggle {
  width: auto;
  display: flex;
  gap: 4px;
  padding: 4px;
  border-radius: 9px;
  background: #f1f4f8;
}

body.flights-search-page .trip-option {
  min-height: 34px;
  padding: 7px 13px;
  border-radius: 7px;
  color: #536070;
  font-size: 0.8rem;
  font-weight: 700;
}

body.flights-search-page .trip-option.active {
  background: #ffffff;
  color: #1668e3;
  box-shadow: 0 1px 4px rgba(23, 34, 56, 0.14);
}

.flight-search-topline-note {
  color: #667085;
  font-size: 0.78rem;
}

.flight-route-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 42px minmax(0, 1fr);
  align-items: end;
  gap: 8px;
}

.flight-search-field {
  gap: 5px;
}

body.flights-search-page .flight-search-field > label {
  color: #364152;
  font-size: 0.75rem;
  font-weight: 750;
  letter-spacing: 0;
  text-transform: none;
}

.flight-field-control {
  min-height: 52px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 13px;
  border: 1px solid #98a2b3;
  border-radius: 10px;
  background: #ffffff;
  color: #344054;
}

.flight-field-control:focus-within {
  border-color: #1668e3;
  box-shadow: 0 0 0 2px rgba(22, 104, 227, 0.16);
}

.flight-field-control svg {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
}

body.flights-search-page .flight-field-control input,
body.flights-search-page .flight-field-control select {
  min-height: 50px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: #172238;
  font-size: 0.9rem;
  font-weight: 650;
}

.flight-route-swap {
  width: 40px;
  height: 40px;
  margin-bottom: 6px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid #b7c0cc;
  border-radius: 50%;
  background: #ffffff;
  color: #1668e3;
  cursor: pointer;
}

.flight-route-swap:hover {
  background: #edf4ff;
}

.flight-route-swap svg {
  width: 19px;
  height: 19px;
}

.flight-search-details-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr)) auto;
  gap: 10px;
  align-items: end;
  margin-top: 13px;
}

body.flights-search-page .flight-search-submit {
  min-width: 144px;
  min-height: 52px;
  border-radius: 10px;
  font-weight: 750;
}

.flight-search-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-top: 14px;
}

.flight-search-status {
  margin: 0;
  color: #667085;
  font-size: 0.78rem;
  text-align: right;
}

body.flights-search-page .flights-results-panel {
  min-height: 320px;
  padding: 24px;
  border: 1px solid #dfe3e8;
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 4px 14px rgba(23, 34, 56, 0.05);
  backdrop-filter: none;
}

body.flights-search-page .flights-results-head {
  align-items: center;
  margin-bottom: 20px;
}

.flights-results-head .eyebrow,
.flights-results-head h2,
.flights-results-head p {
  margin: 0;
}

.flights-results-head h2 {
  margin-top: 5px;
  color: #172238;
  font-family: var(--font-sans);
  font-size: clamp(1.45rem, 3vw, 2rem);
  font-weight: 800;
  letter-spacing: -0.035em;
}

.flights-results-head p:last-child {
  margin-top: 5px;
  color: #667085;
  font-size: 0.9rem;
}

.flight-results-hotel-link {
  color: #1668e3;
  font-size: 0.86rem;
  font-weight: 750;
  text-decoration: none;
}

.flight-results-hotel-link:hover {
  text-decoration: underline;
}

body.flights-search-page .flight-results-empty {
  min-height: 180px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 5px;
  margin: 0;
  padding: 26px;
  border: 1px dashed #c9d1dc;
  border-radius: 12px;
  background: #f8fafc;
  color: #667085;
  text-align: center;
}

body.flights-search-page .flight-results-empty:not(.visible) {
  display: none;
}

.flight-results-empty > span {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  margin-bottom: 5px;
  border-radius: 50%;
  background: #e8f1ff;
  color: #1668e3;
  font-size: 1.2rem;
}

.flight-results-empty strong {
  color: #344054;
}

.flight-results-empty p {
  margin: 0;
  font-size: 0.85rem;
}

.flight-options-list {
  display: grid;
  gap: 12px;
}

.flight-option-card {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr) 170px;
  align-items: center;
  gap: 22px;
  padding: 18px;
  border: 1px solid #dfe3e8;
  border-radius: 12px;
  background: #ffffff;
  transition: border-color 160ms ease, box-shadow 160ms ease;
}

.flight-option-card:hover,
.flight-option-card.selected {
  border-color: #8bb4ef;
  box-shadow: 0 6px 18px rgba(23, 34, 56, 0.08);
}

.flight-option-card.selected {
  box-shadow: inset 3px 0 #1668e3, 0 6px 18px rgba(23, 34, 56, 0.08);
}

.flight-option-airline {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 11px;
}

.flight-airline-mark {
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 9px;
  background: #e8f1ff;
  color: #1668e3;
  font-weight: 850;
}

.flight-option-airline > div,
.flight-route-time {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.flight-option-airline strong {
  overflow: hidden;
  color: #172238;
  font-size: 0.86rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.flight-option-airline span,
.flight-route-time span,
.flight-option-price small {
  color: #667085;
  font-size: 0.68rem;
  text-transform: capitalize;
}

.flight-option-route {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(105px, 1fr) minmax(90px, 0.8fr) minmax(105px, 1fr);
  align-items: center;
  gap: 12px;
}

.flight-route-time strong {
  color: #172238;
  font-size: 1.18rem;
}

.flight-route-time-arrival {
  text-align: right;
}

.flight-route-line {
  min-width: 0;
  display: grid;
  justify-items: center;
  gap: 4px;
  color: #536070;
  font-size: 0.68rem;
  text-align: center;
}

.flight-route-line i {
  position: relative;
  width: 100%;
  height: 1px;
  display: block;
  background: #98a2b3;
}

.flight-route-line i::after {
  content: "";
  position: absolute;
  top: -3px;
  right: 0;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #1668e3;
}

.flight-route-line small {
  color: #98a2b3;
  font-size: 0.62rem;
}

.flight-option-price {
  display: grid;
  justify-items: end;
  gap: 5px;
  text-align: right;
}

.flight-option-price > strong {
  color: #172238;
  font-size: 1.3rem;
}

body.flights-search-page .flight-option-price .button {
  min-width: 100px;
  min-height: 36px;
  padding: 8px 13px;
  border-radius: 8px;
  font-size: 0.76rem;
}

body.flights-search-page .flight-option-price .button-secondary {
  border: 1px solid #8bb4ef;
  background: #edf4ff;
  color: #1668e3;
}

body.flights-search-page .inline-flight-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 20px;
  margin-top: 18px;
  padding: 18px;
  border: 1px solid #b7d2f6;
  border-radius: 12px;
  background: #f4f8ff;
  box-shadow: none;
  backdrop-filter: none;
}

body.flights-search-page .inline-flight-summary h3,
body.flights-search-page .inline-flight-summary p {
  margin: 0;
}

body.flights-search-page .inline-flight-summary h3 {
  margin-top: 4px;
  color: #172238;
  font-family: var(--font-sans);
}

.flight-selected-actions {
  display: flex;
  align-items: center;
  gap: 18px;
}

.flight-selected-actions .checkout-total-row {
  min-width: 120px;
  display: grid;
  justify-items: end;
  gap: 2px;
}

.flight-selected-actions .checkout-total-row span {
  color: #667085;
  font-size: 0.7rem;
}

.flight-selected-actions .checkout-total-row strong {
  color: #172238;
  font-size: 1.2rem;
}

@media (max-width: 1040px) {
  .hotel-expedia-search-row {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .hotel-search-field-destination,
  .hotel-search-field-dates {
    grid-column: span 2;
  }

  .hotel-search-submit {
    grid-column: span 2;
  }

  .hotel-destination-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .flight-search-details-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  body.flights-search-page .flight-search-submit {
    grid-column: span 4;
  }

  .flight-option-card {
    grid-template-columns: 150px minmax(0, 1fr) 140px;
    gap: 14px;
  }
}

@media (max-width: 820px) {
  body.hotels-page:not(.hotel-map-page) .page-shell,
  body.flights-search-page .page-shell {
    width: min(100% - 24px, 1240px);
  }

  .hotels-main-clean,
  .flights-main {
    gap: 24px;
    padding-top: 12px;
  }

  .hotel-expedia-search,
  .flight-search-shell {
    padding: 14px;
  }

  .hotel-expedia-search-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .hotel-search-field-destination,
  .hotel-search-field-dates,
  .hotel-search-submit {
    grid-column: span 2;
  }

  .hotels-results-layout-clean {
    grid-template-columns: 1fr;
  }

  .hotels-filters-sidebar:has(.hotels-filter-bar.hidden) {
    display: none;
  }

  .hotels-filter-bar:not(.hidden) {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .hotel-filter-title-row {
    grid-column: 1 / -1;
  }

  .hotel-filter-mobile-toggle {
    display: inline-flex;
  }

  .hotels-filter-bar.is-mobile-collapsed:not(.hidden) {
    display: block;
  }

  .hotels-filter-bar.is-mobile-collapsed .hotel-filter-sections {
    display: none;
  }

  .hotels-filter-bar.is-mobile-collapsed .hotel-filter-reset {
    display: none;
  }

  .hotels-filter-bar:not(.is-mobile-collapsed) .hotel-filter-sections {
    display: contents;
  }

  .hotels-filter-section + .hotels-filter-section {
    border-top: 0;
    border-left: 1px solid #e7eaf0;
  }

  .flight-search-topline-note {
    display: none;
  }

  .flight-route-grid {
    grid-template-columns: 1fr;
  }

  .flight-route-swap {
    position: absolute;
    right: 28px;
    margin: -25px 0 -25px;
    z-index: 4;
    transform: rotate(90deg);
  }

  .flight-search-details-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.flights-search-page .flight-search-submit {
    grid-column: span 2;
  }

  .flight-search-footer {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }

  .flight-search-status {
    text-align: left;
  }

  .flight-option-card {
    grid-template-columns: 1fr auto;
  }

  .flight-option-route {
    grid-column: 1 / -1;
    grid-row: 2;
    order: 3;
  }

  .flight-option-price {
    grid-column: 2;
    grid-row: 1;
  }

  body.flights-search-page .inline-flight-summary {
    grid-template-columns: 1fr;
  }

  .flight-selected-actions {
    justify-content: space-between;
  }
}

@media (max-width: 620px) {
  .hotel-search-hero-copy h1,
  .flight-search-hero-copy h1 {
    font-size: 2rem;
  }

  .hotel-results-toolbar,
  .flights-results-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .hotel-sort-control {
    width: 100%;
  }

  .hotel-destination-grid {
    grid-template-columns: 1fr;
  }

  .hotel-destination-card {
    min-height: 144px;
  }

  .hotels-filter-bar:not(.hidden) {
    grid-template-columns: 1fr;
  }

  .hotels-filter-section + .hotels-filter-section {
    border-top: 1px solid #e7eaf0;
    border-left: 0;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card {
    grid-template-columns: 1fr;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-media {
    min-height: 190px;
    height: 190px;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-body {
    grid-template-columns: 1fr;
    gap: 14px;
    padding: 16px;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-price-stack.hotel-result-price {
    min-width: 0;
    align-items: flex-start;
    text-align: left;
  }

  .hotel-result-view-button {
    width: 100%;
  }

  .flight-search-details-grid {
    grid-template-columns: 1fr;
  }

  body.flights-search-page .flight-search-submit {
    grid-column: auto;
  }

  .flight-option-card {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .flight-option-route,
  .flight-option-price {
    grid-column: 1;
    grid-row: auto;
  }

  .flight-option-price {
    grid-template-columns: 1fr auto;
    align-items: center;
    justify-items: start;
    text-align: left;
  }

  .flight-option-price small {
    grid-column: 1 / -1;
  }

  .flight-option-price .button {
    justify-self: end;
  }

  .flight-selected-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .flight-selected-actions .checkout-total-row {
    justify-items: start;
  }
}

/* Brand lock: black, white, and grass green */
body.hotels-page:not(.hotel-map-page),
body.flights-search-page {
  --travel-grass: #54b948;
  --travel-grass-deep: #267b31;
  --travel-grass-pale: #eef9eb;
  background: #ffffff;
  color: #111111;
}

.hotel-search-hero-copy h1,
.hotel-results-toolbar h2,
body.hotels-page .hotel-result-copy h3,
body.hotels-page .hotel-result-price .hotel-price-primary,
.flight-search-hero-copy h1,
.flights-results-head h2,
.flight-option-airline strong,
.flight-route-time strong,
.flight-option-price > strong,
body.flights-search-page .inline-flight-summary h3,
.flight-selected-actions .checkout-total-row strong {
  color: #111111;
}

body.hotels-page:not(.hotel-map-page) .eyebrow,
body.flights-search-page .eyebrow,
.hotel-popular-shortcuts button,
.flight-quick-routes button,
.hotel-filter-reset,
.hotel-destination-card span,
.flight-results-hotel-link,
.flight-route-swap {
  color: var(--travel-grass-deep);
}

body.hotels-page:not(.hotel-map-page) .button-primary,
body.flights-search-page .button-primary {
  border-color: var(--travel-grass);
  background: var(--travel-grass);
  color: #ffffff;
}

body.hotels-page:not(.hotel-map-page) .button-primary:hover,
body.flights-search-page .button-primary:hover {
  border-color: var(--travel-grass-deep);
  background: var(--travel-grass-deep);
}

.hotel-search-control:focus-within,
.hotel-search-date-button:focus-visible,
.flight-field-control:focus-within {
  border-color: var(--travel-grass);
  box-shadow: 0 0 0 2px rgba(84, 185, 72, 0.18);
}

.hotel-flight-addon-toggle.is-active .hotel-flight-addon-check {
  border-color: var(--travel-grass);
  background: var(--travel-grass);
}

.hotel-filter-radio-list input,
.hotel-filter-chip-list input {
  accent-color: var(--travel-grass);
}

.hotel-destination-card-miami,
.hotel-destination-card-new-york,
.hotel-destination-card-beverly,
.hotel-destination-card-santa-monica {
  border-top: 4px solid var(--travel-grass);
  background: #ffffff;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card:hover {
  border-color: var(--travel-grass);
}

.hotel-result-rating strong {
  background: var(--travel-grass-deep);
}

.hotel-result-policy,
body.hotels-page .hotel-result-price .hotel-price-secondary-trip {
  color: var(--travel-grass-deep);
}

body.flights-search-page .trip-option.active {
  color: var(--travel-grass-deep);
}

.flight-route-swap:hover,
.flight-results-empty > span,
.flight-airline-mark {
  background: var(--travel-grass-pale);
  color: var(--travel-grass-deep);
}

.flight-option-card:hover,
.flight-option-card.selected {
  border-color: #8dca83;
}

.flight-option-card.selected {
  box-shadow: inset 3px 0 var(--travel-grass), 0 6px 18px rgba(17, 17, 17, 0.08);
}

.flight-route-line i::after {
  background: var(--travel-grass);
}

body.flights-search-page .flight-option-price .button-secondary {
  border-color: #8dca83;
  background: var(--travel-grass-pale);
  color: var(--travel-grass-deep);
}

body.flights-search-page .inline-flight-summary {
  border-color: #b9dfb1;
  background: #f6fbf4;
}

/* Clean, border-light hotel detail page */
body.hotel-detail-page {
  --hotel-clean-green: #54b948;
  --hotel-clean-green-deep: #267b31;
  --hotel-clean-green-pale: #f0f9ed;
  --hotel-clean-ink: #111111;
  --hotel-clean-copy: #565f59;
  background: #ffffff;
  color: var(--hotel-clean-ink);
}

body.hotel-detail-page .page-shell {
  width: min(1200px, calc(100% - 40px));
}

body.hotel-detail-page .hotel-detail-main-clean {
  display: grid;
  gap: 28px;
  margin-top: 18px;
}

body.hotel-detail-page .hotel-detail-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

body.hotel-detail-page .hotel-detail-gallery-back-link {
  gap: 8px;
  margin: 0;
  color: var(--hotel-clean-green-deep);
  font-size: 0.86rem;
  font-weight: 750;
}

body.hotel-detail-page .hotel-detail-loading-state {
  margin: 0;
  padding: 13px 16px;
  border: 0;
  border-radius: 8px;
  background: var(--hotel-clean-green-pale);
  color: #315e2b;
  font-size: 0.88rem;
}

body.hotel-detail-page .hotel-detail-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 48px;
  align-items: end;
}

body.hotel-detail-page .hotel-detail-copy {
  display: grid;
  gap: 10px;
}

body.hotel-detail-page .hotel-detail-copy h1 {
  max-width: 20ch;
  margin: 0;
  color: var(--hotel-clean-ink);
  font-family: var(--font-sans);
  font-size: clamp(2.25rem, 5vw, 4.5rem);
  font-weight: 820;
  line-height: 1.02;
  letter-spacing: -0.055em;
}

body.hotel-detail-page .hotel-detail-location {
  margin: 0;
  color: #343a36;
  font-size: 1rem;
  font-weight: 650;
}

body.hotel-detail-page .hotel-detail-summary-text {
  max-width: 720px;
  margin: 4px 0 0;
  color: var(--hotel-clean-copy);
  font-size: 0.98rem;
  line-height: 1.7;
}

body.hotel-detail-page .hotel-detail-star-row {
  gap: 10px;
}

body.hotel-detail-page .hotel-detail-star,
body.hotel-detail-page .hotel-detail-star.is-filled {
  color: var(--hotel-clean-green);
}

body.hotel-detail-page .hotel-detail-star-copy strong {
  color: var(--hotel-clean-ink);
}

body.hotel-detail-page .hotel-detail-star-copy span {
  color: var(--hotel-clean-copy);
}

body.hotel-detail-page .hotel-detail-pill-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px 18px;
  margin-top: 5px;
}

body.hotel-detail-page .hotel-detail-pill-row .hotel-spec-pill {
  position: relative;
  min-height: 0;
  padding: 0 0 0 13px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #3f4742;
  font-size: 0.8rem;
  font-weight: 600;
}

body.hotel-detail-page .hotel-detail-pill-row .hotel-spec-pill::before {
  content: "";
  position: absolute;
  top: 0.55em;
  left: 0;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--hotel-clean-green);
}

body.hotel-detail-page .hotel-detail-head-price-card {
  display: grid;
  justify-items: end;
  gap: 6px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  text-align: right;
}

body.hotel-detail-page .hotel-detail-head-price-card strong {
  color: var(--hotel-clean-ink);
  font-size: clamp(1.8rem, 3vw, 2.55rem);
  font-weight: 820;
  line-height: 1.05;
}

body.hotel-detail-page .hotel-detail-head-price-card p {
  max-width: 280px;
  margin: 0;
  color: var(--hotel-clean-copy);
  font-size: 0.8rem;
  line-height: 1.45;
}

body.hotel-detail-page .hotel-detail-head-price-card .button {
  min-width: 210px;
  margin-top: 8px;
}

body.hotel-detail-page .hotel-detail-gallery-hero-shell {
  width: 100%;
  margin: 0;
  padding: 0;
}

body.hotel-detail-page .hotel-detail-gallery-card,
body.hotel-detail-page .hotel-detail-gallery-card-hero {
  width: 100% !important;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.hotel-detail-page .hotel-gallery-stage-detail {
  min-height: 440px;
  overflow: hidden;
  border-radius: 15px;
  background: #eef1ee;
}

body.hotel-detail-page .hotel-detail-gallery-hero {
  width: 100%;
  height: clamp(440px, 52vw, 620px) !important;
  min-height: 440px !important;
  max-height: 620px !important;
  aspect-ratio: auto !important;
  border-radius: 15px;
  background: #eef1ee !important;
  object-fit: cover !important;
  object-position: center !important;
}

body.hotel-detail-page .hotel-gallery-empty {
  min-height: 440px;
  border-radius: 15px;
  background: var(--hotel-clean-green-pale);
}

body.hotel-detail-page .hotel-gallery-empty .stay-media-placeholder {
  min-height: 440px;
  color: var(--hotel-clean-green-deep);
  font-size: 3rem;
}

body.hotel-detail-page .hotel-detail-gallery-loading-placeholder {
  font-size: 0.9rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}

body.hotel-detail-page .hotel-gallery-dots {
  gap: 7px;
  padding-top: 12px;
}

body.hotel-detail-page .hotel-gallery-dot {
  width: 26px;
  height: 3px;
  background: #d4dad5;
}

body.hotel-detail-page .hotel-gallery-dot.active {
  background: var(--hotel-clean-green);
}

body.hotel-detail-page .hotel-gallery-nav {
  width: 44px;
  height: 44px;
  background: rgba(17, 17, 17, 0.7);
}

body.hotel-detail-page .hotel-gallery-counter {
  background: rgba(17, 17, 17, 0.72);
}

body.hotel-detail-page .hotel-detail-hero-action-wishlist.is-active {
  color: var(--hotel-clean-green);
}

body.hotel-detail-page .hotel-detail-jump-nav {
  display: flex;
  align-items: center;
  gap: 28px;
  overflow-x: auto;
  padding: 2px 0 16px;
  border-bottom: 1px solid #e6e9e6;
  scrollbar-width: none;
}

body.hotel-detail-page .hotel-detail-jump-nav::-webkit-scrollbar {
  display: none;
}

body.hotel-detail-page .hotel-detail-jump-nav .hotel-detail-tab {
  flex: 0 0 auto;
  border: 0;
  background: transparent;
  color: #333a35;
  cursor: pointer;
  font-family: inherit;
  font-size: 0.84rem;
  font-weight: 720;
  text-decoration: none;
}

body.hotel-detail-page .hotel-detail-jump-nav .hotel-detail-tab:hover {
  color: var(--hotel-clean-green-deep);
}

body.hotel-detail-page .hotel-detail-jump-nav .hotel-detail-tab {
  position: relative;
  padding: 8px 2px 12px;
}

body.hotel-detail-page .hotel-detail-jump-nav .hotel-detail-tab::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  height: 3px;
  border-radius: 999px 999px 0 0;
  background: var(--hotel-clean-green);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 180ms ease;
}

body.hotel-detail-page .hotel-detail-jump-nav .hotel-detail-tab.is-active,
body.hotel-detail-page .hotel-detail-jump-nav .hotel-detail-tab[aria-selected="true"] {
  color: var(--hotel-clean-green-deep);
}

body.hotel-detail-page .hotel-detail-jump-nav .hotel-detail-tab.is-active::after,
body.hotel-detail-page .hotel-detail-jump-nav .hotel-detail-tab[aria-selected="true"]::after {
  transform: scaleX(1);
}

body.hotel-detail-page .hotel-detail-jump-nav .hotel-detail-tab:focus-visible {
  outline: 2px solid var(--hotel-clean-green);
  outline-offset: 3px;
  border-radius: 4px;
}

body.hotel-detail-page .hotel-detail-tabs-enabled [data-hotel-detail-panel][hidden],
body.hotel-detail-page .hotel-detail-tabs-enabled #hotel-detail-layout[hidden] {
  display: none !important;
}

body.hotel-detail-page .hotel-detail-tabs-enabled .hotel-detail-content-section,
body.hotel-detail-page .hotel-detail-tabs-enabled .hotel-detail-rooms-section {
  padding-top: 0;
  border-top: 0;
}

body.hotel-detail-page .hotel-detail-tab-panel.is-active {
  animation: hotel-detail-panel-enter 260ms ease both;
}

@keyframes hotel-detail-panel-enter {
  from {
    opacity: 0;
    transform: translateX(18px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  body.hotel-detail-page .hotel-detail-tab-panel.is-active {
    animation: none;
  }
}

body.hotel-detail-page .hotel-detail-product {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 310px;
  gap: 60px;
  align-items: start;
}

body.hotel-detail-page .hotel-detail-primary {
  display: grid;
  gap: 44px;
}

body.hotel-detail-page .hotel-detail-highlight-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px;
  padding: 21px 24px;
  border: 0;
  border-radius: 12px;
  background: var(--hotel-clean-green-pale);
}

body.hotel-detail-page .hotel-detail-highlight-grid .hotel-detail-info-item {
  display: grid;
  align-content: start;
  gap: 5px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

body.hotel-detail-page .hotel-detail-info-label,
body.hotel-detail-page .hotel-detail-key-label,
body.hotel-detail-page .hotel-detail-total-label,
body.hotel-detail-page .hotel-room-option-label {
  color: #657067;
  font-size: 0.68rem;
  font-weight: 780;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

body.hotel-detail-page .hotel-detail-highlight-grid strong {
  color: var(--hotel-clean-ink);
  font-size: 0.88rem;
  line-height: 1.35;
}

body.hotel-detail-page .hotel-detail-highlight-grid small {
  color: var(--hotel-clean-copy);
  font-size: 0.72rem;
  line-height: 1.4;
}

body.hotel-detail-page .hotel-detail-content-section {
  display: grid;
  gap: 22px;
  scroll-margin-top: 24px;
  padding-top: 40px;
  border-top: 1px solid #e6e9e6;
}

body.hotel-detail-page .hotel-detail-content-section:first-of-type {
  padding-top: 0;
  border-top: 0;
}

body.hotel-detail-page .hotel-detail-section-head {
  display: grid;
  gap: 5px;
}

body.hotel-detail-page .hotel-detail-section-head-row {
  grid-template-columns: minmax(0, 1fr) minmax(180px, auto);
  align-items: end;
  gap: 24px;
}

body.hotel-detail-page .hotel-detail-section-head h2,
body.hotel-detail-page .hotel-detail-rooms-head h2 {
  margin: 0;
  color: var(--hotel-clean-ink);
  font-family: var(--font-sans);
  font-size: clamp(1.65rem, 3vw, 2.25rem);
  font-weight: 800;
  letter-spacing: -0.04em;
}

body.hotel-detail-page .hotel-detail-section-head-row > p,
body.hotel-detail-page .hotel-detail-rooms-head > p {
  margin: 0;
  color: var(--hotel-clean-copy);
  font-size: 0.8rem;
  line-height: 1.5;
  text-align: right;
}

body.hotel-detail-page .hotel-detail-description {
  max-width: 740px;
  margin: 0;
  color: #343a36;
  font-size: 1rem;
  line-height: 1.8;
}

body.hotel-detail-page .hotel-detail-facts-layout {
  display: grid;
  gap: 14px;
  margin-top: 4px;
}

body.hotel-detail-page .hotel-detail-facts-layout h3 {
  margin: 0 0 8px;
  color: var(--hotel-clean-ink);
  font-family: var(--font-sans);
  font-size: 1rem;
}

body.hotel-detail-page .hotel-detail-key-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 32px;
}

body.hotel-detail-page .hotel-detail-key-item {
  display: grid;
  gap: 5px;
  padding: 15px 0;
  border: 0;
  border-bottom: 1px solid #edf0ed;
  border-radius: 0;
  background: transparent;
}

body.hotel-detail-page .hotel-detail-key-item strong {
  color: #282e2a;
  font-size: 0.88rem;
  line-height: 1.5;
}

body.hotel-detail-page .hotel-detail-key-item small {
  color: var(--hotel-clean-copy);
  font-size: 0.76rem;
  line-height: 1.45;
}

body.hotel-detail-page .hotel-detail-amenities {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px 28px;
  margin: 0;
}

body.hotel-detail-page .amenity-pill {
  position: relative;
  width: auto;
  min-height: 0;
  justify-content: flex-start;
  padding: 0 0 0 20px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #343a36;
  font-size: 0.86rem;
  font-weight: 560;
  text-align: left;
}

body.hotel-detail-page .amenity-pill::before {
  content: "✓";
  position: absolute;
  top: 0;
  left: 0;
  width: auto;
  height: auto;
  border-radius: 0;
  background: transparent;
  color: var(--hotel-clean-green-deep);
  font-weight: 850;
}

body.hotel-detail-page .hotel-detail-location-grid {
  display: grid;
  grid-template-columns: minmax(210px, 0.55fr) minmax(0, 1.45fr);
  gap: 30px;
  align-items: stretch;
}

body.hotel-detail-page .hotel-detail-location-copy {
  display: grid;
  align-content: center;
  gap: 10px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

body.hotel-detail-page .hotel-detail-location-copy strong {
  color: var(--hotel-clean-ink);
  line-height: 1.5;
}

body.hotel-detail-page .hotel-detail-location-note {
  margin: 0;
  color: var(--hotel-clean-copy);
  font-size: 0.8rem;
  line-height: 1.5;
}

body.hotel-detail-page .hotel-detail-text-link {
  width: fit-content;
  color: var(--hotel-clean-green-deep);
  font-size: 0.84rem;
  font-weight: 760;
  text-decoration: none;
}

body.hotel-detail-page .hotel-detail-text-link:hover {
  text-decoration: underline;
}

body.hotel-detail-page .hotel-detail-map-box {
  min-height: 250px;
  overflow: hidden;
  border: 0;
  border-radius: 13px;
  background:
    linear-gradient(rgba(255, 255, 255, 0.56), rgba(255, 255, 255, 0.56)),
    linear-gradient(90deg, rgba(84, 185, 72, 0.15) 1px, transparent 1px),
    linear-gradient(rgba(84, 185, 72, 0.15) 1px, transparent 1px),
    #eef6ec;
  background-size: auto, 36px 36px, 36px 36px, auto;
  box-shadow: none;
}

body.hotel-detail-page .hotel-detail-inline-map {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  min-height: 250px;
  background: #e8eee7;
}

body.hotel-detail-page .hotel-detail-inline-map.leaflet-container {
  font-family: var(--font-sans);
}

body.hotel-detail-page .hotel-detail-map-fallback {
  z-index: 2;
  place-content: end start;
  text-align: left;
}

body.hotel-detail-page .hotel-detail-map-box.is-map-ready .hotel-detail-map-fallback {
  display: none;
}

body.hotel-detail-page .hotel-detail-map-fallback-pin {
  margin: 0 0 8px;
  background: var(--hotel-clean-green);
}

body.hotel-detail-page .hotel-detail-map-overlay {
  z-index: 500;
  top: 12px;
  right: 12px;
  bottom: auto;
  border-radius: 8px;
  background: var(--hotel-clean-ink);
  color: #ffffff;
  text-decoration: none;
}

body.hotel-detail-page .hotel-detail-inline-map-marker {
  border: 0;
  background: transparent;
}

body.hotel-detail-page .hotel-detail-inline-map-pin {
  position: relative;
  display: block;
  width: 38px;
  height: 38px;
  margin: 2px;
  transform: rotate(-45deg);
  border: 3px solid #ffffff;
  border-radius: 50% 50% 50% 0;
  background: var(--hotel-clean-green-deep);
  box-shadow: 0 7px 18px rgba(17, 24, 39, 0.32);
}

body.hotel-detail-page .hotel-detail-inline-map-pin > span {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 11px;
  height: 11px;
  transform: translate(-50%, -50%);
  border-radius: 999px;
  background: #ffffff;
}

body.hotel-detail-page .hotel-detail-sidebar {
  position: sticky;
  top: 24px;
}

body.hotel-detail-page .hotel-detail-summary-card {
  display: grid;
  gap: 17px;
  padding: 23px;
  border: 0;
  border-radius: 13px;
  background: var(--hotel-clean-green-pale);
  box-shadow: none;
}

body.hotel-detail-page .hotel-detail-summary-card h3,
body.hotel-detail-page .hotel-detail-summary-card > p {
  margin: 0;
}

body.hotel-detail-page .hotel-detail-summary-card h3 {
  color: var(--hotel-clean-ink);
  font-family: var(--font-sans);
  font-size: 1rem;
  line-height: 1.35;
}

body.hotel-detail-page .hotel-detail-summary-card > p:not(.eyebrow) {
  color: var(--hotel-clean-copy);
  font-size: 0.78rem;
  line-height: 1.5;
}

body.hotel-detail-page .hotel-detail-total-block {
  display: grid;
  gap: 5px;
  padding: 17px 0;
  border: 0;
  border-top: 1px solid #dbe9d7;
  border-bottom: 1px solid #dbe9d7;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.hotel-detail-page .hotel-detail-total-block strong {
  color: var(--hotel-clean-ink);
  font-size: 1.8rem;
  font-weight: 820;
}

body.hotel-detail-page .hotel-detail-total-block p {
  margin: 3px 0 0;
  color: var(--hotel-clean-copy);
  font-size: 0.75rem;
  line-height: 1.45;
}

body.hotel-detail-page .hotel-detail-booking-grid {
  display: grid;
  gap: 13px;
}

body.hotel-detail-page .hotel-detail-booking-grid .hotel-detail-info-item {
  display: grid;
  gap: 3px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

body.hotel-detail-page .hotel-detail-booking-grid strong {
  color: #2d342f;
  font-size: 0.82rem;
}

body.hotel-detail-page .hotel-detail-booking-grid small {
  color: var(--hotel-clean-copy);
  font-size: 0.72rem;
}

body.hotel-detail-page .hotel-detail-sidebar-actions {
  display: grid;
  gap: 12px;
}

body.hotel-detail-page .hotel-detail-sidebar-actions .hotel-detail-text-link {
  justify-self: center;
}

body.hotel-detail-page .button {
  min-height: 44px;
  border-radius: 9px;
  box-shadow: none;
}

body.hotel-detail-page .button.button-primary {
  border: 1px solid var(--hotel-clean-green);
  background: var(--hotel-clean-green);
  color: #ffffff;
}

body.hotel-detail-page .button.button-primary:hover {
  border-color: var(--hotel-clean-green-deep);
  background: var(--hotel-clean-green-deep);
}

body.hotel-detail-page .hotel-detail-rooms-section {
  display: grid;
  gap: 12px;
  scroll-margin-top: 20px;
  padding: 45px 0 0;
  border: 0;
  border-top: 1px solid #e6e9e6;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.hotel-detail-page .hotel-detail-discovery {
  display: grid;
  gap: 24px;
  margin-top: 12px;
  padding: 34px;
  overflow: hidden;
  border-radius: 18px;
  background:
    radial-gradient(circle at 92% 8%, rgba(84, 185, 72, 0.18), transparent 30%),
    #f3f7f1;
}

body.hotel-detail-page .hotel-detail-discovery-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 30px;
}

body.hotel-detail-page .hotel-detail-discovery-head h2 {
  margin: 3px 0 0;
  color: var(--hotel-clean-ink);
  font-family: var(--font-sans);
  font-size: clamp(1.7rem, 3vw, 2.45rem);
  font-weight: 820;
  letter-spacing: -0.045em;
}

body.hotel-detail-page .hotel-detail-discovery-head > p {
  max-width: 440px;
  margin: 0;
  color: var(--hotel-clean-copy);
  font-size: 0.86rem;
  line-height: 1.55;
  text-align: right;
}

body.hotel-detail-page .hotel-detail-discovery-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

body.hotel-detail-page .hotel-detail-discovery-card {
  display: grid;
  grid-template-rows: auto auto auto 1fr auto;
  align-content: start;
  gap: 9px;
  min-width: 0;
  min-height: 238px;
  padding: 23px;
  border: 1px solid rgba(17, 17, 17, 0.08);
  border-radius: 14px;
  background: #ffffff;
  color: var(--hotel-clean-ink);
  text-decoration: none;
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

body.hotel-detail-page .hotel-detail-discovery-card:hover {
  transform: translateY(-3px);
  border-color: rgba(84, 185, 72, 0.42);
  box-shadow: 0 16px 34px rgba(17, 17, 17, 0.09);
}

body.hotel-detail-page .hotel-detail-discovery-card:focus-visible {
  outline: 3px solid rgba(84, 185, 72, 0.5);
  outline-offset: 3px;
}

body.hotel-detail-page .hotel-detail-discovery-icon {
  display: inline-grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: var(--hotel-clean-green-pale);
  color: var(--hotel-clean-green-deep);
  font-size: 1rem;
  font-weight: 900;
}

body.hotel-detail-page .hotel-detail-discovery-label {
  color: #657067;
  font-size: 0.67rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

body.hotel-detail-page .hotel-detail-discovery-card h3 {
  margin: 0;
  color: inherit;
  font-family: var(--font-sans);
  font-size: 1.18rem;
  line-height: 1.2;
}

body.hotel-detail-page .hotel-detail-discovery-card p {
  margin: 0;
  color: #5d675f;
  font-size: 0.8rem;
  line-height: 1.55;
}

body.hotel-detail-page .hotel-detail-discovery-card strong {
  align-self: end;
  color: var(--hotel-clean-green-deep);
  font-size: 0.79rem;
}

body.hotel-detail-page .hotel-detail-discovery-flights {
  border-color: #111111;
  background: #111111;
  color: #ffffff;
}

body.hotel-detail-page .hotel-detail-discovery-flights .hotel-detail-discovery-icon {
  background: var(--hotel-clean-green);
  color: #ffffff;
}

body.hotel-detail-page .hotel-detail-discovery-flights .hotel-detail-discovery-label,
body.hotel-detail-page .hotel-detail-discovery-flights p {
  color: #c6cec7;
}

body.hotel-detail-page .hotel-detail-discovery-flights strong {
  color: #8dde80;
}

body.hotel-detail-page .hotel-detail-discovery-map {
  background:
    linear-gradient(rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.88)),
    repeating-linear-gradient(45deg, rgba(84, 185, 72, 0.16) 0 1px, transparent 1px 18px);
}

body.hotel-detail-page .hotel-detail-rooms-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 28px;
  margin-bottom: 10px;
}

body.hotel-detail-page .hotel-detail-room-list {
  display: grid;
  gap: 0;
}

body.hotel-detail-page .hotel-room-picker-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
}

body.hotel-detail-page .hotel-room-picker-card {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr) 205px;
  align-items: stretch;
  gap: 24px;
  padding: 25px 0;
  border: 0;
  border-bottom: 1px solid #e6e9e6;
  border-radius: 0;
  background: transparent;
}

body.hotel-detail-page .hotel-room-picker-card:last-child {
  border-bottom: 0;
}

body.hotel-detail-page .hotel-room-picker-media {
  min-height: 160px;
  overflow: hidden;
  border-radius: 11px;
  background: #eef1ee;
}

body.hotel-detail-page .hotel-room-picker-image {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

body.hotel-detail-page .hotel-room-picker-copy {
  display: grid;
  align-content: start;
  gap: 8px;
  padding-top: 2px;
}

body.hotel-detail-page .hotel-room-picker-copy h3 {
  margin: 0;
  color: var(--hotel-clean-ink);
  font-family: var(--font-sans);
  font-size: 1.08rem;
  font-weight: 780;
  line-height: 1.3;
}

body.hotel-detail-page .hotel-room-feature-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 16px;
}

body.hotel-detail-page .hotel-room-feature-list span {
  position: relative;
  padding-left: 12px;
  color: #4b554e;
  font-size: 0.76rem;
}

body.hotel-detail-page .hotel-room-feature-list span::before {
  content: "";
  position: absolute;
  top: 0.48em;
  left: 0;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--hotel-clean-green);
}

body.hotel-detail-page .hotel-room-discount-badge {
  width: fit-content;
  padding: 3px 8px;
  background: var(--hotel-clean-green-pale);
  color: var(--hotel-clean-green-deep);
  font-size: 0.68rem;
}

body.hotel-detail-page .hotel-room-picker-copy small {
  color: var(--hotel-clean-copy);
  font-size: 0.73rem;
  line-height: 1.45;
}

body.hotel-detail-page .hotel-room-checkout-label.is-eligible {
  color: var(--hotel-clean-green-deep);
  font-weight: 750;
}

body.hotel-detail-page .hotel-room-picker-price {
  display: grid;
  align-content: end;
  justify-items: end;
  gap: 4px;
  text-align: right;
}

body.hotel-detail-page .hotel-room-picker-price > span,
body.hotel-detail-page .hotel-room-picker-price > small {
  color: #657067;
  font-size: 0.7rem;
}

body.hotel-detail-page .hotel-room-picker-price > .hotel-room-mandatory-charge {
  max-width: 190px;
  color: #7a4d00;
  font-weight: 750;
  line-height: 1.35;
}

body.hotel-detail-page .hotel-room-picker-price > strong {
  color: var(--hotel-clean-ink);
  font-size: 1.45rem;
  font-weight: 820;
  line-height: 1.1;
}

body.hotel-detail-page .hotel-room-picker-price > p {
  margin: 0;
  color: var(--hotel-clean-copy);
  font-size: 0.75rem;
}

body.hotel-detail-page .hotel-room-picker-button {
  min-width: 170px;
  margin-top: 9px;
}

@media (max-width: 980px) {
  body.hotel-detail-page .hotel-detail-discovery-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.hotel-detail-page .hotel-detail-discovery-map {
    grid-column: 1 / -1;
    min-height: 190px;
  }

  body.hotel-detail-page .hotel-detail-intro {
    grid-template-columns: minmax(0, 1fr) 250px;
    gap: 30px;
  }

  body.hotel-detail-page .hotel-detail-product {
    grid-template-columns: 1fr;
    gap: 38px;
  }

  body.hotel-detail-page .hotel-detail-sidebar {
    position: static;
  }

  body.hotel-detail-page .hotel-detail-summary-card {
    grid-template-columns: minmax(0, 1fr) minmax(220px, 0.7fr);
    align-items: start;
  }

  body.hotel-detail-page .hotel-detail-total-block,
  body.hotel-detail-page .hotel-detail-sidebar-actions {
    grid-column: 2;
  }

  body.hotel-detail-page .hotel-detail-booking-grid {
    grid-column: 1;
    grid-row: 2 / span 2;
  }

  body.hotel-detail-page .hotel-room-picker-card {
    grid-template-columns: 190px minmax(0, 1fr) 190px;
    gap: 18px;
  }
}

@media (max-width: 760px) {
  body.hotel-detail-page .hotel-detail-discovery {
    gap: 20px;
    padding: 22px;
    border-radius: 14px;
  }

  body.hotel-detail-page .hotel-detail-discovery-head {
    align-items: start;
    flex-direction: column;
    gap: 10px;
  }

  body.hotel-detail-page .hotel-detail-discovery-head > p {
    max-width: none;
    text-align: left;
  }

  body.hotel-detail-page .hotel-detail-discovery-grid {
    grid-template-columns: 1fr;
  }

  body.hotel-detail-page .hotel-detail-discovery-map {
    grid-column: auto;
  }

  body.hotel-detail-page .hotel-detail-discovery-card {
    min-height: 210px;
    padding: 20px;
  }

  body.hotel-detail-page .page-shell {
    width: min(100% - 24px, 1200px);
  }

  body.hotel-detail-page .hotel-detail-main-clean {
    gap: 22px;
    margin-top: 10px;
  }

  body.hotel-detail-page .hotel-detail-intro {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  body.hotel-detail-page .hotel-detail-copy h1 {
    font-size: clamp(2rem, 11vw, 3.1rem);
  }

  body.hotel-detail-page .hotel-detail-head-price-card {
    justify-items: start;
    text-align: left;
  }

  body.hotel-detail-page .hotel-detail-head-price-card p {
    max-width: none;
  }

  body.hotel-detail-page .hotel-detail-head-price-card .button {
    width: 100%;
  }

  body.hotel-detail-page .hotel-gallery-stage-detail,
  body.hotel-detail-page .hotel-detail-gallery-hero,
  body.hotel-detail-page .hotel-gallery-empty,
  body.hotel-detail-page .hotel-gallery-empty .stay-media-placeholder {
    height: 320px !important;
    min-height: 320px !important;
    max-height: 320px !important;
    border-radius: 11px;
  }

  body.hotel-detail-page .hotel-detail-jump-nav {
    gap: 21px;
  }

  body.hotel-detail-page .hotel-detail-highlight-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px 16px;
    padding: 18px;
  }

  body.hotel-detail-page .hotel-detail-section-head-row {
    grid-template-columns: 1fr;
    align-items: start;
  }

  body.hotel-detail-page .hotel-detail-section-head-row > p,
  body.hotel-detail-page .hotel-detail-rooms-head > p {
    text-align: left;
  }

  body.hotel-detail-page .hotel-detail-key-list,
  body.hotel-detail-page .hotel-detail-amenities,
  body.hotel-detail-page .hotel-detail-location-grid {
    grid-template-columns: 1fr;
  }

  body.hotel-detail-page .hotel-detail-summary-card {
    grid-template-columns: 1fr;
  }

  body.hotel-detail-page .hotel-detail-total-block,
  body.hotel-detail-page .hotel-detail-sidebar-actions,
  body.hotel-detail-page .hotel-detail-booking-grid {
    grid-column: auto;
    grid-row: auto;
  }

  body.hotel-detail-page .hotel-detail-rooms-head {
    align-items: flex-start;
    flex-direction: column;
  }

  body.hotel-detail-page .hotel-room-picker-card {
    grid-template-columns: 1fr;
    gap: 15px;
    padding: 22px 0;
  }

  body.hotel-detail-page .hotel-room-picker-media {
    min-height: 220px;
    height: 220px;
  }

  body.hotel-detail-page .hotel-room-picker-price {
    justify-items: start;
    text-align: left;
  }

  body.hotel-detail-page .hotel-room-picker-button {
    width: 100%;
  }
}

@media (max-width: 480px) {
  body.hotel-detail-page .hotel-detail-highlight-grid {
    grid-template-columns: 1fr;
  }

  body.hotel-detail-page .hotel-gallery-stage-detail,
  body.hotel-detail-page .hotel-detail-gallery-hero,
  body.hotel-detail-page .hotel-gallery-empty,
  body.hotel-detail-page .hotel-gallery-empty .stay-media-placeholder {
    height: 270px !important;
    min-height: 270px !important;
    max-height: 270px !important;
  }

  body.hotel-detail-page .hotel-detail-product {
    margin-top: 0;
    border-radius: 0;
  }
}

/* Instacart-style skeleton prototype for hotel detail loading */
@keyframes hotel-detail-skeleton-shimmer {
  0% {
    background-position: 180% 0;
  }

  100% {
    background-position: -80% 0;
  }
}

body.hotel-detail-page .is-detail-loading :is(
  .hotel-detail-skeleton-media,
  .hotel-detail-skeleton-line,
  .hotel-detail-skeleton-pill,
  .hotel-detail-skeleton-fact,
  .hotel-detail-skeleton-paragraph,
  .hotel-detail-skeleton-row,
  .hotel-detail-skeleton-amenity,
  .hotel-detail-skeleton-booking,
  .hotel-detail-skeleton-room-media,
  .hotel-detail-skeleton-room-copy,
  .hotel-detail-skeleton-room-price,
  #hotel-detail-choose-button,
  .hotel-detail-sidebar-actions .button
) {
  color: transparent !important;
  border-color: transparent !important;
  background: linear-gradient(90deg, #e5e8e5 24%, #f2f4f2 42%, #e5e8e5 62%) !important;
  background-size: 240% 100% !important;
  box-shadow: none !important;
  animation: hotel-detail-skeleton-shimmer 1.25s ease-in-out infinite;
  pointer-events: none;
  user-select: none;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-media {
  min-height: 440px;
  border-radius: 15px;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-media .stay-media-placeholder {
  color: transparent;
  background: transparent;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-line {
  display: block;
  overflow: hidden;
  border-radius: 999px;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-title {
  width: min(72%, 620px);
  min-height: clamp(44px, 6vw, 68px);
}

body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-location {
  width: min(46%, 360px);
  min-height: 18px;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-summary {
  width: min(84%, 650px);
  min-height: 42px;
  border-radius: 14px;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-pill {
  width: 112px;
  height: 17px;
  display: block;
  border-radius: 999px;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-pill:nth-child(2) {
  width: 84px;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-pill:nth-child(3) {
  width: 96px;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-price-label {
  width: 92px;
  min-height: 12px;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-price {
  width: 190px;
  min-height: 42px;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-price-note {
  width: 240px;
  max-width: 100%;
  min-height: 34px;
  border-radius: 12px;
}

body.hotel-detail-page .is-detail-loading #hotel-detail-choose-button {
  width: 210px;
  min-height: 46px;
  border-radius: 9px;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-fact {
  width: 100%;
  min-height: 54px;
  display: block;
  border-radius: 9px;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-paragraph {
  width: min(100%, 720px);
  min-height: 82px;
  border-radius: 14px;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-row {
  width: 100%;
  min-height: 62px;
  display: block;
  margin: 7px 0;
  border-radius: 10px;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-count,
body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-map-meta,
body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-rooms-copy {
  width: 220px;
  max-width: 100%;
  min-height: 18px;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-amenity {
  width: min(100%, 180px);
  height: 22px;
  display: block;
  border-radius: 999px;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-address {
  width: 90%;
  min-height: 46px;
  border-radius: 12px;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-map-box {
  background: linear-gradient(90deg, #e5e8e5 24%, #f2f4f2 42%, #e5e8e5 62%) !important;
  background-size: 240% 100% !important;
  animation: hotel-detail-skeleton-shimmer 1.25s ease-in-out infinite;
  pointer-events: none;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-map-box > * {
  visibility: hidden;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-sidebar-title {
  width: 78%;
  min-height: 20px;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-sidebar-meta {
  width: 94%;
  min-height: 36px;
  border-radius: 12px;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-total {
  width: 72%;
  min-height: 34px;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-total-note {
  width: 100%;
  min-height: 42px;
  border-radius: 12px;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-booking {
  width: 100%;
  height: 42px;
  display: block;
  border-radius: 9px;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-sidebar-actions .button {
  min-height: 44px;
  border-radius: 9px;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-sidebar-actions .hotel-detail-text-link,
body.hotel-detail-page .is-detail-loading .hotel-detail-location-copy .hotel-detail-text-link {
  visibility: hidden;
}

body.hotel-detail-page .hotel-room-picker-card-skeleton {
  min-height: 210px;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-room-media {
  width: 100%;
  min-height: 160px;
  display: block;
  border-radius: 11px;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-room-copy {
  width: 82%;
  min-height: 112px;
  display: block;
  align-self: center;
  border-radius: 12px;
}

body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-room-price {
  width: 100%;
  min-height: 120px;
  display: block;
  align-self: end;
  border-radius: 12px;
}

@media (max-width: 760px) {
  body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-media {
    min-height: 320px;
  }

  body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-title {
    width: 88%;
    min-height: 48px;
  }

  body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-location {
    width: 70%;
  }

  body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-summary {
    width: 100%;
  }

  body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-price,
  body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-price-note,
  body.hotel-detail-page .is-detail-loading #hotel-detail-choose-button {
    width: 100%;
  }

  body.hotel-detail-page .hotel-room-picker-card-skeleton {
    min-height: 420px;
  }

  body.hotel-detail-page .is-detail-loading .hotel-detail-skeleton-room-media {
    min-height: 220px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.hotel-detail-page .is-detail-loading :is(
    .hotel-detail-skeleton-media,
    .hotel-detail-skeleton-line,
    .hotel-detail-skeleton-pill,
    .hotel-detail-skeleton-fact,
    .hotel-detail-skeleton-paragraph,
    .hotel-detail-skeleton-row,
    .hotel-detail-skeleton-amenity,
    .hotel-detail-skeleton-booking,
    .hotel-detail-skeleton-room-media,
    .hotel-detail-skeleton-room-copy,
    .hotel-detail-skeleton-room-price,
    #hotel-detail-choose-button,
    .hotel-detail-sidebar-actions .button,
    .hotel-detail-map-box
  ) {
    animation: none;
  }
}

/* Mobile cart: single readable flow with no fixed or overlapping actions */
body.cart-page [hidden] {
  display: none !important;
}

@media (max-width: 720px) {
  html:has(body.cart-page) {
    overflow-x: hidden;
  }

  body.cart-page {
    background: #f3f6f1;
  }

  body.cart-page .page-shell {
    width: 100% !important;
    padding: 0 0 calc(52px + env(safe-area-inset-bottom));
  }

  body.cart-page .cart-main {
    display: grid;
    gap: 18px;
    width: 100%;
    margin-top: 14px;
    padding: 0 14px;
  }

  body.cart-page .booking-progress {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    width: 100%;
    margin: 0;
    padding: 11px 10px 10px;
    overflow: hidden;
    border: 0;
    border-radius: 15px;
    background: #eaf4e6;
    box-shadow: none;
  }

  body.cart-page .booking-progress-heading {
    display: flex;
    justify-content: flex-start;
    padding: 0 3px;
    border: 0;
  }

  body.cart-page .booking-progress-heading span {
    display: none;
  }

  body.cart-page .booking-progress-heading strong {
    color: #2d752f;
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }

  body.cart-page .booking-progress ol {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    width: 100%;
    margin: 0;
    padding: 0;
  }

  body.cart-page .booking-progress li {
    position: relative;
    display: grid;
    justify-items: center;
    align-content: start;
    gap: 5px;
    min-width: 0;
    padding: 0 2px;
    text-align: center;
  }

  body.cart-page .booking-progress-step {
    gap: 5px;
  }

  body.cart-page .booking-progress li:not(:last-child)::after {
    top: 12px;
    left: calc(50% + 13px);
    right: calc(-50% + 13px);
    width: auto;
    transform: none;
  }

  body.cart-page .booking-progress-marker {
    z-index: 1;
    width: 25px;
    height: 25px;
    flex-basis: 25px;
    font-size: 0.67rem;
  }

  body.cart-page .booking-progress-label {
    width: 100%;
    max-width: 70px;
    padding: 0;
    overflow-wrap: anywhere;
    color: #5f6a60;
    font-size: 0.58rem;
    line-height: 1.18;
    white-space: normal;
  }

  body.cart-page .booking-progress .is-current .booking-progress-label {
    color: #17291c;
    font-weight: 900;
  }

  body.cart-page .cart-hero {
    display: grid;
    gap: 8px;
    padding: 7px 2px 2px;
  }

  body.cart-page .cart-hero h1 {
    margin: 3px 0 0;
    font-size: clamp(2.1rem, 11vw, 3rem);
    letter-spacing: -0.06em;
    line-height: 0.98;
  }

  body.cart-page .cart-hero .hero-text {
    max-width: 32rem;
    margin: 0;
    color: #626c63;
    font-size: 0.85rem;
    line-height: 1.5;
  }

  body.cart-page #cart-state {
    width: 100%;
    margin: 0;
    border-radius: 14px;
    font-size: 0.82rem;
  }

  body.cart-page .cart-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
    width: 100%;
    min-width: 0;
    margin: 0;
  }

  body.cart-page .cart-items-panel {
    display: grid;
    gap: 12px;
    min-width: 0;
    padding: 0;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  body.cart-page .cart-section-heading {
    min-width: 0;
    padding: 0 3px 2px;
    border: 0;
  }

  body.cart-page .cart-section-heading h2 {
    font-size: 1.05rem;
  }

  body.cart-page .cart-section-heading span {
    flex: 0 0 auto;
    padding: 5px 9px;
    border-radius: 999px;
    background: #e7efe4;
    color: #46604a;
    font-size: 0.68rem;
  }

  body.cart-page .cart-product-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    width: 100%;
    min-width: 0;
    margin: 0;
    padding: 0;
    overflow: hidden;
    border: 0;
    border-radius: 20px;
    background: #ffffff;
    box-shadow: 0 8px 24px rgba(24, 50, 34, 0.07);
  }

  body.cart-page .cart-product-card > .cart-item-media {
    display: flex;
    width: 100%;
    height: auto;
    min-height: 0;
    max-height: none;
    aspect-ratio: 16 / 10;
    margin: 0;
    overflow: hidden;
    border-radius: 0;
    background: #e4ebe2;
  }

  body.cart-page .cart-item-media img,
  body.cart-page .cart-item-media .stay-media-placeholder {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 0;
    object-fit: cover;
  }

  body.cart-page .cart-item-copy {
    display: grid;
    gap: 15px;
    min-width: 0;
    padding: 18px 16px 16px;
  }

  body.cart-page .cart-product-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
    min-width: 0;
  }

  body.cart-page .cart-product-heading > div {
    min-width: 0;
  }

  body.cart-page .cart-product-heading h2 {
    max-width: 100%;
    margin: 2px 0 0;
    overflow-wrap: anywhere;
    color: #111411;
    font-size: clamp(1.45rem, 7vw, 1.9rem);
    line-height: 1.12;
  }

  body.cart-page .cart-product-heading .hotel-location-line {
    max-width: 100%;
    overflow-wrap: anywhere;
    font-size: 0.82rem;
    line-height: 1.4;
  }

  body.cart-page .cart-remove-button {
    justify-self: start;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 92px;
    min-height: 42px;
    padding: 9px 14px;
    border: 1px solid #ebdeda;
    border-radius: 10px;
    background: #fff8f6;
    color: #804b43;
    text-decoration: none;
  }

  body.cart-page .cart-stay-facts {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    width: 100%;
    min-width: 0;
    margin: 0;
    overflow: visible;
    border: 0;
    border-top: 1px solid #e8ebe7;
    border-bottom: 1px solid #e8ebe7;
    border-radius: 0;
    background: transparent;
  }

  body.cart-page .cart-stay-facts > div,
  body.cart-page .cart-stay-facts > div:first-child {
    display: grid;
    grid-column: auto;
    gap: 3px;
    min-width: 0;
    padding: 12px 0;
    border: 0;
    background: transparent;
  }

  body.cart-page .cart-stay-facts > div + div {
    border-top: 1px solid #edf0ec;
  }

  body.cart-page .cart-stay-facts dt {
    color: #758076;
    font-size: 0.65rem;
    font-weight: 850;
    letter-spacing: 0.07em;
    text-transform: uppercase;
  }

  body.cart-page .cart-stay-facts dd {
    max-width: 100%;
    overflow-wrap: anywhere;
    color: #232923;
    font-size: 0.86rem;
    line-height: 1.4;
  }

  body.cart-page .cart-product-footer {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: 12px;
    min-width: 0;
  }

  body.cart-page .cart-product-price {
    min-width: 0;
  }

  body.cart-page .cart-product-price strong {
    max-width: 100%;
    overflow-wrap: anywhere;
    font-size: 1.55rem;
    line-height: 1.1;
  }

  body.cart-page .cart-edit-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 46px;
    padding: 10px 14px;
    border: 1px solid #dfe5dc;
    border-radius: 11px;
    background: #f7f9f6;
    color: #2e6f31;
    text-decoration: none;
  }

  body.cart-page .cart-item-status {
    width: 100%;
    min-width: 0;
    padding: 12px;
    overflow-wrap: anywhere;
    border-radius: 11px;
    font-size: 0.77rem;
    line-height: 1.45;
  }

  body.cart-page .cart-flight-product {
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 10px 12px;
    align-items: center;
    padding: 16px;
    border-radius: 18px;
    background: #ffffff;
  }

  body.cart-page .cart-flight-icon {
    width: 46px;
    height: 46px;
  }

  body.cart-page .cart-flight-copy {
    min-width: 0;
  }

  body.cart-page .cart-flight-copy h2,
  body.cart-page .cart-flight-copy p {
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  body.cart-page .cart-flight-price {
    grid-column: 1 / -1;
    padding-top: 12px;
    border-top: 1px solid #e8ebe7;
    font-size: 1.25rem;
    text-align: right;
  }

  body.cart-page .cart-summary-card {
    position: static;
    top: auto;
    display: grid;
    gap: 17px;
    width: 100%;
    min-width: 0;
    margin: 0;
    padding: 20px 16px;
    overflow: visible;
    border: 0;
    border-radius: 20px;
    background: #ffffff;
    box-shadow: 0 8px 24px rgba(24, 50, 34, 0.07);
  }

  body.cart-page .cart-summary-card > .eyebrow {
    margin-bottom: -4px;
  }

  body.cart-page .cart-readiness {
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 11px;
    width: 100%;
    min-width: 0;
  }

  body.cart-page .cart-readiness-icon {
    width: 36px;
    height: 36px;
  }

  body.cart-page .cart-readiness > div {
    min-width: 0;
  }

  body.cart-page .cart-readiness h2 {
    max-width: 100%;
    overflow-wrap: anywhere;
    font-size: 1.25rem;
  }

  body.cart-page .cart-readiness p {
    max-width: 100%;
    overflow-wrap: anywhere;
    font-size: 0.8rem;
  }

  body.cart-page .cart-summary-total {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 4px;
    width: 100%;
    min-width: 0;
    padding: 15px 0;
  }

  body.cart-page .cart-summary-total > span,
  body.cart-page .cart-summary-total > strong,
  body.cart-page .cart-summary-total > small {
    grid-column: 1;
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  body.cart-page .cart-summary-total > strong {
    font-size: clamp(1.7rem, 9vw, 2.2rem);
    line-height: 1.05;
  }

  body.cart-page .cart-summary-total > small {
    margin-top: 3px;
    line-height: 1.4;
  }

  body.cart-page .cart-summary-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 9px;
    width: 100%;
    min-width: 0;
  }

  body.cart-page .cart-summary-actions .button,
  body.cart-page .cart-summary-actions .cart-back-link {
    position: static;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 100%;
    min-height: 52px;
    margin: 0;
    padding: 12px 14px;
    overflow-wrap: anywhere;
    border-radius: 12px;
    text-align: center;
    line-height: 1.25;
    transform: none;
  }

  body.cart-page .cart-summary-actions .button-primary {
    background: #54b948;
    color: #102010;
    box-shadow: 0 8px 18px rgba(59, 143, 51, 0.18);
  }

  body.cart-page .cart-summary-actions .button-secondary {
    border: 1px solid #dce2da;
    background: #f5f7f4;
    color: #273228;
  }

  body.cart-page .cart-summary-actions .cart-back-link {
    min-height: 44px;
    padding-top: 10px;
    color: #516052;
    font-size: 0.78rem;
  }

  body.cart-page .cart-security-note {
    justify-content: flex-start;
    width: 100%;
    margin: 0;
    padding-top: 2px;
    color: #69736a;
    font-size: 0.7rem;
    line-height: 1.35;
  }

  body.cart-page .cart-empty-card {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 34px 20px;
    border: 0;
    border-radius: 20px;
    box-shadow: 0 8px 24px rgba(24, 50, 34, 0.07);
  }

  body.cart-page .cart-empty-card .cart-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
  }

  body.cart-page .cart-empty-card .button {
    width: 100%;
    min-height: 50px;
  }

  body.cart-page .site-footer {
    margin: 34px 14px 0;
  }
}

@media (max-width: 390px) {
  body.cart-page .cart-main {
    padding-inline: 10px;
  }

  body.cart-page .cart-item-copy,
  body.cart-page .cart-summary-card {
    padding-right: 14px;
    padding-left: 14px;
  }

  body.cart-page .booking-progress-label {
    font-size: 0.54rem;
  }
}

/* Shared monochrome footer */
.site-footer {
  display: block;
  margin-top: clamp(54px, 8vw, 104px);
  margin-left: calc(50% - (var(--viewport-width, 100vw) / 2));
  margin-right: calc(50% - (var(--viewport-width, 100vw) / 2));
  padding: clamp(54px, 7vw, 86px) 0 30px;
  border: 0;
  border-radius: 0;
  background: #080808;
  color: #ffffff;
  box-shadow: none;
}

.footer-shell {
  width: min(1320px, calc(100% - 48px));
  margin: 0 auto;
}

.footer-lead {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
  gap: clamp(34px, 7vw, 110px);
  align-items: end;
  padding-bottom: clamp(44px, 6vw, 72px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.footer-brand-block {
  display: grid;
  gap: 16px;
  max-width: 820px;
}

.footer-brand-block .footer-wordmark {
  width: fit-content;
  color: #ffffff;
}

.footer-wordmark .wordmark-logo-frame {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 8px 12px;
  border-radius: 10px;
  background: #ffffff;
}

.footer-wordmark .wordmark-logo {
  width: auto;
  height: 32px;
  filter: grayscale(1) brightness(0);
}

.footer-brand-tag {
  margin: 6px 0 0;
  color: rgba(255, 255, 255, 0.58) !important;
  font-size: 0.7rem;
  font-weight: 760;
  letter-spacing: 0.19em;
  line-height: 1.2;
  text-transform: uppercase;
}

.footer-brand-block h2 {
  max-width: 780px;
  margin: 0;
  color: #ffffff;
  font-family: var(--font-sans);
  font-size: clamp(2.2rem, 4.7vw, 4.85rem);
  font-weight: 650;
  letter-spacing: -0.055em;
  line-height: 0.98;
}

.footer-note {
  max-width: 660px;
  margin: 2px 0 0;
  color: rgba(255, 255, 255, 0.64) !important;
  font-size: clamp(0.94rem, 1.4vw, 1.08rem);
  line-height: 1.7;
}

.footer-lead-actions {
  display: grid;
  gap: 12px;
  width: 100%;
}

.footer-action {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 58px;
  padding: 0 19px;
  border: 1px solid #ffffff;
  border-radius: 10px;
  color: #ffffff;
  font-size: 0.93rem;
  font-weight: 740;
  text-decoration: none;
  transition: background-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.footer-action span {
  font-size: 1.12rem;
}

.footer-action-primary {
  background: #ffffff;
  color: #080808;
}

.footer-action-secondary {
  background: transparent;
}

.footer-action:hover {
  transform: translateY(-2px);
}

.footer-action-primary:hover {
  background: #dddddd;
}

.footer-action-secondary:hover {
  background: #ffffff;
  color: #080808;
}

.footer-main {
  display: grid;
  grid-template-columns: minmax(245px, 0.72fr) minmax(0, 1.28fr);
  gap: clamp(46px, 8vw, 120px);
  align-items: start;
  width: 100%;
  margin: 0;
  padding: clamp(42px, 6vw, 72px) 0;
}

.footer-support-card {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 17px;
  padding: 24px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 12px;
  background: #111111;
}

.footer-support-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 999px;
  background: #ffffff;
  color: #080808;
}

.footer-support-icon svg {
  width: 22px;
  height: 22px;
}

.footer-support-card h3,
.footer-support-card p {
  margin: 0;
}

.footer-support-card h3 {
  margin-top: 5px;
  color: #ffffff;
  font-family: var(--font-sans);
  font-size: 1.17rem;
  line-height: 1.3;
}

.footer-support-card p:not(.footer-support-label) {
  margin-top: 10px;
  color: rgba(255, 255, 255, 0.58);
  font-size: 0.82rem;
  line-height: 1.6;
}

.footer-support-label {
  color: rgba(255, 255, 255, 0.5);
  font-size: 0.65rem;
  font-weight: 750;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.footer-support-card a {
  display: inline-flex;
  gap: 8px;
  margin-top: 17px;
  color: #ffffff;
  font-size: 0.83rem;
  font-weight: 720;
  overflow-wrap: anywhere;
  text-decoration: none;
}

.footer-support-card a:hover {
  text-decoration: underline;
}

.footer-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 28px;
}

.footer-column {
  display: grid;
  align-content: start;
  gap: 13px;
}

.footer-heading {
  margin: 0 0 8px;
  color: #ffffff !important;
  font-size: 0.67rem;
  font-weight: 780;
  letter-spacing: 0.16em;
  line-height: 1.2;
  text-transform: uppercase;
}

.footer-column a {
  width: fit-content;
  color: rgba(255, 255, 255, 0.62);
  font-size: 0.83rem;
  font-weight: 520;
  line-height: 1.45;
  text-decoration: none;
  transition: color 150ms ease, transform 150ms ease;
}

.footer-column a:hover,
body.home-page .footer-column a:hover {
  color: #ffffff;
  transform: translateX(2px);
}

.footer-trust-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.footer-trust-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 16px;
  min-height: 124px;
  padding: 27px clamp(20px, 3vw, 38px);
  align-items: start;
}

.footer-trust-item:first-child {
  padding-left: 0;
}

.footer-trust-item + .footer-trust-item {
  border-left: 1px solid rgba(255, 255, 255, 0.2);
}

.footer-trust-number {
  color: rgba(255, 255, 255, 0.4);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.1em;
}

.footer-trust-item strong {
  display: block;
  color: #ffffff;
  font-size: 0.91rem;
  line-height: 1.3;
}

.footer-trust-item p {
  margin: 7px 0 0;
  color: rgba(255, 255, 255, 0.54);
  font-size: 0.76rem;
  line-height: 1.55;
}

.footer-legal-row {
  display: flex;
  justify-content: space-between;
  gap: 22px;
  width: 100%;
  margin: 0;
  padding: 27px 0 0;
  border: 0;
  color: rgba(255, 255, 255, 0.42) !important;
  font-size: 0.7rem;
  line-height: 1.5;
}

.footer-legal-links {
  display: flex;
  gap: 20px;
  align-items: center;
  flex-wrap: wrap;
}

.footer-legal-links a {
  color: rgba(255, 255, 255, 0.56);
  text-decoration: none;
}

.footer-legal-links a:hover {
  color: #ffffff;
}

body.home-page .site-footer {
  border: 0;
  background: #080808;
}

body.cart-page .site-footer {
  margin-top: clamp(54px, 8vw, 104px);
  margin-left: calc(50% - (var(--viewport-width, 100vw) / 2));
  margin-right: calc(50% - (var(--viewport-width, 100vw) / 2));
}

@media (max-width: 980px) {
  .footer-lead,
  .footer-main {
    grid-template-columns: 1fr;
  }

  .footer-lead-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 620px;
  }

  .footer-main {
    gap: 44px;
  }

  .footer-support-card {
    max-width: 560px;
  }
}

@media (max-width: 700px) {
  .site-footer {
    padding-top: 48px;
  }

  .footer-shell {
    width: min(100% - 30px, 1320px);
  }

  .footer-lead {
    gap: 30px;
    padding-bottom: 42px;
  }

  .footer-brand-block h2 {
    font-size: clamp(2.25rem, 11vw, 3.35rem);
  }

  .footer-lead-actions {
    grid-template-columns: 1fr;
  }

  .footer-main {
    padding: 42px 0;
  }

  .footer-support-card {
    grid-template-columns: 1fr;
    padding: 21px;
  }

  .footer-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    row-gap: 38px;
  }

  .footer-trust-row {
    grid-template-columns: 1fr;
  }

  .footer-trust-item,
  .footer-trust-item:first-child {
    min-height: 0;
    padding: 23px 0;
  }

  .footer-trust-item + .footer-trust-item {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    border-left: 0;
  }

  .footer-legal-row,
  .footer-legal-links {
    align-items: flex-start;
  }

  .footer-legal-row {
    flex-direction: column;
  }

  body.mobile-dock-page .site-footer {
    padding-bottom: 126px;
  }

  body.hotel-detail-page .site-footer {
    padding-bottom: 156px;
  }
}

/* Login is intentionally a standalone account screen. */
body.auth-page .site-header {
  justify-content: center;
  border-bottom: 0;
}

body.auth-page .site-header > .site-nav,
body.auth-page .site-header > .header-actions {
  display: none;
}

body.auth-page .auth-main {
  min-height: calc(100svh - 94px);
  padding-top: clamp(18px, 4vh, 38px);
  padding-bottom: clamp(28px, 5vh, 48px);
}

body.auth-page .auth-layout {
  width: min(470px, 100%);
}

body.auth-page .auth-card {
  padding: clamp(28px, 5vw, 42px);
}

.auth-recovery-link {
  justify-self: center;
  padding: 2px 6px;
  border: 0;
  background: transparent;
  color: #27682a;
  font: inherit;
  font-size: 0.8rem;
  font-weight: 800;
  cursor: pointer;
}

.auth-recovery-link:hover,
.auth-recovery-link:focus-visible,
.auth-policy-links a:hover,
.auth-legal-consent a:hover {
  text-decoration: underline;
}

.auth-legal-consent {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  padding: 12px;
  border: 1px solid #d8ded7;
  border-radius: 10px;
  background: #f7f9f6;
  color: #465049;
  font-size: 0.75rem;
  line-height: 1.5;
}

.auth-legal-consent[hidden],
.auth-recovery-link[hidden] {
  display: none;
}

.auth-legal-consent input {
  width: 18px;
  height: 18px;
  margin: 1px 0 0;
  accent-color: #267b31;
}

.auth-legal-consent a,
.auth-policy-links a {
  color: #1f692a;
  font-weight: 800;
}

.auth-policy-links {
  margin: 0;
  text-align: center;
  color: #737b75;
  font-size: 0.7rem;
}

.legal-page .legal-layout {
  align-items: start;
}

.legal-page .legal-aside {
  position: sticky;
  top: 96px;
}

.legal-page .info-card code {
  padding: 0.1em 0.35em;
  border-radius: 4px;
  background: #edf2ec;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.88em;
}

@media (max-width: 820px) {
  .legal-page .legal-aside {
    position: static;
  }
}

/* Clear account workspace */
body.account-page {
  background: #f7f8f6;
}

body.account-page .account-main {
  display: block;
  width: min(1180px, 100%);
  padding-top: clamp(30px, 5vw, 58px);
  padding-bottom: clamp(56px, 8vw, 96px);
}

.account-workspace {
  display: grid;
  grid-template-columns: 248px minmax(0, 1fr);
  gap: clamp(30px, 5vw, 62px);
  align-items: start;
}

.account-sidebar {
  position: sticky;
  top: 104px;
  overflow: hidden;
  border: 1px solid #dfe4dd;
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 12px 32px rgba(20, 37, 23, 0.05);
}

.account-sidebar-brand {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 20px;
  border-bottom: 1px solid #e7eae5;
}

.account-sidebar-mark,
.account-gate-icon {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: #267b31;
  color: #ffffff;
  font-size: 1rem;
  font-weight: 850;
}

.account-sidebar-brand > div {
  display: grid;
  gap: 2px;
}

.account-sidebar-brand strong {
  color: #171a17;
  font-size: 0.93rem;
}

.account-sidebar-brand > div > span {
  color: #7a827a;
  font-size: 0.72rem;
}

.account-page-nav {
  display: grid;
  gap: 18px;
  width: auto;
  padding: 18px 12px 20px;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: #ffffff;
}

.account-nav-group {
  display: grid;
  gap: 4px;
}

.account-nav-group > p {
  margin: 0;
  padding: 0 10px 5px;
  color: #8a918a;
  font-size: 0.64rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.account-page-nav .account-nav-group a {
  display: flex;
  justify-content: space-between;
  min-height: 42px;
  padding: 10px 11px;
  border-radius: 9px;
  color: #555d55;
  font-size: 0.77rem;
  font-weight: 700;
  text-align: left;
  white-space: normal;
}

.account-page-nav .account-nav-group a:hover {
  color: #185f24;
  background: #f0f8ee;
}

.account-page-nav .account-nav-group a.is-active {
  color: #185f24;
  background: #e8f5e5;
  box-shadow: inset 3px 0 0 #54b948;
}

.account-nav-arrow {
  color: #9ba29b;
  font-size: 1rem;
  line-height: 1;
}

.account-page-nav a.is-active .account-nav-arrow {
  color: #267b31;
}

.account-content {
  display: grid;
  min-width: 0;
}

.account-page-heading {
  padding: 5px 0 28px;
  border-bottom: 1px solid #dfe4dd;
}

.account-page-heading h1 {
  font-size: clamp(2.15rem, 4.5vw, 3.7rem);
  letter-spacing: -0.05em;
  line-height: 1;
}

.account-page-heading .hero-text {
  max-width: 610px;
  font-size: 0.9rem;
}

.account-gate {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  margin-top: 26px;
  padding: clamp(22px, 3.5vw, 32px);
  border: 1px solid #dce2da;
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 14px 38px rgba(20, 37, 23, 0.05);
}

.account-gate[hidden] {
  display: none;
}

.account-gate-icon {
  width: 48px;
  height: 48px;
  border-radius: 15px;
  background: #e8f5e5;
  color: #267b31;
  font-size: 1.1rem;
}

.account-gate-copy {
  display: grid;
  gap: 5px;
}

.account-gate-copy h2,
.account-gate-copy p {
  margin: 0;
}

.account-gate-copy h2 {
  color: #161a16;
  font-size: clamp(1.25rem, 2.3vw, 1.75rem);
  letter-spacing: -0.025em;
}

.account-gate-copy > p:not(.eyebrow) {
  color: #687068;
  font-size: 0.79rem;
  line-height: 1.55;
}

.account-gate-actions {
  display: flex;
  gap: 9px;
}

.account-gate-actions .button {
  min-height: 44px;
  white-space: nowrap;
}

.account-page-stage {
  gap: 20px;
  min-height: 260px;
  margin-top: 26px;
}

.account-page-stage > :is(.account-profile-card, .account-settings-card, .account-library-card, .account-credits-card) {
  width: 100%;
  margin: 0;
  padding: clamp(22px, 3.5vw, 34px);
  border-color: #dfe4dd;
  border-radius: 18px;
  box-shadow: 0 14px 38px rgba(20, 37, 23, 0.045);
}

.account-route-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 880px) {
  body.account-page .account-main {
    padding-top: 24px;
  }

  .account-workspace {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .account-sidebar {
    position: static;
  }

  .account-page-nav {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    padding: 14px;
  }

  .account-nav-group {
    align-content: start;
  }
}

@media (max-width: 680px) {
  body.account-page .account-main {
    padding-top: 16px;
  }

  .account-workspace {
    gap: 24px;
  }

  .account-sidebar {
    border-radius: 14px;
  }

  .account-sidebar-brand {
    padding: 16px;
  }

  .account-page-nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .account-nav-group:last-child {
    grid-column: 1 / -1;
  }

  .account-nav-group:last-child a {
    width: calc(50% - 5px);
  }

  .account-page-heading {
    padding: 0 0 22px;
  }

  .account-page-heading h1 {
    font-size: clamp(2rem, 10vw, 2.85rem);
  }

  .account-gate {
    grid-template-columns: auto minmax(0, 1fr);
    margin-top: 20px;
    padding: 20px;
  }

  .account-gate-actions {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .account-gate-actions .button {
    width: 100%;
  }

  .account-page-stage {
    margin-top: 20px;
  }

  .account-route-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 430px) {
  .account-page-nav {
    grid-template-columns: 1fr;
  }

  .account-nav-group:last-child {
    grid-column: auto;
  }

  .account-nav-group:last-child a {
    width: 100%;
  }

  .account-gate {
    grid-template-columns: 1fr;
  }

  .account-gate-icon {
    width: 42px;
    height: 42px;
  }

  .account-gate-actions {
    grid-column: auto;
    grid-template-columns: 1fr;
  }
}

/* Dedicated account pages */
body.account-page .account-main {
  gap: 24px;
  width: min(1120px, 100%);
  margin-right: auto;
  margin-left: auto;
}

.account-page-heading {
  display: flex;
  justify-content: space-between;
  gap: 28px;
  padding: clamp(26px, 5vw, 54px) 0 4px;
}

.account-page-heading > div {
  display: grid;
  gap: 10px;
  max-width: 720px;
}

.account-page-heading h1,
.account-page-heading p {
  margin: 0;
}

.account-page-heading h1 {
  color: #111411;
  font-size: clamp(2.35rem, 5vw, 4.6rem);
  letter-spacing: -0.055em;
  line-height: 0.98;
}

.account-page-heading .hero-text {
  max-width: 620px;
  color: #667067;
  font-size: 0.94rem;
  line-height: 1.65;
}

.account-page-nav {
  display: flex;
  gap: 7px;
  width: 100%;
  padding: 7px;
  overflow-x: auto;
  border: 1px solid #e0e4df;
  border-radius: 14px;
  background: #f6f8f5;
  scrollbar-width: none;
}

.account-page-nav::-webkit-scrollbar {
  display: none;
}

.account-page-nav a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 9px 15px;
  border-radius: 9px;
  color: #5f685f;
  font-size: 0.78rem;
  font-weight: 720;
  text-decoration: none;
  white-space: nowrap;
}

.account-page-nav a:hover {
  color: #267b31;
  background: #eef9eb;
}

.account-page-nav a.is-active {
  color: #ffffff;
  background: #267b31;
  box-shadow: 0 5px 14px rgba(38, 123, 49, 0.18);
}

.account-page-stage {
  display: grid;
  gap: 22px;
  min-height: 340px;
}

.account-page-stage > .account-gate {
  width: min(620px, 100%);
  margin: 24px auto 0;
}

.account-overview-panel {
  display: grid;
  gap: 22px;
}

.account-overview-panel[hidden] {
  display: none;
}

.account-welcome-card {
  display: flex;
  justify-content: space-between;
  gap: 28px;
  align-items: center;
  padding: clamp(24px, 4vw, 38px);
  border-radius: 20px;
  background: #111411;
  color: #ffffff;
}

.account-welcome-card > div {
  display: grid;
  gap: 8px;
}

.account-welcome-card h2,
.account-welcome-card p {
  margin: 0;
}

.account-welcome-card h2 {
  color: #ffffff;
  font-size: clamp(1.55rem, 3vw, 2.4rem);
}

.account-welcome-card p:not(.eyebrow) {
  color: rgba(255, 255, 255, 0.65);
  font-size: 0.82rem;
}

.account-welcome-card .eyebrow {
  color: #8cdd77;
}

.account-welcome-card .button {
  flex: 0 0 auto;
  background: #54b948;
}

.account-summary-grid a.account-summary-card {
  color: inherit;
  text-decoration: none;
  transition: border-color 150ms ease, transform 150ms ease, box-shadow 150ms ease;
}

.account-summary-grid a.account-summary-card:hover {
  transform: translateY(-2px);
  border-color: #54b948;
  box-shadow: 0 12px 28px rgba(24, 50, 34, 0.08);
}

.account-route-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.account-route-grid a {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: center;
  min-height: 72px;
  padding: 17px;
  border: 1px solid #dfe4dd;
  border-radius: 13px;
  background: #ffffff;
  color: #222722;
  text-decoration: none;
}

.account-route-grid a:hover {
  border-color: #54b948;
  background: #f7fcf5;
}

.account-route-grid strong {
  font-size: 0.84rem;
}

.account-route-grid span {
  color: #267b31;
  font-size: 0.7rem;
  font-weight: 720;
  white-space: nowrap;
}

.account-page-stage > :is(.account-profile-card, .account-settings-card, .account-library-card, .account-credits-card) {
  width: min(860px, 100%);
  margin: 8px auto 0;
  padding: clamp(24px, 4vw, 38px);
}

.account-settings-list {
  display: grid;
  margin-top: 6px;
  border-top: 1px solid #e0e4df;
}

.account-settings-list > div {
  display: grid;
  grid-template-columns: minmax(150px, 0.38fr) minmax(0, 1fr);
  gap: 18px 28px;
  padding: 20px 0;
  border-bottom: 1px solid #e0e4df;
}

.account-settings-list strong,
.account-settings-list p {
  margin: 0;
}

.account-settings-list strong {
  color: #232823;
  font-size: 0.82rem;
}

.account-settings-list p {
  color: #697169;
  font-size: 0.79rem;
  line-height: 1.55;
}

.account-settings-list a {
  grid-column: 2;
  width: fit-content;
  color: #267b31;
  font-size: 0.75rem;
  font-weight: 720;
  text-decoration: none;
}

.account-settings-list a:hover {
  text-decoration: underline;
}

@media (max-width: 760px) {
  body.account-page .account-main {
    gap: 18px;
  }

  .account-page-heading {
    padding-top: 28px;
  }

  .account-page-nav {
    margin-right: -2px;
    margin-left: -2px;
  }

  .account-welcome-card {
    align-items: stretch;
    flex-direction: column;
  }

  .account-welcome-card .button {
    width: 100%;
  }

  .account-route-grid {
    grid-template-columns: 1fr;
  }

  .account-settings-list > div {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .account-settings-list a {
    grid-column: 1;
  }

  .account-page-stage .account-section-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .account-page-stage .account-section-head .button {
    width: 100%;
  }
}

/* Header account menu */
.header-account-menu {
  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
}

.account-menu-trigger {
  position: relative;
}

.account-menu-status-dot {
  position: absolute;
  right: 5px;
  bottom: 5px;
  display: block;
  width: 10px;
  height: 10px;
  border: 2px solid #ffffff;
  border-radius: 999px;
  background: #a5aaa5;
}

.header-account-menu.is-authenticated .account-menu-status-dot {
  background: #54b948;
}

.header-account-menu.is-open .account-menu-trigger {
  border-color: #267b31;
  background: #eef9eb;
  color: #267b31;
}

.account-menu-panel {
  position: absolute;
  top: calc(100% + 12px);
  right: 0;
  z-index: 320;
  width: min(330px, calc(100vw - 24px));
  max-height: min(680px, calc(100vh - 104px));
  overflow-y: auto;
  border: 1px solid #dcdedb;
  border-radius: 16px;
  background: #ffffff;
  color: #161816;
  box-shadow: 0 22px 54px rgba(17, 24, 19, 0.18);
  overscroll-behavior: contain;
}

.account-menu-panel[hidden],
.account-menu-session[hidden] {
  display: none;
}

.account-menu-session {
  padding: 18px;
}

.account-menu-user {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  padding-bottom: 16px;
  border-bottom: 1px solid #e4e6e3;
}

.account-menu-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border-radius: 13px;
  background: #267b31;
  color: #ffffff;
  font-size: 0.82rem;
  font-weight: 820;
  letter-spacing: 0.04em;
}

.account-menu-user div {
  min-width: 0;
}

.account-menu-user strong,
.account-menu-user span:not(.account-menu-avatar) {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.account-menu-user strong {
  color: #161816;
  font-size: 0.91rem;
}

.account-menu-user div span {
  margin-top: 3px;
  color: #6d756e;
  font-size: 0.7rem;
}

.account-menu-nav {
  display: grid;
  gap: 3px;
  padding: 11px 0;
}

.account-menu-nav a {
  display: grid;
  gap: 2px;
  padding: 9px 10px;
  border-radius: 9px;
  color: #222522;
  text-decoration: none;
}

.account-menu-nav a:hover,
.account-menu-nav a:focus-visible {
  background: #eef9eb;
  color: #267b31;
}

.account-menu-nav a span {
  font-size: 0.79rem;
  font-weight: 730;
  line-height: 1.3;
}

.account-menu-nav a small {
  color: #7a817b;
  font-size: 0.65rem;
  line-height: 1.35;
}

.account-menu-logout {
  width: 100%;
  min-height: 42px;
  border: 1px solid #d9dcda;
  border-radius: 9px;
  background: #f7f8f6;
  color: #333733;
  cursor: pointer;
  font: inherit;
  font-size: 0.76rem;
  font-weight: 720;
}

.account-menu-logout:hover {
  border-color: #bfc4bf;
  background: #eff1ee;
}

.account-menu-session-signed-out {
  display: grid;
  gap: 11px;
  padding: 22px;
}

.account-menu-kicker {
  margin: 0;
  color: #267b31 !important;
  font-size: 0.65rem !important;
  font-weight: 800;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.account-menu-session-signed-out > strong {
  color: #161816;
  font-size: 1.05rem;
  line-height: 1.35;
}

.account-menu-session-signed-out > p:not(.account-menu-kicker) {
  margin: 0 0 5px;
  color: #687068;
  font-size: 0.75rem;
  line-height: 1.55;
}

.account-menu-signin,
.account-menu-signup {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  border: 1px solid #267b31;
  border-radius: 9px;
  font-size: 0.78rem;
  font-weight: 750;
  text-decoration: none;
}

.account-menu-signin {
  background: #267b31;
  color: #ffffff;
}

.account-menu-signup {
  background: #ffffff;
  color: #267b31;
}

.account-menu-signin:hover {
  background: #1c5f26;
}

.account-menu-signup:hover {
  background: #eef9eb;
}

#account-overview,
#account-profile-card,
#account-settings-card,
#account-hotels-card,
#account-flights-card,
#account-trips-card,
#account-credits-card {
  scroll-margin-top: 112px;
}

.account-credit-balance {
  color: #267b31;
  font-size: 1.45rem;
  line-height: 1;
}

.account-credit-empty {
  display: grid;
  gap: 5px;
  padding: 18px;
  border: 1px dashed #cfd7cd;
  border-radius: 14px;
  background: #f7faf6;
}

.account-credit-empty strong,
.account-credit-empty p {
  margin: 0;
}

.account-credit-empty strong {
  color: #293029;
  font-size: 0.86rem;
}

.account-credit-empty p {
  color: #6d766e;
  font-size: 0.76rem;
}

@media (max-width: 720px) {
  .site-header > .header-actions .header-account-menu .profile-action-button {
    display: inline-flex;
    width: 44px;
    min-width: 44px;
    height: 44px;
  }

  .account-menu-panel {
    position: fixed;
    top: 72px;
    right: 10px;
    left: 10px;
    width: auto;
    max-height: calc(100dvh - 88px);
  }
}

@media (max-width: 420px) {
  .footer-grid {
    gap: 34px 18px;
  }

  .footer-legal-links {
    gap: 12px 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .footer-action,
  .footer-column a {
    transition: none;
  }
}

/* Keep bundle cards flush after legacy shared-card declarations. */
body.results-page .offer-card.bundle-flight-card {
  padding: 0;
  border-radius: 18px;
  background: #ffffff;
  backdrop-filter: none;
  overflow: hidden;
}

body.results-page .offer-card.bundle-flight-card.selected {
  border-color: #54b948;
}

@media (max-width: 720px) {
  body.results-page .offer-card.bundle-flight-card {
    padding: 0;
    border-radius: 15px;
  }
}

/* Pack hotel details and pricing together at the top of equal-height product cards. */
body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-body {
  align-items: start;
  align-content: start;
  grid-auto-rows: max-content;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-price-stack.hotel-result-price {
  align-self: start;
  margin-top: 0;
  justify-content: flex-start;
}

/*
 * Mobile Safari automatically zooms the page when a focused form control has
 * text smaller than 16px. Keep controls at the non-zooming size on phones
 * while leaving browser pinch-to-zoom enabled for accessibility.
 */
@media (max-width: 820px) {
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
  select,
  textarea {
    font-size: 16px !important;
  }
}

/* Modern monochrome account access */
body.auth-page {
  --auth-black: #0a0a0a;
  --auth-copy: #5e5e5e;
  --auth-line: #dcdcdc;
  --auth-soft: #f3f3f1;
  background: #ffffff !important;
  color: var(--auth-black);
}

body.auth-page::before {
  display: none;
}

body.auth-page .page-shell {
  width: min(1440px, calc(100% - 32px));
  padding-top: 18px;
  background: #ffffff;
}

body.auth-page .site-header {
  position: relative;
  top: auto;
  min-height: 70px;
  padding-top: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid #e5e5e5;
  background: #ffffff;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

body.auth-page .site-header .wordmark-logo {
  filter: none;
}

body.auth-page .site-header .site-nav {
  background: #f5f5f3;
}

body.auth-page .site-header .nav-link-text {
  color: #595959;
}

body.auth-page .site-header .nav-link-text:hover {
  color: #000000;
  background: #ffffff;
}

body.auth-page .site-header .header-action-button {
  border-color: #dedede;
  background: #ffffff;
  color: #111111;
}

body.auth-page .site-header .header-action-button:hover {
  border-color: #111111;
  background: #ffffff;
}

body.auth-page .site-header > .header-actions .profile-action-button {
  display: none;
}

body.auth-page .site-header .cart-count {
  background: #111111;
}

body.auth-page :where(a, button, input):focus-visible {
  outline-color: rgba(0, 0, 0, 0.38);
}

body.auth-page .auth-main {
  display: grid;
  min-height: clamp(650px, 78vh, 820px);
  margin: 0;
  padding: clamp(42px, 6vw, 82px) 0 clamp(60px, 8vw, 104px);
}

body.auth-page .auth-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.93fr) minmax(0, 1.07fr);
  align-items: stretch;
  justify-content: stretch;
  width: min(1120px, 100%);
  margin: auto;
  overflow: hidden;
  border: 1px solid #dedede;
  border-radius: 24px;
  background: #ffffff;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.06);
}

body.auth-page .auth-card {
  display: grid;
  align-content: center;
  gap: 32px;
  min-width: 0;
  padding: clamp(38px, 6vw, 70px);
  border: 0;
  border-radius: 0;
  background: #ffffff;
  box-shadow: none;
}

body.auth-page .auth-card-head {
  display: grid;
  gap: 11px;
}

body.auth-page .auth-eyebrow {
  margin: 0;
  color: #6c6c6c;
  font-size: 0.68rem;
  font-weight: 780;
  letter-spacing: 0.17em;
  line-height: 1.2;
  text-transform: uppercase;
}

body.auth-page .auth-card h1 {
  margin: 0;
  color: var(--auth-black);
  font-family: var(--font-sans);
  font-size: clamp(2.25rem, 4.3vw, 3.65rem);
  font-weight: 650;
  letter-spacing: -0.055em;
  line-height: 0.98;
  text-align: left;
}

body.auth-page .auth-form-copy {
  max-width: 430px;
  margin: 0;
  color: var(--auth-copy);
  font-size: 0.9rem;
  line-height: 1.65;
}

body.auth-page .auth-form {
  display: grid;
  gap: 17px;
}

body.auth-page .auth-field {
  display: grid;
  gap: 8px;
}

body.auth-page .auth-field[hidden] {
  display: none !important;
}

body.auth-page .auth-field > label,
body.auth-page .auth-field > span:not(.auth-password-control) {
  color: #242424;
  font-size: 0.76rem;
  font-weight: 680;
  letter-spacing: 0;
  line-height: 1.3;
  text-transform: none;
}

body.auth-page .auth-field input {
  width: 100%;
  min-height: 54px;
  padding: 13px 15px;
  border: 1px solid #d3d3d3;
  border-radius: 10px;
  background: #ffffff;
  color: #111111;
  font: inherit;
  font-size: 0.92rem;
  outline: none;
  box-shadow: none;
}

body.auth-page .auth-field input::placeholder {
  color: #9a9a9a;
}

body.auth-page .auth-field input:hover {
  border-color: #a8a8a8;
}

body.auth-page .auth-field input:focus {
  border-color: #111111;
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.08);
}

body.auth-page .auth-password-control {
  position: relative;
  display: block;
}

body.auth-page .auth-password-control input {
  padding-right: 72px;
}

body.auth-page .auth-password-toggle {
  position: absolute;
  top: 50%;
  right: 10px;
  min-width: 48px;
  min-height: 34px;
  padding: 0 7px;
  transform: translateY(-50%);
  border: 0;
  border-radius: 7px;
  background: #f1f1ef;
  color: #222222;
  cursor: pointer;
  font: inherit;
  font-size: 0.7rem;
  font-weight: 720;
}

body.auth-page .auth-status {
  min-height: 20px;
  margin: -2px 0;
  color: #555555;
  font-size: 0.78rem;
  line-height: 1.45;
}

body.auth-page .auth-status:empty {
  display: none;
}

body.auth-page .auth-status.error {
  color: #a31919;
}

body.auth-page .auth-status.success {
  color: #1d5e2b;
}

body.auth-page .auth-submit-button.button-primary {
  width: 100%;
  min-height: 54px;
  border: 1px solid #0a0a0a;
  border-radius: 10px;
  background: #0a0a0a;
  color: #ffffff;
  box-shadow: none;
  font-size: 0.88rem;
  font-weight: 730;
}

body.auth-page .auth-submit-button.button-primary:hover {
  background: #292929;
  transform: none;
}

body.auth-page .auth-switch-copy {
  margin: -3px 0 0;
  color: #686868;
  font-size: 0.78rem;
  line-height: 1.45;
  text-align: center;
}

body.auth-page .auth-switch-copy button {
  color: #111111;
  font-weight: 730;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

body.auth-page .auth-divider {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 12px;
  align-items: center;
  color: #8a8a8a;
  font-size: 0.68rem;
}

body.auth-page .auth-divider::before,
body.auth-page .auth-divider::after {
  content: "";
  height: 1px;
  background: #dfdfdf;
}

body.auth-page .auth-ezbuyco-button.button-secondary {
  display: flex;
  gap: 10px;
  width: 100%;
  min-height: 52px;
  border: 1px solid #cfcfcf;
  border-radius: 10px;
  background: #ffffff;
  color: #111111;
  font-size: 0.84rem;
  font-weight: 680;
  box-shadow: none;
}

body.auth-page .auth-ezbuyco-button.button-secondary:hover {
  border-color: #111111;
  background: #f8f8f7;
  transform: none;
}

body.auth-page .auth-ezbuyco-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 25px;
  border-radius: 7px;
  background: #111111;
  color: #ffffff;
  font-size: 0.72rem;
  font-weight: 820;
}

body.auth-page .auth-story {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 48px;
  min-width: 0;
  padding: clamp(42px, 6vw, 74px);
  border-left: 1px solid #dedede;
  background: var(--auth-soft);
}

body.auth-page .auth-story-kicker {
  margin: 0 0 17px;
  color: #686868;
  font-size: 0.67rem;
  font-weight: 780;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

body.auth-page .auth-story h2 {
  max-width: 510px;
  margin: 0;
  color: #0a0a0a;
  font-family: var(--font-sans);
  font-size: clamp(2rem, 3.6vw, 3.35rem);
  font-weight: 640;
  letter-spacing: -0.052em;
  line-height: 1.02;
}

body.auth-page .auth-story-copy {
  max-width: 480px;
  margin: 20px 0 0;
  color: #646464;
  font-size: 0.87rem;
  line-height: 1.65;
}

body.auth-page .auth-benefit-list {
  display: grid;
  border-top: 1px solid #cfcfcd;
}

body.auth-page .auth-benefit-item {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 14px;
  padding: 18px 0;
  border-bottom: 1px solid #cfcfcd;
}

body.auth-page .auth-benefit-item > span {
  color: #858585;
  font-size: 0.65rem;
  font-weight: 720;
  letter-spacing: 0.08em;
}

body.auth-page .auth-benefit-item strong {
  display: block;
  color: #111111;
  font-size: 0.86rem;
  line-height: 1.35;
}

body.auth-page .auth-benefit-item p {
  margin: 5px 0 0;
  color: #686868;
  font-size: 0.75rem;
  line-height: 1.5;
}

body.auth-page .auth-story-footnote {
  margin: 0;
  color: #777777;
  font-size: 0.7rem;
}

body.auth-page .site-footer {
  margin-top: 0;
}

@media (max-width: 860px) {
  body.auth-page .auth-layout {
    grid-template-columns: 1fr;
    width: min(620px, 100%);
  }

  body.auth-page .auth-story {
    border-top: 1px solid #dedede;
    border-left: 0;
  }
}

@media (max-width: 700px) {
  body.auth-page .page-shell {
    width: calc(100% - 20px);
    padding-top: 10px;
  }

  body.auth-page .site-header {
    position: relative;
    padding-top: 9px;
    padding-bottom: 8px;
  }

  body.auth-page .auth-main {
    min-height: 0;
    padding: 30px 0 64px;
  }

  body.auth-page .auth-layout {
    border-radius: 16px;
  }

  body.auth-page .auth-card,
  body.auth-page .auth-story {
    padding: 30px 22px;
  }

  body.auth-page .auth-card {
    gap: 26px;
  }

  body.auth-page .auth-card h1 {
    font-size: clamp(2.3rem, 12vw, 3rem);
  }

  body.auth-page .auth-story {
    gap: 34px;
  }

  body.auth-page .auth-story h2 {
    font-size: 2.1rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.auth-page .auth-submit-button,
  body.auth-page .auth-ezbuyco-button {
    transition: none;
  }
}

@media (max-width: 620px) {
  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-card-body {
    grid-template-columns: minmax(0, 1fr) minmax(116px, 34%);
    column-gap: 12px;
    row-gap: 6px;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-result-copy {
    display: contents;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .featured-hotel-location {
    grid-area: auto;
    grid-column: 1 / -1;
    grid-row: 1;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-result-copy h3 {
    grid-area: auto;
    grid-column: 1 / -1;
    grid-row: 2;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-result-rating {
    grid-area: auto;
    grid-column: 1;
    grid-row: 3;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-result-amenities {
    grid-area: auto;
    grid-column: 1;
    grid-row: 4;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-result-policy {
    grid-area: auto;
    grid-column: 1;
    grid-row: 5;
  }

  body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card .hotel-price-stack.hotel-result-price {
    grid-area: auto;
    grid-column: 2;
    grid-row: 3 / span 3;
    min-width: 0;
    width: 100%;
    align-items: flex-end;
    text-align: right;
  }
}

/* Final white footer palette */
.site-footer,
body.home-page .site-footer {
  border-top: 4px solid #54b948;
  background: #ffffff;
  color: #111111;
}

.footer-lead,
.footer-trust-row {
  border-color: #d9d9d9;
}

.footer-wordmark .wordmark-logo-frame {
  padding: 0;
  background: transparent;
}

.footer-wordmark .wordmark-logo {
  filter: none;
}

.footer-brand-tag {
  color: #707070 !important;
}

.footer-brand-block h2 {
  color: #111111;
}

.footer-note {
  color: #5f5f5f !important;
}

.footer-action {
  border-color: #111111;
  color: #111111;
}

.footer-action-primary {
  border-color: #267b31;
  background: #267b31;
  color: #ffffff;
}

.footer-action-primary:hover {
  border-color: #1c5f26;
  background: #1c5f26;
}

.footer-action-secondary {
  background: #ffffff;
}

.footer-action-secondary:hover {
  border-color: #54b948;
  background: #eef9eb;
  color: #267b31;
}

.footer-support-card {
  border-color: #d9d9d9;
  background: #f5f5f3;
}

.footer-support-icon {
  background: #267b31;
  color: #ffffff;
}

.footer-support-card h3,
.footer-trust-item strong {
  color: #111111 !important;
}

.footer-support-card a,
.footer-heading {
  color: #267b31 !important;
}

.footer-support-label {
  color: #717171;
}

.footer-support-card p:not(.footer-support-label) {
  color: #606060;
}

.footer-column a {
  color: #626262;
}

.footer-column a:hover,
body.home-page .footer-column a:hover {
  color: #267b31;
}

.footer-trust-item + .footer-trust-item {
  border-color: #d9d9d9;
}

.footer-trust-number {
  color: #267b31;
}

.footer-trust-item p {
  color: #656565;
}

.footer-legal-row {
  color: #737373 !important;
}

.footer-legal-links a {
  color: #5c5c5c;
}

.footer-legal-links a:hover {
  color: #267b31;
}

/* Compact login form that fits comfortably in the first viewport */
body.auth-page .auth-main {
  min-height: calc(100svh - 108px);
  padding: clamp(28px, 4vh, 44px) 0 clamp(38px, 5vh, 58px);
}

body.auth-page .auth-layout {
  grid-template-columns: minmax(0, 1fr);
  width: min(500px, 100%);
  border-radius: 20px;
  box-shadow: 0 16px 42px rgba(0, 0, 0, 0.06);
}

body.auth-page .auth-card {
  gap: 25px;
  padding: clamp(30px, 5vw, 46px);
}

body.auth-page .auth-card-head {
  gap: 8px;
}

body.auth-page .auth-card h1 {
  font-size: clamp(2.15rem, 5vw, 3rem);
}

body.auth-page .auth-form-copy {
  font-size: 0.84rem;
}

body.auth-page .auth-form {
  gap: 14px;
}

body.auth-page .auth-field input,
body.auth-page .auth-submit-button.button-primary,
body.auth-page .auth-ezbuyco-button.button-secondary {
  min-height: 50px;
}

body.auth-page .auth-switch-copy {
  margin-top: 1px;
}

@media (max-width: 700px) {
  .footer-trust-item + .footer-trust-item {
    border-color: #d9d9d9;
  }

  body.auth-page .auth-main {
    min-height: calc(100svh - 92px);
    padding: 22px 0 42px;
  }

  body.auth-page .auth-layout {
    border-radius: 14px;
  }

  body.auth-page .auth-card {
    gap: 22px;
    padding: 27px 20px;
  }
}

/* Final standalone login sizing */
body.auth-page .site-header {
  justify-content: center;
  border-bottom: 0;
}

body.auth-page .site-header > .site-nav,
body.auth-page .site-header > .header-actions {
  display: none;
}

body.auth-page .auth-main {
  min-height: calc(100svh - 94px);
  padding: clamp(18px, 4vh, 38px) 0 clamp(28px, 5vh, 48px);
}

body.auth-page .auth-layout {
  width: min(470px, 100%);
}

body.auth-page .auth-card {
  padding: clamp(28px, 5vw, 42px);
}

/* Final account workspace cascade */
body.account-page .account-main {
  width: min(1180px, 100%);
  padding-top: clamp(30px, 5vw, 58px);
  padding-bottom: clamp(56px, 8vw, 96px);
}

.account-page-heading {
  padding: 5px 0 28px;
}

.account-page-heading h1 {
  font-size: clamp(2.15rem, 4.5vw, 3.7rem);
  letter-spacing: -0.05em;
  line-height: 1;
}

.account-page-heading .hero-text {
  max-width: 610px;
  font-size: 0.9rem;
}

.account-page-nav {
  display: grid;
  gap: 18px;
  width: auto;
  margin: 0;
  padding: 18px 12px 20px;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: #ffffff;
}

.account-page-stage {
  gap: 20px;
  min-height: 260px;
  margin-top: 26px;
}

.account-route-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.account-page-stage > :is(.account-profile-card, .account-settings-card, .account-library-card, .account-credits-card) {
  width: 100%;
  margin: 0;
  padding: clamp(22px, 3.5vw, 34px);
}

@media (max-width: 880px) {
  body.account-page .account-main {
    padding-top: 24px;
  }

  .account-page-nav {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
    padding: 14px;
  }
}

@media (max-width: 680px) {
  body.account-page .account-main {
    padding-top: 16px;
  }

  .account-page-nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .account-page-heading {
    padding: 0 0 22px;
  }

  .account-page-heading h1 {
    font-size: clamp(2rem, 10vw, 2.85rem);
  }

  .account-page-stage {
    margin-top: 20px;
  }

  .account-route-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 430px) {
  .account-page-nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .account-nav-group:last-child {
    grid-column: 1 / -1;
  }

  .account-nav-group:last-child a {
    width: calc(50% - 5px);
  }
}

/* Account hamburger drawer */
body.account-drawer-open {
  overflow: hidden;
}

.account-workspace {
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
}

.account-content {
  width: min(920px, 100%);
  margin: 0 auto;
}

.account-drawer-backdrop {
  position: fixed;
  inset: 0;
  z-index: 599;
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  background: rgba(10, 15, 11, 0.48);
  opacity: 0;
  pointer-events: none;
  cursor: default;
  transition: opacity 210ms ease;
}

.account-sidebar {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 600;
  width: min(320px, calc(100vw - 42px));
  overflow-x: hidden;
  overflow-y: auto;
  border: 0;
  border-right: 1px solid #dfe4dd;
  border-radius: 0;
  background: #ffffff;
  box-shadow: 22px 0 60px rgba(13, 22, 15, 0.2);
  visibility: hidden;
  transform: translateX(-104%);
  transition: transform 240ms ease, visibility 240ms ease;
  overscroll-behavior: contain;
}

body.account-drawer-open .account-drawer-backdrop {
  opacity: 1;
  pointer-events: auto;
  cursor: pointer;
}

body.account-drawer-open .account-sidebar {
  visibility: visible;
  transform: translateX(0);
}

.account-sidebar-brand {
  position: sticky;
  top: 0;
  z-index: 2;
  min-height: 82px;
  background: #ffffff;
}

.account-drawer-close {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  margin-left: auto;
  padding: 0 0 3px;
  border: 1px solid #dfe4dd;
  border-radius: 10px;
  background: #f7f8f6;
  color: #323832;
  cursor: pointer;
  font: inherit;
  font-size: 1.55rem;
  font-weight: 400;
  line-height: 1;
}

.account-drawer-close:hover {
  border-color: #54b948;
  background: #eef8eb;
  color: #185f24;
}

body.account-page .account-sidebar .account-page-nav {
  grid-template-columns: 1fr;
  gap: 20px;
  margin: 0;
  padding: 20px 14px 34px;
}

body.account-page .account-sidebar .account-nav-group:last-child {
  grid-column: auto;
}

body.account-page .account-sidebar .account-nav-group:last-child a {
  width: 100%;
}

body.account-page .account-sidebar .account-page-nav .account-nav-group a {
  min-height: 46px;
  padding: 11px 13px;
  font-size: 0.8rem;
}

@media (max-width: 680px) {
  .account-sidebar {
    width: min(310px, calc(100vw - 30px));
  }
}

@media (prefers-reduced-motion: reduce) {
  .account-sidebar,
  .account-drawer-backdrop {
    transition: none;
  }
}

/* Keep account pages focused: brand first, account navigation directly below. */
body.account-page .page-shell {
  padding-top: 18px;
  padding-bottom: 0;
}

body.account-page .site-header {
  position: relative;
  top: auto;
  justify-content: flex-start;
  width: min(920px, 100%);
  min-height: 64px;
  margin-right: auto;
  margin-left: auto;
  padding: 7px 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

body.account-page .site-header > .site-nav,
body.account-page .site-header > .header-actions {
  display: none;
}

body.account-page .account-main {
  padding-top: 12px;
  padding-bottom: max(132px, calc(112px + env(safe-area-inset-bottom)));
}

.account-bottom-dock {
  position: fixed;
  bottom: max(14px, env(safe-area-inset-bottom));
  left: 50%;
  z-index: 90;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  width: min(470px, calc(100% - 28px));
  min-height: 72px;
  padding: 8px;
  border: 1px solid rgba(24, 50, 34, 0.14);
  border-radius: 21px;
  background: rgba(255, 255, 255, 0.97);
  box-shadow: 0 18px 48px rgba(16, 28, 18, 0.2);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  transform: translateX(-50%);
}

.account-bottom-action {
  display: grid;
  grid-template-rows: 23px auto;
  place-items: center;
  align-content: center;
  gap: 4px;
  min-width: 0;
  min-height: 54px;
  padding: 7px 10px;
  border: 0;
  border-radius: 14px;
  background: transparent;
  color: #3d463e;
  cursor: pointer;
  font: inherit;
  font-size: 0.68rem;
  font-weight: 800;
  line-height: 1;
  text-decoration: none;
}

.account-bottom-action:hover,
.account-bottom-action[aria-expanded="true"] {
  background: #f0f5ef;
  color: #185f24;
}

.account-bottom-action svg {
  width: 23px;
  height: 23px;
}

.account-bottom-support {
  color: #ffffff;
  background: #267b31;
  box-shadow: 0 8px 20px rgba(38, 123, 49, 0.24);
}

.account-bottom-support:hover {
  color: #ffffff;
  background: #185f24;
}

body.account-page .toast {
  bottom: max(106px, calc(92px + env(safe-area-inset-bottom)));
}

@media (max-width: 680px) {
  body.account-page .page-shell {
    width: calc(100% - 24px);
    padding-top: 10px;
  }

  body.account-page .site-header {
    min-height: 54px;
    padding: 5px 0;
  }

  body.account-page .account-main {
    padding-top: 9px;
  }

  .account-bottom-dock {
    bottom: max(8px, env(safe-area-inset-bottom));
    width: calc(100% - 20px);
    min-height: 68px;
    padding: 7px;
    border-radius: 18px;
  }
}

/* Compact, modern account dashboard typography and surfaces. */
body.account-page :is(h1, h2, h3) {
  font-family: var(--font-sans);
  font-style: normal;
}

body.account-page .account-content {
  width: min(880px, 100%);
}

body.account-page .site-header {
  width: min(880px, 100%);
}

body.account-page .account-page-heading {
  display: block;
  padding: 8px 0 20px;
  border-bottom: 1px solid #dfe3dc;
}

body.account-page .account-page-heading > div {
  gap: 5px;
  max-width: 600px;
}

body.account-page .account-page-heading .eyebrow,
body.account-page .account-card-head .eyebrow,
body.account-page .account-section-head .eyebrow,
body.account-page .account-welcome-card .eyebrow,
body.account-page .account-gate .eyebrow {
  color: #267b31;
  font-size: 0.64rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  line-height: 1.3;
  text-transform: uppercase;
}

body.account-page .account-page-heading h1 {
  color: #182019;
  font-size: clamp(1.55rem, 2.5vw, 2rem);
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.2;
}

body.account-page .account-page-heading .hero-text {
  max-width: 560px;
  color: #687069;
  font-size: 0.82rem;
  line-height: 1.55;
}

body.account-page .account-page-stage {
  gap: 16px;
  min-height: 220px;
  margin-top: 18px;
}

body.account-page :is(.account-gate, .account-welcome-card),
body.account-page .account-page-stage > :is(.account-profile-card, .account-settings-card, .account-library-card, .account-credits-card) {
  border: 1px solid #e0e4de;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 8px 24px rgba(20, 37, 23, 0.045);
}

body.account-page .account-gate {
  gap: 15px;
  margin-top: 18px;
  padding: 20px;
}

body.account-page .account-gate-icon {
  width: 42px;
  height: 42px;
  border-radius: 11px;
  font-size: 0.9rem;
}

body.account-page .account-gate-copy h2,
body.account-page .account-welcome-card h2,
body.account-page :is(.account-card-head, .account-section-head) h2 {
  font-size: clamp(1.05rem, 1.8vw, 1.25rem);
  font-weight: 700;
  letter-spacing: -0.015em;
  line-height: 1.3;
}

body.account-page .account-gate-copy > p:not(.eyebrow),
body.account-page .account-welcome-card p:not(.eyebrow) {
  color: #697169;
  font-size: 0.78rem;
  line-height: 1.5;
}

body.account-page .account-overview-panel {
  gap: 14px;
}

body.account-page .account-welcome-card {
  gap: 20px;
  padding: 20px;
  color: #182019;
}

body.account-page .account-welcome-card h2 {
  color: #182019;
}

body.account-page .account-welcome-card .button,
body.account-page .account-gate-actions .button,
body.account-page :is(.account-card-head, .account-section-head) .button {
  min-height: 40px;
  padding: 9px 14px;
  border-radius: 9px;
  font-size: 0.76rem;
}

body.account-page .account-summary-grid {
  gap: 12px;
}

body.account-page .account-summary-grid .account-summary-card {
  gap: 6px;
  padding: 17px;
  border: 1px solid #e0e4de;
  border-radius: 13px;
  background: #ffffff;
}

body.account-page .account-summary-label {
  font-size: 0.66rem;
  letter-spacing: 0.08em;
}

body.account-page .account-summary-value {
  font-size: 1.5rem;
  font-weight: 700;
}

body.account-page .account-summary-card p {
  font-size: 0.76rem;
  line-height: 1.45;
}

body.account-page .account-page-stage > :is(.account-profile-card, .account-settings-card, .account-library-card, .account-credits-card) {
  margin: 0;
  padding: 20px;
}

body.account-page .account-settings-list > div {
  padding: 16px 0;
}

body.account-page .account-library-item,
body.account-page .account-credit-empty {
  border-radius: 11px;
}

body.account-page .account-credit-balance {
  font-family: var(--font-sans);
  font-size: 1.25rem;
  font-weight: 700;
}

body.account-page .auth-field span,
body.account-page .auth-help {
  font-size: 0.74rem;
}

body.account-page .auth-field input {
  min-height: 44px;
  border-radius: 9px;
  font-family: var(--font-sans);
  font-size: 0.84rem;
}

@media (max-width: 680px) {
  body.account-page .account-page-heading {
    padding: 5px 0 17px;
  }

  body.account-page .account-page-heading h1 {
    font-size: 1.5rem;
  }

  body.account-page .account-gate,
  body.account-page .account-welcome-card,
  body.account-page .account-page-stage > :is(.account-profile-card, .account-settings-card, .account-library-card, .account-credits-card) {
    padding: 17px;
  }

  body.account-page .account-summary-grid {
    grid-template-columns: 1fr;
  }
}

/* Bright beachfront homepage hero with the stay search floating over the image. */
body.home-page-pro .site-header {
  position: relative;
  top: auto;
}

body.home-page-pro .home-pro-hero {
  min-height: 670px;
  padding-bottom: 176px;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.94) 0%, rgba(255, 255, 255, 0.72) 38%, rgba(255, 255, 255, 0.16) 72%),
    linear-gradient(180deg, rgba(229, 248, 255, 0.12) 48%, rgba(5, 57, 70, 0.18) 100%),
    url("/assets/home-beach-hotel-hero.png?v=20260730") center / cover no-repeat;
  color: #13251f;
  box-shadow: 0 24px 60px rgba(25, 92, 108, 0.14);
}

body.home-page-pro .home-pro-hero::before {
  display: none;
}

body.home-page-pro .home-pro-hero-copy .eyebrow {
  color: #196b5e;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
}

body.home-page-pro .home-pro-hero-copy h1 {
  color: #102b2b;
  text-shadow: 0 2px 18px rgba(255, 255, 255, 0.45);
}

body.home-page-pro .home-pro-hero-copy h1 span {
  color: #267b60;
}

body.home-page-pro .home-pro-lede {
  color: #314e4d;
  text-shadow: 0 1px 10px rgba(255, 255, 255, 0.7);
}

body.home-page-pro .home-pro-hero-actions .button-primary {
  background: #267b60;
  color: #ffffff;
  box-shadow: 0 10px 24px rgba(20, 93, 78, 0.22);
}

body.home-page-pro .home-pro-hero-actions .button-secondary {
  border-color: rgba(17, 64, 61, 0.16);
  background: rgba(255, 255, 255, 0.82);
  color: #173d3b;
  box-shadow: 0 8px 22px rgba(30, 91, 101, 0.1);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

body.home-page-pro .home-pro-route-spotlight {
  border-color: rgba(255, 255, 255, 0.72);
  background: rgba(255, 255, 255, 0.78);
  box-shadow: 0 20px 54px rgba(25, 85, 92, 0.15);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

body.home-page-pro .home-pro-route-topline span,
body.home-page-pro .home-pro-route-topline strong,
body.home-page-pro .home-pro-route-footer span,
body.home-page-pro .home-pro-route-codes div span {
  color: #526968;
}

body.home-page-pro .home-pro-route-topline strong,
body.home-page-pro .home-pro-route-footer a {
  color: #267b60;
}

body.home-page-pro .home-pro-route-codes strong {
  color: #163b39;
}

body.home-page-pro .home-pro-route-line {
  color: #267b60;
  background: rgba(22, 59, 57, 0.26);
}

body.home-page-pro .home-pro-route-footer {
  border-top-color: rgba(22, 59, 57, 0.13);
}

body.home-page-pro .home-pro-search-card {
  right: clamp(22px, 4vw, 54px);
  bottom: 24px;
  left: clamp(22px, 4vw, 54px);
  border: 1px solid rgba(255, 255, 255, 0.78);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 18px 48px rgba(20, 72, 78, 0.18);
}

body.home-page-pro .home-pro-search-modes a.is-active {
  background: #267b60;
}

body.home-page-pro .home-pro-search-card .search-overlay-trigger-action {
  background: #54b948;
}

@media (max-width: 1020px) {
  body.home-page-pro .home-pro-hero {
    min-height: 720px;
    padding-bottom: 192px;
    background-position: 58% center;
  }

  body.home-page-pro .home-pro-search-card {
    bottom: 20px;
  }
}

@media (max-width: 820px) {
  body.home-page-pro .home-pro-hero {
    min-height: 0;
    padding: 50px 30px 194px;
    background:
      linear-gradient(90deg, rgba(255, 255, 255, 0.9) 0%, rgba(255, 255, 255, 0.6) 54%, rgba(255, 255, 255, 0.18) 100%),
      linear-gradient(180deg, rgba(229, 248, 255, 0.08) 45%, rgba(4, 54, 66, 0.2) 100%),
      url("/assets/home-beach-hotel-hero.png?v=20260730") 60% center / cover no-repeat;
  }

  body.home-page-pro .home-pro-search-card {
    right: 18px;
    bottom: 18px;
    left: 18px;
    border-radius: 18px;
  }
}

@media (max-width: 600px) {
  body.home-page-pro .home-pro-hero {
    padding: 38px 20px 176px;
    background:
      linear-gradient(90deg, rgba(255, 255, 255, 0.92) 0%, rgba(255, 255, 255, 0.64) 65%, rgba(255, 255, 255, 0.24) 100%),
      linear-gradient(180deg, rgba(232, 250, 255, 0.05) 40%, rgba(8, 59, 68, 0.2) 100%),
      url("/assets/home-beach-hotel-hero.png?v=20260730") 62% center / cover no-repeat;
  }

  body.home-page-pro .home-pro-hero-copy h1 {
    font-size: clamp(2.65rem, 13vw, 3.7rem);
    line-height: 0.94;
  }

  body.home-page-pro .home-pro-lede {
    color: #284847;
    font-size: 0.9rem;
    line-height: 1.55;
  }

  body.home-page-pro .home-pro-route-spotlight {
    display: none;
  }

  body.home-page-pro .home-pro-search-card {
    right: 10px;
    bottom: 10px;
    left: 10px;
    border-radius: 16px;
  }
}

/* The homepage search is an inline, fully usable form rather than a modal trigger. */
body.home-page-pro .home-pro-hero {
  min-height: 740px;
  padding-bottom: 250px;
  overflow: visible;
}

body.home-page-pro .home-pro-search-card {
  z-index: 20;
  grid-template-columns: minmax(190px, 0.34fr) minmax(0, 1fr);
  align-items: start;
  gap: 22px;
  min-height: 0;
  padding: 20px;
}

body.home-page-pro .home-pro-search-heading {
  grid-template-columns: 1fr;
  align-items: start;
  gap: 12px;
}

body.home-page-pro .home-pro-search-modes {
  justify-self: start;
}

body.home-page-pro .home-inline-search-form {
  display: grid;
  grid-template-columns: minmax(210px, 1fr) 150px;
  gap: 10px 12px;
  width: 100%;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.home-page-pro .home-inline-search-form .home-search-grid {
  grid-column: 1 / -1;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 8px;
  align-items: start;
}

body.home-page-pro .home-inline-search-form .field-group-destination {
  grid-column: span 4;
}

body.home-page-pro .home-inline-search-form .field-group-check-in,
body.home-page-pro .home-inline-search-form .field-group-check-out {
  grid-column: span 3;
}

body.home-page-pro .home-inline-search-form .field-group-travelers {
  grid-column: span 2;
}

body.home-page-pro .home-inline-label {
  display: block;
  padding-left: 2px;
  color: #52635e;
  font-size: 0.64rem;
  font-weight: 800;
  letter-spacing: 0.07em;
  line-height: 1.2;
  text-transform: uppercase;
}

body.home-page-pro .home-inline-search-form :is(.home-input-shell, .home-search-input) {
  min-height: 48px;
  border-color: rgba(22, 73, 64, 0.13);
  border-radius: 11px;
  background: #f4f8f6;
  box-shadow: none;
}

body.home-page-pro .home-inline-search-form input[type="date"] {
  color-scheme: light;
  padding-inline: 11px;
  font-size: 0.78rem;
}

body.home-page-pro .home-inline-search-form .autocomplete {
  position: relative;
}

body.home-page-pro .home-inline-search-form .suggestions {
  z-index: 40;
  max-height: min(280px, 42vh);
  overflow-y: auto;
  border-radius: 12px;
}

body.home-page-pro .home-inline-search-form .search-flight-shell {
  grid-column: 1;
  gap: 8px;
}

body.home-page-pro .home-inline-search-form .search-flight-toggle {
  min-height: 46px;
  padding: 8px 12px;
  border-radius: 11px;
  background: #f4f8f6;
}

body.home-page-pro .home-inline-search-form .search-flight-toggle span {
  font-size: 0.78rem;
}

body.home-page-pro .home-inline-search-form .search-flight-toggle small {
  font-size: 0.66rem;
}

body.home-page-pro .home-inline-search-form .search-flight-fields {
  position: relative;
}

body.home-page-pro .home-inline-search-form .home-search-actions {
  grid-column: 2;
  align-self: start;
}

body.home-page-pro .home-inline-search-form .home-search-actions .button {
  min-height: 46px;
  border-color: #267b60;
  border-radius: 11px;
  background: #267b60;
  color: #ffffff;
}

@media (max-width: 1020px) {
  body.home-page-pro .home-pro-hero {
    min-height: 790px;
    padding-bottom: 310px;
  }

  body.home-page-pro .home-pro-search-card {
    grid-template-columns: 1fr;
  }

  body.home-page-pro .home-pro-search-heading {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
  }
}

@media (max-width: 820px) {
  body.home-page-pro .home-pro-hero {
    min-height: 0;
    padding: 50px 30px;
    overflow: hidden;
  }

  body.home-page-pro .home-pro-search-card {
    position: relative;
    inset: auto;
    width: 100%;
    margin-top: 4px;
  }

  body.home-page-pro .home-trust-row {
    margin-top: -34px;
  }
}

@media (max-width: 600px) {
  body.home-page-pro .home-pro-hero {
    padding: 38px 14px 16px;
  }

  body.home-page-pro .home-pro-search-card {
    padding: 15px;
  }

  body.home-page-pro .home-pro-search-heading {
    grid-template-columns: 1fr auto;
  }

  body.home-page-pro .home-inline-search-form {
    grid-template-columns: 1fr;
  }

  body.home-page-pro .home-inline-search-form .home-search-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.home-page-pro .home-inline-search-form .field-group-destination,
  body.home-page-pro .home-inline-search-form .field-group-travelers {
    grid-column: 1 / -1;
  }

  body.home-page-pro .home-inline-search-form .field-group-check-in,
  body.home-page-pro .home-inline-search-form .field-group-check-out {
    grid-column: span 1;
  }

  body.home-page-pro .home-inline-search-form .search-flight-shell,
  body.home-page-pro .home-inline-search-form .home-search-actions {
    grid-column: 1;
  }

  body.home-page-pro .home-inline-search-form .home-search-actions .button {
    width: 100%;
  }
}

/* Homepage stays/flights tabs and the combined range calendar. */
body.home-page-pro [data-home-search-panel][hidden] {
  display: none !important;
}

body.home-page-pro .home-inline-search-form .search-flight-fields[hidden] {
  display: none !important;
}

body.home-page-pro .home-pro-search-heading {
  grid-template-columns: 1fr;
  align-items: start;
}

body.home-page-pro .home-pro-search-modes :is(a, button) {
  min-height: 30px;
  padding: 7px 11px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--home-pro-muted);
  cursor: pointer;
  font: inherit;
  font-size: 0.7rem;
  font-weight: 850;
  text-decoration: none;
}

body.home-page-pro .home-pro-search-modes :is(a, button).is-active {
  background: #267b60;
  color: #ffffff;
}

body.home-page-pro .home-inline-search-form .field-group-stay-dates {
  grid-column: span 6;
}

body.home-page-pro .home-inline-search-form .home-date-trigger {
  min-height: 48px;
  padding: 0 12px;
  border-color: rgba(22, 73, 64, 0.13);
  border-radius: 11px;
  background: #f4f8f6;
  color: #52635e;
  box-shadow: none;
}

body.home-page-pro .home-inline-search-form .home-date-trigger.has-value {
  color: #173d3b;
}

body.home-page-pro .home-inline-date-panel {
  z-index: 80;
  width: min(560px, calc(100vw - 42px));
  padding: 16px;
  border: 1px solid rgba(22, 73, 64, 0.13);
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 24px 60px rgba(18, 65, 61, 0.2);
}

body.home-page-pro .home-inline-date-panel-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  margin-bottom: 12px;
}

body.home-page-pro .home-inline-date-panel-head strong {
  color: #173d3b;
  font-size: 0.86rem;
}

body.home-page-pro .home-inline-date-panel-head button {
  min-height: 34px;
  padding: 6px 10px;
  border: 1px solid #dce5df;
  border-radius: 9px;
  background: #f5f8f6;
  color: #36534d;
  cursor: pointer;
  font: inherit;
  font-size: 0.7rem;
  font-weight: 800;
}

body.home-page-pro .home-preferred-time-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 12px 0;
}

body.home-page-pro .home-preferred-time-grid label {
  display: grid;
  gap: 5px;
}

body.home-page-pro .home-preferred-time-grid label span {
  color: #61706a;
  font-size: 0.64rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

body.home-page-pro .home-preferred-time-grid select {
  width: 100%;
  min-height: 42px;
  padding: 8px 10px;
  border: 1px solid #dce5df;
  border-radius: 9px;
  background: #f5f8f6;
  color: #173d3b;
  font: 700 0.76rem var(--font-sans);
}

body.home-page-pro .home-inline-flight-form {
  display: block;
}

body.home-page-pro .home-flight-search-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 8px;
  align-items: end;
}

body.home-page-pro .home-flight-search-grid > .field-group:nth-of-type(1),
body.home-page-pro .home-flight-search-grid > .field-group:nth-of-type(2) {
  grid-column: span 3;
}

body.home-page-pro .home-flight-search-grid > .field-group:nth-of-type(3),
body.home-page-pro .home-flight-search-grid > .field-group:nth-of-type(4) {
  grid-column: span 2;
}

body.home-page-pro .home-flight-search-grid > .field-group:nth-of-type(5),
body.home-page-pro .home-flight-search-grid > .field-group:nth-of-type(6) {
  grid-column: span 1;
}

body.home-page-pro .home-flight-search-grid .home-search-actions {
  grid-column: 1 / -1;
  justify-content: flex-end;
}

body.home-page-pro .home-flight-search-grid .home-search-actions .button {
  width: min(180px, 100%);
  min-height: 46px;
  border-color: #267b60;
  border-radius: 11px;
  background: #267b60;
  color: #ffffff;
}

body.home-page-pro .home-flight-search-grid select.home-search-input {
  padding-inline: 8px;
  font-size: 0.7rem;
}

@media (max-width: 1020px) {
  body.home-page-pro .home-flight-search-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.home-page-pro .home-flight-search-grid > .field-group:nth-of-type(n) {
    grid-column: span 1;
  }

  body.home-page-pro .home-flight-search-grid .home-search-actions {
    grid-column: 1 / -1;
  }
}

@media (max-width: 600px) {
  body.home-page-pro .home-inline-search-form .field-group-stay-dates {
    grid-column: 1 / -1;
  }

  body.home-page-pro .home-inline-date-panel {
    position: fixed;
    inset: auto;
    top: max(10px, env(safe-area-inset-top));
    left: 50%;
    z-index: 1300;
    box-sizing: border-box;
    width: min(420px, calc(100% - 20px));
    height: auto;
    max-height: calc(100vh - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    max-height: calc(var(--visual-viewport-height, 100dvh) - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    padding: 14px 14px calc(16px + env(safe-area-inset-bottom));
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scroll-padding-bottom: calc(72px + env(safe-area-inset-bottom));
    touch-action: pan-y;
    border: 1px solid rgba(22, 73, 64, 0.14);
    border-radius: 18px;
    box-shadow: 0 28px 70px rgba(10, 42, 40, 0.3);
    transform: translateX(-50%);
  }

  body.home-page-pro .home-inline-date-panel .home-inline-date-panel-head {
    position: sticky;
    top: -14px;
    z-index: 6;
    margin: -14px -14px 12px;
    padding: 14px;
    border-bottom: 1px solid rgba(22, 73, 64, 0.1);
    background: rgba(255, 255, 255, 0.98);
  }

  body.home-page-pro .home-inline-date-panel .range-calendar-actions {
    position: sticky;
    bottom: calc(-16px - env(safe-area-inset-bottom));
    z-index: 5;
    margin: 0 -4px;
    padding: 10px 4px calc(4px + env(safe-area-inset-bottom));
    background: linear-gradient(180deg, rgba(255, 255, 255, 0), #ffffff 28%);
  }

  body.home-page-pro.date-popover-open {
    overflow: hidden;
  }

  body.home-page-pro.date-popover-open .mobile-bottom-dock {
    display: none !important;
  }

  body.home-page-pro .home-preferred-time-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.home-page-pro .home-flight-search-grid {
    grid-template-columns: 1fr;
  }

  body.home-page-pro .home-flight-search-grid > .field-group:nth-of-type(n),
  body.home-page-pro .home-flight-search-grid .home-search-actions {
    grid-column: 1;
  }

  body.home-page-pro .home-flight-search-grid .home-search-actions .button {
    width: 100%;
  }
}

@media (max-width: 720px) {
  body.home-page-pro .home-pro-hero,
  body.home-page-pro .home-pro-search-card,
  body.home-page-pro .home-inline-search-form .search-flight-shell,
  body.home-page-pro .home-inline-search-form .search-flight-fields,
  body.home-page-pro .home-inline-search-form .search-flight-fields .autocomplete {
    overflow: visible;
  }

  body.home-page-pro .home-inline-search-form .search-flight-fields .suggestions {
    position: static;
    inset: auto;
    box-sizing: border-box;
    width: 100%;
    max-height: min(260px, 38vh);
    max-height: min(260px, 38dvh);
    margin-top: 8px;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scroll-padding-block: 8px;
    scrollbar-gutter: stable;
    touch-action: pan-y;
    -webkit-overflow-scrolling: touch;
  }
}

/* Keep hotel results visually consistent with the homepage search experience. */
body.hotels-page:not(.hotel-map-page) .site-header {
  position: relative;
  top: auto;
}

body.hotels-page:not(.hotel-map-page) {
  background: #f7f9f7;
  color: #182019;
}

body.hotels-page:not(.hotel-map-page) .hotels-main-clean {
  gap: 28px;
  padding-top: 16px;
}

body.hotels-page:not(.hotel-map-page) .hotel-search-hero {
  gap: 14px;
}

body.hotels-page:not(.hotel-map-page) .hotel-search-hero-copy h1 {
  color: #182019;
  font-size: clamp(1.7rem, 3vw, 2.45rem);
  letter-spacing: -0.035em;
}

body.hotels-page:not(.hotel-map-page) .hotel-search-hero-copy > p:last-child {
  color: #687069;
  font-size: 0.86rem;
}

body.hotels-page:not(.hotel-map-page) .hotel-expedia-search {
  padding: 18px;
  border: 1px solid rgba(22, 73, 64, 0.13);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 16px 42px rgba(20, 72, 66, 0.08);
}

body.hotels-page:not(.hotel-map-page) .hotel-expedia-search-row {
  gap: 9px;
}

body.hotels-page:not(.hotel-map-page) .hotel-search-field > label {
  padding-left: 2px;
  color: #52635e;
  font-size: 0.64rem;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

body.hotels-page:not(.hotel-map-page) .hotel-search-control {
  min-height: 48px;
  border: 1px solid rgba(22, 73, 64, 0.13);
  border-radius: 11px;
  background: #f4f8f6;
  color: #36534d;
}

body.hotels-page:not(.hotel-map-page) .hotel-search-control input {
  min-height: 46px;
  color: #173d3b;
  font-size: 0.84rem;
}

body.hotels-page:not(.hotel-map-page) .hotel-search-date-button span {
  color: #36534d;
  font-size: 0.82rem;
}

body.hotels-page:not(.hotel-map-page) .hotel-search-control:focus-within,
body.hotels-page:not(.hotel-map-page) .hotel-search-date-button:focus-visible {
  border-color: #267b60;
  box-shadow: 0 0 0 3px rgba(38, 123, 96, 0.13);
}

body.hotels-page:not(.hotel-map-page) .hotel-search-submit {
  min-height: 48px;
  border-color: #267b60;
  border-radius: 11px;
  background: #267b60;
}

body.hotels-page:not(.hotel-map-page) .hotel-search-submit:hover {
  border-color: #185f49;
  background: #185f49;
}

body.hotels-page:not(.hotel-map-page) .hotel-flight-addon {
  margin-top: 11px;
}

body.hotels-page:not(.hotel-map-page) .hotel-flight-addon-fields[hidden] {
  display: none !important;
}

body.hotels-page:not(.hotel-map-page) .hotel-flight-addon-toggle {
  min-height: 40px;
  padding: 8px 11px;
  border: 1px solid rgba(22, 73, 64, 0.13);
  border-radius: 10px;
  background: #f4f8f6;
  color: #36534d;
  font-size: 0.76rem;
}

body.hotels-page:not(.hotel-map-page) .hotel-flight-addon-check {
  border-color: #78908a;
  border-radius: 5px;
}

body.hotels-page:not(.hotel-map-page) .hotel-flight-addon-toggle.is-active .hotel-flight-addon-check {
  border-color: #267b60;
  background: #267b60;
}

body.hotels-page:not(.hotel-map-page) .hotel-popular-shortcuts {
  color: #718079;
  font-size: 0.76rem;
}

body.hotels-page:not(.hotel-map-page) .hotel-popular-shortcuts button {
  color: #267b60;
}

body.hotels-page:not(.hotel-map-page) .hotel-date-panel {
  border-color: rgba(22, 73, 64, 0.13);
  background: #ffffff;
  box-shadow: 0 24px 60px rgba(18, 65, 61, 0.2);
}

.hotel-search-loading-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.hotel-search-loading-card {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid #e0e6e1;
  border-radius: 15px;
  background: #ffffff;
}

.hotel-search-loading-media,
.hotel-search-loading-line {
  display: block;
  overflow: hidden;
  border-radius: 9px;
  background: linear-gradient(90deg, #edf1ed 25%, #f8faf8 50%, #edf1ed 75%);
  background-size: 200% 100%;
  animation: hotel-search-loading-shimmer 1.25s linear infinite;
}

.hotel-search-loading-media {
  min-height: 170px;
}

.hotel-search-loading-line {
  width: 82%;
  height: 12px;
}

.hotel-search-loading-line.is-short {
  width: 42%;
}

.hotel-search-loading-line.is-price {
  width: 30%;
  height: 18px;
}

@keyframes hotel-search-loading-shimmer {
  from { background-position: 200% 0; }
  to { background-position: -200% 0; }
}

@media (max-width: 600px) {
  body.hotels-page:not(.hotel-map-page) .hotel-date-panel {
    position: fixed;
    inset: auto;
    top: 50%;
    left: 50%;
    z-index: 1300;
    width: min(420px, calc(100% - 24px));
    height: auto;
    max-height: 78dvh;
    padding: 14px;
    overflow-y: auto;
    border-radius: 18px;
    transform: translate(-50%, -50%);
  }

  body.hotels-page:not(.hotel-map-page) .hotel-expedia-search {
    padding: 14px;
    border-radius: 16px;
  }

  body.hotels-page:not(.hotel-map-page) .hotel-expedia-search-row {
    gap: 10px;
  }

  .hotel-search-loading-grid {
    grid-template-columns: 1fr;
  }

  .hotel-search-loading-card:nth-child(n + 3) {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hotel-search-loading-media,
  .hotel-search-loading-line {
    animation: none;
  }
}

/* Clean commerce system: black and white foundations with dark-green actions. */
:root {
  --bg: #f6f6f4;
  --surface: #ffffff;
  --surface-strong: #ffffff;
  --surface-soft: #f3f3f0;
  --ink: #111111;
  --muted: #656565;
  --line: #deded9;
  --green: #174c2e;
  --green-deep: #123f27;
  --green-soft: #eaf1ec;
  --green-wash: #f2f6f3;
  --shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
  --radius-xl: 12px;
  --radius-lg: 10px;
  --radius-md: 8px;
}

body:is(
  .home-page-pro,
  .hotels-page:not(.hotel-map-page),
  .flights-search-page,
  .hotel-detail-page,
  .hotel-room-page,
  .results-page,
  .cart-page,
  .checkout-page,
  .checkout-confirmation-page
) {
  background: #f6f6f4;
  color: #111111;
}

body:is(
  .home-page-pro,
  .hotels-page:not(.hotel-map-page),
  .flights-search-page,
  .hotel-detail-page,
  .hotel-room-page,
  .results-page,
  .cart-page,
  .checkout-page,
  .checkout-confirmation-page
) :is(h1, h2, h3, h4) {
  color: #111111;
  font-family: var(--font-sans);
}

body:is(
  .home-page-pro,
  .hotels-page:not(.hotel-map-page),
  .flights-search-page,
  .hotel-detail-page,
  .hotel-room-page,
  .results-page,
  .cart-page,
  .checkout-page,
  .checkout-confirmation-page
) .site-header {
  position: relative;
  top: auto;
  border: 0;
  border-bottom: 1px solid #deded9;
  border-radius: 0;
  background: #ffffff;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

body:is(
  .home-page-pro,
  .hotels-page:not(.hotel-map-page),
  .flights-search-page,
  .hotel-detail-page,
  .hotel-room-page,
  .results-page,
  .cart-page,
  .checkout-page,
  .checkout-confirmation-page
) .eyebrow {
  color: #174c2e;
  font-size: 0.68rem;
  font-weight: 850;
  letter-spacing: 0.1em;
}

body:is(
  .home-page-pro,
  .hotels-page:not(.hotel-map-page),
  .flights-search-page,
  .hotel-detail-page,
  .hotel-room-page,
  .results-page,
  .cart-page,
  .checkout-page,
  .checkout-confirmation-page
) .button {
  min-height: 46px;
  border-radius: 6px;
  box-shadow: none;
  font-weight: 780;
  transform: none;
}

body:is(
  .home-page-pro,
  .hotels-page:not(.hotel-map-page),
  .flights-search-page,
  .hotel-detail-page,
  .hotel-room-page,
  .results-page,
  .cart-page,
  .checkout-page,
  .checkout-confirmation-page
) .button-primary {
  border-color: #174c2e;
  background: #174c2e;
  color: #ffffff;
}

body:is(
  .home-page-pro,
  .hotels-page:not(.hotel-map-page),
  .flights-search-page,
  .hotel-detail-page,
  .hotel-room-page,
  .results-page,
  .cart-page,
  .checkout-page,
  .checkout-confirmation-page
) .button-primary:hover {
  border-color: #0d3520;
  background: #0d3520;
  color: #ffffff;
}

body:is(
  .home-page-pro,
  .hotels-page:not(.hotel-map-page),
  .flights-search-page,
  .hotel-detail-page,
  .hotel-room-page,
  .results-page,
  .cart-page,
  .checkout-page,
  .checkout-confirmation-page
) .button-secondary {
  border-color: #bdbdb7;
  background: #ffffff;
  color: #111111;
}

body:is(
  .home-page-pro,
  .hotels-page:not(.hotel-map-page),
  .flights-search-page,
  .hotel-detail-page,
  .hotel-room-page,
  .results-page,
  .cart-page,
  .checkout-page,
  .checkout-confirmation-page
) :is(input, select, textarea) {
  border-color: #c9c9c3;
  border-radius: 6px;
  background-color: #ffffff;
  color: #111111;
  box-shadow: none;
}

/* Homepage: retain the beach image, remove glass and oversized marketing UI. */
body.home-page-pro {
  --home-pro-green: #174c2e;
  --home-pro-green-dark: #123f27;
  --home-pro-black: #111111;
  --home-pro-muted: #656565;
  --home-pro-wash: #f3f3f0;
}

body.home-page-pro .home-main-pro {
  gap: clamp(56px, 7vw, 92px);
}

body.home-page-pro .home-pro-hero {
  border: 1px solid #d8d8d2;
  border-radius: 10px;
  background:
    linear-gradient(90deg, #ffffff 0%, rgba(255, 255, 255, 0.88) 39%, rgba(255, 255, 255, 0.12) 72%),
    url("/assets/home-beach-hotel-hero.png?v=20260730") center / cover no-repeat;
  box-shadow: none;
}

body.home-page-pro .home-pro-hero-copy h1 {
  max-width: 650px;
  color: #111111;
  font-size: clamp(2.8rem, 5vw, 4.8rem);
  letter-spacing: -0.055em;
  line-height: 0.96;
  text-shadow: none;
}

body.home-page-pro .home-pro-hero-copy h1 span,
body.home-page-pro .home-pro-hero-copy .eyebrow {
  color: #174c2e;
  text-shadow: none;
}

body.home-page-pro .home-pro-lede {
  color: #353535;
  text-shadow: none;
}

body.home-page-pro .home-pro-route-spotlight {
  border: 1px solid #d8d8d2;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

body.home-page-pro .home-pro-search-card {
  border: 1px solid #cfcfc9;
  border-top: 4px solid #174c2e;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.09);
}

body.home-page-pro .home-pro-search-modes {
  gap: 0;
  padding: 2px;
  border: 1px solid #d7d7d1;
  border-radius: 6px;
  background: #ffffff;
}

body.home-page-pro .home-pro-search-modes :is(a, button) {
  border-radius: 4px;
}

body.home-page-pro .home-pro-search-modes :is(a, button).is-active {
  background: #174c2e;
  color: #ffffff;
}

body.home-page-pro .home-inline-search-form :is(.home-input-shell, .home-search-input),
body.home-page-pro .home-inline-search-form .home-date-trigger,
body.home-page-pro .home-inline-search-form .search-flight-toggle {
  border-color: #c9c9c3;
  border-radius: 6px;
  background: #ffffff;
}

body.home-page-pro .home-inline-search-form :is(.home-input-shell, .home-search-input):focus-within,
body.home-page-pro .home-inline-search-form .home-date-trigger:focus-visible,
body.home-page-pro .home-inline-search-form .search-flight-toggle:focus-visible {
  border-color: #174c2e;
  box-shadow: 0 0 0 2px rgba(23, 76, 46, 0.14);
}

body.home-page-pro .home-inline-search-form .home-search-actions .button,
body.home-page-pro .home-flight-search-grid .home-search-actions .button {
  border-color: #174c2e;
  border-radius: 6px;
  background: #174c2e;
}

body.home-page-pro .home-inline-date-panel {
  border-color: #cfcfc9;
  border-radius: 8px;
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.16);
}

body.home-page-pro .home-pro-section-head h2,
body.home-page-pro .home-map-discovery-copy h2,
body.home-page-pro .home-pro-final-banner h2 {
  font-size: clamp(1.85rem, 3.2vw, 2.9rem);
  letter-spacing: -0.045em;
  line-height: 1.04;
}

body.home-page-pro .home-flight-deal-card {
  min-height: 220px;
  border: 1px solid #d8d8d2;
  border-radius: 8px;
  background: #ffffff;
  transition: border-color 160ms ease;
}

body.home-page-pro .home-flight-deal-card:hover {
  border-color: #174c2e;
  background: #ffffff;
  transform: none;
}

body.home-page-pro .home-flight-deal-kicker em,
body.home-page-pro .home-flight-deal-bottom strong,
body.home-page-pro .home-destination-copy > span {
  color: #174c2e;
}

body.home-page-pro .home-destination-banner,
body.home-page-pro .home-showcase-track > .featured-hotel-card,
body.home-page-pro .featured-hotel-card.hotel-browse-card,
body.home-page-pro .featured-hotel-card .hotel-card-media {
  border-radius: 8px;
}

body.home-page-pro .home-pro-arrow-button {
  border: 1px solid #111111;
  border-radius: 6px;
  background: #ffffff;
  color: #111111;
}

body.home-page-pro .home-map-discovery {
  border-radius: 10px;
  background: #111111;
}

body.home-page-pro .home-map-globe-wrap::after {
  display: none;
}

body.home-page-pro .home-pro-final-banner {
  min-height: 190px;
  border-radius: 8px;
  background: #174c2e;
  color: #ffffff;
}

body.home-page-pro .home-pro-final-banner :is(.eyebrow, h2) {
  color: #ffffff;
}

/* Search pages: plain white controls and compact, product-like result cards. */
body.hotels-page:not(.hotel-map-page),
body.flights-search-page {
  --travel-grass: #174c2e;
  --travel-grass-deep: #123f27;
  --travel-grass-pale: #eaf1ec;
}

body.hotels-page:not(.hotel-map-page) .hotel-expedia-search,
body.flights-search-page .flight-search-shell,
body.flights-search-page .flights-results-panel {
  border-color: #d6d6d0;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: none;
}

body.hotels-page:not(.hotel-map-page) .hotel-search-control,
body.hotels-page:not(.hotel-map-page) .hotel-flight-addon-toggle,
body.flights-search-page .flight-field-control {
  border-color: #c9c9c3;
  border-radius: 6px;
  background: #ffffff;
  color: #292929;
}

body.hotels-page:not(.hotel-map-page) .hotel-search-control:focus-within,
body.hotels-page:not(.hotel-map-page) .hotel-search-date-button:focus-visible,
body.flights-search-page .flight-field-control:focus-within {
  border-color: #174c2e;
  box-shadow: 0 0 0 2px rgba(23, 76, 46, 0.14);
}

body.hotels-page:not(.hotel-map-page) .hotel-search-submit,
body.flights-search-page .flight-search-submit {
  border-radius: 6px;
}

body.hotels-page:not(.hotel-map-page) .hotel-flight-addon-toggle.is-active {
  border-color: #174c2e;
  background: #eaf1ec;
  color: #123f27;
}

.hotels-filter-bar,
.hotel-destination-card,
body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card,
.flight-option-card,
body.flights-search-page .inline-flight-summary {
  border-color: #d6d6d0;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: none;
}

.hotel-destination-card-miami,
.hotel-destination-card-new-york,
.hotel-destination-card-beverly,
.hotel-destination-card-santa-monica {
  border-top: 1px solid #d6d6d0;
  border-left: 4px solid #174c2e;
  background: #ffffff;
}

body.hotels-page .hotels-lane-stack > .featured-hotel-card.hotel-browse-card:hover,
.flight-option-card:hover,
.flight-option-card.selected {
  border-color: #174c2e;
  box-shadow: none;
}

.flight-option-card.selected {
  box-shadow: inset 4px 0 #174c2e;
}

body.hotels-page .hotel-result-price .hotel-price-secondary-trip,
.hotel-result-policy,
.flight-selected-actions .checkout-total-row strong {
  color: #174c2e;
  font-weight: 800;
}

body.hotels-page .hotel-spec-pill,
.hotel-card-chip,
.featured-hotel-status {
  border-radius: 4px;
}

/* Hotel and flight selection: strong hierarchy without tinted bubbles. */
body.hotel-detail-page {
  --hotel-clean-green: #174c2e;
  --hotel-clean-green-deep: #123f27;
  --hotel-clean-green-pale: #eaf1ec;
}

body.hotel-detail-page .hotel-detail-copy h1,
body.cart-page .cart-hero h1,
body.results-page .results-hero h1,
body.checkout-page .results-hero h1 {
  font-size: clamp(2rem, 4vw, 3.2rem);
  letter-spacing: -0.045em;
  line-height: 1.02;
}

body.hotel-detail-page :is(
  .hotel-detail-gallery-card,
  .hotel-detail-gallery-hero,
  .hotel-detail-head-price-card,
  .hotel-detail-highlight-grid,
  .hotel-detail-location-grid,
  .hotel-detail-map-box,
  .hotel-detail-room-card,
  .hotel-room-picker-media
) {
  border-radius: 8px;
}

body.hotel-detail-page .hotel-detail-summary-card {
  border: 1px solid #d6d6d0;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: none;
}

body.hotel-detail-page .hotel-detail-total-block {
  padding: 16px;
  border: 0;
  border-radius: 6px;
  background: #174c2e;
}

body.hotel-detail-page .hotel-detail-total-block :is(.hotel-detail-total-label, strong, p) {
  color: #ffffff;
}

body.hotel-detail-page :is(.hotel-detail-pill-row .hotel-spec-pill, .hotel-detail-rooms-steps .hotel-spec-pill, .amenity-pill) {
  border: 1px solid #d8d8d2;
  border-radius: 4px;
  background: #ffffff;
  color: #303030;
}

body.hotel-detail-page .hotel-room-discount-badge {
  padding: 5px 8px;
  border-radius: 4px;
  background: #174c2e;
  color: #ffffff;
}

body.hotel-detail-page .hotel-room-flight-next,
body.hotel-detail-page .hotel-flight-estimate {
  border: 1px solid #d6d6d0;
  border-left: 4px solid #174c2e;
  border-radius: 6px;
  background: #ffffff;
}

body.results-page .results-main {
  gap: 24px;
}

body.results-page .hotel-flight-handoff {
  margin-top: 0;
  border: 1px solid #d6d6d0;
  border-top: 4px solid #174c2e;
  border-radius: 8px;
  background: #ffffff;
}

body.results-page .hotel-flight-handoff-step > span {
  border-radius: 4px;
  background: #111111;
}

body.results-page .hotel-flight-handoff-step.is-current > span {
  background: #174c2e;
}

body.results-page .hotel-flight-handoff-line {
  background: #c9c9c3;
}

body.results-page .hotel-flight-airport-toggle {
  color: #174c2e;
  font-weight: 800;
}

body.results-page .results-panel {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

body.results-page .results-head {
  padding-bottom: 14px;
  border-bottom: 1px solid #d6d6d0;
}

body.results-page .results-head h2 {
  font-size: clamp(1.45rem, 2.5vw, 2rem);
}

body.results-page .offer-card.bundle-flight-card {
  border-color: #d6d6d0;
  border-radius: 8px;
  box-shadow: none;
}

body.results-page .offer-card.bundle-flight-card.selected {
  border-color: #174c2e;
  box-shadow: inset 4px 0 #174c2e;
}

body.results-page .bundle-flight-card-head .offer-tag {
  border-radius: 4px;
  background: #174c2e;
  color: #ffffff;
}

body.results-page .bundle-flight-fare-details {
  background: #f6f6f4;
}

body.results-page .bundle-flight-select-top {
  box-shadow: none;
}

body.results-page .summary-total-card {
  border-top: 4px solid #174c2e;
}

body.results-page :is(#bundle-total, #selected-total, #selected-stay-amount) {
  color: #174c2e;
}

body.results-page .results-progressive-actions {
  display: flex;
  justify-content: center;
  padding: 4px 0 2px;
}

body.results-page .results-progressive-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 46px;
  padding: 11px 18px;
  border: 1px solid #bfcbbd;
  border-radius: 999px;
  background: #ffffff;
  color: #174c2e;
  cursor: pointer;
  font: 800 0.78rem/1.2 var(--font-sans);
  box-shadow: 0 7px 20px rgba(23, 76, 46, 0.08);
  transition: transform 220ms cubic-bezier(0.16, 1, 0.3, 1), border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}

body.results-page .results-progressive-toggle:hover {
  border-color: #174c2e;
  background: #f2f7f1;
  box-shadow: 0 10px 26px rgba(23, 76, 46, 0.13);
  transform: translateY(-2px);
}

body.results-page .results-progressive-toggle:active {
  transform: translateY(0) scale(0.97);
}

body.results-page .results-progressive-toggle svg {
  width: 18px;
  height: 18px;
  transition: transform 280ms cubic-bezier(0.16, 1, 0.3, 1);
}

body.results-page .results-progressive-toggle.is-expanded svg {
  transform: rotate(180deg);
}

body.results-page .results-reveal-card {
  animation: results-card-reveal 480ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

body.results-page .results-reveal-card:nth-child(4) { animation-delay: 45ms; }
body.results-page .results-reveal-card:nth-child(5) { animation-delay: 90ms; }
body.results-page .results-reveal-card:nth-child(n + 6) { animation-delay: 130ms; }

@keyframes results-card-reveal {
  from {
    opacity: 0;
    transform: translateY(-16px) scale(0.985);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

body.results-room-modal-open {
  overflow: hidden;
}

.results-room-modal[hidden] {
  display: none !important;
}

.results-room-modal {
  position: fixed;
  inset: 0;
  z-index: 260;
  display: grid;
  place-items: center;
  padding: 22px;
  opacity: 0;
  transition: opacity 240ms ease;
}

.results-room-modal.is-open {
  opacity: 1;
}

.results-room-modal-backdrop {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  background: rgba(9, 24, 15, 0.58);
  cursor: default;
  backdrop-filter: blur(7px);
}

.results-room-modal-dialog {
  position: relative;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  width: min(880px, 100%);
  max-height: min(820px, calc(100dvh - 44px));
  overflow: hidden;
  border: 1px solid rgba(23, 76, 46, 0.18);
  border-radius: 22px;
  background: #f7f8f5;
  box-shadow: 0 34px 100px rgba(4, 25, 13, 0.34);
  transform: translateY(24px) scale(0.97);
  transition: transform 380ms cubic-bezier(0.16, 1, 0.3, 1);
}

.results-room-modal.is-open .results-room-modal-dialog {
  transform: translateY(0) scale(1);
}

.results-room-modal-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 20px 22px 18px;
  border-bottom: 1px solid #dfe4dc;
  background: #ffffff;
}

.results-room-modal-head .eyebrow {
  margin: 0 0 5px;
  color: #267b31;
  font-size: 0.67rem;
}

.results-room-modal-head h2 {
  margin: 0;
  color: #111d14;
  font-size: clamp(1.25rem, 2.5vw, 1.75rem);
}

.results-room-modal-head p:last-child {
  margin: 5px 0 0;
  color: #69716a;
  font-size: 0.78rem;
}

.results-room-modal-close {
  display: grid;
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  padding: 0;
  place-items: center;
  border: 1px solid #d7ded4;
  border-radius: 50%;
  background: #f7f9f6;
  color: #26372a;
  cursor: pointer;
  transition: transform 180ms ease, background 180ms ease, border-color 180ms ease;
}

.results-room-modal-close:hover {
  border-color: #aebdab;
  background: #ecf3ea;
  transform: rotate(5deg) scale(1.04);
}

.results-room-modal-close svg {
  width: 21px;
  height: 21px;
}

.results-room-modal-content {
  display: grid;
  gap: 16px;
  min-height: 150px;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 20px 22px;
  scrollbar-color: #b9c6b7 transparent;
}

.results-room-modal-content > .results-state {
  display: grid;
  min-height: 150px;
  margin: 0;
  place-items: center;
  border: 1px dashed #cdd6ca;
  border-radius: 14px;
  background: #ffffff;
  color: #4e5f52;
}

.results-room-modal-content > .results-state.is-loading::before {
  width: 28px;
  height: 28px;
  margin-right: 10px;
  border: 3px solid #d8e4d5;
  border-top-color: #267b31;
  border-radius: 50%;
  content: "";
  animation: results-room-spin 750ms linear infinite;
}

.results-room-modal-content .stay-room-card {
  display: grid;
  gap: 16px;
  border-color: #d9dfd6;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 8px 28px rgba(24, 50, 34, 0.06);
  animation: results-card-reveal 420ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.results-room-modal-content .stay-rate-card {
  border-radius: 10px;
  background: #f7f8f5;
}

.results-room-modal-content .stay-rate-card.selected {
  background: #f1f7ef;
}

.results-room-modal-note {
  margin: 0;
  padding: 12px 22px 14px;
  border-top: 1px solid #dfe4dc;
  background: #ffffff;
  color: #6c746d;
  font-size: 0.68rem;
  line-height: 1.45;
  text-align: center;
}

@keyframes results-room-spin {
  to { transform: rotate(360deg); }
}

@media (max-width: 720px) {
  body.results-page.results-checkout-ready .page-shell {
    padding-bottom: calc(190px + env(safe-area-inset-bottom));
  }

  body.results-page .floating-trip-button {
    bottom: calc(70px + env(safe-area-inset-bottom));
    z-index: 60;
    grid-template-columns: 38px minmax(0, 1fr) auto 18px;
    width: calc(100% - 16px);
    min-height: 68px;
    padding: 9px 11px 9px 9px;
    gap: 9px;
    border-radius: 19px;
    box-shadow: 0 16px 38px rgba(8, 39, 21, 0.28);
  }

  body.results-page .floating-trip-icon {
    width: 38px;
    height: 38px;
    border-radius: 11px;
  }

  body.results-page .floating-trip-price {
    max-width: 43vw;
    padding: 5px 7px;
  }

  body.results-page .floating-trip-copy strong {
    font-size: 0.8rem;
  }

  body.results-page .floating-trip-price strong {
    overflow: hidden;
    font-size: 0.82rem;
    text-overflow: ellipsis;
  }

  body.results-page #continue-checkout-button {
    min-height: 56px;
    border-radius: 15px;
    font-size: 0.86rem;
    box-shadow: 0 10px 24px rgba(23, 76, 46, 0.2);
  }

  .results-room-modal {
    align-items: end;
    padding: 0;
  }

  .results-room-modal-dialog {
    width: 100%;
    max-height: 92dvh;
    border-width: 1px 0 0;
    border-radius: 20px 20px 0 0;
    transform: translateY(36px);
  }

  .results-room-modal-head {
    padding: 17px 16px 14px;
  }

  .results-room-modal-content {
    padding: 14px;
  }

  .results-room-modal-content .stay-room-card {
    padding: 14px;
  }

  .results-room-modal-content .stay-card-top {
    align-items: flex-start;
  }

  .results-room-modal-content .stay-media {
    width: 92px;
    min-width: 92px;
    height: 78px;
    border-radius: 10px;
  }

  .results-room-modal-content .result-price-row {
    align-items: stretch;
    flex-direction: column;
  }

  .results-room-modal-content .button-select {
    width: 100%;
  }

  .results-room-modal-note {
    padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
  }
}

@media (max-width: 390px) {
  body.results-page .floating-trip-button {
    grid-template-columns: minmax(0, 1fr) auto 18px;
  }

  body.results-page .floating-trip-icon {
    display: none;
  }

  body.results-page .floating-trip-price {
    max-width: 46vw;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.results-page .results-progressive-toggle,
  body.results-page .results-progressive-toggle svg,
  body.results-page .floating-trip-button,
  body.results-page .floating-trip-chevron,
  .results-room-modal,
  .results-room-modal-dialog {
    transition: none;
  }

  body.results-page .results-reveal-card,
  .results-room-modal-content .stay-room-card,
  .results-room-modal-content > .results-state.is-loading::before {
    animation: none;
  }
}

/* Review and checkout: totals and next actions carry the green emphasis. */
.booking-progress {
  border-color: #d6d6d0;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: none;
}

.booking-progress-marker {
  border-radius: 4px;
}

.booking-progress .is-current .booking-progress-marker {
  border-color: #174c2e;
  background: #174c2e;
  color: #ffffff;
  box-shadow: none;
}

.booking-progress .is-complete .booking-progress-marker,
.booking-progress li.is-complete:not(:last-child)::after {
  border-color: #174c2e;
  background: #174c2e;
}

body.cart-page :is(.cart-items-panel, .cart-product-card, .cart-summary-card, .cart-empty-card),
body.checkout-page :is(.results-panel, .checkout-card, .checkout-form-section, .checkout-detail-card),
body.checkout-confirmation-page :is(.results-panel, .checkout-card) {
  border: 1px solid #d6d6d0;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: none;
  backdrop-filter: none;
}

body.cart-page :is(.cart-kpi-card, .cart-dates-card, .cart-item-status, .cart-flight-product),
body.checkout-page :is(.checkout-scope-callout, .checkout-terms-row, .checkout-payment-timing) {
  border-radius: 6px;
  background: #f3f3f0;
}

body.cart-page .cart-layout.has-trip-bundle .cart-flight-product {
  border-color: #174c2e;
  background: #ffffff;
}

body.cart-page .cart-layout.has-trip-bundle .cart-section-heading span,
body.cart-page .cart-item-status {
  border-radius: 4px;
  background: #eaf1ec;
  color: #123f27;
}

body.cart-page .cart-summary-total {
  padding: 16px;
  border: 0;
  border-radius: 6px;
  background: #174c2e;
}

body.cart-page .cart-summary-total > :is(span, strong, small) {
  color: #ffffff;
}

body.checkout-page .checkout-payment-timing-total {
  margin-top: 8px;
  padding: 14px;
  border: 0;
  border-radius: 6px;
  background: #174c2e;
}

body.checkout-page .checkout-payment-timing-total :is(span, strong) {
  color: #ffffff;
}

body.checkout-page .checkout-verified-badge,
body.checkout-page .checkout-form-section-head > span {
  border-radius: 4px;
  background: #174c2e;
  color: #ffffff;
}

body.checkout-page #pay-now-button {
  border-radius: 6px;
}

/* Support is intentionally one of the few full green surfaces. */
.footer-support-card {
  border-color: #174c2e;
  border-radius: 8px;
  background: #174c2e;
}

.footer-support-icon {
  border-radius: 6px;
  background: #ffffff;
  color: #174c2e;
}

.footer-support-card :is(.footer-support-label, h3, p, a),
.footer-support-card p:not(.footer-support-label) {
  color: #ffffff !important;
}

.footer-action,
.account-menu-panel,
.header-action-button {
  border-radius: 6px;
}

.site-footer,
body.home-page .site-footer {
  border-top-color: #174c2e;
}

.footer-action-primary {
  border-color: #174c2e;
  background: #174c2e;
}

.footer-action-primary:hover {
  border-color: #0d3520;
  background: #0d3520;
}

.footer-heading,
.footer-column a:hover,
body.home-page .footer-column a:hover,
.footer-trust-number {
  color: #174c2e !important;
}

@media (max-width: 720px) {
  body.home-page-pro .home-pro-hero {
    border-radius: 8px;
  }

  body.home-page-pro .home-pro-hero-copy h1 {
    font-size: clamp(2.35rem, 12vw, 3.25rem);
  }

  body.home-page-pro .home-pro-search-card,
  body.home-page-pro .home-inline-date-panel,
  body.hotels-page:not(.hotel-map-page) .hotel-expedia-search,
  body.flights-search-page .flight-search-shell,
  body.results-page .offer-card.bundle-flight-card,
  body.cart-page :is(.cart-product-card, .cart-summary-card, .cart-empty-card) {
    border-radius: 8px;
  }

  body:is(.cart-page, .checkout-page, .checkout-confirmation-page, .hotel-room-page) .booking-progress {
    border: 1px solid #d6d6d0;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: none;
  }

  .mobile-bottom-dock {
    border-top: 1px solid #d6d6d0;
    border-radius: 0;
    background: #ffffff;
    box-shadow: 0 -4px 14px rgba(0, 0, 0, 0.07);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  .mobile-bottom-dock .mobile-dock-action {
    border-radius: 4px;
  }

  .mobile-bottom-dock .mobile-dock-cart {
    background: #174c2e;
    color: #ffffff;
  }
}

/* Focused hotel-to-flight handoff */
body.add-flight-page {
  background: #f5f5f2;
}

body.add-flight-page .add-flight-main {
  display: grid;
  gap: 24px;
  width: min(1120px, 100%);
  margin: 28px auto 0;
}

.add-flight-flow {
  display: grid;
  gap: 24px;
}

.add-flight-hero {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 32px;
  padding-bottom: 22px;
  border-bottom: 1px solid #d6d6d0;
}

.add-flight-hero > div {
  display: grid;
  gap: 7px;
}

body.add-flight-page .add-flight-hero h1,
body.add-flight-page .add-flight-empty h1 {
  margin: 0;
  color: #111111;
  font-family: "Manrope", sans-serif;
  font-size: clamp(2rem, 4.5vw, 3.3rem);
  font-weight: 800;
  letter-spacing: -0.055em;
  line-height: 1.02;
}

.add-flight-hero > p {
  max-width: 440px;
  margin: 0;
  color: #5f655f;
  font-size: 0.9rem;
  line-height: 1.6;
}

.add-flight-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(340px, 0.72fr);
  gap: 22px;
  align-items: start;
}

.add-flight-route-card,
.add-flight-search-card,
.add-flight-empty {
  border: 1px solid #d6d6d0;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: none;
}

.add-flight-route-card {
  display: grid;
  gap: 0;
  min-width: 0;
  overflow: visible;
}

.add-flight-hotel-row {
  display: grid;
  grid-template-columns: 104px minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  padding: 20px;
  border-bottom: 1px solid #e0e0dc;
}

.add-flight-hotel-media {
  display: grid;
  place-items: center;
  width: 104px;
  height: 84px;
  overflow: hidden;
  border-radius: 6px;
  background: #e7e9e5;
  color: #174c2e;
  font-size: 2rem;
  font-weight: 850;
}

.add-flight-hotel-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.add-flight-hotel-row > div:last-child {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.add-flight-hotel-row span,
.add-flight-prefill-heading span,
.add-flight-date-grid label > span,
.add-flight-traveler-row span {
  color: #6a706a;
  font-size: 0.68rem;
  font-weight: 850;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.add-flight-hotel-row h2,
.add-flight-hotel-row p {
  margin: 0;
}

.add-flight-hotel-row h2 {
  overflow-wrap: anywhere;
  color: #171917;
  font-family: "Manrope", sans-serif;
  font-size: 1.25rem;
  line-height: 1.25;
}

.add-flight-hotel-row p {
  color: #666d67;
  font-size: 0.82rem;
}

.add-flight-arrival-card {
  display: grid;
  gap: 10px;
  margin: 20px;
  padding: 20px;
  border: 1px solid #d3d9d3;
  border-left: 5px solid #174c2e;
  border-radius: 6px;
  background: #f8faf8;
}

.add-flight-arrival-heading {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 16px;
}

.add-flight-arrival-heading > div {
  display: grid;
  gap: 7px;
}

.add-flight-auto-label {
  justify-self: start;
  padding: 4px 7px;
  border-radius: 3px;
  background: #174c2e;
  color: #ffffff;
  font-size: 0.63rem;
  font-weight: 850;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

.add-flight-arrival-heading p,
.add-flight-arrival-card > p,
.add-flight-arrival-card h2 {
  margin: 0;
}

.add-flight-arrival-heading p {
  color: #5d665f;
  font-size: 0.72rem;
  font-weight: 750;
}

.add-flight-arrival-heading > strong {
  color: #174c2e;
  font-size: 1.75rem;
  letter-spacing: -0.04em;
}

.add-flight-arrival-card h2 {
  color: #151815;
  font-family: "Manrope", sans-serif;
  font-size: 1.4rem;
  line-height: 1.25;
}

.add-flight-arrival-card > p {
  color: #667068;
  font-size: 0.82rem;
}

.add-flight-distance {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 12px 0;
  border-top: 1px solid #dfe3de;
  border-bottom: 1px solid #dfe3de;
  color: #174c2e;
}

.add-flight-distance svg {
  flex: 0 0 auto;
  width: 21px;
  height: 21px;
}

.add-flight-distance strong {
  font-size: 0.83rem;
  line-height: 1.4;
}

.add-flight-origin label {
  color: #303831;
  font-size: 0.76rem;
  font-weight: 800;
}

.add-flight-search-card {
  display: grid;
  gap: 18px;
  padding: 22px;
  border-top: 4px solid #174c2e;
}

.add-flight-prefill-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 14px;
  border-bottom: 1px solid #deded9;
}

.add-flight-prefill-heading strong {
  color: #174c2e;
  font-size: 0.72rem;
}

.add-flight-date-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.add-flight-date-grid label,
.add-flight-origin {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.add-flight-search-card input {
  min-height: 48px;
  padding: 11px 12px;
  border: 1px solid #cfd3cd;
  border-radius: 5px;
  background: #ffffff;
  font-size: 0.82rem;
}

.add-flight-search-card input:focus {
  border-color: #174c2e;
  box-shadow: 0 0 0 3px rgba(23, 76, 46, 0.12);
}

.add-flight-traveler-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border: 1px solid #deded9;
  background: #f5f5f2;
}

.add-flight-traveler-row > div {
  display: grid;
  gap: 5px;
  padding: 12px;
}

.add-flight-traveler-row > div + div {
  border-left: 1px solid #deded9;
}

.add-flight-traveler-row strong {
  color: #202420;
  font-size: 0.83rem;
}

.add-flight-origin {
  padding-top: 4px;
}

.add-flight-origin label {
  color: #174c2e;
}

.add-flight-search-card .suggestions {
  border-radius: 5px;
}

.add-flight-search-status {
  margin: 0;
  padding-left: 10px;
  border-left: 3px solid #174c2e;
  color: #606861;
  font-size: 0.76rem;
  line-height: 1.5;
}

.add-flight-search-card .button {
  min-height: 50px;
  border-radius: 5px;
}

.add-flight-empty {
  display: grid;
  justify-items: start;
  gap: 14px;
  max-width: 620px;
  padding: 34px;
}

.add-flight-empty p {
  margin: 0;
  color: #5e655f;
  line-height: 1.6;
}

@media (max-width: 860px) {
  .add-flight-hero {
    display: grid;
    gap: 14px;
  }

  .add-flight-layout {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 720px) {
  body.add-flight-page .page-shell {
    padding-bottom: calc(68px + env(safe-area-inset-bottom));
  }

  body.add-flight-page .add-flight-main {
    gap: 18px;
    margin-top: 16px;
    padding-inline: 14px;
  }

  .add-flight-flow {
    gap: 18px;
  }

  body.add-flight-page .add-flight-hero h1 {
    font-size: clamp(2rem, 10vw, 2.65rem);
  }

  .add-flight-hero > p {
    font-size: 0.82rem;
  }

  .add-flight-hotel-row {
    grid-template-columns: 78px minmax(0, 1fr);
    gap: 13px;
    padding: 15px;
  }

  .add-flight-hotel-media {
    width: 78px;
    height: 68px;
  }

  .add-flight-arrival-card {
    margin: 15px;
    padding: 16px;
  }

  .add-flight-search-card {
    padding: 18px 15px;
  }
}

@media (max-width: 390px) {
  .add-flight-date-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Mobile navigation sits flush with the screen edge and stays out of the way of keyboards. */
@media (max-width: 720px) {
  .mobile-bottom-dock {
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    min-height: 64px;
    padding: 6px 10px calc(6px + env(safe-area-inset-bottom));
    border: 0;
    border-top: 1px solid #111111;
    border-radius: 0;
    background: #ffffff;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    transform: none;
  }

  .mobile-bottom-dock .mobile-dock-action,
  .mobile-bottom-dock .mobile-dock-action-map,
  .mobile-bottom-dock .mobile-dock-cart {
    min-height: 50px;
    border: 0;
    border-radius: 0;
    color: #111111;
    background: #ffffff;
    box-shadow: none;
  }

  body:is(.cart-page, .checkout-page) .mobile-bottom-dock .mobile-dock-cart {
    color: #ffffff;
    background: #111111;
  }

  .mobile-bottom-dock .mobile-dock-cart .cart-count {
    color: #ffffff;
    background: #111111;
  }

  body:is(.cart-page, .checkout-page) .mobile-bottom-dock .mobile-dock-cart .cart-count {
    color: #111111;
    background: #ffffff;
  }

  body.account-page .account-main {
    padding-bottom: max(94px, calc(80px + env(safe-area-inset-bottom)));
  }

  body.account-page .account-bottom-dock .account-bottom-action[aria-expanded="true"] {
    color: #ffffff;
    background: #111111;
  }

  body.account-page .account-bottom-dock .account-bottom-action svg {
    width: 21px;
    height: 21px;
  }

  body.virtual-keyboard-open .mobile-bottom-dock,
  body:has(input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]):focus, textarea:focus, select:focus, [contenteditable="true"]:focus) .mobile-bottom-dock {
    display: none !important;
  }
}

/* Keep business auth layout overrides after the shared account-access theme. */
body.auth-page.business-auth-page .auth-layout.business-auth-layout {
  width: min(1220px, 100%);
}

body.auth-page.business-auth-page .auth-card.business-auth-card {
  align-content: start;
}

body.auth-page.business-auth-page.business-signup-mode .business-auth-main {
  min-height: 0;
}

body.auth-page.business-auth-page.business-signup-mode .auth-layout.business-auth-layout {
  grid-template-columns: 1fr;
  width: min(940px, 100%);
}

body.auth-page.business-auth-page.business-signup-mode .business-auth-story {
  display: none;
}

body.auth-page.business-auth-page.business-signup-mode .auth-card.business-auth-card {
  padding: clamp(30px, 6vw, 68px);
}

body.auth-page.business-auth-page.business-invite-mode .auth-layout.business-auth-layout {
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
}

@media (max-width: 700px) {
  body.auth-page.business-auth-page.business-invite-mode .auth-layout.business-auth-layout {
    grid-template-columns: 1fr;
  }
}

/* Business workspace navigation */
body.business-page .site-header {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr) auto;
  gap: 16px;
}

body.business-page .site-header > .wordmark {
  justify-self: start;
}

body.business-page .site-header > .site-nav {
  justify-self: center;
}

body.business-page .site-header > .header-actions {
  justify-self: end;
}

.business-header-menu-button {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
  min-width: 82px;
  min-height: 46px;
  padding: 9px 13px;
  border: 1px solid #d5ddd3;
  border-radius: 12px;
  background: #f4f8f2;
  color: #1f672a;
  cursor: pointer;
  font: inherit;
  font-size: 0.76rem;
  font-weight: 780;
}

.business-header-menu-button:hover,
.business-header-menu-button[aria-expanded="true"] {
  border-color: #9ec599;
  background: #e8f5e5;
}

.business-header-menu-button svg {
  width: 21px;
  height: 21px;
}

.business-sidebar-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1190;
  border: 0;
  background: rgba(10, 18, 12, 0.48);
  cursor: pointer;
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}

.business-sidebar-backdrop[hidden] {
  display: none;
}

.business-sidebar {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 1200;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  width: min(360px, calc(100vw - 34px));
  background: #ffffff;
  color: #182019;
  box-shadow: 24px 0 64px rgba(10, 20, 13, 0.2);
  transform: translateX(-105%);
  transition: transform 220ms ease;
  visibility: hidden;
}

body.business-sidebar-open {
  overflow: hidden;
}

body.business-sidebar-open .business-sidebar {
  transform: translateX(0);
  visibility: visible;
}

.business-sidebar-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  min-height: 88px;
  padding: 18px 18px 18px 20px;
  border-bottom: 1px solid #e2e7e0;
}

.business-sidebar-head > div {
  display: flex;
  gap: 12px;
  min-width: 0;
  align-items: center;
}

.business-sidebar-mark {
  display: inline-grid;
  flex: 0 0 auto;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: #1f672a;
  color: #ffffff;
  font-size: 0.85rem;
  font-weight: 850;
}

.business-sidebar-head > div > div {
  display: grid;
  min-width: 0;
}

.business-sidebar-head small,
.business-sidebar-head strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.business-sidebar-head small {
  color: #7a827a;
  font-size: 0.64rem;
}

.business-sidebar-head strong {
  margin-top: 2px;
  font-size: 0.86rem;
}

.business-sidebar-close {
  display: inline-grid;
  flex: 0 0 auto;
  place-items: center;
  width: 40px;
  height: 40px;
  border: 1px solid #d9dfd7;
  border-radius: 10px;
  background: #ffffff;
  color: #333a34;
  cursor: pointer;
  font: inherit;
  font-size: 1.35rem;
  line-height: 1;
}

.business-sidebar-nav {
  display: grid;
  align-content: start;
  gap: 4px;
  padding: 18px 13px 26px;
  overflow-y: auto;
}

.business-sidebar-nav > p {
  margin: 14px 10px 6px;
  color: #8a918a;
  font-size: 0.62rem;
  font-weight: 820;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.business-sidebar-nav > p:first-child {
  margin-top: 0;
}

.business-sidebar-nav a,
.business-sidebar-nav button {
  display: grid;
  gap: 2px;
  width: 100%;
  min-height: 54px;
  padding: 10px 12px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #303731;
  cursor: pointer;
  font: inherit;
  text-align: left;
  text-decoration: none;
}

.business-sidebar-nav a:hover,
.business-sidebar-nav button:hover,
.business-sidebar-nav a.is-active {
  background: #edf7ea;
  color: #1f672a;
}

.business-sidebar-nav a.is-active {
  box-shadow: inset 3px 0 0 #54b948;
}

.business-sidebar-nav a span,
.business-sidebar-nav button span {
  font-size: 0.79rem;
  font-weight: 760;
}

.business-sidebar-nav a small,
.business-sidebar-nav button small {
  color: #7a827a;
  font-size: 0.65rem;
  line-height: 1.35;
}

.business-sidebar-nav [hidden] {
  display: none;
}

.business-sidebar-foot {
  display: grid;
  gap: 10px;
  padding: 18px 20px calc(20px + env(safe-area-inset-bottom));
  border-top: 1px solid #e2e7e0;
  background: #f6f8f5;
}

.business-sidebar-signout {
  width: 100%;
  min-height: 48px;
  border-color: #d4dcd2;
  background: #ffffff;
  color: #384039;
}

.business-sidebar-signout:hover {
  border-color: #b96557;
  background: #fff5f2;
  color: #8a382d;
}

.business-sidebar-foot strong,
.business-sidebar-foot p {
  margin: 0;
}

.business-sidebar-foot strong {
  font-size: 0.74rem;
}

.business-sidebar-foot p {
  margin-top: 5px;
  color: #6f776f;
  font-size: 0.67rem;
  line-height: 1.5;
}

@media (max-width: 900px) {
  body.business-page .site-header {
    grid-template-columns: auto auto minmax(0, 1fr) auto;
    gap: 10px;
  }

  .business-header-menu-button {
    width: 46px;
    min-width: 46px;
    padding: 0;
  }

  .business-header-menu-button span {
    display: none;
  }
}

@media (max-width: 720px) {
  body.business-page .site-header {
    grid-template-columns: auto minmax(0, 1fr) auto;
    grid-template-areas:
      "menu brand actions"
      "nav nav nav";
  }

  body.business-page .site-header > .business-header-menu-button {
    grid-area: menu;
  }

  body.business-page .site-header > .wordmark {
    grid-area: brand;
  }

  body.business-page .site-header > .header-actions {
    grid-area: actions;
  }

  body.business-page .site-header > .site-nav {
    grid-area: nav;
    justify-self: stretch;
  }

  .business-sidebar {
    width: min(340px, calc(100vw - 20px));
  }
}

@media (prefers-reduced-motion: reduce) {
  .business-sidebar {
    transition: none;
  }
}

/* Business travel policy and approval queue */
.business-manager-stack {
  display: grid;
  gap: 24px;
}

.business-manager-stack[hidden] {
  display: none;
}

.business-policy-form {
  display: grid;
  gap: 16px;
}

.business-policy-fieldset {
  display: grid;
  gap: 12px;
  min-width: 0;
  margin: 0;
  padding: 20px;
  border: 1px solid #dfe5dd;
  border-radius: 14px;
  background: #f8faf7;
}

.business-policy-fieldset legend {
  padding: 0 7px;
  color: #202820;
  font-size: 0.86rem;
  font-weight: 800;
}

.business-policy-fieldset > p,
.business-policy-submit p {
  margin: 0;
  color: #6d756e;
  font-size: 0.72rem;
  line-height: 1.5;
}

.business-policy-fieldset > label {
  color: #4c554d;
  font-size: 0.7rem;
  font-weight: 760;
}

.business-policy-money-input {
  display: grid;
  grid-template-columns: auto minmax(0, 260px);
  gap: 8px;
}

.business-policy-money-input span,
.business-policy-money-input input {
  min-height: 46px;
  border: 1px solid #d4dbd2;
  background: #ffffff;
}

.business-policy-money-input span {
  display: inline-flex;
  align-items: center;
  padding: 0 12px;
  border-radius: 9px;
  color: #4d554e;
  font-size: 0.72rem;
  font-weight: 800;
}

.business-policy-money-input input {
  width: 100%;
  padding: 10px 12px;
  border-radius: 9px;
  font: inherit;
}

.business-policy-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.business-policy-options label {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 14px;
  border: 1px solid #dce3da;
  border-radius: 11px;
  background: #ffffff;
  cursor: pointer;
}

.business-policy-options input {
  margin-top: 3px;
  accent-color: #277832;
}

.business-policy-options span {
  display: grid;
  gap: 3px;
}

.business-policy-options strong {
  font-size: 0.76rem;
}

.business-policy-options small {
  color: #747c75;
  font-size: 0.66rem;
  line-height: 1.4;
}

.business-policy-submit {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
}

.business-member-editor {
  width: min(900px, calc(100vw - 32px));
  max-height: min(860px, calc(100vh - 32px));
  margin: auto;
  padding: 0;
  overflow: auto;
  border: 0;
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 28px 80px rgba(18, 36, 20, 0.28);
}

.business-member-editor::backdrop {
  background: rgba(16, 27, 18, 0.58);
  backdrop-filter: blur(3px);
}

.business-member-editor-form {
  display: grid;
  gap: 16px;
  padding: 24px;
}

.business-member-editor-head {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: flex-start;
}

.business-member-editor-head h2,
.business-member-editor-head p {
  margin: 0;
}

.business-member-editor-head > div > p:last-child {
  margin-top: 5px;
  color: #6d756e;
  font-size: 0.72rem;
}

.business-member-editor-close {
  display: inline-grid;
  place-items: center;
  width: 38px;
  height: 38px;
  flex: 0 0 auto;
  border: 1px solid #d7ded5;
  border-radius: 10px;
  background: #ffffff;
  color: #4d554e;
  cursor: pointer;
  font-size: 1.35rem;
}

.business-member-editor-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.business-member-editor select {
  width: 100%;
  min-height: 46px;
  padding: 10px 12px;
  border: 1px solid #d4dbd2;
  border-radius: 9px;
  background: #ffffff;
  color: #303832;
  font: inherit;
}

.business-member-inherit-option {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 13px;
  border: 1px solid #bad5b6;
  border-radius: 10px;
  background: #eff8ed;
  cursor: pointer;
}

.business-member-inherit-option input {
  margin-top: 3px;
  accent-color: #277832;
}

.business-member-inherit-option span {
  display: grid;
  gap: 3px;
}

.business-member-inherit-option strong {
  font-size: 0.74rem;
}

.business-member-inherit-option small {
  color: #637165;
  font-size: 0.66rem;
  line-height: 1.4;
}

.business-member-editor .business-policy-options input:disabled + span {
  opacity: 0.55;
}

.business-member-editor-submit {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  padding-top: 4px;
}

.business-member-editor-submit p {
  margin: 0;
  color: #6d756e;
  font-size: 0.7rem;
}

.business-member-editor-submit > div {
  display: flex;
  gap: 8px;
  margin-left: auto;
}

.business-order-row.is-awaiting-approval {
  grid-template-columns: minmax(0, 1fr) minmax(105px, 0.28fr) minmax(100px, 0.25fr);
  padding: 18px;
  border: 1px solid #efca79;
  border-radius: 12px;
  background: #fffaf0;
}

.business-order-row.is-awaiting-approval + .business-order-row {
  border-top: 0;
}

.business-approval-actions {
  display: flex !important;
  grid-column: 1 / -1;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.business-approval-actions button {
  min-height: 38px;
  padding: 8px 12px;
  border: 1px solid #b9c7b6;
  border-radius: 8px;
  background: #ffffff;
  color: #354037;
  cursor: pointer;
  font: inherit;
  font-size: 0.68rem;
  font-weight: 760;
}

.business-approval-actions button:first-child {
  border-color: #277832;
  background: #277832;
  color: #ffffff;
}

.business-approval-actions small {
  margin-left: auto;
  color: #856820;
  font-size: 0.64rem;
}

@media (max-width: 700px) {
  .business-policy-options,
  .business-policy-money-input {
    grid-template-columns: 1fr;
  }

  .business-policy-submit,
  .business-approval-actions,
  .business-member-editor-submit {
    align-items: stretch;
    flex-direction: column;
  }

  .business-member-editor {
    width: calc(100vw - 16px);
    max-height: calc(100vh - 16px);
  }

  .business-member-editor-form {
    padding: 18px;
  }

  .business-member-editor-grid {
    grid-template-columns: 1fr;
  }

  .business-member-editor-submit > div {
    width: 100%;
    margin-left: 0;
  }

  .business-policy-submit .button,
  .business-approval-actions button,
  .business-member-editor-submit .button {
    width: 100%;
  }

  .business-approval-actions small {
    margin-left: 0;
  }
}

/* Hotel shopping uses a warm white canvas instead of the shared gray travel background. */
body.hotels-page:not(.hotel-map-page),
body.hotel-detail-page,
body.hotel-room-page {
  background: #fffdf8;
}

/* Keep the primary header utilities visually light while preserving full tap targets. */
.site-header .header-action-button.cart-button,
.site-header .header-action-button.profile-action-button,
.site-header .header-account-menu.is-open .account-menu-trigger,
.business-header-menu-button,
.business-header-menu-button:hover,
.business-header-menu-button[aria-expanded="true"] {
  width: 46px;
  min-width: 46px;
  height: 46px;
  min-height: 46px;
  padding: 0;
  gap: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  box-shadow: none;
}

.site-header .header-action-button.cart-button:hover,
.site-header .header-action-button.profile-action-button:hover,
.site-header .header-action-button.cart-button.is-active,
.site-header .header-account-menu.is-open .account-menu-trigger,
.business-header-menu-button:hover,
.business-header-menu-button[aria-expanded="true"] {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
  color: #267b31;
}

.site-header .cart-button:focus-visible,
.site-header .profile-action-button:focus-visible,
.business-header-menu-button:focus-visible {
  outline: 2px solid #267b31;
  outline-offset: 2px;
}

.site-header .cart-button-label,
.business-header-menu-button span {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.site-header .cart-button .cart-count {
  position: absolute;
  top: -2px;
  right: -2px;
}

/* Business reporting uses a clean product UI instead of the editorial display face. */
body.business-page .business-dashboard :is(h1, h2, h3) {
  font-family: var(--font-sans);
  font-weight: 800;
}

body.business-page .business-dashboard-hero h1 {
  font-size: clamp(2.4rem, 5vw, 4.5rem);
  letter-spacing: -0.055em;
  line-height: 0.98;
}

.business-analytics {
  display: grid;
  gap: 18px;
}

.business-analytics[hidden],
.business-chart-empty[hidden] {
  display: none;
}

.business-analytics-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
}

.business-analytics-head h2,
.business-analytics-head p {
  margin: 0;
}

.business-analytics-head h2 {
  margin-top: 5px;
  color: #17201a;
  font-size: clamp(1.55rem, 3vw, 2.35rem);
  letter-spacing: -0.045em;
}

.business-analytics-head > div:first-child > p:last-child {
  max-width: 640px;
  margin-top: 7px;
  color: #687169;
  font-size: 0.78rem;
  line-height: 1.55;
}

.business-range-switcher {
  display: inline-grid;
  grid-template-columns: repeat(4, auto);
  flex: 0 0 auto;
  gap: 3px;
  padding: 4px;
  border: 1px solid #d9dfd7;
  border-radius: 10px;
  background: #eef1ed;
}

.business-range-switcher button {
  min-height: 36px;
  padding: 7px 11px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #606861;
  cursor: pointer;
  font: inherit;
  font-size: 0.67rem;
  font-weight: 760;
  white-space: nowrap;
}

.business-range-switcher button:hover {
  color: #174c2e;
}

.business-range-switcher button.is-active {
  background: #ffffff;
  color: #174c2e;
  box-shadow: 0 1px 5px rgba(24, 50, 34, 0.1);
}

.business-range-switcher button:focus-visible {
  outline: 2px solid #267b31;
  outline-offset: 1px;
}

.business-chart-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.business-chart-card {
  min-width: 0;
  padding: 24px 22px 18px;
  overflow: hidden;
  border: 1px solid #dce2da;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 8px 24px rgba(24, 50, 34, 0.04);
}

.business-chart-summary {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
  min-height: 58px;
  margin-bottom: 12px;
}

.business-chart-summary > div {
  display: grid;
  gap: 3px;
}

.business-chart-summary span,
.business-chart-summary small {
  color: #6d756e;
  font-size: 0.68rem;
}

.business-chart-summary span {
  font-weight: 780;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.business-chart-summary strong {
  color: #17201a;
  font-size: clamp(1.55rem, 3vw, 2.2rem);
  letter-spacing: -0.045em;
  line-height: 1.1;
}

.business-chart-summary small {
  padding-bottom: 5px;
  text-align: right;
}

.business-chart-canvas {
  width: 100%;
  min-height: 210px;
}

.business-chart-canvas svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
  font-family: var(--font-sans);
}

.business-chart-gridlines line {
  stroke: #e5e9e3;
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

.business-chart-gridlines text {
  fill: #858d86;
  font-size: 12px;
  text-anchor: end;
}

.business-spend-area {
  fill: rgba(84, 185, 72, 0.12);
}

.business-spend-line {
  fill: none;
  stroke: #267b31;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

#business-spend-chart circle {
  fill: #ffffff;
  stroke: #267b31;
  stroke-width: 3;
  vector-effect: non-scaling-stroke;
}

.business-users-bars rect {
  fill: #54b948;
}

.business-chart-axis {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 0 2px 0 58px;
  color: #7b847c;
  font-size: 0.61rem;
}

.business-chart-empty {
  margin: 13px 0 0 58px;
  color: #6d756e;
  font-size: 0.69rem;
}

@media (max-width: 980px) {
  .business-analytics-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .business-chart-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 620px) {
  .business-range-switcher {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
  }

  .business-chart-card {
    padding: 20px 14px 16px;
  }

  .business-chart-summary {
    align-items: flex-start;
    flex-direction: column;
    gap: 5px;
  }

  .business-chart-summary small {
    padding: 0;
    text-align: left;
  }

  .business-chart-canvas {
    min-height: 170px;
  }
}

/* Compact AI travel search in the shared site header */
.site-header > .header-ai-search {
  position: relative;
  z-index: 18;
  flex: 1 1 310px;
  width: min(390px, 32vw);
  min-width: 230px;
  max-width: 390px;
}

.header-ai-search-form {
  position: relative;
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr) 34px;
  align-items: center;
  gap: 8px;
  min-height: 46px;
  padding: 5px 5px 5px 13px;
  border: 1px solid #cbd5ca;
  border-radius: 999px;
  background: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
  overflow: hidden;
  transform: translateY(0) scale(1);
  transition: transform 280ms cubic-bezier(0.16, 1, 0.3, 1), border-color 180ms ease, box-shadow 280ms ease, background 180ms ease;
  will-change: transform;
}

.header-ai-search-form:focus-within {
  border-color: #267b31;
  background: #ffffff;
  box-shadow: 0 0 0 3px rgba(38, 123, 49, 0.13);
  transform: translateY(-2px) scale(1.006);
}

.header-ai-search.is-open .header-ai-search-form {
  z-index: 142;
  border-color: #75a674;
  background: #ffffff;
  box-shadow: 0 7px 24px rgba(23, 76, 46, 0.14), 0 0 0 3px rgba(38, 123, 49, 0.1);
}

.header-ai-search-form:has(input[aria-invalid="true"]) {
  border-color: #a94b3b;
  box-shadow: 0 0 0 3px rgba(169, 75, 59, 0.1);
}

.header-ai-search-icon {
  width: 20px;
  height: 20px;
  color: #267b31;
}

.header-ai-search-form input {
  width: 100%;
  min-width: 0;
  height: 34px;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  box-shadow: none;
  color: #182019;
  font: 650 0.82rem/1.2 var(--font-sans);
}

.header-ai-search-form input::placeholder {
  color: #677168;
  opacity: 1;
}

.header-ai-search-form button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #174c2e;
  color: #ffffff;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  transition: transform 190ms cubic-bezier(0.16, 1, 0.3, 1), background 180ms ease, box-shadow 180ms ease;
}

.header-ai-search-form button:hover {
  background: #0e3821;
  box-shadow: 0 6px 15px rgba(14, 56, 33, 0.23);
  transform: scale(1.06);
}

.header-ai-search-form button:active {
  transform: scale(0.9);
}

.header-ai-search-form button:disabled {
  cursor: wait;
  opacity: 0.65;
}

.header-ai-search-form button svg {
  width: 19px;
  height: 19px;
}

.header-ai-search.is-working .header-ai-search-icon {
  animation: header-ai-pulse 900ms ease-in-out infinite alternate;
}

.header-ai-search.is-working .header-ai-search-form {
  animation: header-ai-searching-glow 1.45s ease-in-out infinite;
}

.header-ai-search.is-working .header-ai-search-form button::after {
  position: absolute;
  inset: 7px;
  border: 2px solid rgba(255, 255, 255, 0.28);
  border-top-color: #ffffff;
  border-radius: 50%;
  content: "";
  animation: header-ai-spin 700ms linear infinite;
}

.header-ai-search-form::before {
  position: absolute;
  top: -25%;
  left: -32%;
  width: 24%;
  height: 150%;
  background: linear-gradient(90deg, transparent, rgba(112, 198, 113, 0.3), transparent);
  content: "";
  opacity: 0;
  pointer-events: none;
  transform: rotate(10deg);
}

.header-ai-search.is-working .header-ai-search-form::before {
  animation: header-ai-composer-scan 1.65s ease-in-out infinite;
}

.header-ai-search.is-working .header-ai-search-form button svg {
  opacity: 0.18;
}

.header-ai-search-status {
  position: absolute;
  top: calc(100% + 9px);
  left: 0;
  width: min(420px, calc(100vw - 28px));
  padding: 11px 13px;
  border: 1px solid #dce3da;
  border-radius: 11px;
  background: #ffffff;
  box-shadow: 0 13px 32px rgba(24, 50, 34, 0.16);
  color: #465047;
  font-size: 0.73rem;
  font-weight: 650;
  line-height: 1.45;
}

.header-ai-search-status[data-tone="success"] {
  border-color: #bed8bb;
  color: #1f672a;
}

.header-ai-search-status[data-tone="error"] {
  border-color: #e5c8c2;
  color: #8a382d;
}

body.business-page .site-header {
  grid-template-columns: auto auto minmax(230px, 1fr) auto auto;
}

body.business-page .site-header > .header-ai-search {
  width: 100%;
  max-width: 390px;
  justify-self: center;
}

@keyframes header-ai-pulse {
  from { opacity: 0.45; transform: scale(0.92); }
  to { opacity: 1; transform: scale(1.06); }
}

@keyframes header-ai-spin {
  to { transform: rotate(360deg); }
}

@keyframes header-ai-searching-glow {
  0%, 100% { box-shadow: 0 0 0 3px rgba(38, 123, 49, 0.08), 0 7px 22px rgba(23, 76, 46, 0.09); }
  50% { box-shadow: 0 0 0 5px rgba(38, 123, 49, 0.14), 0 10px 30px rgba(23, 76, 46, 0.17); }
}

@keyframes header-ai-composer-scan {
  0% { left: -32%; opacity: 0; }
  18% { opacity: 1; }
  72%, 100% { left: 118%; opacity: 0; }
}

@media (min-width: 721px) and (max-width: 1050px) {
  .site-header {
    flex-wrap: wrap;
  }

  .site-header > .header-ai-search {
    order: 5;
    flex-basis: 100%;
    width: 100%;
    max-width: none;
  }

  body.business-page .site-header {
    grid-template-columns: auto auto minmax(0, 1fr) auto;
    grid-template-areas:
      "menu brand ai actions"
      "nav nav nav nav";
  }

  body.business-page .site-header > .business-header-menu-button { grid-area: menu; }
  body.business-page .site-header > .wordmark { grid-area: brand; }
  body.business-page .site-header > .header-ai-search { grid-area: ai; max-width: none; }
  body.business-page .site-header > .site-nav { grid-area: nav; }
  body.business-page .site-header > .header-actions { grid-area: actions; }
}

@media (max-width: 720px) {
  .site-header {
    grid-template-areas:
      "brand actions"
      "ai ai"
      "nav nav";
  }

  .site-header > .header-ai-search {
    grid-area: ai;
    width: 100%;
    min-width: 0;
    max-width: none;
  }

  .header-ai-search-form {
    min-height: 44px;
  }

  .header-ai-search-status {
    width: 100%;
  }

  body.business-page .site-header {
    grid-template-columns: auto minmax(0, 1fr) auto;
    grid-template-areas:
      "menu brand actions"
      "ai ai ai"
      "nav nav nav";
  }

  body.business-page .site-header > .header-ai-search {
    grid-area: ai;
  }
}

@media (prefers-reduced-motion: reduce) {
  .header-ai-search.is-working .header-ai-search-icon {
    animation: none;
  }
}

/* Header AI search opens into a full travel assistant */
.site-header > .header-ai-search {
  flex-basis: 350px;
  width: min(440px, 35vw);
  max-width: 440px;
}

body.ai-travel-chat-open {
  overflow: hidden;
}

body.ai-travel-chat-open .site-header {
  z-index: 140;
}

.header-ai-chat-panel[hidden],
.header-ai-chat-backdrop[hidden] {
  display: none !important;
}

.header-ai-chat-backdrop {
  position: fixed;
  inset: 0;
  z-index: 140;
  background: rgba(10, 24, 16, 0.52);
  backdrop-filter: blur(5px);
  opacity: 0;
  transition: opacity 280ms ease;
}

.header-ai-search.is-open .header-ai-chat-backdrop {
  opacity: 1;
}

.header-ai-chat-panel {
  position: fixed;
  top: 86px;
  left: 50%;
  z-index: 141;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto auto;
  width: min(780px, calc(100vw - 32px));
  height: min(760px, calc(100dvh - 106px));
  overflow: hidden;
  border: 1px solid rgba(24, 50, 34, 0.12);
  border-radius: 24px;
  background: #ffffff;
  box-shadow: 0 34px 90px rgba(9, 34, 20, 0.28);
  opacity: 0;
  transform: translate(-50%, -18px) scale(0.965);
  transform-origin: 50% 0;
  transition: opacity 260ms ease, transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
  will-change: transform, opacity;
}

.header-ai-search.is-open .header-ai-chat-panel {
  opacity: 1;
  transform: translate(-50%, 0) scale(1);
}

.header-ai-chat-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  min-width: 0;
  padding: 18px 20px;
  border-bottom: 1px solid #e7ece5;
  background: #ffffff;
}

.header-ai-chat-title-wrap {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 12px;
}

.header-ai-chat-title-wrap > div {
  min-width: 0;
}

.header-ai-chat-mark {
  display: grid;
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 13px;
  background: #e7f5e5;
  color: #21672c;
}

.header-ai-chat-mark svg {
  width: 22px;
  height: 22px;
}

.header-ai-chat-head h2,
.header-ai-chat-head p,
.header-ai-chat-message p,
.header-ai-results h3,
.header-ai-results h4,
.header-ai-results p {
  margin: 0;
}

.header-ai-chat-head h2 {
  color: #182019;
  font-size: 1rem;
  line-height: 1.2;
}

.header-ai-chat-head p {
  margin-top: 3px;
  overflow: hidden;
  color: #69736a;
  font-size: 0.72rem;
  font-weight: 550;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.header-ai-chat-close {
  display: grid;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  padding: 0;
  place-items: center;
  border: 1px solid #dce3da;
  border-radius: 50%;
  background: #f8faf7;
  color: #354037;
  cursor: pointer;
}

.header-ai-chat-close:hover {
  border-color: #bdc9bb;
  background: #eef3ec;
}

.header-ai-chat-close svg {
  width: 20px;
  height: 20px;
}

.header-ai-chat-log {
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 22px;
  background:
    radial-gradient(circle at 90% 0%, rgba(113, 194, 91, 0.1), transparent 28%),
    #f7f9f6;
  scrollbar-color: #bdc7bb transparent;
}

.header-ai-chat-message {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  width: min(620px, 92%);
  margin-bottom: 15px;
}

.header-ai-chat-message.is-dynamic {
  animation: header-ai-message-in 440ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.header-ai-chat-message.is-user.is-dynamic {
  transform-origin: 100% 0;
}

.header-ai-chat-message.is-user {
  flex-direction: row-reverse;
  margin-left: auto;
}

.header-ai-chat-avatar {
  display: grid;
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
  place-items: center;
  border-radius: 50%;
  background: #174c2e;
  color: #ffffff;
  font-size: 0.61rem;
  font-weight: 800;
  letter-spacing: -0.02em;
}

.header-ai-chat-message.is-user .header-ai-chat-avatar {
  background: #dce8d9;
  color: #25442c;
}

.header-ai-chat-message > div {
  padding: 12px 14px;
  border: 1px solid #dfe6dd;
  border-radius: 5px 16px 16px 16px;
  background: #ffffff;
  box-shadow: 0 7px 20px rgba(24, 50, 34, 0.06);
}

.header-ai-chat-message.is-user > div {
  border-color: #174c2e;
  border-radius: 16px 5px 16px 16px;
  background: #174c2e;
  color: #ffffff;
}

.header-ai-chat-message p {
  font-size: 0.83rem;
  font-weight: 560;
  line-height: 1.55;
}

.header-ai-prompt-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 3px 0 0 44px;
}

.header-ai-prompt-chips[hidden] {
  display: none;
}

.header-ai-prompt-chips button {
  padding: 9px 12px;
  border: 1px solid #cfd9cd;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.86);
  color: #2c5134;
  cursor: pointer;
  font: 700 0.7rem/1.2 var(--font-sans);
  transition: transform 190ms cubic-bezier(0.16, 1, 0.3, 1), border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}

.header-ai-prompt-chips button:hover {
  border-color: #70a96c;
  background: #ffffff;
  box-shadow: 0 7px 16px rgba(23, 76, 46, 0.1);
  transform: translateY(-2px);
}

.header-ai-chat-panel > .header-ai-search-status {
  position: static;
  top: auto;
  left: auto;
  width: auto;
  margin: 0;
  padding: 10px 20px;
  border: 0;
  border-top: 1px solid #e4eae2;
  border-radius: 0;
  background: #f0f7ee;
  box-shadow: none;
  color: #35603b;
  font-size: 0.7rem;
}

.header-ai-chat-panel > .header-ai-search-status[data-tone="error"] {
  border-color: #efd7d2;
  background: #fff4f1;
  color: #8a382d;
}

.header-ai-chat-panel > .header-ai-search-status[data-tone="loading"] {
  background: linear-gradient(100deg, #edf6eb 15%, #ffffff 42%, #edf6eb 70%);
  background-size: 220% 100%;
  animation: header-ai-status-shimmer 1.35s ease-in-out infinite;
}

.header-ai-chat-disclaimer {
  margin: 0 20px 12px;
  color: #7b847c;
  font-size: 0.62rem;
  font-weight: 550;
  line-height: 1.35;
  text-align: center;
}

.header-ai-results {
  width: min(680px, 100%);
  margin: 4px auto 18px;
  padding: 18px;
  border: 1px solid #d7e0d5;
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 12px 32px rgba(24, 50, 34, 0.08);
}

.header-ai-results.is-dynamic {
  animation: header-ai-results-in 520ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.header-ai-results-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.header-ai-results-head h3 {
  margin-top: 2px;
  color: #172219;
  font-size: 1.18rem;
}

.header-ai-results-head > button {
  padding: 7px 10px;
  border: 1px solid #d8e1d6;
  border-radius: 999px;
  background: #f7f9f6;
  color: #3c5741;
  cursor: pointer;
  font: 700 0.66rem/1.2 var(--font-sans);
}

.header-ai-result-kicker {
  color: #32703b;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  line-height: 1.3;
  text-transform: uppercase;
}

.header-ai-result-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 12px;
}

.header-ai-result-filters span {
  padding: 6px 8px;
  border-radius: 999px;
  background: #edf5eb;
  color: #315838;
  font-size: 0.62rem;
  font-weight: 700;
  text-transform: capitalize;
}

.header-ai-result-group {
  margin-top: 17px;
}

.header-ai-result-group > h3 {
  margin-bottom: 8px;
  color: #26352a;
  font-size: 0.78rem;
}

.header-ai-result-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 13px;
  padding: 12px;
  border: 1px solid #e0e6de;
  border-radius: 14px;
  background: #ffffff;
}

.header-ai-result-card + .header-ai-result-card {
  margin-top: 8px;
}

.header-ai-result-card-main {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 11px;
}

.header-ai-result-icon {
  display: grid;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 11px;
  background: #e8f3e6;
  color: #245f2e;
  font-size: 1rem;
}

.header-ai-result-card h4 {
  margin-top: 2px;
  overflow: hidden;
  color: #182019;
  font-size: 0.83rem;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.header-ai-result-card p:not(.header-ai-result-kicker) {
  margin-top: 3px;
  overflow: hidden;
  color: #727c73;
  font-size: 0.66rem;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.header-ai-result-price {
  display: grid;
  justify-items: end;
  min-width: 110px;
}

.header-ai-result-price small {
  color: #7a837b;
  font-size: 0.58rem;
  font-weight: 650;
}

.header-ai-result-price strong {
  margin-top: 1px;
  color: #174c2e;
  font-size: 0.91rem;
}

.header-ai-result-price a {
  margin-top: 6px;
  color: #245f2e;
  font-size: 0.66rem;
  font-weight: 800;
  text-decoration: none;
}

.header-ai-hotel-result {
  grid-template-columns: 68px minmax(0, 1fr) auto;
}

.header-ai-hotel-photo {
  display: grid;
  width: 68px;
  height: 62px;
  overflow: hidden;
  place-items: center;
  border-radius: 10px;
  background: #e3eee0;
  color: #315838;
  font-size: 1.25rem;
  font-weight: 800;
}

.header-ai-hotel-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.header-ai-hotel-copy {
  min-width: 0;
}

.header-ai-results-empty,
.header-ai-results-note {
  margin-top: 10px !important;
  padding: 10px 11px;
  border-radius: 10px;
  background: #f4f6f3;
  color: #5d675f;
  font-size: 0.69rem;
  font-weight: 600;
  line-height: 1.45;
}

.header-ai-view-all {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  margin-top: 16px;
  border-radius: 12px;
  background: #174c2e;
  color: #ffffff;
  font-size: 0.73rem;
  font-weight: 800;
  text-decoration: none;
  position: relative;
  overflow: hidden;
  transition: transform 220ms cubic-bezier(0.16, 1, 0.3, 1), background 180ms ease, box-shadow 220ms ease;
}

.header-ai-view-all:hover {
  background: #0e3821;
  box-shadow: 0 10px 24px rgba(14, 56, 33, 0.2);
  transform: translateY(-2px);
}

.header-ai-view-all:active {
  transform: scale(0.975);
}

.header-ai-view-all::before {
  position: absolute;
  top: -60%;
  left: -35%;
  width: 24%;
  height: 220%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.34), transparent);
  content: "";
  pointer-events: none;
  transform: rotate(14deg);
}

.header-ai-compact-results .header-ai-view-all::before {
  animation: header-ai-cta-sheen 2.8s ease-in-out 650ms infinite;
}

.header-ai-view-all span {
  transition: transform 220ms cubic-bezier(0.16, 1, 0.3, 1);
}

.header-ai-view-all:hover span {
  transform: translateX(4px);
}

@keyframes header-ai-message-in {
  from {
    opacity: 0;
    transform: translateY(12px) scale(0.97);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes header-ai-results-in {
  from {
    opacity: 0;
    transform: translateY(18px) scale(0.975);
    filter: blur(3px);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
    filter: blur(0);
  }
}

@keyframes header-ai-status-shimmer {
  0% { background-position: 100% 0; }
  100% { background-position: -100% 0; }
}

@keyframes header-ai-cta-sheen {
  0%, 55% { left: -35%; opacity: 0; }
  65% { opacity: 1; }
  88%, 100% { left: 120%; opacity: 0; }
}

@media (min-width: 721px) and (max-width: 1050px) {
  .site-header > .header-ai-search {
    max-width: none;
  }
}

@media (max-width: 720px) {
  .site-header > .header-ai-search {
    width: calc(100vw - 16px);
    max-width: none;
    justify-self: center;
  }

  body.ai-travel-chat-open {
    overflow: auto;
  }

  .header-ai-chat-backdrop {
    display: none !important;
  }

  .header-ai-chat-panel {
    position: absolute;
    inset: auto 0 auto 0;
    top: calc(100% + 7px);
    display: block;
    width: 100%;
    height: auto;
    max-height: min(42dvh, 340px);
    border: 1px solid #d7dfd5;
    border-radius: 15px;
    box-shadow: 0 18px 46px rgba(9, 34, 20, 0.2);
    transform: translateY(-5px);
  }

  .header-ai-search.is-open .header-ai-chat-panel {
    transform: translateY(0);
  }

  .header-ai-chat-head {
    display: none;
  }

  .header-ai-chat-log {
    max-height: min(25dvh, 190px);
    padding: 10px;
    background: #f7f9f6;
  }

  .header-ai-chat-message {
    width: 100%;
    margin-bottom: 8px;
  }

  .header-ai-search.has-started-search .header-ai-chat-log > .header-ai-chat-message:not(.is-dynamic),
  .header-ai-search.has-started-search .header-ai-prompt-chips,
  .header-ai-search.has-started-search .header-ai-chat-message.is-user {
    display: none;
  }

  .header-ai-chat-message.is-assistant .header-ai-chat-avatar {
    flex-basis: 29px;
    width: 29px;
    height: 29px;
    font-size: 0.56rem;
  }

  .header-ai-chat-message > div {
    padding: 9px 11px;
    border-radius: 4px 13px 13px 13px;
    box-shadow: none;
  }

  .header-ai-chat-message p {
    font-size: 0.75rem;
    line-height: 1.4;
  }

  .header-ai-prompt-chips {
    gap: 6px;
    margin: 0;
  }

  .header-ai-prompt-chips button {
    padding: 7px 9px;
    font-size: 0.64rem;
  }

  .header-ai-chat-disclaimer {
    display: none;
  }

  .header-ai-chat-panel > .header-ai-search-status {
    padding: 8px 10px;
    border-top: 0;
    font-size: 0.66rem;
  }

  .header-ai-results {
    padding: 13px;
  }

  .header-ai-compact-results {
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  .header-ai-compact-results .header-ai-view-all {
    min-height: 44px;
    margin: 0;
    border-radius: 11px;
    font-size: 0.78rem;
  }

  .header-ai-search.has-completed-search .header-ai-chat-log {
    max-height: none;
    padding: 8px;
  }

  .header-ai-search.has-completed-search .header-ai-chat-log > :not(.header-ai-compact-results),
  .header-ai-search.has-completed-search .header-ai-chat-disclaimer,
  .header-ai-search.has-completed-search .header-ai-search-status {
    display: none !important;
  }

  .header-ai-result-card,
  .header-ai-hotel-result {
    grid-template-columns: 54px minmax(0, 1fr);
  }

  .header-ai-flight-result .header-ai-result-card-main {
    grid-column: 1 / -1;
  }

  .header-ai-hotel-photo {
    width: 54px;
    height: 54px;
  }

  .header-ai-result-price {
    grid-column: 1 / -1;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    justify-items: start;
    width: 100%;
    min-width: 0;
    padding-top: 9px;
    border-top: 1px solid #e5eae3;
  }

  .header-ai-result-price small {
    grid-column: 1;
  }

  .header-ai-result-price strong {
    grid-column: 1;
  }

  .header-ai-result-price a {
    grid-row: 1 / 3;
    grid-column: 2;
    margin: 0;
    padding: 8px 10px;
    border-radius: 9px;
    background: #edf5eb;
  }

  body.ai-search-composing {
    overflow: hidden;
    overscroll-behavior: none;
  }

  body.ai-search-composing .site-header {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  body.ai-search-composing .mobile-bottom-dock {
    display: none !important;
  }

  .header-ai-search.is-composing {
    min-height: 44px;
  }

  .header-ai-search.is-composing .header-ai-search-form {
    position: fixed;
    top: calc(var(--visual-viewport-offset-top, 0px) + var(--visual-viewport-height, 100dvh) - 66px - env(safe-area-inset-bottom));
    right: 8px;
    left: 8px;
    z-index: 145;
    width: auto;
    min-height: 56px;
    padding: 6px 6px 6px 14px;
    border-color: rgba(72, 137, 76, 0.55);
    border-radius: 19px;
    background: #ffffff;
    box-shadow:
      0 18px 48px rgba(9, 34, 20, 0.2),
      0 0 0 1px rgba(89, 166, 91, 0.08),
      0 0 28px rgba(84, 185, 72, 0.11);
    transform: none;
    transform-origin: left center;
    transition:
      top 340ms cubic-bezier(0.16, 1, 0.3, 1),
      border-color 180ms ease,
      box-shadow 300ms ease;
  }

  .header-ai-search.is-composing .header-ai-search-form:focus-within {
    border-color: #267b31;
    box-shadow:
      0 20px 54px rgba(9, 34, 20, 0.22),
      0 0 0 3px rgba(84, 185, 72, 0.13),
      0 0 34px rgba(84, 185, 72, 0.13);
    transform: none;
  }

  .header-ai-search.is-composing .header-ai-search-form input {
    height: 42px;
    font-size: 16px;
  }

  .header-ai-search.is-composing .header-ai-search-form button {
    width: 42px;
    height: 42px;
  }

  .header-ai-search.is-composing .header-ai-chat-panel {
    position: fixed;
    top: calc(var(--visual-viewport-offset-top, 0px) + 8px);
    right: 8px;
    left: 8px;
    z-index: 143;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    width: auto;
    height: calc(var(--visual-viewport-height, 100dvh) - 82px - env(safe-area-inset-bottom));
    max-height: none;
    overflow: hidden;
    border: 1px solid rgba(59, 115, 63, 0.2);
    border-radius: 22px 22px 14px 14px;
    background: #ffffff;
    box-shadow: 0 24px 70px rgba(7, 29, 17, 0.22);
    opacity: 1;
    transform: none;
    transition:
      top 340ms cubic-bezier(0.16, 1, 0.3, 1),
      height 340ms cubic-bezier(0.16, 1, 0.3, 1),
      box-shadow 280ms ease;
    animation: header-ai-conversation-open 480ms cubic-bezier(0.16, 1, 0.3, 1) both;
  }

  .header-ai-search.is-composing .header-ai-chat-log {
    width: 100%;
    height: 100%;
    max-height: none;
    padding: 18px 14px 24px;
    overflow-y: auto;
    background:
      radial-gradient(circle at 12% 8%, rgba(84, 185, 72, 0.13), transparent 26%),
      radial-gradient(circle at 88% 75%, rgba(92, 155, 116, 0.09), transparent 30%),
      linear-gradient(180deg, #fbfdfb 0%, #f4f8f3 100%);
    scroll-padding-bottom: 22px;
    -webkit-overflow-scrolling: touch;
  }

  .header-ai-search.is-composing.has-started-search .header-ai-chat-log > .header-ai-chat-message.is-user,
  .header-ai-search.is-composing.has-completed-search .header-ai-chat-log > .header-ai-chat-message.is-assistant.is-dynamic {
    display: flex !important;
  }

  .header-ai-search.is-composing.has-completed-search .header-ai-chat-log > .header-ai-compact-results {
    display: block !important;
    margin-top: 4px;
  }

  .header-ai-search.is-composing .header-ai-chat-panel > .header-ai-search-status:not([hidden]) {
    display: block;
    padding: 10px 14px;
    border-top: 1px solid rgba(59, 115, 63, 0.12);
    background: rgba(242, 248, 240, 0.98);
  }
}

@keyframes header-ai-conversation-open {
  from {
    opacity: 0;
    transform: translateY(16px) scale(0.975);
    filter: blur(5px);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
    filter: blur(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .header-ai-chat-backdrop,
  .header-ai-chat-panel,
  .header-ai-search-form,
  .header-ai-search-form button,
  .header-ai-prompt-chips button,
  .header-ai-view-all,
  .header-ai-view-all span {
    transition: none;
  }

  .header-ai-search.is-composing .header-ai-chat-panel {
    animation: none;
  }

  .header-ai-search.is-working .header-ai-search-form,
  .header-ai-search.is-working .header-ai-search-icon,
  .header-ai-search.is-working .header-ai-search-form button::after,
  .header-ai-chat-message.is-dynamic,
  .header-ai-results.is-dynamic,
  .header-ai-chat-panel > .header-ai-search-status[data-tone="loading"],
  .header-ai-compact-results .header-ai-view-all::before {
    animation: none;
  }
}

/* Checkout and confirmation: a flatter, document-like finish. */
body.checkout-page .checkout-layout,
body.checkout-confirmation-page .confirmation-layout {
  gap: 20px;
}

body.checkout-page :is(.checkout-review-panel, .checkout-form-card),
body.checkout-confirmation-page :is(.confirmation-primary-card, .confirmation-summary-column > .checkout-card) {
  border-color: #d6d6d0;
  border-radius: 8px;
  box-shadow: none;
}

body.checkout-page .checkout-review-head,
body.checkout-page .checkout-price-heading {
  padding-bottom: 16px;
  border-bottom: 1px solid #d6d6d0;
}

body.checkout-page .checkout-verified-badge {
  padding: 3px 0 3px 10px;
  border-left: 2px solid #174c2e;
  border-radius: 0;
  color: #174c2e;
  background: transparent;
  letter-spacing: 0.04em;
}

body.checkout-page .checkout-detail-list,
body.checkout-confirmation-page .checkout-detail-list {
  gap: 0;
}

body.checkout-page .checkout-detail-card,
body.checkout-confirmation-page .checkout-detail-card {
  padding: 18px 0;
  border: 0;
  border-bottom: 1px solid #d6d6d0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.checkout-page .checkout-detail-card:first-child,
body.checkout-confirmation-page .checkout-detail-card:first-child {
  border-top: 1px solid #d6d6d0;
}

body.checkout-page .checkout-detail-card .offer-tag,
body.checkout-confirmation-page .checkout-detail-card .offer-tag {
  margin: 0 0 7px;
  padding: 0;
  border-radius: 0;
  color: #174c2e;
  background: transparent;
  font-size: 0.68rem;
  letter-spacing: 0.12em;
}

body.checkout-page .checkout-detail-card h3,
body.checkout-confirmation-page .checkout-detail-card h3 {
  margin-top: 0;
}

body.checkout-page .checkout-price-section {
  gap: 16px;
  margin-top: 26px;
  padding-top: 0;
  border-top: 0;
}

body.checkout-page .checkout-price-lines,
body.checkout-confirmation-page .checkout-price-lines {
  border: 1px solid #d6d6d0;
  border-right: 0;
  border-left: 0;
  border-radius: 0;
  background: transparent;
}

body.checkout-page .checkout-price-line,
body.checkout-confirmation-page .checkout-price-line {
  padding: 12px 0;
  background: transparent;
}

body.checkout-page .checkout-price-line + .checkout-price-line,
body.checkout-confirmation-page .checkout-price-line + .checkout-price-line {
  border-color: #e1e1dc;
}

body.checkout-page .checkout-price-line-due-at-accommodation,
body.checkout-confirmation-page .checkout-price-line-due-at-accommodation {
  padding-left: 12px;
  border-left: 3px solid #174c2e;
  background: transparent;
}

body.checkout-page .checkout-payment-timing,
body.checkout-confirmation-page .checkout-payment-timing {
  gap: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

body.checkout-page .checkout-payment-timing-row,
body.checkout-confirmation-page .checkout-payment-timing-row {
  padding: 12px 0;
}

body.checkout-page .checkout-payment-timing-primary,
body.checkout-confirmation-page .checkout-payment-timing-primary {
  border-bottom: 1px solid #d6d6d0;
}

body.checkout-page .checkout-payment-timing-total,
body.checkout-confirmation-page .checkout-payment-timing-total {
  margin-top: 0;
  padding: 15px 0 2px;
  border: 0;
  border-top: 2px solid #174c2e;
  border-radius: 0;
  background: transparent;
}

body.checkout-page .checkout-payment-timing-total :is(span, strong),
body.checkout-confirmation-page .checkout-payment-timing-total :is(span, strong) {
  color: #123f27;
}

body.checkout-page .checkout-disclosure-grid {
  gap: 0;
  border-bottom: 1px solid #d6d6d0;
}

body.checkout-page .checkout-disclosure-grid details {
  padding: 14px 0;
  border: 0;
  border-top: 1px solid #d6d6d0;
  border-radius: 0;
  background: transparent;
}

body.checkout-page .checkout-scope-callout {
  padding: 9px 0 9px 12px;
  border: 0;
  border-left: 3px solid #174c2e;
  border-radius: 0;
  color: #405246;
  background: #f6f6f3;
}

body.checkout-page .checkout-form-section-head > span {
  border-radius: 4px;
  box-shadow: none;
}

body.checkout-page :is(.field-group input, .field-group textarea, .card-element-shell) {
  border-color: #cfcfc9;
  border-radius: 6px;
  box-shadow: none;
}

body.checkout-page .checkout-terms-row {
  padding: 15px 0;
  border: 0;
  border-top: 1px solid #d6d6d0;
  border-bottom: 1px solid #d6d6d0;
  border-radius: 0;
  background: transparent;
}

body.checkout-page .checkout-submit-status {
  padding: 10px 0 0;
  border-top: 1px solid #e1e1dc;
  border-radius: 0;
  background: transparent;
}

body.checkout-page #pay-now-button,
body.checkout-page #checkout-retry-button,
body.checkout-page #checkout-recovery-link {
  border-radius: 6px;
}

body.checkout-confirmation-page .confirmation-primary-card {
  gap: 22px;
  padding: 24px;
}

body.checkout-confirmation-page .confirmation-status-banner {
  padding: 15px 16px;
  border: 0;
  border-left: 4px solid #bd8d00;
  border-radius: 0;
  background: #f6f6f3;
  box-shadow: none;
}

body.checkout-confirmation-page .confirmation-status-dot {
  width: 10px;
  height: 10px;
  margin-top: 4px;
  border-radius: 2px;
  box-shadow: none;
}

body.checkout-confirmation-page .confirmation-status-banner.is-confirmed {
  border-color: #267b31;
  background: #f4f7f3;
}

body.checkout-confirmation-page .confirmation-status-banner.is-confirmed .confirmation-status-dot,
body.checkout-confirmation-page .confirmation-status-banner.is-failed .confirmation-status-dot,
body.checkout-confirmation-page .confirmation-status-banner.is-refunded .confirmation-status-dot {
  box-shadow: none;
}

body.checkout-confirmation-page .confirmation-status-banner.is-failed,
body.checkout-confirmation-page .confirmation-status-banner.is-refunded {
  border-color: #a23f2a;
  background: #faf5f3;
}

body.checkout-confirmation-page .confirmation-reference-grid {
  gap: 0;
  border-top: 1px solid #d6d6d0;
  border-bottom: 1px solid #d6d6d0;
}

body.checkout-confirmation-page .confirmation-reference-grid > div {
  padding: 14px 16px;
  border: 0;
  border-radius: 0;
  background: transparent;
}

body.checkout-confirmation-page .confirmation-reference-grid > div:nth-child(even) {
  border-left: 1px solid #d6d6d0;
}

body.checkout-confirmation-page .confirmation-reference-grid > div:nth-child(n + 3) {
  border-top: 1px solid #d6d6d0;
}

body.checkout-confirmation-page .confirmation-section .results-head {
  padding-bottom: 16px;
  border-bottom: 1px solid #d6d6d0;
}

body.checkout-confirmation-page .confirmation-summary-column {
  gap: 14px;
}

body.checkout-confirmation-page .confirmation-summary-column > .checkout-card {
  gap: 14px;
  padding: 20px;
}

body.checkout-confirmation-page .confirmation-summary-column > .checkout-card > section {
  gap: 8px;
  padding: 14px 0;
  border: 0;
  border-top: 1px solid #d6d6d0;
  border-radius: 0;
  background: transparent;
}

body.checkout-confirmation-page .confirmation-summary-column > .checkout-card > section + section {
  padding-top: 14px;
}

body.checkout-confirmation-page .confirmation-help-card .button {
  border-radius: 6px;
}

@media (max-width: 680px) {
  body.checkout-page :is(.checkout-review-panel, .checkout-form-card),
  body.checkout-confirmation-page :is(.confirmation-primary-card, .confirmation-summary-column > .checkout-card) {
    padding: 18px;
  }

  body.checkout-page .checkout-review-head,
  body.checkout-page .checkout-price-heading {
    display: grid;
  }

  body.checkout-page .checkout-verified-badge {
    justify-self: start;
  }

  body.checkout-confirmation-page .confirmation-reference-grid > div:nth-child(even) {
    border-left: 0;
  }

  body.checkout-confirmation-page .confirmation-reference-grid > div + div {
    border-top: 1px solid #d6d6d0;
  }
}

/* Map searches run only when the traveler explicitly requests the visible area. */
body.hotel-map-page .hotel-map-search-area {
  position: absolute;
  top: 170px;
  left: 50%;
  z-index: 1140;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 9px 15px;
  border: 1px solid rgba(16, 55, 31, 0.22);
  border-radius: 8px;
  background: #ffffff;
  color: #174c2e;
  box-shadow: 0 8px 24px rgba(16, 19, 16, 0.18);
  cursor: pointer;
  font: inherit;
  font-size: 0.8rem;
  font-weight: 850;
  transform: translateX(-50%);
}

body.hotel-map-page .hotel-map-search-area[hidden] {
  display: none;
}

body.hotel-map-page .hotel-map-search-area:hover:not(:disabled),
body.hotel-map-page .hotel-map-search-area:focus-visible {
  border-color: #174c2e;
  background: #174c2e;
  color: #ffffff;
}

body.hotel-map-page .hotel-map-search-area:disabled {
  cursor: default;
  opacity: 0.88;
}

body.hotel-map-page .hotel-map-search-area svg {
  width: 17px;
  height: 17px;
  flex: 0 0 auto;
}

body.hotel-map-page .hotel-map-search-area.is-loading svg {
  animation: hotel-map-search-area-spin 900ms linear infinite;
}

@keyframes hotel-map-search-area-spin {
  to {
    transform: rotate(360deg);
  }
}

@media (max-width: 720px) {
  body.hotel-map-page .hotel-map-search-area {
    top: 68px;
    z-index: 1115;
    min-height: 40px;
    padding: 8px 13px;
    border-radius: 7px;
    font-size: 0.74rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.hotel-map-page .hotel-map-search-area.is-loading svg {
    animation: none;
  }
}

/* Shared travel-date picker: the homepage calendar language across every booking step. */
.travel-date-source-field {
  display: none !important;
}

.travel-date-enhanced-field {
  position: relative;
  min-width: 0;
}

.travel-date-picker {
  width: 100%;
}

.travel-date-trigger {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 48px;
  padding: 0 13px;
  border: 1px solid rgba(22, 73, 64, 0.13);
  border-radius: 11px;
  background: #f4f8f6;
  color: #52635e;
  box-shadow: none;
  cursor: pointer;
  font: inherit;
  font-size: 0.88rem;
  font-weight: 700;
  text-align: left;
}

.travel-date-trigger:hover,
.travel-date-trigger:focus-visible,
.travel-date-trigger.has-value {
  border-color: rgba(38, 123, 96, 0.48);
  color: #173d3b;
}

.travel-date-trigger:focus-visible {
  outline: 3px solid rgba(38, 123, 96, 0.16);
  outline-offset: 2px;
}

.travel-date-trigger svg {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
}

.travel-date-panel {
  z-index: 120;
  box-sizing: border-box;
  width: min(420px, calc(100vw - 32px));
  padding: 16px;
  border: 1px solid rgba(22, 73, 64, 0.13);
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 24px 60px rgba(18, 65, 61, 0.2);
}

.travel-date-feedback {
  margin: 10px 0 0;
  color: #80521b;
  font-size: 0.8rem;
  font-weight: 750;
  line-height: 1.45;
}

.travel-date-feedback[hidden] {
  display: none;
}

body.home-page-pro .home-flight-search-grid > .travel-date-enhanced-field {
  grid-column: span 4;
}

.flight-search-details-grid > .travel-date-enhanced-field,
#hotel-flight-airport-form > .travel-date-enhanced-field,
.hotel-customer-search > .travel-date-enhanced-field {
  grid-column: span 2;
}

.add-flight-date-grid > .travel-date-enhanced-field {
  grid-column: 1 / -1;
}

.hotel-customer-search > .travel-date-enhanced-field {
  min-width: 210px;
}

body.hotel-map-page .travel-date-trigger {
  min-height: 44px;
  border: 0;
  border-radius: 10px;
  background: #f1f5f0;
}

.hotel-detail-date-picker-block,
.cart-date-editor {
  display: grid;
  gap: 7px;
  margin-top: 18px;
}

.hotel-detail-date-picker-label,
.cart-date-editor-label {
  color: #51635b;
  font-size: 0.72rem;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.hotel-detail-sidebar .travel-date-panel,
.cart-product-card .travel-date-panel {
  right: 0;
  left: auto;
}

.checkout-date-editor {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(230px, 0.72fr);
  gap: 18px;
  align-items: end;
  margin: 22px 0 8px;
  padding: 18px;
  border: 1px solid #dfe8e2;
  border-radius: 14px;
  background: #f7faf8;
}

.checkout-date-editor[hidden],
.cart-date-editor[hidden] {
  display: none;
}

.checkout-date-editor h3,
.checkout-date-editor p {
  margin: 0;
}

.checkout-date-editor h3 {
  color: #173d3b;
  font-size: 1rem;
}

.checkout-date-editor > div > p:last-child {
  margin-top: 5px;
  color: #60706a;
  font-size: 0.8rem;
  line-height: 1.45;
}

@media (max-width: 1020px) {
  body.home-page-pro .home-flight-search-grid > .travel-date-enhanced-field {
    grid-column: 1 / -1;
  }
}

@media (max-width: 720px) {
  .checkout-date-editor {
    grid-template-columns: 1fr;
  }

  #hotel-flight-airport-form > .travel-date-enhanced-field {
    grid-column: 1 / -1;
  }
}

@media (max-width: 620px) {
  .flight-search-details-grid > .travel-date-enhanced-field {
    grid-column: 1 / -1;
  }
}

@media (max-width: 600px) {
  body.date-popover-open {
    overflow: hidden;
  }

  body.date-popover-open .mobile-bottom-dock {
    visibility: hidden;
  }

  .travel-date-panel {
    position: fixed;
    inset: auto;
    top: max(10px, env(safe-area-inset-top));
    left: 50%;
    z-index: 1400;
    width: min(420px, calc(100% - 20px));
    max-height: calc(var(--visual-viewport-height, 100dvh) - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    overflow-y: auto;
    transform: translateX(-50%);
  }

  .travel-date-enhanced-field,
  .flight-search-details-grid > .travel-date-enhanced-field,
  #hotel-flight-airport-form > .travel-date-enhanced-field,
  .hotel-customer-search > .travel-date-enhanced-field,
  .add-flight-date-grid > .travel-date-enhanced-field {
    grid-column: 1 / -1;
  }
}