/* SnelWonen visual refinement layer — spacing, hierarchy and calm surfaces. */
:root{
  --max:1180px;
  --content-max:960px;
  --radius:10px;
  --shadow:0 8px 28px rgba(38,45,41,.07);
  --shadow-hover:0 16px 38px rgba(38,45,41,.11);
}

body{
  background:#fdfdfc;
  font-size:16px;
  line-height:1.68;
  -webkit-font-smoothing:antialiased;
}

main{min-height:55vh}

h1{font-size:clamp(2.15rem,4.4vw,3.15rem);line-height:1.08;letter-spacing:-.035em}
h2{font-size:clamp(1.6rem,2.7vw,2.15rem);line-height:1.16}
h3{line-height:1.25}
p{margin-bottom:18px}

.wrap{
  max-width:var(--max);
  padding:48px 24px 88px;
}

.wrap > .breadcrumbs{margin-bottom:30px}
.wrap > section + section,
.wrap > section + .cards,
.wrap > .cards + section{margin-top:48px}

.site-header{
  box-shadow:0 1px 10px rgba(38,45,41,.045);
}

.site-header .container{
  max-width:var(--max);
  height:72px;
  padding:0 24px;
  gap:22px;
}

.logo{flex:0 0 auto}
.logo img{height:30px;width:auto}
.nav-main{gap:18px}
.nav-main a{font-size:14px;padding:10px 3px}
.site-header > .container > .btn{flex:0 0 auto;padding:11px 17px;border-radius:7px}

.mega-menu{
  top:52px;
  border-radius:12px;
  padding:28px;
  box-shadow:0 22px 55px rgba(38,45,41,.13);
}

.home-hero-img{height:440px}
.home-hero-content{padding:0 24px}
.home-hero-content main,
.home-hero-content .hero-panel,
.collection-hero-panel{
  max-width:760px;
  margin-bottom:34px;
  padding:30px 32px;
  border-radius:16px;
  border-top-width:3px;
  box-shadow:0 18px 50px rgba(27,42,32,.14);
}

.lead{font-size:1.12rem;line-height:1.58;color:#454545}
.cta-row{gap:12px;margin-top:22px}
.btn{padding:11px 18px;border-radius:7px;box-shadow:none}
.btn:hover{box-shadow:0 8px 20px rgba(40,171,40,.16)}

.cards{gap:24px}
.city-grid{gap:20px}

.card,
.prose{
  border-color:#e8e9e7;
  border-radius:12px;
  box-shadow:var(--shadow);
}

.card:hover{transform:translateY(-2px);box-shadow:var(--shadow-hover)}
.card-img{height:196px}
.card-body{padding:20px 20px 22px}
.card-title{font-size:1.1rem;margin-bottom:10px}
.card-meta{line-height:1.5}

.prose{
  padding:28px 30px;
}

.prose p,
.prose li{max-width:68ch}
.prose h2{margin-top:4px;margin-bottom:18px}
.prose h2:not(:first-child){margin-top:34px}
.prose ul,
.prose ol{padding-left:24px;margin:0 0 20px}
.prose li + li{margin-top:8px}

.breadcrumbs{gap:9px;margin-bottom:28px;font-size:.925rem}
.pill-grid{gap:12px}
.pill{padding:10px 14px;border-radius:8px}

.collection-stats{gap:18px;margin-bottom:36px}
.stat-card{padding:20px 16px;border-radius:12px;background:#f7f7f5}
.collection-listings,
.collection-related{margin-top:48px}

.site-footer{
  margin-top:88px;
  padding:64px 24px 70px;
  background:#f6f6f4;
}
.footer-grid{max-width:var(--max);gap:64px}
.site-footer h3{margin-bottom:18px}
.site-footer ul{padding-left:20px}
.site-footer li + li{margin-top:5px}

@media (max-width:1100px){
  .nav-main{gap:11px}
  .nav-main a{font-size:13px}
}

@media (max-width:720px){
  body{line-height:1.62}
  h1{font-size:clamp(2rem,10vw,2.6rem)}
  .site-header .container{height:60px;padding:0 18px;gap:12px}
  .logo img{height:27px}
  .site-header > .container > .btn{min-height:40px;padding:9px 12px;font-size:13px}
  .wrap{padding:28px 18px 60px}
  .wrap > section{margin-top:0!important}
  .wrap > section + section,
  .wrap > section + .cards,
  .wrap > .cards + section{margin-top:32px!important}
  .wrap > .breadcrumbs{margin-bottom:24px}
  .home-hero-img{height:400px}
  .home-hero-content{padding:20px 18px}
  .home-hero-content main,
  .home-hero-content .hero-panel,
  .collection-hero-panel{padding:22px;margin:0;border-radius:13px}
  .lead{font-size:1.04rem}
  .cards,.city-grid{gap:16px}
  .card-img{height:190px}
  .card-body{padding:18px}
  .prose{padding:22px 20px}
  .prose h2:not(:first-child){margin-top:28px}
  .collection-stats{gap:12px;margin-bottom:28px}
  .stat-card{padding:16px 10px}
  .collection-listings,.collection-related{margin-top:34px}
  .site-footer{margin-top:56px;padding:46px 20px 52px}
  .footer-grid{gap:34px}
}

@media (max-width:380px){
  .site-header > .container > .btn{font-size:12px;padding:8px 10px}
}