/* --- Styles for Maintenance & Support Page --- */

/* Hero Section */
.hero-maintenance {
    padding: 6rem 2rem;
    background-color: #16213e;
    min-height: 80vh;
    display: flex;
    align-items: center;
}
.hero-maintenance-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 4rem;
}
.hero-maintenance-text h1 { font-size: 3.5rem; color: #fff; margin-bottom: 1rem; }
.hero-maintenance-text .subtitle { font-size: 1.3rem; color: #bbb; line-height: 1.7; margin-bottom: 2.5rem; }
.hero-maintenance-image img { width: 100%; max-width: 450px; animation: subtle-float 6s ease-in-out infinite; }

/* Differentiation Section */
.diff-section {
    padding: 3rem 2rem;
    background-color: #101d36;
}
.diff-box {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 2rem;
    max-width: 900px;
    margin: 0 auto;
    background: rgba(0,0,0,0.2);
    padding: 2rem;
    border-radius: 15px;
}
.diff-item { text-align: center; flex: 1; }
.diff-item h4 { font-size: 1.4em; color: #fff; margin-bottom: 0.5rem; }
.diff-item i { margin-left: 0.5rem; color: #3b82f6; }
.diff-item p { font-size: 1.1em; color: #bbb; }
.diff-separator { font-size: 1.1em; color: #bbb; font-weight: 600; }

/* Maintenance Services Section - New Design */
.maintenance-services-section {
    padding: 6rem 2rem;
}
.maintenance-list {
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.maintenance-item {
    display: flex;
    align-items: center;
    gap: 2rem;
    background: rgba(255, 255, 255, 0.05);
    padding: 2rem;
    border-radius: 12px;
    border: 1px solid transparent;
    transition: all 0.3s ease;
}
.maintenance-item:hover {
    border-color: #3b82f6;
    background: rgba(59, 130, 246, 0.1);
    transform: translateX(-10px);
}
.maintenance-icon {
    font-size: 2.6em;
    color: #3b82f6;
    background: rgba(59, 130, 246, 0.1);
    width: 70px;
    height: 70px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.maintenance-text h5 { font-size: 1.5em; color: #fff; margin-bottom: 0.5rem; }
.maintenance-text p { color: #bbb; line-height: 1.6; }

/* Responsive adjustments */
@media (max-width: 992px) {
    .hero-maintenance-grid { grid-template-columns: 1fr; text-align: center; }
    .hero-maintenance-image { order: -1; margin-bottom: 2rem; }
}
@media (max-width: 768px) {
    .diff-box { flex-direction: column; }
    .maintenance-item { flex-direction: column; text-align: center; gap: 1.5rem; }
}