/* Existing Reva identity, with readable controls and predictable modal scrolling. */
:where(a,button,input,select,textarea,[tabindex]):focus-visible {
    outline:3px solid #727B36 !important;
    outline-offset:3px;
    box-shadow:0 0 0 2px #FFFBF3;
}
.skip-link {position:fixed;top:8px;left:8px;z-index:100100;padding:12px 18px;background:#2A3859;color:#fff;border-radius:8px;transform:translateY(-150%)}
.skip-link:focus {transform:translateY(0)}
#mobile-menu-toggle {min-width:44px;min-height:44px}
#booking-modal button,#privacy-modal button,#room-modal button,#lightbox-modal button,#reva-cookie-modal button {min-height:44px;min-width:44px}
#booking-modal input:not([type=checkbox]),#booking-modal select {min-height:44px;font-size:16px;line-height:1.4}
#booking-modal label {font-size:12px}
#booking-modal input[type=checkbox] {width:20px;height:20px;flex-shrink:0}
#booking-modal-content,#privacy-modal-card {max-height:calc(var(--reva-viewport-height,100dvh) - 32px);display:flex;flex-direction:column}
#booking-modal-content > div:first-of-type {flex-shrink:0}
#booking-body {min-height:0;max-height:none;overflow-y:auto;overscroll-behavior:contain}
#booking-step-indicator {flex-wrap:wrap;gap:6px}
#booking-step-indicator > button {margin:0;min-height:40px}
#booking-step-indicator > button:disabled {cursor:default}
#privacy-modal-card > div:last-child {min-height:0;display:flex;flex-direction:column}
#privacy-modal-content {min-height:0;font-size:14px;line-height:1.7;overflow-wrap:anywhere;overscroll-behavior:contain}
#privacy-modal-content h2,#privacy-modal-content h3 {font-weight:700;line-height:1.4;margin:20px 0 10px;color:#2A3859}
#privacy-modal-content table {width:100%;border-collapse:collapse;margin:16px 0;font-size:13px}
#privacy-modal-content th,#privacy-modal-content td {border:1px solid #E2DDD0;padding:10px;text-align:left;vertical-align:top}
#privacy-modal-content th {background:#F7F3E9}
#privacy-modal-content [role=note] {background:#F7F3E9;padding:12px;border-radius:10px}
.ux-booking-actions {display:flex;flex-wrap:wrap;gap:12px}
.ux-booking-actions > button {flex:1;justify-content:center}
.ux-consent-row {display:flex;gap:12px;padding:8px 0;align-items:flex-start;min-height:44px}
.ux-consent-row > span {font-size:13px;line-height:1.65}
.ux-consent-row button {min-height:24px !important;text-decoration:underline;text-underline-offset:3px}
.ux-guest-controls {flex-wrap:wrap;gap:12px}
.ux-guest-controls > div {margin:0 !important}
@media(max-width:639px) {
    #booking-modal,#privacy-modal {padding:8px}
    #booking-modal-content,#privacy-modal-card {max-height:calc(var(--reva-viewport-height,100dvh) - 16px);border-radius:20px;margin:0}
    #booking-body {padding:16px}
    #booking-modal-title {padding-right:48px;font-size:20px;line-height:1.3}
    .ux-date-controls {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
    .ux-date-controls > div {min-width:0;margin:0 !important}
    .ux-date-controls > div:nth-child(2) {grid-column:1 / -1;grid-row:2;padding-top:0}
    .ux-date-controls input {max-width:100%;min-width:0;padding-left:8px;padding-right:8px}
    .ux-guest-controls > div {flex:1;min-width:192px}
    #booking-step-indicator {width:100%;justify-content:flex-start}
    #booking-step-indicator > button {font-size:11px;padding:6px 8px;gap:5px}
    #booking-modal-content > div:first-of-type {padding:20px 16px 14px}
    #booking-modal-content .ux-booking-actions > button {flex-basis:100%}
    #privacy-modal-card > div:last-child {padding:16px}
    #privacy-modal-card > div:last-child > div:last-child {flex-wrap:wrap;gap:12px}
    #privacy-modal-card > div:last-child > div:last-child > button {width:100%}
}
@media(prefers-reduced-motion:reduce) {
    html {scroll-behavior:auto !important}
    *,*::before,*::after {animation-duration:0.01ms !important;animation-delay:0ms !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}
    .reveal {opacity:1 !important;transform:none !important}
}

/* Prevent flex children from forcing the hero wider than a phone. */
#hero > .relative {width:100%;min-width:0}
@media(max-width:1023px) {
    #main-header .brand-logo-img {height:60px;max-width:140px}
    #main-header #header-container {height:80px}
    #mobile-menu {max-height:calc(100dvh - 80px);overflow-y:auto}
    #mobile-menu a {min-height:44px;display:flex;align-items:center}
}
@media(max-width:639px) {
    #main-header #header-container {padding-left:12px;padding-right:12px}
    #main-header .brand-logo-img {height:auto;width:120px;max-height:64px}
    #header-container > div:last-child {gap:4px}
    #header-container > div:last-child > * {margin-left:0}
    #header-container > div:last-child > a {padding:10px;font-size:10px;letter-spacing:0.03em;white-space:nowrap}
    #hero {height:auto;min-height:100dvh}
    #hero h1 {font-size:30px;overflow-wrap:anywhere}
    #hero h1 > span {font-size:24px}
    #hero .animate-hero-badge > div {flex-wrap:wrap;justify-content:center;gap:6px;font-size:10px}
    #hero .animate-hero-badge > div > * {margin-left:0}
    #hero .animate-hero-sub {font-size:14px;line-height:1.7}
    #hero .animate-hero-btn {flex-direction:column;width:100%}
    #hero .animate-hero-btn > a {min-height:44px;width:100%;max-width:290px;white-space:normal}
}

#privacy-modal-card > div:first-child,#privacy-modal-tabs {flex-shrink:0}
#privacy-modal-tabs > button {flex-shrink:0}
#reva-cookie-modal > div {overflow-y:auto;max-height:calc(var(--reva-viewport-height,100dvh) - 24px)}
#reva-cookie-modal button {flex-shrink:0}
#reva-cookie-modal label {min-height:44px;align-items:center}
#reva-cookie-modal label > div::after {top:calc(50% - 10px)}
@media(max-width:639px) {
    #privacy-modal-card > div:first-child {padding:16px 60px 16px 16px}
    #privacy-modal-title {font-size:18px;line-height:1.35}
}

#room-modal-card {max-height:calc(var(--reva-viewport-height,100dvh) - 24px);display:flex;flex-direction:column}
#modal-room-body {min-height:0;overflow-y:auto;overscroll-behavior:contain}
#modal-room-body .truncate {white-space:normal;overflow:visible;text-overflow:clip}
@media(max-width:639px) {
    .ux-room-heading {flex-direction:column;align-items:flex-start;gap:8px}
    .ux-room-heading > div {margin-left:0;text-align:left}
    .ux-room-actions {flex-wrap:wrap}
    .ux-room-actions > button {width:100%;flex-basis:100%;justify-content:center}
}

@media(max-width:639px) {
    .ux-room-gallery-bar {padding-right:48px;gap:8px;flex-wrap:wrap;justify-content:flex-start}
    .ux-room-gallery-bar > span {white-space:nowrap}
}

/* Keep every cookie choice visible and reachable on narrow phones. */
#reva-cookie-banner #btn-cookie-accept,#reva-cookie-banner #btn-cookie-reject,#reva-cookie-banner #btn-cookie-settings {min-height:44px}
@media(max-width:639px) {
    #reva-cookie-banner #btn-cookie-accept {min-width:0;white-space:normal}
    #reva-cookie-banner #btn-cookie-reject {min-width:0;white-space:normal}
    #reva-cookie-banner #btn-cookie-settings {min-width:44px}
    #reva-cookie-banner #btn-cookie-accept,#reva-cookie-banner #btn-cookie-reject {font-size:10px;letter-spacing:0.025em;padding-left:6px;padding-right:6px}
}
/* Viewport and keyboard height changes must constrain cards immediately. */
#booking-modal-content,#privacy-modal-card,#room-modal-card {transition-property:transform,opacity}

/* Mobile content stays readable and does not depend on scroll or hover. */
@media(max-width:1023px) {
    body.use-reveal .reveal,.reveal {opacity:1 !important;transform:none !important;transition:none !important;will-change:auto}
    section {scroll-margin-top:96px}
    section .grid > * {min-width:0}
    #gallery .room-card > div.absolute {opacity:1 !important;padding:12px}
    #gallery .room-card h4 {white-space:normal;overflow:visible;text-overflow:clip;font-size:15px;line-height:1.45}
    #rooms .room-card div[class~="opacity-0"][class*="group-hover:opacity"] {display:none}
    #rooms .room-card p {font-size:16px !important;line-height:1.65;display:block;-webkit-line-clamp:unset;overflow:visible}
    section p,footer p {font-size:16px !important;line-height:1.7}
    :where(section,footer,#booking-modal,#room-modal,#privacy-modal,#legal-modal-overlay,#reva-cookie-banner,#reva-cookie-modal) :is(
    [class~="text-xs"],
    [class~="text-[8px]"],
    [class~="text-[9px]"],
    [class~="text-[9.5px]"],
    [class~="text-[10px]"],
    [class~="text-[10.5px]"],
    [class~="text-[11px]"],
    [class~="text-[11.5px]"],
    [class~="text-[12px]"],
    [class~="text-[12.5px]"],
    [class~="text-[13px]"]) {font-size:14px !important;line-height:1.5}
    #rooms .room-card h3 {font-size:24px;line-height:1.25}
    #rooms .room-card button,#rooms .room-card a[data-reva-click] {min-height:48px;white-space:normal;font-size:14px !important;padding:10px 12px;line-height:1.4}
    #rooms .room-card .grid span,#modal-room-body .grid span {overflow-wrap:anywhere;white-space:normal}
    #booking-body label {font-size:14px !important}
    #booking-step-indicator > button {font-size:13px !important;min-height:44px}
    #booking-body .ux-consent-row > span {font-size:15px !important;line-height:1.65}
    #booking-body input:not([type=checkbox]),#booking-body select {font-size:16px !important}
    #privacy-modal-content {font-size:16px;line-height:1.7}
    #hero .animate-hero-badge > div {font-size:12px;letter-spacing:0.025em;line-height:1.5}
    #header-container > div:last-child > a {font-size:12px;padding:10px 8px}
}
@media(max-width:639px) {
    #rooms .room-card > div:last-child {flex-wrap:wrap;gap:10px}
    #rooms .room-card > div:last-child > * {flex:1 1 100%;margin:0}
    #gallery .room-card {height:240px}
    #gallery .room-card span {letter-spacing:0.025em}
    #reva-cookie-banner #btn-cookie-accept,#reva-cookie-banner #btn-cookie-reject {font-size:14px !important;letter-spacing:0;line-height:1.4}
}
@media(min-width:640px) and (max-width:1023px) {
    #rooms > .grid {grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:359px) {
    #gallery > .grid {grid-template-columns:minmax(0,1fr)}
    #main-header .brand-logo-img {width:102px}
}

@media(max-width:1023px) {
    #hero [class*="animate-hero-"] {opacity:1 !important;transform:none !important;animation:none !important}
    :is(section,footer) p[class] {font-size:16px !important;line-height:1.7}
    section > .text-center > span[class~="text-[#ACB26F]"],
    #rooms .room-card h3 + span,
    #rooms .room-card div[class*="bg-white/95"] > span[class~="text-[#ACB26F]"] {color:#4B5220}
}

@media(max-width:1023px) {
    #rooms .room-card div.relative > div[class*="top-3.5"][class*="left-3.5"] {top:auto;bottom:12px;left:12px;right:auto;max-width:calc(100% - 24px);white-space:normal}
    #rooms .room-card div[class*="bg-white/95"] > span.font-display {font-size:18px !important}
    #rooms .room-card h3 {min-width:0;color:#2A3859 !important}
    #rooms .room-card h3 + span {flex-shrink:0;margin-left:8px}
}

@media(max-width:639px) {
    #header-container > div:last-child > a {font-size:14px;letter-spacing:0}
}
@media(max-width:359px) {
    #main-header .brand-logo-img {width:86px}
}

@media(max-width:1023px) {
    #modal-room-body p,#privacy-modal-content p {font-size:16px !important;line-height:1.65}
    #modal-room-body .grid[class~="grid-cols-3"] span {letter-spacing:0;text-transform:none;overflow-wrap:normal;word-break:normal}
}

/* Two original restaurant cover photographs, displayed together. */
.restaurant-photo-pair {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;width:100%}
.restaurant-photo-pair figure {position:relative;aspect-ratio:2/3;min-width:0;margin:0;overflow:hidden;border-radius:22px;border:1px solid #E2DDD0;box-shadow:0 10px 28px rgba(42,56,89,.16);background:#2A3859}
.restaurant-photo-pair img {display:block;width:100%;height:100%;object-fit:cover}
.restaurant-photo-pair figcaption {position:absolute;bottom:0;left:0;right:0;margin:0;padding:28px 12px 12px;background:linear-gradient(transparent,rgba(7,13,24,.9));color:#FFFBF3;font-size:14px;font-weight:700;line-height:1.4;overflow-wrap:break-word}
@media(max-width:359px) {.restaurant-photo-pair {gap:8px}.restaurant-photo-pair figcaption {padding-left:8px;padding-right:8px}}

/* Safari date fields must not impose intrinsic width on the modal grid. */
#booking-body .ux-date-controls, #booking-body .ux-date-controls > div {min-width:0}
#booking-body input[type=date] {box-sizing:border-box;min-width:0;max-width:100%;width:100%;display:block}
@media(max-width:767px){
 #booking-body .ux-date-controls {display:grid;grid-template-columns:minmax(0,1fr);gap:12px;}
 #booking-body .ux-date-controls > div {width:100%;margin:0!important;}
 #booking-body .ux-date-controls > div:nth-child(2) {order:3;grid-row:3;grid-column:1;padding-top:0;}
 #booking-body input[type=date] {-webkit-appearance:none;appearance:none;text-align:left;}
 #booking-body input[type=date]::-webkit-date-and-time-value {text-align:left;min-width:0;}
 #booking-modal-title:focus:not(:focus-visible) {outline:none;}
}

@media(max-width:767px){#booking-body .ux-date-controls > div:nth-child(1){grid-row:1;grid-column:1}#booking-body .ux-date-controls > div:nth-child(3){grid-row:2;grid-column:1}}

/* Phone layouts: let text wrap inside controls instead of clipping actions. */
@media(max-width:639px) {
    #header-container {gap:8px}
    #header-container > a {min-width:0;flex-shrink:1}
    #header-container > div:last-child {flex-shrink:0;gap:4px}
    #header-container > div:last-child > a {min-height:44px;display:flex;align-items:center;justify-content:center;font-size:12px;padding:10px 8px}
    #main-header .brand-logo-img {max-width:100%;object-fit:contain}
    #mobile-menu > div:first-child {flex-wrap:wrap;gap:12px}
    #mobile-menu > div:first-child > div {max-width:100%}
    #btn-toggle-gallery {max-width:100%;padding:12px;white-space:normal;min-height:48px}
    #btn-toggle-gallery span {min-width:0;overflow-wrap:break-word}
    #btn-toggle-gallery i {flex-shrink:0}
    section a[class*="btn-"],section button {max-width:100%;white-space:normal;overflow-wrap:break-word}
    #spa a[class*="btn-"],#jacuzzi a[class*="btn-"],#fireplace a[class*="btn-"],#gardens a[class*="btn-"] {display:flex;justify-content:center;text-align:center;min-height:48px;padding:12px 16px}
    #contact a[class*="btn-"] {min-height:48px;display:flex;align-items:center;justify-content:center;text-align:center}

    #booking-modal-content > div:first-of-type {padding:16px}
    #booking-modal-content > div:first-of-type > div.relative {padding-right:0;gap:12px}
    #booking-modal-content > div:first-of-type > div.relative > div:first-child > div:first-child {flex-wrap:wrap;gap:4px;padding-right:44px}
    #booking-modal-content > div:first-of-type > div.relative > div:first-child > div:first-child > * {margin-left:0;font-size:10px !important;letter-spacing:.06em}
    #booking-modal-title {padding-right:0;font-size:20px;line-height:1.3}
    #booking-step-indicator {flex-wrap:nowrap;gap:4px;min-width:0}
    #booking-step-indicator > button {padding:6px;min-width:36px;min-height:44px;justify-content:center;gap:4px}
    #booking-step-indicator > button > span {margin:0}
    #booking-step-indicator > button:not([aria-current=step]) > span:last-child {position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
    #booking-step-indicator > button[aria-current=step] {flex:1;min-width:0}
    #booking-step-indicator > button[aria-current=step] > span:last-child {white-space:normal;font-size:12px;letter-spacing:0}
    #booking-body .ux-guest-controls > div {min-width:0;flex-basis:100%;justify-content:space-between}
    #booking-body h4 {min-width:0;overflow-wrap:break-word}

    #reva-cookie-modal > div > div:first-child {padding:16px;gap:12px;align-items:flex-start}
    #reva-cookie-modal > div > div:first-child > div {min-width:0;gap:8px}
    #reva-cookie-modal > div > div:first-child > div > div:first-child {display:none}
    #reva-cookie-modal > div > div:first-child span {font-size:10px !important;letter-spacing:.06em}
    #reva-cookie-modal > div > div:nth-child(2) {padding:16px}
    #reva-cookie-modal > div > div:nth-child(2) > div {flex-wrap:wrap;gap:8px}
    #reva-cookie-modal > div > div:nth-child(2) > div > div:first-child {min-width:0;flex:1 1 100%}
    #reva-cookie-modal > div > div:last-child {flex-direction:column;align-items:stretch;gap:12px;padding:16px}
    #reva-cookie-modal > div > div:last-child > span {font-size:12px !important;line-height:1.5}
    #btn-cookie-save-settings {width:100%;min-width:0;padding:12px;white-space:normal;overflow-wrap:break-word}
}
@media(max-height:500px) and (max-width:1023px) {
    #booking-modal-content > div:first-of-type {padding:12px 16px}
    #booking-modal-content > div:first-of-type > div.relative {gap:6px;padding-right:44px}
    #booking-step-desc {display:none}
    #booking-step-indicator {flex-wrap:nowrap}
    #booking-step-indicator > button:not([aria-current=step]) > span:last-child {position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
}
/* Tablet landscape needs the drawer and two room columns until desktop fits. */
@media(min-width:1024px) and (max-width:1279px) {
    #header-container > nav,#header-container > div:nth-of-type(1) {display:none}
    #header-container > div:last-child {display:flex}
    #header-container {height:80px}
    #main-header .brand-logo-img {height:60px;max-width:140px}
    #mobile-menu:not(.hidden) {display:block;max-height:calc(100dvh - 80px);overflow-y:auto}
    #mobile-menu a {min-height:44px;display:flex;align-items:center}
    #rooms > .grid {grid-template-columns:repeat(2,minmax(0,1fr))}
    #rooms .room-card button,#rooms .room-card a[data-reva-click] {min-height:48px;white-space:normal;height:auto;padding:10px 12px}
}

/* Normal checkout layout; sensitive payment fields open assistance before entry. */
.checkout-payment-layout {display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:24px;align-items:start}
.checkout-payment-layout > * {min-width:0}
.checkout-payment-card {padding:24px;background:#fff;border:1px solid #E2DDD0;border-radius:20px;color:#2A3859}
.checkout-payment-card h4 {font-size:20px;font-weight:700;margin-bottom:20px}
.checkout-payment-methods {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:24px}
.checkout-payment-methods button {min-height:52px;padding:12px 8px;border:1px solid #D5D0C4;border-radius:12px;font-size:14px;font-weight:600;line-height:1.5}
.checkout-payment-methods [aria-pressed=true] {background:#F0F2E3;border-color:#727B36;color:#364015}
.checkout-payment-fields {display:grid;gap:18px}
.checkout-payment-field {min-width:0;display:grid;gap:8px}
.checkout-payment-field > span {font-size:14px;font-weight:600}
.checkout-payment-field button {width:100%;min-width:0;min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px;border:1px solid #D5D0C4;border-radius:10px;background:#FAF8F2;text-align:left;color:#697086;font-size:16px;line-height:1.5}
.checkout-payment-row {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.checkout-payment-note {font-size:13px;line-height:1.6;margin:20px 0}
.checkout-back,.checkout-pay {padding:12px 16px;border:1px solid #2A3859;border-radius:12px;font-size:14px;font-weight:700;white-space:normal;min-width:0}
.checkout-back {color:#2A3859;background:#fff}
.checkout-pay {color:#fff;background:#2A3859}
.checkout-legal-links {display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:8px}
.checkout-legal-links a {display:flex;align-items:center;min-height:44px;font-size:14px;text-decoration:underline;text-underline-offset:3px}
.checkout-support-overlay {position:fixed;inset:0;z-index:100050;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(7,13,24,.78);backdrop-filter:blur(8px)}
.checkout-support-overlay.hidden {display:none}
.checkout-support-dialog {position:relative;width:100%;max-width:460px;max-height:calc(var(--reva-viewport-height,100dvh) - 32px);overflow-y:auto;overscroll-behavior:contain;padding:28px;border-radius:22px;border:1px solid #ACB26F;background:#FFFBF3;color:#2A3859;box-shadow:0 24px 80px #070D1840}
.checkout-support-close {position:absolute;top:12px;right:12px;width:44px;height:44px;border-radius:50%;border:1px solid #E2DDD0;background:#fff;color:#2A3859}
.checkout-support-symbol {width:48px;height:48px;display:flex;align-items:center;justify-content:center;border-radius:14px;background:#F0F2E3;color:#4B5220;font-size:22px;margin-bottom:16px}
.checkout-support-dialog h3 {font-size:24px;line-height:1.3;font-weight:700;margin:0 0 14px}
.checkout-support-dialog p {font-size:16px;line-height:1.65}
.checkout-contact-actions {display:grid;gap:12px;margin:24px 0 18px}
.checkout-contact-actions a {display:flex;align-items:center;justify-content:center;gap:12px;min-height:60px;padding:12px;border-radius:12px;background:#2A3859;color:#fff;font-size:16px;font-weight:700;text-align:center}
.checkout-contact-actions a:last-child {background:#146C43}
.checkout-contact-actions i {font-size:22px}
.checkout-contact-actions small {display:block;margin-top:4px;font-size:13px;font-weight:500}
.checkout-support-dialog .checkout-support-note {font-size:13px;line-height:1.6}
@media(max-width:899px) {.checkout-payment-layout {grid-template-columns:minmax(0,1fr);gap:16px}}
@media(max-width:639px) {
    #booking-modal-title {padding-right:44px}
    #booking-modal-content > div:first-of-type > div.relative {padding-right:0}
    .checkout-payment-card {padding:16px}
    .checkout-payment-methods {grid-template-columns:minmax(0,1fr)}
    .checkout-payment-row {grid-template-columns:minmax(0,1fr)}
    .checkout-support-overlay {padding:12px}
    .checkout-support-dialog {padding:20px;max-height:calc(var(--reva-viewport-height,100dvh) - 24px)}
}
