*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  -webkit-tap-highlight-color: transparent;
}

ul[class],
ol[class] {
  padding: 0;
}

body,
h1,
h2,
h3,
h4,
p,
ul[class],
ol[class],
li {
  margin: 0;
}

body {
  min-height: 100vh;
  scroll-behavior: smooth;
  text-rendering: auto;
  line-height: 1.5;
  color: var(--dark-color);
  font-family: "SF Pro Display", sans-serif;
  display: flex;
  flex-direction: column;
  overflow-x: hidden;
}

ul[class],
li,
ol {
  list-style: none;
}

a:not([class]) {
  -webkit-text-decoration-skip: ink;
  text-decoration-skip-ink: auto;
}

img {
  max-width: 100%;
  display: block;
}

input,
button,
textarea,
select {
  font: inherit;
}

html {
  scroll-behavior: smooth;
}

main {
  padding-top: var(--header-height);
  flex-grow: 1;
}

:root {
  --header-height: clamp(50px, 3.43vw, 3.43vw);

  --light-color: rgb(255, 255, 255, 1);
  --light-color-10: rgba(255, 255, 255, 0.1);
  --light-color-40: rgba(255, 255, 255, 0.4);
  --light-color-60: rgba(255, 255, 255, 0.6);
  --light-color-80: rgba(255, 255, 255, 0.8);
  --light-color-90: rgba(255, 255, 255, 0.9);
  --dark-color: rgba(28, 28, 28, 1);
  --dark-color-20: rgba(28, 28, 28, 0.2);
  --dark-color-40: rgba(28, 28, 28, 0.4);
  --dark-color-50: rgba(28, 28, 28, 0.5);
  --dark-color-60: rgba(28, 28, 28, 0.6);
  --dark-color-80: rgba(28, 28, 28, 0.8);
  --dark-color-hover: rgba(53, 53, 53, 1);

  --primary-color: rgba(200, 32, 32, 1);
  --primary-color-10: rgba(200, 32, 32, 0.1);
  --primary-color-60: rgba(200, 32, 32, 0.6);
  --primary-color-hover: rgba(224, 36, 36, 1);
  --secondary-color: rgba(245, 245, 247, 1);
  --additional-color: rgb(110, 110, 115);
  --additional-color-60: rgba(110, 110, 115, 0.6);

  --swiper-arrow-color: rgba(230, 230, 230, 1);
  --border-color: rgba(184, 184, 184, 1);
  --select-arrow-color: rgba(15, 23, 41, 1);
  --input-border-color: rgba(223, 223, 223, 1);
  --input-border-hover-color: rgba(133, 133, 133, 1);
  --reset-btn-color: rgba(237, 237, 237, 1);
  --reset-btn-active-color: rgba(224, 224, 224, 1);
  --scroll-thumb-color: rgba(175, 175, 175, 1);
  --counter-step-back-color: rgba(239, 239, 239, 1);
  --counter-step-color: rgba(44, 44, 46, 0.6);

  --product-card: rgba(245, 245, 245, 1);
  --bonus-card: rgba(217, 217, 217, 0.2);
  --fraud-card: rgba(215, 6, 16, 1);

  --divider-color: rgba(233, 233, 233, 1);
}
