/* ==========================================================================
   CSS Variables & Reset
   ========================================================================== */
:root {
    /* Holt Accommodation Brand Palette (2026) */
    --olive: #5c6d51;       /* Primary sage green */
    --forest: #173b30;      /* Deep forest - dark backgrounds, nav scrolled */
    --cream: #f5f2ed;       /* Warm ivory background */
    --beige: #dadfd7;       /* Pale sage section tint */
    --soft-sage: #b7c8b5;   /* Soft sage accent / highlight */
    --terracotta: #413525;  /* Warm deep brown - accent CTA / contrast */
    --gold: #5c6d51;        /* Remapped decorative accent -> sage */
    --grey: #949488;        /* Muted text */
    --light-border: #dadfd7;
    --white: #ffffff;
    --dark: #413525;        /* Deep brown text */

    /* Typography */
    --font-serif: 'Playfair Display', 'Cormorant Garamond', serif;
    --font-sans: 'Montserrat', 'Inter', sans-serif;

    /* Radii */
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 18px;

    /* Transitions & Shadows */
    --transition: all 0.3s ease;
    --shadow-sm: 0 4px 15px rgba(0, 0, 0, 0.06);
    --shadow-md: 0 10px 30px rgba(0, 0, 0, 0.12);

    /* Layout */
    --section-padding-desk: 80px 24px;
    --section-padding-mob: 56px 20px;
    --max-width: 1180px;
}

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

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-sans);
    color: var(--dark);
    background-color: var(--cream);
    line-height: 1.6;
    font-size: 16px;
    overflow-x: hidden;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

a {
    text-decoration: none;
    color: inherit;
    transition: var(--transition);
}

ul {
    list-style: none;
}

/* ==========================================================================
   Typography & Utility Classes
   ========================================================================== */
h1, h2, h3, .font-serif {
    font-family: var(--font-serif);
    font-weight: 600;
    color: var(--dark);
}

/* Colour utilities */
.text-olive      { color: var(--olive); }
.text-terracotta { color: var(--terracotta); }
.text-beige      { color: var(--beige); }
.text-dark       { color: var(--dark); }
.text-white      { color: var(--white); }
.text-gold       { color: var(--gold); }
.text-center     { text-align: center; }
.justify-center  { justify-content: center; }

.bg-olive      { background-color: var(--olive); }
.bg-forest     { background-color: var(--forest); }
.bg-cream      { background-color: var(--cream); }
.bg-beige      { background-color: var(--beige); }
.bg-terracotta { background-color: var(--terracotta); }
.bg-gold       { background-color: var(--gold); }

/* Layout */
.container {
    max-width: var(--max-width);
    margin: 0 auto;
    padding: 0 24px;
}

.section-padding {
    padding: 100px 0;
}

/* Typography helpers */
.label {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: 700;
    margin-bottom: 12px;
}

.section-title {
    font-size: 46px;
    line-height: 1.1;
    margin-bottom: 24px;
}

.body-text {
    color: var(--dark);
    margin-bottom: 20px;
    font-weight: 500;
    font-size: 17px;
    line-height: 1.7;
}

.italic-serif {
    font-family: var(--font-serif);
    font-style: italic;
    font-weight: 500;
}

/* Image */
.rounded-image {
    border-radius: var(--radius-md);
    object-fit: cover;
}

/* Shadows */
.shadow-sm { box-shadow: var(--shadow-sm); }
.shadow-md { box-shadow: var(--shadow-md); }

/* Spacing */
.mb-2 { margin-bottom: 8px; }
.mb-6 { margin-bottom: 24px; }
.mb-8 { margin-bottom: 40px; }
.mt-4 { margin-top: 16px; }
.mt-8 { margin-top: 40px; }

/* Display helpers */
.desktop-only { display: inline; }

/* ==========================================================================
   Buttons
   ========================================================================== */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 14px 28px;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    font-weight: 700;
    border-radius: 4px;
    border: none;
    cursor: pointer;
    text-align: center;
    transition: box-shadow 0.35s ease, transform 0.35s ease,
                background-color 0.35s ease, color 0.35s ease, border-color 0.35s ease;
}

.btn-full { width: 100%; }

/* Terracotta button */
.btn-terracotta {
    background-color: var(--terracotta);
    color: var(--white);
}
.btn-terracotta:hover {
    background-color: #2e2519;
    box-shadow: 0 8px 24px rgba(65, 53, 37, 0.35);
    transform: translateY(-2px);
}

/* Olive / navy button */
.btn-olive {
    background-color: var(--olive);
    color: var(--white);
}
.btn-olive:hover {
    background-color: var(--forest);
    box-shadow: 0 8px 24px rgba(92, 109, 81, 0.35);
    transform: translateY(-2px);
}

/* Pan-reveal hover effect */
.btn-pan-hover {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    transition: box-shadow 0.35s ease, transform 0.35s ease,
                color 0.35s ease, border-color 0.35s ease;
}
.btn-pan-hover span {
    position: relative;
    z-index: 1;
}
.btn-pan-hover::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    transform: translate3d(0, 0, 0);
    transition: transform 0.3s cubic-bezier(0.7, 0, 0.2, 1);
}
.btn-pan-hover:hover::before,
.btn-pan-hover:focus-visible::before {
    transform: translate3d(0, -100%, 0);
}

.btn-olive.btn-pan-hover                { background-color: var(--forest); }
.btn-olive.btn-pan-hover::before        { background-color: var(--olive); }
.btn-terracotta.btn-pan-hover           { background-color: #2e2519; }
.btn-terracotta.btn-pan-hover::before   { background-color: var(--terracotta); }

/* CTA vibrate animation */
@keyframes ctaVibrate {
    0%, 88%, 100% { transform: translateX(0); }
    90%           { transform: translateX(-2px); }
    92%           { transform: translateX(2px); }
    94%           { transform: translateX(-2px); }
    96%           { transform: translateX(2px); }
    98%           { transform: translateX(0); }
}

.cta-vibrate {
    animation: ctaVibrate 5s ease-in-out infinite;
    will-change: transform;
}

/* ==========================================================================
   Scroll Animations
   ========================================================================== */
.fade-in,
.js-reveal {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.8s ease, transform 0.8s ease;
    will-change: opacity, transform;
}
.fade-in.visible,
.js-reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.stagger-1 { transition-delay: 0.1s; }
.stagger-2 { transition-delay: 0.2s; }
.stagger-3 { transition-delay: 0.3s; }
.stagger-4 { transition-delay: 0.4s; }
.stagger-5 { transition-delay: 0.5s; }
.stagger-6 { transition-delay: 0.6s; }

@keyframes heroZoom {
    0%, 100% { transform: scale(1); }
    50%       { transform: scale(1.08); }
}

/* ==========================================================================
   Header & Navigation
   ========================================================================== */
.header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    padding: 20px 0;
    transition: background-color 0.4s ease, backdrop-filter 0.4s ease, padding 0.4s ease;
}

@media (min-width: 769px) {
    .header { position: absolute; }
}

.header.scrolled {
    background-color: rgba(23, 59, 48, 0.96);
    backdrop-filter: blur(8px);
    padding: 12px 0;
}

.header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo img {
    width: 120px;
    height: auto;
    transition: width 0.3s ease;
}

.nav-menu {
    display: flex;
    align-items: center;
}

.nav-list {
    display: flex;
    gap: 28px;
    align-items: center;
}

.nav-link {
    color: var(--white);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 4px;
    position: relative;
}

.nav-link.active::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: var(--white);
}

/* Mobile enquire button: hidden by default */
.mobile-enquire {
    display: none;
}

.hamburger {
    display: none;
    background: transparent;
    border: none;
    cursor: pointer;
    width: 24px;
    height: 20px;
    flex-direction: column;
    justify-content: space-between;
}

.hamburger span {
    display: block;
    width: 100%;
    height: 2px;
    background-color: var(--white);
    transition: var(--transition);
}

/* ==========================================================================
   Hero Section (Homepage)
   ========================================================================== */
.hero {
    position: relative;
    height: 620px;
    display: flex;
    align-items: center;
    overflow: hidden;
}

.hero-bg-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -2;
}

.hero-bg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    animation: heroZoom 12s ease-in-out infinite;
    transform-origin: center center;
}

.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to right, rgba(26, 28, 30, 0.65) 0%, rgba(26, 28, 30, 0.2) 100%);
    z-index: -1;
}

.hero-container {
    position: relative;
    width: 100%;
    padding-left: 15%;
}

.hero-content {
    max-width: 620px;
}

.hero-title {
    color: var(--white);
    font-size: 72px;
    line-height: 0.95;
    margin-bottom: 24px;
}

.hero-desc {
    color: var(--white);
    font-size: 17px;
    margin-bottom: 36px;
    line-height: 1.6;
}

.hero-buttons {
    display: flex;
    gap: 16px;
}

/* ==========================================================================
   Business Accommodation Made Simple Section
   ========================================================================== */
.business-simple {
    background-color: var(--cream);
    position: relative;
    z-index: 10;
}

.business-simple__top {
    display: flex;
    flex-direction: column;
    gap: 40px;
    margin-bottom: 50px;
}

.business-simple__media video,
.business-simple__video {
    width: 100%;
    height: auto;
    object-fit: cover;
    max-height: 600px;
    display: block;
}

.business-simple__image-hover {
    transition: transform 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55),
                box-shadow 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55),
                filter 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.business-simple__image-hover:hover,
.business-simple__image-hover:focus-visible {
    transform: scale(1.02);
    box-shadow: 0 0 30px rgba(0, 0, 0, 0.25);
    filter: brightness(1.15);
}

/* Stay Summary Card */
.stay-summary-float-wrapper {
    display: block;
    width: min(100%, 380px);
    margin-top: 30px;
}

.stay-summary-inline-wrapper {
    clear: both;
}

.stay-summary {
    background-color: var(--forest);
    color: var(--white);
    padding: 20px 22px;
    border-radius: var(--radius-md);
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.16);
    border: 1px solid rgba(218, 223, 215, 0.18);
    border-top: 4px solid var(--gold);
    width: 100%;
    animation: staySummaryFloat 4.8s ease-in-out infinite;
    will-change: transform, box-shadow;
}

@keyframes staySummaryFloat {
    0%   { transform: translateY(0) rotate(0deg);     box-shadow: 0 20px 50px rgba(0,0,0,0.15); }
    25%  { transform: translateY(-5px) rotate(-0.3deg);  box-shadow: 0 24px 56px rgba(0,0,0,0.18); }
    50%  { transform: translateY(-9px) rotate(0.3deg);   box-shadow: 0 30px 66px rgba(0,0,0,0.22); }
    75%  { transform: translateY(-4px) rotate(-0.15deg); box-shadow: 0 24px 56px rgba(0,0,0,0.18); }
    100% { transform: translateY(0) rotate(0deg);     box-shadow: 0 20px 50px rgba(0,0,0,0.15); }
}

.summary-title {
    font-size: 11px;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 16px;
    font-weight: 700;
    color: var(--white);
}

.summary-rows {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 16px;
}

.summary-row {
    display: flex;
    justify-content: space-between;
    font-size: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
.summary-row:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.summary-label {
    color: rgba(255, 255, 255, 0.75);
    font-weight: 500;
}

.summary-value {
    font-weight: 600;
    text-align: right;
    max-width: 60%;
}

.summary-footer {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1px;
    color: var(--white);
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    padding-top: 12px;
}

/* Process Steps */
.business-simple__bottom {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.business-simple__step {
    background: var(--white);
    border: 1px solid var(--light-border);
    padding: 36px 24px;
    border-radius: var(--radius-lg);
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    outline: none;
}
.business-simple__step:hover,
.business-simple__step:focus,
.business-simple__step.is-active {
    border-color: var(--terracotta);
    box-shadow: 0 12px 30px rgba(65, 53, 37, 0.1);
    transform: translateY(-4px);
}

.step-icon {
    width: 64px;
    height: 64px;
    background-color: var(--cream);
    color: var(--olive);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    transition: all 0.4s ease;
}
.business-simple__step.is-active .step-icon {
    background-color: var(--olive);
    color: var(--white);
    animation: pulseGlow 2s infinite;
}

@keyframes pulseGlow {
    0%   { box-shadow: 0 0 0 0 rgba(92, 109, 81, 0.35); }
    70%  { box-shadow: 0 0 0 15px rgba(92, 109, 81, 0); }
    100% { box-shadow: 0 0 0 0 rgba(92, 109, 81, 0); }
}

.step-number {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 1.5px;
    color: var(--terracotta);
    margin-bottom: 8px;
}

.step-title {
    font-family: var(--font-sans);
    font-size: 18px;
    font-weight: 700;
    color: var(--dark);
    margin-bottom: 12px;
    line-height: 1.3;
}

.step-desc {
    font-size: 15px;
    color: var(--grey);
    font-weight: 500;
    line-height: 1.5;
}

.business-simple__actions {
    display: flex;
    gap: 16px;
    justify-content: center;
    margin-top: 10px;
}

/* Business Simple Responsive */
@media (max-width: 767px) {
    .business-simple__steps {
        display: flex;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        gap: 16px;
        padding-bottom: 24px;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .business-simple__steps::-webkit-scrollbar { display: none; }
    .business-simple__step {
        flex: 0 0 85%;
        scroll-snap-align: center;
    }
    .business-simple__actions {
        flex-direction: column;
    }
    .business-simple__actions .btn {
        width: 100%;
    }
    .stay-summary-float-wrapper {
        width: 100%;
        max-width: 420px;
        margin: 24px auto 0;
    }
    .stay-summary {
        padding: 18px;
        animation: none;
    }
    .summary-row {
        gap: 12px;
    }
}

@media (min-width: 768px) and (max-width: 1023px) {
    .business-simple__steps {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 24px;
    }
}

@media (min-width: 1024px) {
    .business-simple__top {
        display: grid;
        grid-template-columns: 1fr 1.2fr;
        gap: 60px;
        align-items: start;
        margin-bottom: 80px;
    }
    .business-simple__intro {
        padding-top: 40px;
        max-width: 430px;
    }
    .business-simple__intro .body-text {
        max-width: 420px;
    }
    .business-simple__media {
        display: flex;
        justify-content: flex-end;
        position: relative;
    }
    .business-simple__image-card {
        max-width: 540px;
        margin-left: auto;
    }
    .stay-summary-float-wrapper {
        position: static;
        width: min(100%, 370px);
        margin-top: 32px;
    }
    .business-simple__steps {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 24px;
    }
}

/* ==========================================================================
   Home From Home Section (Homepage)
   ========================================================================== */
.home-from-home {
    background-color: var(--cream);
    overflow: hidden;
}

.hfh-layout {
    display: flex;
    gap: 60px;
    align-items: center;
}

.hfh-content {
    flex: 0 0 45%;
}

.hfh-media {
    flex: 0 0 45%;
    margin-left: auto;
    position: relative;
    padding-top: 0;
    padding-right: 0;
    isolation: isolate;
}

.hfh-top-label {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
    color: var(--terracotta);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.hfh-title {
    font-size: 44px;
    line-height: 1.1;
    color: var(--dark);
    margin-bottom: 0;
}

.hfh-divider {
    display: flex;
    align-items: center;
    gap: 16px;
    margin: 32px 0;
    opacity: 0.5;
}

.hfh-line {
    height: 1px;
    background-color: var(--light-border);
    flex-grow: 1;
}

.hfh-text-content .body-text {
    font-size: 16px;
    color: var(--dark);
    margin-bottom: 16px;
}

.hfh-benefits {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin: 40px 0;
}

.hfh-benefit {
    text-align: center;
}

.hfh-icon-wrapper {
    margin-bottom: 12px;
    color: var(--terracotta);
    display: flex;
    justify-content: center;
}

.hfh-benefit-title {
    font-size: 11px;
    font-weight: 700;
    margin-bottom: 6px;
    color: var(--dark);
}

.hfh-benefit-desc {
    font-size: 11px;
    color: var(--grey);
    line-height: 1.4;
}

.hfh-actions {
    display: flex;
    align-items: center;
    gap: 24px;
}

.hfh-text-link {
    display: inline-flex;
    align-items: center;
    font-size: 13px;
    font-weight: 600;
    color: var(--olive);
    padding-bottom: 2px;
    border-bottom: 1px solid var(--light-border);
    transition: var(--transition);
}
.hfh-text-link:hover {
    border-bottom-color: var(--terracotta);
    color: var(--terracotta);
}
.hfh-text-link svg {
    margin-left: 6px;
    transition: transform 0.3s ease;
}
.hfh-text-link:hover svg {
    transform: translateX(4px);
}

/* House-shaped frame for HFH image */
.hfh-arch-stroke {
    position: absolute;
    top: 0;
    left: -35px;
    right: 0;
    bottom: 10px;
    border: none;
    border-radius: 40px;
    background: var(--beige);
    opacity: 0.45;
    z-index: 0;
    pointer-events: none;
}
.hfh-arch-stroke::after {
    content: "";
    position: absolute;
    inset: 2px;
    background: var(--cream);
    border-radius: 38px;
}

.hfh-image-inner {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 600px;
    overflow: hidden;
    border-radius: 40px;
    margin-top: 0;
}

@keyframes hfhSlowZoom {
    0%, 100% { transform: scale(1); }
    50%       { transform: scale(1.08); }
}

.hfh-image-inner img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transform-origin: center center;
    animation: hfhSlowZoom 16s ease-in-out infinite;
    will-change: transform;
}

.hfh-image-inner::after {
    content: none;
}

.hfh-image-card {
    width: 100%;
}

.hfh-image-card .hfh-badge {
    right: 0;
}

.hfh-badge {
    position: absolute;
    bottom: -10px;
    right: 0;
    width: 220px;
    padding: 42px 30px;
    background-color: var(--cream);
    border-radius: 150px 150px 0 0;
    z-index: 3;
    text-align: center;
    box-shadow: 0 -10px 40px rgba(0, 0, 0, 0.04);
}

.hfh-badge-icon {
    margin-bottom: 16px;
}

.hfh-badge-text {
    font-size: 15px;
    color: var(--dark);
    line-height: 1.4;
}
.hfh-badge-text .italic-serif {
    font-family: var(--font-serif);
    font-style: italic;
    font-weight: 500;
    display: block;
    margin-top: 4px;
}

/* ==========================================================================
   Luxury Curated Section (Homepage)
   ========================================================================== */
.luxury-curated {
    background-color: var(--cream);
}

.luxury-layout {
    display: flex;
    gap: 60px;
    align-items: center;
}

.luxury-media {
    flex: 0 0 45%;
}

.luxury-content {
    flex: 0 0 55%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.luxury-card-outer,
.media-card-frame {
    border: 1px solid var(--beige);
    border-radius: 60px;
    padding: 32px;
    position: relative;
    width: 100%;
}

.luxury-image-inner,
.media-card-frame__inner {
    position: relative;
    border-radius: 40px;
    overflow: hidden;
    height: 600px;
    width: 100%;
}

.luxury-image-slider {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.luxury-slide {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transition: opacity 1.2s ease-in-out;
    z-index: 1;
}
.luxury-slide.is-active {
    opacity: 1;
}

.luxury-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(to top, rgba(26, 28, 30, 0.88) 0%, rgba(26, 28, 30, 0.3) 60%, transparent 100%);
    padding: 60px 30px 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    z-index: 2;
}

.luxury-label {
    color: var(--white);
    font-size: 11px;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    font-weight: 600;
}

.luxury-divider-small {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 16px 0 24px;
    color: var(--white);
    width: 160px;
}

.luxury-line-small {
    height: 1px;
    background-color: rgba(255, 255, 255, 0.35);
    flex-grow: 1;
}

@keyframes luxuryButtonShake {
    0%, 88%, 100% { transform: translateX(0); }
    90%           { transform: translateX(-3px); }
    92%           { transform: translateX(3px); }
    94%           { transform: translateX(-3px); }
    96%           { transform: translateX(3px); }
    98%           { transform: translateX(0); }
}

.luxury-btn-white {
    background-color: var(--cream);
    color: var(--olive);
    border-radius: 4px;
    padding: 15px 36px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    width: 100%;
    max-width: 260px;
    animation: luxuryButtonShake 4s ease-in-out infinite;
    will-change: transform;
}
.luxury-btn-white:hover,
.luxury-btn-white:focus-visible {
    background-color: var(--white);
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
    animation-play-state: paused;
}

.luxury-title {
    font-size: 52px;
    line-height: 1.1;
    margin-bottom: 24px;
    color: var(--dark);
}

.luxury-divider {
    display: flex;
    align-items: center;
    gap: 16px;
    margin: 0 auto 32px;
    width: 50%;
    color: var(--terracotta);
    opacity: 0.7;
}

.luxury-line {
    height: 1px;
    background-color: var(--light-border);
    flex-grow: 1;
}

.luxury-text .body-text {
    font-size: 16px;
    color: var(--dark);
    margin-bottom: 24px;
    line-height: 1.7;
    max-width: 580px;
    margin-left: auto;
    margin-right: auto;
}

.luxury-contact-btn {
    margin-top: 16px;
}

/* ==========================================================================
   Footer
   ========================================================================== */
.footer {
    padding: 60px 0 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.footer-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1.5fr 1.5fr;
    gap: 40px;
    padding-bottom: 40px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.footer-logo {
    width: 110px;
    margin-bottom: 20px;
}

.footer-desc {
    font-size: 14px;
    opacity: 0.85;
    margin-bottom: 24px;
    max-width: 250px;
    line-height: 1.6;
}

.social-links {
    display: flex;
    gap: 16px;
}
.social-links a {
    color: var(--white);
    opacity: 0.7;
}
.social-links a:hover {
    opacity: 1;
}

.footer-heading {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 700;
    margin-bottom: 20px;
    color: var(--white);
}

.footer-links li,
.footer-contact li {
    font-size: 14px;
    opacity: 0.85;
    margin-bottom: 12px;
}

.footer-links a:hover {
    opacity: 1;
    text-decoration: underline;
}

.footer-text {
    font-size: 14px;
    opacity: 0.85;
    margin-bottom: 20px;
}

.footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 20px;
    font-size: 13px;
    opacity: 0.65;
}

.footer-legal a {
    margin: 0 5px;
}
.footer-legal a:hover {
    color: var(--white);
    opacity: 1;
}

/* ==========================================================================
   Global Responsive — Tablet (max 1023px)
   ========================================================================== */
@media (max-width: 1023px) {
    .logo img         { width: 100px; }
    .hero-title       { font-size: 56px; }
    .footer-grid      { grid-template-columns: repeat(2, 1fr); }

    .hfh-layout       { flex-direction: column; gap: 60px; }
    .hfh-content,
    .hfh-media        { flex: 0 0 100%; width: 100%; }
    .hfh-media        { max-width: 540px; margin: 0 auto; padding-right: 0; }
    .hfh-arch-stroke  { display: none; }
    .hfh-image-inner  { height: 500px; }
    .business-simple__image-card { max-width: 540px; margin: 0 auto; }

    .luxury-layout    { flex-direction: column; gap: 60px; }
    .luxury-media,
    .luxury-content   { flex: 0 0 100%; width: 100%; }
    .luxury-media     { max-width: 540px; margin: 0 auto; }
    .luxury-title     { font-size: 46px; }
}

/* ==========================================================================
   Global Responsive — Mobile (max 768px)
   ========================================================================== */
@media (max-width: 768px) {
    .logo img         { width: 84px; }
    .section-padding  { padding: var(--section-padding-mob); }
    .section-title    { font-size: 38px; }
    .desktop-only     { display: none; }

    /* Navigation */
    .nav-list {
        display: none;
        flex-direction: column;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background-color: rgba(23, 59, 48, 0.98);
        padding: 20px;
        text-align: center;
        gap: 20px;
    }
    .nav-list.active    { display: flex; }
    .hamburger          { display: flex; }
    .desktop-enquire    { display: none; }
    .mobile-enquire     { display: none; } /* Keep hidden on mobile */
    .header             { padding: 16px 0; }

    /* Hero */
    .hero             { height: 600px; }
    .hero-container   { padding-left: 20px; padding-right: 20px; }
    .hero-title       { font-size: 40px; }

    /* HFH section */
    .hfh-benefits     { grid-template-columns: repeat(2, 1fr); gap: 24px; }
    .hfh-title        { font-size: 36px; }
    .hfh-image-inner  { height: 500px; margin-top: 0; }
    .hfh-arch-stroke  { display: none; }
    .hfh-badge        { width: 185px; padding: 30px 20px; right: 10px; bottom: -5px; }
    .hfh-badge-text   { font-size: 14px; }

    /* Luxury */
    .luxury-title       { font-size: 36px; }
    .luxury-image-inner,
    .media-card-frame__inner { height: 500px; }
    .luxury-divider     { width: 80%; }

    /* Footer */
    .footer-grid        { grid-template-columns: 1fr; gap: 30px; }
    .footer-bottom      { flex-direction: column; gap: 12px; text-align: center; }
    .footer-enquire-btn { padding: 12px 16px !important; font-size: 11px !important; width: auto !important; }
}

/* ==========================================================================
   Global Responsive — Small Mobile (max 520px)
   ========================================================================== */
@media (max-width: 520px) {
    .logo img         { width: 72px; }
    .hero-title       { font-size: 36px; }
    .hero-buttons     { flex-direction: column; gap: 12px; }
    .hero-buttons .btn { width: 100%; }
    .section-title    { font-size: 32px; }

    .stay-summary {
        padding: 16px;
    }
    .summary-title {
        margin-bottom: 14px;
    }
    .summary-row {
        display: block;
        font-size: 11px;
    }
    .summary-value {
        display: block;
        max-width: 100%;
        text-align: left;
        margin-top: 2px;
    }

    .hfh-actions      { flex-direction: column; align-items: flex-start; gap: 16px; }
    .hfh-media        { padding-right: 0; margin-top: 20px; }
    .hfh-arch-stroke  { display: none; }
    .hfh-image-inner  {
        height: 420px;
        border-radius: 28px;
    }
    .hfh-badge        { position: relative; bottom: auto; right: auto; margin: -45px auto 0; border-radius: 120px 120px 0 0; }

    .luxury-card-outer,
    .media-card-frame  { border-radius: 40px; padding: 16px; }
    .luxury-image-inner,
    .media-card-frame__inner { border-radius: 28px; height: 420px; }
    .luxury-overlay     { padding: 40px 20px 20px; }
}

/* ==========================================================================
   Reduced Motion
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
    *, ::before, ::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }

    .hero-bg,
    .hfh-image-inner img {
        animation: none !important;
        transform: none !important;
    }

    .js-reveal,
    .fade-in {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }

    .luxury-slide         { transition: none !important; }
    .luxury-btn-white     { animation: none !important; }
    .stay-summary         { animation: none !important; transform: none !important; }
    .cta-vibrate          { animation: none !important; }

    .btn-pan-hover,
    .btn-pan-hover::before,
    .business-simple__image-hover {
        transition: none !important;
    }
    .btn-pan-hover:hover::before,
    .btn-pan-hover:focus-visible::before,
    .business-simple__image-hover:hover,
    .business-simple__image-hover:focus-visible {
        transform: none !important;
        box-shadow: none !important;
    }

    .business-simple__step.is-active .step-icon { animation: none !important; }
}

/* ==========================================================================
   STAY WITH US PAGE
   ========================================================================== */

/* Page & Header */
.staywithus-page {
    background-color: var(--cream);
}
.staywithus-page .header:not(.scrolled) .nav-link              { color: var(--dark); }
.staywithus-page .header:not(.scrolled) .nav-link.active::after { background-color: var(--terracotta); }
.staywithus-page .header:not(.scrolled) .hamburger span        { background-color: var(--dark); }
.staywithus-page .header:not(.scrolled) .logo img              { filter: brightness(0.2); }
.staywithus-page .header.scrolled .logo img                    { filter: none; }

/* Hero V2 */
.staywithus-hero-v2 {
    display: flex;
    align-items: center;
    min-height: 600px;
    position: relative;
    background-color: var(--cream);
    overflow: hidden;
    padding-top: 80px;
}

.staywithus-hero-botanical {
    display: none !important;
}

.staywithus-hero-split {
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    position: relative;
    z-index: 2;
}

.staywithus-hero-content-v2 {
    flex: 0 0 50%;
    padding-left: max(24px, calc((100vw - var(--max-width)) / 2 + 24px));
    padding-right: 60px;
    position: relative;
    z-index: 3;
}

.staywithus-label-v2 {
    display: block;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 24px;
}

.staywithus-title-v2 {
    font-size: clamp(52px, 6vw, 72px);
    line-height: 1;
    color: var(--dark);
    margin-bottom: 12px;
}

.staywithus-subtitle-v2 {
    font-size: clamp(32px, 3.5vw, 42px);
    line-height: 1.1;
    margin-bottom: 24px;
    font-style: italic;
}

.staywithus-hero-divider {
    width: 24px;
    height: 1px;
    background-color: var(--terracotta);
    margin-bottom: 24px;
    opacity: 0.6;
}

.staywithus-desc-v2 {
    font-size: 16px;
    max-width: 480px;
    margin-bottom: 40px;
    line-height: 1.7;
}

.staywithus-hero-btn {
    padding: 16px 32px;
}

.staywithus-hero-media-v2 {
    position: absolute;
    top: 0;
    right: 0;
    width: 55%;
    height: 100%;
    z-index: 1;
}
.staywithus-hero-media-v2::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 45%;
    height: 100%;
    background: linear-gradient(to right, var(--cream) 0%, rgba(246, 241, 232, 0) 100%);
    z-index: 2;
}
.staywithus-hero-media-v2 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center left;
}

/* Paths section V2 */
.staywithus-paths-v2 {
    background-color: var(--cream);
    padding-top: 40px;
    position: relative;
    z-index: 4;
}

.staywithus-section-header-v2 {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin-bottom: 60px;
}

.staywithus-heading-v2 {
    font-size: 20px;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-weight: 700;
    margin: 0;
    color: var(--dark);
}

.staywithus-line-v2 {
    height: 1px;
    width: 60px;
    background-color: var(--terracotta);
    opacity: 0.4;
}

.staywithus-diamond {
    width: 8px;
    height: 8px;
    border: 1px solid var(--terracotta);
    transform: rotate(45deg);
    opacity: 0.4;
}

.staywithus-cards-grid-v2 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-bottom: 60px;
}

/* House-frame Card V2 (cloned from Meet The Team house-frame system) */
.staywithus-card-v2 {
    /* Roof height for the house-shaped clip-path (mirrors --team-roof-height) */
    --stay-card-roof-height: 60px;
    position: relative;
    background-color: transparent;
    padding-top: 30px;
    cursor: pointer;
    outline: none;
    transition: transform 0.4s ease, box-shadow 0.4s ease;
}

/* Whole-card clickable overlay (mouse); the visible button remains the accessible CTA.
   Sits behind the (pointer-events:none) card-inner so clicks fall through to this link,
   while the button re-enables pointer-events to act as its own CTA. */
.staywithus-card-cover {
    position: absolute;
    top: 30px;            /* align to the top of .staywithus-card-inner (card padding-top) */
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    border-radius: 0;
    -webkit-clip-path: polygon(50% 0, 100% var(--stay-card-roof-height), 100% 100%, 0 100%, 0 var(--stay-card-roof-height));
    clip-path: polygon(50% 0, 100% var(--stay-card-roof-height), 100% 100%, 0 100%, 0 var(--stay-card-roof-height));
}

/* House frame: transparent box with two clipped pseudo-elements
   (::before = outer border colour, ::after = cream inner fill) */
.staywithus-card-inner {
    position: relative;
    isolation: isolate;
    overflow: visible;
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 16px 16px 30px;
    display: flex;
    flex-direction: column;
    height: 100%;
    pointer-events: none;            /* let clicks pass through to .staywithus-card-cover */
    transition: filter 0.4s ease;
}

.staywithus-card-inner::before {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--beige);        /* outer border colour */
    pointer-events: none;
    z-index: 0;
    transition: background 0.4s ease;
    -webkit-clip-path: polygon(50% 0, 100% var(--stay-card-roof-height), 100% 100%, 0 100%, 0 var(--stay-card-roof-height));
    clip-path: polygon(50% 0, 100% var(--stay-card-roof-height), 100% 100%, 0 100%, 0 var(--stay-card-roof-height));
}

