/* ==========================================================================
   RomaEnjoy theme - core stylesheet (app.css)
   --------------------------------------------------------------------------
   Table of contents
    1. Design tokens
    2. Bootstrap overrides
    3. Base & typography
    4. Buttons (.btn-re)
    5. Cards, rating, stars, badges, price
    6. Sections & layout helpers
    7. Header, pill navigation, mobile offcanvas
    8. Language switcher
    9. Demo banner
   10. Footer
   11. Search form (hero / compact, suggestions, guests popover, steppers)
   12. Property card (list / grid)
   13. Chat panel
   14. Toast
   15. Error pages
   16. Utilities
   17. Print
   Extra tokens exposed for page stylesheets: --re-nav-h, --re-header-total,
   --re-footer-bg, --re-footer-bar, --re-gradient, --re-photo-overlay, --re-dur,
   --re-ease, --re-z-*, --re-deal-bg, --re-terracotta-600/-ink, --re-accent-ink.
   Brand palette: burgundy #8C1024 (structure, links, rating), gold #CDA04B
   (primary CTA, stars, decor), charcoal #26262B (text), terracotta (deals only).
   ========================================================================== */

/* 1. Design tokens
   ========================================================================== */
:root {
    /* Brand: burgundy (primary) · gold (accent) · charcoal (ink) on warm neutrals */
    --re-primary: #8C1024;
    --re-primary-600: #A3162E;
    --re-primary-700: #6B0C1B;
    --re-primary-100: #F8E7EA;
    --re-primary-50: #FCF3F5;
    --re-accent: #CDA04B;
    --re-accent-600: #B4883A;
    --re-accent-100: #F7EEDB;
    --re-terracotta: #D9480F;
    --re-terracotta-100: #FDE8DC;
    --re-success: #1E8E3E;
    --re-success-100: #E3F4E8;
    --re-danger: #C62828;
    --re-warning: #9A6B00;
    --re-ink: #26262B;
    --re-ink-700: #3F3F47;
    --re-ink-500: #6E6E78;
    --re-ink-300: #CBC7C6;
    --re-ink-200: #E6E1DF;
    --re-ink-100: #F0ECEA;
    --re-surface: #FFFFFF;
    --re-bg: #F8F6F3;
    --re-radius-sm: 8px;
    --re-radius: 12px;
    --re-radius-lg: 20px;
    --re-radius-xl: 28px;
    --re-radius-pill: 999px;
    --re-shadow-sm: 0 1px 2px rgba(38,38,43,.06), 0 1px 3px rgba(38,38,43,.04);
    --re-shadow: 0 4px 16px rgba(38,38,43,.08);
    --re-shadow-lg: 0 16px 40px rgba(38,38,43,.14);
    --re-font-heading: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", "Noto Sans SC", sans-serif;
    --re-font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", "Noto Sans SC", sans-serif;
    --re-header-h: 72px;
    --re-container: 1280px;

    /* Additional shared tokens */
    --re-nav-h: 46px;
    --re-header-total: calc(var(--re-header-h) + var(--re-nav-h));
    --re-footer-bg: #F3EFEB;
    --re-footer-bar: #26262B;
    --re-gradient: linear-gradient(135deg, #6B0C1B 0%, #8C1024 55%, #A3162E 100%);
    --re-photo-overlay: linear-gradient(180deg, rgba(43, 6, 14, .45), rgba(107, 12, 27, .55) 60%, rgba(140, 16, 36, .78));
    --re-accent-ink: #7A5200;          /* text on gold-100 surfaces (>= 6:1) */
    --re-success-ink: #156B2F;
    --re-terracotta-600: #C13F0C;      /* deal hover */
    --re-terracotta-ink: #B93B0B;      /* small deal text on white (>= 5.5:1) */
    --re-deal-bg: #C7400D;             /* deal badge / ribbon background (white text >= 5:1) */
    --re-dur: 180ms;
    --re-ease: cubic-bezier(.2, .7, .2, 1);
    --re-z-header: 1030;
    --re-z-chat: 1040;
    --re-z-toast: 1090;
}

@media (max-width: 991.98px) {
    :root {
        --re-header-h: 60px;
        --re-header-total: var(--re-header-h);
    }
}

/* 2. Bootstrap overrides
   ========================================================================== */
:root,
[data-bs-theme="light"] {
    --bs-primary: #8C1024;
    --bs-primary-rgb: 140, 16, 36;
    --bs-secondary: #6E6E78;
    --bs-secondary-rgb: 110, 110, 120;
    --bs-success: #1E8E3E;
    --bs-success-rgb: 30, 142, 62;
    --bs-danger: #C62828;
    --bs-danger-rgb: 198, 40, 40;
    --bs-warning: #CDA04B;
    --bs-warning-rgb: 205, 160, 75;
    --bs-link-color: #8C1024;
    --bs-link-color-rgb: 140, 16, 36;
    --bs-link-hover-color: #A3162E;
    --bs-link-hover-color-rgb: 163, 22, 46;
    --bs-body-font-family: var(--re-font-body);
    --bs-body-font-size: .9375rem;
    --bs-body-line-height: 1.55;
    --bs-body-bg: #F8F6F3;
    --bs-body-bg-rgb: 248, 246, 243;
    --bs-body-color: #26262B;
    --bs-body-color-rgb: 38, 38, 43;
    --bs-heading-color: #26262B;
    --bs-secondary-color: #6E6E78;
    --bs-secondary-color-rgb: 110, 110, 120;
    --bs-tertiary-bg: #F8F6F3;
    --bs-border-color: #E6E1DF;
    --bs-border-radius: 12px;
    --bs-border-radius-sm: 8px;
    --bs-border-radius-lg: 20px;
    --bs-border-radius-xl: 28px;
    --bs-border-radius-pill: 999px;
    --bs-focus-ring-width: 4px;
    --bs-focus-ring-color: rgba(140, 16, 36, .25);
}

.btn {
    font-weight: 600;
    transition: background-color var(--re-dur) var(--re-ease), color var(--re-dur) var(--re-ease), border-color var(--re-dur) var(--re-ease), box-shadow var(--re-dur) var(--re-ease);
}

.btn-primary {
    --bs-btn-bg: var(--re-primary);
    --bs-btn-border-color: var(--re-primary);
    --bs-btn-hover-bg: var(--re-primary-600);
    --bs-btn-hover-border-color: var(--re-primary-600);
    --bs-btn-active-bg: var(--re-primary-700);
    --bs-btn-active-border-color: var(--re-primary-700);
    --bs-btn-disabled-bg: var(--re-primary);
    --bs-btn-disabled-border-color: var(--re-primary);
    --bs-btn-focus-shadow-rgb: 140, 16, 36;
}

.btn-outline-primary {
    --bs-btn-color: var(--re-primary);
    --bs-btn-border-color: var(--re-primary);
    --bs-btn-hover-bg: var(--re-primary);
    --bs-btn-hover-border-color: var(--re-primary);
    --bs-btn-active-bg: var(--re-primary-700);
    --bs-btn-active-border-color: var(--re-primary-700);
    --bs-btn-focus-shadow-rgb: 140, 16, 36;
}

.btn-link {
    --bs-btn-color: var(--re-primary);
    --bs-btn-hover-color: var(--re-primary-600);
    text-decoration: none;
}

.form-control,
.form-select {
    border-color: var(--re-ink-300);
    border-radius: 10px;
    color: var(--re-ink);
    padding: .6rem .85rem;
    min-height: 44px;
    font-size: .9375rem;
    transition: border-color var(--re-dur) var(--re-ease), box-shadow var(--re-dur) var(--re-ease);
}

.form-control::placeholder {
    color: var(--re-ink-500);
}

.form-control:focus,
.form-select:focus {
    border-color: var(--re-primary-600);
    box-shadow: 0 0 0 4px var(--re-primary-100);
}

.form-control-sm,
.form-select-sm {
    min-height: 36px;
    padding: .35rem .65rem;
    font-size: .875rem;
}

.form-label {
    font-weight: 600;
    font-size: .875rem;
    color: var(--re-ink-700);
}

.form-check-input {
    border-color: var(--re-ink-300);
    width: 1.15em;
    height: 1.15em;
    margin-top: .2em;
}

.form-check-input:checked {
    background-color: var(--re-primary);
    border-color: var(--re-primary);
}

.form-check-input:focus {
    border-color: var(--re-primary-600);
    box-shadow: 0 0 0 4px var(--re-primary-100);
}

.form-check-label {
    cursor: pointer;
}

.form-range::-webkit-slider-thumb {
    background: var(--re-primary);
}

.form-range::-moz-range-thumb {
    background: var(--re-primary);
}

.form-range::-webkit-slider-thumb:active {
    background: var(--re-primary-600);
}

.dropdown-menu {
    --bs-dropdown-border-color: var(--re-ink-200);
    --bs-dropdown-border-radius: var(--re-radius);
    --bs-dropdown-padding-y: .5rem;
    --bs-dropdown-link-hover-bg: var(--re-primary-50);
    --bs-dropdown-link-hover-color: var(--re-primary);
    --bs-dropdown-link-active-bg: var(--re-primary-100);
    --bs-dropdown-link-active-color: var(--re-primary);
    box-shadow: var(--re-shadow-lg);
}

.modal-content {
    border: 0;
    border-radius: var(--re-radius-lg);
    box-shadow: var(--re-shadow-lg);
}

.modal-header,
.modal-footer {
    border-color: var(--re-ink-200);
}

.modal-title {
    font-weight: 700;
}

.offcanvas {
    --bs-offcanvas-width: 340px;
    border: 0 !important;
}

.accordion {
    --bs-accordion-border-color: var(--re-ink-200);
    --bs-accordion-btn-focus-box-shadow: 0 0 0 4px var(--re-primary-100);
    --bs-accordion-active-bg: var(--re-primary-50);
    --bs-accordion-active-color: var(--re-primary);
    --bs-accordion-btn-padding-y: 1rem;
}

.accordion-button {
    font-weight: 600;
}

.pagination {
    --bs-pagination-color: var(--re-ink-700);
    --bs-pagination-border-color: var(--re-ink-200);
    --bs-pagination-hover-bg: var(--re-primary-50);
    --bs-pagination-hover-color: var(--re-primary);
    --bs-pagination-hover-border-color: var(--re-primary-100);
    --bs-pagination-active-bg: var(--re-primary);
    --bs-pagination-active-border-color: var(--re-primary);
    --bs-pagination-focus-box-shadow: 0 0 0 4px var(--re-primary-100);
    --bs-pagination-disabled-color: var(--re-ink-300);
    gap: 6px;
}

.page-link {
    border-radius: 10px !important;
    font-weight: 600;
    min-width: 40px;
    text-align: center;
}

.breadcrumb {
    --bs-breadcrumb-divider-color: var(--re-ink-300);
    font-size: .875rem;
}

.breadcrumb-item.active {
    color: var(--re-ink-500);
}

.table {
    --bs-table-border-color: var(--re-ink-200);
}

.tooltip {
    --bs-tooltip-bg: var(--re-ink);
    --bs-tooltip-border-radius: 8px;
}

.btn-close:focus {
    box-shadow: 0 0 0 4px var(--re-primary-100);
}

.progress {
    --bs-progress-bar-bg: var(--re-primary);
    --bs-progress-bg: var(--re-ink-100);
    border-radius: var(--re-radius-pill);
}

/* 3. Base & typography
   ========================================================================== */
html {
    scroll-behavior: smooth;
    scroll-padding-top: calc(var(--re-header-total) + 16px);
    -webkit-text-size-adjust: 100%;
}

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

    *,
    *::before,
    *::after {
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}

body.re-body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    margin: 0;
    background: var(--re-bg);
    color: var(--re-ink);
    font-family: var(--re-font-body);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    overflow-x: clip;
}

