/* ==========================================================================
   Red Lion Inn – new header / homepage / footer design
   ========================================================================== */

:root {
    --mr-brand-900: #0f1930;
    --mr-brand-800: #14213d;
    --mr-brand-700: #1b2c50;
    --mr-brand-600: #243a66;
    --mr-brand-400: #4b6aa3;
    /* warm stone neutrals (were cool blue-greys) */
    --mr-tint-50: #faf7f2;
    --mr-tint-100: #f1ece4;
    --mr-tint-200: #e6dfd3;
    --mr-tint-300: #d6cbb9;

    --mr-ink: #14213d;   /* headings: brand navy */
    --mr-ink-2: #475467; /* body copy: softer slate */
    --mr-muted: #6b645c;
    --mr-muted-2: #9a9187;
    --mr-line: #ebe5dc;
    --mr-star: #d4a24c;

    /* Warm accents - used sparingly (under ~5% of a screen) */
    --mr-accent: #b4532a;       /* copper: small signals */
    --mr-gold: #c9a45c;         /* warm brass: premium / rated details */
    --mr-gold-soft: #f4ead6;
    --mr-cream: #f7f2ea;        /* alternating section background */
    --mr-white: #fff;
    --mr-footer-bg: #f4f6f9;

    --mr-radius-sm: 8px;
    --mr-radius: 14px;
    --mr-radius-lg: 20px;
    --mr-radius-xl: 26px;

    /* Layered shadows: a tight contact shadow + a soft ambient one */
    --mr-shadow-sm: 0 1px 2px rgba(15, 25, 48, .05), 0 4px 12px rgba(15, 25, 48, .05);
    --mr-shadow: 0 1px 2px rgba(15, 25, 48, .04), 0 6px 16px rgba(15, 25, 48, .06), 0 18px 40px rgba(15, 25, 48, .06);
    --mr-shadow-lg: 0 2px 4px rgba(15, 25, 48, .04), 0 12px 28px rgba(15, 25, 48, .08), 0 32px 64px rgba(15, 25, 48, .10);
    --mr-edge: inset 0 1px 0 rgba(255, 255, 255, .9); /* top-edge highlight on white cards */
    --mr-hairline: #e8e2d8;

    --mr-font: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --mr-container: 1140px;
    /* Full-width (fluid) layout: side gutter for every .mr-container */
    --mr-gutter: 64px;
    /* Max layout width - content stops growing past this and stays centered */
    --mr-site-max: 1800px;
    /* Desktop header height - the hero fills the viewport below it */
    --mr-header-h: 65px;
    --mr-topbar-h: 42px;
    --mr-adminbar-h: 0px;
}

/* Scoped base (new header, homepage and footer only)
   --------------------------------------------------------------------------
   Everything in this file is namespaced with "mr-" so it never touches the
   inner pages, which still use Bootstrap + assets/css/style.css. Resets use
   :where() so they carry element-level specificity only and any component
   class below always wins over them. */
.mr-ui {
    font-family: var(--mr-font);
    font-size: 15px;
    font-weight: 400;
    line-height: 1.6;
    letter-spacing: normal;
    color: var(--mr-ink);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
:where(.mr-ui) *,
:where(.mr-ui) *::before,
:where(.mr-ui) *::after { box-sizing: border-box; }
:where(.mr-ui) h1, :where(.mr-ui) h2, :where(.mr-ui) h3,
:where(.mr-ui) h4, :where(.mr-ui) h5, :where(.mr-ui) h6 {
    margin: 0;
    font-family: inherit;
    letter-spacing: normal;
    line-height: 1.3;
}
:where(.mr-ui) p { margin: 0; }
:where(.mr-ui) ul { margin: 0; padding: 0; list-style: none; }
:where(.mr-ui) img { display: block; max-width: 100%; height: auto; }
:where(.mr-ui) a { color: inherit; text-decoration: none; transition: color .2s ease; }
:where(.mr-ui) button,
:where(.mr-ui) input { font: inherit; color: inherit; letter-spacing: normal; }
:where(.mr-ui) button { cursor: pointer; background: none; border: 0; padding: 0; border-radius: 0; }
:where(.mr-ui) small { font-size: inherit; }

.mr-screen-reader-text {
    position: absolute !important;
    width: 1px; height: 1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px);
    white-space: nowrap;
}

.mr-icon { width: 1em; height: 1em; flex-shrink: 0; }

html { scroll-behavior: smooth; }
body.home { overflow-x: hidden; }

.mr-container {
    width: 100%;
    max-width: var(--mr-site-max);
    margin: 0 auto;
    padding: 0 var(--mr-gutter);
}

.mr-section { padding: 20px 0; }

.mr-section-title {
    font-size: 30px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -.02em;
    color: var(--mr-ink);
}

.mr-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 26px;
}

.mr-link-more {
    display: inline-flex;
    flex-shrink: 0;
    white-space: nowrap;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    font-weight: 600;
    color: var(--mr-brand-800);
}
.mr-link-more .mr-icon { font-size: 16px; stroke-width: 2.25; transition: transform .2s ease; }
.mr-link-more:hover .mr-icon { transform: translateX(3px); }

/* Buttons
   ========================================================================== */
.mr-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    height: 45px;
    padding: 0 26px;
    border-radius: var(--mr-radius-sm);
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
}
.mr-btn--primary { background: var(--mr-brand-800); color: #fff; }
.mr-btn--primary:hover { background: var(--mr-brand-900); }
.mr-btn--sm { height: 40px; padding: 0 22px; font-size: 14px; border-radius: 6px; }
.mr-btn--outline {
    background: var(--mr-tint-50);
    color: var(--mr-brand-800);
    border: 1.5px solid var(--mr-tint-300);
    height: 45px;
    padding: 0 36px;
}
.mr-search-panel__col .mr-btn--primary
{ 
    background: var(--mr-tint-50);
    color: var(--mr-brand-800);
    border: 1.5px solid var(--mr-tint-300); 
}

.mr-search-panel__col .mr-btn--primary:hover
{
    background: #fff;
    border-color: var(--mr-brand-400);
}
.mr-btn--outline:hover { background: var(--mr-tint-100); border-color: var(--mr-brand-400); }
.mr-btn--light-green { background: var(--mr-brand-400); color: #fff; }
.mr-btn--light-green:hover { background: #3d5a8f; }

.mr-btn--login { height: 44px; padding: 0 22px; font-size: 12px; }
.mr-btn--login .mr-icon { font-size: 18px; }

/* Header
   ========================================================================== */
.mr-site-header {
    position: relative;
    z-index: 50;
    background: #fff;
}

/* Top bar */
.mr-topbar {
    background: linear-gradient(100deg, var(--mr-brand-800) 0%, var(--mr-brand-600) 100%);
    color: rgba(255, 255, 255, .88);
    font-size: 13px;
}
.mr-topbar__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    height: var(--mr-topbar-h);
}
.mr-topbar__info,
.mr-topbar__social { display: flex; align-items: center; }
.mr-topbar__info { gap: 28px; min-width: 0; }
.mr-topbar__info li { min-width: 0; }
.mr-topbar__info a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
    font-size: 12px;
}
.mr-topbar__info a span { overflow: hidden; text-overflow: ellipsis; }
.mr-topbar__info .mr-icon { font-size: 15px; color: #a9bde3; }
.mr-topbar a:hover { color: #fff; }

.mr-topbar__meta { display: flex; align-items: center; gap: 22px; flex-shrink: 0; font-size: 12px; }
.mr-topbar__hours { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.mr-topbar__hours .mr-icon { font-size: 15px; color: #a9bde3; }
.mr-topbar__social { gap: 6px; padding-left: 22px; border-left: 1px solid rgba(255, 255, 255, .18); }
.mr-topbar__social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px; height: 26px;
    border-radius: 50%;
    font-size: 14px;
    transition: background-color .2s ease;
}
.mr-topbar__social a:hover { background: rgba(255, 255, 255, .14); }
.mr-site-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: var(--mr-header-h);
}

.mr-site-logo {
    font-size: 30px;
    font-weight: 800;
    letter-spacing: -.03em;
    line-height: 1;
    color: var(--mr-brand-800);
}
.mr-site-logo--sm { font-size: 22px; }
.mr-site-logo { display: inline-flex; align-items: center; flex-shrink: 0; }
.mr-site-logo__img { width: auto; height: 50px; box-shadow: 0 6px 16px rgb(255 255 255 / 28%); }
.mr-site-logo--sm .mr-site-logo__img { height: 55px; }

/*.mr-main-nav { margin-left: auto; margin-right: 56px; }*/
.mr-main-nav__list { display: flex; align-items: center; gap: 40px; }
.mr-main-nav__list a {
    white-space: nowrap;
    position: relative;
    display: block;
    padding: 5px 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--mr-ink);
}
.mr-main-nav__list a::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: -4px;
    height: 2px;
    border-radius: 2px;
    background: var(--mr-brand-800);
    transform: scaleX(0);
    transition: transform .25s ease;
}
.mr-main-nav__list a:hover,
.mr-main-nav__list a.is-active { color: var(--mr-brand-800); }
.mr-main-nav__list a:hover::after,
.mr-main-nav__list a.is-active::after { transform: scaleX(1); }
.mr-main-nav__login-mobile { display: none; }

.mr-site-header__actions { display: flex; align-items: center; gap: 12px; }

.mr-nav-toggle {
    display: none;
    width: 44px; height: 44px;
    align-items: center; justify-content: center;
    border-radius: var(--mr-radius-sm);
    border: 1px solid var(--mr-line);
    font-size: 22px;
    color: var(--mr-brand-800);
}
.mr-nav-toggle__close { display: none; }
.mr-is-nav-open .mr-nav-toggle__open { display: none; }
.mr-is-nav-open .mr-nav-toggle__close { display: block; }

/* Hero
   ========================================================================== */
.mr-hero {
    position: relative;
    /* how far the search panel overlaps the bottom of the hero photo */
    --mr-panel-overlap: 122px;
}

/* Desktop: hero + search panel together fill exactly the first screen below
   the header - the photo box grows/shrinks with the window height and the
   panel stays pinned across its bottom edge. min-height stops it squashing
   the text on very short windows (it scrolls a little there instead). */
body.admin-bar { --mr-adminbar-h: 32px; }
@media (min-width: 1025px) {
    .mr-hero {
        display: flex;
        flex-direction: column;
        height: calc(100vh - var(--mr-topbar-h) - var(--mr-header-h) - var(--mr-adminbar-h));
        height: calc(100svh - var(--mr-topbar-h) - var(--mr-header-h) - var(--mr-adminbar-h));
        min-height: 500px;
        /*padding-bottom: 24px;*/
        padding: 20px 0;
    }
    .mr-hero > .mr-container { flex: none; }
}

.mr-hero__box {
    position: relative;
    min-height: 590px;
    margin: 0 24px;
    border-radius: var(--mr-radius-xl);
    overflow: hidden;
    background: linear-gradient(90deg, #f0ebe3 0%, #f3eee7 40%, #f4f0e9 100%);
}
@media (min-width: 1025px) {
    .mr-hero__box {
        flex: 1 1 auto;
        min-height: 0;
        /* centre the copy vertically in the space above the search panel */
        display: flex;
        align-items: center;
    }
}
/* Past the max layout width, keep the hero aligned with the capped container */
@media (min-width: 1800px) {
    .mr-hero__box { width: calc(100% - 48px); max-width: calc(var(--mr-site-max) - 48px); margin: 0 auto; }
}

.mr-hero__media {
    position: absolute;
    top: 0; right: 0; bottom: 0;
    width: 70%;
    /* clip the Ken Burns zoom - otherwise the scaled photo spills past the
       left edge, outside the mint fade overlay (::before), as a hard strip */
    overflow: hidden;
}
.mr-hero__media img {
    position: absolute;
    inset: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    object-position: 60% 40%;
}
.mr-hero__media::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(90deg,
        #f1ece4 0%,
        rgba(241, 236, 228, .92) 14%,
        rgba(241, 236, 228, .55) 30%,
        rgba(241, 236, 228, 0) 50%);
}

.mr-hero__content {
    position: relative;
    z-index: 2;
    max-width: 700px;
    padding: 84px 0 0 calc(var(--mr-gutter) - 24px);
}

.mr-hero__title {
    font-size: 58px;
    font-weight: 700;
    line-height: 1.12;
    letter-spacing: -.035em;
    color: var(--mr-ink);
}
.mr-hero__title span { color: var(--mr-brand-800); font-style: italic; }

.mr-hero__text {
    max-width: 500px;
    margin-top: 24px;
    font-size: 16px;
    line-height: 1.65;
    color: var(--mr-ink-2);
}

/* Eyebrow label above each slide title */
.mr-hero__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 18px;
    padding: 7px 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .75);
    box-shadow: var(--mr-shadow-sm);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--mr-brand-800);
}
.mr-hero__eyebrow::before {
    content: "";
    width: 6px; height: 6px;
    border-radius: 50%;
    background: var(--mr-brand-400);
}

/* Buttons - shared by all slides, so they stay put */
.mr-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 28px;
}
.mr-hero__btn { height: 45px; padding: 0 28px; font-size: 13px; }
.mr-hero__btn .mr-icon { font-size: 18px; stroke-width: 2.25; transition: transform .2s ease; }
.mr-hero__btn:hover .mr-icon { transform: translateX(3px); }
.mr-btn--ghost {
    background: rgba(255, 255, 255, .85);
    color: var(--mr-brand-800);
    border: 1.5px solid var(--mr-tint-300);
}
.mr-btn--ghost:hover { background: #fff; border-color: var(--mr-brand-400); }

/* Hero slider - photos crossfade; each slide's copy slides in from the left
   (title, text, chip staggered) and the outgoing copy slides off to the right. */
/* Ken Burns: the active photo slowly zooms (100% -> 108%) toward its own
   focus point (--mr-kb-origin, set per slide in front-page.php). It's a CSS
   animation (not a transition) so it can be frozen mid-zoom with the pause
   button (.is-paused). The outgoing photo keeps zooming while it fades out
   (.is-leaving, removed by home.js after the 1.2s fade), so it never snaps
   back to 100% while still visible. */
.mr-hero__img {
    opacity: 0;
    transform-origin: var(--mr-kb-origin, 50% 50%);
    transition: opacity 1.2s ease;
    will-change: transform, opacity;
}
.mr-hero__img.is-active { opacity: 1; }
.mr-hero__img.is-active,
.mr-hero__img.is-leaving { animation: mr-kenburns 7.5s linear forwards; }
.is-paused .mr-hero__img { animation-play-state: paused; }
@keyframes mr-kenburns {
    from { transform: scale(1); }
    to   { transform: scale(1.08); }
}
/* Zoom switched off in Home Page > Hero Slider > Hero Image Animation */
.mr-hero__box--still .mr-hero__img { animation: none !important; }

.mr-hero__slides { display: grid; }
.mr-hero__slide {
    grid-area: 1 / 1;
    visibility: hidden;
    pointer-events: none;
}
.mr-hero__slide > * {
    opacity: 0;
    transform: translateX(-56px);
    transition: opacity .6s ease, transform .8s cubic-bezier(.2, .7, .2, 1);
}
.mr-hero__slide.is-active,
.mr-hero__slide.is-leaving { visibility: visible; }
.mr-hero__slide.is-active { pointer-events: auto; }
.mr-hero__slide.is-active > * { opacity: 1; transform: none; }
.mr-hero__slide.is-active > :nth-child(1) { transition-delay: .25s; }
.mr-hero__slide.is-active > :nth-child(2) { transition-delay: .4s; }
.mr-hero__slide.is-active > :nth-child(3) { transition-delay: .55s; }
.mr-hero__slide.is-active > :nth-child(4) { transition-delay: .7s; }
.mr-hero__slide.is-leaving > * {
    opacity: 0;
    transform: translateX(56px);
    transition-duration: .45s;
}

.mr-hero__controls {
    position: absolute;
    right: calc(var(--mr-gutter) - 24px);
    bottom: 146px;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 5px 6px 5px 12px;
    border-radius: 999px;
    background: rgba(15, 25, 48, .28);
    backdrop-filter: blur(4px);
}
.mr-hero__dots { display: flex; align-items: center; gap: 8px; }
.mr-hero__toggle {
    display: inline-flex;
    align-items: center; justify-content: center;
    width: 24px; height: 24px;
    border-radius: 50%;
    color: #fff;
    font-size: 11px;
    transition: background-color .2s ease;
}
.mr-hero__toggle:hover { background: rgba(255, 255, 255, .18); }
.mr-hero__toggle .mr-icon { fill: currentColor; stroke: none; }
.mr-hero__toggle-play { display: none; margin-left: 2px; }
.mr-hero__toggle.is-paused .mr-hero__toggle-play { display: block; }
.mr-hero__toggle.is-paused .mr-hero__toggle-pause { display: none; }
.mr-hero__dot {
    width: 9px;
    height: 9px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .55);
    transition: width .3s ease, background-color .3s ease;
}
.mr-hero__dot:hover { background: rgba(255, 255, 255, .85); }
.mr-hero__dot.is-active { width: 26px; background: #fff; }

@media (prefers-reduced-motion: reduce) {
    .mr-hero__img,
    .mr-hero__slide > * { transition: none; }
    .mr-hero__img { animation: none !important; }
    .mr-hero__slide > * { transform: none; }
}

/* Desktop: hero copy scales with the window height so it always clears the
   search panel (see .mr-hero) */
@media (min-width: 1025px) {
    .mr-hero__content {
        width: 100%;
        max-width: 720px;
        /* bottom padding reserves the panel overlap so the copy centres in
           the part of the photo that is actually visible */
        padding-top: clamp(24px, 4vh, 48px);
        padding-bottom: calc(var(--mr-panel-overlap) + clamp(24px, 4vh, 48px));
    }
    .mr-hero__title { font-size: clamp(40px, 6.2vh, 58px); }
    .mr-hero__text { max-width: 500px; margin-top: clamp(12px, 2.4vh, 24px); }
    .mr-hero__eyebrow { margin-bottom: clamp(10px, 1.8vh, 18px); }
    .mr-hero__actions { margin-top: clamp(16px, 3vh, 28px); }
}
/* Short laptop screens: drop the eyebrow so the copy still fits in the
   visible area above the search panel */
@media (min-width: 1025px) and (max-height: 700px) {
    .mr-hero__eyebrow { display: none; }
}

/* Search panel (overlaps hero) */
.mr-search-panel {
    position: relative;
    z-index: 3;
    display: grid;
    grid-template-columns: 1.22fr 1fr 1.2fr;
    margin-top: calc(-1 * var(--mr-panel-overlap));
    padding: 20px 0;
    border-radius: var(--mr-radius-lg);
    background: #fff;
    box-shadow: var(--mr-shadow-lg);
}
.mr-search-panel__col { padding: 0 34px; }
.mr-search-panel__col + .mr-search-panel__col { border-left: 1px solid var(--mr-line); }

.mr-search-panel__title {
    font-size: 17px;
    font-weight: 700;
    color: var(--mr-ink);
}
.mr-search-panel__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.mr-panel-link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    color: var(--mr-brand-800);
}
.mr-panel-link .mr-icon { font-size: 15px; stroke-width: 2.25; transition: transform .2s ease; }
.mr-panel-link:hover .mr-icon { transform: translateX(3px); }

