.footer {
    padding-top: 56px;
    padding-bottom: 56px;
    background:#FAFAFA;

    &.active-catalog {
        position:relative;
        z-index:1000;
     }

    .footer-main {
        display:flex;
        justify-content:space-between;
        gap:70px;
        padding-bottom:32px;
        border-bottom:1px solid #E5E5E6;


        .footer-info {
            max-width:275px;

            .footer-info-logo {
                max-width:125px;
                margin-bottom:16px;

                a {
                    width:100%;
                }

                img {
                    max-width:100%;
                }
            }

            .footer-info-text {
                font-size: 14px;
                font-weight: 400;
                line-height: 140%;
                letter-spacing: 0.14px;
                margin-bottom:24px;
            }

            .footer-info-socials {
                display:flex;
                gap: 8px;

                a {
                    display:flex;
                    align-items:center;
                    justify-content:center;
                    width:40px;
                    height:40px;
                    border-radius: 24px;
                    border: 0.5px solid #D1D1D2;

                    img {
                        width:20px;
                        height:20px;
                        display:block;
                    }
                }
            }
        }

        .footer-menu-wrap {
            display:flex;
            gap:48px;

            .footer-menu {
                width:200px;
                margin-bottom:12px;

                .footer-menu-title {
                    font-size: 16px;
                    font-weight: 600;
                    line-height: 150%;
                    letter-spacing: 0.16px;
                    margin-bottom:25px;
                }

                a {
                    font-size: 14px;
                    font-weight: 400;
                    line-height: 140%;
                    letter-spacing: 0.14px;
                    margin-bottom:6px;
                    display:inline-block;
                }
            }
        }
    }

    .footer-contact {
        padding-top:32px;
        padding-bottom:32px;
        border-bottom: 1px solid #E5E5E6;
        display:flex;
        justify-content: space-between;

        .footer-contact-block {
            max-width:566px;
            row-gap: 28px;
            display:flex;
            flex-wrap:wrap;
            column-gap: 40px;

            .footer-contact-item {
                flex:1 0 calc(calc(100% / 3) - 40px);

                .footer-contact-item-head {
                    color: #9A9AA2;
                    font-size: 12px;
                    font-weight: 400;
                    line-height: 150%;
                    letter-spacing: 0.12px;
                    margin-bottom:4px;

                    span {
                        display:block;
                    }
                }

                .footer-contact-item-value {
                    font-size: 14px;
                    font-weight: 400;
                    line-height: 140%;
                    letter-spacing: 0.14px;

                    .footer-contact-item-work {
                        display: flex;
                        gap:8px;
                    }
                }
            }
        }

        .footer-subscribe {
            max-width:522px;

            .footer-subscribe-head {
                color: #171717;
                font-size: 20px;
                font-weight: 500;
                line-height: 140%;
                letter-spacing: 0.2px;
                margin-bottom:8px;
            }

            .footer-subscribe-text {
                color: #7A7A85;
                font-size: 16px;
                font-weight: 400;
                line-height: 140%;
                letter-spacing: 0.16px;
                margin-bottom:30px;
            }

            .footer-subscribe-form {

                form {
                    display:flex;
                    justify-content: space-between;

                    .footer-subscribe-input {
                        width:calc(100% - 158px);

                        input {
                            width:100%;
                            height:42px;
                            padding:0 16px;
                            color: #9A9AA2;
                            font-size: 16px;
                            font-weight: 400;
                            line-height: 140%;
                            letter-spacing: 0.16px;
                            border-radius: 8px;
                            border: 1px solid #D1D1D2;
                            background: #FFF;
                        }

                    }

                    .footer-subscribe-button {
                        button {
                            width:150px;
                            font-size: 12px;
                            line-height: 100%;
                            letter-spacing: 0.24px;
                            min-height: 42px;
                        }
                    }
                }
            }
        }
    }

    .footer-copyright {
        padding-top:32px;
        display:flex;
        justify-content:space-between;

        .footer-copyright-pay {
            display:flex;
            gap:12px;

            img {
                display:block;
                max-height:20px;
            }
        }

        .footer-copyright-block {
            display:flex;
            justify-content:space-between;
            gap:32px;
            align-items:center;

            .footer-copyright-text {
                color: #9A9AA2;
                font-size: 14px;
                line-height: 140%;
                letter-spacing: 0.14px;
            }

            .footer-copyright-menu ul {
                display:flex;
                gap:24px;

                a {
                    color: #9A9AA2;
                    font-size: 14px;
                    line-height: 140%;
                    letter-spacing: 0.14px;
                }
            }
        }
    }
}

