:root {
  --navy: #11367a;
  --blue: #335cab;
  --light: #e8f1f7;
  --aqua: #dfeff2;
  --orange: #e3704d;
  --ink: #172b47
}


a:focus-visible,
.steps__carousel:focus-visible {
  outline: 3px solid #466cff;
  outline-offset: 3px
}

main {
  width: 1440px;
  margin: 0 auto;
  overflow: hidden
}

h1,
h2,
h3,
p {
  margin: 0
}

.mobile {
  display: none
}

.hero {
  height: 790px;
  background: var(--light);
  position: relative;
  overflow: hidden
}

.hero__copy {
  position: absolute;
  left: 64px;
  top: 100px;
  width: 703px;
  z-index: 2
}

.hero h1 {
  font-size: 58px;
  font-weight: 900;
  line-height: 64px;
  letter-spacing: 0;
  width: 703px;
  text-align: left;
  color: var(--navy);
  
}

.hero__intro {
  position: absolute;
  top: 220px;
  left: 0;
  width: 500px;
  font-size: 22px;
  font-weight: 400;
  line-height: 32.56px;
  text-align: left;
  color: var(--navy);
}

.hero__offer {
  position: absolute;
  top: 346px;
  left: 0;
  width: 540px;
  font-size: 19px;
  font-weight: 600;
  line-height: 26.6px;
  color: var(--blue)
}

.store-links {
  display: flex;
  gap: 12px;
  align-items: center
}

.store-link {
  display: block;
  flex: 0 0 auto;
  width: 180px;
  height: 54px
}

.store-link img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain
}

.hero__stores {
  position: absolute;
  left: 0;
  top: 428px
}

.hero__visual {
  position: absolute;
  left: 694px;
  top: 0;
  width: 746px;
  height: 790px
}

.hero__number {
  position: absolute;
  left: 7px;
  top: 163px;
  display: block;
  width: 789px;
  height: 360px;
  font-size: 400px;
  line-height: 330px;
  letter-spacing: -.07em;
  font-weight: 900;
  color: var(--blue);
  white-space: nowrap
}

.hero__number-caption {
  position: absolute;
  left: 7px;
  top: 502px;
  font-size: 20px;
  line-height: 27px;
  font-weight: 700;
  color:var(--navy);
}

.hero__phone {
  position: absolute;
  left: 900px;
  top: 50px;
  width: 540px;
  height: 810px;
  object-fit: contain;
  z-index: 1
}

.qr-block {
  display: flex;
  align-items: center;
  gap: 16px;
  color: var(--ink);
  font-size: 14px;
  line-height: 18.9px
}

.qr-block__image {
  display: grid;
  place-items: center;
  width: 112px;
  height: 115px;
  flex: 0 0 112px;
  background: #fff;
  border-radius: 12px
}

.qr-block__image img {
  display: block;
  width: 99px;
  height: 99px
}

.hero__qr {
  position: absolute;
  left: 64px;
  top: 607px;
  width: 620px;
  height: 115px
}

.steps {
  height: 791px;
  position: relative;
  background: #fff
}

.steps__heading {
  position: absolute;
  left: 64px;
  top: 72px;
  width: 1312px;
  height: 59px
}

.steps h2 {
  font-size: 52px;
  line-height: 58.24px;
  font-weight: 900
}

.steps__heading p {
  position: absolute;
  left: 904px;
  top: 3px;
  width: 403px;
  font-size: 30px;
  line-height: 28px;
  font-weight: 400
}

.steps__carousel {
  position: absolute;
  left: 64px;
  top: 179px;
  width: 1312px;
  height: 466px;
  display: grid;
  grid-template-columns: repeat(3, 416px);
  gap: 32px;
  outline: none
}

.step {
  width: 416px;
  height: 466px;
  position: relative
}

.step__heading {
  position: absolute;
  left: 0;
  top: 0;
  width: 416px;
  height: 68px
}

.step__number {
  position: absolute;
  left: 0;
  top: 0;
  width: 40px;
  height: 39px;
  border-radius: 20px;
  display: grid;
  place-items: center;
  background: var(--blue);
  color: #fff;
  font-size: 16px;
  line-height: 22.4px;
  font-weight: 600
}

.step h3 {
  position: absolute;
  left: 56px;
  top: 0;
  width: 360px;
  color:var(--navy) ;
  font-size: 24px;
  line-height: 33.6px;
  font-weight: 700
}

