/* ============================================================================ EstimateNext — Public marketing site · "THE MEASURED SHEET" ---------------------------------------------------------------------------- The brand's shop window: landing/signup, features, pricing. Same craft-led language as the in-app refresh (static/css/ui_refresh.css) — ink on vellum, hairline rules, the dimension-line signature, Space Grotesk display, IBM Plex Mono tabular figures, burnt-sienna marking accent as the primary CTA. HEADLINE VOICE: velocity to bid — these pages lead with the outcome, the measured sheet is the texture beneath it. EVERY rule is scoped under `body.ui-refresh`. These three pages carry their OWN (no shared base), each gates this stylesheet + the webfonts + the `ui-refresh` body class on the global `ui_refresh` flag (follows the app default / `?ui=refresh` per session). With the flag OFF the class is absent, this file is never linked, and the pages render byte-identically to today. apps/publicapi is out of scope. Prices come from template context / existing markup — never hardcoded here. Tokens mirror the in-app sheet so the marketing skin and the product read as one brand (re-declared locally because these pages don't load ui_refresh.css): ink #15181C · vellum #FBFAF6 · graphite #5C636B · rule #E4E0D8 mark (sienna) #C45A28 · measured #2F7D5B ========================================================================== */ body.ui-refresh { --ms-ink: #15181C; --ms-ink-2: #2A2F37; --ms-graphite: #5C636B; --ms-vellum: #FBFAF6; --ms-vellum-2: #F4F1EA; /* recessed surface */ --ms-paper: #FFFFFF; /* raised card face */ --ms-rule: #E4E0D8; /* hairline / drawing border */ --ms-rule-ink: #C9C3B6; /* stronger rule */ --ms-mark: #C45A28; /* sienna marking accent — primary CTA */ --ms-mark-700: #A8481F; /* sienna pressed */ --ms-mark-soft: #F6E7DD; --ms-measured: #2F7D5B; /* confirmed/included (semantic) */ --ms-needs: #B6852A; --ms-error: #B23B3B; --ms-display: "Space Grotesk", "Inter", system-ui, sans-serif; --ms-body: "Inter", system-ui, -apple-system, sans-serif; --ms-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace; background: var(--ms-vellum); color: var(--ms-ink); font-family: var(--ms-body); -webkit-font-smoothing: antialiased; font-feature-settings: "tnum" 1, "cv01" 1; } body.ui-refresh h1, body.ui-refresh h2, body.ui-refresh h3, body.ui-refresh h4, body.ui-refresh h5, body.ui-refresh h6 { font-family: var(--ms-display); letter-spacing: -0.015em; color: var(--ms-ink); } body.ui-refresh a { color: var(--ms-mark); } body.ui-refresh a:hover { color: var(--ms-mark-700); } /* a reusable mono eyebrow — the QS's uppercase annotation hand */ body.ui-refresh .ms-eyebrow { font-family: var(--ms-mono); font-size: 0.72rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ms-graphite); font-weight: 500; } /* the dimension-line signature: |————————————| value |————————————| a centred hairline capped by tick marks, used as a section divider */ body.ui-refresh .ms-dimline { display: flex; align-items: center; gap: 0.85rem; justify-content: center; margin: 1.1rem auto 0; max-width: 460px; } body.ui-refresh .ms-dimline::before, body.ui-refresh .ms-dimline::after { content: ""; flex: 1 1 auto; height: 7px; background: linear-gradient(var(--ms-rule-ink), var(--ms-rule-ink)) center / 100% 1.5px no-repeat; } body.ui-refresh .ms-dimline::before { border-left: 1.5px solid var(--ms-rule-ink); } body.ui-refresh .ms-dimline::after { border-right: 1.5px solid var(--ms-rule-ink); } body.ui-refresh .ms-dimline-label { font-family: var(--ms-mono); font-size: 0.7rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ms-graphite); white-space: nowrap; } /* ========================================================================= LANDING / SIGNUP (templates/marketing/landing.html — has its own inline