/* Built by build.py from src/footer.css — for the start page only (inner pages get it inside site.css). */
.site-footer { --star: var(--accent); }
/* ── The DSRG footer — a 385px band of mono capitals, hairlines that draw in ─ */
:root {
  --size-hero-rule: 2.375rem;
  --size-footer-height: 24.0625rem;
  --size-footer-tagline: 13rem;
  --size-footer-tagline-y: 6.375rem;
  --size-footer-nav-x: 23.9375rem;
  --size-footer-col: 7.625rem;
  --size-footer-contact-x: calc(100% - 16.0625rem);
  --size-footer-rule-top: 12.8125rem;
  --size-footer-row-y: 15.3125rem;
  --size-footer-rule-bottom: 20.1875rem;
  --size-footer-legal-y: 21.6875rem;
  --size-footer-address: 10rem;
  --size-footer-address-b: 37.9375rem;
  --size-footer-address-c: 53.0625rem;
  --size-footer-divider-a: 35.9375rem;
  --size-footer-divider-b: 51.0625rem;
  --size-footer-dot: 0.25rem;
}
@media (min-width: 64rem) and (max-width: 79.98rem) {
  :root {
    --size-footer-nav-x: 26.597vw;
    --size-footer-address-b: 42.153vw;
    --size-footer-address-c: 58.958vw;
    --size-footer-divider-a: 39.931vw;
    --size-footer-divider-b: 56.736vw;
  }
}
.site-footer { position: relative; z-index: 50; display: flex; width: 100%; flex-direction: column; gap: 2rem; overflow: hidden; background: var(--background); padding: 3rem 1.25rem 2rem; font-family: "Space Mono", ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.875rem; text-transform: uppercase; line-height: 1.2; letter-spacing: -0.025em; color: var(--foreground); }
@media (min-width: 640px) { .site-footer { gap: 2.5rem; padding: 3rem 2.5rem; font-size: 1rem; } }
@media (min-width: 1024px) { .site-footer { display: block; height: var(--size-footer-height); padding: 0; } }
.site-footer .dock-sentinel { position: absolute; left: 0; right: 0; top: 0; height: 1px; }
.ft-star { pointer-events: none; position: absolute; top: -6rem; right: -6rem; display: block; width: 34rem; height: 34rem; background: color-mix(in oklab, var(--foreground) 4%, transparent); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M0 12C6 12 12 6 12 0C12 6 18 12 24 12C18 12 12 18 12 24C12 18 6 12 0 12Z' fill='%23000'/%3E%3C/svg%3E") center / 100% 100% no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M0 12C6 12 12 6 12 0C12 6 18 12 24 12C18 12 12 18 12 24C12 18 6 12 0 12Z' fill='%23000'/%3E%3C/svg%3E") center / 100% 100% no-repeat; opacity: 0; transform: scale(1.05); }
.ft-logo { display: block; width: max-content; font-size: 1.125rem; font-weight: 700; white-space: nowrap; letter-spacing: -0.02em; clip-path: inset(0 100% 0 0); }
.ft-logo a { transition: color var(--duration-fast) var(--ease-glide); }
.ft-logo a:hover { color: var(--star); }
@media (min-width: 1024px) { .ft-logo { position: absolute; left: 2.5rem; top: 2.5rem; } }
.ft-tagline { margin-top: -1rem; width: var(--size-footer-tagline); font-size: 0.75rem; color: color-mix(in oklab, var(--foreground) 50%, transparent); }
@media (min-width: 1024px) { .ft-tagline { position: absolute; left: 2.5rem; top: var(--size-footer-tagline-y); margin-top: 0; } }
.ft-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 1.5rem; row-gap: 2rem; }
@media (min-width: 640px) { .ft-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 2.5rem; } }
@media (min-width: 1024px) { .ft-grid { display: contents; } }
.ft-cols { display: contents; }
@media (min-width: 1024px) { .ft-cols { position: absolute; left: var(--size-footer-nav-x); top: 2.5rem; display: flex; gap: 3rem; } }
.ft-col { display: flex; flex-direction: column; gap: 0.75rem; }
@media (min-width: 1024px) { .ft-col { min-width: var(--size-footer-col); } }
.ft-col ul, .ft-contact ul { display: flex; flex-direction: column; gap: 0.375rem; color: color-mix(in oklab, var(--foreground) 50%, transparent); }
.ft-sep { display: none; height: 1px; background: var(--fg-10); }
@media (max-width: 639.98px) { .ft-sep { grid-column: span 2; display: block; } }
@media (min-width: 640px) and (max-width: 1023.98px) { .ft-sep { grid-column: span 3; display: block; } }
.ft-contact { display: flex; flex-direction: column; gap: 0.75rem; }
@media (max-width: 639.98px) { .ft-contact { grid-column: span 2; } }
@media (min-width: 1024px) { .ft-contact { position: absolute; left: var(--size-footer-contact-x); top: 2.5rem; } }
.ft-rule { display: block; height: 1px; width: 100%; background: var(--fg-10); transform-origin: left center; transform: scaleX(0); }
@media (min-width: 1024px) { .ft-rule { position: absolute; left: 2.5rem; right: 2.5rem; width: auto; } }
.ft-office { font-size: 0.75rem; color: color-mix(in oklab, var(--foreground) 50%, transparent); }
.ft-office .rise-inner { display: flex; align-items: center; gap: 0.375rem; }
@media (min-width: 1024px) { .ft-office { position: absolute; left: 2.5rem; top: var(--size-footer-row-y); } }
.ft-dot { width: var(--size-footer-dot); height: var(--size-footer-dot); flex-shrink: 0; border-radius: 9999px; background: var(--star); }
.ft-row { display: grid; gap: 1.5rem; }
@media (min-width: 640px) { .ft-row { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 2.5rem; } }
@media (min-width: 1024px) { .ft-row { display: contents; } }
.ft-address { font-style: normal; }
@media (min-width: 1024px) { .ft-address { position: absolute; left: var(--size-footer-nav-x); top: var(--size-footer-row-y); width: var(--size-footer-address); } }
.ft-divider { display: none; }
@media (min-width: 1024px) { .ft-divider { position: absolute; top: var(--size-footer-row-y); display: block; height: var(--size-hero-rule); width: 1px; background: color-mix(in oklab, var(--foreground) 35%, transparent); transform-origin: center top; transform: scaleY(0); } }
@media (min-width: 1024px) {
  .ft-link-b { position: absolute; left: var(--size-footer-address-b); top: var(--size-footer-row-y); white-space: nowrap; }
  .ft-link-c { position: absolute; left: var(--size-footer-address-c); top: var(--size-footer-row-y); white-space: nowrap; }
}
.ft-legal { display: flex; flex-direction: column; gap: 0.75rem; }
@media (min-width: 640px) { .ft-legal { flex-direction: row; align-items: baseline; justify-content: space-between; } }
@media (min-width: 1024px) { .ft-legal { display: contents; } }
.ft-copy { white-space: nowrap; font-size: 0.75rem; color: color-mix(in oklab, var(--foreground) 50%, transparent); }
@media (max-width: 639.98px) { .ft-copy { order: 99; margin-top: 0.75rem; border-top: 1px solid var(--fg-10); padding-top: 1.5rem; } }
@media (min-width: 1024px) { .ft-copy { position: absolute; left: 2.5rem; top: var(--size-footer-legal-y); } }
.ft-social, .ft-top { display: block; white-space: nowrap; font-size: 0.75rem; }
@media (min-width: 1024px) {
  .ft-social { position: absolute; left: var(--size-footer-nav-x); top: var(--size-footer-legal-y); }
  .ft-top { position: absolute; left: var(--size-footer-contact-x); top: var(--size-footer-legal-y); }
}
.ft-social .sep { white-space: pre; color: color-mix(in oklab, var(--foreground) 50%, transparent); }
.rise-line { display: block; clip-path: inset(0 0 -4px 0); }
.rise-line > .rise-inner { display: block; transform: translateY(150%); }
.ul-link { color: inherit; transition: color var(--duration-fast) var(--ease-glide); overflow-wrap: anywhere; }
.ul-link:hover { color: var(--foreground); }
@media (min-width: 1024px) { .ft-col .ul-link, .ft-contact .ul-link { white-space: nowrap; } }
.ft-copy .ul-link, .ft-social .ul-link, .ft-top .ul-link { color: color-mix(in oklab, var(--foreground) 50%, transparent); }
.ft-copy .ul-link:hover, .ft-social .ul-link:hover, .ft-top .ul-link:hover { color: var(--foreground); }
.ul-box { position: relative; display: inline-block; }
.ul-clip { position: relative; display: block; clip-path: inset(0); }
.ul-a { display: block; }
.ul-b { position: absolute; inset: 0; display: block; transform: translateY(100%); }
.ul-rule { position: absolute; left: 0; right: 0; bottom: -1px; display: block; height: 1px; background: currentColor; transform-origin: left center; transform: scaleX(0); opacity: 0; }

