/* dv-tours, group visits (2026-10-27): the page Vizite de grup. Kit tokens and components (.dvh-step, .dvh-options,
   .dvh-stepper, .dvh-summary, .dvh-buybar--book) with the page's own greens for what can be chosen (below). */

.dvgp-head { padding-bottom: 0; }
.dvgp-lead { margin-top: var(--sp-3); }
.dvgp-lead > :first-child { margin-top: 0; }
.dvgp-lead > :last-child { margin-bottom: 0; }

.dvgp { display: grid; gap: var(--sp-5); align-items: start; }
.dvgp__main { display: grid; gap: var(--sp-4); min-width: 0; }
.dvgp__main > .dvh-step + .dvh-step { margin-top: 0; }
.dvgp-step { display: grid; gap: var(--sp-5); min-width: 0; }
.dvgp-step > .dvh-step__head { margin-bottom: 0; }
.dvgp-fieldset { min-width: 0; margin: 0; padding: 0; border: 0; display: grid; gap: var(--sp-2); }
.dvgp-fieldset > legend { padding: 0; margin-bottom: var(--sp-2); }
@media (min-width: 1024px) {
  .dvgp { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: var(--sp-6); }
  .dvgp__aside { position: sticky; top: calc(var(--header-h) + var(--sp-4)); }
  .dvgp__aside .dvh-summary { position: static; }
}

/* Owner 2026-10-27, after "make buttons look much better": "too bulky, too archaic, maybe colors". One sans voice for
   every control (Literata stays for the page and step titles only), compact choices, and the house greens as the
   colour of what can be chosen: a leaf tint on open days and the stepper, green prices and checks, the chosen card
   filled light green. */
.dvgp__main { container: dvgp / inline-size; }
.pg-group {
  --gp-green: #3A6E20;                  /* the house link green: white on it 6.1:1, it on white 5.9:1 */
  --gp-tint: rgb(76 140 43 / .09);      /* leaf over white: things you can pick */
  --gp-tint-2: rgb(76 140 43 / .17);    /* their hover */
  --gp-chosen: #EEF5EA;                 /* the chosen card's ground */
}

/* The four tours: the whole card is the label, the radio its round check (arrow keys, focus) */
.dvgp-tours { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-2); }
@container dvgp (min-width: 640px) {
  .dvgp-tours { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .dvgp-tours:has(> :nth-child(3):last-child) { grid-template-columns: repeat(3, minmax(0, 1fr)); }   /* events: 3 packages */
}
.dvgp-tour {
  position: relative; display: flex; flex-direction: column; gap: 2px; padding: 14px var(--sp-4);
  border: 1px solid var(--line); border-radius: 12px; background: var(--surface); cursor: pointer;
  transition: border-color var(--dur-hover) var(--ease-out), background-color var(--dur-hover) var(--ease-out), box-shadow var(--dur-hover) var(--ease-out);
}
.dvgp-tour input {
  appearance: none; position: absolute; top: var(--sp-4); right: var(--sp-4); width: 20px; height: 20px; margin: 0;
  border: 1.5px solid var(--control); border-radius: 50%; background: var(--surface) center / 12px no-repeat; cursor: pointer;
  transition: background-color var(--dur-hover) var(--ease-out), border-color var(--dur-hover) var(--ease-out);
}
.dvgp-tour input:checked {
  border-color: var(--gp-green); background-color: var(--gp-green);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E");
}
.dvgp-tour:hover { border-color: var(--leaf); }
.dvgp-tour:hover input:not(:checked) { border-color: var(--gp-green); }
.dvgp-tour:has(input:checked) { border-color: var(--leaf); background: var(--gp-chosen); box-shadow: inset 0 0 0 1px var(--leaf); }
.dvgp-tour:has(input:focus-visible) { outline: 2px solid var(--focus); outline-offset: 2px; }
.dvgp-tour__name { padding-right: 26px; font-size: var(--fs-btn); line-height: 22px; font-weight: var(--fw-strong); color: var(--ink); }
.dvgp-tour__what { margin-bottom: var(--sp-3); font-size: var(--fs-meta); line-height: 1.4; color: var(--muted); text-wrap: pretty; }
.dvgp-tour__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 6px; margin-top: auto; }
.dvgp-tour__amt { font-size: var(--fs-price); line-height: 1.3; font-weight: var(--fw-strong); color: var(--gp-green); white-space: nowrap; font-variant-numeric: tabular-nums; }
.dvgp-tour__unit { font-size: var(--fs-meta); line-height: 1.3; color: var(--muted); }
.dvh-field.is-invalid .dvgp-tour, .dvgp-fieldset.is-invalid .dvgp-tour { border-color: var(--error); }
@container dvgp (max-width: 479px) {
  .dvgp-tour { padding: var(--sp-3); }
  .dvgp-tour input { top: var(--sp-3); right: var(--sp-3); }
}

