/* Inner pages (products, product pages, guides, About, Contact, legal, 404), 2026-11-11 second redesign.
   Loaded after /site.css. It puts the inner pages on the homepage's system (/v2/v2.css): Overpass,
   white paper, black ink, the brand blue, 1px rules between sections. No sky, no glass, no cards with
   shadows, no pills, no all caps, no monospace. The old header markup (.pill) is drawn as the
   homepage's full-width bar. No inline styles (CSP style-src 'self'). */

@font-face { font-family: "Overpass"; src: url("/fonts/overpass.woff2") format("woff2"); font-weight: 300 900; font-style: normal; font-display: swap; }
/* Overpass's middle dot sits hard against the next word ("browse ·plans"); the inner pages' copy uses it
   as a separator, so that one character comes from the system's sans instead. */
@font-face { font-family: "Overpass"; src: local("Helvetica Neue"), local("HelveticaNeue"), local("Helvetica"), local("Arial"), local("ArialMT"), local("Roboto"), local("Segoe UI"); font-weight: 300 900; font-style: normal; unicode-range: U+00B7; }

/* :root:root beats site.css's dark-theme block (:root:not([data-theme])), so these tokens win in both themes. */
:root:root {
  --paper: #ffffff; --paper-2: #f4f5f7;
  --ink: #000000; --body: #33363d; --soft: #5b5f69;
  --rule: #dcdde0; --rule-strong: #000000;
  --blue: #2d3ae0; --blue-ink: #2531c4; --on-blue: #ffffff;
  --sign: #1f2fb8; --sign-line: #ffffff;
  --dot: #f2a516; --live: #f2a516;
  --focus: #2d3ae0;
  --logo-f: #7f89ff; --logo-k: #2d3ae0; --logo-d: #f2a516;
  --frame: #0b0f2a;
  --font: "Overpass", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --max: 1200px; --gut: clamp(20px, 4vw, 48px);
  /* site.css names, mapped onto the new tokens */
  --ink-soft: var(--body); --paper-fold: var(--paper-2); --sheet: var(--paper); --dot-ink: #ffffff;
  --night-ink: var(--ink); --night-soft: var(--body); --night-line: var(--rule); --amber: var(--blue-ink);
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:root {
    --paper: #0d0f1a; --paper-2: #151829;
    --ink: #f4f5f8; --body: #c9ccd6; --soft: #a2a6b4;
    --rule: rgba(255, 255, 255, .14); --rule-strong: #f4f5f8;
    --blue: #4b57f0; --blue-ink: #a9b0ff; --on-blue: #ffffff;
    --sign: #2433c4;
    --focus: #a9b0ff;
    --logo-f: #4c57d6; --logo-k: #9aa2ff; --logo-d: #f2b23a;
    --frame: #05070f;
    color-scheme: dark;
  }
}

/* ---- base ------------------------------------------------------------------ */
html { background: var(--paper); scroll-padding-top: 96px; }
body, body.products-page, body.lost-page { margin: 0; background: var(--paper); color: var(--body); font: 400 1.125rem/1.6 var(--font); font-kerning: normal; overflow-x: clip; }
.v2-sky { display: none; }
a { color: inherit; text-underline-offset: 3px; text-decoration-thickness: 1.5px; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; border-radius: 4px; }
.skip { left: 12px; z-index: 50; padding: 10px 14px; border-radius: 8px; background: var(--ink); color: var(--paper); font-weight: 700; text-decoration: none; }
.wrap { width: min(var(--max), 100% - 2 * var(--gut)); margin-inline: auto; }
.logo .lf { fill: var(--logo-f); } .logo .lk { fill: var(--logo-k); } .logo .ld { fill: var(--logo-d); }
time, .num, .l-ins dd { font-variant-numeric: tabular-nums; }
/* No pointer tilt (depth.js): the page stays still. */
.is-tilt, .products-page .ed-art.is-tilt .porch-phone, .products-page .ed-art.is-tilt .vid-toggle { transform: none !important; }
.prod-icon { box-shadow: none; border-radius: 22%; }

