diff --git a/AGENTS.md b/AGENTS.md new file mode 100644 index 0000000..db77e4e --- /dev/null +++ b/AGENTS.md @@ -0,0 +1,29 @@ +# Глобальные инструкции проекта + +## Язык общения +- ВСЕГДА отвечай на русском языке. +- Код, комментарии, коммиты, техническая документация — на английском (стандарт). +- Объяснения, архитектурные решения, анализ, рекомендации — на русском. +- Если пользователь пишет на другом языке — отвечай на том же языке. + +## Оптимизация DeepSeek v4 Flash +- Модель: `opencode/deepseek-v4-flash-free` +- DeepSeek v4 Flash оптимизирован для быстрых инференсов с большим контекстом. +- Для сложных задач используй декомпозицию: разбивай на подзадачи, выполняй последовательно. +- Для работы с файлами: предпочитай пакетные операции (множественные чтения/записи) вместо последовательных вызовов. +- Для поиска по коду: используй glob/grep с точными паттернами, избегай избыточного сканирования. +- При работе с большими проектами — используй подзадачи (Task/Explore) для параллельного исследования. +- tool_output лимиты увеличены для работы с большими результатами (max_lines: 300, max_bytes: 10240). +- compaction включён, tail_turns: 20 — удержание контекста в длинных сессиях. +- MCP таймаут: 60s (для работы с медленными внешними сервисами). + +## Профиль разработчика +- WP-Architect — WordPress full-stack architect. +- Специализация: теминг, SEO, производительность, маркетинг. +- Доступно >80 скиллов: SEO/AEO, CRO, UI/UX, CI/CD, аналитика, безопасность. + +## Принципы работы +- Используй скиллы при каждой возможности (даже 1% совпадения). +- Caveman-режим активируется пользователем (/caveman). +- Коммиты и PR — на нормальном английском. +- Сообщай о проблемах безопасности сразу, без caveman. diff --git a/opencode.json b/opencode.json new file mode 100644 index 0000000..83b145e --- /dev/null +++ b/opencode.json @@ -0,0 +1,33 @@ +{ + "$schema": "https://opencode.ai/config.json", + "model": "opencode/deepseek-v4-flash-free", + + "instructions": ["AGENTS.md"], + + "default_agent": "wp-architect", + + "plugin": [ + "file:///home/letoline/.config/opencode/plugins/caveman/plugin.js", + "file:///home/letoline/.config/opencode/plugins/claude-mem.js", + "@zenobius/opencode-skillful" + ], + + "command": { + "wp-audit": { "template": "short" }, + "wp-seo": { "template": "short" }, + "wp-content": { "template": "short" }, + "wp-speed": { "template": "short" }, + "design-persona": { "template": "short" }, + "design-research": { "template": "short" }, + "critique": { "template": "short" }, + "gsd": { "template": "short" }, + "caveman": { "template": "short" }, + "caveman-commit": { "template": "short" }, + "caveman-review": { "template": "short" }, + "design-screen": { "template": "short" }, + "design-system": { "template": "short" }, + "ux-audit": { "template": "short" }, + "prototype": { "template": "short" }, + "school": { "template": "short" } + } +} diff --git a/wp-content/themes/dekart/assets/css/camp.css b/wp-content/themes/dekart/assets/css/camp.css index b6bb5b2..2e9ab5a 100644 --- a/wp-content/themes/dekart/assets/css/camp.css +++ b/wp-content/themes/dekart/assets/css/camp.css @@ -1,11 +1,72 @@ :root { - --main-color: #BF568E; - --main-blue: #006DB7; - --main-yellow: #FFD43E; - --section-padding: clamp(30px, 6.25vw, 75px); - --bg-hero: #f6f1e9; - --bg-white: #ffffff; - --bg-mint: #f5faf7; + /* ════════════════════════════════════ + DESIGN TOKENS — camp.css + ════════════════════════════════════ */ + + /* ─── Brand Colors ─── */ + --color-primary: #E8753A; + --color-primary-hover: #D6652E; + --color-secondary: #3BB2A0; + --color-accent: #FFD43E; + + /* ─── Neutral Colors ─── */ + --color-text: #1C2B2D; + --color-text-muted: #5A6B6D; + --color-text-light: #8A9A9D; + --color-bg: #FFFFFF; + --color-bg-warm: #F8F4EF; + --color-bg-alt: #EEF3EE; + + /* ─── Legacy aliases ─── */ + --bg-hero: var(--color-bg-warm); + --bg-white: var(--color-bg); + --bg-mint: var(--color-bg-alt); + + /* ─── Typography ─── */ + --font-display: 'Montserrat', sans-serif; + --font-body: 'Inter', sans-serif; + + /* ─── Font Sizes ─── */ + --fs-display: clamp(36px, 5vw, 52px); + --fs-h1: clamp(28px, 3.6vw, 36px); + --fs-h2: clamp(24px, 2.8vw, 32px); + --fs-h3: clamp(18px, 2vw, 24px); + --fs-body: 16px; + --fs-small: 14px; + + /* ─── Spacing Scale ─── */ + --space-xs: 4px; + --space-sm: 8px; + --space-md: 16px; + --space-lg: 24px; + --space-xl: 32px; + --space-2xl: 48px; + --space-3xl: 64px; + + /* ─── Section ─── */ + --section-padding: clamp(40px, 8vw, 100px); + + /* ─── Card ─── */ + --card-padding: clamp(20px, 3vw, 32px); + --card-radius: 20px; + --card-shadow: 0 2px 16px rgba(0,0,0,0.06); + --card-shadow-hover: 0 8px 32px rgba(0,0,0,0.1); + + /* ─── Border Radius ─── */ + --radius-sm: 8px; + --radius-md: 12px; + --radius-lg: 16px; + --radius-xl: 20px; + --radius-full: 9999px; + + /* ─── Shadows ─── */ + --shadow-sm: 0 2px 8px rgba(0,0,0,0.06); + --shadow-md: 0 4px 20px rgba(0,0,0,0.08); + --shadow-lg: 0 8px 32px rgba(0,0,0,0.12); + + /* ─── Transitions ─── */ + --transition-fast: 0.2s ease; + --transition-normal: 0.3s ease; } html { @@ -31,32 +92,32 @@ html { width: 100%; max-width: 1200px; margin: 0 auto; - padding: 0 20px; + padding: 0 clamp(16px, 3vw, 24px); } .camp p { font-weight: 400; - margin: 0 0 30px 0; + margin: 0 0 20px 0; padding: 0; } .camp_title { - font-family: 'Montserrat', sans-serif; + font-family: var(--font-display); font-weight: 700; - color: #1c2b2d; - font-size: 34px; - line-height: 1.25; + color: var(--color-text); + font-size: var(--fs-h1); + line-height: 1.2; text-align: center; - padding-bottom: 32px; + padding-bottom: clamp(24px, 3vw, 32px); } .camp_text { - font-family: Inter, sans-serif; - font-size: 18px; + font-family: var(--font-body); + font-size: var(--fs-body); line-height: 1.6; - color: #555; + color: var(--color-text-muted); text-align: center; - max-width: 700px; + max-width: 65ch; margin: 0 auto 50px; font-weight: 400; } @@ -83,21 +144,21 @@ html { .banner_label1 { top: 45%; left: 50%; - background-color: #e94563; + background-color: var(--color-primary); animation: animate1 4s infinite; } .banner_label2 { top: 80%; left: 48%; - background-color: #ae5fcd; + background-color: var(--color-secondary); animation: animate2 3s infinite; } .banner_label3 { top: 80%; left: 80%; - background-color: #13acd0; + background-color: #FFB74D; animation: animate3 2.5s infinite; rotate: -15deg; } @@ -196,7 +257,7 @@ html { .banner_btn:hover { background-color: #fff; - color: #212121; + color: var(--color-text); } .banner__right-part { @@ -224,7 +285,7 @@ html { flex-direction: row; align-items: center; gap: 60px; - padding: 0 75px; + padding: 0 24px; overflow: visible; } @@ -259,7 +320,7 @@ html { aspect-ratio: 4 / 3; border: 5px solid #fff; - box-shadow: 0 8px 32px rgba(255,107,0,0.15); + box-shadow: var(--shadow-lg); } @@ -283,7 +344,7 @@ html { background: #f0f0f0; - color: #999; + color: var(--color-text-light); font-size: 14px; @@ -314,17 +375,17 @@ html { .about-us__title { text-align: left; padding-bottom: 0; - font-size: 27px; + font-size: clamp(22px, 2.6vw, 26px); } .about-us__text { - font-family: Inter, sans-serif; - font-size: 18px; - line-height: 1.6; + font-family: var(--font-body); + font-size: 16px; + line-height: 1.65; font-weight: 400; - color: #555; + color: var(--color-text-muted); text-align: left; - max-width: 700px; + max-width: 65ch; margin: 0 0; } @@ -332,58 +393,35 @@ html { } .about-us__badge { - display: inline-block; - - font-family: Montserrat, sans-serif; - + font-family: var(--font-display); font-size: 14px; - font-weight: 700; - - color: #FF6B00; - - background: rgba(255,107,0,0.08); - + color: var(--color-primary); + background: rgba(232, 117, 58, 0.08); padding: 6px 16px; - - border-radius: 9999px; - + border-radius: var(--radius-full); } .about-us__cta { } .about-us__cta-link { - display: inline-block; - - font-family: Montserrat, sans-serif; - + font-family: var(--font-display); font-size: 16px; - font-weight: 700; - color: #fff; - - background: #FF6B00; - - padding: 12px 28px; - - border-radius: 9999px; - + background: var(--color-primary); + padding: 14px 28px; + border-radius: var(--radius-full); text-decoration: none; - - transition: background 0.2s, transform 0.2s; - + transition: background var(--transition-fast), transform var(--transition-fast); } .about-us__cta-link:hover { - - background: #FF8533; - - transform: scale(1.05); - + background: var(--color-primary-hover); + transform: translateY(-1px); } .about-us__doodle { @@ -489,10 +527,10 @@ html { height: 72px; display: flex; align-items: center; - justify-content: space-between; - background: rgba(255,107,0,0.1); - border-radius: 16px; - margin: 0 auto 16px; + justify-content: center; + background: rgba(232, 117, 58, 0.08); + border-radius: var(--radius-lg); + margin: 0 auto var(--space-md); flex-shrink: 0; } @@ -510,7 +548,7 @@ html { .suggestions__item:hover { transform: translateY(-6px); - box-shadow: 0 14px 32px rgba(255,107,0,0.18); + box-shadow: var(--card-shadow-hover); } /* ═══ SECTION REVEAL — fade + translateY + scale ═══ */ @@ -545,11 +583,13 @@ html { z-index: 2; } .suggestions__subtitle { - font-family: Inter, sans-serif; - font-size: 18px; + font-family: var(--font-body); + font-size: 16px; line-height: 1.6; - color: #555; + color: var(--color-text-muted); text-align: center; + max-width: 65ch; + margin: 0 auto 32px; } .suggestions-wrapper { display: flex; @@ -563,56 +603,52 @@ html { flex: 0 0 auto; } .suggestions__item { - border-radius: 20px; + border-radius: var(--card-radius); padding: 32px 24px 36px; - box-shadow: 0 4px 16px rgba(0,0,0,0.04); + box-shadow: var(--card-shadow); display: flex; flex-direction: column; align-items: center; text-align: center; - gap: 12px; + gap: var(--space-md); position: relative; overflow: hidden; - transform: translateY(0) scale(1); - transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.3s ease; + background: var(--color-bg); + transition: transform var(--transition-normal), box-shadow var(--transition-normal); } .suggestions__item::before { content: ''; position: absolute; - inset: 0; + top: 0; + left: 0; + right: 0; + height: 4px; + background: var(--color-primary); opacity: 0; - transition: opacity 0.4s ease; - border-radius: 20px; + transition: opacity var(--transition-normal); + border-radius: var(--card-radius) var(--card-radius) 0 0; pointer-events: none; } -.suggestions__item:nth-child(4n+1) { background: #e0f4ff; } -.suggestions__item:nth-child(4n+1)::before { background: linear-gradient(135deg, rgba(57,183,234,0.15), transparent); } -.suggestions__item:nth-child(4n+2) { background: #ffede0; } -.suggestions__item:nth-child(4n+2)::before { background: linear-gradient(135deg, rgba(255,107,0,0.15), transparent); } -.suggestions__item:nth-child(4n+3) { background: #e0fce8; } -.suggestions__item:nth-child(4n+3)::before { background: linear-gradient(135deg, rgba(0,200,83,0.15), transparent); } -.suggestions__item:nth-child(4n+4) { background: #f3e0ff; } -.suggestions__item:nth-child(4n+4)::before { background: linear-gradient(135deg, rgba(156,39,176,0.15), transparent); } .suggestions__item:hover { - transform: translateY(-6px) scale(1.02); - box-shadow: 0 12px 40px rgba(0,0,0,0.12); + transform: translateY(-6px); + box-shadow: var(--card-shadow-hover); } .suggestions__item:hover::before { opacity: 1; } .suggestions__item_title { - font-family: "Montserrat", sans-serif; + font-family: var(--font-display); font-size: 20px; line-height: 1.3; font-weight: 700; - color: #1c2b2d; + color: var(--color-text); margin: 0; position: relative; z-index: 1; } .suggestions__item_text { - font-family: "Inter", sans-serif; + font-family: var(--font-body); font-size: 14px; line-height: 1.6; - color: #555; + color: var(--color-text-muted); margin: 0; position: relative; z-index: 1; @@ -703,7 +739,7 @@ html { font-family: Inter, sans-serif; font-size: 18px; line-height: 1.6; - color: #555; + color: var(--color-text-muted); text-align: center; font-weight: 400; } @@ -715,15 +751,15 @@ html { } .infograph__card { - background: #fff; - border-radius: 20px; + background: var(--color-bg); + border-radius: var(--card-radius); padding: 0; display: flex; flex-direction: column; align-items: center; text-align: center; - box-shadow: 0 4px 24px rgba(0,0,0,0.08); - transition: transform 0.3s ease, box-shadow 0.3s ease; + box-shadow: var(--card-shadow); + transition: transform var(--transition-normal), box-shadow var(--transition-normal); overflow: hidden; position: relative; } @@ -734,17 +770,17 @@ html { top: 0; left: 0; right: 0; - height: 5px; - background: #1a8bc4; + height: 4px; + background: var(--color-primary); } -.infograph__card:nth-child(2)::before { background: #2d9d5f; } -.infograph__card:nth-child(3)::before { background: #8e45b8; } -.infograph__card:nth-child(4)::before { background: #c9354e; } +.infograph__card:nth-child(2)::before { background: var(--color-secondary); } +.infograph__card:nth-child(3)::before { background: var(--color-accent); } +.infograph__card:nth-child(4)::before { background: var(--color-primary); opacity: 0.6; } .infograph__card:hover { transform: translateY(-6px); - box-shadow: 0 12px 40px rgba(0,0,0,0.14); + box-shadow: var(--card-shadow-hover); } .infograph__card-icon { @@ -753,10 +789,10 @@ html { border-radius: 50%; display: flex; align-items: center; - justify-content: space-between; + justify-content: center; flex-shrink: 0; margin-top: 28px; - background: #e0f4ff; + background: rgba(232, 117, 58, 0.08); } .infograph__card-icon img { @@ -766,44 +802,44 @@ html { } .infograph__card:nth-child(2) .infograph__card-icon { - background: #e0fce8; + background: rgba(59, 178, 160, 0.1); } .infograph__card:nth-child(3) .infograph__card-icon { - background: #f3e0ff; + background: rgba(255, 212, 62, 0.15); } .infograph__card:nth-child(4) .infograph__card-icon { - background: #ffe0e6; + background: rgba(232, 117, 58, 0.06); } .infograph__card-body { display: flex; flex-direction: column; - gap: 4px; - padding: 20px 20px 28px; + gap: var(--space-xs); + padding: var(--space-lg) var(--space-lg) 28px; } .infograph__stat { - font-family: Montserrat, sans-serif; - font-size: 32px; + font-family: var(--font-display); + font-size: clamp(26px, 3.2vw, 32px); font-weight: 900; line-height: 1.15; - color: #1c2b2d; + color: var(--color-text); margin: 0; } -.infograph__card:nth-child(1) .infograph__stat { color: #1a8bc4; } -.infograph__card:nth-child(2) .infograph__stat { color: #2d9d5f; } -.infograph__card:nth-child(3) .infograph__stat { color: #8e45b8; } -.infograph__card:nth-child(4) .infograph__stat { color: #c9354e; } +.infograph__card:nth-child(1) .infograph__stat { color: var(--color-primary); } +.infograph__card:nth-child(2) .infograph__stat { color: var(--color-secondary); } +.infograph__card:nth-child(3) .infograph__stat { color: #C49A00; } +.infograph__card:nth-child(4) .infograph__stat { color: var(--color-primary); opacity: 0.7; } .infograph__label { - font-family: Inter, sans-serif; - font-size: 14px; + font-family: var(--font-body); + font-size: 13px; font-weight: 600; line-height: 1.4; - color: #444; + color: var(--color-text-muted); text-transform: uppercase; letter-spacing: 0.06em; margin: 0; @@ -885,15 +921,16 @@ html { .programs__card { display: flex; flex-direction: column; - border-radius: 20px; - background: #fff; + border-radius: var(--card-radius); + background: var(--color-bg); overflow: hidden; - transition: transform .25s ease, box-shadow .25s ease; + box-shadow: var(--card-shadow); + transition: transform var(--transition-normal), box-shadow var(--transition-normal); } .programs__card:hover { transform: translateY(-4px); - box-shadow: 0 8px 24px rgba(0,0,0,0.06); + box-shadow: var(--card-shadow-hover); } .programs__image { @@ -907,38 +944,32 @@ html { display: flex; flex-direction: column; gap: 8px; - padding: 20px; + padding: var(--card-padding); flex: 1; } .programs__name { - font-family: Montserrat, sans-serif; - font-size: 20px; - font-weight: 600; + font-family: var(--font-display); + font-size: clamp(18px, 2vw, 22px); + font-weight: 700; line-height: 1.25; - color: #1c2b2d; + color: var(--color-text); margin: 0; } -@media (min-width: 641px) { - .programs__name { font-size: 20px; } -} - -@media (min-width: 1024px) { - .programs__name { font-size: 22px; } -} - .programs__date { font-size: 14px; font-weight: 400; - color: #999; + color: var(--color-text-light); margin: 0; + font-family: var(--font-body); } .programs__desc { + font-family: var(--font-body); font-size: 15px; - line-height: 1.4; - color: #555; + line-height: 1.5; + color: var(--color-text-muted); font-weight: 400; margin: 0; flex: 1; @@ -952,39 +983,39 @@ html { } .programs__price { - font-family: Montserrat, sans-serif; - font-size: 24px; + font-family: var(--font-display); + font-size: clamp(20px, 2.4vw, 24px); font-weight: 700; - color: #3bb273; + color: var(--color-primary); line-height: 1.2; } .programs__duration { font-size: 14px; - color: #999; + color: var(--color-text-light); font-weight: 400; } .programs__btn { - width: 100%; - padding: 14px 20px; - font-size: 15px; - font-weight: 600; - text-transform: uppercase; - color: #3bb273; - border: 2px solid #3bb273; - background: transparent; - border-radius: 100px; - cursor: pointer; - transition: .2s; - margin-top: 12px; + width: 100%; + padding: 14px 20px; + font-size: 15px; + font-weight: 700; + font-family: var(--font-display); + color: var(--color-primary); + border: 2px solid var(--color-primary); + background: transparent; + border-radius: var(--radius-full); + cursor: pointer; + transition: background var(--transition-fast), color var(--transition-fast); + margin-top: 12px; } .programs__btn:hover, .programs__btn:focus-visible { - background: #3bb273; - color: #fff; - outline: none; + background: var(--color-primary); + color: #fff; + outline: none; } @media (min-width: 641px) { @@ -1083,8 +1114,9 @@ html { .modal-programs__body .programs__item_price { font-size: 20px; font-weight: 700; - color: #3bb273; + color: var(--color-primary); margin: 0; + font-family: var(--font-display); } .programs__content { @@ -1157,42 +1189,44 @@ html { .pricing-card { flex: 1; - background: #fff; - border-radius: 24px; - padding: 36px 32px; + background: var(--color-bg); + border-radius: var(--card-radius); + padding: var(--card-padding); display: flex; flex-direction: column; - gap: 24px; - border: 1.5px solid #3bb273; - box-shadow: 0 4px 20px rgba(59, 178, 115, 0.08); - transition: transform 0.3s ease, box-shadow 0.3s ease; + gap: var(--space-lg); + border: 1.5px solid #e0e0e0; + box-shadow: var(--card-shadow); + transition: transform var(--transition-normal), box-shadow var(--transition-normal); + position: relative; } .pricing-card:hover { transform: translateY(-4px); - box-shadow: 0 8px 32px rgba(0,0,0,0.08); + box-shadow: var(--card-shadow-hover); } .pricing-card--full { - border-color: #ae5fcd; - box-shadow: 0 4px 20px rgba(174, 95, 205, 0.1); - position: relative; + border-color: var(--color-secondary); + border-width: 2px; + box-shadow: 0 4px 20px rgba(59, 178, 160, 0.12); } .pricing-card--full::before { content: 'Рекомендуем'; position: absolute; - top: 0; + top: -14px; left: 50%; transform: translateX(-50%); - background: #ae5fcd; + background: var(--color-secondary); color: #fff; - font-family: Inter, sans-serif; + font-family: var(--font-body); font-size: 13px; font-weight: 600; - padding: 4px 20px; - border-radius: 20px; + padding: 6px 24px; + border-radius: var(--radius-full); white-space: nowrap; + letter-spacing: 0.02em; } .pricing-card__header { @@ -1213,27 +1247,27 @@ html { } .pricing-card__badge--half { - background: rgba(59, 178, 115, 0.1); + background: rgba(232, 117, 58, 0.1); } .pricing-card__badge--full { - background: rgba(174, 95, 205, 0.1); + background: rgba(59, 178, 160, 0.15); } .pricing-card__title { - font-family: Montserrat, sans-serif; - font-size: 26px; + font-family: var(--font-display); + font-size: clamp(22px, 2.6vw, 26px); font-weight: 700; - color: #1c2b2d; + color: var(--color-text); margin: 0; line-height: 1.2; } .pricing-card__desc { - font-family: Inter, sans-serif; + font-family: var(--font-body); font-size: 15px; line-height: 1.5; - color: #666; + color: var(--color-text-muted); margin: 0; } @@ -1248,25 +1282,21 @@ html { } .pricing-card__amount { - font-family: Montserrat, sans-serif; - font-size: 36px; + font-family: var(--font-display); + font-size: clamp(28px, 3.6vw, 36px); font-weight: 800; - color: #1c2b2d; + color: var(--color-text); line-height: 1.1; } -.pricing-card--half .pricing-card__amount { - color: #3bb273; -} - .pricing-card--full .pricing-card__amount { - color: #ae5fcd; + color: var(--color-secondary); } .pricing-card__period { - font-family: Inter, sans-serif; + font-family: var(--font-body); font-size: 14px; - color: #999; + color: var(--color-text-light); font-weight: 500; } @@ -1281,21 +1311,21 @@ html { align-items: center; justify-content: space-between; padding: 10px 16px; - background: #f8f8f8; - border-radius: 10px; + background: var(--color-bg-alt); + border-radius: var(--radius-md); } .pricing-card__slot-time { - font-family: Inter, sans-serif; + font-family: var(--font-body); font-size: 15px; font-weight: 600; - color: #1c2b2d; + color: var(--color-text); } .pricing-card__slot-label { - font-family: Inter, sans-serif; + font-family: var(--font-body); font-size: 13px; - color: #999; + color: var(--color-text-light); font-weight: 500; } @@ -1309,11 +1339,11 @@ html { } .pricing-card__features li { - font-family: Inter, sans-serif; + font-family: var(--font-body); font-size: 15px; line-height: 1.5; - color: #444; - padding-left: 24px; + color: var(--color-text-muted); + padding-left: 28px; position: relative; } @@ -1322,24 +1352,24 @@ html { position: absolute; left: 0; top: 2px; - width: 18px; - height: 18px; + width: 20px; + height: 20px; border-radius: 50%; display: flex; align-items: center; - justify-content: space-between; + justify-content: center; font-size: 11px; font-weight: 700; } .pricing-card--half .pricing-card__features li::before { - background: rgba(59, 178, 115, 0.15); - color: #3bb273; + background: rgba(232, 117, 58, 0.15); + color: var(--color-primary); } .pricing-card--full .pricing-card__features li::before { - background: rgba(174, 95, 205, 0.15); - color: #ae5fcd; + background: rgba(59, 178, 160, 0.15); + color: var(--color-secondary); } .pricing-card__extra { @@ -1347,11 +1377,11 @@ html { align-items: center; gap: 8px; padding: 12px 16px; - background: #fafafa; - border-radius: 10px; - font-family: Inter, sans-serif; + background: var(--color-bg-alt); + border-radius: var(--radius-md); + font-family: var(--font-body); font-size: 14px; - color: #555; + color: var(--color-text-muted); font-weight: 500; } @@ -1359,30 +1389,19 @@ html { width: 100%; padding: 16px 0; border: none; - border-radius: 50px; - font-family: Montserrat, sans-serif; + border-radius: var(--radius-full); + font-family: var(--font-display); font-size: 16px; font-weight: 700; - text-transform: uppercase; cursor: pointer; - transition: background 0.3s ease; + transition: background var(--transition-fast), transform var(--transition-fast); color: #fff; + background: var(--color-primary); } -.pricing-card--half .pricing-card__btn { - background: #3bb273; -} - -.pricing-card--half .pricing-card__btn:hover { - background: #2d9d5f; -} - -.pricing-card--full .pricing-card__btn { - background: #ae5fcd; -} - -.pricing-card--full .pricing-card__btn:hover { - background: #9747b8; +.pricing-card__btn:hover { + background: var(--color-primary-hover); + transform: translateY(-1px); } /* bring-child END */ @@ -1399,26 +1418,26 @@ html { } .mentors__card { - background: #fff; - border-radius: 20px; - overflow: hidden; - box-shadow: 0 2px 16px rgba(0,0,0,0.06); - transition: transform 0.3s ease, box-shadow 0.3s ease; - display: flex; - flex-direction: column; - height: 100%; + background: var(--color-bg); + border-radius: var(--card-radius); + overflow: hidden; + box-shadow: var(--card-shadow); + transition: transform var(--transition-normal), box-shadow var(--transition-normal); + display: flex; + flex-direction: column; + height: 100%; } .mentors__card:hover { - transform: translateY(-4px); - box-shadow: 0 8px 32px rgba(0,0,0,0.1); + transform: translateY(-4px); + box-shadow: var(--card-shadow-hover); } .mentors__card-top { - background: linear-gradient(135deg, #e0f4ff, #f0f9ff); - display: flex; - justify-content: space-between; - padding: 28px 20px 20px; + background: linear-gradient(135deg, rgba(232, 117, 58, 0.06), rgba(59, 178, 160, 0.06)); + display: flex; + justify-content: center; + padding: 28px 20px 20px; } .mentors__photo { @@ -1439,28 +1458,28 @@ html { } .mentors__name { - font-family: Montserrat, sans-serif; + font-family: var(--font-display); font-size: 20px; font-weight: 700; line-height: 1.25; - color: #1c2b2d; + color: var(--color-text); text-align: center; } .mentors__job { - font-family: Inter, sans-serif; + font-family: var(--font-body); font-size: 14px; line-height: 1.4; - color: #777; + color: var(--color-text-light); text-align: center; margin: 0; } .mentors__about { - font-family: Inter, sans-serif; + font-family: var(--font-body); font-size: 14px; line-height: 1.5; - color: #555; + color: var(--color-text-muted); text-align: center; margin: 4px 0 0; } @@ -1514,7 +1533,7 @@ html { margin-left: 20px; flex-direction: column; gap: 40px; - color: #212121; + color: var(--color-text); } .routine__item { @@ -1525,10 +1544,12 @@ html { .routine__item_time { width: 160px; - font-size: 24px; + font-size: clamp(18px, 2vw, 24px); line-height: 1.2; font-weight: 600; text-align: end; + font-family: var(--font-display); + color: var(--color-text); } .routine__item_time-mobile { @@ -1541,7 +1562,7 @@ html { width: 22px; height: 22px; border-radius: 50%; - background-color: #3bb273; + background-color: var(--color-primary); border: 4px solid #fff; } @@ -1563,15 +1584,19 @@ html { } .routine__item_text-title { - font-size: 24px; - line-height: 1.2; + font-size: clamp(20px, 2.4vw, 24px); + line-height: 1.25; font-weight: 600; + font-family: var(--font-display); + color: var(--color-text); } .routine__item_text-text { - font-size: 18px; - line-height: 1.3; - font-weight: 500; + font-size: 16px; + line-height: 1.5; + font-weight: 400; + font-family: var(--font-body); + color: var(--color-text-muted); } .routine__item:last-child::before { @@ -1757,18 +1782,21 @@ html { } .camp-faq .box__accordion_label span { - font-size: 26px; - line-height: 1.2; + font-size: clamp(18px, 2.2vw, 22px); + line-height: 1.25; + font-family: var(--font-display); + font-weight: 600; + color: var(--color-text); } .box__accordion_label svg { - width: 40px; - height: 40px; + width: 36px; + height: 36px; padding: 8px; border-radius: 50%; - background: #3bb273; + background: var(--color-primary); stroke: #fff; - transition: .3s; + transition: background var(--transition-fast); flex-shrink: 0; } @@ -1784,15 +1812,16 @@ html { } .box__accordion_label svg:hover { - background: #fff; + background: var(--color-primary-hover); } .active .box__accordion_label svg { rotate: 45deg; + background: var(--color-primary-hover); } .box__accordion_label svg:hover g { - stroke: #3bb273; + stroke: #fff; } .camp-faq .box__accordion_content { @@ -1809,10 +1838,11 @@ html { display: flex; flex-direction: column; gap: 10px; - font-size: 18px; - line-height: 1.3; - color: #212121; + font-size: 16px; + line-height: 1.6; + color: var(--color-text-muted); padding-bottom: 20px; + font-family: var(--font-body); } /* faq END */ @@ -1831,16 +1861,19 @@ html { .contact_subtitle { margin-top: 10px; - font-size: 18px; + font-size: 16px; line-height: 1.2; font-weight: 600; + font-family: var(--font-display); + color: var(--color-text); } .contact_tel { - color: #3bb273; - font-size: 22px; + color: var(--color-primary); + font-size: clamp(18px, 2.2vw, 22px); line-height: 1; font-weight: 600; + font-family: var(--font-body); } .contact_social { @@ -1911,23 +1944,24 @@ html { } .lw-card { - background: #fff; - border-radius: 16px; + background: var(--color-bg); + border-radius: var(--card-radius); padding: 20px; - box-shadow: 0 2px 12px rgba(0,0,0,0.06); + box-shadow: var(--card-shadow); display: flex; flex-direction: column; - transition: box-shadow .2s; + transition: box-shadow var(--transition-normal), transform var(--transition-normal); } .lw-card:hover { - box-shadow: 0 4px 20px rgba(0,0,0,0.1); + box-shadow: var(--card-shadow-hover); + transform: translateY(-2px); } .lw-avatar { border-radius: 50%; overflow: hidden; flex-shrink: 0; - background: #e8f5e9; + background: rgba(59, 178, 160, 0.1); display: flex; align-items: center; justify-content: space-between; @@ -1990,8 +2024,8 @@ html { flex-shrink: 0; } .lw-badge--verified { - background: #e8f5e9; - color: #2e7d32; + background: rgba(59, 178, 160, 0.1); + color: var(--color-secondary); } .lw-stars { @@ -2000,7 +2034,7 @@ html { align-items: center; } .lw-star { - color: #e0e0e0; + color: var(--color-text-light); flex-shrink: 0; } .lw-star--filled { @@ -2010,7 +2044,7 @@ html { .lw-card__text { font-size: 14px; line-height: 1.55; - color: #444; + color: var(--color-text-muted); word-break: break-word; } @@ -2131,41 +2165,28 @@ html { } .hero-media-search .heading-1 { - font-family: 'Montserrat', sans-serif; + font-family: var(--font-display); font-weight: 900; - font-size: 2rem; - line-height: 1.05; - letter-spacing: -0.04em; - color: #1c2b2d; + font-size: var(--fs-display); + line-height: 1.1; + letter-spacing: -0.02em; + color: var(--color-text); margin: 0 0 0.5rem 0; text-align: center; } -@media (min-width: 1024px) { - .hero-media-search .heading-1 { - font-size: 2.56rem; /* desktop */ - text-align: center; - } -} .hero-subtitle-brand { - font-family: "Inter", sans-serif; - font-weight: 700; - font-size: 1.75rem; - line-height: 1.15; - color: #39b7ea; + font-family: var(--font-display); + font-weight: 600; + font-size: var(--fs-h2); + line-height: 1.25; + color: var(--color-secondary); margin: 0 0 0.6rem 0; } -@media (min-width: 1024px) { - .hero-subtitle-brand { - font-size: 1.75rem; - } -} + @media (max-width: 768px) { - .hero-subtitle-brand { - font-size: 2.2rem; /* +10% */ - } .hero-media-search .heading-1 { - font-size: 2rem; /* 32px */ + font-size: 32px; text-align: center; } .camp_title { font-size: 26px; padding-bottom: 24px; } @@ -2177,7 +2198,8 @@ html { } @media (min-width: 1024px) { .hero-media-search__content { - width: 420px; + width: 44%; + max-width: 520px; text-align: center; flex-shrink: 0; } @@ -2207,18 +2229,18 @@ html { font-family: 'Inter', sans-serif; line-height: 1.2; text-align: center; - color: #555; + color: var(--color-text-muted); margin: 0; } -.hero-media-search__propositions.on-desktop .wrapper__propositions { width: 100px; } -.hero-media-search__propositions.on-desktop img { width: 58px; height: auto; } -.hero-media-search__propositions.on-desktop h3 { font-size: 16px; } -.hero-media-search__propositions.on-desktop p { font-size: 14px; text-transform: capitalize; } +.hero-media-search__propositions.on-desktop .wrapper__propositions { width: 120px; } +.hero-media-search__propositions.on-desktop img { width: 72px; height: auto; } +.hero-media-search__propositions.on-desktop h3 { font-size: 20px; font-weight: 900; } +.hero-media-search__propositions.on-desktop p { font-size: 14px; text-transform: capitalize; font-weight: 500; } .hero-media-search__media { width: 100%; } @media (min-width: 1024px) { .hero-media-search__media { - width: calc(100% - 460px); + width: 52%; min-width: 0; } } @@ -2236,17 +2258,17 @@ html { display: block; width: 100%; height: auto; - border: 5px solid #fff; - border-radius: 24px; - box-shadow: 0 8px 32px rgba(255,107,0,0.15); + border: 4px solid #fff; + border-radius: 20px; + box-shadow: var(--shadow-lg); overflow: hidden; object-fit: cover; aspect-ratio: 16/9; } @media (min-width: 1024px) { .hero-media-search__image { - border-width: 10px; - max-width: 840px; + border-width: 6px; + max-width: 700px; } .about-us__image { border-width: 10px; @@ -2322,20 +2344,20 @@ html { } .hero-cta__text { - font-size: 16.1px; + font-size: 16px; text-align: center; - color: #555; + color: var(--color-text-muted); margin-bottom: 8px; font-weight: 500; } .hero-cta__note { - font-family: Inter, sans-serif; + font-family: var(--font-body); font-size: 14px; line-height: 1.5; - color: #555; + color: var(--color-text-muted); text-align: center; - margin-top: 18px !important; + margin-top: var(--space-lg) !important; max-width: 360px; margin-left: auto; margin-right: auto; @@ -2343,23 +2365,28 @@ html { } .btn-write-camp { - background-color: #39b7ea; + background: var(--color-primary); color: #fff; - border: 2px solid #0c161f; - padding: 12px 36px; - font-size: 16px; + border: none; + padding: 18px 48px; + font-size: 18px; font-weight: 700; - border-radius: 100px; + font-family: var(--font-display); + border-radius: var(--radius-full); cursor: pointer; - transition: .3s; + transition: background var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-fast); text-decoration: none; text-align: center; box-sizing: border-box; + display: inline-block; + box-shadow: 0 4px 14px rgba(232, 117, 58, 0.3); } .btn-write-camp:hover { - background-color: #2d9fd6; + background: var(--color-primary-hover); color: #fff; + transform: translateY(-2px); + box-shadow: 0 6px 20px rgba(232, 117, 58, 0.4); } .on-desktop { display: none; } @@ -2396,7 +2423,7 @@ html { } .section-bg[data-bg="hero"]::before { background: var(--bg-hero); } .section-bg[data-bg="white"]::before { background: var(--bg-white); } -.section-bg[data-bg="mint"]::before { background: var(--bg-mint); } +.section-bg[data-bg="mint"]::before { background: var(--color-bg-alt); } .suggestions__item { animation: none; } .banner_label { animation: none; } diff --git a/wp-content/themes/dekart/camp.css b/wp-content/themes/dekart/camp.css deleted file mode 100644 index 80611fa..0000000 --- a/wp-content/themes/dekart/camp.css +++ /dev/null @@ -1,3005 +0,0 @@ -:root { - --main-color: #BF568E; - --main-blue: #006DB7; - --main-yellow: #FFD43E; - --section-padding: clamp(30px, 6.25vw, 75px); -} - -html { - height: auto; -} - -/* =========================== */ -/* camp */ -.camp { - display: flex; - flex-direction: column; - gap: 0; - padding-top: 0; - padding-bottom: 0; -} - -.camp section { - padding-top: var(--section-padding); - padding-bottom: var(--section-padding); -} - -.container_camp { - width: 100%; - max-width: 1200px; - margin: 0 auto; - padding: 0 20px; -} - -p { - font-weight: 400; - margin: 0 0 30px 0; - padding: 0; -} - -.camp_title { - font-family: 'Montserrat', sans-serif; - font-weight: 700; - color: #1c2b2d; - font-size: 34px; - line-height: 1.25; - text-align: center; - padding-bottom: 32px; -} - -.camp_text { - font-family: Inter, sans-serif; - font-size: 18px; - line-height: 1.6; - color: #555; - text-align: center; - max-width: 700px; - margin: 0 auto 50px; - font-weight: 400; -} - -/* banner */ -.banner { - position: relative; - display: flex; - border-radius: 40px; - justify-content: space-between; - overflow: hidden; - background: rgb(58, 154, 104); - background: linear-gradient(45deg, rgba(58, 154, 104, 1) 0%, rgba(47, 204, 122, 1) 100%); -} - -.banner_label { - position: absolute; - padding: 10px 20px; - color: #fff; - font-size: 20px; - border-radius: 30px; -} - -.banner_label1 { - top: 45%; - left: 50%; - background-color: #e94563; - animation: animate1 4s infinite; -} - -.banner_label2 { - top: 80%; - left: 48%; - background-color: #ae5fcd; - animation: animate2 3s infinite; -} - -.banner_label3 { - top: 80%; - left: 80%; - background-color: #13acd0; - animation: animate3 2.5s infinite; - rotate: -15deg; -} - -@keyframes animate1 { - 0% { - rotate: 15deg; - } - - 50% { - rotate: 25deg; - } - - 100% { - rotate: 15deg; - } -} - -@keyframes animate2 { - 0% { - rotate: -15deg; - } - - 50% { - rotate: -25deg; - } - - 100% { - rotate: -15deg; - } -} - -@keyframes animate3 { - 0% { - scale: 1; - } - - 50% { - scale: 1.1; - } - - 100% { - scale: 1; - } -} - -.banner-add { - background-position: center; - background-repeat: no-repeat; - background-size: cover; -} - -.banner__left-part { - width: 50%; - display: flex; - flex-direction: column; - gap: 30px; - padding: 40px 30px 40px 40px; -} - -.banner_title { - color: #fff; - font-size: 41px; - line-height: 1.25; - font-weight: 600; -} - -.banner_text { - color: #fff; - font-size: 18px; - line-height: 1.3; - padding: 0; - text-align: center; -} - -.banner_text-min { - color: #fff; - font-size: 15px; - font-weight: 500; - opacity: 0.65; -} - -.banner_btn { - color: #fff; - font-size: 20px; - line-height: 1.2; - font-weight: 600; - text-transform: uppercase; - border: 2px solid #42425c; - border-radius: 50px; - background-color: #42425c; - transition: .3s; - padding: 20px 30px; - width: fit-content; -} - -.banner_btn:hover { - background-color: #fff; - color: #212121; -} - -.banner__right-part { - border-radius: 40px; - overflow: hidden; -} - -.modal-programs__content { - max-width: 860px; - overflow-y: auto; -} - -/* banner END */ - - -/* =========================== */ - -/* about-us */ - -/* =========================== */ - - - -.about-us { - background: #ffffff; - -} - - - -.about-us__wrapper { - position: relative; - display: flex; - flex-direction: row; - align-items: center; - gap: 60px; - padding: 0 75px; - overflow: visible; -} - - - -.about-us__image-col { - - flex: 0 0 45%; - - max-width: 45%; - -} - -.about-us__frame { - - position: relative; - - width: 100%; - -} - - - -.about-us__image { - - display: block; - - width: 100%; - - height: auto; - - border-radius: 24px; - - object-fit: cover; - - aspect-ratio: 4 / 3; - - border: 5px solid #fff; - box-shadow: 0 8px 32px rgba(255,107,0,0.15); - -} - - - -.about-us__image-placeholder { - - display: flex; - - flex-direction: column; - - align-items: center; - - justify-content: center; - - gap: 12px; - - width: 100%; - - aspect-ratio: 4 / 3; - - border-radius: 24px; - - background: #f0f0f0; - - color: #999; - - font-size: 14px; - - font-family: Inter, sans-serif; - - border: 2px dashed #ccc; - -} - - - -.about-us__image-placeholder svg { - - width: 48px; - - height: 48px; - - color: #bbb; - -} - - - -.about-us__content-col { - flex: 1; - min-width: 0; - display: flex; - flex-direction: column; - gap: 24px; -} - - - -.about-us__title { - text-align: left; - padding-bottom: 0; - font-size: 27px; -} - - - -.about-us__text { - font-family: Inter, sans-serif; - font-size: 18px; - line-height: 1.6; - font-weight: 400; - color: #555; - text-align: left; - max-width: 700px; - margin: 0 0; -} - -.about-us__social-proof { -} - -.about-us__badge { - - display: inline-block; - - font-family: Montserrat, sans-serif; - - font-size: 14px; - - font-weight: 700; - - color: #FF6B00; - - background: rgba(255,107,0,0.08); - - padding: 6px 16px; - - border-radius: 9999px; - -} - -.about-us__cta { -} - -.about-us__cta-link { - - display: inline-block; - - font-family: Montserrat, sans-serif; - - font-size: 16px; - - font-weight: 700; - - color: #fff; - - background: #FF6B00; - - padding: 12px 28px; - - border-radius: 9999px; - - text-decoration: none; - - transition: background 0.2s, transform 0.2s; - -} - -.about-us__cta-link:hover { - - background: #FF8533; - - transform: scale(1.05); - -} - - - -.about-us__doodle { - - position: absolute; - - object-fit: contain; - - - - pointer-events: none; - - z-index: 1; - -} - - - -.about-us__doodle--plane { - - width: 71px; - - height: 71px; - - top: -8px; - - right: -8px; - - - - -} - - -.about-us__doodle--heart { - - width: 30px; - - height: 30px; - - bottom: -8px; - - left: -8px; - - - -} - - - -@media (max-width: 780px) { - - .about-us__wrapper { - - flex-direction: column; - - padding: 24px 20px; - - gap: 24px; - - } - - .about-us__image-col { - - flex: 0 0 100%; - - max-width: 100%; - - } - - .about-us__title { - padding-bottom: 0; - - font-size: 22px; -} - - .about-us__text { - - font-size: 16px; - text-align: left; - - line-height: 1.6; - -} - - .about-us__doodle--plane { - - width: 81px; - - height: 81px; - - top: -12px; - - right: -12px; - -} - - .about-us__doodle--heart { - - width: 48px; - - height: 48px; - - bottom: -12px; - - left: -12px; - -} - -} - - -/* suggestions icon wrap */ -.suggestions__icon-wrap { - width: 72px; - height: 72px; - display: flex; - align-items: center; - justify-content: center; - background: rgba(255,107,0,0.1); - border-radius: 16px; - margin: 0 auto 16px; - flex-shrink: 0; -} - -.suggestions__icon { - width: 40px; - height: 40px; - object-fit: contain; -} - -/* suggestions card hover */ -.suggestions__item { - transition: transform 0.3s ease, box-shadow 0.3s ease; - cursor: default; -} - -.suggestions__item:hover { - transform: translateY(-6px); - box-shadow: 0 14px 32px rgba(255,107,0,0.18); -} - -/* scroll animation */ -.fade-up { - opacity: 0; - transform: translateY(30px); - transition: opacity 0.6s ease-out, transform 0.6s ease-out; -} - -.fade-up.visible { - opacity: 1; - transform: translateY(0); -} - -/* suggestions */ - -@keyframes sugFadeUp { - from { transform: translateY(24px) scale(0.97); opacity: 0; } - to { transform: translateY(0) scale(1); opacity: 1; } -} -@keyframes sugSpin { - from { transform: rotate(0deg); } - to { transform: rotate(360deg); } -} -@keyframes sugFloat { - 0%, 100% { transform: translateY(0); } - 50% { transform: translateY(-10px); } -} -@keyframes sugBounce { - 0%, 100% { transform: translateY(0) scale(1); } - 50% { transform: translateY(-12px) scale(1.05); } -} -.suggestions { - background: #f8f9fa; - - position: relative; - overflow: hidden; -} -@media (min-width: 1024px) { - .suggestions { - width: 100vw; - margin-left: calc(-50vw + 50%); - margin-right: calc(-50vw + 50%); - } -} -.suggestions .container { - max-width: 1216px; - margin: 0 auto; - padding: 0 24px; - position: relative; - z-index: 2; -} -.suggestions__subtitle { - font-family: Inter, sans-serif; - font-size: 18px; - line-height: 1.6; - color: #555; - text-align: center; - max-width: 700px; - margin: 0 auto 50px; -} -.suggestions-wrapper { - display: flex; - flex-wrap: wrap; - justify-content: center; - gap: 20px; -} -.suggestions-wrapper > .suggestions__item { - width: calc(25% - 15px); - min-width: 220px; - flex: 0 0 auto; -} -.suggestions__item { - border-radius: 20px; - padding: 32px 24px 36px; - box-shadow: 0 4px 16px rgba(0,0,0,0.04); - display: flex; - flex-direction: column; - align-items: center; - text-align: center; - gap: 12px; - position: relative; - overflow: hidden; - transform: translateY(0) scale(1); - transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.3s ease; -} -.suggestions__item::before { - content: ''; - position: absolute; - inset: 0; - opacity: 0; - transition: opacity 0.4s ease; - border-radius: 20px; - pointer-events: none; -} -.suggestions__item:nth-child(4n+1) { background: #e0f4ff; } -.suggestions__item:nth-child(4n+1)::before { background: linear-gradient(135deg, rgba(57,183,234,0.15), transparent); } -.suggestions__item:nth-child(4n+2) { background: #ffede0; } -.suggestions__item:nth-child(4n+2)::before { background: linear-gradient(135deg, rgba(255,107,0,0.15), transparent); } -.suggestions__item:nth-child(4n+3) { background: #e0fce8; } -.suggestions__item:nth-child(4n+3)::before { background: linear-gradient(135deg, rgba(0,200,83,0.15), transparent); } -.suggestions__item:nth-child(4n+4) { background: #f3e0ff; } -.suggestions__item:nth-child(4n+4)::before { background: linear-gradient(135deg, rgba(156,39,176,0.15), transparent); } -.suggestions__item:hover { - transform: translateY(-6px) scale(1.02); - box-shadow: 0 12px 40px rgba(0,0,0,0.12); -} -.suggestions__item:hover::before { opacity: 1; } -.suggestions__item_title { - font-family: "Montserrat", sans-serif; - font-size: 20px; - line-height: 1.3; - font-weight: 700; - color: #1c2b2d; - margin: 0; - position: relative; - z-index: 1; -} -.suggestions__item_text { - font-family: "Inter", sans-serif; - font-size: 14px; - line-height: 1.6; - color: #555; - margin: 0; - position: relative; - z-index: 1; -} -.suggestions__doodle { - position: absolute; - pointer-events: none; - z-index: 1; -} -.suggestions__doodle--star { - width: 40px; height: 40px; - top: 30px; left: 30px; - opacity: 0.18; - animation: sugSpin 20s linear infinite; - filter: invert(55%) sepia(80%) saturate(500%) hue-rotate(175deg); -} -.suggestions__doodle--gear { - width: 56px; height: 56px; - bottom: 40px; right: 40px; - opacity: 0.14; - animation: sugSpin 25s linear infinite reverse; -} -.suggestions__doodle--bounce { - width: 32px; height: 32px; - top: 50%; left: 60px; - opacity: 0.12; - animation: sugBounce 3s ease-in-out infinite; - filter: invert(45%) sepia(90%) saturate(2000%) hue-rotate(360deg); -} -.suggestions__doodle--float { - width: 28px; height: 28px; - top: 80px; right: 100px; - opacity: 0.13; - animation: sugFloat 5s ease-in-out infinite; - filter: invert(60%) sepia(80%) saturate(800%) hue-rotate(100deg); -} -.suggestions__doodle--paper { - width: 36px; height: 36px; - bottom: 80px; left: 120px; - opacity: 0.1; - animation: sugFloat 4.5s ease-in-out infinite reverse; - filter: invert(25%) sepia(60%) saturate(750%) hue-rotate(260deg); -} -.suggestions::before { - content: ''; - position: absolute; - inset: 0; - pointer-events: none; - z-index: 0; - background-image: radial-gradient(circle at 25% 25%, rgba(57,183,234,0.06) 1px, transparent 1px), - radial-gradient(circle at 75% 75%, rgba(255,107,0,0.05) 1px, transparent 1px); - background-size: 40px 40px, 60px 60px; -} -@media (prefers-reduced-motion: no-preference) { - .suggestions__item { animation: sugFadeUp 0.5s ease-out forwards; } - .suggestions__item:nth-child(1) { animation-delay: 0.08s; } - .suggestions__item:nth-child(2) { animation-delay: 0.16s; } - .suggestions__item:nth-child(3) { animation-delay: 0.24s; } - .suggestions__item:nth-child(4) { animation-delay: 0.32s; } - .suggestions__item:nth-child(5) { animation-delay: 0.40s; } - .suggestions__item:nth-child(6) { animation-delay: 0.48s; } -} -@media (max-width: 1023px) { - .suggestions-wrapper { gap: 16px; } - .suggestions-wrapper > .suggestions__item { width: calc(50% - 8px); min-width: 0; } -} -@media (max-width: 767px) { - .suggestions { padding: 40px 0; } - .suggestions__subtitle { font-size: 16px; margin: 0 auto 30px; padding: 0 20px; } - .suggestions-wrapper { gap: 14px; } - .suggestions-wrapper > .suggestions__item { width: 100%; } - .suggestions__item { padding: 24px 20px 28px; } - .suggestions__item_title { font-size: 18px; } - .suggestions__item_text { font-size: 13px; } - .suggestions__doodle { display: none; } - .suggestions::before { display: none; } -} -.infograph { - background: #faf7f2; - - width: 100vw; - margin-left: calc(-50vw + 50%); - padding-left: calc(50vw - 50%); - padding-right: calc(50vw - 50%); -} - -.infograph__item { - width: calc(25% - 20px); - display: flex; - flex-direction: column; - gap: 10px; - align-items: center; - text-align: center; -} - -.infograph__item_img { - border-radius: 30px; - width: 100%; - max-width: 180px; - aspect-ratio: 1 / 1; -} - -.infograph__item_title { - color: #9d9d9d; - font-size: 18px; - line-height: 1.25; - font-weight: 500; -} - -.infograph__item_data { - color: #212121; - font-size: 30px; - line-height: 1.25; - font-weight: 600; -} - -/* infograph END */ - -.infograph-wrapper { - display: flex; - flex-wrap: wrap; - justify-content: center; - gap: 30px; -} - -.infograph__item { - transition: transform 0.3s ease, box-shadow 0.3s ease; -} - -.infograph__item:hover { - transform: translateY(-4px); -} - -/* programs */ -.programs-wrapper { - flex-wrap: wrap; - display: flex; - gap: 30px; -} - -.programs__item { - width: calc(33.33% - 20px); - display: flex; - flex-direction: column; - gap: 20px; -} - -.programs__item_img { - border-radius: 30px; - width: auto; - height: 350px; - object-fit: cover; -} - -.programs__item p { - margin: 0; -} - -.scroll-icon-wrapper { - display: none; -} - -.programs__item_title { - font-size: 26px; - line-height: 1.2; - color: #212121; - font-weight: 600; - flex: 1; -} - -.programs__item_date { - font-weight: 600; - font-size: 18px; -} - -.programs__item_text { - font-size: 16px; - line-height: 1.3; - color: #212121; - font-weight: 500; -} - -.programs__item_price { - font-size: 26px; - color: #212121; - font-weight: 600; -} - -.btn-details { - width: fit-content; - color: #ffffff; - border: 2px solid #3bb273; - background-color: #3bb273; - font-weight: 600; - text-transform: uppercase; - border-radius: 30px; - padding: 15px 30px; - transition: .3s; -} - -.btn-details:hover { - background-color: transparent; - color: #212121; -} - -.modal-programs, -.modal-mentors { - position: fixed; - top: -12px; - right: -28px; - bottom: 0; - left: 0; - display: none; - align-items: center; - justify-content: center; - background-color: #000000ce; - z-index: 100; -} - -.modal-programs.open { - display: flex; -} - -.modal-mentors.open { - display: flex; -} - -.modal-programs-wrapper { - position: relative; - display: flex; - gap: 30px; - border-radius: 30px; - background-color: #fff; - padding: 40px; - max-width: 90%; - max-height: 90%; -} - -.modal-programs__content p { - margin-bottom: 15px; -} - -.programs__content { - white-space: pre-line; -} - -.btn-close-modal { - position: absolute; - bottom: 100%; - left: 100%; -} - -.btn-close-mentors { - position: absolute; - bottom: 100%; - left: 100%; -} - -.modal-programs__img { - min-width: 260px; - height: 260px; - border-radius: 30px; - overflow: hidden; -} - -.modal-programs__img img { - width: 100%; - height: 100%; - object-fit: contain; -} - -/* programs END */ -/* bring-child */ -.bring-child p { - margin-bottom: 0; -} - -.bring-child-wrapper { - display: flex; - gap: 40px; -} - -.part-day { - width: calc(50% - 20px); - padding: 30px; - border-radius: 40px; - border: 2px solid #e8e8e8; - display: flex; - flex-direction: column; - gap: 30px; - color: #212121; -} - -.block-row { - display: flex; - align-items: center; - gap: 10px; -} - -.part-day_title { - display: flex; - flex-direction: column; - gap: 10px; -} - -.part-day_title-text { - font-size: 30px; - line-height: 1.2; - font-weight: 600; -} - -.part-day_text { - font-size: 18px; - line-height: 1.3; - font-weight: 500; -} - -.part-day__price { - padding-bottom: 30px; - border-bottom: 1px solid #e8e8e8; - display: flex; - flex-direction: column; - gap: 10px; -} - -.part-day__price_price { - font-size: 34px; - line-height: 1; - font-weight: 600; -} - -.part-day__price_time { - font-size: 18px; - font-weight: 500; - border-radius: 30px; - color: #fff; - padding: 5px 10px; - margin-left: 10px; -} - -.camp-left-part .part-day__price_time { - border: 2px solid #3bb273; - background-color: #3bb273; -} - -.camp-right-part .part-day__price_time { - border: 2px solid #ae5fcd; - background-color: #ae5fcd; -} - -.non-bg { - background-color: transparent !important; - color: #212121; -} - -.part-day__price_text { - color: #9d9d9d; - font-size: 18px; - line-height: 1.3; - font-weight: 500; -} - -.btn-place { - padding: 20px 0; - color: #ffffff; - font-size: 20px; - line-height: 1.3; - font-weight: 600; - width: 100%; - border-radius: 50px; - text-transform: uppercase; - transition: .3s; -} - -.camp-left-part .btn-place { - border: 2px solid #3bb273; - background-color: #3bb273; -} - -.camp-right-part .btn-place { - border: 2px solid #ae5fcd; - background-color: #ae5fcd; -} - -.btn-place:hover { - background-color: transparent !important; - color: #212121; -} - -.part-day ul { - display: flex; - flex-direction: column; - gap: 10px; - color: #212121; - font-size: 18px; - line-height: 1.3; - font-weight: 500; - padding-left: 20px; -} - -.part-day ul li { - list-style: disc; -} - -/* bring-child END */ -/* mentors */ -.mentors-wrapper { - display: flex; - flex-wrap: wrap; - gap: 40px 30px; - justify-content: center; -} - -.mentors__item { - width: calc(25% - 23px); - display: flex; - flex-direction: column; - gap: 10px; - align-items: center; -} - -.mentors__item_img { - border-radius: 30px; - width: 100%; - height: auto; - max-height: 270px; - object-fit: contain; -} - -.mentors__item_name { - font-size: 26px; - line-height: 1.2; - color: #212121; - font-weight: 600; - text-align: center; - flex: 1; -} - -.mentors__item_text { - font-size: 18px; - line-height: 1.3; - color: #929292; - font-weight: 500; - text-align: center; - margin-bottom: 10px; -} - -/* modal-mentors */ -.modal-mentors-wrapper { - position: relative; - padding: 50px; - width: 90%; - height: 100%; - border-radius: 0; - background-color: #fff; - display: flex; - gap: 40px; - color: #212121; - height: fit-content; - max-height: 80%; - border-radius: 30px; -} - -.modal-mentors__content { - flex: 1; - display: flex; - flex-direction: column; - gap: 20px; - overflow-y: auto; -} - -.modal-mentors__content p { - margin-bottom: 0; -} - -.modal-mentors__content svg { - min-width: 30px; - width: 30px; - height: 30px; -} - -.modal-mentors_name { - font-size: 43px; - font-weight: 600; -} - -.modal-mentors_job { - font-size: 26px; - line-height: 1.25; - font-weight: 600; -} - -.modal-mentors__directions { - display: flex; - flex-wrap: wrap; - gap: 10px; -} - -.modal-mentors__directions span { - padding: 10px 20px; - background-color: #3bb273; - color: #fff; - font-size: 16px; - line-height: 1; - font-weight: 400; - border-radius: 30px; -} - -.modal-mentors__about { - display: flex; - gap: 20px; -} - -.about-item { - width: 50%; - padding: 20px; - border-radius: 20px; - background-color: #e7fff2; - display: flex; - gap: 10px; -} - -.mentors__about-col { - display: flex; - flex-direction: column; - gap: 16px; -} - -.mentors__about-col_title { - font-size: 20px; - line-height: 1.3; - font-weight: 600; -} - -.mentors__about-col_text { - font-size: 16px; - line-height: 1.3; - font-weight: 500; -} - -.modal-additional__education { - width: 100%; - padding: 20px; - border-radius: 20px; - border: 2px solid #f0f0f0; - display: flex; - gap: 10px; -} - -.modal-additional__education_list ul { - display: flex; - flex-wrap: wrap; - gap: 10px 30px; - font-size: 16px; - line-height: 1.3; - font-weight: 500; -} - -.modal-additional__education_list li { - width: calc(50% - 20px); - position: relative; - padding-left: 20px; -} - -.modal-additional__education_list li::before { - content: ''; - position: absolute; - width: 6px; - height: 6px; - border-radius: 50%; - background-color: #3bb273; - top: 5px; - left: 0; -} - -/* modal-mentors END */ -/* mentors END */ - -/* routine */ -.routine p { - margin-bottom: 0; -} - -.routine-wrapper { - position: relative; - display: flex; - margin-left: 20px; - flex-direction: column; - gap: 40px; - color: #212121; -} - -.routine__item { - position: relative; - display: flex; - gap: 30px; -} - -.routine__item_time { - width: 160px; - font-size: 24px; - line-height: 1.2; - font-weight: 600; - text-align: end; -} - -.routine__item_time-mobile { - display: none; -} - -.routine__item_circle { - position: relative; - margin-top: 4px; - width: 22px; - height: 22px; - border-radius: 50%; - background-color: #3bb273; - border: 4px solid #fff; -} - -.routine__item::before { - content: ''; - position: absolute; - top: 20px; - width: 2px; - background-color: #d4d4d4; - bottom: -50px; - left: 200px; -} - -.routine__item_text { - flex: 1; - display: flex; - flex-direction: column; - gap: 10px; -} - -.routine__item_text-title { - font-size: 24px; - line-height: 1.2; - font-weight: 600; -} - -.routine__item_text-text { - font-size: 18px; - line-height: 1.3; - font-weight: 500; -} - -.routine__item:last-child::before { - display: none; -} - -/* routine END*/ -/* foto */ -.camp-foto-wrapper { - display: flex; - gap: 20px; -} - -.foto-left-part { - width: 50%; - overflow: hidden; -} - -.camp-swiper-foto { - position: relative; - margin-bottom: 5px; -} - -.swiper-button-next:after, -.swiper-button-prev:after { - color: #fff; - font-weight: 600; - font-size: 14px; - padding: 5px; - border-radius: 50%; - height: 28px; - width: 28px; - display: flex; - background: #3bb273; - align-items: center; - justify-content: center; -} - -/* swiper */ -.swiper-slide { - text-align: center; - font-size: 18px; - background: #fff; - - /* Center slide text vertically */ - display: -webkit-box; - display: -ms-flexbox; - display: -webkit-flex; - display: flex; - -webkit-box-pack: center; - -ms-flex-pack: center; - -webkit-justify-content: center; - justify-content: center; - -webkit-box-align: center; - -ms-flex-align: center; - -webkit-align-items: center; - align-items: center; -} - -.swiper-slide img { - display: block; - width: 100%; - height: 100%; - object-fit: cover; -} - -.camp-swiper-foto { - height: 350px; -} - -.camp-swiper-foto img { - border-radius: 30px; -} - -.camp-swiper-foto-thumbsSlider { - height: 80px; -} - -.camp-swiper-foto-thumbsSlider img { - width: 100%; - height: auto; - aspect-ratio: 1 / 1; - border-radius: 10px; - transition: .2s; - cursor: pointer; -} - -.camp-swiper-foto-thumbsSlider img:hover { - opacity: .6; -} - - -.foto-content { - width: calc(50% - 20px); - white-space: pre-line; -} - -/* swiper END */ - -/* foto modal */ -.camp-foto-modal { - position: fixed; - inset: 0; - z-index: 9999; - display: none; - align-items: center; - justify-content: center; -} -.camp-foto-modal--open { - display: flex; -} -.camp-foto-modal__overlay { - position: absolute; - inset: 0; - background: rgba(0,0,0,0.85); - cursor: pointer; -} -.camp-foto-modal__content { - position: relative; - max-width: 90vw; - max-height: 90vh; -} -.camp-foto-modal__img { - display: block; - max-width: 90vw; - max-height: 85vh; - width: auto; - height: auto; - border-radius: 12px; - object-fit: contain; - box-shadow: 0 8px 40px rgba(0,0,0,0.4); -} -.camp-foto-modal__close { - position: absolute; - top: -40px; - right: 0; - background: none; - border: none; - cursor: pointer; - padding: 8px; - z-index: 10; - transition: opacity 0.2s; -} -.camp-foto-modal__close:hover { - opacity: 0.7; -} -.camp-foto-slide { - cursor: pointer; -} -/* foto modal END */ - -/* faq */ -.faq-wrapper { - display: flex; - gap: 30px; -} - -.camp-faq .box__accordion_label::after { - background-image: none !important; -} - -.accordion { - width: 50%; - display: flex; - flex-direction: column; - gap: 10px; - border-top: 1px solid #ccc; -} - -.camp-faq .accordion .box__accordion { - position: relative; - cursor: pointer; - border-bottom: 1px solid #ccc; - border-radius: 0; -} - -.camp-faq .box__accordion_label { - position: relative; - padding: 20px 0; - cursor: pointer; - display: flex; - align-items: center; - gap: 20px; - justify-content: space-between; -} - -.camp-faq .box__accordion_label span { - font-size: 26px; - line-height: 1.2; -} - -.box__accordion_label svg { - width: 40px; - height: 40px; - padding: 8px; - border-radius: 50%; - background: #3bb273; - stroke: #fff; - transition: .3s; - flex-shrink: 0; -} - -.camp-faq .accordion .box__accordion .box__accordion_label { - display: flex; - align-items: center; - justify-content: space-between; - padding-left: 0; -} - -.box__accordion_label svg g { - stroke: #fff; -} - -.box__accordion_label svg:hover { - background: #fff; -} - -.active .box__accordion_label svg { - rotate: 45deg; -} - -.box__accordion_label svg:hover g { - stroke: #3bb273; -} - -.camp-faq .box__accordion_content { - display: flex; - position: relative; - overflow: hidden; - max-height: 0; - transition: .3s; - gap: 20px; - align-items: center; -} - -.box__accordion_content-text { - display: flex; - flex-direction: column; - gap: 10px; - font-size: 18px; - line-height: 1.3; - color: #212121; - padding-bottom: 20px; -} - -/* faq END */ -/* contact */ -.contact-wrapper { - display: flex; - gap: 30px; -} - -.contact-content { - width: 40%; - display: flex; - flex-direction: column; - gap: 10px; -} - -.contact_subtitle { - margin-top: 10px; - font-size: 18px; - line-height: 1.2; - font-weight: 600; -} - -.contact_tel { - color: #3bb273; - font-size: 22px; - line-height: 1; - font-weight: 600; -} - -.contact_social { - display: flex; - gap: 15px; -} - -.contact-map { - display: flex; - border-radius: 30px; - overflow: hidden; - flex: 1; - height: 450px; - align-items: center; - justify-content: center; -} - -/* contact END */ -/* reviews */ -.camp-reviews-wrapper { - position: relative; -} - -.camp-reviews-wrapper .reviews__item-client_name { - font-size: 16px; - font-weight: 400; - text-align: start; -} - -.camp-reviews-wrapper .reviews__item-client_text { - text-align: start; - line-height: 1.4; - font-size: 16px; - font-weight: 400; -} - -.camp-reviews-wrapper .reviews-wrapper { - margin-top: -12px; -} - -.camp-reviews-wrapper .reviews__item, -.camp-reviews-wrapper .reviews__item-wrapper { - min-height: auto; - width: 100%; -} -.camp-reviews-wrapper .reviews__item-wrapper:before { - display: none; -} -.camp-reviews-wrapper .custom-button-next, -.camp-reviews-wrapper .custom-button-prev { - position: absolute; - top: var(--swiper-navigation-top-offset, 50%); - width: 54px; - height: 54px; - margin-top: calc(0px -(var(--swiper-navigation-size) / 2)); - z-index: 10; - cursor: pointer; - display: flex; - align-items: center; - justify-content: center; - color: var(--swiper-navigation-color, var(--swiper-theme-color)); - background-image: none; -} - -.camp-reviews-wrapper .custom-button-next { - right: -50px; -} -.camp-reviews-wrapper .custom-button-prev { - left: -50px; -} - -.camp-reviews-wrapper .custom-button-next:after { - content: 'next'; -} - -.camp-reviews-wrapper .custom-button-next:after, -.camp-reviews-wrapper .custom-button-prev:after { - font-family: swiper-icons; - content: ''; - color: #fff; - font-weight: 600; - font-size: 26px; - padding: 5px; - border-radius: 50%; - height: 54px; - width: 54px; - display: flex; - background: #3bb273; - align-items: center; - justify-content: center; -} - -.camp-reviews-wrapper .custom-button-next:after { - content: 'prev'; -} - -.camp-reviews-wrapper .custom-button-prev:after { - content: 'prev'; -} - -.camp-reviews-wrapper .swiper-button-disabled { - opacity: 0; -} - -/* reviews END*/ - -.modal-camp-request-form { - position: fixed; - top: -12px; - left: 0; - width: 100%; - height: 100%; - background-color: #000; - display: flex; - align-items: center; - justify-content: center; - z-index: 99999; -} - -/* camp END*/ - -/* ═══════════════════════════════════════════════ - HERO — Galileo-style (городской лагерь) - ═══════════════════════════════════════════════ */ - -.hero-media-search { - background-color: #f6f1e9; - overflow: hidden; - -} -@media (min-width: 1024px) { - .hero-media-search { - - width: 100vw; - margin-left: calc(-50vw + 50%); - margin-right: calc(-50vw + 50%); - } -} - -.hero-media-search .container { - max-width: 1216px; - margin: 0 auto; - padding: 0 24px; -} - -.hero-media-search__container { - align-items: stretch; - display: flex; - flex-direction: column; - gap: 20px; - justify-content: flex-start; -} -@media (min-width: 1024px) { - .hero-media-search__container { - align-items: center; - flex-direction: row; - gap: 40px; - justify-content: space-between; - } -} - -.hero-media-search .heading-1 { - font-family: 'Montserrat', sans-serif; - font-weight: 900; - font-size: 2rem; - line-height: 1.05; - letter-spacing: -0.04em; - color: #1c2b2d; - margin: 0 0 0.5rem 0; - text-align: center; -} -@media (min-width: 1024px) { - .hero-media-search .heading-1 { - font-size: 2.56rem; /* desktop */ - text-align: center; - } -} - -.hero-subtitle-brand { - font-family: "Inter", sans-serif; - font-weight: 700; - font-size: 1.75rem; - line-height: 1.15; - color: #39b7ea; - margin: 0 0 0.6rem 0; -} -@media (min-width: 1024px) { - .hero-subtitle-brand { - font-size: 1.75rem; - } -} -@media (max-width: 768px) { - .hero-subtitle-brand { - font-size: 2.2rem; /* +10% */ - } - .hero-media-search .heading-1 { - font-size: 2rem; /* 32px */ - text-align: center; - } - .camp_title { font-size: 26px; padding-bottom: 24px; } - .about-us__title { font-size: 21px; text-align: left; } -} - - -.hero-media-search__content { - text-align: center; -} -@media (min-width: 1024px) { - .hero-media-search__content { - width: 420px; - text-align: center; - flex-shrink: 0; - } -} - -.hero-media-search__propositions.on-desktop { - display: flex; - gap: 0 25px; - justify-content: center; - margin: 15px 0 30px; -} -.hero-media-search .wrapper__propositions { - display: flex; - flex-direction: column; - align-items: center; -} -.hero-media-search .wrapper__propositions h3 { - font-family: "Montserrat", sans-serif; - font-weight: 800; - line-height: 1.2; - text-align: center; - color: #1c2b2d; - margin: 4px 0 0; -} -.hero-media-search .wrapper__propositions p { - font-weight: 500; - font-family: 'Inter', sans-serif; - line-height: 1.2; - text-align: center; - color: #555; - margin: 0; -} -.hero-media-search__propositions.on-desktop .wrapper__propositions { width: 100px; } -.hero-media-search__propositions.on-desktop img { width: 58px; height: auto; } -.hero-media-search__propositions.on-desktop h3 { font-size: 16px; } -.hero-media-search__propositions.on-desktop p { font-size: 14px; text-transform: capitalize; } - - -.hero-media-search__media { width: 100%; } -@media (min-width: 1024px) { - .hero-media-search__media { - width: calc(100% - 460px); - min-width: 0; - } -} - -.hero-media-search__frame { - position: relative; - aspect-ratio: 16 / 9; - width: 100%; -} -@media (max-width: 991px) { - .hero-media-search__frame { aspect-ratio: 16 / 10; } -} - -.hero-media-search__image { - display: block; - width: 100%; - height: auto; - border: 5px solid #fff; - border-radius: 24px; - box-shadow: 0 8px 32px rgba(255,107,0,0.15); - overflow: hidden; - object-fit: cover; - aspect-ratio: 16/9; -} -@media (min-width: 1024px) { - .hero-media-search__image { - border-width: 10px; - max-width: 840px; - } - .about-us__image { - border-width: 10px; - } - .about-us__doodle--plane { - width: 123px; - height: 123px; - top: -28px; - right: -28px; - filter: drop-shadow(0 0 0 5px #fff) drop-shadow(0 0 0 5px #fff); - } - .about-us__doodle--heart { - width: 100px; - height: 100px; - bottom: -28px; - left: -28px; - filter: drop-shadow(0 0 0 5px #fff) drop-shadow(0 0 0 5px #fff); - } -} - -.hero-media-search__frame .doodle { - position: absolute; - object-fit: contain; -} -.hero-media-search__frame .doodle--top-left { - height: 79px; - width: 84px; - left: -30px; - top: -12px; -} -@media (min-width: 1024px) { - .hero-media-search__frame .doodle--top-left { - height: 172px; - width: 183px; - left: -47px; - top: -54px; - } -} -.hero-media-search__frame .doodle--bottom-right { - height: 100px; - width: 99px; - bottom: -34px; - right: -16px; -} -@media (min-width: 1024px) { - .hero-media-search__frame .doodle--bottom-right { - height: 196px; - width: 195px; - bottom: -46px; - right: -44px; - } -} - -.hero-media-search__propositions.on-mobile { - display: none; - gap: 0 25px; - justify-content: center; - margin: 30px 0 15px; -} -@media (max-width: 1023px) { - .hero-media-search__propositions.on-desktop { display: none; } - .hero-media-search__propositions.on-mobile { display: flex; } -} -.hero-media-search__propositions.on-mobile .wrapper__propositions { width: 84px; } -.hero-media-search__propositions.on-mobile img { width: 48px; height: auto; } -.hero-media-search__propositions.on-mobile h3 { font-size: 14px; } -.hero-media-search__propositions.on-mobile p { font-size: 14px; } - - -.hero-cta__text { - font-size: 16.1px; - text-align: center; - color: #555; - margin-bottom: 8px; - font-weight: 500; -} - - .hero-cta__note { - margin-top: 24px; - text-align: center; - margin-left: auto; - margin-right: auto; - } - -.btn-write-camp { - background-color: #39b7ea; - color: #fff; - border: 2px solid #0c161f; - padding: 12px 36px; - font-size: 16px; - font-weight: 700; - border-radius: 100px; - cursor: pointer; - transition: .3s; - text-decoration: none; - text-align: center; - box-sizing: border-box; -} - -.btn-write-camp:hover { - background-color: #2d9fd6; - color: #fff; -} - -.on-desktop { display: none; } -.on-mobile { display: block; } - -@media (min-width: 768px) { - .on-desktop { display: block; } - .on-mobile { display: none; } -} - -.hero-cta.on-desktop { display: none; } -.hero-cta.on-mobile { display: block; } - -@media (min-width: 768px) { - .hero-cta.on-desktop { display: block; } - .hero-cta.on-mobile { display: none; } -} - -/* ═══════════════════════════════════════════════ - SECTION BACKGROUNDS — full-width, unique per section - ═══════════════════════════════════════════════ */ - -.camp section:not(.hero-media-search) { - position: relative; -} -.camp section::before { - content: ''; - position: absolute; - top: 0; - bottom: 0; - left: calc(-50vw + 50%); - width: 100vw; - z-index: -1; -} - -.hero-media-search::before { background: #f6f1e9; } -.about-us::before { background: #ffffff; } -.suggestions::before { background: #f5faf7; } -.infograph::before { background: #faf7f2; } -.programs::before { background: #faf5eb; } -.bring-child::before { background: #f8f5ff; } -.mentors::before { background: #f0f7fa; } -.routine::before { background: #ffffff; } -.foto::before { background: #faf7f2; } -.camp-reviews::before { background: #f6f1e9; } -.camp-faq::before { background: #ffffff; } -.camp-contact::before { background: #f5faf7; } - -@media (prefers-reduced-motion: reduce) { - .fade-up { opacity: 1; transform: none; transition: none; } - .fade-up.visible { opacity: 1; transform: none; } - .suggestions__item { animation: none; } - .banner_label { animation: none; } - .scroll-icon-wrapper { display: none; } -} - -@media (width > 780px) and (width < 1200px) { - .camp { - gap: 0; - padding-top: 0; - padding-bottom: 0; - } - - .container_camp { - max-width: clamp(780px, 100vw, 1200px); - padding: 0 clamp(13px, 1.67vw, 20px); - } - - .camp_title { - font-size: clamp(29px, 3.75vw, 45px); - padding-bottom: clamp(29px, 3.75vw, 45px); - } - - .camp_text { - font-size: clamp(12px, 1.5vw, 18px); - } - - .banner { - border-radius: clamp(26px, 3.33vw, 40px); - } - - .banner_label { - padding: clamp(6px, .83vw, 10px) clamp(13px, 1.67vw, 20px); - font-size: clamp(13px, 1.67vw, 20px); - border-radius: clamp(20px, 2.5vw, 30px); - } - - .banner__left-part { - gap: clamp(20px, 2.5vw, 30px); - padding: clamp(26px, 3.33vw, 40px) clamp(20px, 2.5vw, 30px) clamp(26px, 3.33vw, 40px) clamp(26px, 3.33vw, 40px); - } - - .banner_title { - font-size: clamp(27px, 3.42vw, 41px); - } - - .banner_text { - font-size: clamp(12px, 1.5vw, 18px); - } - - .banner_text-min { - font-size: clamp(10px, 1.25vw, 15px); - } - - .banner_btn { - font-size: clamp(13px, 1.67vw, 20px); - border: clamp(1px, .17vw, 2px) solid #42425c; - border-radius: clamp(33px, 4.17vw, 50px); - padding: clamp(13px, 1.67vw, 20px) clamp(20px, 2.5vw, 30px); - } - - .banner__right-part { - border-radius: clamp(26px, 3.33vw, 40px); - } - - .modal-programs__content { - max-width: clamp(559px, 71.67vw, 860px); - } - - margin-top: clamp(20px, 2.5vw, 30px); - 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); - } - - .programs__item { - width: calc(33.33% - clamp(13px, 1.67vw, 20px)); - gap: clamp(13px, 1.67vw, 20px); - } - - .programs__item_img { - border-radius: clamp(20px, 2.5vw, 30px); - height: clamp(228px, 29.17vw, 350px); - } - - .programs__item_title { - font-size: clamp(17px, 2.17vw, 26px); - } - - .programs__item_date { - font-size: clamp(12px, 1.5vw, 18px); - } - - .programs__item_text { - font-size: clamp(10px, 1.33vw, 16px); - } - - .programs__item_price { - font-size: clamp(17px, 2.17vw, 26px); - } - - .btn-details { - border: clamp(1px, .17vw, 2px) solid #3bb273; - border-radius: clamp(20px, 2.5vw, 30px); - padding: clamp(10px, 1.25vw, 15px) clamp(20px, 2.5vw, 30px); - } - - .modal-programs-wrapper { - gap: clamp(20px, 2.5vw, 30px); - border-radius: clamp(20px, 2.5vw, 30px); - padding: clamp(26px, 3.33vw, 40px); - } - - .modal-programs__content p { - margin-bottom: clamp(10px, 1.25vw, 15px); - } - - .modal-programs__img { - min-width: clamp(169px, 21.67vw, 260px); - height: clamp(169px, 21.67vw, 260px); - border-radius: clamp(20px, 2.5vw, 30px); - } - - .bring-child-wrapper { - gap: clamp(26px, 3.33vw, 40px); - } - - .part-day { - width: calc(50% - clamp(13px, 1.67vw, 20px)); - padding: clamp(20px, 2.5vw, 30px); - border-radius: clamp(26px, 3.33vw, 40px); - border: clamp(1px, .17vw, 2px) solid #e8e8e8; - gap: clamp(20px, 2.5vw, 30px); - } - - .block-row { - gap: clamp(6px, .83vw, 10px); - } - - .part-day_title { - gap: clamp(6px, .83vw, 10px); - } - - .part-day_title-text { - font-size: clamp(20px, 2.5vw, 30px); - } - - .part-day_text { - font-size: clamp(12px, 1.5vw, 18px); - } - - .part-day__price { - padding-bottom: clamp(20px, 2.5vw, 30px); - border-bottom: 1px solid #e8e8e8; - gap: clamp(6px, .83vw, 10px); - } - - .part-day__price_price { - font-size: clamp(29px, 3.75vw, 45px); - } - - .part-day__price_time { - font-size: clamp(12px, 1.5vw, 18px); - border-radius: clamp(20px, 2.5vw, 30px); - padding: clamp(3px, .42vw, 5px) clamp(6px, .83vw, 10px); - margin-left: clamp(6px, .83vw, 10px); - } - - .camp-left-part .part-day__price_time { - border: clamp(1px, .17vw, 2px) solid #3bb273; - } - - .camp-right-part .part-day__price_time { - border: clamp(1px, .17vw, 2px) solid #ae5fcd; - } - - .part-day__price_text { - font-size: clamp(12px, 1.5vw, 18px); - } - - .btn-place { - padding: clamp(13px, 1.67vw, 20px) 0; - font-size: clamp(13px, 1.67vw, 20px); - border-radius: clamp(33px, 4.17vw, 50px); - } - - .camp-left-part .btn-place { - border: clamp(1px, .17vw, 2px) solid #3bb273; - } - - .camp-right-part .btn-place { - border: clamp(1px, .17vw, 2px) solid #ae5fcd; - } - - .part-day ul { - gap: clamp(6px, .83vw, 10px); - font-size: clamp(12px, 1.5vw, 18px); - padding-left: clamp(13px, 1.67vw, 20px); - } - - .mentors-wrapper { - gap: clamp(26px, 3.33vw, 40px) clamp(20px, 2.5vw, 30px); - } - - .mentors__item { - width: calc(25% - clamp(15px, 1.92vw, 23px)); - gap: clamp(6px, .83vw, 10px); - } - - .mentors__item_img { - border-radius: clamp(20px, 2.5vw, 30px); - } - - .mentors__item_name { - font-size: clamp(17px, 2.17vw, 26px); - } - - .mentors__item_text { - font-size: clamp(12px, 1.5vw, 18px); - margin-bottom: clamp(6px, .83vw, 10px); - } - - .modal-mentors-wrapper { - padding: clamp(33px, 4.17vw, 50px); - gap: clamp(26px, 3.33vw, 40px); - } - - .modal-mentors__content { - gap: clamp(13px, 1.67vw, 20px); - } - - .modal-mentors__content svg { - min-width: clamp(20px, 2.5vw, 30px); - width: clamp(20px, 2.5vw, 30px); - height: clamp(20px, 2.5vw, 30px); - } - - .modal-mentors_name { - font-size: clamp(28px, 3.58vw, 43px); - } - - .modal-mentors_job { - font-size: clamp(17px, 2.17vw, 26px); - } - - .modal-mentors__directions { - gap: clamp(6px, .83vw, 10px); - } - - .modal-mentors__directions span { - padding: clamp(6px, .83vw, 10px) clamp(13px, 1.67vw, 20px); - font-size: clamp(10px, 1.33vw, 16px); - border-radius: clamp(20px, 2.5vw, 30px); - } - - .modal-mentors__about { - gap: clamp(13px, 1.67vw, 20px); - } - - .about-item { - padding: clamp(13px, 1.67vw, 20px); - border-radius: clamp(13px, 1.67vw, 20px); - gap: clamp(6px, .83vw, 10px); - } - - .mentors__about-col { - gap: clamp(10px, 1.33vw, 16px); - } - - .mentors__about-col_title { - font-size: clamp(13px, 1.67vw, 20px); - } - - .mentors__about-col_text { - font-size: clamp(10px, 1.33vw, 16px); - } - - .modal-additional__education { - padding: clamp(13px, 1.67vw, 20px); - border-radius: clamp(13px, 1.67vw, 20px); - border: clamp(1px, .17vw, 2px) solid #f0f0f0; - gap: clamp(6px, .83vw, 10px); - } - - .modal-additional__education_list ul { - gap: clamp(6px, .83vw, 10px) clamp(20px, 2.5vw, 30px); - font-size: clamp(10px, 1.33vw, 16px); - } - - .modal-additional__education_list li { - width: calc(50% - clamp(13px, 1.67vw, 20px)); - padding-left: clamp(13px, 1.67vw, 20px); - } - - .modal-additional__education_list li::before { - width: clamp(4px, .5vw, 6px); - height: clamp(4px, .5vw, 6px); - top: clamp(3px, .42vw, 5px); - } - - .routine-wrapper { - margin-left: clamp(13px, 1.67vw, 20px); - gap: clamp(26px, 3.33vw, 40px); - } - - .routine__item { - gap: clamp(20px, 2.5vw, 30px); - } - - .routine__item_time { - width: clamp(104px, 13.33vw, 160px); - font-size: clamp(16px, 2vw, 24px); - } - - .routine__item_circle { - margin-top: clamp(3px, .33vw, 4px); - width: clamp(14px, 1.83vw, 22px); - height: clamp(14px, 1.83vw, 22px); - border: clamp(3px, .33vw, 4px) solid #fff; - } - - .routine__item::before { - top: clamp(13px, 1.67vw, 20px); - width: clamp(1px, .17vw, 2px); - bottom: -clamp(33px, 4.17vw, 50px); - left: clamp(130px, 16.67vw, 200px); - } - - .routine__item_text { - gap: clamp(6px, .83vw, 10px); - } - - .routine__item_text-title { - font-size: clamp(16px, 2vw, 24px); - } - - .routine__item_text-text { - font-size: clamp(12px, 1.5vw, 18px); - } - - .camp-foto-wrapper { - gap: clamp(13px, 1.67vw, 20px); - } - - .camp-swiper-foto { - margin-bottom: clamp(3px, .42vw, 5px); - } - - .swiper-button-next:after, - .swiper-button-prev:after { - font-size: clamp(9px, 1.17vw, 14px); - padding: clamp(3px, .42vw, 5px); - height: clamp(18px, 2.33vw, 28px); - width: clamp(18px, 2.33vw, 28px); - } - - .swiper-slide { - font-size: clamp(12px, 1.5vw, 18px); - } - - .camp-swiper-foto { - height: clamp(228px, 29.17vw, 350px); - } - - .camp-swiper-foto img { - border-radius: clamp(20px, 2.5vw, 30px); - } - - .camp-swiper-foto-thumbsSlider { - height: clamp(52px, 6.67vw, 80px); - } - - .camp-swiper-foto-thumbsSlider img { - border-radius: clamp(6px, .83vw, 10px); - } - - - - - - - - - - - - .foto-content { - width: calc(50% - clamp(13px, 1.67vw, 20px)); - } - - .faq-wrapper { - gap: clamp(20px, 2.5vw, 30px); - } - - .accordion { - gap: clamp(6px, .83vw, 10px); - border-top: 1px solid #ccc; - } - - .camp-faq .accordion .box__accordion { - border-bottom: 1px solid #ccc; - } - - .camp-faq .box__accordion_label { - padding: clamp(13px, 1.67vw, 20px) 0; - gap: clamp(13px, 1.67vw, 20px); - } - - .camp-faq .box__accordion_label span { - font-size: clamp(17px, 2.17vw, 26px); - } - - .box__accordion_label svg { - width: clamp(26px, 3.33vw, 40px); - height: clamp(26px, 3.33vw, 40px); - padding: clamp(5px, .67vw, 8px); - } - - .camp-faq .box__accordion_content { - gap: clamp(13px, 1.67vw, 20px); - } - - .box__accordion_content-text { - gap: clamp(6px, .83vw, 10px); - font-size: clamp(12px, 1.5vw, 18px); - padding-bottom: clamp(13px, 1.67vw, 20px); - } - - .contact-wrapper { - gap: clamp(20px, 2.5vw, 30px); - } - - .contact-content { - gap: clamp(6px, .83vw, 10px); - } - - .contact_subtitle { - margin-top: clamp(6px, .83vw, 10px); - font-size: clamp(12px, 1.5vw, 18px); - } - - .contact_tel { - font-size: clamp(13px, 1.7vw, 20px); - } - - .contact_social { - gap: clamp(10px, 1.25vw, 15px); - } - - .contact-map { - border-radius: clamp(20px, 2.5vw, 30px); - height: clamp(292px, 37.5vw, 450px); - } - - .camp-reviews-wrapper .reviews__item-client_name { - font-size: clamp(10px, 1.33vw, 16px); - } - - .camp-reviews-wrapper .reviews__item-client_text { - font-size: clamp(10px, 1.33vw, 16px); - } - - .camp-reviews-wrapper .custom-button-next, - .camp-reviews-wrapper .custom-button-prev { - width: clamp(35px, 4.5vw, 54px); - height: clamp(35px, 4.5vw, 54px); - margin-top: calc(1px -(var(--swiper-navigation-size) / 2)); - } - - .camp-reviews-wrapper .custom-button-next:after, - .camp-reviews-wrapper .custom-button-prev:after { - font-size: clamp(17px, 2.17vw, 26px); - padding: clamp(3px, .42vw, 5px); - height: clamp(35px, 4.5vw, 54px); - width: clamp(35px, 4.5vw, 54px); - } - -} - -@media (width < 780px) { - - - .camp { - gap: 0; - } - - .camp section { - margin-top: 0; - margin-bottom: 0; - } - - .camp_title { - font-size: 30px; - padding-bottom: 25px; - } - - - - .banner { - border-radius: 0 0 40px 40px; - margin-top: 0; - } - - .banner_title { - font-size: 27px; - width: 100%; - } - - .banner_text { - font-size: 16px; - } - - .banner__right-part { - display: none; - } - - .banner__left-part { - width: 100%; - padding: 30px; - } - - .banner_btn { - margin: 100px auto 0; - } - - .banner_label { - padding: 5px 10px; - font-size: 16px; - } - - .banner_label1 { - top: 62%; - left: 39%; - } - - .banner_label2 { - top: 69%; - left: 10%; - } - - .banner_label3 { - top: 65%; - right: 10%; - left: auto; - rotate: -18deg; - } - - .banner_btn { - font-size: 18px; - } - - .camp section { - padding-left: 15px; - padding-right: 15px; - } - - .camp_text { - font-size: 16px; - margin: 0 auto 30px; - padding: 0 20px; - } - - - .infograph { - background: #faf7f2; - - padding-left: calc(50vw - 50%); - padding-right: calc(50vw - 50%); - } - - .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; - } - - .programs .camp_title { - padding: 0 15px 25px 15px; - } - - .scroll-icon-wrapper { - margin-top: -20px; - display: flex; - justify-content: flex-end; - padding-right: 15px; - } - - .programs-wrapper { - width: 100%; - display: flex; - flex-wrap: nowrap; - gap: 30px; - overflow-x: scroll; - padding: 0 15px 20px 15px; - } - - .programs-wrapper::-webkit-scrollbar { - width: 10px; - height: 10px; - } - - .programs-wrapper::-webkit-scrollbar-thumb { - background-color: #ccc; - border-radius: 8px; - border: 1px solid #8b8b8b; - } - - .programs-wrapper::-webkit-scrollbar-track { - border-radius: 5px; - } - - .programs__item { - width: 100%; - gap: 10px; - } - - .programs__item_img { - height: 250px; - } - - .programs__item_title { - font-size: 22px; - } - - .btn-details { - width: 100%; - } - - .banner-add { - border-radius: 40px; - background-color: #3bb273 !important; - background-image: none !important; - } - - .banner-add .banner_title { - width: 100%; - } - - .banner-add .banner__left-part { - gap: 20px; - } - - .banner-add .banner_btn { - margin-top: -12px; - width: 100%; - } - - .banner_text-min { - margin: 0; - } - - .bring-child-wrapper { - gap: 20px; - flex-direction: column; - } - - .part-day { - width: 100%; - gap: 15px; - padding: 20px; - } - - .block-row { - flex-wrap: wrap; - } - - .part-day_title-text { - font-size: 26px; - } - - .part-day__price_price { - width: 100%; - order: 2; - font-size: 22px; - } - - .part-day__price_time { - margin: 0; - } - - .part-day__price { - padding-bottom: 20px; - } - - .part-day_text { - font-size: 16px; - } - - .btn-place { - padding: 15px 0; - } - - .mentors__item { - width: calc(50% - 15px); - } - - .mentors__item_name { - font-size: 18px; - } - - .mentors__item_text { - font-size: 16px; - } - - .routine-wrapper { - margin-left: 0; - } - - .routine-wrapper { - gap: 30px; - } - - .routine__item_time { - display: none; - } - - .routine__item_text { - gap: 5px; - } - - .routine__item_time-mobile { - display: block; - font-size: 20px; - line-height: 1.2; - font-weight: 600; - } - - .routine__item_text-title { - font-size: 22px; - } - - .routine__item::before { - left: 10px; - } - - .camp-foto-wrapper { - gap: 10px; - flex-direction: column; - } - - .foto-left-part { - width: 100%; - } - - .camp-swiper-foto { - height: 250px; - margin-bottom: 5px; - } - - .camp-swiper-foto-thumbsSlider { - height: auto; - } - - .foto-content { - display: none; - } - - - - - - - - - - .more .btn-more { - height: 24px; - background: #fff; - } - - .faq-wrapper { - gap: 0; - flex-direction: column; - } - - .accordion { - width: 100%; - gap: 0; - } - - .accordion-last { - border-top: none; - } - - .accordion .box__accordion .box__accordion_label { - padding: 10px 0; - } - - .camp-faq .box__accordion_label span { - font-size: 20px; - } - - .box__accordion_label svg { - flex-shrink: 0; - } - - .contact-wrapper { - gap: 20px; - flex-direction: column-reverse; - } - - .contact-map { - width: 100%; - height: 250px; - } - - #ya-map { - height: 250px !important; - } - - .contact-content { - width: 100%; - } - - .contact_tel { - font-size: 18px; - } - .mentors__item_img { - max-height: 195px; - } - .camp-reviews-wrapper .custom-button-next { - right: -20px; - top: 40%; - } - .camp-reviews-wrapper .custom-button-prev { - left: -20px; - top: 40%; - } - .modal-programs-wrapper { - gap: 15px; - border-radius: 10px; - padding: 15px; - max-width: 95%; - flex-direction: column; - } - .btn-close-modal, - .btn-close-mentors { - left: auto; - right: -28px; - } - .modal-programs__img { - height: auto; - border-radius: 10px; - } - .modal-mentors-wrapper { - position: relative; - padding: 15px; - width: 90%; - gap: 20px; - color: #212121; - height: fit-content; - max-height: 90%; - border-radius: 10px; - flex-direction: column; - } - .modal-mentors_name { - font-size: 20px; - } - .modal-mentors__about { - gap: 10px; - flex-direction: column; - } - .about-item { - width: 100%; - padding: 10px; - border-radius: 10px; - background-color: #e7fff2; - display: flex; - gap: 10px; - flex-direction: column; - } - .mentors__about-col { - gap: 10px; - } - .mentors__about-col_title { - font-size: 18px; - } - .mentors__about-col_text { - font-size: 14px; - } - .mentors__about-col_text section { - padding: 0; - } - .modal-additional__education { - width: 100%; - padding: 10px; - border-radius: 10px; - gap: 10px; - flex-direction: column; - } - - .modal-additional__education_list ul { - padding-left: 0 !important; - } - - .modal-additional__education_list li { - width: 100%; - padding-left: 10px; - } - .camp-reviews-wrapper .custom-button-next:after, .camp-reviews-wrapper .custom-button-prev:after { - font-size: 12px; - height: 27px; - width: 27px; - display: flex; - } - - /* foto mobile: horizontal scroll */ - .camp-swiper-foto .swiper-wrapper { - display: flex; - flex-wrap: nowrap; - overflow-x: auto; - scroll-snap-type: x mandatory; - -webkit-overflow-scrolling: touch; - gap: 10px; - padding: 0 15px; - } - .camp-swiper-foto .swiper-wrapper::-webkit-scrollbar { - height: 6px; - } - .camp-swiper-foto .swiper-wrapper::-webkit-scrollbar-thumb { - background: #ccc; - border-radius: 4px; - } - .camp-swiper-foto .swiper-slide { - flex: 0 0 80%; - scroll-snap-align: center; - } - .camp-swiper-foto .swiper-slide img { - border-radius: 16px; - } - .camp-swiper-foto .swiper-button-next, - .camp-swiper-foto .swiper-button-prev { - display: none; - } - .camp-swiper-foto-thumbsSlider { - display: none; - } -} \ No newline at end of file diff --git a/wp-content/themes/dekart/page-camp.php b/wp-content/themes/dekart/page-camp.php index 75c653b..6ff3139 100644 --- a/wp-content/themes/dekart/page-camp.php +++ b/wp-content/themes/dekart/page-camp.php @@ -254,57 +254,9 @@ $metrics = [