/* Cinematic booking entrance: image-led story beside the enquiry form. */
.booking-page { display:block; height:auto; min-height:0; padding:112px max(24px, calc((100vw - 1400px)/2)) 48px; background:#f1f2f1; }
.booking-hero { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(350px,1fr); gap:0; align-items:stretch; background:#fbfaf7; }
.booking-story { position:relative; isolation:isolate; overflow:hidden; min-height:790px; background:#080e12; color:#fff; }
.booking-photo { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:60% center; z-index:-2; }
.booking-story::after { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(6,12,16,.84),rgba(6,12,16,.28) 47%,transparent 70%,rgba(6,12,16,.85)); }
.booking-story-copy { padding:48px 42px; }
.booking-eyebrow { font-size:10px; font-weight:600; letter-spacing:.22em; color:#e4a0b1; margin:0 0 28px; }
.booking-story h2 { font-size:clamp(42px,4.7vw,68px); letter-spacing:-.065em; font-weight:900; line-height:1.12; color:#fff; }
.booking-story h2 .serif { color:#e5a0b4; font-size:.94em; letter-spacing:-.055em; font-weight:400; }
.booking-lead { color:#e2dddb; font-size:14px; line-height:1.8; margin-top:22px; }
.booking-explore { display:inline-flex; gap:26px; align-items:center; margin-top:26px; border-bottom:1px solid #ffffff70; padding-bottom:10px; color:#fff; font-size:11px; font-weight:600; text-decoration:none; }
.booking-explore span { font-size:20px; color:#e5a0b4; }
.booking-explore:hover { border-color:#e5a0b4; }
.booking-story-footer { position:absolute; bottom:28px; left:42px; right:42px; display:flex; justify-content:space-between; gap:16px; border-top:1px solid #ffffff40; padding-top:18px; font-size:8px; letter-spacing:.13em; color:#ded9d5; }
.booking-card-kicker { color:#a54764; font-size:9px; font-weight:700; letter-spacing:.2em; margin:0 0 18px; }
.booking-card { padding:40px; border:0; border-radius:0; background:#fbfaf7; box-shadow:none; }
.booking-card h1 { font-size:24px; line-height:1.25; letter-spacing:-.055em; font-weight:800; }
.booking-intro { margin-top:8px; font-size:12px; color:#778095; }
.booking-field { display:block; font-size:12px; font-weight:600; margin-top:14px; }
.booking-field input { display:block; width:100%; min-width:0; height:44px; margin-top:7px; border:1px solid #dce0e9; border-radius:8px; padding:0 13px; background:#fff; color:#172133; font:400 13px var(--display); }
.booking-field input::placeholder { color:#939aab; }
.booking-submit { width:100%; display:flex; justify-content:center; align-items:center; gap:16px; min-height:46px; margin-top:22px; border:0; border-radius:4px; background:#10181d; color:white; font:700 13px var(--display); cursor:pointer; }
.booking-submit:hover { background:#a54764; }
.booking-hint { font-size:10px; color:#788297; text-align:center; margin-top:10px; }
.booking-divider { display:flex; align-items:center; gap:10px; margin:24px 0 14px; color:#7d8598; font-size:10px; }
.booking-divider::before,.booking-divider::after { content:''; height:1px; background:#dce0e9; flex:1; }
.booking-contact { text-align:center; }
.booking-contact .social-card { padding:16px 20px; background:#f5f6fa; border-color:#e1e5ed; color:#172133; text-align:left; }
.booking-contact .social-card:hover { background:#edf0f6; border-color:#cbd2df; }
.booking-contact { display:grid; gap:10px; }
.booking-contact .social-card small, .booking-contact .social-card .arrow { color:#667085; }
.booking-contact .social-card:focus-visible { outline:2px solid #c84f73; outline-offset:4px; }
.booking-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.booking-result { margin-top:18px; padding:12px; background:#fff3f6; border-radius:10px; font-size:12px; }
.booking-result textarea { width:100%; margin-top:10px; padding:10px; border:1px solid #dcc9cf; border-radius:6px; resize:vertical; font:12px/1.6 var(--display); }
.booking-result button { border:0; background:#172133; color:white; border-radius:6px; padding:10px; cursor:pointer; }
.booking-collections { margin-top:44px; }
.booking-section-heading { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:20px; }
.booking-section-heading h2 { font-size:30px; letter-spacing:-.045em; }
.booking-section-heading .serif { color:#b85570; }
.booking-section-heading a { flex:none; font-size:12px; color:#c24c6e; text-decoration:none; }
.booking-category-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.booking-category { position:relative; overflow:hidden; min-height:190px; padding:26px; text-decoration:none; border-radius:14px; background:#ede9e0; }
.booking-category.birthday { background:#f8e8ec; }.booking-category.graduation { background:#e5ecf5; }
.booking-category div { position:relative; z-index:1; }.booking-category h3 { font-size:23px; letter-spacing:-.04em; }.booking-category p { color:#637084; font-size:13px; margin-top:6px; }
.booking-category img { position:absolute; width:90px; height:265px; object-fit:contain; right:20px; top:16px; transform:rotate(13deg); transition:transform .2s; }.booking-category:hover img { transform:rotate(7deg) translateY(-6px); }
.booking-arrow { display:grid; place-items:center; width:36px; height:36px; border-radius:50%; background:#fff; margin-top:12px; }
.booking-gallery { margin-top:48px; scroll-margin-top:140px; }.booking-gallery > h2 { font-size:25px; margin-bottom:20px; }
.booking-page .strip { height:340px; container-type:normal; padding:12px 0; }.booking-page .strip img { height:310px; }.booking-page .strip-move,.booking-page .loop-group { height:auto; }.booking-page .closer { padding:30px 0; }.booking-page .loop-controls { margin:12px 0; }
@media(max-width:1100px) { .booking-hero { grid-template-columns:minmax(0,1fr) minmax(330px,1fr); }.booking-card { padding:28px; }.booking-story-copy { padding:36px 26px; }.booking-story-footer { left:26px; right:26px; }.booking-category { padding:20px; }.booking-category img { right:5px; opacity:.8; } }
@media(max-width:1000px) { .booking-page { padding-top:155px; } }
@media(max-width:760px) {
  .booking-page { padding:145px 16px 30px; }
  .booking-hero { display:block; }
  .booking-story { min-height:580px; }
  .booking-story-copy { padding:32px 24px; }
  .booking-eyebrow { font-size:8px; margin-bottom:22px; letter-spacing:.18em; }
  .booking-story h2 { font-size:clamp(34px,8.5vw,58px); }
  .booking-lead { font-size:13px; margin-top:18px; }
  .booking-photo { object-position:60% 60%; }
  .booking-story-footer { left:24px; right:24px; bottom:22px; font-size:7px; }
  .booking-story-footer span:last-child { display:none; }
  .booking-card { position:relative; padding:30px 22px; }
  .booking-card h1 { font-size:24px; }
  .booking-category-grid { grid-template-columns:1fr; gap:12px; }
  .booking-category { min-height:175px; }
  .booking-category img { right:35px; opacity:1; width:100px; }
  .booking-section-heading { align-items:flex-start; }
  .booking-section-heading h2 { font-size:26px; }
  .booking-section-heading a { margin-top:8px; }
  .booking-collections { margin-top:30px; }
  .booking-page .closer { display:block; }
  .booking-page .closer .actions { margin-top:18px; }
}
@media(prefers-reduced-motion:reduce) { .booking-category img { transition:none; } }
/* Float the calendar over the remaining fields without changing the form layout. */
.booking-date-field { position:relative; }
.booking-date-toggle { display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; min-height:48px; margin-top:7px; padding:12px 14px; border:1px solid #dce0e9; border-radius:10px; background:#fff; color:var(--ink); text-align:left; font:500 13px var(--display); cursor:pointer; }
.booking-date-action { flex:none; color:#b43e60; font-size:11px; font-weight:700; }
.booking-date-toggle[aria-expanded=true] { border-color:#d17b94; box-shadow:0 0 0 3px #c84f7310; }
.booking-calendar { position:absolute; top:100%; left:0; z-index:20; width:max(100%,280px); max-width:calc(100vw - 64px); box-sizing:border-box; margin-top:8px; padding:16px; border:1px solid #eadce2; border-radius:16px; background:#fffafb; box-shadow:0 16px 40px #17213326; }
.booking-calendar[hidden] { display:none; }
.booking-calendar-heading { display:grid; grid-template-columns:1fr 100px; gap:10px; }
.booking-calendar select { width:100%; min-height:42px; padding:8px 10px; border:1px solid #e7dce1; border-radius:9px; background:#fff; color:var(--ink); font:600 13px var(--display); appearance:none; cursor:pointer; }
.booking-calendar-nav,.booking-calendar-footer { display:flex; justify-content:space-between; gap:10px; }
.booking-calendar-nav { margin:8px 0; }
.booking-calendar-nav button,.booking-calendar-footer button { min-height:40px; border:0; border-radius:8px; padding:8px; background:transparent; color:#b43e60; font:600 11px var(--display); cursor:pointer; }
.booking-weekdays,.booking-days { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:3px; }
.booking-weekdays span { text-align:center; padding:8px 0; color:#838393; font-size:10px; }
.booking-days button { min-height:42px; padding:0; border:1px solid transparent; border-radius:10px; background:transparent; color:var(--ink); font:600 13px var(--display); cursor:pointer; }
.booking-days button:hover:not(:disabled),.booking-calendar-nav button:hover:not(:disabled),.booking-calendar-footer button:hover { background:#f7e3eb; }
.booking-days button[aria-current=date] { border-color:#d17b94; color:#b43e60; }
.booking-days button[aria-pressed=true] { background:#c84f73; color:#fff; }
.booking-calendar button:disabled { opacity:.28; cursor:default; }
.booking-calendar-footer { margin-top:10px; padding-top:8px; border-top:1px solid #efdee5; }
.booking-date-error { color:#a52e51; font-size:12px; margin-top:8px; }
@media(max-width:400px) { .booking-calendar { padding:10px; }.booking-days { gap:1px; }.booking-days button { min-height:40px; } }
/* Searchable Vietnam province picker, matching the booking form. */
.booking-location-field { position:relative; }
.booking-location-field input[aria-expanded=true] { border-color:#c84f73; }
.booking-province-menu { position:absolute; top:100%; left:0; right:0; z-index:5; margin-top:6px; padding:6px; border:1px solid #e2ced6; border-radius:12px; background:#fffafb; }
.booking-province-menu[hidden] { display:none; }
#booking-provinces { max-height:240px; overflow-y:auto; overscroll-behavior:contain; }
#booking-provinces [role=option] { min-height:44px; padding:12px; border-radius:8px; color:var(--ink); font-size:13px; font-weight:500; cursor:pointer; }
#booking-provinces [role=option]:hover,#booking-provinces [role=option].active { background:#f7e3eb; }
#booking-provinces [aria-selected=true] { color:#ae355a; background:#fcecf1; font-weight:700; }
#booking-province-empty { padding:14px 10px; color:#737b8c; font-size:12px; }
@media(max-width:760px) { .booking-field input { font-size:16px; } }

.booking-page #booking-form { scroll-margin-top:160px; }
.booking-page :is(.booking-explore,.booking-submit):focus-visible { outline:2px solid #c84f73; outline-offset:5px; }

/* Put the complete booking panel first, with the editorial image below it. */
.booking-hero { display:block; max-width:920px; margin:0 auto; background:transparent; }
.booking-card { padding:28px 36px 24px; border:1px solid #e1e2e3; border-radius:12px; background:#fff; }
.booking-card-kicker { margin-bottom:8px; }
.booking-card h1 { font-size:30px; }
.booking-intro { margin-top:6px; }
.booking-page #booking-form { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:14px 20px; margin-top:18px; }
.booking-occasion { grid-column:1/-1; display:flex; align-items:center; gap:12px; font-size:12px; font-weight:600; }
.booking-occasion select { min-height:36px; max-width:180px; padding:6px 32px 6px 12px; border:1px solid #e2c5ce; border-radius:6px; color:#913b55; background:#fff7f9; font:600 13px var(--display); }
.booking-field { min-width:0; margin-top:0; }
.booking-field input, .booking-date-toggle { height:44px; min-height:44px; border-radius:6px; }
.booking-date-toggle { padding:8px 12px; gap:6px; }
.booking-date-action { font-size:10px; }
.booking-time-field small { display:block; font-size:10px; color:#778095; font-weight:400; margin-top:4px; }
.booking-submit, .booking-hint, .booking-result, #booking-turnstile { grid-column:1/-1; }
#booking-turnstile:empty { display:none; }
.booking-submit { margin-top:4px; min-height:44px; }
.booking-hint { margin-top:-6px; }
.booking-divider { margin:16px 0 10px; }
.booking-time-field { position:relative; }
.booking-time-toggle svg { width:16px; height:16px; flex:none; color:#a54764; }
.booking-time-toggle[aria-invalid=true] { border-color:#a52e51; }
.booking-time-picker { position:absolute; top:100%; right:0; z-index:20; width:max(100%,280px); max-width:calc(100vw - 64px); box-sizing:border-box; margin-top:8px; padding:16px; border:1px solid #eadce2; border-radius:16px; background:#fffafb; box-shadow:0 16px 40px #17213326; }
.booking-time-picker[hidden] { display:none; }
.booking-time-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px; font-size:12px; color:#687184; }
.booking-time-heading output { color:#a54764; font:700 24px var(--display); font-variant-numeric:tabular-nums; letter-spacing:-.04em; }
.booking-time-columns { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.booking-time-caption { display:block; margin-bottom:8px; color:#778095; font-size:11px; }
.booking-time-options { position:relative; height:192px; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#dfbac7 transparent; padding:4px; border:1px solid #eadce2; border-radius:10px; background:#fff; }
.booking-time-options button { display:block; width:100%; min-height:40px; border:0; border-radius:7px; background:transparent; color:var(--ink); font:600 14px var(--display); font-variant-numeric:tabular-nums; cursor:pointer; }
.booking-time-options button:hover { background:#f7e3eb; }
.booking-time-options button[aria-selected=true] { background:#c84f73; color:#fff; }
.booking-time-picker button:focus-visible { outline:2px solid #a54764; outline-offset:-2px; }
.booking-time-footer { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:14px; padding-top:12px; border-top:1px solid #efdee5; }
.booking-time-footer button { min-height:40px; padding:8px 18px; border:0; border-radius:8px; background:transparent; color:#a54764; font:600 12px var(--display); cursor:pointer; }
.booking-time-footer button:hover { background:#f7e3eb; }
.booking-time-footer #booking-time-apply { background:#10181d; color:#fff; }
.booking-time-footer #booking-time-apply:hover { background:#a54764; }
.booking-page > .booking-story { max-width:920px; min-height:300px; margin:28px auto 0; border-radius:10px; }
.booking-page > .booking-story .booking-photo { object-position:center 55%; }
.booking-story-copy { padding:30px; }
.booking-story h2 { font-size:40px; }
.booking-story .booking-eyebrow { margin-bottom:16px; }
.booking-story .booking-lead { margin-top:14px; }
.booking-story-footer, .booking-explore { display:none; }
@media(max-width:760px) {
 .booking-page { padding:138px 12px 30px; }
 .booking-card { padding:20px 16px 16px; }
 .booking-card h1 { font-size:25px; line-height:1.2; }
 .booking-card-kicker { font-size:8px; }
 .booking-intro { font-size:11px; line-height:1.5; }
 .booking-page #booking-form { gap:12px 10px; margin-top:14px; }
 .booking-field { font-size:11px; }
 .booking-field input { padding:0 10px; font-size:16px; }
 .booking-date-toggle { font-size:12px; flex-wrap:wrap; }
 .booking-date-action { display:none; }
 .booking-location-field, .booking-field[for=booking-address] { grid-column:1/-1; }
 .booking-occasion { font-size:11px; }
 .booking-occasion select { min-height:36px; font-size:16px; }
 .booking-divider { margin:12px 0 8px; font-size:9px; }
 .booking-page > .booking-story { margin-top:20px; min-height:280px; }
 .booking-story-copy { padding:24px; }
 .booking-story h2 { font-size:32px; }
}
@media(max-width:360px) {
 .booking-page { padding-top:195px; }
}

/* Desktop editorial spread. Mobile retains the existing booking layout. */
@media (min-width:1101px) {
.booking-page { display:grid; grid-template-columns:minmax(0,1fr) minmax(560px,1.05fr); gap:0; padding:112px clamp(24px,3vw,72px) 56px; align-items:stretch; }
.booking-page > .booking-hero { grid-column:2; grid-row:1; min-width:0; width:100%; max-width:none; margin:0; }
.booking-card { height:100%; box-sizing:border-box; padding:clamp(28px,3vw,64px); border:0; border-radius:0 18px 18px 0; background:#fffdfb; display:flex; flex-direction:column; justify-content:center; }
.booking-card h1 { font-size:clamp(28px,2.5vw,44px); }
.booking-intro { font-size:13px; line-height:1.7; }
.booking-card-kicker { margin-bottom:16px; }
.booking-page #booking-form { margin-top:26px; gap:18px 20px; }
.booking-field input,.booking-date-toggle { min-height:48px; height:48px; }
.booking-submit { min-height:48px; }
.booking-page > .booking-story { grid-column:1; grid-row:1; max-width:none; width:100%; min-height:760px; margin:0; border-radius:18px 0 0 18px; }
.booking-page > .booking-story .booking-photo { object-position:58% center; }
.booking-story-copy { padding:clamp(32px,4vw,80px); }
.booking-story h2 { font-size:clamp(48px,4.5vw,88px); line-height:1.08; }
.booking-story .booking-eyebrow { margin-bottom:30px; }
.booking-story .booking-lead { margin-top:26px; font-size:15px; }
.booking-story-footer { display:flex; left:clamp(32px,4vw,80px); right:clamp(32px,4vw,80px); }
.booking-explore { display:inline-flex; }
.booking-collections,.booking-gallery { grid-column:1/-1; min-width:0; }
.booking-collections { margin-top:64px; }
.booking-section-heading h2 { font-size:clamp(30px,3vw,48px); }
.booking-category { min-height:230px; padding:32px; }
.booking-category h3 { font-size:28px; }
.booking-category img { width:115px; height:300px; right:9%; }
}

/* Fit the initial desktop enquiry panel below navigation without clipping controls. */
@media (min-width:1101px) {
  .booking-page { padding-top:96px; }
  .booking-page > .booking-story { min-height:calc(100svh - 120px); }
  .booking-card { padding:clamp(18px,3vh,36px) clamp(28px,3vw,64px); }
  .booking-card h1 { font-size:clamp(28px,3.8vh,40px); }
  .booking-card-kicker { margin-bottom:10px; }
  .booking-page #booking-form { margin-top:18px; row-gap:12px; }
  .booking-field input,.booking-date-toggle { height:44px; min-height:44px; }
  .booking-submit { min-height:44px; }
}
@media (min-width:1101px) and (max-height:800px) {
  .booking-page { padding-top:88px; }
  .booking-page > .booking-story { min-height:calc(100svh - 104px); }
  .booking-card { padding-top:16px; padding-bottom:16px; }
  .booking-card h1 { font-size:28px; }
  .booking-card-kicker { margin-bottom:6px; }
  .booking-intro { margin-top:4px; font-size:12px; }
  .booking-page #booking-form { margin-top:12px; row-gap:8px; }
  .booking-field input,.booking-date-toggle { margin-top:5px; height:40px; min-height:40px; }
  .booking-submit { min-height:40px; margin-top:0; }
  .booking-divider { margin:10px 0 8px; }
  .booking-story-copy { padding-top:36px; }
  .booking-story h2 { font-size:clamp(44px,7.5vh,64px); }
}

.booking-card > [hidden] { display:none !important; }
.booking-confirmation { text-align:center; padding:24px 0; margin:auto 0; }
.booking-success-mark { display:grid; place-items:center; width:88px; height:88px; margin:0 auto 28px; border:1px solid #e8b8c6; border-radius:50%; background:#f9e9ee; color:#a54764; font-size:42px; }
.booking-confirmation h2 { font-size:clamp(28px,3vw,44px); line-height:1.15; letter-spacing:-.045em; margin:14px auto 20px; max-width:540px; }
.booking-confirmation > p:not(.booking-card-kicker) { max-width:460px; margin:16px auto; color:#687184; font-size:14px; line-height:1.8; }
.booking-confirmation .booking-success-note { font-size:12px !important; }
.booking-success-actions { display:flex; flex-wrap:wrap; gap:12px; justify-content:center; margin:28px 0 18px; }
.booking-success-actions button { padding:14px 20px; border:1px solid #d9cbd0; border-radius:30px; background:transparent; color:#10181d; font:600 12px var(--display); cursor:pointer; }
.booking-success-actions button[data-new] { background:#10181d; border-color:#10181d; color:#fff; }
.booking-success-actions button:focus-visible { outline:2px solid #a54764; outline-offset:4px; }
.booking-confirmation small { display:block; max-width:440px; margin:auto; font-size:11px; line-height:1.7; color:#788297; }