From 0af82b233d7a50fb304ceae62404daaa0d1f0a9c Mon Sep 17 00:00:00 2001
From: Dekart Deploy Bot <deploy@dekart.school>
Date: Sun, 10 May 2026 22:20:19 +0300
Subject: [PATCH] =?UTF-8?q?=D0=9B=D0=B0=D0=B3=D0=B5=D1=80=D1=8C:=20=D0=A1?=
 =?UTF-8?q?=D0=B5=D0=BA=D1=86=D0=B8=D1=8F=204?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 wp-content/themes/dekart/assets/css/camp.css | 166 ++++++++++---------
 wp-content/themes/dekart/page-camp.php       |  61 ++++---
 2 files changed, 123 insertions(+), 104 deletions(-)

diff --git a/wp-content/themes/dekart/assets/css/camp.css b/wp-content/themes/dekart/assets/css/camp.css
index 1f8f2e7..afb09bc 100644
--- a/wp-content/themes/dekart/assets/css/camp.css
+++ b/wp-content/themes/dekart/assets/css/camp.css
@@ -704,54 +704,105 @@ p {
     .suggestions::before { display: none; }
 }
 .infograph {
-    
-}
-.infograph__item {
-   width: calc(25% - 20px);
-   display: flex;
-   flex-direction: column;
-   gap: 10px;
-   align-items: center;
-   text-align: center;
+    text-align: center;
 }
 
