/* Supporting pages extend the shared hotel theme without restyling the landing page. */
.hotel-public { overflow-wrap: break-word; }
.hotel-public .nav-booking { flex-shrink: 0; }
.hotel-public .public-mobile-toggle[hidden] { display: none !important; }
.section-note { margin-top: 24px; font-size: 13px; line-height: 1.7; color: #68626c; }
.text-link { display: inline-flex; align-items: center; gap: 12px; min-height: 44px; color: #735822; font-size: 14px; }
.text-link:hover, .prose a:not(.btn):hover { text-decoration: underline; text-underline-offset: 4px; }
.facility-copy > .text-link { margin-top: 26px; }
.body-copy { font-size: 16px; line-height: 1.8; color: #67636c; max-width: 520px; }
.editorial-section { background: #f5f0e5; }
.section-link { margin-top: 32px; text-align: center; }
.breadcrumbs { padding-block: 24px; font-size: 12px; color: #746b5d; }
.breadcrumbs ol { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; padding: 0; margin: 0; }
.breadcrumbs li { display: flex; min-width: 0; }
.breadcrumbs li + li::before { content: "/"; margin-right: 8px; color: #a19581; }
.breadcrumbs a { text-decoration: underline; text-underline-offset: 3px; }
.page-heading { padding-block: 32px 48px; max-width: 100%; }
.page-heading h1, .article-heading h1, .error-page h1 { font: 400 clamp(38px, 4.3vw, 62px)/1.15 var(--hotel-serif); letter-spacing: -1.2px; max-width: 930px; text-wrap: balance; }
.page-heading > p { font-size: 17px; color: #67636c; line-height: 1.8; max-width: 790px; margin-top: 24px; }
.hotel-marketing .public-section.page-section { padding-top: 0; }
.information-panel { background: #f2ebde; border: 1px solid #e7d9be; border-radius: 8px; padding: 32px; margin-top: 40px; }
.hotel-marketing .information-panel h2 { font-size: 28px; line-height: 1.3; margin-bottom: 16px; }
.information-panel p { font-size: 15px; color: #615b52; line-height: 1.8; }
.information-panel .text-link { margin-top: 12px; }
.article-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.article-card { min-width: 0; background: #fff; border: 1px solid var(--hotel-border); border-radius: 8px; overflow: hidden; display: flex; flex-direction: column; }
.article-card > a > img { width: 100%; aspect-ratio: 1.65; height: auto; object-fit: cover; }
.article-card-body { padding: 28px; display: flex; flex-direction: column; flex: 1; }
.article-category { font-size: 11px; letter-spacing: .5px; color: #86651f; margin-bottom: 14px; }
.article-card h3 { font: 400 25px/1.35 var(--hotel-serif); margin-bottom: 16px; }
.article-card h3 a:hover { color: #86651f; }
.article-card p { font-size: 14px; color: #67636c; line-height: 1.75; margin-bottom: 20px; }
.article-card .text-link { margin-top: auto; }
.room-detail-layout { display: grid; grid-template-columns: minmax(0, 1.8fr) minmax(0, 1fr); gap: 48px; align-items: start; }
.room-cover { width: 100%; aspect-ratio: 1.45; height: auto; object-fit: cover; border-radius: 8px; }
.room-gallery { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-block: 16px 36px; }
.room-gallery img { width: 100%; aspect-ratio: 1.25; height: auto; object-fit: cover; border-radius: 6px; }
.booking-panel { border: 1px solid #dfcfb0; background: white; padding: 32px; border-radius: 8px; position: sticky; top: 24px; min-width: 0; }
.booking-panel > p { font-size: 14px; color: #67636c; line-height: 1.8; margin-block: 20px; }
.booking-panel .btn { display: flex; margin-top: 14px; width: 100%; white-space: normal; }
.detail-rate { font: 34px/1.3 var(--hotel-serif) !important; color: #141414 !important; }
.detail-rate small { display: block; font: 12px/1.6 var(--hotel-sans); color: #67636c; margin-top: 8px; }
.stay-details { margin-block: 28px; border-top: 1px solid var(--hotel-border); border-bottom: 1px solid var(--hotel-border); padding-block: 16px; }
.stay-details > div { display: flex; justify-content: space-between; gap: 20px; font-size: 14px; padding-block: 4px; }
.stay-details dt { color: #67636c; }
.stay-details dd { margin: 0; }
.hotel-marketing .three-columns { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.alternate-rooms { background: #f5f0e5; }
.prose { font-size: 16px; line-height: 1.9; }
.prose h2, .hotel-marketing .prose h2 { font: 400 clamp(27px, 2.8vw, 34px)/1.3 var(--hotel-serif); margin-block: 36px 18px; letter-spacing: -.4px; }
.prose > h2:first-child { margin-top: 0; }
.prose h3 { font: 400 24px/1.4 var(--hotel-serif); margin-block: 28px 14px; }
.prose p { margin-block: 0 20px; color: #514c47; }
.prose ul, .prose ol { padding-left: 24px; margin-block: 16px 24px; color: #514c47; }
.prose li { margin-bottom: 10px; }
.prose a:not(.btn) { color: #735822; text-decoration: underline; text-underline-offset: 4px; }
.facility-overview { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.hotel-marketing .facility-overview .facility-card { padding: 28px; gap: 20px; }
.hotel-marketing .facility-overview .facility-card h2 { font: 400 24px/1.3 var(--hotel-serif); margin-bottom: 12px; letter-spacing: -.3px; }
.hotel-marketing .facility-overview .facility-card p { font-size: 14px; line-height: 1.8; }
.hotel-marketing .facility-overview .facility-card .hotel-icon { width: 30px; height: 30px; }
.photo-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; margin-top: 40px; }
.photo-pair img { width: 100%; aspect-ratio: 1.6; height: auto; object-fit: cover; border-radius: 8px; }
figcaption { font-size: 13px; color: #67636c; margin-top: 12px; }
.gallery-filters { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 32px; }
.filter-button { min-height: 44px; padding: 10px 22px; background: white; color: #615b52; border: 1px solid #d7ccbb; border-radius: 6px; }
.filter-button[aria-pressed="true"] { color: #fffaf0; background: #15140f; border-color: #15140f; }
.gallery-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 24px; }
.gallery-grid figure { min-width: 0; }
.gallery-grid img { width: 100%; aspect-ratio: 1.4; height: auto; object-fit: cover; border-radius: 7px; }
.split-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: start; }
.about-photo, .contact-photo { width: 100%; aspect-ratio: 1.1; height: auto; object-fit: cover; border-radius: 8px; }
.narrow-copy { max-width: 800px; }
.contact-panel { padding: 32px; background: white; border: 1px solid var(--hotel-border); border-radius: 8px; }
.hotel-marketing .contact-panel h2 { font-size: 30px; line-height: 1.3; margin-bottom: 28px; }
.contact-row { display: flex; align-items: flex-start; gap: 14px; margin-block: 20px; font-size: 15px; }
.contact-row .hotel-icon { color: #86651f; }
.contact-row a { overflow-wrap: anywhere; }
.contact-buttons { display: flex; flex-wrap: wrap; gap: 14px; }
.contact-guidance { margin-top: 40px; max-width: 850px; }
.article-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 64px; padding-block: 28px 80px; align-items: start; }
.article-heading h1 { font-size: clamp(36px, 3.8vw, 54px); }
.article-meta { font-size: 12px; color: #746b5d; margin-top: 24px; }
.article-intro { color: #514c47; font-size: 18px; line-height: 1.85; margin-block: 24px 32px; }
.article-cover { width: 100%; aspect-ratio: 1.7; height: auto; object-fit: cover; border-radius: 8px; }
.article-body { margin-top: 44px; }
.article-body section { scroll-margin-top: 24px; }
.article-body section + section { margin-top: 36px; }
.article-inline-links { display: flex; flex-direction: column; margin-block: 20px 28px; gap: 12px; }
.article-sidebar { position: sticky; top: 32px; border-left: 1px solid #daceb8; padding-left: 28px; }
.article-sidebar h2 { font: 500 14px/1.5 var(--hotel-sans); margin-bottom: 20px; }
.article-sidebar ol { padding-left: 20px; font-size: 13px; color: #67636c; }
.article-sidebar li { padding-block: 6px; }
.article-sidebar a:hover { color: #735822; text-decoration: underline; }
.sidebar-note { border-top: 1px solid #daceb8; margin-top: 32px; padding-top: 28px; }
.sidebar-note p { font-size: 13px; color: #67636c; line-height: 1.8; margin-bottom: 24px; }
.sidebar-note .btn { width: 100%; }
.reservation-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 48px; align-items: start; }
.reservation-form { min-width: 0; }
.reservation-form fieldset { min-width: 0; margin: 0 0 32px; border: 1px solid var(--hotel-border); border-radius: 8px; background: white; padding: 28px; }
.reservation-form legend { padding-inline: 10px; font: 400 23px/1.4 var(--hotel-serif); }
.reservation-room-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.reservation-room-option { display: flex; flex-direction: column; position: relative; border: 1px solid #d7cebf; border-radius: 7px; overflow: hidden; cursor: pointer; }
.reservation-room-option:has(input:checked) { border-color: #967020; box-shadow: 0 0 0 2px #d4ae5d; background: #fbf7ed; }
.reservation-room-option input { position: absolute; top: 14px; left: 14px; width: 20px; height: 20px; accent-color: #967020; z-index: 1; margin: 0; }
.reservation-room-option img { width: 100%; aspect-ratio: 1.8; height: auto; object-fit: cover; }
.room-option-copy { display: flex; flex-direction: column; gap: 6px; padding: 18px; font-size: 13px; }
.room-option-copy strong { font: 400 21px/1.3 var(--hotel-serif); }
.room-option-copy small { color: #71695c; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.field { min-width: 0; margin-bottom: 20px; }
.field:last-child { margin-bottom: 0; }
.field label { display: block; font-size: 14px; font-weight: 500; margin-bottom: 10px; }
.field label > span { color: #71695c; font-weight: 400; }
.field input, .field textarea { display: block; width: 100%; min-width: 0; max-width: 100%; min-height: 48px; padding: 12px; border: 1px solid #d7cebf; color: #141414; background: #fff; border-radius: 5px; font-size: 16px; }
.field textarea { resize: vertical; }
.field [aria-invalid="true"] { border-color: #b44238; }
.form-help { font-size: 12px; color: #71695c; line-height: 1.8; margin-top: 10px; }
.field-error { font-size: 13px; color: #98352c; margin-top: 8px; }
.form-errors { border: 1px solid #cd9089; border-radius: 7px; padding: 24px; color: #843027; background: #fff5f3; margin-bottom: 32px; }
.hotel-marketing .form-errors h2 { font: 500 16px/1.5 var(--hotel-sans); }
.form-errors ul { font-size: 14px; padding-left: 20px; margin-bottom: 0; }
.reservation-disclosure { font-size: 13px; line-height: 1.8; color: #67636c; margin-bottom: 24px; }
.reservation-disclosure a { color: #735822; text-decoration: underline; }
.reservation-form > .btn { min-height: 52px; }
.hotel-marketing .booking-panel h2 { font: 400 28px/1.3 var(--hotel-serif); letter-spacing: -.3px; }
.booking-steps { font-size: 14px; line-height: 1.8; padding-left: 20px; color: #615b52; margin-block: 24px; }
.booking-steps li { margin-bottom: 16px; }
.booking-panel .booking-notice { padding: 16px; border-radius: 5px; background: #f5f0e5; font-size: 13px; }
.legal-copy { max-width: 850px; padding-block: 0 80px; }
.error-page { padding-block: 80px 120px; min-height: 55vh; }
.error-page > p { max-width: 700px; color: #67636c; font-size: 17px; margin-block: 24px 32px; }
@media (max-width: 1199px) {
    .article-layout { grid-template-columns: minmax(0, 1fr) 260px; gap: 36px; }
    .reservation-layout { grid-template-columns: minmax(0, 1fr) 300px; gap: 28px; }
    .booking-panel { padding: 24px; }
    .hotel-marketing .three-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 1099px) {
    .hotel-public .public-mobile-toggle:not([hidden]) { display: inline-flex; flex-shrink: 0; }
    .hotel-public .nav-booking { margin-left: auto; }
    html:not(.js) .public-nav { flex-wrap: wrap; }
    html:not(.js) .public-nav-links { position: static; order: 4; width: 100%; display: flex; flex-direction: row; flex-wrap: wrap; padding: 0; border: 0; background: transparent; }
    html:not(.js) .public-nav-links a { padding: 8px 12px 8px 0; }
    .article-grid, .gallery-grid, .facility-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .home-location-layout, .split-layout { gap: 36px; }
    .room-detail-layout { gap: 28px; }
}
@media (max-width: 899px) {
    .article-layout, .reservation-layout { grid-template-columns: 1fr; }
    .article-sidebar { position: static; grid-row: 1; border: 1px solid #daceb8; border-radius: 7px; padding: 24px; }
    .article-sidebar ol { columns: 2; gap: 32px; margin-bottom: 0; }
    .article-sidebar li { break-inside: avoid; }
    .sidebar-note { display: none; }
    .reservation-layout > .booking-panel { position: static; }
    .home-location-layout, .split-layout { grid-template-columns: 1fr; }
    .about-photo, .contact-photo { aspect-ratio: 1.6; }
}
@media (max-width: 767px) {
    .page-heading { padding-block: 20px 36px; }
    .page-heading h1, .article-heading h1 { font-size: clamp(34px, 8vw, 46px); letter-spacing: -.7px; }
    .page-heading > p { font-size: 15px; margin-top: 20px; }
    .breadcrumbs { font-size: 11px; padding-block: 20px; }
    .room-detail-layout { grid-template-columns: 1fr; }
    .room-detail-layout .booking-panel { position: static; }
    .article-grid, .gallery-grid, .facility-overview { grid-template-columns: 1fr; }
    .hotel-marketing .three-columns { grid-template-columns: 1fr; }
    .article-card-body { padding: 24px; }
    .article-card h3 { font-size: 25px; }
    .photo-pair { grid-template-columns: 1fr; }
    .information-panel, .contact-panel { padding: 24px; }
    .article-sidebar ol { columns: 1; }
    .article-intro { font-size: 16px; }
    .article-meta { line-height: 1.8; }
    .article-layout { padding-block: 12px 56px; gap: 28px; }
    .prose { font-size: 15px; }
    .reservation-form fieldset { padding: 20px; }
    .reservation-form legend { font-size: 21px; }
    .reservation-room-grid { grid-template-columns: 1fr; }
    .reservation-room-option { display: grid; grid-template-columns: 115px minmax(0, 1fr); }
    .reservation-room-option img { height: 100%; aspect-ratio: auto; min-height: 140px; }
    .room-option-copy { padding: 16px 14px; }
    .room-option-copy strong { font-size: 19px; }
    .form-grid { grid-template-columns: 1fr; gap: 0; }
    .reservation-form > .btn { width: 100%; white-space: normal; }
    .legal-copy { padding-bottom: 56px; }
    .contact-buttons .btn { flex: 1 1 180px; }
    .error-page { padding-block: 48px 80px; }
}

.hotel-public:not(.hotel-home) main .btn-outline { color: #735822; }

/* Small, finite motions: no library, background loops, or permanent GPU layers. */
.hotel-public .gallery-grid figure > a {
    display: block;
    overflow: hidden;
    border-radius: 7px;
}
.hotel-public .room-gallery > a {
    display: block;
    overflow: hidden;
    border-radius: 6px;
}

@media (prefers-reduced-motion: no-preference) {
    .hotel-public .btn {
        transition: transform 180ms ease, background-color 180ms ease,
            border-color 180ms ease, color 180ms ease;
    }
    .hotel-public :is(.public-room-card, .article-card, .facility-card) {
        transition: transform 260ms cubic-bezier(.22, 1, .36, 1), border-color 200ms ease;
    }
    .hotel-public :is(.text-link, .btn) > .hotel-icon:last-child {
        transition: transform 200ms ease;
    }
    .hotel-public :is(.field input, .field textarea, .reservation-room-option, .filter-button) {
        transition: border-color 180ms ease, background-color 180ms ease, color 180ms ease;
    }
    .hotel-public .public-nav-links.is-open {
        animation: hotel-menu-enter 180ms ease-out;
    }
    @keyframes hotel-menu-enter {
        from { opacity: .5; transform: translateY(-6px); }
        to { opacity: 1; transform: none; }
    }
}

/* Hover effects are limited to devices with an accurate pointer. */
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    .hotel-public .public-nav-links a:not(.active)::after {
        content: "";
        position: absolute;
        inset: auto 0 3px;
        height: 2px;
        background: #d4ae58;
        transform: scaleX(0);
        transform-origin: left;
        transition: transform 200ms ease;
    }
    .hotel-public .public-nav-links a:not(.active):is(:hover, :focus-visible)::after {
        transform: scaleX(1);
    }
    .hotel-public .btn:not(:disabled):hover { transform: translateY(-2px); }
    .hotel-public .btn:not(:disabled):active { transform: translateY(0); }
    .hotel-public :is(.public-room-card, .article-card, .facility-card):hover {
        transform: translateY(-4px);
        border-color: #c9aa70;
    }
    .hotel-public :is(.text-link, .btn):hover > .hotel-icon:last-child:not(:first-child) {
        transform: translateX(3px);
    }
    .hotel-public :is(.public-room-card > .hotel-photo, .article-card > a > img,
        .gallery-grid img, .room-gallery img, .facility-photo > .hotel-photo,
        .location-exterior > .hotel-photo) {
        transition: transform 450ms cubic-bezier(.22, 1, .36, 1);
    }
    .hotel-public :is(.public-room-card > .hotel-photo, .article-card > a > img) {
        transform-origin: center bottom;
    }
    .hotel-public :is(.public-room-card:hover > .hotel-photo, .article-card:hover > a > img,
        .gallery-grid a:hover img, .room-gallery a:hover img,
        .facility-photo:hover > .hotel-photo, .location-exterior:hover > .hotel-photo) {
        transform: scale(1.035);
    }
}

@media (prefers-reduced-motion: reduce) {
    .hotel-public *, .hotel-public *::before, .hotel-public *::after {
        animation: none !important;
        transition: none !important;
        scroll-behavior: auto !important;
    }
}
