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

.seousluga-hero {
  --seousluga-hero-green: #028249;
  --seousluga-hero-white: #fff;
  --seousluga-hero-image-position: 50% 50%;
  --seousluga-hero-mobile-position: 50% 50%;

  position: relative;
  isolation: isolate;
  display: grid;
  place-items: center;
  width: 100%;
  min-height: clamp(620px, 82svh, 900px);
  overflow: hidden;
  color: var(--seousluga-hero-white);
}

.seousluga-hero__media,
.seousluga-hero__canvas,
.seousluga-hero__shade,
.seousluga-hero__grass-static,
.seousluga-hero__soil {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.seousluga-hero__media {
  z-index: 0;
  overflow: hidden;
  opacity: 0;
  transform: scale(1.025) translateZ(0);
  backface-visibility: hidden;
  will-change: opacity, transform;
  transition:
    opacity .85s cubic-bezier(.25, 1, .5, 1),
    transform 1.4s cubic-bezier(.16, 1, .3, 1);
}

.seousluga-hero.is-ready .seousluga-hero__media {
  opacity: 1;
  transform: scale(1) translateZ(0);
}

.seousluga-hero.is-settled .seousluga-hero__media {
  will-change: auto;
}

.seousluga-hero__soil,
.seousluga-hero__grass-static {
  object-fit: cover;
  object-position: var(--seousluga-hero-image-position);
  user-select: none;
  pointer-events: none;
  -webkit-user-drag: none;
}

.seousluga-hero__soil {
  z-index: 0;
}

.seousluga-hero__grass-static {
  z-index: 1;
  display: none;
}

.seousluga-hero__canvas {
  z-index: 1;
  pointer-events: none;
}

.seousluga-hero__shade {
  z-index: 2;
  pointer-events: none;
  background:
    linear-gradient(
      180deg,
      rgba(8, 10, 7, .22),
      rgba(8, 10, 7, .08) 36%,
      rgba(8, 10, 7, .42)
    ),
    radial-gradient(
      circle at 50% 51%,
      rgba(0, 0, 0, .05) 0 34%,
      rgba(0, 0, 0, .25) 100%
    );
}

.seousluga-hero__content {
  position: relative;
  z-index: 3;
  width: min(1500px, 100%);
  margin-inline: auto;
  padding: clamp(72px, 10vh, 120px) clamp(20px, 5vw, 76px);
  text-align: center;
  opacity: 0;
  transform: translate3d(0, 18px, 0);
  transition:
    opacity .8s cubic-bezier(.16, 1, .3, 1) .1s,
    transform .95s cubic-bezier(.16, 1, .3, 1) .1s;
}

.seousluga-hero.is-ready .seousluga-hero__content {
  opacity: 1;
  transform: none;
}

.seousluga-hero__title {
  margin-top: 0;
  color: #fff !important;
  font-size: clamp(40px, 7.65vw, var(--seousluga-title-max-size, 110px)) !important;
  line-height: 1.06;
  text-wrap: balance;
  background: transparent !important;
}

.seousluga-hero__title--custom-size {
  font-size: clamp(40px, 7.65vw, var(--seousluga-title-max-size)) !important;
}

.seousluga-hero__title--custom-color {
  color: var(--seousluga-title-color) !important;
}

.seousluga-hero__title--custom-line-height {
  line-height: var(--seousluga-title-line-height) !important;
}

.seousluga-hero__title--custom-max-width {
  max-width: var(--seousluga-title-max-width) !important;
}

.seousluga-hero__title--custom-align {
  text-align: var(--seousluga-title-align) !important;
}

.seousluga-hero__title--custom-mobile-size {
  font-size: var(--seousluga-title-mobile-size) !important;
}

.seousluga-hero__first-word {
  color: #d59c39;
}

.seousluga-hero__lead {
  max-width: 1120px;
  margin: clamp(24px, 4vh, 42px) auto 0;
  color: rgba(255, 255, 255, .94);
  font-size: clamp(17px, calc(13px + .8vw), var(--seousluga-subtitle-max-size, 24px));
  font-weight: var(--seousluga-subtitle-weight, 600);
  line-height: 1.55;
  text-wrap: balance;
  text-shadow: 0 2px 18px rgba(0, 0, 0, .9);
}

.seousluga-hero__lead--custom-size {
  font-size: clamp(17px, calc(13px + .8vw), var(--seousluga-subtitle-max-size)) !important;
}

.seousluga-hero__lead--custom-color {
  color: var(--seousluga-subtitle-color) !important;
}

.seousluga-hero__lead--custom-mobile-size {
  font-size: var(--seousluga-subtitle-mobile-size) !important;
}

.seousluga-hero__actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px;
  width: min(1240px, 100%);
  margin: clamp(30px, 5vh, 48px) auto 0;
}

