@import url("https://use.typekit.net/xxg4dqg.css");
:root {
  /* Original theme name: sublime patterns blue */
  /* Original SCSS colors:
     $label-primary: #428bca;
     $text-details: #727295;
     $theme-color: #487294;
     $theme-color-semi-trans: #ccc;
     $theme-button-color: #487294;
     $link-color: #487294;
     $success-color: #27ae60;
     $danger-color: #e74c3c;
     $warning-color: #f39c12;
     $info-color: #3498db;
     $site-header-color: #fff;
     $site-header-font-color: #444;
     $site-header-font-color-hover: $link-color;
     $border-radius: 3px;
     $h1-font-size: 50px;
     $h2-font-size: 37px;
     $h3-font-size: 28px;
     $h4-font-size: 21px;
     $h5-font-size: 16px;
     $h6-font-size: 13px;
  */
  /* Potential issues / skipped variables:
     - $feature-color / --feature-color was not provided in the original SCSS input and has been skipped.
     - $anchor-font-color-hover / --link-color-hover was not provided in the original SCSS input and has been skipped.
  */
  /* === Primary Color Palette (#487294) === */
  --color-primary: #487294;
  --color-primary-100: #edf3f8;
  --color-primary-200: #cfe0e9;
  --color-primary-300: #a5c3d5;
  --color-primary-400: #7ba5bf;
  --color-primary-500: #5b8ba8;
  --color-primary-600: #487294;
  --color-primary-700: #355877;
  --color-primary-800: #233e59;
  --color-primary-900: #12233b;
  /* === Success Color Palette (#27ae60) === */
  --color-success: #27ae60;
  --color-success-100: #eafaf1;
  --color-success-200: #c8f2d7;
  --color-success-300: #98e4b5;
  --color-success-400: #65d491;
  --color-success-500: #3bc374;
  --color-success-600: #27ae60;
  --color-success-700: #1e874a;
  --color-success-800: #156034;
  --color-success-900: #0b381e;
  /* === Danger Color Palette (#e74c3c) === */
  --color-danger: #e74c3c;
  --color-danger-100: #fdedec;
  --color-danger-200: #fadbd8;
  --color-danger-300: #f5b7b1;
  --color-danger-400: #f1948a;
  --color-danger-500: #ec7063;
  --color-danger-600: #e74c3c;
  --color-danger-700: #b93c30;
  --color-danger-800: #8b2d24;
  --color-danger-900: #5c1e18;
  /* === Warning Color Palette (#f39c12) === */
  --color-warning: #f39c12;
  --color-warning-100: #fef5e7;
  --color-warning-200: #fdebd0;
  --color-warning-300: #f9d5a5;
  --color-warning-400: #f7c078;
  --color-warning-500: #f5ab40;
  --color-warning-600: #f39c12;
  --color-warning-700: #c27d0e;
  --color-warning-800: #925e0a;
  --color-warning-900: #613f07;
  /* === Info Color Palette (#3498db) === */
  --color-info: #3498db;
  --color-info-100: #ebf5fb;
  --color-info-200: #d4e6f1;
  --color-info-300: #a9cce3;
  --color-info-400: #7fb3d5;
  --color-info-500: #5499c7;
  --color-info-600: #3498db;
  --color-info-700: #2874a6;
  --color-info-800: #1f577f;
  --color-info-900: #153a55;
  /* === Mapped Theme Variables === */
  --label-primary: #428bca;
  --text-details: #727295;
  --heading-color: #203e58;
  --theme-button-color: var(--color-primary);
  --theme-button-color-hover: var(--color-primary-700);
  --link-color: var(--color-primary);
  --site-header-color: #fff;
  --site-header-font-color: #444;
  --site-header-font-color-hover: var(--link-color);
  /* === Typography & Layout Variables === */
  --header-font-family: "prenton-display", helvetica, arial, sans-serif;
  --subheading-font-family: "jaf-domus-titling-web", helvetica, arial, sans-serif;
  --body-font-family: "helvetica neue", helvetica, arial, sans-serif;
  --border-radius: 3px;
  --h1-font-size: 50px;
  --h2-font-size: 37px;
  --h3-font-size: 28px;
  --h4-font-size: 21px;
  --h5-font-size: 16px;
  --h6-font-size: 13px;
}

.tile h3, .tile h4, .tile .heading-3, .tile .heading-4 {
    font-family: "jaf-domus-titling-web", helvetica, arial, sans-serif;
}