/* 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; line-height:1.6; }
.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-head__more { display:inline-block; margin-top:6px; font-size:15px; color:var(--k); text-decoration:underline; text-underline-offset:3px; }   /* "Se produktdetaljer ↓" under rubriken (2026-10-01) */
.bk-head__more:hover { color:var(--orange); }
.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; }
/* EN box (BILLY_KONFIG_ONE_BOX): stegen ligger i samma vita kort, skilda av en tunn linje. Lugnare förstaintryck. */
.bk-form--one { gap:0; background:#fff; border:1px solid var(--line); border-radius:14px; overflow:hidden; }
.bk-form--one .bk-step { border:0; border-radius:0; border-top:1px solid var(--line); padding:22px 22px 24px; }
.bk-form--one .bk-step:first-of-type { border-top:0; }
.bk-form--one > .bk-again { margin:0; padding:18px 22px 0; }
.bk-form--one > .bk-again { background:transparent; border:0; border-radius:0; color:#1f5a2a; }
.bk-form--one > .bk-again[hidden] { display:none; }
/* Linjen mellan förstegen och notiserna: dolda #bk-again räknas som syskon, därför :not([hidden]). */
.bk-form--one > .bk-step ~ .bk-again:not([hidden]) { border-top:1px solid var(--line); }
.bk-form--one > .bk-again:not([hidden]) + .bk-step { border-top:0; }

.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; height:48px; box-sizing:border-box; }   /* samma höjd som select nedan (2026-09-26) */
.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%; height:100%; font:inherit; font-size:20px; font-weight:700; padding:0; margin: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; }
/* Temats gamla #custom_length-regel (style.css, id-specificitet) gav 15px padding, radie 25px och tog bort pilen – id:t tas med här för att vinna. */
.bk-dim select, .bk-dim select#custom_length { width:100%; border:1px solid #ccc; border-radius:10px; height:48px; box-sizing:border-box; padding:0 40px 0 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:normal; cursor:pointer; border-radius:10px; }
.bk-dim select:focus, .bk-dim select#custom_length: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-dim .range--err { display:none; } .bk-dim.is-bad .range--err { display:block; }   /* markiser: gränserna syns bara vid fel */
.bk-dim .range--note[hidden] { display:none; } .bk-dim .range--note { color:#b45309; }   /* utfall byttes automatiskt – syns bara då */
.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; }
.bk-help__head { font-size:17px; font-weight:700; margin:4px 0 10px; }   /* "Snabbguide" + länk till måttsidan (2026-10-01) */
.bk-video + .bk-help__head { margin-top:16px; }
.bk-help__more { display:inline-block; margin-top:14px; font-weight:700; color:var(--k); text-decoration:underline; text-underline-offset:3px; }
.bk-help__more:hover { color:var(--orange); }
/* 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, .bk-opt .pill.alt { background:var(--k); color:#fff; }   /* svart etikett (t.ex. Trendig, Prisvärd) */
.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; border:0; font-family:inherit; color:var(--k); cursor:pointer; }
button.bk-chip:hover { background:#e9e7df; } button.bk-chip:focus-visible { outline:2px solid var(--k); outline-offset:2px; }
.bk-detail.is-flash { background:#fff8d6; box-shadow:0 0 0 6px #fff8d6; border-radius:6px; transition:background .6s, box-shadow .6s; }
.bk-chip small { color:var(--muted); }
.bk-chip--op { background:#fff; border:1px solid var(--k); cursor:default; }
.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 */
/* Högerkolumnen: sticky med egen scroll (2026-09-26). Kolumnen (prisbox + omdömen) är högre än skärmen, och en vanlig sticky
   låser då toppen så att omdömena aldrig nås förrän sidan är slut. Med max-höjd och egen rullning ligger prisboxen kvar och
   kunden kan rulla omdömena inuti kolumnen. Ta bort max-height/overflow-y för att gå tillbaka till vanlig sticky. */
.bk-side { position:sticky; top:96px; display:flex; flex-direction:column; gap:14px; max-height:calc(100vh - 110px); overflow-y:auto; overflow-x:hidden; scrollbar-width:thin; scrollbar-color:#c9c6bd transparent; padding:2px 6px 8px 2px; margin:-2px -6px 0 -2px; }
.bk-side::-webkit-scrollbar { width:6px; } .bk-side::-webkit-scrollbar-thumb { background:#c9c6bd; border-radius:3px; } .bk-side::-webkit-scrollbar-track { background:transparent; }
.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-reviews { min-height:60px; }
/* EmbedSocial-iframen har egen inre marginal, så omdömeskortet blir smalare än prisboxen (ca 12px per sida på desktop, ca 30px på mobil)
   och får ett tomrum upptill. Vi kan inte styla inuti iframen – kompensera med negativ marginal så kortet linjerar med boxen. */
.bk-reviews .embedsocial-hashtag { margin:-22px 0 0; }
@media (max-width:991px) {
  /* Klipp vid sidans kant (inte vid asiden) så pilarna inte kapas men sidan aldrig scrollar i sidled. Iframen har även ~30px tomrum nedtill. */
  .bk-reviews .embedsocial-hashtag { margin:-22px -25px -50px; } .bk { overflow-x:clip; }
  .bk .pl-tech { margin-top:16px; } .bk .pl-tech-reviews { display:none; }   /* omdömena visas redan strax ovanför på mobil */
}

/* 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%; height:auto; border-radius:10px; display:block; background:#fff; }   /* hela bilden, ingen kvadratisk beskärning (2026-09-26) */
.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"; grid-template-rows:auto 1fr; gap:0 40px; padding-top:22px; align-items:start; }   /* auto 1fr: högerkolumnens extra höjd hamnar bara i rad 2, så Bra att veta ligger dikt an under Varufakta */
.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-tech-reviews .embedsocial-hashtag { margin:-14px -12px -50px; }   /* widgetens egna marginaler (som i högerkolumnen) */
.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; }
/* Pil som visar öppet/stängt på alla dragspel i faktarutan: Läs mer-knappen, frågorna i den och Bra att veta (2026-10-01) */
.bk .pl-faq__item > summary { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.bk .pl-faq__item > summary::after { content:""; flex:none; width:8px; height:8px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(45deg); margin:-4px 4px 0 0; transition:transform .2s; }
.bk .pl-faq__item[open] > summary::after { transform:rotate(-135deg); margin-top:4px; }
.bk .billy-more > .pl-faq__item > summary { justify-content:flex-start; gap:10px; }   /* knappen: pilen direkt efter texten */
.bk .billy-body .pl-faq__item > summary { font-size:15px; }
/* «Les mer om …» i beskrivelsen (content/content-{pid}.php): brødtekst + «Vis mindre» når den er åpen. Sverige har dette i seo.php (inline CSS); Norge har ikke seo.php (2026-10-02). */
.bk .billy-more { margin:14px 0 0; }
.bk .billy-more > details > summary { font-weight:700; font-size:15px; }
.bk .billy-more > details[open] > summary .billy-more__lbl { display:none; }
.bk .billy-more > details[open] > summary::before { content:"Vis mindre"; }
.bk .billy-body .pl-faq__item p { margin:0; }
.bk .billy-body { padding-top:4px; }
.bk .billy-body h3 { font-size:17px; line-height:1.3; font-weight:700; margin:26px 0 8px; letter-spacing:0; }
.bk .billy-body h3:first-child { margin-top:8px; }
.bk .billy-body h4 { font-size:15px; line-height:1.35; font-weight:700; margin:18px 0 4px; letter-spacing:0; }
.bk .billy-body p { margin:0 0 12px; line-height:1.65; font-size:15px; }
.bk .billy-body ul { margin:0 0 14px; padding-left:20px; }
.bk .billy-body li { margin:6px 0; line-height:1.6; }
.bk .billy-body a { text-decoration:underline; }
@media (max-width:700px) { .bk .billy-body h3 { font-size:16px; margin:22px 0 6px; } .bk .billy-body p, .bk .billy-body li { font-size:14.5px; } }

/* "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:18px 0 -2px; line-height:1.3; }   /* ovanför formuläret; .bk-form har margin-top 14px */
.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; max-height:none; overflow:visible; padding:0; margin:0; }
  .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:100%; max-width:260px; } .bk .pl-tech-body { grid-template-columns:1fr; grid-template-areas:none; grid-template-rows: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-crumbs { font-size:11px; letter-spacing:.4px; padding:12px 0 6px; } .bk-crumbs span { margin:0 4px; }
  .bk-step { padding:14px 14px; border-radius:12px; }
  .bk-form--one { border-radius:12px; } .bk-form--one .bk-step { padding:16px 14px 18px; border-radius:0; } .bk-form--one > .bk-again { padding:14px 14px 0; }
  .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; }
}

/* Montering: Oslo-badge (Norge – montering tilbys bare i Oslo-området) */
.bk-mont__area { display:flex; align-items:flex-start; gap:10px; margin:0 0 14px; font-size:15px; line-height:1.45; color:var(--muted,#555); }
.bk-pill-area { display:inline-flex; align-items:center; gap:5px; flex:0 0 auto; padding:4px 10px; border-radius:20px; background:#232323; color:#fff; font-size:12px; font-weight:700; white-space:nowrap; }
.bk-pill-area svg { color:#F9DF4B; }
/* Norsk mal: «Spørsmål? 23 96 43 65» under prisboksen (finnes ikke i SE 26.9) */
.bk-help-line { font-size:14px; margin:10px 0 0; color:#444; } .bk-help-line a { color:var(--k); font-weight:700; }

/* Måleguiden («Det er lett å måle!»): ACF-teksten inneholder h4/strong fra gammel side – tonet ned til brødtekststørrelse (Mikkel 2026-09-27) */
.bk-help__body { font-size:14px; }
.bk-help__text h2, .bk-help__text h3, .bk-help__text h4, .bk-help__text h5, .bk-help__text h6 { font-size:15px; line-height:1.4; font-weight:700; margin:14px 0 4px; letter-spacing:0; text-transform:none; }
.bk-help__text h2:first-child, .bk-help__text h3:first-child, .bk-help__text h4:first-child { margin-top:0; }
.bk-help__text p, .bk-help__text li { font-size:14px; }
.bk-help__text p > strong:first-child { font-size:14px; }

/* ================================================================
   Staplede pakker og montering, detaljruter med velger (fra SE 2026-09-28, portert 2026-10-02)
   Gjelder bare når BILLY_KONFIG_TIERS er på (roten får klassen bk--tiers).
   ================================================================ */
.bk--tiers .bk-step h2 .n { display:none; }   /* inga stegnummer */
.bk-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.bk-ico { width:22px; height:22px; flex:0 0 22px; }
.bk-ico--ok circle { fill:var(--green); } .bk-ico--ok path { fill:none; stroke:#fff; stroke-width:2.3; stroke-linecap:round; stroke-linejoin:round; }
.bk-ico--no circle { fill:none; stroke:#a9a69c; stroke-width:1.5; } .bk-ico--no path { stroke:#a9a69c; stroke-width:1.6; stroke-linecap:round; }

.bk-tiers { display:flex; flex-direction:column; gap:14px; }
.bk--tiers .bk-tier { display:grid; grid-template-columns:1fr auto; grid-template-areas:"badge badge" "name price" "checks price" "desc desc" "more more";
  gap:4px 20px; position:relative; border:1.5px solid var(--line); border-radius:14px; padding:18px 22px 16px; background:#fff; cursor:pointer; font-size:inherit; line-height:1.4; margin:0; font-weight:400; }
.bk--tiers .bk-tier:hover { border-color:#c9c6ba; }
.bk--tiers .bk-tier.on { border:2px solid var(--orange); box-shadow:0 0 0 3px rgba(239,84,21,.12); }
.bk--tiers .bk-tier:has(input:focus-visible) { outline:3px solid var(--k); outline-offset:2px; }
.bk--tiers .bk-tier input { position:absolute; opacity:0; pointer-events:none; }
.bk--tiers .bk-tier.is-unavailable { opacity:.55; cursor:not-allowed; }
.bk-tier__badge { grid-area:badge; justify-self:start; font-size:12px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; padding:4px 11px; border-radius:999px; margin-bottom:8px; background:var(--k); color:#fff; }
.bk-tier__badge.is-yellow { background:var(--y); color:var(--k); }
.bk-tier__name { grid-area:name; display:flex; align-items:center; gap:12px; }
.bk--tiers .bk-tier__name strong { font-size:22px; font-weight:700; line-height:1.2; }
.bk-tier__radio { width:22px; height:22px; border-radius:50%; border:2px solid #b8b5aa; flex:0 0 auto; display:grid; place-items:center; background:#fff; }
.bk--tiers .bk-tier.on .bk-tier__radio { border-color:var(--orange); }
.bk--tiers .bk-tier.on .bk-tier__radio::after { content:""; width:10px; height:10px; border-radius:50%; background:var(--orange); }
.bk-tier__price { grid-area:price; text-align:right; }
.bk-tier__price b { display:block; font-size:22px; white-space:nowrap; }
.bk-tier__price em { display:block; font-style:normal; font-size:13px; color:var(--muted); white-space:nowrap; }
.bk--tiers .bk-tier__checks { grid-area:checks; list-style:none; margin:10px 0 0; padding:0 0 0 34px; display:flex; flex-direction:column; gap:8px; font-size:16px; color:var(--k); }
.bk--tiers .bk-tier__checks li { display:flex; gap:10px; align-items:flex-start; margin:0; line-height:1.35; }
.bk--tiers .bk-tier__checks li[hidden] { display:none; }
.bk-tier__checks .bk-ico { margin-top:-1px; }
.bk-tier__desc { grid-area:desc; display:block; margin:10px 0 0 34px; font-size:15px; color:#45433e; }
.bk-tier__more { grid-area:more; justify-self:start; margin:6px 0 0 34px; border:0; background:none; font:inherit; font-size:15px; color:var(--k); text-decoration:underline; text-underline-offset:3px; cursor:pointer; padding:0; }
.bk--tiers .bk-tier .bk-motor-addon { grid-column:1 / -1; margin-top:10px; }

/* Detaljrutor */
.bk-dtiles { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.bk-dtile { display:flex; align-items:center; justify-content:space-between; gap:12px; text-align:left; border:1.5px solid var(--line); border-radius:12px; background:#fff; padding:12px 16px; min-height:64px; font:inherit; color:var(--k); cursor:pointer; }
.bk-dtile:hover { border-color:#c9c6ba; }
.bk-dtile:focus-visible { outline:3px solid var(--k); outline-offset:2px; }
.bk-dtile small { display:block; font-size:14px; color:var(--muted); line-height:1.2; }
.bk-dtile b { display:block; font-size:18px; line-height:1.3; }
.bk-dtile i { font-style:normal; font-size:14px; text-decoration:underline; text-underline-offset:3px; white-space:nowrap; }
.bk--tiers #bk-details-body { display:none !important; }

/* Tillval: rubrik lika stor som valda detaljvärden */
.bk--tiers .bk-addon { font-size:15px; padding:14px 16px; border-radius:12px; align-items:center; }
.bk--tiers .bk-addon .txt b { display:inline-block; font-size:18px; line-height:1.3; margin-bottom:2px; }
.bk--tiers .bk-addon .add { font-size:17px; }
.bk--tiers .bk-addon input { margin-top:0; }

/* Dialoger (Se vad som ingår + detaljväljare) */
.bk-dlg { border:0; border-radius:18px; padding:0; width:min(760px, calc(100vw - 24px)); max-height:calc(100vh - 32px); background:var(--beige); color:var(--k); box-shadow:0 20px 60px rgba(0,0,0,.25); }
.bk-dlg::backdrop { background:rgba(20,20,20,.55); }
.bk-dlg__in { padding:30px 32px 26px; position:relative; }
.bk-dlg h3 { font-size:30px; margin:0 50px 10px 0; font-weight:700; line-height:1.15; }
.bk-dlg__lead { font-size:17px; margin:0 0 20px; color:#3d3b36; max-width:62ch; }
.bk-dlg__x { position:absolute; top:18px; right:18px; width:44px; height:44px; border-radius:50%; border:1px solid #cfccc2; background:#fff; cursor:pointer; display:grid; place-items:center; color:var(--k); padding:0; }
.bk-dlg__swipe { display:none; margin:0 0 8px; font-size:15px; font-weight:700; background:var(--y); border-radius:8px; padding:8px 12px; }
.bk-dlg .bk-scroll { overflow-x:auto; }
.bk-dlg__table { width:100%; border-collapse:collapse; min-width:520px; font-size:16px; background:transparent; }
.bk-dlg__table th, .bk-dlg__table td { padding:13px 8px; border-bottom:1px solid #d9d6cc; }
.bk-dlg__table thead th { font-size:18px; text-align:center; border-bottom:2px solid var(--k); }
.bk-dlg__table thead th small { display:block; font-size:14px; font-weight:400; color:var(--muted); }
.bk-dlg__table tbody th { text-align:left; font-weight:500; }
.bk-dlg__table td { text-align:center; font-size:15px; }
.bk-dlg__table td .bk-ico { display:inline-block; vertical-align:middle; }
.bk-dlg__table .is-feat { background:rgba(249,223,75,.3); }
.bk-dlg__qty { margin-top:20px; background:#fff; border-radius:12px; padding:16px 18px; }
.bk-dlg__qty > b { display:block; font-size:17px; margin-bottom:10px; }
.bk-dlg__qtyrow { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-bottom:10px; }
.bk-dlg__qtyrow span { border:1px solid var(--line); border-radius:10px; padding:10px; text-align:center; font-size:22px; font-weight:700; }
.bk-dlg__qtyrow em { display:block; font-style:normal; font-size:14px; font-weight:400; color:var(--muted); }
.bk-dlg__qty small { font-size:14px; color:var(--muted); }
.bk-dlg__foot { margin:16px 0 0; font-size:14px; color:var(--muted); }
/* Detaljväljaren: det riktiga fältet visas stort */
.bk-dlg--detail { width:min(520px, calc(100vw - 24px)); }
.bk-dlg--detail .bk-detail { border:0; margin:0; padding:0; min-width:0; background:transparent; }
.bk-dlg--detail .bk-detail legend { font-size:28px; font-weight:700; margin:0 50px 14px 0; padding:0; line-height:1.15; }
.bk-dlg--detail .bk-detail legend .nt { display:block; font-size:16px; font-weight:400; color:#3d3b36; margin-top:8px; }
.bk-dlg--detail .bk-detail legend .nt[hidden] { display:none; }
.bk-dlg--detail .bk-info-btn { display:none; }
.bk-dlg__info { margin-top:18px; display:flex; flex-direction:column; gap:12px; }
.bk-dlg__infoitem { background:#fff; border-radius:12px; padding:14px 16px; font-size:15px; line-height:1.5; color:#3d3b36; }
.bk-dlg__infoitem h4 { font-size:17px; margin:0 0 6px; color:var(--k); }
.bk-dlg__infoitem img { display:block; width:100%; height:auto; border-radius:8px; margin:6px 0 10px; }
.bk-dlg__infoitem p { margin:0 0 8px; } .bk-dlg__infoitem p:last-child { margin-bottom:0; }
.bk-dlg--detail .bk-opts { flex-direction:column; gap:10px; }
.bk-dlg--detail .bk-opts .bk-opt, .bk-dlg--detail .bk-opts.has-img .bk-opt { flex:0 0 auto; align-items:center; min-height:0; }   /* flex-basis 220px blev höjd i kolumn */
.bk-dlg--detail .bk-opt img { width:56px; height:56px; flex:0 0 56px; }
.bk-dlg--detail .bk-opt { position:relative; width:100%; border-radius:12px; border:1.5px solid var(--line); padding:14px 16px 14px 50px; font-size:16px; background:#fff; color:var(--k); }
.bk-dlg--detail .bk-opt::before { content:""; position:absolute; left:16px; top:50%; width:22px; height:22px; margin-top:-11px; border-radius:50%; border:2px solid #b8b5aa; background:#fff; box-sizing:border-box; }
.bk-dlg--detail .bk-opt.on { background:#fff; color:var(--k); border:2px solid var(--orange); }
.bk-dlg--detail .bk-opt.on::before { border-color:var(--orange); background:radial-gradient(circle, var(--orange) 0 5px, #fff 6px); }
.bk-dlg--detail .bk-opt b { font-size:18px; }
.bk-dlg--detail .bk-opt small { font-size:14px; color:var(--muted); }
.bk-dlg--detail .bk-opt .pill { position:static; order:2; margin-left:auto; }
.bk-dlg--detail .bk-opts.has-img .bk-opt { padding-left:50px; }
.bk-dlg--detail .bk-stepper { display:flex; flex-direction:column; align-items:center; gap:10px; }
.bk-dlg--detail .bk-stepper__ctl button { width:56px; height:56px; font-size:28px; }
.bk-dlg--detail .bk-stepper__val { font-size:28px; font-weight:700; min-width:90px; text-align:center; }
.bk-dlg--detail .bk-stepper__hint { font-size:15px; text-align:center; }
.bk-dlg__done { display:block; width:100%; margin-top:18px; border:0; border-radius:10px; background:var(--k); color:#fff; font:inherit; font-size:17px; font-weight:700; padding:14px; cursor:pointer; }
.bk-dlg__done[hidden] { display:none; }

@media (max-width:600px) {
  .bk--tiers .bk-tier { grid-template-columns:1fr; grid-template-areas:"badge" "name" "price" "checks" "desc" "more"; padding:14px 14px 12px; }
  .bk-tier__price { text-align:left; margin:4px 0 0 34px; }
  .bk-tier__price b { display:inline; margin-right:6px; font-size:20px; }
  .bk-tier__price em { display:inline; }
  .bk--tiers .bk-tier__name strong { font-size:20px; }
  .bk-dtiles { grid-template-columns:1fr; }
  .bk-dlg__in { padding:22px 16px 20px; }
  .bk-dlg h3, .bk-dlg--detail .bk-detail legend { font-size:24px; }
  .bk-dlg__swipe { display:block; }
}

/* Egne anmeldelseskort i stedet for EmbedSocial (2026-10-02) – samme kortstil som forsiden (home-2026.css .rv-card), kompakt */
.bk-rvs { display:grid; gap:10px; margin-top:4px; }
.bk-rv { background:#fff; border:1.5px solid #e3e1d9; border-radius:14px; padding:14px 16px; display:flex; flex-direction:column; gap:8px; }
.bk-rv__img { width:calc(100% + 32px); max-width:none; margin:-14px -16px 2px; aspect-ratio:4/3; object-fit:cover; border-radius:12px 12px 0 0; display:block; height:auto; }
.bk-rv__who { display:flex; align-items:center; gap:10px; }
.bk-rv__who > span { display:flex; flex-direction:column; line-height:1.2; }
.bk-rv__who b { font-size:15px; }
.bk-rv__av { width:36px; height:36px; border-radius:50%; object-fit:cover; flex:none; }
.bk-rv__av--i { display:grid; place-items:center; background:#F2F1EC; font-size:13px; font-weight:700; color:#232323; }
.bk-rv__stars { color:#f5b301; font-size:14px; letter-spacing:1px; } .bk-rv__stars .off { color:#d6d3cb; }
.bk-rv__txt { font-size:15px; line-height:1.45; color:#333; display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; }
.bk-rv__txt.is-open { display:block; -webkit-line-clamp:unset; overflow:visible; }
.bk-rv__more { align-self:flex-start; background:none; border:0; padding:0; font:inherit; font-size:14px; font-weight:700; text-decoration:underline; text-underline-offset:3px; cursor:pointer; color:#232323; }
.bk-rv__foot { display:flex; justify-content:space-between; gap:10px; font-size:13px; color:#62605a; border-top:1px solid #eee; padding-top:8px; }
.bk-rv__src { color:#0f9d58; font-weight:700; white-space:nowrap; }
.bk-rv-all { display:inline-block; margin-top:10px; font-size:15px; font-weight:700; color:#232323; text-decoration:underline; text-underline-offset:3px; }
.bk-reviews h3 { margin-bottom:10px; }

/* Detalj som eget steg med kort (plissétype, Mikkel 2026-10-02): bilde, beskrivelse synlig, tydelig «Les mer» */
.bk-opts--cards { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.bk .bk-opts--cards .bk-opt--card { flex-direction:column; align-items:stretch; gap:10px; padding:14px 16px 16px; border:1.5px solid var(--line); border-radius:14px; background:#fff; color:var(--k); font-size:16px; box-shadow:none; }
.bk .bk-opts--cards .bk-opt--card:hover { border-color:#c9c6ba; }
.bk .bk-opts--cards .bk-opt--card.on { border:2px solid var(--orange); box-shadow:0 0 0 3px rgba(239,84,21,.12); background:#fff; color:var(--k); }
.bk-opt--card img { width:100%; height:150px; object-fit:contain; border-radius:10px; background:var(--beige); }
.bk-opt--card .bk-opt__txt { display:flex; flex-direction:column; gap:6px; }
.bk-opt__name { display:flex; align-items:center; gap:10px; }
.bk-opt__name b { font-size:18px; font-weight:700; line-height:1.25; }
.bk-opt__radio { width:20px; height:20px; border-radius:50%; border:2px solid #b8b5aa; flex:0 0 auto; display:grid; place-items:center; background:#fff; }
.bk-opt--card.on .bk-opt__radio { border-color:var(--orange); }
.bk-opt--card.on .bk-opt__radio::after { content:""; width:10px; height:10px; border-radius:50%; background:var(--orange); }
.bk-opt__desc { font-size:16px; line-height:1.5; color:#3d3b36; }
.bk-opt__desc p { margin:0 0 6px; } .bk-opt__desc p:last-child { margin-bottom:0; }
.bk .bk-opt--card .bk-info-btn.bk-more { align-self:flex-start; margin:2px 0 0; padding:0; font-size:16px; font-weight:700; color:var(--k); text-decoration:underline; text-underline-offset:3px; }
.bk-opt--card .pill { z-index:1; }
.bk-opt--card.is-disabled { opacity:.5; }
@media (max-width:600px) {
  .bk-opts--cards { grid-template-columns:1fr; gap:16px; }
  .bk .bk-opts--cards .bk-opt--card:has(> img) { display:grid; grid-template-columns:96px 1fr; gap:12px; align-items:start; }   /* bare kort med bilde */
  .bk-opt--card img { width:96px; height:96px; }
  .bk-opt__name b { font-size:17px; }
}


/* «Les mer»-popup: aldri høyere enn skjermen – innholdet scroller, lukkeknappen blir stående (Mikkel 2026-10-03) */
.bk-info__box { max-height:calc(100vh - 32px); max-height:calc(100dvh - 32px); overflow-y:auto; -webkit-overflow-scrolling:touch; }
.bk-info__box .bk-modal__close { position:sticky; top:0; float:right; z-index:2; width:40px; height:40px; margin:-14px -12px 0 0; border-radius:50%; background:#fff; box-shadow:0 1px 6px rgba(0,0,0,.15); color:#232323; }
/* Pedagogisk innhold: foto → hva det er → slik åpnes den → fakta → velg */
.bk-pop h4 { font-size:22px; margin:0 0 6px; }
.bk-info__box img.bk-pop__photo { width:100%; max-height:none; height:auto; object-fit:contain;   /* hele bildet – festet øverst og festeskoene nederst må synes */ border-radius:12px; margin:0 0 6px; background:var(--beige); }
.bk-info__box .bk-pop__cap { font-size:13px; color:var(--muted); margin:0 0 14px; line-height:1.4; }
.bk-pop__lead { font-size:16px !important; line-height:1.5; margin:0 0 14px !important; color:#3d3b36; }
.bk-pop__how { display:flex; gap:14px; align-items:center; background:var(--beige); border-radius:12px; padding:12px 14px; margin:0 0 14px; }
.bk-info__box .bk-pop__how img { width:64px; height:64px; flex:0 0 64px; margin:0; max-height:none; background:#fff; border-radius:8px; }
.bk-pop__how p { margin:0 !important; font-size:15px; line-height:1.45; }
.bk-pop__how b { display:block; font-size:15px; margin-bottom:2px; }
.bk-pop__facts { margin:0 0 16px; }
.bk-pop__facts > div { display:grid; grid-template-columns:130px 1fr; gap:12px; padding:10px 0; border-top:1px solid var(--line); }
.bk-pop__facts dt { font-weight:700; font-size:15px; }
.bk-pop__facts dd { margin:0; font-size:15px; line-height:1.5; color:#3d3b36; }
.bk-pop__facts dd b { color:var(--k); }
.bk-pop__pick { width:100%; }
@media (max-width:600px) {
  .bk-modal:has(.bk-info__box) { padding:10px; }
  .bk-info__box { padding:20px 16px 16px; max-height:calc(100vh - 20px); max-height:calc(100dvh - 20px); }
  .bk-pop__facts > div { grid-template-columns:1fr; gap:2px; }
}
