/* Homepage FAQ section. Sits between testimonials and the final CTA. */

.swp-faq {
    padding: 90px 0 100px;
    background: #ffffff;
}

.swp-faq .swf-inner {
    max-width: 820px;
    margin: 0 auto;
    padding: 0 24px;
}

.swp-faq .swf-head {
    text-align: center;
    margin-bottom: 44px;
}

.swp-faq .swf-eyebrow {
    display: inline-block;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #ff0074;
    margin-bottom: 14px;
}

.swp-faq .swf-title {
    font-family: 'GilroyExtraBold', 'Arial', sans-serif;
    font-size: 38px;
    line-height: 1.05;
    color: #2a2a2a;
    margin: 0;
    letter-spacing: -0.01em;
}

.swp-faq .swf-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.swp-faq .swf-item {
    border-bottom: 1px solid #ece7e2;
}
.swp-faq .swf-item:first-child {
    border-top: 1px solid #ece7e2;
}

.swp-faq details { padding: 0; }

.swp-faq .swf-q {
    list-style: none;
    cursor: pointer;
    padding: 22px 4px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    font-family: 'GilroyExtraBold', 'Arial', sans-serif;
    font-size: 18px;
    color: #2a2a2a;
    transition: color .15s ease;
}
.swp-faq .swf-q::-webkit-details-marker { display: none; }
.swp-faq .swf-q:hover { color: #ff0074; }

.swp-faq .swf-icon {
    flex: 0 0 auto;
    width: 18px; height: 18px;
    position: relative;
}
.swp-faq .swf-icon::before,
.swp-faq .swf-icon::after {
    content: '';
    position: absolute;
    background: #2a2a2a;
    transition: transform .25s ease;
}
.swp-faq .swf-icon::before { /* horizontal */
    left: 0; right: 0; top: 50%; height: 2px; margin-top: -1px;
}
.swp-faq .swf-icon::after { /* vertical */
    top: 0; bottom: 0; left: 50%; width: 2px; margin-left: -1px;
}
.swp-faq details[open] .swf-icon::after { transform: scaleY(0); }
.swp-faq .swf-q:hover .swf-icon::before,
.swp-faq .swf-q:hover .swf-icon::after { background: #ff0074; }

.swp-faq .swf-a {
    padding: 0 4px 22px;
    color: #555;
    font-size: 16px;
    line-height: 1.65;
    max-width: 720px;
}
.swp-faq .swf-a p { margin: 0; }

@media (max-width: 700px) {
    .swp-faq { padding: 70px 0 80px; }
    .swp-faq .swf-title { font-size: 28px; }
    .swp-faq .swf-q { font-size: 16px; padding: 18px 4px; }
    .swp-faq .swf-a { font-size: 15px; padding-bottom: 18px; }
}