/* Site footer: quiet link grid on a soft grey, closed by the logo set large as type.
   Shares the ink/grey tokens of site-nav.css; the logo's caret blue is the only colour. */

:root {
    --foot-bg: #f5f5f7;
    --foot-ink: #1d1d1f;
    --foot-body: #424245;
    --foot-muted: #6e6e73;
    --foot-hair: rgba(29, 29, 31, 0.1);
    --foot-caret: #66b7e4;   /* sampled from spock-logo-B-v.1.0.png */
    --foot-ease: cubic-bezier(0.22, 1, 0.36, 1);
    --foot-gutter: 24px;
}

.site-foot {
    position: relative; overflow: hidden;
    background: var(--foot-bg);
    box-shadow: inset 0 1px 0 var(--foot-hair);
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", "Segoe UI", Lato, sans-serif;
    -webkit-font-smoothing: antialiased;
    color: var(--foot-body);
}
.site-foot p, .site-foot ul, .site-foot h3 { margin: 0; }
.site-foot a { color: inherit; text-decoration: none; }
.site-foot a:focus-visible { outline: 2px solid #0f69ff; outline-offset: 3px; border-radius: 4px; }

/* Brand line + link grid */
.site-foot__main {
    display: grid; grid-template-columns: minmax(240px, 1fr) auto; gap: 64px;
    max-width: 1120px; margin: 0 auto; padding: 72px var(--foot-gutter) 56px;
}
.site-foot__thesis {
    font-size: 21px; font-weight: 600; letter-spacing: -0.021em; line-height: 1.25;
    color: var(--foot-ink);
}
.site-foot__lede {
    max-width: 30ch; margin-top: 10px !important;
    font-size: 14px; line-height: 1.55; color: var(--foot-muted);
}

.site-foot__nav { display: grid; grid-template-columns: repeat(4, auto); gap: 56px; }
.site-foot__heading {
    margin-bottom: 14px !important;
    font-family: inherit; font-size: 12px; font-weight: 600; letter-spacing: 0; line-height: 1.3;
    color: var(--foot-ink);
}
.site-foot__col ul { list-style: none; padding: 0; }
.site-foot__col li + li { margin-top: 9px; }
.site-foot__col a {
    display: inline-block;
    font-size: 13.5px; line-height: 1.45; letter-spacing: -0.003em;
    color: var(--foot-muted);
    transition: color 0.2s ease;
}
.site-foot__col a:hover { color: var(--foot-ink); }
.site-foot__ext {
    display: inline-block; margin-left: 3px;
    font-size: 11px; opacity: 0.7;
    transition: transform 0.3s var(--foot-ease);
}
.site-foot__col a:hover .site-foot__ext { transform: translate(1px, -1px); }

/* Copyright row */
.site-foot__base {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px;
    width: min(1072px, 100% - 2 * var(--foot-gutter)); margin: 0 auto; padding-top: 22px;
    border-top: 1px solid var(--foot-hair);
}
/* Pages that hide the link grid (sign-in flows) start straight at this row */
.site-foot__base:first-child { border-top: 0; padding-top: 40px; }
.site-foot__legal { font-size: 12px; color: var(--foot-muted); }
.site-foot__reach { display: flex; align-items: center; gap: 18px; font-size: 12px; }
.site-foot__reach a { color: var(--foot-body); transition: color 0.2s ease; }
.site-foot__reach a:hover { color: var(--foot-ink); }
.site-foot__social {
    display: inline-flex; align-items: center; justify-content: center;
    width: 30px; height: 30px; margin: -6px -8px -6px 0; border-radius: 50%;
    transition: color 0.2s ease, background-color 0.2s ease !important;
}
.site-foot__social:hover { background: rgba(29, 29, 31, 0.06); }

/* The signature: logo as live type, bleeding off the bottom edge.
   Proportions follow the logo: caret ~0.18em wide, ~0.07em off the k, ascender-to-descender tall. */
.site-foot__mark {
    display: flex; align-items: flex-start;
    max-width: 1120px; height: 0.8em; margin: 8px auto 0; padding: 0 var(--foot-gutter);
    font-family: Lato, "Helvetica Neue", sans-serif; font-weight: 700;
    font-size: clamp(112px, 30vw, 400px); line-height: 1;
    user-select: none; pointer-events: none;
}
.site-foot__word {
    margin-left: -0.045em; letter-spacing: -0.02em;
    background: linear-gradient(180deg, #e0e0e6 0%, #e9e9ee 55%, rgba(245, 245, 247, 0) 92%);
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent; color: transparent;
}
.site-foot__caret {
    flex: none; width: 0.13em; height: 0.93em; margin: 0.155em 0 0 0.06em;
    background: linear-gradient(180deg, var(--foot-caret) 0%, var(--foot-caret) 55%, rgba(102, 183, 228, 0) 92%);
}
/* Blinks like the macOS text caret: hard on/off, ~0.53s each, for as long as it's on screen */
.site-foot.is-seen .site-foot__caret { animation: site-foot-blink 1.06s steps(1, end) infinite; }
@keyframes site-foot-blink { 50% { opacity: 0; } }

@media (max-width: 1100px) {
    .site-foot__nav { gap: 36px; }
}
@media (max-width: 991.98px) {
    .site-foot__main { grid-template-columns: 1fr; gap: 40px; padding-top: 56px; }
    .site-foot__nav { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; }
    .site-foot__lede { max-width: 44ch; }
}
@media (max-width: 767.98px) {
    :root { --foot-gutter: 20px; }
    .site-foot__nav { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 24px; }
    .site-foot__col a { font-size: 15px; padding: 3px 0; }
    .site-foot__col li + li { margin-top: 6px; }
    .site-foot__base { flex-direction: column-reverse; align-items: flex-start; }
    .site-foot__mark { margin-top: 24px; font-size: 33vw; height: 0.84em; }
}

@media (prefers-reduced-motion: reduce) {
    .site-foot *, .site-foot.is-seen .site-foot__caret { transition-duration: 0.01ms !important; animation: none !important; }
}