/* =====================================================================
   Theme: Industrial Logistics Prime  (Stitch design 1)
   Overlay op de Cobalt-basis — alles scoped onder [data-theme="industrial"]
   ===================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@700;800&family=JetBrains+Mono:wght@600;700&display=swap');

html[data-theme="industrial"]{
  --bg:#051424;
  --surface:#0d1c2d;
  --surface-2:#122131;
  --text:#d4e4fa;
  --muted:#8fa3bd;
  --muted-2:#b8c9de;
  --accent:#ffb800;
  --accent-2:#ffdca1;
  --accent-glow:rgba(255,184,0,.28);
  --msc:#ffb800;
  --msc-2:#ffcf4d;
  --msc-soft:rgba(255,184,0,.1);
  --msc-bd:rgba(255,184,0,.35);
  --success:#17d8ff;
  --success-2:#7ae6ff;
  --border:#1c2b3c;
  --border-2:#273647;
  --r:4px;
  --hero-bg:radial-gradient(1100px 620px at 68% 24%, #1e3a8a 0%, #0a1e3f 40%, #051424 72%, #020710 100%);
}

/* ---- typografie: impact & utility ---- */
html[data-theme="industrial"] h1,
html[data-theme="industrial"] h2,
html[data-theme="industrial"] h3,
html[data-theme="industrial"] .logo,
html[data-theme="industrial"] .paysafe-text h2{
  font-family:'Plus Jakarta Sans',Inter,system-ui,sans-serif;
  letter-spacing:-.02em;
}
html[data-theme="industrial"] .eyebrow,
html[data-theme="industrial"] .menu a,
html[data-theme="industrial"] .btn,
html[data-theme="industrial"] .cta-top,
html[data-theme="industrial"] .section-title strong,
html[data-theme="industrial"] .fin-badge,
html[data-theme="industrial"] .tag,
html[data-theme="industrial"] .cond-tag,
html[data-theme="industrial"] .pfin,
html[data-theme="industrial"] .pmatch,
html[data-theme="industrial"] .prent,
html[data-theme="industrial"] .stats .lbl,
html[data-theme="industrial"] .calc-presets button,
html[data-theme="industrial"] .fin-bar-disc{
  font-family:'JetBrains Mono',ui-monospace,monospace;
  text-transform:uppercase;
  letter-spacing:.08em;
}
html[data-theme="industrial"] .menu a{font-size:12.5px;font-weight:600}
html[data-theme="industrial"] .btn{font-size:13px;font-weight:700}

/* ---- header ---- */
html[data-theme="industrial"] header.site{background:rgba(2,7,16,.88);border-bottom-color:#12233a}
html[data-theme="industrial"] .logo span{color:var(--accent)}
html[data-theme="industrial"] .brand-sep{background:linear-gradient(180deg,transparent,rgba(158,143,120,.8) 25%,rgba(158,143,120,.8) 75%,transparent)}
html[data-theme="industrial"] .menu a.active::after{background:var(--accent)}
html[data-theme="industrial"] .cta-top{background:var(--accent);color:#271900;border-radius:4px}
html[data-theme="industrial"] .cta-top:hover{background:var(--accent-2);box-shadow:0 0 22px var(--accent-glow)}

/* ---- knoppen: industrial safety ---- */
html[data-theme="industrial"] .btn-primary{background:var(--accent);color:#271900;box-shadow:none}
html[data-theme="industrial"] .btn-primary:hover{background:var(--accent-2);box-shadow:0 0 26px var(--accent-glow)}
html[data-theme="industrial"] .btn-secondary{background:transparent;border:1px solid #0062e8;color:#b1c5ff}
html[data-theme="industrial"] .btn-secondary:hover{border-color:#4d8dff;color:#dae2ff;box-shadow:0 0 18px rgba(0,98,232,.25)}
html[data-theme="industrial"] .btn-yellow{background:#0062e8;color:#e7ebff}
html[data-theme="industrial"] .btn-yellow:hover{background:#1f78ff}

/* ---- glassmorphism kaarten ---- */
html[data-theme="industrial"] .pcard,
html[data-theme="industrial"] .safe-card,
html[data-theme="industrial"] .paysafe-card,
html[data-theme="industrial"] .safe-step,
html[data-theme="industrial"] .feature-card,
html[data-theme="industrial"] .trust-pop-card,
html[data-theme="industrial"] .calc-box,
html[data-theme="industrial"] .fin-box{
  background:rgba(18,33,49,.55);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.09);
  border-radius:12px;
}
html[data-theme="industrial"] .pcard:hover,
html[data-theme="industrial"] .safe-card:hover,
html[data-theme="industrial"] .paysafe-card:hover{border-color:rgba(255,184,0,.45)}
html[data-theme="industrial"] .fin-opt{border-radius:4px;background:rgba(1,15,31,.5)}
html[data-theme="industrial"] .fin-opt:hover{border-color:var(--accent)}

/* ---- hero & stats ---- */
html[data-theme="industrial"] .hero h1{font-weight:800}
html[data-theme="industrial"] .stats .num{color:var(--accent)}
html[data-theme="industrial"] .hero-bg-img img{filter:drop-shadow(0 40px 80px rgba(0,0,0,.75)) saturate(1.05)}

/* ---- financiering & popup accenten ---- */
html[data-theme="industrial"] .fin-bar-ico,
html[data-theme="industrial"] .trust-pop-shield,
html[data-theme="industrial"] .safe-hero-shield{background:rgba(255,184,0,.1);border-color:rgba(255,184,0,.35);color:var(--accent)}
html[data-theme="industrial"] .fin-bar-sub strong{color:var(--accent)}
html[data-theme="industrial"] .fin-bar-toggle{background:rgba(255,184,0,.12);color:var(--accent)}
html[data-theme="industrial"] .fin-toggle button.on{background:#0062e8}
html[data-theme="industrial"] .trust-pop-cta{background:var(--accent);color:#271900;border-radius:4px}
html[data-theme="industrial"] .trust-pop-cta:hover{background:var(--accent-2)}
html[data-theme="industrial"] .qm-fin-yes{background:var(--accent);color:#271900}
html[data-theme="industrial"] .fin-hero-pill{background:rgba(255,184,0,.1);border-color:rgba(255,184,0,.35);color:var(--accent)}
html[data-theme="industrial"] .fin-hero-pill:hover{background:rgba(255,184,0,.18)}
html[data-theme="industrial"] .pfin{background:rgba(0,98,232,.12);border-color:rgba(0,98,232,.4);color:#b1c5ff}
html[data-theme="industrial"] .calc-slider{accent-color:var(--accent)}
html[data-theme="industrial"] .safe-step-n{background:var(--accent);color:#271900;border-radius:4px}

/* ---- secties ---- */
html[data-theme="industrial"] .paysafe{background:linear-gradient(180deg,rgba(0,98,232,.06),transparent)}
html[data-theme="industrial"] footer.site{background:#020710;border-top:1px solid #12233a}

/* Stats: exact zoals het Stitch-ontwerp — alle drie egaal geel + mono-labels */
html[data-theme="industrial"] .stat .num,
html[data-theme="industrial"] .stat:nth-child(2) .num{
  background:none;-webkit-background-clip:border-box;background-clip:border-box;
  color:var(--accent);-webkit-text-fill-color:var(--accent);
  font-family:'Plus Jakarta Sans',Inter,sans-serif;font-weight:700;font-size:44px;letter-spacing:-.5px;
}
html[data-theme="industrial"] .stat .lbl{color:#c9d6e8;margin-top:8px}