/* assets/css/base.css - копия без комментариев, править исходник */
:root {  --color-primary: #006C66;  --color-primary-hover: #057F72;  --color-primary-pressed: #00594E; --color-primary-bg-03: rgba(0, 108, 102, 0.03); --color-primary-bg-08: rgba(0, 108, 102, 0.08); --color-primary-bg-12: rgba(0, 108, 102, 0.12); --color-primary-bg-16: rgba(0, 108, 102, 0.16); --color-primary-bg-30: rgba(0, 108, 102, 0.3); --color-dark: #252B2B;  --color-text-muted: #555B5C;  --color-gray: #979E9F;  --color-gray-2: #4F4F4F; --color-red: #C60100;  --color-red-bg: rgba(198, 1, 0, 0.03);  --color-bg: #FFFFFF; --color-bg-gray: #F9F9F9;  --color-bg-light: #F5F5F5;  --color-bg-lighter: #F3F3F3;  --color-bg-hover: #EFEFEF; --color-bg-dark: #ECECEC; --color-border: #E3E5E6;  --color-border-light: #F1F1F1; --color-border-hover: #D5D5D5; --color-divider: #F3F3F3;  --color-on-dark: #FFFFFF; --color-on-dark-muted: rgba(255, 255, 255, 0.6); --color-on-dark-border: rgba(255, 255, 255, 0.15); --color-on-dark-bg-06: rgba(255, 255, 255, 0.06); --color-on-dark-bg-14: rgba(255, 255, 255, 0.14); --color-footer: #010101; --color-footer-pattern: #121212;  --color-in-stock: #81A554;  --color-low-stock: #C60100; --color-out-stock: #979E9F;  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;  --font-body: var(--font-sans); --font-display: 'Oswald', 'Inter', sans-serif; --fs-11: 11px; --fs-12: 12px; --fs-13: 13px; --fs-14: 14px; --fs-15: 15px; --fs-16: 16px; --fs-18: 18px; --fs-20: 20px; --fs-32: 32px; --fs-48: 48px; --lh-tight: 1.3; --lh-15: 15px; --lh-18: 18px; --lh-20: 20px; --lh-23: 23px; --lh-24: 24px; --lh-26: 26px; --lh-26p: 26px; --lh-28: 28px; --lh-30: 30px; --lh-46: 46px; --lh-56: 56px; --lh-64: 64px; --ls-upper: 0.0714em;   --radius-xs: 4px; --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-pill: 999px;  --shadow-sticky: 0 4px 6px -4px rgba(0, 0, 0, 0.1), 0 10px 15px -3px rgba(0, 0, 0, 0.1); --shadow-primary: 0 4px 12px 0 rgba(0, 108, 102, 0.24), 0 4px 4px 0 rgba(0, 0, 0, 0.15); --shadow-primary-btn: 0 4px 14px 0 rgba(0, 108, 102, 0.25);  --transition: 0.2s ease;  --container-width: 1398px;  --container-padding: 261px;  --header-height: 118px;  --z-header: 100; --z-megamenu: 101; --z-overlay: 200; --z-modal: 300; --z-toast: 400; }  *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; } body { font-family: var(--font-sans); font-size: var(--fs-16); line-height: var(--lh-26); color: var(--color-dark); background-color: var(--color-bg); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } img, picture, svg { display: block; max-width: 100%; height: auto; }  picture:has(> img[data-eio="p"]) { display: contents; }  html.is-bg-deferred [data-defer-bg], html.is-bg-deferred [data-defer-bg]::before, html.is-bg-deferred [data-defer-bg]::after, html.is-bg-deferred [data-defer-bg] *, html.is-bg-deferred [data-defer-bg] *::before, html.is-bg-deferred [data-defer-bg] *::after, html.is-bg-deferred .hero-screen__slide:not(.is-active) { background-image: none !important; } a { color: inherit; text-decoration: none; transition: color var(--transition); } ul, ol { list-style: none; } button { font-family: inherit; cursor: pointer; border: none; background: none; } input, textarea, select { font-family: inherit; font-size: inherit; }  textarea { resize: none; }  h1, h2, h3, h4, h5, h6 { font-family: var(--font-display); font-weight: 600; line-height: 1.15; } .h1 { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-48); line-height: var(--lh-64); } .h2 { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-48); line-height: 72px; } .h3 { font-family: var(--font-display); font-weight: 500; font-size: var(--fs-32); line-height: var(--lh-46); } .text-muted { color: var(--color-text-muted); } .text-gray { color: var(--color-gray); } .text-primary { color: var(--color-primary); } .text-upper { text-transform: uppercase; letter-spacing: var(--ls-upper); } .text-center { text-align: center; } .eyebrow { font-size: var(--fs-14); font-weight: 500; letter-spacing: var(--ls-upper); text-transform: uppercase; color: var(--color-primary); }  .container { width: 100%; max-width: calc(var(--container-width) + 64px); margin: 0 auto; padding: 0 32px; } @media (max-width: 768px) { .container { padding: 0 16px; } } .section { padding: 80px 0; } .section--gray { background: var(--color-bg-gray); } @media (max-width: 768px) { .section { padding: 40px 0; } }  .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } .hidden { display: none !important; } .flex { display: flex; } .flex-col { display: flex; flex-direction: column; } .items-center { align-items: center; } .justify-between { justify-content: space-between; } .justify-center { justify-content: center; } .gap-2 { gap: 8px; } .gap-3 { gap: 12px; } .gap-4 { gap: 16px; } .gap-6 { gap: 24px; }  .breadcrumbs { display: flex; align-items: center; gap: 8px; font-size: var(--fs-14); color: var(--color-gray); padding: 20px 0; } .breadcrumbs a:hover { color: var(--color-primary); } .breadcrumbs__separator { width: 4px; height: 4px; background: var(--color-gray); border-radius: 50%; opacity: 0.5; } .breadcrumbs__current { color: var(--color-dark); }
