/*sizes nav*/

body {
  --burger-line-height: 2.5px;
  --nav-icon-height: clamp(40px, 1.667rem + 1.736vw, 60px);
  --nav-icon-width: clamp(40px, 1.667rem + 1.736vw, 60px);
  --nav-icon-padding-X: clamp(11px, 1.6vw, 32px);
  --nav-icon-padding-Y: clamp(11px, 1.6vw, 32px);
  --miniform-height: clamp(45px, 2.32rem + 1.71vw, 70px);
}

@media (max-width: 1024px) {
  body {
    --burger-line-height: 2px;
  }
}

/*sizes,pad,marg*/

:root {
  --h1-font-size: clamp(
    14px,
    calc(14px + (20 - 14) * ((100vw - 375px) / (1920 - 375))),
    20px
  );
  --h2-font-size: clamp(
    22px,
    calc(22px + (40 - 22) * ((100vw - 375px) / (1920 - 375))),
    40px
  );
  --h3-font-size: clamp(
    18px,
    calc(18px + (28 - 18) * ((100vw - 375px) / (1920 - 375))),
    28px
  );
  --h4-font-size: clamp(
    14px,
    calc(14px + (18 - 14) * ((100vw - 375px) / (1920 - 375))),
    18px
  );
  --h5-font-size: clamp(
    17px,
    calc(17px + (26 - 17) * ((100vw - 375px) / (1920 - 375))),
    26px
  );
  --h6-font-size: 16px;
  --base-font-size: clamp(
    14px,
    calc(14px + (17 - 14) * ((100vw - 375px) / (1920 - 375))),
    17px
  );
  --btn-font-size: 13px;
  --xxl-font-size: clamp(
    35px,
    calc(35px + (96 - 35) * ((100vw - 375px) / (1920 - 375))),
    96px
  );

  /**spacing*/
  --gap-s: clamp(5px, calc(1.48px + 0.94vw), 10px);
  --gap-m: clamp(25px, calc(21.48px + 0.94vw), 25px);
  --gap-l: clamp(30px, calc(22.96px + 1.88vw), 50px);
  --gap-xl: clamp(50px, calc(66.48px + 0.94vw), 80px);
  --cont-gap: clamp(70px, calc(32.4px + 4.7vw), 80px);
}

/*fonts*/

:root {
  --headlinefont: "loretta-display";
  --mainfont: "Zalando Sans";
}