body {
  margin: 0;
  line-height: normal;
}

:root {
  /* Fonts */
  --text-18: "Space Grotesk";

  /* font sizes - converted to vmax */
  --text-18-size: 0.938vw; /* 18px → 18/1920*100 = 0.938vmax */
  --font-size-5xl: 1.25vmax; /* 24px → 24/1920*100 = 1.25vmax */
  --h4-30px-1920-size: 1.563vmax; /* 30px → 30/1920*100 = 1.563vmax */
  --font-size-17xl: 1.875vmax; /* 36px → 36/1920*100 = 1.875vmax */
  --h2-60px-1920-size: 3.125vmax; /* 60px → 60/1920*100 = 3.125vmax */
  --h1-90px-1920-size: 4.688vmax; /* 90px → 90/1920*100 = 4.688vmax */

  /* Colors */
  --color-darkslategray: #333638;
  --color-gainsboro-100: #e6e6e6;
  --color-gray-100: rgba(255, 255, 255, 0.05);

  /* Gaps - duplicated values converted to vmax and vmin */
  --gap-0: 0vmax 0vmin; /* 0px 0px → 0/1920*100vmax 0/1080*100vmin */
  --gap-3xs: 0.521vmax 0.926vmin; /* 10px 10px → 10/1920*100vmax 10/1080*100vmin */
  --gap-mini: 0.781vmax 1.389vmin; /* 15px 15px → 15/1920*100vmax 15/1080*100vmin */
  --gap-lg: 0.938vmax 1.667vmin; /* 18px 18px → 18/1920*100vmax 18/1080*100vmin */
  --gap-xl: 1.042vmax 1.852vmin; /* 20px 20px → 20/1920*100vmax 20/1080*100vmin */
  --gap-3xl: 1.146vmax 2.037vmin; /* 22px 22px → 22/1920*100vmax 22/1080*100vmin */
  --gap-6xl: 1.302vmax 2.315vmin; /* 25px 25px → 25/1920*100vmax 25/1080*100vmin */
  --gap-11xl: 1.563vmax 2.778vmin; /* 30px 30px → 30/1920*100vmax 30/1080*100vmin */
  --gap-21xl: 2.083vmax 3.704vmin; /* 40px 40px → 40/1920*100vmax 40/1080*100vmin */
  --gap-26xl: 2.344vmax 4.167vmin; /* 45px 45px → 45/1920*100vmax 45/1080*100vmin */
  --gap-31xl: 2.604vmax 4.63vmin; /* 50px 50px → 50/1920*100vmax 50/1080*100vmin */
  --gap-41xl: 3.125vmax 5.556vmin; /* 60px 60px → 60/1920*100vmax 60/1080*100vmin */
  --gap-71xl: 4.688vmax 8.333vmin; /* 90px 90px → 90/1920*100vmax 90/1080*100vmin */
  --gap-81xl: 5.208vmax 9.259vmin; /* 100px 100px → 100/1920*100vmax 100/1080*100vmin */
  --gap-181xl: 10.417vmax 18.519vmin; /* 200px 200px → 200/1920*100vmax 200/1080*100vmin */

  /* Padding X variants (width-based) */
  --padding-x-3xs: 0.521vmax; /* 10px → 10/1920*100 = 0.521vmax */
  --padding-x-mini: 0.781vmax; /* 15px → 15/1920*100 = 0.781vmax */
  --padding-x-base: 0.833vmax; /* 16px → 16/1920*100 = 0.833vmax */
  --padding-x-mid: 0.885vmax; /* 17px → 17/1920*100 = 0.885vmax */
  --padding-x-lg: 0.938vmax; /* 18px → 18/1920*100 = 0.938vmax */
  --padding-x-lgi: 0.99vmax; /* 19px → 19/1920*100 = 0.99vmax */
  --padding-x-xl: 1.042vmax; /* 20px → 20/1920*100 = 1.042vmax */
  --padding-x-9xl: 1.458vmax; /* 28px → 28/1920*100 = 1.458vmax */
  --padding-x-10xl: 1.51vmax; /* 29px → 29/1920*100 = 1.51vmax */
  --padding-x-11xl: 1.563vmax; /* 30px → 30/1920*100 = 1.563vmax */
  --padding-x-20xl: 2.031vmax; /* 39px → 39/1920*100 = 2.031vmax */
  --padding-x-21xl: 2.083vmax; /* 40px → 40/1920*100 = 2.083vmax */
  --padding-x-27xl: 2.396vmax; /* 46px → 46/1920*100 = 2.396vmax */
  --padding-x-39xl: 3.021vmax; /* 58px → 58/1920*100 = 3.021vmax */
  --padding-x-41xl: 3.125vmax; /* 60px → 60/1920*100 = 3.125vmax */
  --padding-x-52xl: 3.698vmax; /* 71px → 71/1920*100 = 3.698vmax */
  --padding-x-91xl: 5.729vmax; /* 110px → 110/1920*100 = 5.729vmax */
  
  /* Padding Y variants (height-based) */
  --padding-y-3xs: 0.926vmin; /* 10px → 10/1080*100 = 0.926vmin */
  --padding-y-mini: 1.389vmin; /* 15px → 15/1080*100 = 1.389vmin */
  --padding-y-base: 1.481vmin; /* 16px → 16/1080*100 = 1.481vmin */
  --padding-y-mid: 1.574vmin; /* 17px → 17/1080*100 = 1.574vmin */
  --padding-y-lg: 1.667vmin; /* 18px → 18/1080*100 = 1.667vmin */
  --padding-y-lgi: 1.759vmin; /* 19px → 19/1080*100 = 1.759vmin */
  --padding-y-xl: 1.852vmin; /* 20px → 20/1080*100 = 1.852vmin */
  --padding-y-9xl: 2.593vmin; /* 28px → 28/1080*100 = 2.593vmin */
  --padding-y-10xl: 2.685vmin; /* 29px → 29/1080*100 = 2.685vmin */
  --padding-y-11xl: 2.778vmin; /* 30px → 30/1080*100 = 2.778vmin */
  --padding-y-20xl: 3.611vmin; /* 39px → 39/1080*100 = 3.611vmin */
  --padding-y-21xl: 3.704vmin; /* 40px → 40/1080*100 = 3.704vmin */
  --padding-y-27xl: 4.259vmin; /* 46px → 46/1080*100 = 4.259vmin */
  --padding-y-39xl: 5.37vmin; /* 58px → 58/1080*100 = 5.37vmin */
  --padding-y-41xl: 5.556vmin; /* 60px → 60/1080*100 = 5.556vmin */
  --padding-y-52xl: 6.574vmin; /* 71px → 71/1080*100 = 6.574vmin */
  --padding-y-91xl: 10.185vmin; /* 110px → 110/1080*100 = 10.185vmin */

  /* Border radiuses */
  --br-base: 16px;
  --br-xl: 20px;
  --br-11xl: 30px;

  /* Figma Variables */

  /* Color Variables */
  --black: #000;
  --blue: #0045ff;
  --dark: #010205;
  --white: #fff;
}

@media screen and (max-width: 1440px) {
  :root {
    --h2-60px-1920-size: 3.472vmax; /* 50px / 1440 * 100 */
    --h1-90px-1920-size: 4.861vmax; /* 70px / 1440 * 100 */
    --text-18-size: 1.25vw; /* 18px / 1440 * 100 */
  }
}

@media screen and (max-width: 990px) {
  :root {
    --h2-60px-1920-size: 5.051vmax; /* 50px / 990 * 100 */
    --h1-90px-1920-size: 6.061vmax; /* 60px / 990 * 100 */
    --text-18-size: 1.82vw; /* 18px / 990 * 100 */
  }
}

@media screen and (max-width: 550px) {
  :root {
    --h2-60px-1920-size: 5.455vmax; /* 30px / 550 * 100 */
    --h1-90px-1920-size: 7.273vmax; /* 40px / 550 * 100 */
    --text-18-size: 2.909vw; /* 16px / 550 * 100 */
  }
}