.logo-download-section {
padding: 60px 20px;
background: linear-gradient(to bottom, #f4f9ff, #ffffff);
font-family: 'Segoe UI', Arial, sans-serif;
}

.logo-container {
max-width: 1400px;
margin: 0 auto;
text-align: center;
}

.logo-container h2 {
color: #0056a6;
font-size: 34px;
margin-bottom: 15px;
text-transform: uppercase;
font-weight: 700;
}

.logo-container p {
color: #555;
font-size: 17px;
line-height: 1.8;
margin-bottom: 35px;
}

/* 3 Logos in Single Row */
.logo-grid{
    display:grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap:25px;
    width:100%;
    margin-top:30px;
}

.logo-card{
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    box-sizing:border-box;
    background:#fff;
    border-top:6px solid #0056a6;
    border-radius:15px;
    padding:25px;
    text-align:center;
    box-shadow:0 8px 25px rgba(0,0,0,0.08);
}

/* Tablet */
@media (max-width: 992px){
    .logo-grid{
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/* Mobile */
@media (max-width: 768px){
    .logo-grid{
        grid-template-columns: 1fr !important;
    }
}

.logo-card:hover {
transform: translateY(-8px);
box-shadow: 0 12px 30px rgba(0,86,166,0.20);
}

.logo-thumbnail {
width: 170px;
max-width: 100%;
height: auto;
border: 3px solid #0056a6;
border-radius: 12px;
padding: 10px;
background: #fff;
margin-bottom: 18px;
transition: all 0.3s ease;
}

.logo-thumbnail:hover {
transform: scale(1.05);
}

.logo-card h3 {
color: #0056a6;
font-size: 22px;
margin-bottom: 12px;
}

.logo-info {
color: #666;
margin-bottom: 22px;
line-height: 1.6;
}

.download-btn {
display: inline-block;
background: linear-gradient(135deg, #0056a6, #0077cc);
color: #ffffff;
text-decoration: none;
padding: 12px 28px;
border-radius: 50px;
font-weight: 600;
transition: all 0.3s ease;
}

.download-btn:hover {
background: linear-gradient(135deg, #004080, #005fa3);
transform: translateY(-2px);
box-shadow: 0 5px 15px rgba(0,86,166,0.30);
}

/* Tablet */
@media (max-width: 1024px) {
.logo-grid {
flex-wrap: wrap;
}


.logo-card {
    flex: 0 0 48%;
}


}

/* Mobile */
@media (max-width: 768px) {
.logo-grid {
flex-direction: column;
align-items: center;
}

.logo-card {
    width: 100%;
    max-width: 500px;
}

.logo-container h2 {
    font-size: 28px;
}


}