.re-main {
    flex: 1 0 auto;
    min-width: 0;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: var(--re-font-heading);
    font-weight: 700;
    letter-spacing: -.01em;
    line-height: 1.2;
    color: var(--re-ink);
}

a {
    color: var(--re-primary);
    text-decoration: none;
    transition: color var(--re-dur) var(--re-ease);
}

a:hover {
    color: var(--re-primary-600);
    text-decoration: underline;
    text-underline-offset: 2px;
}

img,
svg,
video {
    max-width: 100%;
    height: auto;
}

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

::selection {
    background: var(--re-accent-100);
    color: var(--re-ink);
}

.re-skip {
    position: absolute;
    top: 8px;
    left: 8px;
    z-index: 2000;
    padding: .55rem .85rem;
    border-radius: 10px;
    background: #fff;
    color: var(--re-primary);
    font-weight: 600;
    box-shadow: var(--re-shadow);
}

/* 4. Buttons
   ========================================================================== */
.btn-re,
.btn-re-primary,
.btn-re-accent,
.btn-re-outline,
.btn-re-ghost {
    --btn-bg: var(--re-surface);
    --btn-fg: var(--re-ink);
    --btn-bd: var(--re-ink-200);
    --btn-bg-h: var(--re-ink-100);
    --btn-fg-h: var(--re-ink);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    min-height: 44px;
    padding: .7rem 1.25rem;
    border: 1px solid var(--btn-bd);
    border-radius: 12px;
    background: var(--btn-bg);
    color: var(--btn-fg);
    font-family: var(--re-font-body);
    font-size: .9375rem;
    font-weight: 600;
    line-height: 1.25;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    transition: background-color var(--re-dur) var(--re-ease), color var(--re-dur) var(--re-ease), border-color var(--re-dur) var(--re-ease), box-shadow var(--re-dur) var(--re-ease), transform var(--re-dur) var(--re-ease);
}

.btn-re:hover,
.btn-re-primary:hover,
.btn-re-accent:hover,
.btn-re-outline:hover,
.btn-re-ghost:hover {
    background: var(--btn-bg-h);
    color: var(--btn-fg-h);
    text-decoration: none;
}

.btn-re:active,
.btn-re-primary:active,
.btn-re-accent:active,
.btn-re-outline:active,
.btn-re-ghost:active {
    transform: translateY(1px);
}

.btn-re:focus-visible,
.btn-re-primary:focus-visible,
.btn-re-accent:focus-visible,
.btn-re-outline:focus-visible,
.btn-re-ghost:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 4px var(--re-primary-100), 0 0 0 6px var(--re-primary-600);
}

.btn-re:disabled,
.btn-re.disabled,
.btn-re-primary:disabled,
.btn-re-accent:disabled,
.btn-re-outline:disabled,
.btn-re-ghost:disabled {
    opacity: .6;
    pointer-events: none;
}

.btn-re .bi,
.btn-re-primary .bi,
.btn-re-accent .bi,
.btn-re-outline .bi,
.btn-re-ghost .bi {
    font-size: 1.05em;
    line-height: 1;
}

.btn-re-primary {
    --btn-bg: var(--re-primary);
    --btn-fg: #fff;
    --btn-bd: var(--re-primary);
    --btn-bg-h: var(--re-primary-600);
    --btn-fg-h: #fff;
    box-shadow: 0 2px 8px rgba(140, 16, 36, .22);
}

.btn-re-accent {
    --btn-bg: var(--re-accent);
    --btn-fg: var(--re-ink);
    --btn-bd: var(--re-accent);
    --btn-bg-h: var(--re-accent-600);
    --btn-fg-h: var(--re-ink);
    box-shadow: 0 2px 8px rgba(205, 160, 75, .32);
}

.btn-re-outline {
    --btn-bg: var(--re-surface);
    --btn-fg: var(--re-primary);
    --btn-bd: var(--re-primary);
    --btn-bg-h: var(--re-primary-50);
    --btn-fg-h: var(--re-primary-700);
}

.btn-re-ghost {
    --btn-bg: transparent;
    --btn-fg: var(--re-primary);
    --btn-bd: transparent;
    --btn-bg-h: var(--re-primary-50);
    --btn-fg-h: var(--re-primary-700);
}

