/* dv-retailers (2026-10-27): the retailer pages (Alcomarket, Kaufland Moldova). Kit tokens and components only, in the
   look of the events pages: Literata for titles, Onest for the rest, the house greens for what can be picked (pills,
   the "Pe hartă" chips), white cards on the ground, the band for the stores and the questions. Prefix rt-. */

.pg-retailer {
  --rt-green: #3A6E20;                  /* the house link green: white on it 6.1:1, it on white 5.9:1 */
  --rt-tint: rgb(76 140 43 / .09);      /* leaf over white */
  --rt-tint-2: rgb(76 140 43 / .17);
  --rt-card-shadow: 0 1px 2px rgb(26 23 27 / .05), 0 12px 32px -24px rgb(26 23 27 / .25);
}
.rt-h2 { margin: 0 0 var(--sp-4); }
.rt-intro { max-width: var(--text-measure); margin-bottom: var(--sp-6); }
.rt-intro > :first-child { margin-top: 0; }
.rt-intro a, .rt-coop__text a, .rt-brief a { color: var(--link); text-underline-offset: .18em; }
.rt-intro h3, .rt-coop__text h3 { margin-top: var(--sp-5); font-size: var(--fs-card); line-height: var(--lh-card); }

/* ---- Head: text left, the two logos on a white card right (top on phones) -------------------------------------- */
.rt-hero { padding-block: var(--sp-5) var(--sp-7); }
.rt-hero__grid { display: grid; gap: var(--sp-5); grid-template-areas: "logos" "text"; }
.rt-hero__text { grid-area: text; min-width: 0; }
.rt-hero__logos { grid-area: logos; }
.rt-crumbs { margin-bottom: var(--sp-4); }
.rt-eyebrow { margin-bottom: var(--sp-2); }
.rt-hero__title { max-width: 24ch; }
.rt-lead { margin-top: var(--sp-4); }
.rt-actions { display: flex; flex-wrap: wrap; gap: var(--sp-3); margin-top: var(--sp-5); }
.rt-actions .dvh-btn .dvh-icon, .rt-wine__buy .dvh-icon, .rt-map__open .dvh-icon { opacity: .8; }
.rt-pills { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin: var(--sp-5) 0 0; padding: 0; list-style: none; }
.rt-pills li { display: inline-flex; align-items: center; min-height: 32px; padding: 4px var(--sp-3); border-radius: 999px; background: var(--rt-tint); color: var(--rt-green); font-size: var(--fs-meta); line-height: 1.35; font-weight: var(--fw-strong); }

.rt-hero__logos {
  display: flex; align-items: center; justify-content: center; gap: var(--sp-4); min-width: 0;
  padding: var(--sp-4) var(--sp-5); background: var(--surface); border-radius: var(--radius-media); box-shadow: var(--rt-card-shadow);
}
.rt-logo { display: inline-flex; align-items: center; justify-content: center; min-width: 0; }
a.rt-logo { border-radius: var(--radius-control); }
a.rt-logo:focus-visible { outline: 2px solid var(--focus); outline-offset: 4px; }
/* logo sizes from the logo's own proportion (--rt-ar, set from its viewBox): as wide as a 36 / 64 px tall copy, at most
   10 / 18 rem; no percentage widths (a replaced element with one collapses in a shrink-to-fit box) */
.rt-logo__img { display: block; height: auto; }
.rt-logo__img--chain { width: min(10rem, calc(2.25rem * var(--rt-ar, 4))); }
.rt-logo__img--ours { width: 5.5rem; }
.rt-logo__rule { flex: none; align-self: stretch; width: 1px; background: var(--line); }

