/* ItalianWines.co.uk - Wineries Region Facet page
 * Builds on colors_and_type.css tokens + styles.css header/footer chrome.
 * No 1px borders, minimum 12px radius, warm ambient shadows, parchment bg.
 * ----------------------------------------------------------------------- */

/* Body owns the parchment; main is a column stack */
body { margin: 0; background: var(--color-background); color: var(--color-on-surface); }
.wr-app { min-height: 100vh; }
.wr-main { padding-bottom: 48px; }
.wr-container { max-width: 1280px; margin: 0 auto; padding: 0 32px; }

/* Reusable eyebrow + headings - larger than iw-eyebrow for directory scale */
.wr-eyebrow {
  font-family: var(--font-label); font-weight: 700; font-size: 11px;
  letter-spacing: 0.18em; text-transform: uppercase; color: var(--color-primary);
  display: inline-block;
}
.wr-h1 {
  font-family: var(--font-display); font-weight: 700;
  font-size: clamp(40px, 5.5vw, 68px); letter-spacing: 0;
  line-height: 1.02; color: var(--color-primary);
  margin: 14px 0 20px;
}
.wr-h1 .wr-region-em {
  font-style: italic; font-weight: 500; color: #7a1e49;
}
.wr-h2 {
  font-family: var(--font-display); font-weight: 700;
  font-size: clamp(28px, 3vw, 40px); letter-spacing: 0;
  line-height: 1.08; color: var(--color-primary); margin: 6px 0 0;
}

/* SECTION 1 - HERO */
.wr-hero-band {
  background: var(--color-surface-container-low);
  padding: 36px 0 56px;
  position: relative; overflow: hidden;
}
.wr-hero-band::before {
  content: ""; position: absolute; inset: 0;
  background:
    radial-gradient(600px 300px at 85% 30%, rgba(122,30,73,0.08), transparent 70%),
    radial-gradient(500px 260px at 12% 90%, rgba(86,19,113,0.06), transparent 70%);
  pointer-events: none;
}
.wr-hero-band > .wr-container { position: relative; z-index: 1; }
.wr-breadcrumb {
  font-family: var(--font-label); font-size: 11px; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--color-on-surface-variant);
  display: flex; align-items: center; gap: 10px; margin-bottom: 28px;
}
.wr-breadcrumb a {
  color: var(--color-on-surface-variant); text-decoration: none;
  transition: color var(--dur-fast) var(--ease-out);
}
.wr-breadcrumb a:hover { color: var(--color-primary); }
.wr-crumb-sep { color: rgba(28,28,25,0.3); }
.wr-crumb-current { color: var(--color-primary); font-weight: 600; }

.wr-hero-row {
  display: grid; grid-template-columns: 1fr auto;
  gap: 48px; align-items: center;
}
.wr-hero-copy { max-width: 720px; min-width: 0; }
.wr-hero-sub {
  font-family: var(--font-body); font-size: 17px; line-height: 1.6;
  color: var(--color-on-surface-variant); max-width: 580px; margin: 0 0 28px;
}
.wr-hero-sub b {
  color: var(--color-primary); font-weight: 700;
  font-family: var(--font-display); font-variant-numeric: oldstyle-nums;
}

/* Stats strip - desktop keeps the existing inline chip rhythm. */
.wr-stats {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 8px;
}
.wr-stat {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--color-surface-container-lowest);
  border-radius: var(--radius-xl);
  padding: 12px 22px 12px 18px;
  box-shadow: var(--shadow-ambient-sm);
  transition: transform var(--dur-med) var(--ease-out),
              box-shadow var(--dur-med) var(--ease-out);
}
.wr-stat:hover { transform: translateY(-2px); box-shadow: var(--shadow-ambient); }
.wr-stat-primary {
  background: var(--color-surface-container-lowest);
  color: inherit;
}
.wr-stat-top { display: contents; }
.wr-stat-icon {
  order: 0;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: var(--radius-lg);
  background: rgba(86,19,113,0.08);
  color: var(--color-primary);
  flex: 0 0 auto;
}
.wr-stat-asset {
  width: 30px;
  height: 30px;
  object-fit: contain;
}
.wr-stat-n {
  order: 1;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 22px;
  color: var(--color-primary);
  font-variant-numeric: oldstyle-nums;
  letter-spacing: 0;
}
.wr-stat-l {
  order: 2;
  font-family: var(--font-label);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-on-surface-variant);
}

/* Silhouette decoration on the right of the hero */
.wr-hero-map {
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  padding: 8px 4px;
}
.wr-silhouette { filter: drop-shadow(0 12px 24px rgba(86,19,113,0.18)); }
.wr-silhouette-lbl {
  font-family: var(--font-label); font-size: 10px;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--color-on-surface-variant);
}

/* SECTION 2 - REGIONAL CONTEXT */
.wr-context-band { padding: 40px 0 32px; }
.wr-context {
  background: var(--color-surface-container-lowest);
  border-radius: 20px;
  padding: 26px 32px;
  box-shadow: var(--shadow-ambient-sm);
  display: grid; grid-template-columns: 56px 1fr;
  gap: 22px; align-items: start;
  max-width: 820px; margin: 0 auto;
  position: relative; overflow: hidden;
}
.wr-context::before {
  /* gold hairline top */
  content: ""; position: absolute; left: 28px; right: 28px; top: 0; height: 3px;
  background: linear-gradient(to right, transparent, #c89c52, transparent);
  border-radius: 0 0 3px 3px;
}
.wr-context-mark {
  width: 48px; height: 48px; border-radius: 14px;
  background: rgba(86,19,113,0.08);
  color: var(--color-primary);
  display: grid; place-items: center;
}
.wr-context-asset {
  width: 44px; height: 44px;
  object-fit: contain;
}
.wr-context-eyebrow {
  font-family: var(--font-label); font-weight: 700; font-size: 10px;
  letter-spacing: 0.16em; text-transform: uppercase; color: var(--color-primary);
  display: block; margin-bottom: 6px;
}
.wr-context-lead {
  font-family: var(--font-display); font-style: italic; font-weight: 400;
  font-size: 18px; line-height: 1.55; color: var(--color-on-surface);
  margin: 0 0 14px; text-wrap: pretty;
}
.wr-context-link {
  font-family: var(--font-label); font-weight: 600; font-size: 12px;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--color-primary); text-decoration: none;
  transition: letter-spacing var(--dur-med) var(--ease-out);
}
.wr-context-link:hover { letter-spacing: 0.14em; }
.wr-context-link span {
  margin-left: 4px; transition: transform var(--dur-med) var(--ease-out);
  display: inline-block;
}
.wr-context-link:hover span { transform: translateX(4px); }
.wr-context-link-row { display: block; }
.wr-context-link-icon { display: none; }
.wr-context-link-asset {
  width: 44px;
  height: 44px;
  object-fit: contain;
}

/* SECTION 3 - FILTER + SORT */
.wr-filter-band { padding: 20px 0 8px; }
.wr-results-shell { transition: opacity var(--dur-fast) var(--ease-out); }
.wr-results-shell.is-loading { opacity: 0.58; pointer-events: none; }
.wr-filter-row {
  display: flex; justify-content: space-between; align-items: center;
  gap: 24px; flex-wrap: wrap;
}

.wr-visit-toggles { display: flex; gap: 10px; flex-wrap: wrap; }
.wr-visit-chip {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--color-surface-container-lowest);
  color: var(--color-on-surface);
  font-family: var(--font-body); font-weight: 600; font-size: 13px;
  padding: 10px 18px; border-radius: var(--radius-pill);
  border: 0; cursor: pointer;
  box-shadow: var(--shadow-ambient-sm);
  transition: all var(--dur-med) var(--ease-out);
}
.wr-visit-chip:hover { transform: translateY(-1px); box-shadow: var(--shadow-ambient); }
.wr-visit-chip .wr-visit-icon { color: var(--color-primary); display: inline-grid; }
.wr-visit-chip.is-on {
  background: var(--gradient-cta); color: #fff;
}
.wr-visit-chip.is-on .wr-visit-icon { color: #fff; }

.wr-sort { display: flex; align-items: center; gap: 12px; }
.wr-sort-lbl {
  font-family: var(--font-label); font-weight: 700; font-size: 10px;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--color-on-surface-variant);
}
.wr-sort-switch {
  display: inline-flex; background: var(--color-surface-container-lowest);
  border-radius: var(--radius-pill); padding: 4px;
  box-shadow: var(--shadow-ambient-sm);
}
.wr-sort-btn {
  background: transparent; border: 0; cursor: pointer;
  font-family: var(--font-body); font-weight: 600; font-size: 12.5px;
  color: var(--color-on-surface-variant);
  padding: 7px 14px; border-radius: var(--radius-pill);
  transition: all var(--dur-fast) var(--ease-out);
}
.wr-sort-btn:hover { color: var(--color-primary); }
.wr-sort-btn.is-on {
  background: var(--color-primary); color: #fff;
}

.wr-filter-meta {
  display: flex; align-items: center; gap: 16px;
  margin-top: 18px;
  font-family: var(--font-label); font-size: 11px;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--color-on-surface-variant);
}
.wr-filter-meta b {
  color: var(--color-primary); font-family: var(--font-display);
  font-variant-numeric: oldstyle-nums; font-size: 13px;
}
.wr-filter-clear {
  background: transparent; border: 0; cursor: pointer;
  font-family: var(--font-label); font-size: 11px;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--color-primary); font-weight: 700;
  padding: 4px 10px; border-radius: var(--radius-pill);
  transition: background var(--dur-fast) var(--ease-out);
}
.wr-filter-clear:hover { background: rgba(86,19,113,0.08); }

/* SECTION 4 - GRID */
.wr-grid-band { padding: 28px 0 16px; }
.wr-grid {
  display: grid;
  grid-template-columns: repeat(var(--wr-cols, 3), 1fr);
  gap: 24px;
}
/* Curator card spans 2 cols on 3-col grids, 2 cols on 4-col */
.wr-grid .wr-card--curator {
  grid-column: span 2;
}

.wr-card {
  display: flex; flex-direction: column;
  background: var(--color-surface-container-lowest);
  border-radius: var(--wr-card-radius, 20px);
  overflow: hidden;
  box-shadow: var(--shadow-ambient-sm);
  text-decoration: none; color: inherit;
  transition: transform var(--dur-med) var(--ease-out),
              box-shadow var(--dur-med) var(--ease-out);
  position: relative;
}
.wr-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-ambient-lg);
}

.wr-card-photo {
  position: relative;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: var(--color-surface-container-low);
}
.wr-card-photo img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform var(--dur-slow) var(--ease-out);
}
.wr-card:hover .wr-card-photo img { transform: scale(1.03); }

/* Region-colour corner flag (editorial tell) */
.wr-card-flag {
  position: absolute; top: 14px; left: 14px;
  font-family: var(--font-label); font-weight: 700;
  font-size: 9px; letter-spacing: 0.14em; text-transform: uppercase;
  color: #fff;
  padding: 6px 12px; border-radius: var(--radius-pill);
  backdrop-filter: blur(8px);
  box-shadow: 0 4px 14px rgba(0,0,0,0.18);
}

