/* =============================================================================
 AUTOHAUS KAMEN — MASTER CSS V3 LTS
 Version: 3.0.0-LTS
 Stand: 27.07.2026
 Status: LONG-TERM SUPPORT — produktive Referenzversion
 Basis: Master CSS, Stand 17.07.2026, einschließlich produktiv bestätigter
        iPhone-, Cookie-, Menü- und Sidebar-Hotfixes

 ZIELE DIESER LTS
 - identisches Erscheinungsbild gegenüber dem bisherigen Produktionsstand
 - produktiv bestätigte EasyWay-/Audaris-Overrides vollständig erhalten
 - Safari-/iPhone-Stabilisierung unverändert schützen
 - zu breite Footer-Kaskade an der Ursache begrenzen
 - mobilen Vollbild-Blur nicht unnötig berechnen
 - moderne Viewport-Höhe priorisieren; alten Safari-Fallback begrenzen
 - Kommentare, Kodierung und Dokumentation bereinigen

 SCHUTZBEREICHE — NICHT OHNE LIVE-TEST ÄNDERN
 - Cookie-Consent und Cookie-Schaltflächen
 - #menu-toggle, #menu-close-toggle und mobile Menü-Interaktion
 - #page_sidebar, Kontaktbereich und Öffnungszeiten
 - Scroll-Lock und Safe-Area
 - 0,01-ms-Initialisierungsblock
 - translateZ(0) an den bestätigten Kontaktflächen
 - kritische EasyWay-/Audaris-Header- und Navigationsregeln

 MODULSTRUKTUR
 1. Tokens & Basis
 2. Globale Typografie
 3. Digitale Fahrzeugfunktionen
 4. Header / Navigation / Logo / Sidebar
 5. Slider / Hero / Slogan
 6. Kacheln & Landingpages
 7. Buttons & Formulare
 8. Footer / Utilities / CMS-Overrides
 9. Responsive / Safari / Accessibility
 10. Produktiv bestätigte Hotfixes

 LTS-ÄNDERUNGEN
 - breite Selektoren [class*="footer"] aus der globalen Weißschriftregel entfernt
 - echter Footer bleibt weiß; mobiles .footer_copy_menu bleibt petrol
 - Sidebar-Blur für 768–1279,98 px separat gekapselt
 - auf Mobilgeräten bis 767,98 px wird kein großflächiger Live-Blur voraktiviert
 - -webkit-fill-available nur noch als Fallback ohne 100dvh-Unterstützung
 - beschädigte Kommentarzeichen redaktionell bereinigt
 - keine Designwerte, Komponenten oder produktiv bestätigten Hotfixes entfernt

 ROLLBACK
 Bei einem P0-Fehler die bisherige Produktionsdatei vollständig zurückspielen.
 Keine Teilmischung zwischen Produktionsstand und RC1 vornehmen.
 ============================================================================= */


/* ##########################################################################
 1. TOKENS & BASIS
 ########################################################################## */

/* ---------- 1. Design-Tokens (:root, ein einziger Block) ---------- */

:root {
 /* Spacing */
 --space-none: 0;
 --space-xs: 0.25rem;
 --space-s: 0.5rem;
 --space-m: 1rem;
 --space-l: 1.5rem;
 --space-xl: 3rem;
 --space-xxl: 5rem;

 /* Marken-Farben */
 --ak-primary: #00434e;
 --ak-primary-2: #005f73;
 --ak-petrol: #064f55;
 --ak-petrol-dark: #07364a;
 --ak-petrol-mid: #134b62;
 --ak-petrol-soft: #306f84;
 --ak-ice: #dff5ff;
 --ak-ice-soft: #ddf5ff;
 --ak-text: #244955;
 --ak-gold: #d6a21e;
 --ak-gold-dark: #c78300;
 --ak-white: #ffffff;
 --ak-black: #000000;

 /* Typografie   Schriftfamilie (global verbindlich) */
 --ak-font-sans: "Poppins", Arial, sans-serif;

 /* Typografie   Größen-Skala (Desktop-Basis, in @media überschrieben) */
 --ak-fs-title: clamp(30px, 3.8vw, 52px); /* H1 Hero-Titel */
 --ak-fs-h1: clamp(1.75rem, 5.2vw + 0.5rem, 3rem); /* H1 Standard */
 --ak-fs-h2: clamp(1.375rem, 3.2vw + 0.5rem, 2.125rem); /* H2 Standard */
 --ak-fs-h2-kpi: 24px; /* H2 in KPI-Kacheln */
 --ak-fs-h3: clamp(1.125rem, 1.8vw + 0.5rem, 1.5rem); /* H3 Standard */
 --ak-fs-lead: 18px; /* Fließtext / Lead */
 --ak-fs-body: 1rem; /* Sekundär-Fließtext (16px) */
 --ak-fs-small: 14px; /* Klein / Meta */
 --ak-fs-muted: 13px; /* Hinweise / Disclaimer */
 --ak-fs-pill: clamp(13px, 2vw, 17px); /* Pills / Kicker */

 /* Typografie   Line-Heights */
 --ak-lh-title: 1.14;
 --ak-lh-heading: 1.2;
 --ak-lh-h3: 1.3;
 --ak-lh-lead: 1.7;
 --ak-lh-body: 1.65;
 --ak-lh-muted: 1.55;

 /* Typografie   Letter-Spacing */
 --ak-ls-title: -0.035em;
 --ak-ls-h1: -0.01em;
 --ak-ls-h2: -0.005em;

 /* Motion */
 --ak-transition-fast: 0.15s ease;
 --ak-transition: 0.25s ease;
 --ak-transition-slow: 0.4s cubic-bezier(0.4, 0, 0.2, 1);

 /* Z-Index-Skala */
 --ak-z-base: 1;
 --ak-z-sticky: 100;
 --ak-z-header: 500;
 --ak-z-modal: 1000;
 --ak-z-toast: 2000;
}


/* ---------- 2. Box-Sizing / Reset (dezent) ---------- */

*,
*::before,
*::after {
 box-sizing: border-box;
}


/* ---------- 3. HTML- und Body-Basis ---------- */

html,
body {
 width: 100%;
 max-width: 100%;
 overflow-x: hidden;
 overscroll-behavior-y: auto;
}

body {
 font-family: var(--ak-font-sans);
 font-size: var(--ak-fs-body);
 line-height: var(--ak-lh-body);
 color: var(--ak-text);
 background-color: var(--ak-ice);
 -webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: grayscale;
}

/* Home-Seite: Hintergrund identisch zur Basis (bewusst redundant belassen,
 falls ein CMS-Theme body.site-home mit anderem BG überschreibt). */
body.site-home {
 background-color: var(--ak-ice);
}


/* =========================================================================
 ENDE BLOCK 1
 Nächster Block (2) übernimmt die globale Typografie (H1 H6),
 inklusive der Auflösung aller aktuell 6 8 konkurrierenden Headline-Regeln.
 ========================================================================= */

/* ##########################################################################
 2. GLOBALE TYPOGRAFIE
 ########################################################################## */

/* ---------- 1. Font-Family global verbindlich ---------- */

html h1, html h2, html h3, html h4, html h5, html h6,
html .headline-h1, html .headline-h2, html .headline-h3,
html .headline-h4, html .headline-h5, html .headline-h6,
html .h1, html .h2, html .h3, html .h4, html .h5, html .h6 {
 font-family: var(--ak-font-sans);
}


/* ---------- 2. H1   global ---------- */

html h1,
html .headline-h1,
html .infomanager-area h1,
html .infomanager-area .headline-h1 {
 font-family: var(--ak-font-sans);
 font-weight: 700;
 font-size: var(--ak-fs-h1); /* clamp(1.75rem, 5.2vw + 0.5rem, 3rem) */
 line-height: 1.15;
 letter-spacing: var(--ak-ls-h1); /* -0.01em */
 margin: 0 0 var(--space-m);
 -webkit-hyphens: none;
 hyphens: none;
 word-break: normal;
 overflow-wrap: anywhere;
}


/* ---------- 3. H2   global ---------- */

html h2,
html .headline-h2,
html .infomanager-area h2,
html .infomanager-area .headline-h2,
html .site-home .module-block .container > h2 {
 font-family: var(--ak-font-sans);
 font-weight: 700;
 font-size: var(--ak-fs-h2); /* clamp(1.375rem, 3.2vw + 0.5rem, 2.125rem) */
 line-height: var(--ak-lh-heading); /* 1.2 */
 letter-spacing: var(--ak-ls-h2); /* -0.005em */
 margin: 0 0 var(--space-m);
 -webkit-hyphens: none;
 hyphens: none;
 word-break: normal;
 overflow-wrap: anywhere;
}


/* ---------- 4. H3   global ---------- */

html h3,
html .headline-h3,
html .infomanager-area h3,
html .infomanager-area .headline-h3 {
 font-family: var(--ak-font-sans);
 font-weight: 600;
 font-size: var(--ak-fs-h3); /* clamp(1.125rem, 1.8vw + 0.5rem, 1.5rem) */
 line-height: var(--ak-lh-h3); /* 1.3 */
 margin: 0 0 var(--space-s);
 -webkit-hyphens: none;
 hyphens: none;
 word-break: normal;
 overflow-wrap: anywhere;
}


/* ---------- 5. H4   global (italic bleibt, war im Ist-Sieger enthalten) ---------- */

html h4,
html .headline-h4 {
 font-family: var(--ak-font-sans);
 font-weight: 700;
 font-size: 1.3125rem; /* 21px   unverändert */
 font-style: italic; /* aus späterem Regelblock als Sieger */
 line-height: 1.3;
 margin: 0 0 var(--space-s);
}


/* ---------- 6. H5   global ---------- */

html h5,
html .headline-h5 {
 font-family: var(--ak-font-sans);
 font-weight: 700; /* Sieger: 700 (nicht 400) */
 font-size: 1.125rem; /* 18px */
 font-style: italic;
 line-height: 1.35;
 margin: 0 0 var(--space-s);
}


/* ---------- 7. H6   global ---------- */

html h6,
html .headline-h6 {
 font-family: var(--ak-font-sans);
 font-weight: 700; /* Sieger: 700 (nicht 400) */
 font-size: 0.875rem; /* 14px */
 font-style: italic;
 line-height: 1.4;
 margin: 0 0 var(--space-s);
}


/* ---------- 8. Subheadline / Lead ---------- */

html .subheadline-h2 {
 color: var(--ak-black);
 font-family: var(--ak-font-sans);
 font-size: 1rem;
 font-weight: 400;
 line-height: var(--ak-lh-lead);
 margin: 0 0 var(--space-m);
}


/* ---------- 9. Absätze, Listen, Fließtext ---------- */

body p {
 font-family: var(--ak-font-sans);
 font-size: var(--ak-fs-body);
 line-height: var(--ak-lh-body);
 color: var(--ak-text);
 margin: 0 0 var(--space-m);
}

body ul,
body ol {
 font-family: var(--ak-font-sans);
 font-size: var(--ak-fs-body);
 line-height: var(--ak-lh-body);
 color: var(--ak-text);
}


/* ---------- 10. Links (Basis) ---------- */

body a {
 color: var(--ak-primary-2);
 text-decoration: underline;
 text-underline-offset: 2px;
 transition: color var(--ak-transition-fast);
}

body a:hover,
body a:focus-visible {
 color: var(--ak-primary);
}


/* ---------- 11. Silbentrennung generell abschalten für Headlines & Meta ----------
 Ersetzt drei nahezu identische Regeln aus dem Ist-CSS mit derselben Absicht. */

html .headline-h1,
html .headline-h2,
html .headline-h3,
html .subheadline-h2,
html .h1, html .h2, html .h3,
html [class*="headline"],
html [class*="ueberschrift"] {
 -webkit-hyphens: none;
 hyphens: none;
 word-break: normal;
 overflow-wrap: normal;
}


/* =========================================================================
 ENDE BLOCK 2
 HINWEIS   RESPONSIVE:
 Die Responsiv-Anpassungen für H1/H2/H3 (Mobile-Reduktion via
 @media max-width: 768px / 480px) wandern gesammelt in Block 9.
 Dort werden die Tokens --ak-fs-h1 / --ak-fs-h2 / --ak-fs-h3 überschrieben,
 sodass diese Regeln hier NICHTS ändern müssen.

 HINWEIS   LANDING-PAGES:
 .ak-liquid-page h1/h2/h3 und [class*="ak-gebrauchtwagen-"] h1/h2/h3
 werden bewusst NICHT hier überschrieben. Ihre kleineren, engeren Größen
 folgen in Block 6 (Kacheln/Landing-Pages)   Design bleibt 1:1 erhalten.
 ========================================================================= */

/* ##########################################################################
 3. DIGITALE FAHRZEUGFUNKTIONEN   PETROL-KONTRAST
 ########################################################################## */

/* ---------- 1. Container: Text-Basis auf der Seite ---------- */

html .ak-digitaldienste-liquid,
html .ak-digitaldienste-liquid * {
 text-shadow: none;
}


/* ---------- 2. HELLE / WEISSE KACHELN  Schrift PETROL ---------- */

html .ak-digitaldienste-liquid .ak-glass-card,
html .ak-digitaldienste-liquid .ak-glass-card *,
html .ak-digitaldienste-liquid .ak-glass-card-strong:not(.ak-glass-dark),
html .ak-digitaldienste-liquid .ak-glass-card-strong:not(.ak-glass-dark) *,
html .ak-digitaldienste-liquid .ak-glass-kpi:not(.ak-glass-dark),
html .ak-digitaldienste-liquid .ak-glass-kpi:not(.ak-glass-dark) * {
 color: var(--ak-petrol) !important;
 -webkit-text-fill-color: var(--ak-petrol) !important;
}


/* ---------- 3. PETROLFARBENE KACHELN  Schrift WEISS ----------
 Deckt jetzt ab:
 " .ak-glass-dark (bisher schon berücksichtigt)
 " .ak-iz-petrol-card (BUGFIX   bisher NICHT erfasst)
 " .ak-glass-card-strong.ak-glass-dark (Kombi-Klasse)
 Alle Kind-Elemente (h1 h6, p, span, strong, div, li, a) werden mitgezogen. */

html .ak-digitaldienste-liquid .ak-glass-dark,
html .ak-digitaldienste-liquid .ak-glass-dark h1,
html .ak-digitaldienste-liquid .ak-glass-dark h2,
html .ak-digitaldienste-liquid .ak-glass-dark h3,
html .ak-digitaldienste-liquid .ak-glass-dark h4,
html .ak-digitaldienste-liquid .ak-glass-dark p,
html .ak-digitaldienste-liquid .ak-glass-dark span,
html .ak-digitaldienste-liquid .ak-glass-dark strong,
html .ak-digitaldienste-liquid .ak-glass-dark div,
html .ak-digitaldienste-liquid .ak-glass-dark li,
html .ak-digitaldienste-liquid .ak-glass-dark a,
html .ak-digitaldienste-liquid .ak-glass-dark .ak-digital-dark-title,
html .ak-digitaldienste-liquid .ak-glass-dark .ak-digital-dark-text,

html .ak-digitaldienste-liquid .ak-iz-petrol-card,
html .ak-digitaldienste-liquid .ak-iz-petrol-card h1,
html .ak-digitaldienste-liquid .ak-iz-petrol-card h2,
html .ak-digitaldienste-liquid .ak-iz-petrol-card h3,
html .ak-digitaldienste-liquid .ak-iz-petrol-card h4,
html .ak-digitaldienste-liquid .ak-iz-petrol-card p,
html .ak-digitaldienste-liquid .ak-iz-petrol-card span,
html .ak-digitaldienste-liquid .ak-iz-petrol-card strong,
html .ak-digitaldienste-liquid .ak-iz-petrol-card div,
html .ak-digitaldienste-liquid .ak-iz-petrol-card li,
html .ak-digitaldienste-liquid .ak-iz-petrol-card a,

html .ak-digitaldienste-liquid .ak-digital-dark-title,
html .ak-digitaldienste-liquid .ak-digital-dark-text {
 color: var(--ak-white) !important;
 -webkit-text-fill-color: var(--ak-white) !important;
}


/* ---------- 4. WEISSE BUTTONS AUF PETROLKACHELN  Schrift PETROL ---------- */

html .ak-digitaldienste-liquid .ak-glass-dark a.ak-glass-button-light,
html .ak-digitaldienste-liquid .ak-glass-dark .ak-glass-button-light,
html .ak-digitaldienste-liquid .ak-iz-petrol-card a.ak-glass-button-light,
html .ak-digitaldienste-liquid .ak-iz-petrol-card .ak-glass-button-light {
 background: var(--ak-white) !important;
 color: var(--ak-petrol) !important;
 -webkit-text-fill-color: var(--ak-petrol) !important;
 border: 1px solid rgba(255, 255, 255, 0.95) !important;
 text-decoration: none !important;
}

html .ak-digitaldienste-liquid .ak-glass-dark a.ak-glass-button-light *,
html .ak-digitaldienste-liquid .ak-glass-dark .ak-glass-button-light *,
html .ak-digitaldienste-liquid .ak-iz-petrol-card a.ak-glass-button-light *,
html .ak-digitaldienste-liquid .ak-iz-petrol-card .ak-glass-button-light * {
 color: var(--ak-petrol) !important;
 -webkit-text-fill-color: var(--ak-petrol) !important;
}

/* Hover: weißer Button auf Petrol  wird selbst petrol mit weißer Schrift */
html .ak-digitaldienste-liquid .ak-glass-dark a.ak-glass-button-light:hover,
html .ak-digitaldienste-liquid .ak-glass-dark a.ak-glass-button-light:focus-visible,
html .ak-digitaldienste-liquid .ak-iz-petrol-card a.ak-glass-button-light:hover,
html .ak-digitaldienste-liquid .ak-iz-petrol-card a.ak-glass-button-light:focus-visible {
 background: var(--ak-petrol) !important;
 color: var(--ak-white) !important;
 -webkit-text-fill-color: var(--ak-white) !important;
 border-color: var(--ak-white) !important;
}


/* ---------- 5. PILLS / KLEINE LABELS ---------- */

/* Auf weißen Kacheln: petrol */
html .ak-digitaldienste-liquid .ak-glass-card .ak-liquid-pill,
html .ak-digitaldienste-liquid .ak-glass-card-strong:not(.ak-glass-dark) .ak-liquid-pill,
html .ak-digitaldienste-liquid .ak-glass-kpi:not(.ak-glass-dark) .ak-liquid-pill,
html .ak-digitaldienste-liquid .ak-digital-meta {
 color: var(--ak-petrol) !important;
 -webkit-text-fill-color: var(--ak-petrol) !important;
}

/* Auf petrolfarbenen Kacheln: weiß */
html .ak-digitaldienste-liquid .ak-glass-dark .ak-liquid-pill,
html .ak-digitaldienste-liquid .ak-glass-dark .ak-digital-meta,
html .ak-digitaldienste-liquid .ak-iz-petrol-card .ak-liquid-pill,
html .ak-digitaldienste-liquid .ak-iz-petrol-card .ak-digital-meta {
 color: var(--ak-white) !important;
 -webkit-text-fill-color: var(--ak-white) !important;
 border-color: rgba(255, 255, 255, 0.85) !important;
}


/* ---------- 6. FARBIGE ICON-KREISE  Zeichen bleibt WEISS ---------- */

html .ak-digitaldienste-liquid .ak-glass-kpi div[style*="border-radius: 999px"],
html .ak-digitaldienste-liquid .ak-glass-kpi div[style*="border-radius:999px"],
html .ak-digitaldienste-liquid .ak-iz-petrol-card div[style*="border-radius: 999px"],
html .ak-digitaldienste-liquid .ak-iz-petrol-card div[style*="border-radius:999px"] {
 color: var(--ak-white) !important;
 -webkit-text-fill-color: var(--ak-white) !important;
}


/* Dunkle Karten werden ausschließlich über .ak-glass-dark bzw.
   .ak-iz-petrol-card erkannt; keine Farberkennung aus style-Teilstrings. */

/* ---------- 8. Wortumbrüche in dieser Sektion sauber halten ---------- */

html .ak-digitaldienste-liquid h1,
html .ak-digitaldienste-liquid h2,
html .ak-digitaldienste-liquid h3,
html .ak-digitaldienste-liquid h4,
html .ak-digitaldienste-liquid p,
html .ak-digitaldienste-liquid span,
html .ak-digitaldienste-liquid strong,
html .ak-digitaldienste-liquid a {
 -webkit-hyphens: none !important;
 hyphens: none !important;
 word-break: normal !important;
 overflow-wrap: normal !important;
}


/* =========================================================================
 ENDE BLOCK 3
 Design-Impact: nur der bisher fehlerhafte Bereich (petrol-auf-petrol)
 wird korrigiert. Alle bisher korrekt weißen bzw. petrolfarbenen
 Kacheln bleiben unverändert.
 ========================================================================= */

/* ##########################################################################
 4. HEADER / NAVIGATION / LOGO / SIDEBAR
 ########################################################################## */

#header {
 background: var(--ak-ice);
 border-bottom: none;
}

.navbar {
 height: 100%;
}

.navbar-inverse > .container-fluid, .navbar-inverse > .container-limited {
 height: 100%;
}

.navbar-left {
 height: 100px;
}

.navbar-left img {
 margin: 0 22px;
}

.navbar-inverse .navbar-nav > li > a {
 font-size: 1rem;
 padding: 26px 24px;
 text-transform: none;
}

.header-menu-fixed .navbar-inverse .navbar-nav > li > a {
 padding: 0 24px;
}

.navbar-inverse .navbar-nav > li > a:hover {
 background-color: var(--ak-ice);
 color: var(--ak-primary);
}

.navbar-inverse .navbar-nav .dropdown-menu > li:hover > a, .navbar-inverse .navbar-nav .dropdown-menu > li:focus > a, .navbar-inverse .navbar-nav .dropdown-menu > li.active > a, .navbar-inverse .navbar-nav .sdropdown-menu > li:hover > a, .navbar-inverse .navbar-nav .sdropdown-menu > li:focus > a, .navbar-inverse .navbar-nav .sdropdown-menu > li.active > a {
 background-color: var(--ak-primary);
 color: var(--ak-white);
}

#header #optional-header-icons a span {
 background: var(--ak-primary);
}

#header #menu-toggle:hover .menu-toggle-text, #header #menu-toggle:focus .menu-toggle-text {
 color: var(--ak-black);
}

#header #menu-toggle:hover .icon-bar, #header #menu-toggle:focus .icon-bar {
 background-color: var(--ak-black);
}

#page_sidebar .phone-mail-infos .btn-primary::after, #page_sidebar .phone-mail-infos .btn-default::after {
 content: "";
}

body.site-home #header-slider {
 max-height: 756px;
}

#header-slider {
 border-bottom: none;
}

html body #header, html body #header .header-inner, html body #header .navbar, html body #header .navbar-default, html body #header .navbar-inverse, html body #header .navbar-left, html body #header .navbar-right, html body #header .navbar-header, html body #header .navbar-collapse, html body #header .navbar-left .row, html body #header .navbar-left .column, html body #header .navbar-left .ge-content, html body .brand-logos, html body .brand-logo-row, html body .ak-brand-logos, html body .ak-logo-row, html body .ak-marken-logos, html body .ak-partner-logos {
 background-color: var(--ak-ice) !important;
 background-image: none !important;
}

html body header, html body > header, html body .site-header, html body .page-header, html body .top-bar, html body #top-bar, html body #top, html body #header, html body #header-wrap, html body #header-wrapper, html body #header-inner, html body #header-container, html body #header-top, html body #masthead, html body .masthead, html body #wrapper > header, html body #page > header, html body .header, html body .header-wrap, html body .header-inner, html body .header-top, html body .header-main, html body .header-content, html body .navbar, html body .navbar-default, html body .navbar-inverse, html body .navbar-header, html body .navbar-inner, html body .navbar-collapse, html body .navbar-left, html body .navbar-right, html body .navbar-brand, html body .logo-wrap, html body .logo-wrapper, html body .logo-container, html body #logo, html body #logo-primary-box, html body .brand-logos, html body .brand-logo-row, html body .brand-logo-strip, html body .brands-bar, html body .brand-bar, html body .marken-leiste, html body .marken-bar, html body .ak-brand-logos, html body .ak-brand-row, html body .ak-logo-row, html body .ak-marken-logos, html body .ak-marken-leiste, html body .ak-partner-logos, html body .ak-partner-bar, html body .partner-logos, html body .partner-bar {
 background: #dff5ff !important;
 background-color: #dff5ff !important;
 background-image: none !important;
}

html body #header > *, html body #header * [class*="logo"], html body #header * [class*="brand"], html body #header * [class*="marken"], html body #header * [class*="partner"] {
 background-color: #dff5ff !important;
 background-image: none !important;
}

html, html body, html body #wrapper, html body #page, html body #main, html body main, html body .site, html body .site-content, html body .page-content, html body .content-wrapper, html body .main-content {
 background: #dff5ff !important;
 background-color: #dff5ff !important;
 background-image: none !important;
}

/* ##########################################################################
 5. SLIDER / HERO / SLOGAN
 ########################################################################## */

.site-home [data-container="infomanager"] h2, .site-home .module-block .container > h2, .content-title, .link-default, .link-pfeil {
 color: var(--ak-primary);
}

html .infomanager-area .headline-h2, html .site-home .module-block .container > h2 {
 font-size: 3.875rem;
}

#section-vehicle-inquiry-form .slider-handle, .slider-selection {
 background-color: var(--ak-primary);
}

[data-container="infomanager"].infomanager-view-3[data-slider-view="2"] .im-slider-entry a, .owl-carousel .owl-stage-outer {
 border-radius: 40px;
}

[data-container="infomanager"].infomanager-view-3[data-slider-view="2"] .im-slider-entry a::before {
 background: linear-gradient(to bottom, rgba(0,67,78,1.00) 0%, rgba(0,67,78,0.00) 90%, rgba(0,67,78,0.00) 100%);
}

[data-container="infomanager"].infomanager-view-3[data-slider-view="2"] .im-headline {
 font-size: 2rem;
 line-height: 32px;
 padding: 43px 38px;
}

[data-container="infomanager"].infomanager-view-3[data-slider-view="2"] .im-slider-entry a:hover .img-overlay-extra-info {
 display: none;
}

.individual-slider-button .btn-primary {
 position: absolute;
 top: 140px;
 left: calc(((100vw - 1580px) / 2) + 16px);
 background: var(--ak-primary);
 color: var(--ak-white);
 border-color: transparent;
}

.individual-slider-button .btn-primary:hover {
 background-color: var(--ak-ice);
 border-color: var(--ak-primary);
 color: var(--ak-primary);
}

.individual-slider-button .section-im-slider-container {
 margin-top: 115px;
}

#section-search-switcher.sss-config-module.no-search > .container {
 background: var(--ak-white);
 border: 1px solid #dfe8eb;
 border-radius: 28px;
 padding: 32px;
 max-width: 1100px;
}

#section-search-switcher.sss-config-module.no-search > .container::before {
 content: "Terminvereinbarung";
 display: inline-block;
 border-radius: 12px;
 font-size: 1rem;
 font-weight: 600;
 color: var(--ak-primary-2);
 border: 1px solid #d8e8eb;
 padding: 8px 14px;
 background: #f4fafb;
 margin-bottom: 18px;
 border-left: 4px solid var(--ak-primary-2);
}

#section-search-switcher.sss-config-module.no-search h2 {
 font-size: clamp(28px, 4vw, 36px);
 line-height: 1.25;
 font-weight: 600;
 color: var(--ak-primary-2);
}

#section-search-switcher.sss-config-module.no-search h3 {
 font-size: 1.25rem;
 font-weight: 500;
 color: #1f2d3d;
 display: flex;
 flex-direction: column;
 gap: 10px;
}

#section-search-switcher.sss-config-module.no-search h3::after {
 content: "Wir sind fuer Sie da und helfen Ihnen schnell und unkompliziert bei der Terminvereinbarung.";
 font-size: 1rem;
 line-height: 1.6;
 color: #5b6573;
}

#section-search-switcher.sss-config-module.no-search .service-select-buttons {
 margin-top: 24px;
}

#section-search-switcher.sss-config-module.no-search .service-select-buttons .btn {
 padding: 12px 22px;
 background: var(--ak-primary-2);
 color: var(--ak-white);
 text-decoration: none;
 border-radius: 999px;
 font-size: 0.9375rem;
 font-weight: 500;
 border: 2px solid var(--ak-primary-2);
}

#section-search-switcher.sss-config-module.no-search .service-select-buttons .btn:hover {
 background: var(--ak-white);
 color: var(--ak-primary-2);
 border: 2px solid var(--ak-primary-2);
}

#section-search-switcher.sss-config-module.no-search .service-select-buttons .btn:last-child {
 background: var(--ak-white);
 color: var(--ak-primary-2);
 border: 2px solid var(--ak-primary-2);
}

#section-search-switcher.sss-config-module.no-search .service-select-buttons .btn:hover:last-child {
 background: var(--ak-primary-2);
 color: var(--ak-white);
}

#section-search-switcher.sss-config-module.no-search .search-switcher-top-container {
 max-width: none;
}

#section-search-switcher.sss-config-module.no-search #section-service-select .service-select-buttons {
 justify-content: flex-start;
}

.ak-liquid-grid-2, .ak-iz-grid-hero {
 display: grid;
 grid-template-columns: repeat(2, minmax(0,1fr));
 gap: clamp(16px,2vw,28px);
}

body.site-home .ak-no-hyphen:first-of-type, body.site-home .ak-no-hyphen.ak-home-liquid, body.site-home .ak-no-hyphen[style="Poppins"] {
 margin-top: 72px;
}

body.site-home .ak-startseite-liquid .ak-glass-dark, body.site-home .ak-startseite-liquid .ak-glass-dark h1, body.site-home .ak-startseite-liquid .ak-glass-dark h2, body.site-home .ak-startseite-liquid .ak-glass-dark h3, body.site-home .ak-startseite-liquid .ak-glass-dark h4, body.site-home .ak-startseite-liquid .ak-glass-dark p, body.site-home .ak-startseite-liquid .ak-glass-dark span:not([style*="\2605"]):not([style*="#c78300"]):not([style*="#d6a21e"]), body.site-home .ak-startseite-liquid .ak-glass-dark strong {
 color: var(--ak-white);
 text-shadow: 0 2px 10px rgba(0,25,38,0.36);
}

body.site-home .ak-startseite-liquid .ak-glass-card:not(.ak-glass-dark) .ak-liquid-title, body.site-home .ak-startseite-liquid .ak-glass-card:not(.ak-glass-dark) h1, body.site-home .ak-startseite-liquid .ak-glass-card:not(.ak-glass-dark) h2, body.site-home .ak-startseite-liquid .ak-glass-card:not(.ak-glass-dark) h3, body.site-home .ak-startseite-liquid .ak-glass-card:not(.ak-glass-dark) h4, body.site-home .ak-startseite-liquid .ak-glass-card-strong:not(.ak-glass-dark) .ak-liquid-title, body.site-home .ak-startseite-liquid .ak-glass-card-strong:not(.ak-glass-dark) h1, body.site-home .ak-startseite-liquid .ak-glass-card-strong:not(.ak-glass-dark) h2, body.site-home .ak-startseite-liquid .ak-glass-card-strong:not(.ak-glass-dark) h3, body.site-home .ak-startseite-liquid .ak-glass-card-strong:not(.ak-glass-dark) h4 {
 color: var(--ak-petrol-dark);
 text-shadow: none;
}

body.site-home .ak-startseite-liquid .ak-glass-card:not(.ak-glass-dark) .ak-liquid-text, body.site-home .ak-startseite-liquid .ak-glass-card:not(.ak-glass-dark) p, body.site-home .ak-startseite-liquid .ak-glass-card-strong:not(.ak-glass-dark) .ak-liquid-text, body.site-home .ak-startseite-liquid .ak-glass-card-strong:not(.ak-glass-dark) p {
 color: var(--ak-text);
 text-shadow: none;
}

body.site-home .ak-startseite-liquid span[style*="\2605"], body.site-home .ak-startseite-liquid div[style*="\2605"], body.site-home .ak-startseite-liquid span[style*="#c78300"], body.site-home .ak-startseite-liquid span[style*="#d6a21e"], body.site-home .ak-startseite-liquid div[style*="#c78300"], body.site-home .ak-startseite-liquid div[style*="#d6a21e"], body.site-home .ak-startseite-liquid div[style*="gap: clamp(7px"], body.site-home .ak-startseite-liquid div[style*="gap: clamp(7px"] span {
 color: var(--ak-gold);
 fill: var(--ak-gold);
 stroke: var(--ak-gold);
 text-shadow: 0 2px 9px rgba(120,78,0,0.28);
}

