/* 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: Light and Bright. The showroom in daylight.
   - page the grey-white of honed porcelain (#f3f5f6), white sample plates, grout-grey rules
   - their navy #1a4078 is the ink of the buttons and the one deep band; their light blue #5da6db is the closing band
   - Archivo throughout, set wide and heavy for headlines (a face with a width axis, like a tile with a format)
   - square 2px corners: everything here is cut, nothing is moulded */

:root {
  --bg: #f3f5f6;
  --surface: #ffffff;
  --surface-2: #e4e9ed;
  --line: #d3dae0;
  --line-strong: #7a8794;
  --grout: #c5cdd4;

  --text: #12233b;
  --text-2: #4b5a6b;

  --accent: #1a4078;
  --accent-deep: #12305c;
  --accent-text: #1a4078;
  --accent-soft: rgba(26, 64, 120, 0.1);
  --on-accent: #ffffff;
  --brand-deep: #1a4078;

  --dark-bg: #12233b;
  --dark-text: #f3f5f6;
  --dark-text-2: #aab6c4;

  --band-bg: #1a4078;
  --band-surface: #23508f;
  --band-text: #ffffff;
  --band-text-2: #cbdaec;
  --band-line: rgba(255, 255, 255, 0.22);
  --band-accent: #9fd0f3;

  --invite-bg: #5da6db;
  --invite-text: #0c2347;
  --invite-btn: #12233b;
  --invite-btn-text: #ffffff;

  --font-display: 'Archivo', 'Arial Narrow', sans-serif;
  --font-body: 'Archivo', system-ui, sans-serif;
  --font-eyebrow: 'Archivo', sans-serif;
  --display-weight: 700;
  --display-tracking: -0.025em;
  --display-transform: none;
  --display-size: 4.4rem;
  --h1-size: 3.4rem;
  --h2-size: 2.5rem;
  --h3-size: 1.35rem;
  --body-size: 1.0625rem;
  --lead-size: 1.2rem;
  --eyebrow-size: 0.9rem;
  --eyebrow-tracking: 0;
  --eyebrow-transform: none;
  --btn-size: 0.98rem;
  --btn-tracking: 0;
  --btn-transform: none;
  --btn-pad: 15px 26px;

  --radius-control: 2px;
  --radius-card: 2px;
  --radius-image: 2px;
  --gutter: 24px;
  --gap: 24px;
  --gap-lg: 64px;
  --section-pad: clamp(72px, 9vw, 128px);
  --content-max: 1180px;
  --content-max-wide: 1440px;

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

  --hero-scrim: linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.1) 60%, rgba(0, 0, 0, 0) 100%);
}

h1,
h2,
.h1,
.h2,
.display,
.hw-title,
.wl-lead,
.as-phone {
  font-stretch: 114%;
}
h3,
.h3,
.mt-name {
  font-stretch: 106%;
}
.band .ap-label,
.band .wl-small {
  color: var(--band-accent);
}
.band .btn-primary {
  background: #fff;
  color: var(--brand-deep);
}
.band {
  --accent-text: var(--band-accent);
}