:root {
  /* Brandbook: change the palette here for future rebrands */
  --brand-deep-green: #1D392B;
  --brand-sage-green: #437762;
  --brand-mandarin: #E67E22;
  --brand-mandarin-hover: #C96A16;
  --brand-light-grey: #E4E4E4;
  --brand-white: #FFFFFF;

  /* Core aliases */
  --color-primary: var(--brand-deep-green);
  --color-accent: var(--brand-mandarin);
  --color-white: var(--brand-white);
  --color-black: #1A1A1A;
  --color-text: var(--brand-deep-green);
  --color-border: var(--brand-light-grey);
  --color-placeholder: #7D8A84;
  --color-bg: var(--brand-white);
  --color-footer-bg: var(--brand-deep-green);

  /* Semantic interface tokens */
  --color-header-bg: var(--brand-sage-green);
  --color-header-topbar-bg: var(--brand-deep-green);
  --color-header-text: var(--brand-white);
  --color-header-hover: var(--brand-deep-green);
  --color-nav-dropdown-bg: var(--brand-white);
  --color-nav-dropdown-text: var(--brand-deep-green);

  --color-category-bg: var(--brand-white);
  --color-category-text: var(--brand-deep-green);
  --color-category-hover-bg: var(--brand-deep-green);
  --color-category-hover-text: var(--brand-white);
  --color-category-active-bg: var(--brand-sage-green);
  --color-category-active-text: var(--brand-white);

  --color-card-bg: var(--color-panel-soft);
  --color-card-border: var(--brand-light-grey);
  --color-product-title: var(--brand-deep-green);
  --color-price: var(--brand-deep-green);
  --color-card-image-bg: rgba(255, 255, 255, 0.88);

  --color-cta-bg: var(--brand-mandarin);
  --color-cta-bg-hover: var(--brand-mandarin-hover);
  --color-cta-text: var(--brand-white);

  --color-footer-text: var(--brand-white);
  --color-footer-bottom-bg: #15291F;

  --color-filter-control: var(--brand-sage-green);
  --color-filter-control-hover: var(--brand-deep-green);
  --color-sale-badge-bg: var(--brand-mandarin);
  --color-sale-badge-text: var(--brand-white);

  --color-panel-soft: #F6F8F7;
  --color-success-bg: #EEF5F1;
  --color-success-border: #8FAE9F;
  --color-info-bg: #F6F8F7;
  --color-info-border: var(--brand-light-grey);
  --color-error-bg: #FFF4EC;
  --color-error-border: var(--brand-mandarin);

  /* Шрифты */
  --font-primary: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI",
    Roboto, Ubuntu, "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-secondary: 'Alexandria', sans-serif;
  --font-inter: 'Inter', sans-serif;

  --text-xs: 13px;
  --text-sm: 15px;
  --text-base: 17px;
  --text-lg: 20px;
  --text-xl: 25px;
  --text-2xl: 32px;

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;

  --leading-tight: 1.2;
  --leading-normal: 1.34;
  --leading-relaxed: 1.5;

  --gap-xs: 8px;
  --gap-sm: 10px;
  --gap-md: 15px;
  --gap-lg: 20px;
  --gap-xl: 30px;
  --gap-2xl: 40px;
  --gap-3xl: 50px;
  --gap-4xl: 60px;
  --gap-5xl: 70px;

  --container-max: 1440px;
  --container-padding: clamp(16px, calc(112px - 5vw), 50px);
  --sidebar-width: 232px;

  --grid-gap: 32px;

  --radius-sm: 4px;
  --radius-md: 10px;
  --radius-lg: 15px;
  --radius-xl: 20px;
  --radius-pill: 43px;
  --radius-circle: 50%;

  --shadow-card: 0 8px 22px rgba(29, 57, 43, 0.04);
  --shadow-card-hover: 0 18px 40px rgba(29, 57, 43, 0.10);
}

@media (max-width: 1024px) {
  :root {
    --container-padding: clamp(20px, 4vw, 34px);
    --grid-gap: 24px;
  }
}

@media (max-width: 768px) {
  :root {
    --container-padding: clamp(14px, 4.8vw, 24px);
    --grid-gap: 18px;
  }
}