/* Freedom Doula Co — mobile swipe carousel nav (js/fdc-swipe.js):
 * prev · dots · next. --light variant for light backgrounds. */
.fdc-swipe-nav {
    display: none;
}

@media (max-width: 768px) {
    .fdc-swipe-nav {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 1.6rem;
        margin-top: 1.8rem;
    }

    .fdc-swipe-dots {
        display: flex;
        align-items: center;
        gap: 0.8rem;
    }

    .fdc-swipe-nav .fdc-swipe-dot {
        width: 8px;
        height: 8px;
        margin: 0;
        padding: 0;
        border: 0;
        border-radius: 1000px;
        background: rgba(254, 240, 236, 0.45);
        transition: width 0.35s cubic-bezier(0.22, 1, 0.36, 1), background-color 0.35s ease;
    }

    .fdc-swipe-nav .fdc-swipe-dot.is-active {
        width: 26px;
        background: var(--secondary-accent-color);
    }

    .fdc-swipe-nav .fdc-swipe-arrow {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        margin: 0;
        padding: 0;
        border: 1px solid rgba(254, 240, 236, 0.5);
        border-radius: 50%;
        background: rgba(23, 15, 17, 0.15);
        color: var(--white-color);
        line-height: 1;
        transition: opacity 0.25s ease;
    }

    .fdc-swipe-nav .fdc-swipe-arrow svg {
        width: 1.6rem;
        height: 1.6rem;
        fill: none;
        stroke: currentColor;
        stroke-width: 2;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

    .fdc-swipe-nav .fdc-swipe-arrow--prev svg {
        transform: rotate(180deg);
    }

    .fdc-swipe-nav .fdc-swipe-arrow:disabled {
        opacity: 0.3;
    }

    .fdc-swipe-nav--light .fdc-swipe-dot {
        background: rgba(63, 63, 63, 0.22);
    }

    .fdc-swipe-nav--light .fdc-swipe-dot.is-active {
        background: var(--faq-sage);
    }

    .fdc-swipe-nav--light .fdc-swipe-arrow {
        border-color: rgba(111, 124, 111, 0.45);
        background: rgba(254, 240, 236, 0.6);
        color: var(--faq-sage-deep);
    }
}

@media (max-width: 768px) and (prefers-reduced-motion: reduce) {
    .fdc-swipe-nav .fdc-swipe-dot,
    .fdc-swipe > * {
        transition: none !important;
    }
}