/*
Theme Name: Atlas Vloeren
Theme URI: https://atlasvloeren.be
Author: Atlas Vloeren
Description: Premium black and gold one-page WordPress theme for Atlas Vloeren.
Version: 1.0.0
Text Domain: atlas-vloeren
*/
:root{
  --bg:#050607;--panel:#0c0d0f;--panel2:#111316;--gold:#c99027;--gold2:#f0bd55;
  --text:#f7f7f4;--muted:#a8aaad;--line:#25282d;--green:#25D366;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,Arial,sans-serif;line-height:1.55}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{width:min(1180px,calc(100% - 40px));margin:auto}
.header{position:sticky;top:0;z-index:50;background:rgba(5,6,7,.92);backdrop-filter:blur(14px);border-bottom:1px solid rgba(201,144,39,.22)}
.nav{height:86px;display:flex;align-items:center;gap:28px}
.brand img{width:145px;max-height:72px;object-fit:contain}
.menu{display:flex;gap:24px;margin-left:auto;font-size:13px;text-transform:uppercase;letter-spacing:.08em}
.menu a:hover{color:var(--gold2)}
.actions{display:flex;gap:10px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:13px 20px;border:1px solid var(--gold);font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.05em}
.btn.gold{background:linear-gradient(135deg,var(--gold2),#a96c0c);color:#090909;border:none}
.btn.whatsapp{border-color:#2b7f42}
.btn.whatsapp:before{content:"●";color:var(--green)}
.hero{min-height:690px;display:grid;grid-template-columns:1fr 1.25fr;border-bottom:1px solid var(--line)}
.hero-copy{padding:110px 7vw 80px max(4vw,30px);display:flex;flex-direction:column;justify-content:center;background:radial-gradient(circle at 0 25%,#18130a 0,transparent 38%)}
.eyebrow{color:var(--gold2);font-size:13px;letter-spacing:.16em;text-transform:uppercase;font-weight:800}
h1{font-size:clamp(42px,5.2vw,78px);line-height:.98;margin:18px 0 25px;letter-spacing:-.04em}
h1 span{color:var(--gold2)}
.lead{font-size:18px;color:#d1d2d4;max-width:650px;margin-bottom:30px}
.hero-buttons{display:flex;gap:12px;flex-wrap:wrap}
.trust{display:flex;gap:28px;margin-top:52px;flex-wrap:wrap}
.trust-item b{display:block;color:var(--gold2);font-size:21px}.trust-item span{color:var(--muted);font-size:12px}
.hero-image{min-height:620px;background:
linear-gradient(90deg,var(--bg) 0%,transparent 28%),
linear-gradient(0deg,rgba(0,0,0,.25),rgba(0,0,0,.08)),
url('assets/images/project-bathroom.jpg') center/cover no-repeat}
.section{padding:90px 0}
.section-head{text-align:center;margin-bottom:42px}
.section-head .eyebrow{display:block}.section-head h2{font-size:42px;margin:10px 0 8px}.section-head p{color:var(--muted);max-width:700px;margin:auto}
.services{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.card{background:var(--panel);border:1px solid var(--line);overflow:hidden}
.card img{height:220px;width:100%;object-fit:cover;transition:.35s}
.card:hover img{transform:scale(1.035)}
.card-body{padding:20px}.card h3{margin:0 0 8px;font-size:18px}.card p{margin:0;color:var(--muted);font-size:14px}
.icon{color:var(--gold2);font-size:24px;margin-bottom:8px}
.projects{display:grid;grid-template-columns:repeat(12,1fr);gap:12px}
.project{position:relative;overflow:hidden;min-height:290px;background:#111}
.project:nth-child(1),.project:nth-child(4){grid-column:span 7}
.project:nth-child(2),.project:nth-child(3){grid-column:span 5}
.project img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.project:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.78),transparent 58%)}
.project-label{position:absolute;z-index:2;left:22px;bottom:18px}.project-label b{font-size:18px}.project-label span{display:block;color:#ddd;font-size:13px}
.band{border-top:1px solid rgba(201,144,39,.45);border-bottom:1px solid rgba(201,144,39,.45);background:#090a0b}
.metrics{display:grid;grid-template-columns:repeat(4,1fr);padding:28px 0}
.metric{padding:12px 28px;border-right:1px solid var(--line)}.metric:last-child{border:0}.metric b{display:block;font-size:30px;color:var(--gold2)}.metric span{color:var(--muted);font-size:13px}
.about{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.about-img{height:480px;background:url('assets/images/project-floor.jpg') center/cover;border:1px solid var(--line)}
.about h2{font-size:44px;margin:8px 0 18px}.about p{color:#c9cacc}.checks{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:25px}.check{padding:14px;border:1px solid var(--line);background:var(--panel)}.check b{color:var(--gold2)}
.contact{display:grid;grid-template-columns:1fr 1fr;gap:40px}
.contact-panel{background:var(--panel);padding:34px;border:1px solid var(--line)}
.contact-list{display:grid;gap:15px;margin-top:25px}.contact-list a,.contact-list div{padding:13px 0;border-bottom:1px solid var(--line)}
form{display:grid;gap:12px}input,textarea{width:100%;background:#08090a;border:1px solid #2c2f35;color:white;padding:14px;font:inherit}textarea{min-height:130px;resize:vertical}button{cursor:pointer}
.notice{padding:12px;border:1px solid #2d7a42;background:#0c2412;margin-bottom:15px}
.footer{padding:35px 0;border-top:1px solid var(--line);color:#8f9296;font-size:13px}
.footer-row{display:flex;justify-content:space-between;align-items:center;gap:20px}.footer img{width:115px}
.mobile-toggle{display:none;background:none;color:white;border:0;font-size:28px}
@media(max-width:950px){
  .menu{display:none;position:absolute;top:86px;left:0;right:0;background:#090a0b;padding:20px;flex-direction:column;border-bottom:1px solid var(--line)}
  .menu.open{display:flex}.mobile-toggle{display:block;margin-left:auto}.actions{display:none}
  .hero{grid-template-columns:1fr}.hero-copy{padding:80px 24px 55px}.hero-image{min-height:420px;order:-1}
  .services{grid-template-columns:repeat(2,1fr)}.about,.contact{grid-template-columns:1fr}.metrics{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:620px){
  .container{width:min(100% - 24px,1180px)}.nav{height:74px}.brand img{width:112px}.menu{top:74px}
  .hero-image{min-height:330px}.hero-copy{padding:50px 18px}.lead{font-size:16px}
  .services{grid-template-columns:1fr}.projects{grid-template-columns:1fr}.project,.project:nth-child(n){grid-column:auto;min-height:310px}
  .metrics{grid-template-columns:1fr}.metric{border-right:0;border-bottom:1px solid var(--line)}
  .section{padding:65px 0}.section-head h2,.about h2{font-size:34px}.checks{grid-template-columns:1fr}
  .footer-row{flex-direction:column;text-align:center}
}