/* Baby Luxury — "Ontwerp je kussen" (BL-KUSSEN-ONTWERP-20261031) */
@font-face{font-family:"BL Vibes";src:url(fonts/greatvibes.woff2) format("woff2");font-display:swap}
@font-face{font-family:"BL Parisienne";src:url(fonts/parisienne.woff2) format("woff2");font-display:swap}
@font-face{font-family:"BL Dancing";src:url(fonts/dancingscript.woff2) format("woff2");font-weight:500;font-display:swap}
#kussen-ontwerp{--ko-ink:#33281f;--ko-acc:#5b4232;--ko-mut:#7a6a5c;--ko-line:#e6dacb;--ko-bg:#fffaf3;display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(24px,4vw,56px);align-items:start;padding:10px 0 90px;color:var(--ko-ink)}
@media(max-width:920px){#kussen-ontwerp{grid-template-columns:1fr}}
.ko-podium{position:sticky;top:120px;border-radius:24px;padding:clamp(18px,3vw,34px);background:radial-gradient(120% 90% at 30% 10%,#fbeee8 0%,#f6efe4 45%,#efe6d8 100%);perspective:1100px;overflow:hidden;isolation:isolate}
.ko-podium::before{content:"";position:absolute;inset:auto -10% -30% -10%;height:60%;background:radial-gradient(closest-side,rgba(201,219,236,.55),rgba(201,219,236,0));z-index:-1}
@media(max-width:920px){.ko-podium{position:relative;top:0}}
.ko-kaart{transition:transform .5s cubic-bezier(.2,.8,.2,1);transform-style:preserve-3d;will-change:transform}
.ko-kaart.pop svg{animation:ko-pop .55s cubic-bezier(.2,.8,.2,1)}
@keyframes ko-pop{0%{transform:scale(.9);opacity:.35}100%{transform:scale(1);opacity:1}}
#ko-svg{display:block;width:100%;height:auto;max-height:62vh}
.ko-maat{text-align:center;margin:6px 0 0;font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ko-mut)}
.ko-uitleg{text-align:center;margin:6px 0 0;font-size:.78rem;color:var(--ko-mut)}
.ko-stap{margin-bottom:22px}.ko-stap h3{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;margin:0 0 10px;font-family:inherit}
.ko-stap h3 span{text-transform:none;letter-spacing:0;font-weight:400;color:var(--ko-mut);margin-left:6px}
.ko-twee{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.ko-vormen{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}@media(max-width:520px){.ko-vormen{grid-template-columns:repeat(3,1fr)}}
.ko-vorm{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 4px 8px;border:1px solid var(--ko-line);border-radius:14px;background:var(--ko-bg);cursor:pointer;transition:transform .2s,border-color .2s;font:inherit;color:inherit}
.ko-vorm svg{width:46px;height:46px;fill:#e7d6c4;stroke:#b79d84;stroke-width:6}.ko-vorm small{font-size:.7rem;color:var(--ko-mut);line-height:1.2;text-align:center}
.ko-vorm:hover{transform:translateY(-2px)}.ko-vorm.on{border-color:var(--ko-acc);box-shadow:0 0 0 1px var(--ko-acc)}.ko-vorm.on svg{fill:#d9b9a8}
.ko-chips{display:flex;flex-wrap:wrap;gap:8px}
.ko-chip{border:1px solid var(--ko-line);border-radius:999px;padding:9px 16px;background:var(--ko-bg);cursor:pointer;font:inherit;font-size:.9rem;color:var(--ko-ink);transition:background .2s,color .2s}
.ko-chip.on{background:var(--ko-acc);border-color:var(--ko-acc);color:#fff8ef}
.ko-fonts{margin-top:12px}.ko-fonts .ko-chip{font-size:1.35rem;padding:4px 18px}
.ko-sws{display:flex;flex-wrap:wrap;gap:9px}
.ko-sw{width:34px;height:34px;border-radius:50%;background:var(--c);border:3px solid #fff;box-shadow:0 0 0 1px var(--ko-line);cursor:pointer;transition:transform .2s}
.ko-sw:hover{transform:scale(1.12)}.ko-sw.on{box-shadow:0 0 0 2px var(--ko-acc)}
#ko-naam,#ko-d,#ko-t{width:100%;min-height:50px;border:1px solid var(--ko-line);border-radius:12px;padding:0 16px;font:inherit;font-size:1rem;background:#fff;margin-top:4px}
#ko-naam.fout{border-color:#b04a4a;box-shadow:0 0 0 3px rgba(176,74,74,.15)}
.ko-som{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 18px;border-radius:14px;background:#f3ece2;margin:6px 0 12px}
.ko-som small{display:block;font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ko-mut)}.ko-som b{font-weight:500}
.ko-prijs{font-size:1.35rem;white-space:nowrap}
.ko-inpak{display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px dashed #d6aeb0;border-radius:12px;margin-bottom:14px;cursor:pointer;background:#fff7f3}
.ko-inpak input{width:18px;height:18px;accent-color:var(--ko-acc)}.ko-inpak small{color:var(--ko-mut)}
.ko-knoppen{display:grid;grid-template-columns:1.4fr 1fr;gap:10px}
.ko-btn{min-height:54px;border-radius:999px;border:0;background:var(--ko-acc);color:#fff8ef;font:inherit;font-weight:600;letter-spacing:.06em;cursor:pointer;transition:transform .2s,box-shadow .2s}
.ko-btn:hover{transform:translateY(-1px);box-shadow:0 12px 26px -12px rgba(70,48,30,.5)}
.ko-btn-l{background:#fff;color:var(--ko-acc);box-shadow:inset 0 0 0 1.5px var(--ko-acc)}
.ko-klein{font-size:.8rem;color:var(--ko-mut);margin:12px 0 0}
@media(prefers-reduced-motion:reduce){.ko-kaart,.ko-kaart.pop svg{animation:none;transition:none}}
.ko-fout{color:#9b3d33;font-size:.9rem;margin:8px 0 0}
.ko-btn[disabled]{opacity:.45;cursor:not-allowed}