.footer {
position: relative;
background-color: var(--clr-white);
z-index: 2;
}
.footer__shape {
padding: 90px 0;
border-radius: 66px 66px 0 0;
background-color: var(--clr-green);
}
.footer__wrap {
display: flex;
flex-direction: column;
gap: 80px;
}
.footer__top {
display: flex;
flex-direction: row;
justify-content: space-between;
}
.footer__article {
max-width: 320px;
display: flex;
flex-direction: column;
gap: 30px;
}
.footer__title {
margin: 0;
color: var(--clr-gray);
font-size: 20px;
font-weight: 500;
line-height: 120%;
letter-spacing: -0.6%;
}
.footer__nav {
display: flex;
flex-direction: column;
gap: 20px;
}
.footer__link {
margin: 0;
color: var(--clr-white);
font-size: 16px;
font-weight: 400;
line-height: 120%;
letter-spacing: -0.6%;
}
.footer__bottom {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
}
.footer__copyright {
margin: 0;
color: var(--clr-white);
font-size: 16px;
font-weight: 400;
line-height: 120%;
letter-spacing: -0.6%;
}
.footer__social-list {
display: flex;
flex-direction: row;
align-items: center;
gap: 10px;
}
.footer__social-link {
display: flex;
}
.footer__social-icon {
height: 42px;
width: 42px;
}
@media screen and (max-width: 1024px) {
.footer__top {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 20px;
row-gap: 40px;
}
}
@media screen and (max-width: 768px) {
.footer__top {
display: flex;
flex-direction: column;
}
.footer__shape {
border-radius: var(--bor-radius-l) var(--bor-radius-l) 0 0;
}
.footer__bottom {
flex-direction: column;
align-items: flex-start;
gap: 20px;
}
}