.staywithus-card-inner::after {
    content: "";
    position: absolute;
    inset: 1px;                      /* 1px reveal of ::before = the border */
    background: var(--cream);        /* cream inner fill */
    pointer-events: none;
    z-index: 1;
    -webkit-clip-path: polygon(50% 0, 100% var(--stay-card-roof-height), 100% 100%, 0 100%, 0 var(--stay-card-roof-height));
    clip-path: polygon(50% 0, 100% var(--stay-card-roof-height), 100% 100%, 0 100%, 0 var(--stay-card-roof-height));
}

/* Real content sits above the pseudo-element fills */
.staywithus-card-inner > * {
    position: relative;
    z-index: 2;
}

.staywithus-card-img-wrap-v2 {
    position: relative;
    height: 240px;
    overflow: hidden;
    margin-bottom: 30px;
    border-radius: 0;
    /* Image follows the same roof shape and cannot overflow it */
    -webkit-clip-path: polygon(50% 0, 100% var(--stay-card-roof-height), 100% 100%, 0 100%, 0 var(--stay-card-roof-height));
    clip-path: polygon(50% 0, 100% var(--stay-card-roof-height), 100% 100%, 0 100%, 0 var(--stay-card-roof-height));
}

.staywithus-card-img-v2 {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 0;
    transition: transform 0.8s ease;
}

.staywithus-card-icon-v2 {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 64px;
    height: 64px;
    background-color: var(--olive);
    color: var(--white);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 6px solid var(--cream);
    z-index: 5;
    transition: box-shadow 0.4s ease;
}

.staywithus-card-content-v2 {
    padding: 0 16px;
    text-align: center;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    align-items: center;
}

.staywithus-card-title-v2 {
    font-size: 26px;
    margin-bottom: 8px;
    color: var(--dark);
}

.staywithus-card-subtitle-v2 {
    display: block;
    font-size: 10px;
    letter-spacing: 1px;
    color: var(--terracotta);
    font-weight: 700;
    margin-bottom: 16px;
}

.staywithus-card-tinyline {
    width: 30px;
    height: 1px;
    background-color: var(--light-border);
    margin: 0 auto 20px;
}

.staywithus-card-desc-v2 {
    font-size: 14px;
    color: var(--dark);
    margin-bottom: 32px;
    line-height: 1.6;
}

.staywithus-card-btn-v2 {
    margin-top: auto;
    font-size: 10px;
    padding: 16px 20px;
    position: relative;
    z-index: 2;
    pointer-events: auto;   /* re-enable clicks so the button is its own CTA */
}

/* Card interaction states */
.staywithus-card-v2:hover,
.staywithus-card-v2:focus-visible,
.staywithus-card-v2.is-active {
    transform: translateY(-8px);
}
/* Hover border colour change now drives the ::before of the house frame,
   and the lift shadow follows the house silhouette via drop-shadow. */
.staywithus-card-v2:hover .staywithus-card-inner,
.staywithus-card-v2:focus-visible .staywithus-card-inner,
.staywithus-card-v2.is-active .staywithus-card-inner {
    filter: drop-shadow(0 15px 28px rgba(65, 53, 37, 0.12));
}
.staywithus-card-v2:hover .staywithus-card-inner::before,
.staywithus-card-v2:focus-visible .staywithus-card-inner::before,
.staywithus-card-v2.is-active .staywithus-card-inner::before {
    background: var(--terracotta);
}
.staywithus-card-v2:hover .staywithus-card-img-v2,
.staywithus-card-v2:focus-visible .staywithus-card-img-v2,
.staywithus-card-v2.is-active .staywithus-card-img-v2 {
    transform: scale(1.06);
}
.staywithus-card-v2.is-active .staywithus-card-icon-v2 {
    animation: pulseOliveGlow 1.5s infinite;
}

@keyframes pulseOliveGlow {
    0%   { box-shadow: 0 0 0 0 rgba(92, 109, 81, 0.3); }
    70%  { box-shadow: 0 0 0 12px rgba(92, 109, 81, 0); }
    100% { box-shadow: 0 0 0 0 rgba(92, 109, 81, 0); }
}

/* Stay With Us — old hero (non-V2, kept for safety) */
.staywithus-hero {
    position: relative;
    padding-top: 160px;
    padding-bottom: 80px;
    min-height: 80vh;
    display: flex;
    align-items: center;
}
.staywithus-hero-bg {
    position: absolute;
    top: 0;
    right: 0;
    width: 60%;
    height: 100%;
    z-index: -1;
}
.staywithus-hero-img { width: 100%; height: 100%; object-fit: cover; }
.staywithus-hero-gradient {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(to right, var(--cream) 0%, var(--cream) 15%, transparent 100%);
}
.staywithus-hero-content { max-width: 550px; position: relative; z-index: 2; }
.staywithus-label {
    display: block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 24px;
    position: relative;
    padding-right: 40px;
}
.staywithus-label::after {
    content: '';
    position: absolute;
    right: 140px;
    top: 50%;
    width: 80px;
    height: 1px;
    background-color: var(--terracotta);
    opacity: 0.5;
}
.staywithus-title-group { margin-bottom: 24px; }
.staywithus-title       { font-size: 64px; line-height: 1; color: var(--dark); margin-bottom: 8px; }
.staywithus-subtitle    { font-size: 42px; line-height: 1.1; }
.staywithus-desc        { font-size: 17px; max-width: 480px; }

/* Cards section (V1, kept) */
.staywithus-paths { background-color: var(--cream); padding-top: 40px; }
.staywithus-section-header {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin-bottom: 48px;
}
.staywithus-heading {
    font-size: 12px;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-weight: 700;
    margin: 0;
}
.staywithus-line {
    height: 1px;
    width: 80px;
    background-color: var(--terracotta);
    opacity: 0.4;
}
.staywithus-cards-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-bottom: 60px;
}
.staywithus-card {
    background-color: #f5f2ed;
    border: 1px solid var(--light-border);
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    position: relative;
    transition: transform 0.4s ease, box-shadow 0.4s ease;
}
.staywithus-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-md);
}
.staywithus-card-img-wrap {
    height: 220px;
    border-radius: 20px 20px 0 0;
    overflow: hidden;
}
.staywithus-card-img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s ease; }
.staywithus-card:hover .staywithus-card-img { transform: scale(1.05); }
.staywithus-card-icon {
    position: absolute;
    top: 220px;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 56px;
    height: 56px;
    background-color: var(--olive);
    color: var(--white);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 4px solid #f5f2ed;
    z-index: 5;
}
.staywithus-card-content {
    padding: 50px 30px 40px;
    text-align: center;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    align-items: center;
}
.staywithus-card-title    { font-size: 24px; margin-bottom: 4px; }
.staywithus-card-subtitle { display: block; font-size: 16px; margin-bottom: 16px; }
.staywithus-card-desc     { font-size: 14px; color: var(--dark); margin-bottom: 30px; line-height: 1.6; }
.staywithus-card-btn      { margin-top: auto; font-size: 11px; padding: 14px 24px; width: 100%; max-width: 240px; }

/* Benefits strip */
.staywithus-benefits {
    background-color: #f5f2ed;
    border: 1px solid var(--light-border);
    border-radius: 20px;
    padding: 40px 20px;
    display: flex;
    justify-content: space-between;
}
.staywithus-benefit-item {
    flex: 1;
    text-align: center;
    position: relative;
    padding: 0 20px;
}
.staywithus-benefit-item:not(:last-child)::after {
    content: '';
    position: absolute;
    right: 0;
    top: 10%;
    height: 80%;
    width: 1px;
    background-color: var(--light-border);
}
.staywithus-benefit-icon  { color: var(--terracotta); display: flex; justify-content: center; margin-bottom: 16px; }
.staywithus-benefit-title { font-size: 11px; font-weight: 700; letter-spacing: 1.5px; margin-bottom: 8px; color: var(--dark); }
.staywithus-benefit-desc  { font-size: 13px; color: var(--grey); line-height: 1.5; max-width: 200px; margin: 0 auto; }

/* Stay With Us Responsive */
@media (max-width: 1100px) {
    .staywithus-hero-content-v2 { padding-right: 40px; }
    .staywithus-card-content-v2 { padding: 0 8px; }
}

@media (max-width: 1023px) {
    .staywithus-hero-v2          { min-height: 600px; display: block; }
    .staywithus-hero-split       { flex-direction: column; }
    .staywithus-hero-content-v2  { flex: 0 0 100%; width: 100%; padding: 100px 24px 60px; }
    .staywithus-hero-media-v2    { position: absolute; width: 100%; opacity: 0.15; z-index: 0; }
    .staywithus-hero-media-v2::before {
        background: linear-gradient(to bottom, var(--cream) 0%, rgba(246, 241, 232, 0) 100%);
    }
    .staywithus-cards-grid-v2    { grid-template-columns: repeat(2, 1fr); gap: 40px 30px; }

    .staywithus-hero-bg          { width: 100%; opacity: 0.3; }
    .staywithus-hero-gradient    { background: linear-gradient(to right, var(--cream) 0%, rgba(246,241,232,0.7) 100%); }
    .staywithus-label::after     { display: none; }
    .staywithus-cards-grid       { grid-template-columns: repeat(2, 1fr); }
    .staywithus-benefits         { flex-wrap: wrap; gap: 30px; }
    .staywithus-benefit-item     { flex: 0 0 50%; padding: 0; }
    .staywithus-benefit-item:nth-child(2)::after { display: none; }
    .staywithus-benefit-item::after { right: -15px; }
}

@media (max-width: 768px) {
    .staywithus-title-v2         { font-size: 48px; }
    .staywithus-subtitle-v2      { font-size: 28px; }
    .staywithus-cards-grid-v2    { grid-template-columns: 1fr; max-width: 440px; margin: 0 auto 60px; }

    .staywithus-hero             { padding-top: 120px; min-height: 60vh; }
    .staywithus-title            { font-size: 48px; }
    .staywithus-subtitle         { font-size: 32px; }
    .staywithus-cards-grid       { grid-template-columns: 1fr; }
    .staywithus-benefit-item     { flex: 0 0 100%; }
    .staywithus-benefit-item::after { display: none; }
}

/* Stay With Us — mobile portrait hero readability */
@media (max-width: 768px) and (orientation: portrait) {
    .staywithus-page .header:not(.scrolled) {
        background: rgba(246, 241, 232, 0.94);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
    }

    .staywithus-page .staywithus-hero-v2 {
        min-height: 100svh;
        padding: 105px 16px 44px;
        display: flex;
        align-items: center;
        background-color: var(--cream);
        overflow: hidden;
    }

    .staywithus-page .staywithus-hero-split {
        width: 100%;
        min-height: auto;
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative;
    }

    .staywithus-page .staywithus-hero-media-v2 {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        opacity: 1;
        z-index: 0;
    }

    .staywithus-page .staywithus-hero-media-v2::before {
        content: "";
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        z-index: 2;
        background: linear-gradient(
            to bottom,
            rgba(246, 241, 232, 0.94) 0%,
            rgba(246, 241, 232, 0.78) 42%,
            rgba(246, 241, 232, 0.96) 100%
        );
    }

    .staywithus-page .staywithus-hero-media-v2 img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center center;
        filter: saturate(0.95) contrast(0.92);
    }

    .staywithus-page .staywithus-hero-content-v2 {
        position: relative;
        z-index: 5;
        flex: none;
        width: 100%;
        max-width: 360px;
        margin: 0 auto;
        padding: 26px 20px 28px;
        background: rgba(246, 241, 232, 0.93);
        border: 1px solid rgba(255, 255, 255, 0.82);
        border-radius: 22px;
        box-shadow: 0 18px 45px rgba(0, 0, 0, 0.16);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
    }

    .staywithus-page .staywithus-label-v2 {
        font-size: 9px;
        line-height: 1.5;
        letter-spacing: 1.6px;
        margin-bottom: 14px;
        color: var(--terracotta);
    }

    .staywithus-page .staywithus-title-v2 {
        font-size: clamp(38px, 13vw, 48px);
        line-height: 0.98;
        margin-bottom: 10px;
        color: var(--dark);
        text-shadow: none;
    }

    .staywithus-page .staywithus-subtitle-v2 {
        font-size: clamp(22px, 7vw, 28px);
        line-height: 1.12;
        margin-bottom: 18px;
        color: var(--terracotta);
    }

    .staywithus-page .staywithus-hero-divider {
        width: 34px;
        margin-bottom: 18px;
        background-color: var(--terracotta);
        opacity: 0.7;
    }

    .staywithus-page .staywithus-desc-v2 {
        font-size: 15px;
        line-height: 1.65;
        max-width: 100%;
        margin-bottom: 24px;
        color: var(--dark);
        font-weight: 500;
    }

    .staywithus-page .staywithus-hero-btn {
        width: 100%;
        padding: 15px 18px;
        font-size: 15px;
        letter-spacing: 1.2px;
    }
}

/* Reduced motion for Stay With Us cards */
@media (prefers-reduced-motion: reduce) {
    .staywithus-card-v2 { transition: none !important; }
    .staywithus-card-v2:hover,
    .staywithus-card-v2:focus-visible,
    .staywithus-card-v2.is-active { transform: none !important; }
    .staywithus-card-v2.is-active .staywithus-card-icon-v2 {
        animation: none !important;
        box-shadow: 0 0 0 4px rgba(92, 109, 81, 0.2);
    }
    .staywithus-card-v2:hover .staywithus-card-img-v2,
    .staywithus-card-v2:focus-visible .staywithus-card-img-v2,
    .staywithus-card-v2.is-active .staywithus-card-img-v2 { transform: none !important; }
}

/* ==========================================================================
   ABOUT US PAGE
   ========================================================================== */

/* Page & Header */
.aboutus-page .header:not(.scrolled) .nav-link              { color: var(--dark); }
.aboutus-page .header:not(.scrolled) .nav-link.active::after { background-color: var(--terracotta); }
.aboutus-page .header:not(.scrolled) .hamburger span        { background-color: var(--dark); }
.aboutus-page .header:not(.scrolled) .logo img              { filter: brightness(0.2); }

/* Outline buttons specific to About Us */
.aboutus-page .btn-outline-dark {
    border: 1px solid var(--dark);
    color: var(--dark);
    background-color: transparent;
    transition: all 0.3s ease;
}
.aboutus-page .btn-outline-dark:hover,
.aboutus-page .btn-outline-dark:focus-visible {
    background-color: var(--dark);
    color: var(--white);
    transform: translateY(-2px);
}

.aboutus-page .btn-outline-white {
    border: 1px solid var(--white);
    color: var(--white);
    background-color: transparent;
    transition: all 0.3s ease;
}
.aboutus-page .btn-outline-white:hover,
.aboutus-page .btn-outline-white:focus-visible {
    background-color: var(--white);
    color: var(--forest);
    transform: translateY(-2px);
}

/* Hero */
.aboutus-page .about-hero {
    padding-top: 180px;
    padding-bottom: 80px;
    background-color: var(--cream);
    overflow: hidden;
}

.aboutus-page .about-hero-layout {
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: 60px;
    align-items: center;
    position: relative;
}

.aboutus-page .about-hero-content {
    padding-top: 32px;
}

.aboutus-page .hero-main-title {
    font-size: clamp(38px, 5vw, 56px);
    line-height: 1.1;
    margin-bottom: 24px;
}

.aboutus-page .hero-short-line {
    height: 1px;
    width: 60px;
    background-color: var(--terracotta);
    margin-bottom: 24px;
    opacity: 0.5;
}

/* About hero house-shaped frame
   Uses the same fixed-roof system as the Meet The Team cards so the roof
   angle stays consistent instead of changing with image proportions. */
.aboutus-page .about-hero-image-wrapper {
    --about-hero-roof-height: 156px;
    --about-hero-frame-padding: 14px;
    position: relative;
    width: min(100%, 590px);
    min-height: 560px;
    justify-self: end;
    isolation: isolate;
    padding: var(--about-hero-frame-padding);
    overflow: visible;
}
.aboutus-page .about-hero-image-wrapper::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background: rgba(92, 109, 81, 0.55);
    pointer-events: none;
    -webkit-clip-path: polygon(50% 0, 100% var(--about-hero-roof-height), 100% 100%, 0 100%, 0 var(--about-hero-roof-height));
    clip-path: polygon(50% 0, 100% var(--about-hero-roof-height), 100% 100%, 0 100%, 0 var(--about-hero-roof-height));
}
.aboutus-page .about-hero-image-wrapper::after {
    content: "";
    position: absolute;
    inset: 3px;
    z-index: 1;
    background: var(--cream);
    pointer-events: none;
    -webkit-clip-path: polygon(50% 0, 100% var(--about-hero-roof-height), 100% 100%, 0 100%, 0 var(--about-hero-roof-height));
    clip-path: polygon(50% 0, 100% var(--about-hero-roof-height), 100% 100%, 0 100%, 0 var(--about-hero-roof-height));
}

.aboutus-page .hero-arch-img {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 560px;
    object-fit: cover;
    object-position: center;
    border-radius: 0;
    box-shadow: none;
    -webkit-clip-path: polygon(50% 0, 100% var(--about-hero-roof-height), 100% 100%, 0 100%, 0 var(--about-hero-roof-height));
    clip-path: polygon(50% 0, 100% var(--about-hero-roof-height), 100% 100%, 0 100%, 0 var(--about-hero-roof-height));
    outline: none;
    outline-offset: 0;
}

.aboutus-page .hero-floating-card {
    position: absolute;
    z-index: 5;
    bottom: -22px;
    left: -34px;
    background: linear-gradient(135deg, var(--forest), #0f2a22);
    color: var(--white);
    padding: 30px 42px;
    border-radius: 22px;
    display: flex;
    align-items: center;
    gap: 16px;
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.18);
}

.aboutus-page .hero-floating-icon {
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.aboutus-page .hero-floating-icon svg { width: 20px; height: 20px; }

.aboutus-page .hero-floating-text {
    font-family: var(--font-serif);
    font-size: 16px;
    line-height: 1.4;
}

.aboutus-page .hero-floating-line {
    margin-top: 8px;
    height: 1px;
    width: 30px;
    background-color: var(--gold);
    opacity: 0.6;
}

.aboutus-page .hero-botanical-left {
    display: none;
}

/* Louise section */
.aboutus-page .about-louise {
    padding: 100px 0;
    background-color: var(--cream);
    overflow: hidden;
}

.aboutus-page .about-louise-layout {
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: 80px;
    align-items: center;
    position: relative;
}

/* Louise portrait house frame
   Reuses the same roof-shaped clip-path approach as the Meet The Team cards,
   replacing the previous arched/window style with a clean pitched-roof frame. */
.aboutus-page .louise-house-container,
.aboutus-page .louise-arch-container {
    --louise-roof-height: 96px;
    position: relative;
    width: min(430px, 100%);
    margin: 0 auto;
    padding: 14px 14px 18px;
    isolation: isolate;
    overflow: visible;
}

.aboutus-page .louise-house-container::before,
.aboutus-page .louise-arch-container::before {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--beige);
    pointer-events: none;
    z-index: 0;
    -webkit-clip-path: polygon(50% 0, 100% var(--louise-roof-height), 100% 100%, 0 100%, 0 var(--louise-roof-height));
    clip-path: polygon(50% 0, 100% var(--louise-roof-height), 100% 100%, 0 100%, 0 var(--louise-roof-height));
}

.aboutus-page .louise-house-container::after,
.aboutus-page .louise-arch-container::after {
    content: "";
    position: absolute;
    inset: 1px;
    background: var(--cream);
    pointer-events: none;
    z-index: 1;
    -webkit-clip-path: polygon(50% 0, 100% var(--louise-roof-height), 100% 100%, 0 100%, 0 var(--louise-roof-height));
    clip-path: polygon(50% 0, 100% var(--louise-roof-height), 100% 100%, 0 100%, 0 var(--louise-roof-height));
}

.aboutus-page .louise-house-container > *,
.aboutus-page .louise-arch-container > * {
    position: relative;
    z-index: 2;
}

.aboutus-page .louise-house-outline,
.aboutus-page .louise-arch-outline {
    display: none;
}

.aboutus-page .louise-img {
    width: 100%;
    height: 520px;
    object-fit: cover;
    object-position: center top;
    border-radius: 0;
    display: block;
    -webkit-clip-path: polygon(50% 0, 100% var(--louise-roof-height), 100% 100%, 0 100%, 0 var(--louise-roof-height));
    clip-path: polygon(50% 0, 100% var(--louise-roof-height), 100% 100%, 0 100%, 0 var(--louise-roof-height));
}

.aboutus-page .louise-leaf-card {
    position: absolute;
    top: 58%;
    left: -18px;
    transform: translateY(-50%);
    background-color: var(--terracotta);
    width: 80px;
    height: 120px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 5;
    box-shadow: var(--shadow-sm);
}
.aboutus-page .louise-leaf-card svg { width: 40px; height: 40px; }

.aboutus-page .louise-signature {
    font-family: 'Allura', 'Great Vibes', 'Brush Script MT', cursive, var(--font-serif);
    font-size: clamp(28px, 4vw, 36px);
    color: var(--terracotta);
    font-style: italic;
    margin-bottom: 32px;
}

.aboutus-page .louise-buttons {
    display: flex;
    gap: 16px;
    align-items: center;
}

.aboutus-page .louise-botanical-right { display: none; }

/* Our Story section */
.aboutus-page .about-story {
    background-color: var(--cream);
    padding: 100px 0;
}

.aboutus-page .story-header { margin-bottom: 60px; }

.aboutus-page .story-heading-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    margin-top: 16px;
}

.aboutus-page .story-heading-line {
    flex: 1;
    max-width: 80px;
    height: 1px;
    background-color: var(--dark);
    opacity: 0.15;
}

.aboutus-page .story-main-heading { font-size: clamp(32px, 4vw, 42px); margin: 0; }

