/* Boomcadeau Landing Page - Theme Overrides
   Reset any conflicting theme styles */

/* Hide header and navigation on boomcadeau page (page ID: 7454) */
body.page-id-7454.page-template-default header.header,
body.page-id-7454.page-template-default .header,
body.page-id-7454.page-template-default .header-logo-row,
body.page-id-7454.page-template-default .header-menu-row,
body.page-id-7454 header,
body.page-id-7454 nav,
body.page-id-7454 .site-header,
body.page-id-7454 .main-navigation,
body.page-id-7454 .header,
body.page-id-7454 #header,
body.page-id-7454 #masthead,
body.page-id-7454 .top-bar,
body.page-id-7454 .menu-wrapper,
body.page-id-7454 #site-navigation,
body.page-id-7454 .navbar,
body.page-id-7454 .elementor-location-header,
body.page-id-7454 .logo-holder,
body.page-id-7454 .thb-full-menu,
body.page-id-7454 .thb-mobile-menu,
body.page-id-7454 .thb-secondary-area,
body.page-id-7454 .header-menu-row {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
}

/* Also hide footer on landing page for cleaner look */
body.page-id-7454 footer,
body.page-id-7454 .site-footer,
body.page-id-7454 #footer,
body.page-id-7454 #colophon,
body.page-id-7454 .elementor-location-footer {
    display: none !important;
}

/* Remove padding/margin from body and main content */
body.page-id-7454 {
    margin: 0 !important;
    padding: 0 !important;
}

body.page-id-7454 #content,
body.page-id-7454 .site-content,
body.page-id-7454 main,
body.page-id-7454 #main {
    padding: 0 !important;
    margin: 0 !important;
}

/* Reset body and wrapper styles for landing page templates */
body.page-template-template-boomcadeau-fullwidth,
body.page-template-template-boomcadeau-fullwidth * {
    box-sizing: border-box;
}

body.page-template-template-boomcadeau-fullwidth {
    margin: 0 !important;
    padding: 0 !important;
}

/* Remove all theme wrappers and containers */
body.page-template-template-boomcadeau-fullwidth .site-header,
body.page-template-template-boomcadeau-fullwidth .site-footer,
body.page-template-template-boomcadeau-fullwidth .page-header,
body.page-template-template-boomcadeau-fullwidth .entry-header,
body.page-template-template-boomcadeau-fullwidth .breadcrumbs,
body.page-template-template-boomcadeau-fullwidth .sidebar,
body.page-template-template-boomcadeau-fullwidth nav {
    display: none !important;
}

body.page-template-template-boomcadeau-fullwidth .site-content,
body.page-template-template-boomcadeau-fullwidth #primary,
body.page-template-template-boomcadeau-fullwidth .content-area,
body.page-template-template-boomcadeau-fullwidth main,
body.page-template-template-boomcadeau-fullwidth article {
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}

/* Reset conflicting grid/flex from theme - but preserve WPBakery rows */
body.page-template-template-boomcadeau-fullwidth section:not(.bb-hero-section):not(.bb-testimonial-section):not(.bb-benefits-section) {
    display: block !important;
}

/* Hero section - Custom grid layout (not WPBakery default) */
body.page-id-7454 .bb-hero-section > .vc_row,
body.page-template-template-boomcadeau-fullwidth .bb-hero-section > div:first-child {
    display: grid !important;
    grid-template-columns: 1.3fr 0.7fr !important;
    min-height: 100vh !important;
}

/* Hero kolommen worden grid items, niet flex */
body.page-id-7454 .bb-hero-section > .vc_row > .vc_column_container,
body.page-template-template-boomcadeau-fullwidth .bb-hero-section > div > .vc_column_container {
    width: auto !important;
    flex: none !important;
}

body.page-id-7454 .bb-hero-section .bb-hero-left {
    clip-path: polygon(0 0, 100% 0, 92% 100%, 0 100%) !important;
}

/* Testimonial section - Skewed effect */
body.page-id-7454 .bb-testimonial-section,
body.page-template-template-boomcadeau-fullwidth .bb-testimonial-section {
    transform: skewY(-2deg) !important;
    margin-top: -100px !important;
}

body.page-id-7454 .bb-testimonial-section > .vc_row,
body.page-id-7454 .bb-testimonial-section > div:not(.vc_row),
body.page-template-template-boomcadeau-fullwidth .bb-testimonial-section > div {
    transform: skewY(2deg) !important;
    display: grid !important;
    grid-template-columns: 1.2fr 0.8fr !important;
    gap: 80px !important;
}

/* Testimonial kolommen worden grid items */
body.page-id-7454 .bb-testimonial-section > .vc_row > .vc_column_container,
body.page-template-template-boomcadeau-fullwidth .bb-testimonial-section > div > .vc_column_container {
    width: auto !important;
    flex: none !important;
}

