body{

  margin:0;

  font-family:Arial,sans-serif;

  background:linear-gradient(
    to bottom,
    #eef6ea,
    #f5f0e6
  );
}
.image-container {
  display: flex;
  gap: 20px;
  justify-content: center;
  margin: 20px 0;
  flex-wrap: wrap; 
}

.image-container img {
  width: 45%;       
  max-width: 100%;
  height: auto;
  border-radius: 15px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.2);
  object-fit: cover;
}

@media (max-width: 768px) {
  .image-container {
    flex-direction: column; 
    gap: 15px;
  }

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

.detail-card{
  color: #666;
}
.detail-section{

  min-height:100vh;

  padding:80px 20px;

  display:flex;

  justify-content:center;

  align-items:center;

  box-sizing:border-box;
}


.detail-container{

  width:100%;

  max-width:1200px;

  margin:auto;

  background:white;

  padding:60px;

  border-radius:25px;

  box-shadow:
  0px 8px 20px rgba(0,0,0,0.08);

  box-sizing:border-box;
}


.detail-icon{

  font-size:61px;

  margin-bottom:20px;

  text-align:center;
}

.detail-container h1{

  font-size:42px;

  color:#2d5a27;

  margin-bottom:25px;

  text-align:center;
}

.detail-container p{

  font-size:17px;

  line-height:1.9;

  color:#666;

  text-align:justify;
}

.detail-container h2{

  margin-top:40px;

  margin-bottom:20px;

  color:#6f4e37;

  font-size:28px;

  text-align:center;
}

.detail-container h3{

  margin-top:40px;

  margin-bottom:20px;

  color:#6f4e37;

  font-size:28px;


}
.detail-container ul{

  padding-left:30px;

  margin-top:20px;
}

.detail-container li{

  font-size:16px;

  line-height:2;

  color:#444;

  text-align:justify;
}

.detail-container a{

  text-decoration:none;
}

.button-box{

  display:flex;

  justify-content:center;

  margin-top:40px;
}

.detail-container button{

  width:220px;

  padding:15px 20px;

  border:none;

  border-radius:50px;

  background:linear-gradient(
    to right,
    #2d5a27,
    #6f4e37
  );

  color:white;

  font-size:14px;

  font-weight:600;

  cursor:pointer;

  transition:0.3s;
}

.detail-container button:hover{

  transform:scale(1.05);

  opacity:0.9;
}

@media(max-width:768px){

  .detail-section{

    padding:40px 15px;
  }

  .detail-container{

    padding:35px 20px;

    border-radius:20px;
  }

  .detail-icon{

    font-size:48px;
  }

  .detail-container h1{

    font-size:28px;

    line-height:1.4;
  }

  .detail-container p{

    font-size:14px;

    line-height:1.7;

    text-align:justify;
  }

  .detail-container h2{

    font-size:21px;

    line-height:1.4;
  }

  .detail-container li{

    font-size:14px;

    line-height:1.8;

    text-align:justify;
  }

  .detail-container button{

    width:100%;

    max-width:220px;
  }

}
.h3{
  font-size: 22px;

}