.aboutus-page .story-cards-container {
    position: relative;
    max-width: 1000px;
    margin: 0 auto;
}

.aboutus-page .story-timeline-connector {
    position: absolute;
    top: 60px;
    left: 10%;
    right: 10%;
    border-top: 1px dashed var(--beige);
    z-index: 0;
}

.aboutus-page .story-cards-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    position: relative;
    z-index: 1;
}

.aboutus-page .story-card {
    background-color: var(--white);
    border: 1px solid var(--light-border);
    border-radius: 24px;
    padding: 40px 30px;
    position: relative;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.aboutus-page .story-card-badge {
    position: absolute;
    top: -16px;
    left: -16px;
    width: 36px;
    height: 36px;
    background-color: var(--forest);
    color: var(--white);
    font-size: 13px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
}

.aboutus-page .story-card-icon-wrap {
    width: 60px;
    height: 60px;
    background-color: #f5f2ed;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
    color: var(--terracotta);
}

.aboutus-page .story-card-title { font-size: 22px; margin-bottom: 16px; line-height: 1.3; }
.aboutus-page .story-card-text  { font-size: 16px; color: var(--dark); margin-bottom: 12px; line-height: 1.6; }
.aboutus-page .story-card-text:last-child { margin-bottom: 0; }

/* CTA Band */
.aboutus-page .about-cta-band { background-color: var(--forest); padding: 0; }
.aboutus-page .about-cta-band-inner {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 40px;
    align-items: center;
    padding: 0 24px;
}
.aboutus-page .cta-band-image img { width: 220px; height: 220px; object-fit: cover; display: block; }
.aboutus-page .cta-band-content  { color: var(--white); padding: 40px 0; }
.aboutus-page .cta-band-title    { font-size: clamp(28px, 3.5vw, 36px); color: var(--white); margin-bottom: 12px; }
.aboutus-page .cta-band-text     { font-size: 16px; opacity: 0.9; max-width: 500px; color: var(--white); margin-bottom: 0; }
.aboutus-page .cta-band-actions  { display: flex; flex-direction: column; gap: 12px; padding: 40px 0; }
.aboutus-page .cta-band-actions .btn { width: 100%; }

/* About Us Responsive */
@media (max-width: 1024px) {
    .aboutus-page .about-hero-layout,
    .aboutus-page .about-louise-layout { gap: 40px; }

    .aboutus-page .about-hero-image-wrapper {
        --about-hero-roof-height: 136px;
        width: min(100%, 540px);
        min-height: 500px;
    }
    .aboutus-page .hero-arch-img           { height: 500px; }
    .aboutus-page .hero-floating-card      { left: -10px; }

    .aboutus-page .story-cards-grid        { gap: 20px; }

    .aboutus-page .about-cta-band-inner {
        grid-template-columns: 1fr;
        text-align: center;
        gap: 20px;
        padding: 40px 24px;
    }
    .aboutus-page .cta-band-image img       { display: none; }
    .aboutus-page .cta-band-content         { padding: 0; }
    .aboutus-page .cta-band-actions         { flex-direction: row; justify-content: center; padding: 0; }
    .aboutus-page .cta-band-actions .btn    { width: auto; }
}

@media (max-width: 768px) {
    .aboutus-page .about-hero { padding-top: 120px; }
    .aboutus-page .about-hero-layout        { grid-template-columns: 1fr; }
    .aboutus-page .about-hero-content       { padding-top: 0; }

    .aboutus-page .about-hero-image-wrapper {
        --about-hero-roof-height: 96px;
        --about-hero-frame-padding: 10px;
        width: min(100%, 460px);
        min-height: 410px;
        justify-self: center;
    }
    .aboutus-page .about-hero-image-wrapper::before { inset: 0; }
    .aboutus-page .about-hero-image-wrapper::after  { inset: 3px; }
    .aboutus-page .hero-arch-img {
        height: 410px;
        outline-offset: 0;
    }
    .aboutus-page .hero-floating-card { left: 20px; right: 20px; bottom: -24px; padding: 24px; justify-content: center; }

    .aboutus-page .about-louise-layout      { grid-template-columns: 1fr; }
    .aboutus-page .louise-house-container,
    .aboutus-page .louise-arch-container    { --louise-roof-height: 82px; width: min(400px, 100%); padding: 12px; }
    .aboutus-page .louise-img               { height: 400px; }
    .aboutus-page .louise-leaf-card         { left: -10px; width: 70px; height: 104px; }
    .aboutus-page .louise-buttons           { flex-direction: column; width: 100%; }
    .aboutus-page .louise-buttons .btn      { width: 100%; }

    .aboutus-page .story-cards-grid         { grid-template-columns: 1fr; max-width: 400px; margin: 0 auto; }
    .aboutus-page .cta-band-actions         { flex-direction: column; }
    .aboutus-page .cta-band-actions .btn    { width: 100%; }
}

@media (max-width: 520px) {
    .aboutus-page .about-hero-image-wrapper {
        --about-hero-roof-height: 78px;
        min-height: 360px;
    }
    .aboutus-page .hero-arch-img            { height: 360px; }
    .aboutus-page .hero-floating-card {
        position: relative;
        left: auto;
        right: auto;
        bottom: auto;
        margin: -45px auto 0;
        width: 90%;
    }
    .aboutus-page .louise-house-container,
    .aboutus-page .louise-arch-container {
        --louise-roof-height: 70px;
        max-width: 340px;
        padding: 12px;
    }
    .aboutus-page .louise-img { height: 360px; }
    .aboutus-page .louise-leaf-card {
        top: 58%;
        left: -8px;
        width: 60px;
        height: 88px;
        border-radius: 8px;
    }
    .aboutus-page .louise-leaf-card svg { width: 32px; height: 32px; }
}

/* ==========================================================================
   MEET THE TEAM PAGE
   ========================================================================== */

.meet-team-page .header:not(.scrolled) .nav-link              { color: var(--dark); }
.meet-team-page .header:not(.scrolled) .nav-link.active::after { background-color: var(--terracotta); }
.meet-team-page .header:not(.scrolled) .hamburger span        { background-color: var(--dark); }
.meet-team-page .header:not(.scrolled) .logo img              { filter: brightness(0.2); }
.meet-team-page .team-botanical-left                          { display: none !important; }

.meet-team-page .team-hero {
    padding-top: 180px;
    padding-bottom: 100px;
    background-color: var(--cream);
    position: relative;
    overflow: hidden;
    min-height: 100vh;
}

.meet-team-page .team-header-content {
    max-width: 680px;
    margin: 0 auto 60px;
    position: relative;
    z-index: 2;
}

.meet-team-page .team-label {
    display: block;
    color: var(--terracotta);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    margin-bottom: 16px;
}

.meet-team-page .team-title    { font-size: clamp(44px, 5vw, 64px); line-height: 1.1; margin-bottom: 12px; color: var(--dark); }
.meet-team-page .team-subtitle { font-size: clamp(22px, 3vw, 32px); font-style: italic; color: var(--terracotta); margin-bottom: 24px; font-weight: 500; }
.meet-team-page .team-divider  { height: 1px; width: 40px; background-color: var(--beige); margin: 0 auto 24px; }
.meet-team-page .team-intro    { font-size: 18px; color: var(--dark); margin: 0 auto; line-height: 1.6; }

.meet-team-page .team-grid {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    gap: 24px;
    max-width: var(--max-width);
    margin: 0 auto;
    align-items: stretch;
    position: relative;
    z-index: 2;
}

/* Each card spans two of the eight desktop columns, preserving the
   original four-card row while allowing the fifth card to sit centrally. */
.meet-team-page .team-grid > .team-card {
    grid-column: span 2;
}

.meet-team-page .team-grid > .team-card.team-card-centered {
    grid-column: 4 / span 2;
    justify-self: stretch;
}

.meet-team-page .team-card {
    text-align: center;
    position: relative;
    transition: transform 0.4s ease;
    height: 100%;
}
.meet-team-page .team-card:hover { transform: translateY(-4px); }

/* House frame card */
.meet-team-page .team-card-featured .team-card-inner,
.meet-team-page .team-card-standard {
    --team-roof-height: 72px;
    position: relative;
    isolation: isolate;
    overflow: visible;
    border: none;
    border-radius: 0;
    background: transparent;
    padding: 14px 14px 26px;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.meet-team-page .team-card-featured .team-card-inner::before,
.meet-team-page .team-card-standard::before {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--beige);
    pointer-events: none;
    z-index: 0;
    -webkit-clip-path: polygon(50% 0, 100% var(--team-roof-height), 100% 100%, 0 100%, 0 var(--team-roof-height));
    clip-path: polygon(50% 0, 100% var(--team-roof-height), 100% 100%, 0 100%, 0 var(--team-roof-height));
}

.meet-team-page .team-card-featured .team-card-inner::after,
.meet-team-page .team-card-standard::after {
    content: "";
    position: absolute;
    inset: 1px;
    background: var(--cream);
    pointer-events: none;
    z-index: 1;
    -webkit-clip-path: polygon(50% 0, 100% var(--team-roof-height), 100% 100%, 0 100%, 0 var(--team-roof-height));
    clip-path: polygon(50% 0, 100% var(--team-roof-height), 100% 100%, 0 100%, 0 var(--team-roof-height));
}

.meet-team-page .team-card-featured .team-card-inner > *,
.meet-team-page .team-card-standard > * {
    position: relative;
    z-index: 2;
}

.meet-team-page .team-img-wrap {
    position: relative;
    margin-bottom: 26px;
    padding: 0;
    border: none;
    overflow: visible;
}

.meet-team-page .team-img {
    width: 100%;
    height: 320px;
    object-fit: cover;
    object-position: center top;
    display: block;
    border-radius: 0;
    -webkit-clip-path: polygon(50% 0, 100% var(--team-roof-height), 100% 100%, 0 100%, 0 var(--team-roof-height));
    clip-path: polygon(50% 0, 100% var(--team-roof-height), 100% 100%, 0 100%, 0 var(--team-roof-height));
}

.meet-team-page .team-badge {
    position: absolute;
    left: -8px;
    bottom: 18px;
    width: 44px;
    height: 52px;
    background-color: var(--terracotta);
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 5;
}

.meet-team-page .team-text-wrap {
    padding: 0 8px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.meet-team-page .team-name  { font-family: var(--font-serif); font-size: 24px; color: var(--dark); margin-bottom: 6px; line-height: 1.2; }
.meet-team-page .team-role  { display: block; font-family: var(--font-sans); font-size: 10px; color: var(--terracotta); text-transform: uppercase; letter-spacing: 2px; font-weight: 700; margin-bottom: 16px; }
.meet-team-page .team-desc  { font-size: 16px; color: var(--dark); line-height: 1.6; margin: 0 auto; }

/* Meet The Team Responsive */
@media (max-width: 1024px) {
    .meet-team-page .team-grid { grid-template-columns: repeat(2, 1fr); gap: 50px 30px; max-width: 700px; }
    .meet-team-page .team-grid > .team-card { grid-column: auto; }
    .meet-team-page .team-grid > .team-card.team-card-centered {
        grid-column: 1 / -1;
        width: calc((100% - 30px) / 2);
        justify-self: center;
    }
}

@media (max-width: 768px) {
    .meet-team-page .team-hero    { padding-top: 140px; }
    .meet-team-page .team-title   { font-size: 42px; }
    .meet-team-page .team-subtitle { font-size: 25px; }
}

@media (max-width: 520px) {
    .meet-team-page .team-grid {
        grid-template-columns: 1fr;
        max-width: 340px;
        gap: 60px;
    }
    .meet-team-page .team-grid > .team-card.team-card-centered {
        grid-column: auto;
        width: 100%;
    }
    .meet-team-page .team-card-featured .team-card-inner,
    .meet-team-page .team-card-standard {
        --team-roof-height: 64px;
        padding: 12px 12px 24px;
    }
    .meet-team-page .team-img { height: 280px; }
}

@media (prefers-reduced-motion: reduce) {
    .meet-team-page .team-card           { transition: none !important; }
    .meet-team-page .team-card:hover     { transform: none !important; }
}

/* ==========================================================================
   CORPORATE STAYS PAGE  ·  Business Accommodation Made Simple
   ========================================================================== */

.corporate-stays-page { background-color: var(--cream); }

/* Header blends into the cream page until scrolled */
.corporate-stays-page .header:not(.scrolled) .nav-link               { color: var(--dark); }
.corporate-stays-page .header:not(.scrolled) .nav-link.active::after { background-color: var(--terracotta); }
.corporate-stays-page .header:not(.scrolled) .hamburger span         { background-color: var(--dark); }
.corporate-stays-page .header:not(.scrolled) .logo img               { filter: brightness(0.2); }
.corporate-stays-page .header.scrolled .logo img                     { filter: none; }

/* ---- Shared corporate primitives ---------------------------------------- */
.corporate-stays-page .corp-rule {
    display: block;
    width: 64px;
    height: 2px;
    background-color: var(--terracotta);
    margin: 0 0 28px;
}
.corporate-stays-page .corp-rule--center { margin-left: auto; margin-right: auto; }

.corporate-stays-page .corp-section-title {
    font-family: var(--font-serif);
    font-weight: 600;
    font-size: clamp(30px, 3.4vw, 44px);
    line-height: 1.12;
    color: var(--dark);
    margin: 0 0 18px;
}

/* Image with graceful warm fallback (shown if the <img> 404s) */
.corporate-stays-page .corp-photo {
    position: relative;
    overflow: hidden;
    border-radius: var(--radius-lg);
    background: linear-gradient(135deg, #f5f2ed 0%, #dadfd7 100%);
}
.corporate-stays-page .corp-photo img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 2;
}
.corporate-stays-page .corp-photo-fallback {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 12px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: #5c6d51;
}

/* ==========================================================================
   HERO
   ========================================================================== */
.corporate-stays-page .corp-hero {
    position: relative;
    padding-top: 160px;
    padding-bottom: 80px;
    background-color: var(--cream);
    overflow: hidden;
}
.corporate-stays-page .corp-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 43%) minmax(0, 57%);
    align-items: center;
    gap: 56px;
}

/* Left copy */
.corporate-stays-page .corp-hero-title {
    font-family: var(--font-serif);
    font-weight: 700;
    font-size: clamp(40px, 5vw, 66px);
    line-height: 1.04;
    letter-spacing: -0.5px;
    color: var(--dark);
    margin: 0 0 26px;
}
.corporate-stays-page .corp-hero-lede {
    font-family: var(--font-sans);
    font-size: clamp(16px, 1.4vw, 19px);
    font-weight: 600;
    line-height: 1.5;
    color: var(--terracotta);
    margin: 0 0 26px;
    max-width: 460px;
}
.corporate-stays-page .corp-hero-body p {
    font-size: 15.5px;
    line-height: 1.75;
    color: var(--grey);
    margin: 0 0 16px;
    max-width: 480px;
}
.corporate-stays-page .corp-hero-body p:last-child { margin-bottom: 0; }

/* Right hero image */
.corporate-stays-page .corp-hero-visual {
    position: relative;
}

.corporate-stays-page .corp-hero-image {
    position: relative;
    width: 100%;
    min-height: 520px;
    margin: 0;
    overflow: hidden;
    border-radius: var(--radius-lg);
    background: linear-gradient(135deg, #f5f2ed 0%, #dadfd7 100%);
    box-shadow: var(--shadow-md);
}

.corporate-stays-page .corp-hero-image img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 110%;
    object-fit: cover;
    object-position: center;
    z-index: 2;
}

.corporate-stays-page .corp-hero-image .corp-photo-fallback {
    z-index: 1;
}

/* "Why use all of these?" overlay over the phone / booking-sites image */
.corporate-stays-page .corp-hero-overlay {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 28px;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(23, 59, 48, 0.55) 0%, rgba(23, 59, 48, 0) 38%);
}
.corporate-stays-page .corp-hero-overlay__badge {
    position: relative;
    display: inline-block;
    font-family: var(--font-serif);
    font-style: italic;
    font-size: clamp(20px, 2.4vw, 30px);
    font-weight: 600;
    color: var(--cream);
    background-color: rgba(65, 53, 37, 0.82);
    padding: 12px 26px;
    border-radius: 999px;
    border: 1px solid rgba(245, 242, 237, 0.35);
    box-shadow: 0 10px 26px rgba(0, 0, 0, 0.30);
    text-align: center;
}
@media (max-width: 600px) {
    .corporate-stays-page .corp-hero-overlay { padding-top: 18px; }
}

/* ==========================================================================
   OUR GUARANTEE
   ========================================================================== */
.corporate-stays-page .corp-guarantee { background-color: var(--cream); }
.corporate-stays-page .corp-guarantee-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 56px;
    align-items: center;
}

/* Collage */
.corporate-stays-page .corp-collage { display: flex; flex-direction: column; gap: 16px; }
.corporate-stays-page .corp-collage-main { height: 300px; box-shadow: var(--shadow-sm); }
.corporate-stays-page .corp-collage-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.corporate-stays-page .corp-collage-cell { height: 150px; box-shadow: var(--shadow-sm); }
.corporate-stays-page .corp-collage .corp-photo { border-radius: var(--radius-md); }

/* Copy + checklist */
.corporate-stays-page .corp-guarantee-intro {
    font-size: 16px; line-height: 1.7; color: var(--grey); margin: 0 0 22px; max-width: 520px;
}
.corporate-stays-page .corp-guarantee-lead {
    font-size: 16px; font-weight: 700; color: var(--dark); margin: 0 0 18px;
}
.corporate-stays-page .corp-check-list { list-style: none; margin: 0 0 24px; padding: 0; display: grid; gap: 12px; }
.corporate-stays-page .corp-check-list li {
    display: flex; align-items: flex-start; gap: 12px;
    font-size: 15px; line-height: 1.5; color: var(--dark);
}
.corporate-stays-page .corp-check {
    flex-shrink: 0;
    width: 24px; height: 24px;
    border-radius: 50%;
    background: #f5f2ed;
    color: var(--gold);
    display: flex; align-items: center; justify-content: center;
    margin-top: 1px;
}
.corporate-stays-page .corp-check svg { width: 13px; height: 13px; }
.corporate-stays-page .corp-guarantee-close {
    font-size: 15px; line-height: 1.7; color: var(--grey); margin: 0; max-width: 540px;
}

/* ==========================================================================
   WHY CHOOSE US
   ========================================================================== */
.corporate-stays-page .corp-why { background-color: var(--cream); }
.corporate-stays-page .corp-why-head { margin-bottom: 56px; }
.corporate-stays-page .corp-why-sub {
    font-family: var(--font-serif);
    font-style: italic;
    font-size: clamp(16px, 1.6vw, 20px);
    color: var(--terracotta);
    margin: 0;
}

.corporate-stays-page .corp-why-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    align-items: stretch;
}
.corporate-stays-page .corp-why-card {
    position: relative;
    background: var(--white);
    border: 1px solid var(--light-border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: transform 0.4s ease, box-shadow 0.4s ease, border-color 0.4s ease;
}
.corporate-stays-page .corp-why-card:hover,
.corporate-stays-page .corp-why-card:focus-within {
    transform: translateY(-5px);
    border-color: var(--terracotta);
    box-shadow: 0 14px 34px rgba(65, 53, 37, 0.14);
}
.corporate-stays-page .corp-why-photo {
    height: 170px;
    border-radius: 0;
}
.corporate-stays-page .corp-why-icon {
    position: absolute;
    top: 170px; left: 28px;
    transform: translateY(-50%);
    width: 56px; height: 56px;
    border-radius: 50%;
    background: var(--terracotta);
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 8px 20px rgba(65, 53, 37, 0.3);
    z-index: 4;
}
.corporate-stays-page .corp-why-icon svg { width: 26px; height: 26px; }
.corporate-stays-page .corp-why-body { padding: 42px 28px 30px; }
.corporate-stays-page .corp-why-title {
    font-family: var(--font-serif);
    font-weight: 600;
    font-size: 21px;
    color: var(--dark);
    margin: 0 0 18px;
    line-height: 1.2;
}
.corporate-stays-page .corp-why-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.corporate-stays-page .corp-why-list li {
    display: flex; gap: 11px;
    font-size: 13.5px; line-height: 1.55; color: var(--grey);
}
.corporate-stays-page .corp-why-list strong { color: var(--dark); font-weight: 700; }
.corporate-stays-page .corp-tick {
    flex-shrink: 0;
    margin-top: 7px;
    width: 7px; height: 7px;
    border-radius: 50%;
    background: var(--terracotta);
}

/* Decorative house divider */
.corporate-stays-page .corp-house-divider {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    margin-top: 72px;
}
.corporate-stays-page .corp-house-line {
    height: 1px;
    width: clamp(60px, 18vw, 220px);
    background: linear-gradient(to var(--dir, right), transparent, var(--terracotta));
    background: var(--terracotta);
    opacity: 0.55;
}
.corporate-stays-page .corp-house-mark { color: var(--terracotta); display: flex; }
.corporate-stays-page .corp-house-mark svg { width: 30px; height: 30px; }

/* ==========================================================================
   ENQUIRY FORM  (retained from original, restyled container only)
   ========================================================================== */
.corporate-stays-page .corporate-contact {
    background-color: var(--cream);
    padding-top: 72px;
    padding-bottom: 72px;
}
.corporate-stays-page .corporate-contact-inner {
    display: grid;
    grid-template-columns: minmax(260px, 0.8fr) minmax(360px, 0.95fr);
    gap: 36px;
    align-items: center;
    max-width: 1040px;
    margin: 0 auto;
}
.corporate-stays-page .corporate-contact-copy h2 {
    font-family: var(--font-serif);
    font-size: clamp(30px, 3.4vw, 42px);
    margin-bottom: 16px;
    color: var(--olive);
}
.corporate-stays-page .corporate-contact-copy p {
    font-size: 15px;
    margin-bottom: 22px;
    max-width: 390px;
    line-height: 1.6;
    color: var(--grey);
}
.corporate-stays-page .corporate-savings-note-wrap { display: flex; align-items: center; gap: 16px; }
.corporate-stays-page .corporate-arrow             { width: 52px; height: 34px; }

.corporate-stays-page .corporate-form-card {
    width: 100%;
    max-width: 720px;
    justify-self: end;
    background-color: var(--white);
    padding: 26px;
    border-radius: var(--radius-md);
    border: 1px solid var(--light-border);
    box-shadow: 0 0 14px rgba(92, 109, 81, 0.08);
    transition: box-shadow 0.4s ease, transform 0.4s ease;
}
.corporate-stays-page .corporate-form-card:hover,
.corporate-stays-page .corporate-form-card:focus-within {
    box-shadow: 0 0 24px rgba(92, 109, 81, 0.18);
}
.corporate-stays-page .corporate-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-bottom: 22px;
}
.corporate-stays-page .corporate-field            { display: flex; flex-direction: column; gap: 6px; }
.corporate-stays-page .corporate-field.full-width { grid-column: 1 / -1; }
.corporate-stays-page .corporate-property-field   { grid-column: 1 / 2; }
.corporate-stays-page .corporate-needs-field      { grid-column: 2 / 3; }
.corporate-stays-page .corporate-field label {
    font-size: 11px;
    font-weight: 700;
    line-height: 1.25;
    color: var(--dark);
}
.corporate-stays-page .corporate-property-field label,
.corporate-stays-page .corporate-needs-field label {
    color: var(--olive);
}
.corporate-stays-page .corporate-field select,
.corporate-stays-page .corporate-field input,
.corporate-stays-page .corporate-field textarea {
    width: 100%;
    min-height: 42px;
    padding: 11px 12px;
    border: 1px solid var(--light-border);
    border-radius: 7px;
    font-family: var(--font-sans);
    font-size: 13px;
    background-color: #f5f2ed;
    color: var(--dark);
    outline: none;
    transition: border-color 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease;
    box-sizing: border-box;
}
.corporate-stays-page .corporate-field select {
    appearance: none;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235c6d51' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 15px;
    padding-right: 38px;
}
.corporate-stays-page .corporate-field textarea {
    min-height: 86px;
    resize: vertical;
}
.corporate-stays-page .corporate-field select:focus,
.corporate-stays-page .corporate-field input:focus,
.corporate-stays-page .corporate-field textarea:focus {
    border-color: var(--olive);
    background-color: var(--white);
    box-shadow: 0 0 0 3px rgba(92, 109, 81, 0.12);
}

@keyframes corporateFormShake {
    0%, 88%, 100% { transform: translateX(0); }
    90% { transform: translateX(-3px); }
    92% { transform: translateX(3px); }
    94% { transform: translateX(-3px); }
    96% { transform: translateX(3px); }
    98% { transform: translateX(0); }
}
.corporate-stays-page .corporate-btn-shake {
    animation: corporateFormShake 4s ease-in-out infinite;
    will-change: transform;
    transition: transform 0.3s, background-color 0.35s, box-shadow 0.35s;
}
.corporate-stays-page .corporate-btn-shake:hover,
.corporate-stays-page .corporate-btn-shake:focus-visible {
    animation-play-state: paused;
    box-shadow: 0 0 15px rgba(65, 53, 37, 0.35);
    transform: translateY(-2px);
}
.corporate-stays-page .corporate-form-success    { text-align: center; padding: 30px 0 10px; }
.corporate-stays-page .corporate-form-success h4 { font-family: var(--font-serif); font-size: 24px; color: var(--terracotta); margin-bottom: 8px; }
.corporate-stays-page .corporate-form-success p  { font-size: 14px; margin: 0; color: var(--dark); }

/* ========================================================================== 
   CORPORATE HERO RESPONSIVE
   ========================================================================== */
@media (max-width: 1199px) {
    .corporate-stays-page .corp-hero-image {
        min-height: 460px;
    }
}

@media (max-width: 1023px) {
    .corporate-stays-page .corp-hero-grid {
        grid-template-columns: 1fr;
        gap: 48px;
    }
    .corporate-stays-page .corp-hero-copy {
        text-align: center;
    }
    .corporate-stays-page .corp-hero-copy .corp-rule {
        margin-left: auto;
        margin-right: auto;
    }
    .corporate-stays-page .corp-hero-lede,
    .corporate-stays-page .corp-hero-body p {
        margin-left: auto;
        margin-right: auto;
    }
    .corporate-stays-page .corp-hero-image {
        max-width: 720px;
        min-height: 420px;
        margin: 0 auto;
    }

    .corporate-stays-page .corp-guarantee-grid { grid-template-columns: 1fr; gap: 40px; }
    .corporate-stays-page .corp-collage-main    { height: 280px; }

    .corporate-stays-page .corp-why-grid { grid-template-columns: repeat(2, 1fr); }

    .corporate-stays-page .corporate-contact-inner  { grid-template-columns: 1fr; gap: 34px; }
    .corporate-stays-page .corporate-contact-copy   { text-align: center; }
    .corporate-stays-page .corporate-contact-copy p { margin-left: auto; margin-right: auto; }
    .corporate-stays-page .corporate-savings-note-wrap { justify-content: center; }
}

