﻿/* â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•
   CeesCards â€” Main Stylesheet
   â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â•â• */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --bg:        #F8F7F4;
  --surface:   #FFFFFF;
  --navy:      #1E3A8A;
  --navy-soft: #2B4FB3;
  --yellow:    #FFD700;
  --yellow-dk: #E6B800;
  --text:      #1A1A2E;
  --muted:     #6B6B80;
  --radius:    6px;
}

html { scroll-behavior: smooth; }
html, body { overflow-x: hidden; }
body { background: var(--bg); color: var(--text); font-family: 'Inter', sans-serif; }
img { max-width: 100%; height: auto; }
a { color: inherit; }

/* â”€â”€â”€ HEADER â”€â”€â”€ */
.site-header {
  position: sticky; top: 0; z-index: 100;
  background: var(--surface);
  border-bottom: 1px solid rgba(30,58,138,.1);
  box-shadow: 0 2px 16px rgba(30,58,138,.07);
}
.header-inner {
  max-width: 1320px; margin: 0 auto;
  padding: 0 24px; height: 72px;
  display: flex; align-items: center; gap: 20px;
}

/* Logo */
.site-logo { display: flex; align-items: center; flex-shrink: 0; text-decoration: none; }
.site-logo img,
.site-logo .custom-logo {
  height: 38px !important; max-height: 38px !important; width: auto !important;
  mix-blend-mode: multiply;
}
.logo-fallback { display: flex; align-items: center; gap: 10px; }
.logo-mark {
  width: 42px; height: 42px; background: var(--navy);
  border-radius: 10px; display: flex; align-items: center; justify-content: center;
  font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 14px;
  color: var(--yellow); border: 2px solid var(--yellow);
}
.logo-text { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 22px; color: var(--navy); }
.logo-text span { color: var(--yellow-dk); }

/* Navigatie */
.site-nav { flex: 1; }
.site-nav > ul { display: flex; gap: 2px; list-style: none; }
.site-nav > ul > li { position: relative; }

.site-nav a {
  display: flex; align-items: center; gap: 5px;
  padding: 7px 11px; font-size: 14px; font-weight: 600;
  color: var(--text); text-decoration: none;
  border-radius: var(--radius);
  transition: background .15s, color .15s; white-space: nowrap;
}
.site-nav > ul > li > a:hover,
.site-nav > ul > li:hover > a { background: rgba(30,58,138,.06); color: var(--navy); }

.site-nav a.nav-highlight { color: var(--navy); background: var(--yellow); font-weight: 700; }
.site-nav a.nav-highlight:hover { background: var(--yellow-dk); }

.site-nav a.nav-verkoop {
  color: #fff; background: linear-gradient(135deg, #16A34A, #15803D);
  position: relative;
  padding: 7px 24px 7px 12px; margin: 0 2px; gap: 7px;
  animation: verkoop-pulse 2.5s ease-in-out infinite;
}
.site-nav a.nav-verkoop:hover { transform: translateY(-1px); }
@keyframes verkoop-pulse {
  0%,100% { box-shadow: 0 0 0 0 rgba(22,163,74,.4); }
  50%      { box-shadow: 0 0 0 6px rgba(22,163,74,0); }
}

/* Chevron */
.menu-arrow {
  display: inline-block; width: 9px; height: 9px;
  border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translateY(-2px); transition: transform .2s;
  flex-shrink: 0; opacity: .6;
}
.site-nav > ul > li:hover .menu-arrow { transform: rotate(-135deg) translateY(-2px); }

/* Dropdown (legacy sub-menu, blijft bruikbaar) */
.sub-menu {
  display: none; position: absolute; top: calc(100% + 10px); left: 0;
  background: white; border: 1px solid rgba(30,58,138,.1);
  border-radius: 12px; box-shadow: 0 18px 44px rgba(30,58,138,.16);
  min-width: 220px; padding: 8px; z-index: 200; list-style: none;
}
.site-nav > ul > li:hover > .sub-menu,
.site-nav > ul > li:focus-within > .sub-menu { display: block; }
.sub-menu li a {
  border-radius: 6px; padding: 9px 12px;
  font-size: 13.5px; font-weight: 500; color: var(--text);
  display: block;
}
.sub-menu li a:hover { background: rgba(30,58,138,.05); color: var(--navy); }
.sub-menu .menu-divider { height: 1px; background: rgba(30,58,138,.07); margin: 6px 0; }

/* ── Mega menu (Pokémon + Klantenservice) ── */
.mega-menu {
  display: none; position: absolute; top: calc(100% + 10px); left: 0;
  background: #fff; border: 1px solid rgba(30,58,138,.1);
  border-radius: 14px; box-shadow: 0 20px 50px rgba(30,58,138,.16);
  z-index: 200; padding: 14px;
}
/* Onzichtbare brug zodat de muis het 10px-gat overbrugt (geen "gap of death") */
.mega-menu::before, .sub-menu::before {
  content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 14px;
}
.site-nav > ul > li:hover > .mega-menu,
.site-nav > ul > li:focus-within > .mega-menu { display: block; }
/* Subtiele entree-animatie */
.mega-menu, .sub-menu { animation: cc-mega-in .16s ease; }
@keyframes cc-mega-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } }

.mega-pokemon { width: 720px; }
.mega-service { width: 660px; left: auto; right: 0; }
.mega-service .mega-label { white-space: nowrap; }

.mega-grid { display: grid; gap: 6px; }
.mega-grid-3 { grid-template-columns: 1.15fr 1.15fr 1.3fr; }
.mega-grid-2 { grid-template-columns: 1fr 1fr; }

.mega-col { padding: 6px 8px; }
.mega-grid-2 .mega-col + .mega-col,
.mega-grid-3 .mega-col + .mega-col { border-left: 1px solid rgba(30,58,138,.07); }
.mega-label {
  font-size: 10px; font-weight: 800; letter-spacing: .1em;
  text-transform: uppercase; color: var(--muted); padding: 4px 10px 8px; display: block;
}
/* Sub-label per serie (era) in de sets-kolom */
.mega-sublabel {
  display: flex; align-items: center; gap: 9px;
  font-size: 10.5px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase;
  color: var(--navy); padding: 13px 10px 7px; margin-top: 6px;
  border-top: 1px solid rgba(30,58,138,.07);
}
.mega-sublabel::before {
  content: ""; flex-shrink: 0; width: 16px; height: 2.5px; border-radius: 2px;
  background: var(--yellow);
}
.mega-sublabel:first-of-type { margin-top: 0; border-top: none; padding-top: 2px; }
/* Mega-links met telling rechts uitgelijnd */
.mega-col > a {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 8px 10px; border-radius: 8px; font-size: 13.5px; font-weight: 600;
  color: var(--text); text-decoration: none; transition: background .12s, color .12s;
}
.mega-col > a:hover { background: rgba(30,58,138,.06); color: var(--navy); }
.mega-count {
  font-size: 11px; font-weight: 700; color: var(--muted);
  background: rgba(30,58,138,.06); border-radius: 20px; padding: 1px 8px; min-width: 26px; text-align: center;
}
.mega-col > a:hover .mega-count { background: rgba(30,58,138,.12); color: var(--navy); }
.mega-allsets { color: var(--navy) !important; font-weight: 800 !important; margin-top: 4px; }
.mega-allsets:hover { background: rgba(255,215,0,.16) !important; }
.mega-menu .menu-divider { height: 1px; background: rgba(30,58,138,.08); margin: 6px 10px; }

