:root {
  --xds-font-family: "Suisse Intl", "DM Sans", sans-serif;
  --xds-font-weight-regular: 400;
  --xds-font-weight-medium: 500;
  --xds-font-weight-semibold: 600;
  --xds-letter-body: -0.01em;
  --xds-letter-heading: -0.04em;
  --xds-letter-display: -0.055em;
}

html,
body {
  font-family: var(--xds-font-family) !important;
  font-synthesis: none;
  text-rendering: geometricPrecision;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body,
input,
textarea,
select,
button {
  font-family: var(--xds-font-family) !important;
}

:where(h1, h2, h3, h4, h5, h6) {
  font-family: var(--xds-font-family) !important;
  font-weight: var(--xds-font-weight-medium) !important;
  letter-spacing: var(--xds-letter-heading) !important;
}

:where(p, li, dt, dd, blockquote, figcaption, small, span) {
  font-family: var(--xds-font-family) !important;
  font-weight: inherit;
  letter-spacing: var(--xds-letter-body) !important;
}

:where(a, button, input, textarea, select, label, summary) {
  font-family: var(--xds-font-family) !important;
  letter-spacing: var(--xds-letter-body) !important;
}

:where(button, .button, .x-button, [class*="button"], [class*="Button"]) {
  font-weight: var(--xds-font-weight-semibold) !important;
}

:where(nav, header, footer, .xds-nav) :where(a, button, span, li) {
  font-family: var(--xds-font-family) !important;
  font-weight: var(--xds-font-weight-medium) !important;
}

:where(
  .x-home-video__title,
  .x-home-sub-banner__title,
  .x-home-sub-banner__title--mobile,
  .product__title,
  .main-page-title,
  .article-template__title,
  .collection-hero__title,
  .banner__heading
) {
  font-weight: var(--xds-font-weight-medium) !important;
  letter-spacing: var(--xds-letter-display) !important;
}

:where(
  .price,
  .price-item,
  .product-form__submit,
  .shopify-payment-button__button,
  .cart__checkout-button
) {
  font-weight: var(--xds-font-weight-semibold) !important;
  letter-spacing: var(--xds-letter-body) !important;
}

:where(.rte, .rte p, .article-template__content, .article-template__content p) {
  font-family: var(--xds-font-family) !important;
  font-weight: var(--xds-font-weight-regular) !important;
  letter-spacing: var(--xds-letter-body) !important;
}
