/* =============================================
   TM24 ANKAUF – FAQ (Apple-Style)
   Scoped: .tm24-faq-*, .mini-faq-section
   ============================================= */

/* ===== FAQ CONTAINER ===== */
.tm24-faq {
    max-width: 920px;
    margin: 0 auto;
    padding: 26px 16px 10px;
}

.tm24-faq-title {
    margin: 0;
    font: 800 34px/1.15 'Figtree', system-ui, sans-serif;
    letter-spacing: -0.02em;
    color: var(--tm-text-headline, #0f172a);
    text-align: center;
}

.tm24-faq-sub {
    margin: 10px 0 22px;
    font: 400 16px/1.5 'Figtree', system-ui, sans-serif;
    color: var(--tm-text-secondary, #475569);
    text-align: center;
}

/* ===== FAQ ITEMS (Modern Cards) ===== */
.tm24-faq-list {
    margin-top: 12px;
}

.tm24-faq-item {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    margin: 10px 0;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
    transition: box-shadow 0.2s;
}

.tm24-faq-item:hover {
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
}

/* Question Row */
.tm24-faq-q {
    list-style: none;
    cursor: pointer;
    padding: 20px 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    font: 650 17px/1.4 'Figtree', system-ui, sans-serif;
    color: var(--tm-text-headline, #0f172a);
    transition: color 0.2s;
}

.tm24-faq-q::-webkit-details-marker {
    display: none;
}

/* Chevron Icon Box */
.tm24-faq-ico {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    flex: 0 0 auto;
    transition: all 0.2s;
}

.tm24-faq-ico i {
    transition: transform 0.2s ease;
    color: var(--tm-blue, #2e2bcb);
    font-size: 13px;
}

/* Open State */
.tm24-faq-item[open] .tm24-faq-q {
    color: var(--tm-blue, #2e2bcb);
}

.tm24-faq-item[open] .tm24-faq-ico {
    background: var(--tm-blue-light, rgba(46, 43, 203, 0.08));
    border-color: rgba(46, 43, 203, 0.2);
}

.tm24-faq-item[open] .tm24-faq-ico i {
    transform: rotate(180deg);
}

/* Answer */
.tm24-faq-a {
    padding: 0 22px 22px;
    font: 400 15px/1.7 'Figtree', system-ui, sans-serif;
    color: var(--tm-text-body, #1e293b);
    border-top: 1px solid #f1f5f9;
    margin-top: -2px;
    padding-top: 16px;
}

/* Focus */
.tm24-faq-q:focus,
.tm24-faq-q:focus-visible {
    outline: none;
}

.tm24-faq-item:focus-within {
    box-shadow: 0 0 0 3px rgba(46, 43, 203, 0.12), 0 4px 16px rgba(15, 23, 42, 0.08);
}

/* ===== MINI-FAQ SECTION ===== */
.mini-faq-section {
    padding: 56px 0 44px;
    background: #fff;
}

.mini-faq-section h2 {
    font-size: 26px;
    font-weight: 800;
    color: var(--tm-text-headline, #0f172a);
    margin-bottom: 8px;
}

.mini-faq-sub {
    font-size: 15px;
    color: var(--tm-text-secondary, #475569);
    margin-bottom: 4px;
}

.tm24-mini-faq {
    max-width: 800px;
    padding-top: 0;
}

.tm24-mini-faq .tm24-faq-q {
    font-size: 15px;
    padding: 16px 18px;
}

.tm24-mini-faq .tm24-faq-a {
    font-size: 14px;
    padding: 0 18px 18px;
}

.tm24-mini-faq .tm24-faq-ico {
    width: 32px;
    height: 32px;
}

/* ===== FAQ SECTION (Vollständige FAQ) ===== */
#faq-section {
    padding: 60px 0 50px;
    background: #f8fafc;
}

#faq-section .tm24-faq-title {
    margin-bottom: 4px;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 768px) {
    .tm24-faq-title {
        font-size: 26px;
    }

    .tm24-faq-q {
        font-size: 15px;
        padding: 16px;
    }

    .tm24-faq-a {
        padding: 0 16px 16px;
        font-size: 14px;
    }

    .mini-faq-section {
        padding: 40px 0 32px;
    }

    .mini-faq-section h2 {
        font-size: 22px;
    }
}

@media (max-width: 480px) {
    .mini-faq-section {
        padding: 32px 0 24px;
    }

    .tm24-faq-q {
        font-size: 14px;
        padding: 14px;
    }

    .tm24-faq-ico {
        width: 28px;
        height: 28px;
    }
}