/*
Theme Name: Van Spijkeren Modern
Author: OpenAI
Description: Moderne, luxe WordPress-uitwerking voor Bouwbedrijf Van Spijkeren.
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
*/
:root{--ink:#202722;--cream:#f5f2eb;--paper:#fffdf9;--gold:#b69a69;--muted:#646962;--max:1240px}*{box-sizing:border-box}body{margin:0;font-family:Arial,sans-serif;color:var(--ink);background:var(--paper);line-height:1.65}a{color:inherit;text-decoration:none}.wrap{width:min(var(--max),calc(100% - 40px));margin:auto}.site-header{background:#fffdf9;border-bottom:1px solid #e5e1d8}.header-inner{min-height:82px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand img{width:230px;max-height:70px;object-fit:contain}.main-nav ul{display:flex;gap:22px;list-style:none;margin:0;padding:0;font-size:13px;font-weight:bold}.main-nav a:hover{color:#9a7d4d}.button{display:inline-block;background:var(--ink);color:white!important;padding:13px 19px;font-size:12px;font-weight:bold;border:1px solid var(--ink)}.button-gold{background:var(--gold);border-color:var(--gold)}.menu-toggle{display:none}.hero{min-height:570px;display:flex;align-items:center;position:relative;color:white;background:#31372f url('assets/hero-bouwproject.jpg') center/cover no-repeat}.hero:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,19,16,.84),rgba(15,19,16,.48) 48%,rgba(15,19,16,.08))}.hero-content{position:relative;padding:80px 0;max-width:720px}.eyebrow{text-transform:uppercase;letter-spacing:.22em;font-size:11px;font-weight:bold;color:var(--gold);margin:0 0 15px}.hero .eyebrow{color:#e0c89e}.hero h1,.page-hero h1{font-family:Georgia,serif;font-weight:normal;letter-spacing:-.04em;font-size:clamp(42px,6vw,74px);line-height:1.04;margin:0 0 20px}.hero p{font-size:18px;max-width:540px;color:#f0eee9}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:25px}.section{padding:75px 0}.section-cream{background:var(--cream)}.section-head{display:flex;align-items:end;justify-content:space-between;gap:35px;margin-bottom:30px}.section h2,.section-head h2{font-family:Georgia,serif;font-weight:normal;font-size:clamp(32px,4vw,48px);line-height:1.12;margin:0}.section-head>p{max-width:440px;color:var(--muted)}.service-grid,.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.service-card{background:white;border:1px solid #e8e4db}.service-image{height:205px;background:linear-gradient(135deg,#aaa18f,#e7ddcc);overflow:hidden}.service-image img{width:100%;height:100%;object-fit:cover}.project-placeholder{height:205px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#aaa18f,#e7ddcc);color:#67665d;font-size:11px;text-transform:uppercase;letter-spacing:.1em}.service-body{padding:22px}.service-body h3,.project-body h3{font:normal 25px Georgia,serif;margin:0 0 8px}.service-body p,.project-body p{font-size:14px;color:var(--muted)}.text-link{color:#96794a;font-size:12px;font-weight:bold}.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}.intro-grid p{color:var(--muted)}.intro-panel{background:linear-gradient(0deg,rgba(20,25,21,.78),rgba(20,25,21,.1)),url('assets/hero-bouwproject.jpg') center/cover;min-height:300px;padding:35px;display:flex;align-items:end;color:white}.intro-panel p{font:normal 28px/1.25 Georgia,serif;color:white}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:35px}.step{border-top:1px solid var(--gold);padding-top:16px}.step span{font-size:11px;color:#96794a;font-weight:bold;letter-spacing:.12em}.step h3{font:normal 22px Georgia,serif}.step p{font-size:14px;color:var(--muted)}.cta-band{background:var(--ink);color:white;padding:55px 0}.cta-inner{display:flex;align-items:center;justify-content:space-between;gap:25px}.cta-inner h2{font:normal 40px Georgia,serif;margin:0}.cta-inner p{color:#d5d8d2}.site-footer{background:#171c18;color:#f7f4ed;padding:42px 0 20px}.footer-top,.footer-bottom{display:flex;justify-content:space-between;gap:25px}.footer-top{padding-bottom:25px;border-bottom:1px solid #3a403b}.footer-brand{font:normal 25px Georgia,serif}.footer-links{display:flex;gap:18px;flex-wrap:wrap;font-size:13px}.footer-bottom{padding-top:16px;color:#b9beb8;font-size:11px}.page-hero{background:var(--ink);color:white;padding:70px 0}.page-hero p{max-width:650px;color:#d6d8d3}.content-area{padding:60px 0}.content-area p{max-width:800px}.contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:45px}.contact-details{background:var(--cream);padding:28px}.contact-form label{display:block;font-size:13px;font-weight:bold;margin-bottom:5px}.contact-form input,.contact-form textarea,.contact-form select{width:100%;padding:12px;border:1px solid #d7d4cc;margin-bottom:16px;background:white}.contact-form textarea{min-height:130px}.notice,.empty-note{padding:16px;background:var(--cream);margin-bottom:20px;color:var(--muted)}@media(max-width:1000px){.header-inner{flex-wrap:wrap;padding:10px 0}.brand img{width:200px}.menu-toggle{display:block;background:none;border:0;font-size:24px}.main-nav{display:none;width:100%;order:3}.main-nav.is-open{display:block}.main-nav ul{flex-direction:column;gap:6px;padding:12px 0}.header-cta{display:none}.service-grid,.project-grid{grid-template-columns:repeat(2,1fr)}.steps{grid-template-columns:repeat(2,1fr)}}@media(max-width:650px){.hero{min-height:540px}.hero h1{font-size:45px}.section{padding:55px 0}.section-head,.cta-inner,.footer-top,.footer-bottom{align-items:flex-start;flex-direction:column}.service-grid,.project-grid,.intro-grid,.contact-grid{grid-template-columns:1fr}.steps{grid-template-columns:1fr 1fr}.page-hero{padding:50px 0}.page-hero h1{font-size:42px}}