/* ---- header: the homepage bar, drawn from the .pill markup ---------------- */
.pill { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; gap: 32px; min-height: 72px;
  padding-inline: max(var(--gut), (100% - var(--max)) / 2); background: var(--paper); border-bottom: 1px solid var(--rule); }
.pill-brand { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; color: var(--ink); text-decoration: none; font: 800 1.25rem/1 var(--font); letter-spacing: -.01em; }
.pill .logo { width: 30px; height: 30px; flex: none; }
.pill-nav { display: flex; gap: 28px; margin-left: auto; }
.pill-nav a { padding: 8px 0; color: var(--ink); font-weight: 600; font-size: 1rem; text-decoration: none; }
.pill-nav a:hover, .pill-nav a[aria-current="page"] { text-decoration: underline; text-underline-offset: 6px; text-decoration-thickness: 2px; }
.pill-cta { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 11px 18px 9px; border-radius: 10px;
  background: var(--ink); color: var(--paper); font: 700 1rem/1.2 var(--font); letter-spacing: -.005em; text-decoration: none; white-space: nowrap; transition: background-color .15s, color .15s; }
/* Solid buttons are ink, like the homepage's .btn-solid; blue is kept for the sign and the closing panel. */
.pill-cta:hover { background: var(--sign); color: #ffffff; }
/* Phones: the section links take a second row under the logo, instead of hiding. */
@media (max-width: 820px) {
  html { scroll-padding-top: 128px; }
  .pill { flex-wrap: wrap; gap: 0 16px; min-height: 64px; padding-top: 10px; }
  .pill-cta { margin-left: auto; }
  .pill-nav { order: 3; width: 100%; margin: 6px 0 0; gap: 4px 20px; flex-wrap: wrap; }
  .pill-nav a { display: inline-flex; align-items: center; min-height: 44px; padding: 0; font-size: .9375rem; }
}
@media (max-width: 380px) {
  .pill { column-gap: 12px; }
  .pill-brand { gap: 8px; font-size: 1.125rem; }
  .pill .logo { width: 26px; height: 26px; }
  .pill-cta { padding-inline: 12px; font-size: .9375rem; }
  .pill-nav { gap: 0 14px; } .pill-nav a { font-size: .875rem; }
}

/* ---- type ------------------------------------------------------------------ */
main h1, main h2, main h3, .ch-title, .ed-name, .l-h, .p-build-t, .prose h1, .prose h2, .prose h3, .lost h1 { font-family: var(--font); color: var(--ink); }
.ch-title, .listing-page .l-hero .ed-name, .lost h1, .prose h1, .answer-page .l-hero .ch-title, .products-page .ch-title {
  margin: 0; font-size: clamp(2.5rem, 5.2vw, 4.25rem); font-weight: 820; line-height: 1.02; letter-spacing: -.03em; text-wrap: balance; max-width: 18ch; }
.p-eyebrow, .ch-time { margin: 0 0 16px; font: 700 1rem/1.4 var(--font); letter-spacing: 0; text-transform: none; color: var(--soft); }
.ch-time b { font-size: inherit; font-weight: inherit; letter-spacing: 0; margin-right: 0; }
.l-h, .prose h2 { margin: 0 0 24px; font-size: clamp(1.75rem, 3vw, 2.5rem); font-weight: 820; line-height: 1.08; letter-spacing: -.022em; text-wrap: balance; }
h3.l-h { margin-top: clamp(48px, 6vw, 72px); font-size: 1.375rem; font-weight: 750; letter-spacing: -.005em; }
.ch-sub, .a-lede, .ed-line, .ed-sub, .contact-lede { color: var(--body); }
body.products-page .lists .ch-sub, .a-lede, .contact-lede { margin: 24px 0 0; color: var(--body); font-size: 1.25rem; line-height: 1.55; max-width: 36em; text-wrap: pretty; }
.a-lede + .a-lede { margin-top: 14px; }
.a-lede b, .l-p b { color: var(--ink); font-weight: 700; }
.l-p, .a-sub, .ed-line, .l-faq p, .l-shot figcaption, .prose p, .prose li, .prose address { color: var(--body); }
.l-p, .a-sub { max-width: 40em; }
.a-sub { margin: -8px 0 28px; }
.l-p + .l-p { margin-top: 14px; }
main a:not(.btn):not(.pill-cta) { text-decoration-color: currentColor; }
.l-p a, .a-sub a, .l-plan a, .l-faq a, .ed-line a, .prose-body a, .contact-more a, .contact-start a, .a-card-line a { color: var(--blue-ink); }

/* ---- buttons: 10px corners, solid blue or a 2px line --------------------- */
.actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 36px; }
body .btn { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 13px 22px 11px; border: 0; border-radius: 10px; box-shadow: none !important; filter: none !important;
  background: var(--ink) !important; color: var(--paper) !important; font: 700 1.0625rem/1.2 var(--font); letter-spacing: -.005em; text-decoration: none; transition: background-color .15s, color .15s; }