.step__description {
  position: absolute;
  left: 0;
  top: 88px;
  color: var(--navy);
  width: 416px;
  height: 76px;
  font-size: 18px;
  line-height: 25.2px;
  font-weight: 400
}

.step__picture {
  position: absolute;
  left: 0;
  top: 184px;
  width: 416px;
  height: 282px;
  background: var(--aqua);
  border-radius: 16px;
  overflow: hidden
}

.screen-crop {
  position: absolute;
  overflow: hidden;
  border-radius: 10px
}

.screen-crop img {
  position: absolute;
  display: block;
  max-width: none
}

.screen-crop--cart {
  left: 16px;
  top: 93.727px;
  width: 384px;
  height: 94.545px
}

.screen-crop--cart img {
  left: -23.273px;
  top: -173.818px;
  width: 425.455px;
  height: 920.727px
}

.screen-crop--delivery {
  left: 16px;
  top: 118.808px;
  width: 384px;
  height: 127.385px;
  background: #fff
}

.screen-crop--delivery img {
  left: -19.938px;
  top: -290.585px;
  width: 432px;
  height: 934.892px
}

.screen-crop--payment {
  left: 16px;
  top: 23.486px;
  width: 384px;
  height: 235.028px
}

.screen-crop--payment img {
  left: -19.525px;
  top: -235.028px;
  width: 423.051px;
  height: 915.525px
}

.delivery-date {
  position: absolute;
  left: 16px;
  top: 35.808px;
  width: 384px;
  height: 75px;
  background: #fff;
  border-radius: 10px;
  z-index: 1;
  color: #1f1f1f
}

.delivery-date strong {
  position: absolute;
  top: 0;
  left: 0;
  font-size: 18px;
  line-height: 22px;
  font-weight: 600
}

.delivery-date span {
  position: absolute;
  left: 0;
  top: 32px;
  width: 90px;
  height: 43px;
  border: 1px solid #466cff;
  border-radius: 12px;
  display: grid;
  place-items: center;
  color: #4f5766;
  font-size: 14px;
  font-weight: 600
}

.steps__footer {
  position: absolute;
  left: 64px;
  top: 693px;
  width: 1312px;
  height: 54px
}

.steps__footer p {
  color: var(--navy);
  font-size: 18px;
  line-height: 25.2px;
  font-weight: 600
}

.steps__footer .store-links {
  position: absolute;
  left: 932px;
  top: -14px
}

.repeat {
  height: 340px;
  background: var(--navy);
  color: #fff;
  position: relative
}

.repeat__inner {
  position: absolute;
  left: 64px;
  top: 80px;
  width: 1312px;
  height: 180px
}

.repeat__copy {
  width: 624px
}

.akva-app-page  .repeat h2 {
  font-size: 44px;
  line-height: 50.6px;
  font-weight: 900;
  color:#fff !important;
  text-align: left;
  
}

.repeat p {
  width: 560px;
  margin-top: 20px;
  font-size: 20px;
  line-height: 29px;
  font-weight: 400
}

.repeat__preview {
  position: absolute;
  left: 688px;
  top: 35.111px;
  width: 624px;
  height: 109.778px;
  overflow: hidden;
  border-radius: 20px
}

.repeat__preview img {
  position: absolute;
  left: -26px;
  top: -161.778px;
  width: 676px;
  height: 1341.022px;
  max-width: none
}

.bonus {
  height: 556px;
  background: #fff;
  position: relative
}

.bonus__inner {
  position: absolute;
  left: 64px;
  top: 56px;
  width: 1312px;
  height: 444px
}

.bonus__figure {
  position: absolute;
  left: 0;
  top: 84.5px;
  width: 568px;
  height: 275px
}

.bonus__figure span {
  display: block;
  width: 568px;
  height: 228px;
  color: var(--orange);
  font-size: 300px;
  line-height: 228px;
  letter-spacing: -.07em;
  font-weight: 400;
  white-space: nowrap
}

.bonus__figure p {
  position: absolute;
  left: 0;
  top: 240px;
  width: 568px;
  font-size: 28px;
  line-height: 35px;
  font-weight: 600;
  color:var(--navy);
}

.bonus__copy {
  position: absolute;
  left: 648px;
  top: 0;
  width: 664px;
  height: 444px
}

