@media (min-width: 768px) {
  .hero-background img {
    width: 100dvw;
    height: 100dvh;
    object-fit: cover;
    object-position: bottom 0 right 0dvw;
  }
  .header {
    gap: 5vw;
    /* padding: 20px 5%; */
  }

  .hamburger {
    display: none;
  }

  .logo {
    width: 18dvw;
  }

  .logo img {
    max-width: 10dvw;
  }

  .nav-menu ul {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5dvw;
    padding: 10px 0;
  }

  .nav-menu ul li a {
    font-size: 2dvw;
    color: var(--color-text);
  }

  .nav-btn {
    display: block;
    /* padding: 10px 20px;
    font-size: medium; */
    padding: 1dvw 2dvw;
    font-size: 2dvw;

    border: 1px solid #fff;
    border-radius: 0px 15px 0 15px;
    background: var(--color-primary);
    color: #fff;
  }

  .hero-text {
    width: 75%;
    margin: 0 auto;
  }

  .hero-text h1 {
    font-size: 64px;
  }

  .hero-text h2 {
    font-size: 76px;
  }

  .hero-text p {
    margin-top: 15px;
    font-size: 24px;
  }

  .hero-void {
    height: 40dvh;
    position: relative;
  }

  .hero-void img {
    /* display: none; */
    max-width: 80px;
    position: absolute;
    top: 5dvw;
    right: 10%;
  }

  .hero-buttons {
    gap: 5dvw;
  }

  .hero-buttons a {
    padding: 20px 40px;
    font-size: 28px;

    border: 1px solid #fff;
    border-radius: 0px 30px 0 30px;
  }

  /* ======== SECTION PRODUCT DESCRIPTION ======== */

  .product-desc-text h1 {
    font-size: 60px;
  }

  .product-desc-text h2 {
    font-size: 48px;
  }

  .product-desc-text p {
    font-size: 20px;
  }

  /* ======== SECTION RASANYA ======== */

  .rasanya h3 {
    font-size: 32px;
  }

  .rasanya p {
    font-size: 20px;
  }

  /* ======== SECTION PROBLEM SOLUTION ======== */

  .problem-solution {
    width: 100%;
    padding: 30px 8% 0 8%;
    background-color: #fff;
  }

  .ps-top-container p {
    font-size: 20px;
  }

  .list-item p {
    font-size: 18px;
  }

  .ps-top-container img {
    width: 18px;
  }

  /* ======== SECTION HOW TO ======== */

  .ht-header p {
    font-size: 20px;
    margin-bottom: 5px;
  }

  .ht-header h2 {
    font-size: 46px;
  }

  .ht-list {
    column-gap: 20px;
    row-gap: 30px;
    margin: 20px 17vw 0 17vw;
  }

  .ht-list img {
    object-fit: contain;
    height: 3.75rem;
  }

  .ht-list p {
    font-size: 20px;
  }

  /* ======== SECTION PERFUME VARIANTS ======== */

  .pv-header {
    font-size: 48px;
  }

  .pv-subtitle {
    font-size: 36px;
  }

  .cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
  }

  .coming-soon {
    font-size: 48px;
  }

  /* ======== SECTION FAQ ======== */

  .faq-header {
    font-size: 42px;
  }

  .faq-question {
    font-size: 20px;
    padding: 12px 20px;
  }

  /* ======== SECTION CTA ======== */

  .countdown {
    margin-bottom: 20px;
  }

  .cta-header {
    font-size: 42px;
  }

  .time {
    font-size: 120px;
    font-weight: 700;
  }

  .countdown small {
    font-size: 32px;
  }
}