body .btn:hover { background: var(--sign) !important; color: #ffffff !important; }
body .btn.btn-ghost, body .btn.lost-ghost { background: transparent !important; color: var(--ink) !important; border: 2px solid var(--rule-strong); padding: 11px 20px 9px; }
body .btn.btn-ghost:hover, body .btn.lost-ghost:hover { background: var(--ink) !important; color: var(--paper) !important; }

/* ---- page frame: plain paper, sections split by space and a rule ----------- */
.listing, body.products-page .lists { padding-block: clamp(40px, 6vw, 88px) 0; background: none; color: var(--body); }
.l-back { margin: 0 0 20px; font-size: 1rem; font-weight: 600; }
.l-back a, body.products-page .l-back a { color: var(--soft); }
.l-back a:hover { color: var(--ink); }
.l-hero { max-width: 52em; }
.l-sec, .listing-page .l-sec, body.products-page.listing-page .l-sec { margin-top: clamp(48px, 6vw, 80px); padding: clamp(40px, 5vw, 56px) 0 0; border: 0; border-top: 1px solid var(--rule); border-radius: 0; background: none; box-shadow: none; }

/* ---- product status line (was a pill chip) ------------------------------ */
.ed-status, .products-page .ed-status, body.products-page .ed-status { display: inline-flex; align-items: center; gap: 10px; margin: 0; padding: 0; border-radius: 0; background: none; box-shadow: none; color: var(--soft); font-size: 1rem; font-weight: 700; }
.status-dot, .ed-status .status-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--rule); box-shadow: none; flex: none; }
.ed-status.is-open .status-dot { background: var(--live); box-shadow: none; }

/* ---- product pages (/products/<name>/) ----------------------------------- */
.ed-name { display: flex; align-items: center; gap: .3em; margin: 14px 0 0; }
.ed-name .prod-icon { width: .9em; height: .9em; margin: 0; flex: none; }
.ed-tag, body.products-page .ed-tag, .products-page .ed-tag { margin: 20px 0 0; color: var(--ink); font: 750 clamp(1.375rem, 2.4vw, 1.75rem)/1.25 var(--font); letter-spacing: -.01em; text-wrap: balance; }
.ed-line { margin: 16px 0 0; font-size: 1.125rem; max-width: 40em; }
.l-hero .ed-line { font-size: 1.25rem; line-height: 1.55; }
.ed-sub { margin: 12px 0 0; font-size: 1.125rem; max-width: 40em; }

/* Screens: real screenshots on a dark frame, 14px corners, no shadow. */
.l-shots { gap: 24px; }
.l-shot img, .l-shot video { border-radius: 14px; box-shadow: none; background-color: var(--frame); }
.l-shot.is-phone img, .l-shot.is-phone video { border-radius: 20px; }
.l-shot figcaption { margin-top: 12px; font-size: 1rem; line-height: 1.5; }
.media-frame[data-tint] img, .media-frame[data-tint] video, body.products-page .media-frame[data-tint] img, body.products-page .media-frame[data-tint] video { background: var(--frame); }

