/* BRAND.md section 11. Change values there first, then here. */
:root{
  /* color */
  --ws-dark:#0F1014; --ws-dark-2:#0A0B0E; --ws-dark-3:#16171B;
  --ws-red:#FF0000; --ws-red-ui:#CC0000; --ws-red-hover:#A80000; --ws-red-soft:#E3B5B5;
  --ws-white:#FFFFFF; --ws-off-white:#F5F4F0;
  --ws-gray-light:#EBEBEB; --ws-gray-mid:#6E6E6E;
  --ws-text-muted:rgba(255,255,255,.62); --ws-text-dim:rgba(255,255,255,.50);
  --ws-border-dark:rgba(255,255,255,.08); --ws-border-light:rgba(15,16,20,.10);
  --ws-success:#2E7D32; --ws-warning:#B26A00;

  /* type */
  /* The "Fallback" faces are metric-adjusted local fonts (base.css) so swapping in the web font causes no layout shift. */
  --ws-font-display:'Bebas Neue','Bebas Neue Fallback','Arial Narrow',Impact,sans-serif;
  --ws-font-body:'Cabin','Cabin Fallback','Helvetica Neue',Arial,sans-serif;
  --ws-fs-hero:clamp(58px,7.5vw,108px); --ws-fs-h1:clamp(48px,6vw,84px);
  --ws-fs-h2:clamp(36px,4.2vw,60px);   --ws-fs-h3:clamp(26px,2.6vw,36px);
  --ws-fs-stat:clamp(56px,6vw,96px);   --ws-fs-lead:clamp(18px,1.4vw,22px);
  --ws-fs-body:17px; --ws-fs-small:14px; --ws-fs-eyebrow:11px;

  /* space */
  --ws-space-1:8px; --ws-space-2:16px; --ws-space-3:24px; --ws-space-4:32px;
  --ws-space-5:48px; --ws-space-6:64px; --ws-space-7:88px; --ws-space-8:120px;

  /* shape and motion */
  --ws-radius:0; --ws-radius-chip:2px; --ws-radius-avatar:50%;
  --ws-ease:200ms ease-out; --ws-wrap:1440px;
  --ws-nav-h:72px;
}
@media (max-width:575.98px){ :root{ --ws-fs-body:16px; --ws-nav-h:64px; } }