/* FIXT core — design system + header + componenten (auto-gegenereerd) */

/* ═══════════════════════════════════════════════
   RESET
   ═══════════════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 16px;
  line-height: 1.6;
  color: #1A1A1A;
  background: #FFFFFF;  /* ALTIJD wit — nooit transparant */
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; }
a { color: inherit; }

/* ═══════════════════════════════════════════════
   KLEURPALET (WCAG AA)
   Wit:   #FFFFFF
   Licht: #F5F4F2  (achtergrond secties)
   Lijn:  #E8E6E2  (borders)
   Sub:   #6E6B67  (contrast 4.6:1 op wit ✓)
   Zwart: #141414
   Goud:  #9A7A40  (contrast 4.5:1 op wit ✓)
   ═══════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════
   TOPBAR — zwart met WITTE tekst, altijd leesbaar
   ═══════════════════════════════════════════════ */
.topbar {
  background: #141414;
  color: rgba(255,255,255,0.80);  /* hoog contrast */
  text-align: center;
  font-size: 12px;
  letter-spacing: 0.05em;
  padding: 11px 20px;
  font-family: 'Inter', sans-serif;
}

/* ═══════════════════════════════════════════════
   NAV — wit, altijd #FFFFFF
   ═══════════════════════════════════════════════ */
