/* =========================================================
   SMALL TOWN MAHJ — EDITORIAL FOOTER
   Desktop uses a compact two-column close: invitation/navigation at left,
   official crest at right, then one quiet legal/tagline row. Mobile retains
   the approved stacked treatment below 760px.
   ========================================================= */

.site-footer {
  position: relative;
  overflow: hidden;
  background: #062e68 !important;
  color: #fffaf1 !important;
}

.site-footer .site-footer__top {
  position: relative !important;
  display: grid !important;
  width: min(1320px, calc(100% - clamp(56px, 8vw, 112px))) !important;
  grid-template-columns: minmax(0, 1fr) clamp(190px, 18vw, 250px) !important;
  align-items: center !important;
  gap: clamp(3rem, 7vw, 8rem) !important;
  margin: 0 auto !important;
  padding: clamp(2.2rem, 3.6vw, 3.1rem) 0 clamp(2rem, 3.2vw, 2.8rem) !important;
}

/* DOM order places the logo first, so assign explicit grid columns on desktop:
   content is always left and the official crest is always right. */
.site-footer__brand {
  position: static !important;
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  margin: 0 !important;
}

.site-footer__brand img {
  display: block !important;
  width: min(100%, 225px) !important;
  height: auto !important;
  margin: 0 auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  object-fit: contain !important;
}

.site-footer__brand p {
  display: none !important;
}

.site-footer__content {
  grid-column: 1 !important;
  grid-row: 1 !important;
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  text-align: left !important;
}

.site-footer__invitation {
  min-width: 0 !important;
  margin: 0 !important;
}

.site-footer__invitation .eyebrow {
  margin: 0 0 .45rem !important;
  color: rgba(255,250,241,.7) !important;
  font-size: .62rem !important;
  letter-spacing: .16em !important;
}

.site-footer__invitation h2 {
  max-width: 12em !important;
  margin: 0 0 .7rem !important;
  color: #fffaf1 !important;
  font-size: clamp(2rem, 2.8vw, 2.85rem) !important;
  line-height: .98 !important;
}

.site-footer__invitation .text-link {
  color: #fffaf1 !important;
  border-bottom-color: #f3a078 !important;
}

.site-footer__nav {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-start !important;
  gap: .55rem clamp(.9rem, 1.5vw, 1.35rem) !important;
  max-width: 640px !important;
  margin: 1.25rem 0 0 !important;
  text-align: left !important;
}

.site-footer__nav a {
  color: #f3a078 !important;
  font-size: .76rem !important;
  font-weight: 800 !important;
  letter-spacing: .04em !important;
  text-decoration: none !important;
  transition: color 160ms ease !important;
}

.site-footer__nav a:hover,
.site-footer__nav a:focus-visible {
  color: #ffc09f !important;
}

.site-footer .site-footer__bottom {
  display: grid !important;
  width: min(1320px, calc(100% - clamp(56px, 8vw, 112px))) !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 1.5rem !important;
  margin: 0 auto !important;
  padding: 1rem 0 1.15rem !important;
  border-top: 1px solid rgba(255,250,241,.18) !important;
  color: rgba(255,250,241,.7) !important;
  font-size: .72rem !important;
  line-height: 1.25 !important;
  letter-spacing: .01em !important;
}

.site-footer__bottom::after {
  display: none !important;
  content: none !important;
}

.site-footer__legal {
  grid-column: 1 !important;
  display: flex !important;
  align-items: center !important;
  gap: .75rem !important;
  min-width: 0 !important;
  white-space: normal !important;
  font-size: .76rem !important;
  line-height: 1.25 !important;
}

.site-footer__credit {
  display: inline-flex !important;
  align-items: center !important;
  gap: .24rem !important;
}

.site-footer__credit::before {
  display: none !important;
  content: none !important;
}

.site-footer__credit a {
  color: #fffaf1 !important;
  text-decoration: none !important;
  border-bottom: 1px solid rgba(243,160,120,.65) !important;
  padding-bottom: .06rem !important;
}