.wr-card-body {
  padding: 18px 22px 22px;
  display: flex; flex-direction: column; gap: 8px;
  flex: 1;
}
.wr-card-loc {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--font-label); font-size: 10.5px;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--color-on-surface-variant);
}
.wr-card-loc-icon { display: inline-grid; place-items: center; flex: 0 0 auto; }
.wr-card-loc-asset { width: 16px; height: 16px; object-fit: contain; }
.wr-card-name {
  font-family: var(--font-display); font-weight: 600;
  font-size: 22px; line-height: 1.15; letter-spacing: 0;
  color: var(--color-primary); margin: 0;
}
.wr-card-blurb {
  font-family: var(--font-body); font-size: 13px; line-height: 1.5;
  color: var(--color-on-surface-variant);
  margin: 4px 0 2px;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
  overflow: hidden; text-wrap: pretty;
}
.wr-card-meta {
  display: flex; gap: 14px; flex-wrap: wrap;
  font-family: var(--font-label); font-size: 10.5px;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--color-on-surface-variant);
  margin-top: 4px;
}
.wr-card-meta b {
  color: var(--color-primary); font-family: var(--font-display);
  font-variant-numeric: oldstyle-nums; font-size: 14px;
  text-transform: none; letter-spacing: 0; margin-right: 3px;
}
.wr-card-count b { font-size: 16px; }

.wr-badges {
  display: flex; flex-wrap: wrap; gap: 6px;
  list-style: none; margin: 6px 0 4px; padding: 0;
}
.wr-badge {
  display: inline-flex; align-items: center; gap: 5px;
  background: rgba(86,19,113,0.07);
  color: var(--color-primary);
  font-family: var(--font-label); font-weight: 700;
  font-size: 9.5px; letter-spacing: 0.12em; text-transform: uppercase;
  padding: 5px 9px 5px 7px; border-radius: 10px;
}
.wr-badge-icon { display: inline-grid; }
.wr-badge-asset { width: 15px; height: 15px; object-fit: contain; flex: 0 0 auto; }

.wr-card-cta {
  margin-top: auto; padding-top: 10px;
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--font-body); font-weight: 600; font-size: 13px;
  color: var(--color-primary);
}
.wr-card-arrow {
  display: inline-block;
  transition: transform var(--dur-med) var(--ease-out);
}
.wr-card:hover .wr-card-arrow { transform: translateX(4px); }

/* Coloured placeholder - region tint + initial */
.wr-placeholder {
  width: 100%; height: 100%;
  display: grid; place-items: center;
  position: relative; overflow: hidden;
}
.wr-placeholder-grape {
  position: absolute; right: -20px; bottom: -20px;
  width: 60%; height: 60%;
}
.wr-placeholder-initial {
  font-family: var(--font-display); font-weight: 700;
  font-size: clamp(60px, 10vw, 110px);
  color: rgba(255,255,255,0.92);
  line-height: 1; letter-spacing: 0;
  text-shadow: 0 4px 20px rgba(0,0,0,0.15);
}
.wr-placeholder-tag {
  position: absolute; top: 14px; right: 14px;
  font-family: var(--font-label); font-weight: 600;
  font-size: 9px; letter-spacing: 0.14em; text-transform: uppercase;
  color: rgba(255,255,255,0.7);
  padding: 5px 10px; border-radius: var(--radius-pill);
  background: rgba(0,0,0,0.2); backdrop-filter: blur(6px);
}

/* ── Curator's pick ── */
.wr-card--curator {
  display: grid; grid-template-columns: 1.1fr 1fr;
  overflow: hidden;
  box-shadow: var(--shadow-ambient);
  position: relative;
}
.wr-card--curator::before {
  /* gold hairline along the top */
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px;
  background: linear-gradient(to right, #c89c52, #e0b87a, #c89c52);
  z-index: 2;
}
.wr-card--curator:hover { box-shadow: var(--shadow-ambient-lg); }
.wr-curator-photo {
  position: relative; overflow: hidden;
  min-height: 360px;
}
.wr-curator-photo img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform var(--dur-slow) var(--ease-out);
}
.wr-card--curator:hover .wr-curator-photo img { transform: scale(1.04); }
.wr-curator-ribbon {
  position: absolute; top: 18px; left: 18px;
  display: inline-flex; align-items: center; gap: 6px;
  background: #fff; color: #8b6314;
  font-family: var(--font-label); font-weight: 700;
  font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase;
  padding: 7px 13px 7px 11px; border-radius: var(--radius-pill);
  box-shadow: 0 10px 24px rgba(86,19,113,0.2);
}
.wr-curator-ribbon svg { color: #c89c52; }

.wr-curator-body {
  padding: 28px 32px 28px;
  display: flex; flex-direction: column; gap: 12px;
  background: var(--color-surface-container-lowest);
}
.wr-curator-name {
  font-size: 30px !important; line-height: 1.08;
  margin: 4px 0 2px;
}
.wr-curator-quote {
  font-family: var(--font-display); font-style: italic;
  font-size: 16px; line-height: 1.45;
  color: var(--color-on-surface);
  margin: 6px 0 4px;
  padding-left: 16px;
  position: relative;
  text-wrap: pretty;
}
.wr-curator-quote-mark {
  position: absolute; left: -4px; top: -10px;
  font-size: 38px; color: var(--color-primary); opacity: 0.4;
  font-style: normal; line-height: 1;
}
.wr-curator-stats {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px 22px;
  padding: 14px 0 6px;
  margin-top: 6px;
  border-top: 0; position: relative;
}
.wr-curator-stats::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0;
  height: 1px;
  background: linear-gradient(to right, rgba(86,19,113,0.12), transparent);
}
.wr-curator-stat {
  display: flex; flex-direction: column; gap: 2px;
}
.wr-curator-stat b {
  font-family: var(--font-display); font-weight: 600;
  font-size: 20px; color: var(--color-primary);
  font-variant-numeric: oldstyle-nums; letter-spacing: 0;
}
.wr-curator-stat span {
  font-family: var(--font-label); font-size: 9.5px;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--color-on-surface-variant);
}
.wr-curator-stat-wide { grid-column: span 2; }
.wr-curator-wine { font-size: 16px !important; font-style: italic; }

.wr-curator-cta { margin-top: 10px; font-size: 14px; }

/* SECTION 5 - PAGINATION */
.wr-page-band { padding: 40px 0 32px; }
.wr-pagination {
  display: flex; justify-content: center; align-items: center;
  gap: 16px;
}
.wr-pg-btn {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--color-surface-container-lowest);
  border: 0; cursor: pointer;
  font-family: var(--font-body); font-weight: 600; font-size: 12.5px;
  color: var(--color-primary);
  padding: 10px 16px; border-radius: var(--radius-pill);
  box-shadow: var(--shadow-ambient-sm);
  transition: all var(--dur-med) var(--ease-out);
}
.wr-pg-btn:hover:not(:disabled) { transform: translateY(-1px); box-shadow: var(--shadow-ambient); }
.wr-pg-btn:disabled { opacity: 0.4; cursor: not-allowed; }

.wr-pg-pages { display: flex; gap: 6px; }
.wr-pg-num {
  background: transparent; border: 0; cursor: pointer;
  width: 38px; height: 38px; border-radius: 999px;
  font-family: var(--font-body); font-weight: 600; font-size: 13px;
  color: var(--color-on-surface);
  transition: all var(--dur-fast) var(--ease-out);
}
.wr-pg-num:hover { background: var(--color-surface-container-lowest); color: var(--color-primary); }
.wr-pg-num.is-on {
  background: var(--color-primary); color: #fff;
  box-shadow: var(--shadow-ambient-sm);
}

/* SECTION 6: OTHER REGIONS */
.wr-other-band { padding: 56px 0 32px; }
.wr-other-head { margin-bottom: 24px; }
.wr-region-chips {
  display: flex; gap: 10px; flex-wrap: wrap;
}
.wr-region-chip {
  display: inline-flex; align-items: center; gap: 10px;
  background: var(--color-surface-container-lowest);
  padding: 10px 18px 10px 14px; border-radius: var(--radius-pill);
  text-decoration: none; color: var(--color-on-surface);
  box-shadow: var(--shadow-ambient-sm);
  transition: all var(--dur-med) var(--ease-out);
}
.wr-region-chip:hover {
  transform: translateY(-2px); box-shadow: var(--shadow-ambient);
  color: var(--color-primary);
}
.wr-region-chip-dot {
  width: 12px; height: 12px; border-radius: 999px;
  flex: 0 0 auto;
  box-shadow: 0 0 0 3px rgba(255,255,255,0.5) inset;
}
.wr-region-chip-icon {
  width: 28px; height: 28px; flex: 0 0 auto; object-fit: contain;
}
.wr-region-chip-name {
  font-family: var(--font-body); font-weight: 600; font-size: 13px;
}
.wr-region-chip-n {
  font-family: var(--font-display); font-variant-numeric: oldstyle-nums;
  color: var(--color-on-surface-variant); font-size: 13px;
}

/* SECTION 7 - FAQ */
.wr-faq-band { padding: 48px 0 64px; }
.wr-faq-head { margin-bottom: 24px; max-width: 720px; }
.wr-faq { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px;
          max-width: 820px; }
.wr-faq-item {
  background: var(--color-surface-container-lowest);
  border-radius: 18px; overflow: hidden;
  box-shadow: var(--shadow-ambient-sm);
  transition: box-shadow var(--dur-med) var(--ease-out);
}
.wr-faq-item.is-open { box-shadow: var(--shadow-ambient); }
.wr-faq-q {
  width: 100%; background: transparent; border: 0; cursor: pointer;
  display: flex; align-items: center; justify-content: space-between;
  gap: 20px; padding: 18px 22px;
  font-family: var(--font-display); font-weight: 600;
  font-size: 17px; color: var(--color-primary);
  text-align: left;
}
.wr-faq-toggle {
  width: 32px; height: 32px; border-radius: 999px;
  background: rgba(86,19,113,0.08); color: var(--color-primary);
  display: grid; place-items: center;
  transition: transform var(--dur-med) var(--ease-out),
              background var(--dur-med) var(--ease-out);
}
.wr-faq-toggle.is-open {
  transform: rotate(45deg);
  background: var(--color-primary); color: #fff;
}
.wr-faq-a {
  padding: 0 22px 20px;
  font-family: var(--font-body); font-size: 14.5px; line-height: 1.6;
  color: var(--color-on-surface-variant);
  max-width: 680px; text-wrap: pretty;
}

