/* ============================================================
   hero.css — компонент темы Kremlin Group
   Сгенерировано split-css.py из dist/css/style.css
   ============================================================ */


.content-hero .button--cta {
  background-color: #D4AF37
}

@keyframes heroRiseIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0,1.5rem,0);
    transform: translate3d(0,1.5rem,0)
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0)
  }
}

@keyframes heroSlideInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(3.75rem,0,0);
    transform: translate3d(3.75rem,0,0)
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0)
  }
}

@keyframes heroFadeIn {
  from {
    opacity: 0
  }
  to {
    opacity: 1
  }
}

@keyframes heroImageReveal {
  0% {
    -webkit-transform: scale(1.2) translate3d(0,1.875rem,0);
    transform: scale(1.2) translate3d(0,1.875rem,0);
    -webkit-filter: blur(.875rem);
    filter: blur(.875rem)
  }
  60% {
    -webkit-filter: blur(.125rem);
    filter: blur(.125rem)
  }
  100% {
    -webkit-transform: scale(1) translate3d(0,0,0);
    transform: scale(1) translate3d(0,0,0);
    -webkit-filter: blur(0);
    filter: blur(0)
  }
}

.section-hero {
  min-height: 100svh;
  position: relative;
  padding-top: 7.8125rem;
	padding-bottom: 3.125rem;
	display:flex;
	flex-direction: column;
	justify-content: center;
}

.section-hero__container {
  width: 100%;
  height: 100%;
	min-height: 46.875rem;
  display: flex;
  flex-direction: column;
  justify-content: center
}

.section-hero__content {
  position: relative;
  z-index: 1
}

.section-hero__blockquote {
  position: absolute;
  z-index: 1;
  color: #fff;
  border-radius: .3125rem;
  padding: 1.5625rem;
  right: 2.1875rem;
  bottom: 3rem;
  background: rgba(255,255,255,.1);
  border: .0625rem solid rgba(255,255,255,.2);
  backdrop-filter: blur(6px);
  opacity: 0;
  will-change: transform,opacity
}

.loaded .section-hero__blockquote {
  -webkit-animation: heroSlideInRight 1.1s cubic-bezier(.22,1,.36,1) 2s both;
  animation: heroSlideInRight 1.1s cubic-bezier(.22,1,.36,1) 2s both
}

.section-hero__blockquote blockquote {
  font-size: .875rem;
  font-style: italic;
  line-height: 1.6;
  font-weight: 500
}

.section-hero__image {
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden
}

.section-hero__image img,
.section-hero__image video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center
}

.section-hero__image::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg,rgba(26,28,28,.9) 0,rgba(26,28,28,.4) 50%,rgba(26,28,28,0) 100%);
  z-index: 1
}

.content-hero {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.875rem;
  max-width: 35.625rem
}

.content-hero>*:not(.content-hero__tracking) {
  opacity: 0;
  will-change: transform,opacity
}

.loaded .content-hero>*:not(.content-hero__tracking) {
  -webkit-animation-name: heroRiseIn;
  animation-name: heroRiseIn;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: cubic-bezier(.33,1,.68,1);
  animation-timing-function: cubic-bezier(.33,1,.68,1);
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both
}

.loaded .content-hero__label {
  -webkit-animation-delay: .5s;
  animation-delay: .5s
}

.loaded .content-hero__title {
  -webkit-animation-delay: .75s;
  animation-delay: .75s
}

.loaded .content-hero__subtitle {
  -webkit-animation-delay: 1s;
  animation-delay: 1s
}

.loaded .content-hero__cta {
  -webkit-animation-delay: 1.15s;
  animation-delay: 1.15s
}

.content-hero__label {
  font-size: .625rem;
  text-transform: uppercase;
  color: #fff;
  font-weight: 700;
  padding: .625rem .9375rem;
  background-color: #d4af37;
  border-radius: .3125rem;
  letter-spacing: .0625rem
}

.content-hero__title {
  font-family: Manrope,sans-serif;
  color: #fff;
  line-height: 1;
  font-weight: 700;
  text-transform: capitalize;
  line-height: 1.2
}

