/*
 Theme Name:   Astra Child - Bautent
 Theme URI:    https://bautent.de
 Description:  Bautent Child-Theme basierend auf Astra. Dark Premium Header Design.
 Author:       Bautent
 Author URI:   https://bautent.de
 Template:     astra
 Version:      2.10.8
 License:      GNU General Public License v2 or later
 License URI:  https://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  astra-child-bautent
*/

/* ==========================================================================
   Bautent Brand Colors
   Primary:    #0070FA
   Secondary:  #00203E (Dark Navy)
   Accent:     #E8F0FE
   Text:       #333333
   ========================================================================== */

/* ==========================================================================
   DARK PREMIUM HEADER
   Navy background (#00203E), white navigation, sticky with shadow
   ========================================================================== */

/* --- Main Header: Dark Navy Background --- */
.main-header-bar,
.ast-primary-header-bar,
header.site-header .main-header-bar {
    background-color: #00203E !important;
    border-bottom: none !important;
    transition: box-shadow 0.3s ease, background-color 0.3s ease;
}

/* --- Sticky Header --- */
.main-header-bar {
    position: sticky !important;
    top: 0;
    z-index: 999;
}

/* Shadow on scroll (added via JS) */
.main-header-bar.header-scrolled,
.ast-header-sticked {
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25) !important;
    background-color: #001a33 !important;
}

/* --- Logo: Proper SVG sizing --- */
.site-header .custom-logo-link img.custom-logo,
.site-header .ast-site-identity img.custom-logo,
.main-header-bar .custom-logo-link img.custom-logo,
img.custom-logo.astra-logo-svg {
    height: 50px !important;
    width: auto !important;
    min-width: 160px !important;
    max-width: 240px !important;
    object-fit: contain;
}
/* Hide site title when logo is present */
.site-header .ast-site-title-wrap {
    display: none !important;
}

/* Site title white if no logo */
.site-header .site-title a,
.main-header-bar .site-title a,
.ast-site-identity .site-title a {
    color: #ffffff !important;
}

/* --- Navigation: White Text, Premium Spacing --- */
.main-header-menu > .menu-item > a,
.main-header-bar .main-header-menu > .menu-item > a,
.ast-header-sections-navigation .menu-item > a {
    color: #ffffff !important;
    font-weight: 500 !important;
    font-size: 0.92rem !important;
    letter-spacing: 0.04em;
    text-transform: none;
    padding: 0 18px !important;
    transition: color 0.2s ease !important;
    position: relative;
}

/* Hover: Blue accent */
.main-header-menu > .menu-item > a:hover,
.main-header-bar .main-header-menu > .menu-item > a:hover {
    color: #0070FA !important;
}

/* Active/Current page: Blue accent */
.main-header-menu > .menu-item.current-menu-item > a,
.main-header-menu > .menu-item.current-menu-ancestor > a,
.main-header-menu > .menu-item.current-menu-parent > a {
    color: #0070FA !important;
}

/* Underline effect on hover */
.main-header-menu > .menu-item > a::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 2px;
    background: #0070FA;
    transition: width 0.3s ease, left 0.3s ease;
}
.main-header-menu > .menu-item > a:hover::after,
.main-header-menu > .menu-item.current-menu-item > a::after,
.main-header-menu > .menu-item.current-menu-ancestor > a::after {
    width: calc(100% - 36px);
    left: 18px;
}
/* No underline for CTA button */
.main-header-menu > .menu-item.cta-button > a::after {
    display: none !important;
}

/* --- CTA Button: "Kostenlose Beratung" --- */
.main-header-menu .menu-item.cta-button > a,
.main-header-menu .menu-item.ast-menu-item-button > a {
    background: #0070FA !important;
    color: #ffffff !important;
    border-radius: 8px !important;
    padding: 10px 24px !important;
    font-weight: 600 !important;
    font-size: 0.9rem !important;
    letter-spacing: 0.02em;
    transition: all 0.3s ease !important;
    white-space: nowrap;
    margin-left: 12px;
    border: none;
    box-shadow: 0 2px 8px rgba(0, 112, 250, 0.3);
}
.main-header-menu .menu-item.cta-button > a:hover,
.main-header-menu .menu-item.ast-menu-item-button > a:hover {
    background: #0058c8 !important;
    color: #ffffff !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 112, 250, 0.45);
}

/* --- Dropdown / Submenu: Dark Style --- */
.main-header-menu .sub-menu,
.main-header-bar .main-header-menu .sub-menu {
    background: #00203E !important;
    border-top: 2px solid #0070FA;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.3);
    padding: 6px 0;
    min-width: 220px;
}

.main-header-menu .sub-menu li a,
.main-header-bar .main-header-menu .sub-menu li a {
    color: rgba(255, 255, 255, 0.85) !important;
    padding: 10px 22px !important;
    font-size: 0.88rem !important;
    font-weight: 400;
    letter-spacing: 0.02em;
    transition: all 0.2s ease;
    border-left: 3px solid transparent;
}

.main-header-menu .sub-menu li a:hover,
.main-header-bar .main-header-menu .sub-menu li a:hover {
    color: #ffffff !important;
    background: rgba(0, 112, 250, 0.12) !important;
    border-left-color: #0070FA;
}

.main-header-menu .sub-menu li.current-menu-item > a {
    color: #0070FA !important;
    background: rgba(0, 112, 250, 0.08) !important;
    border-left-color: #0070FA;
}

/* Submenu separator line between items */
.main-header-menu .sub-menu li + li {
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}

/* Dropdown arrow/caret for items with children */
.main-header-menu > .menu-item-has-children > a .sub-arrow,
.ast-header-sections-navigation .menu-item-has-children > a .sub-arrow {
    color: rgba(255, 255, 255, 0.6) !important;
}
.main-header-menu > .menu-item-has-children > a:hover .sub-arrow {
    color: #0070FA !important;
}

/*
 * Fix: Dropdown-Toggle als Sibling des <a> (per JS herausgenommen).
 * Der Toggle wird absolut rechts im <li> positioniert,
 * der <a>-Link bleibt ein normaler klickbarer Link.
 */
@media (min-width: 922px) {
    .main-header-menu > .menu-item-has-children {
        position: relative;
    }
    /* Toggle als Sibling des <a> — absolut positioniert rechts */
    .main-header-menu > .menu-item-has-children > .dropdown-menu-toggle {
        position: absolute;
        right: 0;
        top: 0;
        bottom: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 28px;
        cursor: pointer;
        z-index: 2;
        color: rgba(255, 255, 255, 0.6);
        transition: color 0.2s;
    }
    .main-header-menu > .menu-item-has-children > .dropdown-menu-toggle:hover {
        color: #0070FA;
    }
    /* Link: padding-right fuer Platz fuer den Toggle */
    .main-header-menu > .menu-item-has-children > a.menu-link {
        padding-right: 28px !important;
    }
}

/* Fix: Astra setzt hellen Hintergrund auf mobile menu-toggle bei current-menu-ancestor */
@media (max-width: 921px) {
    .ast-builder-menu-mobile .main-navigation .menu-item.current-menu-ancestor > .ast-menu-toggle,
    .ast-builder-menu-mobile .main-navigation .menu-item.current-menu-item > .ast-menu-toggle {
        background: transparent !important;
        color: rgba(255, 255, 255, 0.9) !important;
    }
}

/* --- Header Padding for Elegance --- */
.main-header-bar .ast-container,
.main-header-bar .ast-flex {
    padding-top: 6px;
    padding-bottom: 6px;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
}

/* --- WP Admin Bar Offset --- */
.admin-bar .main-header-bar {
    top: 32px;
}
@media (max-width: 782px) {
    .admin-bar .main-header-bar {
        top: 46px;
    }
}

/* ==========================================================================
   MOBILE HEADER (Dark Premium)
   ========================================================================== */
@media (max-width: 992px) {
    /* Mobile toggle / hamburger: White */
    .ast-mobile-menu-trigger-minimal,
    .ast-button-wrap .ast-mobile-menu-buttons-minimal,
    .menu-toggle,
    .ast-mobile-menu-buttons,
    .ast-header-break-point .ast-mobile-menu-buttons {
        color: #ffffff !important;
    }
    .ast-mobile-menu-trigger-minimal .ast-mobile-svg,
    .menu-toggle .ast-mobile-svg,
    .ast-mobile-menu-buttons .ast-mobile-svg {
        fill: #ffffff !important;
    }

    /* Mobile menu background */
    .ast-header-break-point .main-header-menu,
    .ast-mobile-popup-drawer .ast-mobile-popup-inner,
    .ast-mobile-header-wrap .ast-mobile-header-content {
        background: #00203E !important;
    }

    /* Mobile menu items: White */
    .ast-header-break-point .main-header-menu .menu-item > a,
    .ast-mobile-popup-drawer .menu-item > a,
    .ast-header-break-point .main-navigation .menu-item > a {
        color: rgba(255, 255, 255, 0.9) !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
        padding: 14px 20px !important;
    }
    .ast-header-break-point .main-header-menu .menu-item > a:hover,
    .ast-mobile-popup-drawer .menu-item > a:hover {
        color: #0070FA !important;
        background: rgba(0, 112, 250, 0.08) !important;
    }

    /* Mobile submenu */
    .ast-header-break-point .main-header-menu .sub-menu,
    .ast-mobile-popup-drawer .sub-menu {
        background: rgba(0, 20, 40, 0.5) !important;
        border-top: none;
        box-shadow: none;
        border-radius: 0;
    }
    .ast-header-break-point .main-header-menu .sub-menu li a,
    .ast-mobile-popup-drawer .sub-menu li a {
        padding-left: 36px !important;
        font-size: 0.86rem !important;
    }

    /* Mobile CTA Button */
    .ast-header-break-point .main-header-menu .menu-item.cta-button > a,
    .ast-mobile-popup-drawer .menu-item.cta-button > a {
        display: block !important;
        text-align: center;
        margin: 16px 20px !important;
        border-radius: 8px !important;
        padding: 14px 24px !important;
    }

    /* Mobile submenu toggle arrows */
    .ast-header-break-point .ast-mobile-menu-buttons .sub-arrow,
    .ast-mobile-popup-drawer .ast-menu-toggle {
        color: rgba(255, 255, 255, 0.6) !important;
        border-color: rgba(255, 255, 255, 0.1) !important;
    }

    /* Mobile close button */
    .ast-mobile-popup-drawer .menu-toggle-close {
        color: #ffffff !important;
    }
}