/* ────── EMPTY STATE ────── */
.wr-empty {
  text-align: center;
  padding: 56px 32px;
  background: var(--color-surface-container-lowest);
  border-radius: 24px;
  box-shadow: var(--shadow-ambient-sm);
  max-width: 560px; margin: 12px auto;
}
.wr-empty-ill {
  width: 92px; height: 92px; border-radius: 999px;
  background: rgba(86,19,113,0.08); color: var(--color-primary);
  display: grid; place-items: center; margin: 0 auto 18px;
}
.wr-empty h3 {
  font-family: var(--font-display); font-weight: 600;
  font-size: 22px; color: var(--color-primary);
  margin: 0 0 10px; line-height: 1.2;
}
.wr-empty p {
  font-family: var(--font-body); font-size: 14px; line-height: 1.55;
  color: var(--color-on-surface-variant); margin: 0 auto 20px;
  max-width: 420px; text-wrap: pretty;
}
.wr-empty-actions {
  display: inline-flex; align-items: center; gap: 18px;
}
.wr-empty-link {
  font-family: var(--font-label); font-weight: 700; font-size: 11px;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--color-primary); text-decoration: none;
}
.wr-empty-link:hover { text-decoration: underline; }

/* ────── RESPONSIVE ────── */
@media (max-width: 960px) {
  .wr-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .wr-grid .wr-card--curator { grid-column: span 2; grid-template-columns: 1fr; }
  .wr-curator-photo { min-height: 280px; aspect-ratio: 16/10; }
  .wr-hero-row { grid-template-columns: 1fr; }
  .wr-hero-map { display: none; }
}
@media (max-width: 640px) {
  .wr-container { padding: 0 20px; }
  .wr-hero-band > nav[aria-label="Breadcrumb"] {
    padding-left: 20px;
    padding-right: 20px;
  }
  .wr-grid { grid-template-columns: 1fr !important; }
  .wr-grid .wr-card--curator { grid-column: span 1; }
  .wr-filter-row { flex-direction: column; align-items: flex-start; }
  .wr-stats {
    flex-wrap: nowrap;
    gap: 10px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    margin-right: -20px;
    margin-left: 0;
    padding: 4px 20px 12px 0;
    max-width: none;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .wr-stats::-webkit-scrollbar { display: none; }
  .wr-stat {
    flex: 0 0 132px;
    min-width: 132px;
    min-height: 128px;
    flex-direction: column;
    align-items: stretch;
    justify-content: space-between;
    gap: 16px;
    padding: 14px;
    background: var(--color-surface-container-lowest);
    scroll-snap-align: start;
  }
  .wr-stat-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
  }
  .wr-stat-icon {
    order: initial;
    width: 52px;
    height: 52px;
    border-radius: var(--radius-lg);
  }
  .wr-stat-asset {
    width: 46px;
    height: 46px;
  }
  .wr-stat-n {
    order: initial;
    font-size: 28px;
    line-height: 1;
  }
  .wr-stat-l {
    order: initial;
    display: block;
    line-height: 1.25;
    overflow-wrap: anywhere;
  }
  .wr-context {
    grid-template-columns: 1fr;
    padding: 24px 22px;
  }
  .wr-context > .wr-context-mark { display: none; }
  .wr-context-copy { min-width: 0; }
  .wr-context-lead,
  .wr-context-body {
    width: 100%;
    max-width: none;
  }
  .wr-context-link-row {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 16px;
  }
  .wr-context-link-icon {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    border-radius: 14px;
    background: rgba(86,19,113,0.08);
    flex: 0 0 auto;
  }
  .wr-curator-body { padding: 22px 20px; }
  .wr-curator-name { font-size: 24px !important; }
}