body.site-home .ak-startseite-liquid a.ak-glass-button, body.site-home .ak-startseite-liquid a.ak-glass-button *, body.site-home .ak-startseite-liquid a.ak-iz-btn-dark, body.site-home .ak-startseite-liquid a.ak-iz-btn-dark * {
 color: var(--ak-white);
 fill: var(--ak-white);
 stroke: var(--ak-white);
}

body.site-home .ak-startseite-liquid a.ak-glass-button-light, body.site-home .ak-startseite-liquid a.ak-glass-button-light *, body.site-home .ak-startseite-liquid a.ak-iz-btn-light, body.site-home .ak-startseite-liquid a.ak-iz-btn-light * {
 color: var(--ak-petrol) !important;
 -webkit-text-fill-color: var(--ak-petrol) !important;
 fill: var(--ak-petrol);
 stroke: var(--ak-petrol);
 text-shadow: none;
}

html body.site-home .ak-no-hyphen div[style="grid-template-columns"], html body.site-home .ak-liquid-page div[style*="grid-template-columns"], html body.site-home .ak-home-liquid div[style*="grid-template-columns"], html body.site-home .ak-startseite-liquid div[style*="grid-template-columns"] {
 display: grid !important;
 grid-template-columns: 1fr !important;
 grid-template-rows: auto auto !important;
 justify-items: center !important;
 align-items: center !important;
 text-align: center !important;
 gap: 22px !important;
 max-width: 100% !important;
 min-width: 0 !important;
 box-sizing: border-box !important;
}

html body.site-home .ak-no-hyphen div[style="grid-template-columns"] > :first-child, html body.site-home .ak-liquid-page div[style="grid-template-columns"] > :first-child, html body.site-home .ak-home-liquid div[style="grid-template-columns"] > :first-child, html body.site-home .ak-startseite-liquid div[style="grid-template-columns"] > *:first-child {
 margin-left: auto !important;
 margin-right: auto !important;
}

html body, html .infomanager-area, html .module-block {
 font-family: Poppins, Arial, sans-serif;
}

html, html body, html h1, html h2, html h3, html h4, html h5, html h6, html p, html li, html a, html span, html div, html .headline-h1, html .headline-h2, html .headline-h3, html .subheadline-h2, html .infomanager-area, html .infomanager-area , html .module-block, html .module-block * {
 -webkit-hyphens: none;
 -moz-hyphens: none;
 -ms-hyphens: none;
 hyphens: none;
 word-break: normal;
 overflow-wrap: anywhere;
 hyphenate-limit-chars: 999 999 999;
}

html body .ak-liquid-page a.ak-glass-button, html body .ak-liquid-page button.ak-glass-button, html body .ak-startseite-liquid a.ak-glass-button, html body .ak-startseite-liquid button.ak-glass-button, html body a.ak-glass-button, html body button.ak-glass-button {
 color: #ffffff !important;
 -webkit-text-fill-color: #ffffff !important;
 text-decoration: none !important;
 background: linear-gradient(135deg, #0f5b6b 0%, #064f55 54%, #07364a 100%) !important;
 background-color: #0f5b6b !important;
 border: 1px solid rgba(255,255,255,0.58) !important;
 box-shadow: inset 0 1px 0 rgba(255,255,255,0.34), 0 14px 30px rgba(0,35,48,0.24) !important;
}

html body .ak-liquid-page a.ak-glass-button-light, html body .ak-liquid-page button.ak-glass-button-light, html body .ak-startseite-liquid a.ak-glass-button-light, html body .ak-startseite-liquid button.ak-glass-button-light, html body a.ak-glass-button-light, html body button.ak-glass-button-light {
 color: #064f55 !important;
 -webkit-text-fill-color: #064f55 !important;
 text-decoration: none !important;
 background: linear-gradient(135deg, rgba(255,255,255,0.98) 0%, rgba(236,250,255,0.94) 100%) !important;
 background-color: #ffffff !important;
 border: 1px solid rgba(6,79,85,0.42) !important;
 box-shadow: inset 0 1px 0 rgba(255,255,255,1), 0 12px 28px rgba(30,72,98,0.18) !important;
}

/* ##########################################################################
 6. KACHELN & LANDING-PAGES
 ########################################################################## */

html .ak-no-hyphen, html .ak-no-hyphen * {
 hyphens: none;
 word-break: normal;
 overflow-wrap: normal;
 word-wrap: normal;
 box-sizing: border-box;
}

.ak-liquid-page {
 position: relative;
 width: 100%;
 max-width: 1280px;
 min-width: 0;
 margin: 0 auto;
 padding: 0 10px;
 font-family: Poppins, Arial, sans-serif;
 color: var(--ak-text);
 line-height: 1.65;
 font-weight: 500;
 -webkit-text-size-adjust: 100%;
 text-size-adjust: 100%;
}

.ak-liquid-stage {
 position: relative;
 overflow: hidden;
 width: 100%;
 min-width: 0;
 border-radius: 46px;
 padding: clamp(16px,3vw,34px);
 margin: 0 0 24px 0;
 background-image: linear-gradient(90deg, rgba(230,248,255,0.88) 0%, rgba(230,248,255,0.52) 26%, rgba(230,248,255,0.12) 54%, rgba(230,248,255,0.04) 100%), 
linear-gradient(180deg, rgba(255,255,255,0.22) 0%, rgba(223,245,255,0.12) 100%), 
url("/website/themes/autohaus-kamen.eu/dynamic/fe/liquid_glass/liquid_glass_ahk.jpg");
 background-size: cover;
 background-position: center center;
 background-repeat: no-repeat;
 box-shadow: 0 34px 90px rgba(60,110,136,0.24), 
inset 0 1px 0 rgba(255,255,255,0.98), 
inset 0 -1px 0 rgba(127,179,205,0.18);
}

.ak-liquid-stage::before {
 content: "";
 position: absolute;
 inset: 0;
 pointer-events: none;
 background: radial-gradient(circle at 8% 12%, rgba(255,255,255,0.86) 0%, rgba(255,255,255,0.48) 22%, rgba(255,255,255,0.00) 48%), 
radial-gradient(circle at 85% 18%, rgba(255,255,255,0.16) 0%, rgba(255,255,255,0.00) 36%), 
linear-gradient(180deg, rgba(255,255,255,0.06) 0%, rgba(223,245,255,0.10) 100%);
}

.ak-liquid-stage::after {
 content: "";
 position: absolute;
 inset: 9px;
 border-radius: 38px;
 border: 1px solid rgba(255,255,255,0.82);
 box-shadow: inset 0 1px 0 rgba(255,255,255,1), 
inset 0 -1px 0 rgba(110,165,196,0.14);
 pointer-events: none;
}

.ak-liquid-stage > * {
 position: relative;
 z-index: 1;
}

.ak-glass-card, .ak-glass-card-strong, .ak-glass-kpi {
 position: relative;
 overflow: hidden;
 border: 1px solid rgba(255,255,255,0.88);
 background: linear-gradient(135deg, rgba(255,255,255,0.32), rgba(224,246,255,0.10));
 box-shadow: 0 28px 68px rgba(30,72,98,0.24), 
inset 0 1px 0 rgba(255,255,255,1), 
inset 0 -1px 0 rgba(124,176,204,0.10);
 backdrop-filter: blur(14px) saturate(190%);
 -webkit-backdrop-filter: blur(14px) saturate(190%);
}

.ak-glass-card {
 border-radius: 30px;
}

.ak-glass-card-strong {
 border-radius: 34px;
}

.ak-glass-kpi {
 border-radius: 26px;
 padding: clamp(20px,2.4vw,30px);
}

.ak-glass-card::before, .ak-glass-card-strong::before, .ak-glass-kpi::before {
 content: "";
 position: absolute;
 left: 20px;
 right: 20px;
 top: 0;
 height: 1px;
 background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,1), rgba(255,255,255,0));
 pointer-events: none;
}

.ak-glass-card > *, .ak-glass-card-strong > *, .ak-glass-kpi > * {
 position: relative;
 z-index: 1;
}

.ak-glass-dark, .ak-iz-petrol-card {
 position: relative;
 overflow: hidden;
 color: var(--ak-white);
 background: radial-gradient(circle at 16% 0%, rgba(255,255,255,0.40), rgba(255,255,255,0.00) 40%), 
radial-gradient(circle at 84% 10%, rgba(122,224,240,0.22), rgba(122,224,240,0.00) 42%), 
radial-gradient(circle at 52% 58%, rgba(0,24,38,0.26), rgba(0,24,38,0.00) 62%), 
linear-gradient(135deg, rgba(48,111,132,0.92) 0%, rgba(19,75,98,0.90) 43%, rgba(7,54,74,0.88) 100%);
 border: 1px solid rgba(164,236,248,0.72);
 box-shadow: 0 36px 82px rgba(5,48,68,0.44), 
0 0 0 1px rgba(255,255,255,0.24), 
0 0 34px rgba(94,210,232,0.22), 
inset 0 1px 0 rgba(255,255,255,0.58), 
inset 0 0 26px rgba(128,226,244,0.20), 
inset 0 -2px 0 rgba(0,25,38,0.24);
 backdrop-filter: blur(22px) saturate(215%);
 -webkit-backdrop-filter: blur(22px) saturate(215%);
}

.ak-glass-dark {
 border-radius: 30px;
}

.ak-iz-petrol-card {
 border-radius: 28px;
 padding: 24px 22px;
 box-sizing: border-box;
}

.ak-glass-dark::before, .ak-iz-petrol-card::before {
 content: "";
 position: absolute;
 left: 18px;
 right: 18px;
 top: 0;
 height: 1px;
 background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,1), rgba(255,255,255,0));
 pointer-events: none;
}

.ak-glass-dark::after, .ak-iz-petrol-card::after {
 content: "";
 position: absolute;
 left: 12px;
 right: 12px;
 top: 7px;
 height: 34px;
 border-radius: 999px;
 background: linear-gradient(180deg, rgba(255,255,255,0.22), rgba(255,255,255,0.00));
 pointer-events: none;
}

.ak-glass-dark > *, .ak-iz-petrol-card > * {
 position: relative;
 z-index: 1;
}

html .ak-glass-dark, html .ak-glass-dark h1, html .ak-glass-dark h2, html .ak-glass-dark h3, html .ak-glass-dark h4, html .ak-glass-dark p, html .ak-glass-dark span, html .ak-glass-dark strong, html .ak-iz-petrol-card, html .ak-iz-petrol-card h1, html .ak-iz-petrol-card h2, html .ak-iz-petrol-card h3, html .ak-iz-petrol-card h4, html .ak-iz-petrol-card p, html .ak-iz-petrol-card span, html .ak-iz-petrol-card strong {
 color: var(--ak-white);
}

html .ak-glass-button, html .ak-no-hyphen a.ak-glass-button, html .ak-no-hyphen a.ak-glass-button:link, html .ak-no-hyphen a.ak-glass-button:visited, html .ak-no-hyphen a.ak-glass-button:hover, html .ak-no-hyphen a.ak-glass-button:active, html .ak-no-hyphen a.ak-glass-button:focus, html .ak-iz-btn, html .ak-no-hyphen a.ak-iz-btn, html .ak-no-hyphen a.ak-iz-btn:link, html .ak-no-hyphen a.ak-iz-btn:visited, html .ak-no-hyphen a.ak-iz-btn:hover, html .ak-no-hyphen a.ak-iz-btn:active, html .ak-no-hyphen a.ak-iz-btn:focus {
 position: relative;
 display: flex;
 align-items: center;
 justify-content: center;
 min-height: 58px;
 padding: 14px 16px;
 border-radius: 24px;
 text-decoration: none;
 font-size: 0.9375rem;
 font-weight: 800;
 text-align: center;
 line-height: 1.35;
 box-sizing: border-box;
 word-break: normal;
 overflow-wrap: normal;
 hyphens: none;
 transition: transform 180ms ease, box-shadow 180ms ease;
}

html .ak-glass-button, html .ak-no-hyphen a.ak-glass-button, html .ak-iz-btn-dark, html .ak-no-hyphen a.ak-iz-btn-dark {
 background: radial-gradient(circle at 16% 0%, rgba(255,255,255,0.42), rgba(255,255,255,0.00) 40%), 
radial-gradient(circle at 84% 8%, rgba(128,226,244,0.24), rgba(128,226,244,0.00) 42%), 
linear-gradient(135deg, var(--ak-petrol-soft) 0%, var(--ak-petrol-mid) 45%, var(--ak-petrol-dark) 100%);
 border: 1px solid rgba(164,236,248,0.74);
 color: var(--ak-white);
 box-shadow: 0 16px 34px rgba(5,48,68,0.26), 
inset 0 1px 0 rgba(255,255,255,0.56), 
inset 0 0 20px rgba(128,226,244,0.18);
 backdrop-filter: blur(16px) saturate(190%);
 -webkit-backdrop-filter: blur(16px) saturate(190%);
}

html .ak-glass-button-light, html .ak-no-hyphen a.ak-glass-button-light, html .ak-no-hyphen a.ak-glass-button-light:link, html .ak-no-hyphen a.ak-glass-button-light:visited, html .ak-no-hyphen a.ak-glass-button-light:hover, html .ak-no-hyphen a.ak-glass-button-light:active, html .ak-no-hyphen a.ak-glass-button-light:focus, html .ak-iz-btn-light, html .ak-no-hyphen a.ak-iz-btn-light, html .ak-no-hyphen a.ak-iz-btn-light:link, html .ak-no-hyphen a.ak-iz-btn-light:visited, html .ak-no-hyphen a.ak-iz-btn-light:hover, html .ak-no-hyphen a.ak-iz-btn-light:active, html .ak-no-hyphen a.ak-iz-btn-light:focus {
 display: flex;
 align-items: center;
 justify-content: center;
 min-height: 58px;
 padding: 14px 16px;
 border-radius: 24px;
 text-decoration: none;
 background: rgba(255,255,255,0.96);
 border: 1px solid rgba(255,255,255,1);
 color: var(--ak-petrol);
 font-size: 0.9375rem;
 font-weight: 800;
 text-align: center;
 line-height: 1.35;
 box-shadow: inset 0 1px 0 rgba(255,255,255,1), 
0 16px 34px rgba(0,25,38,0.18);
 backdrop-filter: blur(16px) saturate(190%);
 -webkit-backdrop-filter: blur(16px) saturate(190%);
 box-sizing: border-box;
}

html .ak-glass-button:hover, html .ak-glass-button-light:hover, html .ak-iz-btn:hover {
 transform: translateY(-2px);
}

html .ak-iz-button-grid {
 display: grid;
 grid-template-columns: repeat(auto-fit, minmax(min(100%,220px), 1fr));
 gap: 12px;
 min-width: 0;
}

html .ak-iz-btn, html .ak-iz-btn *, html .ak-no-hyphen .ak-iz-btn, html .ak-no-hyphen .ak-iz-btn * {
 text-shadow: none;
}

html .ak-iz-btn-dark, html .ak-iz-btn-dark *, html .ak-no-hyphen .ak-iz-btn-dark, html .ak-no-hyphen .ak-iz-btn-dark * {
 color: var(--ak-white);
 fill: var(--ak-white);
}

html .ak-iz-btn-light, html .ak-iz-btn-light *, html .ak-no-hyphen .ak-iz-btn-light, html .ak-no-hyphen .ak-iz-btn-light * {
 color: var(--ak-petrol);
 fill: var(--ak-petrol);
}

.ak-liquid-title {
 color: var(--ak-petrol-dark);
 letter-spacing: var(--ak-ls-title);
 text-shadow: 0 1px 0 rgba(255,255,255,0.58), 
0 14px 32px rgba(6,79,85,0.16);
 font-size: var(--ak-fs-title);
 line-height: var(--ak-lh-title);
 margin: 18px 0;
}

.ak-liquid-text {
 color: var(--ak-text);
 font-size: var(--ak-fs-lead);
 line-height: var(--ak-lh-lead);
}

.ak-liquid-muted {
 color: rgba(36,73,85,0.78);
 font-size: var(--ak-fs-muted);
 line-height: var(--ak-lh-muted);
}

.ak-liquid-petrol {
 color: var(--ak-petrol);
}

.ak-liquid-pill, .ak-iz-kicker-light {
 display: inline-flex;
 align-items: center;
 width: fit-content;
 max-width: 100%;
 padding: 12px 20px;
 border-radius: 999px;
 color: var(--ak-petrol);
 font-size: clamp(13px,2vw,17px);
 font-weight: 800;
 letter-spacing: 0.04em;
 text-transform: uppercase;
 background: linear-gradient(135deg, rgba(255,255,255,0.48), rgba(236,250,255,0.18));
 border: 1px solid rgba(255,255,255,0.88);
 box-shadow: inset 0 1px 0 rgba(255,255,255,1), 
0 14px 30px rgba(54,100,126,0.12);
}

html .ak-iz-kicker-dark {
 display: inline-block;
 background: radial-gradient(circle at 16% 0%, rgba(255,255,255,0.42), rgba(255,255,255,0.00) 40%), 
radial-gradient(circle at 84% 8%, rgba(128,226,244,0.24), rgba(128,226,244,0.00) 42%), 
radial-gradient(circle at 50% 58%, rgba(0,24,38,0.30), rgba(0,24,38,0.00) 64%), 
linear-gradient(135deg, var(--ak-petrol-soft) 0%, var(--ak-petrol-mid) 45%, var(--ak-petrol-dark) 100%);
 border: 1px solid rgba(164,236,248,0.74);
 color: var(--ak-white);
 padding: 10px 16px;
 border-radius: 999px;
 font-size: 0.8125rem;
 line-height: 1.35;
 font-weight: 800;
 letter-spacing: 0.06em;
 text-transform: uppercase;
 margin: 0 0 14px 0;
 box-shadow: 0 16px 34px rgba(5,48,68,0.22), 
inset 0 1px 0 rgba(255,255,255,0.56), 
inset 0 0 20px rgba(128,226,244,0.18);
}

html .ak-liquid-icon, html .ak-iz-icon {
 width: 52px;
 height: 52px;
 border-radius: 18px;
 display: flex;
 align-items: center;
 justify-content: center;
 background: radial-gradient(circle at 18% 0%, rgba(255,255,255,0.52), rgba(255,255,255,0.00) 42%), 
linear-gradient(135deg, var(--ak-petrol-soft) 0%, var(--ak-petrol-mid) 48%, var(--ak-petrol-dark) 100%);
 border: 1px solid rgba(164,236,248,0.74);
 color: var(--ak-white);
 font-weight: 800;
 font-size: 1.5rem;
 margin: 0 0 14px 0;
 box-shadow: 0 12px 24px rgba(5,48,68,0.24), 
inset 0 1px 0 rgba(255,255,255,0.52);
}

.ak-iz-icon.ak-green {
 background: radial-gradient(circle at 18% 0%, rgba(255,255,255,0.52), rgba(255,255,255,0.00) 42%), 
linear-gradient(135deg, rgba(42,190,88,0.96) 0%, rgba(23,145,68,0.94) 48%, rgba(11,106,55,0.92) 100%);
 border: 1px solid rgba(205,255,219,0.76);
 box-shadow: 0 12px 24px rgba(16,126,62,0.30), 
inset 0 1px 0 rgba(255,255,255,0.52);
}

.ak-liquid-grid-3 {
 display: grid;
 grid-template-columns: repeat(3, minmax(0,1fr));
 gap: clamp(16px,2vw,24px);
}

.ak-liquid-grid-4, .ak-iz-info-grid, .ak-iz-product-grid {
 display: grid;
 grid-template-columns: repeat(4, minmax(0,1fr));
 gap: clamp(14px,1.8vw,22px);
}

.ak-liquid-pad-s {
 padding: clamp(18px,2vw,24px);
}

.ak-liquid-pad-m, .ak-iz-info-card, .ak-iz-product-card {
 padding: clamp(20px,2.4vw,24px);
}

.ak-liquid-pad-l {
 padding: clamp(28px,3.4vw,46px);
}

.ak-iz-glass-card, .ak-iz-info-card, .ak-iz-product-card {
 position: relative;
 overflow: hidden;
 background: linear-gradient(135deg, rgba(255,255,255,0.42), rgba(236,250,255,0.14));
 border: 1px solid rgba(255,255,255,0.88);
 box-shadow: inset 0 1px 0 rgba(255,255,255,1), 
0 16px 34px rgba(30,72,98,0.14);
 backdrop-filter: blur(14px) saturate(190%);
 -webkit-backdrop-filter: blur(14px) saturate(190%);
 box-sizing: border-box;
 min-width: 0;
}

.ak-iz-glass-card {
 border-radius: 32px;
 padding: 24px 22px;
 margin: 0 0 22px 0;
}

.ak-iz-info-card, .ak-iz-product-card {
 border-radius: 24px;
}

html .ak-iz-price {
 display: flex;
 align-items: center;
 justify-content: center;
 min-height: 42px;
 padding: 10px 14px;
 border-radius: 18px;
 background: linear-gradient(135deg, var(--ak-petrol-soft) 0%, var(--ak-petrol-mid) 45%, var(--ak-petrol-dark) 100%);
 border: 1px solid rgba(164,236,248,0.72);
 color: var(--ak-white);
 font-size: 0.875rem;
 font-weight: 800;
 text-align: center;
}

.ak-liquid-image {
 width: 100%;
 max-width: 100%;
 height: auto;
 display: block;
 border-radius: 26px;
 box-shadow: 0 22px 60px rgba(21,73,92,0.20), 
inset 0 1px 0 rgba(255,255,255,0.40);
}

html a.ak-glass-button-light, html a.ak-glass-button-light *, html a.ak-iz-btn-light, html a.ak-iz-btn-light * {
 color: var(--ak-petrol) !important;
 -webkit-text-fill-color: var(--ak-petrol) !important;
}

html .ak-isuzu-zubehoer-page .ak-iz-petrol-card .ak-iz-button-grid a, html .ak-isuzu-zubehoer-page .ak-iz-petrol-card .ak-iz-button-grid a:link, html .ak-isuzu-zubehoer-page .ak-iz-petrol-card .ak-iz-button-grid a:visited, html .ak-isuzu-zubehoer-page .ak-iz-petrol-card .ak-iz-button-grid a:hover, html .ak-isuzu-zubehoer-page .ak-iz-petrol-card .ak-iz-button-grid a:active, html .ak-isuzu-zubehoer-page .ak-iz-petrol-card .ak-iz-button-grid a:focus {
 opacity: 1;
 visibility: visible;
 text-decoration: none;
 text-shadow: none;
}

html .ak-isuzu-zubehoer-page .ak-iz-petrol-card .ak-iz-button-grid a.ak-iz-btn-light, html .ak-isuzu-zubehoer-page .ak-iz-petrol-card .ak-iz-button-grid a.ak-iz-btn-light:link, html .ak-isuzu-zubehoer-page .ak-iz-petrol-card .ak-iz-button-grid a.ak-iz-btn-light:visited, html .ak-isuzu-zubehoer-page .ak-iz-petrol-card .ak-iz-button-grid a.ak-iz-btn-light:hover, html .ak-isuzu-zubehoer-page .ak-iz-petrol-card .ak-iz-button-grid a.ak-iz-btn-light:active, html .ak-isuzu-zubehoer-page .ak-iz-petrol-card .ak-iz-button-grid a.ak-iz-btn-light:focus {
 background: rgba(255,255,255,0.96);
 color: var(--ak-petrol);
}

html .ak-isuzu-zubehoer-page .ak-iz-petrol-card .ak-iz-button-grid a.ak-iz-btn-dark, html .ak-isuzu-zubehoer-page .ak-iz-petrol-card .ak-iz-button-grid a.ak-iz-btn-dark:link, html .ak-isuzu-zubehoer-page .ak-iz-petrol-card .ak-iz-button-grid a.ak-iz-btn-dark:visited, html .ak-isuzu-zubehoer-page .ak-iz-petrol-card .ak-iz-button-grid a.ak-iz-btn-dark:hover, html .ak-isuzu-zubehoer-page .ak-iz-petrol-card .ak-iz-button-grid a.ak-iz-btn-dark:active, html .ak-isuzu-zubehoer-page .ak-iz-petrol-card .ak-iz-button-grid a.ak-iz-btn-dark:focus {
 color: var(--ak-white);
}

html .ak-isuzu-katalog-html, html .ak-isuzu-katalog-html * {
 box-sizing: border-box;
 hyphens: none;
 word-break: normal;
 overflow-wrap: normal;
 word-wrap: normal;
}

html .ak-isuzu-katalog-stage {
 position: relative;
 overflow: hidden;
 width: 100%;
 min-width: 0;
 border-radius: 46px;
 padding: clamp(14px,3vw,32px);
 margin: 0 0 22px 0;
 background-image: linear-gradient(90deg, rgba(230,248,255,0.88) 0%, rgba(230,248,255,0.52) 26%, rgba(230,248,255,0.12) 54%, rgba(230,248,255,0.04) 100%), 
linear-gradient(180deg, rgba(255,255,255,0.22) 0%, rgba(223,245,255,0.12) 100%), 
url("/website/themes/autohaus-kamen.eu/dynamic/fe/liquid_glass/liquid_glass_ahk.jpg");
 background-size: cover;
 background-position: center center;
 background-repeat: no-repeat;
 box-shadow: 0 34px 90px rgba(60,110,136,0.24), 
inset 0 1px 0 rgba(255,255,255,0.98), 
inset 0 -1px 0 rgba(127,179,205,0.18);
}

html .ak-isuzu-katalog-shell {
 position: relative;
 z-index: 2;
 width: 100%;
 min-width: 0;
 overflow: hidden;
 border-radius: 38px;
 padding: clamp(18px,3vw,34px);
 background: linear-gradient(135deg, rgba(255,255,255,0.18), rgba(231,249,255,0.07));
 border: 1px solid rgba(255,255,255,0.76);
 box-shadow: 0 30px 76px rgba(38,83,108,0.20), 
inset 0 1px 0 rgba(255,255,255,0.90), 
inset 0 -1px 0 rgba(255,255,255,0.22);
 backdrop-filter: blur(12px) saturate(175%);
 -webkit-backdrop-filter: blur(12px) saturate(175%);
}

html .ak-isuzu-katalog-pages {
 position: relative;
 z-index: 2;
 display: grid;
 grid-template-columns: 1fr;
 gap: clamp(22px,3vw,34px);
 width: 100%;
 min-width: 0;
}

html .ak-isuzu-katalog-page {
 position: relative;
 width: 100%;
 min-width: 0;
 border-radius: 42px;
 padding: clamp(12px,2vw,24px);
 background: radial-gradient(circle at 16% 0%, rgba(255,255,255,0.72), rgba(255,255,255,0.00) 42%), 
radial-gradient(circle at 86% 12%, rgba(128,226,244,0.20), rgba(128,226,244,0.00) 44%), 
linear-gradient(135deg, rgba(255,255,255,0.50), rgba(224,246,255,0.18));
 border: 1px solid rgba(255,255,255,0.94);
 box-shadow: 0 30px 72px rgba(30,72,98,0.24), 
0 0 0 1px rgba(255,255,255,0.30), 
inset 0 1px 0 rgba(255,255,255,1), 
inset 0 -1px 0 rgba(124,176,204,0.14);
 backdrop-filter: blur(18px) saturate(200%);
 -webkit-backdrop-filter: blur(18px) saturate(200%);
 overflow: hidden;
}

html .ak-isuzu-katalog-page::before {
 content: "";
 position: absolute;
 left: 24px;
 right: 24px;
 top: 0;
 height: 1px;
 background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,1), rgba(255,255,255,0));
 pointer-events: none;
 z-index: 5;
}

html .ak-isuzu-katalog-page::after {
 content: "";
 position: absolute;
 inset: 10px;
 border-radius: 34px;
 border: 1px solid rgba(255,255,255,0.82);
 box-shadow: inset 0 1px 0 rgba(255,255,255,0.98), 
inset 0 -1px 0 rgba(110,165,196,0.14), 
0 0 28px rgba(255,255,255,0.22);
 pointer-events: none;
 z-index: 5;
}

html .ak-isuzu-katalog-img-frame {
 position: relative;
 z-index: 2;
 display: block;
 width: 100%;
 min-width: 0;
 overflow: hidden;
 border-radius: 34px;
 background: rgba(255,255,255,0.24);
 border: 2px solid rgba(255,255,255,0.88);
 box-shadow: 0 20px 44px rgba(28,70,96,0.22), 
inset 0 1px 0 rgba(255,255,255,0.94), 
0 0 28px rgba(255,255,255,0.22);
 clip-path: inset(0 round 34px);
 -webkit-mask-image: -webkit-radial-gradient(white, black);
 transform: translateZ(0);
 isolation: isolate;
}

html .ak-isuzu-katalog-img-frame::before {
 content: "";
 position: absolute;
 inset: 0;
 z-index: 4;
 border-radius: 34px;
 border: 2px solid rgba(255,255,255,0.82);
 box-shadow: inset 0 1px 0 rgba(255,255,255,0.95), 
inset 0 -1px 0 rgba(110,165,196,0.16), 
inset 0 0 34px rgba(255,255,255,0.18);
 pointer-events: none;
}

html .ak-isuzu-katalog-img-frame::after {
 content: "";
 position: absolute;
 inset: 0;
 z-index: 3;
 border-radius: 34px;
 background: linear-gradient(135deg, rgba(255,255,255,0.20) 0%, rgba(255,255,255,0.00) 34%), 
radial-gradient(circle at 10% 8%, rgba(255,255,255,0.26), rgba(255,255,255,0.00) 30%), 
radial-gradient(circle at 92% 6%, rgba(191,238,255,0.24), rgba(191,238,255,0.00) 32%);
 pointer-events: none;
}

html .ak-isuzu-katalog-img-frame img {
 display: block;
 width: 100%;
 height: auto;
 max-width: none;
 border: 0;
 margin: 0;
 padding: 0;
 outline: none;
 background: transparent;
 box-shadow: none;
 border-radius: 34px;
 clip-path: inset(0 round 34px);
 -webkit-mask-image: -webkit-radial-gradient(white, black);
 transform: translateZ(0);
}

html .ak-isuzu-katalog-html div, html .ak-isuzu-katalog-html img {
 outline: none;
}

.ak-glass-card h2, .ak-glass-card-strong h2 {
 font-size: var(--ak-fs-h2);
 line-height: var(--ak-lh-heading);
 margin: 0 0 10px 0;
}

.ak-glass-kpi h2 {
 font-size: var(--ak-fs-h2-kpi);
 line-height: var(--ak-lh-heading);
 margin: 0 0 10px 0;
}

.ak-glass-card .ak-liquid-text, .ak-glass-card-strong .ak-liquid-text, .ak-glass-kpi .ak-liquid-text {
 font-size: var(--ak-fs-lead);
 line-height: var(--ak-lh-lead);
}

.ak-liquid-pill, .ak-iz-kicker-light, .ak-iz-kicker-dark {
 font-size: var(--ak-fs-pill);
}

.ak-liquid-icon {
 font-size: 22px;
 line-height: 1;
}

.ak-no-hyphen, .ak-no-hyphen , .ak-liquid-page, .ak-liquid-page , [class="ak-gebrauchtwagen-"], [class="ak-gebrauchtwagen-"] * {
 -webkit-hyphens: none !important;
 -moz-hyphens: none !important;
 -ms-hyphens: none !important;
 hyphens: none !important;
 hyphenate-limit-chars: 999 !important;
 word-break: normal !important;
 overflow-wrap: break-word !important;
 -webkit-hyphenate-character: "" !important;
}

.ak-no-hyphen h1, .ak-no-hyphen h2, .ak-no-hyphen h3, .ak-no-hyphen h4, .ak-liquid-page h1, .ak-liquid-page h2, .ak-liquid-page h3, .ak-liquid-page h4, .ak-liquid-title {
 -webkit-hyphens: none !important;
 hyphens: none !important;
 word-break: keep-all !important;
 overflow-wrap: normal !important;
 text-wrap: balance;
}

.ak-glass-dark strong, .ak-glass-card strong, .ak-liquid-page strong, .ak-no-hyphen strong {
 -webkit-hyphens: none !important;
 hyphens: none !important;
 overflow-wrap: normal !important;
 word-break: normal !important;
}