/* Key numbers: big figures over a rule, no boxes. */
.l-ins { display: grid; gap: 32px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); margin: 0; }
.l-ins > div, .listing-page .l-ins > div, body.products-page .l-ins > div { padding: 18px 0 0; border-radius: 0; background: none; box-shadow: none; border-top: 3px solid var(--rule-strong); }
.l-ins dt, body.products-page .l-ins dt { color: var(--body); font-size: 1rem; font-weight: 600; }
.l-ins dd, body.products-page .l-ins dd { margin: 8px 0 0; color: var(--ink); font: 820 clamp(2rem, 3.4vw, 2.75rem)/1 var(--font); letter-spacing: -.025em; }
.l-ins dd.l-ins-src, body.products-page .l-ins dd.l-ins-src { margin-top: 12px; color: var(--soft); font: 400 .9375rem/1.55 var(--font); letter-spacing: 0; }
.l-ins dd.l-ins-src a { color: var(--blue-ink); }

/* Plans and feature groups: columns under a heavy rule, like the homepage offers. */
.l-plans { display: grid; gap: 40px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); }
.l-plan, .listing-page .l-plan, body.products-page .l-plan, .l-plan.is-paid, body.products-page .l-plan.is-paid { padding: 22px 0 0; border-radius: 0; background: none; box-shadow: none; border-top: 3px solid var(--rule-strong); }
.l-plan h3 { margin: 0; color: var(--ink); font: 750 1.375rem/1.25 var(--font); letter-spacing: -.005em; }
.l-price, body.products-page .l-price { margin: 10px 0 0; color: var(--ink); font-weight: 800; font-size: 1.125rem; }
.l-note, body.products-page .l-note, .l-next, body.products-page .l-next { color: var(--soft); font-size: .9375rem; line-height: 1.55; }
.l-note { margin: 8px 0 0; }
.l-plan ul, body.products-page .l-plan ul { margin: 16px 0 0; padding-left: 1.1em; display: grid; gap: 8px; color: var(--body); }
.l-plan ul li::marker { color: var(--soft); }
.l-next { margin: 16px 0 0; }

/* Questions: rows split by rules. */
.l-faq, body.products-page .l-faq { max-width: 46em; padding: 6px 0; border-top: 1px solid var(--rule); }
.listing-page .l-faq:first-of-type { border-top: 1px solid var(--rule); }
.l-faq:last-child { border-bottom: 1px solid var(--rule); }
/* The whole question row is the target (52px), with a small drawn arrow instead of the browser's marker. */
.l-faq summary { display: flex; align-items: center; gap: 12px; min-height: 52px; padding-block: 8px; list-style: none; color: var(--ink); font-weight: 700; font-size: 1.125rem; line-height: 1.35; cursor: pointer; }
.l-faq summary::-webkit-details-marker { display: none; }
.l-faq summary::before { content: ""; flex: none; width: 0; height: 0; border-style: solid; border-width: 6px 0 6px 9px; border-color: transparent transparent transparent currentColor; transition: transform .15s; }
.l-faq[open] summary::before { transform: rotate(90deg); }
.l-faq summary:hover { text-decoration: underline; text-underline-offset: 4px; }
.l-faq p { margin: 2px 0 14px 21px; }
@media (prefers-reduced-motion: reduce) { .l-faq summary::before { transition: none; } }

/* Bulleted points: rows split by rules. */
.ed-points, body.products-page .ed-points { margin: 0 0 8px; padding: 0; list-style: none; display: grid; gap: 0; max-width: 46em; color: var(--ink); }
.ed-points li { padding: 14px 0 12px; border-top: 1px solid var(--rule); font-weight: 600; }
.ed-points li:last-child { border-bottom: 1px solid var(--rule); }
.ed-points li::before { display: none; }
.ed-points em, body.products-page .ed-points em { color: var(--soft); font-style: normal; font-weight: 400; }

