/*
 * VIPecase – Zusatzstile für geschenkgutschein.html und veranstaltungen.html.
 * Baut ausschließlich auf den Variablen und Bausteinen von main.css/booking.css auf (keine eigenen Farben oder Schriften).
 */

/* ---- Gutschein: Wertauswahl ---- */
.gv-amounts { border: 0; margin: 0; padding: 0; min-width: 0; display: grid; gap: 10px; }
.gv-amounts > legend { font-weight: 700; font-size: var(--fs-2); padding: 0; margin-bottom: 8px; }
.gv-amount-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 10px; }
.gv-amount { justify-content: center; text-align: center; }
.gv-amount b { font-size: var(--fs-3); }
.gv-amounts .hint.err[hidden], .field .hint.err[hidden] { display: none; }

/* ---- Gutschein: Ergebnis nach der Bestellung ---- */
.gv-success { display: grid; gap: 16px; padding: 4px 0; }
.gv-success[hidden] { display: none; }
.gv-success:focus { outline: none; }
.gv-success .contact-success-title { margin: 0; }
.gv-success .bon-pay { display: grid; gap: 12px; }
.gv-success .bank-list { margin: 0; }

/* ---- Veranstaltungen ---- */
.ev-rules { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.ev-rules li { padding-left: 1.4em; position: relative; line-height: 1.5; }
.ev-rules li::before { content: ""; position: absolute; left: 0; top: .6em; width: .6em; height: .6em; border-radius: 50%; background: var(--pink); }
.ev-types { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.ev-types li { background: #fff; border-radius: 18px; padding: 20px; box-shadow: inset 0 0 0 1.5px var(--line-strong); display: grid; gap: 8px; align-content: start; }
.ev-types h3 { margin: 0; }
.ev-types p { margin: 0; color: var(--ink-2); line-height: 1.5; }
.ev-types h3 { hyphens: manual; }

/* Gruppengrößen: zwei Veranstaltungsmodelle (klein 1 bis 12, groß 13 bis 30) */
.ev-models-section { background: var(--cream); }
.ev-models-intro { max-width: 62ch; display: grid; gap: 10px; margin-bottom: 28px; }
.ev-models-intro h2 { margin: 0 0 4px; }
.ev-models-intro p { margin: 0; color: var(--ink-2); line-height: 1.55; }
.ev-models { display: grid; gap: 40px 24px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); align-items: stretch; }
.ev-model { background: #fff; border-radius: 22px; padding: 28px; box-shadow: inset 0 0 0 1.5px var(--line-strong), 0 14px 28px -20px rgb(32 26 50 / 0.35); display: grid; gap: 14px; align-content: start; }
.ev-model--large { background: #fff0f6; box-shadow: inset 0 0 0 2px var(--pink), 0 14px 28px -20px rgb(32 26 50 / 0.35); }
.ev-model h3 { margin: 0; }
.ev-model p { margin: 0; color: var(--ink-2); line-height: 1.55; }
.ev-model .ev-model-badge { justify-self: start; margin: -4px 0 0; padding: 8px 18px; border-radius: 999px; background: var(--pink-soft); color: var(--ink); font-weight: 800; font-size: var(--fs-3); line-height: 1.3; }
.ev-model .btn { justify-self: start; margin-top: 4px; }
.ev-callback { border: 0; margin: 0; padding: 0; min-width: 0; display: grid; gap: 14px; }
.ev-callback > legend { font-weight: 700; font-size: var(--fs-2); padding: 0; margin-bottom: 4px; }
.ev-callback .hint { margin: 0; }
.ev-success { display: grid; gap: 16px; }
.ev-success[hidden] { display: none; }
.ev-success:focus { outline: none; }