@media (min-width: 900px) {
  .rt-hero { padding-block: var(--sp-6) var(--sp-8); }
  .rt-hero__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); grid-template-areas: "text logos"; gap: var(--col-gap); align-items: center; }
  .rt-hero__logos { flex-direction: column; gap: var(--sp-6); padding: var(--sp-7) var(--sp-6); }
  .rt-logo__img--chain { width: min(18rem, calc(4rem * var(--rt-ar, 4))); }
  .rt-logo__img--ours { width: 9rem; }
  .rt-logo__rule { align-self: center; width: 64px; height: 1px; }
}

/* owner 2026-10-27 justifies running text site-wide; short UI lines stay ragged (a justified two-word line gapes) */
.rt-pills li, .rt-wine__note, .rt-wine__seen, .rt-wine__links, .rt-store p, .rt-brief__src, .rt-map__panel p, .rt-crumbs li { text-align: start; -webkit-hyphens: manual; hyphens: manual; }

/* ---- Wines ------------------------------------------------------------------------------------------------------ */
.rt-wines-sec { padding-top: 0; }
.rt-wines { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); gap: var(--sp-4) var(--col-gap); margin: 0; padding: 0; list-style: none; }
.rt-wine { display: flex; flex-direction: column; min-width: 0; padding: 6px 6px var(--sp-4); background: var(--surface); border-radius: var(--radius-media); box-shadow: var(--rt-card-shadow); }
.rt-wine__well { display: flex; align-items: flex-end; justify-content: center; height: 15rem; padding: var(--sp-4) var(--sp-3) var(--sp-3); background: var(--well); border-radius: var(--radius-media); }
.rt-wine__img { display: block; width: auto; height: 100%; max-width: 100%; object-fit: contain; }
.rt-wine__body { display: flex; flex-direction: column; flex: 1 1 auto; gap: var(--sp-1); padding: var(--sp-3) 6px 0; min-width: 0; }
.rt-wine__name { font-size: var(--fs-card); line-height: var(--lh-card); font-weight: var(--fw-title); }
.rt-wine__name a { color: var(--ink); text-decoration: none; }
.rt-wine__name a:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .18em; }
.rt-wine__note { font-size: var(--fs-meta); line-height: var(--lh-meta); color: var(--muted); text-wrap: pretty; }
.rt-wine__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px var(--sp-2); margin-top: var(--sp-2); }
.rt-wine__price .dvh-price { color: var(--rt-green); }
.rt-wine__seen { font-size: var(--fs-meta); line-height: var(--lh-meta); color: var(--muted); }
.rt-wine__links { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2) var(--sp-4); margin-top: auto; padding-top: var(--sp-3); }
.rt-wine__ours { display: inline-flex; align-items: center; min-height: 40px; font-size: var(--fs-ui); color: var(--link); text-underline-offset: .18em; }
@media (max-width: 599.98px) {
  .rt-wine { display: grid; grid-template-columns: 96px minmax(0, 1fr); column-gap: var(--sp-3); padding: 6px; }
  .rt-wine__well { height: auto; min-height: 9.5rem; padding: var(--sp-2); }
  .rt-wine__body { padding: var(--sp-1) 4px var(--sp-1) 0; }
}