.btn-re-pill {
    border-radius: var(--re-radius-pill);
}

.btn-re-sm {
    min-height: 36px;
    padding: .45rem .9rem;
    font-size: .875rem;
    border-radius: 10px;
}

.btn-re-lg {
    min-height: 52px;
    padding: .95rem 1.6rem;
    font-size: 1.0625rem;
    border-radius: 14px;
}

.btn-re-pill.btn-re-sm,
.btn-re-pill.btn-re-lg {
    border-radius: var(--re-radius-pill);
}

.btn-re-icon {
    width: 44px;
    padding: 0;
}

/* 5. Cards, rating, stars, badges, price
   ========================================================================== */
.re-card {
    background: var(--re-surface);
    border: 1px solid var(--re-ink-200);
    border-radius: var(--re-radius);
    box-shadow: var(--re-shadow-sm);
    transition: box-shadow var(--re-dur) var(--re-ease), transform var(--re-dur) var(--re-ease), border-color var(--re-dur) var(--re-ease);
}

.re-card:hover {
    border-color: var(--re-ink-300);
    box-shadow: var(--re-shadow);
    transform: translateY(-2px);
}

.re-card-body {
    padding: 1rem 1.125rem;
}

.re-rating {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 34px;
    padding: 0 .45rem;
    border-radius: 8px 8px 8px 0;
    background: var(--re-primary);
    color: #fff;
    font-family: var(--re-font-heading);
    font-size: 1rem;
    font-weight: 800;
    line-height: 1;
    text-align: center;
    font-variant-numeric: tabular-nums;
}

