/*
Theme Name: Blocksy Child - Lünendonk
Theme URI: https://luenendonk.de
Description: Child Theme für Lünendonk & Hossenfelder GmbH Website Relaunch
Author: Lünendonk & Hossenfelder GmbH
Author URI: https://luenendonk.de
Template: blocksy
Version: 2.0.1
Text Domain: blocksy-child-luenendonk
*/

html {
  scroll-behavior: smooth;
}

/* ====================================
   FIX: Mega-Menu Ausrichtung
   ====================================
   Problem: Produkte & Leistungen Mega-Menü hat fixen left: -305px.
   Bei schmaleren Viewports ragt es über den linken Bildschirmrand hinaus
   und überlappt benachbarte Menüpunkte → Dropdown springt.
   Fix: Mega-Menü immer an der linken Kante des Menüpunkts ausrichten.
   ==================================== */
.ct-mega-menu-custom-width > .sub-menu {
  left: 0 !important;
}

/* Mega-Menu Leistungen-Spalte: Links umbrechen statt einzeilig */
.ct-mega-menu-custom-width > .sub-menu > .mega-col-header:nth-child(2) a {
  max-width: 220px;
}

/* Mega-Menu Subkategorie-Labels (RESEARCH, CONSULTING) besser lesbar */
.ct-mega-menu-custom-width .mega-col-header .mega-col-header > a {
  color: var(--cobalt-700) !important;
}

/* ====================================
   BRAND FARBEN (Figma Design System)
   ==================================== */

:root {

  /* Cobalt (Primary Blue) – NEU: Figma #0029F9 als 500 */
  --cobalt-900: #000f5e;
  --cobalt-800: #001478;
  --cobalt-700: #001a94;
  --cobalt-600: #0020b2;
  --cobalt-500: #0029f9;
  --cobalt-400: #3354fa;
  --cobalt-300: #667ffb;
  --cobalt-200: #99aafc;
  --cobalt-100: #ccd4fe;
  --cobalt-50: #e6eafe;

  /* Midnight (Dark Blue) – NEU: Figma Text Primary #001122 */
  --midnight-900: #012;
  --midnight-800: #0d1f33;
  --midnight-700: #1a2d44;
  --midnight-600: #2a3d55;
  --midnight-500: #3a4d66;
  --midnight-400: #506580;
  --midnight-300: #6d829e;
  --midnight-200: #92a3ba;
  --midnight-100: #bcc7d6;
  --midnight-50: #d4dce5;

  /* Yellow (Accent) - aus Brand Guidelines */
  --yellow-900: #85570a;
  --yellow-800: #9f6a0c;
  --yellow-700: #bc7f0f;
  --yellow-600: #d99514;
  --yellow-500: #efab19;
  --yellow-400: #f4bc3d;
  --yellow-300: #f7cd66;
  --yellow-200: #fae094;
  --yellow-100: #fcefc4;
  --yellow-50: #fef9ed;

  /* Semantische Farben – NEU: Figma Design Tokens */
  --luenendonk-primary: var(--cobalt-500);           /* #0029F9 */
  --luenendonk-primary-hover: var(--cobalt-600);     /* #0020B2 */
  --luenendonk-primary-button: #0022cf;              /* NEU: Figma Elements/Primary/Default */
  --luenendonk-accent: #f8c853;
  --luenendonk-accent-hover: #cea645;
  --luenendonk-dark: var(--midnight-900);            /* #001122 */
  --luenendonk-dark-bg: #012;                        /* Hero/Footer Hintergrund */
  --luenendonk-text: var(--midnight-900);            /* NEU: #001122 statt midnight-600 */
  --luenendonk-text-muted: var(--midnight-400);
  --luenendonk-border: rgba(0, 8, 17, 0.1);         /* NEU: Figma Elements/Default/Border */
  --luenendonk-border-hover: rgba(0, 8, 17, 0.3);  /* Hover-State */
  --luenendonk-separator: #d4dce5;                  /* Trennlinien */
  --luenendonk-error: #e53e3e;                      /* Formular-Fehlerfarbe */
  --luenendonk-button-active: #001ba6;              /* Button :active State */
  --luenendonk-bg-light: #f0f3f6;

  /* Figma Spacing Tokens */
  --spacing-12: 12px;
  --spacing-16: 16px;
  --padding-xsmall: 16px;
  --padding-small: 32px;
  --padding-medium: 48px;
  --padding-large: 64px;
  --padding-xlarge: 80px;

  /* Figma Layout */
  --content-max-width: 1312px;

  /* Icon SVGs (dedupliziert) */
  --icon-arrow-right: url("data:image/svg+xml,%3Csvg width='28' height='28' viewBox='0 0 28 28' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M13.9647 6.38128C13.6229 6.72299 13.6229 7.27701 13.9647 7.61872L19.4709 13.125H7.00004C6.51679 13.125 6.12504 13.5168 6.12504 14C6.12504 14.4832 6.51679 14.875 7.00004 14.875H19.4709L13.9647 20.3813C13.6229 20.723 13.6229 21.277 13.9647 21.6187C14.3064 21.9604 14.8604 21.9604 15.2021 21.6187L22.2021 14.6187C22.5438 14.277 22.5438 13.723 22.2021 13.3813L15.2021 6.38128C14.8604 6.03957 14.3064 6.03957 13.9647 6.38128Z' fill='%23003366'/%3E%3C/svg%3E");
  --icon-circle-arrow: url("data:image/svg+xml,%3Csvg width='38' height='38' viewBox='0 0 38 38' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M18.97 12.47a.75.75 0 0 1 1.06 0l6 6a.75.75 0 0 1 0 1.06l-6 6a.75.75 0 1 1-1.06-1.06l4.72-4.72H13a.75.75 0 0 1 0-1.5h10.69l-4.72-4.72a.75.75 0 0 1 0-1.06Z' fill='%23000811'/%3E%3C/g%3E%3Crect x='.5' y='.5' width='37' height='37' rx='18.5' stroke='%23000811' stroke-opacity='.1'/%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Crect width='38' height='38' rx='19' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
  --icon-arrow-external: url("data:image/svg+xml,%3Csvg width='28' height='28' viewBox='0 0 28 28' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.625 7.875C9.14175 7.875 8.75 7.48325 8.75 7C8.75 6.51675 9.14175 6.125 9.625 6.125H21C21.4832 6.125 21.875 6.51675 21.875 7V18.375C21.875 18.8582 21.4832 19.25 21 19.25C20.5168 19.25 20.125 18.8582 20.125 18.375V8.98744L7.61872 21.4937C7.27701 21.8354 6.72299 21.8354 6.38128 21.4937C6.03957 21.152 6.03957 20.598 6.38128 20.2563L18.8875 7.75H9.625V7.875Z' fill='%23003366'/%3E%3C/svg%3E");
  --icon-plus: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 5v14M5 12h14' stroke='%23001122' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
  --icon-close: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18 6L6 18M6 6l12 12' stroke='%23001122' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
  --icon-chevron-down: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23001122' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
  --icon-chevron-down-rounded: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%23001122' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* ====================================
   CI-TYPOGRAFIE-KLASSEN
   Zentrale Rollen für alle Patterns.
   Spezifität 0,3,0 → schlägt Stackable inline 0,2,0
   ==================================== */

/* ci-meta: Meta-Label blau, 12/19px, uppercase, zentriert */
.stk-block-text.ci-meta .stk-block-text__text {
  font-family: Inter, sans-serif !important;
  font-size: 12px !important;
  line-height: 19px !important;
  font-weight: 400 !important;
  color: var(--cobalt-500) !important;
  text-transform: uppercase !important;
  text-align: center !important;
}

/* ci-h2-section: Section-Headline, 48/53px, zentriert */
.stk-block-heading.ci-h2-section .stk-block-heading__text {
  font-family: Inter, sans-serif !important;
  font-size: 48px !important;
  line-height: 53px !important;
  font-weight: 400 !important;
  color: var(--luenendonk-dark) !important;
  text-align: center !important;
}

/* ci-h3-card: Card-Heading, 24/29px */
.stk-block-heading.ci-h3-card .stk-block-heading__text {
  font-family: Inter, sans-serif !important;
  font-size: 24px !important;
  line-height: 29px !important;
  font-weight: 400 !important;
  color: var(--luenendonk-dark) !important;
}

/* ci-body: Fließtext 16/26px */
.stk-block-text.ci-body .stk-block-text__text {
  font-family: Inter, sans-serif !important;
  font-size: 16px !important;
  line-height: 26px !important;
  font-weight: 400 !important;
  color: var(--luenendonk-dark) !important;
}

/* ci-body-large: Fließtext 22/33px */
.stk-block-text.ci-body-large .stk-block-text__text {
  font-family: Inter, sans-serif !important;
  font-size: 22px !important;
  line-height: 33px !important;
  font-weight: 400 !important;
  color: var(--luenendonk-dark) !important;
}

/* ci-btn-primary: Button-Text 16/26px weiß */
.stk-block-button.ci-btn-primary .stk-button__inner-text {
  font-family: Inter, sans-serif !important;
  font-size: 16px !important;
  line-height: 26px !important;
  font-weight: 400 !important;
  color: #fff !important;
}

/* CI-Klassen Responsive: Tablet */
@media screen and (max-width: 1023px) {

  .stk-block-text.ci-meta .stk-block-text__text {
    font-size: 12px !important;
  }

  .stk-block-heading.ci-h2-section .stk-block-heading__text {
    font-size: 48px !important;
  }

  .stk-block-heading.ci-h3-card .stk-block-heading__text {
    font-size: 24px !important;
  }

  .stk-block-text.ci-body .stk-block-text__text {
    font-size: 16px !important;
  }

  .stk-block-text.ci-body-large .stk-block-text__text {
    font-size: 22px !important;
  }
}

/* ====================================
   LAYOUT: KEIN ABSTAND OBEN
   ==================================== */

html,
body {
  margin: 0 !important;
  padding: 0 !important;
}

/* ====================================
   HEADER: DUNKELBLAU (#001122)
   ==================================== */

.ct-header,
header.ct-header,
header#header.ct-header {
  background-color: var(--luenendonk-dark-bg) !important;
}

.ct-header [data-row],
header#header [data-row] {
  background-color: var(--luenendonk-dark-bg) !important;
}

.ct-header .ct-container,
header#header .ct-container {
  background-color: transparent !important;
}

/* Navigation: Weiß */
header#header .ct-menu-link,
.ct-header .ct-menu-link,
.ct-header .menu-item a {
  color: #fff !important;
}

header#header .ct-menu-link:hover,
.ct-header .ct-menu-link:hover {
  color: var(--luenendonk-accent) !important;
}

/* Dropdown Pfeil: Weiß */
header#header .ct-toggle-dropdown-desktop svg,
.ct-header .ct-toggle-dropdown-desktop svg {
  fill: #fff !important;
}

/* ── Dropdown SubNav: Figma-konform ── */

/* Container: Heller Hintergrund */
header#header .sub-menu,
.ct-header .sub-menu {
  background-color: #f0f3fe !important;
  border: none !important;
  box-shadow: 0 4px 16px rgba(0, 17, 34, 0.08) !important;
}

/* Links: Dunkler Text, 14px/22px, Padding 12px 20px */
header#header .sub-menu .menu-item > a,
.ct-header .sub-menu .menu-item > a,
header#header .sub-menu .ct-menu-link,
.ct-header .sub-menu .ct-menu-link {
  color: var(--luenendonk-dark) !important;
  font-size: 14px !important;
  line-height: 22px !important;
  font-weight: 400 !important;
  padding: 12px 20px !important;
}

/* Hover: Blau */
header#header .sub-menu .menu-item > a:hover,
.ct-header .sub-menu .menu-item > a:hover,
header#header .sub-menu .ct-menu-link:hover,
.ct-header .sub-menu .ct-menu-link:hover {
  color: var(--luenendonk-primary-button) !important;
}

/* Aktive Seite: Blau */
header#header .sub-menu .current-menu-item > a,
.ct-header .sub-menu .current-menu-item > a,
header#header .sub-menu .current-menu-item > .ct-menu-link,
.ct-header .sub-menu .current-menu-item > .ct-menu-link {
  color: var(--luenendonk-primary-button) !important;
}

/* Trennlinien im Dropdown entfernen */
header#header .sub-menu .menu-item,
.ct-header .sub-menu .menu-item {
  border: none !important;
  border-bottom: none !important;
}

/* Mobile Menu Button: Weiß */
header#header .ct-header-trigger,
.ct-header .ct-header-trigger {
  color: #fff !important;
}

header#header .ct-header-trigger svg,
.ct-header .ct-header-trigger svg {
  fill: #fff !important;
}

/* ── Top Row: Search + Cart — CI-konform ── */

/* Icons: zwischen Menü-Ende und Viewport-Rand */
header#header [data-row="top"] .ct-container {
  max-width: 1760px !important;
  padding: 0 35px 0 0 !important;
}

/* Kompaktere Höhe */
header#header [data-row="top"] {
  height: 40px !important;
}

/* Cart Preis-Label ausblenden — nur Icon zeigen */
header#header .ct-header-cart .ct-label {
  display: none !important;
}

/* ── Custom SVG Icons: Minimal, 1.5px stroke ── */

/* Alle Blocksy-SVGs + Gravatars in Top Row ausblenden */
header#header [data-row="top"] svg,
header#header [data-row="top"] .ct-media-container img {
  display: none !important;
}

/* === SEARCH — dünne Lupe === */
header#header [data-id="search"] {
  width: 18px !important;
  height: 18px !important;
  padding: 0 !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='16.5' y1='16.5' x2='21' y2='21'/%3E%3C/svg%3E") center/contain no-repeat !important;
  border: none !important;
  transition: background 0.2s ease !important;
}

header#header [data-id="search"]:hover {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23F8C853' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='16.5' y1='16.5' x2='21' y2='21'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
}

/* === ACCOUNT — User-Silhouette (ein- und ausgeloggt) === */
header#header .ct-header-account .ct-account-item {
  width: 18px !important;
  height: 18px !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21v-2a4 4 0 00-4-4H8a4 4 0 00-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E") center/contain no-repeat !important;
}

header#header .ct-header-account:hover .ct-account-item {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23F8C853' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21v-2a4 4 0 00-4-4H8a4 4 0 00-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
}

/* Account: Labels + Media-Container + SVG ausblenden */
header#header .ct-header-account .ct-media-container,
header#header .ct-header-account .ct-label {
  display: none !important;
}