.seousluga-hero__button {
  display: inline-flex;
  min-height: 58px;
  align-items: center;
  justify-content: center;
  padding: 16px 28px;
  color: #fff;
  font-size: clamp(.88rem, .95vw, 1rem);
  font-weight: 800;
  letter-spacing: .14em;
  line-height: 1.2;
  text-decoration: none;
  text-transform: uppercase;
  border: 1px solid transparent;
  border-radius: 999px;
  background: var(--seousluga-hero-green);
  box-shadow: 0 14px 34px rgba(2, 130, 73, .28);
  transition:
    transform .35s cubic-bezier(.16, 1, .3, 1),
    background-color .35s ease,
    color .35s ease,
    box-shadow .35s cubic-bezier(.16, 1, .3, 1);
}

.seousluga-hero__button--light {
  color: #171717;
  border-color: rgba(255, 255, 255, .75);
  background: rgba(255, 255, 255, .78);
  box-shadow: 0 14px 34px rgba(0, 0, 0, .16);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

@media (hover: hover) and (pointer: fine) {
  .seousluga-hero__button:hover {
    color: #fff;
    transform: translateY(-2px);
    background: #039556;
    box-shadow: 0 20px 42px rgba(2, 130, 73, .38);
  }

  .seousluga-hero__button--light:hover {
    color: var(--seousluga-hero-green);
    background: #fff;
    box-shadow: 0 20px 42px rgba(0, 0, 0, .22);
  }
}

.seousluga-hero.is-static .seousluga-hero__grass-static {
  display: block;
}

.seousluga-hero.is-static .seousluga-hero__canvas {
  display: none;
}

/* Только адаптивная геометрия. Canvas здесь НЕ отключается. */
@media (max-width: 767px) {
  .seousluga-hero {
    min-height: clamp(560px, 78svh, 760px);
  }

  .seousluga-hero__soil,
  .seousluga-hero__grass-static {
    object-position: var(--seousluga-hero-mobile-position);
  }

  .seousluga-hero__content {
    padding: 70px 18px 54px;
  }

  .seousluga-hero__lead {
    max-width: 38rem;
  }

  .seousluga-hero__actions {
    grid-template-columns: 1fr;
    gap: 12px;
    width: min(440px, 100%);
  }

  .seousluga-hero__button {
    min-height: 56px;
    font-size: .88rem;
  }
}

/* Touch — статичная версия. */
@media (hover: none), (pointer: coarse) {
  .seousluga-hero__grass-static {
    display: block;
  }

  .seousluga-hero--mobile-soil .seousluga-hero__grass-static {
    display: none;
  }

  .seousluga-hero__canvas {
    display: none;
  }

  .seousluga-hero__button--light {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .seousluga-hero__button,
  .seousluga-hero__content,
  .seousluga-hero__media {
    transition: none !important;
    transform: none !important;
  }

  .seousluga-hero__content {
    opacity: 1;
  }

  .seousluga-hero__grass-static {
    display: block;
  }

  .seousluga-hero--mobile-soil .seousluga-hero__grass-static {
    display: none;
  }

  .seousluga-hero__canvas {
    display: none;
  }
}