/* ---- /products/ ---------------------------------------------------------- */
.products-page .ch-head { max-width: none; margin-bottom: 0; }
/* Jump links: a plain list of the products with their status, no pills. */
.p-jump { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 32px; margin: 48px 0 0; padding: 0; list-style: none; }
.p-jump a, body.products-page .p-jump a { display: flex; align-items: center; gap: 12px; min-height: 60px; padding: 10px 0; border-radius: 0; background: none; box-shadow: none; border-top: 1px solid var(--rule);
  color: var(--ink); font-weight: 750; font-size: 1.125rem; text-decoration: none; }
.p-jump a:hover, body.products-page .p-jump a:hover { background: none; box-shadow: none; text-decoration: underline; text-underline-offset: 4px; }
.p-jump small, body.products-page .p-jump small { margin-left: auto; padding-left: 8px; color: var(--soft); font-size: .9375rem; font-weight: 600; text-align: right; }
.p-jump-dot, body.products-page .p-jump-dot { display: none; }
.p-jump .prod-icon { width: 28px; height: 28px; margin: 0; flex: none; border-radius: 7px; }
.p-note, .ed-src, body.products-page .ed-src { margin: 16px 0 0; padding: 0; border: 0; color: var(--soft); font-size: .9375rem; }

/* One product per row, split by rules; the screen alternates sides like the homepage. */
.products-page .ed, body.products-page .ed { position: static; isolation: auto; overflow: visible; display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: clamp(32px, 5vw, 72px); align-items: center;
  margin: 0; padding: clamp(48px, 6vw, 80px) 0; border-radius: 0; background: none; box-shadow: none; border-top: 1px solid var(--rule); }