/* ---- Stores: list by locality beside the map (map first on phones) ---------------------------------------------- */
.rt-locator { display: grid; gap: var(--sp-4); }
/* phones: the sketch (4:3) with the panel under it; the Google map, once loaded, covers both (the box keeps its size) */
.rt-map {
  position: relative; isolation: isolate; overflow: clip; min-width: 0;
  background: var(--surface); border-radius: var(--radius-media); box-shadow: var(--rt-card-shadow);
}
.rt-map__ph { position: relative; }
.rt-sketch { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; }
.rt-sketch__grid path { fill: none; stroke: var(--line); stroke-width: 1; stroke-dasharray: 2 6; vector-effect: non-scaling-stroke; }
.rt-sketch__dots circle { fill: var(--leaf); fill-opacity: .55; stroke: var(--surface); stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.rt-sketch__labels text { font-family: var(--font-text); font-size: 24px; font-weight: 600; fill: var(--ink); paint-order: stroke; stroke: var(--surface); stroke-width: 4px; stroke-linejoin: round; }
.rt-sketch__winery path { fill: var(--action); stroke: var(--surface); stroke-width: 2; }
.rt-sketch__labels .rt-sketch__winery text { fill: var(--action); font-weight: 500; font-style: italic; }
.rt-map__panel { display: grid; justify-items: start; gap: var(--sp-2); padding: var(--sp-3) var(--sp-4) var(--sp-4); border-top: 1px solid var(--line); }
.rt-map__btn { width: 100%; }
.rt-map__btn[aria-disabled="true"] { cursor: progress; }
.rt-map__note, .rt-map__error { font-size: var(--fs-meta); line-height: var(--lh-meta); color: var(--muted); text-wrap: pretty; }
.rt-map__error { color: var(--ink); }
.dv-js .rt-map[data-src]:not([data-state="error"]) .rt-map__open { display: none; }
html:not(.dv-js) .rt-map__btn, html:not(.dv-js) .rt-map__note, html:not(.dv-js) .rt-store__show { display: none; }
.rt-map__frame { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; border: 0; opacity: 0; transition: opacity var(--dur-settle) var(--ease-out); }
.rt-map__frame:focus-visible { outline: 3px solid var(--focus); outline-offset: -3px; }
.rt-map[data-state="ready"] .rt-map__frame { opacity: 1; }
.rt-map[data-state="ready"] .rt-map__ph { visibility: hidden; transition: visibility 0s linear var(--dur-settle); }

.rt-list { min-width: 0; container: rt-list / inline-size; }
.rt-list:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; border-radius: var(--radius-media); }
.rt-city { border-top: 1px solid var(--line); }
.rt-city:last-child { border-bottom: 1px solid var(--line); }
.rt-city > summary { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); min-height: var(--tap); padding-block: var(--sp-2); list-style: none; cursor: pointer; }
.rt-city > summary::-webkit-details-marker { display: none; }
.rt-city > summary:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; border-radius: 2px; }
.rt-city__name { font-size: var(--fs-card); line-height: var(--lh-card); font-weight: var(--fw-title); }
.rt-city__n { font-family: var(--font-text); font-size: var(--fs-meta); font-weight: var(--fw-text); color: var(--muted); font-variant-numeric: tabular-nums; }
.rt-city__chev { flex: none; color: var(--muted); transition: rotate var(--dur-ui) var(--ease-out); }
.rt-city[open] .rt-city__chev { rotate: 180deg; }
.rt-city__list { display: grid; gap: var(--sp-2); margin: 0 0 var(--sp-4); padding: 0; list-style: none; }
@container rt-list (min-width: 34rem) { .rt-city__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.rt-store { display: grid; gap: 2px; align-content: start; min-width: 0; padding: var(--sp-3) var(--sp-4); background: var(--surface); border-radius: var(--radius-media); }
.rt-store__name { font-size: var(--fs-ui); line-height: var(--lh-ui); font-weight: var(--fw-strong); }
.rt-store__addr { font-size: var(--fs-ui); line-height: 1.45; overflow-wrap: anywhere; }
.rt-store__hours { display: flex; align-items: center; gap: 6px; font-size: var(--fs-meta); line-height: var(--lh-meta); color: var(--muted); }
.rt-store__hours .dvh-icon { flex: none; width: 14px; height: 14px; }
.rt-store__links { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-1) var(--sp-4); margin-top: var(--sp-1); font-size: var(--fs-meta); }
.rt-store__links a { display: inline-flex; align-items: center; min-height: 36px; color: var(--link); text-underline-offset: .18em; }
.rt-store__show {
  display: inline-flex; align-items: center; gap: 4px; min-height: 32px; margin-block: 2px; padding: 0 var(--sp-3); border: 1px solid transparent; border-radius: 999px;
  background: var(--rt-tint); color: var(--rt-green); font: inherit; font-weight: var(--fw-strong); cursor: pointer; position: relative;
  transition: background-color var(--dur-hover) var(--ease-out), color var(--dur-hover) var(--ease-out);
}
.rt-store__show::after { content: ""; position: absolute; inset: -6px -2px; }   /* 44 px hit area */
.rt-store__show .dvh-icon { width: 14px; height: 14px; }
.rt-store__show:hover { background: var(--rt-tint-2); }
.rt-store__show[aria-pressed="true"] { background: var(--rt-green); color: #fff; }
.rt-store__show:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }

