body.quiet-luxury-site .pagehead {
  padding: clamp(54px, 7vw, 88px) 0 32px;
  background: var(--ql-ink);
  color: var(--ql-ivory);
}

body.quiet-luxury-site .pagehead h1 {
  margin: 10px 0 12px;
  color: var(--ql-ivory);
  font-size: clamp(46px, 6vw, 76px);
  line-height: .96;
  letter-spacing: -.045em;
}

body.quiet-luxury-site .pagehead p {
  max-width: 720px;
  color: rgba(244, 240, 231, .62);
}

body.quiet-luxury-site .booking-progress {
  gap: 0;
  margin: 26px 0 0;
  padding-top: 18px;
  border-top: 1px solid var(--ql-line-light);
  color: rgba(244, 240, 231, .44);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}

body.quiet-luxury-site .booking-progress span {
  padding-right: 12px;
}

body.quiet-luxury-site .booking-progress span.active {
  color: var(--ql-brass-muted);
}

body.quiet-luxury-site .config {
  padding: clamp(32px, 5vw, 72px) 0 clamp(78px, 9vw, 120px);
  background: var(--ql-paper) !important;
}

body.quiet-luxury-site .layout {
  grid-template-columns: minmax(0, 1fr) minmax(310px, 360px);
  gap: clamp(20px, 3vw, 38px);
}

body.quiet-luxury-site .panel {
  border-color: var(--ql-line);
  border-radius: var(--ql-radius-md);
  padding: clamp(20px, 3vw, 30px);
  background: #fff;
  box-shadow: 0 14px 42px rgba(11, 11, 10, .055);
}

body.quiet-luxury-site .panel h2 {
  margin: 8px 0 22px;
  font-size: clamp(27px, 3vw, 36px);
  line-height: 1.08;
}

body.quiet-luxury-site .account-status {
  border: 1px solid var(--ql-line-light);
  border-radius: var(--ql-radius-md);
  padding: 18px 20px;
  background: var(--ql-charcoal);
}

body.quiet-luxury-site .vehicle-choice,
body.quiet-luxury-site .choice,
body.quiet-luxury-site .addon {
  border-color: var(--ql-line);
  border-radius: var(--ql-radius-md);
  transition:
    border-color var(--ql-motion-fast) ease,
    box-shadow var(--ql-motion-fast) ease,
    background-color var(--ql-motion-fast) ease,
    transform var(--ql-motion-fast) ease;
}

body.quiet-luxury-site .vehicle-choice:hover,
body.quiet-luxury-site .choice:hover,
body.quiet-luxury-site .addon:hover {
  border-color: var(--ql-brass);
  transform: translateY(-1px);
}

body.quiet-luxury-site .vehicle-choice.selected,
body.quiet-luxury-site .choice.selected,
body.quiet-luxury-site .addon.selected {
  border-color: var(--ql-orange);
  box-shadow: 0 0 0 2px rgba(255, 107, 0, .12);
}

