@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;600;700;800&display=swap');:root{--bg:#111315;--panel:#1b1d1f;--gold:#d5a85a;--text:#f7f4ed;--muted:#c4c1bb}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:'DM Sans',Arial,sans-serif;line-height:1.65}a{color:inherit;text-decoration:none}header{background:#111315ee;position:sticky;top:0;z-index:10;border-bottom:1px solid #36332e}.nav{max-width:1180px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:17px 22px;gap:20px}.brand{font:800 18px Manrope,sans-serif;line-height:1.2}.brand span{display:block;color:var(--gold);font-size:12px;letter-spacing:.17em}nav{display:flex;gap:19px;flex-wrap:wrap}nav a:hover,.accent{color:var(--gold)}.btn{display:inline-block;background:var(--gold);color:#17130e;font-weight:800;padding:13px 22px;border-radius:4px}.btn.outline{border:1px solid var(--gold);background:transparent;color:var(--gold)}.hero{min-height:530px;display:flex;align-items:center;background:linear-gradient(105deg,#111315 20%,#111315d8 63%,#11131588),radial-gradient(circle at 80% 45%,#80613a 0%,#232323 55%);border-bottom:1px solid #39342d}.wrap{max-width:1180px;margin:auto;padding:72px 22px}.hero .wrap{width:100%}.eyebrow{text-transform:uppercase;letter-spacing:.2em;color:var(--gold);font-weight:800;font-size:12px}h1,h2,h3{font-family:Manrope,sans-serif;line-height:1.18}h1{font-size:clamp(37px,6vw,68px);max-width:820px;margin:16px 0}h2{font-size:clamp(28px,4vw,40px)}.lead{font-size:19px;color:var(--muted);max-width:690px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.tile{background:var(--panel);padding:29px;border:1px solid #393939;border-radius:7px}.tile h3{margin:10px 0}.tile p,.muted{color:var(--muted)}.tile .arrow{color:var(--gold);font-weight:800}.band{background:#211d17;border-block:1px solid #50402b}.band .wrap{display:flex;justify-content:space-between;align-items:center;gap:20px}.placeholder{border:1px dashed #76674f;border-radius:7px;background:linear-gradient(135deg,#2e2b28,#16191b);min-height:190px;display:flex;align-items:center;justify-content:center;color:#c9bca7;text-align:center;padding:20px}.foot{border-top:1px solid #333;background:#0c0d0e;padding:35px 22px;color:#aaa}.foot .inner{max-width:1180px;margin:auto}.formline{display:grid;grid-template-columns:1fr 1fr;gap:12px}input,textarea{width:100%;padding:13px;background:#242628;color:white;border:1px solid #555;border-radius:4px;font:inherit}label{display:block;margin:10px 0}textarea{min-height:130px}.small{font-size:13px;color:#bbb}@media(max-width:750px){.nav{align-items:flex-start;flex-direction:column}nav{gap:12px;font-size:13px}.grid{grid-template-columns:1fr}.band .wrap{display:block}.formline{grid-template-columns:1fr}.wrap{padding:48px 20px}}
/* Origineel bedrijfslogo */
.brand{display:flex;align-items:center;flex-shrink:0}.brand img{display:block;width:150px;height:90px;object-fit:contain;object-position:center}.nav{padding-top:6px;padding-bottom:6px}@media(max-width:750px){.brand img{width:125px;height:75px}}

