/* CFS — the landing page at the CFS address's "/" (public/cfs-landing.html, v2 P1). Neutral: "CFS by Fr8Labs". */
:root {
  --cl-ink: #111827;
  --cl-muted: #6b7280;
  --cl-line: #e5e7eb;
  --cl-bg: #f6f7f9;
  --cl-card: #ffffff;
  --cl-accent: #1f2937;
  --cl-hover: #f3f4f6;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color: var(--cl-ink);
  background: var(--cl-bg);
  font-size: 15px;
  line-height: 1.45;
}
[hidden] { display: none !important; }

.cl-main { max-width: 440px; margin: 10vh auto 0; padding: 0 16px 32px; }
.cl-card { background: var(--cl-card); border: 1px solid var(--cl-line); border-radius: 10px; padding: 28px 24px; }
.cl-eyebrow { font-size: 13px; font-weight: 600; color: var(--cl-muted); margin: 0 0 10px; }
.cl-card h1 { font-size: 22px; margin: 0 0 4px; }
.cl-lede { color: var(--cl-muted); margin: 0 0 20px; }
.cl-checking p { color: var(--cl-muted); margin: 0; }

.cl-choices { display: grid; gap: 12px; }
.cl-choice {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-height: 64px;
  justify-content: center;
  padding: 12px 16px;
  border: 1px solid var(--cl-line);
  border-radius: 8px;
  color: var(--cl-ink);
  text-decoration: none;
}
.cl-choice:hover, .cl-choice:focus-visible { background: var(--cl-hover); border-color: var(--cl-accent); }
.cl-choice:first-child { border-color: var(--cl-accent); border-width: 2px; padding: 11px 15px; }
.cl-choice__title { font-weight: 600; font-size: 16px; }
.cl-choice__sub { color: var(--cl-muted); }