.products-page .ch-head + .ed { margin-top: clamp(56px, 7vw, 88px); }
body.products-page .ed + .ed { border-top: 1px solid var(--rule); }
.products-page .ed::before { display: none; }
.products-page .ed-name, .products-page .ed .ed-name { font-size: clamp(2.25rem, 4vw, 3.25rem); font-weight: 820; line-height: 1; letter-spacing: -.03em; }
.products-page .ed-name .prod-icon { width: 48px; height: 48px; border-radius: 12px; }
body.products-page .ed.ed-soon { grid-template-columns: minmax(0, 1fr); padding-block: 32px; }
.products-page .ed.ed-soon .ed-name { margin-top: 8px; font-size: clamp(1.75rem, 3vw, 2.25rem); }
body.products-page .ed.ed-soon + .p-build { margin-top: clamp(48px, 6vw, 72px); }
.ed .actions { margin-top: 28px; }
.ed-art { min-width: 0; }
.porch-app, .products-page .porch-app { border-radius: 14px; box-shadow: none; background: var(--frame); }
.porch-phone, .products-page .porch-phone { right: 0; border: 4px solid #000; border-radius: 18px; box-shadow: none; }
.porch-art .vid-toggle { right: 12px; }
@media (prefers-color-scheme: dark) { .porch-phone, .products-page .porch-phone { border-color: #2a2d3d; } }
.ed-art img { border-radius: 14px; }

/* The three steps: a small blue line icon over a rule, no boxes. */
.ed-steps { gap: 20px; margin: 28px 0 0; }
.ed-steps li, body.products-page .ed-steps li { display: grid; gap: 10px; align-content: start; padding: 14px 0 0; border-radius: 0; background: none; box-shadow: none; border-top: 1px solid var(--rule);
  color: var(--ink); font: 650 1rem/1.35 var(--font); hyphens: manual; }
.ed-step-i, body.products-page .ed-step-i { width: auto; height: auto; place-items: start; justify-content: start; border-radius: 0; background: none; }
.ed-step-i svg { width: 26px; height: 26px; stroke: var(--blue-ink); stroke-width: 1.8; }
@media (max-width: 480px) { .ed-steps li, body.products-page .ed-steps li { grid-template-columns: 30px minmax(0, 1fr); align-items: center; gap: 12px; padding-block: 12px; } }

.ed-live { margin: 16px 0 0; max-width: 40em; font-size: 1rem; line-height: 1.5; color: var(--body); }
.ed-live b { color: var(--ink); font-weight: 800; }
/* The price: a real information box, so it keeps a 1px rule. */
.ed-price, body.products-page .ed-price { margin: 24px 0 0; padding: 14px 18px 12px; border-radius: 12px; background: none; box-shadow: none; border: 1px solid var(--rule); color: var(--body); font-size: 1rem; line-height: 1.55; }
.ed-price b, body.products-page .ed-price b { color: var(--ink); font-weight: 800; }
.ed-price em { color: var(--soft); }
.ed-more, body.products-page .ed-more { margin-top: 20px; font-size: .9375rem; color: var(--soft); }
.ed-more summary { min-height: 44px; color: var(--body); font-weight: 600; }
.ed-more summary:hover { color: var(--ink); }

/* The closing call to action: the homepage's blue guide sign. */
.p-build, body.products-page .p-build { margin-top: clamp(64px, 8vw, 112px); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 28px 40px;
  padding: clamp(36px, 5vw, 64px); border-radius: 20px; background: var(--sign); box-shadow: none; outline: 3px solid var(--sign-line); outline-offset: -12px; color: var(--on-blue); }
.p-build > div:first-child { flex: 1 1 340px; min-width: 0; }
.p-build-t { margin: 0; color: var(--on-blue); font: 820 clamp(1.875rem, 3.6vw, 2.75rem)/1.05 var(--font); letter-spacing: -.022em; text-wrap: balance; max-width: 18ch; }
.p-build-s { margin: 14px 0 0; color: var(--on-blue); font-size: 1.125rem; line-height: 1.5; max-width: 32em; }
.p-build .actions { margin: 0; }
body .p-build .btn { background: #ffffff !important; color: #1a2699 !important; }
body .p-build .btn:hover { background: #e9ebff !important; color: #1a2699 !important; }
body .p-build .btn.btn-ghost { background: transparent !important; color: #ffffff !important; border-color: #ffffff; }
body .p-build .btn.btn-ghost:hover { background: rgba(255, 255, 255, .12) !important; color: #ffffff !important; }
.p-build :focus-visible { outline-color: #ffffff; }

/* ---- legal pages ------------------------------------------------------------ */
.prose { padding-block: clamp(40px, 6vw, 88px) 0; }
/* Left-aligned to the same 1200px grid as the header and footer, with a readable measure. */
.prose .wrap { max-width: none; }
.prose:not(.has-toc) .wrap > * { max-width: 760px; }
.contact-page .wrap > .contacts { max-width: 960px; }
.prose.has-toc .wrap { grid-template-columns: 240px minmax(0, 760px); }
.prose h1 { margin: 0 0 12px; }
.prose h2 { margin: 56px 0 16px; padding-top: 32px; border-top: 1px solid var(--rule); font-size: clamp(1.5rem, 2.4vw, 1.875rem); }
.prose h3 { margin: 32px 0 6px; font: 750 1.1875rem/1.3 var(--font); }
.prose p, .prose li { line-height: 1.65; }
.prose .updated { display: block; margin: 8px 0 0; padding: 0; border-radius: 0; background: none; color: var(--soft); font-size: 1rem; }
.toc { top: 104px; font-size: .9375rem; }
.toc-h { color: var(--ink); font-weight: 750; }
.toc li { border-left: 1px solid var(--rule); }
.toc a { color: var(--body); margin-left: -1px; border-left-width: 2px; }
.toc a:hover { color: var(--ink); text-decoration: underline; }
.toc a[aria-current="location"] { border-left-color: var(--ink); color: var(--ink); font-weight: 700; }
.toc-m { margin: 24px 0 8px; border-radius: 12px; background: none; border: 1px solid var(--rule); }
.toc-m summary { color: var(--ink); font-weight: 700; }
.toc-m a { color: var(--body); border-top-color: var(--rule); }

/* ---- Contact page -------------------------------------------------------- */
.contact-page h1 { margin-bottom: 0; }
.contact-start { margin: 18px 0 0; color: var(--ink); font-weight: 700; }
.contacts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 40px; margin: 48px 0 16px; }
.contacts li { border-top: 3px solid var(--rule-strong); }
.contact { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-content: start; align-items: center; row-gap: 0; column-gap: 12px; height: 100%;
  padding: 20px 0 28px; border-radius: 0; background: none; box-shadow: none; color: var(--body); text-decoration: none; }
.contact:hover { box-shadow: none; }
.contact:hover .contact-e { text-decoration-thickness: 2px; }
.contact-t { grid-column: 1; display: flex; align-items: center; min-height: 36px; color: var(--ink); font: 750 1.25rem/1.25 var(--font); letter-spacing: -.005em; }
.has-copy .contact-t { padding-right: 0; }
.has-copy .contact::before { content: ""; grid-column: 2; grid-row: 1; width: 64px; }  /* room for the Copy button, which sits over this cell */
.contact-s, .contact-e { grid-column: 1 / -1; }
.contact-s { margin-top: 8px; color: var(--body); font-size: 1rem; line-height: 1.55; }
.contact-e { margin-top: 12px; color: var(--blue-ink); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1.5px; }
.contact-copy, .contacts li.has-copy .contact-copy { top: 24px; right: 0; min-height: 36px; padding: 6px 12px 4px; border: 1.5px solid var(--rule-strong); border-radius: 10px; background: transparent; color: var(--ink); font: 700 .875rem/1.2 var(--font); }
.contact-copy:hover { box-shadow: none; background: var(--ink); color: var(--paper); }
.contact-more { margin: 24px 0 8px; color: var(--body); }
.contact-page h2 { margin-top: 64px; }
@media (max-width: 640px) { .contacts { grid-template-columns: minmax(0, 1fr); } }

/* ---- 404: a plain page now, in the visitor's theme ------------------------ */
.lost, body.lost-page .lost { min-height: min(60svh, 560px); display: flex; align-items: center; padding-block: clamp(56px, 8vw, 112px); background: none; }
.lost::before { display: none; }
.lost p { color: var(--body); font-size: 1.25rem; }
.lost .ch-time { font-size: 1rem; color: var(--soft); }
.lost h1 { margin-bottom: 20px; }

/* ---- footer: the homepage footer's columns -------------------------------- */
.site-foot, .products-page .site-foot, body.products-page .site-foot, .lost-page .site-foot { margin-top: clamp(88px, 12vw, 160px); padding-block: 56px 48px; border-top: 1px solid var(--rule); background: var(--paper); color: var(--body); font-size: 1rem; }
.site-foot .wrap { display: grid; grid-template-columns: 1.4fr repeat(3, minmax(0, 1fr)); gap: 32px; align-items: start; }
.foot-brand, .products-page .site-foot .foot-brand, .lost-page .site-foot .foot-brand { display: inline-flex; align-items: center; gap: 10px; min-height: 0; color: var(--ink); text-decoration: none; font: 800 1.25rem/1 var(--font); letter-spacing: -.01em; }
.foot-brand svg { width: 30px; height: 30px; }
/* site.css gives the old night footer its own logo colors; put the page's back. */
.products-page .site-foot .logo { --logo-f: #7f89ff; --logo-k: #2d3ae0; --logo-d: #f2a516; }
@media (prefers-color-scheme: dark) { .products-page .site-foot .logo { --logo-f: #4c57d6; --logo-k: #9aa2ff; --logo-d: #f2b23a; } }
.site-foot nav, .site-foot .foot-products, .home .site-foot .foot-products, .products-page .site-foot .foot-products, .lost-page .site-foot .foot-products {
  grid-column: auto; display: grid; align-content: start; justify-content: stretch; gap: 8px; margin: 0; padding: 0; border: 0; }
.site-foot nav a, .foot-products a { display: block; min-height: 0; padding: 0; color: var(--body); font-weight: 400; text-decoration: none; }
.site-foot nav a:hover { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
.site-foot nav a[aria-current="page"] { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
.foot-products .foot-label { margin-bottom: 6px; padding: 0; color: var(--ink); font: 750 1rem/1.6 var(--font); letter-spacing: 0; text-transform: none; }
.foot-products .prod-icon { display: none; }
/* The third column has no label in the markup: start its links level with the others. */
.site-foot nav:not(.foot-products) { padding-top: calc(1.6em + 14px); }
.site-foot .foot-copy, .products-page .site-foot .foot-copy, .lost-page .site-foot .foot-copy { grid-column: 1 / -1; margin: 32px 0 0; padding-top: 20px; border-top: 1px solid var(--rule); color: var(--soft); font-size: .875rem; }
.site-foot .foot-also { grid-column: 1 / -1; margin: -20px 0 0; color: var(--soft); font-size: .875rem; }
.site-foot .foot-also a { color: var(--soft); }
@media (max-width: 980px) {
  .site-foot .wrap { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .foot-brand { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  .site-foot .wrap { grid-template-columns: 1fr 1fr; gap: 32px 24px; }
  .site-foot nav a { padding-block: 4px; }
  .site-foot nav:not(.foot-products) { padding-top: 0; }
  .ed-steps { gap: 0; }
}

/* ---- narrower screens ------------------------------------------------------ */
@media (max-width: 900px) {
  .products-page .ed, body.products-page .ed { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .p-jump { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  body, body.products-page, body.lost-page { font-size: 1.0625rem; }
  .lists .ch-sub, .a-lede, .contact-lede, .l-hero .ed-line, .lost p { font-size: 1.125rem; }
  .actions .btn { flex: 1 1 100%; }
  .p-jump { grid-template-columns: minmax(0, 1fr); }
  .p-build, body.products-page .p-build { padding: 36px 28px; border-radius: 16px; outline-offset: -10px; }
  .listing-page .l-hero .ed-name { font-size: clamp(2.5rem, 12vw, 3.5rem); }
}

/* Phones and tablets: every link and control gets at least a 44px-tall target. */
.ed-points a { color: var(--blue-ink); }
.ed-points li > a:only-child { display: block; margin-block: -14px -12px; padding-block: 14px 12px; }
@media (max-width: 820px) {
  .l-back a { display: inline-flex; align-items: center; min-height: 44px; }
  .l-back { margin-bottom: 8px; }
  /* Links inside running text: vertical padding on an inline box widens the target without moving the lines. */
  main :is(p, li, dd, td, th, address, em) > a:not(.btn) { padding-block: 13px; }
  .foot-brand, .products-page .site-foot .foot-brand, .lost-page .site-foot .foot-brand { min-height: 44px; }
  .site-foot nav, .site-foot .foot-products, .products-page .site-foot .foot-products, .lost-page .site-foot .foot-products { gap: 0; }
  .site-foot nav a, .foot-products a { display: flex; align-items: center; min-height: 44px; padding-block: 6px; line-height: 1.3; }
  .foot-products .foot-label { margin-bottom: 4px; }
  .site-foot nav:not(.foot-products) { padding-top: calc(1.6em + 4px); }
  .contact-copy, .contacts li.has-copy .contact-copy { min-height: 44px; top: 20px; padding-inline: 14px; }
  .has-copy .contact::before { width: 72px; }
  .contact-t { min-height: 44px; }
}
@media (max-width: 640px) { .site-foot nav:not(.foot-products) { padding-top: 0; } }

/* City link lists on product pages: comfortable tap targets on phones (gate 11-11: 15px-tall links). */
@media (max-width: 700px) {
  body.products-page .l-ins dd.l-ins-src:has(a) { line-height: 2.6; }
  body.products-page .l-ins dd.l-ins-src a { display: inline-block; padding: 12px 2px; margin: -12px 0; }
}
