/* /viaggi/risultati — SOLO la colla fra la pagina risultati viaggi e il
 * linguaggio visivo della ricerca DI SITO (owner 02/08). Tutto il resto
 * arriva dai CSS già in produzione, che vanno caricati PRIMA:
 *   - hoescape.css        → barra .search-box/.search-field/.search-submit
 *   - hoescape-cerca.css  → card .hoe-hcard*, .filters-sidebar, .filter-*
 *   - viaggi-landing.css  → motore .vl-* (calendario, tendine, età)
 *
 * Prefisso .vr-. Due accorgimenti ereditati dai precedenti del repo:
 *  1) le palette --hoe-* e --vl-* sono scopate ai loro contenitori
 *     (ATTENZIONE: mai scrivere «asterisco+slash» nei commenti — chiude
 *     il commento e il parser butta la PRIMA regola che segue)
 *     (#availableCards, .vl-landing) → vanno RIDICHIARATE qui, come fa
 *     cms_page.html per .hoe-grid-block;
 *  2) le regole di sito sono dietro html[data-skin="hoe"]: /viaggi
 *     risponde anche dove il portale non risolve (dev/test), quindi i
 *     fallback qui sotto sono gated su html:not([data-skin="hoe"]) per
 *     non sovrascrivere mai lo skin vero.
 */