.bonus h2 {
  width: 664px;
  font-size: 42px;
  line-height: 47.04px;
  font-weight: 900
}

.bonus__intro {
  position: absolute;
  left: 0;
  top: 119px;
  width: 664px;
  font-size: 20px;
  line-height: 28px;
  color: var(--ink)
}

.bonus__copy>.store-links {
  position: absolute;
  left: 0;
  top: 199px
}

.bonus__qr {
  position: absolute;
  left: 0;
  top: 277px;
  width: 620px;
  height: 115px
}

.bonus__terms {
  position: absolute;
  left: 0;
  top: 416px;
  width: 620px;
  font-size: 12px;
  line-height: 14px;
  color: var(--ink)
}

@media(max-width:1099px) {
  main {
    width: 100%;
    max-width: 390px;
    margin: 0 auto
  }

  .desktop {
    display: none
  }

  .mobile {
    display: inline
  }

  .hero {
    height: 554px
  }

  .hero__copy {
    left: 0;
    top: 32px;
    width: 390px
  }

  .hero h1 {
    position: absolute;
    left: 24px;
    top: 1px;
    width: 342px;
    height: 152px;
    font-size: 34px;
    line-height: 38px;
    font-weight: 900
  }

  .hero__intro {
    left: 23px;
    top: 189px;
    width: 264px;
    height: 95px;
    font-size: 16px;
    line-height: 23.68px
  }

  .hero__offer {
    left: 24px;
    top: 320px;
    width: 342px;
    height: 68px;
    color: var(--orange);
    font-size: 24px;
    line-height: 22.4px;
    font-weight: 600;
    text-align: center
  }

  .hero__stores {
    left: 33px;
    top: 427px;
    gap: 12px
  }

  .store-link {
    width: 155px;
    height: 46.5px
  }

  .hero__visual,
  .hero__qr {
    display: none
  }

  .hero__phone {
    left: 264px;
    top: 62px;
    width: 155px;
    height: 232.5px
  }

  .steps {
    height: 718.5px
  }

  .steps__heading {
    left: 24px;
    top: 40px;
    width: 342px;
    height: 100px
  }

  .steps h2 {
    font-size: 30px;
    line-height: 33.6px
  }

  .steps__heading p {
    left: 0;
    top: 50px;
    width: 342px;
    font-size: 18px;
    line-height: 25px
  }

  .steps__carousel {
    left: 0;
    top: 164px;
    width: 390px;
    height: 381px;
    display: flex;
    gap: 16px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 24px;
    padding: 0 48px 0 24px;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
    outline: none
  }

  .steps__carousel::-webkit-scrollbar {
    display: none
  }

  .step {
    flex: 0 0 318px;
    width: 318px;
    height: 381px;
    scroll-snap-align: start
  }

  .step__heading {
    width: 318px;
    height: 58px
  }

  .step__number {
    top: 11.061px;
    width: 37.193px;
    height: 35.877px;
    border-radius: 18.596px;
    font-size: 14.877px;
    line-height: 20.828px
  }

  .step h3 {
    left: 52.07px;
    top: 2px;
    width: 265.93px;
    font-size: 20px;
    line-height: 27px
  }

  .step:first-child h3 {
    top: 15.5px
  }

  .step__description {
    top: 70px;
    width: 318px;
    height: 69px;
    font-size: 16px;
    line-height: 23px
  }

  .step__picture {
    top: 151px;
    width: 318px;
    height: 230px;
    border-radius: 14.877px
  }

  .screen-crop {
    border-radius: 9.298px
  }

  .screen-crop--cart {
    left: 14.877px;
    top: 79.515px;
    width: 288.246px;
    height: 70.97px
  }

  .screen-crop--cart img {
    left: -17.469px;
    top: -130.475px;
    width: 319.363px;
    height: 691.134px
  }

  .screen-crop--delivery {
    left: 14.877px;
    top: 103.646px;
    width: 288.246px;
    height: 95.62px
  }

  .screen-crop--delivery img {
    left: -14.966px;
    top: -218.124px;
    width: 324.276px;
    height: 701.767px
  }

  .screen-crop--payment {
    left: 14.877px;
    top: 26.789px;
    width: 288.246px;
    height: 176.422px
  }

  .screen-crop--payment img {
    left: -14.656px;
    top: -176.422px;
    width: 317.559px;
    height: 687.23px
  }

  .delivery-date {
    left: 14.877px;
    top: 30.734px;
    width: 288.246px;
    height: 65.474px;
    border-radius: 9.298px
  }

  .delivery-date strong {
    font-size: 14.877px;
    line-height: 18px
  }

  .delivery-date span {
    top: 27.298px;
    width: 76.333px;
    height: 38.175px;
    border-radius: 11.158px;
    font-size: 11.158px
  }

  .steps__footer {
    left: 24px;
    top: 569px;
    width: 342px;
    height: 109.5px
  }

  .steps__footer p {
    font-size: 16px;
    line-height: 22.4px
  }

  .steps__footer .store-links {
    left: 0;
    top: 63px
  }

  .repeat {
    height: 343.167px
  }

  .repeat__inner {
    left: 24px;
    top: 48px;
    width: 342px;
    height: 247.167px
  }

  .repeat__copy {
    width: 342px
  }

  .akva-app-page  .repeat h2 {
    font-size: 28px;
    line-height: 32.2px;
  }

  .repeat p {
    position: absolute;
    left: 0;
    top: 85px;
    width: 342px;
    height: 70px;
    margin: 0;
    font-size: 16px;
    line-height: 23.2px
  }

  .repeat__preview {
    left: 0;
    top: 187px;
    width: 342px;
    height: 60.167px;
    border-radius: 12px
  }

  .repeat__preview img {
    left: -14.25px;
    top: -88.667px;
    width: 370.5px;
    height: 734.983px
  }

  .bonus {
    height: 420px
  }

  .bonus__inner {
    left: 16px;
    top: 32px;
    width: 358px;
    height: 356px
  }

  .bonus__figure {
    left: 0;
    top: 0;
    width: 358px;
    height: 166px
  }

  .bonus__figure span {
    width: 358px;
    height: 137px;
    font-size: 160px;
    line-height: 136.8px
  }

  .bonus__figure p {
    top: 141px;
    width: 358px;
    font-size: 21px;
    line-height: 25px
  }

  .bonus__copy {
    left: 0;
    top: 198px;
    width: 358px;
    height: 158px
  }

  .bonus h2,
  .bonus__qr {
    display: none
  }

  .bonus__intro {
    left: 0;
    top: 0;
    width: 358px;
    font-size: 17px;
    line-height: 22.4px
  }

  .bonus__copy>.store-links {
    left: 0;
    top: 65px;
    gap: 10px
  }

  .bonus__copy>.store-links .store-link {
    width: 150px;
    height: 45px
  }

  .bonus__terms {
    left: 0;
    top: 130px;
    width: 310px;
    font-size: 12px;
    line-height: 14px
  }
}

