/* ══════════════════════════════════════════════════════════════════════════
   VICTORY OF ART — paginile de susținere
   ══════════════════════════════════════════════════════════════════════════

   Fișierul nu conține nicio culoare care să nu poată fi schimbată din admin.
   Valorile de mai jos sunt doar rezerve: clasa VA_Theme injectează inline
   variabilele configurate în Settings → Formular 230 → Aspect, iar acelea
   au prioritate.

   Tipografia e moștenită de la temă, intenționat. Personalitatea vine din
   dimensiune, greutate, spațiere între litere și majuscule — nu din alt font
   suprapus peste cel al site-ului.

   Paleta implicită: fundalul nu e negru, e prună închisă, culoarea fotoliilor
   dintr-o sală înainte de ridicarea cortinei. Accentele sunt gel-uri de
   reflector — chihlimbar cald ca lumină principală, albastru-oțel rece ca
   contralumină.
   ══════════════════════════════════════════════════════════════════════════ */

.vo {
  --vo-ink:      #150d13;
  --vo-house:    #221520;
  --vo-edge:     #3b2634;
  --vo-straw:    #f0b25c;
  --vo-steel:    #8fb4d4;
  --vo-paper:    #f5ece1;
  --vo-muted:    #b09aa4;
  --vo-radius:   5px;
  --vo-latime:   860px;
  --vo-straw-a:  rgba(240,178,92,.20);
  --vo-straw-b:  rgba(240,178,92,.07);
  --vo-straw-c:  rgba(240,178,92,.45);
  --vo-steel-a:  rgba(143,180,212,.14);
  --vo-steel-b:  rgba(143,180,212,.05);
  --vo-chip:     #fbf7f2;
  --vo-gap:      clamp(48px, 7vw, 96px);

  /* Bandă pe toată lățimea, fără derulare orizontală.
     Varianta cu `width:100vw` pare echivalentă, dar 100vw include lățimea barei
     de derulare, deci pe desktop iese cu 15–17 px în afara ecranului. Marginile
     negative pe ambele laturi, fără width explicit, dau același rezultat vizual
     fără defectul ăsta. */
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  max-width: none;
  padding: clamp(40px, 6vw, 88px) 0 clamp(56px, 8vw, 104px);

  position: relative;
  overflow: hidden;
  background: var(--vo-ink);
  color: var(--vo-paper);
  font-family: inherit;
  font-size: clamp(16px, 1.05vw + 12px, 18px);
  line-height: 1.62;
}

/* două secțiuni lipite nu trebuie să lase o cusătură dublă de padding */
.vo + .vo { padding-top: 0; }

/* cross-light: cald din dreapta-sus, rece din stânga-jos */
.vo::before,
.vo::after {
  content: "";
  position: absolute;
  pointer-events: none;
  border-radius: 50%;
  filter: blur(10px);
}
.vo::before {
  top: -18%; right: -10%;
  width: 62vw; height: 52vw;
  background: radial-gradient(ellipse at center,
    var(--vo-straw-a) 0%, var(--vo-straw-b) 42%, transparent 72%);
}
.vo::after {
  bottom: -22%; left: -14%;
  width: 54vw; height: 46vw;
  background: radial-gradient(ellipse at center,
    var(--vo-steel-a) 0%, var(--vo-steel-b) 45%, transparent 74%);
}

.vo-wrap {
  position: relative;
  z-index: 1;
  max-width: var(--vo-latime);
  margin: 0 auto;
  padding: 0 clamp(20px, 5vw, 40px);
}

/* ─── eyebrow ────────────────────────────────────────────────────────── */

.vo-eyebrow {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 22px;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--vo-straw);
}
.vo-eyebrow::after {
  content: "";
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, var(--vo-straw-c), transparent);
}

/* ─── titluri ────────────────────────────────────────────────────────── */

