/* ==========================================================================
   Gutke & Liebich Dienstleistungen — Stylesheet
   Garten- und Landschaftspflege · Spangenberg und Umgebung
   ========================================================================== */

:root{
  --green:#5aa823;
  --green-d:#467f1a;
  --green-l:#eef4e4;
  --green-tint:#f3f7ec;
  --ink:#222820;
  --ink-soft:#3c4536;
  --muted:#6c7464;
  --paper:#f6f7f2;
  --line:#e4e8db;
  --white:#ffffff;
  --shadow-sm:0 1px 2px rgba(34,40,32,.06), 0 4px 14px rgba(34,40,32,.05);
  --shadow-md:0 6px 24px rgba(34,40,32,.10);
  --shadow-lg:0 20px 50px rgba(34,40,32,.16);
  --radius:18px;
  --radius-sm:12px;
  --maxw:1180px;
  --ff-head:"Segoe UI", system-ui, -apple-system, "Helvetica Neue", Roboto, Arial, sans-serif;
  --ff-body:"Segoe UI", system-ui, -apple-system, "Helvetica Neue", Roboto, Arial, sans-serif;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  margin:0;
  font-family:var(--ff-body);
  color:var(--ink);
  background:var(--white);
  line-height:1.6;
  font-size:17px;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
h1,h2,h3,h4{font-family:var(--ff-head);font-weight:700;line-height:1.12;color:var(--ink);margin:0 0 .5em;letter-spacing:-.01em;}
h1{font-size:clamp(2.1rem,5vw,3.6rem);}
h2{font-size:clamp(1.7rem,3.4vw,2.6rem);}
h3{font-size:1.28rem;}
p{margin:0 0 1rem;text-wrap:pretty;}
ul{margin:0 0 1rem;padding-left:1.2rem;}

.container{max-width:var(--maxw);margin-inline:auto;padding-inline:24px;}
.section{padding:clamp(56px,8vw,104px) 0;}
.section--tint{background:var(--paper);}
.section--green{background:var(--green-tint);}

/* ---------- Eyebrow / headings ---------- */
.eyebrow{
  display:inline-flex;align-items:center;gap:.5rem;
  font-family:var(--ff-head);font-weight:600;font-size:.82rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--green-d);
  margin-bottom:1rem;
}
.eyebrow::before{content:"";width:26px;height:2px;background:var(--green);border-radius:2px;}
.section-head{max-width:680px;margin-bottom:48px;}
.section-head.center{margin-inline:auto;text-align:center;}
.section-head.center .eyebrow{justify-content:center;}
.lead{font-size:1.16rem;color:var(--ink-soft);}
.muted{color:var(--muted);}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:.55rem;
  font-family:var(--ff-head);font-weight:600;font-size:1rem;
  padding:.85rem 1.6rem;border-radius:999px;cursor:pointer;border:2px solid transparent;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
  line-height:1;white-space:nowrap;
}
.btn svg{width:18px;height:18px;}
.btn--primary{background:var(--green-d);color:#fff;box-shadow:0 8px 20px rgba(70,127,26,.28);}
.btn--primary:hover{background:#3a6a15;transform:translateY(-2px);box-shadow:0 12px 26px rgba(70,127,26,.34);}
.btn--ghost{background:transparent;border-color:rgba(255,255,255,.55);color:#fff;}
.btn--ghost:hover{background:rgba(255,255,255,.12);border-color:#fff;}
.btn--outline{background:#fff;border-color:var(--line);color:var(--ink);}
.btn--outline:hover{border-color:var(--green);color:var(--green-d);transform:translateY(-2px);}
.btn--lg{padding:1.05rem 2rem;font-size:1.08rem;}

/* ==========================================================================
   Topbar + Header
   ========================================================================== */
/* Die Kontaktleiste steht im Markup VOR <header> und damit ausserhalb des
   sticky Headers. Sie scrollt dadurch von allein nach oben weg, waehrend der
   Header oben kleben bleibt – ohne JavaScript und ohne Animation.
   (Vorher lag sie im Header und wurde per Klasse eingeklappt. Das aenderte
   die Hoehe des sticky Elements, verschob den Seiteninhalt und liess die
   Scrollposition um die Umschaltschwelle herum springen.) */
.topbar{background:var(--ink);color:#cdd3c4;font-size:.86rem;}
.topbar .container{display:flex;justify-content:space-between;align-items:center;gap:18px;min-height:42px;flex-wrap:nowrap;}
.topbar a{display:inline-flex;align-items:center;gap:.4rem;color:#dfe4d6;transition:color .15s;}
.topbar a:hover{color:#fff;}
.topbar svg{width:15px;height:15px;color:var(--green);}
.topbar .topbar__contacts{display:flex;gap:22px;align-items:center;flex-wrap:wrap;}
.topbar .topbar__note{color:#9aa38c;display:flex;align-items:center;gap:.4rem;white-space:nowrap;}
@media (max-width:1080px){.topbar__contacts a:last-child{display:none;}}
@media (max-width:880px){.topbar .topbar__note{display:none;}}

.site-header{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);transition:box-shadow .25s;}
.site-header.scrolled{box-shadow:var(--shadow-sm);}
.site-header .container{display:flex;align-items:center;justify-content:space-between;min-height:74px;gap:24px;}
.brand{display:flex;align-items:center;}
.brand img{height:66px;width:auto;}
.nav{display:flex;align-items:center;gap:4px;}
.nav a{
  font-family:var(--ff-head);font-weight:500;font-size:.97rem;color:var(--ink-soft);
  padding:.55rem .85rem;border-radius:10px;position:relative;transition:color .15s,background .15s;
}
.nav a:hover{color:var(--green-d);background:var(--green-l);}
.nav a.active{color:var(--green-d);}
.nav a.active::after{content:"";position:absolute;left:.85rem;right:.85rem;bottom:.28rem;height:2px;background:var(--green);border-radius:2px;}
.header-cta{display:flex;align-items:center;gap:14px;}

/* dropdown */
.has-drop{position:relative;}
.drop{
  position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%) translateY(8px);
  background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow-md);
  padding:10px;min-width:280px;opacity:0;visibility:hidden;transition:.18s;
}
.has-drop:hover .drop, .has-drop:focus-within .drop{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);}
.drop a{display:flex;align-items:center;gap:.7rem;padding:.6rem .7rem;border-radius:10px;font-size:.95rem;font-weight:500;}
.drop a:hover{background:var(--green-l);}
.drop a span.dot{width:8px;height:8px;border-radius:50%;background:var(--green);flex:none;}

/* burger */
.burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px;}
.burger span{width:26px;height:2.5px;background:var(--ink);border-radius:2px;transition:.25s;}
.mobile-nav{display:none;}

/* ==========================================================================
   Hero
   ========================================================================== */
.hero{position:relative;color:#fff;overflow:hidden;}
.hero__bg{position:absolute;inset:0;z-index:0;}
.hero__bg img{width:100%;height:100%;object-fit:cover;object-position:center 38%;}
.hero__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,rgba(20,28,16,.86) 0%,rgba(20,28,16,.62) 42%,rgba(20,28,16,.28) 100%);}
.hero__inner{position:relative;z-index:1;padding-block:clamp(64px,11vw,148px);}
.hero__content{max-width:660px;}
.hero h1{color:#fff;}
.hero .eyebrow{color:#bfe39a;}
.hero .eyebrow::before{background:#bfe39a;}
.hero p{font-size:1.2rem;color:rgba(255,255,255,.9);max-width:560px;}
.hero__actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px;}
.hero__badges{display:flex;gap:26px;flex-wrap:wrap;margin-top:40px;padding-top:28px;border-top:1px solid rgba(255,255,255,.18);}
.hero__badge{display:flex;align-items:center;gap:.6rem;font-size:.95rem;color:rgba(255,255,255,.92);}
.hero__badge svg{width:22px;height:22px;color:#9fd96a;flex:none;}

/* compact page hero */
.page-hero{position:relative;color:#fff;overflow:hidden;background:linear-gradient(100deg,var(--ink),var(--green-d));}
.page-hero__bg{position:absolute;inset:0;}
.page-hero__bg img{width:100%;height:100%;object-fit:cover;object-position:center 40%;}
.page-hero__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(20,28,16,.85),rgba(20,28,16,.5));}
.page-hero__inner{position:relative;z-index:1;padding-block:clamp(54px,8vw,96px);}
.page-hero h1{color:#fff;max-width:760px;}
.page-hero p{color:rgba(255,255,255,.9);max-width:600px;font-size:1.12rem;margin-bottom:0;}
.crumbs{display:flex;gap:.5rem;align-items:center;font-size:.9rem;color:rgba(255,255,255,.78);margin-bottom:1.1rem;flex-wrap:wrap;}
.crumbs a:hover{color:#fff;text-decoration:underline;}
.crumbs span{color:rgba(255,255,255,.5);}

/* ==========================================================================
   Service cards
   ========================================================================== */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.cards--2{grid-template-columns:repeat(2,1fr);}
.card{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  display:flex;flex-direction:column;box-shadow:var(--shadow-sm);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg);border-color:#d6dccb;}
.card__media{position:relative;aspect-ratio:25/18;overflow:hidden;}
.card__media img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
.card:hover .card__media img{transform:scale(1.06);}
/* Platzhalter fuer Leistungen ohne Foto */
.card__media--ph{display:grid;place-items:center;background:linear-gradient(135deg,var(--green-l),var(--green-tint));border-bottom:1px solid var(--line);}
.card__media--ph svg{width:74px;height:74px;color:var(--green);opacity:.5;transition:transform .5s ease;}
.card:hover .card__media--ph svg{transform:scale(1.06);}
.card__tag{position:absolute;top:14px;left:14px;background:rgba(255,255,255,.94);color:var(--green-d);font-family:var(--ff-head);font-weight:600;font-size:.74rem;letter-spacing:.04em;text-transform:uppercase;padding:.32rem .7rem;border-radius:999px;}
.card__body{padding:24px 24px 26px;display:flex;flex-direction:column;flex:1;}
.card__body h3{margin-bottom:.45rem;}
.card__body p{color:var(--muted);font-size:.98rem;margin-bottom:1.1rem;}
.card__link{margin-top:auto;display:inline-flex;align-items:center;gap:.45rem;font-family:var(--ff-head);font-weight:600;font-size:.95rem;color:var(--green-d);}
.card__link svg{width:16px;height:16px;transition:transform .2s;}
.card:hover .card__link svg{transform:translateX(4px);}

/* category block */
.cat{margin-bottom:64px;}
.cat:last-child{margin-bottom:0;}
.cat__head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:28px;flex-wrap:wrap;}
.cat__head .num{font-family:var(--ff-head);font-weight:700;color:var(--green);font-size:.95rem;letter-spacing:.1em;}
.cat__head h2{margin:0;}
.cat__head p{margin:.4rem 0 0;color:var(--muted);max-width:520px;}

/* ==========================================================================
   Feature / Why-us
   ========================================================================== */
.features{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.feature{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:30px 26px;box-shadow:var(--shadow-sm);}
.feature__icon{width:54px;height:54px;border-radius:14px;background:var(--green-l);color:var(--green-d);display:grid;place-items:center;margin-bottom:18px;}
.feature__icon svg{width:27px;height:27px;}
.feature h3{font-size:1.16rem;margin-bottom:.4rem;}
.feature p{color:var(--muted);font-size:.97rem;margin:0;}

/* ==========================================================================
   Split (image + text)
   ========================================================================== */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);align-items:center;}
.split--rev .split__media{order:2;}
.split__media{position:relative;}
/* height:auto ist noetig, sonst gewinnt das height-Attribut des <img> gegen aspect-ratio */
.split__media img{width:100%;height:auto;border-radius:var(--radius);box-shadow:var(--shadow-md);aspect-ratio:4/3;object-fit:cover;}
/* Hochformat-Aufnahmen: flacher zuschneiden, dafuer volle Bildbreite -> Personen komplett sichtbar */
.split__media--portrait img{aspect-ratio:3/4;object-position:center 55%;}
.split__media .badge-float{
  position:absolute;left:-18px;bottom:-18px;background:#fff;border-radius:16px;box-shadow:var(--shadow-md);
  padding:18px 22px;display:flex;align-items:center;gap:14px;border:1px solid var(--line);
}
.split__media .badge-float .big{font-family:var(--ff-head);font-weight:700;font-size:1.7rem;color:var(--green-d);line-height:1;}
.split__media .badge-float small{color:var(--muted);font-size:.85rem;}

/* checklist */
.checklist{list-style:none;padding:0;margin:1.4rem 0;display:grid;gap:.7rem;}
.checklist li{display:flex;align-items:flex-start;gap:.7rem;color:var(--ink-soft);}
.checklist svg{width:22px;height:22px;color:var(--green);flex:none;margin-top:2px;}

/* stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center;}
.stat .num{font-family:var(--ff-head);font-weight:700;font-size:clamp(2rem,4vw,2.8rem);color:var(--green-d);line-height:1;}
.stat .lbl{color:var(--muted);font-size:.95rem;margin-top:.4rem;}

/* ==========================================================================
   Region
   ========================================================================== */
.region{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(32px,5vw,64px);align-items:center;}
.region__places{display:flex;flex-wrap:wrap;gap:10px;margin-top:1.2rem;}
.region__places span{background:#fff;border:1px solid var(--line);border-radius:999px;padding:.45rem 1rem;font-size:.92rem;font-weight:500;color:var(--ink-soft);display:inline-flex;align-items:center;gap:.45rem;}
.region__places span::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--green);}
.region__card{background:var(--ink);color:#e7ecdf;border-radius:var(--radius);padding:34px;box-shadow:var(--shadow-md);}
.region__card h3{color:#fff;}
.region__card .pin{width:48px;height:48px;border-radius:12px;background:rgba(255,255,255,.1);display:grid;place-items:center;margin-bottom:16px;color:#9fd96a;}
.region__card .pin svg{width:24px;height:24px;}

/* ==========================================================================
   CTA band
   ========================================================================== */
.cta{position:relative;overflow:hidden;background:var(--ink);color:#fff;border-radius:24px;padding:clamp(40px,6vw,68px);text-align:center;}
.cta::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% 20%,rgba(90,168,35,.28),transparent 55%);}
.cta__inner{position:relative;z-index:1;max-width:640px;margin-inline:auto;}
.cta h2{color:#fff;}
.cta p{color:rgba(255,255,255,.82);font-size:1.12rem;}
.cta__actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:26px;}
/* Heller Umriss-Button nur INNERHALB des dunklen CTA-Bands. Ohne diese
   Einschraenkung wuerde er auch auf weissem Grund (Danke- und 404-Seite)
   weiss auf weiss gezeichnet und waere dort unsichtbar. */
.cta .cta__actions .btn--outline{background:transparent;border-color:rgba(255,255,255,.5);color:#fff;}
.cta .cta__actions .btn--outline:hover{background:rgba(255,255,255,.1);border-color:#fff;}

/* ==========================================================================
   Contact
   ========================================================================== */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,60px);align-items:start;}
.partner-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow-sm);margin-bottom:20px;}
.partner-card h3{margin-bottom:.2rem;}
/* Icon in der Ueberschrift (z. B. Einzugsgebiet) – ohne Groessenangabe wuerde
   das SVG in der Standardgroesse von 300x150 px gezeichnet. */
.partner-card h3 svg{width:20px;height:20px;color:var(--green-d);flex:none;}
.partner-card .role{color:var(--green-d);font-weight:600;font-size:.9rem;font-family:var(--ff-head);margin-bottom:1rem;display:block;}
.partner-card .rows{display:grid;gap:.6rem;}
.partner-card .rows a,.partner-card .rows div{display:flex;align-items:flex-start;gap:.7rem;color:var(--ink-soft);font-size:.97rem;}
.partner-card .rows svg{width:19px;height:19px;color:var(--green);flex:none;margin-top:3px;}
.partner-card .rows a:hover{color:var(--green-d);}

form .field{margin-bottom:18px;}
form label{display:block;font-family:var(--ff-head);font-weight:600;font-size:.92rem;margin-bottom:.4rem;color:var(--ink-soft);}
form .req{color:var(--green-d);}
form input,form select,form textarea{
  width:100%;padding:.85rem 1rem;border:1.5px solid var(--line);border-radius:12px;font-family:inherit;font-size:1rem;
  background:#fff;color:var(--ink);transition:border-color .15s, box-shadow .15s;
}
form input:focus,form select:focus,form textarea:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(90,168,35,.15);}
form textarea{min-height:140px;resize:vertical;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.form-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:clamp(24px,3vw,38px);box-shadow:var(--shadow-sm);}
.check-inline{display:flex;align-items:flex-start;gap:.6rem;font-size:.9rem;color:var(--muted);}
.check-inline input{width:auto;margin-top:.25rem;}
.form-note{font-size:.85rem;color:var(--muted);margin-top:1rem;}
.alert{padding:1rem 1.2rem;border-radius:12px;margin-bottom:24px;font-size:.97rem;}
.alert--ok{background:var(--green-l);color:var(--green-d);border:1px solid #cfe6b5;}
.alert--err{background:#fdecec;color:#b3261e;border:1px solid #f5c6c6;}

/* ==========================================================================
   Article / service detail prose
   ========================================================================== */
.prose{max-width:760px;}
.prose h2{margin-top:2.2rem;}
.prose h3{margin-top:1.6rem;}
.prose ul{display:grid;gap:.5rem;}
.prose li{padding-left:.2rem;}
.aside-card{background:var(--green-tint);border:1px solid #dde9cc;border-radius:var(--radius);padding:28px;}
.aside-card h3{font-size:1.1rem;}
.aside-card .rows{display:grid;gap:.7rem;margin:1rem 0 1.3rem;}
.aside-card .rows a{display:flex;gap:.6rem;align-items:center;color:var(--ink-soft);font-weight:500;}
.aside-card .rows svg{width:18px;height:18px;color:var(--green-d);}
.related-list{list-style:none;padding:0;margin:0;display:grid;gap:.4rem;}
.related-list a{display:flex;align-items:center;gap:.6rem;padding:.55rem .2rem;border-bottom:1px solid var(--line);font-weight:500;color:var(--ink-soft);}
.related-list a:last-child{border-bottom:0;}
.related-list a:hover{color:var(--green-d);}
.related-list svg{width:15px;height:15px;color:var(--green);}

/* service detail layout */
.svc-layout{display:grid;grid-template-columns:1.6fr .9fr;gap:clamp(36px,5vw,64px);align-items:start;}
/* Abstand nach oben = Hoehe des eingeklappten Headers (75 px) + Luft.
   Vorher stand hier 104 px, waehrend der Header mit Kontaktleiste 116 px hoch
   war – dadurch verschwand die Oberkante der Box beim Scrollen dahinter. */
.svc-layout .aside{position:sticky;top:92px;display:grid;gap:24px;}
.svc-bullets{list-style:none;padding:0;margin:1.2rem 0 0;display:grid;gap:.8rem;}
.svc-bullets li{display:flex;align-items:flex-start;gap:.7rem;color:var(--ink-soft);}
.svc-bullets svg{width:22px;height:22px;color:var(--green);flex:none;margin-top:2px;}
.svc-intro-img{width:100%;height:auto;border-radius:var(--radius);box-shadow:var(--shadow-sm);margin:1.8rem 0 .4rem;aspect-ratio:16/9;object-fit:cover;}
@media (max-width:880px){.svc-layout{grid-template-columns:1fr;}.svc-layout .aside{position:static;}}

/* ==========================================================================
   Footer
   ========================================================================== */
.site-footer{background:var(--ink);color:#aeb6a2;font-size:.95rem;}
.site-footer .container{padding-block:64px 0;}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:40px;}
.site-footer img.flogo{height:76px;width:auto;margin-bottom:18px;}
.site-footer p{color:#9aa28d;margin-bottom:1rem;}
.site-footer h4{color:#fff;font-family:var(--ff-head);font-size:1rem;margin:0 0 1.1rem;}
.fnav{list-style:none;padding:0;margin:0;display:grid;gap:.6rem;}
.fnav a{color:#bcc4af;transition:color .15s;}
.fnav a:hover{color:#fff;}
.fcontact{display:grid;gap:.7rem;}
.fcontact a,.fcontact div{display:flex;gap:.6rem;align-items:flex-start;color:#bcc4af;}
.fcontact svg{width:17px;height:17px;color:var(--green);flex:none;margin-top:3px;}
.fcontact a:hover{color:#fff;}
.footer-bottom{margin-top:52px;border-top:1px solid rgba(255,255,255,.1);padding:24px 0;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:.86rem;color:#8b9382;}
.footer-bottom a{color:#9aa28d;}
.footer-bottom a:hover{color:#fff;}
.footer-bottom .legal{display:flex;gap:20px;flex-wrap:wrap;align-items:center;}
.footer-bottom a.credit{color:#8b9382;font-size:.82rem;}
.footer-bottom a.credit:hover{color:#fff;}
/* Als Button ausgezeichnet (loest eine Aktion aus), sieht aus wie die Nachbarlinks */
.footer-bottom .linklike{background:none;border:0;padding:0;font:inherit;color:#9aa28d;cursor:pointer;}
.footer-bottom .linklike:hover{color:#fff;}

/* ==========================================================================
   Consent-Banner
   ========================================================================== */
.consent{
  position:fixed;left:0;right:0;bottom:0;z-index:200;
  padding:16px;display:none;
}
.consent--offen{display:block;animation:consentAuf .25s ease;}
.consent__box{
  max-width:var(--maxw);margin-inline:auto;background:#fff;color:var(--ink);
  border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-lg);
  padding:22px 24px;display:flex;align-items:center;gap:28px;flex-wrap:wrap;
}
.consent__text{flex:1 1 380px;}
.consent__text h2{font-size:1.15rem;margin-bottom:.35rem;}
.consent__text p{color:var(--ink-soft);font-size:.95rem;margin:0;}
.consent__text a{color:var(--green-d);text-decoration:underline;}
.consent__actions{display:flex;gap:12px;flex:0 0 auto;}
/* Beide Optionen gleich gross, gleich auffaellig und gleich erreichbar –
   Ablehnen darf weder schwerer zu finden noch schwerer zu treffen sein als
   Zustimmen (Vorgabe der Datenschutzkonferenz zu Einwilligungsbannern). */
.consent__actions .btn{min-width:170px;justify-content:center;}
.consent__actions .btn--neutral{background:var(--ink);color:#fff;border-color:var(--ink);}
.consent__actions .btn--neutral:hover{background:#151a12;transform:translateY(-2px);}
@keyframes consentAuf{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:none;}}
@media (max-width:700px){
  .consent__box{padding:18px;gap:16px;}
  .consent__actions{width:100%;}
  .consent__actions .btn{flex:1;min-width:0;}
}
@media (prefers-reduced-motion:reduce){.consent--offen{animation:none;}}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width:980px){
  .cards,.features{grid-template-columns:repeat(2,1fr);}
  .stats{grid-template-columns:repeat(2,1fr);gap:32px;}
  .footer-grid{grid-template-columns:1fr 1fr;gap:32px;}
  .region{grid-template-columns:1fr;}
}
@media (max-width:760px){
  body{font-size:16px;}
  .nav,.header-cta .btn{display:none;}
  .burger{display:flex;}
  .split{grid-template-columns:1fr;}
  .split--rev .split__media{order:0;}
  .split__media img{aspect-ratio:16/11;}
  .split__media--portrait img{aspect-ratio:3/4;}
  .contact-grid,.cards--2{grid-template-columns:1fr;}
  .form-row{grid-template-columns:1fr;}
  .topbar{display:none;}
  /* backdrop-filter macht den Header sonst zum Bezugsrahmen des fixed-Menüs → Menü 0px hoch */
  .site-header{-webkit-backdrop-filter:none;backdrop-filter:none;background:#fff;}
  .mobile-nav.open{display:block;position:fixed;inset:74px 0 0;background:#fff;z-index:55;padding:24px;overflow:auto;animation:fade .2s ease;}
  .mobile-nav .m-link{display:block;font-family:var(--ff-head);font-weight:600;font-size:1.15rem;padding:1rem .4rem;border-bottom:1px solid var(--line);color:var(--ink);}
  .mobile-nav .m-sub{padding:.5rem 0 .6rem 1rem;display:grid;gap:.1rem;}
  .mobile-nav .m-sub a{padding:.5rem .4rem;color:var(--ink-soft);font-weight:500;}
  .mobile-nav .m-cta{margin-top:22px;display:grid;gap:12px;}
  .mobile-nav .m-cta .btn{display:flex;justify-content:center;}
  body.nav-open{overflow:hidden;}
}
@media (max-width:520px){
  .cards,.features{grid-template-columns:1fr;}
  .stats{grid-template-columns:1fr 1fr;}
  .footer-grid{grid-template-columns:1fr;}
  .container{padding-inline:20px;}
}
@keyframes fade{from{opacity:0;transform:translateY(-6px);}to{opacity:1;transform:none;}}

/* burger active state */
.burger.active span:nth-child(1){transform:translateY(7.5px) rotate(45deg);}
.burger.active span:nth-child(2){opacity:0;}
.burger.active span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg);}

/* accessibility */
:focus-visible{outline:3px solid rgba(90,168,35,.5);outline-offset:2px;border-radius:4px;}
.skip{position:absolute;left:-9999px;top:0;background:var(--green);color:#fff;padding:.6rem 1rem;border-radius:0 0 8px 0;z-index:100;}
.skip:focus{left:0;}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important;}}

/* ==========================================================================
   Scroll-Reveal & dezente Hover-Effekte
   ========================================================================== */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s cubic-bezier(.22,.7,.25,1), transform .7s cubic-bezier(.22,.7,.25,1);will-change:opacity,transform;}
.reveal.is-visible{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1!important;transform:none!important;}}

/* Feature-Karten: sanftes Anheben + Icon-Pop */
.feature{transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;}
.feature:hover{transform:translateY(-5px);box-shadow:var(--shadow-md);border-color:#d6dccb;}
.feature__icon{transition:transform .3s cubic-bezier(.34,1.56,.64,1), background .25s ease;}
.feature:hover .feature__icon{transform:scale(1.08) rotate(-4deg);background:var(--green);color:#fff;}

/* Partner-Karten */
.partner-card{transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;}
.partner-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:#d6dccb;}

/* Orts-Chips */
.region__places span{transition:transform .18s ease, border-color .18s ease, color .18s ease, background .18s ease;cursor:default;}
.region__places span:hover{transform:translateY(-2px);border-color:var(--green);color:var(--green-d);background:#fff;}

/* Aside-Box */
.aside-card{transition:box-shadow .22s ease;}
.related-list a svg{transition:transform .18s ease;}
.related-list a:hover svg{transform:translateX(4px);}

/* Hero-Bild: ganz langsamer Zoom beim Laden */
.hero__bg img{transform:scale(1.06);animation:heroZoom 14s ease-out forwards;}
@keyframes heroZoom{to{transform:scale(1);}}
@media (prefers-reduced-motion:reduce){.hero__bg img{animation:none;transform:none;}}

/* Buttons: Icon schiebt leicht mit */
.btn svg{transition:transform .2s ease;}
.btn--primary:hover svg, .btn--outline:hover svg, .btn--ghost:hover svg{transform:translateX(2px);}
.card__link:hover svg{transform:translateX(4px);}