/* SEMTAK AI Overview — front accordion. Scoped prefiksem .aio (anty-kolizja). */
.aio {
    margin: 1.5rem 0;
}

.aio__expand {
    background: none;
    border: 1px solid currentColor;
    border-radius: 4px;
    padding: 0.35em 0.9em;
    font-size: 0.85em;
    cursor: pointer;
    margin-bottom: 0.75rem;
    opacity: 0.85;
}

.aio__expand:hover,
.aio__expand:focus-visible {
    opacity: 1;
}

.aio__list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.aio__item {
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 6px;
    overflow: hidden;
}

.aio__summary {
    cursor: pointer;
    padding: 0.85em 1em;
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5em;
}

.aio__summary::-webkit-details-marker {
    display: none;
}

.aio__summary::after {
    content: "+";
    font-size: 1.2em;
    line-height: 1;
    transition: transform 0.2s ease;
}

.aio__item[open] > .aio__summary::after {
    content: "–";
}

.aio__q {
    margin: 0;
    font-size: 1rem;
    line-height: 1.4;
}

.aio__a,
.aio__facts {
    padding: 0 1em 1em;
    margin: 0;
}

.aio__a > :first-child {
    margin-top: 0;
}

.aio__facts {
    padding-left: 2.2em;
}

/* Lekka animacja rozwijania — wyłączana przy prefers-reduced-motion. */
@media (prefers-reduced-motion: no-preference) {
    .aio__item[open] > .aio__a,
    .aio__item[open] > .aio__facts {
        animation: aio-reveal 0.2s ease;
    }

    @keyframes aio-reveal {
        from {
            opacity: 0;
            transform: translateY(-4px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }
}