@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&family=Barlow+Condensed:ital,wght@0,600;0,800;0,900;1,800;1,900&family=Jura:wght@400;500;700&family=Inter:wght@400;500&display=swap');

@font-face {
  font-family: 'Octosquares';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('/assets/fonts/TT_Octosquares_ExtraBold.ttf') format('truetype');
}
@font-face {
  font-family: 'Octosquares';
  font-style: italic;
  font-weight: 800;
  font-display: swap;
  src: url('/assets/fonts/TT_Octosquares_ExtraBold_Italic.ttf') format('truetype');
}
@font-face {
  font-family: 'Octosquares';
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src: url('/assets/fonts/TT_Octosquares_ExtraLight.ttf') format('truetype');
}
@font-face {
  font-family: 'Octosquares';
  font-style: italic;
  font-weight: 200;
  font-display: swap;
  src: url('/assets/fonts/TT_Octosquares_ExtraLight_Italic.ttf') format('truetype');
}

:root {
  --black:              #0a0a0a;
  --steel:              #131619;
  --steel-mid:          #1a1e24;
  --steel-lt:           #252b35;
  --white:              #f4f4f2;
  --offwhite:           #c8ccd4;
  --teal:               #009ada;
  --teal-dim:           #007ab8;
  --teal-glow:          rgba(0,154,218,0.12);
  --steel-accent:       #009ada;
  --steel-accent-glow:  rgba(0,154,218,0.12);
  --red:                #e83a3a;
  --border:             rgba(255,255,255,0.07);
  --font-head:          'Octosquares', 'Barlow Condensed', sans-serif;
  --font-body:          'Jura', 'Inter', sans-serif;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  background: var(--black);
  color: var(--white);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.6;
  overflow-x: hidden;
}

img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }

h1, h2, h3,
.nav-logo,
.btn,
.tag,
.why-card h3,
.job-title,
.pay-label,
.section-head h2,
.apply-copy h2,
.form-card h3,
.hero h1,
.footer-logo {
  text-transform: uppercase !important;
}

h1, h2, h3,
.section-head h2,
.apply-copy h2,
.form-card h3,
.why-card h3,
.footer-logo,
.nav-logo,
.tag,
.job-title,
.pay-label {
  letter-spacing: -0.04em;
  font-weight: 200;
}

.btn, a.btn, button.btn {
  font-weight: 800 !important;
  letter-spacing: -0.02em;
}