.vo .vo-h1 {
  margin: 0 0 28px;
  font-size: clamp(2.3rem, 6.4vw, 4rem);
  font-weight: 800;
  line-height: 1.02;
  letter-spacing: -.02em;
  text-wrap: balance;
  color: var(--vo-paper);
}

/* cuvântul în contur — firma luminoasă a teatrului */
.vo-hollow {
  color: transparent;
  -webkit-text-stroke: 1.5px var(--vo-straw);
  paint-order: stroke fill;
}
@supports not (-webkit-text-stroke: 1px black) {
  .vo-hollow { color: var(--vo-straw); }
}

.vo h2 {
  margin: var(--vo-gap) 0 20px;
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 750;
  line-height: 1.14;
  letter-spacing: -.015em;
  text-wrap: balance;
  color: var(--vo-paper);
}
.vo h2::after {
  content: "";
  display: block;
  width: 72px;
  height: 2px;
  margin-top: 16px;
  background: linear-gradient(90deg, var(--vo-straw), transparent);
}
.vo h3 {
  margin: 40px 0 12px;
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--vo-paper);
}
.vo p { margin: 0 0 1.1em; }
.vo a { color: var(--vo-straw); text-decoration-thickness: 1px; text-underline-offset: 3px; }
.vo a:hover { filter: brightness(1.14); }
.vo strong { color: #fff; font-weight: 700; }
.vo em { font-style: italic; }

.vo-deck { font-size: 1.12em; max-width: 62ch; }

/* ─── citat ──────────────────────────────────────────────────────────── */

.vo-quote {
  margin: 36px 0;
  padding: 0 0 0 26px;
  border-left: 2px solid var(--vo-steel);
  font-size: 1.14em;
  font-style: italic;
  opacity: .94;
}
.vo-quote cite {
  display: block;
  margin-top: 14px;
  font-size: .78em;
  font-style: normal;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--vo-muted);
  opacity: 1;
}

/* ─── cifra de deschidere ────────────────────────────────────────────── */

.vo-stat {
  display: grid;
  gap: 4px 26px;
  grid-template-columns: auto 1fr;
  align-items: baseline;
  margin: 0 0 32px;
  padding: 24px 0;
  border-top: 1px solid var(--vo-edge);
  border-bottom: 1px solid var(--vo-edge);
}
.vo-stat b {
  font-size: clamp(2.4rem, 6vw, 3.4rem);
  font-weight: 800;
  line-height: .9;
  letter-spacing: -.03em;
  color: var(--vo-straw);
  font-variant-numeric: tabular-nums;
}
.vo-stat span { color: var(--vo-muted); font-size: .95em; }
.vo-stat small {
  grid-column: 1 / -1;
  margin-top: 10px;
  font-size: .8em;
  color: var(--vo-muted);
  opacity: .78;
}

/* ─── pași ───────────────────────────────────────────────────────────── */

.vo-steps { counter-reset: pas; list-style: none; margin: 28px 0; padding: 0; }
.vo-steps li {
  counter-increment: pas;
  position: relative;
  padding: 0 0 0 56px;
  margin-bottom: 26px;
  min-height: 36px;
}
.vo-steps li::before {
  content: counter(pas);
  position: absolute;
  left: 0; top: -2px;
  width: 34px; height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid var(--vo-straw-c);
  border-radius: 50%;
  font-size: .95rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--vo-straw);
}

/* ─── plan de lumini ─────────────────────────────────────────────────── */