@media (min-width: 900px) {
  .rt-locator { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); grid-template-areas: "list map"; gap: var(--col-gap); align-items: start; }
  .rt-map { grid-area: map; height: 38rem; }
  .rt-map__ph { position: absolute; inset: 0; }
  .rt-sketch { position: absolute; inset: 0; height: 100%; aspect-ratio: auto; }
  .rt-list { grid-area: list; max-height: 38rem; overflow-y: auto; overscroll-behavior: contain; padding-right: var(--sp-2); scrollbar-width: thin; }
  .rt-map__panel {
    position: absolute; left: var(--sp-5); bottom: var(--sp-5); max-width: 22rem; padding: var(--sp-4) var(--sp-5);
    border-top: 0; background: var(--surface); border-radius: var(--radius-media); box-shadow: var(--shadow-pop);
  }
  .rt-map__btn { width: auto; }
}

/* ---- Cooperation text and "Pe scurt" ---------------------------------------------------------------------------- */
.rt-coop__grid { display: grid; gap: var(--sp-7); }
.rt-coop__text > :first-child { margin-top: 0; }
.rt-coop__text h2 { margin-top: var(--sp-7); font-size: var(--fs-h2); line-height: var(--lh-h2); }
.rt-coop__text h2:first-child { margin-top: 0; }
.rt-coop__text ol, .rt-coop__text ul { padding-left: 1.4em; max-width: var(--text-measure); }
.rt-coop__text li + li { margin-top: var(--sp-2); }
.rt-brief { align-self: start; padding: var(--sp-5); background: var(--surface); border-radius: var(--radius-media); box-shadow: var(--rt-card-shadow); }
.rt-brief__title { margin-bottom: var(--sp-3); font-size: var(--fs-h3); line-height: var(--lh-h3); font-weight: var(--fw-title); }
.rt-brief__list { margin: 0; padding: 0; list-style: none; }
.rt-brief__list li { padding-block: var(--sp-3); border-top: 1px solid var(--line); font-size: var(--fs-ui); line-height: 1.5; text-wrap: pretty; }
.rt-brief__src { margin-top: var(--sp-1); font-size: var(--fs-meta); line-height: var(--lh-meta); color: var(--muted); }
@media (min-width: 1024px) {
  .rt-coop__grid:has(> :nth-child(2)) { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--sp-8); }
  .rt-brief { position: sticky; top: calc(var(--header-h) + var(--sp-4)); }
}

/* ---- Questions -------------------------------------------------------------------------------------------------- */
.rt-qa { margin: 0; border-top: 1px solid var(--ink); }
.rt-qa__item { display: grid; gap: var(--sp-2); padding-block: var(--sp-5); border-bottom: 1px solid var(--line); }
.rt-qa__item dt { font-family: var(--font-display); font-size: var(--fs-card); line-height: var(--lh-card); font-weight: var(--fw-title); }
.rt-qa__item dd { margin: 0; max-width: var(--text-measure); font-size: var(--fs-body); line-height: var(--lh-body); text-wrap: pretty; }
@media (min-width: 900px) {
  .rt-qa__item { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--col-gap); align-items: baseline; }
}

@media (prefers-reduced-motion: reduce) {
  .rt-city__chev, .rt-store__show, .rt-map__frame { transition: none; }
}
@media print {
  .rt-map, .rt-store__show { display: none; }
}