body.quiet-luxury-site .addon-icon {
  background: linear-gradient(145deg, #141412, #24231f);
  color: var(--ql-brass-muted);
}

body.quiet-luxury-site .addon-icon svg {
  width: 52px;
  height: 52px;
}

body.quiet-luxury-site .choice h3,
body.quiet-luxury-site .addon h4 {
  font-family: var(--ql-font-display);
  font-weight: 400;
}

body.quiet-luxury-site .choice h3 {
  font-size: 24px;
}

body.quiet-luxury-site .summary {
  top: 96px;
  border-top: 3px solid var(--ql-brass);
}

body.quiet-luxury-site .sumrow {
  border-bottom-color: var(--ql-line);
}

body.quiet-luxury-site .total {
  color: var(--ql-orange);
  font-family: var(--ql-font-display);
  font-weight: 400;
}

body.quiet-luxury-site .notice {
  border-color: rgba(180, 154, 99, .42);
  border-radius: var(--ql-radius-md);
  background: #faf6ec;
  color: #6d5730;
}

body.quiet-luxury-site .field label,
body.quiet-luxury-site .booking-vehicle-picker label {
  color: #45413b;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

body.quiet-luxury-site .field input,
body.quiet-luxury-site .field select,
body.quiet-luxury-site .admin-toolbar input,
body.quiet-luxury-site .admin-toolbar select,
body.quiet-luxury-site .admin-search input,
body.quiet-luxury-site .admin-search select,
body.quiet-luxury-site .booking-vehicle-picker select {
  min-height: 48px;
  border-color: var(--ql-line);
  border-radius: var(--ql-radius-sm);
  background: #fff;
  transition: border-color var(--ql-motion-fast) ease, box-shadow var(--ql-motion-fast) ease;
}

body.quiet-luxury-site .field input:focus,
body.quiet-luxury-site .field select:focus,
body.quiet-luxury-site .booking-vehicle-picker select:focus {
  border-color: var(--ql-orange);
  box-shadow: 0 0 0 3px rgba(255, 107, 0, .1);
}

body.quiet-luxury-site .slot {
  min-height: 46px;
  border-color: var(--ql-line);
  border-radius: var(--ql-radius-sm);
  font-size: 12px;
}

body.quiet-luxury-site .slot.active {
  border-color: var(--ql-ink);
  background: var(--ql-ink);
}

body.quiet-luxury-site .payment,
body.quiet-luxury-site #square-card-container,
body.quiet-luxury-site #membership-card-container,
body.quiet-luxury-site #topup-card-container,
body.quiet-luxury-site #extra-vip-card-container {
  border-color: var(--ql-line);
}

body.quiet-luxury-site .modal {
  background: rgba(11, 11, 10, .74);
  backdrop-filter: blur(7px);
}

body.quiet-luxury-site .modalbox,
body.quiet-luxury-site .fu-dialog {
  border: 1px solid rgba(244, 240, 231, .22);
  border-radius: var(--ql-radius-lg);
  background: var(--ql-paper);
  box-shadow: var(--ql-shadow-deep);
}

body.quiet-luxury-site .modalbox > h2,
body.quiet-luxury-site .fu-dialog h2,
body.quiet-luxury-site .guest-modal-head h2 {
  font-size: clamp(30px, 4vw, 42px);
  line-height: 1.06;
}

body.quiet-luxury-site .auth-tabs {
  border-bottom: 1px solid var(--ql-line);
}

body.quiet-luxury-site .auth-tab {
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  background: transparent;
  color: var(--ql-stone);
}

body.quiet-luxury-site .auth-tab.active {
  border-bottom-color: var(--ql-orange);
  background: transparent;
  color: var(--ql-ink);
}

body.quiet-luxury-site .membership-page {
  padding: clamp(50px, 7vw, 90px) 0 clamp(78px, 9vw, 120px);
}

body.quiet-luxury-site .membership-hero-card {
  border: 1px solid var(--ql-line-light);
  border-radius: var(--ql-radius-lg);
  padding: clamp(34px, 6vw, 72px);
  background:
    radial-gradient(circle at 80% 10%, rgba(180, 154, 99, .24), transparent 34%),
    var(--ql-ink);
  box-shadow: var(--ql-shadow-deep);
}

body.quiet-luxury-site .membership-hero-card h1 {
  color: var(--ql-ivory);
  font-size: clamp(48px, 6vw, 78px);
  line-height: .96;
}

body.quiet-luxury-site .membership-hero-card p {
  max-width: 710px;
  color: rgba(244, 240, 231, .68);
}

body.quiet-luxury-site .membership-hero-card .annual {
  color: var(--ql-brass-muted);
  font-family: var(--ql-font-display);
  font-weight: 400;
}

body.quiet-luxury-site .membership-page > .container > .panel {
  margin-top: 18px !important;
}

body.quiet-luxury-site .price-table th {
  color: var(--ql-stone);
  letter-spacing: .1em;
}

body.quiet-luxury-site .price-table th,
body.quiet-luxury-site .price-table td {
  border-bottom-color: var(--ql-line);
}

body.quiet-luxury-site .price-table .vipcol,
body.quiet-luxury-site .locked-vip,
body.quiet-luxury-site .account-price .vipview {
  color: #82672f;
}

body.quiet-luxury-site .customer-center {
  padding: clamp(48px, 7vw, 84px) 0 clamp(76px, 9vw, 118px);
  background: var(--ql-paper);
}

body.quiet-luxury-site .customer-head h1 {
  font-size: clamp(44px, 5vw, 68px);
  line-height: 1;
}

body.quiet-luxury-site .customer-layout {
  grid-template-columns: 230px minmax(0, 1fr);
  gap: clamp(20px, 3vw, 36px);
}

body.quiet-luxury-site .customer-side {
  border-color: var(--ql-line);
  border-radius: var(--ql-radius-md);
  padding: 10px;
  background: transparent;
}

body.quiet-luxury-site .customer-side button {
  border-radius: var(--ql-radius-sm);
  color: var(--ql-stone);
  font-size: 12px;
  letter-spacing: .03em;
}

body.quiet-luxury-site .customer-side button.active {
  background: var(--ql-ink);
  color: var(--ql-ivory);
}

body.quiet-luxury-site .account-kpi {
  border-color: var(--ql-line);
  border-radius: var(--ql-radius-md);
  background: #fff;
}

body.quiet-luxury-site .account-kpi strong {
  font-family: var(--ql-font-display);
  font-weight: 400;
}

body.quiet-luxury-site .vip-card,
body.quiet-luxury-site .balance-box {
  border: 1px solid var(--ql-line-light);
  border-radius: var(--ql-radius-md);
  background:
    linear-gradient(125deg, rgba(180, 154, 99, .13), transparent 45%),
    var(--ql-ink);
}

body.quiet-luxury-site .vip-card .level,
body.quiet-luxury-site .balance-box .amount {
  color: var(--ql-brass-muted);
  font-family: var(--ql-font-display);
  font-weight: 400;
}

body.quiet-luxury-site .vehicle-entry,
body.quiet-luxury-site .free-card,
body.quiet-luxury-site .membership-plan,
body.quiet-luxury-site .membership-linked-card {
  border-color: var(--ql-line);
  border-radius: var(--ql-radius-md);
  background: #fff;
}

body.quiet-luxury-site .mobile-nav-backdrop {
  background: rgba(11, 11, 10, .72);
  backdrop-filter: blur(4px);
}

body.quiet-luxury-site .mobile-nav-panel {
  border-left-color: var(--ql-line);
  background: var(--ql-paper);
}

body.quiet-luxury-site .mobile-nav-head h2 {
  font-size: 32px;
}

body.quiet-luxury-site .mobile-nav-links a,
body.quiet-luxury-site .mobile-nav-links button {
  border-color: var(--ql-line);
  border-radius: var(--ql-radius-sm);
  background: transparent;
}

body.quiet-luxury-site .mobile-nav-links [aria-current="page"] {
  border-color: var(--ql-orange);
  background: #fff5ec;
}

body.quiet-luxury-reset {
  background:
    radial-gradient(circle at 14% 8%, rgba(180, 154, 99, .16), transparent 34%),
    var(--ql-ink);
}

body.quiet-luxury-reset > main.card {
  width: min(calc(100% - 32px), 540px);
  margin: clamp(28px, 7vh, 74px) auto;
  border: 1px solid rgba(244, 240, 231, .24);
  border-radius: var(--ql-radius-lg);
  padding: clamp(28px, 5vw, 48px);
  background: var(--ql-paper);
  box-shadow: var(--ql-shadow-deep);
}

body.quiet-luxury-reset h1 {
  font-size: clamp(38px, 7vw, 54px);
  line-height: 1;
  letter-spacing: -.04em;
}

body.quiet-luxury-reset .field label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

body.quiet-luxury-reset .field input {
  min-height: 48px;
  border-color: var(--ql-line);
  border-radius: var(--ql-radius-sm);
}

body.quiet-luxury-reset .notice {
  border-radius: var(--ql-radius-md);
}

@media (max-width: 900px) {
  body.quiet-luxury-site .layout,
  body.quiet-luxury-site .customer-layout {
    grid-template-columns: 1fr;
  }

  body.quiet-luxury-site .customer-side {
    display: flex;
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
  }

  body.quiet-luxury-site .customer-side button {
    flex: 0 0 auto;
    width: auto;
    margin: 0;
  }

  body.quiet-luxury-site .summary {
    position: static;
  }
}

@media (max-width: 600px) {
  body.quiet-luxury-site .pagehead {
    padding-top: 42px;
  }

  body.quiet-luxury-site .panel {
    padding: 19px;
  }

  body.quiet-luxury-site .booking-progress {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px 12px;
  }

  body.quiet-luxury-site .booking-progress span {
    padding: 0;
  }

  body.quiet-luxury-site .membership-hero-card {
    padding: 28px 22px;
  }

  body.quiet-luxury-site .customer-head {
    align-items: flex-start;
    flex-direction: column;
  }

  body.quiet-luxury-reset > main.card {
    padding: 26px 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.quiet-luxury-site .vehicle-choice:hover,
  body.quiet-luxury-site .choice:hover,
  body.quiet-luxury-site .addon:hover {
    transform: none;
  }
}
