
#cc__benefits {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 30px;

    .content {
        display: flex;
        flex-flow: column nowrap;
        gap: 30px;

        header {
            .sub {
                text-transform: uppercase;
                letter-spacing: 10%;
            }
        }

        ul {
            padding: 0;

            li {
                list-style-type: none;
                border-bottom: 1px solid grey;
                padding: 10px 0;
                color: var(--color-text-secondary)r
            }
        }
    }
}

#cc__faq {
    ul {
        padding: 0;

        li {
            list-style-type: none;
            border-top: 1px solid black;
            cursor: pointer;

            .close { display: none; }
            .open { display: block; }

            header {
                font-size: var(--font-size-md);
                font-weight: bold;
                display: grid;
                grid-template-columns: auto 50px;
                align-items: center;
                justify-content: space-between;

                .actions > svg {
                    width: 50px;
                    height: 50px;
                }
            }

            p { 
                display: none; 
                margin-bottom: 15px;
            }
        }

        li:last-child {
            border-bottom: 1px solid black;
        }

        li[data-state="open"] {
            .close { display: block; }
            .open { display: none; }
            p { display: block; }
        }
    }

    footer {
        margin-top: var(--content-margin);
        text-align: center;
        display: flex;
        flex-flow: column nowrap;
        align-items: center;
        gap: 15px;

        p {
            text-transform: uppercase;
            font-size: var(--font-size-md);
            letter-spacing: 15%;
        }
    }
}
