/* ==========================================================================
   Black Sage — main stylesheet
   --------------------------------------------------------------------------
   Breakpoints (mobile first):
     base      < 600px   Mobile design (Figma 393 frame), 1 design px = 1px
     tablet    ≥ 600px   Mobile composition, scaled 1.2× and centred
     desktop   ≥ 1024px  Desktop design (Figma 1920 frame), scales with viewport
     wide      ≥ 2560px  Desktop scale is capped
   Every design measurement is written as calc(N * var(--plx-u)) where N is the
   source px value of the active Figma frame.
   ========================================================================== */

/* === FONTS ================================================================ */

@font-face {
    font-display: swap;
    font-family: "Montserrat";
    font-style: normal;
    font-weight: 100 900;
    src: url("../fonts/montserrat/montserrat-latin-wght.woff2") format("woff2");
}

@font-face {
    font-display: swap;
    font-family: "Trajan Pro";
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/trajan-pro/TrajanPro-Regular.woff") format("woff");
}

@font-face {
    font-display: swap;
    font-family: "Trajan Pro";
    font-style: normal;
    font-weight: 700;
    src: url("../fonts/trajan-pro/TrajanPro-Bold.woff") format("woff");
}

/* === DESIGN TOKENS ======================================================== */

:root {
    /* Scale unit */
    --plx-u: 1px;

    /* Core palette (01 Color & surfaces) */
    --plx-color-charcoal: #1F1F1F;
    --plx-color-sage: #7A7F6A;
    --plx-color-cream: #F9F1E9;
    --plx-color-stone-pink: #E7D7D0;
    --plx-color-gray: #5B5D63;
    --plx-color-beige: #DBCDC1;
    --plx-color-white: #FFFFFF;
    --plx-color-stroke: #C1B5AA;
    --plx-color-black: #000000;
    --plx-color-sky: #82BAED;
    --plx-color-error: #A3402F;

    /* Semantic roles */
    --plx-bg-page: var(--plx-color-cream);
    --plx-surface-veil: linear-gradient(rgb(255 255 255 / 30%), rgb(255 255 255 / 30%));
    --plx-surface-warm: var(--plx-color-cream);
    --plx-surface-pink: var(--plx-color-stone-pink);
    --plx-surface-sage: var(--plx-color-sage);
    --plx-surface-beige: var(--plx-color-beige);
    --plx-surface-dark: var(--plx-color-charcoal);
    --plx-text-primary: var(--plx-color-charcoal);
    --plx-text-secondary: var(--plx-color-gray);
    --plx-text-accent: var(--plx-color-sage);
    --plx-text-inverse: var(--plx-color-white);
    --plx-text-inverse-muted: var(--plx-color-beige);
    --plx-border: var(--plx-color-stroke);
    --plx-border-soft: rgb(193 181 170 / 50%);
    --plx-border-strong: var(--plx-color-charcoal);
    --plx-border-inverse: var(--plx-color-cream);
    --plx-btn-bg: var(--plx-color-charcoal);
    --plx-btn-text: var(--plx-color-white);
    --plx-focus: var(--plx-color-charcoal);
    --plx-focus-inverse: var(--plx-color-white);
    --plx-overlay-hero: linear-gradient(180deg, rgb(0 0 0 / 0%) 73.6%, rgb(0 0 0 / 57%) 85.6%, rgb(0 0 0 / 92%) 100%);

    /* Typography */
    --plx-font-display: "Trajan Pro", "Trajan Pro 3", serif;
    --plx-font-body: "Montserrat", "Helvetica Neue", Arial, sans-serif;
    --plx-weight-regular: 400;
    --plx-weight-medium: 500;
    --plx-weight-bold: 700;
    --plx-tracking-wide: 0.03em;

    --plx-fs-hero: calc(36 * var(--plx-u));
    --plx-lh-hero: 1.2;
    --plx-fs-heading: calc(24 * var(--plx-u));
    --plx-lh-heading: calc(40 * var(--plx-u));
    --plx-fs-title: calc(16 * var(--plx-u));
    --plx-fs-venue: calc(24 * var(--plx-u));
    --plx-fs-body: calc(12 * var(--plx-u));
    --plx-lh-body: calc(18 * var(--plx-u));
    --plx-fs-eyebrow: calc(10 * var(--plx-u));
    --plx-fs-eyebrow-venue: calc(12 * var(--plx-u));
    --plx-fs-cta: calc(14 * var(--plx-u));
    --plx-fs-label: calc(12 * var(--plx-u));
    --plx-fs-value: calc(14 * var(--plx-u));
    --plx-fs-tab: calc(12 * var(--plx-u));
    --plx-fs-small: calc(12 * var(--plx-u));
    --plx-fs-nav: calc(14 * var(--plx-u));

    /* Spacing */
    --plx-gutter: calc(24 * var(--plx-u));
    --plx-space-1: calc(4 * var(--plx-u));
    --plx-space-2: calc(8 * var(--plx-u));
    --plx-space-3: calc(12 * var(--plx-u));
    --plx-space-4: calc(16 * var(--plx-u));
    --plx-space-6: calc(24 * var(--plx-u));
    --plx-space-8: calc(32 * var(--plx-u));
    --plx-space-10: calc(40 * var(--plx-u));
    --plx-space-13: calc(52 * var(--plx-u));
    --plx-gap-eyebrow: calc(24 * var(--plx-u));
    --plx-gap-heading: calc(32 * var(--plx-u));
    --plx-gap-section: calc(52 * var(--plx-u));

    /* Components */
    --plx-header-height: calc(84 * var(--plx-u));
    --plx-icon-size: calc(16 * var(--plx-u));
    --plx-touch-target: 44px;
    --plx-media-max: 100%;

    /* Motion */
    --plx-ease: cubic-bezier(0.22, 1, 0.36, 1);
    --plx-transition-fast: 150ms ease;
    --plx-transition-base: 250ms ease;
    --plx-transition-slow: 400ms var(--plx-ease);

    /* Layers */
    --plx-z-header: 200;
    --plx-z-menu: 190;
    --plx-z-top: 180;
    --plx-z-preloader: 500;
}

@media (min-width: 600px) {
    :root {
        --plx-media-max: 600px;
        --plx-u: 1.2px;
    }
}

@media (min-width: 1024px) {
    :root {
        --plx-u: min(calc(100vw / 1920), 1.3333px);

        --plx-fs-hero: calc(54 * var(--plx-u));
        --plx-lh-hero: 1;
        --plx-fs-heading: calc(48 * var(--plx-u));
        --plx-lh-heading: calc(68 * var(--plx-u));
        --plx-fs-title: calc(32 * var(--plx-u));
        --plx-fs-venue: calc(32 * var(--plx-u));
        --plx-fs-body: max(14px, calc(20 * var(--plx-u)));
        --plx-lh-body: max(19px, calc(26 * var(--plx-u)));
        --plx-fs-eyebrow: max(12px, calc(18 * var(--plx-u)));
        --plx-fs-eyebrow-venue: max(12px, calc(18 * var(--plx-u)));
        --plx-fs-cta: max(14px, calc(20 * var(--plx-u)));
        --plx-fs-label: max(12px, calc(18 * var(--plx-u)));
        --plx-fs-value: max(14px, calc(20 * var(--plx-u)));
        --plx-fs-tab: max(12px, calc(18 * var(--plx-u)));
        --plx-fs-small: max(12px, calc(18 * var(--plx-u)));
        --plx-fs-nav: max(13px, calc(20 * var(--plx-u)));

        --plx-gutter: calc(120 * var(--plx-u));
        --plx-gap-eyebrow: calc(52 * var(--plx-u));
        --plx-header-height: calc(132 * var(--plx-u));
        --plx-icon-size: calc(24 * var(--plx-u));
        --plx-media-max: none;
    }
}

/* Dark theme — activated with <html data-theme="dark">. No toggle is shown yet. */
:root[data-theme="dark"] {
    --plx-bg-page: #171717;
    --plx-surface-veil: linear-gradient(rgb(255 255 255 / 2%), rgb(255 255 255 / 2%));
    --plx-surface-warm: #1B1A19;
    --plx-surface-pink: #2A2523;
    --plx-surface-beige: #2E2925;
    --plx-surface-dark: #101010;
    --plx-text-primary: var(--plx-color-cream);
    --plx-text-secondary: var(--plx-color-beige);
    --plx-text-accent: #A4A98F;
    --plx-border: #4A443E;
    --plx-border-strong: var(--plx-color-cream);
    --plx-btn-bg: var(--plx-color-cream);
    --plx-btn-text: var(--plx-color-charcoal);
    --plx-focus: var(--plx-color-cream);
}

