/*
Theme Name: Pronk Kozijnen
Theme URI: https://pronkkozijnen.nl
Author: Pronk Kozijnen
Description: Custom thema voor Pronk Kozijnen — kozijnen, deuren & zonwering in Den Haag en het Westland.
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: pronk-kozijnen
*/

:root{
  --navy:#384552;
  --navy-deep:#262f38;
  --blue:#547073;
  --blue-light:#eef3f2;
  --gold:#f0a93c;
  --coral:#e2a17e;
  --cream:#faf6ef;
  --cream-deep:#f1e9da;
  --ink:#1c2b3a;
  --muted:#5c6b78;
  --line:#e6dfd0;
  --white:#ffffff;
  --radius:24px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
[id]{scroll-margin-top:90px;}
body{
  margin:0;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  color:var(--ink);
  background:var(--cream);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block;}
h1,h2,h3,h4{
  font-family:'Poppins',-apple-system,sans-serif;
  font-weight:600;
  line-height:1.14;
  margin:0;
  color:var(--navy-deep);
  letter-spacing:-0.01em;
}
a{text-decoration:none;color:inherit;}
.wrap{max-width:1240px;margin:0 auto;padding:0 32px;}
section{position:relative;}

/* ---------- top bar ---------- */
.topbar{background:var(--navy-deep);color:#dfeaf5;font-size:13.5px;}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;padding-top:9px;padding-bottom:9px;gap:20px;}
.topbar-usps{display:flex;gap:26px;flex-wrap:wrap;}
.topbar-usps span{white-space:nowrap;opacity:.92;}
.topbar-usps span b{color:var(--coral);font-weight:600;}
.topbar a.topbar-cta{color:#fff;font-weight:700;white-space:nowrap;text-decoration:underline;text-underline-offset:3px;}
.topbar a.topbar-cta:hover{color:var(--coral);}

/* ---------- header ---------- */
header.site{background:var(--white);position:sticky;top:0;z-index:100;border-bottom:1px solid var(--line);transition:background .3s ease, border-color .3s ease, box-shadow .3s ease;}
.nav-row{display:flex;align-items:center;justify-content:space-between;padding:14px 0;gap:24px;}
.logo{display:inline-flex;align-items:center;gap:8px;}
.logo-icon, .logo-text{height:34px;width:auto;display:block;transition:filter .3s ease;}
nav.main-nav{display:flex;align-items:center;gap:30px;}
nav.main-nav a{font-size:15.5px;font-weight:600;color:var(--navy-deep);padding:6px 0;border-bottom:2px solid transparent;}
nav.main-nav a:hover, nav.main-nav a.active{border-color:var(--blue);}
nav.main-nav a{display:inline-flex;align-items:center;gap:6px;}
.nav-item{position:relative;padding-bottom:14px;margin-bottom:-14px;}
.nav-item .dropdown{
  position:absolute;top:calc(100% - 8px);left:50%;transform:translateX(-50%);
  background:#fff;border-radius:16px;box-shadow:0 18px 36px rgba(15,40,71,.16);
  padding:10px;min-width:200px;display:none;flex-direction:column;gap:2px;z-index:200;
  border:1px solid var(--line);
}
.nav-item:hover .dropdown{display:flex;}
.nav-item .dropdown a{
  font-size:14.5px;font-weight:600;color:var(--navy-deep);border:none;
  padding:10px 14px;border-radius:10px;white-space:nowrap;
}
.nav-item .dropdown a:hover{background:var(--blue-light);border:none;}
.header-actions{display:flex;align-items:center;gap:20px;}
.header-phone{font-weight:700;font-size:15px;color:var(--navy-deep);display:flex;align-items:center;gap:8px;}
.header-phone svg{flex:none;}

/* ---------- mobile nav / hamburger ---------- */
.nav-toggle-input{display:none;}
.hamburger{display:none;flex-direction:column;justify-content:center;align-items:flex-end;gap:5px;width:34px;height:34px;cursor:pointer;flex:none;}
.hamburger span{display:block;width:24px;height:2.5px;background:var(--navy-deep);border-radius:2px;transition:transform .2s ease, opacity .2s ease, width .2s ease;}
.mobile-nav{display:none;flex-direction:column;background:#fff;border-top:1px solid var(--line);padding:8px 32px 26px;gap:0;}

/* ---------- homepage: header/topbar overlaid on the hero, solid white once scrolled ---------- */
.home-fixed-head{position:fixed;top:0;left:0;right:0;z-index:100;}
.home-fixed-head header.site{position:static;}
.home-fixed-head .topbar{transition:opacity .3s ease;}
body.home:not(.scrolled) .home-fixed-head header.site{background:transparent;border-bottom-color:transparent;box-shadow:none;}
body.home:not(.scrolled) .home-fixed-head .topbar{background:transparent;}
body.home:not(.scrolled) .home-fixed-head nav.main-nav a{color:#fff;}
body.home:not(.scrolled) .home-fixed-head nav.main-nav a:hover,
body.home:not(.scrolled) .home-fixed-head nav.main-nav a.active{border-color:var(--coral);}
body.home:not(.scrolled) .home-fixed-head .nav-item .dropdown a{color:var(--navy-deep);}
body.home:not(.scrolled) .home-fixed-head .logo-text{filter:brightness(0) invert(1) drop-shadow(0 1px 4px rgba(0,0,0,.35));}
body.home:not(.scrolled) .home-fixed-head .hamburger span{background:#fff;}
body.home.scrolled .home-fixed-head .topbar{display:none;}
.mobile-nav a:not(.btn){font-size:15.5px;font-weight:600;color:var(--navy-deep);padding:13px 2px;border-bottom:1px solid var(--line);}
.mobile-nav .mobile-sub{display:flex;flex-direction:column;padding-left:16px;}
.mobile-nav .mobile-sub a{font-size:14px;font-weight:500;color:var(--muted);border-bottom:none;padding:9px 2px;}
.mobile-nav .btn{margin-top:18px;}
.nav-toggle-input:checked ~ .mobile-nav{display:flex;}
.nav-toggle-input:checked ~ .wrap .hamburger span:nth-child(1){transform:translateY(7.5px) rotate(45deg);}
.nav-toggle-input:checked ~ .wrap .hamburger span:nth-child(2){opacity:0;width:0;}
.nav-toggle-input:checked ~ .wrap .hamburger span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg);}

/* ---------- pill + circle buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:14px;align-self:flex-start;
  font-weight:700;font-size:14.5px;font-family:'Inter',sans-serif;
  border-radius:999px;padding:5px;padding-left:26px;
  border:none;cursor:pointer;white-space:nowrap;
  transition:transform .16s ease, box-shadow .16s ease, opacity .16s ease;
}
.btn:hover{transform:translateY(-1px);}
.btn .circle{
  width:40px;height:40px;min-width:40px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;flex:none;
}
.btn .circle svg{width:16px;height:16px;}
.btn-navy{background:var(--navy);color:#fff;box-shadow:0 10px 22px rgba(15,40,71,.22);}
.btn-navy .circle{background:#fff;color:var(--navy);}
.btn-navy:hover{background:var(--navy-deep);}
.btn-white{background:#fff;color:var(--navy);box-shadow:0 10px 22px rgba(15,40,71,.18);}
.btn-white .circle{background:var(--navy);color:#fff;}
.btn-white:hover{background:var(--cream-deep);}
.btn-outline{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.75);padding-left:24px;}
.btn-outline .circle{background:transparent;border:1.5px solid rgba(255,255,255,.75);color:#fff;}
.btn-outline:hover{background:rgba(255,255,255,.12);}
.btn-ghost-navy{background:transparent;color:var(--navy);border:1.5px solid var(--navy);padding-left:24px;}
.btn-ghost-navy .circle{background:transparent;border:1.5px solid var(--navy);color:var(--navy);}
.btn-ghost-navy:hover{background:var(--navy);color:#fff;}
.btn-ghost-navy:hover .circle{background:#fff;color:var(--navy);border-color:#fff;}
.btn-block{width:100%;justify-content:space-between;}

/* ---------- hero (home) ---------- */
.hero{
  position:relative;min-height:660px;display:flex;align-items:center;
  background-color:#0c1f36;background-size:cover;background-position:center 42%;background-repeat:no-repeat;
}
.hero::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(100deg, rgba(9,24,43,.82) 0%, rgba(9,24,43,.56) 40%, rgba(9,24,43,.18) 74%, rgba(9,24,43,.05) 100%);
}
.hero-inner{position:relative;z-index:2;padding:110px 0 90px;max-width:660px;}
.eyebrow{display:inline-block;position:relative;padding-left:34px;color:#cfe0f2;font-weight:700;font-size:13.5px;line-height:1.5;letter-spacing:.09em;text-transform:uppercase;margin-bottom:18px;}
.eyebrow::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:26px;height:2px;background:var(--coral);}
.hero h1{color:#fff;font-size:56px;margin-bottom:20px;font-weight:600;}
.hero p.lead{color:#e6edf4;font-size:18.5px;line-height:1.6;margin-bottom:36px;max-width:520px;font-family:'Poppins',sans-serif;font-weight:400;}
.hero-ctas{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:40px;}
.hero-trust{display:flex;gap:26px;flex-wrap:wrap;color:#dfeaf5;font-size:13.5px;}
.hero-trust div{display:flex;align-items:center;gap:8px;}
.hero-trust svg{color:var(--coral);flex:none;}
.scroll-cue{position:absolute;right:40px;bottom:34px;z-index:2;display:flex;flex-direction:column;align-items:center;gap:8px;color:#cfe0f2;font-size:12px;letter-spacing:.08em;text-transform:uppercase;}
.scroll-cue .line{width:1px;height:40px;background:rgba(255,255,255,.5);position:relative;overflow:hidden;}
.scroll-cue .line::after{content:"";position:absolute;top:0;left:0;width:100%;height:14px;background:#fff;animation:scrolldown 1.8s infinite;}
@keyframes scrolldown{0%{transform:translateY(-16px);}100%{transform:translateY(40px);}}

/* ---------- page hero (subpages) ---------- */
.page-hero{
  position:relative;min-height:320px;display:flex;align-items:flex-end;
  background-color:#0c1f36;background-size:cover;background-position:center;
}
.page-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(9,24,43,.3) 0%, rgba(9,24,43,.86) 100%);}
.page-hero-inner{position:relative;z-index:2;padding:64px 0 44px;}
.breadcrumb{color:#cfe0f2;font-size:13px;margin-bottom:14px;}
.breadcrumb a{color:var(--coral);font-weight:600;}
.page-hero h1{color:#fff;font-size:42px;max-width:640px;}
.page-hero p{color:#e6edf4;font-size:16px;margin-top:14px;max-width:560px;}

/* ---------- usp strip ---------- */
.usp-strip{background:var(--blue-light);border-bottom:1px solid var(--line);}
.usp-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;}
.usp-item{display:flex;align-items:center;gap:14px;padding:26px 22px;border-right:1px solid #dbe7f1;}
.usp-item:last-child{border-right:none;}
.usp-item .ic{width:44px;height:44px;border-radius:14px;background:#fff;color:var(--navy);display:flex;align-items:center;justify-content:center;flex:none;box-shadow:0 4px 10px rgba(15,40,71,.08);}
.usp-item strong{display:block;font-size:14.5px;color:var(--navy-deep);font-family:'Poppins',sans-serif;}
.usp-item span{display:block;font-size:13px;color:var(--muted);margin-top:2px;}

/* ---------- section heading ---------- */
.section{padding:100px 0;}
.section.tight{padding:64px 0;}
.section-head{max-width:640px;margin:0 auto 52px;text-align:center;}
.section-head.left{margin:0 0 46px;text-align:left;max-width:720px;}
.kicker{display:inline-block;color:var(--blue);font-weight:700;font-size:13px;letter-spacing:.09em;text-transform:uppercase;margin-bottom:14px;}
.section-head h2{font-size:38px;margin-bottom:16px;}
.section-head p{color:var(--muted);font-size:16.5px;line-height:1.65;}
.alt-bg{background:var(--cream-deep);}

/* ---------- products ---------- */
.prod-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;}
@media (min-width: 981px){
  .prod-grid.cols-3{grid-template-columns:repeat(3,1fr);}
  .prod-grid.cols-4{grid-template-columns:repeat(4,1fr);}
}
.prod-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:30px 22px;transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;}
.prod-card:hover{transform:translateY(-4px);box-shadow:0 18px 34px rgba(15,40,71,.1);border-color:transparent;}
.prod-card .ic{width:52px;height:52px;border-radius:16px;background:var(--blue-light);color:var(--navy);display:flex;align-items:center;justify-content:center;margin-bottom:18px;}
.prod-card h3{font-size:18px;margin-bottom:10px;}
.prod-card p{font-size:14px;color:var(--muted);line-height:1.6;margin:0 0 16px;}
.prod-card .go{font-size:13.5px;font-weight:700;color:var(--blue);display:inline-flex;align-items:center;gap:6px;}

/* ---------- centered pill-button wrapper (pronk/pill-button, center:true) ----------
   Plain centering only by default — a button centered elsewhere in normal
   document flow (e.g. after a paragraph, or in the CTA banner) already gets
   its spacing from the element above it. A button directly under a grid
   has nothing to fall back on, so it gets its own top margin, matching the
   original mockup's `margin-top:40px` on exactly that composition. */
.btn-center-wrap{text-align:center;}
.prod-grid + .btn-center-wrap,
.style-grid + .btn-center-wrap,
.feature-row + .btn-center-wrap{margin-top:40px;}

/* ---------- blog ---------- */
.blog-tag{display:inline-block;background:var(--blue-light);color:var(--navy);font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:5px 12px;border-radius:100px;margin-bottom:14px;width:fit-content;}
.blog-meta{font-size:13px;color:var(--muted);}
.blog-featured{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:0 18px 40px rgba(15,40,71,.1);display:grid;grid-template-columns:1.05fr 1fr;margin-bottom:44px;}
.blog-featured img{width:100%;height:100%;min-height:320px;object-fit:cover;display:block;}
.blog-featured .body{padding:44px;display:flex;flex-direction:column;justify-content:center;}
.blog-featured .body h2{font-size:27px;line-height:1.25;margin-bottom:14px;}
.blog-featured .body p.excerpt{color:var(--muted);font-size:15px;line-height:1.7;margin:0 0 20px;}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.blog-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;}
.blog-card:hover{transform:translateY(-4px);box-shadow:0 18px 34px rgba(15,40,71,.1);border-color:transparent;}
.blog-card img{width:100%;height:190px;object-fit:cover;display:block;}
.blog-card .body{padding:22px 22px 24px;}
.blog-card h3{font-size:17px;line-height:1.35;margin:0 0 10px;}
.blog-card p{font-size:14px;color:var(--muted);line-height:1.6;margin:0 0 16px;}
.blog-card .go{font-size:13.5px;font-weight:700;color:var(--blue);display:inline-flex;align-items:center;gap:6px;}

/* ---------- alternating product detail rows ---------- */
.detail-row{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;padding:76px 0;border-bottom:1px solid var(--line);}
.detail-row:last-child{border-bottom:none;}
.detail-row.reverse .detail-media{order:2;}
.detail-media{position:relative;border-radius:var(--radius);overflow:hidden;box-shadow:0 24px 48px rgba(15,40,71,.14);}
.detail-media img{width:100%;height:380px;object-fit:cover;}
.detail-copy .kicker{margin-bottom:12px;}
.detail-copy h2{font-size:30px;margin-bottom:16px;}
.detail-copy p.lead{color:var(--muted);font-size:15.5px;line-height:1.7;margin-bottom:22px;}

/* ---------- showroom spotlight ---------- */
.showroom{background:var(--navy-deep);color:#eaf1f8;padding:0;}
.showroom-grid{display:grid;grid-template-columns:1.05fr 0.95fr;align-items:stretch;}
.showroom-copy{padding:96px 64px;display:flex;flex-direction:column;justify-content:center;}
.showroom-copy .kicker{color:var(--coral);}
.showroom-copy h2{color:#fff;font-size:40px;margin-bottom:20px;max-width:480px;}
.showroom-copy p.lead{font-size:16.5px;line-height:1.7;color:#d6e4f0;margin-bottom:28px;max-width:480px;}
.showroom-list{list-style:none;padding:0;margin:0 0 34px;display:grid;gap:14px;max-width:460px;}
.showroom-list li{display:flex;gap:12px;align-items:flex-start;font-size:15px;color:#e9f0f7;}
.showroom-list svg{flex:none;margin-top:2px;color:var(--coral);}
.showroom-ctas{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:36px;}
.showroom-meta{display:flex;gap:30px;flex-wrap:wrap;margin-top:36px;padding-top:26px;border-top:1px solid rgba(255,255,255,.14);max-width:480px;}
.showroom-meta div strong{display:block;font-size:14.5px;color:#fff;margin-bottom:4px;font-family:'Poppins',sans-serif;}
.showroom-meta div span{font-size:13.5px;color:#a9c1d6;}
.showroom-photos{position:relative;min-height:520px;}
.showroom-photos img{position:absolute;object-fit:cover;border-radius:20px;box-shadow:0 30px 60px rgba(0,0,0,.4);}
.sp-1{width:78%;height:64%;top:8%;right:10%;}
.sp-2{width:52%;height:46%;bottom:6%;left:4%;border:5px solid var(--navy-deep);}
.sp-badge{position:absolute;left:2%;top:4%;background:#fff;color:var(--navy-deep);border-radius:18px;padding:16px 18px;box-shadow:0 14px 30px rgba(0,0,0,.3);z-index:3;max-width:190px;}
.sp-badge strong{display:block;font-size:24px;font-family:'Poppins',sans-serif;}
.sp-badge span{font-size:12.5px;color:var(--muted);}

/* ---------- showroom page gallery ---------- */
.gallery-grid{display:grid;grid-template-columns:1.4fr 1fr;grid-template-rows:1fr 1fr;gap:16px;height:520px;}
.gallery-grid img{width:100%;height:100%;object-fit:cover;border-radius:var(--radius);}
.gallery-grid .g-main{grid-row:1/3;}
.feature-row{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:52px;}
.feature-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px;}
.feature-card .ic{width:46px;height:46px;border-radius:14px;background:var(--blue-light);color:var(--navy);display:flex;align-items:center;justify-content:center;margin-bottom:16px;}
.feature-card h3{font-size:16.5px;margin-bottom:8px;}
.feature-card p{font-size:14px;color:var(--muted);line-height:1.6;margin:0;}

/* ---------- inspiration style cards ---------- */
.style-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
@media (min-width: 981px){
  /* .style-grid.cols-2{grid-template-columns:repeat(3,1fr);} */
  .style-grid.cols-3{grid-template-columns:repeat(2,1fr);}
}
a.style-card{display:block;}
.style-card{position:relative;border-radius:var(--radius);overflow:hidden;height:340px;box-shadow:0 14px 30px rgba(15,40,71,.12);}
.style-card img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:transform .3s ease;}
.style-card:hover img{transform:scale(1.05);}
.style-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(9,24,43,0) 40%, rgba(9,24,43,.82) 100%);}
.style-card.cta::after{content:none;}
.style-card .label{position:absolute;left:20px;bottom:18px;z-index:2;color:#fff;}
.style-card .label strong{display:block;font-size:18px;font-family:'Poppins',sans-serif;}
.style-card .label span{font-size:12.5px;color:#dfeaf5;}
.style-card.cta{display:flex;align-items:center;justify-content:center;flex-direction:column;background:var(--navy-deep);text-align:center;padding:24px;}
.style-card.cta h3{color:#fff;font-size:19px;margin-bottom:10px;}
.style-card.cta p{color:#c7dbec;font-size:13.5px;margin-bottom:18px;}

/* ---------- stats row ---------- */
.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:48px;}
.stat-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px;text-align:center;}
.stat-card strong{display:block;font-family:'Poppins',sans-serif;font-size:32px;color:var(--navy-deep);}
.stat-card span{font-size:13.5px;color:var(--muted);}

/* ---------- why us ---------- */
.why-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;    padding: 56px 32px;}
.why-media{position:relative;border-radius:var(--radius);overflow:hidden;box-shadow:0 24px 48px rgba(15,40,71,.16);}
.why-media img{width:100%;height:420px;object-fit:cover;}
.why-list{list-style:none;margin:26px 0 32px;padding:0;display:grid;gap:18px;}
.why-list li{display:flex;gap:14px;align-items:flex-start;font-size:15.5px;color:var(--ink);}
.why-list svg{flex:none;margin-top:3px;color:var(--blue);}

/* ---------- reviews ---------- */
.reviews{background:var(--cream-deep);}
.rating-card{display:flex;align-items:center;gap:28px;background:#fff;border-radius:var(--radius);padding:26px 32px;max-width:560px;margin:0 auto 44px;box-shadow:0 14px 30px rgba(15,40,71,.08);}
.rating-card .num{font-family:'Poppins',sans-serif;font-size:44px;color:var(--navy-deep);}
.rating-card .stars{color:var(--gold);font-size:18px;letter-spacing:2px;}
.rating-card .lbl{font-size:13.5px;color:var(--muted);}
.review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.review-card{background:#fff;border-radius:var(--radius);padding:28px;box-shadow:0 10px 24px rgba(15,40,71,.06);}
.review-card .stars{color:var(--gold);font-size:14px;letter-spacing:2px;margin-bottom:14px;}
.review-card p{font-size:14.5px;line-height:1.65;color:var(--ink);margin:0 0 20px;font-style:italic;}
.reviewer{display:flex;align-items:center;gap:12px;}
.reviewer .av{width:38px;height:38px;border-radius:50%;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;flex:none;font-family:'Poppins',sans-serif;}
.reviewer strong{display:block;font-size:14px;}
.reviewer span{font-size:12.5px;color:var(--muted);}

/* ---------- appointment banner ---------- */
.appt{background:linear-gradient(120deg,var(--navy) 0%, var(--navy-deep) 100%);color:#fff;padding:80px 0;text-align:center;}
.appt h2{color:#fff;font-size:34px;margin-bottom:14px;}
.appt p{color:#d6e4f0;font-size:16px;margin-bottom:30px;font-family:'Poppins',sans-serif;}
.appt .btn{margin:0 auto;}

/* ---------- contact ---------- */
.contact-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:start;}
@media (min-width: 981px){
  .contact-grid.even{grid-template-columns:1fr 1fr;}
}
.form-card{background:#fff;border-radius:var(--radius);padding:40px;border:1px solid var(--line);box-shadow:0 14px 34px rgba(15,40,71,.06);}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:18px;}
.field{display:flex;flex-direction:column;gap:8px;}
.field.full{grid-column:1/-1;}
.field label{font-size:13.5px;font-weight:600;color:var(--navy-deep);}
.field input,.field select,.field textarea{border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;font-family:inherit;font-size:14.5px;color:var(--ink);background:#fdfbf7;}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--blue);background:#fff;}
.field textarea{resize:vertical;min-height:110px;}
.consent{display:flex;gap:10px;align-items:flex-start;font-size:12.5px;color:var(--muted);margin:6px 0 22px;}
.consent input{margin-top:3px;}

/* ---------- Gravity Forms — mapped onto the .form-card design system above.
   Targets the "gravity-theme" (classic) markup — set as the site-wide
   default in Forms > Settings, since GF 3.x's new "orbital" theme uses a
   different structure entirely. The 12-column grid itself (and the
   .gfield--width-half/--width-full spans) is Gravity Forms' own, defined
   in its basic.min.css and driven by each field's layoutGridColumnSpan
   (see inc/gravity-forms.php) — we never redeclare the grid here, only
   colors/spacing/borders on top of it. */
.form-card .gform_wrapper{max-width:none;}
.gform_required_legend {display:none;}
.gform_wrapper .gform_fields{gap:18px 2%;list-style:none;margin:0;padding:0;}
.gform_wrapper .gfield{display:flex;flex-direction:column;gap:8px;margin:0;}
.gform_wrapper .gfield_label,
.gform_wrapper .gform-field-label{font-size:13.5px;font-weight:600;color:var(--navy-deep);margin:0;}
.gform_wrapper .gfield_required,
.gform_wrapper .gfield_required_asterisk{color:var(--coral);}
.gform_wrapper input[type="text"],
.gform_wrapper input[type="email"],
.gform_wrapper input[type="tel"],
.gform_wrapper input[type="number"],
.gform_wrapper select,
.gform_wrapper textarea{width:100%;border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;font-family:inherit;font-size:14.5px;color:var(--ink);background:#fdfbf7;}
.gform_wrapper input:focus,
.gform_wrapper select:focus,
.gform_wrapper textarea:focus{outline:none;border-color:var(--blue);background:#fff;}
.gform_wrapper textarea{resize:vertical;min-height:110px;}
.gform_wrapper .ginput_container{margin:0;}
.gform_wrapper fieldset.gfield{border:none;padding:0;}
.gform_wrapper .gfield_consent_label{font-size:12.5px;color:var(--muted);}
.gform_wrapper .gfield_description,
.gform_wrapper .gfield_validation_message{font-size:12.5px;color:var(--coral);margin-top:4px;}
.gform_wrapper .gform_footer{margin:8px 0 0;padding:0;}
.gform_wrapper .gform_button{display:inline-flex;align-items:center;justify-content:center;gap:14px;font-weight:700;font-size:14.5px;font-family:'Inter',sans-serif;border-radius:999px;padding:14px 26px;border:none;cursor:pointer;background:var(--navy);color:#fff;box-shadow:0 10px 22px rgba(15,40,71,.22);width:100%;}
.gform_wrapper .gform_button:hover{background:var(--navy-deep);}
.gform_wrapper .gform_validation_errors,
.gform_wrapper .validation_error{background:var(--cream-deep);border:1px solid var(--coral);border-radius:12px;padding:14px 18px;font-size:13.5px;color:var(--ink);margin:0 0 18px;}

/* ---------- Offerte: icon+box radio choices, matching the original .option-card ---------- */
.gform_wrapper .gfield_radio{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;}
.gform_wrapper .gchoice{position:relative;border:1.5px solid var(--line);border-radius:16px;padding:16px 14px;cursor:pointer;background:#fdfbf7;transition:border-color .15s ease, background .15s ease;}
.gform_wrapper .gchoice .gfield-choice-input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer;}
.gform_wrapper .gchoice label{display:flex;flex-direction:column;gap:10px;}
.gform_wrapper .gchoice .ic{width:34px;height:34px;border-radius:10px;background:var(--blue-light);color:var(--navy);display:flex;align-items:center;justify-content:center;}
.gform_wrapper .gchoice .lbl{font-size:13.5px;font-weight:600;color:var(--navy-deep);}
.gform_wrapper .gchoice:hover{border-color:var(--blue);}
.gform_wrapper .gchoice:has(input:checked){border-color:var(--navy);background:var(--blue-light);}
.gform_wrapper .gchoice:has(input:checked)::after{content:"";position:absolute;top:12px;right:12px;width:14px;height:14px;border-radius:50%;background:var(--navy);box-shadow:0 0 0 3px #fff inset;}

@media (max-width: 980px){
  .gform_wrapper .gfield--width-half{grid-column:span 12;}
  .gform_wrapper .gfield_radio{grid-template-columns:1fr 1fr;}
}
.info-stack{display:grid;gap:20px;}
.info-card{background:#fff;border-radius:var(--radius);padding:26px 28px;border:1px solid var(--line);}
.info-card h4{font-size:15px;margin-bottom:14px;display:flex;align-items:center;gap:10px;font-family:'Poppins',sans-serif;}
.info-card h4 svg{color:var(--blue);}
.info-card p, .info-card a{font-size:14.5px;color:var(--muted);line-height:1.7;}
.hours-table{width:100%;font-size:13.5px;border-collapse:collapse;}
.hours-table td{padding:5px 0;color:var(--muted);}
.hours-table td:last-child{text-align:right;color:var(--ink);font-weight:600;}
.map-card{border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);position:relative;height:200px;background:#e9f1f7;}
.map-card .map-link{position:absolute;inset:0;display:block;}
.map-card img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s ease;}
.map-card .map-link:hover img{transform:scale(1.03);}
.map-card .cta-row{position:absolute;bottom:12px;right:12px;z-index:2;}

/* ---------- offerte: 3-step process ---------- */
.steps{background:var(--blue-light);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;}
.step-card{display:flex;gap:18px;align-items:flex-start;}
.step-num{width:46px;height:46px;min-width:46px;border-radius:50%;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:center;font-family:'Poppins',sans-serif;font-weight:600;font-size:18px;flex:none;box-shadow:0 10px 20px rgba(15,40,71,.18);}
.step-card h3{font-size:16.5px;margin-bottom:8px;}
.step-card p{font-size:14px;color:var(--muted);line-height:1.6;margin:0;}

/* ---------- offerte: product-type option cards ---------- */
.option-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:22px;}
.option-card{position:relative;border:1.5px solid var(--line);border-radius:16px;padding:16px 14px;cursor:pointer;display:flex;flex-direction:column;gap:10px;background:#fdfbf7;transition:border-color .15s ease, background .15s ease;}
.option-card input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer;}
.option-card .ic{width:34px;height:34px;border-radius:10px;background:var(--blue-light);color:var(--navy);display:flex;align-items:center;justify-content:center;}
.option-card span.lbl{font-size:13.5px;font-weight:600;color:var(--navy-deep);}
.option-card:hover{border-color:var(--blue);}
.option-card:has(input:checked){border-color:var(--navy);background:var(--blue-light);}
.option-card:has(input:checked)::after{content:"";position:absolute;top:12px;right:12px;width:14px;height:14px;border-radius:50%;background:var(--navy);box-shadow:0 0 0 3px #fff inset;}
.field-label{font-size:13.5px;font-weight:600;color:var(--navy-deep);display:block;margin-bottom:10px;}

/* ---------- offerte: mini rating in sidebar ---------- */
.mini-rating{display:flex;align-items:center;gap:14px;}
.mini-rating .num{font-family:'Poppins',sans-serif;font-size:26px;color:var(--navy-deep);}
.mini-rating .stars{color:var(--gold);font-size:14px;letter-spacing:1.5px;display:block;margin-bottom:2px;}

/* ---------- footer ---------- */
footer.site{background:var(--navy-deep);color:#c3d5e5;padding:72px 0 0;}
.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:40px;padding-bottom:52px;border-bottom:1px solid rgba(255,255,255,.1);}
.footer-logo{height:30px;width:auto;margin-bottom:16px;filter:brightness(0) invert(1);}
.footer-grid p{font-size:14px;line-height:1.7;color:#9fb6c9;max-width:280px;}
.footer-grid h5{color:#fff;font-size:14px;margin-bottom:18px;letter-spacing:.03em;text-transform:uppercase;font-family:'Poppins',sans-serif;}
.footer-grid ul{list-style:none;margin:0;padding:0;display:grid;gap:11px;}
.footer-grid ul a,
.footer-grid ul li
{font-size:14px;color:#c3d5e5;}
.footer-grid ul a:hover{color:#fff;}
.footer-badges{display:flex;gap:10px;margin-top:18px;}
.footer-badges img{height:40px;width:auto;border-radius:8px;background:#fff;padding:4px;}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding:26px 0;font-size:13px;color:#7f9ab0;flex-wrap:wrap;gap:12px;}
.footer-bottom .socials{display:flex;gap:12px;}
.footer-bottom .socials a{width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;}
.footer-bottom .socials a:hover{background:rgba(255,255,255,.16);}

/* ---------- heading/paragraph size & spacing utilities ----------
   Used instead of inline "style" attributes on core/heading and
   core/paragraph blocks: an inline style not fully declared in the
   block's JSON attributes is exactly what makes the block editor flag
   saved content as "invalid" (it recomputes the expected markup from
   attributes alone and diffs it against what's stored). Plain classes
   sidestep that entirely. */
.h-30-18{font-size:30px;margin-bottom:18px;}
.h-28{font-size:28px;}
.h-28-18{font-size:28px;margin-bottom:18px;}
.h-32-20{font-size:32px;margin-bottom:20px;}
.p-muted{color:var(--muted);font-size:15.5px;line-height:1.7;}
.mb-18{margin-bottom:18px;}
.mb-22{margin-bottom:22px;}
.mb-26{margin-bottom:26px;}
.p-cta-note{color:var(--muted);max-width:520px;margin:0 auto 26px;}

/* ---------- WP block-editor compatibility ---------- */
main{display:block;}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap;}

/* ---------- single post / prose content ---------- */
.post-hero p{color:#e6edf4;}
.post-byline{display:flex;align-items:center;gap:12px;max-width:760px;margin:0 auto 32px;}
.post-byline .av{width:44px;height:44px;border-radius:50%;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px;flex:none;font-family:'Poppins',sans-serif;}
.post-byline strong{display:block;font-size:14.5px;color:var(--navy-deep);}
.post-byline span{font-size:13px;color:var(--muted);}
.toc{max-width:760px;margin:0 auto 32px;background:var(--blue-light);border:1px solid var(--line);border-radius:var(--radius);padding:26px 30px;}
.toc .toc-title{font-family:'Poppins',sans-serif;font-weight:600;font-size:15px;color:var(--navy-deep);margin:0 0 12px;}
.toc ol{list-style:none;margin:0;padding:0;counter-reset:toc;}
.toc > ol > li{counter-increment:toc;margin:0 0 8px;}
.toc > ol > li::before{content:counter(toc) ".";display:inline-block;width:20px;color:var(--blue);font-weight:700;font-size:14px;}
.toc a{font-size:14.5px;color:var(--ink);}
.toc a:hover{color:var(--blue);text-decoration:underline;text-underline-offset:3px;}
.toc .toc-sub{list-style:none;margin:6px 0 0 20px;padding:0;}
.toc .toc-sub li{margin:0 0 6px;}
.toc .toc-sub a{font-size:13.5px;color:var(--muted);}
.prose{max-width:760px;margin:0 auto;}
.prose h2{font-size:26px;margin:36px 0 14px;}
.prose h3{font-size:20px;margin:28px 0 12px;}
.prose p{font-size:15.5px;line-height:1.75;color:var(--ink);margin:0 0 18px;}
.prose ul, .prose ol{font-size:15.5px;line-height:1.75;color:var(--ink);margin:0 0 18px;padding-left:22px;}
.prose img{border-radius:var(--radius);margin:24px 0;}
.prose a{color:var(--blue);font-weight:600;text-decoration:underline;text-underline-offset:3px;}

@media (max-width: 980px){
  .usp-grid{grid-template-columns:repeat(2,1fr);}
  .usp-item{border-right:none;border-bottom:1px solid #dbe7f1;}
  .prod-grid{grid-template-columns:repeat(2,1fr);}
  .showroom-grid{grid-template-columns:1fr;}
  .showroom-photos{min-height:360px;}
  .why-grid{grid-template-columns:1fr;}
  .review-grid{grid-template-columns:1fr;}
  .contact-grid{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .detail-row{grid-template-columns:1fr;padding:48px 0;}
  .detail-row.reverse .detail-media{order:0;}
  .gallery-grid{grid-template-columns:1fr;grid-template-rows:auto;height:auto;}
  .gallery-grid .g-main{grid-row:auto;}
  .feature-row{grid-template-columns:1fr;}
  .stats-row{grid-template-columns:1fr 1fr;}
  .style-grid{grid-template-columns:1fr 1fr;}
  .blog-featured{grid-template-columns:1fr;}
  .blog-featured img{min-height:220px;}
  .blog-featured .body{padding:28px;}
  .blog-grid{grid-template-columns:1fr;}
  nav.main-nav{display:none;}
  .hamburger{display:flex;}
  .wrap{padding-left:20px;padding-right:20px;}
  .nav-row{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;column-gap:10px;padding:12px 0;}
  .hamburger{grid-column:1;justify-self:start;}
  .logo{grid-column:2;justify-self:center;}
  .logo-icon, .logo-text{height:26px;}
  .header-actions{grid-column:3;display:none;}
  .hero h1{font-size:38px;}
  .page-hero h1{font-size:30px;}
  .form-row{grid-template-columns:1fr;}
  .steps-grid{grid-template-columns:1fr;gap:24px;}
  .option-grid{grid-template-columns:1fr 1fr;}

  /* rotating USP ticker: only room for one line, so cycle through them */
  .topbar .wrap{padding-top:9px;padding-bottom:9px;}
  .topbar-usps{position:relative;height:17px;width:100%;display:block;flex:none;}
  .topbar-usps span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:5px;opacity:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;animation:usp-rotate 9s infinite;}
  .topbar-usps span:nth-child(1){animation-delay:0s;}
  .topbar-usps span:nth-child(2){animation-delay:3s;}
  .topbar-usps span:nth-child(3){animation-delay:6s;}
}
@keyframes usp-rotate{
  0%{opacity:0;}
  6%{opacity:1;}
  30%{opacity:1;}
  37%{opacity:0;}
  100%{opacity:0;}
}