/* Billy Konfig – ny produktsida (fas 2). Prefix bk-. Samma skala som produktlandingen:
   H1 46/34 · stegrubrik 20 · brödtext 16 · liten 15 · mikro 13. Roboto Condensed ärvs från temat. */
.bk { --y:#F9DF4B; --ys:#fcdc4c; --beige:#F2F1EC; --k:#232323; --line:#e3e3e3; --muted:#666; --green:#0f9d58; --orange:#EF5415; color:var(--k); }
.bk * { box-sizing:border-box; }
.bk h1,.bk h2,.bk h3 { font-weight:700; margin:0; }
.bk-crumbs { font-size:13px; color:#999; padding:18px 0 8px; text-transform:uppercase; letter-spacing:1px; }
.bk-crumbs a { color:#999; text-decoration:none; } .bk-crumbs span { margin:0 6px; } .bk-crumbs .cur { margin:0; text-decoration:underline; }
.bk-head { display:flex; align-items:baseline; justify-content:space-between; gap:16px; flex-wrap:wrap; margin:0 0 18px; }
.bk-head h1 { font-size:40px; line-height:1.05; }
.bk-rating { font-size:15px; color:#333; } .bk-rating .stars { color:#f5b70c; letter-spacing:1px; }

.bk-grid { display:grid; grid-template-columns:minmax(0,1fr) 380px; gap:28px; align-items:start; }
.bk-main { min-width:0; }

/* Galleri */
.bk-gallery { padding-bottom:10px; }
.bk-gallery__main { border-radius:14px; overflow:hidden; background:#fff; border:1px solid var(--line); width:100%; height:clamp(300px, 34vw, 440px); }
.bk-gallery__main { position:relative; }
.bk-gallery__main img { width:100%; height:100%; object-fit:contain; display:block; }
.bk-gallery__main .bk-layer { position:absolute; inset:0; pointer-events:none; } .bk-gallery__main .bk-layer[hidden] { display:none; }
.bk-gallery__thumbs { display:flex; gap:8px; margin-top:8px; overflow-x:auto; scrollbar-width:thin; }
.bk-gallery__thumbs:has(> .bk-thumb:only-child) { display:none; }   /* bara variantbilden = ingen remsa */
.bk-thumb { flex:0 0 auto; width:84px; border:2px solid transparent; border-radius:10px; overflow:hidden; padding:0; background:var(--beige); cursor:pointer; position:relative; }
.bk-thumb img { width:100%; aspect-ratio:1; object-fit:cover; display:block; opacity:.85; }
.bk-thumb span { position:absolute; left:0; right:0; bottom:0; font:11px/1.2 inherit; background:rgba(0,0,0,.55); color:#fff; padding:2px 4px; text-align:center; }
.bk-thumb.active { border-color:var(--k); } .bk-thumb.active img { opacity:1; }

/* Steg */
.bk-form { display:flex; flex-direction:column; gap:14px; margin-top:14px; }
.bk-step { border:1px solid var(--line); border-radius:14px; padding:18px 20px; background:#fff; }
.bk-step h2 { font-size:20px; display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; margin-bottom:12px; }
.bk-step h2 .n { font-weight:700; }
.bk-step h2 small { font-size:14px; font-weight:400; color:var(--muted); }
.bk-step h2 .right { margin-left:auto; font-size:14px; font-weight:400; color:var(--k); text-decoration:underline; text-underline-offset:3px; }
.bk-intro { font-size:15px; color:#444; margin:-4px 0 12px; line-height:1.5; }

.bk-dims { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.bk-dim .lbl { display:block; font-size:14px; color:var(--muted); margin-bottom:4px; }
.bk-dim .inp { display:flex; align-items:center; border:1px solid #ccc; border-radius:10px; padding:0 12px; background:#fff; }
.bk-dim .inp:focus-within { border-color:var(--k); box-shadow:0 0 0 2px rgba(35,35,35,.08); }
.bk-dim input { border:0; outline:0; width:100%; font:inherit; font-size:20px; font-weight:700; padding:10px 0; background:transparent; -moz-appearance:textfield; }
.bk-dim input::-webkit-inner-spin-button { -webkit-appearance:none; }
.bk-dim .inp em { font-style:normal; color:var(--muted); font-size:14px; }
.bk-dim select { width:100%; border:1px solid #ccc; border-radius:10px; padding:10px 40px 10px 12px; font:inherit; font-size:20px; font-weight:700; color:var(--k); background:#fff url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'><path d='M1 1l6 6 6-6' fill='none' stroke='%23232323' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/></svg>") no-repeat right 14px center; -webkit-appearance:none; appearance:none; line-height:1.4; cursor:pointer; }
.bk-dim select:focus { outline:0; border-color:var(--k); box-shadow:0 0 0 2px rgba(35,35,35,.08); }
.bk-dim .range { display:block; font-size:12px; color:#999; margin-top:4px; }
.bk-dim.is-bad .inp { border-color:#b91c1c; } .bk-dim.is-bad .range { color:#b91c1c; }
.bk-ok { font-size:14px; color:var(--green); margin:8px 0 0; min-height:1.2em; }
.bk-check { display:flex; gap:10px; align-items:flex-start; font-size:15px; margin-top:12px; cursor:pointer; }
.bk-check input { margin-top:3px; width:18px; height:18px; }

.bk-help { background:var(--beige); border-radius:10px; margin-top:12px; }
.bk-help summary { list-style:none; cursor:pointer; padding:12px 14px; font-size:15px; display:flex; gap:10px; align-items:center; }
.bk-help summary::-webkit-details-marker { display:none; }
.bk-help .ic { display:inline-flex; width:30px; height:30px; border-radius:8px; background:#fff; align-items:center; justify-content:center; font-size:12px; }
.bk-help__body { padding:0 14px 14px; font-size:15px; line-height:1.5; }
.bk-help__steps { display:flex; flex-direction:column; gap:18px; }
.bk-help__step p { margin:0 0 10px; } .bk-help__step .bk-gobi { margin:0 0 4px; min-height:60px; }
.bk-help__step ul { margin:0 0 10px; padding-left:20px; } .bk-help__step li { margin:4px 0; } .bk-help__steptitle { margin-bottom:6px !important; }
.bk-help__outro { margin:0; color:#444; }
/* mätguide som löpande text (terrass): luft mellan punkterna, rubrik på egen rad */
.bk-help__text { padding-top:4px; }
.bk-help__text p { margin:0 0 16px; line-height:1.6; } .bk-help__text p:last-child { margin-bottom:0; }
.bk-help__text p > strong:first-child { display:block; margin-bottom:3px; }
.bk-help__text ul { margin:0 0 16px; padding-left:20px; } .bk-help__text li { margin:4px 0; }
.bk-help.small summary { padding:8px 12px; font-size:14px; text-decoration:underline; text-underline-offset:3px; background:transparent; }
.bk-help.small { background:transparent; margin-top:6px; }
.bk-video { aspect-ratio:16/9; border-radius:8px; overflow:hidden; margin-bottom:10px; background:#000; }
.bk-video iframe { width:100%; height:100%; border:0; }

/* Paket */
.bk-bundles { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.bk-bundles--2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.bk-bundle { position:relative; display:block; border:2px solid var(--line); border-radius:12px; padding:14px 14px 12px; cursor:pointer; background:#fff; }
.bk-bundle input { position:absolute; opacity:0; pointer-events:none; }
.bk-bundle.on { border-color:var(--orange); box-shadow:0 0 0 2px rgba(239,84,21,.12); }
.bk-bundle .pill { position:absolute; top:-10px; left:12px; background:var(--y); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; padding:2px 8px; border-radius:20px; }
.bk-bundle .pill.alt { background:var(--k); color:#fff; }
.bk-bundle strong { font-size:17px; } .bk-bundle .sub { font-size:14px; color:var(--muted); }
.bk-bundle .price { display:block; margin:6px 0 8px; } .bk-bundle .price b { font-size:20px; } .bk-bundle .price em { display:block; font-style:normal; font-size:13px; color:var(--muted); }
.bk-bundle ul { list-style:none; margin:0; padding:0; font-size:14px; color:#333; } .bk-bundle li { margin:2px 0; }
.bk-motor-addon { display:flex; gap:10px; align-items:flex-start; margin-top:10px; padding-top:10px; border-top:1px dashed var(--line); font-size:13px; line-height:1.35; color:#444; }
.bk-motor-addon .box { flex:0 0 18px; width:18px; height:18px; border:2px solid #999; border-radius:5px; margin-top:1px; position:relative; }
.bk-motor-addon.on .box { background:var(--k); border-color:var(--k); }
.bk-motor-addon.on .box::after { content:"✓"; color:#fff; font-size:12px; position:absolute; inset:0; display:flex; align-items:center; justify-content:center; }
.bk-motor-addon .add { margin-left:auto; font-weight:700; white-space:nowrap; }
.bk-compare { margin-top:12px; }
.bk-compare table { width:100%; border-collapse:collapse; font-size:14px; margin-top:0; background:var(--beige); border-radius:10px; overflow:hidden; }
.bk-compare th,.bk-compare td { text-align:left; padding:8px 10px; border-bottom:1px solid #e6e2d6; vertical-align:top; }
.bk-compare thead th { font-weight:700; } .bk-compare tbody th { font-weight:400; color:#444; }

/* Tyg */
.bk-swatches { display:grid; grid-template-columns:repeat(auto-fill,minmax(112px,1fr)); gap:10px; }
.bk-swatch { position:relative; display:block; border:2px solid transparent; border-radius:10px; padding:4px; cursor:pointer; text-align:center; }
.bk-swatch input { position:absolute; opacity:0; pointer-events:none; }
.bk-swatch img { width:100%; aspect-ratio:1; object-fit:cover; border-radius:7px; display:block; }
.bk-swatch .nm { display:block; font-size:13px; font-weight:700; margin-top:5px; line-height:1.2; }
.bk-swatch .cd { display:block; font-size:12px; color:#999; }
.bk-swatch .pop { position:absolute; top:8px; left:8px; background:var(--y); font-size:10px; font-weight:700; text-transform:uppercase; padding:2px 6px; border-radius:20px; }
.bk-swatch.on { border-color:var(--orange); }
.bk-swatch.is-hidden { display:none; }

.bk-groups { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px; }
.bk-group { position:relative; flex:1 1 200px; display:flex; flex-direction:column; gap:2px; border:2px solid var(--line); border-radius:12px; padding:10px 14px; cursor:pointer; }
.bk-group input { position:absolute; opacity:0; pointer-events:none; }
.bk-group.on { border-color:var(--orange); box-shadow:0 0 0 2px rgba(239,84,21,.12); }
.bk-group b { font-size:15px; } .bk-group small { font-size:13px; color:var(--muted); }
.bk-group .pill { position:absolute; top:-10px; left:12px; background:var(--y); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; padding:2px 8px; border-radius:20px; }
.bk-includes { margin-top:12px; font-size:14px; }
.bk-includes summary { cursor:pointer; color:var(--muted); list-style:none; } .bk-includes summary::before { content:"▸ "; } .bk-includes[open] summary::before { content:"▾ "; }
.bk-includes ul { list-style:none; margin:8px 0 0; padding:10px 12px; background:var(--beige); border-radius:10px; columns:2; column-gap:20px; } .bk-includes li { margin:2px 0; break-inside:avoid; }
@media (max-width:767px) { .bk-includes ul { columns:1; } }

/* Tillval + detaljer */
.bk-addons { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.bk-addon { display:flex; gap:10px; align-items:flex-start; border:1px solid var(--line); border-radius:10px; padding:12px; cursor:pointer; font-size:14px; line-height:1.35; }
.bk-addon input { margin-top:2px; width:18px; height:18px; } .bk-addon .txt { flex:1; } .bk-addon .add { font-weight:700; white-space:nowrap; }
.bk-addon.is-hidden { display:none; }
.bk-detail { border:0; padding:0; margin:0 0 14px; } .bk-detail:last-child { margin-bottom:0; }
.bk-detail legend { font-weight:700; font-size:15px; margin-bottom:8px; padding:0; } .bk-detail legend small { font-weight:400; color:var(--muted); }
.bk-detail[hidden] { display:none; }
.bk-opts { display:flex; gap:8px; flex-wrap:wrap; }
.bk-opt { display:flex; gap:10px; align-items:center; border:1px solid #ccc; border-radius:30px; padding:8px 14px; font-size:14px; cursor:pointer; background:#fff; }
.bk-opt input { position:absolute; opacity:0; pointer-events:none; }
.bk-opt.on { border-color:var(--k); background:var(--k); color:#fff; }
.bk-opt.is-disabled { opacity:.4; cursor:not-allowed; }
.bk-opts.has-img .bk-opt { border-radius:12px; padding:10px 12px; flex:1 1 220px; align-items:flex-start; }
.bk-opts.has-img .bk-opt img { width:64px; height:64px; object-fit:contain; border-radius:8px; background:var(--beige); flex:0 0 64px; }
.bk-step--pre .bk-opts { gap:10px; }
.bk-opts.has-img .bk-opt.on { background:#fff; color:var(--k); border-color:var(--orange); box-shadow:0 0 0 2px rgba(239,84,21,.12); }
.bk-opt small { color:inherit; opacity:.8; }
.bk-opt { position:relative; flex:1 1 220px; align-items:flex-start; border-radius:12px; padding:10px 14px; }
.bk-opt .pill { position:absolute; top:-10px; left:12px; background:var(--y); color:var(--k); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; padding:2px 8px; border-radius:20px; }
.bk-opt.on { background:#fff; color:var(--k); border-color:var(--orange); box-shadow:0 0 0 2px rgba(239,84,21,.12); }
.bk-opt.on .bk-info-btn { color:var(--orange); }

/* Banner efter "lägg till en till" */
.bk-again { background:#e8f3ea; border:1px solid #bfe0c6; color:#1f5a2a; border-radius:12px; padding:12px 14px; font-size:15px; margin-bottom:14px; }
.bk-again[hidden] { display:none; }

/* Detaljer: chips + hopfällbar kropp */
.bk-linkbtn, .bk-toggle { border:0; background:transparent; padding:0; font:inherit; font-size:14px; color:var(--orange); font-weight:700; cursor:pointer; margin-left:auto; white-space:nowrap; }
.bk-compare[hidden], .bk-mont-compare[hidden] { display:none; }
.bk-chips { display:flex; flex-wrap:wrap; gap:8px; }
.bk-chip { display:inline-flex; gap:6px; align-items:baseline; background:var(--beige); border-radius:20px; padding:6px 12px; font-size:14px; }
.bk-chip small { color:var(--muted); }
.bk-chip--op { background:#fff; border:1px solid var(--k); }
.bk-details-body { margin-top:14px; padding-top:14px; border-top:1px solid var(--line); }
.bk-details-body[hidden] { display:none; }
.bk-static { display:flex; justify-content:space-between; gap:12px; font-size:15px; padding:8px 0; border-bottom:1px solid var(--line); } .bk-static b { font-weight:700; }

/* Montering */
.bk-mont { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.bk-mont__opt { display:flex; gap:10px; align-items:flex-start; border:2px solid var(--line); border-radius:12px; padding:12px 14px; cursor:pointer; font-size:14px; line-height:1.35; }
.bk-mont__opt input { margin-top:3px; } .bk-mont__opt.on { border-color:var(--orange); }
.bk-mont__opt { position:relative; } .bk-mont__opt .pill { position:absolute; top:-10px; left:12px; background:var(--y); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; padding:2px 8px; border-radius:20px; }
.bk-mont { margin-top:6px; }
.bk-mont__opt.is-unavailable { opacity:.55; cursor:default; }
.bk-mont__note { font-size:13px; color:var(--muted); margin:10px 0 0; line-height:1.45; } .bk-mont__note a { color:var(--k); }

.bk-mont-compare { margin-top:12px; }
.bk-mont-compare table { width:100%; border-collapse:collapse; font-size:14px; margin-top:0; background:var(--beige); border-radius:10px; overflow:hidden; }
.bk-mont-compare th,.bk-mont-compare td { text-align:left; padding:8px 10px; border-bottom:1px solid #e6e2d6; vertical-align:top; }
.bk-mont-compare thead th { font-weight:700; } .bk-mont-compare thead th.self { color:var(--orange); } .bk-mont-compare tbody th { font-weight:400; color:#444; width:34%; }

.bk-scroll { overflow-x:auto; -webkit-overflow-scrolling:touch; }
.bk-scroll table { min-width:420px; }
.bk-info-btn { border:0; background:transparent; color:var(--orange); font-size:17px; line-height:1; cursor:pointer; padding:0 2px; margin-left:4px; vertical-align:middle; font-family:inherit; }
.bk-opt .bk-info-btn { margin-left:auto; align-self:flex-start; }
.bk-opt.on .bk-info-btn { color:inherit; }
.bk-opts.has-img .bk-opt.on .bk-info-btn { color:var(--orange); }
.bk-info__box { border-color:var(--line); max-width:560px; }
.bk-info__box h4 { font-size:20px; margin:0 0 10px; font-weight:700; }
.bk-info__box img { max-width:100%; max-height:300px; width:auto; display:block; margin:0 0 12px; border-radius:10px; background:var(--beige); object-fit:contain; }
.bk-info__box p { font-size:15px; line-height:1.55; margin:0 0 10px; }

/* Prisbox */
.bk-side { position:sticky; top:96px; display:flex; flex-direction:column; gap:14px; }
.bk-reviews h3 { font-size:18px; margin:4px 0 10px; display:flex; align-items:center; gap:8px; } .bk-reviews h3 .stars { color:#f5b70c; letter-spacing:1px; font-size:15px; }
.bk-pricebox { border:1px solid var(--line); border-radius:14px; padding:18px 20px; background:#fff; }
.bk-pb-head { display:flex; gap:12px; align-items:flex-start; padding-bottom:12px; border-bottom:1px solid var(--line); }
.bk-pb-head img { width:52px; height:52px; border-radius:10px; object-fit:cover; background:var(--beige); flex:0 0 52px; }
.bk-pb-head b { display:block; font-size:15px; } .bk-pb-head span { font-size:13px; color:var(--muted); line-height:1.35; }
.bk-pb-details { border-bottom:1px solid var(--line); }
.bk-pb-details summary { list-style:none; cursor:pointer; font-size:14px; color:var(--k); padding:10px 0; display:flex; justify-content:space-between; align-items:center; font-weight:700; }
.bk-pb-details summary::-webkit-details-marker { display:none; }
.bk-pb-details[open] summary .chev { transform:rotate(180deg); display:inline-block; }
.bk-pb-details dl { margin:0 0 10px; display:grid; grid-template-columns:auto 1fr; gap:4px 12px; font-size:14px; }
.bk-pb-details dt { color:var(--muted); } .bk-pb-details dd { margin:0; color:var(--k); }
.bk-pb-price { padding:12px 0; border-bottom:1px solid var(--line); }
.bk-pb-price .bk-row { display:flex; justify-content:space-between; align-items:baseline; gap:12px; }
.bk-pb-price .cmp { font-size:15px; color:var(--muted); } .bk-pb-price .cmp s { color:#999; }
.bk-pb-price .save { font-size:15px; color:var(--green); font-weight:700; margin:2px 0 8px; }
.bk-pb-price .main .lbl { font-size:16px; color:var(--k); } .bk-pb-price .lbl em { font-style:normal; color:var(--muted); font-weight:400; font-size:14px; }
.bk-pb-price .main b { font-size:34px; line-height:1.1; }
.bk-pb-price .month { display:block; font-size:14px; color:var(--muted); margin-top:4px; }
.bk-pb-price .mont { display:block; font-size:13px; color:#444; margin-top:8px; padding:6px 8px; background:var(--beige); border-radius:6px; }
.bk-btn--cta { text-transform:uppercase; letter-spacing:.3px; font-size:16px; }
.bk-ic { vertical-align:-3px; margin-right:4px; color:var(--k); }
.bk-delivery .rng { color:var(--muted); font-weight:400; }
.bk-offert { margin-top:14px; padding-top:14px; border-top:1px solid var(--line); }
.bk-offert__title { font-weight:700; font-size:15px; margin:0 0 8px; text-align:center; }
.bk-offert__form { display:flex; gap:8px; }
.bk-offert__form input { flex:1; min-width:0; border:1px solid #ccc; border-radius:10px; padding:10px 12px; font:inherit; font-size:15px; }
.bk-offert__form input:focus { outline:2px solid var(--k); outline-offset:0; border-color:var(--k); }
.bk-offert__form .bk-btn { flex:0 0 auto; padding:10px 14px; font-size:14px; }
.bk-offert__hint { font-size:12px; color:var(--muted); margin:8px 0 0; line-height:1.4; text-align:center; } .bk-offert__hint a { color:var(--k); }
.bk-offert__hint.ok { color:var(--green); font-weight:700; } .bk-offert__hint.err { color:#b91c1c; }
.bk-offert__legal { font-size:12px; color:var(--muted); margin:6px 0 0; line-height:1.4; }
.bk-pb-buy { display:flex; gap:10px; align-items:stretch; padding-top:14px; }
.bk-qtyctl { display:inline-flex; align-items:center; border:1px solid #ccc; border-radius:10px; overflow:hidden; }
.bk-qtyctl button { border:0; background:#fff; width:34px; height:44px; font-size:18px; cursor:pointer; font-family:inherit; }
.bk-qtyctl span { min-width:26px; text-align:center; font-weight:700; }
.bk-qtyctl button:disabled { opacity:.35; cursor:default; }
/* stepper i Detaljer (antal fästen) */
.bk-stepper { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.bk-stepper .bk-stepper__val { min-width:52px; padding:0 4px; font-size:15px; }
.bk-stepper__hint { color:var(--muted); font-size:13px; }
.bk-btn { flex:1; display:inline-flex; align-items:center; justify-content:center; background:#2f7d3b; color:#fff; border:2px solid #2f7d3b; border-radius:10px; padding:11px 18px; font-weight:700; font-size:16px; font-family:inherit; cursor:pointer; text-decoration:none; transition:.15s; }
.bk-btn:hover { background:#256730; border-color:#256730; color:#fff; }
.bk-btn.ghost { background:#fff; color:var(--k); border-color:var(--k); }
.bk-btn.ghost:hover { background:var(--k); color:#fff; }
.bk-btn[disabled] { opacity:.6; cursor:wait; }
.bk-err { color:#b91c1c; font-size:14px; margin:8px 0 0; }
.bk-delivery { font-size:14px; margin:12px 0 0; } .bk-delivery b { color:var(--green); }
.bk-trust { list-style:none; margin:10px 0 0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:4px 10px; font-size:14px; }
.bk-help-line { font-size:14px; margin:10px 0 0; color:#444; } .bk-help-line a { color:var(--k); font-weight:700; }
.bk-reviews { min-height:60px; }

/* Teknisk info – återanvänder pl-tech-klasserna; kompletterande regler om produktlandingens CSS inte finns */
.bk .pl-tech { background:#fff; border:1px solid var(--line); border-radius:18px; padding:32px 34px; margin:40px 0 0; scroll-margin-top:110px; }
.bk { padding-bottom:48px; }
.bk .pl-tech-top { display:grid; grid-template-columns:160px minmax(0,1fr); gap:24px; align-items:start; padding-bottom:22px; border-bottom:1px solid #ddd8c8; }
.bk .pl-tech-top .thumb img { width:100%; border-radius:10px; aspect-ratio:1; object-fit:cover; display:block; }
.bk .pl-tech-top h2 { font-size:22px; margin:0 0 2px; } .bk .pl-tech-top .artnr { font-size:14px; color:var(--muted); margin:0 0 10px; }
.bk .pl-tech-top .desc { font-size:16px; line-height:1.55; color:#333; }
.bk .pl-tech-body { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr); grid-template-areas:"fakta side" "faq side"; gap:0 40px; padding-top:22px; align-items:start; }
.bk .pl-tech-body > div:first-child { grid-area:fakta; } .bk .pl-tech-side { grid-area:side; } .bk .pl-tech-faq { grid-area:faq; margin-top:22px; }
.bk .pl-tech summary { list-style:none; cursor:default; font-size:20px; font-weight:700; margin:0 0 12px; } .bk .pl-tech summary::-webkit-details-marker { display:none; } .bk .pl-tech summary .chev { display:none; }
.bk .pl-facts { width:100%; border-collapse:collapse; font-size:15px; } .bk .pl-facts th { text-align:left; padding:4px 18px 4px 0; vertical-align:top; white-space:nowrap; width:1%; } .bk .pl-facts td { padding:4px 0; color:#333; }
.bk .pl-facts-note { font-size:13px; color:var(--muted); font-style:italic; margin:10px 0 0; }
.bk .pl-docs { list-style:none; margin:0; padding:0; display:grid; gap:8px; } .bk .pl-docs a { display:flex; align-items:center; gap:10px; background:#fff; border:1px solid #ddd8c8; border-radius:8px; padding:10px 14px; color:var(--k); text-decoration:none; font-size:15px; }
.bk .pl-profil { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; } .bk .pl-profil img { width:100%; border-radius:8px; border:1px solid #ddd8c8; background:#fff; display:block; } .bk .pl-profil figcaption { font-size:12px; color:var(--muted); text-align:center; margin-top:4px; }
.bk .pl-tech-side > details + details { margin-top:22px; }
.bk .pl-faq__item { border-top:1px solid #ddd8c8; } .bk .pl-faq__item summary { cursor:pointer; font-size:16px; font-weight:700; padding:12px 0; margin:0; } .bk .pl-faq__item div { font-size:15px; line-height:1.55; padding:0 0 14px; color:#333; }

/* "Konfigurera själv / berätta vad du behöver" ovanför steg 1 */
.bk-mode { display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 8px; font-size:20px; margin:0 0 16px; line-height:1.3; }
.bk-mode__self { font-weight:700; border-bottom:2px solid var(--k); padding-bottom:2px; }
.bk-mode small { font-size:17px; color:var(--muted); }
.bk-mode__or { color:var(--muted); font-size:17px; }
.bk-mode__link { border:0; background:transparent; padding:0 0 2px; font:inherit; font-size:20px; color:var(--k); cursor:pointer; border-bottom:2px solid #8a8f6a; }
.bk-mode__link:hover { border-bottom-color:var(--orange); }


/* Sticky mobil + modal */
.bk-sticky { display:none; }
.bk-modal { position:fixed; inset:0; z-index:100000; background:rgba(0,0,0,.45); display:flex; align-items:center; justify-content:center; padding:16px; }
.bk-modal[hidden] { display:none; }
.bk-modal__box { position:relative; background:#fff; border-radius:16px; padding:26px 24px 20px; max-width:520px; width:100%; border:2px solid #2f7d3b; }
.bk-modal__close { position:absolute; top:8px; right:12px; border:0; background:transparent; font-size:26px; line-height:1; cursor:pointer; color:#666; }
.bk-modal h3 { font-size:22px; display:flex; gap:10px; align-items:center; margin-bottom:14px; }
.bk-modal .ok { display:inline-flex; width:32px; height:32px; border-radius:50%; background:#2f7d3b; color:#fff; align-items:center; justify-content:center; font-size:18px; }
.bk-confirm__item { display:flex; gap:12px; align-items:flex-start; background:var(--beige); border-radius:10px; padding:12px; font-size:15px; line-height:1.4; }
.bk-confirm__item img { width:56px; height:56px; border-radius:8px; object-fit:cover; } .bk-confirm__item b { display:block; } .bk-confirm__item span { color:#444; } .bk-confirm__item small { display:block; color:var(--muted); margin-top:4px; }
.bk-confirm__delivery { font-size:14px; margin:12px 0; } .bk-confirm__delivery b { color:var(--green); }
.bk-modal .bk-btn { width:100%; margin-top:8px; }
.bk-confirm__hint { font-size:13px; color:var(--muted); text-align:center; margin:8px 0 0; }
.bk-confirm__count { font-size:13px; color:#444; text-align:center; margin:6px 0 0; font-weight:700; }

@media (max-width:1199px) { .bk-grid { grid-template-columns:minmax(0,1fr) 340px; } .bk-bundles { grid-template-columns:1fr; } }
@media (max-width:991px) {
  .bk-grid { grid-template-columns:1fr; } .bk-side { position:static; }
  .bk-head h1 { font-size:32px; }
  .bk-gallery__main { height:auto; aspect-ratio:4/3; }
  .bk-dims { grid-template-columns:1fr 1fr; } .bk-addons { grid-template-columns:1fr; } .bk-mont { grid-template-columns:1fr; }
  .bk .pl-tech { padding:22px 18px; border-radius:14px; } .bk .pl-tech-top { grid-template-columns:1fr; gap:14px; } .bk .pl-tech-top .thumb { width:120px; } .bk .pl-tech-body { grid-template-columns:1fr; grid-template-areas:none; gap:0; padding-top:6px; } .bk .pl-tech-body > div:first-child, .bk .pl-tech-side, .bk .pl-tech-faq { grid-area:auto; } .bk .pl-tech-faq { margin-top:0; }
  .bk .pl-tech details { border-top:1px solid #ddd8c8; } .bk .pl-tech details:first-child { border-top:0; }
  .bk .pl-tech summary { cursor:pointer; font-size:16px; padding:14px 0; margin:0; display:flex; justify-content:space-between; align-items:center; } .bk .pl-tech summary .chev { display:inline-block; font-size:11px; transition:transform .2s; } .bk .pl-tech details[open] summary .chev { transform:rotate(180deg); }
  .bk .pl-tech details > *:not(summary) { margin-bottom:16px; } .bk .pl-tech-side > details + details { margin-top:0; }
}
@media (max-width:767px) {
  .bk-step { padding:14px 14px; border-radius:12px; }
  .bk-step h2 { font-size:18px; }
  .bk-swatches { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .bk-dim input { font-size:18px; }
  .bk-sticky { display:flex; position:fixed; left:0; right:0; bottom:0; z-index:900; background:#fff; border-top:1px solid var(--line); padding:10px 15px calc(10px + env(safe-area-inset-bottom)); align-items:center; gap:12px; transform:translateY(110%); transition:transform .25s; }
  .bk-sticky.show { transform:none; }
  .bk-sticky small { display:block; font-size:12px; color:var(--muted); } .bk-sticky b { font-size:18px; }
  .bk-sticky .bk-btn { flex:1; }
  .bk-offert__form { flex-direction:column; } .bk-offert__form .bk-btn { width:100%; }
  .bk-mode { font-size:18px; } .bk-mode__link { font-size:18px; }
  body.bk-has-sticky { padding-bottom:72px; }
}