/* Footer component */
.footer {
    position: relative;
    overflow: hidden;
    width: calc(100% - 8px);
    margin: 0 4px;
    padding: 68px 0 24px;
    border-radius: 36px 36px 0 0;
    background: #30322f;
    color: #fff;
    font-family: var(--font-body);
}
.footer::before {
    content: "";
    position: absolute;
    width: 380px;
    height: 380px;
    right: -180px;
    top: -180px;
    border-radius: 50%;
    background: rgba(103, 145, 66, .12);
    pointer-events: none;
}
.footer__grid {
    position: relative;
    display: grid;
    grid-template-columns: minmax(245px, 1.35fr) repeat(3, minmax(150px, 1fr));
    gap: clamp(36px, 5vw, 72px);
    padding-bottom: 56px;
}
.footer__brand { max-width: 310px; }
.footer__logo { display: inline-flex; margin-bottom: 24px; }
.footer__logo img { display: block; width: auto; max-width: 190px; height: auto; }
.footer__lead { margin: 0 0 24px; color: rgba(255,255,255,.68); font-size: 15px; line-height: 1.55; }
.footer__phone { display: inline-flex; margin-bottom: 18px; color: #fff; font-size: clamp(19px, 1.6vw, 23px); font-weight: 650; line-height: 1.2; }
.footer__phone:hover, .footer__phone:focus-visible { color: #c7ddaF; }
.footer__socials { display: flex; gap: 8px; }
.footer__socials a { display: inline-flex; border-radius: 50%; transition: transform var(--transition-base), opacity var(--transition-base); }
.footer__socials a:hover, .footer__socials a:focus-visible { transform: translateY(-2px); opacity: .88; }

.footer__group { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.footer__heading { margin: 0 0 8px; color: rgba(255,255,255,.46); font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.footer__group > a,
.footer__studio {
    border: 0;
    padding: 0;
    background: transparent;
    color: rgba(255,255,255,.88);
    font: inherit;
    font-size: 16px;
    line-height: 1.35;
    text-align: left;
    cursor: pointer;
    transition: color var(--transition-base), transform var(--transition-base);
}
.footer__group > a:hover,
.footer__group > a:focus-visible,
.footer__studio:hover,
.footer__studio:focus-visible { color: #c7ddaf; transform: translateX(2px); }
.footer__group > .footer_all-mid-link--active { color: #c7ddaf; }

.footer__studio { display: flex; flex-direction: column; gap: 2px; }
.footer__studio span { font-weight: 600; }
.footer__studio small { color: rgba(255,255,255,.46); font-size: 13px; }
.footer__hours { margin: 4px 0 0; color: rgba(255,255,255,.52); font-size: 14px; line-height: 1.4; }

.footer__bottom {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    padding-top: 22px;
    border-top: 1px solid rgba(255,255,255,.10);
    color: rgba(255,255,255,.42);
    font-size: 13px;
    line-height: 1.4;
}
.footer__bottom p { margin: 0; }
.footer__developer { display: flex; flex-direction: column; align-items: flex-end; gap: 7px; }
.footer__developer a { display: inline-flex; opacity: .7; transition: opacity var(--transition-base); }
.footer__developer a:hover { opacity: 1; }
.footer__developer img { display: block; max-width: 112px; height: auto; }

@media (max-width: 1024px) {
    .footer { padding-top: 56px; }
    .footer__grid { grid-template-columns: 1.25fr 1fr 1fr; }
    .footer__legal { grid-column: 2 / 4; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; }
    .footer__legal .footer__heading { grid-column: 1 / -1; }
}

@media (max-width: 720px) {
    .footer { padding: 44px 0 22px; }
    .footer__grid { grid-template-columns: 1fr 1fr; gap: 36px 24px; padding-bottom: 40px; }
    .footer__brand { grid-column: 1 / -1; max-width: none; padding-bottom: 28px; border-bottom: 1px solid rgba(255,255,255,.10); }
    .footer__lead { max-width: 380px; }
    .footer__legal { grid-column: 1 / -1; display: flex; padding-top: 26px; border-top: 1px solid rgba(255,255,255,.10); }
    .footer__bottom { align-items: flex-start; flex-direction: column; }
    .footer__developer { align-items: flex-start; }
}

@media (max-width: 430px) {
    .footer__grid { grid-template-columns: 1fr; }
    .footer__brand, .footer__legal { grid-column: auto; }
    .footer__group { gap: 12px; }
    .footer__phone { font-size: 20px; }
}

@media (max-width: 640px) {
    .footer { border-radius: 26px 26px 0 0; }
}