/*
Theme Name: Год дошкольного образования
Theme URI: https://example.com
Author: Custom
Description: Блочная тема (FSE) для лендинга «Год дошкольного образования» Забайкальского края. Весь сайт редактируется блоками: шаблоны и части шаблонов — в «Внешний вид → Редактор».
Version: 1.0
Requires at least: 5.9
Tested up to: 6.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: god-do
*/

/* ===== Стили в духе BON BON: светлый голубой фон, белые блоки, мягкие тени, скругления ===== */
:root {
    --color-primary: #3498DB;
    --color-primary-light: #E8F4FC;
    --color-primary-dark: #2980B9;
    --color-teal: #5DADE2;
    --color-teal-light: #AED6F1;
    --color-teal-soft: #D6EAF8;
    --color-teal-bg: #EBF5FB;
    --color-bg: #F0F8FF;
    --color-bg-alt: #E8F4FC;
    --color-text: #333333;
    --color-text-muted: #666666;
    --color-yellow: #F0C14B;
    --font-main: 'Open Sans', sans-serif;
    --font-head: 'Montserrat', sans-serif;
    --shadow: 0 5px 20px rgba(52, 152, 219, 0.12);
    --shadow-hover: 0 8px 28px rgba(52, 152, 219, 0.18);
    --radius: 20px;
    --radius-lg: 25px;
    --radius-pill: 28px;
    --nav-height: 72px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: var(--font-main); font-size: 16px; line-height: 1.6; color: var(--color-text); background: var(--color-bg); }

