Лагерь: Секция Программы - горизонтальный слайдер

wp-content/themes/dekart/assets/css/camp.css

@@ -1044,6 +1044,41 @@ html {
 
 /* programs END */
 
+/* ─── Programs: horizontal scroll on mobile ─── */
+@media (max-width: 768px) {
+    .programs__scroll-x {
+        overflow-x: auto;
+        -webkit-overflow-scrolling: touch;
+        padding-bottom: 8px;
+    }
+    .programs__scroll-x::-webkit-scrollbar {
+        height: 6px;
+    }
+    .programs__scroll-x::-webkit-scrollbar-thumb {
+        background: #ccc;
+        border-radius: 8px;
+    }
+    .programs__scroll-x .programs__grid {
+        display: flex;
+        gap: 16px;
+        overflow-x: auto;
+        scroll-snap-type: x mandatory;
+        flex-wrap: nowrap;
+    }
+    .programs__scroll-x .programs__grid .programs__card {
+        flex: 0 0 300px;
+        min-width: 0;
+        scroll-snap-align: start;
+    }
+}
+
+@media (max-width: 480px) {
+    .programs__scroll-x .programs__grid .programs__card {
+        flex: 0 0 260px;
+    }
+}
+/* programs slider END */
+
 /* modal */
 .modal-programs,
 .modal-mentors {

wp-content/themes/dekart/functions.php

@@ -816,7 +816,7 @@ function enqueue_template_specific_styles() {
 			'template-specific-style',
 			get_template_directory_uri() . '/assets/css/camp.css',
 			array(),
-			'1.4'
+			'1.5'
 		);
 		wp_enqueue_script(
 			'camp-script',

wp-content/themes/dekart/page-camp.php

@@ -334,6 +334,7 @@ $metrics = [
 	<section class="section-bg programs" data-bg="mint">
 		<div class="container">
 			<h2 id="camp-programs" class="camp_title">Летние программы</h2>
+			<div class="programs__scroll-x">
 			<div class="programs__grid">
 				<?php
 				$programs = carbon_get_post_meta($post_id, 'programs');
@@ -365,6 +366,7 @@ $metrics = [
 				} ?>
 			</div>
 			</div>
+		</div>
 	</section>
 
 	<section class="section-bg bring-child" data-bg="white">