@media (max-width: 680px) {
    .corporate-stays-page .corp-hero {
        padding-top: 124px;
        padding-bottom: 56px;
    }
    .corporate-stays-page .corp-hero-image {
        min-height: 320px;
    }
    .corporate-stays-page .corp-collage-row { grid-template-columns: 1fr; }
    .corporate-stays-page .corp-collage-cell { height: 200px; }
    .corporate-stays-page .corp-why-grid    { grid-template-columns: 1fr; }
    .corporate-stays-page .corporate-form-card { padding: 22px; max-width: 100%; }
    .corporate-stays-page .corporate-form-grid { grid-template-columns: 1fr; }
    .corporate-stays-page .corporate-property-field,
    .corporate-stays-page .corporate-needs-field { grid-column: 1 / -1; }
}

@media (max-width: 380px) {
    .corporate-stays-page .corp-hero-image {
        min-height: 260px;
    }
}

/* ========================================================================== 
   REDUCED MOTION
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
    .corporate-stays-page .corp-why-card,
    .corporate-stays-page .corporate-form-card {
        transition: none !important;
        transform: none !important;
    }
    .corporate-stays-page .corporate-btn-shake {
        animation: none !important;
        transform: none !important;
    }
}

/* ==========================================================================
   CONTACT US PAGE
   ========================================================================== */

.contact-page {
    background-color: var(--cream);
}
.contact-page .header:not(.scrolled) .nav-link              { color: var(--dark); }
.contact-page .header:not(.scrolled) .nav-link.active::after { background-color: var(--terracotta); }
.contact-page .header:not(.scrolled) .hamburger span        { background-color: var(--dark); }
.contact-page .header:not(.scrolled) .logo img              { filter: brightness(0.2); }
.contact-page .header.scrolled .logo img                    { filter: none; }

.contact-page .contact-hero {
    position: relative;
    padding-top: 160px;
    padding-bottom: 60px;
    background-color: var(--cream);
    overflow: hidden;
}

.contact-page .contact-botanical {
    position: absolute;
    top: 50%;
    transform: translateY(-40%);
    width: 200px;
    pointer-events: none;
    z-index: 1;
}
.contact-page .contact-botanical-left  { left: -20px; }
.contact-page .contact-botanical-right { right: -20px; }

.contact-page .contact-hero-content {
    position: relative;
    z-index: 2;
    max-width: 680px;
    margin: 0 auto;
}

.contact-page .contact-label {
    display: block;
    color: var(--terracotta);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 16px;
}

.contact-page .contact-title {
    font-size: clamp(40px, 5vw, 56px);
    line-height: 1.1;
    color: var(--dark);
    margin-bottom: 20px;
}

.contact-page .contact-hero-divider {
    height: 1px;
    width: 40px;
    background-color: var(--terracotta);
    margin: 0 auto 24px;
    opacity: 0.6;
}

.contact-page .contact-subtitle {
    font-size: 18px;
    line-height: 1.6;
    color: var(--dark);
    max-width: 480px;
    margin: 0 auto;
}

.contact-page .contact-cards-section {
    padding-bottom: 60px;
    position: relative;
    z-index: 2;
}

.contact-page .contact-cards-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    max-width: 800px;
    margin: 0 auto;
}

.contact-page .contact-card {
    background-color: var(--white);
    border: 1px solid var(--light-border);
    border-radius: var(--radius-md);
    padding: 36px 28px;
    text-align: center;
    box-shadow: var(--shadow-sm);
    transition: transform 0.4s ease, box-shadow 0.4s ease, border-color 0.4s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
    outline: none;
}
.contact-page .contact-card:hover,
.contact-page .contact-card:focus-within,
.contact-page .contact-card.is-active {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
    border-color: var(--terracotta);
}

.contact-page .contact-card-icon {
    width: 56px;
    height: 56px;
    background-color: #f5f2ed;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--terracotta);
    margin-bottom: 20px;
    transition: background-color 0.4s ease, box-shadow 0.4s ease;
}
.contact-page .contact-card:hover .contact-card-icon,
.contact-page .contact-card.is-active .contact-card-icon {
    background-color: var(--terracotta);
    color: var(--white);
    box-shadow: 0 0 0 6px rgba(65, 53, 37, 0.1);
}

.contact-page .contact-card-title {
    font-size: 26px;
    color: var(--dark);
    margin-bottom: 16px;
}

.contact-page .contact-card-divider {
    height: 1px;
    width: 30px;
    background-color: var(--light-border);
    margin: 0 auto 24px;
}

.contact-page .contact-info-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 30px;
    width: 100%;
}

.contact-page .contact-info-item {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-size: 15px;
    color: var(--dark);
    font-weight: 500;
}

.contact-page .contact-btn-group {
    display: flex;
    gap: 12px;
    width: 100%;
    margin-top: auto;
    justify-content: center;
}

.contact-page .contact-btn-solid {
    background-color: var(--olive);
    color: var(--white);
    font-size: 11px;
    padding: 14px 20px;
    gap: 8px;
    border-radius: 4px;
    flex: 1;
}
.contact-page .contact-btn-solid:hover,
.contact-page .contact-btn-solid:focus-visible {
    background-color: var(--forest);
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(92, 109, 81, 0.25);
}

.contact-page .contact-btn-outline {
    background-color: transparent;
    color: var(--olive);
    border: 1px solid var(--olive);
    font-size: 11px;
    padding: 14px 20px;
    gap: 8px;
    border-radius: 4px;
    flex: 1;
}
.contact-page .contact-btn-outline:hover,
.contact-page .contact-btn-outline:focus-visible {
    background-color: var(--olive);
    color: var(--white);
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(92, 109, 81, 0.15);
}

.contact-page .contact-image-section {
    padding-top: 20px;
    padding-bottom: 80px;
}

.contact-page .contact-image-wrapper {
    width: 100%;
    height: 320px;
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
}
.contact-page .contact-image-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

/* Contact Responsive */
@media (max-width: 1023px) {
    .contact-page .contact-botanical { display: none; }
}

@media (max-width: 768px) {
    .contact-page .contact-hero            { padding-top: 140px; padding-bottom: 40px; }
    .contact-page .contact-title           { font-size: 38px; }
    .contact-page .contact-cards-grid      { grid-template-columns: 1fr; max-width: 440px; }
    .contact-page .contact-image-wrapper   { height: 260px; }
}

@media (max-width: 520px) {
    .contact-page .contact-card            { padding: 32px 20px; }
    .contact-page .contact-btn-group       { flex-direction: column; }
    .contact-page .contact-btn-solid,
    .contact-page .contact-btn-outline     { width: 100%; }
    .contact-page .contact-image-wrapper   { height: 200px; }
}

@media (prefers-reduced-motion: reduce) {
    .contact-page .contact-card,
    .contact-page .contact-card-icon,
    .contact-page .contact-btn-solid,
    .contact-page .contact-btn-outline     { transition: none !important; }
    .contact-page .contact-card:hover,
    .contact-page .contact-card:focus-within,
    .contact-page .contact-card.is-active,
    .contact-page .contact-btn-solid:hover,
    .contact-page .contact-btn-outline:hover { transform: none !important; }
}

/* ==========================================================================
   NEWS PAGE (Under Construction)
   ========================================================================== */

.news-page {
    background-color: var(--cream);
}
.news-page .header:not(.scrolled) .nav-link              { color: var(--dark); }
.news-page .header:not(.scrolled) .nav-link.active::after { background-color: var(--terracotta); }
.news-page .header:not(.scrolled) .hamburger span        { background-color: var(--dark); }
.news-page .header:not(.scrolled) .logo img              { filter: brightness(0.2); }
.news-page .header.scrolled .logo img                    { filter: none; }

.news-page .news-hero {
    position: relative;
    padding-top: 180px;
    padding-bottom: 100px;
    background-color: var(--cream);
    min-height: 100vh;
    display: flex;
    align-items: center;
    overflow: hidden;
}

.news-page .news-botanical-left,
.news-page .news-botanical-right {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 200px;
    pointer-events: none;
    z-index: 1;
}
.news-page .news-botanical-left  { left: -20px; }
.news-page .news-botanical-right { right: -20px; transform: translateY(-50%) scaleX(-1); }

.news-page .news-content-wrapper {
    position: relative;
    z-index: 2;
    max-width: 800px;
    margin: 0 auto;
}

.news-page .news-label {
    display: block;
    color: var(--terracotta);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    margin-bottom: 16px;
}

.news-page .news-title {
    font-size: clamp(44px, 5vw, 64px);
    line-height: 1.1;
    margin-bottom: 24px;
    color: var(--dark);
}

.news-page .news-divider {
    height: 1px;
    width: 40px;
    background-color: var(--beige);
    margin: 0 auto 24px;
}

.news-page .news-subtitle {
    font-size: clamp(22px, 3vw, 32px);
    font-style: italic;
    color: var(--terracotta);
    margin-bottom: 20px;
    font-weight: 500;
}

.news-page .news-intro {
    font-size: 18px;
    color: var(--dark);
    margin: 0 auto 12px;
    line-height: 1.6;
}

.news-page .news-card {
    margin-top: 60px;
    text-align: center;
    display: flex;
    justify-content: center;
}

.news-page .news-card-inner {
    background-color: var(--white);
    border: 1px solid var(--light-border);
    border-radius: var(--radius-lg);
    padding: 50px 40px;
    box-shadow: var(--shadow-sm);
    max-width: 600px;
    width: 100%;
}

.news-page .news-card-icon-wrap {
    width: 56px;
    height: 56px;
    background-color: #f5f2ed;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 24px;
    color: var(--terracotta);
}

.news-page .news-card-label {
    display: block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--olive);
    margin-bottom: 12px;
}

.news-page .news-card-title  { font-size: clamp(28px, 4vw, 36px); margin-bottom: 20px; color: var(--dark); }
.news-page .news-card-desc   { font-size: 18px; color: var(--dark); line-height: 1.6; margin-bottom: 32px; }

@keyframes newsGentleShake {
    0%, 100%  { transform: translateX(0); }
    20%       { transform: translateX(-3px); }
    40%       { transform: translateX(3px); }
    60%       { transform: translateX(-2px); }
    80%       { transform: translateX(2px); }
}
.news-shake-btn.shake-active { animation: newsGentleShake 0.6s ease-in-out; }

/* News Responsive */
@media (max-width: 1024px) {
    .news-page .news-botanical-left,
    .news-page .news-botanical-right { display: none; }
}

@media (max-width: 768px) {
    .news-page .news-hero        { padding-top: 140px; min-height: auto; }
    .news-page .news-card-inner  { padding: 40px 24px; }
}

@media (max-width: 520px) {
    .news-page .news-card        { margin-top: 40px; }
    .news-page .news-card-inner  { padding: 32px 20px; }
    .news-page .news-shake-btn   { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    .news-shake-btn.shake-active { animation: none !important; transform: none !important; }
}

/* ==========================================================================
   HOME FROM HOME PAGE (Standalone page, .homefromhome-page)
   ========================================================================== */

.homefromhome-page {
    background-color: var(--cream);
}
.homefromhome-page .header:not(.scrolled) .nav-link              { color: var(--dark); }
.homefromhome-page .header:not(.scrolled) .nav-link.active::after { background-color: var(--terracotta); }
.homefromhome-page .header:not(.scrolled) .hamburger span        { background-color: var(--dark); }
.homefromhome-page .header:not(.scrolled) .logo img              { filter: brightness(0.2); }
.homefromhome-page .header.scrolled .logo img                    { filter: none; }

.hfh-hero {
    padding-top: 180px;
    padding-bottom: 80px;
    background-color: var(--cream);
    position: relative;
    overflow: hidden;
}

.hfh-hero-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.hfh-kicker {
    display: block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: var(--terracotta);
    margin-bottom: 20px;
}

.hfh-hero-content h1 {
    font-size: clamp(40px, 5vw, 64px);
    line-height: 1.1;
    color: var(--dark);
    margin-bottom: 16px;
}

.hfh-lead {
    font-family: var(--font-serif);
    font-size: clamp(22px, 3vw, 28px);
    color: var(--terracotta);
    font-style: italic;
    margin-bottom: 24px;
    font-weight: 500;
}

/* .hfh-divider here is the page hero's divider (not section divider above) */
.hfh-hero-content .hfh-divider {
    width: 60px;
    height: 2px;
    background-color: var(--terracotta);
    margin-bottom: 24px;
    opacity: 0.5;
    display: block;
    flex: none;
}

.hfh-hero-content p { max-width: 540px; }

.hfh-hero-visual {
    position: relative;
    padding: 20px;
}

.hfh-image-frame {
    position: relative;
    z-index: 2;
    border-radius: 200px 200px 16px 16px;
    overflow: hidden;
    box-shadow: var(--shadow-md);
    height: 600px;
    background-color: var(--beige);
}
.hfh-image-frame img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.hfh-hero-visual::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 30px;
    left: 40px;
    border: 1px solid var(--terracotta);
    border-radius: 200px 200px 16px 16px;
    z-index: 1;
    opacity: 0.3;
}

/* Info section */
.hfh-info {
    background-color: #f5f2ed;
    border-top: 1px solid var(--light-border);
    border-bottom: 1px solid var(--light-border);
}

.hfh-info-inner {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
}

.hfh-info-inner h2 {
    font-family: var(--font-serif);
    font-size: clamp(32px, 4vw, 46px);
    color: var(--dark);
    margin-bottom: 24px;
    line-height: 1.2;
}

.hfh-list {
    text-align: left;
    max-width: 520px;
    margin: 40px auto;
    padding: 36px 40px;
    background-color: var(--white);
    border: 1px solid var(--light-border);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
}

.hfh-list li {
    position: relative;
    padding-left: 30px;
    margin-bottom: 18px;
    font-size: 16px;
    color: var(--dark);
    font-weight: 500;
    line-height: 1.5;
}
.hfh-list li:last-child { margin-bottom: 0; }
.hfh-list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 8px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--terracotta);
}

.hfh-banner-wrap {
    position: relative;
    width: 100%;
    height: 480px;
    background-color: var(--forest);
}
.hfh-banner-wrap img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hfh-banner-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(23, 59, 48, 0.25), rgba(23, 59, 48, 0.12));
}

.hfh-help          { background-color: var(--cream); }
.hfh-help-inner    { max-width: 760px; margin: 0 auto; text-align: center; }
.hfh-help-inner h2 {
    font-family: var(--font-serif);
    font-size: clamp(32px, 4vw, 46px);
    color: var(--dark);
    margin-bottom: 24px;
}

.hfh-highlight {
    display: block;
    font-family: var(--font-serif);
    font-size: clamp(22px, 3vw, 28px);
    color: var(--terracotta);
    font-style: italic;
    margin: 40px 0;
    padding: 32px 24px;
    border-top: 1px solid var(--beige);
    border-bottom: 1px solid var(--beige);
    background-color: rgba(65, 53, 37, 0.03);
    line-height: 1.4;
}

/* HFH page responsive */
@media (max-width: 1024px) {
    .hfh-hero-layout { gap: 40px; }
    .hfh-image-frame { height: 500px; }
}

@media (max-width: 768px) {
    .hfh-hero        { padding-top: 140px; }
    .hfh-hero-layout { grid-template-columns: 1fr; }
    .hfh-hero-content { text-align: center; }
    .hfh-hero-content p { margin-left: auto; margin-right: auto; }
    .hfh-hero-content .hfh-divider { margin: 0 auto 24px; }
    .hfh-hero-visual { padding: 20px 20px 0 0; max-width: 500px; margin: 0 auto; }
    .hfh-image-frame { height: 440px; }
    .hfh-list        { margin: 30px 16px; padding: 30px 24px; }
    .hfh-banner-wrap { height: 340px; }
}

@media (max-width: 520px) {
    .hfh-image-frame  { border-radius: 100px 100px 12px 12px; height: 360px; }
    .hfh-hero-visual::after { border-radius: 100px 100px 12px 12px; bottom: 16px; left: 30px; }
    .hfh-banner-wrap  { height: 280px; }
    .hfh-highlight    { padding: 24px 16px; }
}

/* ==========================================================================
   Trusted Teams Logo Marquee
   ========================================================================== */

.trusted-logos {
    background-color: var(--cream);
    overflow: hidden; /* prevents any horizontal page overflow from the track */
}

.trusted-logos__header {
    text-align: center;
    margin-bottom: 48px;
}

.trusted-logos__title {
    font-size: 40px;
    line-height: 1.15;
    color: var(--dark);
    margin: 0;
}

/* Soft card / strip around the marquee */
.trusted-logos__marquee {
    position: relative;
    overflow: hidden;
    padding: 34px 0;
    background-color: var(--white);
    border: 1px solid var(--light-border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    /* Soft fade on the left/right edges for a premium feel */
    -webkit-mask-image: linear-gradient(to right, transparent 0, #000 8%, #000 92%, transparent 100%);
            mask-image: linear-gradient(to right, transparent 0, #000 8%, #000 92%, transparent 100%);
}

.trusted-logos__track {
    display: flex;
    align-items: center;
    width: max-content;
    animation: trusted-logos-scroll 45s linear infinite;
    will-change: transform;
}

/* Pause the loop when the visitor hovers the strip */
.trusted-logos__marquee:hover .trusted-logos__track {
    animation-play-state: paused;
}

.trusted-logos__item {
    flex: 0 0 auto;
    width: 160px;
    height: 70px;
    /* Uniform horizontal margin keeps the duplicated set perfectly aligned,
       so translateX(-50%) loops seamlessly with no blank gap. */
    margin: 0 34px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.trusted-logos__item img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain; /* never stretch logos */
    filter: grayscale(100%);
    opacity: 0.55;
    transition: filter 0.4s ease, opacity 0.4s ease;
}

/* Clearer, full colour on hover */
.trusted-logos__item img:hover {
    filter: grayscale(0%);
    opacity: 1;
}

@keyframes trusted-logos-scroll {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}

/* Tablet */
@media (max-width: 1023px) {
    .trusted-logos__title { font-size: 34px; }
    .trusted-logos__item  { width: 132px; height: 60px; margin: 0 26px; }
}

/* Mobile */
@media (max-width: 768px) {
    .trusted-logos__header { margin-bottom: 36px; }
    .trusted-logos__title  { font-size: 30px; }
    .trusted-logos__marquee { padding: 26px 0; }
    .trusted-logos__item   { width: 112px; height: 50px; margin: 0 20px; }
}

@media (max-width: 520px) {
    .trusted-logos__title { font-size: 26px; }
    .trusted-logos__item  { width: 96px; height: 44px; margin: 0 16px; }
}

/* Respect reduced motion: stop the loop and show a static wrapped grid */
@media (prefers-reduced-motion: reduce) {
    .trusted-logos__marquee {
        overflow: visible;
        -webkit-mask-image: none;
                mask-image: none;
    }

    .trusted-logos__track {
        flex-wrap: wrap;
        justify-content: center;
        width: auto;
        gap: 16px 32px;
        animation: none;
        transform: none;
    }

    /* Avoid showing each logo twice in the static grid */
    .trusted-logos__item--clone {
        display: none;
    }

    .trusted-logos__item {
        margin: 0;
    }

    .trusted-logos__item img {
        filter: none;
        opacity: 1;
    }
}

/* ==========================================================================
   CORPORATE STAYS PAGE — 2026 REDESIGN ENHANCEMENTS
   All rules below are scoped to .corporate-stays-page so no other page,
   the navigation, footer, or homepage is affected.
   Colours reuse the existing Holt theme tokens:
     accent  -> --terracotta (#413525)   primary -> --olive (#5c6d51)
     surface -> --white                   background -> --cream (#f5f2ed)
     border  -> --light-border            muted text -> --grey
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. PAIN POINTS — "The pain points we hear every day"
   Converts the flat connected panel into a premium, balanced card grid.
   -------------------------------------------------------------------------- */
.corporate-stays-page .corporate-pain-section {
    padding-top: 76px;
    padding-bottom: 76px;
}
.corporate-stays-page .corporate-pain-main-title {
    font-size: clamp(30px, 3.6vw, 44px);
    margin-bottom: 12px;
}
.corporate-stays-page .corporate-section-header {
    max-width: 720px;
    margin: 0 auto 48px;
}

/* Panel becomes a responsive grid of standalone cards */
.corporate-stays-page .corporate-pain-panel {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
    background-color: transparent;
    border: none;
    border-radius: 0;
    overflow: visible;
}

.corporate-stays-page .corporate-pain-card {
    flex: none;
    background-color: var(--white);
    border: 1px solid var(--light-border);
    border-right: 1px solid var(--light-border);
    border-radius: var(--radius-md);
    padding: 34px 28px;
    box-shadow: 0 4px 18px rgba(92, 109, 81, 0.05);
    transition: transform 0.35s ease, border-color 0.35s ease,
                box-shadow 0.35s ease, background-color 0.35s ease;
}
.corporate-stays-page .corporate-pain-card:last-child {
    border-right: 1px solid var(--light-border);
}
.corporate-stays-page .corporate-pain-card:hover,
.corporate-stays-page .corporate-pain-card:focus-visible,
.corporate-stays-page .corporate-pain-card.is-active {
    background-color: var(--white);
    transform: translateY(-6px);
    border-color: var(--terracotta);
    box-shadow: 0 14px 36px rgba(65, 53, 37, 0.15);
}

/* Premium rounded-square icon tile */
.corporate-stays-page .corporate-pain-icon {
    width: 54px;
    height: 54px;
    border: none;
    border-radius: 14px;
    background-color: #f5f2ed;
    color: var(--terracotta);
    margin-bottom: 22px;
    transition: background-color 0.3s ease, color 0.3s ease, box-shadow 0.3s ease;
}
.corporate-stays-page .corporate-pain-card:hover .corporate-pain-icon,
.corporate-stays-page .corporate-pain-card:focus-visible .corporate-pain-icon,
.corporate-stays-page .corporate-pain-card.is-active .corporate-pain-icon {
    background-color: var(--terracotta);
    color: var(--white);
    box-shadow: 0 0 0 6px rgba(65, 53, 37, 0.12);
}
.corporate-stays-page .corporate-pain-icon svg { width: 26px; height: 26px; }

/* Clearer typographic hierarchy */
.corporate-stays-page .corporate-pain-title {
    font-size: 18px;
    line-height: 1.4;
    margin-bottom: 10px;
}
.corporate-stays-page .corporate-pain-text {
    font-size: 15px;
    color: var(--grey);
    line-height: 1.65;
}

/* --------------------------------------------------------------------------
   2. OUR GUARANTEE — slightly larger, more polished and readable
   -------------------------------------------------------------------------- */
.corporate-stays-page .corporate-guarantee-intro {
    font-size: 17px;
    line-height: 1.7;
}
.corporate-stays-page .corporate-guarantee-badge {
    font-size: 14px;
    padding: 9px 18px;
}
.corporate-stays-page .corporate-guarantee-card {
    padding: 34px 26px;
    box-shadow: 0 4px 18px rgba(92, 109, 81, 0.05);
}
.corporate-stays-page .corporate-guarantee-card:hover,
.corporate-stays-page .corporate-guarantee-card:focus-visible,
.corporate-stays-page .corporate-guarantee-card.is-active {
    box-shadow: 0 14px 34px rgba(65, 53, 37, 0.14);
}
.corporate-stays-page .corporate-guarantee-card-title {
    font-size: 18.5px;
    line-height: 1.35;
    margin-bottom: 12px;
}
.corporate-stays-page .corporate-guarantee-card-desc {
    font-size: 15.5px;
    color: var(--grey);
    line-height: 1.6;
}

/* --------------------------------------------------------------------------
   3. WHY CHOOSE US — 6 balanced cards (3 / 2 / 1), larger readable text
   -------------------------------------------------------------------------- */
.corporate-stays-page .corporate-why-choose-header h3 {
    font-size: clamp(28px, 3.2vw, 38px);
}
.corporate-stays-page .corporate-why-choose-subtitle {
    font-size: 17px;
    margin-bottom: 44px;
}

.corporate-stays-page .corporate-why-choose-blocks {
    grid-template-columns: repeat(3, 1fr);
    gap: 26px;
}
/* Reset the old forced positions so all six cards flow evenly */
.corporate-stays-page .corporate-why-choose-blocks .corporate-why-block:nth-child(4),
.corporate-stays-page .corporate-why-choose-blocks .corporate-why-block:nth-child(5),
.corporate-stays-page .corporate-why-choose-blocks .corporate-why-block:nth-child(6) {
    grid-column: auto;
}

.corporate-stays-page .corporate-why-block {
    padding: 34px 30px;
}
.corporate-stays-page .why-block-header {
    gap: 14px;
    margin-bottom: 22px;
    padding-bottom: 18px;
}
.corporate-stays-page .why-block-number {
    font-size: 13px;
    padding: 7px 11px;
}
.corporate-stays-page .why-block-title {
    font-size: 20px;
    line-height: 1.3;
}
.corporate-stays-page .why-block-list li {
    font-size: 15px;
    line-height: 1.65;
    margin-bottom: 14px;
    padding-left: 22px;
    color: var(--dark);
}

/* --------------------------------------------------------------------------
   4. CONTACT FORM — modern, premium, balanced & interactive
   -------------------------------------------------------------------------- */
.corporate-stays-page .corporate-contact {
    padding-top: 76px;
    padding-bottom: 90px;
}
.corporate-stays-page .corporate-contact-copy h2 {
    font-size: clamp(32px, 3.6vw, 44px);
}
.corporate-stays-page .corporate-contact-copy p {
    font-size: 17px;
    line-height: 1.7;
    max-width: 440px;
}

/* Better balanced, less oversized card */
.corporate-stays-page .corporate-form-card {
    padding: 36px;
    border-radius: var(--radius-lg);
    border: 1px solid var(--light-border);
    box-shadow: 0 18px 50px rgba(92, 109, 81, 0.10);
    max-width: 660px;
    margin-left: auto;
}
.corporate-stays-page .corporate-form-card:hover,
.corporate-stays-page .corporate-form-card:focus-within {
    box-shadow: 0 22px 60px rgba(92, 109, 81, 0.16);
}

.corporate-stays-page .corporate-form-grid {
    gap: 18px 20px;
    margin-bottom: 24px;
    align-items: end;
}

.corporate-stays-page .corporate-field { gap: 7px; }
.corporate-stays-page .corporate-field label {
    font-size: 13px;
    font-weight: 600;
    color: var(--dark);
    letter-spacing: 0.2px;
}

/* Inputs: bigger touch targets, softer radius, readable size */
.corporate-stays-page .corporate-field input,
.corporate-stays-page .corporate-field select,
.corporate-stays-page .corporate-field textarea {
    padding: 13px 15px;
    border: 1.5px solid var(--light-border);
    border-radius: 10px;
    font-size: 15px;
    background-color: #f5f2ed;
    transition: border-color 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease;
}
.corporate-stays-page .corporate-field select { padding-right: 42px; }
.corporate-stays-page .corporate-field input::placeholder,
.corporate-stays-page .corporate-field textarea::placeholder { color: #949488; }

/* Hover state */
.corporate-stays-page .corporate-field input:hover,
.corporate-stays-page .corporate-field select:hover,
.corporate-stays-page .corporate-field textarea:hover {
    border-color: var(--beige);
}

/* Focus highlight — clear ring + white fill when a field is active */
.corporate-stays-page .corporate-field input:focus,
.corporate-stays-page .corporate-field select:focus,
.corporate-stays-page .corporate-field textarea:focus {
    border-color: var(--terracotta);
    background-color: var(--white);
    box-shadow: 0 0 0 4px rgba(65, 53, 37, 0.12);
}

/* Modern submit button */
.corporate-stays-page .corporate-submit {
    padding: 16px;
    font-size: 14px;
    letter-spacing: 1px;
    border-radius: 12px;
}

/* Success message (preserved behaviour, lightly polished) */
.corporate-stays-page .corporate-form-success {
    background-color: #f5f2ed;
    border: 1px solid var(--light-border);
    border-radius: var(--radius-md);
    padding: 26px 20px;
    margin-top: 18px;
}
.corporate-stays-page .corporate-form-success h4 { font-size: 22px; }
.corporate-stays-page .corporate-form-success p  { font-size: 15px; }

/* --------------------------------------------------------------------------
   5. RESPONSIVE — redesigned sections (tablet & mobile)
   -------------------------------------------------------------------------- */
@media (max-width: 1023px) {
    .corporate-stays-page .corporate-pain-panel       { grid-template-columns: repeat(2, 1fr); }
    .corporate-stays-page .corporate-why-choose-blocks { grid-template-columns: repeat(2, 1fr); }
    .corporate-stays-page .corporate-form-card        { max-width: 100%; margin-left: 0; }
}

@media (max-width: 768px) {
    .corporate-stays-page .corporate-pain-card {
        border: 1px solid var(--light-border);
        border-right: 1px solid var(--light-border);
        padding: 30px 24px;
    }
    .corporate-stays-page .corporate-pain-card:last-child {
        border: 1px solid var(--light-border);
    }
}

@media (max-width: 600px) {
    .corporate-stays-page .corporate-pain-panel        { grid-template-columns: 1fr; }
    .corporate-stays-page .corporate-why-choose-blocks { grid-template-columns: 1fr; }
    .corporate-stays-page .corporate-form-grid         { grid-template-columns: 1fr; }
    .corporate-stays-page .corporate-form-card         { padding: 26px 22px; }
}

/* Respect reduced-motion for the redesigned cards */
@media (prefers-reduced-motion: reduce) {
    .corporate-stays-page .corporate-pain-card,
    .corporate-stays-page .corporate-pain-icon {
        transition: none !important;
        transform: none !important;
    }
}


/* ==========================================================================
   Meet The Team — Black/White to Colour Hover Effect
   ========================================================================== */

.meet-team-page .team-img {
    filter: grayscale(100%) brightness(0.78) contrast(1.08);
    transition: filter 0.55s ease, transform 0.55s ease;
}

/* Bring the hovered card image back to full colour */
.meet-team-page .team-card:hover .team-img,
.meet-team-page .team-card:focus .team-img,
.meet-team-page .team-card:focus-within .team-img {
    filter: grayscale(0%) brightness(1) contrast(1);
    transform: scale(1.03);
}

/* Optional: make non-hovered images feel slightly darker when hovering the grid */
.meet-team-page .team-grid:hover .team-card:not(:hover) .team-img {
    filter: grayscale(100%) brightness(0.68) contrast(1.12);
}

/* Accessibility: reduce animation for people who prefer less motion */
@media (prefers-reduced-motion: reduce) {
    .meet-team-page .team-img {
        transition: none;
        transform: none !important;
    }
}

/* ==========================================================================
   Meet The Team — Desktop Hover Colour Reveal Only
   ========================================================================== */

@media (hover: hover) and (pointer: fine) {
    .meet-team-page .team-img {
        filter: grayscale(100%) brightness(0.78) contrast(1.08);
        transition: filter 0.55s ease, transform 0.55s ease;
    }

    .meet-team-page .team-card:hover .team-img,
    .meet-team-page .team-card:focus .team-img,
    .meet-team-page .team-card:focus-within .team-img {
        filter: grayscale(0%) brightness(1) contrast(1);
        transform: scale(1.03);
    }

    .meet-team-page .team-grid:hover .team-card:not(:hover) .team-img {
        filter: grayscale(100%) brightness(0.68) contrast(1.12);
    }
}

/* Show trusted logos in original full colour */
.trusted-logos__item img {
    filter: none !important;
    opacity: 1 !important;
}

/* Keep them full colour on hover too */
.trusted-logos__item img:hover {
    filter: none !important;
    opacity: 1 !important;
}



/* ==========================================================================
   Guest Reviews Infinite Carousel
   ========================================================================== */

.guest-reviews {
    background-color: var(--cream);
    border-top: 1px solid var(--light-border);
    overflow: hidden;
    position: relative;
}

.guest-reviews__header {
    text-align: center;
    margin-bottom: 34px;
}

.guest-reviews__label-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    margin-bottom: 8px;
}

.guest-reviews__label-row span {
    width: 70px;
    height: 1px;
    background-color: var(--terracotta);
    opacity: 0.45;
}

.guest-reviews__label-row p {
    font-size: 16px;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--terracotta);
    margin: 0;
}

.guest-reviews__title {
    font-size: clamp(28px, 3vw, 36px);
    line-height: 1.15;
    color: var(--dark);
    margin: 0;
}

.guest-reviews__marquee {
    width: 100%;
    overflow: hidden;
    padding: 8px 0 20px;
    mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
    -webkit-mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
}

.guest-reviews__track {
    display: flex;
    gap: 26px;
    width: max-content;
    animation: guestReviewsMarquee 34s linear infinite;
    will-change: transform;
}

.guest-reviews__marquee:hover .guest-reviews__track {
    animation-play-state: paused;
}

@keyframes guestReviewsMarquee {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-50%);
    }
}

