@font-face {
  font-family: "BMWTypeNext";
  src: url("../../fonts/web/bmw/BMWTypeNext-Regular.woff2") format("woff2"),
    url("../../fonts/web/bmw/BMWTypeNext-Regular.woff") format("woff"),
    url("../../fonts/web/bmw/BMWTypeNext-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "BMWTypeNext";
  src: url("../../fonts/web/bmw/BMWTypeNext-Bold.woff2") format("woff2"),
    url("../../fonts/web/bmw/BMWTypeNext-Bold.woff") format("woff"),
    url("../../fonts/web/bmw/BMWTypeNext-Bold.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "BMWTypeNext";
  src: url("../../fonts/web/bmw/BMWTypeNext-Thin.woff2") format("woff2"),
    url("../../fonts/web/bmw/BMWTypeNext-Thin.woff") format("woff"),
    url("../../fonts/web/bmw/BMWTypeNext-Thin.ttf") format("truetype");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "BMWTypeNext";
  src: url("../../fonts/web/bmw/BMWTypeNext-Medium.woff2") format("woff2"),
    url("../../fonts/web/bmw/BMWTypeNext-Medium.woff") format("woff"),
    url("../../fonts/web/bmw/BMWTypeNext-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "BMWTypeNext";
  src: url("../../fonts/web/bmw/BMWTypeNext-Light.woff2") format("woff2"),
    url("../../fonts/web/bmw/BMWTypeNext-Light.woff") format("woff"),
    url("../../fonts/web/bmw/BMWTypeNext-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

:root,[data-theme="light"] {
  /* Custom Colors */
  --primary-500: #0d6efd;
  --primary-700: #0b5b94;
  --gray-100: #f2f2f2;
  --gray-150: #e8e8e8;
  --gray-200: #bbbbbb;
  --gray-300: #52575c;
  --gray-400: #262626;
  --gray-500: #161616;

  /* Background Colors */
  --bg-header: #ffffff;
  --bg-sections: var(--gray-100);

  /* Texts */
  --primary-font: "BMWTypeNext";
  --secondary-font: "BMWTypeNext";

  --text-primary-color: var(--gray-400);
  --text-secondary-color: var(--gray-300);

  /* Header */

  --mainTitle-font-family: var(--primary-font);
  --mainTitle-font-weight: 600;
  --mainTitle-color: var(--gray-400);

  --mainSubtitle-font-family: var(--secondary-font);
  --mainSubtitle-font-weight: 700;
  --mainSubtitle-color: var(--gray-400);

  /* Sections Cards */

  --sectionTitle-font-family: var(--primary-font);
  --sectionTitle-font-size_m: 28px;
  --sectionTitle-font-size_desk: calc(var(--sectionTitle-font-size_m) + 15px);
  --sectionTitle-font-weight: 400;
  --sectionTitle-color: #ffffff;

  --sectionBtn-font-family: var(--secondary-font);
  --sectionBtn-font-weight: 300;
  --sectionBtn-color: #ffffff;
  --sectionBtn-bg: var(--primary-500);
  --sectionBtn-bgHover: var(--primary-700);
}

[data-theme="dark"] {

  /* Texts */
  --text-primary-color: var(--gray-100);
  --text-secondary-color: var(--gray-150);

  /* Header */
  --bg-header: var(--gray-400);
  --mainTitle-color: var(--gray-100);
  --mainSubtitle-color: var(--gray-150);

  /* Sections Cards */
  --bg-sections: var(--gray-500);

}