:root {
  /* 🧱 Границы и кнопки */
  --border-radius-sm: 4px;
  --border-radius-md: 8px;
  --border-radius-lg: 16px;

  /* 📐 Отступы и размеры секций */
  --section-pt: 40px;
  --section-pb: 40px;
  --section-gap: 24px;

  --cont-padding-x: 15px;
  /* min */
  --cont-min-w-sm: 479px;
  --cont-min-w-md: 767px;
  --cont-min-w-lg: 1199px;
  /* max */
  --cont-max-w-sm: 480px;
  --cont-max-w-md: 768px;
  --cont-max-w-lg: 1200px;
  /* Паддинги */
  /* общие */
  --p-5: 5px;
  --p-10: 10px;
  --p-15: 15px;
  --p-20: 20px;
  /* top */
  --p-t-5: 5px;
  --p-t-10: 10px;
  --p-t-15: 15px;
  --p-t-20: 20px;
  /* bottom */
  --p-b-5: 5px;
  --p-b-10: 10px;
  --p-b-15: 15px;
  --p-b-20: 20px;
  /* left */
  --p-l-5: 5px;
  --p-l-10: 10px;
  --p-l-15: 15px;
  --p-l-20: 20px;
  /* right */
  --p-r-5: 5px;
  --p-r-10: 10px;
  --p-r-15: 15px;
  --p-r-20: 20px;

  /* Марджины */
  /* bottom */
  --m-b-5: 5px;
  --m-b-10: 10px;
  --m-b-15: 15px;
  --m-b-20: 20px;
  --m-b-25: 25px;
  --m-b-30: 30px;
  /* top */
  --m-t-5: 5px;
  --m-t-10: 10px;
  --m-t-15: 15px;
  --m-t-20: 20px;
  --m-t-25: 25px;
  --m-t-30: 30px;
  /* left */
  --m-l-auto: auto;
  --m-l-5: 5px;
  --m-l-10: 10px;
  --m-l-15: 15px;
  --m-l-20: 20px;
  --m-l-25: 25px;
  --m-l-30: 30px;
  /* right */
  --m-r-auto: auto;
  --m-r-5: 5px;
  --m-r-10: 10px;
  --m-r-15: 15px;
  --m-r-20: 20px;
  --m-r-25: 25px;
  --m-r-30: 30px;
  /* 🔠 Шрифты */
  --fs-12: 12px;
  --fs-14: 14px;
  --fs-16: 16px;
  --fs-18: 18px;
  --fs-20: 20px;
  --fs-22: 22px;
  --fs-24: 24px;
  --fs-26: 26px;
  --fs-28: 28px;
  --fs-30: 30px;
  --fs-32: 32px;
  --fs-34: 34px;
  --fs-36: 36px;
  --fs-38: 38px;
  --fs-40: 40px;
  --fs-42: 42px;
  --fs-44: 44px;
  --fs-46: 46px;
  --fs-48: 48px;
  --fs-50: 50px;

  /* shadow */
  --box-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.1);
  --box-shadow-md: 0 4px 8px rgba(0, 0, 0, 0.1);
  --box-shadow-lg: 0 8px 16px rgba(0, 0, 0, 0.1);
  --box-shadow-xl: 0 16px 32px rgba(0, 0, 0, 0.1);

  --line-height-base: 1.5;
  --font-family-base: "Inter", "Arial", sans-serif;

  /* default colors */
  --color-white: #ffffff;
}

/* Box sizing reset */
*,
*::before,
*::after {
  box-sizing: border-box;
}
section:nth-child(even) {
  background: var(--color-bg-secondary);
}

/* Remove default margin */
body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
figure,
blockquote,
dl,
dd,
ul,
ol {
  margin: 0;
  padding: 0;
}
html {
  background: var(--color-bg);
  scroll-behavior: smooth;
  color: var(--color-text);
}
/* Set core body defaults */
body {
  min-height: 100vh;
  text-rendering: optimizeSpeed;
  line-height: 1.5;
}

/* Remove list styles on ul, ol elements with a class attribute */
ul,
ol {
  list-style: none;
}

/* A elements that don't have a class get default styles */
a {
  text-decoration: none;
  color: inherit;
}

/* Make images easier to work with */
img,
picture {
  max-width: 100%;
  display: block;
  height: auto;
}

/* Inherit fonts for form elements */
input,
button,
textarea,
select {
  font: inherit;
  color: inherit;
  background-color: transparent;
  border: none;
  outline: none;
}

/* Remove built-in button styles */
button {
  cursor: pointer;
  background: none;
  border: none;
}

/* Remove animations and transitions for people that prefer not to see them */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms-24df13 !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms-24df13 !important;
    scroll-behavior: auto !important;
  }
}

.container-24df13 {
  padding-left: 10px;
  padding-right: 10px;
  max-width: 100%; /* fallback */
  margin: auto;
}

@media screen and (max-width: 479px) {
  .container-24df13 {
    max-width: 459px;
  }
}

@media screen and (min-width: 480px) and (max-width: 767px) {
  .container-24df13 {
    max-width: 460px;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
  .container-24df13 {
    max-width: 768px;
  }
}

@media screen and (min-width: 1200px) {
  .container-24df13 {
    max-width: 1200px;
  }
}
:root {
  --color-bg: #f8e1e4;
  --color-bg-secondary: #f9e5e7;
  --color-text: #111827;
  --color-text-muted: #11182799;
  --color-primary: #f43f5e;
  --color-secondary: #ff985a;
  --color-accent: #ff57cc;
  --color-border: #dec8cb4d;
  --color-error: #dc2626;
  --color-success: #16a34a;
  --color-warning: #facc15;
  --btn-text: black;
  --btn-hover-text: #fde68a;
  --btn-bg: #f43f5e;
  --btn-hover-bg: #d71c49;
  --btn-disabled-bg: #78350f;
}
