@charset "UTF-8";
/* boostrap*/
/* boostrap*/
/* boostrap*/
@font-face {
  font-family: "BT Oateria";
  src: url("../fonts/BT-Oateria/BTOateria-Regular.woff2") format("woff2"), url("../fonts/BT-Oateria/BTOateria-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "BT Oateria";
  src: url("../fonts/BT-Oateria/BTOateria-Italic.woff2") format("woff2"), url("../fonts/BT-Oateria/BTOateria-Italic.woff") format("woff");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "BT Oateria";
  src: url("../fonts/BT-Oateria/BTOateria-Medium.woff2") format("woff2"), url("../fonts/BT-Oateria/BTOateria-Medium.woff") format("woff");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "BT Oateria";
  src: url("../fonts/BT-Oateria/BTOateria-MediumItalic.woff2") format("woff2"), url("../fonts/BT-Oateria/BTOateria-MediumItalic.woff") format("woff");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "BT Oateria";
  src: url("../fonts/BT-Oateria/BTOateria-SemiBold.woff2") format("woff2"), url("../fonts/BT-Oateria/BTOateria-SemiBold.woff") format("woff");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "BT Oateria";
  src: url("../fonts/BT-Oateria/BTOateria-SemiBoldItalic.woff2") format("woff2"), url("../fonts/BT-Oateria/BTOateria-SemiBoldItalic.woff") format("woff");
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "BT Oateria";
  src: url("../fonts/BT-Oateria/BTOateria-Bold.woff2") format("woff2"), url("../fonts/BT-Oateria/BTOateria-Bold.woff") format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "BT Oateria";
  src: url("../fonts/BT-Oateria/BTOateria-BoldItalic.woff2") format("woff2"), url("../fonts/BT-Oateria/BTOateria-BoldItalic.woff") format("woff");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "BT Oateria";
  src: url("../fonts/BT-Oateria/BTOateria-ExtraBold.woff2") format("woff2"), url("../fonts/BT-Oateria/BTOateria-ExtraBold.woff") format("woff");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "BT Oateria";
  src: url("../fonts/BT-Oateria/BTOateria-ExtraBoldItalic.woff2") format("woff2"), url("../fonts/BT-Oateria/BTOateria-ExtraBoldItalic.woff") format("woff");
  font-weight: 800;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "BT Oateria";
  src: url("../fonts/BT-Oateria/BTOateria-Black.woff2") format("woff2"), url("../fonts/BT-Oateria/BTOateria-Black.woff") format("woff");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "BT Oateria";
  src: url("../fonts/BT-Oateria/BTOateria-BlackItalic.woff2") format("woff2"), url("../fonts/BT-Oateria/BTOateria-BlackItalic.woff") format("woff");
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "BT Oateria";
  src: url("../fonts/BT-Oateria/BTOateriaVF.woff2") format("woff2-variations"), url("../fonts/BT-Oateria/vari/BTOateriaVF.woff") format("woff-variations");
  font-weight: 200 399;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: "BT Oateria";
  src: url("../fonts/BT-Oateria/BTOateriaItalicVF.woff2") format("woff2-variations");
  font-weight: 200 399;
  font-display: swap;
  font-style: italic;
}
@font-face {
  font-family: "BT Oateria vr";
  src: url("../fonts/BT-Oateria/BTOateriaVF.woff2") format("woff2-variations"), url("../fonts/BT-Oateria/vari/BTOateriaVF.woff") format("woff-variations");
  font-weight: 200 399;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: "BT Oateria vr";
  src: url("../fonts/BT-Oateria/BTOateriaItalicVF.woff2") format("woff2-variations");
  font-weight: 200 399;
  font-display: swap;
  font-style: italic;
}
@font-face {
  font-family: "BT Grotesk";
  src: url("../fonts/BT-Grotesk/BTGrotesk-Regular.woff2") format("woff2"), url("../fonts/BT-Grotesk/BTGrotesk-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "BT Grotesk";
  src: url("../fonts/BT-Grotesk/BTGrotesk-Medium.woff2") format("woff2"), url("../fonts/BT-Grotesk/BTGrotesk-Medium.woff") format("woff");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "BT Grotesk";
  src: url("../fonts/BT-Grotesk/BTGrotesk-SemiBold.woff2") format("woff2"), url("../fonts/BT-Grotesk/BTGrotesk-SemiBold.woff") format("woff");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "BT Grotesk";
  src: url("../fonts/BT-Grotesk/BTGrotesk-Bold.woff2") format("woff2"), url("../fonts/BT-Grotesk/BTGrotesk-Bold.woff") format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "BT Beau Sans";
  src: url("../fonts/BT-BeauSans/BT-BeauSans-Bold.woff2") format("woff2"), url("../fonts/BT-BeauSans/BT-BeauSans-Bold.woff") format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@media (max-width: 429px) {
  html {
    font-size: 3.7vw;
  }
}
@media (min-width: 450px) and (max-width: 767px) {
  html {
    font-size: 3.2vw;
  }
}
@media (min-width: 768px) and (max-width: 1259px) {
  html {
    font-size: 0.81vw;
  }
}
@media (min-width: 1260px) and (max-width: 1919px) {
  html {
    font-size: 0.82vw;
  }
}
@media (min-width: 2000px) {
  html {
    font-size: 0.8vw;
  }
}

[data-aos=fade-up] {
  transform: translate3d(0, 40vh, 0);
}

.btOateria-main {
  width: 100%;
  font-family: "BT Oateria", sans-serif;
  color: #003d1b;
  background-color: #fff5de;
}
.btOateria-main h1,
.btOateria-main h2,
.btOateria-main h3,
.btOateria-main h4,
.btOateria-main h5,
.btOateria-main h6 {
  font-family: "BT Oateria", sans-serif;
  color: #003d1b;
}
.btOateria-main .img-wrap {
  width: 100%;
  height: 100%;
}
.btOateria-main .img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.btOateria-main .container {
  max-width: 100%;
  padding: 0 1.125rem;
}
@media (min-width: 768px) {
  .btOateria-main .container {
    padding: 0 4.375rem;
  }
}
.btOateria-main .container--2 {
  max-width: 100%;
  padding: 0 1.125rem;
}
@media (min-width: 768px) {
  .btOateria-main .container--2 {
    padding: 0 3rem;
  }
}
.btOateria-main .row {
  margin-left: -0.4375rem;
  margin-right: -0.4375rem;
}
.btOateria-main .row [class*=col-] {
  padding-left: 0.4375rem;
  padding-right: 0.4375rem;
}
@media (min-width: 768px) {
  .btOateria-main .row {
    margin-left: -0.4375rem;
    margin-right: -0.4375rem;
  }
  .btOateria-main .row [class*=col-] {
    padding-left: 0.4375rem;
    padding-right: 0.4375rem;
  }
}
@media (min-width: 1260px) {
  .btOateria-main .row {
    margin-left: -0.625rem;
    margin-right: -0.625rem;
  }
  .btOateria-main .row [class*=col-] {
    padding-left: 0.625rem;
    padding-right: 0.625rem;
  }
}
.btOateria-main .row--0 {
  margin-left: 0;
  margin-right: 0;
}
.btOateria-main .row--0 [class*=col-] {
  padding-left: 0;
  padding-right: 0;
}

.title-box .title {
  color: var(--5, #003d1b);
  font-family: "BT Oateria vr";
  font-size: 1.875rem;
  font-style: normal;
  font-variation-settings: "wght" 350;
  line-height: 120%; /* 36px */
  margin-bottom: 0;
  display: flex;
  align-items: center;
}
.title-box .title span {
  position: relative;
  color: var(--1, #fff5de);
  text-align: center;
  font-family: "BT Oateria vr";
  font-size: 1.25rem;
  font-style: normal;
  font-variation-settings: "wght" 350;
  line-height: 120%; /* 24px */
  letter-spacing: 0.6px;
  margin-right: 1.213125rem;
  margin-left: 0.615rem;
  margin-bottom: 0.125rem;
}
.title-box .title span:after {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  content: "";
  width: 2.5rem;
  aspect-ratio: 1/1;
  background-color: #003d1b;
  z-index: -1;
  border-radius: 100%;
  top: 55%;
}
.title-box .para {
  color: #002d14;
  font-family: "BT Grotesk";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
  margin-top: 1.6175rem;
  margin-bottom: 2.8125rem;
}
.title-box .para--set {
  display: flex;
  flex-direction: column;
  margin-top: 1.14625rem;
  margin-bottom: 1.875rem;
}
.title-box .para--set .set {
  margin-bottom: 0.625rem;
  color: var(--4, #00ad27);
  font-feature-settings: "ss02" on;
  font-family: "BT Oateria";
  font-size: 1.375rem;
  font-style: normal;
  font-weight: 350;
  line-height: 120%; /* 26.4px */
}
@media (min-width: 768px) {
  .title-box {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
  }
  .title-box .title {
    color: var(--5, #003d1b);
    font-family: "BT Oateria";
    font-size: 4.6875rem;
    font-style: normal;
    font-weight: 350;
    line-height: 120%; /* 36px */
    margin-bottom: 0;
    display: flex;
    align-items: center;
  }
  .title-box .title span {
    position: relative;
    color: var(--1, #fff5de);
    text-align: center;
    font-family: "BT Oateria";
    font-size: 3rem;
    font-style: normal;
    font-weight: 700;
    line-height: 120%; /* 24px */
    letter-spacing: 0.09rem;
    margin-right: 2.875rem;
    margin-left: 1.4375rem;
    margin-bottom: 0.125rem;
  }
  .title-box .title span:after {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    content: "";
    width: 5.8125rem;
    aspect-ratio: 1/1;
    background-color: #003d1b;
    z-index: -1;
    border-radius: 100%;
    top: 55%;
  }
  .title-box .para {
    width: 36.75rem;
    margin-right: 5.5625rem;
    color: #002d14;
    font-family: "BT Grotesk";
    font-size: 1.375rem;
    font-style: normal;
    font-weight: 600;
    line-height: 140%;
    margin-top: 1.3125rem;
    margin-bottom: 4.375rem;
  }
  .title-box .para--set {
    display: flex;
    flex-direction: column;
    margin-top: 10.625rem;
    margin-bottom: 4.375rem;
  }
  .title-box .para--set .set {
    margin-bottom: 0.4375rem;
    color: var(--4, #00ad27);
    font-feature-settings: "ss02" on;
    font-family: "BT Oateria";
    font-size: 2.1875rem;
    font-style: normal;
    font-weight: 700;
    line-height: 120%; /* 26.4px */
  }
}

.m-switch input[type=checkbox] {
  height: 0;
  width: 0;
  visibility: hidden;
  position: absolute;
}
.m-switch label {
  cursor: pointer;
  text-indent: -9999px;
  width: 1.875rem;
  height: 0.8rem;
  background: transparent;
  display: block;
  border-radius: 99999px;
  position: relative;
  margin-bottom: 0 !important;
  border: 0.6px solid #003d1b;
}
.m-switch label:after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-139%, -48%);
  width: 0.59375rem;
  height: 0.59375rem;
  background: #003d1b;
  border-radius: 100%;
  transition: 0.3s;
}
.m-switch input:checked + label:after {
  left: 50%;
  top: 50%;
  transform: translate(38%, -48%);
}
.m-switch input:checked + label {
  background: #003d1b;
}
.m-switch input:checked + label::after {
  background: #ffd900;
}
.m-switch label:active:after {
  width: 0.75rem;
}
@media (min-width: 768px) {
  .m-switch label {
    width: 5.75625rem;
    height: 2.45rem;
    background: transparent;
    display: block;
    position: relative;
    margin-bottom: 0 !important;
    border: 0.6px solid #003d1b;
  }
  .m-switch label:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-139%, -48%);
    width: 1.813125rem;
    height: 1.813125rem;
    background: #003d1b;
    border-radius: 100%;
    transition: 0.3s;
  }
  .m-switch input:checked + label:after {
    left: 50%;
    top: 50%;
    transform: translate(38%, -48%);
  }
  .m-switch input:checked + label {
    background: #003d1b;
  }
  .m-switch input:checked + label::after {
    background: #ffd900;
  }
  .m-switch label:active:after {
    width: 2.4375rem;
  }
}

.item-group .item-weight {
  position: relative;
  display: flex;
  align-items: stretch;
}
.item-group .item-weight select {
  border: none;
  color: #202020;
  font-family: "BT Beau Sans";
  font-size: 0.752625rem;
  font-style: normal;
  font-weight: 500;
  line-height: 100%; /* 17.81px */
  border: 1px solid #202020;
  background: transparent;
  padding-left: 0.865rem;
  padding-right: 0.865rem;
  margin-right: 8%;
}
.item-group .item-weight select option {
  color: #435646;
  border: 10%;
}
.item-group .item-weight .btn-weight {
  flex-shrink: 0;
  border: 1px solid #202020;
  content: " ";
  width: 18%;
  aspect-ratio: 1/1;
  background-image: url(../img/BT-Asinotte/arow-select.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 0.875rem;
  z-index: 3;
}
.item-group .item-range {
  position: relative;
  z-index: 100;
  display: flex;
  align-items: center;
  gap: 0.243125rem;
  padding: 0.30375rem 0.57625rem 0.30375rem 0.75rem;
  border-radius: 99999px;
  border: 0.289px solid var(--5, #003d1b);
}
.item-group .item-range small {
  color: var(--5, #003d1b);
  text-align: center;
  font-family: "BT Grotesk";
  font-size: 0.5471875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 140%;
  min-width: 1.3125rem;
}
.item-group .item-range .font-size {
  color: var(--5, #003d1b);
  text-align: right;
  font-family: "BT Grotesk";
  font-size: 0.5471875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 140%; /* 12.258px */
}
.item-group .item-range input {
  flex-grow: 1;
  width: 100%;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  height: 1px;
  background: #003d1b;
  cursor: pointer;
  outline: none;
}
.item-group .item-range input::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 0.5625rem;
  height: 0.5625rem;
  background-color: #003d1b;
  border-radius: 50%;
  border: 1px solid #003d1b;
  transition: 0.2s ease-in-out;
}
.item-group .item-range input::-moz-range-thumb {
  -moz-appearance: none;
  appearance: none;
  height: 0.0625rem;
  width: 1.25rem;
  background-color: #003d1b;
  border-radius: 50%;
  border: none;
  -moz-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
  opacity: 0.8;
}
@media (min-width: 768px) {
  .item-group .item-range {
    margin-bottom: 0;
  }
  .item-group .item-range span {
    font-size: 1.125rem;
    margin-right: 1.25rem;
  }
}
.item-group .item-filter {
  margin-bottom: 0;
}
.item-group .item-filter .row {
  align-items: center;
}
.item-group .text-ct {
  margin-top: 1.375rem;
}
.item-group .item-text {
  font-family: "BT Oateria", sans-serif;
  font-size: 4.625rem;
  line-height: 105%;
  color: #003d1b;
  letter-spacing: -0.0925rem;
  margin-left: 0.6875rem;
}
.item-group .item-text:focus {
  outline: none;
}
@media (min-width: 768px) {
  .item-group .item-weight select {
    pointer-events: none;
    border: none;
    color: #435646;
    font-family: "BT Beau Sans";
    font-size: 1.125rem;
    font-style: normal;
    font-weight: 500;
    line-height: 137%; /* 17.81px */
    border: 1px solid #202020;
    background: transparent;
    padding-left: 1.125rem;
    padding-right: 1.0625rem;
    margin-right: 11%;
  }
  .item-group .item-weight select option {
    color: #435646;
    border: 10%;
  }
  .item-group .item-weight .btn-weight {
    display: none;
  }
  .item-group .item-range {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1.5rem 0.625rem 1.5rem;
    margin-top: 0;
  }
  .item-group .item-range small {
    color: var(--5, #003d1b);
    text-align: center;
    font-family: "BT Grotesk";
    font-size: 1.125rem;
    font-style: normal;
    font-weight: 400;
    line-height: 140%;
    min-width: 2.1875rem;
  }
  .item-group .item-range .font-size {
    opacity: 1;
    margin-right: 0;
    white-space: nowrap;
    color: #696969;
    font-family: "BT Grotesk";
    font-size: 1.125rem;
    font-style: normal;
    font-weight: 400;
    line-height: 140%;
  }
  .item-group .item-range input {
    flex-grow: 1;
    width: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    height: 1px;
    background: #003d1b;
    cursor: pointer;
    outline: none;
  }
  .item-group .item-range input::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 0.75rem;
    height: 0.75rem;
    background-color: #003d1b;
    border-radius: 50%;
    border: 1px solid #003d1b;
    transition: 0.2s ease-in-out;
  }
  .item-group .item-range input::-moz-range-thumb {
    -moz-appearance: none;
    appearance: none;
    height: 1.25rem;
    width: 1.25rem;
    background-color: #003d1b;
    border-radius: 50%;
    border: none;
    -moz-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out;
  }
  .item-group .item-filter {
    margin-bottom: 0;
  }
  .item-group .item-filter .row {
    align-items: center;
    justify-content: space-between;
  }
  .item-group .text-ct {
    margin-top: 1.25rem;
  }
  .item-group .item-text {
    font-family: "BT Oateria", sans-serif;
    font-size: 12.5rem;
    letter-spacing: -0.25rem;
    line-height: 110%;
    color: #003d1b;
  }
  .item-group .item-text:focus {
    outline: none;
  }
}

.marquee {
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  background: #afe901;
  padding-top: 0.425625rem;
  padding-bottom: 0.631875rem;
}
.marquee .marquee-ct {
  display: inline-block;
  animation: marquee 5s linear infinite;
}
.marquee .marquee-ct span {
  color: var(--4, #00ad27);
  font-family: "BT Oateria";
  font-size: 2.029125rem;
  font-style: italic;
  font-weight: 900;
  line-height: 95%; /* 30.843px */
  text-transform: uppercase;
  margin-right: 1.599375rem;
}
@media (min-width: 768px) {
  .marquee {
    padding-top: 1.625rem;
    padding-bottom: 2.4375rem;
  }
  .marquee .marquee-ct span {
    color: var(--4, #00ad27);
    font-family: "BT Oateria";
    font-size: 7.75rem;
    font-style: italic;
    font-weight: 900;
    line-height: 95%;
    text-transform: uppercase;
    margin-right: 6.25rem;
  }
}

.marquee--2 {
  background: #ffd900;
}
.marquee--2 .marquee-ct span {
  color: #003d1b;
}

.marquee--3 {
  background: #003d1b;
}
.marquee--3 .marquee-ct span {
  color: #afe901;
}

@keyframes marquee {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-40%);
  }
}
.liga-on {
  font-feature-settings: "liga" on, "dlig" on;
}

.oate-hero .oate-hero__wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 430/878;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  padding-left: 1.125rem;
  padding-right: 1.125rem;
}
.oate-hero .oate-hero__bg {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.oate-hero .oate-hero__bg img {
  width: 100%;
  object-fit: cover;
}
.oate-hero .oate-hero__ct {
  position: relative;
  z-index: 1;
  color: #fff5de;
  width: 100%;
  margin-bottom: 8.21375rem !important;
}
.oate-hero .oate-hero__ct .oate-hero__ct-top {
  color: var(--1, #fff5de);
  font-family: "BT Oateria";
  font-size: 1rem;
  font-style: normal;
  font-weight: 350;
  line-height: 100%;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: -15%;
}
.oate-hero .oate-hero__ct .oate-hero__ct-top p:last-of-type {
  text-align: right;
}
.oate-hero .oate-hero__ct h1 {
  color: #fff5de !important;
  text-align: center;
  font-family: "BT Oateria";
  font-size: 5.87275rem;
  font-style: normal;
  font-weight: 350;
  line-height: 90%;
  letter-spacing: -0.1761875rem;
  text-transform: uppercase;
}
@media (min-width: 768px) {
  .oate-hero .oate-hero__wrap {
    position: relative;
    width: 100%;
    aspect-ratio: 1920/1286;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    padding-left: 4.375rem;
    padding-right: 4.375rem;
  }
  .oate-hero .oate-hero__ct {
    position: relative;
    z-index: 1;
    color: #fff5de;
    width: 100%;
    margin-bottom: 17.125rem !important;
  }
  .oate-hero .oate-hero__ct .oate-hero__ct-top {
    color: var(--1, #fff5de);
    font-family: "BT Oateria";
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: -2%;
  }
  .oate-hero .oate-hero__ct .oate-hero__ct-top p {
    margin-bottom: 0;
  }
  .oate-hero .oate-hero__ct .oate-hero__ct-top p:last-of-type {
    text-align: right;
  }
  .oate-hero .oate-hero__ct h1 {
    color: #fff5de !important;
    text-align: center;
    font-family: "BT Oateria";
    font-size: 20.51175rem !important;
    font-style: normal;
    font-weight: 700;
    line-height: 101.72%;
    letter-spacing: -0.615375rem;
    text-transform: uppercase;
    margin-left: -1.375rem;
    margin-right: -1rem;
    margin-bottom: 0 !important;
  }
}

.oate-concept {
  margin-top: -14%;
}
.oate-concept .oate-concept-cloud {
  width: 100%;
}
.oate-concept .oate-concept__qoute {
  color: var(--5, #003d1b);
  font-family: "BT Oateria";
  font-size: 2.375rem;
  font-style: normal;
  font-weight: 350;
  line-height: 120%; /* 45.6px */
  text-transform: uppercase;
  margin-top: 3.0625rem;
  margin-bottom: 4.4375rem;
}
.oate-concept .oate-concept__qoute p {
  margin-bottom: 0;
}
.oate-concept .vid {
  width: 100%;
}
.oate-concept .vid .vid-content {
  width: 100%;
  aspect-ratio: 394/750;
  background-color: red;
}
@media (min-width: 768px) {
  .oate-concept {
    margin-top: -7%;
  }
  .oate-concept .oate-concept__qoute {
    font-family: "BT Oateria";
    font-size: 7.761375rem;
    font-style: normal;
    font-weight: 350;
    line-height: 110%; /* 136.6px */
    text-transform: uppercase;
    padding-right: 14.3125rem;
    margin-top: 9.125rem;
    margin-bottom: 11.75rem;
  }
  .oate-concept .vid {
    width: 100%;
    padding: 0;
  }
  .oate-concept .vid .vid-content {
    width: 100%;
    aspect-ratio: 1920/1080;
    background-color: red;
  }
}

.oate-tech {
  margin-top: 5.10375rem;
}
.oate-tech .title-box .para--set {
  margin-right: 0.0625rem;
}
@media (min-width: 768px) {
  .oate-tech {
    margin-top: 10.125rem;
  }
  .oate-tech .title-box .para--set {
    width: 39.625rem;
    margin-right: 2.875rem;
  }
}

.fonts-stl-bot {
  margin-top: 1.523125rem;
}
.fonts-stl-bot .fonts-stl-bot-wrap {
  width: 100%;
  aspect-ratio: 394/720;
  background-color: #00ad27;
  border-radius: 1.25rem;
  overflow: hidden;
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding-top: 1.77625rem;
}
.fonts-stl-bot .fonts-stl-bot-sli__wrap {
  display: flex;
  align-items: center;
  padding-left: 5.505rem;
  padding-right: 5.539375rem;
  width: 100%;
}
.fonts-stl-bot .fonts-stl-bot-sli {
  padding: 0.351875rem 0.845rem;
  border: 0.4px solid #002d14;
  border-radius: 999999px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.fonts-stl-bot .fonts-stl-bot-sli p {
  color: #002d14;
  text-align: center;
  font-family: "BT Grotesk";
  font-size: 10.141px;
  font-style: normal;
  font-weight: 400;
  line-height: 140%; /* 14.197px */
  margin-bottom: 0;
}
.fonts-stl-bot .fonts-stl-bot-sli .weight-range {
  min-width: 1.25rem;
}
.fonts-stl-bot .fonts-stl-bot-sli input {
  flex-grow: 1;
  width: 60%;
  margin: 0 0.625rem;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  height: 0.5px;
  background: #002d14;
  cursor: pointer;
  outline: none;
}
.fonts-stl-bot .fonts-stl-bot-sli input::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 0.5rem;
  height: 0.5rem;
  background-color: #002d14;
  border-radius: 50%;
  transition: 0.2s ease-in-out;
}
.fonts-stl-bot .fonts-stl-bot-sli input::-moz-range-thumb {
  -moz-appearance: none;
  appearance: none;
  height: 1.25rem;
  width: 1.25rem;
  background-color: #d9d9d9;
  border-radius: 50%;
  border: none;
  -moz-transition: 0.2s ease-in-out;
  transition: 0;
}
.fonts-stl-bot .fonts-stl-bot__ct-wrap {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
}
.fonts-stl-bot .fonts-stl-ct {
  color: #e8e0d4;
  margin: auto 0;
  margin-top: 3.206875rem;
  padding: 0 3.1875rem;
}
.fonts-stl-bot .fonts-stl-ct p {
  color: #000;
  text-align: center;
  font-family: "BT Oateria vr";
  font-size: 5.3125rem;
  font-style: normal;
  font-variation-settings: "wght" 350;
  line-height: 100%; /* 85px */
  letter-spacing: 0.85px;
  text-transform: uppercase;
  word-break: break-all;
  margin-bottom: 0;
}
.fonts-stl-bot .fonts-stl-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.fonts-stl-bot .fonts-stl-sw {
  display: inline-flex;
  align-items: center;
  gap: 0.20625rem;
  padding: 0.385625rem 0.42375rem 0.385625rem 0.77125rem;
  border-radius: 35.696px;
  border: 0.6px solid var(--5, #003d1b);
  margin-bottom: 1.805625rem;
}
.fonts-stl-bot .fonts-stl-sw p {
  color: #002d14;
  text-align: center;
  font-family: "BT Grotesk";
  font-size: 0.625rem;
  font-style: normal;
  font-weight: 400;
  line-height: 140%;
  margin-bottom: 0 !important;
}
@media (min-width: 768px) {
  .fonts-stl-bot {
    margin-top: 1.90625rem;
  }
  .fonts-stl-bot .fonts-stl-bot-wrap {
    width: 100%;
    aspect-ratio: 1780/1134;
    flex-direction: column-reverse;
    border-radius: 1.875rem;
    padding-bottom: 0;
    padding-top: 5.375rem;
  }
  .fonts-stl-bot .fonts-stl-bot-sli__wrap {
    padding-left: 23rem;
    padding-right: 24.5rem;
    gap: 0.84rem;
  }
  .fonts-stl-bot .fonts-stl-bot-sli {
    width: 100%;
    padding: 1.055625rem 2.533125rem;
  }
  .fonts-stl-bot .fonts-stl-bot-sli p {
    color: #002d14;
    text-align: center;
    font-family: "BT Grotesk";
    font-size: 1.9rem;
    font-style: normal;
    font-weight: 400;
    line-height: 140%; /* 42.56px */
    margin-bottom: 0;
  }
  .fonts-stl-bot .fonts-stl-bot-sli input {
    flex-grow: 1;
    width: 50%;
    margin: 0 0.844375rem;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    height: 1.5px;
    background: #002d14;
    cursor: pointer;
    outline: none;
  }
  .fonts-stl-bot .fonts-stl-bot-sli input::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 1.125rem;
    height: 1.125rem;
    background-color: #002d14;
    border-radius: 50%;
    transition: 0.2s ease-in-out;
  }
  .fonts-stl-bot .fonts-stl-bot-sli input::-moz-range-thumb {
    -moz-appearance: none;
    appearance: none;
    height: 1.25rem;
    width: 1.25rem;
    background-color: #d9d9d9;
    border-radius: 50%;
    border: none;
    -moz-transition: 0.2s ease-in-out;
    transition: 0;
  }
  .fonts-stl-bot .fonts-stl-ct {
    color: #e8e0d4;
    margin: auto 0;
    padding-bottom: 0;
    padding-top: 0;
  }
  .fonts-stl-bot .fonts-stl-ct p {
    color: #000;
    text-align: center;
    font-family: "BT Oateria vr";
    font-size: 15.625rem;
    font-style: normal;
    font-variation-settings: "wght" 800;
    line-height: 92.894%; /*  */
    text-transform: uppercase;
  }
  .fonts-stl-bot .fonts-stl-sw {
    display: inline-flex;
    align-items: center;
    gap: 0.634375rem;
    padding: 1.1rem 1.1rem 1.1rem 2.1325rem;
    border-radius: 9999px;
    border: 0.6px solid var(--5, #003d1b);
    margin-bottom: 0;
  }
  .fonts-stl-bot .fonts-stl-sw p {
    color: #002d14;
    text-align: center;
    font-family: "BT Grotesk";
    font-size: 1.9rem;
    font-style: normal;
    font-weight: 400;
    line-height: 140%;
    margin-bottom: 0 !important;
  }
}

.oate-tech-swiper {
  margin-top: 1.4375rem;
}
.oate-tech-swiper .oate-tech-swiper__wrap .img-wrap {
  width: 100%;
  height: auto;
}
.oate-tech-swiper .oate-tech-swiper__wrap .oate-ct {
  position: relative;
  padding: 0 0.8125rem;
  background-color: #ffd900;
  width: 100%;
  aspect-ratio: 430/484;
  display: flex;
  justify-content: center;
  align-items: center;
}
.oate-tech-swiper .oate-tech-swiper__wrap .oate-ct .tag {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  transform: translate(-149%, -153%);
  padding: 0.425rem 0.901875rem;
  border-radius: 99999px;
  background-color: #00ad27;
  color: var(--3, #afe901);
  text-align: center;
  font-family: "BT Oateria";
  font-size: 1.25975rem;
  font-style: normal;
  font-weight: 350;
  line-height: 100%; /* 20.156px */
  text-transform: uppercase;
}
.oate-tech-swiper .oate-tech-swiper__wrap .oate-ct .tag--2 {
  transform: translate(34%, 226%);
  padding: 0.425rem 0.96rem;
  color: #003d1b;
  background-color: #fff5de;
}
.oate-tech-swiper .oate-tech-swiper__wrap .oate-ct .oate-ct-para {
  color: var(--5, #003d1b);
  text-align: center;
  font-family: "BT Oateria";
  font-size: 4.19925rem;
  font-style: normal;
  font-weight: 300;
  line-height: 105%;
}
.oate-tech-swiper .oate-tech-swiper__wrap .oate-ct--2 {
  background-color: #afe901;
}
.oate-tech-swiper .oate-tech-swiper__wrap .oate-ct--2 .tag {
  transform: translate(126%, -249%);
  padding: 0.425rem 0.901875rem;
  background-color: #fff5de;
  color: var(--3, #000);
}
.oate-tech-swiper .oate-tech-swiper__wrap .oate-ct--2 .tag--2 {
  transform: translate(-120%, 70%);
  padding: 0.42rem 0.98rem;
  background-color: #ffd900;
}
.oate-tech-swiper .oate-tech-swiper__wrap .oate-ct--2 .oate-ct-para {
  color: #000;
  font-size: 4.19925rem;
  font-weight: 800;
  line-height: 110%;
}
.oate-tech-swiper .oate-tech-swiper__wrap .oate-ct--3 {
  background-color: #00ad27;
}
.oate-tech-swiper .oate-tech-swiper__wrap .oate-ct--3 .tag {
  transform: translate(126%, -249%);
  padding: 0.42rem 0.98rem;
  background-color: #ffd900;
  color: var(--3, #000);
}
.oate-tech-swiper .oate-tech-swiper__wrap .oate-ct--3 .tag--2 {
  transform: translate(-134%, 70%);
  padding: 0.42rem 0.98rem;
  color: #afe901;
  background-color: #003d1b;
}
.oate-tech-swiper .oate-tech-swiper__wrap .oate-ct--3 .oate-ct-para {
  color: #fff5de;
  font-size: 4.19925rem;
  font-weight: 900;
  line-height: 115%;
}
.oate-tech-swiper .swiper-slide .tag {
  transform-origin: center center;
}
.oate-tech-swiper .swiper-slide .tag--1 {
  scale: 0.6;
  opacity: 0;
  transition: all 0.6s ease 0.3s;
}
.oate-tech-swiper .swiper-slide.swiper-slide-active .tag--1 {
  scale: 1;
  opacity: 1;
  transition: all 0.6s ease 0.3s;
}
.oate-tech-swiper .swiper-slide .tag--2 {
  scale: 0.6;
  opacity: 0;
  transition: all 0.6s ease 0.6s;
}
.oate-tech-swiper .swiper-slide.swiper-slide-active .tag--2 {
  scale: 1;
  opacity: 1;
  transition: all 0.6s ease 0.6s;
}
@media (min-width: 768px) {
  .oate-tech-swiper {
    margin-top: 4.8125rem;
  }
  .oate-tech-swiper .oate-tech-swiper__wrap {
    display: flex;
  }
  .oate-tech-swiper .oate-tech-swiper__wrap .img-wrap {
    width: 50%;
  }
  .oate-tech-swiper .oate-tech-swiper__wrap .oate-ct {
    width: 50%;
    position: relative;
    padding: 0 1.8125rem;
    background-color: #ffd900;
  }
  .oate-tech-swiper .oate-tech-swiper__wrap .oate-ct .tag {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transform: translate(-149%, -153%);
    padding: 0.9375rem 2.1875rem;
    border-radius: 99999px;
    background-color: #00ad27;
    color: var(--3, #afe901);
    text-align: center;
    font-family: "BT Oateria";
    font-size: 2.8125rem;
    font-style: normal;
    font-weight: 600;
    line-height: 100%; /* 20.156px */
    text-transform: uppercase;
  }
  .oate-tech-swiper .oate-tech-swiper__wrap .oate-ct .tag--2 {
    transform: translate(34%, 226%);
    color: #003d1b;
    background-color: #fff5de;
  }
  .oate-tech-swiper .oate-tech-swiper__wrap .oate-ct .oate-ct-para {
    color: var(--5, #003d1b);
    text-align: center;
    font-family: "BT Oateria";
    font-size: 9.375rem;
    font-style: normal;
    font-weight: 600;
    line-height: 105%;
  }
  .oate-tech-swiper .oate-tech-swiper__wrap .oate-ct--2 {
    background-color: #afe901;
  }
  .oate-tech-swiper .oate-tech-swiper__wrap .oate-ct--2 .tag {
    transform: translate(126%, -249%);
    padding: 0.9375rem 2.1875rem;
    background-color: #fff5de;
    color: var(--3, #000);
  }
  .oate-tech-swiper .oate-tech-swiper__wrap .oate-ct--2 .tag--2 {
    transform: translate(-120%, 70%);
    background-color: #ffd900;
  }
  .oate-tech-swiper .oate-tech-swiper__wrap .oate-ct--2 .oate-ct-para {
    color: #000;
    font-size: 9.375rem;
    font-weight: 800;
    line-height: 110%;
  }
  .oate-tech-swiper .oate-tech-swiper__wrap .oate-ct--3 {
    background-color: #00ad27;
  }
  .oate-tech-swiper .oate-tech-swiper__wrap .oate-ct--3 .tag {
    transform: translate(126%, -249%);
    padding: 0.9375rem 2.1875rem;
    background-color: #ffd900;
    color: var(--3, #000);
  }
  .oate-tech-swiper .oate-tech-swiper__wrap .oate-ct--3 .tag--2 {
    transform: translate(-134%, 70%);
    color: #afe901;
    background-color: #003d1b;
  }
  .oate-tech-swiper .oate-tech-swiper__wrap .oate-ct--3 .oate-ct-para {
    color: #fff5de;
    font-size: 9.375rem;
    font-weight: 900;
    line-height: 115%;
  }
}

.oate-specimens {
  background-color: #003d1b;
  padding-bottom: 1.4375rem;
  overflow: hidden;
}
.oate-specimens .spe-wrap {
  margin-top: 1.6875rem;
}
.oate-specimens .spe-bg {
  border-radius: 1.0851875rem;
  background-color: #fff5de;
}
.oate-specimens .item-group {
  padding: 0 1.125rem;
  padding-top: 1.2675rem;
  padding-bottom: 2.375rem;
  border-radius: 10%;
  border-radius: 1.0851875rem;
  background-color: #fff5de;
}
.oate-specimens .item-group .item-filter {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.oate-specimens .item-group .item-filter-left {
  display: flex;
  align-items: center;
  gap: 0.375rem;
}
.oate-specimens .item-group .item-filter-left .item-filter__weight {
  padding: 0.30375rem 0.729375rem;
  border-radius: 999999px;
  border: 0.289px solid var(--5, #003d1b);
  color: var(--5, #003d1b);
  text-align: center;
  font-family: "BT Grotesk";
  font-size: 0.625rem;
  font-style: normal;
  font-weight: 400;
  line-height: 140%; /* 12.258px */
}
.oate-specimens .item-group .item-filter-left .fonts-stl-sw {
  display: flex;
  align-items: center;
  gap: 0.180625rem;
  padding: 0.30375rem 0.38rem 0.30375rem 0.68375rem;
  border-radius: 35.696px;
  border: 0.6px solid var(--5, #003d1b);
  margin-bottom: 0;
}
.oate-specimens .item-group .item-filter-left .fonts-stl-sw p {
  color: #002d14;
  text-align: center;
  font-family: "BT Grotesk";
  font-size: 0.5471875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 140%;
  margin-bottom: 0 !important;
}
.oate-specimens .item-group .item-filter-left .fonts-stl-sw .m-switch label {
  cursor: pointer;
  text-indent: -9999px;
  width: 1.8125rem;
  height: 1rem;
  background: transparent;
  display: block;
  border-radius: 99999px;
  position: relative;
  margin-bottom: 0 !important;
  border: 0.6px solid #003d1b;
}
.oate-specimens .item-group .item-filter-left .fonts-stl-sw .m-switch label:after {
  top: 50%;
  left: 50%;
  transform: translate(-100%, -50%);
  width: 0.75rem;
  height: 0.75rem;
  background: #003d1b;
  border-radius: 100%;
  transition: 0.3s;
}
.oate-specimens .item-group .item-filter-left .fonts-stl-sw .m-switch input:checked + label:after {
  left: 50%;
  top: 50%;
  transform: translate(4%, -50%);
}
.oate-specimens .item-group .item-filter-left .fonts-stl-sw .m-switch input:checked + label {
  background: #003d1b;
}
.oate-specimens .item-group .item-filter-left .fonts-stl-sw .m-switch input:checked + label::after {
  background: #ffd900;
}
.oate-specimens .item-group .item-filter-right {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.oate-specimens .item-group + .item-group {
  margin-top: 1.25rem;
}
.oate-specimens .item-group--2 .item-text {
  font-family: "BT Oateria", sans-serif;
  font-size: 3.4375rem;
  line-height: 115%;
  color: #003d1b;
  letter-spacing: -0.034375rem;
}
.oate-specimens .item-group--2 .item-text:focus {
  outline: none;
}
.oate-specimens .item-group--3 .item-text {
  font-family: "BT Oateria", sans-serif;
  font-size: 2.5rem;
  line-height: 115%;
  color: #003d1b;
  letter-spacing: 0;
}
.oate-specimens .item-group--3 .item-text:focus {
  outline: none;
}
.oate-specimens .item-group--4 .item-text {
  font-family: "BT Oateria", sans-serif;
  font-size: 2rem;
  line-height: 115%;
  color: #003d1b;
  letter-spacing: -0.034375rem;
}
.oate-specimens .item-group--4 .item-text:focus {
  outline: none;
}
.oate-specimens .item-group--5 .item-text {
  font-family: "BT Oateria", sans-serif;
  font-size: 1.375rem;
  line-height: 120%;
  color: #003d1b;
  margin-left: 0;
  letter-spacing: 0;
}
.oate-specimens .item-group--5 .item-text:focus {
  outline: none;
}
.oate-specimens .item-group--6 .item-text {
  font-family: "BT Oateria", sans-serif;
  font-size: 0.875rem;
  line-height: 125%;
  color: #003d1b;
  margin-left: 0;
  letter-spacing: 0;
}
.oate-specimens .item-group--6 .item-text:focus {
  outline: none;
}
@media (min-width: 768px) {
  .oate-specimens {
    padding-bottom: 4.625rem;
  }
  .oate-specimens .spe-wrap {
    margin-top: 4.8125rem;
  }
  .oate-specimens .item-group {
    padding: 0 4.375rem;
    padding-top: 3.3125rem;
    padding-bottom: 4.5rem;
    border-radius: 10%;
    border-radius: 1.875rem;
    background-color: #fff5de;
  }
  .oate-specimens .item-group .item-filter {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
  }
  .oate-specimens .item-group .item-filter-left {
    display: flex;
    align-items: center;
    gap: 0.625rem;
  }
  .oate-specimens .item-group .item-filter-left .item-filter__weight {
    padding: 0.625rem 1.5rem;
    border-radius: 999999px;
    border: 0.595px solid var(--5, #003d1b);
    color: var(--5, #003d1b);
    text-align: center;
    font-family: "BT Grotesk";
    font-size: 1.125rem;
    font-style: normal;
    font-weight: 400;
    line-height: 140%; /* 12.258px */
  }
  .oate-specimens .item-group .item-filter-left .fonts-stl-sw {
    display: flex;
    align-items: center;
    gap: 0.371875rem;
    padding: 0.625rem 0.625rem 0.625rem 1.25rem;
    border-radius: 999999px;
    border: 0.6px solid var(--5, #003d1b);
    margin-bottom: 0;
  }
  .oate-specimens .item-group .item-filter-left .fonts-stl-sw p {
    color: #002d14;
    text-align: center;
    font-family: "BT Grotesk";
    font-size: 1.125rem;
    font-style: normal;
    font-weight: 400;
    line-height: 140%;
    margin-bottom: 0 !important;
  }
  .oate-specimens .item-group .item-filter-left .fonts-stl-sw .m-switch label {
    cursor: pointer;
    text-indent: -9999px;
    width: 3.375rem;
    height: 1.4375rem;
    background: transparent;
    display: block;
    border-radius: 99999px;
    position: relative;
    margin-bottom: 0 !important;
    border: 0.6px solid #003d1b;
  }
  .oate-specimens .item-group .item-filter-left .fonts-stl-sw .m-switch label:after {
    top: 50%;
    left: 50%;
    transform: translate(-140%, -50%);
    width: 1.0625rem;
    height: 1.0625rem;
    background: #003d1b;
    border-radius: 100%;
    transition: 0.3s;
  }
  .oate-specimens .item-group .item-filter-left .fonts-stl-sw .m-switch input:checked + label:after {
    left: 50%;
    top: 50%;
    transform: translate(39%, -50%);
  }
  .oate-specimens .item-group .item-filter-left .fonts-stl-sw .m-switch input:checked + label {
    background: #003d1b;
  }
  .oate-specimens .item-group .item-filter-left .fonts-stl-sw .m-switch input:checked + label::after {
    background: #ffd900;
  }
  .oate-specimens .item-group .item-filter-right {
    display: flex;
    flex-direction: row;
    gap: 0.5625rem;
    width: 70%;
  }
  .oate-specimens .item-group .item-range {
    width: 33%;
  }
  .oate-specimens .item-group + .item-group {
    margin-top: 1.875rem;
  }
  .oate-specimens .item-group--2 .item-text {
    font-family: "BT Oateria", sans-serif;
    font-size: 10rem;
    line-height: 110%;
    color: #003d1b;
    letter-spacing: -0.1rem;
  }
  .oate-specimens .item-group--2 .item-text:focus {
    outline: none;
  }
  .oate-specimens .item-group--3 .item-text {
    font-family: "BT Oateria", sans-serif;
    font-size: 7.5rem;
    line-height: 115%;
    color: #003d1b;
    letter-spacing: 0;
  }
  .oate-specimens .item-group--3 .item-text:focus {
    outline: none;
  }
  .oate-specimens .item-group--4 .item-text {
    font-family: "BT Oateria", sans-serif;
    font-size: 6.25rem;
    line-height: 110%;
    color: #003d1b;
    letter-spacing: 0;
  }
  .oate-specimens .item-group--4 .item-text:focus {
    outline: none;
  }
  .oate-specimens .item-group--5 .item-text {
    font-family: "BT Oateria", sans-serif;
    font-size: 4.375rem;
    line-height: 120%;
    color: #003d1b;
    margin-left: 0;
    letter-spacing: 0;
  }
  .oate-specimens .item-group--5 .item-text:focus {
    outline: none;
  }
  .oate-specimens .item-group--6 .item-text {
    font-family: "BT Oateria", sans-serif;
    font-size: 2.5rem;
    line-height: 125%;
    color: #003d1b;
    margin-left: 0;
    letter-spacing: 0;
  }
  .oate-specimens .item-group--6 .item-text:focus {
    outline: none;
  }
}

.oate-nature .oate-nature__tree {
  width: 100%;
}
.oate-nature .oate-nature__mock {
  display: flex;
  background-color: #00ad27;
  padding: 3.2875rem 1.1875rem 2.518125rem 2.25rem;
  gap: 1.59125rem;
}
.oate-nature .oate-nature__milk {
  width: 9rem;
  aspect-ratio: 144/391;
}
.oate-nature .oate-nature__milk img {
  height: auto;
}
.oate-nature .oate-nature__jar-wrap {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 1.21125rem;
}
.oate-nature .oate-nature__jar {
  width: 9.5625rem;
  aspect-ratio: 153/103.31;
  margin-left: 0.625rem;
}
.oate-nature .oate-nature__jar img {
  height: auto;
}
.oate-nature .oate-nature__foam {
  width: 12.78375rem;
  aspect-ratio: 204.54/265.6;
}
.oate-nature .oate-nature__foam img {
  height: auto;
}
@media (min-width: 768px) {
  .oate-nature .oate-nature__wrap {
    display: flex;
  }
  .oate-nature .oate-nature__tree {
    width: 50%;
    aspect-ratio: 960/1080;
  }
  .oate-nature .oate-nature__mock {
    width: 50%;
    overflow: hidden;
    padding: 7.375rem 2.655rem 5.5525rem 5.28375rem;
    gap: 3.5525rem;
  }
  .oate-nature .oate-nature__milk {
    width: 20.0625rem;
    aspect-ratio: 321/873;
  }
  .oate-nature .oate-nature__milk .img-wrap {
    height: auto;
  }
  .oate-nature .oate-nature__jar-wrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 2.70375rem;
  }
  .oate-nature .oate-nature__jar {
    width: 21.3125rem;
    aspect-ratio: 341/231;
    margin-left: 0.625rem;
  }
  .oate-nature .oate-nature__foam {
    width: 28.5625rem;
    aspect-ratio: 457/593;
  }
}

.oate-taste {
  position: relative;
  background-color: #003d1b;
}
.oate-taste .taste-wrap {
  padding: 0 1.125rem;
  padding-top: 2.375rem;
  padding-bottom: 3.5625rem;
}
.oate-taste .taste-title {
  color: var(--1, #fff5de);
  font-family: "BT Oateria";
  font-size: 4.0625rem;
  font-style: normal;
  font-weight: 350;
  line-height: 110%; /* 71.5px */
  letter-spacing: -0.040625rem;
}
.oate-taste .taste-title span {
  color: var(--3, #afe901);
  font-family: "BT Oateria vr";
  font-size: 4.0625rem;
  font-style: normal;
  font-weight: 350;
  line-height: 110%;
  letter-spacing: -0.65px;
  margin-left: -2%;
}
.oate-taste .taste-ct {
  margin-top: 3.1875rem;
}
.oate-taste .taste-ct .taste-ct-list {
  display: flex;
  justify-content: space-between;
  gap: 1.875rem;
  margin-right: -0.75rem;
}
.oate-taste .taste-ct .taste-ct-item {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.oate-taste .taste-ct .taste-ct-item h4 {
  color: var(--3, #afe901);
  font-family: "BT Oateria";
  font-size: 0.9375rem;
  font-style: normal;
  font-weight: 350;
  line-height: 120%; /* 18px */
  letter-spacing: 0.3px;
  text-transform: uppercase;
  margin-bottom: 0;
}
.oate-taste .taste-ct .taste-ct-item p {
  margin-top: 0.3125rem;
  color: var(--1, #fff5de);
  font-family: "BT Oateria";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 250;
  line-height: 120%; /* 16.8px */
  margin-bottom: 0;
}
.oate-taste .taste-ct .taste-ct-item + .taste-ct-item {
  position: relative;
}
.oate-taste .taste-ct .taste-ct-item + .taste-ct-item::after {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  content: "";
  width: 100%;
  height: 110%;
  border-left: 0.5px dashed #fff5de;
  transform: translate(-67%, -48%);
}
.oate-taste .taste-ct .taste-ct-button {
  margin-top: 2.3125rem;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 9999px;
  width: 100%;
  aspect-ratio: 367/38;
  color: var(--5, #003d1b);
  font-family: "BT Oateria";
  font-size: 0.8574375rem;
  font-style: normal;
  font-weight: 350;
  line-height: 115%; /* 15.777px */
  letter-spacing: -0.137px;
  background-color: #ffd900;
}
@media (min-width: 768px) {
  .oate-taste {
    cursor: none;
  }
  .oate-taste .cursor-custom {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 4.8125rem;
    aspect-ratio: 77/85;
    background-image: url("../img/BT-Oateria/flow.svg");
    background-size: contain;
    background-repeat: no-repeat;
    transform-origin: center center;
    position: fixed;
    pointer-events: none;
    z-index: 9999;
    display: none;
    animation: rotateCursor 2s linear infinite;
  }
  .oate-taste .cursor-custom.active {
    display: block;
  }
  @keyframes rotateCursor {
    from {
      transform: translate(-50%, -50%) rotate(0deg);
    }
    to {
      transform: translate(-50%, -50%) rotate(360deg);
    }
  }
  .oate-taste .taste-wrap {
    padding: 0;
    padding-top: 3.375rem;
    padding-bottom: 6.625rem;
    display: flex;
    justify-content: space-between;
    gap: 9.1875rem;
  }
  .oate-taste .taste-title {
    color: var(--1, #fff5de);
    font-family: "BT Oateria";
    font-size: 14.375rem;
    font-style: normal;
    font-weight: 700;
    line-height: 100%; /* 71.5px */
    letter-spacing: -0.14375rem;
  }
  .oate-taste .taste-ct {
    width: 72%;
    margin-top: 5.5625rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  .oate-taste .taste-ct .taste-ct-list {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 5.5625rem;
    margin-right: 0;
  }
  .oate-taste .taste-ct .taste-ct-item {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  .oate-taste .taste-ct .taste-ct-item h4 {
    color: var(--3, #afe901);
    font-family: "BT Oateria";
    font-size: 2rem;
    font-style: normal;
    font-weight: 700;
    line-height: 95%; /* 18px */
    letter-spacing: 0.64px;
    text-transform: uppercase;
    margin-bottom: 0;
  }
  .oate-taste .taste-ct .taste-ct-item p {
    margin-top: 0.3125rem;
    color: var(--1, #fff5de);
    font-family: "BT Oateria";
    font-size: 1.5625rem;
    font-style: normal;
    font-weight: 500;
    line-height: 120%; /* 16.8px */
    margin-bottom: 0;
  }
  .oate-taste .taste-ct .taste-ct-item + .taste-ct-item {
    position: relative;
  }
  .oate-taste .taste-ct .taste-ct-item + .taste-ct-item::after {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    content: "";
    width: 100%;
    height: 110%;
    border-top: 0.5px dashed #fff5de;
    border-left: 0;
    transform: translate(-50%, -84%);
  }
  .oate-taste .taste-ct .taste-ct-button {
    margin-top: 2.3125rem;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 9999px;
    width: 100%;
    aspect-ratio: 374/64;
    color: var(--5, #003d1b);
    font-family: "BT Oateria";
    font-size: 1.875rem;
    font-style: normal;
    font-weight: 350;
    line-height: 115%; /* 15.777px */
    letter-spacing: -0.01875rem;
    background-color: #ffd900;
  }
}

.oate-font-move {
  padding-top: 3.125rem;
  padding-bottom: 3.125rem;
}
.oate-font-move .font-move-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding: 0 0.75rem;
}
.oate-font-move .font-move-typef {
  color: var(--5, #003d1b);
  text-align: center;
  font-family: "BT Grotesk";
  font-size: 0.625rem;
  font-style: normal;
  font-weight: 400;
  line-height: 140%; /* 14px */
  padding: 0.34375rem 0.59875rem;
  border-radius: 1.5625rem;
  border: 1px solid var(--5, #003d1b);
}
.oate-font-move .font-move-typef p {
  margin-bottom: 0;
}
.oate-font-move .font-move-stl {
  display: flex;
  gap: 0.375rem;
}
.oate-font-move .font-move-stl .fonts-stl-bot-sli {
  padding: 0.351875rem 0.845rem;
  border: 0.4px solid #002d14;
  border-radius: 999999px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.oate-font-move .font-move-stl .fonts-stl-bot-sli p {
  color: #002d14;
  text-align: center;
  font-family: "BT Grotesk";
  font-size: 10.141px;
  font-style: normal;
  font-weight: 400;
  line-height: 140%; /* 14.197px */
  margin-bottom: 0;
}
.oate-font-move .font-move-stl .fonts-stl-bot-sli .weight-range {
  min-width: 1.25rem;
}
.oate-font-move .font-move-stl .fonts-stl-bot-sli input {
  flex-grow: 1;
  width: 60%;
  margin: 0 0.625rem;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  height: 0.5px;
  background: #002d14;
  cursor: pointer;
  outline: none;
}
.oate-font-move .font-move-stl .fonts-stl-bot-sli input::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 0.5rem;
  height: 0.5rem;
  background-color: #002d14;
  border-radius: 50%;
  transition: 0.2s ease-in-out;
}
.oate-font-move .font-move-stl .fonts-stl-bot-sli input::-moz-range-thumb {
  -moz-appearance: none;
  appearance: none;
  height: 1.25rem;
  width: 1.25rem;
  background-color: #d9d9d9;
  border-radius: 50%;
  border: none;
  -moz-transition: 0.2s ease-in-out;
  transition: 0;
}
.oate-font-move .font-move-stl .fonts-stl-sw {
  display: inline-flex;
  align-items: center;
  gap: 0.20625rem;
  padding: 0.385625rem 0.42375rem 0.385625rem 0.77125rem;
  border-radius: 35.696px;
  border: 0.6px solid var(--5, #003d1b);
}
.oate-font-move .font-move-stl .fonts-stl-sw p {
  color: #002d14;
  text-align: center;
  font-family: "BT Grotesk";
  font-size: 0.625rem;
  font-style: normal;
  font-weight: 400;
  line-height: 140%;
  margin-bottom: 0 !important;
}
.oate-font-move .font-move-stl .fonts-stl-sw label:after {
  top: 55%;
  transform: translate(-136%, -60%);
}
.oate-font-move .font-move-stl .fonts-stl-sw input:checked + label:after {
  transform: translate(45%, -60%);
}
.oate-font-move .font-range {
  position: relative;
  width: 8%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}
.oate-font-move .font-range input {
  -webkit-appearance: slider-vertical;
  writing-mode: bt-lr;
  height: 100%;
  width: 1px;
  margin: 0.625rem 0;
  padding: 0;
  cursor: pointer;
  background: #003d1b;
}
.oate-font-move .font-range input::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  height: 0.46875rem;
  width: 0.46875rem;
  background: #003d1b;
  border-radius: 100%;
  margin-top: 0;
  transition: all 0.2s ease;
}
.oate-font-move .font-range input::-moz-range-thumb {
  -moz-appearance: none;
  appearance: none;
  height: 0.0625rem;
  width: 1.25rem;
  background-color: #000;
  border-radius: 50%;
  border: none;
  -moz-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
  opacity: 0.8;
}
.oate-font-move .font-range .font-size {
  white-space: nowrap;
  color: var(--5, #003d1b);
  text-align: right;
  font-family: "BT Grotesk";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 400;
  line-height: 140%; /* 16.8px */
}
.oate-font-move .font-move-number {
  margin-top: 2.3125rem;
  margin-bottom: 2.3125rem;
  width: 70.23%;
  text-rendering: geometricPrecision;
  text-align: center;
  will-change: font-variation-settings;
}
.oate-font-move .font-move-number .font-move-number__tag {
  display: inline-flex;
  padding: 0.28875rem 0.804375rem;
  color: var(--5, #003d1b);
  text-align: center;
  font-family: "BT Grotesk";
  font-size: 0.462375rem;
  font-style: normal;
  font-weight: 400;
  line-height: 140%; /* 10.357px */
  text-transform: uppercase;
  border-radius: 999999px;
  border: 0.462px solid var(--5, #003d1b);
  letter-spacing: 0;
}
.oate-font-move .font-move-number .number {
  color: var(--4, #00ad27);
  font-family: "BT Oateria vr";
  font-size: 8.125rem;
  font-style: normal;
  font-variation-settings: "wght" 800;
  line-height: 95%; /* 123.5px */
  letter-spacing: 0.1625rem;
  word-break: break-all;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-smoothing: antialiased;
  text-rendering: geometricPrecision;
  will-change: font-variation-settings;
}
.oate-font-move .font-move-number .number--2 {
  color: #002d14;
}
@media (min-width: 768px) {
  .oate-font-move {
    padding-top: 6.625rem;
    padding-bottom: 8.625rem;
  }
  .oate-font-move .font-move-wrap {
    padding: 0 0.75rem;
    gap: 1.5rem;
  }
  .oate-font-move .font-move-typef {
    white-space: nowrap;
    padding: 0.8125rem 1.4375rem;
    border-radius: 99999px;
    border: 1px solid var(--5, #003d1b);
    color: #002d14;
    text-align: center;
    font-family: "BT Grotesk";
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 400;
    line-height: 140%; /* 33.6px */
  }
  .oate-font-move .font-move-stl {
    gap: 0.65375rem;
    width: 49.521%;
  }
  .oate-font-move .font-move-stl .fonts-stl-bot-sli {
    width: 100%;
    padding: 0.804375rem 1.970625rem;
  }
  .oate-font-move .font-move-stl .fonts-stl-bot-sli p {
    color: #002d14;
    text-align: center;
    font-family: "BT Grotesk";
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 400;
    line-height: 140%; /* 14.197px */
    margin-bottom: 0;
  }
  .oate-font-move .font-move-stl .fonts-stl-bot-sli input {
    flex-grow: 1;
    width: 60%;
    margin: 0 0.625rem;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    height: 1.5px;
    background: #002d14;
    cursor: pointer;
    outline: none;
  }
  .oate-font-move .font-move-stl .fonts-stl-bot-sli input::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 0.75rem;
    height: 0.75rem;
    background-color: #002d14;
    border-radius: 50%;
    transition: 0.2s ease-in-out;
  }
  .oate-font-move .font-move-stl .fonts-stl-bot-sli input::-moz-range-thumb {
    -moz-appearance: none;
    appearance: none;
    height: 1.25rem;
    width: 1.25rem;
    background-color: #d9d9d9;
    border-radius: 50%;
    border: none;
    -moz-transition: 0.2s ease-in-out;
    transition: 0;
  }
  .oate-font-move .font-move-stl .fonts-stl-sw {
    display: inline-flex;
    align-items: center;
    gap: 0.634375rem;
    padding: 0.8125rem 1.031875rem 0.8125rem 1.659375rem;
    border-radius: 9999px;
    border: 0.6px solid var(--5, #003d1b);
  }
  .oate-font-move .font-move-stl .fonts-stl-sw label {
    height: 1.90625rem;
    width: 4.48125rem;
  }
  .oate-font-move .font-move-stl .fonts-stl-sw p {
    color: #002d14;
    text-align: center;
    font-family: "BT Grotesk";
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 400;
    line-height: 140%;
    margin-bottom: 0 !important;
  }
  .oate-font-move .font-move-stl .fonts-stl-sw label:after {
    top: 55%;
    width: 1.410625rem;
    height: 1.410625rem;
    transform: translate(-136%, -57%);
  }
  .oate-font-move .font-move-stl .fonts-stl-sw input:checked + label:after {
    transform: translate(34%, -57%);
  }
  .oate-font-move .font-range {
    position: relative;
    width: 8%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    padding-top: 5rem;
    padding-bottom: 0.6875rem;
  }
  .oate-font-move .font-range input {
    -webkit-appearance: none; /* Xóa giao diện gốc để custom màu */
    appearance: none;
    writing-mode: vertical-lr; /* Giữ logic chạy dọc cho JS */
    direction: rtl;
    height: 76%;
    width: 1px;
    margin: 0.625rem 0;
    padding: 0;
    cursor: pointer;
    background: #003d1b;
  }
  .oate-font-move .font-range input::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    height: 0.46875rem;
    width: 0.46875rem;
    background: #003d1b;
    color: #003d1b;
    border-radius: 100%;
    margin-top: 0;
    transition: all 0.2s ease;
  }
  .oate-font-move .font-range input::-moz-range-thumb {
    -moz-appearance: none;
    appearance: none;
    height: 0.0625rem;
    width: 1.25rem;
    background-color: #003d1b;
    border-radius: 50%;
    border: none;
    -moz-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out;
    opacity: 0.8;
  }
  .oate-font-move .font-range .font-size {
    white-space: nowrap;
    color: var(--5, #003d1b);
    text-align: right;
    font-family: "BT Grotesk";
    font-size: 1.125rem;
    font-style: normal;
    font-weight: 400;
    line-height: 140%; /* 16.8px */
  }
  .oate-font-move .font-move-number {
    width: 83%;
    text-align: center;
  }
  .oate-font-move .font-move-number .font-move-number__tag {
    margin-top: -100%;
    display: inline-flex;
    padding: 0.625rem 1.875rem;
    color: var(--5, #003d1b);
    text-align: center;
    font-family: "BT Grotesk";
    font-size: 1rem;
    font-style: normal;
    font-weight: 400;
    line-height: 140%; /* 10.357px */
    text-transform: uppercase;
    border-radius: 999999px;
    border: 1px solid var(--5, #003d1b);
    letter-spacing: 0;
  }
  .oate-font-move .font-move-number .number {
    color: var(--4, #00ad27);
    font-family: "BT Oateria vr";
    font-size: 26.25rem;
    font-style: normal;
    font-variation-settings: "wght" 800;
    line-height: 100%; /* 123.5px */
    letter-spacing: 0.525rem;
    word-break: break-all;
  }
  .oate-font-move .font-move-number .number--2 {
    color: #002d14;
  }
}

.oate-meal {
  background: #003d1b;
}
.oate-meal .meal-right {
  padding: 0 2.071875rem;
  padding-top: 2.095625rem;
  padding-bottom: 2.198125rem;
}
.oate-meal .meal-right .meal-right__top {
  text-align: center;
}
.oate-meal .meal-right .meal-right__top path {
  fill: var(--1, #fff5de);
}
.oate-meal .meal-right .meal-right__top h4 {
  margin-top: 1.08rem;
  color: var(--1, #fff5de);
  text-align: center;
  font-family: "BT Oateria";
  font-size: 2.099625rem;
  font-style: normal;
  font-weight: 800;
  line-height: 110%; /* 36.953px */
  text-transform: uppercase;
}
.oate-meal .meal-right .meal-right__top p {
  margin-top: 0.74375rem;
  margin-bottom: 0;
  color: var(--1, #fff5de);
  text-align: center;
  font-family: "BT Oateria";
  font-size: 0.9798125rem;
  font-style: normal;
  font-weight: 300;
  line-height: 110%; /* 17.245px */
  letter-spacing: 0.0098125rem;
}
.oate-meal .meal-right .meal-right__mid {
  margin-top: 2.66125rem;
}
.oate-meal .meal-right .meal-right__mid .meal-cards {
  display: flex;
  align-items: center;
  gap: 0.615625rem;
}
.oate-meal .meal-right .meal-right__mid .card {
  width: 32%;
  aspect-ratio: 115/185;
  background: #fff;
  border-radius: 0.5rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.oate-meal .meal-right .meal-right__mid .card-bowl {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  flex-direction: column;
  gap: 0.19625rem;
  width: 3.6675rem;
  aspect-ratio: 58.68/94.51;
}
.oate-meal .meal-right .meal-right__mid .card-bowl svg {
  width: 100%;
  height: auto;
}
.oate-meal .meal-right .meal-right__mid .card-ct {
  color: var(--5, #003d1b);
  text-align: center;
  font-family: "BT Oateria";
  font-size: 0.8958125rem;
  font-style: normal;
  font-weight: 350;
  line-height: 110%; /* 15.767px */
  letter-spacing: 0.143px;
  margin-top: 0.56125rem;
}
.oate-meal .meal-right .meal-right__bot {
  margin-top: 1.488125rem;
  color: var(--3, #afe901);
  text-align: center;
  font-family: "BT Oateria";
  font-size: 0.9798125rem;
  font-style: italic;
  font-weight: 400;
  line-height: 110%;
  letter-spacing: 0.157px;
}
@media (min-width: 768px) {
  .oate-meal .meal-wrap {
    display: flex;
  }
  .oate-meal .meal-left {
    width: 50%;
  }
  .oate-meal .meal-right {
    width: 50%;
    padding: 0 4.625rem;
    padding-top: 7.375rem;
    padding-bottom: 5.125rem;
    width: 50%;
  }
  .oate-meal .meal-right .meal-right__top {
    text-align: center;
  }
  .oate-meal .meal-right .meal-right__top path {
    fill: var(--1, #fff5de);
  }
  .oate-meal .meal-right .meal-right__top h4 {
    margin-top: 1.08rem;
    color: var(--1, #fff5de);
    text-align: center;
    font-family: "BT Oateria";
    font-size: 4.6875rem;
    font-style: normal;
    font-weight: 800;
    line-height: 110%; /* 36.953px */
    text-transform: uppercase;
  }
  .oate-meal .meal-right .meal-right__top p {
    margin-top: 0.74375rem;
    margin-bottom: 0;
    color: var(--1, #fff5de);
    text-align: center;
    font-family: "BT Oateria";
    font-size: 2.1875rem;
    font-style: normal;
    font-weight: 600;
    line-height: 110%; /* 17.245px */
    letter-spacing: 0.021875rem;
  }
  .oate-meal .meal-right .meal-right__top small {
    display: none;
  }
  .oate-meal .meal-right .meal-right__mid {
    margin-top: 7.1875rem;
  }
  .oate-meal .meal-right .meal-right__mid .meal-cards {
    display: flex;
    align-items: center;
    gap: 1.375rem;
  }
  .oate-meal .meal-right .meal-right__mid .card {
    width: 31.55%;
    aspect-ratio: 256/412;
    background: #fff;
    border-radius: 0.5rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  .oate-meal .meal-right .meal-right__mid .card-bowl {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    flex-direction: column;
    gap: 0.19625rem;
    width: 8.1875rem;
    aspect-ratio: 131/211;
  }
  .oate-meal .meal-right .meal-right__mid .card-ct {
    color: var(--5, #003d1b);
    text-align: center;
    font-family: "BT Oateria";
    font-size: 2rem;
    font-style: normal;
    font-weight: 700;
    line-height: 110%;
    letter-spacing: 0.02rem;
    margin-top: 1.25rem;
  }
  .oate-meal .meal-right .meal-right__bot {
    margin-top: 5.0625rem;
    color: var(--3, #afe901);
    text-align: center;
    font-family: "BT Oateria";
    font-size: 2.1875rem;
    font-style: italic;
    font-weight: 600;
    line-height: 110%;
    letter-spacing: 0.35px;
  }
}

.oate-focus {
  background-color: #00ad27;
  padding-top: 4.28125rem;
  padding-bottom: 1.25rem;
}
.oate-focus .focus-title {
  color: var(--5, #003d1b);
  font-feature-settings: "ss02" on;
  font-family: "BT Oateria vr";
  font-size: 1.375rem;
  font-style: normal;
  font-variation-settings: "wght" 350;
  line-height: 120%; /* 26.4px */
}
.oate-focus .focus-para {
  margin-top: 0.625rem;
  margin-right: 1.5625rem;
  color: var(--5, #003d1b);
  font-family: "BT Grotesk";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
}
.oate-focus .oate-focus__text {
  margin-top: 2.25rem;
}
@media (min-width: 768px) {
  .oate-focus {
    padding-top: 8.375rem;
    padding-bottom: 4.375rem;
  }
  .oate-focus .focus-title {
    color: var(--5, #003d1b);
    font-feature-settings: "ss02" on;
    font-family: "BT Oateria vr";
    font-size: 2.1875rem;
    font-style: normal;
    font-variation-settings: "wght" 350;
    line-height: 120%;
  }
  .oate-focus .focus-para {
    width: 39.625rem;
    margin-top: 1.0625rem;
    color: var(--5, #003d1b);
    font-family: "BT Grotesk";
    font-size: 1.375rem;
    font-style: normal;
    font-weight: 600;
    line-height: 140%;
  }
  .oate-focus .oate-focus__text {
    margin-top: 5.625rem;
  }
  .oate-focus .oate-focus__text-wrap {
    width: 100%;
    aspect-ratio: 1780/1010;
    overflow: hidden;
    background-color: #fff5de;
    border-radius: 1.25rem;
  }
  .oate-focus .oate-focus__text-wrap .vector {
    fill: #003d1b;
    stroke: #003d1b;
    transition: all 0.1s ease;
  }
  .oate-focus .oate-focus__text-wrap .vector path {
    fill: #003d1b;
    stroke: #003d1b;
    transition: all 0.1s ease;
  }
  .oate-focus .oate-focus__text-wrap .vector:hover {
    fill: #fff5de;
    stroke: #003d1b;
    transition: all 0.1s ease;
  }
  .oate-focus .oate-focus__text-wrap .vector:hover path {
    fill: #fff5de;
    stroke: #003d1b;
    transition: all 0.1s ease;
  }
}

.oate-vid {
  width: 100%;
  aspect-ratio: 430/430;
  background-color: red;
}
@media (min-width: 768px) {
  .oate-vid {
    aspect-ratio: 1920/1080;
  }
}

.oate-demo-ban {
  background-color: #00ad27;
  padding-top: 1.5625rem;
  padding-bottom: 0.5625rem;
}
.oate-demo-ban p {
  color: var(--1, #fff5de);
  font-family: "BT Oateria";
  font-size: 1.625rem;
  font-style: normal;
  font-weight: 250;
  line-height: 125%;
  letter-spacing: -0.01625rem;
  margin-bottom: 0.3125rem;
}
.oate-demo-ban small {
  margin-top: 0.3125rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: var(--1, #fff5de);
  font-family: "BT Oateria";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 300;
  line-height: 120%; /* 16.8px */
}
.oate-demo-ban h5 {
  margin-top: 0.75rem;
  margin-bottom: 0;
  color: var(--1, #fff5de);
  text-align: center;
  font-family: "BT Oateria";
  font-size: 5.5989375rem;
  font-style: normal;
  font-weight: 800;
  line-height: 130%; /* 116.458px */
  text-transform: uppercase;
}
@media (min-width: 768px) {
  .oate-demo-ban {
    padding-top: 5.5rem;
    padding-bottom: 0;
  }
  .oate-demo-ban p {
    color: var(--1, #fff5de);
    font-family: "BT Oateria";
    font-size: 4.375rem;
    font-style: normal;
    font-weight: 500;
    line-height: 120%;
    letter-spacing: -0.04375rem;
    margin-bottom: 1.25rem;
  }
  .oate-demo-ban small {
    color: var(--1, #fff5de);
    font-family: "BT Oateria";
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 600;
    line-height: 120%; /* 16.8px */
  }
  .oate-demo-ban h5 {
    margin-top: 7.63rem;
    margin-bottom: 0;
    color: var(--1, #fff5de);
    text-align: center;
    font-family: "BT Oateria";
    font-size: 25rem;
    font-style: normal;
    font-weight: 800;
    line-height: 130%; /* 116.458px */
    text-transform: uppercase;
  }
}

.oate-box {
  margin-top: 1.4375rem;
  margin-bottom: 1.4375rem;
}
.oate-box .oate-box-wrap {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
@media (min-width: 768px) {
  .oate-box {
    margin-top: 3.75rem;
    margin-bottom: 3.75rem;
  }
  .oate-box .oate-box-wrap {
    display: flex;
    flex-direction: row;
    gap: 2.5rem;
  }
  .oate-box .vgreen-left,
  .oate-box .vgreen-right {
    width: 50%;
  }
}

.oate-font-inver {
  width: 100%;
  aspect-ratio: 1920/1080;
  background-color: #003d1b;
  cursor: url("../img/BT-Oateria/cimai.png"), auto;
}
.oate-font-inver .font-inver-right h2 {
  padding: 1.94375rem 6.8225rem 3.68125rem 6.8025rem;
  color: var(--1, #fff5de);
  font-family: "BT Oateria";
  font-size: 22.3958125rem;
  font-style: normal;
  font-weight: 300;
  line-height: 110%; /* 394.167px */
  letter-spacing: -0.2239375rem;
}
@media (min-width: 768px) {
  .oate-font-inver .font-inver-wrap {
    display: flex;
  }
  .oate-font-inver .font-inver-right {
    left: 50%;
  }
  .oate-font-inver .font-inver-left {
    width: 50%;
  }
  .oate-font-inver .font-inver-right {
    width: 50%;
    overflow: hidden;
  }
  .oate-font-inver .font-inver-right h2 {
    padding: 4.375rem 15.1875rem 8.125rem 15.25rem;
    color: var(--1, #fff5de);
    font-family: "BT Oateria";
    font-size: 50rem;
    font-style: normal;
    font-weight: 600;
    line-height: 110%; /* 394.167px */
    letter-spacing: -0.5rem;
  }
}

.oate-banana {
  background-color: #fff5de;
}
.oate-banana .oate-banana__wrap {
  overflow: hidden;
  width: 100%;
  height: 100%;
  padding: 1rem 0.925rem 0.4375rem 0.825rem;
  position: relative;
}
.oate-banana .banana {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 50%;
  z-index: 1;
}
.oate-banana .banana .banana__wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 1/1;
}
.oate-banana .banana .banana__bong,
.oate-banana .banana .banana__real {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
}
.oate-banana .banana .banana__real {
  z-index: 2;
  transform: translate(-50%, -50%) translateZ(100px);
}
.oate-banana .banana .banana__bong {
  transform: translate(-50%, -50%) translateZ(-100px);
  filter: blur(6px);
  mix-blend-mode: multiply;
  z-index: 0;
}
.oate-banana .banana--1 {
  transform: translate(-31%, -37%);
  width: 13.6875rem;
  aspect-ratio: 219/175;
}
.oate-banana .banana-shadow {
  filter: blur(0.75);
  mix-blend-mode: multiply;
}
.oate-banana .banana--2 {
  transform: translate(30%, -185%) rotate(-45deg);
  width: 7.67rem;
  aspect-ratio: 109/92;
}
.oate-banana .oate-banana__top {
  display: flex;
  justify-content: space-between;
  padding-left: 0.3rem;
  padding-right: 0.164375rem;
}
.oate-banana .oate-banana__top p {
  width: 52%;
  color: #002d14;
  font-family: "BT Oateria";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 250;
  line-height: 120%; /* 16.8px */
  letter-spacing: -0.14px;
}
.oate-banana .oate-banana__top .logo {
  color: #002d14;
  text-align: right;
  font-family: "BT Oateria";
  font-size: 1.6875rem;
  font-style: normal;
  font-weight: 350;
  line-height: 120%; /* 32.4px */
  letter-spacing: -2.7px;
}
.oate-banana .oate-banana__bot {
  margin-top: 7rem;
  color: #002d14;
  text-align: center;
  font-family: "BT Oateria";
  font-size: 7rem;
  font-style: normal;
  font-weight: 800;
  line-height: 120%; /* 134.4px */
  letter-spacing: -0.21rem;
  position: relative;
  z-index: 1;
}
@media (min-width: 768px) {
  .oate-banana .oate-banana__wrap {
    width: 100%;
    height: 100%;
    padding: 3.75rem 3.375rem 0 3.125rem;
  }
  .oate-banana .banana--1 {
    transform: translate(-23%, -48%);
    width: 45.930625rem;
    aspect-ratio: 734.89/628.89;
  }
  .oate-banana .banana--2 {
    transform: translate(61%, -185%) rotate(-45deg);
    width: 25.4503125rem;
    aspect-ratio: 109/92;
  }
  .oate-banana .oate-banana__top {
    display: flex;
    justify-content: space-between;
    padding-left: 0.9375rem;
    padding-right: 0.795625rem;
  }
  .oate-banana .oate-banana__top p {
    width: 46%;
    color: #002d14;
    font-family: "BT Oateria";
    font-size: 2.5rem;
    font-style: normal;
    font-weight: 500;
    line-height: 120%; /* 16.8px */
    letter-spacing: -0.4px;
  }
  .oate-banana .oate-banana__top .logo {
    color: #002d14;
    text-align: right;
    font-family: "BT Oateria";
    font-size: 6.25rem;
    font-style: normal;
    font-weight: 350;
    line-height: 120%; /* 32.4px */
    letter-spacing: -10px;
  }
  .oate-banana .oate-banana__bot {
    margin-top: 20.300625rem;
    color: #002d14;
    text-align: center;
    font-family: "BT Oateria";
    font-size: 31.6861875rem;
    font-style: normal;
    font-weight: 800;
    line-height: 120%; /* 134.4px */
    letter-spacing: -0.9505625rem;
  }
}

.oate-font-char {
  width: 100%;
  aspect-ratio: 1920/1080;
  background-color: #003d1b;
  cursor: url("../img/BT-Oateria/cimai.png"), auto;
}
.oate-font-char .font-char-left {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  aspect-ratio: 430/484;
}
.oate-font-char .font-char-left h2 {
  color: var(--1, #fff5de);
  font-family: "BT Oateria";
  font-size: 22.3958125rem;
  font-style: normal;
  font-weight: 300;
  line-height: 110%; /* 394.167px */
  letter-spacing: -0.2239375rem;
}
.oate-font-char .font-char-right {
  padding: 2.18375rem;
  background-color: #ecffc7;
}
.oate-font-char .font-char-right .font-char-list {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.98rem;
}
.oate-font-char .font-char-right .font-char-item {
  padding: 1.315625rem 3.3875rem 1.923125rem 2.91125rem;
  position: relative;
  color: #fff5de;
  background-color: #00ad27;
  border-radius: 9999px;
  font-family: "BT Oateria";
  font-size: 2.5195625rem;
  font-style: normal;
  font-weight: 800;
  line-height: 100%; /* 40.313px */
}
.oate-font-char .font-char-right .font-char-item small {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 9.375rem;
  aspect-ratio: 150/72.6;
  transform: translate(21%, 35%);
  z-index: 2;
}
.oate-font-char .font-char-right .font-char-item small svg {
  opacity: 0;
  transform: translate(0.6);
  transition: all 0.4s ease;
}
.oate-font-char .font-char-right .font-char-item:hover {
  color: #afe901;
  background-color: #003d1b;
  transition: all 0.4s ease;
}
.oate-font-char .font-char-right .font-char-item:hover small svg {
  opacity: 1;
  transform: translate(1);
}
.oate-font-char .font-char-right .active {
  color: #afe901;
  background-color: #003d1b;
  transition: all 0.4s ease;
}
.oate-font-char .font-char-right .active small svg {
  opacity: 1;
  transform: translate(1);
}
.oate-font-char .font-char-right .font-char-item--style-2 {
  color: #fff5de;
  background-color: #00ad27;
}
.oate-font-char .font-char-right .font-char-item--2 {
  padding: 1.439375rem 2.405rem 1.810625rem 2.9075rem;
}
.oate-font-char .font-char-right .font-char-item--2 small {
  transform: translate(39%, -102%);
}
.oate-font-char .font-char-right .font-char-item--3 small {
  transform: translate(50%, -135%);
}
.oate-font-char .font-char-right .font-char-item--4 small {
  transform: translate(42%, -124%);
}
@media (min-width: 768px) {
  .oate-font-char .font-char-wrap {
    display: flex;
  }
  .oate-font-char .font-char-left {
    width: 50%;
    aspect-ratio: 960/1080;
  }
  .oate-font-char .font-char-left h2 {
    color: var(--1, #fff5de);
    font-family: "BT Oateria";
    font-size: 49.0010625rem;
    font-style: normal;
    font-weight: 300;
    line-height: 101.695%; /* 394.167px */
    letter-spacing: 0;
  }
  .oate-font-char .font-char-right {
    width: 50%;
    padding: 4.8125rem 4.875rem;
    background-color: #ecffc7;
  }
  .oate-font-char .font-char-right .font-char-list {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2.1875rem;
  }
  .oate-font-char .font-char-right .font-char-item {
    position: relative;
    padding: 2.9375rem 7.5625rem 4.25rem 6.5rem;
    color: #fff5de;
    background-color: #00ad27;
    border-radius: 9999px;
    font-family: "BT Oateria";
    font-size: 5.625rem;
    font-style: normal;
    font-weight: 800;
    line-height: 100%; /* 40.313px */
  }
  .oate-font-char .font-char-right .font-char-item small {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 22.1875rem;
    aspect-ratio: 355/165;
    transform: translate(21%, 35%);
    z-index: 2;
  }
  .oate-font-char .font-char-right .font-char-item small svg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transform: translate(0.6);
    transition: all 0.4s ease;
  }
  .oate-font-char .font-char-right .font-char-item:hover {
    color: #afe901;
    background-color: #003d1b;
    transition: all 0.4s ease;
  }
  .oate-font-char .font-char-right .font-char-item:hover small svg {
    opacity: 1;
    transform: translate(1);
  }
  .oate-font-char .font-char-right .active {
    color: #afe901;
    background-color: #003d1b;
    transition: all 0.4s ease;
  }
  .oate-font-char .font-char-right .active small svg {
    opacity: 1;
    transform: translate(1);
  }
  .oate-font-char .font-char-right .font-char-item--style-2 {
    color: #fff5de;
    background-color: #00ad27;
  }
  .oate-font-char .font-char-right .font-char-item--2 {
    padding: 3.4375rem 7.0625rem 3.9375rem 6.5rem;
  }
  .oate-font-char .font-char-right .font-char-item--2 small {
    transform: translate(27%, -100%);
  }
  .oate-font-char .font-char-right .font-char-item--3 small {
    transform: translate(23%, -135%);
  }
  .oate-font-char .font-char-right .font-char-item--4 small {
    transform: translate(42%, -124%);
  }
}

.oate-cauli .cauli-pop {
  transform-origin: 39% 50%;
}
.oate-cauli .straw-pop {
  transform-origin: 44% 50%;
}
.oate-cauli .cauli-top {
  padding-left: 1.125rem;
  padding-right: 1.283125rem;
  padding-top: 0.843125rem;
  display: flex;
  justify-content: space-between;
}
.oate-cauli .cauli-top .cauli {
  width: 14.04rem;
  aspect-ratio: 224.64/124.79;
}
.oate-cauli .cauli-top .cauli svg {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.oate-cauli .cauli-top h4 {
  color: #00ad27;
  text-align: right;
  font-family: "BT Oateria";
  font-size: 0.9798125rem;
  font-style: normal;
  font-weight: 350;
  line-height: 110%;
  text-transform: uppercase;
}
.oate-cauli .cauli-bot {
  position: relative;
  margin-top: 0.7525rem;
  padding-left: 1.385625rem;
  padding-bottom: 1.12rem;
  padding-right: 0.485625rem;
  position: relative;
}
.oate-cauli .cauli-bot .cauli-bot-text {
  display: flex;
  justify-content: space-between;
  color: #00ad27;
  font-family: "BT Oateria";
  font-size: 0.9798125rem;
  font-style: normal;
  font-weight: 350;
  line-height: 110%; /* 17.245px */
  text-transform: uppercase;
  text-align: left;
}
.oate-cauli .cauli-bot .cauli-bot-text p {
  margin-bottom: 0;
}
.oate-cauli .cauli-bot .cauli-bot-text p:nth-of-type(2) {
  text-align: center;
}
.oate-cauli .cauli-bot .cauli-bot-text p:nth-of-type(3) {
  text-align: right;
}
.oate-cauli .cauli-bot .cauli-bot-text + .cauli-bot-text {
  margin-top: 1.108125rem;
}
.oate-cauli .cauli-bot .straw {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 12.251875rem;
  aspect-ratio: 874.02/676.18;
}
.oate-cauli .cauli-bot .straw svg {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media (min-width: 768px) {
  .oate-cauli .cauli-top {
    padding-top: 2.375rem;
    padding-left: 4rem;
    padding-right: 5.75rem;
    display: flex;
    justify-content: space-between;
  }
  .oate-cauli .cauli-top .cauli {
    width: 62.56375rem;
    aspect-ratio: 1001.02/557.22;
  }
  .oate-cauli .cauli-top .cauli svg {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .oate-cauli .cauli-top h4 {
    color: #00ad27;
    text-align: right;
    font-family: "BT Oateria";
    font-size: 4.375rem;
    font-style: normal;
    font-weight: 350;
    line-height: 110%;
    text-transform: uppercase;
  }
  .oate-cauli .cauli-bot {
    position: relative;
    margin-top: 3.36125rem;
    padding-left: 6.1875rem;
    padding-bottom: 2.875rem;
    padding-right: 2.24875rem;
    position: relative;
  }
  .oate-cauli .cauli-bot .cauli-bot-text {
    display: flex;
    justify-content: space-between;
    color: #00ad27;
    font-family: "BT Oateria";
    font-size: 4.375rem;
    font-style: normal;
    font-weight: 350;
    line-height: 110%; /* 17.245px */
    text-transform: uppercase;
    text-align: left;
  }
  .oate-cauli .cauli-bot .cauli-bot-text p {
    margin-bottom: 0;
  }
  .oate-cauli .cauli-bot .cauli-bot-text p:nth-of-type(2) {
    text-align: center;
  }
  .oate-cauli .cauli-bot .cauli-bot-text p:nth-of-type(3) {
    text-align: right;
  }
  .oate-cauli .cauli-bot .cauli-bot-text + .cauli-bot-text {
    margin-top: 4.8125rem;
  }
  .oate-cauli .cauli-bot .straw {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 54.62625rem;
    aspect-ratio: 874.02/676.18;
  }
  .oate-cauli .cauli-bot .straw svg {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}

.oate-tag {
  background-color: #ffffff;
  padding: 1.125rem;
}
.oate-tag .oate-tag-wrap {
  position: relative;
  background-color: #ffd900;
  border-radius: 0.3125rem;
  padding: 2.25rem 0.736875rem;
}
.oate-tag h5 {
  color: var(--5, #003d1b);
  text-align: center;
  font-family: "BT Oateria";
  font-size: 4.375rem;
  font-style: normal;
  font-weight: 800;
  line-height: 110%; /* 77px */
  letter-spacing: -1.4px;
  text-transform: uppercase;
}
.oate-tag .tag {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  transform: translate(40%, -181%);
  width: 8.3625rem;
  aspect-ratio: 133.8/73.83;
}
.oate-tag .tag--2 {
  transform: translate(-186%, -87%);
  width: 6.423125rem;
  aspect-ratio: 1/1;
}
.oate-tag .tag--3 {
  transform: translate(-39%, -10%);
  width: 6.181875rem;
  aspect-ratio: 1/1;
}
@media (min-width: 768px) {
  .oate-tag {
    padding: 4.375rem;
  }
  .oate-tag .oate-tag-wrap {
    position: relative;
    background-color: #ffd900;
    border-radius: 0.3125rem;
    padding: 2.1875rem 3.875rem;
  }
  .oate-tag h5 {
    color: var(--5, #003d1b);
    text-align: center;
    font-family: "BT Oateria";
    font-size: 18.125rem;
    font-style: normal;
    font-weight: 800;
    line-height: 110%;
    letter-spacing: -0.3625rem;
    text-transform: uppercase;
  }
  .oate-tag .tag {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transform: translate(95%, -162%);
    width: 26.625rem;
    aspect-ratio: 426/235;
  }
  .oate-tag .tag img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .oate-tag .tag--2 {
    transform: translate(-248%, -75%);
    width: 20.5rem;
    aspect-ratio: 1/1;
  }
  .oate-tag .tag--3 {
    transform: translate(-34%, 0%);
    width: 19.625rem;
    aspect-ratio: 1/1;
  }
}

.oate-features {
  background-color: #ffffff;
  padding-top: 5rem;
}
.oate-features .feature-style {
  background-color: #003d1b;
  border-radius: 0.3125rem;
}
.oate-features .feature-style .feature-style-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 2.125rem;
  padding-right: 1.24rem;
  padding-bottom: 2.20875rem;
  padding-left: 1.26625rem;
}
.oate-features .feature-style h4 {
  color: var(--1, #fff5de);
  text-align: center;
  font-family: "BT Oateria";
  font-size: 3.0643125rem;
  font-style: normal;
  font-weight: 800;
  line-height: 100%; /* 49.029px */
  text-transform: uppercase;
}
.oate-features .feature-style span {
  color: #afe901;
}
.oate-features .feature-style .sw {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 1.1875rem;
}
.oate-features .feature-style .sw p {
  color: var(--1, #fff5de);
  text-align: center;
  font-feature-settings: "ss01" on;
  font-family: "BT Oateria";
  font-size: 0.625rem;
  font-style: normal;
  font-weight: 250;
  line-height: 100%; /* 10px */
  letter-spacing: 0.2px;
  margin-bottom: 0.16625rem;
}
.oate-features .feature-style .sw small {
  color: var(--1, #fff5de);
  text-align: center;
  font-feature-settings: "ss01" on;
  font-family: "BT Oateria";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 800;
  line-height: 100%;
  text-transform: uppercase;
}
.oate-features .feature-style .feature-style-right span {
  color: var(--3, #afe901);
  font-feature-settings: "ss01" on, "liga" off, "calt" off;
  font-family: "BT Oateria";
  font-size: 3.0643125rem;
  font-style: normal;
  font-weight: 800;
  line-height: 100%;
  text-transform: uppercase;
}
.oate-features .feature-style .feature-style-center {
  margin-top: -11%;
  color: var(--1, #fff5de);
  text-align: center;
  font-family: "BT Oateria vr";
  font-size: 2.625rem;
  font-style: normal;
  font-weight: 350;
  line-height: 100%; /* 42px */
  text-transform: uppercase;
}
.oate-features .feature-number {
  margin-top: 1.0625rem;
  background-color: #00ad27;
  border-radius: 0.3125rem;
  padding: 0 0.3725rem;
  padding-top: 0.36375rem;
  padding-bottom: 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.oate-features .feature-number .number-ct {
  color: #70e078;
  opacity: 0.6;
  text-align: center;
  font-family: "BT Oateria";
  font-size: 3.4375rem;
  font-style: normal;
  font-weight: 350;
  line-height: 105%; /* 57.75px */
  letter-spacing: -1.1px;
  text-transform: uppercase;
}
.oate-features .feature-number .number-coin-list {
  display: flex;
  justify-content: center;
  position: relative;
  margin-top: -3%;
  margin-bottom: -5%;
  z-index: 3;
}
.oate-features .feature-number .number-coin-list .number-coin {
  width: 6.0075rem;
  aspect-ratio: 1/1;
}
.oate-features .feature-number .number-coin-list .number-coin + .number-coin {
  margin-left: -1%;
}
.oate-features .feature-number .number-coin-list .number-coin svg {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.oate-features .feature-number .number-coin-list .number-coin-style--2 {
  color: #005727;
  z-index: 3;
}
.oate-features .feature-board {
  background-color: #afe901;
  margin-top: 1.25rem;
  padding-top: 1.8275rem;
  padding-bottom: 1.4375rem;
}
.oate-features .feature-board h6 {
  color: var(--5, #003d1b);
  font-feature-settings: "ss02" on;
  font-family: "BT Oateria";
  font-size: 2.125rem;
  font-style: normal;
  font-weight: 350;
  line-height: 110%; /* 37.4px */
}
.oate-features .feature-board .feature-tag-font {
  align-items: center;
  display: flex;
  height: 100%;
  background-color: #003d1b;
  border-radius: 9999px;
  padding: 0.25rem 0.8125rem 0.375rem 1rem;
  color: var(--3, #afe901);
  font-family: "BT Oateria";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 350;
  line-height: 100%; /* 100% */
  letter-spacing: 0.12px;
}
.oate-features .feature-board .feature-board-infor__mb {
  margin-top: 1.673125rem;
}
.oate-features .feature-board .feature-board-infor__mb .feature-board-list {
  position: relative;
  display: flex;
}
.oate-features .feature-board .feature-board-infor__mb .feature-board-list::after {
  position: absolute;
  content: "";
  width: 100%;
  border-top: 1px solid rgba(0, 61, 27, 0.4);
  opacity: 0.8;
  top: 0;
  left: 0;
}
.oate-features .feature-board .feature-board-infor__mb .feature-board-list .feature-board-item {
  padding-bottom: 0.4375rem;
}
.oate-features .feature-board .feature-board-infor__mb .feature-board-list + .feature-board-list .feature-board-item {
  padding-bottom: 0.120625rem;
}
.oate-features .feature-board .feature-board-infor__mb .feature-board-item {
  position: relative;
  padding-top: 0.43375rem;
  padding-left: 0.75rem;
}
.oate-features .feature-board .feature-board-infor__mb .feature-board-item p {
  color: rgba(0, 61, 27, 0.7);
  font-family: "BT Grotesk";
  font-size: 0.625rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: 0.01875rem;
  padding-bottom: 0.00375rem;
  margin-bottom: 0;
  text-transform: uppercase;
}
.oate-features .feature-board .feature-board-infor__mb .feature-board-item p + p {
  color: var(--5, #003d1b);
  font-family: "BT Grotesk";
  font-size: 0.625rem;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: 0.1px;
  margin-top: 0.00375rem;
  text-transform: none;
}
.oate-features .feature-board .feature-board-infor__mb .feature-board-item::after {
  position: absolute;
  content: "";
  height: 100%;
  border-left: 1px solid rgba(0, 61, 27, 0.4);
  opacity: 0.8;
  top: 0;
  left: 0;
}
.oate-features .feature-board .feature-board-infor__mb .feature-board-item.item--1 {
  width: 24.2%;
}
.oate-features .feature-board .feature-board-infor__mb .feature-board-item.item--2 {
  width: 23.34%;
}
.oate-features .feature-board .feature-board-infor__mb .feature-board-item.item--3 {
  width: 25.62%;
}
.oate-features .feature-board .feature-board-infor__mb .feature-board-item.item--4 {
  width: 26.64%;
}
.oate-features .feature-liga {
  position: relative;
  margin-top: 1.125rem;
  color: #fff;
}
.oate-features .feature-liga .liga-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  gap: 1.0475rem;
}
.oate-features .feature-liga .liga-box .liga-sw {
  text-align: center;
  color: #fff;
  text-align: center;
  font-family: "BT Oateria";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 350;
  line-height: 100%;
}
.oate-features .feature-liga .liga-box .liga-sw p {
  margin-top: 0.1875rem;
  text-transform: uppercase;
}
.oate-features .feature-liga .liga-box .liga-sw__cus {
  margin-left: 1.4375rem;
}
.oate-features .feature-liga .liga-box .liga-text {
  color: #fff;
  text-align: center;
  font-family: "BT Oateria";
  font-size: 7.8125rem;
  font-style: italic;
  font-weight: 800;
  line-height: 100%;
  letter-spacing: -0.15625rem;
  margin-bottom: 0;
}
.oate-features .feature-liga .liga-center {
  display: flex;
  align-items: center;
  color: var(--3, #afe901);
  text-align: center;
  font-family: "BT Oateria";
  font-size: 3.4375rem;
  font-style: normal;
  font-weight: 200;
  line-height: 100%; /* 55px */
  letter-spacing: -0.06875rem;
}
.oate-features .feature-liga .swiper-liga {
  overflow: hidden;
  background-color: #002d14;
  width: 100%;
  aspect-ratio: 394/208;
  border-radius: 0.3125rem;
}
.oate-features .feature-liga .swiper-button-prev,
.oate-features .feature-liga .swiper-button-next {
  top: 55%;
  border-radius: 100%;
  width: 1.5rem;
  aspect-ratio: 1/1;
  height: auto;
  background-color: #00ad27;
}
.oate-features .feature-liga .swiper-button-prev::after,
.oate-features .feature-liga .swiper-button-next::after {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 0.6875rem;
  font-weight: 600;
  color: #fff5de;
}
.oate-features .feature-liga .swiper-button-prev {
  left: 7%;
}
.oate-features .feature-liga .swiper-button-next {
  right: 7%;
}
.oate-features .feature-lemon {
  margin-top: 1.25rem;
}
.oate-features .feature-bean {
  margin-top: 1.25rem;
}
.oate-features .feature-card {
  position: relative;
  margin-top: 1.25rem;
}
.oate-features .feature-card .card-item {
  width: 100%;
  flex-shrink: 0;
}
.oate-features .feature-card .swiper-button-prev,
.oate-features .feature-card .swiper-button-next {
  border-radius: 100%;
  width: 1.508rem;
  aspect-ratio: 1/1;
  height: auto;
  background-color: #fff5de;
}
.oate-features .feature-card .swiper-button-prev::after,
.oate-features .feature-card .swiper-button-next::after {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 0.75rem;
  font-weight: 600;
  color: #00ad27;
}
.oate-features .feature-card .swiper-button-prev {
  left: 4%;
}
.oate-features .feature-card .swiper-button-prev::after {
  transform: translate(-75%, -42%);
}
.oate-features .feature-card .swiper-button-next {
  right: 4%;
}
.oate-features .feature-card .swiper-button-next::after {
  transform: translate(-36%, -38%);
}
@media (min-width: 768px) {
  .oate-features {
    padding-top: 10.5625rem;
  }
  .oate-features .feature-style {
    background-color: #003d1b;
    border-radius: 1.25rem;
  }
  .oate-features .feature-style .feature-style-wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 5.6875rem;
    padding-right: 8rem;
    padding-bottom: 5.3125rem;
    padding-left: 7.9375rem;
  }
  .oate-features .feature-style h4 {
    color: var(--1, #fff5de);
    text-align: center;
    font-family: "BT Oateria";
    font-size: 12.0069375rem;
    font-style: normal;
    font-weight: 800;
    line-height: 100%; /* 49.029px */
    text-transform: uppercase;
  }
  .oate-features .feature-style span {
    color: #afe901;
  }
  .oate-features .feature-style .sw {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 3.875rem;
  }
  .oate-features .feature-style .sw p {
    color: var(--1, #fff5de);
    text-align: center;
    font-feature-settings: "ss01" on;
    font-family: "BT Oateria";
    font-size: 1.5625rem;
    font-style: normal;
    font-weight: 500;
    line-height: 100%; /* 10px */
    letter-spacing: 0.5px;
    margin-bottom: 0.3125rem;
  }
  .oate-features .feature-style .sw small {
    color: var(--1, #fff5de);
    text-align: center;
    font-feature-settings: "ss01" on;
    font-family: "BT Oateria";
    font-size: 1.625rem;
    font-style: normal;
    font-weight: 800;
    line-height: 100%;
    text-transform: uppercase;
  }
  .oate-features .feature-style .feature-style-right span {
    color: var(--3, #afe901);
    font-feature-settings: "ss01" on, "liga" off, "calt" off;
    font-family: "BT Oateria";
    font-size: 12.0069375rem;
    font-style: normal;
    font-weight: 800;
    line-height: 100%;
    text-transform: uppercase;
  }
  .oate-features .feature-style .feature-style-center {
    margin-top: -10%;
    color: var(--1, #fff5de);
    text-align: center;
    font-family: "BT Oateria";
    font-size: 12.0069375rem;
    font-style: normal;
    font-weight: 600;
    line-height: 100%; /* 42px */
    text-transform: uppercase;
  }
  .oate-features .feature-number {
    margin-top: 4.375rem;
    background-color: #00ad27;
    border-radius: 1.25rem;
    padding: 0 1.6875rem;
    padding-top: 2.5rem;
    padding-bottom: 3.03875rem;
  }
  .oate-features .feature-number .number-ct {
    color: #70e078;
    opacity: 0.6;
    text-align: center;
    font-family: "BT Oateria";
    font-size: 8.125rem;
    font-style: normal;
    font-weight: 350;
    line-height: 105%; /* 57.75px */
    letter-spacing: -0.06875rem;
    text-transform: uppercase;
  }
  .oate-features .feature-number .number-coin-list {
    display: flex;
    position: relative;
    margin-top: -2%;
    margin-bottom: -1.5%;
    z-index: 3;
  }
  .oate-features .feature-number .number-coin-list .number-coin {
    width: 27.25rem;
    aspect-ratio: 1/1;
  }
  .oate-features .feature-number .number-coin-list .number-coin svg {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .oate-features .feature-number .number-coin-list .number-coin-style--2 {
    color: #005727;
    z-index: 3;
  }
  .oate-features .feature-liga {
    margin-top: 4.625rem;
  }
  .oate-features .feature-liga .liga-wrap {
    border-radius: 1.25rem;
    gap: 4.6875rem;
  }
  .oate-features .feature-liga .liga-box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  .oate-features .feature-liga .liga-box .liga-sw {
    display: flex;
    text-align: center;
    color: #fff;
    text-align: center;
    font-family: "BT Oateria";
    font-size: 2.375rem;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
  }
  .oate-features .feature-liga .liga-box .liga-sw p {
    margin-top: 0.1875rem;
    margin-left: 0.5rem;
    text-transform: uppercase;
  }
  .oate-features .feature-liga .liga-box .liga-sw__cus {
    margin-left: 4.5625rem;
  }
  .oate-features .feature-liga .liga-box .liga-text {
    color: #fff;
    text-align: center;
    font-family: "BT Oateria";
    font-size: 34.375rem;
    font-style: italic;
    font-weight: 800;
    line-height: 100%;
    letter-spacing: -0.6875rem;
    transition: all 0.3s ease;
  }
  .oate-features .feature-liga .liga-box .liga-text:hover {
    -webkit-text-stroke: 3px #afe901;
    color: transparent;
  }
  .oate-features .feature-liga .liga-center {
    display: flex;
    align-items: center;
    color: var(--3, #afe901);
    text-align: center;
    font-family: "BT Oateria";
    font-size: 15.625rem;
    font-style: normal;
    font-weight: 400;
    line-height: 100%; /* 55px */
    letter-spacing: -0.3125rem;
  }
  .oate-features .feature-liga .swiper-liga {
    overflow: hidden;
    background-color: #002d14;
    width: 100%;
    aspect-ratio: 1780/933;
    border-radius: 1.25rem;
  }
  .oate-features .feature-liga .swiper-button-prev,
  .oate-features .feature-liga .swiper-button-next {
    border-radius: 100%;
    width: 3.125rem;
    aspect-ratio: 1/1;
    background-color: #00ad27;
  }
  .oate-features .feature-liga .swiper-button-prev::after,
  .oate-features .feature-liga .swiper-button-next::after {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 1.645rem;
    font-weight: 600;
    color: #fff5de;
  }
  .oate-features .feature-liga .swiper-button-prev {
    left: 7%;
  }
  .oate-features .feature-liga .swiper-button-next {
    right: 7%;
  }
  .oate-features .oate-box {
    margin-top: 1.875rem;
  }
  .oate-features .oate-box .oate-box-wrap {
    gap: 1.875rem;
  }
  .oate-features .feature-board {
    background-color: #afe901;
    margin-top: 4.210625rem;
    padding-top: 4.8125rem;
    padding-bottom: 4.25rem;
  }
  .oate-features .feature-board h6 {
    color: var(--5, #003d1b);
    font-feature-settings: "ss02" on;
    font-family: "BT Oateria";
    font-size: 6.375rem;
    font-style: normal;
    font-weight: 350;
    line-height: 108.824%; /* 37.4px */
  }
  .oate-features .feature-board .feature-tag-font {
    background-color: #003d1b;
    border-radius: 9999px;
    padding: 0.3125rem 1.5rem 0.625rem 1.625rem;
    margin: -0.25rem 0 -0.0625rem 0;
    color: var(--3, #afe901);
    font-family: "BT Oateria";
    font-size: 1.809375rem;
    font-style: normal;
    font-weight: 700;
    line-height: 100%; /* 100% */
    letter-spacing: 0.018125rem;
  }
  .oate-features .feature-board .feature-board-infor__des {
    margin-top: 2.625rem;
    justify-content: space-between;
    align-items: center;
    position: relative;
  }
  .oate-features .feature-board .feature-board-infor__des::after {
    position: absolute;
    content: "";
    width: 100%;
    border-top: 1px solid rgba(0, 61, 27, 0.4);
    opacity: 0.8;
    top: 0;
    left: 0;
  }
  .oate-features .feature-board .feature-board-infor__des .feature-board-list {
    width: 63%;
    display: flex;
    justify-content: space-between;
  }
  .oate-features .feature-board .feature-board-infor__des .feature-board-list .feature-board-item {
    padding-bottom: 1.3125rem;
  }
  .oate-features .feature-board .feature-board-infor__des .feature-board-item {
    position: relative;
    padding-top: 1.3125rem;
    padding-left: 0;
  }
  .oate-features .feature-board .feature-board-infor__des .feature-board-item + .feature-board-item {
    padding-left: 2.75rem;
  }
  .oate-features .feature-board .feature-board-infor__des .feature-board-item + .feature-board-item::after {
    position: absolute;
    content: "";
    height: 100%;
    border-left: 1px solid rgba(0, 61, 27, 0.4);
    opacity: 0.8;
    top: 0;
    left: 0;
  }
  .oate-features .feature-board .feature-board-infor__des .feature-board-item p {
    color: rgba(0, 61, 27, 0.7);
    font-family: "BT Grotesk";
    font-size: 1.375rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 0.04125rem;
    padding-bottom: 0.00375rem;
    margin-bottom: 0;
    text-transform: uppercase;
  }
  .oate-features .feature-board .feature-board-infor__des .feature-board-item p + p {
    color: var(--5, #003d1b);
    font-family: "BT Grotesk";
    font-size: 1.625rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.1px;
    margin-top: 0.4375rem;
    text-transform: none;
  }
  .oate-features .feature-board .feature-board-infor__des .feature-board-item.item--1 {
    width: 24.2%;
  }
  .oate-features .feature-board .feature-board-infor__des .feature-board-item.item--2 {
    width: 23.34%;
  }
  .oate-features .feature-board .feature-board-infor__des .feature-board-item.item--3 {
    width: 25.62%;
  }
  .oate-features .feature-board .feature-board-infor__des .feature-board-item.item--4 {
    width: 26.64%;
  }
  .oate-features .feature-bean {
    margin-top: 4.375rem;
  }
  .oate-features .feature-card {
    cursor: grab;
    margin-top: 3.125rem;
  }
  .oate-features .feature-card .card-item-list {
    margin-top: 1.875rem;
    padding: 0 4.375rem;
    display: flex;
    align-items: center;
    width: 100%;
    overflow-x: auto;
    gap: 1.875rem;
  }
  .oate-features .feature-card .card-item {
    width: 54.75rem;
    aspect-ratio: 870/960;
    flex-shrink: 0;
  }
  .oate-features .feature-card .swiper {
    overflow: visible;
  }
  .oate-features .feature-card .swiper-slide + .swiper-slide .card-item {
    margin-left: 1.875rem;
  }
  .oate-features .feature-card .swiper-slide {
    width: auto;
  }
  .oate-features .feature-card .swiper-button-prev,
  .oate-features .feature-card .swiper-button-next {
    border-radius: 100%;
    width: 1.508rem;
    aspect-ratio: 1/1;
    height: auto;
    background-color: #fff5de;
  }
  .oate-features .feature-card .swiper-button-prev::after,
  .oate-features .feature-card .swiper-button-next::after {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 0.75rem;
    font-weight: 600;
    color: #00ad27;
  }
  .oate-features .feature-card .swiper-button-prev {
    left: 7%;
  }
  .oate-features .feature-card .swiper-button-prev::after {
    transform: translate(-80%, -46%);
  }
  .oate-features .feature-card .swiper-button-next {
    right: 7%;
  }
  .oate-features .feature-card .swiper-button-next::after {
    transform: translate(-36%, -44%);
  }
}

.oate-hethong {
  background-color: #ffffff;
  padding-top: 5.625rem;
}
.oate-hethong .title-box {
  padding-bottom: 1.4625rem;
}
.oate-hethong .title-box span {
  z-index: 2;
  color: #ffffff;
}
.oate-hethong .title-box span::after {
  z-index: -1;
}
.oate-hethong .item-left {
  background-color: #ffffff;
  z-index: 2;
}
.oate-hethong .item-left::after {
  content: " ";
  position: absolute;
  width: 100vw;
  height: 100%;
  top: 0;
  left: -10%;
  background-color: #ffffff;
  z-index: -1;
}
.oate-hethong .item-left__select {
  position: relative;
  display: flex;
  z-index: 3;
  border-bottom: 0.5px solid #003d1b;
}
.oate-hethong .item-left__select select {
  width: auto;
  border: none;
  color: #202020;
  font-family: "BT Beau Sans" !important;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 150.095%; /* 17.81px */
  appearance: auto;
  background: transparent;
  height: 1.6875rem;
}
.oate-hethong .item-left__select select option {
  color: #202020;
  border: 10%;
}
.oate-hethong .item-left__select .btn-weight {
  display: none;
  flex-shrink: 0;
  border: 1px solid #939090;
  content: " ";
  width: 12%;
  aspect-ratio: 1/1;
  background-image: url(../img/BT-Asinotte/arow-select.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 0.875rem;
  z-index: 3;
}
.oate-hethong .item-left__inner {
  margin-top: 3.164375rem;
}
.oate-hethong .item-left__inner svg {
  overflow: visible;
  pointer-events: none;
}
.oate-hethong .item-left__inner svg #cap-height,
.oate-hethong .item-left__inner svg #x-height,
.oate-hethong .item-left__inner svg #baseline,
.oate-hethong .item-left__inner svg #descender {
  color: rgba(0, 61, 27, 0.6);
  font-family: "BT Grotesk";
  font-size: 1.375rem;
  font-style: normal;
  font-weight: 400;
  line-height: 175.111%; /* 175.111% */
  text-transform: uppercase;
}
.oate-hethong .item-left__inner svg #A {
  font-size: 553.18px;
}
.oate-hethong .item-right {
  padding-top: 3.553125rem;
}
.oate-hethong .item-right h4 {
  color: var(--5, #003d1b);
  font-family: "BT Grotesk" !important;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 126.485%; /*  */
  position: relative;
}
.oate-hethong .item-right h4::after {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  transform: translate(-50%, 0%);
  content: "";
  border-bottom: 1px solid #003d1b;
  z-index: 1;
  width: 100%;
  height: 100%;
}
.oate-hethong .item-right__lists {
  position: relative;
  display: flex;
}
.oate-hethong .item-right__lists .f-item.liga-and-alter .f-item-list + .f-item-list {
  font-feature-settings: "ss01" on;
  text-transform: uppercase;
}
.oate-hethong .item-right__lists .f-item__label {
  color: var(--5, #003d1b);
  font-family: "BT Grotesk";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 700;
  line-height: 147.566%; /* 147.566% */
  text-transform: uppercase;
}
.oate-hethong .item-right__lists .f-item-list {
  display: flex;
  flex-wrap: wrap;
  border-top: 1px solid #aab48c;
  border-left: 1px solid #aab48c;
}
.oate-hethong .item-right__lists .f-item-list .f-btn {
  position: relative;
  width: 16.6666666667%;
  cursor: pointer;
}
.oate-hethong .item-right__lists .f-item-list .f-btn:after {
  content: "";
  display: block;
  padding-top: 100%;
  border-right: 1px solid #aab48c;
  border-bottom: 1px solid #aab48c;
}
.oate-hethong .item-right__lists .f-item-list .f-btn span {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  bottom: auto;
  right: auto;
  color: #003d1b;
  text-align: center;
  font-size: 2.6875rem;
  font-weight: inherit;
  line-height: 1;
  margin-bottom: -8%;
}
.oate-hethong .item-right__lists .f-item-list .f-btn span.char {
  top: 50%;
}
.oate-hethong .item-right__lists .f-item-list .f-btn.current {
  background-color: #003d1b;
}
.oate-hethong .item-right__lists .f-item-list .f-btn.current span {
  color: #fff5de;
}
.oate-hethong .item-right__lists .f-item-list--alt .f-btn {
  font-feature-settings: "ss01" on;
}
.oate-hethong .item-right__lists .f-item-list + .f-item-list {
  margin-top: 1.875rem;
}
.oate-hethong .item-right__lists input {
  display: none;
}
.oate-hethong .item-right__lists .tabs-wrap {
  width: 100%;
}
.oate-hethong .item-right__lists .tabs-wrap .tabs-title {
  position: relative;
}
.oate-hethong .item-right__lists .tabs-wrap .tabs-title .tabs-title-wrap {
  padding-top: 0.54rem;
  padding-bottom: 0.54rem;
  display: flex;
  flex-shrink: 0;
  gap: 0.729375rem;
  align-items: center;
  flex-wrap: nowrap;
  overflow-x: auto;
  width: 100%;
  scrollbar-width: none;
}
.oate-hethong .item-right__lists .tabs-wrap .tabs-title label {
  margin: 0;
}
.oate-hethong .item-right__lists .tabs-wrap .tabs-title h3 {
  white-space: nowrap;
  color: var(--5, #003d1b);
  font-family: "BT Grotesk";
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 400;
  line-height: 147.566%; /* 147.566% */
  text-transform: uppercase;
  margin-bottom: 0;
}
.oate-hethong .item-right__lists .tabs-wrap .tabs-title input[type=radio]:checked + label h3 {
  font-weight: 700 !important;
}
.oate-hethong .item-right__lists .tabs-wrap .tabs-content {
  width: 100%;
}
.oate-hethong .item-right__lists .tabs-wrap .arrow-icon {
  position: absolute;
  top: 50%;
  z-index: 1;
  width: 0.375rem;
  aspect-ratio: 6/10;
  right: 2%;
  transform: translateY(-50%);
  vertical-align: initial;
}
.oate-hethong .item-right__lists .tabs-wrap .f-item {
  pointer-events: none;
  position: absolute;
  left: 0;
  width: 100%;
  opacity: 0;
  transition: all 0.3s ease;
}
@media (min-width: 768px) {
  .oate-hethong {
    padding-top: 13.9375rem;
  }
  .oate-hethong .title-box {
    padding-bottom: 5.3125rem;
  }
  .oate-hethong .title-box span {
    z-index: 2;
    color: #ffffff;
  }
  .oate-hethong .title-box span::after {
    z-index: -1;
  }
  .oate-hethong .item-left {
    background-color: #ffffff;
    z-index: 10;
  }
  .oate-hethong .item-left::after {
    content: " ";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: -10%;
    background-color: #ffffff;
    z-index: -1;
  }
  .oate-hethong .item-left__select {
    position: relative;
    display: flex;
    z-index: 3;
    border-bottom: 1px solid #003d1b;
  }
  .oate-hethong .item-left__select select {
    width: auto;
    border: none;
    color: #202020;
    font-family: "BT Beau Sans" !important;
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 700;
    line-height: 200%; /* 17.81px */
    appearance: auto;
    background: transparent;
    height: 2.5rem;
    padding-bottom: 0.625rem;
  }
  .oate-hethong .item-left__select select option {
    color: #202020;
    border: 10%;
  }
  .oate-hethong .item-left__select .btn-weight {
    display: none;
    flex-shrink: 0;
    border: 1px solid #939090;
    content: " ";
    width: 12%;
    aspect-ratio: 1/1;
    background-image: url(../img/BT-Asinotte/arow-select.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 0.875rem;
    z-index: 3;
  }
  .oate-hethong .item-left__inner {
    margin-top: 6.5rem;
  }
  .oate-hethong .item-left__inner svg {
    overflow: visible;
    pointer-events: none;
  }
  .oate-hethong .item-left__inner svg #cap-height,
  .oate-hethong .item-left__inner svg #x-height,
  .oate-hethong .item-left__inner svg #baseline,
  .oate-hethong .item-left__inner svg #descender {
    color: rgba(0, 61, 27, 0.6);
    font-family: "BT Grotesk";
    font-size: 0.75rem;
    font-style: normal;
    font-weight: 400;
    line-height: 333.333%; /* 175.111% */
    text-transform: uppercase;
  }
  .oate-hethong .item-left__inner svg #A {
    font-size: 553.18px;
  }
  .oate-hethong .item-right {
    padding-top: 0;
  }
  .oate-hethong .item-right h4 {
    color: var(--5, #003d1b);
    font-family: "BT Grotesk";
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 700;
    line-height: 200%; /*  */
  }
  .oate-hethong .item-right h4::after {
    transform: translate(-50%, -47%);
  }
  .oate-hethong .item-right__lists {
    position: relative;
    display: flex;
  }
  .oate-hethong .item-right__lists .f-item.liga-and-alter .f-item-list + .f-item-list {
    font-feature-settings: "ss01" on;
    text-transform: uppercase;
  }
  .oate-hethong .item-right__lists .f-item__label {
    color: var(--5, #003d1b);
    font-family: "BT Grotesk";
    font-size: 1.0625rem;
    font-style: normal;
    font-weight: 400;
    line-height: 235.294%; /* 147.566% */
    text-transform: uppercase;
  }
  .oate-hethong .item-right__lists .f-item-list {
    display: flex;
    flex-wrap: wrap;
    border-top: 1px solid #aab48c;
    border-left: 1px solid #aab48c;
  }
  .oate-hethong .item-right__lists .f-item-list .f-btn {
    position: relative;
    width: 10%;
    cursor: pointer;
  }
  .oate-hethong .item-right__lists .f-item-list .f-btn:after {
    content: "";
    display: block;
    padding-top: 100%;
    border-right: 1px solid #aab48c;
    border-bottom: 1px solid #aab48c;
  }
  .oate-hethong .item-right__lists .f-item-list .f-btn span {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    bottom: auto;
    right: auto;
    color: #003d1b;
    text-align: center;
    font-size: 3.048875rem;
    font-weight: inherit;
    line-height: 222.222%;
    margin-bottom: -8%;
  }
  .oate-hethong .item-right__lists .f-item-list .f-btn span.char {
    top: 50%;
  }
  .oate-hethong .item-right__lists .f-item-list .f-btn.current {
    background-color: #003d1b;
  }
  .oate-hethong .item-right__lists .f-item-list .f-btn.current span {
    color: #fff5de;
  }
  .oate-hethong .item-right__lists .f-item-list + .f-item-list {
    margin-top: 2.641875rem;
  }
  .oate-hethong .item-right__lists input {
    display: none;
  }
  .oate-hethong .item-right__lists .tabs-wrap {
    width: 100%;
  }
  .oate-hethong .item-right__lists .tabs-wrap .tabs-title {
    position: relative;
  }
  .oate-hethong .item-right__lists .tabs-wrap .tabs-title .tabs-title-wrap {
    padding-top: 0.9375rem;
    padding-bottom: 1.90125rem;
    display: flex;
    flex-shrink: 0;
    gap: 1.375rem;
    align-items: center;
    flex-wrap: nowrap;
    overflow-x: auto;
    width: 100%;
    scrollbar-width: none;
  }
  .oate-hethong .item-right__lists .tabs-wrap .tabs-title label {
    margin: 0;
  }
  .oate-hethong .item-right__lists .tabs-wrap .tabs-title h3 {
    white-space: nowrap;
    color: var(--5, #003d1b);
    font-family: "BT Grotesk";
    font-size: 1.0625rem;
    font-style: normal;
    font-weight: 400;
    line-height: 147.566%; /* 147.566% */
    text-transform: uppercase;
    margin-bottom: 0;
  }
  .oate-hethong .item-right__lists .tabs-wrap .tabs-title input[type=radio]:checked + label h3 {
    font-weight: 800;
  }
  .oate-hethong .item-right__lists .tabs-wrap .tabs-content {
    width: 100%;
  }
  .oate-hethong .item-right__lists .tabs-wrap .arrow-icon {
    position: absolute;
    top: 50%;
    z-index: 4;
    width: 0.375rem;
    aspect-ratio: 6/10;
    right: 2%;
    transform: translateY(-50%);
    vertical-align: initial;
  }
  .oate-hethong .item-right__lists .tabs-wrap .f-item {
    position: absolute;
    left: 0;
    width: 100%;
    opacity: 0;
    transition: all 0.3s ease;
  }
}

.buy-font {
  padding-top: 6.27125rem;
  background-color: #ffffff;
}
.buy-font .buy-font__wrap {
  border-radius: 0.3125rem;
  background-color: #00ad27;
  padding-top: 0.3525rem;
  padding-left: 0.8575rem;
  padding-right: 0.83rem;
  padding-bottom: 1rem;
}
.buy-font .buy-font-top h6 {
  color: var(--1, #fff5de);
  font-family: "BT Oateria";
  font-size: 3.873625rem;
  font-style: normal;
  font-weight: 900;
  line-height: 100%; /* 61.978px */
  letter-spacing: -0.0775rem;
  text-transform: uppercase;
}
.buy-font .buy-font-top .buy-font-sub {
  display: flex;
  justify-content: space-between;
  margin-top: 0.3125rem;
}
.buy-font .buy-font-top .buy-font-sub p {
  color: var(--1, #fff5de);
  font-family: "BT Oateria";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 350;
  line-height: 100%; /* 14px */
}
.buy-font .buy-font-top .buy-font-sub p + p {
  text-align: right;
}
.buy-font .buy-font-bot {
  margin-top: 6.2725rem;
  align-items: center;
  text-align: center;
}
.buy-font .buy-font-bot .buy-font-licence {
  color: var(--5, #003d1b);
  text-align: center;
  font-family: "BT Oateria";
  font-size: 1.375rem;
  font-style: normal;
  font-weight: 800;
  line-height: 100%; /* 22px */
  letter-spacing: -0.01375rem;
  text-transform: uppercase;
}
.buy-font .buy-font-bot .buy-font-button {
  display: flex;
  justify-content: center;
  background-color: #ffd900;
  border-radius: 0.3125rem;
  overflow: hidden;
  margin-top: 0.9375rem;
}
.buy-font .buy-font-bot .buy-font-button a {
  padding: 1.3125rem 4.5625rem 1.375rem 4.625rem;
  padding-top: 1.3125rem;
  padding-bottom: 1.375rem;
  width: 100%;
  color: var(--5, #003d1b);
  text-align: center;
  font-family: "BT Oateria";
  font-size: 2rem;
  font-style: normal;
  font-weight: 800;
  line-height: 100%; /* 32px */
  letter-spacing: -0.02rem;
  text-transform: uppercase;
}
@media (min-width: 768px) {
  .buy-font {
    padding-top: 19.125rem;
  }
  .buy-font .buy-font__wrap {
    border-radius: 1.25rem;
    background-color: #00ad27;
    padding-top: 1.6875rem;
    padding-left: 3.875rem;
    padding-right: 3.875rem;
    padding-bottom: 3.6875rem;
  }
  .buy-font .buy-font-top h6 {
    color: var(--1, #fff5de);
    font-family: "BT Oateria";
    font-size: 17.5rem;
    font-style: normal;
    font-weight: 900;
    line-height: 100%; /* 61.978px */
    letter-spacing: -0.35rem;
    text-transform: uppercase;
  }
  .buy-font .buy-font-top .buy-font-sub {
    display: flex;
    justify-content: space-between;
    margin-top: 0.8125rem;
  }
  .buy-font .buy-font-top .buy-font-sub p {
    color: var(--1, #fff5de);
    font-family: "BT Oateria";
    font-size: 2.1875rem;
    font-style: normal;
    font-weight: 500;
    line-height: 118%; /* 14px */
  }
  .buy-font .buy-font-top .buy-font-sub p + p {
    text-align: right;
  }
  .buy-font .buy-font-bot {
    margin-top: 16.0625rem;
    text-align: center;
    display: flex;
    justify-content: space-between;
  }
  .buy-font .buy-font-bot .buy-font-licence {
    color: var(--5, #003d1b);
    text-align: left;
    font-family: "BT Oateria";
    font-size: 4.375rem;
    font-style: normal;
    font-weight: 800;
    line-height: 100%; /* 22px */
    letter-spacing: -0.04375rem;
    text-transform: uppercase;
  }
  .buy-font .buy-font-bot .buy-font-button {
    display: flex;
    background-color: #ffd900;
    border-radius: 1.25rem;
    overflow: hidden;
    margin-top: 0;
  }
  .buy-font .buy-font-bot .buy-font-button a {
    padding: 3.375rem 10.375rem 3.75rem 10.4375rem;
    color: var(--5, #003d1b);
    text-align: center;
    font-family: "BT Oateria";
    font-size: 4.6875rem;
    font-style: normal;
    font-weight: 800;
    line-height: 100%; /* 32px */
    letter-spacing: -0.046875rem;
    text-transform: uppercase;
  }
}

.chan-trang {
  padding-top: 7.515625rem;
  background-color: #ffffff;
}
.chan-trang .chan-trang-wrap {
  text-align: center;
}
.chan-trang .chan-trang-logo svg {
  width: 13.75rem;
  aspect-ratio: 220/52.21;
}
.chan-trang .chan-trang-mem-wrap {
  padding-top: 2.5rem;
}
.chan-trang .chan-trang-mems {
  display: flex;
  justify-content: center;
  gap: 2.7775rem;
}
.chan-trang .chan-trang-mems .mem-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
}
.chan-trang .chan-trang-mems .mem small {
  color: rgba(0, 0, 0, 0.4);
  text-align: center;
  font-family: "BT Grotesk";
  font-size: 0.650625rem;
  font-style: normal;
  font-weight: 400;
  line-height: 171.429%; /* 171.429% */
  text-transform: uppercase;
}
.chan-trang .chan-trang-mems .mem p {
  margin-top: 0.40875rem;
  color: #000;
  text-align: center;
  font-family: "BT Grotesk";
  font-size: 0.9295rem;
  font-style: normal;
  font-weight: 400;
  line-height: 120%; /* 120% */
  margin-bottom: 0;
}
.chan-trang .chan-trang-mems .mem + .mem {
  margin-top: 2.593125rem;
}
.chan-trang .chan-trang-mems + .chan-trang-mems {
  border-top: 1px solid rgba(0, 0, 0, 0.2);
  margin-top: 2.74875rem;
  padding-top: 2.849375rem;
}
.chan-trang .chan-trang-member-cop {
  margin-top: 5.005rem;
}
.chan-trang .chan-trang-member-cop p {
  color: rgba(0, 0, 0, 0.4);
  text-align: center;
  font-family: "BT Grotesk";
  font-size: 0.650625rem;
  font-style: normal;
  font-weight: 400;
  line-height: 145%;
  opacity: 0.5;
  margin-bottom: 0.678125rem;
}
.chan-trang .chan-trang-member-cop .partners-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.chan-trang .chan-trang-member-cop .partners-wrap .partner path {
  fill: #000;
  opacity: 0.5;
}
.chan-trang .chan-trang-member-cop .partners-wrap .partner:nth-of-type(1) svg {
  width: 6.22925rem;
  height: auto;
}
.chan-trang .chan-trang-member-cop .partners-wrap .partner:nth-of-type(3) svg {
  width: 5.86375rem;
  height: auto;
}
.chan-trang .chan-trang-member-cop .partners-wrap .partner:nth-of-type(5) svg {
  width: 4.437875rem;
  height: auto;
}
.chan-trang .chan-trang-member-cop .partners-wrap .partner-dive {
  width: 1px;
  height: 1.1875rem;
  border-left: 1px dashed #000;
}
.chan-trang .credit {
  color: rgba(0, 0, 0, 0.5);
  text-align: center;
  font-family: "BT Grotesk";
  font-size: 0.625rem;
  font-style: normal;
  font-weight: 400;
  line-height: 145%; /* 14.5px */
  margin-top: 5.009375rem;
  padding-bottom: 1.6875rem;
}
@media (min-width: 768px) {
  .chan-trang {
    padding-top: 11.84rem;
  }
  .chan-trang .chan-trang-wrap {
    padding: 0 25.625rem;
  }
  .chan-trang .chan-trang-logo svg {
    width: 15.625rem;
    aspect-ratio: 250/59.32;
  }
  .chan-trang .chan-trang-mem-wrap {
    padding: 0 12.25rem;
    padding-top: 3.26375rem;
  }
  .chan-trang .chan-trang-mems {
    display: flex;
    justify-content: center;
    gap: 3.5625rem;
  }
  .chan-trang .chan-trang-mems .mem small {
    color: rgba(0, 0, 0, 0.4);
    text-align: center;
    font-family: "BT Grotesk";
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 400;
    line-height: 171.429%; /* 171.429% */
    text-transform: uppercase;
  }
  .chan-trang .chan-trang-mems .mem p {
    margin-top: 0.5625rem;
    color: #000;
    text-align: center;
    font-family: "BT Grotesk";
    font-size: 1.25rem;
    font-style: normal;
    font-weight: 400;
    line-height: 120%; /* 120% */
    margin-bottom: 0;
  }
  .chan-trang .chan-trang-mems .mem + .mem {
    margin-top: 3.5rem;
  }
  .chan-trang .chan-trang-mems + .chan-trang-mems {
    border-top: 1px solid rgba(0, 0, 0, 0.2);
    margin-top: 3.6875rem;
    padding-top: 3.875rem;
  }
  .chan-trang .chan-trang-member-cop {
    margin-top: 6.75rem;
  }
  .chan-trang .chan-trang-member-cop p {
    color: rgba(0, 0, 0, 0.4);
    text-align: center;
    font-family: "BT Grotesk";
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 700;
    line-height: 145%;
    opacity: 0.5;
    margin-bottom: 1.818125rem;
  }
  .chan-trang .chan-trang-member-cop .partners-wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 3.125rem;
  }
  .chan-trang .chan-trang-member-cop .partners-wrap .partner path {
    fill: #000;
    opacity: 0.5;
  }
  .chan-trang .chan-trang-member-cop .partners-wrap .partner:nth-of-type(1) svg {
    width: 11.2745rem;
    height: auto;
  }
  .chan-trang .chan-trang-member-cop .partners-wrap .partner:nth-of-type(3) svg {
    width: 10.613125rem;
    height: auto;
  }
  .chan-trang .chan-trang-member-cop .partners-wrap .partner:nth-of-type(5) svg {
    width: 8.03225rem;
    height: auto;
  }
  .chan-trang .chan-trang-member-cop .partners-wrap .partner-dive {
    width: 1px;
    height: 3.589375rem;
    border-left: 1px dashed #000;
  }
  .chan-trang .credit {
    color: rgba(0, 0, 0, 0.5);
    text-align: center;
    font-family: "BT Grotesk";
    font-size: 1.004rem;
    font-style: normal;
    font-weight: 400;
    line-height: 145%; /* 14.5px */
    margin-top: 16.6825rem;
    padding-bottom: 4.250625rem;
  }
}

/*# sourceMappingURL=work-BT-Oateria.css.map */