/* Moderne vormgeving - Tuinwerken Leysen */

html { scroll-behavior: smooth; }
/* Vangnet: pagina wordt altijd zichtbaar, ook als een script niet laadt */
@keyframes leysenShowTemplate { to { visibility: visible; } }
.template { animation: leysenShowTemplate 0s linear 2.5s forwards; }
body { -webkit-tap-highlight-color: transparent; }

/* Moderner lettertype voor gewone tekst (was Impact) */
body .textnormal { font-family: 'Poppins', 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; }
body .template .contact-form-text-style-div { font-family: 'Poppins', 'Open Sans', Helvetica, Arial, sans-serif !important; }

/* ---------- Navigatiebalk op computer ---------- */
body:not(.mobileMenu) #wsb-mobile-header {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: 76px !important;
    padding: 0 max(24px, calc((100% - 1002px) / 2));
    background: rgba(255, 255, 255, 0.96);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06), 0 8px 24px rgba(0, 0, 0, 0.06);
    z-index: 5000;
}
body:not(.mobileMenu) #wsb-mobile-header #MobileHeader_container {
    position: static !important;
    display: flex !important;
    align-items: center;
    width: auto !important;
    height: 76px !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
}
body:not(.mobileMenu) #wsb-mobile-header .MobileHeader_logo__VBlNX,
body:not(.mobileMenu) #wsb-mobile-header .MobileHeader_logoAnchor__3VO33 {
    display: flex !important;
    align-items: center;
    position: static !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}
body:not(.mobileMenu) #wsb-mobile-header .MobileHeader_logoImage__BZwGs {
    display: block !important;
    height: 46px !important;
    width: auto !important;
    max-width: none !important;
    border-radius: 8px;
    content: url("https://impro.usercontent.one/appid/oneComWsb/domain/tuinwerkenleysen.be/media/tuinwerkenleysen.be/onewebmedia/Leysen%20Ken-02.png?withoutEnlargement&resize=86,58");
}
body:not(.mobileMenu) #wsb-mobile-header #mm {
    display: block !important;
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    max-height: none !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    visibility: visible !important;
    opacity: 1 !important;
}
body:not(.mobileMenu) #wsb-mobile-header #mm ul {
    display: flex !important;
    align-items: center;
    gap: 6px;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none;
}
body:not(.mobileMenu) #wsb-mobile-header #mm li { list-style: none; margin: 0 !important; padding: 0 !important; border: 0 !important; }
body:not(.mobileMenu) #wsb-mobile-header #mm a {
    display: block !important;
    padding: 10px 20px !important;
    border: 0 !important;
    border-radius: 999px;
    background: transparent !important;
    color: #3c3c3c !important;
    font-family: 'Poppins', 'Open Sans', Helvetica, Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none;
    transition: background-color 0.2s ease, color 0.2s ease;
}
body:not(.mobileMenu) #wsb-mobile-header #mm a:hover { background: rgba(101, 103, 57, 0.12) !important; color: #656739 !important; }
body:not(.mobileMenu) #wsb-mobile-header #mm a.MobileHeaderMenu_current__2Nelz { background: #656739 !important; color: #fff !important; }
body:not(.mobileMenu) #wsb-mobile-header #mm-overlay,
body:not(.mobileMenu) #wsb-mobile-header #MobileHeader_burgerMenuIcon,
body:not(.mobileMenu) #wsb-mobile-header .MobileHeader_dummyMenuIconContainer__3mfi4 { display: none !important; }
/* ruimte onder de vaste navigatiebalk */
body:not(.mobileMenu) .template #Header > div { min-height: 76px !important; }

