/* Marathon Creative tokens.css, v1.0.0.
   GENERATED by build.py from tokens.json. Do not edit by hand, edit tokens.json and rebuild.
   Copy this file and fonts/ into the app. Never hotlink it from another Marathon app.
   Components reference semantic tokens. A hex typed into a component is a defect. */

@font-face {
  font-family: "Montserrat";
  src: url("fonts/Montserrat-VariableFont_wght.ttf") format("truetype");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root {

  /* Colour, primitive tier. Raw palette. Components do not use these directly. */
  --mc-navy-100: #102228;  /* Marathon Navy */
  --mc-navy-soft: #1f3540;  /* Navy Soft */
  --mc-red-100: #9d1c24;  /* Marathon Red */
  --mc-red-shade: #7d161c;  /* Red Shade */
  --mc-red-tint: #fef0f0;  /* Red Tint */
  --mc-charcoal: #1a1a1a;  /* Charcoal */
  --mc-slate-700: #3a4452;  /* Slate 700 */
  --mc-slate-500: #6b7684;  /* Slate 500 */
  --mc-gray-300: #c7cdd5;  /* Gray 300 */
  --mc-gray-200: #e1e5eb;  /* Gray 200 */
  --mc-gray-100: #f4f6f9;  /* Gray 100 */
  --mc-gray-50: #fafbfc;  /* Gray 50 */
  --mc-white: #ffffff;  /* White */
  --mc-green: #2f7d53;  /* Status Green */
  --mc-amber: #b8862b;  /* Status Amber */
  --mc-navy-100-rgb: 16 34 40;  /* channels for alpha use, derived */
  --mc-navy-soft-rgb: 31 53 64;  /* channels for alpha use, derived */
  --mc-red-100-rgb: 157 28 36;  /* channels for alpha use, derived */
  --mc-red-shade-rgb: 125 22 28;  /* channels for alpha use, derived */
  --mc-red-tint-rgb: 254 240 240;  /* channels for alpha use, derived */
  --mc-charcoal-rgb: 26 26 26;  /* channels for alpha use, derived */
  --mc-slate-700-rgb: 58 68 82;  /* channels for alpha use, derived */
  --mc-slate-500-rgb: 107 118 132;  /* channels for alpha use, derived */
  --mc-gray-300-rgb: 199 205 213;  /* channels for alpha use, derived */
  --mc-gray-200-rgb: 225 229 235;  /* channels for alpha use, derived */
  --mc-gray-100-rgb: 244 246 249;  /* channels for alpha use, derived */
  --mc-gray-50-rgb: 250 251 252;  /* channels for alpha use, derived */
  --mc-white-rgb: 255 255 255;  /* channels for alpha use, derived */
  --mc-green-rgb: 47 125 83;  /* channels for alpha use, derived */
  --mc-amber-rgb: 184 134 43;  /* channels for alpha use, derived */

  /* Colour, semantic tier. Components use these. */
  --mc-text-primary: var(--mc-charcoal);
  --mc-text-heading: var(--mc-navy-100);
  --mc-text-secondary: var(--mc-slate-700);
  --mc-text-tertiary: var(--mc-slate-500);
  --mc-text-disabled: var(--mc-gray-300);
  --mc-text-label: var(--mc-red-100);
  --mc-text-link: var(--mc-navy-100);
  --mc-text-link-hover: var(--mc-red-100);
  --mc-text-inverse: var(--mc-white);
  --mc-text-inverse-secondary: rgb(var(--mc-white-rgb) / 0.78);
  --mc-text-inverse-tertiary: rgb(var(--mc-white-rgb) / 0.6);
  --mc-text-on-accent: var(--mc-white);
  --mc-surface-page: var(--mc-white);
  --mc-surface-raised: var(--mc-white);
  --mc-surface-subtle: var(--mc-gray-50);
  --mc-surface-muted: var(--mc-gray-100);
  --mc-surface-row-alt: var(--mc-gray-50);
  --mc-surface-row-alt-print: var(--mc-gray-100);
  --mc-surface-inverse: var(--mc-navy-100);
  --mc-surface-inverse-raised: var(--mc-navy-soft);
  --mc-surface-highlight: var(--mc-red-tint);
  --mc-surface-table-header: var(--mc-red-100);
  --mc-border-subtle: var(--mc-gray-200);
  --mc-border-strong: var(--mc-gray-300);
  --mc-border-inverse: rgb(var(--mc-white-rgb) / 0.25);
  --mc-border-accent: var(--mc-red-100);
  --mc-border-focus: var(--mc-navy-100);
  --mc-border-focus-inverse: var(--mc-white);
  --mc-accent: var(--mc-red-100);
  --mc-accent-hover: var(--mc-red-shade);
  --mc-accent-on-inverse: #c4262f;  /* the ONLY home of Red Bright, red accent on navy only */
  --mc-action-primary: var(--mc-navy-100);
  --mc-action-primary-hover: var(--mc-navy-soft);
  --mc-action-primary-text: var(--mc-white);
  --mc-action-secondary-border: var(--mc-navy-100);
  --mc-action-secondary-hover: var(--mc-gray-100);
  --mc-action-inverse: var(--mc-white);
  --mc-action-inverse-text: var(--mc-navy-100);
  --mc-status-success: var(--mc-green);
  --mc-status-warning: var(--mc-amber);
  --mc-status-error: var(--mc-red-100);
  --mc-status-error-surface: var(--mc-red-tint);
  --mc-status-info: var(--mc-navy-soft);
  --mc-scrim-photo: rgb(var(--mc-navy-100-rgb) / 0.64);
  --mc-scrim-photo-strong: rgb(var(--mc-navy-100-rgb) / 0.82);
  --mc-scrim-photo-clear: rgb(var(--mc-navy-100-rgb) / 0);
  --mc-data-1: var(--mc-navy-100);
  --mc-data-2: var(--mc-slate-500);
  --mc-data-3: var(--mc-gray-300);
  --mc-data-4: var(--mc-navy-soft);
  --mc-data-highlight: var(--mc-red-100);
  --mc-data-gridline: var(--mc-gray-200);
  --mc-data-axis: var(--mc-slate-500);

  /* Colour, legacy names shipped in brand.css. Kept so the existing header keeps working. */
  --mc-navy: var(--mc-navy-100);
  --mc-navy-l: var(--mc-navy-soft);
  --mc-red: var(--mc-red-100);
  --mc-red-d: var(--mc-red-shade);
  --mc-ink: var(--mc-charcoal);
  --mc-grey: var(--mc-slate-700);
  --mc-grey-l: var(--mc-slate-500);
  --mc-rule: var(--mc-gray-200);
  --mc-paper: var(--mc-white);
  --mc-wash: var(--mc-gray-100);
  --mc-safe-top: env(safe-area-inset-top, 0px);  /* shipped in brand.css */

  /* Typeface. Montserrat only. */
  --mc-font: "Montserrat", system-ui, -apple-system, sans-serif;
  --mc-weight-light: 300;
  --mc-weight-regular: 400;
  --mc-weight-semibold: 600;
  --mc-weight-bold: 700;
  --mc-weight-extrabold: 800;
  --mc-weight-black: 900;
  --mc-numeric-tabular: tabular-nums;
  --mc-numeric-proportional: proportional-nums;

  /* Type roles. Screen sizes in px, print sizes in pt under --mc-print-type-*. */
  --mc-type-cover-size: clamp(44px, 32.40px + 3.094vw, 72px);
  --mc-type-cover-weight: var(--mc-weight-black);
  --mc-type-cover-leading: 1.0;
  --mc-type-cover-tracking: -0.025em;
  --mc-type-cover-case: none;
  --mc-type-h1-size: clamp(32px, 25.37px + 1.768vw, 48px);
  --mc-type-h1-weight: var(--mc-weight-extrabold);
  --mc-type-h1-leading: 1.1;
  --mc-type-h1-tracking: -0.02em;
  --mc-type-h1-case: none;
  --mc-type-h2-size: clamp(24px, 20.69px + 0.884vw, 32px);
  --mc-type-h2-weight: var(--mc-weight-bold);
  --mc-type-h2-leading: 1.2;
  --mc-type-h2-tracking: -0.015em;
  --mc-type-h2-case: none;
  --mc-type-h3-size: 20px;
  --mc-type-h3-weight: var(--mc-weight-bold);
  --mc-type-h3-leading: 1.3;
  --mc-type-h3-tracking: 0;
  --mc-type-h3-case: none;
  --mc-type-lede-size: 20px;
  --mc-type-lede-weight: var(--mc-weight-light);
  --mc-type-lede-leading: 1.5;
  --mc-type-lede-tracking: 0;
  --mc-type-lede-case: none;
  --mc-type-body-size: 16px;
  --mc-type-body-weight: var(--mc-weight-regular);
  --mc-type-body-leading: 1.55;
  --mc-type-body-tracking: 0;
  --mc-type-body-case: none;
  --mc-type-small-size: 14px;
  --mc-type-small-weight: var(--mc-weight-regular);
  --mc-type-small-leading: 1.5;
  --mc-type-small-tracking: 0;
  --mc-type-small-case: none;
  --mc-type-eyebrow-size: 12px;
  --mc-type-eyebrow-weight: var(--mc-weight-bold);
  --mc-type-eyebrow-leading: 1.2;
  --mc-type-eyebrow-tracking: 0.2em;
  --mc-type-eyebrow-case: uppercase;
  --mc-type-caption-size: 13px;
  --mc-type-caption-weight: var(--mc-weight-semibold);
  --mc-type-caption-leading: 1.4;
  --mc-type-caption-tracking: 0;
  --mc-type-caption-case: none;
  --mc-type-stat-size: 48px;
  --mc-type-stat-weight: var(--mc-weight-extrabold);
  --mc-type-stat-leading: 1.0;
  --mc-type-stat-tracking: -0.02em;
  --mc-type-stat-case: none;
  --mc-type-appname-size: 11px;
  --mc-type-appname-weight: var(--mc-weight-bold);
  --mc-type-appname-leading: 1.2;
  --mc-type-appname-tracking: 0.26em;
  --mc-type-appname-case: uppercase;
  --mc-print-type-cover-size: 56pt;
  --mc-print-type-h1-size: 32pt;
  --mc-print-type-h2-size: 22pt;
  --mc-print-type-h3-size: 14pt;
  --mc-print-type-lede-size: 13pt;
  --mc-print-type-body-size: 10pt;
  --mc-print-type-small-size: 9pt;
  --mc-print-type-eyebrow-size: 8.5pt;
  --mc-print-type-caption-size: 8.5pt;
  --mc-print-type-stat-size: 36pt;
  --mc-print-type-appname-size: 8pt;

  /* Spacing, 4px base. */
  --mc-space-01: 2px;
  --mc-space-02: 4px;
  --mc-space-03: 8px;
  --mc-space-04: 12px;
  --mc-space-05: 16px;
  --mc-space-06: 20px;
  --mc-space-07: 24px;
  --mc-space-08: 32px;
  --mc-space-09: 40px;
  --mc-space-10: 48px;
  --mc-space-11: 64px;
  --mc-space-12: 80px;
  --mc-space-13: 96px;
  --mc-space-14: 128px;

  /* Radius. */
  --mc-radius-none: 0px;
  --mc-radius-sm: 2px;
  --mc-radius-md: 4px;
  --mc-radius-lg: 8px;
  --mc-radius-pill: 999px;

  /* Border widths. */
  --mc-border-width-hairline: 1px;
  --mc-border-width-strong: 2px;
  --mc-border-width-bar: 3px;
  --mc-border-width-divider-length: 60px;

  /* Shadow. Navy tinted, floating things only. */
  --mc-shadow-none: none;
  --mc-shadow-1: 0 1px 2px rgb(var(--mc-navy-100-rgb) / 0.08);
  --mc-shadow-2: 0 4px 12px rgb(var(--mc-navy-100-rgb) / 0.12);
  --mc-shadow-3: 0 12px 32px rgb(var(--mc-navy-100-rgb) / 0.18);
  --mc-focus-ring-width: 2px;
  --mc-focus-ring-offset: 2px;

  /* Layering. */
  --mc-z-base: 0;
  --mc-z-raised: 10;
  --mc-z-dropdown: 100;
  --mc-z-sticky: 200;
  --mc-z-header: 300;
  --mc-z-overlay: 400;
  --mc-z-modal: 500;
  --mc-z-toast: 600;

  /* Document grid, US Letter. */
  --mc-doc-page-width: 8.5in;
  --mc-doc-page-height: 11in;
  --mc-doc-margin-top: 0.75in;
  --mc-doc-margin-side: 0.65in;
  --mc-doc-margin-bottom: 0.85in;
  --mc-doc-footer-offset: 0.4in;
  --mc-doc-columns: 12;
  --mc-doc-gutter: 14pt;
  --mc-doc-divider-width: 60pt;
  --mc-doc-divider-height: 3pt;

  /* Print production. */
  --mc-print-bleed: 0.125in;
  --mc-print-safe: 0.125in;
  --mc-print-tac-coated: 300;
  --mc-print-tac-uncoated: 260;
  --mc-print-min-knockout-pt: 7pt;

  /* Screen layout. */
  --mc-container: 1180px;
  --mc-screen-columns: 12;
  --mc-screen-gutter: 24px;
  --mc-screen-gutter-sm: 16px;
  --mc-screen-margin: 20px;
  --mc-screen-margin-lg: 40px;
  --mc-screen-header-logo: 26px;
  --mc-screen-header-logo-sm: 22px;
  --mc-screen-touch-target: 44px;
  --mc-bp-sm: 420px;  /* reference only, CSS cannot read a variable inside @media */
  --mc-bp-md: 768px;  /* reference only, CSS cannot read a variable inside @media */
  --mc-bp-lg: 1024px;  /* reference only, CSS cannot read a variable inside @media */
  --mc-bp-xl: 1280px;  /* reference only, CSS cannot read a variable inside @media */

  /* Social canvases and safe areas, px. */
  --mc-social-square-w: 1080px;
  --mc-social-square-h: 1080px;
  --mc-social-square-safe-top: 80px;
  --mc-social-square-safe-bottom: 80px;
  --mc-social-square-safe-side: 80px;
  --mc-social-portrait-w: 1080px;
  --mc-social-portrait-h: 1350px;
  --mc-social-portrait-safe-top: 80px;
  --mc-social-portrait-safe-bottom: 120px;
  --mc-social-portrait-safe-side: 80px;
  --mc-social-story-w: 1080px;
  --mc-social-story-h: 1920px;
  --mc-social-story-safe-top: 250px;
  --mc-social-story-safe-bottom: 340px;
  --mc-social-story-safe-side: 80px;
  --mc-social-reel-w: 1080px;
  --mc-social-reel-h: 1920px;
  --mc-social-reel-safe-top: 240px;
  --mc-social-reel-safe-bottom: 420px;
  --mc-social-reel-safe-side: 80px;
  --mc-social-reel-grid-crop-w: 1080px;
  --mc-social-reel-grid-crop-h: 1440px;

  /* Motion. Durations and easing. */
  --mc-duration-instant: 0ms;
  --mc-duration-fast: 120ms;
  --mc-duration-base: 200ms;
  --mc-duration-moderate: 320ms;
  --mc-duration-slow: 480ms;
  --mc-ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --mc-ease-enter: cubic-bezier(0, 0, 0.2, 1);
  --mc-ease-exit: cubic-bezier(0.4, 0, 1, 1);
  --mc-ease-pace: cubic-bezier(0.65, 0, 0.35, 1);
  --mc-video-stagger: 167ms;
  --mc-video-exit: 333ms;
  --mc-video-enter: 500ms;
  --mc-video-bar-sweep: 667ms;
  --mc-video-sting: 2000ms;
  --mc-video-hold-title: 3000ms;
  --mc-video-hold-lower-third: 4000ms;
}

/* Reduced motion. Same names, zero travel time. */
@media (prefers-reduced-motion: reduce) {
  :root {
    --mc-duration-instant: 0ms;
    --mc-duration-fast: 0ms;
    --mc-duration-base: 0ms;
    --mc-duration-moderate: 0ms;
    --mc-duration-slow: 0ms;
  }
}
