.services-header{
    text-align:center;
    margin-bottom:50px;
}


.services-header h2{

    font-size:42px;
    color:#D4AF37;
    margin-bottom:15px;

}


.services-header p{

    max-width:900px;
    margin:auto;
    color:#ddd;
    font-size:18px;
    line-height:1.7;

}



.services-grid{

    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
    gap:30px;

}




.service-card{

    background:
    linear-gradient(
        145deg,
        rgba(255,255,255,0.08),
        rgba(255,255,255,0.02)
    );

    border:1px solid rgba(212,175,55,0.3);

    padding:35px;

    border-radius:20px;

    backdrop-filter:blur(10px);

    transition:.4s;

    color:white;

}



.service-card:hover{

    transform:translateY(-10px);

    border-color:#D4AF37;

    box-shadow:
    0 15px 40px rgba(212,175,55,.25);

}





.service-icon{

    width:80px;
    height:80px;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:40px;

    background:#071A33;

    border-radius:50%;

    margin-bottom:20px;

}





.service-card h3{

    color:#D4AF37;

    font-size:25px;

    margin-bottom:15px;

}




.service-card p{

    color:#ddd;

    line-height:1.6;

}




.service-card ul{

    margin-top:20px;

    padding-left:20px;

}



.service-card li{

    margin-bottom:8px;

    color:#fff;

}




.fade-in{

    animation:fadeIn 1s ease;

}



@keyframes fadeIn{

from{

opacity:0;

transform:translateY(30px);

}

to{

opacity:1;

transform:translateY(0);

}

}





@media(max-width:600px){

.services-header h2{

font-size:30px;

}


.service-card{

padding:25px;

}

}