/* A private beauty experience first; planning details remain within reach. */
.hero-image { background-image:url('/images/official/spa1978-treatment-room.jpg'); background-position:58% center; }
html[dir=rtl] .hero-image { transform:none; }
.hero h1 { max-width:49%; font-size:clamp(32px,3.1vw,46px); }
.hero-copy { max-width:43%; }
.care-focus { color:#806443; font-size:13px; font-weight:500; line-height:1.6; margin-bottom:7px; letter-spacing:.01em; }
#journey-dialog .journey-package-kicker { font-size:11px; color:#806443; letter-spacing:.09em; margin-bottom:10px; }
.package-preview-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:24px; }
.package-preview-card { min-width:0; border:1px solid var(--line); background:var(--white); }
.package-preview-image { aspect-ratio:1.35; display:grid; place-items:center; background:#eae2d6; color:#89765d; overflow:hidden; }
.package-preview-image img { width:100%; height:100%; object-fit:cover; }
.package-preview-image>svg { width:28px; height:28px; stroke-width:1; }
.package-preview-copy { padding:12px 10px 4px; }
.package-preview-copy>p { font-size:12px; color:#806443; margin-bottom:4px; }
.package-preview-copy h3 { font-family:var(--sans); font-size:15px; font-weight:500; line-height:1.5; overflow-wrap:anywhere; }
.package-preview-copy small { display:block; font-size:12px; color:var(--muted); margin-top:4px; }
.package-preview-copy button { display:flex; align-items:center; justify-content:space-between; gap:6px; min-height:44px; min-width:44px; width:100%; padding:0; font-size:12px; color:var(--muted); text-align:start; }
.package-preview-copy button svg { width:14px; height:14px; }
.package-dedicated { padding:18px 0 0; }
.package-dedicated h3 { font-family:var(--sans); font-size:14px; font-weight:500; }
.package-dedicated ul { list-style:none; padding:0; margin:12px 0 0; display:flex; flex-wrap:wrap; gap:10px 16px; }
.package-dedicated li { display:flex; align-items:center; gap:6px; font-size:12px; color:var(--muted); }
.package-dedicated li svg { width:16px; height:16px; color:#806443; }
.package-dedicated p { font-size:12px; line-height:1.6; margin-top:10px; color:var(--muted); }
.journey-selection-details { border-bottom:1px solid var(--line); }
.journey-selection-details>summary { display:flex; align-items:center; justify-content:space-between; gap:12px; list-style:none; min-height:52px; padding:10px 0; font-size:14px; font-weight:500; cursor:pointer; }
.journey-selection-details>summary::-webkit-details-marker { display:none; }
.journey-selection-details>summary:after { content:'+'; font-size:20px; font-weight:400; }
.journey-selection-details[open]>summary:after { content:'−'; }
@media(max-width:1000px) and (min-width:701px) {
 .hero h1 { font-size:32px; }
}
@media(max-width:700px) {
 .hero h1 { max-width:100%; font-size:clamp(27px,7.4vw,32px); line-height:1.4; }
 html[lang=en] .hero h1 { font-size:32px; max-width:100%; }
 html[dir=rtl] .hero h1 { font-size:28px; max-width:100%; }
 .hero-copy { max-width:100%; font-size:14px; line-height:1.65; }
 .hero-image { background-position:61% center; }
 .hero-shade { background:linear-gradient(90deg,#211a13e8,#211a13ad 62%,#211a1360); }
 html[dir=rtl] .hero-shade { background:linear-gradient(270deg,#211a13e8,#211a13ad 62%,#211a1360); }
 .care-focus { font-size:13px; margin-bottom:6px; }
 .package-preview-grid { gap:8px; margin-top:20px; }
 .package-preview-copy { padding:10px 7px 3px; }
 .package-preview-copy h3 { font-size:13px; }
 .package-preview-copy button { font-size:12px; gap:3px; }
 #journey-dialog .journey-item { grid-template-columns:52px minmax(0,1fr) 44px; gap:8px; }
 #journey-dialog .journey-item img { display:block; width:52px; height:64px; }
 #journey-dialog .journey-photo-placeholder { display:block; }
}

/* Keep consultation in its own row, clear of scrollable journey content. */
#journey-dialog { overflow:hidden; }
#journey-dialog[open] { display:flex; flex-direction:column; }
#journey-dialog .journey-scroll { flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain; scroll-padding-block:16px; padding-bottom:16px; }
.journey-footer { flex:0 0 auto; padding:12px 40px 35px; border-top:1px solid var(--line); background:var(--paper); }
.journey-footer>.button { margin:0; min-height:52px; }
.journey-live-total { display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:4px 12px; margin-bottom:10px; }
.journey-live-total>span { font-size:12px; line-height:1.6; color:var(--muted); }
.journey-live-total>strong { font-family:var(--sans); font-size:20px; font-weight:500; line-height:1.5; font-variant-numeric:tabular-nums; }
.journey-service-editor { padding-block:18px; border-top:1px solid var(--line); }
.journey-service-editor h4 { font-family:var(--sans); font-size:15px; font-weight:500; line-height:1.65; }
.journey-service-rate { font-size:12px; color:var(--muted); line-height:1.75; margin-top:3px; }
.journey-service-editor .service-days-row { margin:12px 0 0; }
.journey-service-editor .service-days-mode { margin:8px 0 0; gap:0; }
.journey-service-editor .service-line-total { margin-top:10px; padding-top:10px; font-size:13px; }
.journey-service-editor .service-line-total output { font-size:18px; }
.journey-service-editor .assistant-policy-inline { font-size:12px; line-height:1.7; color:var(--muted); margin-top:12px; }
@media(max-width:700px) {
 #journey-dialog { height:92dvh; max-height:calc(100dvh - 12px); margin:auto auto 0; overflow:hidden; }
 .journey-footer { padding:12px 20px max(14px,env(safe-area-inset-bottom)); }
}
@media(max-width:360px) {
 .journey-footer { padding-inline:16px; }
}

/* Only the official photos fade; the message and consultation action stay in place. */
.hero-image { overflow:hidden; padding:0; border:0; border-radius:0; cursor:pointer; }
.hero-shade,.hero-content { pointer-events:none; }
.hero-content button,.hero-content a { pointer-events:auto; }
.hero-image:focus-visible { outline:2px solid var(--gold); outline-offset:-4px; }
.hero-slide { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:var(--hero-position,center); opacity:0; transition:opacity .9s ease; }
.hero-slide.is-active { opacity:1; }
.hero-media-controls { position:absolute; z-index:2; inset-inline-end:48px; bottom:32px; display:flex; align-items:center; gap:8px; max-width:calc(47% - 64px); }
.hero-media-controls .hero-image-note { position:static; display:block; min-width:44px; min-height:44px; font-size:12px; line-height:1.5; letter-spacing:.02em; padding:5px 9px; background:#211a13c9; color:#fff; cursor:pointer; }
.hero-playback { display:grid; place-items:center; flex:none; width:44px; height:44px; padding:0; border:1px solid #ffffff60; background:#211a13a8; color:#fff; }
.hero-playback[hidden] { display:none; }
.hero-playback svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.5; }
.hero-play-icon,.hero-playback.is-paused .hero-pause-icon { display:none; }
.hero-playback.is-paused .hero-play-icon { display:block; }
@media(max-width:1000px) and (min-width:701px) {
 .hero-media-controls { inset-inline-end:32px; max-width:calc(48% - 48px); }
}
@media(max-width:700px) {
 .hero-content,html[dir=rtl] .hero-content { padding-bottom:56px; }
 .hero-media-controls { inset-inline-end:12px; bottom:6px; max-width:calc(100% - 24px); gap:6px; }
 .hero-media-controls .hero-image-note { font-size:11px; }
}
@media(prefers-reduced-motion:reduce) {
 .hero-slide { transition:none; }
}

/* The three included services stay visible together, with short explanations. */
.base-heading { justify-content:space-between; }
.base-media-note { font-size:11px; line-height:1.5; color:var(--muted); }
.base-service-preview { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin-top:18px; }
.base-service-preview article { min-width:0; }
.base-service-photo { display:block; width:100%; min-width:44px; min-height:44px; padding:0; border:0; border-radius:0; background:transparent; cursor:pointer; }
.base-service-photo:focus-visible { outline:2px solid var(--gold); outline-offset:4px; }
.base-service-preview img { display:block; width:100%; height:auto; aspect-ratio:2.3; object-fit:cover; }
.base-airport-photo { object-position:57% 64%; }
.base-van-photo { object-position:64% 52%; }
.base-concierge-photo { object-position:41% 64%; }
.base-service-preview h3 { font-family:var(--sans); font-size:17px; font-weight:500; line-height:1.5; letter-spacing:-.02em; margin:12px 0 4px; word-break:keep-all; overflow-wrap:anywhere; }
.base-service-preview p { font-size:14px; line-height:1.65; color:var(--muted); word-break:keep-all; overflow-wrap:anywhere; }
.base-care-assurance { display:flex; flex-wrap:wrap; gap:4px 22px; margin-top:18px; padding-top:12px; border-top:1px solid var(--line); }
.base-care-assurance p { font-size:13px; line-height:1.65; color:var(--muted); }
.base-care-assurance p:first-child { color:var(--ink); font-weight:500; }
.base-package .base-disclosure { margin-top:12px; }
@media(max-width:700px) {
 .base-heading { gap:8px; }
 .base-media-note { font-size:10px; }
 .base-service-preview { gap:8px; margin-top:10px; }
 .base-service-preview img { aspect-ratio:1.5; }
 .base-service-preview h3 { font-size:13px; line-height:1.45; min-height:2.9em; margin:8px 0 3px; }
 html[lang=ko] .base-service-preview h3 { min-height:1.45em; }
 .base-service-preview p { font-size:12px; line-height:1.5; }
 .base-care-assurance { display:block; margin-top:12px; padding-top:9px; }
 .base-care-assurance p { font-size:12px; line-height:1.65; }
 .base-care-assurance p+p { margin-top:2px; }
 .base-package .base-disclosure { margin-top:8px; }
}

/* Service details reuse the venue dialog, without changing package selection. */
.service-detail-dialog { overflow:hidden; max-height:90dvh; }
.service-detail-dialog #detail-content { max-height:calc(90dvh - 2px); overflow-y:auto; overscroll-behavior:contain; scroll-padding-block:16px; }
.service-detail-dialog .dialog-close { background:var(--paper); }
.service-detail-dialog .service-detail-image { position:relative; }
.service-detail-dialog .detail-photo { display:block; height:220px; object-position:center 60%; }
.service-detail-dialog .detail-content-body { padding:24px 32px 28px; }
.service-detail-dialog .detail-description { font-size:15px; line-height:1.8; margin-top:14px; }
.service-detail-pricing { border-top:1px solid var(--line); margin-top:20px; padding-top:16px; }
.service-detail-rate { display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:6px 12px; font-size:14px; }
.service-detail-rate .service-rate { flex-wrap:wrap; }
.service-detail-pricing .service-days-row { margin:14px 0 0; }
.service-detail-pricing .service-days-mode { margin:8px 0 0; gap:0; }
.service-detail-pricing .service-line-total { margin-top:12px; padding-top:12px; }
.service-detail-pricing .estimate-disclaimer { margin-top:10px; }
@media(max-width:700px) {
 .service-detail-dialog .detail-photo { height:160px; }
 .service-detail-dialog .detail-content-body { padding:20px; }
 .service-detail-dialog .detail-content-body h2 { font-size:24px; line-height:1.5; }
 .service-detail-dialog .detail-description { font-size:14px; line-height:1.8; }
 .service-detail-dialog .service-rate>span { font-size:12px; }
 .service-detail-dialog .service-rate strong,.service-detail-dialog .service-line-total output { font-size:20px; }
}