/* ==========================================================================
   Star Installatie — design system v2
   Bold, professional, high contrast. Black #161615 + Yellow #fecc00.
   Display: Sora · Body: Plus Jakarta Sans
   ========================================================================== */

@font-face{font-family:'Sora';src:url('../fonts/Sora-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap;}
@font-face{font-family:'Sora';src:url('../fonts/Sora-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap;}
@font-face{font-family:'Sora';src:url('../fonts/Sora-800.woff2') format('woff2');font-weight:800;font-style:normal;font-display:swap;}
@font-face{font-family:'Jakarta';src:url('../fonts/PlusJakartaSans-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'Jakarta';src:url('../fonts/PlusJakartaSans-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap;}
@font-face{font-family:'Jakarta';src:url('../fonts/PlusJakartaSans-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap;}
@font-face{font-family:'Jakarta';src:url('../fonts/PlusJakartaSans-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap;}

:root{
  --ink:#161615;
  --ink-2:#1e1e1c;
  --ink-3:#2a2a26;
  --ink-4:#3a3a34;
  --yellow:#fecc00;
  --yellow-2:#ffd633;
  --yellow-3:#ffe580;
  --amber:#5c5a51;          /* neutral accent text (no olive/gold) */

  --paper:#faf9f6;
  --white:#ffffff;
  --grey:#f1efe9;
  --grey-2:#e7e4dc;
  --border:#e4e1d8;
  --border-strong:#d8d4c8;

  --text:#171715;
  --text-soft:#5c5a51;
  --text-faint:#b9b6ab;

  --on-dark:#f5f3ed;
  --on-dark-soft:rgba(245,243,237,.62);
  --on-dark-faint:rgba(245,243,237,.34);
  --line-dark:rgba(245,243,237,.14);

  --font-display:'Sora',system-ui,-apple-system,Segoe UI,sans-serif;
  --font-body:'Jakarta',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;

  --container:1240px;
  --container-wide:1380px;
  --gutter:clamp(1.15rem,4.5vw,3.5rem);
  --section:clamp(4rem,8vw,7.5rem);

  --r-sm:8px;
  --r:14px;
  --r-lg:22px;
  --r-xl:30px;
  --ease:cubic-bezier(.4,0,.2,1);
  --ease-out:cubic-bezier(.16,1,.3,1);

  --shadow-sm:0 2px 8px rgba(22,22,21,.06),0 1px 2px rgba(22,22,21,.04);
  --shadow:0 30px 60px -28px rgba(22,22,21,.28),0 10px 24px -18px rgba(22,22,21,.18);
  --shadow-yellow:0 18px 40px -16px rgba(254,204,0,.55);
}

*,*::before,*::after{box-sizing:border-box;}
*{margin:0;padding:0;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}
body{
  font-family:var(--font-body);background:var(--paper);color:var(--text);
  font-size:clamp(1rem,.97rem + .15vw,1.06rem);line-height:1.65;font-weight:400;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden;
}
img,svg,video{display:block;max-width:100%;}
img{height:auto;}
a{color:inherit;text-decoration:none;}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer;}
ul,ol{list-style:none;}
::selection{background:var(--yellow);color:var(--ink);}
:focus-visible{outline:3px solid var(--yellow);outline-offset:2px;border-radius:4px;}

/* ---------- Type ---------- */
h1,h2,h3,h4{font-family:var(--font-display);font-weight:700;line-height:1.06;letter-spacing:-.02em;color:var(--text);}
.display{font-weight:800;line-height:.92;letter-spacing:-.025em;text-transform:uppercase;}
h1,.h1{font-size:clamp(2.3rem,1.5rem + 3.4vw,4.1rem);font-weight:800;letter-spacing:-.03em;}
h2,.h2{font-size:clamp(1.9rem,1.35rem + 2.4vw,3.1rem);font-weight:700;}
h3,.h3{font-size:clamp(1.3rem,1.1rem + .9vw,1.7rem);font-weight:700;}
h4,.h4{font-size:1.1rem;font-weight:600;}
p{text-wrap:pretty;}
.lead{font-size:clamp(1.08rem,1rem + .45vw,1.32rem);line-height:1.55;color:var(--text-soft);}
strong{font-weight:700;color:var(--text);}
.mut{color:inherit;}                      /* second line keeps heading color (black on light, white on dark) */
.dark .mut{color:inherit;}
.hl{background:var(--yellow);color:var(--ink);padding:0 .12em;box-decoration-break:clone;-webkit-box-decoration-break:clone;}

/* eyebrow */
.eyebrow{display:inline-flex;align-items:center;gap:.6rem;font-family:var(--font-body);font-size:.8rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--text);}
.eyebrow::before{content:"";width:1.6rem;height:.5rem;background:var(--yellow);border-radius:2px;}
.dark .eyebrow{color:var(--on-dark);}
.eyebrow--center{justify-content:center;}

/* icons */
.ico{width:1.25em;height:1.25em;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none;}

/* ---------- Layout ---------- */
.wrap{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter);}
.wrap--wide{max-width:var(--container-wide);}
.wrap--narrow{max-width:760px;}
.section{padding-block:var(--section);position:relative;}
.section--tight{padding-block:clamp(2.75rem,5vw,4.25rem);}
.grey{background:var(--grey);}
.dark{background:var(--ink);color:var(--on-dark);}
.dark h1,.dark h2,.dark h3,.dark h4{color:var(--on-dark);}
.dark .lead{color:var(--on-dark-soft);}
.head{max-width:60ch;}
.head--center{margin-inline:auto;text-align:center;}
.head .lead{margin-top:1rem;}
.head .eyebrow{margin-bottom:1.1rem;}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;flex-wrap:wrap;margin-bottom:clamp(2rem,4vw,3rem);}

/* ---------- Buttons ---------- */
.btn{
  --bg:var(--yellow);--fg:var(--ink);--bd:var(--yellow);
  display:inline-flex;align-items:center;gap:.6rem;font-family:var(--font-body);font-weight:700;font-size:.96rem;
  padding:.95rem 1.5rem;border-radius:999px;background:var(--bg);color:var(--fg);border:2px solid var(--bd);
  transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease);
}
.btn .ico{width:1.1em;height:1.1em;stroke-width:2;}
.btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-yellow);}
.btn--dark{--bg:var(--ink);--fg:#fff;--bd:var(--ink);}
.btn--dark:hover{--bg:var(--yellow);--fg:var(--ink);--bd:var(--yellow);box-shadow:var(--shadow);}
.btn--ghost{--bg:transparent;--fg:var(--text);--bd:var(--border-strong);}
.btn--ghost:hover{--bg:var(--ink);--fg:#fff;--bd:var(--ink);box-shadow:var(--shadow);}
.dark .btn--ghost{--fg:var(--on-dark);--bd:rgba(245,243,237,.3);}
.dark .btn--ghost:hover{--bg:var(--yellow);--fg:var(--ink);--bd:var(--yellow);}
.btn--lg{padding:1.1rem 1.9rem;font-size:1.02rem;}
.btn--block{width:100%;justify-content:center;}

.tlink{display:inline-flex;align-items:center;gap:.5rem;font-weight:700;color:var(--text);transition:gap .3s var(--ease),color .3s;}
.tlink .ico{width:1.05em;height:1.05em;color:var(--amber);transition:transform .3s var(--ease);}
.tlink:hover{color:var(--amber);}
.tlink:hover .ico{transform:translate(3px,-3px);}
.dark .tlink{color:var(--on-dark);}
.dark .tlink .ico{color:var(--yellow);}
.dark .tlink:hover{color:var(--yellow);}

/* ==========================================================================
   Header
   ========================================================================== */
.site-header{position:fixed;top:0;left:0;right:0;z-index:60;background:transparent;transition:transform .45s var(--ease),background .35s,box-shadow .35s,border-color .35s;border-bottom:1px solid transparent;}
.site-header__inner{max-width:var(--container-wide);margin-inline:auto;padding:.8rem var(--gutter);display:flex;align-items:center;justify-content:space-between;gap:1.5rem;}
.site-header.is-scrolled{background:rgba(250,249,246,.92);backdrop-filter:saturate(150%) blur(14px);border-bottom-color:var(--border);box-shadow:0 12px 30px -26px rgba(22,22,21,.5);}
.site-header.is-hidden{transform:translateY(-100%);}
.brand{display:flex;align-items:center;flex:none;}
.brand img{height:clamp(46px,4.6vw,56px);width:auto;}
.brand__dark{display:block;}
.brand__light{display:none;}
.brand:hover{opacity:.85;}
/* contextual header over the dark hero (interior pages, before scroll) */
body.dark-hero .site-header:not(.is-scrolled) .brand__dark{display:none;}
body.dark-hero .site-header:not(.is-scrolled) .brand__light{display:block;}
body.dark-hero .site-header:not(.is-scrolled) .nav__link{color:rgba(245,243,237,.78);}
body.dark-hero .site-header:not(.is-scrolled) .nav__link:hover,
body.dark-hero .site-header:not(.is-scrolled) .nav__link.is-active{color:#fff;}
body.dark-hero .site-header:not(.is-scrolled) .burger{background:rgba(255,255,255,.16);}
body.dark-hero .site-header:not(.is-scrolled) .header-actions .btn--dark{background:transparent;color:#fff;border-color:rgba(255,255,255,.4);}
body.dark-hero .site-header:not(.is-scrolled) .header-actions .btn--dark:hover{background:var(--yellow);color:var(--ink);border-color:var(--yellow);}

.nav{display:flex;align-items:center;gap:.15rem;}
.nav__link{display:inline-flex;align-items:center;gap:.3rem;padding:.55rem .85rem;font-weight:600;font-size:.95rem;color:var(--text-soft);border-radius:8px;transition:color .25s,background .25s;}
.nav__link .ico{width:1rem;height:1rem;opacity:.7;}
.nav__link:hover,.nav__link.is-active{color:var(--text);}
.nav__link.is-active{position:relative;}
.nav__link.is-active::after{content:"";position:absolute;left:.85rem;right:.85rem;bottom:.2rem;height:3px;background:var(--yellow);border-radius:2px;}

.has-menu{position:relative;}
.has-menu::after{content:"";position:absolute;left:-1rem;right:-1rem;top:100%;height:1rem;}
.nav__panel{position:absolute;top:calc(100% + .35rem);left:50%;transform:translateX(-50%) translateY(8px);width:min(440px,88vw);background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow);padding:.5rem;opacity:0;visibility:hidden;transition:opacity .2s,transform .2s;display:grid;grid-template-columns:1fr 1fr;gap:.2rem;}
.has-menu:hover .nav__panel,.has-menu:focus-within .nav__panel{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);}
.menu-item{display:flex;gap:.7rem;padding:.7rem;border-radius:var(--r-sm);transition:background .2s;align-items:center;}
.menu-item:hover{background:var(--grey);}
.menu-item__ic{width:2.3rem;height:2.3rem;border-radius:8px;background:var(--yellow);color:var(--ink);display:grid;place-items:center;flex:none;}
.menu-item__ic .ico{width:1.15rem;height:1.15rem;}
.menu-item__t{display:block;font-weight:600;font-size:.96rem;color:var(--text);line-height:1.2;}

.header-actions{display:flex;align-items:center;gap:1rem;flex:none;}
.header-phone{display:inline-flex;align-items:center;gap:.6rem;background:var(--yellow);color:var(--ink);font-weight:700;padding:.7rem 1.15rem;border-radius:999px;font-size:.95rem;transition:transform .3s,box-shadow .3s;}
.header-phone .ic{width:2rem;height:2rem;border-radius:50%;background:var(--ink);color:var(--yellow);display:grid;place-items:center;}
.header-phone .ic .ico{width:1rem;height:1rem;stroke-width:2;}
.header-phone:hover{transform:translateY(-2px);box-shadow:var(--shadow-yellow);}
.header-phone small{display:block;font-size:.68rem;font-weight:600;opacity:.7;line-height:1;}

.burger{display:none;width:46px;height:46px;border-radius:10px;background:var(--ink);position:relative;flex:none;}
.burger span{position:absolute;left:50%;top:50%;width:18px;height:2px;background:#fff;transform:translate(-50%,-50%);transition:.3s var(--ease);}
.burger span:nth-child(1){transform:translate(-50%,-6px);}
.burger span:nth-child(3){transform:translate(-50%,6px);}
.menu-open .burger span:nth-child(1){transform:translate(-50%,0) rotate(45deg);}
.menu-open .burger span:nth-child(2){opacity:0;}
.menu-open .burger span:nth-child(3){transform:translate(-50%,0) rotate(-45deg);}

.mobile-nav{position:fixed;inset:0;z-index:55;background:var(--ink);color:var(--on-dark);padding:6rem var(--gutter) 2.5rem;display:flex;flex-direction:column;clip-path:inset(0 0 100% 0);transition:clip-path .55s var(--ease-out);overflow-y:auto;}
.menu-open .mobile-nav{clip-path:inset(0 0 0 0);}
.mobile-nav a.m-link{font-family:var(--font-display);font-weight:700;font-size:clamp(1.6rem,7vw,2.3rem);padding:.5rem 0;border-bottom:1px solid var(--line-dark);color:var(--on-dark);display:flex;justify-content:space-between;align-items:center;}
.mobile-nav a.m-link .ico{color:var(--yellow);}
.mobile-nav a.m-link:hover{color:var(--yellow);}
.mobile-nav__foot{margin-top:auto;padding-top:2rem;display:flex;flex-direction:column;gap:.5rem;color:var(--on-dark-soft);}
.mobile-nav__foot a:not(.btn){color:var(--on-dark);font-weight:700;font-size:1.15rem;}

/* Mobile quick-action bar (call / offerte / whatsapp) */
.quickbar{display:none;}
.quickbar__btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.22rem;padding:.5rem .3rem;border-radius:12px;background:rgba(255,255,255,.09);color:#fff;font-size:.72rem;font-weight:700;line-height:1;}
.quickbar__btn .ico{width:1.3rem;height:1.3rem;stroke-width:1.9;}
.quickbar__btn--offerte{background:var(--yellow);color:var(--ink);}
.quickbar__btn--wa{background:#25d366;color:#fff;}
.quickbar__btn:active{transform:scale(.97);}

/* ==========================================================================
   Hero
   ========================================================================== */
.hero{position:relative;min-height:clamp(580px,92vh,860px);display:flex;align-items:flex-end;overflow:hidden;background:var(--ink);}
.hero__bg{position:absolute;inset:0;z-index:0;}
.hero__bg img{width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1.06);transition:transform 1.8s var(--ease-out);}
.is-ready .hero__bg img{transform:scale(1);}
.hero::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(22,22,21,.7) 0%,rgba(22,22,21,.35) 24%,rgba(22,22,21,.55) 58%,rgba(22,22,21,.92) 100%);}
.hero__inner{position:relative;z-index:2;width:100%;padding-block:clamp(2.5rem,5vw,4rem) clamp(2.8rem,7vw,5.5rem);}
.hero__content{max-width:740px;}
.hero .eyebrow{color:#fff;}
.hero__title{font-family:var(--font-display);font-weight:800;color:#fff;line-height:1.04;letter-spacing:-.025em;font-size:clamp(2.4rem,1.5rem + 3.7vw,4.7rem);margin-top:1.3rem;opacity:0;transform:translateY(18px);transition:.85s var(--ease-out) .1s;}
.is-ready .hero__title{opacity:1;transform:none;}
.hero__lead{margin-top:1.4rem;max-width:54ch;color:rgba(255,255,255,.82);font-size:clamp(1.05rem,1rem + .4vw,1.28rem);line-height:1.55;opacity:0;transform:translateY(18px);transition:.85s var(--ease-out) .25s;}
.is-ready .hero__lead{opacity:1;transform:none;}
.hero__cta{margin-top:2rem;display:flex;flex-wrap:wrap;gap:.9rem;opacity:0;transform:translateY(18px);transition:.85s var(--ease-out) .38s;}
.is-ready .hero__cta{opacity:1;transform:none;}
.hero .btn--ghost{color:#fff;border-color:rgba(255,255,255,.45);}
.hero .btn--ghost:hover{background:var(--yellow);color:var(--ink);border-color:var(--yellow);}
.hero__trust{margin-top:2.3rem;display:flex;flex-wrap:wrap;gap:.9rem 1.9rem;align-items:center;opacity:0;transform:translateY(18px);transition:.85s var(--ease-out) .5s;}
.is-ready .hero__trust{opacity:1;transform:none;}
.hero__trust span{display:inline-flex;align-items:center;gap:.6rem;color:rgba(255,255,255,.88);font-weight:600;font-size:.96rem;}
.hero__trust span::before{content:"";width:.5rem;height:.5rem;background:var(--yellow);border-radius:50%;flex:none;}

/* marquee */
.marquee{background:var(--ink);color:var(--on-dark);overflow:hidden;border-block:1px solid var(--ink);}
.marquee__track{display:flex;width:max-content;align-items:center;animation:marq 40s linear infinite;}
.marquee:hover .marquee__track{animation-play-state:paused;}
.marquee__item{display:inline-flex;align-items:center;font-family:var(--font-display);font-weight:700;font-size:clamp(1.1rem,1.6vw,1.6rem);letter-spacing:-.01em;text-transform:uppercase;padding:1.1rem 0;color:var(--on-dark);}
.marquee__sep{width:.7rem;height:.7rem;background:var(--yellow);transform:rotate(45deg);margin-inline:clamp(1.4rem,3vw,2.6rem);flex:none;}
@keyframes marq{to{transform:translateX(-50%);}}

/* ==========================================================================
   About + stats
   ========================================================================== */
.about__grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:clamp(2rem,5vw,4.5rem);align-items:center;}
.about__media{position:relative;}
.about__media img{width:100%;border-radius:var(--r-lg);aspect-ratio:5/5.4;object-fit:cover;box-shadow:var(--shadow);}
.exp-badge{position:absolute;right:-1rem;bottom:-1rem;width:clamp(118px,15vw,156px);height:clamp(118px,15vw,156px);border-radius:50%;background:var(--yellow);color:var(--ink);display:grid;place-content:center;text-align:center;box-shadow:var(--shadow);padding:1rem;}
.exp-badge b{font-family:var(--font-display);font-weight:800;font-size:clamp(2rem,4vw,2.8rem);line-height:1;}
.exp-badge span{font-weight:600;font-size:.8rem;line-height:1.2;margin-top:.3rem;}

.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:2.4rem;padding-top:2.4rem;border-top:1px solid var(--border);}
.stats--4{grid-template-columns:repeat(4,1fr);}
.stat__n{font-family:var(--font-display);font-weight:800;font-size:clamp(2.1rem,1.6rem + 1.8vw,3.1rem);line-height:1;letter-spacing:-.03em;display:flex;align-items:baseline;gap:.06em;}
.stat__n .u{color:var(--ink);font-size:.5em;}
.dark .stat__n .u{color:var(--yellow);}
.stat__l{margin-top:.5rem;color:var(--text-soft);font-size:.92rem;}
.dark .stat__l{color:var(--on-dark-soft);}

/* ==========================================================================
   Services — photo cards (NO numbering)
   ========================================================================== */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.1rem,2vw,1.6rem);}
@media (min-width:1081px){.svc-grid.cols-4{grid-template-columns:repeat(4,1fr);}}
.svc-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;display:flex;flex-direction:column;transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .4s;}
.svc-card:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:var(--border-strong);}
.svc-card__media{position:relative;aspect-ratio:16/11;overflow:hidden;}
.svc-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease-out);}
.svc-card:hover .svc-card__media img{transform:scale(1.06);}
.svc-card__body{padding:clamp(1.3rem,2.5vw,1.8rem);display:flex;flex-direction:column;flex:1;}
.svc-card__title{font-size:1.3rem;font-weight:700;}
.svc-card__desc{margin-top:.6rem;color:var(--text-soft);font-size:.95rem;flex:1;}
.svc-card__link{margin-top:1.3rem;}

