@charset "UTF-8";
/* Базовый слой: шрифты, токены, сброс, типографика, утилиты, кнопки. */

/* Один семейный шрифт с весами вместо шести отдельных «семейств».
   Montserrat выбран основным, потому что покрывает и кириллицу, и
   азербайджанские Ə/ə, Ş/ş, İ, и знак маната ₼ — в Involve этих глифов нет,
   из-за чего азербайджанский текст рендерился вперемешку двумя шрифтами. */
@font-face {
  font-family: "Montserrat";
  src: url("../fonts/montserrat-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Montserrat";
  src: url("../fonts/montserrat-500.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Montserrat";
  src: url("../fonts/montserrat-700.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --white: #ffffff;
  --black: #10131f;
  --blueBlack: #224382;
  --blueBlack1: #193170;
  --blueBlack2: #1163c8;
  --blueBlack3: #063e82;
  --blueBlack4: #1d325b;
  --silver1: #ecf4ff;
  --backg: #f6fbff;
  --backg-blue: rgba(75, 97, 154, 0.3);
  --ink-muted: #4d5b7c;
  --line: rgba(45, 43, 114, 0.18);
  --accent: #1163c8;
  --accent-dark: #0d4fa3;
  --shadow: 0 6px 24px rgba(12, 29, 112, 0.1);
  --radius: 18px;
  --font: "Montserrat", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

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

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

/* Ни один блок не должен расширять страницу вбок. На мобильных широкая
   таблица тарифов растягивала layout viewport, и закреплённая внизу панель
   действий уезжала за край экрана. clip (в отличие от hidden) не создаёт
   контейнер прокрутки и не ломает position: sticky. */
html,
body {
  overflow-x: clip;
}

body {
  margin: 0;
  min-height: 100%;
  background-color: var(--backg);
  color: var(--black);
  font-family: var(--font);
  font-size: clamp(1rem, 0.95rem + 0.3vw, 1.25rem);
  line-height: 1.6;
}

h1, h2, h3, h4 {
  font-weight: 700;
  line-height: 1.2;
  color: var(--blueBlack1);
  text-wrap: balance;
}

h1 { font-size: clamp(1.75rem, 1.2rem + 2.2vw, 3.5rem); }
h2 { font-size: clamp(1.4rem, 1.05rem + 1.5vw, 2.6rem); }
h3 { font-size: clamp(1.1rem, 0.98rem + 0.6vw, 1.6rem); }

p { text-wrap: pretty; }

a {
  color: var(--accent);
  text-decoration: none;
}

a:hover,
a:focus-visible {
  text-decoration: underline;
}

:focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 2px;
  border-radius: 4px;
}

img,
picture,
svg {
  max-width: 100%;
}

img {
  height: auto;
  object-fit: contain;
}

ul, ol { list-style: none; margin: 0; padding: 0; }

/* Списки внутри содержательного текста маркеры сохраняют. */
.prose ul { list-style: disc; padding-left: 1.4rem; }
.prose ol { list-style: decimal; padding-left: 1.4rem; }

.wraper {
  width: min(92vw, 1400px);
  margin-inline: auto;
}

.section-title {
  text-align: center;
  margin: 0 0 clamp(1.5rem, 3vw, 3rem);
  color: var(--blueBlack3);
}

/* Ссылка для клавиатурной навигации: видна только при фокусе. */
.skip-link {
  position: absolute;
  left: -9999px;
  z-index: 100;
  padding: 0.75rem 1.25rem;
  background: var(--blueBlack1);
  color: var(--white);
  border-radius: 0 0 8px 0;
}
.skip-link:focus {
  left: 0;
  top: 0;
}

/* --- Кнопки ------------------------------------------------------------ */
.btn {
  display: inline-block;
  padding: 0.85em 2em;
  border: 2px solid var(--accent);
  border-radius: 999px;
  background: var(--accent);
  color: var(--white);
  font: inherit;
  font-weight: 600;
  text-align: center;
  cursor: pointer;
  transition: background-color 0.18s ease, transform 0.18s ease;
}
.btn:hover,
.btn:focus-visible {
  background: var(--accent-dark);
  border-color: var(--accent-dark);
  color: var(--white);
  text-decoration: none;
  transform: translateY(-1px);
}
.btn--ghost {
  background: transparent;
  color: var(--accent);
}
.btn--ghost:hover,
.btn--ghost:focus-visible {
  background: var(--accent);
  color: var(--white);
}
.btn--sm { padding: 0.5em 1.4em; font-size: 0.95em; }
.btn--full { width: 100%; }

/* --- Утилиты раскладки (используются в существующей разметке) ----------- */
.flex { display: flex; }
.justySpBet { justify-content: space-between; }
.justySpAro { justify-content: space-around; }
.justyCent { justify-content: center; }
.jusrySpEven { justify-content: space-evenly; }
.alignAtemCen { align-items: center; }
.alignAemStr { align-items: stretch; }
.flDirColum { flex-direction: column; }
.flWrap { flex-wrap: wrap; }
.noFlWrap { flex-wrap: nowrap; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}

/* Видно только скринридерам (легенды форм, служебные подписи). */
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}