/* The site footer's Follow icons (Pete, 10 Oct 2026), next to footer.css (kept identical to legal-v32's).
   The four official brand shapes (Simple Icons, CC0) in mint #7ED6C0 on the dark green footer: round, outlined
   buttons in the footer's own rhythm. Also used for the icon row in the "Coming soon" popup (public/coming-soon.js). */
.af-follow-h{margin:20px 0 10px}
.af-social,.hero-follow-icons{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0}
.af-social a,.hero-follow-icons a{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;
  border-radius:999px;border:1px solid rgba(126,214,192,.38);background:rgba(126,214,192,.08);color:#7ed6c0;
  text-decoration:none;transition:background .15s,border-color .15s,transform .15s}
.af-social a:hover,.hero-follow-icons a:hover{background:rgba(126,214,192,.18);border-color:#7ed6c0;color:#7ed6c0;transform:translateY(-1px)}
.af-social a:focus-visible,.hero-follow-icons a:focus-visible{outline:2px solid #7ed6c0;outline-offset:3px}
.af-social svg,.hero-follow-icons svg{width:18px;height:18px;fill:currentColor;display:block}
@media (max-width:720px),(pointer:coarse){
  .af-social a,.hero-follow-icons a{width:44px;height:44px}
  .af-social svg,.hero-follow-icons svg{width:20px;height:20px}
}
@media (prefers-reduced-motion:reduce){
  .af-social a,.hero-follow-icons a{transition:none}
  .af-social a:hover,.hero-follow-icons a:hover{transform:none}
}