/* v0.600 S-HOME-PHONE: the marketing footer's own stylesheet — server.py's _marketing_footer_html()
   injects the SAME <footer class="v-footer"> markup on every marketing surface (home "/", the 7
   /for/{slug} vertical pages, /compare), but until now only vertical.css carried its CSS, and only
   the 8 vertical/compare pages loaded vertical.css. The home page never did, so its footer rendered
   completely unstyled (links running together edge-to-edge, 0px gutter — diagnosed 2026-09-29).
   Extracted verbatim from vertical.css (least-risk option per the diagnosis: a small SHARED
   stylesheet both the home page and the vertical pages load, rather than loading the whole of
   vertical.css — with its .v-hero/.v-steps/.v-proof/etc rules meant for the vertical-page skeleton —
   onto the home page for one footer). Self-contained: uses the SAME brand tokens (--brand-ink/
   --brand-gold/--border/--surface-ivory) vertical.css's own --v-* names alias, with the identical
   fallback hex, so this file has NO dependency on vertical.css's :root block and is safe to load
   with or without it. vertical.css's own copy of these rules is removed in the same change — one
   definition, not two that can drift. */
.v-footer{ background:var(--surface-ivory, #F1ECE2); border-top:1px solid var(--border, #e3ddd0);
  font-family:inherit; color:var(--brand-ink, #14253D); margin-top:56px; }   /* v0.603: 56 px from the last content on all marketing pages, the same 56 px as above the closing button (was 48; v0.601 S-CG1-D4 was 36), spec 203 */
.v-footer__groups{ max-width:1120px; margin:0 auto; padding:32px 20px 24px;
  display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:28px 48px; }
.v-footer__group{ display:flex; flex-direction:column; gap:12px; }
.v-footer__label{ margin:0; font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:#6B5A2E; }
/* v0.600 S-HOME-PHONE (skeptic review item 1, founder's literal ask: the footer items were "not
   properly separated with — or •"): column-gap tightened 16px -> 8px, the rest of the visual
   separation now comes from the "•" below, so links read "Enterprise  •  Creators" instead of
   floating in loose, unmarked whitespace. */
.v-footer__links{ display:flex; flex-wrap:wrap; gap:8px 8px; }
.v-footer__links a, .v-footer__links span.v-footer__self{ font-size:15px; line-height:1.5; color:var(--brand-ink, #14253D);
  text-decoration:underline; text-decoration-color:var(--brand-gold, #C3A14B); text-underline-offset:3px; }
.v-footer__links span.v-footer__self{ text-decoration:none; color:#6B7280; cursor:default; }
.v-footer__legal{ border-top:1px solid var(--border, #e3ddd0); padding:14px 20px; display:flex; flex-wrap:wrap;
  justify-content:center; gap:6px 8px; font-size:12.5px; color:#4E5666; }
.v-footer__legal a{ color:#4E5666; }
/* the separator itself: a "* + *" child combinator puts it on every item EXCEPT the first, never
   appended after the last — so it can never dangle at a wrapped line's END (a trailing "* + *"
   sibling on the SAME visual line always has a next item after it, by construction); a leading
   bullet at a wrapped line's START is accepted (skeptic review item 1's own carve-out). A HIDDEN
   item (e.g. `#footer-waitlist-wrap[hidden]`, revealed only once localStorage['cosigna.tried'] is
   set) generates no box at all while hidden, so it neither shows its own separator nor leaves a
   gap that would read as a double one; once revealed it is simply "not `:first-child`" like any
   other item and gets exactly one leading separator, same as every sibling — verified by reading
   the rule rather than a live capture (Chromium is in use by another builder this round). Purely
   decorative: CSS generated content (`content:"•"`) is never exposed to assistive tech, so no
   `aria-hidden` is needed on top of it. */
.v-footer__links > * + *::before,
.v-footer__legal > * + *::before{
  content:"•"; margin-right:8px; color:rgba(195,161,75,.65);
  display:inline-block;
}
/* v0.601 S-CG1-A4 (register 2026-09-29 16:23 effect 3, "the underline under the bullet is fixed in both"): the bullet lives
   INSIDE each link, so the link's underline propagated into the generated box and ran under it. An inline-block box does
   not receive a propagated text-decoration (a text-decoration:none on the pseudo-element would NOT remove it), hence the
   display:inline-block above. On phones the bullet is gone altogether and the two groups become a two-column,
   left-aligned grid (same register block; the breakpoint is the one every phone rule of the marketing pages uses,
   520 px and under, register 2026-09-29 17:19 "defaults not objected to"). Never set display on the children of the
   link box: the earned waitlist item is a hidden span and must stay hidden until the visitor has tried. */
@media (max-width:520px){
  .v-footer__links{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 16px; justify-items:start; text-align:left; }
  .v-footer__links > *{ min-height:24px; }   /* target size (spec 77); no display set, the hidden waitlist span stays hidden */
  .v-footer__links > * + *::before{ content:none; }
}

[data-theme="dark"] .v-footer, :root:not([data-theme="light"]) .v-footer{ background:#16223a; border-color:#2a3852; }