@font-face {
  font-family: "SVN-Gilroy";
  src: url("../fonts/SVN-Gilroy Regular.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "SVN-Gilroy";
  src: url("../fonts/SVN-Gilroy Medium.otf") format("opentype");
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: "SVN-Gilroy";
  src: url("../fonts/SVN-Gilroy Bold.otf") format("opentype");
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: "SVN-Gilroy";
  src: url("../fonts/SVN-Gilroy\ Heavy.otf") format("opentype");
  font-weight: 900;
  font-style: normal;
}
@font-face {
  font-family: "Playfair";
  src: url("../fonts/PlayfairDisplay-Regular.ttf") format("opentype");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "Playfair";
  src: url("../fonts/PlayfairDisplay-Medium.ttf") format("opentype");
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: "Playfair";
  src: url("../fonts/PlayfairDisplay-Bold.ttf") format("opentype");
  font-weight: 700;
  font-style: normal;
}
/* Reset & Base Styles */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "SVN-Gilroy", sans-serif;
}
html {
  /* 1rem will now equal exactly 1rem at a 1440rem screen width */
  font-size: calc(100vw / 1440);
  height: 100%;
  margin: 0;
  scroll-behavior: smooth;
}

body {
  background: url("../images/about-us-main-bg.webp") top center no-repeat;
  background-size: cover;
  background-color: #0b0214;
  display: flex;
  flex-direction: column;
}

main {
  flex: 1;
  margin-top: 90rem;
  margin-inline: auto;
  width: 1281rem;
  font-size: 16rem;
  line-height: 20rem;
  color: #ddd8cd;
}
@media screen and (min-width: 1921px) {
   html {
    font-size: 1.333333px;
  }
  /* main {
    flex: 1;
    margin-top: 90px;
    margin-inline: auto;
    width: 1280px;
    font-size: 16px;
    line-height: 20px;
    color: #ddd8cd;
  } */
}
@media screen and (max-width: 768px) {
  body {
    background: url("../images/about-us-main-bg-mb.webp") top center
      no-repeat;
    background-size: contain;
    background-color: #080105;
  }
  main {
    width: 402rem;
    max-width: 100%;
    min-width: 0;
    background-size: unset;
  }
  main.huong-dan {
    min-height: unset;
  }
  html {
    /* 1rem will now equal exactly 1rem at a 1440rem screen width */
    font-size: calc(100vw / 402);
  }
}