/* ==========================================================================
   Why us — dark feature boxes with icons
   ========================================================================== */
.feat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line-dark);border:1px solid var(--line-dark);border-radius:var(--r-lg);overflow:hidden;}
.feat{background:var(--ink);padding:clamp(1.6rem,3vw,2.4rem);display:flex;flex-direction:column;gap:1.1rem;min-height:230px;transition:background .35s;}
.feat:hover{background:var(--ink-3);}
.feat__ic{width:3.2rem;height:3.2rem;border-radius:14px;background:var(--yellow);color:var(--ink);display:grid;place-items:center;}
.feat__ic .ico{width:1.6rem;height:1.6rem;stroke-width:1.8;}
.feat h3{font-size:1.18rem;color:var(--on-dark);margin-top:auto;}
.feat p{color:var(--on-dark-soft);font-size:.92rem;}

/* feature list (split sections) */
.feature-list{display:flex;flex-direction:column;gap:.2rem;margin-top:1.6rem;}
.feature-list li{display:flex;gap:.9rem;padding:.85rem 0;border-top:1px solid var(--border);align-items:flex-start;}
.dark .feature-list li{border-top-color:var(--line-dark);}
.feature-list .chk{width:1.5rem;height:1.5rem;border-radius:50%;background:var(--yellow);color:var(--ink);display:grid;place-items:center;flex:none;margin-top:.1rem;}
.feature-list .chk .ico{width:.9rem;height:.9rem;stroke-width:2.5;}
.feature-list b{display:block;font-weight:700;}
.feature-list span.t{color:var(--text-soft);font-size:.93rem;}
.dark .feature-list span.t{color:var(--on-dark-soft);}

