﻿.services-container {
	display: flex;
    gap: 30px;
    flex-wrap: wrap;
    justify-content: center;
 }

 .service-card {
     background: linear-gradient(135deg, #f4f1eb 0%, #ede8df 100%);
     /* border-radius: 20px; */
     overflow: hidden;
     box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
     transition: transform 0.3s ease, box-shadow 0.3s ease;
     position: relative;
     height: 300px;
     width: calc(50% - 15px);
 }

 .service-card:hover {
     transform: translateY(-5px);
     box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15);
 }
.service-image {
	margin: 0;
	overflow: hidden;
}
.service-image::before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	background: linear-gradient(to right, #fdf4e3 30%, #ffffff00 100%);
	background: linear-gradient(to right, #fdf4e3 0%, rgb(253 244 227) 35%, rgb(253 244 227 / 0%) 70% 70%, rgb(253 244 227 / 0%) 100%);
}

::before {}
 .service-image img{
     width: 100%;
     height: 100%;
     object-fit: cover;
     /* border-radius: 20px 20px 0 0; */
 }

 .service-content {
     padding: 60px 25px 55px;
     position: absolute;
     top: 0;
     display: flex;
     flex-direction: column;
     justify-content: space-between;
     height: 100%;
	width: 60%;
 }

 .service-title {
	color: var(--mcolor);
    font-size: 24px;
    font-weight: bold;
    line-height: 1.5;
    text-align: left;
 }

 .view-more-btn {
     background: #d7af3d;
     color: white;
     border: none;
     padding: 12px 25px;
     border-radius: 8px;
     font-size: 14px;
     font-weight: 600;
     cursor: pointer;
     transition: all 0.3s ease;
     display: inline-flex;
     align-items: center;
     gap: 8px;
     text-transform: uppercase;
     letter-spacing: 0.5px;
	width: 170px;
	justify-content: center;
 }

 .view-more-btn:hover {
     background: var(--mcolor);
     transform: translateX(3px);
 }

 .view-more-btn::after {
     content: '↗';
     font-size: 16px;
     transition: transform 0.3s ease;
 }

 .view-more-btn:hover::after {
     transform: translate(2px, -2px);
 }

 /* Responsive Design */
 @media (max-width: 768px) {
     .services-container {
         grid-template-columns: 1fr;
         gap: 20px;
         padding: 10px;
     }

     .service-card {
         /* min-height: 350px; */
         width: 100%;
         height: 250px;
     }

     .service-image {
         height: 100%;
     }

     .service-title {
         font-size: 20px;
         margin-bottom: 20px;
     }

     .service-content {
         padding: 45px 30px;
         width: 70%;
     }
 }

 @media (max-width: 480px) {

     .service-title {
         font-size: 18px;
     }

     .view-more-btn {
         padding: 10px 20px;
         font-size: 13px;
     }
 }


 .service-card:nth-child(1) { animation-delay: 0.1s; }
 .service-card:nth-child(2) { animation-delay: 0.2s; }
 .service-card:nth-child(3) { animation-delay: 0.3s; }
 .service-card:nth-child(4) { animation-delay: 0.4s; }