.guest-review-card {
    flex: 0 0 310px;
    min-height: 280px;
    background: rgba(255, 255, 255, 0.32);
    border: 1px solid var(--beige);
    border-radius: 18px;
    padding: 24px 26px 22px;
    text-align: center;
    box-shadow: 0 12px 34px rgba(26, 28, 30, 0.04);
    transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
}

.guest-review-card:hover {
    transform: translateY(-6px);
    border-color: var(--terracotta);
    box-shadow: 0 18px 44px rgba(65, 53, 37, 0.12);
}

.guest-review-card__stars {
    color: var(--terracotta);
    letter-spacing: 4px;
    font-size: 15px;
    line-height: 1;
    margin-bottom: 18px;
}

.guest-review-card__quote {
    font-family: var(--font-serif);
    font-size: 64px;
    line-height: 0.6;
    color: var(--beige);
    opacity: 0.7;
    text-align: left;
    height: 26px;
}

.guest-review-card__text {
    font-size: 14px;
    line-height: 1.55;
    font-weight: 500;
    color: var(--dark);
    margin: 10px 0 20px;
}

.guest-review-card__divider {
    width: 100%;
    height: 1px;
    background-color: var(--light-border);
    margin: 0 auto 18px;
}

.guest-review-card__guest {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    text-align: left;
}

.guest-review-card__avatar {
    width: 54px;
    height: 54px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid rgba(255, 255, 255, 0.75);
    box-shadow: 0 6px 16px rgba(26, 28, 30, 0.12);
    background-color: var(--light-border);
}

.guest-review-card__guest h4 {
    font-family: var(--font-sans);
    font-size: 14px;
    line-height: 1.2;
    margin: 0;
    color: var(--dark);
    font-weight: 700;
}

.guest-review-card__guest p {
    font-size: 13px;
    line-height: 1.2;
    margin: 4px 0 0;
    color: var(--grey);
    font-weight: 500;
}

.guest-reviews__footer {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: var(--terracotta);
    opacity: 0.7;
    margin-top: 6px;
}

.guest-reviews__footer-line {
    width: 95px;
    height: 1px;
    background-color: var(--light-border);
}

.guest-reviews__google-link {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    margin-top: 20px;
    font-size: 12px;
    letter-spacing: 1.7px;
    text-transform: uppercase;
    font-weight: 800;
    color: var(--olive);
}

.guest-reviews__google-link span {
    font-size: 18px;
    letter-spacing: -0.5px;
    text-transform: none;
    font-weight: 700;
    color: #4285f4;
}

.guest-reviews__google-link svg {
    transition: transform 0.3s ease;
}

.guest-reviews__google-link:hover {
    color: var(--terracotta);
}

.guest-reviews__google-link:hover svg {
    transform: translateX(4px);
}

/* Guest Reviews Responsive */
@media (max-width: 768px) {
    .guest-reviews__track {
        gap: 18px;
        animation-duration: 28s;
    }

    .guest-review-card {
        flex-basis: 280px;
        padding: 22px 22px 20px;
    }

    .guest-reviews__label-row span {
        width: 42px;
    }

    .guest-reviews__footer-line {
        width: 72px;
    }
}

@media (max-width: 520px) {
    .guest-review-card {
        flex-basis: 260px;
        min-height: 300px;
    }

    .guest-reviews__marquee {
        mask-image: none;
        -webkit-mask-image: none;
    }
}

/* Add this inside your existing reduced motion media query if you want it disabled for reduced motion users */
@media (prefers-reduced-motion: reduce) {
    .guest-reviews__track {
        animation: none !important;
        transform: none !important;
    }
}
.guest-reviews__google-link {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: fit-content;
    margin: 35px auto 0;
}



/* ==========================================================================
   HOME FROM HOME PAGE  (home4home.html)
   ========================================================================== */
.home4home-page {
    background-color: var(--cream);
}

/* Header blends into the cream page until scrolled (matches Corporate Stays) */
.home4home-page .header:not(.scrolled) .nav-link               { color: var(--dark); }
.home4home-page .header:not(.scrolled) .nav-link.active::after { background-color: var(--terracotta); }
.home4home-page .header:not(.scrolled) .hamburger span         { background-color: var(--dark); }
.home4home-page .header:not(.scrolled) .logo img               { filter: brightness(0.2); }
.home4home-page .header.scrolled .logo img                     { filter: none; }

/* ---- Shared primitives -------------------------------------------------- */
.home4home-page .h4h-rule {
    display: block;
    width: 64px;
    height: 2px;
    background-color: var(--terracotta);
    margin: 0 0 28px;
}

.home4home-page .h4h-section-title {
    font-family: var(--font-serif);
    font-weight: 600;
    font-size: clamp(30px, 3.4vw, 44px);
    line-height: 1.12;
    color: var(--dark);
    margin: 0 0 18px;
}

.home4home-page .h4h-eyebrow {
    display: block;
    font-family: var(--font-sans);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: var(--terracotta);
    margin: 0 0 20px;
}

/* Image with graceful warm fallback (shown if the <img> 404s) */
.home4home-page .h4h-photo {
    position: relative;
    overflow: hidden;
    border-radius: var(--radius-lg);
    background: linear-gradient(135deg, #f5f2ed 0%, #dadfd7 100%);
    box-shadow: var(--shadow-md);
    margin: 0;
}
.home4home-page .h4h-photo img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 2;
}
.home4home-page .h4h-photo-fallback {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 12px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: #5c6d51;
}

/* ==========================================================================
   H4H HERO
   ========================================================================== */
.home4home-page .h4h-hero {
    position: relative;
    background-color: var(--cream);
    padding-top: 160px;
    padding-bottom: 80px;
    overflow: hidden;
}
.home4home-page .h4h-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 46%) minmax(0, 54%);
    align-items: center;
    gap: 56px;
    min-height: 0;
}

/* Left copy */
.home4home-page .h4h-hero-copy {
    align-self: center;
}
.home4home-page .h4h-hero-title {
    font-family: var(--font-serif);
    font-weight: 700;
    font-size: clamp(40px, 5vw, 66px);
    line-height: 1.04;
    letter-spacing: -0.5px;
    color: var(--dark);
    margin: 0 0 26px;
}
.home4home-page .h4h-hero-lede {
    font-family: var(--font-sans);
    font-size: clamp(16px, 1.4vw, 18px);
    font-weight: 500;
    line-height: 1.7;
    color: var(--grey);
    margin: 0 0 32px;
    max-width: 440px;
}
.home4home-page .h4h-hero-btn {
    min-width: 200px;
}

/* Right: fade slideshow */
.home4home-page .h4h-hero-visual {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Static hero image: intentionally reuses the exact .h4h-photo frame system
   used by the two image sections below for a uniform desktop layout. */
.home4home-page .h4h-hero-photo {
    width: 100%;
    max-width: 540px;
    aspect-ratio: 1 / 1;
    min-height: 0;
}
.home4home-page .h4h-hero-slider {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 520px;
    border-radius: var(--radius-lg);
    overflow: hidden;
    background: linear-gradient(135deg, #f5f2ed 0%, #dadfd7 100%);
    box-shadow: var(--shadow-md);
}
/* Subtle cream fade that blends the image toward the copy side, echoing the screenshot */
.home4home-page .h4h-hero-slider::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 3;
    pointer-events: none;
    background: linear-gradient(to right, rgba(246, 241, 232, 0.55) 0%, rgba(246, 241, 232, 0) 22%);
}
.home4home-page .h4h-slide {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    opacity: 0;
    transition: opacity 1.1s ease-in-out;
    z-index: 1;
}
.home4home-page .h4h-slide.is-active {
    opacity: 1;
    z-index: 2;
}
.home4home-page .h4h-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.home4home-page .h4h-hero-slider .h4h-photo-fallback {
    z-index: 0;
}

/* ==========================================================================
   H4H SECTION 1 — INTRO
   ========================================================================== */
.home4home-page .h4h-intro {
    background-color: var(--cream);
}
.home4home-page .h4h-intro-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 64px;
    align-items: center;
}
.home4home-page .h4h-intro-visual {
    display: flex;
    justify-content: center;
}
.home4home-page .h4h-intro-copy {
    justify-self: start;
}
.home4home-page .h4h-intro-copy p {
    font-size: 15.5px;
    line-height: 1.8;
    color: var(--grey);
    margin: 0 0 18px;
    max-width: 520px;
}
.home4home-page .h4h-intro-copy p:last-child { margin-bottom: 0; }
.home4home-page .h4h-intro-photo {
    min-height: 460px;
}

/* ==========================================================================
   H4H SECTION 2 — REASONS
   ========================================================================== */
.home4home-page .h4h-reasons {
    background-color: var(--cream);
    padding-top: 0;
}
.home4home-page .h4h-reasons-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 64px;
    align-items: center;
}
.home4home-page .h4h-reasons-subtitle {
    font-family: var(--font-serif);
    font-weight: 600;
    font-size: clamp(20px, 2.2vw, 26px);
    line-height: 1.3;
    color: var(--olive);
    margin: 0 0 14px;
    max-width: 560px;
}

.home4home-page .h4h-reasons-label {
    font-family: var(--font-sans);
    font-size: 16px;
    font-weight: 600;
    color: var(--terracotta);
    margin: 0 0 22px;
}

/* Elegant icon list */
.home4home-page .h4h-reason-list {
    margin: 0;
    padding: 0;
    max-width: 520px;
}
.home4home-page .h4h-reason {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 18px 0;
    border-bottom: 1px solid var(--light-border);
}
.home4home-page .h4h-reason:first-child { border-top: 1px solid var(--light-border); }
.home4home-page .h4h-reason-icon {
    flex: 0 0 auto;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--terracotta);
    background-color: rgba(92, 109, 81, 0.12);
    border: 1px solid rgba(65, 53, 37, 0.22);
    transition: var(--transition);
}
.home4home-page .h4h-reason-icon svg {
    width: 22px;
    height: 22px;
}
.home4home-page .h4h-reason:hover .h4h-reason-icon {
    background-color: var(--terracotta);
    color: var(--white);
    border-color: var(--terracotta);
}
.home4home-page .h4h-reason-text {
    font-family: var(--font-sans);
    font-size: 16px;
    font-weight: 600;
    color: var(--dark);
    line-height: 1.45;
}
.home4home-page .h4h-reasons-photo {
    min-height: 460px;
}

/* ==========================================================================
   H4H CTA STRIP
   ========================================================================== */
.home4home-page .h4h-cta-strip {
    background-color: var(--beige);
    border-top: 1px solid var(--light-border);
    padding: 48px 0;
}
.home4home-page .h4h-cta-inner {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 36px;
}
.home4home-page .h4h-cta-icon {
    flex: 0 0 auto;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--gold);
    border: 1.5px solid var(--gold);
    background-color: rgba(255, 255, 255, 0.25);
}
.home4home-page .h4h-cta-icon svg {
    width: 36px;
    height: 36px;
}
.home4home-page .h4h-cta-text {
    font-family: var(--font-serif);
    font-size: clamp(18px, 1.7vw, 22px);
    font-weight: 500;
    line-height: 1.45;
    color: var(--olive);
    margin: 0;
    max-width: 640px;
}
.home4home-page .h4h-cta-btn {
    flex: 0 0 auto;
    min-width: 220px;
}

/* ==========================================================================
   H4H RESPONSIVE — Tablet (max 1023px)
   ========================================================================== */
@media (max-width: 1023px) {
    .home4home-page .h4h-hero-grid {
        grid-template-columns: 1fr;
        gap: 48px;
        min-height: 0;
    }
    .home4home-page .h4h-hero-copy {
        text-align: center;
    }
    .home4home-page .h4h-hero-copy .h4h-rule {
        margin-left: auto;
        margin-right: auto;
    }
    .home4home-page .h4h-hero-lede {
        margin-left: auto;
        margin-right: auto;
    }
    .home4home-page .h4h-hero-slider {
        max-width: 720px;
        min-height: 420px;
        margin: 0 auto;
    }
    .home4home-page .h4h-hero-slider::after {
        background: none;
    }

    .home4home-page .h4h-intro-grid,
    .home4home-page .h4h-reasons-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    .home4home-page .h4h-intro-copy {
        order: 1;
        justify-self: stretch;
    }
    .home4home-page .h4h-intro-visual {
        order: 2;
    }
    .home4home-page .h4h-intro-photo,
    .home4home-page .h4h-reasons-photo {
        min-height: 380px;
    }

    .home4home-page .h4h-cta-inner {
        grid-template-columns: 1fr;
        justify-items: center;
        text-align: center;
        gap: 24px;
    }
    .home4home-page .h4h-cta-text {
        max-width: 560px;
    }
}

/* ==========================================================================
   H4H RESPONSIVE — Mobile (max 768px)
   ========================================================================== */
@media (max-width: 768px) {
    .home4home-page .h4h-hero {
        padding-top: 124px;
        padding-bottom: 56px;
    }
    .home4home-page .h4h-hero-title {
        font-size: clamp(34px, 9vw, 46px);
    }
    .home4home-page .h4h-hero-slider {
        min-height: 360px;
    }
    .home4home-page .h4h-intro-photo,
    .home4home-page .h4h-reasons-photo {
        min-height: 340px;
    }
    .home4home-page .h4h-reason {
        gap: 16px;
        padding: 16px 0;
    }
    .home4home-page .h4h-reason-icon {
        width: 44px;
        height: 44px;
    }
    .home4home-page .h4h-reason-text {
        font-size: 15px;
    }
    .home4home-page .h4h-cta-btn {
        width: 100%;
    }
}

/* ==========================================================================
   H4H RESPONSIVE — Small Mobile (max 520px)
   ========================================================================== */
@media (max-width: 520px) {
    .home4home-page .h4h-hero-btn {
        width: 100%;
    }
    .home4home-page .h4h-hero-slider {
        min-height: 320px;
    }
    .home4home-page .h4h-intro-photo,
    .home4home-page .h4h-reasons-photo {
        min-height: 300px;
    }
    .home4home-page .h4h-section-title {
        font-size: 28px;
    }
}

/* ==========================================================================
   H4H REDUCED MOTION
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
    .home4home-page .h4h-slide {
        transition: none !important;
    }
    .home4home-page .h4h-reason-icon {
        transition: none !important;
    }
}

/* ==========================================================================
   LUXURY RETREAT PAGE / OLD RECTORY
   ========================================================================== */

/* --- Page base --- */
.luxury-retreat-page {
    background-color: var(--cream);
}

/* --- Header: cream bar ABOVE the hero (does not overlay) --- */
.luxury-retreat-page .header {
    position: relative;            /* sits in normal flow as a solid cream bar */
    background-color: var(--cream);
    padding: 18px 0;
    box-shadow: 0 1px 0 var(--light-border);
}
/* Keep it cream even after the existing .scrolled class toggles on */
.luxury-retreat-page .header.scrolled {
    background-color: var(--cream);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    padding: 14px 0;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.06);
}
.luxury-retreat-page .header .nav-link              { color: var(--dark); }
.luxury-retreat-page .header .nav-link.active::after { background-color: var(--terracotta); height: 2px; bottom: -6px; }
.luxury-retreat-page .header .hamburger span        { background-color: var(--dark); }
.luxury-retreat-page .header .logo img              { filter: brightness(0.2); }

/* Get In Touch button — dark navy, not terracotta */
.luxury-retreat-page .desktop-enquire,
.luxury-retreat-page .mobile-enquire {
    background-color: var(--olive);
    color: var(--white);
}

/* --- HERO --- */
.luxury-retreat-page .oldrectory-hero {
    position: relative;
    height: 620px;
    display: flex;
    align-items: center;
    overflow: hidden;
}
.luxury-retreat-page .oldrectory-hero-bg-wrapper {
    position: absolute;
    inset: 0;
    z-index: -2;
}
.luxury-retreat-page .oldrectory-hero-bg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    animation: heroZoom 16s ease-in-out infinite;
    transform-origin: center center;
}
.luxury-retreat-page .oldrectory-hero-overlay {
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(
        90deg,
        rgba(20, 22, 24, 0.92) 0%,
        rgba(20, 22, 24, 0.78) 28%,
        rgba(20, 22, 24, 0.45) 55%,
        rgba(20, 22, 24, 0.12) 80%,
        rgba(20, 22, 24, 0.05) 100%
    );
}
.luxury-retreat-page .oldrectory-hero-container {
    width: 100%;
}
.luxury-retreat-page .oldrectory-hero-content {
    max-width: 640px;
    padding-left: 36px;
}
.luxury-retreat-page .oldrectory-hero-title {
    font-family: var(--font-serif);
    color: var(--white);
    font-size: 76px;
    line-height: 0.95;
    font-weight: 600;
    letter-spacing: 0.5px;
    margin: 0 0 22px;
}
.luxury-retreat-page .oldrectory-hero-sub {
    font-family: var(--font-sans);
    color: var(--white);
    font-size: 22px;
    line-height: 1.5;
    font-weight: 400;
    opacity: 0.95;
}

/* --- INTRO --- */
.luxury-retreat-page .oldrectory-intro {
    background-color: var(--cream);
    padding: 80px 0;
}
.luxury-retreat-page .oldrectory-intro-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}

/* Left column */
.luxury-retreat-page .oldrectory-eyebrow {
    display: block;
    font-family: var(--font-sans);
    text-transform: uppercase;
    color: var(--terracotta);
    letter-spacing: 6px;
    font-weight: 700;
    font-size: 14px;
}
.luxury-retreat-page .oldrectory-rule {
    display: block;
    position: relative;
    width: 240px;
    max-width: 80%;
    height: 1px;
    background-color: var(--terracotta);
    margin: 18px 0 28px;
    opacity: 0.55;
}
.luxury-retreat-page .oldrectory-rule::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 8px;
    height: 8px;
    background-color: var(--terracotta);
    transform: translate(-50%, -50%) rotate(45deg);
}
.luxury-retreat-page .oldrectory-heading {
    font-family: var(--font-serif);
    color: var(--olive);
    font-size: 44px;
    line-height: 1.1;
    font-weight: 600;
    margin: 0 0 26px;
}
.luxury-retreat-page .oldrectory-paragraph {
    /* Refined editorial body stack — calmer and more readable than the
       previous serif body text. Headings remain serif (unchanged). */
    font-family: 'Montserrat', 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    color: var(--grey);
    font-size: 16px;
    line-height: 1.85;
    font-weight: 400;
    letter-spacing: 0.2px;
    max-width: 420px;
    margin: 0 0 22px;
}
.luxury-retreat-page .oldrectory-paragraph:last-child {
    margin-bottom: 0;
}

/* Right column — framed image */
.luxury-retreat-page .oldrectory-frame {
    position: relative;
    background-color: var(--cream);
    border: 1px solid var(--beige);
    border-radius: 10px;
    padding: 22px;
}
/* Inset decorative inner line */
.luxury-retreat-page .oldrectory-frame::before {
    content: '';
    position: absolute;
    inset: 10px;
    border: 1px solid var(--light-border);
    border-radius: 8px;
    pointer-events: none;
}
/* Four small ornamental corner dots on the inner line */
.luxury-retreat-page .oldrectory-frame::after {
    content: '';
    position: absolute;
    inset: 10px;
    pointer-events: none;
    background-image:
        radial-gradient(circle, var(--terracotta) 0 2px, transparent 2px),
        radial-gradient(circle, var(--terracotta) 0 2px, transparent 2px),
        radial-gradient(circle, var(--terracotta) 0 2px, transparent 2px),
        radial-gradient(circle, var(--terracotta) 0 2px, transparent 2px);
    background-repeat: no-repeat;
    background-size: 6px 6px;
    background-position: top left, top right, bottom left, bottom right;
    opacity: 0.7;
}
.luxury-retreat-page .oldrectory-gallery {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 3;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: var(--shadow-md);
}
.luxury-retreat-page .oldrectory-gallery-slide {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transition: opacity 1.2s ease-in-out;
    z-index: 1;
}
.luxury-retreat-page .oldrectory-gallery-slide.is-active {
    opacity: 1;
    z-index: 2;
}

/* --- DETAILS / CARDS --- */
.luxury-retreat-page .oldrectory-details {
    background-color: var(--cream);
    padding: 0 0 80px;
}
.luxury-retreat-page .oldrectory-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}
.luxury-retreat-page .oldrectory-card {
    background-color: var(--white);
    border: 1px solid var(--beige);
    border-radius: var(--radius-md);
    padding: 34px 30px;
    transition: transform 0.35s ease, box-shadow 0.35s ease;
}
.luxury-retreat-page .oldrectory-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-sm);
}
.luxury-retreat-page .oldrectory-card-label {
    display: block;
    font-family: var(--font-sans);
    text-transform: uppercase;
    color: var(--terracotta);
    letter-spacing: 3px;
    font-weight: 700;
    font-size: 12px;
    margin-bottom: 14px;
}
.luxury-retreat-page .oldrectory-card-title {
    font-family: var(--font-serif);
    color: var(--olive);
    font-size: 24px;
    line-height: 1.2;
    font-weight: 600;
    margin-bottom: 12px;
}
.luxury-retreat-page .oldrectory-card-text {
    font-family: var(--font-sans);
    color: var(--grey);
    font-size: 15px;
    line-height: 1.7;
}

