/* Hallmark · v2.0.0 · base · the Floor, decided once: overflow clipping, focus rings, motion fallback, browser surfaces */

/*
 * ITAMS · base
 * What the Floor already settled. Element defaults only; components live in
 * style.css. Every value resolves through tokens.css.
 */

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    overflow-x: clip;
    scroll-padding-top: var(--navbar-height);
    -webkit-text-size-adjust: 100%;
}

body {
    overflow-x: clip;
    margin: 0;
    min-height: 100vh;
    font-family: var(--font-body);
    font-size: var(--text-base);
    font-weight: var(--weight-body);
    line-height: 1.55;
    letter-spacing: var(--tracking-body);
    color: var(--ink);
    background: var(--paper);
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ── Type ─────────────────────────────────────────────── */
h1, h2, h3, h4, h5, h6 {
    margin: 0 0 var(--space-sm);
    font-family: var(--font-display);
    font-weight: var(--weight-medium);
    letter-spacing: var(--tracking-display);
    line-height: 1.15;
    color: var(--ink);
    text-wrap: balance;
}

h1 { font-size: var(--text-display-s); line-height: 1.1; }
h2 { font-size: var(--text-section); line-height: 1.15; }
h3 { font-size: var(--text-xl); }
h4 { font-size: var(--text-title); }
h5 { font-size: var(--text-md); }
h6 { font-size: var(--text-base); }

p {
    margin: 0 0 var(--space-md);
    text-wrap: pretty;
}

small,
.small {
    font-size: var(--text-xs);
}

strong,
b {
    font-weight: var(--weight-medium);
}

code,
kbd,
pre,
samp {
    font-family: var(--font-outlier);
    font-size: 0.9em;
    font-variant-numeric: tabular-nums;
}

/* figures that compare (F6) */
.tabular,
.stat-value,
.stat-card .stat-value,
td .figure {
    font-variant-numeric: tabular-nums slashed-zero;
}

/* ── Links ────────────────────────────────────────────── */
a {
    color: var(--accent);
    text-decoration: none;
    transition: color var(--dur-micro) var(--ease-out);
}

a:hover {
    color: var(--accent-hover);
}

/* ── Browser surfaces (F16) ───────────────────────────── */
::selection {
    color: var(--ink);
    background: color-mix(in oklab, var(--accent) 22%, transparent);
}

html {
    caret-color: var(--accent);
    scrollbar-color: var(--rule-2) transparent;
    scrollbar-width: thin;
}

*::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

*::-webkit-scrollbar-track {
    background: transparent;
}

*::-webkit-scrollbar-thumb {
    background: var(--rule-2);
    border-radius: var(--radius-full);
}

/* ── Focus: instant, never animated (15, 26a) ──────────── */
:focus-visible {
    outline: 2px solid var(--focus);
    outline-offset: 2px;
    border-radius: var(--radius-xs);
    transition: none;
}

/* ── Container cap (44d) ──────────────────────────────── */
.container,
.container-fluid,
.container-lg,
.container-xl {
    max-width: var(--container);
}

/* ── Motion fallback (27, 62) ─────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}