:root{--paper:#f4f2ec;--ink:#242924;--sage:#526657;--oak:#b47845;--white:#fff;--line:#d9d7cf}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',sans-serif}a{color:inherit;text-decoration:none}.header{height:96px;padding:0 5vw;display:flex;align-items:center;gap:36px;background:#f8f7f2;position:sticky;top:0;z-index:20;border-bottom:1px solid rgba(0,0,0,.06)}.brand{display:flex;flex-direction:column;line-height:1;margin-right:auto}.brand strong{font:40px/1 'Instrument Serif',serif;letter-spacing:.02em}.brand span{text-transform:uppercase;font-size:9px;letter-spacing:.23em;color:var(--oak);margin-top:8px}.header nav{display:flex;gap:29px;font-size:14px}.header nav a:hover{color:var(--oak)}.header-cta{border:1px solid var(--sage);padding:13px 21px;font-weight:600}.menu{display:none}.hero{min-height:760px;position:relative;display:flex;align-items:center;overflow:hidden}.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,25,21,.86) 0%,rgba(20,25,21,.64) 31%,rgba(20,25,21,.07) 60%,rgba(20,25,21,0) 100%)}.hero-copy{position:relative;color:#fff;width:650px;margin-left:7vw;padding:80px 0}.eyebrow{text-transform:uppercase;letter-spacing:.24em;font-size:12px;font-weight:600;color:#d49a68}.eyebrow:after{content:'';display:block;width:54px;height:1px;background:currentColor;margin-top:18px}.eyebrow.dark{color:var(--oak)}h1,h2,h3{font-family:'Instrument Serif',serif;font-weight:400;margin:0}h1{font-size:84px;line-height:.95;letter-spacing:-.025em;margin:36px 0 28px}h1 em,h2 em{font-weight:400;color:#d49a68}.hero-copy>p:not(.eyebrow){font-size:19px;line-height:1.7;max-width:590px;color:rgba(255,255,255,.86)}.actions{display:flex;gap:13px;margin-top:34px}.button{display:inline-flex;align-items:center;justify-content:center;padding:17px 25px;font-size:14px;font-weight:600}.primary{background:var(--sage);color:white}.primary:hover{background:#3f5145}.ghost{border:1px solid rgba(255,255,255,.65);color:#fff}.intro{padding:120px 7vw 75px;display:grid;grid-template-columns:1fr 1fr;gap:10vw}.intro h2,.feature h2,.about h2,.contact h2,.detail-grid h2{font-size:56px;line-height:1.04;margin-top:28px}.lead{font:27px/1.55 'Instrument Serif',serif;margin-top:55px}.services{display:grid;grid-template-columns:repeat(4,1fr);padding:0 5vw 120px}.service{padding:38px 30px;border-top:1px solid var(--line);border-right:1px solid var(--line);min-height:330px;transition:.25s}.service:first-child{border-left:1px solid var(--line)}.service:hover{background:#fff;transform:translateY(-4px)}.service span{font-size:12px;color:var(--oak)}.service h3{font-size:34px;margin:52px 0 18px}.service p{font-size:14px;line-height:1.7;color:#5f655f}.service b{font-size:12px;display:block;margin-top:30px;color:var(--sage)}.feature{display:grid;grid-template-columns:1.1fr .9fr;min-height:740px;background:#e9e7df}.feature-photo{background:url('rensma-hero.png') center/cover}.feature-copy{padding:100px 8vw 80px}.feature-copy p:not(.eyebrow){line-height:1.8;color:#5d635e}.feature-copy ul{list-style:none;padding:0;margin:30px 0}.feature-copy li{padding:13px 0;border-bottom:1px solid #cbc9c1}.feature-copy li:before{content:'✓';color:var(--oak);margin-right:12px}.text-link{display:inline-block;margin-top:15px;color:var(--sage);font-weight:600}.detail-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line)}.detail-grid article{background:var(--paper);padding:90px 5vw}.detail-grid h2{font-size:40px;margin:27px 0}.detail-grid p:last-child{line-height:1.8;color:#626762}.about{background:var(--sage);color:#fff;padding:120px 7vw;display:grid;grid-template-columns:1fr 1fr;gap:10vw}.about>div:last-child>p{font-size:19px;line-height:1.8;color:rgba(255,255,255,.82)}.facts{display:flex;gap:35px;margin-top:48px}.facts span{font-size:12px;text-transform:uppercase;letter-spacing:.1em}.facts b{display:block;font:36px 'Instrument Serif',serif;text-transform:none;letter-spacing:0}.contact{padding:120px 7vw;display:grid;grid-template-columns:1fr 1fr;gap:10vw}.contact>div>p:not(.eyebrow){line-height:1.8;max-width:570px}.contact-actions{padding-top:55px}.outline{border:1px solid var(--sage);color:var(--sage);margin-left:10px}.contact-actions p{font-size:13px;margin-top:28px;color:#656a65}footer{background:#202520;color:white;padding:55px 5vw;display:flex;align-items:end;gap:50px}footer .brand{margin-right:auto}footer .brand span{color:#d49a68}footer p{font-size:11px;color:rgba(255,255,255,.55)}
@media(max-width:900px){.header{height:78px}.header nav{display:none;position:absolute;top:78px;left:0;right:0;background:#f8f7f2;padding:25px 5vw;flex-direction:column}.nav-open .header nav{display:flex}.menu{display:block;border:0;background:none}.header-cta{display:none}.brand strong{font-size:33px}.hero{min-height:700px}.hero-shade{background:linear-gradient(90deg,rgba(20,25,21,.86),rgba(20,25,21,.42))}.hero-copy{width:auto;margin:0 6vw;padding-top:110px}h1{font-size:58px}.intro,.about,.contact{grid-template-columns:1fr;gap:25px;padding:85px 6vw}.intro h2,.feature h2,.about h2,.contact h2{font-size:44px}.lead{margin-top:0}.services{grid-template-columns:1fr 1fr;padding:0 5vw 85px}.feature{grid-template-columns:1fr}.feature-photo{height:420px}.feature-copy{padding:75px 7vw}.detail-grid{grid-template-columns:1fr}.detail-grid article{padding:70px 7vw}.facts{flex-wrap:wrap}footer{align-items:start;flex-direction:column;gap:18px}}
@media(max-width:560px){.hero{min-height:680px}.hero>img{object-position:58% center}.hero-shade{background:rgba(20,25,21,.61)}h1{font-size:48px}.hero-copy>p:not(.eyebrow){font-size:16px}.actions{flex-direction:column;align-items:stretch}.services{grid-template-columns:1fr}.service{border-left:1px solid var(--line)}.service h3{margin-top:25px}.feature-photo{height:300px}.contact-actions .button{display:flex;margin:8px 0}.detail-grid h2{font-size:35px}footer{padding:45px 6vw}}

/* Strak Rensma-woordmerk */
.brand{display:flex;align-items:center;line-height:1;margin-right:auto}
.brand strong{font:600 27px/1 'DM Sans',sans-serif;letter-spacing:.18em}
.brand span{display:none}
@media(max-width:900px){.brand strong{font-size:24px}}

/* Groter hoofdmerk met goudaccent */
.header .brand strong{font-size:35px;letter-spacing:.2em}
.header .brand:after{content:'';width:34px;height:2px;background:linear-gradient(90deg,#bd7b28,#e4bd69);margin-left:13px}
footer .brand strong{font-size:32px;color:#e2b65b}

/* Donkere merkkaarten, geïnspireerd op de KRM-huisstijl */
.brand-services{gap:12px;background:#f4f2ec}
.brand-service{position:relative;overflow:hidden;background:radial-gradient(circle at 50% 15%,#20242a,#0b0e12 68%);border:0!important;color:#fff;min-height:410px;padding:30px}
.brand-service:hover{background:radial-gradient(circle at 50% 15%,#2a2e34,#0d1014 70%);transform:translateY(-6px)}
.brand-service:after{content:'';position:absolute;inset:0;border:1px solid rgba(222,177,86,.25);pointer-events:none}
.brand-service>span{color:#d9a84f;letter-spacing:.18em}
.service-mark{height:190px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;margin:12px 0 2px}
.service-mark strong{font:600 37px/1 'DM Sans',sans-serif;letter-spacing:.09em;color:#fff}
.service-mark strong em{font-style:normal;color:#d9a84f}
.service-mark small{margin-top:14px;text-transform:uppercase;letter-spacing:.24em;font-size:10px;color:#d9a84f}
.service-mark i{display:block;position:relative;width:68px;height:39px;margin-bottom:20px;border:3px solid #d9a84f;border-top:0}
.service-mark i:before,.service-mark i:after{content:'';position:absolute;top:-20px;width:49px;height:3px;background:#d9a84f}
.service-mark i:before{left:-5px;transform:rotate(-28deg)}
.service-mark i:after{right:-5px;transform:rotate(28deg)}
.service-mark .spray-line{border-radius:50%;border:3px solid #d9a84f;width:48px;height:48px}
.service-mark .spray-line:before{width:28px;left:39px;top:11px;transform:none;box-shadow:7px 10px 0 #d9a84f,0 20px 0 #d9a84f}
.service-mark .spray-line:after{display:none}
.service-mark .cabinet-line{border:3px solid #d9a84f;width:58px;height:52px}
.service-mark .cabinet-line:before{width:3px;height:46px;left:25px;top:0;transform:none}
.service-mark .cabinet-line:after{display:none}
.service-mark .bolt-line{border:0;width:36px;height:54px;background:#d9a84f;clip-path:polygon(48% 0,100% 0,65% 38%,94% 38%,25% 100%,43% 53%,7% 53%)}
.service-mark .bolt-line:before,.service-mark .bolt-line:after{display:none}
.brand-service p{color:rgba(255,255,255,.7);margin-top:14px}
.brand-service b{color:#d9a84f;margin-top:24px}
@media(max-width:900px){.header .brand strong{font-size:28px}.brand-services{gap:10px}.brand-service{min-height:390px}}

/* Lichtere, warm grijsgroene merkkaarten */
.brand-service{background:radial-gradient(circle at 50% 12%,#68746b,#3f4a43 72%)}
.brand-service:hover{background:radial-gradient(circle at 50% 12%,#748078,#49564e 72%)}
.brand-service:after{border-color:rgba(231,193,111,.42)}
.brand-service p{color:rgba(255,255,255,.82)}