.mr-amenity-list {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    max-width: 440px;
    margin-top: 18px;
}
.mr-amenity { display: flex; flex-direction: column; align-items: center; gap: 10px; min-width: 0; }
.mr-amenity__icon {
    display: inline-flex;
    align-items: center; justify-content: center;
    width: 50px; height: 50px;
    border: 1px solid var(--mr-line);
    border-radius: 12px;
    background: #fff;
    font-size: 30px;
    color: var(--mr-brand-700);
    transition: border-color .2s ease, background-color .2s ease;
}
.mr-amenity__icon .mr-icon { stroke-width: 1.5; }
.mr-amenity:nth-child(2) .mr-amenity__icon,
.mr-amenity:nth-child(4) .mr-amenity__icon { color: #e9a126; }
.mr-amenity:hover .mr-amenity__icon { border-color: var(--mr-tint-300); background: var(--mr-tint-50); }
.mr-amenity__label { font-size: 13px; font-weight: 500; line-height: 1.3; text-align: center; color: var(--mr-ink-2); }

.mr-search-panel__label {
    display: block;
    margin-top: 12px;
    font-size: 13px;
    color: var(--mr-muted);
}
.mr-stay-btn { margin-top: 16px; }
.mr-stay-btn .mr-icon { font-size: 18px; }

/* What's Nearby */
.mr-nearby-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 18px;
    margin-top: 16px;
}
.mr-nearby { display: flex; align-items: center; gap: 12px; min-width: 0; }
.mr-nearby__icon {
    display: inline-flex;
    align-items: center; justify-content: center;
    flex-shrink: 0;
    width: 40px; height: 40px;
    border-radius: 50%;
    background: var(--mr-tint-100);
    color: var(--mr-brand-800);
    font-size: 19px;
}
.mr-nearby__icon .mr-icon { stroke-width: 1.6; }
.mr-nearby__label {
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.35;
    color: var(--mr-ink-2);
}
/* Featured stays
   ========================================================================== */

.mr-stay-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 24px;
}
/* 4 cards get narrow on laptops: tighter padding, then 2 per row */
@media (max-width: 1280px) {
    .mr-stay-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
}

.mr-stay-card {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: var(--mr-radius);
    background: #fff;
    box-shadow: var(--mr-shadow);
    transition: transform .3s ease, box-shadow .3s ease;
}
.mr-stay-card:hover { box-shadow: var(--mr-shadow-lg); }

.mr-stay-card__media {
    position: relative;
    display: block;
    aspect-ratio: 360 / 220;
    overflow: hidden;
    background: var(--mr-tint-100);
}
/* Room photo slider: photos are stacked and crossfade (home.js) */
.mr-stay-card__photos {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    background: none;
    cursor: zoom-in;
}
.mr-stay-card__photos:focus-visible { outline: 3px solid var(--mr-brand-400); outline-offset: -3px; }
.mr-stay-card__img {
    position: absolute;
    inset: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    opacity: 0;
    transition: opacity .45s ease, transform .6s ease;
}
.mr-stay-card__img.is-active { opacity: 1; }
.mr-stay-card:hover .mr-stay-card__img { transform: scale(1.05); }

.mr-stay-card__arrow {
    position: absolute;
    top: 50%;
    z-index: 2;
    display: inline-flex;
    align-items: center; justify-content: center;
    width: 38px; height: 38px;
    margin-top: -19px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .92);
    box-shadow: var(--mr-shadow-sm);
    color: var(--mr-ink);
    font-size: 18px;
    transition: background-color .2s ease, color .2s ease;
}
.mr-stay-card__arrow .mr-icon { stroke-width: 2.25; }
.mr-stay-card__arrow.is-prev { left: 14px; }
.mr-stay-card__arrow.is-prev .mr-icon { transform: rotate(180deg); }
.mr-stay-card__arrow.is-next { right: 14px; }
.mr-stay-card__arrow:hover { background: var(--mr-brand-800); color: #fff; }
/* Slightly smaller arrows on touch screens */
@media (hover: none) {
    .mr-stay-card__arrow { width: 34px; height: 34px; margin-top: -17px; }
}

.mr-stay-card__count {
    position: absolute;
    right: 14px; bottom: 14px;
    z-index: 2;
    padding: 4px 10px;
    border-radius: 999px;
    background: rgba(15, 25, 48, .55);
    backdrop-filter: blur(4px);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.3;
    color: #fff;
    pointer-events: none;
}

/* Room photo gallery (lightbox) */
.mr-lightbox {
    position: fixed;
    inset: 0;
    z-index: 100000;
    display: flex;
    flex-direction: column;
    background: rgba(9, 15, 29, .97);
    color: #fff;
    animation: mr-lightbox-in .25s ease;
}
.mr-lightbox[hidden] { display: none; }
@keyframes mr-lightbox-in { from { opacity: 0; } to { opacity: 1; } }
html.mr-lightbox-open { overflow: hidden; }

.mr-lightbox__bar {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 24px;
}
.mr-lightbox__title { flex: 1; min-width: 0; font-size: 18px; font-weight: 700; color: #fff; }
.mr-lightbox__count { font-size: 14px; font-weight: 600; color: rgba(255, 255, 255, .75); }
.mr-lightbox__close,
.mr-lightbox__arrow {
    display: inline-flex;
    align-items: center; justify-content: center;
    flex-shrink: 0;
    width: 44px; height: 44px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .12);
    color: #fff;
    font-size: 22px;
    transition: background-color .2s ease;
}
.mr-lightbox__close:hover,
.mr-lightbox__arrow:hover { background: var(--mr-brand-700); }
.mr-lightbox__close .mr-icon,
.mr-lightbox__arrow .mr-icon { stroke-width: 2.25; }

.mr-lightbox__stage {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    flex: 1;
    min-height: 0;
    padding: 0 24px;
}
.mr-lightbox__img {
    max-width: min(100%, 1400px);
    max-height: 100%;
    min-width: 0;
    object-fit: contain;
    border-radius: 10px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, .45);
}
.mr-lightbox__arrow { width: 52px; height: 52px; }
.mr-lightbox__arrow.is-prev .mr-icon { transform: rotate(180deg); }
.mr-lightbox__arrow[hidden] { display: none; }

.mr-lightbox__thumbs {
    display: flex;
    gap: 10px;
    padding: 18px 24px 22px;
    overflow-x: auto;
}
.mr-lightbox__thumb {
    flex-shrink: 0;
    width: 88px; height: 60px;
    padding: 0;
    overflow: hidden;
    border: 2px solid transparent;
    border-radius: 8px;
    opacity: .55;
    transition: opacity .2s ease, border-color .2s ease;
}
/* centred, but still scrollable from the first thumb when they overflow */
.mr-lightbox__thumb:first-child { margin-left: auto; }
.mr-lightbox__thumb:last-child { margin-right: auto; }
.mr-lightbox__thumb img { width: 100%; height: 100%; object-fit: cover; }
.mr-lightbox__thumb:hover { opacity: .9; }
.mr-lightbox__thumb.is-active { opacity: 1; border-color: var(--mr-brand-400); }

@media (max-width: 767px) {
    .mr-lightbox__bar { padding: 12px 16px; }
    .mr-lightbox__title { font-size: 16px; }
    .mr-lightbox__stage { padding: 0 12px; }
    /* arrows float over the photo on phones */
    .mr-lightbox__arrow { position: absolute; top: 50%; z-index: 1; width: 40px; height: 40px; margin-top: -20px; background: rgba(0, 0, 0, .45); }
    .mr-lightbox__arrow.is-prev { left: 18px; }
    .mr-lightbox__arrow.is-next { right: 18px; }
    .mr-lightbox__thumbs { padding: 14px 16px 18px; }
    .mr-lightbox__thumb { width: 64px; height: 44px; }
}

.mr-stay-card__badge {
    position: absolute;
    top: 16px; left: 16px;
    z-index: 2;
    max-width: calc(100% - 32px);
    padding: 6px 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .92);
    box-shadow: var(--mr-shadow-sm);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--mr-brand-800);
}

.mr-stay-card__body {
    display: flex;
    flex-direction: column;
    flex: 1;
    position: relative;
    padding: 22px 24px 24px;
}
.mr-stay-card__title { font-size: 19px; font-weight: 700; line-height: 1.3; color: var(--mr-ink); }
.mr-stay-card__title a:hover { color: var(--mr-brand-800); }

.mr-stay-card__facts {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 20px;
    margin-top: 12px;
    font-size: 14px;
    font-weight: 600;
    color: var(--mr-ink-2);
}
.mr-stay-card__facts li { display: inline-flex; align-items: center; gap: 7px; }
.mr-stay-card__facts .mr-icon { font-size: 17px; color: var(--mr-brand-800); }

.mr-stay-card__features {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
}
.mr-stay-card__features li {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 10px;
    border-radius: 999px;
    background: var(--mr-tint-100);
    font-size: 12.5px;
    font-weight: 600;
    color: var(--mr-ink-2);
}
.mr-stay-card__features .mr-icon { font-size: 13px; stroke-width: 2.5; color: var(--mr-brand-800); }
.mr-stay-card__features .is-more { padding: 0; background: transparent; }
.mr-stay-card__more {
    padding: 5px 10px;
    border: 1px dashed var(--mr-tint-300);
    border-radius: 999px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--mr-brand-800);
    transition: background-color .2s ease, border-color .2s ease;
}
.mr-stay-card__more:hover,
.mr-stay-card__more[aria-expanded="true"] { background: var(--mr-tint-100); border-color: var(--mr-brand-400); border-style: solid; }

/* "+N more" popover: every in-room amenity. Anchored to the bottom of the
   card body and grows upward (over the photo if needed), so the card's
   rounded overflow never clips it. */
.mr-amenity-pop {
    position: absolute;
    left: 12px; right: 12px; bottom: 12px;
    z-index: 5;
    padding: 16px 18px 18px;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 -6px 30px rgba(15, 25, 48, .12), var(--mr-shadow-lg);
    animation: mr-pop-in .2s ease;
}
.mr-amenity-pop[hidden] { display: none; }
@keyframes mr-pop-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

.mr-amenity-pop__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--mr-line);
    font-size: 15px;
    color: var(--mr-ink);
}
.mr-amenity-pop__close {
    display: inline-flex;
    align-items: center; justify-content: center;
    width: 30px; height: 30px;
    border-radius: 50%;
    color: var(--mr-muted);
    font-size: 16px;
    transition: background-color .2s ease, color .2s ease;
}
.mr-amenity-pop__close:hover { background: var(--mr-tint-100); color: var(--mr-ink); }
.mr-amenity-pop__close .mr-icon { stroke-width: 2.25; }

.mr-amenity-pop__list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px 16px;
    margin-top: 14px;
}
.mr-amenity-pop__list li {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 13.5px;
    line-height: 1.35;
    color: var(--mr-ink-2);
}
.mr-amenity-pop__list .mr-icon { flex-shrink: 0; margin-top: 2px; font-size: 14px; stroke-width: 2.5; color: var(--mr-brand-800); }

.mr-amenity-pop__link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 16px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--mr-brand-800);
}
.mr-amenity-pop__link .mr-icon { font-size: 15px; stroke-width: 2.25; transition: transform .2s ease; }
.mr-amenity-pop__link:hover .mr-icon { transform: translateX(3px); }

.mr-stay-card__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: auto;
    padding-top: 20px;
    border-top: 1px solid var(--mr-line, #e8e2d8);
}
/* space above the price row; the row itself sits at the card bottom (margin-top: auto) */
.mr-stay-card__features,
.mr-stay-card__facts:last-of-type { margin-bottom: 20px; }
.mr-stay-card__price { font-size: 14px; color: var(--mr-muted); white-space: nowrap; }
.mr-stay-card__price small { display: block; font-size: 12px; line-height: 1.2; }
.mr-stay-card__price strong {
    font-size: 22px;
    font-weight: 700;
    color: var(--mr-brand-800);
}
.mr-stay-card__btn { height: 44px; padding: 0 18px; font-size: 14px; white-space: nowrap; }
.mr-stay-card__btn .mr-icon { font-size: 16px; stroke-width: 2.25; transition: transform .2s ease; }
.mr-stay-card__btn:hover .mr-icon { transform: translateX(3px); }

.mr-section-sub { margin-top: 6px; font-size: 15px; color: var(--mr-muted); }
/* Resort experiences
   ========================================================================== */
.mr-experiences { padding-top: 40px; }

.mr-experiences__grid {
    display: grid;
    grid-template-columns: 420px 1fr;
    gap: 44px;
    align-items: center;
}

.mr-experience-list { display: grid; gap: 20px; margin: 22px 0 28px; }
.mr-experience { display: flex; align-items: center; gap: 22px; }
.mr-experience__icon {
    display: inline-flex;
    align-items: center; justify-content: center;
    width: 58px; height: 58px;
    border-radius: 50%;
    background: var(--mr-tint-100);
    color: var(--mr-brand-800);
    font-size: 26px;
    flex-shrink: 0;
}
.mr-experience__icon .mr-icon { stroke-width: 1.6; }
.mr-experience strong { display: block; font-size: 16px; font-weight: 600; line-height: 1.3; color: var(--mr-ink); }
.mr-experience small { display: block; margin-top: 2px; font-size: 14px; color: var(--mr-muted); }

.mr-experiences .mr-section-sub { margin-top: 8px; }
.mr-experiences .mr-btn--outline .mr-icon { font-size: 17px; stroke-width: 2.25; transition: transform .2s ease; }
.mr-experiences .mr-btn--outline:hover .mr-icon { transform: translateX(3px); }

