/* ---------------------------------------------------------------------------
   Napoleon Room page: the three enquiry options and the sticky mobile bar.

   Plain CSS rather than Tailwind utilities, because the theme's CSS build
   cannot be recompiled on the server. Brand values from tailwind.config.js.
   --------------------------------------------------------------------------- */

.enquiry,
.stickyEnquiry {
    --nr-purple: #7d22b1;
    --nr-purple-dark: #5c1783;
    --nr-gold: #A38D63;
    --nr-grey: #6D6E71;
}

/* ---- the three options ---- */
.enquiry { text-align: center; }

.enquiry__lead {
    font-family: "soleil", sans-serif;
    font-size: 18px;
    line-height: 1.5;
    color: var(--nr-grey);
    margin: 0 0 24px;
}
.enquiry--dark .enquiry__lead { color: #fff; }

.enquiry__options {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
    max-width: 980px;
    margin: 0 auto;
}
@media (min-width: 768px) {
    .enquiry__options { grid-template-columns: repeat(3, 1fr); gap: 20px; }
}

/* The whole block is the target, not just the words. */
.enquiry__option {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 76px;
    padding: 20px 18px 17px;
    background: var(--nr-purple);
    color: #fff;
    font-family: "stranger-wide", sans-serif;
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 19px;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    border: 1px solid var(--nr-purple);
    border-radius: 3px;
    transition: background-color .18s ease, border-color .18s ease;
}
.enquiry__option:hover,
.enquiry__option:focus {
    background: #1a1a1a;
    border-color: #1a1a1a;
    color: #fff;
}
.enquiry__option:focus-visible {
    outline: 3px solid var(--nr-gold);
    outline-offset: 3px;
}

/* ---- sticky bar, small screens only ---- */
.stickyEnquiry { display: none; }

@media (max-width: 767px) {
    .stickyEnquiry {
        display: grid;
        grid-template-columns: 1fr 1fr;
        position: fixed;
        left: 0; right: 0; bottom: 0;
        z-index: 900;
        box-shadow: 0 -6px 20px -10px rgba(0,0,0,.45);
    }
    .stickyEnquiry__action {
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 58px;
        padding: 14px 10px 11px;
        background: var(--nr-purple-dark);
        color: #fff;
        font-family: "stranger-wide", sans-serif;
        text-transform: uppercase;
        letter-spacing: .06em;
        font-size: 15px;
        line-height: 1.15;
        text-align: center;
        text-decoration: none;
    }
    .stickyEnquiry__action--primary { background: var(--nr-purple); }
    .stickyEnquiry__action + .stickyEnquiry__action {
        border-left: 1px solid rgba(255,255,255,.25);
    }
    .stickyEnquiry__action:hover,
    .stickyEnquiry__action:focus { color: #fff; }

    /* Keep the bar from covering the end of the page. */
    body.napoleon-room-page { padding-bottom: 58px; }
}

/* ---- section separation ---- */
.napoleonSection--enquiry {
    padding: 56px 24px;
    background-color: #FBF7EE;
    background-image: url('/wp-content/uploads/2023/06/landing-pages-bck.jpg');
    background-size: cover;
    background-position: center;
    border-bottom: 1px solid rgba(163,141,99,.45);
}
.napoleonSection--gallery { border-bottom: 1px solid rgba(163,141,99,.45); }

/* ---- what it costs ----
   Sits between the room details and the policy strip. Deliberately more
   prominent than the fine print below it: for a private room these two facts
   are reassurance, not small print, and people who assume private dining is
   expensive rule themselves out before finding otherwise. */
.roomCost {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 10px 22px;
    max-width: 780px;
    margin: 56px auto 0;
    padding: 22px 24px;
    border-top: 1px solid rgba(163,141,99,.75);
    border-bottom: 1px solid rgba(163,141,99,.75);
    text-align: center;
}
.roomCost__item {
    font-family: "soleil", sans-serif;
    font-size: 20px;
    line-height: 1.35;
    font-weight: 600;
    color: #fff;
}
.roomCost__sep { color: #A38D63; font-size: 17px; }

@media (max-width: 640px) {
    .roomCost { flex-direction: column; gap: 8px; margin-top: 40px; }
    .roomCost__sep { display: none; }
    .roomCost__item { font-size: 18px; }
}

/* Spacing between the cost band and the policy strip is set here rather than
   with a utility class. An arbitrary Tailwind class only exists if something
   in the source already used it, and the theme's CSS cannot be rebuilt on the
   server, so a new one silently does nothing. */
.story .roomCost + .terms { margin-top: 44px; }

/* The separator was a faint gold bullet between two bold white phrases and
   read as a speck. A small diamond matches the dividers used elsewhere. */
.roomCost__sep {
    width: 7px;
    height: 7px;
    background: #A38D63;
    transform: rotate(45deg);
    font-size: 0;
    flex: none;
}

/* The policy strip is left at full width deliberately: constraining it forces
   the three terms onto two lines, which looks worse than the width difference
   it was meant to solve. The cost band stays contained, which reads as a
   framed element rather than an accident. */

/* ---- Guest reviews (approved BW 5 Sep 2026) ---- */
.guestReviews {
    background: #f7f4ef;
    padding: 72px 32px;
}
.guestReviews__inner { max-width: 1000px; margin: 0 auto; text-align: center; }
.guestReviews__heading {
    font-family: "stranger-wide", sans-serif;
    color: #7d22b1;
    font-size: 32px;
    line-height: 110%;
    margin: 0 0 14px;
}
.guestReviews__intro {
    font-family: var(--nr-body, inherit);
    font-size: 18px;
    line-height: 26px;
    color: #4a4a4a;
    max-width: 620px;
    margin: 0 auto 44px;
    text-wrap: pretty;
}
.guestReviews__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}
.guestReview {
    margin: 0;
    background: #fff;
    border: 1px solid #e6ded2;
    border-radius: 4px;
    padding: 32px 28px 26px;
    display: flex;
    flex-direction: column;
    text-align: left;
}
.guestReview__stars { color: #d4a017; font-size: 17px; letter-spacing: .16em; margin-bottom: 14px; }
.guestReview__quote {
    margin: 0 0 20px;
    font-size: 17px;
    line-height: 27px;
    color: #2b2b2b;
    text-wrap: pretty;
    flex: 1 1 auto;
}
.guestReview__author {
    font-family: "stranger-wide", sans-serif;
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 14px;
    color: #7d22b1;
}
.guestReview__author::before { content: "\2014\00a0"; }

@media (min-width: 768px) {
    .guestReviews { padding: 96px 32px; }
    .guestReviews__heading { font-size: 45px; }
    .guestReviews__grid { grid-template-columns: 1fr 1fr; gap: 28px; }
}

/* ---- Occasions (copy locked by BW 5 Sep 2026) ---- */
.occasions { background: #f7f4ef; padding: 72px 32px; }
.occasions__inner { max-width: 1100px; margin: 0 auto; }
.occasions__heading {
    font-family: "stranger-wide", sans-serif;
    color: #7d22b1;
    font-size: 26px;
    line-height: 118%;
    text-align: center;
    margin: 0 0 44px;
    text-wrap: balance;
}
.occasions__grid { display: grid; grid-template-columns: 1fr; gap: 34px 40px; }
.occasion { text-align: left; }
.occasion__title {
    font-family: "stranger-wide", sans-serif;
    color: #7d22b1;
    font-size: 20px;
    line-height: 125%;
    margin: 0 0 10px;
    padding-bottom: 10px;
    border-bottom: 2px solid #e0d4c4;
}
.occasion__copy {
    /* was inheriting espiritu, the display face, which read as bold next to the
       intro paragraph. BW asked for the lighter treatment. 6 Sep 2026. */
    font-family: "soleil", "Inter", -apple-system, BlinkMacSystemFont, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #3a3a3a;
    margin: 0;
    text-wrap: pretty;
}
.occasions__serviceArea {
    font-family: "soleil", "Inter", -apple-system, BlinkMacSystemFont, sans-serif;
    font-weight: 400;
    margin: 48px auto 0;
    max-width: 660px;
    text-align: center;
    font-size: 16px;
    line-height: 26px;
    color: #5c5c5c;
    font-style: italic;
    text-wrap: pretty;
}

@media (min-width: 700px) {
    .occasions__grid { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 1024px) {
    .occasions { padding: 96px 32px; }
    .occasions__heading { font-size: 42px; margin-bottom: 56px; }
    .occasions__grid { grid-template-columns: repeat(3, 1fr); gap: 40px; }
}

/* ---- Hub: location lines + what to expect (copy locked by BW 5 Sep 2026) ---- */
.hubLocation__line {
    max-width: 290px;
    font-size: 15px;
    line-height: 22px;
    text-wrap: pretty;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .6);
}

.hubExpect { background: #f7f4ef; padding: 64px 32px; }
.hubExpect__inner { max-width: 760px; margin: 0 auto; text-align: center; }
.hubExpect__heading {
    font-family: "stranger-wide", sans-serif;
    color: #7d22b1;
    font-size: 26px;
    line-height: 118%;
    margin: 0 0 20px;
    text-wrap: balance;
}
.hubExpect__copy {
    font-family: "soleil", "Inter", -apple-system, BlinkMacSystemFont, sans-serif;
    font-weight: 400;
    font-size: 17px;
    line-height: 28px;
    color: #3a3a3a;
    margin: 0;
    text-wrap: pretty;
}

@media (min-width: 768px) {
    .hubExpect { padding: 88px 32px; }
    .hubExpect__heading { font-size: 38px; margin-bottom: 24px; }
    .hubExpect__copy { font-size: 18px; line-height: 30px; }
}

/* ---- Hub guest reviews ---- */
.hubReviews { background: #fff; padding: 64px 32px; }
.hubReviews__inner { max-width: 1000px; margin: 0 auto; text-align: center; }
.hubReviews__heading {
    font-family: "stranger-wide", sans-serif;
    color: #7d22b1; font-size: 26px; line-height: 118%; margin: 0 0 36px;
}
.hubReviews__grid { display: grid; grid-template-columns: 1fr; gap: 24px; }
.hubReview {
    margin: 0; background: #f7f4ef; border: 1px solid #e6ded2; border-radius: 4px;
    padding: 30px 26px 24px; display: flex; flex-direction: column; text-align: left;
}
.hubReview__stars { color: #d4a017; font-size: 16px; letter-spacing: .16em; margin-bottom: 12px; }
.hubReview__quote { margin: 0 0 18px; font-size: 16px; line-height: 26px; color: #2b2b2b; text-wrap: pretty; flex: 1 1 auto; }
.hubReview__author {
    font-family: "stranger-wide", sans-serif; text-transform: uppercase; letter-spacing: .08em;
    font-size: 13px; color: #7d22b1;
}
.hubReview__author::before { content: "\2014\00a0"; }
.hubReview__location { display: block; margin-top: 4px; color: #6b6b6b; letter-spacing: .06em; }
@media (min-width: 768px) {
    .hubReviews { padding: 80px 32px; }
    .hubReviews__heading { font-size: 34px; }
    .hubReviews__grid { grid-template-columns: 1fr 1fr; gap: 28px; }
}

/* ============================================================
   HUB: intro + location chooser
   Overrides the theme's Tailwind utilities. Written as plain CSS
   because Tailwind cannot be rebuilt on this server.
   ============================================================ */

/* ---- intro: was a 400px column stranded in a 1200px row ---- */
.hubIntro { justify-content: center; }
.hubIntro__col.hubIntro__col {
    max-width: 920px;
    width: 100%;
    margin: 0 auto;
    text-align: center;
    padding-top: 76px;
    padding-bottom: 44px;
}
.hubIntro__col h1 { text-wrap: balance; }
.hubIntro__copy.hubIntro__copy {
    max-width: 68ch;
    margin-left: auto;
    margin-right: auto;
    margin-top: 24px;
    font-size: 17.5px;
    line-height: 31px;
    text-wrap: pretty;
}
.hubIntro__col > a.slideshow-trigger {
    display: inline-flex;
    margin-top: 26px;
    margin-bottom: 0;
    padding-bottom: 3px;
    border-bottom: 1px solid rgba(163,141,99,.42);
    transition: border-color .2s ease, color .2s ease;
}
.hubIntro__col > a.slideshow-trigger:hover { border-bottom-color: currentColor; }
.hubIntro__col > a.slideshow-trigger:focus-visible { outline: 3px solid var(--nr-gold, #A38D63); outline-offset: 4px; }
/* keep the link a comfortable tap target on phones without moving it visually */
@media (max-width: 767px) {
    .hubIntro__col > a.slideshow-trigger { padding-top: 9px; padding-bottom: 9px; }
}
.hubCards { margin-top: 8px; }

/* ---- location cards ---- */
.hubCards { gap: 28px; padding-bottom: 72px; }

.hubCard.hubCard {
    min-height: 420px;
    padding: 0;
    border-radius: 2px;
    overflow: hidden;
    align-items: stretch;
}
/* the theme paints the photo at -z-10, so keep it inside the card without
   creating a new stacking context that would bury it */
.hubCard > picture,
.hubCard picture img { z-index: 0; }
.hubCard__body {
    position: relative;
    z-index: 30;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
    text-align: left;
    padding: 32px 28px 30px;
    gap: 0;
}

/* photo: let it sit under a real gradient instead of a flat 49% black wash */
.hubCard img {
    transition: transform .6s cubic-bezier(.2,.6,.2,1);
    object-position: center;
}
.hubCard:hover img { transform: scale(1.04); }
.hubCard__scrim.hubCard__scrim {
    background: linear-gradient(
        to top,
        rgba(18,10,24,.92) 0%,
        rgba(18,10,24,.78) 26%,
        rgba(18,10,24,.42) 55%,
        rgba(18,10,24,.20) 100%
    );
    transition: opacity .4s ease;
}

.hubCard__name.hubCard__name {
    font-size: 30px;
    letter-spacing: .01em;
    margin-bottom: 12px;
    width: auto;
    text-shadow: 0 1px 12px rgba(0,0,0,.35);
}
/* a short gold rule ties the name to the brand without adding another colour */
.hubCard__name::after {
    content: "";
    display: block;
    width: 34px;
    height: 2px;
    background: #c9a24a;
    margin-top: 14px;
}

.hubCard__line.hubCard__line {
    font-family: "soleil", "Inter", -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 15px;
    line-height: 24px;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
    color: rgba(255,255,255,.88);
    margin: 0 0 22px;
    max-width: 30ch;
    text-wrap: pretty;
    text-shadow: 0 1px 10px rgba(0,0,0,.45);
}

/* CTA: sized to its label rather than stretched to 257px */
.hubCard__cta.hubCard__cta {
    width: auto;
    max-width: none;
    align-self: flex-start;
    background: transparent;
    border: 1.5px solid rgba(255,255,255,.55);
    color: #fff;
    font-size: 13px;
    letter-spacing: .14em;
    padding: 13px 26px 11px;
    border-radius: 2px;
    transition: background-color .22s ease, border-color .22s ease, color .22s ease;
}
.hubCard__cta.hubCard__cta:hover,
.hubCard__cta.hubCard__cta:focus-visible {
    background: #c9a24a;
    border-color: #c9a24a;
    color: #1a1016;
}
.hubCard__cta.hubCard__cta:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }

@media (max-width: 1023px) {
    .hubCard.hubCard { min-height: 340px; }
    .hubCard__body { padding: 28px 24px 26px; }
    .hubCard__name.hubCard__name { font-size: 26px; }
    .hubCard__line.hubCard__line { max-width: 46ch; }
}
@media (max-width: 767px) {
    .hubIntro__col.hubIntro__col { padding-top: 52px; }
    .hubIntro__copy.hubIntro__copy { font-size: 16px; line-height: 27px; }
}
@media (prefers-reduced-motion: reduce) {
    .hubCard img, .hubCard__scrim, .hubCard__cta.hubCard__cta { transition: none; }
    .hubCard:hover img { transform: none; }
}


/* ---- gallery: keep the wrapped images laying out exactly as the bare <img> did ---- */
.photoGallery .rl-gallery-link { display: block; cursor: zoom-in; }
.photoGallery .rl-gallery-link img { display: block; width: 100%; height: auto; }
.photoGallery .rl-gallery-link:focus-visible { outline: 3px solid #7d22b1; outline-offset: 3px; }


/* ---- Prix Fixe link, now below the location cards ---- */
.hubPrixFixe { text-align: center; padding: 0 32px 64px; }
.hubPrixFixe a {
    display: inline-flex;
    align-items: center;
    padding-bottom: 3px;
    border-bottom: 1px solid rgba(163,141,99,.42);
    transition: border-color .2s ease;
}
.hubPrixFixe a:hover { border-bottom-color: currentColor; }
.hubPrixFixe a:focus-visible { outline: 3px solid #A38D63; outline-offset: 4px; }
@media (max-width: 767px) { .hubPrixFixe a { padding-top: 9px; padding-bottom: 9px; } }


/* ---- hero heading: fit long location names on small screens ----
   "ALTAMONTE" is a single 9-character word. At the theme's fixed 65px it measured
   394px wide on a 375px viewport, so it ran past both edges and dragged the
   sub-heading off-screen with it (the centred container sizes to its widest child).
   Winter Park and Brandon fit because their longest word is "NAPOLEON".
   Scaling with the viewport fixes Altamonte and keeps any future location safe.
   Desktop is untouched: the clamp ceiling is the original 65px. 8 Sep 2026. */
@media (max-width: 767px) {
    .introHero .introText h1 {
        font-size: clamp(40px, 15.5vw, 65px);
        line-height: 1.08;
    }
}
