/* Klyngesiderne (sider_klynger.py, 31/10 2026): genbruger kortene fra bølge 1 (.gaver-grid, .gave) og tilføjer billedfelt, fliser og pris-noter */
.kl .gaver-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.vk .vk-bill{aspect-ratio:1/1; background:#fff; border-radius:var(--r-md); margin:0 0 12px; display:flex; align-items:center; justify-content:center; overflow:hidden}
.vk .vk-bill img{width:100%; height:100%; object-fit:contain}
.vk .vk-tom{background:var(--accent-soft)}
.vk h3{font-size:1rem; line-height:1.3}
.vk .vk-var, .vk .vk-maalt, .vk .vk-udsolgt{margin:0 0 6px; font-size:.82rem; color:var(--ink-3)}
.vk .vk-foer{margin:0 0 6px; font-size:.85rem; color:var(--ink-2); font-weight:700}
.vk .buy .btn{min-height:44px}
.kl-tiles{display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:12px; margin:14px 0 6px}
.kl-tile{display:flex; flex-direction:column; gap:4px; background:var(--surface); border:2px solid var(--line); border-radius:var(--r-md); padding:14px 16px; text-decoration:none; color:var(--ink); min-height:44px}
.kl-tile b{font-family:var(--font-head); font-size:1.05rem}
.kl-tile span{font-size:.85rem; color:var(--ink-3)}
.kl-tile:hover, .kl-tile:focus-visible{border-color:var(--ink-2)}
.kl .jump .btn, .kl .til-puf .btn{min-height:44px}
/* Mobil: vandrette kort (billede til venstre), så en side med 48 varer ikke bliver en meterlang søjle */
@media (max-width:640px){
  .kl .gaver-grid{grid-template-columns:minmax(0,1fr); gap:10px}
  .kl .vk{display:grid; grid-template-columns:96px minmax(0,1fr); column-gap:12px; align-items:start; padding:12px}
  .kl .vk .vk-bill{grid-column:1; grid-row:1 / span 9; width:96px; height:96px; margin:0}
  .kl .vk > :not(.vk-bill){grid-column:2}
  .kl .vk h3{font-size:.95rem; margin-bottom:2px}
  .kl .vk .gave-meta{margin-bottom:4px}
  .kl .vk .buy{margin-top:6px; gap:6px 10px}
  .kl .vk .price{font-size:1.1rem}
}
/* Kategorioversigt nederst på klyngesiderne (interne links til alle sider i klyngerne) */
.kl-kat{display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:14px 20px; margin-top:12px}
.kl-kat > div{display:flex; flex-direction:column}
.kl-kat a{display:flex; align-items:center; min-height:44px; color:var(--ink-2); font-size:.95rem}
.kl-kat a.kl-kat-hub{font-family:var(--font-head); font-weight:800; color:var(--ink)}
/* Sortering og filtre over kortene (klynger.js; skjult uden JS) */
.kl-filtre{display:flex; flex-wrap:wrap; align-items:flex-end; gap:10px 14px; margin:14px 0 4px}
.kl-filtre label{display:flex; flex-direction:column; gap:4px; font-size:.82rem; font-weight:700; color:var(--ink-2)}
.kl-filtre select{min-height:44px; padding:0 34px 0 12px; border:2px solid var(--line); border-radius:var(--r-md); background:var(--surface); color:var(--ink); font:inherit; font-weight:400; font-size:.95rem; max-width:100%}
.kl-filtre .kl-status{flex-basis:100%; display:flex; flex-wrap:wrap; align-items:center; gap:6px 12px}
.kl-filtre .kl-antal{margin:0}
.kl-filtre .kl-nulstil{min-height:44px}
.kl-hop{margin:14px 0 0}
.kl-hop .btn{min-height:44px; display:inline-flex; align-items:center}
/* Prisoverblik pr. butik */
.kl #prisoverblik{margin-top:40px}
.kl-tabel{overflow-x:auto; margin:10px 0 6px}
.kl-tabel table{width:100%; border-collapse:collapse; font-size:.92rem}
.kl-tabel th, .kl-tabel td{padding:10px 12px; border-bottom:1px solid var(--line); text-align:left}
.kl-tabel thead th{font-size:.8rem; color:var(--ink-3); font-weight:700}
.kl-tabel td{font-variant-numeric:tabular-nums}
/* Link til vores udvalgte modeller */
.kl-udvalg{background:var(--accent-soft); border-radius:var(--r-md); padding:16px 18px; margin:22px 0 6px}
.kl-udvalg h2{margin-top:0; font-size:1.15rem}
.kl-udvalg p{margin:0}
@media (max-width:640px){
  .kl-filtre label{flex:1 1 calc(50% - 7px); min-width:0}
  .kl-filtre label:first-child, .kl-filtre .kl-bred{flex-basis:100%}  /* sortering og prisbånd har de længste tekster */
  .kl-filtre select{width:100%}
  .kl-tabel th, .kl-tabel td{padding:9px 8px}
}
.vk .vk-ogsaa{margin:8px 0 0; font-size:.85rem; color:var(--ink-2)}
.vk .vk-ogsaa a{color:var(--ink); font-weight:700}