:root{
  --midnight:#07192d;
  --midnight2:#0b223a;
  --warm:#fbfbf8;
  --slate:#5f6975;
  --gold:#d8a54a;
  --gold2:#efc66d;
  --line:#e7e9ed;
  --shadow:0 28px 80px rgba(7,25,45,.14);
}
body{background:var(--warm);font-family:Arial,Helvetica,sans-serif}
.apple-splash{position:fixed;inset:0;z-index:99999;display:grid;place-items:center;background:#05070a;color:white;transition:opacity .85s ease,visibility .85s ease}
.apple-splash.hidden{opacity:0;visibility:hidden;pointer-events:none}
.apple-glow{position:absolute;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(216,165,74,.18),transparent 65%);filter:blur(18px);animation:glow 3s ease-in-out infinite alternate}
.apple-splash-inner{text-align:center;position:relative;animation:splashIn .9s ease both}
.apple-mark{width:110px;height:74px;margin:0 auto 24px;display:flex;align-items:center;justify-content:center;gap:10px}
.e-lines{display:grid;gap:9px;width:45px}.e-lines i{display:block;height:7px;border-radius:999px;background:white}.e-lines i:nth-child(2){width:31px}
.d-arc{width:46px;height:63px;border:8px solid var(--gold);border-left:0;border-radius:0 36px 36px 0}
.apple-name{font-size:clamp(28px,4vw,48px);font-weight:900;letter-spacing:.1em}.apple-name strong{color:var(--gold)}
.apple-sub{font-size:11px;letter-spacing:.27em;margin-top:9px;color:rgba(255,255,255,.68)}
@keyframes splashIn{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
@keyframes glow{from{transform:scale(.96);opacity:.65}to{transform:scale(1.06);opacity:1}}

.premium-header{position:sticky;top:0;z-index:100;background:rgba(251,251,248,.87);backdrop-filter:blur(18px);border-bottom:1px solid rgba(7,25,45,.08)}
.premium-nav{height:86px;display:flex;align-items:center;gap:30px}.premium-brand{display:flex;align-items:center;gap:12px;margin-right:auto;font-weight:800;letter-spacing:.04em}.premium-brand img{width:58px;height:58px;object-fit:contain}.premium-brand strong{color:var(--gold)}
.premium-menu{display:flex;gap:27px;font-size:14px;font-weight:700}.premium-menu a:hover{color:#9b6f27}.premium-cta{background:var(--midnight);color:white;padding:13px 20px;border-radius:999px;font-weight:800}
.premium-menu-toggle{display:none;border:0;background:var(--midnight);color:white;padding:8px 11px;border-radius:8px;font-size:20px}

.premium-hero{min-height:720px;position:relative;display:flex;align-items:center;overflow:hidden}.premium-hero-bg{position:absolute;inset:0;background:radial-gradient(circle at 85% 30%,rgba(216,165,74,.16),transparent 23%),linear-gradient(135deg,#fbfbf8,#f3f1eb)}
.premium-hero-grid{position:relative;display:grid;grid-template-columns:.92fr 1.08fr;gap:70px;align-items:center}.premium-copy h1{font-size:clamp(50px,6vw,78px);line-height:1.02;letter-spacing:-3px;margin:18px 0 24px}.premium-copy h1 em{font-style:normal;color:var(--gold)}.premium-copy p{font-size:20px;color:var(--slate);max-width:620px}.premium-kicker{font-size:12px;letter-spacing:.18em;font-weight:900;color:#9b6f27}.premium-actions{display:flex;gap:14px;margin-top:30px}
.premium-btn{display:inline-flex;padding:14px 22px;border-radius:999px;font-weight:800}.premium-btn.primary{background:var(--midnight);color:white}.premium-btn.secondary{border:1px solid var(--midnight);color:var(--midnight);background:white}
.premium-hero-card{position:relative}.premium-hero-card img{width:100%;height:510px;object-fit:cover;border-radius:28px;box-shadow:var(--shadow)}.floating-note{position:absolute;left:-32px;bottom:34px;background:rgba(255,255,255,.88);backdrop-filter:blur(18px);padding:20px 22px;border-radius:18px;box-shadow:0 18px 55px rgba(7,25,45,.14)}.floating-note span,.floating-note strong{display:block}.floating-note span{font-size:11px;color:#9b6f27;font-weight:900;letter-spacing:.13em}

.premium-trust{background:white;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.premium-trust-grid{display:grid;grid-template-columns:repeat(4,1fr)}.premium-trust-grid>div{padding:24px;border-right:1px solid var(--line)}.premium-trust-grid strong,.premium-trust-grid span{display:block}.premium-trust-grid span{color:var(--slate);font-size:13px;margin-top:4px}
.premium-section{padding:100px 0}.premium-section.dark{background:var(--midnight);color:white}.premium-section.pale{background:#f2f1ed}.premium-heading{max-width:760px;margin-bottom:46px}.premium-heading>span,.premium-final-cta span{font-size:12px;color:#9b6f27;font-weight:900;letter-spacing:.15em}.premium-heading h2,.premium-split h2,.premium-final-cta h2{font-size:clamp(35px,4.5vw,56px);line-height:1.08;letter-spacing:-1.5px;margin:8px 0 14px}.premium-heading p{color:var(--slate);font-size:18px}
.premium-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.premium-card{background:white;border:1px solid var(--line);border-radius:22px;overflow:hidden;box-shadow:0 12px 40px rgba(7,25,45,.07);transition:.35s}.premium-card:hover{transform:translateY(-8px);box-shadow:var(--shadow)}.premium-card img{width:100%;height:250px;object-fit:cover}.premium-card div{padding:25px}.premium-card span{color:var(--gold);font-weight:900}.premium-card h3{font-size:24px;margin:7px 0}.premium-card p{color:var(--slate)}
.premium-split{display:grid;grid-template-columns:1fr .8fr;gap:70px;align-items:center}.premium-split p{color:#c5ced8;font-size:18px;margin:18px 0}.text-link{color:var(--gold2);font-weight:800}.premium-quote{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.13);padding:42px;border-radius:24px}.premium-quote strong{display:block;font-size:27px;line-height:1.35}.premium-quote span{display:block;color:#9faebd;margin-top:16px}
.premium-projects{display:grid;grid-template-columns:1.15fr 1fr 1fr;gap:22px}.wide-project{position:relative;border-radius:24px;overflow:hidden;min-height:430px}.wide-project img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:.7s}.wide-project:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 40%,rgba(7,25,45,.88))}.wide-project:hover img{transform:scale(1.04)}.wide-project div{position:absolute;z-index:2;left:28px;bottom:26px;color:white}.wide-project span{font-size:11px;letter-spacing:.15em;color:var(--gold2);font-weight:900}.wide-project h3{font-size:24px;margin-top:6px}
.premium-final-cta{display:flex;align-items:center;justify-content:space-between;gap:35px;background:white;padding:48px;border-radius:26px;box-shadow:var(--shadow)}.premium-final-cta p{color:var(--slate)}

.reveal{opacity:0;transform:translateY(24px);transition:opacity .75s ease,transform .75s ease}.reveal.visible{opacity:1;transform:none}

@media(max-width:980px){.premium-menu,.premium-cta{display:none}.premium-menu-toggle{display:block}.premium-menu.open{display:flex;position:absolute;top:86px;left:4%;right:4%;padding:22px;background:white;flex-direction:column;border-radius:14px;box-shadow:var(--shadow)}.premium-hero-grid,.premium-split{grid-template-columns:1fr}.premium-hero-card img{height:420px}.premium-cards,.premium-projects{grid-template-columns:1fr 1fr}.premium-trust-grid{grid-template-columns:1fr 1fr}}
@media(max-width:650px){.premium-brand span{display:none}.premium-hero{padding:55px 0}.premium-copy h1{font-size:49px}.premium-hero-grid,.premium-cards,.premium-projects,.premium-trust-grid{grid-template-columns:1fr}.premium-actions{flex-direction:column;align-items:flex-start}.premium-hero-card img{height:330px}.floating-note{left:12px;right:12px}.premium-section{padding:70px 0}.premium-final-cta{flex-direction:column;align-items:flex-start}.wide-project{min-height:350px}}


/* Veiligheidsinstellingen voor de splash */
.apple-splash {
  animation: forceSplashExit .85s 3.8s forwards;
}

@keyframes forceSplashExit {
  to {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }
}

/* De homepage blijft bruikbaar wanneer JavaScript is uitgeschakeld. */
.no-js .reveal {
  opacity: 1;
  transform: none;
}


/* Fase 5 – minimalistische header met uitsluitend logo */
.premium-brand {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  margin-right: auto;
  padding: 0;
}

.premium-brand .header-logo-only {
  display: block;
  width: auto;
  height: 62px;
  max-width: 230px;
  object-fit: contain;
  border-radius: 0;
}

.premium-brand > span {
  display: none !important;
}

.premium-nav {
  min-height: 86px;
}

@media (max-width: 650px) {
  .premium-brand .header-logo-only {
    height: 52px;
    max-width: 180px;
  }
}


/* =========================================================
   FASE 7 — UNIFORME PREMIUM HEADER
   ========================================================= */

.premium-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  width: 100%;
  background: rgba(255, 255, 255, 0.94);
  border-bottom: 1px solid rgba(7, 25, 45, 0.09);
  box-shadow: 0 8px 28px rgba(7, 25, 45, 0.055);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
}

.premium-nav {
  min-height: 88px;
  height: auto;
  display: flex;
  align-items: center;
  gap: 34px;
}

.premium-brand {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  margin-right: auto;
  padding: 5px 0;
  line-height: 0;
}

.premium-brand .header-logo-only {
  display: block;
  width: auto;
  height: 58px;
  max-width: 235px;
  object-fit: contain;
  background: transparent;
  border: 0;
  border-radius: 0;
}

.premium-menu {
  display: flex;
  align-items: center;
  gap: 28px;
  margin: 0;
}

.premium-menu a {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  color: #07192d;
  font-size: 14px;
  font-weight: 750;
  text-decoration: none;
  white-space: nowrap;
  transition: color .22s ease;
}

.premium-menu a::after {
  content: "";
  position: absolute;
  left: 50%;
  right: 50%;
  bottom: 1px;
  height: 3px;
  border-radius: 999px;
  background: #d8a54a;
  transition: left .22s ease, right .22s ease;
}

.premium-menu a:hover,
.premium-menu a.is-active {
  color: #9b6f27;
}

.premium-menu a:hover::after,
.premium-menu a.is-active::after {
  left: 0;
  right: 0;
}

.premium-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 0 22px;
  border-radius: 999px;
  background: #07192d;
  color: #fff;
  font-size: 14px;
  font-weight: 800;
  box-shadow: 0 10px 24px rgba(7, 25, 45, 0.14);
  transition: transform .22s ease, background .22s ease, box-shadow .22s ease;
}

.premium-cta:hover {
  transform: translateY(-2px);
  background: #0d2a48;
  box-shadow: 0 14px 30px rgba(7, 25, 45, 0.2);
  color: #fff;
}

.premium-menu-toggle {
  display: none;
  width: 46px;
  height: 46px;
  padding: 11px;
  border: 0;
  border-radius: 12px;
  background: #07192d;
  cursor: pointer;
}

.premium-menu-toggle span {
  display: block;
  height: 2px;
  margin: 5px 0;
  border-radius: 10px;
  background: #fff;
  transition: transform .25s ease, opacity .25s ease;
}

.premium-menu-toggle.is-open span:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}

.premium-menu-toggle.is-open span:nth-child(2) {
  opacity: 0;
}

.premium-menu-toggle.is-open span:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

/* Oude headervarianten worden uitgeschakeld als ergens nog legacy CSS staat. */
.site-header,
.site-header .nav,
.site-header .brand,
.site-header .main-menu,
.site-header .header-cta {
  all: unset;
}

@media (max-width: 1020px) {
  .premium-nav {
    min-height: 78px;
    gap: 18px;
  }

  .premium-brand .header-logo-only {
    height: 52px;
    max-width: 205px;
  }

  .premium-menu-toggle {
    display: block;
    order: 3;
  }

  .premium-cta {
    order: 2;
  }

  .premium-menu {
    display: none;
    position: absolute;
    top: calc(100% + 10px);
    left: 4%;
    right: 4%;
    z-index: 1001;
    padding: 18px;
    border: 1px solid rgba(7, 25, 45, .08);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 24px 70px rgba(7, 25, 45, .17);
    flex-direction: column;
    align-items: stretch;
    gap: 3px;
  }

  .premium-menu.open {
    display: flex;
  }

  .premium-menu a {
    min-height: 48px;
    padding: 0 14px;
    border-radius: 10px;
  }

  .premium-menu a::after {
    display: none;
  }

  .premium-menu a:hover,
  .premium-menu a.is-active {
    background: #f4f1e9;
  }
}

@media (max-width: 640px) {
  .premium-nav {
    min-height: 72px;
  }

  .premium-brand .header-logo-only {
    height: 46px;
    max-width: 172px;
  }

  .premium-cta {
    display: none;
  }

  .premium-menu-toggle {
    margin-left: auto;
  }
}


/* =========================================================
   FASE 7.1 — HEADER HARD RESET
   Voorkomt dat pagina-specifieke CSS de header verandert.
   ========================================================= */

body > .premium-header,
body > .premium-header *,
body > .premium-header *::before,
body > .premium-header *::after {
  box-sizing: border-box;
}

body > .premium-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 9999 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: rgba(255,255,255,.96) !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(7,25,45,.10) !important;
  box-shadow: 0 7px 24px rgba(7,25,45,.055) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  backdrop-filter: blur(18px) !important;
}

body > .premium-header .premium-nav {
  width: min(1180px, 92%) !important;
  min-height: 82px !important;
  height: 82px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 30px !important;
}

body > .premium-header .premium-brand {
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  margin: 0 auto 0 0 !important;
  padding: 0 !important;
  line-height: 0 !important;
  text-decoration: none !important;
}

body > .premium-header .header-logo-only {
  display: block !important;
  width: auto !important;
  height: 54px !important;
  max-width: 220px !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: contain !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body > .premium-header .premium-menu {
  display: flex !important;
  align-items: center !important;
  gap: 26px !important;
  position: static !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body > .premium-header .premium-menu a {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #07192d !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  font-size: 14px !important;
  font-weight: 750 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

body > .premium-header .premium-menu a::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  right: 50% !important;
  bottom: 1px !important;
  height: 3px !important;
  border-radius: 999px !important;
  background: #d8a54a !important;
  transition: left .22s ease, right .22s ease !important;
}

body > .premium-header .premium-menu a:hover,
body > .premium-header .premium-menu a.is-active {
  color: #9b6f27 !important;
}

body > .premium-header .premium-menu a:hover::after,
body > .premium-header .premium-menu a.is-active::after {
  left: 0 !important;
  right: 0 !important;
}

body > .premium-header .premium-cta {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  min-height: 46px !important;
  margin: 0 !important;
  padding: 0 22px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #07192d !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  box-shadow: 0 10px 24px rgba(7,25,45,.14) !important;
}

body > .premium-header .premium-menu-toggle {
  display: none !important;
}

@media (max-width: 1020px) {
  body > .premium-header .premium-nav {
    min-height: 76px !important;
    height: 76px !important;
    gap: 16px !important;
  }

  body > .premium-header .header-logo-only {
    height: 48px !important;
    max-width: 190px !important;
  }

  body > .premium-header .premium-menu-toggle {
    display: block !important;
    width: 46px !important;
    height: 46px !important;
    margin: 0 !important;
    padding: 11px !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: #07192d !important;
    order: 3 !important;
  }

  body > .premium-header .premium-menu {
    display: none !important;
    position: absolute !important;
    top: calc(100% + 10px) !important;
    left: 4% !important;
    right: 4% !important;
    width: auto !important;
    padding: 18px !important;
    background: #fff !important;
    border: 1px solid rgba(7,25,45,.08) !important;
    border-radius: 18px !important;
    box-shadow: 0 24px 70px rgba(7,25,45,.17) !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 3px !important;
  }

  body > .premium-header .premium-menu.open {
    display: flex !important;
  }

  body > .premium-header .premium-menu a {
    min-height: 48px !important;
    padding: 0 14px !important;
    border-radius: 10px !important;
  }

  body > .premium-header .premium-menu a::after {
    display: none !important;
  }
}

@media (max-width: 640px) {
  body > .premium-header .premium-cta {
    display: none !important;
  }

  body > .premium-header .premium-nav {
    min-height: 70px !important;
    height: 70px !important;
  }

  body > .premium-header .header-logo-only {
    height: 44px !important;
    max-width: 170px !important;
  }
}