/**
 * Homepage FAQ
 *
 * One calm trust panel with native Gutenberg Details blocks. The selectors are
 * scoped to the homepage and block editor so the component stays page-local.
 */
body.home #main .entry-content.is-layout-constrained {
    padding-bottom: clamp(72px, 7vw, 112px);
}

:where(body.home, .editor-styles-wrapper) .amahasla-home-faq {
    box-sizing: border-box;
    width: min(100%, var(--theme-container-width, 1290px));
    max-width: var(--theme-normal-container-max-width, 1290px);
    margin: 0 auto;
    padding: clamp(32px, 4.5vw, 56px);
    border-radius: 32px;
    background: #171717;
    color: #f5f5f2;
}

.editor-styles-wrapper .amahasla-home-faq {
    margin-bottom: 72px;
}

:where(body.home, .editor-styles-wrapper) .amahasla-home-faq *,
:where(body.home, .editor-styles-wrapper) .amahasla-home-faq *::before,
:where(body.home, .editor-styles-wrapper) .amahasla-home-faq *::after {
    box-sizing: border-box;
}

:where(body.home, .editor-styles-wrapper) .amahasla-home-faq__layout {
    display: grid !important;
    grid-template-columns: minmax(320px, 0.86fr) minmax(0, 1.14fr);
    gap: clamp(40px, 5vw, 72px);
    align-items: start;
    margin: 0;
}

:where(body.home, .editor-styles-wrapper) .amahasla-home-faq__layout > .wp-block-column {
    min-width: 0;
    margin: 0;
}

:where(body.home, .editor-styles-wrapper) .amahasla-home-faq__title {
    max-width: 14ch;
    margin: 0;
    color: #f5f5f2;
    font-family: inherit;
    font-size: clamp(38px, 4vw, 56px);
    font-weight: 500;
    letter-spacing: -0.045em;
    line-height: 1.02;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
    text-wrap: balance;
}

:where(body.home, .editor-styles-wrapper) .amahasla-home-faq__intro {
    max-width: 29ch;
    margin: 24px 0 0;
    color: #a6a6a2;
    font-size: 17px;
    line-height: 1.55;
}

:where(body.home, .editor-styles-wrapper) .amahasla-home-faq__list {
    margin: 0;
}

:where(body.home, .editor-styles-wrapper) .amahasla-home-faq__list > * {
    margin-block: 0;
}

:where(body.home, .editor-styles-wrapper) .amahasla-home-faq__item {
    margin: 0;
    border: 0;
    border-top: 1px solid rgb(255 255 255 / 14%);
    background: transparent;
}

:where(body.home, .editor-styles-wrapper) .amahasla-home-faq__item:last-child {
    border-bottom: 1px solid rgb(255 255 255 / 14%);
}

:where(body.home, .editor-styles-wrapper) .amahasla-home-faq__item > summary {
    position: relative;
    display: flex;
    min-height: 76px;
    align-items: center;
    margin: 0;
    padding: 21px 56px 21px 0;
    color: #f5f5f2;
    cursor: pointer;
    font-size: clamp(18px, 1.55vw, 21px);
    font-weight: 500;
    letter-spacing: -0.015em;
    line-height: 1.35;
    list-style: none;
    text-wrap: balance;
}

:where(body.home, .editor-styles-wrapper) .amahasla-home-faq__item > summary::-webkit-details-marker {
    display: none;
}

:where(body.home, .editor-styles-wrapper) .amahasla-home-faq__item > summary::marker {
    content: "";
}

:where(body.home, .editor-styles-wrapper) .amahasla-home-faq__item > summary::after {
    position: absolute;
    right: 0;
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 50%;
    background:
        linear-gradient(#171717, #171717) center / 12px 2px no-repeat,
        linear-gradient(#171717, #171717) center / 2px 12px no-repeat,
        #f5f5f2;
    content: "";
}

:where(body.home, .editor-styles-wrapper) .amahasla-home-faq__item[open] > summary::after {
    background:
        linear-gradient(#171717, #171717) center / 12px 2px no-repeat,
        #f5f5f2;
}

@media (hover: hover) {
    :where(body.home, .editor-styles-wrapper) .amahasla-home-faq__item > summary:hover::after {
        box-shadow: inset 0 0 0 2px #d8d8d4;
    }
}

:where(body.home, .editor-styles-wrapper) .amahasla-home-faq__item > summary:focus-visible {
    z-index: 1;
    border-radius: 8px;
    outline: 2px solid #f5f5f2;
    outline-offset: 5px;
}

:where(body.home, .editor-styles-wrapper) .amahasla-home-faq__item > :not(summary) {
    max-width: 62ch;
    margin: 0;
    padding: 0 56px 24px 0;
    color: #adadaa;
    font-size: 16px;
    line-height: 1.62;
}

@media screen and (max-width: 781px) {
    :where(body.home, .editor-styles-wrapper) .amahasla-home-faq {
        margin-top: 56px;
        padding: 28px 22px;
        border-radius: 24px;
    }

    :where(body.home, .editor-styles-wrapper) .amahasla-home-faq__layout {
        grid-template-columns: minmax(0, 1fr);
        gap: 38px;
    }

    :where(body.home, .editor-styles-wrapper) .amahasla-home-faq__title {
        max-width: 14ch;
        font-size: clamp(34px, 10vw, 42px);
    }

    :where(body.home, .editor-styles-wrapper) .amahasla-home-faq__intro {
        margin-top: 18px;
        font-size: 16px;
    }

    :where(body.home, .editor-styles-wrapper) .amahasla-home-faq__item > summary {
        min-height: 70px;
        padding: 18px 48px 18px 0;
        font-size: 18px;
        text-wrap: pretty;
    }

    :where(body.home, .editor-styles-wrapper) .amahasla-home-faq__item > summary::after {
        width: 34px;
        height: 34px;
        font-size: 22px;
    }

    :where(body.home, .editor-styles-wrapper) .amahasla-home-faq__item > :not(summary) {
        padding: 0 42px 22px 0;
        font-size: 15px;
    }
}

@media screen and (max-width: 360px) {
    :where(body.home, .editor-styles-wrapper) .amahasla-home-faq {
        padding: 24px 18px;
        border-radius: 22px;
    }

    :where(body.home, .editor-styles-wrapper) .amahasla-home-faq__title {
        font-size: 32px;
    }
}

@media (prefers-reduced-motion: reduce) {
    :where(body.home, .editor-styles-wrapper) .amahasla-home-faq *,
    :where(body.home, .editor-styles-wrapper) .amahasla-home-faq *::before,
    :where(body.home, .editor-styles-wrapper) .amahasla-home-faq *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }
}
