/* Shared hotel palette, based on the supplied bright red sample (#e90808). */
:root {
    --primary-dark: #df0909;
    --accent-color: #e90808;
    --accent-hover: #ce0707;
    --brand-rgb: 233, 8, 8;
    --chrome-color: #d50000;
    --chrome-rgb: 213, 0, 0;
    --bg-light: #fffdfc;
    --surface-soft: #fff4f2;
    --text-dark: #222222;
    --text-muted: #595959;
    --text-light: #ffffff;
    --border-color: #eedbd7;
    --section-fade: clamp(32px, 5vw, 48px);
}

/* Blend full-width content sections into the surrounding page background. */
.rooms-section,
.page-header {
    background-image: linear-gradient(
        to bottom,
        var(--bg-light) 0,
        var(--surface-soft) var(--section-fade),
        var(--surface-soft) calc(100% - var(--section-fade)),
        var(--bg-light) 100%
    );
}

/* This section ends at the footer, whose boundary stays crisp. */
.cta-section {
    background-image: linear-gradient(
        to bottom,
        var(--bg-light) 0,
        var(--surface-soft) var(--section-fade)
    );
}

header .nav-links a:hover { color: #ffffff; text-decoration: underline; text-underline-offset: 6px; }
footer { background-color: var(--chrome-color); }
footer h4, footer .footer-col h4 { color: #ffffff; }
footer a:hover { color: #ffffff; text-decoration: underline; }
:focus-visible { outline: 2px solid var(--accent-color); outline-offset: 4px; }
header :focus-visible { outline-color: #ffd9d2; }
input, select { accent-color: var(--accent-color); }