/* page-luxe-zone.css — page-scoped styles for /luxe-zone/ (moved out of index.html 2026-09-06) */
    /* Type-ahead hotel/location search above the region-grouped select. */
    .lz-search-field { grid-column: 1 / -1; }
    .lz-search-wrap { position: relative; }
    .lz-search-results {
      position: absolute;
      z-index: 1200;
      top: 100%;
      left: 0;
      right: 0;
      margin: 2px 0 0;
      padding: 0;
      list-style: none;
      background: var(--color-surface, #fff);
      border: 1px solid var(--color-border, #ccc);
      border-radius: var(--radius, 8px);
      box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
      max-height: 320px;
      overflow-y: auto;
    }
    .lz-search-results li {
      padding: 0.55rem 0.8rem;
      cursor: pointer;
      font-size: var(--text-sm);
    }
    .lz-search-results li .lz-search-loc { color: var(--color-muted); }
    .lz-search-results li[aria-selected="true"],
    .lz-search-results li:hover { background: var(--color-sky-soft, #eef4f4); }
    .lz-search-results li.lz-search-empty { color: var(--color-muted); cursor: default; background: none; }
    /* City rows are the primary result; the count is what makes a city
       worth picking over a single hotel. Section notes are not selectable,
       so they must not look or behave like options. */
    .lz-search-results li.lz-search-city {
      display: flex;
      align-items: baseline;
      justify-content: space-between;
      gap: var(--space-3);
    }
    .lz-search-results li.lz-search-city strong { font-weight: 600; }
    .lz-search-results li .lz-search-count {
      font-size: var(--text-xs);
      color: var(--color-muted);
      white-space: nowrap;
    }
    .lz-search-results li.lz-search-note {
      padding: 0.4rem 0.8rem 0.25rem;
      font-size: var(--text-xs);
      text-transform: uppercase;
      letter-spacing: 0.12em;
      color: var(--color-muted);
      cursor: default;
      background: none;
    }
    .lz-search-results li.lz-search-head {
      text-transform: none;
      letter-spacing: 0;
      font-size: var(--text-sm);
      color: var(--color-ink);
      border-bottom: 1px solid var(--hairline);
      padding-bottom: 0.4rem;
      margin-bottom: 0.2rem;
    }
/* block 2 */
    .lz-ratings {
      display: flex;
      flex-wrap: wrap;
      align-items: baseline;
      gap: var(--space-2);
      margin-top: var(--space-3);
    }
    .lz-rating-chip {
      display: inline-block;
      font-size: var(--text-xs);
      background: var(--color-sky-soft);
      color: var(--color-ocean-deep);
      border-radius: var(--radius-pill);
      padding: 0.2rem var(--space-2);
      white-space: nowrap;
    }
    .lz-rating-note {
      flex-basis: 100%;
      font-size: var(--text-xs);
      color: var(--color-muted);
    }
    .lz-ratings-foot {
      margin-top: var(--space-4);
      padding-top: var(--space-3);
      border-top: 1px solid var(--hairline);
      font-size: var(--text-xs);
      color: var(--color-muted);
    }
    .lz-ratings-foot a { color: inherit; }

    /* Preferred-partner chip. Brass rather than the ocean-blue of the rating
       chips, because it is a different kind of claim: the ratings are awards,
       this is a booking-side fact about the property. */
    .lz-partner-chip {
      background: #f3ece1;
      color: #6f5433;
    }

    /* Google rating on a place card, and the seasonal-closure caution.
       The caution is amber, not red — a temporary closure in Paris in August
       is expected, not an error. */
    .lz-google-rating {
      display: inline-block;
      font-size: var(--text-xs);
      font-weight: 600;
      color: var(--color-muted);
      white-space: nowrap;
      margin-left: var(--space-2);
    }
    .lz-place-warn {
      margin: var(--space-2) 0 0;
      padding: 0.35rem var(--space-2);
      border-left: 2px solid #b4893f;
      background: #fbf6ee;
      font-size: var(--text-xs);
      color: #6f5433;
    }

    /* Hotel-level closure. Deliberately stronger than .lz-place-warn: that one
       is amber because a restaurant shut in Paris in August is expected, while
       this says the hotel itself cannot be stayed in. Terracotta and a full
       rule, not a red alarm — the house rule is no fake urgency, and this is a
       fact stated plainly, sitting above the ratings so it is read before the
       stars rather than after them. */
    .lz-closure {
      margin-top: var(--space-3);
      padding: var(--space-3);
      border: 1px solid #dcbdb2;
      border-left: 3px solid #b4553f;
      border-radius: var(--radius-sm, 4px);
      background: #fdf4f1;
    }
    .lz-closure-head {
      margin: 0;
      font-weight: 600;
      color: #8f3f2c;
      letter-spacing: 0.01em;
    }
    .lz-closure-note {
      margin: var(--space-2) 0 0;
      font-size: var(--text-sm, var(--text-xs));
      color: #6f4034;
    }
    .lz-closure-foot {
      margin: var(--space-2) 0 0;
      font-size: var(--text-xs);
      color: var(--color-muted);
    }
    .lz-closure-foot a { color: inherit; }

    /* Climate strip: twelve months of recorded normals for the hotel's region
       (site/data/climate.json, Open-Meteo ERA5 2020-2024). The months of the
       chosen stay are outlined so the answer to "is August a mistake here?"
       is visible without reading a table. */
    .lz-climate { margin-top: var(--space-4); }
    .lz-climate-head {
      display: flex;
      flex-wrap: wrap;
      align-items: baseline;
      gap: var(--space-2);
      margin-bottom: var(--space-2);
    }
    .lz-climate-title {
      font-size: var(--text-xs);
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.14em;
      color: var(--color-muted);
    }
    .lz-climate-verdict { font-size: var(--text-xs); color: var(--color-ink); }
    .lz-climate-verdict strong { color: #8a6a42; }
    .lz-climate-months {
      display: grid;
      grid-template-columns: repeat(12, minmax(0, 1fr));
      gap: 3px;
    }
    .lz-month {
      border: 1px solid transparent;
      border-radius: var(--radius-sm, 6px);
      padding: 0.3rem 0.15rem 0.35rem;
      text-align: center;
      background: var(--color-sky-soft);
      min-width: 0;
    }
    .lz-month-name {
      font-size: 0.62rem;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: var(--color-muted);
      display: block;
    }
    .lz-month-temp {
      font-size: 0.78rem;
      font-weight: 700;
      color: var(--color-ocean-deep);
      display: block;
      line-height: 1.3;
    }
    .lz-month-rain {
      display: block;
      height: 3px;
      border-radius: 2px;
      background: #8fb2c9;
      margin: 0.25rem auto 0;
      max-width: 90%;
    }
    .lz-month.is-best { background: #e7efe4; }
    .lz-month.is-best .lz-month-temp { color: #3f6b45; }
    .lz-month.is-stay {
      border-color: #8a6a42;
      box-shadow: 0 0 0 1px #8a6a42 inset;
    }
    .lz-climate-foot {
      margin-top: var(--space-2);
      font-size: var(--text-xs);
      color: var(--color-muted);
    }
    @media (max-width: 700px) {
      .lz-climate-months { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 4px; }
    }
    /* Restaurant-level ratings on dining cards (schema note in luxezone.json):
       star chip after the name, muted price tier, small muted caveat line.
       The head keeps name/badge/price grouped left, distance pinned right. */
    .lz-card-head { justify-content: flex-start; flex-wrap: wrap; }
    .lz-card-head .lz-card-distance { margin-left: auto; }
    .lz-star-badge {
      display: inline-block;
      font-size: var(--text-xs);
      font-weight: 600;
      letter-spacing: 0.02em;
      background: var(--color-ocean-deep);
      color: #fff;
      border-radius: var(--radius-pill);
      padding: 0.1rem var(--space-2);
      white-space: nowrap;
    }
    /* Sourced badges are links to the rating's own page (usually the
       MICHELIN Guide). Same chip, plus an affordance on hover/focus. */
    a.lz-star-badge-link {
      text-decoration: none;
      cursor: pointer;
      transition: background-color var(--dur) var(--ease-out);
    }
    a.lz-star-badge-link:hover,
    a.lz-star-badge-link:focus-visible {
      background: var(--color-ink);
      text-decoration: underline;
    }
    .lz-price {
      font-size: var(--text-xs);
      color: var(--color-muted);
      letter-spacing: 0.08em;
    }
    /* Shown only when the 50 mi ring was switched on automatically because
       nothing sat inside the default 10 mi. It states that it happened —
       a silently widened radius would misrepresent how close things are. */
    .lz-radius-note {
      margin: var(--space-2) 0 0;
      font-size: var(--text-xs);
      line-height: 1.45;
      color: var(--color-muted);
    }
    .lz-dine-rating-note {
      font-size: var(--text-xs);
      color: var(--color-muted);
      margin: 0.15rem 0 0;
    }
    /* Event cards whose dates come from an official published page link to
       it (place.source), so a date claim is one click from proof. */
    .lz-event-source {
      font-size: var(--text-xs);
      margin: 0.15rem 0 0;
    }
    .lz-event-source a { color: var(--color-muted); }
    /* "Any hotel, anywhere" booking panel under the map — the page's
       conversion moment. The portal search is the dominant CTA. */
    .lz-anywhere {
      margin-top: var(--space-5);
      padding-top: var(--space-4);
      border-top: 1px solid var(--hairline);
    }
    .lz-anywhere h2 {
      font-size: var(--text-lg);
      margin: 0 0 var(--space-2);
    }
    .lz-anywhere-text {
      font-size: var(--text-sm);
      color: var(--color-muted);
      margin: 0 0 var(--space-3);
    }
    .lz-anywhere-actions {
      display: flex;
      flex-direction: column;
      gap: var(--space-3);
    }
    .lz-cta-main {
      display: block;
      width: 100%;
      box-sizing: border-box;
      text-align: center;
      padding: var(--space-4) var(--space-6);
      font-size: var(--text-lg);
    }
    .lz-anywhere-primary .leaving-note {
      display: block;
      margin-top: var(--space-2);
      text-align: center;
      font-size: var(--text-xs);
      color: var(--color-muted);
    }
    .lz-anywhere-actions .lz-cta-main { display:block; width:100%; text-align:center; box-sizing:border-box; }
    .lz-handoff { font-size:.85rem; color: var(--color-muted); display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; margin:.25rem 0 .5rem; }
    .lz-handoff strong { color: var(--color-text); font-weight:600; }
    .lz-copy { font: inherit; font-size:.8rem; padding:.15rem .6rem; border:1px solid var(--color-border); border-radius:999px; background:var(--color-surface); cursor:pointer; }
    .lz-copy:hover { border-color: var(--color-ocean); }
    /* Quiet request line at the bottom of the results panel. */
    .lz-request-line {
      margin-top: var(--space-4);
      font-size: var(--text-sm);
      color: var(--color-muted);
    }
    .lz-request-line a { color: inherit; }