.content-hero__title strong {
  color: #a81111
}

.content-hero__subtitle {
  display: flex;
  flex-direction: column;
  color: #fff;
  line-height: 1.5
}

.content-hero__subtitle strong {
  color: #a81111;
  font-weight: 800
}

.tracking-hero {
  display: flex;
  gap: 1.5625rem
}

.tracking-hero__item {
  display: flex;
  align-items: center;
  gap: .9375rem;
  padding: 1rem;
  background: rgba(255,255,255,.1);
  border: .0625rem solid rgba(255,255,255,.2);
  backdrop-filter: blur(6px);
  border-radius: .3125rem;
  opacity: 0;
  will-change: opacity
}

.loaded .tracking-hero__item {
  -webkit-animation: heroFadeIn 1s cubic-bezier(.22,1,.36,1) both;
  animation: heroFadeIn 1s cubic-bezier(.22,1,.36,1) both
}

.loaded .tracking-hero__item:nth-child(1) {
  -webkit-animation-delay: 1.25s;
  animation-delay: 1.25s
}

.loaded .tracking-hero__item:nth-child(2) {
  -webkit-animation-delay: 1.5s;
  animation-delay: 1.5s
}

.tracking-hero__icon {
  flex: 0 1 3.125rem;
  width: 3.125rem;
  height: 3.125rem;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #D4AF37;
  border-radius: .3125rem
}

.tracking-hero__icon img {
  max-width: 1.25rem
}

.tracking-hero__location {
  font-size: .625rem;
  color: #fff;
  font-weight: 500;
  letter-spacing: .0625rem;
  line-height: 1.5;
  opacity: .7;
  text-transform: uppercase
}

.tracking-hero__delivery {
  font-size: 1.25rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.5
}

@media (min-width:91.875em) {
.content-hero__title {
    font-size: 6rem
  }
  .content-hero__subtitle {
    font-size: 1.25rem
  }
  .content-hero__subtitle strong {
    font-size: 1.375rem
  }
}

@media (max-width:20em) {
.content-hero__title {
    font-size: 2.125rem
  }
  .content-hero__subtitle {
    font-size: .875rem
  }
  .content-hero__subtitle strong {
    font-size: 1rem
  }
}

@media (max-width:47.99875em) {
.section-hero {
    padding-top: 3.125rem
  }
  .section-hero__blockquote blockquote {
    font-size: .75rem
  }
  .section-hero__blockquote {
    padding: .9375rem;
    right: .9375rem;
    bottom: .625rem
  }
  .tracking-hero__item {
    padding: .625rem;
    gap: .625rem
  }
  .tracking-hero__icon {
    flex: 0 1 2.1875rem;
    width: 2.1875rem;
    height: 2.1875rem
  }
  .tracking-hero__icon img {
    max-width: .9375rem
  }
  .tracking-hero__delivery {
    font-size: .875rem
  }
}

@media (max-width:29.99875em) {
.content-hero {
    gap: .9375rem
  }
  .tracking-hero {
    gap: .9375rem;
    flex-wrap: wrap
  }
}

@media (min-width:20em)and (max-width:91.875em) {
.content-hero__title {
    font-size: clamp(2.125rem ,1.0467391304rem + 5.3913043478vw ,6rem)
  }
  .content-hero__subtitle {
    font-size: clamp(.875rem ,.7706521739rem + .5217391304vw ,1.25rem)
  }
  .content-hero__subtitle strong {
    font-size: clamp(1rem ,.8956521739rem + .5217391304vw ,1.375rem)
  }
}

@media (any-hover:hover) {
.content-hero .button--cta:hover {
    background-color: #000
  }
}

@media (prefers-reduced-motion:reduce) {
.loaded .content-hero>*,
  .loaded .section-hero__blockquote,
  .loaded .tracking-hero__item {
    -webkit-animation: none;
    animation: none;
    opacity: 1;
    -webkit-transform: none;
    transform: none
  }
}
