/* Final responsive layer: keep booking controls in flow and bounded on iOS. */
:root{--glass-surface:linear-gradient(135deg,rgba(255,255,255,.88),rgba(234,247,244,.78));--glass-edge:rgba(255,255,255,.85);--glass-shadow:0 18px 55px #123b4010,inset 0 1px 0 #fff}
html body{background:radial-gradient(ellipse at 0 25%,#e4f1ed 0,transparent 45%),radial-gradient(ellipse at 100% 60%,#e6edf7 0,transparent 40%),#f6f9f7}
body>header{background:rgba(249,252,251,.85);-webkit-backdrop-filter:blur(22px) saturate(150%);backdrop-filter:blur(22px) saturate(150%);border-bottom:1px solid #ffffffb8;box-shadow:0 4px 24px #183e3408}
.hero-reservation,.contact-card,.fleet-controls,.transfer-form,.specs,.real-room-shell aside,dialog{background:var(--glass-surface);border:1px solid var(--glass-edge);box-shadow:var(--glass-shadow);-webkit-backdrop-filter:blur(22px) saturate(140%);backdrop-filter:blur(22px) saturate(140%)}
.hero-reservation{box-shadow:0 18px 60px #092e3433,inset 0 1px 0 #fff;border-radius:26px}
.hero-reservation .booking-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr)) minmax(80px,.55fr) minmax(80px,.55fr) minmax(190px,1.4fr);gap:12px;background:transparent;border:0;box-shadow:none;border-radius:0}
.booking-form>label,.booking-form>label>*{min-width:0;max-width:100%;box-sizing:border-box}
.hero-reservation .booking-form>label{padding:0;border:0;font-size:11px;letter-spacing:.08em;line-height:1.4;display:block}
.hero-reservation .booking-form input,.hero-reservation .booking-form select{width:100%;max-width:100%;min-width:0;box-sizing:border-box;min-height:52px;height:52px;font-size:16px;border-radius:14px;background:rgba(255,255,255,.7);border:1px solid #b7cec8;color:#193f38;margin-top:6px}
.hero-reservation .booking-date{margin-top:6px;isolation:isolate}
.hero-reservation .booking-date input{margin-top:0;color:transparent!important;-webkit-text-fill-color:transparent!important;caret-color:transparent;min-width:0;-webkit-appearance:none;appearance:none}
.booking-date input::-webkit-date-and-time-value,.booking-date input::-webkit-datetime-edit{opacity:0;color:transparent!important}
.booking-date input:focus-visible~.date-display{visibility:visible}
.date-display{left:13px;right:33px;font-size:15px;overflow:hidden;text-overflow:ellipsis;z-index:1}
.date-icon{right:11px;z-index:1;width:17px;height:17px}
.hero-reservation .booking-form>.button{align-self:end;min-height:52px}
.button,.contact-whatsapp{border:1px solid #ffffff55;box-shadow:inset 0 1px 0 #ffffff40,0 8px 22px #164c4920;transition:transform .25s ease,box-shadow .25s ease,background-position .7s ease}
.button:not(.light),.contact-whatsapp{background-image:linear-gradient(115deg,#096c62,#155776 60%,#425b90);background-size:160% 160%;color:#fff}
@media(hover:hover){.button:hover,.contact-whatsapp:hover{background-position:100% 50%;transform:translateY(-2px);box-shadow:inset 0 1px 0 #ffffff60,0 12px 28px #164c4930}}
.button:active,.contact-whatsapp:active{transform:scale(.98)}
.room-card{padding:10px 10px 22px;border:1px solid #fff;border-radius:25px;background:linear-gradient(145deg,#ffffffdb,#eaf3f085);box-shadow:var(--glass-shadow)}
.room-card .room-image{border-radius:18px}.room-card>.room-meta,.room-card>h3,.room-card>p,.room-card>.text-link{margin-left:10px;margin-right:10px}
.mobile-book{background:rgba(246,250,248,.8);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);border-top:1px solid #fff}
.mobile-book{transition:transform .3s ease,opacity .3s ease}.hero-booking-visible .mobile-book{transform:translateY(110%);opacity:0;pointer-events:none;visibility:hidden}
@media(max-width:1100px){.hero-reservation .booking-form{grid-template-columns:repeat(4,minmax(0,1fr))}.hero-reservation .booking-form>.button{grid-column:1/-1}.hero-reservation .booking-form .date-note{grid-column:1/-1}}
@media(max-width:850px){
 .hero-reservation .booking-form{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .hero-reservation .booking-form>label{width:auto;grid-column:auto;min-width:0}
 .hero-reservation .booking-form>.button{grid-column:1/-1}
 .signature-hero{height:auto!important;min-height:0!important;max-height:none!important;padding:26px 18px 32px!important;display:flex;gap:22px;justify-content:flex-start}
 .signature-copy{padding:0!important;margin:12px 0 0!important;max-width:100%}
 .signature-copy h1,html[lang] .signature-copy h1{font-size:clamp(32px,8.5vw,56px);line-height:1.12;letter-spacing:-.045em}
 .signature-copy>p:not(.eyebrow){display:none}
 .signature-copy .eyebrow{font-size:9px;margin-bottom:14px}
 .signature-actions{margin-top:18px}.signature-watch{min-height:44px;display:inline-flex;align-items:center}
 .signature-topline,.signature-bottom,.arrival-pass{display:none!important}
 .hero-reservation{position:relative!important;inset:auto!important;width:100%;box-sizing:border-box;margin:0!important;padding:18px;border-radius:22px;flex:none}
 .reservation-heading{margin-bottom:14px}.reservation-heading>strong{display:none}
 .reservation-heading .free-transfer-badge{width:100%;box-sizing:border-box;background:#e5f5edc9;border:1px solid #badfcf;padding:10px;border-radius:12px}
 .free-transfer-badge b{font-size:11px}.free-transfer-badge small{font-size:10px}
 .hero-reservation .date-note{font-size:10px;line-height:1.5;margin:0}
 .room-showcase{min-height:490px}.showcase-copy>p:not(.eyebrow){display:none}
 .section{padding:52px 20px}.section-heading{gap:16px;margin-bottom:24px}.section-heading>p{font-size:13px;line-height:1.6}
 .rooms-section .section-heading>p,.room-card>p,.fleet-watermark{display:none}
 .section-heading h2,html[lang] .section-heading h2{font-size:clamp(28px,7.5vw,40px);line-height:1.18}
 .fleet-controls,.contact-card,.transfer-form{padding:22px;border-radius:22px}
 .fleet-models button,.fleet-colors button,.room-filters button,.fleet-categories button{min-height:44px}
 .contact-phones a{font-size:18px}.contact-ids{grid-template-columns:1fr 1fr}
 input,select,textarea{font-size:16px}
 header>nav.open{background:rgba(248,252,250,.97);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);border:1px solid #fff;border-radius:0 0 22px 22px}
 .mobile-book .button{min-height:48px;font-size:14px}
}
@media(max-width:360px){.hero-reservation{padding:14px}.signature-hero{padding:20px 12px 26px!important}.date-display{font-size:13px;left:10px;right:30px}.contact-ids{grid-template-columns:1fr}.hero-reservation .booking-form{gap:10px}}
@media(prefers-reduced-motion:reduce){.button,.contact-whatsapp{transition:none;transform:none!important}}
html[data-motion=off] .button,html[data-motion=off] .contact-whatsapp{transition:none;transform:none!important}
@media(prefers-reduced-transparency:reduce){body>header,.hero-reservation,.contact-card,.fleet-controls,.transfer-form,.specs,dialog,.mobile-book{background:#f5faf7;backdrop-filter:none;-webkit-backdrop-filter:none}}
/* Transfer enquiry: native mobile date/time controls must not share narrow tracks. */
.transfer-planner{grid-template-columns:repeat(2,minmax(0,1fr))}
.transfer-form{min-width:0;max-width:100%;box-sizing:border-box;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start}
.transfer-form>*{min-width:0;max-width:100%;box-sizing:border-box}
.transfer-form label{display:flex;flex-direction:column;align-items:stretch;line-height:1.5}
.transfer-form input,.transfer-form select{display:block;box-sizing:border-box;width:100%;min-width:0;max-width:100%;height:52px;min-height:52px;font-size:16px;line-height:normal}
.transfer-form input[type=date],.transfer-form input[type=time]{-webkit-appearance:none;appearance:none;overflow:hidden}
.transfer-form input::-webkit-date-and-time-value{text-align:left;min-height:1.2em}
.transfer-form .button{height:auto;min-height:52px;white-space:normal;overflow-wrap:anywhere;text-align:center;line-height:1.5;padding:14px 18px}
.transfer-status,.transfer-status a{overflow-wrap:anywhere;word-break:break-word;white-space:normal;line-height:1.6}
.transfer-status a{display:block;max-width:100%;padding:10px 0;min-height:44px;box-sizing:border-box}
#email-dialog{max-height:calc(100dvh - 32px);overflow-y:auto;overscroll-behavior:contain}
#email-dialog h2{padding-right:30px;overflow-wrap:anywhere}
.email-options{align-items:stretch}.email-options>a{white-space:normal;overflow-wrap:anywhere;line-height:1.5;min-height:44px;display:flex;align-items:center;justify-content:center}
@media(max-width:850px){.transfer-planner{grid-template-columns:minmax(0,1fr);gap:28px}.transfer-vehicle-gallery{min-width:0}.transfer-form{grid-template-columns:minmax(0,1fr);gap:16px;padding:20px}.transfer-form>*{grid-column:1!important}.transfer-form label{gap:8px}}
@media(max-width:600px){.transfer-form .button{font-size:14px}.transfer-form>p{font-size:13px;line-height:1.7}}