/* ==========================================================================
   Hide Astra Default Footer (replaced by mu-plugin footer)
   ========================================================================== */
.ast-small-footer,
.site-footer .ast-footer-overlay,
.ast-small-footer-section,
footer.site-footer .ast-small-footer {
    display: none !important;
}
/* Keep the Astra footer container for proper spacing but hide default content */
.site-footer > .ast-container {
    display: none !important;
}

/* ==========================================================================
   BODY OFFSET for Sticky Header
   ========================================================================== */
body {
    padding-top: 0;
}
/* Astra sometimes adds margin-top for transparent/sticky headers */
.ast-above-header-bar + .site-content,
.main-header-bar + .site-content,
.ast-primary-header-bar + .site-content {
    margin-top: 0;
}


/* ==========================================================================
   FIX: White gap between header and body
   Remove all margins/padding between sticky header and content area
   ========================================================================== */
.site-content,
#content {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
/* Astra adds margin on #primary (4em separate / 60px plain) - override all */
#primary,
.ast-separate-container #primary,
.ast-plain-container #primary,
.ast-plain-container.ast-no-sidebar #primary {
    margin-top: 0 !important;
    padding-top: 0 !important;
    margin-bottom: 0 !important;
}
/* Astra primary content area - remove container padding/margins */
.ast-separate-container .ast-article-single,
.ast-separate-container .ast-article-post,
.ast-plain-container .ast-article-single,
.ast-plain-container .ast-article-post {
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
}
.ast-separate-container .ast-comment-list li.depth-1,
.ast-separate-container .comment-respond {
    padding-top: 0;
}
/* Remove Astra's container top padding on pages */
.ast-separate-container .site-main > .ast-container,
.ast-plain-container .site-main > .ast-container {
    padding-top: 0 !important;
}
/* First element after header should be flush */
.site-content > .ast-container:first-child {
    padding-top: 0 !important;
    margin-top: 0 !important;
}
/* Entry-content first child flush */
.entry-content > *:first-child {
    margin-top: 0;
}
/* Hero section negative margin to overlap any residual gap */
.has-hero-section .entry-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
.has-hero-section .entry-content > .hero-section:first-child {
    margin-top: 0;
}
/* Pages with content H1 but no hero - moderate top padding after featured img or navy bridge */
.has-content-h1:not(.has-hero-section) .entry-content {
    padding-top: 2rem !important;
}
/* Astra's article wrapper */
.ast-article-single {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
.ast-separate-container article {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
/* ==========================================================================
   GLOBAL TYPOGRAPHY & BASE STYLES
   ========================================================================== */
body {
    font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, sans-serif;
    color: #333333;
    line-height: 1.7;
}
.entry-content h1, .entry-content h2, .entry-content h3,
.entry-content h4, .entry-content h5, .entry-content h6 {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    line-height: 1.25;
    color: #00203E;
}
.entry-content h2 {
    font-size: clamp(1.8rem, 4vw, 2.5rem);
    margin-bottom: 1rem;
}
.entry-content h3 {
    font-size: clamp(1.2rem, 2.5vw, 1.5rem);
}

/* Links: Color only, no underline */
a,
.entry-content a,
.entry-content p a,
.ast-single-post .entry-content a,
.ast-comment-content a {
    text-decoration: none !important;
}

/* Full width page content */
.ast-container,
.site-content .ast-container {
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}
.entry-content {
    max-width: 100%;
    margin: 0;
    padding: 0;
}
/* Remove default Astra page padding */
.ast-page-builder-template .site-content > .ast-container,
.page .entry-content {
    padding: 0 !important;
}
.page .entry-header {
    display: none;
}
/* Model gallery & stats grid: match hero-section side padding (8%) */
.bt-model-gallery,
.bt-stats-grid {
    padding-left: 8%;
    padding-right: 8%;
    box-sizing: border-box;
}

/* ==========================================================================
   BUTTONS - Primary & Secondary CTAs
   ========================================================================== */
.btn {
    display: inline-block;
    padding: 14px 32px;
    border-radius: 8px;
    font-weight: 600;
    font-size: 1rem;
    letter-spacing: 0.02em;
    text-decoration: none;
    transition: all 0.3s ease;
    cursor: pointer;
    border: 2px solid transparent;
    text-align: center;
}
.btn-primary {
    background: #0070FA;
    color: #ffffff !important;
    box-shadow: 0 4px 15px rgba(0, 112, 250, 0.3);
}
.btn-primary:hover {
    background: #0058c8;
    color: #ffffff !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 25px rgba(0, 112, 250, 0.45);
    text-decoration: none;
}
.btn-secondary {
    background: transparent;
    color: #0070FA !important;
    border: 2px solid #0070FA;
}
.btn-secondary:hover {
    background: #0070FA;
    color: #ffffff !important;
    border-color: #0070FA;
    text-decoration: none;
}
/* btn-secondary auf dunklem Hintergrund: weiß */
.hero-section .btn-secondary,
.kontakt-cta .btn-secondary,
.cta-section .btn-secondary,
.final-cta .btn-secondary {
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, 0.7);
}
.hero-section .btn-secondary:hover,
.kontakt-cta .btn-secondary:hover,
.cta-section .btn-secondary:hover,
.final-cta .btn-secondary:hover {
    background: rgba(255, 255, 255, 0.15);
    color: #ffffff !important;
    border-color: #ffffff;
}

/* ==========================================================================
   HERO SECTION - Full Width with Image Background
   ========================================================================== */
.hero-section {
    position: relative;
    min-height: 85vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 120px 8% 80px;
    overflow: hidden;
    background: #00203E;
}
/* Auto-generated hero from featured image: compact height */
.hero-section.hero-auto {
    min-height: 55vh;
    padding: 100px 8% 60px;
}
/* Use inline image as background cover */
.hero-section .wp-block-image {
    position: absolute !important;
    top: 0; left: 0; right: 0; bottom: 0;
    margin: 0 !important;
    z-index: 0;
}
.hero-section .wp-block-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block;
}
.hero-section .wp-block-image figcaption {
    display: none;
}
/* Dark gradient overlay */
.hero-section::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(135deg,
        rgba(0, 32, 62, 0.88) 0%,
        rgba(0, 32, 62, 0.65) 50%,
        rgba(0, 32, 62, 0.45) 100%);
    z-index: 1;
}
/* All content above overlay */
.hero-section > *:not(.wp-block-image) {
    position: relative;
    z-index: 2;
}
.hero-section h1 {
    font-size: clamp(2rem, 5vw, 3.2rem);
    color: #ffffff !important;
    font-weight: 800;
    font-style: normal !important;
    line-height: 1.15;
    max-width: 850px;
    margin-bottom: 1.5rem;
    text-shadow: 0 2px 20px rgba(0, 0, 0, 0.3);
}
.hero-section p {
    color: rgba(255, 255, 255, 0.9);
    font-size: clamp(1rem, 1.8vw, 1.15rem);
    max-width: 650px;
    margin-bottom: 1.5rem;
    line-height: 1.7;
}
.hero-section .btn {
    margin-right: 16px;
    margin-bottom: 12px;
    font-size: 1.05rem;
    padding: 16px 36px;
}

/* ==========================================================================
   DUAL-SERVICE HERO (Homepage)
   ========================================================================== */
.hero-section.hero-dual-service {
    min-height: auto !important;
    padding: 100px 8% 60px !important;
    background: linear-gradient(165deg, #00203E 0%, #001a33 60%, #002850 100%) !important;
}
.hero-section.hero-dual-service::before {
    display: none !important;
}
.hero-section.hero-dual-service h1 {
    max-width: 900px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 1rem;
}
.hero-section.hero-dual-service .hero-intro {
    display: block;
    text-align: center;
    max-width: 720px;
    margin: 0 auto 2.5rem auto;
    color: rgba(255, 255, 255, 0.85);
    font-size: clamp(1rem, 1.8vw, 1.1rem);
    line-height: 1.7;
}
.hero-dual {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 28px;
    max-width: 960px;
    margin: 0 auto;
}
.hero-dual .hero-card {
    display: block;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 16px;
    overflow: hidden;
    text-decoration: none;
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}
.hero-dual .hero-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
    border-color: rgba(0, 112, 250, 0.4);
}
.hero-dual .hero-card img {
    width: 100%;
    height: 220px;
    object-fit: cover;
    display: block;
}
.hero-dual .hero-card-content {
    padding: 24px 28px 28px;
}
.hero-dual .hero-card-content h2 {
    color: #ffffff;
    font-size: 1.5rem;
    font-weight: 800;
    margin: 0 0 0.6rem 0;
}
.hero-dual .hero-card-content .hero-card-text {
    display: block;
    color: rgba(255, 255, 255, 0.75);
    font-size: 0.95rem;
    line-height: 1.6;
    margin-bottom: 1.2rem;
}
.hero-dual .hero-card-content .btn {
    display: inline-block;
    padding: 12px 28px;
    font-size: 0.95rem;
    margin: 0;
}
.hero-dual .hero-card-content .hero-tag {
    display: inline-block;
    background: rgba(0, 112, 250, 0.15);
    color: #6db3ff;
    font-size: 0.78rem;
    font-weight: 600;
    padding: 4px 12px;
    border-radius: 20px;
    margin-bottom: 12px;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}