.site-footer__credit a:hover {
  border-bottom-color: #ffc09f !important;
}

.site-footer__bottom > span:last-child {
  grid-column: 2 !important;
  margin: 0 !important;
  color: rgba(255,250,241,.82) !important;
  text-align: right !important;
  white-space: nowrap !important;
}

/* Compact desktop keeps the same content-left/logo-right composition without
   letting either side dominate 1024-class viewports. */
@media (min-width: 761px) and (max-width: 1100px) {
  .site-footer .site-footer__top {
    width: calc(100% - 56px) !important;
    grid-template-columns: minmax(0, 1fr) 180px !important;
    gap: 2.5rem !important;
    padding: 2rem 0 1.85rem !important;
  }

  .site-footer__brand {
    grid-column: 2 !important;
    grid-row: 1 !important;
  }

  .site-footer__content {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }

  .site-footer__brand img {
    width: 175px !important;
  }

  .site-footer__invitation h2 {
    font-size: clamp(1.8rem, 3.2vw, 2.35rem) !important;
  }

  .site-footer__nav {
    gap: .5rem .9rem !important;
    margin-top: 1rem !important;
  }

  .site-footer__nav a {
    font-size: .7rem !important;
  }

  .site-footer .site-footer__bottom {
    width: calc(100% - 56px) !important;
  }
}

@media (max-width: 760px) {
  .site-footer .site-footer__top {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    padding-top: 1.75rem !important;
    padding-right: 146px !important;
    padding-bottom: 3rem !important;
    padding-left: 24px !important;
  }

  .site-footer__brand {
    position: absolute !important;
    right: -4px !important;
    bottom: 1rem !important;
    display: block !important;
    width: auto !important;
  }

  .site-footer__brand img {
    width: 132px !important;
  }

  .site-footer__content {
    width: 100% !important;
  }

  .site-footer__invitation .eyebrow {
    margin-bottom: .35rem !important;
    font-size: .57rem !important;
  }

  .site-footer__invitation h2 {
    max-width: 9em !important;
    margin-bottom: .65rem !important;
    font-size: clamp(1.45rem, 6vw, 1.9rem) !important;
    line-height: 1.03 !important;
  }

  .site-footer__invitation .text-link {
    font-size: .76rem !important;
  }

  .site-footer__nav {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, max-content)) !important;
    justify-content: start !important;
    gap: .5rem .9rem !important;
    max-width: calc(100% - 10px) !important;
    margin-top: 1.25rem !important;
    text-align: left !important;
  }

  .site-footer__nav a {
    color: rgba(255,250,241,.82) !important;
    font-size: .72rem !important;
  }

  .site-footer .site-footer__bottom {
    width: calc(100% - 40px) !important;
    margin: 0 auto !important;
    grid-template-columns: minmax(0, 1fr) max-content !important;
    gap: .45rem !important;
    padding: .8rem 0 .95rem !important;
    font-size: clamp(.46rem, 1.95vw, .58rem) !important;
    letter-spacing: 0 !important;
  }

  .site-footer__legal {
    grid-column: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: .28rem !important;
    white-space: normal !important;
    text-align: left !important;
    font-size: .68rem !important;
    line-height: 1.25 !important;
  }

  .site-footer__credit {
    display: block !important;
    width: 100% !important;
    text-align: left !important;
  }

  .site-footer__bottom > span:last-child {
    grid-column: 2 !important;
  }
}

@media (max-width: 430px) {
  .site-footer .site-footer__top {
    padding-right: 122px !important;
    padding-bottom: 2.7rem !important;
    padding-left: 20px !important;
  }

  .site-footer__brand img {
    width: 114px !important;
  }

  .site-footer__nav {
    gap: .45rem .75rem !important;
  }

  .site-footer .site-footer__bottom {
    width: calc(100% - 32px) !important;
    gap: .35rem !important;
    font-size: .45rem !important;
  }

  .site-footer__legal {
    font-size: .62rem !important;
  }
}