@media(max-width:389px) {
  main {
    width: 390px;
    max-width: none;
    margin: 0
  }
}

@media(min-width:390px) and (max-width:1099px) {
  main {
    width: 100%;
    max-width: none
  }

  .hero__copy,
  .steps__heading,
  .steps__footer,
  .repeat__inner,
  .bonus__inner {
    left: calc((100vw - 390px)/2 + var(--original-left, 0px))
  }

  .hero__copy {
    --original-left: 0px
  }

  .hero__phone {
    left: calc((100vw - 390px)/2 + 264px)
  }

  .steps__heading,
  .steps__footer,
  .repeat__inner {
    --original-left: 24px
  }

  .steps__carousel {
    left: calc((100vw - 390px)/2)
  }

  .bonus__inner {
    --original-left: 16px
  }
}

/* Keep the reference artboards intact while letting every section use the viewport. */
main { width: 100%; max-width: none; }

@media (min-width: 1441px) {
  .hero__copy,.hero__qr,.steps__heading,.steps__carousel,.steps__footer,.repeat__inner,.bonus__inner { left: calc(50% - 720px + 64px); }
  .hero__visual { left: calc(50% - 720px + 694px); }
  .hero__phone { left: calc(50% - 720px + 900px); }
}

@media (min-width: 1200px) and (max-width: 1439px) {
  .hero__copy,.hero__qr,.steps__heading,.steps__carousel,.steps__footer,.repeat__inner,.bonus__inner { left: 4.444%; }
  .hero__visual { left: 48.2%; width: 51.8%; }
  .hero__phone { left: auto; right: 0; width: min(37.5vw,540px); }
  .steps { height: calc(325px + 466px * var(--step-scale,1)); }
  .steps__heading,.steps__carousel,.steps__footer,.repeat__inner,.bonus__inner { width: 91.112%; }
  .steps__heading p { left: auto; right: 0; }
  .steps__carousel { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 2.44%; height: calc(466px * var(--step-scale,1)); }
  .step { transform: scale(var(--step-scale,1)); transform-origin: top left; }
  .steps__footer { top: calc(227px + 466px * var(--step-scale,1)); }
  .steps__footer .store-links { left: auto; right: 0; }
  .repeat__preview { left: 52.44%; width: 47.56%; }
  .repeat__preview img { width: 108.33%; height: auto; left: -4.17%; top: -147.37%; }
  .bonus__copy { left: 49.39%; width: 50.61%; }
  .bonus h2,.bonus__intro { width: 100%; }
}