/* Burgundy scale: deeper = better. Every tint keeps white text above 5:1. */
.re-rating--exceptional { background: var(--re-primary-700); }
.re-rating--superb      { background: var(--re-primary); }
.re-rating--fabulous    { background: var(--re-primary-600); }
.re-rating--very_good   { background: #B0263E; }
.re-rating--good        { background: #BD3D53; }
.re-rating--pleasant    { background: #B8475D; }

.re-rating-label {
    font-weight: 700;
    color: var(--re-ink);
}

.re-rating-count {
    font-size: .8125rem;
    color: var(--re-ink-500);
}

.re-stars {
    display: inline-flex;
    gap: 1px;
    color: var(--re-accent);
    font-size: .8125rem;
    line-height: 1;
    vertical-align: middle;
}

.re-badge {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: .22rem .6rem;
    border-radius: var(--re-radius-pill);
    background: var(--re-ink-100);
    color: var(--re-ink-700);
    font-size: .75rem;
    font-weight: 600;
    line-height: 1.3;
    white-space: nowrap;
}

.re-badge .bi {
    font-size: .85em;
}

.re-badge--success {
    background: var(--re-success-100);
    color: var(--re-success-ink);
}

.re-badge--deal {
    background: var(--re-deal-bg);
    color: #fff;
}

.re-badge--deal .bi {
    color: #fff;
}

.re-badge--info {
    background: var(--re-primary-100);
    color: var(--re-primary);
}

.re-badge--accent {
    background: var(--re-accent-100);
    color: var(--re-accent-ink);
}

.re-price {
    font-family: var(--re-font-heading);
    font-size: 1.35rem;
    font-weight: 800;
    line-height: 1.1;
    color: var(--re-ink);
    font-variant-numeric: tabular-nums;
}

.re-price-old {
    font-size: .9rem;
    font-weight: 500;
    color: var(--re-ink-500);
    text-decoration: line-through;
}

.re-price-note {
    font-size: .75rem;
    color: var(--re-ink-500);
}

/* 6. Sections & layout helpers
   ========================================================================== */
.re-container {
    width: 100%;
    max-width: var(--re-container);
    margin-inline: auto;
    padding-inline: 1rem;
}

@media (min-width: 768px) {
    .re-container {
        padding-inline: 1.5rem;
    }
}

.re-section {
    padding-block: 56px;
}

.re-section-title {
    margin: 0 0 .35rem;
    font-family: var(--re-font-heading);
    font-size: 1.75rem;
    font-weight: 800;
    letter-spacing: -.02em;
    line-height: 1.2;
}

.re-section-subtitle {
    margin: 0 0 1.5rem;
    max-width: 62ch;
    color: var(--re-ink-500);
    font-size: 1rem;
}

.re-eyebrow {
    display: inline-block;
    margin-bottom: .5rem;
    color: var(--re-primary);
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.re-img-cover {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.re-ratio-4x3 {
    position: relative;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: var(--re-ink-100);
}

.re-ratio-4x3 > img,
.re-ratio-4x3 > picture,
.re-ratio-4x3 > iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.re-chip {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    min-height: 36px;
    padding: .4rem .85rem;
    border: 1px solid var(--re-ink-200);
    border-radius: var(--re-radius-pill);
    background: var(--re-surface);
    color: var(--re-ink-700);
    font-size: .875rem;
    font-weight: 500;
    line-height: 1.2;
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--re-dur) var(--re-ease), color var(--re-dur) var(--re-ease), border-color var(--re-dur) var(--re-ease);
}

.re-chip:hover {
    border-color: var(--re-primary);
    background: var(--re-primary-50);
    color: var(--re-primary);
    text-decoration: none;
}

.re-chip.is-active,
.re-chip[aria-pressed="true"] {
    border-color: var(--re-primary);
    background: var(--re-primary-100);
    color: var(--re-primary);
    font-weight: 600;
}

.re-divider {
    margin: 1.25rem 0;
    border: 0;
    border-top: 1px solid var(--re-ink-200);
}

@media (max-width: 767.98px) {
    .re-section {
        padding-block: 40px;
    }

    .re-section-title {
        font-size: 1.5rem;
    }
}

/* 7. Header, pill navigation, mobile offcanvas
   ========================================================================== */
.re-header {
    position: sticky;
    top: 0;
    z-index: var(--re-z-header);
    background: var(--re-surface);
    color: var(--re-ink);
    border-bottom: 1px solid var(--re-ink-200);
    transition: box-shadow var(--re-dur) var(--re-ease);
}

/* Brand touch: a thin gold edge along the very top of the page */
.re-header::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 3px;
    background: var(--re-accent);
    pointer-events: none;
}

.re-header.is-scrolled {
    box-shadow: 0 8px 24px rgba(38, 38, 43, .10);
}

.re-header-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    height: var(--re-header-h);
    padding-top: 3px;
}

.re-logo {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    text-decoration: none !important;
}

.re-logo img {
    display: block;
    width: auto;
    height: 44px;
}

.re-header-actions {
    display: flex;
    align-items: center;
    gap: .3rem;
}

.re-hchip {
    display: inline-flex;
    align-items: center;
    height: 38px;
    padding: 0 .7rem;
    border: 1px solid var(--re-ink-200);
    border-radius: var(--re-radius-pill);
    color: var(--re-ink-700);
    font-size: .8125rem;
    font-weight: 700;
    letter-spacing: .04em;
}

.re-hbtn {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    height: 38px;
    padding: 0 .7rem;
    border: 0;
    border-radius: var(--re-radius-pill);
    background: transparent;
    color: var(--re-ink-700);
    font-size: .875rem;
    font-weight: 600;
    cursor: pointer;
    transition: background-color var(--re-dur) var(--re-ease), color var(--re-dur) var(--re-ease);
}

.re-hbtn:hover,
.re-hbtn[aria-expanded="true"] {
    background: var(--re-primary-50);
    color: var(--re-primary);
}

.re-hbtn .bi {
    font-size: 1.1rem;
}

.re-hlink {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    height: 38px;
    padding: 0 .75rem;
    border-radius: var(--re-radius-pill);
    color: var(--re-primary);
    font-size: .875rem;
    font-weight: 600;
    white-space: nowrap;
    transition: background-color var(--re-dur) var(--re-ease), color var(--re-dur) var(--re-ease);
}

.re-hlink:hover {
    background: var(--re-primary-50);
    color: var(--re-primary-700);
    text-decoration: none;
}

.re-hlink--phone {
    color: var(--re-ink-700);
    font-variant-numeric: tabular-nums;
}

.re-hlink--phone .bi {
    color: var(--re-primary);
    font-size: 1rem;
}

.re-hlink--phone:hover {
    color: var(--re-primary);
}

.re-header .btn-re,
.re-header .btn-re-primary,
.re-header .btn-re-accent,
.re-header .btn-re-outline {
    min-height: 38px;
    padding: .4rem 1rem;
    font-size: .875rem;
}

.re-header .btn-re-primary {
    box-shadow: none;
}

.re-header .btn-re-accent {
    box-shadow: 0 1px 2px rgba(122, 82, 0, .18);
}

.re-chat-toggle {
    position: relative;
}

.re-chat-unread {
    position: absolute;
    top: -6px;
    right: -4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 5px;
    border: 2px solid #fff;
    border-radius: var(--re-radius-pill);
    background: var(--re-terracotta);
    color: #fff;
    font-size: .68rem;
    font-weight: 700;
    line-height: 1;
}

.re-chat-unread[hidden] {
    display: none;
}

.re-header-mobile {
    display: flex;
    align-items: center;
    gap: .5rem;
}

.re-iconbtn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border: 1px solid var(--re-ink-200);
    border-radius: var(--re-radius-pill);
    background: var(--re-surface);
    color: var(--re-ink-700);
    font-size: 1.35rem;
    line-height: 1;
    cursor: pointer;
    transition: background-color var(--re-dur) var(--re-ease), color var(--re-dur) var(--re-ease), border-color var(--re-dur) var(--re-ease);
}

.re-iconbtn:hover {
    border-color: var(--re-primary-100);
    background: var(--re-primary-50);
    color: var(--re-primary);
}

.re-iconbtn--accent {
    border-color: var(--re-accent);
    background: var(--re-accent);
    color: var(--re-ink);
    font-size: 1.2rem;
}

.re-iconbtn--accent:hover {
    border-color: var(--re-accent-600);
    background: var(--re-accent-600);
    color: var(--re-ink);
}

.re-nav-pills {
    display: flex;
    align-items: flex-start;
    gap: .375rem;
    height: var(--re-nav-h);
    padding-top: 2px;
    overflow-x: auto;
    scrollbar-width: none;
}

.re-nav-pills::-webkit-scrollbar {
    display: none;
}

.re-pill {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    height: 36px;
    padding: 0 1rem;
    border: 1px solid transparent;
    border-radius: var(--re-radius-pill);
    color: var(--re-ink-700);
    font-size: .875rem;
    font-weight: 600;
    white-space: nowrap;
    transition: background-color var(--re-dur) var(--re-ease), color var(--re-dur) var(--re-ease), border-color var(--re-dur) var(--re-ease);
}

.re-pill:hover {
    background: var(--re-primary-50);
    color: var(--re-primary);
    text-decoration: none;
}

.re-pill.is-active {
    border-color: var(--re-primary);
    background: var(--re-primary);
    color: #fff;
    box-shadow: 0 2px 8px rgba(140, 16, 36, .22);
}

.re-pill.is-active:hover {
    background: var(--re-primary-600);
    color: #fff;
}

.re-pill .bi {
    font-size: 1rem;
}

.re-offcanvas {
    --bs-offcanvas-width: min(340px, 92vw);
    background: var(--re-surface);
}

.re-offcanvas .offcanvas-header {
    padding: .85rem 1.25rem;
    border-bottom: 1px solid var(--re-ink-200);
}

.re-offcanvas .offcanvas-header .re-logo img {
    height: 34px;
}

.re-offcanvas .offcanvas-body {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    padding: 1rem 1.25rem 2rem;
}

.re-mobile-nav {
    display: flex;
    flex-direction: column;
    gap: .2rem;
}

.re-mobile-link {
    display: flex;
    align-items: center;
    gap: .75rem;
    width: 100%;
    min-height: 46px;
    padding: .65rem .85rem;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: var(--re-ink);
    font: inherit;
    font-weight: 600;
    text-align: left;
    cursor: pointer;
    transition: background-color var(--re-dur) var(--re-ease), color var(--re-dur) var(--re-ease);
}

.re-mobile-link .bi {
    width: 1.5rem;
    color: var(--re-primary);
    font-size: 1.2rem;
    text-align: center;
}

.re-mobile-link:hover,
.re-mobile-link.is-active {
    background: var(--re-primary-50);
    color: var(--re-primary);
    text-decoration: none;
}

.re-mobile-auth {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .5rem;
}

.re-mobile-label {
    margin-bottom: .5rem;
    color: var(--re-ink-500);
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}

/* Contact block (offcanvas + footer) */
.re-contact {
    display: flex;
    flex-direction: column;
    gap: .35rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.re-contact-title {
    margin: 0 0 .6rem;
    font-family: var(--re-font-heading);
    font-size: .95rem;
    font-weight: 700;
}

.re-contact li {
    display: flex;
    align-items: flex-start;
    gap: .65rem;
    min-height: 32px;
    color: var(--re-ink-700);
    font-size: .9rem;
    line-height: 1.45;
}

.re-contact .bi {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 30px;
    height: 30px;
    border-radius: 9px;
    background: var(--re-primary-50);
    color: var(--re-primary);
    font-size: .95rem;
}

.re-contact-text {
    display: flex;
    flex-direction: column;
    gap: .05rem;
    min-width: 0;
    padding-top: .3rem;
    overflow-wrap: anywhere;
}

.re-contact-label {
    color: var(--re-ink-500);
    font-size: .74rem;
    font-weight: 600;
    letter-spacing: .02em;
}

.re-contact a {
    color: var(--re-ink);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.re-contact a:hover {
    color: var(--re-primary);
}

.re-offcanvas .re-contact {
    padding: .9rem 1rem;
    border: 1px solid var(--re-ink-200);
    border-radius: 14px;
    background: var(--re-bg);
}

/* 8. Language switcher
   ========================================================================== */
.re-lang-toggle.dropdown-toggle::after {
    display: none;
}

.re-lang-toggle .re-caret {
    font-size: .7rem;
    opacity: .85;
    transition: transform var(--re-dur) var(--re-ease);
}

.re-lang-toggle[aria-expanded="true"] .re-caret {
    transform: rotate(180deg);
}

.re-lang-menu {
    min-width: 250px;
    padding: .5rem;
    margin-top: .5rem !important;
}

.re-lang-title {
    padding: .4rem .75rem .5rem;
    color: var(--re-ink-500);
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.re-lang-item {
    display: flex;
    align-items: center;
    gap: .65rem;
    min-height: 40px;
    padding: .45rem .75rem;
    border-radius: 10px;
    color: var(--re-ink);
    font-weight: 500;
    white-space: nowrap;
    transition: background-color var(--re-dur) var(--re-ease), color var(--re-dur) var(--re-ease);
}

.re-lang-item:hover,
.re-lang-item:focus {
    background: var(--re-primary-50);
    color: var(--re-primary);
    text-decoration: none;
}

.re-lang-item.is-active,
.re-lang-item.is-active:hover {
    background: var(--re-primary-100);
    color: var(--re-primary);
    font-weight: 600;
}

.re-lang-item .bi-check2 {
    margin-left: auto;
    color: var(--re-primary);
    font-size: 1.05rem;
}

.re-lang-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 30px;
    height: 22px;
    padding: 0 .3rem;
    border-radius: 6px;
    background: var(--re-ink-100);
    color: var(--re-ink-700);
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .06em;
    line-height: 1;
}

.re-lang-item.is-active .re-lang-chip {
    background: var(--re-primary);
    color: #fff;
}

.re-header .re-lang-menu .re-lang-item {
    color: var(--re-ink);
}

.re-header .re-lang-menu .re-lang-item:hover,
.re-header .re-lang-menu .re-lang-item:focus,
.re-header .re-lang-menu .re-lang-item.is-active {
    color: var(--re-primary);
}

.re-lang-list {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
    margin: 0;
    padding: 0;
}

.re-lang-list .re-lang-item {
    min-height: 38px;
    padding: .3rem .7rem .3rem .4rem;
    border: 1px solid var(--re-ink-200);
    background: #fff;
    font-size: .875rem;
}

.re-lang-list .re-lang-item:hover {
    border-color: var(--re-primary);
}

.re-lang-list .re-lang-item.is-active {
    border-color: var(--re-primary);
}

/* 9. Demo banner
   ========================================================================== */
.re-demo-bar {
    background: var(--re-accent-100);
    border-bottom: 1px solid rgba(205, 160, 75, .35);
    border-left: 4px solid var(--re-accent);
    color: var(--re-ink);
    font-size: .8125rem;
}

.re-demo-bar[hidden] {
    display: none;
}

.re-demo-bar-inner {
    display: flex;
    align-items: center;
    gap: .6rem;
    min-height: 38px;
    padding-block: .3rem;
}

.re-demo-bar .bi-info-circle-fill {
    flex: 0 0 auto;
    color: var(--re-warning);
    font-size: 1rem;
}

.re-demo-bar-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 32px;
    height: 32px;
    margin-left: auto;
    border: 0;
    border-radius: var(--re-radius-pill);
    background: transparent;
    color: var(--re-ink-700);
    cursor: pointer;
    transition: background-color var(--re-dur) var(--re-ease);
}

.re-demo-bar-close:hover {
    background: rgba(0, 0, 0, .07);
}

/* 10. Footer
   ========================================================================== */
.re-footer {
    margin-top: auto;
    font-size: .9rem;
}

/* Light body */
.re-footer-main {
    padding: 56px 0 44px;
    border-top: 1px solid var(--re-ink-200);
    background: var(--re-footer-bg);
    color: var(--re-ink-700);
}

.re-footer-main a {
    color: var(--re-ink-700);
}

.re-footer-main a:hover {
    color: var(--re-primary);
}

.re-footer-logo {
    display: inline-flex;
    text-decoration: none !important;
}

.re-footer-logo img {
    display: block;
    width: auto;
    height: 36px;
}

.re-footer-tagline {
    margin: 1rem 0 .35rem;
    color: var(--re-ink);
    font-family: var(--re-font-heading);
    font-size: 1.05rem;
    font-weight: 700;
}

.re-footer-about {
    max-width: 40ch;
    margin: 0;
    line-height: 1.6;
}

.re-footer-contact {
    max-width: 360px;
    margin-top: 1.4rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--re-ink-200);
}

.re-footer-contact .re-contact-title {
    color: var(--re-ink);
}

.re-footer-contact .re-contact .bi {
    background: var(--re-surface);
    border: 1px solid var(--re-ink-200);
}

.re-footer-title {
    margin: 0 0 .9rem;
    color: var(--re-ink);
    font-size: .95rem;
    font-weight: 700;
    letter-spacing: .01em;
}

.re-footer-links {
    display: flex;
    flex-direction: column;
    gap: .45rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

/* Charcoal bottom bar */
.re-footer-bar {
    padding: 28px 0 32px;
    background: var(--re-footer-bar);
    color: var(--re-ink-300);
}

.re-footer-bar a {
    color: #fff;
}

.re-footer-bar :focus-visible {
    outline-color: #fff;
}

.re-footer-langs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .75rem 1rem;
}

.re-footer-langs-title {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    margin-right: .5rem;
    color: #fff;
    font-weight: 700;
}

.re-footer-langs-title .bi {
    color: var(--re-accent);
}

.re-footer-bar .re-lang-item {
    border-color: rgba(255, 255, 255, .16);
    background: rgba(255, 255, 255, .06);
    color: #fff;
}

.re-footer-bar .re-lang-item:hover {
    border-color: rgba(255, 255, 255, .5);
    background: rgba(255, 255, 255, .12);
    color: #fff;
}

.re-footer-bar .re-lang-chip {
    background: rgba(255, 255, 255, .16);
    color: #fff;
}

.re-footer-bar .re-lang-item.is-active {
    border-color: var(--re-accent);
    background: var(--re-accent);
    color: var(--re-ink);
}

.re-footer-bar .re-lang-item.is-active .re-lang-chip {
    background: var(--re-ink);
    color: #fff;
}

.re-footer-bottom {
    margin-top: 1.5rem;
    padding-top: 1.25rem;
    border-top: 1px solid rgba(255, 255, 255, .12);
}

.re-footer-legal {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem 1.5rem;
    color: #fff;
    font-size: .85rem;
}

.re-footer-legal span + span::before {
    content: "·";
    margin-right: 1.5rem;
    color: var(--re-accent);
}

.re-footer-disclaimer {
    max-width: 90ch;
    margin: .75rem 0 0;
    color: var(--re-ink-300);
    font-size: .8rem;
}

@media (max-width: 767.98px) {
    .re-footer-main {
        padding: 40px 0 32px;
    }

    .re-footer-legal span + span::before {
        display: none;
    }
}

/* 11. Search form
   ========================================================================== */
.re-search {
    position: relative;
    z-index: 5;
    padding: 4px;
    border-radius: 16px;
    background: var(--re-surface);
    box-shadow: 0 0 0 3px var(--re-accent), var(--re-shadow-lg);
}

.re-search--compact {
    border: 1px solid var(--re-ink-200);
    border-radius: 14px;
    box-shadow: var(--re-shadow-sm);
}

.re-search-fields {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(0, .95fr) minmax(0, .95fr) minmax(0, 1.5fr) auto;
    gap: 4px;
}

.re-search-field {
    position: relative;
    display: flex;
    align-items: center;
    gap: .65rem;
    min-height: 64px;
    padding: .55rem .9rem;
    border-radius: 12px;
    background: var(--re-surface);
    transition: background-color var(--re-dur) var(--re-ease), box-shadow var(--re-dur) var(--re-ease);
}

.re-search-field:hover {
    background: var(--re-primary-50);
}

.re-search-field:focus-within {
    background: var(--re-primary-50);
    box-shadow: inset 0 0 0 2px var(--re-primary-600);
}

.re-search-field + .re-search-field::before {
    content: "";
    position: absolute;
    top: 14px;
    bottom: 14px;
    left: -2.5px;
    width: 1px;
    background: var(--re-ink-200);
}

.re-search-icon {
    flex: 0 0 auto;
    color: var(--re-primary);
    font-size: 1.25rem;
    line-height: 1;
}

.re-search-inner {
    position: relative;
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-width: 0;
    overflow: hidden;
    text-align: left;
}

.re-search-label {
    margin: 0 0 2px;
    color: var(--re-ink-500);
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .08em;
    line-height: 1.2;
    text-transform: uppercase;
    cursor: pointer;
}

.re-search-input {
    width: 100%;
    min-width: 0;
    height: 22px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--re-ink);
    font-family: inherit;
    font-size: .95rem;
    font-weight: 600;
    line-height: 1.3;
    outline: 0;
    text-overflow: ellipsis;
}