/* === CART — Shopping Bag === */
header#header .ct-header-cart .ct-icon-container {
  width: 18px !important;
  height: 18px !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2L3 6v14a2 2 0 002 2h14a2 2 0 002-2V6l-3-4z'/%3E%3Cline x1='3' y1='6' x2='21' y2='6'/%3E%3Cpath d='M16 10a4 4 0 01-8 0'/%3E%3C/svg%3E") center/contain no-repeat !important;
}

header#header .ct-header-cart:hover .ct-icon-container {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23F8C853' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2L3 6v14a2 2 0 002 2h14a2 2 0 002-2V6l-3-4z'/%3E%3Cline x1='3' y1='6' x2='21' y2='6'/%3E%3Cpath d='M16 10a4 4 0 01-8 0'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
}

/* Cart Badge (Anzahl): klein, dezent */
header#header .ct-header-cart .ct-dynamic-count-cart {
  background-color: var(--luenendonk-accent, #f8c853) !important;
  color: var(--luenendonk-dark, #012) !important;
  font-size: 10px !important;
  min-width: 16px !important;
  height: 16px !important;
  line-height: 16px !important;
  border-radius: 8px !important;
}

/* ── Search Overlay Modal — CI-konform ── */

/* Hintergrund: Lünendonk Dark */
#search-modal {
  background-color: rgba(0, 17, 34, 0.97) !important;
}

/* Input: Weißer Text, dezente Underline */
#search-modal input[type="search"],
#search-modal .ct-search-form input {
  color: #fff !important;
  font-family: "Roboto Serif", sans-serif !important;
  font-size: 32px !important;
  font-weight: 300 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;
  caret-color: var(--luenendonk-accent, #f8c853) !important;
}

#search-modal input::placeholder {
  color: rgba(255, 255, 255, 0.35) !important;
  font-family: "Roboto Serif", sans-serif !important;
  font-weight: 300 !important;
}

#search-modal input:focus {
  border-bottom-color: rgba(255, 255, 255, 0.4) !important;
}

/* Submit Button: Weißer Kreis-Rahmen + weiße Lupe */
#search-modal .ct-search-form button,
#search-modal .ct-search-form .wp-element-button {
  background: transparent !important;
  border: 1.5px solid rgba(255, 255, 255, 0.4) !important;
  border-radius: 50% !important;
  box-shadow: none !important;
  width: 48px !important;
  height: 48px !important;
  padding: 0 !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: center !important;
  transition: border-color 0.2s ease, background-color 0.2s ease !important;
}

#search-modal .ct-search-form button:hover,
#search-modal .ct-search-form .wp-element-button:hover {
  border-color: #fff !important;
  background-color: rgba(255, 255, 255, 0.1) !important;
}

#search-modal .ct-search-form button svg,
#search-modal .ct-search-form .wp-element-button svg {
  color: #fff !important;
  fill: none !important;
  stroke: #fff !important;
  width: 20px !important;
  height: 20px !important;
}

#search-modal .ct-search-form button:hover svg {
  color: #fff !important;
  stroke: #fff !important;
}

/* Close Button: Weiß, dezent */
#search-modal .ct-toggle-close {
  color: rgba(255, 255, 255, 0.5) !important;
}

#search-modal .ct-toggle-close:hover {
  color: #fff !important;
}

/* ====================================
   MEGA PANEL: Produkte & Leistungen
   2-Spalten Panel via Blocksy ct-mega-menu
   ==================================== */

/* Panel-Breite + Grid-Spalten */
header#header .ct-mega-menu-custom-width {
  --mega-menu-width: 520px;
  --mega-menu-max-width: 520px;
  --grid-template-columns: 1fr 1fr;
}

/* Panel-Hintergrund: wie Märkte-Dropdown */
header#header .ct-mega-menu-custom-width > .sub-menu {
  background-color: #f0f3fe !important;
  box-shadow: 0 4px 16px rgba(0, 17, 34, 0.08) !important;
  border: none !important;
  border-radius: 0 0 2px 2px !important;
  padding: 8px 0 !important;
}

/* Grid-Spalten: oben ausrichten */
header#header .ct-mega-menu-custom-width > .sub-menu > .menu-item {
  align-self: start !important;
  padding: 12px 0 !important;
}

/* Spalten-Header (PRODUKTE, LEISTUNGEN): Gelb, Uppercase, klein */
header#header .ct-mega-menu-custom-width > .sub-menu > .mega-col-header > a,
header#header .ct-mega-menu-custom-width > .sub-menu > .mega-col-header > .ct-menu-link {
  font-size: 12px !important;
  line-height: 19px !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: var(--luenendonk-primary-button) !important;
  padding: 12px 20px 8px 20px !important;
  pointer-events: none !important;
  cursor: default !important;
}

/* Kein Hover auf Spalten-Header */
header#header .ct-mega-menu-custom-width > .sub-menu > .mega-col-header > a:hover,
header#header .ct-mega-menu-custom-width > .sub-menu > .mega-col-header > .ct-menu-link:hover {
  color: var(--luenendonk-primary-button) !important;
}

/* Sub-Section-Header (RESEARCH, CONSULTING): Grau, Uppercase */
header#header .ct-mega-menu-custom-width .mega-subsection-header > a,
header#header .ct-mega-menu-custom-width .mega-subsection-header > .ct-menu-link {
  font-size: 11px !important;
  line-height: 17px !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: var(--luenendonk-text-muted) !important;
  padding: 16px 20px 6px 20px !important;
  pointer-events: none !important;
  cursor: default !important;
}

/* Nested Sub-Menus: Inline anzeigen (nicht als Dropdown) */
header#header .ct-mega-menu-custom-width .sub-menu .sub-menu {
  position: static !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  transform: none !important;
  pointer-events: inherit !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  width: auto !important;
  min-width: 0 !important;
}

/* Nested Items klickbar NUR wenn Mega-Menu offen */
header#header .ct-mega-menu-custom-width:hover .sub-menu .sub-menu {
  pointer-events: auto !important;
}

/* Dropdown-Pfeile in Mega Panel verstecken */
header#header .ct-mega-menu-custom-width .sub-menu .ct-toggle-dropdown-desktop,
header#header .ct-mega-menu-custom-width .sub-menu .ct-toggle-dropdown-desktop-ghost {
  display: none !important;
}

/* Spalten-Trennlinie entfernen */
header#header .ct-mega-menu-custom-width > .sub-menu > .menu-item:not(:last-child) {
  border-inline-end: none !important;
}

/* Links in Mega Panel: Padding anpassen */
header#header .ct-mega-menu-custom-width .sub-menu .sub-menu .menu-item > a,
header#header .ct-mega-menu-custom-width .sub-menu .sub-menu .ct-menu-link {
  padding: 8px 20px !important;
}

/* ====================================
   SPACING: KEINE GAPS
   ==================================== */

header#header.ct-header {
  margin-bottom: 0 !important;
}

main#main.site-main {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

[data-content="normal"][data-vertical-spacing] {
  padding-top: 0 !important;
}

main#main article {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.entry-content {
  margin-top: 0 !important;
}