@media (min-width: 700px) and (max-width: 1199px) {
  .desktop { display: none; }
  .mobile { display: inline; }
  .hero { height: auto; min-height: max(580px, calc(50px + min(44vw, 390px) * 1.5)); }
  .hero__copy { position: relative; left: 0; top: 0; width: 100%; padding: 54px 5.5% 60px; }
  .hero h1 { position: relative; left: 0; top: 0; width: 58%; height: auto; font-size: clamp(36px,4.5vw,52px); line-height: 1.09; }
  .hero__intro { position: relative; left: 0; top: 0; width: 50%; height: auto; margin-top: 28px; font-size: clamp(17px,1.9vw,21px); line-height: 1.45; }
  .hero__offer { position: relative; left: 0; top: 0; width: 50%; height: auto; margin-top: 28px; color: var(--orange); font-size: clamp(20px,2.2vw,25px); line-height: 1.14; }
  .hero__stores { position: relative; left: 0; top: 0; width: fit-content; margin-top: 30px; }
  .hero__visual,.hero__qr { display: none; }
  .hero__phone { left: auto; right: -2%; top: 50px; width: min(44%,390px); height: auto; }
  .store-link { width: clamp(145px,15vw,180px); height: auto; aspect-ratio: 10/3; }
  .steps { height: auto; padding: 56px 5.5% 60px; }
  .steps__heading { position: relative; left: 0; top: 0; width: 100%; height: auto; }
  .steps h2 { font-size: clamp(36px,4.5vw,50px); line-height: 1.12; }
  .steps__heading p { position: relative; left: 0; top: 0; width: auto; margin-top: 16px; font-size: 22px; line-height: 1.32; }
  .steps__heading p br { display: none; }
  .steps__carousel { position: relative; left: 0; top: 0; width: calc(100% + 5.5vw); height: 400px; margin-top: 36px; display: flex; gap: 20px; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scroll-padding-inline: 0; padding: 0 5.5vw 0 0; scrollbar-width: none; }
  .steps__carousel::-webkit-scrollbar { display: none; }
  .step { flex: 0 0 350px; width: 350px; height: 400px; scroll-snap-align: start; }
  .step__heading { width: 350px; }
  .step h3 { width: 294px; font-size: 21px; }
  .step__description { width: 350px; font-size: 17px; }
  .step__picture { width: 350px; top: 151px; height: 249px; }
  .step__picture { container-type: inline-size; }
  .screen-crop--cart { left: 4.68cqw; top: 34.57cqw; width: 90.64cqw; height: 22.32cqw; }
  .screen-crop--cart img { left: -5.49cqw; top: -41.03cqw; width: 100.43cqw; height: 217.34cqw; }
  .screen-crop--delivery { left: 4.68cqw; top: 42.56cqw; width: 90.64cqw; height: 30.07cqw; }
  .screen-crop--delivery img { left: -4.7cqw; top: -68.59cqw; width: 101.97cqw; height: 220.68cqw; }
  .screen-crop--payment { left: 4.68cqw; top: 8.43cqw; width: 90.64cqw; height: 55.48cqw; }
  .screen-crop--payment img { left: -4.61cqw; top: -55.48cqw; width: 99.86cqw; height: 216.11cqw; }
  .delivery-date { left: 4.68cqw; top: 10.74cqw; width: 90.64cqw; height: 20.59cqw; }
  .steps__footer { position: relative; left: 0; top: 0; width: 100%; height: auto; display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 38px; }
  .steps__footer p { max-width: 340px; }
  .steps__footer .store-links { position: static; }
  .repeat { height: auto; padding: 60px 5.5%; }
  .repeat__inner { position: relative; left: 0; top: 0; width: 100%; height: auto; display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 5%; }
  .repeat__copy { width: auto; }
  .repeat h2 { font-size: clamp(30px,3.3vw,40px); line-height: 1.15; }
  .repeat p { position: static; width: auto; height: auto; margin-top: 20px; font-size: 18px; line-height: 1.45; }
  .repeat__preview { position: relative; left: 0; top: 0; width: 100%; height: auto; aspect-ratio: 342/60.167; }
  .repeat__preview img { left: -4.17%; top: -147.37%; width: 108.33%; height: auto; }
  .bonus { height: auto; padding: 60px 5.5%; }
  .bonus__inner { position: relative; left: 0; top: 0; width: 100%; height: auto; display: grid; grid-template-columns: 42% 1fr; gap: 5%; align-items: center; }
  .bonus__figure { position: relative; left: 0; top: 0; width: 100%; height: auto; }
  .bonus__figure span { width: 100%; height: auto; font-size: clamp(145px,16vw,220px); line-height: .82; }
  .bonus__figure p { position: static; width: auto; margin-top: 18px; font-size: clamp(19px,2.2vw,26px); line-height: 1.2; }
  .bonus__copy { position: relative; left: 0; top: 0; width: 100%; height: auto; }
  .bonus h2 { display: block; width: 100%; font-size: clamp(30px,3.3vw,40px); line-height: 1.1; }
  .bonus__intro { position: static; width: 100%; margin-top: 24px; font-size: 18px; line-height: 1.45; }
  .bonus__copy>.store-links { position: static; margin-top: 25px; }
  .bonus__qr { display: none; }
  .bonus__terms { position: static; width: 100%; margin-top: 30px; }
}

