/* II · Signal — Outfit (clean geometric, high-tech, very legible) with Geist Mono readouts */
@font-face { font-family: "Outfit"; src: url("../fonts/Outfit-Regular.woff") format("woff"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Outfit"; src: url("../fonts/Outfit-Bold.woff") format("woff"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Geist Mono"; src: url("../fonts/GeistMono-Regular.woff") format("woff"); font-display: swap; }
:root { --serif: "Outfit", "Helvetica Neue", Arial, sans-serif; --sans: "Outfit", "Helvetica Neue", Arial, sans-serif; --mono: "Geist Mono", ui-monospace, Menlo, monospace; --led: #8CC8FF; }
.title { font-size: clamp(52px, 7.4vw, 136px); font-weight: 400; line-height: 0.96; letter-spacing: -0.04em; }
.title--md { font-size: clamp(42px, 5.4vw, 96px); letter-spacing: -0.035em; }
.title em, .lede em { color: var(--led); }
.lede { font-family: var(--sans); font-size: clamp(32px, 3.4vw, 56px); line-height: 1.08; letter-spacing: -0.025em; }
.label, .numeral, .index a, .terms li, .mark span, .foot__legal { font-family: var(--mono); }
.label, .numeral { font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; }
.numeral { color: var(--led); }
.numeral::before, .label::before { content: "["; margin-right: 0.5em; opacity: 0.6; }
.numeral::after, .label::after { content: "]"; margin-left: 0.5em; opacity: 0.6; }
.body { font-size: 18.5px; line-height: 1.6; letter-spacing: 0.002em; }
.cta { font-family: var(--mono); font-size: 13.5px; letter-spacing: 0.06em; text-transform: uppercase; }
.cta--sm { font-size: 11.5px; }
.apps a { font-size: 18px; letter-spacing: -0.01em; }
.terms li { font-size: 12.5px; letter-spacing: 0.1em; }
.index b::after { background: var(--led); }
@media (max-width: 1240px) { .nav > a { font-family: var(--sans); letter-spacing: -0.03em; } }
@media (max-width: 760px) { .title { font-size: clamp(46px, 12.6vw, 62px); } .title--md { font-size: clamp(38px, 10.4vw, 50px); } .lede { font-size: clamp(30px, 8.4vw, 38px); } }

/* Opening: one headline, one descriptor, the two actions; the formation keeps the frame */
.caption--open { max-width: 900px; gap: 22px; }
.title--open { max-width: 11.5ch; font-size: clamp(44px, 5vw, 92px); line-height: 0.98; letter-spacing: -0.042em; }
.caption--open .ctas { margin-top: 10px; }
@media (max-width: 760px) {
  .caption--open { gap: 16px; }
  .title--open { max-width: none; font-size: clamp(38px, 10.8vw, 52px); line-height: 1; }
}