.vo-plot { list-style: none; margin: 24px 0; padding: 0; }
.vo-plot li {
  position: relative;
  padding: 18px 0 18px 30px;
  border-bottom: 1px solid var(--vo-edge);
}
.vo-plot li::before {
  content: "";
  position: absolute;
  left: 0; top: 26px;
  width: 9px; height: 9px;
  border-radius: 50%;
  background: var(--vo-straw);
  box-shadow: 0 0 0 4px var(--vo-straw-b), 0 0 14px 2px var(--vo-straw-a);
}
.vo-plot b { display: block; color: #fff; margin-bottom: 3px; }
.vo-plot span { color: var(--vo-muted); font-size: .96em; }

/* ─── fișa tehnică ───────────────────────────────────────────────────── */

.vo-facts {
  margin: 28px 0;
  padding: 26px 28px;
  background: var(--vo-house);
  border: 1px solid var(--vo-edge);
  border-radius: var(--vo-radius);
}
.vo-facts dl {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px 28px;
  margin: 0;
  font-size: .95em;
}
.vo-facts dt {
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--vo-muted);
  padding-top: 3px;
}
.vo-facts dd {
  margin: 0;
  font-weight: 650;
  color: #fff;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}

/* ─── termen limită ──────────────────────────────────────────────────── */

.vo-deadline {
  margin: 36px 0;
  padding: 20px 24px;
  border-left: 3px solid var(--vo-straw);
  background: var(--vo-straw-b);
  font-size: .97em;
}
.vo-deadline b {
  display: block;
  margin-bottom: 5px;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--vo-straw);
}

/* ─── plafonul de sponsorizare ───────────────────────────────────────── */

.vo-cap {
  margin: 30px 0;
  padding: 26px 28px;
  background: var(--vo-house);
  border: 1px solid var(--vo-edge);
  border-radius: var(--vo-radius);
}
.vo-cap p { margin: 0 0 14px; }
.vo-cap ul { list-style: none; margin: 0 0 16px; padding: 0; }
.vo-cap li { padding: 10px 0 10px 26px; position: relative; border-bottom: 1px solid var(--vo-edge); }
.vo-cap li:last-child { border-bottom: 0; }
.vo-cap li::before {
  content: "";
  position: absolute;
  left: 0; top: 19px;
  width: 12px; height: 1px;
  background: var(--vo-steel);
}
.vo-cap b { color: var(--vo-steel); }
.vo-cap .vo-cap-note { margin: 0; font-size: .93em; color: var(--vo-muted); }

/* ─── BILETELE: elementul-semnătură ──────────────────────────────────── */

.vo-tickets {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(196px, 1fr));
  gap: 20px;
  margin: 32px 0;
}
.vo-ticket {
  position: relative;
  display: block;
  padding: 28px 22px 22px;
  background:
    linear-gradient(168deg, rgba(255,255,255,.05) 0%, rgba(255,255,255,0) 62%),
    var(--vo-house);
  border: 1px solid var(--vo-edge);
  border-radius: var(--vo-radius);
  text-decoration: none;
  color: var(--vo-paper);
  transition: transform .22s cubic-bezier(.2,.7,.3,1), border-color .22s, box-shadow .22s;
}
/* perforația: două decupaje pe laturi, ca la un bilet rupt din carnet */
.vo-ticket::before,
.vo-ticket::after {
  content: "";
  position: absolute;
  bottom: 58px;
  width: 15px; height: 15px;
  border-radius: 50%;
  background: var(--vo-ink);
  border: 1px solid var(--vo-edge);
}
.vo-ticket::before { left: -8px; clip-path: inset(0 0 0 45%); }
.vo-ticket::after  { right: -8px; clip-path: inset(0 45% 0 0); }

.vo-ticket:hover {
  transform: translateY(-4px);
  border-color: var(--vo-straw-c);
  box-shadow: 0 14px 34px -10px var(--vo-straw-a);
  text-decoration: none;
  filter: none;
}
.vo-ticket:focus-visible { outline: 2px solid var(--vo-straw); outline-offset: 3px; }

.vo-t-row {
  font-size: .64rem;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--vo-muted);
}
.vo-t-sum {
  display: block;
  margin: 10px 0 6px;
  font-size: 2.15rem;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -.03em;
  color: var(--vo-straw);
  font-variant-numeric: tabular-nums;
}
.vo-t-what {
  display: block;
  padding-top: 20px;
  margin-top: 14px;
  border-top: 1px dashed var(--vo-edge);
  font-size: .88em;
  color: var(--vo-muted);
  min-height: 42px;
}
.vo-ticket--open { border-style: dashed; }
.vo-ticket--open .vo-t-sum { font-size: 1.45rem; letter-spacing: -.01em; }

