From 3534008090154a924b980158cd0b988be675ec67 Mon Sep 17 00:00:00 2001
From: adlevin <adlevin@phoenixit.ru>
Date: Sat, 15 Nov 2025 13:19:46 +0300
Subject: [PATCH] =?UTF-8?q?=D0=94=D0=BE=D0=B1=D0=B0=D0=B2=D0=BB=D0=B5?=
 =?UTF-8?q?=D0=BD=D0=B8=D0=B5=20=D1=81=D0=B5=D0=BA=D1=86=D0=B8=D0=B8=20"?=
 =?UTF-8?q?=D0=A1=D0=BF=D0=BE=D1=81=D0=BE=D0=B1=20=D0=BE=D0=BF=D0=BB=D0=B0?=
 =?UTF-8?q?=D1=82=D1=8B"?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 assets/css/main.css | 47 ++++++++++++++++++++++++++++++++++++++++++++-
 index.html          | 40 ++++++++++++++++++++++++++++++++++++++
 2 files changed, 86 insertions(+), 1 deletion(-)

diff --git a/assets/css/main.css b/assets/css/main.css
index cc6257b..9c3db3e 100644
--- a/assets/css/main.css
+++ b/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;
diff --git a/index.html b/index.html
index 16105c0..4957a4c 100644
--- a/index.html
+++ b/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">