@font-face {
  font-family: "Cormorant Garamond";
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("/assets/fonts/cormorant-garamond-latin.woff2") format("woff2");
}

@font-face {
  font-family: "Cormorant Garamond";
  font-style: italic;
  font-weight: 300 700;
  font-display: swap;
  src: url("/assets/fonts/cormorant-garamond-italic-latin.woff2") format("woff2");
}

@font-face {
  font-family: "Josefin Sans";
  font-style: normal;
  font-weight: 100 700;
  font-display: swap;
  src: url("/assets/fonts/josefin-sans-latin.woff2") format("woff2");
}

:root {
  color-scheme: light;
  --display: "Cormorant Garamond", Georgia, serif;
  --label: "Josefin Sans", Arial, sans-serif;
  --check-opacity-dur: 250ms;
  --check-rotate-dur: 250ms;
  --check-rotate-from: 20deg;
  --check-bob-dur: 250ms;
  --check-y-amount: 6px;
  --check-blur-dur: 250ms;
  --check-blur-from: 2px;
  --check-path-dur: 250ms;
  --check-path-delay: 40ms;
  --check-ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --check-ease-opacity: cubic-bezier(0.22, 1, 0.36, 1);
  --check-ease-rotate: cubic-bezier(0.22, 1, 0.36, 1);
  --check-ease-bob: cubic-bezier(0.34, 1.35, 0.64, 1);
  --check-ease-path: cubic-bezier(0.22, 1, 0.36, 1);
}

*,
*::before,
*::after { box-sizing: border-box; }

html { scroll-behavior: smooth; scrollbar-color: var(--gold) var(--ivory); scrollbar-width: thin; }

body {
  margin: 0;
  color: var(--reading);
  font: 400 1.18rem/1.72 var(--display);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body::before {
  position: fixed;
  z-index: 20;
  inset: 0;
  border: 1px solid rgb(154 110 32 / 14%);
  content: "";
  pointer-events: none;
}

::selection { background: var(--champagne); color: var(--burgundy); }
a { color: var(--burgundy); text-underline-offset: .2em; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 2px solid var(--wine); outline-offset: 4px; }
input, textarea { caret-color: var(--wine); }
.ui-icon { width: 1em; height: 1em; flex: 0 0 auto; }
.ui-icon path { stroke: currentColor; stroke-width: 1.35; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }

.skip {
  position: fixed;
  z-index: 50;
  top: .75rem;
  left: .75rem;
  padding: .7rem .9rem;
  background: var(--burgundy);
  color: var(--ivory);
  font: 500 .7rem/1 var(--label);
  letter-spacing: .14em;
  text-transform: uppercase;
  transform: translateY(-160%);
}

.skip:focus { transform: translateY(0); }

.top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
}

.top-menu { display: contents; }
.top-menu > summary { display: none; }
@media (min-width: 701px) {
  .top-menu:not([open]) > nav { display: flex; }
}

.site-brand {
  color: var(--burgundy);
}

.top nav { display: flex; flex-wrap: wrap; align-items: center; }
.top nav a {
  text-decoration: none;
}
.top nav a:hover { color: var(--wine); }
.top nav a[aria-current="page"] { text-decoration: underline; text-decoration-color: var(--gold); text-underline-offset: .35em; }

.wrap { margin-inline: auto; padding: clamp(4rem, 9vw, 7.5rem) 0 3rem; }

.content-hero { position: relative; padding: 0 0 clamp(2.2rem, 5vw, 4rem); }
.content-hero::after {
  width: min(13rem, 38vw);
  height: 1px;
  margin-top: clamp(2.2rem, 5vw, 3.5rem);
  background: linear-gradient(90deg, var(--gold), transparent);
  content: "";
}

.crumb,
.kicker {
  margin: 0 0 1.25rem;
  font: 600 .7rem/1.45 var(--label);
  text-transform: uppercase;
}

h1,
h2 { color: var(--burgundy); font-family: var(--display); font-weight: 500; text-wrap: balance; }
h1 { margin: 0 0 1.35rem; letter-spacing: -.035em; }
h2 { margin: 3.4rem 0 1rem; font-size: clamp(2rem, 4vw, 2.8rem); line-height: 1; }
.dek { margin: 0; color: var(--reading); }
.rule { display: none; }
.story > p { margin: 0 0 1.3rem; }
.story a,
.story li { overflow-wrap: anywhere; }
.story > p:first-child::first-letter {
  float: left;
  margin: .08em .1em 0 0;
  font-weight: 500;
  line-height: .72;
}

.page-producer--sparse .story {
  max-width: none;
  margin-left: 0;
  padding: clamp(3rem, 6vw, 5rem) clamp(1.5rem, 8vw, 7.5rem);
  background: var(--burgundy);
  color: rgb(255 250 242 / 86%);
}
.page-producer--sparse .story h2 { margin-top: 0; color: var(--paper); }
.page-producer--sparse .story p { color: rgb(255 250 242 / 86%); }

.place-index {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 2rem 0 0;
  padding: 0;
  border-top: 1px solid var(--line-gold);
  list-style: none;
}
.route-kicker {
  margin: 1.55rem 0 -.9rem;
  color: var(--gold);
  font: 600 .6rem/1.4 var(--label);
  letter-spacing: .14em;
  text-transform: uppercase;
}
.place-index li {
  display: grid;
  grid-template-columns: 2.25rem 1fr;
  min-height: 4.25rem;
  align-items: center;
  gap: .65rem;
  padding: .7rem .9rem;
  border-right: 1px solid var(--line-gold);
  border-bottom: 1px solid var(--line-gold);
}
.place-index li:nth-child(even) { border-right: 0; }
.place-index span { color: var(--gold); font: 600 .58rem/1 var(--label); letter-spacing: .12em; }
.place-index strong { color: var(--burgundy); font-size: 1.05rem; line-height: 1.1; }

.facts,
.directory { padding: 0; list-style: none; }
.facts li,
.directory li { padding: .85rem 0; border-bottom: 1px solid var(--line); }
.directory a { font-weight: 600; }

.callout {
  margin: 2.8rem 0;
  padding: 1.2rem 1.4rem 1.25rem;
  border-left: 2px solid var(--gold);
}

.coverage-note {
  max-width: 47rem;
  margin: 0 0 clamp(2.8rem, 6vw, 4.5rem);
  padding: clamp(1.35rem, 3vw, 2rem);
  border: 1px solid var(--line-gold);
  background: linear-gradient(135deg, rgb(232 213 183 / 32%), rgb(255 250 243 / 72%));
}

.coverage-note .kicker { margin-bottom: .65rem; }
.coverage-note h2 { margin: 0 0 .65rem; font-size: clamp(1.8rem, 3vw, 2.35rem); }
.coverage-note p:last-child { max-width: 38rem; margin: 0; }

.related {
  display: grid;
  gap: 1rem;
  margin: clamp(3.5rem, 8vw, 6.5rem) 0 2.5rem;
}

.related a {
  position: relative;
  display: flex;
  align-items: flex-end;
  padding: 1.35rem 3rem 1.35rem 1.4rem;
  font-size: 1.14rem;
  font-weight: 600;
  line-height: 1.25;
  text-decoration: none;
}
.related a::after { position: absolute; right: 1.25rem; bottom: 1.2rem; width: 1rem; height: 1rem; background: var(--gold); content: ""; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M5 11 11 5M6 5h5v5' fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; }
.related a:hover { border-color: var(--gold); }

.directory-more { margin: 1rem 0; }
.directory-more summary {
  min-height: 44px;
  color: var(--burgundy);
  cursor: pointer;
  font: 600 .72rem/44px var(--label);
  letter-spacing: .12em;
  text-transform: uppercase;
}

.footer {
  display: flex;
  align-items: center;
  gap: 1rem;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font: 500 .75rem/1.5 var(--label);
  letter-spacing: .08em;
  text-transform: uppercase;
}
.footer img { display: block; width: auto; height: 2rem; }

/* Places reference */
.place-breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .65rem;
  margin: -1.25rem 0 2.8rem;
  color: var(--muted);
  font: 600 .58rem/1.5 var(--label);
  letter-spacing: .12em;
  text-transform: uppercase;
}
.place-breadcrumbs a { color: var(--wine); text-decoration: none; }
.place-breadcrumbs a:hover { text-decoration: underline; }

.places-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(18rem, .48fr);
  gap: 1rem clamp(3rem, 8vw, 8rem);
  align-items: end;
  padding: clamp(1rem, 4vw, 3rem) 0 clamp(3rem, 7vw, 5.5rem);
  border-bottom: 1px solid var(--line);
}
.places-hero > .kicker,
.places-hero > h1,
.places-hero > .dek { grid-column: 1; }
.places-hero h1 { max-width: 11ch; }
.places-hero .place-search { grid-column: 2; grid-row: 1 / span 3; }

.place-search {
  position: relative;
  padding: 1.35rem;
  border: 1px solid var(--line-gold);
  background: rgb(255 250 242 / 62%);
}
.place-search label {
  display: block;
  margin-bottom: .65rem;
  color: var(--gold);
  font: 600 .58rem/1.4 var(--label);
  letter-spacing: .14em;
  text-transform: uppercase;
}
.place-search div { display: grid; grid-template-columns: 1fr auto; }
.place-search input,
.place-search button {
  min-width: 0;
  min-height: 48px;
  border: 1px solid var(--line-gold);
  border-radius: 0;
  font: inherit;
}
.place-search input { width: 100%; padding: .65rem .8rem; background: var(--paper); color: var(--ink); }
.place-search button { padding: .65rem .9rem; border-left: 0; background: var(--burgundy); color: var(--paper); font: 600 .58rem/1 var(--label); letter-spacing: .12em; text-transform: uppercase; cursor: pointer; }
.place-search p { margin: .7rem 0 0; color: var(--muted); font-size: .88rem; line-height: 1.4; }
.place-search-results {
  position: absolute;
  z-index: 15;
  top: calc(100% + .5rem);
  right: 0;
  left: 0;
  max-height: min(24rem, 52vh);
  overflow-y: auto;
  margin: 0;
  padding: .25rem .75rem;
  border: 1px solid var(--line-gold);
  background: var(--paper);
  box-shadow: 0 .8rem 2rem rgb(77 8 38 / 14%);
  list-style: none;
}
.place-search-results li { border-bottom: 1px solid var(--line); }
.place-search-results a {
  display: flex;
  min-height: 3.25rem;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .7rem .15rem;
  color: var(--reading);
  text-decoration: none;
}
.place-search-results strong { font-size: 1.12rem; font-weight: 600; }
.place-search-results small {
  color: var(--muted);
  font: 500 .62rem/1.35 var(--label);
  letter-spacing: .08em;
  text-align: right;
  text-transform: uppercase;
}
.place-search-results a:hover strong,
.place-search-results a:focus-visible strong { text-decoration: underline; text-underline-offset: .2em; }

.area-jump {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  padding: 1.2rem 0;
  border-bottom: 1px solid var(--line);
}
.area-jump a {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  padding: .45rem .75rem;
  border: 1px solid var(--line-gold);
  color: var(--burgundy);
  font: 600 .57rem/1 var(--label);
  letter-spacing: .11em;
  text-decoration: none;
  text-transform: uppercase;
}

.world-directory > section { padding: clamp(3.5rem, 7vw, 6rem) 0; border-bottom: 1px solid var(--line); }
.world-directory > section > header { display: grid; grid-template-columns: minmax(9rem, .38fr) minmax(0, 1fr); gap: 1rem 2rem; align-items: end; margin-bottom: 2rem; }
.world-directory > section > header .kicker { grid-column: 1; grid-row: 1; margin: 0; }
.world-directory > section > header h2 { grid-column: 2; grid-row: 1; margin: 0; font-size: clamp(2.8rem, 6vw, 5rem); }
.world-directory > section > header p:last-child { grid-column: 2; max-width: 35rem; margin: 0; }

.place-directory,
.place-guide-jump ol,
.visual-sequence,
.producer-sources ul,
.place-sources ul,
.grape-aromas ul,
.grape-guide-jump ol,
.grape-making > ol,
.grape-start > ol,
.grape-related ul,
.grape-sources ul,
.grape-index ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