.re-search-input::placeholder {
    color: var(--re-ink-500);
    font-weight: 500;
}

.re-search-input:focus {
    outline: 0;
    box-shadow: none;
}

input[type="date"].re-search-input {
    position: relative;
    z-index: 1;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
}

input[type="date"].re-search-input::-webkit-calendar-picker-indicator {
    display: none;
}

input[type="date"].re-search-input::-webkit-date-and-time-value {
    text-align: left;
}

.re-search-display {
    position: absolute;
    left: 0;
    bottom: 0;
    display: none;
    max-width: 100%;
    height: 22px;
    overflow: hidden;
    color: var(--re-ink);
    font-size: .95rem;
    font-weight: 600;
    line-height: 22px;
    white-space: nowrap;
    text-overflow: ellipsis;
    pointer-events: none;
}

.has-display input[type="date"].re-search-input {
    color: transparent;
}

.has-display .re-search-display {
    display: block;
}

.has-display.is-keyboard input[type="date"].re-search-input {
    color: var(--re-ink);
}

.has-display.is-keyboard .re-search-display {
    display: none;
}

.re-search-guests {
    display: flex;
    align-items: center;
    gap: .65rem;
    width: 100%;
    min-height: 44px;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.re-search-guests:focus-visible {
    outline: 0;
}

.re-search-value {
    height: 22px;
    overflow: hidden;
    color: var(--re-ink);
    font-size: .95rem;
    font-weight: 600;
    line-height: 1.3;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.re-search-caret {
    margin-left: auto;
    color: var(--re-ink-500);
    font-size: .8rem;
    transition: transform var(--re-dur) var(--re-ease);
}

.re-search-guests[aria-expanded="true"] .re-search-caret {
    transform: rotate(180deg);
}

.re-search-submit {
    min-height: 64px;
    padding: 0 1.6rem;
    border-radius: 12px;
    font-size: 1rem;
}

.re-search-submit .bi {
    font-size: 1.1rem;
}

.re-search--compact .re-search-field {
    min-height: 54px;
    padding: .4rem .8rem;
}

.re-search--compact .re-search-label {
    font-size: .64rem;
}

.re-search--compact .re-search-submit {
    min-height: 54px;
    padding: 0 1.25rem;
    font-size: .9375rem;
}

/* Destination suggestions */
.re-suggest {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    z-index: 30;
    width: min(100%, 440px);
    min-width: 280px;
    max-height: 360px;
    padding: .5rem;
    overflow: auto;
    border: 1px solid var(--re-ink-200);
    border-radius: var(--re-radius);
    background: var(--re-surface);
    box-shadow: var(--re-shadow-lg);
    text-align: left;
}

.re-suggest[hidden] {
    display: none;
}

.re-suggest-title {
    padding: .45rem .75rem .35rem;
    color: var(--re-ink-500);
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.re-suggest-item {
    display: flex;
    align-items: center;
    gap: .75rem;
    min-height: 46px;
    padding: .45rem .75rem;
    border-radius: 10px;
    color: var(--re-ink);
    cursor: pointer;
    transition: background-color var(--re-dur) var(--re-ease);
}

.re-suggest-item:hover,
.re-suggest-item.is-active {
    background: var(--re-primary-50);
}

.re-suggest-item .bi {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: var(--re-primary-100);
    color: var(--re-primary);
    font-size: 1.05rem;
}

.re-suggest-text {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.re-suggest-name {
    font-weight: 600;
    line-height: 1.25;
}

.re-suggest-sub {
    color: var(--re-ink-500);
    font-size: .78rem;
}

.re-suggest-empty {
    padding: .6rem .75rem;
    color: var(--re-ink-500);
    font-size: .875rem;
}

/* Guests popover & steppers */
.re-guests-pop {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 30;
    width: min(340px, calc(100vw - 2rem));
    padding: .5rem 1rem 1rem;
    border: 1px solid var(--re-ink-200);
    border-radius: 16px;
    background: var(--re-surface);
    box-shadow: var(--re-shadow-lg);
    text-align: left;
}

.re-guests-pop[hidden] {
    display: none;
}

.re-guests-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .7rem 0;
}

.re-guests-row + .re-guests-row {
    border-top: 1px solid var(--re-ink-100);
}

.re-guests-name {
    font-weight: 600;
}

.re-guests-sub {
    color: var(--re-ink-500);
    font-size: .78rem;
}

.re-stepper {
    display: inline-flex;
    align-items: center;
    gap: .2rem;
}

.re-stepper-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: 1px solid var(--re-primary);
    border-radius: var(--re-radius-pill);
    background: var(--re-surface);
    color: var(--re-primary);
    font-size: 1.35rem;
    line-height: 1;
    cursor: pointer;
    transition: background-color var(--re-dur) var(--re-ease), color var(--re-dur) var(--re-ease), border-color var(--re-dur) var(--re-ease);
}

.re-stepper-btn:hover {
    background: var(--re-primary-50);
}

.re-stepper-btn:disabled {
    border-color: var(--re-ink-300);
    background: var(--re-surface);
    color: var(--re-ink-300);
    cursor: not-allowed;
}

.re-stepper-value {
    min-width: 2.2rem;
    font-weight: 700;
    text-align: center;
    font-variant-numeric: tabular-nums;
}

.re-guests-done {
    width: 100%;
    margin-top: .75rem;
}

@media (max-width: 1199.98px) {
    .re-search-fields {
        grid-template-columns: minmax(0, 1.4fr) minmax(0, .9fr) minmax(0, .9fr) minmax(0, 1.5fr) auto;
    }

    .re-search-submit {
        padding: 0 1.2rem;
    }
}

@media (max-width: 991.98px) {
    .re-search-fields {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 6px;
    }

    .re-search-field--dest,
    .re-search-field--guests,
    .re-search-submit {
        grid-column: 1 / -1;
    }

    .re-search-field + .re-search-field::before {
        display: none;
    }

    .re-search-field {
        min-height: 60px;
        border: 1px solid var(--re-ink-200);
    }

    .re-search--compact .re-search-field {
        min-height: 54px;
    }

    .re-search-submit {
        min-height: 54px;
    }

    .re-suggest,
    .re-guests-pop {
        left: 0;
        right: 0;
        width: 100%;
        min-width: 0;
    }
}

@media (max-width: 575.98px) {
    .re-search {
        padding: 6px;
    }
}

/* 12. Property card (list / grid)
   ========================================================================== */
.re-pcard {
    display: grid;
    overflow: hidden;
}

.re-pcard--list {
    grid-template-columns: 280px minmax(0, 1fr) 220px;
}

.re-pcard-media {
    position: relative;
    display: block;
    overflow: hidden;
    background: var(--re-ink-100);
}

.re-pcard-media img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 500ms var(--re-ease);
}

.re-pcard:hover .re-pcard-media img {
    transform: scale(1.04);
}

.re-pcard--list .re-pcard-media {
    height: 100%;
    min-height: 236px;
}

.re-pcard--grid .re-pcard-media {
    aspect-ratio: 4 / 3;
}

.re-pcard-deal {
    position: absolute;
    top: .75rem;
    left: .75rem;
    z-index: 1;
    box-shadow: var(--re-shadow-sm);
}

.re-pcard-body {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    min-width: 0;
    padding: 1rem 1.125rem;
}

.re-pcard-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .25rem .6rem;
}