.ak-no-hyphen[lang], .ak-liquid-page[lang], [class="ak-gebrauchtwagen-"][lang] {
 -webkit-hyphens: none !important;
 hyphens: none !important;
}

.ak-liquid-page h1, .ak-no-hyphen h1, [class="ak-gebrauchtwagen-"] h1.ak-liquid-title, [class*="ak-gebrauchtwagen-"] h1 {
 font-size: clamp(24px, 6.2vw, 44px) !important;
 line-height: 1.15 !important;
 letter-spacing: -0.02em !important;
 overflow-wrap: break-word !important;
 word-break: normal !important;
 hyphens: none !important;
}

.ak-liquid-page h2, .ak-no-hyphen h2, [class="ak-gebrauchtwagen-"] h2 {
 font-size: clamp(20px, 5.2vw, 34px) !important;
 line-height: 1.2 !important;
 letter-spacing: -0.02em !important;
 overflow-wrap: break-word !important;
 word-break: normal !important;
 hyphens: none !important;
}

.ak-liquid-page h3, .ak-no-hyphen h3, [class="ak-gebrauchtwagen-"] h3, .ak-liquid-page h3.ak-liquid-title {
 font-size: clamp(17px, 4.4vw, 22px) !important;
 line-height: 1.25 !important;
 letter-spacing: -0.015em !important;
 overflow-wrap: break-word !important;
 word-break: normal !important;
 hyphens: none !important;
}

.ak-liquid-page .ak-glass-kpi .ak-liquid-title, [class="ak-gebrauchtwagen-"] .ak-glass-kpi .ak-liquid-title {
 font-size: clamp(16px, 4.2vw, 22px) !important;
 line-height: 1.2 !important;
 overflow-wrap: break-word !important;
 word-break: normal !important;
}

.ak-liquid-page .ak-liquid-title, [class="ak-gebrauchtwagen-"] .ak-liquid-title, .ak-liquid-page h1, .ak-liquid-page h2, .ak-liquid-page h3 {
 max-width: 100% !important;
 min-width: 0 !important;
}

.ak-liquid-page h1, .ak-liquid-page h2, .ak-liquid-page h3, .ak-liquid-page .ak-liquid-title, [class="ak-gebrauchtwagen-"] h1, [class*="ak-gebrauchtwagen-"] h2, [class*="ak-gebrauchtwagen-"] h3 {
 overflow-wrap: break-word !important;
 word-break: normal !important;
 -webkit-hyphens: none !important;
 hyphens: none !important;
}

html body .ak-liquid-page a.ak-glass-button *, html body .ak-liquid-page button.ak-glass-button *, html body a.ak-glass-button *, html body button.ak-glass-button * {
 color: #ffffff !important;
 -webkit-text-fill-color: #ffffff !important;
}

html body .ak-liquid-page a.ak-glass-button:hover, html body .ak-liquid-page a.ak-glass-button:focus, html body .ak-liquid-page button.ak-glass-button:hover, html body .ak-liquid-page button.ak-glass-button:focus, html body a.ak-glass-button:hover, html body a.ak-glass-button:focus, html body button.ak-glass-button:hover, html body button.ak-glass-button:focus {
 color: #ffffff !important;
 -webkit-text-fill-color: #ffffff !important;
 background: linear-gradient(135deg, #07364a 0%, #064f55 58%, #0f5b6b 100%) !important;
 background-color: #07364a !important;
}

html body .ak-liquid-page a.ak-glass-button-light *, html body .ak-liquid-page button.ak-glass-button-light *, html body a.ak-glass-button-light *, html body button.ak-glass-button-light * {
 color: #064f55 !important;
 -webkit-text-fill-color: #064f55 !important;
}

html body .ak-liquid-page a.ak-glass-button-light:hover, html body .ak-liquid-page a.ak-glass-button-light:focus, html body .ak-liquid-page button.ak-glass-button-light:hover, html body .ak-liquid-page button.ak-glass-button-light:focus, html body a.ak-glass-button-light:hover, html body a.ak-glass-button-light:focus, html body button.ak-glass-button-light:hover, html body button.ak-glass-button-light:focus {
 color: #07364a !important;
 -webkit-text-fill-color: #07364a !important;
 background: #ffffff !important;
 background-color: #ffffff !important;
 border-color: #064f55 !important;
}

/* ##########################################################################
 7. BUTTONS & FORMULARE
 ########################################################################## */

#section-testimonials-form .link-default {
 text-decoration: underline;
}

.btn {
 border-radius: 50px;
 padding: 8px 24px 8px 16px;
 font-weight: 600;
}

body:not(.site-home) .btn {
 padding: 8px 16px;
}

body:not(.fe-admin-area).site-home .btn-primary::after, body:not(.fe-admin-area).site-home .btn-default::after {
 font-family: FontAwesome;
 content: "";
 font-size: 1rem;
 position: relative;
 top: 1px;
 left: 10px;
 font-weight: 400;
}

.btn-primary {
 background: var(--ak-ice);
 border-color: var(--ak-primary);
 color: var(--ak-primary);
}

.btn-primary:hover, .btn-primary:focus, .btn-primary.active, .btn-primary.active.focus, .btn-primary.active:focus, .btn-primary.active:hover, .btn-primary.focus:active, .btn-primary:active:focus, .btn-primary:active:hover {
 background: var(--ak-primary);
 border-color: var(--ak-primary);
 color: var(--ak-ice);
}

.btn-default {
 background: var(--ak-primary);
 color: var(--ak-white);
 border-color: transparent;
}

.btn-default:hover, .btn-default.active {
 background-color: var(--ak-ice);
 border-color: var(--ak-primary);
 color: var(--ak-primary);
}

.jobs-and-career {
 margin-bottom: 220px;
 margin-top: 120px;
}

.jobs-and-career img {
 border-radius: 40px;
 position: relative;
 top: 45px;
 left: 20px;
}

.jobs-and-career > .container > .row {
 background-color: var(--ak-white);
 margin-top: 80px;
}

.jobs-and-career .content-text {
 padding: 45px 60px;
}

.home-tiles .tile-bg-img .btn {
 position: absolute;
 bottom: 50px;
}

.home-tiles .tile a:not(.btn) {
 padding-top: 138px;
 padding-bottom: 339px;
}

html body .btn-white, html body .button-white, html body .cta-white, html body a.btn[style*="background:#fff"], html body a.btn[style*="background: #fff"], html body a.btn[style*="background:#ffffff"], html body button[style*="background:#fff"], html body .btn[class*="light"], html body .btn-light, html body .button-light {
 background-color: #ffffff !important;
 color: #0f5b6b !important;
 border: 1px solid #0f5b6b !important;
}

html body .btn-white *, html body .button-white *, html body .cta-white *, html body .btn-light *, html body .button-light * {
 color: #0f5b6b !important;
}

html body .btn-petrol, html body .button-petrol, html body .cta-petrol, html body .btn-primary, html body .button-primary, html body .btn-dark, html body .button-dark, html body .btn[class*="petrol"], html body .btn[class*="teal"], html body .btn[class*="primary"] {
 background-color: #0f5b6b !important;
 color: #ffffff !important;
 border: 1px solid #0f5b6b !important;
}

html body .btn-petrol *, html body .button-petrol *, html body .cta-petrol *, html body .btn-primary *, html body .button-primary *, html body .btn-dark *, html body .button-dark * {
 color: #ffffff !important;
}

html body a.cta, html body button.cta, html body .cta-button, html body .call-to-action {
 color: #ffffff !important;
 background-color: #0f5b6b !important;
}

html body a.cta.light, html body a.cta.white, html body button.cta.light, html body .cta-button.light, html body .call-to-action.light {
 color: #0f5b6b !important;
 background-color: #ffffff !important;
 border: 1px solid #0f5b6b !important;
}

/* ##########################################################################
 8. SONSTIGES / FOOTER / UTILITIES
 ########################################################################## */

.auda-padding-x-small {
 padding-right: var(--space-s);
 padding-left: var(--space-s);
}

.auda-padding-y-small {
 padding-top: var(--space-s);
 padding-bottom: var(--space-s);
}

.auda-padding-medium {
 padding: var(--space-m);
}

.auda-padding-extra-large {
 padding: var(--space-xl);
}

.auda-h-100 {
 height: 100%;
}

.bg-primary {
 background-color: var(--ak-primary);
 color: var(--ak-white);
}

.tooltip {
 z-index: 1;
}

#site-content, body.site-home #site-content {
 padding-top: 0;
}

body.site-home #site-content {
 padding-bottom: 0;
}

.nav-area-lines {
 margin-top: 30px;
}

.nav-area-lines > .container-fluid {
 background: var(--ak-ice);
}

.transparent-bg-image {
 background: linear-gradient(180deg, rgba(0,67,78,0.80) 0%, rgba(0,67,78,0.00) 100%);
 height: 70%;
 top: 0;
}

body.site-home .carousel-caption {
 display: none;
}

.left-colorblock-bg {
 background: linear-gradient(to right, var(--ak-primary) 0%, var(--ak-primary) 75%, transparent 75%, transparent 100%);
 color: var(--ak-white);
}

.left-colorblock-bg > .container > .row {
 padding: 90px 0;
 min-height: 547px;
}

.owl-theme .owl-nav button.owl-prev, .owl-theme .owl-nav button.owl-next {
 background: transparent;
 top: 105%;
 color: var(--ak-black);
}

.home-tiles .tile {
 min-height: 500px;
 background: var(--ak-white);
 border-radius: 40px;
}

.home-tiles .tile .tile-content {
 padding: 40px 120px 40px 40px;
}

.home-tiles .tile img {
 border-radius: 40px 40px 0 0;
 max-height: 300px;
 width: 100%;
 object-fit: cover;
}

.home-tiles .tile .tile-content h2 {
 color: var(--ak-primary);
}

.home-tiles .tile-bg-img {
 border-radius: 40px;
}

.home-tiles .tile-bg-img .tile-content {
 background: transparent;
 color: var(--ak-white);
 padding: 75px 40px;
}

.home-tiles .tile-bg-img .tile-content h2 {
 color: var(--ak-white);
}

.home-tiles .tile:not(.tile-bg-img) .tile-content::after {
 content: "";
 font-family: FontAwesome;
 font-size: 2rem;
 background: var(--ak-primary);
 border-radius: 40px;
 padding: 0 15px 0 19px;
 color: var(--ak-white);
 position: absolute;
 right: 59px;
 bottom: 50px;
}

.home-tiles .tile p {
 overflow: hidden;
 text-overflow: ellipsis;
}

#tile-werkstatt-service {
 background: linear-gradient(180deg, rgba(0,50,54,0.90) 0%, rgba(0,75,81,0.90) 70.19%, rgba(0,108,115,0.90) 100%), 
url("/website/themes/autohaus-kamen.eu/dynamic/fe/startseite/kamen-kachel-werkstatt.jpg") center / cover no-repeat;
}

#tile-autohaus-werte {
 background: linear-gradient(180deg, rgba(0,50,54,0.90) 0%, rgba(0,75,81,0.90) 70.19%, rgba(0,108,115,0.90) 100%), 
url("/website/themes/autohaus-kamen.eu/dynamic/fe/startseite/kamen-kachel-autohaus.jpg") center / cover no-repeat;
}

.site-home .parallax-content {
 display: block;
 height: 100%;
 padding: 170px 0 0;
 color: var(--ak-white);
 background: linear-gradient(180deg, rgba(0,50,54,0.90) 0%, rgba(0,75,81,0.90) 70.19%, rgba(0,108,115,0.90) 100%);
}

.site-home .parallax-content-content {
 width: 1580px;
 margin: 0 auto;
}

.site-home .parallax-content h2, .site-home .parallax-content p {
 width: 50%;
}

.site-home .parallax-content h2 {
 color: var(--ak-white);
}

.site-home .parallax-content p {
 margin: 45px 0;
}

.well {
 background-color: var(--ak-white);
 border: 1px solid var(--ak-primary);
}

#toolbar-container button {
 color: var(--ak-primary);
 padding: 0;
}

#footer #footer_info_box {
 text-align: left;
}

#footer #menu-social-floating a, #menu-social-floating .instagramflat:not(:hover) i, #menu-social-floating .instagramflat {
 border-radius: 40px;
}

#menu-social-floating .instagramflat:not(:hover) i, #menu-social-floating .instagramflat, #menu-social-floating a, #menu-social-floating .facebookflat {
 background: var(--ak-black);
}

#footer #menu-social-floating a:hover {
 color: var(--ak-black);
 background: #eaf8fe;
}

.link-default:hover, .link-pfeil:hover {
 color: var(--ak-black);
}

.site-home .collapse-menu-icon.collapsed::after {
 transform: rotate(90deg) translateY(0%);
}

.site-home .collapse-menu-icon::after {
 transform: rotate(270deg) translateY(0%);
}

html .no-margin-to-title {
 margin-top: -280px;
}

.breadcrumb_area {
 background: var(--ak-ice);
}

#section-consultants:not(.consultants-view-2) .user-picture {
 border-radius: 150px;
}

#section-service-brands-ajax {
 background: transparent;
 box-shadow: none;
}

.rounded {
 border-radius: 40px;
}

.auda-space {
 padding: 40px;
}

.auda-card-group-1 {
 display: flex;
 flex-wrap: wrap;
}

.auda-card-group-1 .ge-content, .auda-card-group-1 .auda-card {
 height: 100%;
}

.auda-card-group-1 .column {
 margin-bottom: 30px;
}

.auda-card-group-1 .auda-card {
 background: var(--ak-white);
 position: relative;
 display: flex;
 flex-direction: column;
 border-radius: 40px;
}

.auda-card-group-1 .auda-card-body, .auda-card-group-1 .auda-card-footer {
 padding: 1.25rem;
}

.auda-card-group-1 .auda-card-body {
 flex: 1 1 auto;
}

.auda-round-border {
 border-radius: 14px;
}

.auda-shadow {
 box-shadow: 0 2px 20px rgba(0,0,0,0.25);
}

.price-element {
 display: flex;
 padding: 10px;
 margin: 0 auto;
}

.price-icon {
 width: 26px;
}

.price-vehicle-name {
 padding-left: 10px;
 width: 75%;
}

.price-headline {
 padding: 10px;
 background-color: var(--ak-primary);
 color: var(--ak-white);
 border-radius: 10px;
 margin: 0 auto;
}

.price-price {
 width: 25%;
 text-align: right;
}

.kundenmeinungen, .kundenmeinungen-wrapper, .customer-opinions, .customer-opinions-wrapper, .customer-reviews, .customer-reviews-wrapper, .review-area, .rating-area, .rating-wrapper, .mobile-rating, .mobile-rating-wrapper, .mobile-rating-area, .pre-footer, .prefooter, .footer-pre-area, .footer-before, .footer-top, #pre-footer, #prefooter {
 background: var(--ak-petrol-dark);
 background-color: var(--ak-petrol-dark);
 color: var(--ak-white);
}

html .kundenmeinungen > div, html .customer-opinions > div, html .customer-reviews > div, html .review-area > div, html .rating-area > div, html .mobile-rating > div, html .pre-footer > div, html .prefooter > div, html .footer-pre-area > div, html .footer-before > div, html .footer-top > div {
 background-color: transparent;
}

html .kundenmeinungen, html .kundenmeinungen *, html .customer-opinions, html .customer-opinions *, html .customer-reviews, html .customer-reviews *, html .review-area, html .review-area *, html .rating-area, html .rating-area *, html .mobile-rating, html .mobile-rating *, html .pre-footer, html .pre-footer *, html .prefooter, html .prefooter *, html .footer-pre-area, html .footer-pre-area *, html .footer-before, html .footer-before *, html .footer-top, html .footer-top * {
 color: var(--ak-white);
}

html .kundenmeinungen img, html .customer-opinions img, html .customer-reviews img, html .review-area img, html .rating-area img, html .mobile-rating img, html .pre-footer img, html .prefooter img, html .footer-pre-area img, html .footer-before img, html .footer-top img {
 background: transparent;
 color: initial;
}

html p, html .infomanager-area p {
 font-family: Poppins, Arial, sans-serif;
 font-size: clamp(0.95rem, 0.4vw + 0.85rem, 1.0625rem);
 line-height: 1.55;
}

html body, html body *, html body *::before, html body *::after {
 -webkit-hyphens: none !important;
 -ms-hyphens: none !important;
 hyphens: none !important;
 -webkit-hyphenate-limit-before: 999 !important;
 -webkit-hyphenate-limit-after: 999 !important;
 hyphenate-limit-chars: 999 999 999 !important;
 hyphenate-limit-lines: no-limit !important;
 word-break: normal !important;
 overflow-wrap: break-word !important;
 word-wrap: break-word !important;
}

[lang="de"], [lang="de-DE"], [lang^="de"] {
 -webkit-hyphens: none !important;
 hyphens: none !important;
}

html body .kontakt-buttons a, html body .contact-buttons a, html body .ak-contact-buttons a, html body .anliegen-buttons a {
 background-color: #ffffff !important;
 color: #0f5b6b !important;
 border: 1px solid #0f5b6b !important;
}

/* ##########################################################################
 9. MEDIA QUERIES (mobile-first, konsolidiert)
 ########################################################################## */

/* ---------- @supports (-webkit-touch-callout: none) > @media (max-width: 767.98px) (1 Regeln) ---------- */
@supports (-webkit-touch-callout: none) and (not (height: 100dvh)) {
 @media (max-width: 767.98px) {
 #page_sidebar {
 height: -webkit-fill-available;
 max-height: -webkit-fill-available;
 padding-bottom: calc(220px + env(safe-area-inset-bottom));
 }

 }
}


/* ---------- @media (max-width: 380px) (3 Regeln) ---------- */
@media (max-width: 380px) {
 .ak-liquid-page h1, [class="ak-gebrauchtwagen-"] h1 {
 font-size: 22px !important;
 line-height: 1.18 !important;
 }

 .ak-liquid-page h2, [class*="ak-gebrauchtwagen-"] h2 {
 font-size: 19px !important;
 line-height: 1.22 !important;
 }

 .ak-liquid-page h3, [class*="ak-gebrauchtwagen-"] h3 {
 font-size: 16px !important;
 line-height: 1.28 !important;
 }

}


/* ---------- @media (max-width: 400px) (4 Regeln) ---------- */
@media (max-width: 400px) {
 html .ak-slogan-liquid .ak-slogan-text {
 font-size: 0.95rem !important;
 }

 html h1, html .headline-h1 {
 font-size: 1.5rem !important;
 }

 .ak-liquid-page h2, [class="ak-gebrauchtwagen-"] h2 {
 font-size: 18px !important;
 line-height: 1.25 !important;
 }

 .ak-liquid-page h1, [class*="ak-gebrauchtwagen-"] h1 {
 font-size: 21px !important;
 line-height: 1.2 !important;
 }

}


/* ---------- @media (max-width: 479.98px) (17 Regeln) ---------- */
@media (max-width: 479.98px) {
 #page_sidebar .phone-mail-infos a, #page_sidebar .phone-mail-infos .btn, #page_sidebar .extra-mobile-menu > a, #page_sidebar .extra-mobile-menu > a.btn, #page_sidebar .extra-mobile-menu > a.btn-primary, #page_sidebar .extra-mobile-menu > a.btn-default, #page_sidebar a[href^="tel"], #page_sidebar a[href^="mailto"], #page_sidebar a[href*="wa.me"], #page_sidebar a[href*="whatsapp"], #page_sidebar a[href*="9250026"], #page_sidebar a[href*="4923079250026"], #page_sidebar a[href*="77718"], #page_sidebar a[href*="4923077718"] {
 width: calc(100% - 48px);
 max-width: calc(100% - 48px);
 height: 32px;
 min-height: 32px;
 max-height: 32px;
 margin: 6px auto;
 padding: 3px 12px;
 font-size: 0.875rem;
 border-radius: 999px;
 }

 #page_sidebar .phone-mail-infos a *, #page_sidebar .phone-mail-infos .btn *, #page_sidebar .extra-mobile-menu > a *, #page_sidebar a[href^="tel"] *, #page_sidebar a[href^="mailto"] , #page_sidebar a[href="wa.me"] , #page_sidebar a[href="whatsapp"] * {
 font-size: 13.5px;
 }

 html .ak-slogan-liquid .ak-slogan-text {
 max-width: 86%;
 font-size: 0.9375rem;
 line-height: 1.38;
 }

 html .ak-slogan-liquid .ak-glass-card-strong {
 padding: 14px;
 }

 html .ak-slogan-liquid .ak-slogan-card {
 padding: 20px 15px;
 }

 html .ak-no-hyphen .ak-iz-petrol-card div[style*="grid-template-columns"], html .ak-liquid-page .ak-iz-petrol-card div[style*="grid-template-columns"] {
 gap: 10px;
 }

 html .ak-no-hyphen .ak-iz-petrol-card div[style*="border-radius"], html .ak-liquid-page .ak-iz-petrol-card div[style*="border-radius"] {
 min-width: 0;
 padding: 13px 10px;
 border-radius: 18px;
 box-sizing: border-box;
 overflow: hidden;
 }

 html .ak-no-hyphen .ak-iz-petrol-card div[style*="border-radius"] strong, html .ak-liquid-page .ak-iz-petrol-card div[style*="border-radius"] strong {
 display: block;
 font-size: clamp(19px,6.8vw,24px);
 line-height: 1.05;
 letter-spacing: -0.055em;
 margin: 0 0 6px 0;
 max-width: 100%;
 white-space: normal;
 word-break: normal;
 overflow-wrap: normal;
 hyphens: none;
 }

 html .ak-no-hyphen .ak-iz-petrol-card div[style*="border-radius"] span, html .ak-liquid-page .ak-iz-petrol-card div[style*="border-radius"] span {
 display: block;
 font-size: clamp(13px,4.5vw,16px);
 line-height: 1.25;
 letter-spacing: -0.02em;
 max-width: 100%;
 white-space: normal;
 word-break: normal;
 overflow-wrap: normal;
 hyphens: none;
 }

 html .ak-no-hyphen a[href*="terminvereinbarung"], html .ak-no-hyphen a[href*="kontakt"], html .ak-no-hyphen a[href^="tel:"], html .ak-no-hyphen a[href^="mailto:"], html .ak-liquid-page a[href*="terminvereinbarung"], html .ak-liquid-page a[href*="kontakt"], html .ak-liquid-page a[href^="tel:"], html .ak-liquid-page a[href^="mailto:"] {
 font-size: 0.875rem;
 line-height: 1.22;
 padding: 13px 14px;
 min-height: 60px;
 }

 body.site-home .ak-no-hyphen h1, body.site-home .ak-liquid-page h1, body.site-home .ak-home-liquid h1, body.site-home .ak-startseite-liquid h1, body.site-home .ak-liquid-title {
 font-size: clamp(28px,7.4vw,38px);
 }

 body.site-home .ak-no-hyphen h2, body.site-home .ak-liquid-page h2, body.site-home .ak-home-liquid h2, body.site-home .ak-startseite-liquid h2 {
 font-size: clamp(23px,6.5vw,31px);
 }

 body.site-home .ak-no-hyphen p, body.site-home .ak-liquid-page p, body.site-home .ak-home-liquid p, body.site-home .ak-startseite-liquid p {
 font-size: clamp(15.5px,4.2vw,18px);
 line-height: 1.52;
 }

 :root {
 --ak-fs-title: clamp(26px, 8.2vw, 34px);
 --ak-fs-h2: 20px;
 --ak-fs-h2-kpi: 19px;
 }

 .ak-liquid-text, .ak-glass-card .ak-liquid-text, .ak-glass-card-strong .ak-liquid-text, .ak-glass-kpi .ak-liquid-text {
 font-size: 16px;
 }

 [class*="ak-gebrauchtwagen-"] .ak-glass-card {
 padding-left: 14px;
 padding-right: 14px;
 }

 [class*="ak-gebrauchtwagen-"] h1, [class*="ak-gebrauchtwagen-"] h2, [class*="ak-gebrauchtwagen-"] h3 {
 word-break: normal;
 overflow-wrap: normal;
 hyphens: none;
 }

}