/* ==========================================================================
   Split feature
   ========================================================================== */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4.5rem);align-items:center;}
.split--rev .split__media{order:2;}
.split__media{position:relative;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:5/5.4;background:var(--grey-2);box-shadow:var(--shadow);}
.split__media.wide{aspect-ratio:4/3;}
.split__media img{width:100%;height:100%;object-fit:cover;}
.split__tag{position:absolute;left:1rem;bottom:1rem;background:var(--yellow);color:var(--ink);font-size:.8rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:.5rem .9rem;border-radius:999px;}

/* ==========================================================================
   Projects gallery
   ========================================================================== */
.gallery{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(.7rem,1.5vw,1.1rem);}
.gallery figure{position:relative;border-radius:var(--r);overflow:hidden;background:var(--grey-2);}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease-out);}
.gallery figure:hover img{transform:scale(1.05);}
.gallery figcaption{position:absolute;left:1rem;bottom:1rem;background:rgba(22,22,21,.8);backdrop-filter:blur(6px);color:#fff;font-size:.82rem;font-weight:600;padding:.45rem .85rem;border-radius:999px;}
.g1{grid-column:span 8;aspect-ratio:16/10;}
.g2{grid-column:span 4;aspect-ratio:4/5;}
.g3{grid-column:span 4;aspect-ratio:4/5;}
.g4{grid-column:span 8;aspect-ratio:16/10;}

/* ==========================================================================
   Certifications band
   ========================================================================== */
.certs{display:flex;flex-wrap:wrap;gap:.8rem;}
.cert{display:inline-flex;align-items:center;gap:.6rem;padding:.7rem 1.15rem;border:1px solid var(--border);border-radius:999px;background:var(--white);font-weight:600;font-size:.95rem;transition:border-color .3s,transform .3s;}
.cert:hover{border-color:var(--yellow);transform:translateY(-2px);}
.cert .d{width:.5rem;height:.5rem;border-radius:50%;background:var(--yellow);flex:none;}
.dark .cert{background:var(--ink-2);border-color:var(--line-dark);color:var(--on-dark);}

/* cert detail grid (about page) */
.cert-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.1rem;}
.cert-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r);padding:1.4rem;display:flex;flex-direction:column;gap:.6rem;transition:transform .3s,box-shadow .3s;}
.cert-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-sm);}
.cert-card .ci{width:2.6rem;height:2.6rem;border-radius:10px;background:var(--yellow);color:var(--ink);display:grid;place-items:center;}
.cert-card b{font-family:var(--font-display);font-weight:700;font-size:1.05rem;margin-top:.3rem;color:var(--ink);}
.cert-card span{color:var(--text-soft);font-size:.88rem;line-height:1.45;}