.re-pcard-name {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 1.3;
}

.re-pcard-name a {
    color: var(--re-primary);
}

.re-pcard-name a:hover {
    color: var(--re-primary-600);
}

.re-pcard-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .35rem .5rem;
    color: var(--re-ink-500);
    font-size: .8125rem;
}

.re-pcard-zone {
    color: var(--re-primary);
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.re-pcard-highlights {
    display: flex;
    flex-direction: column;
    gap: .2rem;
    margin: .1rem 0 0;
    padding: 0;
    color: var(--re-ink-700);
    font-size: .8125rem;
    list-style: none;
}

.re-pcard-highlights li {
    display: flex;
    align-items: flex-start;
    gap: .4rem;
}

.re-pcard-highlights .bi {
    flex: 0 0 auto;
    margin-top: 1px;
    color: var(--re-success);
}

.re-pcard-room {
    margin-top: .25rem;
    padding-top: .55rem;
    border-top: 1px dashed var(--re-ink-200);
}

.re-pcard-room-name {
    font-size: .875rem;
    font-weight: 700;
}

.re-pcard-room-beds {
    color: var(--re-ink-500);
    font-size: .8125rem;
}

.re-pcard-badges {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    margin-top: auto;
    padding-top: .35rem;
}

.re-pcard-note {
    width: 100%;
    color: var(--re-success-ink);
    font-size: .8125rem;
    font-weight: 500;
}

.re-pcard-side {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: space-between;
    gap: .75rem;
    padding: 1rem 1.125rem 1rem 0;
    text-align: right;
}

.re-pcard-rating {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .6rem;
}

.re-pcard-rating-text {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    line-height: 1.2;
}

.re-pcard-price {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: .15rem;
}

.re-pcard-price-row {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: flex-end;
    gap: .15rem .5rem;
}

.re-pcard-price-row .re-price,
.re-pcard-price-row .re-price-old {
    white-space: nowrap;
}

.re-pcard--grid .re-pcard-price-row {
    justify-content: flex-start;
}

.re-pcard-cta {
    white-space: nowrap;
}

/* Grid variant */
.re-pcard--grid {
    grid-template-columns: minmax(0, 1fr);
    height: 100%;
}

.re-pcard--grid .re-pcard-body {
    gap: .4rem;
    height: 100%;
}

.re-pcard--grid .re-pcard-name {
    font-size: 1.0625rem;
}

.re-pcard--grid .re-pcard-rating {
    justify-content: flex-start;
    margin-top: .1rem;
}

.re-pcard--grid .re-pcard-rating-text {
    align-items: flex-start;
}

.re-pcard--grid .re-pcard-badges {
    margin-top: 0;
}

.re-pcard-foot {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: .75rem;
    margin-top: auto;
    padding-top: .65rem;
    border-top: 1px solid var(--re-ink-100);
}

.re-pcard--grid .re-pcard-price {
    align-items: flex-start;
}

.re-pcard-cta--icon {
    flex: 0 0 auto;
    width: 42px;
    min-height: 42px;
    padding: 0;
    border-radius: var(--re-radius-pill);
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .re-pcard--list {
        grid-template-columns: 240px minmax(0, 1fr) 200px;
    }
}

@media (max-width: 991.98px) {
    .re-pcard--list {
        grid-template-columns: minmax(0, 1fr);
    }

    .re-pcard--list .re-pcard-media {
        height: auto;
        min-height: 0;
        aspect-ratio: 16 / 10;
    }

    .re-pcard-side {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        padding: 0 1.125rem 1rem;
        text-align: left;
    }

    .re-pcard-side .re-pcard-rating {
        order: 0;
        flex-direction: row-reverse;
        justify-content: flex-start;
    }

    .re-pcard-side .re-pcard-rating-text {
        align-items: flex-start;
    }

    .re-pcard-side .re-pcard-price {
        order: 1;
        margin-left: auto;
        text-align: right;
    }

    .re-pcard-side .re-pcard-cta {
        order: 2;
        flex: 1 1 100%;
    }
}

/* 13. Chat panel
   ========================================================================== */
.re-chat {
    position: fixed;
    top: calc(var(--re-header-total) + 12px);
    right: 16px;
    z-index: var(--re-z-chat);
    display: flex;
    flex-direction: column;
    width: 380px;
    height: min(600px, 80vh);
    overflow: hidden;
    border-radius: var(--re-radius-lg);
    background: var(--re-surface);
    box-shadow: var(--re-shadow-lg), 0 0 0 1px var(--re-ink-200);
    transform-origin: top right;
    animation: re-chat-in 220ms var(--re-ease);
}

.re-chat[hidden] {
    display: none;
}

@keyframes re-chat-in {
    from {
        opacity: 0;
        transform: translateY(-8px) scale(.98);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

.re-chat-head {
    display: flex;
    align-items: center;
    gap: .75rem;
    flex: 0 0 auto;
    padding: .8rem 1rem;
    background: var(--re-gradient);
    color: #fff;
}

.re-chat-avatar {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 42px;
    height: 42px;
    border-radius: var(--re-radius-pill);
    background: #fff;
    color: var(--re-primary);
    box-shadow: 0 0 0 2px rgba(255, 255, 255, .35);
}

.re-chat-avatar img {
    display: block;
    width: 30px;
    height: 30px;
    object-fit: contain;
}

.re-chat-avatar::after {
    content: "";
    position: absolute;
    right: -1px;
    bottom: -1px;
    width: 12px;
    height: 12px;
    border: 2px solid var(--re-primary);
    border-radius: var(--re-radius-pill);
    background: #3FD16E;
}

.re-chat-headtext {
    flex: 1 1 auto;
    min-width: 0;
}

.re-chat-title {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin: 0;
    color: #fff;
    font-size: .95rem;
    font-weight: 700;
}

.re-chat-title .re-badge {
    padding: .1rem .45rem;
    background: var(--re-accent);
    color: var(--re-ink);
    font-size: .62rem;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.re-chat-subtitle {
    display: flex;
    align-items: center;
    gap: .35rem;
    margin: 2px 0 0;
    overflow: hidden;
    color: rgba(255, 255, 255, .82);
    font-size: .75rem;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.re-chat-subtitle > span:last-child {
    overflow: hidden;
    text-overflow: ellipsis;
}

.re-chat-online {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    flex: 0 0 auto;
    color: #B9F3C8;
    font-weight: 600;
}

.re-chat-online::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: var(--re-radius-pill);
    background: #3FD16E;
}

.re-chat-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: var(--re-radius-pill);
    background: rgba(255, 255, 255, .14);
    color: #fff;
    cursor: pointer;
    transition: background-color var(--re-dur) var(--re-ease);
}

.re-chat-close:hover {
    background: rgba(255, 255, 255, .26);
}

.re-chat-close:focus-visible {
    outline-color: #fff;
}

.re-chat-notice {
    display: flex;
    align-items: flex-start;
    gap: .4rem;
    flex: 0 0 auto;
    margin: 0;
    padding: .45rem 1rem;
    border-left: 3px solid var(--re-accent);
    background: var(--re-accent-100);
    color: var(--re-accent-ink);
    font-size: .74rem;
    line-height: 1.4;
}

.re-chat-notice .bi {
    flex: 0 0 auto;
    margin-top: 1px;
}

.re-chat-notice-text {
    min-width: 0;
}

.re-chat-notice a {
    color: var(--re-primary);
    font-weight: 700;
    white-space: nowrap;
}

.re-chat-body {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: .6rem;
    padding: 1rem;
    overflow-y: auto;
    background: var(--re-bg);
    overscroll-behavior: contain;
}

.re-chat-msg {
    display: flex;
    flex-direction: column;
    gap: .25rem;
    max-width: 86%;
}

.re-chat-msg--bot {
    align-self: flex-start;
    align-items: flex-start;
}

.re-chat-msg--user {
    align-self: flex-end;
    align-items: flex-end;
}

.re-chat-bubble {
    padding: .6rem .85rem;
    border-radius: 16px;
    font-size: .875rem;
    line-height: 1.45;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.re-chat-msg--bot .re-chat-bubble {
    border: 1px solid var(--re-ink-200);
    border-bottom-left-radius: 4px;
    background: var(--re-surface);
    color: var(--re-ink);
    box-shadow: var(--re-shadow-sm);
}

.re-chat-msg--user .re-chat-bubble {
    border-bottom-right-radius: 4px;
    background: var(--re-primary);
    color: #fff;
}

.re-chat-time {
    padding: 0 .25rem;
    color: var(--re-ink-500);
    font-size: .68rem;
}

.re-chat-suggest {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    margin-top: .1rem;
}

.re-chat-suggest .re-chip {
    min-height: 32px;
    padding: .3rem .7rem;
    border-color: var(--re-primary-100);
    background: var(--re-surface);
    color: var(--re-primary);
    font-size: .8rem;
    font-weight: 600;
}

.re-chat-typing {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: .75rem .85rem;
}

.re-chat-typing span {
    width: 7px;
    height: 7px;
    border-radius: var(--re-radius-pill);
    background: var(--re-ink-300);
    animation: re-typing 1s infinite ease-in-out;
}

.re-chat-typing span:nth-child(2) {
    animation-delay: .15s;
}

.re-chat-typing span:nth-child(3) {
    animation-delay: .3s;
}

@keyframes re-typing {
    0%, 80%, 100% {
        opacity: .5;
        transform: translateY(0);
    }

    40% {
        opacity: 1;
        transform: translateY(-4px);
    }
}

.re-chat-quick {
    display: flex;
    gap: .4rem;
    flex: 0 0 auto;
    padding: .55rem 1rem;
    overflow-x: auto;
    border-top: 1px solid var(--re-ink-100);
    background: var(--re-surface);
    scrollbar-width: none;
}

.re-chat-quick::-webkit-scrollbar {
    display: none;
}

.re-chat-quick .re-chip {
    flex: 0 0 auto;
    min-height: 34px;
    padding: .3rem .75rem;
    font-size: .8rem;
}

.re-chat-form {
    display: flex;
    gap: .5rem;
    flex: 0 0 auto;
    padding: .6rem 1rem .85rem;
    border-top: 1px solid var(--re-ink-100);
    background: var(--re-surface);
}

.re-chat-input {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 44px;
    padding: .55rem 1rem;
    border: 1px solid var(--re-ink-300);
    border-radius: var(--re-radius-pill);
    font-size: .9rem;
    outline: 0;
    transition: border-color var(--re-dur) var(--re-ease), box-shadow var(--re-dur) var(--re-ease);
}

.re-chat-input:focus {
    border-color: var(--re-primary-600);
    box-shadow: 0 0 0 4px var(--re-primary-100);
}

.re-chat-send {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: var(--re-radius-pill);
    background: var(--re-primary);
    color: #fff;
    font-size: 1.05rem;
    cursor: pointer;
    transition: background-color var(--re-dur) var(--re-ease), opacity var(--re-dur) var(--re-ease);
}

.re-chat-send:hover {
    background: var(--re-primary-600);
}

.re-chat-send:disabled {
    opacity: .5;
    cursor: default;
}

@media (max-width: 767.98px) {
    .re-chat {
        inset: 0;
        width: auto;
        height: 100%;
        height: 100dvh;
        border-radius: 0;
        animation: re-chat-in-mobile 220ms var(--re-ease);
    }

    .re-chat-head {
        padding-top: max(.8rem, env(safe-area-inset-top));
    }

    .re-chat-form {
        padding-bottom: max(.85rem, env(safe-area-inset-bottom));
    }

    @keyframes re-chat-in-mobile {
        from {
            opacity: 0;
            transform: translateY(16px);
        }

        to {
            opacity: 1;
            transform: none;
        }
    }
}

/* 14. Toast
   ========================================================================== */
.re-toast-wrap {
    position: fixed;
    bottom: 24px;
    left: 50%;
    z-index: var(--re-z-toast);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .5rem;
    width: max-content;
    max-width: calc(100vw - 2rem);
    transform: translateX(-50%);
    pointer-events: none;
}

.re-toast {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    max-width: 100%;
    padding: .7rem 1.1rem;
    border-radius: var(--re-radius-pill);
    background: var(--re-ink);
    color: #fff;
    font-size: .9rem;
    font-weight: 500;
    box-shadow: var(--re-shadow-lg);
    animation: re-toast-in 220ms var(--re-ease);
    pointer-events: auto;
}

.re-toast .bi {
    color: var(--re-accent);
}

.re-toast.is-leaving {
    animation: re-toast-out 200ms var(--re-ease) forwards;
}

@keyframes re-toast-in {
    from {
        opacity: 0;
        transform: translateY(12px);
    }
}

@keyframes re-toast-out {
    to {
        opacity: 0;
        transform: translateY(8px);
    }
}

/* 15. Error pages
   ========================================================================== */
.re-error {
    padding-block: 64px 80px;
}

.re-error-inner {
    max-width: 640px;
    margin: 0 auto;
    text-align: center;
}

.re-error-art {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 112px;
    height: 112px;
    margin: 0 auto 1.5rem;
    border: 1px solid var(--re-ink-200);
    border-radius: 30px;
    background: var(--re-surface);
    color: var(--re-primary);
    font-size: 3rem;
    box-shadow: var(--re-shadow);
}

.re-error-art img {
    display: block;
    width: 68px;
    height: 68px;
    object-fit: contain;
}

.re-error-art--warn {
    background: var(--re-accent-100);
    color: var(--re-accent-ink);
}

.re-error-code {
    margin: 0;
    color: var(--re-primary);
    font-family: var(--re-font-heading);
    font-size: .95rem;
    font-weight: 800;
    letter-spacing: .25em;
}

.re-error-title {
    margin: .3rem 0 .75rem;
    font-size: clamp(1.75rem, 3vw, 2.5rem);
    font-weight: 800;
    letter-spacing: -.02em;
}

.re-error-text {
    margin: 0 0 1.5rem;
    color: var(--re-ink-500);
    font-size: 1.05rem;
}

.re-error-search {
    max-width: 1040px;
    margin: 3.5rem auto 0;
}

.re-error-search-title {
    margin: 0 0 1rem;
    font-size: 1.125rem;
    font-weight: 700;
    text-align: center;
}

/* 16. Utilities
   ========================================================================== */
.re-text-muted { color: var(--re-ink-500) !important; }
.re-text-primary { color: var(--re-primary) !important; }
.re-text-accent { color: var(--re-accent-600) !important; }
.re-text-success { color: var(--re-success-ink) !important; }
.re-text-deal { color: var(--re-terracotta-ink) !important; }
.re-bg-surface { background: var(--re-surface) !important; }
.re-bg-soft { background: var(--re-primary-50) !important; }
.re-fw-600 { font-weight: 600 !important; }
.re-fw-700 { font-weight: 700 !important; }
.re-fw-800 { font-weight: 800 !important; }
.re-fs-sm { font-size: .875rem !important; }
.re-fs-xs { font-size: .78rem !important; }
.re-heading { font-family: var(--re-font-heading) !important; }
.re-shadow { box-shadow: var(--re-shadow) !important; }
.re-shadow-lg { box-shadow: var(--re-shadow-lg) !important; }
.re-rounded { border-radius: var(--re-radius) !important; }
.re-rounded-lg { border-radius: var(--re-radius-lg) !important; }

.re-truncate {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.re-clamp-2,
.re-clamp-3 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.re-clamp-2 { -webkit-line-clamp: 2; }
.re-clamp-3 { -webkit-line-clamp: 3; }

.re-hide-scrollbar {
    scrollbar-width: none;
}

.re-hide-scrollbar::-webkit-scrollbar {
    display: none;
}

.re-scroll-x {
    display: flex;
    gap: 1rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: .25rem;
}

.re-scroll-x::-webkit-scrollbar {
    display: none;
}

.re-scroll-x > * {
    flex: 0 0 auto;
    scroll-snap-align: start;
}

.re-icon-circle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: var(--re-radius-pill);
    background: var(--re-primary-100);
    color: var(--re-primary);
    font-size: 1.35rem;
}

.re-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: var(--re-radius-pill);
    background: var(--re-primary-100);
    color: var(--re-primary);
    font-family: var(--re-font-heading);
    font-size: .85rem;
    font-weight: 700;
}

/* 17. Print
   ========================================================================== */
@media print {
    body.re-body {
        background: #fff;
        color: #000;
    }

    .re-header {
        position: static;
        background: none !important;
        color: #000;
        box-shadow: none;
    }

    .re-header a {
        color: #000;
    }

    .re-header::before {
        display: none;
    }

    .re-header-actions,
    .re-header-mobile,
    .re-nav-pills,
    .re-demo-bar,
    .re-chat,
    .re-toast-wrap,
    .re-search,
    .re-offcanvas,
    .re-footer-langs,
    .re-pcard-cta {
        display: none !important;
    }

    .re-footer-main,
    .re-footer-bar {
        background: none;
        color: #000;
        padding: 16px 0 0;
        border-top: 1px solid #999;
    }

    .re-footer a,
    .re-footer-title,
    .re-footer-legal,
    .re-footer-disclaimer {
        color: #000;
    }

    .re-footer-main {
        display: none;
    }

    .re-card,
    .re-pcard {
        break-inside: avoid;
        box-shadow: none;
        border-color: #bbb;
    }

    a[href]::after {
        content: "";
    }
}