/* Hero: светлый голубой градиент, волны и «облака» */
.hero { position: relative; min-height: 100vh; display: flex; align-items: center; justify-content: center; background: linear-gradient(180deg, #E8F4FC 0%, #D6EAF8 35%, rgba(240, 248, 255, 0.98) 70%, #F0F8FF 100%); color: var(--color-text); text-align: center; overflow: hidden; }
.hero::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 80% 50% at 50% 20%, rgba(174, 214, 241, 0.5) 0%, transparent 50%), radial-gradient(circle at 75% 75%, rgba(255, 255, 255, 0.6) 0%, transparent 45%); pointer-events: none; }
.hero::after { content: ''; position: absolute; bottom: 18%; left: 12%; width: 140px; height: 48px; background: rgba(255, 255, 255, 0.95); border-radius: 70px 70px 70px 70px / 35px 35px 35px 35px; box-shadow: 0 4px 18px rgba(52, 152, 219, 0.12); }
.hero .hero-cloud { position: absolute; background: rgba(255, 255, 255, 0.9); border-radius: 50%; box-shadow: 0 4px 20px rgba(52, 152, 219, 0.08); }
.hero .hero-cloud-1 { width: 110px; height: 38px; bottom: 28%; right: 18%; border-radius: 55px 55px 55px 55px / 28px 28px 28px 28px; }
.hero .hero-cloud-2 { width: 85px; height: 30px; bottom: 38%; left: 22%; border-radius: 45px 45px 45px 45px / 25px 25px 25px 25px; }
.hero .hero-cloud-3 { width: 65px; height: 24px; top: 32%; right: 28%; border-radius: 40px 40px 40px 40px / 22px 22px 22px 22px; }
.hero-overlay { position: absolute; inset: 0; background: radial-gradient(ellipse at 70% 30%, rgba(52, 152, 219, 0.06) 0%, transparent 45%); pointer-events: none; }
.hero-content { position: relative; z-index: 1; padding: 2rem; max-width: 700px; }
.hero-badge { display: inline-block; font-family: var(--font-head); font-weight: 700; font-size: 0.95rem; letter-spacing: 0.2em; text-transform: uppercase; margin-bottom: 1rem; padding: 0.5rem 1.25rem; background: var(--color-primary); color: #fff; border: none; border-radius: var(--radius-pill); box-shadow: 0 4px 15px rgba(52, 152, 219, 0.25); }
.hero-title { font-family: var(--font-head); font-weight: 700; font-size: clamp(2rem, 5vw, 3rem); margin: 0 0 0.5rem; line-height: 1.2; color: var(--color-primary-dark); }
.hero-subtitle { font-size: 1.25rem; color: var(--color-teal); font-weight: 500; margin: 0 0 2rem; }
.hero-cta { display: inline-block; padding: 0.9rem 2rem; background: var(--color-primary); color: #fff; font-family: var(--font-head); font-weight: 600; text-decoration: none; border-radius: var(--radius-pill); box-shadow: 0 4px 15px rgba(52, 152, 219, 0.25); transition: transform 0.2s, box-shadow 0.2s, background 0.2s; }
.hero-cta:hover { transform: translateY(-2px); box-shadow: 0 6px 22px rgba(52, 152, 219, 0.35); background: var(--color-primary-dark); color: #fff; }
.hero-scroll { position: absolute; bottom: 2rem; left: 50%; transform: translateX(-50%); font-size: 1.5rem; color: var(--color-primary); opacity: 0.9; animation: god_do_bounce 2s infinite; }
@keyframes god_do_bounce { 0%, 100% { transform: translateX(-50%) translateY(0); } 50% { transform: translateX(-50%) translateY(8px); } }

/* Шапка: светлая полоска + навигация с мягкой тенью и скруглением */
.nav-top { position: fixed; top: 0; left: 0; right: 0; z-index: 1001; background: var(--color-primary-light); padding: 0.45rem 1.5rem; text-align: center; font-size: 0.85rem; color: var(--color-primary-dark); border-radius: 0 0 20px 20px; box-shadow: 0 2px 12px rgba(52, 152, 219, 0.08); }
.nav-top a { color: var(--color-primary-dark); font-weight: 500; text-decoration: none; }
.nav-top a:hover { color: var(--color-primary); }
.nav { position: fixed; top: 38px; left: 0; right: 0; z-index: 1000; height: var(--nav-height); background: rgba(255, 255, 255, 0.98); backdrop-filter: blur(10px); box-shadow: 0 4px 20px rgba(52, 152, 219, 0.1); transition: box-shadow 0.3s; border-radius: 0 0 var(--radius) var(--radius); }
.nav.scrolled { box-shadow: 0 6px 24px rgba(52, 152, 219, 0.12); }
.nav-inner { max-width: 100%; margin: 0 auto; padding: 0 1.5rem; height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.nav-logo { font-family: var(--font-head); font-weight: 700; font-size: 1.25rem; color: var(--color-primary); text-decoration: none; }
.nav-menu { display: flex; flex-wrap: wrap; list-style: none; margin: 0; padding: 0; gap: 0.35rem; justify-content: flex-end; }
.nav-menu a { color: var(--color-text); text-decoration: none; font-size: 0.875rem; font-weight: 500; padding: 0.5rem 0.75rem; border-radius: var(--radius); transition: color 0.2s, background 0.2s; white-space: nowrap; flex: 0 0 auto; }
.nav-menu a.active, .nav-menu .current-menu-item > a, .nav-menu a:hover { color: var(--color-primary); background: var(--color-teal-bg); }
.nav-toggle { display: none; flex-direction: column; gap: 5px; background: none; border: none; cursor: pointer; padding: 8px; }
.nav-toggle span { width: 24px; height: 2px; background: var(--color-primary); }
@media (max-width: 900px) {
    .nav-toggle { display: flex; }
    .nav-menu { position: fixed; top: calc(38px + var(--nav-height)); left: 0; right: 0; background: #fff; flex-direction: column; padding: 1rem; box-shadow: 0 10px 30px rgba(52, 152, 219, 0.12); max-height: 0; overflow: hidden; opacity: 0; transition: max-height 0.3s, opacity 0.3s; border-radius: 0 0 var(--radius) var(--radius); }
    .nav-menu.open { max-height: 80vh; opacity: 1; overflow-y: auto; }
}

.page-content { padding-top: calc(38px + var(--nav-height)); }
.section { padding: 4rem 0; }
.section-alt { background: var(--color-teal-bg); position: relative; }
.section-alt::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 100%; background: radial-gradient(ellipse 100% 80% at 50% 0%, rgba(174, 214, 241, 0.2) 0%, transparent 60%); pointer-events: none; }
.section-alt .container { position: relative; z-index: 1; }
.container { max-width: 1400px; margin: 0 auto; padding: 0 1.5rem; width: 100%; }
.section-title { font-family: var(--font-head); font-weight: 700; font-size: clamp(1.5rem, 3vw, 2rem); color: var(--color-primary-dark); margin: 0 0 0.5rem; text-align: center; }
.section-alt .section-title { color: var(--color-primary-dark); }
.section-lead, .section-desc { text-align: center; color: var(--color-text-muted); margin: 0 0 2rem; }

/* Карточки: белый фон, скругления 15–25px, мягкая тень с голубым оттенком */
.minister-block { display: grid; grid-template-columns: 200px 1fr; gap: 2rem; align-items: start; margin-bottom: 2.5rem; background: #fff; padding: 2rem; border-radius: var(--radius-lg); box-shadow: var(--shadow); }
.minister-block .minister-photo img { width: 200px; height: 200px; object-fit: cover; border-radius: 50%; }
.minister-photo-placeholder { aspect-ratio: 1; background: linear-gradient(135deg, var(--color-teal-bg), var(--color-teal-soft)); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.85rem; color: var(--color-text-muted); }
.minister-quote { font-size: 1.1rem; font-style: italic; margin: 0 0 1rem; color: var(--color-text); }
.minister-name { font-size: 0.95rem; color: var(--color-text-muted); margin: 0; }
.video-block { margin-bottom: 2rem; }
.video-block h3 { font-family: var(--font-head); margin: 0 0 1rem; color: var(--color-primary-dark); }
.video-placeholder { aspect-ratio: 16/9; background: linear-gradient(135deg, var(--color-teal), var(--color-teal-light)); border-radius: var(--radius); display: flex; flex-direction: column; align-items: center; justify-content: center; color: rgba(255,255,255,0.9); gap: 0.5rem; }
.video-placeholder p { margin: 0; font-size: 0.9rem; opacity: 0.8; }
.video-embed-wrap { width: 100%; }
.video-embed-wrap iframe { width: 100%; aspect-ratio: 16/9; border: none; border-radius: var(--radius); }
.banners-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.banner-placeholder { aspect-ratio: 2/1; background: var(--color-teal-bg); border: 2px dashed var(--color-teal-light); border-radius: var(--radius); display: flex; align-items: center; justify-content: center; color: var(--color-text-muted); font-size: 0.9rem; }
@media (max-width: 600px) { .minister-block { grid-template-columns: 1fr; } .banners-row { grid-template-columns: 1fr; } }

.project-name { font-family: var(--font-head); font-size: 1.25rem; color: var(--color-teal); text-align: center; margin: 0 0 2rem; font-weight: 600; }
.prosad-content { display: grid; gap: 2rem; }
.prosad-about h3 { font-family: var(--font-head); color: var(--color-primary-dark); margin: 1.5rem 0 0.5rem; }
.prosad-about h3:first-child { margin-top: 0; }
.prosad-about ul { margin: 0.5rem 0 0; padding-left: 1.5rem; }
.prosad-visual { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.prosad-card { background: #fff; padding: 1.5rem; border-radius: var(--radius); text-align: center; box-shadow: var(--shadow); transition: transform 0.2s, box-shadow 0.2s; }
.prosad-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-hover); }
.prosad-icon { font-size: 2rem; display: block; margin-bottom: 0.5rem; }
.prosad-card strong { display: block; color: var(--color-primary-dark); margin-bottom: 0.25rem; }
.prosad-card:nth-child(1) .prosad-icon { color: var(--color-teal); } .prosad-card:nth-child(2) .prosad-icon { color: var(--color-primary); } .prosad-card:nth-child(3) .prosad-icon { color: var(--color-teal-light); }
.prosad-card p { margin: 0; font-size: 0.9rem; color: var(--color-text-muted); }
@media (max-width: 700px) { .prosad-visual { grid-template-columns: 1fr; } }

.calendar-page-title { font-family: var(--font-head); font-weight: 700; font-size: clamp(1.5rem, 3vw, 2rem); color: var(--color-primary-dark); margin: 0 0 2rem; text-align: center; }
.months-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.month-card { background: #fff; border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden; min-height: 220px; }
.month-card-header { padding: 0.9rem 1rem; color: #fff; font-family: var(--font-head); font-weight: 700; font-size: 1rem; position: relative; }
.month-card-num { position: absolute; right: 0.75rem; top: 50%; transform: translateY(-50%); font-size: 3rem; font-weight: 700; opacity: 0.35; color: #fff; line-height: 1; }
.month-card-body { padding: 1rem 1rem 1.25rem; padding-top: 0.5rem; }
.month-card-events { list-style: none; margin: 0; padding: 0; }
.month-card-events li { padding: 0.25rem 0; font-size: 0.9rem; color: var(--color-text); }
.month-card.month-1 .month-card-header, .month-card.month-2 .month-card-header, .month-card.month-12 .month-card-header { background: #5D6D7E; }
.month-card.month-3 .month-card-header, .month-card.month-4 .month-card-header, .month-card.month-5 .month-card-header { background: #5DADE2; }
.month-card.month-6 .month-card-header, .month-card.month-7 .month-card-header, .month-card.month-8 .month-card-header { background: #3498DB; }
.month-card.month-9 .month-card-header, .month-card.month-10 .month-card-header, .month-card.month-11 .month-card-header { background: #2980B9; }
.month-card-events a { color: var(--color-primary); text-decoration: none; }
.month-card-events a:hover { text-decoration: underline; }

.news-list-title { font-family: var(--font-head); font-weight: 700; font-size: 1.25rem; color: var(--color-primary-dark); margin: 2rem 0 1rem; text-align: center; }
.news-list { max-width: 800px; margin: 0 auto; }
.news-item { background: #fff; padding: 1.25rem 1.5rem; margin-bottom: 1rem; border-radius: var(--radius); box-shadow: var(--shadow); scroll-margin-top: 120px; }
.news-item-date { font-size: 0.85rem; color: var(--color-teal); font-weight: 600; }
.news-item-title { font-family: var(--font-head); margin: 0.25rem 0 0.5rem; color: var(--color-primary-dark); font-size: 1.1rem; }
.news-item-text { margin: 0; font-size: 0.95rem; color: var(--color-text-muted); }

.children-videos { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.5rem; }
.child-video { background: #fff; border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); }
.child-video-placeholder { aspect-ratio: 16/9; background: var(--color-teal-bg); border: 2px dashed var(--color-teal-light); display: flex; align-items: center; justify-content: center; color: var(--color-text-muted); font-size: 0.95rem; }
.child-video-embed-wrap { width: 100%; }
.child-video-embed-wrap iframe { width: 100%; aspect-ratio: 16/9; border: none; border-radius: var(--radius); }

@media (max-width: 900px) { .months-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 500px) { .months-grid { grid-template-columns: 1fr; } }

.method-tabs { display: flex; gap: 0.5rem; justify-content: center; margin-bottom: 1.5rem; flex-wrap: wrap; }
.method-tab { padding: 0.6rem 1.2rem; border: 2px solid var(--color-teal-light); background: #fff; border-radius: var(--radius-pill); font-family: var(--font-main); font-weight: 500; cursor: pointer; color: var(--color-teal); transition: all 0.2s; box-shadow: 0 2px 10px rgba(52, 152, 219, 0.08); }
.method-tab:hover, .method-tab.active { background: var(--color-primary); color: #fff; border-color: var(--color-primary); box-shadow: 0 4px 15px rgba(52, 152, 219, 0.25); }
.method-panel { display: none; } .method-panel.active { display: block; }
.method-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 1rem; }
.method-card { background: #fff; padding: 1.25rem; border-radius: var(--radius); box-shadow: var(--shadow); text-align: center; transition: transform 0.2s, box-shadow 0.2s; }
.method-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-hover); }
.method-card a { font-weight: 500; color: var(--color-primary-dark); text-decoration: none; }
.method-card a:hover { color: var(--color-primary); }

.practices-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.5rem; }
.practice-card { background: #fff; border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); transition: transform 0.2s, box-shadow 0.2s; }
.practice-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-hover); }
.practice-img { height: 160px; background: linear-gradient(135deg, var(--color-teal-bg), var(--color-teal-soft)); display: flex; align-items: center; justify-content: center; color: var(--color-teal); font-weight: 600; }
.practice-card .practice-img img { width: 100%; height: 100%; object-fit: cover; }
.practice-card h4 { margin: 1rem 1rem 0.5rem; font-family: var(--font-head); color: var(--color-primary-dark); font-size: 1.05rem; }
.practice-card p { margin: 0 1rem 1rem; font-size: 0.95rem; color: var(--color-text-muted); }

.success-board { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1.5rem; }
.success-card { background: #fff; padding: 1.5rem; border-radius: var(--radius); text-align: center; box-shadow: var(--shadow); }
.success-avatar { width: 80px; height: 80px; margin: 0 auto 1rem; border-radius: 50%; background: linear-gradient(135deg, var(--color-primary-light), var(--color-primary)); display: flex; align-items: center; justify-content: center; font-size: 0.8rem; color: var(--color-primary-dark); overflow: hidden; }
.success-avatar img { width: 100%; height: 100%; object-fit: cover; }
.success-card h4 { margin: 0 0 0.25rem; font-family: var(--font-head); font-size: 1rem; color: var(--color-primary-dark); }
.success-card p { margin: 0 0 0.5rem; font-size: 0.9rem; color: var(--color-text-muted); }
.success-badge { display: inline-block; font-size: 0.75rem; padding: 0.3rem 0.7rem; background: var(--color-primary); color: #fff; border-radius: var(--radius-pill); box-shadow: 0 2px 10px rgba(52, 152, 219, 0.2); }

.children-quotes { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1.5rem; }
.child-quote { background: #fff; min-height: 140px; padding: 1.5rem; border-radius: var(--radius); border-left: 4px solid var(--color-primary); margin: 0; box-shadow: var(--shadow); }

/* Форма и кнопки в стиле BON BON: таблетки, синий фон, мягкая тень */
.feedback-form { max-width: 560px; margin: 0 auto; background: #fff; padding: 2rem; border-radius: var(--radius-lg); box-shadow: var(--shadow); }
.form-row { margin-bottom: 1.25rem; }
.form-row label { display: block; font-weight: 500; margin-bottom: 0.4rem; color: var(--color-primary-dark); }
.form-row input, .form-row textarea { width: 100%; padding: 0.75rem 1rem; border: 1px solid #ddd; border-radius: var(--radius); font-family: var(--font-main); font-size: 1rem; transition: border-color 0.2s, box-shadow 0.2s; }
.form-row input:focus, .form-row textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(52, 152, 219, 0.15); }
.btn { display: inline-block; padding: 0.85rem 2rem; font-family: var(--font-head); font-weight: 600; font-size: 1rem; border: none; border-radius: var(--radius-pill); cursor: pointer; transition: transform 0.2s, box-shadow 0.2s; }
.btn-primary { background: var(--color-primary); color: #fff; box-shadow: 0 4px 15px rgba(52, 152, 219, 0.25); }
.btn-primary:hover { background: var(--color-primary-dark); transform: translateY(-1px); box-shadow: 0 6px 20px rgba(52, 152, 219, 0.35); color: #fff; }

/* Кнопки редактора блоков — тот же стиль таблетки */
.wp-block-button__link { border-radius: var(--radius-pill) !important; box-shadow: 0 4px 15px rgba(52, 152, 219, 0.25); }
.wp-block-button__link:hover { box-shadow: 0 6px 20px rgba(52, 152, 219, 0.35); }

.section-navigator .section-title { margin-bottom: 1rem; }
.navigator-banner { min-height: 200px; background: var(--color-teal-bg); border: 2px dashed var(--color-teal-light); border-radius: var(--radius); display: flex; align-items: center; justify-content: center; color: var(--color-text-muted); font-size: 1rem; }
.navigator-banner img { max-width: 100%; max-height: 100%; object-fit: contain; }

/* Подвал: синий фон, волна сверху */
.footer { position: relative; background: var(--color-primary); color: rgba(255,255,255,0.95); padding: 2rem 1.75rem 1.75rem; text-align: center; font-size: 0.9rem; box-shadow: 0 -4px 20px rgba(52, 152, 219, 0.15); }
.footer::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 24px; background: var(--color-bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 24' preserveAspectRatio='none'%3E%3Cpath fill='%23F0F8FF' d='M0 24V12c150 0 300-12 600-12s450 12 600 12v12H0z'/%3E%3C/svg%3E") no-repeat center bottom; background-size: 100% 24px; }
.footer a { color: #fff; } .footer p { margin: 0; }

/* ===== Декоративные элементы и паттерны ===== */

/* Фоновые паттерны для секций */
.pattern-dots { position: relative; }
.pattern-dots::before { content: ''; position: absolute; inset: 0; background-image: radial-gradient(circle at 1px 1px, rgba(52, 152, 219, 0.12) 1px, transparent 0); background-size: 24px 24px; pointer-events: none; }
.pattern-dots .container, .pattern-dots > * { position: relative; z-index: 1; }

.pattern-grid { position: relative; }
.pattern-grid::before { content: ''; position: absolute; inset: 0; background-image: linear-gradient(rgba(52, 152, 219, 0.06) 1px, transparent 1px), linear-gradient(90deg, rgba(52, 152, 219, 0.06) 1px, transparent 1px); background-size: 32px 32px; pointer-events: none; }
.pattern-grid .container, .pattern-grid > * { position: relative; z-index: 1; }

.pattern-circles { position: relative; overflow: hidden; }
.pattern-circles::before { content: ''; position: absolute; top: -80px; right: -80px; width: 240px; height: 240px; border-radius: 50%; background: rgba(174, 214, 241, 0.25); pointer-events: none; }
.pattern-circles::after { content: ''; position: absolute; bottom: -60px; left: -60px; width: 180px; height: 180px; border-radius: 50%; background: rgba(93, 173, 226, 0.15); pointer-events: none; }
.pattern-circles .container, .pattern-circles > * { position: relative; z-index: 1; }

/* Разделители между секциями (волна) — рисуется через CSS, без HTML-блока */
.section-divider-wave { position: relative; margin-top: -1px; height: 48px; min-height: 48px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 48' preserveAspectRatio='none'%3E%3Cpath fill='%23F0F8FF' d='M0 48V24c100 0 200-12 400-12s300 12 600 12 200-12 400-12v24H0z'/%3E%3C/svg%3E") no-repeat center bottom; background-size: 100% 48px; }
.section-divider-wave svg { display: block; width: 100%; height: 100%; }
.section-divider-wave--top { margin-top: 0; margin-bottom: -1px; transform: rotate(180deg); }

.section-divider-curve { position: relative; height: 56px; margin-top: -1px; }
.section-divider-curve::before { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 56px; background: var(--color-bg); border-radius: 0 0 50% 50% / 0 0 100px 100px; }
.section-divider-curve--alt::before { background: var(--color-teal-bg); }

/* Декоративная форма рядом с блоком (трапеция/скос) */
.deco-block { position: relative; }
.deco-block::before { content: ''; position: absolute; top: 0; left: 0; width:  min(220px, 35%); height: 100%; background: linear-gradient(135deg, var(--color-teal-bg) 0%, var(--color-teal-soft) 100%); border-radius: 0 var(--radius-lg) var(--radius-lg) 0; clip-path: polygon(0 0, 100% 0, 85% 100%, 0 100%); z-index: 0; }
.deco-block > * { position: relative; z-index: 1; }
.deco-block--right::before { left: auto; right: 0; clip-path: polygon(15% 0, 100% 0, 100% 100%, 0 100%); border-radius: var(--radius-lg) 0 0 var(--radius-lg); }

/* Карточка с акцентной полосой слева */
.card-accent { border-left: 4px solid var(--color-primary); }
.card-accent--teal { border-left-color: var(--color-teal); }

/* Заголовок секции с декоративной линией */
.section-title-deco { position: relative; display: inline-block; padding-bottom: 0.5rem; }
.section-title-deco::after { content: ''; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); width: 60px; height: 4px; background: linear-gradient(90deg, transparent, var(--color-primary), transparent); border-radius: 2px; }

/* Плавающие декоративные круги (для hero и секций) */
.deco-float { position: relative; overflow: hidden; }
.deco-float .deco-circle { position: absolute; border-radius: 50%; background: rgba(255, 255, 255, 0.6); pointer-events: none; }
.deco-float .deco-circle-1 { width: 120px; height: 120px; top: 10%; right: 8%; }
.deco-float .deco-circle-2 { width: 80px; height: 80px; bottom: 20%; left: 5%; background: rgba(174, 214, 241, 0.4); }
.deco-float .deco-circle-3 { width: 50px; height: 50px; top: 50%; left: 15%; background: rgba(52, 152, 219, 0.08); }

/* Блок с мягкой рамкой и тенью (улучшенная карточка) */
.card-modern { background: #fff; border-radius: var(--radius-lg); box-shadow: var(--shadow); border: 1px solid rgba(52, 152, 219, 0.08); overflow: hidden; }
.card-modern:hover { box-shadow: var(--shadow-hover); }
.card-modern .card-modern-header { padding: 1rem 1.5rem; background: linear-gradient(135deg, var(--color-primary-light) 0%, var(--color-teal-bg) 100%); font-family: var(--font-head); font-weight: 600; color: var(--color-primary-dark); }
.card-modern .card-modern-body { padding: 1.5rem; }