.nav {
  background: #FFFFFF;  /* expliciet wit, nooit rgba */
  border-bottom: 1px solid #E8E6E2;
  position: sticky;
  top: 0;
  z-index: 200;
}
.nav-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 40px;
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.logo {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: -0.03em;
  color: #141414;
  text-decoration: none;
}
.logo-dot { color: #9A7A40; }
.nav-links { display: flex; gap: 4px; list-style: none; align-items: center; }
.nav-links a {
  font-size: 14px;
  color: #6E6B67;
  text-decoration: none;
  padding: 8px 14px;
  border-radius: 6px;
  transition: color 0.15s, background 0.15s;
  white-space: nowrap;
  font-weight: 400;
}
.nav-links a:hover { color: #141414; background: #F5F4F2; }
.nav-cta {
  background: #141414 !important;
  color: #FFFFFF !important;
  padding: 10px 20px !important;
  border-radius: 6px;
  font-weight: 600 !important;
  font-size: 13px !important;
  min-height: 42px;
  display: inline-flex !important;
  align-items: center !important;
}
.nav-cta:hover { background: #2A2A2A !important; }

/* ═══════════════════════════════════════════════
   KNOPPEN — groot, duidelijk, makkelijk klikbaar
   ═══════════════════════════════════════════════ */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-weight: 600;
  padding: 15px 32px;
  border: 2px solid transparent;
  border-radius: 8px;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.18s ease;
  min-height: 52px;
  letter-spacing: 0.01em;
  white-space: nowrap;
}
/* Primair — zwart met witte tekst */
.btn-primary {
  background: #141414;
  color: #FFFFFF;
  border-color: #141414;
}
.btn-primary:hover { background: #2A2A2A; border-color: #2A2A2A; }

/* Secundair — wit met zwarte border */
.btn-secondary {
  background: #FFFFFF;
  color: #141414;
  border-color: #141414;
}
.btn-secondary:hover { background: #F5F4F2; }

/* Ghost wit — voor op donkere foto */
.btn-ghost {
  background: rgba(255,255,255,0.12);
  color: #FFFFFF;
  border-color: rgba(255,255,255,0.50);
  backdrop-filter: blur(8px);
}
.btn-ghost:hover { background: rgba(255,255,255,0.22); border-color: #FFFFFF; }

/* ═══════════════════════════════════════════════
   HERO
   ═══════════════════════════════════════════════ */
.hero {
  position: relative;
  height: 90vh;
  min-height: 600px;
  max-height: 860px;
  overflow: hidden;
}
.hero-img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center 20%;
}
.hero-overlay {
  position: absolute; inset: 0;
  /* Donkerder overlay links-onder voor tekst leesbaarheid */
  background: linear-gradient(
    to bottom,
    rgba(0,0,0,0.08) 0%,
    rgba(0,0,0,0.10) 40%,
    rgba(0,0,0,0.55) 100%
  );
}
.hero-content {
  position: relative;
  z-index: 2;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 0 64px 68px;
  max-width: 1280px;
  margin: 0 auto;
}
.hero-label {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.20em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.65);
  margin-bottom: 14px;
  display: block;
}
.hero-title {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: clamp(2.8rem, 5.5vw, 6rem);
  font-weight: 300;
  line-height: 1.02;
  color: #FFFFFF;
  letter-spacing: -0.03em;
  margin-bottom: 18px;
}
.hero-title strong { font-weight: 700; }
.hero-sub {
  font-size: clamp(15px, 1.4vw, 17px);
  color: rgba(255,255,255,0.78);
  max-width: 400px;
  line-height: 1.65;
  margin-bottom: 32px;
  font-weight: 300;
}
.hero-btns { display: flex; gap: 12px; flex-wrap: wrap; }

/* ═══════════════════════════════════════════════
   USP STRIP — ALTIJD WITTE ACHTERGROND
   ═══════════════════════════════════════════════ */
.usp {
  background: #FFFFFF;              /* EXPLICIET WIT */
  border-bottom: 1px solid #E8E6E2;
}
.usp-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  max-width: 1280px;
  margin: 0 auto;
}
.usp-item {
  padding: 28px 24px;
  border-right: 1px solid #E8E6E2;
  display: flex;
  align-items: flex-start;
  gap: 14px;
  background: #FFFFFF; /* ook per item wit */
}
.usp-item:last-child { border-right: none; }
.usp-icon { font-size: 20px; flex-shrink: 0; margin-top: 2px; }
.usp-title { font-size: 14px; font-weight: 600; color: #1A1A1A; margin-bottom: 3px; }
.usp-desc { font-size: 13px; color: #6E6B67; line-height: 1.5; }

/* ═══════════════════════════════════════════════
   LAYOUT HELPERS
   ═══════════════════════════════════════════════ */
.section { padding: 88px 0; background: #FFFFFF; }
.section-light { padding: 88px 0; background: #F5F4F2; }
.wrap { max-width: 1280px; margin: 0 auto; padding: 0 64px; }
.eyebrow {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #9A7A40;
  margin-bottom: 12px;
  display: block;
}
.sec-h2 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: clamp(1.9rem, 3.5vw, 3.2rem);
  font-weight: 300;
  letter-spacing: -0.03em;
  color: #141414;
  line-height: 1.08;
  margin-bottom: 48px;
}
.sec-h2 strong { font-weight: 700; }

/* ═══════════════════════════════════════════════
   SETS — 3 kaarten op wit
   ═══════════════════════════════════════════════ */
.sets-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: #E8E6E2;
  border: 1px solid #E8E6E2;
  border-radius: 12px;
  overflow: hidden;
}
.set-card {
  background: #FFFFFF;
  display: flex;
  flex-direction: column;
  transition: background 0.2s;
}
.set-card:hover { background: #F5F4F2; }
.set-card:hover .set-img img { transform: scale(1.04); }
.set-img { height: 260px; overflow: hidden; position: relative; flex-shrink: 0; }
.set-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.55s ease; }
.set-tag {
  position: absolute; top: 14px; left: 14px;
  font-size: 11px; font-weight: 700; letter-spacing: 0.06em;
  text-transform: uppercase; padding: 5px 12px;
  background: #FFFFFF; color: #1A1A1A;
  border-radius: 4px;
}
.set-tag-dark { background: #141414; color: #FFFFFF; }
.set-body {
  padding: 26px 26px 30px;
  flex: 1; display: flex; flex-direction: column;
  border-top: 1px solid #E8E6E2;
  background: #FFFFFF; /* altijd wit */
}
.set-name {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 1.35rem; font-weight: 600;
  color: #141414; margin-bottom: 3px;
  letter-spacing: -0.01em;
}
.set-type { font-size: 13px; color: #6E6B67; margin-bottom: 16px; }
.set-incl { list-style: none; margin-bottom: 18px; flex: 1; }
.set-incl li {
  font-size: 13px; color: #6E6B67;
  padding: 6px 0; border-bottom: 1px solid #E8E6E2;
  display: flex; gap: 10px; align-items: center;
}
.set-incl li::before { content: '✓'; color: #9A7A40; font-size: 11px; font-weight: 700; flex-shrink: 0; }
.set-price {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 1.5rem; font-weight: 700;
  color: #141414; margin-bottom: 3px;
}
.set-price-note { font-size: 12px; color: #6E6B67; margin-bottom: 16px; }
.set-link {
  font-size: 13px; font-weight: 600; color: #141414;
  text-decoration: none;
  display: inline-flex; align-items: center; gap: 5px;
  padding-bottom: 1px; border-bottom: 2px solid #141414;
  align-self: flex-start; transition: opacity 0.15s;
}
.set-link:hover { opacity: 0.55; }

/* ═══════════════════════════════════════════════
   HOE WERKT HET — lichte achtergrond
   ═══════════════════════════════════════════════ */
.how-grid {
  display: grid; grid-template-columns: repeat(4,1fr);
  gap: 1px; background: #E8E6E2;
  border-radius: 12px; overflow: hidden;
  margin-top: 44px;
}
.how-step {
  background: #F5F4F2;  /* licht, altijd leesbaar */
  padding: 36px 26px;
}
.how-step:first-child { background: #141414; }
.how-n {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 2.2rem; font-weight: 300;
  color: #E8E6E2; line-height: 1; margin-bottom: 14px;
}
.how-step:first-child .how-n { color: #9A7A40; }
.how-t {
  font-size: 14px; font-weight: 600; color: #1A1A1A; margin-bottom: 6px;
}
.how-step:first-child .how-t { color: #FFFFFF; }
.how-d { font-size: 13px; color: #6E6B67; line-height: 1.6; }
.how-step:first-child .how-d { color: rgba(255,255,255,0.65); }

/* ═══════════════════════════════════════════════
   DETAIL STRIP — kwaliteitsfoto's
   ═══════════════════════════════════════════════ */
.detail-strip {
  display: grid; grid-template-columns: repeat(3,1fr);
  gap: 1px; background: #E8E6E2;
  border-radius: 12px; overflow: hidden;
}
.detail-item { background: #FFFFFF; overflow: hidden; }
.detail-item:hover img { transform: scale(1.04); }
.detail-item img {
  width: 100%; height: 240px; object-fit: cover;
  transition: transform 0.5s ease;
}
.detail-cap { padding: 18px 20px; background: #FFFFFF; }
.detail-cap-title { font-size: 14px; font-weight: 600; color: #1A1A1A; margin-bottom: 4px; }
.detail-cap-text { font-size: 13px; color: #6E6B67; line-height: 1.5; }

/* ═══════════════════════════════════════════════
   INSPIRATIE GRID
   ═══════════════════════════════════════════════ */
.insp-grid {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  grid-template-rows: 280px 280px;
  gap: 1px; background: #E8E6E2;
  border-radius: 12px; overflow: hidden;
}
.insp-item { overflow: hidden; position: relative; }
.insp-item:first-child { grid-row: 1 / 3; }
.insp-item img { width:100%;height:100%;object-fit:cover;transition:transform 0.55s ease; }
.insp-item:hover img { transform: scale(1.04); }
.insp-cap {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 14px 16px;
  background: linear-gradient(transparent, rgba(0,0,0,0.50));
}
.insp-cap span { font-size: 12px; color: rgba(255,255,255,0.90); font-weight: 500; }

/* ═══════════════════════════════════════════════
   SPECS GRID — altijd witte of lichte achtergrond
   ═══════════════════════════════════════════════ */
.specs-grid {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 1px; background: #E8E6E2;
  border-radius: 8px; overflow: hidden;
  margin: 24px 0 32px;
}
.spec { background: #F5F4F2; padding: 14px 16px; }
.spec-l { font-size: 10px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: #6E6B67; margin-bottom: 4px; }
.spec-v { font-size: 14px; font-weight: 600; color: #1A1A1A; }

/* ═══════════════════════════════════════════════
   KWALITEIT SPLIT — 2 kolommen
   ═══════════════════════════════════════════════ */
.kwal-split {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 1px; background: #E8E6E2;
}
.kwal-img { min-height: 480px; overflow: hidden; }
.kwal-img img { width:100%;height:100%;object-fit:cover; }
.kwal-text {
  background: #FFFFFF;  /* expliciet wit */
  padding: 72px 56px;
  display: flex; flex-direction: column; justify-content: center;
}
.kwal-text p {
  font-size: 15px; color: #6E6B67;  /* donker genoeg op wit */
  line-height: 1.8; margin-bottom: 14px; max-width: 360px;
}

/* ═══════════════════════════════════════════════
   OVER FIXT — donker blok met leesbare tekst
   ═══════════════════════════════════════════════ */
.about-split {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 1px; background: #E8E6E2;
}
.about-img { min-height: 400px; overflow: hidden; }
.about-img img { width:100%;height:100%;object-fit:cover; }
.about-dark {
  background: #141414;  /* donker blok */
  padding: 72px 56px;
  display: flex; flex-direction: column; justify-content: center;
}
/* ALLE TEKST OP DONKER BLOK — altijd hoog contrast */
.about-dark .eyebrow { color: rgba(255,255,255,0.40); }
.about-dark h3 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: clamp(1.7rem, 2.8vw, 2.5rem);
  font-weight: 300; letter-spacing: -0.02em;
  color: #FFFFFF;  /* puur wit */
  line-height: 1.1; margin-bottom: 18px;
}
.about-dark h3 strong { font-weight: 700; color: #FFFFFF; }
.about-dark p {
  font-size: 15px;
  color: rgba(255,255,255,0.72);  /* 72% wit = zichtbaar op donker */
  line-height: 1.8; margin-bottom: 28px; max-width: 340px;
}
.about-dark-btns { display: flex; gap: 12px; flex-wrap: wrap; }

/* ═══════════════════════════════════════════════
   VERTROUWEN STRIP — altijd wit
   ═══════════════════════════════════════════════ */
.trust {
  background: #FFFFFF;  /* niet grijs, niet transparant */
  border-top: 1px solid #E8E6E2;
  border-bottom: 1px solid #E8E6E2;
}
.trust-grid {
  display: grid; grid-template-columns: repeat(4,1fr);
  max-width: 1280px; margin: 0 auto;
}
.trust-item {
  background: #FFFFFF;  /* per item ook wit */
  padding: 30px 22px; border-right: 1px solid #E8E6E2; text-align: center;
}
.trust-item:last-child { border-right: none; }
.trust-icon { font-size: 22px; margin-bottom: 10px; }
.trust-title { font-size: 14px; font-weight: 600; color: #1A1A1A; margin-bottom: 4px; }
.trust-desc { font-size: 13px; color: #6E6B67; line-height: 1.5; }

/* ═══════════════════════════════════════════════
   CTA SECTIE — lichte achtergrond, donkere knoppen
   ═══════════════════════════════════════════════ */
.cta-section {
  background: #F5F4F2;  /* licht, nooit donker */
  padding: 110px 64px;
  text-align: center;
  border-top: 1px solid #E8E6E2;
}
.cta-title {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: clamp(2.2rem, 4.5vw, 4.5rem);
  font-weight: 300; letter-spacing: -0.03em;
  color: #141414;  /* zwart op licht = perfect contrast */
  line-height: 1.05; margin-bottom: 16px;
}
.cta-title strong { font-weight: 700; }
.cta-sub {
  font-size: 16px; color: #6E6B67;
  max-width: 400px; margin: 0 auto 36px;
  line-height: 1.7;
}
.cta-btns { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.cta-note { margin-top: 20px; font-size: 12px; color: #9A9490; letter-spacing: 0.04em; }

/* ═══════════════════════════════════════════════
   FOOTER — donker met EXPLICIETE lichte tekst
   ═══════════════════════════════════════════════ */
footer {
  background: #141414;  /* puur zwart */
  padding: 64px 64px 28px;
}
.footer-grid {
  display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: 40px; max-width: 1280px; margin: 0 auto 48px;
}
.footer-logo {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 1.5rem; font-weight: 700; letter-spacing: -0.03em;
  color: #FFFFFF;  /* wit */
  text-decoration: none; display: block; margin-bottom: 12px;
}
.footer-logo-dot { color: #9A7A40; }
.footer-tag {
  font-size: 13px;
  color: rgba(255,255,255,0.45);  /* duidelijk op zwart */
  line-height: 1.65; max-width: 190px;
}
.footer-col h4 {
  font-size: 10px; font-weight: 700; letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.35);  /* subtiel maar leesbaar */
  margin-bottom: 16px;
}
.footer-col ul { list-style: none; }
.footer-col li { margin-bottom: 10px; }
.footer-col a {
  font-size: 14px;
  color: rgba(255,255,255,0.65);  /* goed contrast op zwart */
  text-decoration: none; transition: color 0.15s;
}
.footer-col a:hover { color: #FFFFFF; }
.footer-bottom {
  border-top: 1px solid rgba(255,255,255,0.08);
  padding-top: 20px; display: flex; justify-content: space-between;
  align-items: center; max-width: 1280px; margin: 0 auto;
  flex-wrap: wrap; gap: 12px;
}
.footer-bottom span,
.footer-bottom a {
  font-size: 12px;
  color: rgba(255,255,255,0.30);  /* subtiel */
  text-decoration: none;
}
.footer-bottom a:hover { color: rgba(255,255,255,0.60); }

/* ═══════════════════════════════════════════════
   FADE ANIMATIE
   ═══════════════════════════════════════════════ */
.fade { opacity:0; transform:translateY(18px); transition:opacity .65s ease,transform .65s ease; }
.fade.visible { opacity:1; transform:none; }

/* ═══════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════ */
@media (max-width:1100px) {
  .wrap { padding:0 32px; }
  footer { padding:56px 32px 24px; }
  .sets-grid,.kwal-split,.about-split { grid-template-columns:1fr; }
  .usp-grid,.trust-grid { grid-template-columns:1fr 1fr; }
  .how-grid { grid-template-columns:1fr 1fr; }
  .footer-grid { grid-template-columns:1fr 1fr; gap:28px; }
  .insp-grid { grid-template-columns:1fr 1fr; grid-template-rows:auto; }
  .insp-item:first-child { grid-row:auto; }
  .hero-content { padding:0 32px 56px; }
  .nav-links li:not(:last-child) { display:none; }
  .nav-inner { padding:0 24px; }
}
@media (max-width:640px) {
  .wrap,.cta-section { padding-left:20px; padding-right:20px; }
  .section,.section-light { padding:64px 0; }
  .usp-grid,.trust-grid { grid-template-columns:1fr; }
  .how-grid { grid-template-columns:1fr; }
  .detail-strip { grid-template-columns:1fr; }
  .insp-grid { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr; gap:24px; }
  footer { padding:48px 20px 20px; }
  .hero { height:82vh; min-height:560px; }
  .hero-title { font-size:2.8rem; }
  .hero-content { padding:0 20px 48px; }
  .kwal-text,.about-dark { padding:48px 24px; }
  .cta-section { padding:72px 20px; }
}


/* ═══ FIXT UNIVERSELE HEADER (Apple-stijl) ═══ */
:root{ --fx-black:#141414; --fx-gold:#9A7A40; --fx-line:#E8E6E2; --fx-sub:#6E6B67; }
/* verberg ALLE oude navs zodat er nooit dubbel menu staat */
body > nav:not(.fixt-nav), nav.ni{ display:none !important; }
.topbar:not(.fixt-topbar){ display:none !important; }
/* oude losse mobiele menus van blog uitschakelen */
.mob-nav, .nav-hamburger:not(.fixt-burger), .nav-cart{ display:none !important; }

.fixt-topbar{
  background:#141414; color:rgba(255,255,255,.82);
  text-align:center; font:500 12px/1 'Inter',system-ui,sans-serif;
  letter-spacing:.04em; padding:10px 16px;
}
.fixt-topbar span{ white-space:nowrap; }
.fixt-nav{
  position:sticky; top:0; z-index:9000;
  background:rgba(255,255,255,.92); backdrop-filter:saturate(180%) blur(20px);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid var(--fx-line);
}
.fixt-nav-inner{
  max-width:1280px; margin:0 auto; padding:0 28px; height:60px;
  display:flex; align-items:center; justify-content:space-between; gap:20px;
}
.fixt-logo{
  font:700 1.45rem/1 'Plus Jakarta Sans',system-ui,sans-serif;
  letter-spacing:-.03em; color:var(--fx-black); text-decoration:none; flex-shrink:0;
}
.fixt-logo i{ color:var(--fx-gold); font-style:normal; }
.fixt-links{
  display:flex; align-items:center; gap:2px; list-style:none; margin:0 auto; padding:0;
}
.fixt-links a{
  font:400 14px/1 'Inter',system-ui,sans-serif; color:var(--fx-sub);
  text-decoration:none; padding:9px 13px; border-radius:7px;
  transition:color .15s,background .15s; white-space:nowrap;
}
.fixt-links a:hover{ color:var(--fx-black); background:#F5F4F2; }
.fixt-links a.active{ color:var(--fx-black); font-weight:500; }
.fixt-actions{ display:flex; align-items:center; gap:6px; flex-shrink:0; }
.fixt-cta{
  background:var(--fx-black); color:#fff !important; text-decoration:none;
  font:600 13px/1 'Inter',sans-serif; padding:11px 18px; border-radius:7px;
  white-space:nowrap; transition:background .15s;
}
.fixt-cta:hover{ background:#2A2A2A; }
/* icoon-knoppen (cart + hamburger) */
.fixt-icon{
  width:42px; height:42px; display:inline-flex; align-items:center; justify-content:center;
  background:none; border:none; cursor:pointer; border-radius:8px; color:var(--fx-black);
  transition:background .15s; text-decoration:none; position:relative;
}
.fixt-icon:hover{ background:#F5F4F2; }
.fixt-icon svg{ width:22px; height:22px; }
.fixt-cart-count{
  position:absolute; top:5px; right:5px; min-width:16px; height:16px; padding:0 4px;
  background:var(--fx-gold); color:#fff; border-radius:9px;
  font:700 10px/16px 'Inter',sans-serif; text-align:center; display:none;
}
.fixt-cart-count.on{ display:block; }
.fixt-burger{ display:none; }

/* ═══ MOBIEL OVERLAY MENU (Apple-stijl) ═══ */
.fixt-mob{
  position:fixed; inset:0; z-index:9999; background:#0E0E0E;
  transform:translateX(100%); transition:transform .32s cubic-bezier(.4,0,.2,1);
  display:flex; flex-direction:column; overflow-y:auto;
}
.fixt-mob.open{ transform:translateX(0); }
.fixt-mob-top{
  display:flex; align-items:center; justify-content:space-between;
  padding:20px 24px; border-bottom:1px solid rgba(255,255,255,.08);
}
.fixt-mob-top .fixt-logo{ color:#fff; }
.fixt-mob-close{
  background:none; border:none; color:#fff; cursor:pointer; width:32px; height:32px;
  display:flex; align-items:center; justify-content:center;
}
.fixt-mob-close svg{ width:26px; height:26px; }
.fixt-mob-links{ list-style:none; margin:0; padding:8px 0; }
.fixt-mob-links li{ border-bottom:1px solid rgba(255,255,255,.06); }
.fixt-mob-links a{
  display:flex; align-items:center; justify-content:space-between;
  padding:19px 24px; color:#fff; text-decoration:none;
  font:400 1.35rem/1 'Plus Jakarta Sans',system-ui,sans-serif; letter-spacing:-.01em;
}
.fixt-mob-links a:active{ background:rgba(255,255,255,.05); }
.fixt-mob-links a .chev{ color:rgba(255,255,255,.3); font-size:1.2rem; }
.fixt-mob-links a.accent{ color:var(--fx-gold); }
.fixt-mob-cta{
  margin:20px 24px 32px; padding:17px; text-align:center;
  background:var(--fx-gold); color:#fff; text-decoration:none; border-radius:9px;
  font:600 15px/1 'Inter',sans-serif;
}
.fixt-mob-foot{
  margin-top:auto; padding:24px; border-top:1px solid rgba(255,255,255,.08);
  display:flex; gap:18px; flex-wrap:wrap;
}
.fixt-mob-foot a{ color:rgba(255,255,255,.5); text-decoration:none; font:400 13px/1 'Inter',sans-serif; }
body.fixt-noscroll{ overflow:hidden; }

@media(max-width:980px){
  .fixt-links{ display:none; }
  .fixt-cta{ display:none; }
  .fixt-burger{ display:inline-flex; }
  .fixt-nav-inner{ padding:0 18px; }
}



/* ═══ FIXT — gedeelde componenten (PDP / shop / upsell) ═══ */
.breadcrumb{max-width:1280px;margin:0 auto;padding:18px 40px 0;font:400 13px/1 'Inter',sans-serif;color:#9a968f}
.breadcrumb a{color:#6E6B67;text-decoration:none}.breadcrumb a:hover{color:#141414}
.breadcrumb span{color:#C9C5BE;margin:0 7px}

/* ---- Productdetail (PDP) ---- */
.pdp{max-width:1280px;margin:0 auto;padding:30px 40px 80px;display:grid;
     grid-template-columns:1.05fr .95fr;gap:60px;align-items:start}
.pdp-gallery{position:sticky;top:84px}
.pdp-stage{background:#F5F4F2;border:1px solid #ECEAE6;border-radius:20px;overflow:hidden;
     aspect-ratio:1/1;display:flex;align-items:center;justify-content:center}
.pdp-stage img{width:100%;height:100%;object-fit:cover;transition:opacity .25s}
.pdp-thumbs{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.pdp-thumb{width:62px;height:62px;border-radius:11px;overflow:hidden;border:1.5px solid #E8E6E2;
     cursor:pointer;background:#F5F4F2;padding:0;transition:border-color .15s}
.pdp-thumb img{width:100%;height:100%;object-fit:cover}
.pdp-thumb.sel{border-color:#141414}
.pdp-eyebrow{font:600 12px/1 'Inter',sans-serif;letter-spacing:.13em;text-transform:uppercase;color:#9A7A40}
.pdp-title{font:700 2.3rem/1.08 'Plus Jakarta Sans',sans-serif;letter-spacing:-.03em;color:#141414;margin:12px 0 14px}
.pdp-tagline{font:400 1.02rem/1.6 'Inter',sans-serif;color:#5c5852;margin-bottom:22px;max-width:46ch}
.pdp-pricerow{display:flex;align-items:baseline;gap:12px;margin-bottom:6px}
.pdp-price{font:700 2rem/1 'Plus Jakarta Sans',sans-serif;color:#141414;letter-spacing:-.02em}
.pdp-vat{font:400 13px/1 'Inter',sans-serif;color:#9a968f}
.pdp-sku{font:500 12.5px/1 'Inter',sans-serif;color:#9A7A40;margin-bottom:26px;letter-spacing:.02em}
.pdp-block{margin-bottom:26px}
.pdp-label{font:600 13px/1 'Inter',sans-serif;color:#141414;margin-bottom:12px;display:flex;justify-content:space-between}
.pdp-label .cur{color:#6E6B67;font-weight:400}
.swatches{display:flex;gap:11px;flex-wrap:wrap}
.swatch{width:46px;height:46px;border-radius:50%;cursor:pointer;border:2px solid #fff;
     box-shadow:0 0 0 1.5px #E2DFDA;transition:box-shadow .15s,transform .12s;position:relative}
.swatch:hover{transform:translateY(-1px)}
.swatch.sel{box-shadow:0 0 0 2px #141414}
.swatch.sel::after{content:"";position:absolute;inset:-9px;border:1px solid #141414;border-radius:50%;opacity:.25}
.pdp-buy{display:flex;flex-direction:column;gap:10px;margin-top:8px}
.pdp-add{display:inline-flex;align-items:center;justify-content:center;gap:9px;background:#141414;color:#fff;
     border:none;cursor:pointer;padding:17px 28px;border-radius:10px;font:600 15px/1 'Inter',sans-serif;
     transition:background .15s;width:100%}
.pdp-add:hover{background:#2A2A2A}
.pdp-add svg{width:19px;height:19px}
.pdp-assure{display:flex;flex-direction:column;gap:11px;margin-top:24px;padding-top:24px;border-top:1px solid #ECEAE6}
.pdp-assure div{display:flex;align-items:center;gap:11px;font:400 13.5px/1.4 'Inter',sans-serif;color:#5c5852}
.pdp-assure svg{width:18px;height:18px;color:#9A7A40;flex-shrink:0}

/* ---- Specs ---- */
.specs{max-width:1280px;margin:0 auto;padding:0 40px 70px;display:grid;grid-template-columns:1fr 1fr;gap:26px}
.spec-card{background:#F8F7F5;border:1px solid #ECEAE6;border-radius:16px;padding:26px 28px}
.spec-card h4{font:600 14px/1 'Inter',sans-serif;color:#141414;margin-bottom:16px;letter-spacing:.02em}
.spec-card ul{list-style:none}
.spec-card li{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px solid #ECEAE6;
     font:400 13.5px/1.4 'Inter',sans-serif;color:#6E6B67}
.spec-card li:last-child{border-bottom:none}
.spec-card li span{color:#141414;font-weight:500;text-align:right}

/* ---- Upsell / cross-sell ---- */
.upsell{background:#FAFAF8;border-top:1px solid #ECEAE6;padding:64px 0}
.upsell-inner{max-width:1280px;margin:0 auto;padding:0 40px}
.upsell-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:30px}
.up-card{background:#fff;border:1px solid #E8E6E2;border-radius:16px;overflow:hidden;
     display:flex;flex-direction:column;transition:box-shadow .18s,transform .18s}
.up-card:hover{box-shadow:0 14px 34px rgba(20,20,20,.08);transform:translateY(-3px)}
.up-thumb{aspect-ratio:4/3;background:#F5F4F2;overflow:hidden}
.up-thumb img{width:100%;height:100%;object-fit:cover}
.up-body{padding:18px 20px 22px;display:flex;flex-direction:column;flex:1}
.up-cat{font:600 11px/1 'Inter',sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#9A7A40}
.up-name{font:600 15.5px/1.3 'Inter',sans-serif;color:#141414;margin:8px 0 5px}
.up-desc{font:400 13px/1.5 'Inter',sans-serif;color:#6E6B67;flex:1}
.up-foot{display:flex;align-items:center;justify-content:space-between;margin-top:16px}
.up-price{font:700 16px/1 'Plus Jakarta Sans',sans-serif;color:#141414}
.up-price small{font:400 11px/1 'Inter',sans-serif;color:#9a968f;display:block;margin-top:3px}
.up-btn{background:#141414;color:#fff;border:none;cursor:pointer;padding:11px 16px;border-radius:8px;
     font:600 12.5px/1 'Inter',sans-serif;transition:background .15s;text-decoration:none;display:inline-block}
.up-btn:hover{background:#2A2A2A}
.up-tag{display:inline-block;background:#F2EAD9;color:#9A7A40;font:600 11px/1 'Inter',sans-serif;
     padding:5px 9px;border-radius:6px;margin-left:8px}

/* ---- Shop overzicht ---- */
.shop-head{max-width:1280px;margin:0 auto;padding:34px 40px 8px}
.shop-head h1{font:700 2.5rem/1.05 'Plus Jakarta Sans',sans-serif;letter-spacing:-.035em;color:#141414}
.shop-head p{font:400 1.05rem/1.6 'Inter',sans-serif;color:#6E6B67;margin-top:12px;max-width:54ch}
.shop-filters{max-width:1280px;margin:22px auto 0;padding:0 40px;display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.filt{background:#fff;border:1.5px solid #E2DFDA;color:#5c5852;cursor:pointer;padding:9px 16px;border-radius:30px;
     font:500 13px/1 'Inter',sans-serif;transition:all .15s}
.filt:hover{border-color:#141414;color:#141414}
.filt.on{background:#141414;border-color:#141414;color:#fff}
.shop-grid{max-width:1280px;margin:0 auto;padding:26px 40px 90px;display:grid;
     grid-template-columns:repeat(3,1fr);gap:24px}
.pc{background:#fff;border:1px solid #E8E6E2;border-radius:18px;overflow:hidden;display:flex;flex-direction:column;
     transition:box-shadow .2s,transform .2s;text-decoration:none}
.pc:hover{box-shadow:0 18px 44px rgba(20,20,20,.09);transform:translateY(-4px)}
.pc-thumb{aspect-ratio:1/1;background:#F5F4F2;overflow:hidden;position:relative}
.pc-thumb img{width:100%;height:100%;object-fit:cover;transition:opacity .2s}
.pc-badge{position:absolute;top:13px;left:13px;background:#141414;color:#fff;font:600 10.5px/1 'Inter',sans-serif;
     letter-spacing:.04em;padding:6px 10px;border-radius:6px}
.pc-body{padding:18px 20px 22px;display:flex;flex-direction:column;flex:1}
.pc-cat{font:600 11px/1 'Inter',sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#9A7A40}
.pc-name{font:600 16px/1.3 'Inter',sans-serif;color:#141414;margin:8px 0 4px}
.pc-desc{font:400 13px/1.5 'Inter',sans-serif;color:#6E6B67;flex:1}
.pc-sw{display:flex;gap:6px;margin:14px 0 0}
.pc-sw i{width:18px;height:18px;border-radius:50%;display:block;box-shadow:0 0 0 1px #E2DFDA inset}
.pc-foot{display:flex;align-items:flex-end;justify-content:space-between;margin-top:15px}
.pc-price{font:700 18px/1 'Plus Jakarta Sans',sans-serif;color:#141414}
.pc-price s{display:block;font:400 12px/1 'Inter',sans-serif;color:#9c9890;margin-bottom:3px}
.pc-price small{font:400 11px/1 'Inter',sans-serif;color:#9a968f;font-weight:400}
.pc-cta{background:#F5F4F2;color:#141414;border-radius:8px;padding:10px 15px;font:600 12.5px/1 'Inter',sans-serif;
     transition:background .15s}
.pc:hover .pc-cta{background:#141414;color:#fff}

@media(max-width:1100px){
  .pdp{grid-template-columns:1fr;gap:34px}.pdp-gallery{position:static}
  .pdp-stage{max-width:520px}
  .upsell-grid,.shop-grid{grid-template-columns:1fr 1fr}
  .breadcrumb,.pdp,.specs,.shop-head,.shop-filters,.shop-grid,.upsell-inner{padding-left:28px;padding-right:28px}
}
@media(max-width:680px){
  .pdp-title{font-size:1.85rem}.specs{grid-template-columns:1fr}
  .upsell-grid,.shop-grid{grid-template-columns:1fr}
  .shop-head h1{font-size:2rem}
  .breadcrumb,.pdp,.specs,.shop-head,.shop-filters,.shop-grid,.upsell-inner{padding-left:20px;padding-right:20px}
}
