/*
Theme Name: WKS Bouwservice
Description: Eigen WKS Bouwservice website op Astra.
Author: iCrossMedia
Template: astra
Version: 0.1.9
Text Domain: wks-bouwservice
*/
:root{--wks-ink:#14243b;--wks-blue:#0078ff;--wks-light:#f2f7ff;--wks-muted:#425572;--wks-line:#d8e5f4}
*,*::before,*::after{box-sizing:border-box}
body.wks-site{margin:0;background:#fff;color:var(--wks-ink);font-family:Arial,Helvetica,sans-serif;line-height:1.6}
.wks-site a{color:inherit}.wks-site a:focus-visible,.wks-site button:focus-visible{outline:3px solid var(--wks-blue);outline-offset:3px}
.wks-wrap{max-width:1240px;margin:0 auto;padding:0 28px}
.wks-header{background:#fff;border-bottom:1px solid var(--wks-line);position:relative;z-index:5}
.wks-header-inner{min-height:155px;display:flex;align-items:center;gap:32px;justify-content:space-between}
.wks-brand{text-decoration:none;display:flex;align-items:center;gap:13px;min-width:0}
.wks-brand-mark{display:inline-grid;place-items:center;width:48px;height:48px;border-radius:8px;background:var(--wks-ink);font-size:18px;font-weight:900;letter-spacing:-2px;color:#fff}
.wks-brand-name{font-size:16px;letter-spacing:.08em;font-weight:800;text-transform:uppercase;white-space:nowrap}.wks-logo{display:block;width:300px;max-width:100%;height:auto}
.wks-menu{display:flex;flex-wrap:wrap;align-items:center;gap:26px;list-style:none;margin:0;padding:0;font-size:14px;font-weight:700}
.wks-menu li{margin:0}.wks-menu a{text-decoration:none}.wks-menu a:hover,.wks-menu .current-menu-item>a{color:var(--wks-blue)}
.wks-nav-toggle{display:none;border:1px solid var(--wks-line);background:white;border-radius:5px;padding:9px 12px;font-weight:700}
.wks-button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:10px 22px;background:var(--wks-blue);color:#fff!important;text-decoration:none;font-weight:750;border-radius:5px;transition:background .2s}
.wks-button:hover{background:#075aa5}.wks-button-ghost{background:transparent;border:1px solid #aab9c6;color:var(--wks-ink)!important}
.wks-hero{background:linear-gradient(115deg,#0b1a34,#123467);color:white;padding:108px 0 120px;overflow:hidden;position:relative}
.wks-hero::after{content:"";position:absolute;right:-140px;bottom:-320px;width:680px;height:680px;border:110px solid rgba(8,116,213,.22);transform:rotate(30deg);pointer-events:none}
.wks-hero .wks-wrap{position:relative;z-index:1}.wks-eyebrow{color:#69b8fc;text-transform:uppercase;letter-spacing:.17em;font-size:13px;font-weight:800}
.wks-hero h1{max-width:880px;font-size:clamp(42px,6.4vw,84px);letter-spacing:-.055em;line-height:1.06;margin:18px 0 26px}
.wks-hero p{max-width:660px;font-size:clamp(17px,2vw,21px);color:#d5e2ea;margin:0 0 32px}
.wks-section{padding:84px 0}.wks-section-alt{background:var(--wks-light)}
.wks-section h2{font-size:clamp(31px,4vw,48px);letter-spacing:-.04em;line-height:1.13;margin:12px 0 15px}
.wks-intro{max-width:680px;color:var(--wks-muted);font-size:18px;margin:0 0 32px}
.wks-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.wks-card{background:#fff;border:1px solid var(--wks-line);border-radius:7px;padding:30px;min-height:235px;box-shadow:0 10px 35px rgba(14,39,59,.035)}
.wks-card .wks-number{font-size:13px;font-weight:800;color:var(--wks-blue)}
.wks-card h3{font-size:23px;margin:28px 0 8px;line-height:1.2}.wks-card p{margin:0;color:var(--wks-muted)}
.wks-split{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.wks-visual{min-height:390px;background:linear-gradient(135deg,#11366c,#0078ff);border-radius:7px;position:relative;overflow:hidden}
.wks-visual:before,.wks-visual:after{content:"";position:absolute;width:65%;height:65%;border:32px solid rgba(255,255,255,.13);transform:rotate(-35deg)}
.wks-visual:before{top:-20%;left:-12%}.wks-visual:after{right:-20%;bottom:-20%}
.wks-page{padding:74px 0 110px;min-height:58vh}.wks-page h1{font-size:clamp(37px,5vw,64px);letter-spacing:-.05em;line-height:1.1;margin:0 0 30px}
.wks-content{max-width:820px}.wks-content p,.wks-content li{font-size:18px}.wks-content a{color:var(--wks-blue)}
.wks-cta{background:var(--wks-ink);color:#fff}.wks-cta .wks-intro{color:#d1dce5}
.wks-subhero{padding:88px 0 94px;background:var(--wks-ink);color:#fff}.wks-subhero h1{font-size:clamp(44px,6vw,76px);letter-spacing:-.055em;line-height:1.08;margin:14px 0 22px}.wks-subhero p{max-width:690px;color:#d7e2eb;font-size:20px;margin:0}
.wks-service-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.wks-service-panel{border:1px solid var(--wks-line);border-radius:8px;padding:42px;background:#fff;min-height:250px}.wks-service-panel span{color:var(--wks-blue);font-size:13px;letter-spacing:.12em;font-weight:800}.wks-service-panel h2{margin:20px 0 12px;font-size:34px}.wks-service-panel p{color:var(--wks-muted);margin:0;font-size:18px}
.wks-footer{background:#0b1730;color:#d6e2e9;padding:45px 0}.wks-footer-inner{display:flex;justify-content:space-between;align-items:center;gap:25px;flex-wrap:wrap}
.wks-footer strong{color:#fff}.wks-footer a{color:#d6e2e9}.wks-footer small{color:#b9c8d2}
/* Astra typography and page-menu fallback must not override WKS contrast/navigation. */
body.wks-site .wks-hero h1,body.wks-site .wks-subhero h1,body.wks-site .wks-cta h2{color:#fff!important}
body.wks-site .wks-nav ul,body.wks-site .wks-nav .page_item,body.wks-site .wks-nav .menu-item{list-style:none;margin:0;padding:0}
body.wks-site .wks-nav .menu>ul,body.wks-site .wks-nav .wks-menu{display:flex;align-items:center;gap:26px}
body.wks-site .wks-nav a{font-weight:700;text-decoration:none;color:var(--wks-ink)}
body.wks-site .wks-nav a:hover,body.wks-site .wks-nav .current_page_item>a{color:var(--wks-blue)}
body.wks-site .ast-scroll-to-top,body.wks-site #ast-scroll-top{display:none!important}
@media(max-width:800px){.wks-header-inner{min-height:76px}.wks-nav-toggle{display:inline-block}.wks-nav{display:none;position:absolute;top:100%;left:0;right:0;background:white;padding:18px 28px 25px;border-bottom:1px solid var(--wks-line)}.wks-nav.is-open{display:block}body.wks-site .wks-nav .menu>ul,body.wks-site .wks-nav .wks-menu{display:grid;gap:17px}.wks-grid,.wks-split{grid-template-columns:1fr}.wks-split{gap:30px}.wks-hero{padding:78px 0 90px}.wks-section{padding:62px 0}.wks-visual{min-height:260px}}
@media(max-width:420px){.wks-wrap{padding:0 20px}.wks-brand-name{font-size:13px}.wks-brand-mark{width:42px;height:42px;font-size:15px}}
@media(max-width:800px){.wks-service-list{grid-template-columns:1fr}.wks-service-panel{min-height:0;padding:30px}.wks-subhero{padding:65px 0 72px}}
.wks-contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}.wks-contact-grid h2{margin:14px 0 18px}.wks-contact-card{padding:36px;background:#fff;border:1px solid var(--wks-line);border-radius:8px;box-shadow:0 10px 35px rgba(14,39,59,.035)}.wks-contact-card h2{font-size:30px;margin:0 0 20px}.wks-contact-item{display:grid;gap:5px;padding:16px 0;border-top:1px solid var(--wks-line)}.wks-contact-item strong{font-size:13px;text-transform:uppercase;letter-spacing:.1em;color:var(--wks-muted)}.wks-contact-item a{color:#075aa5;text-decoration:underline;text-underline-offset:3px}.wks-contact-item address{font-style:normal}
@media(max-width:800px){.wks-contact-grid{grid-template-columns:1fr;gap:24px}.wks-contact-card{padding:26px}}
@media(max-width:800px){.wks-header-inner{min-height:116px}.wks-logo{width:210px}}
@media(max-width:420px){.wks-logo{width:185px}}
/* Keep the mobile navigation label visible when Astra supplies button defaults. */
@media(max-width:800px){body.wks-site .wks-header button.wks-nav-toggle{display:inline-flex!important;align-items:center;justify-content:center;gap:9px;flex:none;min-width:96px;min-height:44px;margin:0;padding:8px 12px;border:1px solid #0078ff;border-radius:6px;background:#fff!important;color:#14243b!important;font-family:Arial,Helvetica,sans-serif;font-size:15px;font-weight:700;line-height:1.2;letter-spacing:0;text-indent:0;opacity:1;visibility:visible;box-shadow:none}body.wks-site .wks-header button.wks-nav-toggle .wks-menu-label{display:inline!important;color:#14243b!important;font-size:15px;line-height:1;opacity:1;visibility:visible;text-transform:none}.wks-menu-icon{display:grid;gap:3px}.wks-menu-icon span{display:block;width:17px;height:2px;background:#0078ff;border-radius:2px}body.wks-site .wks-header button.wks-nav-toggle:hover{background:#f2f7ff!important}body.wks-site .wks-header button.wks-nav-toggle:focus-visible{outline:3px solid #0078ff;outline-offset:2px}}
/* Use the same accessible menu control on desktop and mobile. */
.wks-menu-icon{display:grid;gap:3px}.wks-menu-icon span{display:block;width:17px;height:2px;background:#0078ff;border-radius:2px}
@media(min-width:801px){body.wks-site .wks-header button.wks-nav-toggle{display:inline-flex!important;align-items:center;justify-content:center;gap:9px;flex:none;min-width:96px;min-height:44px;margin:0;padding:8px 12px;border:1px solid #0078ff;border-radius:6px;background:#fff!important;color:#14243b!important;font-family:Arial,Helvetica,sans-serif;font-size:15px;font-weight:700;line-height:1.2;letter-spacing:0;text-indent:0;opacity:1;visibility:visible;box-shadow:none}body.wks-site .wks-header button.wks-nav-toggle .wks-menu-label{display:inline!important;color:#14243b!important;font-size:15px;line-height:1;opacity:1;visibility:visible;text-transform:none}body.wks-site .wks-header button.wks-nav-toggle:hover{background:#f2f7ff!important}body.wks-site .wks-header button.wks-nav-toggle:focus-visible{outline:3px solid #0078ff;outline-offset:2px}body.wks-site .wks-nav{display:none;position:absolute;top:calc(100% - 10px);right:max(28px,calc((100vw - 1184px)/2));width:min(320px,calc(100vw - 56px));padding:18px 24px;background:#fff;border:1px solid var(--wks-line);border-radius:7px;box-shadow:0 12px 28px rgba(14,39,59,.14)}body.wks-site .wks-nav.is-open{display:block}body.wks-site .wks-nav .menu>ul,body.wks-site .wks-nav .wks-menu{display:grid;gap:14px}body.wks-site .wks-nav a{display:block;padding:5px 0}}
.wks-services-hero{min-height:450px;display:flex;align-items:center;background-image:linear-gradient(90deg,rgba(7,21,41,.88) 0%,rgba(7,21,41,.67) 38%,rgba(7,21,41,.04) 80%),url('assets/diensten-overzicht.webp');background-size:cover;background-position:center 54%;background-repeat:no-repeat}.wks-services-hero .wks-wrap{width:100%}.wks-services-hero .wks-eyebrow{color:#8ac8ff}.wks-services-hero p{max-width:570px}
@media(max-width:800px){.wks-services-hero{min-height:410px;background-image:linear-gradient(90deg,rgba(7,21,41,.9),rgba(7,21,41,.57)),url('assets/diensten-overzicht.webp');background-position:66% center}}
.wks-project-proof{background:#fff}.wks-before-after{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:34px}.wks-before-after figure{margin:0;background:#0b1730;border-radius:8px;overflow:hidden;box-shadow:0 12px 34px rgba(14,39,59,.1)}.wks-before-after img{display:block;width:100%;height:390px;object-fit:cover}.wks-before-after figcaption{display:flex;align-items:center;gap:14px;padding:18px 22px;color:#fff}.wks-before-after figcaption span{color:#69b8fc;font-size:13px;font-weight:800;letter-spacing:.12em}.wks-before-after figcaption strong{font-size:17px}
@media(max-width:800px){.wks-before-after{grid-template-columns:1fr}.wks-before-after img{height:auto;aspect-ratio:14/9}.wks-services-hero{background-position:58% center}}