/* Photo tour: big photo + 4 thumbnails; opens the lightbox with every photo */
.mr-tour {
    position: relative;
    height: 550px;
    border-radius: var(--mr-radius-lg);
    overflow: hidden;
    background: var(--mr-tint-100);
    box-shadow: var(--mr-shadow);
}
.mr-tour__main {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    cursor: zoom-in;
}
.mr-tour__img {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: opacity .35s ease, transform .8s ease;
}
.mr-tour__img.is-swapping { opacity: 0; }
.mr-tour__main:hover .mr-tour__img { transform: scale(1.03); }
.mr-tour::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, .35) 0%, rgba(0, 0, 0, 0) 28%, rgba(0, 0, 0, 0) 55%, rgba(0, 0, 0, .5) 100%);
    pointer-events: none;
}
.mr-tour__main:focus-visible { outline: 3px solid var(--mr-brand-400); outline-offset: -3px; }

.mr-tour__expand {
    position: absolute;
    top: 50%; left: 50%;
    z-index: 2;
    display: inline-flex;
    align-items: center; justify-content: center;
    width: 64px; height: 64px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .9);
    color: var(--mr-brand-800);
    font-size: 24px;
    opacity: 0;
    transform: translate(-50%, -50%) scale(.9);
    transition: opacity .25s ease, transform .25s ease;
}
.mr-tour__expand .mr-icon { stroke-width: 2.25; }
.mr-tour__main:hover .mr-tour__expand { opacity: 1; transform: translate(-50%, -50%); }

.mr-tour__bar {
    position: absolute;
    top: 20px; left: 22px; right: 22px;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    pointer-events: none;
}
.mr-tour__caption {
    padding: 6px 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .92);
    box-shadow: var(--mr-shadow-sm);
    font-size: 13px;
    font-weight: 700;
    color: var(--mr-brand-800);
}
.mr-tour__all {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    border-radius: 999px;
    background: rgba(15, 25, 48, .6);
    backdrop-filter: blur(4px);
    font-size: 13px;
    font-weight: 600;
    color: #fff;
    pointer-events: auto;
    transition: background-color .2s ease;
}
.mr-tour__all .mr-icon { font-size: 16px; }
.mr-tour__all:hover { background: var(--mr-brand-800); }

.mr-tour__thumbs {
    position: absolute;
    left: 22px; right: 22px; bottom: 22px;
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 150px));
    justify-content: center;
    gap: 18px;
}
.mr-tour__thumb {
    display: block;
    width: 100%;
    aspect-ratio: 132 / 90;
    padding: 0;
    overflow: hidden;
    border: 2px solid rgba(255, 255, 255, .75);
    border-radius: 10px;
    opacity: .85;
    transition: transform .25s ease, border-color .25s ease, opacity .25s ease;
}
.mr-tour__thumb:hover { transform: translateY(-3px); opacity: 1; }
.mr-tour__thumb.is-active { border-color: #fff; box-shadow: 0 0 0 2px var(--mr-brand-400); opacity: 1; }
.mr-tour__thumb img { width: 100%; height: 100%; object-fit: cover; }
/* Summer offer
   ========================================================================== */
.mr-offer { padding-top: 22px; padding-bottom: 20px; }

.mr-offer__box {
    position: relative;
    display: grid;
    grid-template-columns: 350px 1fr auto;
    align-items: center;
    min-height: 206px;
    border-radius: var(--mr-radius);
    overflow: hidden;
    background: linear-gradient(90deg, #f4f0e9 0%, #f1ece4 100%);
}
.mr-offer__media { align-self: stretch; position: relative; }
.mr-offer__media img {
    position: absolute;
    inset: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    object-position: center 30%;
}
.mr-offer__media::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(241, 236, 228, 0) 60%, #f1ece4 100%);
}

.mr-offer__content { position: relative; z-index: 1; padding: 30px 30px 30px 20px; }
.mr-offer__content h2 {
    font-size: 27px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -.02em;
    color: var(--mr-ink);
}
.mr-offer__content p { max-width: 560px; margin: 10px 0 20px; font-size: 15px; line-height: 1.65; color: var(--mr-ink-2); }
.mr-offer__eyebrow {
    display: inline-block;
    margin-bottom: 8px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--mr-brand-700);
}
.mr-offer__actions { display: flex; flex-wrap: wrap; gap: 10px; }
.mr-offer__actions .mr-btn { gap: 8px; height: 44px; padding: 0 22px; }
.mr-offer__actions .mr-btn--outline { background: rgba(255, 255, 255, .7); }
.mr-offer__actions .mr-icon { font-size: 16px; stroke-width: 2.25; transition: transform .2s ease; }
.mr-offer__actions .mr-btn:hover .mr-icon { transform: translateX(3px); }

/* Front desk call card */
.mr-offer__badge {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: auto auto;
    align-items: center;
    column-gap: 18px;
    margin-right: 86px;
    padding: 22px 28px 18px 22px;
    border-radius: var(--mr-radius);
    background: #fff;
    box-shadow: var(--mr-shadow-sm);
    transition: transform .25s ease, box-shadow .25s ease;
}
.mr-offer__badge:hover { transform: translateY(-3px); box-shadow: var(--mr-shadow); }
.mr-offer__badge-icon {
    display: inline-flex;
    align-items: center; justify-content: center;
    width: 60px; height: 60px;
    border-radius: 50%;
    background: var(--mr-tint-100);
    color: var(--mr-brand-700);
    font-size: 26px;
}
.mr-offer__badge-icon .mr-icon { stroke-width: 1.8; }
.mr-offer__badge-text small { display: block; font-size: 13px; font-weight: 600; color: var(--mr-muted); }
.mr-offer__badge-text strong {
    display: block;
    margin-top: 2px;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
    color: var(--mr-brand-800);
}
.mr-offer__badge-note {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid var(--mr-line);
    font-size: 13px;
    color: var(--mr-muted);
}
.mr-offer__badge-note .mr-icon { font-size: 14px; color: var(--mr-brand-700); }
.mr-offer__deco {
    position: absolute;
    top: -10px; right: 380px;
    font-size: 150px;
    color: var(--mr-brand-400);
    opacity: .08;
    stroke-width: 1;
    pointer-events: none;
}

/* Stats
   ========================================================================== */
.mr-stats { padding-top: 16px; padding-bottom: 6px; }


.mr-stats__title {
    font-size: 20px;
    font-weight: 700;
    text-align: center;
    color: var(--mr-ink);
}
.mr-stats__sub { margin-top: 6px; font-size: 14.5px; text-align: center; color: var(--mr-muted); }