/* ---------- @media (max-width: 767.98px) (93 Regeln) ---------- */
@media (max-width: 767.98px) {
 #optional-header-icons {
 top: 70px;
 }

 #header, #header-container {
 height: 174px !important;
 min-height: 174px !important;
 }

 #header nav > .container-fluid {
 display: flex;
 flex-direction: column;
 }

 #header #logo-primary-box {
 float: none !important;
 position: relative !important;
 width: 100% !important;
 height: 70px !important;
 min-height: 70px !important;
 margin: 0 !important;
 padding: 0 16px !important;
 box-sizing: border-box !important;
 z-index: 20 !important;
 }

 #header #logo-primary-box .logo-link {
 align-items: center !important;
 height: 70px !important;
 display: flex !important;
 justify-content: center !important;
 width: 100% !important;
 margin: 0 !important;
 padding: 0 !important;
 }

 #header #logo-primary-box .logo-link img {
 height: auto !important;
 image-rendering: -webkit-optimize-contrast;
 max-height: 70px !important;
 max-width: 100% !important;
 width: auto !important;
 display: block !important;
 margin: 0 auto !important;
 object-fit: contain !important;
 }

 .navbar {
 background: none;
 }

 body.site-home #header-slider {
 display: none;
 }

 .left-colorblock-bg > .container > .row {
 padding: 28px 0 200px;
 min-height: 424px;
 max-width: none;
 }

 .left-colorblock-bg > .container > .row p, .site-home .parallax-content h2, .site-home .parallax-content p {
 width: 100%;
 }

 html .site-home .module-block .container > h2, html .infomanager-area .headline-h2 {
 font-size: 1.875rem;
 }

 .jobs-and-career {
 margin-bottom: 50px;
 }

 .jobs-and-career > .container > .row {
 background-color: transparent;
 margin-top: 40px;
 }

 .jobs-and-career .content-text {
 padding: 40px 0;
 }

 .owl-carousel .owl-stage-outer {
 border-radius: 0;
 }

 html .home-tiles .tile {
 min-height: 0;
 max-height: none;
 height: auto;
 margin: 11px 0;
 }

 .home-tiles .tile .tile-content {
 padding: 25px 70px 25px 25px;
 }

 html .home-tiles .tile p, html .home-tiles .tile .tile-content, html .home-tiles .tile-bg-img .tile-content {
 height: auto;
 max-height: none;
 overflow: visible;
 text-overflow: clip;
 white-space: normal;
 }

 .home-tiles .tile:not(.tile-bg-img) .tile-content::after {
 right: 38px;
 bottom: 24px;
 }

 .home-tiles .tile img {
 max-height: 197px;
 }

 .home-tiles .tile-bg-img .tile-content .btn {
 position: absolute;
 bottom: 37px;
 }

 .home-tiles > .container > .row:first-child {
 margin-bottom: 0;
 }

 .home-tiles .tile a:not(.btn) {
 padding-top: 88px;
 padding-bottom: 280px;
 }

 .individual-slider-button .btn-primary {
 top: inherit;
 left: 16px;
 bottom: 350px;
 }

 #footer #footer_info_box {
 text-align: center;
 }

 .site-home .parallax-content-content {
 width: 100%;
 padding: 0 20px;
 }

 .owl-theme .owl-nav {
 display: none;
 }

 #page_sidebar {
 position: fixed;
 top: 0;
 right: 0;
 bottom: auto;
 left: auto;
 height: 100dvh;
 max-height: 100dvh;
 overflow-y: auto;
 overflow-x: hidden;
 -webkit-overflow-scrolling: touch;
 padding-bottom: calc(180px + env(safe-area-inset-bottom));
 overscroll-behavior: contain;
 }

 #page_sidebar nav, #page_sidebar .nav, #page_sidebar .navbar-nav, #page_sidebar .visible-xs, #page_sidebar [data-id="location-selector-block"], #page_sidebar [data-id="location-info-request"] {
 overflow: visible;
 max-height: none;
 }

 #page_sidebar .footer_copy_menu, #page_sidebar .footer_copy_menu li, #page_sidebar .footer_copy_menu a {
 color: var(--ak-petrol);
 overflow: visible;
 }

 html .ak-slogan-liquid .ak-liquid-stage {
 padding-left: 12px;
 padding-right: 12px;
 }

 html .ak-slogan-liquid .ak-glass-card-strong {
 padding: 18px;
 border-radius: 34px;
 }

 html .ak-slogan-liquid .ak-slogan-card {
 padding: 22px 18px;
 border-radius: 30px;
 overflow: visible;
 }

 html .ak-slogan-liquid .ak-slogan-inner {
 display: grid;
 grid-template-columns: 1fr;
 gap: 18px;
 align-items: center;
 justify-items: center;
 text-align: center;
 }

 html .ak-slogan-liquid .ak-slogan-icon-wrap {
 width: clamp(84px, 22vw, 120px) !important;
 height: auto !important;
 border-radius: 28px;
 order: 0 !important;
 margin: 0 auto 0.5rem !important;
 flex: 0 0 auto !important;
 }

 html .ak-slogan-liquid .ak-slogan-icon-wrap img {
 width: 100% !important;
 height: auto !important;
 display: block !important;
 }

 html .ak-slogan-liquid .ak-slogan-text {
 display: block;
 width: 100% !important;
 max-width: 100% !important;
 min-width: 0;
 margin-left: auto;
 margin-right: auto;
 box-sizing: border-box;
 font-size: clamp(0.95rem, 3.6vw, 1.0625rem) !important;
 line-height: 1.5 !important;
 letter-spacing: -0.025em;
 text-align: center !important;
 white-space: normal;
 word-break: normal;
 overflow-wrap: normal;
 hyphens: none;
 order: 1 !important;
 padding: 0 0.25rem !important;
 }

 html .ak-isuzu-katalog-stage {
 border-radius: 30px;
 padding: 10px;
 }

 html .ak-isuzu-katalog-shell {
 border-radius: 26px;
 padding: 12px;
 }

 html .ak-isuzu-katalog-page {
 border-radius: 28px;
 padding: 9px;
 }

 html .ak-isuzu-katalog-page::after {
 inset: 6px;
 border-radius: 22px;
 }

 html .ak-isuzu-katalog-img-frame, html .ak-isuzu-katalog-img-frame::before, html .ak-isuzu-katalog-img-frame::after, html .ak-isuzu-katalog-img-frame img {
 border-radius: 22px;
 clip-path: inset(0 round 22px);
 }

 body.site-home .ak-no-hyphen:first-of-type, body.site-home .ak-no-hyphen.ak-home-liquid, body.site-home .ak-no-hyphen[style*="Poppins"] {
 margin-top: 38px;
 }

 .ak-liquid-page {
 padding: 0 8px;
 }

 .ak-liquid-stage {
 border-radius: 34px;
 padding: 14px;
 }

 .ak-liquid-grid-2, .ak-liquid-grid-3, .ak-liquid-grid-4, .ak-iz-info-grid, .ak-iz-product-grid {
 grid-template-columns: 1fr;
 }

 .ak-glass-card, .ak-glass-card-strong, .ak-glass-dark, .ak-glass-kpi, .ak-iz-glass-card, .ak-iz-petrol-card {
 border-radius: 24px;
 }

 .ak-liquid-pad-s {
 padding: 18px;
 }

 .ak-liquid-pad-m {
 padding: 22px;
 }

 .ak-liquid-pad-l {
 padding: 24px;
 }

 html .ak-glass-button, html .ak-glass-button-light, html .ak-no-hyphen a.ak-glass-button, html .ak-no-hyphen a.ak-glass-button-light, html .ak-iz-btn, html .ak-no-hyphen a.ak-iz-btn {
 width: 100%;
 min-height: 58px;
 text-align: center;
 }

 .ak-liquid-title {
 letter-spacing: -0.03em;
 }

 body.site-home .ak-no-hyphen, body.site-home .ak-liquid-page, body.site-home .ak-home-liquid, body.site-home .ak-startseite-liquid {
 width: 100%;
 max-width: 100%;
 min-width: 0;
 margin-left: auto;
 margin-right: auto;
 padding-left: 8px;
 padding-right: 8px;
 transform: none;
 left: auto;
 right: auto;
 box-sizing: border-box;
 overflow-x: hidden;
 }

 body.site-home .ak-liquid-stage, body.site-home .ak-no-hyphen .ak-liquid-stage, body.site-home .ak-home-liquid .ak-liquid-stage, body.site-home .ak-startseite-liquid .ak-liquid-stage {
 width: 100%;
 max-width: 100%;
 min-width: 0;
 margin-left: auto;
 margin-right: auto;
 padding-left: 14px;
 padding-right: 14px;
 box-sizing: border-box;
 }

 body.site-home .ak-glass-card, body.site-home .ak-glass-card-strong, body.site-home .ak-glass-kpi, body.site-home .ak-glass-dark, body.site-home .ak-iz-petrol-card {
 height: auto;
 min-height: 0;
 max-height: none;
 box-sizing: border-box;
 }

 body.site-home .ak-no-hyphen h1, body.site-home .ak-no-hyphen h2, body.site-home .ak-no-hyphen h3, body.site-home .ak-no-hyphen h4, body.site-home .ak-no-hyphen p, body.site-home .ak-no-hyphen span, body.site-home .ak-no-hyphen strong, body.site-home .ak-liquid-page h1, body.site-home .ak-liquid-page h2, body.site-home .ak-liquid-page h3, body.site-home .ak-liquid-page h4, body.site-home .ak-liquid-page p, body.site-home .ak-liquid-page span, body.site-home .ak-liquid-page strong, body.site-home .ak-home-liquid h1, body.site-home .ak-home-liquid h2, body.site-home .ak-home-liquid h3, body.site-home .ak-home-liquid h4, body.site-home .ak-home-liquid p, body.site-home .ak-home-liquid span, body.site-home .ak-home-liquid strong {
 max-width: 100%;
 min-width: 0;
 margin-left: 0;
 margin-right: 0;
 transform: none;
 left: auto;
 right: auto;
 white-space: normal;
 word-break: normal;
 overflow-wrap: normal;
 word-wrap: normal;
 hyphens: none;
 box-sizing: border-box;
 }

 body.site-home .ak-no-hyphen h1, body.site-home .ak-liquid-page h1, body.site-home .ak-home-liquid h1, body.site-home .ak-startseite-liquid h1, body.site-home .ak-liquid-title {
 font-size: clamp(30px,8.2vw,42px);
 line-height: 1.10;
 letter-spacing: -0.045em;
 }

 body.site-home .ak-no-hyphen h2, body.site-home .ak-liquid-page h2, body.site-home .ak-home-liquid h2, body.site-home .ak-startseite-liquid h2 {
 font-size: clamp(25px,7vw,34px);
 line-height: 1.14;
 letter-spacing: -0.035em;
 }

 body.site-home .ak-no-hyphen h3, body.site-home .ak-liquid-page h3, body.site-home .ak-home-liquid h3, body.site-home .ak-startseite-liquid h3 {
 font-size: clamp(20px,5.6vw,27px);
 line-height: 1.18;
 letter-spacing: -0.025em;
 }

 body.site-home .ak-no-hyphen p, body.site-home .ak-liquid-page p, body.site-home .ak-home-liquid p, body.site-home .ak-startseite-liquid p {
 font-size: clamp(16px,4.45vw,19px);
 line-height: 1.55;
 letter-spacing: -0.015em;
 }

 body.site-home .ak-no-hyphen div[style*="border-radius"], body.site-home .ak-liquid-page div[style*="border-radius"], body.site-home .ak-home-liquid div[style*="border-radius"], body.site-home .ak-startseite-liquid div[style*="border-radius"], body.site-home .ak-no-hyphen div[style*="grid-template-columns"], body.site-home .ak-liquid-page div[style*="grid-template-columns"], body.site-home .ak-home-liquid div[style*="grid-template-columns"], body.site-home .ak-startseite-liquid div[style*="grid-template-columns"] {
 max-width: 100%;
 min-width: 0;
 box-sizing: border-box;
 }

 body.site-home .ak-no-hyphen div[style*="grid-template-columns"], body.site-home .ak-liquid-page div[style*="grid-template-columns"], body.site-home .ak-home-liquid div[style*="grid-template-columns"], body.site-home .ak-startseite-liquid div[style*="grid-template-columns"] {
 gap: 14px;
 }

 #header .visible-xs {
 display: block;
 visibility: visible;
 }

 html .ak-no-hyphen, html .ak-no-hyphen *, html .ak-liquid-page, html .ak-liquid-page * {
 hyphens: auto !important;
 -webkit-hyphens: auto !important;
 overflow-wrap: anywhere !important;
 word-break: normal !important;
 min-width: 0;
 }

 html .ak-no-hyphen a.ak-glass-button, html .ak-no-hyphen a.ak-glass-button *, html .ak-no-hyphen a.ak-glass-button-light, html .ak-no-hyphen a.ak-glass-button-light *, html .ak-no-hyphen a.ak-iz-btn, html .ak-no-hyphen a.ak-iz-btn *, html .ak-no-hyphen a.ak-iz-btn-dark, html .ak-no-hyphen a.ak-iz-btn-dark *, html .ak-no-hyphen a.ak-iz-btn-light, html .ak-no-hyphen a.ak-iz-btn-light *, html .ak-no-hyphen .ak-liquid-pill, html .ak-no-hyphen .ak-liquid-pill * {
 hyphens: none !important;
 -webkit-hyphens: none !important;
 overflow-wrap: normal !important;
 word-break: normal !important;
 }

 html, html body, html *:not(pre):not(code) {
 -webkit-hyphens: none !important;
 -moz-hyphens: none !important;
 -ms-hyphens: none !important;
 hyphens: none !important;
 word-break: normal !important;
 overflow-wrap: anywhere !important;
 }

 html h1, html .headline-h1 {
 font-size: clamp(1.5rem, 6.5vw, 2rem);
 line-height: 1.18;
 }

 html h2, html .headline-h2 {
 font-size: clamp(1.25rem, 5vw, 1.625rem);
 line-height: 1.22;
 }

 html h3, html .headline-h3 {
 font-size: clamp(1.05rem, 4vw, 1.25rem);
 }

 html .ak-slogan-liquid .ak-slogan-card, html .ak-slogan-liquid .ak-slogan-inner {
 display: flex !important;
 flex-direction: column !important;
 align-items: center !important;
 justify-content: flex-start !important;
 text-align: center !important;
 gap: 1rem !important;
 padding: 1.25rem !important;
 }

 html .ak-slogan-liquid .ak-liquid-stage, html .ak-slogan-liquid .ak-glass-card-strong {
 width: 100% !important;
 max-width: 100% !important;
 aspect-ratio: auto !important;
 min-height: 0 !important;
 }

 h2 a[href="/bosch-car-service-kamen/"] {
 font-size: 18px !important;
 line-height: 22.5px !important;
 }

 html body #header, html body #header .header-inner, html body #header .navbar, html body #header .navbar-left, html body #header .navbar-right, html body #header .navbar-header, html body .brand-logos, html body .ak-marken-logos, html body .ak-partner-logos {
 background-color: var(--ak-ice) !important;
 background-image: none !important;
 }

 html body header, html body > header, html body #header, html body .header, html body .navbar, html body .navbar-header, html body .navbar-brand, html body .logo-wrap, html body #logo, html body #logo-primary-box, html body .brand-logos, html body .ak-brand-logos, html body .ak-marken-logos, html body .ak-partner-logos, html body .partner-logos {
 background: #dff5ff !important;
 background-color: #dff5ff !important;
 background-image: none !important;
 }

 #header nav > .container-fluid, #header nav > .container-limited {
 position: relative !important;
 display: flex !important;
 flex-direction: column !important;
 width: 100% !important;
 max-width: 100% !important;
 min-height: 174px !important;
 margin: 0 !important;
 padding: 0 !important;
 box-sizing: border-box !important;
 overflow: visible !important;
 }

 #header .navbar-left {
 position: absolute !important;
 top: 76px !important;
 left: 50% !important;
 transform: translateX(-50%) !important;
 display: flex !important;
 visibility: visible !important;
 opacity: 1 !important;
 float: none !important;
 align-items: center !important;
 justify-content: center !important;
 width: calc(100% - 32px) !important;
 max-width: 390px !important;
 min-width: 0 !important;
 height: 38px !important;
 min-height: 38px !important;
 margin: 0 !important;
 padding: 0 8px !important;
 box-sizing: border-box !important;
 overflow: visible !important;
 z-index: 30 !important;
 }

 #header .navbar-left .row, #header .navbar-left .column, #header .navbar-left .ge-content {
 display: flex !important;
 visibility: visible !important;
 opacity: 1 !important;
 flex-direction: row !important;
 flex-wrap: nowrap !important;
 align-items: center !important;
 justify-content: center !important;
 gap: 12px !important;
 width: 100% !important;
 max-width: 100% !important;
 min-width: 0 !important;
 height: 38px !important;
 min-height: 38px !important;
 margin: 0 !important;
 padding: 0 !important;
 box-sizing: border-box !important;
 overflow: visible !important;
 }

 #header .navbar-left a {
 display: flex !important;
 visibility: visible !important;
 opacity: 1 !important;
 flex: 0 1 auto !important;
 align-items: center !important;
 justify-content: center !important;
 width: auto !important;
 min-width: 0 !important;
 height: 34px !important;
 margin: 0 !important;
 padding: 0 !important;
 box-sizing: border-box !important;
 overflow: visible !important;
 }

 #header .navbar-left img {
 display: block !important;
 visibility: visible !important;
 opacity: 1 !important;
 flex: 0 1 auto !important;
 width: auto !important;
 height: auto !important;
 max-width: 76px !important;
 max-height: 30px !important;
 margin: 0 !important;
 padding: 0 !important;
 object-fit: contain !important;
 }

 #header #optional-header-icons {
 top: 120px !important;
 left: 0 !important;
 display: flex !important;
 align-items: center !important;
 justify-content: flex-end !important;
 width: 100% !important;
 height: 46px !important;
 margin: 0 !important;
 padding-right: max(16px, env(safe-area-inset-right)) !important;
 box-sizing: border-box !important;
 z-index: 40 !important;
 }

 html #header-container, html #header {
 position: relative !important;
 top: auto !important;
 right: auto !important;
 bottom: auto !important;
 left: auto !important;
 width: 100% !important;
 transform: none !important;
 translate: none !important;
 z-index: auto !important;
 }

 html #header-container.is-fixed, html #header-container.fixed, html #header-container.sticky, html #header.is-fixed, html #header.fixed, html #header.sticky, html body.header-fixed #header-container, html body.header-fixed #header {
 position: relative !important;
 top: auto !important;
 transform: none !important;
 }

 html body {
 padding-top: 0 !important;
 }

 html .ak-digitaldienste-liquid, html .ak-digitaldienste-liquid * {
 text-shadow: none;
 }

 html .ak-digitaldienste-liquid .ak-glass-card, html .ak-digitaldienste-liquid .ak-glass-card *, html .ak-digitaldienste-liquid .ak-glass-card-strong, html .ak-digitaldienste-liquid .ak-glass-card-strong *, html .ak-digitaldienste-liquid .ak-glass-kpi, html .ak-digitaldienste-liquid .ak-glass-kpi * {
 color: #064f55 !important;
 -webkit-text-fill-color: #064f55 !important;
 }

 html .ak-digitaldienste-liquid .ak-glass-dark, html .ak-digitaldienste-liquid .ak-glass-dark *, html .ak-digitaldienste-liquid .ak-glass-dark h1, html .ak-digitaldienste-liquid .ak-glass-dark h2, html .ak-digitaldienste-liquid .ak-glass-dark h3, html .ak-digitaldienste-liquid .ak-glass-dark h4, html .ak-digitaldienste-liquid .ak-glass-dark p, html .ak-digitaldienste-liquid .ak-glass-dark span, html .ak-digitaldienste-liquid .ak-glass-dark strong, html .ak-digitaldienste-liquid .ak-glass-dark div, html .ak-digitaldienste-liquid .ak-glass-dark li, html .ak-digitaldienste-liquid .ak-digital-dark-title, html .ak-digitaldienste-liquid .ak-digital-dark-text {
 color: #ffffff !important;
 -webkit-text-fill-color: #ffffff !important;
 }

 html .ak-digitaldienste-liquid .ak-glass-dark a.ak-glass-button-light, html .ak-digitaldienste-liquid .ak-glass-dark .ak-glass-button-light {
 background: #ffffff !important;
 color: #064f55 !important;
 -webkit-text-fill-color: #064f55 !important;
 border-color: rgba(255,255,255,0.95) !important;
 text-decoration: none !important;
 }

 html .ak-digitaldienste-liquid .ak-glass-dark a.ak-glass-button-light *, html .ak-digitaldienste-liquid .ak-glass-dark .ak-glass-button-light * {
 color: #064f55 !important;
 -webkit-text-fill-color: #064f55 !important;
 }

 html .ak-digitaldienste-liquid .ak-glass-dark a.ak-glass-button-light:hover, html .ak-digitaldienste-liquid .ak-glass-dark a.ak-glass-button-light:focus {
 background: #064f55 !important;
 color: #ffffff !important;
 -webkit-text-fill-color: #ffffff !important;
 border-color: #ffffff !important;
 }

 html .ak-digitaldienste-liquid .ak-glass-card .ak-liquid-pill, html .ak-digitaldienste-liquid .ak-glass-card-strong .ak-liquid-pill, html .ak-digitaldienste-liquid .ak-glass-kpi .ak-liquid-pill, html .ak-digitaldienste-liquid .ak-digital-meta {
 color: #064f55 !important;
 -webkit-text-fill-color: #064f55 !important;
 }

 html .ak-digitaldienste-liquid .ak-glass-dark .ak-liquid-pill, html .ak-digitaldienste-liquid .ak-glass-dark .ak-digital-meta {
 color: #ffffff !important;
 -webkit-text-fill-color: #ffffff !important;
 border-color: rgba(255,255,255,0.85) !important;
 }

 html .ak-digitaldienste-liquid .ak-glass-kpi div[style*="border-radius: 999px"] {
 color: #ffffff !important;
 -webkit-text-fill-color: #ffffff !important;
 }

 html .ak-digitaldienste-liquid h1, html .ak-digitaldienste-liquid h2, html .ak-digitaldienste-liquid h3, html .ak-digitaldienste-liquid h4, html .ak-digitaldienste-liquid p, html .ak-digitaldienste-liquid span, html .ak-digitaldienste-liquid strong, html .ak-digitaldienste-liquid a {
 -webkit-hyphens: none !important;
 -ms-hyphens: none !important;
 hyphens: none !important;
 word-break: normal !important;
 overflow-wrap: normal !important;
 }

}


/* ---------- @media (max-width: 768px) (2 Regeln) ---------- */
@media (max-width: 768px) {
 :root {
 --ak-fs-title: clamp(28px, 7.6vw, 40px);
 --ak-fs-h2: 22px;
 --ak-fs-h2-kpi: 20px;
 }

 .ak-liquid-text, .ak-glass-card .ak-liquid-text, .ak-glass-card-strong .ak-liquid-text, .ak-glass-kpi .ak-liquid-text {
 font-size: 17px;
 line-height: 1.65;
 }

}


/* ---------- @media (max-width: 1023.98px) (18 Regeln) ---------- */
@media (max-width: 1023.98px) {
 .breadcrumb_area, .breadcrumb-area, .breadcrumb-wrapper, .breadcrumb-container, #breadcrumb, #breadcrumbs, .page-title-area, .content-title-area {
 display: block;
 }

 h1, .headline-h1 {
 font-size: 1.875rem;
 }

 h2, .headline-h2 {
 font-size: 1.25rem;
 }

 h3, .headline-h3 {
 font-size: 1rem;
 }

 h4, .headline-h4 {
 font-size: 1.3125rem;
 font-style: italic;
 }

 h5, .headline-h5 {
 font-weight: 700;
 font-size: 1.125rem;
 font-style: italic;
 }

 h6, .headline-h6 {
 font-weight: 700;
 font-size: 0.875rem;
 font-style: italic;
 }

 .left-colorblock-bg {
 background: var(--ak-primary);
 }

 .jobs-and-career img {
 left: 0;
 top: 0;
 }

 .jobs-and-career > .container > .row {
 border-radius: 42px;
 }

 #page_sidebar a[href^="tel"]::before, #page_sidebar .phone-mail-infos a[href^="tel"]::before, #page_sidebar a[href="wa.me"]::before, #page_sidebar a[href*="whatsapp"]::before, #page_sidebar a[href*="4923079250026"]::before, #page_sidebar a[href*="4923077718"]::before, #page_sidebar a[href*="9250026"]::before, #page_sidebar a[href*="77718"]::before {
 content: none;
 display: none;
 }

 #page_sidebar .phone-mail-infos a, #page_sidebar .phone-mail-infos .btn, #page_sidebar .extra-mobile-menu > a, #page_sidebar .extra-mobile-menu > a.btn, #page_sidebar .extra-mobile-menu > a.btn-primary, #page_sidebar .extra-mobile-menu > a.btn-default, #page_sidebar a[href^="tel"], #page_sidebar a[href^="mailto"], #page_sidebar a[href*="wa.me"], #page_sidebar a[href*="whatsapp"], #page_sidebar a[href*="9250026"], #page_sidebar a[href*="4923079250026"], #page_sidebar a[href*="77718"], #page_sidebar a[href*="4923077718"] {
 position: relative;
 display: flex;
 align-items: center;
 justify-content: center;
 gap: 7px;
 width: calc(100% - 60px);
 max-width: calc(100% - 60px);
 min-width: 0;
 height: 36px;
 min-height: 36px;
 max-height: 36px;
 margin: 7px auto;
 padding: 4px 14px;
 background: var(--ak-ice);
 border: none;
 outline: none;
 border-radius: 999px;
 box-shadow: inset 0 0 0 2px var(--ak-petrol), 
inset 0 1px 0 rgba(255,255,255,0.88);
 font-family: Poppins, Arial, sans-serif;
 font-size: 0.9375rem;
 font-weight: 800;
 line-height: 1;
 letter-spacing: -0.01em;
 color: var(--ak-petrol);
 text-align: center;
 text-decoration: none;
 text-transform: none;
 text-shadow: none;
 overflow: hidden;
 box-sizing: border-box;
 white-space: nowrap;
 }

 #page_sidebar .phone-mail-infos a *, #page_sidebar .phone-mail-infos .btn *, #page_sidebar .extra-mobile-menu > a *, #page_sidebar .extra-mobile-menu > a.btn *, #page_sidebar .extra-mobile-menu > a.btn-primary *, #page_sidebar .extra-mobile-menu > a.btn-default *, #page_sidebar a[href^="tel"] *, #page_sidebar a[href^="mailto"] , #page_sidebar a[href="wa.me"] , #page_sidebar a[href="whatsapp"] , #page_sidebar a[href="9250026"] , #page_sidebar a[href="4923079250026"] , #page_sidebar a[href="77718"] , #page_sidebar a[href="4923077718"] * {
 font-size: 0.875rem;
 font-weight: 700;
 line-height: 1;
 color: var(--ak-petrol);
 fill: var(--ak-petrol);
 stroke: var(--ak-petrol);
 text-shadow: none;
 box-shadow: none;
 }

 #page_sidebar a[href^="tel"] i, #page_sidebar a[href^="tel"] .fa, #page_sidebar a[href*="wa.me"] i, #page_sidebar a[href*="wa.me"] .fa, #page_sidebar a[href*="whatsapp"] i, #page_sidebar a[href*="whatsapp"] .fa, #page_sidebar a[href*="4923079250026"] i, #page_sidebar a[href*="4923079250026"] .fa, #page_sidebar a[href*="4923077718"] i, #page_sidebar a[href*="4923077718"] .fa, #page_sidebar a[href*="9250026"] i, #page_sidebar a[href*="9250026"] .fa, #page_sidebar a[href*="77718"] i, #page_sidebar a[href*="77718"] .fa {
 margin: 0 10px 0 0;
 font-size: 0.875rem;
 line-height: 1;
 }

 #page_sidebar .phone-mail-infos a + a, #page_sidebar .phone-mail-infos .btn + .btn {
 margin-top: 7px;
 }

 .ak-liquid-grid-4, .ak-iz-info-grid, .ak-iz-product-grid {
 grid-template-columns: repeat(2, minmax(0,1fr));
 }

 body.site-home .ak-no-hyphen:first-of-type, body.site-home .ak-no-hyphen.ak-home-liquid, body.site-home .ak-no-hyphen[style*="Poppins"] {
 margin-top: 56px;
 }

 .ak-liquid-grid-3, .ak-iz-grid-hero {
 grid-template-columns: 1fr;
 }

}


/* ---------- V3 RC1: Sidebar-Glas nur Tablet / kleiner Desktop ---------- */
@media (min-width: 768px) and (max-width: 1279.98px) {
 #page_sidebar {
 -webkit-backdrop-filter: blur(22px) saturate(185%);
 backdrop-filter: blur(22px) saturate(185%);
 }
}


/* ---------- @media (max-width: 1279.98px) (13 Regeln) ---------- */
@media (max-width: 1279.98px) {
 html, body {
 overscroll-behavior-y: auto;
 }

 body.menu-open, body.nav-open, body.offcanvas-open, body.mobile-menu-open {
 position: fixed;
 width: 100%;
 height: 100%;
 overflow: hidden;
 }

 #page_sidebar {
 background: radial-gradient(circle at 14% 0%, rgba(255,255,255,0.92), rgba(255,255,255,0.56) 34%, rgba(223,245,255,0.72) 100%), 
linear-gradient(135deg, rgba(255,255,255,0.88), rgba(223,245,255,0.78));
 border-left: 1px solid rgba(255,255,255,0.92);
 box-shadow: 0 28px 70px rgba(30,72,98,0.24), 
inset 0 1px 0 rgba(255,255,255,0.98), 
inset 0 -1px 0 rgba(124,176,204,0.18);
 }

 html .offcanvas, html .offcanvas.show, html .offcanvas-menu, html .offcanvas-menu.show, html .mobile-menu, html .mobile-menu.show, html .mobile-navigation, html .mobile-navigation.show, html .navigation-mobile, html .navigation-mobile.show, html .navbar-collapse, html .navbar-collapse.show, html .navbar-collapse.in, html .main-navigation, html .main-navigation.open, html .navigation, html .navigation.open {
 position: fixed;
 top: 0;
 left: 0;
 right: 0;
 bottom: 0;
 height: auto;
 max-height: none;
 overflow-y: auto;
 overflow-x: hidden;
 -webkit-overflow-scrolling: touch;
 padding-bottom: 260px;
 }

 .offcanvas::after, .offcanvas-menu::after, .mobile-menu::after, .mobile-navigation::after, .navigation-mobile::after, .navbar-collapse::after, .main-navigation::after, .navigation::after {
 content: "";
 display: block;
 height: 220px;
 flex: 0 0 220px;
 }

 html .navbar-collapse.show, html .navbar-collapse.in, html .offcanvas.show, html .offcanvas-menu.show, html .mobile-menu.show, html .mobile-navigation.show, html .navigation.open, html .main-navigation.open {
 height: calc(100dvh - env(safe-area-inset-bottom));
 max-height: calc(100dvh - env(safe-area-inset-bottom));
 overflow-y: scroll;
 overflow-x: hidden;
 padding-bottom: 220px;
 overscroll-behavior-y: contain;
 }

 html .navbar-collapse.show > *, html .navbar-collapse.in > *, html .offcanvas.show > *, html .offcanvas-menu.show > *, html .mobile-menu.show > *, html .mobile-navigation.show > *, html .navigation.open > *, html .main-navigation.open > * {
 padding-bottom: 160px;
 }

 #page_sidebar .navbar-nav > li > a, #page_sidebar .nav > li > a, #page_sidebar .navigation > li > a, #page_sidebar .main-navigation > li > a {
 min-height: 58px;
 padding: 16px 20px;
 margin: 8px 18px;
 border-radius: 24px;
 background: radial-gradient(circle at 16% 0%, rgba(255,255,255,0.76), rgba(255,255,255,0.30) 42%, rgba(223,245,255,0.30) 100%), 
linear-gradient(135deg, rgba(255,255,255,0.82), rgba(223,245,255,0.56));
 border: 1px solid rgba(255,255,255,0.94);
 box-shadow: 0 12px 28px rgba(30,72,98,0.10), 
inset 0 1px 0 rgba(255,255,255,0.98), 
inset 0 -1px 0 rgba(124,176,204,0.14);
 color: var(--ak-petrol);
 font-size: 1.125rem;
 font-weight: 700;
 line-height: 1.25;
 text-decoration: none;
 }

 #page_sidebar .navbar-nav > li.open > a, #page_sidebar .navbar-nav > li.active > a, #page_sidebar .nav > li.open > a, #page_sidebar .nav > li.active > a, #page_sidebar .navigation > li.open > a, #page_sidebar .navigation > li.active > a, #page_sidebar .main-navigation > li.open > a, #page_sidebar .main-navigation > li.active > a {
 background: radial-gradient(circle at 16% 0%, rgba(255,255,255,0.28), rgba(255,255,255,0.00) 38%), 
linear-gradient(135deg, var(--ak-petrol) 0%, var(--ak-petrol-dark) 100%);
 color: var(--ak-white);
 border-color: rgba(164,236,248,0.74);
 box-shadow: 0 16px 34px rgba(5,48,68,0.22), 
inset 0 1px 0 rgba(255,255,255,0.34);
 }

 #page_sidebar .navbar-nav li > .dropdown-menu, #page_sidebar .nav li > .dropdown-menu, #page_sidebar .navigation li > .dropdown-menu, #page_sidebar .main-navigation li > .dropdown-menu {
 margin: 6px 18px 16px 18px;
 padding: 8px 0;
 border-radius: 28px;
 background: radial-gradient(circle at 14% 0%, rgba(255,255,255,0.96), rgba(255,255,255,0.72) 40%, rgba(223,245,255,0.82) 100%), 
linear-gradient(135deg, rgba(255,255,255,0.94), rgba(223,245,255,0.84));
 border: 1px solid rgba(255,255,255,0.96);
 box-shadow: 0 18px 44px rgba(30,72,98,0.14), 
inset 0 1px 0 rgba(255,255,255,1);
 overflow: hidden;
 }

 #page_sidebar .navbar-nav li > .dropdown-menu li a, #page_sidebar .nav li > .dropdown-menu li a, #page_sidebar .navigation li > .dropdown-menu li a, #page_sidebar .main-navigation li > .dropdown-menu li a {
 min-height: 52px;
 padding: 14px 22px;
 margin: 6px 10px;
 border-radius: 20px;
 background: rgba(255,255,255,0.34);
 border-bottom: 0;
 color: var(--ak-petrol-dark);
 font-size: 1.0625rem;
 font-weight: 650;
 line-height: 1.25;
 text-decoration: none;
 }

 #page_sidebar .navbar-nav li > .dropdown-menu li a:hover, #page_sidebar .nav li > .dropdown-menu li a:hover, #page_sidebar .navigation li > .dropdown-menu li a:hover, #page_sidebar .main-navigation li > .dropdown-menu li a:hover {
 background: rgba(255,255,255,0.72);
 color: var(--ak-petrol);
 }

 #page_sidebar .navbar-nav li, #page_sidebar .nav li, #page_sidebar .navigation li, #page_sidebar .main-navigation li {
 border-color: rgba(6,79,85,0.28);
 }

}


/* ---------- @media (max-width: 1379.98px) (4 Regeln) ---------- */
@media (max-width: 1379.98px) {
 body {
 font-size: 0.875rem;
 }

 #optional-header-icons {
 width: 100vw;
 left: 0;
 position: absolute;
 display: flex;
 justify-content: flex-end;
 box-sizing: border-box;
 padding-right: max(16px, env(safe-area-inset-right));
 }

 html .visible-xs {
 display: block;
 }

 .individual-slider-button .btn-primary {
 top: inherit;
 bottom: 450px;
 left: 16px;
 }

}


/* ---------- @media (min-width: 768px) and (max-width: 1023.98px) (3 Regeln) ---------- */
@media (min-width: 768px) and (max-width: 1023.98px) {
 #header .navbar-left {
 max-width: calc(100vw - 220px);
 padding-right: 64px;
 }

 #header .navbar-left .ge-content {
 gap: 9px;
 }

 #header .navbar-left img {
 max-width: 86px;
 max-height: 30px;
 }

}


/* ---------- @media (min-width: 768px) and (max-width: 1379.98px) (4 Regeln) ---------- */
@media (min-width: 768px) and (max-width: 1379.98px) {
 #header .navbar-left {
 display: flex;
 visibility: visible;
 opacity: 1;
 float: left;
 align-items: center;
 width: auto;
 max-width: calc(100vw - 255px);
 height: 50px;
 min-height: 50px;
 margin: 0;
 padding: 0 78px 0 12px;
 position: relative;
 z-index: 12;
 overflow: visible;
 }

 #header .navbar-left .row, #header .navbar-left .column, #header .navbar-left .ge-content {
 display: flex;
 visibility: visible;
 opacity: 1;
 align-items: center;
 flex-wrap: nowrap;
 gap: 14px;
 width: auto;
 max-width: 100%;
 height: 50px;
 min-height: 50px;
 margin: 0;
 padding: 0;
 overflow: visible;
 }

 #header .navbar-left a {
 display: flex;
 visibility: visible;
 opacity: 1;
 align-items: center;
 flex: 0 0 auto;
 width: auto;
 height: auto;
 margin: 0;
 padding: 0;
 overflow: visible;
 }

 #header .navbar-left img {
 display: block;
 visibility: visible;
 opacity: 1;
 flex: 0 0 auto;
 width: auto;
 height: auto;
 max-width: 112px;
 max-height: 34px;
 margin: 0;
 object-fit: contain;
 }

}


/* ---------- @media only screen and (min-width: 768px) and (max-width: 1440px) (2 Regeln) ---------- */
@media only screen and (min-width: 768px) and (max-width: 1440px) {
 html .brand-logos, html .brand-logo-row, html .ak-brand-logos, html .ak-logo-row, html .ak-marken-logos, html .ak-partner-logos {
 display: flex;
 visibility: visible;
 opacity: 1;
 justify-content: center;
 align-items: center;
 flex-wrap: nowrap;
 gap: 18px;
 width: 100%;
 max-width: 100%;
 height: auto;
 min-height: 42px;
 margin: 54px auto 54px auto;
 padding: 0 20px;
 overflow: visible;
 }

 html .brand-logos img, html .brand-logo-row img, html .ak-brand-logos img, html .ak-logo-row img, html .ak-marken-logos img, html .ak-partner-logos img {
 display: block;
 visibility: visible;
 opacity: 1;
 width: auto;
 height: auto;
 max-width: 120px;
 max-height: 42px;
 object-fit: contain;
 }

}


/* ---------- @media (min-width: 480px) (1 Regeln) ---------- */
@media (min-width: 480px) {
 .menu-toggled #wrapper #page_sidebar {
 width: 100vw;
 }

}


/* ---------- @media (min-width: 768px) (2 Regeln) ---------- */
@media (min-width: 768px) {
 .menu-toggled #wrapper #page_sidebar {
 top: 50px;
 }

 #header .visible-xs, #header #optional-header-icons .visible-xs, #header .phone-mail-infos, #header .extra-mobile-menu, #header a[href^="tel:"], #header a[href^="mailto:"], #header a[href*="wa.me"], #header a[href*="whatsapp"], #header a[href*="4923079250026"], #header a[href*="4923077718"], #header a[href*="9250026"], #header a[href*="77718"] {
 display: none;
 visibility: hidden;
 height: 0;
 min-height: 0;
 max-height: 0;
 margin: 0;
 padding: 0;
 overflow: hidden;
 }

}


/* ---------- @media (min-width: 1024px) (23 Regeln) ---------- */
@media (min-width: 1024px) {
 #header .navbar-nav a[href^="tel"], #header .navbar-nav a[href^="mailto"], #header .navigation-main a[href^="tel"], #header .navigation-main a[href^="mailto"], #header .main-navigation a[href^="tel"], #header .main-navigation a[href^="mailto"] {
 display: none;
 }

 #header #optional-header-icons::before {
 content: none;
 display: none;
 }

 #header #optional-header-icons {
 display: flex;
 align-items: center;
 }

 #header #phone-top {
 margin-right: 22px;
 }

 #header .navbar-nav, #header .navigation-main, #header .main-navigation {
 display: flex;
 align-items: center;
 flex-wrap: wrap;
 justify-content: flex-start;
 column-gap: 12px;
 row-gap: 24px;
 margin: 0;
 }

 #header .navbar-nav > li, #header .navigation-main > li, #header .main-navigation > li {
 float: none;
 display: flex;
 align-items: center;
 margin: 0;
 padding: 0;
 background: transparent;
 }

 #header .navbar-inverse .navbar-nav > li > a, #header .navbar-nav > li > a, #header .navigation-main li > a, #header .main-navigation li > a {
 box-sizing: border-box;
 display: flex;
 align-items: center;
 justify-content: center;
 height: 58px;
 min-height: 58px;
 padding: 0 18px;
 margin: 0;
 border: 1px solid transparent;
 border-radius: 24px;
 line-height: 1.2;
 white-space: nowrap;
 background: transparent;
 color: var(--ak-black);
 box-shadow: none;
 backdrop-filter: none;
 -webkit-backdrop-filter: none;
 transition: background 0.22s ease, color 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
 }

 #header .navbar-inverse .navbar-nav > li.active > a, #header .navbar-inverse .navbar-nav > li.current > a, #header .navbar-inverse .navbar-nav > li.selected > a, #header .navbar-inverse .navbar-nav > li:hover > a, #header .navbar-nav > li.active > a, #header .navbar-nav > li.current > a, #header .navbar-nav > li.selected > a, #header .navbar-nav > li:hover > a, #header .navigation-main li.active > a, #header .navigation-main li.current > a, #header .navigation-main li.selected > a, #header .navigation-main li:hover > a, #header .main-navigation li.active > a, #header .main-navigation li.current > a, #header .main-navigation li.selected > a, #header .main-navigation li:hover > a {
 border: 1px solid rgba(255,255,255,0.88);
 background: radial-gradient(circle at 18% 0%, rgba(255,255,255,0.58), rgba(255,255,255,0.00) 46%), 