/* ─── abonament lunar ────────────────────────────────────────────────── */

.vo-sub {
  margin: 36px 0;
  padding: 28px;
  background: var(--vo-house);
  border: 1px solid var(--vo-edge);
  border-radius: var(--vo-radius);
}
.vo-sub p { margin: 0 0 18px; }
.vo-sub-tiers { display: flex; flex-wrap: wrap; gap: 12px; }

/* ─── butoane ────────────────────────────────────────────────────────── */

.vo .vo-btn {
  display: inline-block;
  padding: 14px 26px;
  background: var(--vo-straw);
  color: var(--vo-ink);
  border-radius: var(--vo-radius);
  font-weight: 750;
  font-size: .97em;
  text-decoration: none;
  transition: filter .18s, transform .18s;
}
.vo .vo-btn:hover { filter: brightness(1.08); transform: translateY(-2px); text-decoration: none; }
.vo .vo-btn--ghost {
  background: transparent;
  color: var(--vo-straw);
  border: 1px solid var(--vo-edge);
}
.vo .vo-btn--ghost:hover { border-color: var(--vo-straw); filter: none; }
.vo a:focus-visible { outline: 2px solid var(--vo-straw); outline-offset: 3px; }

.vo-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }

/* ─── insigne de plată ───────────────────────────────────────────────────
   Logo-urile stau pe cipuri deschise, nu direct pe fundal. Motivul e de
   conformitate: Visa, Mastercard, Apple și Google interzic recolorarea
   mărcilor lor, iar cipul rezolvă contrastul fără să atingem logo-ul. */

.vo-badges { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 26px; }
.vo-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 38px;
  min-width: 60px;
  padding: 0 12px;
  background: var(--vo-chip);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--vo-radius);
  opacity: .88;
  transition: opacity .2s;
}
.vo-badge:hover { opacity: 1; }
.vo-badge img { display: block; height: 20px; width: auto; max-width: 92px; }
.vo-badge[hidden] { display: none; }

/* ─── semnale de încredere ───────────────────────────────────────────── */

.vo-trust {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 28px;
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid var(--vo-edge);
  font-size: .84em;
  color: var(--vo-muted);
}

/* ─── întrebări ──────────────────────────────────────────────────────── */