/* SECTION 2B: MAP AND FILTER PLANNER */
.wr-planner-band { padding: 34px 0 18px; }
.wr-planner-head {
  display: flex; align-items: end; justify-content: space-between;
  gap: 18px; margin-bottom: 18px;
}
.wr-h3 {
  font-family: var(--font-display); font-weight: 700;
  font-size: clamp(22px, 2.4vw, 28px); letter-spacing: 0;
  color: var(--color-primary); margin: 4px 0 0; line-height: 1.1;
}
.wr-planner-grid {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 380px);
  gap: 22px; align-items: start;
}
.wr-planner-grid.no-map {
  grid-template-columns: minmax(300px, 420px);
}
.wr-filter-clear-link[hidden],
.wr-filter-clear[hidden] {
  display: none !important;
}
.wr-main .wines-filter-fab[aria-controls="wr-filter-sheet"] {
  display: none;
  border: 1px solid rgba(86,19,113,0.28);
  background-color: #fff;
  color: var(--color-on-surface-variant);
}
.wr-main .wines-filter-fab[aria-controls="wr-filter-sheet"] .wines-filter-fab-badge[hidden] {
  display: none !important;
}
.wr-main .wines-filter-fab[aria-controls="wr-filter-sheet"].is-active {
  background-color: var(--color-primary);
  color: #fff;
  border-color: transparent;
}
.wr-map-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas:
    "eyebrow icon"
    "title icon"
    "lede icon";
  align-items: center;
  column-gap: 24px;
  justify-content: space-between;
  width: 100%;
  max-width: none;
  margin-bottom: 18px;
}
.wr-map-head .wr-section-icon {
  grid-area: icon;
  justify-self: end;
  align-self: center;
  width: 100px;
  height: 100px;
  border-radius: 24px;
  margin-bottom: 0;
}
.wr-map-head .wr-section-asset {
  width: 88px;
  height: 88px;
}
.wr-map-head .wr-eyebrow {
  grid-area: eyebrow;
}
.wr-map-head .wr-h2 {
  grid-area: title;
}
.wr-map-head .wr-map-lede {
  grid-area: lede;
}
.wr-section-icon {
  width: 58px; height: 58px;
  border-radius: 16px;
  background: rgba(86,19,113,0.07);
  display: grid; place-items: center;
  margin-bottom: 12px;
}
.wr-section-asset {
  width: 50px; height: 50px;
  object-fit: contain;
}
.wr-map-lede {
  font-family: var(--font-body); font-size: 14.5px; line-height: 1.55;
  color: var(--color-on-surface-variant); margin: 8px 0 0; max-width: 580px;
}
.wr-map {
  background: linear-gradient(180deg, #fbf5e2 0%, #f1e7c8 100%);
  border: 1px solid rgba(120,90,52,0.35);
  border-radius: 10px; padding: 22px;
  box-shadow: 0 24px 60px -34px rgba(75,50,28,0.65);
  position: relative;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
  overflow: hidden;
}
.wr-map::before {
  content: ""; position: absolute; inset: 8px;
  pointer-events: none;
  border: 1px solid rgba(120,90,52,0.22);
  z-index: 0;
}
.wr-map > * {
  position: relative;
  z-index: 1;
}
.wr-map-canvas {
  position: relative;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  aspect-ratio: 5 / 4;
  background: transparent;
  border-radius: 2px;
  overflow: hidden;
  box-sizing: border-box;
}
.wr-map-canvas svg {
  max-width: 100%;
  overflow: hidden;
}
.wr-map-svg { position: absolute; inset: 0; width: 100%; max-width: 100%; height: 100%; overflow: hidden; }

.wr-map-pin {
  position: absolute; transform: translate(-50%, -100%);
  background: transparent; border: 0; cursor: pointer;
  display: flex; flex-direction: column; align-items: center;
  padding: 0;
}
.wr-map-pin-dot {
  width: 16px; height: 16px; border-radius: 999px;
  background: var(--color-primary);
  box-shadow: 0 0 0 4px rgba(86,19,113,0.18), 0 4px 10px rgba(86,19,113,0.3);
  transition: all var(--dur-med) var(--ease-out);
  position: relative;
}
.wr-map-pin-dot::after {
  content: ""; position: absolute; bottom: -6px; left: 50%;
  transform: translateX(-50%);
  border: 5px solid transparent; border-top-color: var(--color-primary);
}
.wr-map-pin-city .wr-map-pin-dot {
  background: var(--color-secondary);
  box-shadow: 0 0 0 4px rgba(100,93,86,0.18), 0 4px 10px rgba(0,0,0,0.18);
}
.wr-map-pin-city .wr-map-pin-dot::after { border-top-color: var(--color-secondary); }

.wr-map-pin-label {
  position: absolute; top: -42px; left: 50%; transform: translateX(-50%);
  background: #fff; color: var(--color-on-surface);
  padding: 6px 12px; border-radius: 999px;
  box-shadow: var(--shadow-ambient-sm);
  font-family: var(--font-body); font-size: 12px; font-weight: 600;
  display: inline-flex; align-items: baseline; gap: 6px;
  white-space: nowrap;
  opacity: 0; pointer-events: none;
  transition: opacity var(--dur-med) var(--ease-out),
              transform var(--dur-med) var(--ease-out);
}
.wr-map-pin-label b { color: var(--color-primary); font-weight: 600; }
.wr-map-pin-label i {
  color: var(--color-on-surface-variant); font-style: normal;
  font-family: var(--font-display); font-variant-numeric: oldstyle-nums;
}
.wr-map-pin:hover .wr-map-pin-label,
.wr-map-pin.is-on .wr-map-pin-label {
  opacity: 1; transform: translateX(-50%) translateY(-4px);
}
.wr-map-pin:hover .wr-map-pin-dot {
  transform: scale(1.15);
}
.wr-map-pin.is-on .wr-map-pin-dot {
  background: #c89c52;
  box-shadow: 0 0 0 6px rgba(200,156,82,0.22), 0 4px 12px rgba(0,0,0,0.2);
  transform: scale(1.18);
}
.wr-map-pin.is-on .wr-map-pin-dot::after { border-top-color: #c89c52; }

.wr-map-compass {
  position: absolute; top: 14px; right: 14px;
  width: 36px; height: 36px; border-radius: 999px;
  background: rgba(255,255,255,0.85); backdrop-filter: blur(6px);
  display: grid; place-items: center;
  font-family: var(--font-display); font-weight: 700; font-size: 13px;
  color: var(--color-primary);
  box-shadow: var(--shadow-ambient-sm);
}
.wr-map-legend {
  position: absolute; left: 14px; bottom: 14px;
  display: flex; gap: 14px;
  background: rgba(255,255,255,0.9); backdrop-filter: blur(6px);
  padding: 8px 14px; border-radius: 999px;
  box-shadow: var(--shadow-ambient-sm);
  font-family: var(--font-label); font-size: 10px;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--color-on-surface-variant);
}
.wr-map-legend span { display: inline-flex; align-items: center; gap: 6px; }
.wr-map-leg-dot { width: 9px; height: 9px; border-radius: 999px; display: inline-block; }
.wr-map-leg-city { background: var(--color-secondary); }
.wr-map-leg-sub  { background: var(--color-primary); }
.wr-map-foot {
  font-family: var(--font-label); font-size: 10.5px;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: rgba(61,42,38,0.72);
  margin: 14px 0 0; text-align: center;
}

/* SECTION 2d - BEST WINERIES */
.wr-best-band {
  padding: 68px 0 46px;
  overflow: hidden;
}
.wr-best-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 22px;
  margin-bottom: 14px;
}
.wr-best-head-copy {
  max-width: 720px;
}
.wr-best-lede {
  font-family: var(--font-body);
  font-size: 14.5px;
  line-height: 1.55;
  color: var(--color-on-surface-variant);
  margin: 8px 0 0;
  max-width: 580px;
}
.wr-best-controls {
  display: inline-flex;
  gap: 10px;
  align-items: center;
  flex: 0 0 auto;
}
.wr-best-btn {
  width: 42px;
  height: 42px;
  border: 0;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  background: var(--color-surface-container-lowest);
  color: var(--color-primary);
  cursor: pointer;
  box-shadow: var(--shadow-ambient-sm);
  transition: transform var(--dur-fast) var(--ease-out),
              box-shadow var(--dur-fast) var(--ease-out),
              background-color var(--dur-fast) var(--ease-out),
              color var(--dur-fast) var(--ease-out);
}
.wr-best-btn:hover,
.wr-best-btn:focus-visible {
  background: var(--color-primary);
  color: #fff;
  transform: translateY(-1px);
  box-shadow: var(--shadow-ambient);
}
.wr-best-carousel {
  position: relative;
  perspective: 1200px;
  perspective-origin: center 42%;
}
.wr-best-stage {
  position: relative;
  width: 100%;
  height: var(--iw-3d-stage-height, var(--wr-best-stage-height, 560px));
  min-height: 500px;
  overflow: hidden;
  box-sizing: border-box;
  padding: 10px 0 44px;
  isolation: isolate;
  transform-style: preserve-3d;
  transition: height 240ms var(--ease-out);
}
.wr-best-slide {
  position: absolute;
  top: 10px;
  left: 50%;
  width: min(560px, 58%);
  opacity: 0;
  z-index: 0;
  pointer-events: none;
  transform: translateX(-50%) scale(0.72) translateZ(-160px);
  transform-origin: center center;
  transition: transform 520ms cubic-bezier(0.22, 1, 0.36, 1),
              opacity 280ms ease,
              filter 520ms ease;
  will-change: transform, opacity, filter;
}
.wr-best-slide.is-active {
  opacity: 1;
  z-index: 4;
  pointer-events: auto;
  filter: none;
  transform: translateX(-50%) rotateY(0deg) scale(1) translateZ(0);
}
.wr-best-slide.is-prev {
  opacity: 0.58;
  z-index: 2;
  filter: saturate(0.82) brightness(0.92);
  transform: translateX(-95%) rotateY(12deg) scale(0.82) translateZ(-90px);
}
.wr-best-slide.is-next {
  opacity: 0.58;
  z-index: 2;
  filter: saturate(0.82) brightness(0.92);
  transform: translateX(-5%) rotateY(-12deg) scale(0.82) translateZ(-90px);
}
.wr-best-slide.is-far {
  opacity: 0;
  z-index: 1;
  filter: blur(4px) saturate(0.7);
  transform: translateX(-50%) scale(0.7) translateZ(-180px);
}
.wr-best-card {
  display: flex;
  flex-direction: column;
  background: var(--color-surface-container-lowest);
  border-radius: 22px;
  box-shadow: 0 28px 70px -38px rgba(86,19,113,0.62), var(--shadow-ambient-sm);
  text-decoration: none;
  color: inherit;
  transition: transform var(--dur-med) var(--ease-out),
              box-shadow var(--dur-med) var(--ease-out);
  position: relative;
  overflow: hidden;
}
.wr-best-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 30px;
  right: 30px;
  height: 3px;
  background: linear-gradient(to right, #c89c52, #e0b87a, transparent);
  border-radius: 0 0 3px 3px;
  z-index: 2;
}
.wr-best-slide.is-active .wr-best-card:hover,
.wr-best-slide.is-active .wr-best-card:focus-visible {
  transform: translateY(-4px);
}
.wr-best-photo {
  position: relative;
  aspect-ratio: 16 / 10;
  background: var(--color-surface-container-low);
  overflow: hidden;
}
.wr-best-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--dur-slow) var(--ease-out);
}
.wr-best-slide.is-active .wr-best-card:hover .wr-best-photo img,
.wr-best-slide.is-active .wr-best-card:focus-visible .wr-best-photo img {
  transform: scale(1.04);
}
.wr-best-photo .wr-placeholder-initial {
  font-size: clamp(54px, 8vw, 88px);
}
.wr-best-photo .wr-placeholder-grape {
  width: 68%;
  height: 68%;
}
.wr-best-body {
  padding: 22px 28px 24px;
  display: flex;
  flex-direction: column;
  min-height: 270px;
}
.wr-best-rank {
  display: flex;
  align-items: baseline;
  gap: 14px;
  margin-bottom: 8px;
}
.wr-best-rank-n {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 38px;
  color: #c89c52;
  letter-spacing: 0;
  font-variant-numeric: oldstyle-nums;
  line-height: 1;
}
.wr-best-accolade {
  font-family: var(--font-label);
  font-weight: 700;
  font-size: 9.5px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--color-primary);
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(86,19,113,0.07);
}
.wr-best-name {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 24px;
  line-height: 1.1;
  letter-spacing: 0;
  color: var(--color-primary);
  margin: 4px 0 6px;
}
.wr-best-loc {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-label);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-on-surface-variant);
  margin-bottom: 10px;
}
.wr-best-loc-icon {
  color: var(--color-primary);
  opacity: 0.7;
  display: inline-grid;
}
.wr-best-reason {
  font-family: var(--font-display);
  font-style: italic;
  font-size: 16px;
  line-height: 1.5;
  color: var(--color-on-surface);
  margin: 6px 0 14px;
  text-wrap: pretty;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.wr-best-meta {
  display: flex;
  gap: 14px;
  align-items: center;
  padding-top: 14px;
  margin-top: auto;
  position: relative;
  font-family: var(--font-body);
  font-size: 13px;
}
.wr-best-meta::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 1px;
  background: linear-gradient(to right, rgba(86,19,113,0.12), transparent);
}
.wr-best-price {
  font-family: var(--font-label);
  font-size: 10.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-on-surface-variant);
  margin-left: auto;
}
.wr-best-cta {
  margin-top: 14px;
  padding-top: 8px;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 13px;
  color: var(--color-primary);
}
.wr-best-cta span {
  display: inline-block;
  transition: transform var(--dur-med) var(--ease-out);
}
.wr-best-slide.is-active .wr-best-card:hover .wr-best-cta span,
.wr-best-slide.is-active .wr-best-card:focus-visible .wr-best-cta span {
  transform: translateX(4px);
}
.wr-best-dots {
  display: flex;
  justify-content: center;
  gap: 9px;
  margin: 0 0 10px;
}
.wr-best-dot {
  width: 9px;
  height: 9px;
  border: 0;
  border-radius: 999px;
  background: rgba(86,19,113,0.22);
  cursor: pointer;
  padding: 0;
  transition: transform 180ms ease, background-color 180ms ease;
}
.wr-best-dot.is-active {
  background: var(--color-primary);
  transform: scale(1.35);
}
@media (max-width: 767.98px) {
  .wr-best-band {
    padding: 52px 0 0;
  }
  .wr-best-head {
    align-items: flex-start;
    gap: 16px;
  }
  .wr-best-controls {
    padding-top: 4px;
  }
  .wr-best-btn {
    width: 40px;
    height: 40px;
  }
  .wr-best-carousel {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
  }
  .wr-best-stage {
    min-height: 520px;
  }
  .wr-best-stage::before,
  .wr-best-stage::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 42px;
    width: 48px;
    z-index: 3;
    pointer-events: none;
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
  }
  .wr-best-stage::before {
    left: 0;
    background: linear-gradient(to right, rgba(252,249,244,0.24) 0%, rgba(252,249,244,0.14) 44%, rgba(252,249,244,0) 100%);
  }
  .wr-best-stage::after {
    right: 0;
    background: linear-gradient(to left, rgba(252,249,244,0.24) 0%, rgba(252,249,244,0.14) 44%, rgba(252,249,244,0) 100%);
  }
  .wr-best-slide {
    width: min(340px, 86vw);
  }
  .wr-best-slide.is-prev {
    opacity: 0.46;
    transform: translateX(-84%) rotateY(8deg) scale(0.78) translateZ(-90px);
  }
  .wr-best-slide.is-next {
    opacity: 0.46;
    transform: translateX(-16%) rotateY(-8deg) scale(0.78) translateZ(-90px);
  }
  .wr-best-body {
    padding: 20px 22px 22px;
    min-height: 286px;
  }
  .wr-best-rank-n {
    font-size: 34px;
  }
  .wr-best-name {
    font-size: 22px;
  }
  .wr-best-reason {
    -webkit-line-clamp: 3;
  }
}
@media (prefers-reduced-motion: reduce) {
  .wr-best-stage,
  .wr-best-slide,
  .wr-best-card,
  .wr-best-photo img,
  .wr-best-cta span,
  .wr-best-dot,
  .wr-best-btn {
    transition: none;
  }
}

/* CARD STRIP - price/duration/hours */
.wr-card-strip {
  display: grid; gap: 6px 12px;
  grid-template-columns: 1fr 1fr;
  margin-top: 8px; padding: 10px 12px;
  background: var(--color-surface-container-low);
  border-radius: 12px;
}
.wr-card-strip-item {
  display: flex; align-items: center; gap: 8px;
  font-family: var(--font-body); font-size: 11.5px;
  color: var(--color-on-surface-variant);
}
.wr-card-strip-item:only-child { grid-column: 1 / -1; }
.wr-card-strip-item span:not(.wr-card-strip-icon):not(.wr-card-hours-dot) {
  display: flex; flex-direction: column; line-height: 1.2;
}
.wr-card-strip-item b {
  font-family: var(--font-body); font-weight: 700; color: var(--color-on-surface);
  font-size: 12px;
}
.wr-card-strip-item i {
  font-style: normal; color: var(--color-on-surface-variant);
  font-family: var(--font-label); font-size: 9px;
  letter-spacing: 0.12em; text-transform: uppercase;
  margin-top: 2px;
}
.wr-card-strip-icon {
  width: 22px; height: 22px; border-radius: 999px;
  background: rgba(86,19,113,0.08); color: var(--color-primary);
  display: grid; place-items: center; flex: 0 0 auto;
}
.wr-card-strip-asset { width: 18px; height: 18px; object-fit: contain; }
.wr-card-hours { grid-column: span 2; padding-top: 4px; border-top: 1px solid rgba(86,19,113,0.07); margin-top: 2px; }
.wr-card-hours-dot {
  width: 8px; height: 8px; border-radius: 999px; flex: 0 0 auto;
}
.wr-card-hours-dot-verified {
  background: var(--color-success);
  box-shadow: 0 0 0 3px rgba(60,110,71,0.18);
}
.wr-card-hours-dot-check {
  background: var(--color-warning);
  box-shadow: 0 0 0 3px rgba(176,133,18,0.18);
}