-.infograph__item_img {
-   border-radius: 30px;
-   width: 100%;
-   max-width: 180px;
-   aspect-ratio: 1 / 1;
+.infograph__lead {
+    font-family: Inter, sans-serif;
+    font-size: 18px;
+    line-height: 1.6;
+    color: #555;
+    text-align: center;
+    max-width: 640px;
+    margin: -16px auto 56px;
+    font-weight: 400;
 }
 
-.infograph__item_title {
-   color: #9d9d9d;
-   font-size: 18px;
-   line-height: 1.25;
-   font-weight: 500;
+.infograph__grid {
+    display: grid;
+    grid-template-columns: repeat(4, 1fr);
+    gap: 24px;
 }
 
-.infograph__item_data {
-   color: #212121;
-   font-size: 30px;
-   line-height: 1.25;
-   font-weight: 600;
+.infograph__card {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 12px;
+    text-align: center;
+}
+
+.infograph__icon {
+    width: 72px;
+    height: 72px;
+    border-radius: 50%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-shrink: 0;
+}
+
+.infograph__icon img {
+    width: 36px;
+    height: 36px;
+    object-fit: contain;
+}
+
+.infograph__icon--age { background: rgba(57, 183, 234, 0.12); }
+.infograph__icon--group { background: rgba(59, 178, 115, 0.12); }
+.infograph__icon--time { background: rgba(174, 95, 205, 0.12); }
+.infograph__icon--price { background: rgba(233, 69, 99, 0.12); }
+
+.infograph__stat {
+    font-family: Montserrat, sans-serif;
+    font-size: 30px;
+    font-weight: 700;
+    line-height: 1.2;
+    color: #1c2b2d;
+    margin: 0;
+}
+
+.infograph__label {
+    font-family: Inter, sans-serif;
+    font-size: 15px;
+    font-weight: 500;
+    line-height: 1.4;
+    color: #777;
+    text-transform: uppercase;
+    letter-spacing: 0.06em;
+    margin: 0;
 }
 
 /* infograph END */
 
-.infograph-wrapper {
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: center;
-    gap: 30px;
+@media (max-width: 768px) {
+    .infograph__grid {
+        grid-template-columns: repeat(2, 1fr);
+        gap: 32px;
+    }
+    .infograph__lead {
+        font-size: 16px;
+        margin: -16px auto 40px;
+        max-width: 100%;
+    }
+    .infograph__stat {
+        font-size: 26px;
+    }
+    .infograph__label {
+        font-size: 13px;
+    }
+    .infograph__icon {
+        width: 60px;
+        height: 60px;
+    }
+    .infograph__icon img {
+        width: 30px;
+        height: 30px;
+    }
 }
 
-.infograph__item {
-    transition: transform 0.3s ease, box-shadow 0.3s ease;
-}
 
-.infograph__item:hover {
-    transform: translateY(-4px);
-}
+
 
 /* programs */
 .programs-wrapper {
@@ -1993,23 +2044,9 @@ p {
       gap: clamp(26px, 3.33vw, 40px);
    }
 
-   .infograph__item {
-      width: calc(25% - clamp(13px, 1.67vw, 20px));
-      gap: clamp(6px, .83vw, 10px);
-   }
 
-   .infograph__item_img {
-      border-radius: clamp(20px, 2.5vw, 30px);
-      width: clamp(152px, 19.5vw, 234px);
-   }
 
-   .infograph__item_title {
-      font-size: clamp(12px, 1.5vw, 18px);
-   }
 
-   .infograph__item_data {
-      font-size: clamp(20px, 2.5vw, 30px);
-   }
 
    .programs-wrapper {
       gap: clamp(20px, 2.5vw, 30px);
@@ -2489,37 +2526,6 @@ p {
         padding: 0 20px;
    }
 
-   .infograph {
-        
-   }
-
-   .infograph-wrapper {
-      margin-top: -12px;
-      gap: 16px;
-      flex-wrap: wrap;
-   }
-
-   .infograph__item {
-      width: calc(50% - 8px);
-      gap: 6px;
-   }
-
-   .infograph__item_title {
-      margin-bottom: 0;
-      font-size: 17px;
-   }
-
-   .infograph__item_img {
-      width: 100%;
-      max-width: 160px;
-      height: auto;
-   }
-
-   .infograph__item_data {
-      font-size: 28px;
-      margin-bottom: 0;
-   }
-
    .programs {
         padding-left: 0;
         padding-right: 0;
diff --git a/wp-content/themes/dekart/page-camp.php b/wp-content/themes/dekart/page-camp.php
index 09f5a12..77ee063 100644
--- a/wp-content/themes/dekart/page-camp.php
+++ b/wp-content/themes/dekart/page-camp.php
@@ -218,30 +218,43 @@ $metrics = [
 	</div>
 </section>
 	<section class="infograph">
-		<h2 class="camp_title">Цифры, которые говорят сами за себя</h2>
-		<p class="camp_text">Мы обеспечиваем безопасную и поддерживающую среду, где дети могут раскрывать свой
-		потенциал, исследовать мир и развивать дружбу под присмотром заботливых наставников.</p>
-		<div class="infograph-wrapper">
-			<div class="infograph__item">
-			   <img loading="lazy" class="infograph__item_img" width="234" height="234" src="<?php echo get_template_directory_uri(); ?>/assets/images/age.svg" alt="инфографика возраста">
-			   <p class="infograph__item_title">возраст</p>
-			   <p class="infograph__item_data">6,5−11 лет</p>
-			</div>
-			<div class="infograph__item">
-			   <img loading="lazy" class="infograph__item_img" width="234" height="234" src="<?php echo get_template_directory_uri(); ?>/assets/images/group.svg" alt="инфографика группы">
-			   <p class="infograph__item_title">каждая группа</p>
-			   <p class="infograph__item_data">до 10 детей</p>
-			</div>
-			<div class="infograph__item">
-			   <img loading="lazy" class="infograph__item_img" width="234" height="234" src="<?php echo get_template_directory_uri(); ?>/assets/images/time.svg" alt="инфографика времени">
-			   <p class="infograph__item_title">время посещения</p>
-			   <p class="infograph__item_data">на выбор</p>
-			</div>
-			<div class="infograph__item">
-			   <img loading="lazy" class="infograph__item_img" width="234" height="234" src="<?php echo get_template_directory_uri(); ?>/assets/images/price.svg"
-				  alt="инфографика стоимости">
-			   <p class="infograph__item_title">стоимость недели</p>
-			   <p class="infograph__item_data">от <?php echo esc_html( number_format($priceMin, 0, ',', ' ') ); ?> ₽</p>
+		<div class="container">
+			<h2 class="camp_title">Цифры, которые говорят сами за себя</h2>
+			<p class="infograph__lead">Мы создаём среду, где каждый ребёнок раскрывает свой потенциал</p>
+			<div class="infograph__grid">
+
+				<div class="infograph__card">
+					<div class="infograph__icon infograph__icon--age">
+						<img loading="lazy" src="<?php echo get_template_directory_uri(); ?>/assets/images/age.svg" alt="" width="48" height="48">
+					</div>
+					<p class="infograph__stat">6,5−11 лет</p>
+					<p class="infograph__label">возраст</p>
+				</div>
+
+				<div class="infograph__card">
+					<div class="infograph__icon infograph__icon--group">
+						<img loading="lazy" src="<?php echo get_template_directory_uri(); ?>/assets/images/group.svg" alt="" width="48" height="48">
+					</div>
+					<p class="infograph__stat">до 10 детей</p>
+					<p class="infograph__label">каждая группа</p>
+				</div>
+
+				<div class="infograph__card">
+					<div class="infograph__icon infograph__icon--time">
+						<img loading="lazy" src="<?php echo get_template_directory_uri(); ?>/assets/images/time.svg" alt="" width="48" height="48">
+					</div>
+					<p class="infograph__stat">на выбор</p>
+					<p class="infograph__label">время посещения</p>
+				</div>
+
+				<div class="infograph__card">
+					<div class="infograph__icon infograph__icon--price">
+						<img loading="lazy" src="<?php echo get_template_directory_uri(); ?>/assets/images/price.svg" alt="" width="48" height="48">
+					</div>
+					<p class="infograph__stat">от <?php echo esc_html( number_format($priceMin, 0, ',', ' ') ); ?> ₽</p>
+					<p class="infograph__label">стоимость недели</p>
+				</div>
+
 			</div>
 		</div>
 	</section>