/* --- CTA --- */
.luxury-retreat-page .oldrectory-cta {
    background-color: var(--cream);
    padding: 0 0 90px;
}
.luxury-retreat-page .oldrectory-cta-inner {
    text-align: center;
    max-width: 640px;
    margin: 0 auto;
    border-top: 1px solid var(--light-border);
    padding-top: 64px;
}
.luxury-retreat-page .oldrectory-cta-title {
    font-family: var(--font-serif);
    color: var(--olive);
    font-size: 40px;
    line-height: 1.1;
    font-weight: 600;
    margin-bottom: 18px;
}
.luxury-retreat-page .oldrectory-cta-text {
    font-family: var(--font-sans);
    color: var(--grey);
    font-size: 17px;
    line-height: 1.7;
    margin-bottom: 30px;
}

/* ==========================================================================
   LUXURY RETREAT — RESPONSIVE
   ========================================================================== */
@media (max-width: 1023px) {
    .luxury-retreat-page .oldrectory-hero-title { font-size: 60px; }
    .luxury-retreat-page .oldrectory-intro-grid {
        grid-template-columns: 1fr;
        gap: 48px;
    }
    .luxury-retreat-page .oldrectory-intro-media { order: 2; }
    .luxury-retreat-page .oldrectory-frame { max-width: 560px; margin: 0 auto; }
    .luxury-retreat-page .oldrectory-paragraph { max-width: none; }
}

@media (max-width: 768px) {
    .luxury-retreat-page .oldrectory-hero { height: 560px; }
    .luxury-retreat-page .oldrectory-hero-content { padding-left: 4px; }
    .luxury-retreat-page .oldrectory-hero-title { font-size: 48px; }
    .luxury-retreat-page .oldrectory-hero-sub { font-size: 18px; }
    .luxury-retreat-page .oldrectory-intro { padding: 56px 0; }
    .luxury-retreat-page .oldrectory-frame { padding: 16px; }
    .luxury-retreat-page .oldrectory-cards { grid-template-columns: 1fr; gap: 20px; }

    /* Match the rest of the site: keep the mobile header visible while scrolling. */
    .luxury-retreat-page {
        padding-top: 116px;
    }
    .luxury-retreat-page .header {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 1000;
        padding: 16px 0;
        background-color: var(--cream);
    }
    .luxury-retreat-page .header.scrolled,
    .luxury-retreat-page .header.scrolled-mobile {
        background-color: rgba(23, 59, 48, 0.96);
        -webkit-backdrop-filter: blur(8px);
        backdrop-filter: blur(8px);
        padding: 12px 0;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.16);
    }
    .luxury-retreat-page .header.scrolled .hamburger span,
    .luxury-retreat-page .header.scrolled-mobile .hamburger span {
        background-color: var(--white);
    }
    .luxury-retreat-page .header.scrolled .logo img,
    .luxury-retreat-page .header.scrolled-mobile .logo img {
        filter: none;
    }

    /* Mobile nav dropdown stays cream + dark text on this page */
    .luxury-retreat-page .nav-list {
        background-color: rgba(246, 241, 232, 0.98);
    }
    .luxury-retreat-page .nav-list .nav-link { color: var(--dark); }
}

@media (max-width: 520px) {
    .luxury-retreat-page { padding-top: 104px; }
    .luxury-retreat-page .oldrectory-hero-title { font-size: 40px; }
    .luxury-retreat-page .oldrectory-heading { font-size: 34px; }
    .luxury-retreat-page .oldrectory-paragraph { font-size: 15px; }
    .luxury-retreat-page .oldrectory-cta-title { font-size: 30px; }
}

/* ==========================================================================
   LUXURY RETREAT — REDUCED MOTION
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
    .luxury-retreat-page .oldrectory-hero-bg { animation: none !important; }
    .luxury-retreat-page .oldrectory-gallery-slide { transition: none !important; }
    .luxury-retreat-page .oldrectory-card { transition: none !important; }
}
/* ==========================================================================
   LUXURY RETREAT — GUEST EXPERIENCES
   (inherits the existing site fonts; no typography/font-variable changes)
   ========================================================================== */
.luxury-retreat-page .oldrectory-guest-experiences {
    background-color: var(--cream);
    padding: 0 0 90px;
}
.luxury-retreat-page .guest-experiences-intro {
    max-width: 640px;
    margin: 0 0 48px;
}

.luxury-retreat-page .guest-experiences-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 56px;
    align-items: stretch;
}

/* LEFT — framed rotating gallery (reuses the .oldrectory-frame treatment) */
.luxury-retreat-page .guest-experiences-media {
    display: flex;
}
.luxury-retreat-page .guest-experiences-media .oldrectory-frame {
    width: 100%;
}
.luxury-retreat-page .guest-experiences-gallery {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 3;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: var(--shadow-md);
}
.luxury-retreat-page .guest-experiences-slide {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    animation: guestExperiencesFade 18s linear infinite;
}
.luxury-retreat-page .guest-experiences-slide:nth-child(1) { animation-delay: 0s; }
.luxury-retreat-page .guest-experiences-slide:nth-child(2) { animation-delay: 6s; }
.luxury-retreat-page .guest-experiences-slide:nth-child(3) { animation-delay: 12s; }

@keyframes guestExperiencesFade {
    0%   { opacity: 0; }
    2%   { opacity: 1; }
    31%  { opacity: 1; }
    33%  { opacity: 0; }
    100% { opacity: 0; }
}

/* RIGHT — verified Airbnb review card */
.luxury-retreat-page .guest-experiences-review-card {
    position: relative;
    background-color: #f5f2ed;
    border: 1px solid var(--light-border);
    border-radius: var(--radius-lg);
    padding: 34px 36px 36px;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
}

.luxury-retreat-page .guest-experiences-verification {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
}
.luxury-retreat-page .guest-experiences-verification-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 2px;
    min-width: 0;
}
.luxury-retreat-page .guest-experiences-verification-title {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    font-family: var(--font-sans);
    font-weight: 700;
    font-size: 14px;
    letter-spacing: 0.3px;
    color: var(--terracotta);
}
.luxury-retreat-page .guest-experiences-verified-badge {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    color: #1D9BF0;
    display: inline-flex;
}
.luxury-retreat-page .guest-experiences-verified-badge svg {
    width: 100%;
    height: 100%;
    display: block;
}
.luxury-retreat-page .guest-experiences-verification-source {
    font-family: var(--font-sans);
    font-size: 12px;
    color: var(--grey);
}

.luxury-retreat-page .guest-experiences-stars {
    display: inline-flex;
    gap: 4px;
    color: var(--gold);
    margin-bottom: 4px;
}
.luxury-retreat-page .guest-experiences-stars svg {
    width: 18px;
    height: 18px;
    display: block;
}

.luxury-retreat-page .guest-experiences-quote {
    display: block;
    font-family: var(--font-serif);
    color: var(--terracotta);
    opacity: 0.28;
    font-size: 72px;
    line-height: 0.6;
    margin: 14px 0 -6px;
}
.luxury-retreat-page .guest-experiences-review-text {
    /* Matches the refined editorial body stack used for paragraph text. */
    font-family: 'Montserrat', 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    color: var(--grey);
    font-size: 15.5px;
    line-height: 1.85;
    font-weight: 400;
    letter-spacing: 0.2px;
    margin: 0 0 26px;
}

.luxury-retreat-page .guest-experiences-divider {
    border: 0;
    border-top: 1px solid var(--light-border);
    margin: auto 0 22px;
    width: 100%;
}

.luxury-retreat-page .guest-experiences-guest {
    display: flex;
    align-items: center;
    gap: 14px;
}
.luxury-retreat-page .guest-experiences-avatar {
    flex: 0 0 auto;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--white);
    box-shadow: var(--shadow-sm);
}
.luxury-retreat-page .guest-experiences-guest-meta {
    display: flex;
    flex-direction: column;
    line-height: 1.3;
}
.luxury-retreat-page .guest-experiences-guest-name {
    font-family: var(--font-serif);
    font-weight: 600;
    font-size: 17px;
    color: var(--olive);
}
.luxury-retreat-page .guest-experiences-guest-date {
    font-family: var(--font-sans);
    font-size: 13px;
    color: var(--grey);
}

/* ==========================================================================
   LUXURY RETREAT — GUEST EXPERIENCES — RESPONSIVE
   ========================================================================== */
@media (max-width: 1023px) {
    .luxury-retreat-page .guest-experiences-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    /* Image first, review card below */
    .luxury-retreat-page .guest-experiences-media { order: 1; }
    .luxury-retreat-page .guest-experiences-review-card { order: 2; }
    .luxury-retreat-page .guest-experiences-media .oldrectory-frame {
        max-width: 560px;
        margin: 0 auto;
    }
    .luxury-retreat-page .guest-experiences-review-card {
        max-width: 620px;
        margin: 0 auto;
        width: 100%;
    }
}

@media (max-width: 768px) {
    .luxury-retreat-page .oldrectory-guest-experiences { padding: 0 0 64px; }
    .luxury-retreat-page .guest-experiences-intro { margin-bottom: 36px; }
    .luxury-retreat-page .guest-experiences-media .oldrectory-frame { padding: 16px; }
    .luxury-retreat-page .guest-experiences-review-card { padding: 26px 22px 28px; }
    .luxury-retreat-page .guest-experiences-quote { font-size: 60px; }
}

@media (max-width: 520px) {
    .luxury-retreat-page .guest-experiences-review-text { font-size: 15px; }
    .luxury-retreat-page .guest-experiences-verification-title { font-size: 13px; }
    .luxury-retreat-page .guest-experiences-quote { font-size: 52px; }
}

/* ==========================================================================
   LUXURY RETREAT — GUEST EXPERIENCES — REDUCED MOTION
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
    .luxury-retreat-page .guest-experiences-slide {
        animation: none !important;
        opacity: 0;
    }
    .luxury-retreat-page .guest-experiences-slide:first-child {
        opacity: 1;
    }
}

/* Guest Experiences — make image frame fit the image */
.luxury-retreat-page .guest-experiences-grid {
    align-items: start;
}

.luxury-retreat-page .guest-experiences-media {
    align-self: start;
    align-items: flex-start;
}

.luxury-retreat-page .guest-experiences-media .oldrectory-frame {
    width: 100%;
    height: auto;
    align-self: flex-start;
    padding: 12px;
}

.luxury-retreat-page .guest-experiences-media .oldrectory-frame::before,
.luxury-retreat-page .guest-experiences-media .oldrectory-frame::after {
    inset: 6px;
}

@media (max-width: 768px) {
    .luxury-retreat-page .guest-experiences-media .oldrectory-frame {
        padding: 10px;
    }

    .luxury-retreat-page .guest-experiences-media .oldrectory-frame::before,
    .luxury-retreat-page .guest-experiences-media .oldrectory-frame::after {
        inset: 5px;
    }
}


/* ==========================================================================
   LUXURY RETREAT — GUEST EXPERIENCES — SWAPPED LAYOUT
   Review card on the LEFT, intro + rotating gallery on the RIGHT (desktop).
   Gallery markup/classes and the CSS-driven rotation are untouched.
   ========================================================================== */
.luxury-retreat-page .guest-experiences-grid--swapped {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 56px;
    align-items: start;
}

/* Right-hand column: intro stacked above the framed gallery */
.luxury-retreat-page .guest-experiences-feature {
    display: flex;
    flex-direction: column;
    gap: 32px;
    min-width: 0;
}

/* Tighten the intro now that it lives inside the right column */
.luxury-retreat-page .guest-experiences-grid--swapped .guest-experiences-intro {
    max-width: 520px;
    margin: 0;
}

.luxury-retreat-page .guest-experiences-grid--swapped .guest-experiences-review-card {
    width: 100%;
}

.luxury-retreat-page .guest-experiences-grid--swapped .guest-experiences-media {
    width: 100%;
}

/* Mobile: stack cleanly — intro + gallery first, review card below.
   Declared after the desktop rule so single-column wins at <=1023px. */
@media (max-width: 1023px) {
    .luxury-retreat-page .guest-experiences-grid--swapped {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    .luxury-retreat-page .guest-experiences-grid--swapped .guest-experiences-feature { order: 1; gap: 24px; }
    .luxury-retreat-page .guest-experiences-grid--swapped .guest-experiences-review-card { order: 2; }
}
/* ==========================================================================
   LUXURY RETREAT — INSIDE OLD RECTORY
   Two-column editorial section beneath Guest Experiences.
   Reuses .oldrectory-rule / .oldrectory-heading / .oldrectory-paragraph /
   .oldrectory-frame so typography and framing match the rest of the page.
   ========================================================================== */
.luxury-retreat-page .oldrectory-inside {
    background-color: var(--cream);
    /* Modest top breathing space so the section is not stacked directly
       under the Guest Experiences image; bottom spacing matches the page. */
    padding: 40px 0 56px;
}

.luxury-retreat-page .oldrectory-inside-grid {
    display: grid;
    /* Left text ~44%, right image ~56% (minmax(0,...) prevents overflow) */
    grid-template-columns: minmax(0, 44fr) minmax(0, 56fr);
    gap: 64px;
    align-items: center;
}

/* Left column — text. Inherits the shared editorial classes above. */
.luxury-retreat-page .oldrectory-inside-content {
    min-width: 0;
}
.luxury-retreat-page .oldrectory-inside-content .oldrectory-paragraph {
    max-width: 480px;
}

/* Right column — framed rotating gallery (matches Guest Experiences frame) */
.luxury-retreat-page .oldrectory-inside-media {
    display: flex;
    min-width: 0;
    align-self: center;
}
.luxury-retreat-page .oldrectory-inside-media .oldrectory-frame {
    width: 100%;
    height: auto;
    padding: 12px;
}
.luxury-retreat-page .oldrectory-inside-media .oldrectory-frame::before,
.luxury-retreat-page .oldrectory-inside-media .oldrectory-frame::after {
    inset: 6px;
}

.luxury-retreat-page .oldrectory-inside-gallery {
    position: relative;
    width: 100%;
    /* Wide, editorial crop similar to the reference */
    aspect-ratio: 3 / 2;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: var(--shadow-md);
}
.luxury-retreat-page .oldrectory-inside-slide {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    /* CSS-only auto-rotation, same crossfade approach as Guest Experiences */
    animation: insideOldRectoryFade 24s linear infinite;
}
.luxury-retreat-page .oldrectory-inside-slide:nth-child(1) { animation-delay: 0s; }
.luxury-retreat-page .oldrectory-inside-slide:nth-child(2) { animation-delay: 6s; }
.luxury-retreat-page .oldrectory-inside-slide:nth-child(3) { animation-delay: 12s; }
.luxury-retreat-page .oldrectory-inside-slide:nth-child(4) { animation-delay: 18s; }

@keyframes insideOldRectoryFade {
    0%   { opacity: 0; }
    2%   { opacity: 1; }
    23%  { opacity: 1; }
    25%  { opacity: 0; }
    100% { opacity: 0; }
}

/* ==========================================================================
   LUXURY RETREAT — INSIDE OLD RECTORY — RESPONSIVE
   ========================================================================== */
@media (max-width: 1023px) {
    .luxury-retreat-page .oldrectory-inside-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    /* Stack vertically: text first, image underneath */
    .luxury-retreat-page .oldrectory-inside-content { order: 1; }
    .luxury-retreat-page .oldrectory-inside-media { order: 2; }
    .luxury-retreat-page .oldrectory-inside-media .oldrectory-frame {
        max-width: 560px;
        margin: 0 auto;
    }
    .luxury-retreat-page .oldrectory-inside-content .oldrectory-paragraph {
        max-width: none;
    }
}

@media (max-width: 768px) {
    .luxury-retreat-page .oldrectory-inside { padding: 28px 0 40px; }
    .luxury-retreat-page .oldrectory-inside-media .oldrectory-frame { padding: 10px; }
    .luxury-retreat-page .oldrectory-inside-media .oldrectory-frame::before,
    .luxury-retreat-page .oldrectory-inside-media .oldrectory-frame::after {
        inset: 5px;
    }
    /* Keep a sensible, not-too-tall crop on smaller screens */
    .luxury-retreat-page .oldrectory-inside-gallery { aspect-ratio: 4 / 3; }
}

@media (max-width: 520px) {
    .luxury-retreat-page .oldrectory-inside { padding: 24px 0 36px; }
}

/* ==========================================================================
   LUXURY RETREAT — INSIDE OLD RECTORY — REDUCED MOTION
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
    .luxury-retreat-page .oldrectory-inside-slide {
        animation: none !important;
        opacity: 0;
    }
    .luxury-retreat-page .oldrectory-inside-slide:first-child {
        opacity: 1;
    }
}
/* ==========================================================================
   LUXURY RETREAT — HALLWAYS AND DINING SPACES
   Four-image slideshow placed between Inside The Old Rectory and Step Outside.
   Desktop layout keeps the image frame on the left and neutral wording on the right.
   ========================================================================== */
.luxury-retreat-page .oldrectory-hallways-dining {
    background-color: var(--cream);
    padding: 0 0 92px;
}

.luxury-retreat-page .oldrectory-hallways-dining-grid {
    display: grid;
    grid-template-columns: minmax(0, 56fr) minmax(0, 44fr);
    gap: 64px;
    align-items: center;
}

.luxury-retreat-page .oldrectory-hallways-dining-media {
    display: flex;
    min-width: 0;
    align-self: center;
}

.luxury-retreat-page .oldrectory-hallways-dining-media .oldrectory-frame {
    width: 100%;
    height: auto;
    padding: 12px;
}

.luxury-retreat-page .oldrectory-hallways-dining-media .oldrectory-frame::before,
.luxury-retreat-page .oldrectory-hallways-dining-media .oldrectory-frame::after {
    inset: 6px;
}

.luxury-retreat-page .oldrectory-hallways-dining-gallery {
    position: relative;
    width: 100%;
    aspect-ratio: 3 / 2;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: var(--shadow-md);
}

.luxury-retreat-page .oldrectory-hallways-dining-slide {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    animation: hallwaysDiningOldRectoryFade 24s linear infinite;
}

.luxury-retreat-page .oldrectory-hallways-dining-slide:nth-child(1) { animation-delay: 0s; }
.luxury-retreat-page .oldrectory-hallways-dining-slide:nth-child(2) { animation-delay: 6s; }
.luxury-retreat-page .oldrectory-hallways-dining-slide:nth-child(3) { animation-delay: 12s; }
.luxury-retreat-page .oldrectory-hallways-dining-slide:nth-child(4) { animation-delay: 18s; }

@keyframes hallwaysDiningOldRectoryFade {
    0%   { opacity: 0; }
    2%   { opacity: 1; }
    23%  { opacity: 1; }
    25%  { opacity: 0; }
    100% { opacity: 0; }
}

.luxury-retreat-page .oldrectory-hallways-dining-content {
    min-width: 0;
}

.luxury-retreat-page .oldrectory-hallways-dining-content .oldrectory-paragraph {
    max-width: 480px;
}

@media (max-width: 1023px) {
    .luxury-retreat-page .oldrectory-hallways-dining-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .luxury-retreat-page .oldrectory-hallways-dining-media { order: 1; }
    .luxury-retreat-page .oldrectory-hallways-dining-content { order: 2; }

    .luxury-retreat-page .oldrectory-hallways-dining-media .oldrectory-frame {
        max-width: 560px;
        margin: 0 auto;
    }

    .luxury-retreat-page .oldrectory-hallways-dining-content .oldrectory-paragraph {
        max-width: none;
    }
}

@media (max-width: 768px) {
    .luxury-retreat-page .oldrectory-hallways-dining { padding: 0 0 64px; }
    .luxury-retreat-page .oldrectory-hallways-dining-media .oldrectory-frame { padding: 10px; }

    .luxury-retreat-page .oldrectory-hallways-dining-media .oldrectory-frame::before,
    .luxury-retreat-page .oldrectory-hallways-dining-media .oldrectory-frame::after {
        inset: 5px;
    }

    .luxury-retreat-page .oldrectory-hallways-dining-gallery { aspect-ratio: 4 / 3; }
}

@media (max-width: 520px) {
    .luxury-retreat-page .oldrectory-hallways-dining { padding: 0 0 56px; }
}

@media (prefers-reduced-motion: reduce) {
    .luxury-retreat-page .oldrectory-hallways-dining-slide {
        animation: none !important;
        opacity: 0;
    }

    .luxury-retreat-page .oldrectory-hallways-dining-slide:first-child {
        opacity: 1;
    }
}

/* ==========================================================================
   LUXURY RETREAT — STEP OUTSIDE
   Full-width cinematic image banner with subtle top-positioned white editorial text.
   Spans the entire browser width (sits outside any .container).
   Heading + subtitle reuse the serif heading system (unchanged fonts).
   ========================================================================== */
.luxury-retreat-page .oldrectory-step-outside {
    position: relative;
    width: 100%;
    /* Cinematic desktop height */
    height: clamp(360px, 46vw, 440px);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    overflow: hidden;
    isolation: isolate;
}

/* Full-bleed background image */
.luxury-retreat-page .oldrectory-step-outside-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    z-index: -2;
}

/* Dark gradient overlay keeps the white text readable over any photo */
.luxury-retreat-page .oldrectory-step-outside-overlay {
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(
            180deg,
            rgba(20, 22, 24, 0.44) 0%,
            rgba(20, 22, 24, 0.18) 34%,
            rgba(20, 22, 24, 0.06) 62%,
            rgba(20, 22, 24, 0.26) 100%
        );
}

/* Subtle top editorial text */
.luxury-retreat-page .oldrectory-step-outside-content {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: var(--max-width);
    margin: 0 auto;
    padding: clamp(34px, 5.5vw, 58px) 24px 0;
    text-align: center;
    color: var(--white);
}
.luxury-retreat-page .oldrectory-step-outside-title {
    /* Same premium serif treatment as the Old Rectory heading system */
    font-family: var(--font-serif);
    color: var(--white);
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.5px;
    margin: 0 0 10px;
    font-size: clamp(34px, 5.4vw, 64px);
    text-shadow: 0 2px 20px rgba(0, 0, 0, 0.42);
}
.luxury-retreat-page .oldrectory-step-outside-sub {
    font-family: var(--font-serif);
    color: var(--white);
    font-weight: 400;
    font-style: italic;
    line-height: 1.4;
    margin: 0;
    opacity: 0.9;
    font-size: clamp(16px, 1.8vw, 22px);
    text-shadow: 0 1px 16px rgba(0, 0, 0, 0.42);
}

/* ==========================================================================
   LUXURY RETREAT — OUTSIDE OLD RECTORY
   Two-column editorial section beneath the Step Outside banner.
   Image (left) + text (right) — mirrors the Inside Old Rectory style and
   reuses .oldrectory-rule / .oldrectory-heading / .oldrectory-paragraph /
   .oldrectory-frame so typography and framing stay consistent.
   ========================================================================== */
.luxury-retreat-page .oldrectory-outside {
    background-color: var(--cream);
    padding: 64px 0 56px;
}

.luxury-retreat-page .oldrectory-outside-grid {
    display: grid;
    /* Left image ~56%, right text ~44% (minmax(0,...) prevents overflow) */
    grid-template-columns: minmax(0, 56fr) minmax(0, 44fr);
    gap: 64px;
    align-items: center;
}

/* Left column — framed rotating gallery (matches the Inside frame) */
.luxury-retreat-page .oldrectory-outside-media {
    display: flex;
    min-width: 0;
    align-self: center;
}
.luxury-retreat-page .oldrectory-outside-media .oldrectory-frame {
    width: 100%;
    height: auto;
    padding: 12px;
}
.luxury-retreat-page .oldrectory-outside-media .oldrectory-frame::before,
.luxury-retreat-page .oldrectory-outside-media .oldrectory-frame::after {
    inset: 6px;
}

/* Right column — text. Inherits the shared editorial classes. */
.luxury-retreat-page .oldrectory-outside-content {
    min-width: 0;
}
.luxury-retreat-page .oldrectory-outside-content .oldrectory-paragraph {
    max-width: 480px;
}

/* Crossfade gallery — same CSS-only approach as Inside Old Rectory */
.luxury-retreat-page .oldrectory-outside-gallery {
    position: relative;
    width: 100%;
    aspect-ratio: 3 / 2;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: var(--shadow-md);
}
.luxury-retreat-page .oldrectory-outside-slide {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    animation: outsideOldRectoryFade 24s linear infinite;
}
.luxury-retreat-page .oldrectory-outside-slide:nth-child(1) { animation-delay: 0s; }
.luxury-retreat-page .oldrectory-outside-slide:nth-child(2) { animation-delay: 6s; }
.luxury-retreat-page .oldrectory-outside-slide:nth-child(3) { animation-delay: 12s; }
.luxury-retreat-page .oldrectory-outside-slide:nth-child(4) { animation-delay: 18s; }

@keyframes outsideOldRectoryFade {
    0%   { opacity: 0; }
    2%   { opacity: 1; }
    23%  { opacity: 1; }
    25%  { opacity: 0; }
    100% { opacity: 0; }
}

/* ==========================================================================
   LUXURY RETREAT — STEP OUTSIDE / OUTSIDE OLD RECTORY — RESPONSIVE
   ========================================================================== */
@media (max-width: 1023px) {
    .luxury-retreat-page .oldrectory-outside-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    /* Stack vertically: image first, text underneath */
    .luxury-retreat-page .oldrectory-outside-media { order: 1; }
    .luxury-retreat-page .oldrectory-outside-content { order: 2; }
    .luxury-retreat-page .oldrectory-outside-media .oldrectory-frame {
        max-width: 560px;
        margin: 0 auto;
    }
    .luxury-retreat-page .oldrectory-outside-content .oldrectory-paragraph {
        max-width: none;
    }
}

@media (max-width: 768px) {
    /* Elegant but slightly shorter banner on smaller screens */
    .luxury-retreat-page .oldrectory-step-outside {
        height: clamp(300px, 56vw, 360px);
    }

    .luxury-retreat-page .oldrectory-outside { padding: 48px 0 48px; }
    .luxury-retreat-page .oldrectory-outside-media .oldrectory-frame { padding: 10px; }
    .luxury-retreat-page .oldrectory-outside-media .oldrectory-frame::before,
    .luxury-retreat-page .oldrectory-outside-media .oldrectory-frame::after {
        inset: 5px;
    }
    /* Mobile-friendly aspect ratio */
    .luxury-retreat-page .oldrectory-outside-gallery { aspect-ratio: 4 / 3; }
}

@media (max-width: 520px) {
    .luxury-retreat-page .oldrectory-step-outside { height: 300px; }
    .luxury-retreat-page .oldrectory-step-outside-content { padding-top: 30px; }
    .luxury-retreat-page .oldrectory-outside { padding: 40px 0 40px; }
}

/* ==========================================================================
   LUXURY RETREAT — OUTSIDE OLD RECTORY / STEP OUTSIDE — REDUCED MOTION
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
    .luxury-retreat-page .oldrectory-outside-slide {
        animation: none !important;
        opacity: 0;
    }
    .luxury-retreat-page .oldrectory-outside-slide:first-child {
        opacity: 1;
    }
}

/* ==========================================================================
   LUXURY RETREAT — SHEPHERD HUTS
   Framed feature placed between Outside The Old Rectory and Elevate Your Stay.
   It reads as an extension of the grounds/accommodation story while reusing
   the same editorial typography and .oldrectory-frame treatment.
   ========================================================================== */