/* ==========================================================================
   Process (subtle, clean — no big numbers)
   ========================================================================== */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1rem,2vw,1.5rem);}
.step{position:relative;padding-top:1.6rem;border-top:3px solid var(--ink);}
.dark .step{border-top-color:var(--yellow);}
.step__ic{width:3rem;height:3rem;border-radius:12px;background:var(--ink);color:var(--yellow);display:grid;place-items:center;margin-bottom:1rem;}
.dark .step__ic{background:var(--yellow);color:var(--ink);}
.step h3{font-size:1.18rem;}
.step p{margin-top:.5rem;color:var(--text-soft);font-size:.93rem;}
.dark .step p{color:var(--on-dark-soft);}

/* ==========================================================================
   CTA band
   ========================================================================== */
.cta{position:relative;overflow:hidden;border-radius:var(--r-xl);background:var(--ink);color:#fff;padding:clamp(2.8rem,6vw,5rem) clamp(1.5rem,5vw,4rem);}
.cta::before{content:"";position:absolute;inset:0;background:url(../img/airco-montage-1000.webp) center/cover;opacity:.4;}
.cta::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(22,22,21,.78) 0%,rgba(22,22,21,.9) 100%);}
.cta__inner{position:relative;z-index:2;max-width:1000px;margin-inline:auto;display:grid;grid-template-columns:1fr auto;gap:clamp(1.8rem,4vw,3.4rem);align-items:center;}
.cta .eyebrow{color:#fff;}
.cta h2{color:#fff;max-width:18ch;}
.cta__actions{display:flex;flex-direction:column;gap:1.1rem;align-items:flex-start;}
.cta .btn--dark{background:var(--yellow);color:var(--ink);border-color:var(--yellow);}
.cta .btn--dark:hover{background:#fff;color:var(--ink);border-color:#fff;}
.cta__phone{font-family:var(--font-display);font-weight:800;font-size:clamp(1.4rem,1.1rem + 1.2vw,2rem);display:inline-flex;align-items:center;gap:.6rem;color:#fff;}
.cta__phone .ico{width:1.3rem;height:1.3rem;color:var(--yellow);}
.cta__phone:hover{color:var(--yellow);}
.cta__note{width:100%;font-size:.92rem;color:rgba(255,255,255,.6);}
.cta__deco{display:none;}

/* ==========================================================================
   Page hero (interior)
   ========================================================================== */
.page-hero{padding-top:clamp(7.5rem,14vh,10rem);padding-bottom:clamp(2.5rem,5vw,4rem);background:var(--ink);color:var(--on-dark);position:relative;overflow:hidden;}
.page-hero::after{content:"";position:absolute;right:-6%;top:-40%;width:40rem;height:40rem;background:radial-gradient(circle,rgba(254,204,0,.12),transparent 62%);}
.page-hero .crumbs{display:flex;gap:.5rem;font-size:.85rem;color:var(--on-dark-soft);margin-bottom:1.4rem;position:relative;z-index:2;}
.page-hero .crumbs a:hover{color:var(--yellow);}
.page-hero .crumbs .sep{opacity:.4;}
.page-hero h1{position:relative;z-index:2;max-width:18ch;}
.page-hero__lead{position:relative;z-index:2;margin-top:1.3rem;max-width:56ch;color:var(--on-dark-soft);font-size:1.15rem;}
.page-hero__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(2rem,4vw,3.5rem);align-items:center;}
.page-hero__media{position:relative;z-index:2;aspect-ratio:4/3;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow);}
.page-hero__media img{width:100%;height:100%;object-fit:cover;}

/* prose */
.prose{max-width:68ch;}
.prose p+p{margin-top:1.1rem;}
.prose h3{margin:2rem 0 .8rem;}

/* pull quote */
.pull{font-family:var(--font-display);font-weight:700;font-size:clamp(1.4rem,1.1rem + 1.5vw,2.1rem);line-height:1.25;letter-spacing:-.02em;border-left:4px solid var(--yellow);padding-left:1.4rem;}

/* ==========================================================================
   Forms
   ========================================================================== */
.form-layout{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,4rem);align-items:start;}
.form-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);padding:clamp(1.5rem,3.5vw,2.6rem);box-shadow:var(--shadow-sm);}
.field{margin-bottom:1.1rem;}
.field label{display:block;font-weight:600;font-size:.88rem;margin-bottom:.45rem;}
.field .req{color:var(--amber);}
.field input,.field textarea,.field select{width:100%;background:var(--paper);border:1.5px solid var(--border);border-radius:10px;padding:.9rem 1rem;font-size:1rem;transition:border-color .25s,box-shadow .25s,background .25s;}
.field textarea{min-height:140px;resize:vertical;}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--yellow);box-shadow:0 0 0 3px rgba(254,204,0,.25);background:var(--white);}
.field input::placeholder,.field textarea::placeholder{color:var(--text-faint);}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem;}
.chip-row{display:flex;flex-wrap:wrap;gap:.55rem;}
.chip input{position:absolute;opacity:0;width:1px;height:1px;}
.chip span{display:inline-flex;align-items:center;gap:.4rem;padding:.55rem 1rem;border:1.5px solid var(--border);border-radius:999px;font-size:.9rem;font-weight:600;color:var(--text-soft);transition:.25s var(--ease);}
.chip input:checked+span{background:var(--ink);color:#fff;border-color:var(--ink);}
.chip input:focus-visible+span{outline:3px solid var(--yellow);outline-offset:2px;}
.form-note{font-size:.84rem;color:var(--text-soft);margin-top:.3rem;}
.form-status{padding:1rem 1.2rem;border-radius:10px;font-size:.95rem;margin-bottom:1.2rem;display:none;}
.form-status.is-ok{display:block;background:rgba(254,204,0,.18);border:1px solid var(--yellow);}
.form-status.is-err{display:block;background:#fbeaea;border:1px solid #e0b4b4;color:#7a2727;}
.form-aside{position:sticky;top:7rem;}
.contact-line{display:flex;gap:1rem;padding:1.1rem 0;border-top:1px solid var(--border);align-items:flex-start;}
.contact-line:last-child{border-bottom:1px solid var(--border);}
.contact-line .ci{width:2.6rem;height:2.6rem;border-radius:10px;background:var(--ink);color:var(--yellow);display:grid;place-items:center;flex:none;}
.contact-line .ci .ico{width:1.2rem;height:1.2rem;}
.contact-line .k{font-size:.78rem;text-transform:uppercase;letter-spacing:.1em;color:var(--text-soft);}
.contact-line .v{font-weight:700;font-size:1.05rem;margin-top:.1rem;}
.contact-line .v a:hover{color:var(--amber);}

/* contact map */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4rem);align-items:start;}
.map{border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--border);aspect-ratio:4/3;background:var(--grey-2);}
.map iframe{width:100%;height:100%;border:0;display:block;filter:grayscale(.3) contrast(1.05);}

