/* ==========================================================================
   Mobile Responsive CSS for Führerscheinportal.de
   Last override file — loaded after all other stylesheets
   
   Breakpoints:
   - Tablet:          max-width: 1024px
   - Mobile:          max-width: 767px
   - Small Mobile:    max-width: 480px
   ========================================================================== */

/* ---- GLOBAL FOUNDATIONS ---- */
*, *::before, *::after {
    box-sizing: border-box !important;
}

html, body {
    overflow-x: hidden !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0;
    padding: 0;
}

img {
    max-width: 100% !important;
    height: auto !important;
}

/* Prevent iOS zoom on form focus by ensuring 16px minimum */
input, select, textarea {
    font-size: 16px !important;
}

/* ---- GLOBAL CTA BUTTON OVERFLOW FIX ---- */
a[style*="inline-flex"][style*="padding"],
a[style*="inline-block"][style*="padding"],
.elementor-button {
    max-width: 100% !important;
    box-sizing: border-box !important;
    white-space: normal !important;
    word-wrap: break-word !important;
    text-align: center !important;
}

/* ==========================================================================
   STICKY SOCIAL ELEMENTS (Telefon & WhatsApp) — Base Universal / Desktop
   ========================================================================== */
.mystickyelements-fixed {
    position: fixed !important;
    top: 50% !important;
    left: 0 !important;
    transform: translateY(-50%) !important;
    z-index: 999999 !important;
    width: auto !important;
    min-width: 50px !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
    pointer-events: auto !important;
}

.mystickyelement-lists-wrap {
    display: block !important;
    width: auto !important;
}

.mystickyelements-lists {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
}

.mystickyelements-social-icon-li {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    border-radius: 0 50px 50px 0 !important;
    width: 50px !important;
    height: 50px !important;
    overflow: hidden !important;
    box-shadow: 2px 4px 12px rgba(0, 0, 0, 0.25) !important;
    transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    cursor: pointer !important;
    position: relative !important;
}

.mystickyelements-social-icon-li:hover {
    width: 160px !important;
}

.mystickyelements-social-phone {
    background-color: #41846b !important;
}

.mystickyelements-social-phone:hover {
    background-color: #356e58 !important;
}

.mystickyelements-social-whatsapp {
    background-color: #26D367 !important;
}

.mystickyelements-social-whatsapp:hover {
    background-color: #20bd5a !important;
}

.mystickyelements-social-icon,
.mystickyelements-social-text {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 100% !important;
}

.mystickyelements-social-icon {
    width: 50px !important;
    min-width: 50px !important;
    flex-shrink: 0 !important;
}

.mystickyelements-social-icon a,
.mystickyelements-social-text a {
    color: #ffffff !important;
    text-decoration: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 100% !important;
    width: 100% !important;
}

.mystickyelements-social-icon a:hover,
.mystickyelements-social-text a:hover {
    color: #ffffff !important;
    text-decoration: none !important;
}

.mystickyelements-social-text {
    flex-shrink: 0 !important;
    white-space: nowrap !important;
}

.mystickyelements-social-text a {
    padding: 0 16px 0 6px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
}

.mystickyelements-social-icon i {
    font-size: 22px !important;
    color: #ffffff !important;
    line-height: 1 !important;
    pointer-events: none !important;
}

.mystickyelements-minimize {
    display: none !important;
}

/* ==========================================================================
   TABLET — 768px to 1024px
   ========================================================================== */
