/* Root */
.faq {
    background: #F1FCFA;
    margin: 0;
    padding: 55px 0;
    position: relative;
    z-index: 1;
}

.faq__wrapper {
    position: relative;
    z-index: 1;
}

.faq__top-curve {
    height: auto;
    left: 0;
    position: absolute;
    top: -1px;
    width: 100%;
}

.faq__bottom-curve {
    bottom: -1px;
    height: auto;
    left: 0;
    position: absolute;
    width: 100%;
}

/* Heading */
.faq__heading h2 {
    color: #00807F;
    margin-bottom: 15px;
}

/* Accordion */
.faq__flex .fx-accordion__panel {
    background: #EBF7F5;
    border: 1px solid #ACDBD1;
    border-radius: 25px;
    box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.10);
    margin-top: 10px;
}

.faq__flex .fx-accordion__panel__toggle {
    background: none;
    border: none;
    border-radius: 0;
    color: #00807F;
    font-size: 18px;
    font-style: normal;
    font-weight: 800;
    letter-spacing: 0.02em;
    line-height: normal;
    margin-top: 0;
    padding: 20px 75px 20px 25px;
}

.faq__flex .fx-accordion__panel__toggle:focus {
    border: none;
}

.faq__flex .fx-accordion__panel .fx-accordion__panel__toggle::after {
    border: none;
    color: #4D47B3;
    content: '\e909';
    font-family: 'cotton-creations';
    font-size: 25px;
    font-weight: normal;
    height: 25px;
    line-height: 1em;
    position: absolute;
    right: 25px;
    top: 50%;
    transform: translate(0, -50%);
    width: 25px;
}

.faq__flex .fx-accordion__panel.is-expanded .fx-accordion__panel__toggle {
    background: none;
    border-bottom: none;
    border-radius: 0;
    color: #00807F;
}

.faq__flex .fx-accordion__panel.is-expanded .fx-accordion__panel__toggle::after {
    content: '\e90c';
}

.faq__flex .fx-accordion__panel__content-wrapper {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.35s ease-out;
}

.faq__flex .fx-accordion__panel.is-expanded .fx-accordion__panel__content-wrapper {
    grid-template-rows: 1fr;
}

.faq__flex .fx-accordion__panel__content {
    min-height: 0;
    overflow: hidden;
}

.faq__flex .fx-accordion__panel__content-inner {
    border: none;
    border-top: 1px solid #ACDBD1;
    margin: 0 25px;
    padding: 20px 0;
}

/* Decorative Images */
.faq__left {
    left: -116px;
    position: absolute;
    top: 0;
    width: 157px;
    z-index: -1;
}

.faq__right {
    bottom: -55px;
    position: absolute;
    right: -116px;
    width: 167px;
    z-index: -1;
}

@media (min-width: 375px) and (max-width: 768px) {
    /* Root */
    .faq {
        padding: calc(55px + (100vw - 375px) * 0.0509) 0;
    }
}

@media (min-width: 768px) {
    /* Heading */
    .faq__heading h2 {
        margin-bottom: 20px;
    }

    /* Accordion */
    .faq__flex {
        align-items: flex-start;
        display: flex;
        flex-wrap: wrap;
        gap: 16px;
        margin: 0;
    }

    .faq__flex .fx-accordion__panel {
        margin-top: 0;
        width: calc(50% - 8px);
    }

    .faq__flex .fx-accordion__panel__toggle {
        font-size: 22px;
    }

    /* Decorative Images */
    .faq__left {
        left: -90px;
        top: 28px;
    }

    .faq__right {
        bottom: auto;
        right: -90px;
        top: 38px;
    }
}

@media (min-width: 768px) and (max-width: 1366px) {
    /* Root */
    .faq {
        padding: calc(75px + (100vw - 768px) * 0.0836) 0;
    }
}

@media (min-width: 1200px) {
    /* Root */
    .faq__wrapper {
        margin: 0 auto;
        max-width: 1028px;
    }

    /* Heading */
    .faq__heading h2 {
        margin-bottom: 32px;
    }

    /* Accordion */
    .faq__flex {
        gap: 32px;
    }

    .faq__flex .fx-accordion__panel {
        width: calc(50% - 16px);
    }

    .faq__flex .fx-accordion__panel__toggle {
        font-size: 25px;
        line-height: 1.28em;
        padding: 35px 135px 35px 50px;
    }

    .faq__flex .fx-accordion__panel .fx-accordion__panel__toggle::after {
        font-size: 35px;
        height: 35px;
        right: 50px;
        width: 35px;
    }

    .faq__flex .fx-accordion__panel__content-inner {
        margin: 0 50px;
        padding: 20px 0 35px 0;
        width: auto;
    }

    .faq__flex .fx-accordion__panel__content-inner p {
        margin-bottom: 11px;
    }

    /* Decorative Images */
    .faq__left {
        left: -137px;
        top: 80px;
        width: 213px;
    }

    .faq__right {
        bottom: auto;
        right: -140px;
        top: 108px;
        width: 290px;
    }
}

/* 1366 → 1920px: flat padding */
@media (min-width: 1366px) and (max-width: 1920px) {
    .faq {
        padding: 125px 0;
    }
}

@media (min-width: 1600px) {
    .faq__wrapper {
        max-width: var(--content-max-width);
    }

    /* Decorative Images */
    .faq__left {
        left: -177px;
        top: -20px;
        width: 299px;
    }

    .faq__right {
        bottom: auto;
        right: -140px;
        top: -12px;
        width: 393px;
    }
}

@media (min-width: 1920px) {
    .faq {
        padding: calc(150px + (100vw - 1920px) * 0.05) 0;
    }
}