/* empty state (vacatures) */
.empty{border:1px dashed var(--border-strong);border-radius:var(--r-lg);padding:clamp(2rem,5vw,3.5rem);text-align:center;background:var(--white);}
.empty .ei{width:3.4rem;height:3.4rem;border-radius:14px;background:var(--yellow);color:var(--ink);display:grid;place-items:center;margin-inline:auto;}
.empty h2{margin-top:1.2rem;}
.empty p{margin-top:.8rem;max-width:48ch;margin-inline:auto;color:var(--text-soft);}
.empty .btn{margin-top:1.6rem;}

/* usps (light) */
.usps{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem;}
.usp{background:var(--white);border:1px solid var(--border);border-radius:var(--r);padding:clamp(1.4rem,2.5vw,2rem);}
.usp__ic{width:3rem;height:3rem;border-radius:12px;background:var(--ink);color:var(--yellow);display:grid;place-items:center;margin-bottom:1rem;}
.usp h3{font-size:1.15rem;}
.usp p{margin-top:.5rem;color:var(--text-soft);font-size:.93rem;}

/* ==========================================================================
   Footer
   ========================================================================== */
/* certification band (top of footer, light) */
.cert-band{background:var(--white);border-bottom:1px solid var(--border);}
.cert-band__inner{padding-block:1.9rem;display:flex;flex-direction:column;gap:1.1rem;align-items:center;text-align:center;}
.cert-band__label{font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:var(--text-soft);font-weight:700;}
.cert-plates{display:flex;flex-wrap:wrap;justify-content:center;gap:.7rem;}
.cplate{height:62px;min-width:120px;padding:0 1.3rem;display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid var(--border);border-radius:12px;transition:border-color .3s,transform .3s,box-shadow .3s;}
.cplate:hover{border-color:var(--yellow);transform:translateY(-2px);box-shadow:var(--shadow-sm);}
.cplate img{max-height:34px;max-width:132px;width:auto;object-fit:contain;display:block;}
.cplate span{font-family:var(--font-display);font-weight:700;font-size:.86rem;color:var(--text);letter-spacing:-.01em;white-space:nowrap;}
.cplate--badge{flex-direction:column;gap:.1rem;line-height:1;}
.cplate--badge b{font-family:var(--font-display);font-weight:800;font-size:1.1rem;letter-spacing:-.02em;color:var(--ink);}
.cplate--badge i{font-style:normal;font-weight:700;font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-soft);white-space:nowrap;}

