/* Gemeinsame Bausteine der öffentlichen Seiten: Barrierefreiheit (Sprunglink, Fokus) und die Branchen-/Messeseiten (Präfix gg-).
   Farbwelt A „Flaschenblau“ (brand.css). Dunkelmodus über html.dark (Schalter im Layout, sonst Systemeinstellung). */
/* Farben: public/css/brand.css (Design-Token). */

/* Barrierefreiheit */
.gg-skip{position:absolute;left:-9999px;top:0;z-index:100;background:var(--gg-deep);color:#fff;padding:.6rem 1rem;border-radius:0 0 .5rem 0;font-weight:600}
.gg-skip:focus{left:0}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--gg-focus);outline-offset:2px;border-radius:2px}
main:focus{outline:none}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Mobile Navigation (unter 768 px; darüber gilt die Leiste im Layout) */
.gg-mnav{display:block}
@media(min-width:1100px){.gg-mnav{display:none}}
/* Kopfzeile: Menü kompakt, bis genug Platz da ist (sonst läuft die Seite seitlich über) */
@media(max-width:1099px){.gg-dnav{display:none!important}}
@media(max-width:1679px){.gg-nav-low{display:none!important}.gg-search input{width:11rem!important}}
@media(max-width:519px){.gg-nav-xs{display:none!important}.gg-search input{width:7rem!important}}
@media(max-width:1239px){.gg-nav-mid{display:none!important}.gg-search input{width:9.5rem!important}}
.gg-mnav summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:.35rem;padding:.4rem .7rem;border:1px solid var(--gg-border);border-radius:.5rem;font-size:.85rem;font-weight:600}
.gg-mnav summary::-webkit-details-marker{display:none}
.gg-mnav nav{position:absolute;left:0;right:0;top:100%;z-index:40;background:var(--gg-surface);border-bottom:1px solid var(--gg-border);padding:.5rem 1rem 1rem;display:grid;grid-template-columns:1fr 1fr;gap:.25rem}
.gg-mnav nav a{padding:.55rem .6rem;border-radius:.4rem;font-size:.92rem;color:var(--gg-text)}
.gg-mnav nav a:hover{background:var(--gg-tint)}