.vr-page {
    /* palette .hoe-* (mirror di hoescape-cerca.css ~1344) */
    --hoe-blue: #1e3c72; --hoe-blue-dark: #152a4f; --hoe-orange: #f5901e;
    --hoe-green: #25D366; --hoe-check: #22b07d;
    --hoe-text-2: #41506b; --hoe-label: #64708a; --hoe-icon: #97a3b8;
    /* palette .vl-* (mirror di viaggi-landing.css .vl-landing) */
    --vl-navy: var(--hoescape-primary, #1e3c72);
    --vl-navy-dark: var(--hoescape-primary-dark, #152a4f);
    --vl-lime: var(--hoescape-accent, #a4c639);
    --vl-lime-hover: var(--hoescape-accent-hover, #8fb02e);
    --vl-orange: #f5a623;
    --vl-alarm: #e4572e;
    --vl-tint: #f6faef;
    --vl-gray-400: #8a94a0;
    --vl-gray-500: var(--hoescape-gray-500, #6c757d);
    --vl-gray-700: var(--hoescape-gray-700, #495057);
    --vl-border: rgba(26, 58, 92, .12);
    --vl-field-border: rgba(26, 58, 92, .18);
    --vl-shadow-card: 0 4px 20px rgba(26, 58, 92, .07);
    --vl-radius: 16px;
    --vl-radius-field: 12px;
    background: #f4f6fa;
}

/* ── barra di ricerca: i campi viaggi dentro le scatole di sito ──────
   .search-field disegna già bordo/hover/focus: i controlli dentro
   devono essere trasparenti, o si vedono due bordi annidati. */
.vr-page .search-field .vl-field,
.vr-page .search-field .vl-dd-btn {
    border: 0; background: transparent; box-shadow: none;
    width: 100%; height: auto; padding: 0; margin: 0;
    /* 16px: sotto questa soglia iOS zooma al focus (nota in hoescape.css) */
    font-size: 16px; font-weight: 600; color: var(--hoe-blue);
    line-height: 1.35; cursor: pointer;
}
.vr-page .search-field select.vl-field {
    -webkit-appearance: none; appearance: none;
    padding-right: 22px;   /* spazio per la chevron di sito */
}
.vr-page .search-field .vl-dd-btn { text-align: left; }
.vr-page .search-input-wrap { position: relative; }
.vr-page .vr-date-hint {
    display: block; margin-top: 6px;
    font-size: 11.5px; font-weight: 600; color: var(--vl-alarm);
}
/* questo foglio è caricato DOPO viaggi-landing.css e ne ripete il
   `display`: senza ripeterne anche l'`[hidden]` i due avvisi rossi
   («nessuna partenza», «scegli la data») restano accesi sopra risultati
   pieni. Vedi la nota gemella in viaggi-landing.css. */
.vr-page .vr-date-hint[hidden] { display: none; }
/* la tendina brand (.vl-dd) si ancora al campo di sito; z-index sopra
   la toolbar mobile sticky (.cerca-actions, z-index 90) o il pannello
   ci finisce sotto */
.vr-page .search-field .vl-dd { position: static; }
.vr-page .search-field .vl-dd-panel { top: calc(100% + 10px); left: 0; z-index: 120; }

/* ── viaggiatori: pannello nello stile della tendina ospiti di sito ── */
.vr-guests-field .search-input-wrap { position: relative; }
.vr-guests-dd { padding: 16px 18px; }
.vr-guests-row {
    display: flex; align-items: center; justify-content: space-between;
    gap: 14px; padding: 12px 0;
}
.vr-guests-row + .vr-guests-row { border-top: 1.5px solid #e3e7ee; }
.vr-guests-row-label {
    font-size: 15px; font-weight: 600; color: var(--hoe-blue);
    display: flex; flex-direction: column;
}
.vr-guests-row-label small {
    font-size: 12px; font-weight: 500; color: var(--hoe-text-2);
}
/* .vl-stepper qui è flex-item diretto di .vr-guests-row (non un <div> di
   colonna grid come sulla landing): senza una larghezza propria si
   restringe al minimo e il numero finisce schiacciato contro i pulsanti. */
.vr-guests-row .vl-stepper { flex: 0 0 136px; }
.vr-guests-dd .vl-ages { margin-top: 10px; }
.vr-guests-foot { padding-top: 12px; }
.vr-guests-confirm { width: 100%; }

/* ── testata ─────────────────────────────────────────────────────── */
.vr-head { padding-top: 14px; }
.vr-title {
    font-size: 1.6rem; font-weight: 800; letter-spacing: -.02em;
    color: var(--hoe-blue); margin: 0;
}
.vr-sub {
    font-size: .95rem; font-weight: 500; color: var(--hoe-text-2);
    margin: 6px 0 0;
}
.vr-sub i { color: var(--hoe-check); }
.vr-sub-q { font-weight: 700; color: var(--hoe-blue); }
.vr-sub a { color: var(--hoe-blue); font-weight: 700; }

/* ── striscia «fun» ──────────────────────────────────────────────── */
.vr-fun {
    display: flex; align-items: center; gap: 10px;
    background: rgba(164, 198, 57, .16); border-radius: 12px;
    padding: 11px 15px; margin-top: 14px;
}
.vr-fun-emoji { font-size: 17px; }
.vr-fun-text {
    flex: 1; font-size: .9rem; font-weight: 600; line-height: 1.45;
    color: var(--hoe-blue);
}

/* ── sidebar filtri (checkbox) ──────────────────────────────────────
   Quadratini, etichette e conteggi arrivano dal CSS di /cerca
   (.filters-sidebar .form-check* in hoescape-cerca.css): qui solo il
   poco che manca. `.filter-opt-disabled` è definito inline in
   search_results.html, quindi va ridichiarato per questa pagina. */
.vr-filters .filter-opt-disabled { opacity: .45; }
.vr-filters .filter-opt-disabled .form-check-input,
.vr-filters .filter-opt-disabled .form-check-label { cursor: not-allowed; }
.vr-filter-total { color: var(--hoe-label); font-weight: 600; }
.vr-filters-apply { margin-bottom: 4px; }

/* ── barra voli in fondo al corpo della card ──────────────────────
   Testata (vettore a sinistra, bagaglio a destra) + tratte incolonnate
   sotto: prima gli elementi galleggiavano in un flex-wrap e si
   sfalsavano (owner 01/08 sera). */
.vr-flights {
    display: flex; flex-direction: column; gap: 8px;
    background: #f6faef; border: 1px solid rgba(26, 58, 92, .08);
    border-radius: 12px; padding: 10px 14px; margin-top: 2px;
}
.vr-flights-head {
    display: flex; align-items: center; justify-content: space-between;
    gap: 8px 12px; flex-wrap: wrap;
}
.vr-flights-airline {
    display: inline-flex; align-items: center; gap: 7px;
    font-size: .85rem; font-weight: 800; letter-spacing: .04em;
    color: var(--hoe-blue);
}
.vr-flights-airline i { color: var(--hoe-orange); }
.vr-legs { display: flex; flex-wrap: wrap; gap: 6px 28px; }
.vr-leg { display: block; }
.vr-leg-label {
    display: block; font-size: .7rem; font-weight: 800;
    letter-spacing: .08em; text-transform: uppercase; color: var(--hoe-label);
}
.vr-leg-val { display: block; font-size: .85rem; font-weight: 600; color: var(--hoe-text-2); }
/* Diretto/scali INLINE dopo l'etichetta (owner 02/08: niente riga extra) */
.vr-leg-head { display: flex; align-items: baseline; gap: 7px; }
.vr-leg-stops { font-size: .72rem; font-weight: 700; color: var(--hoe-label); }
.vr-leg-stops.is-direct { color: var(--hoe-check); }
/* mobile: ogni direzione su UNA riga (etichetta + diretto/scali + orari)
   — impilate a blocchi il box era mezzo vuoto a destra (owner 02/08) */
@media (max-width: 767.98px) {
    .vr-flights { gap: 5px; padding: 9px 12px; }
    .vr-legs { flex-direction: column; gap: 3px; }
    .vr-leg {
        display: flex; align-items: baseline; gap: 7px;
        flex-wrap: wrap;
    }
    .vr-leg-head { display: inline-flex; }
    .vr-leg-label, .vr-leg-val { display: inline; margin: 0; }
}
.vr-flights-pill {
    font-size: .75rem; font-weight: 700;
    color: var(--hoe-blue); background: rgba(164, 198, 57, .28);
    padding: 5px 11px; border-radius: 999px; white-space: nowrap;
}
/* «Ultimi N posti»: badge d'allarme, non il badge regalo dorato */
.vr-hcard .vr-badge-seats { border-color: #e4572e; }
.vr-hcard .vr-badge-seats i { color: #e4572e; }

/* ── rigo volo sotto il totale: «Volo incluso · partenza da X»
   (owner 01/08 sera) ─────────────────────────────────────────────── */
.vr-fly-row {
    display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
    margin-top: -4px;
}
.vr-flight-incl {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: .88rem; font-weight: 700; color: var(--hoe-check);
    white-space: nowrap;
}
.vr-flight-incl i { font-size: .95rem; }
.vr-fly-from { font-size: .88rem; font-weight: 600; color: var(--hoe-text-2); }

/* ── vuoto / troncamento ─────────────────────────────────────────── */
.vr-empty, .vr-truncated {
    display: flex; align-items: center; gap: 10px;
    background: #fff; border: 1px solid #e3e7ee; border-radius: 14px;
    padding: 18px; margin: 0; font-size: .95rem; font-weight: 600;
    color: var(--hoe-text-2);
}
.vr-truncated { margin-top: 16px; }

/* ── mobile <768px: hero compatta + toolbar (mirror ESATTO degli stili
   inline di partials/_search_hero_mobile.html su /cerca) ───────────── */
.cerca-hero {
    background: var(--hoe-blue, #1e3c72); color: #fff;
    margin: 0; padding: 12px 14px 14px;
}
.cerca-hero-top {
    display: flex; align-items: center; justify-content: space-between;
    gap: 10px;
}
.cerca-hero-loc {
    display: inline-flex; align-items: center; gap: 8px;
    font-size: 1.1rem; font-weight: 700; letter-spacing: -.01em;
    min-width: 0;
}
.cerca-hero-loc-icon { font-size: 1rem; line-height: 1; flex-shrink: 0; color: var(--vl-orange, #f5a623); }
.cerca-hero-loc-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cerca-hero-edit {
    flex-shrink: 0; background: transparent; color: #fff;
    border: 1px solid rgba(255, 255, 255, .6); border-radius: 6px;
    padding: 4px 10px; font-size: .72rem; font-weight: 600;
    min-height: 28px; cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: transform .08s ease, background .15s ease;
}
.cerca-hero-edit:active { background: rgba(255, 255, 255, .15); transform: scale(.96); }
.cerca-hero-edit.is-close {
    font-size: 1.4rem; font-weight: 400; line-height: 1;
    padding: 0 10px; min-width: 36px;
}
.cerca-hero-meta {
    display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 8px;
    font-size: .85rem; color: rgba(255, 255, 255, .94);
}
.cerca-hero-meta-item { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.cerca-hero-meta-item i { font-size: .95rem; opacity: .85; }
.cerca-hero-meta-item .cerca-hero-arrow { font-size: .85rem; opacity: .7; }
.cerca-hero-meta-item strong { font-weight: 600; }

.cerca-actions {
    display: grid; grid-template-columns: repeat(3, 1fr);
    background: #fff; border-bottom: 1px solid #e6ebf2;
    position: sticky; top: 0; z-index: 90;
    box-shadow: 0 2px 6px rgba(15, 30, 60, .04);
}
.cerca-action {
    position: relative; display: inline-flex; align-items: center;
    justify-content: center; gap: 7px; min-height: 48px;
    background: #fff; border: none; border-right: 1px solid #e6ebf2;
    color: var(--hoe-blue, #1e3c72); font-size: .92rem; font-weight: 700;
    text-decoration: none; cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: background .12s ease;
}
.cerca-action:last-child { border-right: none; }
.cerca-action:active { background: #f0f4ff; }
.cerca-action i { font-size: 1rem; }
.cerca-action:focus, .cerca-action:focus-visible { outline: none; box-shadow: none; }
.cerca-action.has-active-filters::after {
    content: ''; position: absolute; top: 50%; left: 50%;
    transform: translate(40px, -50%); width: 16px; height: 16px;
    background: var(--vl-orange, #f5a623); border: 2px solid #fff;
    border-radius: 50%; box-shadow: 0 2px 6px rgba(224, 144, 0, .45);
    pointer-events: none;
}

/* sotto i 768px: via il form (lo apre «Cambia»), via titolo e riga
   conteggio — come /cerca nasconde .search-summary e .search-toolbar.
   Il form aperto è nello stile di /cerca (hoe-cerca-form-wrap.is-open):
   prosegue il NAVY della hero, campi impilati come card bianche,
   bottone lime full width. */
@media (max-width: 767.98px) {
    .vr-page .vr-search-wrap { display: none; }
    .vr-page .vr-search-wrap.is-open {
        display: block;
        background: var(--hoe-blue, #1e3c72);
        max-width: 100%;
        margin: 0;
        padding: 2px 14px 16px !important;
    }
    .vr-page .vr-search-wrap.is-open .search-box {
        background: transparent; border: 0; box-shadow: none;
        border-radius: 0; padding: 0;
        /* la .search-box di skin (hoescape.css) ha z-index 10 ed è uno
           STACKING CONTEXT: lo z-index 120 del pannello tendina vale
           solo lì dentro, e la lista finiva SOTTO la toolbar sticky
           (z 90) — owner 02/08. Col form aperto tutta la scatola sale. */
        position: relative; z-index: 120;
    }
    .vr-page .vr-search-wrap.is-open .search-row {
        display: flex; flex-direction: column; align-items: stretch;
        gap: 10px;
    }
    .vr-page .vr-search-wrap.is-open .search-field {
        width: 100%; background: #fff; border: 0; border-radius: 10px;
        padding: 10px 14px; box-shadow: 0 1px 4px rgba(10, 25, 50, .18);
        /* i flex-basis pensati per la RIGA (190px) in colonna diventano
           ALTEZZA: qui il campo è alto quanto il contenuto */
        flex: 0 0 auto; min-height: 0; height: auto;
    }
    .vr-page .vr-search-wrap.is-open .search-label {
        color: #64708a; font-size: .68rem; font-weight: 800;
        letter-spacing: .06em; margin-bottom: 2px;
    }
    .vr-page .vr-search-wrap.is-open .search-label svg { display: none; }
    .vr-page .vr-search-wrap.is-open .search-chevron {
        position: absolute; right: 2px; top: 50%;
        transform: translateY(-50%); color: #64708a;
    }
    .vr-page .vr-search-wrap.is-open .vr-date-hint { color: #ffd9cf; }
    .vr-page .vr-search-wrap.is-open .search-submit {
        width: 100%; min-height: 52px; border: 0; border-radius: 10px;
        /* !important: hoescape.css ha un override navy !important sul
           .search-submit di sito — qui il CERCA è lime come su /cerca */
        background: var(--vl-lime, #a4c639) !important; color: #fff;
        font-size: 1rem; font-weight: 800; letter-spacing: .08em;
        text-transform: uppercase; cursor: pointer;
        display: flex; align-items: center; justify-content: center;
        gap: 8px; margin-top: 2px;
    }
    .vr-page .vr-search-wrap.is-open .search-submit svg { display: none; }
    .vr-head, .vr-results-summary { display: none; }
    .vr-fun { margin-top: 10px; }
}

/* ── bottom sheet «Ordina» ───────────────────────────────────────── */
.vr-sort-sheet { --bs-offcanvas-height: auto; }
.vr-sort-sheet .offcanvas-title {
    display: flex; align-items: center; gap: 6px;
    font-size: 1.02rem; font-weight: 800; color: var(--hoe-blue, #1e3c72);
}
.vr-sort-opts { display: flex; flex-direction: column; gap: 4px; padding-top: 0; }
.vr-sort-opt {
    display: flex; align-items: center; justify-content: space-between;
    width: 100%; border: 0; background: transparent; text-align: left;
    padding: 13px 8px; border-radius: 10px;
    font-size: .95rem; font-weight: 600; color: var(--hoe-text-2, #41506b);
    cursor: pointer;
}
.vr-sort-opt:active { background: #f0f4ff; }
.vr-sort-opt.is-current { color: var(--hoe-blue, #1e3c72); font-weight: 800; }
.vr-sort-opt.is-current i { color: var(--hoe-check, #22b07d); }

/* ── drawer filtri mobile (offcanvas-lg, come /cerca) ────────────── */
.vr-mobile-actions { display: flex; gap: 10px; }
.vr-filters-drawer-head {
    background: var(--hoe-blue, #1e3c72); color: #fff;
}
.vr-filters-drawer-head .offcanvas-title {
    display: flex; align-items: center; gap: 6px;
    font-size: 1.05rem; font-weight: 800;
}
.vr-drawer-reset { color: #fff; font-size: .85rem; font-weight: 700; }
/* nel drawer la card sidebar perde bordo/ombra: è già una superficie */
@media (max-width: 991.98px) {
    .vr-filters-offcanvas .vr-filters {
        border: 0; box-shadow: none; border-radius: 0; padding: 16px;
    }
}

@media (min-width: 992px) {
    .vr-title { font-size: 2rem; }
    /* Bootstrap mette display:flex sull'offcanvas-body sopra il
       breakpoint: qui deve restare un blocco normale */
    .vr-filters-offcanvas .offcanvas-body { display: block; }
    /* la sidebar segue lo scroll come su /cerca */
    .vr-filters { position: sticky; top: 16px; }
}

/* ====================================================================
   FALLBACK senza skin HoEscape (dev/test, portale non risolto): le
   regole di sito sono tutte dietro html[data-skin="hoe"]. Qui la pagina
   deve restare leggibile e USABILE — soprattutto la tendina ospiti, che
   senza CSS resterebbe sempre aperta.
   ==================================================================== */
html:not([data-skin="hoe"]) .vr-page .search-box {
    background: #fff; border: 1px solid #e3e7ee; border-radius: 16px;
    padding: 12px; box-shadow: 0 6px 24px rgba(15, 23, 42, .08);
}
html:not([data-skin="hoe"]) .vr-page .search-row {
    display: flex; flex-wrap: wrap; align-items: stretch; gap: 10px;
}
html:not([data-skin="hoe"]) .vr-page .search-field {
    flex: 1 1 190px; min-width: 0; position: relative;
    border: 1.5px solid #c9d0da; border-radius: 12px; padding: 10px 14px;
}
html:not([data-skin="hoe"]) .vr-page .search-label {
    display: block; font-size: .7rem; font-weight: 800;
    letter-spacing: .06em; color: #64708a; margin-bottom: 4px;
}
html:not([data-skin="hoe"]) .vr-page .search-label svg { display: none; }
html:not([data-skin="hoe"]) .vr-page .search-guests-btn {
    width: 100%; border: 0; background: transparent; padding: 0;
    text-align: left; font-size: 16px; font-weight: 600; color: #1e3c72;
    display: flex; align-items: center; justify-content: space-between;
}
html:not([data-skin="hoe"]) .vr-page .search-chevron { color: #64708a; }
html:not([data-skin="hoe"]) .vr-page .search-submit {
    flex: 0 0 auto; border: 0; border-radius: 12px; padding: 0 22px;
    background: #a4c639; color: #fff; font-weight: 800; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
}
html:not([data-skin="hoe"]) .vr-page .guests-dropdown {
    display: none; position: absolute; top: calc(100% + 10px); right: 0;
    z-index: 9001; width: 330px; max-width: calc(100vw - 32px);
    background: #fff; border-radius: 16px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, .18);
}
html:not([data-skin="hoe"]) .vr-page .guests-dropdown.active { display: block; }
html:not([data-skin="hoe"]) .vr-page .rooms-confirm-btn {
    border: 0; border-radius: 10px; padding: 10px 0; width: 100%;
    background: #1e3c72; color: #fff; font-weight: 700; cursor: pointer;
}
html:not([data-skin="hoe"]) .vr-page .hoe-hcard {
    display: flex; flex-direction: column; background: #fff;
    border: 1px solid #e3e7ee; border-radius: 18px; overflow: hidden;
    box-shadow: 0 4px 20px rgba(15, 23, 42, .07);
}
html:not([data-skin="hoe"]) .vr-page .hoe-hcard__media { aspect-ratio: 16 / 10; position: relative; }
html:not([data-skin="hoe"]) .vr-page .hoe-hcard__media img {
    width: 100%; height: 100%; object-fit: cover; display: block;
}
/* i badge tipo pacchetto ora stanno su OGNI foto: senza skin vanno
   comunque ancorati in alto a sinistra, non sotto l'immagine */
html:not([data-skin="hoe"]) .vr-page .hoe-hcard__badges {
    position: absolute; top: 12px; left: 12px;
    display: flex; flex-wrap: wrap; gap: 8px;
}
html:not([data-skin="hoe"]) .vr-page .hoe-hcard__badge {
    display: inline-flex; align-items: center; gap: 6px;
    background: #fff; border: 1.5px solid #f5a623; border-radius: 999px;
    padding: 5px 12px; font-size: .76rem; font-weight: 800; color: #1e3c72;
}
html:not([data-skin="hoe"]) .vr-page .hoe-hcard__badge i { color: #f5a623; }
html:not([data-skin="hoe"]) .vr-page .hoe-hcard__body {
    display: flex; flex-direction: column; gap: 8px; padding: 16px 18px;
}
html:not([data-skin="hoe"]) .vr-page .hoe-hcard__price-main {
    /* arancio come su /cerca (owner 01/08), anche senza skin */
    font-size: 1.9rem; font-weight: 800; color: #f5901e;
}
html:not([data-skin="hoe"]) .vr-page .hoe-hcard__see {
    display: inline-flex; align-items: center; gap: 8px;
    background: #1e3c72; color: #fff; text-decoration: none;
    padding: 12px 22px; border-radius: 10px; font-weight: 800;
}
html:not([data-skin="hoe"]) .vr-page .filters-sidebar {
    background: #fff; border: 1px solid #e3e7ee; border-radius: 16px;
    padding: 16px;
}
html:not([data-skin="hoe"]) .vr-page .filter-label {
    display: block; font-size: .8rem; font-weight: 800; color: #1e3c72;
    margin-bottom: 6px;
}
@media (min-width: 992px) {
    html:not([data-skin="hoe"]) .vr-page .hoe-hcard { flex-direction: row; }
    html:not([data-skin="hoe"]) .vr-page .hoe-hcard__media { flex: 0 0 45%; width: 45%; aspect-ratio: auto; }
    html:not([data-skin="hoe"]) .vr-page .hoe-hcard__body { flex: 1 1 55%; }
}

/* CTA PRENOTA: hoescape-cerca.css non è caricato qui — senza questi
   stili il tasto era BIANCO SU BIANCO (owner 01/08) */
.vr-page .hoe-hcard__see {
    display: inline-flex; align-items: center; gap: 8px;
    background: var(--vl-navy, #1e3c72); color: #fff !important;
    font-size: 13px; font-weight: 800; letter-spacing: .04em;
    padding: 13px 22px; border-radius: 12px; white-space: nowrap;
}
.vr-page .hoe-hcard__see:hover { background: var(--vl-navy-dark, #152a4f); color: #fff !important; }

/* prezzo ARANCIO come su /cerca (owner 01/08) — hoescape-cerca.css
   definisce --hoe-orange:#f5901e ma qui non è caricato */
.vr-page .hoe-hcard__price-main { color: #f5901e; }

/* Ricerca senza risultati (owner 18/08 sera): messaggio umano + form
   «richiedi un preventivo» precompilato. */
.vr-empty--lead { display: block; text-align: left; padding: 1.25rem 1.35rem; }
.vr-empty-head { display: flex; gap: .85rem; align-items: flex-start; }
.vr-empty-head > .bi { font-size: 1.6rem; color: #c98a00; margin-top: .1rem; }
.vr-empty-head strong { display: block; font-size: 1.05rem; color: #1e3c72; margin-bottom: .25rem; }
.vr-empty-head p { margin: 0 0 .25rem; color: #4a4a4a; }
.vr-empty-summary { font-size: .86rem; color: #667; }
.vr-empty-flash { margin: .8rem 0 0; padding: .55rem .8rem; border-radius: 8px; font-size: .9rem; background: #eef4ff; color: #1e3c72; }
.vr-empty-flash--success { background: #e9f7ee; color: #1f6b3a; }
.vr-empty-flash--warning, .vr-empty-flash--error { background: #fff3e0; color: #8a4b00; }
.vr-lead-form { margin-top: 1rem; }
.vr-lead-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem .9rem; }
.vr-lead-grid label { display: flex; flex-direction: column; gap: .25rem; font-size: .84rem; font-weight: 600; color: #333; }
.vr-lead-grid input, .vr-lead-grid textarea { border: 1.5px solid #dbe2ee; border-radius: 9px; padding: .55rem .7rem; font: inherit; font-weight: 400; }
.vr-lead-grid input:focus, .vr-lead-grid textarea:focus { outline: none; border-color: #1e3c72; box-shadow: 0 0 0 3px rgba(30,60,114,.12); }
.vr-lead-notes { grid-column: 1 / -1; }
.vr-lead-submit { margin-top: .9rem; border: 0; border-radius: 999px; padding: .7rem 1.4rem; font-weight: 700; color: #fff;
  background: linear-gradient(135deg, #f5a623, #e09000); cursor: pointer; }
.vr-lead-submit:hover { filter: brightness(.96); }
.vr-lead-privacy { margin: .6rem 0 0; font-size: .78rem; color: #667; }
@media (max-width: 575.98px) { .vr-lead-grid { grid-template-columns: 1fr; } }

/* ── /tour — hero della vetrina (spec 2026-08-21-1210) ──────────────────
   Breve per scelta: chi cerca un tour ha un'intenzione precisa e vuole
   arrivare ai filtri, non farsi raccontare una storia. */
.tour-hero {
    padding: 28px 0 8px;
}
.tour-hero__title {
    margin: 0;
    font-size: clamp(1.6rem, 4vw, 2.2rem);
    font-weight: 800;
    letter-spacing: -.02em;
}
.tour-hero__facts {
    margin: 6px 0 0;
    font-size: .95rem;
    opacity: .75;
}
.tour-dest-required {
    margin-top: 12px;
}

/* ── /tour — la coda della landing: il catalogo completo ────────────────
   La landing racconta, la griglia elenca. Il titolo separa le due cose,
   così chi scorre capisce di essere passato dal racconto all'indice. */
.tour-catalogo {
    padding: 32px 0 8px;
}
.tour-catalogo__title {
    margin: 0;
    font-size: clamp(1.4rem, 3.4vw, 1.9rem);
    font-weight: 800;
    letter-spacing: -.02em;
}
.tour-catalogo__sub {
    margin: 4px 0 16px;
    font-size: .95rem;
    opacity: .75;
}
.tour-dest-required {
    margin-bottom: 12px;
}