@media (max-width: 699px) {
  .hero__copy { left: 0; width: 100%; }
  .hero h1 { width: calc(100% - 48px); }
  .hero__intro { width: min(264px,calc(100% - 100px)); }
  .hero__offer { width: calc(100% - 48px); }
  .hero__stores { left: 50%; transform: translateX(-50%); }
  .hero__phone { left: auto; right: -29px; }
  .steps__heading,.steps__footer,.repeat__inner { left: 24px; width: calc(100% - 48px); }
  .steps__carousel { left: 0; width: 100%; }
  .repeat__preview { width: 100%; height: auto; aspect-ratio: 342/60.167; }
  .repeat__preview img { left: -4.17%; top: -147.37%; width: 108.33%; height: auto; }
  .bonus__inner { left: 16px; width: calc(100% - 32px); }
  .bonus__figure,.bonus__figure span,.bonus__figure p,.bonus__copy,.bonus__intro { width: 100%; }
}

@media (min-width: 391px) and (max-width: 699px) {
  .hero__phone { right: calc(-29px + (100vw - 390px)*.12); }
  .steps__carousel { padding-right: 24px; }
}

@media (max-width: 389px) {
  .steps { --card-w: min(318px,calc(100vw - 48px)); }
  .hero h1 { font-size: clamp(28px,8.7vw,34px); line-height: 1.12; }
  .hero__phone { width: 36%; height: auto; right: -27px; }
  .hero__intro { font-size: 15px; line-height: 1.45; }
  .hero__offer { font-size: 21px; }
  .store-link { width: calc((100vw - 48px - 12px)/2); height: auto; aspect-ratio: 10/3; }
  .steps { height: calc(503px + var(--card-w) * .72327); }
  .steps__carousel { height: calc(151px + var(--card-w) * .72327); padding-left: 24px; padding-right: 24px; }
  .step { flex-basis: var(--card-w); width: var(--card-w); height: calc(151px + var(--card-w) * .72327); }
  .step__heading,.step__description,.step__picture { width: 100%; }
  .step h3 { width: calc(100% - 52px); }
  .step__picture { height: auto; aspect-ratio: 318/230; container-type: inline-size; }
  .screen-crop--cart { left: 4.68cqw; top: 25cqw; width: 90.64cqw; height: 22.32cqw; }
  .screen-crop--cart img { left: -5.49cqw; top: -41.03cqw; width: 100.43cqw; height: 217.34cqw; }
  .screen-crop--delivery { left: 4.68cqw; top: 32.59cqw; width: 90.64cqw; height: 30.07cqw; }
  .screen-crop--delivery img { left: -4.7cqw; top: -68.59cqw; width: 101.97cqw; height: 220.68cqw; }
  .screen-crop--payment { left: 4.68cqw; top: 8.43cqw; width: 90.64cqw; height: 55.48cqw; }
  .screen-crop--payment img { left: -4.61cqw; top: -55.48cqw; width: 99.86cqw; height: 216.11cqw; }
  .delivery-date { left: 4.68cqw; top: 9.66cqw; width: 90.64cqw; height: 20.59cqw; }
  .steps__footer { top: calc(339px + var(--card-w) * .72327); }
  .steps__footer .store-links { gap: 12px; }
  .repeat { height: 365px; }
  .repeat h2 { font-size: clamp(22px,7vw,28px); line-height: 1.18; }
  .repeat p { width: 100%; }
  .bonus__figure span { font-size: clamp(125px,41vw,160px); }
  .bonus__figure p { font-size: 19px; }
  .bonus__intro { font-size: 16px; }
  .bonus__copy>.store-links .store-link { width: calc((100vw - 52px)/2); height: auto; }
}