.place-directory {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--line-gold);
  border-left: 1px solid var(--line-gold);
}
.place-directory li { min-width: 0; container-type: inline-size; }
.place-directory li[hidden] { display: none; }
.place-directory a {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  min-height: 8.5rem;
  gap: 1rem;
  align-items: center;
  padding: 1.1rem 1.2rem;
  border-right: 1px solid var(--line-gold);
  border-bottom: 1px solid var(--line-gold);
  background: rgb(255 250 242 / 58%);
  color: var(--reading);
  text-decoration: none;
}
.place-directory--numbered a { grid-template-columns: 2.1rem minmax(0, 1fr) auto; }
@container (max-width: 11rem) {
  .place-directory--numbered a { grid-template-columns: minmax(0, 1fr) auto; }
  .place-directory--numbered .place-directory__number { grid-column: 1; grid-row: 1; }
  .place-directory--numbered .place-directory__arrow { grid-column: 2; grid-row: 1; }
  .place-directory--numbered .place-directory__copy { grid-column: 1 / -1; grid-row: 2; }
}
.place-directory a:hover { background: var(--paper); }
.place-directory__number { color: var(--gold); font: 600 .57rem/1 var(--label); letter-spacing: .12em; }
.place-directory__copy { min-width: 0; }
.place-directory__copy strong { display: block; color: var(--burgundy); font-size: 1.35rem; line-height: 1.05; overflow-wrap: anywhere; }
.place-directory__copy small { display: block; margin-top: .42rem; color: var(--gold); font: 600 .52rem/1.35 var(--label); letter-spacing: .1em; text-transform: uppercase; }
.place-directory__copy em { display: block; margin-top: .55rem; color: var(--muted); font-size: .92rem; font-style: normal; line-height: 1.35; }
.place-directory__arrow { color: var(--gold); font-size: 1.2rem; }
.place-directory li.is-empty a { background: rgb(113 104 97 / 7%); }
.place-directory li.is-empty .place-directory__copy strong { color: #716861; }
.place-directory li.is-empty .place-directory__copy small { color: #756c65; }
.place-directory li.is-empty a:hover { background: rgb(113 104 97 / 12%); }
.page-places .place-directory a { min-height: 5.75rem; }
.page-places .place-directory__copy em { display: none; }

.places-method {
  max-width: 54rem;
  margin: clamp(4rem, 8vw, 7rem) 0;
  padding: clamp(2rem, 5vw, 4rem);
  background: var(--burgundy);
  color: rgb(255 250 242 / 84%);
}
.places-method h2 { margin: 0 0 1rem; color: var(--paper); }
.places-method .kicker { color: #e8c477; }
.places-method p:not(.kicker) { max-width: 38rem; }
.places-method a { display: inline-flex; align-items: center; gap: .4rem; color: var(--paper); font: 600 .65rem/1.4 var(--label); letter-spacing: .12em; text-transform: uppercase; }

.place-story { max-width: 68rem; }
.place-story > p { max-width: 46rem; }
.place-guide-reference {
  display: grid;
  gap: 1rem clamp(2rem, 5vw, 4.5rem);
}
.place-guide-reference > .kicker { margin: .35rem 0 0; }
.place-guide-reference > div { min-width: 0; }
.place-guide-reference h2 { margin: 0 0 .8rem; font-size: clamp(2.2rem, 4vw, 3.25rem); }
.place-guide-reference > div p { max-width: 39rem; }
.place-guide-reference > div p + p { margin-top: 1rem; }
.place-guide-reference > div p:last-child { margin-bottom: 0; }
.place-section { margin-top: clamp(3.5rem, 7vw, 6rem); }
.place-section > h2 { margin-bottom: .7rem; }
.place-section > h2 + .kicker { margin: 0 0 1.15rem; }

@media (max-width: 700px) {
  body { font-size: 1.08rem; }
  .top { align-items: center; padding-inline: 1.1rem; }
  .site-brand span { font-size: .55rem; }
  .top-menu > summary {
    text-transform: uppercase;
    cursor: pointer;
  }
  .top-menu > summary::-webkit-details-marker { display: none; }
  .top-menu > summary::after { background: var(--gold); }
  .top-menu[open] > summary::after { mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8h10' fill='none' stroke='black' stroke-linecap='round'/%3E%3C/svg%3E"); }
  .top-menu nav a { padding-inline: .85rem; font-size: .62rem; }
  .places-hero { grid-template-columns: 1fr; }
  .places-hero .place-search { grid-column: 1; grid-row: auto; margin-top: 1.4rem; }
  .place-search-results a { align-items: flex-start; flex-direction: column; gap: .2rem; }
  .place-search-results small { text-align: left; }
  .world-directory > section > header { grid-template-columns: 1fr; }
  .world-directory > section > header .kicker,
  .world-directory > section > header h2 { grid-column: 1; grid-row: auto; }
  .world-directory > section > header p:last-child { grid-column: 1; }
  .place-directory { grid-template-columns: 1fr; }
  .place-directory a { min-height: 7.5rem; }
  .place-breadcrumbs { margin-top: -.5rem; }
  .place-guide-reference { gap: .7rem; }
  .place-guide-reference > .kicker { margin-top: 0; }
}
@media (forced-colors: active) { .related a, .callout { border: 1px solid currentColor; } }

/* Living Atlas production direction */
:root {
  --ivory: #f4eddf;
  --paper: #fffaf2;
  --champagne: #e6d8bd;
  --ink: #23130d;
  --reading: #503a2d;
  --muted: #7b6556;
  --burgundy: #4d0826;
  --wine: #68102f;
  --gold: #76510e;
  --line: rgb(77 45 29 / 18%);
  --line-gold: rgb(159 116 37 / 30%);
}

body {
  background:
    radial-gradient(circle at 82% 6%, rgb(230 216 189 / 58%), transparent 28rem),
    linear-gradient(180deg, var(--paper), var(--ivory) 36rem);
}

.top {
  position: sticky;
  z-index: 20;
  top: 0;
  padding-block: .75rem;
  background: rgb(244 237 223 / 94%);
}

.wrap {
  width: min(100% - 2.5rem, 82rem);
  overflow-wrap: anywhere;
  padding-top: clamp(3.5rem, 7vw, 6.5rem);
}

.content-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(17rem, .55fr);
  gap: clamp(3rem, 8vw, 8rem);
  max-width: none;
  align-items: end;
  padding-bottom: clamp(3rem, 6vw, 5rem);
  border-bottom: 1px solid var(--line);
}
.content-hero::after { display: none; }
.content-hero > div { max-width: 57rem; }

.producer-intro,
.region-intro { position: relative; isolation: isolate; }
.producer-intro::before,
.region-intro::before {
  display: none;
}

.crumb, .kicker {
  margin-bottom: .8rem;
  color: var(--gold);
  font-size: .64rem;
  letter-spacing: .18em;
}
h1 {
  max-width: 13ch;
  margin-bottom: 1.2rem;
  font-size: clamp(4.4rem, 8vw, 6rem);
  line-height: .92;
}

.dek {
  max-width: 42rem;
  font-size: clamp(1.3rem, 2.25vw, 1.68rem);
  line-height: 1.45;
}

.record-status {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem .45rem;
  margin: 1.25rem 0 0;
  color: var(--muted);
  font: 600 .58rem/1.5 var(--label);
  letter-spacing: .12em;
  text-transform: uppercase;
}
.record-status a { color: var(--wine); }

.identity-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  max-width: 43rem;
  margin: 1.6rem 0 0;
  border-top: 1px solid var(--line-gold);
  border-left: 1px solid var(--line-gold);
}
.identity-strip div {
  min-width: 0;
  padding: .75rem .85rem;
  border-right: 1px solid var(--line-gold);
  border-bottom: 1px solid var(--line-gold);
  background: rgb(255 250 242 / 48%);
}
.identity-strip dt {
  color: var(--gold);
  font: 600 .52rem/1.4 var(--label);
  letter-spacing: .13em;
  text-transform: uppercase;
}
.identity-strip dd {
  margin: .25rem 0 0;
  color: var(--ink);
  font-size: .98rem;
  line-height: 1.25;
}
.identity-save {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  margin-top: .75rem;
  padding: .55rem .8rem;
  border: 1px solid var(--line-gold);
  background: transparent;
  color: var(--burgundy);
  font: 600 .56rem/1.2 var(--label);
  letter-spacing: .12em;
  text-transform: uppercase;
  cursor: pointer;
  gap: .55rem;
  transition-property: background-color, border-color, color;
  transition-duration: 150ms;
  transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}
.identity-save:hover { border-color: var(--wine); }
.identity-save[aria-pressed="true"] { background: var(--champagne); color: var(--burgundy); }

.t-success-check {
  display: inline-block;
  width: .9rem;
  height: .9rem;
  transform-origin: center;
  opacity: 0;
  will-change: transform, opacity, filter;
}
.t-success-check svg { display: block; width: 100%; height: 100%; overflow: visible; }
.t-success-check svg path {
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 17;
  stroke-dashoffset: 17;
}
.t-success-check[data-state="in"] {
  animation:
    t-check-fade   var(--check-opacity-dur) var(--check-ease-opacity) forwards,
    t-check-rotate var(--check-rotate-dur)  var(--check-ease-rotate)  forwards,
    t-check-blur   var(--check-blur-dur)    var(--check-ease-out)     forwards,
    t-check-bob    var(--check-bob-dur)     var(--check-ease-bob)     forwards;
}
.t-success-check[data-state="in"] svg path {
  animation: t-check-draw var(--check-path-dur) var(--check-ease-path) var(--check-path-delay, 0ms) forwards;
}
@keyframes t-check-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes t-check-rotate { from { transform: rotate(var(--check-rotate-from)); } to { transform: rotate(0deg); } }
@keyframes t-check-blur { from { filter: blur(var(--check-blur-from)); } to { filter: blur(0); } }
@keyframes t-check-bob { from { translate: 0 var(--check-y-amount); } to { translate: 0 0; } }
@keyframes t-check-draw { to { stroke-dashoffset: 0; } }

.place-guide-jump {
  display: grid;
  grid-template-columns: minmax(11rem, .34fr) minmax(0, 1fr);
  gap: 1.25rem clamp(2rem, 5vw, 4.5rem);
  max-width: 68rem;
  margin-left: clamp(0rem, 8vw, 9rem);
  padding: 1.35rem 0 1.5rem;
  border-top: 1px solid var(--line-gold);
  border-bottom: 1px solid var(--line-gold);
}
.place-guide-jump__meta {
  display: flex;
  flex-direction: column;
  gap: .45rem;
  padding-top: .35rem;
}
.place-guide-jump__meta > span {
  color: var(--gold);
  font: 600 .7rem/1.4 var(--label);
  letter-spacing: .08em;
  text-transform: uppercase;
}
.place-guide-jump__meta small {
  max-width: 13rem;
  color: var(--muted);
  font: 500 .78rem/1.5 var(--label);
  letter-spacing: .03em;
}
.place-guide-jump ol {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 1.5rem;
}
.place-guide-jump li {
  min-width: 0;
  border-top: 1px solid var(--line);
}
.place-guide-jump a {
  display: grid;
  grid-template-columns: 1.75rem minmax(0, 1fr);
  min-height: 44px;
  align-items: center;
  gap: .35rem;
  color: var(--burgundy);
  font-size: 1.05rem;
  line-height: 1.2;
  text-decoration: none;
}
.place-guide-jump a > span {
  color: var(--gold);
  font: 600 .65rem/1 var(--label);
  letter-spacing: .08em;
}
.place-guide-jump a > span,
.place-guide-jump__meta small,
.record-status,
.content-locator small,
.place-directory__number,
.place-sources summary small { font-variant-numeric: tabular-nums; }
.place-guide-jump a:hover,
.place-guide-jump a:focus-visible { color: var(--wine); text-decoration: underline; text-underline-offset: .22em; }
[id^="guide-"] { scroll-margin-top: 7rem; }

.content-locator {
  position: relative;
  display: flex;
  min-height: 13rem;
  flex-direction: column;
  justify-content: flex-end;
  padding: 0 1.3rem 1.2rem;
  overflow: hidden;
  border: 1px solid var(--line-gold);
  background: #f8f1e5;
  color: var(--reading);
  text-decoration: none;
}
.content-locator > * { position: relative; z-index: 1; }
.content-locator__map {
  position: relative;
  z-index: 0;
  display: block;
  width: calc(100% + 2.6rem);
  height: 8.6rem;
  margin: 0 -1.3rem auto;
  overflow: hidden;
  border-bottom: 1px solid var(--line-gold);
  background:
    linear-gradient(rgb(104 16 47 / 5%) 1px, transparent 1px),
    linear-gradient(90deg, rgb(104 16 47 / 5%) 1px, transparent 1px),
    #eadfc9;
  background-size: 2rem 2rem;
}
.content-locator__map img { display: block; width: 100%; height: 100%; object-fit: contain; }
.content-locator__map--empty {
  background:
    repeating-linear-gradient(45deg, transparent 0 1rem, rgb(104 16 47 / 5%) 1rem calc(1rem + 1px)),
    #eadfc9;
}
.content-locator__pin {
  position: absolute;
  top: var(--pin-y);
  left: var(--pin-x);
  width: .72rem;
  height: .72rem;
  border: 2px solid #fffaf2;
  border-radius: 50%;
  background: var(--wine);
  box-shadow: 0 0 0 1px var(--wine), 0 .2rem .6rem rgb(35 19 13 / 22%);
  transform: translate(-50%, -50%);
}
.content-locator__kicker {
  margin-top: 1rem;
  color: #6f4b10;
  font: 600 .56rem/1.4 var(--label);
  letter-spacing: .14em;
  text-transform: uppercase;
}
.content-locator strong {
  margin-top: .4rem;
  color: var(--ink);
  font-size: 1.28rem;
  line-height: 1.1;
}
.content-locator small {
  margin-top: .3rem;
  color: var(--muted);
  font: 600 .52rem/1.4 var(--label);
  letter-spacing: .1em;
}
.content-locator i {
  position: absolute;
  z-index: 2;
  top: 9.4rem;
  right: 1rem;
  color: var(--wine);
  font: 600 .54rem/1 var(--label);
  letter-spacing: .12em;
  text-transform: uppercase;
}
.content-locator i { display: inline-flex; align-items: center; gap: .35rem; }
.content-locator:hover { border-color: var(--wine); background-color: var(--paper); }

.story {
  max-width: 48rem;
  margin-left: clamp(0rem, 8vw, 9rem);
  padding-top: clamp(3.5rem, 7vw, 6rem);
}
.story.place-story { max-width: 68rem; }
.place-guide-lede {
  max-width: 47rem;
  margin-bottom: clamp(3rem, 6vw, 4.75rem);
}
.place-guide-lede .lede {
  margin: 0;
  color: var(--reading);
  font-size: clamp(1.25rem, 2vw, 1.45rem);
  line-height: 1.6;
}
.place-guide-lede .lede::first-letter {
  float: left;
  margin: .08em .1em 0 0;
  color: var(--wine);
  font-size: 4em;
  font-weight: 500;
  line-height: .72;
}
.place-visual-reference {
  max-width: 68rem;
  margin-bottom: clamp(3.5rem, 7vw, 6rem);
  padding: clamp(2.75rem, 5vw, 4.25rem) 0 0;
  border-top: 1px solid var(--line-gold);
  scroll-margin-top: 7rem;
}
.place-visual-reference__heading {
  display: grid;
  grid-template-columns: minmax(13rem, .42fr) minmax(0, 1fr);
  gap: 1rem clamp(3rem, 7vw, 7rem);
  align-items: end;
  padding-bottom: clamp(2rem, 4vw, 3rem);
}
.place-visual-reference__heading h2 {
  margin: 0;
  font-size: clamp(2.55rem, 4.5vw, 3.85rem);
  line-height: .96;
}
.place-visual-reference__heading p {
  max-width: 34rem;
  margin: 0;
  color: var(--reading);
  font-size: 1.18rem;
  line-height: 1.55;
}
.place-visual-reference__modules {
  display: grid;
  container-type: inline-size;
  grid-template-columns: minmax(0, 1fr);
  border-top: 1px solid var(--line-gold);
  border-left: 1px solid var(--line-gold);
}
.visual-reference-module {
  min-width: 0;
  padding: clamp(1.6rem, 3.5vw, 2.5rem);
  border-right: 1px solid var(--line-gold);
  border-bottom: 1px solid var(--line-gold);
  background: rgb(255 250 242 / 42%);
}
.visual-reference-module--comparison { grid-column: 1 / -1; }
.visual-reference-module > header {
  display: grid;
  grid-template-columns: minmax(16rem, .8fr) minmax(0, 1fr);
  gap: .55rem clamp(2rem, 5vw, 4.5rem);
  align-items: start;
  margin-bottom: 1.6rem;
}
.visual-reference-module > header h3 {
  grid-row: 1 / span 2;
  margin: 0;
  color: var(--burgundy);
  font-size: clamp(1.85rem, 3vw, 2.55rem);
  line-height: 1;
}
.visual-reference-module > header > p { margin: 0; }
@container (max-width: 30rem) {
  .visual-reference-module { grid-column: 1 / -1; overflow-wrap: anywhere; }
  .visual-reference-module > header { grid-template-columns: minmax(0, 1fr); }
  .visual-reference-module > header h3 { grid-row: auto; }
}
.visual-reference-module > header > p:last-child {
  color: var(--reading);
  font-size: 1.04rem;
  line-height: 1.5;
}
.visual-reference-kicker {
  color: var(--gold);
  font: 600 .55rem/1.4 var(--label);
  letter-spacing: .13em;
  text-transform: uppercase;
}
.visual-comparison {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}
.visual-comparison article {
  min-width: 0;
  padding: 1.1rem;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.visual-comparison h4,
.visual-sequence h4 { margin: 0; font-size: 1.22rem; line-height: 1.12; }
.visual-comparison h4 a { display: inline-flex; align-items: center; gap: .35rem; color: var(--burgundy); }
.visual-comparison h4 .ui-icon { flex: 0 0 auto; }
.visual-comparison p { margin: .75rem 0 0; font-size: .97rem; line-height: 1.45; }
.visual-comparison .visual-comparison__place { color: var(--muted); font-style: italic; }
.visual-comparison .visual-comparison__look {
  padding-top: .75rem;
  border-top: 1px solid var(--line);
  color: var(--ink);
}
.visual-comparison__look span {
  display: block;
  margin-bottom: .28rem;
  color: var(--gold);
  font: 600 .5rem/1.35 var(--label);
  letter-spacing: .12em;
  text-transform: uppercase;
}
.visual-sequence li {
  display: grid;
  grid-template-columns: 2rem minmax(0, 1fr);
  gap: .85rem;
  padding: 1rem 0;
  border-top: 1px solid var(--line);
}
.visual-sequence li > span {
  padding-top: .12rem;
  color: var(--gold);
  font: 600 .54rem/1.4 var(--label);
  letter-spacing: .08em;
}
.visual-sequence p { margin: .35rem 0 0; font-size: .96rem; line-height: 1.45; }
.visual-labels { margin: 0; }
.visual-labels > div {
  display: grid;
  grid-template-columns: minmax(6rem, .34fr) minmax(0, 1fr);
  gap: 1rem;
  padding: .85rem 0;
  border-top: 1px solid var(--line);
}
.visual-labels dt { color: var(--burgundy); font-size: 1.13rem; line-height: 1.15; }
.visual-labels dd { margin: 0; }
.visual-labels dd strong,
.visual-labels dd span { display: block; }
.visual-labels dd strong { color: var(--ink); font-size: .94rem; font-weight: 500; line-height: 1.35; }
.visual-labels dd span { margin-top: .25rem; color: var(--muted); font-size: .82rem; line-height: 1.35; }
.place-guide-section {
  display: grid;
  grid-template-columns: minmax(13rem, .42fr) minmax(0, 1fr);
  gap: 1.5rem clamp(3rem, 7vw, 7rem);
  max-width: 68rem;
  margin: 0;
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid var(--line-gold);
}
.place-guide-section__heading,
.place-guide-section__body { min-width: 0; }
.place-guide-section__heading > p {
  margin: .8rem 0 0;
  color: var(--gold);
  font: 500 .78rem/1.4 var(--label);
  letter-spacing: .04em;
}
.place-guide-section .place-guide-section__heading h2 {
  margin: 0;
  font-size: clamp(2.4rem, 4.3vw, 3.7rem);
  line-height: .98;
}
.place-guide-section__body > p {
  max-width: 40rem;
  margin: 0 0 1.25rem;
}
.place-guide-section__body > p:last-child { margin-bottom: 0; }
.place-guide-reference {
  grid-template-columns: minmax(13rem, .42fr) minmax(0, 1fr);
  max-width: 68rem;
  margin: 0;
  padding: clamp(2.25rem, 5vw, 3.5rem);
  border: 1px solid var(--line-gold);
  background: linear-gradient(135deg, rgb(230 216 189 / 46%), rgb(255 250 242 / 70%));
}
.place-guide-reference--label {
  padding-inline: 0;
  border-right: 0;
  border-left: 0;
  background: transparent;
}
.place-guide-reference + .place-guide-reference { margin-top: clamp(2rem, 4vw, 3rem); }
.story > p { max-width: 44rem; }
.story h2 { margin-top: 4.6rem; font-size: clamp(2.5rem, 4.4vw, 3.7rem); }
.story > h2:first-child { margin-top: 0; }
.story > p:first-child::first-letter {
  margin-right: .08em;
  color: var(--wine);
  font-size: 4.1em;
}

.page-producer--master .producer-guide {
  max-width: 68rem;
  margin-left: 0;
}
.producer-guide-section {
  display: grid;
  grid-template-columns: minmax(12rem, .42fr) minmax(0, 1fr);
  gap: 1.5rem clamp(3rem, 7vw, 7rem);
  padding: clamp(3rem, 6vw, 5rem) 0;
  border-top: 1px solid var(--line-gold);
}
.producer-guide-section:first-child { padding-top: 0; border-top: 0; }
.producer-guide-section header { min-width: 0; }
.producer-guide-section .kicker { margin: .7rem 0 0; }
.producer-guide-section h2 {
  margin: 0;
  font-size: clamp(2.45rem, 4.5vw, 3.9rem);
  line-height: .98;
}
.producer-guide-section > div { min-width: 0; }
.producer-guide-section > div p { max-width: 40rem; margin: 0 0 1.25rem; }
.producer-guide-section > div p:last-child { margin-bottom: 0; }
.producer-guide-section--first-bottle {
  margin-top: clamp(1rem, 3vw, 2rem);
  padding: clamp(2rem, 4vw, 3.2rem);
  border: 1px solid var(--line-gold);
  background: linear-gradient(135deg, rgb(230 216 189 / 46%), rgb(255 250 242 / 62%));
}

.producer-sources {
  max-width: 48rem;
  margin: clamp(2.5rem, 5vw, 4rem) 0 0 clamp(0rem, 8vw, 9rem);
  border-block: 1px solid var(--line-gold);
}
.producer-sources summary {
  display: flex;
  min-height: 52px;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  color: var(--burgundy);
  cursor: pointer;
  font: 600 .75rem/1.5 var(--label);
  letter-spacing: .06em;
  list-style: none;
  text-transform: uppercase;
}
.producer-sources summary::-webkit-details-marker { display: none; }
.producer-sources summary::after,
.grape-sources summary::after,
.place-sources summary::after { width: .9rem; height: .9rem; background: var(--gold); content: ""; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 3v10M3 8h10' fill='none' stroke='black' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat; }
.producer-sources[open] summary::after,
.grape-sources[open] summary::after,
.place-sources[open] summary::after { mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8h10' fill='none' stroke='black' stroke-linecap='round'/%3E%3C/svg%3E"); }
.producer-sources summary span { margin-left: auto; color: var(--muted); }
.producer-sources > div { padding: 0 0 1.5rem; }
.producer-sources p { max-width: 40rem; margin: .3rem 0 1rem; font-size: 1rem; line-height: 1.5; }
.producer-sources ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem 1rem; }
.producer-sources li { min-width: 0; }
.producer-sources a { color: var(--wine); font-size: .95rem; overflow-wrap: anywhere; }

.place-sources {
  max-width: 68rem;
  margin: clamp(3rem, 6vw, 5rem) 0 0;
  border-block: 1px solid var(--line-gold);
}
.place-sources summary {
  display: flex;
  min-height: 58px;
  align-items: center;
  gap: 1rem;
  color: var(--burgundy);
  cursor: pointer;
  font: 600 .75rem/1.5 var(--label);
  letter-spacing: .06em;
  list-style: none;
  text-transform: uppercase;
}
.place-sources summary::-webkit-details-marker { display: none; }
.place-sources summary::after { margin-left: .2rem; }
.place-sources summary small { margin-left: auto; color: var(--muted); font: 500 .7rem/1.4 var(--label); letter-spacing: .06em; text-transform: none; }
.place-sources > div { display: grid; grid-template-columns: minmax(14rem, .7fr) minmax(0, 1fr); gap: 1.5rem 3rem; padding: .4rem 0 1.6rem; }
.place-sources p { max-width: 32rem; margin: 0; color: var(--muted); font-size: .98rem; line-height: 1.55; }
.place-sources li { margin-bottom: .45rem; color: var(--muted); font-size: .92rem; overflow-wrap: anywhere; }
.place-sources a { color: var(--wine); }

.wine-connections {
  max-width: 68rem;
  margin: clamp(4rem, 8vw, 7rem) 0 0;
  padding: clamp(2rem, 4vw, 3.25rem);
  border: 1px solid var(--line-gold);
  background: linear-gradient(135deg, rgb(230 216 189 / 46%), rgb(255 250 242 / 72%));
}
.wine-connections > header { display: grid; grid-template-columns: minmax(10rem, .32fr) minmax(0, .68fr); gap: .5rem 2rem; }
.wine-connections > header .kicker { grid-column: 1; grid-row: 1 / span 2; margin: .5rem 0 0; }
.wine-connections h2 { grid-column: 2; grid-row: 1; margin: 0; font-size: clamp(2.6rem, 5vw, 4rem); }
.wine-connections > header > p:last-child { max-width: 35rem; margin: .5rem 0 0; color: var(--muted); }
.wine-connections > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin-top: 2rem; background: var(--line-gold); border: 1px solid var(--line-gold); }
.wine-connections > div:has(> article:only-child) { grid-template-columns: minmax(0, 1fr); max-width: 48rem; margin-inline: auto; }
.wine-connections article { padding: 1.4rem; background: rgb(255 250 242 / 88%); }
.wine-connections h3 { margin: 0; color: var(--burgundy); font-size: 1.65rem; }
.wine-connections article > p { min-height: 5.2rem; margin: .65rem 0 1.3rem; color: var(--muted); font-size: .94rem; line-height: 1.48; }
.wine-connections nav { display: grid; gap: .5rem; }
.wine-connections nav a { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; padding-top: .6rem; border-top: 1px solid var(--line); color: var(--burgundy); text-decoration: none; }
.wine-connections nav a::after { width: .9rem; height: .9rem; background: var(--gold); content: ""; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8h10M9 4l4 4-4 4' fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; }
.wine-connections nav span { color: var(--muted); font: 600 .56rem/1.4 var(--label); letter-spacing: .11em; text-transform: uppercase; }
.wine-connections nav strong { margin-left: auto; font-size: .98rem; text-align: right; }

.page-producer--master.page-producer--sparse .producer-guide {
  max-width: 68rem;
  margin-left: 0;
}
.page-producer--master.page-producer--sparse .producer-guide-section {
  grid-template-columns: minmax(10rem, .34fr) minmax(0, 1fr);
  border-color: rgb(232 196 119 / 40%);
}
.page-producer--master.page-producer--sparse .producer-guide-section .kicker { color: #e8c477; }

.directory { margin-top: 1.2rem; border-top: 1px solid var(--line); }
.directory li {
  display: grid;
  grid-template-columns: minmax(10rem, .7fr) minmax(0, 1.3fr);
  gap: 1rem 2rem;
  padding: 1rem 0;
}
.directory a { color: var(--ink); font-size: 1.18rem; line-height: 1.2; }
.directory-summary { color: var(--muted); font-size: 1rem; line-height: 1.45; }

.related {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  max-width: none;
  margin-top: clamp(4rem, 8vw, 7rem);
  border-top: 1px solid var(--line);
}
.related a {
  min-height: 10rem;
  border: 0;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: rgb(255 250 242 / 55%);
}
.related a:first-child { border-left: 1px solid var(--line); }
.related a:hover { background: var(--paper); }

.continuity-next {
  margin-top: clamp(3rem, 6vw, 5rem);
  padding-top: clamp(1.5rem, 3vw, 2.5rem);
  border-top: 1px solid var(--line);
}
.continuity-next header { display: grid; grid-template-columns: minmax(12rem, .45fr) 1fr; align-items: end; gap: 1rem; }
.continuity-next header .kicker { grid-column: 1; grid-row: 1; margin: 0; }
.continuity-next h2 { grid-column: 2; grid-row: 1; margin: 0; font-size: clamp(2.4rem, 4.3vw, 3.7rem); }
.continuity-next > div { display: grid; grid-template-columns: 1fr; margin-top: 2rem; border-top: 1px solid var(--line-gold);  }
.continuity-next a {
  position: relative;
  display: grid;
  min-height: 7rem;
  grid-template-columns: minmax(6rem, .24fr) minmax(0, .7fr) minmax(0, 1fr);
  align-items: start;
  gap: 1rem 2rem;
  padding: 1.5rem 2.5rem 1.5rem .25rem;

  border-bottom: 1px solid var(--line-gold);
  background: transparent;
  color: var(--reading);
  text-decoration: none;
}
.continuity-next a::after { position: absolute; right: 1.1rem; top: 1rem; width: .9rem; height: .9rem; background: var(--gold); content: ""; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M5 11 11 5M6 5h5v5' fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; }
.continuity-next a > span { color: var(--gold); font: 600 .7rem/1.5 var(--label); letter-spacing: .08em; text-transform: uppercase; }
.continuity-next a > strong { max-width: 22rem; margin-top: 0; padding-top: 0; color: var(--burgundy); font-size: 1.65rem; font-weight: 500; line-height: 1.15; }
.continuity-next a > small { margin-top: 0; color: var(--muted); font-size: 1.08rem; line-height: 1.5; }
.continuity-next a:hover { background: var(--paper); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .identity-save { transition: none; }
  .t-success-check { animation: none !important; opacity: 1; }
  .t-success-check svg path { animation: none !important; stroke-dashoffset: 0 !important; }
}

.callout {
  max-width: 48rem;
  margin-left: clamp(0rem, 8vw, 9rem);
  background: rgb(230 216 189 / 46%);
}

.footer {
  justify-content: space-between;
  margin-top: 6rem;
  padding: 2rem 0;
}

/* Reviewed static profiles have no producer locator column. */
@media (min-width: 761px) {
  .page-producer--static .content-hero { grid-template-columns: minmax(0, 1fr); }
  .page-producer--static .content-hero h1 { max-width: 18ch; }
}

@media (max-width: 760px) {
  .top { padding-inline: 1rem; }
  .wrap { width: min(100% - 2rem, 82rem); padding-top: 2rem; }
  .place-breadcrumbs { margin-bottom: 1.25rem; }
  .content-hero { grid-template-columns: 1fr; gap: 1.15rem; padding-bottom: 1.5rem; }
  h1 { max-width: 100%; font-size: clamp(3.35rem, 14vw, 4.5rem); overflow-wrap: anywhere; }
  .dek { font-size: 1.16rem; line-height: 1.38; }
  .identity-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 1rem; }
  .identity-strip div { padding: .58rem .65rem; }
  .identity-strip dt { font-size: .65rem; }
  .identity-strip dd { font-size: 1rem; line-height: 1.3; }
  .identity-save { margin-top: .6rem; }
  .content-locator {
    display: grid;
    grid-template-columns: min(7.5rem, 45%) minmax(0, 1fr);
    grid-template-rows: auto auto 1fr;
    min-height: 6.5rem;
    padding: 0 .85rem .75rem 0;
  }
  .content-locator__map {
    grid-row: 1 / -1;
    width: 100%;
    height: 100%;
    margin: 0 .85rem 0 0;
    border-right: 1px solid var(--line-gold);
    border-bottom: 0;
  }
  .content-locator__kicker { margin-top: .7rem; }
  .content-locator strong { margin-top: .15rem; font-size: 1.05rem; }
  .content-locator small { margin-top: .1rem; }
  .content-locator i { top: .75rem; right: .75rem; }
  .story { margin-left: 0; padding-top: 3.5rem; }
  .story h2 { margin-top: 3.6rem; font-size: 2.7rem; }
  .place-guide-lede { margin-bottom: 3rem; }
  .place-visual-reference { margin-bottom: 3.5rem; padding-top: 2.5rem; }
  .place-visual-reference__heading,
  .visual-reference-module > header { grid-template-columns: 1fr; gap: .75rem; }
  .place-visual-reference__heading h2,
  .visual-reference-module > header h3 { grid-row: auto; margin-top: 0; }
  .place-visual-reference__heading { padding-bottom: 1.5rem; }
  .place-visual-reference__modules { grid-template-columns: 1fr; border-left: 0; }
  .visual-reference-module { padding: 1.25rem 0; border-right: 0; background: transparent; }
  .visual-reference-module > header { gap: .5rem; margin-bottom: 1rem; }
  .visual-reference-module--comparison { grid-column: auto; }
  .visual-comparison { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .visual-comparison p { margin-top: .5rem; }
  .visual-comparison .visual-comparison__look { padding-top: .5rem; }
  .place-guide-section,
  .place-guide-reference {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
  .place-guide-section { padding: 3.25rem 0; }
  .place-guide-section .place-guide-section__heading h2 { margin-top: 0; font-size: 2.8rem; }
  .place-guide-section__heading h2 { overflow-wrap: anywhere; }
  .place-guide-reference { padding: 1.5rem; }
  .place-guide-reference--label { padding-inline: 0; }
  .producer-guide-section { grid-template-columns: 1fr; gap: .85rem; }
  .producer-guide-section h2 { margin-top: 0; font-size: 2.8rem; }
  .producer-guide-section--first-bottle { padding: 1.5rem; }
  .producer-sources { margin-left: 0; }
  .producer-sources ul { grid-template-columns: 1fr; }
  .place-sources summary { align-items: flex-start; flex-wrap: wrap; padding-block: .9rem; }
  .place-sources summary small { width: calc(100% - 2rem); margin: 0; }
  .place-sources > div { grid-template-columns: 1fr; gap: 1rem; }
  .wine-connections { padding: 1.35rem; }
  .wine-connections > header, .wine-connections > div { grid-template-columns: minmax(0, 1fr); }
  .wine-connections h2, .wine-connections nav strong { overflow-wrap: anywhere; }
  .wine-connections nav a { flex-wrap: wrap; min-width: 0; }
  .wine-connections > header .kicker,
  .wine-connections h2 { grid-column: 1; grid-row: auto; }
  .wine-connections article > p { min-height: 0; }
  .directory li { grid-template-columns: 1fr; gap: .35rem; }
  .related { grid-template-columns: 1fr; }
  .related a { min-height: 7.5rem; border-left: 1px solid var(--line); }
  .callout { margin-left: 0; }
  .place-guide-jump {
    grid-template-columns: 1fr;
    gap: 1rem;
    margin-left: 0;
    padding: 1rem 0 1.25rem;
  }
  .place-guide-jump__meta { padding-top: 0; }
  .place-guide-jump__meta small { max-width: none; }
  .place-guide-jump ol { grid-template-columns: 1fr; }
  .continuity-next header, .continuity-next > div { grid-template-columns: 1fr; }
  .continuity-next header .kicker,
  .continuity-next h2 { grid-column: 1; grid-row: auto; }
  .continuity-next a { min-height: 0; grid-template-columns: 1fr; gap: .45rem; padding-block: 1.4rem; }

  .page-producer--sparse .wrap,
  .page-region--sparse .wrap { padding-top: 2.1rem; }
  .page-producer--sparse .content-hero,
  .page-region--sparse .content-hero { gap: 1.35rem; padding-bottom: 2.1rem; }
  .page-producer--sparse .content-locator,
  .page-region--sparse .content-locator { min-height: 12.75rem; }
  .page-producer--sparse .content-locator__map,
  .page-region--sparse .content-locator__map { height: 7.25rem; }
  .page-producer--sparse .content-locator i,
  .page-region--sparse .content-locator i { top: 8.05rem; }
  .page-producer--sparse .story,
  .page-region--sparse .story { padding-top: 2.35rem; }
  .page-producer--sparse .story {
    max-width: none;
    margin-left: 0;
    padding: 2.35rem 1.25rem 2.6rem;
    background: var(--burgundy);
    color: rgb(255 250 242 / 82%);
  }
  .page-producer--sparse .story h2 { margin-top: 0; color: var(--paper); }
  .page-producer--sparse .story p { color: rgb(255 250 242 / 82%); }
  .page-producer--master.page-producer--sparse .producer-guide-section { grid-template-columns: 1fr; }
  .page-producer--sparse .story h2,
  .page-region--sparse .story h2 { font-size: 2.8rem; }
  .page-producer--sparse h1 { font-size: clamp(3.15rem, 13vw, 3.65rem); line-height: .96; }
  .page-producer--sparse .producer-intro::before,
  .page-region--sparse .region-intro::before { display: none; }
  .producer-intro::before,
  .region-intro::before { top: .15rem; font-size: 8.5rem; }
  .place-index { grid-template-columns: 1fr; }
  .place-index li,
  .place-index li:nth-child(even) { border-right: 0; }
  .page-region--sparse .place-index { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page-region--sparse .place-index li { border-right: 1px solid var(--line-gold); }
  .page-region--sparse .place-index li:nth-child(even) { border-right: 0; }
}

@media (max-width: 420px) {
  .visual-comparison { grid-template-columns: 1fr; border-left: 0; }
  .visual-comparison article { padding: 1rem 0; border-right: 0; }
  .visual-labels > div { grid-template-columns: 1fr; gap: .3rem; }
}

@media (max-width: 390px) {
  .wrap { width: min(100% - 1.5rem, 82rem); }
  h1 { font-size: clamp(3.15rem, 13vw, 3.9rem); }
  .dek { font-size: 1.12rem; }
}

@media (max-width: 340px) {
  .top { padding-inline: .75rem; }
}

/* Grape reference: the Living Atlas grammar, with taste taking the place of a locator. */
.page-grape .wrap,
.page-grapes .wrap { width: min(100% - 2.5rem, 78rem); }

.grape-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(20rem, .82fr);
  gap: clamp(2rem, 6vw, 6rem);
  align-items: end;
  padding: clamp(1rem, 3vw, 2rem) 0 clamp(3.5rem, 7vw, 6rem);
}

.grape-intro { position: relative; isolation: isolate; }
.grape-intro::before {
  position: absolute;
  z-index: -1;
  top: -2.5rem;
  right: 0;
  color: rgb(118 81 14 / 8%);
  content: attr(data-monogram);
  font: 500 clamp(8rem, 19vw, 15rem)/.75 var(--display);
  letter-spacing: -.08em;
  pointer-events: none;
}
.grape-kind {
  margin: 0 0 1rem;
  color: var(--gold);
  font: 600 .67rem/1.4 var(--label);
  letter-spacing: .18em;
  text-transform: uppercase;
}
.grape-intro h1 { max-width: 10ch; }
.grape-pronunciation {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem .65rem;
  align-items: baseline;
  margin: -0.4rem 0 1.5rem;
  color: var(--burgundy);
  font-size: 1.05rem;
  font-style: italic;
}
.grape-pronunciation > span {
  color: var(--gold);
  font: 600 .7rem/1.4 var(--label);
  font-style: normal;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.grape-pronunciation small { width: 100%; color: var(--muted); font-size: .82rem; }
.grape-intro .identity-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 44rem; }

.grape-profile-plate {
  position: relative;
  overflow: hidden;
  padding: clamp(1.4rem, 3vw, 2.25rem);
  border: 1px solid var(--gold);
  background: var(--burgundy);
  color: rgb(255 250 243 / 82%);
}
.page-grape--white .grape-profile-plate { background: #3d2030; }
.grape-profile-plate::after {
  position: absolute;
  right: -3rem;
  bottom: -5.5rem;
  width: 12rem;
  height: 12rem;
  border: 1px solid rgb(232 213 183 / 28%);
  border-radius: 50%;
  content: "";
}
.grape-profile-plate header { display: grid; grid-template-columns: 8rem 1fr; gap: 1rem; align-items: end; }
.grape-profile-plate .kicker { grid-column: 1; grid-row: 1; margin: 0; color: var(--champagne); }
.grape-profile-plate h2 { grid-column: 2; grid-row: 1; margin: 0; color: var(--paper); font-size: clamp(2rem, 4vw, 3.1rem); }
.grape-traits { margin: 2rem 0; padding: 0; border-top: 1px solid rgb(232 213 183 / 28%); list-style: none; }
.grape-traits li {
  display: grid;
  grid-template-columns: 5.5rem 1fr 2rem;
  gap: .75rem;
  align-items: center;
  min-height: 2.45rem;
  border-bottom: 1px solid rgb(232 213 183 / 20%);
}
.grape-traits li > span:first-child,
.grape-traits b { font: 500 .58rem/1 var(--label); letter-spacing: .12em; text-transform: uppercase; }
.grape-traits b { color: var(--champagne); font-size: .52rem; text-align: right; }
.grape-trait-scale { height: 5px; background: rgb(255 250 243 / 14%); }
.grape-trait-scale i { display: block; width: calc(var(--trait-value) * 20%); height: 100%; background: var(--champagne); }
.grape-aromas > p { margin: 0 0 .75rem; color: var(--champagne); font: 600 .58rem/1 var(--label); letter-spacing: .16em; text-transform: uppercase; }
.grape-aromas ul { display: flex; flex-wrap: wrap; gap: .4rem; }
.grape-aromas li { padding: .42rem .55rem .35rem; border: 1px solid rgb(232 213 183 / 30%); font-size: .83rem; line-height: 1; }
.grape-profile-plate > small { display: block; max-width: 29rem; margin-top: 1.25rem; color: rgb(255 250 243 / 82%); font-size: .95rem; line-height: 1.5; }

.grape-guide-jump {
  display: grid;
  grid-template-columns: minmax(13rem, .34fr) 1fr;
  gap: 2rem;
  margin-bottom: clamp(3rem, 6vw, 5rem);
  padding: 1.35rem 0;
  border-top: 1px solid var(--line-gold);
  border-bottom: 1px solid var(--line-gold);
}
.grape-guide-jump > div { display: flex; flex-direction: column; gap: .35rem; }
.grape-guide-jump > div span { color: var(--gold); font: 600 .7rem/1.4 var(--label); letter-spacing: .08em; text-transform: uppercase; }
.grape-guide-jump > div small { color: var(--muted); font-size: .95rem; line-height: 1.5; }
.grape-guide-jump ol { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 1.4rem; }
.grape-guide-jump a { display: grid; grid-template-columns: 2rem 1fr; gap: .65rem; min-height: 44px; align-items: center; padding: .35rem 0; color: var(--reading); font-size: 1.05rem; line-height: 1.2; text-decoration: none; }
.grape-guide-jump a:hover { color: var(--wine); }
.grape-guide-jump a span { color: var(--gold); font: 600 .65rem/1.8 var(--label); letter-spacing: .12em; }

.grape-story { max-width: none; }
.grape-opening,
.grape-module { scroll-margin-top: 7rem; }
.grape-opening {
  display: grid;
  grid-template-columns: minmax(12rem, .38fr) minmax(0, 1fr);
  gap: clamp(2rem, 6vw, 7rem);
  max-width: 68rem;
  margin-bottom: clamp(3rem, 6vw, 5rem);
}
.grape-opening h2,
.grape-module h2,
.grape-related h2 { margin: 0; font-size: clamp(2.4rem, 4.3vw, 3.7rem); }
.grape-opening h2 { font-size: clamp(2.7rem, 4vw, 3.5rem); }
.grape-opening > header .kicker { margin: 1rem 0 0; }
.grape-opening > div { max-width: 42rem; padding-top: .25rem; }
.grape-opening > div p { margin: 0 0 1.3rem; }

.grape-module { margin-top: clamp(3rem, 6vw, 5rem); }
.grape-module > header { display: grid; grid-template-columns: minmax(12rem, .32fr) minmax(0, 1fr); gap: .6rem 2rem; align-items: end; margin-bottom: 2.4rem; }
.grape-module > header .kicker { grid-column: 1; grid-row: 1; margin: 0; }
.grape-module > header h2 { grid-column: 2; grid-row: 1; }
.grape-module > header > p:last-child:not(.kicker) { grid-column: 2; max-width: 40rem; margin: .65rem 0 0; }

.grape-places > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--line-gold); border-left: 1px solid var(--line-gold); }
.grape-places article { display: grid; grid-template-columns: 2rem 1fr; gap: .4rem 1rem; min-height: 18rem; padding: 1.35rem; border-right: 1px solid var(--line-gold); border-bottom: 1px solid var(--line-gold); background: rgb(255 250 243 / 52%); }
.grape-places article > span { grid-row: 1 / 4; color: var(--gold); font: 600 .55rem/1.8 var(--label); letter-spacing: .14em; }
.grape-places h3 { align-self: start; margin: 0; color: var(--burgundy); font-size: 1.85rem; line-height: 1; }
.grape-places article > p { margin: .4rem 0 1.4rem; font-size: 1rem; line-height: 1.5; }
.grape-places nav { display: flex; flex-wrap: wrap; gap: .7rem 1rem; align-self: end; }
.grape-places nav a { display: inline-flex; min-height: 44px; gap: .35rem; align-items: center; color: var(--gold); font: 600 .7rem/1.5 var(--label); letter-spacing: .06em; text-decoration: none; text-transform: uppercase; }

.grape-making > ol { border-top: 1px solid var(--line); }
.grape-making li { display: grid; grid-template-columns: 4rem minmax(0, 1fr); gap: 1.3rem; max-width: 64rem; margin-left: auto; padding: 1.55rem 0; border-bottom: 1px solid var(--line); }
.grape-making li > span { color: var(--gold); font: 600 .57rem/1.8 var(--label); letter-spacing: .16em; }
.grape-making h3 { margin: 0 0 .45rem; color: var(--burgundy); font-size: 1.55rem; line-height: 1.05; }
.grape-making li p { max-width: 42rem; margin: 0; }

.grape-labels { padding: clamp(2rem, 5vw, 4.5rem); background: var(--burgundy); color: rgb(255 250 243 / 82%); }
.grape-labels h2 { color: var(--paper); }
.grape-labels .kicker { color: var(--champagne); }
.grape-labels > header > p:last-child { color: rgb(255 250 243 / 72%); }
.grape-labels dl { margin: 0; border-top: 1px solid rgb(232 213 183 / 32%); }
.grape-labels dl > div { display: grid; grid-template-columns: minmax(12rem, .32fr) minmax(0, 1fr); gap: 2rem; padding: 1.25rem 0; border-bottom: 1px solid rgb(232 213 183 / 24%); }
.grape-labels dt { color: var(--champagne); font-size: 1.35rem; line-height: 1.15; }
.grape-labels dd { max-width: 42rem; margin: 0; }

.grape-table > div { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--line-gold); border-left: 1px solid var(--line-gold); }
.grape-table article { min-height: 16rem; padding: 1.35rem; border-right: 1px solid var(--line-gold); border-bottom: 1px solid var(--line-gold); }
.grape-table h3 { margin: 0 0 1.5rem; color: var(--gold); font: 600 .61rem/1.4 var(--label); letter-spacing: .16em; text-transform: uppercase; }
.grape-table p { margin: 0; font-size: 1.02rem; line-height: 1.55; }

.grape-start > ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.5rem, 4vw, 3.5rem); }
.grape-start li { padding-top: 1rem; border-top: 2px solid var(--gold); }
.grape-start li > span { color: var(--gold); font: 600 .55rem/1 var(--label); letter-spacing: .16em; }
.grape-start h3 { min-height: 2.3em; margin: 1.3rem 0 .75rem; color: var(--burgundy); font-size: 1.7rem; line-height: 1.05; }
.grape-start li p { margin: 0; font-size: 1rem; line-height: 1.55; }

.grape-related { margin-top: clamp(3rem, 6vw, 5rem); padding-top: 1.5rem; border-top: 1px solid var(--line); }
.grape-related > header { display: grid; grid-template-columns: minmax(12rem, .32fr) minmax(0, 1fr); gap: 2rem; align-items: end; }
.grape-related > header .kicker { grid-column: 1; grid-row: 1; margin: 0; }
.grape-related > header h2 { grid-column: 2; grid-row: 1; }
.grape-related > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 2.5rem; border-top: 1px solid var(--line-gold); border-left: 1px solid var(--line-gold); }
.grape-related > div > section { padding: 1.4rem; border-right: 1px solid var(--line-gold); border-bottom: 1px solid var(--line-gold); }
.grape-related h3 { margin: 0 0 1.1rem; color: var(--gold); font: 600 .72rem/1.5 var(--label); letter-spacing: .08em; text-transform: uppercase; }
.grape-related li + li { border-top: 1px solid var(--line); }
.grape-related a { display: grid; gap: .2rem; padding: .85rem 0; color: var(--reading); text-decoration: none; }
.grape-related a strong { color: var(--burgundy); font-size: 1.25rem; line-height: 1.05; }
.grape-related a span { color: var(--muted); font-size: 1.05rem; line-height: 1.5; }

.grape-sources { margin-top: clamp(3rem, 6vw, 5rem); border-top: 1px solid var(--line-gold); border-bottom: 1px solid var(--line-gold); scroll-margin-top: 7rem; }
.grape-sources summary { display: flex; min-height: 4.5rem; align-items: center; justify-content: space-between; gap: 1rem; cursor: pointer; list-style: none; }
.grape-sources summary::-webkit-details-marker { display: none; }
.grape-sources summary span { color: var(--burgundy); font-size: 1.4rem; }
.grape-sources summary small { color: var(--gold); font: 600 .72rem/1.5 var(--label); letter-spacing: .06em; text-transform: uppercase; }

.grape-sources > div { display: grid; grid-template-columns: minmax(13rem, .34fr) 1fr; gap: 2rem; padding: 1rem 0 2rem; }
.grape-sources > div p { margin: 0; }
.grape-sources li + li { margin-top: .55rem; }
.grape-sources a { overflow-wrap: anywhere; }

.grapes-hero { display: flex; max-width: 64rem; flex-direction: column; padding: clamp(1rem, 4vw, 3rem) 0 clamp(4rem, 8vw, 7rem); }
.grapes-hero h1 { order: 1; max-width: 13ch; font-size: clamp(3.7rem, 9vw, 7.2rem); }
.grapes-hero .kicker { order: 2; }
.grapes-hero .dek { order: 3; }
.grape-index > header { display: grid; grid-template-columns: minmax(12rem, .35fr) 1fr; gap: 2rem; align-items: end; margin-bottom: 2rem; }
.grape-index h2 { margin: 0; font-size: clamp(2.7rem, 5vw, 4.3rem); }
.grape-index > header p { max-width: 36rem; margin: 0; }
.grape-index ol { border-top: 1px solid var(--line-gold); }
.grape-index li { border-bottom: 1px solid var(--line-gold); }
.grape-index li > a { display: grid; grid-template-columns: 3rem 1fr 2rem; gap: 1rem; align-items: center; min-height: 12rem; padding: 1.4rem 0; color: var(--reading); text-decoration: none; }
.grape-index li > a > span { color: var(--gold); font: 600 .55rem/1 var(--label); letter-spacing: .16em; }
.grape-index li p { margin: 0 0 .25rem; color: var(--gold); font: 600 .56rem/1.4 var(--label); letter-spacing: .13em; text-transform: uppercase; }
.grape-index li h3 { margin: 0; color: var(--burgundy); font-size: clamp(2.3rem, 5vw, 4.4rem); line-height: .95; }
.grape-index li small { display: block; max-width: 46rem; margin-top: .8rem; color: var(--muted); font-size: .93rem; line-height: 1.4; }
.grape-index li .ui-icon { color: var(--gold); }
.grape-index-more { max-width: 50rem; margin: clamp(5rem, 10vw, 8rem) 0 0 auto; padding: clamp(2rem, 5vw, 4rem); background: var(--burgundy); color: rgb(255 250 243 / 78%); }
.grape-index-more h2 { margin-top: 0; color: var(--paper); }
.grape-index-more a { display: inline-flex; gap: .4rem; align-items: center; color: var(--champagne); font: 600 .6rem/1.4 var(--label); letter-spacing: .12em; text-decoration: none; text-transform: uppercase; }

@media (max-width: 760px) {
  .page-grape .wrap,
  .page-grapes .wrap { width: min(100% - 2rem, 78rem); }
  .grape-opening > *, .grape-module > header > *, .grape-places article > * { min-width: 0; }
  .grape-hero { grid-template-columns: 1fr; gap: 2rem; padding-bottom: 3rem; }
  .grape-intro::before { display: none; }
  .grape-intro .identity-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grape-profile-plate header { grid-template-columns: 1fr; }
  .grape-profile-plate .kicker,
  .grape-profile-plate h2 { grid-column: 1; grid-row: auto; }
  .grape-guide-jump { grid-template-columns: 1fr; gap: 1rem; margin-bottom: 4rem; }
  .grape-guide-jump ol { grid-template-columns: 1fr; }
  .grape-opening { grid-template-columns: 1fr; gap: 1rem; margin-bottom: 5rem; }
  .grape-opening h2,
  .grape-module h2,
  .grape-related h2 { font-size: clamp(2.65rem, 12vw, 3.7rem); }
  .grape-module { margin-top: 5rem; }
  .grape-module > header,
  .grape-related > header { grid-template-columns: 1fr; gap: .65rem; }
  .grape-module > header .kicker,
  .grape-module > header h2,
  .grape-module > header > p:last-child:not(.kicker) { grid-column: 1; grid-row: auto; }
  .grape-related > header .kicker,
  .grape-related > header h2 { grid-column: 1; grid-row: auto; }
  .grape-places > div { grid-template-columns: 1fr; }
  .grape-places article { min-height: 15rem; }
  .grape-making li { grid-template-columns: 2.2rem minmax(0, 1fr); }
  .grape-labels { margin-inline: -.75rem; padding: 2.1rem 1.25rem; }
  .grape-labels dl > div { grid-template-columns: 1fr; gap: .45rem; }
  .grape-table > div,
  .grape-start > ol,
  .grape-related > div { grid-template-columns: 1fr; }
  .grape-table article { min-height: 0; }
  .grape-start > ol { gap: 2.2rem; }
  .grape-start h3 { min-height: 0; }
  .grape-sources summary { align-items: flex-start; flex-wrap: wrap; padding: .9rem 0; }
  .grape-sources summary small { width: calc(100% - 2rem); }
  .grape-sources > div { grid-template-columns: 1fr; gap: 1rem; }
  .grape-index > header { grid-template-columns: 1fr; gap: .8rem; }
  .grape-index li > a { grid-template-columns: 2rem 1fr; min-height: 10rem; }
  .grape-index li .ui-icon { display: none; }
}

@media (max-width: 420px) {
  .grape-traits li { grid-template-columns: minmax(0, 1fr) 2rem; gap: .5rem; padding-block: .5rem; }
  .grape-traits li > span:first-child { grid-column: 1 / -1; grid-row: 1; }
  .grape-traits b { grid-column: 2; grid-row: 2; }
  .grape-trait-scale { grid-column: 1; grid-row: 2; }
}

@media (prefers-reduced-motion: reduce) {
  .grape-guide-jump a,
  .grape-index a,
  .grape-related a { transition: none; }
}

/* Producers hub and A to Z pages */
.producer-hub { margin-top: clamp(2.5rem, 5vw, 4rem); }
.producer-hub h2 { margin-bottom: 1.2rem; }
.producer-countries { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr)); gap: 0 2rem; margin: 0; padding: 0; list-style: none; }
.producer-countries > li { border-bottom: 1px solid var(--line, #c9b898); }
.producer-countries summary { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; min-height: 44px; padding: .7rem 0; cursor: pointer; font-size: 1.15rem; }
.producer-countries summary small, .producer-countries li small { color: var(--muted, #6e5a4c); font-size: .85rem; }
.producer-countries details ul { margin: 0 0 1rem; padding: 0; list-style: none; columns: 2 11rem; column-gap: 1.5rem; }
.producer-countries details li { break-inside: avoid; padding: .2rem 0; }
.producer-letter-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(4.5rem, 1fr)); gap: .5rem; margin: 0; padding: 0; list-style: none; }
.producer-letter-grid a { display: grid; justify-items: center; gap: .15rem; padding: .7rem .4rem; border: 1px solid var(--line, #c9b898); text-decoration: none; }
.producer-letter-grid strong { font-size: 1.4rem; font-weight: 500; }
.producer-letter-grid small { color: var(--muted, #6e5a4c); font-size: .78rem; }
.producer-letters ul { display: flex; flex-wrap: wrap; gap: .3rem; margin: 1.5rem 0; padding: 0; list-style: none; }
.producer-letters :is(a, span) { display: inline-grid; place-items: center; min-width: 2.4rem; min-height: 2.4rem; border: 1px solid var(--line, #c9b898); text-decoration: none; }
.producer-letters span[aria-current] { background: #4d0826; border-color: #4d0826; color: #fbf7ef; }
.producer-list { columns: 2 20rem; column-gap: 3rem; margin: 0; padding: 0; list-style: none; }
.producer-list li { display: grid; break-inside: avoid; padding: .55rem 0; border-bottom: 1px solid var(--line, #c9b898); }
.producer-list small { color: var(--muted, #6e5a4c); font-size: .85rem; }

/* Places hub: full guides with their photographs, and every country's regions and named areas */
.full-guides { margin-top: clamp(2.5rem, 5vw, 4rem); }
.full-guides > p { max-width: 62ch; color: var(--muted, #7b6556); }
.full-guides ul { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 13.5rem), 1fr)); gap: 1.25rem; margin: 1.5rem 0 0; padding: 0; list-style: none; }
.full-guides a { display: grid; gap: .3rem; color: inherit; text-decoration: none; }
.full-guides img, .full-guides__blank { display: block; width: 100%; aspect-ratio: 8 / 5; height: auto; object-fit: cover; background: rgb(77 45 29 / 8%); }
.full-guides strong { margin-top: .35rem; font-size: 1.3rem; font-weight: 500; }
.full-guides small { color: var(--muted, #7b6556); font-size: .88rem; }
.full-guides a:hover strong, .full-guides a:focus-visible strong { text-decoration: underline; text-underline-offset: .2em; }
.world-directory__title { margin-top: clamp(3rem, 6vw, 4.5rem); }
.place-tree { margin: 0 0 .8rem; padding: 0 1rem; }
.place-tree summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; color: var(--muted, #7b6556); font-size: .92rem; }
.place-tree > ul { margin: 0 0 .8rem; padding: 0; list-style: none; columns: 2 14rem; column-gap: 2rem; }
.place-tree > ul > li { break-inside: avoid; padding: .3rem 0; }
.place-tree ul ul { margin: .2rem 0 .2rem; padding-left: .9rem; list-style: none; font-size: .9rem; }
.place-tree ul ul li { padding: .12rem 0; }

.continuity-bar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 1rem;
  margin: -1.5rem 0 3rem;
  padding: 1rem 1.15rem;
  border: 1px solid rgb(159 116 37 / 35%);
  background: rgb(255 250 242 / 88%);
  color: #503a2d;
  box-shadow: 0 .6rem 2rem rgb(77 8 38 / 7%);
  backdrop-filter: blur(16px);
}
.continuity-bar p { display: grid; gap: .18rem; margin: 0; }
.continuity-bar span {
  color: #9f7425;
  font: 600 .58rem/1.4 "Josefin Sans", Arial, sans-serif;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.continuity-bar strong { color: #2b1911; font: 500 1rem/1.35 "Cormorant Garamond", Georgia, serif; }
.continuity-bar a,
.continuity-bar button {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  padding: .55rem .8rem;
  border: 1px solid rgb(77 8 38 / 20%);
  background: transparent;
  color: #4d0826;
  font: 600 .58rem/1.2 "Josefin Sans", Arial, sans-serif;
  letter-spacing: .1em;
  text-decoration: none;
  text-transform: uppercase;
  cursor: pointer;
}
.continuity-bar button[aria-pressed="true"] { border-color: #9f7425; background: #eadfc9; }
.continuity-bar--atlas {
  position: relative;
  z-index: 1;
  display: flex;
  box-sizing: border-box;
  width: auto;
  min-width: 0;
  max-width: calc(100% - 1.6rem);
  align-items: center;
  gap: .55rem;
  margin: .8rem;
  padding: .75rem .9rem;
  box-shadow: none;
}
.continuity-bar--atlas p { min-width: 0; flex: 1; }
.continuity-bar--atlas strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.continuity-bar--atlas a { min-width: 3.6rem; padding-inline: .45rem; }
.continuity-bar--learn {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 1rem;
  margin: 60px 0 0;
  border-right: 0;
  border-left: 0;
  box-shadow: none;
}
.continuity-bar--learn p { min-width: 0; flex: 1; }
.reference-page--library .continuity-bar {
  margin: 5.5rem 0 0;
  scroll-margin-top: 5.5rem;
}

.your-world { padding: clamp(2rem, 4vw, 3rem) 0; background: #efe3cf; }
.your-world[hidden] { display: none; }
.your-world__heading { display: grid; grid-template-columns: minmax(0, 1fr) minmax(16rem, .55fr); gap: 2rem; align-items: end; }
.your-world__heading h2 { margin: .25rem 0 0; color: #4d0826; font: 500 clamp(2rem, 3.5vw, 3rem)/1.08 "Cormorant Garamond", Georgia, serif; }
.your-world__heading p { margin: 0; color: #503a2d; font: 400 1.18rem/1.5 "Cormorant Garamond", Georgia, serif; }
.your-world__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); align-items: start; gap: 1.5rem; margin-top: 1.5rem; }
.your-world__card { min-width: 0; padding: 1rem 0 0; border-top: 1px solid rgb(159 116 37 / 45%); background: transparent; }
.your-world__card[hidden] { display: none; }
.your-world__card h3 { margin: 0 0 1rem; color: #4d0826; font: 500 1.65rem/1 "Cormorant Garamond", Georgia, serif; }
.your-world__card ul { display: grid; gap: .7rem; margin: 0; padding: 0; list-style: none; }
.your-world__card li { display: grid; gap: .1rem; }
.your-world__card a { color: #4d0826; font: 600 .68rem/1.35 "Josefin Sans", Arial, sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.your-world__card li span { color: #624a3c; font: 400 .92rem/1.35 "Cormorant Garamond", Georgia, serif; }
.your-world__privacy { display: flex; justify-content: space-between; gap: 1rem; align-items: center; margin-top: 1.5rem; color: #624a3c; font: 400 .95rem/1.4 "Cormorant Garamond", Georgia, serif; }
.your-world__privacy button { min-height: 44px; padding: .5rem .8rem; border: 1px solid rgb(77 8 38 / 24%); background: transparent; color: #4d0826; cursor: pointer; }

@media (max-width: 760px) {
  .continuity-bar { grid-template-columns: 1fr; gap: .6rem; margin-top: -.5rem; }
  .continuity-bar a, .continuity-bar button { width: 100%; }
  .continuity-bar--atlas { grid-template-columns: none; width: auto; max-width: calc(100% - 1.1rem); margin: .55rem; padding: .65rem .75rem; }
  .continuity-bar--atlas a { width: auto; }
  .continuity-bar--learn { grid-template-columns: none; margin-top: 60px; }
  .continuity-bar--learn a { width: auto; flex: 0 0 auto; }
  .your-world__heading, .your-world__grid { grid-template-columns: 1fr; }
  .your-world__privacy { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 340px) {
  .continuity-bar--atlas span { display: none; }
  .continuity-bar--atlas strong {
    max-width: none;
    overflow: visible;
    font-size: .92rem;
    line-height: 1.05;
    text-overflow: clip;
    white-space: normal;
  }
}

@media (forced-colors: active) {
  .continuity-bar, .your-world__card { border: 1px solid currentColor; }
}

/* Shared ink and materials for explanatory artwork on reading surfaces. */
:root {
  --illustration-ink: #6b243b;
  --illustration-accent: #762d43;
  --illustration-paper: #f7f2e6;
  --illustration-wine: #c59b5060;
  --illustration-wood: #bb885c35;
  --illustration-rule: #b6a68d;
  --illustration-ruby: #850035bb;
  --illustration-tawny: #b56c2bbb;
  --illustration-stroke: 1.4;
}
.wine-illustration {
  display: block;
  width: min(100%, 200px);
  height: auto;
  margin-inline: auto;
  fill: none;
  stroke: var(--illustration-ink);
  stroke-width: var(--illustration-stroke);
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Separate, authored paper specimens: each term keeps its own factual explanation. */
.label-study {
  --label-paper: var(--illustration-paper, #fffaf2);
  --label-ivory: #f4eddf;
  --label-ink: var(--illustration-ink, #4d0826);
  --label-reading: var(--illustration-ink, #503a2d);
  --label-rule: var(--illustration-rule, #b49a70);
  margin: 1.6rem 0 0;
  color: var(--label-reading);
  text-align: left;
}
.label-study__caption { padding-bottom: 1.25rem; }
.label-study__caption strong { display: block; font: 500 1.4rem/1.2 "Cormorant Garamond", "Iowan Old Style", Baskerville, serif; color: var(--label-ink); }
.label-study__caption > span { display: block; max-width: 65ch; margin-top: .45rem; font: 400 .88rem/1.5 "Josefin Sans", "Avenir Next", sans-serif; }
.label-study__collection { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.7rem 1.4rem; align-items: start; }
.label-study__entry { min-width: 0; border: 0; border-radius: 0; background: transparent; }
.label-study__entry > summary { display: block; padding: 0; cursor: pointer; list-style: none; }
.label-study__entry > summary::-webkit-details-marker { display: none; }
.label-study__specimens { display: flex; gap: .6rem; min-height: 10rem; padding: 1rem; background: var(--label-ink); align-items: stretch; }
.label-study__paper { position: relative; display: flex; flex: 1; min-width: 0; flex-direction: column; justify-content: center; align-items: center; gap: .8rem; padding: 1.6rem 1rem 1.2rem; background: var(--label-paper); color: var(--label-ink); border: 1px solid var(--label-rule); outline: 1px solid var(--label-rule); outline-offset: -.45rem; text-align: center; }
.label-study__term { display: block; max-width: 20ch; font: 500 clamp(1.35rem, 2.4vw, 1.9rem)/1.05 "Cormorant Garamond", "Iowan Old Style", Baskerville, serif; overflow-wrap: anywhere; text-wrap: balance; }
.label-study__rule { display: block; width: 2rem; border-top: 1px solid var(--label-rule); }
.label-study__kind { font: 600 .65rem/1.3 "Josefin Sans", "Avenir Next", sans-serif; letter-spacing: .1em; text-transform: uppercase; }
.label-study__specimens--comparison .label-study__paper { padding: 1.3rem .6rem 1rem; }
.label-study__specimens--comparison .label-study__term { font-size: clamp(1.1rem, 1.8vw, 1.5rem); }
.label-study__action { display: flex; justify-content: space-between; align-items: center; gap: .7rem; min-height: 44px; padding: .5rem .75rem; color: var(--label-ink); background: var(--label-ivory); border-bottom: 1px solid var(--label-rule); font: 500 .78rem/1.4 "Josefin Sans", "Avenir Next", sans-serif; }
.label-study__toggle { width: 16px; height: 16px; flex: 0 0 16px; }
.label-study__entry[open] .label-study__toggle path { d: path('M3 8h10'); }
.label-study__entry[open] .label-study__when-closed,
.label-study__entry:not([open]) .label-study__when-open { display: none; }
.label-study__entry > summary:hover .label-study__action { background: #e6d8bd; }
.label-study__entry > summary:focus-visible { outline: 3px solid #850035; outline-offset: 4px; }
.label-study__annotation { position: relative; padding: 1rem .25rem 0 1.3rem; }
.label-study__annotation::before { content: ''; position: absolute; left: .35rem; top: 0; height: 1.65rem; width: .55rem; border-left: 1px solid var(--label-rule); border-bottom: 1px solid var(--label-rule); }
.label-study .label-study__annotation p { margin: 0; font: 400 1.1rem/1.45 "Cormorant Garamond", "Iowan Old Style", Baskerville, serif; color: var(--label-reading); }
.label-study .label-study__annotation .label-study__cue { margin-top: .6rem; font-size: .97rem; }
.label-study ::selection { background: #e6d8bd; color: #4d0826; }
.grape-labels .label-study__caption strong,
.grape-labels .label-study__caption > span,
.grape-labels .label-study .label-study__annotation p { color: #fffaf2; }
.grape-labels .label-study__specimens { background: #3d2030; }
@media (max-width: 760px) {
  .label-study__collection { grid-template-columns: 1fr; gap: 1.75rem; }
  .label-study__specimens { min-height: 9rem; }
  .label-study__term { font-size: 1.75rem; }
  .label-study__specimens--comparison .label-study__term { font-size: 1.4rem; }
}
@media (max-width: 390px) {
  .label-study__specimens--comparison { flex-wrap: wrap; }
  .label-study__specimens--comparison .label-study__paper { flex-basis: 40%; }
}
@media (forced-colors: active) {
  .label-study__paper, .label-study__action { border: 1px solid CanvasText; }
  .label-study__entry > summary:focus-visible { outline-color: Highlight; }
}

.label-study__outside { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .3rem .8rem; padding: .65rem .75rem .35rem; color: var(--label-ink); background: var(--label-ivory); font: 400 .75rem/1.4 "Josefin Sans", "Avenir Next", sans-serif; }
.label-study__year-space { display: block; width: 5rem; height: 2rem; border: 1px dashed var(--label-rule); }
.label-study__year-space--absent { border-width: 0 0 1px; }

/* Cellar cutaways and independent winemaking choices share the reference ink. */
.reference-process-art {
  --process-ink: var(--illustration-ink, #503a2d);
  --process-liquid: var(--illustration-wine, #c6a452);
  display: block;
  width: 100%;
  height: auto;
  color: var(--process-ink);
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.reference-process-art .process-glass { fill: var(--illustration-paper, #f3eee2); }
.reference-process-art .process-liquid { fill: var(--process-liquid); stroke: none; opacity: .72; }
.reference-process-art .process-wood { fill: var(--illustration-wood, #dfc7a0); }
.reference-process-art .process-hoop { fill: #978778; stroke-width: 1; }
.reference-process-art .process-detail { stroke-width: 1.2; }
.reference-process-art .process-ground { stroke: var(--illustration-rule, #9b8569); opacity: .45; }
.reference-process-art .process-highlight { stroke: var(--illustration-paper, #fffaf2); stroke-width: 2.4; }
.reference-process-art .process-bubbles { stroke: var(--illustration-paper, #fffaf2); stroke-width: 1.4; }
.reference-process-art .process-sediment { fill: #76510e; stroke: none; }
.reference-process-art .process-grapes,
.reference-process-art .process-skins { fill: #83415c; stroke: #4d0826; }
.reference-process-art .process-cutaway,
.reference-process-art .process-paper { fill: var(--illustration-paper, #fffaf2); }
.reference-process-art .process-acid { fill: #e6d8bd; stroke: #68102f; }
.reference-process-art .process-sugar { fill: var(--illustration-paper, #fffaf2); }
.reference-process-art .process-white-cluster .process-grapes { fill: #d7c68f; stroke: #76510e; }
.reference-process-art .process-white-wine { --process-liquid: var(--illustration-wine, #c6a452); }
.reference-process-art .process-arrow { stroke: #76510e; }
.reference-cellar-sequence {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  list-style: none;
  margin: 1.8rem 0 0;
  padding: 0;
  gap: 0;
}
.reference-cellar-sequence > li { min-width: 0; padding: 0 1rem; border-inline-start: 1px solid var(--reference-line, rgb(77 45 29 / 18%)); }
.reference-cellar-sequence > li:first-child { border-inline-start: 0; padding-inline-start: 0; }
.reference-cellar-sequence > li:last-child { padding-inline-end: 0; }
.reference-cellar-sequence .reference-process-art { max-width: 16rem; margin: 0 auto 1.3rem; }
.reference-cellar-sequence__copy { position: relative; }
.reference-process-number { display: block; color: var(--reference-gold, #76510e); font: 600 .72rem/1.4 var(--font-label, 'Josefin Sans', sans-serif); margin-bottom: .5rem; }
.reference-cellar-sequence h4 { color: var(--reference-burgundy, #4d0826); font-size: 1.42rem; line-height: 1.13; margin: 0 0 .7rem; font-weight: 500; }
.reference-cellar-sequence p { font-size: 1.08rem; line-height: 1.55; margin: 0; }
.reference-winemaking {
  list-style: none;
  padding: 0;
  margin: 0;
}
.reference-winemaking .reference-process-art { --process-liquid: var(--illustration-ruby, #8c3650); }
.reference-winemaking--white .reference-process-art { --process-liquid: var(--illustration-wine, #c6a452); }
.reference-winemaking--white .process-grapes,
.reference-winemaking--white .process-skins { fill: #d7c68f; stroke: #76510e; }
.reference-winemaking > .reference-winemaking__row { display: grid; grid-template-columns: 9rem minmax(0, 1fr); align-items: center; gap: 1.6rem; margin: 0; max-width: none; border-bottom: 0; padding: 1.5rem 0; border-top: 1px solid var(--reference-line, rgb(77 45 29 / 18%)); }
.reference-winemaking > .reference-winemaking__row:first-child { padding-top: 0; border-top: 0; }
.reference-winemaking > .reference-winemaking__row--text { grid-template-columns: minmax(0, 1fr); padding-inline-start: 10.6rem; }
.reference-winemaking__illustration { align-self: start; }
.reference-winemaking__copy h3 { margin: 0 0 .5rem; color: var(--reference-burgundy, #4d0826); font-size: 1.7rem; font-weight: 500; line-height: 1.15; }
.reference-winemaking__copy p { margin: 0; max-width: 64ch; }
@media (max-width: 1000px) and (min-width: 761px) {
  .reference-cellar-sequence { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem 0; }
  .reference-cellar-sequence > li:nth-child(3) { border-inline-start: 0; padding-inline-start: 0; }
}
@media (max-width: 760px) {
  .reference-cellar-sequence { display: block; }
  .reference-cellar-sequence > li,
  .reference-cellar-sequence > li:first-child,
  .reference-cellar-sequence > li:last-child { display: block; border-inline-start: 0; border-top: 1px solid var(--reference-line, rgb(77 45 29 / 18%)); padding: 1.5rem 0; }
  .reference-cellar-sequence > li:first-child { border-top: 0; padding-top: 0; }
  .reference-cellar-sequence .reference-process-art { width: min(12rem, 100%); margin: 0 0 1rem; }
  .reference-winemaking > .reference-winemaking__row { grid-template-columns: min(7rem, 40%) minmax(0, 1fr); gap: 0 1rem; }
  .reference-winemaking__copy { display: contents; }
  .reference-winemaking__copy h3 { align-self: center; }
  .reference-winemaking__copy p { grid-column: 1 / -1; margin-top: .8rem; }
  .reference-winemaking > .reference-winemaking__row--text { grid-template-columns: minmax(0, 1fr); padding-inline-start: 0; }
}
@media (forced-colors: active) {
  .reference-process-art { color: CanvasText; }
  .reference-process-art * { stroke: CanvasText; }
}

.reference-winemaking .reference-process-caption { font: 400 .75rem/1.4 var(--font-label, "Josefin Sans", sans-serif); color: var(--reference-reading, #503a2d); text-align: center; margin: .3rem 0 0; }

/* Reading plates use label excerpts and equal tasting pours, never map shapes
   or implied quality scores. A wider two-column rhythm keeps words legible. */
.reference-process-art .process-label {
  fill: var(--illustration-ink, #503a2d);
  stroke: none;
  font: 500 17px/1.2 "Cormorant Garamond", "Iowan Old Style", Baskerville, serif;
}
.reference-process-art .process-label--active { fill: var(--illustration-accent, #68102f); font-weight: 700; }
.reference-process-art .process-tasting--red { --process-liquid: var(--illustration-ruby, #8c3650); }
.reference-process-art .process-tasting--white { --process-liquid: var(--illustration-wine, #c6a452); }
.reference-cellar-sequence--reading {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2rem 0;
}
.reference-cellar-sequence--reading > li {
  display: grid;
  grid-template-columns: 10rem minmax(0, 1fr);
  gap: 1rem;
  align-items: start;
}
.reference-cellar-sequence--reading > li:nth-child(odd) { border-inline-start: 0; padding-inline-start: 0; }
.reference-cellar-sequence--reading .reference-process-art { margin: 0; }
@media (max-width: 1100px) and (min-width: 761px) {
  .reference-cellar-sequence--reading > li { display: block; }
  .reference-cellar-sequence--reading .reference-process-art { max-width: min(13rem, 100%); margin-bottom: 1rem; }
}
@media (max-width: 760px) {
  .reference-cellar-sequence--reading > li,
  .reference-cellar-sequence--reading > li:first-child,
  .reference-cellar-sequence--reading > li:last-child { display: block; }
  .reference-cellar-sequence--reading .reference-process-art { width: min(13rem, 100%); margin-bottom: 1rem; }
}
@media (forced-colors: active) {
  .reference-process-art .process-label { fill: CanvasText; stroke: none; }
}

/* The shared site header (scripts/lib/site-header.mjs) and shared control proportions.
   Every surface loads this file, the Atlas included, so every rule is scoped to .wh or to a named control. */
:root {
  --wow-header-height: 4.75rem;
  --wow-gutter: clamp(1rem, 4vw, 4rem);
  --wow-ui-font: 'Josefin Sans', 'Avenir Next', 'Helvetica Neue', Arial, sans-serif;
  --wow-ui-size: .75rem;
  --wow-ui-ink: #4d0826;
  --wow-ui-paper: #f4eddf;
  --wow-ui-raised: #fbf7ef;
  --wow-ui-line: #c9b898;
  --wow-ui-muted: #6e5a4c;
  --wow-ui-focus: #850035;
}

.wh, .wh * { box-sizing: border-box; }
.wh {
  position: sticky; top: env(safe-area-inset-top, 0px); z-index: 900;
  border-bottom: 1px solid var(--wow-ui-line); background: var(--wow-ui-paper); color: var(--wow-ui-ink);
  font: 500 var(--wow-ui-size)/1.4 var(--wow-ui-font);
}
.wh a { color: inherit; }
.wh :is(a, button, input):focus-visible { outline: 2px solid var(--wow-ui-focus); outline-offset: 3px; }
.wh__sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.wh__bar {
  display: flex; align-items: center; gap: clamp(1rem, 2.2vw, 2rem);
  min-height: var(--wow-header-height); padding: .5rem max(var(--wow-gutter), calc((100vw - 84rem) / 2));
}
.wh__brand { display: inline-flex; align-items: center; flex-shrink: 0; gap: .85rem; min-height: 44px; text-decoration: none; }
.wh__brand img { display: block; width: auto; height: 2.5rem; }
.wh__brand span { padding-left: .85rem; border-left: 1px solid var(--wow-ui-line); font-size: .625rem; letter-spacing: .15em; text-transform: uppercase; white-space: nowrap; }
.wh__menu { display: flex; flex: 1; align-items: center; outline: 0; gap: clamp(1rem, 2vw, 1.75rem); min-width: 0; }
.wh__toggle { display: none; }

/* Menu */
.wh__nav { order: 1; margin-right: auto; }
.wh__nav > ul { display: flex; align-items: center; gap: clamp(.7rem, 1.6vw, 1.6rem); margin: 0; padding: 0; list-style: none; }
.wh__item { position: relative; display: flex; align-items: center; }
.wh__link {
  display: inline-flex; align-items: center; min-height: 44px; padding: .35rem 0;
  letter-spacing: .12em; text-decoration: none; text-transform: uppercase; white-space: nowrap;
  border-bottom: 1px solid transparent;
}
.wh__link:hover { border-bottom-color: currentColor; }
.wh__item.is-current > .wh__link { border-bottom: 2px solid var(--wow-ui-focus); color: var(--wow-ui-focus); }
.wh__more {
  display: inline-grid; place-items: center; width: 1.5rem; min-height: 44px; margin-left: .1rem; padding: 0;
  border: 0; background: none; color: inherit; cursor: pointer;
}
.wh__more::before {
  content: ''; width: .75rem; height: .75rem; background: currentColor; transition: transform 160ms ease-out;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5' fill='none' stroke='black' stroke-width='1.3'/%3E%3C/svg%3E") center / contain no-repeat;
}
.wh__more[aria-expanded='true']::before { transform: rotate(180deg); }
.wh__panel {
  position: absolute; top: 100%; left: -1rem; display: none; min-width: 14rem; margin: 0; padding: .5rem 0; list-style: none;
  border: 1px solid var(--wow-ui-line); background: var(--wow-ui-raised); box-shadow: 0 16px 32px -18px rgb(36 0 20 / 45%);
}
.wh__panel a { display: block; padding: .6rem 1rem; font-size: .8rem; letter-spacing: .08em; text-decoration: none; text-transform: none; white-space: nowrap; }
.wh__panel a:hover { background: var(--wow-ui-paper); text-decoration: underline; text-underline-offset: .25em; }
.wh__more[aria-expanded='true'] + .wh__panel { display: block; }
@media (hover: hover) and (min-width: 64em) {
  .wh__item--panel:hover:not(.is-dismissed) > .wh__panel { display: block; }
}

/* Search and Find a wine */
.wh__search { position: relative; order: 2; display: flex; align-items: center; flex: 0 1 16rem; min-width: 9rem; }
.wh__search::before {
  content: ''; position: absolute; left: .7rem; width: 1rem; height: 1rem; background: var(--wow-ui-muted); pointer-events: none;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='8.5' cy='8.5' r='5.5' fill='none' stroke='black' stroke-width='1.4'/%3E%3Cpath d='m13 13 4.5 4.5' fill='none' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E") center / contain no-repeat;
}
.wh__search input {
  width: 100%; min-height: 44px; padding: .5rem .8rem .5rem 2.2rem; border: 1px solid var(--wow-ui-line); border-radius: 0;
  background: var(--wow-ui-raised); color: var(--wow-ui-ink); font: 400 .95rem/1.2 Georgia, 'Times New Roman', serif;
  -webkit-appearance: none; appearance: none;
}
.wh__search input::placeholder { color: var(--wow-ui-muted); opacity: 1; }
.wh__search input::-webkit-search-cancel-button { -webkit-appearance: none; }
.wh__find {
  order: 3; display: inline-flex; align-items: center; min-height: 44px; padding: .5rem 1rem; flex-shrink: 0;
  border: 1px solid var(--wow-ui-focus); color: var(--wow-ui-focus) !important; letter-spacing: .12em; text-decoration: none; text-transform: uppercase; white-space: nowrap;
}
.wh__find:hover, .wh__find[aria-current] { background: var(--wow-ui-focus); color: var(--wow-ui-paper) !important; }

.wh__results {
  position: absolute; top: calc(100% + .4rem); right: 0; width: min(26rem, calc(100vw - 2 * var(--wow-gutter))); max-height: min(70vh, 34rem); overflow-y: auto;
  padding: .4rem 0; border: 1px solid var(--wow-ui-line); background: var(--wow-ui-raised); box-shadow: 0 18px 36px -18px rgb(36 0 20 / 50%);
  font-family: Georgia, 'Times New Roman', serif; text-transform: none; letter-spacing: 0;
}
.wh__results[hidden] { display: none; }
.wh__group { padding: .3rem 0; }
.wh__group + .wh__group { border-top: 1px solid var(--wow-ui-line); }
.wh__group-title { margin: .3rem 1rem .2rem; color: var(--wow-ui-muted); font: 600 .66rem/1.3 var(--wow-ui-font); letter-spacing: .14em; text-transform: uppercase; }
.wh__result { display: flex; align-items: center; min-height: 44px; justify-content: space-between; gap: 1rem; padding: .5rem 1rem; text-decoration: none; }
.wh__result-title { min-width: 0; font-size: 1rem; overflow-wrap: anywhere; }
.wh__result-type { flex-shrink: 0; color: var(--wow-ui-muted); font: 500 .68rem/1.3 var(--wow-ui-font); letter-spacing: .08em; text-transform: uppercase; }
.wh__result:hover, .wh__result.is-active { background: var(--wow-ui-paper); }
.wh__result.is-active .wh__result-title { text-decoration: underline; text-underline-offset: .2em; }
.wh__all { display: block; margin-top: .2rem; padding: .7rem 1rem .5rem; border-top: 1px solid var(--wow-ui-line); color: var(--wow-ui-focus) !important; font-size: .92rem; }
.wh__note { margin: .6rem 1rem; font-size: .92rem; }

/* Narrow laptops: drop the brand line first */
@media (max-width: 77.5em) { .wh__brand span { display: none; } }

/* Phones and tablets: one Menu button opens search, the five subjects with their parts, and Find a wine */
@media (max-width: 63.9375em) {
  :root { --wow-header-height: 4.25rem; }
  .wh__brand img { height: 2.125rem; }
  .wh__toggle {
    display: inline-flex; align-items: center; gap: .6rem; min-width: 44px; min-height: 44px; margin-left: auto; padding: .4rem 0;
    border: 0; background: none; color: inherit; font: inherit; letter-spacing: .12em; text-transform: uppercase; cursor: pointer;
  }
  .wh__toggle::after {
    content: ''; width: 20px; height: 20px; background: currentColor;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M2 6h16M2 14h16' fill='none' stroke='black' stroke-width='1.2'/%3E%3C/svg%3E") center / contain no-repeat;
  }
  .wh[data-open] .wh__toggle::after { mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m4 4 12 12M4 16 16 4' fill='none' stroke='black' stroke-width='1.2'/%3E%3C/svg%3E"); }
  .wh--js .wh__menu { display: none; }
  .wh--js[data-open] .wh__menu {
    position: absolute; top: 100%; left: 0; right: 0; display: flex; max-height: calc(100dvh - var(--wow-header-height)); overflow-y: auto;
    border-bottom: 1px solid var(--wow-ui-line); background: var(--wow-ui-paper); box-shadow: 0 16px 28px -16px rgb(36 0 20 / 35%);
  }
  .wh__menu { flex-direction: column; align-items: stretch; gap: 1rem; padding: 1rem var(--wow-gutter) 1.4rem; }
  .wh:not(.wh--js) .wh__bar { flex-wrap: wrap; }
  .wh:not(.wh--js) .wh__toggle { display: none; }
  .wh:not(.wh--js) .wh__menu { flex: 1 0 100%; padding-inline: 0; }
  .wh__search { order: 1; flex: none; min-width: 0; }
  .wh__results { position: static; width: 100%; max-height: none; margin-top: .4rem; box-shadow: none; }
  .wh__nav { order: 2; margin: 0; }
  .wh__nav > ul { flex-direction: column; align-items: stretch; gap: 0; }
  .wh__item { flex-wrap: wrap; border-bottom: 1px solid var(--wow-ui-line); }
  .wh__link { flex: 1; min-height: 48px; font-size: .82rem; border-bottom: 0; }
  .wh__item.is-current > .wh__link { border-bottom: 0; }
  .wh__item.is-current > .wh__link::before { content: ''; width: .4rem; height: .4rem; margin-right: .6rem; border-radius: 50%; background: currentColor; }
  .wh__more { display: none; }
  .wh__panel { position: static; display: flex; flex: 1 0 100%; flex-wrap: wrap; gap: .1rem 1.2rem; min-width: 0; padding: 0 0 .8rem; border: 0; background: none; box-shadow: none; }
  .wh__panel a { padding: .35rem 0; font-size: .82rem; color: var(--wow-ui-muted); }
  .wh__find { order: 3; justify-content: center; }
}

/* Learn pages were laid out under a header fixed to the top of the window. */
.wh--fixed { position: fixed; top: 0; left: 0; right: 0; padding-top: env(safe-area-inset-top, 0px); }

/* Atlas: a slim floating bar over the map. The map keeps its own place search, so the header search stays out. */
.wh--atlas {
  position: fixed; z-index: 30; inset: max(.45rem, env(safe-area-inset-top)) .7rem auto;
  border: 1px solid rgb(154 110 10 / 28%); background: rgb(255 250 240 / 96%); box-shadow: 0 .5rem 2rem rgb(77 0 38 / 8%);
}
.wh--atlas .wh__bar { min-height: 3rem; padding: .2rem .7rem; }
.wh--atlas .wh__brand img { height: 1.85rem; }
.wh--atlas .wh__search { display: none; }
.wh--atlas :is(.wh__link, .wh__more, .wh__find) { min-height: 44px; }
.wh--atlas .wh__find { padding: .3rem .8rem; }
@media (max-width: 63.9375em) {
  .wh--atlas { inset: max(.35rem, env(safe-area-inset-top)) .4rem auto; }
  .wh--atlas .wh__brand img { height: 1.55rem; }
}

@media (prefers-reduced-motion: reduce) { .wh__more::before { transition: none; } }
@media (forced-colors: active) {
  .wh { border-color: CanvasText; }
  .wh__item.is-current > .wh__link { border-color: Highlight; }
}

/* Shared control proportions; each surface retains its light or dark colour roles. */
:is(.button, .btn, .identity-save, .library-finder__scope) { min-height: 44px; border-radius: 0; font-weight: 500; font-size: var(--wow-ui-size); line-height: 1.5; letter-spacing: .1em; }
:is(.hero-answer__field, .library-finder__field):focus-within { outline: 2px solid #850035; outline-offset: 3px; }
:is(.hero-answer__field, .library-finder__field) input { min-height: 54px; font-size: 1.125rem; caret-color: #850035; }
:is(.hero-answer__field, .library-finder__field) input::placeholder { color: #765e4e; opacity: 1; }
:is(.hero-answer__status, .library-finder__status) { font-size: .8rem; line-height: 1.5; }

/* Region guide. A white sheet with full-width colour bands: the opening
   photograph, a burgundy "at a glance" band, stone for history, champagne for
   choosing a bottle and a cellar spread for the signature wine. Everything is
   scoped to body.rg-page (region and subregion guides) so country and producer pages keep
   their own layout. */

.rg-page {
  --rg-sheet: #ffffff;
  --rg-stone: #f3ede9;
  --rg-champagne: #f1e6d6;
  --rg-ink: #1f0e12;
  --rg-reading: #463231;
  --rg-muted: #6b5856;
  --rg-hair: #e9e0dd;
  --rg-line: #d3c6c3;
  --rg-burgundy: #4d0026;
  --rg-wine: #850035;
  --rg-gold: #c4973a;
  --rg-gold-light: #d4a84c;
  --rg-gold-ink: #845a0f;
  --rg-cellar: #2a0e18;
  --rg-cream: #f5efe3;
  --rg-serif: "Cormorant Garamond", "Iowan Old Style", Baskerville, Georgia, serif;
  --rg-sans: "Josefin Sans", "Avenir Next", "Helvetica Neue", Arial, sans-serif;
  --rg-ease: cubic-bezier(0.16, 1, 0.3, 1);
  --rg-gut: clamp(1rem, 4vw, 3rem);
  background: var(--rg-sheet);
  color: var(--rg-reading);
}
.rg-page::before { display: none; }
.rg-page .top { position: relative; background: var(--rg-sheet); border-bottom: 1px solid var(--rg-hair); }
.rg-page main.wrap { width: 100%; max-width: none; margin: 0; padding: 0; overflow-wrap: break-word; }
.rg-page .rg-wrap { width: 100%; max-width: calc(78rem + 2 * var(--rg-gut)); margin-inline: auto; padding-inline: var(--rg-gut); }
.rg-page h1, .rg-page h2, .rg-page h3, .rg-page h4 { color: var(--rg-ink); font-family: var(--rg-serif); font-weight: 500; text-wrap: balance; }
.rg-page a { color: var(--rg-wine); text-decoration-thickness: 1px; text-underline-offset: .18em; }
.rg-page p { text-wrap: pretty; }

/* Grid cells shrink with enlarged text instead of widening the page. */
.rg-opening > *, .rg-glance__item, .rg-head > *, .rg-split > *, .rg-grape, .rg-area > *, .rg-compare article, .rg-spread > *, .rg-spread dl > div, .rg-label, .rg-anatomy figure, .rg-timeline li, .rg-steps li, .rg-next a { min-width: 0; overflow-wrap: break-word; }
/* Long single words (Montepulciano, Understand) may break rather than overflow. */
.rg-page .rg-label h4, .rg-page .rg-area h3, .rg-page .rg-compare h3, .rg-page .rg-grape h3, .rg-page .rg-next strong, .rg-next__mark, .rg-page .rg-head h2 { overflow-wrap: anywhere; }
.rg-opening__aside, .rg-glance__item, .rg-head--photo > div, .rg-split__text, .rg-grape, .rg-area__body, .rg-compare article, .rg-spread__text, .rg-spread dl > div, .rg-label, .rg-timeline li, .rg-steps li { grid-template-columns: minmax(0, 1fr); }

/* Opening photograph */
.rg-cover { position: relative; display: grid; align-content: end; min-height: clamp(26rem, 74svh, 48rem); overflow: hidden; isolation: isolate; background: var(--rg-cellar); color: #fff; }
.rg-cover__img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: 50% 60%; animation: rg-settle 2.2s var(--rg-ease) both; }
@keyframes rg-settle { from { transform: scale(1.05); } to { transform: none; } }
.rg-cover::after { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgb(20 8 12 / 45%) 0%, rgb(20 8 12 / 0%) 26%, rgb(20 8 12 / 0%) 50%, rgb(20 8 12 / 82%) 100%); content: ""; }
.rg-cover__title { display: grid; gap: 1rem; width: 100%; max-width: calc(78rem + 2 * var(--rg-gut)); margin-inline: auto; padding: 0 var(--rg-gut) clamp(2.5rem, 6vw, 4.5rem); }
.rg-page .rg-cover .place-breadcrumbs { margin: 0; color: rgb(255 255 255 / 82%); font: 600 .72rem/1.4 var(--rg-sans); letter-spacing: .16em; text-shadow: 0 1px 8px rgb(0 0 0 / 35%); }
.rg-page .rg-cover .place-breadcrumbs a { color: inherit; text-decoration: none; }
.rg-page .rg-cover .place-breadcrumbs a:hover { text-decoration: underline; }
.rg-page .rg-cover .place-breadcrumbs span[aria-hidden] { color: rgb(255 255 255 / 55%); }
.rg-page .rg-cover h1 { margin: 0; color: #fff; font-size: clamp(3.6rem, 13vw, 6rem); line-height: .85; letter-spacing: -.04em; overflow-wrap: anywhere; }
.rg-cover__sub { margin: 0; color: rgb(255 255 255 / 82%); font: italic 400 1.2rem/1.2 var(--rg-serif); }
.rg-cover__credit { position: absolute; right: var(--rg-gut); bottom: .9rem; color: rgb(255 255 255 / 70%); font: 400 .7rem/1.2 var(--rg-sans); }
.rg-cover--plain { min-height: 0; padding-top: clamp(4rem, 9vw, 7rem); background: var(--rg-burgundy); }
.rg-cover--plain::after { display: none; }
.rg-cover--plain .rg-cover__sub { color: var(--rg-gold-light); font-style: normal; font: 600 .74rem/1.3 var(--rg-sans); letter-spacing: .16em; text-transform: uppercase; }

/* Drawn cover: the place on its region's map, for guides without a photograph */
.rg-cover--map { min-height: 0; padding-top: clamp(3rem, 7vw, 5rem); background: var(--rg-burgundy); }
.rg-cover--map::after { display: none; }
.rg-cover--map { grid-template-columns: minmax(0, 1fr); }
.rg-cover__map { position: absolute; top: 1.5rem; right: max(var(--rg-gut), calc((100% - 78rem) / 2)); bottom: 1.5rem; z-index: -1; display: flex; align-items: center; justify-content: flex-end; width: min(42%, 30rem); }
.rg-mini.rg-mini--cover { width: auto; max-width: 100%; height: 100%; max-height: 22rem; }
.rg-mini.rg-mini--cover .rg-outline { fill: rgb(245 239 227 / 5%); stroke: rgb(245 239 227 / 55%); stroke-width: 1.2; stroke-opacity: 1; }
.rg-mini.rg-mini--cover .rg-zone use { fill: rgb(245 239 227 / 10%); stroke: rgb(245 239 227 / 28%); }
.rg-mini.rg-mini--cover .rg-zone.is-on use { fill: var(--rg-gold-light); stroke: var(--rg-gold-light); }
.rg-mini.rg-mini--cover .rg-pin { fill: var(--rg-gold-light); stroke: var(--rg-burgundy); stroke-width: 2; }
.rg-cover--map .rg-cover__sub, .rg-cover--plain .rg-cover__sub { color: var(--rg-gold-light); font: 600 .74rem/1.3 var(--rg-sans); letter-spacing: .16em; text-transform: uppercase; }
.rg-cover--map .rg-cover__title { padding-bottom: clamp(2.5rem, 6vw, 4rem); }
.rg-cover--map h1 { max-width: 55%; }

/* Introduction */
.rg-opening { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: clamp(2rem, 6vw, 6rem); padding-block: clamp(3rem, 7vw, 5.5rem); }
.rg-page .rg-opening .dek { margin: 0; color: var(--rg-ink); font-size: clamp(1.45rem, 2.6vw, 2.1rem); line-height: 1.35; }
.rg-byline { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem 1.2rem; margin-top: 1.6rem; }
.rg-meta { color: var(--rg-muted); font: 400 .84rem/1.45 var(--rg-sans); }
.rg-page .rg-byline .identity-save { margin: 0; border-color: var(--rg-line); color: var(--rg-burgundy); font-family: var(--rg-sans); }
.rg-page .rg-byline .identity-save[aria-pressed="true"] { background: var(--rg-stone); border-color: var(--rg-burgundy); }
.rg-opening__aside { display: grid; gap: 1.4rem; align-content: start; min-width: 0; }
.rg-page .rg-opening .content-locator { min-height: 0; background: var(--rg-stone); border-color: var(--rg-hair); }
.rg-page .rg-opening .content-locator__map { background: #ece4e0; border-color: var(--rg-hair); }
.rg-page .rg-opening .identity-strip { grid-template-columns: minmax(0, 1fr); max-width: none; margin: 0; border: 0; border-top: 1px solid var(--rg-ink); }
.rg-page .rg-opening .identity-strip div { padding: .9rem 0; border: 0; border-bottom: 1px solid var(--rg-hair); background: none; }
.rg-page .rg-opening .identity-strip dt { color: var(--rg-muted); font: 600 .66rem/1.3 var(--rg-sans); letter-spacing: .14em; }
.rg-page .rg-opening .identity-strip dd { margin-top: .3rem; color: var(--rg-ink); font-size: 1.2rem; line-height: 1.3; }

/* At a glance */
.rg-glance { padding-block: clamp(3rem, 6vw, 4.5rem) clamp(3.5rem, 7vw, 5rem); background: var(--rg-burgundy); color: var(--rg-cream); }
.rg-page .rg-glance__title { margin: 0 0 1.2rem; color: var(--rg-gold-light); font: 600 .74rem/1.3 var(--rg-sans); letter-spacing: .16em; text-transform: uppercase; }
.rg-glance__grid { display: grid; grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr)); gap: 1px; margin: 0; border-block: 1px solid rgb(245 239 227 / 70%); background: rgb(245 239 227 / 16%); }
.rg-glance__item { display: grid; grid-column: span var(--span, 1); gap: .4rem; align-content: start; padding: 1.3rem 1.2rem 1.4rem; background: var(--rg-burgundy); }

.rg-glance__grid dt { color: rgb(245 239 227 / 72%); font: 600 .68rem/1.2 var(--rg-sans); letter-spacing: .14em; text-transform: uppercase; }
.rg-glance__grid dd { margin: 0; color: #fff; font: 500 1.3rem/1.25 var(--rg-serif); }
.rg-glance__grid dd small { display: block; margin-top: .35rem; color: rgb(245 239 227 / 72%); font: italic 400 1rem/1.35 var(--rg-serif); }
.rg-glance__item--figure dd { font-size: clamp(1.6rem, 2.4vw, 2.1rem); line-height: 1.05; }
.rg-icon { width: 1.9rem; height: 1.9rem; margin-bottom: .3rem; fill: none; stroke: var(--rg-gold-light); stroke-width: 1.2; stroke-linecap: round; stroke-linejoin: round; }

/* Section navigation */
.rg-nav { position: sticky; top: 0; z-index: 20; border-bottom: 1px solid var(--rg-hair); background: rgb(255 255 255 / 95%); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.rg-nav .rg-wrap { display: flex; gap: .2rem 1.8rem; overflow-x: auto; scrollbar-width: none; }
.rg-nav .rg-wrap::-webkit-scrollbar { display: none; }
.rg-page .rg-nav a { flex: none; padding: .95rem 0 .85rem; border-bottom: 1.5px solid transparent; color: var(--rg-muted); font: 400 1.05rem/1.2 var(--rg-serif); text-decoration: none; transition: color 200ms var(--rg-ease), border-color 200ms var(--rg-ease); }
.rg-page .rg-nav a:hover { color: var(--rg-ink); }
.rg-page .rg-nav a[aria-current="true"] { border-bottom-color: var(--rg-wine); color: var(--rg-ink); }
.rg-page [id^="guide-"], .rg-page .rg-chapter[id], .rg-page .rg-band[id] { scroll-margin-top: 3.6rem; }

/* Chapters */
.rg-page .rg-story { max-width: none; margin: 0; padding: 0; }
.rg-page .rg-story > section, .rg-page .rg-story > div { max-width: none; }
.rg-page .rg-chapter { display: block; margin: 0; padding-block: clamp(4rem, 9vw, 7rem); border: 0; background: none; }
.rg-page .rg-story > .rg-chapter + .rg-chapter { border-top: 1px solid var(--rg-hair); }
.rg-page .rg-band .rg-chapter { border: 0; }
.rg-band--stone { background: var(--rg-stone); }
.rg-band--champagne { background: var(--rg-champagne); }
.rg-page .rg-story .place-guide-section, .rg-page .rg-story .place-guide-reference { grid-template-columns: none; max-width: none; border-inline: 0; background: none; }
.rg-page .rg-band.place-guide-section, .rg-page .rg-band.place-guide-reference { display: block; padding: 0; border: 0; }
.rg-band--champagne.place-guide-reference { background: var(--rg-champagne) !important; }

.rg-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(1.2rem, 6vw, 6rem); align-items: end; margin-bottom: clamp(2rem, 5vw, 3.5rem); }
.rg-head:has(> h2:only-child) { grid-template-columns: minmax(0, 1fr); }
.rg-page .rg-head h2 { max-width: 18ch; margin: 0; font-size: clamp(2.4rem, 5.4vw, 4.6rem); line-height: .95; letter-spacing: -.03em; }
.rg-head > p { max-width: 30rem; margin: 0; color: var(--rg-muted); font-size: 1.3rem; line-height: 1.5; }
.rg-head--photo { align-items: center; }
.rg-head--photo > div { display: grid; gap: 1.2rem; }
.rg-cols { columns: 2 22rem; column-gap: clamp(2rem, 5vw, 4rem); }
.rg-page .rg-cols p { max-width: none; margin: 0 0 1.1rem; font-size: 1.22rem; line-height: 1.7; break-inside: avoid-column; }
.rg-page .rg-cols p:first-child { color: var(--rg-ink); font-size: 1.42rem; line-height: 1.55; }
.rg-page .rg-cols p:first-child::first-letter { float: none; margin: 0; color: inherit; font-size: inherit; line-height: inherit; }
.rg-lede { max-width: 46rem; }
.rg-page .rg-lede p { margin: 0 0 1.1rem; color: var(--rg-ink); font-size: 1.42rem; line-height: 1.6; }
.rg-page .rg-lede p::first-letter { float: none; margin: 0; color: inherit; font-size: inherit; line-height: inherit; }
.rg-cols--after { margin-top: clamp(2.5rem, 5vw, 3.5rem); }
.rg-sub { margin-top: clamp(3rem, 6vw, 4.5rem); }
.rg-page .rg-sub > h3 { max-width: 40rem; margin: 0 0 1.4rem; font-size: clamp(1.8rem, 3vw, 2.4rem); line-height: 1.05; }
.rg-note { margin: 1.2rem 0 0; color: var(--rg-muted); font: 400 .8rem/1.45 var(--rg-sans); }
.rg-page .rg-more { display: inline-flex; align-items: center; gap: .4rem; margin-top: 2rem; font: 600 .74rem/1 var(--rg-sans); letter-spacing: .12em; text-decoration: none; text-transform: uppercase; }

/* Photographs */
.rg-photo { position: relative; margin: 0; overflow: hidden; background: var(--rg-stone); }
.rg-photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.rg-photo figcaption { position: absolute; inset: auto 0 0; padding: 2.2rem 1rem .7rem; background: linear-gradient(transparent, rgb(20 8 12 / 55%)); color: rgb(255 255 255 / 90%); font: 400 .72rem/1.3 var(--rg-sans); }
.rg-photo--wide { aspect-ratio: 21 / 9; margin-bottom: clamp(2.5rem, 5vw, 3.5rem); }
.rg-photo--short { aspect-ratio: 24 / 7; }
.rg-photo--tall { aspect-ratio: 4 / 5; }
.rg-photo--head { aspect-ratio: 4 / 3; }
.rg-split { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
.rg-split--rev { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); }
.rg-split__text { display: grid; gap: 1.2rem; }
.rg-single { max-width: 46rem; }
.rg-page .rg-split__text p { margin: 0; font-size: 1.24rem; line-height: 1.7; }
.rg-page .rg-split__text p:first-child { color: var(--rg-ink); font-size: 1.42rem; line-height: 1.55; }

/* Ink drawings, in the Learn house style */
.rg-page .wine-illustration { display: block; fill: none; stroke: var(--illustration-ink, #6b243b); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; overflow: visible; }
.viz { display: block; width: 100%; height: auto; overflow: visible; }
.viz .ink { fill: none; stroke: var(--v-ink, #6b243b); stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }
.viz .v-ridge { stroke-width: 1.6; }
.viz .v-base, .viz .v-tick { stroke: var(--v-rule, #b6a68d); stroke-width: 1; }
.viz .v-hatch { stroke: var(--v-ink, #6b243b); stroke-width: .9; opacity: .22; }
.viz .v-ground, .viz .v-zone { stroke: none; }
.viz .v-knockout { fill: var(--v-paper, #fff); }
.viz .v-vine { stroke-width: 1.1; }
.viz .v-leaf, .viz .v-dot { fill: var(--v-gold, #a67a21); }
.viz .v-lead { stroke: var(--v-rule, #b6a68d); stroke-width: .9; stroke-dasharray: 2 3; }
.viz .v-water { stroke: #5f7a88; stroke-width: 1.1; }
.viz .v-water-t { fill: #4f6b79; }
.viz .v-fog { stroke: var(--v-fog, #9aa7ae); stroke-width: 1.1; opacity: .85; }
.viz .v-callout { stroke-width: 1; }
.viz .v-label { fill: #fffdf9; stroke: var(--v-ink, #6b243b); stroke-width: 1.1; }
.viz .v-label-in { stroke-width: .7; opacity: .6; }
.viz .v-orn { stroke: var(--v-gold, #a67a21); stroke-width: 1; }
.viz .v-serif { font: italic 400 17px var(--rg-serif); fill: var(--v-text, #463231); }
.viz .v-caps { font: 600 11px var(--rg-sans); letter-spacing: .2em; text-transform: uppercase; fill: var(--v-strong, #1f0e12); }
.viz .v-dim { fill: var(--v-rule, #b6a68d); }
.viz .v-role { fill: var(--v-gold-text, #845a0f); }
.viz .v-name { font: 500 22px var(--rg-serif); fill: #1f0e12; letter-spacing: .02em; }
.viz .v-mini { font: 400 11px var(--rg-sans); letter-spacing: .06em; fill: var(--v-text, #463231); }
.viz .v-air { stroke: var(--v-rule, #b6a68d); stroke-width: 1.2; }
.viz .v-sea { stroke: #5f7a88; }
.viz .v-pat { fill: none; stroke: var(--v-ink, #6b243b); stroke-width: .8; opacity: .5; }
.viz .v-pat-fill { fill: var(--v-ink, #6b243b); opacity: .5; }
.viz.will-draw .ink { stroke-dasharray: var(--len); stroke-dashoffset: var(--len); transition: stroke-dashoffset 1.8s cubic-bezier(.65, 0, .35, 1); }
.viz.will-draw .v-lead { stroke-dasharray: var(--len); }
.viz.will-draw text, .viz.will-draw .v-dot, .viz.will-draw .v-leaf, .viz.will-draw .v-ground, .viz.will-draw .v-zone { opacity: 0; transition: opacity 900ms var(--rg-ease) 900ms; }
.viz.will-draw.drawn .ink { stroke-dashoffset: 0; }
.viz.will-draw.drawn text, .viz.will-draw.drawn .v-dot, .viz.will-draw.drawn .v-leaf, .viz.will-draw.drawn .v-ground, .viz.will-draw.drawn .v-zone { opacity: 1; }
.viz.will-draw.drawn .v-lead { stroke-dasharray: 2 3; transition-delay: 1.2s; }

.rg-figure { margin: clamp(3rem, 6vw, 4.5rem) 0 0; }
.rg-figure figcaption { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem 2rem; margin-top: 1rem; color: var(--rg-muted); font: 400 .84rem/1.45 var(--rg-sans); }
.rg-figure figcaption b { color: var(--rg-ink); font: 500 1.35rem/1.2 var(--rg-serif); }
.rg-figure figcaption span { max-width: 40rem; }
.rg-figure__scroll { overflow-x: auto; }
.rg-figure__scroll:focus-visible { outline: 2px solid var(--rg-wine); outline-offset: 4px; }
.rg-figure__scroll .viz { min-width: 46rem; }
.rg-figure__hint { display: none; margin: 0 0 .6rem; color: var(--rg-muted); font: 400 .8rem/1.4 var(--rg-sans); }

/* Small maps */
.rg-mini { display: block; width: 100%; max-width: 100%; height: auto; overflow: visible; }
.rg-mini .rg-outline { fill: #fff; stroke: var(--rg-ink); stroke-width: 1; stroke-opacity: .35; }
.rg-mini .rg-zone use { fill: #e3d6d9; stroke: #b28c93; stroke-width: .6; }
.rg-mini .rg-zone.is-on use { fill: var(--rg-wine); stroke: var(--rg-burgundy); }
.rg-mini--dark .rg-outline { fill: rgb(245 239 227 / 6%); stroke: rgb(245 239 227 / 70%); stroke-width: 2.4; stroke-opacity: 1; }
.rg-mini--dark .rg-zone use { fill: rgb(245 239 227 / 12%); stroke: rgb(245 239 227 / 35%); }
.rg-mini--dark .rg-zone.is-on use { fill: var(--rg-gold-light); stroke: var(--rg-gold-light); }
.rg-mini .rg-pin { fill: var(--rg-wine); stroke: #fff; stroke-width: 1.5; }
.rg-area__nomap { display: block; }
.rg-mini--card .rg-zone.is-on use { fill: #b8a0a6; stroke: none; }

/* History */
.rg-timeline { position: relative; display: grid; grid-auto-columns: minmax(0, 1fr); grid-auto-flow: column; margin: 0 0 clamp(3rem, 6vw, 4.5rem); padding: 0; list-style: none; }
.rg-timeline::before { position: absolute; top: 3.15rem; right: 0; left: 0; height: 1px; background: var(--rg-ink); opacity: .4; content: ""; }
.rg-timeline li { position: relative; display: grid; gap: 1.6rem; padding-right: 1rem; }
.rg-timeline li::before { position: absolute; top: calc(3.15rem - 5px); left: 0; width: 9px; height: 9px; border-radius: 50%; background: var(--rg-gold); box-shadow: 0 0 0 3px var(--rg-stone); content: ""; }
.rg-timeline b { display: flex; align-items: end; height: 2.3rem; color: var(--rg-ink); font: 500 clamp(1.6rem, 2.6vw, 2.3rem)/1 var(--rg-serif); }
.rg-timeline span { color: var(--rg-reading); font-size: 1.08rem; line-height: 1.4; }

/* Grapes */
.rg-page .rg-grapes__group { margin: 2.4rem 0 .9rem; color: var(--rg-gold-ink); font: 600 .72rem/1 var(--rg-sans); letter-spacing: .16em; text-transform: uppercase; }
.rg-page .rg-head + .rg-grapes__group { margin-top: 0; }
.rg-grapes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--rg-hair); border-left: 1px solid var(--rg-hair); }
.rg-grapes--1 { grid-template-columns: minmax(0, 1fr); }
.rg-grapes--2, .rg-grapes--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 981px) { .rg-grapes--4, .rg-grapes--8 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.rg-grape { display: grid; gap: .45rem; align-content: start; padding: 1.4rem; border-right: 1px solid var(--rg-hair); border-bottom: 1px solid var(--rg-hair); background: var(--rg-sheet); }
.rg-grape .rg-mini { width: 5.2rem; margin-bottom: .5rem; }
.rg-page .rg-grape h3 { margin: 0; font-size: 2.1rem; line-height: 1; }
.rg-grape__where { margin: 0; color: var(--rg-muted); font-size: 1.05rem; font-style: italic; line-height: 1.35; }
.rg-look { margin: 0; color: var(--rg-ink); font-size: 1.05rem; line-height: 1.45; }
.rg-look span { display: block; margin-bottom: .3rem; color: var(--rg-muted); font: 600 .64rem/1 var(--rg-sans); letter-spacing: .14em; text-transform: uppercase; }

/* Areas */
.rg-areas { display: grid; border-top: 1px solid var(--rg-ink); }
.rg-area { display: grid; grid-template-columns: 7rem minmax(0, 1fr) auto; gap: clamp(1rem, 3vw, 2.5rem); align-items: start; padding-block: 1.6rem; border-bottom: 1px solid var(--rg-hair); }
.rg-area__body { display: grid; gap: .45rem; max-width: 46rem; }
.rg-page .rg-area h3 { margin: 0; font-size: clamp(1.8rem, 3vw, 2.3rem); line-height: 1; }
.rg-page .rg-area h3 a { color: var(--rg-ink); text-decoration: none; }
.rg-page .rg-area h3 a:hover { color: var(--rg-wine); }
.rg-page .rg-area p { margin: 0; font-size: 1.1rem; line-height: 1.5; }
.rg-page .rg-area .rg-area__where { color: var(--rg-muted); font-style: italic; }
.rg-page .rg-area__count { display: inline-flex; align-items: center; gap: .35rem; padding-top: .6rem; color: var(--rg-muted); font: 400 .84rem/1 var(--rg-sans); font-variant-numeric: tabular-nums; text-decoration: none; white-space: nowrap; }
.rg-page .rg-area__count:hover { color: var(--rg-wine); }

/* A comparison that is not a list of the region's own areas */
.rg-compare { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr)); border-top: 1px solid var(--rg-hair); border-left: 1px solid var(--rg-hair); }
.rg-compare article { display: grid; gap: .45rem; align-content: start; padding: 1.4rem; border-right: 1px solid var(--rg-hair); border-bottom: 1px solid var(--rg-hair); }
.rg-page .rg-compare h3 { margin: 0; font-size: 1.9rem; line-height: 1; }
.rg-page .rg-compare h3 a { color: var(--rg-ink); text-decoration: none; }
.rg-page .rg-compare h3 a:hover { color: var(--rg-wine); }
.rg-page .rg-compare p { margin: 0; font-size: 1.08rem; line-height: 1.5; }
.rg-page .rg-compare .rg-area__where { color: var(--rg-muted); font-style: italic; }

/* Signature spread */
.rg-spread { --v-ink: #f5efe3; --v-rule: rgb(245 239 227 / 35%); --v-text: rgb(245 239 227 / 80%); --v-strong: #f5efe3; --v-gold: #d4a84c; --v-fog: rgb(245 239 227 / 55%); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); background: var(--rg-cellar); color: rgb(245 239 227 / 88%); }
.rg-spread .wine-illustration { --illustration-ink: #f5efe3; --illustration-paper: transparent; --illustration-rule: rgb(245 239 227 / 35%); --illustration-wood: rgb(212 168 76 / 20%); }
.rg-spread > .rg-spread__photo { position: relative; min-height: 28rem; margin: 0; }
.rg-spread > .rg-spread__photo img { position: absolute; inset: 0; }
.rg-spread__text { display: grid; gap: 1.6rem; align-content: center; padding: clamp(2rem, 5vw, 4rem); }
.rg-page .rg-spread h3 { margin: 0; color: var(--rg-cream); font-size: clamp(2rem, 3.6vw, 3rem); line-height: 1; }
.rg-page .rg-spread__text > p { margin: 0; font-size: 1.2rem; line-height: 1.55; }
.rg-spread dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.4rem 2rem; margin: 0; }
.rg-spread dl > div { display: grid; gap: .4rem; align-content: start; }
.rg-spread dt { color: var(--rg-cream); font: 500 1.25rem/1.15 var(--rg-serif); }
.rg-spread dd { margin: 0; font-size: 1.05rem; line-height: 1.5; }
.rg-spread__art { display: flex; align-items: end; height: 6.6rem; margin-bottom: .4rem; }
.rg-spread__art > svg.viz { width: auto; max-width: 100%; height: 6.6rem; aspect-ratio: 2 / 1; }
.rg-spread__art > .rg-mini { width: auto; height: 6.6rem; }
.rg-spread__art .viz-pair { display: flex; flex-wrap: wrap; gap: .8rem; max-width: 100%; max-height: 6.6rem; }
.rg-spread__art .viz-pair figure { display: grid; justify-items: center; gap: .2rem; margin: 0; }
.rg-spread__art .viz-pair .wine-illustration { width: min(5.6rem, 22vw); height: auto; }
.rg-spread__art .viz-pair figcaption { color: rgb(245 239 227 / 70%); font: 600 .62rem/1 var(--rg-sans); letter-spacing: .14em; text-transform: uppercase; }

/* A sequence without a photograph: reviewed illustrations or plain steps */
.rg-sequence { padding: clamp(1.5rem, 4vw, 3rem); background: var(--rg-stone); }
.rg-page .rg-sequence > h3 { max-width: 40rem; margin: 0; font-size: clamp(1.8rem, 3vw, 2.4rem); line-height: 1.05; }
.rg-page .rg-sequence__intro { max-width: 44rem; margin: .8rem 0 0; color: var(--rg-muted); font-size: 1.2rem; line-height: 1.5; }
.rg-sequence > ol { margin-top: clamp(1.5rem, 3vw, 2.2rem); }
.rg-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(14rem, 100%), 1fr)); gap: 1.4rem 2rem; padding: 0; list-style: none; counter-reset: rg-step; }
.rg-steps li { display: grid; gap: .4rem; align-content: start; padding-top: 1rem; border-top: 1px solid var(--rg-ink); counter-increment: rg-step; }
.rg-steps li::before { color: var(--rg-gold-ink); font: 600 .7rem/1 var(--rg-sans); letter-spacing: .14em; content: counter(rg-step, decimal-leading-zero); }
.rg-page .rg-steps h4 { margin: 0; font-size: 1.4rem; line-height: 1.15; }
.rg-page .rg-steps p { margin: 0; font-size: 1.08rem; line-height: 1.5; }

/* Reading the label */
.rg-anatomy { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 3vw, 2.5rem); margin-top: clamp(2.5rem, 5vw, 3.5rem); }
.rg-anatomy figure { display: grid; justify-items: center; gap: .6rem; margin: 0; }
.rg-anatomy figcaption { color: var(--rg-ink); font: 500 1.15rem/1.3 var(--rg-serif); text-align: center; }
.rg-page .rg-labels__title { margin: clamp(3rem, 6vw, 4rem) 0 1.4rem; font-size: clamp(1.8rem, 3vw, 2.4rem); }
.rg-labels { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2.5vw, 2rem); }
.rg-label { position: relative; display: grid; gap: .6rem; justify-items: center; align-content: start; padding: 2rem 1.6rem 1.6rem; background: #fffdf9; box-shadow: 0 1px 0 rgb(0 0 0 / 4%), 0 18px 40px -24px rgb(42 14 24 / 45%); text-align: center; }
.rg-label__region { margin-bottom: .5rem; color: var(--rg-muted); font: 600 .62rem/1 var(--rg-sans); letter-spacing: .32em; text-transform: uppercase; }
.rg-page .rg-label h4 { margin: 0; font-size: clamp(1.9rem, 2.6vw, 2.4rem); line-height: 1; }
.rg-label__rule { width: 3rem; height: 1px; background: currentColor; opacity: .4; }
.rg-page .rg-label__what { max-width: 16rem; margin: 0; color: var(--rg-ink); font-size: 1.08rem; line-height: 1.4; }
.rg-page .rg-label__more { max-width: 16rem; margin: 0; color: var(--rg-muted); font: italic 400 1rem/1.4 var(--rg-serif); }
.rg-label__tag { color: var(--rg-muted); font: 600 .62rem/1 var(--rg-sans); letter-spacing: .14em; text-transform: uppercase; }
.rg-label--s1 { border: 1px solid var(--rg-ink); outline: 1px solid var(--rg-ink); outline-offset: -7px; }
.rg-page .rg-label--s1 h4 { font-variant: small-caps; letter-spacing: .06em; }
.rg-label--s2 { padding-top: 2.6rem; border: 1px solid var(--rg-line); border-radius: 50% 50% 0 0 / 22% 22% 0 0; }
.rg-page .rg-label--s2 h4 { font-style: italic; }
.rg-label--s3 { justify-items: start; border: 1px solid var(--rg-line); text-align: left; }
.rg-page .rg-label--s3 h4 { font-size: clamp(1.4rem, 2vw, 1.8rem); letter-spacing: .18em; text-transform: uppercase; }

/* Producers, connections, next, sources */
.rg-page .producer-profiles { margin: 0; }
.rg-page .producer-profiles > h2 { margin: 0 0 .8rem; font-size: clamp(2.4rem, 5.4vw, 4.6rem); line-height: .95; letter-spacing: -.03em; }
.rg-page .producer-profiles > .kicker { color: var(--rg-gold-ink); font-family: var(--rg-sans); }
.rg-page .producer-profiles > p:not(.kicker) { margin: 0 0 1.6rem; color: var(--rg-muted); font-size: 1.2rem; }
.rg-page .producer-profiles .directory { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 clamp(1.5rem, 3vw, 2.5rem); margin: 0; border-top: 1px solid var(--rg-ink); }
.rg-page .producer-profiles .directory li { display: grid; grid-template-columns: minmax(0, 1fr); gap: .4rem; align-content: start; padding: 1.3rem 0 1.5rem; border-bottom: 1px solid var(--rg-hair); }
.rg-page .producer-profiles .directory a { color: var(--rg-ink); font: 500 1.55rem/1.1 var(--rg-serif); text-decoration: none; }
.rg-page .producer-profiles .directory a:hover { color: var(--rg-wine); }
.rg-page .producer-profiles .directory-summary { display: block; color: var(--rg-reading); font-size: 1.05rem; line-height: 1.5; }
.rg-page .producer-profiles .directory-more { margin-top: 1.4rem; }
.rg-page .producer-profiles .directory-more summary { color: var(--rg-wine); font-family: var(--rg-sans); }
.rg-page .producer-profiles .directory-more .directory { border-top: 0; }
.rg-page .wine-connections { max-width: none; margin: clamp(3rem, 6vw, 5rem) 0 0; border-color: var(--rg-hair); background: var(--rg-stone); }
.rg-page .wine-connections article { background: var(--rg-sheet); }
.rg-page .continuity-next { margin-top: clamp(4rem, 8vw, 6rem); padding-top: 0; border: 0; }
.rg-page .continuity-next header { display: block; margin-bottom: 1.6rem; }
.rg-page .continuity-next h2 { margin: 0; font-size: clamp(2.4rem, 5vw, 4rem); line-height: .95; }
.rg-page .continuity-next > .rg-next { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr)); gap: clamp(1rem, 2.5vw, 2rem); margin: 0; border: 0; }
.rg-page .continuity-next .rg-next a { display: flex; min-height: 0; flex-direction: column; gap: .4rem; padding: 0 0 1.4rem; border: 1px solid var(--rg-hair); background: var(--rg-sheet); color: inherit; text-decoration: none; }
.rg-page .continuity-next .rg-next a::after { display: none; }
.rg-page .continuity-next .rg-next a > span.rg-next__media { display: grid; width: 100%; align-self: stretch; place-items: center; aspect-ratio: 4 / 3; margin-bottom: .9rem; overflow: hidden; background: var(--rg-stone); }
.rg-next__media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: filter 300ms var(--rg-ease); }
.rg-next__media .rg-mini { width: 62%; }
.rg-next a:hover .rg-next__media img { filter: brightness(.92); }
.rg-next__mark .rg-icon { width: 3.2rem; height: 3.2rem; margin: 0; stroke: var(--rg-gold-ink); stroke-width: 1; }
.rg-page .continuity-next .rg-next a > span.rg-next__type { padding-inline: 1.3rem; color: var(--rg-gold-ink); font: 600 .66rem/1.3 var(--rg-sans); letter-spacing: .14em; text-transform: uppercase; }
.rg-page .continuity-next .rg-next a > strong { max-width: none; padding-inline: 1.3rem; color: var(--rg-ink); font: 500 1.6rem/1.1 var(--rg-serif); }
.rg-page .continuity-next .rg-next a:hover > strong { color: var(--rg-wine); }
.rg-page .continuity-next .rg-next a > small { padding-inline: 1.3rem; color: var(--rg-muted); font-size: 1.05rem; line-height: 1.45; }
.rg-page .rg-sources .place-sources { max-width: none; margin-top: clamp(3rem, 6vw, 4rem); border-color: var(--rg-hair); }
.rg-page .rg-sources .place-sources summary span { font-family: var(--rg-serif); }
.rg-sources-extra { grid-column: 1 / -1; }
.rg-page .rg-sources-extra h3 { margin: 0 0 .6rem; color: var(--rg-ink); font: 600 .7rem/1.3 var(--rg-sans); letter-spacing: .14em; text-transform: uppercase; }
.rg-page .coverage-note { margin: clamp(2rem, 4vw, 3rem) 0 0; border-color: var(--rg-hair); background: var(--rg-stone); }
.rg-page .rg-fallback > :first-child { margin-top: 0; }
.rg-page .rg-fallback > p { max-width: 44rem; font-size: 1.22rem; line-height: 1.7; }
.rg-page .rg-fallback > p:first-child { color: var(--rg-ink); font-size: 1.42rem; line-height: 1.55; }
.rg-page .rg-fallback > p:first-child::first-letter { float: none; margin: 0; color: inherit; font-size: inherit; line-height: inherit; }
.rg-page .footer.rg-wrap { margin-top: clamp(3rem, 6vw, 5rem); padding-block: 2rem 4rem; border-top: 0; }

/* Real subregion boundaries on the small maps */
.rg-mini .rg-zone--shape { fill: #e3d6d9; stroke: #fff; stroke-width: .8; }
.rg-mini .rg-zone--shape.is-on { fill: var(--rg-wine); }
.rg-mini--dark .rg-zone--shape { fill: rgb(245 239 227 / 12%); stroke: rgb(245 239 227 / 30%); }
.rg-mini--dark .rg-zone--shape.is-on { fill: var(--rg-gold-light); }
.rg-mini.rg-mini--cover .rg-zone--shape { fill: rgb(245 239 227 / 10%); stroke: rgb(245 239 227 / 35%); }
.rg-mini.rg-mini--cover .rg-zone--shape.is-on { fill: var(--rg-gold-light); stroke: var(--rg-gold-light); }
.rg-mini--card .rg-zone--shape.is-on { fill: #b8a0a6; }

/* The inside map of a subregion */
.ri-map { display: block; width: 100%; height: auto; overflow: hidden; }
.ri-map .ri-near { fill: #f1ebe8; stroke: #fff; stroke-width: 1.5; }
.ri-map .ri-own { fill: #ead9dd; stroke: var(--rg-wine); stroke-width: 1.2; stroke-opacity: .55; }
.ri-point circle { fill: var(--rg-ink); stroke: #fff; stroke-width: 2; }
.ri-point text { font: 600 13px var(--rg-sans); letter-spacing: .04em; fill: var(--rg-ink); paint-order: stroke; stroke: #fff; stroke-width: 4px; stroke-linejoin: round; }
.ri-point--town text { font: italic 600 17px var(--rg-serif); letter-spacing: 0; }
.ri-point--town circle { fill: #fff; stroke: var(--rg-ink); stroke-width: 2; }
.ri-point--appellation circle { fill: var(--rg-gold); }
.ri-point--appellation text { font: italic 500 16px var(--rg-serif); letter-spacing: 0; }
.ri-g0 circle { fill: var(--rg-wine); } .ri-g1 circle { fill: var(--rg-gold); } .ri-g2 circle { fill: #5f7a88; }
.ri-gx circle { fill: #b8aaa6; } .ri-gx text { fill: var(--rg-muted); font-weight: 400; }
.ri-point--town.ri-gx text { fill: var(--rg-ink); } .ri-point--town.ri-gx circle { fill: #fff; }
.zg-key.ri-g0 { background: var(--rg-wine); } .zg-key.ri-g1 { background: var(--rg-gold); } .zg-key.ri-g2 { background: #5f7a88; }
.ri-g3 circle { fill: #6b7a35; } .ri-g4 circle { fill: #b5643c; } .ri-g5 circle { fill: #6a4a7a; }
.zg-key.ri-g3 { background: #6b7a35; } .zg-key.ri-g4 { background: #b5643c; } .zg-key.ri-g5 { background: #6a4a7a; }
.zg-map { margin-top: clamp(2rem, 5vw, 3rem); }
.zg-map .rg-figure__scroll .ri-map { min-width: 34rem; }
.zg-setting { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: start; }
.zg-setting .zg-map { margin-top: 0; }
.zg-setting figcaption { flex-direction: column; gap: .3rem; }
.zg-map--auto { margin-top: 0; }
/* Long, narrow places (the Médoc, the Côte d'Or) would draw taller than the screen: cap the height and centre the map. */
.zg-map .ri-map, .zg-sides__map .zm-map, .zg-sides__map .ri-map { max-height: 86vh; width: auto; max-width: 100%; margin-inline: auto; }
.zg-legend { display: flex; flex-wrap: wrap; gap: .4rem 1.4rem; margin: .8rem 0 0; padding: 0; list-style: none; color: var(--rg-muted); font: 400 .84rem/1.4 var(--rg-sans); }
.zg-key { display: inline-block; width: .75rem; height: .75rem; margin-right: .45rem; border-radius: 50%; vertical-align: -.05em; background: var(--rg-ink); }
.zg-key--town { background: #fff; box-shadow: inset 0 0 0 2px var(--rg-ink); }
.zg-key--appellation { background: var(--rg-gold); }

/* Areas inside a place, filled by group */
.ra-map { display: block; width: 100%; height: auto; overflow: hidden; }
.ra-area { stroke: #fff; stroke-width: 1.6; stroke-linejoin: round; }
.ra-gx { fill: #e4dad6; }
.ra-g0 { fill: var(--rg-wine); fill-opacity: .82; }
.ra-g1 { fill: var(--rg-gold); fill-opacity: .85; }
.ra-river { fill: none; stroke: #6f8fa0; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.ra-river-name { font: italic 500 17px var(--rg-serif); fill: #4f6b79; paint-order: stroke; stroke: var(--rg-stone); stroke-width: 4px; }
.ra-label text { font: 600 12px var(--rg-sans); letter-spacing: .04em; fill: var(--rg-muted); }
.ra-label circle { fill: var(--rg-ink); stroke: #fff; stroke-width: 1.5; }
.ra-label--group text { font: 600 14px var(--rg-sans); letter-spacing: .06em; fill: #fff; paint-order: stroke; stroke: rgb(31 14 18 / 55%); stroke-width: 3px; stroke-linejoin: round; }
.ra-label--group circle { fill: #fff; stroke: var(--rg-ink); }
.zg-sides__map { margin: 0; }
.zg-sides__map figcaption { margin-top: .8rem; }
.zg-key.ri-g1 { background: var(--rg-gold); }

/* Maps drawn over the Atlas background */
.ra-map--base .ra-area { stroke: #fff; stroke-width: 1.4; }
.ra-map--base .ra-g0 { fill-opacity: .58; }
.ra-map--base .ra-g1 { fill-opacity: .62; }
.ra-map--base .ra-gx { fill: none; stroke: #A98A6C; stroke-width: 1; stroke-dasharray: 4 3; }
.ra-map--base .ra-river-name { stroke: #F4E9D5; }
.ra-map--base .ra-label text { fill: #7A6A58; paint-order: stroke; stroke: rgb(255 248 240 / 88%); stroke-width: 3px; stroke-linejoin: round; }
.ra-map--base .ra-label--group text { fill: #3F272A; stroke: rgb(255 248 240 / 92%); stroke-width: 4px; }
.ri-map--base .ri-own { fill: var(--rg-wine); fill-opacity: .08; stroke: var(--rg-wine); stroke-width: 1.4; stroke-opacity: .7; }
.ri-map--base .ri-point text { stroke: rgb(255 248 240 / 92%); }
.rg-page .zg-atlas { display: inline-flex; align-items: center; gap: .35rem; color: var(--rg-wine); font: 600 .7rem/1.4 var(--rg-sans); letter-spacing: .12em; text-transform: uppercase; text-decoration: none; }
.rg-page .zg-atlas:hover { text-decoration: underline; }

/* Zones, key and scale on the closer maps */
.zm-map { display: block; width: 100%; height: auto; overflow: hidden; }
.zm-fill { stroke: none; }
.zm-fill.zm-g0:not(.is-part) { fill: var(--rg-wine); fill-opacity: .3; }
.zm-fill.zm-g1:not(.is-part) { fill: var(--rg-gold); fill-opacity: .36; }
.zm-commune { fill: none; stroke: #8E7660; stroke-width: .9; stroke-dasharray: 3 3; stroke-opacity: .75; }
.zm-commune.in-zone { stroke: var(--rg-burgundy); stroke-width: 1.2; stroke-dasharray: none; stroke-opacity: .7; }

.ri-map--zones .ri-own { fill: none; stroke: #8E7660; stroke-width: 1.1; stroke-dasharray: 5 4; stroke-opacity: .8; }
.ri-zone { stroke-width: 1.8; stroke-linejoin: round; }
.ri-zone.z-barolo { stroke: var(--rg-burgundy); stroke-width: 1.1; }
.ri-zone.z-barolo:not(.is-part) { fill: var(--rg-wine); fill-opacity: .2; }
.ri-zone.z-barbaresco { stroke: #7c5a14; stroke-width: 1.1; }
.ri-zone.z-barbaresco:not(.is-part) { fill: var(--rg-gold); fill-opacity: .26; }
.ri-zone.z-dogliani { fill: #6f8fa0; fill-opacity: .2; stroke: #4f6b79; stroke-dasharray: 6 3; }
.ri-zone-name { font: italic 600 22px var(--rg-serif); letter-spacing: .02em; paint-order: stroke; stroke: rgb(255 248 240 / 92%); stroke-width: 5px; stroke-linejoin: round; }
.ri-zone-name.z-barolo { fill: var(--rg-burgundy); } .ri-zone-name.z-barbaresco { fill: #6b4c0f; } .ri-zone-name.z-dogliani { fill: #3f5866; }
.mf-key__bg, .mf-scale__bg { fill: rgb(255 250 243 / 88%); stroke: rgb(31 14 18 / 12%); }
.mf-key text, .mf-scale text { font: 600 12px var(--rg-sans); letter-spacing: .04em; fill: var(--rg-ink); }
.mf-key__swatch { stroke: rgb(31 14 18 / 25%); }
.mf-key__swatch.zm-g0:not(.is-part) { fill: var(--rg-wine); fill-opacity: .55; } .mf-key__swatch.zm-g1:not(.is-part) { fill: var(--rg-gold); fill-opacity: .65; }
.mf-key__swatch.z-barolo:not(.is-part) { fill: var(--rg-wine); fill-opacity: .4; stroke: var(--rg-burgundy); } .mf-key__swatch.z-barbaresco:not(.is-part) { fill: var(--rg-gold); fill-opacity: .5; stroke: #7c5a14; }
/* Hatch patterns: a pale wash with diagonal lines in the area's colour */
.mh-bg { fill: transparent; } .mh-line { stroke-width: 1.5; }
.mh-bg.zm-g0, .mh-bg.z-barolo { fill: var(--rg-wine); fill-opacity: .06; } .mh-line.zm-g0, .mh-line.z-barolo { stroke: var(--rg-wine); stroke-opacity: .7; }
.mh-bg.zm-g1, .mh-bg.z-barbaresco { fill: var(--rg-gold); fill-opacity: .08; } .mh-line.zm-g1, .mh-line.z-barbaresco { stroke: #9a7020; stroke-opacity: .8; }
.mh-line.zm-gx, .mh-line.z-neutral { stroke: #7a6a58; stroke-opacity: .6; }
/* Generic zone and group colours for other places: z-0…z-3 on setting maps, zm-g2…zm-g5 on side maps */
.ri-zone.z-0 { stroke: var(--rg-burgundy); stroke-width: 1.1; } .ri-zone.z-0:not(.is-part) { fill: var(--rg-wine); fill-opacity: .2; } .ri-zone-name.z-0 { fill: var(--rg-burgundy); }
.ri-zone.z-1 { stroke: #7c5a14; stroke-width: 1.1; } .ri-zone.z-1:not(.is-part) { fill: var(--rg-gold); fill-opacity: .26; } .ri-zone-name.z-1 { fill: #6b4c0f; }
.ri-zone.z-2 { stroke: #3f5866; stroke-width: 1.1; } .ri-zone.z-2:not(.is-part) { fill: #6f8fa0; fill-opacity: .24; } .ri-zone-name.z-2 { fill: #3f5866; }
.mf-key__swatch.z-0:not(.is-part) { fill: var(--rg-wine); fill-opacity: .4; stroke: var(--rg-burgundy); } .mf-key__swatch.z-1:not(.is-part) { fill: var(--rg-gold); fill-opacity: .5; stroke: #7c5a14; } .mf-key__swatch.z-2:not(.is-part) { fill: #6f8fa0; fill-opacity: .5; stroke: #3f5866; }
.zm-fill.zm-g2:not(.is-part), .mf-key__swatch.zm-g2:not(.is-part) { fill: #557a8c; fill-opacity: .4; }
.zm-fill.zm-g3:not(.is-part), .mf-key__swatch.zm-g3:not(.is-part) { fill: #6b7a35; fill-opacity: .4; }
.zm-fill.zm-g4:not(.is-part), .mf-key__swatch.zm-g4:not(.is-part) { fill: #b5643c; fill-opacity: .38; }
.zm-fill.zm-g5:not(.is-part), .mf-key__swatch.zm-g5:not(.is-part) { fill: #6a4a7a; fill-opacity: .36; }
/* Communes in the zone but in no named group */
.zm-fill.zm-gx:not(.is-part), .mf-key__swatch.zm-gx:not(.is-part) { fill: #9c8c7a; fill-opacity: .28; }
.mh-bg.z-0 { fill: var(--rg-wine); fill-opacity: .06; } .mh-line.z-0 { stroke: var(--rg-wine); stroke-opacity: .7; }
.mh-bg.z-1 { fill: var(--rg-gold); fill-opacity: .08; } .mh-line.z-1 { stroke: #9a7020; stroke-opacity: .8; }
.mh-bg.z-2, .mh-bg.zm-g2 { fill: #557a8c; fill-opacity: .08; } .mh-line.z-2, .mh-line.zm-g2 { stroke: #3f5866; stroke-opacity: .75; }
.mh-bg.zm-g3 { fill: #6b7a35; fill-opacity: .08; } .mh-line.zm-g3 { stroke: #55612a; stroke-opacity: .75; }
.mh-bg.zm-g4 { fill: #b5643c; fill-opacity: .08; } .mh-line.zm-g4 { stroke: #8f4a28; stroke-opacity: .75; }
.mh-bg.zm-g5 { fill: #6a4a7a; fill-opacity: .08; } .mh-line.zm-g5 { stroke: #573a66; stroke-opacity: .75; }
.mf-key__swatch.is-part { stroke: rgb(31 14 18 / 35%); }
.mf-key__swatch.vine { fill: #DCCB9B; stroke: #C9B27C; }
.mf-key__line { fill: none; stroke: var(--rg-burgundy); stroke-width: 2.4; }
.mf-scale path { fill: none; stroke: var(--rg-ink); stroke-width: 1.6; }
.zm-map .ra-label text { fill: #6e5d4c; paint-order: stroke; stroke: rgb(255 248 240 / 90%); stroke-width: 3.5px; stroke-linejoin: round; }
.zm-map .ra-label--group text { font-size: 15px; fill: var(--rg-ink); stroke: rgb(255 248 240 / 95%); stroke-width: 4.5px; }
.zm-map .ra-label circle { fill: #6e5d4c; stroke: #fff; stroke-width: 1.5; }
.zm-map .ra-label--group circle { fill: var(--rg-ink); }
.zm-map .ra-river-name { stroke: rgb(244 233 213 / 92%); }

/* Links up to the region guide */
.zg-up { display: flex; flex-wrap: wrap; align-items: baseline; gap: .3rem 1rem; padding-block: 1.1rem; border-bottom: 1px solid var(--rg-hair); color: var(--rg-muted); font: 400 .9rem/1.4 var(--rg-sans); }
.rg-page .zg-up p { margin: 0; }
.zg-up ul { display: flex; flex-wrap: wrap; gap: .3rem 1.1rem; margin: 0; padding: 0; list-style: none; }
.rg-page .zg-up a { color: var(--rg-wine); }

/* Side by side */
.zg-compare { display: grid; border-top: 1px solid var(--rg-ink); }
.zg-compare__row { display: grid; grid-template-columns: minmax(8rem, .7fr) repeat(var(--cols), minmax(0, 1fr)); gap: 0 clamp(1rem, 3vw, 2.5rem); padding-block: 1rem; border-bottom: 1px solid var(--rg-hair); }
.zg-compare__row--head { align-items: end; padding-block: 1.2rem .9rem; }
.rg-page .zg-compare h3 { margin: 0; font-size: clamp(1.8rem, 3vw, 2.4rem); line-height: 1; }
.rg-page .zg-compare h3 a { color: var(--rg-ink); text-decoration: none; }
.zg-compare__label { padding-top: .2rem; color: var(--rg-muted); font: 600 .68rem/1.3 var(--rg-sans); letter-spacing: .14em; text-transform: uppercase; }
.rg-page .zg-compare__row p { margin: 0; color: var(--rg-ink); font-size: 1.12rem; line-height: 1.45; }
.zg-compare__mobile { display: none; }

/* How the place divides inside */
.zg-sides { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center; }
.zg-sides__groups { display: grid; gap: 1.6rem; }
.zg-side { display: grid; gap: .4rem; padding-top: 1rem; border-top: 1px solid var(--rg-line); }
.rg-page .zg-side h3 { margin: 0; font-size: 1.7rem; line-height: 1.05; }
.rg-page .zg-side p { margin: 0; font-size: 1.12rem; line-height: 1.55; }
.rg-page .zg-side__villages { color: var(--rg-muted); font-style: italic; }
.zg-sides .ri-near { fill: #e9e1dd; stroke: var(--rg-stone); }

/* The place's own wines */
.zg-wines { display: grid; grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr)); border-top: 1px solid var(--rg-hair); border-left: 1px solid var(--rg-hair); }
.zg-wine { display: grid; gap: .4rem; align-content: start; min-width: 0; padding: 1.4rem; border-right: 1px solid var(--rg-hair); border-bottom: 1px solid var(--rg-hair); }
.rg-page .zg-wine h3 { margin: 0; font-size: 1.9rem; line-height: 1; overflow-wrap: anywhere; }
.rg-page .zg-compare__row p, .rg-page .zg-side p { overflow-wrap: anywhere; }
.rg-page .zg-wine p { margin: 0; font-size: 1.08rem; line-height: 1.5; }
.rg-page .zg-wine__kind { color: var(--rg-gold-ink); font: 600 .66rem/1.3 var(--rg-sans); letter-spacing: .14em; text-transform: uppercase; }
.rg-page .zg-wine__grape { color: var(--rg-muted); font-style: italic; }

/* Choosing by what you want */
.zg-choose { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr)); gap: clamp(1rem, 2.5vw, 2rem); }
.zg-choose article { display: grid; gap: .5rem; align-content: start; min-width: 0; padding-top: 1rem; border-top: 2px solid var(--rg-ink); }
.rg-page .zg-choose h3 { margin: 0; font-size: 1.7rem; line-height: 1.05; overflow-wrap: anywhere; }
.rg-page .zg-choose p { margin: 0; font-size: 1.1rem; line-height: 1.5; }
.rg-page .zg-choose__want { color: var(--rg-gold-ink); font: 600 .68rem/1.3 var(--rg-sans); letter-spacing: .14em; text-transform: uppercase; }

/* Producers by village */
.zg-villages { margin-top: 1.6rem; }
.zg-villages summary { min-height: 44px; cursor: pointer; color: var(--rg-wine); font: 600 .74rem/44px var(--rg-sans); letter-spacing: .12em; text-transform: uppercase; }
.zg-villages__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(14rem, 100%), 1fr)); gap: 1.4rem 2rem; margin-top: 1rem; }
.rg-page .zg-villages h3 { margin: 0 0 .5rem; font-size: 1.35rem; }
.zg-villages ul { margin: 0; padding: 0; list-style: none; }
.zg-villages li { padding: .25rem 0; border-bottom: 1px solid var(--rg-hair); font-size: 1rem; }
.rg-page .zg-villages a { color: var(--rg-ink); text-decoration: none; }
.rg-page .zg-villages a:hover { color: var(--rg-wine); }

/* Gentle settle: blocks below the fold rise a few pixels into place. Text
   is never faded, so it keeps full contrast at every moment. */
.rg-rv { transform: translateY(14px); transition: transform 800ms var(--rg-ease); }
.rg-rv.is-in { transform: none; }

@media (max-width: 980px) {
  .rg-opening, .rg-head { grid-template-columns: minmax(0, 1fr); }
  .rg-labels { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rg-anatomy { grid-template-columns: minmax(0, 1fr); max-width: 26rem; margin-inline: auto; }
  .rg-page .producer-profiles .directory { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rg-spread { grid-template-columns: minmax(0, 1fr); }
  .zg-sides { grid-template-columns: minmax(0, 1fr); }
  .zg-setting { grid-template-columns: minmax(0, 1fr); }
  .zg-wines { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rg-spread > .rg-spread__photo { min-height: 18rem; }
}
@media (max-width: 760px) {
  .rg-figure__hint { display: block; }
  .rg-cover__map { position: static; justify-content: center; width: auto; height: 11rem; margin: 0 var(--rg-gut) 1.5rem; order: -1; }
  .rg-cover--map h1 { max-width: none; }
}
@media (max-width: 640px) {
  .rg-glance__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rg-glance__item { grid-column: auto; padding: 1rem .8rem; }
  .rg-glance__grid--odd > :last-child { grid-column: 1 / -1; }
  .rg-split, .rg-split--rev { grid-template-columns: minmax(0, 1fr); }
  .rg-split--rev .rg-photo { order: -1; }
  .rg-photo--wide, .rg-photo--short, .rg-photo--tall { aspect-ratio: 4 / 3; }
  .rg-timeline { grid-auto-flow: row; grid-template-columns: minmax(0, 1fr); gap: 1.2rem; padding-left: 1.4rem; }
  .rg-timeline::before { top: .4rem; right: auto; bottom: .4rem; left: 4px; width: 1px; height: auto; }
  .rg-timeline li { gap: .2rem; padding: 0; }
  .rg-timeline li::before { top: .75rem; left: -1.4rem; }
  .rg-timeline b { height: auto; font-size: 1.6rem; }
  .rg-grapes, .rg-grapes--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rg-grape { padding: 1.1rem; }
  .rg-page .rg-grape h3 { font-size: 1.7rem; }
  .rg-area { grid-template-columns: min(4.5rem, 20vw) minmax(0, 1fr); gap: 1rem; }
  .zg-compare__row { grid-template-columns: minmax(0, 1fr); gap: .4rem; }
  .zg-compare__row--head { display: none; }
  .zg-compare__row p { display: grid; gap: .1rem; }
  .zg-compare__mobile { display: block; color: var(--rg-gold-ink); font: 600 .66rem/1.3 var(--rg-sans); letter-spacing: .14em; text-transform: uppercase; }
  .rg-page .rg-area__count { grid-column: 2; padding-top: 0; white-space: normal; }
  .rg-spread dl, .rg-labels, .rg-page .producer-profiles .directory { grid-template-columns: minmax(0, 1fr); }
  .zg-wines { grid-template-columns: minmax(0, 1fr); }
  .ri-point text { font-size: 19px; }
  .ri-point--town text, .ri-point--appellation text { font-size: 23px; }
  .ri-point circle { r: 7px; }
  .ra-label text { font-size: 18px; }
  .ra-label--group text { font-size: 21px; }
  .ra-river-name { font-size: 24px; }
  .ri-zone-name { font-size: 30px; }
  .mf-key text, .mf-scale text { font-size: 17px; }
  .rg-spread__art { height: 5.6rem; }
  .rg-cover__credit { right: auto; left: var(--rg-gut); }
}
@media (prefers-reduced-motion: reduce) {
  .rg-cover__img { animation: none; }
  .rg-rv { transform: none; transition: none; }
  .rg-page .rg-nav a, .rg-next__media img { transition: none; }
}