.vo-faq { margin-top: 26px; }
.vo-faq > div { padding: 22px 0; border-bottom: 1px solid var(--vo-edge); }
.vo-faq b { display: block; margin-bottom: 7px; color: #fff; font-weight: 700; }
.vo-faq p { margin: 0; color: var(--vo-muted); font-size: .97em; }

.vo-note { font-size: .89em; color: var(--vo-muted); }

/* ─── pagina de mulțumire ────────────────────────────────────────────── */

.vo--center .vo-wrap { max-width: 660px; text-align: center; }
.vo--center .vo-h1 { font-size: clamp(2.1rem, 5.4vw, 3.2rem); }
.vo--center .vo-quote,
.vo--center .vo-plot,
.vo--center .vo-facts { text-align: left; }
.vo--center .vo-actions { justify-content: center; }
.vo--center h2::after {
  margin-left: auto;
  margin-right: auto;
  background: linear-gradient(90deg, transparent, var(--vo-straw), transparent);
}

.vo-spot {
  width: 108px; height: 108px;
  margin: 0 auto 30px;
  border-radius: 50%;
  background: radial-gradient(circle at 50% 42%,
    var(--vo-straw-a) 0%, var(--vo-straw-b) 46%, transparent 70%);
  display: grid;
  place-items: center;
  animation: vo-fade-up .9s cubic-bezier(.2,.7,.3,1) both;
}
.vo-spot svg {
  width: 34px; height: 34px;
  stroke: var(--vo-straw);
  stroke-width: 2.2;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

@keyframes vo-fade-up {
  from { opacity: 0; transform: scale(.86); }
  to   { opacity: 1; transform: scale(1); }
}

/* ─── responsive ─────────────────────────────────────────────────────── */

@media (max-width: 640px) {
  .vo-facts dl { grid-template-columns: 1fr; gap: 3px 0; }
  .vo-facts dt { margin-top: 14px; }
  .vo-facts dt:first-child { margin-top: 0; }
  .vo-stat { grid-template-columns: 1fr; }
  .vo-steps li { padding-left: 46px; }
  .vo-steps li::before { width: 30px; height: 30px; font-size: .88rem; }
  .vo-sub-tiers { flex-direction: column; }
  .vo-sub-tiers .vo-btn { text-align: center; }
  .vo-actions { flex-direction: column; }
  .vo-actions .vo-btn { text-align: center; }
  .vo-badge { height: 34px; min-width: 52px; padding: 0 9px; }
  .vo-badge img { height: 17px; }
  .vo::before, .vo::after { width: 120vw; height: 90vw; }
}

/* ─── accesibilitate ─────────────────────────────────────────────────── */

@media (prefers-reduced-motion: reduce) {
  .vo *, .vo *::before, .vo *::after { animation: none !important; transition: none !important; }
  .vo-ticket:hover, .vo .vo-btn:hover { transform: none; }
}

/* ─── fotografie de fundal în erou ───────────────────────────────────────
   Imaginea stă într-un element propriu, nu ca background-image, ca WordPress
   să poată livra dimensiunea potrivită prin srcset. Vălul este un gradient,
   nu o opacitate uniformă: mai transparent sus, unde fotografia trebuie să se
   vadă, mai dens jos, unde începe textul. Intensitatea se reglează din admin. */

.vo-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}
.vo-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 32%;
  display: block;
}
.vo-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, var(--vo-scrim-sus) 0%, var(--vo-scrim-jos) 78%, var(--vo-ink) 100%);
}
/* cu fotografie, halourile de reflector ar murdări imaginea */
.vo--photo::before,
.vo--photo::after { display: none; }
.vo--photo { padding-top: clamp(64px, 11vw, 148px); }

/* ─── bandă foto între secțiuni ──────────────────────────────────────────
   O fotografie de spectacol, la lățimea coloanei de text, cu legendă opțională.
   Nu recolorăm fotografia: un chenar subtil o leagă de paletă fără să atingem
   imaginea. */

.vo-photo { margin: var(--vo-gap) 0; }
.vo-photo img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--vo-radius);
  border: 1px solid var(--vo-edge);
}
.vo-photo figcaption {
  margin-top: 12px;
  padding-left: 14px;
  border-left: 2px solid var(--vo-straw);
  font-size: .86em;
  line-height: 1.5;
  color: var(--vo-muted);
}

/* pe pagina de mulțumire, fotografia ține locul reflectorului */
.vo--center .vo-photo { margin-top: 0; }
.vo--center .vo-photo figcaption { text-align: left; }

/* ─── formularul, ca fișă albă pe scena întunecată ───────────────────────
   Formularul rămâne luminos, nu se scufundă în paleta paginii. Motivul nu e
   estetic: pe fundal întunecat, câmpurile de completat și textul introdus de
   utilizator devin greu de citit, iar la un formular unde se scrie un CNP
   lizibilitatea bate coerența cromatică.

   Vizual, contrastul lucrează în favoarea noastră: pagina e sala, formularul e
   foaia albă de sub reflector. */

.vo .f230 {
  width: auto;
  max-width: none;
  margin: clamp(30px, 4.5vw, 52px) 0 0;
  padding: clamp(24px, 3.4vw, 40px) clamp(20px, 3vw, 36px);
  background: #fff;
  border-radius: var(--vo-radius);
  box-shadow: 0 20px 50px -22px rgba(0, 0, 0, .6);
  color: #1c2024;
}
.vo .f230 .f230-form { max-width: none; margin: 0; padding: 0; }