linear-gradient(135deg, rgba(255,255,255,0.38), rgba(221,245,255,0.16));
 color: var(--ak-petrol);
 box-shadow: 0 14px 34px rgba(28,72,92,0.12), 
inset 0 1px 0 rgba(255,255,255,0.95), 
inset 0 -1px 0 rgba(118,168,190,0.12);
 backdrop-filter: blur(16px) saturate(180%);
 -webkit-backdrop-filter: blur(16px) saturate(180%);
 }

 #header .navbar-nav ul, #header .navigation-main ul, #header .main-navigation ul, #header .dropdown-menu, #header .navbar-inverse .navbar-nav .dropdown-menu {
 border-radius: 30px;
 overflow: hidden;
 background: linear-gradient(135deg, rgba(232,248,255,0.96), rgba(223,245,255,0.94));
 border: 1px solid rgba(255,255,255,0.96);
 box-shadow: 0 28px 70px rgba(20,60,82,0.24), 
inset 0 1px 0 rgba(255,255,255,1), 
inset 0 -1px 0 rgba(110,165,196,0.18);
 backdrop-filter: blur(10px) saturate(135%);
 -webkit-backdrop-filter: blur(10px) saturate(135%);
 z-index: var(--ak-z-modal);
 }

 #header .navbar-nav ul li > a, #header .navigation-main ul li > a, #header .main-navigation ul li > a, #header .dropdown-menu li > a, #header .navbar-inverse .navbar-nav .dropdown-menu > li > a {
 height: auto;
 min-height: 52px;
 padding: 13px 18px;
 margin: 7px 10px;
 border-radius: 20px;
 border: 1px solid transparent;
 background: rgba(255,255,255,0.22);
 color: var(--ak-petrol-dark);
 font-weight: 700;
 line-height: 1.35;
 text-shadow: none;
 text-decoration: none;
 }

 #header .navbar-nav ul li:hover > a, #header .navbar-nav ul li.active > a, #header .navigation-main ul li:hover > a, #header .navigation-main ul li.active > a, #header .main-navigation ul li:hover > a, #header .main-navigation ul li.active > a, #header .dropdown-menu li:hover > a, #header .dropdown-menu li.active > a, #header .navbar-inverse .navbar-nav .dropdown-menu > li:hover > a, #header .navbar-inverse .navbar-nav .dropdown-menu > li.active > a {
 background: linear-gradient(135deg, rgba(255,255,255,0.72), rgba(230,248,255,0.46));
 color: var(--ak-petrol);
 border: 1px solid rgba(255,255,255,0.92);
 box-shadow: 0 10px 24px rgba(28,72,92,0.10), 
inset 0 1px 0 rgba(255,255,255,0.96);
 }

 html body, html body.site-home, html body.header-menu-fixed, html body.site-home.header-menu-fixed {
 padding-top: 0;
 }

 body.header-menu-fixed #header, body.header-menu-fixed #header-container, body.header-menu-fixed .header-container, body.header-menu-fixed .header-wrapper, body.header-menu-fixed .navbar, body.header-menu-fixed .navbar-wrapper, body.header-menu-fixed .nav-area-lines, body.header-menu-fixed .navbar-inverse, body.header-menu-fixed header, #header, #header-container, .header-container, .header-wrapper, .navbar, .navbar-wrapper, .nav-area-lines, .navbar-inverse, header {
 position: relative;
 top: auto;
 right: auto;
 bottom: auto;
 left: auto;
 width: 100%;
 transform: none;
 translate: none;
 }

 body:not(.site-home) #site-content {
 padding-top: 0;
 }

 .breadcrumb_area, .breadcrumb-area, .breadcrumb-wrapper, .breadcrumb-container, #breadcrumb, #breadcrumbs, .page-title-area, .content-title-area {
 display: none;
 height: 0;
 min-height: 0;
 margin: 0;
 padding: 0;
 overflow: hidden;
 }

 html #header, html #header-container, html #header .navbar, html #header .navbar-inverse, html #header .nav-area-lines {
 position: relative;
 overflow: visible;
 }

 html #header {
 z-index: 500;
 }

 html #header .navbar-nav, html #header .navigation-main, html #header .main-navigation {
 position: relative;
 overflow: visible;
 }

 html #header .navbar-nav > li, html #header .navigation-main > li, html #header .main-navigation > li {
 position: relative;
 z-index: 1;
 }

 html #header .navbar-nav > li.open, html #header .navbar-nav > li:hover, html #header .navbar-nav > li:focus-within, html #header .navigation-main > li.open, html #header .navigation-main > li:hover, html #header .navigation-main > li:focus-within, html #header .main-navigation > li.open, html #header .main-navigation > li:hover, html #header .main-navigation > li:focus-within {
 z-index: 10010;
 }

 html #header .navbar-nav > li > ul, html #header .navigation-main > li > ul, html #header .main-navigation > li > ul, html #header .dropdown-menu, html #header .navbar-inverse .navbar-nav .dropdown-menu {
 position: absolute;
 z-index: 10020;
 isolation: isolate;
 overflow: hidden;
 background: #eaf8fd;
 border: 1px solid rgba(255,255,255,0.98);
 border-radius: 30px;
 box-shadow: 0 28px 70px rgba(20,60,82,0.26),
 inset 0 1px 0 rgba(255,255,255,1),
 inset 0 -1px 0 rgba(110,165,196,0.18);
 backdrop-filter: none;
 -webkit-backdrop-filter: none;
 }

 html #header .navbar-nav ul li > a, html #header .navigation-main ul li > a, html #header .main-navigation ul li > a, html #header .dropdown-menu li > a, html #header .navbar-inverse .navbar-nav .dropdown-menu > li > a {
 position: relative;
 z-index: 1;
 background: rgba(255,255,255,0.86);
 color: var(--ak-petrol-dark);
 border: 1px solid rgba(255,255,255,0.96);
 box-shadow: 0 5px 14px rgba(28,72,92,0.05),
 inset 0 1px 0 rgba(255,255,255,1);
 text-shadow: none;
 }

 html #header .navbar-nav ul li:hover > a, html #header .navbar-nav ul li:focus-within > a, html #header .navbar-nav ul li.active > a, html #header .navigation-main ul li:hover > a, html #header .navigation-main ul li:focus-within > a, html #header .navigation-main ul li.active > a, html #header .main-navigation ul li:hover > a, html #header .main-navigation ul li:focus-within > a, html #header .main-navigation ul li.active > a, html #header .dropdown-menu li:hover > a, html #header .dropdown-menu li:focus-within > a, html #header .dropdown-menu li.active > a {
 background: #ffffff;
 color: var(--ak-petrol);
 border-color: #ffffff;
 box-shadow: 0 10px 24px rgba(28,72,92,0.12),
 inset 0 1px 0 rgba(255,255,255,1);
 }

}


/* ---------- @media (min-width: 1380px) (10 Regeln) ---------- */
@media (min-width: 1380px) {
 #header #logo-primary-box .logo-link {
 height: 100px;
 }

 #header-container, #header {
 height: 212px;
 }

 #header #phone-top, #header #optional-header-icons {
 height: 100px;
 }

 #header #phone-top {
 display: none;
 }

 #header .navbar-nav > li.extra-mobile-menu {
 display: none;
 visibility: visible;
 opacity: 1;
 position: fixed;
 top: 29px;
 right: 78px;
 z-index: var(--ak-z-toast);
 align-items: center;
 gap: 8px;
 width: auto;
 height: 42px;
 min-height: 42px;
 max-height: 42px;
 margin: 0;
 padding: 0;
 overflow: visible;
 background: transparent;
 }

 #header .navbar-nav > li.extra-mobile-menu > a[href^="tel:"], #header .navbar-nav > li.extra-mobile-menu > a[href^="mailto:"] {
 display: flex;
 visibility: visible;
 opacity: 1;
 align-items: center;
 justify-content: center;
 width: auto;
 height: 42px;
 min-height: 42px;
 max-height: 42px;
 margin: 0;
 padding: 0 13px;
 overflow: visible;
 border: 1px solid rgba(6,79,85,0.18);
 border-radius: 999px;
 background: rgba(255,255,255,0.72);
 color: var(--ak-petrol-dark);
 box-shadow: 0 10px 26px rgba(20,60,82,0.10);
 font-size: 0;
 line-height: 1;
 text-decoration: none;
 white-space: nowrap;
 }

 #header .navbar-nav > li.extra-mobile-menu > a[href^="tel:"]::after {
 content: "+49 (0) 2307-7718";
 font-family: Poppins, Arial, sans-serif;
 font-size: 0.8125rem;
 font-weight: 700;
 line-height: 1;
 }

 #header .navbar-nav > li.extra-mobile-menu > a[href^="mailto:"]::after {
 content: "info@autohaus-kamen.eu";
 font-family: Poppins, Arial, sans-serif;
 font-size: 0.8125rem;
 font-weight: 700;
 line-height: 1;
 }

 #header .navbar-nav > li.extra-mobile-menu > a > i {
 display: inline-block;
 visibility: visible;
 opacity: 1;
 margin-right: 7px;
 color: var(--ak-petrol);
 font-size: 0.9375rem;
 line-height: 1;
 }

 html #header .navbar-inverse > .container-fluid, html #header .navbar-inverse > .container-limited, html #header .nav-area-lines > .container-fluid, html #header .nav-area-lines > .container-limited, html #header nav > .container-fluid, html #header nav > .container-limited {
 width: calc(100% - 40px);
 max-width: 1520px;
 margin-left: auto;
 margin-right: auto;
 padding-left: 20px;
 padding-right: 20px;
 box-sizing: border-box;
 }

}


/* ---------- @media (prefers-reduced-motion: reduce) (2 Regeln) ---------- */
@media (prefers-reduced-motion: reduce) {
 .ak-glass-button, .ak-glass-button-light, .ak-iz-btn, .ak-no-hyphen a.ak-glass-button, .ak-no-hyphen a.ak-glass-button-light, .ak-no-hyphen a.ak-iz-btn {
 transition: none !important;
 }

 .ak-glass-button:hover, .ak-glass-button-light:hover, .ak-iz-btn:hover, .ak-no-hyphen a.ak-glass-button:hover, .ak-no-hyphen a.ak-glass-button-light:hover, .ak-no-hyphen a.ak-iz-btn:hover {
 transform: none !important;
 }

}


/* === ENDE MASTER CSS === */


/* ============================================================
 BLOCK 10   STARTSEITE-FIXES (17.07.2026)
 Fix 1: Bosch-Logo & Markenleiste sofort sichtbar
 Fix 2: Slogan-Icon (Hand-Herz-Auto) sofort sichtbar
 Fix 3: Footer petrol -> Schrift weiß
 ============================================================ */

/* --- Fix 1: Markenleiste / Bosch-Logo sofort anzeigen --- */
.ak-brand-strip img,
.markenleiste img,
.marken-leiste img,
header .brand-logos img,
.ak-brands img,
.ak-brands svg,
[class*="marken"] img {
 opacity: 1 !important;
 visibility: visible !important;
 animation: none !important;
 transition: none !important;
}

/* --- Fix 2: Slogan-Kachel-Icon sofort anzeigen --- */
.ak-slogan-card .ak-icon,
.ak-slogan-card img,
.ak-slogan-card svg,
.ak-glass-card .ak-icon,
[class*="slogan"] img,
[class*="slogan"] svg {
 opacity: 1 !important;
 visibility: visible !important;
 animation-delay: 0s !important;
 animation: none !important;
}

/* ============================================================
 Fix 3: FOOTER   Petrol-Hintergrund = weiße Schrift
 ============================================================ */
footer,
.site-footer,
.ak-footer,
#footer {
 color: #ffffff !important;
}

footer *,
.site-footer *,
.ak-footer *,
#footer * {
 color: #ffffff !important;
}

footer a,
.site-footer a,
.ak-footer a,
#footer a {
 color: #ffffff !important;
 text-decoration: underline;
 text-decoration-color: rgba(255, 255, 255, 0.5);
}

footer a:hover,
.site-footer a:hover,
.ak-footer a:hover,
#footer a:hover {
 color: #ffffff !important;
 text-decoration-color: #ffffff;
}

/* Fußnoten (¹ ² ³) und Kleingedrucktes   leicht abgesetzt, aber lesbar */
footer sup,
footer small,
footer .copyright,
.ak-footer sup,
.ak-footer small,
.ak-footer .copyright {
 color: rgba(255, 255, 255, 0.85) !important;
}

/* === ENDE BLOCK 10 === */


/* ============================================================
 BLOCK 11   RESPONSIVE FIX: "Was Sie bei Autohaus Kamen
 erwarten können" (Erwartungs-Kacheln)
 17.07.2026
 ------------------------------------------------------------
 Problem: Auf iPhone 2 Kacheln nebeneinander -> zu schmal,
 jedes Wort bricht senkrecht um, Text unlesbar.
 Lösung: Mobile-first Breakpoints
 - iPhone (<=600px) : 1 Spalte, volle Breite
 - iPad (601-1023) : 2 Spalten
 - Desktop(>=1024) : 2 Spalten (unverändert)
 + Wortumbruch entschärfen (keine harten Silbentr.)
 ============================================================ */

/* --- Basis: Container + Kachel-Typografie normalisieren --- */
.ak-expect-grid,
.ak-erwartungen-grid,
[class*="erwartungen"] .ak-grid,
[class*="expect"] .ak-grid {
 display: grid;
 gap: 1rem;
 width: 100%;
}

/* Text in den Kacheln: keine erzwungene Silbentrennung, 
 normaler Umbruch, keine vertikale Auflösung */
.ak-expect-card,
.ak-erwartungen-card,
[class*="erwartungen"] .ak-glass-card,
[class*="expect"] .ak-glass-card {
 hyphens: none !important;
 -webkit-hyphens: none !important;
 word-break: normal !important;
 overflow-wrap: break-word;
 white-space: normal;
}

.ak-expect-card h3,
.ak-erwartungen-card h3,
[class*="erwartungen"] .ak-glass-card h3,
[class*="expect"] .ak-glass-card h3 {
 hyphens: none !important;
 -webkit-hyphens: none !important;
 word-break: keep-all;
 overflow-wrap: break-word;
}

/* ============================================================
 iPhone / kleine Smartphones : bis 600px -> 1 Spalte
 ============================================================ */
@media (max-width: 600px) {
 .ak-expect-grid,
 .ak-erwartungen-grid,
 [class*="erwartungen"] .ak-grid,
 [class*="expect"] .ak-grid {
 grid-template-columns: 1fr !important;
 }

 .ak-expect-card,
 .ak-erwartungen-card,
 [class*="erwartungen"] .ak-glass-card,
 [class*="expect"] .ak-glass-card {
 width: 100% !important;
 max-width: 100% !important;
 padding: 1.25rem 1.25rem !important;
 }

 /* Ãœberschriften eine Spur kleiner, damit sie in eine Zeile passen */
 .ak-expect-card h3,
 .ak-erwartungen-card h3,
 [class*="erwartungen"] .ak-glass-card h3,
 [class*="expect"] .ak-glass-card h3 {
 font-size: 1.15rem !important;
 line-height: 1.3 !important;
 }
}

/* ============================================================
 iPad / Tablets : 601px - 1023px -> 2 Spalten
 ============================================================ */
@media (min-width: 601px) and (max-width: 1023px) {
 .ak-expect-grid,
 .ak-erwartungen-grid,
 [class*="erwartungen"] .ak-grid,
 [class*="expect"] .ak-grid {
 grid-template-columns: repeat(2, 1fr) !important;
 gap: 1.25rem;
 }
}

/* ============================================================
 iMac / Desktop : ab 1024px -> 2 Spalten (bzw. wie Original)
 ============================================================ */
@media (min-width: 1024px) {
 .ak-expect-grid,
 .ak-erwartungen-grid,
 [class*="erwartungen"] .ak-grid,
 [class*="expect"] .ak-grid {
 grid-template-columns: repeat(2, 1fr) !important;
 gap: 1.5rem;
 }
}

/* === ENDE BLOCK 11 === */


/* ============================================================
 BLOCK 12   UNIVERSAL MOBILE FIX (Safety-Net)
 17.07.2026
 ------------------------------------------------------------
 Greift auch ohne bekannte Klassennamen:
 - Silbentrennung global aus (kein "verständli/ch")
 - Auf iPhone (<=600px) alle 2/3/4-spaltigen Kachel-Grids
 der Startseite zwingend auf 1 Spalte
 ============================================================ */

/* --- Globale Wortumbruch-Normalisierung --- */
h1, h2, h3, h4, h5, h6,
p, li, td, span, a,
.ak-glass-card, .ak-glass-card *,
.ak-card, .ak-card *,
[class*="card"] h1, [class*="card"] h2, [class*="card"] h3,
[class*="card"] h4, [class*="card"] p {
 hyphens: manual;
 -webkit-hyphens: manual;
 -ms-hyphens: manual;
 word-break: normal;
 overflow-wrap: break-word;
}

/* Ãœberschriften: NIE mitten im Wort umbrechen */
h1, h2, h3, h4,
[class*="card"] h1, [class*="card"] h2, [class*="card"] h3, [class*="card"] h4 {
 word-break: keep-all;
 hyphens: none !important;
 -webkit-hyphens: none !important;
}

/* ============================================================
 iPhone   bis 600px: alle Kachel-Grids -> 1 Spalte
 ============================================================ */
@media (max-width: 600px) {

 /* Bootstrap-artige 2-/3-/4-Spalten-Grids */
 .row > .col-md-6,
 .row > .col-md-4,
 .row > .col-md-3,
 .row > .col-lg-6,
 .row > .col-lg-4,
 .row > .col-lg-3 {
 width: 100% !important;
 max-width: 100% !important;
 flex: 0 0 100% !important;
 }

 /* CSS-Grid mit repeat(2/3/4, ...) */
 [style*="grid-template-columns"],
 .ak-grid,
 .ak-grid-2, .ak-grid-3, .ak-grid-4,
 [class*="grid-cols-2"],
 [class*="grid-cols-3"],
 [class*="grid-cols-4"] {
 grid-template-columns: 1fr !important;
 display: grid !important;
 gap: 1rem !important;
 }

 /* Flexbox 2er/3er-Reihen mit width 48%/32% */
 [style*="width: 48%"],
 [style*="width:48%"],
 [style*="width: 49%"],
 [style*="width:49%"],
 [style*="width: 32%"],
 [style*="width:32%"] {
 width: 100% !important;
 max-width: 100% !important;
 }

 /* Kacheln volle Breite + komfortables Innenpadding */
 .ak-glass-card,
 .ak-card,
 [class*="glass-card"],
 [class*="tile"] {
 width: 100% !important;
 max-width: 100% !important;
 padding: 1.25rem 1.25rem !important;
 margin-left: 0 !important;
 margin-right: 0 !important;
 }

 /* Überschriften in Kacheln: passende Größe */
 .ak-glass-card h3,
 .ak-card h3,
 [class*="glass-card"] h3,
 [class*="tile"] h3 {
 font-size: 1.15rem !important;
 line-height: 1.3 !important;
 hyphens: none !important;
 }
}

/* === ENDE BLOCK 12 === */

/* ============================================================
 BLOCK 13   iPhone: Kacheln untereinander (1 Spalte, natürliche Höhe)
 Ziel: Auf iPhone stehen ALLE mehrspaltigen Kachel-Grids untereinander.
 Kacheln behalten ihre natürliche Höhe   kein Strecken, kein Aspect-Ratio.
 ============================================================ */
@media (max-width: 600px) {

 /* 1) Alle Grid-Container auf 1 Spalte zwingen */
 .ak-grid,
 .ak-cards-grid,
 .ak-tiles-grid,
 .ak-expect-grid,
 .ak-service-grid,
 .ak-features-grid,
 [class*="cards-grid"],
 [class*="tiles-grid"],
 [class*="grid-2"],
 [class*="grid-3"],
 [class*="grid-4"],
 .row.ak-row-tiles,
 .elementor-container .elementor-row {
 display: grid !important;
 grid-template-columns: 1fr !important;
 gap: 16px !important;
 }

 /* 2) Kacheln: volle Breite, natürliche Höhe   NICHT strecken */
 .ak-card,
 .ak-tile,
 .ak-glass,
 .ak-glass-card,
 .ak-expect-card,
 .ak-service-card,
 .ak-feature-card,
 [class*="ak-card"],
 [class*="ak-tile"] {
 width: 100% !important;
 max-width: 100% !important;
 min-height: 0 !important; /* kein erzwungenes Strecken */
 height: auto !important; /* natürliche Höhe */
 aspect-ratio: auto !important; /* KEIN quadratisches Format erzwingen */
 padding: 20px !important; /* kompakt statt langgezogen */
 }

 /* 3) Bootstrap-Spalten (falls verwendet) ebenfalls auf 100% */
 .col-6, .col-sm-6, .col-md-6,
 .col-4, .col-sm-4, .col-md-4,
 .col-3, .col-sm-3, .col-md-3 {
 flex: 0 0 100% !important;
 max-width: 100% !important;
 }

 /* 4) Wortumbruch entschärfen (keine erzwungene Silbentrennung mehr) */
 .ak-card *,
 .ak-tile *,
 [class*="ak-card"] *,
 [class*="ak-tile"] * {
 hyphens: manual !important;
 -webkit-hyphens: manual !important;
 word-break: normal !important;
 overflow-wrap: break-word !important;
 }
}

/* ============================================================
 BLOCK 14   Seiten-H1 nie brechen (Fix: /probefahrt/)
 Problem: Untermenü verengt den H1-Container -> "Pro | efahrt"
 Lösung: H1 bekommt volle Breite, kein Notbruch, kein Zeilenumbruch.
 ============================================================ */

/* 1) Globale Regel: H1 der Seite darf nicht mitten im Wort brechen */
h1,
.entry-title,
.page-title,
.elementor-heading-title,
h1.wp-block-post-title,
.ak-page-title {
 overflow-wrap: normal !important;
 word-break: keep-all !important;
 -webkit-hyphens: none !important;
 hyphens: none !important;
 min-width: 0;
}

/* 2) Desktop / iPad: H1-Container darf die volle Zeile nutzen
 (verhindert, dass das seitliche Untermenü die H1 einquetscht) */
@media (min-width: 601px) {
 h1,
 .entry-title,
 .page-title,
 .elementor-heading-title,
 h1.wp-block-post-title {
 display: block;
 width: 100%;
 max-width: 100%;
 white-space: normal;
 clear: both; /* nichts darf links/rechts der H1 hochrutschen */
 }
}

/* 3) iPhone: H1 kompakter, aber weiterhin nie mitten im Wort brechen */
@media (max-width: 600px) {
 h1,
 .entry-title,
 .page-title,
 .elementor-heading-title {
 font-size: clamp(1.9rem, 8vw, 2.6rem) !important;
 line-height: 1.15 !important;
 width: 100% !important;
 max-width: 100% !important;
 white-space: normal !important;
 }
}

/* === ENDE BLOCK 14 === */

/* ============================================================
 BLOCK 15   Probefahrt-H1: Container wirklich freiräumen
 Problem: Auf /probefahrt/ wird der H1-Bereich weiterhin zu schmal.
 Lösung: H1 nicht nur vor Wortbruch schützen, sondern auch die
 umgebenden Content-/Spalten-Container aus engen Grid/Flex/Floats lösen.
 ============================================================ */

/* 1) H1 selbst: kein Wortbruch, keine Silbentrennung, kein Abschneiden */
body h1,
body .entry-title,
body .page-title,
body .elementor-heading-title,
body h1.wp-block-post-title,
body .ak-page-title {
 display: block !important;
 float: none !important;
 clear: both !important;
 width: 100% !important;
 max-width: none !important;
 min-width: max-content !important;
 white-space: nowrap !important;
 overflow: visible !important;
 text-overflow: clip !important;
 word-break: keep-all !important;
 overflow-wrap: normal !important;
 -webkit-hyphens: none !important;
 hyphens: none !important;
}

/* 2) Direkte H1-Eltern dürfen die Überschrift nicht einquetschen/abschneiden */
body *:has(> h1),
body *:has(> .entry-title),
body *:has(> .page-title),
body *:has(> .elementor-heading-title),
body *:has(> h1.wp-block-post-title),
body *:has(> .ak-page-title) {
 float: none !important;
 clear: both !important;
 width: 100% !important;
 max-width: 100% !important;
 min-width: 0 !important;
 overflow: visible !important;
}

/* 3) Falls H1 in einer Theme-/Builder-Spalte sitzt: Spalte auf volle Breite */
body .entry-header,
body .page-header,
body .wp-block-post-title,
body .elementor-widget-heading,
body .elementor-widget-heading .elementor-widget-container,
body .fl-module-heading,
body .fl-heading,
body .vc_custom_heading {
 float: none !important;
 clear: both !important;
 width: 100% !important;
 max-width: 100% !important;
 overflow: visible !important;
}

/* 4) iPhone: Schrift etwas kleiner, aber weiterhin NIE mitten im Wort brechen */
@media (max-width: 600px) {
 body h1,
 body .entry-title,
 body .page-title,
 body .elementor-heading-title,
 body h1.wp-block-post-title,
 body .ak-page-title {
 font-size: clamp(1.65rem, 7vw, 2.25rem) !important;
 line-height: 1.12 !important;
 min-width: 0 !important;
 white-space: normal !important;
 word-break: keep-all !important;
 overflow-wrap: normal !important;
 }
}

/* === ENDE BLOCK 15 === */

/* ================================================================
 BLOCK 20   Digitale Fahrzeugfunktionen: harter Kontrast-Fix
 Seite: /digitale-fahrzeugfunktionen/ = body.pageid-18130

 Regel:
 - Petrol/dunkle Glasflächen (.ak-glass-dark) = weiße Schrift
 - Helle Glasflächen (.ak-glass-card ohne .ak-glass-dark) = petrol Schrift
 ================================================================ */

/* 20.1 Petrol-Karten: wirklich jede Textebene weiß */
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark,
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark :where(h1,h2,h3,h4,h5,h6,p,span,strong,em,small,a,li,div),
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark .ak-liquid-title,
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark .ak-liquid-text,
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark .ak-liquid-pill,
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark .ak-digital-meta,
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark .ak-digital-dark-title,
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark .ak-digital-dark-text,
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark .ak-digital-card-title,
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark .ak-digital-card-text,
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark .ak-digital-section-number {
 color: #ffffff !important;
 -webkit-text-fill-color: #ffffff !important;
 text-shadow: 0 1px 2px rgba(0,0,0,0.16) !important;
}

/* 20.2 Texte mit Inline-Petrolfarbe innerhalb dunkler Karten ebenfalls weiß */
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark [style*="color"],
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark [style*="-webkit-text-fill-color"] {
 color: #ffffff !important;
 -webkit-text-fill-color: #ffffff !important;
}

/* 20.3 Petrol-Karten: kleine Innenkacheln / Hinweise lesbar machen */
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark [style*="background"],
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark [style*="border-radius"] {
 border-color: rgba(255,255,255,0.42) !important;
}

body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark .ak-liquid-pill {
 background: rgba(255,255,255,0.16) !important;
 border-color: rgba(255,255,255,0.46) !important;
 color: #ffffff !important;
 -webkit-text-fill-color: #ffffff !important;
}

/* 20.4 Buttons auf petrol Karten: weiße Fläche, petrol Schrift */
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark a,
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark button,
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark .btn,
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark .ak-glass-button-light {
 background: #ffffff !important;
 border-color: #ffffff !important;
 color: #064f55 !important;
 -webkit-text-fill-color: #064f55 !important;
 text-shadow: none !important;
}

body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark a *,
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark button *,
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark .btn *,
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark .ak-glass-button-light * {
 color: #064f55 !important;
 -webkit-text-fill-color: #064f55 !important;
 text-shadow: none !important;
}

/* 20.5 Helle Karten: petrolfarbene Schrift beibehalten */
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-card:not(.ak-glass-dark),
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-card:not(.ak-glass-dark) :where(h1,h2,h3,h4,h5,h6,p,span,strong,em,small,a,li,div),
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-card-strong:not(.ak-glass-dark),
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-card-strong:not(.ak-glass-dark) :where(h1,h2,h3,h4,h5,h6,p,span,strong,em,small,a,li,div) {
 color: #064f55 !important;
 -webkit-text-fill-color: #064f55 !important;
}

/* 20.6 Ausnahme: petrol Karten innerhalb heller Rahmen bleiben weiß */
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-card-strong .ak-glass-dark,
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-card-strong .ak-glass-dark :where(h1,h2,h3,h4,h5,h6,p,span,strong,em,small,a,li,div),
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-card-strong .ak-glass-dark [style*="color"],
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-card-strong .ak-glass-dark [style*="-webkit-text-fill-color"] {
 color: #ffffff !important;
 -webkit-text-fill-color: #ffffff !important;
}

/* 20.7 Button-Ausnahme erneut ganz am Ende:
 weiße Buttons auf petrol Karten behalten petrolfarbene Schrift */
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark a.ak-glass-button-light,
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark a.ak-glass-button-light *,
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark .ak-glass-button-light,
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark .ak-glass-button-light *,
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark .btn,
body.pageid-18130 .ak-digitaldienste-liquid .ak-glass-dark .btn * {
 color: #064f55 !important;
 -webkit-text-fill-color: #064f55 !important;
 text-shadow: none !important;
}

/* === ENDE BLOCK 20 === */


/* =========================================================
 BLOCK 24
 Desktop-Headline-Fix
 22.07.2026

 Ziel:
 - Ãœberschriften sauber umbrechen
 - KEINE Grid-Layouts mehr überschreiben
 - HTML bestimmt die Spalten
 ========================================================= */

@media (min-width:901px){

html body .ak-liquid-page,
html body .ak-liquid-page *,
html body .ak-no-hyphen,
html body .ak-no-hyphen*{
 box-sizing:border-box !important;
}

/* Karten */

html body .ak-glass-card,
html body .ak-glass-card-strong,
html body .ak-glass-dark,
html body .ak-glass-kpi,
html body .ak-iz-petrol-card{

 width:100% !important;
 max-width:100% !important;
 min-width:0 !important;
 overflow:hidden !important;

}

html body .ak-glass-card>*,
html body .ak-glass-card-strong>*,
html body .ak-glass-dark>*,
html body .ak-glass-kpi>*,
html body .ak-iz-petrol-card>*{

 max-width:100% !important;
 min-width:0 !important;

}

/* Ãœberschriften */

html body .ak-liquid-title,
html body h1,
html body h2,
html body h3,
html body h4{

 display:block !important;
 width:100% !important;
 max-width:100% !important;
 min-width:0 !important;

 white-space:normal !important;
 overflow-wrap:normal !important;
 word-break:normal !important;
 text-wrap:balance !important;

 hyphens:none !important;
 overflow:visible !important;

}

/* Nur Typografie */

html body .ak-glass-card .ak-liquid-title,
html body .ak-glass-card-strong .ak-liquid-title,
html body .ak-glass-dark .ak-liquid-title,
html body .ak-glass-kpi .ak-liquid-title,
html body .ak-iz-petrol-card .ak-liquid-title{

 font-size:clamp(18px,1.55vw,24px)!important;
 line-height:1.18!important;
 max-inline-size:17ch!important;

}

html body .ak-glass-card h2,
html body .ak-glass-card-strong h2,
html body .ak-glass-dark h2,
html body .ak-glass-kpi h2,
html body .ak-iz-petrol-card h2{

 font-size:clamp(20px,1.8vw,30px)!important;
 line-height:1.18!important;
 max-inline-size:19ch!important;

}

}
/* === ENDE BLOCK 24 === */