@media (max-width: 768px) {
    .hero-section.hero-dual-service {
        padding: 90px 5% 40px;
    }
    .hero-dual {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .hero-dual .hero-card img {
        height: 180px;
    }
    .hero-section.hero-dual-service h1 {
        font-size: 1.8rem;
        text-align: left;
    }
    .hero-section.hero-dual-service > p {
        text-align: left;
    }
}

/* ==========================================================================
   SECTION BASE STYLES
   ========================================================================== */
.fertighaus-showcase,
.sanierung-services,
.warum-bautent,
.kostenrechner-cta,
.kundenstimmen,
.region-sektion,
.kontakt-cta {
    padding: 80px 8%;
}

/* Section subtitle / tag */
.fertighaus-showcase > h2,
.sanierung-services > h2,
.warum-bautent > h2,
.kundenstimmen > h2,
.region-sektion > h2 {
    text-align: center;
    margin-bottom: 1.2rem;
    position: relative;
}
.fertighaus-showcase > h2::after,
.sanierung-services > h2::after,
.warum-bautent > h2::after,
.kundenstimmen > h2::after,
.region-sektion > h2::after {
    content: '';
    display: block;
    width: 60px;
    height: 3px;
    background: #0070FA;
    margin: 16px auto 0;
    border-radius: 2px;
}
/* Center first paragraph after headings */
.fertighaus-showcase > p:first-of-type,
.sanierung-services > p:first-of-type,
.warum-bautent > p:first-of-type,
.kundenstimmen > p:first-of-type,
.region-sektion > p:first-of-type {
    text-align: center;
    max-width: 750px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 3rem;
    color: #666;
    font-size: 1.05rem;
}

/* ==========================================================================
   FERTIGHAUS SHOWCASE - Light Background
   ========================================================================== */
.fertighaus-showcase {
    background: #ffffff;
}
.fertighaus-showcase > .wp-block-image {
    display: none; /* Hide inline image for this section */
}
.fertighaus-showcase > ul {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    list-style: none;
    padding: 0;
    margin: 3rem auto;
    max-width: 1100px;
}
.fertighaus-showcase > ul li {
    background: #E8F0FE;
    padding: 20px 24px;
    border-radius: 12px;
    font-size: 0.95rem;
    display: flex;
    align-items: flex-start;
    gap: 12px;
}
.fertighaus-showcase > ul li::before {
    content: '✓';
    font-weight: 700;
    color: #0070FA;
    font-size: 1.2rem;
    flex-shrink: 0;
}
.fertighaus-showcase > ul li strong {
    color: #00203E;
}
/* Center CTA button */
.fertighaus-showcase > .btn,
.fertighaus-showcase > p:last-child {
    display: block;
    width: fit-content;
    margin: 2rem auto 0;
    text-align: center;
}
/* Mehrere Buttons nebeneinander zentrieren */
.entry-content > section > p:last-child {
    text-align: center;
}

/* ==========================================================================
   SANIERUNG SERVICES - Dark Navy Background
   ========================================================================== */
.sanierung-services {
    background: linear-gradient(180deg, #00203E 0%, #001a33 100%);
}
.sanierung-services > h2 {
    color: #ffffff !important;
}
.sanierung-services > h2::after {
    background: #0070FA;
}
.sanierung-services > p:first-of-type {
    color: rgba(255, 255, 255, 0.75);
}
.sanierung-services > .wp-block-image {
    display: none; /* Hide inline image - cards are visual enough */
}
.sanierung-services .card h3 {
    color: #00203E;
}
.sanierung-services > .btn {
    display: block;
    width: fit-content;
    margin: 2rem auto 0;
}

/* ==========================================================================
   CARD GRID - Shared Card Styles
   ========================================================================== */
.card-grid {
    display: grid;
    gap: 24px;
    margin: 2rem 0;
}
.card-grid-3 {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}
.card-grid-2 {
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
}
.card {
    background: #ffffff;
    border-radius: 16px;
    padding: 32px 28px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
    transition: all 0.3s ease;
    border: 1px solid rgba(0, 0, 0, 0.04);
    position: relative;
    overflow: hidden;
}
.card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 0;
    background: #0070FA;
    transition: height 0.3s ease;
    border-radius: 0 0 4px 0;
}
.card:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12);
}
.card:hover::before {
    height: 100%;
}
.card h3 {
    font-size: 1.25rem;
    margin-bottom: 0.75rem;
    color: #00203E;
}
.card p {
    color: #555;
    font-size: 0.95rem;
    line-height: 1.65;
    margin-bottom: 0.5rem;
}
.card p strong {
    color: #0070FA;
    font-size: 1.05rem;
}
.card a:not(.btn) {
    display: inline-flex;
    align-items: center;
    color: #0070FA;
    font-weight: 600;
    text-decoration: none;
    font-size: 0.95rem;
    margin-top: 8px;
    transition: gap 0.2s ease;
    gap: 6px;
}
.card a:not(.btn)::after {
    content: '→';
    transition: transform 0.2s ease;
}
.card a:not(.btn):hover {
    gap: 10px;
}
.card a:not(.btn):hover::after {
    transform: translateX(3px);
}

/* ==========================================================================
   WARUM BAUTENT - USPs Section
   ========================================================================== */
.warum-bautent {
    background: #ffffff;
}
.warum-bautent > .wp-block-image {
    max-width: 1100px;
    margin: 0 auto 3rem;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.1);
}
.warum-bautent > .wp-block-image img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 16px;
}
.warum-bautent > .wp-block-image figcaption {
    display: none;
}
.warum-bautent .card {
    background: #ffffff;
    border-left: 4px solid #0070FA;
    border-radius: 0 16px 16px 0;
}
.warum-bautent .card::before {
    display: none; /* Override the blue bar since we have border-left */
}
.warum-bautent .card h3 {
    font-size: 1.15rem;
}
.warum-bautent > p:last-of-type {
    text-align: center;
    margin-top: 2rem;
    font-size: 1rem;
}
.warum-bautent > p:last-of-type a {
    color: #0070FA;
    font-weight: 600;
}

/* ==========================================================================
   KOSTENRECHNER CTA - Blue Gradient Section
   ========================================================================== */
.kostenrechner-cta {
    background: linear-gradient(135deg, #0070FA 0%, #0058c8 100%);
    text-align: center;
    padding: 80px 8%;
    position: relative;
    overflow: hidden;
}
.kostenrechner-cta::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -20%;
    width: 500px;
    height: 500px;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 50%;
}
.kostenrechner-cta::after {
    content: '';
    position: absolute;
    bottom: -30%;
    left: -10%;
    width: 350px;
    height: 350px;
    background: rgba(255, 255, 255, 0.04);
    border-radius: 50%;
}
.kostenrechner-cta > * {
    position: relative;
    z-index: 1;
}
.kostenrechner-cta h2 {
    color: #ffffff !important;
    font-size: clamp(1.6rem, 3.5vw, 2.2rem);
    max-width: 700px;
    margin: 0 auto 1.5rem;
}
.kostenrechner-cta p {
    color: rgba(255, 255, 255, 0.9);
    max-width: 650px;
    margin: 0 auto 1rem;
    font-size: 1.05rem;
}
.kostenrechner-cta p a {
    color: #ffffff !important;
    text-decoration: underline;
    text-underline-offset: 3px;
    font-weight: 600;
}
.kostenrechner-cta p a:hover {
    color: #ffffff !important;
    text-decoration-thickness: 2px;
}
.kostenrechner-cta .btn-primary {
    background: #ffffff;
    color: #0070FA !important;
    font-size: 1.1rem;
    padding: 16px 40px;
    margin-top: 1.5rem;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}
.kostenrechner-cta .btn-primary:hover {
    background: #f0f0f0;
    transform: translateY(-3px);
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.2);
}

/* ==========================================================================
   KUNDENSTIMMEN - Testimonials
   ========================================================================== */
.kundenstimmen {
    background: #ffffff;
    text-align: center;
}
.kundenstimmen p {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    color: #555;
}
.kundenstimmen ul {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 24px;
    list-style: none;
    padding: 0;
    margin: 2.5rem auto;
    max-width: 1100px;
}
.kundenstimmen ul li {
    background: #E8F0FE;
    padding: 24px;
    border-radius: 12px;
    font-size: 1.05rem;
    font-weight: 600;
    color: #00203E;
    text-align: center;
}
.kundenstimmen ul li strong {
    display: block;
    font-size: 2rem;
    color: #0070FA;
    margin-bottom: 4px;
}