.footer__panel {
    position:fixed;
    z-index:9;
    bottom:0;
    left:0;
    width:100%;
    padding:8px 16px 20px 16px;
    background:#fff;
    border-radius: 15px 15px 0 0;
    box-shadow: 0 -12px 37px 0 rgba(230, 235, 243, 0.50);

    .footer__panel-blocks {
        display:flex;
        justify-content: space-between;

        .footer__panel-block {
            min-width:55px;
            position:relative;

            &.footer__panel-block--catalog {
                .footer__panel-icon {
                    .footer__panel-icon--svg {
                        display: inline-flex;
                        align-items: center;
                        justify-content: center;
                        width:24px;
                        height:24px;
                    }
                }
            }

            .footer__panel-icon {
                text-align:center;
            }

            &.active svg path, &.active svg, &.active rect, &.active circle {
                /* fill: #171717; */
            }

            &.active .footer__panel-title {
                color: #171717;
            }


            .footer__panel-title {
                color: var(--Gray-6, #9A9AA2);
                text-align: center;
                font-size: 12px;
                font-style: normal;
                font-weight: 400;
                line-height: 130%;
                letter-spacing: 0.24px;
            }

            a {
                display:block;
                width:100%;
                height:100%;
                position:absolute;
                top:0;
                left:0;
            }

        }
    }
}

@media (max-width: 1200px) {
    .footer {
        .footer-main {
            flex-wrap: wrap;

            .footer-info {
                flex: 1 0 100%;
                max-width:100%;
            }
            .footer-menu-wrap {
                flex: 1 0 100%;

                .footer-menu {
                    flex: 1 0 calc(calc(100% / 4) - 48px);
                    width: auto;
                }
            }
        }
        .footer-contact {
            flex-direction: column-reverse;
            gap:30px;


            .footer-contact-block {
                flex: 1 0 100%;
                max-width:100%;

                .footer-contact-item {
                    flex: 1 0 calc(calc(100% / 3) - 40px);
                }
            }
        }
    }
}

@media (max-width: 600px) {
    .footer {
        padding-bottom:178px;

        .footer-main {
            gap: 40px;

            .footer-menu-wrap {
                flex: 1 0 100%;
                justify-content:space-between;
                column-gap:0px;
                row-gap:48px;
                flex-wrap:wrap;

                .footer-menu {
                    flex:none;
                    width:48%;
                    margin-bottom:0;

                    .footer-menu-title {
                        margin-bottom:16px;
                    }
                }
            }
        }
        .footer-contact {
            gap:48px;

            .footer-contact-block {
                .footer-contact-item {
                    flex: 1 0 calc(calc(100% / 2) - 40px);
                }
            }

            .footer-subscribe {
                max-width:100%;

                .footer-subscribe-text {
                    margin-bottom:24px;
                }
            }
        }
        .footer-copyright {
            flex-wrap:wrap;
            gap:24px;

            .footer-copyright-block {
                width:100%;
                flex:none;
                flex-wrap:wrap;
                gap:16px;

                .footer-copyright-text {
                    flex: 1 0 100%;
                    order:1;
                }
                .footer-copyright-menu {
                    flex: 1 0 100%;
                    order:0;
                }
            }

            .footer-copyright-pay {
                flex: 1 0 100%;
                flex-wrap:wrap;
            }
        }
    }
}
