*{
    margin:0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Poppins', sans-serif;
}

body{
    background: linear-gradient(260deg,#b75d62, #754d4f);
}

.showcase{
display: flex;
position: absolute;
align-items: center;
justify-content: space-between;
min-height: 90vh;
padding: 0rem 15% 0vh 15%;
overflow: hidden;
}

nav{
    min-height: 10vh;
    color: white;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem 15% 0vh 15%;
}
.logo{
    text-decoration: none;
    color: white;
    font-size: 1rem;
    font-weight: bold;
}
nav img{
    transform: scale(0.7);
}

.image-container{
display: flex;
align-items: center;
justify-content: flex-start;
height: 90vh;
z-index: 2;
flex: 1;
}

.image-container img{
width:90%;
}

.showcase-text{
    flex: 1;
    color: white;
    padding-bottom: 10rem;
}

.showcase-title{
    font-size: 2rem;
}

.showcase-subtitle {
    font-size: 1rem;
    padding: 3rem 0rem;
    font-weight: 400;
}
.showcase-button{
    padding: 0.5rem 2rem;
    border: none;
    color: black;
    font-weight: 500;
    font-size: 0.8rem;
    font-family: 'Poppins', sans-serif;
}

.showcase-arrow{
    position: absolute;
    right: 15%;
    bottom: 10%;
    transform: scale(0.6);
}


.circle {
    position: absolute;
}
.circle-1 {
    left: -3%;
    bottom: -3%;
    transform: scale(2);
}
.circle-2 {
    left: 35%;
    bottom: 10%;
}
.circle-3 {
    left: 20%;
    top: 15%;
    transform: scale(1.5);
}

/* product page*/
.product-nav {
    min-height: 10vh;
  }
  .product-section {
    background: white;
    min-height: 90vh;
    position: absolute;
    width: 100vw;
    z-index: 5;
  }
  
  .product-description {
    padding: 5% 15%;
    color: #4b4b4b;
  }
  .product-description h2 {
    font-size: 2rem;
  }
  .product-description p {
    font-size: 1.2rem;
    padding: 1rem 0rem;
  }
  
  .product-gallery {
    display: grid;
    padding: 0% 15%;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    grid-gap: 2rem;
  }
  
  .product-gallery .product-img {
    border-radius: 1rem;
    width: 100%;
  }
  .price {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .card {
    padding: 2rem;
  }
  
  /*Mobile version*/

  @media screen and (max-width: 768px) {
    .showcase {
      flex-direction: column;
      padding: 20%;
      justify-content: space-evenly;
      min-height: 85vh;
    }
    .image-container {
      min-height: 30vh;
      justify-content: center;
      order: 1;
    }
  
    .circle-3 {
      top: 90%;
      left: 50%;
      transform: translate(-50%, -50%) scale(3);
    }
    .circle-1,
    .circle-2 {
      display: none;
    }
    .showcase-title {
      font-size: 1.5rem;
    }
    .showcase-subtitle {
      font-size: 1rem;
      padding: 2rem 0rem;
    }
    .showcase-text {
      padding-bottom: 0;
    }
    .showcase-arrow {
      right: 0;
      bottom: 50%;
    }
  }