@font-face {
  font-family: "IRANSansX";
  src: url("./fonts/IRANSansX-Regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "IRANSansX";
  src: url("./fonts/IRANSansX-Bold.woff2") format("woff2");
  font-style: normal;
  font-weight: 700 900;
  font-display: swap;
}

:root {
  --font-fa: "IRANSansX", Tahoma, Arial, sans-serif;
}

html,
body,
button,
input,
textarea,
select {
  font-family: var(--font-fa);
}

body {
  font-weight: 400;
  font-feature-settings: "kern" 1, "liga" 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

b,
strong,
h1,
h2,
h3,
h4,
h5,
h6,
.header-action,
.primary,
.product-link,
.access-actions a,
.eyebrow,
.product-label {
  font-weight: 700;
}

.hero h1 {
  line-height: 1.38;
  letter-spacing: -2.1px;
}

.section-intro h2,
.product h3,
.experience h2 {
  line-height: 1.5;
  letter-spacing: -1.25px;
}

.hero-copy > p,
.section-intro p,
.product-copy > p,
.experience-copy > p {
  line-height: 2.15;
}

.lux-word,
.principles article > span,
.footer-links a,
.app-icon,
.vehicle,
.dash-stat,
.fleet-metric strong,
.signal-bar strong {
  font-family: var(--font-fa);
}

@media (max-width: 720px) {
  .hero h1 {
    line-height: 1.48;
    letter-spacing: -1px;
  }

  .section-intro h2,
  .product h3,
  .experience h2 {
    line-height: 1.55;
    letter-spacing: -.65px;
  }
}