/* ---------- Dienstenkaart ---------- */
body .template div[data-kind="Block"][data-id="EB2E3282-50E3-4AB9-8638-0D8221771CF5"] > .BackgroundPreview_backgroundComponent__3Dr5e {
    border-radius: 24px !important;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35);
}
body .template div[data-id="DFFFB63E-EC93-40C2-AE80-84ECD0AC3541"] .image-container {
    box-shadow: 0 0 0 5px #fff, 0 10px 24px rgba(0, 0, 0, 0.25);
}
body .template div[data-id="34F6B667-14B9-493A-A065-22827642C077"] li::marker { color: #989b40; }
body .template div[data-id="34F6B667-14B9-493A-A065-22827642C077"] span { letter-spacing: 0.03em; }

/* ---------- Koppen op de fotobanden ---------- */
body .template h2.textheading2 {
    letter-spacing: 0.1em;
    text-shadow: 0 4px 18px rgba(0, 0, 0, 0.35);
}

/* ---------- Contactgegevens ---------- */
body .template div[data-kind="ADDRESS"] a,
body .template div[data-kind="EMAIL"] a,
body .template div[data-kind="PHONE"] a { transition: opacity 0.2s ease, transform 0.2s ease; }
body .template div[data-kind="ADDRESS"] a:hover,
body .template div[data-kind="EMAIL"] a:hover,
body .template div[data-kind="PHONE"] a:hover { opacity: 0.75; }
body .template .svgContainer a:hover { transform: translateY(-2px); }

/* ---------- Contactformulier ---------- */
body .template .contactFormContainer.Main {
    background: #fff;
    border-radius: 20px;
    padding: 24px !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.18);
}
body .template .contactFormContainer.Black {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 20px;
    padding: 24px !important;
}
body .template .contactFormContainer .FieldContainerStyles_label__38Z4h {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
body .template .contactFormContainer .View_input__1iF1T.View_input__1iF1T {
    height: 46px !important;
    padding: 10px 14px !important;
    border: 1px solid rgba(0, 0, 0, 0.14) !important;
    border-radius: 12px !important;
    background: #fff !important;
    color: #212121;
    font-family: 'Poppins', 'Open Sans', Helvetica, Arial, sans-serif !important;
    font-size: 15px !important;
    -webkit-appearance: none;
    appearance: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
body .template .contactFormContainer textarea.View_input__1iF1T.View_textArea__2s1mo { height: 140px !important; resize: vertical; }
body .template .contactFormContainer .View_input__1iF1T.View_input__1iF1T:focus {
    outline: none;
    border-color: #656739 !important;
    box-shadow: 0 0 0 3px rgba(152, 155, 64, 0.35);
}
body .template .contactFormContainer .contact-form-submit-btn.contact-form-submit-btn {
    min-height: 46px !important;
    padding: 12px 34px !important;
    border-radius: 999px !important;
    font-family: 'Poppins', 'Open Sans', Helvetica, Arial, sans-serif !important;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    -webkit-appearance: none;
    appearance: none;
    transition: background-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}
body .template .contactFormContainer .contact-form-submit-btn.contact-form-submit-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
}

/* ---------- Telefoon / smartphone ---------- */
body.mobileMenu #wsb-mobile-header #MobileHeader_container { box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08) !important; }
body.mobileMenu #wsb-mobile-header #mm a {
    font-family: 'Poppins', 'Open Sans', Helvetica, Arial, sans-serif !important;
    font-weight: 500 !important;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding-left: 28px !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
body.mobileMenu #wsb-mobile-header #mm a.MobileHeaderMenu_current__2Nelz { color: #656739 !important; }

body .template.mobileV div[data-kind="Block"][data-id="EB2E3282-50E3-4AB9-8638-0D8221771CF5"] > .BackgroundPreview_backgroundComponent__3Dr5e {
    padding: 28px 22px 24px !important;
    border-radius: 20px !important;
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.3);
}
body .template.mobileV div[data-kind="Block"][data-id="6E3E564F-CB8D-496C-8129-18DA007270A6"] > .BackgroundPreview_backgroundComponent__3Dr5e {
    padding: 12px 0 !important;
}
body .template.mobileV h2.textheading2 { letter-spacing: 0.08em; }
body .template.mobileV .contactFormContainer.Main,
body .template.mobileV .contactFormContainer.Black { padding: 20px 18px !important; border-radius: 18px; }
body .template.mobileV .contactFormContainer .View_input__1iF1T.View_input__1iF1T { font-size: 16px !important; }
body .template.mobileV .contactFormContainer .contact-form-submit-btn.contact-form-submit-btn { width: 100% !important; }