/* Fotoportfolio: zwart en goud */
.hero-photo{background:linear-gradient(90deg,rgba(8,9,10,.94),rgba(8,9,10,.64) 56%,rgba(8,9,10,.28)),url('fotos/home-steellook-20261009.webp') center 45%/cover no-repeat}
.photo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:32px 0}
.photo-card{margin:0;background:#1b1d1f;border:1px solid #3c3427;border-radius:7px;overflow:hidden}
.photo-card img{display:block;width:100%;height:270px;object-fit:cover}
.photo-card figcaption{padding:12px 16px;color:#d5a85a;font-size:14px;font-weight:700}
@media(max-width:760px){.photo-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.photo-card img{height:175px}.photo-card figcaption{font-size:12px;padding:8px}.hero-photo{background-position:62% center}}

/* Luxe architecturale homepage */
:root{--bg:#0b0b0b;--panel:#111111;--gold:#d6a747;--text:#faf8f4;--muted:#d0c9c1}
body{background:#0b0b0b}.nav{max-width:1500px;padding:9px 28px;gap:26px}.brand img{display:block;width:210px;height:75px;object-fit:contain;object-position:left center}header{background:#090909}.header-contact{display:flex;gap:18px;align-items:center;font-size:12px;white-space:nowrap}.header-contact a:hover{color:var(--gold)}nav a{font-size:12px;text-transform:uppercase;letter-spacing:.08em}nav a:first-child{color:var(--gold)}.hero-photo{min-height:600px;background:linear-gradient(90deg,rgba(0,0,0,.92),rgba(0,0,0,.74) 30%,rgba(0,0,0,.15) 76%),url('fotos/home-steellook-20261009.webp') center 45%/cover no-repeat}.hero-inner{max-width:1500px;padding:95px 6% 100px}.hero h1{font-family:Georgia,serif;font-weight:400;font-size:clamp(48px,5.3vw,86px);line-height:.98;letter-spacing:-.045em;margin:24px 0}.hero h1 em{font-style:normal;color:var(--gold)}.hero .lead{font-size:17px;max-width:510px;color:#f0ebe4;line-height:1.55}.gold-rule{width:52px;height:2px;background:var(--gold);margin:22px 0}.btn{border-radius:2px;font-size:12px;letter-spacing:.04em;text-transform:uppercase}.btn:hover{filter:brightness(1.15)}.services-home{max-width:1500px;padding-top:60px}.services-home h2{font-family:Georgia,serif;font-weight:400}.service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:25px}.service-card{display:block;background:#111;border:1px solid #26221b;transition:transform .2s}.service-card:hover{transform:translateY(-4px);border-color:var(--gold)}.service-card img{width:100%;height:200px;object-fit:cover;display:block}.service-copy{padding:22px}.service-copy h3{font-size:18px;font-weight:500;margin:0 0 8px}.service-copy p{color:#c6c0b7;font-size:14px;min-height:45px;margin:0 0 12px}.service-copy span{color:var(--gold);font-size:13px}.craft{display:grid;grid-template-columns:1.15fr 1fr;align-items:center;background:#0f0f0f;margin:40px auto}.craft-photo img{display:block;width:100%;height:470px;object-fit:cover}.craft-copy{padding:65px 9%;max-width:670px}.craft-copy h2{font-family:Georgia,serif;font-weight:400;font-size:clamp(34px,4vw,58px);line-height:1.06}.craft-copy p{color:var(--muted)}.portfolio-preview{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:30px 0}.portfolio-preview img{display:block;width:100%;height:240px;object-fit:cover}.portfolio-preview a:hover img{filter:brightness(1.15)}
@media(max-width:1100px){.header-contact{display:none}.nav{flex-wrap:wrap}.service-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.brand img{width:160px;height:65px}.nav{padding:8px 16px;gap:4px}nav{width:100%;justify-content:space-between;gap:6px}nav a{font-size:10px}.hero-photo{min-height:600px;background-position:55% center}.hero-inner{padding:90px 20px}.hero h1{font-size:clamp(43px,11vw,65px)}.hero .lead{font-size:15px}.service-grid{grid-template-columns:1fr 1fr;gap:10px}.service-card img{height:125px}.service-copy{padding:13px}.service-copy h3{font-size:14px}.service-copy p{font-size:12px;min-height:75px}.craft{grid-template-columns:1fr}.craft-photo img{height:300px}.craft-copy{padding:45px 25px}.portfolio-preview{grid-template-columns:repeat(2,1fr);gap:10px}.portfolio-preview img{height:155px}}

/* Nieuwe goedgekeurde luxe-uitstraling */
.hero-photo{background-image:linear-gradient(90deg,rgba(0,0,0,.96) 0%,rgba(0,0,0,.85) 24%,rgba(0,0,0,.25) 70%,rgba(0,0,0,.08)),url('fotos/home-steellook-20261009.webp');background-position:center center;background-size:cover;min-height:625px}
.hero-inner{padding-top:105px;padding-bottom:105px}
.hero h1{max-width:760px;text-shadow:0 2px 24px #000a}
.service-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.service-card img{height:225px}
.service-copy{min-height:170px}
header .brand img{width:210px;height:75px;object-fit:contain}
@media(max-width:800px){.hero-photo{background-position:64% center}.service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.header-contact{display:none}}
@media(max-width:520px){.hero-photo{background-image:linear-gradient(90deg,rgba(0,0,0,.93),rgba(0,0,0,.62)),url('fotos/home-steellook-20261009.webp');min-height:610px}.hero-inner{padding-top:70px;padding-bottom:70px}.service-card img{height:130px}.service-copy{min-height:190px}.hero h1{font-size:44px}}

.service-image img{display:block;width:100%;height:100%;min-height:290px;object-fit:cover;border-radius:6px}

/* Nieuwe hoofdfoto - desktop en mobiel */
.hero.hero-photo{background-image:linear-gradient(90deg,rgba(0,0,0,.88),rgba(0,0,0,.57) 45%,rgba(0,0,0,.16)),url('fotos/home-steellook-20261009.webp');background-position:center center;background-size:cover}
@media(max-width:520px){.hero.hero-photo{background-image:linear-gradient(90deg,rgba(0,0,0,.85),rgba(0,0,0,.54)),url('fotos/home-steellook-20261009.webp');background-position:53% center}}
.seo-local{padding-top:35px;padding-bottom:40px}.seo-local p{max-width:900px;line-height:1.8}

/* Definitieve homefoto */
.hero.hero-photo{background-image:linear-gradient(90deg,rgba(0,0,0,.86),rgba(0,0,0,.48) 48%,rgba(0,0,0,.12)),url("fotos/home-steellook-20261009.webp");background-size:cover;background-position:center center;}
@media(max-width:700px){.hero.hero-photo{background-image:linear-gradient(90deg,rgba(0,0,0,.82),rgba(0,0,0,.48)),url("fotos/home-steellook-20261009.webp");background-position:50% center;}}

/* Offerteformulier */
form select { width:100%; padding:14px; background:#181818; color:#f5f5f5; border:1px solid #777; border-radius:5px; font:inherit; margin-top:8px; }
form select:focus { outline:2px solid #c9a25c; outline-offset:2px; }
