#process-tabs {

    .wrap {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 70px;


        @media only screen and (max-width: 980px) {
            grid-template-columns: 1fr;
            gap: 25px;

            .tabs {
                order: 2;
            }

            .content {
                order: 1;
            }          
        }

        .tabs {

            .list {
                .item {
                    border-top: 1px dashed #3e4047;
                    padding-block: 48px;

                    .question {
                        display: flex;
                        gap: 30px;
                        align-items: center;

                        .num {
                            color: var(--text);
                        }


                        .heading {
                            font-size: 104px;
                            font-weight: 500;
                            font-family: var(--font-heading);
                            color: #fff;
                            text-transform: uppercase;
                        }               

                        .icon {
                            margin-left: auto;
                            width: 64px;
                            height: 64px;
                            font-size: 32px;
                            border-radius: 50%;
                            border: 1px solid var(--primary);
                            display: flex;
                            align-items: center;
                            justify-content: center;
                            cursor: pointer;
                            transition: all 0.3s;

                            &:hover {
                                background: var(--primary);
                                border-color: var(--primary);
                                color: #000;
                            }
                        }    


                        &.open {
                            .icon {
                                rotate: 45deg;
                            }
                        }
                               
                    }

                    .answer {
                        display: grid;
                        grid-template-rows: 0fr;
                        transition: grid-template-rows 0.5s ease-out;

                        .inner {
                            color: var(--text);
                            line-height: 1.3;                          
                            overflow: hidden;
                            transition: all 0.5s;
                        }

                        &.open {
                            grid-template-rows: 1fr;

                            .inner {
                                padding-top: 64px;
                            }
                        }
                    }
                }
            }

        }

        .content {
            border-radius: 64px;
            padding: 64px;
            border: 1px solid #fff;

            display: grid;
            gap: 64px;

            .text {
                align-self: end;
                display: grid;
                gap: 32px;               
            }

            @media only screen and (max-width: 980px) {
                padding: 0px;
                gap: 25px;
                border: none;
            }


        }
    }


    &[data-background="primary"] {
        background: var(--primary);
        margin-inline: 10px;
        padding-block: 100px;

        .item,
        .icon {
            border-color: #000 !important;
        }

        .num,
        .heading,
        .inner,
        .icon {
            color: #000 !important;
        }

        .icon:hover {
            background: #000 !important;
            color: #fff !important;
        }

        .content {
            border-color: #000 !important;

            img {
                filter: brightness(0);
            }

            .title,
            .description {
                color: #000 !important;
            }
        }
    }


}