.wr-card-rating {
  display: flex; align-items: center; gap: 8px;
  margin-top: 6px;
  font-family: var(--font-body); font-size: 12px;
  color: var(--color-on-surface-variant);
}
.wr-card-rating-star { color: #c89c52; display: inline-grid; }
.wr-card-rating b {
  font-family: var(--font-display); font-variant-numeric: oldstyle-nums;
  color: var(--color-primary); font-size: 14px; font-weight: 700;
}
.wr-card-rating-n { font-size: 11px; }
/* Context body line-2 */
.wr-context-body {
  font-family: var(--font-body); font-size: 14px; line-height: 1.6;
  color: var(--color-on-surface-variant); margin: 0 0 14px;
  text-wrap: pretty;
}

/* SECTION 5b - PRICING STRIP */
.wr-pricing-band {
  padding: 56px 0 32px;
  background: linear-gradient(to bottom, transparent, rgba(86,19,113,0.03));
}
.wr-pricing-head { margin-bottom: 26px; max-width: 720px; }
.wr-pricing-lede {
  font-family: var(--font-body); font-size: 14.5px; line-height: 1.55;
  color: var(--color-on-surface-variant); margin: 8px 0 0; max-width: 600px;
}
.wr-pricing-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px;
}
.wr-pricing-carousel { display: none; }
.wr-price-tier {
  background: var(--color-surface-container-lowest);
  border-radius: 20px; padding: 24px 26px;
  box-shadow: var(--shadow-ambient-sm);
  display: flex; flex-direction: column; gap: 10px;
  transition: all var(--dur-med) var(--ease-out);
  position: relative; overflow: hidden;
}
.wr-price-tier:hover { transform: translateY(-2px); box-shadow: var(--shadow-ambient); }
.wr-price-warm { background: linear-gradient(155deg, #fff 0%, #f9eafd 100%); }
.wr-price-luxe {
  background: linear-gradient(155deg, var(--color-primary) 0%, #702f8a 100%);
  color: #fff;
}
.wr-price-luxe::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(to right, #c89c52, #e0b87a, #c89c52);
}
.wr-price-tier-head {
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
}
.wr-price-tier-asset {
  width: 44px; height: 44px;
  object-fit: contain;
  flex: 0 0 auto;
}
.wr-price-tier-name {
  font-family: var(--font-display); font-weight: 600;
  font-size: 18px; color: var(--color-primary); margin: 0;
  letter-spacing: 0;
}
.wr-price-luxe .wr-price-tier-name { color: #fff; }
.wr-price-tier-dur {
  display: inline-flex; align-items: center; gap: 5px;
  font-family: var(--font-label); font-size: 9.5px;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--color-on-surface-variant);
  padding: 5px 10px 5px 8px; border-radius: 999px;
  background: rgba(86,19,113,0.06);
}
.wr-price-luxe .wr-price-tier-dur {
  background: rgba(255,255,255,0.12); color: rgba(255,255,255,0.85);
}
.wr-price-tier-dur-icon { display: inline-grid; }
.wr-price-tier-dur svg { width: 11px; height: 11px; }
.wr-price-tier-amount {
  display: flex; align-items: baseline; gap: 8px;
  margin: 4px 0 4px;
}
.wr-price-tier-from {
  font-family: var(--font-label); font-size: 10px;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--color-on-surface-variant);
}
.wr-price-luxe .wr-price-tier-from { color: rgba(255,255,255,0.7); }
.wr-price-tier-num {
  font-family: var(--font-display); font-weight: 700;
  font-size: 36px; letter-spacing: 0;
  color: var(--color-primary); font-variant-numeric: oldstyle-nums;
  line-height: 1;
}
.wr-price-luxe .wr-price-tier-num { color: #fff; }
.wr-price-tier-to {
  font-family: var(--font-display); font-variant-numeric: oldstyle-nums;
  font-size: 16px; color: var(--color-on-surface-variant);
}
.wr-price-luxe .wr-price-tier-to { color: rgba(255,255,255,0.78); }
.wr-price-tier-note {
  font-family: var(--font-body); font-size: 13px; line-height: 1.5;
  color: var(--color-on-surface-variant); margin: 0;
  text-wrap: pretty;
}
.wr-price-luxe .wr-price-tier-note { color: rgba(255,255,255,0.85); }

@media (max-width: 767.98px) {
  .wr-pricing-band {
    padding: 48px 0 20px;
    overflow-x: hidden;
  }
  .wr-pricing-head {
    margin-bottom: 12px;
  }
  .wr-pricing-grid {
    display: none !important;
  }
  .wr-pricing-carousel {
    display: block;
    position: relative;
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    perspective: 1200px;
    perspective-origin: center 42%;
  }
  .wr-pricing-dots {
    display: flex;
    justify-content: center;
    gap: 9px;
    margin: 0 0 4px;
  }
  .wr-pricing-dot {
    width: 9px;
    height: 9px;
    border: 0;
    border-radius: 999px;
    background: rgba(86,19,113,0.22);
    cursor: pointer;
    padding: 0;
    transition: transform 180ms ease, background-color 180ms ease;
  }
  .wr-pricing-dot.is-active {
    background: var(--color-primary);
    transform: scale(1.35);
  }
  .wr-pricing-stage {
    position: relative;
    width: 100%;
    height: var(--iw-3d-stage-height, 330px);
    min-height: 320px;
    overflow: hidden;
    box-sizing: border-box;
    padding: 10px 0 44px;
    isolation: isolate;
    transform-style: preserve-3d;
    transition: height 240ms var(--ease-out);
  }
  .wr-pricing-stage::before,
  .wr-pricing-stage::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 38px;
    width: 48px;
    z-index: 3;
    pointer-events: none;
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
  }
  .wr-pricing-stage::before {
    left: 0;
    background: linear-gradient(to right, rgba(252,249,244,0.28) 0%, rgba(252,249,244,0.14) 48%, rgba(252,249,244,0) 100%);
  }
  .wr-pricing-stage::after {
    right: 0;
    background: linear-gradient(to left, rgba(252,249,244,0.28) 0%, rgba(252,249,244,0.14) 48%, rgba(252,249,244,0) 100%);
  }
  .wr-pricing-slide {
    position: absolute;
    top: 10px;
    left: 50%;
    width: min(330px, 86vw);
    opacity: 0;
    z-index: 0;
    pointer-events: none;
    transform: translateX(-50%) scale(0.72) translateZ(-160px);
    transform-origin: center center;
    transition: transform 520ms cubic-bezier(0.22, 1, 0.36, 1), opacity 280ms ease, filter 520ms ease;
    will-change: transform, opacity, filter;
  }
  .wr-pricing-slide.is-active {
    opacity: 1;
    z-index: 4;
    pointer-events: auto;
    filter: none;
    transform: translateX(-50%) rotateY(0deg) scale(1) translateZ(0);
  }
  .wr-pricing-slide.is-prev {
    opacity: 0.48;
    z-index: 2;
    filter: saturate(0.84) brightness(0.92);
    transform: translateX(-84%) rotateY(8deg) scale(0.78) translateZ(-90px);
  }
  .wr-pricing-slide.is-next {
    opacity: 0.48;
    z-index: 2;
    filter: saturate(0.84) brightness(0.92);
    transform: translateX(-16%) rotateY(-8deg) scale(0.78) translateZ(-90px);
  }
  .wr-pricing-slide.is-far {
    opacity: 0;
    z-index: 1;
    filter: blur(4px) saturate(0.7);
    transform: translateX(-50%) scale(0.7) translateZ(-180px);
  }
  .wr-pricing-slide .wr-price-tier {
    min-height: 246px;
    padding: 22px 22px 24px;
    box-shadow: 0 24px 58px -34px rgba(86,19,113,0.58), var(--shadow-ambient-sm);
  }
  .wr-pricing-slide .wr-price-tier-head {
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr);
    justify-content: stretch;
    align-items: start;
  }
  .wr-pricing-slide .wr-price-tier-dur {
    grid-column: 1 / -1;
    justify-self: start;
  }
  .wr-pricing-slide .wr-price-tier-name {
    align-self: center;
  }
}

.wr-pricing-footnote {
  margin-top: 22px;
  display: flex; align-items: flex-start; gap: 12px;
  padding: 14px 18px;
  background: rgba(86,19,113,0.05);
  border-radius: 14px;
  max-width: 800px;
}
.wr-pricing-foot-icon {
  width: 28px; height: 28px; border-radius: 999px;
  background: rgba(86,19,113,0.1); color: var(--color-primary);
  display: grid; place-items: center; flex: 0 0 auto;
}
.wr-pricing-footnote p {
  margin: 0;
  font-family: var(--font-body); font-size: 13px; line-height: 1.55;
  color: var(--color-on-surface-variant);
}
.wr-pricing-footnote b {
  color: var(--color-primary); font-family: var(--font-display);
  font-variant-numeric: oldstyle-nums; font-size: 14px;
}

/* SECTION 5c - REVIEWS SUMMARY */
.wr-reviews-band { padding: 56px 0 32px; }
.wr-reviews {
  background: var(--color-surface-container-lowest);
  border-radius: 24px; padding: 32px 36px;
  box-shadow: var(--shadow-ambient-sm);
  display: grid; gap: 22px;
}
.wr-reviews-head { max-width: 760px; }
.wr-reviews-policy {
  font-family: var(--font-body); font-size: 13px; line-height: 1.5;
  color: var(--color-on-surface-variant); margin: 8px 0 0;
  max-width: 600px;
}
.wr-reviews-policy b { color: var(--color-primary); font-weight: 700; }

.wr-reviews-body {
  display: grid; grid-template-columns: 1fr 1.1fr 1.1fr; gap: 32px;
  padding-top: 14px;
  position: relative;
}
.wr-reviews-body::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0;
  height: 1px;
  background: linear-gradient(to right, rgba(86,19,113,0.15), transparent);
}

.wr-reviews-score {
  display: flex; flex-direction: column; gap: 4px;
}
.wr-reviews-stars { display: inline-flex; gap: 2px; margin-bottom: 4px; }
.wr-reviews-star { color: rgba(86,19,113,0.18); }
.wr-reviews-star.is-on { color: #c89c52; }
.wr-reviews-star svg { width: 22px; height: 22px; }
.wr-reviews-avg {
  font-family: var(--font-display); font-weight: 700;
  font-size: 56px; line-height: 1; letter-spacing: 0;
  color: var(--color-primary); font-variant-numeric: oldstyle-nums;
  display: inline-block;
}
.wr-reviews-of {
  font-family: var(--font-display); font-size: 22px;
  color: var(--color-on-surface-variant);
  margin-left: 4px;
}
.wr-reviews-count {
  font-family: var(--font-label); font-size: 10.5px;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--color-on-surface-variant);
  margin-top: 8px;
}

.wr-reviews-bars { list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 6px; }
.wr-reviews-bar {
  display: grid; grid-template-columns: 28px 1fr 36px;
  gap: 10px; align-items: center;
  font-family: var(--font-body); font-size: 12px;
  color: var(--color-on-surface-variant);
}
.wr-reviews-bar-lbl { font-weight: 600; color: var(--color-on-surface); }
.wr-reviews-bar-track {
  height: 8px; border-radius: 999px;
  background: rgba(86,19,113,0.08);
  overflow: hidden;
}
.wr-reviews-bar-fill {
  display: block; height: 100%;
  background: linear-gradient(to right, var(--color-primary), #c89c52);
  border-radius: 999px;
}
.wr-reviews-bar-pct {
  font-family: var(--font-display); font-variant-numeric: oldstyle-nums;
  text-align: right; color: var(--color-primary); font-weight: 600;
}

.wr-reviews-themes-lbl {
  font-family: var(--font-label); font-weight: 700;
  font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--color-primary); display: block; margin-bottom: 10px;
}
.wr-reviews-themes ul {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 8px;
}
.wr-reviews-themes li {
  display: flex; justify-content: space-between; align-items: baseline;
  gap: 12px;
  padding: 8px 14px;
  background: rgba(86,19,113,0.05);
  border-radius: 10px;
}
.wr-reviews-themes b {
  font-family: var(--font-body); font-weight: 600; font-size: 13px;
  color: var(--color-on-surface);
}
.wr-reviews-themes span {
  font-family: var(--font-label); font-size: 10px;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--color-on-surface-variant);
}