/* ============================================================
 BLOCK 25   GLOBAL: Überschriften dürfen auf 2+ Zeilen umbrechen
 Problem: Frühere Fixes gegen Wortbruch setzten Desktop-Headlines teils auf
 white-space: nowrap / min-width: max-content. Dadurch laufen lange Titel auf
 iMac/Desktop aus Kacheln und Spalten heraus.

 Ziel:
 - lange Ãœberschriften brechen an Leerzeichen sauber um
 - keine Silbentrennung mitten im Wort
 - Kachel-/Spalten-Grenzen werden respektiert
 - iPhone/iPad/Desktop bleiben unterschiedlich responsive
 ============================================================ */

/* 25.1 Alte Desktop-Blockade überschreiben: KEIN nowrap, KEIN max-content */
html body h1,
html body h2,
html body h3,
html body h4,
html body h5,
html body h6,
html body .entry-title,
html body .page-title,
html body .elementor-heading-title,
html body .headline-h1,
html body .headline-h2,
html body .headline-h3,
html body .headline-h4,
html body .ak-page-title,
html body .ak-liquid-title,
html body [class*="headline"],
html body [class*="ueberschrift"] {
 display: block !important;
 width: auto !important;
 max-width: 100% !important;
 max-inline-size: 100% !important;
 min-width: 0 !important;
 min-inline-size: 0 !important;
 white-space: normal !important;
 word-break: normal !important;
 overflow-wrap: normal !important;
 -webkit-hyphens: none !important;
 hyphens: none !important;
 overflow: visible !important;
 text-overflow: clip !important;
}

/* 25.2 Direkte Headline-Eltern dürfen nicht die volle Wortbreite erzwingen */
html body *:has(> h1),
html body *:has(> h2),
html body *:has(> h3),
html body *:has(> h4),
html body *:has(> .entry-title),
html body *:has(> .page-title),
html body *:has(> .elementor-heading-title),
html body *:has(> .headline-h1),
html body *:has(> .headline-h2),
html body *:has(> .headline-h3),
html body *:has(> .ak-liquid-title) {
 min-width: 0 !important;
 min-inline-size: 0 !important;
 max-width: 100% !important;
 max-inline-size: 100% !important;
 overflow: visible !important;
}

/* 25.3 Grid-/Flex-/Builder-Spalten: Inhalt darf schrumpfen statt herauszulaufen */
html body .et_pb_row,
html body .et_pb_column,
html body .wp-block-columns,
html body .wp-block-column,
html body .elementor-container,
html body .elementor-row,
html body .elementor-column,
html body .elementor-widget-container,
html body .fl-row-content,
html body .fl-col,
html body .vc_row,
html body .vc_column_container,
html body .ak-liquid-page,
html body .ak-no-hyphen,
html body .ak-startseite-liquid,
html body .ak-digitaldienste-liquid,
html body .ak-home-liquid,
html body .ak-liquid-grid-2,
html body .ak-liquid-grid-3,
html body .ak-liquid-grid-4,
html body .ak-iz-grid-hero,
html body .ak-iz-info-grid,
html body .ak-iz-product-grid,
html body [class*="grid"] {
 min-width: 0 !important;
 min-inline-size: 0 !important;
}

/* 25.4 Kacheln: Ãœberschriften bleiben innerhalb der Kachel */
html body .ak-glass-card,
html body .ak-glass-card-strong,
html body .ak-glass-dark,
html body .ak-glass-kpi,
html body .ak-iz-petrol-card,
html body .ak-card,
html body .ak-tile,
html body [class*="ak-card"],
html body [class*="ak-tile"] {
 max-width: 100% !important;
 max-inline-size: 100% !important;
 min-width: 0 !important;
 min-inline-size: 0 !important;
 overflow: hidden !important;
}

html body .ak-glass-card :is(h1,h2,h3,h4,.ak-liquid-title,[class*="headline"]),
html body .ak-glass-card-strong :is(h1,h2,h3,h4,.ak-liquid-title,[class*="headline"]),
html body .ak-glass-dark :is(h1,h2,h3,h4,.ak-liquid-title,[class*="headline"]),
html body .ak-glass-kpi :is(h1,h2,h3,h4,.ak-liquid-title,[class*="headline"]),
html body .ak-iz-petrol-card :is(h1,h2,h3,h4,.ak-liquid-title,[class*="headline"]),
html body .ak-card :is(h1,h2,h3,h4,.ak-liquid-title,[class*="headline"]),
html body .ak-tile :is(h1,h2,h3,h4,.ak-liquid-title,[class*="headline"]),
html body [class*="ak-card"] :is(h1,h2,h3,h4,.ak-liquid-title,[class*="headline"]),
html body [class*="ak-tile"] :is(h1,h2,h3,h4,.ak-liquid-title,[class*="headline"]) {
 width: 100% !important;
 max-width: 100% !important;
 max-inline-size: 100% !important;
 min-width: 0 !important;
 min-inline-size: 0 !important;
 white-space: normal !important;
 overflow-wrap: break-word !important; /* nur als Notfall bei sehr langen deutschen Einzelwörtern */
 word-break: normal !important;
 text-wrap: balance !important;
}

/* 25.5 iMac/Desktop: lange Kachel-Titel bewusst früher brechen lassen */
@media (min-width: 901px) {
 html body .ak-glass-card :is(h1,h2,h3,.ak-liquid-title,[class*="headline"]),
 html body .ak-glass-card-strong :is(h1,h2,h3,.ak-liquid-title,[class*="headline"]),
 html body .ak-glass-dark :is(h1,h2,h3,.ak-liquid-title,[class*="headline"]),
 html body .ak-glass-kpi :is(h1,h2,h3,.ak-liquid-title,[class*="headline"]),
 html body .ak-iz-petrol-card :is(h1,h2,h3,.ak-liquid-title,[class*="headline"]),
 html body .ak-card :is(h1,h2,h3,.ak-liquid-title,[class*="headline"]),
 html body .ak-tile :is(h1,h2,h3,.ak-liquid-title,[class*="headline"]) {
 max-inline-size: 22ch !important;
 }

 html body .ak-glass-card :is(h1,h2),
 html body .ak-glass-card-strong :is(h1,h2),
 html body .ak-glass-dark :is(h1,h2),
 html body .ak-glass-kpi :is(h1,h2),
 html body .ak-iz-petrol-card :is(h1,h2) {
 line-height: 1.16 !important;
 }
}

/* 25.6 iPad: volle Kachelbreite nutzen, aber Umbruch erlauben */
@media (min-width: 601px) and (max-width: 900px) {
 html body .ak-glass-card :is(h1,h2,h3,.ak-liquid-title,[class*="headline"]),
 html body .ak-glass-card-strong :is(h1,h2,h3,.ak-liquid-title,[class*="headline"]),
 html body .ak-glass-dark :is(h1,h2,h3,.ak-liquid-title,[class*="headline"]),
 html body .ak-glass-kpi :is(h1,h2,h3,.ak-liquid-title,[class*="headline"]),
 html body .ak-iz-petrol-card :is(h1,h2,h3,.ak-liquid-title,[class*="headline"]),
 html body .ak-card :is(h1,h2,h3,.ak-liquid-title,[class*="headline"]),
 html body .ak-tile :is(h1,h2,h3,.ak-liquid-title,[class*="headline"]) {
 max-inline-size: 100% !important;
 white-space: normal !important;
 }
}

/* 25.7 iPhone: eine Spalte, natürliche Höhe, normaler Umbruch */
@media (max-width: 600px) {
 html body h1,
 html body h2,
 html body h3,
 html body .entry-title,
 html body .page-title,
 html body .elementor-heading-title,
 html body .ak-liquid-title,
 html body [class*="headline"] {
 max-inline-size: 100% !important;
 white-space: normal !important;
 overflow-wrap: normal !important;
 }
}

/* === ENDE BLOCK 25 === */


/* ============================================================
 BLOCK 26   BOSCH CAR SERVICE / GRID-STABILISIERUNG
 Revision: 22.07.2026

 Zweck:
 - Erhält die ursprünglichen HTML-Raster.
 - Verhindert schmale Spalten auf Desktop/iPad.
 - Keine Änderungen an Schriftgrößen.
 - Keine globale Ãœberschreibung von Inline-Layouts.
 ============================================================ */

@media (min-width:601px){

 /* Originale Gridgrößen beibehalten */

 html body [style*="minmax(min(100%,160px),1fr)"]{
 display:grid !important;
 grid-template-columns:repeat(auto-fit,minmax(min(100%,160px),1fr)) !important;
 }

 html body [style*="minmax(min(100%,220px),1fr)"]{
 display:grid !important;
 grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr)) !important;
 }

 html body [style*="minmax(min(100%,280px),1fr)"]{
 display:grid !important;
 grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr)) !important;
 }

 html body [style*="minmax(min(100%,320px),1fr)"]{
 display:grid !important;
 grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr)) !important;
 }

 /* Nur Stabilisierung */

 html body [style*="grid-template-columns"][style*="auto-fit"]{
 min-width:0 !important;
 width:100% !important;
 max-width:100% !important;
 align-items:stretch !important;
 }

 /* Nur Textfluss normalisieren */

 html body :is(h1,h2,h3,h4,p,span,strong,li,a){
 writing-mode:horizontal-tb !important;
 text-orientation:mixed !important;
 white-space:normal !important;
 word-break:normal !important;
 overflow-wrap:normal !important;
 hyphens:none !important;
 -webkit-hyphens:none !important;
 }

}

/* iPad */

@media (min-width:601px) and (max-width:1023px){

 html body [style*="minmax(min(100%,220px),1fr)"]{
 grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr)) !important;
 }

 html body [style*="minmax(min(100%,280px),1fr)"],
 html body [style*="minmax(min(100%,320px),1fr)"]{
 grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr)) !important;
 }

}

/* Smartphone */

@media (max-width:600px){

 html body [style*="grid-template-columns"]{
 grid-template-columns:1fr !important;
 }

}

/* === ENDE BLOCK 26 === */


/* ============================================================
 BLOCK 27   HEADER SCHÃœTZEN + H1/H2/H3 NUR IM INHALT VEREINHEITLICHEN
 18.07.2026

 Wichtig:
 Frühere globale Headline-Regeln dürfen NICHT in Header, Logo-Bereich,
 Menüleisten oder Footer hineinwirken. Deshalb wird die Typografie ab hier
 nur noch auf echte Inhaltsbereiche begrenzt.
 ============================================================ */

/* 27.1 Header / Menüleiste gegen Headline- und Layout-Overrides absichern */
html body #header,
html body #header-container,
html body header,
html body .site-header,
html body .navbar,
html body .navbar-inverse,
html body .navbar-default,
html body .navbar-header,
html body .navbar-collapse,
html body .navbar-left,
html body .navbar-right {
 font-family: var(--ak-font-sans) !important;
 letter-spacing: 0 !important;
}

html body #header h1,
html body #header h2,
html body #header h3,
html body #header .headline-h1,
html body #header .headline-h2,
html body #header .headline-h3,
html body #header .elementor-heading-title,
html body header h1,
html body header h2,
html body header h3,
html body header .headline-h1,
html body header .headline-h2,
html body header .headline-h3,
html body header .elementor-heading-title {
 font-size: inherit !important;
 line-height: inherit !important;
 font-weight: inherit !important;
 color: inherit !important;
 margin: 0 !important;
 padding: 0 !important;
 letter-spacing: 0 !important;
 max-width: none !important;
 max-inline-size: none !important;
}

html body #header .navbar-nav > li > a,
html body #header nav a,
html body .navbar-inverse .navbar-nav > li > a,
html body .navbar-default .navbar-nav > li > a {
 font-family: var(--ak-font-sans) !important;
 font-size: 1rem !important;
 line-height: 1.2 !important;
 font-weight: 400 !important;
 letter-spacing: 0 !important;
 text-transform: none !important;
 white-space: nowrap !important;
 overflow-wrap: normal !important;
 word-break: normal !important;
 hyphens: none !important;
}

@media (min-width: 901px) {
 html body .navbar-inverse .navbar-nav > li > a,
 html body .navbar-default .navbar-nav > li > a {
 padding: 26px 24px !important;
 }

 html body .header-menu-fixed .navbar-inverse .navbar-nav > li > a,
 html body .header-menu-fixed .navbar-default .navbar-nav > li > a {
 padding: 0 24px !important;
 }
}

/* 27.2 Einheitliche H1/H2/H3   ausschließlich im Seiteninhalt */
html body :is(main, #main, .site-content, .page-content, .entry-content, .content-area, .infomanager-area, .ak-liquid-page, .ak-no-hyphen)
 :is(h1, .headline-h1, .entry-title, .page-title, .ak-page-title, .elementor-widget-heading h1.elementor-heading-title) {
 font-family: var(--ak-font-sans) !important;
 font-size: clamp(24px, 1.9vw, 30px) !important;
 line-height: 1.18 !important;
 font-weight: 700 !important;
 letter-spacing: 0 !important;
 color: var(--ak-primary) !important;
 white-space: normal !important;
 word-break: normal !important;
 overflow-wrap: normal !important;
 hyphens: none !important;
}

html body :is(main, #main, .site-content, .page-content, .entry-content, .content-area, .infomanager-area, .ak-liquid-page, .ak-no-hyphen)
 :is(h2, .headline-h2, .elementor-widget-heading h2.elementor-heading-title) {
 font-family: var(--ak-font-sans) !important;
 font-size: clamp(21px, 1.55vw, 26px) !important;
 line-height: 1.22 !important;
 font-weight: 700 !important;
 letter-spacing: 0 !important;
 color: var(--ak-primary) !important;
 white-space: normal !important;
 word-break: normal !important;
 overflow-wrap: normal !important;
 hyphens: none !important;
}

html body :is(main, #main, .site-content, .page-content, .entry-content, .content-area, .infomanager-area, .ak-liquid-page, .ak-no-hyphen)
 :is(h3, .headline-h3, .elementor-widget-heading h3.elementor-heading-title) {
 font-family: var(--ak-font-sans) !important;
 font-size: clamp(18px, 1.25vw, 22px) !important;
 line-height: 1.28 !important;
 font-weight: 700 !important;
 letter-spacing: 0 !important;
 color: var(--ak-primary) !important;
 white-space: normal !important;
 word-break: normal !important;
 overflow-wrap: normal !important;
 hyphens: none !important;
}

/* 27.3 iPad: gleiche Logik, etwas kompakter */
@media (min-width: 601px) and (max-width: 900px) {
 html body :is(main, #main, .site-content, .page-content, .entry-content, .content-area, .infomanager-area, .ak-liquid-page, .ak-no-hyphen)
 :is(h1, .headline-h1, .entry-title, .page-title, .ak-page-title, .elementor-widget-heading h1.elementor-heading-title) {
 font-size: 26px !important;
 }

 html body :is(main, #main, .site-content, .page-content, .entry-content, .content-area, .infomanager-area, .ak-liquid-page, .ak-no-hyphen)
 :is(h2, .headline-h2, .elementor-widget-heading h2.elementor-heading-title) {
 font-size: 23px !important;
 }

 html body :is(main, #main, .site-content, .page-content, .entry-content, .content-area, .infomanager-area, .ak-liquid-page, .ak-no-hyphen)
 :is(h3, .headline-h3, .elementor-widget-heading h3.elementor-heading-title) {
 font-size: 20px !important;
 }
}

/* 27.4 iPhone bleibt lesbar und kompakt */
@media (max-width: 600px) {
 html body :is(main, #main, .site-content, .page-content, .entry-content, .content-area, .infomanager-area, .ak-liquid-page, .ak-no-hyphen)
 :is(h1, .headline-h1, .entry-title, .page-title, .ak-page-title, .elementor-widget-heading h1.elementor-heading-title) {
 font-size: 24px !important;
 line-height: 1.2 !important;
 }

 html body :is(main, #main, .site-content, .page-content, .entry-content, .content-area, .infomanager-area, .ak-liquid-page, .ak-no-hyphen)
 :is(h2, .headline-h2, .elementor-widget-heading h2.elementor-heading-title) {
 font-size: 21px !important;
 line-height: 1.22 !important;
 }

 html body :is(main, #main, .site-content, .page-content, .entry-content, .content-area, .infomanager-area, .ak-liquid-page, .ak-no-hyphen)
 :is(h3, .headline-h3, .elementor-widget-heading h3.elementor-heading-title) {
 font-size: 19px !important;
 line-height: 1.28 !important;
 }
}

/* === ENDE BLOCK 27 === */
/* =========================================================
 iPhone / Mobile Safari   horizontalen Overscroll verhindern
 ========================================================= */

@media (max-width: 767.98px) {
 html,
 body {
 position: relative;
 width: 100%;
 max-width: 100%;
 overflow-x: hidden !important;
 overscroll-behavior-x: none;
 }

 @supports (overflow: clip) {
 html,
 body {
 overflow-x: clip !important;
 }
 }
}
/* ==========================================================================
 MASTER CSS HOTFIX 22.07.2026
 Test 1   stellt die ursprünglichen Grid-Definitionen der Liquid-Seiten
 wieder her.
 ========================================================================== */



html body .ak-no-hyphen div[style*="repeat(2"],
html body .ak-liquid-page div[style*="repeat(2"],
html body .ak-home-liquid div[style*="repeat(2"],
html body .ak-startseite-liquid div[style*="repeat(2"]{
 grid-template-columns: repeat(2,minmax(0,1fr)) !important;
}
/* Mobile Seitenleiste: rechtliche Links immer petrol */
html body #page_sidebar .footer_copy_menu,
html body #page_sidebar .footer_copy_menu li,
html body #page_sidebar .footer_copy_menu a,
html body #page_sidebar .footer_copy_menu a:link,
html body #page_sidebar .footer_copy_menu a:visited {
 color: var(--ak-petrol) !important;
 -webkit-text-fill-color: var(--ak-petrol) !important;
 text-decoration-color: currentColor !important;
}

html body #page_sidebar .footer_copy_menu a:hover,
html body #page_sidebar .footer_copy_menu a:focus-visible,
html body #page_sidebar .footer_copy_menu a:active {
 color: var(--ak-primary) !important;
 -webkit-text-fill-color: var(--ak-primary) !important;
}
/*
=====================================================================
AUTOHAUS KAMEN —  MASTER CSS V2
Mobile Performance Stabilisierung —  überarbeitete Fassung
Stand: 25.07.2026

EINSATZ:
- Den bisherigen V2-Block vollständig entfernen.
- Diesen Block ganz am Ende der bestehenden Master-CSS einfügen.
- Desktop und größere Tablets ab 768 px bleiben unverändert.

ZIELE:
- Cookie-Consent sofort bedienbar
- Mobiles Menü sofort bedienbar
- Keine verzögerten Touch-Ereignisse auf iPhone/Safari
- Menüinhalt wird ohne sichtbares Nachladen eingeblendet
- Audaris-Transition-Ende bleibt technisch erhalten
=====================================================================
*/

@media (max-width: 767.98px) {

 /*
 1. Mobile Initialisierung stabilisieren
 Animationen und Übergänge werden extrem verkürzt, aber nicht
 vollständig deaktiviert. Dadurch bleiben mögliche Audaris-
 transitionend-/animationend-Ereignisse erhalten.
 */
 /* FIX 22.09.2026: Das gesamte Audaris-Fahrzeugwidget von der mobilen
    globalen Zeitverkürzung ausnehmen: Startseiten-Slider, Fahrzeuggalerie,
    Empfehlungs-Slider und Bildvorschau verwenden ihre eigenen Übergänge.
    Menü/Cookies und die separate prefers-reduced-motion-Regel bleiben erhalten.
    Rollback auf 21.09.: in diesen drei :where()-Listen wieder
    .audaris-widget .VehicleSlider, .audaris-widget .VehicleSlider * einsetzen. */
 *:not(:where(.audaris-widget, .audaris-widget *)),
 *:not(:where(.audaris-widget, .audaris-widget *))::before,
 *:not(:where(.audaris-widget, .audaris-widget *))::after {
 animation-duration: 0.01ms !important;
 animation-delay: 0s !important;
 animation-iteration-count: 1 !important;
 transition-duration: 0.01ms !important;
 transition-delay: 0s !important;
 }

 /*
 2. Kein verzögertes Smooth-Scrolling während des Seitenstarts
 */
 html,
 body {
 scroll-behavior: auto !important;
 }

 /*
 3. Kritische Audaris-/EasyWay-Ebenen ohne rechenintensive
 Hintergrundunschärfe rendern
 */
 #cookie-consent-modal,
 #cookie-consent-modal .modal-dialog,
 #cookie-consent-modal .modal-content,
 #page_sidebar,
 #page-sidebar,
 #page_overlay,
 #page-overlay,
 .modal-backdrop {
 -webkit-backdrop-filter: none !important;
 backdrop-filter: none !important;
 }

 /*
 4. Cookie-Schaltflächen unmittelbar touchfähig halten
 */
 #cookie-consent-save,
 #cookie-consent-deny-all,
 #cookie-consent-accept-all {
 touch-action: manipulation;
 -webkit-tap-highlight-color: transparent;
 }

 /*
 5. Mobiles Menü unmittelbar touchfähig halten
 */
 #menu-toggle,
 #menu-close-toggle,
 .menu-toggle,
 .menu-toggle-text {
 touch-action: manipulation;
 -webkit-tap-highlight-color: transparent;
 }

 /*
 6. Kritische Komponenten extrem kurz animieren,
 aber Transition-Ende für Audaris erhalten
 */
 #cookie-consent-modal,
 #cookie-consent-modal *,
 #page_sidebar,
 #page-sidebar,
 #page_overlay,
 #page-overlay {
 animation-duration: 0.01ms !important;
 animation-delay: 0s !important;
 animation-iteration-count: 1 !important;

 transition-duration: 0.01ms !important;
 transition-delay: 0s !important;
 }
}

/*
Barrierefreiheit:
Bei aktivierter Systemoption —~Bewegung reduzieren—S werden Animationen
auch auf größeren Displays minimiert, ohne sie vollständig zu entfernen.
*/
@media (prefers-reduced-motion: reduce) {
 *,
 *::before,
 *::after {
 animation-duration: 0.01ms !important;
 animation-delay: 0s !important;
 animation-iteration-count: 1 !important;
 transition-duration: 0.01ms !important;
 transition-delay: 0s !important;
 scroll-behavior: auto !important;
 }
}/* ============================================================
 IPHONE MOBILE MENU   UNTEREN KONTAKTBEREICH SOFORT RENDERN
 Performance-Fix für Sidebar, Kontakt und Öffnungszeiten
============================================================ */

@media (max-width: 767.98px) {

 /* Großflächigen Live-Blur auf iPhone vermeiden */
 html body #page_sidebar {
 -webkit-backdrop-filter: none !important;
 backdrop-filter: none !important;

 background:
 radial-gradient(
 circle at 14% 0%,
 rgba(255,255,255,0.98) 0%,
 rgba(255,255,255,0.94) 34%,
 rgba(223,245,255,0.98) 100%
 ),
 linear-gradient(
 135deg,
 rgba(255,255,255,0.98),
 rgba(223,245,255,0.96)
 ) !important;
 }

 /* Unteren Menübereich ohne verzögerte Darstellung ausgeben */
 html body #page_sidebar .phone-mail-infos,
 html body #page_sidebar .phone-mail-infos *,
 html body #page_sidebar .extra-mobile-menu,
 html body #page_sidebar .extra-mobile-menu *,
 html body #page_sidebar .footer_copy_menu,
 html body #page_sidebar .footer_copy_menu * {
 animation: none !important;
 animation-delay: 0s !important;
 transition: none !important;
 transition-delay: 0s !important;

 opacity: 1 !important;
 visibility: visible !important;

 content-visibility: visible !important;
 transform: none !important;
 will-change: auto !important;
 }

 /* Kontaktbalken direkt in eigene Rendering-Ebene setzen */
 html body #page_sidebar .phone-mail-infos a,
 html body #page_sidebar .phone-mail-infos .btn,
 html body #page_sidebar .extra-mobile-menu > a,
 html body #page_sidebar a[href^="tel:"],
 html body #page_sidebar a[href^="mailto:"],
 html body #page_sidebar a[href*="wa.me"],
 html body #page_sidebar a[href*="whatsapp"] {
 opacity: 1 !important;
 visibility: visible !important;
 pointer-events: auto !important;
 touch-action: manipulation;

 -webkit-transform: translateZ(0);
 transform: translateZ(0);

 animation: none !important;
 transition: none !important;
 }
}


/* =============================================================================
 V3 LTS — FREIGABEVERMERK
 Diese Datei entspricht funktional der erfolgreich geprüften V3 RC1.
 Für die LTS-Freigabe wurden keine zusätzlichen produktiven CSS-Deklarationen
 eingeführt. Dadurch bleibt das bestätigte Verhalten vollständig erhalten.

 Noch nicht enthalten:
 Die optische Breitenkorrektur der Seite „Online-Terminvereinbarung“ wird erst
 nach eindeutiger Identifikation des seitenbezogenen CMS-Selektors ergänzt.
 Eine unbestätigte globale Containerregel wurde bewusst nicht aufgenommen.
 ============================================================================= */

/* =============================================================================
 V3 LTS — CHANGELOG 27.07.2026
 1. Footer-Weißschrift auf echte Footer-Container begrenzt.
 2. Mobiles .footer_copy_menu bleibt durch den bestehenden Hotfix petrol.
 3. Sidebar-Blur nur noch von 768 bis 1279,98 px aktiviert.
 4. Mobile Safari-Hotfixes und sofortiges Rendering unverändert erhalten.
 5. 100dvh priorisiert; -webkit-fill-available nur als Legacy-Fallback.
 6. Kommentar-Kodierung und RC1-Dokumentation bereinigt.
 ============================================================================= */

/* ========================================================================== 
   AUTOHAUS KAMEN — NAVIGATION RECONSTRUCTION RC1
   Audit 08 / Layer & Click Engine
   Ziel: deterministische Zustände, keine unsichtbaren klickbaren Layer
   ========================================================================== */

:root {
  --ak-nav-z-header: 500;
  --ak-nav-z-dropdown: 520;
  --ak-nav-z-sidebar: 900;
}

/* Dekorative Ebenen dürfen niemals Interaktionen blockieren. */
#header::before,
#header::after,
#header .navbar::before,
#header .navbar::after,
#header .navbar-nav::before,
#header .navbar-nav::after,
#header .navigation-main::before,
#header .navigation-main::after,
#header .main-navigation::before,
#header .main-navigation::after,
#header .dropdown-menu::before,
#header .dropdown-menu::after,
#page_sidebar::before,
#page_sidebar::after,
#page_sidebar .navbar-nav::before,
#page_sidebar .navbar-nav::after,
#page_sidebar .navigation::before,
#page_sidebar .navigation::after,
#page_sidebar .main-navigation::before,
#page_sidebar .main-navigation::after,
.offcanvas::after,
.offcanvas-menu::after,
.mobile-menu::after,
.mobile-navigation::after,
.navigation-mobile::after,
.navbar-collapse::after,
.main-navigation::after,
.navigation::after {
  pointer-events: none !important;
}

/* ----------------------------- Desktop ---------------------------------- */
@media (min-width: 1024px) {
  html #header {
    position: relative !important;
    z-index: var(--ak-nav-z-header) !important;
    overflow: visible !important;
    isolation: isolate;
  }

  /* Historische Fullscreen-/Offcanvas-Werte im Desktop vollständig neutralisieren. */
  html #header .navbar-collapse,
  html #header .navigation-main,
  html #header .main-navigation,
  html #header .navigation {
    position: relative !important;
    inset: auto !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding-bottom: 0 !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    pointer-events: auto !important;
  }

  html #header .navbar-collapse::after,
  html #header .navigation-main::after,
  html #header .main-navigation::after,
  html #header .navigation::after {
    content: none !important;
    display: none !important;
    height: 0 !important;
  }

  html #header .navbar-nav,
  html #header .navigation-main,
  html #header .main-navigation {
    position: relative !important;
    z-index: 1;
    overflow: visible !important;
    pointer-events: auto !important;
  }

  html #header .navbar-nav > li,
  html #header .navigation-main > li,
  html #header .main-navigation > li {
    position: relative !important;
    z-index: 1;
    overflow: visible !important;
  }

  /* Ein einziger geschlossener Dropdown-Zustand. */
  html #header .navbar-nav > li > .dropdown-menu,
  html #header .navigation-main > li > .dropdown-menu,
  html #header .main-navigation > li > .dropdown-menu,
  html #header .navbar-nav > li > ul,
  html #header .navigation-main > li > ul,
  html #header .main-navigation > li > ul {
    display: none !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: auto !important;
    bottom: auto !important;
    z-index: var(--ak-nav-z-dropdown) !important;
    width: max-content;
    min-width: 260px;
    max-width: min(420px, calc(100vw - 32px));
    height: auto !important;
    max-height: calc(100vh - 120px);
    margin: 0 !important;
    padding: 8px 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    visibility: hidden !important;
    opacity: 0 !important;
    transform: none !important;
    pointer-events: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  /* Bootstrap/EasyWay, Tastatur und Hover führen in denselben offenen Zustand. */
  html #header .navbar-nav > li.open > .dropdown-menu,
  html #header .navbar-nav > li.show > .dropdown-menu,
  html #header .navbar-nav > li:hover > .dropdown-menu,
  html #header .navbar-nav > li:focus-within > .dropdown-menu,
  html #header .navigation-main > li.open > .dropdown-menu,
  html #header .navigation-main > li.show > .dropdown-menu,
  html #header .navigation-main > li:hover > .dropdown-menu,
  html #header .navigation-main > li:focus-within > .dropdown-menu,
  html #header .main-navigation > li.open > .dropdown-menu,
  html #header .main-navigation > li.show > .dropdown-menu,
  html #header .main-navigation > li:hover > .dropdown-menu,
  html #header .main-navigation > li:focus-within > .dropdown-menu,
  html #header .dropdown-menu.show {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  html #header .dropdown-toggle,
  html #header .dropdown-menu,
  html #header .dropdown-menu a {
    touch-action: manipulation;
  }
}

/* ------------------------- Mobile / Tablet ------------------------------- */
@media (max-width: 1023.98px) {
  /* Nur die echte Sidebar ist ein Fullscreen-/Offcanvas-Layer. */
  html body #page_sidebar {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: auto !important;
    z-index: var(--ak-nav-z-sidebar) !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  html body.menu-toggled #page_sidebar,
  html body.menu-toggled #wrapper #page_sidebar,
  html body.menu-open #page_sidebar,
  html body.nav-open #page_sidebar,
  html body.offcanvas-open #page_sidebar,
  html body.mobile-menu-open #page_sidebar {
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  /* Navigationslisten innerhalb der Sidebar bleiben im normalen Fluss. */
  html body #page_sidebar .navbar-collapse,
  html body #page_sidebar .navbar-nav,
  html body #page_sidebar .nav,
  html body #page_sidebar .navigation,
  html body #page_sidebar .main-navigation,
  html body #page_sidebar .mobile-navigation,
  html body #page_sidebar .navigation-mobile,
  html body #page_sidebar .offcanvas,
  html body #page_sidebar .offcanvas-menu,
  html body #page_sidebar .mobile-menu {
    position: static !important;
    inset: auto !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding-bottom: 0 !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    pointer-events: auto !important;
  }

  html body #page_sidebar .navbar-collapse::after,
  html body #page_sidebar .navbar-nav::after,
  html body #page_sidebar .nav::after,
  html body #page_sidebar .navigation::after,
  html body #page_sidebar .main-navigation::after,
  html body #page_sidebar .mobile-navigation::after,
  html body #page_sidebar .navigation-mobile::after,
  html body #page_sidebar .offcanvas::after,
  html body #page_sidebar .offcanvas-menu::after,
  html body #page_sidebar .mobile-menu::after {
    content: none !important;
    display: none !important;
    height: 0 !important;
  }

  /* Header-Container dürfen mobil keinen unsichtbaren Fullscreen-Layer bilden. */
  html #header .navbar-collapse,
  html #header .navigation-main,
  html #header .main-navigation,
  html #header .navigation {
    position: static !important;
    inset: auto !important;
    height: auto !important;
    max-height: none !important;
    padding-bottom: 0 !important;
    overflow: visible !important;
    transform: none !important;
  }

  html #header .navbar-collapse::after,
  html #header .navigation-main::after,
  html #header .main-navigation::after,
  html #header .navigation::after {
    content: none !important;
    display: none !important;
    height: 0 !important;
  }

  /* Geschlossene Untermenüs sind auch aus der Klickebene entfernt. */
  html body #page_sidebar li > .dropdown-menu {
    display: none !important;
    position: static !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transform: none !important;
  }

  html body #page_sidebar li.open > .dropdown-menu,
  html body #page_sidebar li.show > .dropdown-menu,
  html body #page_sidebar li:focus-within > .dropdown-menu,
  html body #page_sidebar .dropdown-menu.show {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  html body #page_sidebar,
  html body #page_sidebar .navbar-collapse,
  html body #page_sidebar .dropdown-menu {
    animation: none !important;
    transition: none !important;
  }

  html body #page_sidebar a,
  html body #page_sidebar button,
  html body #page_sidebar .dropdown-toggle {
    position: relative;
    z-index: 1;
    pointer-events: auto !important;
    touch-action: manipulation;
  }
}
/* ==========================================================================
   AUTOHAUS KAMEN — NAVIGATION REBUILD RC2.1
   Sofortkorrektur nach iPhone-Regressionsfehler
   Stand: 28.07.2026

   WICHTIG:
   - Mobile Navigation bleibt technisch auf RC1.
   - Die riskanten RC2-Eingriffe in Position, Transform und Scrollstruktur
     wurden vollständig entfernt.
   - Übernommen wird ausschließlich die begrenzte Desktop-Hover-Korrektur.
   ========================================================================== */