/* Stackable Blocks: Standard-Margin zwischen Sections entfernen */
.stk-block-columns {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.no-gap {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* WordPress Block-Gap für Homepage entfernen */
.entry-content.is-layout-constrained {
  --wp--style--block-gap: 0;
}

.entry-content > p:has(> .lue-fc__skip-link) {
  margin-bottom: 0 !important;
}

/* Leere Gutenberg-Wrapper um Shortcodes entfernen */
.entry-content > p:empty,
.entry-content > span:empty {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 0 !important;
}

/* ====================================
   FOOTER: DUNKEL (#001122)
   ==================================== */

footer#footer.ct-footer {
  background-color: var(--luenendonk-dark-bg) !important;
  color: #fff;
}

/* Footer Labels (LÜNENDONK, PRODUKTE, RESEARCH etc.) */
footer#footer .ct-footer .widget-title,
footer#footer h3,
footer#footer h4,
footer#footer h5,
footer#footer h6,
footer.ct-footer .widget-title {
  font-size: 12px !important;
  color: var(--luenendonk-accent) !important;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* Footer Beschreibungstext (rechte Spalte) */
footer#footer .ct-footer p,
footer.ct-footer p {
  font-size: 20px;
  color: #fff;
  line-height: 1.5;
}

/* Footer Links: Weiß + 16px Abstand */
footer#footer a,
footer.ct-footer a {
  color: #fff !important;
  text-decoration: none;
}

footer#footer a:hover,
footer.ct-footer a:hover {
  color: var(--luenendonk-accent) !important;
}

/* Footer Nav-Links: 16px Abstand zwischen Einträgen */
footer#footer .widget_nav_menu li,
footer#footer .menu li,
footer.ct-footer li {
  margin-bottom: 16px;
}

/* Footer Spalten: Overflow verhindern */
footer#footer [data-column],
footer.ct-footer [data-column] {
  overflow: hidden;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

/* Footer Rows: dunkler Hintergrund */
footer#footer [data-row],
footer.ct-footer [data-row] {
  background-color: var(--luenendonk-dark-bg) !important;
}

/* ====================================
   TYPOGRAFIE – NEU: Figma = alles Regular 400
   ==================================== */

/* H1 Regular (400) – Figma: Inter Regular, keine Light-Variante */
h1,
.h1,
.entry-title,
.stk-block-heading h1 {
  font-weight: 400 !important;
}

/* ====================================
   BLOCKQUOTE
   ==================================== */

blockquote,
.wp-block-quote {
  position: relative;
  padding-left: 60px;
  border-left: none;
}

blockquote::before,
.wp-block-quote::before {
  content: '"';
  position: absolute;
  left: 0;
  top: -10px;
  font-size: 72px;
  line-height: 1;
  color: var(--luenendonk-accent);
  font-family: Georgia, serif;
}

blockquote cite,
.wp-block-quote cite {
  color: var(--luenendonk-primary);
  font-style: normal;
  font-weight: 400;  /* NEU: Regular statt 500 */
}

/* ====================================
   BUTTONS – NEU: Figma Button-Farbe #0022CF
   ==================================== */

/* Primary Buttons: Figma Elements/Primary/Default */
.wp-block-button .wp-block-button__link,
.wp-element-button {
  background-color: var(--luenendonk-primary-button) !important;
  color: #fff !important;
  font-weight: 400;  /* NEU: Regular statt 500 */
  border-radius: 0;  /* NEU: Figma = keine Abrundung */
  padding: var(--spacing-12) var(--spacing-16);
}

.btn-accent,
.wp-block-button.is-style-accent .wp-block-button__link {
  background-color: var(--luenendonk-accent) !important;
  color: var(--midnight-900) !important;
}

.btn-accent:hover,
.wp-block-button.is-style-accent .wp-block-button__link:hover {
  background-color: var(--luenendonk-accent-hover) !important;
}

.btn-ghost,
.wp-block-button.is-style-ghost .wp-block-button__link {
  background-color: transparent !important;
  border: 2px solid var(--luenendonk-primary) !important;
  color: var(--luenendonk-primary) !important;
}

.btn-ghost:hover,
.wp-block-button.is-style-ghost .wp-block-button__link:hover {
  background-color: var(--luenendonk-primary) !important;
  color: #fff !important;
}

/* ====================================
   CARDS – NEU: Figma Karten-Stil
   ==================================== */

.luenendonk-card {
  background: #fff;
  border: 1px solid var(--luenendonk-border);
  padding: var(--padding-medium);
  display: flex;
  flex-direction: column;
  gap: var(--padding-small);
  border-radius: 0;  /* Figma: scharfe Kanten */
}

/* Meta Label mit Trennlinie */
.meta-wrapper {
  display: flex;
  gap: var(--spacing-16);
  align-items: flex-start;
}

.meta-label {
  font-family: Inter, sans-serif;
  font-size: 12px;
  line-height: 19px;
  font-weight: 400;
  text-transform: uppercase;
  color: var(--cobalt-500);
  white-space: nowrap;
}

.meta-line {
  flex: 1;
  height: 1px;
  background-color: var(--luenendonk-separator);
  margin-top: 9px;
}

/* ====================================
   GLOBAL FIX: Blocksy overflow:clip → sticky ermöglichen
   Blocksy setzt overflow:clip auf #main-container.
   clip blockiert sticky in allen Browsern.
   Fix: overflow-x bleibt clip (kein horizontaler Overflow),
   overflow-y wird visible (sticky funktioniert).
   ==================================== */

#main-container {
  overflow-x: clip !important;
  overflow-y: visible !important;
}

/* ====================================
   MÄRKTE SECTION: STICKY CARDS
   ==================================== */

.sticky-cards-section {
  position: relative;
}

.sticky-cards-section.stk-block-background {
  overflow: visible !important;
}

/* --- Linke Spalte: Sticky --- */
.sticky-cards-section .stk-block-column:first-child > .stk-column-wrapper {
  position: sticky;
  top: 100px;
  align-self: flex-start;
}

/* --- Cards: Sticky auf dem BLOCK selbst, nicht auf .stk-container --- */
.sticky-card {
  position: sticky !important;
  background: #fff;
  top: 80px;
}

.sticky-card .stk-block-column > .stk-column-wrapper {
  background-color: #fff;
  padding: 48px;
}

.sticky-card:nth-child(1) {
  z-index: 1;
}

.sticky-card:nth-child(2) {
  z-index: 2;
}

.sticky-card:nth-child(3) {
  z-index: 3;
}

.sticky-card:nth-child(4) {
  z-index: 4;
}

.sticky-card:nth-child(5) {
  z-index: 5;
}

.sticky-card:nth-child(6) {
  z-index: 6;
}

.sticky-card:nth-child(7) {
  z-index: 7;
}

/* --- Meta Wrapper: Label + Linie --- */
.meta-wrapper-line {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 16px;
  width: 100%;
}

.meta-label-blue {
  font-family: Inter, sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 19px;
  text-transform: uppercase;
  color: var(--luenendonk-primary);
  white-space: nowrap;
}

/* --- Meta Footer: Tags mit Trennstrichen --- */
.meta-footer-tags {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

.meta-tag {
  font-family: Inter, sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 19px;
  text-transform: uppercase;
  color: var(--luenendonk-dark);
  white-space: nowrap;
}

.meta-divider {
  width: 10px;
  height: 1px;
  background-color: var(--luenendonk-separator);
  flex-shrink: 0;
}

/* ====================================
   RESPONSIVE: STICKY CARDS – TABLET
   ==================================== */

@media (max-width: 1023px) {

  .sticky-cards-section .stk-block-column:first-child > .stk-column-wrapper {
    top: 80px;
  }

  .sticky-card {
    top: 60px;
  }
}

/* ====================================
   RESPONSIVE: STICKY CARDS – MOBILE OFF
   ==================================== */

@media (max-width: 767px) {

  /* Linke Spalte: nicht mehr sticky */
  .sticky-cards-section .stk-block-column:first-child > .stk-column-wrapper {
    position: relative;
    top: auto;
  }

  /* Cards: nicht mehr sticky */
  .sticky-card {
    position: relative !important;
    top: auto !important;
    z-index: auto !important;
    box-shadow: none !important;
  }

  /* Meta Footer: enger auf Mobile */
  .meta-footer-tags {
    gap: 8px;
  }
}

/* ====================================
   STATISTIK GRID SECTION
   ==================================== */

/* Zeilen: Kein Gap zwischen Zeile 1 und 2 */
.stats-row + .stats-row {
  margin-top: 0 !important;
}

/* Alle Kacheln: Label oben, Zahl unten */
.stats-tile > .stk-column-wrapper {
  display: flex;
  flex-direction: column;
  height: 400px;
  box-sizing: border-box;
  overflow: hidden;
}

.stats-tile-dark > .stk-column-wrapper > .stk-inner-blocks,
.stats-tile-light > .stk-column-wrapper > .stk-inner-blocks {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex: 1;
  min-height: 0;
  padding: 32px;
}

.stats-tile {
  height: 400px;
  max-height: 400px;
}

/* Count-Up Zahlen Styling */
.count-up-number {
  font-family: Inter, sans-serif;
  font-weight: 400;
  font-size: 96px;
  line-height: 1;
  letter-spacing: -0.02em;
}

/* Dunkle Kacheln */
.stats-tile-dark .count-up-number {
  color: #fff;
}

/* Helle Kacheln */
.stats-tile-light .count-up-number {
  color: var(--luenendonk-dark);
}

/* Bild-Kacheln: Parallax-ready */
.stats-tile-image > .stk-column-wrapper {
  background-size: cover;
  background-position: center;
  transition: background-position 0.1s ease-out;
}

/* --- Responsive: Tablet --- */
@media (max-width: 1023px) {

  .stats-tile > .stk-column-wrapper {
    height: 350px;
  }

  .count-up-number {
    font-size: 72px;
  }
}

/* --- Responsive: Mobile --- */
@media (max-width: 767px) {

  .stats-tile > .stk-column-wrapper {
    height: 280px;
  }

  .count-up-number {
    font-size: 56px;
  }

  .stats-tile-image {
    background-attachment: scroll;
  }
}

/* ====================================
   UTILITY KLASSEN
   ==================================== */

.bg-dark {
  background-color: var(--luenendonk-dark) !important;
  color: #fff;
}

.bg-light {
  background-color: var(--luenendonk-bg-light) !important;
}

.bg-white {
  background-color: #fff !important;
}

.bg-primary {
  background-color: var(--luenendonk-primary) !important;
  color: #fff;
}

.bg-accent {
  background-color: var(--luenendonk-accent) !important;
}

.text-primary {
  color: var(--luenendonk-primary) !important;
}

.text-accent {
  color: var(--luenendonk-accent) !important;
}

.text-muted {
  color: var(--luenendonk-text-muted) !important;
}

.text-white {
  color: #fff !important;
}

.text-dark {
  color: var(--midnight-900) !important;
}

/* ====================================
   RESPONSIVE TYPOGRAFIE
   ==================================== */

@media (max-width: 1023px) {

  :root {
    --h1-size: 48px;
    --h1-line-height: 54px;
    --h2-size: 36px;
    --h2-line-height: 42px;
    --h3-size: 28px;
    --h3-line-height: 34px;
  }
}

@media (max-width: 767px) {

  :root {
    --h1-size: 36px;
    --h1-line-height: 42px;
    --h2-size: 28px;
    --h2-line-height: 34px;
    --h3-size: 24px;
    --h3-line-height: 30px;
    --h4-size: 20px;
    --h4-line-height: 26px;
  }
}

/* ====================================
   "VERTRAUT VON..." LABEL
   ==================================== */

.trusted-label,
.stk-block-text.trusted-label,
.stk-block-heading.trusted-label {
  font-size: 12px !important;
  color: var(--luenendonk-accent) !important;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

/* ====================================
   LOGO MARQUEE - TRUSTED BY SECTION
   ==================================== */

.logo-marquee {
  overflow: hidden;
  position: relative;
  padding: 40px 0;
  mask-image: linear-gradient(to right, transparent 0%, #000 10%, #000 90%, transparent 100%);
  -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 10%, #000 90%, transparent 100%);
}

.logo-marquee .logo-track {
  display: flex;
  flex-wrap: nowrap;
  gap: 64px;
  align-items: center;
  width: max-content;
  animation: marquee-scroll 60s linear infinite;
}

@keyframes marquee-scroll {

  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(-50%);
  }
}

.logo-marquee .logo-track img {
  height: 32px;
  width: auto;
  opacity: 0.6;
  filter: brightness(0) invert(1);
  flex-shrink: 0;
  transition: opacity 0.3s ease;
}

@media (hover: hover) {

  .logo-marquee .logo-track img:hover {
    opacity: 1;
  }

  .logo-marquee:hover .logo-track {
    animation-play-state: paused;
  }
}

.logo-marquee .logo-placeholder {
  color: rgba(255, 255, 255, 0.6);
  font-size: 18px;
  font-weight: 400;
  white-space: nowrap;
  flex-shrink: 0;
}

@media (prefers-reduced-motion: reduce) {

  .logo-marquee .logo-track {
    animation: none;
  }
}

@media (max-width: 1023px) {

  .logo-marquee .logo-track {
    gap: 48px;
    animation-duration: 40s;
  }

  .logo-marquee .logo-track img {
    height: 28px;
  }
}

@media (max-width: 767px) {

  .logo-marquee {
    padding: 24px 0;
  }

  .logo-marquee .logo-track {
    gap: 32px;
    animation-duration: 35s;
  }

  .logo-marquee .logo-track img {
    height: 24px;
  }

  .logo-marquee .logo-placeholder {
    font-size: 14px;
  }
}

/* ====================================
   LOGO GRID
   ==================================== */

/* Zellen gleichmäßig verteilen */
.logo-grid-row .stk-block-column {
  flex: 1 1 0% !important;
}

/* Wrapper = die sichtbare weiße Zelle */
.logo-grid-row .stk-column-wrapper {
  width: 100% !important;
  margin: 0 !important;
  min-height: 220px !important;
  padding: 32px !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: center !important;
  background: #fff !important;
  border: 1px solid var(--luenendonk-border) !important;
  box-sizing: border-box !important;
}

/* Logos einheitlich */
.logo-grid-row .stk-img {
  max-width: 140px;
  max-height: 50px;
  width: auto !important;
  height: auto !important;
  object-fit: contain;
}

/* ====================================
   MARKTKOMPETENZ SEKTION
   ==================================== */

.marktkompetenz-sektion .stk-column-wrapper {
  margin: 0 !important;
}

/* Link-Items: Zeile mit Separator */
.marktkompetenz-sektion .expertise-link-item {
  border-bottom: 1px solid var(--luenendonk-separator) !important;
  margin-bottom: 0 !important;
  margin-top: 0 !important;
  padding: 0 !important;
}

.marktkompetenz-sektion .expertise-link-item:first-child {
  border-top: 1px solid var(--luenendonk-separator) !important;
}

.marktkompetenz-sektion .expertise-link-item:last-child {
  border-bottom: none !important;
}

/* Button-Group + Wrapper: volle Breite */
.marktkompetenz-sektion .expertise-link-item .stk-button-group {
  width: 100% !important;
  gap: 0 !important;
}

.marktkompetenz-sektion .expertise-link-item .stk-block-button {
  width: 100% !important;
  flex: 1 !important;
}

/* Das <a> Element */
.marktkompetenz-sektion .expertise-link-item .stk-button {
  display: flex !important;
  flex-wrap: nowrap !important;
  justify-content: space-between !important;
  align-items: center !important;
  width: 100% !important;
  padding: 20px 0 !important;
  font-size: 16px !important;
  line-height: 26px !important;
  font-weight: 400 !important;
  color: var(--luenendonk-dark) !important;
  text-decoration: none !important;
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  min-height: unset !important;
  box-shadow: none !important;
  transition: color 0.3s ease;
}

/* Strich VOR dem Text (::before) */
.marktkompetenz-sektion .expertise-link-item .stk-button::before {
  content: "";
  display: block;
  width: 0;
  height: 1px;
  background: var(--luenendonk-separator);
  flex-shrink: 0;
  margin-right: 0;
  transition: width 0.4s cubic-bezier(0.25, 0.1, 0.25, 1), margin-right 0.4s cubic-bezier(0.25, 0.1, 0.25, 1);
}

/* Pfeil NACH dem Text (::after) */
.marktkompetenz-sektion .expertise-link-item .stk-button::after {
  content: "";
  display: block;
  width: 28px;
  height: 28px;
  flex-shrink: 0;
  margin-left: 16px;
  background-image: var(--icon-arrow-right);
  background-repeat: no-repeat;
  background-size: 28px 28px;
  transition: transform 0.4s cubic-bezier(0.25, 0.1, 0.25, 1);
}

/* Text-Span volle Breite linksbündig */
.marktkompetenz-sektion .expertise-link-item .stk-button__inner-text {
  flex: 1 !important;
  text-align: left !important;
}

/* === HOVER STATE === */
.marktkompetenz-sektion .expertise-link-item .stk-button:hover {
  color: var(--luenendonk-dark) !important;
  background: none !important;
  box-shadow: none !important;
}

.marktkompetenz-sektion .expertise-link-item .stk-button:hover::before {
  width: 12px;
  margin-right: 8px;
}

.marktkompetenz-sektion .expertise-link-item .stk-button:hover::after {
  transform: translateX(2px);
}

/* ====================================
   NEWS & INSIGHTS SECTION
   ==================================== */

/* Header Wrapper Resets */
.news-header .stk-block-column:first-child > .stk-column-wrapper {
  margin: 0 !important;
}

.news-header .stk-block-column:last-child > .stk-column-wrapper {
  margin: 0 !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
}

.news-header .stk-block-column:last-child .stk-inner-blocks {
  align-items: flex-end !important;
}

/* Link-Button mit Kreis-Pfeil (shared: News + Leistungen) */
.news-header .stk-block-button a.stk-button,
.leistungen-header .stk-block-button-group .stk-button {
  display: inline-flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 0 !important;
  background: transparent !important;
  color: var(--luenendonk-dark) !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  text-decoration: none !important;
}

.news-header .stk-block-button a.stk-button::after,
.leistungen-header .stk-block-button-group .stk-button::after {
  content: "";
  display: inline-block;
  width: 38px;
  height: 38px;
  flex-shrink: 0;
  background-image: var(--icon-circle-arrow);
  background-size: contain;
  background-repeat: no-repeat;
}

.news-header .stk-block-button .stk--svg-wrapper,
.leistungen-header .stk-block-button-group .stk--svg-wrapper {
  display: none;
}

/* NEWS CARD LINK — Underline text link for news cards */
.news-card-link .stk-button {
  text-decoration: underline !important;
  text-underline-offset: 4px !important;
}

/* --- Posts Grid --- */

/* Cards Container: Gap 32px (Figma!) */
.news-posts-grid .stk-block-posts__items,
.news-posts-grid [class*="items"] {
  gap: 32px !important;
}

/* Einzelne Card */
.news-posts-grid article,
.news-posts-grid .stk-block-posts__item {
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  padding: 0 0 28px 0 !important;
}

/* Featured Image: H ~278px */
.news-posts-grid .stk-img-wrapper,
.news-posts-grid [class*="featured-image"] {
  border-radius: 0 !important;
  margin-bottom: 20px !important;
  overflow: hidden;
}

.news-posts-grid .stk-img-wrapper img,
.news-posts-grid [class*="featured-image"] img {
  border-radius: 0 !important;
  width: 100% !important;
  height: 278px !important;
  object-fit: cover !important;
}

/* Post Title: Xlarge Style, pb 16px */
.news-posts-grid [class*="title"] h3,
.news-posts-grid .stk-block-posts__title,
.news-posts-grid h3 {
  font-family: Inter, sans-serif !important;
  font-size: 22px !important;
  line-height: 33px !important;
  font-weight: 400 !important;
  color: var(--luenendonk-dark) !important;
  margin-top: 0 !important;
  margin-bottom: 16px !important;
}

/* "Weiterlesen" Link (Midnight Blue/500) */
.news-posts-grid .stk-block-posts__readmore,
.news-posts-grid a[class*="readmore"],
.news-posts-grid [class*="read_more"] a {
  font-family: Inter, sans-serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  color: #036 !important;
  text-decoration: underline !important;
  text-underline-offset: 4px !important;
}

.news-posts-grid .stk-block-posts__readmore:hover,
.news-posts-grid a[class*="readmore"]:hover,
.news-posts-grid [class*="read_more"] a:hover {
  color: #002a55 !important;
}

/* Meta, Category, Excerpt ausblenden */
.news-posts-grid .stk-block-posts__meta,
.news-posts-grid [class*="__meta"],
.news-posts-grid [class*="__category"],
.news-posts-grid [class*="__excerpt"] {
  display: none !important;
}

/* News Posts: Title Link-Farbe fix */
.news-posts-grid .stk-block-posts__title a {
  color: var(--luenendonk-dark) !important;
  text-decoration: none !important;
}

.news-posts-grid .stk-block-posts__title a:hover {
  color: var(--luenendonk-primary) !important;
}

/* Plugin Shortcode: kein Extra-Margin */
.lue-fc {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* =============================================
   TEAM SECTION — Ihre Ansprechpartner
   ============================================= */

/* Outer Section: kein eigener Wrapper-Background nötig */
.team-section > .stk-column-wrapper {
  background: transparent !important;
}

/* ── CARD WRAPPER ── */

/* ── TEAM ROW GAP ── */
.team-row .stk-inner-blocks {
  gap: 16px !important;
}

.team-card .stk-column-wrapper {
  margin: 0 !important;
  padding: 0 0 16px 0 !important;
  position: relative !important;
}


/* ── FOTO ── */
.team-card .stk-block-image {
  position: relative;
  z-index: 3;
  width: 100% !important;
}

.team-card .stk-block-image img {
  width: 100% !important;
  height: 300px !important;
  object-fit: cover !important;
  object-position: top center !important;
  display: block !important;
}

/* ── NAME & BESCHREIBUNG ── */
.team-card .stk-block-text {
  padding: 0 16px !important;
  position: relative;
  z-index: 3;
}

/* ====================================
   LEISTUNGEN SECTION — Märkte-Unterseiten
   (Digital&IT, Business Consulting, etc.)

   KORRIGIERT: Volle Breite auf gesamte
   Element-Kette erzwingen
   ==================================== */

/* Kreis-Pfeil Button → siehe shared Selektor in News Section */

/* ── 2. RESEARCH / CONSULTING: Label + Linie ──
   Volle Breite erzwingen auf Text-Block */

.leistungen-lists .expertise-meta-with-line {
  width: 100% !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 16px !important;
  padding-bottom: 0 !important;
}

.leistungen-lists .expertise-meta-with-line .stk-block-text__text {
  flex-shrink: 0 !important;
}

.leistungen-lists .expertise-meta-with-line::after {
  content: "";
  display: block;
  flex: 1;
  height: 1px;
  background-color: var(--luenendonk-separator);
}

/* ── 3. Expertise Link Items ──
   KERN-FIX: Gesamte Kette auf width:100% */

/* Ebene 1: Button-Group Block (äußerster Wrapper) */
.leistungen-lists .stk-block-button-group {
  width: 100% !important;
}

/* Ebene 2: Flex-Row im Button-Group */
.leistungen-lists .stk-block-button-group > .stk-button-group,
.leistungen-lists .stk-block-button-group > .stk-row {
  width: 100% !important;
  display: flex !important;
  flex-wrap: nowrap !important;
}

/* Ebene 3: Button-Block (.expertise-link-item) */
.leistungen-lists .expertise-link-item {
  width: 100% !important;
  flex: 1 1 100% !important;
  border-top: 1px solid var(--luenendonk-border) !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Ebene 4: Das <a> Element = volle Breite + space-between */
.leistungen-lists .expertise-link-item .stk-button {
  display: flex !important;
  flex-wrap: nowrap !important;
  justify-content: space-between !important;
  align-items: center !important;
  width: 100% !important;
  padding: 20px 0 !important;
  text-decoration: none !important;
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  min-height: unset !important;
  box-shadow: none !important;
  transition: color 0.3s ease;
}

/* Ebene 5: Text-Span = flex:1 linksbündig */
.leistungen-lists .expertise-link-item .stk-button__inner-text {
  flex: 1 1 auto !important;
  text-align: left !important;
}

/* SVG-Pfeil rechts via ::after */
.leistungen-lists .expertise-link-item .stk-button::after {
  content: "";
  display: block;
  width: 28px;
  height: 28px;
  flex-shrink: 0;
  margin-left: 16px;
  background-image: var(--icon-arrow-right);
  background-repeat: no-repeat;
  background-size: 28px 28px;
  transition: transform 0.4s cubic-bezier(0.25, 0.1, 0.25, 1);
}

/* Hover */
.leistungen-lists .expertise-link-item .stk-button:hover {
  background: none !important;
  box-shadow: none !important;
}

.leistungen-lists .expertise-link-item .stk-button:hover::after {
  transform: translateX(3px);
}

/* ── 4. Responsive ── */

@media (max-width: 767px) {

  .leistungen-lists .expertise-link-item .stk-button::after {
    width: 24px;
    height: 24px;
    background-size: 24px 24px;
  }
}

/* ===================== THEMENSCHWERPUNKTE ===================== */

/* Linke Spalte: Inhalt vertikal zentrieren */
.dit-themen-header .stk-dith-hl1-inner-blocks {
  justify-content: center !important;
  flex: 1 !important;
}

/* ====================================
   MARKT-HERO: Wiederverwendbar für alle Marktseiten
   (Digital&IT, Business Consulting, Audit&Tax, etc.)
   Bild-Spalte geht bis zum rechten Viewport-Rand.
   ==================================== */

/* Section: Kein rechtes Padding, Overflow clippen
   Doppel-Klasse (.stk-block-columns.markt-hero) für Spezifität 0,2,0
   → schlägt Stackable inline <style> (.stk-dit-hero1) mit 0,1,0 */
.stk-block-columns.markt-hero {
  padding-left: 0 !important;
  padding-right: 0 !important;
  overflow: clip !important;
}

.markt-hero,
.markt-hero > .stk-row {
  align-items: stretch !important;
}

/* Row: max-width entfernen,
   padding-left simuliert das alte Centering */
.markt-hero > .stk-row {
  max-width: none !important;
  padding-left: max(80px, calc(50% - 696px)) !important;
  gap: 0 !important;
}

/* Spalten: Doppel-Klasse für Spezifität über Stackable inline <style>
   .markt-hero .markt-hero-l = 0,2,0 → schlägt .stk-dit-hero-l = 0,1,0 */
@media screen and (min-width: 768px) {

  .markt-hero .markt-hero-l {
    flex: 0 0 520px !important;
    max-width: 520px !important;
  }

  .markt-hero .markt-hero-r {
    flex: 1 1 0% !important;
  }
}

.markt-hero-l .stk-inner-blocks {
  justify-content: center !important;
}

.markt-hero-l .stk-button-group {
  justify-content: flex-start !important;
}

/* Right column: Negative Margins für Bleed,
   Bild deckt volle Hero-Höhe ab */
.stk-block-column.markt-hero-r {
  margin: -200px 0 -200px 0 !important;
}

/* Modifier: crop only bottom (e.g. person photos) */
.markt-hero--crop-bottom .markt-hero-r.stk-block-column {
  margin: -80px 0 -320px 0 !important;
}

.markt-hero .markt-hero-r {
  min-height: 0 !important;
  overflow: hidden !important;
}

.markt-hero-r .stk-column-wrapper {
  margin: 0 !important;
  min-height: 0 !important;
}

.markt-hero-r .stk-column-wrapper,
.markt-hero-r .stk-inner-blocks,
.markt-hero-r .stk-block-image,
.markt-hero-r .stk-img-wrapper {
  height: 100% !important;
}

.markt-hero-r .stk-inner-blocks {
  min-height: 0 !important;
}

/* Figure absolut: füllt Container */
.markt-hero-r .stk-block-image {
  position: relative !important;
  min-height: 0 !important;
}

.markt-hero-r figure {
  position: absolute !important;
  inset: 0 !important;
  height: auto !important;
}

.markt-hero-r img {
  height: 100% !important;
  width: 100% !important;
  object-fit: cover !important;
  object-position: 50% 0% !important;
}

/* ===========================================
   TESTIMONIAL SECTION — dit-testi2
   Blockquote-Layout + Circle Nav Buttons
   =========================================== */

/* Column-Wrapper als Positionier-Kontext */
.dit-bq-wrap .stk-column-wrapper {
  position: relative !important;
}

/* Icon absolut links positionieren */
.stk-dit-testi2 .dit-bq-icon {
  position: absolute !important;
  left: 0 !important;
  top: 60px !important;
  z-index: 1 !important;
  width: 24px !important;
}

/* Text-Blöcke: 64px Blockquote-Indent */
.stk-dit-testi2 .stk-tq-quote,
.stk-dit-testi2 .stk-tq-name,
.stk-dit-testi2 .stk-tq-title {
  margin-left: 64px !important;
}

/* Button-Group KEIN Indent (zentriert bleiben) */
.stk-dit-testi2 .stk-tq-nav {
  margin-left: 0 !important;
}

/* Nav-Buttons: 40×40 Circle mit Border */
.stk-dit-testi2 .stk-tq-prev a,
.stk-dit-testi2 .stk-tq-next a {
  min-width: 40px !important;
  min-height: 40px !important;
  width: 40px !important;
  height: 40px !important;
  display: inline-flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  border: 1px solid var(--luenendonk-border) !important;
  background-color: #fff !important;
  color: var(--luenendonk-dark) !important;
  font-size: 18px !important;
  padding: 0 !important;
}

.stk-dit-testi2 .stk-tq-prev a:hover,
.stk-dit-testi2 .stk-tq-next a:hover {
  border-color: var(--luenendonk-border-hover) !important;
}

/* KONTAKT SECTION — Split Background + Text-Overlay
   Pattern: Bild füllt gesamte linke Spalte, Text überlagert unten
   ========================================== */

/* Split: Links dunkel edge-to-edge, rechts weiß + overflow clip */
.kontakt-section {
  background: linear-gradient(to right, var(--luenendonk-dark) 50%, #fff 50%) !important;
  overflow: clip !important;
}

/* Row: Min-Height bis Zoho-Form eingefügt wird (Figma: 1353px) */
.kontakt-section > .stk-row {
  min-height: 1353px !important;
  align-items: stretch !important;
}

/* Stackable Wrapper-Margins Reset */
.kontakt-section .stk-column .stk-column-wrapper {
  margin: 0 !important;
}

/* === Linke Spalte: Text-Overlay auf Bild === */

/* Wrapper: flex-column damit inner-blocks volle Höhe bekommt */
.kontakt-section .stk-column:first-child .stk-column-wrapper {
  display: flex !important;
  flex-direction: column !important;
}

/* Inner-Blocks: Positionierungs-Kontext, Text am unteren Rand */
.kontakt-section .stk-column:first-child .stk-inner-blocks {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-end !important;
  gap: 16px !important;
  flex: 1 1 0% !important;
  min-height: 0 !important;
}

/* Bild: füllt gesamten Inner-Bereich als Hintergrund (absolute) */
.kontakt-section .stk-column:first-child .stk-block-image {
  position: absolute !important;
  inset: 0 !important;
  overflow: hidden !important;
  z-index: 0 !important;
  margin: 0 !important;
  --stk-block-margin-bottom: 0;
  flex: 1 1 auto;
  min-height: 0;
}

/* Figure: füllt Image-Block */
.kontakt-section .stk-column:first-child figure {
  position: absolute !important;
  inset: 0 !important;
  margin: 0 !important;
}

.kontakt-section .stk-column:first-child .stk-img-wrapper {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  overflow: hidden !important;
}

.kontakt-section .stk-column:first-child img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: top center !important;
}

/* Text-Blöcke: über dem Bild, am unteren Rand */
.kontakt-section .stk-column:first-child .stk-block-text,
.kontakt-section .stk-column:first-child .stk-block-heading {
  position: relative !important;
  z-index: 2 !important;
  margin: 0 !important;
}

/* Fix 1: Heading → Form Gap = 80px (Figma column gap) */
.kontakt-section .stk-column:last-child .stk-block-heading {
  margin-bottom: 80px !important;
  --stk-block-margin-bottom: 80px;
}

/* ============================================================
   Lünendonk Zoho Form – CI-konformes Styling
   Stand: 2026-02-21
   ============================================================ */

/* --- Form Container --- */
.zf-templateWidth {
  margin: 0 auto;
  padding: 0;
  max-width: 100%;
  width: 100%;
  box-sizing: border-box;
}

.zf-templateWrapper {
  background: transparent;
  box-shadow: none;
  border-radius: 0;
}

/* Header hidden – Titel kommt aus Stackable */
.zf-tempHeadBdr {
  display: none;
}

/* --- Container — Figma: 16px Gap zwischen allen Feldern --- */
.zf-subContWrap {
  padding: 0;
}

.zf-subContWrap > ul {
  display: flex;
  flex-direction: column;
  gap: 16px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.zf-tempFrmWrapper {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

.zf-tempFrmWrapper .zf-tempContDiv {
  margin: 0;
  padding: 0;
}

/* --- Labels --- */

/* Figma: Nur "Ich interessiere mich für:" hat ein sichtbares Label.
   Alle anderen Felder nutzen Placeholder-Text im Input. */
.zf-tempFrmWrapper .zf-labelName {
  font-family: Inter, sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  color: var(--luenendonk-dark);
  display: none;
  padding-bottom: 8px;
}

/* Nur Checkbox-Label + Datenschutz-Label sichtbar */
.kontakt-section .zf-checkbox > .zf-labelName,
.kontakt-section .zf-decesion .zf-labelName,
.newsletter-section .zf-checkbox > .zf-labelName,
.newsletter-section .zf-decesion .zf-labelName {
  display: block;
}

/* Checkbox group label — Figma: 22px/33px */
.kontakt-section .zf-tempFrmWrapper:has(.zf-overflow) > .zf-labelName,
.newsletter-section .zf-tempFrmWrapper:has(.zf-overflow) > .zf-labelName {
  font-size: 22px;
  line-height: 33px;
}

/* Sub-Labels (Vorname, Nachname etc.) — Figma: nicht sichtbar */
.zf-name .zf-tempContDiv span label,
.zf-phone .zf-tempContDiv span label,
.zf-address .zf-tempContDiv span label {
  display: none;
}

/* --- Inputs & Textarea --- */
.zf-tempContDiv input[type="text"],
.zf-tempContDiv input[type="email"],
.zf-tempContDiv textarea {
  background: #fff;
  border: 1px solid var(--luenendonk-border);
  border-radius: 0;
  padding: 16px;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 26px;
  color: var(--luenendonk-dark);
  height: 56px;
  width: 100%;
  box-sizing: border-box;
  transition: border-color 0.2s ease;
  outline: none;
}

.zf-tempContDiv input[type="text"]::placeholder,
.zf-tempContDiv input[type="email"]::placeholder,
.zf-tempContDiv textarea::placeholder {
  color: var(--luenendonk-dark);
  opacity: 0.4;
}

.zf-tempContDiv input[type="text"]:hover,
.zf-tempContDiv input[type="email"]:hover,
.zf-tempContDiv textarea:hover {
  border-color: var(--luenendonk-dark);
}

.zf-tempContDiv input[type="text"]:focus,
.zf-tempContDiv input[type="email"]:focus,
.zf-tempContDiv textarea:focus {
  border-color: var(--luenendonk-primary);
  box-shadow: none;
}

/* Textarea */
.zf-tempContDiv textarea {
  min-height: 160px;
  height: 160px;
  resize: vertical;
  line-height: 26px;
}

/* --- Select (Dropdown) --- */
.zf-form-sBox {
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: var(--luenendonk-dark);
  background: #fff;
  border: 1px solid var(--luenendonk-border);
  border-radius: 0;
  height: 56px;
  padding: 16px;
  transition: border-color 0.2s ease;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: var(--icon-chevron-down);
  background-repeat: no-repeat;
  background-position: right 16px center;
  padding-right: 40px;
  outline: none;
}

.zf-form-sBox:hover {
  border-color: var(--luenendonk-dark);
}

.zf-form-sBox:focus {
  border-color: var(--luenendonk-primary);
  box-shadow: none;
}

/* --- Name Field Layout — Figma: 3 separate volle Zeilen --- */
.zf-name .zf-nameWrapper {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.zf-name .zf-nameWrapper > span {
  float: none;
  display: block;
  width: 100% !important;
  margin-left: 0;
}

.zf-name .zf-tempContDiv input[type="text"],
.zf-name .zf-tempContDiv select {
  width: 100%;
}

/* --- Checkbox Group --- */
.zf-overflow {
  overflow: hidden;
}

.zf-multiAttType {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
  padding: 0 0 16px 0;
}

/* --- Checkbox Base (shared: Checkbox-Gruppe + Datenschutz) --- */
.zf-checkBoxType,
.zf-decesion input[type="checkbox"] {
  width: 20px;
  height: 20px;
  min-width: 20px;
  margin: 0;
  padding: 0;
  border: 1px solid var(--luenendonk-border);
  border-radius: 4px;
  -webkit-appearance: none;
  appearance: none;
  background: #fff;
  cursor: pointer;
  position: relative;
}

.zf-checkBoxType:checked,
.zf-decesion input[type="checkbox"]:checked {
  background: var(--luenendonk-primary-button);
  border-color: var(--luenendonk-primary-button);
}

.zf-checkBoxType:checked::after,
.zf-decesion input[type="checkbox"]:checked::after {
  content: "";
  position: absolute;
  left: 6px;
  top: 2px;
  width: 5px;
  height: 10px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

.zf-checkChoice {
  font-family: Inter, sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  color: var(--luenendonk-dark);
  padding-left: 0;
  vertical-align: middle;
  cursor: pointer;
}

/* --- Decision Box (Datenschutz) — nur Abweichungen --- */
.zf-decesion .zf-tempContDiv {
  width: 100% !important;
  margin-top: 8px;
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  gap: 8px;
}

.zf-decesion input[type="checkbox"] {
  display: block;
  margin: 3px 0 0 0;
  float: none;
}

.zf-decesion label {
  display: block;
  margin: 0 !important;
  padding: 0 !important;
  width: auto !important;
  float: none !important;
  font-family: Inter, sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  color: var(--luenendonk-dark);
}

.zf-decesion label a {
  color: var(--luenendonk-primary);
  text-decoration: none;
}

.zf-decesion label a:hover {
  text-decoration: underline;
}

/* --- Required Asterisk --- */
.zf-important {
  color: var(--luenendonk-error) !important;
  padding: 0;
  font-size: 16px !important;
  margin-left: 2px;
  font-weight: 400;
  font-style: normal;
}

/* --- Error Messages --- */
.zf-errorMessage {
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 400;
  color: var(--luenendonk-error);
  padding-top: 8px;
  line-height: 22px;
}

/* --- Submit Button --- */
.zf-fmFooter {
  padding: 24px 0 0 0;
  list-style: none;
}

.zf-submitColor {
  font-family: Inter, sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 26px;
  color: #fff;
  background-color: var(--luenendonk-primary-button);
  border: none;
  border-radius: 0;
  padding: 12px 16px;
  min-height: 50px;
  cursor: pointer;
  transition: background-color 0.2s ease;
  display: inline-block;
  text-align: center;
}

.zf-submitColor:hover {
  background-color: var(--luenendonk-primary);
}

.zf-submitColor:active {
  background-color: var(--luenendonk-button-active);
}

.zf-submitColor:focus {
  outline: 2px solid var(--luenendonk-primary);
  outline-offset: 2px;
}

/* --- Note Text (Pflichtfeld-Hinweis, Einwilligung, Widerruf) --- */
.zf-note {
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 26px;
  color: var(--luenendonk-dark);
  margin: 0;
}

.zf-note a {
  color: var(--luenendonk-primary);
  text-decoration: underline;
}

.zf-note a:hover {
  text-decoration: none;
}

.zf-divider {
  border: none;
  border-top: 1px solid var(--luenendonk-border);
  margin: 16px 0;
}

/* --- Utility --- */
.zf-clearBoth {
  clear: both;
}

/* --- Responsive: Mobile --- */
@media screen and (max-width: 767px) {

  .zf-submitColor {
    width: 100%;
  }
}

/* --- Bewerbungsformular — Ergänzungen zum globalen Zoho-Styling --- */

/* Intro-Text: Figma 22px/33px */
.bewerbungsformular .bewerbung-intro {
  font-family: Inter, sans-serif;
  font-size: 22px;
  line-height: 33px;
  font-weight: 400;
  color: var(--luenendonk-dark);
  margin: 0 0 16px 0;
}

/* Datenschutz-Label sichtbar */
.bewerbungsformular .zf-decesion .zf-labelName {
  display: block;
}

/* File Upload: Label "Bewerbungsunterlagen *" sichtbar */
.bewerbungsformular .bewerbung-upload > .zf-labelName {
  display: block !important;
}

/* File Upload: nativen Input verstecken */
.bewerbungsformular .bewerbung-upload .zf-tempContDiv input[type="file"] {
  display: none;
}

/* File Upload: Container Flex */
.bewerbungsformular .bewerbung-upload .zf-tempContDiv {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

/* File Upload: Custom Button */
.bewerbungsformular .bewerbung-upload-btn {
  font-family: Inter, sans-serif;
  font-size: 16px;
  line-height: 26px;
  font-weight: 400;
  padding: 12px 16px;
  border: 1px solid var(--luenendonk-primary-button);
  color: var(--luenendonk-primary-button);
  background: transparent;
  border-radius: 0;
  cursor: pointer;
  transition: background-color 0.2s ease;
}

.bewerbungsformular .bewerbung-upload-btn:hover {
  background: rgba(0, 34, 207, 0.05);
}

/* File Upload: Dateiname-Label */
.bewerbungsformular .bewerbung-file-label {
  font-family: Inter, sans-serif;
  font-size: 16px;
  line-height: 26px;
  color: var(--luenendonk-dark);
}

/* Privacy Note */
.bewerbungsformular .bewerbung-privacy p {
  font-family: Inter, sans-serif;
  font-size: 16px;
  line-height: 26px;
  color: var(--luenendonk-dark);
  margin: 0;
}

.bewerbungsformular .bewerbung-privacy a {
  color: var(--luenendonk-primary);
  text-decoration: underline;
}

.bewerbungsformular .bewerbung-privacy a:hover {
  text-decoration: none;
}

/* ====================================
   BUTTON ICON ARROW (Text + Kreis-Pfeil)
   Wiederverwendbar: .btn-icon-arrow auf Stackable Button (is-style-link)
   ==================================== */
.btn-icon-arrow .stk-button {
  display: inline-flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 16px !important;
}

.btn-icon-arrow .stk-button::after {
  content: "" !important;
  display: inline-flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: center !important;
  width: 38px !important;
  height: 38px !important;
  border: 1px solid var(--luenendonk-border) !important;
  border-radius: 999px !important;
  background-color: #fff !important;
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 6l6 6-6 6' stroke='%23000811' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 24px 24px !important;
  flex-shrink: 0 !important;
  transition: border-color 0.2s ease !important;
}

.btn-icon-arrow .stk-button:hover::after {
  border-color: var(--luenendonk-border-hover) !important;
}

/* ====================================
   TESTIMONIAL CAROUSEL
   Editierbares Pattern: Stackable Text-Blöcke + Child-Theme JS
   ==================================== */

/* Slide visibility */
.testimonial-section .testi-slide {
  display: none !important;
  padding: 48px 64px !important;
}

.testimonial-section .testi-slide.active {
  display: flex !important;
  flex-wrap: nowrap !important;
}

/* Quote: italic + line-clamp 3 + hover expand */
.testimonial-section .testi-quote .stk-block-text__text {
  font-style: italic !important;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: all 0.3s ease;
  cursor: default;
}

.testimonial-section .testi-quote .stk-block-text__text:hover {
  -webkit-line-clamp: unset;
}

/* Nav buttons */
.testimonial-section .testi-nav {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  gap: 16px;
  margin-top: 16px;
}

.testimonial-section .testi-nav button {
  width: 40px;
  height: 40px;
  padding: 0;
  border: none;
  background: transparent;
  cursor: pointer;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
}

.testimonial-section .testi-nav button:hover circle {
  stroke: var(--luenendonk-border-hover);
}

/* Responsive */
@media screen and (max-width: 767px) {

  .testimonial-section .testi-slide {
    padding: 24px !important;
  }

  .testimonial-section .testi-quote .stk-block-text__text {
    font-size: 18px !important;
    line-height: 28px !important;
  }
}

/* ====================================
   THEMENSCHWERPUNKTE GRID (markt-themen Pattern)
   ==================================== */

.dit-theme-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 32px !important;
  width: 100% !important;
}

.dit-theme-card {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 32px !important;
  padding: 32px !important;
  background: var(--luenendonk-bg-light) !important;
  overflow: hidden !important;
}

.dit-theme-card img {
  width: 64px !important;
  height: 64px !important;
  flex-shrink: 0 !important;
  object-fit: contain !important;
}

.dit-theme-card span {
  font-family: Inter, sans-serif !important;
  font-size: 16px !important;
  line-height: 26px !important;
  font-weight: 400 !important;
  color: var(--luenendonk-dark) !important;
  flex: 1 1 0 !important;
}

@media screen and (max-width: 767px) {

  .dit-theme-grid {
    grid-template-columns: 1fr !important;
  }
}

@media screen and (min-width: 769px) and (max-width: 1023px) {

  .dit-theme-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* ====================================
   GRUENDE SECTION (Seite 676)
   ==================================== */

/* Stackable Column hasBackground Override:
   Background + Padding auf äußerem Element
   entfernen, nur innerer Container sichtbar. */
.gruende-section .stk-block-column.stk-block-background {
  background-color: transparent !important;
  padding: 0 !important;
}

/* ====================================
   KONTAKT SECTION (Markt Pattern)
   ==================================== */

/* Rechte Spalte: hasBackground Doppel-Kasten-Fix
   .stk-block-background erbt --stk-block-background-padding (24px).
   Wir wollen nur den inneren Container (80px padding). */
.kontakt-section .stk-block-column.stk-block-background {
  padding: 0 !important;
}

.kontakt-section .stk-column:first-child .stk-block-image .stk-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Responsive: Tablet — Padding reduzieren */
@media screen and (max-width: 1023px) {

  .kontakt-section .stk-column:first-child .stk-container {
    padding: 32px !important;
  }

  .kontakt-section .stk-column:last-child .stk-container {
    padding: 40px !important;
  }
}

/* Responsive: Mobile — Padding weiter reduzieren */
@media screen and (max-width: 767px) {

  .kontakt-section .stk-column:first-child .stk-container {
    padding: 24px !important;
  }

  .kontakt-section .stk-column:last-child .stk-container {
    padding: 24px !important;
  }
}

/* ====================================
   FACTS LIST — Stackable Rows mit Dividers
   ==================================== */

.facts-list > .facts-row {
  border-bottom: 1px solid var(--luenendonk-border) !important;
}

.facts-list > .facts-row:last-child {
  border-bottom: none !important;
}

.facts-list .stk-column-wrapper {
  margin: 0 !important;
}

/* ====================================
   LEISTUNG CARDS — Quote-Icon + Content
   (Pattern: leistung-gruende, leistung-analysen)
   ==================================== */

/* Card: Background + Padding */
.leistung-card > .stk-column-wrapper {
  background-color: var(--luenendonk-bg-light) !important;
  padding: 48px !important;
  margin: 0 !important;
}

/* Card: Horizontal inner layout (Icon | Content) */
.leistung-card > .stk-column-wrapper > .stk-inner-blocks {
  flex-direction: row !important;
  align-items: flex-start !important;
  gap: 32px !important;
}

/* Icon: Fixed size, no shrink */
.leistung-card .leistung-icon {
  flex-shrink: 0;
  width: 24px;
  line-height: 0;
}

/* Text/Group: Fill remaining space */
.leistung-card .stk-block-text,
.leistung-card .wp-block-group {
  flex: 1 1 0%;
  min-width: 0;
}

/* Analysen variant: Group = vertical stack with gap */
.leistung-card .wp-block-group {
  display: flex;
  flex-direction: column;
  gap: 32px;
}

/* Responsive: Mobile — Padding reduzieren */
@media screen and (max-width: 767px) {

  .leistung-card > .stk-column-wrapper {
    padding: 32px !important;
  }
}

/* ====================================
   PLAIN EXPERTISE LIST (Karriere Liste Pattern)
   Text-Einträge mit Divider-Linien
   ==================================== */

.expertise-plain-list .stk-block-text {
  padding: 20px 0 !important;
  border-bottom: 1px solid var(--luenendonk-border) !important;
  margin: 0 !important;
}

.expertise-plain-list .stk-block-text:last-child {
  border-bottom: none !important;
}

/* ====================================
   KARRIERE LINKS SECTION
   Arrow-up-right Icon statt Arrow-right
   ==================================== */

.karriere-links-section .expertise-link-item .stk-button::after {
  background-image: var(--icon-arrow-external) !important;
  background-repeat: no-repeat !important;
}

/* ====================================
   UNTERNEHMEN HISTORIE — Jahreskarten
   ==================================== */

/* Karte: weißer Hintergrund, Border, Padding */
.uh-card {
  background-color: #fff;
  border: 1px solid var(--luenendonk-border);
  padding: 48px;
}

/* Gap zwischen Karten via Adjacent Sibling */
.uh-card + .uh-card {
  margin-top: 16px;
}

/* ====================================
   AWARD HISTORIE — Accordion via wp:details
   ==================================== */

/* Details-Blöcke: Trennlinien */
.award-section .wp-block-details {
  border-top: 1px solid var(--luenendonk-border);
}

.award-section .wp-block-details:last-child {
  border-bottom: 1px solid var(--luenendonk-border);
}

/* Summary: Kategorie-Titel */
.award-section .wp-block-details summary {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  padding: 32px 0;
  cursor: pointer;
  list-style: none;
  font-family: Inter, sans-serif;
  font-size: 24px;
  line-height: 29px;
  font-weight: 400;
  color: var(--luenendonk-dark);
}

.award-section .wp-block-details summary::-webkit-details-marker {
  display: none;
}

/* Plus-Icon (geschlossen) */
.award-section .wp-block-details summary::after {
  content: "";
  display: block;
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  background-image: var(--icon-plus);
  background-repeat: no-repeat;
  background-size: 24px 24px;
  transition: transform 0.3s ease;
}

/* X-Icon (geöffnet) */
.award-section .wp-block-details[open] > summary::after {
  background-image: var(--icon-close);
  background-repeat: no-repeat;
}

/* Einträge innerhalb des Accordions */
.award-entry {
  display: flex;
  flex-wrap: nowrap;
  gap: 16px;
  align-items: flex-start;
  margin: 0 0 16px 0;
}

.award-entry:last-child {
  margin-bottom: 32px;
}

.award-entry .award-year {
  font-family: Inter, sans-serif;
  font-size: 18px;
  line-height: 27px;
  font-weight: 600;
  color: var(--luenendonk-dark);
  flex-shrink: 0;
}

.award-entry .award-name {
  font-family: Inter, sans-serif;
  font-size: 18px;
  line-height: 27px;
  font-weight: 600;
  color: var(--luenendonk-dark);
}

.award-entry .award-desc {
  font-family: Inter, sans-serif;
  font-size: 16px;
  line-height: 26px;
  font-weight: 400;
  color: var(--luenendonk-dark);
}

/* Responsive: Mobile */
@media screen and (max-width: 767px) {

  .award-section .wp-block-details summary {
    font-size: 20px;
    line-height: 26px;
    padding: 24px 0;
  }

  .award-entry .award-year {
    font-size: 16px;
    min-width: 40px;
  }
}

/* ====================================
   UTILITY: Column vertical centering
   ==================================== */

.col-v-center .stk-inner-blocks {
  justify-content: center !important;
}

/* ====================================
   PRODUKT ANALYST CALL CARDS
   ==================================== */

/* Cards container: 16px gap between cards */
.mca-cards > * + * {
  margin-top: var(--padding-xsmall);
}

/* Card container: white bg, border, padding, 32px gap */
.mca-card {
  background-color: #fff;
  border: 1px solid var(--luenendonk-border);
  padding: var(--padding-medium);
}

.wp-block-group.mca-card > * + * {
  margin-top: var(--padding-small);
}

/* Facts container: 8px gap between rows */
.mca-facts > * + * {
  margin-top: 8px;
}

/* Card meta label mit extending line (CONSULTING ---) */
.card-meta-line {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 16px !important;
  width: 100% !important;
}

.card-meta-line .stk-block-text__text {
  flex-shrink: 0 !important;
}

.card-meta-line::after {
  content: "";
  display: block;
  flex: 1;
  height: 1px;
  background-color: var(--luenendonk-separator);
}

/* Card Facts Row: Icon(24px) + Label(80px) + Value(flex) */
.card-facts-row .stk-row {
  align-items: center !important;
}

.card-facts-row .stk-row > .stk-block-column:first-child {
  flex: 0 0 24px !important;
  max-width: 24px !important;
}

.card-facts-row .stk-row > .stk-block-column:nth-child(2) {
  flex: 0 0 80px !important;
  max-width: 80px !important;
}

.card-facts-row .stk-row > .stk-block-column:last-child {
  flex: 1 1 0% !important;
}

.card-facts-row .stk-column-wrapper {
  margin: 0 !important;
}

/* ====================================
   STUDIE FAKTEN — Count-Up Rows
   ==================================== */

/* Number column: fixed 160px */
.studie-fakten-row .stk-row > .stk-block-column:first-child {
  flex: 0 0 160px !important;
  max-width: 160px !important;
}

/* Text column: fill remaining space */
.studie-fakten-row .stk-row > .stk-block-column:last-child {
  flex: 1 1 0% !important;
}

/* Column wrapper reset */
.studie-fakten-row .stk-column-wrapper {
  margin: 0 !important;
}

/* Count-up numbers styling (48px, dark — different from homepage 96px/white) */
.studie-fakten-row .count-up-number {
  font-family: Inter, sans-serif;
  font-weight: 400;
  font-size: 48px;
  line-height: 53px;
  color: var(--luenendonk-dark);
}

/* Responsive: Mobile — stack vertically */
@media screen and (max-width: 767px) {

  .studie-fakten-row .stk-row {
    flex-direction: column !important;
  }

  .studie-fakten-row .stk-row > .stk-block-column:first-child {
    flex: 0 0 auto !important;
    max-width: none !important;
  }

  .studie-fakten-row .count-up-number {
    font-size: 36px;
    line-height: 42px;
  }
}

/* ====================================
   PRODUKT CTA BANNER
   ==================================== */

/* Row: Spalten vertikal zentrieren */
.produkt-cta .stk-row {
  align-items: center !important;
}

/* Rechte Spalte: Button rechts ausrichten */
.produkt-cta .stk-block-column:last-child .stk-inner-blocks {
  align-items: flex-end !important;
}

/* ====================================
   STUDIE SLIDER — Bild-Carousel
   ==================================== */

.studie-slider-section {
  padding: 80px 64px 64px;
  background: #fff;
}

.studie-slider {
  max-width: 1312px;
  margin: 0 auto;
}

.studie-slider__viewport {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 16px;
}

.studie-slider__nav {
  flex-shrink: 0;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  line-height: 0;
}

.studie-slider__nav:hover circle {
  stroke: rgba(0, 8, 17, 0.3);
  transition: stroke 0.2s;
}

.studie-slider__track-wrap {
  flex: 1 1 0%;
  overflow: hidden;
}

.studie-slider__track {
  display: flex;
  flex-wrap: nowrap;
  gap: 10px;
  transition: transform 0.4s ease;
}

.studie-slider__slide {
  flex: 0 0 283px;
  height: 400px;
  background: var(--luenendonk-bg-light);
  overflow: hidden;
}

.studie-slider__slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.studie-slider__dots {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px;
  margin-top: 64px;
}

.studie-slider__dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: none;
  background: rgba(0, 8, 17, 0.15);
  cursor: pointer;
  padding: 0;
  transition: background 0.2s;
}

.studie-slider__dot.active {
  background: var(--cobalt-500);
}

/* --- Download-Button --- */

.studie-slider__download-wrap {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  margin-top: 48px;
}

.studie-slider__download {
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
  padding: 12px 28px;
  background: #fff;
  color: var(--luenendonk-primary-button);
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 26px;
  border-radius: 40px;
  text-decoration: none;
  transition: background 0.2s, box-shadow 0.2s;
}

.studie-slider__download:hover {
  background: #f0f3f6;
  box-shadow: 0 2px 8px rgba(0, 8, 17, 0.1);
  color: var(--luenendonk-primary-button);
}

/* --- Lightbox Overlay --- */

.studie-lightbox {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}

.studie-lightbox.active {
  opacity: 1;
  pointer-events: auto;
}

.studie-lightbox__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 8, 17, 0.9);
}

.studie-lightbox__img {
  position: relative;
  max-width: 80vw;
  max-height: 85vh;
  object-fit: contain;
  border-radius: 4px;
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.4);
}

.studie-lightbox__close {
  position: absolute;
  top: 24px;
  right: 24px;
  z-index: 1;
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
  line-height: 0;
  opacity: 0.8;
  transition: opacity 0.2s;
}

.studie-lightbox__close:hover {
  opacity: 1;
}

.studie-lightbox__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  line-height: 0;
  opacity: 0.8;
  transition: opacity 0.2s;
}

.studie-lightbox__nav:hover {
  opacity: 1;
}

.studie-lightbox__nav--prev {
  left: 24px;
}

.studie-lightbox__nav--next {
  right: 24px;
}

/* Responsive: Tablet */
@media screen and (max-width: 1023px) {

  .studie-slider-section {
    padding: 48px 32px 48px;
  }

  .studie-slider__slide {
    flex: 0 0 220px;
    height: 311px;
  }

  .studie-lightbox__img {
    max-width: 90vw;
  }
}

/* Responsive: Mobile */
@media screen and (max-width: 767px) {

  .studie-slider-section {
    padding: 32px 16px 32px;
  }

  .studie-slider__slide {
    flex: 0 0 180px;
    height: 254px;
  }

  .studie-slider__dots {
    margin-top: 32px;
  }

  .studie-slider__download-wrap {
    margin-top: 32px;
  }

  .studie-lightbox__nav--prev {
    left: 8px;
  }

  .studie-lightbox__nav--next {
    right: 8px;
  }

  .studie-lightbox__img {
    max-width: 95vw;
  }
}

/* ====================================
   WOOCOMMERCE — BREADCRUMB (Figma CI)
   ==================================== */

.single-product .ct-breadcrumbs {
  text-transform: none !important;
  font-size: 12px !important;
  line-height: 19px !important;
  font-weight: 400 !important;
  color: var(--midnight-900, #012) !important;
  padding-top: 32px !important;
  padding-bottom: 0 !important;
  padding-left: 64px !important;
  padding-right: 64px !important;
  max-width: 1312px !important;
  margin: 0 auto !important;
}

.single-product .ct-breadcrumbs a,
.single-product .ct-breadcrumbs span {
  text-transform: none !important;
  font-size: 12px !important;
  line-height: 19px !important;
  font-weight: 400 !important;
  color: var(--midnight-900, #012) !important;
}

/* ====================================
   WOOCOMMERCE — SINGLE PRODUCT (Figma CI)
   ==================================== */

/* --- Layout Container: max-width 1312px, top-aligned --- */
.single-product .product-entry-wrapper {
  max-width: 1312px !important;
  margin: 0 auto !important;
  padding: 0 64px !important;
  gap: 64px !important;
  align-items: flex-start !important;
}

/* --- Gallery: 50%, natürliches Seitenverhältnis --- */
.single-product .product-entry-wrapper > .woocommerce-product-gallery {
  flex: 1 1 0% !important;
  max-width: 50% !important;
}

.single-product .ct-media-container img {
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
}

.single-product .summary.entry-summary {
  flex: 1 1 0% !important;
}

/* --- Section Padding --- */
.single-product div.product {
  padding-top: 80px;
  padding-bottom: 64px;
}

/* --- Titel (H1) --- */
.single-product .product_title {
  font-size: 48px !important;
  line-height: 53px !important;
  font-weight: 400 !important;
  color: var(--midnight-900, #012) !important;
  margin-bottom: 24px !important;
}

/* --- Beschreibung (Short Description) --- */
.single-product .woocommerce-product-details__short-description,
.single-product .woocommerce-product-details__short-description p {
  font-size: 22px !important;
  line-height: 33px !important;
  color: var(--midnight-900, #012) !important;
}

/* --- Preis --- */
.single-product p.price,
.single-product p.price .woocommerce-Price-amount {
  font-size: 32px !important;
  line-height: 38px !important;
  font-weight: 600 !important;
  color: var(--midnight-900, #012) !important;
}

.single-product p.price {
  margin-bottom: 10px !important;
}

/* --- MwSt / Tax Info --- */
.single-product .legal-price-info {
  margin-bottom: 24px !important;
}

.single-product .wc-gzd-additional-info {
  font-size: 12px;
  line-height: 19px;
  color: var(--midnight-900, #012);
}

/* --- Add-to-Cart Button --- */
.single-product .ct-cart-actions {
  justify-content: flex-start !important;
}

.single-product .single_add_to_cart_button {
  background-color: var(--cobalt-700, #0022cf) !important;
  font-size: 16px !important;
  line-height: 26px !important;
  font-weight: 400 !important;
  padding: 12px 16px !important;
  border-radius: 0 !important;
  width: fit-content !important;
  flex: 0 0 auto !important;
}

.single-product .single_add_to_cart_button:hover {
  background-color: var(--cobalt-800, #001478) !important;
}

/* --- Kategorie/Tag Meta ausblenden --- */
.single-product .product_meta {
  display: none !important;
}

/* --- Blocksy Divider-Linien ausblenden --- */
.single-product .ct-product-divider {
  display: none !important;
}

/* --- Fakten-Attribute-Tabelle --- */
.single-product .woocommerce-product-attributes {
  border: none;
  border-collapse: collapse;
  width: 100%;
  margin-bottom: 24px;
}

.single-product .woocommerce-product-attributes tr {
  border-bottom: 1px solid var(--luenendonk-border);
}

.single-product .woocommerce-product-attributes tr:first-child {
  border-top: 1px solid var(--luenendonk-border);
}

.single-product .woocommerce-product-attributes th,
.single-product .woocommerce-product-attributes td {
  padding: 20px 0;
  font-size: 18px;
  line-height: 27px;
  color: var(--midnight-900, #012);
  background: transparent !important;
  background-color: transparent !important;
  border: none;
  vertical-align: top;
}

.single-product .woocommerce-product-attributes th {
  font-weight: 600;
  width: 33%;
}

.single-product .woocommerce-product-attributes td {
  font-weight: 400;
}

.single-product .woocommerce-product-attributes td p {
  margin: 0;
}

/* Zebra-Striping entfernen (tr + th/td) */
.single-product .woocommerce-product-attributes tr,
.single-product .woocommerce-product-attributes tr:nth-child(even),
.single-product .woocommerce-product-attributes tr:nth-child(odd),
.single-product .woocommerce-product-attributes tr:nth-child(even) th,
.single-product .woocommerce-product-attributes tr:nth-child(even) td,
.single-product .woocommerce-product-attributes tr:nth-child(odd) th,
.single-product .woocommerce-product-attributes tr:nth-child(odd) td {
  background: transparent !important;
  background-color: transparent !important;
}

/* --- Meta-Label (Kategorie) über Titel --- */
.single-product .product-meta-label {
  font-size: 12px;
  line-height: 19px;
  font-weight: 400;
  color: var(--cobalt-500, #0029f9);
  text-transform: uppercase;
  margin-bottom: 8px;
}

/* ====================================
   WOOCOMMERCE — CART PAGE (CI Mittelweg)
   ==================================== */

/* --- Layout: 1312px + 64px Padding + Section Spacing --- */
.woocommerce-cart .woocommerce {
  max-width: 1312px !important;
  margin: 0 auto !important;
  padding: 80px 64px 64px !important;
}

/* --- Alle WooCommerce Buttons CI-konform --- */
.woocommerce-cart .button,
.woocommerce-cart .checkout-button,
.woocommerce-cart input[type="submit"] {
  background-color: var(--cobalt-700, #0022cf) !important;
  color: #fff !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 26px !important;
  padding: 12px 16px !important;
  border-radius: 0 !important;
  border: none !important;
}

.woocommerce-cart .button:hover,
.woocommerce-cart .checkout-button:hover,
.woocommerce-cart input[type="submit"]:hover {
  background-color: var(--cobalt-800, #001478) !important;
}

/* --- "Warenkorb anzeigen" Button auf Produktseite --- */
.single-product .added_to_cart.wc-forward {
  background-color: transparent !important;
  color: var(--cobalt-700, #0022cf) !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 26px !important;
  padding: 12px 16px !important;
  border: 1px solid var(--cobalt-700, #0022cf) !important;
  border-radius: 0 !important;
}

.single-product .added_to_cart.wc-forward:hover {
  background-color: var(--cobalt-700, #0022cf) !important;
  color: #fff !important;
}

/* --- Text-Farben auf CI --- */
.woocommerce-cart .woocommerce-cart-form .product-name a {
  color: var(--midnight-900, #012) !important;
}

.woocommerce-cart .woocommerce-cart-form th,
.woocommerce-cart .woocommerce-cart-form td {
  color: var(--midnight-900, #012) !important;
}

.woocommerce-cart .cart_totals th,
.woocommerce-cart .cart_totals td {
  color: var(--midnight-900, #012) !important;
}

/* --- Tabellen-Divider CI-konform --- */
.woocommerce-cart .woocommerce-cart-form table,
.woocommerce-cart .cart_totals table {
  border-color: var(--luenendonk-border) !important;
}

.woocommerce-cart .woocommerce-cart-form tr,
.woocommerce-cart .cart_totals tr {
  border-color: var(--luenendonk-border) !important;
}

/* --- Sidebar Border CI-konform --- */
.woocommerce-cart .cart_totals {
  border-color: var(--luenendonk-border) !important;
}

/* --- Zebra-Striping entfernen --- */
.woocommerce-cart .woocommerce-cart-form tr:nth-child(even) td,
.woocommerce-cart .woocommerce-cart-form tr:nth-child(odd) td {
  background: transparent !important;
}

/* ====================================
   WOOCOMMERCE — CHECKOUT PAGE (CI Mittelweg)
   ==================================== */

/* --- Layout: 1312px + 64px Padding + Section Spacing --- */
.woocommerce-checkout .woocommerce {
  max-width: 1312px !important;
  margin: 0 auto !important;
  padding: 80px 64px 64px !important;
}

/* --- Buttons CI-konform --- */
/* stylelint-disable selector-id-pattern */
.woocommerce-checkout .button,
.woocommerce-checkout input[type="submit"],
.woocommerce-checkout #place_order {
  background-color: var(--cobalt-700, #0022cf) !important;
  color: #fff !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 26px !important;
  padding: 12px 16px !important;
  border-radius: 0 !important;
  border: none !important;
}

.woocommerce-checkout .button:hover,
.woocommerce-checkout input[type="submit"]:hover,
.woocommerce-checkout #place_order:hover {
  background-color: var(--cobalt-800, #001478) !important;
}
/* stylelint-enable selector-id-pattern */

/* --- Text-Farben auf CI --- */
.woocommerce-checkout h3,
.woocommerce-checkout label,
.woocommerce-checkout th,
.woocommerce-checkout td {
  color: var(--midnight-900, #012) !important;
}

/* --- Tabellen-/Form-Divider CI-konform --- */
.woocommerce-checkout table tr,
.woocommerce-checkout .order_review {
  border-color: var(--luenendonk-border) !important;
}

/* ====================================
   DOWNLOAD FORMULAR (Zoho)
   Erbt Basis-Styles von der globalen Zoho-Form-Sektion.
   Hier nur Abweichungen (border-radius, Name-Layout, Abstände).
   ==================================== */

/* --- Card: abgerundete Ecken --- */
.download-form-card > .stk-column-wrapper {
  border-radius: 16px;
  overflow: hidden;
}

/* --- Form-Titel verstecken (Pattern hat eigenes Heading) --- */
.download-form-section .zf-frmTitle {
  display: none !important;
}

/* --- Felder: border-radius + Padding abweichend von Basis --- */
.download-form-section .zf-tempContDiv input[type="text"],
.download-form-section .zf-tempContDiv select {
  border-radius: 4px;
  padding: 12px 16px;
  height: auto;
}

/* --- Placeholder: explizite Farbe statt Opacity --- */
.download-form-section .zf-tempContDiv input[type="text"]::placeholder {
  color: var(--midnight-300, #6d829e);
  opacity: 1;
}

/* --- Feld-Abstände via margin (zusätzlich zu flex-gap) --- */
.download-form-section .zf-tempFrmWrapper {
  margin-bottom: 16px;
}

/* --- Name: nebeneinander (Basis: untereinander) --- */
.download-form-section .zf-nameWrapper {
  flex-wrap: wrap;
  gap: 12px;
}

.download-form-section .zf-nameWrapper > span,
.download-form-section .zf-nameWrapper > .zf-salutation {
  flex: 1 1 0%;
  min-width: 0;
  float: none;
  width: auto !important;
}

.download-form-section .zf-nameWrapper > .zf-clearBoth {
  display: none;
}

.download-form-section .zf-nameWrapper label {
  display: none;
}

/* --- Select Dropdown: anderes Chevron-Icon --- */
.download-form-section .zf-form-sBox {
  border-radius: 4px;
  padding: 12px 16px;
  height: auto;
  background-image: var(--icon-chevron-down-rounded);
  padding-right: 44px;
}

/* --- Checkbox: etwas kleiner (18px statt 20px) --- */
.download-form-section .zf-termsAccept {
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  gap: 12px;
  margin-top: 16px;
}

.download-form-section .zf-checkBoxType {
  margin-top: 4px;
  width: 18px;
  height: 18px;
  min-width: 18px;
}

/* --- Datenschutz-Text --- */
.download-form-section .zf-termsMsg {
  font-size: 14px;
  line-height: 24px;
  color: var(--midnight-600, #2a3d55);
  margin-bottom: 8px;
}

.download-form-section .zf-termsMsg a {
  color: var(--luenendonk-primary);
  text-decoration: underline;
}

/* --- Submit Button: abweichendes Padding + Hover --- */
.download-form-section .zf-submitColor {
  padding: 12px 24px;
  margin-top: 16px;
}

.download-form-section .zf-submitColor:hover {
  background-color: var(--cobalt-800, #001478);
}

/* --- Fehlermeldungen: etwas kleiner --- */
.download-form-section .zf-errorMessage {
  color: #d32f2f;
  font-size: 13px;
  line-height: 20px;
  margin-top: 4px;
}

/* --- Footer: kein Top-Padding --- */
.download-form-section .zf-fmFooter {
  padding: 0;
  margin: 0;
}

/* --- Responsive: Mobile --- */
@media screen and (max-width: 767px) {

  .download-form-section .zf-nameWrapper {
    flex-direction: column;
    gap: 16px;
  }
}

/* ====================================
   NEWS & INSIGHTS — ARTICLE LAYOUT
   ==================================== */

/* --- 2-Column Layout: Sidebar (280px) + Content (flex-1) --- */
.ni-article-layout {
  display: flex;
  flex-wrap: nowrap;
  gap: 64px;
  max-width: 1335px;
  margin: 0 auto;
  padding: 80px 64px 64px;
  align-items: flex-start;
}

/* --- Sidebar: fixed 280px, sticky --- */
.ni-sidebar {
  flex: 0 0 280px;
  width: 280px;
  position: sticky;
  top: 100px;
}

/* --- Content: fills remaining space --- */
.ni-content {
  flex: 1 1 0%;
  min-width: 0;
  overflow: hidden;
}

/* --- Sidebar Nav --- */
.ni-sidebar-nav {
  display: flex;
  flex-direction: column;
  gap: 80px;
}

/* --- Sidebar Section (Nach Markt / Nach Kategorie) --- */
.ni-sidebar-section {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* --- Label Row: Text + Line --- */
.ni-sidebar-label {
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  gap: 16px;
}

.ni-sidebar-label > span:first-child {
  font-family: Inter, sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 19px;
  color: var(--cobalt-500);
  text-transform: uppercase;
  white-space: nowrap;
}

.ni-sidebar-line {
  flex: 1 1 0%;
  height: 1px;
  background: var(--luenendonk-separator);
  margin-top: 9px;
}

/* --- Link List --- */
.ni-sidebar-links {
  list-style: none;
  margin: 0;
  padding: 0;
}

.ni-sidebar-links li {
  padding: 6px 0;
}

.ni-sidebar-links a {
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 26px;
  color: var(--luenendonk-dark);
  text-decoration: none;
  transition: color 0.2s;
}

.ni-sidebar-links a:hover {
  color: var(--cobalt-500);
}

/* --- Active State --- */
.ni-sidebar-links li.is-active a {
  color: var(--cobalt-500);
  font-weight: 600;
}

/* --- Responsive: Tablet (Sidebar unter Content) --- */
@media screen and (max-width: 1023px) {

  .ni-article-layout {
    flex-direction: column;
    padding: 48px 32px;
    gap: 48px;
  }

  .ni-sidebar {
    flex: none;
    width: 100%;
    position: static;
  }

  .ni-sidebar-nav {
    flex-direction: row;
    gap: 48px;
  }

  .ni-sidebar-section {
    flex: 1 1 0%;
  }
}

/* --- Responsive: Mobile --- */
@media screen and (max-width: 767px) {

  .ni-article-layout {
    padding: 32px 16px;
    gap: 32px;
  }

  .ni-sidebar-nav {
    flex-direction: column;
    gap: 32px;
  }
}

/* ====================================
   NEWS & INSIGHTS — ARTICLE CONTENT
   Figma order: Date → H1 → Tags → Image → Content
   ==================================== */

/* --- 1. Date — Figma: Inter 400, ~12px/19px, #0029f9, uppercase --- */
.ni-date {
  display: block;
  font-family: Inter, sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 19px;
  color: var(--cobalt-500);
  text-transform: uppercase;
  margin: 0 0 16px;
}

/* --- 2. Article Title (H1) — Figma: Inter 400, 49px/54px, #001122 --- */
.ni-title {
  font-family: Inter, sans-serif;
  font-size: 49px;
  font-weight: 400;
  line-height: 54px;
  color: var(--luenendonk-dark);
  margin: 0 0 16px;
}

/* --- 3. Tags (Category — Market) --- */
.ni-tags {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
  font-family: Inter, sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 19px;
  color: var(--luenendonk-dark);
  text-transform: uppercase;
  margin: 0 0 32px;
}

.ni-tags-sep {
  display: inline-block;
  width: 10px;
  height: 1px;
  background: var(--luenendonk-separator);
}

/* --- 4. Featured Image --- */
.ni-featured-image {
  width: 100%;
  overflow: hidden;
  margin-top: 32px;
  margin-bottom: 48px;
}

.ni-featured-image img {
  width: 100%;
  height: auto;
  max-height: 600px;
  object-fit: cover;
  object-position: center top;
  display: block;
}

/* --- 5. Article Content --- */

/* Body Text — Figma: Inter 400, 22px/33px, #001122 */
.ni-entry-content p {
  font-family: Inter, sans-serif;
  font-size: 22px;
  font-weight: 400;
  line-height: 33px;
  color: var(--luenendonk-dark);
  margin: 0 0 32px;
}

/* H2 — Figma: Inter 400, 33px/39px, #001122 */
.ni-entry-content h2 {
  font-family: Inter, sans-serif;
  font-size: 33px;
  font-weight: 400;
  line-height: 39px;
  color: var(--luenendonk-dark);
  margin: 48px 0 24px;
}

/* H3 */
.ni-entry-content h3 {
  font-family: Inter, sans-serif;
  font-size: 26px;
  font-weight: 400;
  line-height: 32px;
  color: var(--luenendonk-dark);
  margin: 40px 0 16px;
}

/* Links — Figma: #0022cf, underline */
.ni-entry-content a {
  color: var(--luenendonk-primary-button);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ni-entry-content a:hover {
  color: var(--cobalt-800);
}

/* Lists */
.ni-entry-content ul,
.ni-entry-content ol {
  font-family: Inter, sans-serif;
  font-size: 22px;
  line-height: 33px;
  color: var(--luenendonk-dark);
  margin: 0 0 32px;
  padding-left: 24px;
}

.ni-entry-content li {
  margin-bottom: 8px;
}

/* Blockquote */
.ni-entry-content blockquote {
  border-left: 3px solid var(--cobalt-500);
  padding: 16px 0 16px 32px;
  margin: 32px 0;
  font-style: italic;
  color: #2a3d55;
}

/* Legal / small text — Figma: Inter 400, 14px/22px */
.ni-entry-content .has-small-font-size,
.ni-entry-content small {
  font-size: 14px;
  line-height: 22px;
}

/* Edit link */
.ni-edit-link {
  margin-top: 32px;
  font-size: 14px;
}

.ni-edit-link a {
  color: #6d829e;
  text-decoration: none;
}

/* --- Responsive: Article Content --- */
@media screen and (max-width: 1023px) {

  .ni-title {
    font-size: 36px;
    line-height: 42px;
  }

  .ni-entry-content p,
  .ni-entry-content ul,
  .ni-entry-content ol {
    font-size: 18px;
    line-height: 28px;
  }

  .ni-entry-content h2 {
    font-size: 28px;
    line-height: 34px;
  }
}

@media screen and (max-width: 767px) {

  .ni-title {
    font-size: 30px;
    line-height: 36px;
  }

  .ni-entry-content p,
  .ni-entry-content ul,
  .ni-entry-content ol {
    font-size: 17px;
    line-height: 26px;
  }

  .ni-entry-content h2 {
    font-size: 24px;
    line-height: 30px;
    margin: 32px 0 16px;
  }
}

/* ====================================
   RELATED ARTICLES (nach Sidebar-Layout)
   ==================================== */

.ni-related {
  padding: 80px 64px 64px;
  background: #fff;
}

.ni-related-inner {
  max-width: 1312px;
  margin: 0 auto;
}

.ni-related-header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 48px;
}

.ni-related-meta {
  display: block;
  font-family: Inter, sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 19px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--cobalt-500);
  margin-bottom: 8px;
}

.ni-related-title {
  font-family: Inter, sans-serif;
  font-size: 48px;
  font-weight: 400;
  line-height: 53px;
  color: var(--luenendonk-dark);
  margin: 0;
}

.ni-related-all {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 12px;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: var(--luenendonk-dark);
  text-decoration: none;
  white-space: nowrap;
  margin-top: 24px;
}

.ni-related-all:hover {
  color: var(--cobalt-500);
}

.ni-related-all svg {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
}

.ni-related-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}

.ni-related-card-image {
  display: block;
  margin-bottom: 16px;
  overflow: hidden;
}

.ni-related-card-image img {
  width: 100%;
  height: 240px;
  object-fit: cover;
  display: block;
}

.ni-related-card-title {
  font-family: Inter, sans-serif;
  font-size: 22px;
  font-weight: 400;
  line-height: 30px;
  color: var(--luenendonk-dark);
  margin: 0 0 12px;
}

.ni-related-card-title a {
  color: inherit;
  text-decoration: none;
}

.ni-related-card-link {
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: var(--cobalt-500);
  text-decoration: underline;
}

@media screen and (max-width: 1023px) {

  .ni-related {
    padding: 48px 32px;
  }

  .ni-related-title {
    font-size: 33px;
    line-height: 39px;
  }

  .ni-related-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media screen and (max-width: 767px) {

  .ni-related-header {
    flex-direction: column;
    gap: 16px;
  }

  .ni-related-grid {
    grid-template-columns: 1fr;
  }

  .ni-related-card-image img {
    height: 200px;
  }
}


/* ====================================
   NEWS & INSIGHTS — ARCHIVE / OVERVIEW
   Horizontal article cards with sidebar
   ==================================== */

/* --- Archive Cards Container --- */
.ni-archive-cards {
  display: flex;
  flex-direction: column;
  gap: 0;
}

/* --- Article Card: horizontal layout --- */
.ni-card {
  display: flex;
  flex-wrap: nowrap;
  gap: 32px;
  padding: 32px 0;
  border-bottom: 1px solid var(--luenendonk-separator, #e0e0e0);
  align-items: flex-start;
}

.ni-card:first-child {
  padding-top: 0;
}

/* --- Thumbnail --- */
.ni-card-thumb-link {
  flex: 0 0 280px;
  display: block;
  text-decoration: none;
}

.ni-card-thumb {
  width: 280px;
  height: 180px;
  overflow: hidden;
  border-radius: 0;
  background: #f0f3f6;
}

.ni-card-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.ni-card-thumb-placeholder {
  width: 100%;
  height: 100%;
  background: #f0f3f6;
}

/* --- Card Body (right side) --- */
.ni-card-body {
  flex: 1 1 0%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

/* --- Meta Row: Category + Tag + Date --- */
.ni-card-meta {
  display: flex;
  flex-wrap: nowrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  font-family: Inter, sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 19px;
  text-transform: uppercase;
}

.ni-card-meta-left {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0;
}

.ni-card-category {
  color: var(--luenendonk-dark, #012);
  text-decoration: none;
}

.ni-card-category:hover {
  color: var(--cobalt-500, #0029f9);
}

.ni-card-tag {
  color: var(--luenendonk-dark, #012);
  text-decoration: none;
}

.ni-card-tag:hover {
  color: var(--cobalt-500, #0029f9);
}

.ni-card-meta-sep {
  color: var(--luenendonk-dark, #012);
  margin: 0 4px;
}

.ni-card-date {
  flex-shrink: 0;
  color: var(--cobalt-500, #0029f9);
  font-size: 12px;
  text-transform: uppercase;
  white-space: nowrap;
}

/* --- Title --- */
.ni-card-title {
  font-family: Inter, sans-serif;
  font-size: 22px;
  font-weight: 400;
  line-height: 30px;
  color: var(--luenendonk-dark, #012);
  margin: 0;
}

.ni-card-title a {
  color: inherit;
  text-decoration: none;
}

.ni-card-title a:hover {
  color: var(--cobalt-500, #0029f9);
}

/* --- Excerpt --- */
.ni-card-excerpt {
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 26px;
  color: #555;
  margin: 0;
}

/* --- Weiterlesen Link --- */
.ni-card-link {
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 26px;
  color: var(--luenendonk-dark, #012);
  text-decoration: underline;
  text-underline-offset: 3px;
  margin-top: 4px;
}

.ni-card-link:hover {
  color: var(--cobalt-500, #0029f9);
}

/* --- Pagination --- */
.ni-pagination {
  margin-top: 48px;
}

.ni-pagination .nav-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
}

.ni-pagination .page-numbers {
  font-family: Inter, sans-serif;
  font-size: 16px;
  padding: 8px 14px;
  color: var(--luenendonk-dark, #012);
  text-decoration: none;
  border-radius: 4px;
  transition: background 0.2s, color 0.2s;
}

.ni-pagination .page-numbers:hover {
  background: #f0f3f6;
}

.ni-pagination .page-numbers.current {
  background: var(--cobalt-500, #0029f9);
  color: #fff;
}

/* --- Archive Responsive: Tablet --- */
@media screen and (max-width: 1023px) {

  .ni-card {
    gap: 24px;
  }

  .ni-card-thumb-link {
    flex: 0 0 200px;
  }

  .ni-card-thumb {
    width: 200px;
    height: 140px;
  }
}

/* --- Archive Responsive: Mobile --- */
@media screen and (max-width: 767px) {

  .ni-card {
    flex-direction: column;
    gap: 16px;
  }

  .ni-card-thumb-link {
    flex: none;
    width: 100%;
  }

  .ni-card-thumb {
    width: 100%;
    height: 200px;
  }

  .ni-card-meta {
    flex-wrap: wrap;
  }

  .ni-card-date {
    width: 100%;
  }
}

/* ========================================
   SHOP — Product Archive Layout
   Figma: Sidebar 280px + 3-col Grid
   ======================================== */

/* --- Layout --- */
.shop-layout {
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  gap: 64px;
  max-width: 1335px;
  margin: 0 auto;
  padding: 80px 64px 64px;
}

.shop-sidebar {
  flex: 0 0 280px;
  position: sticky;
  top: 100px;
}

.shop-main {
  flex: 1 1 0%;
  min-width: 0;
}

/* --- Page Title --- */
.shop-title {
  font-family: Inter, sans-serif;
  font-size: 48px;
  font-weight: 400;
  line-height: 53px;
  color: var(--midnight-900, #012);
  margin: 0 0 24px;
}

/* --- Product Grid --- */
.shop-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}

/* --- Product Card --- */
.shop-card-link {
  display: block;
  text-decoration: none;
  color: inherit;
}

.shop-card-link:hover {
  text-decoration: none;
  color: inherit;
}

.shop-card-image {
  aspect-ratio: 4 / 3;
  background: #fff;
  margin-bottom: 20px;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
}

.shop-card-img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  display: block;
}

.shop-card-placeholder {
  width: 100%;
  height: 100%;
  background: #f0f3f6;
}

.shop-card-content {
  display: flex;
  flex-direction: column;
}

.shop-card-cat {
  font-family: Inter, sans-serif;
  font-size: 16px;
  line-height: 26px;
  font-weight: 400;
  color: var(--midnight-900, #012);
  white-space: nowrap;
}

.shop-card-title {
  font-family: Inter, sans-serif;
  font-size: 22px;
  line-height: 33px;
  font-weight: 400;
  color: var(--midnight-900, #012);
  margin: 0 0 16px;
}

.shop-card-price {
  font-family: Inter, sans-serif;
  font-size: 16px;
  line-height: 26px;
  font-weight: 600;
  color: var(--midnight-900, #012);
}

.shop-card-price .free-price {
  font-weight: 600;
}

.shop-card-tax {
  font-family: Inter, sans-serif;
  font-size: 12px;
  line-height: 19px;
  font-weight: 400;
  color: var(--midnight-900, #012);
}

/* --- Sidebar Filter --- */
.shop-filter {
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.shop-filter-section {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.shop-filter-label {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 16px;
}

.shop-filter-label > span:first-child {
  font-family: Inter, sans-serif;
  font-size: 12px;
  line-height: 19px;
  font-weight: 400;
  color: var(--cobalt-500, #0029f9);
  text-transform: uppercase;
  white-space: nowrap;
}

.shop-filter-line {
  flex: 1;
  height: 1px;
  background: var(--midnight-50, #d4dce5);
}

/* --- Filter: Kategorien Links --- */
.shop-filter-links {
  list-style: none;
  margin: 0;
  padding: 0;
}

.shop-filter-links li {
  padding: 6px 0;
}

.shop-filter-links a {
  font-family: Inter, sans-serif;
  font-size: 16px;
  line-height: 26px;
  font-weight: 400;
  color: var(--midnight-900, #012);
  text-decoration: none;
  white-space: nowrap;
}

.shop-filter-links a:hover {
  color: var(--cobalt-500, #0029f9);
}

.shop-filter-links li.is-active a {
  font-weight: 600;
}

/* --- Filter: Märkte Checkboxes --- */
.shop-filter-checks {
  list-style: none;
  margin: 0;
  padding: 0;
}

.shop-filter-checks li {
  padding: 4px 0;
}

.shop-filter-checks label {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  font-family: Inter, sans-serif;
  font-size: 16px;
  line-height: 26px;
  color: var(--midnight-900, #012);
}

/* Hide native checkbox */
.shop-filter-checks input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

/* Custom checkbox */
.shop-checkbox {
  display: inline-block;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  border: 1px solid rgba(0, 8, 17, 0.1);
  border-radius: 4px;
  background: #fff;
  position: relative;
  transition: background 0.15s, border-color 0.15s;
}

.shop-filter-checks input[type="checkbox"]:checked + .shop-checkbox {
  background: var(--cobalt-500, #0029f9);
  border-color: var(--cobalt-500, #0029f9);
}

.shop-filter-checks input[type="checkbox"]:checked + .shop-checkbox::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 6px;
  width: 5px;
  height: 10px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

/* --- Filter: Price Slider --- */
.shop-price-slider {
  padding: 0;
}

.shop-price-track {
  position: relative;
  height: 24px;
  margin-bottom: 12px;
}

/* Background track */
.shop-price-track::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: 4px;
  transform: translateY(-50%);
  background: var(--midnight-25, #f0f3f6);
  border-radius: 2px;
}

/* Active range bar */
.shop-price-range {
  position: absolute;
  top: 50%;
  height: 4px;
  transform: translateY(-50%);
  background: var(--cobalt-500, #0022cf);
  border-radius: 2px;
  left: 0;
  right: 0;
}

/* Range inputs — stacked on top of each other */
.shop-price-input {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 24px;
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  pointer-events: none;
  margin: 0;
}

.shop-price-input::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--cobalt-500, #0022cf);
  border: 3px solid #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  cursor: pointer;
  pointer-events: auto;
}

.shop-price-input::-moz-range-thumb {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--cobalt-500, #0022cf);
  border: 3px solid #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  cursor: pointer;
  pointer-events: auto;
}

/* Price labels */
.shop-price-values {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
}

.shop-price-val-min,
.shop-price-val-max {
  font-family: Inter, sans-serif;
  font-size: 16px;
  line-height: 26px;
  color: var(--midnight-900, #012);
}

/* --- Filter Reset Button --- */
.shop-filter-reset-wrap {
  text-align: center;
}

.shop-filter-reset {
  display: inline-block;
  font-family: Inter, sans-serif;
  font-size: 16px;
  line-height: 26px;
  color: #000811;
  padding: 12px 16px;
  border: 1px solid rgba(0, 8, 17, 0.1);
  background: #fff;
  text-decoration: none;
  transition: background 0.15s;
}

.shop-filter-reset:hover {
  background: #f0f3f6;
  color: #000811;
  text-decoration: none;
}

.shop-filter-reset.is-hidden {
  display: none;
}

/* --- WooCommerce Pagination Override --- */
.woocommerce-pagination {
  margin-top: 48px;
}

/* --- No Results --- */
.shop-no-results {
  font-family: Inter, sans-serif;
  font-size: 18px;
  line-height: 28px;
  color: var(--midnight-700, #1a2d44);
  padding: 64px 0;
}

/* --- Shop Responsive: Tablet --- */
@media screen and (max-width: 1023px) {

  .shop-layout {
    gap: 32px;
    padding: 48px 32px;
  }

  .shop-sidebar {
    flex: 0 0 220px;
  }

  .shop-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
  }

  .shop-title {
    font-size: 36px;
    line-height: 42px;
  }
}

/* --- Shop Responsive: Mobile --- */
@media screen and (max-width: 767px) {

  .shop-layout {
    flex-direction: column;
    padding: 32px 20px;
    gap: 32px;
  }

  .shop-sidebar {
    flex: none;
    width: 100%;
    position: static;
  }

  .shop-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }

  .shop-title {
    font-size: 28px;
    line-height: 34px;
  }

  .shop-card-title {
    font-size: 18px;
    line-height: 26px;
  }
}

@media screen and (max-width: 479px) {

  .shop-grid {
    grid-template-columns: 1fr;
  }
}

/* ====================================
   FOOTER — Links (Content Block 218)
   ==================================== */
.stk-5ef51d5 a {
  color: var(--theme-palette-color-7, #fff);
  text-decoration: none;
  transition: color 0.2s ease;
  display: block;
}

.stk-5ef51d5 a:hover {
  color: #f8c853;
}

/* ====================================
   FOOTER — Legal Bar (Gold Line + Links)
   ==================================== */
.stk-ft-legal-txt a {
  color: rgba(255, 255, 255, 0.5);
  text-decoration: none;
  transition: color 0.2s ease;
}

.stk-ft-legal-txt a:hover {
  color: #f8c853;
}

/* ====================================
   FOCUS STATES (Accessibility)
   ==================================== */
.shop-filter-checks input[type="checkbox"]:focus-visible ~ .shop-checkbox {
  outline: 2px solid var(--cobalt-500);
  outline-offset: 2px;
}

.shop-filter-links a:focus-visible {
  outline: 2px solid var(--cobalt-500);
  outline-offset: 2px;
}

.stk-block-button > a:focus-visible {
  outline: 2px solid var(--cobalt-500);
  outline-offset: 2px;
}

.expertise-link-item a:focus-visible {
  outline: 2px solid var(--cobalt-500);
  outline-offset: 2px;
}

/* Germanized Checkout: hide empty order review on address step */
body.woocommerce-multistep-checkout-active-address .ct-order-review {
  border: none;
  padding: 0;
}