/* Owner 2026-10-27 "why so bulky": the visits are compact rows, not tall cards. Two per row (one on phones): the round
   check, the name with its short description under it, the price at the right end with "de persoană" under it. The
   event packages (with food / drinks / program lines) keep the stacked card. */
.dvgp-tours:not(:has(.dvgp-tour__lines)) { grid-template-columns: minmax(0, 1fr); }
@container dvgp (min-width: 560px) { .dvgp-tours.dvgp-tours:not(:has(.dvgp-tour__lines)) { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.dvgp-tour:not(:has(.dvgp-tour__lines)) {
  display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; grid-template-areas: "check name price" ". what price";
  align-items: start; column-gap: 12px; row-gap: 0; padding: 12px 14px;
}
.dvgp-tour:not(:has(.dvgp-tour__lines)) input { position: static; grid-area: check; margin-top: 1px; }
.dvgp-tour:not(:has(.dvgp-tour__lines)) .dvgp-tour__name { grid-area: name; padding-right: 0; }
.dvgp-tour:not(:has(.dvgp-tour__lines)) .dvgp-tour__what { grid-area: what; margin: 0; }
.dvgp-tour:not(:has(.dvgp-tour__lines)) .dvgp-tour__price { grid-area: price; display: flex; flex-direction: column; align-items: flex-end; gap: 0; margin: 0; text-align: right; }
.dvgp-tour:not(:has(.dvgp-tour__lines)) .dvgp-tour__amt { font-size: var(--fs-ui); line-height: 22px; }
.dvgp-tour:not(:has(.dvgp-tour__lines)) .dvgp-tour__unit { font-size: var(--fs-eyebrow); line-height: 18px; }

/* Guests: a compact stepper, green - and + on the leaf tint; typeable (min/max from the settings) */
.dvgp-stepper { align-self: start; justify-self: start; height: 44px; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; background: var(--surface); }
.dvgp-stepper .dvh-stepper__btn { width: 44px; background: var(--gp-tint); color: var(--gp-green); transition: background-color var(--dur-hover) var(--ease-out); }
.dvgp-stepper .dvh-stepper__btn:hover:not(:disabled) { background: var(--gp-tint-2); }
.dvgp-stepper .dvh-stepper__btn:disabled { background: var(--ground); color: var(--control); cursor: not-allowed; } /* R5: at its limit, grey but visible */
.dvgp-stepper .dvh-stepper__btn .dvh-icon { width: 18px; height: 18px; }
.dvgp-stepper .dvh-stepper__input { width: 60px; border-inline: 0; font-size: var(--fs-price); font-weight: var(--fw-strong); color: var(--ink); }
.dvgp-stepper:has(:focus-visible) { outline: 2px solid var(--focus); outline-offset: 2px; }
.dvgp-stepper :focus-visible { outline: 0; }
.dvgp-guests, .dvgp-guests + .dvh-field { max-width: 26rem; }
.dvgp-over a { color: var(--link); text-decoration: underline; text-underline-offset: .18em; }

/* Events pages (owner 2026-10-27 "split the guests by age"): one framed list of three rows, the age and its price on
   the left, a borderless stepper on the right (green − / + on the leaf tint, the number between them) */
.dvgp-ages__rows { display: grid; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.dvgp-age { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); min-height: 52px; padding: 6px 6px 6px 14px; }
.dvgp-age + .dvgp-age { border-top: 1px solid var(--line); }
.dvgp-age__label { display: grid; min-width: 0; cursor: pointer; }
.dvgp-age__name { font-size: var(--fs-btn); line-height: 22px; font-weight: var(--fw-ui); color: var(--ink); text-wrap: balance; }
.dvgp-age__price { font-size: var(--fs-meta); line-height: 18px; font-weight: var(--fw-strong); color: var(--gp-green); font-variant-numeric: tabular-nums; }
.dvgp-age__price:empty { display: none; }
.dvgp-ages .dvgp-stepper { flex: none; align-self: center; height: 40px; gap: 2px; border: 0; border-radius: 12px; background: none; overflow: visible; }
.dvgp-ages .dvgp-stepper .dvh-stepper__btn { width: 40px; height: 40px; border-radius: 10px; }
.dvgp-ages .dvgp-stepper .dvh-stepper__btn::before { inset: 0; }
.dvgp-ages .dvgp-stepper .dvh-stepper__input { width: 40px; border: 0; font-size: var(--fs-btn); }
.dvgp-ages.is-invalid .dvgp-ages__rows { border-color: var(--error); }

/* the breakdown by age with the total under it (same green ground as the one-line total) */
.dvgp-total--ages { display: grid; }
.dvgp-total__hint { margin: 0; }
.dvgp-total__hint[hidden], .dvgp-bd[hidden] { display: none; }
.dvgp-bd { display: grid; gap: 2px; margin: 0; }
.dvgp-bd > div { display: flex; justify-content: space-between; align-items: baseline; gap: var(--sp-3); font-size: var(--fs-meta); line-height: 20px; font-weight: var(--fw-text); }
.dvgp-bd dd { margin: 0; white-space: nowrap; }
.dvgp-bd > .dvgp-bd__sum { margin-top: 6px; padding-top: 6px; border-top: 1px solid rgb(58 110 32 / .2); font-size: var(--fs-ui); line-height: 22px; font-weight: var(--fw-strong); }
.dvgp-sum--ages [data-dvgp-sum-tour] { color: var(--ink); font-weight: var(--fw-strong); }
.dvgp-sum--ages [data-dvgp-sum-bd] { font-size: var(--fs-meta); }
.dvgp-sum--ages [data-dvgp-sum-line]:empty { display: none; }

/* R5 2026-10-27 (owner on step 1: "barely readable bad layout text and style"): the packages (or the visits) across the
   whole step, three cards in one row (stacked on phones); under them the guests and the date side by side, the live
   total under the guests. */
.dvgp-tours:has(.dvgp-tour__lines) { grid-template-columns: minmax(0, 1fr); }
@container dvgp (min-width: 640px) {
  .dvgp-step:has(.dvgp-tours) {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: auto auto auto 1fr; column-gap: var(--sp-6);
    grid-template-areas: "head head" "tours tours" "guests date" "total date";
  }
  .dvgp-step:has(.dvgp-tours) > * { grid-column: 1 / -1; }
  .dvgp-step:has(.dvgp-tours) > .dvh-step__head { grid-area: head; }
  .dvgp-step:has(.dvgp-tours) > .dvgp-fieldset { grid-area: tours; }
  .dvgp-step:has(.dvgp-tours) > .dvgp-guests { grid-area: guests; }
  .dvgp-step:has(.dvgp-tours) > .dvgp-guests + .dvh-field { grid-area: date; }
  .dvgp-step:has(.dvgp-tours) > .dvgp-total { grid-area: total; align-self: start; }
  .dvgp-step .dvgp-tours.dvgp-tours.dvgp-tours { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dvgp-step .dvgp-tours.dvgp-tours.dvgp-tours:has(.dvgp-tour__lines) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .dvgp-guests, .dvgp-guests + .dvh-field { max-width: none; }
  .pg-group .dvgp-step .dvt-cal { max-width: none; }
  /* events pages: the occasion row above */
  .dvgp-step:has(.dvgp-occ) { grid-template-areas: "head head" "occ occ" "tours tours" "guests date" "total date"; grid-template-rows: auto auto auto auto 1fr; }
  .dvgp-step:has(.dvgp-tours) > .dvgp-occ { grid-area: occ; }
}
/* step 1's labels: 15 px semibold ink */
.dvgp-step:has(.dvgp-tours) .dvh-label { font-size: var(--fs-ui); line-height: 22px; font-weight: var(--fw-strong); }

/* Events pages: the facts under the lead (pills; glass on the film), the text and the questions under the form */
.dvgp-facts { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin: var(--sp-4) 0 0; padding: 0; list-style: none; }
.dvgp-facts li { display: inline-flex; align-items: center; min-height: 32px; padding: 0 var(--sp-3); border-radius: 999px; background: var(--gp-tint); color: var(--gp-green); font-size: var(--fs-meta); font-weight: var(--fw-strong); }
.dvgp-facts--film li { border: 1px solid rgb(255 255 255 / .32); background: rgb(255 255 255 / .14); color: #fff; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.dvgp-film .dvgp-lead { max-width: 40rem; }
.dvgp-info { display: grid; gap: var(--sp-7); }
@media (min-width: 1024px) { .dvgp-info:has(> :nth-child(2)) { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); align-items: start; } }
.dvgp-info .dvh-h2 { margin: 0 0 var(--sp-4); }
.dvgp-info .dvh-prose > :first-child { margin-top: 0; }

/* Owner 2026-10-27 "overcrowded, bad layout, bad design": the film carries only the title, two lines of text and the
   button, on a shorter film with a soft dark veil on the text side; the facts follow under the film on the ground */
.dvh-film.dvgp-film { min-height: min(64svh, 640px); }
.dvgp-film h1 { max-width: 15ch; font-size: clamp(2.25rem, 1.55rem + 2.2vw, 3.5rem); line-height: 1.06; text-wrap: balance; }
.dvgp-film .dvgp-lead { max-width: 36rem; margin-top: var(--sp-3); font-size: var(--fs-body); line-height: 1.55; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.dvgp-film .dvgp-lead > * { margin: 0; }
.dvgp-film .dvh-film__actions { margin-top: var(--sp-5); }
.dvgp-film .dvh-film__media::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, rgb(20 18 20 / .62) 0%, rgb(20 18 20 / .34) 45%, rgb(20 18 20 / 0) 75%); }
.dvgp-factbar { padding-block: var(--sp-4) 0; }
.dvgp-factbar .dvgp-facts { margin: 0; }
@media (max-width: 899.98px) { .dvgp-film .dvh-film__media::after { background: linear-gradient(0deg, rgb(20 18 20 / .7) 0%, rgb(20 18 20 / .2) 60%, rgb(20 18 20 / 0) 100%); } }

/* Events: the occasion as pill radios (leaf tint, the chosen one solid green) */
.dvgp-occs { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.dvgp-occ__opt { position: relative; display: inline-flex; cursor: pointer; }
.dvgp-occ__opt input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.dvgp-occ__opt span {
  display: inline-flex; align-items: center; min-height: 40px; padding: 0 var(--sp-4); border: 1px solid transparent; border-radius: 999px;
  background: var(--gp-tint); color: var(--gp-green); font-size: var(--fs-ui); font-weight: var(--fw-strong);
  transition: background-color var(--dur-hover) var(--ease-out), color var(--dur-hover) var(--ease-out);
}
.dvgp-occ__opt:hover span { background: var(--gp-tint-2); }
.dvgp-occ__opt input:checked + span { background: var(--gp-green); color: #fff; }
.dvgp-occ__opt input:focus-visible + span { outline: 2px solid var(--focus); outline-offset: 2px; }
.dvgp-occ.is-invalid .dvgp-occ__opt span { border-color: var(--error); }

.dvgp-tour__min { display: inline-flex; align-self: flex-start; margin: var(--sp-2) 0 0; padding: 2px 10px; border-radius: 999px; background: var(--gp-tint); color: var(--gp-green); font-size: var(--fs-meta); line-height: 20px; font-weight: var(--fw-strong); }
/* Events (R5): the package card. Name 18 px ink, the price under it in green with "de persoană" small, then the food,
   drinks and program as three ink lines, each with its icon (food, glass, clock) */
.dvgp-tour:has(.dvgp-tour__lines) { gap: 0; padding: var(--sp-4) var(--sp-4) var(--sp-5); }
.dvgp-tour:has(.dvgp-tour__lines) .dvgp-tour__name { padding-right: var(--sp-6); font-size: 1.125rem; line-height: 1.35; text-wrap: balance; }
.dvgp-tour:has(.dvgp-tour__lines) .dvgp-tour__price { flex-direction: column; align-items: flex-start; gap: 0; margin: var(--sp-1) 0 0; }
.dvgp-tour:has(.dvgp-tour__lines) .dvgp-tour__min { justify-self: start; }
/* side by side, the three cards share their rows (name, price, minimum, lines): prices and lines start level */
@container dvgp (min-width: 640px) {
  .dvgp-tour:has(.dvgp-tour__lines) { display: grid; grid-row: span 4; grid-template-rows: subgrid; row-gap: 0; align-content: start; }
  .dvgp-tour:has(.dvgp-tour__lines) > .dvgp-tour__min { grid-row: 3; }
  .dvgp-tour:has(.dvgp-tour__lines) > .dvgp-tour__lines { grid-row: 4; align-self: start; }
}
.dvgp-tour:has(.dvgp-tour__lines) .dvgp-tour__amt { font-size: var(--fs-price-lg); line-height: 1.25; }
.dvgp-tour__lines { display: grid; gap: var(--sp-2); margin: var(--sp-4) 0 0; padding-top: var(--sp-4); border-top: 1px solid var(--line); }
.dvgp-tour__line { display: grid; grid-template-columns: 18px minmax(0, 1fr); column-gap: var(--sp-2); align-items: start; font-size: var(--fs-ui); line-height: 22px; color: var(--ink); text-wrap: pretty; }
.dvgp-tour__line > .dvh-icon { width: 18px; height: 18px; margin-top: 2px; color: var(--gp-green); }

/* The calendar on this page: compact, the month in the sans, open days on the leaf tint in green, closed and past days
   faded (no strike-through), the chosen day solid green */
.pg-group .dvt-cal { max-width: 21rem; padding: var(--sp-3); border-radius: 12px; }
.pg-group .dvh-cal__month { font-family: var(--font-text); font-size: var(--fs-btn); font-weight: var(--fw-strong); }
.pg-group .dvh-cal__head .dvh-iconbtn { width: 40px; height: 40px; min-width: 40px; border-radius: 50%; color: var(--gp-green); }
.pg-group .dvh-cal__head .dvh-iconbtn:hover { background: var(--gp-tint); }
.pg-group .dvh-cal__grid { gap: 4px; }
.pg-group .dvh-day { height: 40px; border-radius: 8px; font-size: var(--fs-ui); }
.pg-group .dvh-day:disabled { text-decoration: none; opacity: 1; background: none; color: var(--control); font-weight: var(--fw-text); } /* R5: quiet, still readable */
.pg-group .dvh-day:not(:disabled) { background: var(--gp-tint); color: var(--gp-green); font-weight: var(--fw-strong); box-shadow: inset 0 0 0 1px rgb(76 140 43 / .3); }
/* R5: the date note, one line with an info icon */
.dvgp-note { display: flex; align-items: flex-start; gap: var(--sp-2); font-size: var(--fs-meta); line-height: 20px; color: var(--muted); }
.dvgp-note > .dvh-icon { flex: none; width: 16px; height: 16px; margin-top: 2px; color: var(--gp-green); }
.pg-group .dvh-day:not(:disabled):not([aria-pressed="true"]):hover { background: var(--gp-tint-2); }
.pg-group .dvh-day.dvh-day[aria-pressed="true"] { background: var(--gp-green); color: #fff; box-shadow: none; opacity: 1; }
.pg-group .dvt-cal__chosen .dvh-icon { color: var(--gp-green); }

/* The live total of the first step: "12 × 600 MDL = 7 200 MDL" in green on the chosen ground; before a tour is chosen
   nothing (R5: the dashed hint box is gone; a missing package is the form's error at submit) */
.dvgp-total {
  margin: 0; padding: var(--sp-3) var(--sp-4); border: 1px solid transparent; border-radius: 12px; background: var(--gp-chosen); color: var(--gp-green);
  font-size: var(--fs-ui); line-height: 22px; font-weight: var(--fw-strong); font-variant-numeric: tabular-nums; text-wrap: balance;
}
.dvgp-total[data-empty] { display: none; }

/* Amount and method cards: the same chosen look as the tours */
.pg-group .dvh-option { border-radius: 12px; transition: border-color var(--dur-hover) var(--ease-out), background-color var(--dur-hover) var(--ease-out); }
.pg-group .dvh-option:hover { border-color: var(--leaf); }
.pg-group .dvh-option input:checked { border-color: var(--gp-green); background: radial-gradient(circle, var(--gp-green) 0 4.5px, var(--surface) 5px); }
.pg-group .dvh-option:has(input:checked) { border-color: var(--leaf); background: var(--gp-chosen); box-shadow: inset 0 0 0 1px var(--leaf); }

/* Methods: the gateway's own logo at the title row's end (maib, MIA), the card marks under the words; a method that
   waits for maib's keys explains itself only once chosen (as on the wine checkout, dv-pay-preview.php) */
.dvgp-methods .dvh-option__price { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: var(--sp-2) var(--sp-3); min-width: 0; min-height: 24px; white-space: normal; }
.dvgp-methods .dvh-option__price .dvh-marks__set { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2) var(--sp-3); margin: 0; }
/* narrow: the card's row of logos (maib, Mastercard, Visa, Apple Pay, Google Pay, MIA) moves under the title */
@container dvgp (max-width: 639px) {
  .dvgp-methods .dvh-option:has(> .dvh-option__price img) > .dvh-option__price { grid-column: 2 / -1; grid-row: 2; justify-content: flex-start; }
  .dvgp-methods .dvh-option:has(> .dvh-option__price img) > .dvh-option__desc { grid-row: 3; }
  .dvgp-methods .dvh-option:has(> .dvh-option__price img) > .dvgp-marks { grid-row: 4; }
  .dvgp-methods .dvh-option:has(> .dvh-option__price img) > .dvgp-pp { grid-row: 5; }
}
.dvgp-methods .dvh-option__price img { display: block; float: none !important; width: auto; height: 22px; max-width: none; margin: 0; padding: 0 !important; }
.dvgp-marks { grid-column: 2 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2) var(--sp-3); margin-top: var(--sp-1); }
.dvgp-marks .dvh-mark-link { display: inline-flex; border: 0; text-decoration: none; }
.dvgp-marks .dvh-mark { display: block; width: auto; height: 24px; max-width: none; }
.dvgp-marks .dvh-mark--card { width: 48px; object-fit: contain; }
.dvgp-pp { display: none; grid-column: 2 / -1; margin-top: var(--sp-2); padding: var(--sp-2) var(--sp-3); border-radius: var(--radius-control); background: var(--ground); font-size: var(--fs-meta); line-height: var(--lh-meta); color: var(--ink); }
.dvh-option:has(input:checked) .dvgp-pp { display: block; }

/* Chats: inline checkboxes with their logos, as at checkout */
.dvgp-chats { margin: var(--sp-2) 0 0; padding: 0; border: 0; min-width: 0; }
.dvgp-chats > legend { padding: 0; }
.dvgp-chats__row { display: flex; flex-wrap: wrap; column-gap: var(--sp-5); }
.dvgp-chat { align-items: center; padding-block: 8px; }
.dvgp-chat input { margin-top: 0; }
.dvgp-chat__logo { flex: none; width: 20px; height: 20px; margin-right: -4px; }

/* More details (optional): closed by default */
.dvgp-more { border-top: 1px solid var(--line); padding-top: var(--sp-3); }
.dvgp-more > summary {
  display: inline-flex; align-items: center; gap: var(--sp-2); min-height: var(--tap); list-style: none; cursor: pointer;
  font-size: var(--fs-ui); font-weight: var(--fw-ui); color: var(--ink);
}
.dvgp-more > summary::-webkit-details-marker { display: none; }
.dvgp-more > summary:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; border-radius: 2px; }
.dvgp-more__chev { transition: rotate var(--dur-ui) var(--ease-out); }
.dvgp-more[open] .dvgp-more__chev { rotate: 180deg; }
.dvgp-more__body { padding-top: var(--sp-3); }
.dvgp-more__body:has(#dvgp-invoice:not(:checked)) .dvgp-company { display: none; }

/* Payment: amount cards (kit .dvh-option), the winery panel, the methods */
.dvgp-lock .dvh-icon { width: 18px; height: 18px; color: var(--muted); }
.dvgp-winery-opt:has(input:checked) .dvgp-lock .dvh-icon { color: var(--ink); }
.dvgp-winery { display: grid; gap: var(--sp-2); padding: var(--sp-4); border: 1px solid var(--line); border-radius: var(--radius-control); background: var(--ground); }
.dvgp-winery[hidden], .dvgp-methods[hidden] { display: none; }
.dvgp-wmode { margin: 0; padding: 0; border: 0; min-width: 0; display: grid; gap: 0; }
.dvgp-code { margin: 0 0 var(--sp-2) calc(20px + var(--sp-3)); max-width: 26rem; }
.dvgp-code[hidden] { display: none; }
.dvgp-code__row { display: flex; gap: var(--sp-2); }
.dvgp-code__row .dvh-input { flex: 1 1 auto; min-width: 0; text-transform: uppercase; letter-spacing: .06em; font-variant-numeric: tabular-nums; }
.dvgp-code__status:empty { display: none; }
.dvgp-code__status.is-ok { color: var(--success); font-weight: var(--fw-ui); }
.dvgp-code__status.is-bad { color: var(--error); }
.dvgp-request { margin: 0 0 0 calc(20px + var(--sp-3)); }
.dvgp-codeok { display: flex; align-items: center; gap: var(--sp-2); margin: 0; font-size: var(--fs-ui); font-weight: var(--fw-ui); color: var(--success); }
.dvh-option.is-soon { cursor: not-allowed; }
.dvh-option.is-soon .dvh-option__title, .dvh-option.is-soon .dvh-option__desc { color: var(--muted); }
.dvgp-soon {
  align-self: center; padding: 2px 8px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface);
  font-size: var(--fs-eyebrow); line-height: var(--lh-eyebrow); font-weight: var(--fw-strong); letter-spacing: var(--track-eyebrow);
  text-transform: uppercase; color: var(--muted); white-space: nowrap;
}
.dvgp-methods .dvh-option__price .dvh-icon { width: 18px; height: 18px; color: var(--muted); }

/* Summary (sticky beside the steps from 1024 px) */
.dvgp-sum { display: grid; gap: 0; }
.dvgp-sum .dvh-totals:first-of-type { padding-top: var(--sp-2); }
.dvgp-sum .dvh-totals dt { color: var(--muted); }
.dvgp-split[hidden] { display: none; }
.dvgp-terms { margin: var(--sp-4) 0 0; }
.dvgp-terms a, .dvgp-cancel a { color: var(--link); text-decoration: underline; text-underline-offset: .18em; }
.dvgp-cancel { margin: var(--sp-2) 0 0; }
.dvgp-submit { margin-top: var(--sp-4); }
.dvgp-secure { display: flex; align-items: flex-start; gap: var(--sp-2); margin: var(--sp-3) 0 0; }
.dvgp-secure[hidden] { display: none; }
.dvgp-secure .dvh-icon { flex: none; width: 16px; height: 16px; margin-top: 2px; color: var(--muted); }
[data-dvgp-submit][aria-busy="true"] { cursor: progress; }

/* Phones: the booking bar (kit .dvh-buybar--book, hidden from 900 px) with the total and the button; it steps aside
   while the summary's own button is on screen; the page keeps room for it at the end */
@media (max-width: 899.98px) {
  .pg-group { padding-bottom: calc(var(--buybar-h) + env(safe-area-inset-bottom, 0px)); }
  .dvgp-bar { transition: translate var(--dur-ui) var(--ease-out), visibility 0s linear var(--dur-ui); }
  .dvgp-bar.is-away { translate: 0 110%; visibility: hidden; }
  .dvgp-bar:not(.is-away) { transition: translate var(--dur-ui) var(--ease-out), visibility 0s; }
  .dvgp-bar .dvh-buybar__name { font-family: var(--font-text); font-size: var(--fs-meta); font-weight: var(--fw-ui); color: var(--muted); }
  .dvgp-bar .dvh-buybar__price { font-size: var(--fs-ui); }
}
@media (prefers-reduced-motion: reduce) {
  .dvgp-bar, .dvgp-more__chev, .dvgp-tour, .dvgp-tour input, .pg-group .dvh-option, .dvgp-stepper .dvh-stepper__btn, .dvgp-occ__opt span { transition: none; }
  .dvgp-tour:hover { translate: none; }
}

/* The summary of a group order (order received, account) */
.dvgp-order { margin: var(--sp-5) 0; padding: var(--sp-5); border: 1px solid var(--line); border-radius: var(--radius-media); background: var(--surface); }
.dvgp-order__list { display: grid; gap: var(--sp-2); margin: var(--sp-3) 0 0; }
.dvgp-order__list > div { display: flex; justify-content: space-between; gap: var(--sp-3); font-size: var(--fs-ui); }
.dvgp-order__list dt { color: var(--muted); }
.dvgp-order__list dd { margin: 0; text-align: right; font-weight: var(--fw-ui); font-variant-numeric: tabular-nums; }
.dvgp-order__bank { margin-top: var(--sp-4); padding-top: var(--sp-4); border-top: 1px solid var(--line); font-size: var(--fs-ui); }
.dvgp-order__bank p { margin: 0 0 var(--sp-1); }

/* SEO / GEO 2026-10-27 (war-games/seo-geo-new-pages.md): the answer paragraph above the form, the package table under
   it (phones: one card per package, the column name before each value), the links to the other booking pages */
.dvgp-answer { padding-block: var(--sp-5) 0; }
.dvgp-answer .dvh-lead { margin: 0; }
.dvgp-pkgs { padding-block: var(--sp-7) 0; }
.dvgp-pkgs .dvh-h2 { margin: 0 0 var(--sp-4); }
.dvgp-table { width: 100%; border-collapse: collapse; font-size: var(--fs-ui); line-height: 1.5; }
.dvgp-table th, .dvgp-table td { padding: var(--sp-3); border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.dvgp-table thead th { font-size: var(--fs-meta); font-weight: var(--fw-strong); color: var(--muted); }
.dvgp-table tbody th { font-weight: var(--fw-strong); }
.dvgp-table .dvgp-table__price { text-align: right; white-space: nowrap; font-weight: var(--fw-strong); font-variant-numeric: tabular-nums; }
.dvgp-pkgs__note { margin-top: var(--sp-3); }
@media (max-width: 760px) {
  .dvgp-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .dvgp-table, .dvgp-table tbody, .dvgp-table tr, .dvgp-table th, .dvgp-table td { display: block; }
  .dvgp-table tr { padding-block: var(--sp-3); border-bottom: 1px solid var(--line); }
  .dvgp-table th, .dvgp-table td { padding: var(--sp-1) 0; border: 0; }
  .dvgp-table td::before { content: attr(data-label) ": "; font-weight: var(--fw-strong); color: var(--muted); }
  .dvgp-table .dvgp-table__price { text-align: left; }
}
.dvgp-xlinks { padding-block: var(--sp-7); }
.dvgp-xlinks__list { display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-5); margin: var(--sp-3) 0 0; padding: 0; list-style: none; }