.site-footer{background:var(--ink);color:var(--on-dark);}
.footer-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:clamp(2rem,4vw,3rem);padding-block:clamp(3rem,6vw,5rem);}
.footer-brand img{height:50px;margin-bottom:1.4rem;}
.footer-brand p{color:var(--on-dark-soft);max-width:34ch;}
.footer-brand .btn{margin-top:1.6rem;}
.footer-col h4{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--on-dark-faint);margin-bottom:1.2rem;}
.footer-col ul{display:flex;flex-direction:column;gap:.7rem;}
.footer-col a{color:var(--on-dark-soft);transition:color .25s,padding-left .25s;}
.footer-col a:hover{color:var(--yellow);padding-left:.25rem;}
.footer-contact li{margin-bottom:1rem;color:var(--on-dark-soft);}
.footer-contact .k{display:block;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--on-dark-faint);}
.footer-contact .v{color:var(--on-dark);font-weight:600;}
.footer-contact a.v:hover{color:var(--yellow);}
.footer-bottom{border-top:1px solid var(--line-dark);padding-block:1.5rem;display:flex;flex-wrap:wrap;justify-content:space-between;gap:.8rem;color:var(--on-dark-faint);font-size:.85rem;}
.footer-bottom .sep{margin-inline:.5rem;opacity:.4;}

