.accordion-block-component {
    padding: var(--spacing-7xl) var(--spacing-xl);
    gap: var(--spacing-4xl);
    @media (min-width: 768px) {
        padding: var(--spacing-9xl) var(--spacing-4xl);
    }
    @media (min-width: 1024px) {
        padding: var(--spacing-9xl) var(--spacing-8xl);
    }
}
.accordion-block-component.light {
    background-color: var(--color-white);
}
.accordion-block-component.dark {
    background-color: var(--color-gray-950);
}
.accordion-block-component__colored {
    background-color: var(--accordion-block-component-bg-color) !important;
}
.accordion-block-container {
    gap: var(--spacing-4xl);
    @media (min-width: 1024px) {
        max-width: var(--container-max-width-desktop);
        margin: 0 auto;
    }
}
.accordion-block-section {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-5xl);
    @media (min-width: 768px) {
        gap: var(--spacing-7xl);
    }
}
.accordion-block-heading {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-2xl);
    @media (min-width: 768px) {
        padding: var(--spacing-none) var(--spacing-4xl);
    }
}
.accordion-block-icons {
    display: flex;
    align-items: end;
    width: fit-content;
    gap: var(--spacing-lg);
}
.accordion-block-icon {
    [lang="ar"] & {transform: scaleX(-1)}
    @media (min-width: 1024px) {
        gap: var(--spacing-md);
    }
    .block-icon {
        .dark & {filter: invert(83%) sepia(5%) saturate(118%) hue-rotate(190deg) brightness(93%) contrast(86%);}
    }
    .block-icon-size-24 {
        width: 24px;
        height: 24px;
    }
    .block-icon-size-48 {
        width: 48px;
        height: 48px;
    }
    .block-icon-size-96 {
        width: 96px;
        height: 96px;
    }
}
.accordion-block-header {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
    @media (min-width: 768px) {
        gap: var(--spacing-lg);
    }
}
.accordion-detail-eyebrow {
    letter-spacing: 0.0125em;
    font: var(--english-text-sm-semibold);
    [lang="ar"] & {font: var(--arabic-text-sm-semibold);}
    color: var(--color-teal-700);
    .dark & {color: var(--color-gray-dark-700-dark);}
    @media (min-width: 768px) {
        font: var(--english-text-md-semibold);
        [lang="ar"] &s {font: var(--arabic-text-md-semibold);}
    }
}
.accordion-block-text {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-2xl);
}
.accordion-detail-title__h2 {
    color: var(--text-primary);
    .dark & {color: var(--color-gray-900-dark);}
    margin-bottom: 0;
    font: var(--english-display-sm-semibold);
    [lang="ar"] & {font: var(--arabic-display-sm-semibold);}
    font-size: 36px;
    line-height: 44px;
    @media (min-width: 768px) {
        font: var(--english-display-lg-semibold);
        [lang="ar"] & {font: var(--arabic-display-lg-semibold);}
    }
}
.accordion-detail-subtitle__h2 {
    color: var(--color-gray-700);
    .dark & {color: var(--color-gray-dark-700-dark);}
    letter-spacing: 0.03em;
    margin-bottom: 0;
    font: var(--english-text-md-regular);
    [lang="ar"] & {
        font: var(--arabic-text-md-regular);
        letter-spacing: 0em;
    }
    @media (min-width: 768px) {
        font: var(--english-text-lg-regular);
        [lang="ar"] & {
            font: var(--arabic-text-lg-regular);
            letter-spacing: 0em;
        }
    }
}
.accordion-streamblock-container {
    display: flex;
    flex-direction: column;
    padding: var(--spacing-xl);
    gap: var(--spacing-4xl);
    border-radius: var(--radius-xl);
    @media (min-width: 768px) {
        padding: var(--spacing-3xl);
        gap: var(--spacing-6xl);
        border-radius: var(--radius-2xl);
    }
    @media (min-width: 1024px) {
        padding: var(--spacing-none) var(--spacing-6xl) var(--spacing-4xl);
    }
}
.accordion-streamblock-container.light {
    background-color: var(--color-white);
}
.accordion-streamblock-container.dark {
    background-color: var(--color-gray-950);
}
.accordion-streamblock-container__colored {
    padding: var(--spacing-xl);
    @media (min-width: 768px) {
        padding: var(--spacing-3xl);
    }
    @media (min-width: 1024px) {
        padding: var(--spacing-6xl);
    }
}
.accordion-streamblock-title__h3 {
    color: var(--text-primary);
    .dark & {color: var(--color-gray-900-dark);}
    margin-bottom: 0;
    font: var(--english-display-sm-semibold);
    [lang="ar"] & {font: var(--arabic-display-sm-semibold);}
    font-size: 24px;
    line-height: 32px;
    @media (min-width: 768px) {
        font: var(--english-display-sm-semibold);
        [lang="ar"] & {font: var(--arabic-display-sm-semibold);}
        letter-spacing: 0.02em;
    }
}
.accordion-streamblock-section {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-2xl);
    padding-bottom: var(--spacing-2xl);
    @media (min-width: 768px) {
        gap: var(--spacing-4xl);
        padding-bottom: var(--spacing-4xl);
    }
}
.accordion-component-item {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-3xl);
}
.accordion-component-header {
    display: flex;
    flex-direction: row;
    gap: var(--spacing-2xl);
    cursor: pointer;
}
.accordion-component-button {
  position: relative;
  padding-left: 24px;
}
.accordion-component-button::before {
    content: "";
    position: absolute;
    left: 0;top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    background: no-repeat center/contain url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9InBsdXMtY2lyY2xlIj4KPHBhdGggaWQ9Ikljb24iIGQ9Ik0xMiA4VjE2TTggMTJIMTZNMjIgMTJDMjIgMTcuNTIyOCAxNy41MjI4IDIyIDEyIDIyQzYuNDc3MTUgMjIgMiAxNy41MjI4IDIgMTJDMiA2LjQ3NzE1IDYuNDc3MTUgMiAxMiAyQzE3LjUyMjggMiAyMiA2LjQ3NzE1IDIyIDEyWiIgc3Ryb2tlPSIjMDA4RDg5IiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L2c+Cjwvc3ZnPg==");
}
.dark .accordion-component-button::before {
    background: no-repeat center/contain url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9InBsdXMtY2lyY2xlIj4KPHBhdGggaWQ9Ikljb24iIGQ9Ik0xMiA4VjE2TTggMTJIMTZNMjIgMTJDMjIgMTcuNTIyOCAxNy41MjI4IDIyIDEyIDIyQzYuNDc3MTUgMjIgMiAxNy41MjI4IDIgMTJDMiA2LjQ3NzE1IDYuNDc3MTUgMiAxMiAyQzE3LjUyMjggMiAyMiA2LjQ3NzE1IDIyIDEyWiIgc3Ryb2tlPSIjQ0VDRkQyIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L2c+Cjwvc3ZnPg==");
}
.accordion-component-header:not(.collapsed) .accordion-component-button::before {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9Im1pbnVzLWNpcmNsZSI+CjxwYXRoIGlkPSJJY29uIiBkPSJNOCAxMkgxNk0yMiAxMkMyMiAxNy41MjI4IDE3LjUyMjggMjIgMTIgMjJDNi40NzcxNSAyMiAyIDE3LjUyMjggMiAxMkMyIDYuNDc3MTUgNi40NzcxNSAyIDEyIDJDMTcuNTIyOCAyIDIyIDYuNDc3MTUgMjIgMTJaIiBzdHJva2U9IiMwMDhEODkiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjwvZz4KPC9zdmc+");
}
.dark .accordion-component-header:not(.collapsed) .accordion-component-button::before {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9Im1pbnVzLWNpcmNsZSI+CjxwYXRoIGlkPSJJY29uIiBkPSJNOCAxMkgxNk0yMiAxMkMyMiAxNy41MjI4IDE3LjUyMjggMjIgMTIgMjJDNi40NzcxNSAyMiAyIDE3LjUyMjggMiAxMkMyIDYuNDc3MTUgNi40NzcxNSAyIDEyIDJDMTcuNTIyOCAyIDIyIDYuNDc3MTUgMjIgMTJaIiBzdHJva2U9IiNDRUNGRDIiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjwvZz4KPC9zdmc+");
}
.accordion-component-title {
    letter-spacing: 0.0325em;
    color: var(--text-primary);
    .dark & {color: var(--color-gray-900-dark);}
    font: var(--english-text-md-medium);
    [lang="ar"] & {font: var(--arabic-text-lg-medium);}
    @media (min-width: 768px) {
        font: var(--english-text-xl-medium);
        [lang="ar"] & {font: var(--arabic-text-xl-medium);}
    }
    @media (min-width: 1024px) {
        font: var(--english-text-xl-medium);
        [lang="ar"] & {font: var(--arabic-text-xl-medium);}
    }
}
.accordion-component-content {
    padding: var(--spacing-none) var(--spacing-5xl);
    gap: 10px;
}
.accordion-component-text {
    p[data-block-key] {
        color: var(--color-gray-600);
        .dark & {color: #94969C}
        font-weight: 400;
        font-size: 14px;
        line-height: 20px;
        font-family: var(--font-text);
        letter-spacing: 0.0325em;
        margin-bottom: 0;

        @media (min-width: 768px) {
            font-size: 16px;
            line-height: 24px;
            letter-spacing: 0.025em;
        }
    }
}
.accordion-section-separator {
    margin: var(--spacing-none) var(--spacing-5xl);
    border-top: 1px solid #D0D5DD;
    @media (min-width: 768px) {
        margin: var(--spacing-none) var(--spacing-7xl);
    }
}
.accordion-section-separator:last-child {
    display: none;
}
.accordion-footer-section {
    gap: 10px;
    margin-top: -16px;
    @media (min-width: 768px) {
        margin-top: -24px;
    }
    @media (min-width: 1024px) {
        margin-top: -32px;
        padding: var(--spacing-none) var(--spacing-4xl);
    }
    p[data-block-key] {
        color: var(--color-gray-700);
        .dark & {color: var(--color-gray-dark-700-dark);}
        font-weight: 400;
        font-size: 16px;
        line-height: 24px;
        font-family: var(--font-text);
        margin-bottom: 0;

    }
}