:root {
font-size: max(16px, 1.11vw);
--ground: #bf400b;
--ink-rgb: 255, 255, 255;
--on-light: #bf400b;
--sheet-bg: #0e1414;
--flame: #bf400b;
--flame-rgb: 191, 64, 11;
--coal: #0d1011;
--glass-blur: 50px;
--radius-pill: 999px;
--font: 'Aeonik', 'Helvetica Neue', Helvetica, Arial, sans-serif;
--t-xxxl: max(90px, 10.111vw);
--t-xxl: max(64px, 6.25vw);
--t-xxl3: max(48px, 5.333vw);
--t-xl: max(34px, 3.444vw);
--t-l: max(28px, 2.778vw);
--t-m: max(19px, 1.667vw);
--t-s: max(16px, 1.389vw);
--t-xs: max(14px, 1.111vw);
--t-xxs: max(12px, 0.972vw);
--lh-display: 1.06;
--lh-heading: 1.14;
--lh-subhead: 1.15;
--lh-lead: 1.3;
--lh-body: 1.5;
--gutter: 3vw;
--edge: calc((100% - 94vw) / 2);
--sp-1: max(32px, 2.3vw);
--sp-2: max(60px, 4.6vw);
--sp-3: max(112px, 8.7vw);
--sec-gap: max(172px, 15vw);
--rule: 1px;
--d1: 0.5s;
--d2: 1s;
--d3: 1.5s;
--ease: cubic-bezier(0.4, 0, 0.2, 1);
--ease-out: cubic-bezier(0.16, 1, 0.3, 1);
--ease-text: cubic-bezier(0.19, 1, 0.22, 1);
--d-roll: 0.95s;
--d-word: 1.35s;
--stagger-word: 70ms;
--d-char: 1.7s;
--stagger-char: 8ms;
--skew-word: -8deg;
--skew-char: -8deg;
--d-line: 1.55s;
--d-rise: 1.45s;
--stagger-line: 150ms;
--roll-tail: 0.18em;
--d-push: 0.95s;
--e-lot: cubic-bezier(0.167, 0.167, 0.833, 0.833);
}
:root,
body.is-light,
.sheet,
.hero-pin,
.hdr.on-hero {
--ink: rgb(var(--ink-rgb));
--body: rgba(var(--ink-rgb), 0.86);
--muted: rgba(var(--ink-rgb), 0.60);
--dim: rgba(var(--ink-rgb), 0.38);
--hairline: rgba(var(--ink-rgb), 0.28);
--glass-bg: rgba(var(--ink-rgb), 0.10);
--glass-border: rgba(var(--ink-rgb), 0.20);
--media-bg: rgba(var(--ink-rgb), 0.16);
}
:root { --btn-bg: var(--ink); --btn-fg: var(--flame); }
body.is-dark,
body.is-light,
.sheet { --btn-bg: var(--flame); --btn-fg: #fff; }
[data-reveal-now] {
--d-char: 1.15s;
--d-word: 0.9s;
--d-line: 1.05s;
--d-rise: 1s;
}
body.is-dark {
--ground: #0d1011;
--on-light: #0d1011;
}
body.is-light {
--ground: #f3efe8;
--ink-rgb: 13, 16, 17;
--on-light: #f3efe8;
}
.hero-pin,
.hdr.on-hero {
--ground: #bf400b;
--ink-rgb: 255, 255, 255;
--on-light: #bf400b;
--btn-bg: #fff;
--btn-fg: var(--flame);
color: var(--ink);
}
@media (max-width: 640px) {
:root {
--t-xxxl: max(56px, 10.111vw);
--t-xxl: max(44px, 6.25vw);
--t-xxl3: max(36px, 5.333vw);
--sp-3: max(80px, 10vw);
--sec-gap: max(112px, 15vw);
}
}