/* ==========================================================================
   Reveal
   ========================================================================== */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s var(--ease),transform .7s var(--ease);}
.reveal.in{opacity:1;transform:none;}
.reveal[data-d="1"]{transition-delay:.07s;}
.reveal[data-d="2"]{transition-delay:.14s;}
.reveal[data-d="3"]{transition-delay:.21s;}
.reveal[data-d="4"]{transition-delay:.28s;}
@media (prefers-reduced-motion:reduce){
  .reveal,.hero__title .ln>span,.hero__lead,.hero__row,.hero__figure img{opacity:1!important;transform:none!important;transition:none!important;}
  .marquee__track{animation:none!important;}
}

/* utilities */
.mt-1{margin-top:.6rem;}.mt-2{margin-top:1.1rem;}.mt-3{margin-top:1.8rem;}.mt-4{margin-top:2.6rem;}
.center{text-align:center;}
.muted{color:var(--text-soft);}
.flex-cta{display:flex;flex-wrap:wrap;gap:.8rem;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width:1080px){
  .footer-top{grid-template-columns:1fr 1fr;}
  .svc-grid{grid-template-columns:repeat(2,1fr);}
  .feat-grid{grid-template-columns:repeat(2,1fr);}
  .cert-grid{grid-template-columns:repeat(2,1fr);}
  .steps{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:860px){
  .nav,.header-phone,.header-actions .btn--dark{display:none;}
  .burger{display:block;}
  .quickbar{position:fixed;left:0;right:0;bottom:0;z-index:50;display:grid;grid-template-columns:repeat(3,1fr);gap:.45rem;padding:.5rem .6rem calc(.5rem + env(safe-area-inset-bottom));background:rgba(22,22,21,.97);backdrop-filter:saturate(150%) blur(8px);border-top:1px solid var(--line-dark);}
  body{padding-bottom:calc(74px + env(safe-area-inset-bottom));}
  .hero__grid{grid-template-columns:1fr;gap:2.2rem;}
  .hero__media{order:-1;}
  .hero__figure{aspect-ratio:4/3.4;}
  .about__grid{grid-template-columns:1fr;gap:3rem;}
  .exp-badge{right:1rem;bottom:1rem;}
  .stats{grid-template-columns:repeat(3,1fr);}
  .split{grid-template-columns:1fr;gap:2rem;}
  .split--rev .split__media{order:-1;}
  .cta__inner{grid-template-columns:1fr;gap:1.6rem;}
  .form-layout{grid-template-columns:1fr;}
  .form-aside{position:static;}
  .page-hero__grid{grid-template-columns:1fr;}
  .contact-grid{grid-template-columns:1fr;}
  .gallery{grid-template-columns:repeat(8,1fr);}
  .g1,.g4{grid-column:span 8;}
  .g2,.g3{grid-column:span 4;}
  .usps{grid-template-columns:1fr;}
}
@media (max-width:560px){
  .svc-grid,.feat-grid,.cert-grid,.steps{grid-template-columns:1fr;}
  .stats{grid-template-columns:1fr;gap:1rem;}
  .stats--4{grid-template-columns:repeat(2,1fr);}
  .field-row{grid-template-columns:1fr;}
  .footer-top{grid-template-columns:1fr;}
}