Files
website/apps/web/src/components/Footer.css
T
Alireza HassaniandCursor fa629d65e8 Add real contact address and WhatsApp links to the public site.
Replace placeholder contact details so footer and contact page show accurate HQ info and chat channels.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-08-12 08:34:48 +03:30

136 lines
2.3 KiB
CSS

.footer {
background: linear-gradient(165deg, var(--dark-blue-mid) 0%, var(--dark-blue) 55%, #071d40 100%);
color: rgba(255, 255, 255, 0.86);
padding: 4rem 0 1.75rem;
margin-top: 0;
}
.footer__top {
display: grid;
grid-template-columns: 1.2fr 1.8fr;
gap: 3rem;
padding-bottom: 2.75rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
.footer__logo {
display: inline-flex;
align-items: center;
gap: 0.65rem;
font-size: 1.2rem;
font-weight: 800;
letter-spacing: -0.04em;
color: var(--white);
margin-bottom: 0.9rem;
}
.footer__mark {
width: 1.45rem;
height: 1.45rem;
border-radius: 0.3rem;
background: linear-gradient(145deg, var(--blue-soft), var(--blue));
}
.footer__brand p {
max-width: 22rem;
font-size: 0.94rem;
line-height: 1.55;
color: rgba(232, 238, 246, 0.78);
}
.footer__contact {
margin-top: 1rem;
}
.footer__whatsapp {
display: flex;
flex-direction: column;
gap: 0.35rem;
margin-top: 0.75rem;
}
.footer__whatsapp a {
font-size: 0.9rem;
font-weight: 500;
color: rgba(255, 255, 255, 0.9);
transition: color 0.2s ease;
}
.footer__whatsapp a:hover {
color: var(--white);
}
.footer__cols {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 1.5rem;
}
.footer__col h3 {
font-size: 0.78rem;
font-weight: 700;
letter-spacing: 0.12em;
text-transform: uppercase;
color: rgba(255, 255, 255, 0.55);
margin-bottom: 1rem;
}
.footer__col ul {
list-style: none;
display: flex;
flex-direction: column;
gap: 0.65rem;
}
.footer__col a {
font-size: 0.92rem;
font-weight: 500;
color: rgba(255, 255, 255, 0.88);
transition: color 0.2s ease;
}
.footer__col a:hover {
color: var(--white);
}
.footer__bottom {
display: flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
padding-top: 1.35rem;
font-size: 0.84rem;
color: rgba(232, 238, 246, 0.62);
}
.footer__legal {
display: flex;
gap: 1.25rem;
}
.footer__legal a:hover {
color: var(--white);
}
@media (max-width: 860px) {
.footer__top {
grid-template-columns: 1fr;
gap: 2.25rem;
}
.footer__cols {
grid-template-columns: 1fr 1fr;
}
}
@media (max-width: 520px) {
.footer__cols {
grid-template-columns: 1fr;
}
.footer__bottom {
flex-direction: column;
align-items: flex-start;
}
}