/* ---------- Design tokens ---------- */
:root{
  --green-950:#1e2f21;
  --green-900:#2c4530;
  --green-800:#3c5c41;
  --green-700:#4f7355;
  --cream:#faf6ee;
  --cream-2:#f2ead9;
  --paper:#fffdf9;
  --ink:#1e2019;
  --ink-soft:#54574d;
  --yellow:#ffcc00;
  --yellow-dark:#e6b800;
  --line: rgba(30,32,25,.1);

  --serif: 'Fraunces', Georgia, serif;
  --sans: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;

  --radius:2px;
  --shadow: 0 10px 30px -12px rgba(30,42,25,.25);
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth; font-size:112.5%; color-scheme:light;}  /* 18px Basis; color-scheme:light = Seite ist bewusst hell, verhindert Auto-Dark-Mode-Umfärbung (Samsung/Chrome) */
html.home{font-size:118.75%;}  /* Startseite etwas größer (19px Basis) – User-Wunsch, Unterseiten bleiben 18px */
body{
  margin:0;
  font-family:var(--sans);
  color:var(--ink);
  background:var(--cream);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;margin:0;padding:0;}
.wrap{max-width:1280px;margin:0 auto;padding:0 24px;}

h1,h2,h3{
  font-family:var(--serif);
  font-weight:600;
  line-height:1.12;
  margin:0 0 .5em;
  color:var(--green-950);
}
h1{font-size:clamp(2.4rem,5vw,4rem); font-weight:600;}
h2{font-size:clamp(2rem,3.6vw,3rem);}
h3{font-size:1.3rem;}
p{margin:0 0 1em;color:var(--ink-soft);}

.kicker{
  font-family:var(--sans);
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:.78rem;
  font-weight:700;
  color:var(--green-800);
  margin-bottom:.6em;
  display:flex; align-items:center; gap:.7em; flex-wrap:wrap;
}
.kicker::before, .kicker::after{
  content:""; width:1.9em; height:3px; background:var(--yellow); border-radius:2px; flex:0 0 auto;
}
.kicker.center{justify-content:center; text-align:center;}
h2.center{text-align:center; max-width:700px; margin-left:auto; margin-right:auto;}

