/* Site footer (app/SiteFooter.tsx): white, a faint grid, a light glass bar. Render it outside the page column
   (full width; 100vw would add the scrollbar width and scroll sideways). Self-contained:
   no page tokens, so the landing page (Tailwind) and the site pages (site.css) render it the same. */
@property --beam { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
@keyframes beam { to { --beam: 360deg; } }
.foot { position: relative; width: 100%; margin: 72px 0 0; padding: 64px 16px 24px; overflow: hidden; isolation: isolate; font-family: Inter, ui-sans-serif, system-ui, sans-serif;
  background: linear-gradient(rgba(17, 17, 17, 0.045) 1px, transparent 1px) 0 0 / 72px 72px, linear-gradient(90deg, rgba(17, 17, 17, 0.045) 1px, transparent 1px) 0 0 / 72px 72px, #fff;
  -webkit-mask: linear-gradient(transparent, #000 80px); mask: linear-gradient(transparent, #000 80px); }
.foot-glass { position: relative; z-index: 1; max-width: 1120px; margin: -56px auto 0; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; padding: 12px 16px;
  border: 1px solid rgba(255, 255, 255, 0.8); border-radius: 18px; background: rgba(255, 255, 255, 0.62);
  -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.9) inset, 0 6px 24px rgba(17, 17, 17, 0.06); }
.foot-brand { display: inline-flex; align-items: center; gap: 8px; font-size: 17px; letter-spacing: -0.02em; color: #0a0a0a; text-decoration: none; }
.foot-brand img { display: block; width: 26px; height: auto; }
.foot-d { color: #8a8a91; }
.foot-fine { font-size: 12px; color: #6b6b72; }
.foot-cta { display: inline-flex; align-items: center; height: 36px; padding: 0 16px; border-radius: 999px; font-size: 14px; font-weight: 500; color: #0a0a0a; text-decoration: none;
  border: 1px solid transparent; background: linear-gradient(180deg, #fff, #eef0f3) padding-box, conic-gradient(from var(--beam), #c9ccd2, #f7f8fa 8%, #8d929b 14%, #c9ccd2 22%, #c9ccd2 50%, #fff 58%, #7d828b 64%, #c9ccd2 72%) border-box;
  box-shadow: inset 0 1px 0 #fff, 0 1px 2px rgba(0, 0, 0, 0.08); animation: beam 3.5s linear infinite; }
.foot-cta:focus-visible, .foot-brand:focus-visible { outline: 2px solid #2e74e6; outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { .foot-cta { animation: none; } }
@media (max-width: 640px) { .foot-glass { margin-top: -24px; justify-content: center; } }