.akva-app-page h2::before{
  content: none;
}
.akva-app-page h2{
  color:var(--navy);
  width: max-content;
}
.steps__heading p{
  color:var(--navy);
}
.main-header{
  z-index: 9999;
}

/* RuStore badge rows and 100-bonus figure from the approved PDF layouts. */
.akva-app-page .hero__number,
.akva-app-page .bonus__figure span { font-family: Montserrat, Arial, sans-serif; }
.akva-app-page .store-links { gap: 20px; }
@media (min-width: 1200px) {
  .akva-app-page .steps__footer .store-links { left: auto; right: 0; }
}
@media (min-width: 1200px) and (max-width: 1439px) {
  .akva-app-page .hero__stores { width: min(580px,43vw); }
  .akva-app-page .bonus__copy > .store-links { width: min(580px,100%); }
  .akva-app-page .hero__stores .store-link,
  .akva-app-page .bonus__copy > .store-links .store-link {
    flex: 1 1 0; min-width: 0; width: auto; max-width: 180px; height: auto; aspect-ratio: 10/3;
  }
}
@media (min-width: 700px) and (max-width: 1199px) {
  .akva-app-page .store-links { gap: 12px; }
  .akva-app-page .hero__stores { width: 50%; }
  .akva-app-page .store-link,
  .akva-app-page .bonus__copy > .store-links .store-link {
    flex: 1 1 0; min-width: 0; width: auto; max-width: 180px; height: auto; aspect-ratio: 10/3;
  }
  .akva-app-page .steps__footer { flex-wrap: wrap; }
  .akva-app-page .steps__footer .store-links { width: min(100%,580px); }
  .akva-app-page .bonus__inner { grid-template-columns: 42% minmax(0,1fr); }
  .akva-app-page .bonus__copy { min-width: 0; }
  .akva-app-page .bonus__copy > .store-links { width: 100%; }
}
@media (max-width: 699px) {
  .akva-app-page .store-links { gap: 12px; }
  .akva-app-page .store-link {
    flex: 1 1 0; min-width: 0; width: auto; max-width: 106px; height: auto; aspect-ratio: 10/3;
  }
  .akva-app-page .hero__stores { left: max(33px,calc(50% - 162px)); width: min(342px,calc(100% - 48px)); transform: none; }
  .akva-app-page .steps { height: 703.8px; }
  .akva-app-page .steps__footer { height: 94.8px; }
  .akva-app-page .steps__footer .store-links { width: 100%; }
  .akva-app-page .bonus { height: 404.199px; }
  .akva-app-page .bonus__figure span { text-align: center; }
  .akva-app-page .bonus__copy > .store-links { width: min(310px,100%); gap: 9px; }
  .akva-app-page .bonus__copy > .store-links .store-link { width: auto; max-width: 97.33px; height: auto; }
  .akva-app-page .bonus__terms { top: 114.199px; }
}
@media (max-width: 389px) {
  .akva-app-page .steps { height: calc(473.8px + var(--card-w) * .72327); }
}