/* Promo-kolom (conversie) */
.mega-col-promo { padding: 0 4px; }
.mega-promo {
  background: linear-gradient(150deg, #20307a, #1E3A8A);
  border-radius: 12px; padding: 16px 16px 14px; color: #fff; position: relative; overflow: hidden;
}
.mega-promo::after {
  content: ""; position: absolute; right: -30px; top: -30px; width: 110px; height: 110px;
  background: radial-gradient(circle, rgba(255,215,0,.35), transparent 70%);
}
.mega-promo-tag {
  display: inline-block; background: var(--yellow); color: var(--navy);
  font-size: 11px; font-weight: 800; padding: 3px 10px; border-radius: 20px; margin-bottom: 10px;
}
.mega-promo-title { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 19px; color: #fff; margin: 0 0 4px; }
.mega-promo-text { font-size: 12.5px; line-height: 1.5; color: rgba(255,255,255,.82); margin: 0 0 14px; position: relative; }
.mega-promo-btn {
  display: inline-block; background: var(--yellow); color: var(--navy) !important;
  font-weight: 800; font-size: 13px; padding: 9px 18px; border-radius: 8px; text-decoration: none;
  transition: transform .12s, background .12s;
}
.mega-promo-btn:hover { background: var(--yellow-dk); transform: translateY(-1px); }
.mega-usps { display: flex; flex-direction: column; gap: 6px; padding: 12px 6px 4px; }
.mega-usps span { font-size: 12px; font-weight: 600; color: var(--navy); }

/* "Voor verzamelaars"-blok in mega-menu */
.mega-collectors { margin-top: 14px; padding-top: 12px; border-top: 1px solid rgba(30,58,138,.08); }
.mega-collectors a {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 8px 10px; border-radius: 8px; font-size: 13.5px; font-weight: 600;
  color: var(--text); text-decoration: none; transition: background .12s, color .12s;
}
.mega-collectors a:hover { background: rgba(30,58,138,.06); color: var(--navy); }
/* Icoon in vaste-breedte kolom → tekst lijnt netjes uit over de rijen */
.mega-collectors .mega-ci-wrap { display: inline-flex; align-items: center; gap: 9px; min-width: 0; }
.mega-collectors .mega-ci { width: 18px; flex-shrink: 0; text-align: center; font-size: 14px; line-height: 1; }
/* Kop "Voor verzamelaars" exact boven de iconen uitlijnen */
.mega-collectors .mega-label { padding-left: 10px; }

/* Volle-breedte CTA onderaan mega */
.mega-foot-cta {
  display: block; margin-top: 10px; padding: 12px 16px; border-radius: 10px;
  background: var(--navy); color: #fff !important; text-align: center;
  font-weight: 700; font-size: 13.5px; text-decoration: none; transition: background .12s;
}
/* Lay-out-override: de algemene .site-nav a (flex + nowrap) mag de CTA niet platdrukken */
.site-nav a.mega-foot-cta { display: block; padding: 12px 16px; gap: 0; white-space: normal; text-align: center; }
.mega-foot-cta:hover { background: var(--navy-soft); }
.mega-foot-wa { background: #16A34A; }
.mega-foot-wa:hover { background: #15803D; }

/* Header acties */
.header-actions { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.btn-icon {
  width: 38px; height: 38px; border: none; background: transparent;
  border-radius: var(--radius); display: flex; align-items: center; justify-content: center;
  cursor: pointer; color: var(--text); transition: background .15s;
  text-decoration: none;
}
.btn-icon:hover { background: rgba(30,58,138,.06); }

.cart-btn {
  display: flex; align-items: center; gap: 8px;
  padding: 0 16px; height: 40px; background: var(--navy); color: #fff;
  border: none; border-radius: var(--radius);
  font-family: 'Inter', sans-serif; font-size: 14px; font-weight: 600;
  cursor: pointer; transition: background .15s, transform .1s;
  position: relative; text-decoration: none;
}
.cart-btn:hover { background: var(--navy-soft); transform: translateY(-1px); }
.cart-count {
  position: absolute; top: -7px; right: -7px;
  background: var(--yellow); color: var(--navy);
  font-size: 10px; font-weight: 800; width: 18px; height: 18px;
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
  transition: transform .2s;
}
@keyframes cart-pulse {
  0%   { transform: scale(1); }
  30%  { transform: scale(1.5); }
  60%  { transform: scale(.9); }
  100% { transform: scale(1); }
}
.cart-count.pulse { animation: cart-pulse .5s ease; }
@keyframes cart-btn-shake {
  0%,100% { transform: translateY(0); }
  20%     { transform: translateY(-4px); }
  50%     { transform: translateY(-2px); }
  70%     { transform: translateY(-3px); }
}
.cart-btn.added { animation: cart-btn-shake .4s ease; }

/* â”€â”€â”€ SEARCH + TIMER BAR â”€â”€â”€ */
.search-bar {
  background: var(--surface); border-bottom: 1px solid rgba(30,58,138,.08);
  padding: 10px 24px; position: sticky; top: 72px; z-index: 99;
  box-shadow: 0 2px 8px rgba(30,58,138,.06);
}
.search-bar-inner { max-width: 1280px; margin: 0 auto; display: flex; align-items: center; gap: 16px; }
.search-input-wrap { flex: 1; position: relative; }
.search-input-wrap svg {
  position: absolute; left: 14px; top: 50%; transform: translateY(-50%);
  color: var(--muted); pointer-events: none;
}
.search-input {
  width: 100%; height: 42px; padding: 0 90px 0 42px;
  background: var(--bg); border: 1.5px solid rgba(30,58,138,.12);
  border-radius: var(--radius); font-family: 'Inter', sans-serif;
  font-size: 14px; color: var(--text); outline: none;
  transition: border-color .15s, box-shadow .15s;
}
.search-input::placeholder { color: var(--muted); }
.search-input:focus { border-color: var(--navy); box-shadow: 0 0 0 3px rgba(30,58,138,.08); }
.search-submit {
  position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
  background: var(--navy); color: #fff; border: none; border-radius: 4px;
  padding: 6px 14px; font-size: 13px; font-weight: 600;
  font-family: 'Inter', sans-serif; cursor: pointer; transition: background .15s;
}
.search-submit:hover { background: var(--navy-soft); }

/* Timer */
.timer-block {
  display: flex; align-items: center; gap: 12px;
  flex-shrink: 0; padding: 0 0 0 20px; border-left: 1px solid rgba(30,58,138,.1);
}
.timer-icon { font-size: 20px; flex-shrink: 0; }
.timer-text-wrap { display: flex; flex-direction: column; gap: 1px; }
.timer-title { font-size: 12px; font-weight: 700; color: var(--navy); white-space: nowrap; }
.timer-sub { font-size: 11px; color: var(--muted); white-space: nowrap; }
.timer-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: #22C55E; box-shadow: 0 0 6px #22C55E;
  flex-shrink: 0; animation: blinkDot 2s ease-in-out infinite;
}
@keyframes blinkDot { 0%,100%{opacity:1;} 50%{opacity:.25;} }
.timer-countdown {
  font-family: 'Plus Jakarta Sans', sans-serif; font-size: 20px; font-weight: 800;
  color: var(--navy); letter-spacing: .5px; white-space: nowrap; min-width: 72px;
}
.timer-countdown.urgent { color: #EF4444; }

/* Autocomplete */
.autocomplete-dropdown {
  display: none; position: absolute; top: calc(100% + 4px); left: 0; right: 0;
  background: white; border: 1px solid rgba(30,58,138,.12); border-radius: 10px;
  box-shadow: 0 16px 40px rgba(30,58,138,.15); z-index: 300; overflow: hidden;
}
.autocomplete-dropdown.open { display: block; }
.autocomplete-item {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 16px; text-decoration: none; color: var(--text); transition: background .1s;
}
.autocomplete-item:hover { background: rgba(30,58,138,.04); }
.autocomplete-item-img {
  width: 36px; height: 36px; border-radius: 6px;
  background: rgba(30,58,138,.06); display: flex; align-items: center;
  justify-content: center; font-size: 18px; flex-shrink: 0;
}
.autocomplete-item-img img { width: 100%; height: 100%; object-fit: cover; border-radius: 6px; }
.autocomplete-item-name { font-size: 13.5px; font-weight: 600; color: var(--navy); }
.autocomplete-item-sub { font-size: 11px; color: var(--muted); }
.autocomplete-item-price { margin-left: auto; font-family: 'Plus Jakarta Sans', sans-serif; font-size: 14px; font-weight: 800; color: var(--navy); }
.autocomplete-label { font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); padding: 10px 16px 4px; }
.autocomplete-divider { height: 1px; background: rgba(30,58,138,.07); margin: 4px 0; }

/* â”€â”€â”€ HERO â”€â”€â”€ */
.hero {
  max-width: 1280px; margin: 0 auto; padding: 72px 24px 64px;
  display: grid; grid-template-columns: 1fr 480px; gap: 48px; align-items: center;
}
.hero h1 {
  font-family: 'Plus Jakarta Sans', sans-serif; font-size: clamp(34px, 3.6vw, 50px);
  font-weight: 800; line-height: 1.08; letter-spacing: -1px;
  color: var(--navy); margin-bottom: 20px;
}
.hero h1 em {
  font-style: normal; position: relative; display: inline-block;
}
.hero h1 em::after {
  content: ''; position: absolute; bottom: 4px; left: 0; right: 0;
  height: 6px; background: var(--yellow); border-radius: 3px; z-index: -1; opacity: .9;
}
.hero-sub {
  font-size: 17px; line-height: 1.65; color: var(--muted);
  max-width: 440px; margin-bottom: 36px;
}
.hero-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 36px; }
/* Gele hero-hoofdknop: opvallend, met merkkleur-accent */
.hero-actions .btn-hero-yellow {
  background: var(--yellow); color: var(--navy) !important;
  font-weight: 800; font-size: 16px; padding: 16px 34px;
  box-shadow: 0 6px 20px rgba(255,186,0,.42);
}
.hero-actions .btn-hero-yellow:hover {
  background: var(--yellow-dk); color: var(--navy) !important;
  box-shadow: 0 10px 26px rgba(255,186,0,.5);
}

.btn-primary {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 14px 28px; background: var(--navy); color: #fff;
  font-family: 'Inter', sans-serif; font-size: 15px; font-weight: 600;
  border-radius: var(--radius); text-decoration: none;
  transition: background .15s, transform .15s, box-shadow .15s;
  box-shadow: 0 4px 14px rgba(30,58,138,.25);
}
.btn-primary:hover { background: var(--navy-soft); transform: translateY(-2px); box-shadow: 0 8px 20px rgba(30,58,138,.3); }

.btn-secondary {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 14px 28px; background: var(--yellow); color: var(--navy);
  font-family: 'Inter', sans-serif; font-size: 15px; font-weight: 700;
  border-radius: var(--radius); text-decoration: none;
  transition: background .15s, transform .15s;
}
.btn-secondary:hover { background: var(--yellow-dk); transform: translateY(-2px); }

.hero-trust { display: flex; align-items: center; gap: 12px 16px; padding-top: 24px; border-top: 1px solid rgba(30,58,138,.1); flex-wrap: wrap; }
/* Mobiele premium-hero: alleen op telefoon (desktop houdt z'n eigen 2-koloms hero) */
.hero-mobile { display: none; }
.hero-microtrust { flex-basis: 100%; display: flex; flex-wrap: wrap; gap: 6px 20px; font-size: 13px; font-weight: 500; color: var(--muted); line-height: 1.4; }
.hero-microtrust span { display: inline-flex; align-items: center; gap: 7px; }
.hero-microtrust svg { color: var(--navy); opacity: .65; flex-shrink: 0; }
.trust-item { display: flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 600; color: var(--navy); }
.trust-divider { width: 1px; height: 18px; background: rgba(30,58,138,.15); }
.trust-svg { flex-shrink: 0; color: var(--navy); }
.trust-item:first-child .trust-svg { color: var(--yellow-dk); }
.trust-item strong { font-weight: 800; }
.hero-stars { display: inline-flex; align-items: center; gap: 1px; color: var(--yellow-dk); }
.hero-stars svg { display: block; }

/* Hero visueel */
.hero-visual { position: relative; display: flex; justify-content: center; align-items: center; }
.hero-glow {
  position: absolute; width: 320px; height: 320px;
  background: radial-gradient(circle, rgba(255,215,0,.25) 0%, transparent 70%);
  border-radius: 50%; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 0;
}
.product-hero-card {
  position: relative; z-index: 1; width: 280px; border-radius: 16px;
  background: linear-gradient(160deg, #0f2460 0%, #1a3a8f 40%, #0a1a4f 100%);
  padding: 20px;
  box-shadow: 0 30px 60px rgba(30,58,138,.4), 0 0 0 1px rgba(255,215,0,.2), inset 0 1px 0 rgba(255,255,255,.1);
  animation: heroFloat 4s ease-in-out infinite;
}
@keyframes heroFloat { 0%,100%{transform:translateY(0) rotate(-1deg);} 50%{transform:translateY(-12px) rotate(1deg);} }
.product-hero-img { width: 100%; height: 210px; object-fit: contain; background: #fff; padding: 12px; border-radius: 10px; margin-bottom: 16px; display: block; }
.product-hero-name { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 15px; color: #fff; margin-bottom: 4px; }
.product-hero-sub { font-size: 12px; color: rgba(255,255,255,.5); margin-bottom: 14px; }
.product-hero-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.product-hero-price { min-width: 0; flex: 1 1 auto; }
.product-hero-price strong { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 22px; font-weight: 800; color: var(--yellow); white-space: nowrap; display: block; }
.product-hero-price strong .woocommerce-Price-amount,
.product-hero-price strong .woocommerce-Price-currencySymbol { white-space: nowrap; }
.product-hero-price span { font-size: 11px; color: rgba(255,255,255,.4); display: block; white-space: nowrap; }
.product-hero-cta {
  background: var(--yellow); color: var(--navy); border: none; border-radius: var(--radius);
  padding: 9px 14px; font-family: 'Inter', sans-serif; font-size: 13px; font-weight: 700;
  cursor: pointer; transition: background .15s; text-decoration: none; display: inline-block;
  white-space: nowrap; flex-shrink: 0;
}
.product-hero-cta:hover { background: var(--yellow-dk); }
.product-hero-badge {
  position: absolute; top: -10px; right: -10px; background: #EF4444; color: white;
  font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 11px;
  padding: 5px 12px; border-radius: 20px; box-shadow: 0 4px 14px rgba(239,68,68,.4);
}

.floating-pill {
  position: absolute; background: white; border-radius: 40px; padding: 9px 14px;
  display: flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 600;
  color: var(--navy); box-shadow: 0 8px 24px rgba(30,58,138,.14); z-index: 2;
}
.pill-1 { top: 0; right: -10px; animation: float 3.5s ease-in-out infinite; }
.pill-2 { bottom: 30px; left: -20px; animation: float 3.5s ease-in-out infinite 1.75s; }
@keyframes float { 0%,100%{transform:translateY(0);} 50%{transform:translateY(-7px);} }
.pill-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.dot-green { background: #22C55E; }
.dot-yellow { background: var(--yellow-dk); }

/* â”€â”€â”€ USP STRIP â”€â”€â”€ */
/* Drops-sectie wrapper (desktop: gewoon lichte achtergrond) */
.cc-drops-wrap { background: var(--bg); }

/* Navy USP-strip (desktop, zoals de homepage hoort) */
.usp-strip { background: var(--navy); }
.usp-inner { max-width: 1280px; margin: 0 auto; padding: 0 24px; display: grid; grid-template-columns: repeat(4, 1fr); }
.usp-item {
  display: flex; align-items: center; gap: 14px; padding: 22px 20px;
  border-right: 1px solid rgba(255,255,255,.07); transition: background .2s;
}
.usp-item:last-child { border-right: none; }
.usp-item:hover { background: rgba(255,255,255,.04); }
.usp-icon {
  width: 40px; height: 40px; background: rgba(255,186,0,.16);
  border: 1px solid rgba(255,186,0,.34); border-radius: 10px;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-size: 18px;
  color: var(--yellow);
}
.usp-icon svg { display: block; }
.usp-text strong { display: block; font-size: 13.5px; font-weight: 700; color: #fff; margin-bottom: 2px; }
.usp-text span { font-size: 12px; color: rgba(255,255,255,.55); }
/* Gedupliceerde items (voor de mobiele auto-marquee) standaard verborgen */
.usp-item.usp-clone { display: none; }
@keyframes usp-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ─── Cookie-consent banner ─── */
.cc-cookiebar {
  position: fixed; left: 50%; bottom: 16px; transform: translateX(-50%);
  z-index: 9600; width: min(680px, calc(100% - 24px));
  background: #fff; border: 1px solid rgba(30,58,138,.12); border-radius: 14px;
  box-shadow: 0 14px 40px rgba(15,31,92,.20); padding: 15px 18px;
}
.cc-cookiebar[hidden] { display: none; }
.cc-cookiebar-inner { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.cc-cookiebar-text { flex: 1; min-width: 220px; margin: 0; font-size: 13px; line-height: 1.5; color: var(--navy); }
.cc-cookiebar-text a { color: var(--navy); font-weight: 700; text-decoration: underline; }
.cc-cookiebar-btns { display: flex; gap: 10px; flex-shrink: 0; }
.cc-cookie-btn { border: none; border-radius: 10px; padding: 11px 18px; font-family: 'Inter', sans-serif; font-weight: 700; font-size: 13.5px; cursor: pointer; transition: background .15s, transform .1s; }
.cc-cookie-btn:active { transform: translateY(1px); }
.cc-cookie-decline { background: rgba(30,58,138,.08); color: var(--navy); }
.cc-cookie-accept { background: var(--navy); color: #fff; }
.cc-cookie-accept:hover { background: var(--navy-soft, #2a3a9e); }
@media (max-width: 560px) {
  .cc-cookiebar { bottom: 8px; padding: 14px; }
  .cc-cookiebar-btns { width: 100%; }
  .cc-cookie-btn { flex: 1; }
}

/* â”€â”€â”€ SECTIES â”€â”€â”€ */
.section { max-width: 1280px; margin: 0 auto; padding: 72px 24px; }
.section-header { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 32px; }
.section-title { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 28px; font-weight: 800; color: var(--navy); letter-spacing: -.5px; }
.section-title .title-dot {
  display: inline-block; width: 8px; height: 8px; background: var(--yellow);
  border-radius: 50%; margin-left: 6px; vertical-align: middle; position: relative; top: -2px;
}
.section-link { font-size: 13px; font-weight: 600; color: var(--navy); text-decoration: none; opacity: .55; transition: opacity .15s; }
.section-link:hover { opacity: 1; }

/* â”€â”€â”€ PRODUCT CARDS â”€â”€â”€ */
.drops-scroll {
  display: flex; gap: 16px; overflow-x: auto; padding-bottom: 8px;
  scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch;
}
.drops-scroll::-webkit-scrollbar { height: 4px; }
.drops-scroll::-webkit-scrollbar-track { background: rgba(30,58,138,.05); border-radius: 4px; }
.drops-scroll::-webkit-scrollbar-thumb { background: rgba(30,58,138,.18); border-radius: 4px; }

.product-card {
  flex-shrink: 0; width: 220px; scroll-snap-align: start;
  background: var(--surface); border-radius: 12px;
  border: 1px solid rgba(30,58,138,.08); overflow: hidden;
  transition: transform .2s, box-shadow .2s;
  position: relative; display: flex; flex-direction: column;
  text-decoration: none;
}
/* Stretched link â€” hele kaart klikbaar */
.product-card-link {
  position: absolute; inset: 0; z-index: 0;
}
/* Body laat kliks dóór naar de stretched link (hele kaart klikbaar);
   alleen de knoppen blijven zelf klikbaar. */
.product-card-body { position: relative; z-index: 1; pointer-events: none; }
.product-card-btn { position: relative; z-index: 1; pointer-events: auto; }
.product-card:hover { transform: translateY(-4px); box-shadow: 0 16px 40px rgba(30,58,138,.12); }

.product-card img.product-card-img { width: 100%; height: 190px; object-fit: contain; display: block; background: #fff; padding: 14px; }
.product-card-img-placeholder {
  width: 100%; height: 190px;
  background: linear-gradient(135deg, rgba(30,58,138,.06) 0%, rgba(30,58,138,.02) 100%);
  display: flex; align-items: center; justify-content: center; font-size: 40px;
}
.product-card-body { padding: 14px; display: flex; flex-direction: column; flex: 1; }
.product-card-name { font-weight: 700; font-size: 13.5px; color: var(--navy); margin-bottom: 3px; line-height: 1.3; }
.product-card-sub { font-size: 12px; color: var(--muted); margin-bottom: 8px; flex: 1; }
.product-card-footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.product-card-price { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 20px; font-weight: 800; color: var(--navy); }
.product-card-cart {
  position: relative; z-index: 2; flex-shrink: 0; pointer-events: auto;
  width: 40px; height: 40px; border-radius: 9px; border: none; cursor: pointer;
  background: var(--navy); color: #fff;
  display: flex; align-items: center; justify-content: center;
  transition: background .15s, transform .1s; text-decoration: none;
}
.product-card-cart:hover { background: var(--navy-soft); transform: scale(1.05); }
.product-card-cart.is-out { background: rgba(30,58,138,.08); color: var(--muted); }
.product-card-cart.is-out:hover { background: rgba(30,58,138,.12); transform: none; }
.product-card-cart.success { background: #22C55E !important; }
.product-card-btn {
  display: block; width: 100%; background: var(--navy); color: #fff; border: none;
  border-radius: 5px; padding: 9px; font-size: 13px; font-weight: 600;
  font-family: 'Inter', sans-serif; cursor: pointer; transition: background .15s; text-align: center;
}
.product-card-btn:hover { background: var(--navy-soft); }
.product-card-btn.notify { background: transparent; color: var(--navy); border: 1.5px solid var(--navy); }
.product-card-btn.notify:hover { background: var(--navy); color: #fff; }

/* Badges */
.cc-badge {
  position: absolute; top: 10px; left: 10px;
  font-size: 10px; font-weight: 800; font-family: 'Inter', sans-serif;
  padding: 4px 9px; border-radius: 4px; text-transform: uppercase; letter-spacing: .05em;
}
.badge-new   { background: var(--navy); color: #fff; }
.badge-hot   { background: #EF4444; color: #fff; }
.badge-pre   { background: var(--yellow); color: var(--navy); }
.badge-japan { background: #7C3AED; color: #fff; }
.badge-sale  { background: #22C55E; color: #fff; }
/* Rang-badge voor bestsellers (top-rechts) */
.product-card .cc-rank {
  position: absolute; top: 10px; left: 10px; right: auto; z-index: 4;
  background: var(--yellow); color: var(--navy);
  font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 10px;
  padding: 4px 9px; border-radius: 20px; box-shadow: 0 3px 10px rgba(0,0,0,.16);
  letter-spacing: .02em;
}
/* Staat er ook een categorie-badge (bv. Japans), zet die netjes onder de rang */
.product-card .cc-rank ~ .cc-badge { top: 40px; }
.badge-out   { background: #1A1A2E; color: rgba(255,255,255,.75); }

/* Voorraad */
.stock-indicator { display: flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 600; margin-bottom: 8px; }
.stock-dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; }
.stock-ok .stock-dot { background: #22C55E; }
.stock-low .stock-dot { background: #F59E0B; }
.stock-ok { color: #15803D; }
.stock-low { color: #B45309; }
.stock-out { color: var(--muted); }
.stock-out .stock-dot { background: var(--muted); }
.card-sold-out img, .card-sold-out .product-card-img-placeholder { opacity: .45; }

/* â”€â”€â”€ CADEAU BANNER â”€â”€â”€ */
.gift-banner {
  background: linear-gradient(135deg, #0F1F5C 0%, #1E3A8A 100%);
  border-radius: 12px; padding: 20px 28px;
  display: flex; align-items: center; gap: 20px;
}
.gift-icon { font-size: 32px; flex-shrink: 0; }
.gift-banner.has-img .gift-icon { width: 60px; height: 60px; border-radius: 10px; overflow: hidden; background: #fff; box-shadow: 0 4px 12px rgba(0,0,0,.25); }
.gift-icon img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gift-text { flex: 1; }
.gift-text strong { display: block; font-size: 15px; font-weight: 700; color: #fff; margin-bottom: 3px; }
.gift-text span { font-size: 13px; color: rgba(255,255,255,.55); }
.gift-progress-wrap { flex-shrink: 0; width: 180px; }
.gift-progress-label { display: flex; justify-content: space-between; font-size: 11px; font-weight: 600; color: rgba(255,255,255,.5); margin-bottom: 6px; }
.gift-progress-label span:last-child { color: var(--yellow); }
.gift-progress-bar { height: 6px; background: rgba(255,255,255,.12); border-radius: 3px; overflow: hidden; }
.gift-progress-fill { height: 100%; border-radius: 3px; background: linear-gradient(90deg, var(--yellow-dk), var(--yellow)); transition: width .5s ease; }

/* â”€â”€â”€ ASSORTIMENT (cat + serie) â”€â”€â”€ */
.assortiment-layout { display: flex; flex-direction: column; gap: 24px; }
.assortiment-sep { height: 1px; background: rgba(30,58,138,.08); }
.cat-list-label { font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); margin-bottom: 10px; }
.cat-list { display: flex; flex-direction: row; flex-wrap: wrap; gap: 8px; }
.cat-list-item {
  display: flex; align-items: center; gap: 8px; padding: 7px 14px 7px 8px;
  border-radius: 100px; border: 1px solid rgba(30,58,138,.12);
  background: var(--surface); text-decoration: none;
  font-size: 13px; font-weight: 600; color: var(--text);
  transition: background .15s, border-color .15s, color .15s, transform .15s;
}
.cat-list-item:hover { background: rgba(30,58,138,.05); border-color: rgba(30,58,138,.25); color: var(--navy); transform: translateY(-1px); }
.cat-list-icon { width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 13px; flex-shrink: 0; overflow: hidden; }
.cat-list-icon img { width: 100%; height: 100%; object-fit: cover; }
.cat-list-count { font-size: 11px; font-weight: 700; color: var(--muted); background: rgba(30,58,138,.06); border-radius: 20px; padding: 1px 7px; margin-left: 2px; }
.cat-list-item:hover .cat-list-count { background: rgba(30,58,138,.12); color: var(--navy); }

/* Producttype als productkaartjes (grid met echte foto) */
.cat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.cat-tile {
  display: block; background: var(--surface); border: 1px solid rgba(30,58,138,.1);
  border-radius: 14px; overflow: hidden; text-decoration: none;
  transition: transform .14s, box-shadow .14s, border-color .14s;
}
.cat-tile:hover { transform: translateY(-3px); box-shadow: 0 14px 30px rgba(30,58,138,.13); border-color: rgba(30,58,138,.2); }
.cat-tile-icon {
  height: 86px; display: flex; align-items: center; justify-content: center; color: var(--navy);
  background: linear-gradient(135deg, rgba(30,58,138,.05), rgba(30,58,138,.01));
}
.cat-tile-icon svg { width: 46px; height: 46px; transition: transform .2s; }
.cat-tile:hover .cat-tile-icon svg { transform: scale(1.08); }
.cat-tile.has-img .cat-tile-icon { background: #fff; padding: 12px; }
.cat-tile-icon img { max-width: 100%; max-height: 100%; object-fit: contain; transition: transform .2s; }
.cat-tile:hover .cat-tile-icon img { transform: scale(1.05); }
.cat-tile-body { padding: 11px 13px 13px; border-top: 1px solid rgba(30,58,138,.06); }
.cat-tile-name { display: block; font-weight: 700; font-size: 14px; color: var(--navy); line-height: 1.2; }
.cat-tile-count { display: block; font-size: 12px; color: var(--muted); margin-top: 3px; }
.series-right { min-width: 0; }

/* Shop per budget */
.cc-budget { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.cc-budget-tile {
  display: flex; flex-direction: column; gap: 3px; padding: 16px 18px;
  background: var(--bg); border: 1px solid rgba(30,58,138,.1); border-radius: 12px;
  text-decoration: none; transition: transform .14s, box-shadow .14s, border-color .14s;
}
.cc-budget-tile:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(30,58,138,.1); border-color: rgba(30,58,138,.2); }
.cc-budget-amt { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 17px; color: var(--navy); }
.cc-budget-sub { font-size: 12.5px; color: var(--muted); }
@media (max-width: 640px) { .cc-budget { grid-template-columns: 1fr; } }

/* Series tabs */
.series-tabs { display: flex; gap: 4px; margin-bottom: 24px; border-bottom: 2px solid rgba(30,58,138,.08); }
.series-tab {
  padding: 10px 18px; font-size: 13.5px; font-weight: 600; color: var(--muted);
  border: none; background: none; cursor: pointer; border-bottom: 2px solid transparent;
  margin-bottom: -2px; transition: color .15s, border-color .15s; font-family: 'Inter', sans-serif;
}
.series-tab:hover { color: var(--navy); }
.series-tab.active { color: var(--navy); border-bottom-color: var(--navy); }
.series-panel { display: none; }
.series-panel.active { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 14px; }
/* Set-logo-tegels (pokemon.com-stijl) */
.series-set-card {
  display: flex; flex-direction: column; overflow: hidden;
  background: var(--surface); border: 1px solid rgba(30,58,138,.1); border-radius: 14px;
  text-decoration: none; color: var(--navy);
  transition: border-color .15s, transform .15s, box-shadow .15s;
}
.series-set-card:hover { border-color: rgba(30,58,138,.22); transform: translateY(-3px); box-shadow: 0 14px 30px rgba(30,58,138,.12); }
.series-set-logo {
  height: 92px; display: flex; align-items: center; justify-content: center; padding: 16px 18px;
  background: linear-gradient(135deg, rgba(30,58,138,.05), rgba(30,58,138,.01));
}
.series-set-card.has-logo .series-set-logo { background: #fff; }
.series-set-logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.series-set-fallback { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 15px; color: var(--navy); text-align: center; line-height: 1.1; opacity: .55; }
.series-set-meta { padding: 11px 14px 13px; border-top: 1px solid rgba(30,58,138,.06); }
.series-set-name { font-size: 13px; font-weight: 700; color: var(--navy); line-height: 1.25; margin-bottom: 2px; }
.series-set-count { font-size: 11.5px; color: var(--muted); font-weight: 500; }
.series-set-series { font-size: 11px; color: var(--muted); font-weight: 500; }

/* â”€â”€â”€ BESTSELLERS GRID â”€â”€â”€ */
.product-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; }
.product-grid .product-card { width: auto; }
.product-grid .product-card-img-placeholder { height: 200px; }
.product-grid img.product-card-img { height: 200px; }

/* â”€â”€â”€ SOCIAL PROOF â”€â”€â”€ */
.social-bg { background: var(--navy); position: relative; overflow: hidden; }
/* Gengar-decoratie (rechtsboven, groot & zichtbaar) */
.social-poke {
  position: absolute; top: 55px; right: 30px; width: 330px; height: auto;
  opacity: .9; z-index: 0; pointer-events: none;
  filter: drop-shadow(0 16px 36px rgba(0,0,0,.45));
}
@media (max-width: 1100px) { .social-poke { width: 250px; right: -5px; opacity: .8; } }
@media (max-width: 768px) { .social-poke { width: 180px; top: 40px; right: -25px; opacity: .55; } }
@media (max-width: 520px) { .social-poke { display: none; } }
.social-bg::before {
  content: ''; position: absolute; inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  opacity: .03; pointer-events: none;
}
.social-inner { max-width: 1280px; margin: 0 auto; padding: 72px 24px; position: relative; z-index: 1; }
.social-top { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; margin-bottom: 48px; }
.social-header { margin-bottom: 36px; }
.score-pill {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(255,215,0,.1); border: 1px solid rgba(255,215,0,.2);
  color: var(--yellow); font-size: 12px; font-weight: 700;
  letter-spacing: .08em; text-transform: uppercase;
  padding: 6px 14px; border-radius: 100px; margin-bottom: 20px;
}
.score-number { font-family: 'Plus Jakarta Sans', sans-serif; font-size: clamp(56px,7vw,88px); font-weight: 800; line-height: 1; color: #fff; letter-spacing: -3px; margin-bottom: 6px; }
.score-number span { color: var(--yellow); }
.score-sub { font-size: 16px; color: rgba(255,255,255,.5); margin-bottom: 12px; }
.score-stars { font-size: 22px; letter-spacing: 2px; color: var(--yellow); }
/* Groot score-blok */
.cc-scorebox {
  display: inline-flex; align-items: center; gap: 20px; flex-wrap: wrap;
  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16);
  border-radius: 16px; padding: 16px 22px;
}
.cc-score-num { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 46px; line-height: 1; color: #fff; }
.cc-score-num small { font-size: 18px; font-weight: 700; color: rgba(255,255,255,.55); }
.cc-score-stars { color: var(--yellow); font-size: 19px; letter-spacing: 3px; }
.cc-score-text { font-size: 13.5px; color: rgba(255,255,255,.8); margin-top: 5px; max-width: 260px; line-height: 1.4; }
.cc-score-text strong { color: #fff; }
.cc-score-wwk { display: flex; align-items: center; gap: 7px; font-size: 13.5px; font-weight: 700; color: #fff; padding-left: 20px; border-left: 1px solid rgba(255,255,255,.16); }
.cc-score-wwk svg { flex-shrink: 0; }
@media (max-width: 560px) { .cc-score-wwk { padding-left: 0; border-left: none; } }

.score-badges { display: flex; gap: 10px; margin-top: 24px; flex-wrap: wrap; }
.score-badge { display: flex; align-items: center; gap: 8px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1); border-radius: 8px; padding: 10px 14px; font-size: 13px; font-weight: 600; color: rgba(255,255,255,.8); }
.score-badge svg { color: var(--yellow); flex-shrink: 0; }
.reviews-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.cc-reviews-feed { min-height: 40px; }
.cc-reviews-feed valued-widget { display: block; width: 100%; }
.review-card { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.08); border-radius: 12px; padding: 20px; transition: background .2s; }
.review-card:hover { background: rgba(255,255,255,.09); }
.review-stars { font-size: 14px; color: var(--yellow); margin-bottom: 10px; letter-spacing: 1px; }
.review-text { font-size: 14px; line-height: 1.6; color: rgba(255,255,255,.7); margin-bottom: 16px; }
.review-author { display: flex; align-items: center; gap: 10px; }
.review-avatar { width: 32px; height: 32px; border-radius: 50%; background: rgba(255,215,0,.2); display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; color: var(--yellow); flex-shrink: 0; }
.review-name { font-size: 13px; font-weight: 700; color: rgba(255,255,255,.85); }
.review-date { font-size: 11px; color: rgba(255,255,255,.35); }
.wa-cta { margin-top: 48px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); border-radius: 14px; padding: 28px 32px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.wa-left { display: flex; align-items: center; gap: 16px; }
.wa-icon { width: 48px; height: 48px; background: #25D366; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 22px; flex-shrink: 0; }
.wa-text strong { display: block; font-size: 16px; font-weight: 700; color: #fff; margin-bottom: 3px; }
.wa-text span { font-size: 13px; color: rgba(255,255,255,.5); }
.wa-btn { display: inline-flex; align-items: center; gap: 8px; background: #25D366; color: #fff; border: none; border-radius: var(--radius); padding: 12px 22px; font-family: 'Inter', sans-serif; font-size: 14px; font-weight: 700; cursor: pointer; transition: background .15s; white-space: nowrap; text-decoration: none; }
.wa-btn:hover { background: #1fb558; }

/* â”€â”€â”€ FOOTER â”€â”€â”€ */
.site-footer { background: var(--surface); color: var(--muted); font-size: 13.5px; position: relative; }
.footer-wave-wrap { position: relative; line-height: 0; background: var(--navy); }
.footer-wave-wrap svg { display: block; width: 100%; }
.footer-pokemon-img {
  position: absolute; bottom: -10px; pointer-events: none;
  filter: drop-shadow(0 6px 12px rgba(30,58,138,.2));
}
.footer-pokemon-img.haunter { left: 80px; width: 110px; animation: pokemonFloat 4s ease-in-out infinite; }
.footer-pokemon-img.gengar  { right: 120px; width: 85px; animation: pokemonFloat 4s ease-in-out infinite 2s; }
@keyframes pokemonFloat { 0%,100%{transform:translateY(0) rotate(-2deg);} 50%{transform:translateY(-10px) rotate(2deg);} }

.footer-main { max-width: 1280px; margin: 0 auto; padding: 64px 24px 40px; display: grid; grid-template-columns: 1.2fr 1fr 1fr 1.3fr; gap: 48px; }
.footer-col-title { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--navy); margin-bottom: 16px; }
.footer-logo-wrap { margin-bottom: 16px; }
.footer-logo-wrap img { height: 40px; width: auto; }
.footer-logo-fallback { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 20px; color: var(--navy); }
.footer-logo-fallback span { color: var(--yellow-dk); }
.footer-meta { line-height: 1.9; color: var(--muted); font-size: 12.5px; }
.footer-meta strong { color: var(--navy); font-weight: 600; }
.footer-meta a { color: var(--muted); text-decoration: none; transition: color .15s; }
.footer-meta a:hover { color: var(--navy); }
.footer-meta em { font-size: 11px; font-style: normal; }
.footer-social { display: flex; gap: 8px; margin-top: 20px; }
.social-btn { width: 36px; height: 36px; border-radius: 8px; background: rgba(30,58,138,.07); border: 1px solid rgba(30,58,138,.12); display: flex; align-items: center; justify-content: center; text-decoration: none; color: var(--muted); transition: background .15s, color .15s; }
.social-btn:hover { background: var(--navy); color: #fff; }
.footer-links { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.footer-links a { color: var(--muted); text-decoration: none; font-size: 13.5px; transition: color .15s; }
.footer-links a:hover { color: var(--navy); }
.footer-links .footer-link-accent { color: var(--navy); font-weight: 700; }
.footer-wa-box { background: rgba(30,58,138,.04); border: 1px solid rgba(30,58,138,.1); border-radius: 12px; padding: 18px; margin-bottom: 20px; }
.footer-wa-box p { font-size: 13px; color: var(--muted); margin-bottom: 12px; line-height: 1.6; }
.footer-wa-btn { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; padding: 11px; background: #25D366; color: #fff; border: none; border-radius: 8px; font-family: 'Inter', sans-serif; font-size: 13.5px; font-weight: 700; cursor: pointer; text-decoration: none; transition: background .15s; }
.footer-wa-btn:hover { background: #1fb558; }
.footer-contact { font-size: 12.5px; color: var(--muted); margin-bottom: 4px; }
.footer-contact a { color: var(--navy); text-decoration: none; transition: color .15s; }
.footer-contact a:hover { color: var(--navy-soft); }
.payment-methods { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 20px; }
.payment-badge { background: rgba(30,58,138,.06); border: 1px solid rgba(30,58,138,.12); border-radius: 6px; padding: 5px 10px; font-size: 11px; font-weight: 700; color: var(--navy); letter-spacing: .02em; }
.payment-badge.payment-logo { background: #fff; padding: 5px 8px; display: inline-flex; align-items: center; }
.payment-badge.payment-logo img { height: 20px; width: auto; display: block; }
/* WebwinkelKeur-trustmark in footer */
.footer-wwk { display: inline-flex; align-items: center; gap: 9px; margin-top: 18px; background: rgba(30,58,138,.04); border: 1px solid rgba(30,58,138,.1); border-radius: 10px; padding: 9px 13px; font-size: 12px; color: var(--muted); line-height: 1.3; }
.footer-wwk svg { flex-shrink: 0; }
.footer-wwk strong { color: var(--navy); font-weight: 700; }
.footer-bottom { background: var(--bg); border-top: 1px solid rgba(30,58,138,.08); padding: 16px 24px; }
.footer-bottom-inner { max-width: 1280px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.footer-bottom-left { font-size: 12px; color: var(--muted); }
.footer-bottom-right { display: flex; gap: 16px; }
.footer-bottom-right a { font-size: 12px; color: var(--muted); text-decoration: none; transition: color .15s; }
.footer-bottom-right a:hover { color: var(--navy); }

/* â”€â”€â”€ PRODUCTPAGINA â”€â”€â”€ */
.product-layout {
  display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: start;
}

/* Gallery */
.product-main-img-wrap {
  position: relative; border-radius: 14px; overflow: hidden;
  background: var(--surface); border: 1px solid rgba(30,58,138,.08);
}
.product-main-img { width: 100%; height: 440px; object-fit: contain; display: block; padding: 24px; }
.product-img-placeholder { width: 100%; height: 440px; display: flex; align-items: center; justify-content: center; font-size: 80px; background: rgba(30,58,138,.03); }

.product-thumbs { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.product-thumb { width: 72px; height: 72px; object-fit: cover; border-radius: 8px; cursor: pointer; border: 2px solid transparent; transition: border-color .15s; }
.product-thumb.active, .product-thumb:hover { border-color: var(--navy); }

/* Info */
.product-cat-link {
  font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--muted); text-decoration: none; transition: color .15s; display: inline-block;
  background: rgba(30,58,138,.05); border: 1px solid rgba(30,58,138,.1);
  border-radius: 4px; padding: 3px 8px; margin-bottom: 14px;
}
.product-cat-link:hover { color: var(--navy); background: rgba(30,58,138,.08); }

.product-title {
  font-family: 'Plus Jakarta Sans', sans-serif; font-size: clamp(22px, 2.8vw, 32px);
  font-weight: 800; color: var(--navy); line-height: 1.1; letter-spacing: -.5px;
  margin-bottom: 16px;
}

.product-rating { display: flex; align-items: center; gap: 8px; margin-bottom: 16px; }
.rating-stars .star-rating { font-size: 14px; }
.rating-count { font-size: 13px; color: var(--muted); }

.product-price-block {
  display: flex; align-items: center; gap: 14px; margin-bottom: 16px;
  padding-bottom: 16px; border-bottom: 1px solid rgba(30,58,138,.08);
}
.price-regular { font-size: 16px; color: var(--muted); text-decoration: line-through; }
.price-current { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 36px; font-weight: 800; color: var(--navy); line-height: 1; }
.price-saving { background: #EF4444; color: #fff; font-size: 12px; font-weight: 800; padding: 4px 10px; border-radius: 20px; }

.product-short-desc { font-size: 14px; line-height: 1.7; color: var(--muted); margin-bottom: 16px; }

/* Pre-order info */
.preorder-info {
  display: flex; gap: 12px; background: rgba(255,215,0,.08); border: 1px solid rgba(255,215,0,.3);
  border-radius: 10px; padding: 14px 16px; margin-bottom: 20px;
}
.preorder-icon { font-size: 22px; flex-shrink: 0; }
.preorder-info strong { display: block; font-size: 14px; font-weight: 700; color: var(--navy); margin-bottom: 4px; }
.preorder-info p { font-size: 13px; color: var(--muted); line-height: 1.5; margin: 0; }

/* ATC */
.atc-wrap { display: flex; gap: 10px; margin-bottom: 12px; }
.qty-wrap { display: flex; align-items: center; border: 1.5px solid rgba(30,58,138,.2); border-radius: var(--radius); overflow: hidden; flex-shrink: 0; }
.qty-btn { width: 38px; height: 48px; border: none; background: transparent; font-size: 18px; font-weight: 600; cursor: pointer; color: var(--navy); transition: background .15s; }
.qty-btn:hover { background: rgba(30,58,138,.06); }
.qty-input { width: 48px; height: 48px; border: none; border-left: 1px solid rgba(30,58,138,.12); border-right: 1px solid rgba(30,58,138,.12); text-align: center; font-family: 'Plus Jakarta Sans', sans-serif; font-size: 16px; font-weight: 700; color: var(--navy); outline: none; }

.atc-btn {
  flex: 1; height: 48px; background: var(--navy); color: #fff; border: none;
  border-radius: var(--radius); font-family: 'Inter', sans-serif; font-size: 15px; font-weight: 700;
  cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 8px;
  transition: background .15s, transform .1s; box-shadow: 0 4px 14px rgba(30,58,138,.25);
}
.atc-btn:hover { background: var(--navy-soft); transform: translateY(-1px); }
.atc-btn.success { background: #22C55E; }

.atc-feedback { font-size: 13px; font-weight: 600; margin-top: 8px; }

/* Notify me */
.notify-wrap { background: rgba(30,58,138,.03); border: 1px solid rgba(30,58,138,.1); border-radius: 10px; padding: 20px; margin-bottom: 16px; }
.notify-form { display: flex; gap: 8px; }
.notify-input { flex: 1; height: 42px; border: 1.5px solid rgba(30,58,138,.15); border-radius: var(--radius); padding: 0 14px; font-family: 'Inter', sans-serif; font-size: 14px; outline: none; transition: border-color .15s; }
.notify-input:focus { border-color: var(--navy); }
.notify-submit { padding: 0 18px; height: 42px; background: var(--navy); color: #fff; border: none; border-radius: var(--radius); font-family: 'Inter', sans-serif; font-size: 13px; font-weight: 600; cursor: pointer; white-space: nowrap; transition: background .15s; }
.notify-submit:hover { background: var(--navy-soft); }

/* Trust */
.product-trust {
  display: flex; align-items: center; flex-wrap: wrap;
  border-top: 1px solid rgba(30,58,138,.08);
  border-bottom: 1px solid rgba(30,58,138,.08);
  margin: 20px 0; padding: 14px 0; gap: 0;
}
.product-trust-item {
  display: flex; align-items: center; gap: 8px;
  font-size: 12.5px; font-weight: 600; color: var(--navy);
  padding: 4px 20px 4px 0; margin-right: 20px;
  border-right: 1px solid rgba(30,58,138,.1);
  white-space: nowrap;
}
.product-trust-item:last-child { border-right: none; margin-right: 0; padding-right: 0; }
.product-trust-item svg { color: var(--navy); opacity: .7; flex-shrink: 0; }

/* Gift bar op productpagina */
.product-gift-bar {
  background: var(--bg); border: 1px solid rgba(30,58,138,.1);
  border-radius: 8px; padding: 12px 16px;
  display: flex; align-items: center; gap: 12px;
}
.product-gift-bar .gift-icon-small { font-size: 18px; flex-shrink: 0; }
.product-gift-bar .gift-bar-text { flex: 1; }
.product-gift-bar .gift-progress-label {
  display: flex; justify-content: space-between; align-items: center;
  font-size: 12px; font-weight: 600; color: var(--muted); margin-bottom: 6px;
}
.product-gift-bar .gift-progress-label strong { color: var(--navy); }
.product-gift-bar .gift-progress-bar { background: rgba(30,58,138,.1); }
.product-gift-bar .gift-progress-fill { background: var(--navy); }

/* Breadcrumb */
.breadcrumb { font-size: 13px; color: var(--muted); }
.breadcrumb a { color: var(--muted); text-decoration: none; transition: color .15s; }
.breadcrumb a:hover { color: var(--navy); }
.breadcrumb span { margin: 0 6px; }

/* Beschrijving */
.desc-heading {
  font-family: 'Plus Jakarta Sans', sans-serif; font-size: 20px; font-weight: 800;
  color: var(--navy); margin-bottom: 20px; letter-spacing: -.3px;
}
.product-desc { font-size: 15px; line-height: 1.75; color: var(--text); }
.product-desc p { margin-bottom: 14px; }
.product-desc ul { padding-left: 20px; margin-bottom: 14px; }
.product-desc li { margin-bottom: 6px; }
.product-desc h2, .product-desc h3 { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; color: var(--navy); margin: 24px 0 10px; }

/* WooCommerce prijs â€” clean zonder superscript */
.woocommerce-Price-amount { font-family: 'Plus Jakarta Sans', sans-serif; }
.woocommerce-Price-currencySymbol { font-size: inherit; vertical-align: baseline; }

/* Bundle */
.bundle-box { background: var(--surface); border: 1px solid rgba(30,58,138,.1); border-radius: 14px; padding: 20px; position: sticky; top: 140px; }
.bundle-title { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 15px; font-weight: 800; color: var(--navy); margin-bottom: 16px; }
.bundle-item { display: flex; align-items: center; gap: 10px; padding: 8px 0; cursor: pointer; }
.bundle-check { width: 16px; height: 16px; accent-color: var(--navy); flex-shrink: 0; }
.bundle-total-row { display: flex; align-items: center; justify-content: space-between; padding: 14px 0 14px; border-top: 1px solid rgba(30,58,138,.08); margin-top: 8px; }
.bundle-atc-btn { width: 100%; padding: 13px; background: var(--navy); color: #fff; border: none; border-radius: var(--radius); font-family: 'Inter', sans-serif; font-size: 14px; font-weight: 700; cursor: pointer; transition: background .15s; }
.bundle-atc-btn:hover { background: var(--navy-soft); }

/* â”€â”€â”€ STICKY ADD TO CART â”€â”€â”€ */
.sticky-atc {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 500;
  background: var(--surface); border-top: 1px solid rgba(30,58,138,.12);
  box-shadow: 0 -4px 24px rgba(30,58,138,.1);
  transform: translateY(100%); transition: transform .3s ease;
}
.sticky-atc.visible { transform: translateY(0); }
.sticky-atc-inner { max-width: 1280px; margin: 0 auto; padding: 12px 24px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.sticky-atc-info { display: flex; align-items: center; gap: 12px; }
.sticky-atc-btn { padding: 12px 32px; background: var(--navy); color: #fff; border: none; border-radius: var(--radius); font-family: 'Inter', sans-serif; font-size: 15px; font-weight: 700; cursor: pointer; transition: background .15s; white-space: nowrap; }
.sticky-atc-btn:hover { background: var(--navy-soft); }

/* â”€â”€â”€ MINI CART DRAWER â”€â”€â”€ */
.cc-cart-overlay {
  position: fixed; inset: 0; z-index: 8000;
  background: rgba(15,31,92,.45);
  opacity: 0; pointer-events: none;
  transition: opacity .3s ease;
  backdrop-filter: blur(3px);
}
.cc-cart-overlay.visible { opacity: 1; pointer-events: auto; }

.cc-cart-drawer {
  position: fixed; top: 0; right: 0; bottom: 0; z-index: 8001;
  width: 420px; max-width: 100vw;
  background: var(--surface);
  box-shadow: -8px 0 50px rgba(15,31,92,.2);
  display: flex; flex-direction: column;
  transform: translateX(100%);
  transition: transform .35s cubic-bezier(.25,.46,.45,.94);
}
.cc-cart-drawer.open { transform: translateX(0); }
.cc-cart-drawer.cc-loading { pointer-events: none; }
.cc-cart-drawer.cc-loading .cc-cart-items { opacity: .55; transition: opacity .15s; }

/* Header */
.cc-cart-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 22px; border-bottom: 1px solid rgba(30,58,138,.08); flex-shrink: 0;
}
.cc-cart-title {
  display: flex; align-items: center; gap: 10px;
  font-family: 'Plus Jakarta Sans', sans-serif; font-size: 18px; font-weight: 800; color: var(--navy);
}
.cc-cart-count-badge {
  background: var(--navy); color: #fff; font-size: 11px; font-weight: 700;
  min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center; font-family: 'Inter', sans-serif;
}
.cc-cart-close {
  width: 36px; height: 36px; border: none; background: rgba(30,58,138,.06);
  border-radius: 50%; cursor: pointer; color: var(--navy);
  display: flex; align-items: center; justify-content: center; transition: background .15s;
}
.cc-cart-close:hover { background: rgba(30,58,138,.12); }

/* Cadeau-balk */
.cc-gift-bar {
  padding: 12px 22px; background: linear-gradient(135deg, rgba(255,215,0,.12), rgba(255,215,0,.04));
  border-bottom: 1px solid rgba(30,58,138,.07); flex-shrink: 0;
}
.cc-gift-bar.reached { background: linear-gradient(135deg, rgba(34,197,94,.12), rgba(34,197,94,.04)); }
.cc-gift-row {
  display: flex; align-items: center; gap: 8px;
  font-size: 12.5px; color: var(--navy); margin-bottom: 8px;
}
.cc-gift-row svg { color: var(--yellow-dk); flex-shrink: 0; }
.cc-gift-bar.reached .cc-gift-row svg { color: #16A34A; }
.cc-gift-row strong { font-weight: 800; }
.cc-gift-track { height: 6px; background: rgba(30,58,138,.1); border-radius: 3px; overflow: hidden; }
.cc-gift-fill { height: 100%; border-radius: 3px; background: linear-gradient(90deg, var(--yellow-dk), var(--yellow)); transition: width .4s ease; }
.cc-gift-bar.reached .cc-gift-fill { background: linear-gradient(90deg, #16A34A, #22C55E); }

/* Items */
.cc-cart-items { flex: 1; overflow-y: auto; padding: 8px 22px; }
.cc-cart-empty { text-align: center; padding: 56px 16px; display: flex; flex-direction: column; align-items: center; }
.cc-empty-btn {
  background: var(--navy); color: #fff; text-decoration: none;
  font-size: 13px; font-weight: 700; padding: 11px 22px; border-radius: var(--radius);
  transition: background .15s;
}
.cc-empty-btn:hover { background: var(--navy-soft); }

.cc-cart-item {
  display: flex; gap: 12px; align-items: flex-start;
  padding: 16px 0; border-bottom: 1px solid rgba(30,58,138,.07);
  transition: opacity .18s ease, transform .18s ease;
}
.cc-cart-item:last-child { border-bottom: none; }
.cc-cart-item.removing { opacity: 0; transform: translateX(20px); }
.cc-cart-item-img-link { flex-shrink: 0; display: block; }
.cc-cart-item-img {
  width: 68px; height: 68px; border-radius: 8px; object-fit: cover;
  border: 1px solid rgba(30,58,138,.08); background: var(--bg); display: block;
}
.cc-cart-item-info { flex: 1; min-width: 0; }
.cc-cart-item-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.cc-cart-item-name {
  font-size: 13px; font-weight: 700; color: var(--navy); line-height: 1.35;
  text-decoration: none; display: block;
}
.cc-cart-item-name:hover { color: var(--navy-soft); }
.cc-cart-remove {
  flex-shrink: 0; width: 26px; height: 26px; border: none; background: transparent;
  color: var(--muted); cursor: pointer; border-radius: 6px;
  display: flex; align-items: center; justify-content: center;
  transition: background .15s, color .15s;
}
.cc-cart-remove:hover { background: rgba(239,68,68,.1); color: #EF4444; }
.cc-cart-item-unit { font-size: 11.5px; color: var(--muted); margin: 4px 0 10px; }
.cc-cart-item-row { display: flex; align-items: center; justify-content: space-between; }

/* Qty stepper */
.cc-qty {
  display: flex; align-items: center; border: 1.5px solid rgba(30,58,138,.15);
  border-radius: 6px; overflow: hidden;
}
.cc-qty-btn {
  width: 30px; height: 30px; border: none; background: transparent;
  font-size: 16px; font-weight: 700; color: var(--navy); cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background .15s;
}
.cc-qty-btn:hover { background: rgba(30,58,138,.07); }
.cc-qty-btn.cc-qty-max-hit { animation: shake-x .3s; }
@keyframes shake-x { 0%,100%{transform:translateX(0);} 25%{transform:translateX(-2px);} 75%{transform:translateX(2px);} }
.cc-qty-val {
  min-width: 30px; text-align: center; font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 14px; font-weight: 700; color: var(--navy);
  border-left: 1px solid rgba(30,58,138,.12); border-right: 1px solid rgba(30,58,138,.12);
  height: 30px; display: flex; align-items: center; justify-content: center;
}
.cc-cart-item-line { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 15px; font-weight: 800; color: var(--navy); }

/* Gratis cadeau-regel in mini-cart */
.cc-cart-item-gift { background: linear-gradient(90deg, rgba(34,197,94,.07), rgba(34,197,94,0)); border-radius: 12px; padding: 8px; margin: 4px -8px; }
.cc-cart-item-giftnote { font-size: 12px; color: #16a34a; font-weight: 700; margin: 2px 0 6px; }
.cc-gift-free { display: inline-block; font-family: 'Plus Jakarta Sans', sans-serif; font-size: 14px; font-weight: 800; color: #16a34a; letter-spacing: .3px; }
.cc-gift-tag { display: inline-block; font-size: 11px; font-weight: 700; color: #16a34a; background: rgba(34,197,94,.12); padding: 1px 7px; border-radius: 999px; margin-left: 4px; vertical-align: middle; }

/* Footer */
.cc-cart-footer { padding: 16px 22px 22px; border-top: 1px solid rgba(30,58,138,.08); flex-shrink: 0; }
.cc-cart-subtotal {
  display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 10px;
  font-size: 14px; font-weight: 600; color: var(--navy);
}
.cc-cart-subtotal small { font-size: 11px; color: var(--muted); font-weight: 500; }
.cc-cart-total-amount { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 24px; font-weight: 800; color: var(--navy); }
.cc-cart-shipping-note {
  display: flex; align-items: center; gap: 6px;
  font-size: 12px; font-weight: 600; color: #15803D;
  background: rgba(34,197,94,.08); border-radius: 6px;
  padding: 8px 10px; margin-bottom: 12px;
}
.cc-checkout-btn {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  width: 100%; padding: 15px; background: var(--navy); color: #fff;
  border-radius: var(--radius); text-decoration: none;
  font-family: 'Inter', sans-serif; font-size: 15px; font-weight: 700;
  transition: background .15s, transform .1s; box-shadow: 0 4px 14px rgba(30,58,138,.25);
  margin-bottom: 10px;
}
.cc-checkout-btn:hover { background: var(--navy-soft); transform: translateY(-1px); }
.cc-cart-link { display: block; text-align: center; font-size: 13px; font-weight: 600; color: var(--muted); text-decoration: none; transition: color .15s; }
.cc-cart-link:hover { color: var(--navy); }
.cc-cart-trust {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  margin-top: 14px; padding-top: 14px; border-top: 1px solid rgba(30,58,138,.07);
  font-size: 11.5px; color: var(--muted);
}
.cc-cart-trust span { display: flex; align-items: center; gap: 5px; font-weight: 600; color: var(--navy); }
.cc-cart-pay { font-weight: 500 !important; color: var(--muted) !important; }

/* â”€â”€â”€ WooCommerce overrides â”€â”€â”€ */
.woo-wrap { max-width: 1280px; margin: 0 auto; padding: 40px 24px; }
.woocommerce-notices-wrapper { max-width: 1280px; margin: 0 auto; }

/* Notices */
.woocommerce-message, .woocommerce-info, .woocommerce-error {
  border-radius: 10px; border: 1px solid rgba(30,58,138,.12);
  background: var(--surface); padding: 14px 18px; font-size: 14px;
  color: var(--navy); list-style: none; margin-bottom: 16px;
  border-left: 4px solid var(--navy);
}
.woocommerce-message { border-left-color: #22C55E; }

/* Foutmeldingen: schone zachtrode kaart, nette lijst, geen onderstreepte links */
.woocommerce-error {
  border-left-color: #EF4444; background: #FEF2F2;
  border-color: rgba(239,68,68,.22); color: #b42318;
  list-style: none; margin: 0 0 16px; padding: 13px 18px;
}
.woocommerce-error li {
  padding: 3px 0; line-height: 1.5; color: #b42318; font-size: 13.5px;
  border: none; list-style: none;
}
.woocommerce-error li::before { content: ""; }
.woocommerce-error li a,
.woocommerce-error li strong { color: #b42318; text-decoration: none; font-weight: 700; }
.woocommerce-error li a:hover { text-decoration: underline; }

/* Inline veld-fout (indien getoond onder een veld): zelfde schone stijl */
.woocommerce-checkout .form-row .woocommerce-error,
.woocommerce-checkout .form-row > .error {
  background: none; border: none; padding: 4px 0 0; margin: 0;
  color: #b42318; font-size: 12.5px; text-decoration: none;
}
.woocommerce-message .button, .woocommerce-info .button {
  background: var(--navy); color: #fff; border-radius: 5px; padding: 6px 14px;
  font-size: 13px; font-weight: 600; text-decoration: none; float: right;
}

/* â•â•â• CART PAGINA â•â•â• */
.cc-shop-page { background: var(--bg); min-height: 60vh; }
.cc-shop-inner { max-width: 1180px; margin: 0 auto; padding: 40px 24px 72px; }
.cc-page-title {
  font-family: 'Plus Jakarta Sans', sans-serif; font-size: clamp(26px,3vw,38px);
  font-weight: 800; color: var(--navy); letter-spacing: -.5px; margin-bottom: 8px;
}
.cc-page-sub { font-size: 14px; color: var(--muted); margin-bottom: 32px; }

/* Cart grid */
.cc-cart-grid { display: grid; grid-template-columns: 1fr 360px; gap: 32px; align-items: start; }
.cc-cart-grid.cc-updating { opacity: .55; pointer-events: none; transition: opacity .15s; }
.cc-cart-main { position: relative; min-width: 0; }

/* Qty stepper op cart-pagina */
.cc-line-item .cc-qty {
  display: inline-flex; align-items: center;
  border: 1.5px solid rgba(30,58,138,.15); border-radius: 6px; overflow: hidden;
}
.cc-line-item .cc-qty-btn {
  width: 32px; height: 36px; border: none; background: transparent;
  font-size: 17px; font-weight: 700; color: var(--navy); cursor: pointer;
  display: flex; align-items: center; justify-content: center; transition: background .15s;
}
.cc-line-item .cc-qty-btn:hover { background: rgba(30,58,138,.07); }
.cc-line-item .cc-qty-val {
  min-width: 36px; height: 36px; text-align: center;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Plus Jakarta Sans', sans-serif; font-size: 14px; font-weight: 700; color: var(--navy);
  border-left: 1px solid rgba(30,58,138,.12); border-right: 1px solid rgba(30,58,138,.12);
}
.cc-line-item .cc-qty-btn.cc-qty-max-hit { animation: shake-x .3s; }

/* Productregels */
.cc-cart-lines { display: flex; flex-direction: column; gap: 12px; margin-bottom: 20px; }
.cc-line-item {
  display: grid; grid-template-columns: 72px 1fr auto 32px; gap: 16px; align-items: center;
  background: var(--surface); border: 1px solid rgba(30,58,138,.08);
  border-radius: 12px; padding: 14px 16px;
}
.cc-line-thumb { flex-shrink: 0; display: block; }
.cc-line-thumb img { width: 72px; height: 72px; object-fit: cover; border-radius: 8px; border: 1px solid rgba(30,58,138,.08); display: block; }
.cc-line-info { min-width: 0; }
.cc-line-name { font-size: 14px; font-weight: 700; color: var(--navy); text-decoration: none !important; line-height: 1.35; display: block; }
.cc-line-name:hover { color: var(--navy-soft); text-decoration: none !important; }
.cc-line-unit { font-size: 12px; color: var(--muted); margin-top: 4px; }
.cc-line-controls { display: flex; align-items: center; gap: 18px; }
.cc-line-item .quantity {
  display: inline-flex; align-items: center;
  border: 1.5px solid rgba(30,58,138,.15); border-radius: 6px; overflow: hidden;
}
.cc-line-item .quantity input.qty {
  width: 48px; height: 36px; border: none; text-align: center;
  font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 700; font-size: 14px; color: var(--navy);
  -moz-appearance: textfield; background: transparent;
}
.cc-line-item .quantity input.qty::-webkit-outer-spin-button,
.cc-line-item .quantity input.qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.cc-line-subtotal { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 16px; font-weight: 800; color: var(--navy); white-space: nowrap; }
.cc-line-remove {
  width: 30px; height: 30px; border-radius: 7px; background: rgba(30,58,138,.05);
  color: var(--muted); display: flex; align-items: center; justify-content: center;
  text-decoration: none; transition: background .15s, color .15s;
}
.cc-line-remove:hover { background: rgba(239,68,68,.1); color: #EF4444; }

/* Coupon + bijwerken */
.cc-cart-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 18px; }
.cc-coupon { display: flex; gap: 8px; flex: 1; min-width: 220px; }
.cc-coupon input {
  height: 42px; border: 1.5px solid rgba(30,58,138,.15); border-radius: var(--radius);
  padding: 0 14px; font-size: 14px; font-family: 'Inter', sans-serif; flex: 1; outline: none;
}
.cc-coupon input:focus { border-color: var(--navy); }
.cc-coupon-btn, .cc-update-btn {
  height: 42px; padding: 0 18px; background: var(--surface); color: var(--navy);
  border: 1.5px solid var(--navy); border-radius: var(--radius);
  font-family: 'Inter', sans-serif; font-size: 13.5px; font-weight: 600; cursor: pointer;
  transition: background .15s, color .15s; white-space: nowrap;
}
.cc-coupon-btn:hover, .cc-update-btn:hover { background: var(--navy); color: #fff; }

.cc-continue-shopping {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: 13.5px; font-weight: 600; color: var(--muted);
  text-decoration: none; transition: color .15s;
}
.cc-continue-shopping:hover { color: var(--navy); }

/* Verzendmethodes in cart-totalen â€” nette keuzevakken */
.cart_totals .woocommerce-shipping-totals th,
.cart_totals .woocommerce-shipping-totals td {
  display: block; width: 100%; text-align: left !important;
  padding: 0 !important; border: none !important;
}
.cart_totals .woocommerce-shipping-totals th {
  font-family: 'Inter', sans-serif; font-size: 11px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .05em; color: var(--muted) !important;
  padding: 14px 0 10px !important;
}
.cart_totals ul#shipping_method,
.cart_totals .woocommerce-shipping-methods {
  list-style: none; margin: 0; padding: 0;
}
.cart_totals ul#shipping_method li,
.cart_totals .woocommerce-shipping-methods li {
  display: flex; align-items: flex-start; gap: 10px;
  border: 1.5px solid rgba(30,58,138,.12); border-radius: 8px;
  padding: 12px; margin: 0 0 8px; cursor: pointer;
  transition: border-color .15s, background .15s;
}
.cart_totals ul#shipping_method li:hover,
.cart_totals .woocommerce-shipping-methods li:hover { border-color: rgba(30,58,138,.3); background: rgba(30,58,138,.02); }
.cart_totals ul#shipping_method li input[type="radio"],
.cart_totals .woocommerce-shipping-methods li input[type="radio"] {
  width: 18px; height: 18px; accent-color: var(--navy); flex-shrink: 0; margin: 1px 0 0;
}
.cart_totals ul#shipping_method li label,
.cart_totals .woocommerce-shipping-methods li label {
  margin: 0 !important; padding: 0 !important; font-size: 13px; font-weight: 600; color: var(--navy);
  display: block; flex: 1; cursor: pointer; line-height: 1.45;
}
.cart_totals ul#shipping_method li label .amount,
.cart_totals ul#shipping_method li label .woocommerce-Price-amount {
  font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; color: var(--navy);
}
/* Eén verzendoptie: nette totaalregel i.p.v. keuzevak */
.cart_totals .woocommerce-shipping-totals.cc-ship-single th,
.cart_totals .woocommerce-shipping-totals.cc-ship-single td {
  display: table-cell; width: auto;
  padding: 12px 0 !important;
  border-bottom: 1px solid rgba(30,58,138,.07) !important;
  vertical-align: top;
}
.cart_totals .cc-ship-single th {
  font-family: 'Inter', sans-serif; font-size: 13px; font-weight: 600;
  text-transform: none; letter-spacing: 0;
  color: var(--muted) !important; text-align: left !important;
}
.cart_totals .cc-ship-single td { text-align: right !important; }
.cc-ship-single .cc-ship-name {
  display: block; font-size: 11px; font-weight: 500; color: var(--muted);
  margin-bottom: 1px; line-height: 1.3;
}
.cc-ship-single .cc-ship-cost,
.cc-ship-single .cc-ship-cost .woocommerce-Price-amount {
  font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800;
  font-size: 14.5px; color: var(--navy);
}
.cc-ship-single .cc-ship-free { font-style: normal; color: #16A34A; }

.cart_totals .woocommerce-shipping-destination {
  font-size: 12px; color: var(--muted); margin: 10px 0 0; line-height: 1.5;
}
.cart_totals .woocommerce-shipping-destination a { color: var(--navy); font-weight: 600; }

/* Verwijder boxy celranden in cart-totalen, alleen waar nodig */
.cart_totals table, .cart_totals table tbody, .cart_totals table tr { border: none !important; }
.cart_totals table .cart-subtotal th,
.cart_totals table .cart-subtotal td { border-bottom: 1px solid rgba(30,58,138,.07) !important; }

/* Verzendnotitie in winkelwagen-totalen */
.cc-cart-shipnote {
  display: flex; align-items: center; gap: 7px;
  font-size: 12px; font-weight: 600; color: var(--muted);
  margin-top: 12px; padding-top: 12px; border-top: 1px solid rgba(30,58,138,.07);
}
.cc-cart-shipnote svg { color: var(--navy); opacity: .6; flex-shrink: 0; }

/* Cadeau-progress in totalen */
.cc-cart-gift {
  background: linear-gradient(135deg, rgba(255,215,0,.14), rgba(255,215,0,.05));
  border: 1px solid rgba(255,215,0,.3); border-radius: 10px;
  padding: 12px 14px; margin-bottom: 18px;
}
.cc-cart-gift.reached { background: linear-gradient(135deg, rgba(34,197,94,.14), rgba(34,197,94,.05)); border-color: rgba(34,197,94,.3); }
.cc-cart-gift-top { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--navy); margin-bottom: 8px; }
.cc-cart-gift-top svg { color: var(--yellow-dk); flex-shrink: 0; }
.cc-cart-gift.reached .cc-cart-gift-top svg { color: #16A34A; }
.cc-cart-gift-top strong { font-weight: 800; }
.cc-cart-gift-track { height: 6px; background: rgba(30,58,138,.1); border-radius: 3px; overflow: hidden; }
.cc-cart-gift-fill { height: 100%; border-radius: 3px; background: linear-gradient(90deg, var(--yellow-dk), var(--yellow)); transition: width .4s ease; }
.cc-cart-gift.reached .cc-cart-gift-fill { background: linear-gradient(90deg, #16A34A, #22C55E); }

/* Cross-sell rij */
.cc-crosssell {
  margin-top: 28px; padding-top: 24px; border-top: 1px dashed rgba(30,58,138,.15);
  position: relative;
}
.cc-crosssell-head { display: flex; align-items: baseline; gap: 10px; margin-bottom: 16px; }
.cc-crosssell-title { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 16px; font-weight: 800; color: var(--navy); }
.cc-crosssell-sub { font-size: 12px; color: var(--muted); }
.cc-crosssell-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.cc-crosssell-item {
  display: flex; align-items: center; gap: 10px;
  background: var(--surface); border: 1px solid rgba(30,58,138,.08);
  border-radius: 10px; padding: 10px; position: relative;
  transition: border-color .15s, transform .15s, box-shadow .15s;
}
.cc-crosssell-item:hover { border-color: rgba(30,58,138,.2); transform: translateY(-2px); box-shadow: 0 6px 18px rgba(30,58,138,.08); }
.cc-crosssell-link { display: flex; align-items: center; gap: 10px; text-decoration: none !important; flex: 1; min-width: 0; }
.cc-crosssell-link:hover .cc-crosssell-name { color: var(--navy-soft); }
.cc-crosssell-name, .cc-crosssell-link:hover { text-decoration: none !important; }
.cc-crosssell-link img, .cc-crosssell-noimg {
  width: 48px; height: 48px; border-radius: 7px; object-fit: cover;
  border: 1px solid rgba(30,58,138,.08); flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; font-size: 22px; background: var(--bg);
}
.cc-crosssell-info { min-width: 0; }
.cc-crosssell-name { font-size: 12px; font-weight: 700; color: var(--navy); line-height: 1.3; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.cc-crosssell-price { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 13px; font-weight: 800; color: var(--navy); margin-top: 3px; }
.cc-crosssell-add {
  width: 30px; height: 30px; border-radius: 7px; background: var(--navy); color: #fff !important;
  display: flex; align-items: center; justify-content: center; font-size: 20px; font-weight: 800;
  line-height: 1; text-decoration: none !important; flex-shrink: 0; transition: background .15s, transform .1s;
}
.cc-crosssell-add:hover, .cc-crosssell-add:focus { background: var(--navy-soft); color: #fff !important; text-decoration: none !important; transform: scale(1.08); }

/* Cart totalen blok */
.cc-cart-side { min-width: 0; }
.cart_totals {
  background: var(--surface); border: 1px solid rgba(30,58,138,.1);
  border-radius: 14px; padding: 16px 24px 24px; position: sticky; top: 140px;
}

/* Meekijkende Pikachu op de totalen-kaart */
.cc-totals-mascot {
  position: absolute; top: -46px; right: 16px;
  width: 74px; pointer-events: none; z-index: 1;
  filter: drop-shadow(0 6px 10px rgba(30,58,138,.18));
  animation: mascotBob 4s ease-in-out infinite;
}
@keyframes mascotBob { 0%,100% { transform: translateY(0) rotate(-4deg); } 50% { transform: translateY(-7px) rotate(4deg); } }
.cart_totals h2 {
  font-family: 'Plus Jakarta Sans', sans-serif; font-size: 18px; font-weight: 800;
  color: var(--navy); margin-top: 0; margin-bottom: 18px;
}
.cart_totals table { width: 100%; border-collapse: collapse; }
.cart_totals table th, .cart_totals table td {
  padding: 12px 0; border-bottom: 1px solid rgba(30,58,138,.07);
  font-size: 14px; text-align: left; vertical-align: top;
}
.cart_totals table th { color: var(--muted); font-weight: 600; }
.cart_totals table td { text-align: right; color: var(--navy); font-weight: 600; }
.cart_totals .order-total th, .cart_totals .order-total td {
  border-bottom: none; padding-top: 16px;
}
.cart_totals .order-total td { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 22px; font-weight: 800; }
.cart_totals .wc-proceed-to-checkout { padding: 18px 0 0; }
.cart_totals .checkout-button {
  display: flex !important; align-items: center; justify-content: center; gap: 8px;
  width: 100%; padding: 15px !important; background: var(--navy) !important; color: #fff !important;
  border-radius: var(--radius) !important; font-family: 'Inter', sans-serif !important;
  font-size: 15px !important; font-weight: 700 !important; text-decoration: none;
  box-shadow: 0 4px 14px rgba(30,58,138,.25); transition: background .15s, transform .1s;
  height: auto !important;
}
.cart_totals .checkout-button:hover { background: var(--navy-soft) !important; transform: translateY(-1px); }

/* Cart trust onder totalen */
.cc-cart-page-trust {
  margin-top: 16px; padding-top: 16px; border-top: 1px solid rgba(30,58,138,.08);
  display: flex; flex-direction: column; gap: 8px;
}
.cc-cart-page-trust div { display: flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 600; color: var(--navy); }
.cc-cart-page-trust svg { color: var(--navy); opacity: .65; flex-shrink: 0; }

/* Lege cart */
.cc-empty-cart { text-align: center; padding: 64px 24px; }
.cc-empty-cart-icon { color: rgba(30,58,138,.2); margin-bottom: 18px; }
.cc-empty-cart h2 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 24px; font-weight: 800; color: var(--navy); margin-bottom: 8px; }
.cc-empty-cart p { font-size: 14px; color: var(--muted); margin-bottom: 24px; }

/* â•â•â• CHECKOUT PAGINA â•â•â• */
.woocommerce-checkout .cc-shop-inner { max-width: 1080px; }

/* Stappen-indicator */
.cc-checkout-steps {
  display: flex; align-items: center; gap: 10px; margin-bottom: 18px; flex-wrap: wrap;
}
.cc-step {
  display: flex; align-items: center; gap: 8px;
  font-size: 13px; font-weight: 600; color: var(--muted); text-decoration: none;
}
.cc-step-num {
  width: 24px; height: 24px; border-radius: 50%;
  background: rgba(30,58,138,.1); color: var(--muted);
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 800; flex-shrink: 0;
}
.cc-step.done { color: var(--navy); }
.cc-step.done .cc-step-num { background: #22C55E; color: #fff; }
.cc-step.active { color: var(--navy); }
.cc-step.active .cc-step-num { background: var(--navy); color: #fff; }
.cc-step-line { flex: 1; max-width: 50px; height: 2px; background: rgba(30,58,138,.12); }

/* Geruststelling-balk */
.cc-checkout-reassure {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px 18px;
  padding: 16px 18px; background: var(--surface);
  border: 1px solid rgba(30,58,138,.1); border-radius: 14px; margin-bottom: 28px;
  box-shadow: 0 4px 14px rgba(30,58,138,.04);
}
/* Compacte variant onder de Afrekenen-knop (smalle totalen-kolom):
   icoon boven de titel, subtekst weg — past op elke breedte. */
.cc-reassure-compact {
  grid-template-columns: repeat(3, 1fr); gap: 6px; padding: 14px 10px;
  margin-top: 16px; margin-bottom: 0; box-shadow: none;
}
.cc-reassure-compact .cc-reassure-item { flex-direction: column; align-items: center; text-align: center; gap: 6px; }
.cc-reassure-compact .cc-reassure-ico { width: 30px; height: 30px; border-radius: 8px; }
.cc-reassure-compact .cc-reassure-ico svg { width: 16px; height: 16px; }
.cc-reassure-compact .cc-reassure-item > div { align-items: center; text-align: center; }
.cc-reassure-compact .cc-reassure-item strong { font-size: 11px; line-height: 1.2; }
.cc-reassure-compact .cc-reassure-item > div > span { display: none; }
.cc-reassure-item { display: flex; align-items: center; gap: 11px; min-width: 0; }
.cc-reassure-ico {
  width: 38px; height: 38px; border-radius: 11px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
}
.ico-secure { background: rgba(22,163,74,.12); color: #16a34a; }
.ico-ship   { background: rgba(30,58,138,.10); color: var(--navy); }
.ico-return { background: rgba(230,184,0,.16); color: var(--yellow-dk); }
.ico-auth   { background: rgba(22,163,74,.12); color: #16a34a; }
/* Premium trust-tegels op de productpagina (3 stuks, icoon boven titel) */
.cc-product-reassure {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px;
  padding: 18px 14px; margin: 20px 0; background: var(--surface);
  border: 1px solid rgba(30,58,138,.1); border-radius: 14px;
  box-shadow: 0 4px 14px rgba(30,58,138,.04);
}
.cc-product-reassure .cc-reassure-item { flex-direction: column; align-items: center; text-align: center; gap: 9px; }
.cc-product-reassure .cc-reassure-item strong { font-size: 13px; }

/* Beschrijvings-band ("Over dit product") */
.cc-prod-detail { max-width: 1280px; margin: 0 auto; padding: 56px 24px; display: grid; grid-template-columns: 1fr 340px; gap: 48px; }
.cc-reassure-item > div { display: flex; flex-direction: column; line-height: 1.25; min-width: 0; }
.cc-reassure-item strong { font-size: 13px; font-weight: 800; color: var(--navy); }
.cc-reassure-item > div > span { font-size: 11.5px; color: var(--muted); }

.woocommerce-checkout form.checkout {
  display: grid; grid-template-columns: 1fr 400px; gap: 32px; align-items: start;
}
.cc-checkout-left { min-width: 0; display: flex; flex-direction: column; gap: 20px; }
.cc-checkout-right { min-width: 0; }
.cc-checkout-card {
  background: var(--surface); border: 1px solid rgba(30,58,138,.08);
  border-radius: 14px; padding: 24px;
}
.cc-checkout-card:empty { display: none; }
.woocommerce-checkout #customer_details { display: flex; flex-direction: column; gap: 20px; }
.woocommerce-checkout .col2-set, .woocommerce-checkout .col-1, .woocommerce-checkout .col-2 {
  width: 100% !important; float: none !important; margin: 0; padding: 0;
}
.woocommerce-checkout h3 {
  font-family: 'Plus Jakarta Sans', sans-serif; font-size: 18px; font-weight: 800;
  color: var(--navy); margin: 0 0 18px; padding-bottom: 12px;
  border-bottom: 1px solid rgba(30,58,138,.08);
}
.woocommerce-checkout h3#ship-to-different-address {
  border: none; padding: 0; font-size: 16px; display: flex; align-items: center; gap: 10px;
}
.woocommerce-checkout h3#ship-to-different-address label { margin: 0; cursor: pointer; }
.woocommerce-checkout .form-row { margin-bottom: 14px; }
.woocommerce-checkout label { font-size: 13px; font-weight: 600; color: var(--navy); margin-bottom: 6px; display: block; }
.woocommerce-checkout .required { color: #EF4444; }
.woocommerce-checkout input.input-text,
.woocommerce-checkout textarea,
.woocommerce-checkout select,
.woocommerce-checkout .select2-selection {
  width: 100%; min-height: 46px; border: 1.5px solid rgba(30,58,138,.15) !important;
  border-radius: var(--radius); padding: 0 14px; font-size: 14px;
  font-family: 'Inter', sans-serif; color: var(--text); background: var(--surface);
  transition: border-color .15s, box-shadow .15s;
}
.woocommerce-checkout textarea { padding: 12px 14px; min-height: 90px; }
.woocommerce-checkout input.input-text:focus,
.woocommerce-checkout textarea:focus,
.woocommerce-checkout select:focus {
  border-color: var(--navy) !important; box-shadow: 0 0 0 3px rgba(30,58,138,.08); outline: none;
}

/* Order review (rechterkolom) */
.woocommerce-checkout #order_review_heading {
  font-family: 'Plus Jakarta Sans', sans-serif; font-size: 18px; font-weight: 800; color: var(--navy); margin-bottom: 18px;
}
.woocommerce-checkout #order_review {
  background: var(--surface); border: 1px solid rgba(30,58,138,.1);
  border-radius: 14px; padding: 24px; position: sticky; top: 140px;
}
.woocommerce-checkout #order_review table.shop_table { width: 100%; border-collapse: collapse; }
.woocommerce-checkout #order_review th, .woocommerce-checkout #order_review td {
  padding: 10px 0; border-bottom: 1px solid rgba(30,58,138,.07); font-size: 13.5px; text-align: left;
}
.woocommerce-checkout #order_review td { text-align: right; color: var(--navy); font-weight: 600; }
.woocommerce-checkout #order_review .cart_item .product-name { color: var(--navy); font-weight: 600; }
.woocommerce-checkout #order_review .order-total td { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 20px; font-weight: 800; }

/* Betaalmethoden */
.woocommerce-checkout #payment { background: transparent; border-radius: 0; }
.woocommerce-checkout #payment ul.payment_methods {
  border: none; padding: 16px 0 0; margin: 0; list-style: none;
}
.woocommerce-checkout #payment ul.payment_methods li {
  background: var(--bg); border: 1.5px solid rgba(30,58,138,.1); border-radius: 8px;
  padding: 12px 14px; margin-bottom: 8px;
}
.woocommerce-checkout #payment ul.payment_methods li label { display: inline; font-weight: 600; }
.woocommerce-checkout #payment div.payment_box {
  background: transparent; font-size: 12.5px; color: var(--muted); margin-top: 8px;
}
.woocommerce-checkout #payment div.payment_box::before { display: none; }
.woocommerce-checkout #place_order {
  display: flex !important; align-items: center; justify-content: center; gap: 8px;
  width: 100%; padding: 16px !important; margin-top: 16px;
  background: var(--navy) !important; color: #fff !important; border: none !important;
  border-radius: var(--radius) !important; font-family: 'Inter', sans-serif !important;
  font-size: 16px !important; font-weight: 700 !important; cursor: pointer;
  box-shadow: 0 4px 14px rgba(30,58,138,.25); transition: background .15s, transform .1s;
}
.woocommerce-checkout #place_order:hover { background: var(--navy-soft) !important; transform: translateY(-1px); }
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper { font-size: 12.5px; color: var(--muted); margin-top: 12px; }

/* Order review â€” productlijst met foto's */
.cc-review-items { display: flex; flex-direction: column; gap: 12px; margin-bottom: 16px; }
.cc-review-item { display: grid; grid-template-columns: 54px 1fr auto; gap: 12px; align-items: center; }
.cc-review-thumb { position: relative; width: 54px; height: 54px; flex-shrink: 0; }
.cc-review-thumb img { width: 54px; height: 54px; object-fit: cover; border-radius: 8px; border: 1px solid rgba(30,58,138,.08); display: block; }
.cc-review-qty {
  position: absolute; top: -7px; right: -7px;
  background: var(--navy); color: #fff; font-size: 11px; font-weight: 700;
  min-width: 20px; height: 20px; padding: 0 5px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center; border: 2px solid var(--surface);
}
.cc-review-name { font-size: 13px; font-weight: 600; color: var(--navy); line-height: 1.35; }
.cc-review-price { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 14px; font-weight: 800; color: var(--navy); white-space: nowrap; }

/* Cadeau-status in review */
.cc-review-gift {
  display: flex; align-items: center; gap: 8px;
  background: linear-gradient(135deg, rgba(255,215,0,.14), rgba(255,215,0,.05));
  border: 1px solid rgba(255,215,0,.3); border-radius: 8px;
  padding: 10px 12px; margin-bottom: 16px; font-size: 12.5px; color: var(--navy);
}
.cc-review-gift.reached { background: linear-gradient(135deg, rgba(34,197,94,.14), rgba(34,197,94,.05)); border-color: rgba(34,197,94,.3); }
.cc-review-gift svg { color: var(--yellow-dk); flex-shrink: 0; }
.cc-review-gift.reached svg { color: #16A34A; }
.cc-review-gift strong { font-weight: 800; }

/* Totalen in review */
.cc-review-totals { border-top: 1px solid rgba(30,58,138,.08); padding-top: 14px; }
.cc-review-row { display: flex; justify-content: space-between; align-items: baseline; padding: 7px 0; font-size: 14px; color: var(--navy); }
.cc-review-row span:first-child { color: var(--muted); font-weight: 600; }
.cc-review-row span:last-child { font-weight: 600; }
/* Verzendregel: methodenaam klein achter 'Verzending' */
.cc-review-ship span:first-child small {
  display: block; font-size: 11px; font-weight: 500; color: var(--muted);
  margin-top: 1px; line-height: 1.3; text-transform: none; letter-spacing: 0;
}
.cc-review-ship .cc-ship-free { font-style: normal; color: #16A34A; font-weight: 700; }
.cc-review-discount span:last-child { color: #16A34A; }
.cc-review-total { border-top: 1px solid rgba(30,58,138,.08); margin-top: 7px; padding-top: 14px; }
.cc-review-total span:first-child { color: var(--navy) !important; font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 16px; }
.cc-review-total span:last-child { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 22px; text-align: right; }
/* BTW-vermelding klein en grijs onder het totaal */
.cc-review-total .includes_tax,
.cc-review-total .includes_tax *,
.woocommerce-checkout .order-total .includes_tax,
.woocommerce-checkout .order-total .includes_tax *,
.cart_totals .includes_tax,
.cart_totals .includes_tax * {
  font-family: 'Inter', sans-serif !important;
  font-size: 11px !important; font-weight: 500 !important;
  color: var(--muted) !important; line-height: 1.3 !important;
  vertical-align: baseline !important; letter-spacing: 0 !important;
}
.cc-review-total .includes_tax,
.woocommerce-checkout .order-total .includes_tax,
.cart_totals .includes_tax { display: block; margin-top: 3px; }

/* ═══════════════════════════════════════════════
   ORDER CONFIRMATION — "Collector Achievement"
   ═══════════════════════════════════════════════ */
.cc-oc { max-width: 680px; margin: 0 auto; }
.cc-oc-confetti { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 9999; }
.cc-oc-h2 { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 19px; color: var(--navy); margin: 0 0 4px; }

.cc-oc-card {
  background: #fff; border: 1px solid rgba(30,58,138,.1); border-radius: 18px;
  padding: 22px; margin-bottom: 16px; box-shadow: 0 6px 22px rgba(30,58,138,.05);
}

/* Knoppen */
.cc-oc-btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 50px; padding: 0 28px; border: none; border-radius: 12px;
  font-family: 'Inter', sans-serif; font-weight: 800; font-size: 15px;
  cursor: pointer; text-decoration: none; transition: transform .12s, box-shadow .2s;
}
.cc-oc-btn--gold { background: var(--yellow); color: var(--navy) !important; box-shadow: 0 6px 18px rgba(255,186,0,.36); }
.cc-oc-btn--navy { background: var(--navy); color: #fff !important; box-shadow: 0 6px 18px rgba(30,45,125,.28); }
.cc-oc-btn:hover { transform: translateY(-2px); }
/* Geen automatische underline op links binnen de bedankpagina */
.cc-page-content .cc-oc a { text-decoration: none; }
.cc-oc-textlink { color: var(--navy); font-weight: 700; font-size: 14px; text-decoration: none; }
.cc-oc-textlink:hover { text-decoration: underline; }
.cc-oc-textlink:hover { color: var(--yellow-dk); }
.cc-oc-cta-row { display: flex; align-items: center; justify-content: center; gap: 18px; flex-wrap: wrap; margin-top: 20px; }

/* ─── 1. HERO (clean & leesbaar) ─── */
.cc-oc-hero {
  text-align: center; background: #fff; border: 1px solid rgba(30,58,138,.1);
  border-radius: 20px; padding: 34px 24px 26px; margin-bottom: 16px;
  box-shadow: 0 8px 26px rgba(30,58,138,.06);
}
.cc-oc-check {
  width: 74px; height: 74px; border-radius: 50%; margin: 0 auto 16px;
  display: flex; align-items: center; justify-content: center; color: #fff;
  background: #16A34A; box-shadow: 0 10px 26px rgba(22,163,74,.30);
  animation: cc-oc-pop .5s cubic-bezier(.2,1.5,.4,1) both;
}
.cc-oc-hero--fail .cc-oc-check { background: #DC2626; box-shadow: 0 10px 26px rgba(220,38,38,.26); }
.cc-oc-hero h1 {
  font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800;
  font-size: 26px; line-height: 1.18; color: var(--navy); margin: 0 0 8px;
}
.cc-oc-hero .cc-oc-hero-sub { font-size: 14.5px; line-height: 1.55; color: var(--muted); margin: 0 auto; max-width: 450px; text-align: center; }
.cc-oc-hero-sub strong { color: var(--navy); }
@keyframes cc-oc-pop { from { transform: scale(0); opacity: 0; } to { transform: scale(1); opacity: 1; } }

/* Hero stats — lichte tegels, navy tekst */
.cc-oc-hero-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-top: 24px; }
.cc-oc-hero-stats > div {
  background: var(--surface); border: 1px solid rgba(30,58,138,.08);
  border-radius: 12px; padding: 12px 8px; text-align: center;
}
.cc-oc-hero-stats > div > span { display: block; font-size: 9.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); margin-bottom: 5px; }
.cc-oc-hero-stats strong { display: block; font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 14px; color: var(--navy); white-space: nowrap; }
.cc-oc-hero-stats .woocommerce-Price-amount { color: var(--navy); white-space: nowrap; }

/* ─── 2. XP / RANK ─── */
.cc-oc-xp { background: linear-gradient(135deg, #fff, #fbfaf6); }
.cc-oc-xp-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.cc-oc-xp-rank { display: flex; align-items: center; gap: 12px; }
.cc-oc-xp-lvl {
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
  width: 46px; height: 46px; border-radius: 12px; background: var(--navy); color: var(--yellow);
  font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 12px;
  box-shadow: 0 4px 12px rgba(30,45,125,.25);
}
.cc-oc-xp-label { display: block; font-size: 10.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--muted); }
.cc-oc-xp-name { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 18px; color: var(--navy); }
.cc-oc-xp-gain {
  flex-shrink: 0; background: rgba(255,186,0,.16); color: var(--yellow-dk);
  font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 14px;
  padding: 7px 12px; border-radius: 999px; border: 1px solid rgba(255,186,0,.4);
}
.cc-oc-xp-bar { height: 12px; border-radius: 999px; background: rgba(30,58,138,.1); overflow: hidden; }
.cc-oc-xp-fill {
  display: block; height: 100%; width: 0; border-radius: 999px;
  background: linear-gradient(90deg, var(--yellow), #ffcf4d);
  box-shadow: 0 0 12px rgba(255,186,0,.5); transition: width 1.3s cubic-bezier(.22,1,.36,1);
}
.cc-oc.is-animated .cc-oc-xp-fill { width: var(--p); }
.cc-oc-xp-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 10px; font-size: 12.5px; color: var(--muted); }
.cc-oc-xp-foot strong { color: var(--navy); }
.cc-oc-xp-pct { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; color: var(--navy); }

/* ─── 3. TRACK ─── */
.cc-oc-track-intro { font-size: 13px; color: var(--muted); margin: 0 0 18px; }
.cc-oc-steps { position: relative; }
.cc-oc-step { position: relative; display: flex; align-items: flex-start; gap: 14px; padding-bottom: 18px; }
.cc-oc-step:last-child { padding-bottom: 0; }
.cc-oc-step::before {
  content: ""; position: absolute; left: 13px; top: 26px; bottom: -2px; width: 2px;
  background: rgba(30,58,138,.12);
}
.cc-oc-step:last-child::before { display: none; }
.cc-oc-step.is-done::before { background: var(--navy); }
.cc-oc-step-dot {
  position: relative; z-index: 1; flex-shrink: 0; width: 28px; height: 28px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: #fff; border: 2px solid rgba(30,58,138,.18); color: #fff;
}
.cc-oc-step.is-done .cc-oc-step-dot { background: var(--navy); border-color: var(--navy); }
.cc-oc-step.is-active .cc-oc-step-dot { border-color: var(--yellow); background: var(--yellow); box-shadow: 0 0 0 0 rgba(255,186,0,.5); animation: cc-oc-pulse 1.8s ease-out infinite; }
@keyframes cc-oc-pulse { 0% { box-shadow: 0 0 0 0 rgba(255,186,0,.55); } 70% { box-shadow: 0 0 0 10px rgba(255,186,0,0); } 100% { box-shadow: 0 0 0 0 rgba(255,186,0,0); } }
.cc-oc-step-txt { padding-top: 2px; }
.cc-oc-step-txt strong { display: block; font-size: 14px; color: var(--navy); font-weight: 700; }
.cc-oc-step.is-todo .cc-oc-step-txt strong { color: var(--muted); font-weight: 600; }
.cc-oc-step-txt small { font-size: 12px; color: var(--muted); }
.cc-oc-step.is-active .cc-oc-step-txt strong { color: var(--yellow-dk); }

/* ─── 4. SUMMARY ─── */
.cc-oc-summary .cc-oc-h2 { margin-bottom: 14px; }
.cc-oc-items { margin-bottom: 4px; }
.cc-oc-item { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid rgba(30,58,138,.07); }
.cc-oc-item-thumb { position: relative; flex-shrink: 0; }
.cc-oc-item-thumb img { width: 48px; height: 48px; border-radius: 9px; object-fit: cover; display: block; background: var(--surface); }
.cc-oc-item-qty {
  position: absolute; top: -7px; right: -7px; min-width: 19px; height: 19px; padding: 0 5px;
  border-radius: 999px; background: var(--navy); color: #fff; font-size: 11px; font-weight: 800;
  display: flex; align-items: center; justify-content: center; border: 2px solid #fff;
}
.cc-oc-item-name { flex: 1; min-width: 0; font-size: 13.5px; line-height: 1.35; }
.cc-oc-item-name a { color: var(--navy); font-weight: 600; text-decoration: none; }
.cc-oc-item-name a:hover { text-decoration: underline; }
.cc-oc-item-price { flex-shrink: 0; font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; color: var(--navy); font-size: 14px; }
.cc-oc-totals { margin-top: 12px; }
.cc-oc-trow { display: flex; justify-content: space-between; align-items: baseline; padding: 5px 0; font-size: 13.5px; color: var(--muted); }
.cc-oc-trow span:last-child { color: var(--navy); font-weight: 600; }
.cc-oc-trow.is-grand { margin-top: 6px; padding-top: 12px; border-top: 1px solid rgba(30,58,138,.1); }
.cc-oc-trow.is-grand span:first-child { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 16px; color: var(--navy); }
.cc-oc-trow.is-grand span:last-child { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 20px; color: var(--navy); }
.cc-oc-trow.is-grand .includes_tax { display: block; margin-top: 2px; font-family: 'Inter', sans-serif; font-size: 11.5px; font-weight: 600; color: var(--muted); }
.cc-oc-trow.is-grand .includes_tax .woocommerce-Price-amount { font-weight: 600; font-size: 11.5px; }
/* €-symbool iets kleiner dan de cijfers in de totaalregel */
.cc-oc-trow.is-grand .woocommerce-Price-currencySymbol { font-size: .72em; }
.cc-oc-addr { margin-top: 14px; border-top: 1px solid rgba(30,58,138,.08); padding-top: 12px; }
.cc-oc-addr summary { cursor: pointer; font-size: 13px; font-weight: 700; color: var(--navy); list-style: none; }
.cc-oc-addr summary::-webkit-details-marker { display: none; }
.cc-oc-addr summary::after { content: " ▾"; color: var(--muted); }
.cc-oc-addr[open] summary::after { content: " ▴"; }
.cc-oc-addr-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 12px; }
.cc-oc-addr-grid span { display: block; font-size: 10.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); margin-bottom: 5px; }
.cc-oc-addr-grid address { font-style: normal; font-size: 13px; color: var(--navy); line-height: 1.55; }

/* ─── 5. MYSTERY ─── */
.cc-oc-mystery { position: relative; overflow: hidden; text-align: center; padding: 26px 22px; border: 1px dashed rgba(255,186,0,.55); background: linear-gradient(135deg, rgba(255,186,0,.08), rgba(30,58,138,.05)); }
.cc-oc-mystery p { font-size: 13.5px; color: var(--muted); line-height: 1.55; margin: 4px auto 16px; max-width: 380px; }
.cc-oc-mystery-spark { display: block; font-size: 30px; color: var(--yellow-dk); animation: cc-oc-twinkle 2.4s ease-in-out infinite; }
@keyframes cc-oc-twinkle { 0%,100% { transform: scale(1); opacity: .85; } 50% { transform: scale(1.25) rotate(8deg); opacity: 1; } }
.cc-oc-mystery-emoji { display: block; font-size: 40px; margin-bottom: 4px; animation: cc-oc-pop .5s cubic-bezier(.2,1.5,.4,1) both; }
.cc-oc-mystery-back small { display: block; margin-top: 12px; font-size: 11px; color: var(--muted); line-height: 1.5; }
.cc-oc-mystery.is-open { animation: cc-oc-flash .5s ease; }
@keyframes cc-oc-flash { 0% { box-shadow: 0 0 0 0 rgba(255,186,0,.6) inset; } 100% { box-shadow: 0 0 60px 0 rgba(255,186,0,0) inset; } }

/* ─── 6. PROOF ─── */
.cc-oc-proof { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 22px 0 16px; }
.cc-oc-proof-item { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; text-align: center; padding: 18px 8px; background: #fff; border: 1px solid rgba(30,58,138,.1); border-radius: 14px; }
.cc-oc-proof-item strong { display: flex; align-items: baseline; justify-content: center; gap: 2px; font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 23px; color: var(--navy); line-height: 1.05; min-height: 26px; }
.cc-oc-proof-sub { font-size: 13px; font-weight: 700; color: var(--muted); }
.cc-oc-proof-item > span { display: block; margin-top: 7px; font-size: 11.5px; color: var(--muted); font-weight: 600; line-height: 1.35; }

/* ─── 7. NEXT ─── */
.cc-oc-next { margin: 24px 0 16px; }
.cc-oc-next .cc-oc-h2 { margin-bottom: 14px; }
.cc-oc-next-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.cc-oc-next-tile {
  display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 14px;
  background: #fff; border: 1px solid rgba(30,58,138,.1); text-decoration: none;
  transition: transform .14s, box-shadow .2s, border-color .2s;
}
.cc-oc-next-tile:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(30,58,138,.12); border-color: rgba(255,186,0,.5); }
.cc-oc-next-img { flex-shrink: 0; width: 52px; height: 52px; border-radius: 10px; background: var(--surface) center/cover no-repeat; display: flex; align-items: center; justify-content: center; font-size: 24px; }
.cc-oc-next-img--ph { background: linear-gradient(135deg, rgba(30,58,138,.1), rgba(255,186,0,.15)); }
.cc-oc-next-meta { flex: 1; min-width: 0; }
.cc-oc-next-meta strong { display: block; font-size: 14px; color: var(--navy); font-weight: 700; line-height: 1.25; }
.cc-oc-next-meta small { font-size: 11.5px; color: var(--muted); }
.cc-oc-next-arrow { flex-shrink: 0; color: var(--yellow-dk); font-weight: 800; font-size: 18px; transition: transform .15s; }
.cc-oc-next-tile:hover .cc-oc-next-arrow { transform: translateX(3px); }

/* ─── 8. SHARE ─── */
.cc-oc-share { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: center; margin: 24px 0 16px; padding: 20px; border-radius: 18px; background: var(--surface); border: 1px solid rgba(30,58,138,.1); }
.cc-oc-share-card {
  position: relative; overflow: hidden; border-radius: 14px; padding: 20px 16px; text-align: center;
  background: radial-gradient(120% 100% at 50% 0%, #2a3a9e, var(--navy) 70%, #16205c);
  box-shadow: 0 10px 26px rgba(30,45,125,.3);
}
.cc-oc-share-card::after { content: ""; position: absolute; top: -40%; left: -30%; width: 80%; height: 180%; background: linear-gradient(115deg, transparent, rgba(255,255,255,.18), transparent); transform: rotate(8deg); }
.cc-oc-share-logo { display: block; margin-bottom: 12px; }
.cc-oc-share-logo img { height: 34px; width: auto; max-width: 70%; display: block; margin: 0 auto; }
.cc-oc-share-logo--txt { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 13px; letter-spacing: .18em; color: var(--yellow); }
.cc-oc-share-title { display: block; font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 17px; color: #fff; line-height: 1.25; }
.cc-oc-share-actions p { font-size: 13.5px; color: var(--navy); font-weight: 600; margin: 0 0 12px; line-height: 1.45; }
.cc-oc-share-btns { display: flex; flex-wrap: wrap; gap: 8px; }
.cc-oc-share-btn { flex: 1; min-width: 84px; text-align: center; padding: 10px 8px; border-radius: 10px; border: none; font-family: 'Inter', sans-serif; font-weight: 700; font-size: 13px; cursor: pointer; text-decoration: none; transition: transform .12s, opacity .15s; }
.cc-oc-share-btn:hover { transform: translateY(-1px); }
.cc-oc-share-btn.cc-wa { background: #25D366; color: #fff; }
.cc-oc-share-btn.cc-x { background: #111; color: #fff; }
.cc-oc-share-btn.cc-copy { background: var(--navy); color: #fff; }
.cc-oc-share-btn.cc-copy.is-copied { background: #16A34A; }

/* ─── 9. FOOT ─── */
.cc-oc-foot { margin-top: 26px; padding-top: 22px; border-top: 1px solid rgba(30,58,138,.1); display: flex; align-items: center; justify-content: center; gap: 18px; flex-wrap: wrap; }

@media (prefers-reduced-motion: reduce) {
  .cc-oc-badge-glow, .cc-oc-badge-star, .cc-oc-badge-check, .cc-oc-step.is-active .cc-oc-step-dot, .cc-oc-mystery-spark { animation: none !important; }
}

@media (max-width: 560px) {
  .cc-oc-hero h1 { font-size: 23px; }
  .cc-oc-hero-stats { grid-template-columns: repeat(2, 1fr); }
  .cc-oc-share { grid-template-columns: 1fr; }
  .cc-oc-addr-grid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .cc-oc-card { padding: 18px 16px; }
  .cc-oc-hero { padding: 28px 18px 24px; }
  .cc-oc-next-grid { grid-template-columns: 1fr; }
  .cc-oc-proof-item strong { font-size: 19px; }
  .cc-oc-foot { flex-direction: column; align-items: stretch; }
  .cc-oc-foot .cc-oc-btn { width: 100%; }
}

/* Coupon-toggle op checkout */
.woocommerce-checkout .woocommerce-form-coupon-toggle {
  margin-bottom: 20px;
}
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info {
  background: var(--surface); border: 1px solid rgba(30,58,138,.1);
  border-left: 3px solid var(--yellow-dk); border-radius: 8px;
  padding: 12px 16px; font-size: 13.5px; color: var(--navy); margin: 0;
  display: flex; align-items: center; gap: 6px;
}
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info::before { display: none; }
.woocommerce-checkout .woocommerce-form-coupon-toggle a { color: var(--navy); font-weight: 700; text-decoration: underline; }
.woocommerce-checkout .checkout_coupon {
  background: var(--surface); border: 1px solid rgba(30,58,138,.1);
  border-radius: 10px; padding: 16px; margin-bottom: 20px;
}
.woocommerce-checkout .checkout_coupon .form-row { margin-bottom: 0; }
.woocommerce-checkout .checkout_coupon input[type="text"] {
  height: 44px; border: 1.5px solid rgba(30,58,138,.15); border-radius: var(--radius);
  padding: 0 14px; font-size: 14px;
}
.woocommerce-checkout .checkout_coupon button {
  height: 44px; background: var(--navy) !important; color: #fff !important;
  border: none !important; border-radius: var(--radius) !important;
  font-weight: 700 !important; padding: 0 22px !important;
}

/* â”€â”€â”€ ORDER BUMP â”€â”€â”€ */
.cc-order-bump { margin: 0 0 18px; }
.cc-bump-label { display: block; cursor: pointer; }
.cc-bump-check { position: absolute; opacity: 0; pointer-events: none; }
.cc-bump-box {
  display: block; position: relative;
  border: 2px dashed var(--yellow-dk); border-radius: 12px;
  background: linear-gradient(135deg, rgba(255,215,0,.1), rgba(255,215,0,.03));
  padding: 16px 14px 14px; transition: border-color .15s, background .15s;
}
.cc-bump-label:hover .cc-bump-box { background: linear-gradient(135deg, rgba(255,215,0,.16), rgba(255,215,0,.06)); }
.cc-bump-check:checked + .cc-bump-box {
  border-style: solid; border-color: #22C55E;
  background: linear-gradient(135deg, rgba(34,197,94,.12), rgba(34,197,94,.04));
}
.cc-bump-tag {
  position: absolute; top: -11px; left: 14px;
  background: var(--yellow-dk); color: var(--navy);
  font-size: 10px; font-weight: 800; letter-spacing: .04em;
  padding: 3px 10px; border-radius: 20px; text-transform: uppercase;
}
.cc-bump-check:checked + .cc-bump-box .cc-bump-tag { background: #22C55E; color: #fff; }
.cc-bump-content { display: flex; align-items: center; gap: 12px; }
.cc-bump-img { width: 52px; height: 52px; object-fit: cover; border-radius: 8px; border: 1px solid rgba(30,58,138,.1); flex-shrink: 0; }
.cc-bump-info { flex: 1; min-width: 0; }
.cc-bump-name { display: block; font-size: 13px; font-weight: 700; color: var(--navy); line-height: 1.3; }
.cc-bump-desc { display: block; font-size: 11.5px; color: var(--muted); margin-top: 2px; }
.cc-bump-price { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 16px; font-weight: 800; color: var(--navy); white-space: nowrap; }
.cc-bump-box::after {
  content: ''; position: absolute; top: 14px; right: 14px;
  width: 20px; height: 20px; border: 2px solid rgba(30,58,138,.25); border-radius: 50%;
  transition: background .15s, border-color .15s; display: none;
}

/* Place order area netjes vol breedte */
.woocommerce-checkout #payment .place-order { padding: 0 !important; width: 100%; }
.woocommerce-checkout #payment .form-row.place-order { float: none; width: 100%; }
.woocommerce-checkout #place_order { float: none !important; width: 100% !important; }

/* Trust onder bestelknop */
.cc-checkout-trust {
  clear: both; width: 100%;
  display: flex; align-items: center; justify-content: center; gap: 7px;
  font-size: 12px; font-weight: 600; color: var(--muted);
  margin-top: 14px; padding-top: 14px; border-top: 1px solid rgba(30,58,138,.07);
  text-align: center; line-height: 1.4;
}
.cc-checkout-trust svg { color: #22C55E; flex-shrink: 0; }

/* Reviews onder bestelknop */
.cc-checkout-reviews {
  text-align: center; margin-top: 14px; padding-top: 14px;
  border-top: 1px solid rgba(30,58,138,.07);
}
.cc-checkout-reviews-stars {
  color: var(--yellow-dk); font-size: 18px; letter-spacing: 2px; margin-bottom: 4px;
}
.cc-checkout-reviews-text { font-size: 13px; color: var(--navy); }
.cc-checkout-reviews-text strong { font-weight: 800; }
.cc-checkout-reviews-sub { font-size: 11.5px; color: var(--muted); margin-top: 3px; }

/* ═══════════════════════════════════════════════
   SHOP ARCHIVE / CATEGORIEPAGINA
   ═══════════════════════════════════════════════ */
.cc-archive { background: var(--bg); }

/* Alle sets-overzichtspagina */
.cc-sets-era-block { margin-bottom: 40px; }
.cc-sets-era {
  font-family: 'Plus Jakarta Sans', sans-serif; font-size: 22px; font-weight: 800; color: var(--navy);
  margin: 0 0 18px; padding-bottom: 10px; border-bottom: 2px solid rgba(255,215,0,.5); display: inline-block;
}
.cc-sets-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px; }
.cc-set-card {
  display: flex; align-items: center; gap: 14px; padding: 12px;
  background: var(--surface); border: 1px solid rgba(30,58,138,.1); border-radius: 14px;
  text-decoration: none; transition: transform .14s, box-shadow .14s, border-color .14s; position: relative;
}
.cc-set-card:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(30,58,138,.12); border-color: rgba(30,58,138,.2); }
.cc-set-card-img {
  width: 56px; height: 56px; flex-shrink: 0; border-radius: 10px; overflow: hidden;
  background: linear-gradient(135deg, rgba(30,58,138,.06), rgba(30,58,138,.01));
  display: flex; align-items: center; justify-content: center;
}
.cc-set-card-img img { width: 100%; height: 100%; object-fit: cover; }
.cc-set-card-ph { font-size: 24px; }
.cc-set-card-body { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.cc-set-card-name { font-weight: 700; font-size: 14.5px; color: var(--navy); line-height: 1.25; }
.cc-set-card-count { font-size: 12.5px; color: var(--muted); margin-top: 2px; }
.cc-set-card-arrow { color: rgba(30,58,138,.3); font-size: 18px; font-weight: 700; flex-shrink: 0; transition: transform .14s, color .14s; }
.cc-set-card:hover .cc-set-card-arrow { color: var(--navy); transform: translateX(3px); }

/* Header */
.cc-archive-head { background: var(--surface); border-bottom: 1px solid rgba(30,58,138,.07); }
.cc-archive-head-inner { max-width: 1320px; margin: 0 auto; padding: 28px 24px 30px; }
.cc-archive-title { font-family: 'Plus Jakarta Sans', sans-serif; font-size: clamp(28px, 3.4vw, 40px); font-weight: 800; color: var(--navy); letter-spacing: -.6px; margin: 8px 0 8px; }
.cc-archive-desc { font-size: 15px; line-height: 1.6; color: var(--muted); max-width: 680px; margin-bottom: 12px; }
.cc-archive-count { font-size: 13px; color: var(--muted); }
.cc-archive-count strong { font-family: 'Plus Jakarta Sans', sans-serif; color: var(--navy); font-size: 15px; }

/* Body layout */
.cc-archive-body { max-width: 1320px; margin: 0 auto; padding: 28px 24px 72px; display: grid; grid-template-columns: 258px 1fr; gap: 32px; align-items: start; }

/* ─── FILTER SIDEBAR ─── */
.cc-filter-form { position: sticky; top: 140px; }
.cc-filters { background: transparent; }
.cc-filters-head { display: none; }
.cc-filters-reset {
  display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600;
  color: #EF4444; text-decoration: none; margin-bottom: 14px; padding: 6px 0;
}
.cc-filters-reset:hover { text-decoration: underline; }

.cc-filter-group { border-bottom: 1px solid rgba(30,58,138,.08); padding: 4px 0; }
.cc-filter-toggle {
  width: 100%; display: flex; align-items: center; justify-content: space-between;
  background: none; border: none; cursor: pointer; padding: 14px 2px;
  font-family: 'Inter', sans-serif; font-size: 14px; font-weight: 700; color: var(--navy);
}
.cc-filter-chev { width: 9px; height: 9px; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: rotate(45deg); transition: transform .2s; }
.cc-filter-group[data-open="0"] .cc-filter-chev { transform: rotate(-135deg); }
.cc-filter-body { padding: 2px 2px 14px; display: flex; flex-direction: column; gap: 4px; }
.cc-filter-group[data-open="0"] .cc-filter-body { display: none; }
/* Era-subgroepen in set-filter */
.cc-era { border-bottom: 1px solid rgba(30,58,138,.05); }
.cc-era:last-child { border-bottom: none; }
.cc-era-toggle {
  width: 100%; display: flex; align-items: center; justify-content: space-between;
  background: none; border: none; cursor: pointer; padding: 10px 4px;
  font-family: 'Inter', sans-serif; font-size: 13px; font-weight: 600; color: var(--navy);
}
.cc-era-chev { width: 7px; height: 7px; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: rotate(45deg); transition: transform .2s; }
.cc-era[data-open="0"] .cc-era-chev { transform: rotate(-135deg); }
.cc-era-body { display: flex; flex-direction: column; gap: 2px; padding: 0 0 8px; }
.cc-era[data-open="0"] .cc-era-body { display: none; }
.cc-era-body .cc-check-label { font-size: 13px; }

.cc-filter-scroll { max-height: 220px; overflow-y: auto; padding-right: 6px; }
.cc-filter-scroll::-webkit-scrollbar { width: 4px; }
.cc-filter-scroll::-webkit-scrollbar-thumb { background: rgba(30,58,138,.2); border-radius: 4px; }

/* Custom checkbox */
.cc-check { display: flex; align-items: center; gap: 10px; cursor: pointer; padding: 7px 4px; border-radius: 6px; transition: background .12s; }
.cc-check:hover { background: rgba(30,58,138,.04); }
.cc-check input { position: absolute; opacity: 0; width: 0; height: 0; }
.cc-check-box {
  width: 18px; height: 18px; border-radius: 5px; border: 1.5px solid rgba(30,58,138,.25);
  flex-shrink: 0; position: relative; transition: background .15s, border-color .15s;
}
.cc-check input:checked + .cc-check-box { background: var(--navy); border-color: var(--navy); }
.cc-check input:checked + .cc-check-box::after {
  content: ''; position: absolute; left: 5px; top: 2px; width: 5px; height: 9px;
  border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg);
}
.cc-check input:focus-visible + .cc-check-box { box-shadow: 0 0 0 3px rgba(30,58,138,.15); }
.cc-check-label { font-size: 13.5px; color: var(--text); flex: 1; }
.cc-check-count { font-size: 11.5px; color: var(--muted); background: rgba(30,58,138,.06); border-radius: 20px; padding: 1px 8px; }

/* Prijs slider (dual range) */
.cc-price-slider { position: relative; height: 28px; margin: 6px 0 2px; }
.cc-price-track { position: absolute; top: 12px; left: 0; right: 0; height: 4px; background: rgba(30,58,138,.12); border-radius: 4px; }
.cc-price-range { position: absolute; height: 100%; background: var(--navy); border-radius: 4px; }
.cc-price-input { position: absolute; top: 6px; left: 0; width: 100%; height: 16px; -webkit-appearance: none; appearance: none; background: none; pointer-events: none; margin: 0; }
.cc-price-input::-webkit-slider-thumb { -webkit-appearance: none; pointer-events: auto; width: 18px; height: 18px; border-radius: 50%; background: #fff; border: 2px solid var(--navy); cursor: pointer; box-shadow: 0 2px 6px rgba(30,58,138,.3); }
.cc-price-input::-moz-range-thumb { pointer-events: auto; width: 18px; height: 18px; border-radius: 50%; background: #fff; border: 2px solid var(--navy); cursor: pointer; }
.cc-price-values { display: flex; justify-content: space-between; font-size: 13px; font-weight: 700; color: var(--navy); margin-top: 8px; }

.cc-filters-apply { display: none; }

/* ─── TOOLBAR ─── */
.cc-archive-main { min-width: 0; }
.cc-toolbar { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
.cc-filter-open { display: none; }
.cc-toolbar-count { font-size: 13px; color: var(--muted); margin-right: auto; }

/* Vastgepinde "Op voorraad"-toggle */
.cc-instock-toggle {
  display: inline-flex; align-items: center; gap: 9px; flex-shrink: 0;
  padding: 7px 14px 7px 11px; border-radius: 999px; text-decoration: none; white-space: nowrap;
  font-size: 13px; font-weight: 700; color: var(--muted);
  background: var(--surface); border: 1.5px solid rgba(30,58,138,.14); transition: border-color .14s, color .14s, background .14s;
}
.cc-instock-toggle:hover { border-color: rgba(22,163,74,.5); color: var(--navy); }
.cc-instock-dot { width: 30px; height: 18px; border-radius: 999px; background: rgba(30,58,138,.2); position: relative; transition: background .14s; flex-shrink: 0; }
.cc-instock-dot::after { content: ""; position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.25); transition: transform .14s; }
.cc-instock-toggle.is-on { background: rgba(22,163,74,.1); border-color: #16A34A; color: #15803D; }
.cc-instock-toggle.is-on .cc-instock-dot { background: #16A34A; }
.cc-instock-toggle.is-on .cc-instock-dot::after { transform: translateX(12px); }

/* Actieve chips */
.cc-active-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.cc-chip { display: inline-flex; align-items: center; gap: 6px; background: rgba(30,58,138,.07); border: 1px solid rgba(30,58,138,.12); border-radius: 20px; padding: 5px 12px; font-size: 12.5px; font-weight: 600; color: var(--navy); text-decoration: none; transition: background .15s; }
.cc-chip:hover { background: rgba(239,68,68,.1); border-color: rgba(239,68,68,.2); color: #EF4444; }
.cc-chip span { font-size: 15px; line-height: 1; }

/* ─── PRODUCT GRID ─── */
.cc-product-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.cc-pcard {
  position: relative;
  background: var(--surface); border: 1px solid rgba(30,58,138,.08); border-radius: 14px; overflow: hidden;
  text-decoration: none; display: flex; flex-direction: column; transition: transform .18s, box-shadow .18s, border-color .18s;
}
.cc-pcard:hover { transform: translateY(-4px); box-shadow: 0 16px 40px rgba(30,58,138,.12); border-color: rgba(30,58,138,.15); }
/* Stretched link: hele kaart klikbaar → productpagina */
.cc-pcard-link { position: absolute; inset: 0; z-index: 1; }
.cc-pcard-media { position: relative; aspect-ratio: 1/1; background: linear-gradient(135deg, rgba(30,58,138,.05), rgba(30,58,138,.01)); overflow: hidden; }
.cc-pcard-img { width: 100%; height: 100%; object-fit: contain; display: block; padding: 16px; transition: transform .35s; }
.cc-pcard:hover .cc-pcard-img { transform: scale(1.05); }
.cc-pcard-noimg { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; font-size: 44px; }
.cc-pcard.is-sold-out .cc-pcard-img, .cc-pcard.is-sold-out .cc-pcard-noimg { opacity: .5; }
.cc-pcard-sale { position: absolute; top: 10px; right: 10px; background: #EF4444; color: #fff; font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 11px; padding: 4px 8px; border-radius: 20px; }
.cc-pcard-info { padding: 14px; display: flex; flex-direction: column; flex: 1; }
.cc-pcard-set { font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); margin-bottom: 5px; }
.cc-pcard-title { font-size: 13.5px; font-weight: 700; color: var(--navy); line-height: 1.35; margin: 0 0 8px; flex: 1; }
.cc-pcard-stock { display: flex; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 600; margin-bottom: 10px; }
.cc-pcard-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.cc-pcard-price { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 19px; font-weight: 800; color: var(--navy); }
/* Compacte add-to-cart knop (boven de stretched link) */
.cc-pcard-cart {
  position: relative; z-index: 2; flex-shrink: 0;
  width: 40px; height: 40px; border-radius: 9px; border: none; cursor: pointer;
  background: var(--navy); color: #fff;
  display: flex; align-items: center; justify-content: center;
  transition: background .15s, transform .1s; text-decoration: none;
}
.cc-pcard-cart:hover { background: var(--navy-soft); transform: scale(1.05); }
.cc-pcard-cart.is-out { background: rgba(30,58,138,.08); color: var(--muted); cursor: default; }
.cc-pcard-cart.is-out:hover { transform: none; background: rgba(30,58,138,.08); }
.cc-pcard-cart.success { background: #22C55E !important; }
.cc-pcard-price del { color: var(--muted); font-size: 13px; font-weight: 600; margin-right: 5px; }
.cc-pcard-price ins { text-decoration: none; }

/* Trust-band tussen rijen */
.cc-trust-band {
  grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px;
  background: var(--navy); border-radius: 14px; padding: 20px 24px; margin: 4px 0;
}
.cc-trust-band-item { display: flex; align-items: center; gap: 10px; color: rgba(255,255,255,.85); font-size: 13px; }
.cc-trust-band-item svg { color: var(--yellow); flex-shrink: 0; }
.cc-trust-band-item strong { color: #fff; font-weight: 700; }

/* Paginatie */
.cc-pagination { margin-top: 36px; }
.cc-pagination ul { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; padding: 0; }
.cc-pagination a, .cc-pagination span {
  display: flex; align-items: center; justify-content: center; min-width: 42px; height: 42px; padding: 0 12px;
  border: 1.5px solid rgba(30,58,138,.12); border-radius: 8px; font-size: 14px; font-weight: 600;
  color: var(--navy); text-decoration: none; transition: background .15s, border-color .15s;
}
.cc-pagination a:hover { background: rgba(30,58,138,.05); border-color: rgba(30,58,138,.25); }
.cc-pagination .current { background: var(--navy); color: #fff; border-color: var(--navy); }

/* Geen resultaten */
.cc-no-results { text-align: center; padding: 64px 24px; }
.cc-no-results h2 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 22px; font-weight: 800; color: var(--navy); margin: 14px 0 8px; }
.cc-no-results p { font-size: 14px; color: var(--muted); margin-bottom: 22px; }

.cc-filters-overlay { display: none; }

/* ═══════════════════════════════════════════════
   MY ACCOUNT
   ═══════════════════════════════════════════════ */
.cc-account-header { margin-bottom: 28px; }
.cc-account-title { font-family: 'Plus Jakarta Sans', sans-serif; font-size: clamp(26px,3vw,36px); font-weight: 800; color: var(--navy); letter-spacing: -.5px; margin-bottom: 6px; }
.cc-account-sub { font-size: 14px; color: var(--muted); }
.cc-account-layout { display: grid; grid-template-columns: 240px 1fr; gap: 32px; align-items: start; }

/* Navigatie */
.cc-account-nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.cc-account-nav a { display: flex; align-items: center; gap: 11px; padding: 12px 14px; border-radius: 10px; font-size: 14px; font-weight: 600; color: var(--text); text-decoration: none; transition: background .15s, color .15s; }
.cc-account-nav a:hover { background: rgba(30,58,138,.05); color: var(--navy); }
.cc-account-nav .is-active a { background: var(--navy); color: #fff; }
.cc-account-nav .is-active a .cc-nav-ico { color: #fff; }
.cc-nav-ico { color: var(--muted); display: flex; }
.cc-account-nav a:hover .cc-nav-ico { color: var(--navy); }

/* Content */
.cc-account-content { min-width: 0; max-width: 100%; overflow-wrap: break-word; }
/* Geen automatische underline op account-links (globale .cc-page-content a-regel overrulen) */
.cc-page-content .cc-account a { text-decoration: none; }
.cc-page-content .cc-account a:hover { text-decoration: none; }
.cc-account, .cc-account-inner { min-width: 0; max-width: 100%; }
/* Knop-tekstkleuren herstellen (globale link-kleur maakte witte knoptekst navy → onleesbaar) */
.cc-page-content .cc-account a.cc-btn-outline,
.cc-page-content .cc-account a.cc-account-btn,
.cc-page-content .cc-account a.btn-primary { color: #fff; }
.cc-page-content .cc-account a.cc-btn-ghost,
.cc-page-content .cc-account a.cc-btn-pay,
.cc-page-content .cc-account a.cc-account-btn-yellow { color: var(--navy); }
.cc-content-title { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 22px; font-weight: 800; color: var(--navy); margin: 0 0 20px; }

/* Dashboard */
.cc-dash-cards { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; margin-bottom: 28px; }
.cc-dash-card { background: var(--surface); border: 1px solid rgba(30,58,138,.08); border-radius: 14px; padding: 22px; text-decoration: none; transition: transform .15s, box-shadow .15s, border-color .15s; }
.cc-dash-card:hover { transform: translateY(-3px); box-shadow: 0 12px 30px rgba(30,58,138,.1); border-color: rgba(30,58,138,.15); }
.cc-dash-ico { width: 44px; height: 44px; border-radius: 11px; background: rgba(30,58,138,.07); color: var(--navy); display: flex; align-items: center; justify-content: center; }
.cc-dash-num { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 30px; font-weight: 800; color: var(--navy); margin-top: 12px; line-height: 1; }
.cc-dash-lbl { font-size: 13px; color: var(--muted); font-weight: 600; margin-top: 4px; }
.cc-dash-recent { background: var(--surface); border: 1px solid rgba(30,58,138,.08); border-radius: 14px; padding: 22px; }
.cc-dash-recent-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.cc-dash-recent-head h3 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 16px; font-weight: 800; color: var(--navy); margin: 0; }
.cc-link-arrow { font-size: 13px; font-weight: 600; color: var(--navy); text-decoration: none; opacity: .7; }
.cc-link-arrow:hover { opacity: 1; }
.cc-dash-empty { text-align: center; padding: 48px 24px; background: var(--surface); border: 1px solid rgba(30,58,138,.08); border-radius: 14px; }
.cc-dash-empty p { font-size: 15px; color: var(--muted); margin-bottom: 18px; }

/* Order rij */
.cc-order-row { display: flex; align-items: center; gap: 14px; padding: 14px 0; border-top: 1px solid rgba(30,58,138,.07); }
.cc-order-row-main { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.cc-order-num { font-weight: 700; color: var(--navy); font-size: 14px; }
.cc-order-date { font-size: 12.5px; color: var(--muted); }
.cc-order-total { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; color: var(--navy); font-size: 16px; }

/* Status pill */
.cc-status-pill { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; padding: 5px 12px; border-radius: 20px; color: var(--pill); background: color-mix(in srgb, var(--pill) 12%, transparent); border: 1px solid color-mix(in srgb, var(--pill) 25%, transparent); white-space: nowrap; }

/* Track knop */
.cc-track-btn { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; padding: 10px 16px; background: rgba(30,58,138,.05); border: 1px solid rgba(30,58,138,.12); border-radius: 8px; font-size: 13px; font-weight: 700; color: var(--navy); text-decoration: none; transition: background .15s; }
.cc-track-btn:hover { background: rgba(30,58,138,.1); }

/* Orders lijst */
.cc-orders-list { display: flex; flex-direction: column; gap: 14px; }
.cc-order-card { background: var(--surface); border: 1px solid rgba(30,58,138,.08); border-radius: 14px; padding: 18px 20px; }
.cc-order-card-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.cc-order-card-top > div { display: flex; flex-direction: column; gap: 2px; }
.cc-order-card-body { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 0; border-top: 1px solid rgba(30,58,138,.06); border-bottom: 1px solid rgba(30,58,138,.06); margin-bottom: 14px; }
.cc-order-thumbs { display: flex; gap: 6px; }
.cc-order-thumbs img { width: 48px; height: 48px; object-fit: cover; border-radius: 8px; border: 1px solid rgba(30,58,138,.08); }
.cc-order-meta { display: flex; align-items: center; gap: 18px; font-size: 13px; color: var(--muted); }
.cc-order-card-actions { display: flex; flex-wrap: wrap; gap: 8px; }

/* Account knoppen */
.cc-btn-outline, .cc-btn-ghost, .cc-btn-pay { display: inline-flex; align-items: center; gap: 7px; height: 40px; padding: 0 16px; border-radius: var(--radius); font-family: 'Inter', sans-serif; font-size: 13.5px; font-weight: 700; text-decoration: none; cursor: pointer; transition: background .15s, border-color .15s, color .15s; }
.cc-btn-outline { background: var(--navy); color: #fff; border: 1.5px solid var(--navy); }
.cc-btn-outline:hover { background: var(--navy-soft); }
.cc-btn-ghost { background: var(--surface); color: var(--navy); border: 1.5px solid rgba(30,58,138,.15); }
.cc-btn-ghost:hover { border-color: var(--navy); }
.cc-btn-pay { background: var(--yellow); color: var(--navy); border: none; }
.cc-btn-pay:hover { background: var(--yellow-dk); }

/* Order detail */
.cc-back-link { display: inline-block; font-size: 13px; font-weight: 600; color: var(--muted); text-decoration: none; margin-bottom: 16px; }
.cc-back-link:hover { color: var(--navy); }
.cc-vieworder-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.cc-status-desc { font-size: 14px; color: var(--muted); margin-bottom: 24px; }
.cc-timeline { display: flex; align-items: center; margin: 24px 0 28px; }
.cc-timeline-step { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.cc-timeline-dot { width: 30px; height: 30px; border-radius: 50%; background: rgba(30,58,138,.12); display: flex; align-items: center; justify-content: center; transition: background .2s; }
.cc-timeline-step.done .cc-timeline-dot { background: #16A34A; }
.cc-timeline-step.active .cc-timeline-dot { background: var(--navy); box-shadow: 0 0 0 4px rgba(30,58,138,.15); }
.cc-timeline-step span { font-size: 12px; font-weight: 600; color: var(--muted); }
.cc-timeline-step.done span, .cc-timeline-step.active span { color: var(--navy); }
.cc-timeline-bar { flex: 1; height: 3px; background: rgba(30,58,138,.12); margin: 0 8px 26px; border-radius: 3px; }
.cc-timeline-bar.done { background: #16A34A; }
.cc-track-box { display: flex; align-items: center; justify-content: space-between; gap: 16px; background: var(--surface); border: 1px solid rgba(30,58,138,.1); border-radius: 12px; padding: 16px 20px; margin-bottom: 24px; }
.cc-track-box-info { display: flex; align-items: center; gap: 14px; }
.cc-track-box-info strong { display: block; font-size: 14px; color: var(--navy); }
.cc-track-box-info span { font-size: 13px; color: var(--muted); }
.cc-vieworder-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 28px; }
.cc-vieworder-grid { display: grid; grid-template-columns: 1fr 300px; gap: 24px; align-items: start; }
.cc-block-title { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 15px; font-weight: 800; color: var(--navy); margin: 0 0 14px; }
.cc-vieworder-items, .cc-address-block { background: var(--surface); border: 1px solid rgba(30,58,138,.08); border-radius: 14px; padding: 20px; }
.cc-address-block { margin-bottom: 16px; }
.cc-vieworder-item { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid rgba(30,58,138,.06); }
.cc-vieworder-item:last-of-type { border-bottom: none; }
.cc-vi-thumb { width: 52px; height: 52px; object-fit: cover; border-radius: 8px; border: 1px solid rgba(30,58,138,.08); flex-shrink: 0; }
.cc-vi-noimg { display: flex; align-items: center; justify-content: center; font-size: 24px; background: var(--bg); }
.cc-vi-info { flex: 1; display: flex; flex-direction: column; gap: 3px; }
.cc-vi-name { font-size: 13.5px; font-weight: 700; color: var(--navy); }
.cc-vi-qty { font-size: 12px; color: var(--muted); }
.cc-vi-price { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; color: var(--navy); }
.cc-vieworder-totals { margin-top: 14px; padding-top: 14px; border-top: 1px solid rgba(30,58,138,.1); }
.cc-vot-row { display: flex; justify-content: space-between; padding: 6px 0; font-size: 14px; color: var(--muted); }
.cc-vot-total { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; color: var(--navy); font-size: 17px; padding-top: 12px; margin-top: 6px; border-top: 1px solid rgba(30,58,138,.08); }
.cc-address-block address { font-style: normal; font-size: 13.5px; line-height: 1.7; color: var(--text); }
.cc-pay-method { font-size: 13.5px; color: var(--text); margin-bottom: 8px; }
.cc-pay-status { display: inline-block; font-size: 12px; font-weight: 700; padding: 4px 10px; border-radius: 20px; }
.cc-pay-status.paid { background: rgba(34,197,94,.12); color: #16A34A; }
.cc-pay-status.unpaid { background: rgba(245,158,11,.12); color: #B45309; }

/* Login */
.cc-login { display: grid; grid-template-columns: 1fr; gap: 20px; max-width: 460px; margin: 0 auto; }
.cc-login.has-register { grid-template-columns: 1fr 1fr; max-width: 860px; }
.cc-login-card { background: var(--surface); border: 1px solid rgba(30,58,138,.08); border-radius: 16px; padding: 32px; }
.cc-login-title { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 20px; font-weight: 800; color: var(--navy); margin: 0 0 20px; }
.cc-register-intro { font-size: 14px; color: var(--muted); line-height: 1.6; margin-bottom: 20px; }
.cc-field-label { display: block; font-size: 13px; font-weight: 600; color: var(--navy); margin-bottom: 6px; }
.cc-field { width: 100%; height: 48px; border: 1.5px solid rgba(30,58,138,.15); border-radius: var(--radius); padding: 0 14px; font-family: 'Inter', sans-serif; font-size: 15px; color: var(--text); outline: none; margin-bottom: 16px; transition: border-color .15s, box-shadow .15s; }
.cc-field:focus { border-color: var(--navy); box-shadow: 0 0 0 3px rgba(30,58,138,.08); }
.cc-login-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }
.cc-remember { display: flex; align-items: center; gap: 7px; font-size: 13px; color: var(--muted); cursor: pointer; }
.cc-forgot { font-size: 13px; color: var(--navy); font-weight: 600; text-decoration: none; }
.cc-forgot:hover { text-decoration: underline; }
.cc-account-btn { width: 100%; height: 50px; background: var(--navy); color: #fff; border: none; border-radius: var(--radius); font-family: 'Inter', sans-serif; font-size: 15px; font-weight: 700; cursor: pointer; transition: background .15s; }
.cc-account-btn:hover { background: var(--navy-soft); }
.cc-account-btn-yellow { background: var(--yellow); color: var(--navy); }
.cc-account-btn-yellow:hover { background: var(--yellow-dk); }

/* WooCommerce account forms */
.woocommerce-MyAccount-content input.input-text, .woocommerce-MyAccount-content select { width: 100%; min-height: 48px; border: 1.5px solid rgba(30,58,138,.15); border-radius: var(--radius); padding: 0 14px; font-size: 15px; font-family: 'Inter', sans-serif; margin-bottom: 14px; outline: none; }
.woocommerce-MyAccount-content input.input-text:focus { border-color: var(--navy); box-shadow: 0 0 0 3px rgba(30,58,138,.08); }
.woocommerce-MyAccount-content label { display:block; font-size:13px; font-weight:600; color:var(--navy); margin-bottom:6px; }
.woocommerce-MyAccount-content button.button, .woocommerce-MyAccount-content .button { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 24px; background: var(--navy); color: #fff; border: none; border-radius: var(--radius); font-family: 'Inter', sans-serif; font-size: 15px; font-weight: 700; cursor: pointer; text-decoration: none; transition: background .15s; }
.woocommerce-MyAccount-content button.button:hover, .woocommerce-MyAccount-content .button:hover { background: var(--navy-soft); }
.woocommerce-MyAccount-content .woocommerce-Addresses { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.woocommerce-MyAccount-content .woocommerce-Address,
.woocommerce-MyAccount-content .col-1,
.woocommerce-MyAccount-content .col-2,
.woocommerce-MyAccount-content .u-column1,
.woocommerce-MyAccount-content .u-column2 { float: none !important; width: auto !important; max-width: none !important; margin: 0 !important; }
.woocommerce-Address { background: var(--surface); border: 1px solid rgba(30,58,138,.08); border-radius: 14px; padding: 20px; }
.woocommerce-Address header.woocommerce-Address-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.woocommerce-Address header.woocommerce-Address-title h2, .woocommerce-Address header.woocommerce-Address-title h3 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 16px; font-weight: 800; color: var(--navy); margin: 0; }
.woocommerce-Address .edit { font-size: 13px; font-weight: 600; color: var(--navy); text-decoration: none; white-space: nowrap; }
.woocommerce-Address address { font-style: normal; font-size: 14px; line-height: 1.7; color: var(--text); }
.woocommerce-MyAccount-content .addresses .title { display: flex; align-items: center; justify-content: space-between; }
/* Adres-kaarten: kop + inhoud links uitlijnen (geen centrering/insprong) */
.woocommerce-MyAccount-content .woocommerce-Address { text-align: left; }
.woocommerce-MyAccount-content .woocommerce-Address-title,
.woocommerce-MyAccount-content .woocommerce-Address header.woocommerce-Address-title,
.woocommerce-MyAccount-content .woocommerce-Address .title {
  display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
  text-align: left; margin-bottom: 12px;
}
.woocommerce-MyAccount-content .woocommerce-Address-title h2,
.woocommerce-MyAccount-content .woocommerce-Address-title h3,
.woocommerce-MyAccount-content .woocommerce-Address .title h2,
.woocommerce-MyAccount-content .woocommerce-Address .title h3 {
  margin: 0; padding: 0; text-align: left; flex: 1 1 auto;
}

/* Nav-uitlijning: geen tekstbreuk, vast icoon-kader, geen nep-vet */
.cc-account-nav ul li a { white-space: nowrap; font-weight: 600 !important; text-shadow: none !important; }
.cc-account-nav ul li.is-active a { background: var(--navy) !important; color: #fff !important; }
.cc-account-nav ul li.is-active a .cc-nav-ico { color: #fff !important; }
.cc-nav-ico { width: 20px; justify-content: center; flex-shrink: 0; }

/* ════════════════════════════════════════════════════════════════
   LEESBAARHEID — prijzen & producttitels in Inter (tabular cijfers)
   Plus Jakarta Sans blijft voor koppen/hero/secties/logo.
   Prijzen en lange titels met codes lezen rustiger in Inter.
   ════════════════════════════════════════════════════════════════ */
.price-current,
.price-old,
.product-card-price,
.cc-pcard-price,
.autocomplete-item-price,
.cc-cart-item-line,
.cc-cart-total-amount,
.cc-line-subtotal,
.cc-crosssell-price,
.cc-review-price,
.cc-review-total span:last-child,
.cc-bump-price,
.cc-vi-price,
.cc-vot-total,
.cc-order-total,
.product-hero-price strong,
.woocommerce-Price-amount,
.cart_totals .order-total td,
.woocommerce-checkout #order_review .order-total td,
.qty-input {
  font-family: 'Inter', sans-serif !important;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
  letter-spacing: 0;
}

/* Producttitel: Inter i.p.v. heading-font voor leesbaarheid van codes/cijfers */
.product-title {
  font-family: 'Inter', sans-serif !important;
  font-weight: 800;
  letter-spacing: -.01em;
}

/* ════════════════════════════════════════════════════════════════
   VERKOOP JOUW POKÉMON — inkoop-landingspagina
   ════════════════════════════════════════════════════════════════ */
.cc-sell-lead { text-align: center; color: var(--muted); font-size: 15px; max-width: 560px; margin: 0 auto 30px; }
.cc-sell-section { padding-top: 48px; padding-bottom: 8px; }

/* Hero */
.cc-sell-hero {
  background: linear-gradient(135deg, #136634 0%, #16A34A 60%, #1aa64c 100%);
  position: relative; overflow: hidden; color: #fff;
}
/* Diepte: zachte gele glow + subtiel stippenpatroon (geen vlak kleurvlak) */
.cc-sell-hero::after {
  content: ""; position: absolute; right: -140px; top: -120px; width: 500px; height: 500px;
  background: radial-gradient(circle, rgba(255,215,0,.22), transparent 65%); pointer-events: none;
}
.cc-sell-hero::before {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .6;
  background-image: radial-gradient(rgba(255,255,255,.08) 1.4px, transparent 1.4px);
  background-size: 22px 22px;
}
.cc-sell-hero-inner {
  max-width: 1140px; margin: 0 auto; padding: 60px 24px; position: relative; z-index: 2;
  display: grid; grid-template-columns: 1.05fr .95fr; gap: 44px; align-items: center;
}
.cc-sell-hero-text { text-align: left; }
.cc-sell-eyebrow {
  display: inline-block; background: rgba(255,255,255,.18); color: #fff;
  font-weight: 700; font-size: 13px; padding: 6px 14px; border-radius: 20px; margin-bottom: 18px;
}
.cc-sell-hero h1 { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: clamp(32px, 3.7vw, 50px); line-height: 1.06; margin: 0 0 10px; letter-spacing: -.5px; }
.cc-sell-hero .cc-sell-subhead { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: clamp(32px, 3.7vw, 50px); line-height: 0.98; color: #fff; margin: 0 0 24px; letter-spacing: -.5px; max-width: none; }
.cc-sell-hero .cc-sell-subhead .cc-hl { color: var(--yellow); }
.cc-sell-hero p { font-size: 16.5px; line-height: 1.6; color: rgba(255,255,255,.92); max-width: 520px; margin: 0 0 26px; }
.cc-sell-hero p strong { color: #fff; }

.cc-sell-cta-row { display: flex; gap: 12px; flex-wrap: wrap; }
.cc-sell-btn-primary {
  display: inline-block; background: var(--yellow); color: var(--navy) !important;
  font-weight: 800; font-size: 15px; padding: 15px 30px; border-radius: 10px; text-decoration: none;
  box-shadow: 0 10px 24px -8px rgba(0,0,0,.3); transition: transform .14s, background .14s;
}
.cc-sell-btn-primary:hover { background: var(--yellow-dk); transform: translateY(-2px); }
.cc-sell-btn-ghost {
  display: inline-block; background: rgba(255,255,255,.14); color: #fff !important;
  font-weight: 700; font-size: 15px; padding: 15px 28px; border-radius: 10px; text-decoration: none;
  border: 1.5px solid rgba(255,255,255,.4); transition: background .14s;
}
.cc-sell-btn-ghost:hover { background: rgba(255,255,255,.24); }
.cc-sell-trust { display: flex; gap: 20px; justify-content: center; flex-wrap: wrap; margin-top: 26px; font-size: 14px; font-weight: 600; color: rgba(255,255,255,.95); }

/* Chips */
.cc-sell-chips { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; max-width: 820px; margin: 0 auto; }
.cc-sell-chips span {
  background: var(--surface); border: 1px solid rgba(30,58,138,.12); border-radius: 12px;
  padding: 14px 20px; font-weight: 600; font-size: 14.5px; color: var(--navy);
  box-shadow: 0 4px 12px rgba(30,58,138,.05); transition: transform .14s, box-shadow .14s;
}
.cc-sell-chips span:hover { transform: translateY(-2px); box-shadow: 0 8px 18px rgba(30,58,138,.1); }

/* Stappen */
.cc-sell-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; max-width: 1080px; margin: 0 auto; }
.cc-sell-step {
  background: var(--surface); border: 1px solid rgba(30,58,138,.08); border-radius: 16px;
  padding: 28px 22px; text-align: center; position: relative;
}
.cc-sell-step-num {
  width: 44px; height: 44px; border-radius: 50%; background: #16A34A; color: #fff;
  font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 20px;
  display: flex; align-items: center; justify-content: center; margin: 0 auto 16px;
}
.cc-sell-step h3 { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 17px; color: var(--navy); margin: 0 0 8px; }
.cc-sell-step p { font-size: 13.5px; line-height: 1.55; color: var(--muted); margin: 0; }

/* Waarom */
.cc-sell-why { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; max-width: 1080px; margin: 0 auto; }
.cc-sell-why-item { text-align: center; padding: 10px; }
.cc-sell-why-ico { font-size: 34px; margin-bottom: 12px; }
.cc-sell-why-item h3 { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 16px; color: var(--navy); margin: 0 0 6px; }
.cc-sell-why-item p { font-size: 13.5px; line-height: 1.55; color: var(--muted); margin: 0; }

/* Final CTA */
.cc-sell-final { background: var(--navy); margin-top: 56px; }
.cc-sell-final-inner { max-width: 680px; margin: 0 auto; padding: 60px 24px; text-align: center; color: #fff; }
.cc-sell-final h2 { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: clamp(26px, 3.4vw, 38px); margin: 0 0 12px; }
.cc-sell-final p { font-size: 16px; color: rgba(255,255,255,.85); margin: 0 0 26px; }
.cc-sell-btn-white {
  display: inline-block; background: #fff; color: var(--navy) !important;
  font-weight: 800; font-size: 15px; padding: 15px 28px; border-radius: 10px; text-decoration: none; transition: transform .14s;
}
.cc-sell-btn-white:hover { transform: translateY(-2px); }
.cc-sell-final-mail { margin-top: 22px; font-size: 14px; color: rgba(255,255,255,.7); }

@media (max-width: 900px) {
  .cc-sell-grid, .cc-sell-why { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 520px) {
  .cc-sell-grid, .cc-sell-why { grid-template-columns: 1fr; }
  .cc-sell-trust { gap: 10px 18px; }
}

/* ───── Verkooppagina v2 (CRO) ───── */
.cc-hl { color: var(--yellow); }
.cc-sell-hero h1 .cc-hl { text-shadow: 0 1px 0 rgba(0,0,0,.1); }
.cc-sell-microtrust { display: flex; gap: 6px 14px; flex-wrap: wrap; margin-top: 18px; font-size: 13.5px; font-weight: 600; color: rgba(255,255,255,.92); }
.cc-sell-herostats { display: flex; flex-wrap: wrap; margin: 30px 0 0; }
.cc-sell-herostats div { text-align: left; padding-right: 22px; }
.cc-sell-herostats div + div { padding-left: 22px; border-left: 1px solid rgba(255,255,255,.25); }
.cc-sell-herostats strong { display: block; font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 23px; color: #fff; }
.cc-sell-herostats span { font-size: 12.5px; color: rgba(255,255,255,.85); }

/* Hero-visual: gekantelde stapel van échte slabs */
.cc-sell-hero-visual { position: relative; min-height: 400px; }
.cc-sell-cardstack { position: relative; width: 100%; height: 100%; min-height: 400px; }
.cc-stack-card {
  position: absolute; width: 190px; height: auto; border-radius: 10px;
  border: 3px solid #fff; background: #fff; box-shadow: 0 18px 42px rgba(0,0,0,.34);
}
.cc-stack-card.c1 { left: 2%;  top: 64px; transform: rotate(-10deg); z-index: 1; }
.cc-stack-card.c2 { left: 31%; top: 18px; transform: rotate(3deg);   z-index: 3; }
.cc-stack-card.c3 { left: 60%; top: 72px; transform: rotate(12deg);  z-index: 2; }
.cc-stack-card:hover { z-index: 5; }
.cc-stack-badge {
  position: absolute; right: 0; bottom: 16px; z-index: 4;
  background: var(--yellow); color: var(--navy); border-radius: 14px;
  padding: 11px 18px; text-align: center; transform: rotate(-5deg);
  box-shadow: 0 12px 26px rgba(0,0,0,.28);
}
.cc-stack-badge strong { display: block; font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 24px; line-height: 1; }
.cc-stack-badge span { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }

@media (max-width: 980px) {
  .cc-sell-hero-inner { grid-template-columns: 1fr; gap: 28px; }
  .cc-sell-hero-text { text-align: center; }
  .cc-sell-hero p { margin-left: auto; margin-right: auto; }
  .cc-sell-cta-row, .cc-sell-microtrust, .cc-sell-herostats { justify-content: center; }
  .cc-sell-hero-visual { display: none; }
}

/* Value band */
.cc-sell-band { background: var(--surface); border-bottom: 1px solid rgba(30,58,138,.07); }
.cc-sell-band-inner { max-width: 1100px; margin: 0 auto; padding: 22px 24px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.cc-sell-band-item { display: flex; align-items: center; gap: 12px; }
.cc-band-ico { font-size: 26px; flex-shrink: 0; }
.cc-sell-band-item strong { display: block; font-size: 14.5px; color: var(--navy); }
.cc-sell-band-item small { font-size: 12.5px; color: var(--muted); }

/* Vergelijking */
.cc-compare { display: grid; grid-template-columns: 1fr auto 1fr; gap: 0; align-items: stretch; max-width: 940px; margin: 0 auto; }
.cc-compare-col { background: var(--surface); border: 1px solid rgba(30,58,138,.1); border-radius: 16px; padding: 24px; }
.cc-compare-bad { border-color: rgba(239,68,68,.25); }
.cc-compare-good { border: 2px solid #16A34A; box-shadow: 0 16px 40px rgba(22,163,74,.13); }
.cc-compare-head { margin-bottom: 16px; }
.cc-compare-tag { display: block; font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 18px; color: var(--navy); }
.cc-compare-head small { font-size: 12.5px; color: var(--muted); }
.cc-compare-col ul { list-style: none; padding: 0; margin: 0; }
.cc-compare-col li { position: relative; padding: 9px 0 9px 30px; font-size: 14px; line-height: 1.45; border-top: 1px solid rgba(30,58,138,.06); }
.cc-compare-bad li::before { content: "✕"; position: absolute; left: 0; top: 9px; color: #EF4444; font-weight: 800; }
.cc-compare-good li::before { content: "✓"; position: absolute; left: 0; top: 9px; color: #16A34A; font-weight: 800; }
.cc-compare-maybe { color: var(--muted); font-style: italic; }
.cc-compare-bad li.cc-compare-maybe::before { content: "≈"; color: var(--muted); }
.cc-compare-win { font-weight: 800; color: var(--navy); }
.cc-compare-vs { display: flex; align-items: center; justify-content: center; font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; color: var(--muted); padding: 0 16px; font-size: 14px; }
.cc-sell-closer { text-align: center; max-width: 620px; margin: 26px auto 22px; font-size: 16px; font-weight: 600; color: var(--navy); }
.cc-sell-btn-primary.cc-green { background: #16A34A; color: #fff !important; }
.cc-sell-btn-primary.cc-green:hover { background: #15803D; }

/* Stap-tijd badge */
.cc-step-time { display: inline-block; background: rgba(22,163,74,.1); color: #16A34A; font-size: 11px; font-weight: 800; padding: 2px 10px; border-radius: 20px; margin-bottom: 10px; }

/* Grote bedragen-regel */
.cc-sell-bigamount { text-align: center; max-width: 640px; margin: 26px auto 0; font-size: 15px; color: var(--muted); background: rgba(255,215,0,.1); border: 1px solid rgba(230,184,0,.3); border-radius: 12px; padding: 14px 20px; }
.cc-sell-bigamount strong { color: var(--navy); }

/* Uitbetalingstabel */
.cc-payout { max-width: 760px; margin: 0 auto; border: 1px solid rgba(30,58,138,.1); border-radius: 14px; overflow: hidden; }
.cc-payout-row { display: grid; grid-template-columns: 2fr 1.2fr 1.2fr; gap: 10px; padding: 14px 20px; border-top: 1px solid rgba(30,58,138,.07); align-items: center; font-size: 14px; }
.cc-payout-row:first-child { border-top: none; }
.cc-payout-head { background: var(--navy); color: #fff; font-weight: 700; font-size: 12.5px; text-transform: uppercase; letter-spacing: .04em; }
.cc-payout-row span:nth-child(2) { color: var(--muted); }
.cc-payout-amt { font-family: 'Inter', sans-serif; font-weight: 800; color: #16A34A !important; font-variant-numeric: tabular-nums; }
.cc-sell-note { text-align: center; font-size: 12.5px; color: var(--muted); margin-top: 14px; }

/* Social proof blok */
.cc-sell-proof { background: var(--navy); margin-top: 8px; }
.cc-sell-proof-inner { max-width: 1000px; margin: 0 auto; padding: 56px 24px; }
.cc-sell-statbar { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin: 8px 0 30px; }
.cc-sell-statbar div { text-align: center; }
.cc-sell-statbar strong { display: block; font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 28px; color: var(--yellow); }
.cc-sell-statbar span { font-size: 12.5px; color: rgba(255,255,255,.8); }
.cc-sell-reviews { background: #fff; border-radius: 14px; padding: 16px; min-height: 60px; }
.cc-sell-company { text-align: center; margin-top: 22px; font-size: 12.5px; color: rgba(255,255,255,.65); }

/* FAQ */
.cc-sell-faq { max-width: 760px; margin: 0 auto; }
.cc-sell-faq details { background: var(--surface); border: 1px solid rgba(30,58,138,.1); border-radius: 12px; margin-bottom: 10px; overflow: hidden; }
.cc-sell-faq summary { cursor: pointer; list-style: none; padding: 16px 20px; font-weight: 700; font-size: 15px; color: var(--navy); position: relative; padding-right: 44px; }
.cc-sell-faq summary::-webkit-details-marker { display: none; }
.cc-sell-faq summary::after { content: "+"; position: absolute; right: 18px; top: 50%; transform: translateY(-50%); font-size: 22px; font-weight: 400; color: #16A34A; transition: transform .2s; }
.cc-sell-faq details[open] summary::after { transform: translateY(-50%) rotate(45deg); }
.cc-sell-faq details p { padding: 0 20px 18px; margin: 0; font-size: 14px; line-height: 1.6; color: var(--muted); }

@media (max-width: 860px) {
  .cc-sell-band-inner { grid-template-columns: 1fr 1fr; }
  .cc-sell-statbar { grid-template-columns: 1fr 1fr; }
  .cc-compare { grid-template-columns: 1fr; gap: 12px; }
  .cc-compare-vs { padding: 4px; }
}
@media (max-width: 520px) {
  .cc-sell-herostats { grid-template-columns: 1fr; gap: 10px; }
  .cc-sell-band-inner { grid-template-columns: 1fr; }
  .cc-payout-row { grid-template-columns: 1.6fr 1fr 1fr; padding: 12px 14px; font-size: 12.5px; gap: 6px; }
}

/* Compacte versie: 3-koloms stappen + trust-strip */
.cc-sell-grid-3 { grid-template-columns: repeat(3, 1fr); max-width: 880px; }
.cc-sell-trustbar { background: var(--surface); border-top: 1px solid rgba(30,58,138,.07); border-bottom: 1px solid rgba(30,58,138,.07); margin-top: 40px; }
.cc-sell-trustbar-inner { max-width: 900px; margin: 0 auto; padding: 26px 24px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; text-align: center; }
.cc-tb-item strong { display: block; font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 24px; color: var(--navy); }
.cc-tb-item span { font-size: 12.5px; color: var(--muted); }
@media (max-width: 600px) { .cc-sell-trustbar-inner { grid-template-columns: 1fr 1fr; } }

/* ───── Verkoopformulier ───── */
.cc-sell-formwrap { background: linear-gradient(150deg, #15803D, #16A34A); padding: 60px 24px; scroll-margin-top: 90px; }
.cc-sell-form-inner { max-width: 980px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1.1fr; gap: 36px; align-items: start; }
.cc-sell-form-intro { color: #fff; padding-top: 6px; }
.cc-sell-form-intro h2 { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: clamp(26px, 3.2vw, 36px); margin: 0 0 12px; line-height: 1.1; }
.cc-sell-form-intro p { font-size: 16px; line-height: 1.6; color: rgba(255,255,255,.92); margin: 0 0 20px; }
.cc-sell-form-usps { list-style: none; padding: 0; margin: 0 0 22px; }
.cc-sell-form-usps li { position: relative; padding: 7px 0 7px 28px; font-size: 14.5px; font-weight: 600; }
.cc-sell-form-usps li::before { content: "✓"; position: absolute; left: 0; top: 7px; font-weight: 800; color: var(--yellow); }
.cc-sell-form-mail { font-size: 14px; color: rgba(255,255,255,.9); }
.cc-sell-form-mail a { color: #fff; font-weight: 700; text-decoration: underline; }

/* Contactknoppen (mail / WhatsApp) onder formulier-intro */
.cc-sell-form-contact { margin-top: 6px; }
.cc-sell-contact-intro { display: block; font-size: 14px; color: rgba(255,255,255,.92); margin-bottom: 12px; }
.cc-sell-contact-btns { display: flex; gap: 10px; flex-wrap: wrap; }
.cc-sell-contact-btn {
  display: inline-flex; align-items: center; gap: 8px;
  background: #fff; color: var(--navy); font-weight: 700; font-size: 14px;
  padding: 10px 18px; border-radius: 10px; text-decoration: none;
  transition: transform .14s, box-shadow .14s;
}
.cc-sell-contact-btn:hover { transform: translateY(-1px); box-shadow: 0 8px 18px rgba(0,0,0,.18); }
.cc-sell-contact-btn svg { flex-shrink: 0; }
.cc-sell-contact-btn.cc-wa { color: #25D366; }

.cc-sell-form { background: #fff; border-radius: 18px; padding: 30px; box-shadow: 0 24px 60px -20px rgba(0,0,0,.35); }
.cc-sell-field { margin-bottom: 18px; }
.cc-sell-frow { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 18px; }
.cc-sell-frow .cc-sell-field { margin-bottom: 0; }
.cc-sell-field label { display: block; font-size: 13.5px; font-weight: 700; color: var(--navy); margin-bottom: 7px; }
.cc-sell-field input, .cc-sell-field textarea {
  width: 100%; box-sizing: border-box; border: 1.5px solid rgba(30,58,138,.18); border-radius: 10px;
  padding: 13px 14px; font-family: 'Inter', sans-serif; font-size: 14.5px; line-height: 1.5; color: var(--text);
  background: #fff; transition: border-color .15s, box-shadow .15s; outline: none;
}
.cc-sell-field input { height: 50px; }
.cc-sell-field input:focus, .cc-sell-field textarea:focus { border-color: #16A34A; box-shadow: 0 0 0 3px rgba(22,163,74,.12); }
.cc-sell-field textarea { resize: vertical; min-height: 120px; display: block; }
.cc-file { margin-bottom: 20px; }
.cc-file input[type=file] {
  width: 100%; box-sizing: border-box; border: 1.5px dashed rgba(30,58,138,.25); border-radius: 10px; padding: 14px;
  font-size: 13px; cursor: pointer; background: rgba(30,58,138,.02);
}
.cc-file-hint { display: block; font-size: 12px; color: var(--muted); margin-top: 7px; }
.cc-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }
.cc-sell-form-submit {
  width: 100%; margin-top: 6px; border: none; cursor: pointer;
  background: #16A34A; color: #fff; font-family: 'Inter', sans-serif; font-weight: 800; font-size: 16px;
  padding: 16px; border-radius: 12px; transition: background .15s, transform .12s;
}
.cc-sell-form-submit:hover { background: #15803D; transform: translateY(-1px); }
.cc-sell-form-submit:disabled { opacity: .6; cursor: default; transform: none; }
.cc-sell-form-feedback { margin-top: 14px; padding: 12px 14px; border-radius: 10px; font-size: 14px; font-weight: 600; }
.cc-sell-form-feedback.ok { background: rgba(22,163,74,.1); color: #15803D; }
.cc-sell-form-feedback.err { background: rgba(239,68,68,.1); color: #DC2626; }
.cc-sell-form-privacy { font-size: 12px; color: var(--muted); text-align: center; margin: 12px 0 0; }

/* ───── Sticky CTA-balk ───── */
.cc-sell-sticky {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 800;
  background: rgba(15,31,92,.97); backdrop-filter: blur(6px);
  box-shadow: 0 -6px 24px rgba(0,0,0,.18); color: #fff;
  transform: translateY(110%); transition: transform .3s ease;
  padding: 12px 20px; padding-bottom: max(12px, env(safe-area-inset-bottom));
}
.cc-sell-sticky.visible { transform: translateY(0); }
.cc-sell-sticky-inner { max-width: 1100px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.cc-sell-sticky-text { font-size: 14.5px; color: rgba(255,255,255,.9); }
.cc-sell-sticky-text strong { color: #fff; }
.cc-sell-sticky-btn {
  flex-shrink: 0; background: var(--yellow); color: var(--navy) !important;
  font-weight: 800; font-size: 14.5px; padding: 12px 24px; border-radius: 10px; text-decoration: none;
  transition: background .14s, transform .14s; white-space: nowrap;
}
.cc-sell-sticky-btn:hover { background: var(--yellow-dk); transform: translateY(-1px); }

@media (max-width: 860px) {
  .cc-sell-form-inner { grid-template-columns: 1fr; gap: 24px; }
}
@media (max-width: 600px) {
  .cc-sell-frow { grid-template-columns: 1fr; }
  .cc-sell-sticky-text { display: none; }
  .cc-sell-sticky-inner { justify-content: center; }
  .cc-sell-sticky-btn { width: 100%; text-align: center; }
}

/* ════════════════════════════════════════════════════════════════
   HELPCENTRUM (klantenservice-pagina's)
   ════════════════════════════════════════════════════════════════ */
.cc-support { background: var(--bg); }
.cc-support-head { background: var(--surface); border-bottom: 1px solid rgba(30,58,138,.07); }
.cc-support-head-inner { max-width: 1100px; margin: 0 auto; padding: 30px 24px 32px; }
.cc-support-title { font-family: 'Plus Jakarta Sans', sans-serif; font-size: clamp(28px, 3.2vw, 40px); font-weight: 800; color: var(--navy); letter-spacing: -.6px; margin: 8px 0 6px; }
.cc-support-intro { font-size: 15.5px; color: var(--muted); max-width: 640px; line-height: 1.6; margin: 0; }

.cc-support-body { max-width: 1100px; margin: 0 auto; padding: 36px 24px 72px; display: grid; grid-template-columns: 248px 1fr; gap: 40px; align-items: start; }

/* Zijbalk */
.cc-support-side { position: sticky; top: 92px; }
.cc-support-nav-title { font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); margin-bottom: 10px; padding: 0 12px; }
.cc-support-nav { display: flex; flex-direction: column; gap: 2px; margin-bottom: 22px; }
.cc-support-nav-link { padding: 10px 12px; border-radius: 8px; font-size: 14px; font-weight: 600; color: var(--text); text-decoration: none; transition: background .12s, color .12s; }
.cc-support-nav-link:hover { background: rgba(30,58,138,.06); color: var(--navy); }
.cc-support-nav-link.is-active { background: var(--navy); color: #fff; }
.cc-support-help { background: var(--surface); border: 1px solid rgba(30,58,138,.1); border-radius: 14px; padding: 18px; }
.cc-support-help strong { display: block; font-size: 14px; color: var(--navy); margin-bottom: 4px; }
.cc-support-help p { font-size: 13px; color: var(--muted); margin: 0 0 14px; line-height: 1.5; }
.cc-support-help-btn { display: block; text-align: center; padding: 10px; border-radius: 9px; font-weight: 700; font-size: 13.5px; text-decoration: none; margin-bottom: 8px; background: rgba(30,58,138,.07); color: var(--navy); transition: background .12s; }
.cc-support-help-btn:last-child { margin-bottom: 0; }
.cc-support-help-btn:hover { background: rgba(30,58,138,.12); }
.cc-support-help-btn.cc-wa { background: #16A34A; color: #fff; }
.cc-support-help-btn.cc-wa:hover { background: #15803D; }

/* Content-typografie */
.cc-support-content { background: var(--surface); border: 1px solid rgba(30,58,138,.08); border-radius: 16px; padding: 32px 36px; }
.cc-page-content h2 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 21px; font-weight: 800; color: var(--navy); margin: 30px 0 12px; }
.cc-page-content h2[id], .cc-legal-body h2[id] { scroll-margin-top: 90px; }
.cc-page-content h2:first-child { margin-top: 0; }
.cc-page-content h3 { font-size: 16px; font-weight: 700; color: var(--navy); margin: 22px 0 8px; }
.cc-page-content p { font-size: 15px; line-height: 1.7; color: var(--text); margin: 0 0 14px; }
.cc-page-content a { color: var(--navy); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.cc-page-content ul, .cc-page-content ol { margin: 0 0 16px; padding-left: 22px; }
.cc-page-content li { font-size: 15px; line-height: 1.7; color: var(--text); margin-bottom: 6px; }
.cc-page-content strong { color: var(--navy); }
.cc-page-content hr { border: none; border-top: 1px solid rgba(30,58,138,.1); margin: 26px 0; }

/* Info-tabel (verzending e.d.) */
.cc-page-content table { width: 100%; border-collapse: collapse; margin: 0 0 18px; font-size: 14.5px; }
.cc-page-content th, .cc-page-content td { text-align: left; padding: 12px 14px; border-bottom: 1px solid rgba(30,58,138,.08); }
.cc-page-content thead th { background: rgba(30,58,138,.04); font-weight: 700; color: var(--navy); font-size: 13px; }
.cc-page-content tbody tr:last-child td { border-bottom: none; }

/* Callout */
.cc-callout { display: flex; gap: 12px; background: rgba(255,215,0,.1); border: 1px solid rgba(230,184,0,.3); border-radius: 12px; padding: 14px 16px; margin: 0 0 18px; }
.cc-callout .cc-callout-ico { font-size: 20px; flex-shrink: 0; }
.cc-callout p { margin: 0; font-size: 14px; }
.cc-callout.cc-callout-blue { background: rgba(30,58,138,.05); border-color: rgba(30,58,138,.15); }

/* Klantenservice-hub kaarten */
.cc-hub-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin: 4px 0 8px; }
.cc-hub-card { display: block; background: var(--bg); border: 1px solid rgba(30,58,138,.1); border-radius: 14px; padding: 18px; text-decoration: none !important; transition: transform .14s, box-shadow .14s, border-color .14s; }
.cc-hub-card:hover { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(30,58,138,.1); border-color: rgba(30,58,138,.2); }
.cc-hub-ico { font-size: 24px; }
.cc-hub-card h3 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 16px; font-weight: 800; color: var(--navy); margin: 8px 0 4px; }
.cc-hub-card p { font-size: 13px; color: var(--muted); margin: 0; line-height: 1.5; }

/* Contactkaarten */
.cc-contact-cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin: 0 0 22px; }
.cc-contact-card { background: var(--bg); border: 1px solid rgba(30,58,138,.1); border-radius: 14px; padding: 18px; }
.cc-contact-card .cc-cc-ico { font-size: 22px; }
.cc-contact-card h3 { font-size: 15px; font-weight: 800; color: var(--navy); margin: 8px 0 4px; }
.cc-contact-card p { font-size: 13.5px; color: var(--muted); margin: 0 0 8px; line-height: 1.5; }
.cc-contact-card a.cc-cc-link { display: inline-block; font-weight: 700; color: var(--navy); text-decoration: none; }
.cc-legal { font-size: 13.5px; color: var(--muted); line-height: 1.8; }

@media (max-width: 820px) {
  .cc-support-body { grid-template-columns: 1fr; gap: 24px; }
  .cc-support-side { position: static; }
  .cc-support-nav { flex-direction: row; flex-wrap: wrap; }
  .cc-support-nav-link { background: rgba(30,58,138,.05); }
  .cc-hub-grid, .cc-contact-cards { grid-template-columns: 1fr; }
  .cc-support-content { padding: 24px; }
}

/* ───── Juridische pagina's (AV / privacy / cookies) ───── */
.cc-legal-page { background: var(--bg); }
.cc-legal-head { background: var(--surface); border-bottom: 1px solid rgba(30,58,138,.07); }
.cc-legal-head-inner { max-width: 820px; margin: 0 auto; padding: 30px 24px 28px; }
.cc-legal-title { font-family: 'Plus Jakarta Sans', sans-serif; font-size: clamp(28px, 3.2vw, 40px); font-weight: 800; color: var(--navy); letter-spacing: -.6px; margin: 8px 0 6px; }
.cc-legal-updated { font-size: 13px; color: var(--muted); margin: 0; }
.cc-legal-body { max-width: 820px; margin: 0 auto; padding: 36px 24px 72px; }
.cc-legal-body h2 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 19px; font-weight: 800; color: var(--navy); margin: 30px 0 10px; padding-top: 18px; border-top: 1px solid rgba(30,58,138,.08); }
.cc-legal-body h2:first-child { border-top: none; padding-top: 0; margin-top: 0; }
.cc-legal-body p, .cc-legal-body li { font-size: 14.5px; line-height: 1.7; color: var(--text); }
.cc-legal-body ol, .cc-legal-body ul { margin: 0 0 14px; padding-left: 22px; }
.cc-legal-body li { margin-bottom: 5px; }
.cc-legal-body li > ul, .cc-legal-body li > ol { margin-top: 6px; }

/* SEO-tekstblok onderaan homepage (rustig, leesbaar) */
.cc-seo-block { background: var(--bg); border-top: 1px solid rgba(30,58,138,.06); }
.cc-seo-inner { max-width: 1280px; margin: 0 auto; padding: 48px 24px 56px; }
.cc-seo-inner h2, .cc-seo-inner h3, .cc-seo-inner p { max-width: 820px; }
.cc-seo-inner h2 { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 22px; font-weight: 800; color: var(--navy); margin: 0 0 12px; }
.cc-seo-inner h3 { font-size: 15px; font-weight: 700; color: var(--navy); margin: 22px 0 6px; }
.cc-seo-inner p { font-size: 14px; line-height: 1.75; color: var(--muted); margin: 0 0 12px; }
.cc-seo-inner strong { color: var(--navy); font-weight: 600; }

/* ════════════════════════════════════════════════════════════════
   HEADING-OPTIMALISATIE — Plus Jakarta Sans
   Crispe rendering + strakkere tracking + nette regelafbreking op
   grote koppen (text-wrap: balance voorkomt eenzame woorden).
   ════════════════════════════════════════════════════════════════ */
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; }

/* Grote display-koppen: nette balans + iets strakkere tracking */
.hero-text h1,
.cc-sell-hero h1,
.cc-sell-hero .cc-sell-subhead,
.section-title,
.product-info h1,
.cc-archive-head h1,
.cc-support-head h1,
.cc-legal-head h1,
.cc-page-hero h1 {
  text-wrap: balance;
  letter-spacing: -.02em;
  line-height: 1.08;
}

/* Hero's mogen het strakst */
.hero-text h1,
.cc-sell-hero h1,
.cc-sell-hero .cc-sell-subhead { letter-spacing: -.025em; line-height: 1.04; }

/* Kleine bovenkast-labels: Jakarta wil iets meer lucht */
.footer-col-title { letter-spacing: .14em; }

/* ════════════════════════════════════════════════════════════════
   SLAB CERT-LIJN (subtiele één-regel verificatie onder titel)
   ════════════════════════════════════════════════════════════════ */
.cc-slab-line {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin: -2px 0 14px; font-size: 13px; color: var(--muted);
}
.cc-slab-line-grade { font-weight: 800; color: var(--navy); font-family: 'Plus Jakarta Sans', sans-serif; letter-spacing: .02em; }
.cc-slab-line-sep { opacity: .5; }
.cc-slab-line-cert { font-variant-numeric: tabular-nums; }
.cc-slab-line-verify {
  display: inline-flex; align-items: center; gap: 4px; color: #16a34a; font-weight: 700;
  text-decoration: none; padding: 2px 0; transition: color .15s;
}
.cc-slab-line-verify:hover { color: #128a3e; text-decoration: underline; }

/* Margeregeling-melding op productpagina (compacte rode melding) */
.cc-margin-note { background: #fdecec; border: 1px solid #f1b0b0; border-radius: 8px; padding: 9px 13px; margin: 0 0 16px; font-size: 13px; line-height: 1.5; color: #9b2c2c; }
.cc-margin-note strong { color: #b91c1c; font-weight: 700; }
/* Kort margelabel in winkelwagen + drawer */
.cc-line-margin, .cc-cart-item-margin { font-size: 11.5px; font-weight: 600; color: #b91c1c; margin: 4px 0 10px; line-height: 1.3; }
.cc-review-margin { display: block; font-size: 11px; font-weight: 600; color: #b91c1c; margin-top: 3px; }

/* ════════════════════════════════════════════════════════════════
   LEESBAARHEID-SAFEGUARD — witte tekst op navy knoppen
   Forceert leesbare knoptekst, ongeacht plugin-/WooCommerce-CSS dat
   ná main.css laadt (GamiPress, WC-blocks). Gele knoppen blijven donker.
   ════════════════════════════════════════════════════════════════ */
.btn-primary,
.btn-primary:hover,
.btn-primary:focus,
.woocommerce-MyAccount-content .button,
.woocommerce-MyAccount-content a.button,
.woocommerce-MyAccount-content button.button,
.woocommerce-MyAccount-content input.button,
.woocommerce-info .button,
.woocommerce-message .button,
.cart_totals .checkout-button,
.woocommerce #place_order,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
  color: #fff !important;
}




/* ===== Voorraad-notificatie popup ===== */
.cc-pcard-cart.is-out, .product-card-cart.is-out { cursor: pointer; transition: background .15s ease, color .15s ease, transform .12s ease; }
.cc-pcard-cart.is-out:hover, .product-card-cart.is-out:hover { background: var(--navy); color: #fff; transform: translateY(-1px); }
.cc-pcard-cart.is-out:active, .product-card-cart.is-out:active { transform: translateY(0); }

.cc-notify-modal { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; padding: 20px; }
.cc-notify-modal[hidden] { display: none; }
.cc-notify-overlay { position: absolute; inset: 0; background: rgba(8,11,33,.55); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); animation: ccNotifyFade .18s ease; }
.cc-notify-card { position: relative; z-index: 1; width: 100%; max-width: 380px; background: #fff; border-radius: 20px; padding: 30px 26px 24px; text-align: center; box-shadow: 0 24px 60px rgba(13,20,60,.32); animation: ccNotifyPop .22s cubic-bezier(.2,.9,.3,1.2); }
.cc-notify-x { position: absolute; top: 12px; right: 14px; background: none; border: 0; font-size: 26px; line-height: 1; color: #9aa0b5; cursor: pointer; padding: 4px; }
.cc-notify-x:hover { color: var(--navy); }
.cc-notify-ico { width: 54px; height: 54px; margin: 0 auto 14px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: rgba(245,196,42,.16); color: #b8860b; }
.cc-notify-title { margin: 0 0 6px; font-size: 20px; font-weight: 800; color: var(--navy); }
.cc-notify-sub { margin: 0 0 18px; font-size: 14px; line-height: 1.5; color: #5b6273; }
.cc-notify-sub .cc-notify-pname { color: var(--navy); }
.cc-notify-form { display: flex; flex-direction: column; gap: 10px; }
.cc-notify-input { height: 48px; border: 1.5px solid #d8dce8; border-radius: 12px; padding: 0 14px; font-size: 15px; width: 100%; box-sizing: border-box; transition: border-color .15s ease; }
.cc-notify-input:focus { outline: none; border-color: var(--navy); }
.cc-notify-submit { height: 48px; border: 0; border-radius: 12px; background: var(--navy); color: #fff !important; font-size: 15px; font-weight: 700; cursor: pointer; transition: background .15s ease, opacity .15s ease; }
.cc-notify-submit:hover { background: #0d1438; }
.cc-notify-submit:disabled { opacity: .65; cursor: default; }
.cc-notify-feedback { margin: 12px 0 0; font-size: 14px; line-height: 1.5; min-height: 0; }
.cc-notify-feedback.is-error { color: #c0392b; }
.cc-notify-feedback.is-success { color: #16794a; font-weight: 600; }
.cc-notify-check { display: inline-block; color: #16a34a; font-weight: 800; }
.cc-notify-fineprint { margin: 14px 0 0; font-size: 11.5px; color: #9aa0b5; }
@keyframes ccNotifyFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes ccNotifyPop { from { opacity: 0; transform: translateY(12px) scale(.97); } to { opacity: 1; transform: none; } }

/* ═══ VERLANGLIJST / FAVORIETEN ═══ */
/* Hartje op productkaarten */
.product-card, .cc-pcard { position: relative; }
.cc-wish-btn {
  position: absolute; top: 10px; right: 10px; z-index: 6;
  width: 34px; height: 34px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.92); border: 1px solid rgba(13,20,60,.08);
  color: #9aa0b5; cursor: pointer; padding: 0;
  box-shadow: 0 2px 8px rgba(13,20,60,.10);
  transition: color .15s ease, background .15s ease, transform .12s ease, box-shadow .15s ease;
  -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);
}
.cc-wish-btn svg { width: 17px; height: 17px; fill: none; transition: fill .15s ease; }
.cc-wish-btn:hover { color: #e23b5a; transform: translateY(-1px); box-shadow: 0 4px 12px rgba(226,59,90,.22); }
.cc-wish-btn.is-active { color: #e23b5a; }
.cc-wish-btn.is-active svg { fill: #e23b5a; }
.cc-wish-pop { animation: ccWishPop .32s cubic-bezier(.2,.9,.3,1.3); }
@keyframes ccWishPop { 0% { transform: scale(1); } 40% { transform: scale(1.28); } 100% { transform: scale(1); } }

/* Teller-badge bij het header-hartje */
.cc-wish-link { position: relative; }
.cc-wish-count {
  position: absolute; top: -4px; right: -4px; min-width: 16px; height: 16px;
  padding: 0 4px; border-radius: 9px; background: #e23b5a; color: #fff;
  font-size: 10px; font-weight: 800; line-height: 16px; text-align: center;
  box-shadow: 0 0 0 2px #fff;
}

/* Favorietenpagina — wrapper doet GEEN eigen layout; de teruggegeven
   .product-grid regelt de kolommen (zelfde look als de rest van de shop) */
.cc-wishlist-page { min-height: 200px; }
.cc-wishlist-loading { text-align: center; color: var(--muted); padding: 40px 0; }
.cc-wishlist-grid { display: block; }
.cc-wishlist-empty { text-align: center; max-width: 460px; margin: 24px auto; padding: 40px 24px; }
.cc-wishlist-empty-ico { color: #e23b5a; margin-bottom: 14px; }
.cc-wishlist-empty h3 { font-size: 22px; font-weight: 800; color: var(--navy); margin: 0 0 10px; }
.cc-wishlist-empty p { color: var(--muted); line-height: 1.6; margin: 0 0 22px; }

/* Reviewwidget: desktop links, mobiel gecentreerd (twee varianten) */
.cc-reviews-feed .cc-rev-mobile { display: none; }

/* ═══ PRODUCTPAGINA — desktop cleaner (bovenkant / beschrijving / bundel) ═══ */
/* 1. Bovenkant strakker: galerij meescrollt netjes mee (sticky), minder leegte */
.product-gallery { position: sticky; top: 88px; align-self: start; }
.product-main-img-wrap {
  border-radius: 16px;
  background:
    radial-gradient(120% 90% at 50% 0%, rgba(30,58,138,.035) 0%, rgba(255,255,255,0) 60%),
    var(--surface);
  box-shadow: 0 1px 3px rgba(13,20,60,.04);
}
.product-main-img, .product-img-placeholder { height: 420px; padding: 18px; }
.product-thumb { width: 64px; height: 64px; }

/* Prijs + voorraad strakker gegroepeerd */
.product-price-block { gap: 12px; margin-bottom: 14px; padding-bottom: 14px; }
.product-info .stock-indicator { margin-bottom: 20px; }

/* 2. Beschrijving in een nette witte kaart op de grijze band */
.cc-desc-card {
  background: var(--surface); border: 1px solid rgba(30,58,138,.08);
  border-radius: 16px; padding: 32px 36px; box-shadow: 0 1px 3px rgba(13,20,60,.04);
}
.cc-desc-card .desc-heading { margin-top: 0; }
.cc-desc-card .product-desc ul { list-style: none; padding-left: 0; }
.cc-desc-card .product-desc li {
  position: relative; padding-left: 26px; margin-bottom: 9px;
}
.cc-desc-card .product-desc li::before {
  content: ""; position: absolute; left: 4px; top: 9px;
  width: 7px; height: 7px; border-radius: 50%; background: var(--navy); opacity: .55;
}

/* 3. Bundelbox verfijnen: lichter, strakker uitgelijnd */
.bundle-box {
  border: 1px solid rgba(30,58,138,.08); border-radius: 16px; padding: 22px;
  box-shadow: 0 1px 3px rgba(13,20,60,.04);
}
.bundle-item {
  padding: 9px 8px; border-radius: 9px; margin: 0 -8px;
  transition: background .14s ease;
}
.bundle-item:hover { background: rgba(30,58,138,.03); }
.bundle-check { accent-color: var(--navy); width: 16px; height: 16px; flex-shrink: 0; }
.bundle-total-row { border-top: 1px solid rgba(30,58,138,.07); padding: 16px 0 16px; }
.bundle-atc-btn { padding: 14px; border-radius: 11px; letter-spacing: .01em; }

/* Top-wrapper productpagina (was inline) */
.cc-prod-top { max-width: 1280px; margin: 0 auto; padding: 48px 24px; }

/* Honeypot-veld: onzichtbaar voor mensen, wel in DOM voor bots */
.cc-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; pointer-events: none; }

/* Landselectie (select2) verticaal netjes centreren */
.woocommerce-checkout .select2-container--default .select2-selection--single {
  display: flex; align-items: center; height: 46px;
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: normal; padding-left: 0; padding-right: 22px; color: var(--text);
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 100%; top: 0; right: 10px;
}

/* Winkelwagenpagina — gratis cadeau-regel (geen aantal-/verwijderknop) */
.cc-line-giftnote { font-size: 12.5px; color: #16a34a; font-weight: 600; margin-top: 2px; }
.cc-line-qty-fixed { font-size: 13px; color: var(--muted); font-weight: 600; min-width: 38px; text-align: center; display: inline-block; }
.cc-line-remove-placeholder { display: inline-block; width: 16px; height: 16px; }
.cc-line-item-gift .cc-gift-free { color: #16a34a; font-weight: 700; }

/* ═══ ORDER-PAY PAGINA (betaling opnieuw proberen) ═══ */
.cc-order-pay-page #order_review { max-width: 760px; margin: 0 auto; }

/* Ordertabel als nette kaart */
.cc-order-pay-page table.shop_table {
  width: 100%; border-collapse: separate; border-spacing: 0;
  background: var(--surface); border: 1px solid rgba(30,58,138,.1);
  border-radius: 14px; overflow: hidden; margin-bottom: 22px;
}
.cc-order-pay-page table.shop_table thead th {
  background: rgba(30,58,138,.04); color: var(--navy);
  font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 12.5px;
  text-transform: uppercase; letter-spacing: .04em; text-align: left;
  padding: 14px 18px; border: none;
}
.cc-order-pay-page table.shop_table thead th.product-total,
.cc-order-pay-page table.shop_table td.product-total,
.cc-order-pay-page table.shop_table tfoot td { text-align: right; }
.cc-order-pay-page table.shop_table tbody td,
.cc-order-pay-page table.shop_table tfoot th,
.cc-order-pay-page table.shop_table tfoot td {
  padding: 13px 18px; font-size: 14px; color: var(--text);
  border-top: 1px solid rgba(30,58,138,.07);
}
.cc-order-pay-page table.shop_table .product-name { color: var(--navy); font-weight: 600; }
.cc-order-pay-page table.shop_table tfoot th { color: var(--muted); font-weight: 600; text-align: left; }
.cc-order-pay-page table.shop_table tfoot tr:last-child th,
.cc-order-pay-page table.shop_table tfoot tr:last-child td {
  font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 17px; color: var(--navy);
}
.cc-order-pay-page table.shop_table a { color: var(--navy); text-decoration: none; }

/* Betaalblok */
.cc-order-pay-page #payment {
  background: var(--surface); border: 1px solid rgba(30,58,138,.1);
  border-radius: 14px; padding: 20px 22px;
}
.cc-order-pay-page #payment .payment_methods { list-style: none; margin: 0 0 10px; padding: 0; }
.cc-order-pay-page #payment .payment_methods li {
  padding: 12px 6px; border-bottom: 1px solid rgba(30,58,138,.06);
}
.cc-order-pay-page #payment .payment_methods li:last-child { border-bottom: none; }
.cc-order-pay-page #payment label { color: var(--navy); font-weight: 600; }

/* Betaalknop in stijl */
.cc-order-pay-page #place_order,
.cc-order-pay-page #payment #place_order {
  width: 100%; background: var(--navy); color: #fff !important; border: none;
  border-radius: 12px; padding: 15px; font-family: 'Inter', sans-serif;
  font-size: 15px; font-weight: 700; cursor: pointer; margin-top: 14px;
  transition: background .15s, transform .12s;
}
.cc-order-pay-page #place_order:hover { background: var(--navy-soft); transform: translateY(-1px); }

/* Privacy- + voorwaarden-tekst */
.cc-order-pay-page .woocommerce-privacy-policy-text,
.cc-order-pay-page .woocommerce-terms-and-conditions-wrapper { font-size: 13.5px; color: var(--muted); line-height: 1.6; }
.cc-order-pay-page .woocommerce-terms-and-conditions-wrapper { margin-top: 10px; }

/* Bankoverschrijving: 48-uur betaalinstructie op de bedankt-pagina */
.cc-bacs-notice {
  background: #FFF8E1; border: 1px solid #F2C94C; border-left: 4px solid #F2C94C;
  border-radius: 14px; padding: 18px 20px; margin: 0 auto 22px; max-width: 760px;
}
.cc-bacs-notice-head {
  font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: 16px;
  color: #8a6d00; margin-bottom: 6px;
}
.cc-bacs-notice p { font-size: 14px; line-height: 1.6; color: #5a4a00; margin: 0 0 6px; }
.cc-bacs-notice p:last-child { margin-bottom: 0; }
.cc-bacs-notice-sub { font-size: 12.5px; color: #8a7a40; }
.cc-bacs-notice strong { color: #6b5500; }

/* Bankgegevens binnen de 48-uur-melding */
.cc-bacs-details {
  margin: 12px 0 10px; padding: 12px 14px; background: rgba(255,255,255,.6);
  border: 1px solid rgba(242,201,76,.5); border-radius: 10px;
  display: grid; gap: 4px;
}
.cc-bacs-details div { display: flex; gap: 10px; align-items: baseline; }
.cc-bacs-details dt { flex: 0 0 110px; margin: 0; font-size: 12.5px; color: #8a7a40; }
.cc-bacs-details dd { margin: 0; font-weight: 700; color: #6b5500; font-size: 14px; }
.cc-bacs-details dd .woocommerce-Price-amount { color: #6b5500; }

/* ═══ Notice-iconen: WooCommerce-icoonfont (kapotte glyph) vervangen ═══ */
.woocommerce-message, .woocommerce-info { position: relative; padding-left: 46px; }
.woocommerce-message::before,
.woocommerce-info::before {
  font-family: 'Inter', sans-serif !important;
  position: absolute !important; left: 16px !important; top: 50% !important;
  transform: translateY(-50%) !important;
  width: 20px !important; height: 20px !important; margin: 0 !important;
  border-radius: 50% !important; display: flex !important;
  align-items: center !important; justify-content: center !important;
  font-size: 12px !important; font-weight: 800 !important; line-height: 1 !important;
  color: #fff !important; background: #22C55E !important;
}
.woocommerce-message::before { content: "\2713" !important; background: #22C55E !important; }
.woocommerce-info::before    { content: "i" !important; background: #3B82F6 !important; font-style: italic; }
/* Rode foutmelding: WooCommerce-glyph weg (heeft eigen lijst-stijl) */
.woocommerce-error::before { content: none !important; display: none !important; }

/* Kortingscode-toggle: geen notice-icoon (eigen compacte layout) */
.woocommerce-form-coupon-toggle .woocommerce-info { padding-left: 14px !important; }
.woocommerce-form-coupon-toggle .woocommerce-info::before { display: none !important; content: none !important; }

/* Checkout: notitie dat factuuradres = bezorgadres */
.cc-billing-note {
  display: flex; align-items: flex-start; gap: 8px;
  background: rgba(30,58,138,.05); border: 1px solid rgba(30,58,138,.12);
  border-radius: 10px; padding: 10px 13px; margin: 0 0 18px;
  font-size: 13px; line-height: 1.5; color: var(--navy);
}
.cc-billing-note svg { flex-shrink: 0; margin-top: 1px; color: var(--navy); }
.cc-billing-note strong { font-weight: 700; }