.luxury-retreat-page .oldrectory-shepherd-huts {
    background-color: var(--cream);
    padding: 0 0 90px;
}

.luxury-retreat-page .oldrectory-shepherd-huts-grid {
    display: grid;
    grid-template-columns: minmax(0, 44fr) minmax(0, 56fr);
    gap: 64px;
    align-items: center;
}

.luxury-retreat-page .oldrectory-shepherd-huts-content {
    min-width: 0;
}

.luxury-retreat-page .oldrectory-shepherd-huts-content .oldrectory-paragraph {
    max-width: 520px;
}

.luxury-retreat-page .oldrectory-shepherd-huts-kicker {
    display: block;
    margin-bottom: 12px;
    color: var(--terracotta);
    font-family: var(--font-sans);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2.4px;
    line-height: 1.4;
    text-transform: uppercase;
}

.luxury-retreat-page .oldrectory-shepherd-huts-media {
    display: flex;
    min-width: 0;
    align-self: center;
}

.luxury-retreat-page .oldrectory-shepherd-huts-media .oldrectory-frame {
    width: 100%;
    height: auto;
    padding: 12px;
}

.luxury-retreat-page .oldrectory-shepherd-huts-media .oldrectory-frame::before,
.luxury-retreat-page .oldrectory-shepherd-huts-media .oldrectory-frame::after {
    inset: 6px;
}

.luxury-retreat-page .oldrectory-shepherd-huts-gallery {
    position: relative;
    width: 100%;
    aspect-ratio: 3 / 2;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: var(--shadow-md);
}

.luxury-retreat-page .oldrectory-shepherd-huts-slide {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    animation: shepherdHutsFade 18s linear infinite;
}

.luxury-retreat-page .oldrectory-shepherd-huts-slide:nth-child(1) { animation-delay: 0s; }
.luxury-retreat-page .oldrectory-shepherd-huts-slide:nth-child(2) { animation-delay: 6s; }
.luxury-retreat-page .oldrectory-shepherd-huts-slide:nth-child(3) { animation-delay: 12s; }

@keyframes shepherdHutsFade {
    0%   { opacity: 0; }
    2%   { opacity: 1; }
    31%  { opacity: 1; }
    33%  { opacity: 0; }
    100% { opacity: 0; }
}

@media (max-width: 1023px) {
    .luxury-retreat-page .oldrectory-shepherd-huts-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    .luxury-retreat-page .oldrectory-shepherd-huts-content { order: 1; }
    .luxury-retreat-page .oldrectory-shepherd-huts-media { order: 2; }
    .luxury-retreat-page .oldrectory-shepherd-huts-media .oldrectory-frame {
        max-width: 560px;
        margin: 0 auto;
    }
    .luxury-retreat-page .oldrectory-shepherd-huts-content .oldrectory-paragraph {
        max-width: none;
    }
}

@media (max-width: 768px) {
    .luxury-retreat-page .oldrectory-shepherd-huts { padding: 0 0 64px; }
    .luxury-retreat-page .oldrectory-shepherd-huts-media .oldrectory-frame { padding: 10px; }
    .luxury-retreat-page .oldrectory-shepherd-huts-media .oldrectory-frame::before,
    .luxury-retreat-page .oldrectory-shepherd-huts-media .oldrectory-frame::after {
        inset: 5px;
    }
    .luxury-retreat-page .oldrectory-shepherd-huts-gallery { aspect-ratio: 4 / 3; }
}

@media (max-width: 520px) {
    .luxury-retreat-page .oldrectory-shepherd-huts { padding: 0 0 56px; }
}

@media (prefers-reduced-motion: reduce) {
    .luxury-retreat-page .oldrectory-shepherd-huts-slide {
        animation: none !important;
        opacity: 0;
    }
    .luxury-retreat-page .oldrectory-shepherd-huts-slide:first-child {
        opacity: 1;
    }
}

/* ==========================================================================
   LUXURY RETREAT — ELEVATE YOUR STAY
   Two-column editorial section beneath the Shepherd Huts feature.
   Editorial text + bespoke service icons (left) and a two-image framed
   slideshow (right). Reuses .oldrectory-rule / .oldrectory-heading /
   .oldrectory-paragraph / .oldrectory-frame so typography and framing
   stay consistent with the rest of the page.
   ========================================================================== */
.luxury-retreat-page .oldrectory-elevate {
    background-color: var(--cream);
    padding: 64px 0 90px;
}

.luxury-retreat-page .oldrectory-elevate-grid {
    display: grid;
    /* Left text ~46%, right image ~54% (minmax(0,...) prevents overflow) */
    grid-template-columns: minmax(0, 46fr) minmax(0, 54fr);
    gap: 64px;
    align-items: center;
}

/* Left column — editorial text. Inherits the shared editorial classes. */
.luxury-retreat-page .oldrectory-elevate-content {
    min-width: 0;
}
.luxury-retreat-page .oldrectory-elevate-content .oldrectory-paragraph {
    max-width: 520px;
}

/* Bespoke service icon row */
.luxury-retreat-page .oldrectory-elevate-services {
    list-style: none;
    margin: 40px 0 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
}
.luxury-retreat-page .oldrectory-elevate-service {
    position: relative;
    flex: 1 1 0;
    min-width: 88px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 14px;
    padding: 4px 18px;
}
/* Thin terracotta-toned divider between adjacent service items */
.luxury-retreat-page .oldrectory-elevate-service + .oldrectory-elevate-service::before {
    content: '';
    position: absolute;
    left: 0;
    top: 6px;
    bottom: 6px;
    width: 1px;
    background-color: var(--light-border);
}
.luxury-retreat-page .oldrectory-elevate-service-icon {
    color: var(--terracotta);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
}
.luxury-retreat-page .oldrectory-elevate-service-icon svg {
    width: 100%;
    height: 100%;
    display: block;
}
.luxury-retreat-page .oldrectory-elevate-service-label {
    font-family: var(--font-sans);
    font-size: 13px;
    line-height: 1.4;
    color: var(--olive);
    letter-spacing: 0.3px;
}

/* Right column — two-image framed slideshow (matches the Outside/Inside frame) */
.luxury-retreat-page .oldrectory-elevate-media {
    display: flex;
    min-width: 0;
    align-self: center;
}
.luxury-retreat-page .oldrectory-elevate-media .oldrectory-frame {
    width: 100%;
    height: auto;
    padding: 12px;
}
.luxury-retreat-page .oldrectory-elevate-media .oldrectory-frame::before,
.luxury-retreat-page .oldrectory-elevate-media .oldrectory-frame::after {
    inset: 6px;
}

/* Two-image crossfade gallery */
.luxury-retreat-page .oldrectory-elevate-gallery {
    position: relative;
    width: 100%;
    aspect-ratio: 3 / 2;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: var(--shadow-md);
}

.luxury-retreat-page .oldrectory-elevate-slide {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    opacity: 0;
    animation: elevateYourStayFade 12s linear infinite;
}

.luxury-retreat-page .oldrectory-elevate-slide:nth-child(1) { animation-delay: 0s; }
.luxury-retreat-page .oldrectory-elevate-slide:nth-child(2) { animation-delay: 6s; }

@keyframes elevateYourStayFade {
    0%   { opacity: 0; }
    4%   { opacity: 1; }
    46%  { opacity: 1; }
    50%  { opacity: 0; }
    100% { opacity: 0; }
}

/* ==========================================================================
   LUXURY RETREAT — ELEVATE YOUR STAY — RESPONSIVE
   Stacks neatly with the text first and the image underneath.
   ========================================================================== */
@media (max-width: 1023px) {
    .luxury-retreat-page .oldrectory-elevate-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    /* Stack vertically: text first, image underneath */
    .luxury-retreat-page .oldrectory-elevate-content { order: 1; }
    .luxury-retreat-page .oldrectory-elevate-media { order: 2; }
    .luxury-retreat-page .oldrectory-elevate-media .oldrectory-frame {
        max-width: 560px;
        margin: 0 auto;
    }
    .luxury-retreat-page .oldrectory-elevate-content .oldrectory-paragraph {
        max-width: none;
    }
}

@media (max-width: 768px) {
    .luxury-retreat-page .oldrectory-elevate { padding: 48px 0 64px; }
    .luxury-retreat-page .oldrectory-elevate-media .oldrectory-frame { padding: 10px; }
    .luxury-retreat-page .oldrectory-elevate-media .oldrectory-frame::before,
    .luxury-retreat-page .oldrectory-elevate-media .oldrectory-frame::after {
        inset: 5px;
    }
    /* Mobile-friendly aspect ratio */
    .luxury-retreat-page .oldrectory-elevate-gallery { aspect-ratio: 4 / 3; }
    .luxury-retreat-page .oldrectory-elevate-services { margin-top: 32px; }
    .luxury-retreat-page .oldrectory-elevate-service { padding: 4px 12px; }
}

@media (max-width: 520px) {
    .luxury-retreat-page .oldrectory-elevate { padding: 40px 0 56px; }
    /* Tidy two-by-two service grid so labels never crush on small screens */
    .luxury-retreat-page .oldrectory-elevate-services {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 28px 12px;
    }
    .luxury-retreat-page .oldrectory-elevate-service {
        min-width: 0;
        padding: 4px 8px;
    }
    /* Vertical dividers don't suit the 2x2 layout — remove them cleanly */
    .luxury-retreat-page .oldrectory-elevate-service + .oldrectory-elevate-service::before {
        display: none;
    }
}

/* ==========================================================================
   LUXURY RETREAT — ELEVATE YOUR STAY — REDUCED MOTION
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
    .luxury-retreat-page .oldrectory-elevate-content,
    .luxury-retreat-page .oldrectory-elevate-media {
        transition: none !important;
    }
    .luxury-retreat-page .oldrectory-elevate-slide {
        animation: none !important;
        opacity: 0;
    }
    .luxury-retreat-page .oldrectory-elevate-slide:first-child {
        opacity: 1;
    }
}
/* ==========================================================================
   ADDED FEATURES — Holt Accommodation updates
   (Scoped additions. Reuses existing brand variables and button system.)
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Old Rectory luxury section — dual CTA buttons
   -------------------------------------------------------------------------- */
.luxury-content-actions {
    display: flex;
    flex-wrap: wrap;            /* allow clean wrap on small screens */
    justify-content: center;
    align-items: center;
    gap: 14px;
}
/* Stack the buttons full-width-ish on narrow phones so they never overflow */
@media (max-width: 520px) {
    .luxury-content-actions {
        flex-direction: column;
        gap: 12px;
        width: 100%;
    }
    .luxury-content-actions .btn {
        width: 100%;
        max-width: 320px;
    }
}

/* --------------------------------------------------------------------------
   3. Header navigation — "Stay With Us" dropdown
   -------------------------------------------------------------------------- */
.nav-item-dropdown {
    position: relative;
}
/* Transparent bridge so the hover doesn't drop across the small gap */
.nav-item-dropdown::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    height: 14px;
}
.nav-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: 12px;
    min-width: 210px;
    padding: 8px 0;
    list-style: none;
    background-color: var(--forest);
    border: 1px solid rgba(218, 223, 215, 0.18);  /* subtle beige hairline */
    border-radius: 8px;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.28);
    z-index: 1200;
    /* Smooth hover/focus reveal */
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: opacity 0.28s ease, transform 0.28s ease, visibility 0.28s ease;
}
.nav-item-dropdown:hover .nav-dropdown,
.nav-item-dropdown:focus-within .nav-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.nav-dropdown li {
    list-style: none;
}
.nav-dropdown-link {
    display: block;
    padding: 11px 22px;
    color: var(--white);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 600;
    white-space: nowrap;
    transition: background-color 0.25s ease, color 0.25s ease;
}
.nav-dropdown-link:hover,
.nav-dropdown-link:focus-visible {
    background-color: var(--olive);
    color: var(--beige);
}

/* Mobile: render the dropdown inline within the open hamburger menu flow */
@media (max-width: 768px) {
    .nav-item-dropdown {
        position: static;
        width: 100%;
    }
    .nav-item-dropdown::after {
        display: none;
    }
    .nav-dropdown {
        position: static;
        opacity: 1;
        visibility: visible;
        transform: none;
        margin: 10px auto 0;
        padding: 6px 0;
        min-width: 0;
        width: 100%;
        max-width: 100%;
        background-color: rgba(0, 0, 0, 0.2);
        border: none;
        border-radius: 6px;
        box-shadow: none;
    }
    .nav-dropdown-link {
        text-align: center;
        white-space: normal;
        padding: 10px 12px;
        font-size: 11px;
    }
}

/* Respect reduced-motion preference for the dropdown reveal */
@media (prefers-reduced-motion: reduce) {
    .nav-dropdown {
        transition: none;
    }
}

/* --------------------------------------------------------------------------
   4. Business accommodation — two-slide crossfade image frame
   -------------------------------------------------------------------------- */
.business-simple__image-slider {
    position: relative;
    overflow: hidden;
    width: 100%;
    border-radius: 40px;
    line-height: 0;            /* removes inline-image whitespace */
}
.business-simple__image-slide {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    border-radius: 40px;
    opacity: 0;
    transition: opacity 1s ease;
}
/* First slide stays in normal flow to define the frame height (no layout jump) */
.business-simple__image-slider .business-simple__image-slide:first-child {
    position: relative;
}
/* Subsequent slides stack on top, filling the frame */
.business-simple__image-slider .business-simple__image-slide + .business-simple__image-slide {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}
.business-simple__image-slide.is-active {
    opacity: 1;
}

/* When the business image uses the shared Old Rectory media frame,
   keep both slides locked to the same 600px inner frame. */
.media-card-frame__inner.business-simple__image-slider {
    line-height: normal;
}
.media-card-frame__inner.business-simple__image-slider .business-simple__image-slide,
.media-card-frame__inner.business-simple__image-slider .business-simple__image-slide:first-child,
.media-card-frame__inner.business-simple__image-slider .business-simple__image-slide + .business-simple__image-slide {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 0;
}

/* If reduced motion is on, JS won't rotate — make sure the first slide shows */
@media (prefers-reduced-motion: reduce) {
    .business-simple__image-slide {
        transition: none;
    }
}

/* --------------------------------------------------------------------------
   5. Guest testimonials — Airbnb call-to-action button
   -------------------------------------------------------------------------- */
.airbnb-cta-wrapper {
    display: flex;
    justify-content: center;
    margin-top: 36px;
}
.airbnb-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 14px 30px;
    background-color: #FF5A5F;          /* Airbnb brand colour */
    color: var(--white);
    border-radius: 4px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    box-shadow: 0 6px 18px rgba(255, 90, 95, 0.28);
    transition: background-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
}
.airbnb-cta:hover,
.airbnb-cta:focus-visible {
    background-color: #e0484d;           /* slightly darker on hover */
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(255, 90, 95, 0.4);
}
@media (max-width: 520px) {
    .airbnb-cta-wrapper { margin-top: 26px; }
    .airbnb-cta { padding: 12px 24px; }
}
@media (prefers-reduced-motion: reduce) {
    .airbnb-cta { transition: background-color 0.3s ease; }
    .airbnb-cta:hover,
    .airbnb-cta:focus-visible { transform: none; }
}

/* --------------------------------------------------------------------------
   2. Luxury Retreat — circular reviewer profile image in verified header
   -------------------------------------------------------------------------- */
.luxury-retreat-page .guest-review-profile {
    flex: 0 0 auto;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    overflow: hidden;
    border: 2px solid var(--beige);
    box-shadow: var(--shadow-sm);
    align-self: center;
}
.luxury-retreat-page .guest-review-profile img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 50%;
}
@media (max-width: 520px) {
    .luxury-retreat-page .guest-review-profile {
        width: 36px;
        height: 36px;
    }
}

/* --------------------------------------------------------------------------
   6. Meet The Team — restore full-colour images on MOBILE only
   (Desktop/tablet keep the existing grey/tinted styling.)
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {
    .meet-team-page .team-img,
    .meet-team-page .team-card:hover .team-img,
    .meet-team-page .team-card:focus .team-img,
    .meet-team-page .team-card:focus-within .team-img,
    .meet-team-page .team-grid:hover .team-card:not(:hover) .team-img {
        filter: none !important;
    }
}
/* ==========================================================================
   LUXURY RETREAT — INTERESTED IN STAYING? (BOOKING CTA)
   Luxury split layout placed directly beneath Elevate Your Stay.
   Desktop: image left / cream content right (two columns).
   Tablet & mobile: image stacks above the content.
   Reuses the brand palette, serif headings and editorial spacing.
   ========================================================================== */
.luxury-retreat-page .oldrectory-stay-cta {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: stretch;
    background-color: var(--cream);
    overflow: hidden;
}

/* LEFT — full-bleed lifestyle/property image, cropped to fill its half */
.luxury-retreat-page .oldrectory-stay-cta__image {
    position: relative;
    min-height: 480px;
    overflow: hidden;
}
.luxury-retreat-page .oldrectory-stay-cta__image img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
/* Soft fade from the image into the "Ready to escape / Interested in staying" content */
.luxury-retreat-page .oldrectory-stay-cta__image::after {
    content: '';
    position: absolute;
    top: 0;
    right: -1px;
    width: min(24vw, 180px);
    height: 100%;
    background: linear-gradient(to right, rgba(245, 242, 237, 0) 0%, var(--cream) 100%);
    pointer-events: none;
    z-index: 2;
}

/* RIGHT — warm cream content area */
.luxury-retreat-page .oldrectory-stay-cta__content {
    background-color: var(--cream);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding: 80px clamp(28px, 6vw, 88px);
}

/* Small uppercase eyebrow label */
.luxury-retreat-page .oldrectory-stay-cta__eyebrow {
    display: block;
    font-family: var(--font-sans);
    text-transform: uppercase;
    color: var(--terracotta);
    letter-spacing: 6px;
    font-weight: 700;
    font-size: 14px;
}

/* Decorative divider — line + compass mark + line (editorial style) */
.luxury-retreat-page .oldrectory-stay-cta__divider {
    display: flex;
    align-items: center;
    gap: 14px;
    width: 100%;
    max-width: 280px;
    margin: 22px 0 28px;
    color: var(--terracotta);
}
.luxury-retreat-page .oldrectory-stay-cta__divider-line {
    flex: 1 1 auto;
    height: 1px;
    background-color: var(--terracotta);
    opacity: 0.55;
}
.luxury-retreat-page .oldrectory-stay-cta__divider svg {
    flex: 0 0 auto;
    display: block;
}

/* Serif heading */
.luxury-retreat-page .oldrectory-stay-cta__title {
    font-family: var(--font-serif);
    color: var(--olive);
    font-size: 44px;
    line-height: 1.1;
    font-weight: 600;
    margin: 0 0 22px;
}

/* Body copy */
.luxury-retreat-page .oldrectory-stay-cta__text {
    font-family: var(--font-sans);
    color: var(--grey);
    font-size: 16px;
    line-height: 1.85;
    font-weight: 400;
    letter-spacing: 0.2px;
    max-width: 460px;
    margin: 0 0 36px;
}

/* Airbnb-style booking button */
.luxury-retreat-page .oldrectory-stay-cta__button {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    background-color: #FF5A5F;
    color: var(--white);
    font-family: var(--font-sans);
    font-weight: 700;
    font-size: 14px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    padding: 16px 34px;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(255, 90, 95, 0.30);
    transition: background-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
}
.luxury-retreat-page .oldrectory-stay-cta__button:hover,
.luxury-retreat-page .oldrectory-stay-cta__button:focus-visible {
    background-color: #E64B50;
    transform: translateY(-2px);
    box-shadow: 0 12px 28px rgba(255, 90, 95, 0.40);
    color: var(--white);
}
.luxury-retreat-page .oldrectory-stay-cta__button-icon {
    flex: 0 0 auto;
    display: block;
}
/* Preferred direct-booking button (brand green) sits beside the Airbnb button */
.luxury-retreat-page .oldrectory-stay-cta__button--direct {
    background-color: var(--olive);
    box-shadow: 0 8px 22px rgba(23, 59, 48, 0.30);
    margin-right: 14px;
}
.luxury-retreat-page .oldrectory-stay-cta__button--direct:hover,
.luxury-retreat-page .oldrectory-stay-cta__button--direct:focus-visible {
    background-color: var(--forest);
    box-shadow: 0 12px 28px rgba(23, 59, 48, 0.40);
}
@media (max-width: 600px) {
    .luxury-retreat-page .oldrectory-stay-cta__button--direct {
        margin-right: 0;
        margin-bottom: 14px;
    }
}
/* Hero location pill */
.luxury-retreat-page .oldrectory-hero-location {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-top: 18px;
    padding: 7px 16px;
    border-radius: 999px;
    background-color: rgba(245, 242, 237, 0.16);
    border: 1px solid rgba(245, 242, 237, 0.30);
    color: var(--cream);
    font-family: var(--font-sans);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
    backdrop-filter: blur(2px);
}
.luxury-retreat-page .oldrectory-hero-location svg { flex: 0 0 auto; }

/* --- TABLET & MOBILE: stack image above content --- */
@media (max-width: 1023px) {
    .luxury-retreat-page .oldrectory-stay-cta {
        grid-template-columns: 1fr;
    }
    .luxury-retreat-page .oldrectory-stay-cta__image {
        min-height: 340px;
    }
    .luxury-retreat-page .oldrectory-stay-cta__image::after {
        top: auto;
        right: 0;
        bottom: -1px;
        width: 100%;
        height: min(28vw, 140px);
        background: linear-gradient(to bottom, rgba(245, 242, 237, 0) 0%, var(--cream) 100%);
    }
    .luxury-retreat-page .oldrectory-stay-cta__content {
        padding: 56px clamp(24px, 7vw, 56px);
    }
}

@media (max-width: 768px) {
    .luxury-retreat-page .oldrectory-stay-cta__image {
        min-height: 280px;
    }
    .luxury-retreat-page .oldrectory-stay-cta__content {
        padding: 48px 24px;
    }
    .luxury-retreat-page .oldrectory-stay-cta__title {
        font-size: 34px;
    }
    .luxury-retreat-page .oldrectory-stay-cta__text {
        font-size: 15px;
    }
}

@media (max-width: 520px) {
    .luxury-retreat-page .oldrectory-stay-cta__image {
        min-height: 240px;
    }
    .luxury-retreat-page .oldrectory-stay-cta__content {
        padding: 40px 20px;
    }
    .luxury-retreat-page .oldrectory-stay-cta__button {
        width: 100%;
        justify-content: center;
    }
}

/* --- REDUCED MOTION --- */
@media (prefers-reduced-motion: reduce) {
    .luxury-retreat-page .oldrectory-stay-cta__button {
        transition: none !important;
    }
    .luxury-retreat-page .oldrectory-stay-cta__button:hover,
    .luxury-retreat-page .oldrectory-stay-cta__button:focus-visible {
        transform: none !important;
    }
}

/* ===========================================================================
   Client Reviews Carousel — sits directly under Companies We’re Proud to Support
   =========================================================================== */

.trusted-logos--with-client-reviews {
    padding-bottom: 44px;
}

.client-reviews {
    background-color: var(--cream);
    overflow: hidden;
    position: relative;
}

.client-reviews.section-padding {
    padding-top: 0;
    padding-bottom: 100px;
}

.client-reviews__header {
    margin-bottom: 34px;
}

.client-reviews__label-row p {
    color: var(--terracotta);
}

.client-reviews__marquee {
    padding: 8px 0 24px;
}

.client-reviews__track {
    animation: clientReviewsMarquee 48s linear infinite;
}

.client-reviews__marquee:hover .client-reviews__track {
    animation-play-state: paused;
}

@keyframes clientReviewsMarquee {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}

.client-review-card {
    flex: 0 0 370px;
    min-height: 470px;
    display: flex;
    flex-direction: column;
}

.client-review-card__text {
    text-align: left;
    margin-bottom: 22px;
}

.client-review-card .guest-review-card__divider {
    margin-top: auto;
}

.client-review-card__client {
    justify-content: flex-start;
}

.client-review-card__avatar {
    flex: 0 0 auto;
}

.client-reviews__footer {
    margin-top: 8px;
}

@media (max-width: 1023px) {
    .trusted-logos--with-client-reviews {
        padding-bottom: 36px;
    }

    .client-review-card {
        flex-basis: 340px;
        min-height: 500px;
    }
}

@media (max-width: 768px) {
    .trusted-logos--with-client-reviews {
        padding-bottom: 32px;
    }

    .client-reviews.section-padding {
        padding-bottom: 72px;
    }

    .client-reviews__track {
        gap: 18px;
        animation-duration: 40s;
    }

    .client-review-card {
        flex-basis: 300px;
        min-height: 560px;
    }
}

