/* Feinkost Jiménez: Vorbestellseite. Ergänzt site.css, nutzt dessen Variablen.
   Liegt extern, weil die Live-CSP für /bestellen.html nur style-src 'self' erlaubt (kein style="", kein <style>).
   Zielt auf: assets/css/vorbestellung.css */
.vb-eyebrow{margin-bottom:0}
.vb-h1{margin-top:18px}
.vb-first{padding-top:clamp(28px,5vh,60px)}
/* 12.10.2026: Anker landen nicht mehr unter dem festen Kopf; Probier-Set-Block tritt vor (Davids Rückmeldung) */
#probierset,#flaschen,#bestellung,#produkt{scroll-margin-top:96px}
.vb-sofort{border:1px solid rgba(230,197,120,.55);box-shadow:0 30px 60px -40px rgba(44,55,32,.6)}
.vb-sofort h2{font-size:clamp(32px,5.2vw,52px)}
.vb-sofort-preis .btn{min-height:58px;font-size:16px}
.vb-sect{padding-top:0}
.vb-eyebrow-gold{color:var(--gold-2)}
.vb-h2-light{color:#f7f1e4}

/* Sofort-Block (Probier-Set) */
.vb-sofort{background:radial-gradient(130% 130% at 50% -10%,#3c4a2a,#222b18);color:#f1ecda;border-radius:clamp(22px,4vw,34px);padding:clamp(28px,5vw,46px) var(--gut);display:grid;gap:26px;align-items:center}
@media(min-width:820px){.vb-sofort{grid-template-columns:1.2fr 1fr}}
.vb-sofort-text p{color:rgba(247,241,228,.9);max-width:50ch;margin-top:12px}
.vb-sofort-preis{display:grid;gap:10px;justify-items:start}
@media(min-width:820px){.vb-sofort-preis{justify-items:end;text-align:right}}
.vb-z{font:600 56px/1 'Cormorant Garamond',serif;color:var(--gold-2)}
.vb-sofort-preis small{font-size:13px;color:rgba(247,241,228,.78);line-height:1.5;max-width:34ch}
.vb-sofort-preis .btn{margin-top:6px}

/* Mengen-Kacheln */
.vb-tiles{display:grid;gap:12px;margin-top:28px;grid-template-columns:repeat(2,1fr)}
@media(min-width:720px){.vb-tiles{grid-template-columns:repeat(5,1fr)}}
.vb-tile{position:relative;display:flex;flex-direction:column;gap:4px;background:var(--cream);border:1px solid var(--line);border-radius:16px;padding:18px 16px;cursor:pointer;transition:border-color .25s,box-shadow .25s}
.vb-tile:hover{border-color:var(--gold)}
.vb-tile.on{border-color:var(--gold);box-shadow:0 0 0 3px rgba(194,151,60,.18)}
.vb-tile input{position:absolute;opacity:0;pointer-events:none}
.vb-tile:focus-within{outline:2px solid var(--gold);outline-offset:3px}
.vb-n{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--olive);font-weight:500}
.vb-p{font:600 30px/1 'Cormorant Garamond',serif;color:var(--olive);margin-top:4px}
.vb-s{font-size:12.5px;color:var(--muted);line-height:1.45}
.vb-note{font-size:13.5px;color:var(--muted);margin-top:16px;max-width:70ch}
.vb-note a{color:var(--olive-soft);text-decoration:underline}

/* Formular */
.vb-box{background:linear-gradient(160deg,var(--cream),#f1e8d6);border:1px solid var(--line);border-radius:clamp(22px,4vw,34px);padding:clamp(30px,5vw,54px) var(--gut);box-shadow:0 40px 80px -50px rgba(44,55,32,.5)}
.vb-zwei{display:grid;gap:0 18px;grid-template-columns:1fr}
@media(min-width:680px){.vb-zwei{grid-template-columns:1fr 1fr}.vb-plz{grid-template-columns:140px 1fr}}
.field input[type=number],.field input[type=tel]{font-family:inherit;font-size:15px;padding:13px 16px;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--ink);min-height:48px}
.field input[aria-invalid="true"]{border-color:#a23b2c}
.vb-haken{display:flex;gap:10px;align-items:flex-start;margin-top:22px;font-size:14.5px;color:#3f3b2c;cursor:pointer}
.vb-haken input{margin-top:4px;accent-color:var(--gold)}
#vb-geschenkfelder{margin-top:6px;padding:4px 18px 18px;border:1px dashed var(--line);border-radius:14px}
.vb-summe{margin-top:26px;background:var(--olive);color:#f7f1e4;border-radius:18px;padding:22px 24px}
.vb-summe .z{font:600 34px/1 'Cormorant Garamond',serif;color:#e6c578;margin-bottom:8px}
.vb-summe .r{display:flex;justify-content:space-between;gap:16px;font-size:14.5px;padding:6px 0;border-bottom:1px solid rgba(247,241,228,.14)}
.vb-summe .r:last-child{border:0}
.vb-summe .r b{font-weight:500;color:#e6c578;text-align:right}
.vb-summe .r.leer{color:#ffd9d0}
.vb-fehler{color:#a23b2c;font-size:13.5px;margin-top:12px;min-height:1.4em}
.vb-aktionen{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}
.vb-aktionen .btn{justify-content:center}
.vb-copy{background:transparent;color:var(--olive);border-color:var(--olive)}
.vb-legal{font-size:12.5px;color:var(--muted);margin-top:16px;line-height:1.6}
.vb-legal a{color:var(--olive-soft);text-decoration:underline}

/* Pflichtangaben */
.vb-lmiv-grid{display:grid;gap:28px;margin-top:30px;grid-template-columns:1fr}
@media(min-width:820px){.vb-lmiv-grid{grid-template-columns:1.3fr 1fr}}
.vb-lmiv dl{display:grid;grid-template-columns:auto 1fr;gap:10px 18px;font-size:15px}
.vb-lmiv dt{color:var(--olive);font-weight:500}
.vb-lmiv dd{color:#3f3b2c}
.vb-tab{width:100%;border-collapse:collapse;font-size:14.5px;align-self:start}
.vb-tab caption{text-align:left;font-weight:500;color:var(--olive);padding-bottom:8px}
.vb-tab td{padding:8px 6px;border-bottom:1px solid var(--line)}
.vb-tab td:last-child{text-align:right;white-space:nowrap}

/* FAQ */
.vb-faq details{border-bottom:1px solid var(--line);padding:14px 0}
.vb-faq summary{cursor:pointer;font-family:'Cormorant Garamond',serif;font-size:24px;color:var(--olive);list-style:none}
.vb-faq summary::-webkit-details-marker{display:none}
.vb-faq summary::before{content:"+";display:inline-block;width:22px;color:var(--gold)}
.vb-faq details[open] summary::before{content:"–"}
.vb-faq p{margin-top:8px;max-width:65ch;color:#3f3b2c}
.vb-bar-gold{background:var(--gold);color:var(--olive);border-color:var(--gold)}
/* 13.10.2026 Bald-Modus: Preise sichtbar, Bestellung noch aus */
.vb-bald{display:block;margin-top:10px;font-size:13px;opacity:.78}
.vb-tiles-info .vb-tile{cursor:default}
.vb-cta{margin-top:22px;align-items:center;gap:14px}
.vb-cta .vb-bald{margin-top:0}
