/* Трекинг самозанятого «Время расти» — главная
   Токены взяты из макета: цвета, радиусы, типографика, сетка 1120/1400. */

:root {
  --blue-900: #1b61ab;
  --blue-700: #2164b0;
  --blue-600: #236de0;
  --blue-500: #3a5dae;
  --blue-cta: #2368d2;
  --blue-cta-2: #438bf1;
  --grad-blue: linear-gradient(120deg, #225cb5 5%, #236de0 75%);

  --ink: #202022;
  --ink-2: #262c3c;
  --ink-3: #292929;
  --gray-600: #4b4b4c;
  --gray-500: #989898;
  --gray-400: #adadad;
  --line: #cecece;

  --bg: #ffffff;
  --bg-soft: #f4f6f8;
  --bg-soft-2: #f3f3f5;
  --bg-header: #fbfbfb;

  --r-lg: 24px;
  --r-md: 20px;
  --r-sm: 16px;
  --r-xs: 12px;
  --r-input: 8px;

  --page: 1400px;
  --content: 1120px;
  --gutter: 20px;

  --font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-display: "Moskvich Sans", "Montserrat", var(--font);
  --font-alt: "Circe", var(--font);   /* подписи в подвале и форме */
}

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

html { scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.4;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
ul, ol { margin: 0; padding: 0; list-style: none; }
h1, h2, h3, p { margin: 0; }
button { font: inherit; }

.visually-hidden {
  position: absolute; width: 1px; height: 1px; margin: -1px;
  clip-path: inset(50%); overflow: hidden; white-space: nowrap;
}

.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 100;
  background: #fff; padding: 12px 20px; border-radius: 0 0 var(--r-input) 0;
}
.skip-link:focus { left: 0; }

:focus-visible { outline: 3px solid var(--blue-600); outline-offset: 2px; }

.page {
  max-width: var(--page);
  margin: 0 auto;
  padding: 20px 140px 0;
}

.h2 {
  font-size: 48px;
  font-weight: 600;
  line-height: 1.12;   /* 53.8px по макету */
  color: var(--ink);
}

/* ---------- кнопки ---------- */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  text-align: center;
  text-decoration: none;
  font-weight: 500;
  cursor: pointer;
  border: 0;
  transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.btn--light {
  background: #fff;
  color: var(--blue-900);
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 22px;
  line-height: 1.3;
  padding: 13px 30px;
  border-radius: 40px;
}
.btn--light:hover { transform: translateY(-2px); box-shadow: 0 12px 24px rgba(0, 0, 0, .18); }

.btn--primary {
  background: var(--blue-cta);
  color: #fff;
  font-size: 16px;
  line-height: 1;
  padding: 20px 32px;
  border-radius: 35px;
}
.btn--primary:hover { background: #1c57b4; transform: translateY(-2px); }

.btn--block {
  width: 100%;
  border-radius: var(--r-input);
  background: var(--blue-cta-2);
  padding: 15px 30px;
}
.btn--block:hover { background: #2f7ce8; }

.btn--ghost {
  border: 1px solid #bababa;
  color: var(--gray-500);
  background: transparent;
  border-radius: var(--r-input);
  font-size: 14px;
  line-height: 24px;
  padding: 7px 18px;
  align-self: flex-start;
  margin-top: auto;
}
.btn--ghost:hover { border-color: var(--blue-500); color: var(--blue-500); }

/* ---------- шапка ---------- */

.header {
  display: flex;
  align-items: center;
  flex-wrap: wrap;          /* при нехватке места меню переносится, а не вылезает */
  gap: 16px;
  min-height: 80px;
  padding: 10px 20px;
  background: var(--bg-header);
  border-radius: var(--r-md);
}

.header__logo { flex: none; }
.header__logo img { width: 148px; height: 40px; }

.nav { margin-inline: auto; min-width: 0; }
.nav__list { display: flex; align-items: center; flex-wrap: wrap; justify-content: center; gap: 10px; }

.nav__item {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 11px 14px;
  background: #fff;
  border-radius: 56px;
  color: var(--blue-500);
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  transition: background-color .18s ease, color .18s ease;
}
.nav__item:hover { background: #eaf2ff; }
.nav__chev { width: 12px; height: 6px; flex: none; }

.header__account {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 40px;
  padding: 0 15px;
  background: #fff;
  border: 1px solid #d6e7ff;
  border-radius: var(--r-md);
  color: var(--blue-500);
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
}
.header__account { line-height: 1; }
.header__account img { width: 16px; height: 16px; }
.header__account:hover { background: #f2f7ff; }

.header__burger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 44px; height: 44px;
  padding: 0 10px;
  background: #fff;
  border: 1px solid #d6e7ff;
  border-radius: 12px;
  cursor: pointer;
}
.header__burger span { display: block; height: 2px; background: var(--blue-500); border-radius: 2px; }

/* ---------- герой ---------- */

.hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin-top: 61px;
  min-height: 390px;
  padding: 32px 50px 40px;
  border-radius: var(--r-md);
  background: linear-gradient(107deg, var(--blue-900) 0%, #6cb0e2 100%);
  color: #fff;
  display: flex;
  align-items: center;
  gap: 40px;
}

.hero__glow {
  position: absolute;
  inset: -160px -80px;
  z-index: -2;
  background:
    radial-gradient(closest-side, rgba(193, 106, 167, .34), rgba(47, 53, 84, 0) 90%) -60px 340px / 660px 650px no-repeat,
    radial-gradient(closest-side, rgba(193, 106, 167, .34), rgba(47, 53, 84, 0) 90%) 380px 0 / 660px 650px no-repeat,
    radial-gradient(closest-side, rgba(193, 106, 167, .34), rgba(47, 53, 84, 0) 90%) 1050px 350px / 660px 650px no-repeat;
}

.hero__stars {
  position: absolute;
  z-index: -1;
  right: -30px;
  top: -50px;
  width: 751px;
  max-width: none;
  opacity: .9;
  pointer-events: none;
}

.hero__body { position: relative; flex: 1 1 auto; max-width: 640px; }

.hero__kicker {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 28px;
  line-height: 1.14;
  margin-bottom: 10px;
}

.hero__title {
  overflow-wrap: break-word;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 52px;
  line-height: 1;
  text-transform: uppercase;
  margin-bottom: 20px;
  max-width: 660px;
}

.hero__date {
  display: flex;
  align-items: center;
  gap: 20px;
  font-family: "Montserrat", var(--font);
  font-size: 24px;
  line-height: 1.3;
  margin-bottom: 24px;
}
.hero__date b { font-weight: 700; }
.hero__sep { width: 2px; height: 17px; background: #fff; flex: none; }

.hero__actions { display: flex; align-items: center; gap: 37px; flex-wrap: wrap; }

.hero__addr {
  display: inline-flex;
  align-items: center;
  gap: 17px;
  font-family: "Montserrat", var(--font);
  font-size: 22px;
  line-height: 1.3;
}
.hero__pin { width: 24px; height: 24px; flex: none; color: #fff; }

.hero__art {
  position: absolute;        /* в макете высоту баннера задаёт текст, а не фигура */
  right: 49px;
  bottom: -5px;              /* подрез снизу на 5px — как в макете */
  width: 393px;
  height: 393px;
}

/* ---------- цифры ---------- */

.stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--gutter);
  margin-top: 99px;
}

.stat {
  min-height: 175px;
  padding: 27px 25px 25px;
  border-radius: var(--r-sm);
  background: var(--grad-blue);
  color: #fff;
}
.stat__value { font-size: 60px; font-weight: 600; line-height: 1.07; }
.stat__label { font-size: 18px; line-height: 1.2; margin-top: 12px; max-width: 285px; }

/* ---------- что такое трекинг ---------- */

.about {
  margin-top: 21px;
  padding: 30px 30px;
  border-radius: var(--r-sm);
  background: var(--bg-soft);
}

.about__row {
  display: grid;
  grid-template-columns: 354px 1fr;
  gap: 20px;
  padding: 20px 20px 22px;
}
.about__row + .about__row { border-top: 1px solid #dddedf; }

.about__title {
  font-size: 30px;
  font-weight: 600;
  line-height: 1.2;
  color: var(--blue-700);
}
.about__text {
  font-size: 18px;
  line-height: 1.32;
  color: var(--ink);
  max-width: 690px;
}

/* ---------- карточки направлений ---------- */

.services {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--gutter);
  margin-top: 120px;
}

.card {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-height: 382px;
  padding: 32px 28px 30px;
  border-radius: var(--r-lg);
  background: #e0eaf3;
  color: var(--ink-2);
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease;
}
.card:hover { transform: translateY(-10px); box-shadow: 0 18px 34px rgba(38, 44, 60, .14); }

.card--violet { background: linear-gradient(150deg, #efeaff 0%, #faf9ff 100%); }
.card--pink   { background: linear-gradient(150deg, #ffc7d1 0%, #fff8f8 92%); }
.card--blue   { background: linear-gradient(150deg, #c0c2ff 0%, #f3f4ff 100%); }
.card--orange { background: linear-gradient(150deg, #ffe0c4 47%, #fff4eb 100%); }
.card--cyan   { background: linear-gradient(150deg, #b9f3ff 29%, #e9feff 100%); }
.card--lime   { background: linear-gradient(150deg, #e3ffb6 0%, #f8ffdd 71%); }

.card__title {
  font-size: 22px;
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 24px;
  max-width: 300px;
}

.card__list { display: grid; gap: 10px; font-size: 12px; line-height: 1.3; color: var(--ink-3); }
.card__list li { position: relative; padding-left: 14px; max-width: 290px; }
.card__list li::before { content: ">"; position: absolute; left: 0; }

.card__art {
  position: absolute;
  right: 10px;
  bottom: 38px;
  z-index: -1;
  width: 132px;
  height: auto;
  pointer-events: none;
}

.card__more {
  margin-top: auto;
  padding-top: 24px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: .4px;
  background: var(--grad-blue);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* ---------- истории успеха ---------- */

.stories { margin-top: 120px; }

.stories__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 30px;
}
.stories__head .h2 { flex: 1 1 auto; }
.stories__nav { display: flex; gap: 12px; flex: none; }

.round-btn {
  width: 64px; height: 64px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 90px;
  background: #fff;
  color: var(--ink-2);
  box-shadow: 0 20px 30px rgba(59, 59, 59, .2);
  cursor: pointer;
  transition: transform .18s ease;
}
.round-btn:hover { transform: translateY(-2px); }
.round-btn svg { width: 24px; height: 24px; }
.round-btn[disabled] { opacity: .35; box-shadow: none; cursor: default; transform: none; }

.stories__track {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 361px;
  gap: 19px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-padding-left: 0;
  padding-bottom: 16px;
  scrollbar-width: thin;
}
.story { scroll-snap-align: start; }

.story__bubble {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-height: 315px;
  padding: 22px 28px 25px;
  border-radius: var(--r-xs);
  background: var(--bg-soft-2);
}
.story__bubble::after {
  content: "";
  position: absolute;
  left: 18px;
  bottom: -30px;
  width: 41px;
  height: 32px;
  background: var(--bg-soft-2);
  clip-path: polygon(0 0, 100% 0, 42% 100%);
}

.story__text { font-size: 16px; font-weight: 500; line-height: 21px; color: var(--gray-600); }

.story__person {
  display: flex;
  align-items: center;
  gap: 22px;
  margin-top: 50px;
}
.story__avatar {
  width: 76px; height: 76px;
  border-radius: 50%;
  object-fit: cover;
  background: #d9d9d9;
  flex: none;
}
.story__name { font-size: 20px; font-weight: 500; line-height: 1.3; color: var(--ink-3); }
.story__role { font-size: 18px; font-weight: 500; line-height: 1.3; color: var(--gray-400); margin-top: 8px; }

/* ---------- для кого ---------- */

.audience { margin-top: 120px; }
.audience__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--gutter);
  margin-top: 34px;
}

.aud {
  min-height: 413px;
  padding: 31px 32px 40px;
  border-radius: var(--r-lg);
  background: var(--grad-blue);
  color: #fff;
}
.aud__title { font-size: 32px; font-weight: 600; line-height: 1.2; }  /* 38.4px, по двухстрочному заголовку макета */
.aud__badge {
  display: inline-block;
  margin-top: 24px;
  padding: 12px 15px;
  border: 1px solid #fff;
  border-radius: var(--r-lg);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.17;
  text-align: center;
}
.aud__list { margin-top: 42px; display: grid; gap: 16px; font-size: 16px; font-weight: 500; line-height: 1.39; }
.aud__list li { position: relative; padding-left: 16px; }
.aud__list li::before { content: ">"; position: absolute; left: 0; }

/* ---------- заявка ---------- */

.apply {
  display: grid;
  grid-template-columns: 1fr minmax(0, 510px);
  gap: 60px;
  margin-top: 120px;
  padding: 49px 40px 0;
  border-radius: var(--r-md);
  background: var(--bg-soft);
  overflow: hidden;
}

.apply__title {
  font-size: 48px;
  font-weight: 600;
  line-height: 1.15;
  color: #272f43;
  max-width: 430px;
}
.apply__text { margin-top: 29px; font-size: 16px; line-height: 1.2; color: var(--ink-2); max-width: 454px; }
.apply__art { margin: 50px 0 0 -40px; width: 494px; max-width: 100%; flex: none; }

.form {
  display: grid;
  min-width: 0;
  grid-template-columns: 1fr 1fr;
  gap: 19px;
  align-content: start;
  padding: 21px 0 56px;
}
.field--full { grid-column: 1 / -1; }

.field__label { display: block; margin-bottom: 12px; font-size: 16px; line-height: 1.1; color: var(--ink-2); }

.field input,
.select select {
  width: 100%;
  height: 45px;
  padding: 0 15px;
  border: 1px solid var(--line);
  border-radius: var(--r-input);
  background: #fff;
  color: var(--ink-2);
  font-family: inherit;
  font-size: 14px;
}
.field input::placeholder { color: var(--ink-2); opacity: .85; }
.field input:focus, .select select:focus { border-color: var(--blue-cta-2); outline: none; box-shadow: 0 0 0 3px rgba(67, 139, 241, .18); }

.select { position: relative; }
.select select { appearance: none; height: 46px; padding-right: 40px; }
.select__chev {
  position: absolute;
  right: 16px; top: 50%;
  transform: translateY(-50%) rotate(90deg);
  width: 8px; height: 14px;
  color: #939eaf;
  pointer-events: none;
}

.check {
  font-family: var(--font-alt);
  grid-column: 1 / -1;
  display: flex;
  align-items: flex-start;
  gap: 16px;
  font-size: 16px;
  line-height: 1.2;
  color: var(--ink-2);
  cursor: pointer;
}
.check input { position: absolute; opacity: 0; width: 18px; height: 18px; }
.check__box {
  flex: none;
  width: 18px; height: 18px;
  margin-top: 1px;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: #fff;
  display: grid;
  place-items: center;
  transition: background-color .15s ease, border-color .15s ease;
}
.check__box::after {
  content: "";
  width: 10px; height: 6px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg) translate(1px, -1px) scale(.6);
  opacity: 0;
  transition: opacity .15s ease, transform .15s ease;
}
.check input:checked + .check__box { background: var(--blue-cta-2); border-color: var(--blue-cta-2); }
.check input:checked + .check__box::after { opacity: 1; transform: rotate(-45deg) translate(1px, -1px) scale(1); }
.check input:focus-visible + .check__box { outline: 3px solid var(--blue-600); outline-offset: 2px; }
.check a { color: var(--blue-700); }

.form .btn--block { grid-column: 1 / -1; margin-top: 2px; }

/* ---------- этапы трекинга ---------- */

.track { margin-top: 120px; }
.track__lead {
  margin-top: 24px;
  font-size: 28px;
  font-weight: 500;
  line-height: 1.3;
  max-width: 850px;
}

.steps {
  position: relative;
  margin-top: 96px;
  display: grid;
  gap: 65px;
}
.steps::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 21px;
  bottom: 21px;
  width: 2px;
  background: #d7d7d7;
  transform: translateX(-1px);
}

.step {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 44px 1fr;
  align-items: center;
  gap: 28px;
}

.step__num {
  grid-column: 2;
  grid-row: 1;
  z-index: 1;
  width: 43px; height: 43px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--grad-blue);
  color: #fff;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
}

.step__card {
  grid-column: 1;
  grid-row: 1;
  padding: 26px 30px;
  border-radius: var(--r-xs);
  background: var(--bg-soft);
  text-align: right;
  position: relative;
}
.step__card::after {
  content: "";
  position: absolute;
  right: -12px;
  top: 50%;
  width: 24px; height: 24px;
  background: var(--bg-soft);
  border-radius: 3px;
  transform: translateY(-50%) rotate(45deg);
}
.step__title { font-size: 20px; font-weight: 700; line-height: 1.2; color: var(--ink-2); }
.step__text { margin-top: 15px; font-size: 16px; line-height: 1.32; color: var(--ink-3); }

.step__art { grid-column: 3; grid-row: 1; justify-self: center; width: 140px; height: auto; }

.step:nth-child(even) .step__card {
  grid-column: 3;
  text-align: left;
}
.step:nth-child(even) .step__card::after { right: auto; left: -12px; }
.step:nth-child(even) .step__art { grid-column: 1; justify-self: center; }

.track__cta { margin-top: 90px; text-align: center; }

/* ---------- подвал ---------- */

.footer {
  margin-top: 120px;
  background: var(--ink-2);
  color: #fff;
}
.footer__inner {
  max-width: var(--page);
  margin: 0 auto;
  padding: 36px 140px 40px;
  display: grid;
  grid-template-columns: 430px 1fr 300px;
  gap: 40px;
}
.footer__col--brand { display: flex; flex-direction: column; gap: 130px; }
.footer__col--brand img { width: 182px; height: 50px; }
.footer__copy { font-size: 12px; line-height: 1.3; color: rgba(248, 248, 248, .7); max-width: 385px; }

.footer__head { font-size: 16px; font-weight: 700; line-height: 1.1; color: #90cffb; margin-bottom: 19px; }
.footer__links { display: grid; gap: 4px; font-size: 16px; line-height: 20px; color: rgba(255, 255, 255, .9); }
.footer__links a { text-decoration: none; }
.footer__links a:hover { text-decoration: underline; }

.footer__contact { font-family: var(--font-alt); font-size: 14px; line-height: 1.28; margin-bottom: 12px; color: rgba(255, 255, 255, .7); }
.footer__contact b { display: inline-block; margin-bottom: 2px; font-size: 16px; font-weight: 700; color: #fff; }
.footer__contact a { color: rgba(255, 255, 255, .7); text-decoration: none; }
.footer__contact a:hover { color: #fff; }

.socials { display: flex; gap: 19px; margin-top: 30px; }
.socials img { width: 28px; height: 28px; }
.socials a { display: block; transition: transform .18s ease; }
.socials a:hover { transform: translateY(-2px); }

/* ---------- адаптив ---------- */

@media (max-width: 1399px) {
  .page { padding: 20px 40px 0; }
  .footer__inner { padding: 40px 40px 45px; }
  .hero__art { width: 330px; height: 330px; }
}

/* Меню из пяти пунктов + логотип + кнопка требуют ~1120px по внутренней ширине
   шапки. Ниже — сворачиваем в бургер, иначе кнопка выдавливается за край
   и страница получает горизонтальную прокрутку. */
@media (max-width: 1240px) {
  .header { padding: 14px 16px; gap: 12px; }
  .header__burger { display: flex; margin-left: auto; }
  .header__account { order: 3; }
  .nav { order: 4; width: 100%; margin: 0; display: none; }
  .nav.is-open { display: block; }
  .nav__list { flex-wrap: wrap; gap: 8px; }
}

@media (max-width: 1199px) {
  .h2, .apply__title { font-size: 40px; }
  .hero { padding: 40px; gap: 24px; }
  .hero__title { font-size: 36px; }
  .hero__art { width: 260px; height: 260px; right: 24px; bottom: -5px; }
  .stats, .services, .audience__grid { grid-template-columns: repeat(2, 1fr); }
  .about__row { grid-template-columns: 1fr; gap: 12px; }
  .apply { grid-template-columns: 1fr; gap: 24px; padding: 40px 40px 0; }
  .apply__art { margin: 0 auto; }
  .form { padding-bottom: 40px; }
  .footer__inner { grid-template-columns: 1fr 1fr; }
  .footer__col--brand { grid-column: 1 / -1; gap: 30px; }
}

@media (max-width: 900px) {
  .hero { margin-top: 30px; flex-direction: column; align-items: flex-start; }
  .hero__art { position: static; align-self: center; margin: 16px 0 -40px; width: 230px; height: 230px; }
  .hero__stars { right: -120px; top: -80px; width: 520px; }
  .hero__title { font-size: 34px; }
  .hero__kicker { font-size: 22px; }
  .hero__date { font-size: 20px; }
  .btn--light { font-size: 18px; padding: 14px 26px; }

  .stats, .services, .audience__grid { grid-template-columns: 1fr; }
  .stories, .services, .audience, .apply, .track, .footer { margin-top: 70px; }

  .steps { margin-top: 50px; gap: 28px; }
  .steps::before { left: 21px; }
  .step { grid-template-columns: 44px 1fr; gap: 16px; }
  .step__num { grid-column: 1; }
  .step__card,
  .step:nth-child(even) .step__card { grid-column: 2; text-align: left; }
  .step__card::after,
  .step:nth-child(even) .step__card::after { display: none; }
  .step__art,
  .step:nth-child(even) .step__art { display: none; }

  .footer__inner { grid-template-columns: 1fr; }
  .footer__col--brand { gap: 24px; }
}

@media (max-width: 640px) {
  .page { padding: 12px 16px 0; }
  .footer__inner { padding: 32px 16px; }
  .h2, .apply__title { font-size: 30px; }
  .hero { padding: 28px 20px; }
  .hero__art { margin-bottom: -28px; width: 210px; height: 210px; }
  .hero__title { font-size: 28px; }
  .hero__actions { gap: 20px; }
  .stat__value { font-size: 46px; }
  .about { padding: 20px 12px; }
  .apply { padding: 28px 20px 0; }
  .form { grid-template-columns: 1fr; }
  .stories__track { grid-auto-columns: 300px; }
  .stories__head { flex-direction: column; align-items: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; scroll-behavior: auto !important; }
}

/* ============================================================
   БЛОКИ ВНУТРЕННИХ СТРАНИЦ
   ============================================================ */

/* ---------- шапка раздела ---------- */

.lead {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  gap: 40px;
  margin-top: 40px;
  min-height: 390px;
  padding: 45px 64px;
  border-radius: var(--r-md);
  background: var(--bg-soft);
}
.lead--violet { background: linear-gradient(115deg, #efeaff 30%, #d5ccfc 100%); }
.lead--pink   { background: linear-gradient(115deg, #ffe7ec 20%, #ffd0da 100%); }
.lead--blue   { background: linear-gradient(115deg, #e6ecff 20%, #ccd8fc 100%); }
.lead--orange { background: linear-gradient(115deg, #ffeedd 20%, #ffdcc0 100%); }
.lead--cyan   { background: linear-gradient(115deg, #e2fbff 20%, #c2f2fb 100%); }
.lead--lime   { background: linear-gradient(115deg, #f2ffdc 20%, #e0ffb6 100%); }

.lead__body { position: relative; flex: 1 1 auto; max-width: 620px; }

.lead__title {
  overflow-wrap: break-word;
  font-size: 50px;
  font-weight: 600;
  line-height: 1.2;
  color: var(--ink);
}
.lead__text {
  margin-top: 20px;
  font-size: 24px;
  line-height: 1.3;
  color: var(--ink);
  max-width: 520px;
}
.lead__body .btn { margin-top: 46px; }

.lead__art {
  position: relative;
  flex: none;
  width: 388px;
  height: 388px;
  margin: -45px -30px -45px 0;
}

.btn--sm { font-size: 16px; font-weight: 500; line-height: 1; padding: 18px 32px; }

/* ---------- «зачем консультация» ---------- */

.why { margin-top: 110px; }
.why__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  margin-top: 38px;
}
.why__card {
  display: flex;
  flex-direction: column;
  gap: 34px;
  min-height: 204px;
  padding: 26px;
  border-radius: var(--r-sm);
  background: var(--bg-soft);
}
.why__card img { width: 45px; height: auto; }
.why__card p { font-size: 18px; font-weight: 500; line-height: 1.4; color: #212121; }

/* ---------- платформы ---------- */

.platforms { margin-top: 110px; }
.platforms__lead {
  margin-top: 27px;
  font-size: 22px;
  line-height: 1.4;
  color: var(--ink);
  max-width: 927px;
}

.platforms__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 56px;
}

.platform {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 20px;
  border-radius: var(--r-sm);
  background: var(--bg-soft);
  color: #595959;
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease;
}
.platform:hover { transform: translateY(-10px); box-shadow: 0 18px 34px rgba(38, 44, 60, .12); }
.platform p { font-size: 12px; font-weight: 500; line-height: 1.3; }

.platform__logo {
  display: grid;
  place-items: center;
  width: 144px;
  height: 52px;
  flex: none;
  border-radius: 4px;
  background: #fff;
}
.platform__logo img { max-width: 115px; max-height: 40px; width: auto; height: auto; }

@media (max-width: 1199px) {
  .lead { padding: 40px; gap: 24px; }
  .lead__title { font-size: 38px; }
  .lead__art { width: 280px; height: 280px; margin: -20px -10px -20px 0; }
  .platforms__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 900px) {
  .lead { flex-direction: column; align-items: flex-start; margin-top: 24px; }
  .lead__title { font-size: 30px; }
  .lead__text { font-size: 18px; }
  .lead__art { align-self: center; margin: 8px 0 0; width: 230px; height: 230px; }
  .why, .platforms { margin-top: 70px; }
  .why__grid, .platforms__grid { grid-template-columns: 1fr; }
}

/* ---------- витрина самозанятых ---------- */

.why__grid--3 { grid-template-columns: repeat(3, 1fr); }
.why__grid--3 .why__card { min-height: 180px; }

.promo {
  margin-top: 40px;
  padding: 44px 60px;
  border-radius: var(--r-sm);
  background: var(--grad-blue);
  color: #fff;
  text-align: center;
}
.promo__title { font-size: 28px; font-weight: 600; line-height: 1.3; max-width: 847px; margin: 0 auto; }
.promo__note { margin-top: 50px; font-size: 16px; line-height: 1.4; opacity: .9; }

.showcase { margin-top: 110px; }

.tabs { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 34px; }
.tab {
  padding: 17px 34px;
  border: 0;
  border-radius: 53px;
  background: #f2f4f7;
  color: var(--ink-3);
  font-size: 18px;
  font-weight: 500;
  line-height: 1.24;
  cursor: pointer;
  transition: background-color .18s ease, color .18s ease;
}
.tab:hover { background: #e6ebf3; }
.tab.is-active { background: var(--grad-blue); color: #fff; font-weight: 600; }

.showcase__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 44px;
}

.person {
  min-height: 636px;
  padding: 24px;
  border-radius: var(--r-sm);
  background: var(--bg-soft);
  transition: transform .2s ease, background .2s ease, color .2s ease;
}
.person:hover { transform: translateY(-10px); background: var(--grad-blue); }
.person:hover .person__name,
.person:hover .person__facts dd,
.person:hover .person__facts a { color: #fff; }
.person:hover .person__facts dt { color: #b1d0fe; }
.person:hover .person__facts dd { border-bottom-color: rgba(255, 255, 255, .35); }
.person__head { display: flex; align-items: center; gap: 22px; }
.person__avatar { width: 79px; height: 79px; border-radius: 50%; object-fit: cover; background: #d9d9d9; flex: none; }
.person__name { font-size: 18px; font-weight: 500; line-height: 1.3; color: var(--ink-3); }

.person__facts { margin-top: 36px; }
.person__facts dt {
  font-size: 14px;
  font-weight: 500;
  line-height: 1.3;
  color: #8d8d8d;
  margin-bottom: 6px;
}
.person__facts dd {
  margin: 0 0 22px;
  padding-bottom: 22px;
  border-bottom: 1px solid rgba(173, 173, 173, .32);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.3;
  color: var(--ink-3);
  overflow-wrap: anywhere;
}
.person__facts dd:last-child { border-bottom: 0; padding-bottom: 0; margin-bottom: 0; }
.person__facts a { color: var(--blue-700); text-decoration: none; }
.person__facts a:hover { text-decoration: underline; }

.showcase__more { margin-top: 40px; text-align: center; }

@media (max-width: 1199px) {
  .why__grid--3, .showcase__grid { grid-template-columns: repeat(2, 1fr); }
  .promo { padding: 32px 28px; }
  .promo__title { font-size: 22px; }
  .promo__note { margin-top: 24px; }
}

@media (max-width: 900px) {
  .why__grid--3, .showcase__grid { grid-template-columns: 1fr; }
  .showcase { margin-top: 70px; }
  .person { min-height: 0; }
}

/* ---------- вводный абзац и список услуг ---------- */

.intro { margin-top: 60px; }
.intro p { font-size: 28px; font-weight: 500; line-height: 1.3; color: var(--ink); max-width: 999px; }

.lead__title--sm { font-size: 46px; }
.lead--lime .lead__title { font-size: 46px; line-height: 1.2; }

.services-list { margin-top: 110px; }
.services-list__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.service {
  display: flex;
  flex-direction: column;
  padding: 32px 24px;
  border-radius: var(--r-sm);
  background: var(--bg-soft);
}
.service__title { font-size: 18px; font-weight: 600; line-height: 1.3; color: var(--blue-700); }
.service__note { margin-top: 22px; font-size: 14px; font-weight: 500; line-height: 1.3; color: #8d8d8d; }
.service__list { display: grid; gap: 16px; margin-top: 16px; }
.service__list li {
  position: relative;
  padding-left: 14px;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.3;
  color: var(--ink-3);
}
.service__list li::before { content: ">"; position: absolute; left: 0; }

@media (max-width: 1199px) {
  .intro p { font-size: 22px; }
  .services-list__grid { grid-template-columns: repeat(2, 1fr); }
  .lead__title--sm { font-size: 34px; }
}
@media (max-width: 900px) {
  .intro { margin-top: 40px; }
  .intro p { font-size: 18px; }
  .services-list { margin-top: 70px; }
  .services-list__grid { grid-template-columns: 1fr; }
}

/* ---------- база знаний ---------- */

.aud--sm { min-height: 359px; padding: 28px 30px 34px; }
.aud--sm .aud__list { margin-top: 30px; }

.library { margin-top: 100px; }
.library__head { display: flex; align-items: baseline; justify-content: space-between; gap: 24px; }
.library__all { font-size: 14px; font-weight: 500; color: #212121; text-decoration: none; white-space: nowrap; }
.library__all:hover { color: var(--blue-700); }

.library__track {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 340px;
  gap: 20px;
  margin-top: 56px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding-bottom: 14px;
}
.library__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; margin-top: 56px; }

.lib {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 24px;
  min-height: 223px;
  padding: 24px 29px;
  border-radius: var(--r-md);
  background: var(--bg-soft);
  scroll-snap-align: start;
}
.lib__title { font-size: 20px; font-weight: 600; line-height: 1.2; color: #212121; }
.lib__foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.lib__logo { max-height: 32px; width: auto; }

.btn--pill {
  padding: 10px 24px;
  border: 1px solid #d5d5d5;
  border-radius: 29px;
  background: #fff;
  color: var(--gray-500);
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
}
.btn--pill:hover { border-color: var(--blue-500); color: var(--blue-500); }

.box {
  margin-top: 56px;
  padding: 40px;
  border-radius: var(--r-md);
  background: var(--bg-soft);
}
.box__lead { font-size: 26px; font-weight: 700; line-height: 1.37; color: var(--ink); max-width: 900px; }
.box__title { margin-top: 32px; font-size: 30px; font-weight: 700; line-height: 1.2; color: #212121; }
.box__text { margin-top: 18px; font-size: 20px; font-weight: 600; line-height: 1.35; color: #212121; max-width: 900px; }
.box__subtitle { margin-top: 26px; font-size: 20px; font-weight: 600; color: #212121; }
.box__cols { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px 40px; margin: 18px 0 32px; }
.box__cols li { position: relative; padding-left: 16px; font-size: 14px; line-height: 1.5; color: var(--ink-3); }
.box__cols li::before { content: "•"; position: absolute; left: 0; }

@media (max-width: 1199px) {
  .library__grid, .box__cols { grid-template-columns: 1fr; }
  .box__lead { font-size: 22px; }
  .box__title { font-size: 24px; }
}
@media (max-width: 900px) {
  .library { margin-top: 70px; }
  .library__track { grid-auto-columns: 280px; }
  .box { padding: 24px 20px; }
}

/* ---------- календарь мероприятий ---------- */

.why__grid--4 { grid-template-columns: repeat(4, 1fr); }
.why__card--plain { justify-content: center; gap: 0; min-height: 150px; }

.schedule { margin-top: 100px; }
.schedule__filters {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 40px;
}
.filter__label { display: block; margin-bottom: 10px; font-size: 16px; font-weight: 500; line-height: 1.12; color: #636363; }

.cal {
  margin-top: 40px;
  padding: 32px 40px 40px;
  border-radius: var(--r-sm);
  background: var(--bg-soft);
}
.cal__head { display: flex; align-items: baseline; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.cal__month { font-size: 26px; font-weight: 600; line-height: 1.12; color: var(--ink); }
.cal__today { font-size: 32px; font-weight: 600; color: var(--blue-700); }
.cal__today span { color: var(--gray-400); }

.cal__grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 8px;
  margin-top: 26px;
}
.cal__wd { padding: 6px 0; font-size: 16px; font-weight: 500; line-height: 1.12; color: var(--ink); text-align: center; }
.cal__day {
  height: 64px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 12px;
  background: #fff;
  color: #c5c5c5;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.12;
  cursor: pointer;
  transition: background-color .15s ease, color .15s ease;
}
.cal__day--empty { background: transparent; cursor: default; }
.cal__day--event { color: #575757; }
.cal__day:not(.cal__day--empty):hover { background: #dbe6f7; color: var(--blue-700); }
.cal__day--event:hover { background: var(--grad-blue); color: #fff; }

.events { margin-top: 100px; }
.events__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 44px; }

.event {
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 28px 24px;
  border-radius: var(--r-sm);
  background: var(--bg-soft);
}
.event__kind { font-size: 16px; font-weight: 500; line-height: 1.12; color: var(--blue-700); }
.event__title { font-size: 20px; font-weight: 600; line-height: 1.25; color: var(--ink); }
.event__meta { display: grid; gap: 12px; margin: 0; }
.event__meta dt { font-size: 16px; font-weight: 500; color: #636363; }
.event__meta dd { margin: 2px 0 0; font-size: 16px; color: var(--ink-3); }
.event .btn--pill { align-self: flex-start; margin-top: auto; }

@media (max-width: 1199px) {
  .why__grid--4 { grid-template-columns: repeat(2, 1fr); }
  .schedule__filters, .events__grid { grid-template-columns: 1fr 1fr; }
  .cal { padding: 24px 20px 28px; }
  .cal__today { font-size: 24px; }
}
@media (max-width: 900px) {
  .why__grid--4, .schedule__filters, .events__grid { grid-template-columns: 1fr; }
  .schedule, .events { margin-top: 70px; }
  .cal__day { font-size: 14px; border-radius: 8px; }
}

/* ---------- клуб «Я — предприниматель» ---------- */

.formats { margin-top: 100px; }
.formats__label { margin: 40px 0 18px; font-size: 30px; font-weight: 500; line-height: 1.12; color: var(--ink); }

.chips { display: flex; flex-wrap: wrap; gap: 12px; }
.chips li {                 /* «Форматы» — синие плашки макета */
  padding: 14px 28px;
  border-radius: 53px;
  background: var(--grad-blue);
  color: #fff;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.4;
}
.chips--soft li { background: #f2f4f7; color: #212121; }   /* «Темы» и условия участия */

.benefit {
  display: flex;
  align-items: center;
  min-height: 246px;
  padding: 32px 28px;
  border-radius: var(--r-sm);
  background: var(--bg-soft);
  scroll-snap-align: start;
}
.benefit p { font-size: 20px; font-weight: 600; line-height: 1.3; color: #212121; }
.benefit--sm { min-height: 164px; }
.benefit--sm p { font-size: 18px; }

.join {
  margin-top: 100px;
  padding: 8px 0 0;
  text-align: center;
}
.join__text { margin-top: 24px; font-size: 30px; font-weight: 500; line-height: 1.3; color: var(--ink-2); }
.join__note { margin-top: 16px; font-size: 16px; color: var(--gray-400); }
.join__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 20px; margin-top: 34px; }
.btn--lg { font-size: 20px; font-weight: 700; line-height: 1.4; padding: 15px 32px; }

.experts { margin-top: 100px; }
.experts__sub {
  display: inline-block;
  margin-top: 24px;
  padding: 17px 28px;
  border-radius: 53px;
  background: #236ddf;
  color: #fff;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.24;
}
.experts__group { margin: 56px 0 0; font-size: 30px; font-weight: 500; line-height: 1.12; color: var(--ink); }
.experts__group + .library__track { margin-top: 28px; }

.expert {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-height: 460px;
  padding: 28px 24px;
  border-radius: var(--r-sm);
  background: var(--bg-soft);
  scroll-snap-align: start;
}
.expert__photo { width: 120px; height: 120px; border-radius: 50%; object-fit: cover; background: #d9d9d9; }
.expert__name { font-size: 18px; font-weight: 500; color: var(--ink-3); }
.expert__role { font-size: 16px; font-weight: 500; line-height: 1.35; color: var(--ink-3); }
.expert__quote { margin-top: auto; font-size: 16px; font-weight: 600; line-height: 1.2; color: var(--blue-700); }

.gallery {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 44px;
}
.gallery img { width: 100%; height: 260px; object-fit: cover; border-radius: var(--r-sm); }

.contacts {
  margin-top: 100px;
  padding: 48px 60px;
  border-radius: var(--r-md);
  background: var(--grad-blue);
  color: #fff;
}
.contacts .h2 { color: #fff; }
.contacts__text { margin-top: 26px; font-size: 20px; line-height: 1.35; }
.contacts__addr { margin-top: 14px; font-size: 26px; font-weight: 600; }

.partners { margin-top: 100px; }
.partners__grid {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 40px;
  margin-top: 40px;
}
.partners__grid img { max-height: 80px; width: auto; }

@media (max-width: 1199px) {
  .gallery { grid-template-columns: repeat(2, 1fr); }
  .join, .contacts { padding: 32px 24px; }
  .join__text { font-size: 22px; }
  .experts__group { font-size: 24px; }
}
@media (max-width: 900px) {
  .formats, .experts, .join, .contacts, .partners { margin-top: 70px; }
  .gallery { grid-template-columns: 1fr; }
  .chips li { font-size: 15px; padding: 12px 20px; }
}

/* ---------- видеокарточки историй и отзывов ---------- */

.library__track--wide { grid-auto-columns: 380px; }

.videocard {
  display: flex;
  flex-direction: column;
  gap: 16px;
  scroll-snap-align: start;
}
.videocard img {
  width: 100%;
  height: 214px;
  object-fit: cover;
  border-radius: var(--r-xs);
  background: var(--bg-soft-2);
}
.videocard__title { font-size: 16px; font-weight: 500; line-height: 1.35; color: var(--ink-3); }

@media (max-width: 900px) {
  .library__track--wide { grid-auto-columns: 280px; }
  .videocard img { height: 170px; }
}

.event__art { width: 100%; height: 190px; object-fit: cover; border-radius: var(--r-xs); }

.event__org { font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--gray-400); }

.apply__title--sm { font-size: 40px; }

@media (max-width: 900px) {
  .apply { grid-template-columns: 1fr; }
  .apply__art { width: auto; max-width: 100%; margin: 24px auto 0; }
  .lead--lime .lead__title { font-size: 30px; }
}

@media (max-width: 640px) {
  .apply__intro, .form, .field, .select, .check { min-width: 0; }
  .lead__title, .h2, .apply__title { overflow-wrap: break-word; }
}

/* ============================================================
   МОБИЛЬНЫЕ УТОЧНЕНИЯ
   Макет нарисован только под десктоп 1400, поэтому фиксированные
   высоты карточек на узком экране превращаются в пустоту — снимаем их.
   ============================================================ */

@media (max-width: 900px) {
  .lead { min-height: 0; }

  .card { min-height: 0; padding: 24px 20px 22px; }
  .card__title { margin-bottom: 18px; max-width: none; }
  .card__list li { max-width: none; }
  .card__art { position: static; align-self: flex-end; width: 104px; margin: 18px 0 -6px; }
  .card__more { padding-top: 18px; }

  .aud, .aud--sm { min-height: 0; padding: 26px 22px 30px; }
  .person, .expert, .benefit, .benefit--sm { min-height: 0; }
  .story__bubble { min-height: 0; }

  .promo, .contacts { padding: 28px 20px; }
  .promo__title { font-size: 20px; }
  .contacts__addr { font-size: 22px; }

  /* номер шага не должен наезжать на карточку */
  .step { grid-template-columns: 44px 1fr; gap: 20px; }

  .why__card { min-height: 0; padding: 22px 20px; gap: 20px; }
  .service, .platform { padding: 22px 20px; }
  .lib { min-height: 0; padding: 22px 20px; }
  .box { padding: 24px 20px 28px; }
  .event { padding: 22px 18px; }
}

@media (max-width: 640px) {
  .h2 { font-size: 28px; }
  .lead__title { font-size: 28px; }
  .lead__text { font-size: 17px; }
  .lead--lime .lead__title { font-size: 28px; }
  .stat { padding: 22px 20px; }
  .stat__label { max-width: none; }
  .about__row { padding: 16px 4px 18px; }
  .about__title { font-size: 24px; }
  .about__text { font-size: 16px; }
  .intro p { font-size: 17px; }
  .experts__group, .formats__label { font-size: 22px; }
  .join__text { font-size: 20px; }
  .box__lead { font-size: 20px; }
  .box__title { font-size: 22px; }
  .box__text, .box__subtitle { font-size: 17px; }
}