@media (max-width: 520px) {
    .client-reviews.section-padding {
        padding-bottom: 64px;
    }

    .client-review-card {
        flex-basis: 280px;
        min-height: 590px;
    }

    .client-review-card__text {
        font-size: 13.5px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .client-reviews__track {
        animation: none !important;
        transform: none !important;
    }
}

/* ========================================================================== 
   Client requested updates — Home From Home, Reviews, and Old Rectory
   ========================================================================== */

/* Home From Home: match the framed image treatment used on the homepage media cards. */
.home4home-page .h4h-hero-slider,
.home4home-page .h4h-photo {
    border: 1px solid var(--beige);
    border-radius: 60px;
    padding: 32px;
    background: transparent;
    box-shadow: none;
    overflow: hidden;
}

.home4home-page .h4h-hero-slider::before,
.home4home-page .h4h-photo::before {
    content: '';
    position: absolute;
    inset: 32px;
    z-index: 0;
    border-radius: 40px;
    background: linear-gradient(135deg, #f5f2ed 0%, #dadfd7 100%);
    pointer-events: none;
}

.home4home-page .h4h-hero-slider::after {
    inset: 32px;
    border-radius: 40px;
    overflow: hidden;
    background: linear-gradient(to right, rgba(246, 241, 232, 0.38) 0%, rgba(246, 241, 232, 0) 24%);
}

.home4home-page .h4h-slide {
    inset: 32px;
    width: calc(100% - 64px);
    height: calc(100% - 64px);
    border-radius: 40px;
    overflow: hidden;
}

.home4home-page .h4h-hero-slider .h4h-photo-fallback {
    inset: 32px;
    border-radius: 40px;
}

.home4home-page .h4h-photo {
    aspect-ratio: 1 / 1;
    width: 100%;
    max-width: 540px;
    min-height: 0 !important;
    justify-self: center;
}

.home4home-page .h4h-photo img,
.home4home-page .h4h-photo .h4h-photo-fallback {
    inset: 32px;
    width: calc(100% - 64px);
    height: calc(100% - 64px);
    border-radius: 40px;
    overflow: hidden;
}

/* Home From Home: make this line a supporting subtitle, with the points below remaining the focus. */
.home4home-page .h4h-reasons-subtitle {
    font-family: var(--font-sans);
    font-size: clamp(15.5px, 1.35vw, 18px);
    font-weight: 500;
    line-height: 1.65;
    color: var(--grey);
    margin: 0 0 12px;
    max-width: 560px;
}

.home4home-page .h4h-reasons-label {
    margin-top: 10px;
}

/* Homepage client review cards: remove profile image slots and Google review metadata. */
.client-review-card__avatar,
.client-review-card__client p {
    display: none !important;
}

.client-review-card__client {
    gap: 0;
    align-items: flex-start;
}

.client-review-card__client > div {
    width: 100%;
}

/* Old Rectory section: use the green brand accent instead of the brown/terracotta accent. */
.luxury-curated .luxury-title .text-olive,
.luxury-curated .luxury-divider,
.luxury-curated .luxury-label {
    color: var(--olive);
}

.luxury-curated .luxury-line {
    background-color: rgba(92, 109, 81, 0.35);
}

@media (max-width: 768px) {
    .home4home-page .h4h-hero-slider,
    .home4home-page .h4h-photo {
        border-radius: 48px;
        padding: 24px;
    }

    .home4home-page .h4h-hero-slider::before,
    .home4home-page .h4h-photo::before,
    .home4home-page .h4h-hero-slider::after,
    .home4home-page .h4h-hero-slider .h4h-photo-fallback {
        inset: 24px;
        border-radius: 32px;
    }

    .home4home-page .h4h-slide,
    .home4home-page .h4h-photo img,
    .home4home-page .h4h-photo .h4h-photo-fallback {
        inset: 24px;
        width: calc(100% - 48px);
        height: calc(100% - 48px);
        border-radius: 32px;
    }
}

@media (max-width: 520px) {
    .home4home-page .h4h-hero-slider,
    .home4home-page .h4h-photo {
        border-radius: 40px;
        padding: 16px;
    }

    .home4home-page .h4h-hero-slider::before,
    .home4home-page .h4h-photo::before,
    .home4home-page .h4h-hero-slider::after,
    .home4home-page .h4h-hero-slider .h4h-photo-fallback {
        inset: 16px;
        border-radius: 28px;
    }

    .home4home-page .h4h-slide,
    .home4home-page .h4h-photo img,
    .home4home-page .h4h-photo .h4h-photo-fallback {
        inset: 16px;
        width: calc(100% - 32px);
        height: calc(100% - 32px);
        border-radius: 28px;
    }
}



/* ==========================================================================
   KEMTON UPDATES — Corporate contact form, homepage green accent & Shepherd Huts
   ========================================================================== */
.corporate-stays-page .corporate-contact {
    padding-top: 84px;
    padding-bottom: 96px;
}

.corporate-stays-page .corporate-contact-inner {
    display: block;
    max-width: 1120px;
    margin: 0 auto;
}

.corporate-stays-page .corporate-contact-copy {
    text-align: center;
    max-width: 760px;
    margin: 0 auto 34px;
}

.corporate-stays-page .corporate-contact-copy h2 {
    margin-bottom: 14px;
}

.corporate-stays-page .corporate-contact-copy p {
    max-width: 680px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0;
}

.corporate-stays-page .corporate-savings-note-wrap {
    display: none;
}

.corporate-stays-page .corporate-form-card,
.corporate-stays-page .corporate-form-card:hover,
.corporate-stays-page .corporate-form-card:focus-within {
    max-width: none;
    width: 100%;
    margin-left: 0;
}

.corporate-stays-page .corporate-form-card--heartbeat {
    position: relative;
    isolation: isolate;
    padding: clamp(22px, 3vw, 34px);
    border: 1px solid rgba(92, 109, 81, 0.24);
    border-radius: 24px;
    box-shadow: 0 20px 58px rgba(23, 59, 48, 0.11),
                0 0 0 0 rgba(92, 109, 81, 0.28);
    animation: corporateHeartbeatGlow 2.8s ease-in-out infinite;
}

.corporate-stays-page .corporate-form-card--heartbeat::before {
    content: "";
    position: absolute;
    inset: -8px;
    border-radius: 30px;
    border: 1px solid rgba(92, 109, 81, 0.18);
    pointer-events: none;
    opacity: 0.55;
    animation: corporateHeartbeatRing 2.8s ease-in-out infinite;
    z-index: -1;
}

.corporate-stays-page .corporate-form-card--heartbeat.is-being-used {
    animation-play-state: paused;
    box-shadow: 0 22px 64px rgba(23, 59, 48, 0.16),
                0 0 0 5px rgba(92, 109, 81, 0.18);
}

@keyframes corporateHeartbeatGlow {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 20px 58px rgba(23, 59, 48, 0.11),
                    0 0 0 0 rgba(92, 109, 81, 0.30);
    }
    14% {
        transform: scale(1.006);
        box-shadow: 0 24px 68px rgba(23, 59, 48, 0.15),
                    0 0 0 8px rgba(92, 109, 81, 0.18);
    }
    28% {
        transform: scale(1);
        box-shadow: 0 20px 58px rgba(23, 59, 48, 0.11),
                    0 0 0 0 rgba(92, 109, 81, 0.20);
    }
    42% {
        transform: scale(1.004);
        box-shadow: 0 22px 62px rgba(23, 59, 48, 0.14),
                    0 0 0 6px rgba(92, 109, 81, 0.14);
    }
}

@keyframes corporateHeartbeatRing {
    0%, 100% { transform: scale(1); opacity: 0.45; }
    18%      { transform: scale(1.015); opacity: 0.80; }
    34%      { transform: scale(1.025); opacity: 0.25; }
    52%      { transform: scale(1.012); opacity: 0.65; }
}

.corporate-stays-page .corporate-form-grid--horizontal {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    align-items: end;
    margin-bottom: 0;
}

.corporate-stays-page .corporate-form-grid--horizontal .corporate-field.full-width {
    grid-column: auto;
}

.corporate-stays-page .corporate-form-grid--horizontal .corporate-field-message {
    grid-column: span 3;
}

.corporate-stays-page .corporate-field-message textarea {
    min-height: 92px;
}

.corporate-stays-page .corporate-form-action {
    display: flex;
    flex-direction: column;
    gap: 10px;
    justify-content: flex-end;
    min-height: 100%;
}

.corporate-stays-page .corporate-form-action .corporate-submit {
    min-height: 54px;
}

.corporate-stays-page .corporate-form-action small {
    color: var(--grey);
    font-size: 11px;
    line-height: 1.4;
    text-align: center;
}

@media (max-width: 1023px) {
    .corporate-stays-page .corporate-form-grid--horizontal {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .corporate-stays-page .corporate-form-grid--horizontal .corporate-field-message,
    .corporate-stays-page .corporate-form-action {
        grid-column: 1 / -1;
    }
}

@media (max-width: 600px) {
    .corporate-stays-page .corporate-contact {
        padding-top: 60px;
        padding-bottom: 70px;
    }
    .corporate-stays-page .corporate-form-grid--horizontal {
        grid-template-columns: 1fr;
    }
    .corporate-stays-page .corporate-form-grid--horizontal .corporate-field-message,
    .corporate-stays-page .corporate-form-action {
        grid-column: auto;
    }
}

.luxury-retreat-page .oldrectory-shepherd-huts-slide {
    animation-duration: 24s;
}

.luxury-retreat-page .oldrectory-shepherd-huts-slide:nth-child(1) { animation-delay: 0s; }
.luxury-retreat-page .oldrectory-shepherd-huts-slide:nth-child(2) { animation-delay: 6s; }
.luxury-retreat-page .oldrectory-shepherd-huts-slide:nth-child(3) { animation-delay: 12s; }
.luxury-retreat-page .oldrectory-shepherd-huts-slide:nth-child(4) { animation-delay: 18s; }

@keyframes shepherdHutsFade {
    0%   { opacity: 0; }
    2%   { opacity: 1; }
    23%  { opacity: 1; }
    25%  { opacity: 0; }
    100% { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .corporate-stays-page .corporate-form-card--heartbeat,
    .corporate-stays-page .corporate-form-card--heartbeat::before {
        animation: none !important;
    }
}


/* ==========================================================================
   KEMTON UPDATE — Smaller Corporate Contact Form + Departure Date
   ========================================================================== */
.corporate-stays-page .corporate-contact {
    padding-top: 56px;
    padding-bottom: 68px;
}

.corporate-stays-page .corporate-contact-inner {
    display: block;
    max-width: 940px;
    margin: 0 auto;
}

.corporate-stays-page .corporate-contact-copy {
    max-width: 680px;
    margin: 0 auto 24px;
    text-align: center;
}

.corporate-stays-page .corporate-contact-copy h2 {
    font-size: clamp(30px, 3vw, 38px);
    margin-bottom: 10px;
    color: var(--olive);
}

.corporate-stays-page .corporate-contact-copy p {
    max-width: 620px;
    margin: 0 auto;
    font-size: 14px;
    line-height: 1.6;
}

.corporate-stays-page .corporate-savings-note-wrap {
    display: none;
}

.corporate-stays-page .corporate-form-card--compact,
.corporate-stays-page .corporate-form-card--compact:hover,
.corporate-stays-page .corporate-form-card--compact:focus-within {
    width: 100%;
    max-width: 860px;
    margin: 0 auto;
}

.corporate-stays-page .corporate-form-card--compact {
    padding: clamp(16px, 2vw, 22px);
    border-radius: 18px;
    background-color: var(--white);
    border: 1px solid rgba(92, 109, 81, 0.22);
    box-shadow: 0 14px 34px rgba(23, 59, 48, 0.10),
                0 0 0 0 rgba(92, 109, 81, 0.24);
}

.corporate-stays-page .corporate-form-card--compact.corporate-form-card--heartbeat {
    animation: corporateHeartbeatGlow 3.2s ease-in-out infinite;
}

.corporate-stays-page .corporate-form-card--compact.corporate-form-card--heartbeat::before {
    inset: -4px;
    border-radius: 22px;
    opacity: 0.42;
}

.corporate-stays-page .corporate-form-grid--compact {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px 12px;
    align-items: end;
    margin-bottom: 0;
}

.corporate-stays-page .corporate-form-grid--compact .corporate-field {
    gap: 5px;
}

.corporate-stays-page .corporate-form-grid--compact .corporate-field.full-width {
    grid-column: auto;
}

.corporate-stays-page .corporate-form-grid--compact .corporate-field-wide {
    grid-column: span 2;
}

.corporate-stays-page .corporate-form-grid--compact .corporate-field-message {
    grid-column: span 3;
}

.corporate-stays-page .corporate-form-grid--compact .corporate-field label {
    font-size: 11px;
    line-height: 1.2;
    letter-spacing: 0.1px;
}

.corporate-stays-page .corporate-form-grid--compact .corporate-field input,
.corporate-stays-page .corporate-form-grid--compact .corporate-field textarea {
    min-height: 38px;
    padding: 9px 11px;
    border-radius: 8px;
    font-size: 13px;
    background-color: #f5f2ed;
}

.corporate-stays-page .corporate-form-grid--compact .corporate-field textarea {
    min-height: 72px;
    resize: vertical;
}

.corporate-stays-page .corporate-form-grid--compact .corporate-field input::placeholder,
.corporate-stays-page .corporate-form-grid--compact .corporate-field textarea::placeholder {
    color: #949488;
}

.corporate-stays-page .corporate-form-grid--compact .corporate-form-action {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 7px;
    min-height: 100%;
}

.corporate-stays-page .corporate-form-grid--compact .corporate-submit {
    min-height: 42px;
    padding: 11px 14px;
    border-radius: 10px;
    font-size: 12px;
    letter-spacing: 1px;
}

.corporate-stays-page .corporate-form-grid--compact .corporate-form-action small {
    color: var(--grey);
    font-size: 10.5px;
    line-height: 1.35;
    text-align: center;
}

.corporate-stays-page .corporate-form-card--compact .corporate-form-success {
    margin-top: 14px;
    padding: 16px 14px;
    border-radius: 12px;
}

.corporate-stays-page .corporate-form-card--compact .corporate-form-success h4 {
    font-size: 18px;
    margin-bottom: 4px;
}

.corporate-stays-page .corporate-form-card--compact .corporate-form-success p {
    font-size: 13px;
}

@media (max-width: 1023px) {
    .corporate-stays-page .corporate-contact-inner {
        max-width: 760px;
    }

    .corporate-stays-page .corporate-form-grid--compact {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .corporate-stays-page .corporate-form-grid--compact .corporate-field-wide,
    .corporate-stays-page .corporate-form-grid--compact .corporate-field-message,
    .corporate-stays-page .corporate-form-grid--compact .corporate-form-action {
        grid-column: 1 / -1;
    }
}

@media (max-width: 600px) {
    .corporate-stays-page .corporate-contact {
        padding-top: 48px;
        padding-bottom: 60px;
    }

    .corporate-stays-page .corporate-contact-copy {
        margin-bottom: 20px;
    }

    .corporate-stays-page .corporate-form-card--compact {
        padding: 16px;
        border-radius: 16px;
    }

    .corporate-stays-page .corporate-form-grid--compact {
        grid-template-columns: 1fr;
        gap: 11px;
    }

    .corporate-stays-page .corporate-form-grid--compact .corporate-field-wide,
    .corporate-stays-page .corporate-form-grid--compact .corporate-field-message,
    .corporate-stays-page .corporate-form-grid--compact .corporate-form-action {
        grid-column: auto;
    }

    .corporate-stays-page .corporate-form-grid--compact .corporate-field input,
    .corporate-stays-page .corporate-form-grid--compact .corporate-field textarea {
        min-height: 42px;
        font-size: 14px;
    }
}

/* ========================================================================== 
   LUXURY RETREAT — CLIENT READABILITY UPDATE
   Purpose: make The Old Rectory wording easier to read for the client.
   Notes: header/nav colours are intentionally untouched. These rules only
   target the luxury retreat page body content, review copy, CTA copy and
   section spacing.
   ========================================================================== */
.luxury-retreat-page .oldrectory-heading,
.luxury-retreat-page .oldrectory-stay-cta__title,
.luxury-retreat-page .oldrectory-cta-title {
    font-size: clamp(38px, 4vw, 48px);
    line-height: 1.08;
    margin-bottom: 20px;
}

.luxury-retreat-page .oldrectory-paragraph,
.luxury-retreat-page .guest-experiences-review-text,
.luxury-retreat-page .oldrectory-card-text,
.luxury-retreat-page .oldrectory-cta-text,
.luxury-retreat-page .oldrectory-stay-cta__text {
    color: var(--dark);
    font-size: clamp(17px, 1.12vw, 18px);
    line-height: 1.76;
    font-weight: 500;
    letter-spacing: 0.05px;
}

.luxury-retreat-page .oldrectory-paragraph,
.luxury-retreat-page .oldrectory-inside-content .oldrectory-paragraph,
.luxury-retreat-page .oldrectory-hallways-dining-content .oldrectory-paragraph,
.luxury-retreat-page .oldrectory-outside-content .oldrectory-paragraph,
.luxury-retreat-page .oldrectory-shepherd-huts-content .oldrectory-paragraph,
.luxury-retreat-page .oldrectory-elevate-content .oldrectory-paragraph,
.luxury-retreat-page .oldrectory-stay-cta__text {
    max-width: 540px;
}

.luxury-retreat-page .guest-experiences-verification-source,
.luxury-retreat-page .guest-experiences-guest-date,
.luxury-retreat-page .oldrectory-elevate-service-label {
    color: var(--dark);
    font-weight: 600;
}

.luxury-retreat-page .guest-experiences-review-text {
    font-size: clamp(16.5px, 1.05vw, 17.5px);
    line-height: 1.72;
}

.luxury-retreat-page .oldrectory-stay-cta__text {
    margin-bottom: 30px;
}

/* Tighter, cleaner spacing between luxury retreat sections */
.luxury-retreat-page .oldrectory-intro {
    padding: 72px 0 56px;
}

.luxury-retreat-page .oldrectory-guest-experiences {
    padding: 0 0 64px;
}

.luxury-retreat-page .oldrectory-inside {
    padding: 36px 0 48px;
}

.luxury-retreat-page .oldrectory-hallways-dining {
    padding: 0 0 64px;
}

.luxury-retreat-page .oldrectory-outside {
    padding: 56px 0 48px;
}

.luxury-retreat-page .oldrectory-shepherd-huts {
    padding: 0 0 64px;
}

.luxury-retreat-page .oldrectory-elevate {
    padding: 56px 0 68px;
}

.luxury-retreat-page .oldrectory-intro-grid,
.luxury-retreat-page .guest-experiences-grid,
.luxury-retreat-page .guest-experiences-grid--swapped,
.luxury-retreat-page .oldrectory-inside-grid,
.luxury-retreat-page .oldrectory-hallways-dining-grid,
.luxury-retreat-page .oldrectory-outside-grid,
.luxury-retreat-page .oldrectory-shepherd-huts-grid,
.luxury-retreat-page .oldrectory-elevate-grid {
    gap: 52px;
}

.luxury-retreat-page .guest-experiences-intro {
    margin-bottom: 34px;
}

.luxury-retreat-page .guest-experiences-feature {
    gap: 26px;
}

.luxury-retreat-page .oldrectory-rule {
    margin: 12px 0 22px;
}

.luxury-retreat-page .oldrectory-stay-cta__content {
    padding-top: 64px;
    padding-bottom: 64px;
}

@media (max-width: 1023px) {
    .luxury-retreat-page .oldrectory-intro-grid,
    .luxury-retreat-page .guest-experiences-grid,
    .luxury-retreat-page .guest-experiences-grid--swapped,
    .luxury-retreat-page .oldrectory-inside-grid,
    .luxury-retreat-page .oldrectory-hallways-dining-grid,
    .luxury-retreat-page .oldrectory-outside-grid,
    .luxury-retreat-page .oldrectory-shepherd-huts-grid,
    .luxury-retreat-page .oldrectory-elevate-grid {
        gap: 36px;
    }
}

@media (max-width: 768px) {
    .luxury-retreat-page .oldrectory-heading,
    .luxury-retreat-page .oldrectory-stay-cta__title,
    .luxury-retreat-page .oldrectory-cta-title {
        font-size: 36px;
    }

    .luxury-retreat-page .oldrectory-paragraph,
    .luxury-retreat-page .guest-experiences-review-text,
    .luxury-retreat-page .oldrectory-card-text,
    .luxury-retreat-page .oldrectory-cta-text,
    .luxury-retreat-page .oldrectory-stay-cta__text {
        font-size: 16.5px;
        line-height: 1.72;
    }

    .luxury-retreat-page .oldrectory-intro {
        padding: 48px 0 42px;
    }

    .luxury-retreat-page .oldrectory-guest-experiences,
    .luxury-retreat-page .oldrectory-hallways-dining,
    .luxury-retreat-page .oldrectory-shepherd-huts {
        padding-bottom: 48px;
    }

    .luxury-retreat-page .oldrectory-inside,
    .luxury-retreat-page .oldrectory-outside,
    .luxury-retreat-page .oldrectory-elevate {
        padding-top: 42px;
        padding-bottom: 46px;
    }

    .luxury-retreat-page .oldrectory-stay-cta__content {
        padding-top: 44px;
        padding-bottom: 44px;
    }
}

@media (max-width: 520px) {
    .luxury-retreat-page .oldrectory-heading,
    .luxury-retreat-page .oldrectory-stay-cta__title,
    .luxury-retreat-page .oldrectory-cta-title {
        font-size: 33px;
    }

    .luxury-retreat-page .oldrectory-paragraph,
    .luxury-retreat-page .guest-experiences-review-text,
    .luxury-retreat-page .oldrectory-card-text,
    .luxury-retreat-page .oldrectory-cta-text,
    .luxury-retreat-page .oldrectory-stay-cta__text {
        font-size: 16px;
    }
}


/* ========================================================================== 
   KEMTON UPDATE — Corporate Stays spacing, Old Rectory typography/frame,
   and mobile dropdown alignment
   ========================================================================== */

/* Match the refined Old Rectory reading style on Corporate Stays */
.corporate-stays-page .corp-section-title,
.corporate-stays-page .corporate-contact-copy h2 {
    color: var(--olive);
    font-family: var(--font-serif);
    font-weight: 600;
    letter-spacing: 0;
}

.corporate-stays-page .corp-hero-body p,
.corporate-stays-page .corp-guarantee-intro,
.corporate-stays-page .corp-guarantee-close,
.corporate-stays-page .corp-why-list li,
.corporate-stays-page .corporate-contact-copy p {
    font-family: 'Montserrat', 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    color: var(--dark);
    font-weight: 500;
    letter-spacing: 0.05px;
}

.corporate-stays-page .corp-hero-body p,
.corporate-stays-page .corp-guarantee-intro,
.corporate-stays-page .corp-guarantee-close {
    font-size: clamp(16px, 1.05vw, 17.5px);
    line-height: 1.72;
}

.corporate-stays-page .corp-why-list li {
    font-size: 14px;
    line-height: 1.62;
}

/* Give the accommodation/appliance image block the same framed panel feeling as The Old Rectory */
.corporate-stays-page .corp-collage {
    position: relative;
    isolation: isolate;
    gap: 14px;
    background-color: var(--cream);
    border: 1px solid var(--beige);
    border-radius: 10px;
    padding: 20px;
}

.corporate-stays-page .corp-collage::before {
    content: '';
    position: absolute;
    inset: 10px;
    border: 1px solid var(--light-border);
    border-radius: 8px;
    pointer-events: none;
    z-index: 0;
}

.corporate-stays-page .corp-collage::after {
    content: '';
    position: absolute;
    inset: 10px;
    pointer-events: none;
    z-index: 0;
    background-image:
        radial-gradient(circle, var(--terracotta) 0 2px, transparent 2px),
        radial-gradient(circle, var(--terracotta) 0 2px, transparent 2px),
        radial-gradient(circle, var(--terracotta) 0 2px, transparent 2px),
        radial-gradient(circle, var(--terracotta) 0 2px, transparent 2px);
    background-repeat: no-repeat;
    background-size: 6px 6px;
    background-position: top left, top right, bottom left, bottom right;
    opacity: 0.7;
}

.corporate-stays-page .corp-collage > * {
    position: relative;
    z-index: 1;
}

.corporate-stays-page .corp-collage-main {
    height: 292px;
}

.corporate-stays-page .corp-collage-row {
    gap: 14px;
}

.corporate-stays-page .corp-collage-cell {
    height: 142px;
}

/* Reduce the large vertical gaps between Our Guarantee, Why Choose Us, and the enquiry section */
.corporate-stays-page .corp-guarantee.section-padding {
    padding-top: 72px;
    padding-bottom: 40px;
}

.corporate-stays-page .corp-why.section-padding {
    padding-top: 38px;
    padding-bottom: 46px;
}

.corporate-stays-page .corp-why-head {
    margin-bottom: 34px;
}

.corporate-stays-page .corp-house-divider {
    margin-top: 38px;
}

.corporate-stays-page .corporate-contact {
    padding-top: 34px;
    padding-bottom: 64px;
}

.corporate-stays-page .corporate-contact-copy {
    margin-bottom: 22px;
}

.corporate-stays-page .corporate-contact-copy h2 {
    line-height: 1.1;
}

/* Mobile hamburger dropdown: keep the Stay With Us label centred above the dropdown panel */
@media (max-width: 768px) {
    .nav-list.active .nav-link {
        justify-content: center;
        text-align: center;
    }

    .nav-item-dropdown {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .nav-item-dropdown > .nav-link {
        width: auto;
        display: inline-flex;
        justify-content: center;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
    }

    .nav-item-dropdown > .nav-link.active::after {
        left: 0;
        width: 100%;
    }

    .nav-dropdown {
        width: min(100%, 380px);
        max-width: 100%;
        margin-left: auto;
        margin-right: auto;
    }

    .corporate-stays-page .nav-list.active .nav-link {
        color: var(--white);
    }

    .corporate-stays-page .nav-list.active .nav-link.active::after {
        background-color: var(--white);
    }

    .corporate-stays-page .corp-guarantee.section-padding {
        padding-top: 46px;
        padding-bottom: 28px;
    }

    .corporate-stays-page .corp-why.section-padding {
        padding-top: 28px;
        padding-bottom: 36px;
    }

    .corporate-stays-page .corp-why-head {
        margin-bottom: 28px;
    }

    .corporate-stays-page .corp-house-divider {
        margin-top: 30px;
    }

    .corporate-stays-page .corporate-contact {
        padding-top: 28px;
        padding-bottom: 54px;
    }

    .corporate-stays-page .corp-collage {
        padding: 16px;
    }

    .corporate-stays-page .corp-collage::before,
    .corporate-stays-page .corp-collage::after {
        inset: 8px;
    }
}

@media (max-width: 520px) {
    .corporate-stays-page .corp-hero-body p,
    .corporate-stays-page .corp-guarantee-intro,
    .corporate-stays-page .corp-guarantee-close,
    .corporate-stays-page .corp-why-list li,
    .corporate-stays-page .corporate-contact-copy p {
        font-size: 15.5px;
        line-height: 1.68;
    }

    .corporate-stays-page .corp-collage-main {
        height: 240px;
    }

    .corporate-stays-page .corp-collage-cell {
        height: 178px;
    }
}

/* ========================================================================== 
   KEMTON UPDATE — Corporate hero image frame fix
   Keeps the full booking graphic visible instead of cropping the sides.
   ========================================================================== */

.corporate-stays-page .corp-hero-grid {
    grid-template-columns: minmax(320px, 0.84fr) minmax(0, 1.16fr);
    gap: clamp(34px, 4.8vw, 64px);
}

.corporate-stays-page .corp-hero-visual {
    min-width: 0;
    align-self: center;
}

.corporate-stays-page .corp-hero-image {
    width: min(100%, 760px);
    min-height: 0;
    aspect-ratio: 16 / 10;
    margin: 0 0 0 auto;
    padding: clamp(10px, 1.4vw, 18px);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: var(--radius-lg);
    background: linear-gradient(135deg, #f5f2ed 0%, #eee8df 48%, #dadfd7 100%);
}

.corporate-stays-page .corp-hero-image img {
    position: relative;
    inset: auto;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center center;
    border-radius: calc(var(--radius-lg) - 8px);
}

@media (max-width: 1199px) {
    .corporate-stays-page .corp-hero-grid {
        grid-template-columns: minmax(300px, 0.9fr) minmax(0, 1.1fr);
    }

    .corporate-stays-page .corp-hero-image {
        min-height: 0;
        width: min(100%, 720px);
        aspect-ratio: 16 / 10;
    }
}

@media (max-width: 1023px) {
    .corporate-stays-page .corp-hero-grid {
        grid-template-columns: 1fr;
    }

    .corporate-stays-page .corp-hero-image {
        width: min(100%, 820px);
        min-height: 0;
        aspect-ratio: 16 / 10;
        margin: 0 auto;
    }
}

@media (max-width: 680px) {
    .corporate-stays-page .corp-hero-image {
        min-height: 0;
        aspect-ratio: 16 / 11;
        padding: 8px;
        border-radius: 14px;
    }

    .corporate-stays-page .corp-hero-image img {
        border-radius: 10px;
    }
}

@media (max-width: 380px) {
    .corporate-stays-page .corp-hero-image {
        min-height: 0;
        aspect-ratio: 4 / 3;
    }
}