:root{--ink:#2B2D42;--navy:#3D5A80;--blue:#4EA8E8;--sky:#7CC9F5;--light:#BDE8FF;--coral:#FF7B6B;--sunny:#FFC94D;--mint:#7BD8B0;--pink:#8ED3BE;--text:#3D405B;--muted:#7A7D96;--line:#EBE7F5;--bg:#FDF7EE;--card:#fff;--c:#4EA8E8;--m:#3D5A80;--y:#FFC94D;--k:#2B2D42;--primary:#FF7B6B;--primary-d:#E8590C;--success:#2F9E44;--warning:#E8890C;--danger:#DC2626;--info:#0284C7;--r:8px;--shadow:0 2px 4px rgba(61,64,91,.06),0 6px 20px rgba(61,64,91,.08)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font:16px/1.65 'Baloo 2',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--text);background:var(--bg)}
a{color:var(--c);text-decoration:none}a:hover{text-decoration:underline}
img{max-width:100%;display:block}
@font-face{font-family:'Caveat Brush';src:url('/Assets/fonts/caveatbrush.woff2') format('woff2');font-display:swap}
h1,h2,h3,h4{font-family:'Caveat Brush','Baloo 2',system-ui,sans-serif;color:var(--ink);line-height:1.15;margin:0 0 .5em;font-weight:400}
h1{font-size:2.2rem;font-weight:700;letter-spacing:-.02em}h2{font-size:1.4rem;font-weight:700}h3{font-size:1.08rem;font-weight:700}
p{margin:0 0 1em}
.container{max-width:1600px;margin:0 auto;padding:0 24px}
.section{padding-top:28px;padding-bottom:40px}
.narrow{max-width:620px}
.muted{color:var(--muted)}.small{font-size:.86rem}.text-success{color:var(--success)}
.hp{position:absolute;left:-9999px}
[hidden]{display:none!important}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:24px;margin-bottom:20px}
.card-title{font-size:1.1rem;display:flex;align-items:center;gap:10px;margin-bottom:16px}
.stack>.card:last-child{margin-bottom:0}
/* topbar + header (niet sticky) */
.topbar{background:linear-gradient(90deg,var(--navy),#4a6fa0);color:#E8F1FB;font-size:.85rem}
.topbar-inner{display:flex;justify-content:space-between;gap:16px;padding:8px 24px}
.topbar i{margin-right:6px;color:var(--sunny)}.topbar strong{color:#fff}
.header{background:#fff;border-bottom:1px solid var(--line)}
.header-inner{display:flex;align-items:center;gap:28px;padding:8px 24px;min-height:var(--header-h,80px)}
.logo{display:flex;align-items:center}.logo img{height:var(--logo-h,52px);width:auto;max-width:none}
.mainnav{display:flex;gap:4px;flex:1}.nav-center .mainnav{justify-content:center}.nav-right .mainnav{justify-content:flex-end}
.nav-center .header-inner{display:grid;grid-template-columns:1fr auto 1fr}.nav-center .header-actions{justify-self:end}
.mainnav a{color:var(--ink);font-weight:600;padding:8px 14px;border-radius:var(--r)}
.mainnav a:hover,.mainnav a.active{background:var(--bg);text-decoration:none}
.mainnav a.active{color:var(--m)}
.header-actions{display:flex;align-items:center;gap:12px}
.icon-link{display:flex;align-items:center;gap:6px;color:var(--ink);font-weight:600}
.icon-link i{font-size:1.25rem}
.menu-toggle{display:none;background:none;border:0;font-size:1.6rem;color:var(--ink);cursor:pointer}
.btn-cart{position:relative}
.cart-count{background:var(--sky);color:#fff;border-radius:99px;font-size:.72rem;min-width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center;padding:0 6px;margin-left:2px}
.rainbow-line{display:flex;height:6px}.rainbow-line span{flex:1}.rainbow-line span:nth-child(1){background:var(--coral)}.rainbow-line span:nth-child(2){background:var(--sunny)}.rainbow-line span:nth-child(3){background:var(--mint)}.rainbow-line span:nth-child(4){background:var(--sky)}.rainbow-line span:nth-child(5){background:var(--pink)}
/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:99px;padding:10px 20px;font:inherit;font-weight:700;cursor:pointer;line-height:1.2;white-space:nowrap;transition:.15s}
.btn:hover{text-decoration:none}
.btn-primary{background:var(--coral);color:#fff;box-shadow:0 3px 0 #3A8570}.btn-primary:hover{background:#8ED3BE;transform:translateY(-1px)}.btn-primary:active{transform:translateY(1px);box-shadow:none}
.btn-dark{background:var(--navy);color:#fff;box-shadow:0 3px 0 #2B4463}.btn-dark:hover{background:#4a6fa0}
.btn-light{background:#fff;color:var(--ink);border-color:var(--line)}.btn-light:hover{background:var(--bg)}
.btn-danger{background:#fff;color:var(--danger);border-color:#fecaca}.btn-danger:hover{background:#fef2f2}
.btn-lg{padding:14px 24px;font-size:1rem}.btn-sm{padding:6px 12px;font-size:.85rem}
.btn-block{width:100%;margin-top:10px}
.btn-icon{width:46px;height:46px;padding:0;font-size:1.15rem;border-radius:50%}
.btn-link{background:none;border:0;cursor:pointer;color:var(--muted);font-size:1.05rem;padding:6px}.btn-link.danger:hover{color:var(--danger)}
.btn-row{display:flex;gap:10px;flex-wrap:wrap}
/* badges */
.badge{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:99px;font-size:.78rem;font-weight:600;background:#f1f2f5;color:var(--muted);white-space:nowrap}
.badge i{font-size:.8rem}
.badge-success{background:#e7f6ee;color:var(--success)}.badge-warning{background:#fef3e2;color:var(--warning)}.badge-danger{background:#fdecec;color:var(--danger)}.badge-info{background:#e6f4fb;color:var(--info)}.badge-primary{background:#ebe9f7;color:var(--navy)}.badge-muted{background:#f1f2f5;color:var(--muted)}
.perso-badge{display:inline-flex;align-items:center;gap:6px;font-size:.74rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;padding:4px 12px;border-radius:99px;margin-bottom:10px;background:linear-gradient(90deg,var(--sunny),#ffd97a);color:#7A4A00}
.perso-badge.big{font-size:.82rem;padding:7px 14px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.35);color:#fff;backdrop-filter:blur(4px)}
.prod-badge{display:inline-flex;align-items:center;gap:5px;font-size:.72rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;padding:4px 11px;border-radius:99px}
.prod-badge.badge-nieuw{background:#E3F6EE;color:#1E7E4C}.prod-badge.badge-nieuw i{color:#2F9E44}
.prod-badge.badge-populair{background:#FFE9E4;color:#C24B3B}.prod-badge.badge-populair i{color:var(--coral)}
.prod-badge.on-img{position:absolute;top:14px;left:14px;z-index:2;box-shadow:0 2px 8px rgba(0,0,0,.15)}
.cat-chip{display:inline-block;font-size:.72rem;font-weight:700;padding:3px 10px;border-radius:99px;background:#EAF4FE;color:#2C6FB5;margin-bottom:8px}
.pill{margin-left:auto;background:var(--m);color:#fff;border-radius:99px;font-size:.72rem;padding:1px 8px}
/* alerts */
.alert{display:flex;gap:10px;align-items:center;border-radius:var(--r);padding:12px 16px;margin:18px 0 0;font-weight:500}
.alert-success{background:#e7f6ee;color:#0b6b36;border:1px solid #bfe7cf}.alert-danger{background:#fdecec;color:#991b1b;border:1px solid #f7c6c6}
.alert-info{background:#e6f4fb;color:#075985;border:1px solid #bae0f3}
/* page head */
.page-head{display:flex;align-items:center;gap:18px}
.page-icon{width:56px;height:56px;flex:0 0 56px;border-radius:8px;background:linear-gradient(160deg,var(--sunny),var(--coral) 60%,#4E9C86);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.55rem;box-shadow:0 4px 10px rgba(232,89,12,.25)}
.page-head h1{font-size:1.6rem;margin:0}.page-head p{margin:2px 0 0;color:var(--muted)}
.page-head-text{flex:1}.page-head-actions{display:flex;gap:10px;flex-wrap:wrap}
/* hero */
.hero{position:relative;overflow:hidden;color:#fff;background:radial-gradient(circle at 85% 15%,rgba(255,201,77,.5),transparent 40%),radial-gradient(circle at 8% 105%,rgba(255,155,190,.45),transparent 45%),linear-gradient(120deg,#3D5A80 0,#4EA8E8 55%,#7CC9F5 100%)}
.hero:before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.08) 1px,transparent 1px);background-size:22px 22px;pointer-events:none}
.hero-photo{background:linear-gradient(100deg,rgba(26,21,80,.96) 0,rgba(49,39,131,.88) 45%,rgba(0,159,227,.45) 100%),var(--hero-img) center/cover no-repeat}
.hero-inner{position:relative}.hero h1{color:#fff}.hero .grad{background:linear-gradient(90deg,#FFE29A,var(--sunny) 55%,#CDEFEA);-webkit-background-clip:text;background-clip:text}
.hero .usp{color:#fff}.hero .usp i{color:var(--sunny)}
.hero .btn-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.5)}.hero .btn-light:hover{background:rgba(255,255,255,.12)}
.hero .btn-primary{background:var(--sunny);color:#5C3D00;border-color:var(--sunny);box-shadow:0 3px 0 #D9A422}.hero .btn-primary:hover{background:#fff;color:var(--navy);border-color:#fff;box-shadow:0 3px 0 #ddd}
.hero-inner{display:grid;grid-template-columns:1.15fr 1fr;gap:48px;align-items:center;padding-top:56px;padding-bottom:60px;position:relative;z-index:1}
.hero h1{font-size:3.1rem;margin:14px 0 16px}
.hero p{font-size:1.1rem;color:rgba(255,255,255,.82);max-width:620px}
.grad{background:linear-gradient(90deg,var(--sunny),var(--coral),var(--pink));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0}
.hero-visual{margin:0}.hero-visual img{filter:drop-shadow(0 20px 30px rgba(0,0,0,.25))}
.usp{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:10px 24px;font-weight:500}
.usp i{color:var(--m);margin-right:6px}
.usp.small{flex-direction:column;gap:6px;font-size:.9rem;margin-top:18px}.usp.small .text-success{color:var(--success)}
.notice-dtf{display:flex;gap:14px;align-items:center;border-left:4px solid var(--blue);background:#f0f9fe}
.notice-dtf>i{font-size:1.6rem;color:var(--navy)}
.section-head{display:flex;justify-content:space-between;align-items:center;gap:16px}
.section-head h2{margin:0}.section-head p{margin:0;color:var(--muted)}
.eyebrow{display:inline-block;font-weight:800;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--coral);margin-bottom:6px}
/* product */
.product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px;margin-bottom:20px}
.product-card{padding:0;overflow:hidden;display:flex;flex-direction:column;margin:0;transition:.15s}
.product-card:hover{border-color:var(--sky);transform:translateY(-3px);box-shadow:0 8px 24px rgba(61,64,91,.12)}
.product-card-img{display:block;background:linear-gradient(160deg,#FDF3E3,#EAF4FE);aspect-ratio:1;position:relative}
.product-card-img img{width:100%;height:100%;object-fit:cover}
.product-card-body{padding:18px;display:flex;flex-direction:column;flex:1}
.product-card-body h3 a{color:var(--ink)}
.product-card-body p{color:var(--muted);font-size:.9rem;flex:1}
.product-card-foot{display:flex;justify-content:space-between;align-items:flex-end;gap:10px}
.price{display:flex;flex-direction:column}
.price s{color:var(--muted);font-size:.85rem}
.price strong{font-size:1.35rem;color:var(--ink);font-weight:700}
.price small{color:var(--muted);font-size:.78rem}
.price.big{margin:18px 0;display:flex;flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:8px 12px}
.price.big strong{font-size:2rem}.price.big small{flex-basis:100%}
.pdp{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}
.pdp-img{padding:0;overflow:hidden}
.pdp-buy h1{font-size:2rem;margin:6px 0 8px}
.lead{font-size:1.05rem;color:var(--muted)}
.contents{list-style:none;padding:0;margin:0 0 4px;display:grid;gap:6px}
.contents li{background:var(--bg);border-radius:8px;padding:8px 12px;font-weight:500}
.contents .qty{display:inline-block;min-width:34px;font-weight:700;color:var(--m)}
.buy-row{display:flex;gap:12px;flex-wrap:wrap}
.qty-input{display:inline-flex;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#fff;height:46px}
.qty-input button{width:40px;border:0;background:var(--bg);font-size:1.2rem;cursor:pointer;color:var(--ink)}
.qty-input input{width:52px;border:0;text-align:center;font:inherit;font-weight:700;-moz-appearance:textfield}
.qty-input input::-webkit-inner-spin-button{-webkit-appearance:none}
.specs{display:grid;grid-template-columns:160px 1fr;gap:8px 16px;margin:16px 0 0}
.specs dt{color:var(--muted)}.specs dd{margin:0;font-weight:500}
.prose{max-width:none}.prose p:last-child{margin:0}
/* about */
.about{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;padding:36px}
.about-facts{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.about-facts div{background:var(--bg);border-radius:var(--r);padding:18px;display:flex;flex-direction:column}
.about-facts i{font-size:1.5rem;color:var(--c);margin-bottom:6px}
.about-facts div:nth-child(2) i{color:var(--navy)}.about-facts div:nth-child(3) i{color:var(--sky)}.about-facts div:nth-child(4) i{color:var(--navy)}
.about-facts span{color:var(--muted);font-size:.88rem}
/* forms */
.grid-2-1{display:grid;grid-template-columns:2fr 1fr;gap:20px;align-items:start}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
.row-2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.row-3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.field{display:block;position:relative;margin-bottom:14px}
.field>span{display:block;font-weight:600;font-size:.86rem;color:var(--ink);margin-bottom:5px}
.field>i{position:absolute;left:12px;top:36px;color:var(--muted);pointer-events:none}
.field input,.field select,.field textarea{width:100%;font:inherit;color:var(--ink);background:#fff;border:1px solid #d6d9e1;border-radius:var(--r);padding:10px 12px 10px 38px;outline:none;transition:.15s}
.field textarea{padding-left:38px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--c);box-shadow:0 0 0 3px rgba(0,159,227,.18)}
.field.no-icon input,.field.no-icon select,.field.no-icon textarea{padding-left:12px}
.field-error{display:block;color:var(--danger);font-size:.82rem;margin-top:4px}
.field small{display:block;color:var(--muted);font-size:.8rem;margin-top:4px}
.check{display:block;position:relative;padding-left:26px;margin:6px 0 14px;cursor:pointer}
.check input{position:absolute;left:0;top:4px;margin:0;accent-color:var(--blue)}
.form-links{text-align:center;margin:16px 0 0;color:var(--muted)}
.options{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.option{display:flex;gap:12px;align-items:center;border:2px solid var(--line);border-radius:var(--r);padding:14px;cursor:pointer;transition:.15s}
.option input{accent-color:var(--m)}
.option>i{font-size:1.5rem;color:var(--c)}
.option span{display:flex;flex-direction:column}.option small{color:var(--muted)}
.option.is-on{border-color:var(--blue);background:#f0f9fe}
.option.is-disabled{opacity:.6;cursor:not-allowed}
.step{display:inline-flex;width:28px;height:28px;border-radius:50%;background:var(--navy);color:#fff;align-items:center;justify-content:center;font-size:.85rem}
.info-row{display:flex;gap:12px;align-items:center}.info-row>i{font-size:1.4rem;color:var(--c)}
/* cart + summary */
.empty{text-align:center;padding:48px}.empty>i{font-size:2.6rem;color:var(--muted)}
.cart{padding:8px 24px}
.cart-line{display:grid;grid-template-columns:72px 1fr auto 100px 36px;gap:16px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line)}
.cart-line:last-of-type{border-bottom:0}
.cart-line img{width:72px;height:72px;border-radius:8px;background:var(--bg)}
.cart-line-info{display:flex;flex-direction:column;align-items:flex-start}.cart-line-info a{color:var(--ink)}.cart-line-info small{color:var(--muted)}
.cart-line-info .ink-badge.small{margin:4px 0}
.cart-line-total{text-align:right;color:var(--ink)}
.sum-row,.sum-line{display:flex;justify-content:space-between;gap:12px;padding:6px 0}
.sum-line{border-bottom:1px dashed var(--line);font-size:.92rem;padding:8px 0}
.sum-row.total{border-top:1px solid var(--line);margin-top:8px;padding-top:12px;font-weight:700;color:var(--ink);font-size:1.1rem}
.sum-row.muted{font-size:.88rem}
.free-bar{height:8px;background:var(--bg);border-radius:99px;overflow:hidden;margin-top:12px}
.free-bar div{height:100%;background:linear-gradient(90deg,var(--sky),var(--navy))}
/* tables */
.table-wrap{overflow-x:auto}
.table{width:100%;border-collapse:collapse}
.table th{text-align:left;font-size:.78rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:700;padding:10px 12px;border-bottom:1px solid var(--line)}
.table td{padding:12px;border-bottom:1px solid var(--line);vertical-align:middle}
.table tbody tr:nth-child(even){background:#f5f7fb}
.table tbody tr:hover{background:#eaf5fc}
.table .num{text-align:right;white-space:nowrap}
.table tfoot td{border-bottom:0;padding:6px 12px}
.table tfoot tr.total td{font-weight:700;color:var(--ink);font-size:1.05rem;border-top:1px solid var(--line)}
.table a{font-weight:600}
/* account */
.account-nav{display:flex;gap:6px;flex-wrap:wrap;padding:8px}
.account-nav a,.account-nav button{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:var(--r);color:var(--ink);font-weight:600;background:none;border:0;font:inherit;font-weight:600;cursor:pointer}
.account-nav a:hover,.account-nav button:hover{background:var(--bg);text-decoration:none}
.account-nav a.is-active{background:var(--navy);color:#fff}
.account-nav form{margin-left:auto}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;margin-bottom:20px}
.stat{margin:0;display:flex;gap:14px;align-items:center}
.stat i{width:46px;height:46px;border-radius:var(--r);display:flex;align-items:center;justify-content:center;font-size:1.3rem;background:#e6f4fb;color:var(--c)}
.stat:nth-child(2) i{background:#ebe9f7;color:var(--navy)}.stat:nth-child(3) i{background:#e6f7fd;color:var(--sky)}.stat:nth-child(4) i{background:#eceef2;color:var(--ink)}
.stat strong{display:block;font-size:1.4rem;color:var(--ink);line-height:1.1}.stat span{color:var(--muted);font-size:.85rem}
/* footer */
.footer{background:var(--navy);color:#c9c5ea;margin-top:40px;font-size:.9rem}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px;padding-top:44px;padding-bottom:32px}
.footer-grid>div{display:flex;flex-direction:column;gap:6px}
.footer h4{color:#fff;font-size:.95rem;margin-bottom:8px}
.footer a{color:#d1d5db}.footer a:hover{color:#fff}
.footer-logo{height:48px;width:auto;margin-bottom:8px}
.footer-bottom{display:flex;justify-content:space-between;border-top:1px solid #463c9b;padding-top:18px;padding-bottom:22px;font-size:.84rem}
.pay-icons i{margin-right:6px}
/* bare */
.bare{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:24px}
@media (max-width:1100px){.hero-inner,.pdp,.about,.grid-2-1,.grid-2{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr}.hide-md{display:none}}
@media (max-width:760px){
 .container{padding:0 16px}.hide-sm{display:none}.topbar-inner{padding:8px 16px}
 .header-inner,.nav-center .header-inner{display:flex;flex-wrap:wrap;gap:12px;padding:12px 16px;min-height:0}.logo img{height:min(var(--logo-h,52px),40px)}
 .menu-toggle{display:block;margin-left:auto;order:2}.header-actions{order:1;margin-left:auto}
 .mainnav{display:none;order:3;flex-basis:100%;flex-direction:column}.mainnav.is-open{display:flex}
 .hero h1{font-size:2.2rem}.row-2,.row-3,.options,.about-facts{grid-template-columns:1fr}
 .cart-line{grid-template-columns:56px 1fr auto;}.cart-line img{width:56px;height:56px}.cart-line .qty-input{grid-column:2}.cart-line-total{grid-column:3}
 .footer-grid{grid-template-columns:1fr}.footer-bottom{flex-direction:column;gap:6px}
 .specs{grid-template-columns:1fr}.section-head{flex-direction:column;align-items:flex-start}.about{padding:22px}
}
.page-head{display:block}.page-head-inner{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.field>i:first-child{top:12px}
.hero-visual img,.pdp-img img,.product-card-img img{width:100%;height:auto}
.switch-row{display:flex;gap:14px;align-items:center;cursor:pointer;margin:4px 0 6px}.switch-row small{display:block;color:var(--muted);font-size:.85rem}
.switch{position:relative;flex:0 0 46px;width:46px;height:26px}.switch input{position:absolute;opacity:0;width:0;height:0}
.switch-slider{position:absolute;inset:0;background:#cbd5e1;border-radius:8px;transition:.2s}.switch-slider:before{content:"";position:absolute;left:3px;top:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:.2s}
.switch input:checked+.switch-slider{background:var(--blue)}.switch input:checked+.switch-slider:before{transform:translateX(20px)}.switch input:focus-visible+.switch-slider{outline:2px solid var(--navy);outline-offset:2px}
.price-login{white-space:nowrap}.price-locked{display:flex;gap:12px;align-items:center;padding:14px 16px;border-radius:var(--r);background:#f0f9fe;border-left:4px solid var(--blue);margin:14px 0}.price-locked>i{font-size:1.4rem;color:var(--navy)}.price-locked span{display:block;color:var(--muted);font-size:.9rem}
.hero-thumb{display:block;width:100%;max-height:180px;object-fit:cover;border-radius:var(--r);margin:6px 0 10px}
@media (max-width:700px){.hero-inner{padding-top:28px}}
.hero-photo .hero-visual{visibility:hidden}
.align-options{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:6px 0 14px}.align-options label{display:flex;align-items:center;justify-content:center;gap:6px;padding:10px;border:1px solid var(--line);border-radius:var(--r);cursor:pointer;font-weight:600}.align-options input{position:absolute;opacity:0}.align-options label:has(input:checked){border-color:var(--blue);background:#f0f9fe;color:var(--navy)}
.range-field{display:block;margin-bottom:12px}.range-field span{display:flex;justify-content:space-between;font-weight:600;font-size:.9rem}.range-field output{color:var(--navy)}.range-field input{width:100%;accent-color:var(--blue)}
.header-preview{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#fff}.header-preview .hp-inner{display:flex;align-items:center;gap:14px;padding:0 14px;min-height:var(--header-h,80px)}.header-preview img{height:var(--logo-h,52px);width:auto}.header-preview .hp-nav{flex:1;display:flex;gap:10px;font-weight:600;font-size:.8rem}.header-preview.nav-center .hp-nav{justify-content:center}.header-preview.nav-right .hp-nav{justify-content:flex-end}.header-preview .hp-cart{background:var(--navy);color:#fff;border-radius:var(--r);padding:6px 10px;font-size:.8rem;font-weight:600}
.field-label{display:block;font-weight:600;font-size:.9rem}
.header-preview .hp-nav span{white-space:nowrap}.header-preview .hp-nav{min-width:0;overflow:hidden}
.admin-tabs{margin-bottom:20px}.tabs-form .tab-pane{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}.tabs-form .tab-pane[hidden]{display:none}.tabs-form .tab-pane>.card:only-child,.tabs-form .tab-pane>.card:has(+.card[hidden]),.tabs-form .tab-pane>.card[hidden]+.card{grid-column:1/-1}.tabs-form .tab-pane>.card{margin:0}
.admin-tabs button.is-active{background:var(--navy);color:#fff}.admin-tabs .tab-dot{width:8px;height:8px;border-radius:50%;background:var(--danger)}
.form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}
@media (max-width:1100px){.tabs-form .tab-pane{grid-template-columns:1fr}}
.tabs-form .card[hidden]{display:none}
.product-card-img{position:relative}
.preorder-badge{display:inline-flex;align-items:center;gap:5px;background:#ea7a00;color:#fff;font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:4px 10px;border-radius:8px;vertical-align:middle}
.preorder-badge.on-img{position:absolute;top:12px;right:12px;font-size:.8rem;padding:6px 12px;box-shadow:0 4px 12px rgba(0,0,0,.15)}.preorder-badge.is-out{background:var(--ink)}
.preorder-badge.small{font-size:.64rem;padding:2px 7px;margin:0 0 0 6px}.preorder-badge.big{font-size:.82rem;padding:7px 14px;margin-bottom:10px}
.preorder-text{display:block;color:#b45f00;font-weight:600}
.btn-preorder{background:#ea7a00;border-color:#ea7a00;color:#fff}.btn-preorder:hover{background:#cc6a00;border-color:#cc6a00;color:#fff}
.preorder-note{display:flex;gap:12px;align-items:flex-start;background:#fff4e5;border:1px solid #f6c48a;border-left:4px solid #ea7a00;border-radius:8px;padding:12px 14px;margin:12px 0;color:#7a4300}
.preorder-note>i{font-size:1.3rem;color:#ea7a00}.preorder-note strong{display:block;color:#7a4300}.preorder-note span{font-size:.9rem}
.preorder-note.is-out{background:#f3f4f6;border-color:#d1d5db;border-left-color:var(--ink);color:var(--text)}.preorder-note.is-out>i,.preorder-note.is-out strong{color:var(--ink)}
.ink-badge.big+.preorder-badge.big,.preorder-badge.big{vertical-align:baseline;margin-left:6px}
.impersonate-bar{background:#ea7a00;color:#fff;font-size:.9rem}.impersonate-inner{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 24px;flex-wrap:wrap}.impersonate-inner i{margin-right:6px}
.impersonate-bar .btn{background:#fff;color:#7a4300;border-color:#fff}.impersonate-bar .btn:hover{background:#fff4e5}
.inline-form{display:inline-flex;margin:0}

/* openingstijden + social media */
.contact-sub{font-size:1rem;margin:22px 0 8px}
.hours{width:100%;border-collapse:collapse;font-size:.95rem}
.hours th,.hours td{padding:8px 12px;text-align:left;border-bottom:1px solid var(--line);font-weight:500}
.hours td{text-align:right;white-space:nowrap}.hours td.closed{color:var(--muted)}
.hours tr:nth-child(even){background:#f5f7fb}
.hours tr.is-today{background:#eaf5fc}.hours tr.is-today th,.hours tr.is-today td{color:var(--navy);font-weight:700}
.hours small{font-weight:500;color:var(--blue)}
.socials{display:flex;gap:8px;flex-wrap:wrap}
.socials a{width:38px;height:38px;border-radius:var(--r);display:flex;align-items:center;justify-content:center;background:var(--bg);color:var(--navy);font-size:1.1rem}
.socials a:hover{background:var(--blue);color:#fff;text-decoration:none}
.footer .socials{margin-top:8px}.footer .socials a{background:#463c9b;color:#fff}.footer .socials a:hover{background:var(--blue)}
.hours-edit input[type=time]{padding:8px 10px;border:1px solid var(--line);border-radius:var(--r);font:inherit;background:#fff;color:var(--ink)}
.hours-edit .switch-row{margin:0}.hours-edit .js-hours-label{min-width:44px;font-weight:600}
.hours-edit tr.is-closed input[type=time]{opacity:.35}
.social-row{display:grid;grid-template-columns:240px 1fr auto;gap:12px;align-items:end;margin-bottom:12px}
@media (max-width:700px){.social-row{grid-template-columns:1fr auto}.social-row .field:first-child{grid-column:1/-1}}

/* flash-meldingen rechtsonder */
.toasts{position:fixed;right:20px;bottom:20px;z-index:1000;display:flex;flex-direction:column;align-items:flex-end;gap:10px;width:min(420px,calc(100% - 40px));pointer-events:none}
.toasts .alert{margin:0;width:100%;pointer-events:auto;box-shadow:0 12px 32px rgba(29,29,27,.16);animation:toast-in .25s ease;transition:opacity .3s,transform .3s}
.toasts .alert.is-hiding{opacity:0;transform:translateY(10px)}
.toast-close{margin-left:auto;background:none;border:0;padding:2px;cursor:pointer;color:inherit;opacity:.7;font-size:.9rem}.toast-close:hover{opacity:1}
@keyframes toast-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.map-card{padding:0;overflow:hidden;position:relative}.map-card iframe{display:block;width:100%;height:340px;border:0}
.map-route{position:absolute;right:14px;top:14px;box-shadow:0 6px 18px rgba(29,29,27,.18)}
/* contactkaarten */
.contact-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.contact-list li{display:flex;gap:14px;align-items:flex-start;line-height:1.5}
.contact-list small,.contact-ids small{display:block;font-size:.75rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:1px}
.contact-icon{flex:0 0 40px;height:40px;border-radius:var(--r);background:#e6f4fb;color:var(--blue);display:flex;align-items:center;justify-content:center;font-size:1.1rem}
.contact-ids{list-style:none;margin:20px 0 0;padding:0;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.contact-ids li{display:flex;align-items:center;gap:12px;padding:12px 14px;background:#fff}
.contact-ids li+li{border-top:1px solid var(--line)}
.contact-ids li:nth-child(even){background:#f5f7fb}
.contact-ids div{flex:1;min-width:0}
.contact-ids strong{display:block;font-size:1rem;letter-spacing:.04em;font-variant-numeric:tabular-nums;color:var(--ink);white-space:nowrap}
.contact-ids-icon{flex:0 0 36px;height:36px;border-radius:var(--r);background:linear-gradient(135deg,var(--navy),var(--blue));color:#fff;display:flex;align-items:center;justify-content:center}
.contact-copy{flex:0 0 34px;height:34px;border:1px solid var(--line);border-radius:var(--r);background:#fff;color:var(--muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.15s}
.contact-copy:hover{color:var(--blue);border-color:var(--blue)}.contact-copy.is-copied{color:#0b6b36;border-color:#bfe7cf;background:#e7f6ee}
.contact-note{display:flex;gap:10px;margin-top:16px;padding:12px 14px;border-radius:var(--r);background:#e6f4fb;color:#075985;font-size:.92rem;line-height:1.5}
.contact-note i{color:var(--blue);margin-top:2px}
.hours-card{padding-bottom:12px}
.hours-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.hours-head .card-title{margin:0}
.hours-status{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;background:#eef0f4;color:var(--muted);font-size:.8rem;font-weight:600}
.hours-status i{font-size:.5rem}.hours-status.is-open{background:#e7f6ee;color:#0b6b36}
.hours-list{list-style:none;margin:0 -24px;padding:0}
.hours-list li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 24px;border-left:4px solid transparent}
.hours-list li:nth-child(even){background:#f5f7fb}
.hours-list li.is-today{background:#eaf5fc;border-left-color:var(--blue);color:var(--navy)}
.hours-list li.is-today>span:first-child{font-weight:700}
.hours-list em{font-style:normal;margin-left:8px;padding:2px 8px;border-radius:999px;background:var(--blue);color:#fff;font-size:.7rem;font-weight:600;vertical-align:2px}
.hours-list strong{font-variant-numeric:tabular-nums;font-weight:600}
.hours-closed{padding:3px 10px;border-radius:999px;background:#eef0f4;color:var(--muted);font-size:.8rem;font-weight:600}
@media (max-width:480px){.contact-ids strong{font-size:.9rem;letter-spacing:0}.contact-ids li{gap:10px;padding:12px}}
/* footer v2 */
.footer{background:#261e6b;color:#c9c5ea;margin-top:60px;font-size:.9rem}
.footer-cta{display:flex;align-items:center;gap:20px;margin-top:36px;padding:24px 28px;border-radius:var(--r);background:linear-gradient(120deg,var(--blue),#4a3fb0 85%);box-shadow:0 14px 34px rgba(0,0,0,.2)}
.footer-cta h3{color:#fff;font-size:1.3rem;margin:0 0 2px}.footer-cta p{margin:0;color:#e0f2fe}
.footer-cta-icon{flex:0 0 54px;height:54px;border-radius:var(--r);background:rgba(255,255,255,.18);color:#fff;font-size:1.6rem;display:flex;align-items:center;justify-content:center}
.footer-cta-actions{margin-left:auto;display:flex;gap:10px;flex-wrap:wrap}
.footer .footer-btn{background:#fff;color:var(--navy);border-color:#fff}.footer .footer-btn:hover{background:var(--light);color:var(--navy)}
.footer .footer-btn-ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.55)}.footer .footer-btn-ghost:hover{background:rgba(255,255,255,.12);color:#fff}
.footer-grid{grid-template-columns:1.5fr 1fr 1.2fr 1fr;gap:40px;padding-top:44px;padding-bottom:44px}
.footer-grid>div{gap:10px}
.footer h4{position:relative;color:#fff;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;margin:0 0 6px;padding-bottom:12px}
.footer h4::after{content:"";position:absolute;left:0;bottom:0;width:28px;height:3px;border-radius:8px;background:var(--sky)}
.footer a{color:#dcdaf3}.footer a:hover{color:#fff;text-decoration:none}
.footer-about p{margin:0;line-height:1.65;max-width:380px}
.footer-badge{display:inline-flex;align-self:flex-start;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;background:rgba(0,180,237,.14);border:1px solid rgba(0,180,237,.4);color:#7dd3fc;font-size:.8rem;font-weight:600}
.footer-links{display:flex;flex-direction:column;gap:4px}
.footer-links a{display:flex;align-items:center;gap:8px;padding:3px 0}
.footer-links i{font-size:.65rem;color:var(--sky);transition:transform .15s}.footer-links a:hover i{transform:translateX(3px)}
.footer-contact,.footer-ids{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.footer-contact{gap:12px}
.footer-contact li{display:flex;gap:12px;align-items:flex-start;line-height:1.5}
.footer-contact li>span{flex:0 0 32px;height:32px;border-radius:var(--r);background:rgba(255,255,255,.08);color:var(--sky);display:flex;align-items:center;justify-content:center}
.footer-more{font-size:.8rem;color:#7dd3fc!important}
.footer-ids li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.09)}
.footer-ids li:first-child{padding-top:2px}
.footer-ids small{color:#a5a0d6;font-size:.78rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.footer-ids strong{color:#fff;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.footer-bottom-wrap{background:rgba(0,0,0,.2)}
.footer-bottom{align-items:center;gap:16px;flex-wrap:wrap;border-top:0;padding-top:16px;padding-bottom:16px;font-size:.84rem}
.pay-chips{display:flex;gap:6px;flex-wrap:wrap}
.pay-chips span{padding:4px 10px;border-radius:8px;background:rgba(255,255,255,.1);color:#fff;font-size:.76rem;font-weight:600}
@media (max-width:1100px){.footer-grid{grid-template-columns:1fr 1fr}.footer-cta{flex-wrap:wrap}.footer-cta-actions{margin-left:0}}
@media (max-width:640px){.footer-grid{grid-template-columns:1fr;gap:28px}.footer-cta{padding:20px}.footer-bottom{flex-direction:column;align-items:flex-start}}
.footer-logo{align-self:flex-start}
/* statistieken */
.stats-filter{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:12px 16px;margin-bottom:8px}
.stats-filter label{display:inline-flex;align-items:center;gap:8px;font-weight:600;margin:0}
.stats-filter input,.stats-filter select{padding:7px 10px;border:1px solid var(--line);border-radius:var(--r);font:inherit;background:#fff;width:auto}
.stats-filter .range{display:flex;align-items:center;gap:8px;margin-left:auto;flex-wrap:wrap}
.stats-filter .btn.is-active{background:var(--navy);color:#fff}
.chip{display:inline-flex;align-items:center;padding:7px 14px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--ink);font-weight:600;font-size:.85rem}
.chip:hover{border-color:var(--blue);text-decoration:none}.chip.is-active{background:var(--navy);border-color:var(--navy);color:#fff}
.stats-period{margin:0 0 16px;font-size:.85rem}
.stat small{display:block;color:var(--muted);font-size:.78rem;margin-top:3px}
.chart{display:flex;align-items:stretch;gap:4px;height:230px;padding-top:8px}
.chart-col{flex:1;display:flex;flex-direction:column;min-width:0}
.chart-stack{flex:1;display:flex;flex-direction:column-reverse;border-bottom:1px solid var(--line)}
.chart-bar{background:linear-gradient(180deg,var(--sky),var(--blue));border-radius:3px 3px 0 0}
.chart-bar.alt{background:var(--light)}
.chart-col:hover .chart-bar{filter:brightness(.9)}
.chart-col span{font-size:.7rem;color:var(--muted);text-align:center;margin-top:6px;white-space:nowrap;overflow:visible}
.legend{display:flex;gap:16px;font-size:.82rem;color:var(--muted)}.legend i{display:inline-block;width:10px;height:10px;border-radius:8px;margin-right:6px;background:var(--blue)}.legend i.alt{background:var(--light)}
.stats-grid{align-items:start;margin-bottom:12px}
.meter-row{margin-bottom:12px}.meter-label{display:flex;justify-content:space-between;gap:10px;font-size:.88rem}
.meter{height:8px;border-radius:999px;background:#eef0f4;overflow:hidden;margin-top:5px}.meter span{display:block;height:100%;background:linear-gradient(90deg,var(--sky),var(--navy));border-radius:999px}
.num{text-align:right!important;font-variant-numeric:tabular-nums;white-space:nowrap}
.rubriek{display:inline-block;min-width:34px;padding:2px 8px;border-radius:8px;background:var(--navy);color:#fff;font-weight:700;font-size:.78rem;text-align:center}
@media (max-width:760px){.stats-filter .range{margin-left:0}.chart{height:170px;gap:2px}.chart-col:not(:first-child):not(:last-child) span{visibility:hidden}}
@media print{.topbar,.header,.footer,.rainbow-line,.admin-side,.account-nav,.no-print,.toasts,.impersonate-bar,.page-head{display:none!important}.admin-layout,.admin-main{display:block!important;margin:0!important;padding:0!important}.card{box-shadow:none!important;break-inside:avoid}body{background:#fff}}
/* compacte tabellen + labels */
.admin-layout .table td{padding:8px 12px}.admin-layout .table th{padding:9px 12px;font-size:.72rem}
.table .badge{gap:6px;padding:2px 9px 2px 8px;border-radius:8px;font-size:.72rem;line-height:1.5;letter-spacing:.01em;box-shadow:inset 0 0 0 1px currentColor;box-shadow:inset 0 0 0 1px color-mix(in srgb,currentColor 22%,transparent)}
.table .badge i{display:none}
.table .badge::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}
.table td small.muted{font-size:.74rem;line-height:1.2}.admin-layout .table td{line-height:1.35}
.table td .bi-truck,.table td .bi-shop{color:var(--muted);margin-right:2px}
/* productgalerij */
.pdp-gallery{min-width:0}.pdp-img{position:relative}
.pdp-slides{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none}
.pdp-slides::-webkit-scrollbar{display:none}
.pdp-slides img{flex:0 0 100%;width:100%;scroll-snap-align:start}
.has-many .pdp-slides img{aspect-ratio:1/1;object-fit:contain;background:#fff}
.pdp-nav{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border-radius:50%;border:0;background:rgba(255,255,255,.94);box-shadow:0 4px 14px rgba(16,24,40,.15);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--navy);font-size:1.1rem;transition:.15s}
.pdp-nav:hover{background:var(--navy);color:#fff}.pdp-nav.prev{left:14px}.pdp-nav.next{right:14px}
.pdp-count{position:absolute;right:14px;bottom:14px;background:rgba(29,29,27,.72);color:#fff;font-size:.75rem;font-weight:600;padding:3px 10px;border-radius:99px}
.pdp-tabs{display:flex;gap:8px;margin-top:12px}
.pdp-tabs button{flex:1;padding:10px 8px;border:2px solid var(--line);border-radius:var(--r);background:#fff;cursor:pointer;font-family:inherit;font-size:.82rem;font-weight:700;color:var(--muted);transition:.15s}
.pdp-tabs button:hover{border-color:var(--blue);color:var(--navy)}
.pdp-tabs button.is-active{border-color:var(--blue);background:rgba(98,176,152,.1);color:var(--navy)}
@media (max-width:760px){.pdp-nav{display:none}.pdp-tabs button{padding:9px 4px;font-size:.76rem}}
.img-manager{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin-bottom:16px}
.img-manager:empty{display:none}
.img-tile{position:relative;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#fff}
.img-tile img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block}
.img-tile:first-child{border-color:var(--blue);box-shadow:0 0 0 2px var(--light)}
.img-main-badge{display:none;position:absolute;top:8px;left:8px;gap:4px;align-items:center;background:var(--navy);color:#fff;font-size:.68rem;font-weight:700;padding:2px 8px;border-radius:8px}
.img-tile:first-child .img-main-badge{display:inline-flex}
.img-tile-actions{display:flex;border-top:1px solid var(--line);background:var(--bg)}
.img-tile-actions button{flex:1;border:0;background:none;padding:7px 0;cursor:pointer;color:var(--ink)}
.img-tile-actions button:hover{background:#e6f4fb;color:var(--blue)}.img-tile-actions .danger:hover{background:#fdecec;color:var(--danger)}
/* statistieken v2 */
.stat{position:relative}
.trend{display:inline-flex;align-items:center;gap:2px;padding:1px 7px;border-radius:8px;font-size:.72rem;font-weight:700}
.trend.up{background:#e7f6ee;color:var(--success)}.trend.down{background:#fdecec;color:var(--danger)}
.chart-wrap{padding-top:10px}
.chart-plot{position:relative;height:230px;margin-left:64px}
.chart-grid div{position:absolute;left:0;right:0;border-top:1px dashed #e3e6ee}
.chart-grid div:first-child{border-top-style:solid}.chart-grid div:last-child{border-top:1px solid var(--line)}
.chart-grid span{position:absolute;right:calc(100% + 10px);top:-.6em;font-size:.7rem;color:var(--muted);white-space:nowrap}
.chart-avg{position:absolute;left:0;right:0;border-top:2px dashed var(--navy);opacity:.55;z-index:1;pointer-events:none}
.chart-avg span{position:absolute;right:0;top:-1.6em;font-size:.68rem;font-weight:700;color:var(--navy);background:#fff;padding:0 4px;border-radius:8px}
.chart-bars{position:absolute;inset:0;display:flex;gap:4px;align-items:stretch;z-index:2}
.chart-bars .chart-col{flex:1;display:flex;flex-direction:column-reverse;position:relative;min-width:0;cursor:default}
.chart-bars .chart-bar{border-radius:3px 3px 0 0}
.chart-bars .chart-col:hover{background:rgba(0,159,227,.06)}
.chart-bars .chart-col:hover::after{content:attr(data-tip);position:absolute;bottom:calc(100% - 6px);left:50%;transform:translateX(-50%);background:var(--ink);color:#fff;font-size:.74rem;line-height:1.45;white-space:pre;padding:7px 10px;border-radius:8px;box-shadow:0 8px 20px rgba(0,0,0,.18);z-index:5;pointer-events:none}
.chart-bars .chart-col:first-child:hover::after{left:0;transform:none}.chart-bars .chart-col:last-child:hover::after{left:auto;right:0;transform:none}
.chart-labels{display:flex;gap:4px;margin:8px 0 0 64px}.chart-labels span{flex:1;min-width:0;font-size:.7rem;color:var(--muted);white-space:nowrap;overflow:visible}
.meter.thin{height:4px;margin-top:6px}
.page-path{display:block;font-size:.72rem}
.ref-icon{width:22px;display:inline-block;color:var(--navy)}
.ink-dot{display:inline-block;width:12px;height:12px;border-radius:50%;margin-right:8px;vertical-align:-1px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.15)}
.donut{width:150px;height:150px;border-radius:50%;margin:4px auto 18px;display:flex;align-items:center;justify-content:center;position:relative}
.donut::before{content:"";position:absolute;inset:22px;border-radius:50%;background:#fff}
.donut span{position:relative;text-align:center;font-size:.75rem;color:var(--muted);line-height:1.2}.donut strong{display:block;font-size:1.3rem;color:var(--ink)}
.legend-dot{display:inline-block;width:9px;height:9px;border-radius:8px;margin-right:6px}
@media (max-width:760px){.chart-plot{height:170px;margin-left:48px}.chart-labels{margin-left:48px}.chart-labels span:not(:first-child):not(:last-child){visibility:hidden}}
.stat strong{display:inline-block}.stat div>span:not(.trend){display:block}
.stat .trend{display:flex;width:fit-content;margin:5px 0 3px}
.stat .trend i{display:inline;width:auto;height:auto;font-size:.7rem;background:none!important;color:inherit!important;border-radius:0}
/* icoontjes met tooltip */
.table .ico-cell{text-align:center;width:1%;white-space:nowrap;padding-left:16px;padding-right:16px}
.ico-badge{position:relative;display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:8px;font-size:1rem;cursor:help;box-shadow:inset 0 0 0 1px color-mix(in srgb,currentColor 20%,transparent);transition:transform .15s}
.ico-badge:hover,.ico-badge:focus{transform:translateY(-1px);outline:none}
.badge-neutral{background:#f1f2f5;color:#5b6170}
.ico-badge[data-tip]::after,.ico-badge[data-tip]::before{position:absolute;left:50%;transform:translateX(-50%);opacity:0;pointer-events:none;transition:opacity .15s;z-index:20}
.ico-badge[data-tip]::after{content:attr(data-tip);bottom:calc(100% + 8px);background:var(--ink);color:#fff;font-size:.74rem;font-weight:600;line-height:1.3;white-space:nowrap;padding:5px 9px;border-radius:8px;box-shadow:0 6px 16px rgba(0,0,0,.18)}
.ico-badge[data-tip]::before{content:"";bottom:calc(100% + 3px);border:5px solid transparent;border-bottom:0;border-top-color:var(--ink)}
.ico-badge:hover::after,.ico-badge:hover::before,.ico-badge:focus::after,.ico-badge:focus::before{opacity:1}
.ico-none{background:none;color:#c3c7d2;box-shadow:none}
/* voortgang bestellingen */
.deliv{display:inline-flex;align-items:center;gap:6px;padding:3px 10px 3px 8px;border-radius:99px;background:#f1f2f5;color:#4b5161;font-size:.78rem;font-weight:600;white-space:nowrap}
.deliv i{color:var(--navy);font-size:.9rem}
.ico-badge.ico-solid{width:26px;height:26px;border-radius:7px;font-size:.86rem;color:var(--tone);background:color-mix(in srgb,var(--tone) 9%,#fff);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--tone) 35%,transparent);transition:background .15s}
.ico-badge.ico-solid:hover,.ico-badge.ico-solid:focus{background:color-mix(in srgb,var(--tone) 16%,#fff)}
.tone-success{--tone:#16a34a}.tone-info{--tone:#009fe3}.tone-primary{--tone:#312783}.tone-warning{--tone:#d97706}.tone-danger{--tone:#dc2626}.tone-muted,.tone-neutral{--tone:#8a90a0}.tone-uv{--tone:#7c3aed}
.ico-badge.ink-ico{width:auto;padding:0 9px 0 7px;gap:5px;font-size:.72rem;font-weight:700;letter-spacing:.04em}
.ico-badge.ico-label{width:auto;padding:0 10px 0 8px;gap:6px;font-size:.76rem;font-weight:600;white-space:nowrap;cursor:default}.ico-label i{font-size:.85rem}.ink-ico i{font-size:.85rem}

.auth-body{background:#f4f6fb;min-height:100vh}
.auth-split{display:grid;grid-template-columns:minmax(380px,44%) 1fr;min-height:100vh}
.auth-brand{position:relative;display:flex;flex-direction:column;padding:44px 56px;color:#fff;background:radial-gradient(circle at 85% 15%,rgba(0,180,237,.45),transparent 45%),radial-gradient(circle at 10% 90%,rgba(0,159,227,.35),transparent 50%),linear-gradient(150deg,#312783,#1f1a5c);overflow:hidden}
.auth-brand .rainbow-line{position:absolute;top:0;left:0;right:0}
.auth-brand::after{content:"";position:absolute;right:-120px;bottom:-120px;width:360px;height:360px;border-radius:50%;border:40px solid rgba(255,255,255,.05)}
.auth-logo img{height:46px}
.auth-pitch{margin:auto 0;max-width:440px}
.auth-tag{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:8px;background:rgba(255,255,255,.12);box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);font-size:.8rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.auth-pitch h2{font-size:2.3rem;line-height:1.15;margin:18px 0 26px;color:#fff}
.auth-pitch ul{list-style:none;padding:0;margin:0;display:grid;gap:14px}
.auth-pitch li{display:flex;align-items:center;gap:12px;color:#dfe6ff}
.auth-pitch li i{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:8px;background:rgba(255,255,255,.1);color:var(--sky,#00b4ed);font-size:1rem;flex:none}
.auth-foot{color:#aab2dc;position:relative;z-index:1}.auth-foot a{color:#dfe6ff}
.auth-main{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 24px;position:relative}
.auth-back{position:absolute;top:28px;left:32px;display:inline-flex;align-items:center;gap:8px;color:var(--muted);font-weight:600;font-size:.9rem}
.auth-back:hover{color:var(--navy)}
.auth-box{width:100%;max-width:460px;background:#fff;border-radius:8px;padding:36px 36px 28px;box-shadow:0 20px 50px -20px rgba(49,39,131,.25),0 0 0 1px rgba(16,24,40,.05)}
.auth-split:has(form[action="/registreren"]) .auth-box{max-width:560px}
.auth-head{margin-bottom:22px}
.auth-ico{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:8px;background:linear-gradient(135deg,#00b4ed,#312783);color:#fff;font-size:1.3rem;margin-bottom:14px}
.auth-head h1{font-size:1.6rem;margin:0 0 6px}
.auth-head p{color:var(--muted);margin:0;font-size:.95rem}
.auth-form{display:grid;gap:4px}
.auth-form .form-links{text-align:center;margin:14px 0 0;color:var(--muted)}
@media (max-width:900px){
.auth-split{grid-template-columns:1fr;min-height:0}
.auth-brand{padding:22px 20px 20px}.auth-brand::after,.auth-pitch ul,.auth-foot{display:none}
.auth-pitch{margin:16px 0 0}.auth-pitch h2{font-size:1.35rem;margin:12px 0 0}.auth-logo img{height:36px}
.auth-main{padding:16px 14px 40px;justify-content:flex-start}
.auth-back{position:static;align-self:flex-start;margin:0 0 14px}
.auth-box{padding:24px 20px}
}
.tabs-form .form-actions[hidden]{display:none}
.card-head-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}.card-head-row .card-title{margin-bottom:2px}.card-head-row p{margin:0}

.page-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: inherit;
}

.page-link i {
    color: var(--blue, #009fe3);
}

.table .nowrap {
    white-space: nowrap;
}

.account-nav {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(0, 1fr);
}

.account-nav > a,
.account-nav > button,
.account-nav > form button {
    justify-content: center;
    white-space: nowrap;
}

.account-nav > form {
    display: flex;
    margin-left: 0;
}

.account-nav > form button {
    flex: 1;
}

@media (max-width: 1000px) {
    .account-nav {
        grid-auto-flow: row;
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .account-nav {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .account-nav > a,
    .account-nav > button,
    .account-nav > form button {
        padding: 9px 8px;
        white-space: normal;
        text-align: center;
    }
}

.maintenance-bar {
    background: #b45309;
    color: #fff;
    font-size: .9rem;
}

.maintenance-bar .btn {
    background: #fff;
    color: #7a3a00;
    border-color: #fff;
}

.maintenance-bar i {
    margin-right: 6px;
}

.auth-maintenance {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    margin-bottom: 18px;
    padding: 10px 12px;
    border-radius: 8px;
    background: #fff7ed;
    border: 1px solid #fed7aa;
    color: #9a3412;
    font-size: .88rem;
}

.auth-maintenance strong {
    display: block;
}

.maintenance {
    position: fixed;
    inset: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 18px;
    padding: 40px 16px;
    background: linear-gradient(135deg, #00b4ed 0%, #009fe3 45%, #312783 100%);
}

.maintenance > .rainbow-line {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}

.maintenance-box {
    width: 100%;
    max-width: 520px;
    background: #fff;
    border-radius: 8px;
    padding: 36px 32px 28px;
    text-align: center;
    box-shadow: 0 30px 60px -25px rgba(20, 15, 70, .55);
}

.maintenance-logo {
    height: 44px;
    margin: 0 auto 22px;
    display: block;
}

.maintenance-icon {
    width: 56px;
    height: 56px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #e6f6fd;
    color: var(--blue);
    font-size: 1.6rem;
    margin-bottom: 12px;
}

.maintenance-box h1 {
    font-size: 1.5rem;
    margin: 0 0 10px;
    color: var(--ink);
}

.maintenance-box p {
    color: var(--muted);
    margin: 0 0 10px;
}

.maintenance-contact {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin: 18px 0 20px;
}

.maintenance-contact a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    border-radius: 8px;
    background: var(--bg);
    color: var(--navy);
    font-weight: 600;
}

.maintenance-login {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: .85rem;
    color: var(--muted);
}

.maintenance-foot {
    color: rgba(255, 255, 255, .8);
}

.btn-account {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
    transition: border-color .15s, box-shadow .15s;
}

.btn-account:hover {
    border-color: var(--light);
    box-shadow: 0 4px 14px -6px rgba(0, 159, 227, .45);
    text-decoration: none;
}

.btn-account-icon {
    width: 31px;
    height: 31px;
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--sky), var(--navy));
    color: #fff;
    font-size: 1.05rem;
}

.header-actions .btn-cart,
.header-actions .btn-account {
    height: 42px;
}

.header-actions .btn-account {
    width: 42px;
}

.header-actions .btn-account-icon {
    width: 32px;
    height: 32px;
}

@media (max-width: 640px) {
    .header-actions .btn-cart {
        width: 42px;
        padding: 0;
    }

    .header-actions .cart-count {
        position: absolute;
        top: -7px;
        right: -7px;
        margin: 0;
        border: 2px solid #fff;
    }
}
/* instellingen: kaarten als uitklapblokken over de volle breedte */
.tabs-form .tab-pane{grid-template-columns:minmax(0,1fr);gap:12px}

.account-nav>.tab-dd{position:relative;display:flex;min-width:0}
.account-nav>.tab-dd>button{flex:1;min-width:0;justify-content:center;white-space:nowrap}
.tab-caret{font-size:11px;opacity:.7;transition:transform .15s}
.tab-dd.is-open .tab-caret{transform:rotate(180deg)}
.tab-menu{display:none;position:absolute;top:calc(100% + 6px);left:0;z-index:30;min-width:100%;width:max-content;max-width:min(320px,90vw);padding:6px;background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:0 12px 32px rgba(49,39,131,.14)}
.tab-dd.is-open .tab-menu{display:block}
.account-nav .tab-menu button{display:flex;width:100%;justify-content:flex-start;padding:9px 12px;white-space:normal;text-align:left;font-weight:500}
.admin-tabs .tab-menu button.is-active{background:#e6f6fd;color:var(--navy);font-weight:600}
@media (max-width:600px){.account-nav>.tab-dd>button{padding:9px 8px;white-space:normal}.tab-menu{width:100%;min-width:0}}

/* ===== ZokkoKids: kinder-look extra's ===== */
.hero-clouds i{position:absolute;background:#fff;border-radius:99px;opacity:.5;pointer-events:none}
.hero-clouds i:nth-child(1){width:140px;height:44px;top:12%;left:6%}
.hero-clouds i:nth-child(2){width:90px;height:30px;top:24%;left:44%}
.hero-clouds i:nth-child(3){width:170px;height:52px;bottom:18%;right:8%}
.hero-clouds i:nth-child(4){width:70px;height:24px;top:8%;right:24%}
.hero-clouds i:nth-child(5){width:110px;height:36px;bottom:10%;left:26%}
.hero-visual img{filter:drop-shadow(0 24px 32px rgba(20,40,80,.3));animation:bob 5s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0) rotate(-1.5deg)}50%{transform:translateY(-14px) rotate(1.5deg)}}
.cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:18px}
.cat-card{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:26px 18px;margin:0;transition:.15s}
.cat-card:hover{transform:translateY(-3px);border-color:var(--sky);text-decoration:none}
.cat-icon{width:64px;height:64px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:1.7rem;color:#fff;background:linear-gradient(150deg,var(--sky),var(--blue));box-shadow:0 5px 14px rgba(78,168,232,.35)}
.cat-card:nth-child(4n+2) .cat-icon{background:linear-gradient(150deg,var(--sunny),var(--coral));box-shadow:0 5px 14px rgba(255,123,107,.3)}
.cat-card:nth-child(4n+3) .cat-icon{background:linear-gradient(150deg,var(--mint),#3FBF8F);box-shadow:0 5px 14px rgba(123,216,176,.35)}
.cat-card:nth-child(4n+4) .cat-icon{background:linear-gradient(150deg,var(--pink),#4E9C86);box-shadow:0 5px 14px rgba(142,211,190,.35)}
.cat-card strong{font-family:'Caveat Brush','Baloo 2';font-size:1.05rem;color:var(--ink)}
.cat-card small{color:var(--muted)}
.cat-count{font-size:.74rem;font-weight:800;color:var(--blue);background:#EAF4FE;border-radius:99px;padding:3px 10px}
.cat-filter{display:flex;flex-wrap:wrap;gap:8px;padding:14px 16px}
.cat-filter a{display:inline-flex;align-items:center;gap:7px;padding:8px 16px;border-radius:99px;font-weight:700;font-size:.9rem;color:var(--ink);border:1px solid var(--line);background:#fff}
.cat-filter a:hover{border-color:var(--sky);text-decoration:none}
.cat-filter a.is-active{background:var(--navy);color:#fff;border-color:var(--navy)}
.cat-filter .cat-n{font-size:.7rem;background:rgba(0,0,0,.06);border-radius:99px;padding:1px 8px}
.cat-filter a.is-active .cat-n{background:rgba(255,255,255,.2)}
.steps-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}
.step-card{position:relative;text-align:center;padding:34px 22px;margin:0}
.step-card i{font-size:2.2rem;color:var(--coral);display:block;margin-bottom:12px}
.step-card:nth-child(2) i{color:var(--blue)}.step-card:nth-child(3) i{color:#3FBF8F}
.step-card strong{font-family:'Caveat Brush','Baloo 2';font-size:1.15rem;display:block;margin-bottom:8px;color:var(--ink)}
.step-card p{color:var(--muted);font-size:.92rem;margin:0}
.step-num{position:absolute;top:14px;left:14px;width:34px;height:34px;border-radius:50%;background:var(--sunny);color:#7A4A00;font-family:'Baloo 2';font-weight:700;display:flex;align-items:center;justify-content:center}
/* naam-ontwerper */
.designer{border:2px dashed #F3C9BE;border-radius:var(--r);background:#FFF8F2;padding:18px;margin:18px 0}
.designer-title{display:flex;align-items:center;gap:8px;font-size:1rem;color:var(--coral);margin-bottom:14px}
.designer-field{display:block;margin-bottom:14px}
.designer-field>span{display:block;font-weight:800;font-size:.85rem;color:var(--ink);margin-bottom:7px}
.designer-field input[type=text]{width:100%;font:inherit;font-weight:700;padding:11px 14px;border:1.5px solid var(--line);border-radius:8px;outline:none}
.designer-field input[type=text]:focus{border-color:var(--coral)}
.designer-field small{color:var(--muted)}
.font-picker{display:flex;flex-wrap:wrap;gap:8px}
.font-opt{cursor:pointer}
.font-opt input{position:absolute;opacity:0;pointer-events:none}
.font-opt .font-sample{display:flex;width:56px;height:56px;border-radius:8px;border:2px solid var(--line);background:#fff;align-items:center;justify-content:center;font-size:1.5rem;color:var(--ink)}
.font-opt small{display:block;text-align:center;font-size:.66rem;color:var(--muted);margin-top:3px;max-width:56px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.font-opt input:checked+.font-sample{border-color:var(--coral);background:#EDF7F3;box-shadow:0 0 0 3px #CDEFEA}
.color-picker{display:flex;gap:8px;flex-wrap:wrap}
.color-opt{cursor:pointer;position:relative}
.color-opt input{position:absolute;opacity:0;pointer-events:none}
.color-opt i{display:block;width:34px;height:34px;border-radius:50%;background:var(--c);border:3px solid #fff;box-shadow:0 0 0 2px var(--line)}
.color-opt input:checked+i{box-shadow:0 0 0 3px var(--c)}
.option-group .opt-picker{display:flex;flex-wrap:wrap;gap:8px;max-height:150px;overflow:auto}
.opt-pill{cursor:pointer}
.opt-pill input{position:absolute;opacity:0;pointer-events:none}
.opt-pill span{display:inline-block;padding:7px 15px;border-radius:99px;border:1.5px solid var(--line);font-weight:700;font-size:.86rem;background:#fff}
.opt-pill input:checked+span{border-color:var(--blue);background:#EAF4FE;color:#2C6FB5}
.opt-pill.is-soldout{opacity:.5;cursor:not-allowed}
.opt-pill.is-soldout span{text-decoration:line-through;background:#F4F6F8}
.opt-pill span em{font-style:normal;font-size:.72rem;font-weight:600;color:#8AA0AD;margin-left:3px}
.pdp-preview{position:absolute;pointer-events:none;z-index:3}
.pdp-preview-text{display:block;font-weight:700;white-space:nowrap;text-shadow:0 1px 2px rgba(255,255,255,.4)}
.pdp-note{display:flex;gap:8px;align-items:center;margin:10px 0 0;padding:9px 12px;font-size:.82rem;font-weight:500;border-radius:9px;background:#e6f4fb;color:#075985;border:1px solid #bae0f3}
.pdp-note i{font-size:.95rem;flex:0 0 auto}
.pdp-desc{margin-top:16px}
.perso-line{display:block;color:var(--coral);font-weight:600}
.card-tags{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.empty{text-align:center;padding:60px 24px;color:var(--muted)}
.empty i{font-size:3rem;color:var(--sky);display:block;margin-bottom:14px}
@media (max-width:900px){.hero-inner{grid-template-columns:1fr}.hero-visual{max-width:340px;margin:0 auto}}
.check-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:6px 14px;margin:6px 0}
.menu-rows .row-4{display:grid;grid-template-columns:70px 1.2fr 2fr auto;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line)}
.font-preview{font-size:1.6rem;color:var(--ink)}


/* ===== ZokkoKids Kidupia-thema (overrides) ===== */
:root{--coral:#62B098;--primary:#62B098;--primary-d:#4E9C86;--navy:#25303B;--ink:#25303B;--text:#4A5560;--muted:#8A94A0;--line:#E9ECEF;--bg:#FFFFFF;--card:#fff;--blue:#5BB4D9;--sky:#8FD0E8;--sunny:#FFC94D;--mint:#7BD8B0;--pink:#8ED3BE;--r:12px;--shadow:0 2px 14px rgba(37,48,59,.07);--c:#62B098;--m:#25303B}
body{background:#fff;background-image:none;color:var(--text)}
h1,h2,h3,h4{font-family:'Caveat Brush','Baloo 2',sans-serif;font-weight:400;color:var(--ink)}
h1{letter-spacing:0}
/* topbar: hot pink */
.topbar{background:var(--primary);color:#fff;font-size:.82rem;font-weight:600}
.topbar i{color:#fff}
/* header: clean white */
.header{border-bottom:1px solid var(--line)}
.mainnav a{font-family:'Baloo 2',sans-serif;font-weight:500;font-size:1rem;color:var(--ink);border:none;padding:8px 14px;position:relative}
.mainnav a:hover{background:none;color:var(--primary);border-color:transparent;text-decoration:none}
.mainnav a.is-active{background:none;color:var(--primary);box-shadow:none;border-color:transparent}
.mainnav a.is-active:after{content:"";position:absolute;left:14px;right:14px;bottom:2px;height:3px;border-radius:8px;background:var(--primary)}
/* zoekbalk header */
.hsearch{display:flex;flex:0 1 340px;margin:0 8px}
.hsearch input{flex:1;font:inherit;font-size:.9rem;border:1px solid var(--line);background:#F7F8FA;border-radius:99px 0 0 99px;padding:9px 16px;outline:none;color:var(--ink)}
.hsearch input:focus{border-color:var(--primary)}
.hsearch button{border:1px solid var(--primary);border-left:0;background:var(--primary);color:#fff;border-radius:0 99px 99px 0;padding:0 16px;font-size:1rem;cursor:pointer}
@media (max-width:900px){.hsearch{display:none}}
/* knoppen: flat, klein, uppercase */
.btn{font-family:'Baloo 2',sans-serif;font-weight:600;letter-spacing:.04em;text-transform:uppercase;font-size:.82rem;border-radius:8px;padding:11px 22px;border:none;box-shadow:none;transition:.15s}
.btn-lg{padding:13px 26px;font-size:.9rem}.btn-sm{padding:7px 14px;font-size:.72rem}
.btn-primary{background:var(--primary);color:#fff;border:none;box-shadow:none}
.btn-primary:hover{background:#3A8570;transform:none;box-shadow:none;color:#fff}
.btn-primary:active{transform:none}
.btn-dark{background:var(--navy);color:#fff;border:none;box-shadow:none}
.btn-dark:hover{background:#37475A;transform:none;box-shadow:none}
.btn-light{background:#F4F5F7;color:var(--ink);border:none;box-shadow:none}
.btn-light:hover{background:#ECEEF2;transform:none;box-shadow:none}
.btn-danger{background:#fff;color:var(--danger);border:1px solid #f2c9c9}
.btn-icon{border-radius:8px}
.cart-count{background:var(--primary);border:none}
/* kaarten: schoon wit */
.card{border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow)}
.card-title{font-family:'Caveat Brush','Baloo 2',sans-serif}
/* hero: zachtblauw vlak */
.hero{background:#DCEEF5;color:var(--ink)}
.hero:before{display:none}
.hero-inner{grid-template-columns:1fr 1fr;padding-top:0;padding-bottom:0;gap:0}
.hero-text{padding:64px 48px 64px 0}
.hero h1{color:var(--ink);font-weight:600}
.hero p{color:#5A6B77}
.hero .grad{background:none;color:var(--primary);-webkit-text-fill-color:var(--primary);transform:none;box-shadow:none;padding:0;border-radius:0}
.hero .usp{color:var(--ink);font-size:.92rem}
.hero .usp i{color:var(--primary)}
.hero .perso-badge.big{background:none;border:none;color:var(--primary);backdrop-filter:none;text-transform:uppercase;letter-spacing:.14em;font-size:.78rem;padding:0;margin-bottom:6px}
.hero .btn-light{background:#fff;color:var(--ink);border:none;box-shadow:none}
.hero .btn-light:hover{background:var(--ink);color:#fff;transform:none;box-shadow:none}
.hero .btn-primary{background:var(--primary);color:#fff;border:none;box-shadow:none}
.hero .btn-primary:hover{background:#3A8570;transform:none;box-shadow:none}
.hero-visual{align-self:stretch;display:flex;align-items:flex-end;justify-content:center}
.hero-visual img{max-height:340px;width:auto;filter:none;transform:none;animation:none;background:transparent;padding:0;border:none;border-radius:0;box-shadow:none}
.hero-clouds{display:none}
/* section heads: clean */
.section-head{border:none;box-shadow:none;padding:0 0 18px;background:none}
.section-head.card{border:1px solid var(--line);box-shadow:var(--shadow);background:var(--card);border-radius:var(--r);padding:16px 22px}
.rel-head h2{display:flex;align-items:center;gap:9px}
.rel-head h2 i{color:var(--primary)}
.rel-nav{display:flex;gap:8px}
.rel-btn{width:36px;height:36px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--muted);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:1rem;transition:.15s}
.rel-btn:hover{border-color:var(--primary);color:var(--primary)}
.rel-carousel{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px 2px 14px;margin-bottom:20px;scrollbar-width:thin;scrollbar-color:#C9D8D2 transparent}
.rel-carousel .product-card{flex:0 0 264px;scroll-snap-align:start;margin-bottom:0}
@media (max-width:760px){.rel-carousel .product-card{flex:0 0 78%}}
.eyebrow{font-family:'Baloo 2',sans-serif;font-size:.78rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--primary);transform:none}
.page-icon{border-radius:8px;background:linear-gradient(150deg,var(--primary),#4E9C86);transform:none;box-shadow:0 6px 16px rgba(98,176,152,.28)}
/* productkaarten: clean */
.product-card{border-radius:8px}
.product-card:hover{border-color:#BDE8DC;transform:translateY(-3px) rotate(0);box-shadow:0 10px 26px rgba(37,48,59,.10)}
.product-card-img{border-bottom:1px solid var(--line);background:#F7F9FA}
.prod-badge.on-img{transform:none;border:none;border-radius:8px}
.perso-badge{background:#EDF7F3;border:none;color:var(--primary);transform:none;letter-spacing:.08em}
.cat-chip{background:#F2F4F6;color:#5A6B77;border:none}
/* categorieën: ronde bubbels */
.cat-card{background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow)}
.cat-card:hover{border-color:#BDE8DC;transform:translateY(-3px);box-shadow:0 10px 24px rgba(37,48,59,.10)}
.cat-icon{border-radius:50%;border:none;background:#EDF7F3;color:var(--primary);box-shadow:none;font-size:1.6rem}
.cat-card:nth-child(4n+2) .cat-icon{background:#FFF3D6;color:#C98A00;box-shadow:none}
.cat-card:nth-child(4n+3) .cat-icon{background:#DEF5EA;color:#1E8E5A;box-shadow:none}
.cat-card:nth-child(4n+4) .cat-icon{background:#E3F0FA;color:#2C6FB5;box-shadow:none}
.cat-card strong{font-family:'Caveat Brush','Baloo 2',sans-serif}
.cat-count{background:#F2F4F6;color:#5A6B77;border:none}
/* filterchips: clean */
.cat-filter{border:none;box-shadow:none;padding:0 0 16px;background:none}
.cat-filter a{border:1px solid var(--line);font-weight:600}
.cat-filter a:hover{border-color:var(--primary);color:var(--primary)}
.cat-filter a.is-active{background:var(--primary);color:#fff;border-color:var(--primary);box-shadow:none}
/* stappen */
.step-card{border-radius:8px}
.step-num{background:var(--primary);color:#fff;border:none}
.step-card:nth-child(2) .step-num{background:var(--sky);color:#0B4A6B}
.step-card:nth-child(3) .step-num{background:var(--mint);color:#14532D}
/* designer zachtroze */
.designer{border:1px dashed #BDE8DC;border-radius:8px;background:#FFF5F9}
.designer-title{color:var(--primary)}
.font-opt input:checked+.font-sample{border-color:var(--primary);background:#EDF7F3;box-shadow:0 0 0 3px #BDE8DC}
/* inputs */
.field input,.field select,.field textarea{border:1px solid #DDE2E8;border-radius:8px}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px #BDE8DC}
.qty-input{border:1px solid var(--line);border-radius:8px}
.free-bar{border:none;height:8px}
.free-bar div{background:linear-gradient(90deg,var(--primary),#8ED3BE)}
/* prijs */
.price strong{color:var(--primary)}
/* footer: licht + pink */
.footer{background:#F7F8FA;color:var(--text);margin-top:48px;border-top:1px solid var(--line)}
.footer:before{display:none}
.footer h4{color:var(--ink)}
.footer a{color:#5A6B77}.footer a:hover{color:var(--primary)}
.footer p{color:#5A6B77}
.footer-grid>div strong{color:var(--ink)}
.footer-grid .footer-contact li>span{color:var(--primary)}
.footer-ids small{color:var(--muted)}
.footer-ids strong{color:var(--ink)}
.footer-cta{background:var(--navy);border:none;border-radius:8px;box-shadow:none}
.footer .footer-btn{background:var(--primary);color:#fff;border:none;box-shadow:none}
.footer .footer-btn:hover{background:#fff;color:var(--primary);transform:none;box-shadow:none}
.footer .footer-btn-ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.4)}
.footer .footer-btn-ghost:hover{background:rgba(255,255,255,.1);color:#fff}
.footer-badge{background:#EDF7F3;border:none;color:var(--primary)}
.footer .socials a{background:#fff;color:var(--ink);border:1px solid var(--line)}
.footer .socials a:hover{background:var(--primary);color:#fff}
.footer-bottom{border-top:1px solid var(--line);color:var(--muted)}
.footer-bottom a{color:#5A6B77}
.hero-text{padding:64px 0 64px 56px}
.rainbow-line{display:none}
@media (max-width:1100px){.hero-text{padding:32px 0}}
/* sectietitels */
.sec-title{margin-bottom:20px}
.sec-title h2{margin:0 0 4px;font-size:1.6rem}
.sec-title p{margin:0;color:var(--muted)}
.sec-title.row{display:flex;justify-content:space-between;align-items:flex-end;gap:16px}
/* promo-banners */
.promo-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding-top:24px}
.promo-card{display:flex;align-items:center;gap:14px;border-radius:8px;padding:20px 24px;position:relative;overflow:hidden;min-height:150px}
.promo-card:hover{text-decoration:none}
.promo-blue{background:#DCEEF5}
.promo-pink{background:#EDF7F3}
.promo-label{position:absolute;top:14px;right:18px;font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.promo-body{display:flex;flex-direction:column;gap:4px;z-index:1}
.promo-body strong{font-family:'Caveat Brush','Baloo 2',sans-serif;font-size:1.15rem;color:var(--ink)}
.promo-body>span{color:#5A6B77;font-size:.88rem}
.promo-btn{display:inline-flex;align-items:center;gap:6px;margin-top:8px;background:var(--primary);color:#fff;font-size:.78rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:8px 14px;border-radius:8px;width:max-content}
.promo-card:hover .promo-btn{background:var(--ink)}
.promo-img{margin-left:auto}
.promo-img img{width:130px;height:130px;object-fit:cover;border-radius:8px}
/* scroller */
.scroller{position:relative}
.scr-track{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:4px 2px}
.scr-track::-webkit-scrollbar{display:none}
.scr-track>*{scroll-snap-align:start;flex:0 0 auto}
.scr-btn{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--ink);font-size:1rem;cursor:pointer;box-shadow:var(--shadow);display:flex;align-items:center;justify-content:center}
.scr-btn:hover{background:var(--primary);color:#fff;border-color:var(--primary)}
.scr-btn:disabled{opacity:.35;cursor:default}
.scr-prev{left:-14px}.scr-next{right:-14px}
/* categorie-bubbels */
.cat-strip{padding-top:8px;padding-bottom:8px}
.cat-bubble{display:flex;flex-direction:column;align-items:center;gap:8px;width:150px;padding:8px 6px;text-align:center}
.cat-bubble:hover{text-decoration:none}
.cat-bubble .cat-icon{width:84px;height:84px;font-size:2rem}
.cat-bubble strong{font-family:'Caveat Brush','Baloo 2',sans-serif;font-size:.98rem;color:var(--ink)}
.cat-bubble small{color:var(--muted);font-size:.78rem}
.cat-bubble:hover strong{color:var(--primary)}
/* product-strip */
.prod-strip .product-card{flex:0 0 250px}
/* feature-strip */
.feat-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--line);border-radius:8px;background:#fff;margin-top:6px}
.feat-strip>div{display:flex;align-items:center;gap:14px;padding:20px 22px}
.feat-strip>div+div{border-left:1px solid var(--line)}
.feat-strip i{font-size:1.7rem;color:var(--primary);flex:0 0 auto}
.feat-strip strong{display:block;font-family:'Caveat Brush','Baloo 2',sans-serif;font-size:.95rem;color:var(--ink)}
.feat-strip span{font-size:.82rem;color:var(--muted)}
.feat-strip a{color:var(--primary)}
/* shop met zijbalk */
.shop-layout{display:grid;grid-template-columns:260px 1fr;gap:26px;align-items:start}
.shop-side{position:static;padding:20px;margin:0}
.shop-side h4{display:flex;align-items:center;gap:8px;font-size:1rem;margin-bottom:12px}
.shop-side h4 i{color:var(--primary)}
.side-cats{display:flex;flex-direction:column}
.side-cats a{display:flex;justify-content:space-between;align-items:center;padding:9px 10px;border-radius:8px;color:var(--text);font-size:.94rem;font-weight:500}
.side-cats a span{font-size:.75rem;color:var(--muted);background:#F2F4F6;border-radius:99px;padding:2px 9px}
.side-cats a:hover{background:#EDF7F3;color:var(--primary);text-decoration:none}
.side-cats a.is-active{background:var(--primary);color:#fff}
.side-cats a.is-active span{background:rgba(255,255,255,.25);color:#fff}
.side-note{margin-top:18px;border-top:1px solid var(--line);padding-top:16px}
.side-note i{color:var(--primary);font-size:1.2rem}
.side-note strong{display:block;margin:6px 0 2px;color:var(--ink)}
.side-note p{margin:0;font-size:.82rem;color:var(--muted)}
@media (max-width:1100px){
 .promo-grid{grid-template-columns:1fr}
 .feat-strip{grid-template-columns:1fr 1fr}
 .feat-strip>div+div{border-left:none}
 .shop-layout{grid-template-columns:1fr}
 .shop-side{order:2}
}
@media (max-width:700px){.feat-strip{grid-template-columns:1fr}.promo-img img{width:96px;height:96px}}
/* rustige sectiebanden */
.band{position:relative}
.band .section{position:relative;z-index:1}
.band-sky{background:#EAF6FB}
.band-sun{background:#FFF7E0}
.band-candy{background:#FDE9F2}
/* rustige home-secties */
.sec-title.center{text-align:center}
.sec-title.center p{max-width:520px;margin:0 auto}
.cat-row{display:flex;flex-wrap:wrap;justify-content:center;gap:26px}
.step-card{background:#fff;border-radius:8px;box-shadow:var(--shadow);border:1px solid rgba(37,48,59,.04)}
/* roze verloop-titels overal */
.page-head h1,.sec-title h2,.section-head h2,.pdp-buy h1,.about-text h2{
 background:linear-gradient(95deg,#7CC4AE,var(--primary) 55%,#2E7A66);
 -webkit-background-clip:text;background-clip:text;
 -webkit-text-fill-color:transparent;color:transparent}
.page-icon{background:linear-gradient(160deg,#8ED3BE,var(--primary) 60%,#2E7A66)}
/* strakke stapel: alle secties recht onder elkaar in de container */
.section{padding-top:30px;padding-bottom:30px}
.band .section{padding-top:34px;padding-bottom:34px}
.sec-title{margin-bottom:18px}
/* hero-mok: groter, links onder het logo, zonder cirkel */
.hero-visual{position:relative;display:block}
.hero-visual img{position:absolute;left:20px;top:50%;transform:translateY(-50%);width:min(360px,82%);max-height:none;height:auto;z-index:1;filter:drop-shadow(0 16px 26px rgba(37,48,59,.18))}
@media (max-width:900px){.hero-visual{min-height:300px}}
/* spaar-banner op home */
.promo-banner{display:block;border-radius:8px;overflow:hidden;box-shadow:0 14px 30px rgba(37,48,59,.12)}
.promo-banner:hover{transform:translateY(-3px);box-shadow:0 18px 36px rgba(37,48,59,.16);transition:.2s}
.promo-banner img{width:100%;height:auto;display:block}
/* titel-card met roze verloop */
.title-card{position:relative;overflow:hidden;background:linear-gradient(115deg,var(--primary),#4E9C86 55%,#2E7A66);border:none;border-radius:8px;padding:26px 30px;box-shadow:0 14px 30px rgba(98,176,152,.28)}
.title-card::before{content:"";position:absolute;top:-60%;left:-8%;width:55%;height:220%;background:radial-gradient(closest-side,rgba(255,255,255,.30),transparent);pointer-events:none}
.title-card .eyebrow{color:rgba(255,255,255,.85)}
.title-card h2{-webkit-text-fill-color:#fff;color:#fff;background:none;font-size:1.6rem}
.title-card p{color:rgba(255,255,255,.82)}
.title-deco{position:absolute;right:24px;top:50%;transform:translateY(-50%) rotate(8deg);width:84px;height:84px;object-fit:contain;opacity:.9;filter:drop-shadow(0 6px 10px rgba(0,0,0,.2));pointer-events:none}
/* sidebar breder */
.shop-layout{grid-template-columns:310px 1fr}
@media (max-width:900px){.shop-layout{grid-template-columns:1fr}}
/* home opsmukken */
.hero{border-radius:0 0 44px 44px;overflow:hidden}
.hero-deco i{position:absolute;z-index:0;color:var(--primary);opacity:.18;font-size:2rem;animation:decoBob 6s ease-in-out infinite;pointer-events:none}
.hero-deco i:nth-child(1){top:16%;left:6%}
.hero-deco i:nth-child(2){top:10%;left:46%;color:#FFC24B;font-size:1.4rem;animation-delay:1s}
.hero-deco i:nth-child(3){bottom:18%;left:44%;color:#4EA8E8;font-size:1.8rem;animation-delay:2s}
.hero-deco i:nth-child(4){bottom:12%;left:8%;color:#8ED3BE;font-size:1.5rem;animation-delay:.5s}
.hero-deco i:nth-child(5){top:72%;right:5%;color:#7BD8B0;font-size:2.3rem;animation-delay:1.5s}
@keyframes decoBob{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-14px) rotate(6deg)}}
.hero .usp li{background:#fff;border-radius:99px;padding:7px 15px;font-size:.85rem;box-shadow:0 4px 12px rgba(37,48,59,.07)}
/* categorie-bubbels: pastel afwisselend + lift bij hover */
.cat-bubble .cat-icon{transition:transform .2s,box-shadow .2s}
.cat-bubble:hover .cat-icon{transform:translateY(-5px) scale(1.05);box-shadow:0 12px 22px rgba(37,48,59,.14)}
.cat-bubble:nth-child(4n+2) .cat-icon{background:#FFF3D6;color:#C98A00}
.cat-bubble:nth-child(4n+3) .cat-icon{background:#DEF5EA;color:#1E8E5A}
.cat-bubble:nth-child(4n+4) .cat-icon{background:#E3F0FA;color:#2C6FB5}
/* stappen: icoon in pastelcirkel */
.step-card i{width:66px;height:66px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:1.6rem;background:#EDF7F3;color:var(--primary);margin:0 auto 14px}
.step-card:nth-child(2) i{background:#EAF6FB;color:#0B4A6B}
.step-card:nth-child(3) i{background:#DEF5EA;color:#14532D}
.step-card{transition:transform .2s,box-shadow .2s}
.step-card:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(37,48,59,.10)}
/* over-ons: kaart met roze verlooprand */
.about{background:linear-gradient(#fff,#fff) padding-box,linear-gradient(100deg,var(--primary),#BDE8DC) border-box;border:2px solid transparent}
.about-facts div{background:#FBF3F7}
/* sidebar: losse kaartjes met filteropties */
.shop-side{display:flex;flex-direction:column;gap:18px;padding:0;margin:0}
.side-card{padding:18px 20px}
.side-group{display:flex;flex-direction:column;gap:7px;margin-bottom:12px}
.side-group:last-child{margin-bottom:0}
.side-group>strong{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
.side-group label{display:flex;align-items:center;gap:9px;font-size:.92rem;cursor:pointer;color:var(--text)}
.side-group label:hover{color:var(--primary)}
.side-group input{accent-color:var(--primary);width:15px;height:15px;cursor:pointer}
.side-actions{display:flex;align-items:center;gap:14px;margin-top:14px}
.side-reset{font-size:.82rem;color:var(--muted)}
.side-reset:hover{color:var(--primary)}
/* sidebar-kaartjes: compacter + roze bovenrand */
.shop-side{gap:14px}
.side-card{padding:14px 18px 16px;border-top:3px solid var(--primary);border-radius:8px}
.side-card h4{font-size:.95rem;margin-bottom:10px}
.side-group{gap:5px;margin-bottom:10px}
.side-group:last-child{margin-bottom:0}
.side-group label{font-size:.88rem}
.side-cats a{padding:7px 10px;font-size:.9rem}
.side-actions{margin-top:10px}
/* hero: mok groter, tekst dichterbij */
.hero-visual img{width:min(430px,92%)}
.hero-text{padding-left:26px}
/* hero: tekstblok meer naar links */
.hero-inner{grid-template-columns:.85fr 1.3fr}
.hero-text{padding-left:10px}
@media (max-width:900px){.hero-inner{grid-template-columns:1fr}}
/* hero: geen afronding + veel meer bewegende figuurtjes */
.hero{border-radius:0}
.hero-deco i:nth-child(6){top:8%;left:30%;color:#4EA8E8;font-size:2.1rem;animation-name:decoDrift;animation-duration:9s}
.hero-deco i:nth-child(7){top:64%;left:34%;color:#8ED3BE;font-size:1.6rem;animation-name:decoDrift;animation-delay:.8s}
.hero-deco i:nth-child(8){top:14%;right:14%;color:#FFC24B;font-size:1.9rem;animation-delay:2.4s}
.hero-deco i:nth-child(9){bottom:22%;right:22%;color:#7BD8B0;font-size:1.7rem;animation-name:decoDrift;animation-duration:8s;animation-delay:1.2s}
.hero-deco i:nth-child(10){top:40%;left:2%;color:#62B098;font-size:1.8rem;animation-delay:3s}
.hero-deco i:nth-child(11){top:52%;left:42%;color:#4E9C86;font-size:2rem;animation-name:decoDrift;animation-duration:10s}
.hero-deco i:nth-child(12){top:26%;right:4%;color:#8ED3BE;font-size:1.5rem;animation-delay:.6s}
.hero-deco i:nth-child(13){bottom:10%;right:38%;color:#FFC24B;font-size:1.6rem;animation-name:decoDrift;animation-delay:2s}
.hero-deco i:nth-child(14){top:34%;left:22%;color:#4EA8E8;font-size:1.4rem;animation-delay:1.8s}
.hero-deco i:nth-child(15){bottom:30%;right:12%;color:#B983FF;font-size:1.9rem;animation-name:decoDrift;animation-duration:11s;animation-delay:.4s}
@keyframes decoDrift{0%,100%{transform:translateX(0) translateY(0) rotate(-3deg)}33%{transform:translateX(16px) translateY(-10px) rotate(4deg)}66%{transform:translateX(-12px) translateY(8px) rotate(-5deg)}}
/* deco: opvallender + meer beweging + nóg meer figuurtjes */
.hero-deco i{opacity:.34}
@keyframes decoBob{0%,100%{transform:translateY(0) rotate(-8deg)}50%{transform:translateY(-22px) rotate(10deg)}}
@keyframes decoDrift{0%,100%{transform:translate(0,0) rotate(-6deg)}33%{transform:translate(26px,-18px) rotate(8deg)}66%{transform:translate(-20px,14px) rotate(-9deg)}}
.hero-deco i:nth-child(16){top:6%;left:52%;color:#8ED3BE;font-size:2.2rem;animation-delay:1.4s}
.hero-deco i:nth-child(17){top:70%;left:16%;color:#FFC24B;font-size:2rem;animation-name:decoDrift;animation-delay:2.6s}
.hero-deco i:nth-child(18){top:20%;left:58%;color:#4EA8E8;font-size:2.4rem;animation-name:decoDrift;animation-duration:12s}
.hero-deco i:nth-child(19){bottom:8%;left:26%;color:#62B098;font-size:1.8rem;animation-delay:.9s}
.hero-deco i:nth-child(20){top:44%;right:30%;color:#8ED3BE;font-size:1.6rem;animation-name:decoDrift;animation-delay:1.1s}
.hero-deco i:nth-child(21){top:10%;right:30%;color:#FFC24B;font-size:1.7rem;animation-delay:2.2s}
.hero-deco i:nth-child(22){bottom:16%;left:38%;color:#B983FF;font-size:2.1rem;animation-name:decoDrift;animation-duration:7s}
.hero-deco i:nth-child(23){top:58%;right:8%;color:#7BD8B0;font-size:1.8rem;animation-delay:1.6s}
.hero-deco i:nth-child(24){top:30%;right:42%;color:#4EA8E8;font-size:2rem;animation-name:decoDrift;animation-delay:.3s}
.hero-deco i:nth-child(25){bottom:42%;left:14%;color:#62B098;font-size:1.5rem;animation-delay:2.8s}
/* categorie-strip: volle breedte, elk item eigen kaartje met roze rand */
.cat-row{justify-content:space-between;gap:14px}
.cat-bubble{flex:1;min-width:0;padding:22px 10px 18px;border:2px solid transparent;border-radius:8px;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(180deg,#BDE8DC,var(--primary)) border-box;box-shadow:0 10px 24px rgba(98,176,152,.10);transition:transform .2s,box-shadow .2s}
.cat-bubble:hover{transform:translateY(-4px);box-shadow:0 16px 30px rgba(98,176,152,.18)}
/* categorielijst sidebar: meer ruimte tussen items */
.side-cats{gap:3px}
.side-cats a{padding:8px 12px}
/* categorie-carousel productpagina */
.cat-carousel{position:relative;margin-bottom:16px}
.cat-carousel .cat-bubble{flex:0 0 auto;width:158px}
.cat-carousel .cat-bubble.is-active{background:linear-gradient(120deg,var(--primary),#4E9C86);border-color:var(--primary);box-shadow:0 12px 26px rgba(98,176,152,.3)}
.cat-carousel .cat-bubble.is-active strong{color:#fff}
.cat-carousel .cat-bubble.is-active small{color:#CDEFEA}
.cat-carousel .cat-bubble.is-active .cat-icon{background:rgba(255,255,255,.22);color:#fff}
/* sidebar-kaartjes dichter op elkaar */
.shop-side{gap:6px}
/* uitgelichte producten als carousel op home */
.feat-carousel{position:relative}
.feat-carousel .product-card{width:270px}
@media(max-width:600px){.feat-carousel .product-card{width:230px}}
/* uitgelichte carousel: hele kaarten + pijlen buiten de container */
.feat-carousel .scr-track{gap:18px}
.feat-carousel .product-card{width:calc((100% - 54px)/4)}
.feat-carousel .scr-btn{width:48px;height:48px;border:none;background:linear-gradient(120deg,var(--primary),#4E9C86);color:#fff;font-size:1.7rem;box-shadow:0 10px 22px rgba(98,176,152,.4)}
.feat-carousel .scr-btn:hover{background:linear-gradient(120deg,#4E9C86,#2E7A66);color:#fff;transform:translateY(-50%) scale(1.08)}
.feat-carousel .scr-btn:disabled{opacity:.4}
.feat-carousel .scr-prev{left:-58px}
.feat-carousel .scr-next{right:-58px}
@media(max-width:1400px){.feat-carousel .scr-prev{left:-20px}.feat-carousel .scr-next{right:-20px}}
@media(max-width:1100px){.feat-carousel .product-card{width:calc((100% - 36px)/3)}}
@media(max-width:700px){.feat-carousel .product-card{width:calc((100% - 18px)/2)}.feat-carousel .scr-prev{left:-8px}.feat-carousel .scr-next{right:-8px}}
/* spaarmuntjes: afbeelding + uitleg naast elkaar */
.promo-split{display:grid;grid-template-columns:1.15fr 1fr;gap:0;align-items:stretch;border-radius:8px;overflow:hidden;box-shadow:0 14px 34px rgba(37,48,59,.12);background:#fff}
.promo-split-img{display:block;position:relative}
.promo-split-img img{width:100%;height:100%;object-fit:cover;display:block}
.promo-split-text{padding:38px 40px;display:flex;flex-direction:column;justify-content:center;gap:12px;background:#fff}
.promo-split-text h2{margin:0}
.promo-split-text p{margin:0;color:var(--muted);font-size:1.02rem;line-height:1.6}
.promo-points{list-style:none;margin:6px 0 4px;padding:0;display:flex;flex-direction:column;gap:14px}
.promo-points li{display:flex;gap:14px;align-items:center}
.promo-points i{flex:0 0 auto;width:46px;height:46px;border-radius:50%;background:linear-gradient(135deg,var(--primary),#4E9C86);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.15rem;box-shadow:0 6px 14px rgba(98,176,152,.3)}
.promo-points strong{display:block;font-family:'Caveat Brush','Baloo 2',sans-serif;font-size:1rem;color:var(--ink)}
.promo-points span{display:block;color:var(--muted);font-size:.86rem}
.promo-split-text .btn{align-self:flex-start;margin-top:6px}
@media(max-width:860px){.promo-split{grid-template-columns:1fr}.promo-split-text{padding:26px 24px}}
/* overal 8px afronding (knoppen, badges, kaarten) — echte rondjes blijven rond */
.btn,.badge,.perso-badge,.prod-badge,.cat-chip,.pill,.hours-status,.cart-count,.pdp-count,.free-bar,.btn-icon,.step,.step-num,.scr-btn,.cat-icon,.promo-points i,.be-nav a,.be-top-actions button,.switch-slider,.switch-slider:before,.tab-dot,.dot,.about-check li::before{border-radius:8px}
.cat-icon,.step,.step-num,.scr-btn,.promo-points i,.btn-icon,.cart-count,.switch-slider:before,.tab-dot,.dot,.be-user>i{border-radius:50%}
/* header in drie zones: logo | menu (echt gecentreerd) | zoeken+knoppen */
.header-side{display:flex;align-items:center;gap:12px;min-width:0}
.nav-center .logo{grid-column:1;justify-self:start}
.nav-center .mainnav{grid-column:2}
.nav-center .header-side{grid-column:3;justify-self:end}
@media (max-width:760px){.header-side{display:contents}}
/* waarom-blok onder de stappen: titel + USP's zoals referentie */
.why-split{display:grid;grid-template-columns:1.2fr 1fr;gap:60px;align-items:center;margin-top:56px}
.why-text h2{margin:0 0 18px;font-size:2.4rem;line-height:1.15;color:#25303B;background:none;-webkit-text-fill-color:currentColor}
.why-text .btn{margin:0 0 22px}
.why-text p{margin:0 0 14px;color:#5B6873;font-size:1rem;line-height:1.65}
.why-usps{display:flex;flex-direction:column;gap:30px}
.why-usp{display:flex;gap:18px;align-items:flex-start}
.why-usp>i{font-size:1.6rem;color:var(--primary);flex:0 0 auto;margin-top:4px}
.why-usp strong{display:block;font-size:1.35rem;color:#25303B;line-height:1.25}
.why-usp span{display:block;margin-top:6px;color:#8A95A0;font-size:.95rem;line-height:1.5}
@media(max-width:900px){.why-split{grid-template-columns:1fr;gap:36px}}
/* waarom-blok als witte kaart onder de stappen */
.why-split{margin-top:0;padding:48px 52px;gap:56px}
.why-text .eyebrow{display:inline-block;margin-bottom:10px}
.why-usp>i{width:52px;height:52px;flex:0 0 52px;border-radius:8px;background:#EDF7F3;color:var(--primary);font-size:1.35rem;display:flex;align-items:center;justify-content:center;margin-top:0}
.why-usp:nth-child(2)>i{background:#FFF3D6;color:#D9911A}
.why-usp:nth-child(3)>i{background:#DFF3E4;color:#2E9E57}
@media(max-width:900px){.why-split{padding:28px 24px}}
/* lichtblauwe band: bewegende figuurtjes + waarom-blok zonder kaart */
.band{position:relative;overflow:hidden}
.band-deco{position:absolute;inset:0;pointer-events:none}
.band-deco i{position:absolute;color:var(--primary);opacity:.28;font-size:1.8rem;animation:decoBob 6s ease-in-out infinite}
.band-deco i:nth-child(1){top:12%;left:4%}
.band-deco i:nth-child(2){top:8%;left:38%;color:#FFC24B;font-size:1.3rem;animation-delay:1s}
.band-deco i:nth-child(3){top:60%;left:2%;color:#4EA8E8;font-size:2rem;animation-name:decoDrift;animation-duration:9s}
.band-deco i:nth-child(4){top:18%;right:10%;color:#8ED3BE;font-size:1.6rem;animation-delay:2s}
.band-deco i:nth-child(5){bottom:14%;left:30%;color:#7BD8B0;font-size:2.2rem;animation-name:decoDrift;animation-duration:8s;animation-delay:1.2s}
.band-deco i:nth-child(6){top:38%;right:3%;color:#FFC24B;font-size:1.9rem;animation-delay:.6s}
.band-deco i:nth-child(7){bottom:26%;right:20%;color:#4EA8E8;font-size:1.5rem;animation-name:decoDrift;animation-delay:2.4s}
.band-deco i:nth-child(8){top:70%;left:12%;color:#8ED3BE;font-size:1.7rem;animation-delay:3s}
.band-deco i:nth-child(9){top:5%;right:35%;color:#7BD8B0;font-size:1.4rem;animation-name:decoDrift;animation-duration:10s}
.band-deco i:nth-child(10){bottom:8%;right:8%;font-size:1.8rem;animation-delay:.8s}
.band-deco i:nth-child(11){top:45%;left:20%;color:#FFC24B;font-size:1.5rem;animation-delay:1.7s}
.band-deco i:nth-child(12){bottom:18%;left:45%;color:#4EA8E8;font-size:2rem;animation-name:decoDrift;animation-duration:7s;animation-delay:.4s}
.band-deco i:nth-child(13){top:30%;left:55%;color:#8ED3BE;font-size:1.4rem;animation-delay:2.8s}
.band-deco i:nth-child(14){bottom:6%;left:60%;color:#7BD8B0;font-size:1.9rem;animation-name:decoDrift;animation-delay:1.9s}
.why-split{margin-top:56px;padding:0;grid-template-columns:1fr 1fr;gap:72px}
.why-text h2{margin:6px 0 20px}
.why-usp>i{background:#fff;box-shadow:0 6px 16px rgba(37,48,59,.08)}
/* over-ons pagina */
.about-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:40px;align-items:stretch}
.about-story{padding:40px 44px}
.about-story h2{margin:6px 0 18px;font-size:2rem}
.about-story p{margin:0 0 14px;color:#5B6873;line-height:1.7}
.about-usps{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.about-usp{padding:22px;display:flex;flex-direction:column;gap:8px;justify-content:center}
.about-usp>i{width:44px;height:44px;border-radius:8px;background:#EDF7F3;color:var(--primary);font-size:1.2rem;display:flex;align-items:center;justify-content:center}
.about-usp:nth-child(2)>i{background:#DFF3E4;color:#2E9E57}
.about-usp:nth-child(3)>i{background:#E3F1FD;color:#2F7DC4}
.about-usp:nth-child(4)>i{background:#FFF3D6;color:#D9911A}
.about-usp strong{font-size:1.05rem}
.about-usp span{font-size:.85rem;color:#8A95A0;line-height:1.5}
.team-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:22px}
.team-card{padding:28px 22px;text-align:center;border-top:4px solid var(--primary);transition:transform .2s}
.team-card:hover{transform:translateY(-6px)}
.team-card.accent-sun{border-top-color:#FFC24B}
.team-card.accent-mint{border-top-color:#7BD8B0}
.team-card.accent-sky{border-top-color:#4EA8E8}
.team-card.accent-grape{border-top-color:#9B7BD8}
.team-photo{width:120px;height:120px;border-radius:50%;object-fit:cover;margin:0 auto 16px;display:block;border:4px solid #fff;box-shadow:0 8px 20px rgba(37,48,59,.12)}
.team-name{display:block;font-size:1.3rem}
.team-role{display:inline-block;margin:6px 0 12px;padding:4px 14px;border-radius:999px;background:#EDF7F3;color:var(--primary);font-size:.75rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.team-card.accent-sun .team-role{background:#FFF3D6;color:#D9911A}
.team-card.accent-mint .team-role{background:#DFF3E4;color:#2E9E57}
.team-card.accent-sky .team-role{background:#E3F1FD;color:#2F7DC4}
.team-card.accent-grape .team-role{background:#EEE7FB;color:#7B5FC0}
.team-card p{margin:0;font-size:.85rem;color:#6A7684;line-height:1.6}
.center-block{text-align:center}
.center-block .sec-title{margin-bottom:20px}
@media(max-width:900px){.about-grid{grid-template-columns:1fr}}
/* teamkaarten: vierkante foto's, gelijke teksten, socials */
.team-grid{align-items:stretch}
.team-card{display:flex;flex-direction:column;padding:30px 24px 24px}
.team-photo{width:100%;max-width:230px;height:auto;aspect-ratio:1;border-radius:16px;margin-bottom:18px}
.team-card p{flex:1 0 auto;min-height:104px}
.team-socials{display:flex;justify-content:center;gap:8px;margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.team-socials a{width:34px;height:34px;border-radius:8px;background:#EDF7F3;color:var(--primary);display:flex;align-items:center;justify-content:center;font-size:1rem;transition:.15s}
.team-socials a:hover{background:var(--primary);color:#fff;transform:translateY(-2px)}
/* footer: roze zoals de topbar */
.footer{background:linear-gradient(160deg,#8ED3BE,var(--primary) 55%,#2E7A66);color:#DFF3EC}
.footer h4{color:#fff}
.footer h4::after{background:rgba(255,255,255,.55)}
.footer a{color:#DFF3EC}.footer a:hover{color:#fff}
.footer-about p{color:#CDEFEA}
.footer-badge{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.4);color:#fff}
.footer .socials a{background:rgba(255,255,255,.16);color:#fff}
.footer .socials a:hover{background:#fff;color:var(--primary)}
.footer-contact li>span{background:rgba(255,255,255,.16);color:#fff}
.footer-links i{color:#CDEFEA}
.footer-cta{background:rgba(255,255,255,.14);box-shadow:none;backdrop-filter:blur(4px)}
.footer-cta p{color:#DFF3EC}
.footer-cta .footer-btn{background:#fff;color:var(--primary);border-color:#fff}
.footer-cta .footer-btn:hover{background:#DFF3EC;color:#2E7A66}
.footer-cta .footer-btn-ghost{border-color:rgba(255,255,255,.6)}
.footer-cta .footer-btn-ghost:hover{background:rgba(255,255,255,.18)}
.footer-ids li small{color:#CDEFEA}
.footer-ids li strong{color:#fff}
.footer-bottom{border-top-color:rgba(255,255,255,.25);color:#CDEFEA}
.footer-bottom a{color:#CDEFEA}.footer-bottom a:hover{color:#fff}
.footer-logo{filter:brightness(0) invert(1)}

/* about-usp kaartjes gecentreerd, 1 regel beschrijving */
.about-usp{align-items:center;text-align:center;gap:10px}
.about-usp>i{margin:0 auto}
.about-usp span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}

/* 6 kaartjes onder elkaar, icoon links + tekst ernaast */
.about-usps{grid-template-columns:1fr;gap:8px}
.about-usp{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:12px;row-gap:2px;padding:10px 14px;align-items:center;justify-items:start;text-align:left}
.about-usp>i{grid-row:1/3;align-self:center;margin:0;width:42px;height:42px;font-size:1.05rem}
.about-usp strong{font-size:.92rem}
.about-usp span{font-size:.78rem;line-height:1.35}
.about-usp:nth-child(5)>i{background:#EFE3FB;color:#8B5CC4}
.about-usp:nth-child(6)>i{background:#DFF4F4;color:#2AA5A5}
@media(max-width:900px){.about-usps{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.about-usps{grid-template-columns:1fr}}

/* hoofdmenu dropdown + mega */
.nav-group{position:relative}
.nav-group>.nav-toggle{display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.nav-group>.nav-toggle>i{font-size:.7rem;transition:transform .15s}
.nav-group:hover>.nav-toggle>i{transform:rotate(180deg)}
.nav-panel{display:none;position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%);min-width:230px;background:#fff;border:1px solid #EDE1E8;border-radius:8px;box-shadow:0 20px 44px -12px rgba(37,48,59,.22);padding:8px;z-index:90}
.nav-group:hover>.nav-panel,.nav-group:focus-within>.nav-panel{display:block}
.nav-panel a{display:block;padding:9px 12px;border-radius:6px}
.nav-panel a:hover{background:#EDF7F3;color:var(--primary)}
.nav-panel a strong{display:block}
.nav-panel a small{display:block;color:var(--muted);font-size:.78rem;margin-top:2px}
.nav-mega{position:static}
.nav-mega>.nav-panel{left:50%;width:min(720px,calc(100vw - 60px));display:none;grid-template-columns:1fr 1fr 1fr;gap:4px;padding:14px}
.nav-mega:hover>.nav-panel,.nav-mega:focus-within>.nav-panel{display:grid}
@media (max-width:1100px){.nav-panel,.nav-mega>.nav-panel{position:static;transform:none;width:auto;display:none;box-shadow:none;border:0;padding-left:16px}.nav-group.is-open>.nav-panel{display:block}.nav-mega.is-open>.nav-panel{display:grid;grid-template-columns:1fr}}

/* === homepage hero-slider === */
.hero-slider{position:relative;overflow:hidden;min-height:420px}
.hslide{display:none;position:relative;min-height:420px}
.hslide.is-on{display:flex;align-items:center}
.hslide-bg{position:absolute;inset:0;background-size:cover;background-position:center}
.hslide-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(27,36,48,.72),rgba(27,36,48,.25))}
.hslide-inner{position:relative;z-index:1;padding:56px 24px;width:100%}
.hslide-text{max-width:560px;color:#fff}
.hslide-text h1{color:#fff;margin-bottom:12px}
.hslide-text p{color:rgba(255,255,255,.88);font-size:18px;margin-bottom:22px}
.hslide-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:44px;height:44px;border:0;border-radius:50%;background:rgba(255,255,255,.92);color:#1B2430;font-size:22px;cursor:pointer;display:grid;place-items:center}
.hslide-prev{left:18px}.hslide-next{right:18px}
.hslide-dots{position:absolute;left:0;right:0;bottom:18px;z-index:2;display:flex;gap:8px;justify-content:center}
.hslide-dots button{width:10px;height:10px;border-radius:50%;border:0;background:rgba(255,255,255,.5);cursor:pointer;padding:0}
.hslide-dots button.is-on{background:#fff;transform:scale(1.25)}

/* === logo-carrousel === */
.logo-strip{padding-top:0;padding-bottom:28px}
.logo-marquee{overflow:hidden;position:relative;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.logo-track{display:flex;gap:44px;align-items:center;width:max-content;animation:logoScroll 28s linear infinite}
.logo-marquee:hover .logo-track{animation-play-state:paused}
.logo-item img{height:44px;width:auto;object-fit:contain;filter:grayscale(15%);opacity:.75;transition:.2s}
.logo-item:hover img{filter:none;opacity:1}
@keyframes logoScroll{to{transform:translateX(-50%)}}

/* === Auth: groen verloop huiskleur === */
.auth-brand{background:radial-gradient(circle at 85% 15%,rgba(142,211,190,.35),transparent 45%),radial-gradient(circle at 10% 90%,rgba(98,176,152,.3),transparent 50%),linear-gradient(150deg,#3A8570,#256956)}
.auth-pitch li{color:#E4F2EC}
.auth-pitch li i{color:#8ED3BE}
.auth-foot{color:#B8DDD0}
.auth-foot a{color:#E4F2EC}

.auth-ico{background:linear-gradient(135deg,#62B098,#256956)}


/* === Hero-deco: eigen dieren-icoontjes === */
.hero-deco img{position:absolute;z-index:0;width:64px;height:64px;object-fit:contain;opacity:.95;animation:decoBob 6s ease-in-out infinite;pointer-events:none;filter:drop-shadow(0 6px 10px rgba(30,50,45,.18))}
.hero-deco img:nth-child(1){top:6%;left:6%;width:76px;height:76px}
.hero-deco img:nth-child(2){top:10%;left:46%;width:54px;height:54px;animation-delay:1s}
.hero-deco img:nth-child(3){bottom:18%;left:44%;width:70px;height:70px;animation-delay:2s}
.hero-deco img:nth-child(4){bottom:12%;left:8%;width:58px;height:58px;animation-delay:.5s}
.hero-deco img:nth-child(5){top:72%;right:5%;width:80px;height:80px;animation-delay:1.5s}
.hero-deco img:nth-child(6){top:8%;left:30%;width:66px;height:66px;animation-name:decoDrift;animation-duration:9s}
.hero-deco img:nth-child(7){top:64%;left:34%;width:56px;height:56px;animation-name:decoDrift;animation-delay:.8s}
.hero-deco img:nth-child(8){top:14%;right:14%;width:62px;height:62px;animation-delay:2.4s}
.hero-deco img:nth-child(9){bottom:22%;right:22%;width:60px;height:60px;animation-name:decoDrift;animation-duration:8s;animation-delay:1.2s}
.hero-deco img:nth-child(10){top:40%;left:2%;width:64px;height:64px;animation-delay:3s}
.hero-deco img:nth-child(11){top:52%;left:42%;width:68px;height:68px;animation-name:decoDrift;animation-duration:10s}
.hero-deco img:nth-child(12){top:26%;right:4%;width:58px;height:58px;animation-delay:.6s}
@media (max-width:900px){.hero-deco img{width:44px;height:44px}.hero-deco img:nth-child(n+7){display:none}}


/* === Hero-deco instelbare zichtbaarheid === */
.hero-deco img{opacity:var(--deco-o,.95)}


/* Hero-deco: posities voor iconen boven de 12e nth-child */
.hero-deco img:nth-child(n+13){top:calc(8% + (var(--i,0) * 6%));left:calc(5% + (var(--i,0) * 7%));width:60px;height:60px}


/* === Sila de vlinder: invliegende welkom-bubble === */
.sila{position:fixed;right:24px;bottom:24px;z-index:80;display:flex;align-items:flex-end;gap:0;transform:translateX(120%) translateY(40px) rotate(8deg);opacity:0;transition:transform .9s cubic-bezier(.2,.9,.3,1.2),opacity .5s ease;max-width:min(420px,92vw)}
.sila.is-in{transform:none;opacity:1;animation:silaBob 4s ease-in-out 1s infinite}
.sila.is-out{transform:translateX(120%) translateY(40px);opacity:0;transition:transform .6s ease,opacity .4s ease}
.sila-img{width:92px;height:92px;object-fit:contain;filter:drop-shadow(0 8px 14px rgba(40,60,55,.25));flex:0 0 auto;margin-bottom:-8px;margin-right:-16px;z-index:2}
.sila-bubble{position:relative;background:#fff;border-radius:18px 18px 18px 4px;box-shadow:0 14px 34px rgba(30,50,45,.18);padding:16px 18px 14px;border:2px solid #E4F0EA}
.sila-bubble strong{color:#26343F;font-size:14.5px}
.sila-bubble p{margin:4px 0 10px;font-size:13px;color:#5A6B77;line-height:1.45}
.sila-bubble p strong{color:#2E7A66}
.sila-close{position:absolute;top:8px;right:8px;border:0;background:#F1F5F3;color:#8AA39C;width:24px;height:24px;border-radius:50%;cursor:pointer;font-size:13px;display:flex;align-items:center;justify-content:center}
.sila-close:hover{background:#E4655A;color:#fff}
.sila-form{display:flex;gap:8px}
.sila-form input{flex:1;min-width:0;border:1.5px solid #E4ECE8;border-radius:10px;padding:8px 12px;font:inherit;font-size:13px}
.sila-form input:focus{outline:none;border-color:#62B098}
@keyframes silaBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@media (max-width:700px){.sila{right:12px;bottom:12px}.sila-img{width:70px;height:70px}}


/* === Nieuwsbrief-popup met Sila === */
.popup{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;padding:20px;visibility:hidden}
.popup.is-in{visibility:visible}
.popup-backdrop{position:absolute;inset:0;background:rgba(20,32,28,.5);opacity:0;transition:opacity .35s;backdrop-filter:blur(3px)}
.popup.is-in .popup-backdrop{opacity:1}
.popup.is-out .popup-backdrop{opacity:0}
.popup-card{position:relative;background:linear-gradient(180deg,#FDFFFE 0%,#F4FAF7 100%);border:1px solid #DFF0E8;border-radius:26px;box-shadow:0 30px 80px rgba(20,40,35,.3);padding:38px 40px 30px;width:100%;max-width:520px;text-align:center;transform:translateY(50px) scale(.92);opacity:0;transition:transform .45s cubic-bezier(.2,.9,.3,1.15),opacity .3s}
.popup.is-in .popup-card{transform:none;opacity:1}
.popup.is-out .popup-card{transform:translateY(30px) scale(.95);opacity:0}
.popup-img{width:110px;height:110px;object-fit:contain;margin:-84px auto 8px;display:block;filter:drop-shadow(0 10px 16px rgba(40,60,55,.3));animation:silaBob 3.5s ease-in-out infinite}
.popup-card h3{font-size:24px;color:#26343F;margin:0 0 8px}
.popup-card>p{margin:0 0 20px;font-size:16px;color:#5A6B77;line-height:1.55}
.popup-form{display:flex;flex-direction:column;gap:12px;text-align:left}
.popup-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.popup-form label{display:flex;flex-direction:column;gap:5px;font-size:12px;font-weight:700;color:#4A5A66}
.popup-form input{border:1.5px solid #E4ECE8;border-radius:10px;padding:10px 13px;font:inherit;font-size:14px}
.popup-form input:focus{outline:none;border-color:#62B098}
.popup-form .btn{align-self:center;padding:11px 30px;margin-top:4px}
.popup-close{position:absolute;top:14px;right:14px;border:0;background:#F1F5F3;color:#8AA39C;width:30px;height:30px;border-radius:50%;cursor:pointer;font-size:15px;display:flex;align-items:center;justify-content:center}
.popup-close:hover{background:#E4655A;color:#fff}
@media (max-width:480px){.popup-card{padding:28px 22px 22px}.popup-img{width:84px;height:84px;margin-top:-70px}.popup-grid{grid-template-columns:1fr}}


/* Popup: kinderen met geboortedatum */
.popup-kids{display:flex;flex-direction:column;gap:8px}
.popup-kid{display:flex;align-items:center;gap:9px}
.popup-kid-label{font-size:12px;font-weight:700;color:#4A5A66;min-width:48px}
.popup-kid input{flex:1;min-width:0}
.popup-kid-del{border:0;background:#F1F5F3;color:#8AA39C;width:26px;height:26px;border-radius:50%;cursor:pointer;font-size:13px;flex:none}
.popup-kid-del:hover{background:#E4655A;color:#fff}
.popup-addkid{border:1.5px dashed #BFE0D4;background:#F4FAF7;color:#3A8570;font:inherit;font-size:13px;font-weight:700;padding:9px;border-radius:10px;cursor:pointer}
.popup-addkid:hover{background:#E7F4EE}

/* aanzichten-labels onder product-thumbs */
.pdp-tabs button{display:flex;flex-direction:column;align-items:center;gap:2px}

/* === mobiel: app-feel === */
a,button,label,input,select,textarea{-webkit-tap-highlight-color:transparent}
a,button{touch-action:manipulation}
@media (max-width:1100px){
  .mainnav.is-open{border-top:1px solid var(--line);margin-top:4px;padding-top:6px}
  .mainnav a{padding:12px 14px;font-size:1rem;border-bottom:1px solid #F0F4F2;border-radius:0}
  .mainnav a:last-child{border-bottom:none}
  .mainnav .nav-group>a.nav-toggle{display:flex;justify-content:space-between;align-items:center}
  .mainnav .nav-toggle i{transition:transform .15s}
  .mainnav .nav-group.is-open>.nav-toggle i{transform:rotate(180deg)}
  .mainnav .nav-panel{padding-left:0}
  .mainnav .nav-panel a{padding:11px 14px 11px 26px;font-weight:500;color:var(--muted);border-bottom:none}
}
.msearch{display:none}
@media (max-width:760px){
  .mainnav.is-open .msearch{display:flex;flex:1 1 100%;margin:0 0 8px}
}
@media (max-width:760px){
  main:not(.admin-main) input:not([type=radio]):not([type=checkbox]):not([type=file]):not([type=hidden]),
  main:not(.admin-main) select,
  main:not(.admin-main) textarea{font-size:16px}
  .qty-input input{font-size:14px}
  .buy-row .btn{min-height:48px;font-size:.95rem}
  .footer{padding-bottom:calc(20px + env(safe-area-inset-bottom))}
  .card{border-radius:10px}
  .pdp-buy .buy-row{gap:10px}
  .menu-toggle{width:42px;height:42px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:8px;background:#fff;font-size:1.25rem;color:var(--ink);padding:0}
  .menu-toggle:active{background:var(--bg)}
  .toasts{left:16px;right:16px;width:auto}
  .toasts .alert{width:100%}
}
@media (max-width:900px){
  .why-split{grid-template-columns:1fr}
}
body{overflow-x:clip}

/* === app-onderbalk (alleen mobiel) === */
.app-nav,.app-scrim,.app-sheet{display:none}
@media (max-width:760px){
  body{padding-bottom:calc(62px + env(safe-area-inset-bottom))}
  .menu-toggle{display:none}
  .header-inner{justify-content:center}
  .header-actions{display:none}
  .topbar-inner{justify-content:center;flex-wrap:wrap;gap:4px 14px;font-size:.7rem;padding:6px 16px;text-align:center}
  .topbar .hide-sm,.topbar .hide-md{display:inline}
  .app-nav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:900;background:linear-gradient(135deg,#62B098,#3A8570);box-shadow:0 -6px 20px rgba(37,48,59,.18);padding:6px 4px calc(6px + env(safe-area-inset-bottom))}
  .app-item{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:5px 2px;border:none;background:none;font:inherit;font-size:.66rem;font-weight:700;color:rgba(255,255,255,.75);text-decoration:none;position:relative;border-radius:10px;cursor:pointer}
  .app-item i{font-size:1.3rem;color:rgba(255,255,255,.85)}
  .app-item.is-active,.app-item:active{color:#fff}
  .app-item.is-active i,.app-item:active i{color:#fff}
  .app-item.is-active{background:rgba(255,255,255,.16)}
  .app-item .cart-count{position:absolute;top:-2px;left:calc(50% + 6px);font-size:.6rem;min-width:16px;height:16px;line-height:16px}
  .app-scrim{display:block;position:fixed;inset:0;z-index:940;background:rgba(23,32,38,.4);opacity:0;pointer-events:none;transition:opacity .2s}
  .app-scrim.is-open{opacity:1;pointer-events:auto}
  .app-sheet{display:block;position:fixed;left:0;right:0;bottom:0;z-index:950;background:#fff;border-radius:20px 20px 0 0;box-shadow:0 -14px 44px rgba(23,32,38,.28);padding:10px 18px calc(18px + env(safe-area-inset-bottom));transform:translateY(105%);transition:transform .25s ease;max-height:72vh;overflow-y:auto}
  .app-sheet.is-open{transform:translateY(0)}
  .app-sheet-head{display:flex;align-items:center;justify-content:space-between;padding:4px 2px 12px}
  .app-sheet-head strong{font-family:'Caveat Brush','Baloo 2',sans-serif;font-size:1.3rem}
  .app-sheet-head button{width:34px;height:34px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink);font-size:.9rem}
  .app-sheet-nav{display:flex;flex-direction:column}
  .app-sheet-nav a{display:flex;align-items:center;gap:12px;padding:13px 6px;border-bottom:1px solid #F0F4F2;font-weight:600;font-size:.95rem;color:var(--ink);text-decoration:none}
  .app-sheet-nav a i{color:var(--primary);font-size:1.05rem;width:20px;text-align:center}
  .app-sheet-nav a.is-active{color:var(--primary)}
  /* categorie: nette 3-koloms grid i.p.v. geplette rij */
  .cat-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
  .cat-bubble{width:auto;padding:14px 6px 12px;gap:5px}
  .cat-bubble .cat-icon{width:56px;height:56px;font-size:1.5rem}
  .cat-bubble strong{font-size:.8rem;line-height:1.15}
  .cat-bubble small{font-size:.66rem}
  /* hero: tekst eerst, geen lege ruimte */
  .hero-inner{gap:18px;padding-top:26px;padding-bottom:42px}
  .hero-visual{order:2;min-height:0}
  .hero-visual img{max-height:230px;margin:0 auto;display:block}
  .hero h1{font-size:2rem}
  /* carousels: geen pijlen over de kaarten, gewoon swipen */
  .scr-btn{display:none}
  .feat-carousel .product-card{width:min(260px,74%)}
}
