/* Adaptations of the supplied HTML for database content and accessible controls. */
[hidden] { display: none !important; }
.skip-link { position: fixed; top: -100px; left: 16px; z-index: 2000; padding: 10px 16px; background: var(--foam); color: var(--ink); }
.skip-link:focus { top: 12px; }
section[id], .section-anchor { scroll-margin-top: 110px; }
.section-anchor { display: block; height: 0; }
.hero-content { width: 100%; }
.hero-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.nav-logo .brand-mark { width: auto; height: 75px; }
.nav-logo .brand-name { font-family: 'Fraunces', serif; font-size: 20px; letter-spacing: .04em; color: inherit; text-transform: none; }
.nav .wrap { gap: 14px; }
.nav-links { gap: 20px; }
.lang-switch { margin-left: 0; flex-shrink: 0; }
.lang-btn { display: inline-flex; align-items: center; gap: 5px; }
.lang-btn img { width: 22px; height: 16px; object-fit: contain; }
.nav-burger { color: var(--foam); background: transparent; border: 1px solid currentColor; padding: 8px; cursor: pointer; border-radius: 2px; }
.nav-burger span { display: block; width: 19px; height: 1px; margin: 4px 0; background: currentColor; }
.nav.scrolled .nav-burger { color: var(--ink); }
.nav-cta { white-space: nowrap; }
.hero-pause { position: absolute; z-index: 3; right: 32px; bottom: 65px; border: 1px solid rgba(251,248,241,.5); padding: 6px 12px; background: rgba(14,42,40,.35); color: var(--foam); font: inherit; font-size: 12px; cursor: pointer; }
.intro-quote h2 { font-size: inherit; font-weight: inherit; font-style: inherit; line-height: inherit; }
.intro-photo { width: 100%; margin-top: 28px; border-radius: 3px; }
.room-main-photo, .split-scene { background: linear-gradient(140deg, var(--sea), var(--ink)); }
.section-photo { width: 100%; height: 100%; object-fit: cover; }
.room-main-photo > .section-photo, .split-scene > .section-photo, .g-item > .section-photo, .thumb > .section-photo { position: absolute; inset: 0; }
button.thumb, button.g-item { border: 0; padding: 0; text-align: left; font: inherit; background-color: var(--sea); cursor: pointer; }
.location-photo, .content-photo { width: 100%; max-height: 600px; object-fit: cover; border-radius: 3px; }
.location-contact p { margin-top: 20px; }
.rich-content { overflow-wrap: anywhere; }
.rich-content p { margin-bottom: 20px; }
.rich-content h2, .rich-content h3, .rich-content h4 { margin: 25px 0 14px; line-height: 1.25; }
.rich-content ul, .rich-content ol { padding-left: 24px; margin: 16px 0 24px; }
.rich-content a { text-decoration: underline; text-underline-offset: 3px; }
.rich-content img { height: auto; max-width: 100%; border-radius: 3px; }
.rich-content table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; }
.rich-content td, .rich-content th { padding: 10px; border: 1px solid var(--line); }
.room-details .rich-content { color: var(--ink-soft); }
.content-section { padding: 110px 0; background: var(--foam); }
.content-section:nth-of-type(even) { background: var(--sand); }
.content-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: start; }
.content-grid.without-photo { grid-template-columns: 1fr; max-width: 850px; }
.page-extras { padding-top: 35px; padding-bottom: 35px; display: grid; gap: 30px; }
.page-extras:empty { display: none; }
.page-video { border: 0; width: 100%; max-width: 960px; aspect-ratio: 16 / 9; }
.gallery-description { color: rgba(251,248,241,.75); margin-bottom: 35px; }
.gallery-grid .g-item:focus-visible::after, .gallery-grid .g-item:focus-visible span { opacity: 1; transform: none; }
.booking-photo { width: 100%; max-height: 300px; object-fit: cover; border-radius: 3px; }
.booking-description { color: rgba(251,248,241,.72); margin-bottom: 30px; }
.form-notice { margin-bottom: 24px; padding: 15px; border: 1px solid var(--brass-light); color: var(--foam); }
.form-notice.error { border-color: #ebaa99; }
.form-notice ul { padding-left: 18px; }
.honeypot { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.social-links { display: flex; justify-content: center; flex-wrap: wrap; gap: 22px; margin-top: 25px; font-size: 13px; color: var(--sea); }
.footer-links { flex-wrap: wrap; }
html:not(.js) .reveal { opacity: 1; transform: none; }
@media (max-width: 1100px) { .nav-links { gap: 12px; } .nav-links a { font-size: 12px; } }
@media (max-width: 980px) {
    .nav-burger { display: block; margin-left: auto; }
    .nav-links.is-open { position: absolute; top: 100%; left: 0; right: 0; display: flex; flex-direction: column; gap: 0; padding: 18px 32px; max-height: 70vh; overflow-y: auto; background: var(--foam); border-bottom: 1px solid var(--line); box-shadow: 0 10px 24px rgba(0,0,0,.12); }
    .nav .nav-links.is-open a { display: block; padding: 10px 0; color: var(--ink); font-size: 15px; }
    .split-scene { min-height: 360px; }
    .content-grid { grid-template-columns: 1fr; gap: 30px; }
    .hero-pause { right: 20px; bottom: 48px; }
}
@media (max-width: 600px) {
    .nav { padding: 16px 0; }
    .nav .wrap { flex-wrap: wrap; gap: 9px; }
    .nav-logo .brand-name { font-size: 18px; }
    .nav-logo .brand-mark { height: 33px; }
    .nav-cta { font-size: 11px; padding: 7px 9px; }
    .lang-switch { width: 100%; justify-content: flex-end; gap: 12px; }
    .hero { padding-bottom: 100px; }
    .hero-actions { flex-wrap: wrap; gap: 20px; }
    .intro { padding: 90px 0 70px; }
    .fact-row { flex-wrap: wrap; gap: 8px; }
    .fact-row .fact-title { min-width: 0; }
    .booking-left, .booking-right { padding: 38px 24px; }
    .split-text { padding: 50px 24px; }
    .room-details { padding: 28px 24px; }
    .footer-links { justify-content: center; gap: 16px; }
    .lightbox { padding: 20px; }
}