:root{--black:#111116;--red:#cf2431;--purple:#6545df;--green:#16834a;--bg:#f7f7f9;--line:#e3e4e8}
*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:#17171b}
a{text-decoration:none;color:inherit}.container{width:min(1120px,calc(100% - 30px));margin:auto}
.top{background:var(--black);color:#fff}.nav{min-height:70px;display:flex;align-items:center;justify-content:space-between}
.brand{font-weight:900}.brand small{display:block;color:#f2a8ad;font-size:11px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 18px;border:0;border-radius:11px;font-weight:800}
.red{background:var(--red);color:#fff}.light{background:#fff;border:1px solid var(--line)}
.hero{background:linear-gradient(120deg,#171216e8,#17121680),linear-gradient(135deg,#9d3927,#ee8a4f);color:#fff;padding:72px 0}
.form{max-width:820px;margin:38px auto;background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px}
.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.field label{display:block;font-weight:800;margin-bottom:6px}
.field input,.field select,.field textarea{width:100%;min-height:46px;border:1px solid #cfd2d9;border-radius:9px;padding:10px}
.field textarea{min-height:105px}.full{grid-column:1/-1}.notice{background:#f4f0ff;border-left:4px solid var(--purple);padding:13px;border-radius:9px;margin:16px 0}
.ok{background:#eef9f2;border-left-color:var(--green)}.sandbox{background:#fff7d7;border:1px solid #e4c45d;padding:12px;border-radius:10px;margin:12px 0;font-weight:700}
#card-container{min-height:92px;margin:16px 0}.result{padding:14px;border-radius:10px;margin-top:14px}.good{background:#eef9f2;border-left:4px solid var(--green)}
.bad{background:#fff0f0;border-left:4px solid var(--red)}
@media(max-width:820px){.formgrid{grid-template-columns:1fr}.full{grid-column:auto}}


/* BUILD 41 — live mobile scroll/background hardening */
html {
  min-height: 100% !important;
  height: auto !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior-y: auto;
  -webkit-text-size-adjust: 100%;
  background: #f5f5f7 !important;
}

body {
  min-height: 100vh !important;
  height: auto !important;
  overflow-y: visible !important;
  overflow-x: hidden !important;
  position: static !important;
  touch-action: pan-y !important;
  -webkit-overflow-scrolling: touch;
  background: #f5f5f7 !important;
  background-image: none !important;
  margin: 0 !important;
}

/* Ensure the checkout paints its own page instead of allowing a host/background to show through */
body::before {
  content: "" !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: -2 !important;
  pointer-events: none !important;
  background: #f5f5f7 !important;
}

body::after {
  content: none !important;
}

.app-shell,
.site-shell,
.page-shell,
main,
.checkout-page,
.checkout-wrap,
.checkout-container {
  min-height: 100% !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  position: relative !important;
}

/* Avoid iOS/embedded-browser scroll traps caused by transforms or fixed wrappers */
main,
.checkout-page,
.checkout-wrap,
.checkout-container,
form {
  transform: none !important;
  contain: none !important;
}

/* Keep the header visually stable without locking the page */
header,
.site-header,
.topbar {
  position: relative !important;
  top: auto !important;
}

/* Make sure the main white booking card completely covers the content area */
.booking-card,
.checkout-card,
.card,
form {
  background-clip: padding-box;
}

/* Give mobile browsers enough bottom room above Safari controls */
@media (max-width: 900px) {
  body {
    padding-bottom: max(32px, env(safe-area-inset-bottom)) !important;
  }

  main,
  .checkout-page,
  .checkout-wrap,
  .checkout-container {
    padding-bottom: 64px !important;
  }
}