/* Seiten-Bausteine */
.gg-wrap{max-width:72rem;margin:0 auto;padding:0 1rem}
.gg-narrow{max-width:46rem;margin:0 auto;padding:0 1rem}
.gg-hero{background:linear-gradient(135deg,#0e4d78,#1772ab);color:#fff;padding:3rem 0 3.25rem}
html.dark .gg-hero{background:linear-gradient(135deg,#082f49,#0d4a72)}
.gg-hero h1{font-size:clamp(1.7rem,4.5vw,2.6rem);font-weight:800;line-height:1.15;margin:0 0 .75rem}
.gg-hero p{font-size:1.08rem;max-width:42rem;margin:0 0 1.5rem;color:#e0f2fe}
.gg-eyebrow{font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;font-weight:700;color:#bfe3f7;margin-bottom:.5rem}
.gg-btns{display:flex;flex-wrap:wrap;gap:.75rem}
.gg-btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;padding:.7rem 1.25rem;border-radius:.6rem;background:var(--gg-btn);color:#fff;font-weight:700;border:2px solid var(--gg-btn);text-decoration:none;cursor:pointer;font-size:1rem;min-height:44px}
.gg-btn:hover{background:var(--gg-btn-hover);border-color:var(--gg-btn-hover)}
.gg-btn[disabled]{opacity:.6;cursor:wait}
.gg-btn-light{background:#fff;color:var(--gg-deep);border-color:#fff}
.gg-btn-light:hover{background:#e0f2fe;border-color:#e0f2fe}
.gg-btn-ghost{background:transparent;color:#fff;border-color:#bfe3f7}
.gg-btn-ghost:hover{background:rgba(255,255,255,.14);border-color:#fff}
.gg-btn-ghost-dark{background:transparent;color:var(--gg-btn);border-color:var(--gg-btn)}
.gg-btn-ghost-dark:hover{background:var(--gg-tint);color:var(--gg-btn-hover)}
.gg-section{padding:2.5rem 0}
.gg-section h2{font-size:1.5rem;font-weight:800;margin:0 0 .5rem;color:var(--gg-text)}
.gg-lead{color:var(--gg-muted);max-width:44rem;margin:0 0 1.5rem}
.gg-grid{display:grid;gap:1rem;grid-template-columns:1fr}
@media(min-width:640px){.gg-grid-2,.gg-grid-3{grid-template-columns:1fr 1fr}}
@media(min-width:960px){.gg-grid-3{grid-template-columns:repeat(3,1fr)}.gg-grid-4{grid-template-columns:repeat(4,1fr)}}
@media(min-width:640px){.gg-grid-4{grid-template-columns:1fr 1fr}}
.gg-card{background:var(--gg-surface);border:1px solid var(--gg-border);border-radius:.9rem;padding:1.15rem 1.25rem;color:var(--gg-text)}
.gg-card h3{font-size:1.05rem;font-weight:700;margin:0 0 .35rem}
.gg-card p,.gg-card li{color:var(--gg-muted);font-size:.95rem}
.gg-card ul{margin:.4rem 0 0;padding-left:1.1rem;list-style:disc}
.gg-tint{background:var(--gg-tint)}
.gg-stat{text-align:center;padding:1rem .5rem}
.gg-stat b{display:block;font-size:1.8rem;font-weight:800;color:var(--gg-btn)}
.gg-stat span{font-size:.85rem;color:var(--gg-muted)}
.gg-steps{counter-reset:s;display:grid;gap:1rem}
@media(min-width:760px){.gg-steps{grid-template-columns:repeat(3,1fr)}}
.gg-steps li{counter-increment:s;position:relative;background:var(--gg-surface);border:1px solid var(--gg-border);border-radius:.9rem;padding:1rem 1.1rem 1rem 3.2rem;color:var(--gg-muted);font-size:.95rem}
.gg-steps li::before{content:counter(s);position:absolute;left:1rem;top:1rem;width:1.7rem;height:1.7rem;border-radius:999px;background:var(--gg-btn);color:#fff;font-weight:700;text-align:center;line-height:1.7rem;font-size:.9rem}
.gg-steps li b{display:block;color:var(--gg-text);margin-bottom:.15rem}
.gg-note{font-size:.85rem;color:var(--gg-muted);border-left:3px solid var(--gg-primary);padding:.3rem .8rem;margin:1rem 0}
.gg-link{color:var(--gg-btn);text-decoration:underline;text-underline-offset:2px}

/* Formular */
.gg-form{background:var(--gg-surface);border:1px solid var(--gg-border);border-radius:.9rem;padding:1.25rem}
.gg-field{margin-bottom:.9rem}
.gg-field label,.gg-field legend{display:block;font-size:.9rem;font-weight:600;color:var(--gg-text);margin-bottom:.25rem}
.gg-field .gg-opt{font-weight:400;color:var(--gg-muted)}
.gg-field input[type=text],.gg-field input[type=email],.gg-field input[type=tel],.gg-field select,.gg-field textarea{width:100%;padding:.6rem .75rem;border:1px solid var(--gg-border);border-radius:.5rem;background:var(--gg-surface);color:var(--gg-text);font-size:1rem;min-height:44px}
.gg-field textarea{min-height:7rem}
.gg-row{display:grid;gap:.9rem}
@media(min-width:640px){.gg-row-2{grid-template-columns:1fr 1fr}}
.gg-check{display:flex;gap:.6rem;align-items:flex-start;font-size:.9rem;color:var(--gg-muted)}
.gg-check input{margin-top:.25rem;width:1.1rem;height:1.1rem;flex:none}
.gg-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.gg-error{color:var(--gg-err);font-size:.85rem;margin-top:.2rem}
.gg-alert{border-radius:.6rem;padding:.75rem 1rem;margin-bottom:1rem;font-size:.95rem}
.gg-alert-ok{background:var(--gg-tint);border:1px solid var(--gg-primary);color:var(--gg-text)}
.gg-alert-err{background:var(--gg-err-bg);border:1px solid var(--gg-err);color:var(--gg-err)}
.gg-en{border-top:1px solid var(--gg-border);margin-top:2rem;padding-top:1.25rem;color:var(--gg-muted);font-size:.95rem}
@media(max-width:639px){nav form input[name=q]{width:6.5rem}}

/* Partyplaner: Cocktailauswahl (kurzes Markup statt 760 mal langer Tailwind-Klassen) */
.pp-c{display:inline-flex;align-items:center;gap:.5rem;font-size:.875rem;color:#334155}
.pp-c input{border-radius:.25rem;border:1px solid #cbd5e1}
.pp-af{font-size:10px;color:#0e7490}
html.dark .pp-c{color:#cbd5e1}
html.dark .pp-af{color:#67e8f9}

/* Druck: Logo immer in der hellen Variante (dunkelblaue Wortmarke) zeigen.
   Im Dark-Mode steht sonst die weiße Dark-Variante im Druck und ist auf
   weißem Papier unsichtbar (Zelt-Werkzeug u. a., 14.10.2026). */
@media print{
  img[src="/logo-full.svg"]{display:block!important}
  img[src="/logo-full-dark.svg"]{display:none!important}
}

/* ---- Startseite (Farbwelt A) ---- */
.gg-h-wrap{max-width:80rem;margin:0 auto;padding-inline:1rem}@media(min-width:640px){.gg-h-wrap{padding-inline:1.5rem}}@media(min-width:1024px){.gg-h-wrap{padding-inline:2rem}}
.gg-h-hero{background:linear-gradient(135deg,#0e4d78,#1772ab);color:#fff;position:relative;overflow:hidden}
html.dark .gg-h-hero{background:linear-gradient(135deg,#082f49,#0f5a8a)}
.gg-h-hero-in{display:flex;align-items:flex-end;justify-content:space-between;gap:2rem;padding-block:3.5rem 0}
.gg-h-hero-text{max-width:40rem;padding-bottom:3.5rem;flex:1;min-width:0}
.gg-h-hero h1{font-size:clamp(1.9rem,4.6vw,3rem);line-height:1.1;font-weight:800;letter-spacing:-.02em;margin:0 0 .9rem;text-wrap:balance}
.gg-h-sub{font-size:1.1rem;line-height:1.5;color:#dcecf7;margin:0 0 1.6rem;max-width:34rem}
.gg-h-search{display:flex;max-width:34rem;box-shadow:0 8px 24px rgba(0,0,0,.18);border-radius:.8rem;overflow:hidden}
.gg-h-search input{flex:1;min-width:0;padding:.9rem 1.1rem;font-size:1.05rem;color:#1e293b;background:#fff;border:0;outline:0}
.gg-h-search input:focus-visible{outline:3px solid #f6a823;outline-offset:-3px}
.gg-h-search button{display:flex;align-items:center;gap:.45rem;padding:0 1.3rem;background:#f6a823;color:#2b1a00;font-weight:800;border:0;cursor:pointer}
.gg-h-search button:hover{background:#ffb93d}
.gg-h-chips{margin:.9rem 0 0;font-size:.88rem;color:#cfe6f5;display:flex;flex-wrap:wrap;gap:.45rem;align-items:center}
.gg-h-chips a{background:rgba(255,255,255,.14);color:#fff;border-radius:999px;padding:.2rem .7rem;text-decoration:none}.gg-h-chips a:hover{background:rgba(255,255,255,.26)}
.gg-h-hero-bild{display:none;align-items:flex-end;gap:.6rem;padding-right:.5rem}
.gg-h-hero-bild img{height:auto;width:auto;max-height:260px;filter:drop-shadow(0 10px 16px rgba(0,0,0,.35))}
.gg-h-hero-bild img:nth-child(2){max-height:300px}.gg-h-hero-bild img:nth-child(3){max-height:210px}
@media(min-width:900px){.gg-h-hero-bild{display:flex}}
.gg-h-sec{padding-block:2.5rem 0}.gg-h-sec-tight{padding-block:2rem 0}
.gg-h-sec h2,.gg-h-kopf h2{font-size:1.5rem;font-weight:700;color:var(--gg-text);margin:0 0 1.2rem}
.gg-h-kopf{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;flex-wrap:wrap}.gg-h-kopf a{color:var(--gg-primary);font-size:.9rem;font-weight:600;text-decoration:none}
.gg-h-karten{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr))}
.gg-h-karte{display:flex;flex-direction:column;background:var(--gg-surface);border:1px solid var(--gg-border);border-radius:14px;overflow:hidden;text-decoration:none;color:var(--gg-text);transition:transform .15s,box-shadow .15s,border-color .15s}
.gg-h-karte:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(15,23,42,.12);border-color:var(--gg-primary)}
.gg-h-vis{display:flex;align-items:flex-end;justify-content:center;gap:.6rem;height:9.5rem;padding:.9rem 1rem 0;background:var(--gg-primary-tint)}
.gg-h-vis img{max-height:100%;width:auto;object-fit:contain}
.gg-h-vis-pfand img{max-height:8.4rem}.gg-h-vis-pfand img:nth-child(3){max-height:9rem}.gg-h-vis-pfand img:nth-child(1){max-height:6.2rem}
.gg-h-vis-produkte img{max-height:7.4rem}.gg-h-vis-produkte img.gg-bh{mix-blend-mode:multiply}
.gg-h-vis-cocktail{align-items:center;padding:.8rem}.gg-h-vis-cocktail img{height:7.8rem;border-radius:12px;box-shadow:0 6px 14px rgba(0,0,0,.18)}
.gg-h-vis-werkzeug{align-items:center;color:var(--gg-primary);padding:0}
.gg-h-kt{display:flex;flex-direction:column;gap:.25rem;padding:1rem 1.1rem 1.15rem}.gg-h-kt b{font-size:1.05rem}.gg-h-kt span{font-size:.88rem;color:var(--gg-muted);line-height:1.45}
.gg-h-hersteller{display:grid;gap:.7rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr))}
.gg-h-hersteller a{display:flex;align-items:center;gap:.75rem;padding:.7rem .9rem;background:var(--gg-surface);border:1px solid var(--gg-border);border-radius:12px;text-decoration:none;color:var(--gg-text)}
.gg-h-hersteller a:hover{border-color:var(--gg-primary)}
.gg-h-logo{flex:none;width:3rem;height:3rem;border-radius:10px;background:#fff;border:1px solid var(--gg-line);display:grid;place-items:center;overflow:hidden}.gg-h-logo img{max-width:100%;max-height:100%;object-fit:contain;padding:3px}
.gg-h-hn{display:flex;flex-direction:column;min-width:0}.gg-h-hn b{font-size:.92rem;line-height:1.25;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.gg-h-hn small{color:var(--gg-muted)}
.gg-h-punkte{display:grid;gap:1.4rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,17rem),1fr))}.gg-h-punkte b{display:block;margin-bottom:.3rem}.gg-h-punkte p{margin:0;color:var(--gg-muted);font-size:.92rem;line-height:1.55}

/* ---- Footer (ausgewogen: Marke + vier Linkspalten) ---- */
.gg-foot{background:#1e293b;color:#cbd5e1}html.dark .gg-foot{background:#0b1220;border-top:1px solid #1e293b}
.gg-f-wrap{max-width:80rem;margin:0 auto;padding:2.5rem 1rem 1.5rem;position:relative}@media(min-width:640px){.gg-f-wrap{padding-inline:1.5rem}}@media(min-width:1024px){.gg-f-wrap{padding-inline:2rem}}
.gg-f-grid{display:grid;gap:1.75rem 1.5rem;grid-template-columns:repeat(2,minmax(0,1fr))}
.gg-f-brand{grid-column:1/-1}.gg-f-brand p{margin:.7rem 0 0;font-size:.9rem;line-height:1.5;max-width:22rem;color:#cbd5e1}
.gg-f-lang{margin-top:.9rem;display:flex;gap:.8rem;font-size:.85rem}.gg-f-lang span{color:#fff;font-weight:600}.gg-f-lang a{color:#cbd5e1}.gg-f-lang a:hover{color:#fff}
.gg-foot h4{margin:0 0 .7rem;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:#fff;font-weight:700}
.gg-foot ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.45rem;font-size:.9rem}
.gg-foot nav a,.gg-f-legal a,.gg-f-small a{color:#cbd5e1;text-decoration:none}.gg-foot nav a:hover,.gg-f-legal a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}.gg-f-small a{text-decoration:underline}
.gg-f-bottom{margin-top:2rem;padding-top:1.1rem;border-top:1px solid #334155;display:flex;flex-wrap:wrap;justify-content:space-between;gap:.6rem 1.5rem;font-size:.85rem}
.gg-f-legal{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem}
.gg-f-small{margin:.8rem 0 0;font-size:.75rem;line-height:1.5;color:#94a3b8;max-width:60rem}
@media(min-width:768px){.gg-f-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.gg-f-brand{grid-column:1/-1}}
@media(min-width:1024px){.gg-f-grid{grid-template-columns:minmax(14rem,1.6fr) repeat(4,minmax(0,1fr))}.gg-f-brand{grid-column:auto}}

/* Produktbilder: im Dunkelmodus die freigestellte Fassung (ohne weißen Kasten) */
.gg-bd{display:none}html.dark .gg-bh{display:none}html.dark .gg-bd{display:block}

/* Suchergebnisse */
.gg-sr-h{display:flex;align-items:center;gap:.6rem;font-size:1.05rem;font-weight:700;color:var(--gg-text);margin:0 0 .8rem}
.gg-sr-hlink{color:inherit;text-decoration:none}
.gg-sr-hlink:hover{color:var(--gg-brand,#1f6fb2);text-decoration:underline}
.gg-sr-h small{font-weight:500;color:var(--gg-muted);font-size:.85rem}
.gg-sr-dot{display:inline-block;width:.45rem;height:1.2rem;border-radius:999px}
.gg-sr-grid{display:grid;gap:.75rem;grid-template-columns:1fr}
@media(min-width:640px){.gg-sr-grid{grid-template-columns:1fr 1fr}}
@media(min-width:960px){.gg-sr-grid{grid-template-columns:repeat(3,1fr)}}
.gg-sr-card{display:flex;flex-direction:column;gap:.3rem;min-width:0;padding:.9rem 1.05rem;background:var(--gg-surface);border:1px solid var(--gg-border);border-radius:.8rem;color:var(--gg-text);text-decoration:none;cursor:pointer;transition:border-color .15s,box-shadow .15s}
.gg-sr-card:hover{border-color:var(--gg-brand,#1f6fb2);box-shadow:0 2px 10px rgba(31,111,178,.12)}
.gg-sr-name{font-weight:600;line-height:1.3;color:var(--gg-text);text-decoration:none;overflow-wrap:anywhere}
a.gg-sr-name:hover{color:var(--gg-brand,#1f6fb2)}
.gg-sr-sub{font-size:.82rem;color:var(--gg-muted);line-height:1.4}
.gg-sr-meta{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem}
.gg-sr-lnk{color:var(--gg-brand,#1f6fb2);text-decoration:none}
.gg-sr-lnk:hover{text-decoration:underline}
.gg-sr-tag{align-self:flex-start;font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--gg-brand,#1f6fb2);background:color-mix(in srgb,var(--gg-brand,#1f6fb2) 12%,transparent);padding:.15rem .5rem;border-radius:999px}
.gg-sr-top{border-width:2px;border-color:color-mix(in srgb,var(--gg-brand,#1f6fb2) 45%,var(--gg-border))}
.gg-sr-top .gg-sr-name{font-size:1.2rem}
.gg-sr-mehr{margin:.7rem 0 0;font-size:.92rem}
.gg-sr-mehr a{color:var(--gg-brand,#1f6fb2);font-weight:600;text-decoration:none}
.gg-sr-mehr a:hover{text-decoration:underline}
.gg-sr-mit-bild{flex-direction:row;align-items:center;gap:.9rem}
.gg-sr-text{display:flex;flex-direction:column;gap:.3rem;min-width:0}
.gg-sr-thumb{flex:none;display:flex;align-items:center;justify-content:center;width:3.4rem;height:3.4rem;border-radius:.6rem;background:var(--gg-bg-soft,rgba(120,140,170,.10));overflow:hidden}
.gg-sr-thumb-img{max-width:100%;max-height:100%;object-fit:contain}
.gg-sr-logo{padding:.25rem}
.gg-sr-thumb-leer{opacity:.35;display:flex}
.gg-sr-mit-bild .gg-sr-text{flex:1}
.gg-sr-symbol{display:flex;width:70%;height:82%;color:var(--gg-muted,#64748b);opacity:.75}
.gg-sr-symbol svg,.gg-sr-sym{width:100%;height:100%}
.gg-sr-mono{font-size:1.5rem;font-weight:700;color:var(--gg-brand,#1f6fb2);opacity:.7}
.gg-sr-thumb-logo{background:#fff!important}

/* ---- Handy-Feinschliff (24.10.2026, Prüfung aller Bereiche bei 360 px) ---- */
@media (max-width:420px){
  /* Kopfzeile: Suchfeld schmaler, damit der Dunkelmodus-Knopf nicht abgeschnitten wird */
  .gg-search input[name=q]{width:max(6.5rem,min(9.5rem,calc(100vw - 15.5rem)))!important}
}
@media (max-width:640px){
  /* Tippflächen: Lupe im Suchfeld und Dunkelmodus-Knopf mindestens 40 px */
  .gg-search button[type=submit]{right:0!important;width:40px;height:40px;display:flex;align-items:center;justify-content:center}
  button[onclick="toggleTheme()"]{width:38px!important;height:38px!important}
  /* Fußzeile: Links mit genug Abstand zum Antippen */
  .gg-foot a{display:inline-block;padding:7px 0;min-height:32px}
  /* Teilen-Menü am Handy als Leiste unten statt seitlich überstehend */
  .gg-teilen[open] .gg-teilen-menue{position:fixed;left:12px;right:12px;top:auto;bottom:calc(12px + env(safe-area-inset-bottom));min-width:0;max-width:none;z-index:95}
}