/* ==========================================
   FAQ ACCORDION
   Bootstrap's accordion ships with a blue active state that clashes with the
   site's teal. Overriding Bootstrap's own custom properties rather than
   fighting selector specificity keeps this to a single block.
   Apply with: <div class="accordion faq-accordion">
   ========================================== */

.faq-accordion {
    --faq-accent: #3296a5;
    --faq-accent-soft: #e8f4f6;
    --faq-border: #dbe7ea;
    --faq-heading: #02245B;

    /* Bootstrap accordion tokens */
    --bs-accordion-color: #444;
    --bs-accordion-bg: #ffffff;
    --bs-accordion-border-color: var(--faq-border);
    --bs-accordion-border-radius: 0.75rem;
    --bs-accordion-inner-border-radius: 0.75rem;
    --bs-accordion-btn-padding-x: 1.25rem;
    --bs-accordion-btn-padding-y: 1.15rem;
    --bs-accordion-btn-color: var(--faq-heading);
    --bs-accordion-btn-bg: #ffffff;
    --bs-accordion-btn-focus-border-color: var(--faq-accent);
    --bs-accordion-btn-focus-box-shadow: 0 0 0 0.2rem rgba(50, 150, 165, 0.25);
    --bs-accordion-body-padding-x: 1.25rem;
    --bs-accordion-body-padding-y: 1.15rem;
    --bs-accordion-active-color: var(--faq-accent);
    --bs-accordion-active-bg: var(--faq-accent-soft);

    --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%233296a5'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%233296a5'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

/* Separate cards rather than one fused stack — easier to scan a long list. */
.faq-accordion .accordion-item {
    border: 1px solid var(--faq-border);
    border-radius: 0.75rem;
    margin-bottom: 0.75rem;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(2, 36, 91, 0.06);
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.faq-accordion .accordion-item:last-child {
    margin-bottom: 0;
}

.faq-accordion .accordion-item:hover {
    border-color: var(--faq-accent);
    box-shadow: 0 4px 14px rgba(2, 36, 91, 0.09);
}

.faq-accordion .accordion-button {
    font-weight: 600;
    font-size: 1.05rem;
    line-height: 1.45;
    gap: 1rem;
}

.faq-accordion .accordion-button:not(.collapsed) {
    box-shadow: none;
}

.faq-accordion .accordion-button::after {
    margin-left: auto;
    flex-shrink: 0;
    transition: transform 0.2s ease;
}

.faq-accordion .accordion-body {
    color: #444;
    line-height: 1.7;
    border-top: 1px solid var(--faq-border);
}

.faq-accordion .accordion-body a {
    color: var(--faq-accent);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.faq-accordion .accordion-body a:hover,
.faq-accordion .accordion-body a:focus {
    color: #004a56;
}

@media (max-width: 575.98px) {
    .faq-accordion {
        --bs-accordion-btn-padding-x: 1rem;
        --bs-accordion-body-padding-x: 1rem;
    }

    .faq-accordion .accordion-button {
        font-size: 0.98rem;
    }
}
