/* Virtarix Sans (showcase production font) */
@font-face {
    font-family: 'Virtarix Sans';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(../fonts/virtarix-sans/virtarix-sans-400-normal.woff2) format('woff2');
}

@font-face {
    font-family: 'Virtarix Sans';
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: url(../fonts/virtarix-sans/virtarix-sans-400-italic.woff2) format('woff2');
}

@font-face {
    font-family: 'Virtarix Sans';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url(../fonts/virtarix-sans/virtarix-sans-500-normal.woff2) format('woff2');
}

@font-face {
    font-family: 'Virtarix Sans';
    font-style: italic;
    font-weight: 500;
    font-display: swap;
    src: url(../fonts/virtarix-sans/virtarix-sans-500-italic.woff2) format('woff2');
}

@font-face {
    font-family: 'Virtarix Sans';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url(../fonts/virtarix-sans/virtarix-sans-600-normal.woff2) format('woff2');
}

@font-face {
    font-family: 'Virtarix Sans';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(../fonts/virtarix-sans/virtarix-sans-700-normal.woff2) format('woff2');
}

/* Virtarix public design tokens.
 * Canonical runtime owner for --vtx-* and font-family CSS variables.
 * Enqueued before generated Tailwind CSS and style.css.
 */

:root {
    color-scheme: light;
    --vtx-white: #ffffff;
    --vtx-black: #000000;
    --vtx-heading: #252525;
    --vtx-copy: #2c2e31;
    --vtx-text-secondary: #5d5d5d;
    --vtx-surface-secondary: #f9f9f9;
    --vtx-font-size-h1: 44px;
    --vtx-line-height-h1: 52px;
    --vtx-font-weight-h1: 400;
    --vtx-letter-spacing-h1: 0;
    --vtx-font-size-h1-mobile: 38px;
    --vtx-line-height-h1-mobile: 44px;
    --vtx-font-weight-h1-mobile: 400;
    --vtx-letter-spacing-h1-mobile: 0;
    --vtx-font-size-h2: 34px;
    --vtx-line-height-h2: 44px;
    --vtx-font-weight-h2: 400;
    --vtx-letter-spacing-h2: 0;
    --vtx-font-size-h2-mobile: 30px;
    --vtx-line-height-h2-mobile: 38px;
    --vtx-font-weight-h2-mobile: 400;
    --vtx-letter-spacing-h2-mobile: 0;
    --vtx-font-size-h3: 28px;
    --vtx-line-height-h3: 40px;
    --vtx-font-weight-h3: 500;
    --vtx-letter-spacing-h3: 0;
    --vtx-font-size-h3-mobile: 24px;
    --vtx-line-height-h3-mobile: 32px;
    --vtx-font-weight-h3-mobile: 500;
    --vtx-letter-spacing-h3-mobile: 0;
    --vtx-font-size-h3-card-title: 20px;
    --vtx-line-height-h3-card-title: 26px;
    --vtx-font-weight-h3-card-title: 500;
    --vtx-letter-spacing-h3-card-title: 0;
    --vtx-font-size-h4: 20px;
    --vtx-line-height-h4: 26px;
    --vtx-font-weight-h4: 500;
    --vtx-letter-spacing-h4: 0;
    --vtx-font-size-h5: 18px;
    --vtx-line-height-h5: 24px;
    --vtx-font-weight-h5: 500;
    --vtx-letter-spacing-h5: 0;
    --vtx-font-size-body: 16px;
    --vtx-line-height-body: 28px;
    --vtx-line-height-table-heading: 22px;
    --vtx-font-weight-table-heading: 400;
    --vtx-font-weight-body: 400;
    --vtx-letter-spacing-body: 0.18px;
    --vtx-font-size-small: 14px;
    --vtx-line-height-small: 18px;
    --vtx-font-weight-small: 400;
    --vtx-letter-spacing-small: 0;
    --vtx-font-size-kicker: 12px;
    --vtx-line-height-kicker: 1;
    --vtx-font-weight-kicker: 400;
    --vtx-letter-spacing-kicker: 0;
    --vtx-kicker-padding-x: 0.625rem;
    --vtx-kicker-padding-y: 0.25rem;
    --vtx-font-size-button: 14px;
    --vtx-line-height-button: 1;
    --vtx-height-button: 2.5rem;
    --vtx-font-weight-button: 500;
    --vtx-letter-spacing-button: -0.16px;
    --vtx-button-padding-x: 18.62px;
    --vtx-button-padding-y: 0;
    --vtx-button-gap: 6px;
    --vtx-button-radius: 999px;
    --vtx-button-icon-size: 1.125rem;
    --vtx-font-size-price: 2.8rem;
    --vtx-line-height-price: 1;
    --vtx-font-weight-price: 400;
    --vtx-letter-spacing-price: 0;
    --vtx-font-size-display-number: 64px;
    --vtx-line-height-display-number: 1;
    --vtx-font-weight-display-number: 800;
    --vtx-letter-spacing-display-number: 0;
    --vtx-font-size-eyebrow: 11px;
    --vtx-line-height-eyebrow: 16px;
    --vtx-font-weight-eyebrow: 600;
    --vtx-letter-spacing-eyebrow: 0.18em;
    --vtx-font-size-micro: 10px;
    --vtx-line-height-micro: 12px;
    --vtx-font-weight-micro: 400;
    --vtx-letter-spacing-micro: 0.08em;
    --vtx-font-size-caption: 13px;
    --vtx-line-height-caption: 18px;
    --vtx-font-weight-caption: 400;
    --vtx-letter-spacing-caption: 0;
    --vtx-font-size-xs: 12px;
    --vtx-line-height-xs: 16px;
    --vtx-font-weight-xs: 400;
    --vtx-letter-spacing-xs: 0;
    --vtx-font-size-lg: 18px;
    --vtx-line-height-lg: 28px;
    --vtx-font-weight-lg: 400;
    --vtx-letter-spacing-lg: 0;
    --vtx-font-size-xl: 20px;
    --vtx-line-height-xl: 28px;
    --vtx-font-weight-xl: 400;
    --vtx-letter-spacing-xl: 0;
    --vtx-font-size-5xl: 48px;
    --vtx-line-height-5xl: 1;
    --vtx-font-weight-5xl: 400;
    --vtx-letter-spacing-5xl: 0;
    --vtx-line-height-code-line: 20px;
    --vtx-spacing-h2-bottom: 24px;
    --vtx-primary: #020281;
    --vtx-primary-foreground: var(--vtx-white);
    --vtx-primary-hover: color-mix(in srgb, var(--vtx-primary) 90%, var(--vtx-black));
    --vtx-primary-soft: color-mix(in srgb, var(--vtx-primary) 10%, transparent);
    --vtx-primary-wash: color-mix(in srgb, var(--vtx-primary) 15%, transparent);
    --vtx-primary-border: color-mix(in srgb, var(--vtx-primary) 10%, transparent);
    --vtx-primary-border-strong: color-mix(in srgb, var(--vtx-primary) 20%, transparent);
    --vtx-primary-muted: color-mix(in srgb, var(--vtx-primary) 50%, transparent);
    --vtx-primary-faint: color-mix(in srgb, var(--vtx-primary) 6%, transparent);
    --vtx-primary-connector: color-mix(in srgb, var(--vtx-primary) 28%, transparent);
    --vtx-primary-overlay: color-mix(in srgb, var(--vtx-primary) 96%, transparent);
    --vtx-primary-shadow: color-mix(in srgb, var(--vtx-primary) 16%, transparent);
    --vtx-primary-shadow-hover: color-mix(in srgb, var(--vtx-primary) 50%, transparent);
    --vtx-accent: #fc5186;
    --vtx-accent-hover: color-mix(in srgb, var(--vtx-accent) 84%, var(--vtx-black));
    --vtx-accent-soft: color-mix(in srgb, var(--vtx-accent) 10%, transparent);
    --vtx-accent-wash: color-mix(in srgb, var(--vtx-accent) 20%, transparent);
    --vtx-accent-border: color-mix(in srgb, var(--vtx-accent) 30%, transparent);
    --vtx-accent-shadow: color-mix(in srgb, var(--vtx-accent) 25%, transparent);
    --vtx-accent-shadow-hover: color-mix(in srgb, var(--vtx-accent) 40%, transparent);
    --vtx-success: #007a68;
    --vtx-success-dot: #047857;
    --vtx-success-hover: #006b5b;
    --vtx-success-soft: color-mix(in srgb, var(--vtx-success) 10%, transparent);
    --vtx-success-border: color-mix(in srgb, var(--vtx-success) 28%, transparent);
    --vtx-warning: #b45309;
    --vtx-warning-soft: color-mix(in srgb, var(--vtx-warning) 10%, transparent);
    --vtx-grey: #64748b;
    --vtx-grey-muted: #6c757d;
    --vtx-grey-subtle: #94a3b8;
    --vtx-grey-bg: #f9fafe;
    --vtx-grey-soft: #f8fafc;
    --vtx-grey-surface: #f7f8fa;
    --vtx-grey-panel: #f8f9fa;
    --vtx-grey-border: #e2e8f0;
    --vtx-grey-border-strong: #cbd5e1;
    --vtx-grey-border-soft: #eeeeee;
    --vtx-grey-dark: #1e293b;
    --vtx-action: #1e293b;
    --vtx-proof-border: #dbe2ea;
    --vtx-panel-border: #e0e0e0;
    --vtx-link: #0d6efd;
    --vtx-dark-link: #0a0a2e;
    --vtx-border: #d6dde8;
    --vtx-border-accent: #00b090;
    --vtx-comparison-track: #e8e0f0;
    --vtx-trustpilot: #00B67A;
    --vtx-diagonal-line: #c0c8d4;
    --vtx-code: #f5f2f0;
    --vtx-code-inline-bg: color-mix(in oklab, #0d0d0d 4%, transparent);
    --vtx-code-inline-border: color-mix(in oklab, #0d0d0d 8%, transparent);
    --vtx-code-inline-text: #181818;
    --vtx-code-inline-font-size: 14px;
    --vtx-code-inline-line-height: 24px;
    --vtx-code-inline-font-weight: 400;
    --vtx-code-inline-letter-spacing: 0;
    --vtx-code-inline-radius: .375rem;
    --vtx-code-inline-padding-x: .5rem;
    --vtx-code-inline-padding-y: .125rem;
    --vtx-code-terminal: #06062e;
    --vtx-code-ref: #f7f7f8;
    --vtx-code-ref-start: #f9f9f9;
    --vtx-code-ref-text: #24292e;
    --vtx-code-ref-command: #6F42C1;
    --vtx-code-ref-string: #032F62;
    --vtx-code-ref-option: #005CC5;
    --vtx-code-ref-comment: #6A737D;
    --vtx-code-ref-hover: color-mix(in srgb, var(--vtx-black) 12%, transparent);
    --vtx-shadow-proof: rgba(15,23,42,0.55);
    --vtx-shadow-trust: rgba(15,23,42,0.45);
    --vtx-shadow-nav: rgba(0,0,0,0.1);
    --vtx-shadow-nav-hover: rgba(0,0,0,0.2);
    --vtx-shadow-float: rgba(15,23,42,0.08);
    --vtx-shadow-form-soft: rgba(10,14,29,0.02);
    --vtx-shadow-form: rgba(10,14,29,0.08);
    --vtx-comparison-low: #16a34a;
    --vtx-comparison-soft-blue: #93c5fd;
    --vtx-comparison-blue: #2563eb;
    --vtx-comparison-green-1: #138c52;
    --vtx-comparison-green-2: #10755a;
    --vtx-comparison-green-3: #0d5e62;
    --vtx-comparison-green-4: #0b4769;
    --vtx-comparison-green-5: #083071;
    --vtx-comparison-green-6: #051979;
    --vtx-comparison-green-7: #128355;
    --vtx-comparison-green-8: #0e6360;
    --vtx-comparison-green-9: #0a426b;
    --vtx-comparison-green-10: #062276;
    --vtx-comparison-green-11: #138853;
    --vtx-comparison-green-12: #0f6d5c;
    --vtx-comparison-green-13: #0c5366;
    --vtx-comparison-green-14: #09386f;
    --vtx-comparison-green-15: #051d78;
    --font-family-poppins: "Virtarix Sans", sans-serif;
    --font-family-virtarix-sans: "Virtarix Sans", "Mona Sans", sans-serif;
    --font-family-mona-mono: "Mona Sans Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}