.mr-explore {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    margin-top: 26px;
}
.mr-explore__card {
    padding: 22px 22px 20px;
    border: 1px solid var(--mr-line);
    border-radius: 14px;
    background: linear-gradient(180deg, var(--mr-tint-50, #faf7f2) 0%, #fff 70%);
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.mr-explore__card:hover { border-color: var(--mr-tint-300); box-shadow: var(--mr-shadow-sm); }
.mr-explore__icon {
    display: inline-flex;
    align-items: center; justify-content: center;
    width: 48px; height: 48px;
    border-radius: 50%;
    background: var(--mr-tint-100);
    color: var(--mr-brand-800);
    font-size: 22px;
    transition: background-color .25s ease, color .25s ease;
}
.mr-explore__icon .mr-icon { stroke-width: 1.7; }
.mr-explore__card:hover .mr-explore__icon { background: var(--mr-brand-800); color: #fff; }
.mr-explore__card { position: relative; overflow: hidden; display: flex; flex-direction: column; }
.mr-explore__drive {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: auto;
    padding-top: 16px;
    border-top: 1px solid var(--mr-line);
    font-size: 13.5px;
}
.mr-explore__places { margin-bottom: 18px; }
.mr-explore__drive span { display: inline-flex; align-items: center; gap: 8px; color: var(--mr-muted); }
.mr-explore__drive span .mr-icon { font-size: 17px; color: var(--mr-brand-400); }
.mr-explore__drive strong {
    padding: 4px 12px;
    border-radius: 999px;
    background: var(--mr-tint-100);
    font-weight: 700;
    white-space: nowrap;
    color: var(--mr-brand-800);
}
.mr-explore__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

/* Round photo with a dotted pattern, dashed ring and green tint over it */
.mr-explore__media {
    position: relative;
    flex-shrink: 0;
    width: 135px; height: 135px;
    margin: -4px -2px 0 0;
}
.mr-explore__media::before { /* dot pattern peeking out behind the photo */
    content: "";
    position: absolute;
    left: -26px; bottom: -18px;
    width: 96px; height: 96px;
    border-radius: 50%;
    background-image: radial-gradient(var(--mr-brand-400) 1.4px, transparent 1.6px);
    background-size: 9px 9px;
    opacity: .45;
}
.mr-explore__media::after { /* dashed ring around the photo */
    content: "";
    position: absolute;
    inset: -9px;
    border: 1.5px dashed var(--mr-tint-300);
    border-radius: 50%;
    transition: transform .8s ease;
}
.mr-explore__card:hover .mr-explore__media::after { transform: rotate(45deg); }
.mr-explore__photo {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%; height: 100%;
    overflow: hidden;
    border: 4px solid #fff;
    border-radius: 50%;
    box-shadow: 0 10px 24px rgba(15, 25, 48, .16);
}
.mr-explore__photo::after { /* soft green tint + diagonal line pattern over the photo */
    content: "";
    position: absolute;
    inset: 0;
    background:
        repeating-linear-gradient(135deg, rgba(255, 255, 255, .14) 0 2px, transparent 2px 9px),
        linear-gradient(200deg, rgba(20, 33, 61, 0) 45%, rgba(20, 33, 61, .45) 100%);
    mix-blend-mode: soft-light;
    transition: opacity .3s ease;
}
.mr-explore__card:hover .mr-explore__photo::after { opacity: .4; }
.mr-explore__photo img {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform .6s ease;
}
.mr-explore__card:hover .mr-explore__photo img { transform: scale(1.08); }


.mr-explore__title { margin-top: 14px; font-size: 17px; font-weight: 700; line-height: 1.3; color: var(--mr-ink); }
.mr-explore__places { display: grid; gap: 7px; margin-top: 12px; }
.mr-explore__places li {
    position: relative;
    padding-left: 16px;
    font-size: 14px;
    line-height: 1.45;
    color: var(--mr-ink-2);
}
.mr-explore__places li::before {
    content: "";
    position: absolute;
    left: 0; top: .6em;
    width: 6px; height: 6px;
    border-radius: 50%;
    background: var(--mr-brand-400);
}/* Newsletter
   ========================================================================== */
.mr-newsletter { position: relative; z-index: 1; padding-top: 6px; margin-bottom: -44px; }

.mr-newsletter__box {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    min-height: 92px;
    padding: 18px 100px 18px 56px;
    border-radius: var(--mr-radius);
    overflow: hidden;
    background: linear-gradient(100deg, var(--mr-brand-800) 0%, var(--mr-brand-600) 100%);
    box-shadow: 0 18px 40px rgba(15, 25, 48, .28), inset 0 0 0 1px rgba(255, 255, 255, .08);
    color: #fff;
}
.mr-newsletter__text h3 { font-size: 20px; font-weight: 700; line-height: 1.3; }
.mr-newsletter__text p { margin-top: 2px; font-size: 14px; color: rgba(255, 255, 255, .82); }

.mr-newsletter__actions { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 12px; }
.mr-newsletter__actions .mr-btn { gap: 8px; height: 45px; padding: 0 26px; border-radius: 6px; font-size: 13px; }
.mr-newsletter__actions .mr-icon { font-size: 17px; stroke-width: 2.25; }
.mr-newsletter__actions .mr-btn--light-green .mr-icon { transition: transform .2s ease; }
.mr-newsletter__actions .mr-btn--light-green:hover .mr-icon { transform: translateX(3px); }
.mr-newsletter__call {
    border: 1.5px solid rgba(255, 255, 255, .35);
    background: transparent;
    color: #fff;
}
.mr-newsletter__call:hover { border-color: #fff; background: rgba(255, 255, 255, .08); }
/* keeps the footer's top spacing on pages without the band */
.mr-newsletter-spacer { height: 0; }
.mr-newsletter__form { position: relative; z-index: 1; display: flex; gap: 12px; }.mr-newsletter__form input {
    width: 322px;
    height: 44px;
    padding: 0 18px;
    border: 0;
    border-radius: 6px;
    background: #fff;
    font-size: 14px;
    color: var(--mr-ink);
    outline: none;
}
.mr-newsletter__form input::placeholder { color: var(--mr-muted-2); }
.mr-newsletter__form input:focus { box-shadow: 0 0 0 3px rgba(75, 106, 163, .45); }
.mr-newsletter__form .mr-btn { height: 44px; padding: 0 44px; border-radius: 6px; font-size: 15px; }

.mr-newsletter__deco {
    position: absolute;
    right: -18px; bottom: -34px;
    font-size: 150px;
    color: #fff;
    opacity: .1;
    stroke-width: 1;
    pointer-events: none;
}

/* Footer
   ========================================================================== */
.mr-site-footer {
    --mr-ft-bg: #1a2238;
    --mr-ft-text: rgba(255, 255, 255, .72);
    --mr-ft-line: rgba(255, 255, 255, .1);
    --mr-brand-400: #8aa6da; /* lighter accent so icons/links read on the dark navy */
    position: relative;
    padding-top: 70px;
    overflow: hidden;
    background:
        radial-gradient(900px 420px at 88% 0%, rgba(75, 106, 163, .22), transparent 70%),
        radial-gradient(700px 380px at 0% 100%, rgba(75, 106, 163, .12), transparent 70%),
        var(--mr-ft-bg);
    color: var(--mr-ft-text);
}
.mr-site-footer::before { /* faint dot pattern, top right */
    content: "";
    position: absolute;
    top: 70px; right: -40px;
    width: 360px; height: 260px;
    background-image: radial-gradient(rgba(255, 255, 255, .16) 1.2px, transparent 1.4px);
    background-size: 14px 14px;
    -webkit-mask-image: linear-gradient(225deg, #000 20%, transparent 75%);
            mask-image: linear-gradient(225deg, #000 20%, transparent 75%);
    pointer-events: none;
}
.mr-site-footer > .mr-container { position: relative; }

.mr-site-footer__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1.1fr) minmax(0, 1fr);
    gap: 56px;
    padding: 0 30px 30px;
}

/* Brand */
.mr-site-footer__brand .mr-site-logo__img { border-radius: 4px; }
.mr-site-footer__brand p {
    max-width: 360px;
    margin-top: 20px;
    font-size: 14px;
    line-height: 1.75;
    color: var(--mr-ft-text);
}
.mr-site-footer__follow {
    display: block;
    margin-top: 24px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #fff;
}
.mr-social-links { display: flex; gap: 10px; margin-top: 12px; }
.mr-social-links a {
    display: inline-flex;
    align-items: center; justify-content: center;
    width: 38px; height: 38px;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 50%;
    background: rgba(255, 255, 255, .04);
    font-size: 15px;
    color: #fff;
    transition: all .2s ease;
}
.mr-social-links a:hover { border-color: var(--mr-brand-400); background: var(--mr-brand-400); transform: translateY(-2px); }

/* Column headings */
.mr-site-footer__col h4 {
    position: relative;
    padding-bottom: 14px;
    font-size: 17px;
    font-weight: 700;
    color: #fff;
}
.mr-site-footer__col h4::after {
    content: "";
    position: absolute;
    left: 0; bottom: 0;
    width: 34px; height: 3px;
    border-radius: 3px;
    background: linear-gradient(90deg, var(--mr-brand-400), rgba(75, 106, 163, .2));
}
.mr-site-footer__col ul { display: grid; gap: 10px; margin-top: 20px; }
.mr-site-footer__col li { font-size: 14px; line-height: 1.6; color: var(--mr-ft-text); }
.mr-site-footer__col a { transition: color .2s ease; }
.mr-site-footer__col a:hover { color: #fff; }

/* Quick links: chevron bullets that slide on hover */
.mr-site-footer__col--links ul { grid-template-columns: repeat(2, minmax(0, max-content)); gap: 12px 44px; }
.mr-site-footer__col--links a {
    position: relative;
    display: inline-block;
    padding-left: 16px;
    transition: color .2s ease, transform .2s ease;
}
.mr-site-footer__col--links a::before {
    content: "";
    position: absolute;
    left: 0; top: 50%;
    width: 6px; height: 6px;
    margin-top: -4px;
    border-top: 1.5px solid var(--mr-brand-400);
    border-right: 1.5px solid var(--mr-brand-400);
    transform: rotate(45deg);
}
.mr-site-footer__col--links a:hover { transform: translateX(4px); }

/* Contact */
.mr-footer-contact { gap: 16px !important; }
.mr-footer-contact li { display: flex; align-items: flex-start; gap: 14px; }
.mr-footer-contact__icon {
    display: inline-flex;
    align-items: center; justify-content: center;
    flex-shrink: 0;
    width: 38px; height: 38px;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 50%;
    background: rgba(255, 255, 255, .06);
    color: var(--mr-brand-400);
    font-size: 16px;
}
.mr-footer-contact li > a,
.mr-footer-contact li > span:last-child { padding-top: 8px; color: #fff; }
.mr-footer-contact .is-phone .mr-footer-contact__icon { width: 46px; height: 46px; border: 0; background: #fff; color: var(--mr-brand-800); font-size: 19px; }
.mr-footer-contact .is-phone a { padding-top: 0; font-size: 20px; font-weight: 700; line-height: 1.25; }
.mr-footer-contact .is-phone small { display: block; font-size: 12px; font-weight: 500; letter-spacing: .04em; color: var(--mr-ft-text); }
.mr-footer-contact__map {
    display: flex;
    width: fit-content;
    align-items: center;
    gap: 5px;
    margin-top: 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--mr-brand-400) !important;
}
.mr-footer-contact__map:hover { color: #a9bde3 !important; }
.mr-footer-contact__map .mr-icon { font-size: 14px; stroke-width: 2.25; transition: transform .2s ease; }
.mr-footer-contact__map:hover .mr-icon { transform: translateX(3px); }

/* Your Stay: glass card */
.mr-footer-stay {
    gap: 0 !important;
    padding: 6px 18px;
    border: 1px solid var(--mr-ft-line);
    border-radius: 14px;
    background: rgba(255, 255, 255, .05);
    backdrop-filter: blur(4px);
}
.mr-footer-stay li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 0;
    border-bottom: 1px solid var(--mr-ft-line);
}
.mr-footer-stay li:last-child { border-bottom: 0; }
.mr-footer-stay span { display: inline-flex; align-items: center; gap: 9px; }
.mr-footer-stay span .mr-icon { font-size: 15px; color: var(--mr-brand-400); }
.mr-footer-stay strong { font-weight: 600; text-align: right; white-space: nowrap; color: #fff; }
.mr-footer-stay .is-key strong {
    padding: 2px 10px;
    border-radius: 999px;
    background: rgba(75, 106, 163, .22);
    color: #d3def3;
}

/* Bottom bar */
.mr-site-footer__bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 22px 100px 26px 30px;
    border-top: 1px solid var(--mr-ft-line);
    font-size: 13px;
    color: rgba(255, 255, 255, .6);
}
.mr-site-footer__bottom p { margin: 0; font-size: 13px; line-height: 1.6; color: rgba(255, 255, 255, .6); }
.mr-site-footer__bottom a { color: rgba(255, 255, 255, .75); transition: color .2s ease; }
.mr-site-footer__bottom ul { display: flex; gap: 28px; }
.mr-site-footer__bottom a:hover { color: #fff; }

/* Back to top: white disc with a ring that fills as the page scrolls
   (--mr-scroll, 0-1, set by home.js). On hover it turns navy, the arrow
   lifts and a "Top" label appears. */
.mr-back-to-top {
    --mr-scroll: 0;
    position: fixed;
    right: 30px; bottom: 30px;
    z-index: 60;
    display: inline-flex;
    flex-direction: column;
    align-items: center; justify-content: center;
    width: 58px; height: 58px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #fff;
    color: var(--mr-brand-800);
    box-shadow: 0 10px 28px rgba(15, 25, 48, .22), 0 2px 6px rgba(15, 25, 48, .12);
    opacity: 0;
    visibility: hidden;
    transform: translateY(14px) scale(.9);
    transition: opacity .3s ease, visibility .3s ease, transform .3s ease, background-color .25s ease, color .25s ease;
}
.mr-back-to-top.active { opacity: 1; visibility: visible; transform: none; }

.mr-back-to-top__ring {
    position: absolute;
    inset: 0;
    width: 100%; height: 100%;
    transform: rotate(-90deg);
    pointer-events: none;
}
.mr-back-to-top__ring circle { fill: none; stroke-width: 3; }
.mr-back-to-top__track { stroke: var(--mr-tint-100); }
.mr-back-to-top__progress {
    stroke: var(--mr-brand-400);
    stroke-linecap: round;
    stroke-dasharray: 157.08; /* 2 * pi * r(25) */
    stroke-dashoffset: calc(157.08 * (1 - var(--mr-scroll)));
    transition: stroke-dashoffset .15s linear, stroke .25s ease;
}

.mr-back-to-top__arrow { display: inline-flex; font-size: 22px; transition: transform .3s ease; }
.mr-back-to-top__arrow .mr-icon { stroke-width: 2.4; }
.mr-back-to-top__label {
    position: absolute;
    bottom: 10px;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
    opacity: 0;
    transform: translateY(4px);
    transition: opacity .25s ease, transform .3s ease;
}

.mr-back-to-top:hover,
.mr-back-to-top:focus-visible { background: var(--mr-brand-800); color: #fff; }
.mr-back-to-top:hover .mr-back-to-top__track,
.mr-back-to-top:focus-visible .mr-back-to-top__track { stroke: rgba(255, 255, 255, .15); }
.mr-back-to-top:hover .mr-back-to-top__progress,
.mr-back-to-top:focus-visible .mr-back-to-top__progress { stroke: #a9bde3; }
.mr-back-to-top:hover .mr-back-to-top__arrow,
.mr-back-to-top:focus-visible .mr-back-to-top__arrow { transform: translateY(-8px) scale(.82); }
.mr-back-to-top:hover .mr-back-to-top__label,
.mr-back-to-top:focus-visible .mr-back-to-top__label { opacity: 1; transform: none; }
.mr-back-to-top:focus-visible { outline: 3px solid var(--mr-brand-400); outline-offset: 3px; }

/* Responsive
   ========================================================================== */
@media (max-width: 1440px) {
    .mr-main-nav__list { gap: 30px; }
    .mr-main-nav { margin-right: 32px; }
    .mr-offer__box { grid-template-columns: 300px 1fr auto; }
    .mr-offer__badge { margin-right: 40px; }
    .mr-offer__deco { display: none; }
}

@media (max-width: 1200px) {
    .mr-topbar__address { display: none; }
    :root { --mr-gutter: 40px; }
    .mr-hero__box { margin: 0 20px; }
    .mr-main-nav__list { gap: 18px; }
    .mr-main-nav__list a { font-size: 14px; }
    .mr-btn--login { padding: 0 16px; font-size: 14px; }
    .mr-main-nav { margin-left: 24px; margin-right: 20px; }
    .mr-search-panel__col { padding: 0 24px; }
    .mr-amenity-list { gap: 14px; }
    .mr-amenity__icon { width: 62px; height: 62px; font-size: 27px; }
    .mr-experiences__grid { grid-template-columns: 340px 1fr; gap: 34px; }
    .mr-tour__thumbs { gap: 14px; }
    .mr-offer__box { grid-template-columns: 260px 1fr auto; }
    .mr-offer__badge { margin-right: 32px; }
    .mr-site-footer__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; }
    .mr-site-footer__brand { grid-column: 1 / -1; display: grid; grid-template-columns: auto 1fr auto; align-items: center; column-gap: 40px; }
    .mr-site-footer__brand p { margin-top: 0; }
    .mr-site-footer__follow { display: none; }
    .mr-site-footer__brand .mr-social-links { margin-top: 0; }
}

@media (max-width: 1024px) {
    .mr-site-header__inner { height: 60px; }
    .mr-nav-toggle { display: inline-flex; }
    .mr-site-header__actions .mr-btn--login { display: none; }
    .mr-main-nav {
        position: absolute;
        top: 100%; left: 0; right: 0;
        margin: 0;
        padding: 12px 20px 24px;
        background: #fff;
        border-top: 1px solid var(--mr-line);
        box-shadow: var(--mr-shadow);
        opacity: 0;
        visibility: hidden;
        transform: translateY(-8px);
        transition: all .25s ease;
    }
    .mr-is-nav-open .mr-main-nav { opacity: 1; visibility: visible; transform: none; }
    .mr-main-nav__list { flex-direction: column; align-items: stretch; gap: 0; }
    .mr-main-nav__list a { padding: 14px 0; border-bottom: 1px solid var(--mr-line); }
    .mr-main-nav__list a::after { display: none; }
    .mr-main-nav__login-mobile { display: inline-flex; width: 100%; margin-top: 18px; }

    .mr-hero__box { min-height: 520px; }
    .mr-hero__box { display: flex; align-items: center; }
    .mr-hero__content { width: 100%; padding: 40px 0 calc(var(--mr-panel-overlap) + 40px) 48px; }
    .mr-hero__title { font-size: 48px; }
    .mr-hero__media { width: 78%; }

    .mr-hero { --mr-panel-overlap: 100px; padding: 10px 0; }
    .mr-search-panel { grid-template-columns: 1fr 1fr; row-gap: 28px; }
    .mr-search-panel__amenities { grid-column: 1 / -1; }
    .mr-search-panel__stay { border-left: 0 !important; }
    .mr-amenity-list { justify-content: flex-start; }

    .mr-stay-grid { grid-template-columns: repeat(2, 1fr); gap: 24px; }

    .mr-experiences__grid { grid-template-columns: 1fr; }
    .mr-experience-list { grid-template-columns: 1fr 1fr; }

    .mr-offer__box { grid-template-columns: 240px 1fr; }
    .mr-offer__badge { grid-column: 1 / -1; justify-self: start; margin: 0 20px 24px; }
    .mr-offer__deco { display: none; }

    .mr-explore { gap: 14px; }
    .mr-explore__card { padding: 18px; }
    .mr-explore__media { width: 96px; height: 96px; }
    .mr-explore__media::before { width: 76px; height: 76px; left: -20px; bottom: -14px; }

    .mr-newsletter__box { flex-direction: column; align-items: flex-start; padding: 26px 32px; }
    .mr-newsletter__form { width: 100%; }
    .mr-newsletter__actions { width: 100%; }
    .mr-newsletter__form input { flex: 1; width: auto; }

    .mr-site-footer__grid { grid-template-columns: 1fr 1fr; gap: 40px; padding: 0 0 34px; }
    .mr-site-footer__brand { grid-column: 1 / -1; }
    .mr-site-footer__bottom { padding: 20px 80px 26px 0; }
}

@media (max-width: 767px) {
    .mr-topbar { font-size: 12px; }
    .mr-topbar__hours,
    .mr-topbar__email span { display: none; }
    .mr-topbar__info { gap: 16px; }
    .mr-topbar__social { padding-left: 0; border-left: 0; }
    :root { --mr-gutter: 20px; }
    .mr-section { padding: 20px 0; }
    .mr-section-title { font-size: 25px; }
    .mr-site-logo { font-size: 26px; }

    .mr-hero__box { min-height: 0; margin: 0 12px; border-radius: var(--mr-radius-lg); padding-bottom: 150px; }
    .mr-hero__media { width: 100%; }
    .mr-hero__controls { right: 16px; bottom: 132px; }
    .mr-hero__media::before {
        background: linear-gradient(180deg,
            #f1ece4 0%,
            rgba(241, 236, 228, .9) 40%,
            rgba(241, 236, 228, .2) 75%,
            rgba(241, 236, 228, 0) 100%);
    }
    .mr-hero__content { padding: 44px 24px 60px; }
    .mr-hero__title { font-size: 32px; }
    .mr-hero__text { font-size: 16px; margin-top: 16px; }
    .mr-hero__eyebrow { font-size: 9px; margin-bottom: 14px; }
    .mr-hero__actions { margin-top: 20px; }
    .mr-hero__btn { flex: 1 1 auto; height: 48px; padding: 0 20px; }

    .mr-search-panel { grid-template-columns: 1fr; margin-top: -120px; padding: 26px 0; }
    .mr-search-panel__col { padding: 0 22px; }
    .mr-search-panel__col + .mr-search-panel__col { border-left: 0; border-top: 1px solid var(--mr-line); padding-top: 24px; }
    .mr-amenity-list { justify-content: space-between; gap: 8px; }
    .mr-amenity__icon { width: 60px; height: 60px; }
    .mr-stay-btn { width: 100%; }

    .mr-featured { padding-top: 44px; }
    .mr-stay-grid { grid-template-columns: 1fr; }

    .mr-experience-list { grid-template-columns: 1fr; }
    .mr-tour { height: 320px; }
    .mr-tour__bar { top: 14px; left: 14px; right: 14px; }
    .mr-tour__caption, .mr-tour__all { font-size: 9px; }
    .mr-tour__thumbs { left: 14px; right: 14px; bottom: 14px; gap: 10px; }
    .mr-tour__thumb { border-radius: 8px; }

    .mr-offer__box { grid-template-columns: 1fr; }
    .mr-offer__media { height: 200px; }
    .mr-offer__media::after { background: linear-gradient(180deg, rgba(241, 236, 228, 0) 60%, #f1ece4 100%); }
    .mr-offer__content { padding: 22px 22px 18px; }
    .mr-offer__content h2 { font-size: 24px; }
    .mr-offer__badge { justify-self: stretch; margin: 0 22px 24px; padding: 18px 18px 14px; column-gap: 14px; }
    .mr-offer__badge-icon { width: 48px; height: 48px; font-size: 22px; }
    .mr-offer__badge-text strong { font-size: 20px; }
    .mr-offer__actions .mr-btn { flex: 1 1 100%; }
    
    .mr-explore { grid-template-columns: 1fr; gap: 14px; margin-top: 20px; }
    .mr-explore__media { width: 108px; height: 108px; }
    .mr-explore__card { padding: 18px; }

    .mr-newsletter__box { padding: 24px 22px; }
    .mr-newsletter__form { flex-direction: column; }
    .mr-newsletter__form input { width: 100%; flex: none; }
    .mr-newsletter__form .mr-btn { width: 100%; }
    .mr-newsletter__actions .mr-btn { flex: 1 1 100%; }

    .mr-site-footer__grid { grid-template-columns: 1fr; gap: 32px; }
    .mr-site-footer__brand { display: block; }
    .mr-site-footer__brand p { margin-top: 18px; }
    .mr-site-footer__follow { display: block; }
    .mr-site-footer__brand .mr-social-links { margin-top: 12px; }
    .mr-site-logo__img { height: 54px; }
    .mr-site-footer__bottom { flex-direction: column; align-items: flex-start; gap: 10px; padding-right: 0; padding-bottom: 80px; }
    .mr-back-to-top { right: 18px; bottom: 18px; width: 48px; height: 48px; }
}

/* Our Rooms v2 - badge icons, rating/size row, bold titles, perks strip
   ========================================================================== */
.mr-stay-card__badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 13px 7px 11px;
    font-size: 12.5px;
    color: var(--mr-ink);
}
.mr-stay-card__badge .mr-icon { flex-shrink: 0; font-size: 14px; }
.mr-stay-card__badge.is-heart .mr-icon { color: #e5484d; fill: #e5484d; stroke: #e5484d; }
.mr-stay-card__badge.is-star .mr-icon { color: var(--mr-star); fill: var(--mr-star); stroke: var(--mr-star); }
.mr-stay-card__badge.is-user .mr-icon { color: var(--mr-brand-600); }

.mr-stay-card__count { padding: 5px 12px; font-size: 12.5px; letter-spacing: 0; }

.mr-stay-card__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 26px;
    margin-bottom: 8px;
}
.mr-stay-card__rating { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; color: var(--mr-muted); }
.mr-stay-card__rating .mr-icon { font-size: 14px; color: var(--mr-star); fill: var(--mr-star); }
.mr-stay-card__rating strong { font-weight: 700; color: var(--mr-ink); }
.mr-stay-card__rating span::before { content: "\00B7"; margin-right: 5px; color: var(--mr-muted-2); }
.mr-stay-card__size {
    margin-left: auto;
    padding: 3px 10px;
    border-radius: 6px;
    background: var(--mr-tint-100);
    font-size: 12px;
    font-weight: 600;
    color: var(--mr-brand-700);
    white-space: nowrap;
}

.mr-stay-card__title {
    font-family: var(--mr-font);
    font-size: 22px;
    font-weight: 600;
    letter-spacing: -.01em;
}

.mr-stay-card__facts { margin-top: 10px; font-weight: 500; }
.mr-stay-card__features li {
    padding: 6px 11px;
    border: 1px solid var(--mr-line);
    border-radius: 7px;
    background: var(--mr-tint-50);
    font-weight: 500;
}
.mr-stay-card__more {
    padding: 6px 11px;
    border: 1px solid var(--mr-tint-300);
    border-style: solid;
    border-radius: 7px;
    background: var(--mr-tint-100);
    font-weight: 700;
}
.mr-stay-card__price strong { font-size: 26px; letter-spacing: -.01em; }
.mr-stay-card__btn { height: 45px; padding: 0 22px; border-radius: 10px; font-size: 13px; }

/* Perks strip */
.mr-perks {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-top: 40px;
    padding: 22px 8px;
    border: 1px solid var(--mr-line);
    border-radius: var(--mr-radius);
    background: #fff;
    box-shadow: var(--mr-shadow-sm);
}
.mr-perk {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 4px 22px;
}
.mr-perk + .mr-perk { border-left: 1px solid var(--mr-line); }
.mr-perk__icon {
    display: inline-flex;
    align-items: center; justify-content: center;
    flex-shrink: 0;
    width: 46px; height: 46px;
    border-radius: 12px;
    background: var(--mr-tint-100);
    color: var(--mr-brand-800);
    font-size: 20px;
}
.mr-perk strong { display: block; font-size: 15px; font-weight: 700; line-height: 1.3; color: var(--mr-ink); }
.mr-perk small,
.mr-perk a { display: block; margin-top: 2px; font-size: 13px; line-height: 1.4; color: var(--mr-muted); }
.mr-perk a { font-weight: 600; color: var(--mr-brand-800); }
.mr-perk a:hover { text-decoration: underline; }

@media (max-width: 1200px) {
    .mr-perks { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 18px; }
    .mr-perk:nth-child(3) { border-left: 0; }
}
@media (max-width: 767px) {
    .mr-stay-card__title { font-size: 20px; }
    .mr-perks { grid-template-columns: 1fr; margin-top: 28px; padding: 14px 4px; row-gap: 0; }
    .mr-perk { padding: 12px 16px; }
    .mr-perk + .mr-perk { border-left: 0; border-top: 1px solid var(--mr-line); }
}
/* Footer social icons in each network's official colour */
.mr-site-footer .mr-social-links a { border: 0; color: #fff; box-shadow: 0 4px 12px rgba(0, 0, 0, .25); }
.mr-site-footer .mr-social-links a.is-facebook  { background: #1877f2; }
.mr-site-footer .mr-social-links a.is-instagram { background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%); }
.mr-site-footer .mr-social-links a.is-twitter   { background: #000; box-shadow: 0 0 0 1px rgba(255, 255, 255, .25), 0 4px 12px rgba(0, 0, 0, .25); }
.mr-site-footer .mr-social-links a.is-youtube   { background: #ff0000; }
.mr-site-footer .mr-social-links a.is-linkedin  { background: #0a66c2; }
.mr-site-footer .mr-social-links a:hover { filter: brightness(1.12); transform: translateY(-3px); }

/* 4 room cards per row on laptops: tighter card content */
@media (max-width: 1600px) {
    .mr-stay-card__body { padding: 20px 20px 22px; }
    .mr-stay-card__title { font-size: 20px; }
    .mr-stay-card__price strong { font-size: 23px; }
    .mr-stay-card__btn { padding: 0 16px; font-size: 14px; }
}

/* ==========================================================================
   Polish pass: warm accents, softer text, layered surfaces
   ========================================================================== */

/* 1. Warm accents --------------------------------------------------------- */
/* Eyebrow label above section titles, with a short red lead-in line */
.mr-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--mr-brand-600);
}
.mr-eyebrow::before {
    content: "";
    width: 22px; height: 2px;
    border-radius: 2px;
    background: var(--mr-accent);
}
.mr-eyebrow.is-center { display: flex; justify-content: center; }
.mr-eyebrow.is-center::after {
    content: "";
    width: 22px; height: 2px;
    border-radius: 2px;
    background: var(--mr-accent);
}
.mr-offer__eyebrow { display: inline-flex; align-items: center; gap: 10px; color: var(--mr-brand-600); }
.mr-offer__eyebrow::before { content: ""; width: 22px; height: 2px; border-radius: 2px; background: var(--mr-accent); }

/* Red signals: active menu underline, hero eyebrow dot */
.mr-main-nav__list a::after { background: var(--mr-accent); }
.mr-hero__eyebrow::before { background: var(--mr-accent); }

/* Gold: ratings and premium details */
.mr-stay-card__rating .mr-icon,
.mr-stay-card__badge.is-star .mr-icon { color: var(--mr-gold); fill: var(--mr-gold); stroke: var(--mr-gold); }
.mr-stay-card__more:hover,
.mr-stay-card__more[aria-expanded="true"] { border-color: var(--mr-gold); background: var(--mr-gold-soft); }
.mr-stay-card__size { background: var(--mr-gold-soft); color: #8a6a2c; }
.mr-footer-stay .is-key strong { background: rgba(201, 164, 92, .18); color: #ecd3a1; }
.mr-site-footer__col h4::after { background: linear-gradient(90deg, var(--mr-gold), rgba(201, 164, 92, .15)); }

/* 2. Softer text ---------------------------------------------------------- */
/* Accent word in section titles: brand colour, same font as the title */
.mr-section-title em,
.mr-stats__title em {
    font-style: normal;
    font-weight: 700;
    color: var(--mr-brand-600);
}
.mr-stats__title { font-size: 26px; letter-spacing: -.01em; }
.mr-section-sub,
.mr-stats__sub { color: #716a61; }

/* 3. Surfaces & depth ----------------------------------------------------- */
/* Hairline edge + top highlight on white cards */
.mr-stay-card,
.mr-search-panel,
.mr-perks,
.mr-offer__badge,
.mr-amenity-pop {
    border: 1px solid var(--mr-hairline);
}
.mr-stay-card { box-shadow: var(--mr-edge), var(--mr-shadow); }
.mr-stay-card:hover { box-shadow: var(--mr-edge), var(--mr-shadow-lg); }
.mr-search-panel { box-shadow: var(--mr-edge), var(--mr-shadow-lg); }
.mr-explore__card { border-color: var(--mr-hairline); box-shadow: var(--mr-edge); }
.mr-explore__card:hover { box-shadow: var(--mr-edge), var(--mr-shadow); }
.mr-tour { box-shadow: var(--mr-shadow-lg); }

/* Alternating warm cream sections (Our Rooms, Explore) with a faint dot
   texture in one corner */
.mr-featured,
.mr-stats {
    position: relative;
    background:
        linear-gradient(180deg, rgba(247, 242, 234, 0) 0%, var(--mr-cream) 90px, var(--mr-cream) calc(100% - 90px), rgba(247, 242, 234, 0) 100%);
}
.mr-featured { padding-top: 20px; padding-bottom: 20px; }
.mr-stats { padding-top: 20px; padding-bottom: 20px; }
.mr-featured::before,
.mr-stats::before {
    content: "";
    position: absolute;
    top: 40px; right: 0;
    width: 280px; height: 220px;
    background-image: radial-gradient(rgba(20, 33, 61, .10) 1.2px, transparent 1.4px);
    background-size: 14px 14px;
    -webkit-mask-image: linear-gradient(225deg, #000 10%, transparent 70%);
            mask-image: linear-gradient(225deg, #000 10%, transparent 70%);
    pointer-events: none;
}
.mr-stats::before { top: auto; right: auto; bottom: 40px; left: 0; -webkit-mask-image: linear-gradient(45deg, #000 10%, transparent 70%); mask-image: linear-gradient(45deg, #000 10%, transparent 70%); }
.mr-featured > .mr-container,
.mr-stats > .mr-container { position: relative; }
.mr-experiences { padding-top: 24px; }

@media (max-width: 767px) {
    .mr-featured { padding-top: 20px; padding-bottom: 20px; }
    .mr-stats { padding-top: 40px; padding-bottom: 40px; }
    .mr-experiences { padding-top: 16px; }
    .mr-featured::before, .mr-stats::before { width: 160px; height: 140px; }
}
/* ==========================================================================
   Direction A - "Pacific Northwest warm"
   Navy stays for headings, text and the footer; warm neutrals carry the
   backgrounds; Red Lion red is only for booking CTAs; each feature group
   gets its own soft tint (sage / sky / sand / coral).
   ========================================================================== */
:root {
    --mr-red: #b4532a;       /* copper: booking CTAs */
    --mr-red-700: #963f1c;
    --mr-sage: #4e7d63;  --mr-sage-soft: #e7f0ea;
    --mr-sky: #3c6fa0;   --mr-sky-soft: #e6f0f8;
    --mr-sand: #a87b3e;  --mr-sand-soft: #f6eedf;
    --mr-coral: #c4553f; --mr-coral-soft: #fbe9e5;
}

/* Top bar: warm cream instead of solid navy */
.mr-topbar {
    background: #f6f1e9;
    color: var(--mr-brand-800);
    border-bottom: 1px solid #ebe3d6;
}
.mr-topbar__info .mr-icon,
.mr-topbar__hours .mr-icon { color: var(--mr-red); }
.mr-topbar a:hover { color: var(--mr-red); }
.mr-topbar__social { border-left-color: #e0d6c6; }
.mr-topbar__social a:hover { background: #ebe3d6; }

/* Booking CTAs: Red Lion red (the one "hot" colour on the page) */
.mr-btn--login,
.mr-hero__btn.mr-btn--primary,
.mr-newsletter__actions .mr-btn--light-green {
    background: linear-gradient(180deg, #c4623a 0%, var(--mr-red) 100%);
    color: #fff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 4px 12px rgba(180, 83, 42, .22);
    transition: background .2s ease, box-shadow .25s ease, transform .25s ease;
}
.mr-btn--login:hover,
.mr-hero__btn.mr-btn--primary:hover,
.mr-newsletter__actions .mr-btn--light-green:hover {
    background: linear-gradient(180deg, var(--mr-red) 0%, var(--mr-red-700) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 8px 24px rgba(180, 83, 42, .32);
    transform: translateY(-1px);
}
/* Other primary buttons: navy with a soft top highlight */
.mr-stay-card__btn,
.mr-offer__actions .mr-btn--primary {
    background: linear-gradient(180deg, #22335a 0%, var(--mr-brand-800) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 4px 12px rgba(20, 33, 61, .18);
}

/* Tinted icon sets ---------------------------------------------------------- */
/* Search panel amenities: breakfast (sand), Wi-Fi (sky), parking (coral), pets (sage) */
.mr-amenity .mr-amenity__icon { border-color: transparent; }
.mr-amenity:nth-child(1) .mr-amenity__icon { background: var(--mr-sand-soft); color: var(--mr-sand); }
.mr-amenity:nth-child(2) .mr-amenity__icon { background: var(--mr-sky-soft);  color: var(--mr-sky); }
.mr-amenity:nth-child(3) .mr-amenity__icon { background: var(--mr-coral-soft); color: var(--mr-coral); }
.mr-amenity:nth-child(4) .mr-amenity__icon { background: var(--mr-sage-soft); color: var(--mr-sage); }
.mr-amenity:hover .mr-amenity__icon { border-color: transparent; transform: translateY(-2px); box-shadow: var(--mr-shadow-sm); }
.mr-amenity__icon { transition: transform .2s ease, box-shadow .2s ease; }

/* What's nearby: hospital (coral), campus (sky), park (sage), fairgrounds (sand) */
.mr-nearby:nth-child(1) .mr-nearby__icon { background: var(--mr-coral-soft); color: var(--mr-coral); }
.mr-nearby:nth-child(2) .mr-nearby__icon { background: var(--mr-sky-soft);   color: var(--mr-sky); }
.mr-nearby:nth-child(3) .mr-nearby__icon { background: var(--mr-sage-soft);  color: var(--mr-sage); }
.mr-nearby:nth-child(4) .mr-nearby__icon { background: var(--mr-sand-soft);  color: var(--mr-sand); }

/* Easy Stay list: hot tub (sky), business (sand), laundry (sage), freeway (coral) */
.mr-experience:nth-child(1) .mr-experience__icon { background: var(--mr-sky-soft);   color: var(--mr-sky); }
.mr-experience:nth-child(2) .mr-experience__icon { background: var(--mr-sand-soft);  color: var(--mr-sand); }
.mr-experience:nth-child(3) .mr-experience__icon { background: var(--mr-sage-soft);  color: var(--mr-sage); }
.mr-experience:nth-child(4) .mr-experience__icon { background: var(--mr-coral-soft); color: var(--mr-coral); }

/* Perks strip */
.mr-perk:nth-child(1) .mr-perk__icon { background: var(--mr-sage-soft);  color: var(--mr-sage); }
.mr-perk:nth-child(2) .mr-perk__icon { background: var(--mr-sky-soft);   color: var(--mr-sky); }
.mr-perk:nth-child(3) .mr-perk__icon { background: var(--mr-sand-soft);  color: var(--mr-sand); }
.mr-perk:nth-child(4) .mr-perk__icon { background: var(--mr-coral-soft); color: var(--mr-coral); }

/* Room card feature chips: sage check marks */
.mr-stay-card__features .mr-icon { color: var(--mr-sage); }

/* Explore cards: History (sand), Around Vancouver (sky), Day Trips (sage) */
.mr-explore__card:nth-child(1) { --mr-card: var(--mr-sand); --mr-card-soft: var(--mr-sand-soft); }
.mr-explore__card:nth-child(2) { --mr-card: var(--mr-sky);  --mr-card-soft: var(--mr-sky-soft); }
.mr-explore__card:nth-child(3) { --mr-card: var(--mr-sage); --mr-card-soft: var(--mr-sage-soft); }
.mr-explore__card { background: linear-gradient(180deg, var(--mr-card-soft) 0%, #fff 55%); }
.mr-explore__icon { background: #fff; color: var(--mr-card); box-shadow: var(--mr-shadow-sm); }
.mr-explore__card:hover .mr-explore__icon { background: var(--mr-card); color: #fff; }
.mr-explore__places li::before { background: var(--mr-card); }
.mr-explore__media::before { background-image: radial-gradient(var(--mr-card) 1.4px, transparent 1.6px); }
.mr-explore__drive span .mr-icon { color: var(--mr-card); }
.mr-explore__drive strong { background: var(--mr-card-soft); color: var(--mr-card); }

/* Groups band: warm sand with a terracotta touch */
.mr-offer__box { background: linear-gradient(90deg, #f6eedf 0%, #f3e8d8 100%); }
.mr-offer__media::after { background: linear-gradient(90deg, rgba(246, 238, 223, 0) 60%, #f6eedf 100%); }
.mr-offer__badge-icon { background: var(--mr-coral-soft); color: var(--mr-coral); }
.mr-offer__deco { color: var(--mr-sand); }

/* Photography ----------------------------------------------------------------- */
/* Hero: warm golden-hour grade */
.mr-hero__img { filter: saturate(1.06) sepia(.07) brightness(1.02); }

/* Room photos: warm fade at the bottom so badges/counters sit on warmth */
.mr-stay-card__photos::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: 0;
    z-index: 1;
    height: 45%;
    background: linear-gradient(0deg, rgba(92, 52, 16, .3) 0%, rgba(92, 52, 16, 0) 100%);
    pointer-events: none;
}

/* Booking band: hotel photo under a navy fade instead of a flat fill */
.mr-newsletter__box {
    background:
        linear-gradient(90deg, rgba(20, 33, 61, .95) 0%, rgba(20, 33, 61, .86) 42%, rgba(20, 33, 61, .45) 100%),
        url("../images/home/band-exterior.jpg") center 58% / cover no-repeat;
}
.mr-newsletter__deco { display: none; }

/* Footer: warmer navy with a gold hairline on top */
.mr-site-footer { box-shadow: inset 0 1px 0 rgba(201, 164, 92, .35); }
/* Inactive links during the homepage-only client preview (see functions.php) */
a[aria-disabled="true"]:not([href]) { cursor: default; }

/* Navy gradient buttons: keep a solid base colour and swap gradients on
   hover (going gradient -> flat colour made the button flash) */
.mr-stay-card__btn,
.mr-offer__actions .mr-btn--primary {
    background-color: var(--mr-brand-800);
    transition: box-shadow .25s ease, transform .25s ease;
}
.mr-stay-card__btn:hover,
.mr-offer__actions .mr-btn--primary:hover {
    background: linear-gradient(180deg, #2a3d68 0%, #1b2c50 100%);
    background-color: var(--mr-brand-800);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 8px 20px rgba(20, 33, 61, .26);
    transform: translateY(-1px);
}
/* Copper booking buttons: same fix */
.mr-btn--login,
.mr-hero__btn.mr-btn--primary,
.mr-newsletter__actions .mr-btn--light-green { background-color: var(--mr-red); }
.mr-btn--login:hover,
.mr-hero__btn.mr-btn--primary:hover,
.mr-newsletter__actions .mr-btn--light-green:hover { background-color: var(--mr-red-700); }

/* Top bar: same warm navy as the footer */
.mr-topbar {
    background: #1a2238;
    color: rgba(255, 255, 255, .82);
    border-bottom: 1px solid rgba(201, 164, 92, .25);
}
.mr-topbar__info .mr-icon,
.mr-topbar__hours .mr-icon { color: var(--mr-gold); }
.mr-topbar a:hover { color: #fff; }
.mr-topbar__social { border-left-color: rgba(255, 255, 255, .18); }
.mr-topbar__social a { color: rgba(255, 255, 255, .82); }
.mr-topbar__social a:hover { background: rgba(255, 255, 255, .12); color: #fff; }

/* Search panel on phones: amenities as a 2x2 grid of wide tiles (icon beside
   the label), What's Nearby as a single-column list */
@media (max-width: 767px) {
    .mr-amenity-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        max-width: none;
        margin-top: 16px;
    }
    .mr-amenity {
        flex-direction: row;
        align-items: center;
        gap: 10px;
        padding: 8px 10px 8px 8px;
        border: 1px solid var(--mr-hairline);
        border-radius: 12px;
        background: #fff;
    }
    .mr-amenity__icon { flex-shrink: 0; width: 40px; height: 40px; border-radius: 10px; font-size: 19px; }
    .mr-amenity__label { font-size: 13px; line-height: 1.25; text-align: left; }

    .mr-nearby-list { grid-template-columns: 1fr; gap: 10px; margin-top: 14px; }
    .mr-nearby { gap: 12px; }
    .mr-nearby__icon { width: 38px; height: 38px; font-size: 18px; }
    .mr-nearby__label { font-size: 14px; line-height: 1.35; }
}
@media (max-width: 380px) {
    .mr-amenity { gap: 8px; padding: 7px 8px 7px 7px; }
    .mr-amenity__icon { width: 25px; height: 25px; font-size: 17px; }
    .mr-amenity__label { font-size: 12.5px; }
}

/* Room card: small "View details" link above the price row */
.mr-stay-card__details {
    align-self: flex-end;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: auto;
    margin-bottom: 12px;
    font-size: 13px;
    font-weight: 600;
    color: var(--mr-brand-600);
    transition: color .2s ease;
}
.mr-stay-card__details .mr-icon { font-size: 14px; stroke-width: 2.25; transition: transform .2s ease; }
.mr-stay-card__details:hover { color: var(--mr-red); }
.mr-stay-card__details:hover .mr-icon { transform: translateX(3px); }
.mr-stay-card__details + .mr-stay-card__foot { margin-top: 0; }

/* Room card "Book Now": copper booking colour like the other booking CTAs */
.mr-stay-card__btn.is-book,
.mr-stay-card__btn.is-book:hover { background-color: var(--mr-red); }
.mr-stay-card__btn.is-book {
    background-image: linear-gradient(180deg, #c4623a 0%, var(--mr-red) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 4px 12px rgba(180, 83, 42, .22);
}
.mr-stay-card__btn.is-book:hover {
    background-image: linear-gradient(180deg, var(--mr-red) 0%, var(--mr-red-700) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 8px 22px rgba(180, 83, 42, .32);
}

/* Accessible Stays
   ========================================================================== */
.mr-access { padding-top: 28px; padding-bottom: 36px; }
.mr-access__box {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
    gap: 48px;
    align-items: center;
    padding: 48px;
    overflow: hidden;
    border: 1px solid #dce8f3;
    border-radius: var(--mr-radius-lg);
    background:
        radial-gradient(520px 320px at 100% 0%, rgba(60, 111, 160, .10), transparent 70%),
        linear-gradient(135deg, #f3f8fc 0%, #fff 60%);
    box-shadow: var(--mr-edge), var(--mr-shadow-sm);
}
.mr-access__box::after { /* large faint accessibility symbol */
    content: "";
    position: absolute;
    left: -60px; bottom: -70px;
    width: 260px; height: 260px;
    border-radius: 50%;
    border: 36px solid rgba(60, 111, 160, .05);
    pointer-events: none;
}
.mr-access__content { position: relative; z-index: 1; }
.mr-access__text { max-width: 520px; margin-top: 12px; font-size: 15px; line-height: 1.7; color: var(--mr-ink-2); }

.mr-access__features {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 20px;
    margin-top: 24px;
}
.mr-access__features li { display: flex; align-items: center; gap: 12px; font-size: 14.5px; font-weight: 500; color: var(--mr-ink); }
.mr-access__icon {
    display: inline-flex;
    align-items: center; justify-content: center;
    flex-shrink: 0;
    width: 38px; height: 38px;
    border-radius: 10px;
    background: var(--mr-sky-soft);
    color: var(--mr-sky);
    font-size: 18px;
}

.mr-access__help {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
    margin-top: 28px;
    padding: 16px 18px;
    border: 1px solid var(--mr-hairline);
    border-radius: 14px;
    background: #fff;
    box-shadow: var(--mr-shadow-sm);
}
.mr-access__help-icon {
    display: inline-flex;
    align-items: center; justify-content: center;
    flex-shrink: 0;
    width: 44px; height: 44px;
    border-radius: 50%;
    background: var(--mr-coral-soft);
    color: var(--mr-coral);
    font-size: 20px;
}
.mr-access__help > span:nth-child(2) { flex: 1 1 200px; min-width: 0; }
.mr-access__help strong { display: block; font-size: 15px; color: var(--mr-ink); }
.mr-access__help small { display: block; margin-top: 2px; font-size: 13px; color: var(--mr-muted); }
.mr-access__help-actions { display: flex; align-items: center; gap: 16px; }
.mr-access__help-actions .mr-btn { gap: 8px; }
.mr-access__help-actions .mr-btn .mr-icon { font-size: 15px; }
.mr-access__more { display: inline-flex; align-items: center; gap: 4px; font-size: 13.5px; font-weight: 600; white-space: nowrap; color: var(--mr-brand-600); }
.mr-access__more .mr-icon { font-size: 14px; stroke-width: 2.25; }

/* Accessible room cards */
.mr-access__rooms { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.mr-access-room {
    overflow: hidden;
    border: 1px solid var(--mr-hairline);
    border-radius: var(--mr-radius);
    background: #fff;
    box-shadow: var(--mr-edge), var(--mr-shadow);
    transition: transform .3s ease, box-shadow .3s ease;
}
.mr-access-room:hover { transform: translateY(-4px); box-shadow: var(--mr-edge), var(--mr-shadow-lg); }
.mr-access-room__media { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: var(--mr-tint-100); }
.mr-access-room__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.mr-access-room:hover .mr-access-room__media img { transform: scale(1.05); }
.mr-access-room__tag {
    position: absolute;
    left: 12px; bottom: 12px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 11px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .94);
    box-shadow: var(--mr-shadow-sm);
    font-size: 12px;
    font-weight: 700;
    color: var(--mr-sky);
}
.mr-access-room__tag .mr-icon { font-size: 14px; }
.mr-access-room__body { padding: 16px 18px 18px; }
.mr-access-room__title { font-family: var(--mr-font); font-size: 18px; font-weight: 700; line-height: 1.3; color: var(--mr-ink); }
.mr-access-room__facts { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 8px; font-size: 13px; color: var(--mr-ink-2); }
.mr-access-room__facts span { display: inline-flex; align-items: center; gap: 6px; }
.mr-access-room__facts .mr-icon { font-size: 15px; color: var(--mr-brand-600); }
.mr-access-room__foot {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 10px;
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid var(--mr-line);
}
.mr-access-room__price { font-size: 13px; color: var(--mr-muted); }
.mr-access-room__price small { display: block; font-size: 11.5px; }
.mr-access-room__price strong { font-size: 20px; font-weight: 700; color: var(--mr-brand-800); }
.mr-access-room__link { display: inline-flex; align-items: center; gap: 3px; font-size: 13px; font-weight: 600; white-space: nowrap; color: var(--mr-brand-600); }
.mr-access-room__link .mr-icon { font-size: 14px; stroke-width: 2.25; transition: transform .2s ease; }
.mr-access-room__link:hover { color: var(--mr-red); }
.mr-access-room__link:hover .mr-icon { transform: translateX(3px); }

@media (max-width: 1200px) {
    .mr-access__box { grid-template-columns: 1fr; gap: 32px; padding: 36px; }
}
@media (max-width: 767px) {
    .mr-access { padding-top: 16px; padding-bottom: 24px; }
    .mr-access__box { padding: 24px 18px; }
    .mr-access__features { grid-template-columns: 1fr; }
    .mr-access__rooms { grid-template-columns: 1fr; }
    .mr-access__help-actions { width: 100%; justify-content: space-between; }
}.mr-access-room { display: flex; flex-direction: column; }
.mr-access-room__body { display: flex; flex-direction: column; flex: 1; }
.mr-access-room__foot { margin-top: auto; }
.mr-access-room__facts { margin-bottom: 14px; }

/* Hero overlay: same light sky-blue treatment as the Accessible Stays box */
.mr-hero__box {
    background:
        #f3f8fc;
}
.mr-hero__media::before {
    background:
        linear-gradient(90deg,
            #f3f8fc 0%,
            rgba(243, 248, 252, .94) 16%,
            rgba(247, 250, 253, .6) 32%,
            rgba(255, 255, 255, 0) 52%);
}
@media (max-width: 767px) {
    .mr-hero__media::before {
        background: linear-gradient(180deg,
            #f3f8fc 0%,
            rgba(243, 248, 252, .9) 40%,
            rgba(247, 250, 253, .2) 75%,
            rgba(255, 255, 255, 0) 100%);
    }
}

/* one soft blue glow over the whole hero (top-left), under the copy */
.mr-hero__box::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: radial-gradient(620px 400px at 0% 0%, rgba(60, 111, 160, .11), transparent 70%);
    pointer-events: none;
}

/* Search panel: "Plan Your Stay" as a tinted mini card */
.mr-plan {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px 16px;
    align-items: center;
    padding: 14px 16px;
    overflow: hidden;
    border: 1px solid #efdccd;
    border-radius: 14px;
    background: linear-gradient(135deg, #fcf2ea 0%, #f8f0e4 100%);
}
.mr-plan::after { /* faint dot pattern, top right */
    content: "";
    position: absolute;
    top: -10px; right: -10px;
    width: 110px; height: 80px;
    background-image: radial-gradient(rgba(180, 83, 42, .16) 1.2px, transparent 1.4px);
    background-size: 10px 10px;
    -webkit-mask-image: linear-gradient(225deg, #000 20%, transparent 80%);
            mask-image: linear-gradient(225deg, #000 20%, transparent 80%);
    pointer-events: none;
}
.mr-plan__head { grid-column: 1 / -1; display: flex; align-items: center; gap: 12px; }
.mr-plan__icon {
    display: inline-flex;
    align-items: center; justify-content: center;
    flex-shrink: 0;
    width: 42px; height: 42px;
    border-radius: 12px;
    background: #fff;
    box-shadow: var(--mr-shadow-sm);
    color: var(--mr-red);
    font-size: 20px;
}
.mr-plan .mr-search-panel__label { display: block; margin-top: 2px; font-size: 12.5px; }

.mr-plan__times { display: flex; gap: 8px; }
.mr-plan__times span {
    display: flex;
    flex-direction: column;
    padding: 6px 12px;
    border: 1px solid #efdccd;
    border-radius: 10px;
    background: rgba(255, 255, 255, .8);
    line-height: 1.2;
}
.mr-plan__times small { font-size: 11px; color: var(--mr-muted); }
.mr-plan__times strong { margin-top: 2px; font-size: 14px; font-weight: 700; white-space: nowrap; color: var(--mr-ink); }

.mr-plan__note {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.3;
    color: var(--mr-sage);
}
.mr-plan__note .mr-icon { flex-shrink: 0; font-size: 14px; stroke-width: 2.5; }

.mr-plan .mr-stay-btn.is-book {
    grid-column: 1 / -1;
    width: 100%;
    height: 44px;
    margin-top: 0;
    border: 0;
    background-color: var(--mr-red);
    background-image: linear-gradient(180deg, #c4623a 0%, var(--mr-red) 100%);
    color: #fff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 4px 12px rgba(180, 83, 42, .22);
    transition: box-shadow .25s ease, transform .25s ease;
}
.mr-plan .mr-stay-btn.is-book:hover {
    background-image: linear-gradient(180deg, var(--mr-red) 0%, var(--mr-red-700) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 8px 22px rgba(180, 83, 42, .32);
    transform: translateY(-1px);
    color: #fff;
}
.mr-plan .mr-stay-btn .mr-icon { transition: transform .2s ease; }
.mr-plan .mr-stay-btn:hover .mr-icon { transform: translateX(3px); }

@media (max-width: 1200px) {
    .mr-plan { grid-template-columns: 1fr; }
}
.mr-plan { grid-template-columns: 1fr; gap: 12px; }
.mr-plan__note { margin-top: 3px; }
.mr-plan__times { gap: 10px; }
.mr-plan__times span { flex: 1 1 0; flex-direction: row; align-items: baseline; justify-content: space-between; gap: 8px; padding: 8px 12px; }
.mr-plan__times strong { margin-top: 0; }
@media (max-width: 1440px) {
    .mr-plan__times span { flex-direction: column; align-items: flex-start; gap: 0; padding: 6px 12px; }
    .mr-plan__times strong { margin-top: 2px; }
}

/* Footer: tighter desktop layout - wider brand column so the intro wraps in
   fewer lines, and a compact Your Stay card (check-in/out side by side), so
   the four columns end at about the same height. */
@media (min-width: 1201px) {
    .mr-site-footer__grid {
        grid-template-columns: minmax(0, 1.5fr) minmax(0, .85fr) minmax(0, 1.15fr) minmax(0, 1.1fr);
        gap: 48px;
        align-items: start;
    }
    .mr-site-footer__brand p { max-width: 440px; margin-top: 16px; line-height: 1.65; }
    .mr-site-footer__follow { margin-top: 18px; }

    .mr-footer-stay {
        display: grid;
        grid-template-columns: 1fr 1fr;
        column-gap: 10px;
        padding: 12px 16px 4px;
    }
    .mr-footer-stay li { grid-column: 1 / -1; padding: 7px 0; font-size: 13.5px; }
    .mr-footer-stay li.is-key {
        grid-column: auto;
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
        margin-bottom: 6px;
        padding: 9px 12px;
        border: 1px solid rgba(201, 164, 92, .22);
        border-radius: 10px;
        background: rgba(201, 164, 92, .08);
    }
    .mr-footer-stay li.is-key span { font-size: 12px; color: var(--mr-ft-text); }
    .mr-footer-stay li.is-key strong { padding: 0; background: none; font-size: 17px; font-weight: 700; color: #ecd3a1; }
    .mr-footer-stay li.is-key + li:not(.is-key) { border-top: 1px solid var(--mr-ft-line); }
}@media (min-width: 1201px) {
    .mr-site-footer__col--links a,
    .mr-footer-stay li.is-key span { white-space: nowrap; }
}
@media (min-width: 1201px) and (max-width: 1440px) {
    .mr-site-footer__grid { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1.1fr) minmax(0, 1fr); gap: 36px; }
    .mr-site-footer__col--links ul { gap: 12px 26px; }
    .mr-footer-stay { padding: 10px 12px 4px; column-gap: 8px; }
    .mr-footer-stay li.is-key { padding: 8px 10px; }
    .mr-footer-stay li.is-key strong { font-size: 16px; }
}
/* ==========================================================================
   Search panel - refined: one neutral icon style (warm stone tile, navy
   line icon) instead of four tints; copper is kept only for the booking
   button, like the rest of the homepage.
   ========================================================================== */
.mr-search-panel .mr-amenity__icon,
.mr-search-panel .mr-amenity:nth-child(n) .mr-amenity__icon {
    border: 1px solid var(--mr-hairline);
    background: linear-gradient(180deg, #fff 0%, var(--mr-tint-50) 100%);
    box-shadow: var(--mr-edge);
    color: var(--mr-brand-700);
    transition: border-color .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.mr-search-panel .mr-amenity:hover .mr-amenity__icon {
    border-color: var(--mr-tint-300);
    color: var(--mr-red);
    transform: translateY(-2px);
    box-shadow: var(--mr-edge), var(--mr-shadow-sm);
}
.mr-search-panel .mr-amenity__label { font-weight: 600; color: var(--mr-ink-2); }

.mr-search-panel .mr-nearby:nth-child(n) .mr-nearby__icon {
    border: 1px solid var(--mr-hairline);
    background: var(--mr-tint-50);
    color: var(--mr-brand-700);
}
.mr-search-panel .mr-nearby__label { color: var(--mr-ink); font-weight: 600; }

/* Plan Your Stay: quiet stone card, navy details, gold check */
.mr-plan {
    border-color: var(--mr-hairline);
    background: linear-gradient(180deg, var(--mr-tint-50) 0%, #fff 100%);
    box-shadow: var(--mr-edge);
}
.mr-plan::after { display: none; }
.mr-plan__icon {
    border: 1px solid var(--mr-hairline);
    box-shadow: none;
    color: var(--mr-brand-700);
}
.mr-plan__note { font-weight: 500; color: var(--mr-muted); }
.mr-plan__note .mr-icon { color: var(--mr-gold); }
.mr-plan__times span { border-color: var(--mr-hairline); background: #fff; }
.mr-plan__times small { letter-spacing: .02em; }
.mr-plan__times strong { color: var(--mr-brand-800); }
/* Plan Your Stay button: navy, same as the Groups band button */
.mr-plan .mr-stay-btn.is-book {
    background-color: var(--mr-brand-800);
    background-image: linear-gradient(180deg, #22335a 0%, var(--mr-brand-800) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 4px 12px rgba(20, 33, 61, .18);
}
.mr-plan .mr-stay-btn.is-book:hover {
    background-color: var(--mr-brand-800);
    background-image: linear-gradient(180deg, #2a3d68 0%, #1b2c50 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 8px 20px rgba(20, 33, 61, .26);
}
.mr-plan__times small { white-space: nowrap; }
/* Room card amenities: light inline list instead of boxed chips; "+N more"
   is a plain text button that still opens the full amenities popover. */
.mr-stay-card__features { gap: 6px 14px; margin-top: 14px; }
.mr-stay-card__features li {
    gap: 5px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.5;
    color: var(--mr-ink-2);
}
.mr-stay-card__features .mr-icon { font-size: 13px; stroke-width: 2.5; color: var(--mr-brand-400); }
.mr-stay-card__more,
.mr-stay-card__more:hover,
.mr-stay-card__more[aria-expanded="true"] {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.5;
    color: var(--mr-brand-800);
    text-decoration: underline;
    text-decoration-color: var(--mr-tint-300);
    text-underline-offset: 3px;
    transition: color .2s ease, text-decoration-color .2s ease;
}
.mr-stay-card__more:hover,
.mr-stay-card__more[aria-expanded="true"] { color: var(--mr-red); text-decoration-color: currentColor; }
@media (min-width: 1201px) and (max-width: 1440px) {
    .mr-stay-card__features { gap: 4px 12px; }
    .mr-stay-card__foot { gap: 10px; }
    .mr-stay-card__price strong { font-size: 21px; }
    .mr-stay-card__btn { gap: 6px; padding: 0 14px; font-size: 13.5px; }
}

/* ==========================================================================
   Search panel - Option B: navy amenity tiles (white icons, gold on hover),
   navy-outline nearby icons, cool white Plan card. Uses only the site's
   core colours: navy, white and a touch of gold.
   ========================================================================== */
.mr-search-panel .mr-amenity__icon,
.mr-search-panel .mr-amenity:nth-child(n) .mr-amenity__icon {
    border: 0;
    background: linear-gradient(160deg, #22335a 0%, var(--mr-brand-800) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 6px 14px rgba(20, 33, 61, .16);
    color: #fff;
}
.mr-search-panel .mr-amenity:hover .mr-amenity__icon {
    color: var(--mr-gold);
    transform: translateY(-2px);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 10px 22px rgba(20, 33, 61, .24);
}
.mr-search-panel .mr-amenity__label { color: var(--mr-ink); }

.mr-search-panel .mr-nearby:nth-child(n) .mr-nearby__icon {
    border: 1.5px solid var(--mr-brand-800);
    background: #fff;
    color: var(--mr-brand-800);
    transition: background-color .2s ease, color .2s ease;
}
.mr-search-panel .mr-nearby:hover .mr-nearby__icon { background: var(--mr-brand-800); color: #fff; }

.mr-plan {
    border-color: #e3e8f0;
    background: linear-gradient(180deg, #f6f8fb 0%, #fff 100%);
}
.mr-plan__icon { border-color: #e3e8f0; color: var(--mr-brand-800); }
.mr-plan__times span { border-color: #e3e8f0; }@media (max-width: 767px) {
    .mr-search-panel .mr-amenity { border-color: #e3e8f0; }
}

/* ==========================================================================
   Search panel - Option A: sky tint, the same blue as the hero overlay, so
   the panel reads as part of the hero. Replaces the navy-tile layer above.
   ========================================================================== */
.mr-search-panel {
    --mr-sky-50: #f3f8fc;
    --mr-sky-100: #e1eefb;
    --mr-sky-200: #c8ddf3;
    --mr-sky-600: #1f6bb5;
    --mr-sky-700: #22517f;
}
.mr-search-panel .mr-amenity__icon,
.mr-search-panel .mr-amenity:nth-child(n) .mr-amenity__icon {
    border: 1px solid var(--mr-sky-200);
    box-shadow: inset 0 1px 0 #fff;
    background: var(--mr-sky-soft);
    color: var(--mr-sky);
}
.mr-search-panel .mr-amenity__icon .mr-icon { stroke-width: 1.7; }
.mr-search-panel .mr-amenity:hover .mr-amenity__icon {
    border-color: var(--mr-sky-600);
    background: var(--mr-sky-600);
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 8px 18px rgba(31, 107, 181, .3);
}
.mr-search-panel .mr-amenity__label { color: var(--mr-ink); }

.mr-search-panel .mr-nearby:nth-child(n) .mr-nearby__icon {
    border: 1px solid var(--mr-sky-200);
    background: var(--mr-sky-soft);
    color: var(--mr-sky);
}
.mr-search-panel .mr-nearby:hover .mr-nearby__icon { border-color: var(--mr-sky-600); background: var(--mr-sky-600); color: #fff; }

.mr-plan {
    border-color: var(--mr-sky-200);
    background: linear-gradient(180deg, var(--mr-sky-50) 0%, #fff 100%);
}
.mr-plan__icon { border-color: var(--mr-sky-200); background: #fff; color: var(--mr-sky-600); }
.mr-plan__note .mr-icon { color: var(--mr-sky-600); }
.mr-plan__times span { border-color: var(--mr-sky-200); background: #fff; }
.mr-plan__times small { color: var(--mr-sky-700); }

@media (max-width: 767px) {
    .mr-search-panel .mr-amenity { border-color: var(--mr-sky-200); background: var(--mr-sky-50); }
    .mr-search-panel .mr-amenity__icon { background: #fff; }
}
/* Hotel Amenities: back to one colour per amenity - breakfast (sand),
   Wi-Fi (sky), parking (coral), pets (sage); hover fills the tile. */
.mr-search-panel .mr-amenity-list .mr-amenity:nth-child(1) { --mr-am: var(--mr-sand);  --mr-am-soft: var(--mr-sand-soft); }
.mr-search-panel .mr-amenity-list .mr-amenity:nth-child(2) { --mr-am: var(--mr-sky);   --mr-am-soft: var(--mr-sky-soft); }
.mr-search-panel .mr-amenity-list .mr-amenity:nth-child(3) { --mr-am: var(--mr-coral); --mr-am-soft: var(--mr-coral-soft); }
.mr-search-panel .mr-amenity-list .mr-amenity:nth-child(4) { --mr-am: var(--mr-sage);  --mr-am-soft: var(--mr-sage-soft); }
.mr-search-panel .mr-amenity-list .mr-amenity .mr-amenity__icon {
    border: 1px solid transparent;
    background: var(--mr-am-soft);
    box-shadow: none;
    color: var(--mr-am);
}
.mr-search-panel .mr-amenity-list .mr-amenity:hover .mr-amenity__icon {
    border-color: var(--mr-am);
    background: var(--mr-am);
    color: #fff;
    transform: translateY(-2px);
    box-shadow: var(--mr-shadow-sm);
}
@media (max-width: 767px) {
    .mr-search-panel .mr-amenity-list .mr-amenity { background: #fff; border-color: var(--mr-hairline); }
}
/* ==========================================================================
   Dark header: the same deep navy as the logo's background (#000f24), so
   the logo sits on it seamlessly. Top bar a shade lighter above it.
   ========================================================================== */
:root { --mr-hd-bg: #000f24; --mr-hd-top: #000f24; --mr-hd-line: rgba(255, 255, 255, .08); }

.mr-site-header { background: var(--mr-hd-bg); }
.mr-topbar {
    background: var(--mr-hd-top);
    border-bottom: 1px solid var(--mr-hd-line);
}
.mr-site-header__inner { position: relative; }
/* hide the logo file's light edge */
/*.mr-site-header .mr-site-logo__img { clip-path: inset(1px round 2px); } */

.mr-site-header .mr-main-nav__list a,
.mr-site-header .mr-main-nav__list a:not([href]) { color: rgba(255, 255, 255, .8); transition: color .2s ease; }
.mr-site-header .mr-main-nav__list a:hover,
.mr-site-header .mr-main-nav__list a.is-active { color: #fff; }

.mr-nav-toggle { border-color: rgba(255, 255, 255, .2); color: #fff; }
.mr-nav-toggle:hover { background: rgba(255, 255, 255, .08); }

/* soft glow line under the header */
.mr-site-header::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, rgba(201, 164, 92, .35) 50%, transparent 100%);
    pointer-events: none;
}

@media (max-width: 1024px) {
    .mr-main-nav {
        background: var(--mr-hd-bg);
        border-top-color: var(--mr-hd-line);
        box-shadow: 0 18px 40px rgba(0, 8, 20, .35);
    }
    .mr-main-nav__list a { border-bottom-color: var(--mr-hd-line); }
}@media (max-width: 767px) {
    .mr-site-header .mr-site-logo__img { height: 38px; }
}

/* Footer: same deep navy as the logo background (and the header) */
.mr-site-footer {
    --mr-ft-bg: #000f24;
    background:
        radial-gradient(900px 420px at 92% 0%, rgba(75, 106, 163, .14), transparent 70%),
        radial-gradient(700px 380px at 20% 110%, rgba(75, 106, 163, .08), transparent 70%),
        var(--mr-ft-bg);
}
.mr-site-footer .mr-site-logo__img { height: 46px; border-radius: 0; clip-path: inset(1px round 2px); }
@media (max-width: 767px) {
    .mr-site-footer .mr-site-logo__img { height: 40px; }
}
@media (max-width: 474px) 
{
    .mr-topbar
    {
        display: none;
    }
}

/* Accessible Stays: single column must be minmax(0, 1fr) or wide content
   (help card, room cards) pushes past the box on narrow phones */
@media (max-width: 1200px) {
    .mr-access__box { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767px) {
    .mr-access__rooms { grid-template-columns: minmax(0, 1fr); }
    .mr-access__help { padding: 16px; }
    .mr-access__help > span:nth-child(2) { flex-basis: 100%; }
    .mr-access__help-actions { flex-wrap: wrap; gap: 12px 16px; }
}

/* ==========================================================================
   Header v3: white main bar, deep navy top bar with copper icons, logo in
   its own rounded navy box. Replaces the dark-header layer above.
   ========================================================================== */
.mr-site-header { background: #fff; box-shadow: 0 1px 0 var(--mr-hairline), 0 6px 18px rgba(0, 15, 36, .05); }
.mr-site-header::after { display: none; }
.mr-topbar {
    background: #00204d;
    border-bottom: 0;
    color: #fff;
}
.mr-topbar__info a,
.mr-topbar__hours { font-size: 13px; font-weight: 500; color: #fff; }
.mr-topbar__info .mr-icon,
.mr-topbar__hours .mr-icon { color: #e8893a; font-size: 16px; }
.mr-topbar__sep { margin: 0 -2px; opacity: .6; }
.mr-topbar__social { border-left-color: rgba(255, 255, 255, .2); }
.mr-topbar__social a { color: #fff; }

/*.mr-site-header .mr-site-logo__img { clip-path: inset(1px round 6px); }*/

.mr-site-header .mr-main-nav__list a,
.mr-site-header .mr-main-nav__list a:not([href]) { font-weight: 600; color: #00204d; }
.mr-site-header .mr-main-nav__list a:hover,
.mr-site-header .mr-main-nav__list a.is-active { color: #00204d; }
.mr-main-nav__list a::after { background: var(--mr-red); }

.mr-site-header .mr-btn--login { gap: 10px; height: 50px; padding: 0 24px; border-radius: 8px; font-size: 14px; }
.mr-site-header .mr-btn--login .mr-icon { font-size: 17px; }
.mr-site-header .mr-btn--login .mr-icon:last-child { transition: transform .2s ease; }
.mr-site-header .mr-btn--login:hover .mr-icon:last-child { transform: translateX(3px); }

.mr-nav-toggle { border-color: var(--mr-line); color: #00204d; }
.mr-nav-toggle:hover { background: var(--mr-tint-50); }

@media (max-width: 1024px) {
    .mr-main-nav {
        background: #fff;
        border-top-color: var(--mr-line);
        box-shadow: var(--mr-shadow);
    }
    .mr-main-nav__list a { border-bottom-color: var(--mr-line); }
}
/* Hero: full-width photo box, edge to edge under the header. The copy and
   slider controls still line up with the page container. */
.mr-hero { --mr-hero-edge: max(var(--mr-gutter), calc((100vw - var(--mr-site-max)) / 2 + var(--mr-gutter))); }
.mr-hero__box,
.mr-hero__box[data-mr-hero-slider] { width: 100%; max-width: none; margin: 0; border-radius: 0; }
.mr-hero__content { padding-left: var(--mr-hero-edge); }
.mr-hero__controls { right: var(--mr-hero-edge); }
.mr-hero { padding-top: 0; }

/* ==========================================================================
   Hero v3: full-bleed photo under a deep navy fade from the left, white
   headline with a copper accent line, copper eyebrow, ghost second button.
   Replaces the light sky overlay above.
   ========================================================================== */
.mr-hero__box { background: #00204d; }
.mr-hero__box::after { display: none; }
.mr-hero__media { left: 0; width: 100%; }
.mr-hero__media::before {
    background:
        linear-gradient(90deg,
            rgba(0, 24, 58, .94) 0%,
            rgba(0, 28, 66, .84) 26%,
            rgba(0, 32, 77, .5) 46%,
            rgba(0, 32, 77, .12) 64%,
            rgba(0, 32, 77, 0) 78%),
        linear-gradient(0deg, rgba(0, 20, 48, .35) 0%, rgba(0, 20, 48, 0) 35%);
}
.mr-hero__img { filter: saturate(1.08) contrast(1.02); }

.mr-hero__eyebrow {
    padding: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
    font-size: 13px;
    letter-spacing: .08em;
    color: #e8913f;
}
.mr-hero__eyebrow::before { display: none; }
.mr-hero__eyebrow::after {
    content: "";
    width: 36px; height: 1.5px;
    margin-left: 8px;
    background: currentColor;
    opacity: .8;
}
.mr-hero__title { color: #fff; text-shadow: 0 2px 18px rgba(0, 12, 30, .25); }
.mr-hero__title span { color: #e8913f; }
.mr-hero__text { color: rgba(255, 255, 255, .9); }

.mr-hero__btn.mr-btn--ghost {
    border: 1.5px solid rgba(255, 255, 255, .7);
    background: rgba(255, 255, 255, .04);
    color: #fff;
    backdrop-filter: blur(2px);
}
.mr-hero__btn.mr-btn--ghost:hover { border-color: #fff; background: rgba(255, 255, 255, .14); color: #fff; }

.mr-hero__controls { background: rgba(0, 20, 48, .45); }
.mr-hero__dot.is-active { background: #e8913f; }

@media (max-width: 767px) {
    .mr-hero__media::before {
        background: linear-gradient(180deg,
            rgba(0, 24, 58, .92) 0%,
            rgba(0, 28, 66, .82) 50%,
            rgba(0, 32, 77, .55) 100%);
    }
}
/* Hero: one orange for the accent line, eyebrow, active dot and main button */
.mr-hero { --mr-hero-orange: #dd7a3c; --mr-hero-orange-700: #c4622a; }
.mr-hero__eyebrow,
.mr-hero__title span { color: var(--mr-hero-orange); }
.mr-hero__dot.is-active { background: var(--mr-hero-orange); }
.mr-hero__btn.mr-btn--primary {
    background-color: var(--mr-hero-orange);
    background-image: none;
    box-shadow: 0 6px 16px rgba(221, 122, 60, .28);
}
.mr-hero__btn.mr-btn--primary:hover {
    background-color: var(--mr-hero-orange-700);
    background-image: none;
    box-shadow: 0 10px 24px rgba(221, 122, 60, .36);
}

/* Top bar: logo navy (#000f24) on the left, easing into the hero navy on the right */
.mr-topbar { background: linear-gradient(90deg, #000f24 0%, #000f24 30%, #00183a 70%, #00204d 100%); }

/* One booking orange everywhere: header button, hero, room Book Now,
   booking band - same colour as the hero accent line */
:root { --mr-red: #dd7a3c; --mr-red-700: #c4622a; }
.mr-btn--login,
.mr-stay-card__btn.is-book,
.mr-newsletter__actions .mr-btn--light-green {
    background-color: var(--mr-red);
    background-image: none;
    box-shadow: 0 6px 16px rgba(221, 122, 60, .28);
}
.mr-btn--login:hover,
.mr-stay-card__btn.is-book:hover,
.mr-newsletter__actions .mr-btn--light-green:hover {
    background-color: var(--mr-red-700);
    background-image: none;
    box-shadow: 0 10px 24px rgba(221, 122, 60, .36);
}

/* One button size everywhere: 48px tall, same padding, font and radius.
   Paired buttons (hero, booking band, groups) share a minimum width so
   they match each other. */
.mr-ui .mr-btn {
    gap: 10px;
    height: 48px;
    padding: 0 26px;
    border-radius: 8px;
    font-size: 14px;
}
.mr-ui .mr-btn .mr-icon { font-size: 17px; }
.mr-hero__actions .mr-btn,
.mr-newsletter__actions .mr-btn,
.mr-offer__actions .mr-btn { min-width: 200px; }
@media (min-width: 1201px) and (max-width: 1440px) {
    .mr-ui .mr-stay-card__btn { padding: 0 16px; font-size: 13.5px; }
}
@media (max-width: 767px) {
    .mr-hero__actions .mr-btn,
    .mr-newsletter__actions .mr-btn,
    .mr-offer__actions .mr-btn { min-width: 0; }
}

/* One button size everywhere, matching .mr-btn--sm (the Call Us button):
   40px tall, 22px side padding, 14px text, 6px corners */
.mr-ui .mr-btn,
.mr-ui .mr-btn.mr-hero__btn,
.mr-ui .mr-btn.mr-stay-card__btn,
.mr-site-header .mr-btn.mr-btn--login,
.mr-plan .mr-btn.mr-stay-btn {
    gap: 8px;
    height: 40px;
    padding: 0 22px;
    border-radius: 6px;
    font-size: 14px;
}
.mr-ui .mr-btn .mr-icon { font-size: 16px; }
@media (min-width: 1201px) and (max-width: 1440px) {
    .mr-ui .mr-btn.mr-stay-card__btn { padding: 0 16px; font-size: 13.5px; }
}

/* ==========================================================================
   Transparent header (body.mr-header-over, set in functions.php): the white
   bar becomes transparent over the dark hero / page banner, with white menu
   links and a soft dark fade behind them for legibility. The navy top bar
   stays as it is.
   ========================================================================== */
body.mr-header-over { --mr-over-h: calc(var(--mr-topbar-h) + var(--mr-header-h)); }
body.mr-header-over .mr-site-header {
    position: absolute;
    top: 0; left: 0; right: 0;
    background: transparent;
    box-shadow: none;
}
body.admin-bar.mr-header-over .mr-site-header { top: 32px; }
body.mr-header-over .mr-site-header::after {
    content: "";
    display: block;
    position: absolute;
    left: 0; right: 0;
    top: var(--mr-topbar-h);
    bottom: auto;
    z-index: -1;
    height: calc(var(--mr-header-h) + 40px);
    background: linear-gradient(180deg, rgba(0, 15, 36, .55) 0%, rgba(0, 15, 36, .35) 60%, rgba(0, 15, 36, 0) 100%);
    pointer-events: none;
}
body.mr-header-over .mr-site-header .mr-main-nav__list a,
body.mr-header-over .mr-site-header .mr-main-nav__list a:not([href]) {
    color: rgba(255, 255, 255, 255);
    text-shadow: 0 1px 8px rgb(0 12 30);
}
body.mr-header-over .mr-site-header .mr-main-nav__list a:hover,
body.mr-header-over .mr-site-header .mr-main-nav__list a.is-active { color: #fff; }
body.mr-header-over .mr-nav-toggle { border-color: rgba(255, 255, 255, .45); background: rgba(0, 15, 36, .25); color: #fff; }

/* hero / banner start at the very top, under the header */
body.mr-header-over .mr-hero__content { padding-top: calc(var(--mr-over-h) + 40px); }
@media (min-width: 1025px) {
    body.mr-header-over .mr-hero {
        height: calc(100vh - var(--mr-adminbar-h));
        height: calc(100svh - var(--mr-adminbar-h));
    }
    body.mr-header-over .mr-hero__content { padding-top: calc(var(--mr-over-h) + clamp(24px, 4vh, 48px)); }
}
body.mr-header-over .mr-rp-hero__content { padding-top: calc(var(--mr-over-h) + 44px); }

@media (max-width: 1024px) {
    body.mr-header-over { --mr-over-h: calc(var(--mr-topbar-h) + 60px); }
    /* the opened mobile menu keeps its white panel with navy links */
    body.mr-header-over .mr-site-header .mr-main-nav__list a,
    body.mr-header-over .mr-site-header .mr-main-nav__list a:not([href]) { color: var(--mr-ink); text-shadow: none; }
    body.mr-header-over .mr-site-header .mr-main-nav__list a:hover,
    body.mr-header-over .mr-site-header .mr-main-nav__list a.is-active { color: #00204d; }
}
@media (max-width: 782px) {
    body.admin-bar.mr-header-over .mr-site-header { top: 46px; }
}
@media (max-width: 474px) {
    body.mr-header-over { --mr-over-h: 60px; }
    body.mr-header-over .mr-site-header::after { top: 0; }
}

/* ==========================================================================
   Quick info panel v2: amenity strip under the hero, then "Why choose us"
   with a photo + Plan Your Stay card, then a Nearby Attractions band.
   ========================================================================== */
.mr-hero { --mr-panel-overlap: 58px; }
.mr-welcome {
    --mr-qp-tint: #f2f6fb;
    --mr-qp-tint-2: #e6eef8;
    --mr-qp-orange: var(--mr-red, #dd7a3c);
}

/* Amenity strip */
.mr-qp-strip {
    position: relative;
    z-index: 3;
    display: grid;
    grid-template-columns: repeat(var(--mr-qp-cols, 5), minmax(0, 1fr));
    margin: calc(-1 * var(--mr-panel-overlap)) 0 0;
    padding: 18px 0;
    list-style: none;
    border: 1px solid var(--mr-hairline);
    border-radius: var(--mr-radius);
    background: #fff;
    box-shadow: 0 2px 4px rgba(15, 25, 48, .04), 0 14px 34px rgba(15, 25, 48, .09);
}
.mr-qp-strip__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 6px 12px;
    text-align: center;
}
.mr-qp-strip__item + .mr-qp-strip__item { border-left: 1px solid #e3e8ef; }
.mr-qp-strip__icon { display: inline-flex; font-size: 32px; color: var(--mr-brand-800); }
.mr-qp-strip__icon .mr-icon { stroke-width: 1.6; }
.mr-qp-strip__label { font-size: 14px; font-weight: 600; color: var(--mr-ink); }

/* Section */
.mr-ui.mr-welcome { padding: 20px 0 20px; }
.mr-qp-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--mr-red-700, #c4622a);
}
.mr-qp-eyebrow::after { content: ""; width: 28px; height: 1.5px; background: currentColor; opacity: .8; }

.mr-welcome__grid {
    display: grid;
    grid-template-columns: minmax(0, .92fr) minmax(0, 1.2fr);
    gap: 44px;
    align-items: center;
}
.mr-welcome__title {
    font-size: 30px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -.02em;
    color: var(--mr-ink);
}
.mr-welcome__text { margin-top: 12px; font-size: 15px; line-height: 1.65; color: var(--mr-ink-2); max-width: 600px; }
.mr-welcome__points {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, max-content));
    column-gap: 80px;
    row-gap: 10px;
    margin: 20px 0 0;
    padding: 0;
    list-style: none;
}
.mr-welcome__points li { display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--mr-ink-2); }
.mr-welcome__check {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--mr-qp-orange);
    color: #fff;
    font-size: 11px;
}
.mr-welcome__check .mr-icon { stroke-width: 3.2; }
.mr-ui .mr-btn.mr-welcome__btn {
    margin-top: 26px;
    background-color: var(--mr-red-700, #c4622a);
    background-image: linear-gradient(180deg, var(--mr-red, #dd7a3c) 0%, var(--mr-red-700, #c4622a) 100%);
    box-shadow: 0 6px 16px rgba(221, 122, 60, .28);
    color: #fff;
}
.mr-ui .mr-btn.mr-welcome__btn:hover { background-image: none; background-color: var(--mr-red-700, #c4622a); box-shadow: 0 10px 24px rgba(221, 122, 60, .36); }
.mr-welcome__btn .mr-icon,
.mr-welcome__book .mr-icon { transition: transform .2s ease; }
.mr-welcome__btn:hover .mr-icon,
.mr-welcome__book:hover .mr-icon { transform: translateX(3px); }

/* Photo + Plan Your Stay */
.mr-welcome__plan {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr);
    align-items: center;
    border-radius: var(--mr-radius);
    background: linear-gradient(90deg, #fff 0%, #fff 20%, var(--mr-qp-tint) 20%);
}
.mr-welcome__photo {
    position: relative;
    display: block;
    overflow: hidden;
    margin: 0;
    padding: 12px;
    border: 1px solid var(--mr-hairline);
    border-radius: var(--mr-radius);
    background: #fff;
    box-shadow: 0 2px 4px rgba(15, 25, 48, .04), 0 14px 30px rgba(15, 25, 48, .08);
}
.mr-welcome__photo img {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 2;
    object-fit: cover;
    border-radius: 10px;
    transition: transform .5s ease;
}
.mr-welcome__photo::after {
    content: "";
    position: absolute;
    inset: 12px;
    border-radius: 10px;
    background: linear-gradient(180deg, rgba(0, 15, 36, 0) 55%, rgba(0, 15, 36, .78) 100%);
    pointer-events: none;
}

.mr-welcome__caption {
    position: absolute;
    z-index: 1;
    left: 30px;
    right: 30px;
    bottom: 26px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    font-size: 15px;
    font-weight: 600;
    color: #fff;
}
.mr-welcome__caption .mr-icon { font-size: 17px; transition: transform .2s ease; }
.mr-welcome__photo:hover .mr-welcome__caption .mr-icon { transform: translateX(3px); }

.mr-welcome__stay { padding: 26px 28px; }
.mr-welcome__stay-head { display: flex; align-items: center; gap: 14px; }
.mr-welcome__stay-icon {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    border: 1px solid #d6e0ec;
    border-radius: 50%;
    background: #fff;
    color: var(--mr-brand-800);
    font-size: 21px;
}
.mr-welcome__stay-title { font-size: 20px; font-weight: 700; color: var(--mr-ink); }
.mr-welcome__stay-note { margin-top: 3px; font-size: 13px; color: var(--mr-ink-2); }
.mr-ui .mr-btn.mr-welcome__book {
    width: 100%;
    height: 44px;
    margin-top: 22px;
    background-color: var(--mr-brand-800);
    background-image: linear-gradient(180deg, #22335a 0%, var(--mr-brand-800) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 4px 12px rgba(20, 33, 61, .18);
    color: #fff;
}
.mr-ui .mr-btn.mr-welcome__book:hover {
    background-image: linear-gradient(180deg, #2a3d68 0%, #1b2c50 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 8px 20px rgba(20, 33, 61, .26);
}

/* Nearby attractions band */
.mr-nearby-band {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    grid-template-areas: "head more" "head list";
    column-gap: 32px;
    row-gap: 12px;
    align-items: center;
    margin-top: 40px;
    padding: 22px 28px 26px;
    border-radius: var(--mr-radius);
    background: var(--mr-qp-tint);
}
.mr-nearby-band__head { grid-area: head; }
.mr-nearby-band__title { font-size: 26px; font-weight: 700; line-height: 1.2; letter-spacing: -.02em; color: var(--mr-ink); }
.mr-nearby-band__more {
    grid-area: more;
    justify-self: end;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--mr-ink);
    text-decoration: none;
}
.mr-nearby-band__more .mr-icon { font-size: 15px; color: var(--mr-red-700, #c4622a); transition: transform .2s ease; }
.mr-nearby-band__more:hover { color: var(--mr-red-700, #c4622a); }
.mr-nearby-band__more:hover .mr-icon { transform: translateX(3px); }
.mr-nearby-band__list {
    grid-area: list;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.mr-nearby-band__card {
    display: flex;
    align-items: center;
    gap: 14px;
    min-height: 74px;
    padding: 14px 16px;
    border: 1px solid #e3e9f1;
    border-radius: 10px;
    background: #fff;
    transition: box-shadow .2s ease, transform .2s ease;
}
.mr-nearby-band__card:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(15, 25, 48, .08); }
.mr-nearby-band__icon {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--mr-qp-tint-2);
    color: var(--mr-brand-800);
    font-size: 20px;
}
.mr-nearby-band__text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.mr-nearby-band__text strong { font-size: 13.5px; font-weight: 600; line-height: 1.3; color: var(--mr-ink); }
.mr-nearby-band__text small { font-size: 12.5px; color: var(--mr-ink-2); }

/* Responsive */
@media (max-width: 1200px) {
    .mr-welcome__grid { grid-template-columns: 1fr; gap: 36px; }
    .mr-nearby-band { grid-template-columns: 1fr auto; grid-template-areas: "head more" "list list"; }
    .mr-nearby-band__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 1024px) {
    .mr-hero { --mr-panel-overlap: 50px; }
    .mr-qp-strip { padding: 14px 0; }
    .mr-qp-strip__label { font-size: 13px; }
}
@media (max-width: 767px) {
    .mr-qp-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 14px; margin-top: -110px; }
    .mr-qp-strip__item + .mr-qp-strip__item { border-left: 0; }
    .mr-qp-strip__icon { font-size: 26px; }
    .mr-qp-strip__label { font-size: 12.5px; }
    .mr-ui.mr-welcome { padding-top: 32px; }
    .mr-welcome__title { font-size: 25px; }
    .mr-welcome__points { grid-template-columns: 1fr; }
    .mr-welcome__plan { grid-template-columns: 1fr; background: var(--mr-qp-tint); }
    .mr-welcome__stay { padding: 22px 20px 24px; }
    .mr-nearby-band { grid-template-columns: 1fr; grid-template-areas: "head" "list" "more"; padding: 22px 18px; }
    .mr-nearby-band__more { justify-self: start; }
    .mr-nearby-band__list { grid-template-columns: 1fr; }
    .mr-nearby-band__title { font-size: 23px; }
}

/* Welcome row: the room photo is 240px tall and the photo + Plan Your Stay
   box fits around it. */
@media (min-width: 1201px) {
    .mr-welcome__grid { align-items: center; }
    .mr-welcome__plan { align-items: center; }
    .mr-welcome__photo { display: flex; }
    .mr-welcome__photo img { height: 240px; aspect-ratio: auto; }
    .mr-welcome__stay { display: flex; flex-direction: column; justify-content: center; }
}

/* Header on small laptops (1025-1280px): logo, menu and Book Your Room fit
   on one row without spilling past the right edge */
@media (min-width: 1025px) and (max-width: 1280px) {
    .mr-site-logo__img { height: 42px; }
    .mr-main-nav { margin-left: 18px; margin-right: 14px; }
    .mr-main-nav__list { gap: 16px; }
    .mr-main-nav__list a { font-size: 13px; }
    .mr-site-header .mr-btn.mr-btn--login { gap: 6px; padding: 0 14px; font-size: 13px; }
    .mr-site-header .mr-btn.mr-btn--login .mr-icon:first-child { display: none; }
}
@media (min-width: 1025px) and (max-width: 1120px) {
    .mr-site-logo__img { height: 38px; }
    .mr-main-nav { margin-left: 14px; margin-right: 10px; }
    .mr-main-nav__list { gap: 13px; }
    .mr-main-nav__list a { font-size: 12.5px; }
}

/* Footer without the booking band above it (the page has its own booking
   section): no room needed for the band overlap, so less top padding */
.mr-site-footer--no-band { padding-top: 44px; }
.mr-site-footer--no-band::before { top: 20px; }
@media (max-width: 767px) {
    .mr-site-footer--no-band { padding-top: 36px; }
}