Добавление секции "Способ оплаты"

assets/css/main.css

@@ -215,7 +215,7 @@ a:hover {
 .navbar-nav {
     display: flex;
     list-style: none;
-    gap: 2rem;
+    gap: 1.5rem;
 }
 
 .nav-link {
@@ -223,6 +223,7 @@ a:hover {
     font-weight: 500;
     transition: var(--transition);
     position: relative;
+    font-size: 0.95rem;
 }
 
 .nav-link:hover {
@@ -794,6 +795,50 @@ a:hover {
     box-shadow: var(--shadow);
 }
 
+/* Payment Section */
+.payment {
+    padding: 5rem 0;
+    background-color: var(--secondary-color);
+}
+
+.payment-methods {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
+    gap: 2rem;
+}
+
+.payment-card {
+    background-color: var(--bg-light);
+    padding: 2rem;
+    border-radius: var(--border-radius);
+    box-shadow: var(--shadow);
+    text-align: center;
+    transition: var(--transition);
+}
+
+.payment-card:hover {
+    transform: translateY(-5px);
+    box-shadow: var(--shadow-hover);
+}
+
+.payment-icon {
+    font-size: 3rem;
+    color: var(--primary-color);
+    margin-bottom: 1rem;
+}
+
+.payment-title {
+    color: var(--text-dark);
+    margin-bottom: 0.5rem;
+    font-size: 1.25rem;
+}
+
+.payment-description {
+    color: var(--text-light);
+    font-size: 0.95rem;
+    line-height: 1.6;
+}
+
 /* Contact Section */
 .contact {
     padding: 5rem 0;

index.html

@@ -69,6 +69,7 @@
                         <li><a href="#home" class="nav-link">Главная</a></li>
                         <li><a href="#services" class="nav-link">Услуги</a></li>
                         <li><a href="#about" class="nav-link">О нас</a></li>
+                        <li><a href="#payment" class="nav-link">Способ оплаты</a></li>
                         <li><a href="#contact" class="nav-link">Контакты</a></li>
                     </ul>
                 </div>
@@ -331,6 +332,45 @@
             </div>
         </section>
 
+        <!-- Payment Section -->
+        <section id="payment" class="payment">
+            <div class="container">
+                <div class="section-header">
+                    <h2 class="section-title">Способ оплаты</h2>
+                    <p class="section-subtitle">Удобные варианты оплаты медицинских услуг</p>
+                </div>
+                
+                <div class="payment-methods">
+                    <div class="payment-card">
+                        <div class="payment-icon">
+                            <i class="fas fa-money-bill"></i>
+                        </div>
+                        <h3 class="payment-title">Наличный расчет</h3>
+                        <p class="payment-description">Оплата наличными средствами в кассе медицинского центра</p>
+                    </div>
+                    
+                    <div class="payment-card">
+                        <div class="payment-icon">
+                            <i class="fas fa-credit-card"></i>
+                        </div>
+                        <h3 class="payment-title">Безналичный расчет</h3>
+                        <p class="payment-description">Оплата по банковским картам или банковским переводом</p>
+                    </div>
+                    
+                    <div class="payment-card">
+                        <div class="payment-icon">
+                            <i class="fas fa-tag"></i>
+                        </div>
+                        <h3 class="payment-title">Карты рассрочки</h3>
+                        <p class="payment-description">
+                            <strong>Халва</strong> (2 месяца)<br>
+                            <strong>Карта покупок</strong> (2 месяца)
+                        </p>
+                    </div>
+                </div>
+            </div>
+        </section>
+
         <!-- Contact Section -->
         <section id="contact" class="contact">
             <div class="container">