/* 2026-09-27 (Jim): the footer in the same beige as the page (the start page's sand), dark ink */
.site-footer { --background: #f4f0eb; --foreground: #2c2e2a; --fg-10: color-mix(in oklab, #2c2e2a 14%, transparent); background: var(--background); color: var(--foreground); }

.site-footer.in .ft-star { opacity: 1; transform: none; transition: opacity 1.6s var(--ease-glide), transform 1.6s var(--ease-glide); }
.site-footer.in .ft-logo { clip-path: inset(0 0 0 0); transition: clip-path 1.2s var(--ease-glide) 180ms; }
.site-footer.in .rise-line > .rise-inner { transform: none; transition: transform 1s var(--ease-glide); transition-delay: var(--d, 0ms); }
.site-footer.in .ft-rule { transform: scaleX(1); transition: transform 1.2s var(--ease-glide); transition-delay: var(--d, 0ms); }
.site-footer.in .ft-divider { transform: scaleY(1); transition: transform 1.2s var(--ease-glide); transition-delay: var(--d, 0ms); }
.ul-link:hover .ul-a { transform: translateY(-100%); }
.ul-link:hover .ul-b { transform: none; }
.ul-a, .ul-b { transition: transform 450ms var(--ease-glide); }
@media (prefers-reduced-motion: reduce) {
  .site-footer .ft-star { opacity: 1; transform: none; }
  .site-footer .ft-logo { clip-path: none; }
  .site-footer .rise-line > .rise-inner { transform: none; }
  .site-footer .ft-rule { transform: scaleX(1); }
  .site-footer .ft-divider { transform: scaleY(1); }
}