/* Benefits section - Extreme broken grid */
body.page-id-7454 .bb-benefits-section > .vc_row,
body.page-template-template-boomcadeau-fullwidth .bb-benefits-section > div > div {
    display: grid !important;
    grid-template-columns: repeat(12, 1fr) !important;
    gap: 35px !important;
}

/* Benefits kolommen gebruiken grid-column positioning */
body.page-id-7454 .bb-benefits-section > .vc_row > .vc_column_container,
body.page-template-template-boomcadeau-fullwidth .bb-benefits-section .bb-benefit {
    width: auto !important;
    flex: none !important;
}

/* Timeline section - Number + content grid */
body.page-id-7454 .bb-timeline-section .bb-timeline-step,
body.page-template-template-boomcadeau-fullwidth .bb-timeline-step {
    display: grid !important;
    grid-template-columns: 120px 1fr !important;
    gap: 60px !important;
    margin-bottom: 60px !important;
}

/* Vision section - Diagonal clip */
body.page-id-7454 .bb-vision-section,
body.page-template-template-boomcadeau-fullwidth .bb-vision-section {
    clip-path: polygon(0 8%, 100% 0, 100% 92%, 0 100%) !important;
    margin: -100px 0 !important;
}

/* Gift section - Asymmetric split */
body.page-id-7454 .bb-gift-section > .vc_row,
body.page-id-7454 .bb-gift-section > div > div,
body.page-template-template-boomcadeau-fullwidth .bb-gift-section > div > div {
    display: grid !important;
    grid-template-columns: 0.9fr 1.1fr !important;
    gap: 100px !important;
}

/* Gift kolommen worden grid items */
body.page-id-7454 .bb-gift-section > .vc_row > .vc_column_container,
body.page-template-template-boomcadeau-fullwidth .bb-gift-section > div > div > .vc_column_container {
    width: auto !important;
    flex: none !important;
}

/* Fix image in gift section - ensure proper sizing */
body.page-id-7454 .bb-gift-section .bb-gift-visual,
body.page-template-template-boomcadeau-fullwidth .bb-gift-section .bb-gift-visual {
    width: 100% !important;
    aspect-ratio: auto !important;
    background: transparent !important;
    display: block !important;
}

body.page-id-7454 .bb-gift-section .bb-gift-visual img,
body.page-template-template-boomcadeau-fullwidth .bb-gift-section .bb-gift-visual img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
    object-fit: cover !important;
}

/* Default: Ensure other WPBakery rows display properly with flex */
body.page-id-7454 .vc_row,
body.page-template-template-boomcadeau-fullwidth .vc_row {
    display: flex !important;
    flex-wrap: wrap !important;
}

/* Ensure WPBakery columns display side-by-side */
body.page-id-7454 .wpb_column,
body.page-id-7454 .vc_column_container,
body.page-template-template-boomcadeau-fullwidth .wpb_column,
body.page-template-template-boomcadeau-fullwidth .vc_column_container {
    display: flex !important;
    flex-direction: column !important;
}

/* WPBakery column widths */
body.page-id-7454 .vc_col-sm-6,
body.page-template-template-boomcadeau-fullwidth .vc_col-sm-6 {
    width: 50% !important;
    flex: 0 0 50% !important;
}

body.page-id-7454 .vc_col-sm-4,
body.page-template-template-boomcadeau-fullwidth .vc_col-sm-4 {
    width: 33.333% !important;
    flex: 0 0 33.333% !important;
}

body.page-id-7454 .vc_col-sm-8,
body.page-template-template-boomcadeau-fullwidth .vc_col-sm-8 {
    width: 66.666% !important;
    flex: 0 0 66.666% !important;
}

body.page-id-7454 .vc_col-sm-5,
body.page-template-template-boomcadeau-fullwidth .vc_col-sm-5 {
    width: 41.666% !important;
    flex: 0 0 41.666% !important;
}

body.page-id-7454 .vc_col-sm-7,
body.page-template-template-boomcadeau-fullwidth .vc_col-sm-7 {
    width: 58.333% !important;
    flex: 0 0 58.333% !important;
}

/* Ensure sections take full width */
body.page-template-template-boomcadeau-fullwidth .bb-hero-section,
body.page-template-template-boomcadeau-fullwidth .bb-testimonial-section,
body.page-template-template-boomcadeau-fullwidth .bb-benefits-section,
body.page-template-template-boomcadeau-fullwidth .bb-timeline-section,
body.page-template-template-boomcadeau-fullwidth .bb-vision-section,
body.page-template-template-boomcadeau-fullwidth .bb-cta-explosion,
body.page-template-template-boomcadeau-fullwidth .bb-gift-section,
body.page-template-template-boomcadeau-fullwidth .bb-faq-section {
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
}

