/*
Theme Name: PCFABRIEK
Theme URI: https://pcfabriek.com
Author: PCFABRIEK
Description: Thema voor PCFABRIEK — op maat gebouwde computers. Inclusief configurator, prebuilds, accessoire-shop en een ticketsysteem voor support- en offerteverzoeken.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: pcfabriek
*/

  :root{
    --ink:#100B06;
    --ink-2:#17110A;
    --panel:#1E1610;
    --panel-2:#291E13;
    --line:#3A2C1A;
    --line-soft:#2C2013;
    --text:#F5EDDB;
    --text-dim:#B5A88B;
    --text-dimmer:#857961;
    --gold:#E7B85A;
    --gold-2:#F6DC97;
    --gold-deep:#BC8C34;
    --gold-line:#6E5524;
    --ok:#86CF93;
    --warn:#F2B14A;
    --bad:#E87A63;
    --display:'Saira Condensed',system-ui,sans-serif;
    --body:'Saira',system-ui,sans-serif;
    --mono:'IBM Plex Mono',ui-monospace,monospace;
    --gold-grad:linear-gradient(135deg,#FBE6A8 0%,#E7B85A 44%,#BC8C34 100%);
    --maxw:1200px;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{background:radial-gradient(130% 90% at 50% -8%,rgba(231,184,90,.07),transparent 60%),var(--ink);background-attachment:fixed;color:var(--text);font-family:var(--body);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
  body::before{
    content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
    background-image:linear-gradient(var(--line-soft) 1px,transparent 1px),linear-gradient(90deg,var(--line-soft) 1px,transparent 1px);
    background-size:48px 48px;opacity:.32;
    mask-image:radial-gradient(ellipse 120% 90% at 50% 0%,#000 30%,transparent 80%);
  }
  body::after{
    content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.045;mix-blend-mode:overlay;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }
  a{color:inherit;text-decoration:none}
  img,svg{display:block}
  ::selection{background:var(--gold);color:#231803}

  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;position:relative;z-index:1}
  .gold-text{background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent}

  .eyebrow{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);display:inline-flex;align-items:center;gap:8px}
  .eyebrow::before{content:"";width:22px;height:1px;background:var(--gold);display:inline-block}

  h1,h2,h3{font-family:var(--display);font-weight:800;text-transform:uppercase;line-height:.95;letter-spacing:-.005em}

  /* ---------------- top bar ---------------- */
  header{position:sticky;top:0;z-index:50;background:rgba(9,9,11,.84);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
  .nav{display:flex;align-items:center;gap:26px;height:64px}
  .brand{display:flex;align-items:center;gap:11px;font-family:var(--display);font-weight:800;font-size:22px;letter-spacing:.02em;text-transform:uppercase;white-space:nowrap}
  .brand .mark{width:30px;height:30px;flex:none;border:2px solid var(--gold);display:grid;place-items:center;position:relative;background:repeating-linear-gradient(45deg,transparent 0 4px,rgba(231,184,90,.18) 4px 6px)}
  .brand .mark::after{content:"";width:9px;height:9px;background:var(--gold)}
  .brand b{background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:800}
  .nav-links{display:flex;gap:4px;margin-left:6px}
  /* PROBLEEM 1: menu <li>'s hebben geen <ul>-wrapper (items_wrap=%3$s),
     dus de browser zet er een default 'disc' list-marker op -> de bolletjes.
     Verwijder de marker volledig; items zonder submenu krijgen niets. */
  .nav-links ul{list-style:none;margin:0;padding:0}
  .nav-links li{list-style:none;position:relative}
  .nav-links a{font-family:var(--mono);font-size:12.5px;letter-spacing:.04em;color:var(--text-dim);padding:8px 12px;border-radius:4px;text-transform:uppercase;transition:.18s color,.18s background}
  .nav-links a:hover{color:var(--text);background:var(--panel-2)}
  .nav-right{margin-left:auto;display:flex;align-items:center;gap:12px}
  .admin-toggle{display:flex;align-items:center;gap:8px;background:transparent;border:1px solid var(--line);border-radius:5px;padding:9px 13px;font-family:var(--mono);font-size:12px;color:var(--text-dim);cursor:pointer;text-transform:uppercase;letter-spacing:.05em;transition:.18s}
  .admin-toggle:hover{border-color:var(--gold-line);color:var(--text)}
  .admin-toggle .led{width:8px;height:8px;border-radius:50%;background:var(--text-dimmer);transition:.2s}
  body.admin .admin-toggle{border-color:var(--gold);color:var(--gold)}
  body.admin .admin-toggle .led{background:var(--gold);box-shadow:0 0 8px var(--gold)}
  .cart-btn{display:flex;align-items:center;gap:9px;border:1px solid var(--line);background:var(--panel);padding:9px 14px;border-radius:5px;font-family:var(--mono);font-size:12.5px;color:var(--text);cursor:pointer;transition:.18s}
  .cart-btn:hover{border-color:var(--gold);background:var(--panel-2)}
  .cart-count{background:var(--gold-grad);color:#231803;font-weight:600;border-radius:3px;min-width:20px;height:20px;display:grid;place-items:center;font-size:11.5px;padding:0 4px}
  .menu-toggle{display:none;background:none;border:1px solid var(--line);border-radius:5px;width:42px;height:40px;color:var(--text);cursor:pointer}

  /* admin banner */
  .admin-banner{display:none;background:linear-gradient(90deg,rgba(231,184,90,.14),rgba(231,184,90,.04));border-bottom:1px solid var(--gold-line)}
  body.admin .admin-banner{display:block}
  .admin-banner .wrap{padding:10px 24px;font-family:var(--mono);font-size:12px;color:var(--gold-2);letter-spacing:.03em;display:flex;align-items:center;gap:10px}

  /* buttons */
  .btn{font-family:var(--mono);text-transform:uppercase;letter-spacing:.05em;font-size:13px;font-weight:500;border:1px solid transparent;border-radius:5px;padding:13px 22px;cursor:pointer;display:inline-flex;align-items:center;gap:9px;transition:.18s}
  .btn:active{transform:translateY(1px)}
  .btn-primary{background:var(--gold-grad);color:#231803;font-weight:600;box-shadow:0 8px 24px -10px rgba(231,184,90,.5)}
  .btn:disabled,.btn[disabled]{opacity:.55;cursor:not-allowed;box-shadow:none;filter:none}
  .btn-primary:focus-visible{outline:2px solid var(--text);outline-offset:2px}
  .btn-primary:hover{filter:brightness(1.06);box-shadow:0 10px 30px -10px rgba(231,184,90,.7)}
  .btn-ghost{background:transparent;color:var(--text);border-color:var(--line)}
  .btn-ghost:hover{border-color:var(--gold-line)}
  .btn .arr{transition:.18s transform}
  .btn:hover .arr{transform:translateX(3px)}

  /* ---------------- hero ---------------- */
  .hero{padding:70px 0 0;position:relative;overflow:hidden}
  .hero::after{content:"";position:absolute;right:-8%;top:-25%;width:64%;height:135%;background:radial-gradient(circle at 60% 40%,rgba(231,184,90,.20),rgba(231,184,90,.05) 38%,transparent 60%);pointer-events:none;animation:glow 7s ease-in-out infinite alternate}
  @keyframes glow{from{opacity:.7}to{opacity:1}}
  .hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;padding-bottom:64px}
  .hero h1{font-size:clamp(56px,8.6vw,108px);margin:22px 0 0}
  .hero h1 .l1,.hero h1 .l2{display:block;overflow:hidden}
  .hero h1 .l1 span,.hero h1 .l2 span{display:block;transform:translateY(102%);animation:rise .9s cubic-bezier(.16,.84,.3,1) forwards}
  .hero h1 .l2 span{animation-delay:.12s}
  @keyframes rise{to{transform:none}}
  .hero p.lead{max-width:460px;color:var(--text-dim);font-size:18px;margin-top:22px;opacity:0;animation:fade .8s ease .5s forwards}
  .hero-cta{display:flex;gap:14px;margin-top:32px;flex-wrap:wrap;opacity:0;animation:fade .8s ease .65s forwards}
  @keyframes fade{to{opacity:1}}
  .hero-stats{display:flex;gap:0;margin-top:40px;border-top:1px solid var(--line);padding-top:20px;opacity:0;animation:fade .8s ease .8s forwards}
  .hero-stats div{padding-right:32px;margin-right:32px;border-right:1px solid var(--line)}
  .hero-stats div:last-child{border:0;margin:0;padding:0}
  .hero-stats .n{font-family:var(--display);font-weight:700;font-size:30px}
  .hero-stats .l{font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--text-dimmer)}

  /* plate / schematic signature */
  .plate{position:relative;background:linear-gradient(180deg,var(--panel-2),var(--panel));border:1px solid var(--line);border-radius:8px}
  .plate::before{content:"";position:absolute;top:11px;left:11px;width:7px;height:7px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#5a4f2c,#15131a);box-shadow:0 0 0 1px #0c0a10,1170px 0 0 0 #15131a,0 0 0 1px #0c0a10}
  .schematic{padding:0;overflow:hidden;opacity:0;animation:fade .6s ease .25s forwards;box-shadow:0 0 0 1px rgba(231,184,90,.1),0 40px 90px -34px rgba(231,184,90,.28)}
  .schematic-head{display:flex;justify-content:space-between;align-items:center;padding:13px 18px;border-bottom:1px solid var(--line);font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.14em;color:var(--text-dim)}
  .schematic-head .dot{width:7px;height:7px;border-radius:50%;background:var(--ok);box-shadow:0 0 8px var(--ok);display:inline-block;margin-right:7px;animation:pulse 2s ease-in-out infinite}
  @keyframes pulse{50%{opacity:.4}}
  .schematic-body{padding:16px}
  .schematic-body svg{width:100%;height:auto}
  .draw{stroke-dasharray:1400;stroke-dashoffset:1400;animation:draw 1.6s cubic-bezier(.5,0,.2,1) forwards}
  .draw.d2{animation-delay:.25s}.draw.d3{animation-delay:.5s}.draw.d4{animation-delay:.75s}
  @keyframes draw{to{stroke-dashoffset:0}}
  .callout{opacity:0;animation:fade .5s ease forwards}
  .callout.c1{animation-delay:1.2s}.callout.c2{animation-delay:1.45s}.callout.c3{animation-delay:1.7s}

  /* production ticker */
  .ticker{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--ink-2);overflow:hidden;white-space:nowrap}
  .ticker-track{display:inline-flex;gap:48px;padding:11px 0;animation:scroll 32s linear infinite;font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--text-dim);text-transform:uppercase}
  .ticker-track span b{color:var(--gold);font-weight:500}
  .ticker-track .dot{color:var(--gold)}
  @keyframes scroll{to{transform:translateX(-50%)}}

  /* sections */
  section{padding:90px 0;position:relative;z-index:1}
  .sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:40px;flex-wrap:wrap}
  .sec-head h2{font-size:clamp(34px,4.6vw,54px);max-width:18ch}
  .sec-head p{color:var(--text-dim);max-width:46ch}

  /* configurator */
  #configurator{background:linear-gradient(180deg,transparent,rgba(231,184,90,.03),transparent)}
  .cfg{display:grid;grid-template-columns:1fr 360px;gap:28px;align-items:start}
  .cfg-steps{background:var(--panel);border:1px solid var(--line);border-radius:10px;overflow:hidden}
  .cfg-step{border-bottom:1px solid var(--line-soft)}
  .cfg-step:last-child{border-bottom:0}
  .cfg-step-head{display:flex;align-items:center;gap:14px;padding:16px 20px;cursor:pointer;user-select:none;transition:.18s background}
  .cfg-step-head:hover{background:var(--panel-2)}
  .cfg-step-num{font-family:var(--mono);font-size:12px;color:var(--gold);width:26px;flex:none}
  .cfg-step-title{font-family:var(--display);font-weight:700;text-transform:uppercase;font-size:19px}
  .cfg-step-pick{margin-left:auto;font-family:var(--mono);font-size:12.5px;color:var(--text-dim);text-align:right;display:flex;align-items:center;gap:12px}
  .cfg-step-pick .price{color:var(--text)}
  .chev{transition:.2s transform;color:var(--text-dim)}
  .cfg-step.open .chev{transform:rotate(180deg)}
  .cfg-options{display:none;padding:4px 14px 16px}
  .cfg-step.open .cfg-options{display:grid;gap:8px}
  .opt{display:flex;align-items:center;gap:14px;padding:13px 14px;border:1px solid var(--line-soft);border-radius:7px;cursor:pointer;background:var(--ink);transition:.16s}
  .opt:hover{border-color:var(--text-dimmer)}
  .opt.sel{border-color:var(--gold);background:rgba(231,184,90,.06)}
  .opt .radio{width:16px;height:16px;border-radius:50%;border:2px solid var(--text-dimmer);flex:none;position:relative}
  .opt.sel .radio{border-color:var(--gold)}
  .opt.sel .radio::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--gold)}
  .opt .info{flex:1;min-width:0}
  .opt .name{font-weight:500;font-size:15px}
  .opt .spec{font-family:var(--mono);font-size:11.5px;color:var(--text-dimmer);text-transform:uppercase;letter-spacing:.04em;margin-top:2px}
  .price-tag{font-family:var(--mono);font-size:14px;color:var(--text);white-space:nowrap}
  .price-tag.free{color:var(--ok)}
  body.admin .price-tag{cursor:text;border-bottom:1px dashed var(--gold-line);padding-bottom:1px}
  body.admin .price-tag:hover{color:var(--gold)}
  .price-edit{font-family:var(--mono);font-size:14px;width:84px;background:var(--ink-2);border:1px solid var(--gold);color:var(--gold);border-radius:4px;padding:2px 6px}

  /* summary */
  .summary{position:sticky;top:84px}
  .summary .plate{overflow:hidden}
  .sum-head{padding:18px 20px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}
  .sum-head h3{font-size:21px}
  .sum-head .tag{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;color:var(--text-dimmer);text-transform:uppercase}
  .sum-rows{padding:8px 20px;max-height:230px;overflow:auto}
  .sum-row{display:flex;justify-content:space-between;gap:12px;padding:7px 0;font-size:13px;border-bottom:1px dashed var(--line-soft)}
  .sum-row:last-child{border:0}
  .sum-row .k{color:var(--text-dim);font-family:var(--mono);font-size:10.5px;text-transform:uppercase;letter-spacing:.08em}
  .sum-row .v{text-align:right;flex:1}
  .sum-row .vp{font-family:var(--mono);color:var(--text);white-space:nowrap}
  .compat{margin:14px 20px;border-radius:7px;padding:12px 14px;font-size:13px;display:flex;gap:10px;align-items:flex-start;font-family:var(--mono);line-height:1.45}
  .compat.ok{background:rgba(111,207,151,.08);border:1px solid rgba(111,207,151,.3);color:var(--ok)}
  .compat.warn{background:rgba(240,169,59,.08);border:1px solid rgba(240,169,59,.3);color:var(--warn)}
  .compat.bad{background:rgba(229,103,95,.08);border:1px solid rgba(229,103,95,.32);color:var(--bad)}
  .compat.info{background:rgba(181,168,139,.08);border:1px solid var(--line);color:var(--text-dim)}
  .compat svg{flex:none;margin-top:1px}
  .sum-total{padding:18px 20px;border-top:1px solid var(--line);background:var(--panel-2)}
  .sum-total .line{display:flex;justify-content:space-between;font-family:var(--mono);font-size:12.5px;color:var(--text-dim);margin-bottom:6px}
  .sum-total .grand{display:flex;justify-content:space-between;align-items:baseline;margin-top:8px}
  .sum-total .grand span{font-family:var(--mono);font-size:12px;text-transform:uppercase;letter-spacing:.1em;color:var(--text-dim)}
  .sum-total .grand b{font-family:var(--display);font-weight:800;font-size:38px;letter-spacing:0;background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
  .sum-total .grand b small{font-size:18px;color:var(--text-dim);font-weight:600;-webkit-text-fill-color:var(--text-dim)}
  .sum-total .btn{width:100%;justify-content:center;margin-top:16px}
  .est-watt{font-family:var(--mono);font-size:11px;color:var(--text-dimmer);text-align:center;margin-top:10px;letter-spacing:.05em}

  /* prebuilds */
  .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
  .card{background:linear-gradient(180deg,var(--panel-2),var(--panel));border:1px solid var(--line);border-radius:12px;overflow:hidden;display:flex;flex-direction:column;transition:.2s;box-shadow:0 20px 44px -32px rgba(0,0,0,.85)}
  .card:hover{transform:translateY(-4px);border-color:var(--gold);box-shadow:0 30px 60px -34px rgba(231,184,90,.3)}
  .card.feat{border-color:var(--gold);box-shadow:0 0 0 1px rgba(231,184,90,.24),0 28px 64px -28px rgba(231,184,90,.34)}
  .card-top{padding:22px 22px 18px;border-bottom:1px solid var(--line-soft);position:relative}
  .card-top .ribbon{position:absolute;top:0;right:0;background:var(--gold-grad);color:#231803;font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.12em;padding:5px 12px;text-transform:uppercase}
  .card .model{font-family:var(--mono);font-size:11px;letter-spacing:.16em;color:var(--gold);text-transform:uppercase}
  .card h3{font-size:30px;margin:8px 0 4px}
  .card .blurb{color:var(--text-dim);font-size:14px}
  .card-specs{padding:18px 22px;flex:1;display:grid;gap:9px}
  .card-specs .row{display:flex;gap:12px;font-size:13.5px;align-items:baseline}
  .card-specs .row .lab{font-family:var(--mono);font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--text-dimmer);width:64px;flex:none}
  .card-foot{padding:18px 22px;border-top:1px solid var(--line-soft);display:flex;align-items:center;justify-content:space-between;gap:14px}
  .card-foot .price{font-family:var(--display);font-weight:800;font-size:30px}
  .card-foot .price small{font-size:14px;color:var(--text-dim);font-weight:600;font-family:var(--mono)}
  body.admin .card-foot .price{cursor:text;border-bottom:1px dashed var(--gold-line)}

  /* shop */
  .shop-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
  .shop-cat{background:var(--panel);border:1px solid var(--line);border-radius:9px;padding:22px 20px;transition:.18s;cursor:pointer;display:flex;flex-direction:column;gap:14px;min-height:150px}
  .shop-cat:hover{border-color:var(--gold);background:var(--panel-2)}
  .shop-cat .ico{color:var(--gold)}
  .shop-cat h4{font-family:var(--display);font-weight:700;text-transform:uppercase;font-size:19px}
  .shop-cat .meta{margin-top:auto;font-family:var(--mono);font-size:11.5px;color:var(--text-dimmer);text-transform:uppercase;letter-spacing:.06em;display:flex;justify-content:space-between}

  /* tickets */
  #tickets{background:linear-gradient(180deg,transparent,rgba(231,184,90,.025),transparent)}
  .ticket-grid{display:grid;grid-template-columns:420px 1fr;gap:28px;align-items:start}
  .ticket-form{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:24px}
  .ticket-form h3{font-size:22px;margin-bottom:4px}
  .ticket-form .sub{font-family:var(--mono);font-size:11px;color:var(--text-dimmer);text-transform:uppercase;letter-spacing:.1em;margin-bottom:18px}
  .field{margin-bottom:14px}
  .field label{display:block;font-family:var(--mono);font-size:10.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--text-dim);margin-bottom:6px}
  .field input,.field select,.field textarea{width:100%;background:var(--ink-2);border:1px solid var(--line);border-radius:6px;color:var(--text);font-family:var(--body);font-size:14px;padding:11px 12px;transition:.15s border-color}
  .field textarea{resize:vertical;min-height:90px;font-family:var(--body)}
  .field input:focus,.field select:focus,.field textarea:focus{border-color:var(--gold);outline:none;box-shadow:0 0 0 3px rgba(231,184,90,.18)}
  .field.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  .ticket-form .btn{width:100%;justify-content:center;margin-top:6px}

  .ticket-list{display:flex;flex-direction:column;gap:12px}
  .ticket-list-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}
  .ticket-list-head h3{font-size:22px}
  .ticket-list-head .count{font-family:var(--mono);font-size:11.5px;color:var(--text-dim);letter-spacing:.06em}
  .ticket{background:var(--panel);border:1px solid var(--line);border-radius:9px;padding:16px 18px;display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:start}
  .ticket .tid{font-family:var(--mono);font-size:11px;color:var(--gold);letter-spacing:.06em}
  .ticket .tdate{font-family:var(--mono);font-size:10px;color:var(--text-dimmer);margin-top:3px}
  .ticket .tsub{font-weight:600;font-size:15px}
  .ticket .tmeta{font-family:var(--mono);font-size:11.5px;color:var(--text-dim);margin-top:3px}
  .ticket .tmsg{font-size:13.5px;color:var(--text-dim);margin-top:7px;line-height:1.5}
  .badge{font-family:var(--mono);font-size:10px;text-transform:uppercase;letter-spacing:.08em;padding:3px 9px;border-radius:4px;white-space:nowrap;border:1px solid}
  .badge.type{color:var(--text-dim);border-color:var(--line)}
  .badge.st-open{color:var(--warn);border-color:rgba(240,169,59,.4);background:rgba(240,169,59,.07)}
  .badge.st-bezig{color:var(--gold);border-color:var(--gold-line);background:rgba(231,184,90,.07)}
  .badge.st-klaar{color:var(--ok);border-color:rgba(111,207,151,.4);background:rgba(111,207,151,.07)}
  body.admin .badge[data-status]{cursor:pointer}
  body.admin .badge[data-status]::after{content:" ⟳";opacity:.6}
  .empty{padding:40px 20px;text-align:center;font-family:var(--mono);font-size:13px;color:var(--text-dimmer);border:1px dashed var(--line);border-radius:9px}

  /* trust */
  .trust{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--panel)}
  .trust .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
  .trust-item{padding:34px 28px;border-right:1px solid var(--line-soft);display:flex;gap:16px;align-items:flex-start}
  .trust-item:last-child{border-right:0}
  .trust-item .ico{color:var(--gold);flex:none}
  .trust-item h4{font-family:var(--display);font-weight:700;text-transform:uppercase;font-size:18px;margin-bottom:5px}
  .trust-item p{font-size:13px;color:var(--text-dim)}

  /* footer */
  footer{border-top:1px solid var(--line);padding:64px 0 32px;background:var(--ink)}
  .foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:36px;margin-bottom:48px}
  .foot-grid p{color:var(--text-dim);font-size:13.5px;max-width:34ch;margin-top:14px}
  .foot-col h5{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--text-dimmer);margin-bottom:16px}
  .foot-col a{display:block;color:var(--text-dim);font-size:14px;padding:5px 0;transition:.15s color}
  .foot-col a:hover{color:var(--gold)}
  .foot-bottom{border-top:1px solid var(--line-soft);padding-top:24px;display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;font-family:var(--mono);font-size:11.5px;color:var(--text-dimmer);letter-spacing:.04em}

  /* toast */
  .toast{position:fixed;bottom:26px;left:50%;transform:translate(-50%,140%);z-index:90;background:var(--panel-2);border:1px solid var(--gold);border-radius:7px;padding:14px 20px;display:flex;align-items:center;gap:12px;font-family:var(--mono);font-size:13px;box-shadow:0 12px 40px rgba(0,0,0,.5);transition:.3s transform}
  .toast.show{transform:translate(-50%,0)}
  .toast .dot{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 8px var(--ok)}

  .reveal{opacity:0;transform:translateY(18px);transition:.6s cubic-bezier(.2,.7,.2,1)}
  .reveal.in{opacity:1;transform:none}
  :focus-visible{outline:2px solid var(--gold);outline-offset:2px}

  /* ---- sub-pages ---- */
  .page[hidden]{display:none}
  .page-head{padding:60px 0 34px;border-bottom:1px solid var(--line);position:relative}
  .page-head .back{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;color:var(--text-dim);text-transform:uppercase;display:inline-flex;align-items:center;gap:7px;margin-bottom:18px;transition:.15s color}
  .page-head .back:hover{color:var(--gold)}
  .page-head h1{font-size:clamp(40px,6.4vw,76px)}
  .page-head .intro{color:var(--text-dim);max-width:62ch;margin-top:16px;font-size:17px}
  .prose{padding:46px 0 40px;max-width:780px}
  .prose h2{font-size:25px;font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.005em;margin:40px 0 14px}
  .prose h2:first-child{margin-top:0}
  .prose p{color:var(--text-dim);margin-bottom:14px}
  .prose ul{margin:0 0 18px;padding:0;list-style:none;display:grid;gap:10px}
  .prose ul li{position:relative;padding-left:26px;color:var(--text-dim)}
  .prose ul li::before{content:"";position:absolute;left:5px;top:9px;width:7px;height:7px;background:var(--gold);transform:rotate(45deg)}
  .prose strong{color:var(--text);font-weight:600}
  .prose .note{border-left:2px solid var(--gold-line);background:var(--panel);padding:14px 18px;border-radius:0 8px 8px 0;font-size:14px;margin:22px 0;color:var(--text-dim)}
  .faq{display:grid;gap:12px;max-width:840px}
  .faq details{background:linear-gradient(180deg,var(--panel-2),var(--panel));border:1px solid var(--line);border-radius:9px;overflow:hidden}
  .faq details[open]{border-color:var(--gold-line)}
  .faq summary{padding:18px 20px;cursor:pointer;font-weight:600;font-size:16px;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;transition:.15s background}
  .faq summary::-webkit-details-marker{display:none}
  .faq summary:hover{background:var(--panel-2)}
  .faq summary .pl{color:var(--gold);font-family:var(--mono);font-size:18px;flex:none;transition:.2s transform;line-height:1}
  .faq details[open] summary .pl{transform:rotate(45deg)}
  .faq .ans{padding:2px 20px 18px;color:var(--text-dim);font-size:14.5px;line-height:1.65}
  .page-cta{border-top:1px solid var(--line);padding:40px 0 88px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
  .page-cta .t h3{font-size:24px}
  .page-cta .t p{color:var(--text-dim);margin-top:6px;font-size:14px}

  @media(max-width:980px){
    .hero-grid{grid-template-columns:1fr;gap:36px}
    .schematic{max-width:460px}
    .cfg{grid-template-columns:1fr}.summary{position:static}
    .cards{grid-template-columns:1fr}
    .shop-grid{grid-template-columns:repeat(2,1fr)}
    .trust .wrap{grid-template-columns:1fr 1fr}.trust-item:nth-child(2){border-right:0}
    .foot-grid{grid-template-columns:1fr 1fr}
    .ticket-grid{grid-template-columns:1fr}
  }
  @media(max-width:680px){
    .nav-links{display:none}.menu-toggle{display:grid;place-items:center}
    .cart-btn span.lbl,.admin-toggle span.lbl{display:none}
    .hero{padding-top:46px}.hero-grid{padding-bottom:48px}
    .hero-stats{flex-wrap:wrap;gap:18px}.hero-stats div{border-right:0;padding-right:0;margin-right:0}
    .shop-grid{grid-template-columns:1fr}
    .trust .wrap{grid-template-columns:1fr}.trust-item{border-right:0;border-bottom:1px solid var(--line-soft)}
    .foot-grid{grid-template-columns:1fr}
    section{padding:64px 0}.btn{padding:12px 18px}
    .field.two{grid-template-columns:1fr}
    .ticket{grid-template-columns:1fr;gap:8px}
  }
  @media(prefers-reduced-motion:reduce){
    *{scroll-behavior:auto!important;transition:none!important;animation:none!important;animation-delay:0s!important}
    .reveal{opacity:1;transform:none}
    .hero h1 .l1 span,.hero h1 .l2 span{transform:none}
    .hero p.lead,.hero-cta,.hero-stats,.schematic,.callout{opacity:1}
    .draw{stroke-dashoffset:0}
  }

  /* ===== multi-page additions ===== */
  .nav-links a.active{color:var(--gold);background:var(--panel-2)}
  .page-head.compact{padding-top:48px}

  /* product cards (shop) */
  .shop-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:28px}
  .shop-tab{font-family:var(--mono);font-size:12.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--text-dim);background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:9px 16px;cursor:pointer;transition:.16s}
  .shop-tab:hover{border-color:var(--gold-line);color:var(--text)}
  .shop-tab.active{background:var(--gold-grad);color:#231803;border-color:transparent;font-weight:600}
  .prod-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
  .prod{background:linear-gradient(180deg,var(--panel-2),var(--panel));border:1px solid var(--line);border-radius:11px;overflow:hidden;display:flex;flex-direction:column;transition:.18s;box-shadow:0 18px 40px -32px rgba(0,0,0,.85)}
  .prod:hover{transform:translateY(-3px);border-color:var(--gold);box-shadow:0 26px 54px -34px rgba(231,184,90,.3)}
  .prod .thumb{aspect-ratio:4/3;background:radial-gradient(circle at 50% 38%,rgba(231,184,90,.1),transparent 60%),var(--ink-2);display:grid;place-items:center;border-bottom:1px solid var(--line-soft);color:var(--gold);position:relative}
  /* PROBLEEM 2: categorie-badge. Compact, donkerbruin, goudrand, max 2 regels
     met ellipsis, nooit breder dan de kaart (max-width binnen de thumb). */
  .prod .thumb .cat{
    position:absolute;top:10px;left:10px;
    max-width:calc(100% - 20px);
    font-family:var(--mono);font-size:9.5px;line-height:1.25;letter-spacing:.06em;
    text-transform:uppercase;font-weight:500;
    color:var(--gold-2);
    background:rgba(40,30,18,.88);
    border:1px solid var(--gold-line);
    border-radius:4px;padding:3px 7px;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
    text-overflow:ellipsis;cursor:default;
    box-shadow:0 2px 6px rgba(0,0,0,.35);
  }
  .prod .body{padding:15px 16px 16px;flex:1;display:flex;flex-direction:column;gap:4px}
  .prod .body .nm{font-weight:600;font-size:14.5px;line-height:1.3}
  .prod .body .sp{font-family:var(--mono);font-size:11px;color:var(--text-dimmer);text-transform:uppercase;letter-spacing:.04em}
  .prod .foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:12px}
  .prod .foot .price-tag{font-family:var(--display);font-weight:700;font-size:22px}
  .prod .mini{font-family:var(--mono);text-transform:uppercase;letter-spacing:.04em;font-size:11px;font-weight:600;background:var(--gold-grad);color:#231803;border:0;border-radius:5px;padding:8px 12px;cursor:pointer;transition:.16s}
  .prod .mini:hover{filter:brightness(1.06)}

  /* home highlight cards */
  .hl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
  .hl{display:flex;flex-direction:column;gap:12px;background:linear-gradient(180deg,var(--panel-2),var(--panel));border:1px solid var(--line);border-radius:12px;padding:26px 24px;transition:.2s;box-shadow:0 20px 44px -34px rgba(0,0,0,.85)}
  .hl:hover{transform:translateY(-4px);border-color:var(--gold);box-shadow:0 30px 60px -34px rgba(231,184,90,.28)}
  .hl .ico{color:var(--gold)}
  .hl h3{font-size:26px}
  .hl p{color:var(--text-dim);font-size:14px;flex:1}
  .hl .go{font-family:var(--mono);font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--gold);display:inline-flex;align-items:center;gap:7px}
  .hl:hover .go{gap:11px}

  /* CTA band */
  .band{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:linear-gradient(180deg,rgba(231,184,90,.05),transparent)}
  .band .wrap{padding:60px 24px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:18px}
  .band h2{font-size:clamp(32px,5vw,52px)}
  .band p{color:var(--text-dim);max-width:52ch}

  /* over / contact */
  .stat-row{display:flex;gap:0;margin:8px 0 8px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);flex-wrap:wrap}
  .stat-row div{flex:1;min-width:140px;padding:22px 24px;border-right:1px solid var(--line-soft)}
  .stat-row div:last-child{border-right:0}
  .stat-row .n{font-family:var(--display);font-weight:800;font-size:34px;background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
  .stat-row .l{font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--text-dimmer)}
  .contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start;padding:46px 0 40px}
  .contact-info{display:grid;gap:18px}
  .contact-info .row{display:flex;gap:14px;align-items:flex-start}
  .contact-info .row .ico{color:var(--gold);flex:none;margin-top:2px}
  .contact-info .row h4{font-family:var(--mono);font-size:10.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--text-dim);margin-bottom:4px}
  .contact-info .row p{color:var(--text);font-size:15px}
  @media(max-width:980px){.prod-grid{grid-template-columns:repeat(2,1fr)}.hl-grid{grid-template-columns:1fr}.contact-grid{grid-template-columns:1fr}}
  @media(max-width:680px){.prod-grid{grid-template-columns:1fr 1fr}}

  @media(max-width:680px){
    header.menu-open .nav-links{display:flex;position:absolute;top:64px;left:0;right:0;flex-direction:column;align-items:stretch;background:var(--ink-2);border-bottom:1px solid var(--line);padding:10px 16px;gap:2px;z-index:60}
    header.menu-open .nav-links a{padding:12px}
  }

  /* ===== WordPress-thema aanvullingen ===== */
  .next-steps{display:flex;flex-direction:column;gap:14px}
  .next-steps .step{display:flex;gap:14px;align-items:flex-start;background:linear-gradient(180deg,var(--panel-2),var(--panel));border:1px solid var(--line);border-radius:10px;padding:18px 20px}
  .next-steps .step .num{font-family:var(--display);font-weight:800;font-size:22px;color:var(--gold);flex:none;width:34px}
  .next-steps .step h4{font-family:var(--display);font-weight:700;text-transform:uppercase;font-size:16px;margin-bottom:4px}
  .next-steps .step p{color:var(--text-dim);font-size:13.5px}
  .admin-only-hint{font-family:var(--mono);font-size:11px;color:var(--text-dimmer);text-align:center;margin-top:10px}
  .pcf-notice{max-width:780px;margin:0 auto 18px;background:rgba(231,184,90,.08);border:1px solid var(--gold-line);border-radius:8px;padding:14px 18px;font-family:var(--mono);font-size:12.5px;color:var(--gold-2)}
  @media(max-width:980px){.contact-grid{grid-template-columns:1fr}}

  /* ===== WooCommerce — basisstijl voor winkelwagen, kassa en productpagina ===== */
  .woocommerce { color: var(--text); }
  .woocommerce a { color: var(--gold); }
  .woocommerce-message, .woocommerce-info, .woocommerce-error, .woocommerce-noreviews {
    background: var(--panel); border: 1px solid var(--line); border-left: 3px solid var(--gold);
    color: var(--text); border-radius: 8px; padding: 14px 18px; list-style: none; margin: 0 0 20px;
    font-family: var(--body); display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between;
  }
  .woocommerce-error { border-left-color: var(--bad); }
  .woocommerce ul.products { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; list-style: none; padding: 0; margin: 0; }
  .woocommerce ul.products li.product { margin: 0; list-style: none; }
  .woocommerce ul.products li.product .thumb img { border-radius: 0; }
  .woocommerce div.product { background: transparent; }
  .woocommerce div.product div.images, .woocommerce div.product div.summary { color: var(--text); }
  .woocommerce div.product p.price, .woocommerce div.product span.price { color: var(--gold); font-family: var(--display); font-size: 28px; font-weight: 800; }
  .woocommerce div.product .product_title { font-family: var(--display); text-transform: uppercase; }
  .woocommerce div.product div.summary { padding-left: 6px; }
  .woocommerce .quantity input.qty {
    background: var(--ink-2); border: 1px solid var(--line); color: var(--text); border-radius: 6px; padding: 10px; width: 70px;
  }
  .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #respond input#submit,
  .woocommerce button.single_add_to_cart_button {
    background: var(--gold-grad) !important; color: #231803 !important; border: 0 !important; border-radius: 6px !important;
    font-family: var(--mono); text-transform: uppercase; letter-spacing: .05em; font-size: 13px; font-weight: 600 !important;
    padding: 13px 22px !important;
  }
  .woocommerce a.button:hover, .woocommerce button.button:hover { filter: brightness(1.06); }
  .woocommerce table.shop_table, .woocommerce table.cart {
    background: var(--panel); border: 1px solid var(--line); border-radius: 10px; color: var(--text);
  }
  .woocommerce table.shop_table th { color: var(--text-dim); font-family: var(--mono); font-size: 11.5px; text-transform: uppercase; letter-spacing: .06em; }
  .woocommerce table.shop_table td, .woocommerce table.shop_table th { border-color: var(--line-soft) !important; padding: 14px !important; }
  .woocommerce-cart-form, .woocommerce-checkout-review-order, .cart-collaterals, .woocommerce-checkout {
    background: transparent; color: var(--text);
  }
  .woocommerce-checkout #payment, .cart-collaterals .cart_totals {
    background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 18px;
  }
  .woocommerce form .form-row input.input-text, .woocommerce form .form-row select, .woocommerce form .form-row textarea {
    background: var(--ink-2); border: 1px solid var(--line); color: var(--text); border-radius: 6px; padding: 11px 12px;
  }
  .woocommerce form .form-row label { color: var(--text-dim); font-family: var(--mono); font-size: 11.5px; text-transform: uppercase; letter-spacing: .05em; }
  .select2-container .select2-selection--single { background: var(--ink-2) !important; border: 1px solid var(--line) !important; height: 44px !important; }
  .select2-container .select2-selection__rendered { color: var(--text) !important; line-height: 44px !important; }
  .woocommerce-breadcrumb { font-family: var(--mono); font-size: 11.5px; color: var(--text-dimmer); text-transform: uppercase; letter-spacing: .05em; margin-bottom: 18px; }
  .woocommerce-breadcrumb a { color: var(--text-dim); }
  .woocommerce nav.woocommerce-pagination ul { border: 0; display: flex; gap: 8px; }
  .woocommerce nav.woocommerce-pagination ul li { border: 0 !important; }
  .woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span {
    background: var(--panel); border: 1px solid var(--line); border-radius: 6px; color: var(--text); padding: 8px 14px;
  }
  .woocommerce-account .woocommerce-MyAccount-navigation ul { list-style: none; padding: 0; display: grid; gap: 6px; }
  .woocommerce-account .woocommerce-MyAccount-navigation a {
    display: block; padding: 10px 14px; background: var(--panel); border: 1px solid var(--line); border-radius: 6px; color: var(--text);
  }
  .woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { border-color: var(--gold); color: var(--gold); }
  @media (max-width: 980px) { .woocommerce ul.products { grid-template-columns: repeat(2, 1fr); } }
  @media (max-width: 680px) { .woocommerce ul.products { grid-template-columns: 1fr; } }

  /* ===== WooCommerce archiefpagina — resultaten/sortering + productfoto ===== */
  .woocommerce-result-count { font-family: var(--mono); font-size: 12px; color: var(--text-dimmer); text-transform: uppercase; letter-spacing: .05em; margin: 0 0 10px; }
  .woocommerce-ordering { margin: 0 0 24px; }
  .woocommerce-ordering select { background: var(--ink-2); border: 1px solid var(--line); color: var(--text); border-radius: 6px; padding: 9px 12px; font-family: var(--mono); font-size: 12.5px; }
  .prod .thumb img { width: 100%; height: 100%; object-fit: contain; padding: 16px; }
  .prod .nm { display: block; }

  /* ===== configurator — live filtering ===== */
  .watt-badge {
    display: inline-block; margin-top: 4px; font-family: var(--mono); font-size: 10px; text-transform: uppercase;
    letter-spacing: .05em; color: var(--warn); border: 1px solid rgba(240,177,74,.4); background: rgba(240,177,74,.08);
    border-radius: 4px; padding: 2px 7px;
  }

  /* ===== Productpagina (single-product) — eigen lay-out, geen WooCommerce-tabs ===== */
  .pcf-product{padding:40px 0 60px}
  .pcf-product-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:48px;align-items:start}

  .pcf-gallery-main{background:var(--panel);border:1px solid var(--line);border-radius:12px;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;overflow:hidden}
  .pcf-gallery-main img{width:100%;height:100%;object-fit:contain;padding:20px}
  .pcf-gallery-placeholder{color:var(--text-dimmer)}
  .pcf-gallery-thumbs{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}
  .pcf-thumb-btn{width:64px;height:64px;border-radius:8px;border:1px solid var(--line);background:var(--panel);padding:4px;cursor:pointer;transition:.15s}
  .pcf-thumb-btn img{width:100%;height:100%;object-fit:contain}
  .pcf-thumb-btn:hover{border-color:var(--text-dimmer)}
  .pcf-thumb-btn.active{border-color:var(--gold)}

  .pcf-summary .product_title{font-family:var(--display);font-size:clamp(28px,3.6vw,40px);text-transform:uppercase;line-height:1.05;margin-bottom:14px}
  .pcf-summary .star-rating{color:var(--gold);font-size:14px;margin-bottom:12px;display:inline-block}
  .pcf-summary p.price,.pcf-summary span.price{font-family:var(--display);display:block;margin-bottom:18px}
  .pcf-summary p.price del,.pcf-summary span.price del{display:inline;text-decoration:line-through;opacity:.55;font-size:.55em;font-weight:600;margin-right:12px;color:var(--text-dimmer)}
  .pcf-summary p.price ins,.pcf-summary span.price ins{display:inline;text-decoration:none;font-size:1em;font-weight:800;color:var(--gold)}
  .pcf-summary p.price > .woocommerce-Price-amount{font-size:34px;font-weight:800;color:var(--gold)}
  .pcf-summary .woocommerce-product-details__short-description{color:var(--text-dim);margin-bottom:22px;line-height:1.6}
  .pcf-summary .woocommerce-product-details__short-description p{margin-bottom:10px}
  .pcf-summary form.cart{display:flex;align-items:center;gap:14px;margin-bottom:24px;flex-wrap:wrap}
  .pcf-summary .stock{font-family:var(--mono);font-size:12px;text-transform:uppercase;letter-spacing:.05em;padding:6px 0;color:var(--ok)}
  .pcf-summary .stock.out-of-stock{color:var(--bad)}
  .pcf-summary .product_meta{font-family:var(--mono);font-size:12px;color:var(--text-dimmer);border-top:1px solid var(--line-soft);padding-top:16px;display:grid;gap:6px}
  .pcf-summary .product_meta a{color:var(--text-dim)}
  .pcf-summary .product_meta > span{display:block}

  .pcf-sections{border-top:1px solid var(--line);margin-top:48px;padding-top:8px;max-width:900px}
  .pcf-sections .pcf-sec{padding:32px 0;border-bottom:1px solid var(--line-soft)}
  .pcf-sections .pcf-sec:last-child{border-bottom:0}
  .pcf-sections h2{font-family:var(--display);font-size:24px;text-transform:uppercase;margin-bottom:16px}
  .pcf-sections .woocommerce-product-attributes{width:100%;border-collapse:collapse}
  .pcf-sections .woocommerce-product-attributes tr{border-bottom:1px solid var(--line-soft)}
  .pcf-sections .woocommerce-product-attributes th{text-align:left;padding:10px 16px 10px 0;font-family:var(--mono);font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--text-dimmer);width:220px}
  .pcf-sections .woocommerce-product-attributes td{padding:10px 0;color:var(--text-dim)}
  .pcf-sections .comment-form input,.pcf-sections .comment-form textarea{background:var(--ink-2);border:1px solid var(--line);color:var(--text);border-radius:6px;padding:10px 12px;width:100%;max-width:420px}
  .pcf-sections .comment-form textarea{max-width:100%}
  .pcf-sections #reviews ol.commentlist{list-style:none;padding:0;display:grid;gap:18px}
  .pcf-sections #reviews .comment_container{display:flex;gap:14px}
  .pcf-sections #reviews .avatar{border-radius:50%;width:44px;height:44px}

  .pcf-related{margin-top:56px}
  .pcf-related h2{font-family:var(--display);font-size:26px;text-transform:uppercase;margin-bottom:20px}

  @media(max-width:900px){.pcf-product-grid{grid-template-columns:1fr}}

  /* ===== Afrekenpagina / winkelwagen / mijn account — brede lay-out ===== */
  body.woocommerce-checkout,
  body.woocommerce-cart,
  body.woocommerce-account{background:radial-gradient(130% 90% at 50% -8%,rgba(231,184,90,.07),transparent 60%),var(--ink) !important}

  .pcf-wc-page{padding:40px 0 70px;color:var(--text)}
  .pcf-wc-page a{color:var(--gold)}

  /* Twee kolommen: klantgegevens links, besteloverzicht rechts */
  .pcf-wc-page .col2-set{display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:start}
  .pcf-wc-page .col-1,.pcf-wc-page .col-2{width:100%}

  .pcf-wc-page h3{font-family:var(--display);text-transform:uppercase;font-size:20px;letter-spacing:.02em;margin:28px 0 16px;color:var(--text)}
  .pcf-wc-page #order_review_heading,.pcf-wc-page #ship-to-different-address{font-family:var(--display);text-transform:uppercase;font-size:20px;margin:0 0 16px}

  .pcf-wc-page .form-row{margin-bottom:16px}
  .pcf-wc-page .form-row label{display:block;font-family:var(--mono);font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-dim);margin-bottom:6px}
  .pcf-wc-page .form-row .required{color:var(--bad);text-decoration:none}
  .pcf-wc-page input.input-text,.pcf-wc-page select,.pcf-wc-page textarea{
    width:100%;background:var(--ink-2);border:1px solid var(--line);color:var(--text);
    border-radius:6px;padding:12px 14px;font-family:var(--body);font-size:15px;
  }
  .pcf-wc-page input.input-text:focus,.pcf-wc-page select:focus,.pcf-wc-page textarea:focus{border-color:var(--gold);outline:none;box-shadow:0 0 0 3px rgba(231,184,90,.18)}
  .pcf-wc-page .select2-container{width:100% !important}
  .pcf-wc-page .selection .select2-selection{background:var(--ink-2) !important;border:1px solid var(--line) !important;height:46px !important}
  .pcf-wc-page .select2-selection__rendered{color:var(--text) !important;line-height:46px !important}
  .pcf-wc-page .select2-dropdown{background:var(--panel) !important;border-color:var(--line) !important}
  .pcf-wc-page .select2-results__option{color:var(--text)}
  .pcf-wc-page .select2-container--default .select2-results__option--highlighted[aria-selected]{background:var(--gold) !important;color:#231803 !important}

  /* validatiestatus (foutmelding bij een veld) */
  .pcf-wc-page .form-row.woocommerce-invalid input.input-text,
  .pcf-wc-page .form-row.woocommerce-invalid select{border-color:var(--bad) !important}
  .pcf-wc-page .form-row .woocommerce-error{background:none;border:0;padding:4px 0 0;margin:0;color:var(--bad);font-size:12.5px;display:block}

  /* besteloverzicht-tabel + totalen */
  .pcf-wc-page #order_review{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:24px}
  .pcf-wc-page table.shop_table{width:100%;border-collapse:collapse;margin-bottom:16px}
  .pcf-wc-page table.shop_table th,.pcf-wc-page table.shop_table td{padding:12px 0;border-bottom:1px solid var(--line-soft);text-align:left}
  .pcf-wc-page table.shop_table .product-name{color:var(--text)}
  .pcf-wc-page table.shop_table .product-total,.pcf-wc-page table.shop_table td.product-total{text-align:right;white-space:nowrap}
  .pcf-wc-page table.shop_table tfoot th{font-family:var(--mono);font-size:12px;text-transform:uppercase;color:var(--text-dim);border-bottom:0}
  .pcf-wc-page table.shop_table tfoot .order-total td,.pcf-wc-page table.shop_table tfoot .order-total th{
    font-family:var(--display);font-size:22px;font-weight:800;color:var(--gold);border-bottom:0;padding-top:16px
  }

  /* couponveld */
  .pcf-wc-page .woocommerce-form-coupon-toggle .woocommerce-info{background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--gold);border-radius:8px;padding:14px 18px;color:var(--text-dim)}
  .pcf-wc-page .checkout_coupon{display:flex;gap:10px;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:16px;margin-bottom:20px;flex-wrap:wrap}
  .pcf-wc-page .checkout_coupon .form-row{flex:1;margin-bottom:0;min-width:160px}

  /* betaalmethoden */
  .pcf-wc-page ul.payment_methods{list-style:none;padding:0;border-top:1px solid var(--line);margin-bottom:0}
  .pcf-wc-page ul.payment_methods li.payment_method{padding:14px 0;border-bottom:1px solid var(--line-soft)}
  .pcf-wc-page ul.payment_methods label{color:var(--text);font-weight:600;cursor:pointer}
  .pcf-wc-page ul.payment_methods img{vertical-align:middle;margin-left:8px;max-height:22px}
  .pcf-wc-page .payment_box{background:var(--ink-2);border:1px solid var(--line-soft);border-radius:8px;padding:16px;margin-top:10px;color:var(--text-dim);font-size:13.5px}
  .pcf-wc-page .payment_box p{margin-bottom:8px}

  .pcf-wc-page #place_order,.pcf-wc-page .checkout-button{
    width:100%;background:var(--gold-grad);color:#231803;border:0;border-radius:7px;
    font-family:var(--mono);text-transform:uppercase;letter-spacing:.05em;font-weight:700;
    font-size:14px;padding:16px;cursor:pointer;margin-top:18px
  }
  .pcf-wc-page #place_order:hover{filter:brightness(1.06)}
  .pcf-wc-page #place_order:disabled,.pcf-wc-page #place_order.disabled{opacity:.55;cursor:not-allowed;filter:none}

  /* express checkout-knoppen (bv. PayPal) — de knop zelf rendert via de betaalprovider
     en is daardoor niet door ons thema te herstijlen, maar de ruimte erom wel */
  .pcf-wc-page .wc-express-checkout-buttons,.pcf-wc-page .wc-express-checkout-separator-text{margin-bottom:24px}
  .pcf-wc-page .wc-express-checkout-separator-text{color:var(--text-dimmer);font-family:var(--mono);font-size:11px;text-transform:uppercase;text-align:center;position:relative}

  .pcf-wc-page .woocommerce-notice--info,.pcf-wc-page .woocommerce-info{color:var(--text-dim);font-size:13.5px}

  /* mijn account */
  .pcf-wc-page .woocommerce-MyAccount-navigation ul{list-style:none;padding:0;display:grid;gap:6px;margin-bottom:24px}
  .pcf-wc-page .woocommerce-MyAccount-navigation a{display:block;padding:12px 16px;background:var(--panel);border:1px solid var(--line);border-radius:7px;color:var(--text)}
  .pcf-wc-page .woocommerce-MyAccount-navigation li.is-active a{border-color:var(--gold);color:var(--gold)}
  .pcf-wc-page .woocommerce-MyAccount-content{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:24px}

  @media(max-width:900px){.pcf-wc-page .col2-set{grid-template-columns:1fr}}

  /* ===== WooCommerce Blocks-afrekenen (nieuwer systeem — andere klassen dan klassiek) =====
     Sommige WooCommerce-installaties gebruiken dit i.p.v. het klassieke [woocommerce_checkout]-
     formulier. Beide systemen worden hier gestijld, zodat het hoe dan ook klopt. */
  .wc-block-checkout,.wp-block-woocommerce-checkout,.wp-block-woocommerce-cart{color:var(--text)}
  /* PROBLEEM 4: voorkom horizontale overflow in de checkout-container.
     Width 100% (mobiel), max-width op desktop, box-sizing al globaal gezet.
     Geen vaste pixelbreedtes die mobiel breken. */
  .wc-block-checkout,.wc-block-checkout .wc-block-checkout__main,.wc-block-checkout .wc-block-checkout__sidebar{
    max-width:100%;box-sizing:border-box;overflow-x:hidden;
  }
  .wc-block-components-radio-control,.wc-block-checkout__payment-methods,.wc-block-checkout__payment-method{
    max-width:100%;box-sizing:border-box;
  }
  .wc-block-components-checkout-step{border:0;margin-bottom:8px;padding-bottom:28px;border-bottom:1px solid var(--line-soft)}
  .wc-block-components-checkout-step:last-child{border-bottom:0}
  .wc-block-components-checkout-step__title{font-family:var(--display);text-transform:uppercase;font-size:19px;letter-spacing:.02em;color:var(--text)}
  .wc-block-components-checkout-step__heading{margin-bottom:14px}
  .wc-block-components-checkout-step__heading-content,.wc-block-components-checkout-step__description{color:var(--text-dim);font-size:13.5px}

  .wc-block-components-text-input input,
  .wc-block-components-text-input textarea,
  .wc-blocks-components-select select,
  .wc-block-components-combobox input{
    background:var(--ink-2) !important;border:1px solid var(--line) !important;color:var(--text) !important;
    border-radius:6px !important;
  }
  .wc-block-components-text-input label{color:var(--text-dimmer) !important}
  .wc-block-components-text-input.is-active label,.wc-block-components-text-input input:focus + label{color:var(--gold) !important}
  .wc-block-components-text-input input:focus,.wc-blocks-components-select select:focus{border-color:var(--gold) !important;box-shadow:none !important}
  .wc-block-components-text-input.has-error input,.wc-block-components-text-input.has-error{border-color:var(--bad) !important}
  .wc-block-components-validation-error{color:var(--bad);font-size:12.5px;margin-top:4px}
  .wc-blocks-components-select__container{background:var(--ink-2) !important;border-color:var(--line) !important}
  .wc-blocks-components-select__label{color:var(--text-dimmer) !important}

  /* PROBLEEM 3: WooCommerce Blocks betaalmethoden (radio-control).
     De core-rendered <input> is position:absolute;left:16px;top:16px en ligt
     bovenop de label-tekst -> begin van de naam wordt afgeknipt (iDEAL->AL,
     Klarna->rna, PayPal->yPal). We maken de optie een flex-rij, zetten de input
     statisch links en geven de label-group ruimte zodat de tekst niet meer
     onder de radio valt. Geen absolute positioning meer voor kernonderdelen. */
  .wc-block-components-radio-control__option{
    display:flex !important;align-items:center !important;gap:14px;
    background:var(--panel);border:1px solid var(--line) !important;border-radius:8px;
    margin-bottom:10px;padding:12px 16px !important;min-height:52px;
    position:relative;cursor:pointer;width:100%;
  }
  .wc-block-components-radio-control__option .wc-block-components-radio-control__input{
    position:static !important;flex:0 0 auto;width:20px;height:20px;margin:0 !important;
    accent-color:var(--gold);
  }
  .wc-block-components-radio-control__option .wc-block-components-radio-control__option-layout{
    flex:1 1 auto;min-width:0;display:flex;align-items:center;
  }
  .wc-block-components-radio-control__option .wc-block-components-radio-control__label-group{
    display:flex !important;align-items:center;justify-content:space-between;gap:12px;
    width:100%;min-width:0;
  }
  .wc-block-components-radio-control__option .wc-block-components-radio-control__label{
    color:var(--text) !important;font-weight:600;font-family:var(--body);
    font-size:14px;letter-spacing:normal;overflow:hidden;text-overflow:ellipsis;
    white-space:normal;min-width:0;
  }
  .wc-block-components-radio-control__option .wc-block-components-radio-control__secondary-label{
    color:var(--gold);flex:0 0 auto;white-space:nowrap;
  }
  .wc-block-components-radio-control__option--checked,
  .wc-block-components-radio-control__option:has(input:checked){
    border-color:var(--gold) !important;
    background:linear-gradient(180deg,rgba(231,184,90,.08),var(--panel)) !important;
  }
  .wc-block-components-radio-control__option:focus-within{
    outline:2px solid var(--gold);outline-offset:2px;
  }

  .wc-block-checkout__payment-method{background:var(--panel);border:1px solid var(--line);border-radius:8px;margin-bottom:10px;padding:6px 16px}
  .wc-block-checkout__payment-method-content{color:var(--text-dim);font-size:13px;padding:12px 0}

  .wc-block-components-totals-item,.wc-block-components-totals-footer-item{color:var(--text-dim);border-top:1px solid var(--line-soft) !important}
  .wc-block-components-totals-item__label{font-family:var(--mono);font-size:12px;text-transform:uppercase;letter-spacing:.04em}
  .wc-block-components-totals-item__value{color:var(--text)}
  .wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
  .wc-block-components-totals-footer-item .wc-block-components-totals-item__value{
    font-family:var(--display);font-size:22px;font-weight:800;color:var(--gold);
  }
  .wc-block-components-order-summary-item__description,.wc-block-components-order-summary-item__individual-prices{color:var(--text-dimmer)}
  .wc-block-components-product-name{color:var(--text)}
  .wc-block-components-totals-coupon-link{color:var(--gold) !important}
  .wc-block-components-totals-coupon__form .wc-block-components-text-input input{background:var(--ink-2) !important}

  .wc-block-components-checkout-place-order-button,.wc-block-components-button.wp-element-button{
    background:var(--gold-grad) !important;color:#231803 !important;border:0 !important;border-radius:7px !important;
    font-family:var(--mono) !important;text-transform:uppercase;letter-spacing:.05em;font-weight:700 !important;
  }
  .wc-block-components-checkout-place-order-button:hover{filter:brightness(1.06)}

  .wc-block-checkout__sidebar,.wc-block-components-sidebar{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:24px}
  .wc-block-components-order-summary{background:transparent}

  .wc-block-components-express-payment .wc-block-components-express-payment__title,
  .wc-block-checkout__express-payment-text{color:var(--text-dimmer) !important;font-family:var(--mono);font-size:11px;text-transform:uppercase}
  .wc-block-checkout__form-separator,.wc-block-components-checkout-step--with-separator::after{
    color:var(--text-dimmer) !important;border-color:var(--line) !important;
  }

  .wc-block-components-shipping-rates-control__package{border:1px solid var(--line);border-radius:8px;padding:12px}