/* Innovator Designs, Inc.: brand style sheet
   Colours, type, spacing and shape for the whole site, in one file.
   Change a value here and it changes everywhere.
   Generated by John Kaplar (johnkaplar.ai) from the original site and the chosen design. */

/* Theme: Your Brand, Modernized. The identity of Innovator Designs as it is.
   - white page and grey body text, as on the old site
   - navy #1a4078 for headings and the product tiles; light blue #5da6db on buttons and rules
   - PT Sans for headlines and body, PT Sans Narrow in capitals for the menu, exactly their faces
   - square corners from their buttons; charcoal footer from theirs
   (the scaffold's guess of a black page and Manrope was wrong for this site and is replaced here) */

:root {
  --bg: #ffffff;
  --surface: #f4f7fa;
  --surface-2: #e8eef4;
  --line: #d8d8d8;
  --line-strong: #8a9299;

  --text: #40474b;
  --text-2: #696f71;
  --heading: #1a4078;

  --accent: #5da6db;
  --accent-deep: #2f7fbd;
  --accent-text: #2573b3;
  --accent-soft: rgba(93, 166, 219, 0.14);
  --on-accent: #0c2347;
  --brand-deep: #1a4078;
  --grout: #d8d8d8;

  --dark-bg: #2b2b2b;
  --dark-text: #ffffff;
  --dark-text-2: #bfbfbf;

  --band-bg: #eef4fa;
  --band-surface: #ffffff;
  --band-text: #40474b;
  --band-text-2: #696f71;
  --band-line: #cfdcea;
  --band-accent: #5da6db;

  --invite-bg: #1a4078;
  --invite-text: #ffffff;
  --invite-btn: #5da6db;
  --invite-btn-text: #0c2347;

  --font-display: 'PT Sans', 'Trebuchet MS', sans-serif;
  --font-body: 'PT Sans', 'Trebuchet MS', sans-serif;
  --font-eyebrow: 'PT Sans', sans-serif;
  --font-ui: 'PT Sans Narrow', 'PT Sans', sans-serif;
  --display-weight: 400;
  --display-tracking: 0;
  --display-transform: none;
  --display-size: 3.9rem;
  --h1-size: 3rem;
  --h2-size: 2.25rem;
  --h3-size: 1.35rem;
  --body-size: 1.0625rem;
  --lead-size: 1.2rem;
  --eyebrow-size: 0.95rem;
  --eyebrow-tracking: 0;
  --eyebrow-transform: none;
  --btn-size: 1.02rem;
  --btn-tracking: 0.06em;
  --btn-transform: uppercase;
  --btn-pad: 13px 26px;

  --radius-control: 0px;
  --radius-card: 0px;
  --radius-image: 0px;
  --gutter: 24px;
  --gap: 24px;
  --gap-lg: 60px;
  --section-pad: clamp(64px, 8vw, 112px);
  --content-max: 1160px;
  --content-max-wide: 1400px;

  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --reveal-duration: 600ms;

  --hero-scrim: linear-gradient(to top, rgba(12, 30, 62, 0.86) 0%, rgba(12, 30, 62, 0.35) 52%, rgba(22, 55, 104, 0.5) 100%);
}

/* Their navy headings; white wherever the ground is dark. */
main :where(h1, h2, h3) {
  color: var(--heading);
}
.hero-overlay,
.as,
.site-footer,
.cta-band {
  --heading: #ffffff;
}
p a {
  color: var(--accent-text);
}
/* Their menu: PT Sans Narrow, capitals, a little tracking. */
.desktop-nav,
.mobile-nav a:not(.btn) {
  font-family: 'PT Sans Narrow', 'PT Sans', sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 1.05rem;
}
.site-header.transparent:not(.scrolled) {
  background: rgba(22, 55, 104, 0.42);
}
.hero-overlay .eyebrow-light {
  color: #bfe0f7;
  font-weight: 700;
}