/* Kategoriside v2 (TASK-264). Markup: scripts/build-category-v2.py, data-lc-template="category-v2". */
.cv2 { --cv2-ink: #111827; --cv2-muted: #4b5563; --cv2-line: var(--color-border, #e5e7eb); --cv2-tint: #eff6ff; color: var(--cv2-ink); }
.cv2 .container { max-width: 1120px; }
.cv2-hero {
    background: radial-gradient(900px 320px at 85% -10%, rgba(37, 99, 235, .14), transparent 70%), linear-gradient(180deg, var(--cv2-tint) 0%, #fff 100%);
    border-bottom: 1px solid var(--cv2-line);
}
.cv2-hero__inner { display: grid; gap: 1.5rem 2.5rem; align-items: center; padding-block: 1rem 1.5rem; }
.cv2-hero--img .cv2-hero__inner { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); }
.category-hero--noimg .cv2-hero__inner { padding-block: 1rem 1.25rem; }
.cv2-hero .breadcrumbs { margin-bottom: .6rem; }
.cv2-hero__title { font-size: clamp(1.5rem, 3vw, 2.1rem); line-height: 1.15; letter-spacing: -.02em; margin: 0 0 .6rem; text-wrap: balance; }
.cv2-hero__price { margin: 0 0 .9rem; font-size: 1.1rem; line-height: 1.5; }
.cv2-hero__price strong { font-size: 1.35rem; }
.cv2-hero__price small { display: block; color: var(--cv2-muted); font-size: .85rem; margin-top: .15rem; }
.cv2-hero__actions { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }
.cv2-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 0 1.3rem; border-radius: 999px; font-weight: 600; text-decoration: none; background: var(--color-primary); color: #fff; }
.cv2-btn:hover { background: var(--color-primary-hover); color: #fff; }
.cv2-btn--ghost { background: #fff; color: var(--cv2-ink); border: 1px solid #d1d5db; }
.cv2-btn--ghost:hover { color: var(--color-primary); border-color: var(--color-primary); background: #fff; }
.cv2-hero__media { margin: 0; }
.cv2-hero__media img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 18px; box-shadow: 0 18px 40px -18px rgba(17, 24, 39, .45); }

.cv2-sec { padding-block: 1.5rem; }
.cv2-sec > h2, .cv2-sec .price-facts__title { font-size: 1.45rem; margin: 0 0 .5rem; }
.cv2-lead { margin: 0 0 1rem; color: var(--cv2-muted); max-width: 70ch; }
.cv2-answer dl { margin: 0; display: grid; gap: .9rem 2rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cv2-qa { margin: 0; }
.cv2-answer dt { font-weight: 600; margin: 0 0 .2rem; }
.cv2-answer dd { margin: 0; color: #1f2937; }

.cv2-tablewrap { overflow-x: auto; border: 1px solid var(--cv2-line); border-radius: 12px; background: #fff; }
.cv2-tablewrap { background: linear-gradient(to right, #fff 30%, rgba(255,255,255,0)), linear-gradient(to left, #fff 30%, rgba(255,255,255,0)) 100% 0, radial-gradient(farthest-side at 0 50%, rgba(0,0,0,.18), rgba(0,0,0,0)), radial-gradient(farthest-side at 100% 50%, rgba(0,0,0,.18), rgba(0,0,0,0)) 100% 0; background-repeat: no-repeat; background-size: 40px 100%, 40px 100%, 14px 100%, 14px 100%; background-attachment: local, local, scroll, scroll; }
@media (max-width: 640px) { .cv2-table .hide-sm { display: none; } }
.cv2-table { width: 100%; border-collapse: collapse; font-size: .95rem; }
.cv2-table th, .cv2-table td { padding: .6rem .8rem; text-align: left; border-bottom: 1px solid var(--cv2-line); vertical-align: top; }
.cv2-table th { background: #f9fafb; font-weight: 600; font-size: .85rem; }
.cv2-table tr:last-child td { border-bottom: 0; }
.cv2-table td.num, .cv2-table th.num { text-align: right; white-space: nowrap; }
.cv2-table tfoot td { font-weight: 700; background: #f9fafb; }
.cv2-note { color: var(--cv2-muted); font-size: .85rem; margin: .6rem 0 0; max-width: 75ch; }
.cv2-sec .price-facts { margin: 1rem 0 0; }

.cv2-vendors { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: .5rem .75rem; }
.cv2-vendors li { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .55rem .8rem; border: 1px solid var(--cv2-line); border-radius: 10px; background: #fff; min-height: 52px; }
.cv2-vendors__name { font-weight: 600; text-decoration: none; color: var(--cv2-ink); }
.cv2-vendors__name:hover { color: var(--color-primary); }
.cv2-vendors__city { display: block; font-size: .8rem; color: var(--cv2-muted); font-weight: 400; }
.cv2-vendors__ask { font-size: .85rem; font-weight: 600; white-space: nowrap; min-height: 44px; min-width: 44px; padding: 0 .85rem; display: inline-flex; align-items: center; justify-content: center; text-decoration: none; border: 1px solid var(--cv2-line); border-radius: 8px; color: var(--cv2-ink); background: #fff; }
.cv2-vendors__ask:hover { border-color: var(--color-primary); color: var(--color-primary); }
.cv2-more { margin-top: .75rem; }
.cv2-more > summary { cursor: pointer; font-weight: 600; color: var(--color-primary); min-height: 44px; display: flex; align-items: center; }
.cv2-more .cv2-vendors { margin-top: .5rem; }
.cv2-links { display: flex; flex-wrap: wrap; gap: .5rem .75rem; list-style: none; margin: 0; padding: 0; }
.cv2-links a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 1rem; border: 1px solid var(--cv2-line); border-radius: 999px; text-decoration: none; color: var(--cv2-ink); background: #fff; }
.cv2-links a:hover { border-color: var(--color-primary); color: var(--color-primary); }

@media (max-width: 860px) {
    .cv2-hero--img .cv2-hero__inner { grid-template-columns: 1fr; }
    .cv2-answer dl { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
    .cv2-table { font-size: .875rem; }
    .cv2-table th, .cv2-table td { padding: .5rem .55rem; }
}

.category-hero--noimg .cv2-hero__inner { padding-block: .75rem 1rem; }
.category-hero--noimg .cv2-hero__price { margin-bottom: .6rem; }
.category-hero--noimg .cv2-hero__price small { display: none; }
@media (max-width: 480px) {
    .category-hero--noimg .cv2-hero__title { font-size: 1.35rem; margin-bottom: .4rem; }
    .category-hero--noimg .breadcrumbs { display: none; }
    .category-hero--noimg .cv2-hero__actions .cv2-btn--ghost { display: none; }
    .category-hero--noimg .cv2-hero__price { font-size: 1rem; }
}
.cv2-sec > .container { padding-top: 0; padding-bottom: 0; }

/* ---- Visuelt system (TASK-1320, 2026-10-03): samme aftenhimmel og lyskæde som forsiden.
   Tokens og knapper i energy.css; her kun det, der er særligt for kategorisiden. ---- */
.cv2 { --lc-night: #14224a; --lc-night-2: #1c2f63; --lc-amber: #ffb627; --lc-amber-hover: #ffc54f; --lc-mist: #f3f6fb; --lc-radius: 14px; --lc-display: "Bricolage Grotesque", "Inter", system-ui, -apple-system, "Segoe UI", sans-serif; }
.cv2 .cv2-hero {
    color: #fff; border-bottom: 0;
    background: radial-gradient(900px 320px at 85% -10%, rgba(255, 182, 39, .22), transparent 65%),
                linear-gradient(180deg, var(--lc-night, #14224a) 0%, var(--lc-night-2, #1c2f63) 100%);
}
.cv2 .cv2-hero__inner { padding-block: 1.75rem 2.25rem; }
.cv2 .cv2-hero__title { color: #fff; font-family: var(--lc-display); font-weight: 800; font-size: clamp(1.75rem, 1.2rem + 2.2vw, 2.75rem); line-height: 1.05; }
.cv2 .cv2-hero .breadcrumbs, .cv2 .cv2-hero .breadcrumbs a, .cv2 .cv2-hero .breadcrumbs__link,
.cv2 .cv2-hero .breadcrumbs__current, .cv2 .cv2-hero .breadcrumbs__separator { color: rgba(255, 255, 255, .78); }
.cv2 .cv2-hero__price { color: rgba(255, 255, 255, .9); }
.cv2 .cv2-hero__price strong { color: var(--lc-amber, #ffb627); font-family: var(--lc-display); font-weight: 800; font-size: 1.6rem; }
.cv2 .cv2-hero__price small { color: rgba(255, 255, 255, .7); }
.cv2 .cv2-hero__price a { color: #fff; }
.cv2 .cv2-btn { background: var(--lc-amber, #ffb627); color: var(--lc-night, #14224a); font-weight: 800; box-shadow: 0 6px 18px -8px rgba(255, 182, 39, .9); transition: transform .18s, background-color .18s; }
.cv2 .cv2-btn:hover { background: var(--lc-amber-hover, #ffc54f); color: var(--lc-night, #14224a); transform: translateY(-1px); }
.cv2 .cv2-hero .cv2-btn--ghost { background: transparent; color: #fff; border: 2px solid rgba(255, 255, 255, .6); box-shadow: none; }
.cv2 .cv2-hero .cv2-btn--ghost:hover { background: #fff; color: var(--lc-night, #14224a); }
.cv2 .cv2-btn:focus-visible, .cv2 .cv2-hero a:focus-visible { outline: 3px solid var(--lc-amber, #ffb627); outline-offset: 3px; }
.cv2 .cv2-hero__media img { border-radius: var(--lc-radius, 14px); box-shadow: 0 24px 60px -24px rgba(0, 0, 0, .6); }
.cv2 .cv2-sec h2, .cv2 .cv2-sec .price-facts__title, .cv2 .agent-cta__title {
    font-family: var(--lc-display); font-weight: 800; letter-spacing: -.015em; color: var(--lc-night, #14224a);
}
.cv2 .cv2-answer { background: var(--lc-mist, #f3f6fb); }
.cv2 .cv2-answer .container { padding-block: 1.25rem; }
.cv2 .cv2-vendors li { border-radius: 12px; transition: border-color .18s, box-shadow .18s; }
.cv2 .cv2-vendors li:hover { border-color: var(--lc-night, #14224a); box-shadow: 0 10px 24px -18px rgba(20, 34, 74, .5); }
.cv2 .cv2-vendors__ask:hover { background: var(--lc-amber, #ffb627); border-color: var(--lc-amber, #ffb627); color: var(--lc-night, #14224a); }
.cv2 .agent-cta--full { background: var(--lc-night, #14224a); }
.cv2 .agent-cta--full .agent-cta__title { color: #fff; }
.cv2 .agent-cta--full .agent-cta__intro, .cv2 .agent-cta--full .agent-cta__step-text, .cv2 .agent-cta--full .agent-cta__note { color: rgba(255, 255, 255, .85); }
.cv2 .agent-cta--full .agent-cta__step-number { background: var(--lc-amber, #ffb627); color: var(--lc-night, #14224a); }
.cv2 .agent-hero-card__button--primary { background: var(--lc-amber, #ffb627); border-color: var(--lc-amber, #ffb627); color: var(--lc-night, #14224a); font-weight: 800; border-radius: 999px; }
@media (prefers-reduced-motion: reduce) { .cv2 .cv2-btn, .cv2 .cv2-vendors li { transition: none; } .cv2 .cv2-btn:hover { transform: none; } }
