/* ============================================================
   Downloads-Seite  –  Hof alla Cava
   Farben: Grün #bac6ae | Blau #1d89f6  (wie Partnerseiten)
   ============================================================ */

:root {
    --hac-dl-gruen:    #bac6ae; /* fest: Markenlinie */
    --hac-dl-gruen-dk: var(--hac-schrift-gruen, #9aab8c); /* Rand beim Ueberfahren */
    --hac-dl-blau:     var(--hac-schrift-blau, #1d89f6); /* Symbol */
    --hac-dl-blau-dk:  var(--hac-schrift-blau, #0e6ed0);
    --hac-dl-border:   var(--hac-linie, #e8ede4);
    --hac-dl-bg:       var(--hac-flaeche-erhoeht, #fafaf8);
    --hac-dl-text:     var(--hac-schrift, #333333);
}

/* ── Seiten-Container ──────────────────────────────────────── */
.hac-downloads-page {
    padding-top:    60px;
    padding-bottom: 100px;
    padding-left:   40px;
    padding-right:  40px;
}

/* ── Header ────────────────────────────────────────────────── */
.hac-downloads-header {
    margin-bottom: 48px;
    text-align: center;
}

.hac-downloads-header__title {
    font-size: clamp(2rem, 4vw, 3.2rem);
    margin-bottom: 16px;
}

.hac-downloads-header__intro {
    max-width: 680px;
    margin: 0 auto;
    color: var(--hac-schrift-leise, #6b6b6b);
    font-size: 1.05rem;
    line-height: 1.7;
}

/* ── Sprungmarken-Navigation ───────────────────────────────── */
/* T69: wie die Filterknoepfe von Produkte und Team (produkte.css .hacp-filter, team.css .hact-filter).
   Vorher eigener Kasten, Schrift 500 und weisse Schrift auf Gruen beim Hover (1,8:1). */
.hac-downloads-nav {
    display:         flex;
    flex-wrap:       wrap;
    gap:             8px;
    justify-content: center;
    margin:          0 auto 56px;
    max-width:       1000px;
}

.hac-downloads-nav__link {
    display:         inline-block;
    padding:         8px 16px;
    background:      var(--hac-flaeche-erhoeht, #ffffff);
    border:          1px solid var(--hac-linie, #dcdfd6);
    border-radius:   999px;
    font-family:     inherit;
    font-size:       14px;
    font-weight:     600;
    line-height:     1.4;
    letter-spacing:  normal;
    text-transform:  none;
    color:           var(--hac-schrift-leise, var(--hac-farbe-text-leise, #6b6b6b));
    text-decoration: none;
    transition:      border-color 0.18s ease, color 0.18s ease, background-color 0.18s ease;
}

/* Theme setzt Links teils mit !important unterstrichen/eingefaerbt – hier gezielt zuruecksetzen */
.hac-downloads-nav a.hac-downloads-nav__link {
    text-decoration: none !important;
}

.hac-downloads-nav__link:hover,
.hac-downloads-nav__link:focus-visible {
    color:           var(--hac-schrift-gruen, var(--hac-farbe-gruen-tief, #4d5f3b));
    border-color:    var(--hac-schrift-gruen, var(--hac-farbe-gruen-dunkel, #667d4f));
    background:      var(--hac-flaeche-erhoeht, #ffffff);
    text-decoration: none;
}

.hac-downloads-nav__link:focus-visible {
    outline:        2px solid var(--hac-fokus, var(--hac-farbe-gruen-dunkel, #667d4f));
    outline-offset: 2px;
}

/* ── Unterüberschrift (## in der Textarea) ─────────────────── */
.hac-downloads-subheading {
    font-size:      0.78rem;
    font-weight:    700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color:          var(--hac-schrift-gruen, var(--hac-farbe-gruen-tief, #4d5f3b)); /* vorher #9aab8c: 2,4:1 */
    margin-top:     40px; /* T68: vorher 28px, wirkte zu dicht an der Karte darueber */
    margin-bottom:  12px;
    padding-bottom: 6px;
    border-bottom:  1px solid var(--hac-dl-border);
}

/* Unterüberschrift direkt unter der Abschnittsüberschrift braucht keinen Extra-Abstand nach oben.
   Stehen davor schon Downloads, bleibt der Abstand (T68, vorher :first-of-type) */
.hac-downloads-section__title + .hac-downloads-subheading,
.hac-downloads-section > .hac-downloads-subheading:first-child {
    margin-top: 0;
}

/* ── Abschnitt ─────────────────────────────────────────────── */
.hac-downloads-section {
    margin-bottom:     64px;
    scroll-margin-top: 32px;
}

.hac-downloads-section:last-of-type {
    margin-bottom: 0;
}

.hac-downloads-section__title {
    font-size:      1.25rem;
    font-weight:    600;
    margin-bottom:  20px;
    padding-bottom: 12px;
    border-bottom:  2px solid var(--hac-dl-gruen);
    color:          var(--hac-schrift-stark, var(--hac-farbe-text-dunkel, #1a1a1a));
    letter-spacing: 0.01em;
}

/* ── Listen-Layout ─────────────────────────────────────────── */
.hac-downloads-list {
    list-style: none;
    margin:  0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 10px;
}

/* ── Download-Button ───────────────────────────────────────── */
.hac-downloads-btn {
    display:         flex;
    align-items:     center;
    gap:             12px;
    padding:         14px 16px;
    background:      var(--hac-dl-bg);
    border:          1.5px solid var(--hac-dl-border);
    border-radius:   7px;
    text-decoration: none;
    color:           var(--hac-dl-text);
    font-size:       0.9rem;
    line-height:     1.4;
    height:          100%;
    box-sizing:      border-box; /* T68: sonst ragt die Karte um Innenabstand + Rahmen in die naechste */
    transition:      background 0.18s, border-color 0.18s, transform 0.15s, color 0.15s;
}

/* T69: Theme unterstreicht Links in Listen mit !important (li a) – die Karte ist ein Knopf, keine Textverlinkung */
.hac-downloads-list a.hac-downloads-btn {
    text-decoration: none !important;
}

.hac-downloads-btn:hover {
    background:      var(--hac-flaeche, #eef4eb);
    border-color:    var(--hac-dl-gruen-dk);
    transform:       translateY(-1px);
    text-decoration: none;
    color:           var(--hac-schrift-stark, var(--hac-farbe-text-dunkel, #1a1a1a));
}

/* Icon – blau wie Partnerseiten-Links */
.hac-downloads-btn__icon {
    flex-shrink: 0;
    width:  20px;
    height: 20px;
    color:  var(--hac-dl-blau);
    display: flex;
    align-items: center;
}

.hac-downloads-btn__icon svg {
    width:  100%;
    height: 100%;
}

/* Label */
.hac-downloads-btn__label {
    flex: 1;
    min-width: 0;
}

/* Dateiformat-Badge – grün */
.hac-downloads-btn__ext {
    flex-shrink:    0;
    font-size:      0.68rem;
    font-weight:    700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color:          var(--hac-farbe-text, #333333);   /* fest: Text auf Gruen – weiss waere 1,8:1 */
    background:     var(--hac-farbe-gruen, #bac6ae);
    padding:        2px 7px;
    border-radius:  3px;
    line-height:    1.6;
}

/* ── Leer-Hinweis ──────────────────────────────────────────── */
.hac-downloads-empty {
    color:       var(--hac-schrift-leise, #999);
    font-style:  italic;
    text-align:  center;
    padding:     40px 0;
}

/* ── Responsiv ─────────────────────────────────────────────── */
@media (max-width: 768px) {
    .hac-downloads-page {
        padding-left:  24px;
        padding-right: 24px;
    }

    .hac-downloads-nav {
        margin-bottom: 40px;
    }

    .hac-downloads-section {
        margin-bottom:     48px;
        scroll-margin-top: 20px;
    }
}

@media (max-width: 640px) {
    .hac-downloads-page {
        padding-top:    32px;
        padding-bottom: 60px;
        padding-left:   16px;
        padding-right:  16px;
    }

    .hac-downloads-list {
        grid-template-columns: 1fr;
    }

    .hac-downloads-nav {
        justify-content: flex-start;
    }

    .hac-downloads-nav__link {
        font-size: 13px;
        padding:   7px 14px;
    }
}
