
/* === Typography: Jost (Bold Italic) for headings, Poppins (Black) for text === */
/* Self-hosted sources (drop .woff2 files in assets/fonts/...); Google fallback via Customizer */
@font-face{
  font-family: 'Jost';
  src: url('../fonts/jost/Jost-BoldItalic.woff2') format('woff2');
  font-style: italic; font-weight: 700; font-display: swap;
}
@font-face{
  font-family: 'Poppins';
  src: url('../fonts/poppins/Poppins-Black.woff2') format('woff2');
  font-style: normal; font-weight: 900; font-display: swap;
}

/* Woo melding-knop (View Cart / Bekijk winkelwagen) in thema-stijl */
.woocommerce .woocommerce-message .button,
.woocommerce .woocommerce-info .button{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  border:1px solid var(--border); background:var(--surface);
  color:var(--text); padding:10px 14px; border-radius:12px; font-weight:700;
  transition:transform var(--speed), background var(--speed), border var(--speed);
}
.woocommerce .woocommerce-message .button:hover,
.woocommerce .woocommerce-info .button:hover{
  border-color:color-mix(in oklab, var(--border), var(--brand) 25%); background:var(--surface-2);
}


/* Center de echte productafbeelding (img.thumb) in de media box */
.p-media{ position:relative; display:block; }
.p-media img.thumb{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:84%; height:auto; max-height:80%; object-fit:contain;
  border-radius:22px; filter:drop-shadow(0 20px 40px rgba(0,0,0,.45));
}
/* Laat de oude fallback-div .thumb (zonder img) met de bestaande gradient intact */


/* Font tokens */
:root{
  --font-display: "Jost", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial;
  --font-text: "Poppins", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial;
}

/* Apply to body and headings */
body{ font-family: var(--font-text); font-weight: 900; }
h1,h2,h3,h4,.p-title,.logo{ font-family: var(--font-display); font-weight: 700; font-style: italic; }