/* === BASE ================================================================= */

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    -webkit-text-size-adjust: 100%;
    scroll-behavior: smooth;
    scroll-padding-top: var(--plx-header-height);
}

html[data-plx-scroll-lock="true"] {
    overflow: hidden;
}

body {
    background: var(--plx-bg-page);
    color: var(--plx-text-primary);
    font-family: var(--plx-font-body);
    font-size: var(--plx-fs-body);
    font-weight: var(--plx-weight-regular);
    line-height: var(--plx-lh-body);
    margin: 0;
    overflow-x: hidden;
    text-rendering: optimizeLegibility;
}

h1,
h2,
h3,
p,
ul,
figure {
    margin: 0;
}

ul {
    list-style: none;
    padding: 0;
}

img,
svg {
    display: block;
    max-width: 100%;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input {
    color: inherit;
    font: inherit;
}

button {
    background: none;
    border: 0;
    cursor: pointer;
    padding: 0;
}

:focus-visible {
    outline: 2px solid var(--plx-focus);
    outline-offset: 3px;
}

/* === UTILITIES ============================================================ */

.plx-sr-only {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}

.plx-skip-link {
    background: var(--plx-btn-bg);
    color: var(--plx-btn-text);
    font-size: 14px;
    left: 16px;
    padding: 8px 16px;
    position: absolute;
    top: 16px;
    transform: translateY(-200%);
    transition: transform var(--plx-transition-fast);
    z-index: calc(var(--plx-z-preloader) + 1);
}

.plx-skip-link:focus {
    transform: translateY(0);
}

.plx-desktop-only {
    display: none;
}

@media (min-width: 1024px) {
    .plx-desktop-only {
        display: inline;
    }

    .plx-mobile-only {
        display: none;
    }
}

/* === TYPOGRAPHY =========================================================== */

.plx-eyebrow {
    color: var(--plx-text-accent);
    font-size: var(--plx-fs-eyebrow);
    font-weight: var(--plx-weight-medium);
    letter-spacing: var(--plx-tracking-wide);
    line-height: 1.2;
    text-transform: uppercase;
}

.plx-eyebrow-muted {
    color: var(--plx-text-secondary);
}

.plx-heading {
    color: var(--plx-text-primary);
    text-box: trim-both cap alphabetic;
    font-family: var(--plx-font-display);
    font-size: var(--plx-fs-heading);
    font-weight: var(--plx-weight-regular);
    line-height: var(--plx-lh-heading);
    text-transform: uppercase;
}

.plx-body-text {
    color: var(--plx-text-secondary);
    font-size: var(--plx-fs-body);
    line-height: var(--plx-lh-body);
}

/* Mobile panel copy uses Figma's vertical trim; desktop copy keeps full line boxes. */
.plx-panel-text,
.plx-dining-intro {
    text-box: trim-both cap alphabetic;
}

@media (min-width: 1024px) {
    .plx-eyebrow-muted-desktop {
        color: var(--plx-text-secondary);
    }

    .plx-panel-text,
    .plx-dining-intro {
        text-box: normal;
    }
}

/* === COMPONENT: ICON ====================================================== */

.plx-icon {
    flex-shrink: 0;
    height: var(--plx-icon-size);
    width: var(--plx-icon-size);
}

/* === COMPONENT: FILLED BUTTON ============================================= */

.plx-btn {
    align-items: center;
    background: var(--plx-btn-bg);
    border: 1px solid var(--plx-btn-bg);
    color: var(--plx-btn-text);
    display: inline-flex;
    font-size: var(--plx-fs-cta);
    font-weight: var(--plx-weight-medium);
    gap: calc(32 * var(--plx-u));
    justify-content: center;
    line-height: 1.2;
    min-height: var(--plx-touch-target);
    padding: calc(12 * var(--plx-u)) calc(20 * var(--plx-u));
    text-transform: uppercase;
    transition: background-color var(--plx-transition-base), color var(--plx-transition-base);
    white-space: nowrap;
}

.plx-btn .plx-icon {
    transition: transform var(--plx-transition-base);
}

.plx-btn:hover {
    background: transparent;
    color: var(--plx-btn-bg);
}

.plx-btn:hover .plx-icon {
    transform: translateX(4px);
}

.plx-btn[data-plx-loading="true"] {
    cursor: wait;
    opacity: 0.7;
    pointer-events: none;
}

@media (min-width: 1024px) {
    .plx-btn {
        padding: calc(16 * var(--plx-u)) calc(20 * var(--plx-u));
    }
}

/* === COMPONENT: TEXT LINK (bottom-border CTA) ============================= */

.plx-text-link {
    align-items: center;
    border-bottom: 1px solid var(--plx-border-strong);
    color: var(--plx-text-primary);
    display: inline-flex;
    font-size: var(--plx-fs-cta);
    gap: calc(14 * var(--plx-u));
    line-height: 1.2;
    min-height: var(--plx-touch-target);
    padding: calc(12 * var(--plx-u)) calc(16 * var(--plx-u));
    position: relative;
    text-transform: uppercase;
    white-space: nowrap;
}

.plx-text-link::after {
    background: currentColor;
    bottom: -1px;
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    right: 0;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform var(--plx-transition-slow);
}

.plx-text-link .plx-icon {
    transition: transform var(--plx-transition-base);
}

.plx-text-link:hover .plx-icon {
    transform: translateX(4px);
}

.plx-text-link:hover::after {
    transform: scaleX(1);
}

.plx-text-link-inverse {
    border-bottom-color: transparent;
    color: var(--plx-text-inverse);
    font-size: inherit;
    min-height: 0;
    padding: 0;
}

@media (min-width: 1024px) {
    .plx-text-link {
        padding: calc(16 * var(--plx-u)) calc(20 * var(--plx-u));
    }

    .plx-text-link-inverse {
        gap: calc(16 * var(--plx-u));
        padding: 0;
    }
}

/* === COMPONENT: FORM FIELD ERRORS ========================================= */

.plx-field-error {
    color: var(--plx-color-error);
    font-size: max(11px, calc(12 * var(--plx-u)));
    left: 0;
    letter-spacing: 0;
    line-height: 1.3;
    opacity: 0;
    position: absolute;
    text-transform: none;
    top: calc(100% + var(--plx-space-1));
    transition: opacity var(--plx-transition-fast);
    visibility: hidden;
    white-space: nowrap;
}

.plx-field-error[data-plx-visible="true"] {
    opacity: 1;
    visibility: visible;
}

.plx-field-success {
    color: var(--plx-text-accent);
}

/* === COMPONENT: TABS ====================================================== */

.plx-tabs {
    width: 100%;
}

.plx-tabs-head {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.plx-tabs-list {
    display: flex;
    gap: calc(12 * var(--plx-u));
    margin-right: calc(-1 * var(--plx-gutter));
    overflow-x: auto;
    scrollbar-width: none;
}

.plx-tabs-list::-webkit-scrollbar {
    display: none;
}

.plx-tab {
    border-bottom: 1px solid transparent;
    color: var(--plx-text-accent);
    flex-shrink: 0;
    font-size: var(--plx-fs-tab);
    line-height: 1.2;
    min-height: calc(40 * var(--plx-u));
    padding: calc(12 * var(--plx-u)) calc(16 * var(--plx-u));
    text-transform: uppercase;
    transition: background-color var(--plx-transition-base), border-color var(--plx-transition-base), color var(--plx-transition-base);
    white-space: nowrap;
}

.plx-tab:hover {
    color: var(--plx-text-primary);
}

.plx-tab[aria-selected="true"] {
    border-bottom-color: var(--plx-border-strong);
    color: var(--plx-text-primary);
}

.plx-tab[aria-disabled="true"] {
    cursor: default;
}

.plx-tab[aria-disabled="true"]:hover {
    color: var(--plx-text-accent);
}

.plx-tab:focus-visible {
    outline-offset: -2px;
}

.plx-tabs-arrows {
    display: none;
}

.plx-tabs-arrow {
    align-items: center;
    color: var(--plx-text-secondary);
    display: inline-flex;
    justify-content: center;
    transition: color var(--plx-transition-fast), opacity var(--plx-transition-fast);
}

.plx-tabs-arrow:hover:not(:disabled) {
    color: var(--plx-text-primary);
}

.plx-tabs-arrow:disabled {
    cursor: default;
}

/* Panes share one grid cell, so switching tabs never changes the section height.
   .active / .fade / .show are Bootstrap Tab's state classes. */
.plx-tab-content {
    display: grid;
}

.plx-tab-panel {
    grid-area: 1 / 1;
    padding-top: calc(40 * var(--plx-u));
    visibility: hidden;
}

.plx-tab-panel.active {
    visibility: visible;
}

.plx-tab-panel.fade {
    opacity: 0;
    transition: opacity var(--plx-transition-base);
}

.plx-tab-panel.show {
    opacity: 1;
}

.plx-tab-panel-text {
    max-width: calc(853 * var(--plx-u));
}

.plx-tab-panel-cta {
    margin-top: calc(40 * var(--plx-u));
}

@media (min-width: 1024px) {
    .plx-tabs-list {
        gap: calc(24 * var(--plx-u));
        margin-right: 0;
        overflow: visible;
    }

    .plx-tab {
        min-height: calc(54 * var(--plx-u));
        padding: calc(16 * var(--plx-u)) calc(20 * var(--plx-u));
    }

    .plx-tabs-arrows {
        display: flex;
    }

    .plx-tabs-arrow {
        height: var(--plx-icon-size);
        width: var(--plx-icon-size);
    }
}

/* === LAYOUT: PRELOADER ==================================================== */

/* Timing and progress are driven by assets/js/app.js (min 3 s, until the page is ready).
   Without JavaScript the preloader removes itself after 4 s. */
.plx-preloader {
    --plx-progress: 0;
    align-items: center;
    background: var(--plx-surface-veil), var(--plx-surface-warm);
    display: flex;
    inset: 0;
    justify-content: center;
    position: fixed;
    transition: transform 900ms var(--plx-ease), visibility 0s linear 900ms;
    z-index: var(--plx-z-preloader);
}

:root:not([data-plx-preloader="js"]) .plx-preloader {
    animation: plxPreloaderFallback 300ms ease 4s forwards;
}

.plx-preloader-inner {
    align-items: center;
    display: flex;
    flex-direction: column;
    transition: opacity 400ms ease, transform 600ms var(--plx-ease);
}

.plx-preloader-emblem {
    align-items: center;
    display: flex;
    height: 132px;
    justify-content: center;
    position: relative;
    width: 92px;
}

.plx-preloader-arch {
    animation: plxPreloaderReveal 1.4s var(--plx-ease) both;
    border: 1px solid var(--plx-border);
    border-bottom: 0;
    border-radius: 46px 46px 0 0;
    inset: 0;
    position: absolute;
}

.plx-preloader-mark {
    animation: plxPreloaderReveal 1.6s var(--plx-ease) 0.3s both, plxPreloaderBreathe 2.4s ease-in-out 1.9s infinite;
    height: 96px;
    position: relative;
    width: auto;
}

:root[data-theme="dark"] .plx-preloader-mark {
    filter: invert(1);
}

.plx-preloader-tagline {
    animation: plxPreloaderTagline 1.4s var(--plx-ease) 0.6s both;
    color: var(--plx-text-secondary);
    font-size: 11px;
    font-weight: var(--plx-weight-medium);
    letter-spacing: 0.3em;
    line-height: 1.2;
    margin-top: 28px;
    text-transform: uppercase;
}

.plx-preloader-progress {
    background: var(--plx-border);
    height: 1px;
    margin-top: 24px;
    overflow: hidden;
    width: 168px;
}

.plx-preloader-bar {
    background: var(--plx-text-primary);
    display: block;
    height: 100%;
    transform: scaleX(var(--plx-progress));
    transform-origin: left;
}

.plx-preloader-count {
    color: var(--plx-text-accent);
    font-size: 11px;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.08em;
    line-height: 1.2;
    margin-top: 12px;
}

.plx-preloader[data-plx-state="done"] {
    transform: translateY(-100%);
    visibility: hidden;
}

.plx-preloader[data-plx-state="done"] .plx-preloader-inner {
    opacity: 0;
    transform: translateY(-24px);
}

@keyframes plxPreloaderReveal {
    from {
        clip-path: inset(100% 0 0 0);
    }

    to {
        clip-path: inset(0 0 0 0);
    }
}

@keyframes plxPreloaderBreathe {
    0%,
    100% {
        transform: scale(1);
    }

    50% {
        transform: scale(0.97);
    }
}

@keyframes plxPreloaderTagline {
    from {
        letter-spacing: 0.6em;
        opacity: 0;
    }

    to {
        letter-spacing: 0.3em;
        opacity: 1;
    }
}

@keyframes plxPreloaderFallback {
    to {
        opacity: 0;
        visibility: hidden;
    }
}

@media (prefers-reduced-motion: reduce) {
    .plx-preloader-arch,
    .plx-preloader-mark,
    .plx-preloader-tagline {
        animation: none;
    }

    .plx-preloader {
        transition: opacity 300ms ease, visibility 0s linear 300ms;
    }

    .plx-preloader[data-plx-state="done"] {
        opacity: 0;
        transform: none;
    }
}

/* === LAYOUT: HEADER ======================================================= */

.plx-header {
    background: var(--plx-surface-veil), var(--plx-surface-warm);
    position: sticky;
    top: 0;
    z-index: var(--plx-z-header);
}

.plx-header-inner {
    align-items: center;
    display: flex;
    height: var(--plx-header-height);
    justify-content: center;
    padding: calc(8 * var(--plx-u)) var(--plx-gutter);
    position: relative;
}

.plx-header-logo {
    display: block;
    width: calc(165.5 * var(--plx-u));
}

.plx-header-logo img {
    height: auto;
    width: 100%;
}

:root[data-theme="dark"] .plx-header-logo img {
    filter: brightness(0) invert(1);
}

.plx-header-toggle {
    align-items: center;
    color: var(--plx-text-primary);
    display: flex;
    height: var(--plx-touch-target);
    justify-content: center;
    left: calc(var(--plx-gutter) - 10px);
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: var(--plx-touch-target);
}

.plx-header-toggle .plx-icon {
    height: calc(24 * var(--plx-u));
    width: calc(24 * var(--plx-u));
}

.plx-header-toggle-close,
.plx-header[data-plx-menu-open="true"] .plx-header-toggle-open {
    display: none;
}

.plx-header[data-plx-menu-open="true"] .plx-header-toggle-close {
    display: block;
}

.plx-header-nav {
    background: var(--plx-surface-veil), var(--plx-surface-warm);
    border-top: 1px solid var(--plx-border);
    bottom: 0;
    left: 0;
    opacity: 0;
    overflow-y: auto;
    position: fixed;
    right: 0;
    top: var(--plx-header-height);
    transform: translateY(-8px);
    transition: opacity var(--plx-transition-base), transform var(--plx-transition-base), visibility var(--plx-transition-base);
    visibility: hidden;
    z-index: var(--plx-z-menu);
}

.plx-header[data-plx-menu-open="true"] .plx-header-nav {
    opacity: 1;
    transform: translateY(0);
    visibility: visible;
}

.plx-header-nav-list {
    display: flex;
    flex-direction: column;
    padding: var(--plx-space-6) var(--plx-gutter) var(--plx-space-10);
}

.plx-header-nav-item {
    border-bottom: 1px solid var(--plx-border);
}

.plx-header-nav-link {
    align-items: center;
    color: var(--plx-text-primary);
    display: flex;
    font-family: var(--plx-font-display);
    font-size: var(--plx-fs-heading);
    justify-content: space-between;
    letter-spacing: var(--plx-tracking-wide);
    min-height: var(--plx-touch-target);
    padding: var(--plx-space-4) 0;
    text-transform: uppercase;
    transition: color var(--plx-transition-fast);
}

.plx-header-nav-link:hover,
.plx-header-nav-link[aria-current="page"] {
    color: var(--plx-text-accent);
}

@media (min-width: 1024px) {
    .plx-header-inner {
        justify-content: flex-start;
        padding: calc(16 * var(--plx-u)) var(--plx-gutter);
    }

    .plx-header-toggle {
        display: none;
    }

    .plx-header-logo {
        left: 50%;
        position: absolute;
        top: calc(16 * var(--plx-u));
        transform: translateX(-50%);
        width: calc(243 * var(--plx-u));
    }

    .plx-header-nav {
        background: none;
        border: 0;
        opacity: 1;
        overflow: visible;
        position: static;
        transform: none;
        transition: none;
        visibility: visible;
    }

    .plx-header-nav-list {
        flex-direction: row;
        gap: calc(36 * var(--plx-u));
        padding: 0;
    }

    .plx-header-nav-item {
        border: 0;
    }

    .plx-header-nav-link {
        font-family: var(--plx-font-body);
        font-size: var(--plx-fs-nav);
        font-weight: var(--plx-weight-medium);
        letter-spacing: 0;
        line-height: 1.2;
        min-height: 0;
        padding: var(--plx-space-1) 0;
        position: relative;
    }

    .plx-header-nav-link::after {
        background: currentColor;
        bottom: 0;
        content: "";
        height: 1px;
        left: 0;
        position: absolute;
        right: 0;
        transform: scaleX(0);
        transform-origin: left;
        transition: transform var(--plx-transition-slow);
    }

    .plx-header-nav-link:hover {
        color: var(--plx-text-primary);
    }

    .plx-header-nav-link:hover::after,
    .plx-header-nav-link[aria-current="page"]::after {
        transform: scaleX(1);
    }
}

/* === LAYOUT: FOOTER ======================================================= */

.plx-footer {
    background: var(--plx-surface-dark);
    color: var(--plx-text-inverse);
    display: flex;
    flex-direction: column;
    font-size: var(--plx-fs-small);
    gap: calc(40 * var(--plx-u));
    line-height: 1.25;
    padding: var(--plx-gutter);
}

.plx-footer-top {
    display: flex;
    flex-direction: column;
    gap: calc(36 * var(--plx-u));
}

.plx-footer-logo {
    display: block;
    width: calc(243 * var(--plx-u));
}

.plx-footer-logo img {
    height: auto;
    width: 100%;
}

.plx-footer-address {
    display: flex;
    flex-direction: column;
    font-style: normal;
    gap: calc(16 * var(--plx-u));
}

.plx-footer-address-text {
    max-width: calc(150 * var(--plx-u));
    text-box: trim-both cap alphabetic;
}

.plx-footer-contact {
    display: flex;
    flex-direction: column;
    font-style: normal;
    gap: calc(10 * var(--plx-u));
}

.plx-footer-contact a {
    transition: color var(--plx-transition-fast);
}

.plx-footer-contact a:hover {
    color: var(--plx-text-inverse-muted);
}

.plx-footer-bottom {
    border-top: 1px solid var(--plx-border-inverse);
    display: flex;
    flex-direction: column;
    gap: calc(19 * var(--plx-u));
    padding-top: calc(40 * var(--plx-u));
}

.plx-footer-bottom p {
    text-box: trim-both cap alphabetic;
}

.plx-footer :focus-visible {
    outline-color: var(--plx-focus-inverse);
}

@media (min-width: 1024px) {
    .plx-footer {
        gap: calc(36 * var(--plx-u));
        line-height: 1.2;
        padding: calc(32 * var(--plx-u)) var(--plx-gutter);
    }

    .plx-footer-top {
        align-items: center;
        flex-direction: row;
        gap: 0;
        justify-content: space-between;
        max-width: calc(1630.8 * var(--plx-u));
    }

    .plx-footer-logo {
        width: calc(220 * var(--plx-u));
    }

    .plx-footer-address {
        gap: calc(32 * var(--plx-u));
        width: max(calc(247 * var(--plx-u)), 190px);
    }

    .plx-footer-address-text {
        max-width: max(calc(220 * var(--plx-u)), 170px);
    }

    .plx-footer-contact {
        width: max(calc(244 * var(--plx-u)), 190px);
    }

    .plx-footer-bottom {
        flex-direction: row;
        gap: var(--plx-space-6);
        justify-content: space-between;
        padding-top: calc(36 * var(--plx-u));
    }
}

/* === LAYOUT: BACK TO TOP ================================================== */

.plx-back-to-top {
    align-items: center;
    background: var(--plx-btn-bg);
    border: 1px solid var(--plx-border);
    bottom: 20px;
    color: var(--plx-btn-text);
    display: flex;
    height: var(--plx-touch-target);
    justify-content: center;
    opacity: 0;
    position: fixed;
    right: 20px;
    transform: translateY(12px);
    transition: opacity var(--plx-transition-base), transform var(--plx-transition-base), visibility var(--plx-transition-base);
    visibility: hidden;
    width: var(--plx-touch-target);
    z-index: var(--plx-z-top);
}

.plx-back-to-top .plx-icon {
    height: 20px;
    transform: rotate(-90deg);
    width: 20px;
}

.plx-back-to-top[data-plx-visible="true"] {
    opacity: 1;
    transform: translateY(0);
    visibility: visible;
}

.plx-back-to-top:hover {
    background: var(--plx-color-sage);
}

@media (min-width: 1024px) {
    .plx-back-to-top {
        bottom: 32px;
        height: 52px;
        right: 32px;
        width: 52px;
    }
}

/* ==========================================================================
   HOMEPAGE SECTIONS
   ========================================================================== */

/* Shared: decorative art layer and media helpers */
.plx-art {
    background-repeat: no-repeat;
    background-size: 100% 100%;
    pointer-events: none;
    position: absolute;
}

.plx-media-img {
    height: auto;
    max-width: none;
    position: absolute;
}

.plx-media-flip {
    transform: scaleX(-1);
}

/* Shared: centred text panel */
.plx-panel {
    align-items: center;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: var(--plx-space-10) var(--plx-gutter);
    position: relative;
    text-align: center;
}

.plx-panel-heading {
    margin-top: var(--plx-gap-eyebrow);
}

.plx-panel-text {
    margin-top: var(--plx-gap-heading);
}

.plx-panel-action {
    margin-top: var(--plx-gap-section);
    position: relative;
}

.plx-panel-warm {
    background: var(--plx-surface-veil), var(--plx-surface-warm);
}

.plx-panel-pink {
    background: var(--plx-surface-pink);
}

.plx-panel > *:not(.plx-art) {
    max-width: var(--plx-media-max);
    position: relative;
}

@media (min-width: 1024px) {
    .plx-panel-action {
        margin-top: auto;
    }

    .plx-panel > *:not(.plx-art) {
        max-width: none;
    }
}

/* Shared: mobile/tablet composition frame */
.plx-frame {
    margin-inline: auto;
    max-width: var(--plx-media-max);
    overflow: hidden;
    position: relative;
    width: 100%;
}

@media (min-width: 1024px) {
    .plx-frame {
        margin-inline: 0;
        max-width: none;
    }
}

/* === SECTION: HERO ======================================================== */

.plx-hero {
    background: var(--plx-color-sky);
    height: calc(700 * var(--plx-u));
    overflow: hidden;
    position: relative;
}

.plx-hero::after {
    background: var(--plx-overlay-hero);
    content: "";
    inset: 0;
    pointer-events: none;
    position: absolute;
}

.plx-hero-media,
.plx-hero-img {
    height: 100%;
    inset: 0;
    position: absolute;
    width: 100%;
}

.plx-hero-img {
    object-fit: cover;
    object-position: center bottom;
}

.plx-hero-content {
    bottom: calc(32 * var(--plx-u));
    color: var(--plx-text-inverse);
    left: 50%;
    position: absolute;
    text-align: center;
    transform: translateX(-50%);
    width: min(calc(335 * var(--plx-u)), calc(100% - 2 * var(--plx-gutter)));
    z-index: 1;
}

.plx-hero-title {
    font-family: var(--plx-font-display);
    font-size: var(--plx-fs-hero);
    font-weight: var(--plx-weight-bold);
    letter-spacing: var(--plx-tracking-wide);
    line-height: var(--plx-lh-hero);
    text-transform: uppercase;
}

.plx-hero-location {
    font-size: var(--plx-fs-small);
    font-weight: var(--plx-weight-medium);
    line-height: 1.2;
    margin-top: calc(4 * var(--plx-u));
    text-transform: uppercase;
}

@media (min-width: 1024px) {
    .plx-hero {
        height: calc(1050 * var(--plx-u));
    }

    .plx-hero::after {
        content: none;
    }

    .plx-hero-img {
        object-position: center;
    }

    .plx-hero-content {
        bottom: calc(40 * var(--plx-u));
        width: calc(724 * var(--plx-u));
    }

    .plx-hero-title {
        text-box: trim-both cap alphabetic;
        white-space: nowrap;
    }

    .plx-hero-location {
        font-size: max(13px, calc(20 * var(--plx-u)));
        line-height: calc(28 * var(--plx-u));
        margin-top: calc(16 * var(--plx-u));
    }
}

/* === SECTION: BOOKING STRIP =============================================== */

.plx-booking {
    background: var(--plx-surface-veil), var(--plx-surface-warm);
    border-bottom: 1px solid var(--plx-border);
}

.plx-booking-form {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: calc(32 * var(--plx-u));
    margin-inline: auto;
    max-width: var(--plx-media-max);
    padding: var(--plx-gutter);
}

.plx-booking-title {
    font-family: var(--plx-font-display);
    font-size: var(--plx-fs-title);
    font-weight: var(--plx-weight-regular);
    letter-spacing: var(--plx-tracking-wide);
    line-height: 1.2;
    text-align: center;
    text-box: trim-both cap alphabetic;
    text-transform: uppercase;
}

.plx-booking-dates {
    column-gap: calc(32 * var(--plx-u));
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: 100%;
}

.plx-booking-field + .plx-booking-field {
    position: relative;
}

.plx-booking-field + .plx-booking-field::before {
    background: var(--plx-border);
    content: "";
    height: 100%;
    left: calc(-16 * var(--plx-u));
    position: absolute;
    top: 0;
    width: 1px;
}

.plx-booking-action {
    width: 100%;
}

.plx-booking-action .plx-btn {
    width: 100%;
}

@media (min-width: 1024px) {
    .plx-booking-form {
        flex-direction: row;
        gap: 0;
        height: calc(148 * var(--plx-u) - 1px);
        max-width: none;
        padding: 0 var(--plx-gutter);
    }

    .plx-booking-title {
        flex: 0 1 calc(596 * var(--plx-u));
        min-width: 0;
        text-align: left;
    }

    .plx-booking-dates {
        column-gap: 0;
        display: flex;
        width: auto;
    }

    .plx-booking-field,
    .plx-booking-action {
        position: relative;
    }

    .plx-booking-field::before,
    .plx-booking-action::before {
        background: var(--plx-border);
        content: "";
        height: calc(84 * var(--plx-u));
        left: 0;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 1px;
    }

    .plx-booking-field:first-child {
        flex: 0 0 calc(368.4 * var(--plx-u));
        padding-left: calc(45.2 * var(--plx-u));
    }

    .plx-booking-field + .plx-booking-field {
        flex: 0 0 calc(330.4 * var(--plx-u));
        padding-left: calc(45.2 * var(--plx-u));
    }

    .plx-booking-field + .plx-booking-field::before {
        height: calc(84 * var(--plx-u));
        left: 0;
        top: 50%;
    }

    .plx-booking-action {
        display: flex;
        flex: 1;
        justify-content: flex-end;
        padding-left: calc(38 * var(--plx-u));
        width: auto;
    }

    .plx-booking-action .plx-btn {
        width: auto;
    }
}

/* Date field */
.plx-date {
    display: grid;
    grid-template-areas: "label label" "input trigger";
    grid-template-columns: 1fr auto;
    position: relative;
    row-gap: calc(8 * var(--plx-u));
}

.plx-date-label {
    color: var(--plx-text-primary);
    font-size: var(--plx-fs-label);
    grid-area: label;
    letter-spacing: var(--plx-tracking-wide);
    line-height: 1.2;
    text-transform: uppercase;
}

.plx-date-input {
    background: transparent;
    border: 0;
    border-bottom: 1px solid transparent;
    color: var(--plx-text-primary);
    font-size: var(--plx-fs-value);
    grid-area: input;
    letter-spacing: var(--plx-tracking-wide);
    line-height: 1.2;
    min-width: 0;
    padding: 0;
    transition: border-color var(--plx-transition-fast);
    width: 100%;
}

.plx-date-input::placeholder {
    color: var(--plx-text-secondary);
    opacity: 1;
}

.plx-date-input:focus {
    border-bottom-color: var(--plx-border-strong);
    outline: none;
}

.plx-date-input[aria-invalid="true"] {
    border-bottom-color: var(--plx-color-error);
}

.plx-date-trigger {
    align-items: center;
    align-self: center;
    color: var(--plx-text-primary);
    display: flex;
    grid-area: trigger;
    height: var(--plx-touch-target);
    justify-content: flex-end;
    margin: calc(-1 * (var(--plx-touch-target) - var(--plx-icon-size)) / 2) 0;
    transition: color var(--plx-transition-fast);
    width: calc(var(--plx-icon-size) + 8px);
}

.plx-date-trigger:hover {
    color: var(--plx-text-accent);
}

@media (min-width: 1024px) {
    .plx-date {
        width: calc(278 * var(--plx-u));
    }
}

/* === SECTION: STAYS (rooms) =============================================== */

.plx-stays {
    border-top: 1px solid var(--plx-border);
    display: flex;
    flex-direction: column;
}

.plx-stays-room {
    background: var(--plx-surface-pink);
}

.plx-stays-room .plx-frame {
    aspect-ratio: 393 / 420;
}

.plx-stays-room-photo {
    background: var(--plx-color-white);
    border-radius: 30.534% 0 0 0 / 31.579% 0 0 0;
    height: 90.476%;
    left: 0;
    overflow: hidden;
    position: absolute;
    top: 9.524%;
    width: 100%;
}

.plx-stays-room-photo .plx-media-img {
    left: 0;
    top: 0;
    width: 153.435%;
}

.plx-stays-room-corner {
    background-image: url("../svg/art/stays-corner-mobile.svg");
    inset: 0;
}

.plx-stays-caption {
    bottom: calc(24 * var(--plx-u));
    color: var(--plx-text-inverse);
    font-size: var(--plx-fs-small);
    font-weight: var(--plx-weight-medium);
    left: calc(24 * var(--plx-u));
    line-height: 1.2;
    position: absolute;
}

.plx-stays-text {
    border-bottom: 0.8px solid var(--plx-border);
}

.plx-stays-text .plx-body-text {
    margin-top: calc(24 * var(--plx-u));
    max-width: calc(303 * var(--plx-u));
}

.plx-stays-text-art {
    background-image: url("../svg/art/sprig-arch-mobile.svg");
    bottom: 0;
    height: calc(135.3 * var(--plx-u));
    right: calc(-34.6 * var(--plx-u));
    width: calc(131.5 * var(--plx-u));
}

.plx-stays-cafe {
    background: var(--plx-surface-pink);
}

.plx-stays-cafe .plx-frame {
    aspect-ratio: 393 / 627;
}

.plx-stays-cafe-leaf {
    -webkit-mask: url("../svg/art/leaf-mask-mobile.svg") center / 100% 100% no-repeat;
    height: 92.504%;
    left: 0;
    mask: url("../svg/art/leaf-mask-mobile.svg") center / 100% 100% no-repeat;
    overflow: hidden;
    position: absolute;
    top: 7.496%;
    width: 100%;
}

.plx-stays-cafe-leaf .plx-media-img {
    left: -58.79%;
    top: 0;
    width: 159.794%;
}

.plx-stays-cafe-overlay {
    background-image: url("../svg/art/arch-overlay-mobile.svg");
    inset: 0;
}

@media (min-width: 1024px) {
    .plx-stays {
        flex-direction: row;
    }

    .plx-stays-room {
        flex: 0 0 44.271%;
        order: 1;
    }

    .plx-stays-room .plx-frame {
        aspect-ratio: 850 / 849;
    }

    .plx-stays-room-photo {
        border-radius: 29.446% 29.446% 0 0 / 32.68% 32.68% 0 0;
        height: 90.106%;
        top: 9.776%;
        width: 99.882%;
    }

    .plx-stays-room-photo .plx-media-img {
        top: -5.229%;
        width: 150.53%;
    }

    .plx-stays-room-corner {
        background-image: url("../svg/art/stays-corner-desktop.svg");
    }

    .plx-stays-caption {
        bottom: calc(52 * var(--plx-u));
        left: calc(32 * var(--plx-u));
    }

    .plx-stays-cafe {
        border-bottom: 1px solid var(--plx-border);
        border-right: 1px solid var(--plx-border);
        flex: 0 0 15.625%;
        order: 2;
    }

    .plx-stays-cafe .plx-frame {
        aspect-ratio: 300 / 849;
    }

    .plx-stays-cafe-leaf {
        -webkit-mask-image: url("../svg/art/leaf-mask-desktop.svg");
        height: 56.454%;
        mask-image: url("../svg/art/leaf-mask-desktop.svg");
        top: 17.515%;
        width: 99.667%;
    }

    .plx-stays-cafe-leaf .plx-media-img {
        left: -59.197%;
        width: 160.201%;
    }

    .plx-stays-cafe-overlay {
        background-image: url("../svg/art/arch-overlay-desktop.svg");
    }

    .plx-stays-text {
        border-bottom: 0;
        flex: 1 1 auto;
        order: 3;
        padding: calc(230 * var(--plx-u)) var(--plx-gutter) calc(102 * var(--plx-u));
    }

    .plx-stays-text .plx-body-text {
        margin-top: var(--plx-gap-heading);
        max-width: none;
    }

    .plx-stays-text-art {
        background-image: url("../svg/art/sprig-arch-desktop.svg");
        height: calc(267 * var(--plx-u));
        right: 0;
        width: calc(175 * var(--plx-u));
    }
}

/* === SECTION: EXPERIENCES ================================================= */

.plx-experiences {
    display: flex;
    flex-direction: column;
}

.plx-experiences-text {
    border-bottom: 1px solid var(--plx-border);
}

.plx-experiences-text-art {
    background-image: url("../svg/art/swirl-mobile.svg");
    height: calc(195.2 * var(--plx-u));
    left: calc(-95.5 * var(--plx-u));
    top: calc(-64.4 * var(--plx-u));
    width: calc(206 * var(--plx-u));
}

.plx-collage {
    background: var(--plx-surface-sage);
}

.plx-collage .plx-frame {
    aspect-ratio: 393 / 400;
}

.plx-collage-arch,
.plx-collage-window-three {
    display: none;
}

.plx-collage-window {
    height: 66.334%;
    overflow: hidden;
    position: absolute;
    width: 65.292%;
}

.plx-collage-window-one {
    left: 0;
    top: 0;
}

.plx-collage-window-two {
    left: 34.708%;
    top: 33.666%;
}

.plx-collage-window-one .plx-media-img {
    left: -2.689%;
    top: -27.931%;
    width: 185.502%;
}

.plx-collage-window-two .plx-media-img {
    left: -55.846%;
    top: -78.703%;
    width: 185.502%;
}

.plx-collage-square {
    background: var(--plx-color-cream);
    height: 33.75%;
    left: 0;
    position: absolute;
    top: 66.3%;
    width: 34.606%;
}

@media (min-width: 1024px) {
    .plx-experiences {
        flex-direction: row;
    }

    .plx-experiences-text {
        border-bottom: 0;
        flex: 0 0 44.271%;
        padding: calc(200 * var(--plx-u)) var(--plx-gutter) calc(53 * var(--plx-u));
    }

    .plx-experiences-text-art {
        background-image: url("../svg/art/swirl-desktop.svg");
        height: calc(282 * var(--plx-u));
        left: 0;
        top: 0;
        width: calc(261 * var(--plx-u));
    }

    .plx-collage {
        flex: 1 1 auto;
    }

    .plx-collage .plx-frame {
        aspect-ratio: 1070 / 800;
    }

    .plx-collage-arch {
        background: var(--plx-color-white);
        border-radius: 50% 50% 0 0 / 33.31% 33.31% 0 0;
        display: block;
        height: 100%;
        left: 0;
        overflow: hidden;
        position: absolute;
        top: 0;
        width: 49.902%;
    }

    .plx-collage-arch .plx-media-img {
        left: -44.952%;
        top: -0.773%;
        width: 189.174%;
    }

    .plx-collage-arch .plx-media-img + .plx-media-img {
        left: -44.765%;
        opacity: 0.4;
        width: 188.799%;
    }

    .plx-collage-window {
        height: 43.375%;
        width: 32.71%;
    }

    .plx-collage-window-one {
        left: 49.902%;
        top: 0;
    }

    .plx-collage-window-two {
        left: 67.29%;
        top: 22%;
    }

    .plx-collage-window-three {
        display: block;
        height: 34.625%;
        left: 49.907%;
        top: 65.375%;
        width: 35.327%;
    }

    .plx-collage-window-one .plx-media-img {
        left: -1.971%;
        top: -19.28%;
        width: 168.857%;
    }

    .plx-collage-window-two .plx-media-img {
        left: -55.143%;
        top: -70.029%;
        width: 168.857%;
    }

    .plx-collage-window-three .plx-media-img {
        left: -20.106%;
        top: -51.264%;
        width: 194.18%;
    }

    .plx-collage-square {
        height: 22%;
        left: 49.907%;
        top: 43.375%;
        width: 17.383%;
    }
}

/* === SECTION: JOURNEYS (traveller tabs) =================================== */

.plx-journeys {
    background: var(--plx-surface-pink);
    border-bottom: 1px solid var(--plx-border);
    border-top: 1px solid var(--plx-border);
    overflow: hidden;
    padding: var(--plx-space-10) var(--plx-gutter);
    position: relative;
}

.plx-journeys-inner {
    display: flex;
    flex-direction: column;
    gap: var(--plx-gap-section);
    margin-inline: auto;
    max-width: var(--plx-media-max);
    position: relative;
}

.plx-journeys-intro {
    align-self: center;
    max-width: calc(268 * var(--plx-u));
    text-align: center;
}

.plx-journeys-art {
    background-image: url("../svg/art/sprig-oval-mobile.svg");
    bottom: calc(-41 * var(--plx-u));
    height: calc(119.2 * var(--plx-u));
    right: calc(-28.4 * var(--plx-u));
    transform: scaleX(-1);
    width: calc(90.3 * var(--plx-u));
}

@media (min-width: 1024px) {
    .plx-journeys {
        padding: calc(36 * var(--plx-u)) var(--plx-gutter);
    }

    .plx-journeys-inner {
        align-items: center;
        flex-direction: row;
        gap: calc(194 * var(--plx-u));
        max-width: none;
    }

    .plx-journeys-intro {
        flex: 0 0 calc(536 * var(--plx-u));
        max-width: none;
    }

    .plx-journeys-tabs {
        flex: 0 0 calc(853 * var(--plx-u));
    }

    .plx-journeys-art {
        background-image: url("../svg/art/sprig-oval-desktop.svg");
        bottom: 0;
        height: calc(201 * var(--plx-u));
        right: 0;
        transform: none;
        width: calc(103 * var(--plx-u));
    }
}

/* === SECTION: GALLERY BAND (mobile composition only) ====================== */

.plx-gallery-band {
    background: var(--plx-surface-beige);
}

.plx-gallery-band .plx-frame {
    aspect-ratio: 393 / 480;
}

.plx-gallery-band-panel {
    position: absolute;
}

.plx-gallery-band-panel-cream {
    background: var(--plx-color-cream);
    height: 99.875%;
    left: 34.562%;
    top: 0;
    width: 65.313%;
}

.plx-gallery-band-panel-sage {
    background: var(--plx-color-sage);
    height: 21.458%;
    left: 0;
    top: 78.542%;
    width: 100%;
}

.plx-gallery-band-panel-pink {
    background: var(--plx-color-stone-pink);
    height: 27.05%;
    left: 80.307%;
    top: 51.394%;
    width: 19.568%;
}

.plx-gallery-band-arch {
    background: var(--plx-color-white);
    border-radius: 50% 50% 0 0 / 37.67% 37.67% 0 0;
    height: 92.801%;
    left: 5.845%;
    overflow: hidden;
    position: absolute;
    top: 7.158%;
    width: 85.389%;
}

.plx-gallery-band-arch .plx-media-img {
    left: 0;
    top: 0.09%;
    width: 165.375%;
}

.plx-gallery-band-outline {
    background-image: url("../svg/art/bedroom-arch-outline.svg");
    height: 81.458%;
    left: 5.852%;
    top: 8.167%;
    width: 71.247%;
}

@media (min-width: 1024px) {
    .plx-gallery-band {
        display: none;
    }
}

/* === SECTION: DINING ====================================================== */

.plx-dining {
    background: var(--plx-surface-dark);
    color: var(--plx-text-inverse);
    padding: var(--plx-space-10) var(--plx-gutter) var(--plx-space-1);
}

.plx-dining-inner {
    margin-inline: auto;
    max-width: var(--plx-media-max);
}

.plx-dining-head {
    display: flex;
    flex-direction: column;
    gap: calc(32 * var(--plx-u));
    margin-top: var(--plx-gap-eyebrow);
}

.plx-dining-heading {
    color: var(--plx-text-inverse);
}

.plx-dining-intro {
    color: var(--plx-text-inverse-muted);
}

.plx-dining-cards {
    display: flex;
    flex-direction: column;
    margin-top: var(--plx-space-6);
}

.plx-dining :focus-visible {
    outline-color: var(--plx-focus-inverse);
}

@media (min-width: 1024px) {
    .plx-dining {
        padding: calc(80 * var(--plx-u)) var(--plx-gutter);
    }

    .plx-dining-inner {
        max-width: none;
    }

    .plx-dining-head {
        align-items: center;
        flex-direction: row;
        justify-content: space-between;
    }

    .plx-dining-intro {
        max-width: calc(455 * var(--plx-u));
        text-align: right;
    }

    .plx-dining-cards {
        flex-direction: row;
        margin-top: var(--plx-gap-section);
    }
}

/* Small desktop only: keep the dining intro from wrapping to four lines. */
@media (min-width: 1024px) and (max-width: 1279.98px) {
    .plx-dining-intro {
        max-width: max(calc(455 * var(--plx-u)), 330px);
    }
}

/* Venue card */
.plx-venue {
    border-bottom: 1px solid var(--plx-border);
    display: flex;
    flex-direction: column;
    gap: calc(24 * var(--plx-u));
    padding: calc(32 * var(--plx-u)) 0;
}

.plx-venue:first-child {
    border-top: 1px solid var(--plx-border);
}

.plx-venue-meta {
    display: flex;
    flex-direction: column;
    gap: calc(12 * var(--plx-u));
}

.plx-venue-head {
    align-items: flex-start;
    display: flex;
    justify-content: space-between;
    min-height: calc(50 * var(--plx-u));
}

.plx-venue-title {
    font-family: var(--plx-font-display);
    font-size: var(--plx-fs-venue);
    font-weight: var(--plx-weight-regular);
    letter-spacing: var(--plx-tracking-wide);
    line-height: 1.2;
    padding-top: calc(8 * var(--plx-u));
    text-box: trim-both cap alphabetic;
    text-transform: uppercase;
}

.plx-venue-link {
    align-items: center;
    border: 1px solid var(--plx-border);
    border-radius: calc(24 * var(--plx-u));
    color: var(--plx-text-inverse);
    display: inline-flex;
    height: calc(34 * var(--plx-u));
    justify-content: center;
    position: relative;
    transition: background-color var(--plx-transition-base), border-color var(--plx-transition-base), color var(--plx-transition-base);
    width: calc(42 * var(--plx-u));
}

.plx-venue-link::before {
    content: "";
    inset: -5px;
    position: absolute;
}

.plx-venue-link:hover {
    background: var(--plx-color-cream);
    border-color: var(--plx-color-cream);
    color: var(--plx-color-charcoal);
}

.plx-venue-eyebrow {
    color: var(--plx-text-accent);
    font-size: var(--plx-fs-eyebrow-venue);
    font-weight: var(--plx-weight-medium);
    letter-spacing: var(--plx-tracking-wide);
    line-height: 1.2;
    text-transform: uppercase;
}

.plx-venue-text {
    color: var(--plx-text-inverse-muted);
}

@media (min-width: 1024px) {
    .plx-venue {
        border-bottom: 0;
        border-top: 1px solid var(--plx-border-soft);
        flex: 0 0 50%;
        gap: calc(32 * var(--plx-u));
        padding: calc(52 * var(--plx-u)) calc(52 * var(--plx-u)) calc(52 * var(--plx-u)) 0;
    }

    .plx-venue:first-child {
        border-right: 1px solid var(--plx-border-soft);
        border-top-color: var(--plx-border-soft);
    }

    .plx-venue + .plx-venue {
        padding: calc(52 * var(--plx-u)) 0 calc(52 * var(--plx-u)) calc(52 * var(--plx-u));
    }

    .plx-venue-meta {
        gap: calc(16 * var(--plx-u));
    }

    .plx-venue-head {
        min-height: calc(62 * var(--plx-u));
    }

    .plx-venue-title {
        padding-top: calc(13 * var(--plx-u));
    }

    .plx-venue-link {
        height: calc(50 * var(--plx-u));
        width: calc(58 * var(--plx-u));
    }
}

/* Venue composition (Miko is the source layout; Qèlos mirrors it) */
.plx-venue-art {
    aspect-ratio: 345 / 336.8;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.plx-venue-art[data-plx-mirror="true"] {
    transform: scaleX(-1);
}

.plx-venue-art-col-a,
.plx-venue-art-col-b {
    height: 100%;
    position: absolute;
    top: 0;
}

.plx-venue-art-col-a {
    background: var(--plx-color-beige);
    left: 0;
    width: 48.815%;
}

.plx-venue-art-col-b {
    right: 0;
    width: 51.185%;
}

.plx-venue-art-photo,
.plx-venue-art-arch,
.plx-venue-art-arch-window,
.plx-venue-art-window {
    overflow: hidden;
    position: absolute;
}

.plx-venue-art-photo {
    height: 68.286%;
    left: 0;
    top: 0;
    width: 100%;
}

.plx-venue-art-block {
    bottom: 0;
    height: 31.714%;
    left: 0;
    position: absolute;
    width: 40.857%;
}

.plx-venue-art-arch {
    border-radius: 100% 0 0 0 / 39.354% 0 0 0;
    height: 75.143%;
    left: 40.857%;
    top: 24.857%;
    width: 59.143%;
}

.plx-venue-art-arch-window {
    border-radius: 100% 0 0 0 / 78.113% 0 0 0;
    bottom: 0;
    height: 50.38%;
    left: 0;
    width: 100%;
}

.plx-venue-art-window {
    border-radius: 0 56.625% 0 0 / 0 39.51% 0 0;
    bottom: 0;
    height: 75.143%;
    left: 0;
    width: 100%;
}

.plx-venue-art-miko .plx-venue-art-arch {
    background: var(--plx-color-stone-pink);
}

.plx-venue-art-miko .plx-venue-art-col-b {
    background: var(--plx-color-black);
}

.plx-venue-art-miko .plx-venue-art-photo .plx-media-img {
    left: -11.283%;
    top: 0.087%;
    width: 133.61%;
}

.plx-venue-art-miko .plx-venue-art-arch-window .plx-media-img {
    left: -40.964%;
    top: -102.824%;
    width: 395.582%;
}

.plx-venue-art-miko .plx-venue-art-window .plx-media-img {
    left: -79.502%;
    top: -2.173%;
    width: 223.103%;
}

.plx-venue-art-qelos .plx-venue-art-arch {
    background: var(--plx-color-sage);
}

.plx-venue-art-qelos .plx-venue-art-col-b {
    background: var(--plx-color-stone-pink);
}

.plx-venue-art-qelos .plx-venue-art-photo .plx-media-img {
    left: -123.515%;
    top: -9.391%;
    width: 258.314%;
}

.plx-venue-art-qelos .plx-venue-art-arch-window .plx-media-img {
    left: -2.811%;
    top: -112.078%;
    width: 282.129%;
}

.plx-venue-art-qelos .plx-venue-art-window .plx-media-img {
    left: -57.984%;
    top: -6.835%;
    width: 159.117%;
}

@media (min-width: 1024px) {
    .plx-venue-art {
        aspect-ratio: 787.5 / 700;
    }

    .plx-venue-art-col-a {
        width: 44.444%;
    }

    .plx-venue-art-col-b {
        width: 55.556%;
    }

    .plx-venue-art-window {
        border-radius: 0 54.496% 0 0 / 0 38.023% 0 0;
        width: 83.886%;
    }

    .plx-venue-art-miko .plx-venue-art-photo .plx-media-img {
        left: -11.714%;
        top: 0;
        width: 133.429%;
    }

    .plx-venue-art-miko .plx-venue-art-arch-window .plx-media-img {
        left: -36.715%;
        top: -98.491%;
        width: 381.159%;
    }

    .plx-venue-art-miko .plx-venue-art-window .plx-media-img {
        left: -77.112%;
        top: 0;
        width: 214.986%;
    }

    .plx-venue-art-qelos .plx-venue-art-photo .plx-media-img {
        left: -130.571%;
        top: -15.69%;
        width: 270.857%;
    }

    .plx-venue-art-qelos .plx-venue-art-arch-window .plx-media-img {
        left: -1.932%;
        top: -114.717%;
        width: 280.193%;
    }

    .plx-venue-art-qelos .plx-venue-art-window .plx-media-img {
        left: -57.493%;
        top: -8.175%;
        width: 158.038%;
    }
}

/* === SECTION: CONNECT (newsletter · staircase · inner circle) ============= */

.plx-connect {
    display: flex;
    flex-direction: column;
}

.plx-connect-panel {
    border-bottom: 1px solid var(--plx-border);
}

.plx-connect-panel .plx-panel-text {
    max-width: calc(345 * var(--plx-u));
}

.plx-connect-newsletter-art {
    background-image: url("../svg/art/loop-mobile.svg");
    height: calc(55.6 * var(--plx-u));
    left: calc(-15 * var(--plx-u));
    top: calc(32 * var(--plx-u));
    width: calc(55 * var(--plx-u));
}

.plx-connect-stair {
    background: var(--plx-surface-sage);
}

.plx-connect-stair .plx-frame {
    aspect-ratio: 393 / 580;
}

.plx-connect-stair .plx-media-img {
    left: -7.888%;
    top: 0;
    width: 115.776%;
}

@media (min-width: 1024px) {
    .plx-connect {
        flex-direction: row;
    }

    .plx-connect-panel {
        border-top: 1px solid var(--plx-border);
        flex: 0 0 35.677%;
        padding: calc(133 * var(--plx-u)) var(--plx-gutter) calc(53 * var(--plx-u));
    }

    .plx-connect-panel .plx-panel-text {
        max-width: none;
    }

    .plx-connect-newsletter-art {
        background-image: url("../svg/art/loop-desktop.svg");
        height: calc(144 * var(--plx-u));
        left: 0;
        top: 0;
        width: calc(101 * var(--plx-u));
    }

    .plx-connect-stair {
        flex: 0 0 28.646%;
    }

    .plx-connect-stair .plx-frame {
        aspect-ratio: 550 / 800;
    }

    .plx-connect-stair .plx-media-img {
        left: -7.727%;
        width: 115.455%;
    }
}

/* Newsletter email field */
.plx-subscribe {
    width: 100%;
}

.plx-subscribe-field {
    align-items: center;
    border-bottom: 1px solid var(--plx-border-strong);
    display: flex;
    gap: calc(14 * var(--plx-u));
    padding: 0 calc(16 * var(--plx-u));
    position: relative;
    transition: border-color var(--plx-transition-fast);
}

.plx-subscribe-field:focus-within {
    border-bottom-color: var(--plx-text-accent);
}

.plx-subscribe-field[data-plx-error="true"] {
    border-bottom-color: var(--plx-color-error);
}

.plx-subscribe-input {
    background: transparent;
    border: 0;
    color: var(--plx-text-primary);
    flex: 0 1 calc(150 * var(--plx-u));
    font-size: var(--plx-fs-cta);
    line-height: 1.2;
    min-height: var(--plx-touch-target);
    min-width: 0;
    padding: 0;
}

.plx-subscribe-input::placeholder {
    color: var(--plx-text-primary);
    opacity: 1;
}

.plx-subscribe-input:focus {
    outline: none;
}

.plx-subscribe-input:focus::placeholder {
    color: var(--plx-text-secondary);
}

.plx-subscribe-submit {
    align-items: center;
    color: var(--plx-text-primary);
    display: flex;
    height: var(--plx-touch-target);
    justify-content: center;
    transition: transform var(--plx-transition-base);
    width: calc(var(--plx-icon-size) + 8px);
}

.plx-subscribe-submit:hover {
    transform: translateX(4px);
}

.plx-subscribe .plx-field-error {
    left: calc(16 * var(--plx-u));
}

.plx-subscribe .plx-field-success {
    left: calc(16 * var(--plx-u));
}

@media (min-width: 1024px) {
    .plx-subscribe {
        width: calc(445 * var(--plx-u));
    }

    .plx-subscribe-field {
        justify-content: space-between;
        padding: calc(16 * var(--plx-u)) 0;
    }

    .plx-subscribe-input {
        flex: 1 1 auto;
        min-height: calc(24 * var(--plx-u));
    }

    .plx-subscribe-submit {
        height: calc(24 * var(--plx-u));
        justify-content: flex-end;
    }

    .plx-subscribe .plx-field-error,
    .plx-subscribe .plx-field-success {
        left: 0;
    }
}

/* === PLUGIN: AIR DATEPICKER (booking calendar) ============================ */
/* Theme for assets/vendor/air-datepicker; the picker is created with classes: 'plx-datepicker'. */

.air-datepicker.plx-datepicker {
    --adp-accent-color: var(--plx-text-accent);
    --adp-background-color: var(--plx-surface-warm);
    --adp-background-color-active: var(--plx-surface-pink);
    --adp-background-color-hover: var(--plx-surface-pink);
    --adp-border-color: var(--plx-border);
    --adp-border-color-inner: var(--plx-border);
    --adp-border-radius: 0;
    --adp-btn-border-radius: 0;
    --adp-cell-background-color-selected: var(--plx-btn-bg);
    --adp-cell-background-color-selected-hover: var(--plx-btn-bg);
    --adp-cell-border-radius: 0;
    --adp-color: var(--plx-text-primary);
    --adp-color-current-date: var(--plx-text-accent);
    --adp-color-disabled: var(--plx-border);
    --adp-color-other-month: var(--plx-border);
    --adp-color-other-month-hover: var(--plx-text-secondary);
    --adp-color-secondary: var(--plx-text-secondary);
    --adp-day-cell-height: 36px;
    --adp-day-name-color: var(--plx-text-accent);
    --adp-font-family: var(--plx-font-body);
    --adp-font-size: 14px;
    --adp-mobile-day-cell-height: 44px;
    --adp-mobile-font-size: 15px;
    --adp-mobile-nav-height: 48px;
    --adp-mobile-width: min(340px, calc(100vw - 32px));
    --adp-nav-action-size: 36px;
    --adp-nav-arrow-color: var(--plx-text-primary);
    --adp-nav-color-secondary: var(--plx-text-accent);
    --adp-nav-height: 44px;
    --adp-padding: 12px;
    --adp-pointer-size: 10px;
    --adp-poiner-border-radius: 0;
    --adp-transition-offset: 6px;
    --adp-width: 300px;
    --adp-z-index: 190;
    background: var(--plx-surface-veil), var(--plx-surface-warm);
    box-shadow: none;
}

.air-datepicker.plx-datepicker.-is-mobile- {
    --adp-z-index: calc(var(--plx-z-preloader) - 1);
    border: 1px solid var(--plx-border);
}

.plx-datepicker .air-datepicker-nav {
    border-bottom-color: var(--plx-border);
}

.plx-datepicker .air-datepicker-nav--title {
    font-family: var(--plx-font-display);
    font-size: 16px;
    letter-spacing: var(--plx-tracking-wide);
    text-transform: uppercase;
}

.plx-datepicker .air-datepicker-nav--title i {
    color: var(--plx-text-accent);
    font-style: normal;
    margin-left: 6px;
}

.plx-datepicker .air-datepicker-body--day-name {
    font-size: 11px;
    font-weight: var(--plx-weight-medium);
    letter-spacing: var(--plx-tracking-wide);
}

.plx-datepicker .air-datepicker-cell.-current- {
    font-weight: var(--plx-weight-medium);
    text-decoration: underline;
    text-underline-offset: 4px;
}

.plx-datepicker .air-datepicker-cell.-selected-,
.plx-datepicker .air-datepicker-cell.-selected-.-current- {
    color: var(--plx-btn-text);
    text-decoration: none;
}

/* Mobile overlay sits above the sticky header. */
html .air-datepicker-overlay {
    --adp-overlay-background-color: rgb(31 31 31 / 45%);
    --adp-overlay-z-index: calc(var(--plx-z-preloader) - 2);
}

/* === MOTION PREFERENCES =================================================== */

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms;
        animation-iteration-count: 1;
        transition-duration: 0.01ms;
    }
}

/* === PRINT ================================================================ */

@media print {
    .plx-header-toggle,
    .plx-back-to-top,
    .plx-preloader {
        display: none;
    }
}