.booking-page { animation: none !important; transform: none !important; }
.booking-header { margin-bottom: clamp(2rem, 5vw, 4rem); }
.booking-layout, .booking-auth-card { display: grid; grid-template-columns: minmax(0, .98fr) minmax(420px, 1.02fr); overflow: hidden; border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface); box-shadow: var(--shadow-md); }
.booking-visual { --booking-plan-height: clamp(430px, 49vw, 620px); display: grid; min-width: 0; grid-template-rows: minmax(var(--booking-plan-height), 1fr) auto; background: #f4ede4; }
.booking-carousel { position: relative; height: 100%; border-bottom: 1px solid var(--color-border); background: #e9dfd2; }
.booking-carousel .carousel-inner, .booking-carousel .carousel-item { width: 100%; height: 100%; }
.plan-image-button { position: relative; display: grid; width: 100%; height: 100%; padding: 1.25rem; place-items: center; overflow: hidden; border: 0; background: #e9dfd2; cursor: zoom-in; }
.booking-carousel img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center; filter: none; }
.plan-image-button::after { position: absolute; right: 1.25rem; bottom: 1.25rem; display: grid; width: 42px; height: 42px; place-items: center; border-radius: 50%; background: rgba(45,23,23,.72); color: #fff; font-family: "Font Awesome 6 Free"; font-size: .82rem; font-weight: 900; content: "\f00e"; opacity: 0; transform: translateY(3px); transition: opacity var(--transition), transform var(--transition); }
.plan-image-button:hover::after, .plan-image-button:focus-visible::after { opacity: 1; transform: translateY(0); }
.plan-image-button:focus-visible { z-index: 3; outline: 3px solid var(--color-accent); outline-offset: -5px; }
.booking-carousel .carousel-control-prev, .booking-carousel .carousel-control-next { z-index: 2; width: 48px; height: 48px; top: 1.1rem; bottom: auto; border: 1px solid rgba(255,255,255,.7); border-radius: 50%; background: rgba(45,23,23,.8); opacity: 1; box-shadow: var(--shadow-sm); }
.booking-carousel .carousel-control-prev:hover, .booking-carousel .carousel-control-next:hover { background: var(--color-primary); }
.booking-carousel .carousel-control-prev:focus-visible, .booking-carousel .carousel-control-next:focus-visible { outline: 3px solid var(--color-accent); outline-offset: 3px; }
.booking-carousel .carousel-control-prev { right: 4.7rem; left: auto; }
.booking-carousel .carousel-control-next { right: 1.1rem; }
.booking-visual-copy { display: flex; align-items: center; justify-content: space-between; gap: 1.25rem; padding: 1.25rem clamp(1.25rem, 3vw, 2rem); background: var(--color-surface); }
.booking-visual-copy p { margin: 0 0 .25rem; color: var(--color-accent); font-size: .68rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.booking-visual-copy h2 { margin: 0 0 .25rem; font-size: clamp(1.7rem, 3vw, 2.3rem); }
.booking-visual-copy span { color: var(--color-text-muted); font-size: .78rem; }
.booking-visual-copy .btn { flex: 0 0 auto; }
.booking-form-panel { display: flex; flex-direction: column; justify-content: center; padding: clamp(2rem, 5vw, 4rem); transition: box-shadow var(--transition); }
.booking-form-heading { margin-bottom: 1.75rem; }
.booking-form-heading h2 { margin: .2rem 0 .5rem; font-size: clamp(2rem, 4vw, 3rem); }
.booking-form-heading > p:last-child { margin: 0; color: var(--color-text-muted); font-size: .9rem; }
.booking-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.form-field { min-width: 0; }
.form-field-wide { grid-column: 1 / -1; }
.form-field label { font-size: .8rem; }
.form-hint { display: block; margin-top: .35rem; color: var(--color-text-muted); font-size: .72rem; }
.people-field input { max-width: 130px; }
.guest-count-errors { min-height: 1.35rem; margin-top: .35rem; }
.guest-count-errors .errorlist, .guest-count-client-error { display: block; margin: 0; color: var(--color-danger); font-size: .82rem; line-height: 1.45; }
.comment-section textarea { min-height: 110px; }
.booking-actions { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: .4rem; padding-top: 1.25rem; border-top: 1px solid var(--color-border); }
.booking-form .errorlist { margin-bottom: 0; }
.booking-form input[aria-invalid="true"], .booking-form select[aria-invalid="true"], .booking-form textarea[aria-invalid="true"] { border-color: var(--color-danger); background: #fffafa; }
.booking-auth-card { grid-template-columns: 1fr 1fr; min-height: 560px; }
.booking-auth-placeholder { position: relative; display: flex; min-width: 0; min-height: 560px; align-items: center; justify-content: center; flex-direction: column; gap: clamp(1.4rem, 3vw, 2rem); overflow: hidden; padding: clamp(2rem, 5vw, 4rem); border-right: 1px solid var(--color-border); background: #f5eee5; text-align: center; }
.booking-placeholder-art { position: relative; display: grid; width: min(100%, 480px); aspect-ratio: 13 / 9; place-items: center; }
.booking-placeholder-halo { position: absolute; width: 78%; aspect-ratio: 1; border-radius: 50%; background: rgba(255,255,255,.42); box-shadow: inset 0 0 0 1px rgba(125,43,45,.025); }
.booking-placeholder-art svg { position: relative; z-index: 1; display: block; width: 100%; height: auto; overflow: visible; }
.booking-placeholder-lines { fill: none; stroke: rgba(125,43,45,.62); stroke-dasharray: 6 6; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }
.booking-placeholder-lines rect, .booking-placeholder-lines circle { fill: rgba(255,255,255,.2); }
.booking-placeholder-lines .booking-placeholder-floor { stroke: rgba(90,69,62,.32); stroke-dasharray: none; }
.booking-placeholder-sparkles { fill: none; stroke: rgba(125,43,45,.46); stroke-linecap: round; stroke-width: 1.5; }
.booking-placeholder-sparkles circle { fill: rgba(125,43,45,.46); stroke: none; }
.booking-placeholder-copy { position: relative; z-index: 1; max-width: 31rem; }
.booking-placeholder-copy h2 { margin: 0 0 .55rem; font-family: var(--font-sans); font-size: clamp(1.05rem, 2vw, 1.25rem); font-weight: 700; line-height: 1.35; }
.booking-placeholder-copy p { margin: 0; color: var(--color-text-muted); font-size: clamp(.82rem, 1.5vw, .95rem); line-height: 1.65; }
.booking-auth-content { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: clamp(2rem, 6vw, 5rem); }
.booking-lock { display: grid; width: 54px; height: 54px; margin-bottom: 1.5rem; place-items: center; border-radius: 50%; background: var(--color-surface-muted); color: var(--color-primary); }
.booking-auth-content h2 { max-width: 12ch; margin: .25rem 0 1rem; font-size: clamp(2.4rem, 5vw, 4rem); }
.booking-auth-content > p:not(.page-eyebrow) { max-width: 36rem; color: var(--color-text-muted); }
.booking-auth-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1rem; }
body.plan-modal-open { overflow: hidden; }
.plan-modal[hidden] { display: none; }
.plan-modal { position: fixed; inset: 0; z-index: 1090; display: grid; padding: clamp(.75rem, 2vw, 1.75rem); place-items: center; }
.plan-modal-backdrop { position: absolute; inset: 0; padding: 0; border: 0; background: rgba(24,13,12,.82); backdrop-filter: blur(5px); animation: plan-fade-in 180ms ease both; }
.plan-modal-dialog { position: relative; display: grid; width: min(1280px, 100%); height: calc(100dvh - clamp(1.5rem, 4vw, 3.5rem)); max-height: calc(100dvh - clamp(1.5rem, 4vw, 3.5rem)); grid-template-rows: auto minmax(0, 1fr); overflow: hidden; border: 1px solid rgba(255,255,255,.18); border-radius: var(--radius-lg); background: var(--color-surface); box-shadow: 0 30px 90px rgba(0,0,0,.42); animation: plan-dialog-in 220ms ease both; }
.plan-modal-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .9rem 1rem .9rem 1.25rem; border-bottom: 1px solid var(--color-border); }
.plan-modal-header .page-eyebrow { margin-bottom: .1rem; }
.plan-modal-header h2 { margin: 0; font-size: clamp(1.7rem, 4vw, 2.4rem); }
.plan-modal-actions { display: flex; align-items: center; gap: .55rem; }
.plan-modal-close, .plan-modal-nav { border: 1px solid var(--color-border); background: var(--color-surface-muted); color: var(--color-primary); }
.plan-modal-nav:hover, .plan-modal-close:hover { border-color: var(--color-primary); background: var(--color-primary); color: #fff; }
.plan-modal-nav:focus-visible, .plan-modal-close:focus-visible { outline: 3px solid rgba(184,92,59,.28); outline-offset: 2px; }
.plan-viewport { position: relative; min-height: 0; overflow: hidden; background: #e9dfd2; touch-action: auto; }
.plan-viewport img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: contain; object-position: center; }
@keyframes plan-fade-in { from { opacity: 0; } }
@keyframes plan-dialog-in { from { opacity: 0; transform: translateY(8px) scale(.985); } }
@media (max-width: 1100px) { .booking-layout, .booking-auth-card { grid-template-columns: 1fr; } .booking-visual { --booking-plan-height: clamp(380px, 70vw, 640px); } .booking-auth-placeholder { min-height: 440px; border-right: 0; border-bottom: 1px solid var(--color-border); } .booking-placeholder-art { width: min(100%, 420px); } }
@media (max-width: 700px) { .booking-visual-copy { align-items: stretch; flex-direction: column; } .booking-visual-copy .btn { width: 100%; } }
@media (max-width: 575.98px) {
    .booking-form-panel { padding: 1.35rem; }
    .booking-form { grid-template-columns: 1fr; }
    .form-field, .form-field-wide { grid-column: 1; }
    .booking-actions { align-items: stretch; flex-direction: column-reverse; }
    .booking-actions .btn { width: 100%; }
    .booking-visual { --booking-plan-height: clamp(300px, 92vw, 430px); }
    .plan-image-button { padding: .65rem; }
    .plan-image-button::after { right: .75rem; bottom: .75rem; }
    .booking-carousel .carousel-control-prev, .booking-carousel .carousel-control-next { width: 42px; height: 42px; top: .75rem; }
    .booking-carousel .carousel-control-prev { right: 3.8rem; }
    .booking-carousel .carousel-control-next { right: .75rem; }
    .booking-auth-content { padding: 1.6rem; }
    .booking-auth-placeholder { min-height: 0; gap: 1rem; padding: 1.5rem 1.25rem 1.6rem; }
    .booking-placeholder-art { width: min(100%, 310px); }
    .booking-placeholder-copy { max-width: 27rem; }
    .plan-modal { padding: 0; }
    .plan-modal-dialog { width: 100%; height: 100dvh; max-height: 100dvh; border: 0; border-radius: 0; }
    .plan-modal-header { align-items: flex-start; padding: .75rem; }
    .plan-modal-actions { gap: .35rem; }
    .plan-modal-actions .btn-icon { width: 40px; height: 40px; }
}
@media (prefers-reduced-motion: reduce) { .plan-modal-backdrop, .plan-modal-dialog, .plan-image-button::after { animation: none; transition: none; } }