@font-face {
  font-family: Cochin;
  src: url('../fonts/Cochin.ttc') format("undefined");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Cointreau Font Typo Worksans;
  src: url('../fonts/Cointreau-Font-typo-WorkSans-SemiBold.ttf') format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Cointreau Font Typo Worksans;
  src: url('../fonts/Cointreau-Font-typo-WorkSans-Medium.ttf') format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Amertha Personal Use Only;
  src: url('../fonts/Amertha_PERSONAL_USE_ONLY.ttf') format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Cointreau Font Typo Nimbussancond Bol;
  src: url('../fonts/Cointreau-Font-typo-NimbusSanConD-Bol.ttf') format("truetype"), url('../fonts/Cointreau-Font-typo-NimbusSanConD-Bol.otf') format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Bellavoirserif Personal Use Only;
  src: url('../fonts/BellavoirSerif_PERSONAL_USE_ONLY.otf') format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Nimbussanst Condensed;
  src: url('../fonts/NimbusSansT-BlackCondensed.otf') format("opentype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

.w-layout-vflex {
  flex-direction: column;
  align-items: flex-start;
  display: flex;
}

.section-hero {
  background-color: #fa4616;
  position: relative;
}

.padding-global {
  width: 100%;
  padding-left: 32px;
  padding-right: 32px;
}

.container-large {
  width: 100%;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

.component-hero {
  z-index: 100;
  grid-column-gap: 80px;
  grid-row-gap: 80px;
  flex-flow: row;
  height: 100vh;
  padding-top: 122px;
  padding-bottom: 0;
  display: flex;
  position: relative;
}

.side-1_hero {
  grid-column-gap: 32px;
  grid-row-gap: 32px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 50%;
  min-width: 50%;
  height: 100%;
  padding-bottom: 0;
  padding-left: 0;
  display: flex;
}

.section-banner-desktop {
  display: flex;
}

.section-banner-mobile {
  display: none;
}

.side-2_hero {
  flex-flow: row;
  justify-content: center;
  align-items: stretch;
  width: 50%;
  min-width: 50%;
  height: 100%;
  display: flex;
}

.background-img {
  opacity: .6;
  object-fit: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0%;
}

.button {
  color: #000;
  text-align: center;
  background-color: #fcaf03;
  border: 1px solid #fcaf03;
  border-radius: 10px;
  padding: 1rem 2.5rem;
  font-size: 20px;
  font-weight: 500;
  text-decoration: none;
  transition: background-color .7s;
}

.button:hover {
  color: #fff;
  background-color: #0000;
}

.button.is-secondary {
  color: #000;
  background-color: #0000;
}

.button.is-secondary.is-alternate {
  color: #fff;
  background-color: #0000;
  margin-left: 16px;
  transition: background-color .8s;
}

.button.is-secondary.is-alternate:hover {
  color: #fff;
  background-color: #925bf1;
  border-color: #925bf1;
}

.button.is-secondary.is-alternate.buton-mobile {
  background-color: #1d2c49;
  border-color: #24456b;
  border-radius: 0;
  margin-left: 0;
  font-family: Cointreau Font Typo Nimbussancond Bol, Arial, sans-serif;
  font-size: 20px;
  font-weight: 400;
  transition: background-color .5s;
}

.button.is-secondary.is-alternate.buton-mobile:hover {
  color: #fff;
  background-color: #24456b;
  border-color: #24456b;
}

.button.is-orange {
  color: #fff;
  background-color: #d94820;
  border-color: #d94820;
  border-radius: 0;
  font-family: Nimbussanst Condensed, Arial, sans-serif;
}

.nav-link-2 {
  color: #fff;
  text-align: center;
  text-underline-offset: 2px;
  font-family: Cointreau Font Typo Nimbussancond Bol, Arial, sans-serif;
  font-size: 22px;
  text-decoration-thickness: 1px;
}

.nav-link-2:hover {
  color: #24456b;
  text-decoration-thickness: 1px;
}



.nav-link-2.w--current {
  color: #244068;
  text-underline-offset: 5px;
  text-decoration: underline;
  text-decoration-thickness: 1px;
}

.navbar {
  background-color: #ddd0;
  flex-flow: column;
  justify-content: center;
  align-items: stretch;
  width: 100%;
  min-height: 86px;
  padding-left: 32px;
  padding-right: 32px;
  display: flex;
  position: absolute;
}

.navbar._1 {
  -webkit-backdrop-filter: blur(35px);
  backdrop-filter: blur(35px);
  background-color: #0000;
  border-bottom: 1px solid #fff0;
}

.dropdown-link {
  color: #fff;
}

.dropdown-link:hover, .dropdown-link.w--current {
  color: #038be5;
}

.dropdown-link._1:hover, .dropdown-link._1.w--current {
  color: #925bf1;
}

.dropdown-link._4:hover, .dropdown-link._4.w--current {
  color: #fcaf03;
}

.dropdown-link._3:hover, .dropdown-link._3.w--current {
  color: #f02d3b;
}

.div-block {
  flex-flow: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.dropdown-list {
  background-color: #ddd;
}

.dropdown-list.w--open {
  -webkit-backdrop-filter: blur(100px);
  backdrop-filter: blur(100px);
  background-color: #000;
  border: 1px solid #fff;
  border-radius: 10px;
  width: 158.941%;
}

.nav-menu {
  color: #fff;
  flex-flow: row;
  justify-content: center;
  align-items: center;
  display: flex;
}

.dropdown-toggle {
  color: #038be5;
}

.image {
  max-width: none;
  height: auto;
}

.heading1 {
  color: #fff;
  letter-spacing: 0;
  margin-top: 0;
  margin-bottom: 0;
  font-family: Cointreau Font Typo Nimbussancond Bol, Arial, sans-serif;
  font-size: 62px;
  font-weight: 400;
  line-height: 1em;
}

.div-block-166 {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  flex-flow: column;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  max-width: 450px;
  display: flex;
}

.div-block-167 {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  place-items: start center;
  height: 100%;
  display: flex;
  overflow: hidden;
}

.div-block-168 {
  width: 100%;
}

.image-2 {
  width: 100%;
  max-width: 600px;
}

.section-pronuncia {
  object-fit: cover;
  height: 100%;
}

.component-pronuncia {
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/img/background-image.svg');
  background-position: 0 0;
  background-size: auto;
  height: 100vh;
}

.image-3 {
  aspect-ratio: auto;
  object-fit: cover;
}

.div-block-169 {
  background-image: url('../images/CUANTRO_MG_HORZ_2.webp');
  background-size: cover;
  width: 100%;
  height: 100vh;
}

.image-4 {
  object-fit: cover;
  height: auto;
}

.component-slide {
  grid-column-gap: 62px;
  grid-row-gap: 62px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  padding-top: 112px;
  padding-bottom: 112px;
  display: flex;
  position: relative;
}

.mask {
  background-color: #fff;
  position: static;
}

.div-block-170 {
  border: 1px solid #e6eaf8;
  border-radius: 10px;
  width: 80%;
  height: 100%;
  padding: 20px;
}

.text-1 {
  font-family: Nimbussanst Condensed, Arial, sans-serif;
  font-size: 18px;
  line-height: 1.2em;
}

.div-block-171 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
}



.slide {
  height: auto;
}

.slider {
  background-color: #ddd0;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  height: 100%;
  display: flex;
}

.div-block-172 {
  grid-column-gap: 32px;
  grid-row-gap: 32px;
  padding-left: 70px;
  display: flex;
}

.heading2 {
  margin-top: 0;
  margin-bottom: 0;
  font-family: Cointreau Font Typo Worksans, Arial, sans-serif;
  font-size: 14px;
}

.paragraph {
  margin-bottom: 0;
  font-family: Cointreau Font Typo Worksans, Arial, sans-serif;
  font-weight: 400;
}

.div-block-173 {
  grid-column-gap: 32px;
  grid-row-gap: 32px;
  flex-flow: row;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.div-block-174 {
  border-radius: 100px;
}

.image-5 {
  object-fit: cover;
  border-radius: 100px;
  width: 4rem;
  height: 4rem;
}

.div-block-175 {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.div-block-176 {
  grid-column-gap: 48px;
  grid-row-gap: 48px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  height: 100%;
  display: flex;
}

.image-6 {
  height: 220px;
}

.image-7 {
  object-fit: cover;
  width: 5rem;
  height: 2rem;
}

.div-block-177 {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: row;
  display: flex;
}

.slide-nav {
  display: none;
}

.icon-embed-xxsmall {
  color: #ff4b36;
  justify-content: center;
  align-items: center;
  width: 2rem;
  height: 2rem;
  display: flex;
  transform: rotate(-86deg);
}

.left-arrow {
  z-index: 10;
  justify-content: flex-end;
  align-items: center;
  width: 48px;
  height: 48px;
  display: flex;
}

.right-arrow {
  justify-content: flex-end;
  align-items: center;
  width: 48px;
  height: 48px;
  display: flex;
  position: absolute;
  inset: 0% 0% 0% auto;
}

.icon-3 {
  overflow: auto;
}

.icon-embed-xxsmall-copy {
  color: #ff4b36;
  justify-content: center;
  align-items: center;
  width: 2rem;
  height: 2rem;
  display: flex;
  transform: rotate(86deg);
}

.icon-embed-xxsmall-2 {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 1rem;
  height: 1rem;
  display: flex;
}

.link-block {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  color: #fff;
  background-color: #d94820;
  border: 1px #fff;
  border-radius: 0;
  justify-content: center;
  align-items: center;
  padding: .75rem 1.25rem;
  font-family: Nimbussanst Condensed, Arial, sans-serif;
  text-decoration: none;
  display: flex;
}

.text-size-regular {
  font-size: 1rem;
}

.text-size-regular.text-color-white {
  white-space: normal;
  margin-bottom: 0;
  font-family: Cointreau Font Typo Worksans, Arial, sans-serif;
  font-weight: 500;
  text-decoration: none;
}

.icon-embed-xxsmall-3 {
  color: #fff;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 1rem;
  height: 1rem;
  display: flex;
}

.image-8 {
  z-index: 10;
  width: 160px;
  height: auto;
  position: absolute;
  inset: auto 0% 5% auto;
}

.div-block-178 {
  justify-content: center;
  align-items: center;
  width: 60%;
  height: 100%;
  display: flex;
  position: absolute;
  top: 201px;
  bottom: 0%;
  right: 0%;
}

.section-qr {
  background-image: url('../images/BACK-AZUL3x.png');
  background-position: 0 0;
  background-size: auto;
  padding-top: 62px;
  padding-bottom: 62px;
  display: none;
  position: relative;
  overflow: hidden;
}

.component-qr {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  background-color: #fa4616;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: flex-start;
  place-items: stretch center;
  padding: 0 48px 0 32px;
  display: flex;
}

.image-9 {
  object-fit: contain;
  width: 100%;
  height: 800px;
  margin-left: auto;
  padding-left: 0;
}

.div-block-179 {
  justify-content: center;
  align-items: center;
  width: 40%;
  min-width: 40%;
  height: auto;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
  position: relative;
}

.div-block-180 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 60%;
  min-width: 60%;
  padding: 11px 0 48px;
  display: flex;
  position: relative;
}

.image-10 {
  width: 200px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 0;
}

.heading-2 {
  font-family: Nimbussanst Condensed, Arial, sans-serif;
  font-size: 20px;
}

.heading-2.text-color-white {
  color: #fff;
  font-size: 20px;
}

.heading-2.text-color-white.tranlate {
  font-size: 22px;
  font-style: italic;
}

.head-3 {
  font-family: Nimbussanst Condensed, Arial, sans-serif;
}

.head-3.text-color-white {
  color: #fff;
  font-size: 36px;
}

.head-3.text-color-white.translate {
  transform: rotate(-12deg);
}

.div-red {
  background-color: #fa290961;
  border-bottom: 1px solid #fff;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  padding-left: 20px;
  padding-right: 20px;
  transform: rotate(-12deg);
}

.div-red._1 {
  transform: scale3d(1none, 1none, 1none);
  transform-style: preserve-3d;
}

.head-5 {
  font-size: 18px;
}

.head-5.text-colo-white {
  color: #fff;
  font-family: Nimbussanst Condensed, Arial, sans-serif;
  font-size: 17px;
  line-height: 20px;
}

.div-block-181 {
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.div-block-182 {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  width: 100%;
  max-width: 550px;
  padding-top: 0;
  display: grid;
}

.number {
  color: #244068;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #fff;
  white-space: normal;
  font-family: Nimbussanst Condensed, Arial, sans-serif;
  font-size: 72px;
}

.text-color-white {
  color: #fff;
}

.div-block-183 {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  justify-content: flex-start;
  align-items: center;
  width: 80%;
  display: flex;
}

.div-block-183._2 {
  width: 100%;
}

.flex-block {
  justify-content: flex-start;
  align-items: center;
  margin-top: 26px;
}

.text-size-large {
  font-family: Cointreau Font Typo Worksans, Arial, sans-serif;
  font-size: 20px;
  line-height: 25px;
}

.text-aling-center {
  text-align: center;
}

.section-premios {
  padding-bottom: 56px;
}

.image-11 {
  width: 100%;
  height: 100%;
}

.section-error {
  background-color: #1d2c49;
}

.component-error {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  place-items: center;
  height: 100vh;
  padding-top: 48px;
  padding-bottom: 48px;
  display: grid;
}

.image-13 {
  width: 80px;
  position: absolute;
  inset: auto 0% 16.3rem auto;
}

.hero-swiper {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.hero-swiper .swiper-slide {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}

.hero-swiper .swiper-slide .image {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.image-14 {
  opacity: .42;
  width: 1920px;
  min-width: 1920px;
  display: block;
  position: absolute;
  inset: -56% 0% 0%;
}

.image-10-copy {
  width: 200ch;
  margin-left: auto;
  margin-right: auto;
  padding-left: 0;
}

.image-15 {
  height: 80%;
  margin-top: auto;
  margin-bottom: auto;
  position: absolute;
  top: auto;
  bottom: auto;
}

.image-16 {
  width: 600px;
  min-width: 600px;
  position: absolute;
}

.paragraph-2 {
  color: #fff;
  font-family: Cointreau Font Typo Worksans, Arial, sans-serif;
}

.paragraph-3 {
  color: #fff;
  text-align: center;
  font-family: Cointreau Font Typo Worksans, Arial, sans-serif;
  font-size: 20px;
  font-weight: 500;
}

.bold-text {
  font-weight: 600;
}

.image-17 {
  z-index: 20;
  width: 350px;
  position: absolute;
  inset: 22.6rem auto auto;
}

.utility-page-wrap {
  justify-content: center;
  align-items: center;
  width: 100vw;
  max-width: 100%;
  height: 100vh;
  max-height: 100%;
  display: flex;
}

.utility-page-content {
  text-align: center;
  flex-direction: column;
  width: 260px;
  display: flex;
}

.utility-page-form {
  flex-direction: column;
  align-items: stretch;
  display: flex;
}

.paragraph-4 {
  color: #fff;
  font-family: Cointreau Font Typo Worksans, Arial, sans-serif;
  font-size: 16px;
}

.image-18 {
  width: 100%;
}


@media screen and (max-width: 991px) {

  .section-banner-mobile {
    width: 100%;
   
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .section-banner-desktop {
    display: none;
  }



  .component-hero {
    padding-top: 120px;
  }

  .side-1_hero, .nav-link-2 {
    padding-left: 0;
    
  }

  .nav-link-2 {
   
    font-size: 18px;
    text-align: left;
    text-underline-offset: 2px;
    font-family: Cointreau Font Typo Nimbussancond Bol, Arial, sans-serif;
    font-size: 24px;
    text-decoration-thickness: 1px;
  }

  .menu-button {
    background-color: #1d2c49;
    border-radius: 5px;
    padding: 10px;
  }

  .menu-button.w--open {
    background-color: #1d2c49;
    border: 1px solid #1d2c49;
    border-radius: 5px;
    padding: 10px;
  }

  .dropdown {
    width: 100%;
  }

  .nav-menu {
    background-color: #e84a25;
    justify-content: flex-start;
    align-items: center;
    width: 60%;
    height: 1500%;
    padding-top: 40px;
    padding-left: 32px;
    padding-right: 32px;
  }

  .div-block-165 {
    display: flex;
  }

  .icon-2 {
    color: #fff;
  }

  .image {
    height: auto;
  }

  .div-block-166 {
    width: 100%;
  }

  .component-slide {
    padding-top: 62px;
    padding-bottom: 62px;
  }

  .image-8 {
    bottom: 2%;
    right: -6%;
  }

  .component-qr {
    grid-template-columns: 1fr;
    padding-right: 32px;
  }

  .image-9, .div-block-179 {
    display: none;
  }

  .div-block-180 {
    padding-left: 0;
    padding-right: 0;
  }

  .div-block-183 {
    justify-content: flex-start;
    align-items: center;
    width: 100%;
  }
}

@media screen and (max-width: 767px) {
  .padding-global {
    padding-left: 20px;
    padding-right: 20px;
  }

  .component-hero {
    flex-flow: column;
  }

  .side-1_hero {
    grid-column-gap: 32px;
    grid-row-gap: 32px;
  }

  .side-2_hero {
    justify-content: center;
    align-items: center;
  }

  .button.is-secondary.is-alternate {
    margin-left: 0;
  }

  .nav-menu {
    justify-content: flex-start;
    align-items: center;
    height: 1200%;
  }

  .div-block-165 {
    padding-left: 20px;
    display: flex;
  }

  .image {
    width: 100%;
    height: auto;
  }

  .div-block-167 {
    grid-template-columns: 1fr;
  }

  .image-2 {
    width: auto;
    height: 150px;
  }

  .mask {
    width: 100%;
    padding-bottom: 80px;
  }

  .div-block-171 {
    width: 100%;
  }

  .card {
    padding-left: 20px;
    padding-right: 20px;
  }

  .slide {
    width: 100%;
  }

  .slider {
    width: 100%;
  }

  .div-block-172 {
    width: 100%;
    padding-left: 0;
  }

  .image-6, .image-7 {
    display: none;
  }

  .div-block-177 {
    width: 100%;
  }

  .left-arrow {
    inset: auto auto 0% 0%;
  }

  .right-arrow {
    z-index: 20;
    inset: auto 0% 0% auto;
  }

  .component-qr {
    display: flex;
  }

  .div-block-182 {
    grid-template-columns: 1fr;
    padding-top: 62px;
  }

  .number {
    font-size: 62px;
  }

  .flex-block {
    margin-top: 62px;
  }

  .image-12 {
    object-fit: cover;
    height: 62px;
  }
}

@media screen and (max-width: 479px) {



  
  .padding-global {
    padding-left: 20px;
  }

  .component-hero {
    height: auto;
  }

  .side-1_hero {
    width: 100%;
    min-width: 100%;
  }

  .side-2_hero {
    justify-content: center;
    align-items: center;
    width: 100%;
    min-width: 100%;
  }

  .button {
    width: 100%;
  }

  .button.is-secondary.is-alternate {
    width: 100%;
    margin-left: 0;
  }

  .button.is-secondary.is-alternate.buton-mobile {
    width: auto;
  }

  .navbar {
    padding-left: 20px;
    padding-right: 20px;
  }

  .brand {
    width: 50%;
    padding-left: 0;
  }

  .div-block, .dropdown-list.w--open {
    width: 100%;
  }

  .nav-menu {
    justify-content: center;
    align-items: center;
    width: 80%;
    height: 950px;
    padding-top: 40px;
    padding-left: 20px;
    padding-right: 10px;
    top: -2px;
  }

  .div-block-165 {
    justify-content: flex-start;
    align-items: center;
    padding-left: 0;
  }

  .icon-2 {
    color: #fff;
  }

  .heading1 {
    font-size: 48px;
  }

  .div-block-167 {
    flex-flow: column;
    place-items: center;
  }

  .component-slide {
    padding-top: 48px;
    padding-bottom: 48px;
  }

  .mask, .div-block-176, .link-block {
    width: 100%;
  }

  .text-size-regular.text-color-white {
    font-size: 16px;
  }

  .image-8 {
    display: none;
  }

  .section-qr {
    padding-top: 48px;
    padding-bottom: 48px;
  }

  .component-qr {
    flex-flow: column;
    width: 100%;
    padding-left: 8px;
    padding-right: 8px;
  }

  .div-block-179 {
    width: 100%;
    min-width: 100%;
    height: 400px;
    display: flex;
  }

  .div-block-180 {
    width: 100%;
    min-width: 100%;
  }

  .heading-2.text-color-white.tranlate {
    font-size: 14px;
    line-height: 20px;
  }

  .head-3.text-color-white {
    font-size: 20px;
    line-height: 20px;
  }

  .head-5.text-colo-white {
    font-size: 12px;
  }

  .div-block-182 {
    flex-flow: column;
    grid-template-columns: 1fr;
    place-items: center start;
    padding-top: 31px;
    display: flex;
  }

  .number {
    font-size: 48px;
  }

  .div-block-183 {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    flex-flow: row;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
  }

  .flex-block {
    width: 100%;
    margin-top: 31px;
  }

  .text-size-large.text-color-white.text-aling-center {
    font-size: 18px;
  }

  .text-size-large.text-color-white.text-aling-center.mobile-is-lef {
    text-align: left;
  }

  .image-12 {
    object-position: 100% 50%;
    height: 32px;
  }

  .image-13 {
    position: static;
  }

  .image-14 {
    width: 500px;
    min-width: 500px;
    height: 100%;
    margin-left: auto;
    margin-right: auto;
    inset: 0% auto 0% -85px;
  }

  .image-10-copy {
    width: 100%;
  }

  .image-16 {
    width: 350px;
    min-width: 350px;
  }

  .paragraph-2 {
    width: 100%;
    margin-bottom: 0;
  }

  .paragraph-3 {
    font-size: 16px;
  }

  .image-17 {
    margin-top: auto;
    margin-bottom: auto;
    inset: 15% 0% 0%;
  }

  .paragraph-4 {
    text-align: center;
  }
}


@font-face {
  font-family: 'Cochin';
  src: url('../fonts/Cochin.ttc') format('undefined');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Cointreau Font Typo Worksans';
  src: url('../fonts/Cointreau-Font-typo-WorkSans-SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Cointreau Font Typo Worksans';
  src: url('../fonts/Cointreau-Font-typo-WorkSans-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Amertha Personal Use Only';
  src: url('../fonts/Amertha_PERSONAL_USE_ONLY.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Cointreau Font Typo Nimbussancond Bol';
  src: url('../fonts/Cointreau-Font-typo-NimbusSanConD-Bol.ttf') format('truetype'), url('../fonts/Cointreau-Font-typo-NimbusSanConD-Bol.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Bellavoirserif Personal Use Only';
  src: url('../fonts/BellavoirSerif_PERSONAL_USE_ONLY.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Nimbussanst Condensed';
  src: url('../fonts/NimbusSansT-BlackCondensed.otf') format('opentype');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}


/* Banner */

    /* ── Main card ── */
    .card-banner {
      display: flex;
position: relative;

padding: 120px 0;
flex-direction: column;

gap: 32px;
background: #00345C;
align-items: stretch;
overflow: hidden;
    }

    .background-img-card{
      position: absolute;
      mix-blend-mode: multiply;
      z-index: 10;
      top: 0;
      width: 100%;
      height: 100%;
    }

    .card {
      display: flex;
     flex-direction: row;
     ;
      justify-content: center;
      align-items: stretch;
      gap: 10px;
      flex-shrink: 0;
      background: #CF4220;
      padding: 48px 0px;
    }
 
    /* ── LEFT PANEL ── */
    .left-panel {
      width: 50%;
      height: auto;
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
    }
 
    /* Large SHAKE letters (background image acting as mask/graphic) */
    .shake-img {
      position: absolute;
      top: 55%;
      left: 50%;
      transform: translate(-50%, -50%);
      min-width: 620px;
     
     
      pointer-events: none;
      z-index: 1;
    }
 
    /* Logo bottom-left */
    .logo-img {
      position: absolute;
      top: 0px;
      right: 30px;
      width: 280px;
    
      z-index: 3;
    }
 
    /* Bottle silhouette on top */
    .bottle-wrap {
      width: 370px;
  
      z-index: 2;
    }
 
    .bottle-wrap img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
 
    /* ── RIGHT PANEL ── */
    .right-panel {
      width: 50%;
      padding-top: 48px;
      padding-left: 32PX;
      padding-right: 20px;
      height: auto;
      flex-shrink: 0;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 10px;
      position: relative;
    }
 
    /* Decorative diagonal banner (Recurso) */
    .recurso-img {
      position: absolute;
      top: -6rem;
      right: -3rem;
      width: 600px;
   
 
      pointer-events: none;
      z-index: 1;
    }
 
    /* Steps list */
    .steps {
      width: 100%;
      display: flex;
      flex-direction: column;
      gap: 20px;
      position: relative;
      z-index: 2;

    }
 
    .step {
      width: 100%;
      display: flex;
      gap: 10px;
      align-items: flex-start;
     
      overflow: hidden;
      color: #ffffff;
    }
 
    .step-number {
      font-size: 52px;
      color: #003D6A;
      font-weight: 700;
      line-height: 1;
      flex-shrink: 0;
      white-space: nowrap;
      font-family: 'Nimbussanst Condensed', sans-serif;
    }

    .step-icon-wrap {
      width: 52px;
      min-width: 52px;
      height: 52px;
      min-height: 52px;
      object-fit: cover;
      z-index: 10;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .step-icon {
     
      height: 100%;
    }
 
    .step-text {
      width: 100%;
      font-size: 18px;
      font-weight: 400;
      line-height: 1.4;
      font-family: 'Work Sans', sans-serif;
      
    }
 
    .step-text .label {
      display: block;
      margin-top: 4px;
      font-size: 14px;
      opacity: 0.75;
      font-style: italic;
    }
 
    /* ── FOOTER TEXT ── */
    .footer-text {
      margin-top: 32px;
      width: 824px;
      margin-left: auto;
      margin-right: auto;
      max-width: 100%;
      display: flex;
      flex-direction: column;
      gap: 10px;
      color: #ffffff;
      font-family: 'Work Sans', sans-serif;
      font-weight: 400;
      font-size: 32px;
      text-align: center;

      height: auto;
    }
 
    .footer-text p {
      width: 100%;
      font-size: 28px;
      font-weight: 600;
      line-height: 1.4em;
      font-family: 'Work Sans', sans-serif;
    }

    .footer-text p:last-child {
      width: 100%;
      font-size: 18px;
      font-style: italic;  
      font-weight: 600;
      line-height: 1.4em;
      font-family: 'Work Sans', sans-serif;
    }

    .componente-btns {
      display: flex;
      gap: 20px;
      justify-content: center;
      align-items: center;
      padding: 20px 0px;
    }

    .componente-btns a {
      width: 100%;
     transition: transform 0.3s ease;
    }
    .componente-btns a:hover {
        transform: scale(1.05);
        transition: transform 0.3s ease;
    }
   

    @media screen and (max-width: 1000px) {

      .componente-btns {
        flex-direction: column;
      }

      .card-banner{
        padding:48px 0px;
      }
      .card {
        flex-direction: column;
        padding: 24px;
      }

      .left-panel {
        width: 100%;
      }

      .right-panel {
        width: 100%;
        padding: 0px;
      }

      .shake-img {
        min-width: 300px;
      }

      .bottle-wrap {
        width: 80%;
      }
      .recurso-img {
        position: static;
        width: 100%;
        top: 0;
        right: 0;
      }
      .steps {
        margin-top: 16px;
        width: 100%;
      }
      .step {
        width: 100%;
      }
      .step-number {
        font-size: 32px;
      }
      .step-text {
        font-size: 16px;
      }
      .step-text .label {
        font-size: 12px;
      }
      .footer-text p{
        font-size: 18px;

        }
      }