/* ==========================================
   FOOTER
========================================== */

.footer{

background:var(--secondary);

color:#CBD5E1;

position:relative;

overflow:hidden;

padding:90px 0 30px;

}

.footer::before{

content:"";

position:absolute;

top:-180px;

right:-120px;

width:380px;

height:380px;

border-radius:50%;

background:rgba(37,99,235,.12);

filter:blur(100px);

}

.footer::after{

content:"";

position:absolute;

bottom:-180px;

left:-120px;

width:340px;

height:340px;

border-radius:50%;

background:rgba(6,182,212,.10);

filter:blur(90px);

}

.footer .container{

position:relative;

z-index:2;

}

/* ==========================================
FOOTER GRID
========================================== */

.footer-grid{

display:grid;

grid-template-columns:2fr 1fr 1fr 1fr;

gap:60px;

align-items:flex-start;

}

/* ==========================================
FOOTER LOGO
========================================== */

.footer-logo{

display:flex;

align-items:center;

gap:15px;

margin-bottom:25px;

}

.footer-logo img{

width:58px;

height:58px;

object-fit:contain;

}

.footer-logo h3{

font-size:28px;

color:#fff;

margin-bottom:4px;

}

.footer-logo span{

font-size:13px;

color:#94A3B8;

}

.footer p{

color:#94A3B8;

line-height:1.9;

margin-bottom:25px;

}

.footer h4{

font-size:20px;

color:#fff;

margin-bottom:22px;

}

.footer ul{

display:flex;

flex-direction:column;

gap:14px;

}

.footer ul li{

list-style:none;

}

.footer ul a{

color:#94A3B8;

transition:.3s;

display:inline-block;

}

.footer ul a:hover{

color:#fff;

padding-left:8px;

}

.footer-contact{

display:flex;

flex-direction:column;

gap:16px;

}

.footer-contact div{

display:flex;

gap:14px;

align-items:flex-start;

}

.footer-contact i{

color:var(--primary);

font-size:18px;

margin-top:3px;

}

.social-links{

display:flex;

gap:15px;

margin-top:30px;

}

.social-links a{

width:48px;

height:48px;

display:flex;

align-items:center;

justify-content:center;

border-radius:50%;

background:rgba(255,255,255,.08);

transition:.35s;

font-size:18px;

}

.social-links a:hover{

background:var(--primary);

transform:translateY(-5px);

}

.footer-divider{

height:1px;

background:rgba(255,255,255,.08);

margin:60px 0 30px;

}

.footer-bottom{

display:flex;

justify-content:space-between;

align-items:center;

gap:20px;

flex-wrap:wrap;

}

.footer-bottom p{

margin:0;

font-size:15px;

}

.footer-bottom-links{

display:flex;

gap:25px;

flex-wrap:wrap;

}

.footer-bottom-links a{

font-size:15px;

color:#94A3B8;

transition:.3s;

}

.footer-bottom-links a:hover{

color:#fff;

}

/* ==========================================
NEWSLETTER
========================================== */

.newsletter{

margin-top:30px;

display:flex;

border-radius:50px;

overflow:hidden;

background:rgba(255,255,255,.08);

}

.newsletter input{

flex:1;

border:none;

background:transparent;

padding:15px 20px;

color:#fff;

outline:none;

}

.newsletter input::placeholder{

color:#94A3B8;

}

.newsletter button{

padding:0 24px;

background:var(--primary);

border:none;

color:#fff;

cursor:pointer;

transition:.3s;

}

.newsletter button:hover{

background:#1D4ED8;

}

.footer-grid>div{

transition:.35s;

}

.footer-grid>div:hover{

transform:translateY(-3px);

}