/* SECTION 5d - OPENING DETAILS */
.wr-opening-band { padding: 48px 0 24px; }
.wr-opening {
  display: grid; grid-template-columns: 1fr 1.4fr; gap: 36px;
  align-items: start;
}
.wr-opening-head { max-width: 420px; }
.wr-opening-lede {
  font-family: var(--font-body); font-size: 14.5px; line-height: 1.6;
  color: var(--color-on-surface-variant); margin: 12px 0 0;
  text-wrap: pretty;
}
.wr-opening-lede em {
  font-family: var(--font-display); font-style: italic;
  color: var(--color-primary); font-weight: 500;
}

.wr-opening-list {
  list-style: none; margin: 0; padding: 0;
  display: grid; gap: 14px;
}
.wr-opening-line {
  display: grid; grid-template-columns: 40px 1fr; gap: 16px;
  background: var(--color-surface-container-lowest);
  padding: 16px 20px; border-radius: 14px;
  box-shadow: var(--shadow-ambient-sm);
}
.wr-opening-icon {
  width: 36px; height: 36px; border-radius: 10px;
  background: rgba(86,19,113,0.08); color: var(--color-primary);
  display: grid; place-items: center; flex: 0 0 auto;
}
.wr-opening-icon--asset {
  width: 42px; height: 42px;
}
.wr-opening-asset {
  width: 36px; height: 36px;
  object-fit: contain;
}
.wr-opening-line b {
  display: block;
  font-family: var(--font-display); font-weight: 600; font-size: 15px;
  color: var(--color-primary); margin-bottom: 2px;
}
.wr-opening-line p {
  margin: 0;
  font-family: var(--font-body); font-size: 13.5px; line-height: 1.55;
  color: var(--color-on-surface-variant);
  text-wrap: pretty;
}
.wr-opening-line p b {
  display: inline; font-size: 13.5px; color: var(--color-primary);
  font-family: var(--font-display); font-variant-numeric: oldstyle-nums;
  margin: 0;
}

