/*sizes nav*/

body {
  --burger-line-height: 3.194px;
  --nav-icon-height: clamp(40px, 5vw, 65px);
  --nav-icon-width: clamp(40px, 5vw, 65px);
  --nav-icon-padding-X: clamp(20px, 3.2vw, 52px);
  --nav-icon-padding-Y: clamp(31px, 2.8vw, 40px);
}

/*sizes,pad,marg*/

:root {
  --h1-font-size: clamp(
    11px,
    calc(11px + (16 - 11) * ((100vw - 375px) / (1920 - 375))),
    16px
  );
  --h2-font-size: clamp(
    20px,
    calc(20px + (45 - 20) * ((100vw - 375px) / (1920 - 375))),
    45px
  );
  --h3-font-size: clamp(
    19px,
    calc(19px + (34 - 19) * ((100vw - 375px) / (1920 - 375))),
    34px
  );
  --h4-font-size: clamp(
    14px,
    calc(14px + (18 - 14) * ((100vw - 375px) / (1920 - 375))),
    18px
  );
  --h5-font-size: clamp(
    22px,
    calc(22px + (28 - 22) * ((100vw - 375px) / (1920 - 375))),
    28px
  );
  --h6-font-size: clamp(
    12px,
    calc(12px + (17 - 12) * ((100vw - 375px) / (1920 - 375))),
    17px
  );
  --base-font-size: clamp(
    15px,
    calc(15px + (17 - 15) * ((100vw - 375px) / (1920 - 375))),
    17px
  );
  --btn-font-size: clamp(
    14px,
    calc(14px + (15 - 14) * ((100vw - 375px) / (1920 - 375))),
    15px
  );
  /**spacing*/
  --gap-s: clamp(10px, 2.66vw, 15px);
  --gap-m: clamp(20px, 5.33vw, 30px);
  --gap-l: clamp(30px, 9.33vw, 50px);
  --gap-xl: clamp(30px, 10vw, 100px);
  --cont-gap: clamp(80px, 13vw, 200px);
  --bg-padding: clamp(80px, 10vw, 120px);
}

/*fonts*/

:root {
  --mainfont: "arpona";
  --headlinefont: "fleisch-wurst";
}