@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('fonts/montserrat-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('fonts/montserrat-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('fonts/montserrat-latin.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+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --gray: #6b6b6b;
  --black: #111;
  --accent: #7b8fd4;
  --fs-xs: clamp(0.75rem, 1.2vw, 0.8125rem);
  --fs-sm: clamp(0.75rem, 1.4vw, 0.9375rem);
  --fs-lg: clamp(1.0625rem, 2.2vw, 1.375rem);
  --fs-xl: clamp(1.25rem, 2.8vw, 1.625rem);
  --fs-xxl: clamp(1.25rem, 3.2vw, 1.75rem);
  --sp-xs: clamp(0.5rem, 1vw, 0.75rem);
  --sp-sm: clamp(0.75rem, 2vw, 1.25rem);
  --sp-md: clamp(1.25rem, 3vw, 2.5rem);
  --sp-lg: clamp(1.875rem, 4.5vw, 3.75rem);
  --sp-xl: clamp(2.25rem, 5.5vw, 4.5rem);
  --hh: clamp(3.125rem, 6vw, 4rem);
  --gutter-x: max(1rem, calc((100vw - 56.25rem) / 2));
  --page-inset-1020: min(calc(100% - 2rem), 63.75rem);
  --page-inset-820: min(calc(100% - 2rem), 51.25rem);
  --tr: .2s ease;
}

html { font-size: 150%; scroll-behavior: smooth; height: 100%; }
body {
  font-family: 'Montserrat', sans-serif;
  font-size: 130%;
  background: #fff;
  color: #222;
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }

.site-header {
  background: var(--gray);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 var(--gutter-x);
  height: var(--hh);
  flex-shrink: 0;
  position: sticky;
  top: 0;
  z-index: 100;
  gap: 0.75rem;
}
.logo { display: flex; align-items: center; gap: clamp(0.375rem, 1vw, 0.75rem); flex-shrink: 0; }
.logo__icon { width: clamp(1.75rem, 4vw, 2.5rem); height: clamp(1.75rem, 4vw, 2.5rem); }
.logo__text { color: #fff; font-size: var(--fs-sm); font-weight: 500; white-space: nowrap; }

.site-nav { display: flex; gap: 0.25rem; flex-wrap: wrap; justify-content: center; }
.site-nav__link {
  color: #fff;
  font-size: var(--fs-sm);
  font-weight: 600;
  padding: clamp(0.3125rem, 0.8vw, 0.5rem) clamp(0.625rem, 1.5vw, 1.25rem);
  background: var(--black);
  border-radius: 0.1875rem;
  display: inline-block;
  white-space: nowrap;
}
.site-nav__link.active { background: #333; }

.phone-block { display: flex; align-items: center; gap: clamp(0.375rem, 1vw, 0.75rem); flex-shrink: 0; }
.phone-block__icon {
  width: clamp(1.75rem, 3.5vw, 2.25rem);
  height: clamp(1.75rem, 3.5vw, 2.25rem);
  border-radius: 50%;
  background: var(--accent);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.phone-block__icon svg { width: 55%; height: 55%; fill: #fff; }
.phone-block__info { display: flex; flex-direction: column; }
.phone-block__number { color: #fff; font-size: var(--fs-sm); font-weight: 600; white-space: nowrap; }
.phone-block__hours { color: #ddd; font-size: var(--fs-xs); white-space: nowrap; }

.burger { display: none; }

.site-main { flex: 1 0 auto; display: flex; flex-direction: column; }

.hero { width: var(--page-inset-1020); margin: 0 auto; padding: var(--sp-xl) 0 var(--sp-md); }
.hero__title {
  font-size: var(--fs-xxl);
  font-weight: 700;
  line-height: 1.35;
  margin-bottom: var(--sp-sm);
  color: #111;
  max-width: min(58.85%, 39vw);
}
.hero__desc { font-size: var(--fs-sm); line-height: 1.8; color: #333; max-width: min(66.7%, 44vw); margin-bottom: var(--sp-xs); }

.page-heading {
  width: var(--page-inset-820);
  margin: 0 auto;
  text-align: left;
  font-size: var(--fs-lg);
  font-weight: 700;
  padding: var(--sp-xl) 0 var(--sp-md);
  color: #111;
}

.about-section { display: flex; width: var(--page-inset); margin: 0 auto; }
.about-section__right h1 { font-size: var(--fs-xl); font-weight: 500; margin-bottom: var(--sp-sm); color: #111; text-align: left; }