/* Shared site footer component.
   Included on every page via <link rel="stylesheet" href="./footer.css">.
   Markup is injected by footer.js into <footer id="site-footer"></footer>.
   All sizes are in rem so they scale fluidly with the root font-size. */

#site-footer {
  display: flex;
  flex-direction: column;
}

.footer-bio {
  padding: 4.4444rem 2.2222rem 2.2222rem;
}

.footer-bio-inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.3333rem;
}

.footer-heading {
  max-width: calc(50% - 1.1111rem);
  font-size: 3.2222rem;
  font-weight: 400;
  line-height: 1.15;
  opacity: 0.85;
}

.footer-heading-line {
  white-space: nowrap;
}

.footer-heading-icon {
  display: inline-block;
  height: 0.8em;
  width: auto;
  vertical-align: middle;
  margin: 0 0.05em;
  transform: translateY(-0.1em);
}

.footer-heading-link {
  display: inline-block;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}
@media (hover: hover) and (min-width: 901px) {
  .footer-heading-link:hover { text-decoration: underline; }
}

.footer-bar {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  column-gap: 2.2222rem;
  align-items: center;
  padding: 1.3333rem 2.2222rem;
  font-size: 1.3333rem;
  font-weight: 400;
  letter-spacing: 0.0278rem;
}

.footer-link {
  color: inherit;
  text-decoration: none;
  opacity: 1;
  transition: opacity .2s;
}
@media (hover: hover) and (min-width: 901px) {
  .footer-link:hover { opacity: 0.6; }
}

.footer-copyright { opacity: 1; text-align: right; }

.copyright-mark {
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  margin-right: 0.2em;
  background-color: currentColor;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 367.467 367.467'%3E%3Cpath d='M183.73,0.018C82.427,0.018,0,82.404,0,183.733c0,101.289,82.427,183.716,183.73,183.716c101.315,0,183.737-82.427,183.737-183.716C367.467,82.404,285.045,0.018,183.73,0.018z M183.73,326.518c-78.743,0-142.798-64.052-142.798-142.784c0-78.766,64.055-142.817,142.798-142.817c78.752,0,142.807,64.052,142.807,142.817C326.536,262.466,262.481,326.518,183.73,326.518z'/%3E%3Cpath d='M244.036,217.014c-11.737,20.141-33.562,32.635-56.956,32.635c-36.329,0-65.921-29.585-65.921-65.915c0-36.36,29.592-65.955,65.921-65.955c23.395,0,45.219,12.54,56.956,32.641l1.517,2.627h44.28l-2.658-7.129c-7.705-20.413-21.225-37.769-39.122-50.157c-17.942-12.42-39.017-19.009-60.973-19.009c-58.981,0-106.946,48.006-106.946,106.982c0,58.98,47.965,106.941,106.946,106.941c21.956,0,43.03-6.567,60.973-19.006c17.897-12.391,31.417-29.741,39.122-50.154l2.658-7.133h-44.28L244.036,217.014z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 367.467 367.467'%3E%3Cpath d='M183.73,0.018C82.427,0.018,0,82.404,0,183.733c0,101.289,82.427,183.716,183.73,183.716c101.315,0,183.737-82.427,183.737-183.716C367.467,82.404,285.045,0.018,183.73,0.018z M183.73,326.518c-78.743,0-142.798-64.052-142.798-142.784c0-78.766,64.055-142.817,142.798-142.817c78.752,0,142.807,64.052,142.807,142.817C326.536,262.466,262.481,326.518,183.73,326.518z'/%3E%3Cpath d='M244.036,217.014c-11.737,20.141-33.562,32.635-56.956,32.635c-36.329,0-65.921-29.585-65.921-65.915c0-36.36,29.592-65.955,65.921-65.955c23.395,0,45.219,12.54,56.956,32.641l1.517,2.627h44.28l-2.658-7.129c-7.705-20.413-21.225-37.769-39.122-50.157c-17.942-12.42-39.017-19.009-60.973-19.009c-58.981,0-106.946,48.006-106.946,106.982c0,58.98,47.965,106.941,106.946,106.941c21.956,0,43.03-6.567,60.973-19.006c17.897-12.391,31.417-29.741,39.122-50.154l2.658-7.133h-44.28L244.036,217.014z'/%3E%3C/svg%3E");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-position: center;
  mask-position: center;
}

@media (max-width: 1400px) {
  .footer-bar { grid-template-columns: repeat(3, 1fr); row-gap: 0.6667rem; }
}

@media (max-width: 900px) {
  .footer-bio { padding: 3.3333rem 1.3333rem 2.2222rem 1.3333rem; }
  .footer-heading { font-size: 2.2222rem; max-width: 100%; }
  .footer-bar { padding: 1.3333rem; grid-template-columns: repeat(2, 1fr); row-gap: 0.8889rem; }
  .footer-copyright { text-align: left; }
}

@media (max-width: 600px) {
  .footer-heading { font-size: 1.7778rem; }
  .footer-bar { grid-template-columns: 1fr; row-gap: 0.8889rem; }
}
