* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'Roboto', sans-serif; line-height: 1.6; color: #333; background-color: #fff; padding-top: 70px; }
.container { max-width: 1100px; margin: 0 auto; padding: 0 20px; }
.section-padding { padding: 60px 0; }
.bg-gray { background-color: #f4f7f6; }
.section-title { font-size: 2.2rem; text-align: center; margin-bottom: 40px; color: #2c3e50; }

.header { background: #fff; box-shadow: 0 2px 5px rgba(0,0,0,0.1); position: fixed; width: 100%; top: 0; z-index: 1000; }
.header-content { display: flex; justify-content: space-between; align-items: center; height: 70px; }
.logo { font-size: 1.3rem; font-weight: 700; color: #0056b3; text-transform: uppercase; }
.nav a { margin: 0 10px; font-weight: 500; text-decoration: none; color: #333; }
.header-phone a { font-weight: 700; color: #0056b3; text-decoration: none; }

.hero { height: 350px; background: linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0.6)), url('photo1.jpg'); background-size: cover; background-position: center; display: flex; align-items: center; text-align: center; color: #fff; }
.hero-text h1 { font-size: 2.5rem; margin-bottom: 15px; width: 100%; padding: 0 20px; }

.cards-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 20px; }
.card { background: #fff; padding: 25px; border: 1px solid #eee; border-radius: 8px; text-align: center; transition: 0.3s; }
.card:hover { border-color: #0056b3; box-shadow: 0 5px 15px rgba(0,0,0,0.1); }
.card h3 { color: #0056b3; margin-bottom: 10px; font-size: 1.1rem; }

/* Слайдер на 9 пар */
.slider-container { overflow: hidden; width: 100%; position: relative; border-radius: 10px; }
.slider-track { 
    display: flex; 
    width: 900%; /* 9 пар по 100% на каждую */
    animation: slide-9-steps 45s infinite; /* по 5 секунд на пару */
}
.slide-pair { display: flex; width: calc(100% / 9); gap: 20px; justify-content: center; padding: 0 10px; }
.slide-pair img { width: 50%; height: 450px; object-fit: cover; border-radius: 8px; background: #eee; }

@keyframes slide-9-steps {
    0%, 10% { transform: translateX(0); }
    11.1%, 21.1% { transform: translateX(-11.11%); }
    22.2%, 32.2% { transform: translateX(-22.22%); }
    33.3%, 43.3% { transform: translateX(-33.33%); }
    44.4%, 54.4% { transform: translateX(-44.44%); }
    55.5%, 65.5% { transform: translateX(-55.55%); }
    66.6%, 76.6% { transform: translateX(-66.66%); }
    77.7%, 87.7% { transform: translateX(-77.77%); }
    88.8%, 98.8% { transform: translateX(-88.88%); }
    100% { transform: translateX(0); }
}

.footer { background: #2c3e50; color: #fff; padding: 40px 0; text-align: center; }
.contact-info p { margin-bottom: 10px; }
.contact-info a { color: #fff; text-decoration: none; border-bottom: 1px dashed #fff; }

@media (max-width: 768px) {
    .slide-pair img { height: 250px; }
    .hero-text h1 { font-size: 1.8rem; }
}