/* ═════════════════════════════════════════════
   FOOTER SECTION
═════════════════════════════════════════════ */
#contact{
  background:#c8c7c7;
  padding:70px 50px 0;
  font-family:'DM Sans',sans-serif;
  overflow:hidden;
}

/* ═════════════════════════════════════════════
   CONTAINER
═════════════════════════════════════════════ */
.footer-container{
  width:100%;
  max-width:1400px;
  margin:auto;

  display:grid;
  grid-template-columns:1.5fr 1.5fr 1.5fr;
  gap:50px;

  align-items:flex-start;
}

/* ═════════════════════════════════════════════
   COLUMN
═════════════════════════════════════════════ */
.footer-col{
  width:100%;
}

/* ═════════════════════════════════════════════
   LOGO
═════════════════════════════════════════════ */
.footer-logo{
  width:100%;
  max-width:320px;
  height:auto;

  margin-bottom:24px;

  object-fit:contain;
}

/* ═════════════════════════════════════════════
   TAGLINE
═════════════════════════════════════════════ */
.footer-tagline p{
  margin:6px 0;

  font-size:16px;
  font-weight:500;
  line-height:1.7;

  color:#444;
}

.footer-tagline span{
  color:#f57c00;
  font-weight:700;
  font-style:italic;
}

/* ═════════════════════════════════════════════
   HEADINGS
═════════════════════════════════════════════ */
.footer-col h3{
  font-size:24px;
  font-weight:700;

  margin-bottom:24px;

  color:#0d0000;
}

/* ═════════════════════════════════════════════
   LINKS
═════════════════════════════════════════════ */
.footer-links{
  list-style:none;
  padding:0;
  margin:0;
}

.footer-links li{
  margin-bottom:14px;
}

.footer-links a{
  text-decoration:none;

  color:#0d0000;

  font-size:17px;
  font-weight:500;

  transition:.3s ease;
}

.footer-links a:hover{
  color:#f57c00;
  padding-left:4px;
}

/* ═════════════════════════════════════════════
   CONTACT ITEMS
═════════════════════════════════════════════ */
.contact-item{
  display:flex;
  align-items:flex-start;
  gap:12px;

  margin-bottom:18px;

  color:#0d0000;

  font-size:16px;
  line-height:1.6;
}

.contact-item .icon{
  color:#f57c00;
  font-size:18px;

  flex-shrink:0;

  margin-top:3px;
}

/* ═════════════════════════════════════════════
   SOCIAL
═════════════════════════════════════════════ */
.footer-social{
  margin-top:24px;

  display:flex;
  flex-wrap:wrap;
  gap:12px;
}

.footer-social a{
  width:42px;
  height:42px;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  background:#f57c00;
  color:#000;

  border-radius:50%;

  text-decoration:none;

  font-size:16px;
  font-weight:700;

  transition:.3s ease;
}

.footer-social a:hover{
  transform:translateY(-3px);
  background:#000;
  color:#fff;
}

/* ═════════════════════════════════════════════
   BOTTOM BAR
═════════════════════════════════════════════ */
.footer-bottom{
  margin-top:50px;

  background:#000;
  color:#fff;

  text-align:center;

  padding:18px 15px;

  font-size:14px;
  line-height:1.6;
}

/* ═════════════════════════════════════════════
   LARGE TABLET
═════════════════════════════════════════════ */
@media (max-width:1024px){

  #contact{
    padding:60px 35px 0;
  }

  .footer-container{
    grid-template-columns:1fr 1fr;
    gap:40px;
  }

  .footer-col:first-child{
    grid-column:1 / -1;
  }

  .footer-logo{
    max-width:280px;
  }

  .footer-col h3{
    font-size:22px;
  }

  .footer-links a{
    font-size:16px;
  }
}

/* ═════════════════════════════════════════════
   TABLET
═════════════════════════════════════════════ */
@media (max-width:768px){

  #contact{
    padding:50px 24px 0;
  }

  .footer-container{
    grid-template-columns:1fr;
    gap:40px;

    text-align:center;
  }

  .footer-logo{
    margin:0 auto 20px;
  }

  .footer-tagline{
    max-width:600px;
    margin:auto;
  }

  .contact-item{
    justify-content:center;
    text-align:left;
  }

  .footer-social{
    justify-content:center;
  }

  .footer-col h3{
    margin-bottom:18px;
  }

  .footer-links li{
    margin-bottom:12px;
  }
}

/* ═════════════════════════════════════════════
   MOBILE
═════════════════════════════════════════════ */
@media (max-width:640px){

  #contact{
    padding:45px 16px 0;
  }

  .footer-container{
    gap:35px;
  }

  .footer-logo{
    max-width:220px;
  }

  .footer-col h3{
    font-size:20px;
  }

  .footer-tagline p{
    font-size:14px;
  }

  .footer-links a{
    font-size:15px;
  }

  .contact-item{
    gap:10px;
    font-size:14px;
  }

  .contact-item .icon{
    font-size:16px;
  }

  .footer-social{
    gap:10px;
  }

  .footer-social a{
    width:38px;
    height:38px;

    font-size:14px;
  }

  .footer-bottom{
    margin-top:40px;
    padding:16px 12px;

    font-size:13px;
  }
}

/* ═════════════════════════════════════════════
   SMALL MOBILE
═════════════════════════════════════════════ */
@media (max-width:400px){

  .footer-logo{
    max-width:180px;
  }

  .footer-col h3{
    font-size:18px;
  }

  .footer-links a{
    font-size:14px;
  }

  .footer-tagline p{
    font-size:13px;
  }

  .footer-bottom{
    font-size:12px;
  }
}