/* fieldset-urile nu mai au nevoie de chenar propriu în interiorul cartonașului */
.vo .f230 .f230-fs {
  border: 0;
  border-top: 1px solid #e6e8ec;
  border-radius: 0;
  padding: 22px 0 6px;
  margin: 0;
}
.vo .f230 .f230-fs:first-of-type { border-top: 0; padding-top: 0; }
.vo .f230 .f230-fs legend { padding: 0; }

/* accentul butonului urmează paleta paginii, ca să nu pară un corp străin */
.vo .f230 .f230-submit button {
  background: var(--vo-straw);
  color: var(--vo-ink);
  border-radius: var(--vo-radius);
  font-weight: 750;
}
.vo .f230 input:focus {
  border-color: var(--vo-straw);
  box-shadow: 0 0 0 3px var(--vo-straw-b);
}
.vo .f230 a { color: #1f3a93; }

/* după formular urmează întrebările sau încărcarea: le dăm aer, nu o graniță */
.vo .f230 + h2,
.vo .f230 + p + h2 { margin-top: var(--vo-gap); }
.vo .f230 + .f230 { margin-top: clamp(20px, 2.6vw, 30px); }

/* ─── headerul paginii ───────────────────────────────────────────────────
   Bandă proprie, deasupra conținutului: firimituri, supratitlu, titlu mare,
   subtitlu. Conținutul stă aliniat la bază, nu centrat vertical — așa titlul
   „se ridică” din fotografie, ca un actor care intră în lumină, iar privirea
   coboară natural spre text.

   Când există fotografie, headerul se termină într-un degrade către fundalul
   paginii, deci nu apare nicio linie de tăietură între header și conținut. */

.vo-header {
  position: relative;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  max-width: none;
  min-height: var(--vo-hdr-h, 62vh);
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  background: var(--vo-ink);
  color: var(--vo-paper);
  font-family: inherit;
  padding: clamp(72px, 12vw, 150px) 0 clamp(34px, 5vw, 60px);
}
.vo-header .vo-wrap { width: 100%; }

/* fără fotografie: un halou cald ține locul luminii de scenă */
.vo-header:not(.vo-header--foto)::before {
  content: "";
  position: absolute;
  top: -30%; left: 50%;
  width: 78vw; height: 62vw;
  transform: translateX(-50%);
  pointer-events: none;
  background: radial-gradient(ellipse at center,
    var(--vo-straw-a) 0%, var(--vo-straw-b) 44%, transparent 72%);
}

.vo-crumbs {
  position: relative;
  z-index: 1;
  margin: 0 0 22px;
  font-size: .78rem;
  letter-spacing: .04em;
  color: var(--vo-muted);
}
.vo-crumbs a { color: var(--vo-muted); text-decoration: none; }
.vo-crumbs a:hover { color: var(--vo-straw); text-decoration: underline; }
.vo-crumbs-sep { margin: 0 8px; opacity: .5; }
.vo-crumbs [aria-current] { color: var(--vo-paper); }

.vo-header .vo-h1 {
  margin: 0;
  font-size: clamp(2.5rem, 7vw, 4.6rem);
  line-height: .98;
}

.vo-header-sub {
  margin: 24px 0 0;
  max-width: 54ch;
  font-size: clamp(1.02rem, 1.4vw, 1.2rem);
  color: var(--vo-paper);
  opacity: .88;
}

/* secțiunea care urmează imediat după header nu mai are nevoie de spațiu sus */
.vo-header + .vo { padding-top: clamp(34px, 5vw, 64px); }

@media (max-width: 640px) {
  .vo-header { min-height: 0; padding-top: clamp(52px, 16vw, 96px); }
  .vo-header .vo-h1 { font-size: clamp(2.1rem, 9vw, 3rem); }
  .vo-crumbs { font-size: .72rem; }
}

/* armură: temele stilizează des nav, a și h1 din conținut */
.vo-header.vo-header h1,
.vo-header.vo-header p,
.vo-header.vo-header span { color: inherit; }
.vo-header.vo-header .vo-crumbs,
.vo-header.vo-header .vo-crumbs a { color: var(--vo-muted); }
.vo-header.vo-header .vo-eyebrow { color: var(--vo-straw); }
.vo-header.vo-header .vo-hollow { color: transparent; }
@supports not (-webkit-text-stroke: 1px black) {
  .vo-header.vo-header .vo-hollow { color: var(--vo-straw); }
}

/* ─── intro, când headerul e al temei ────────────────────────────────────
   Bold Builder randează doar titlul, exact ca pe restul site-ului. Supratitlul
   și subtitlul intră aici, în capul conținutului, cu o linie de accent care le
   leagă vizual de headerul de deasupra. */

.vo-intro {
  margin: 0 0 clamp(26px, 4vw, 44px);
  padding-left: 18px;
  border-left: 2px solid var(--vo-straw);
}
.vo-intro .vo-eyebrow { margin-bottom: 10px; }
.vo-intro .vo-eyebrow::after { display: none; }
.vo-intro .vo-deck { margin: 0; }

/* ══════════════════════════════════════════════════════════════════════════
   ARMURĂ DE AȘEZARE
   ══════════════════════════════════════════════════════════════════════════

   Culorile nu sunt singurul lucru pe care temele îl rescriu. Multe stilizează
   legăturile din conținut — `.entry-content a { display:inline-block }` e
   frecvent — iar atunci cardurile de donație nu mai sunt elemente de grilă, ci
   cutii inline aliniate pe linia de bază. Rezultatul: carduri decalate în scară,
   cu goluri între ele.

   Aici forțăm așezarea cu specificitate (0,2,0) sau mai mare și anulăm explicit
   proprietățile prin care o temă ar putea prelua controlul: float, coloane
   multiple, aliniere pe linia de bază.
   ══════════════════════════════════════════════════════════════════════════ */

.vo .vo-tickets {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 20px;
  align-items: stretch;
  float: none;
  columns: auto;
  column-count: auto;
  text-align: left;
  list-style: none;
}

.vo .vo-tickets > .vo-ticket {
  display: block;
  float: none;
  width: auto;
  min-width: 0;
  max-width: none;
  margin: 0;
  vertical-align: top;
  break-inside: avoid;
  text-align: left;
}

.vo .vo-ticket > span { display: block; }
.vo .vo-ticket .vo-t-row { display: block; }

/* aceleași măsuri pentru celelalte grupuri care se pot destrăma */
.vo .vo-sub-tiers,
.vo .vo-badges,
.vo .vo-trust,
.vo .vo-actions {
  display: flex;
  flex-wrap: wrap;
  float: none;
  columns: auto;
}
.vo .vo-sub-tiers > a,
.vo .vo-actions > a { display: inline-block; float: none; margin: 0; }
.vo .vo-badges > .vo-badge { display: inline-flex; float: none; margin: 0; }

.vo .vo-plot,
.vo .vo-steps { list-style: none; columns: auto; float: none; }
.vo .vo-plot > li,
.vo .vo-steps > li { display: block; float: none; width: auto; break-inside: avoid; }

.vo .vo-facts dl {
  display: grid;
  grid-template-columns: auto 1fr;
  float: none;
  columns: auto;
}

@media (max-width: 520px) {
  .vo .vo-tickets { grid-template-columns: 1fr; }
}

/* ══════════════════════════════════════════════════════════════════════════
   ARMURĂ ÎMPOTRIVA TEMEI — se păstrează ULTIMA în fișier
   ══════════════════════════════════════════════════════════════════════════

   Temele scriu reguli directe pe elemente: `.entry-content p { color:#333 }`,
   specificitate (0,1,1). Regulile noastre de culoare funcționează prin
   moștenire, care nu are specificitate, deci pierd. Pe fundal întunecat asta
   înseamnă text invizibil.

   Forțăm `color: inherit` cu specificitate (0,2,1), prin dublarea clasei, apoi
   reafirmăm excepțiile. Fără `!important`, ca personalizările din Additional CSS
   să rămână posibile.

   Blocul trebuie să rămână ultimul din fișier. Dacă adaugi secțiuni noi,
   pune-le înaintea lui.
   ══════════════════════════════════════════════════════════════════════════ */

.vo.vo p,
.vo.vo li,
.vo.vo span,
.vo.vo strong,
.vo.vo b,
.vo.vo em,
.vo.vo cite,
.vo.vo h1,
.vo.vo h2,
.vo.vo h3,
.vo.vo dt,
.vo.vo dd,
.vo.vo figcaption,
.vo.vo blockquote { color: inherit; }

.vo.vo .vo-eyebrow,
.vo.vo .vo-stat b,
.vo.vo .vo-deadline b,
.vo.vo .vo-t-sum { color: var(--vo-straw); }

.vo.vo .vo-hollow { color: transparent; }
@supports not (-webkit-text-stroke: 1px black) {
  .vo.vo .vo-hollow { color: var(--vo-straw); }
}

.vo.vo .vo-stat span,
.vo.vo .vo-stat small,
.vo.vo .vo-quote cite,
.vo.vo .vo-plot span,
.vo.vo .vo-facts dt,
.vo.vo .vo-cap .vo-cap-note,
.vo.vo .vo-t-row,
.vo.vo .vo-t-what,
.vo.vo .vo-trust span,
.vo.vo .vo-faq p,
.vo.vo .vo-note,
.vo.vo .vo-photo figcaption { color: var(--vo-muted); }

.vo.vo strong,
.vo.vo .vo-plot b,
.vo.vo .vo-facts dd,
.vo.vo .vo-faq b { color: #fff; }

.vo.vo a { color: var(--vo-straw); }
.vo.vo .vo-btn { color: var(--vo-ink); }
.vo.vo .vo-btn--ghost { color: var(--vo-straw); }
.vo.vo .vo-cap b { color: var(--vo-steel); }

/* headerul: temele stilizează des nav, a și h1 din conținut */
.vo-header.vo-header h1,
.vo-header.vo-header p,
.vo-header.vo-header span { color: inherit; }
.vo-header.vo-header .vo-crumbs,
.vo-header.vo-header .vo-crumbs a { color: var(--vo-muted); }
.vo-header.vo-header .vo-eyebrow { color: var(--vo-straw); }
.vo-header.vo-header .vo-hollow { color: transparent; }
@supports not (-webkit-text-stroke: 1px black) {
  .vo-header.vo-header .vo-hollow { color: var(--vo-straw); }
}

/* formularul alb din interiorul paginii: textul lui NU trebuie să moștenească
   paleta întunecată a secțiunii */
.vo .f230.f230,
.vo .f230.f230 p,
.vo .f230.f230 li,
.vo .f230.f230 span,
.vo .f230.f230 label,
.vo .f230.f230 legend,
.vo .f230.f230 b,
.vo .f230.f230 strong { color: #1c2024; }
.vo .f230.f230 .f230-hint,
.vo .f230.f230 .f230-note,
.vo .f230.f230 .f230-howto span,
.vo .f230.f230 .f230-fs legend,
.vo .f230.f230 .f230-drop-label span,
.vo .f230.f230 .f230-filelist .f230-fsize { color: #6b7280; }
.vo .f230.f230 .f230-field label span,
.vo .f230.f230 .f230-req { color: #b32020; }
.vo .f230.f230 .f230-submit button { color: var(--vo-ink); }