/* ==========================================================================
   REGION SECTION
   ========================================================================== */
.region-sektion {
    background: #ffffff;
}
.region-sektion p {
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}
.region-sektion p strong {
    color: #00203E;
}

/* ==========================================================================
   KONTAKT CTA - Dark Navy Final CTA
   ========================================================================== */
.kontakt-cta,
.bt-vu-auto-section .kontakt-cta,
.bt-vu-section-white .kontakt-cta,
section.bt-vu-auto-section.bt-vu-section-white .kontakt-cta {
    background: linear-gradient(135deg, #00203E 0%, #003366 100%) !important;
    text-align: center;
    padding: 48px 40px;
    border-radius: 16px;
    color: #fff !important;
}
/* CTA Dark Sections — höchste Spezifität um bt-vu-section-white zu überschreiben */
section.bt-vu-auto-section.bt-vu-cta-dark,
.entry-content section.bt-vu-auto-section.bt-vu-section-white.bt-vu-cta-dark,
.bt-vu-auto-section.bt-vu-section-white.bt-vu-cta-dark {
    background: linear-gradient(135deg, #00203E 0%, #003366 100%) !important;
    border-radius: 0 !important;
    text-align: center !important;
    color: #fff !important;
}
.bt-vu-cta-dark h2 { color: #fff !important; }
.bt-vu-cta-dark p { color: rgba(255,255,255,0.85) !important; }
.bt-vu-cta-dark a { color: #fff !important; }
/* Fallback für Browser ohne :has() */
.kontakt-cta {
    background: linear-gradient(135deg, #00203E 0%, #003366 100%) !important;
    border-radius: 16px !important;
    padding: 48px 40px !important;
    text-align: center !important;
    color: #fff !important;
}
.kontakt-cta h2 { color: #fff !important; }
.kontakt-cta p { color: rgba(255,255,255,0.85) !important; }
.kontakt-cta h2 {
    color: #ffffff !important;
    font-size: clamp(1.6rem, 3.5vw, 2.2rem);
    max-width: 700px;
    margin: 0 auto 1.5rem;
}
.kontakt-cta p {
    color: rgba(255, 255, 255, 0.85);
    max-width: 650px;
    margin: 0 auto 1rem;
    font-size: 1.05rem;
}
.kontakt-cta strong {
    color: #0070FA;
    font-size: 1.3rem;
}
.kontakt-cta .btn-primary {
    margin-top: 1.5rem;
    font-size: 1.1rem;
    padding: 16px 40px;
}

/* ==========================================================================
   GENERIC CONTENT SECTIONS (Kontakt, Qualität, Hausplaner etc.)
   Default styling for all section types that aren't homepage-specific
   ========================================================================== */

/* Inner content constrain for generic sections */
.contact-methods,
.contact-form-section,
.services-overview,
.customer-concerns,
.service-area,
.final-cta,
.intro-section,
.construction-method,
.construction-process,
.energy-efficiency,
.bautent-quality,
.guarantees-security,
.materials-sustainability,
.cta-section,
.process-overview,
.checklist-section,
.step-consultation,
.step-design,
.step-selection,
.step-pricing,
.step-construction {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

/* Section headings */
.contact-methods h2,
.contact-form-section h2,
.services-overview h2,
.customer-concerns h2,
.service-area h2,
.final-cta h2,
.intro-section h2,
.construction-method h2,
.construction-process h2,
.energy-efficiency h2,
.bautent-quality h2,
.guarantees-security h2,
.materials-sustainability h2,
.cta-section h2,
.process-overview h2,
.checklist-section h2,
.step-consultation h2,
.step-design h2,
.step-selection h2,
.step-pricing h2,
.step-construction h2 {
    text-align: center;
    margin-bottom: 1.2rem;
    position: relative;
}

/* Blue underline accent on headings */
.contact-methods h2::after,
.services-overview h2::after,
.customer-concerns h2::after,
.intro-section h2::after,
.construction-method h2::after,
.construction-process h2::after,
.energy-efficiency h2::after,
.bautent-quality h2::after,
.guarantees-security h2::after,
.materials-sustainability h2::after,
.process-overview h2::after,
.checklist-section h2::after {
    content: '';
    display: block;
    width: 60px;
    height: 3px;
    background: #0070FA;
    margin: 16px auto 0;
    border-radius: 2px;
}

/* Intro paragraph centered */
.contact-methods > p:first-of-type,
.services-overview > p:first-of-type,
.customer-concerns > p:first-of-type,
.intro-section > p:first-of-type,
.construction-method > p:first-of-type,
.process-overview > p:first-of-type,
.checklist-section > p:first-of-type {
    text-align: center;
    max-width: 750px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 2.5rem;
    color: #666;
    font-size: 1.05rem;
}

/* Contact info grid */
.contact-info-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 24px;
    max-width: 1100px;
    margin: 2rem auto;
}
.contact-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 32px 28px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
    border: 1px solid rgba(0, 0, 0, 0.04);
    transition: all 0.3s ease;
    border-top: 4px solid #0070FA;
}
.contact-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12);
}
.contact-card h3 {
    color: #00203E;
    margin-bottom: 0.75rem;
}
.contact-card .phone-number strong a {
    font-size: 1.4rem;
    color: #0070FA;
    text-decoration: none;
}

/* CTA sections (dark background) */
.final-cta,
.cta-section {
    background: linear-gradient(135deg, #00203E 0%, #001529 100%) !important;
    text-align: center;
    border-radius: 0 !important;
}
.final-cta h2,
.cta-section h2 {
    color: #ffffff !important;
    font-size: clamp(1.6rem, 3.5vw, 2.2rem);
    max-width: 700px;
    margin: 0 auto 1.5rem;
}
.final-cta p,
.cta-section p {
    color: rgba(255, 255, 255, 0.85);
    max-width: 650px;
    margin: 0 auto 1rem;
    font-size: 1.05rem;
}
.final-cta .cta-buttons,
.cta-section .cta-buttons {
    margin-top: 1.5rem;
}
.final-cta .phone-cta strong a,
.cta-section .phone-cta strong a {
    color: #0070FA;
    font-size: 1.3rem;
    text-decoration: none;
}
.final-cta .btn-primary,
.cta-section .btn-primary {
    margin-top: 1rem;
    font-size: 1.1rem;
    padding: 16px 40px;
}

/* Cards inside dark CTA sections */
.cta-section .card,
.final-cta .card {
    border-radius: 0 !important;
}
.cta-section .card p,
.final-cta .card p {
    color: #555;
}
.cta-section .card p strong,
.final-cta .card p strong {
    color: #0070FA;
}

/* Service area section */
.service-area {
    background: #f8fafc !important;
}
.service-area h3 {
    color: #00203E;
    margin-top: 1.5rem;
}
.service-cities ul {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    list-style: none;
    padding: 0;
    margin: 1rem 0;
}
.service-cities ul li {
    background: linear-gradient(135deg, #E8F0FE, #dbe8fd);
    padding: 6px 16px;
    border-radius: 20px;
    font-size: 0.92rem;
    font-weight: 500;
    color: #00203E;
}

/* FAQ sections (inside generic pages) */
.faq-section {
    max-width: 1100px;
    margin: 0 auto;
}
.faq-section h2 {
    text-align: center;
    margin-bottom: 1rem;
}
/* FAQ: "Häufig gestellte Fragen" Doppel-H2 verstecken (bt-vu-faq-section) */
.bt-vu-faq-section h2,
.bt-vu-auto-section .bt-vu-faq-section > h2 {
    display: none !important;
}
/* FAQ: Kategorie-Überschriften kompakter */
.page-id-5584 h2 {
    margin-top: 1.5rem !important;
    margin-bottom: 0.5rem !important;
}
.page-id-5584 .bt-vu-auto-section {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}
.faq-item {
    background: #ffffff;
    border-radius: 12px;
    padding: 24px 28px;
    margin-bottom: 16px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
    border-left: 4px solid #0070FA;
}
.faq-item h3 {
    color: #00203E;
    margin-bottom: 0.5rem;
    font-size: 1.1rem;
}
.faq-item p {
    color: #555;
    margin-bottom: 0.5rem;
}

/* Contact form section */
.contact-form-section {
    background: #ffffff !important;
    text-align: center;
}
.contact-form-section > p {
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}
.contact-form-section ul {
    list-style: none;
    padding: 0;
    max-width: 600px;
    margin: 1.5rem auto;
    text-align: left;
}
.contact-form-section ul li {
    padding: 8px 0 8px 28px;
    position: relative;
}
.contact-form-section ul li::before {
    content: '✓';
    position: absolute;
    left: 0;
    color: #0070FA;
    font-weight: 700;
}

/* Qualität page: step/process sections */
.construction-process,
.process-overview {
    background: #ffffff !important;
}

/* Guarantees section styling */
.guarantees-security .card-grid,
.materials-sustainability .card-grid {
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
}

/* BAUTENT quality section */
.bautent-quality {
    background: linear-gradient(135deg, #00203E 0%, #001a33 100%) !important;
}
.bautent-quality h2 {
    color: #ffffff !important;
}
.bautent-quality h2::after {
    background: #0070FA;
}
.bautent-quality > p {
    color: rgba(255, 255, 255, 0.85) !important;
}

/* ==========================================================================
   NO-HERO PAGES with sections (Qualität, Sanierungsberatung etc.)
   ========================================================================== */
.no-hero-page .entry-content > section {
    padding: 40px 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.04);
}
.no-hero-page .entry-content > section:last-child {
    border-bottom: none;
}
/* Card-grids inside no-hero pages */
.no-hero-page .entry-content .card-grid {
    margin-left: 0;
    margin-right: 0;
}

/* Comparison box (Qualität page etc.) */
.comparison-box,
.quality-control-box {
    background: linear-gradient(135deg, #E8F0FE, #dbe8fd);
    border-radius: 16px;
    padding: 28px 32px;
    margin: 2rem 0;
    border-left: 4px solid #0070FA;
}
.comparison-box h3,
.quality-control-box h3 {
    color: #00203E;
    margin-bottom: 1rem;
}
.comparison-box ul,
.quality-control-box ul {
    list-style: none;
    padding: 0;
}
.comparison-box ul li,
.quality-control-box ul li {
    padding: 8px 0 8px 28px;
    position: relative;
    border-bottom: 1px solid rgba(0, 112, 250, 0.1);
}
.comparison-box ul li:last-child,
.quality-control-box ul li:last-child {
    border-bottom: none;
}
.comparison-box ul li::before,
.quality-control-box ul li::before {
    content: '▸';
    position: absolute;
    left: 4px;
    color: #0070FA;
    font-weight: 700;
}

/* ==========================================================================
   BLOG ARCHIVE - Fix desktop navigation
   ========================================================================== */
.blog .main-header-bar,
.archive .main-header-bar {
    position: sticky !important;
    top: 0;
    z-index: 999;
    background-color: #00203E !important;
}
/* Ensure blog page gets proper page header */
.blog .ast-archive-description,
.archive .ast-archive-description {
    background: #00203E;
    padding: 100px 8% 40px;
    margin: 0;
}
.blog .ast-archive-description .page-title,
.archive .ast-archive-description .page-title {
    color: #ffffff !important;
}
/* Blog Hero: break out of ast-container to full viewport width */
.blog .hero-section.blog-hero {
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    margin-top: 0;
    margin-bottom: 0;
}
/* Blog content area padding — only below the hero */
.blog .site-content .ast-container {
    max-width: 1200px !important;
    margin: 0 auto;
    padding: 2rem 24px !important;
}
.archive .site-content .ast-container {
    max-width: 1200px !important;
    margin: 0 auto;
    padding: 2rem 24px !important;
}
/* Hide Astra archive-description when blog hero is active */
.blog.has-hero-section .ast-archive-description {
    display: none !important;
}
/* Blog: Grid-Layout für Beiträge */
.blog #main > .ast-row,
.archive #main > .ast-row {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
}
.blog .ast-article-post,
.archive .ast-article-post {
    margin-bottom: 0 !important;
    padding-bottom: 0;
    border-bottom: none;
    display: flex;
    flex-direction: column;
}
.blog .ast-article-post .entry-content,
.archive .ast-article-post .entry-content {
    flex: 1;
    padding: 0 20px 20px;
}
.blog .ast-article-post .entry-header,
.archive .ast-article-post .entry-header {
    padding: 16px 20px 8px;
}
.blog .ast-article-post .entry-header .entry-title,
.archive .ast-article-post .entry-header .entry-title {
    font-size: 1.1rem !important;
    line-height: 1.4;
}
.blog .ast-article-post .entry-meta,
.archive .ast-article-post .entry-meta {
    padding: 0 20px 16px;
    font-size: 0.85rem;
}
/* Blog: Pagination nicht im Grid */
.blog .ast-pagination,
.archive .ast-pagination {
    grid-column: 1 / -1;
}
/* Blog: Mehr Abstand nach Hero */
.blog .hero-section.blog-hero {
    margin-bottom: 2rem;
}
/* Blog: Sidebar aus dem Grid nehmen */
.blog #secondary,
.archive #secondary {
    grid-column: 1 / -1;
}
/* Mobile: 1 Spalte */
@media (max-width: 768px) {
    .blog #main > .ast-row,
    .archive #main > .ast-row {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
}

/* ==========================================================================
   RESPONSIVE - Mobile Adjustments
   ========================================================================== */
@media (max-width: 768px) {
    .hero-section {
        min-height: 70vh;
        padding: 100px 6% 60px;
    }
    .hero-section h1 {
        font-size: 1.8rem;
    }
    .hero-section .btn {
        display: block;
        width: 100%;
        margin-right: 0;
        margin-bottom: 12px;
        text-align: center;
    }
    /* All sections: mobile padding */
    .fertighaus-showcase,
    .sanierung-services,
    .warum-bautent,
    .kostenrechner-cta,
    .kundenstimmen,
    .region-sektion,
    .kontakt-cta,
    .has-hero-section .entry-content > section {
        padding: 50px 5% !important;
    }
    .card-grid-3 {
        grid-template-columns: 1fr;
    }
    .card-grid-2 {
        grid-template-columns: 1fr;
    }
    .card {
        padding: 24px 20px;
    }
    .contact-card {
        padding: 24px 20px;
    }
    .contact-info-grid {
        grid-template-columns: 1fr;
    }
    .fertighaus-showcase > ul {
        grid-template-columns: 1fr;
    }
    .kundenstimmen ul {
        grid-template-columns: repeat(2, 1fr);
    }
    .faq-item {
        padding: 20px;
    }
    .service-cities ul {
        justify-content: center;
    }
}

/* Tablet: 2-column grids for iPad portrait (768px) */
@media (min-width: 768px) and (max-width: 1024px) {
    .card-grid-3 {
        grid-template-columns: repeat(2, 1fr);
    }
    .card-grid-2 {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 480px) {
    .kundenstimmen ul {
        grid-template-columns: 1fr;
    }
}

/* ==========================================================================
   LEAD-MAGNET CTA BANNERS (inline on homepage/stadtseiten)
   mu-plugin CSS doesn't load on auto-injected pages
   ========================================================================== */
.blm-cta-banner {
    display: flex;
    align-items: center;
    gap: 16px;
    background: linear-gradient(135deg, #00203E, #0a3a6b);
    padding: 20px 25px;
    border-radius: 12px;
    margin: 30px 0;
    color: white;
    border: 1px solid rgba(0, 112, 250, 0.2);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.blm-cta-banner:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 32, 62, 0.25);
}
.blm-cta-banner svg {
    stroke: white;
}
.blm-cta-icon {
    flex-shrink: 0;
}
.blm-cta-text {
    flex: 1;
}
.blm-cta-text strong {
    display: block;
    font-size: 17px;
    margin-bottom: 3px;
    color: #ffffff;
}
.blm-cta-text span {
    font-size: 14px;
    opacity: .85;
}
.blm-cta-link {
    flex-shrink: 0;
    padding: 12px 24px;
    background: #0070FA;
    color: white !important;
    text-decoration: none;
    border-radius: 8px;
    font-weight: 700;
    font-size: 15px;
    white-space: nowrap;
    transition: background .2s;
}
.blm-cta-link:hover {
    background: #0058c8;
    color: white !important;
}
@media (max-width: 600px) {
    .blm-cta-banner {
        flex-direction: column;
        text-align: center;
    }
}

/* ==========================================================================
   USP BADGES FIX - Text overflow in feature list
   ========================================================================== */
.fertighaus-showcase > ul {
    grid-template-columns: repeat(4, 1fr);
}
.fertighaus-showcase > ul li {
    flex-direction: column;
    text-align: center;
    gap: 8px;
    padding: 24px 16px;
}
.fertighaus-showcase > ul li::before {
    align-self: center;
    background: #0070FA;
    color: #ffffff;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.9rem;
    flex-shrink: 0;
}
.fertighaus-showcase > ul li strong {
    font-size: 0.9rem;
}
@media (max-width: 900px) {
    .fertighaus-showcase > ul {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* ==========================================================================
   KUNDENSTIMMEN STATS - Numbers highlighted
   ========================================================================== */
.kundenstimmen ul li {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 28px 20px;
    min-height: 140px;
    border: 1px solid rgba(0, 112, 250, 0.1);
}
.kundenstimmen ul li strong {
    display: block;
    font-size: 2.4rem;
    color: #0070FA;
    margin-bottom: 8px;
    line-height: 1;
}

/* ==========================================================================
   REGION SECTION - Cities as visual tags
   ========================================================================== */
.region-sektion p strong {
    display: inline;
    background: linear-gradient(135deg, #E8F0FE, #dbe8fd);
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 0.92rem;
    line-height: 2.5;
    white-space: nowrap;
}

/* ==========================================================================
   STADTSEITEN / UNTERSEITEN - Layout for non-hero pages
   ========================================================================== */
.no-hero-page .entry-header {
    display: block !important;
    background: #00203E;
    padding: 100px 8% 30px;
    margin: 0;
}
.no-hero-page .entry-header .entry-title {
    color: #ffffff !important;
    font-size: clamp(1.6rem, 4vw, 2.4rem);
    font-weight: 800;
    max-width: 900px;
    margin: 0;
    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.2);
}

/* Content container: readable width + side padding */
.no-hero-page .entry-content {
    max-width: 960px;
    margin: 0 auto;
    padding: 2rem 24px 4rem !important;
}
/* Full-bleed images break out of container */
.no-hero-page .entry-content .wp-block-image,
.no-hero-page .entry-content > figure {
    max-width: 100vw;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}
.no-hero-page .entry-content .wp-block-image img {
    width: 100%;
    height: auto;
}
/* Figcaption centered under full-bleed images */
.no-hero-page .entry-content .wp-block-image figcaption {
    max-width: 960px;
    margin: 0.5rem auto 0;
    padding: 0 24px;
    font-size: 0.85rem;
    color: #888;
    text-align: center;
}
/* Text spacing */
.no-hero-page .entry-content > h2 {
    margin-top: 2.5rem;
    margin-bottom: 1rem;
}
.no-hero-page .entry-content > h3 {
    margin-top: 2rem;
    margin-bottom: 0.8rem;
}
.no-hero-page .entry-content > p {
    margin-bottom: 1.2rem;
}
.no-hero-page .entry-content > ul,
.no-hero-page .entry-content > ol {
    margin-bottom: 1.5rem;
    padding-left: 1.5rem;
}
/* Lead-Magnet banners full-width inside container */
.no-hero-page .entry-content .blm-cta-banner {
    margin-left: 0;
    margin-right: 0;
}
/* FAQ sections readable */
.no-hero-page .entry-content .faq-section {
    margin-top: 2rem;
}
.no-hero-page .entry-content .faq-section h3 {
    margin-top: 1.5rem;
    margin-bottom: 0.5rem;
    color: #00203E;
}
/* Reduce gap after header on stadtseiten */
.no-hero-page .entry-content > div:first-child > figure:first-child {
    margin-top: 0;
}

/* ==========================================================================
   FIX: Astra Featured Image Overflow (horizontal scrollbar)
   ========================================================================== */
.ast-single-post-featured-section,
.ast-article-image-container--wide {
    max-width: 100vw !important;
    overflow: hidden;
}

/* ==========================================================================
   FIX: Hide Astra entry-header on pages with their own hero H1
   ========================================================================== */
.has-hero-section .entry-header {
    display: none !important;
}

/* ==========================================================================
   FIX: Content padding for pages with hero sections
   (Fertighaeuser, Kontakt, Hausplaner, Qualitaet etc.)
   ========================================================================== */
.has-hero-section .entry-content > h2,
.has-hero-section .entry-content > h3,
.has-hero-section .entry-content > h4,
.has-hero-section .entry-content > p,
.has-hero-section .entry-content > ul,
.has-hero-section .entry-content > ol,
.has-hero-section .entry-content > blockquote,
.has-hero-section .entry-content > table,
.has-hero-section .entry-content > .wp-block-table,
.has-hero-section .entry-content > .card-grid,
.has-hero-section .entry-content > .blm-cta-banner,
.has-hero-section .entry-content > div:not([class]),
.has-hero-section .entry-content > .faq-section {
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 24px;
    padding-right: 24px;
}
.has-hero-section .entry-content > ul,
.has-hero-section .entry-content > ol {
    max-width: 960px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-bottom: 1.5rem !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
    list-style: none !important;
}
/* bt-vu-checklist padding auf hero pages: UL hat schon 24px padding,
   daher li padding-left reduzieren damit es nicht zu weit eingerückt ist */
.has-hero-section .entry-content > blockquote {
    max-width: 960px;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 24px;
    padding-right: 24px;
}
.has-hero-section .entry-content > h2 {
    margin-top: 2.5rem;
    margin-bottom: 1rem;
}
.has-hero-section .entry-content > h3 {
    margin-top: 2rem;
    margin-bottom: 0.8rem;
}
.has-hero-section .entry-content > p {
    margin-bottom: 1.2rem;
}
/* Sections: full-width with internal padding (like homepage sections) */
.has-hero-section .entry-content > section {
    max-width: none;
    width: auto;
    padding: 80px 8%;
    margin-top: 0;
    margin-bottom: 0;
}
/* Images and figures: constrained width, no side-padding so image fills edge-to-edge */
.has-hero-section .entry-content > .wp-block-image,
.has-hero-section .entry-content > figure {
    max-width: 912px;
    margin-left: auto;
    margin-right: auto;
    padding: 0;
    margin-top: 2rem;
    margin-bottom: 2rem;
    box-sizing: border-box;
    border-radius: 0;
    overflow: visible;
}
/* Figure images: natural display with rounded corners */
.has-hero-section .entry-content > figure img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 12px;
}
/* Alternating section backgrounds removed (Francesco: graue Balken nicht gewünscht) */

/* ==========================================================================
   FIX: Mobile Horizontal Overflow (11px from Astra header)
   ========================================================================== */
@media (max-width: 544px) {
    html, body {
        overflow-x: hidden;
    }
    .ast-builder-grid-row {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    /* Astra header sections have 40px padding - too much for mobile */
    .site-header-section {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
}

/* ==========================================================================
   MENU SECTION HEADERS (Haustypen, Standorte dividers in dropdown)
   ========================================================================== */
.menu-section-header > a,
.menu-section-header > .menu-link {
    font-weight: 700 !important;
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    color: rgba(255, 255, 255, 0.5) !important;
    pointer-events: none !important;
    cursor: default !important;
    padding-top: 10px !important;
    padding-bottom: 4px !important;
    margin-top: 6px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
}
.menu-section-header:first-child > a,
.menu-section-header:first-child > .menu-link {
    border-top: none !important;
    margin-top: 0 !important;
}
/* Blog single post navigation (Vor/Zurück) */
.single-post .post-navigation {
    max-width: 960px;
    margin: 2rem auto;
    padding: 1.5rem 24px;
}
.single-post .post-navigation .nav-links {
    display: flex;
    justify-content: space-between;
    gap: 2rem;
}
.single-post .post-navigation .nav-links a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 24px;
    background: #f8fafc;
    border-radius: 12px;
    text-decoration: none;
    color: #00203E;
    transition: all 0.3s ease;
    flex: 1;
}
.single-post .post-navigation .nav-links a:hover {
    background: #E8F0FE;
    transform: translateY(-2px);
}
.single-post .post-navigation .nav-links a p {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 600;
    line-height: 1.4;
}
.single-post .post-navigation .nav-links .ast-left-arrow,
.single-post .post-navigation .nav-links .ast-right-arrow {
    font-size: 0.85rem;
    color: #6b7280;
}
@media (max-width: 768px) {
    .single-post .post-navigation .nav-links {
        flex-direction: column;
    }
}

/* Hide the dropdown arrow on section headers */
.menu-section-header .ast-icon {
    display: none !important;
}

/* ==========================================================================
   FIX: Handle entry-header on pages with content H1 (title disabled by PHP).
   - With featured image: hide empty entry-header (featured img provides bridge)
   - Without featured image: show slim navy entry-header as visual bridge
   ========================================================================== */
.no-hero-page.has-content-h1.has-featured-image .entry-header {
    display: none !important;
}
.no-hero-page.has-content-h1:not(.has-featured-image) .entry-header {
    display: block !important;
    background: #00203E;
    padding: 80px 8% 10px;
    margin: 0;
}

/* ==========================================================================
   BLOG ARCHIVE - Navy bridge for fixed header clearance
   ========================================================================== */
.blog .site-content > .ast-container,
.archive .site-content > .ast-container {
    padding-top: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin: 0 !important;
    max-width: 100% !important;
}
.blog #primary,
.archive #primary {
    padding-top: 100px;
    padding-left: 24px;
    padding-right: 24px;
    background: linear-gradient(to bottom, #00203E 0, #00203E 110px, transparent 110px);
}

/* ==========================================================================
   BLOG ARCHIVE - Card-style post grid
   ========================================================================== */
.blog .ast-article-post,
.archive .ast-article-post {
    background: #ffffff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
    transition: all 0.3s ease;
    border: 1px solid rgba(0, 0, 0, 0.04);
}
.blog .ast-article-post:hover,
.archive .ast-article-post:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12);
}
.blog .ast-article-post .post-thumb-img-content img,
.archive .ast-article-post .post-thumb-img-content img {
    border-radius: 16px 16px 0 0;
}
.blog .ast-article-post .entry-header .entry-title a,
.archive .ast-article-post .entry-header .entry-title a {
    color: #00203E;
    text-decoration: none;
    transition: color 0.2s ease;
}
.blog .ast-article-post .entry-header .entry-title a:hover,
.archive .ast-article-post .entry-header .entry-title a:hover {
    color: #0070FA;
}
/* Blog archive H1 for SEO */
.blog .page-title,
.blog .ast-archive-title {
    font-size: clamp(1.6rem, 4vw, 2.4rem);
    color: #00203E;
    font-weight: 800;
    margin-bottom: 2rem;
}
/* Category badges */
.blog .cat-links a,
.archive .cat-links a,
.single-post .cat-links a {
    background: #E8F0FE;
    color: #0070FA;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.blog .cat-links a:hover,
.archive .cat-links a:hover {
    background: #0070FA;
    color: #ffffff;
}

/* ==========================================================================
   SINGLE BLOG POST - Clean reading experience
   ========================================================================== */
.single-post .entry-content {
    max-width: 780px;
    margin: 0 auto;
    padding: 2rem 24px 4rem;
    font-size: 1.05rem;
    line-height: 1.8;
}
.single-post .entry-header {
    text-align: center;
    padding: 80px 24px 2rem;
    max-width: 780px;
    margin: 0 auto;
}
.single-post .entry-header .entry-title {
    font-size: clamp(1.6rem, 4vw, 2.4rem);
    color: #00203E;
    font-weight: 800;
    line-height: 1.25;
}
.single-post .entry-meta {
    color: #888;
    font-size: 0.9rem;
}
.single-post .entry-content blockquote {
    border-left: 4px solid #0070FA;
    background: #f8fafc;
    padding: 1.5rem 2rem;
    margin: 2rem 0;
    border-radius: 0 12px 12px 0;
    font-style: italic;
    color: #555;
}
.single-post .entry-content img {
    border-radius: 12px;
    margin: 1.5rem 0;
}
/* Read more links */
.blog .ast-read-more-container a,
.archive .ast-read-more-container a {
    display: inline-flex;
    align-items: center;
    color: #0070FA;
    font-weight: 600;
    text-decoration: none;
    gap: 6px;
    transition: gap 0.2s ease;
}
.blog .ast-read-more-container a::after,
.archive .ast-read-more-container a::after {
    content: '→';
    transition: transform 0.2s ease;
}
.blog .ast-read-more-container a:hover,
.archive .ast-read-more-container a:hover {
    gap: 10px;
}

/* ==========================================================================
   MU-PLUGIN SECTIONS (Reviews + Netzwerk) - Same width as body text
   ========================================================================== */
.bautent-reviews-section,
.bautent-netzwerk-section {
    max-width: 960px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 24px;
    padding-right: 24px;
}

/* ==========================================================================
   AUTO-SEKTIONIERUNG — Einheitliche Formatierung für alle Seitentypen
   Vom Visual-Upgrade Plugin generierte <section class="bt-vu-auto-section">
   ========================================================================== */
.bt-vu-auto-section {
    padding: 60px 8%;
    margin: 0;
}
.bt-vu-auto-section.bt-vu-section-white {
    background: #ffffff;
}
.bt-vu-auto-section.bt-vu-section-gray {
    background: #f8fafc;
}
/* Content innerhalb Auto-Sektionen: max-width für Lesbarkeit */
.bt-vu-auto-section > h2,
.bt-vu-auto-section > h3,
.bt-vu-auto-section > h4,
.bt-vu-auto-section > p,
.bt-vu-auto-section > ul,
.bt-vu-auto-section > ol,
.bt-vu-auto-section > blockquote,
.bt-vu-auto-section > table,
.bt-vu-auto-section > .wp-block-table,
.bt-vu-auto-section > .bt-vu-faq-section,
.bt-vu-auto-section > .bt-vu-faq-item,
.bt-vu-auto-section > .bt-vu-checklist,
.bt-vu-auto-section > .bt-vu-timeline,
.bt-vu-auto-section > .bt-vu-features-grid,
.bt-vu-auto-section > .bt-vu-foerder-card,
.bt-vu-auto-section > .bt-vu-info-box,
.bt-vu-auto-section > .bt-vu-infobox,
.bt-vu-auto-section > .bt-vu-steps,
.bt-vu-auto-section > .blm-cta-banner,
.bt-vu-auto-section > div:not([class]) {
    max-width: 960px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}
/* H2 in Auto-Sektionen: Konsistentes Styling wie auf Hero-Pages */
.bt-vu-auto-section > h2 {
    margin-top: 0;
    margin-bottom: 1.2rem;
}
.bt-vu-auto-section > h3 {
    margin-top: 1.5rem;
    margin-bottom: 0.8rem;
}
/* Responsive */
@media (max-width: 768px) {
    .bt-vu-auto-section {
        padding: 40px 5%;
    }
}

/* ==========================================================================
   TRUST BADGES BAR - Below hero for social proof
   ========================================================================== */
.trust-badges {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 40px;
    padding: 24px 8%;
    background: #ffffff;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    flex-wrap: wrap;
}
.trust-badge {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.92rem;
    color: #555;
    white-space: nowrap;
}
.trust-badge svg {
    color: #0070FA;
    flex-shrink: 0;
}
.trust-badge strong {
    color: #00203E;
    font-size: 1.1rem;
}
@media (max-width: 768px) {
    .trust-badges {
        gap: 20px;
        padding: 16px 5%;
    }
    .trust-badge {
        font-size: 0.875rem;
    }
}

/* ==========================================================================
   SECTION WAVE DIVIDERS - Premium visual separation
   ========================================================================== */
.section-wave {
    position: relative;
    margin-top: -1px;
}
.section-wave svg {
    display: block;
    width: 100%;
    height: 60px;
}
.section-wave-white svg { fill: #ffffff; }
.section-wave-gray svg { fill: #f8fafc; }
.section-wave-navy svg { fill: #00203E; }

/* ==========================================================================
   SUBTLE BACKGROUND PATTERNS (navy sections)
   ========================================================================== */
.sanierung-services,
.kontakt-cta {
    position: relative;
}
.sanierung-services::after,
.kontakt-cta::after {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background-image: radial-gradient(rgba(255,255,255,0.03) 1px, transparent 1px);
    background-size: 30px 30px;
    pointer-events: none;
    z-index: 0;
}
.sanierung-services > *,
.kontakt-cta > * {
    position: relative;
    z-index: 1;
}

/* ==========================================================================
   IMAGE HOVER EFFECTS
   ========================================================================== */
.entry-content .wp-block-image {
    overflow: hidden;
    border-radius: 12px;
}
.entry-content .wp-block-image img {
    transition: transform 0.5s ease;
}
.entry-content .wp-block-image:hover img {
    transform: scale(1.03);
}
/* Hero images should NOT zoom and NO rounded corners */
.hero-section .wp-block-image,
.hero-section .wp-block-image img {
    border-radius: 0 !important;
}
.hero-section .wp-block-image:hover img {
    transform: none;
}

/* ==========================================================================
   STICKY MOBILE CTA BAR - "Jetzt beraten lassen"
   ========================================================================== */
@media (max-width: 768px) {
    .bt-mobile-cta {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        background: #00203E;
        padding: 12px 16px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        z-index: 998;
        box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.2);
        transform: translateY(0);
        transition: transform 0.3s ease;
    }
    .bt-mobile-cta.hidden {
        transform: translateY(100%);
    }
    .bt-mobile-cta-text {
        color: #ffffff;
        font-size: 0.85rem;
        font-weight: 600;
        line-height: 1.3;
    }
    .bt-mobile-cta-btn {
        background: #0070FA;
        color: #ffffff !important;
        padding: 10px 20px;
        border-radius: 8px;
        font-weight: 700;
        font-size: 0.85rem;
        text-decoration: none;
        white-space: nowrap;
        flex-shrink: 0;
    }
    /* Push footer content up to avoid CTA bar overlap */
    .bt-site-footer {
        padding-bottom: 70px;
    }
    /* Push scroll-to-top button above sticky CTA bar */
    #ast-scroll-top {
        bottom: 80px !important;
    }
}

/* ==========================================================================
   BLOG READING PROGRESS BAR
   ========================================================================== */
.bt-reading-progress {
    position: fixed;
    top: 0;
    left: 0;
    width: 0;
    height: 3px;
    background: linear-gradient(90deg, #0070FA, #00c6ff);
    z-index: 1001;
    transition: width 0.1s ease-out;
}

/* ==========================================================================
   PAGINATION - Styled page numbers
   ========================================================================== */
.ast-pagination .page-numbers {
    background: #E8F0FE;
    color: #00203E;
    border-radius: 8px;
    padding: 8px 14px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.2s ease;
}
.ast-pagination .page-numbers:hover {
    background: #0070FA;
    color: #ffffff;
}
.ast-pagination .page-numbers.current {
    background: #0070FA;
    color: #ffffff;
}

/* ── Contact Form ────────────────────────────── */
.contact-form-wrapper {
    max-width: 800px;
    margin: 0 auto;
}
.bt-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}
.bt-form-field.bt-form-full {
    grid-column: 1 / -1;
}
.bt-form-field label {
    display: block;
    font-weight: 600;
    margin-bottom: 0.4rem;
    color: #1B3A5C;
    font-size: 0.95rem;
}
.bt-form-field input,
.bt-form-field select,
.bt-form-field textarea {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 1rem;
    font-family: inherit;
    box-sizing: border-box;
    transition: border-color 0.2s;
    background: #fff;
}
.bt-form-field select {
    appearance: auto;
    -webkit-appearance: menulist;
    min-height: 48px;
    overflow: visible;
    text-overflow: clip;
    white-space: nowrap;
    padding-right: 30px;
}
.bt-form-field input:focus,
.bt-form-field select:focus,
.bt-form-field textarea:focus {
    outline: none;
    border-color: #0070FA;
    box-shadow: 0 0 0 3px rgba(0, 112, 250, 0.1);
}
.bt-form-privacy {
    font-size: 0.85rem;
    color: #6b7280;
    margin: 1rem 0 0.5rem;
}
.bt-form-submit {
    display: inline-block;
    padding: 14px 40px;
    background: #0070FA;
    color: #fff;
    font-weight: 700;
    font-size: 1.05rem;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.2s;
    font-family: inherit;
}
.bt-form-submit:hover {
    background: #0058c8;
}
.bt-form-submit:disabled {
    background: #94a3b8;
    cursor: not-allowed;
}
@media (max-width: 600px) {
    .bt-form-grid {
        grid-template-columns: 1fr;
    }
}

/* ==========================================================================
   PORTFOLIO / FERTIGHAEUSER-MODELLE SINGLE PAGES
   ========================================================================== */

/* Hide Astra's native post thumbnail (we use hero-section instead) */
.single-us_portfolio .post-thumb-img-content {
    display: none !important;
}

/* Portfolio hero: break out of max-width container (full-bleed) */
.single-us_portfolio .entry-content > .hero-section {
    width: 100vw;
    position: relative;
    left: 50%;
    margin-left: -50vw;
    max-width: none;
    box-sizing: border-box;
}
.hero-portfolio {
    min-height: 45vh;
    padding: 80px 8% 50px;
}

/* Content-Bereich */
.single-us_portfolio .entry-content {
    max-width: 900px;
    margin: 0 auto;
    padding: 2rem 1.5rem;
    font-size: 1.05rem;
    line-height: 1.75;
}
.single-us_portfolio .entry-content h2 {
    font-size: 1.8rem;
    margin: 2.5rem 0 1rem;
    color: #1a1a2e;
}
.single-us_portfolio .entry-content h3 {
    font-size: 1.35rem;
    margin: 2rem 0 0.8rem;
    color: #1a1a2e;
    border-bottom: 2px solid #C8A951;
    padding-bottom: 0.4rem;
}
.single-us_portfolio .entry-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.2rem 0;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}
.single-us_portfolio .entry-content table td {
    padding: 12px 16px;
    border-bottom: 1px solid #e8ecf0;
}
.single-us_portfolio .entry-content table tr:nth-child(even) {
    background: #f8f9fa;
}

/* Grundrisse Sektion */
.grundrisse-section {
    background: #f8f9fa;
    border-radius: 12px;
    padding: 2rem;
    margin: 2rem 0;
}
.grundrisse-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
    margin-top: 1rem;
}
.grundriss-item {
    background: #fff;
    border-radius: 8px;
    padding: 1rem;
    text-align: center;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
}
.grundriss-item img {
    max-width: 100%;
    height: auto;
    border-radius: 4px;
}
.grundriss-item p {
    margin: 0.5rem 0 0;
    font-size: 0.9rem;
    font-weight: 600;
    color: #555;
}

/* Kommentare ausblenden */
.single-us_portfolio .comments-area,
.single-us_portfolio .comment-respond,
.single-us_portfolio #comments {
    display: none !important;
}

/* Prev/Next Navigation styling */
.single-us_portfolio .post-navigation {
    max-width: 900px !important;
    margin: 2rem auto !important;
    padding: 1.5rem 3rem !important;
    --ast-post-nav-space: 3rem;
}

/* Grundriss Lightbox */
.grundriss-item {
    cursor: zoom-in;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.grundriss-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
}
.grundriss-lightbox {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 10000;
    background: rgba(0,0,0,0.85);
    justify-content: center;
    align-items: center;
    cursor: zoom-out;
    padding: 2rem;
}
.grundriss-lightbox.active {
    display: flex;
}
.grundriss-lightbox img {
    max-width: 90vw;
    max-height: 90vh;
    object-fit: contain;
    border-radius: 8px;
    box-shadow: 0 8px 40px rgba(0,0,0,0.4);
}
.grundriss-lightbox .lightbox-close {
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    width: 40px;
    height: 40px;
    background: rgba(255,255,255,0.15);
    border: none;
    border-radius: 50%;
    color: #fff;
    font-size: 1.5rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s;
}
.grundriss-lightbox .lightbox-close:hover {
    background: rgba(255,255,255,0.3);
}

/* Intro-Paragraph (erster Absatz) */
.single-us_portfolio .entry-content > p:first-child {
    font-size: 1.08rem;
    color: #444;
    line-height: 1.8;
}

@media (max-width: 768px) {
    .hero-portfolio {
        min-height: 35vh;
        padding: 60px 6% 40px;
    }
    .single-us_portfolio .entry-content {
        padding: 1.5rem 1rem;
    }
    .grundrisse-grid {
        grid-template-columns: 1fr;
    }
}

/* ==========================================================================
   TABELLEN - Einheitliches Design fuer alle Seiten
   Gleiche Breite/Abstaende wie der Fliesstext
   ========================================================================== */
.entry-content table {
    width: 100%;
    max-width: 900px;
    border-collapse: collapse;
    margin: 1.5rem auto !important;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
    font-size: 0.95rem;
    line-height: 1.6;
}
.entry-content table thead th,
.entry-content table th {
    background: #00203E;
    color: #fff;
    font-weight: 600;
    padding: 12px 16px;
    text-align: left;
    font-size: 0.9rem;
    letter-spacing: 0.02em;
}
.entry-content table td {
    padding: 12px 16px;
    border-bottom: 1px solid #e8ecf0;
    color: #333;
}
.entry-content table tr:nth-child(even) {
    background: #f8f9fa;
}
.entry-content table tr:hover {
    background: #eef3fb;
}
.entry-content table td strong {
    color: #00203E;
}
@media (max-width: 768px) {
    .entry-content table {
        font-size: 0.88rem;
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        max-width: 100%;
        background:
            linear-gradient(to right, white 30%, transparent),
            linear-gradient(to left, white 30%, transparent),
            linear-gradient(to right, rgba(0,0,0,.15), transparent 70%),
            linear-gradient(to left, rgba(0,0,0,.15), transparent 70%);
        background-position: left center, right center, left center, right center;
        background-repeat: no-repeat;
        background-size: 20px 100%, 20px 100%, 10px 100%, 10px 100%;
        background-attachment: local, local, scroll, scroll;
    }
    .entry-content table th,
    .entry-content table td {
        padding: 10px 12px;
        white-space: normal;
        min-width: 80px;
    }
}
/* ==========================================================================
   MOBILE: Standorte-Footer besser lesbar + Touch-Targets
   ========================================================================== */
@media (max-width: 768px) {
    #bt-standorte-footer {
        font-size: 0.88rem !important;
        line-height: 2.2 !important;
    }
    #bt-standorte-footer a {
        padding: 4px 2px;
    }
    /* Datenschutz-Checkbox besser lesbar */
    .bt-form-privacy,
    .bt-form-privacy label {
        font-size: 0.88rem !important;
    }
    /* FAQ-Pfeil grösser */
    .entry-content details summary::marker,
    .faq-toggle {
        font-size: 14px;
    }
    /* Cookie-Banner kompakter auf Mobile */
    .cmplz-cookiebanner .cmplz-body {
        font-size: 13px !important;
        line-height: 1.4 !important;
        padding: 12px 16px !important;
        max-height: 40vh;
        overflow-y: auto;
    }
    .cmplz-cookiebanner .cmplz-message {
        font-size: 13px !important;
        margin-bottom: 8px !important;
    }
    .cmplz-cookiebanner .cmplz-buttons {
        padding: 8px 16px 12px !important;
    }
    /* Model gallery: 1 column on mobile */
    .bt-model-gallery {
        grid-template-columns: 1fr !important;
    }
    /* Stats grid: stack on mobile */
    .bt-stats-grid {
        grid-template-columns: 1fr !important;
    }
}

/* ==========================================================================
   FIX: Lead-Magnet Banner text = gleich wie Fließtext
   ========================================================================== */
.blm-cta-banner .blm-cta-text strong {
    font-size: inherit !important;
}
.blm-cta-banner .blm-cta-text span {
    font-size: inherit !important;
    opacity: 1 !important;
}

/* ==========================================================================
   FIX: Listen + FAQ auf gleicher Flucht wie Absatztext
   UL-Bullets hängen links im Padding-Bereich, Text bündig mit <p>
   ========================================================================== */

/* UL: Kein Padding, keine Standard-Bullets
   Zweiter Selector überschreibt die hero-section Regel (Zeile ~1783) mit gleicher Spezifität.
   Checklisten + Timelines ausgenommen (haben eigene Styles im visual-upgrade Plugin). */
.entry-content ul:not(.bt-vu-checklist):not(.bt-vu-timeline),
.has-hero-section .entry-content > ul:not(.bt-vu-checklist):not(.bt-vu-timeline) {
    padding-left: 0 !important;
    list-style: none !important;
}
/* OL: Minimales Padding für Ziffern */
.entry-content ol:not(.bt-vu-timeline),
.has-hero-section .entry-content > ol:not(.bt-vu-timeline) {
    padding-left: 1.5em !important;
    list-style: decimal outside !important;
}
/* LI-Text bündig mit Absätzen, Bullet hängt links im padding-Bereich.
   Nicht auf Checklisten/Timelines/Leistungen (eigene ::before Icons). */
.entry-content ul:not(.bt-vu-checklist):not(.bt-vu-timeline):not(.bt-vu-leistungen) > li {
    display: flex;
    align-items: center;
    gap: 0.6em;
    margin-bottom: 0.5em;
    font-size: inherit;
    line-height: 1.6;
}
.entry-content ul:not(.bt-vu-checklist):not(.bt-vu-timeline):not(.bt-vu-leistungen) > li::before {
    content: "\2713";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #059669;
    color: #fff;
    font-weight: bold;
    font-size: 14px;
    flex-shrink: 0;
}
.entry-content ol:not(.bt-vu-timeline) > li {
    margin-bottom: 0.5em;
    font-size: inherit;
    line-height: 1.6;
}

/* FAQ-Section: Kein Extra-Padding in Blog-Posts (entry-content hat bereits padding) */
.single-post .entry-content > .bt-vu-faq-section {
    padding-left: 0 !important;
    padding-right: 0 !important;
}