:root{--brand-h:40;--brand-s:96%;--brand-l:52%;--bg:#0b0b0c;--surface:#121214;--surface-2:#151518;--text:#e5e7eb;--muted:#a1a1aa;--border:#232327;--radius:16px;--shadow-lg:0 20px 60px rgba(0,0,0,.45);--shadow-md:0 10px 30px rgba(0,0,0,.35);--brand:hsl(var(--brand-h) var(--brand-s) var(--brand-l));--brand-700:hsl(var(--brand-h) var(--brand-s) calc(var(--brand-l) - 10%));--brand-600:hsl(var(--brand-h) var(--brand-s) calc(var(--brand-l) - 6%));--brand-500:var(--brand);--ok:#22c55e;--warn:#f59e0b;--err:#ef4444;--container:1100px;--speed:.35s}[data-theme="light"]{--bg:#fafafa;--surface:#ffffff;--surface-2:#f6f7f8;--text:#0f172a;--muted:#475569;--border:#e5e7eb;--shadow-lg:0 30px 60px rgba(0,0,0,.08);--shadow-md:0 12px 28px rgba(0,0,0,.06)}.preset-amber{--brand-h:40;--brand-s:96%;--brand-l:52%}.preset-jade{--brand-h:150;--brand-s:70%;--brand-l:42%}.preset-indigo{--brand-h:250;--brand-s:90%;--brand-l:58%}*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial,"Noto Sans","Apple Color Emoji","Segoe UI Emoji";background:radial-gradient(1200px 800px at 80% -10%,rgba(255,255,255,.05),transparent 60%) , var(--bg);color:var(--text);line-height:1.45;letter-spacing:.1px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}.container{max-width:var(--container);margin:0 auto;padding:0 20px}.topbar{background:linear-gradient(90deg,var(--brand-600),var(--brand-500));color:#0b0b0c;font-weight:600;font-size:.92rem;text-align:center;padding:10px 16px}header#masthead{position:sticky;top:0;z-index:40;backdrop-filter:saturate(160%) blur(12px);background:color-mix(in oklab,var(--bg) 86%,transparent);border-bottom:1px solid var(--border)}.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0}.logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:1.15rem;letter-spacing:.3px}.logo-dot{width:12px;height:12px;border-radius:50%;background:var(--brand)}nav ul{display:flex;gap:18px;list-style:none;padding:0;margin:0}nav a{opacity:.9;padding:8px 10px;border-radius:10px;transition:opacity var(--speed), background var(--speed)}nav a:hover{opacity:1;background:color-mix(in oklab,var(--surface) 70%,transparent)}.actions{display:flex;align-items:center;gap:10px}.btn,.icon-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:1px solid var(--border);background:var(--surface);color:var(--text);padding:10px 14px;border-radius:12px;cursor:pointer;transition:transform var(--speed), background var(--speed), border var(--speed), opacity var(--speed)}.btn:hover,.icon-btn:hover{border-color:color-mix(in oklab,var(--border),var(--brand) 25%);background:var(--surface-2)}.btn.primary{background:var(--brand);color:#0b0b0c;border-color:transparent;font-weight:700}.btn.primary:hover{filter:saturate(105%);transform:translateY(-1px)}.icon-btn{width:44px;height:44px;position:relative}.badge{position:absolute;top:-6px;right:-6px;background:#0b0b0c;color:#fff;border:2px solid var(--brand);font-size:.72rem;font-weight:800;line-height:1;padding:4px 6px;border-radius:999px;min-width:20px;text-align:center}.hero{padding:42px 0 24px}.hero-wrap{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}.eyebrow{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:.9rem;color:var(--muted)}.eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--brand)}.hero h1{font-size:clamp(2.2rem,4.4vw,3.6rem);line-height:1.05;margin:10px 0 12px;letter-spacing:-.02em}.sub{font-size:clamp(1.02rem,1.5vw,1.22rem);color:var(--muted);max-width:56ch}.hero-cta{margin-top:22px;display:flex;gap:12px;flex-wrap:wrap}.badges{display:flex;gap:12px;margin-top:16px}.badge-chip{border:1px solid var(--border);background:var(--surface-2);padding:8px 12px;border-radius:999px;font-size:.9rem}.hero-art{position:relative;aspect-ratio:4/5;border-radius:24px;overflow:hidden;border:1px solid var(--border);background:radial-gradient(600px 300px at 20% 10%,color-mix(in oklab,var(--brand) 30%,transparent),transparent 60%),radial-gradient(800px 500px at 90% 30%,color-mix(in oklab,var(--brand) 25%,transparent),transparent 65%),linear-gradient(180deg,var(--surface),color-mix(in oklab,var(--surface) 70%,#000 30%) 60%);box-shadow:var(--shadow-lg)}.lamp{position:absolute;inset:auto 10% 0 10%;height:86%;background:radial-gradient(60% 28% at 50% 65%,rgba(255,255,255,.25),transparent 60%),linear-gradient(180deg,#d9d9d9,#c7c7c7 30%,#9a9a9a 70%,#5b5b5b);border-radius:48px 48px 16px 16px;filter:drop-shadow(0 30px 50px rgba(0,0,0,.5))}.lamp::after{content:\"\";position:absolute;inset:8% 18% auto 18%;height:8%;background:radial-gradient(120px 40px at 50% 50%,rgba(255,239,213,.9),rgba(255,239,213,.2) 60%,transparent 70%);border-radius:24px;filter:blur(2px)}.usp{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:26px 0 6px}.usp .card{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:14px;display:flex;gap:12px;align-items:center}.mini{font-size:.92rem;color:var(--muted)}.section-head{display:flex;align-items:end;justify-content:space-between;gap:16px;margin:34px 0 14px}.section-head h2{font-size:clamp(1.4rem,2.6vw,2rem);margin:0}.grid{display:grid;gap:16px}.grid.small-4{grid-template-columns:repeat(2, 1fr)}.product{border:1px solid var(--border);background:var(--surface);border-radius:18px;overflow:hidden;transition:transform var(--speed), border var(--speed)}.product:hover{transform:translateY(-2px);border-color:color-mix(in oklab,var(--border),var(--brand) 25%)}.p-media{position:relative;aspect-ratio:4/3;background:linear-gradient(180deg,var(--surface-2),color-mix(in oklab,var(--surface-2),#000 20%))}.p-badge{position:absolute;left:10px;top:10px;background:var(--brand);color:#0b0b0c;font-weight:800;font-size:.8rem;padding:6px 10px;border-radius:999px}.p-body{padding:16px}.p-title{font-weight:800;margin:0 0 8px;font-size:1.05rem}.p-desc{color:var(--muted);font-size:.95rem;margin:0 0 10px}.p-meta{display:flex;align-items:center;justify-content:space-between;gap:10px}.price{font-weight:900;font-size:1.05rem}.rating{font-size:.9rem;color:var(--muted)}.p-actions{display:flex;gap:8px;margin-top:14px}.qty{display:flex;align-items:center;gap:8px;border:1px solid var(--border);background:var(--surface-2);padding:10px 12px;border-radius:12px}.qty button{all:unset;cursor:pointer;padding:0 4px;font-weight:800}.thumb{position:absolute;inset:auto 8% 8% 8%;height:72%;background:linear-gradient(180deg,#f8fafc,#d7dbe3 50%,#a8b1c2);border-radius:22px;filter:drop-shadow(0 20px 40px rgba(0,0,0,.45))}.banner{margin:34px 0;padding:24px;border:1px dashed var(--border);border-radius:18px;background:color-mix(in oklab,var(--surface) 85%,transparent);display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}.reviews{margin:14px 0 34px}.slider{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:14px;overflow:auto;scroll-snap-type:x mandatory;padding-bottom:6px}.review{scroll-snap-align:start;border:1px solid var(--border);background:var(--surface);border-radius:16px;padding:16px;min-width:260px}.stars{color:var(--warn);margin-bottom:8px}.newsletter{border:1px solid var(--border);background:var(--surface);border-radius:18px;padding:20px;display:grid;grid-template-columns:1.1fr .9fr;gap:16px;align-items:center}.nl-form{display:flex;gap:10px;flex-wrap:wrap}.nl-form input{flex:1;min-width:220px;padding:12px 14px;border-radius:12px;border:1px solid var(--border);background:var(--surface-2);color:var(--text)}footer{margin:40px 0 20px}.ft{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:20px;border-top:1px solid var(--border);padding-top:24px}.ft h4{margin:.2rem 0 10px}.ft ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}.drawer{position:fixed;inset:0 0 0 auto;width:min(420px, 92vw);background:var(--surface);border-left:1px solid var(--border);transform:translateX(100%);transition:transform var(--speed);z-index:60;display:flex;flex-direction:column;box-shadow:-20px 0 60px rgba(0,0,0,.45)}.drawer.open{transform:none}.drawer-header{display:flex;align-items:center;justify-content:space-between;padding:14px;border-bottom:1px solid var(--border)}.drawer-body{flex:1;overflow:auto;padding:14px;display:grid;gap:12px}.cart-row{display:grid;grid-template-columns:60px 1fr auto;gap:10px;align-items:center;border:1px solid var(--border);background:var(--surface-2);padding:10px;border-radius:12px}.drawer-footer{border-top:1px solid var(--border);padding:14px;display:grid;gap:10px}.control-pad{position:fixed;right:16px;bottom:16px;z-index:80;display:grid;gap:8px;place-items:end}.control{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:10px;display:flex;gap:8px;box-shadow:var(--shadow-md)}.sw{width:26px;height:26px;border-radius:999px;border:1px solid var(--border);cursor:pointer}.sw.amber{background:hsl(40 96% 52%)}.sw.jade{background:hsl(150 70% 42%)}.sw.indigo{background:hsl(250 90% 58%)}@media (max-width:1000px){.hero-wrap{grid-template-columns:1fr;gap:20px}.usp{grid-template-columns:1fr 1fr}.grid.small-4{grid-template-columns:1fr}.newsletter{grid-template-columns:1fr}.ft{grid-template-columns:1.5fr 1fr 1fr}}@media (max-width:640px){nav ul{display:none}.usp{grid-template-columns:1fr}.ft{grid-template-columns:1fr 1fr}}.reveal{opacity:0;transform:translateY(12px);transition:opacity .6s ease, transform .6s ease}.reveal.on{opacity:1;transform:none}:where(a,button,input).focus-visible,:where(a,button,input):focus-visible{outline:2px solid var(--brand-600);outline-offset:2px;border-radius:10px}