/* Theme- & Komponenten-Styles (Hell-Modus, Menue, Footer) – gemeinsam genutzt von allen Seiten (InFaBe). Aenderungen hier wirken auf die ganze Website. */

/* =====================================================================
   INFABE – AWARD LIGHT MODE  ("Atelier Porcelain")
   Rein additiv: überschreibt nur den hellen Modus (html:not(.dark)).
   Footer: Struktur-Politur für beide Modi, Farbwelt für hell.
   ===================================================================== */
html:not(.dark) {
  --lm-ink: #10150f;
  --lm-ink-2: #2b332a;
  --lm-ink-3: #4a5448;
  --lm-green: #2f6a0a;
  --lm-green-2: #3d7a10;
  --lm-lime: #9eeb47;
  --lm-porcelain: #f7f8f3;
  --lm-mist: #eaefe6;
  --lm-sage: #dde6d8;
  --lm-hair: rgba(40,70,25,.14);
  --lm-hair-2: rgba(40,70,25,.22);
  --lm-card: linear-gradient(160deg, #ffffff 0%, #f6f8f2 100%);
  --lm-shadow-sm: 0 1px 0 rgba(255,255,255,.95) inset, 0 1px 2px rgba(22,36,18,.06), 0 8px 22px -12px rgba(22,36,18,.22);
  --lm-shadow-md: 0 1px 0 rgba(255,255,255,.95) inset, 0 2px 4px rgba(22,36,18,.05), 0 22px 44px -22px rgba(22,36,18,.34);
  --lm-shadow-lg: 0 1px 0 rgba(255,255,255,.95) inset, 0 4px 10px rgba(22,36,18,.06), 0 40px 80px -30px rgba(22,36,18,.40);
  --lm-glow: 0 0 0 1px rgba(158,235,71,.55), 0 26px 56px -22px rgba(76,140,20,.50);
  color-scheme: light;
}

/* ---------- Grundfläche: Porzellan + Salbei, Netz, weiche Aurora ---------- */
html:not(.dark) body {
  background:
    radial-gradient(1100px 700px at 100% 0%, rgba(158,235,71,.16), transparent 60%),
    radial-gradient(900px 640px at 0% 38%, rgba(120,190,70,.12), transparent 62%),
    radial-gradient(1000px 700px at 100% 82%, rgba(158,235,71,.12), transparent 60%),
    var(--lm-net),
    linear-gradient(180deg, #f3f6ef 0%, #e6ece1 50%, #eff3eb 100%) !important;
  background-attachment: fixed, fixed, fixed, scroll, scroll !important;
  color: var(--lm-ink);
}
html:not(.dark) ::selection { background: #9eeb47; color: #071000; }

/* ---------- Sektionen: abwechselnd Porzellan / Salbei, mit Lichtkante ---------- */
html:not(.dark) :is(#videos, #kategorien, #leistungen, #akustik-optionen, #vorteile, #konzept, #prozess, #referenzen, #lichtdecken, #easy-light, #qualitaet),
html:not(.dark) section.py-24.border-b.border-zinc-100 {
  box-shadow: 0 1px 0 rgba(255,255,255,.95) inset, 0 -1px 0 rgba(40,70,25,.08) inset;
  border-color: var(--lm-hair) !important;
}
html:not(.dark) section#videos.vd-section {
  background: var(--lm-net),
    radial-gradient(900px 520px at 85% 0%, rgba(158,235,71,.22), transparent 62%),
    radial-gradient(700px 420px at 5% 100%, rgba(80,150,30,.12), transparent 65%),
    linear-gradient(180deg, #e9efe5 0%, #dfe8da 100%);
}
html:not(.dark) section#kategorien.ix-section {
  background: var(--lm-net),
    radial-gradient(900px 520px at 8% 6%, rgba(158,235,71,.18), transparent 60%),
    radial-gradient(700px 480px at 100% 100%, rgba(80,150,30,.10), transparent 62%),
    linear-gradient(180deg, #f8f9f4 0%, #ebf0e7 100%);
}
html:not(.dark) section#leistungen.ix-services-section {
  background: var(--lm-net),
    radial-gradient(900px 560px at 92% 8%, rgba(158,235,71,.20), transparent 60%),
    linear-gradient(180deg, #e7eee3 0%, #f5f7f1 100%);
}
html:not(.dark) section#akustik-optionen.ix-ak-section {
  background: var(--lm-net),
    radial-gradient(900px 520px at 12% 10%, rgba(158,235,71,.18), transparent 60%),
    linear-gradient(180deg, #f7f8f3 0%, #e3eadf 100%);
}
html:not(.dark) section.py-24.border-b.border-zinc-100 {
  background: var(--lm-net),
    radial-gradient(800px 380px at 50% 0%, rgba(158,235,71,.16), transparent 66%),
    linear-gradient(180deg, #f6f8f2 0%, #ecf1e8 100%);
}
html:not(.dark) section#vorteile .vorteile-header {
  background: var(--lm-net),
    radial-gradient(760px 320px at 50% 0%, rgba(158,235,71,.22), transparent 66%),
    linear-gradient(180deg, #f8f9f4 0%, #eff3ea 100%);
  border-bottom: 0;
  box-shadow: 0 3px 0 #7fd12b, 0 14px 28px -12px rgba(76,140,20,.45);
  position: relative; z-index: 2;
}
html:not(.dark) section#vorteile .vorteile-header h2 { color: var(--lm-ink); }
html:not(.dark) section#vorteile .vorteile-header h2::after {
  content: ""; display: block; width: 64px; height: 3px; margin: 18px auto 0; border-radius: 3px;
  background: linear-gradient(90deg, transparent, #7fd12b, transparent);
}
html:not(.dark) section#vorteile .vorteile-col.green-col {
  background: radial-gradient(520px 320px at 100% 0%, rgba(255,255,255,.20), transparent 60%), linear-gradient(145deg, #5ec233 0%, #2f7d10 100%);
}
html:not(.dark) section#vorteile .vorteile-col.black-col {
  background: radial-gradient(520px 320px at 0% 0%, rgba(158,235,71,.10), transparent 60%), linear-gradient(145deg, #181d17 0%, #0a0d09 100%);
}
html:not(.dark) section#konzept {
  background: var(--lm-net),
    radial-gradient(900px 520px at 92% 0%, rgba(158,235,71,.22), transparent 62%),
    radial-gradient(600px 400px at 0% 100%, rgba(80,150,30,.10), transparent 64%),
    linear-gradient(180deg, #f7f8f3 0%, #e4eadf 100%) !important;
}
html:not(.dark) section#prozess {
  background: var(--lm-net),
    radial-gradient(800px 440px at 6% 100%, rgba(158,235,71,.18), transparent 62%),
    linear-gradient(180deg, #e9efe5 0%, #f6f8f2 100%) !important;
}
html:not(.dark) section#referenzen {
  background: var(--lm-net),
    radial-gradient(1000px 560px at 50% 0%, rgba(158,235,71,.22), transparent 62%),
    radial-gradient(700px 420px at 100% 100%, rgba(80,150,30,.12), transparent 64%),
    linear-gradient(180deg, #dfe7da 0%, #eef2ea 100%) !important;
}
html:not(.dark) section#lichtdecken {
  background: var(--lm-net),
    radial-gradient(800px 480px at 100% 14%, rgba(158,235,71,.20), transparent 62%),
    linear-gradient(180deg, #f7f8f3 0%, #eaefe6 100%) !important;
}
html:not(.dark) section#easy-light {
  background: var(--lm-net),
    radial-gradient(900px 520px at 0% 0%, rgba(158,235,71,.22), transparent 62%),
    radial-gradient(640px 420px at 100% 100%, rgba(80,150,30,.12), transparent 64%),
    linear-gradient(180deg, #dde6d8 0%, #f1f5ed 100%) !important;
}
html:not(.dark) section#qualitaet {
  background: var(--lm-net),
    radial-gradient(800px 440px at 88% 100%, rgba(158,235,71,.20), transparent 62%),
    linear-gradient(180deg, #f2f6ee 0%, #e6ede2 100%) !important;
}

/* ---------- Typografie & Akzentfarbe mit echtem Kontrast ---------- */
html:not(.dark) :is(#videos, #kategorien, #leistungen, #akustik-optionen, #vorteile, #konzept, #prozess, #referenzen, #lichtdecken, #easy-light, #qualitaet, #faq) .text-accent {
  color: var(--lm-green-2);
}
html:not(.dark) :is(#konzept, #referenzen, #lichtdecken, #easy-light, #qualitaet, #faq) .gradient-text {
  background-image: linear-gradient(120deg, #2f6a0a 0%, #5fb21f 45%, #14935a 100%);
}
html:not(.dark) :is(#konzept, #referenzen, #lichtdecken, #easy-light, #qualitaet, #faq) h2,
html:not(.dark) :is(#konzept, #referenzen, #lichtdecken, #easy-light, #qualitaet, #faq) h4.hl-fluid {
  color: var(--lm-ink);
  letter-spacing: -.035em;
}
html:not(.dark) :is(#konzept, #lichtdecken, #qualitaet, #faq) h2 + p,
html:not(.dark) :is(#konzept, #lichtdecken, #qualitaet) .text-center > p {
  color: var(--lm-ink-3);
}
/* kleine Über-Titel bekommen eine feine Linie – wirkt editorial */
html:not(.dark) :is(#konzept, #lichtdecken, #qualitaet, #faq) .text-center > span.text-accent {
  display: inline-flex; align-items: center; gap: 14px; color: var(--lm-green-2);
}
html:not(.dark) :is(#konzept, #lichtdecken, #qualitaet, #faq) .text-center > span.text-accent::before,
html:not(.dark) :is(#konzept, #lichtdecken, #qualitaet, #faq) .text-center > span.text-accent::after {
  content: ""; width: 34px; height: 1px; background: linear-gradient(90deg, transparent, var(--lm-green-2));
}
html:not(.dark) :is(#konzept, #lichtdecken, #qualitaet, #faq) .text-center > span.text-accent::after { transform: scaleX(-1); }

/* ---------- Karten: Tiefe statt flacher Kästen ---------- */
html:not(.dark) :is(#konzept, #lichtdecken, #qualitaet, #easy-light, #referenzen) .bg-zinc-50[class*="rounded-"],
html:not(.dark) #konzept .bg-white[class*="rounded-"],
html:not(.dark) #referenzen .glass-panel {
  background: var(--lm-card) !important;
  border-color: var(--lm-hair) !important;
  box-shadow: var(--lm-shadow-md);
}
html:not(.dark) #konzept .max-w-4xl > .bg-white { box-shadow: var(--lm-shadow-lg); }
html:not(.dark) :is(#lichtdecken, #qualitaet) .bg-zinc-50[class*="rounded-"] {
  transition: transform .45s cubic-bezier(.16,1,.3,1), box-shadow .45s ease, border-color .3s ease;
}
html:not(.dark) :is(#lichtdecken, #qualitaet) .bg-zinc-50[class*="rounded-"]:hover {
  transform: translateY(-6px);
  border-color: rgba(100,175,35,.65) !important;
  box-shadow: var(--lm-glow);
}
html:not(.dark) .faq-item {
  background: var(--lm-card) !important;
  border-color: var(--lm-hair) !important;
  box-shadow: var(--lm-shadow-sm);
  transition: box-shadow .35s ease, border-color .3s ease, transform .35s ease;
}
html:not(.dark) .faq-item:hover { border-color: rgba(100,175,35,.65) !important; box-shadow: var(--lm-shadow-md); }
html:not(.dark) .faq-item .faq-question:hover { color: var(--lm-green) !important; }
html:not(.dark) .faq-item .faq-answer { color: var(--lm-ink-3) !important; }
html:not(.dark) .faq-num { background: rgba(120,190,50,.18); color: var(--lm-green); }
html:not(.dark) .faq-cat-btn { background: rgba(255,255,255,.72); border-color: var(--lm-hair); color: var(--lm-ink-2); box-shadow: 0 6px 16px -10px rgba(22,36,18,.35); }
html:not(.dark) .faq-cat-btn:hover { background: #fff; border-color: rgba(100,175,35,.6); color: var(--lm-green); }
html:not(.dark) .faq-cat-btn.active { background: linear-gradient(180deg, #b6f56c, #8fe02f); border-color: transparent; color: #0a1500; box-shadow: 0 10px 24px -8px rgba(100,175,35,.65); }
html:not(.dark) .faq-cat-icon { background: #f1f5ec; }

/* Intro-Features (Montage / Garantie / Farben) */
html:not(.dark) section.py-24.border-b .w-16.h-16 {
  background: linear-gradient(145deg, #ffffff, #e4efd8);
  color: var(--lm-green);
  border: 1px solid rgba(100,175,35,.35);
  box-shadow: var(--lm-shadow-sm), 0 12px 28px -14px rgba(100,175,35,.6);
}

/* Konzept-Tabs */
html:not(.dark) .konzept-tab-active {
  color: var(--lm-green); border-bottom-color: #7fd12b;
  background: linear-gradient(180deg, rgba(158,235,71,.05), rgba(158,235,71,.20));
}
html:not(.dark) .konzept-tab-inactive { color: #6b7568; }
html:not(.dark) .konzept-tab-inactive:hover { color: var(--lm-ink); background: rgba(40,70,25,.04); }

/* Prozess-Schritte */
html:not(.dark) #prozess .w-14.h-14 {
  background: var(--lm-card);
  border-color: var(--lm-hair-2);
  color: var(--lm-ink-2);
  box-shadow: var(--lm-shadow-sm);
}
html:not(.dark) #prozess .group:hover .w-14.h-14 { border-color: #7fd12b; color: var(--lm-green); box-shadow: var(--lm-glow); }
html:not(.dark) #prozess .grid > .group { position: relative; }
@media (min-width: 768px) {
  html:not(.dark) #prozess .grid > .group:not(:last-child)::after {
    content: ""; position: absolute; top: 28px; left: calc(50% + 40px); right: calc(-50% + 40px); height: 1px;
    background: repeating-linear-gradient(90deg, rgba(60,120,20,.45) 0 6px, transparent 6px 12px);
    pointer-events: none;
  }
}

/* Referenzen: Zähler, Karten, Marquee */
html:not(.dark) #referenzen .text-zinc-900 { color: var(--lm-ink) !important; }
html:not(.dark) .ref-card { background: var(--lm-card); border-color: var(--lm-hair); }
html:not(.dark) .ref-quote-plain { color: var(--lm-ink-3); }
html:not(.dark) .ref-marquee-chip {
  background: rgba(255,255,255,.78); border-color: var(--lm-hair); color: var(--lm-ink-2);
  box-shadow: 0 6px 16px -10px rgba(22,36,18,.35);
}
html:not(.dark) .ref-marquee-chip:hover { border-color: rgba(100,175,35,.7); color: var(--lm-green); background: #fff; }
html:not(.dark) .rk { box-shadow: var(--lm-shadow-lg); border-radius: 1.5rem; }

/* Videos */
html:not(.dark) .vd-card {
  background: var(--lm-card); border-color: var(--lm-hair);
  box-shadow: var(--lm-shadow-md);
  transition: transform .45s cubic-bezier(.16,1,.3,1), box-shadow .45s ease, border-color .3s ease;
}
html:not(.dark) .vd-card:hover { transform: translateY(-5px); border-color: rgba(100,175,35,.6); box-shadow: var(--lm-glow); }
html:not(.dark) .vd-label { color: var(--lm-green-2); }

/* Kategorien / Leistungen / Akustik – feinere Tiefe */
html:not(.dark) .ix-category { box-shadow: var(--lm-shadow-md); }
html:not(.dark) .ix-category:hover { box-shadow: var(--lm-glow); }
html:not(.dark) .ix-service {
  background: var(--lm-card);
  border-color: var(--lm-hair);
  box-shadow: var(--lm-shadow-sm);
}
html:not(.dark) .ix-service:hover { background: linear-gradient(160deg, #ffffff 0%, #e9f3dd 100%); box-shadow: var(--lm-glow); }
html:not(.dark) .ix-ak-card { background: var(--lm-card); box-shadow: var(--lm-shadow-md); }
html:not(.dark) .ix-quick-nav { backdrop-filter: blur(14px) saturate(1.3); -webkit-backdrop-filter: blur(14px) saturate(1.3); }

/* Formularfelder (Light) */
html:not(.dark) .if-input:focus { border-color: #7fd12b !important; box-shadow: 0 0 0 4px rgba(158,235,71,.28) !important; }

/* ---------- Primär-Buttons: Lime mit Glanzkante (nur Light) ---------- */
html:not(.dark) :is(#videos, #kategorien, #leistungen, #akustik-optionen, #vorteile, #konzept, #prozess, #referenzen, #lichtdecken, #easy-light, #qualitaet, #faq) :is(a, button).bg-accent {
  background-image: linear-gradient(180deg, #bdf779 0%, #93e332 100%);
  box-shadow: 0 1px 0 rgba(255,255,255,.7) inset, 0 12px 26px -10px rgba(100,175,35,.75);
}
html:not(.dark) :is(a, button).bg-accent:hover { background-image: none; }
html:not(.dark) .shadow-glow { box-shadow: 0 10px 30px -10px rgba(100,175,35,.55); }

/* =====================================================================
   FOOTER – High-End
   (A) Struktur-Politur in beiden Modi  (B) Farbwelt für den hellen Modus
   ===================================================================== */
.if-footer { isolation: isolate; }
.if-footer > .container { position: relative; z-index: 2; }
.if-footer::before {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(760px 420px at 12% 0%, rgba(158,235,71,.10), transparent 62%),
    radial-gradient(680px 420px at 96% 100%, rgba(158,235,71,.08), transparent 62%);
}
.if-footer::after {
  content: "InFaBe"; content: "InFaBe" / "";
  position: absolute; left: 50%; bottom: -.2em; transform: translateX(-50%); z-index: 1;
  font: 900 italic clamp(6rem, 23vw, 22rem)/1 'Inter', 'Manrope', sans-serif;
  letter-spacing: -.06em; white-space: nowrap; color: transparent;
  -webkit-text-stroke: 1px rgba(255,255,255,.06);
  pointer-events: none; user-select: none;
}
.if-footer-h5 { position: relative; padding-bottom: .9rem; }
.if-footer-h5::after {
  content: ""; position: absolute; left: 0; bottom: 0; width: 30px; height: 2px; border-radius: 2px;
  background: linear-gradient(90deg, #9eeb47, rgba(158,235,71,0));
}
.if-footer .if-flinks a { position: relative; }
.if-footer .legal-item { backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.if-footer .if-quickbtn { transition: transform .3s cubic-bezier(.16,1,.3,1), background .25s, border-color .25s, color .25s, box-shadow .3s; }
.if-footer .if-quickbtn:hover { transform: translateY(-2px); }

/* ----- Heller Modus: Elfenbein-Footer mit tiefer Schrift ----- */
html:not(.dark) .if-footer {
  background:
    var(--lm-net),
    radial-gradient(900px 520px at 0% 0%, rgba(158,235,71,.22), transparent 62%),
    radial-gradient(800px 520px at 100% 100%, rgba(80,150,30,.14), transparent 64%),
    linear-gradient(180deg, #eef3e9 0%, #dde6d8 100%) !important;
  color: var(--lm-ink-2);
  border-top: 1px solid rgba(100,175,35,.45) !important;
  box-shadow: 0 1px 0 rgba(255,255,255,.9) inset, 0 -24px 60px -30px rgba(22,36,18,.30);
}
html:not(.dark) .if-footer::before {
  background:
    radial-gradient(700px 360px at 50% 0%, rgba(255,255,255,.75), transparent 66%);
}
html:not(.dark) .if-footer::after { -webkit-text-stroke: 1px rgba(47,106,10,.16); }
html:not(.dark) .if-footer > .absolute.top-0 { height: 2px; background: linear-gradient(90deg, transparent, #7fd12b 30%, #9eeb47 50%, #7fd12b 70%, transparent); box-shadow: 0 0 24px rgba(158,235,71,.7); }

html:not(.dark) .if-footer .text-white { color: var(--lm-ink) !important; }
html:not(.dark) .if-footer .text-zinc-400 { color: #3f4a3d !important; }
html:not(.dark) .if-footer .text-zinc-500 { color: #4f5a4d !important; }
html:not(.dark) .if-footer .text-accent { color: var(--lm-green) !important; }
html:not(.dark) .if-footer-h3 { text-shadow: none; }
html:not(.dark) .if-footer-h5 { color: var(--lm-ink) !important; }
html:not(.dark) .if-footer-h5::after { background: linear-gradient(90deg, #5fb21f, rgba(95,178,31,0)); }
html:not(.dark) .if-footer a:hover { color: var(--lm-green) !important; }
html:not(.dark) .if-footer .if-flinks a { color: #3b463a !important; }
html:not(.dark) .if-footer .if-flinks a:hover { color: var(--lm-green) !important; }

/* Quick-Buttons */
html:not(.dark) .if-footer .if-quickbtn.bg-accent {
  background-image: linear-gradient(180deg, #bdf779 0%, #93e332 100%);
  color: #0a1500 !important;
  box-shadow: 0 1px 0 rgba(255,255,255,.7) inset, 0 14px 28px -12px rgba(100,175,35,.8);
}
html:not(.dark) .if-footer .if-quickbtn.bg-accent:hover { background-image: none; background-color: #fff; color: #0a1500 !important; }
html:not(.dark) .if-footer .if-quickbtn:not(.bg-accent) {
  background: rgba(255,255,255,.72) !important;
  border-color: var(--lm-hair-2) !important;
  color: var(--lm-ink) !important;
  box-shadow: var(--lm-shadow-sm);
}
html:not(.dark) .if-footer .if-quickbtn:not(.bg-accent):hover {
  background: #fff !important; border-color: rgba(100,175,35,.8) !important; color: var(--lm-green) !important;
}

/* Rechtliches als Dropdown ganz rechts im Desktop-Menü */
.ix-nav-links > .ix-legal-dropdown { flex: 0 0 auto; }
.ix-legal-dropdown { position: relative; display: inline-flex; align-items: center; }
.ix-legal-dropdown-trigger { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 7px; padding: 10px 12px; border-radius: 10px; color: inherit; font: inherit; font-weight: 650; white-space: nowrap; }
.ix-legal-dropdown-trigger::-webkit-details-marker { display: none; }
.ix-legal-dropdown-trigger:hover, .ix-legal-dropdown[open] > .ix-legal-dropdown-trigger { color: var(--accent-color); background: rgba(158,235,71,.08); }
.ix-legal-dropdown-menu { position: absolute; top: calc(100% + 10px); right: 0; z-index: 1000; min-width: 230px; padding: 8px; border: 1px solid rgba(158,235,71,.28); border-radius: 14px; background: #111713; box-shadow: 0 16px 40px rgba(0,0,0,.3); }
.ix-legal-dropdown-menu a { display: block; padding: 11px 12px; border-radius: 8px; color: #f4f7f2; text-decoration: none; white-space: nowrap; }
.ix-legal-dropdown-menu a:hover { background: rgba(158,235,71,.12); color: var(--accent-color); }
@media (max-width: 700px) { .ix-legal-dropdown { display: none !important; } }

/* Rechtliches im Menü: direkt zum Legal-Bereich im Footer springen */
#rechtliches { scroll-margin-top: 110px; }
.ix-legal-nav-link { color: var(--accent-color) !important; }
.ix-legal-nav-link:hover { color: #fff !important; }

/* Rechtliches (Akkordeons) */
html:not(.dark) .if-footer .legal-item {
  background: rgba(255,255,255,.66) !important;
  border-color: var(--lm-hair) !important;
  box-shadow: var(--lm-shadow-sm);
}
html:not(.dark) .if-footer .legal-item:hover { border-color: rgba(100,175,35,.65) !important; background: rgba(255,255,255,.9) !important; }
html:not(.dark) .if-footer .if-legal-btn { color: var(--lm-ink-2) !important; }
html:not(.dark) .if-footer .if-legal-btn:hover { color: var(--lm-green) !important; }
html:not(.dark) .if-footer .faq-answer { color: #3f4a3d !important; }
html:not(.dark) .if-footer .faq-answer a.text-accent { color: var(--lm-green) !important; }
html:not(.dark) .cc-footer-btn {
  background: rgba(255,255,255,.66); border-color: var(--lm-hair); color: var(--lm-ink-2);
  box-shadow: var(--lm-shadow-sm);
}
html:not(.dark) .cc-footer-btn:hover { color: var(--lm-green); border-color: rgba(100,175,35,.65); background: rgba(255,255,255,.92); }

/* CTA „Angebot anfordern“ */
html:not(.dark) .if-footer a.shadow-glow.bg-accent {
  background-image: linear-gradient(180deg, #bdf779 0%, #93e332 100%);
  color: #0a1500 !important;
  box-shadow: 0 1px 0 rgba(255,255,255,.7) inset, 0 18px 34px -14px rgba(100,175,35,.85);
}
html:not(.dark) .if-footer a.shadow-glow.bg-accent:hover { background-image: none; background-color: #fff; }

/* Fußzeile */
html:not(.dark) .if-footer-bottom {
  border-top-color: var(--lm-hair-2) !important;
  color: #4f5a4d;
}

/* Mobile Schnellnavigation im hellen Modus */
html:not(.dark) nav.lg\:hidden.fixed.bottom-6 {
  background: rgba(247,249,243,.86) !important;
  border-color: var(--lm-hair-2) !important;
  backdrop-filter: blur(16px) saturate(1.3); -webkit-backdrop-filter: blur(16px) saturate(1.3);
  box-shadow: 0 18px 44px -14px rgba(22,36,18,.45);
}

/* Weniger Bewegung respektieren */
@media (prefers-reduced-motion: reduce) {
  html:not(.dark) :is(.vd-card, .faq-item, .if-quickbtn) { transition: none !important; }
}

/* ===== LOGO: Text rechts neben dem Logo, mittig ausgerichtet (beide Modi) ===== */
.ix-logo {
  display: grid; grid-template-columns: auto auto; grid-template-rows: auto auto;
  align-items: center; column-gap: 0; row-gap: 0; text-align: center;
}
.ix-logo-img { grid-column: 1; grid-row: 1 / 3; margin-right: 12px; }
.ix-logo-sub, .ix-logo-sub-2 {
  grid-column: 2; margin: 0; padding-left: 12px; white-space: nowrap;
  border-left: 1px solid rgba(var(--ix-fg), .22); text-align: center;
}
.ix-logo-sub { grid-row: 1; align-self: end; padding-bottom: 2px; font-size: 9px; font-weight: 600; letter-spacing: .3em; }
.ix-logo-sub-2 { grid-row: 2; align-self: start; padding-top: 2px; font-size: 7.5px; letter-spacing: .24em; }
@media (max-width: 700px) {
  .ix-logo-img { margin-right: 9px; }
  .ix-logo-sub, .ix-logo-sub-2 { padding-left: 9px; }
  .ix-logo-sub { font-size: 7px; letter-spacing: .2em; }
  .ix-logo-sub-2 { font-size: 5.5px; letter-spacing: .16em; }
}

/* ===== HELLER MODUS v2: „Warm Editorial“ – Creme & Sand, ohne Raster ===== */
html:not(.dark) {
  --lm-net: linear-gradient(transparent, transparent);
  --lm-line: rgba(60,45,25,.12);
  --lm-card-shadow: 0 1px 2px rgba(60,45,25,.06), 0 18px 40px -22px rgba(60,45,25,.28);
}
html:not(.dark) body { background: #fcfaf6 !important; background-attachment: scroll !important; }
html:not(.dark) #konzept { background: #f4eee4 !important; }
html:not(.dark) #prozess { background: #fcfaf6 !important; }
html:not(.dark) #referenzen { background: #f4eee4 !important; }
html:not(.dark) #lichtdecken { background: #fcfaf6 !important; }
html:not(.dark) #easy-light { background: #f4eee4 !important; }
html:not(.dark) #qualitaet { background: #fcfaf6 !important; }
html:not(.dark) .vorteile-header { background: #fcfaf6 !important; }
html:not(.dark) .ix-section { background: #fcfaf6 !important; }
html:not(.dark) .ix-services-section { background: #f4eee4 !important; }
html:not(.dark) .ix-ak-section { background: #fcfaf6 !important; }
html:not(.dark) .vd-section { background: #f4eee4 !important; }
html:not(.dark) section#videos.vd-section { background: #f4eee4 !important; }
html:not(.dark) section#kategorien.ix-section { background: #fcfaf6 !important; }
html:not(.dark) section#leistungen.ix-services-section { background: #f4eee4 !important; }
html:not(.dark) section#akustik-optionen.ix-ak-section { background: #fcfaf6 !important; }
html:not(.dark) section.py-24.border-b.border-zinc-100 { background: #fcfaf6 !important; }
html:not(.dark) section#vorteile .vorteile-header { background: #fcfaf6 !important; }
html:not(.dark) section#konzept { background: #f4eee4 !important; }
html:not(.dark) section#prozess { background: #fcfaf6 !important; }
html:not(.dark) section#referenzen { background: #f4eee4 !important; }
html:not(.dark) section#lichtdecken { background: #fcfaf6 !important; }
html:not(.dark) section#easy-light { background: #f4eee4 !important; }
html:not(.dark) section#qualitaet { background: #fcfaf6 !important; }
html:not(.dark) :is(#videos, #kategorien, #leistungen, #akustik-optionen, #vorteile, #konzept, #prozess, #referenzen, #lichtdecken, #easy-light, #qualitaet),
html:not(.dark) section.py-24.border-b.border-zinc-100 {
  box-shadow: none !important; border-color: rgba(60,45,25,.10) !important;
}
html:not(.dark) section#vorteile .vorteile-header {
  box-shadow: 0 2px 0 #9deb47 !important;
}
/* Footer: warmes Sand statt grünem Netz */
html:not(.dark) .if-footer {
  background: #efe7da !important; border-top: 2px solid #9deb47 !important;
  box-shadow: none !important;
}
html:not(.dark) .if-footer::before { display: none !important; }
/* Navigation: cremeweiße Pille */
html:not(.dark) .ix-nav-inner {
  background: rgba(255,253,249,.92); border-color: rgba(60,45,25,.10);
  box-shadow: 0 10px 30px -12px rgba(60,45,25,.22);
}
html:not(.dark) .ix-nav.ix-is-scrolled .ix-nav-inner { background: rgba(255,253,249,.97); }
/* Hero: warmer Creme-Verlauf */
html:not(.dark) .ix-hero-overlay {
  background:
    linear-gradient(90deg, rgba(252,250,246,.97) 0%, rgba(252,250,246,.88) 28%, rgba(252,250,246,.40) 60%, rgba(252,250,246,.06) 100%),
    linear-gradient(0deg, #fcfaf6 0%, rgba(252,250,246,.55) 16%, transparent 42%);
}
@media (max-width: 700px) {
  html:not(.dark) .ix-hero-overlay {
    background: linear-gradient(180deg, rgba(252,250,246,.62) 0%, rgba(252,250,246,.10) 30%, rgba(252,250,246,.90) 66%, #fcfaf6 90%);
  }
}

  @media (min-width: 701px) {
    #ixNav .ix-nav-inner .ix-nav-links > details.ix-legal-dropdown {
      display: inline-flex !important;
      flex: 0 0 auto !important;
      position: relative !important;
      align-items: center !important;
      visibility: visible !important;
      opacity: 1 !important;
      margin: 0 !important;
    }
    #ixNav .ix-nav-inner .ix-nav-links > details.ix-legal-dropdown > summary.ix-legal-dropdown-trigger {
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      gap: 7px !important;
      min-height: 40px !important;
      padding: 8px 0 !important;
      margin: 0 !important;
      border: 0 !important;
      border-radius: 0 !important;
      background: transparent !important;
      color: #d5d5d5 !important;
      font-family: inherit !important;
      font-size: 13px !important;
      font-weight: 650 !important;
      line-height: 1.3 !important;
      white-space: nowrap !important;
      list-style: none !important;
      cursor: pointer !important;
      opacity: 1 !important;
      visibility: visible !important;
    }
    #ixNav .ix-nav-inner .ix-nav-links > details.ix-legal-dropdown > summary.ix-legal-dropdown-trigger::-webkit-details-marker {
      display: none !important;
    }
    #ixNav .ix-nav-inner .ix-nav-links > details.ix-legal-dropdown > summary.ix-legal-dropdown-trigger:hover,
    #ixNav .ix-nav-inner .ix-nav-links > details.ix-legal-dropdown[open] > summary.ix-legal-dropdown-trigger {
      color: #9deb47 !important;
    }
    #ixNav .ix-nav-inner .ix-nav-links > details.ix-legal-dropdown:not([open]) > .ix-legal-dropdown-menu {
      display: none !important;
    }
    #ixNav .ix-nav-inner .ix-nav-links > details.ix-legal-dropdown[open] > .ix-legal-dropdown-menu {
      display: block !important;
      position: absolute !important;
      top: calc(100% + 10px) !important;
      right: 0 !important;
      left: auto !important;
      z-index: 2000 !important;
      min-width: 240px !important;
      padding: 8px !important;
      border: 1px solid rgba(158,235,71,.35) !important;
      border-radius: 12px !important;
      background: #111713 !important;
      box-shadow: 0 16px 40px rgba(0,0,0,.35) !important;
    }
    #ixNav .ix-nav-inner .ix-nav-links > details.ix-legal-dropdown > .ix-legal-dropdown-menu a {
      display: block !important;
      padding: 11px 12px !important;
      color: #f4f7f2 !important;
      font-size: 13px !important;
      line-height: 1.4 !important;
      text-decoration: none !important;
      white-space: nowrap !important;
      border-radius: 7px !important;
    }
    #ixNav .ix-nav-inner .ix-nav-links > details.ix-legal-dropdown > .ix-legal-dropdown-menu a:hover {
      color: #9deb47 !important;
      background: rgba(158,235,71,.12) !important;
    }
  }
  @media (min-width: 701px) and (max-width: 1100px) {
    #ixNav .ix-nav-inner .ix-nav-links { gap: 11px !important; }
    #ixNav .ix-nav-inner .ix-nav-links > a,
    #ixNav .ix-nav-inner .ix-nav-links > button,
    #ixNav .ix-nav-inner .ix-nav-links > .ix-dd,
    #ixNav .ix-nav-inner .ix-nav-links > details.ix-legal-dropdown {
      font-size: 11.5px !important;
    }
    #ixNav .ix-nav-inner .ix-nav-cta { padding: 10px 12px !important; font-size: 11px !important; }
  }
  @media (max-width: 700px) {
    #ixNav .ix-nav-inner .ix-nav-links > details.ix-legal-dropdown { display: none !important; }
  }

/* ===== Menü: Architekten & Bauträger + „Mehr“-Dropdown (Kontakt, Rechtliches) ===== */
.ix-nav-links > a { white-space: nowrap; }
.ix-nav-links > .ix-dd > .ix-dd-trigger { white-space: nowrap; }
.ix-dd-more .ix-dd-menu { width: 340px; }
.ix-dd-more .ix-dd-cap { margin-top: 6px; }
.ix-dd-more .ix-dd-foot { margin-top: 4px; }
.ix-nav-drawer .ix-dr-cap { display: block; margin: 8px 0 2px; padding: 10px 12px 4px; border-top: 1px solid var(--ix-line); font: 700 10px Manrope, sans-serif; letter-spacing: .22em; text-transform: uppercase; color: var(--ix-muted); }
@media (min-width: 1101px) and (max-width: 1360px) {
  #ixNav .ix-nav-inner .ix-nav-links { gap: 17px !important; }
  #ixNav .ix-nav-inner .ix-nav-links > a, #ixNav .ix-nav-inner .ix-nav-links > .ix-dd > .ix-dd-trigger, #ixNav .ix-nav-inner .ix-nav-links > .ix-mm-trigger { font-size: 12.5px !important; }
  #ixNav .ix-nav-inner .ix-nav-cta { padding: 10px 14px !important; font-size: 12px !important; }
}

/* ===== AGB-Modal ===== */
.agb-modal[hidden]{display:none!important}
.agb-modal{position:fixed;inset:0;z-index:100000;display:flex;align-items:flex-end;justify-content:center;padding:0}
.agb-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.72);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.agb-panel{--agb-bg:#fff;--agb-fg:#3f3f46;--agb-head:#18181b;--agb-line:rgba(24,24,27,.12);--agb-acc:#3f7d0b;--agb-chip:#f4f4f5;
position:relative;display:flex;flex-direction:column;width:100%;max-width:860px;height:94dvh;height:94vh;height:94dvh;background:var(--agb-bg);color:var(--agb-fg);border:1px solid var(--agb-line);border-radius:22px 22px 0 0;box-shadow:0 -20px 60px rgba(0,0,0,.4);outline:none;animation:agbIn .35s cubic-bezier(.2,.8,.2,1)}
html.dark .agb-panel{--agb-bg:#101410;--agb-fg:#c9d1c6;--agb-head:#fff;--agb-line:rgba(255,255,255,.1);--agb-acc:#9deb47;--agb-chip:rgba(255,255,255,.06)}
@keyframes agbIn{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
.agb-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:18px 18px 12px;border-bottom:1px solid var(--agb-line)}
.agb-kicker{margin:0 0 4px;font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--agb-acc)}
.agb-head h2{margin:0;font-size:20px;line-height:1.2;font-weight:800;color:var(--agb-head)}
.agb-close{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:12px;border:1px solid var(--agb-line);background:var(--agb-chip);color:var(--agb-head);cursor:pointer}
.agb-close:hover{border-color:var(--agb-acc);color:var(--agb-acc)}
.agb-tabs{display:flex;gap:8px;padding:10px 18px;border-bottom:1px solid var(--agb-line);overflow-x:auto;scrollbar-width:none}
.agb-tabs::-webkit-scrollbar{display:none}
.agb-tabs button{flex:none;min-height:40px;padding:0 14px;border-radius:999px;border:1px solid var(--agb-line);background:var(--agb-chip);color:var(--agb-head);font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap}
.agb-tabs button:hover,.agb-tabs button:focus-visible{border-color:var(--agb-acc);color:var(--agb-acc)}
.agb-body{flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:6px 18px calc(28px + env(safe-area-inset-bottom));font-size:15px;line-height:1.7}
.agb-body p{margin:0 0 .85em}
.agb-body ul{margin:0 0 1em;padding-left:1.3em;list-style:disc}
.agb-body li{margin-bottom:.4em}
.agb-body h3.agb-part{margin:1.6em 0 .6em;padding:.7em .9em;border-left:4px solid var(--agb-acc);border-radius:8px;background:var(--agb-chip);font-size:17px;font-weight:800;color:var(--agb-head);scroll-margin-top:8px}
.agb-body h4{margin:1.4em 0 .4em;font-size:15.5px;font-weight:800;color:var(--agb-head)}
.agb-body a{color:var(--agb-acc);text-decoration:underline;word-break:break-all}
.agb-body strong{color:var(--agb-head)}
.agb-stand{color:var(--agb-acc)}
.agb-contact{margin-top:2em;padding-top:1.2em;border-top:1px solid var(--agb-line)}
@media (min-width:700px){.agb-modal{align-items:center;padding:24px}.agb-panel{height:88dvh;border-radius:22px}.agb-head{padding:22px 28px 14px}.agb-head h2{font-size:24px}.agb-tabs{padding:12px 28px}.agb-body{padding:8px 28px 36px;font-size:15.5px}}
html.agb-lock,html.agb-lock body{overflow:hidden}
.agb-open-btn{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:10px;border:1px solid rgba(157,235,71,.5);background:rgba(157,235,71,.12);color:#9deb47;font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
.agb-open-btn:hover{background:#9deb47;color:#000}
html:not(.dark) .if-footer .agb-open-btn{color:#2f6008;border-color:rgba(63,125,11,.5)}
html:not(.dark) .if-footer .agb-open-btn:hover{background:#9deb47;color:#000}
@media (prefers-reduced-motion:reduce){.agb-panel{animation:none}}

/* ===== Mobile-/Tablet-Menü (Burger-Drawer) ===== */
@media (max-width:1100px){
  #ixNav .ix-nav-inner .ix-nav-links{display:none!important}
  #ixNav .ix-nav-inner .ix-mobile-menu{display:grid!important}
  html.ix-menu-lock,html.ix-menu-lock body{overflow:hidden}
  html.ix-menu-lock .cc-banner{opacity:0!important;visibility:hidden!important;pointer-events:none!important}
  #ixNav .ix-drawer-backdrop{display:none}
  #ixNav.ix-is-open .ix-drawer-backdrop{display:block;position:fixed;inset:0;z-index:-1;background:rgba(0,0,0,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);animation:ixBdIn .3s ease}
  @keyframes ixBdIn{from{opacity:0}to{opacity:1}}
  #ixNav .ix-mobile-menu{width:46px;height:46px;flex:none;display:grid;place-content:center;gap:0;padding:0;-webkit-tap-highlight-color:transparent}
  #ixNav .ix-mobile-menu span{margin:3px 0}
  #ixNav.ix-is-open .ix-mobile-menu span:first-child{transform:translateY(4px) rotate(45deg)}
  #ixNav.ix-is-open .ix-mobile-menu span:last-child{transform:translateY(-4px) rotate(-45deg)}
  #ixNav .ix-nav-drawer{max-height:calc(100vh - 150px);max-height:calc(100dvh - 150px);overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;gap:0;margin-top:10px;padding:6px 8px 10px;border-radius:20px;box-shadow:0 24px 60px rgba(0,0,0,.45)}
  #ixNav .ix-nav-drawer>a,
  #ixNav .ix-nav-drawer .ix-dr-acc>summary{display:flex;align-items:center;min-height:54px;padding:0 12px;font-size:16px;font-weight:600;border-radius:12px;border-bottom:1px solid rgba(var(--ix-fg),.07);-webkit-tap-highlight-color:transparent}
  #ixNav .ix-nav-drawer .ix-dr-acc>summary{justify-content:space-between}
  #ixNav .ix-nav-drawer .ix-dr-acc>summary svg{width:18px;height:18px;flex:none}
  #ixNav .ix-nav-drawer .ix-dr-acc[open]>summary{color:var(--ix-accent)}
  #ixNav .ix-nav-drawer .ix-dr-list{padding:4px 0 8px 10px;margin-left:12px;border-left:2px solid rgba(157,235,71,.35)}
  #ixNav .ix-nav-drawer .ix-dr-list a{display:flex;align-items:center;min-height:48px;padding:0 12px;font-size:15px;border-radius:10px}
  #ixNav .ix-nav-drawer .ix-dr-tiles{max-height:none;overflow:visible;padding:10px 0 12px}
  #ixNav .ix-nav-drawer .ix-dr-tile{min-height:0;padding:0;border-bottom:1px solid var(--ix-line)}
  #ixNav .ix-nav-drawer a:active,#ixNav .ix-nav-drawer summary:active{background:rgba(157,235,71,.14)}
  #ixNav.ix-is-open .ix-nav-drawer .ix-drawer-cta{display:flex;justify-content:center;align-items:center;gap:8px;align-self:stretch;width:auto;min-height:54px;margin:12px 4px 4px;padding:0 16px;border-radius:14px;font-size:15px;font-weight:700;background:#9deb47;border-color:#9deb47;color:#071000;box-shadow:0 8px 24px rgba(157,235,71,.3)}
  #ixNav .ix-drawer-cta svg{width:18px;height:18px}
  #ixNav .ix-theme-toggle{width:46px;height:46px}
}
@media (max-width:360px){#ixNav .ix-nav-drawer>a,#ixNav .ix-nav-drawer .ix-dr-acc>summary{font-size:15px}}

/* Tablet: Drawer rechts, kompakter; Kacheln in 3 Spalten */
@media (min-width:701px) and (max-width:1100px){
  #ixNav .ix-nav-drawer{max-width:560px;margin-left:auto}
  #ixNav .ix-nav-drawer .ix-dr-tiles{grid-template-columns:repeat(3,1fr)}
  #ixNav .ix-nav-inner .ix-nav-cta{padding:10px 14px!important;font-size:12px!important;white-space:nowrap}
}
/* Schnellkontakt im Drawer */
.ix-dr-quick{display:none}
@media (max-width:1100px){
  #ixNav .ix-dr-quick{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:8px 4px 4px}
  #ixNav .ix-nav-drawer .ix-dr-quick a{display:flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:0 10px;border:1px solid rgba(var(--ix-fg),.14);border-radius:14px;font-size:14px;font-weight:600;color:var(--ix-white);background:rgba(var(--ix-fg),.04)}
  #ixNav .ix-dr-quick svg{width:18px;height:18px;flex:none;color:var(--ix-accent)}
  html:not(.dark) #ixNav .ix-nav-drawer .ix-dr-quick a{color:#18181b;background:#fff;border-color:rgba(24,24,27,.14)}
  html:not(.dark) #ixNav .ix-dr-quick svg{color:#3f7d0b}
}

/* ===== Footer: Layout (Mobil · Tablet · Desktop) ===== */
#footer{--ft-line:rgba(255,255,255,.10);--ft-chip:rgba(255,255,255,.04);--ft-muted:#8b8b94;padding-top:3.5rem;padding-bottom:calc(8.5rem + env(safe-area-inset-bottom,0px))}
html:not(.dark) #footer{--ft-line:rgba(24,24,27,.14);--ft-chip:rgba(255,255,255,.72);--ft-muted:#4f5a4d}
#footer>.container{width:100%;max-width:1240px;margin:0 auto;box-sizing:border-box;padding-left:max(1.25rem,env(safe-area-inset-left,0px));padding-right:max(1.25rem,env(safe-area-inset-right,0px))}
#footer .if-footer-grid{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:2.25rem!important;margin-bottom:2rem!important}
#footer .if-footer-grid>*{min-width:0}
#footer .if-footer-h3{font-size:1.75rem!important;line-height:1.1;margin:0 0 1.25rem!important}
#footer .if-footer-h5{margin:0 0 1.1rem!important}

/* Kontakt */
#footer .ft-contact{display:grid;gap:1rem;font-size:14px;line-height:1.55}
#footer .ft-contact>p{margin:0!important}
#footer .ft-contact a{word-break:break-word}
#footer .if-quickrow{grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;margin-top:1.25rem}
#footer .if-quickbtn{min-height:48px;padding:0 .4rem;font-size:10px;letter-spacing:.08em}
#footer .if-quickbtn span{white-space:nowrap}
@media(max-width:359px){#footer .if-quickrow{grid-template-columns:1fr}}
@media(min-width:480px) and (max-width:639px){
  #footer .ft-contact{grid-template-columns:1fr 1fr;gap:1.1rem 1.5rem}
  #footer .ft-contact>p:nth-child(1){order:1}
  #footer .ft-contact>p:nth-child(3){order:2}
  #footer .ft-contact>p:nth-child(2){order:3;grid-column:1/-1}
  #footer .ft-contact>p:nth-child(4){order:4;grid-column:1/-1}
}

/* Link-Listen: auf Mobil kompakte Chips */
#footer .if-flinks{list-style:none;margin:0;padding:0;column-count:1!important;display:flex;flex-wrap:wrap;gap:.5rem}
#footer .if-flinks>li{margin:0!important}
#footer .if-flinks>li>a{display:inline-flex!important;align-items:center;min-height:44px;padding:0 14px!important;border:1px solid var(--ft-line);border-radius:999px;background:var(--ft-chip);transform:none!important;line-height:1.2}
#footer .if-flinks>li>a:active{background:rgba(158,235,71,.16)}

/* Rechtliches-Akkordeon */
#footer .ft-legal .space-y-4{display:grid;gap:.75rem}
#footer .ft-legal .space-y-4>*{margin:0!important}
#footer .if-legal-btn{min-height:54px;padding:0 1rem!important;font-size:11.5px;letter-spacing:.1em}
#footer .faq-answer{font-size:13px;line-height:1.7}
#footer .faq-answer.opacity-100,#footer .faq-answer[style*="max-height: 0px"]{padding-top:0}
#footer .faq-answer .text-\[9px\]{font-size:11px;line-height:1.5}
#footer .faq-answer a{word-break:break-word}

/* CTA-Band */
#footer .ft-cta{display:grid;grid-template-columns:minmax(0,1fr);gap:0;padding:1.5rem;border:1px solid rgba(158,235,71,.30);border-radius:20px;background:linear-gradient(135deg,rgba(158,235,71,.11),rgba(158,235,71,.02))}
#footer .ft-cta .if-footer-h5{margin:0 0 1rem!important}
#footer .ft-cta p{margin:0 0 1.25rem!important;font-size:14px;line-height:1.65}
#footer .ft-cta a{display:flex!important;align-items:center;justify-content:center;width:100%;min-height:54px;padding:0 1.5rem!important;border-radius:12px;font-size:11px;letter-spacing:.1em;box-sizing:border-box}
html:not(.dark) #footer .ft-cta{background:linear-gradient(135deg,rgba(255,255,255,.85),rgba(255,255,255,.55));border-color:rgba(100,175,35,.45)}

/* Unterleiste */
#footer .ft-bottom{display:flex;flex-direction:column;align-items:center;gap:.9rem;padding-top:1.75rem;border-top:1px solid var(--ft-line);text-align:center;font-size:10px;line-height:1.5;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ft-muted)}
#footer .ft-bottom p{margin:0}
#footer .ft-legal-links{display:flex;flex-wrap:wrap;justify-content:center;gap:.25rem 1.1rem}
#footer .ft-legal-links a{display:inline-flex;align-items:center;min-height:40px;color:inherit;text-decoration:none;transition:color .2s}
#footer .ft-legal-links a:hover,#footer .ft-legal-links a:focus-visible{color:#9eeb47}
html:not(.dark) #footer .ft-legal-links a:hover,html:not(.dark) #footer .ft-legal-links a:focus-visible{color:#3f7d0b!important}

/* Tablet */
@media(min-width:640px){
  #footer{padding-top:4.5rem}
  #footer>.container{padding-left:max(2rem,env(safe-area-inset-left,0px));padding-right:max(2rem,env(safe-area-inset-right,0px))}
  #footer .if-footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-template-areas:"k l" "p n" "c c";gap:2.75rem 2.5rem!important}
  #footer .ft-kontakt{grid-area:k}#footer .ft-legal{grid-area:l}#footer .ft-portfolio{grid-area:p}#footer .ft-nav{grid-area:n}#footer .ft-cta{grid-area:c}
  #footer .if-footer-h3{font-size:2rem!important}
  #footer .if-flinks{display:block}
  #footer .if-flinks>li{margin:0!important}
  #footer .if-flinks>li+li{margin-top:.25rem!important}
  #footer .if-flinks>li>a{display:inline-flex!important;min-height:40px;padding:0!important;border:0;border-radius:0;background:none}
  #footer .if-flinks>li>a:hover{transform:translateX(6px)!important}
}
@media(min-width:768px){
  #footer .ft-cta{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"h b" "p b";align-items:center;column-gap:2rem;padding:1.75rem 2rem}
  #footer .ft-cta .if-footer-h5{grid-area:h;margin-bottom:.6rem!important}
  #footer .ft-cta p{grid-area:p;margin:0!important;max-width:62ch}
  #footer .ft-cta a{grid-area:b;width:auto;white-space:nowrap}
}
@media(min-width:640px) and (max-width:1023px){#footer .ft-portfolio .if-flinks{display:grid;grid-template-columns:1fr 1fr;column-gap:1rem}}
/* Desktop */
@media(min-width:1024px){
  #footer{padding-top:5.5rem;padding-bottom:3rem}
  #footer>.container{padding-left:2.5rem;padding-right:2.5rem}
  #footer .if-footer-grid{grid-template-columns:1.25fr 1fr .8fr 1.3fr!important;grid-template-areas:"k p n l" "c c c c";gap:3.5rem 3.5rem!important;margin-bottom:3.5rem!important}
  #footer .if-footer-h3{font-size:2.25rem!important}
  #footer .ft-bottom{flex-direction:row;justify-content:space-between;text-align:left;padding-top:2rem}
  #footer .ft-legal-links{justify-content:center}
}