.ch-page { padding: 2.5rem 0 4rem; }

@media (min-width: 768px) {
    .pb-md-14 {
        padding-bottom: 5rem !important;
    }
}

/* ── Catalogue ── */
.catalog-header { display: flex; align-items: baseline; gap: 12px; margin-bottom: 0.4rem; }
.catalog-header h1 { font-size: 36px; font-weight: 600; color: var(--color-text-primary, #111); }
.count-badge { font-size: 13px; font-weight: 500; padding: 3px 10px; border-radius: 20px; background: var(--color-background-secondary, #f5f5f5); color: var(--color-text-secondary, #666); border: 0.5px solid var(--color-border-tertiary, #e5e5e5); }
.catalog-sub { font-size: 16px; color: var(--color-text-secondary, #666); margin-bottom: 1.75rem; }

.filter-bar { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 2rem; }
.filter-btn { font-size: 13px; font-weight: 400; padding: 6px 14px; border-radius: 20px; border: 0.5px solid var(--color-border-secondary, #d0d0d0); background: transparent; color: var(--color-text-secondary, #666); cursor: pointer; transition: all 0.15s; white-space: nowrap; }
.filter-btn:hover { background: var(--color-background-secondary, #f5f5f5); color: var(--color-text-primary, #111); }
.filter-btn.active { background: var(--color-text-primary, #111); color: #fff; border-color: var(--color-text-primary, #111); }

/* Per-category filter button colours */
.filter-btn.fc-highlights:hover, .filter-btn.fc-highlights.active { background: #E1F5EE; color: #0F6E56; border-color: #0F6E56; }
.filter-btn.fc-produktion:hover, .filter-btn.fc-produktion.active { background: #F1EFE8; color: #5F5E5A; border-color: #5F5E5A; }
.filter-btn.fc-logistik:hover,   .filter-btn.fc-logistik.active   { background: #FAEEDA; color: #854F0B; border-color: #854F0B; }
.filter-btn.fc-gesundheit:hover, .filter-btn.fc-gesundheit.active { background: #E1F5EE; color: #0F6E56; border-color: #0F6E56; }
.filter-btn.fc-finanzen:hover,   .filter-btn.fc-finanzen.active   { background: #E6F1FB; color: #185FA5; border-color: #185FA5; }
.filter-btn.fc-handel:hover,     .filter-btn.fc-handel.active     { background: #FAECE7; color: #993C1D; border-color: #993C1D; }
.filter-btn.fc-it:hover,         .filter-btn.fc-it.active         { background: #EEEDFE; color: #534AB7; border-color: #534AB7; }
.filter-btn.fc-bau:hover,        .filter-btn.fc-bau.active        { background: #FAEEDA; color: #854F0B; border-color: #854F0B; }
.filter-btn.fc-bildung:hover,    .filter-btn.fc-bildung.active    { background: #EAF3DE; color: #3B6D11; border-color: #3B6D11; }
.filter-btn.fc-gastro:hover,     .filter-btn.fc-gastro.active     { background: #FBEAF0; color: #993556; border-color: #993556; }
.filter-btn.fc-energie:hover,    .filter-btn.fc-energie.active    { background: #EAF3DE; color: #3B6D11; border-color: #3B6D11; }

.cat-section { margin-bottom: 3rem; }
.cat-section-header { display: flex; align-items: center; gap: 12px; margin-bottom: 1.25rem; padding-bottom: 0.875rem; border-bottom: 0.5px solid var(--color-border-tertiary, #e5e5e5); }
.cat-section-icon { width: 28px; height: 28px; object-fit: contain; flex-shrink: 0; }
.cat-section-title { font-size: 22px; font-weight: 600; color: var(--color-text-primary, #111); margin: 0; }
.cat-section-desc { font-size: 14px; color: var(--color-text-secondary, #666); margin-left: auto; }

.cards-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }

.cat-card { display: block; background: #fff; border: 1px solid #d0d0d0; border-radius: 10px; overflow: hidden; cursor: default; transition: border-color 0.15s, transform 0.1s; text-decoration: none; color: inherit; }
.cat-card:hover { border-color: #999; transform: translateY(-1px); color: inherit; text-decoration: none; }
.cat-card-thumb { width: 100%; height: 200px; object-fit: cover; display: block; }
.cat-card-body { padding: 1.25rem 1.375rem; }
.cat-card-tag { font-size: 11px; font-weight: 500; padding: 3px 9px; border-radius: 4px; display: inline-block; margin-bottom: 10px; }
.cat-card-title { font-size: 17px; font-weight: 600; color: var(--color-text-primary, #111); margin-bottom: 6px; line-height: 1.4; }
.cat-card-desc { font-size: 14px; color: var(--color-text-secondary, #666); line-height: 1.55; }
.cat-card-footer { margin-top: 10px; }
.cat-card-badge { font-size: 11px; padding: 2px 8px; border-radius: 4px; border: 0.5px solid var(--color-border-tertiary, #e5e5e5); color: var(--color-text-tertiary, #999); }

/* Special highlight cards */
.cat-card.special { border-width: 1.5px; }
.cat-card.special-onboarding { border-color: #5DCAA5; }
.cat-card.special-jubilaeum { border-color: #85B7EB; }
.cat-card.special-battle { border-color: #F0997B; }
.cat-card.special-kickoff { border-color: #AFA9EC; }

/* Tag colour variants */
.tag-onboarding { background: #E1F5EE; color: #0F6E56; }
.tag-jubilaeum  { background: #E6F1FB; color: #185FA5; }
.tag-battle     { background: #FAECE7; color: #993C1D; }
.tag-kickoff    { background: #EEEDFE; color: #534AB7; }
.tag-produktion { background: #F1EFE8; color: #5F5E5A; }
.tag-logistik   { background: #FAEEDA; color: #854F0B; }
.tag-gesundheit { background: #E1F5EE; color: #0F6E56; }
.tag-finanzen   { background: #E6F1FB; color: #185FA5; }
.tag-handel     { background: #FAECE7; color: #993C1D; }
.tag-it         { background: #EEEDFE; color: #534AB7; }
.tag-bau        { background: #FAEEDA; color: #854F0B; }
.tag-bildung    { background: #EAF3DE; color: #3B6D11; }
.tag-gastro     { background: #FBEAF0; color: #993556; }
.tag-energie    { background: #EAF3DE; color: #3B6D11; }

.cat-empty { padding: 3rem 0; text-align: center; color: var(--color-text-secondary, #666); font-size: 14px; display: none; }
