/* =========================================================
   FAUNA OF INDIA — MODERN FOOTER
========================================================= */

.fauna-footer {
     position: relative;

     width: 100%;
     margin-top: 60px;
     color: #ffffff;
     background: #2a4173;
     overflow: visible;
     font-family: inherit;
}

/* ZSI Government Logo */
.fauna-footer-brand .zsi_logo {
     display: flex;
     justify-content: center;
     align-items: center;
}

.fauna-footer-brand .zsi_logo img {
     width: 100px;
     height: 100px;
     display: block;
     object-fit: contain;
}

/* =========================================================
   MAIN FOOTER
========================================================= */

.fauna-footer-main {
     width: 100%;
     max-width: 1500px;

     margin: 0 auto;
     padding: 55px 45px;

     display: grid;

     grid-template-columns:
          300px minmax(0, 1fr);

     gap: 45px;

     align-items: start;
}


/* =========================================================
   BRAND
========================================================= */

.fauna-footer-brand {
     padding-right: 35px;

     border-right:
          1px solid rgba(255, 255, 255, .20);
}


/* Government text */

.footer-eng {
     margin: 0;

     color: rgba(255, 255, 255, .82);

     font-size: 12px;

     line-height: 1.6;

     text-align: center;
}


.footer-eng span {
     color: #ffffff;

     font-size: 14px;

     font-weight: 700;
}


/* =========================================================
   FOOTER ZSI TITLE
========================================================= */

.footer-title {
     margin-top: 22px;

     text-align: center;
}


.footer-title p {
     margin: 0 0 5px;

     color: #ffffff;

     font-size: 14px;

     font-weight: 600;
}


.footer-title h2 {
     margin: 0;

     color: #ffffff;

     font-size: 23px;

     font-weight: 800;

     line-height: 1.2;
}


.footer-title::after {
     content: "";

     display: block;

     width: 55px;
     height: 3px;

     margin: 12px auto 0;

     border-radius: 10px;

     background: #f5b82e;
}


/* =========================================================
   LINK GRID
========================================================= */

.foot_links {
     width: 100%;

     display: grid;

     grid-template-columns:
          repeat(4, minmax(0, 1fr));

     gap: 0;
}


/* =========================================================
   COLUMNS
========================================================= */

.foot_links1,
.foot_links2,
.foot_links3,
.foot_links4 {
     min-width: 0;

     padding: 0 25px;
}


.foot_links1 {
     padding-left: 0;
}


.foot_links4 {
     padding-right: 0;
}


.foot_links2,
.foot_links3,
.foot_links4 {
     border-left:
          1px solid rgba(255, 255, 255, .18);
}


/* =========================================================
   HEADINGS
========================================================= */

.fauna-footer h4 {
     position: relative;

     margin: 0 0 18px;

     padding-bottom: 10px;

     color: #ffffff;

     font-size: 16px;

     font-weight: 700;

     line-height: 1.4;
}


.fauna-footer h4::after {
     content: "";

     position: absolute;

     left: 0;
     bottom: 0;

     width: 35px;
     height: 3px;

     border-radius: 10px;

     background: #f5b82e;

     transition: width .3s ease;
}


.foot_links1:hover h4::after,
.foot_links2:hover h4::after,
.foot_links3:hover h4::after,
.foot_links4:hover h4::after {
     width: 60px;
}


/* =========================================================
   LIST
========================================================= */

.fauna-footer ul {
     margin: 0;
     padding: 0;

     list-style: none;
}


.fauna-footer li {
     margin: 0;
     padding: 0;
}


.fauna-footer li+li {
     margin-top: 4px;
}


/* =========================================================
   LINKS
========================================================= */

.fauna-footer .foot_links a {
     display: flex;

     align-items: center;

     width: 100%;

     min-height: 40px;

     padding: 7px 8px;

     color: rgba(255, 255, 255, .82);

     text-decoration: none;

     font-size: 14px;

     font-weight: 500;

     line-height: 1.4;

     border-radius: 6px;

     transition:
          color .25s ease,
          background .25s ease,
          padding-left .25s ease;
}


/* =========================================================
   LINK ARROW
========================================================= */

.fauna-footer .foot_links a::before {
     content: "›";

     display: inline-flex;

     align-items: center;
     justify-content: center;

     width: 22px;
     height: 22px;

     margin-right: 8px;

     flex-shrink: 0;

     color: #f5b82e;

     border: 1px solid rgba(245, 184, 46, .45);

     border-radius: 50%;

     font-size: 16px;

     font-weight: 700;

     transition:
          background .25s ease,
          color .25s ease,
          transform .25s ease;
}


/* =========================================================
   LINK HOVER
========================================================= */

.fauna-footer .foot_links a:hover {
     color: #ffffff;

     background: #2a4173;

     padding-left: 13px;
}