/* SECTION 5e - SEASONAL ADVICE */
.wr-season-band { padding: 48px 0 32px; }
.wr-season-head { margin-bottom: 24px; max-width: 720px; }
.wr-season-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px;
}
.wr-season-card {
  background: var(--color-surface-container-lowest);
  border-radius: 18px; padding: 22px 22px 24px;
  box-shadow: var(--shadow-ambient-sm);
  display: flex; flex-direction: column; gap: 10px;
  position: relative; overflow: hidden;
  transition: all var(--dur-med) var(--ease-out);
}
.wr-season-card:hover {
  transform: translateY(-2px); box-shadow: var(--shadow-ambient);
}
.wr-season-card::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px;
}
.wr-season-spring::before { background: linear-gradient(to right, #a8c98a, #d4e4a8); }
.wr-season-summer::before { background: linear-gradient(to right, #e8b859, #f0d488); }
.wr-season-harvest::before { background: linear-gradient(to right, #c47a3a, #d99a5a); }
.wr-season-winter::before { background: linear-gradient(to right, #8aa8c4, #c2d0db); }

.wr-season-glyph {
  width: 48px; height: 48px; border-radius: 12px;
  display: grid; place-items: center;
  background: rgba(86,19,113,0.06);
  color: var(--color-primary);
  margin-bottom: 4px;
}
.wr-season-glyph--asset {
  width: 56px; height: 56px;
}
.wr-season-asset {
  width: 48px; height: 48px;
  object-fit: contain;
}
.wr-season-spring .wr-season-glyph { background: rgba(168,201,138,0.18); color: #5a7c40; }
.wr-season-summer .wr-season-glyph { background: rgba(232,184,89,0.2); color: #8b6314; }
.wr-season-harvest .wr-season-glyph { background: rgba(196,122,58,0.2); color: #8c3c28; }
.wr-season-winter .wr-season-glyph { background: rgba(138,168,196,0.2); color: #3a5f9e; }

.wr-season-meta {
  display: flex; align-items: baseline; gap: 8px;
}
.wr-season-name {
  font-family: var(--font-display); font-weight: 700;
  font-size: 18px; color: var(--color-primary); letter-spacing: 0;
}
.wr-season-months {
  font-family: var(--font-label); font-size: 10px;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--color-on-surface-variant);
}
.wr-season-headline {
  font-family: var(--font-display); font-weight: 600;
  font-size: 15px; line-height: 1.3; color: var(--color-on-surface);
  margin: 4px 0 4px;
  text-wrap: pretty;
}
.wr-season-note {
  font-family: var(--font-body); font-size: 13px; line-height: 1.5;
  color: var(--color-on-surface-variant); margin: 0;
  text-wrap: pretty;
}
.wr-season-carousel {
  display: none;
}

@media (min-width: 768px) {
  .wr-season-card.is-current {
    background: linear-gradient(145deg, #fffaf0 0%, #f8ead1 58%, #fffdf8 100%);
    box-shadow: inset 0 0 0 1px rgba(200,156,82,0.28), 0 20px 42px -32px rgba(86,19,113,0.42), var(--shadow-ambient-sm);
  }
  .wr-season-card.is-current::before {
    height: 4px;
    background: linear-gradient(to right, #c89c52, #e4bd7a, rgba(200,156,82,0));
  }
  .wr-season-card.is-current .wr-season-glyph {
    background: rgba(255,255,255,0.72);
    box-shadow: inset 0 0 0 1px rgba(200,156,82,0.2);
  }
}

@media (max-width: 767.98px) {
  .wr-season-band {
    padding: 44px 0 18px;
    overflow-x: hidden;
  }
  .wr-season-head {
    margin-bottom: 12px;
  }
  .wr-season-grid {
    display: none !important;
  }
  .wr-season-carousel {
    display: block;
    position: relative;
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    perspective: 1200px;
    perspective-origin: center 42%;
  }
  .wr-season-dots {
    display: flex;
    justify-content: center;
    gap: 9px;
    margin: 0 0 4px;
  }
  .wr-season-dot {
    width: 9px;
    height: 9px;
    border: 0;
    border-radius: 999px;
    background: rgba(86,19,113,0.22);
    cursor: pointer;
    padding: 0;
    transition: transform 180ms ease, background-color 180ms ease;
  }
  .wr-season-dot.is-active {
    background: var(--color-primary);
    transform: scale(1.35);
  }
  .wr-season-stage {
    position: relative;
    width: 100%;
    height: var(--iw-3d-stage-height, 320px);
    min-height: 306px;
    overflow: hidden;
    box-sizing: border-box;
    padding: 10px 0 38px;
    isolation: isolate;
    touch-action: pan-y;
    transform-style: preserve-3d;
    transition: height 240ms var(--ease-out);
  }
  .wr-season-stage::before,
  .wr-season-stage::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 36px;
    width: 48px;
    z-index: 3;
    pointer-events: none;
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
  }
  .wr-season-stage::before {
    left: 0;
    background: linear-gradient(to right, rgba(252,249,244,0.28) 0%, rgba(252,249,244,0.14) 48%, rgba(252,249,244,0) 100%);
  }
  .wr-season-stage::after {
    right: 0;
    background: linear-gradient(to left, rgba(252,249,244,0.28) 0%, rgba(252,249,244,0.14) 48%, rgba(252,249,244,0) 100%);
  }
  .wr-season-slide {
    position: absolute;
    top: 10px;
    left: 50%;
    width: min(318px, 84vw);
    opacity: 0;
    z-index: 0;
    pointer-events: none;
    transform: translateX(-50%) scale(0.72) translateZ(-160px);
    transform-origin: center center;
    transition: transform 520ms cubic-bezier(0.22, 1, 0.36, 1), opacity 280ms ease, filter 520ms ease;
    will-change: transform, opacity, filter;
  }
  .wr-season-slide.is-active {
    opacity: 1;
    z-index: 4;
    pointer-events: auto;
    filter: none;
    transform: translateX(-50%) rotateY(0deg) scale(1) translateZ(0);
  }
  .wr-season-slide.is-prev {
    opacity: 0.46;
    z-index: 2;
    filter: saturate(0.84) brightness(0.94);
    transform: translateX(-84%) rotateY(8deg) scale(0.78) translateZ(-90px);
  }
  .wr-season-slide.is-next {
    opacity: 0.46;
    z-index: 2;
    filter: saturate(0.84) brightness(0.94);
    transform: translateX(-16%) rotateY(-8deg) scale(0.78) translateZ(-90px);
  }
  .wr-season-slide.is-far {
    opacity: 0;
    z-index: 1;
    filter: blur(4px) saturate(0.7);
    transform: translateX(-50%) scale(0.7) translateZ(-180px);
  }
  .wr-season-slide .wr-season-card {
    min-height: 240px;
    box-shadow: 0 24px 58px -34px rgba(86,19,113,0.58), var(--shadow-ambient-sm);
  }
}

@media (prefers-reduced-motion: reduce) {
  .wr-season-stage,
  .wr-season-slide,
  .wr-season-card,
  .wr-season-dot {
    transition: none;
  }
}


/* RESPONSIVE - new sections */
@media (max-width: 960px) {
  .wr-pricing-grid { grid-template-columns: 1fr 1fr !important; }
  .wr-season-grid { grid-template-columns: 1fr 1fr !important; }
  .wr-opening { grid-template-columns: 1fr; }
  .wr-reviews-body { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .wr-pricing-grid,
  .wr-season-grid { grid-template-columns: 1fr !important; }
  .wr-card-strip { grid-template-columns: 1fr; }
  .wr-card-hours { grid-column: span 1; }
  .wr-reviews { padding: 24px 22px; }
  .wr-reviews-avg { font-size: 44px; }
  .wr-map-canvas { aspect-ratio: 4 / 5; }
}


/* FILTER GROUPS: CATEGORISED FILTER AXES */
.wr-filter-backdrop { display: none; }
.wr-filter-sheet {
  background: var(--color-surface-container-lowest);
  border-radius: 24px;
  box-shadow: var(--shadow-ambient-sm);
  padding: 18px;
  position: sticky;
  top: 92px;
  max-height: calc(100vh - 112px);
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(86,19,113,0.28) transparent;
}
.wr-filter-sheet::-webkit-scrollbar { width: 5px; }
.wr-filter-sheet::-webkit-scrollbar-track { background: transparent; }
.wr-filter-sheet::-webkit-scrollbar-thumb {
  background: rgba(86,19,113,0.28);
  border-radius: 999px;
}
.wr-filter-sheet-head {
  display: flex; justify-content: space-between; align-items: start;
  gap: 12px; margin-bottom: 14px;
}
.wr-filter-sheet-head h3 {
  font-family: var(--font-display); font-weight: 700;
  font-size: 24px; line-height: 1.05; color: var(--color-primary);
  margin: 0 0 4px;
}
.wr-filter-sheet-head p {
  font-family: var(--font-label); font-size: 10px; font-weight: 700;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--color-on-surface-variant);
  margin: 0;
}
.wr-filter-close {
  display: none; width: 40px; height: 40px; border: 0;
  border-radius: 999px; background: var(--color-surface-container-low);
  color: var(--color-primary); place-items: center;
}
.wr-filter-sheet-actions {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; padding-top: 16px; margin: 0 0 10px;
  border-top: 1px solid rgba(86,19,113,0.1);
}
.wr-filter-sheet-actions.is-mobile-only {
  display: none;
}
.wr-filter-clear-link,
.wr-filter-done {
  font-family: var(--font-label); font-weight: 700; font-size: 11px;
  letter-spacing: 0.12em; text-transform: uppercase;
}
.wr-filter-clear-link {
  color: var(--color-primary); text-decoration: none;
}
.wr-filter-done {
  display: none; border: 0; border-radius: var(--radius-pill);
  background: var(--color-primary); color: #fff;
  min-height: 40px; padding: 0 18px;
}
.wr-sub-lede {
  font-family: var(--font-body); font-size: 14.5px; line-height: 1.55;
  color: var(--color-on-surface-variant); margin: 8px 0 0; max-width: 580px;
  text-wrap: pretty;
}
.wr-fg {
  display: flex; flex-direction: column; gap: 12px;
}
.wr-fg-group {
  display: grid; grid-template-columns: 1fr;
  gap: 10px; align-items: start;
  padding: 0 0 16px;
  position: relative;
}
.wr-fg-group + .wr-fg-group::before {
  content: ""; position: absolute; left: 0; right: 0; top: -6px;
  height: 1px;
  background: linear-gradient(to right, rgba(86,19,113,0.12), transparent 80%);
}
.wr-fg-head {
  display: grid; grid-template-columns: 1fr auto; gap: 4px 8px;
  align-items: baseline;
}
.wr-fg-label {
  font-family: var(--font-display); font-weight: 700;
  font-size: 16px; color: var(--color-primary);
  letter-spacing: 0;
}
.wr-fg-hint {
  font-family: var(--font-label); font-size: 10px;
  letter-spacing: 0.13em; text-transform: uppercase;
  color: var(--color-on-surface-variant);
  grid-column: 1 / -1;
}
.wr-fg-multi {
  display: inline-flex; width: max-content;
  font-family: var(--font-label); font-weight: 700;
  font-size: 9px; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--color-primary);
  padding: 4px 9px; border-radius: 999px;
  background: rgba(86,19,113,0.08);
  margin-top: 4px;
}

.wr-fg-chips {
  display: flex; flex-wrap: wrap; gap: 8px;
}
.wr-fg-chip {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--color-surface-container-low);
  border: 0; cursor: pointer;
  padding: 8px 12px 8px 14px;
  border-radius: 999px;
  font-family: inherit;
  transition: all var(--dur-med) var(--ease-out);
}
.wr-fg-chip:hover {
  background: rgba(86,19,113,0.07);
}
.wr-fg-chip.is-disabled,
.wr-fg-chip[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: 0.42;
  filter: grayscale(0.35);
  pointer-events: none;
}
.wr-fg-chip.is-disabled:hover,
.wr-fg-chip[aria-disabled="true"]:hover {
  background: var(--color-surface-container-low);
  box-shadow: none;
  transform: none;
}
.wr-fg-chip-name {
  font-family: var(--font-body); font-weight: 600; font-size: 13px;
  color: var(--color-on-surface);
}
.wr-fg-chip-n {
  font-family: var(--font-display); font-variant-numeric: oldstyle-nums;
  font-size: 12px; font-weight: 500;
  color: var(--color-on-surface-variant);
  padding: 1px 8px; border-radius: 999px;
  background: var(--color-surface-container-lowest);
  min-width: 22px; text-align: center;
}
.wr-fg-chip-all {
  background: transparent;
}
.wr-fg-chip-all .wr-fg-chip-name {
  color: var(--color-primary);
  font-style: italic; font-family: var(--font-display);
}
.wr-fg-chip-all .wr-fg-chip-n {
  background: rgba(86,19,113,0.08);
}
.wr-fg-chip.is-on {
  background: var(--color-primary);
  box-shadow: 0 4px 14px rgba(86,19,113,0.25);
}
.wr-fg-chip.is-on .wr-fg-chip-name { color: #fff; font-style: normal; font-family: var(--font-body); }
.wr-fg-chip.is-on .wr-fg-chip-n {
  background: rgba(255,255,255,0.18);
  color: #fff;
}
.wr-filter-meta--results {
  justify-content: space-between;
  padding: 0;
}

@media (max-width: 800px) {
  .wr-fg-group { grid-template-columns: 1fr; gap: 14px; padding: 20px 22px; }
  .wr-fg-group + .wr-fg-group::before { left: 22px; right: 22px; }
}

@media (max-width: 1040px) {
  .wr-planner-grid {
    grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
  }
}

@media (max-width: 767.98px) {
  body.wr-filter-lock {
    position: fixed;
    left: 0;
    right: 0;
    width: 100%;
    overflow: hidden;
  }
  .wr-planner-band { padding: 26px 0 12px; }
  .wr-planner-head {
    align-items: start;
    gap: 14px;
  }
  .wr-planner-grid,
  .wr-planner-grid.no-map {
    display: block;
  }
  .wr-main .wines-filter-fab[aria-controls="wr-filter-sheet"] {
    display: flex;
    position: fixed;
    right: 1rem;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 5rem);
    z-index: 45;
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
    transform: translate3d(0, 9rem, 0) scale(0.94);
    transform-origin: center;
    will-change: transform, opacity;
    transition:
      opacity 320ms var(--ease-out),
      transform 420ms cubic-bezier(0.2, 0.9, 0.2, 1),
      visibility 0ms linear 420ms,
      background-color 180ms var(--ease-out),
      color 180ms var(--ease-out);
    box-shadow:
      0 18px 40px rgba(27, 28, 26, 0.24),
      0 7px 18px rgba(86, 19, 113, 0.22),
      inset 0 0 0 1px rgba(255, 255, 255, 0.72);
  }
  .wr-main .wines-filter-fab[aria-controls="wr-filter-sheet"].is-visible {
    opacity: 1;
    pointer-events: auto;
    visibility: visible;
    transform: translate3d(0, 0, 0) scale(1);
    transition-delay: 0ms;
  }
  .wr-map {
    border-radius: 18px;
    padding: 16px;
  }
  @media (prefers-reduced-motion: reduce) {
    .wr-main .wines-filter-fab[aria-controls="wr-filter-sheet"] {
      transition: none;
    }
  }
  .wr-map-head {
    grid-template-areas:
      "eyebrow icon"
      "title icon"
      "lede lede";
    margin-bottom: 14px;
  }
  .wr-map-head .wr-section-icon {
    width: 58px;
    height: 58px;
    border-radius: 16px;
  }
  .wr-map-head .wr-section-asset {
    width: 50px;
    height: 50px;
  }
  .wr-map-canvas {
    min-height: 360px;
    aspect-ratio: 4 / 5;
  }
  .wr-filter-backdrop.is-open {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 70;
    background: rgba(28,28,25,0.48);
    backdrop-filter: blur(4px);
  }
  .wr-filter-sheet {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    top: auto;
    z-index: 80;
    max-height: 86vh;
    overflow-y: auto;
    border-radius: 24px 24px 0 0;
    padding: 20px;
    box-shadow: 0 -20px 48px rgba(28,28,25,0.18);
    transform: translateY(105%);
    transition: transform 260ms var(--ease-out);
    visibility: hidden;
  }
  .wr-filter-sheet.is-open {
    transform: translateY(0);
    visibility: visible;
  }
  .wr-filter-close {
    display: grid;
  }
  .wr-filter-sheet-actions {
    display: flex;
    position: sticky;
    bottom: -20px;
    background: linear-gradient(to top, var(--color-surface-container-lowest) 78%, rgba(255,255,255,0));
    padding: 18px 0 0;
  }
  .wr-filter-sheet-actions.is-mobile-only {
    display: flex;
  }
  .wr-filter-done {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .wr-fg-group {
    padding: 0 0 18px;
  }
  .wr-fg-group + .wr-fg-group::before {
    left: 0;
    right: 0;
  }
}

/* Live GeoJSON map used by production. The design-system schematic pins use
   .wr-map-pin; live SVG pins use separate classes to avoid collisions. */
.wr-map-canvas-live {
  min-height: 440px;
}
.wr-map-canvas-live .wr-map-svg {
  display: block;
}
.wr-map-canvas-live .wd-atlas-italy-base path,
.wr-map-canvas-live .wd-atlas-neighbors path,
.wr-map-canvas-live .wd-atlas-zones-ghost path,
.wr-map-canvas-live .wd-atlas-provinces path,
.wr-map-canvas-live .wd-atlas-land,
.wr-map-canvas-live .wd-atlas-coast-halo {
  vector-effect: non-scaling-stroke;
}
.wr-map-canvas-live .wr-map-zone {
  fill: none;
  stroke: rgba(95,55,30,0.32);
  stroke-width: 0.55;
  vector-effect: non-scaling-stroke;
}
.wr-map-canvas-live .wd-atlas-scale-tick {
  font-family: var(--font-label, var(--font-display));
  font-size: 8.5px;
  font-weight: 700;
  letter-spacing: 0.22em;
  fill: rgba(61,42,38,0.78);
}
.wr-map-canvas-live .wd-atlas-region-label {
  font-family: var(--font-display);
  font-size: 11px;
  letter-spacing: 0.42em;
  font-weight: 600;
  fill: #3d2a26;
}
.wr-map-canvas-live .wd-atlas-region-rule {
  stroke: rgba(120,90,52,0.54);
  stroke-width: 0.6;
}
.wr-map-canvas-live .wd-atlas-compass-n {
  font-family: var(--font-display);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.18em;
  fill: #3d2a26;
}
.wr-map-canvas-live .wd-atlas-pin {
  cursor: pointer;
}
.wr-map-canvas-live .wd-atlas-pin-pulse {
  fill: rgba(94,36,60,0.10);
  animation: wdAtlasPulse 2.6s ease-out infinite;
  transform-box: fill-box;
  transform-origin: center;
}
.wr-live-map-pin-halo {
  fill: rgba(255,250,232,0.92);
  stroke: rgba(94,36,60,0.40);
  stroke-width: 0.8;
}
.wr-live-map-pin-stem {
  stroke: #3d2a26;
  stroke-width: 1.1;
  stroke-linecap: round;
}
.wr-live-map-pin {
  fill: #5e243c;
  stroke: #fcf9f4;
  stroke-width: 1.2;
  transition: fill 180ms ease, r 180ms ease;
}
.wr-live-map-pin-dot {
  fill: #fcf9f4;
}
.wr-live-map-pin-foot {
  fill: #3d2a26;
}
.wr-map-pin-link:hover .wr-live-map-pin,
.wr-map-pin-link:focus-visible .wr-live-map-pin,
.wr-map-pin-link.is-active .wr-live-map-pin,
.wr-map-pin-link.is-hot .wr-live-map-pin {
  fill: #3a162a;
  r: 6.4;
}
.wr-map-pin-link:hover .wr-live-map-pin-halo,
.wr-map-pin-link:focus-visible .wr-live-map-pin-halo,
.wr-map-pin-link.is-active .wr-live-map-pin-halo,
.wr-map-pin-link.is-hot .wr-live-map-pin-halo {
  stroke: #5e243c;
  stroke-width: 1.2;
}
.wr-map-empty-label {
  font-family: var(--font-label, var(--font-body));
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  fill: rgba(61,42,38,0.58);
}
@keyframes wdAtlasPulse {
  0% { transform: scale(0.6); opacity: 0; }
  35% { opacity: 1; }
  100% { transform: scale(1.6); opacity: 0; }
}
.wr-map-tooltip {
  position: absolute;
  z-index: 4;
  min-width: 160px;
  max-width: 220px;
  padding: 10px 12px;
  border-radius: 4px;
  background: #fbf3df;
  box-shadow:
    0 0 0 1px rgba(94,36,60,0.32),
    0 14px 30px rgba(75,50,28,0.28);
  opacity: 0;
  transform: translateY(4px);
  pointer-events: none;
  transition: opacity 160ms ease, transform 160ms ease;
}
.wr-map-tooltip.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.wr-map-tooltip strong,
.wr-map-tooltip span {
  display: block;
}
.wr-map-tooltip strong {
  font-family: var(--font-display);
  color: #5e243c;
  font-style: italic;
  font-size: 14px;
}
.wr-map-tooltip span {
  margin-top: 2px;
  font-family: var(--font-label, var(--font-body));
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: rgba(61,42,38,0.68);
  font-size: 10px;
}
.wr-map-tooltip-link {
  display: none;
}
@media (max-width: 767.98px) {
  .wr-map-tooltip.is-visible {
    pointer-events: auto;
  }
  .wr-map-tooltip-link {
    display: inline-flex;
    margin-top: 8px;
    font-family: var(--font-label, var(--font-body));
    font-size: 11px;
    font-weight: 800;
    line-height: 1;
    color: #5e243c;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
  }
}
@media (max-width: 640px) {
  .wr-map-canvas-live {
    width: 100%;
    min-height: 0;
    aspect-ratio: 4 / 5 !important;
  }
}


/* Mobile winery result grid density */
.wr-density-toolbar {
  display: none;
}

@media (max-width: 767.98px) {
  .wr-filter-band .wr-container {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
  }
  .wr-filter-meta--results {
    min-width: 0;
    margin-top: 0;
    flex-wrap: wrap;
    gap: 8px 12px;
  }
  .wr-density-toolbar {
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }
  .wr-density-toolbar .iw-density-toggle {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px;
    border: 1px solid rgba(86,19,113,0.12);
    border-radius: 999px;
    background: var(--color-surface-container-lowest);
    box-shadow: 0 12px 24px -20px rgba(86,19,113,0.45);
  }
  .wr-density-toolbar .iw-density-button {
    width: 36px;
    height: 32px;
    display: inline-grid;
    place-items: center;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--color-on-surface-variant);
    cursor: pointer;
    transition: background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
  }
  .wr-density-toolbar .iw-density-button[aria-pressed="true"] {
    background: var(--color-primary);
    color: #fff;
    box-shadow: 0 8px 18px -12px rgba(86,19,113,0.7);
  }
  .wr-density-toolbar .iw-density-button:focus-visible {
    outline: 2px solid rgba(199,53,53,0.38);
    outline-offset: 2px;
  }
  .wr-density-toolbar .iw-density-icon {
    display: grid;
    gap: 0.18rem;
    align-items: center;
    justify-content: center;
  }
  .wr-density-toolbar .iw-density-icon--1 {
    grid-template-columns: repeat(1, 0.32rem);
  }
  .wr-density-toolbar .iw-density-icon--2 {
    grid-template-columns: repeat(2, 0.32rem);
  }
  .wr-density-toolbar .iw-density-icon span {
    width: 0.32rem;
    height: 0.32rem;
    border: 1.35px solid currentColor;
    border-radius: 1px;
    background: transparent;
  }
  .wr-grid[data-grid-density-target] {
    grid-template-columns: repeat(var(--wr-mobile-grid-density, 2), minmax(0, 1fr)) !important;
    gap: var(--wr-mobile-grid-gap, 12px) !important;
    align-items: stretch;
  }
  .wr-grid[data-grid-density="1"] {
    --wr-mobile-grid-density: 1;
    --wr-mobile-grid-gap: 18px;
  }
  .wr-grid[data-grid-density="2"],
  .wr-grid[data-grid-density="3"] {
    --wr-mobile-grid-density: 2;
    --wr-mobile-grid-gap: 12px;
  }
  .wr-grid[data-grid-density-target] .wr-card,
  .wr-grid[data-grid-density-target] .wr-card--curator {
    min-width: 0;
    grid-column: span 1 !important;
  }
  .wr-grid[data-grid-density="2"] .wr-card,
  .wr-grid[data-grid-density="3"] .wr-card {
    border-radius: 14px;
    box-shadow: 0 16px 30px -24px rgba(86,19,113,0.45);
  }
  .wr-grid[data-grid-density="2"] .wr-card--curator,
  .wr-grid[data-grid-density="3"] .wr-card--curator {
    display: flex;
    flex-direction: column;
  }
  .wr-grid[data-grid-density="2"] .wr-card-photo,
  .wr-grid[data-grid-density="2"] .wr-curator-photo,
  .wr-grid[data-grid-density="3"] .wr-card-photo,
  .wr-grid[data-grid-density="3"] .wr-curator-photo {
    min-height: 0;
    aspect-ratio: 4 / 3;
  }
  .wr-grid[data-grid-density="2"] .wr-curator-photo img,
  .wr-grid[data-grid-density="3"] .wr-curator-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .wr-grid[data-grid-density="2"] .wr-card-body,
  .wr-grid[data-grid-density="2"] .wr-curator-body,
  .wr-grid[data-grid-density="3"] .wr-card-body,
  .wr-grid[data-grid-density="3"] .wr-curator-body {
    padding: 11px 10px 12px;
    gap: 6px;
  }
  .wr-grid[data-grid-density="2"] .wr-card-loc,
  .wr-grid[data-grid-density="3"] .wr-card-loc {
    max-width: 100%;
    gap: 4px;
    font-size: 8.5px;
    letter-spacing: 0.08em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .wr-grid[data-grid-density="2"] .wr-card-loc-asset,
  .wr-grid[data-grid-density="3"] .wr-card-loc-asset {
    width: 13px;
    height: 13px;
  }
  .wr-grid[data-grid-density="2"] .wr-card-name,
  .wr-grid[data-grid-density="2"] .wr-curator-name,
  .wr-grid[data-grid-density="3"] .wr-card-name,
  .wr-grid[data-grid-density="3"] .wr-curator-name {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin: 0;
    font-size: 14px !important;
    line-height: 1.15;
  }
  .wr-grid[data-grid-density="2"] .wr-card-blurb,
  .wr-grid[data-grid-density="2"] .wr-card-strip,
  .wr-grid[data-grid-density="2"] .wr-badges,
  .wr-grid[data-grid-density="2"] .wr-card-cta,
  .wr-grid[data-grid-density="2"] .wr-curator-ribbon,
  .wr-grid[data-grid-density="2"] .wr-curator-quote,
  .wr-grid[data-grid-density="2"] .wr-curator-stats,
  .wr-grid[data-grid-density="3"] .wr-card-blurb,
  .wr-grid[data-grid-density="3"] .wr-card-strip,
  .wr-grid[data-grid-density="3"] .wr-badges,
  .wr-grid[data-grid-density="3"] .wr-card-cta,
  .wr-grid[data-grid-density="3"] .wr-curator-ribbon,
  .wr-grid[data-grid-density="3"] .wr-curator-quote,
  .wr-grid[data-grid-density="3"] .wr-curator-stats {
    display: none;
  }
  .wr-grid[data-grid-density="2"] .wr-card-meta,
  .wr-grid[data-grid-density="3"] .wr-card-meta {
    display: block;
    margin-top: 0;
    font-size: 9px;
    letter-spacing: 0.08em;
    line-height: 1.25;
  }
  .wr-grid[data-grid-density="2"] .wr-card-meta span:not(.wr-card-count),
  .wr-grid[data-grid-density="3"] .wr-card-meta span:not(.wr-card-count) {
    display: none;
  }
  .wr-grid[data-grid-density="2"] .wr-card-count,
  .wr-grid[data-grid-density="3"] .wr-card-count {
    display: block;
  }
  .wr-grid[data-grid-density="2"] .wr-card-count b,
  .wr-grid[data-grid-density="3"] .wr-card-count b {
    font-size: 13px;
  }
  .wr-grid[data-grid-density="2"] .wr-card-flag,
  .wr-grid[data-grid-density="3"] .wr-card-flag {
    top: 8px;
    left: 8px;
    max-width: calc(100% - 16px);
    padding: 4px 7px;
    font-size: 7.5px;
    letter-spacing: 0.1em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .wr-grid[data-grid-density="2"] .wr-placeholder-initial,
  .wr-grid[data-grid-density="3"] .wr-placeholder-initial {
    font-size: 44px;
  }
  .wr-grid[data-grid-density="2"] .wr-placeholder-tag,
  .wr-grid[data-grid-density="3"] .wr-placeholder-tag {
    display: none;
  }
  .wr-grid[data-grid-density="1"] .wr-card--curator {
    grid-template-columns: 1fr;
  }
  .wr-grid[data-grid-density="1"] .wr-curator-photo {
    min-height: 220px;
    aspect-ratio: 16 / 10;
  }
  .wr-grid[data-grid-density="1"] .wr-curator-body {
    padding: 22px;
  }
  .wr-grid[data-grid-density="1"] .wr-curator-ribbon {
    top: 14px;
    left: 14px;
  }
}

@media (max-width: 374px) {
  .wr-grid[data-grid-density="2"],
  .wr-grid[data-grid-density="3"] {
    --wr-mobile-grid-gap: 10px;
  }
  .wr-grid[data-grid-density="2"] .wr-card-name,
  .wr-grid[data-grid-density="2"] .wr-curator-name,
  .wr-grid[data-grid-density="3"] .wr-card-name,
  .wr-grid[data-grid-density="3"] .wr-curator-name {
    font-size: 13px !important;
  }
  .wr-grid[data-grid-density="2"] .wr-card-body,
  .wr-grid[data-grid-density="2"] .wr-curator-body,
  .wr-grid[data-grid-density="3"] .wr-card-body,
  .wr-grid[data-grid-density="3"] .wr-curator-body {
    padding-left: 9px;
    padding-right: 9px;
  }
}