/* --------------------------------------------------------------------------
   DESKTOP: HOVER NUR BEI ECHTER MAUS-/TRACKPAD-STEUERUNG
   -------------------------------------------------------------------------- */
@media (min-width: 1024px) {

  /*
   Haftenden Fokuszustand neutralisieren, solange das CMS keine echte
   .open- oder .show-Klasse gesetzt hat.
   */
  html #header .navbar-nav > li:focus-within:not(.open):not(.show) > .dropdown-menu,
  html #header .navigation-main > li:focus-within:not(.open):not(.show) > .dropdown-menu,
  html #header .main-navigation > li:focus-within:not(.open):not(.show) > .dropdown-menu {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  /*
   Echte CMS-/JavaScript-Zustände bleiben uneingeschränkt aktiv.
   */
  html #header .navbar-nav > li.open > .dropdown-menu,
  html #header .navbar-nav > li.show > .dropdown-menu,
  html #header .navigation-main > li.open > .dropdown-menu,
  html #header .navigation-main > li.show > .dropdown-menu,
  html #header .main-navigation > li.open > .dropdown-menu,
  html #header .main-navigation > li.show > .dropdown-menu,
  html #header .dropdown-menu.show {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
}

/*
Hover-Fallback ausschließlich auf Geräten mit echter Hover-Fähigkeit.
Keine Wirkung auf iPhone, iPad oder grobe Touch-Eingabe.
*/
@media (min-width: 1024px) and (hover: hover) and (pointer: fine) {

  html #header .navbar-nav > li:hover > .dropdown-menu,
  html #header .navigation-main > li:hover > .dropdown-menu,
  html #header .main-navigation > li:hover > .dropdown-menu {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  html #header .navbar-nav:hover > li:not(:hover):not(.open):not(.show) > .dropdown-menu,
  html #header .navigation-main:hover > li:not(:hover):not(.open):not(.show) > .dropdown-menu,
  html #header .main-navigation:hover > li:not(:hover):not(.open):not(.show) > .dropdown-menu {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }
}

/*
Explizite Touch-Sicherung:
Auf Touch-/Hybridgeräten darf die Desktop-Hover-Logik nicht greifen.
*/
@media (min-width: 1024px) and ((hover: none) or (pointer: coarse)) {

  html #header .navbar-nav > li:hover:not(.open):not(.show) > .dropdown-menu,
  html #header .navigation-main > li:hover:not(.open):not(.show) > .dropdown-menu,
  html #header .main-navigation > li:hover:not(.open):not(.show) > .dropdown-menu {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }
}

/* ==========================================================================
   ENDE NAVIGATION REBUILD RC2.1
   ========================================================================== */
/* ==========================================================================
   AUTOHAUS KAMEN — NAVIGATION REBUILD RC2.2
   Isolierte iPhone-Korrektur für den unteren Kontaktbereich
   Stand: 28.07.2026

   Grundlage:
   - komplette RC2.1 bleibt unverändert
   - keine Änderung an #page_sidebar
   - keine Änderung an Menüöffnung oder -schließung
   - keine Änderung an position, transform, height oder Scrollcontainern
   - ausschließlich verzögerte Darstellung des unteren Kontaktbereichs
   ========================================================================== */

@media (max-width: 767.98px) {

  /*
   Die betroffenen Kontakt- und Footerbereiche werden unmittelbar gerendert.
   Die Sichtbarkeit des gesamten Menüs wird weiterhin ausschließlich durch
   den bestehenden Sidebar-/CMS-Zustand gesteuert.
   */
  html body #page_sidebar .phone-mail-infos,
  html body #page_sidebar .extra-mobile-menu,
  html body #page_sidebar .footer_copy_menu {
    opacity: 1 !important;
    visibility: visible !important;
    content-visibility: visible !important;
    pointer-events: auto !important;

    animation: none !important;
    animation-delay: 0s !important;
    animation-duration: 0s !important;

    transition: none !important;
    transition-delay: 0s !important;
    transition-duration: 0s !important;
  }

  /*
   Auch direkt enthaltene Schaltflächen, Links und Textblöcke dürfen nicht
   zeitversetzt eingeblendet werden.
   */
  html body #page_sidebar .phone-mail-infos > *,
  html body #page_sidebar .extra-mobile-menu > *,
  html body #page_sidebar .footer_copy_menu > *,
  html body #page_sidebar .phone-mail-infos a,
  html body #page_sidebar .phone-mail-infos button,
  html body #page_sidebar .extra-mobile-menu a,
  html body #page_sidebar .extra-mobile-menu button,
  html body #page_sidebar .footer_copy_menu a,
  html body #page_sidebar .footer_copy_menu button {
    opacity: 1 !important;
    visibility: visible !important;
    content-visibility: visible !important;

    animation: none !important;
    animation-delay: 0s !important;
    animation-duration: 0s !important;

    transition: none !important;
    transition-delay: 0s !important;
    transition-duration: 0s !important;
  }

  /*
   Pseudo-Elemente der petrolfarbenen Kontaktflächen ebenfalls ohne
   verzögerte Einblendung rendern.
   */
  html body #page_sidebar .phone-mail-infos::before,
  html body #page_sidebar .phone-mail-infos::after,
  html body #page_sidebar .extra-mobile-menu::before,
  html body #page_sidebar .extra-mobile-menu::after,
  html body #page_sidebar .footer_copy_menu::before,
  html body #page_sidebar .footer_copy_menu::after,
  html body #page_sidebar .phone-mail-infos a::before,
  html body #page_sidebar .phone-mail-infos a::after,
  html body #page_sidebar .extra-mobile-menu a::before,
  html body #page_sidebar .extra-mobile-menu a::after {
    opacity: 1 !important;
    visibility: visible !important;

    animation: none !important;
    animation-delay: 0s !important;
    animation-duration: 0s !important;

    transition: none !important;
    transition-delay: 0s !important;
    transition-duration: 0s !important;
  }
}

/* ==========================================================================
   ENDE NAVIGATION REBUILD RC2.2
   ========================================================================== */
/* ==========================================================================
   AUTOHAUS KAMEN — NAVIGATION REBUILD RC2.4
   Desktop-Navigation ausschließlich per Klick
   Stand: 28.07.2026

   Grundlage:
   - komplette RC2.2 bleibt unverändert
   - iPhone-/Mobile-Navigation bleibt vollständig unangetastet
   - ausschließlich Desktop ab 1024 px
   - Hover öffnet kein Untermenü mehr
   - Dropdowns öffnen nur über CMS-/JavaScript-Zustände .open und .show
   ========================================================================== */

@media (min-width: 1024px) {

  /*
   Sämtliche früheren CSS-Hover-Öffner werden neutralisiert.
   Ein reiner Maus-Hover darf kein Dropdown sichtbar machen.
   */
  html body #header .navbar-nav > li:hover:not(.open):not(.show) > .dropdown-menu,
  html body #header .navigation-main > li:hover:not(.open):not(.show) > .dropdown-menu,
  html body #header .main-navigation > li:hover:not(.open):not(.show) > .dropdown-menu,
  html body header .navbar-nav > li:hover:not(.open):not(.show) > .dropdown-menu,
  html body header .navigation-main > li:hover:not(.open):not(.show) > .dropdown-menu,
  html body header .main-navigation > li:hover:not(.open):not(.show) > .dropdown-menu {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;

    animation: none !important;
    transition: none !important;
  }

  /*
   Auch ein haftender Fokuszustand darf das Dropdown nicht öffnen.
   Das verhindert Konflikte zwischen Mausfokus, Tastaturfokus und Klicklogik.
   */
  html body #header .navbar-nav > li:focus-within:not(.open):not(.show) > .dropdown-menu,
  html body #header .navigation-main > li:focus-within:not(.open):not(.show) > .dropdown-menu,
  html body #header .main-navigation > li:focus-within:not(.open):not(.show) > .dropdown-menu,
  html body header .navbar-nav > li:focus-within:not(.open):not(.show) > .dropdown-menu,
  html body header .navigation-main > li:focus-within:not(.open):not(.show) > .dropdown-menu,
  html body header .main-navigation > li:focus-within:not(.open):not(.show) > .dropdown-menu {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  /*
   Geschlossener Grundzustand.
   */
  html body #header .navbar-nav > li:not(.open):not(.show) > .dropdown-menu,
  html body #header .navigation-main > li:not(.open):not(.show) > .dropdown-menu,
  html body #header .main-navigation > li:not(.open):not(.show) > .dropdown-menu,
  html body header .navbar-nav > li:not(.open):not(.show) > .dropdown-menu,
  html body header .navigation-main > li:not(.open):not(.show) > .dropdown-menu,
  html body header .main-navigation > li:not(.open):not(.show) > .dropdown-menu {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  /*
   Ein Untermenü öffnet ausschließlich, wenn Audaris/EasyWay beim Klick
   einen echten offenen Zustand setzt.
   */
  html body #header .navbar-nav > li.open > .dropdown-menu,
  html body #header .navbar-nav > li.show > .dropdown-menu,
  html body #header .navigation-main > li.open > .dropdown-menu,
  html body #header .navigation-main > li.show > .dropdown-menu,
  html body #header .main-navigation > li.open > .dropdown-menu,
  html body #header .main-navigation > li.show > .dropdown-menu,
  html body #header .dropdown-menu.show,
  html body header .navbar-nav > li.open > .dropdown-menu,
  html body header .navbar-nav > li.show > .dropdown-menu,
  html body header .navigation-main > li.open > .dropdown-menu,
  html body header .navigation-main > li.show > .dropdown-menu,
  html body header .main-navigation > li.open > .dropdown-menu,
  html body header .main-navigation > li.show > .dropdown-menu,
  html body header .dropdown-menu.show {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;

    animation: none !important;
    transition: none !important;
  }

  /*
   Hover bleibt lediglich als optische Rückmeldung am Hauptmenüpunkt bestehen.
   Es wird keine Dropdown-Sichtbarkeit darüber gesteuert.
   */
  html body #header .navbar-nav > li:hover > a,
  html body #header .navigation-main > li:hover > a,
  html body #header .main-navigation > li:hover > a,
  html body header .navbar-nav > li:hover > a,
  html body header .navigation-main > li:hover > a,
  html body header .main-navigation > li:hover > a {
    cursor: pointer !important;
  }
}

/* ==========================================================================
   ENDE NAVIGATION REBUILD RC2.4
   ========================================================================== */
   /* ============================================================
   ENDE NAVIGATION REBUILD RC2.4
   ============================================================ */


/* ==========================================================================
   AUTOHAUS KAMEN – NAVIGATION EVENT FIX
   ========================================================================== */

@media (max-width: 1023.98px) {

    html body #page_sidebar,
    html body #page_sidebar .navbar-collapse,
    html body #page_sidebar .navbar-nav,
    html body #page_sidebar .dropdown-menu,
    html body #page_sidebar .phone-mail-infos,
    html body #page_sidebar .extra-mobile-menu,
    html body #page_sidebar .footer_copy_menu {
        transition-property: opacity, visibility, transform, max-height !important;
        transition-duration: 0.01ms !important;
        transition-delay: 0s !important;
    }
}

@media (min-width: 1024px) {

    html body #header .navbar-nav > li > .dropdown-menu,
    html body #header .navigation-main > li > .dropdown-menu,
    html body #header .main-navigation > li > .dropdown-menu,
    html body #header .dropdown-menu {
        transition-property: opacity, visibility !important;
        transition-duration: 0.01ms !important;
        transition-delay: 0s !important;
    }
}

/* =============================================================================
   AUTOHAUS KAMEN — MASTER CSS V3.1 LTS
   iPhone / Mobile Safari Edge-to-Edge Optimierung
   Stand: 15.09.2026

   ZIEL
   - vorhandene V3-LTS vollständig erhalten
   - horizontale Fläche moderner iPhones besser ausnutzen
   - starre seitliche Reserven im mobilen Header entfernen
   - Apple Safe Areas links/rechts berücksichtigen
   - Liquid-Glass-Innenabstände, Navigation, Sidebar und Performance-Hotfixes
     funktional unverändert lassen

   ROLLBACK
   - Für vollständigen Rollback diesen gesamten V3.1-Block entfernen.
   - Die davorliegende V3-LTS bleibt dadurch unverändert erhalten.
   ============================================================================= */

@media (max-width: 767.98px) {

    /* -------------------------------------------------------------------------
       1. Seitenbasis
       Kein künstlicher horizontaler Sicherheitsabstand außerhalb der
       tatsächlichen iPhone-Safe-Area. Bestehender Overflow-Schutz bleibt aktiv.
       ------------------------------------------------------------------------- */
    html,
    body {
        width: 100% !important;
        max-width: 100% !important;
    }

    /* -------------------------------------------------------------------------
       2. Liquid-Seiten / Startseite
       Bisherige 8px Außenpolsterung auf 4px reduzieren. Auf Geräten mit echter
       seitlicher Safe Area hat die Apple-Safe-Area automatisch Vorrang.
       ------------------------------------------------------------------------- */
    html body .ak-liquid-page,
    html body.site-home .ak-no-hyphen,
    html body.site-home .ak-liquid-page,
    html body.site-home .ak-home-liquid,
    html body.site-home .ak-startseite-liquid {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-left: max(4px, env(safe-area-inset-left)) !important;
        padding-right: max(4px, env(safe-area-inset-right)) !important;
        box-sizing: border-box !important;
        transform: none !important;
        left: auto !important;
        right: auto !important;
    }

    /* -------------------------------------------------------------------------
       3. Liquid Stage
       Die Glass-Fläche darf nahezu die gesamte Displaybreite nutzen. Das
       vorhandene Innenpadding der eigentlichen Cards bleibt unangetastet.
       ------------------------------------------------------------------------- */
    html body.site-home .ak-liquid-stage,
    html body.site-home .ak-no-hyphen .ak-liquid-stage,
    html body.site-home .ak-home-liquid .ak-liquid-stage,
    html body.site-home .ak-startseite-liquid .ak-liquid-stage {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
        box-sizing: border-box !important;
    }

    /* -------------------------------------------------------------------------
       4. Slogan-Liquid
       Separate ältere 12px-Regel an die neue Flächenlogik angleichen.
       ------------------------------------------------------------------------- */
    html body .ak-slogan-liquid .ak-liquid-stage {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    /* -------------------------------------------------------------------------
       5. Header / Navigation
       Kritischer V3-Punkt: width: calc(100% - 40px) plus 20px Innenpadding
       erzeugte auf iPhones unnötig viel horizontale Reserve. Jetzt volle
       Breite mit kompakter, Safe-Area-fähiger Innenkante.
       ------------------------------------------------------------------------- */
    html body #header .navbar-inverse > .container-fluid,
    html body #header .navbar-inverse > .container-limited,
    html body #header .nav-area-lines > .container-fluid,
    html body #header .nav-area-lines > .container-limited,
    html body #header nav > .container-fluid,
    html body #header nav > .container-limited {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-left: max(12px, env(safe-area-inset-left)) !important;
        padding-right: max(12px, env(safe-area-inset-right)) !important;
        box-sizing: border-box !important;
    }

    /* Logozeile an dieselbe Safe-Area-Logik anbinden. */
    html body #header #logo-primary-box {
        width: 100% !important;
        padding-left: max(12px, env(safe-area-inset-left)) !important;
        padding-right: max(12px, env(safe-area-inset-right)) !important;
        box-sizing: border-box !important;
    }

    /* -------------------------------------------------------------------------
       6. Klassische Startseiten-Inhaltsbereiche
       Bestehende 20px-Mobile-Reserve moderat reduzieren, ohne Text oder
       Bedienelemente direkt an die Displaykante zu setzen.
       ------------------------------------------------------------------------- */
    html body.site-home .parallax-content-content {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: max(12px, env(safe-area-inset-left)) !important;
        padding-right: max(12px, env(safe-area-inset-right)) !important;
        box-sizing: border-box !important;
    }
}

/* -----------------------------------------------------------------------------
   Landscape-iPhone
   In Querformat können Notch / Dynamic-Island-Safe-Areas seitlich relevant
   werden. Hier niemals unter die von Safari gemeldete Safe Area gehen.
   ----------------------------------------------------------------------------- */
@media (max-width: 932px) and (orientation: landscape) {
    html body .ak-liquid-page,
    html body.site-home .ak-no-hyphen,
    html body.site-home .ak-liquid-page,
    html body.site-home .ak-home-liquid,
    html body.site-home .ak-startseite-liquid,
    html body #header .navbar-inverse > .container-fluid,
    html body #header .navbar-inverse > .container-limited,
    html body #header .nav-area-lines > .container-fluid,
    html body #header .nav-area-lines > .container-limited,
    html body #header nav > .container-fluid,
    html body #header nav > .container-limited {
        padding-left: max(12px, env(safe-area-inset-left)) !important;
        padding-right: max(12px, env(safe-area-inset-right)) !important;
    }
}

/* ======================== ENDE V3.1 LTS EDGE-TO-EDGE ======================== */


/* ==========================================================================
   V3.1.1 LTS - 15.09.26 - iPhone Portrait Header Compact
   Kleiner Zusatz-Fix: kompaktere vertikale Header-Abstaende.
   Geltungsbereich: iOS-WebKit, Hochformat, maximal 767.98 CSS-Pixel.
   Die Feature-Abfrage ist eine iOS-WebKit-Eingrenzung, keine Modellkennung.
   Rollback: Diesen gesamten V3.1.1-Block bis zur ENDE-Markierung entfernen.
   Dadurch gelten wieder unveraendert die bisherigen V3.1-Werte.
   ========================================================================== */
@supports (-webkit-touch-callout: none) {
    @media screen and (max-width: 767.98px) and (orientation: portrait) {
        #header,
        #header-container {
            height: 145px !important;
            min-height: 145px !important;
        }

        #header nav > .container-fluid,
        #header nav > .container-limited {
            min-height: 145px !important;
        }

        #header .navbar-left {
            top: 68px !important;
        }

        #header #optional-header-icons {
            top: 101px !important;
        }
    }
}
/* ================= ENDE V3.1.1 LTS PORTRAIT HEADER COMPACT ================= */


/* ==========================================================================
   V3.1.2 LTS - 15.09.26 - iPhone Portrait Header Position Fix
   Behebt den zusaetzlichen Versatz durch position: relative im Basis-Theme.
   top: 101px aus V3.1.1 bezieht sich damit auf den Header-Container.
   Geltungsbereich: iOS-WebKit, Hochformat, maximal 767.98 CSS-Pixel.
   Alle Hoehen, Menuefunktionen und sonstigen Regeln bleiben unveraendert.
   Rollback: Nur diesen V3.1.2-Block bis zur ENDE-Markierung entfernen,
   um den Zustand V3.1.1 wiederherzustellen.
   ========================================================================== */
@supports (-webkit-touch-callout: none) {
    @media screen and (max-width: 767.98px) and (orientation: portrait) {
        #header #optional-header-icons {
            position: absolute !important;
        }
    }
}
/* ================= ENDE V3.1.2 LTS PORTRAIT HEADER POSITION FIX ============= */


/* ==========================================================================
   V3.1.3 LTS - 15.09.26 - iPhone Portrait Content Gap Compact
   Startseitenblock: oberen Aussenabstand von 56px auf 16px reduzieren.
   Der gesamte Inhaltsblock rueckt dadurch um 40 CSS-Pixel nach oben.
   Nur Startseite, iOS-WebKit, Hochformat bis 767.98 CSS-Pixel.
   Rollback: Diesen gesamten V3.1.3-Block bis zur ENDE-Markierung entfernen.
   ========================================================================== */
@supports (-webkit-touch-callout: none) {
    @media screen and (max-width: 767.98px) and (orientation: portrait) {
        html body.site-home #site-content .ak-no-hyphen.ak-startseite-liquid {
            margin-top: 16px !important;
        }
    }
}
/* ================= ENDE V3.1.3 LTS PORTRAIT CONTENT GAP COMPACT ============ */


/* ==========================================================================
   V3.1.4 LTS - 15.09.26 - iPhone Portrait CMS Content Spacing
   Oberen Abstand am Startseitenblock und seinem CMS-Modul festlegen.
   Die Blockregel benoetigt keine bestimmte ID eines uebergeordneten Elements.
   Das CMS-Modul wird ausschliesslich ueber den enthaltenen Startseitenblock
   ausgewaehlt. Header und Menueposition werden nicht veraendert.
   Nur iOS-WebKit, Hochformat bis 767.98 CSS-Pixel.
   Rollback: Diesen gesamten V3.1.4-Block bis zur ENDE-Markierung entfernen.
   ========================================================================== */
@supports (-webkit-touch-callout: none) {
    @media screen and (max-width: 767.98px) and (orientation: portrait) {
        html body.site-home .ak-no-hyphen.ak-liquid-page.ak-startseite-liquid {
            margin-top: 16px !important;
        }

        html body.site-home .module-block.fe-content:has(.ak-startseite-liquid) {
            margin-top: 12px !important;
        }
    }
}
/* ================= ENDE V3.1.4 LTS PORTRAIT CMS CONTENT SPACING ============ */


/* EINHEITLICHE INHALTSUEBERSCHRIFTEN H1–H5 – 07.10.2026
   Nur #site-content. Farben, Glasflächen, Navigation und Footer bleiben
   durch diesen Block unberührt. Desktop / Tablet / Mobil:
   H1 30/26/24, H2 26/23/21, H3 22/20/19, H4 21/19/18, H5 18/17/16 px.
   Rücknahme: Original-Sicherung wiederherstellen. */
html body#page_body #wrapper #site-content :is(h1, .headline-h1, .h1, .entry-title, .page-title, .ak-page-title) {
 font-family: "Poppins", Arial, sans-serif !important;
 font-size: 30px !important;
 font-weight:700 !important;
 font-style:normal !important;
 line-height:1.20 !important;
 letter-spacing:0 !important;
}
html body#page_body #wrapper #site-content :is(h2, .headline-h2, .h2) {
 font-family: "Poppins", Arial, sans-serif !important;
 font-size: 26px !important;
 font-weight:700 !important;
 font-style:normal !important;
 line-height:1.22 !important;
 letter-spacing:0 !important;
}
html body#page_body #wrapper #site-content :is(h3, .headline-h3, .h3) {
 font-family: "Poppins", Arial, sans-serif !important;
 font-size: 22px !important;
 font-weight:700 !important;
 font-style:normal !important;
 line-height:1.28 !important;
 letter-spacing:0 !important;
}
html body#page_body #wrapper #site-content :is(h4, .headline-h4, .h4) {
 font-family: "Poppins", Arial, sans-serif !important;
 font-size: 21px !important;
 font-weight:700 !important;
 font-style:normal !important;
 line-height:1.30 !important;
 letter-spacing:0 !important;
}
html body#page_body #wrapper #site-content :is(h5, .headline-h5, .h5) {
 font-family: "Poppins", Arial, sans-serif !important;
 font-size: 18px !important;
 font-weight:700 !important;
 font-style:normal !important;
 line-height:1.35 !important;
 letter-spacing:0 !important;
}
@media (min-width:601px) and (max-width:900px) {
html body#page_body #wrapper #site-content :is(h1, .headline-h1, .h1, .entry-title, .page-title, .ak-page-title) {font-size:26px !important;}
html body#page_body #wrapper #site-content :is(h2, .headline-h2, .h2) {font-size:23px !important;}
html body#page_body #wrapper #site-content :is(h3, .headline-h3, .h3) {font-size:20px !important;}
html body#page_body #wrapper #site-content :is(h4, .headline-h4, .h4) {font-size:19px !important;}
html body#page_body #wrapper #site-content :is(h5, .headline-h5, .h5) {font-size:17px !important;}
}
@media (max-width:600px) {
html body#page_body #wrapper #site-content :is(h1, .headline-h1, .h1, .entry-title, .page-title, .ak-page-title) {font-size:24px !important;}
html body#page_body #wrapper #site-content :is(h2, .headline-h2, .h2) {font-size:21px !important;}
html body#page_body #wrapper #site-content :is(h3, .headline-h3, .h3) {font-size:19px !important;}
html body#page_body #wrapper #site-content :is(h4, .headline-h4, .h4) {font-size:18px !important;}
html body#page_body #wrapper #site-content :is(h5, .headline-h5, .h5) {font-size:16px !important;}
}
html body#page_body #wrapper #site-content :is(h1, .headline-h1, .h1, .entry-title, .page-title, .ak-page-title) :where(span,strong,em,b,a):not(:where(.fa,.fas,.far,.fab,[class*="icon"])),
html body#page_body #wrapper #site-content :is(h2, .headline-h2, .h2) :where(span,strong,em,b,a):not(:where(.fa,.fas,.far,.fab,[class*="icon"])),
html body#page_body #wrapper #site-content :is(h3, .headline-h3, .h3) :where(span,strong,em,b,a):not(:where(.fa,.fas,.far,.fab,[class*="icon"])),
html body#page_body #wrapper #site-content :is(h4, .headline-h4, .h4) :where(span,strong,em,b,a):not(:where(.fa,.fas,.far,.fab,[class*="icon"])),
html body#page_body #wrapper #site-content :is(h5, .headline-h5, .h5) :where(span,strong,em,b,a):not(:where(.fa,.fas,.far,.fab,[class*="icon"])) {
 font-family:inherit !important; font-size:inherit !important; font-weight:inherit !important; font-style:inherit !important; line-height:inherit !important; letter-spacing:inherit !important;
}
/* ENDE EINHEITLICHE INHALTSUEBERSCHRIFTEN */


/* ==========================================================================
   V3.2.1 LTS - 17.09.26 - Ganze Woerter / responsive Vorteilskacheln
   Ueberschriften: Umbruch an Leerzeichen, keine Trennung im Wort.
   Wunschfahrzeug (pageid-535): Die vier kleinen Vorteilskacheln sind im
   HTML zweispaltig festgelegt. Auto-fit gibt jeder Kachel mindestens 160px,
   soweit verfuegbar; bei Platzmangel wechselt die Gruppe auf eine Spalte.
   Betrifft weder Header/Menue noch die vier Startseitenmodule.
   Rollback: Diesen gesamten V3.2.1-Block entfernen.
   ========================================================================== */
html body#page_body #wrapper :is(h1, h2, h3, .headline-h1, .headline-h2, .headline-h3, .h1, .h2, .h3, .entry-title, .page-title, .ak-page-title, .ak-liquid-title):not(:where(#header *, #header-container *, #footer *, #page_sidebar *, #cookie-consent-modal *)),
html body#page_body #wrapper :is(h1, h2, h3, .headline-h1, .headline-h2, .headline-h3, .ak-liquid-title):not(:where(#header *, #header-container *, #footer *, #page_sidebar *, #cookie-consent-modal *)) :where(span, strong, em, b, a) {
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    word-wrap: normal !important;
    -webkit-hyphens: none !important;
    hyphens: none !important;
    max-inline-size: 100% !important;
}

/* Nur die Vorteilskacheln mit direkt aufeinanderfolgendem Titel und Text. */
html body#page_body.pageid-535 .ak-glass-dark > div[style*="grid-template-columns"]:has(> div > strong + span) {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 160px), 1fr)) !important;
}

html body#page_body.pageid-535 .ak-glass-dark > div[style*="grid-template-columns"]:has(> div > strong + span) > div > :is(strong, span) {
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    word-wrap: normal !important;
    -webkit-hyphens: none !important;
    hyphens: none !important;
}
/* ================= ENDE V3.2.1 LTS GANZE WOERTER ========================== */


/* ==========================================================================
   V3.2.2 LTS - 17.09.26 - Responsives Raster fuer Kundenbewertungen
   Nur die beiden Bewertungsgruppen aus Startseite Modul 1:
   Antwortzeit / Freundlichkeit / Beratung (urspruenglich max-width: 880px)
   und Anzahl / Weiterempfehlung / Fahrzeugbeschreibung (920px).
   Die gezielte Regel ueberstimmt die alten globalen Einspalten-Regeln.
   Ab 601px: automatisch 1, 2 oder 3 Spalten nach verfuegbarer Inhaltsbreite.
   Maximal 920px und mindestens 220px je Spalte verhindern vier Spalten.
   Bis 600px: weiterhin eine Spalte. Gesamtnote 4,9 bleibt darueber.
   Keine Aenderung von Texten, Bewertungen, Schriftgroessen oder Header.
   Rollback: Diesen gesamten V3.2.2-Block entfernen.
   Hinweis: Die Selektoren beziehen sich auf die vorhandenen Inline-Raster
   in Modul 1. Bei einem spaeteren HTML-Umbau muessen sie angepasst werden.
   ========================================================================== */
html body#page_body.site-home .ak-startseite-liquid div[style*="grid-template-columns"]:is([style*="880px"], [style*="920px"]) {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)) !important;
    grid-template-rows: none !important;
    grid-auto-rows: auto !important;
    width: 100% !important;
    max-width: 920px !important;
    min-width: 0 !important;
    gap: 18px !important;
    justify-items: stretch !important;
    align-items: stretch !important;
    box-sizing: border-box !important;
}

html body#page_body.site-home .ak-startseite-liquid div[style*="grid-template-columns"]:is([style*="880px"], [style*="920px"]) > div {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

@media (max-width: 600px) {
    html body#page_body.site-home .ak-startseite-liquid div[style*="grid-template-columns"]:is([style*="880px"], [style*="920px"]) {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}
/* ================= ENDE V3.2.2 LTS KUNDENBEWERTUNGEN ======================= */


/* ==========================================================================
   V3.2.3 LTS - 17.09.26 - Markencenterschild vollstaendig anzeigen
   Nur das Schildfoto am Anfang der Startseite.
   Bisher: flacher Rahmen (16 / 7), absolut positioniertes Bild, cover.
   Jetzt: volle bisherige Breite, natuerliche Bildhoehe ohne Beschnitt.
   Der Rahmen waechst mit dem Bild; Rundung und Gestaltung bleiben erhalten.
   Rollback: Diesen gesamten V3.2.3-Block entfernen.
   ========================================================================== */
html body#page_body.site-home .ak-startseite-liquid div:has(> img[src*="/geschichte-bild-01-luftaufnahme-gelaende.jpg"]) {
    aspect-ratio: auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
}

html body#page_body.site-home .ak-startseite-liquid img[src*="/geschichte-bild-01-luftaufnahme-gelaende.jpg"] {
    position: relative !important;
    inset: auto !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
}
/* ================= ENDE V3.2.3 LTS MARKENCENTERSCHILD ====================== */
/* Leere / nicht verfügbare Medien in der Fahrzeuggalerie ausblenden */
.showroom .Detail .aw-vehicle-thumbs-container > div[aria-hidden="true"] {
    display: none;
}
/* SERVICEBILDER LEISTUNGEN – ANFANG
   Erst zusammen mit dem neuen Bildpaket einsetzen.
   Entfernt die bisherige Vergroesserung auf 120–160 Prozent.
   Gilt nur fuer die sechs benannten Bildordner im Hauptinhalt.
   Texte, Logos und Fahrzeuggalerien bleiben erhalten.
   Sechs Terminbild-Rahmen werden unten auf 16:9 angepasst. */