.fauna-footer .foot_links a:hover::before {
     color: #ffffff;

     background: #2a4173;

     transform: translateX(2px);
}


/* =========================================================
   COPYRIGHT
========================================================= */

.fauna-footer-bottom {
     width: 100%;

     min-height: 65px;

     padding: 15px 30px;

     display: flex;

     align-items: center;
     justify-content: center;

     background: #2d4375;

     border-top:
          1px solid rgba(255, 255, 255, .15);
}


.footer-copyright {
     color: rgba(255, 255, 255, .85);

     font-size: 13px;

     text-align: center;
}


.footer-copyright strong {
     color: #ffffff;
}


.footer-copyright span {
     color: rgba(255, 255, 255, .60);
}


/* =========================================================
   FIXED TOP BUTTON
========================================================= */

.footer-top-button {
     position: fixed;

     right: 25px;
     bottom: 25px;

     z-index: 99999;

     width: 54px;
     height: 54px;

     display: flex;
     align-items: center;
     justify-content: center;

     padding: 0;

     border: 2px solid rgba(255, 255, 255, .35);
     border-radius: 50%;

     background: #2a4173;
     color: #ffffff;

     cursor: pointer;

     opacity: 0;
     visibility: hidden;
     pointer-events: none;

     transform: translateY(15px);

     box-shadow:
          0 8px 25px rgba(0, 0, 0, .30);

     transition:
          opacity .3s ease,
          visibility .3s ease,
          transform .3s ease,
          background .3s ease,
          box-shadow .3s ease;
}

.footer-top-button.show {
     opacity: 1;
     visibility: visible;
     pointer-events: auto;
     transform: translateY(0);
}

.footer-top-button i {
     margin: 0;

     font-size: 22px;

     line-height: 1;
}


.footer-top-button span {
     display: none;
}


.footer-top-button:hover {
     color: #ffffff;
     background: #2d4375;

     transform: translateY(-5px);

     box-shadow:
          0 12px 30px rgba(0, 0, 0, .35);
}

.footer-top-button:hover i {
     color: #ffffff;
}

/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1100px) {

     .fauna-footer-main {
          grid-template-columns: 240px 1fr;

          gap: 25px;

          padding: 45px 25px;
     }


     .foot_links1,
     .foot_links2,
     .foot_links3,
     .foot_links4 {
          padding: 0 15px;
     }


     .foot_links1 {
          padding-left: 0;
     }


     .foot_links4 {
          padding-right: 0;
     }


     .fauna-footer .foot_links a {
          font-size: 13px;
     }

}


/* =========================================================
   TABLET / MOBILE
========================================================= */

@media (max-width: 850px) {

     .fauna-footer-main {
          grid-template-columns: 1fr;

          gap: 35px;

          padding: 45px 25px;
     }


     .fauna-footer-brand {
          padding-right: 0;

          padding-bottom: 30px;

          border-right: 0;

          border-bottom:
               1px solid rgba(255, 255, 255, .20);
     }


     .foot_links {
          grid-template-columns: repeat(2, 1fr);

          row-gap: 30px;
     }


     .foot_links3 {
          border-left: 0;
     }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

     .fauna-footer {
          margin-top: 40px;
     }


     .fauna-footer-main {
          padding: 35px 18px;
     }


     .footer-title h2 {
          font-size: 20px;
     }


     .foot_links {
          grid-template-columns: 1fr;

          gap: 0;
     }


     .foot_links1,
     .foot_links2,
     .foot_links3,
     .foot_links4 {

          padding: 18px 5px;

          border-left: 0;

          border-bottom:
               1px solid rgba(255, 255, 255, .15);
     }


     .foot_links1 {
          padding-top: 0;
     }


     .foot_links4 {
          border-bottom: 0;
     }


     .fauna-footer h4 {
          font-size: 16px;
     }


     .fauna-footer .foot_links a {
          min-height: 42px;

          font-size: 14px;
     }


     .fauna-footer-bottom {
          min-height: 65px;

          padding: 15px 70px 15px 15px;
     }


     .footer-copyright {
          font-size: 12px;

          line-height: 1.7;
     }


     .footer-top-button {
          right: 15px;
          bottom: 15px;

          width: 48px;
          height: 48px;
     }


     .footer-top-button i {
          font-size: 20px;
     }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 400px) {

     .fauna-footer-main {
          padding: 30px 12px;
     }


     .footer-eng {
          font-size: 11px;
     }


     .footer-eng span {
          font-size: 13px;
     }


     .footer-title h2 {
          font-size: 18px;
     }


     .fauna-footer .foot_links a {
          font-size: 13px;
     }


     .footer-top-button {
          right: 12px;
          bottom: 12px;

          width: 46px;
          height: 46px;
     }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

     .fauna-footer *,
     .fauna-footer *::before,
     .fauna-footer *::after {
          transition: none !important;
          animation: none !important;
     }

}