/* ════════════════════════════════════════════════════════════
   SHARED SITE FOOTER (light theme) — matches main index.html footer
   Used across inner-folder pages. Self-contained: no CSS-variable deps.
   ════════════════════════════════════════════════════════════ */
.site-footer {
  position: relative; box-sizing: border-box;
  background:
    linear-gradient(120deg, rgba(127,185,66,0.13) 0%, rgba(24,176,201,0.10) 38%, rgba(30,115,200,0.10) 68%, rgba(107,79,176,0.16) 100%),
    #fcfdfe;
  padding: clamp(44px,6vh,76px) clamp(28px,5vw,80px) clamp(36px,5vh,60px);
}
/* brand-gradient hairline along the top edge */
.site-footer::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(105deg, #7FB942 0%, #18B0C9 35%, #1E73C8 66%, #6B4FB0 100%);
}
.site-footer .foot-inner {
  max-width: 1320px; margin: 0 auto; display: grid;
  grid-template-columns: 1.6fr 1fr 1.25fr 1.15fr; gap: clamp(28px,3.4vw,64px);
}
/* brand / about column */
.site-footer .foot-logos { display: flex; align-items: center; gap: 16px; margin-bottom: clamp(18px,2.6vh,28px); }
.site-footer .foot-logos img.f-ved { height: 26px; width: auto; display: block; }
.site-footer .foot-logos img.f-hzl { height: 38px; width: auto; display: block; }
.site-footer .foot-logos .f-div { width: 1px; height: 30px; background: rgba(12,35,64,0.18); flex: 0 0 auto; }
.site-footer .foot-tagline {
  margin: 0 0 clamp(12px,1.6vh,16px); font-family: 'proxima-nova','Mulish',system-ui,sans-serif; font-weight: 700; text-transform: uppercase;
  font-size: clamp(14px,1.05vw,17px); letter-spacing: 0.08em; color: #4e7d23;
}
.site-footer .foot-about {
  margin: 0 0 clamp(20px,2.8vh,30px); font-family: 'proxima-nova','Mulish',system-ui,sans-serif; font-size: clamp(13.5px,0.98vw,15px);
  line-height: 1.7; color: rgba(12,35,64,0.66); max-width: 40ch;
}
.site-footer .foot-pill {
  display: inline-flex; align-items: center; gap: 9px; padding: 9px 18px; border-radius: 999px;
  border: 1.5px solid rgba(127,185,66,0.55); color: #4e7d23;
  font-family: 'proxima-nova','Mulish',system-ui,sans-serif; font-weight: 700; text-transform: uppercase; font-size: 12px; letter-spacing: 0.1em;
}
.site-footer .foot-pill::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: #7FB942; flex: 0 0 auto; }
/* link columns */
.site-footer .foot-h {
  margin: 0 0 clamp(18px,2.6vh,28px); font-family: 'proxima-nova','Mulish',system-ui,sans-serif; font-weight: 700; text-transform: uppercase;
  font-size: clamp(12px,0.86vw,13px); letter-spacing: 0.14em; color: rgba(12,35,64,0.5);
}
.site-footer .foot-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: clamp(12px,1.7vh,18px); }
.site-footer .foot-link {
  display: inline-flex; align-items: center; gap: 10px; text-decoration: none;
  font-family: 'proxima-nova','Mulish',system-ui,sans-serif; font-size: clamp(13.5px,0.98vw,15.5px); color: rgba(12,35,64,0.74);
  transition: color .2s ease, transform .25s cubic-bezier(0.16,1,0.3,1);
}
.site-footer .foot-link:hover { color: #1559a6; transform: translateX(3px); }
.site-footer .foot-link:focus-visible { outline: 2px solid #1E73C8; outline-offset: 3px; border-radius: 3px; }
.site-footer .foot-link svg { flex: 0 0 auto; width: 17px; height: 17px; color: #5a9a2e; }
.site-footer .foot-link .f-ic-line { stroke: #5a9a2e; }
/* connect column */
.site-footer .foot-social { display: flex; gap: 12px; margin-top: clamp(22px,3vh,30px); }
.site-footer .foot-soc {
  width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center;
  border: 1.5px solid rgba(12,35,64,0.18); color: rgba(12,35,64,0.7);
  transition: color .2s ease, border-color .2s ease, background .2s ease, transform .25s ease;
}
.site-footer .foot-soc svg { width: 17px; height: 17px; }
.site-footer .foot-soc:hover { color: #fff; background: linear-gradient(105deg, #7FB942 0%, #18B0C9 35%, #1E73C8 66%, #6B4FB0 100%); border-color: transparent; transform: translateY(-3px); }
.site-footer .foot-soc:focus-visible { outline: 2px solid #1E73C8; outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) {
  .site-footer .foot-link, .site-footer .foot-soc { transition: color .2s ease, border-color .2s ease; }
  .site-footer .foot-link:hover, .site-footer .foot-soc:hover { transform: none; }
}
@media (max-width: 920px) {
  .site-footer .foot-inner { grid-template-columns: 1fr 1fr; gap: clamp(28px,6vw,44px); }
  .site-footer .foot-brand { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
  .site-footer .foot-inner { grid-template-columns: 1fr; }
}