
section.hero-block {
  position: relative;
  z-index: 1;
  overflow: hidden;
  padding-top: 180px;
  padding-bottom: 326px;
}
@media screen and (max-width: 1000px) {
  section.hero-block {
    padding-top: 130px;
    padding-bottom: 180px;
  }
}
@media screen and (max-width: 550px) {
  section.hero-block {
    padding-bottom: 140px;
    margin-bottom: 4rem;
  }
}
section.hero-block.order-reverse {
  flex-direction: row-reverse;
}
@media screen and (max-width: 1000px) {
  section.hero-block.order-reverse {
    flex-direction: column;
  }
}
section.hero-block.curve:before {
  mask-image: url("data:image/svg+xml,%3Csvg preserveAspectRatio='none' width='1408' height='1270' viewBox='0 0 1408 1270' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_0_42)'%3E%3Cpath d='M1408 1086H0V1087.8C0 1095.9 6.05811 1102.72 14.1044 1103.68L1390.1 1267.86C1399.62 1269 1408 1261.57 1408 1251.98V1086Z' fill='%2313362F'/%3E%3Cpath d='M0 16C0 7.16344 7.16344 0 16 0H1392C1400.84 0 1408 7.16344 1408 16V1086H0V16Z' fill='%2313362F'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_0_42'%3E%3Crect width='1408' height='1270' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
  mask-repeat: no-repeat;
  mask-position: 0px 0px;
  mask-size: 100% 96%;
  border-radius: none;
}
@media screen and (max-width: 768px) {
  section.hero-block.curve:before {
    mask-size: 100% 100%;
    mask-image: url("data:image/svg+xml,%3Csvg width='374' height='785' viewBox='0 0 374 785' preserveAspectRatio='none' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_28_440)'%3E%3Cpath d='M374 738H0C0 740.425 1.8126 742.466 4.22007 742.754L356.104 784.74C365.625 785.876 374 778.44 374 768.852V738Z' fill='%2313362F'/%3E%3Cpath d='M0 16C0 7.16346 7.16344 0 16 0H358C366.837 0 374 7.16344 374 16V738H0V16Z' fill='%2313362F'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_28_440'%3E%3Crect width='374' height='785' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
  }
}
section.hero-block:before {
  display: block;
  content: "";
  position: absolute;
  top: 1rem;
  left: 1rem;
  width: calc(100% - 2rem);
  height: calc(100% - 2rem);
  background-image: url("https://www.aristacereals.com/wp-content/uploads/2025/10/Noise-1.png");
  background-repeat: repeat;
  background-color: #13362F;
  border-top-right-radius: 1rem;
  border-top-left-radius: 1rem;
}
@media screen and (max-width: 1280px) {
  section.hero-block:before {
    height: 100%;
    left: 0.5rem;
    top: 0.5rem;
    width: calc(100% - 1rem);
    height: calc(100% - 1rem);
  }
}
section.hero-block:after {
  display: block;
  content: "";
  position: absolute;
  width: 100vw;
  height: 100%;
  top: 0px;
  left: 50%;
  transform: translateX(-50%) scale(0.8);
  opacity: 0;
  background-position: 50% 0px;
  background-repeat: no-repeat;
  animation: fadeIn 1.7s ease-out 0.25s forwards;
  background-image: url("data:image/svg+xml,%3Csvg width='1408' height='1241' viewBox='0 0 1408 1241' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg filter='url(%23filter0_f_1_359)'%3E%3Cpath d='M759.872 589.724V806.293C759.872 823.841 740.127 834.111 725.785 824.024L497.692 663.596C420.436 609.259 374.616 520.525 375.002 426.004L375.871 213.704C375.943 196.272 395.5 186.056 409.823 195.968L635.379 352.059C713.339 406.011 759.872 494.844 759.872 589.724Z' stroke='%23ECF4DC' stroke-opacity='0.2' stroke-width='224'/%3E%3Cpath d='M759.496 425.872V587.181C759.496 604.728 779.241 614.999 793.583 604.911L965.847 483.75C1027.65 440.28 1064.31 369.293 1064 293.677L1063.35 135.617C1063.28 118.185 1043.72 107.969 1029.4 117.881L859.09 235.741C796.722 278.902 759.496 349.968 759.496 425.872Z' stroke='%23ECF4DC' stroke-opacity='0.2' stroke-width='224'/%3E%3C/g%3E%3Cdefs%3E%3Cfilter id='filter0_f_1_359' x='-37' y='-298.211' width='1513' height='1538.43' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='BackgroundImageFix' result='shape'/%3E%3CfeGaussianBlur stdDeviation='150' result='effect1_foregroundBlur_1_359'/%3E%3C/filter%3E%3C/defs%3E%3C/svg%3E");
}
@media screen and (max-width: 768px) {
  section.hero-block:after {
    transform: translateX(-50%) scale(1);
    opacity: 1;
  }
}
@media screen and (min-width: 768px) {
  @keyframes fadeIn {
    0% {
      opacity: 0;
      transform: translateX(-50%) scale(0.8);
    }
    100% {
      opacity: 1;
      transform: translateX(-50%) scale(1);
    }
  }
}
section.hero-block .container {
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 5rem;
  position: relative;
}
@media screen and (max-width: 1000px) {
  section.hero-block .container {
    gap: 3rem;
    flex-direction: column;
    mask-size: 100% 100%;
  }
}
section.hero-block .container .wrapper-content {
  max-width: calc(50% - 2.5rem);
  width: 100%;
  position: relative;
  z-index: 2;
}
@media screen and (max-width: 1000px) {
  section.hero-block .container .wrapper-content {
    max-width: 100%;
    
  }
}
section.hero-block .container .wrapper-content .richtext {
  max-width: 100%;
}
section.hero-block .container .wrapper-content .richtext * {
  color: #F8F8EA;
}
@media screen and (max-width: 768px) {
  section.hero-block .container .wrapper-content .richtext * {
    text-align: center !important;
  }
}
section.hero-block .container .wrapper-content .richtext p,
section.hero-block .container .wrapper-content .richtext a,
section.hero-block .container .wrapper-content .richtext ul {
  opacity: 0;
}
section.hero-block .container .wrapper-content .wrapper-buttons {
  margin-top: 3rem;
  gap: 1.5rem;
  opacity: 0;
}
@media screen and (max-width: 768px) {
  section.hero-block .container .wrapper-content .wrapper-buttons {
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.5rem 1.5rem;
  }
}
section.hero-block .container .wrapper-media {
  width: 100%;
  max-width: 1000px;
  height: 650px;
  position: relative;
  z-index: 2;
  pointer-events: none;
  opacity: 0;
  border-radius: 1rem;
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  section.hero-block .container .wrapper-media {
    max-width: 100%;
    height: 370px;
    
  }
}
section.hero-block .container .wrapper-media .wrapper-image {
  width: 100%;
  height: 100%;
  position: relative;
}
section.hero-block .container .wrapper-media .wrapper-image img {
  width: 100%;
  height: 100%;
  transform: scale(1.3);
}