html body #site-content img:is(
  [src*="/peugeot_wartung_bilder_1600x900/"],
  [src*="/bosch_service_bilder_1600x900_final/"],
  [src*="/hu_au_bilder_fotorealistisch_1600x900/"],
  [src*="/reifeneinlagerung_bilder_fotorealistisch_1600x900/"],
  [src*="/klimaanlagen_service_bilder_fotorealistisch_1600x900/"],
  [src*="/reifenservice_bilder_fotorealistisch_1600x900/"]
) {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  object-fit: cover !important;
  object-position: center center !important;
}
/* Die sechs Terminbilder erhalten einen proportionalen Rahmen.
   Die bisherige feste Mindesthoehe von 250px beschnitt bei breiten
   einspaltigen Ansichten Gesichter und Fahrzeuge stark. */
html body #site-content div:has(> img:is(
  [src*="/peugeot_wartung_bilder_1600x900/"],
  [src*="/bosch_service_bilder_1600x900_final/"],
  [src*="/hu_au_bilder_fotorealistisch_1600x900/"],
  [src*="/reifeneinlagerung_bilder_fotorealistisch_1600x900/"],
  [src*="/klimaanlagen_service_bilder_fotorealistisch_1600x900/"],
  [src*="/reifenservice_bilder_fotorealistisch_1600x900/"]
)[src*="-cta-"]) {
  aspect-ratio: 16 / 9;
  min-height: 0 !important;
  align-self: start;
}
/* SERVICEBILDER LEISTUNGEN – ENDE */
/* WERKSTATTPREISE - nur fuer den neuen HTML-Block */

#akw-preise {
  --ink: #103e49;
  --teal: #075b67;
  --muted: #48636b;
  --line: #d5e4e7;
  --mint: #c8f1e8;

  max-width: 1280px;
  margin: 0 auto;
  color: var(--ink);
  font-family: 'Poppins', Arial, sans-serif;
  font-size: 16px;
  line-height: 1.7;
  background: #f5f9fa;
  border: 1px solid #fff;
  border-radius: 28px;
  overflow: hidden;
  box-shadow: 0 24px 64px #173f4d18;
}

#akw-preise,
#akw-preise * {
  box-sizing: border-box;
  min-width: 0;
}

#akw-preise h1,
#akw-preise h2,
#akw-preise h3,
#akw-preise p {
  margin: 0;
  color: inherit;
}

#akw-preise h1 {
  font-size: clamp(32px, 4.2vw, 54px);
  line-height: 1.12;
  letter-spacing: -.035em;
  font-weight: 800;
}

#akw-preise h2 {
  font-size: clamp(26px, 3vw, 38px);
  line-height: 1.2;
  letter-spacing: -.025em;
  font-weight: 750;
}

#akw-preise h3 {
  font-size: 21px;
  line-height: 1.35;
  font-weight: 700;
}

#akw-preise p {
  margin-top: 14px;
}

#akw-preise a {
  color: var(--teal);
  text-underline-offset: 4px;
}

#akw-preise a:focus-visible,
#akw-preise summary:focus-visible {
  outline: 3px solid #dca644;
  outline-offset: 5px;
}

#akw-preise .akw-eyebrow {
  display: block;
  margin-bottom: 16px;
  font-size: 12px;
  letter-spacing: .13em;
  font-weight: 750;
  text-transform: uppercase;
}

/* Einstieg mit grossem Bild */

#akw-preise .akw-hero {
  display: grid;
  grid-template-columns: 1.05fr 1fr;
  background: linear-gradient(140deg, #073c48, #106876);
  color: #fff;
}

#akw-preise .akw-hero-copy {
  padding: clamp(26px, 4vw, 56px);
  align-self: center;
}

#akw-preise .akw-hero p {
  color: #e0f1f3;
  max-width: 48ch;
}

#akw-preise .akw-photo {
  margin: 0;
  position: relative;
}

/* Bewusst hohe Prioritaet gegen bisherige Bildvergroesserungen */

#akw-preise#akw-preise img {
  position: static !important;
  inset: auto !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  object-fit: cover !important;
  transform: none !important;
}

#akw-preise#akw-preise .akw-hero .akw-photo img {
  height: 100% !important;
  min-height: 440px !important;
  object-position: 62% center !important;
}

#akw-preise .akw-photo figcaption {
  position: absolute;
  bottom: 18px;
  left: 18px;
  right: 18px;
  padding: 12px 16px;
  border: 1px solid #ffffff80;
  border-radius: 12px;
  background: #073c48e8;
  color: #fff;
  font-size: 14px;
}

/* Kontaktbuttons */

#akw-preise .akw-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 26px;
}

#akw-preise .akw-btn {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 50px;
  padding: 12px 20px;
  border: 1px solid var(--teal);
  border-radius: 10px;
  background: var(--teal);
  color: #fff !important;
  -webkit-text-fill-color: #fff;
  text-decoration: none !important;
  text-align: center;
  font-weight: 700;
  line-height: 1.4;
}

#akw-preise .akw-btn:hover {
  filter: brightness(1.08);
}

#akw-preise .akw-btn-light {
  background: var(--mint);
  border-color: var(--mint);
  color: #103e49 !important;
  -webkit-text-fill-color: #103e49;
}

#akw-preise .akw-btn-outline {
  background: transparent;
  border-color: #ffffff80;
}

/* Orientierung und Inhaltsbereiche */

#akw-preise .akw-trust {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 14px 24px;
  padding: 22px clamp(24px, 4vw, 52px);
  background: #e7f2f2;
  border-bottom: 1px solid var(--line);
  font-size: 14px;
  font-weight: 650;
}

#akw-preise .akw-trust span::before {
  content: "\2713";
  margin-right: 9px;
  color: var(--teal);
}

#akw-preise .akw-section {
  padding: clamp(28px, 4vw, 52px);
  scroll-margin-top: 120px;
}

#akw-preise .akw-heading {
  max-width: 760px;
  margin-bottom: 26px;
}

#akw-preise .akw-heading p,
#akw-preise .akw-muted {
  color: var(--muted);
}

#akw-preise .akw-jumps {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 24px;
}

#akw-preise .akw-jumps a {
  background: #fff;
  padding: 8px 16px;
  border: 1px solid var(--line);
  border-radius: 30px;
  text-decoration: none;
  font-weight: 650;
}

/* Preiskarten */

#akw-preise .akw-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

#akw-preise .akw-card {
  padding: 26px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
}

#akw-preise .akw-number {
  display: block;
  color: var(--teal);
  font-size: 13px;
  font-weight: 750;
  letter-spacing: .08em;
  margin-bottom: 14px;
}

#akw-preise .akw-price {
  margin: 18px 0 12px;
  font-size: 42px;
  line-height: 1.15;
  font-weight: 800;
  letter-spacing: -.03em;
}

#akw-preise .akw-price small {
  font-size: 16px;
  letter-spacing: 0;
  font-weight: 500;
}

#akw-preise dl {
  margin: 20px 0;
}

#akw-preise .akw-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 14px;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}

#akw-preise dt {
  font-weight: 500;
}

#akw-preise dd {
  margin: 0;
  white-space: nowrap;
  font-weight: 700;
}

#akw-preise .akw-note {
  margin-top: 22px;
  padding: 18px 22px;
  border-left: 3px solid var(--teal);
  background: #e9f2f3;
  color: var(--muted);
  font-size: 14px;
}

#akw-preise .akw-two {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

#akw-preise .akw-band {
  background: #fff;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

/* Beratung und Ablauf */

#akw-preise .akw-editorial {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 36px;
}

#akw-preise .akw-editorial .akw-photo {
  border-radius: 18px;
  overflow: hidden;
}

#akw-preise .akw-editorial img {
  aspect-ratio: 4 / 3;
}

#akw-preise .akw-steps {
  list-style: none;
  padding: 0;
  margin: 24px 0 0;
  counter-reset: akw-step;
}

#akw-preise .akw-steps li {
  position: relative;
  padding: 0 0 22px 48px;
  counter-increment: akw-step;
}

#akw-preise .akw-steps li::before {
  content: counter(akw-step);
  position: absolute;
  left: 0;
  top: 0;
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #dbefeb;
  color: var(--teal);
  font-weight: 750;
}

#akw-preise .akw-steps strong {
  display: block;
}

/* Fragen und Ratgeber */

#akw-preise details {
  border-bottom: 1px solid var(--line);
  padding: 17px 0;
}

#akw-preise summary {
  cursor: pointer;
  font-size: 17px;
  font-weight: 700;
}

#akw-preise details p {
  color: var(--muted);
  padding-bottom: 8px;
}

/* Abschluss mit Kontakt */

#akw-preise .akw-contact {
  background: linear-gradient(130deg, #073c48, #106876);
  color: #fff;
}

#akw-preise .akw-contact p {
  max-width: 740px;
  color: #e0f1f3;
}

#akw-preise .akw-contact .akw-small {
  font-size: 14px;
}

/* Tablet */

@media (max-width: 960px) {
  #akw-preise .akw-hero,
  #akw-preise .akw-editorial {
    grid-template-columns: 1fr;
  }

  #akw-preise#akw-preise .akw-hero .akw-photo img {
    min-height: 0 !important;
    height: auto !important;
    aspect-ratio: 16 / 9;
    object-position: center !important;
  }

  #akw-preise .akw-grid {
    grid-template-columns: 1fr;
  }

  #akw-preise .akw-price {
    font-size: 36px;
  }
}

/* Smartphone */

@media (max-width: 620px) {
  #akw-preise {
    border-radius: 18px;
    font-size: 15px;
  }

  #akw-preise .akw-two {
    grid-template-columns: 1fr;
  }

  #akw-preise .akw-section,
  #akw-preise .akw-hero-copy {
    padding: 26px 20px;
  }

  #akw-preise .akw-card {
    padding: 22px;
  }

  #akw-preise .akw-actions {
    flex-direction: column;
  }

  #akw-preise .akw-btn {
    width: 100%;
  }

  #akw-preise .akw-photo figcaption {
    position: static;
    border: 0;
    border-radius: 0;
  }

  #akw-preise .akw-trust {
    display: grid;
    gap: 10px;
    padding: 20px;
  }
}

/* WERKSTATTPREISE - ENDE */
/* WERKSTATTPREISE - CMS-KORREKTUR */





#akw-preise#akw-preise .akw-hero h1,
#akw-preise#akw-preise .akw-contact h2 {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  opacity: 1 !important;
}

#akw-preise .akw-pricelist {
  margin: 20px 0;
}

#akw-preise .akw-label {
  font-weight: 500;
}

#akw-preise .akw-value {
  margin: 0;
  white-space: nowrap;
  font-weight: 700;
}

/* ENDE CMS-KORREKTUR */
/* WERKSTATTTERMIN - nur fuer den neuen HTML-Block #akt-termin */
#akt-termin { --ink:#103e49; --teal:#075b67; --muted:#48636b; --line:#d5e4e7; --mint:#c8f1e8; max-width:1280px; margin:0 auto; color:var(--ink); font-family:'Poppins',Arial,sans-serif; font-size:16px; line-height:1.7; background:#f5f9fa; border:1px solid #fff; border-radius:28px; overflow:hidden; box-shadow:0 24px 64px #173f4d18; }
#akt-termin, #akt-termin * { box-sizing:border-box; min-width:0; }
#akt-termin h1, #akt-termin h2, #akt-termin h3, #akt-termin p { margin:0; color:inherit; }
#akt-termin h1 { font-size:clamp(32px,4.2vw,54px); line-height:1.12; letter-spacing:-.035em; font-weight:800; }
#akt-termin h2 { font-size:clamp(26px,3vw,38px); line-height:1.2; letter-spacing:-.025em; font-weight:750; }
#akt-termin h3 { font-size:21px; line-height:1.35; font-weight:700; }
#akt-termin p { margin-top:14px; }
#akt-termin a { color:var(--teal); text-underline-offset:4px; }
#akt-termin a:focus-visible, #akt-termin summary:focus-visible { outline:3px solid #dca644; outline-offset:5px; }
#akt-termin .akt-eyebrow { display:block; margin-bottom:16px; font-size:12px; letter-spacing:.13em; font-weight:750; text-transform:uppercase; }
#akt-termin .akt-hero { display:grid; grid-template-columns:1.05fr 1fr; background:linear-gradient(140deg,#073c48,#106876); color:#fff; }
#akt-termin .akt-hero-copy { padding:clamp(26px,4vw,56px); align-self:center; }
#akt-termin .akt-hero p { color:#e0f1f3; max-width:48ch; }
#akt-termin .akt-photo { margin:0; position:relative; }
#akt-termin#akt-termin img { position:static!important; inset:auto!important; display:block!important; width:100%!important; height:auto!important; min-width:0!important; max-width:100%!important; min-height:0!important; max-height:none!important; margin:0!important; padding:0!important; border:0!important; object-fit:cover!important; transform:none!important; }
#akt-termin#akt-termin .akt-hero .akt-photo img { height:100%!important; min-height:440px!important; object-position:62% center!important; }
#akt-termin .akt-photo figcaption { position:absolute; bottom:18px; left:18px; right:18px; padding:12px 16px; border:1px solid #ffffff80; border-radius:12px; background:#073c48e8; color:#fff; font-size:14px; }
#akt-termin .akt-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:26px; }
#akt-termin .akt-btn { display:inline-flex; justify-content:center; align-items:center; min-height:50px; padding:12px 20px; border:1px solid var(--teal); border-radius:10px; background:var(--teal); color:#fff!important; -webkit-text-fill-color:#fff; text-decoration:none!important; text-align:center; font-weight:700; line-height:1.4; }
#akt-termin .akt-btn:hover { filter:brightness(1.08); }
#akt-termin .akt-btn-light { background:var(--mint); border-color:var(--mint); color:#103e49!important; -webkit-text-fill-color:#103e49; }
#akt-termin .akt-btn-outline { background:transparent; border-color:#ffffff80; }
#akt-termin .akt-trust { display:flex; flex-wrap:wrap; justify-content:space-between; gap:14px 24px; padding:22px clamp(24px,4vw,52px); background:#e7f2f2; border-bottom:1px solid var(--line); font-size:14px; font-weight:650; }
#akt-termin .akt-trust span::before { content:'\2713'; margin-right:9px; color:var(--teal); }
#akt-termin .akt-section { padding:clamp(28px,4vw,52px); scroll-margin-top:120px; }
#akt-termin .akt-heading { max-width:760px; margin-bottom:26px; }
#akt-termin .akt-heading p, #akt-termin .akt-muted { color:var(--muted); }
#akt-termin .akt-jumps { display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }
#akt-termin .akt-jumps a { background:#fff; padding:8px 16px; border:1px solid var(--line); border-radius:30px; text-decoration:none; font-weight:650; }
#akt-termin .akt-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
#akt-termin .akt-card { padding:26px; border:1px solid var(--line); border-radius:18px; background:#fff; }
#akt-termin .akt-number { display:block; color:var(--teal); font-size:13px; font-weight:750; letter-spacing:.08em; margin-bottom:14px; }
#akt-termin .akt-note { margin-top:22px; padding:18px 22px; border-left:3px solid var(--teal); background:#e9f2f3; color:var(--muted); font-size:14px; }
#akt-termin .akt-two { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
#akt-termin .akt-band { background:#fff; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
#akt-termin .akt-editorial { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:36px; }
#akt-termin .akt-editorial .akt-photo { border-radius:18px; overflow:hidden; }
#akt-termin .akt-editorial img { aspect-ratio:4/3; }
#akt-termin .akt-steps { list-style:none; padding:0; margin:24px 0 0; counter-reset:akt-step; }
#akt-termin .akt-steps li { position:relative; padding:0 0 22px 48px; counter-increment:akt-step; }
#akt-termin .akt-steps li::before { content:counter(akt-step); position:absolute; left:0; top:0; width:32px; height:32px; display:grid; place-items:center; border-radius:50%; background:#dbefeb; color:var(--teal); font-weight:750; }
#akt-termin .akt-steps strong { display:block; }
#akt-termin details { border-bottom:1px solid var(--line); padding:17px 0; }
#akt-termin summary { cursor:pointer; font-size:17px; font-weight:700; }
#akt-termin details p { color:var(--muted); padding-bottom:8px; }
#akt-termin .akt-contact { background:linear-gradient(130deg,#073c48,#106876); color:#fff; }
#akt-termin .akt-contact p { max-width:740px; color:#e0f1f3; }
#akt-termin .akt-contact .akt-small { font-size:14px; }
@media(max-width:960px) {
  #akt-termin .akt-hero, #akt-termin .akt-editorial { grid-template-columns:1fr; }
  #akt-termin#akt-termin .akt-hero .akt-photo img { min-height:0!important; height:auto!important; aspect-ratio:16/9; object-position:center!important; }
  #akt-termin .akt-grid { grid-template-columns:1fr; }
}
@media(max-width:620px) {
  #akt-termin { border-radius:18px; font-size:15px; }
  #akt-termin .akt-two { grid-template-columns:1fr; }
  #akt-termin .akt-section, #akt-termin .akt-hero-copy { padding:26px 20px; }
  #akt-termin .akt-card { padding:22px; }
  #akt-termin .akt-actions { flex-direction:column; }
  #akt-termin .akt-btn { width:100%; }
  #akt-termin .akt-photo figcaption { position:static; border:0; border-radius:0; }
  #akt-termin .akt-trust { display:grid; gap:10px; padding:20px; }
}
/* CMS compatibility and page-specific layout */



#akt-termin#akt-termin .akt-hero h1,#akt-termin#akt-termin .akt-contact h2 {color:#fff!important;-webkit-text-fill-color:#fff!important;}
#akt-termin#akt-termin p {font-size:16px!important;line-height:1.75!important;}
#akt-termin {width:100%;overflow-wrap:anywhere;}
#akt-termin .akt-services {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;}
#akt-termin .akt-service {border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#fff;}
#akt-termin .akt-service-copy {padding:24px;}
#akt-termin#akt-termin .akt-service img {aspect-ratio:16/9!important;object-position:center!important;}
#akt-termin .akt-service a {display:inline-block;margin-top:18px;font-weight:700;}
#akt-termin .akt-check {padding:16px 0;border-bottom:1px solid var(--line);}
#akt-termin .akt-check strong {display:block;color:var(--ink);}
#akt-termin .akt-check span {display:block;color:var(--muted);font-size:15px;}
#akt-termin .akt-number {font-size:28px;letter-spacing:-.04em;}
#akt-termin .akt-contact .akt-editorial {grid-template-columns:1.2fr 1fr;}
#akt-termin#akt-termin .akt-contact .akt-photo img {aspect-ratio:4/3!important;}
#akt-termin .akt-small {font-size:14px;display:block;margin-top:18px;}
#akt-termin#akt-termin a.akt-btn {white-space:normal!important;}
@media(max-width:960px) {#akt-termin .akt-contact .akt-editorial {grid-template-columns:1fr;}}
@media(max-width:620px) {#akt-termin .akt-services {grid-template-columns:1fr;}#akt-termin .akt-service-copy {padding:22px;}#akt-termin#akt-termin p {font-size:15px!important;}}
/* ENDE WERKSTATTTERMIN */
/* NACH-OBEN-BUTTON – SICHTBARKEIT */

html body #toolbar-container #toggle-scrollup {
  position: relative !important;
  width: 48px !important;
  height: 48px !important;
  padding: 0 !important;

  background: #064f55 !important;
  background-image: none !important;
  opacity: 1 !important;

  border: 2px solid #ffffff !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3) !important;
  cursor: pointer;
}

/* Alten Symbolpfeil durch einen klaren CSS-Pfeil ersetzen */
html body #toolbar-container #toggle-scrollup > i {
  display: none !important;
}

html body #toolbar-container #toggle-scrollup::before {
  content: "" !important;
  position: absolute !important;
  display: block !important;
  width: 12px !important;
  height: 12px !important;
  top: 19px !important;
  left: 16px !important;

  background: none !important;
  border: 0 !important;
  border-top: 3px solid #ffffff !important;
  border-left: 3px solid #ffffff !important;
  transform: rotate(45deg) !important;
  opacity: 1 !important;
}

html body #toolbar-container #toggle-scrollup:hover {
  background: #103e49 !important;
}

html body #toolbar-container #toggle-scrollup:focus-visible {
  outline: 3px solid #ffcc66 !important;
  outline-offset: 3px !important;
}

/* ENDE NACH-OBEN-BUTTON */
/* Liquid Glass V2: nur Seitenanordnung, keine neue Farb- oder Glasgestaltung.
   Nach dem bestehenden Autohaus-Kamen-Master-CSS laden. */
.ak-digital-layout-v2 .ak-digital-topic-v2{min-width:0}
.ak-digital-layout-v2 [id]{scroll-margin-top:90px}
.ak-digital-layout-v2 .ak-digital-card-text{line-height:1.85;margin:0 0 16px}
.ak-digital-layout-v2 .ak-digital-card-text:last-child{margin-bottom:0}
.ak-digital-layout-v2 .ak-digital-card-title{margin:0 0 18px;line-height:1.35}
.ak-digital-layout-v2 .ak-digital-nav-v2 a{white-space:normal;text-align:center}
.ak-digital-layout-v2 .ak-digital-nav-v2 a:focus-visible{outline:2px solid currentColor;outline-offset:4px}
@media(max-width:767px){
 .ak-digital-layout-v2 .ak-digital-body-v2{padding:clamp(12px,3vw,20px)}
 .ak-digital-layout-v2 .ak-digital-hero-v2{grid-template-columns:minmax(0,1fr)!important}
 .ak-digital-layout-v2 .ak-digital-grid-2{grid-template-columns:minmax(0,1fr)!important}
 .ak-digital-layout-v2 .ak-digital-group-v2{margin-top:28px!important}
}
/* DIGITALE FAHRZEUGFUNKTIONEN – LESBARKEIT
   Ganz am Ende des vorhandenen CSS ergänzen.
   Rücknahme: ausschließlich diesen Block entfernen. */

/* Helle, deckende Leseflächen innerhalb des bestehenden Glasrahmens */
html body#page_body .ak-digitaldienste-liquid.ak-digital-layout-v2 .ak-glass-card,
html body#page_body .ak-digitaldienste-liquid.ak-digital-layout-v2 .ak-glass-kpi,
html body#page_body .ak-digitaldienste-liquid.ak-digital-layout-v2 .ak-glass-card-strong:not(.ak-digital-body-v2) {
  background: linear-gradient(135deg, #ffffff 0%, #f0f8fc 100%) !important;
  border-color: #ffffff !important;
}
html body#page_body .ak-digitaldienste-liquid.ak-digital-layout-v2 .ak-glass-card *,
html body#page_body .ak-digitaldienste-liquid.ak-digital-layout-v2 .ak-glass-kpi *,
html body#page_body .ak-digitaldienste-liquid.ak-digital-layout-v2 .ak-glass-card-strong:not(.ak-digital-body-v2) * {
  color: #123e49 !important;
  -webkit-text-fill-color: #123e49 !important;
  text-shadow: none !important;
}

/* Themenüberschriften bekommen ebenfalls eine ruhige Lesefläche */
html body#page_body .ak-digitaldienste-liquid.ak-digital-layout-v2 .ak-digital-group-v2 {
  background: #f5fbfe !important;
  padding: 18px 22px !important;
  border-radius: 22px;
}
html body#page_body .ak-digitaldienste-liquid.ak-digital-layout-v2 .ak-digital-group-v2 * {
  color: #123e49 !important;
  -webkit-text-fill-color: #123e49 !important;
}

/* Dunkle Schwerpunktkarten: durchgehend weiße Schrift,
   auch in verschachtelten Karten, Labels und Zusammenfassungen */
html body#page_body .ak-digitaldienste-liquid.ak-digital-layout-v2 .ak-glass-dark {
  background: linear-gradient(135deg, #175365 0%, #073646 100%) !important;
}
html body#page_body .ak-digitaldienste-liquid.ak-digital-layout-v2 .ak-glass-dark,
html body#page_body .ak-digitaldienste-liquid.ak-digital-layout-v2 .ak-glass-dark * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: none !important;
}

/* Helle Kontaktbuttons bleiben dunkel beschriftet */
html body#page_body .ak-digitaldienste-liquid.ak-digital-layout-v2 .ak-glass-dark a.ak-glass-button-light,
html body#page_body .ak-digitaldienste-liquid.ak-digital-layout-v2 .ak-glass-dark a.ak-glass-button-light * {
  background: #ffffff !important;
  color: #123e49 !important;
  -webkit-text-fill-color: #123e49 !important;
}
/* ENDE DIGITALE FAHRZEUGFUNKTIONEN – LESBARKEIT */

/* Explizite dunkle Import-/Petrolkarten: sichere Schriftfarbe */
html body#page_body .ak-digitaldienste-liquid .ak-iz-petrol-card,
html body#page_body .ak-digitaldienste-liquid .ak-iz-petrol-card * {
 color:#ffffff !important; -webkit-text-fill-color:#ffffff !important;
}
html body#page_body .ak-digitaldienste-liquid .ak-iz-petrol-card .ak-glass-button-light,
html body#page_body .ak-digitaldienste-liquid .ak-iz-petrol-card .ak-glass-button-light * {
 color:#123e49 !important; -webkit-text-fill-color:#123e49 !important;
}
/* Terminblock auf Desktop zentrieren */
@media (min-width: 768px) {
  html body#page_body.pageid-596 #site-content
  #section-search-switcher > .container {
    width: calc(100% - 30px) !important;
    max-width: 1280px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }
}
/* RESPONSIVE INHALTSBILDER – ANFANG
   Am Ende des Master-CSS ergänzen.
   Nur Bilder in HTML-Inhaltsmodulen; gestaltete Bildmodule ausgenommen.
   Zum Zurücksetzen diesen gesamten Block entfernen. */
html body#page_body #site-content .ge-content-type-tinymce img:not(:where(
  [src*="/logos/header_"],
  [style*="position: absolute"],
  [style*="position:absolute"],
  #akt-termin img,
  #akw-preise img,
  .ak-isuzu-katalog-img-frame img,
  .ak-slogan-icon-wrap img,
  .ak-brand-strip img,
  .brand-logos img,
  .brand-logo-row img,
  .ak-brand-logos img,
  .ak-logo-row img,
  .ak-marken-logos img,
  .ak-partner-logos img,
  .markenleiste img,
  .marken-leiste img,
  .ak-brands img,
  .ak-image-keep,
  .ak-image-keep img,
  [src*="/peugeot_wartung_bilder_1600x900/"],
  [src*="/bosch_service_bilder_1600x900_final/"],
  [src*="/hu_au_bilder_fotorealistisch_1600x900/"],
  [src*="/reifeneinlagerung_bilder_fotorealistisch_1600x900/"],
  [src*="/klimaanlagen_service_bilder_fotorealistisch_1600x900/"],
  [src*="/reifenservice_bilder_fotorealistisch_1600x900/"]
)) {
  max-width: 100% !important;
  height: auto !important;
}
/* RESPONSIVE INHALTSBILDER – ENDE */

/* STARTSEITE: Größen der vier Markenlogos gezielt wiederherstellen. */
html body#page_body #site-content .ak-startseite-liquid .ak-startseite-leistungskarten img[src*="/logos/header_"] {
  display: block !important;
  min-width: 0 !important;
  width: auto !important;
  height: auto !important;
  max-width: 19% !important;
  max-height: 46px !important;
  flex: 0 1 auto !important;
  object-fit: contain !important;
}
html body#page_body #site-content .ak-startseite-liquid .ak-startseite-leistungskarten img[src*="/logos/header_isuzu.png"] {
  max-width: 27% !important;
  max-height: 28px !important;
}
html body#page_body #site-content .ak-startseite-liquid .ak-startseite-leistungskarten img[src*="/logos/header_bosch.png"] {
  max-width: 30% !important;
  max-height: 34px !important;
}
/* AK EINZELRAHMEN UND KONTRAST - ANFANG - 09.10.2026
   Nach dem vorhandenen Petrol-Mint-CSS anhaengen.
   Ruecknahme: nur diesen markierten Block entfernen. */

html body#page_body #site-content#site-content#site-content#site-content :is(.ak-liquid-stage, .ak-no-hyphen section[style*="background-image: linear-gradient(90deg,rgba(230,248,255"]) {
  background: linear-gradient(135deg, rgba(235,249,255,.96), rgba(187,218,231,.88)) !important;
  border: 1px solid rgba(255,255,255,.85) !important;
  border-radius: 28px !important;
  padding: clamp(14px,2vw,24px) !important;
  box-shadow: 0 16px 38px rgba(27,75,95,.13), inset 0 1px 0 #ffffff !important;
}

html body#page_body #site-content#site-content#site-content#site-content :is(.ak-liquid-stage, .ak-no-hyphen section[style*="background-image: linear-gradient(90deg,rgba(230,248,255"]) > :is(.ak-glass-card-strong, div[style*="rgba(231,249,255,0.06)"], div[style*="rgba(231,249,255,0.08)"]) {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html body#page_body #site-content#site-content#site-content#site-content .ak-no-hyphen div[style*="margin: 0 0 22px"]:has(h1) {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body#page_body #site-content#site-content#site-content#site-content .ak-no-hyphen div[style*="position: absolute"][style*="pointer-events: none"][style*="inset:"]:not(:has(*)) {
  display: none !important;
}

html body#page_body #site-content#site-content#site-content#site-content .ak-no-hyphen span[style*="border-radius: 999px"][style*="background: rgba(255,255,255"],
html body#page_body #site-content#site-content#site-content#site-content .ak-liquid-pill,
html body#page_body #site-content#site-content#site-content#site-content .ak-glass-pill {
  background: #c8f1e8 !important;
  color: #103e49 !important;
  -webkit-text-fill-color: #103e49 !important;
  text-shadow: none !important;
  border: 1px solid #8bbdb3 !important;
  box-shadow: none !important;
}

html body#page_body #site-content#site-content#site-content#site-content .ak-slogan-liquid .ak-slogan-icon-wrap {
  background: #c8f1e8 !important;
  border: 1px solid #8bbdb3 !important;
  box-shadow: none !important;
}

html body#page_body #site-content#site-content#site-content#site-content .ak-slogan-liquid .ak-slogan-icon-wrap img {
  filter: brightness(0) saturate(100%) !important;
  opacity: 1 !important;
  object-fit: contain !important;
}

html body#page_body #site-content#site-content#site-content#site-content .ak-slogan-liquid .ak-slogan-icon-wrap > div[style*="position: absolute"] {
  display: none !important;
}

/* AK EINZELRAHMEN UND KONTRAST - ENDE */
/* ANFANG – Bildkarten Unfall/Karosserie und Isuzu */

/* Ab Tabletbreite: Bildkarten wieder nebeneinander */
@media (min-width: 601px) {
  html body #site-content
  div[style*="repeat(auto-fit"][style*="240px"]:has(
    img[src*="/lack_karosseriezentrum_13_einzelbilder_1600x900/"],
    img[src*="/gorans_neue_bilder/isuzu_offroad_umbauten/"]
  ) {
    grid-template-columns:
      repeat(auto-fit, minmax(min(100%, 240px), 1fr)) !important;
  }
}

/* ENDE – Bildkarten Unfall/Karosserie und Isuzu */
/* ANFANG – Probefahrt und Fahrzeugangebote zentrieren */

/* Probefahrt: Überschrift und Formular gemeinsam */
html body#page_body.pageid-18001
#site-content #section-contact-form {
  width: 100% !important;
  max-width: 1280px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

/* Fahrzeugangebote: Suche und Fahrzeugliste gemeinsam */
html body#page_body.pageid-532
#site-content > .module-block.showroom {
  width: 100% !important;
  max-width: 1280px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

/* Innere Container innerhalb dieser Breite halten */
html body#page_body.pageid-18001
#site-content #section-contact-form > .container,
html body#page_body.pageid-532
#site-content > .module-block.showroom > .container-fluid {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
}

/* ENDE – Probefahrt und Fahrzeugangebote zentrieren */
/* SLOGAN PETROL - ANFANG */
html body#page_body #site-content .ak-slogan-liquid .ak-slogan-card {
  background: linear-gradient(130deg, #073c48, #106876) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html body#page_body #site-content .ak-slogan-liquid .ak-slogan-card::before,
html body#page_body #site-content .ak-slogan-liquid .ak-slogan-card::after {
  content: none !important;
  display: none !important;
}
/* SLOGAN PETROL - ENDE */