/* Force correct font loading */
body.page-template-template-boomcadeau-fullwidth {
    font-family: 'DM Sans', sans-serif !important;
}

body.page-template-template-boomcadeau-fullwidth .bb-hero-title,
body.page-template-template-boomcadeau-fullwidth .bb-section-heading,
body.page-template-template-boomcadeau-fullwidth .bb-floating-card-text,
body.page-template-template-boomcadeau-fullwidth .bb-testimonial-text blockquote,
body.page-template-template-boomcadeau-fullwidth .bb-benefit h3,
body.page-template-template-boomcadeau-fullwidth .bb-step-content h3,
body.page-template-template-boomcadeau-fullwidth .bb-metric-number,
body.page-template-template-boomcadeau-fullwidth .bb-stat-box-number,
body.page-template-template-boomcadeau-fullwidth .bb-cta-explosion h2 {
    font-family: 'Fraunces', serif !important;
}

/* Reset any theme link styles that might conflict */
body.page-template-template-boomcadeau-fullwidth a.bb-cta-primary,
body.page-template-template-boomcadeau-fullwidth a.bb-cta-secondary {
    text-decoration: none !important;
}

/* Ensure proper z-index layering */
body.page-template-template-boomcadeau-fullwidth .blob {
    z-index: 1 !important;
}

body.page-template-template-boomcadeau-fullwidth .bb-hero-left,
body.page-template-template-boomcadeau-fullwidth .bb-hero-right {
    z-index: 3 !important;
    position: relative !important;
}

/* Mobile responsive overrides */
@media (max-width: 1024px) {
    /* Hero - stack columns */
    body.page-id-7454 .bb-hero-section > .vc_row,
    body.page-template-template-boomcadeau-fullwidth .bb-hero-section > div {
        grid-template-columns: 1fr !important;
    }

    body.page-id-7454 .bb-hero-section .bb-hero-left {
        clip-path: none !important;
    }

    /* Testimonial - stack columns */
    body.page-id-7454 .bb-testimonial-section > .vc_row,
    body.page-id-7454 .bb-testimonial-section > div:not(.vc_row),
    body.page-template-template-boomcadeau-fullwidth .bb-testimonial-section > div {
        grid-template-columns: 1fr !important;
    }

    /* Benefits - stack all to single column */
    body.page-id-7454 .bb-benefits-section > .vc_row,
    body.page-template-template-boomcadeau-fullwidth .bb-benefits-section > div > div {
        grid-template-columns: 1fr !important;
    }

    body.page-id-7454 .bb-benefits-section .bb-benefit,
    body.page-id-7454 .bb-benefits-section > .vc_row > .vc_column_container,
    body.page-template-template-boomcadeau-fullwidth .bb-benefits-section > div > div > div {
        grid-column: 1 / -1 !important;
    }

    /* Timeline - stack number and content */
    body.page-id-7454 .bb-timeline-section .bb-timeline-step,
    body.page-template-template-boomcadeau-fullwidth .bb-timeline-step {
        grid-template-columns: 1fr !important;
        gap: 30px !important;
    }

    body.page-id-7454 .bb-timeline-section .bb-step-number,
    body.page-template-template-boomcadeau-fullwidth .bb-step-number {
        margin: 0 auto !important;
    }

    /* Vision - remove clip path */
    body.page-id-7454 .bb-vision-section,
    body.page-template-template-boomcadeau-fullwidth .bb-vision-section {
        clip-path: none !important;
    }

    /* Gift - stack columns */
    body.page-id-7454 .bb-gift-section > .vc_row,
    body.page-id-7454 .bb-gift-section > div > div,
    body.page-template-template-boomcadeau-fullwidth .bb-gift-section > div > div {
        grid-template-columns: 1fr !important;
    }

    /* Stack WPBakery columns on mobile (for other sections) */
    body.page-id-7454 .vc_row,
    body.page-template-template-boomcadeau-fullwidth .vc_row {
        flex-direction: column !important;
    }

    body.page-id-7454 .vc_col-sm-6,
    body.page-id-7454 .vc_col-sm-4,
    body.page-id-7454 .vc_col-sm-8,
    body.page-id-7454 .vc_col-sm-5,
    body.page-id-7454 .vc_col-sm-7,
    body.page-template-template-boomcadeau-fullwidth .vc_col-sm-6,
    body.page-template-template-boomcadeau-fullwidth .vc_col-sm-4,
    body.page-template-template-boomcadeau-fullwidth .vc_col-sm-8,
    body.page-template-template-boomcadeau-fullwidth .vc_col-sm-5,
    body.page-template-template-boomcadeau-fullwidth .vc_col-sm-7 {
        width: 100% !important;
        flex: 0 0 100% !important;
    }
}
