/* 58Hunter — portal surface layer * * Public content typography only. Tokens/primitives/compositions: design-system.css. * Marketing compositions: Web app.css. * * Usage: * - Web: (same type scale as the public site) * - BO candidate preview: .portal-surface on the preview shell (not density-compact) * - BO ops pages: do not use .portal-surface (keep density-compact) * * Specificity: descendant type rules use :where(.portal-surface) so they stay at * element specificity (0,0,1) — same as the old body sheet. Primitives and * compositions (.btn, .eyebrow, .hero-stage__ticker-line, …) always win. * Never use bare .portal-surface a / .portal-surface p (they beat .btn / pills). */ /* —— Content typography (matches historic public body sheet) —— */ .portal-surface { font-family: var(--font-sans); font-size: var(--text-base); font-weight: 400; line-height: var(--leading-normal); color: var(--colour-ink); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; } :where(.portal-surface) h1, :where(.portal-surface) h2, :where(.portal-surface) h3, :where(.portal-surface) h4 { margin: 0 0 var(--space-3); line-height: var(--leading-tight); color: var(--colour-ink); scroll-margin-top: calc(var(--header-height) + var(--space-3)); } :where(.portal-surface) h1 { font-family: var(--font-display); font-size: var(--text-3xl); font-weight: 600; letter-spacing: -0.02em; } :where(.portal-surface) h1:focus { outline: none; } :where(.portal-surface) h2 { font-family: var(--font-display); font-size: var(--text-2xl); font-weight: 600; letter-spacing: -0.015em; } :where(.portal-surface) h3 { font-family: var(--font-sans); font-size: var(--text-xl); font-weight: 600; letter-spacing: -0.02em; } :where(.portal-surface) p { margin: 0 0 var(--space-4); color: var(--colour-muted); } :where(.portal-surface) a { color: var(--colour-ink-soft); text-decoration-thickness: 1px; text-underline-offset: 0.18em; transition: color var(--duration-fast) var(--ease-out); } :where(.portal-surface) a:hover { color: var(--colour-accent); }