ПКШ и доугие правки (есть ошибки)

This commit is contained in:
Dekart Deploy Bot 2026-07-07 12:25:31 +00:00
parent 8afa7ed71d
commit 22124a36b1
10 changed files with 857 additions and 3459 deletions

View File

View File

@ -2,12 +2,411 @@
--main-color: #BF568E;
--main-blue: #006DB7;
--main-yellow: #FFD43E;
/* ════════════════════════════════════════════ */
/* DS-система: токены (из design.txt) */
/* ════════════════════════════════════════════ */
/* PRIMARY */
--color-primary: #7C3AED;
--color-primary-dark: #6D28D9;
--color-primary-light: #F5F3FF;
--color-primary-hover: #D6652E; /* CTA hover — оранж оттенок, как на /otzyvy/ */
/* SECONDARY */
--color-secondary: #E8753A;
--color-secondary-dark: #D6652E;
/* ПОВЕРХНОСТИ */
--color-bg: #FFFFFF;
--color-bg-alt: #F8F4F0;
--color-bg-dark: #0F172A;
/* ТЕКСТ */
--color-text: #0F172A;
--color-text-muted: #475569;
--color-text-light: #94A3B8;
--color-text-on-dark: #FFFFFF;
/* ГРАНИЦЫ */
--color-border: #E2E8F0;
--color-border-warm: #E7DECF;
/* СТАТУСЫ */
--color-success: #059669;
--color-warning: #D97706;
--color-rating: #F59E0B;
--color-accent: #FFD43E; /* акцентный цвет (телефон, бейджи) — как на /otzyvy/ */
--color-focus-ring: rgba(124,58,237,0.40);
/* ШРИФТЫ */
--font-display: "Oswald", "Arial Narrow", sans-serif;
--font-body: "Inter", "Roboto", -apple-system, sans-serif;
/* ТИПОГРАФИКА (modular scale 1.25) */
--text-h1: 48px; --text-h2: 31px; --text-h3: 25px; --text-h4: 20px;
--text-body-lg: 20px; --text-body: 16px; --text-body-sm: 14px;
--text-caption: 13px; --text-stat: 61px;
/* ОТСТУПЫ (8px-шкала) */
--space-1: 4px; --space-2: 8px; --space-3: 16px; --space-4: 24px;
--space-5: 32px; --space-6: 48px; --space-7: 64px; --space-8: 96px;
/* СКРУГЛЕНИЯ */
--radius-sm: 12px; --radius-md: 20px; --radius-lg: 24px;
--radius-pill: 100px; --radius-photo: 16px;
/* ТЕНИ */
--shadow-sm: 0 2px 12px rgba(15,23,42,0.06);
--shadow-md: 0 8px 24px rgba(15,23,42,0.10);
--shadow-lg: 0 16px 40px rgba(15,23,42,0.12);
/* АНИМАЦИИ */
--transition-fast: 200ms ease-out;
--transition-base: 300ms ease-out;
--focus-ring: 0 0 0 4px var(--color-focus-ring);
/* Z-INDEX */
--z-index-sticky: 100; --z-index-header: 200; --z-index-fixed: 300;
--z-index-overlay: 400; --z-index-modal: 500;
}
html {
height: auto;
}
/* ════════════════════════════════════════════ */
/* DS-система: контейнер */
/* ════════════════════════════════════════════ */
.ds-container {
max-width: 1280px; margin: 0 auto; padding-inline: 16px;
}
@media (min-width: 768px) { .ds-container { padding-inline: 24px; } }
@media (min-width: 1024px) { .ds-container { padding-inline: 32px; } }
.ds-container--narrow { max-width: 960px; }
/* ════════════════════════════════════════════ */
/* DS-система: breadcrumbs */
/* ════════════════════════════════════════════ */
.ds-breadcrumbs {
display: flex; flex-wrap: wrap; gap: var(--space-1);
font-size: var(--text-body-sm); color: var(--color-text-muted);
padding-block: var(--space-3); max-width: 1280px; margin: 0 auto;
padding-inline: 16px;
}
.ds-breadcrumbs ol {
display: flex; flex-wrap: wrap; gap: var(--space-1); list-style: none;
padding: 0; margin: 0;
}
.ds-breadcrumbs a { color: var(--color-text-muted); text-decoration: none; }
.ds-breadcrumbs a:hover { color: var(--color-primary); }
.ds-breadcrumbs .last_item { color: var(--color-text); font-weight: 600; }
.ds-breadcrumbs li:not(:last-child)::after {
content: "/"; color: var(--color-text-light); margin-left: var(--space-1);
}
@media (min-width: 768px) { .ds-breadcrumbs { padding-inline: 24px; } }
@media (min-width: 1024px) { .ds-breadcrumbs { padding-inline: 32px; } }
/* ════════════════════════════════════════════ */
/* DS-система: Hero (тёмный + радиальные град.)*/
/* Эталон — /otzyvy/ (reviews-hero) */
/* ════════════════════════════════════════════ */
.ds-hero {
position: relative;
padding: 60px 0;
overflow: hidden;
background: var(--color-bg-dark);
background-image:
radial-gradient(ellipse 80% 70% at 20% 40%, rgba(232,117,58,0.08) 0%, transparent 70%),
radial-gradient(ellipse 60% 60% at 80% 60%, rgba(59,178,160,0.06) 0%, transparent 70%);
}
/* Decorative accent line */
.ds-hero::after {
content: ''; position: absolute; bottom: 0; left: 0; right: 0;
height: 6px;
background: linear-gradient(90deg, var(--color-primary) 0%, var(--color-secondary) 50%, var(--color-primary) 100%);
opacity: 0.5;
}
/* Accent corner */
.ds-hero::before {
content: ''; position: absolute; top: -120px; right: -120px;
width: 360px; height: 360px; border-radius: 50%;
background: radial-gradient(circle, rgba(232,117,58,0.06) 0%, transparent 70%);
pointer-events: none;
}
.ds-hero__inner {
display: flex; flex-direction: row; gap: 40px;
align-items: center;
position: relative; z-index: 1;
}
/* ---- Content ---- */
.ds-hero__content {
flex: 1; max-width: 600px; min-width: 0;
}
.ds-hero__address {
display: inline-flex; align-items: center; gap: var(--space-2);
padding: 6px 16px; background: rgba(255,255,255,0.12);
color: rgba(255,255,255,0.9); border-radius: var(--radius-pill);
font-size: var(--text-body-sm); font-weight: 600; width: fit-content;
margin-bottom: 14px;
}
.ds-hero__address svg { flex-shrink: 0; width: 16px; height: 16px; }
.ds-hero__h1 {
font-family: var(--font-display);
font-size: clamp(36px, 4.2vw, 52px);
font-weight: 500;
line-height: 1.12;
margin-bottom: 14px;
color: #fff;
}
.ds-hero__subtitle {
font-size: 18px; line-height: 1.55;
color: rgba(255,255,255,0.72); margin-bottom: 28px;
max-width: 500px;
}
/* Metrics — стиль «glass card» как на /otzyvy/ */
.ds-hero__metrics {
display: flex; gap: 16px; margin-bottom: 32px;
flex-wrap: nowrap;
}
.ds-hero__metric {
background: rgba(255,255,255,0.08);
backdrop-filter: blur(4px);
-webkit-backdrop-filter: blur(4px);
border: 1px solid rgba(255,255,255,0.12);
border-radius: 14px;
padding: 14px 22px;
text-align: center;
min-width: 110px;
transition: background var(--transition-fast), transform var(--transition-fast);
}
.ds-hero__metric:hover {
background: rgba(255,255,255,0.13);
transform: translateY(-2px);
}
.ds-hero__metric-number {
font-family: var(--font-display);
font-size: clamp(28px, 3vw, 34px);
font-weight: 500;
color: var(--color-primary);
display: block;
line-height: 1.1;
margin-bottom: 2px;
}
.ds-hero__metric-label {
font-size: 13px;
color: rgba(255,255,255,0.7);
text-transform: uppercase;
letter-spacing: 0.04em;
}
.ds-hero__rating-badge {
display: flex; align-items: center; gap: 10px; margin-top: 8px; flex-wrap: wrap;
}
.ds-hero__rating-stars { color: var(--color-rating); font-size: 18px; letter-spacing: 2px; }
.ds-hero__rating-text {
font-size: 13px; color: rgba(255,255,255,0.65);
}
/* CTA — цвет primary (фиолетовый) как на /otzyvy/ */
.ds-hero__cta-btn {
display: inline-flex; align-items: center; gap: 8px;
font-family: var(--font-body); font-weight: 600;
background: var(--color-primary); color: #fff;
border: none; border-radius: 12px; cursor: pointer;
text-decoration: none; padding: 16px 40px;
font-size: 17px; width: fit-content;
box-shadow: 0 4px 16px rgba(232,117,58,0.35);
transition: background var(--transition-fast), transform var(--transition-fast),
box-shadow var(--transition-fast);
}
.ds-hero__cta-btn:hover {
background: var(--color-primary-hover);
transform: translateY(-2px);
box-shadow: 0 8px 24px rgba(232,117,58,0.45);
}
.ds-hero__cta-btn:active { transform: translateY(0); }
.ds-hero__cta-btn:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.ds-hero__phone {
margin-top: 10px; font-size: 13px; color: rgba(255,255,255,0.55);
}
.ds-hero__phone a {
color: var(--color-accent); font-weight: 500; text-decoration: underline;
white-space: nowrap;
}
/* ---- Visual ---- */
.ds-hero__visual {
flex-shrink: 0; position: relative;
width: 380px; height: 420px;
margin-left: auto; margin-right: 20px;
display: flex; align-items: center; justify-content: center;
}
.ds-hero__visual-glow {
position: absolute;
width: 420px; height: 420px;
border-radius: 50%;
background: radial-gradient(circle, rgba(232,117,58,0.12) 0%, rgba(59,178,160,0.06) 30%, transparent 65%);
top: 50%; left: 50%;
transform: translate(-50%, -50%);
pointer-events: none;
}
.ds-hero__photo-wrap { position: relative; z-index: 2; display:flex; align-items:center; justify-content:center; }
.ds-hero__photo-frame {
position: relative; width: 320px; height: 320px; border-radius: 50%; overflow: hidden;
box-shadow:
0 20px 60px rgba(232,117,58,0.15),
0 8px 24px rgba(0,0,0,0.2),
inset 0 0 0 4px rgba(255,255,255,0.6);
border: 6px solid rgba(255,255,255,0.8);
animation: dsPhotoFloat 6s ease-in-out infinite;
}
.ds-hero__photo { width: 100%; height: 100%; object-fit: cover; display: block; }
.ds-hero__photo-ring {
position: absolute; width: 360px; height: 360px; border-radius: 50%;
border: 2px solid rgba(232,117,58,0.12);
top: 50%; left: 50%; transform: translate(-50%, -50%);
pointer-events: none;
animation: dsRingPulse 4s ease-in-out infinite;
}
/* Floating badges — цвета как на /otzyvy/ */
.ds-hero__float {
position: absolute; z-index: 3;
display: flex; align-items: center; gap: var(--space-1);
padding: 10px 20px;
border-radius: var(--radius-pill);
font-size: var(--text-body-sm); font-weight: 600; color: #fff;
white-space: nowrap; backdrop-filter: blur(8px);
animation: dsFloat 5s ease-in-out infinite;
}
.ds-hero__float-icon { font-size: 18px; line-height: 1; }
.ds-hero__float--1 {
top: 4%; right: -8px; animation-delay: 0s;
background: linear-gradient(135deg, rgba(255,255,255,0.15), rgba(255,255,255,0.05));
color: rgba(255,255,255,0.92);
border: 1px solid rgba(255,255,255,0.12);
}
.ds-hero__float--2 {
bottom: 22%; left: -24px; animation-delay: 1.2s;
background: linear-gradient(135deg, rgba(232,117,58,0.20), rgba(232,117,58,0.08));
color: #FFD4B8;
border: 1px solid rgba(232,117,58,0.15);
}
.ds-hero__float--3 {
bottom: 4%; right: 6%; animation-delay: 2.4s;
background: linear-gradient(135deg, rgba(59,178,160,0.20), rgba(59,178,160,0.08));
color: #B8E6DF;
border: 1px solid rgba(59,178,160,0.15);
}
.ds-hero__float--4 {
top: 48%; left: -28px; animation-delay: 3.5s;
background: linear-gradient(135deg, rgba(255,215,0,0.20), rgba(255,183,77,0.08));
color: #FFE0A0;
border: 1px solid rgba(255,215,0,0.15);
font-size: 12px; padding: 8px 16px;
}
/* Decorative shapes */
.ds-hero__deco {
position: absolute; border-radius: 50%; pointer-events: none; z-index: 1;
}
.ds-hero__deco--1 {
width: 40px; height: 40px; background: rgba(232,117,58,0.12);
top: 12%; left: 2%;
animation: dsDecoFloat 6s ease-in-out infinite;
}
.ds-hero__deco--2 {
width: 24px; height: 24px; background: rgba(59,178,160,0.14);
bottom: 40%; right: -6px;
animation: dsDecoFloat 8s ease-in-out infinite 1s;
}
.ds-hero__deco--3 {
width: 16px; height: 16px; background: rgba(232,117,58,0.16);
top: 48%; left: -8px;
animation: dsDecoFloat 7s ease-in-out infinite 2s;
}
.ds-hero__deco--4 {
width: 10px; height: 10px; background: rgba(59,178,160,0.20);
bottom: 15%; right: -4px;
animation: dsDecoFloat 5s ease-in-out infinite 3s;
}
/* Sparkle particles */
.ds-hero__sparkles {
position: absolute; inset: 0; pointer-events: none; z-index: 1;
}
.ds-hero__sparkle {
position: absolute; border-radius: 50%;
animation: dsSparkleFloat 6s ease-in-out infinite;
background: rgba(255,255,255,0.3);
}
.ds-hero__sparkles .ds-hero__sparkle:nth-child(1) { top: 15%; left: 10%; width: 4px; height: 4px; animation-delay: 0s; background: #E8753A; box-shadow: 0 0 8px rgba(232,117,58,0.4); }
.ds-hero__sparkles .ds-hero__sparkle:nth-child(2) { top: 30%; right: 18%; width: 6px; height: 6px; animation-delay: 1.2s; }
.ds-hero__sparkles .ds-hero__sparkle:nth-child(3) { bottom: 35%; left: 5%; width: 3px; height: 3px; animation-delay: 2s; }
.ds-hero__sparkles .ds-hero__sparkle:nth-child(4) { top: 55%; right: 8%; width: 5px; height: 5px; animation-delay: 0.8s; }
.ds-hero__sparkles .ds-hero__sparkle:nth-child(5) { bottom: 12%; left: 20%; width: 4px; height: 4px; animation-delay: 3s; }
/* ─── Hero Animations ─── */
@keyframes dsPhotoFloat {
0%, 100% { transform: translateY(0); }
50% { transform: translateY(-8px); }
}
@keyframes dsRingPulse {
0%, 100% { transform: translate(-50%, -50%) scale(1); opacity: 1; }
50% { transform: translate(-50%, -50%) scale(1.04); opacity: 0.6; }
}
@keyframes dsFloat {
0%, 100% { transform: translateY(0); }
50% { transform: translateY(-10px); }
}
@keyframes dsSparkleFloat {
0%, 100% { transform: translateY(0) scale(1); opacity: 0.4; }
50% { transform: translateY(-20px) scale(1.4); opacity: 0.9; }
}
@keyframes dsDecoFloat {
0%, 100% { transform: translateY(0) scale(1); }
50% { transform: translateY(-12px) scale(1.1); }
}
/* Hero адаптив — идентично /otzyvy/ */
@media (max-width: 860px) {
.ds-hero { padding: 40px 0; }
.ds-hero__inner { flex-direction: column; }
.ds-hero__visual {
flex: none;
width: 100%;
max-width: 360px;
height: auto;
min-height: 320px;
margin-left: auto;
margin-right: auto;
}
.ds-hero__photo-frame { width: 260px; height: 260px; border-width: 5px; }
.ds-hero__photo-ring { width: 300px; height: 300px; }
.ds-hero__float--1 { top: 4%; right: 0; font-size: 12px; padding: 6px 14px; }
.ds-hero__float--2 { bottom: 18%; left: -12px; font-size: 12px; padding: 6px 14px; }
.ds-hero__float--3 { bottom: 2%; right: 5%; font-size: 12px; padding: 6px 14px; }
.ds-hero__float--4 { display: none; }
.ds-hero__h1 { font-size: 32px; }
}
@media (max-width: 768px) {
.ds-hero__visual { display: none; }
.ds-hero__content { max-width: none; }
.ds-hero__metrics { flex-wrap: wrap; gap: 10px; }
.ds-hero__metric {
flex: 0 0 calc(50% - 5px);
max-width: calc(50% - 5px);
min-width: 0;
padding: 12px 10px;
}
.ds-hero__metric-number { font-size: clamp(22px, 6vw, 28px); }
.ds-hero__metric-label { font-size: 10px; overflow-wrap: break-word; word-break: break-word; hyphens: auto; }
.ds-hero__cta-btn { width: 100%; justify-content: center; }
}
@media (max-width: 480px) {
.ds-hero__h1 { font-size: 26px; }
}
@media (max-width: 375px) {
.ds-hero__h1 { font-size: 22px; }
.ds-hero__metrics { gap: 6px; }
.ds-hero__metric { padding: 10px 8px; }
.ds-hero__metric-number { font-size: 20px; }
.ds-hero__metric-label { font-size: 9px; overflow-wrap: break-word; word-break: break-word; hyphens: auto; }
.ds-hero__cta-btn { padding: 14px 20px; font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) {
.ds-hero__cta-btn,
.ds-hero__photo-frame,
.ds-hero__photo-ring,
.ds-hero__float,
.ds-hero__sparkles .ds-hero__sparkle,
.ds-hero__deco {
transition: none !important;
transform: none !important;
animation: none !important;
}
}
body {
color: #000;
font-family: Roboto;

File diff suppressed because it is too large Load Diff

View File

@ -25,7 +25,8 @@
--color-bg: #fff;
--color-bg-warm: #F8F4EF;
--color-bg-alt: #EEF3EE;
--bg-hero: var(--color-bg-warm);
--color-bg-dark: #0F172A;
--bg-hero: var(--color-bg-dark);
--bg-white: var(--color-bg);
--bg-mint: var(--color-bg-alt);
--accent: #7C3AED;
@ -39,7 +40,7 @@
position: relative;
padding: 60px 0;
overflow: hidden;
background: var(--color-text);
background: var(--color-bg-dark);
background-image:
radial-gradient(ellipse 80% 70% at 20% 40%, rgba(232, 117, 58, 0.08) 0%, transparent 70%),
radial-gradient(ellipse 60% 60% at 80% 60%, rgba(59, 178, 160, 0.06) 0%, transparent 70%);

View File

@ -58,31 +58,19 @@ document.addEventListener("click", function (event) {
if (target.classList.contains("btn-write") || target.closest('.btn-write-camp')) {
var campBtn = target.closest('.btn-write-camp');
if (campBtn && campBtn.tagName === 'A') event.preventDefault();
modalRequestForm.style="";
if (!modalRequestForm) return;
modalRequestForm.classList.add('is-open');
document.querySelector('html').style = "overflow: hidden;";
// Динамическая загрузка Bitrix24 (иначе не инициализируется в скрытом контейнере)
var container = modalRequestForm.querySelector('.b24-form-container');
if (container && !container.querySelector('.b24-form')) {
var fForm = modalRequestForm.dataset.b24Form;
var fLoader = modalRequestForm.dataset.b24Loader;
if (fForm && fLoader) {
var s = document.createElement('script');
s.setAttribute('data-b24-form', fForm);
s.setAttribute('data-skip-moving', 'true');
s.text = "(function(w,d,u){var s=d.createElement('script');s.async=true;s.src=u+'?'+(Date.now()/180000|0);var h=d.getElementsByTagName('script')[0];h.parentNode.insertBefore(s,h);})(window,document,'" + fLoader + "');";
container.appendChild(s);
}
}
return;
}
if (target.classList.contains("btn-close-request-form") || target.classList.contains("btn-close-request-form-img")) {
modalRequestForm.style="display: none;";
modalRequestForm.classList.remove('is-open');
document.querySelector('html').style = "";
return;
}
// Клик по фону (затемнению) — закрыть модалку
if (target === modalRequestForm) {
modalRequestForm.style="display: none;";
modalRequestForm.classList.remove('is-open');
document.querySelector('html').style = "";
return;
}
@ -288,39 +276,7 @@ document.querySelectorAll('.header-menu').forEach(item => {
}
})();
/* ── .open-bitrix-form → opens modal form ── */
document.querySelectorAll('.open-bitrix-form').forEach(btn => {
btn.addEventListener('click', function(e) {
const modal = document.querySelector('.modal-request-form');
if (modal) {
modal.style = "";
// Динамическая загрузка Bitrix24
var container = modal.querySelector('.b24-form-container');
if (container && !container.querySelector('.b24-form')) {
var fForm = modal.dataset.b24Form;
var fLoader = modal.dataset.b24Loader;
if (fForm && fLoader) {
var s = document.createElement('script');
s.setAttribute('data-b24-form', fForm);
s.setAttribute('data-skip-moving', 'true');
s.text = "(function(w,d,u){var s=d.createElement('script');s.async=true;s.src=u+'?'+(Date.now()/180000|0);var h=d.getElementsByTagName('script')[0];h.parentNode.insertBefore(s,h);})(window,document,'" + fLoader + "');";
container.appendChild(s);
}
}
}
});
});
// Закрытие модалки по Escape
document.addEventListener("keydown", function(e) {
if (e.key === "Escape") {
const modal = document.querySelector('.modal-request-form');
if (modal && modal.style.display !== "none") {
modal.style.display = "none";
document.querySelector('html').style = "";
}
}
});
/* ── FAQ Accordion (mystyle-accordion) ── */
document.querySelectorAll('.mystyle-accordion-trigger').forEach(trigger => {

View File

@ -68,22 +68,27 @@
?>
<?php
// === Bitrix24: парсинг скрипта из настроек филиала ===
// Приоритет: branch_button_script (Settings API) > post_meta > theme option
// Приоритет: branch_button_script (Settings API) > theme option
$b24_raw = get_option( 'branch_button_script', '' );
// Резерв: для страниц с post_meta или theme option (если филиал не настроен)
if ( empty( $b24_raw ) && is_singular() ) {
$b24_raw = carbon_get_post_meta( get_the_ID(), 'pksh_bitrix_script' );
}
if ( empty( $b24_raw ) ) {
$b24_raw = carbon_get_theme_option( 'site_bitrix_script' );
}
$b24_params = dekart_parse_b24_script( $b24_raw );
if ( ! empty( $b24_raw ) ) {
$_b24_form = '';
$_b24_url = '';
if ( preg_match( '/data-b24-form="([^"]+)"/', $b24_raw, $_m ) ) {
$_b24_form = $_m[1];
}
if ( preg_match( "/\\(window,document,'([^']+)'\\)/", $b24_raw, $_m ) ) {
$_b24_url = $_m[1];
}
}
?>
<?php if ( ! empty( $b24_raw ) && ! empty( $_b24_form ) && ! empty( $_b24_url ) ) : ?>
<div class="modal-request-form" style="display:none;" aria-hidden="true" role="dialog" aria-label="Форма записи"
data-b24-form="<?php echo esc_attr( $b24_params['form'] ); ?>"
data-b24-loader="<?php echo esc_attr( $b24_params['loader'] ); ?>">
data-b24-form="<?php echo esc_attr( $_b24_form ); ?>"
data-b24-loader="<?php echo esc_attr( $_b24_url ); ?>">
<div class="form-wrapper">
<button class="btn-close-request-form" aria-label="Закрыть форму">
<img class="btn-close-request-form-img"
@ -95,23 +100,53 @@ $b24_params = dekart_parse_b24_script( $b24_raw );
</div>
</div>
<!-- Sticky CTA Mobile -->
<div class="sticky-cta-mobile" aria-hidden="true">
<button class="sticky-cta-btn btn-write" aria-label="Записаться на бесплатное пробное">
Записаться на бесплатное
</button>
</div>
<script>
document.addEventListener('DOMContentLoaded', function() {
var modal = document.querySelector('.modal-request-form');
if (!modal) return;
var b24Loaded = false;
var closeBtn = modal.querySelector('.btn-close-request-form');
<!-- Sticky CTA Desktop (появляется при скролле) -->
<div class="sticky-cta-desktop" aria-hidden="true">
<div class="sticky-cta-desktop__inner">
<div class="sticky-cta-desktop__info">
<span class="sticky-cta-desktop__badge">🎯 Подготовка к школе</span>
<span class="sticky-cta-desktop__text">ул. Комсомольская, 11 первое занятие <strong>бесплатно</strong></span>
</div>
<button class="sticky-cta-desktop__btn btn-write">Записаться на бесплатное пробное</button>
</div>
</div>
// Открытие — делегирование на body
document.body.addEventListener('click', function(e) {
var btn = e.target.closest('.btn-write, .open-bitrix-form, .ds-hero__cta-btn, .sticky-cta-mobile__btn, .sticky-cta-desktop__btn');
if (!btn) return;
e.preventDefault();
modal.style.display = '';
document.documentElement.style.overflow = 'hidden';
// Ленивая загрузка B24 при первом клике (в видимый контейнер)
if (!b24Loaded) {
b24Loaded = true;
var container = modal.querySelector('.b24-form-container');
var fForm = modal.dataset.b24Form;
var fLoader = modal.dataset.b24Loader;
if (fForm && fLoader && container) {
var s = document.createElement('script');
s.setAttribute('data-b24-form', fForm);
s.setAttribute('data-skip-moving', 'true');
s.text = "(function(w,d,u){var s=d.createElement('script');s.async=true;s.src=u+'?'+(Date.now()/180000|0);var h=d.getElementsByTagName('script')[0];h.parentNode.insertBefore(s,h);})(window,document,'" + fLoader + "');";
container.appendChild(s);
}
}
});
// Закрытие
if (closeBtn) {
closeBtn.addEventListener('click', function() {
modal.style.display = 'none';
document.documentElement.style.overflow = '';
});
}
modal.addEventListener('click', function(e) {
if (e.target === modal) {
modal.style.display = 'none';
document.documentElement.style.overflow = '';
}
});
});
</script>
<?php endif; ?>
</body>
</html>

View File

@ -567,11 +567,7 @@ function add_carbon() {
->set_help_text( 'Например: выпускников в топ-школах' ),
)),
))
->add_tab('Битрикс24', array(
Field::make( 'textarea', 'pksh_bitrix_script', 'Скрипт формы Битрикс24' )
->set_help_text( 'Вставьте полный JS-код интеграции с CRM-формой Битрикс24. Выводится в блоке Final CTA на странице подготовки к школе.' ),
))
->add_tab('⭐ Отзывы', array(
->add_tab('⭐ Отзывы', array(
Field::make( 'html', 'pksh_reviews_tab_desc', '' )
->set_html( '<p style="color: #64748b; font-size: 13px; margin: 0 0 12px;">Секция: <strong>.pksh-reviews</strong>. Отзывы родителей на странице подготовки к школе.</p>' ),
Field::make( 'complex', 'pksh_reviews_list', 'Отзывы' )
@ -1624,7 +1620,7 @@ function dekart_security_headers(): void {
header( 'X-Frame-Options: SAMEORIGIN' );
header( 'Referrer-Policy: strict-origin-when-cross-origin' );
// Content-Security-Policy — базовый, без блокировки легаси-скриптов
header( "Content-Security-Policy: default-src 'self'; script-src 'self' 'unsafe-inline' 'unsafe-eval' https://cdn-ru.bitrix24.ru https://api-maps.yandex.ru https://cdn.jsdelivr.net https://www.google.com https://www.gstatic.com https://www.googletagmanager.com https://mc.yandex.ru; style-src 'self' 'unsafe-inline' https://fonts.googleapis.com https://cdn.jsdelivr.net; img-src 'self' data: https: blob:; font-src 'self' data: https://fonts.gstatic.com; frame-src 'self' https://cdn-ru.bitrix24.ru https://www.google.com; connect-src 'self' https://api-maps.yandex.ru https://cdn-ru.bitrix24.ru https://mc.yandex.ru; object-src 'none'; base-uri 'self'; form-action 'self';" );
header( "Content-Security-Policy: default-src 'self'; script-src 'self' 'unsafe-inline' 'unsafe-eval' https://cdn-ru.bitrix24.ru https://alee.bitrix24.ru https://api-maps.yandex.ru https://cdn.jsdelivr.net https://www.google.com https://www.gstatic.com https://www.googletagmanager.com https://mc.yandex.ru; style-src 'self' 'unsafe-inline' https://fonts.googleapis.com https://cdn.jsdelivr.net https://alee.bitrix24.ru; img-src 'self' data: https: blob:; font-src 'self' data: https://fonts.gstatic.com; frame-src 'self' https://cdn-ru.bitrix24.ru https://alee.bitrix24.ru https://www.google.com; connect-src 'self' https://api-maps.yandex.ru https://cdn-ru.bitrix24.ru https://alee.bitrix24.ru https://mc.yandex.ru; object-src 'none'; base-uri 'self'; form-action 'self' https://alee.bitrix24.ru;" );
}
}
@ -2111,6 +2107,8 @@ require_once __DIR__ . '/inc/schema.php';
* (настройки темы уже есть используем статические)
*/
// ─────────────────────────────────────────────────────────────
// ACF: Отзывы (Лагерь) — группа полей
// ─────────────────────────────────────────────────────────────

View File

@ -9,6 +9,7 @@
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="preconnect" href="https://cdn-ru.bitrix24.ru">
<link rel="preconnect" href="https://alee.bitrix24.ru" crossorigin>
<link rel="preconnect" href="https://cdn.jsdelivr.net">
<link rel="dns-prefetch" href="//api-maps.yandex.ru">
<link rel="dns-prefetch" href="//mod.gudok.tel">

View File

@ -22,7 +22,157 @@ $opt_social_raw = get_option( 'branch_social' ) ?: carbon_get_post_meta( $post_
<main class="page page-pksh">
<?php get_template_part('template-parts/block-banner'); ?>
<!-- ════════════════════════════════════════════ -->
<!-- Breadcrumbs (outside hero) -->
<!-- ════════════════════════════════════════════ -->
<?php
$branch_city_prep = get_option( 'branch_city_prep', 'в Щёлково' );
$branch_city_clean = str_replace( array( 'в ', 'В ' ), '', $branch_city_prep );
$banner_img_id = carbon_get_post_meta( $post_id, 'banner_image' );
$h1_hero = carbon_get_post_meta( $post_id, 'banner_h1' );
$subtitle_hero = carbon_get_post_meta( $post_id, 'banner_subtitle' );
$hero_metrics = carbon_get_post_meta( $post_id, 'pksh_social_counters' );
$ext_review_count = get_option( 'branch_ext_review_count', '247' );
$hero_phone_clean = preg_replace( '/[^0-9+]/', '', $opt_phone );
?>
<!-- ════════════════════════════════════════════ -->
<!-- Breadcrumbs -->
<!-- ════════════════════════════════════════════ -->
<div class="container breadcrumbs-wrapper">
<ul class="breadcrumbs" itemscope itemtype="https://schema.org/BreadcrumbList" role="navigation" aria-label="Breadcrumb">
<li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
<a href="<?php echo esc_url( home_url( '/' ) ); ?>" itemprop="item" title="Главная">
<span itemprop="name">Главная</span>
</a>
<meta itemprop="position" content="1">
</li>
<li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
<span class="last_item" itemprop="name">Подготовка к школе</span>
<meta itemprop="position" content="2">
</li>
</ul>
</div>
<!-- ════════════════════════════════════════════ -->
<!-- Hero (ds-hero: dark bg, white grid) -->
<!-- ════════════════════════════════════════════ -->
<section class="section-bg ds-hero" data-bg="hero" id="ds-hero" aria-label="Подготовка к школе">
<div class="ds-container">
<div class="ds-hero__inner">
<!-- Left: Content -->
<div class="ds-hero__content">
<!-- Address pill -->
<div class="ds-hero__address">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/>
<circle cx="12" cy="10" r="3"/>
</svg>
<span><?php echo esc_html( $opt_address ?: 'ул. Талсинская, 24' ); ?> — центр <?php echo esc_html( $branch_city_clean ?: 'Щёлково' ); ?></span>
</div>
<!-- H1 -->
<h1 class="ds-hero__h1"><?php echo esc_html( $h1_hero ?: 'Подготовка к школе в Щёлково' ); ?></h1>
<!-- Subtitle -->
<?php if ( '' !== $subtitle_hero ) : ?>
<p class="ds-hero__subtitle"><?php echo esc_html( $subtitle_hero ); ?></p>
<?php endif; ?>
<!-- Metrics (из pksh_social_counters) -->
<?php if ( ! empty( $hero_metrics ) && is_array( $hero_metrics ) ) : ?>
<div class="ds-hero__metrics">
<?php foreach ( $hero_metrics as $metric ) :
$num = $metric['counter_number'] ?? '';
$lbl = $metric['counter_label'] ?? '';
if ( empty( $num ) ) continue;
?>
<div class="ds-hero__metric reveal">
<span class="ds-hero__metric-number"><?php echo esc_html( $num ); ?></span>
<span class="ds-hero__metric-label"><?php echo esc_html( $lbl ); ?></span>
</div>
<?php endforeach; ?>
</div>
<?php endif; ?>
<!-- Rating badge -->
<div class="ds-hero__rating-badge">
<span class="ds-hero__rating-stars" aria-hidden="true">★★★★★</span>
<span class="ds-hero__rating-text">4.9 из 5 на основе <?php echo esc_html( $ext_review_count ); ?> отзывов на внешних площадках</span>
</div>
<!-- CTA -->
<button class="ds-hero__cta-btn open-bitrix-form">Записаться на бесплатное пробное</button>
<!-- Phone -->
<?php if ( $opt_phone ) : ?>
<p class="ds-hero__phone">Или позвоните: <a href="tel:<?php echo esc_attr( $hero_phone_clean ); ?>" aria-label="Позвонить в школу Декарт: <?php echo esc_attr( $opt_phone ); ?>"><?php echo esc_html( $opt_phone ); ?></a></p>
<?php endif; ?>
</div>
<!-- Right: Visual -->
<div class="ds-hero__visual">
<div class="ds-hero__visual-glow" aria-hidden="true"></div>
<div class="ds-hero__photo-wrap">
<div class="ds-hero__photo-frame">
<?php if ( $banner_img_id ) : ?>
<?php echo wp_get_attachment_image( $banner_img_id, 'full', false, array(
'class' => 'ds-hero__photo',
'loading' => 'eager',
'decoding' => 'async',
'alt' => 'Подготовка к школе в Щёлково — занятия для детей 57 лет',
) ); ?>
<?php else : ?>
<img class="ds-hero__photo" loading="eager" decoding="async"
src="<?php echo esc_url( get_template_directory_uri() . '/assets/images/girl_and_a_boy.webp' ); ?>"
alt="Подготовка к школе в Щёлково — занятия для детей 57 лет"
width="689" height="689">
<?php endif; ?>
</div>
<div class="ds-hero__photo-ring" aria-hidden="true"></div>
</div>
<!-- Floating badges -->
<div class="ds-hero__float ds-hero__float--1">
<span class="ds-hero__float-icon">👩‍🏫</span>
<span>Педагоги с опытом 15+ лет</span>
</div>
<div class="ds-hero__float ds-hero__float--2">
<span class="ds-hero__float-icon">🎮</span>
<span>Игровая методика</span>
</div>
<div class="ds-hero__float ds-hero__float--3">
<span class="ds-hero__float-icon">📚</span>
<span>Авторская программа</span>
</div>
<div class="ds-hero__float ds-hero__float--4">
<span class="ds-hero__float-icon">🌟</span>
<span>Рейтинг 4.8</span>
</div>
<!-- Decorative shapes -->
<div class="ds-hero__deco ds-hero__deco--1" aria-hidden="true"></div>
<div class="ds-hero__deco ds-hero__deco--2" aria-hidden="true"></div>
<div class="ds-hero__deco ds-hero__deco--3" aria-hidden="true"></div>
<div class="ds-hero__deco ds-hero__deco--4" aria-hidden="true"></div>
<!-- Sparkle particles (обёртка для nth-child) -->
<div class="ds-hero__sparkles" aria-hidden="true">
<div class="ds-hero__sparkle"></div>
<div class="ds-hero__sparkle"></div>
<div class="ds-hero__sparkle"></div>
<div class="ds-hero__sparkle"></div>
<div class="ds-hero__sparkle"></div>
</div>
</div>
</div>
</div>
</section>
<!-- ════════════════════════════════════════════ -->
<!-- Social Proof Confidence counters (4 cards) -->
@ -99,11 +249,8 @@ $opt_social_raw = get_option( 'branch_social' ) ?: carbon_get_post_meta( $post_
<span class="bento-label">Бесплатно</span>
<h2 class="bento-h2">Скачайте чек-лист готовности к школе</h2>
<p class="bento-p">10 признаков, что ваш ребёнок готов к 1-му классу. Проверьте за 5 минут и узнайте, на какие навыки обратить внимание.</p>
<div class="micro-commit__form">
<input type="text" class="micro-commit__input" placeholder="Ваше имя" aria-label="Ваше имя" required>
<input type="tel" class="micro-commit__input" placeholder="Ваш телефон" aria-label="Ваш телефон" required>
<div class="micro-commit__action">
<button class="btn-primary btn-write micro-commit__btn">Получить чек-лист бесплатно</button>
<p class="micro-commit__disclaimer">Отправляя заявку, вы соглашаетесь на обработку персональных данных</p>
</div>
</div>
<div class="micro-commit__visual">
@ -139,7 +286,7 @@ $opt_social_raw = get_option( 'branch_social' ) ?: carbon_get_post_meta( $post_
</section>
<!-- ════════════════════════════════════════════ -->
<!-- Guarantee Hero (Risk Reversal Showcase) -->
<!-- Guarantee Hero + Navigation -->
<!-- ════════════════════════════════════════════ -->
<section class="bento pksh-section pksh-section--alt" aria-label="Гарантия">
<div class="bento__full">
@ -150,23 +297,18 @@ $opt_social_raw = get_option( 'branch_social' ) ?: carbon_get_post_meta( $post_
<div class="guarantee-hero__content">
<h2 class="bento-h2">Ваш ребёнок начнёт читать через 3 недели</h2>
<p class="guarantee-hero__text">Или <strong>мы вернём деньги</strong> и продолжим обучение бесплатно, пока не дойдём до результата. Мы частная школа <strong>с гослицензией</strong>, а не кружок. Отвечаем за результат.</p>
<button class="btn-primary btn-write guarantee-hero__btn">Записаться на бесплатное пробное</button>
</div>
<nav class="pksh-anchor-nav" aria-label="Навигация по странице">
<a href="#how-it-works" class="pksh-anchor-link">Как проходят занятия</a>
<a href="#results" class="pksh-anchor-link">Результаты</a>
<a href="#programs" class="pksh-anchor-link">Программы</a>
<a href="#teachers" class="pksh-anchor-link">Преподаватели</a>
<a href="#faq" class="pksh-anchor-link">Вопросы</a>
</nav>
</div>
</div>
</section>
<!-- ════════════════════════════════════════════ -->
<!-- Anchor Navigation jump links -->
<!-- ════════════════════════════════════════════ -->
<nav class="pksh-anchor-nav" aria-label="Навигация по странице">
<a href="#how-it-works" class="pksh-anchor-link">Как проходят занятия</a>
<a href="#results" class="pksh-anchor-link">Результаты</a>
<a href="#programs" class="pksh-anchor-link">Программы</a>
<a href="#teachers" class="pksh-anchor-link">Преподаватели</a>
<a href="#faq" class="pksh-anchor-link">Вопросы</a>
</nav>
<!-- ════════════════════════════════════════════ -->
<!-- Bento Row 1: How it works + Why us -->
<!-- ════════════════════════════════════════════ -->
@ -177,21 +319,27 @@ $opt_social_raw = get_option( 'branch_social' ) ?: carbon_get_post_meta( $post_
<p class="bento-p">Никаких скучных прописей. Каждое занятие построено так, что ребёнок <strong>сам хочет</strong> вернуться.</p>
<div class="steps-3">
<div class="step">
<span class="step__num">1</span>
<div class="step__icon">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" stroke="currentColor" stroke-width="2" stroke-linecap="round"/></svg>
</div>
<div>
<strong>Вход в тему</strong>
<span>Короткая история или загадка включаем интерес</span>
</div>
</div>
<div class="step">
<span class="step__num">2</span>
<div class="step__icon">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" stroke="currentColor" stroke-width="2" stroke-linecap="round"/></svg>
</div>
<div>
<strong>Игровое задание</strong>
<span>Чтение, счёт, логика через механику игры</span>
</div>
</div>
<div class="step">
<span class="step__num">3</span>
<div class="step__icon">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" stroke="currentColor" stroke-width="2" stroke-linecap="round"/></svg>
</div>
<div>
<strong>Рефлексия</strong>
<span>Ребёнок сам рассказывает, чему научился</span>
@ -203,6 +351,7 @@ $opt_social_raw = get_option( 'branch_social' ) ?: carbon_get_post_meta( $post_
<div class="bento__half bento-card bento-card--objections">
<span class="bento-label">Почему родители выбирают нас</span>
<h2 class="bento-h2">Три главных вопроса честные ответы</h2>
<p class="bento-p">Мы не обещаем чуда мы даём системную подготовку к школе, которую <strong>видят учителя</strong> в первую же неделю.</p>
<div class="objection-list">
<div class="objection-item">
<div class="objection-item__icon">
@ -235,6 +384,20 @@ $opt_social_raw = get_option( 'branch_social' ) ?: carbon_get_post_meta( $post_
</div>
</section>
<!-- ════════════════════════════════════════════ -->
<!-- CTA: Бесплатное тестирование + занятие -->
<!-- ════════════════════════════════════════════ -->
<section class="bento pksh-section pksh-section--alt" aria-label="Запись на тестирование">
<div class="bento__full">
<div class="cta-test">
<div class="cta-test__badge">Бесплатно</div>
<h2 class="bento-h2 cta-test__title">Приходите на пробное увидите результат своими глазами</h2>
<p class="cta-test__text">Запишитесь на <strong>бесплатное расширенное тестирование</strong> и полноценное занятие. Педагог проверит готовность ребёнка к школе, покажет сильные стороны и даст план подготовки. <strong>Всего за 1 визит</strong> без очередей и ожидания.</p>
<button class="btn-primary btn-primary--large open-bitrix-form cta-test__btn">Записаться на бесплатное тестирование</button>
</div>
</div>
</section>
<!-- ════════════════════════════════════════════ -->
<!-- Bento Row 2: Results / Data -->
<!-- ════════════════════════════════════════════ -->

File diff suppressed because it is too large Load Diff