/* =========================================================
   BAYSIDE ATTRACTIONS - SHARED FOOTER
   Load after style.css
   ========================================================= */


/* =========================================
   FOOTER
========================================= */

.footer{
  background:#061f2b;
  color:#c3d6db;
  padding:52px 0 26px;
}


/* =========================================
   FOOTER GRID
========================================= */

.footer-grid{
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr;
  gap:48px;
  align-items:start;
}


/* =========================================
   FOOTER HEADINGS
========================================= */

.footer h3{
  margin:0 0 18px;
  color:#fff;
  font-size:1rem;
}


/* =========================================
   FOOTER BRAND
========================================= */

.footer-brand{
  max-width:430px;
}


/* =========================================
   FOOTER LOGO
========================================= */

.footer-logo{
  display:inline-block;
  margin-bottom:18px;
  text-decoration:none;
}

.footer-logo img{
  display:block;
  width:145px;
  max-width:145px;
  height:auto;
}


/* =========================================
   FOOTER DESCRIPTION
========================================= */

.footer-brand p{
  max-width:420px;
  margin:0;
  color:#c3d6db;
  line-height:1.7;
}


/* =========================================
   FOOTER LINKS
========================================= */

.footer a{
  color:#d8e8eb;
  text-decoration:none;
}

.footer a:hover{
  color:#fff;
}

.footer-links{
  display:grid;
  gap:9px;
}

.footer-links a{
  display:block;
  width:max-content;
  max-width:100%;
}


/* =========================================
   COPYRIGHT / BOTTOM
========================================= */

.footer-bottom{
  margin-top:42px;
  padding-top:20px;

  border-top:1px solid rgba(255,255,255,.12);

  font-size:.86rem;
  color:#93aeb5;
}


/* =========================================
   TABLET
========================================= */

@media (max-width:900px){

  .footer-grid{
    grid-template-columns:1.4fr 1fr 1fr;
    gap:30px;
  }

  .footer-logo img{
    width:130px;
    max-width:130px;
  }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width:680px){

  .footer{
    padding:42px 0 24px;
  }

  .footer-grid{
    grid-template-columns:1fr;
    gap:34px;
  }

  .footer-brand{
    max-width:none;
  }

  .footer-logo img{
    width:130px;
    max-width:130px;
  }

  .footer-bottom{
    margin-top:32px;
  }

}


/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width:430px){

  .footer-logo img{
    width:120px;
    max-width:120px;
  }

}