/* =========================================================
   Kalite ve Yetki Belgeleri — qd-hero.css
   Scope: .qd-hero-page
   Kurumsal hero için ek CSS. Galeri (qualitydocs.css)
   yapısını bozmadan, hero'yu ortak kurumsal stile çeker.
   ========================================================= */

.qd-hero-page {
    background: var(--tx-white);
    overflow-x: clip;
}

/* HERO */
.qd-hero {
    padding: 50px 0 30px;
    background: var(--tx-white);
}

.qd-hero-inner {
    max-width: 980px;
}

.qd-hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 14px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--tx-navy-500), transparent 92%);
    color: var(--tx-text-muted);
    font-family: var(--tx-font-sans);
    font-size: var(--tx-text-xs);
    font-weight: var(--tx-font-semibold);
    letter-spacing: var(--tx-tracking-wide);
    text-transform: uppercase;
    margin-bottom: 18px;
}

.qd-hero-badge i {
    color: var(--tx-text-muted);
}

.qd-hero-title {
    color: var(--tx-text);
    margin: 0 0 16px;
}

.qd-hero-title-accent {
    color: var(--tx-text);
}

.qd-hero-desc {
    color: var(--tx-text-muted);
    margin: 0;
    max-width: 820px;
    font-size: var(--tx-text-base);
    line-height: var(--tx-leading-relaxed);
}

@media (max-width: 767.98px) {
    .qd-hero {
        padding: 36px 0 24px;
    }
}