/* fyscal Corporate Design, generated from tokens.json */
:root, [data-theme="night"] {
  --bordeaux: #540e1e;
  --bordeaux-deep: #3b0915;
  --night: #0a0a0a;
  --night-raised: #161617;
  --white: #ffffff;
  --silver: #bdbdc3;
  --silver-2: #c9c9ce;
  --steel: #8f8f96;
  --steel-2: #a9a9b0;
  --mist: #f3f3f4;
  --graphite: #4a4a50;
  --graphite-2: #6b6b72;
  --ground: var(--night);
  --raised: var(--night-raised);
  --text: var(--white);
  --text-2: var(--silver);
  --text-3: var(--steel);
  --line: #ffffff1a;
  --line-strong: #ffffff40;
  --accent: var(--white);
  --button: var(--white);
  --on-button: var(--night);
  --button-hover: #e4e4e7;
  --glass: #12121473;
  --glass-frost: #ffffff1f;
  --glass-edge: #ffffff2e;
  --glass-shine: #ffffff99;
  --ui-paper: #ffffff;
  --ui-ink: #0a0a0a;
  --ui-ink-2: #525252;
  --ui-ink-3: #737373;
  --ui-line: #e8e8e8;
  --ui-line-soft: #f0f0f0;
  --ui-line-strong: #d9d9d9;
  --ui-tone: #fafafa;
  --ui-brand: #1d2b4f;
  --ui-green: #15803d;
  --ui-amber: #b45309;
  --ui-red: #b91c1c;
  --shadow-float: 0 1px 2px rgba(0, 0, 0, 0.10), 0 24px 56px -18px rgba(0, 0, 0, 0.55);
  --shadow-glass: 0 30px 80px -32px rgba(0, 0, 0, 0.75), 0 2px 8px rgba(0, 0, 0, 0.18);
  --shadow-chip: 0 12px 32px -12px rgba(0, 0, 0, 0.55);
}
[data-theme="light"] {
  --ground: var(--mist);
  --raised: var(--white);
  --text: var(--night);
  --text-2: var(--graphite);
  --text-3: var(--graphite-2);
  --line: #0a0a0a17;
  --line-strong: #0a0a0a40;
  --accent: var(--bordeaux);
  --button: var(--night);
  --on-button: var(--white);
  --button-hover: var(--bordeaux);
  --glass: #ffffffa6;
}
[data-theme="tapete"] {
  --ground: var(--bordeaux);
  --raised: var(--bordeaux-deep);
  --text: var(--white);
  --text-2: var(--silver-2);
  --text-3: var(--steel-2);
  --line: #ffffff26;
  --line-strong: #ffffff52;
  --accent: var(--white);
  --button: var(--white);
  --on-button: var(--bordeaux);
  --button-hover: #e4e4e7;
  --glass: #2a071073;
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 72px;
  --space-9: 104px;
  --wrap: 1320px;
  --gutter: 64px;
  --section: 144px;
  --section-tight: 88px;
  --r-1: 8px;
  --r-2: 12px;
  --r-3: 20px;
  --r-4: 28px;
  --r-pill: 999px;
  --glass-blur: 26px;
  --glass-saturate: 150%;
  --liquid-blur: 8px;
  --liquid-saturate: 180%;
  --pattern-tile: 220px;
  --pattern-opacity: 0.26;
  --pattern-tile-small: 180px;
  --pattern-opacity-small: 0.22;
  --pattern-tile-strong: 176px;
  --pattern-opacity-strong: 0.9;
  --font-display: "Funnel Display", "Funnel Sans", system-ui, sans-serif;
  --font-sans: "Funnel Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
}
.fs-display-xl { font-family: var(--font-display); font-size: 112px; line-height: 0.94; font-weight: 300; letter-spacing: -0.042em; }
.fs-display-l { font-family: var(--font-display); font-size: 88px; line-height: 0.96; font-weight: 300; letter-spacing: -0.038em; }
.fs-display-m { font-family: var(--font-display); font-size: 60px; line-height: 1.02; font-weight: 300; letter-spacing: -0.032em; }
.fs-heading { font-family: var(--font-display); font-size: 38px; line-height: 1.12; font-weight: 400; letter-spacing: -0.022em; }
.fs-quote { font-family: var(--font-display); font-size: 40px; line-height: 1.18; font-weight: 300; letter-spacing: -0.022em; }
.fs-figure { font-family: var(--font-display); font-size: 88px; line-height: 0.9; font-weight: 300; letter-spacing: -0.045em; }
.fs-title { font-family: var(--font-display); font-size: 22px; line-height: 1.25; font-weight: 500; letter-spacing: -0.012em; }
.fs-wordmark { font-family: var(--font-display); font-size: 22px; line-height: 1; font-weight: 600; letter-spacing: -0.02em; }
.fs-lead { font-family: var(--font-sans); font-size: 20px; line-height: 1.5; font-weight: 400; }
.fs-body { font-family: var(--font-sans); font-size: 17px; line-height: 1.6; font-weight: 400; }
.fs-small { font-family: var(--font-sans); font-size: 15px; line-height: 1.5; font-weight: 400; }
.fs-button { font-family: var(--font-sans); font-size: 15px; line-height: 1; font-weight: 500; }
.fs-eyebrow { font-family: var(--font-sans); font-size: 12px; line-height: 1.2; font-weight: 500; letter-spacing: 0.16em; }
.fs-label { font-family: var(--font-sans); font-size: 12px; line-height: 1.45; font-weight: 500; letter-spacing: 0.12em; }
.ui-body { font-family: var(--font-sans); font-size: 13px; line-height: 1.5; font-weight: 400; }
.ui-strong { font-family: var(--font-sans); font-size: 13px; line-height: 1.5; font-weight: 500; }
.ui-meta { font-family: var(--font-sans); font-size: 11px; line-height: 1.5; font-weight: 500; }
.ui-figure { font-family: var(--font-display); font-size: 28px; line-height: 1; font-weight: 500; letter-spacing: -0.02em; }
@font-face { font-family: "Funnel Display"; src: url("fonts/FunnelDisplay-Light.woff2") format("woff2"); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: "Funnel Display"; src: url("fonts/FunnelDisplay-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Funnel Display"; src: url("fonts/FunnelDisplay-Medium.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Funnel Display"; src: url("fonts/FunnelDisplay-SemiBold.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Funnel Sans"; src: url("fonts/FunnelSans-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Funnel Sans"; src: url("fonts/FunnelSans-Medium.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }