.site-footer { margin-top: auto; color: #eef4f5; background: var(--navy); }
.footer-main {
  width: min(var(--content), calc(100% - var(--gutter) * 2));
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr;
  gap: 3rem;
  margin-inline: auto;
  padding-block: 3.5rem;
}
.footer-brand { color: var(--white); }
.footer-brand .brand-copy strong { color: var(--white); }
.footer-brand .brand-mark { border-color: var(--yellow); color: var(--yellow); }
.footer-main p { max-width: 24rem; margin: 1rem 0 0; color: #c4d2da; font-size: .9rem; }
.footer-title { margin-bottom: .9rem; color: var(--yellow); font-size: .72rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.footer-links { display: grid; gap: .5rem; }
.footer-links a { width: fit-content; color: #c4d2da; font-size: .88rem; text-decoration: none; }
.footer-links a:hover { color: var(--white); text-decoration: underline; text-underline-offset: .25em; }
.footer-bottom {
  width: min(var(--content), calc(100% - var(--gutter) * 2));
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  margin-inline: auto;
  padding-block: 1rem;
  border-top: 1px solid rgb(255 255 255 / 17%);
  color: #c4d2da;
  font-size: .76rem;
}
.footer-bottom p { margin: 0; color: inherit; }
@media (max-width: 700px) {
  .footer-main { grid-template-columns: 1fr 1fr; gap: 2rem; padding-block: 2.75rem; }
  .footer-intro { grid-column: 1 / -1; }
  .footer-bottom { flex-direction: column; }
}

.footer-main { grid-template-columns:1.35fr .8fr .85fr 1.1fr; gap:2rem; }
.footer-contact-row { display:grid; grid-template-columns:70px minmax(0,1fr); gap:.6rem; margin-top:.75rem; font-size:.83rem; color:#c4d2da; }
.footer-contact-row>span { color:#eef4f5; font-weight:600; }
.footer-contact-row a { color:#c4d2da; text-decoration:none; overflow-wrap:anywhere; }
.footer-contact-row a:hover { color:white; text-decoration:underline; }
.footer-main .footer-contact-sample { font-size:.72rem; color:#e6c96b; margin:0 0 .8rem; }
@media(max-width:1000px) { .footer-main { grid-template-columns:1fr 1fr; } .footer-intro { grid-column:auto; } }
@media(max-width:500px) { .footer-main { grid-template-columns:1fr; gap:1.6rem; } }