/* ---------- Buttons ---------- */
.btn{
  display:inline-block;
  padding:.95em 1.9em;
  font-family:var(--sans);
  font-weight:600;
  font-size:.95rem;
  letter-spacing:.02em;
  border-radius:var(--radius);
  border:1.5px solid transparent;
  transition:transform .15s ease, background .2s ease, color .2s ease, border-color .2s ease;
  cursor:pointer;
}
.btn:hover{transform:translateY(-2px);}
.btn-primary{background:var(--yellow); color:var(--green-950); border-color:var(--yellow);}
.btn-primary:hover{background:var(--yellow-dark); border-color:var(--yellow-dark);}
.btn-ghost{background:transparent; color:#fff; border-color:rgba(255,255,255,.6);}
.btn-ghost:hover{background:rgba(255,255,255,.12); border-color:#fff;}
.btn-outline{background:transparent; color:var(--green-800); border-color:var(--green-800); margin-top:.5em;}
.btn-outline:hover{background:var(--green-800); color:#fff;}
.btn-light{background:#fff; color:var(--green-900); border-color:#fff;}
.btn-light:hover{background:var(--cream-2);}

.checklist li{
  position:relative;
  padding-left:1.6em;
  margin-bottom:.5em;
  color:var(--ink-soft);
}
.checklist li::before{
  content:"";
  position:absolute; left:0; top:.5em;
  width:9px; height:9px;
  background:var(--yellow);
}

/* ---------- Header ---------- */
.site-header{
  position:sticky; top:0; z-index:50;
  background:var(--paper);
  border-bottom:1px solid var(--line);
}
.header-inner{
  position:relative;
  display:flex; align-items:center; justify-content:center;
  padding:15px 24px;
}
.brand-mobile{display:none;}
.main-nav{display:flex; align-items:center; gap:2.7em;}
.main-nav a{font-weight:600; font-size:1.12rem; color:var(--green-950); position:relative; padding:.2em 0;}
.main-nav a:not(.nav-cta):not(.brand-inline)::after{
  content:""; position:absolute; left:0; bottom:-2px; width:0; height:2px; background:var(--yellow);
  transition:width .2s ease;
}
.main-nav a:not(.nav-cta):not(.brand-inline):hover::after{width:100%;}
.nav-cta{background:var(--green-900); color:#fff !important; padding:.6em 1.3em; border-radius:var(--radius);}
.nav-cta:hover{background:var(--green-800);}

.brand-inline{display:flex; align-items:center; padding:.3em 0;}
.brand-inline img{height:80px; width:auto; transition:transform .2s ease;}
.brand-inline:hover img{transform:scale(1.04);}

.nav-toggle{
  display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:8px;
  position:absolute; right:18px; top:50%; transform:translateY(-50%);
}
.nav-toggle span{width:24px; height:2px; background:var(--green-950); display:block;}

/* ---------- Sub-page header (expanded nav) ---------- */
.header-inner-sub{
  position:relative;
  display:flex; align-items:center; justify-content:space-between;
  gap:1.5em; padding:15px 24px;
}
.brand-sub img{height:68px; width:auto;}
.main-nav-sub{gap:1.5em;}
.main-nav-sub a{font-size:1rem;}
.main-nav-sub a.active{color:var(--green-700);}
.main-nav-sub a.active::after{width:100% !important;}

/* ---------- Hero ---------- */
.hero{position:relative; min-height:88vh; display:flex; align-items:center; overflow:hidden;}
.hero-bg{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.hero-overlay{
  position:absolute; inset:0;
  background:linear-gradient(100deg, rgba(30,47,33,.92) 0%, rgba(30,47,33,.72) 42%, rgba(30,47,33,.35) 75%);
}
.hero-content{position:relative; z-index:2; padding-top:4em; padding-bottom:4em; max-width:680px;}
.hero .eyebrow{
  color:var(--yellow); text-transform:uppercase; letter-spacing:.16em; font-weight:700; font-size:.82rem; margin-bottom:1em;
}
.hero h1{color:#fff; margin-bottom:.4em; font-size:clamp(2.7rem,5.6vw,4.5rem);}
.hero-text{color:#e9e6dc; font-size:1.1rem; max-width:520px;}
.hero-actions{display:inline-grid; grid-auto-flow:column; grid-auto-columns:1fr; gap:1em; margin-top:1.5em;}
.hero-actions .btn{width:100%; text-align:center;}

/* ---------- Quicklinks ---------- */
.quicklinks{position:relative; z-index:3; margin-top:-130px;}
.quicklinks-grid{
  display:grid; grid-template-columns:repeat(4,1fr);
  box-shadow:var(--shadow);
}
.quicklink-card{
  background:var(--green-950); color:#fff;
  padding:3.6em 1.8em 3.2em; display:flex; flex-direction:column; align-items:center; text-align:center; gap:1.1em;
  transition:background .2s ease, transform .2s ease;
  border-right:1px solid rgba(255,255,255,.08);
}
.quicklink-card:last-child{border-right:none;}
.quicklink-card:hover{background:var(--green-800); transform:translateY(-3px);}
.quicklink-card svg{width:78px; height:78px; color:var(--yellow); flex-shrink:0;}
.quicklink-card h3{color:#fff; font-size:1.45rem; margin:0;}
.quicklink-card p{color:#d8d5c9; font-size:1.02rem; margin:0;}

/* ---------- Partner logo strip ---------- */
.partner-strip{padding:4em 0 3.5em; background:var(--paper); border-bottom:1px solid var(--line);}
.partner-strip .kicker{font-size:.98rem; margin-bottom:3.4em;}
.partner-strip-inner{
  overflow:hidden; width:100%;
  -webkit-mask-image:linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
  mask-image:linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
}
.partner-track{
  display:flex; align-items:center; gap:5em; width:max-content;
  animation:partner-scroll 45s linear infinite;
}
.partner-strip-inner:hover .partner-track{animation-play-state:paused;}
.partner-track img{
  height:72px; width:auto; max-width:190px; object-fit:contain;
  opacity:.92; transition:opacity .2s ease, transform .2s ease;
}
.partner-track img:hover{opacity:1; transform:scale(1.05);}
.partner-track img.partner-round{height:76px; width:76px; border-radius:50%; object-fit:cover;}
.partner-outline{
  background:#14418c; border-radius:var(--radius); padding:.55em 1em;
}
.partner-track .partner-text{
  font-family:var(--serif); font-weight:600; font-size:1.25rem; color:var(--green-800);
  white-space:nowrap; opacity:.85; transition:opacity .2s ease;
}
.partner-track .partner-text:hover{opacity:1;}
/* Text-Partner ohne Logo als grüne Badge mit gelber Schrift (Wiedererkennung) */
.partner-track .partner-badge{
  font-family:var(--serif); font-weight:600; font-size:1.05rem; color:var(--yellow);
  background:var(--green-950); padding:.5em 1.3em; border-radius:2em; white-space:nowrap;
  opacity:.95; transition:opacity .2s ease, transform .2s ease;
}
.partner-track .partner-badge:hover{opacity:1; transform:scale(1.05);}
@keyframes partner-scroll{
  from{transform:translateX(0);}
  to{transform:translateX(-50%);}
}
@media (prefers-reduced-motion: reduce){
  .partner-track{animation:none; flex-wrap:wrap; width:auto; justify-content:center;}
}

/* ---------- Foto-Showcase (Unterseiten) ---------- */
.showcase{padding:5em 0; background:var(--cream-2);}
.showcase-figure{margin:0 auto; max-width:1020px;}
.showcase-figure img{width:100%; height:auto; display:block; border-radius:var(--radius); box-shadow:var(--shadow);}
.showcase-figure figcaption{margin-top:1em; text-align:center; font-size:.9rem; color:var(--ink-soft); font-style:italic;}

/* ---------- Unterseiten-Hero (fixiertes Bild, Parallax) ---------- */
.subhero{
  position:relative; min-height:44vh; display:flex; align-items:center;
  background-size:cover; background-position:center; background-attachment:fixed;
}
.subhero::before{content:""; position:absolute; inset:0; background:linear-gradient(rgba(18,28,18,.58), rgba(18,28,18,.5));}
.subhero-content{position:relative; z-index:1; text-align:center; color:#fff; max-width:820px; margin:0 auto; padding:5.5em 24px;}
.subhero-content .kicker{color:var(--yellow); margin-bottom:.6em;}
.subhero-content h1{color:#fff; margin:0 0 .35em;}
.subhero-content p{color:rgba(255,255,255,.88); margin:0;}

/* Slideshow-Varianten (höhere Spezifität, damit sie die Basis .spirit-slides{4/5} überschreiben) */
.spirit-slides.spirit-slides--wide{aspect-ratio:16/9;}
.spirit-slides.spirit-slides--photo{aspect-ratio:4/3;}
.spirit-gallery{max-width:1020px; margin:0 auto;}

/* ---------- Kundenbriefkasten ---------- */
.mailbox{position:relative; overflow:hidden; padding:6em 0; background:var(--cream);}
.mailbox-wrap{position:relative; z-index:1;}
.mailbox-intro{max-width:560px; margin:0 auto 2.4em;}
/* dezente handgezeichnete Brief-/Briefkasten-Motive (aus assets/img/Briefe.png, als Sprite-Ausschnitte;
   mix-blend-mode:multiply blendet den weißen Bild-Hintergrund weg) */
.mailbox-deco{position:absolute; inset:0; pointer-events:none; z-index:0;}
.mailbox-motif{
  position:absolute; display:block; background-repeat:no-repeat;
  background-image:url("../assets/img/Briefe.png"); mix-blend-mode:multiply;
}
/* nur Briefe/Umschläge, organisch gestreut auf der rechten Seite (Inhalt sitzt links) –
   verschiedene Größen & Winkel, unregelmäßig, wie bei Anzeneder. Kein Briefkasten. */
.mailbox-motif.mm-a{width:140px; height:101px; background-size:350px auto; background-position:-41px -14px; bottom:7%; right:6%;  transform:rotate(-7deg) scale(1.4);  opacity:.15;}   /* großer Umschlag – unten rechts */
.mailbox-motif.mm-b{display:none;}
.mailbox-motif.mm-c{width:72px;  height:52px;  background-size:180px auto; background-position:-21px -7px;  top:5%;  right:31%; transform:rotate(-17deg) scale(1.4); opacity:.12;}   /* kleiner Umschlag – oben, weiter links */
.mailbox-motif.mm-d{width:80px;  height:58px;  background-size:200px auto; background-position:-23px -8px;  top:43%; right:23%; transform:rotate(15deg) scale(1.4);  opacity:.12;}   /* kleiner Umschlag – Mitte, Streu */
.mailbox-motif.mm-e{width:160px; height:232px; background-size:464px auto; background-position:-276px -155px; top:6%; right:7%; transform:rotate(3deg) scale(1.4);   opacity:.14;}   /* Brief-Schwarm – oben rechts (fliegende Briefe) */
/* Herz-Briefe links (aus Briefe 2.png) */
.mailbox-motif.mm-h1{background-image:url("../assets/img/Briefe 2.png"); width:132px; height:128px; background-size:326px auto; background-position:-186px -11px;  top:8%;   left:4%; transform:rotate(-6deg) scale(1.4); opacity:.17;}   /* offener Umschlag mit Herz-Brief */
.mailbox-motif.mm-h2{background-image:url("../assets/img/Briefe 2.png"); width:120px; height:76px;  background-size:304px auto; background-position:-39px -259px; bottom:12%; left:5%; transform:rotate(7deg) scale(1.4);  opacity:.16;}   /* Umschlag mit kleinem Herz */
.mailbox-motif.mm-f{width:155px; height:225px; background-size:450px auto; background-position:-268px -150px; top:-6%; left:17%; transform:rotate(-16deg) scale(1.4); opacity:.13;}   /* Brief-Schwarm schräg – näher an „Ihr", hinter der Schrift */
.mailbox-tabs{display:flex; gap:.7em; flex-wrap:wrap; justify-content:center;}
.mailbox-tab{
  font-family:var(--sans); font-weight:700; font-size:.95rem; cursor:pointer;
  padding:.8em 1.4em; border:2px solid var(--green-950); background:var(--green-950); color:var(--yellow);
  border-radius:var(--radius); transition:background .2s ease, border-color .2s ease, transform .2s ease;
}
.mailbox-tab:hover{background:var(--green-800); border-color:var(--green-800); transform:translateY(-1px);}
.mailbox-tab.is-active{background:var(--green-800); border-color:var(--yellow);}
.mailbox-panel{display:none; flex-direction:column; gap:1.1em;}
.mailbox-panel.is-active{
  display:flex; max-width:640px; margin:1.8em auto 0; background:var(--paper);
  border:1px solid var(--line); border-radius:var(--radius); padding:2.2em; box-shadow:var(--shadow);
}
.mailbox-panel-text{margin:0; color:var(--ink-soft); font-size:.95rem;}
.mailbox-panel-text a{color:var(--green-800); font-weight:600; text-decoration:underline;}
.mailbox-panel label{display:flex; flex-direction:column; gap:.5em; font-weight:600; font-size:.9rem; color:var(--green-950);}
.mailbox-panel input, .mailbox-panel textarea{
  font-family:var(--sans); font-size:1rem; padding:.8em 1em; border:1.5px solid var(--line);
  border-radius:var(--radius); background:var(--paper); color:var(--ink); resize:vertical;
}
.mailbox-panel input:focus, .mailbox-panel textarea:focus{outline:2px solid var(--green-700); outline-offset:1px;}
.mailbox-row{display:grid; grid-template-columns:1fr 1fr; gap:1.1em;}
.mailbox-panel .btn{align-self:flex-start;}

/* ---------- Intro ---------- */
.intro{padding:7em 0; background:var(--paper);}
.intro-grid{display:grid; grid-template-columns:.85fr 1.15fr; gap:4em; align-items:center;}
.intro-grid--wide{grid-template-columns:1.15fr 1fr; gap:3.2em;}
.intro-media img{border-radius:var(--radius); box-shadow:var(--shadow);}
.intro-copy h2{margin-bottom:.6em;}

/* Too Good To Go – Nachhaltigkeits-Motive im Hintergrund (gleiche Sprite-Technik wie Kundenbriefkasten):
   dezente dunkle Linien, mix-blend-mode:multiply blendet den weißen Bild-Hintergrund weg. */
.intro.tgtg{position:relative; overflow:hidden;}
.intro.tgtg > .wrap{position:relative; z-index:1;}
.tgtg-deco{position:absolute; inset:0; pointer-events:none; z-index:0;}
.tgtg-motif{position:absolute; display:block; background-repeat:no-repeat; mix-blend-mode:multiply;}
.tgtg-motif.tg-2,.tgtg-motif.tg-3{background-image:url("../assets/img/tgtg-motive-1.png");}
.tgtg-motif.tg-4,.tgtg-motif.tg-6{background-image:url("../assets/img/tgtg-motive-2.png");}
.tgtg-motif.tg-2{width:130px; height:132px; background-size:325px auto; background-position:-177px -134px; bottom:9%; right:6%;  transform:rotate(6deg) scale(1.4);   opacity:.12;}  /* Hände mit Erde + Blatt (unten rechts) */
.tgtg-motif.tg-3{width:120px; height:112px; background-size:296px auto; background-position:-25px -237px;  bottom:3%; left:41%;  transform:rotate(-10deg) scale(1.4); opacity:.13;}  /* Recycling-Dreieck – links unterhalb vom „Eitensheim retten"-Button, tiefer gesetzt */
.tgtg-motif.tg-4{width:150px; height:121px; background-size:375px auto; background-position:-192px -10px;  top:8%;   right:6%;  transform:rotate(5deg) scale(1.4);   opacity:.13;}  /* Erde mit Häusern & Bäumen (oben rechts) */
.tgtg-motif.tg-6{width:140px; height:159px; background-size:345px auto; background-position:-182px -247px; top:11%;   left:46%;  transform:rotate(-12deg) scale(1.4); opacity:.11;}  /* Globus mit Baum & Pflanzen – oben Mitte, rechts neben dem Logo */

/* ---------- Image carousel (Hauseigene Spirituosen) ---------- */
.spirit-carousel{position:relative; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow);}
.spirit-slides{position:relative; aspect-ratio:4/5; background:var(--cream-2);}
.spirit-slide{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  opacity:0; transition:opacity .4s ease; border-radius:0; box-shadow:none;
}
.spirit-slide.active{opacity:1;}
/* Von Herzen Regional: Spirituosen-Karussell etwas kompakter (weniger hoch) */
#spiritCarousel{max-width:360px; margin-inline:auto;}
.spirit-arrow{
  position:absolute; top:50%; transform:translateY(-50%); z-index:2;
  width:38px; height:38px; border-radius:50%; border:none; cursor:pointer;
  background:rgba(30,47,33,.55); color:#fff; font-size:1rem; line-height:1;
  display:flex; align-items:center; justify-content:center; transition:background .2s ease;
}
.spirit-arrow:hover{background:rgba(30,47,33,.85);}
.spirit-prev{left:.9em;}
.spirit-next{right:.9em;}
.spirit-dots{position:absolute; bottom:1.1em; left:50%; transform:translateX(-50%); z-index:2; display:flex; gap:.55em;}
.spirit-dot{width:9px; height:9px; padding:0; border-radius:50%; border:none; background:rgba(255,255,255,.55); cursor:pointer; transition:background .2s ease, transform .2s ease;}
.spirit-dot.active{background:var(--yellow); transform:scale(1.2);}

/* ---------- Locations ---------- */
.locations{padding:7em 0; background:var(--cream-2);}
.location-grid{display:grid; grid-template-columns:1fr 1fr; gap:2em; margin-top:3em;}
.location-grid--3{grid-template-columns:repeat(3,1fr);}
.location-card{background:var(--paper); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow);}
.location-media img{height:240px; width:100%; object-fit:cover;}
.location-body{padding:2em;}
.location-line{margin-bottom:.4em; color:var(--ink-soft);}
.location-line a{color:var(--green-800); font-weight:600;}
.location-hours{
  display:flex; gap:2em; margin:1.2em 0; padding:1em 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line);
}
.location-hours span{display:block; font-size:.75rem; text-transform:uppercase; letter-spacing:.08em; color:var(--green-700); font-weight:700; margin-bottom:.2em;}
.location-media--logo{
  height:240px; display:flex; align-items:center; justify-content:center; background:var(--paper); padding:2em;
}
.location-media--logo img{height:auto; max-height:120px; width:auto; max-width:78%; object-fit:contain;}
.service-icon{width:64px; height:48px;}
/* Zahlungs-Logos (Zahlen & Kundenservice) */
.location-media--pay{
  height:240px; display:flex; align-items:center; justify-content:center;
  background:var(--paper); padding:1.6em;
}
.pay-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:.7em; width:100%; max-width:300px;}
.pay-logo{
  background:#fff; border:1px solid var(--line); border-radius:6px;
  height:46px; display:flex; align-items:center; justify-content:center; padding:.35em .55em;
  box-shadow:0 1px 2px rgba(30,32,25,.05);
}
.pay-logo img{height:auto; max-height:24px; width:auto; max-width:100%;}

/* ---------- Regional ---------- */
.regional{padding:7em 0; background:var(--paper);}
.regional-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:2em; margin-top:3em;}
.regional-card{background:var(--cream); border-radius:var(--radius); overflow:hidden; transition:transform .2s ease, box-shadow .2s ease;}
.regional-card:hover{transform:translateY(-4px); box-shadow:var(--shadow);}
.regional-card img{height:200px; width:100%; object-fit:cover;}
.regional-body{padding:1.6em;}
.regional-body p{margin:0; font-size:.95rem;}

.heading-heart{display:inline-flex; align-items:center; gap:.35em;}
.heading-heart svg{width:.8em; height:.8em; fill:var(--yellow); flex-shrink:0;}

/* ---------- Partner directory (von-herzen-regional.html) ---------- */
.partner-directory{padding:6em 0 7em; background:var(--cream-2);}
.partner-directory h2.center{margin-bottom:0;}
.partner-group{margin-top:4.5em;}
.partner-group:first-of-type{margin-top:3em;}
.partner-group h3{
  text-align:center; font-size:1.3rem; color:var(--green-800); margin-bottom:2em;
  position:relative;
}
.partner-directory-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1.8em;}
.partner-directory-grid--narrow{max-width:700px; margin:0 auto; grid-template-columns:1fr 1fr;}
.partner-card{
  background:var(--paper); border-radius:var(--radius); box-shadow:var(--shadow);
  padding:2.2em 1.6em; display:flex; flex-direction:column; align-items:center; text-align:center; gap:.6em;
  transition:transform .2s ease;
}
.partner-card:hover{transform:translateY(-4px);}
.partner-logo{height:64px; display:flex; align-items:center; justify-content:center; margin-bottom:.4em;}
.partner-logo img{max-height:100%; max-width:170px; object-fit:contain;}
.partner-logo img.partner-round{height:64px; width:64px; border-radius:50%; object-fit:cover;}
.partner-initial{
  height:64px; width:64px; border-radius:50%; background:var(--green-950); color:var(--yellow);
  display:flex; align-items:center; justify-content:center; font-family:var(--serif); font-size:1.7rem; font-weight:600;
}
/* Nordbräu-Blaukasten im Directory an die Logo-Höhe anpassen */
.partner-logo img.partner-outline{max-height:60px; padding:.35em .7em; box-sizing:border-box;}
.partner-category{
  font-size:.72rem; text-transform:uppercase; letter-spacing:.09em; color:var(--green-700); font-weight:700; margin:0;
}
.partner-card h4{font-family:var(--serif); font-size:1.1rem; margin:0; color:var(--green-950);}
.partner-card p:last-child{font-size:.85rem; margin:0; color:var(--ink-soft);}
/* Grüne Variante der Partner-Karten im Directory (Vorschau) – Schrift weiß/gelb */
.partner-directory .partner-card{background:var(--green-950);}
.partner-directory .partner-category{color:var(--yellow);}
.partner-directory .partner-card h4{color:#fff;}
.partner-directory .partner-card p:last-child{color:rgba(255,255,255,.78);}
.partner-directory .partner-initial{background:var(--yellow); color:var(--green-950);}
/* Einheitliche helle Box unter allen Logos, damit auch dunkle/grüne Logos auf Grün lesbar bleiben */
.partner-directory .partner-logo{
  background:var(--paper); border-radius:10px; width:100%; height:92px;
  padding:.8em 1em; box-sizing:border-box; margin-bottom:.9em;
}
.partner-directory .partner-logo img.partner-outline{max-height:100%; padding:0;}

/* Vereins-Sponsoring – eigener Abschnitt (nutzt die Partner-Karten, heller Hintergrund zur Abgrenzung) */
.sponsors{padding:6em 0 7em; background:var(--paper);}
.sponsors > .wrap > h2.center{margin-bottom:.4em;}
.sponsors-intro{max-width:640px; margin:0 auto 3.2em; text-align:center; color:var(--ink-soft);}
/* Hauptsponsor – hervorgehobene dunkle Karte */
.mainsponsor{
  display:grid; grid-template-columns:200px 1fr; gap:2.6em; align-items:center;
  background:var(--green-950); border-radius:var(--radius); box-shadow:var(--shadow);
  padding:2.8em; color:#fff; position:relative; text-decoration:none; transition:transform .2s ease;
}
.mainsponsor:hover{transform:translateY(-4px);}
.mainsponsor-badge{
  position:absolute; top:0; left:2.8em; transform:translateY(-50%);
  background:var(--yellow); color:var(--green-950); font-weight:700; font-size:.76rem;
  text-transform:uppercase; letter-spacing:.08em; padding:.55em 1.1em; border-radius:2px;
}
.mainsponsor-logo{display:flex; align-items:center; justify-content:center; min-height:150px;}
.mainsponsor-logo img{max-width:100%; max-height:150px; object-fit:contain;}
.mainsponsor-text h3{font-family:var(--serif); color:#fff; margin:.1em 0 .5em; font-size:1.55rem;}
.mainsponsor-text p{color:rgba(255,255,255,.85); margin:0 0 1em; font-size:.95rem; line-height:1.6;}
.mainsponsor-link{color:var(--yellow); font-weight:600;}
.mainsponsor:hover .mainsponsor-link{text-decoration:underline;}
/* Sponsoring regionaler Vereine – 4er-Raster mit Logos */
.sponsors-subhead{margin:3.4em 0 0; text-align:center; font-family:var(--serif); color:var(--green-950); font-size:1.4rem;}
.sponsors .partner-directory-grid{grid-template-columns:repeat(4,1fr); margin-top:2em;}
a.partner-card{text-decoration:none;}
.club-crest{display:block; background-repeat:no-repeat;}
.club-crest--buxheim{width:76px; height:64px; background-image:url("../assets/img/partners/sv-buxheim.png"); background-size:168px auto; background-position:-4px -3px;}
@media (max-width: 900px){
  .mainsponsor{grid-template-columns:150px 1fr; gap:1.8em; padding:2.2em;}
  .sponsors .partner-directory-grid{grid-template-columns:1fr 1fr;}
}
@media (max-width: 720px){
  .mainsponsor{grid-template-columns:1fr; text-align:center; gap:1.2em;}
  .mainsponsor-badge{left:50%; transform:translate(-50%,-50%); white-space:nowrap;}
  .sponsors .partner-directory-grid{grid-template-columns:1fr;}
}

/* ---------- Page intro (sub-pages) ---------- */
.page-intro{padding:4.5em 0 3.2em; background:var(--cream-2); text-align:center;}
.page-intro h1{margin-bottom:.3em;}
.page-intro p{max-width:620px; margin:0 auto; font-size:1.05rem;}
/* Grüne Intro-Variante (dunkelgrün, gelber Kicker, weiße Schrift) – ueber-uns, karriere, kontakt */
.page-intro--green{background:var(--green-950);}
.page-intro--green .kicker{color:var(--yellow);}
.page-intro--green h1{color:#fff;}
.page-intro--green p{color:#eef2ec;}
/* Bayern-Raute als dezenter Hintergrund (nur Von-Herzen-Regional-Intro) */
.page-intro--bavaria{position:relative; overflow:hidden; background:var(--paper);}
.page-intro--bavaria::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:conic-gradient(from 45deg,
    rgba(0,140,210,.15) 0deg 90deg, transparent 90deg 180deg,
    rgba(0,140,210,.15) 180deg 270deg, transparent 270deg 360deg);
  background-size:60px 60px;
  -webkit-mask-image:linear-gradient(#000, #000 50%, transparent 92%);
  mask-image:linear-gradient(#000, #000 50%, transparent 92%);
}
.page-intro--bavaria > .wrap{position:relative; z-index:1;}

/* ---------- Timeline ---------- */
.timeline{padding:3.2em 0 6em; background:var(--green-950);}
.timeline .kicker{color:var(--yellow);}
.timeline h2{color:#fff;}
.timeline h2{margin-bottom:.35em;}
.timeline-logo{display:block; margin:.2em auto 0; height:78px; width:auto;}
.timeline-list{max-width:680px; margin:3em auto 0; position:relative; padding-left:2.4em;}
.timeline-list::before{content:""; position:absolute; left:.45em; top:.4em; bottom:.4em; width:2px; background:var(--green-700);}
.timeline-item{position:relative; padding-bottom:2.6em;}
.timeline-item:last-child{padding-bottom:0;}
.timeline-item::before{
  content:""; position:absolute; left:-2.4em; top:.3em; width:14px; height:14px; border-radius:50%;
  background:var(--yellow); box-shadow:0 0 0 4px var(--green-950), 0 0 0 5px var(--green-700);
}
.timeline-item p{margin:0; color:#eef2ec;}
.timeline-item p.timeline-year{font-family:var(--serif); font-size:1.5rem; font-weight:600; color:var(--yellow); margin-bottom:.15em;}
.timeline-item p strong{color:#fff;}

/* ---------- Rental ---------- */
.rental{padding:7em 0; background:var(--green-950); color:#fff;}
.rental-grid{display:grid; grid-template-columns:1fr 1fr; gap:4em; align-items:center;}
.rental-media img{border-radius:var(--radius); box-shadow:var(--shadow);}
.rental-copy h2{color:#fff;}
.rental-copy p{color:#d8d5c9;}
.rental-copy .checklist li{color:#e9e6dc;}
.rental-note{font-size:.9rem; font-style:italic; color:#b9b6a9;}

/* ---------- Partyservice & Verleih ---------- */
.pv-imghero{padding:0; background:#faf6f1; line-height:0;}
.pv-imghero-img{display:block; width:100%; height:auto;}
.pv-imghero .hero-actions{justify-content:center; margin-top:2.2em;}
.rental-items{padding:6em 0; background:var(--cream-2);}
.rental-intro{max-width:660px; margin:.6em auto 2.8em; text-align:center; color:var(--ink-soft);}
.rental-grid-items{display:grid; grid-template-columns:repeat(3,1fr); gap:1.4em;}
.rental-item{background:var(--paper); border-radius:var(--radius); box-shadow:var(--shadow); padding:1.7em 1.5em; display:flex; flex-direction:column; gap:.15em;}
.rental-item h3{font-family:var(--serif); font-size:1.12rem; margin:0; color:var(--green-950);}
.rental-item .ri-price{margin:.25em 0 0; font-weight:700; color:var(--green-900); font-size:1.18rem;}
.rental-item .ri-price span{font-weight:600; font-size:.8rem; color:var(--ink-soft);}
.rental-item .ri-note{margin:.2em 0 0; font-size:.85rem; color:var(--ink-soft);}

.pv-service{padding:6em 0; background:var(--green-950);}
.pv-service .kicker{color:var(--yellow);}
.pv-service h2{color:#fff;}
.pv-points{display:grid; grid-template-columns:repeat(4,1fr); gap:1.8em; margin-top:2.6em;}
.pv-point{text-align:center; display:flex; flex-direction:column; align-items:center; gap:.4em;}
.pv-point svg{width:44px; height:44px; color:var(--yellow);}
.pv-point h3{font-family:var(--serif); font-size:1.05rem; margin:.3em 0 0; color:#fff;}
.pv-point p{margin:0; font-size:.88rem; color:#d7d4c8; line-height:1.55;}

.bestellliste{padding:6em 0; background:var(--cream-2);}
.bestellliste-grid{display:grid; grid-template-columns:1fr 1fr; gap:3.4em; align-items:center;}
.bestellliste-preview{display:block; border-radius:var(--radius); box-shadow:var(--shadow); overflow:hidden; line-height:0; border:1px solid rgba(0,0,0,.08); max-width:460px;}
.bestellliste-preview img{width:100%; height:auto; display:block; transition:transform .3s ease;}
.bestellliste-preview:hover img{transform:scale(1.02);}
.bestellliste-actions{display:flex; gap:1em; flex-wrap:wrap; margin-top:1.8em;}
.bestellliste-preview{cursor:zoom-in; position:relative;}
.bestellliste-preview::after{content:"🔍 Klicken zum Vergrößern"; position:absolute; left:0; right:0; bottom:0; padding:.7em; text-align:center; font-size:.82rem; font-weight:600; color:#fff; background:linear-gradient(transparent, rgba(20,30,20,.72)); line-height:1.2; opacity:0; transition:opacity .2s ease;}
.bestellliste-preview:hover::after{opacity:1;}
.bestellliste-hint{font-size:.86rem; margin:.4em 0 0; color:var(--ink-soft);}
/* Grüne Variante – Bestellliste direkt unter dem Hero */
.bestellliste--green{background:var(--green-800);}
.bestellliste--green .kicker{color:var(--yellow);}
.bestellliste--green h2{color:#fff;}
.bestellliste--green p{color:#dcd9cd;}
.bestellliste--green .bestellliste-hint{color:var(--yellow); font-weight:600;}
.bestellliste--green .bestellliste-preview{border-color:rgba(255,255,255,.18); box-shadow:0 16px 44px rgba(0,0,0,.4);}

/* Party-Motive im Hintergrund (handgezeichnete Vorlagen als Sprite-Ausschnitte):
   grüne Flächen → weiß (invert + screen), helle Fläche → grau (multiply) */
.party-deco{position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:0;}
.party-motif{position:absolute; background-repeat:no-repeat;}
.party-deco--green .party-motif{filter:invert(1); mix-blend-mode:screen; opacity:.4;}
.party-deco--light .party-motif{mix-blend-mode:multiply; opacity:.16;}
/* Positionen */
.party-motif.pm-a{top:9%;    left:4%;   transform:rotate(-8deg) scale(1.4);}
.party-motif.pm-b{top:14%;   right:5%;  transform:rotate(6deg) scale(1.4);}
.party-motif.pm-c{bottom:12%; left:7%;  transform:rotate(6deg) scale(1.4);}
.party-motif.pm-d{bottom:9%; right:5%;  transform:rotate(-6deg) scale(1.4);}
.party-motif.pm-e{top:47%;   left:2%;   transform:rotate(9deg) scale(1.4);}
.party-motif.pm-f{top:42%;   right:2%;  transform:rotate(-10deg) scale(1.4);}
.party-motif.pm-g{top:29%;   left:11%;  transform:rotate(6deg) scale(1.4);}
.party-motif.pm-h{bottom:26%; right:11%; transform:rotate(-7deg) scale(1.4);}
.party-motif.pm-i{top:64%;   left:9%;   transform:rotate(9deg) scale(1.4);}
.party-motif.pm-j{top:20%;   right:11%; transform:rotate(-9deg) scale(1.4);}
.party-motif.pm-center{top:50%; left:50%; transform:translate(-50%,-50%) rotate(-3deg) scale(1.4);}
/* Motiv-Ausschnitte (aus den 1080×1350-Vorlagen) */
.pm--flutes{width:100px; height:89px;  background-image:url("../assets/img/party/p2.png"); background-size:193px auto; background-position:-91px 0;}
.pm--pop{width:86px; height:116px; background-image:url("../assets/img/party/p1.png"); background-size:176px auto; background-position:-88px -101px;}
.pm--mugs{width:96px; height:76px;  background-image:url("../assets/img/party/p4.png"); background-size:219px auto; background-position:-17px -8px;}
.pm--firework{width:92px; height:87px; background-image:url("../assets/img/party/p3.png"); background-size:171px auto; background-position:-77px -124px;}
.pm--stars{width:84px; height:88px; background-image:url("../assets/img/party/p3.png"); background-size:196px auto; background-position:-8px -66px;}
.pm--cocktail{width:74px; height:87px; background-image:url("../assets/img/party/p4.png"); background-size:154px auto; background-position:-9px -68px;}
.pm--flag{width:80px; height:100px; background-image:url("../assets/img/party/p2.png"); background-size:152px auto; background-position:-30px -80px;}
.pm--wine{width:64px; height:110px; background-image:url("../assets/img/party/p4.png"); background-size:184px auto; background-position:-110px -62px;}
.pm--bubble{width:110px; height:70px; background-image:url("../assets/img/party/p5.png"); background-size:216px auto; background-position:-34px -24px;}
.pm--sparkle{width:64px; height:78px; background-image:url("../assets/img/party/p3.png"); background-size:184px auto; background-position:-118px -2px;}
.pm--swirl{width:96px; height:100px; background-image:url("../assets/img/party/p5.png"); background-size:178px auto; background-position:-50px -87px;}
/* „It's time to party"-Sprechblase als sichtbarer weißer Akzent oben in der Bestellliste */
.bestellliste-toptitle{display:block; width:170px; height:108px; margin:0 0 .6em; background-image:url("../assets/img/party/p5.png"); background-repeat:no-repeat; background-size:334px auto; background-position:-53px -37px; filter:invert(1); mix-blend-mode:screen;}
/* Sektionen: relative + Inhalt über die Deko */
.bestellliste{position:relative; overflow:hidden;}
.bestellliste > .wrap{position:relative; z-index:1;}
.pv-service{position:relative; overflow:hidden;}
.pv-service > .wrap{position:relative; z-index:1;}
.anfrage-section{position:relative; overflow:hidden;}
.anfrage-section > .wrap{position:relative; z-index:1;}

/* Lightbox – Bild groß zur Ansicht (kein Download) */
.lightbox{position:fixed; inset:0; z-index:1000; display:none; align-items:center; justify-content:center; padding:3vh 3vw; background:rgba(15,22,15,.9); cursor:zoom-out;}
.lightbox.open{display:flex;}
.lightbox img{max-width:96vw; max-height:94vh; border-radius:4px; box-shadow:0 20px 60px rgba(0,0,0,.5); cursor:default;}
.lightbox-close{position:absolute; top:2vh; right:3vw; width:46px; height:46px; border:none; border-radius:50%; background:rgba(255,255,255,.15); color:#fff; font-size:1.6rem; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center;}
.lightbox-close:hover{background:rgba(255,255,255,.28);}
.lightbox-nav{position:absolute; top:50%; transform:translateY(-50%); width:52px; height:52px; border:none; border-radius:50%; background:rgba(255,255,255,.15); color:#fff; font-size:1.4rem; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; z-index:2;}
.lightbox-nav:hover{background:rgba(255,255,255,.28);}
.lightbox-prev{left:3vw;}
.lightbox-next{right:3vw;}
@media (max-width:600px){
  .lightbox-nav{width:44px; height:44px; font-size:1.2rem;}
  .lightbox-prev{left:2vw;}
  .lightbox-next{right:2vw;}
}

.anfrage-section{padding:6em 0 7em; background:var(--cream-2);}
/* Formular als grüne Karte auf Creme: grüne Umrandung, innen weiße/gelbe Schrift */
.anfrage-section .anfrage-form{background:var(--green-950); border:2px solid var(--green-700); box-shadow:var(--shadow);}
.anfrage-section .anfrage-form label{color:#fff;}
.anfrage-section .anfrage-form .form-fieldset{border-color:rgba(255,255,255,.22);}
.anfrage-section .anfrage-form .form-fieldset legend{color:var(--yellow);}
.anfrage-section .anfrage-form .qty-label{color:#fff;}
.anfrage-section .anfrage-form .qty-label small{color:#c2ccbd;}
.anfrage-section .anfrage-form .checkbox-label{color:#e8e6dc !important;}
.anfrage-section .anfrage-form .checkbox-label a{color:var(--yellow);}
.anfrage-section .anfrage-form .form-note{color:var(--yellow);}
.anfrage-intro{max-width:640px; margin:.6em auto .8em; text-align:center; color:var(--ink-soft);}
.anfrage-wa{max-width:640px; margin:0 auto 2.8em; text-align:center; font-size:.95rem; color:var(--ink);}
.anfrage-wa strong{color:var(--green-900);}
.anfrage-form{max-width:780px; margin:0 auto;}
.anfrage-form input[type=date], .anfrage-form input[type=tel]{
  font-family:var(--sans); font-size:1rem; padding:.8em 1em; border:1.5px solid var(--line); border-radius:var(--radius);
  background:var(--paper); color:var(--ink);
}
.anfrage-form input:focus{outline:2px solid var(--green-700); outline-offset:1px;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:1.2em;}
.form-fieldset{border:1.5px solid var(--line); border-radius:var(--radius); padding:1.2em 1.5em 1.5em; margin:0;}
.form-fieldset legend{font-family:var(--serif); font-weight:600; color:var(--green-950); padding:0 .5em; font-size:1.05rem;}
.qty-grid{display:grid; grid-template-columns:1fr 1fr; gap:.9em 1.6em;}
.qty-item{display:grid; grid-template-columns:1fr 72px; align-items:center; gap:.8em;}
.qty-label{font-weight:600; font-size:.92rem; color:var(--green-950);}
.qty-label small{display:block; font-weight:400; font-size:.76rem; color:var(--ink-soft);}
.qty-item input{width:100%; padding:.55em .5em; border:1.5px solid var(--line); border-radius:var(--radius); font:inherit; background:var(--paper); text-align:center;}
.form-checks{display:flex; flex-direction:column; gap:.7em;}
@media (max-width: 900px){
  .rental-grid-items{grid-template-columns:1fr 1fr;}
  .pv-points{grid-template-columns:1fr 1fr;}
  .bestellliste-grid{grid-template-columns:1fr; gap:2.4em;}
  .bestellliste-preview{margin:0 auto;}
}
@media (max-width: 720px){
  .rental-grid-items{grid-template-columns:1fr;}
  .form-row, .qty-grid{grid-template-columns:1fr;}
}

/* ---------- Vereinskarte (cardpromo) ---------- */
.cardpromo{padding:4.8em 0; background:#faf1e7; position:relative; overflow:hidden;}
.cardpromo > .wrap{position:relative; z-index:1;}
.cardpromo-banner{display:block; width:100%; max-width:1280px; height:auto; margin:0 auto;}
.cardpromo-cta{text-align:center; margin-top:1.4em;}
/* Vereinskarte – Hintergrundmotive (Sprite-Technik wie Mailbox/TGTG) */
.vk-deco{position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:0;}
.vk-motif{position:absolute; display:block; background-repeat:no-repeat; mix-blend-mode:multiply;}
.vk-motif.vk-trophy   {background-image:url("../assets/img/vk-motive/v3.png"); width:115px; height:129px; background-size:284px auto; background-position:-27px -22px;   top:2%;    left:4%;  transform:rotate(-9deg) scale(1.4);  opacity:.11;}
.vk-motif.vk-shake    {background-image:url("../assets/img/vk-motive/v1.png"); width:150px; height:67px;  background-size:375px auto; background-position:-198px -31px;  top:13%;   right:5%; transform:rotate(6deg) scale(1.4);   opacity:.12;}
.vk-motif.vk-hearts   {background-image:url("../assets/img/vk-motive/v1.png"); width:100px; height:167px; background-size:333px auto; background-position:-20px -43px;   top:33%;   left:2%;  transform:rotate(-3deg) scale(1.4);  opacity:.10;}
.vk-motif.vk-handheart{background-image:url("../assets/img/vk-motive/v2.png"); width:180px; height:109px; background-size:223px auto; background-position:-19px -146px;  top:54%;   right:3%; transform:rotate(4deg) scale(1.4);   opacity:.10;}
.vk-motif.vk-holdheart{background-image:url("../assets/img/vk-motive/v1.png"); width:125px; height:125px; background-size:313px auto; background-position:-139px -222px; bottom:21%; left:5%;  transform:rotate(7deg) scale(1.4);   opacity:.11;}
.vk-motif.vk-whistle  {background-image:url("../assets/img/vk-motive/v3.png"); width:120px; height:85px;  background-size:296px auto; background-position:-146px -250px; bottom:6%;  right:6%; transform:rotate(-11deg) scale(1.4); opacity:.12;}
.cardpromo-intro{max-width:600px; margin:0 auto .4em; font-size:.98rem;}
/* Kompaktes 2-Spalten-Layout (Payback-Stil): Text/Schritte links, Karte rechts */
.cardpromo-grid{
  display:grid; grid-template-columns:1.6fr .85fr; gap:2.4em; align-items:center; margin-top:1.8em;
}
.cardpromo-lead{color:var(--ink-soft); max-width:46ch; font-size:1.02rem; margin:.3em 0 0;}
.cardpromo-cardvisual{display:flex; justify-content:center; perspective:1000px;}
.vk-card{
  position:relative; width:340px; max-width:100%; aspect-ratio:1.586; overflow:hidden;
  border-radius:16px; padding:1.5em 1.6em;
  background:linear-gradient(145deg,var(--green-800) 0%,var(--green-950) 70%);
  box-shadow:0 24px 40px -18px rgba(30,42,25,.6);
  transform:rotate(-4deg); transition:transform .4s ease;
  display:flex; flex-direction:column;
}
.cardpromo-cardvisual:hover .vk-card{transform:rotate(0deg);}
.vk-card-shine{
  position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(120deg,rgba(255,255,255,.14) 0%,rgba(255,255,255,0) 42%);
}
.vk-card-top{display:flex; align-items:flex-start; justify-content:space-between; gap:1em;}
.vk-card-logo{height:58px; width:auto; flex:none;}
.vk-card-heart{width:30px; height:30px; fill:var(--yellow); flex:none;}
.vk-card-chip{
  width:44px; height:32px; margin-top:1.3em; border-radius:6px;
  background:linear-gradient(135deg,#f6d97a,#c99a2e);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.15);
}
.vk-card-label{
  margin:.7em 0 0; color:#fff; font-family:var(--serif); font-size:1.55rem; letter-spacing:.01em;
}
.vk-card-bottom{
  margin-top:auto; display:flex; align-items:flex-end; justify-content:space-between; gap:1em;
}
.vk-card-tag{
  color:var(--yellow); text-transform:uppercase; letter-spacing:.14em; font-size:.68rem; font-weight:700;
}
.vk-card-year{color:rgba(255,255,255,.75); font-size:.9rem; letter-spacing:.15em;}
/* Schritte als kompakte vertikale Liste (Icon + Text nebeneinander) */
.cardpromo-steps{display:flex; flex-direction:column; gap:1em; margin:1.5em 0;}
.cardpromo-step{display:flex; align-items:center; gap:1em; text-align:left;}
.cardpromo-step svg{width:40px; height:40px; flex:none; color:var(--green-700);}
.cardpromo-step h3{font-family:var(--serif); font-size:1.08rem; margin:0 0 .1em; color:var(--green-950);}
.cardpromo-step p{margin:0; font-size:.9rem;}
.cardpromo-clubs{
  margin-top:2.6em; background:var(--green-950); border-radius:var(--radius); padding:1.4em 2.2em; text-align:center;
}
.cardpromo-clubs-title{
  color:var(--yellow); text-transform:uppercase; letter-spacing:.1em; font-weight:700; font-size:.8rem; margin-bottom:1em;
}
.cardpromo-clubs-list{display:flex; flex-wrap:wrap; justify-content:center; gap:.6em 2em; list-style:none; margin:0; padding:0;}
.cardpromo-clubs-list li{color:#fff; font-family:var(--serif); font-size:1.05rem;}
/* Bewegte Vereinsleiste (wie Partner-Streifen) */
.clubs-marquee{
  overflow:hidden; width:100%;
  -webkit-mask-image:linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
  mask-image:linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
}
.clubs-track{
  display:flex; align-items:center; gap:1.5em; width:max-content;
  animation:clubs-scroll 34s linear infinite;
}
.clubs-marquee:hover .clubs-track{animation-play-state:paused;}
.club-item{font-family:var(--serif); font-size:1.1rem; color:#fff; white-space:nowrap;}
.club-sep{color:var(--yellow); font-size:.55rem; line-height:1;}
@keyframes clubs-scroll{
  from{transform:translateX(0);}
  to{transform:translateX(-50%);}
}
@media (prefers-reduced-motion: reduce){
  .clubs-track{animation:none; flex-wrap:wrap; width:auto; justify-content:center; gap:.6em 1.5em;}
}

/* ---------- Payback ---------- */
.payback{
  padding:6em 0; color:#fff;
  background:radial-gradient(120% 120% at 80% 20%, #12203f 0%, #0a0b10 55%);
}
.payback-grid{display:grid; grid-template-columns:1.15fr .85fr; gap:3.5em; align-items:center;}
.payback-logo{height:42px; width:auto; margin-bottom:1.6em;}
.payback h2{color:#fff; font-size:clamp(2rem,3.2vw,2.8rem); white-space:nowrap; margin-left:-.35em;}
.payback-lead{color:rgba(255,255,255,.8); max-width:60ch; font-size:1.22rem;}
.payback-steps{display:flex; flex-direction:column; gap:1.5em; margin:2.3em 0 1.7em;}
.payback-step{display:flex; align-items:center; gap:1.2em;}
.payback-step svg{width:52px; height:52px; flex:none; color:#ffd400;}
.payback-step h3{color:#fff; font-family:var(--serif); font-size:1.35rem; margin:0 0 .1em;}
.payback-step p{color:rgba(255,255,255,.7); margin:0; font-size:1.05rem;}
.payback-slogan{
  font-family:var(--serif); font-style:italic; font-size:1.85rem; color:#ffd400; margin:0;
}
.payback-visual{display:flex; justify-content:center;}
.payback-figure{
  width:100%; max-width:430px; aspect-ratio:.88;
  background-image:url("../assets/img/payback-poster.png");
  background-repeat:no-repeat;
  background-size:880px auto;
  background-position:-372px -556px;
  -webkit-mask-image:radial-gradient(ellipse 68% 66% at 52% 48%, #000 52%, transparent 86%);
  mask-image:radial-gradient(ellipse 68% 66% at 52% 48%, #000 52%, transparent 86%);
}

/* ---------- EDEKA App ---------- */
.edekaapp{
  padding:6em 0; color:#fff; border-top:1px solid rgba(255,255,255,.08);
  background:radial-gradient(120% 120% at 22% 20%, #2a2a2a 0%, #0c0c0c 60%);
}
.edekaapp-grid{display:grid; grid-template-columns:.82fr 1.18fr; gap:3.5em; align-items:center; max-width:2400px;}
.edekaapp-kicker{color:var(--yellow);}
.edekaapp h2{color:#fff; font-size:clamp(1.8rem,3.2vw,2.5rem);}
.edekaapp-lead{color:rgba(255,255,255,.8); max-width:52ch; font-size:1.05rem;}
.edekaapp-benefits{display:flex; flex-direction:column; gap:1em; margin:1.9em 0 2.1em;}
.edekaapp-benefits li{display:flex; align-items:flex-start; gap:.9em; color:rgba(255,255,255,.82); font-size:.98rem;}
.edekaapp-benefits svg{width:26px; height:26px; flex:none; color:var(--yellow); margin-top:1px;}
.edekaapp-benefits strong{color:#fff; font-weight:600;}
.edekaapp-badges{display:flex; gap:1em; flex-wrap:wrap;}
.edekaapp-badges img{height:48px; width:auto; transition:transform .2s ease;}
.edekaapp-badges a:hover img{transform:translateY(-2px);}
.edekaapp-visual{display:flex; justify-content:center;}
.appshow{position:relative; width:100%; max-width:290px; aspect-ratio:.68; margin-bottom:1.6em;}
.appshow-slide{
  position:absolute; inset:0; width:100%; height:100%; object-fit:contain;
  opacity:0; transform:scale(.97); transition:opacity .8s ease, transform .8s ease;
  filter:drop-shadow(0 22px 40px rgba(0,0,0,.55));
}
.appshow-slide.is-active{opacity:1; transform:scale(1);}
.appshow-dots{
  position:absolute; left:0; right:0; bottom:-1.7em; display:flex; justify-content:center; gap:.55em;
}
.appshow-dot{
  width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.3);
  border:none; padding:0; cursor:pointer; transition:background .2s ease, transform .2s ease;
}
.appshow-dot.is-active{background:var(--yellow); transform:scale(1.25);}

/* ---------- Filialen-Übersicht ---------- */
.branches{padding:3.6em 0; background:var(--green-800); color:#fff;}
.branches-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:3.2em;}
.branch{
  background:none; border-radius:0; padding:0; text-align:center;
  display:flex; flex-direction:column; align-items:center; gap:.6em; box-shadow:none;
}
.branch-logo{height:112px; display:flex; align-items:center; justify-content:center; margin-bottom:.7em;}
.branch-logo-brand{max-height:104px; width:auto; max-width:100%;}
.branch-logo-badge{max-height:80px; width:auto; max-width:100%; border-radius:9px;}
.branch h3{font-size:1.45rem; margin:0 0 .15em; color:#fff;}
.branch-hours{font-weight:700; color:var(--yellow); margin:0; line-height:1.5;}
.branch-addr{margin:.4em 0 0; color:#e4e1d6; font-size:.95rem; line-height:1.6;}
.branch-note{margin:.4em 0 0; color:#e4e1d6; font-size:.92rem; line-height:1.6;}
.branch a{color:var(--yellow); font-weight:600; margin-top:.25em;}
.branch a:hover{text-decoration:underline;}

/* ---------- Testimonials ---------- */
.testimonials{padding:7em 0; background:var(--cream-2);}
.testimonial-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1.6em; margin-top:3em;}
.testimonial{background:var(--paper); padding:1.8em; border-radius:var(--radius); border-left:3px solid var(--yellow); margin:0;}
.testimonial p{font-size:.95rem; color:var(--ink); margin-bottom:1em;}
.testimonial cite{font-style:normal; font-weight:700; color:var(--green-800); font-size:.85rem;}

/* ---------- Career ---------- */
.career{padding:5em 0; background:var(--yellow); text-align:center;}
.career-inner{max-width:640px; margin:0 auto;}
.career h2{color:var(--green-950);}
.career p{color:var(--green-950); opacity:.85; font-size:1.05rem;}

/* ---------- Karriere: Stellenangebote ---------- */
.jobs{padding:6em 0 6.5em; background:var(--cream-2);}
.jobs h2.center{margin-bottom:.4em;}
.jobs-intro{max-width:640px; margin:0 auto 3em; text-align:center; color:var(--ink-soft);}
.jobs-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:1.8em;}
.job-card{
  background:var(--paper); border-radius:var(--radius); box-shadow:var(--shadow);
  padding:2.2em; display:flex; flex-direction:column; align-items:flex-start; gap:.8em;
  border-top:4px solid var(--yellow);
}
.job-tags{display:flex; flex-wrap:wrap; gap:.5em;}
.job-tag{
  font-size:.72rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
  padding:.4em .85em; border-radius:999px; background:var(--cream-2); color:var(--green-800);
}
.job-tag--type{background:var(--green-950); color:var(--yellow);}
.job-card h3{font-family:var(--serif); font-size:1.35rem; color:var(--green-950); margin:.1em 0 0;}
.job-card p{color:var(--ink-soft); margin:0; flex-grow:1;}
.job-card .btn{margin-top:.4em;}

/* ---------- Karriere: Benefits ---------- */
.benefits{padding:6em 0; background:var(--green-950); color:#fff;}
.benefits .kicker{color:var(--yellow);}
.benefits h2.center{color:#fff; margin-bottom:2.6em;}
.benefits-grid{
  display:flex; flex-wrap:wrap; justify-content:center; gap:1.8em 2.6em;
  max-width:1000px; margin:0 auto;
}
.benefit{flex:0 1 260px; display:flex; align-items:center; gap:1em;}
.benefit svg{width:34px; height:34px; color:var(--yellow); flex:0 0 auto;}
.benefit span{font-weight:600; font-size:1.02rem; line-height:1.35;}

/* ---------- Contact ---------- */
.contact{padding:7em 0; background:var(--paper);}
.contact-grid{display:grid; grid-template-columns:.9fr 1.1fr; gap:4em;}
.contact-details{margin-top:2em; display:flex; flex-direction:column; gap:1.4em;}
.contact-details a{color:var(--green-800); font-weight:600;}
.phone-label{display:inline-block; min-width:5.8em;}
.contact-form{display:flex; flex-direction:column; gap:1.2em; background:var(--green-950); border:2px solid var(--green-700); box-shadow:var(--shadow); padding:2.2em; border-radius:var(--radius);}
.contact-form label{display:flex; flex-direction:column; gap:.5em; font-weight:600; font-size:.9rem; color:#fff;}
.contact-form .checkbox-label{color:#e8e6dc !important;}
.contact-form .checkbox-label a{color:var(--yellow);}
.contact-form .form-note{color:var(--yellow);}
.contact-form input[type=text], .contact-form input[type=email], .contact-form textarea{
  font-family:var(--sans); font-size:1rem; padding:.8em 1em; border:1.5px solid var(--line); border-radius:var(--radius);
  background:var(--paper); color:var(--ink); resize:vertical;
}
.contact-form input:focus, .contact-form textarea:focus{outline:2px solid var(--green-700); outline-offset:1px;}
.checkbox-label{flex-direction:row !important; align-items:flex-start; gap:.6em !important; font-weight:400 !important; font-size:.85rem; color:var(--ink-soft) !important;}
.checkbox-label input{margin-top:.2em;}
.checkbox-label a{color:var(--green-800); text-decoration:underline;}
.form-note{font-size:.85rem; color:var(--green-800); font-weight:600; min-height:1.2em;}

/* ---------- Kontakt: Standort-Karten (Google Maps) ---------- */
.maps{padding:5em 0 6em; background:var(--cream-2);}
.maps h2.center{margin-bottom:.3em;}
.maps-intro{max-width:600px; margin:0 auto; text-align:center; color:var(--ink-soft);}
.maps-grid{display:grid; grid-template-columns:1fr 1fr; gap:2em; margin-top:2.6em;}
.map-card{background:var(--paper); border-radius:var(--radius); box-shadow:var(--shadow); overflow:hidden; display:flex; flex-direction:column;}
.map-card iframe{width:100%; height:300px; border:0; display:none; filter:grayscale(.15);}
.map-card.is-loaded iframe{display:block;}
.map-card.is-loaded .map-consent{display:none;}
/* Platzhalter, solange die Karte noch nicht geladen ist (Zwei-Klick) */
.map-consent{
  height:300px; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:1em; text-align:center; padding:1.6em; background:var(--cream-2); color:var(--ink-soft);
}
.map-consent p{margin:0; font-size:.9rem; max-width:300px; line-height:1.5;}

/* Cookie-/Consent-Banner */
.consent{position:fixed; left:0; right:0; bottom:0; z-index:1000; background:var(--green-950); box-shadow:0 -6px 26px rgba(0,0,0,.28);}
.consent-inner{max-width:1080px; margin:0 auto; padding:1.3em 1.5em; display:flex; align-items:center; gap:1.6em; flex-wrap:wrap;}
.consent-text{flex:1 1 360px; margin:0; font-size:.9rem; line-height:1.55; color:#e9e6dc;}
.consent-text strong{color:#fff;}
.consent-text a{color:var(--yellow); text-decoration:underline;}
.consent-actions{display:flex; gap:.7em; flex-wrap:wrap;}
.consent-actions .btn{margin:0;}
.btn-ghost{background:transparent; color:#fff; border-color:rgba(255,255,255,.55);}
.btn-ghost:hover{background:rgba(255,255,255,.12); border-color:#fff;}
.map-card-body{padding:1.4em 1.6em;}
.map-card-body h3{font-family:var(--serif); font-size:1.2rem; color:var(--green-950); margin:0 0 .15em;}
.map-card-body p{margin:0 0 .7em; color:var(--ink-soft); font-size:.95rem;}
.map-card-body a{color:var(--green-800); font-weight:600; font-size:.9rem; text-decoration:none;}
.map-card-body a:hover{text-decoration:underline;}

/* ---------- Kontakt: Google-Bewertungen (dezent) ---------- */
.reviews{padding:4.5em 0 5.5em; background:var(--cream);}
.reviews h2.center{margin-bottom:.3em; font-size:1.5rem;}
.reviews-intro{max-width:560px; margin:0 auto 2em; text-align:center; color:var(--ink-soft);}
.reviews-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:.8em; max-width:620px; margin:0 auto;}
.review-btn{
  display:flex; align-items:center; justify-content:center; gap:.5em; width:100%;
  padding:.7em 1.15em; border:1px solid var(--yellow); border-radius:999px;
  color:#fff; font-weight:600; font-size:.9rem; text-decoration:none;
  background:var(--green-950); transition:border-color .2s ease, background .2s ease;
}
.review-btn:hover{border-color:var(--yellow-dark); background:var(--green-900);}
.review-btn svg{width:15px; height:15px; color:var(--yellow); flex:0 0 auto;}

/* ---------- Ansprechpartner (Karriere) ---------- */
.contact-person{padding:6em 0; background:var(--paper);}
.contact-person-grid{display:grid; grid-template-columns:.7fr 1.3fr; gap:3.5em; align-items:center; max-width:960px; margin:0 auto;}
.contact-person-photo{
  aspect-ratio:1; border-radius:50%; background:var(--cream); border:2px dashed var(--line);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.6em; color:var(--green-700);
  max-width:260px; width:100%; margin:0 auto;
}
.contact-person-photo svg{width:64px; height:64px;}
.contact-person-photo span{font-size:.8rem; text-transform:uppercase; letter-spacing:.1em; font-weight:700; color:var(--ink-soft);}
.contact-person-role{color:var(--green-700); font-weight:700; margin:-.3em 0 1em;}
.contact-person-text p:not(.kicker):not(.contact-person-role){font-size:1.05rem;}

/* ---------- Kurzbewerbung ---------- */
.shortapp{padding:6em 0; background:var(--cream-2);}
.shortapp-intro{max-width:560px; margin:0 auto 2.4em;}
.shortapp-form{
  max-width:640px; margin:0 auto; display:flex; flex-direction:column; gap:1.2em;
  background:var(--green-950); border:2px solid var(--green-700); padding:2.4em; border-radius:var(--radius); box-shadow:var(--shadow);
}
.shortapp-form label{display:flex; flex-direction:column; gap:.5em; font-weight:600; font-size:.9rem; color:#fff;}
.shortapp-form .checkbox-label{color:#e8e6dc !important;}
.shortapp-form .checkbox-label a{color:var(--yellow);}
.shortapp .form-note{color:var(--yellow);}
.shortapp-form input{
  font-family:var(--sans); font-size:1rem; padding:.8em 1em; border:1.5px solid var(--line);
  border-radius:var(--radius); background:var(--paper); color:var(--ink);
}
.shortapp-form input:focus{outline:2px solid var(--green-700); outline-offset:1px;}
.shortapp-form input.field-prefilled{
  border-color:var(--yellow); background:#fffbe6;
  box-shadow:0 0 0 3px rgba(255,204,0,.35); transition:box-shadow .3s ease, background .3s ease;
}
.shortapp-row{display:grid; grid-template-columns:1fr 1fr; gap:1.2em;}
.shortapp-form .btn{align-self:flex-start;}

/* ---------- Legal pages ---------- */
.legal{padding:5em 0 7em;}
.legal-wrap{max-width:760px;}
.legal-wrap h1{margin-bottom:.2em;}
.legal-stand{color:var(--ink-soft); font-size:.9rem; margin-bottom:2em;}
.legal-wrap h2{font-size:1.35rem; margin-top:1.8em;}
.legal-wrap h3{font-size:1.05rem; margin-top:1.4em;}
.legal-wrap a{color:var(--green-800); text-decoration:underline;}
.legal-list{margin:0 0 1em; padding-left:1.4em;}
.legal-list li{color:var(--ink-soft); list-style:disc; margin-bottom:.4em;}

/* ---------- Footer ---------- */
.site-footer{background:var(--green-950); color:#c9c6ba; padding-top:2.8em;}
.footer-inner{
  display:grid; grid-template-columns:1.7fr 1fr 1fr; gap:2.4em; align-items:center;
  padding-bottom:1.8em;
}
.footer-brand{display:flex; align-items:center; gap:1.1em;}
.footer-logo{height:56px; width:auto; flex:none;}
.footer-address{font-style:normal; font-size:.9rem; line-height:1.6; color:#c9c6ba;}
.footer-address strong{display:block; color:#fff; font-family:var(--serif); font-weight:600; font-size:1.05rem; margin-bottom:.25em;}
.footer-contact{font-size:.9rem; line-height:1.6;}
.footer-contact a{color:var(--yellow);}
.footer-contact a:hover{text-decoration:underline;}
.footer-links{display:flex; flex-direction:column; gap:.55em; font-size:.92rem;}
.footer-links a{color:#c9c6ba;}
.footer-links a:hover{color:var(--yellow);}
.footer-bottom{padding:0 24px 2.4em; font-size:.8rem; color:#8f8c81;}
.footer-bottom p{margin:0;}

/* ---------- Responsive ---------- */
@media (max-width: 900px){
  .intro-grid, .rental-grid, .contact-grid, .cardpromo-grid{grid-template-columns:1fr; gap:2.5em;}
  .cardpromo-cardvisual{order:2;}
  .maps-grid{grid-template-columns:1fr;}
  .intro-media{order:2;}
  .contact-person-grid{grid-template-columns:1fr; gap:2em; text-align:center;}
  .location-grid, .regional-grid{grid-template-columns:1fr;}
  .location-grid--3{grid-template-columns:1fr;}
  .branches-grid{grid-template-columns:1fr 1fr; gap:2em 1.6em;}
  .branch:not(:last-child){border-right:none;}
  .testimonial-grid{grid-template-columns:1fr 1fr;}
  .footer-inner{grid-template-columns:1.4fr 1fr 1fr; gap:1.6em;}
  .quicklinks-grid{grid-template-columns:1fr 1fr;}
  .quicklink-card{border-right:none; border-bottom:1px solid rgba(255,255,255,.08);}
  .quicklink-card:nth-child(2n){border-right:none;}
  .quicklinks{margin-top:-60px;}
  .partner-directory-grid{grid-template-columns:1fr 1fr;}
  .benefits-grid{grid-template-columns:1fr 1fr;}
  .cardpromo-steps{grid-template-columns:1fr;}
  .cardpromo-showcase{grid-template-columns:1fr; gap:2.4em; padding:2.4em; text-align:center;}
  .cardpromo-showcase .vk-card{transform:rotate(0);}
  .cardpromo-highlight-num::after{margin-left:auto; margin-right:auto;}
  .cardpromo-highlight-text{margin-left:auto; margin-right:auto;}
}

@media (max-width: 720px){
  .brand-mobile{display:flex;}
  .brand-mobile img{height:44px; width:auto;}
  .brand-inline{display:none;}
  .main-nav{
    position:fixed; inset:0 0 0 auto; top:0; height:100vh; width:78%; max-width:340px;
    background:var(--paper); flex-direction:column; align-items:flex-start; justify-content:center;
    gap:1.6em; padding:2em; transform:translateX(100%); transition:transform .25s ease; box-shadow:-10px 0 30px rgba(0,0,0,.15);
  }
  .main-nav.open{transform:translateX(0);}
  .nav-toggle{display:flex;}
  .testimonial-grid{grid-template-columns:1fr;}
  .branches-grid{grid-template-columns:1fr;}
  .shortapp-row, .mailbox-row{grid-template-columns:1fr;}
  .jobs-grid{grid-template-columns:1fr;}
  .benefits-grid{grid-template-columns:1fr; max-width:340px;}
  .tgtg-motif.tg-6{display:none;}
  .og-motif.og-apple, .og-motif.og-peach, .og-motif.og-straw, .og-motif.og-banana, .og-motif.og-basket{display:none;}
  .gallery-grid{column-count:2;}
  .ue-motif.ue-note, .ue-motif.ue-scroll{display:none;}
  .footer-inner{grid-template-columns:1fr; gap:1.6em;}
  .hero{min-height:auto; padding:5em 0;}
  .subhero{background-attachment:scroll; min-height:34vh;}
  .quicklinks{margin-top:0;}
  .quicklink-card{padding:2em 1.2em;}
  .partner-directory-grid, .partner-directory-grid--narrow{grid-template-columns:1fr;}
  .address-grid{grid-template-columns:1fr; gap:1.6em;}
  .cardpromo-clubs-list{flex-direction:column; gap:.6em;}
  .payback-grid{grid-template-columns:1fr; gap:1em;}
  .payback-visual{order:-1;}
  .payback-figure{max-width:320px; aspect-ratio:1; background-size:660px auto; background-position:-278px -418px;}
  .edekaapp-grid{grid-template-columns:1fr; gap:1.8em;}
  .appshow{max-width:235px;}
}

/* ---------- Standort-Karten: zentrierte Button-Reihe (Route + Galerie) ---------- */
.location-actions{display:flex; flex-wrap:wrap; justify-content:center; gap:.7em; margin-top:1.1em;}
.location-actions .btn{margin-top:0;}

/* ---------- Galerie-Seite ---------- */
.gallery{padding:4.5em 0 5em; background:var(--cream); scroll-margin-top:90px;}
.gallery + .gallery{border-top:1px solid var(--line);}
.gallery .kicker{margin-bottom:.4em;}
.gallery h2.center{margin-bottom:.3em;}
.gallery-intro{max-width:600px; margin:0 auto 2.4em; text-align:center; color:var(--ink-soft);}
.gallery-grid{column-count:3; column-gap:1.1em;}
.gallery-item{
  display:block; break-inside:avoid; margin:0 0 1.1em; position:relative;
  border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow);
  background:var(--green-950); text-decoration:none;
}
.gallery-item img{display:block; width:100%; height:auto; transition:transform .45s ease;}
.gallery-item:hover img{transform:scale(1.05);}
.gallery-cap{
  position:absolute; left:0; right:0; bottom:0; padding:1.4em .95em .8em;
  font-size:.9rem; font-weight:600; color:#fff;
  background:linear-gradient(to top, rgba(30,47,33,.88), rgba(30,47,33,0));
}
.gallery-soon{text-align:center; color:var(--ink-soft); margin-top:1em;}

/* ---------- Team-Seite (Wir stellen uns vor) ---------- */
.team{padding:4.5em 0 6em; background:var(--cream);}
.team-group{margin-top:3.2em;}
.team-group:first-child{margin-top:.5em;}
.team-group > .kicker{margin-bottom:1.6em;}
.team-grid{display:flex; flex-wrap:wrap; justify-content:center; gap:1.6em;}
.team-card{
  background:var(--paper); border:1px solid var(--line); border-radius:var(--radius);
  padding:2.1em 1.7em; width:255px; text-align:center; box-shadow:var(--shadow);
}
.team-photo{
  width:118px; height:118px; border-radius:50%; margin:0 auto 1.1em;
  background:var(--green-950); color:var(--yellow);
  display:flex; align-items:center; justify-content:center; overflow:hidden;
  font-family:var(--serif); font-size:2.1rem; font-weight:600; line-height:1;
}
.team-photo img{width:100%; height:100%; object-fit:cover;}
.team-card h3{margin:0 0 .12em; font-size:1.18rem;}
.team-role{color:var(--green-700); font-weight:700; margin:0 0 .7em; font-size:.95rem;}
.team-loc{
  display:inline-block; font-size:.74rem; text-transform:uppercase; letter-spacing:.08em;
  font-weight:700; color:var(--green-800); background:var(--cream-2); padding:.28em .75em; border-radius:999px;
}
.team-card--lead{background:var(--green-950); border-color:var(--green-700);}
.team-card--lead h3{color:#fff;}
.team-card--lead .team-role{color:var(--yellow);}
.team-card--lead .team-photo{background:var(--yellow); color:var(--green-950);}
.team-card--lead .team-loc{background:var(--green-800); color:#fff;}
.team-back{text-align:center; margin-top:3.2em;}
.team-back a{color:var(--green-800); font-weight:700; text-decoration:none;}
.team-back a:hover{color:var(--green-950); text-decoration:underline;}

/* ---------- Background utilities (für abwechselnde Sektionsfarben) ---------- */
.bg-paper{background:var(--paper);}
.bg-cream{background:var(--cream);}
.bg-cream-2{background:var(--cream-2);}

/* ---------- Hintergrund-Motive (Obst/Gemüse auf O+G, Werdegang auf Über uns) ---------- */
.og-decorated{position:relative; overflow:hidden;}
.og-decorated > .wrap{position:relative; z-index:1;}
.og-deco{position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:0;}
.og-motif{position:absolute; display:block; background-repeat:no-repeat; mix-blend-mode:multiply; opacity:.12;}
.og-motif.og-kiwi  {background-image:url('../assets/img/og-motive/o1.png'); width:135px; height:110px; background-size:304px auto; background-position:-155px 0;     top:4%;    left:4%;   transform:rotate(-9deg) scale(1.4);}
.og-motif.og-broc  {background-image:url('../assets/img/og-motive/o1.png'); width:128px; height:131px; background-size:288px auto; background-position:-11px -77px;   bottom:7%;  left:6%;   transform:rotate(5deg) scale(1.4);}
.og-motif.og-lemon {background-image:url('../assets/img/og-motive/o1.png'); width:110px; height:144px; background-size:264px auto; background-position:-144px -171px; top:17%;   right:5%;  transform:rotate(11deg) scale(1.4);}
.og-motif.og-apple {background-image:url('../assets/img/og-motive/o2.png'); width:118px; height:133px; background-size:266px auto; background-position:-15px 0;      top:auto;  bottom:6%; left:5%;   transform:rotate(-11deg) scale(1.4);}
.og-motif.og-peach {background-image:url('../assets/img/og-motive/o2.png'); width:122px; height:135px; background-size:286px auto; background-position:-3px -212px;   bottom:11%; right:30%; transform:rotate(6deg) scale(1.4);}
.og-motif.og-carrot{background-image:url('../assets/img/og-motive/o3.png'); width:118px; height:140px; background-size:266px auto; background-position:-17px -179px;  bottom:16%; right:5%;  transform:rotate(-13deg) scale(1.4);}
.og-motif.og-basket{background-image:url('../assets/img/og-motive/o3.png'); width:140px; height:160px; background-size:309px auto; background-position:-14px -14px;   top:3%;    left:41%;  transform:rotate(4deg) scale(1.4);}
.og-motif.og-straw {background-image:url('../assets/img/og-motive/o5.png'); width:132px; height:151px; background-size:297px auto; background-position:-11px -14px;   bottom:22%; left:31%;  transform:rotate(-5deg) scale(1.4);}
.og-motif.og-banana{background-image:url('../assets/img/og-motive/o5.png'); width:138px; height:124px; background-size:311px auto; background-position:-118px -196px; top:3%;    left:34%; right:auto; transform:rotate(13deg) scale(1.4);}

.ue-deco{position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:0;}
.ue-motif{position:absolute; display:block; background-repeat:no-repeat; background-image:url('../assets/img/ueber-motive/u1.png'); filter:invert(1); mix-blend-mode:screen; opacity:.16;}
.ue-motif.ue-tree  {width:155px; height:152px; background-size:349px auto; background-position:-16px -39px;   top:9%;     left:4%;   transform:rotate(-8deg) scale(1.4);}
.ue-motif.ue-scroll{width:135px; height:135px; background-size:405px auto; background-position:-248px -11px;  top:24%;    right:5%;  transform:rotate(9deg) scale(1.4);}
.ue-motif.ue-note  {width:145px; height:130px; background-size:326px auto; background-position:-178px -133px; bottom:27%; right:4%;  transform:rotate(-4deg) scale(1.4);}
.ue-motif.ue-book  {width:155px; height:89px;  background-size:356px auto; background-position:-185px -340px; bottom:8%;  left:6%;   transform:rotate(6deg) scale(1.4);}
/* zusätzliche, versetzt gestreute Motive (füllen die leeren Seitenbänder, unregelmäßige Höhen) */
.ue-motif.ue-b2    {width:155px; height:89px;  background-size:356px auto; background-position:-185px -340px; top:45%;    left:5%;   transform:rotate(8deg) scale(1.4);}   /* Buch */
.ue-motif.ue-t2    {width:155px; height:152px; background-size:349px auto; background-position:-16px -39px;   top:6%;     right:7%;  transform:rotate(10deg) scale(1.4);}  /* Baum */
.ue-motif.ue-n2    {width:145px; height:130px; background-size:326px auto; background-position:-178px -133px; top:56%;    right:6%;  transform:rotate(-9deg) scale(1.4);}  /* Feder */
.ue-motif.ue-s2    {width:135px; height:135px; background-size:405px auto; background-position:-248px -11px;  top:70%;    left:7%;   transform:rotate(-6deg) scale(1.4);}  /* Schriftrolle */
.timeline{position:relative; overflow:hidden;}
.timeline > .wrap{position:relative; z-index:1;}

/* ---------- Aktuelles-Feed (aktuelles.html) ---------- */
.feed-section{background:var(--cream);}
.feed{position:relative; max-width:760px; margin:2.4em auto 0; padding-left:2.4em;}
.feed::before{content:""; position:absolute; left:.5em; top:.4em; bottom:.4em; width:2px; background:#e3d9c2;}
.feed-item{position:relative; margin-bottom:1.6em;}
.feed-item::before{content:""; position:absolute; left:-2.05em; top:1.5em; width:14px; height:14px; border-radius:50%; background:var(--yellow); border:3px solid var(--cream); box-shadow:0 0 0 1px #e3d9c2;}
.feed-card{background:var(--paper); border:1px solid #eae1cd; border-radius:14px; overflow:hidden;}
.feed-media{aspect-ratio:16/9; overflow:hidden; background:var(--cream-2);}
.feed-media img{width:100%; height:100%; object-fit:cover; display:block;}
/* Hochformat-Foto (Instagram-Look 4:5) */
.feed-media--tall{aspect-ratio:4/5;}
/* Volles Bild/Banner ohne Beschnitt – ganze Grafik sichtbar */
.feed-media--full{aspect-ratio:auto; background:#faf6f1;}
.feed-media--full img{height:auto; object-fit:contain;}
/* Bild-Slideshow im Feed (mehrere Bilder, gelbe Punkte unten) */
.feed-slider{position:relative;}
.feed-slider .feed-slide{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity .4s ease;}
.feed-slider .feed-slide.is-active{opacity:1;}
.feed-slider .feed-slide--video{object-fit:contain; background:#0d140f;}
.feed-dots{position:absolute; left:0; right:0; bottom:12px; display:flex; justify-content:center; gap:8px; z-index:3;}
.feed-dot{width:11px; height:11px; padding:0; border:none; border-radius:50%; cursor:pointer; background:rgba(255,255,255,.6); box-shadow:0 1px 3px rgba(0,0,0,.45); transition:background .2s ease, transform .2s ease;}
.feed-dot:hover{transform:scale(1.15);}
.feed-dot.is-active{background:var(--yellow);}
/* Pfeile links/rechts */
.feed-arrow{position:absolute; top:50%; transform:translateY(-50%); width:40px; height:40px; padding:0; border:none; border-radius:50%; cursor:pointer; display:flex; align-items:center; justify-content:center; background:rgba(30,47,33,.55); color:#fff; z-index:3; transition:background .2s ease;}
.feed-arrow:hover{background:rgba(30,47,33,.85);}
.feed-arrow svg{width:20px; height:20px;}
.feed-arrow--prev{left:10px;}
.feed-arrow--next{right:10px;}
.feed-body{padding:1.1em 1.3em 1.2em;}
.feed-meta{color:var(--green-700); font-size:.82rem; font-weight:700; letter-spacing:.04em;}
.feed-card h3{font-size:1.35rem; color:var(--green-950); margin:.25em 0 .4em;}
.feed-card p{margin:0; color:var(--ink-soft); font-size:.98rem;}
.feed-tag{display:inline-block; margin-top:.9em; background:var(--yellow); color:var(--green-950); font-weight:700; font-size:.85rem; padding:.5em .95em; border-radius:4px; text-decoration:none;}
.feed-tag:hover{background:var(--yellow-dark);}
/* Grüne Variante (Meilensteine / Karten ohne Bild) */
.feed-card--green{background:var(--green-950); border-color:var(--green-800);}
.feed-card--green .feed-meta{color:var(--yellow);}
.feed-card--green h3{color:#fff;}
.feed-card--green p{color:#d7e0d4;}
/* Meilenstein-Marker (gefüllter Punkt) */
.feed-item--milestone::before{background:var(--green-800); box-shadow:0 0 0 1px #e3d9c2;}
.feed-follow{text-align:center; margin-top:2.4em;}
/* Social-Icons (Instagram/Facebook) – Original-Logos, Aktuelles-Intro + Footer */
.social-links{display:flex; justify-content:center; gap:.9em; margin-top:1.5em;}
.social-links a{display:inline-flex; transition:transform .2s ease;}
.social-links a:hover{transform:translateY(-2px);}
.social-links img{width:42px; height:42px; display:block; border-radius:12px;}
.page-intro-slogan{margin-top:.6em; font-weight:600; color:var(--yellow);}
.footer-social{display:flex; gap:.6em; margin-top:.9em;}
.footer-social a{display:inline-flex; transition:transform .2s ease, opacity .2s ease;}
.footer-social a:hover{transform:translateY(-2px); opacity:.9;}
.footer-social img{width:27px; height:27px; display:block; border-radius:8px;}
@media (max-width:600px){
  .feed{padding-left:1.9em; margin-top:1.6em;}
  .feed-card h3{font-size:1.2rem;}
}

/* Service-Banner (Startseite, #service) – volle Grafik statt Karten-Grid */
/* ---------- Service-Banner (Startseite, #service) – volle Grafik (2400×1000) ---------- */
/* Rand-Streifen (Wand+Boden vom Bildrand) laufen auf breiten Screens bis zum Bildschirmrand weiter */
.service-banner{
  padding:0; line-height:0; text-align:center; background:#f5ecdf;
  background-image:url("../assets/img/service-edge-left.png"), url("../assets/img/service-edge-right.png");
  background-position:left center, right center;
  background-size:51% 100%, 51% 100%;
  background-repeat:no-repeat, no-repeat;
}
.service-banner img{display:inline-block; position:relative; width:100%; max-width:2400px; height:auto;}

/* Kundenbriefkasten + TooGoodToGo + Vereinskarte – gemeinsame größere Schriftstufe (User-Wunsch) */
.mailbox h2, .intro.tgtg h2, .cardpromo .heading-heart{font-size:clamp(2.4rem,4.3vw,3.6rem);}
.mailbox .kicker, .intro.tgtg .kicker, .cardpromo .kicker{font-size:.98rem;}
.mailbox h2{white-space:nowrap;}                       /* „Ihr direkter Draht zu uns" auf eine Zeile */
.mailbox h2{margin-bottom:.12em;}                       /* Intro direkt darunter, kaum Abstand */
.mailbox-intro{font-size:1rem; max-width:none; margin:0 auto; white-space:nowrap; text-align:center;}  /* „Wählen Sie Ihr Anliegen" – eine Zeile, zentriert, genau unter der Headline */
.intro.tgtg .intro-copy p:not(.kicker){font-size:1.22rem;}
.mailbox-tabs{gap:1em;}
.mailbox-tab{font-size:1.18rem; padding:.95em 1.75em;}
.intro.tgtg .btn{font-size:1.15rem; padding:1em 1.9em;}
/* TooGoodToGo-Logo an die größere Schrift angepasst (breitere Bild-Spalte) */
.intro.tgtg .intro-grid{grid-template-columns:1fr 1.08fr;}
/* Vereinskarte nativ – Lead/Schritte auf gleiche Stufe wie die Nachbarn */
.cardpromo-lead{font-size:1.22rem; max-width:52ch;}
.cardpromo-step h3{font-size:1.25rem;}
.cardpromo-step p{font-size:1.02rem;}
.cardpromo-step svg{width:46px; height:46px;}
.vk-card{width:380px;}
@media (max-width:680px){
  .mailbox h2{white-space:normal;}
}

/* Partyservice – Motiv-Positionen vom User via Motiv-Editor gesetzt (abschnitts-spezifisch, überschreibt die gemeinsamen pm-* Positionen inkl. Rotation/Skalierung) */
.bestellliste .party-motif.pm-center.pm--flutes{top:7.6%; left:44.4%; transform:rotate(-3deg) scale(1.55); right:auto; bottom:auto;}
.bestellliste .party-motif.pm-a.pm--stars{top:54.8%; left:44.6%; transform:rotate(40deg) scale(1.55); right:auto; bottom:auto;}
.bestellliste .party-motif.pm-b.pm--pop{top:16.8%; left:89.4%; transform:rotate(6deg) scale(2.60); right:auto; bottom:auto;}
.bestellliste .party-motif.pm-c.pm--firework{top:76.2%; left:8.2%; transform:rotate(-15deg) scale(2.20); right:auto; bottom:auto;}
.bestellliste .party-motif.pm-d.pm--mugs{top:13.5%; left:5.9%; transform:rotate(-6deg) scale(2.30); right:auto; bottom:auto;}
.bestellliste .party-motif.pm-e.pm--sparkle{top:35.4%; left:13.6%; transform:rotate(-48deg) scale(1.30); right:auto; bottom:auto;}
.bestellliste .party-motif.pm-f.pm--flag{top:72.3%; left:87.5%; transform:rotate(-19deg) scale(2.45); right:auto; bottom:auto;}
.pv-service .party-motif.pm-center.pm--flutes{top:23.3%; left:70.8%; transform:rotate(18deg) scale(2.00); right:auto; bottom:auto;}
.pv-service .party-motif.pm-a.pm--mugs{top:19.0%; left:21.1%; transform:rotate(-8deg) scale(2.50); right:auto; bottom:auto;}
.pv-service .party-motif.pm-b.pm--firework{top:14.9%; left:90.0%; transform:rotate(6deg) scale(1.30); right:auto; bottom:auto;}
.pv-service .party-motif.pm-c.pm--stars{top:73.2%; left:11.7%; transform:rotate(6deg) scale(1.4); right:auto; bottom:auto;}
.pv-service .party-motif.pm-d.pm--pop{top:62.6%; left:87.8%; transform:rotate(-54deg) scale(2.35); right:auto; bottom:auto;}
.pv-service .party-motif.pm-e.pm--swirl{top:31.8%; left:3.8%; transform:rotate(9deg) scale(1.4); right:auto; bottom:auto;}
.pv-service .party-motif.pm-f.pm--sparkle{top:79.8%; left:47.5%; transform:rotate(-10deg) scale(1.4); right:auto; bottom:auto;}
.anfrage-section .party-motif.pm-a.pm--stars{top:8.3%; left:7.0%; transform:rotate(-8deg) scale(1.75); right:auto; bottom:auto;}
.anfrage-section .party-motif.pm-b.pm--bubble{top:4.5%; left:28.7%; transform:rotate(6deg) scale(2.55); right:auto; bottom:auto;}
.anfrage-section .party-motif.pm-c.pm--cocktail{top:90.0%; left:6.8%; transform:rotate(6deg) scale(1.65); right:auto; bottom:auto;}
.anfrage-section .party-motif.pm-d.pm--wine{top:82.2%; left:75.4%; transform:rotate(-6deg) scale(2.60); right:auto; bottom:auto;}
.anfrage-section .party-motif.pm-e.pm--sparkle{top:51.6%; left:18.4%; transform:rotate(9deg) scale(1.4); right:auto; bottom:auto;}
.anfrage-section .party-motif.pm-f.pm--pop{top:38.0%; left:82.3%; transform:rotate(-43deg) scale(2.75); right:auto; bottom:auto;}
.anfrage-section .party-motif.pm-g.pm--flutes{top:9.2%; left:81.5%; transform:rotate(21deg) scale(2.80); right:auto; bottom:auto;}
.anfrage-section .party-motif.pm-h.pm--firework{top:68.5%; left:87.3%; transform:rotate(-7deg) scale(1.95); right:auto; bottom:auto;}
.anfrage-section .party-motif.pm-i.pm--mugs{top:71.0%; left:13.4%; transform:rotate(9deg) scale(3.05); right:auto; bottom:auto;}
.anfrage-section .party-motif.pm-j.pm--flag{top:34.0%; left:8.3%; transform:rotate(30deg) scale(2.50); right:auto; bottom:auto;}

/* Startseite – Motiv-Positionen vom User via Motiv-Editor gesetzt (TooGoodToGo + Vereinskarte) */
.intro.bg-cream-2.tgtg .tgtg-motif.tg-3{top:78.7%; left:61.4%; transform:rotate(-10deg) scale(1.4); right:auto; bottom:auto;}
.intro.bg-cream-2.tgtg .tgtg-motif.tg-6{top:8.6%; left:19.6%; transform:rotate(-12deg) scale(1.4); right:auto; bottom:auto;}
.cardpromo .vk-motif.vk-trophy{top:10.0%; left:21.7%; transform:rotate(-9deg) scale(1.80); right:auto; bottom:auto;}
.cardpromo .vk-motif.vk-hearts{top:32.5%; left:11.8%; transform:rotate(-3deg) scale(1.4); right:auto; bottom:auto;}
.cardpromo .vk-motif.vk-handheart{top:44.7%; left:84.5%; transform:rotate(4deg) scale(1.4); right:auto; bottom:auto;}

/* O+G-Abteilung – Motiv-Positionen vom User via Motiv-Editor gesetzt */
.intro.og-decorated .og-motif.og-kiwi{top:14.8%; left:11.4%; transform:rotate(-9deg) scale(2.10); right:auto; bottom:auto;}
.intro.og-decorated .og-motif.og-lemon{top:13.9%; left:79.7%; transform:rotate(35deg) scale(1.4); right:auto; bottom:auto;}
.intro.og-decorated .og-motif.og-apple{top:61.1%; left:10.1%; transform:rotate(-38deg) scale(1.75); right:auto; bottom:auto;}
.intro.og-decorated .og-motif.og-carrot{top:71.4%; left:46.8%; transform:rotate(38deg) scale(0.80); right:auto; bottom:auto;}
.intro.og-decorated .og-motif.og-straw{top:2.7%; left:41.1%; transform:rotate(-20deg) scale(0.95); right:auto; bottom:auto;}
.intro.og-decorated .og-motif.og-banana{top:55.1%; left:84.9%; transform:rotate(-26deg) scale(1.70); right:auto; bottom:auto;}

/* Über-uns Timeline – Motiv-Positionen vom User via Motiv-Editor gesetzt (inkl. entfernter Motive) */
.timeline .ue-motif.ue-tree{top:52.6%; left:14.8%; transform:rotate(1deg) scale(2.70); right:auto; bottom:auto;}
.timeline .ue-motif.ue-scroll{top:1.6%; left:32.8%; transform:rotate(0deg) scale(0.90); right:auto; bottom:auto;}
.timeline .ue-motif.ue-note{display:none;}
.timeline .ue-motif.ue-book{display:none;}
.timeline .ue-motif.ue-b2{display:none;}
.timeline .ue-motif.ue-t2{top:53.3%; left:77.6%; transform:rotate(-2deg) scale(2.60); right:auto; bottom:auto;}
.timeline .ue-motif.ue-n2{display:none;}
.timeline .ue-motif.ue-s2{top:2.7%; left:61.3%; transform:rotate(0deg) scale(0.90); right:auto; bottom:auto;}

/* „Hier entsteht eine neue Seite" – Platzhalter (z. B. team.html) */
.coming-soon{padding:4.5em 0 6em; background:var(--cream-2); text-align:center;}
.coming-soon-inner{max-width:560px; margin:0 auto;}
.coming-soon svg{width:92px; height:92px; color:var(--green-700); margin-bottom:1.1em;}
.coming-soon h2{margin:0 0 .4em;}
.coming-soon p{color:var(--ink-soft); margin:0 0 1.9em; font-size:1.05rem;}

/* ============ Mobile-Überarbeitung (≤600px, Session 2026-08-01 Go-Live) ============ */
@media (max-width:600px){
  /* Basis-Schrift auf dem Handy zurück auf 16px (statt 18/19px) – skaliert alles proportional runter */
  html, html.home{font-size:100%;}

  /* Überschriften kompakter + lange Wörter umbrechen (Silbentrennung) */
  h1, h2, h3, .heading-heart{overflow-wrap:break-word; -webkit-hyphens:auto; hyphens:auto;}
  h1{font-size:clamp(1.9rem,8.5vw,2.5rem);}
  .hero h1{font-size:clamp(2rem,8.5vw,2.6rem); margin-bottom:.5em;}
  .page-intro h1{font-size:clamp(1.9rem,8vw,2.4rem);}
  h2{font-size:clamp(1.5rem,6.2vw,2rem);}
  .mailbox h2, .intro.tgtg h2, .cardpromo .heading-heart{font-size:clamp(1.65rem,7vw,2.2rem);}
  .payback h2, .edekaapp h2{font-size:clamp(1.6rem,6.5vw,2.1rem); white-space:normal; margin-left:0;}
  .hero-text{font-size:1rem;}

  /* Kundenbriefkasten-Buttons: gleich breit, gestapelt */
  .mailbox-tabs{flex-direction:column; align-items:stretch;}
  .mailbox-tab{width:100%; text-align:center;}
  /* Intro auf dem Handy wieder umbrechen (nowrap würde überlaufen) */
  .mailbox-intro{white-space:normal; font-size:.9rem; max-width:38ch;}
  /* Hero-/TGTG-Button-Paare auf dem Handy voll breit stapeln */
  .hero-actions{display:flex; flex-direction:column; align-items:stretch;}
  /* Bewertungs-Buttons (Kontakt) einspaltig, gleich breit */
  .reviews-grid{grid-template-columns:1fr;}
  /* Galerie auf dem Handy 2 statt 3 Spalten (Basisregel überschrieb sonst die Mobil-Regel) */
  .gallery-grid{column-count:2;}

  /* Payback & EDEKA-App einspaltig (waren auf dem Handy noch 2-spaltig gequetscht) */
  .payback-grid, .edekaapp-grid{grid-template-columns:1fr; gap:2.2em; max-width:none;}
  .edekaapp-visual{order:2;}
  .payback-visual{order:2;}

  /* Quicklinks etwas ruhiger */
  .quicklink-card{padding:1.9em 1em;}
  .quicklink-card svg{width:58px; height:58px;}
  .quicklink-card h3{font-size:1.2rem;}

  /* Filialen einspaltig */
  .branches-grid{grid-template-columns:1fr; gap:2.2em;}

  /* Deko-Motive auf dem Handy ausblenden (überlappen sonst den Inhalt) */
  .mailbox-deco, .tgtg-deco, .og-deco, .ue-deco, .vk-deco, .party-deco{display:none;}

  /* „Unsere regionalen Partner"-Kicker wieder kompakt */
  .partner-strip .kicker{font-size:.9rem;}
}