/* ==========================================================================
   Локальні шрифти - Брокманн мінімалізм
   Тільки 2 варіанти: Regular (400) та Bold (700)
   300 та 400i мапляться на Regular для сумісності
   ========================================================================== */

/* Regular 400 */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Open Sans Regular'),
       local('OpenSans-Regular'),
       url('../fonts/opensans/opensans-400.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD, U+0400-04FF;
}

/* Light 300 → maps to Regular 400 */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: local('Open Sans Regular'),
       local('OpenSans-Regular'),
       url('../fonts/opensans/opensans-400.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD, U+0400-04FF;
}

/* Italic 400i → maps to Regular 400 (faux italic via CSS) */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: local('Open Sans Regular'),
       local('OpenSans-Regular'),
       url('../fonts/opensans/opensans-400.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD, U+0400-04FF;
}

/* Bold 700 */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: local('Open Sans Bold'),
       local('OpenSans-Bold'),
       url('../fonts/opensans/opensans-700.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD, U+0400-04FF;
}

/* ==========================================================================
   Типографічна система за принципами Мюллера-Брокманна
   Сітка + Пропорції + Простота
   ========================================================================== */

:root {
  /* Основний шрифт - єдиний для всього сайту */
  --font-primary: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  
  /* Моноширинний для коду/артикулів */
  --font-mono: 'SF Mono', Monaco, 'Cascadia Code', monospace;
  
  /* Масштаб типографіки (мінорна терція 1.2) */
  --type-scale: 1.2;
  
  /* Базовий розмір */
  --type-base: 1rem;
  
  /* Розміри тексту */
  --type-xs: calc(var(--type-base) / var(--type-scale));      /* ~13px */
  --type-sm: calc(var(--type-base) / 1.1);                     /* ~14.5px */
  --type-md: var(--type-base);                                  /* 16px */
  --type-lg: calc(var(--type-base) * var(--type-scale));       /* ~19px */
  --type-xl: calc(var(--type-base) * var(--type-scale) * var(--type-scale)); /* ~23px */
  --type-2xl: calc(var(--type-base) * var(--type-scale) * var(--type-scale) * var(--type-scale)); /* ~28px */
  --type-3xl: calc(var(--type-base) * var(--type-scale) * var(--type-scale) * var(--type-scale) * var(--type-scale)); /* ~33px */
  
  /* Інтерліньяж */
  --leading-tight: 1.25;
  --leading-normal: 1.5;
  --leading-relaxed: 1.75;
  
  /* Трекінг */
  --tracking-tight: -0.02em;
  --tracking-normal: 0;
  --tracking-wide: 0.02em;
}

/* Базова типографіка */
body {
  font-family: var(--font-primary);
  font-size: var(--type-md);
  line-height: var(--leading-normal);
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* Заголовки - той самий шрифт, різна вага */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-primary);
  font-weight: 700;
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
}

h1 { font-size: var(--type-3xl); }
h2 { font-size: var(--type-2xl); }
h3 { font-size: var(--type-xl); }
h4 { font-size: var(--type-lg); }
h5 { font-size: var(--type-md); }
h6 { font-size: var(--type-sm); }

/* Моноширинний для артикулів та коду */
.product-sku,
.sku,
.article,
code,
pre {
  font-family: var(--font-mono);
}