.macro-hero {
  background: var(--hero-bg);
  /* высота ровно "экран минус хедер": хедер в потоке занимает верх (--header-h),
     hero прижат вплотную под ним → хедер + hero ≈ 100vh первого экрана */
  min-height: calc(100vh - var(--header-h, 81px));
  display: flex;
  flex-direction: column;
}

.macro-hero__photo {
  position: absolute; inset: 0;
  background-size: cover; background-position: center top;
  z-index: 0;
}
.macro-hero__wash {
  position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(100deg,
    rgba(248,250,252,.95) 0%,
    rgba(248,250,252,.82) 34%,
    rgba(248,250,252,.4) 56%,
    rgba(248,250,252,0) 78%);
}
.macro-hero__glow-1 {
  left: -8%; top: 12%; width: 520px; height: 520px;
  background: radial-gradient(circle, rgba(61,110,224,.34), transparent 66%);
  animation: mc-float1 13s ease-in-out infinite;
}
.macro-hero__glow-2 {
  left: 24%; bottom: -14%; width: 440px; height: 440px;
  background: radial-gradient(circle, rgba(205,83,52,.24), transparent 66%);
  animation: mc-float2 16s ease-in-out infinite;
}
.macro-hero__grid {
  -webkit-mask-image: linear-gradient(100deg, rgba(0,0,0,.5) 0%, transparent 46%);
  mask-image: linear-gradient(100deg, rgba(0,0,0,.5) 0%, transparent 46%);
}
.macro-hero__dissolve {
  position: absolute; left: 0; right: 0; bottom: 0; height: 240px; z-index: 2;
  background: linear-gradient(to bottom, rgba(255,255,255,0), #fff 92%);
}

.macro-hero__content {
  flex: 1; z-index: 3;
  display: flex; flex-direction: column; justify-content: center;
  padding: 64px 0 56px;
}

.macro-hero__title {
  font-size: clamp(38px, 4.6vw, 66px);
  line-height: 1.04; font-weight: 800; letter-spacing: -.5px;
  text-transform: uppercase; margin: 0;
  text-shadow: 0 1px 24px rgba(248,250,252,.8);
}
.macro-hero__title-1 { color: var(--primary-macro); }
.macro-hero__title-2 { color: var(--brand); }

.macro-hero__rule {
  width: 210px; height: 3px; background: var(--accent);
  margin: 26px 0 34px; border-radius: 2px;
}

.macro-hero__bottom { gap: 48px; }

.macro-hero__lead {
  max-width: 520px; margin: 0;
  font-size: 18px; line-height: 1.6; color: var(--text-2);
}
.macro-hero__lead strong { color: #172747; font-weight: 700; }

.macro-hero__cta {
  min-width: 420px; gap: 60px;
  box-shadow: 0 14px 34px rgba(205,83,52,.32);
}

@media (max-width: 991px) {
  .macro-hero__content { padding: 48px 0 48px; }
}
@media (max-width: 767px) {
  .macro-hero {
    /* тоже экран минус хедер, но с запасом контента (min-height не режет) */
    min-height: calc(100vh - var(--header-h, 81px));
  }
  .macro-hero__content { padding: 40px 0 40px; }
  .macro-hero__bottom { gap: 28px; }
  .macro-hero__cta { min-width: 100%; width: 100%; gap: 1rem; }
}