:root {
  --footer-header-color: #0a0d0b;
  --footer-primaryText: #ffffff;
  --footer-textcolor: #000000;
  --footer-primary: #2a73b7;
  --footer-ternary: #54e6ff;
  --footer-secondary: #7ac3ff;
  --footer-hover: #0c5599;
  --footer-border: #e4e7ec;

  --footer-button-primary: #03652b;
  --footer-button-primary-text: #ffffff;
  --footer-button-primary-font: "Inter", sans-serif;
  --footer-button-primary-hover: #cbfc58;

  --footer-button-secondary: #ffffff;
  --footer-button-secondary-text: #0a0d0b;
  --footer-button-secondary-font: "Inter", sans-serif;
  --footer-button-secondary-hover: #cbfc58;
}

/* footer */
footer {
  padding-top: 73px;
  background: #f5f6f9;
}
footer .footer-top-section h2 {
  margin-bottom: 30px;
}
footer .footer-top-section {
  margin-bottom: 100px;
}

footer .footer-bottom-section {
  display: grid;
  grid-template-columns: 3fr 2fr 2fr 3fr;
  grid-gap: 30px 150px;
  margin-bottom: 65px;
}
footer .footer-bottom-section .box .heading {
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  text-align: left;
  color: #4e545f;
  margin-bottom: 16px;
}
footer .footer-bottom-section .box li {
  margin-bottom: 8px;
}
footer .footer-bottom-section .box li:last-child {
  margin-bottom: 0px;
}
footer .footer-bottom-section .box li a {
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  color: var(--footer-textcolor);
  transition: 0.3s;
}
footer .footer-bottom-section .box li a:hover {
  color: var(--footer-primary);
  padding-left: 5px;
}
footer .copyright-footer {
  padding: 30px 0px 40px 0px;
  border-top: 1px solid var(--footer-border);
}
footer .copyright-footer {
  font-size: 16px;
  font-weight: 400;
  line-height: 20px;
  color: #4e545f;
}

/* button */
footer .button {
  font-size: 16px;
  font-weight: 400;
  line-height: 25.6px;
  letter-spacing: -0.5px;
  padding: 8px 8px 8px 30px;
  background: var(--footer-button-primary);
  display: flex;
  align-items: center;
  color: var(--footer-button-primary-text);
  border-radius: 44px;
  border: 1px solid var(--footer-button-primary);
  font-family: var(--footer-button-secondary-font);
  transition: 0.3s;
}
footer .button .icon {
  margin-left: 16px;
  background: var(--footer-button-primary-text);
  padding: 15px 12px;
  border-radius: 100px;
  display: flex;
  transition: 0.3s;
}
footer .button .icon svg {
  width: 18px;
  height: 13px;
  transition: 0.3s;
}
footer .button .icon svg path {
  stroke: var(--footer-button-primary);
  transition: 0.3s;
}
footer .button:hover {
  background: var(--footer-button-primary-hover);
  color: var(--footer-button-primary);
  border: 1px solid var(--footer-button-primary-hover);
}
footer .button .icon svg {
  width: 18px;
  height: 13px;
}
footer .button:hover .icon svg path {
  stroke: var(--footer-button-primary);
}

footer .button-2 .icon svg path {
  stroke: #0a0d0b;
}
footer .button-2:hover .icon {
  background: var(--footer-button-secondary);
}
footer .button-2 {
  border: 1px solid var(--footer-button-secondary);
  background: var(--footer-button-secondary);
  color: var(--footer-button-secondary-text);
  font-family: var(--footer-button-secondary-font);
}
footer .button-2 .icon {
  background: linear-gradient(
    180deg,
    rgba(242, 242, 242, 0.2) 0%,
    rgba(215, 215, 215, 0.2) 100%
  );
  border: 1px solid #f2f2f2;
}