@media (min-width: 768px) and (max-width: 1024px) {

    /* -- Header -- */
    .elementor-section.elementor-section-boxed > .elementor-container {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    .elementor-column.elementor-col-33 {
        width: 50% !important;
    }

    /* -- Footer -- */
    footer .elementor-container,
    footer > div {
        flex-wrap: wrap !important;
        padding: 0 20px !important;
    }

    footer > div > div[style*="flex:1 1 250px"],
    footer > div > div[style*="flex: 1 1 250px"],
    footer > div > div[style*="flex:1 1 200px"],
    footer > div > div[style*="flex: 1 1 200px"],
    footer > div > div[style*="flex:1 1 300px"],
    footer > div > div[style*="flex: 1 1 300px"] {
        flex: 1 1 45% !important;
        min-width: 250px !important;
    }
}


/* ==========================================================================
   MOBILE — max-width: 767px
   ========================================================================== */
@media (max-width: 767px) {

    /* ---- LAYOUT COLUMNS — Force 100% full width on mobile ---- */
    .elementor-column,
    .elementor-column.elementor-col-33,
    .elementor-column.elementor-col-50,
    .elementor-column.elementor-col-25,
    .elementor-column.elementor-col-100,
    .elementor-column.elementor-top-column,
    .elementor-column.elementor-inner-column,
    .elementor-col-33,
    .elementor-col-25,
    .elementor-col-50,
    .elementor-col-100,
    .elementor-section .elementor-container > .elementor-column {
        width: 100% !important;
        max-width: 100% !important;
        flex: 1 1 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        margin-bottom: 20px !important;
    }

    .elementor-container {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .elementor-section {
        padding-left: 0 !important;
        padding-right: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }

    .elementor-widget-wrap {
        padding-left: 15px !important;
        padding-right: 15px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .elementor-widget-wrap.elementor-element-populated {
        padding: 24px 20px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* ---- CONTACT SECTION CARDS (1e36d892) ---- */
    section[data-id="1e36d892"] .elementor-container {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        padding: 0 15px !important;
        box-sizing: border-box !important;
    }

    section[data-id="1e36d892"] .elementor-column {
        width: 100% !important;
        max-width: 100% !important;
        flex: 1 1 100% !important;
        margin: 0 0 20px 0 !important;
    }

    section[data-id="1e36d892"] .elementor-element-populated {
        margin: 0 !important;
        padding: 30px 20px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* ---- KLASSEN CARDS (7df79435 & 96c92c2) ---- */
    section[data-id="7df79435"] .elementor-container,
    section[data-id="96c92c2"] .elementor-container {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        padding: 0 15px !important;
        box-sizing: border-box !important;
    }

    section[data-id="7df79435"] .elementor-column,
    section[data-id="96c92c2"] .elementor-column {
        width: 100% !important;
        max-width: 100% !important;
        flex: 1 1 100% !important;
        margin: 0 0 20px 0 !important;
    }

    section[data-id="7df79435"] .elementor-cta,
    section[data-id="96c92c2"] .elementor-cta {
        width: 100% !important;
        min-height: auto !important;
    }

    /* ---- ELEMENTOR CTA & HEADINGS FIX ---- */
    .elementor-cta {
        min-height: auto !important;
        height: auto !important;
        padding: 20px !important;
        box-sizing: border-box !important;
    }
    
    .elementor-cta__content, .elementor-cta__bg-wrapper {
        min-height: auto !important;
        height: auto !important;
    }

    .elementor-heading-title {
        white-space: normal !important;
        word-wrap: break-word !important;
        max-width: 100% !important;
    }
    
    h1.elementor-heading-title {
        font-size: 28px !important;
        line-height: 1.3 !important;
    }
    
    h2.elementor-heading-title {
        font-size: 24px !important;
        line-height: 1.3 !important;
    }

    /* ---- HEADER / NAVIGATION BAR ---- */
    section[data-id="537b5d55"],
    section[data-id="3ca03a40"],
    section[data-id="537b5d55"] > .elementor-container,
    section[data-id="537b5d55"] .elementor-column,
    section[data-id="537b5d55"] .elementor-widget-wrap {
        background-color: #ffffff !important;
        padding: 0 !important;
        margin: 0 !important;
        min-height: auto !important;
        border: none !important;
    }

    /* Header bar: Logo left, hamburger right */
    section[data-id="3ca03a40"] .elementor-container,
    .header-flex-container {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: space-between !important;
        padding: 12px 15px !important;
        background-color: #ffffff !important;
        width: 100% !important;
    }

    /* Logo column */
    .header-col-logo,
    .elementor-column[data-id="6845d6c5"] {
        width: auto !important;
        flex: 0 0 auto !important;
        display: flex !important;
        align-items: center !important;
        padding: 0 !important;
        margin-right: 0 !important;
    }

    .elementor-column[data-id="6845d6c5"] .elementor-widget-wrap {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .elementor-column[data-id="6845d6c5"] img {
        max-width: 140px !important;
        width: 140px !important;
        height: auto !important;
    }

    /* Nav column with hamburger */
    .header-col-nav,
    .elementor-column[data-id="591f31fc"] {
        width: auto !important;
        flex: 0 0 auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        padding: 0 !important;
        margin-left: 0 !important;
    }

    .elementor-column[data-id="591f31fc"] .elementor-widget-wrap {
        padding: 0 !important;
        justify-content: flex-end !important;
        display: flex !important;
    }

    /* CTA button column — hidden on mobile */
    .header-col-cta,
    .elementor-column[data-id="5c241c0"] {
        display: none !important;
    }

    /* Desktop nav hidden on mobile */
    .elementor-nav-menu--main {
        display: none !important;
    }

    /* Hamburger toggle */
    .elementor-menu-toggle {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        color: #0091d6 !important;
        background: transparent !important;
        border: none !important;
        padding: 8px !important;
        min-width: 44px !important;
        min-height: 44px !important;
        cursor: pointer !important;
    }

    .elementor-menu-toggle i {
        color: #0091d6 !important;
        font-size: 26px !important;
    }

    /* Header sticky z-index */
    section[data-id="537b5d55"] {
        position: relative !important;
        z-index: 999999 !important;
        overflow: visible !important;
    }

    section[data-id="537b5d55"] .elementor-container,
    section[data-id="537b5d55"] .elementor-column,
    section[data-id="537b5d55"] .elementor-widget-wrap,
    section[data-id="537b5d55"] .elementor-inner-section,
    section[data-id="537b5d55"] .elementor-widget,
    section[data-id="537b5d55"] .elementor-widget-container {
        position: static !important;
        overflow: visible !important;
    }

    section[data-id="3ca03a40"] {
        position: relative !important;
        z-index: 9999999 !important;
    }

    /* ---- MOBILE DROPDOWN MENU ---- */
    .elementor-nav-menu--dropdown {
        position: absolute !important;
        top: 100% !important;
        left: 0 !important;
        width: 100vw !important;
        background: #ffffff !important;
        border-top: 3px solid #0091d6 !important;
        box-shadow: 0 15px 30px rgba(0,0,0,0.15) !important;
        z-index: 999999 !important;
        padding: 0 !important;
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        max-height: 0 !important;
        height: 0 !important;
        overflow: hidden !important;
        transform: scaleY(0) !important;
        transform-origin: top !important;
        transition: transform 0.3s ease, opacity 0.3s ease !important;
    }

    .elementor-nav-menu--dropdown.mobile-menu-active {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        max-height: 85vh !important;
        height: auto !important;
        overflow-y: auto !important;
        transform: scaleY(1) !important;
    }

    .elementor-nav-menu--dropdown.mobile-menu-active > ul {
        display: block !important;
    }

    .elementor-nav-menu--dropdown .elementor-item {
        display: block !important;
        padding: 15px 25px !important;
        color: #333 !important;
        text-decoration: none !important;
        font-weight: 500 !important;
        border-bottom: 1px solid #f0f0f0 !important;
        font-size: 16px !important;
        background: transparent !important;
    }

    .elementor-nav-menu--dropdown .elementor-item:hover {
        background: #e0f2fe !important;
        color: #0091d6 !important;
    }

    /* Mobile submenu accordion */
    .sub-menu-mobile {
        display: none;
        list-style: none !important;
        padding: 0 !important;
        margin: 0 !important;
        background-color: #fafafa !important;
        border-left: 4px solid #0091d6 !important;
    }

    .sub-menu-mobile.open {
        display: block !important;
    }

    .menu-item-has-children-mobile > a {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
    }

    .menu-item-has-children-mobile > a i {
        transition: transform 0.2s ease !important;
    }

    .menu-item-has-children-mobile.submenu-open > a i {
        transform: rotate(180deg) !important;
    }

    .sub-menu-mobile .elementor-item {
        padding: 12px 35px !important;
        font-size: 15px !important;
        font-weight: 500 !important;
        color: #555555 !important;
        border-bottom: 1px solid #eeeeee !important;
    }

    /* ---- HERO SECTION (Index page) ---- */
    section.elementor-section[data-id="30e92c3c"] {
        min-height: auto !important;
        padding: 50px 0 30px !important;
    }

    section.elementor-section[data-id="30e92c3c"] .elementor-column {
        width: 100% !important;
    }

    /* Hero heading */
    .elementor-widget-heading h1.elementor-heading-title {
        font-size: 26px !important;
        line-height: 1.3 !important;
    }

    .elementor-widget-heading h4.elementor-heading-title {
        font-size: 15px !important;
    }

    /* ---- HERO BANNER (subpages) ---- */
    .hero-banner {
        padding: 50px 16px 60px !important;
    }

    /* ---- NEGATIVE MARGINS — neutralize on mobile ---- */
    .elementor-element.elementor-element-1e36d892 {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

    .elementor-element.elementor-element-2234e9c8 {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

    .elementor-element.elementor-element-31812997 > .elementor-element-populated {
        margin: 0 !important;
    }

    .elementor-element.elementor-element-c8cf5d1 > .elementor-element-populated {
        margin: 0 !important;
        padding: 20px !important;
    }

    /* ---- STATS 2x2 GRID ---- */
    section[data-id="7d8d5f5b"] .elementor-container {
        grid-template-columns: 1fr 1fr !important;
        gap: 10px !important;
    }

    section[data-id="7d8d5f5b"] .elementor-counter-number-wrapper {
        font-size: 32px !important;
    }

    section[data-id="7d8d5f5b"] .elementor-widget-counter {
        padding: 14px 10px !important;
        min-height: 90px !important;
    }

    /* ---- CTA SECTIONS ---- */
    .elementor-cta__content {
        min-height: auto !important;
        padding: 30px 20px !important;
        text-align: center !important;
    }

    .elementor-cta__title {
        font-size: 20px !important;
    }

    /* ---- ICON BOX TITLES ---- */
    .elementor-icon-box-title,
    .elementor-icon-box-title a {
        font-size: 20px !important;
    }

    /* ---- SECTION PADDINGS ---- */
    .elementor-element.elementor-element-4551887c {
        padding: 40px 0 !important;
    }

    .elementor-element.elementor-element-6b1af65d {
        padding: 40px 0 50px !important;
    }

    .elementor-element.elementor-element-6d5a4679 {
        padding: 40px 0 !important;
    }

    .elementor-element.elementor-element-357b103d {
        padding: 0 0 40px !important;
    }

    .elementor-element.elementor-element-96c92c2 {
        margin-bottom: 40px !important;
    }

    /* ---- ELEMENTOR BUTTONS ---- */
    .elementor-button,
    a.elementor-button {
        padding: 14px 20px !important;
        font-size: 15px !important;
        width: 100% !important;
        display: block !important;
        text-align: center !important;
        box-sizing: border-box !important;
    }

    /* ---- FOOTER ---- */
    footer {
        padding: 40px 15px 15px !important;
    }

    footer > .elementor-container,
    footer > div {
        flex-direction: column !important;
        padding: 0 !important;
    }

    footer > .elementor-container > div,
    footer > div > div {
        flex: 1 1 100% !important;
        width: 100% !important;
        min-width: 0 !important;
        margin-bottom: 30px !important;
        padding-right: 0 !important;
    }

    footer img {
        max-width: 160px !important;
    }

    footer div[style*="border-top"] {
        padding: 15px 0 !important;
    }

    footer div[style*="border-top"] > div,
    footer div[style*="border-top"] > .elementor-container {
        flex-direction: column !important;
        text-align: center !important;
        gap: 10px !important;
    }

    /* ---- FORMS ---- */
    form input,
    form textarea,
    form select {
        width: 100% !important;
        font-size: 16px !important;
        box-sizing: border-box !important;
    }

    form button,
    form input[type="submit"] {
        width: 100% !important;
    }

    /* ---- TABLES ---- */
    table {
        width: 100% !important;
        font-size: 14px !important;
        display: block !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }

    td, th {
        padding: 8px 5px !important;
    }

    /* ---- COOKIE CONSENT BANNER ---- */
    .cmplz-cookiebanner {
        width: 95vw !important;
        max-width: 95vw !important;
        left: 2.5vw !important;
        right: 2.5vw !important;
        bottom: 10px !important;
        padding: 15px !important;
        border-radius: 12px !important;
    }

    .cmplz-logo img {
        max-width: 140px !important;
    }

    .cmplz-buttons {
        flex-direction: column !important;
        gap: 8px !important;
    }

    .cmplz-btn {
        width: 100% !important;
        text-align: center !important;
    }

    /* ---- STICKY ELEMENTS — floating at bottom on mobile ---- */
    .mystickyelements-fixed {
        position: fixed !important;
        top: auto !important;
        bottom: 20px !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        z-index: 999999 !important;
        width: auto !important;
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    .mystickyelements-lists {
        flex-direction: row !important;
        gap: 15px !important;
        display: flex !important;
        margin: 0 !important;
        padding: 0 !important;
        list-style: none !important;
    }

    .mystickyelements-social-icon-li {
        width: 50px !important;
        height: 50px !important;
        min-width: 50px !important;
        border-radius: 50% !important;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35) !important;
        overflow: hidden !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .mystickyelements-social-icon-li:hover {
        width: 50px !important;
    }

    .mystickyelements-social-icon {
        width: 50px !important;
        height: 50px !important;
        min-width: 50px !important;
        border-radius: 50% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .mystickyelements-social-icon a {
        width: 100% !important;
        height: 100% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .mystickyelements-social-text {
        display: none !important;
    }

    /* ---- CONTENT PAGE CARD OVERRIDES ---- */
    /* Fix cards with min-width: 300px that overflow on 320px screens */
    div[style*="min-width:300px"],
    div[style*="min-width: 300px"] {
        min-width: 0 !important;
        width: 100% !important;
    }

    /* Fix cards with min-width: 280px */
    div[style*="min-width:280px"],
    div[style*="min-width: 280px"] {
        min-width: 0 !important;
        width: 100% !important;
    }

    /* Fix FAQ column with flex: 0 0 340px */
    div[style*="flex: 0 0 340px"],
    div[style*="flex:0 0 340px"] {
        flex: 1 1 100% !important;
        min-width: 0 !important;
        width: 100% !important;
    }

    /* Fix pricing cards flex-basis */
    div[style*="flex: 1 1 320px"],
    div[style*="flex:1 1 320px"] {
        flex: 1 1 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    /* Reduce desktop padding on content cards */
    div[style*="padding:40px"],
    div[style*="padding: 40px"],
    div[style*="padding:36px 40px"],
    div[style*="padding: 36px 40px"] {
        padding: 24px 18px !important;
    }

    /* Reduce padding on Intensivkurs timeline and similar large-padding cards */
    div[style*="padding:40px;"],
    div[style*="padding: 40px;"] {
        padding: 24px 18px !important;
    }

    /* Reduce paddings on Elementor populated columns */
    .elementor-element .elementor-element-populated {
        padding: 20px !important;
    }

    /* ---- HEADING FONT SIZE OVERRIDES ---- */
    .elementor-element h1[style*="font-size: 40px"],
    .elementor-element h1[style*="font-size:40px"],
    h1[style*="font-size: 40px"],
    h1[style*="font-size:40px"] {
        font-size: 26px !important;
        line-height: 1.3 !important;
    }

    .elementor-heading-title[style*="font-size:50px"],
    .elementor-heading-title[style*="font-size: 50px"],
    h2[style*="font-size: 50px"],
    h2[style*="font-size:50px"] {
        font-size: 28px !important;
        line-height: 1.2 !important;
    }

    h2[style*="font-size: 36px"],
    h2[style*="font-size:36px"],
    h2[style*="font-size: 32px"],
    h2[style*="font-size:32px"] {
        font-size: 24px !important;
    }

    /* ---- CTA BUTTON OVERFLOW FIX (content pages) ---- */
    a[style*="display:inline-flex"][style*="padding:15px 32px"],
    a[style*="display: inline-flex"][style*="padding: 15px 32px"],
    a[style*="display:inline-flex"][style*="padding:16px 36px"],
    a[style*="display: inline-flex"][style*="padding: 16px 36px"] {
        display: flex !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        padding: 14px 20px !important;
        justify-content: center !important;
        font-size: 15px !important;
    }

    /* ---- INTENSIVKURS TIMELINE FIX ---- */
    /* Reduce circle size and gap on mobile */
    div[style*="width:50px"][style*="height:50px"][style*="border-radius:50%"] {
        width: 40px !important;
        height: 40px !important;
        font-size: 16px !important;
    }

    /* Timeline connecting line adjustment */
    div[style*="position:absolute"][style*="left:24px"][style*="width:2px"] {
        left: 19px !important;
    }

    /* ---- COUNTER WIDGET (absolute badge on hero) ---- */
    .elementor-element.elementor-element-1cb2aae1 {
        position: relative !important;
        right: auto !important;
        top: auto !important;
        margin: 20px auto !important;
    }

    .elementor-element.elementor-element-1cb2aae1 > .elementor-widget-container {
        padding: 1.5em !important;
        border-width: 8px !important;
    }

    /* ---- CIRCLE IMAGE ON INDEX (happy student) ---- */
    .elementor-element.elementor-element-2859668a img {
        width: 250px !important;
        height: 250px !important;
        margin: 0 auto !important;
        display: block !important;
    }

    /* ---- HIDE EMPTY HERO COLUMN ---- */
    .elementor-element.elementor-element-c8cf5d1 {
        display: none !important;
    }

    /* ---- KONTAKT PAGE CARDS ---- */
    .kp-card {
        padding: 20px 18px !important;
    }

    /* ---- PREISE PAGE ---- */
    div[style*="max-width: 340px"],
    div[style*="max-width:340px"] {
        max-width: 100% !important;
    }

    /* ---- FAQ SECTION FIXES ---- */
    section#faq {
        padding: 40px 0 !important;
    }

    .faq-container {
        display: flex !important;
        flex-direction: column !important;
        gap: 25px !important;
        width: 100% !important;
    }

    .faq-image-col {
        max-width: 100% !important;
        flex: 1 1 100% !important;
        width: 100% !important;
    }

    .faq-accordion-col {
        min-width: 0 !important;
        flex: 1 1 100% !important;
        width: 100% !important;
    }

    .faq-item {
        width: 100% !important;
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    .faq-item button {
        display: flex !important;
        width: 100% !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    /* Checklist icon alignment */
    li[style*="align-items:center"][style*="display:flex"][style*="gap:12px"] i {
        margin-top: 2px !important;
        flex-shrink: 0 !important;
    }

    li[style*="align-items:center"][style*="display:flex"][style*="gap:12px"] {
        align-items: flex-start !important;
    }
}


/* ==========================================================================
   SMALL MOBILE — max-width: 480px
   ========================================================================== */
@media (max-width: 480px) {

    /* Even smaller stats grid text */
    section[data-id="7d8d5f5b"] .elementor-counter-number-wrapper {
        font-size: 28px !important;
    }

    section[data-id="7d8d5f5b"] .elementor-counter-title {
        font-size: 11px !important;
    }

    section[data-id="7d8d5f5b"] .elementor-widget-counter {
        padding: 12px 8px !important;
        min-height: 80px !important;
    }

    /* Smaller hero headings */
    .elementor-widget-heading h1.elementor-heading-title {
        font-size: 22px !important;
    }

    /* Smaller hero banner for subpages */
    .hero-banner {
        padding: 40px 14px 50px !important;
    }

    /* Pricing cards — wider on small screens */
    div[style*="padding: 16px 24px"],
    div[style*="padding:16px 24px"] {
        padding: 12px 16px !important;
    }

    /* Circle image smaller */
    .elementor-element.elementor-element-2859668a img {
        width: 200px !important;
        height: 200px !important;
    }

    /* Counter badge */
    .elementor-element.elementor-element-1cb2aae1 > .elementor-widget-container {
        padding: 1em !important;
        border-width: 6px !important;
    }

    .elementor-element.elementor-element-1cb2aae1 .elementor-counter-number-wrapper {
        font-size: 40px !important;
    }

    /* Logo smaller on very small screens */
    .elementor-column[data-id="6845d6c5"] img {
        max-width: 120px !important;
        width: 120px !important;
    }

    /* Content outer padding */
    div[style*="padding: 0 20px 80px"],
    div[style*="padding:0 20px 80px"] {
        padding-bottom: 50px !important;
    }

    /* Tipp boxes */
    div[style*="padding:24px 30px"],
    div[style*="padding: 24px 30px"] {
        padding: 16px 14px !important;
    }

    /* Footer links column on very small */
    footer div[style*="border-top"] > div {
        gap: 8px !important;
    }
}


/* ==========================================================================
   DESKTOP RESTORATIONS — min-width: 768px
   ========================================================================== */
@media (min-width: 768px) {

    /* Desktop submenu (hover to show) */
    .sub-menu {
        background: #ffffff !important;
        box-shadow: 0 10px 30px rgba(0,0,0,0.08) !important;
        padding: 10px 0 !important;
        position: absolute !important;
        top: 100% !important;
        border-top: 20px solid transparent !important;
        background-clip: padding-box !important;
        z-index: 9999999 !important;
        display: none !important;
    }

    .menu-item-has-children:hover > .sub-menu {
        display: block !important;
    }

    .sub-menu .elementor-sub-item {
        color: #444 !important;
        background: transparent !important;
        transition: all 0.2s ease !important;
        padding: 10px 20px !important;
    }

    .sub-menu .elementor-sub-item:hover {
        background-color: #e0f2fe !important;
        color: #0091d6 !important;
    }

    .elementor-nav-menu--main .elementor-item:hover,
    .elementor-nav-menu--main .elementor-item:focus {
        background-color: transparent !important;
        color: #0091d6 !important;
    }

    .e--pointer-underline .elementor-item:before,
    .e--pointer-underline .elementor-item:after {
        display: none !important;
    }
}


/* ==========================================================================
   DESKTOP NAVIGATION RESTORATION — min-width: 768px
   ========================================================================== */
@media (min-width: 768px) {

    /* Hide hamburger on desktop */
    .elementor-menu-toggle {
        display: none !important;
    }

    /* Show desktop nav */
    .elementor-nav-menu--main {
        display: flex !important;
    }

    /* Desktop FAQ layout */
    .faq-container {
        display: flex !important;
        flex-direction: row !important;
        gap: 40px !important;
        align-items: flex-start !important;
        flex-wrap: nowrap !important;
        width: 100% !important;
    }

    .faq-image-col {
        flex: 0 0 340px !important;
        max-width: 340px !important;
        width: 340px !important;
    }

    .faq-accordion-col {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        width: auto !important;
    }

    /* Header layout */
    section[data-id="3ca03a40"] > .elementor-container,
    .header-flex-container {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        justify-content: space-between !important;
        align-items: center !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    /* Logo stays on the left */
    .header-col-logo,
    section[data-id="3ca03a40"] .elementor-column[data-id="6845d6c5"] {
        order: 1 !important;
        width: auto !important;
        min-width: 140px !important;
        flex: 0 0 auto !important;
        display: flex !important;
        align-items: center !important;
        margin-right: auto !important;
    }

    /* Nav menu sits on the right before the button */
    .header-col-nav,
    section[data-id="3ca03a40"] .elementor-column[data-id="591f31fc"] {
        order: 2 !important;
        width: auto !important;
        flex: 0 0 auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        overflow: visible !important;
        white-space: nowrap !important;
        margin-left: auto !important;
    }

    section[data-id="3ca03a40"] .elementor-nav-menu--main .elementor-item {
        padding: 0 10px !important;
        font-size: 15px !important;
        font-weight: 500 !important;
    }

    /* Show CTA button immediately after Kontakt on the right */
    .header-col-cta,
    section[data-id="3ca03a40"] .elementor-column[data-id="5c241c0"] {
        order: 3 !important;
        width: auto !important;
        min-width: 130px !important;
        flex: 0 0 auto !important;
        display: flex !important;
        justify-content: flex-end !important;
        align-items: center !important;
        margin-left: 15px !important;
    }
}


/* ==========================================================================
   PRINT STYLES
   ========================================================================== */
@media print {
    .mystickyelements-fixed,
    .cmplz-cookiebanner,
    .elementor-menu-toggle,
    #global-preloader {
        display: none !important;
    }
}
