(DIV3+) и в правой колонке. function S01_Cover({ accent }) { const A = ACCENT_MAP[accent] || ACCENT_MAP.ember; return {/* Декоративный orbit — концентрические круги ember за всем контентом. Центр на середине фотки (1380, 540 в slide coords), дуги выходят далеко за слайд: видны слева на бежевом фоне (через всю левую колонку), снизу и сверху (где паддинг). Радиальный vibe как на референс-сайте. */} {/* Diagonal accent line — тонкая ember-stripe бежит из нижнего-левого угла через слайд, добавляет dynamic flow и движение взгляду. */} {/* Dot pattern в нижнем-левом углу — vector SVG (не radial-gradient!), иначе PDF-экспорт растеризует и точки выходят крупнее/грубее чем в веб. Cells 18×18px, точки r=1.6 — точно как в CSS-варианте, но vector-clean. */} {/* Тонкая ember-полоска у левого края — vertical accent stripe */}

{/* ── Левая колонка: text only (без micro-stats — дублировались с S3) ─── Структура сохранена: Eyebrow(DIV0) / SectionTitle(H10) / p(P0) — eid'ы s1_DIV0_DIV1_DIV0_DIV0/H10/P0 не сломаны. */}

Маркетинговое агентство · сайты + Я.Директ + Авито для строительной ниши Увеличиваем выручку строительных компаний

Разрабатываем конверсионные сайты и привлекаем качественные заявки в бизнес.

{/* ── Правая колонка: фотка ─────────────────────────────── */}

{/* Главная фотка во всю высоту */}

{/* Затемнение снизу для читаемости подписи */}

{/* Подпись внизу справа */}

/ объект клиента · ИЖС 01 / 33

{/* Угловой акцент-блок: щит-с-галочкой = «гарантия результата» */}

не боимся
давать гарантии

; } // ─────────────── 02: УСЛУГИ ─────────────── function S02_Services({ accent }) { const A = ACCENT_MAP[accent] || ACCENT_MAP.ember; const services = [ { n: '01', t: 'Разработка лендинга', d: 'Одностраничный сайт для рекламы, презентации продукта или для ознакомления с компанией' }, { n: '02', t: 'Разработка многостраничного сайта', d: 'Корпоративный сайт, сайт для рекламы с разными направлениями бизнеса' }, { n: '03', t: 'Редизайн сайта', d: 'Современные и удобные сайты для роста бизнес-метрик без потери позиций в поисковой выдаче' }, { n: '04', t: 'Техническая поддержка сайтов на Тильде и WordPress', d: 'Оперативная работа по вашим задачам сайта в срок' }, { n: '05', t: 'Реклама в Яндекс.Директ', d: 'Настройка рекламы с гарантией результата. В обратном случае вернём деньги' }, { n: '06', t: 'Авито', d: 'Настройка рекламы с гарантией результата. В обратном случае вернём деньги' }, { n: '07', t: 'Яндекс Бизнес', d: 'Размещение в Яндекс Картах и приоритетное место в локальной выдаче для привлечения клиентов из вашего региона' }, { n: '08', t: 'Автоматизация бизнеса', d: '30% рутины в вашей компании уже может делать AI — покажем где и как' }, ]; return

основные направления Наши
услуги

Мы не можем быть экспертными во всём, поэтому выбрали 8 ключевых направлений

{s.n}

{s.t}

{s.d}

; } // ─────────────── 03: КТО МЫ ─────────────── // v3: заголовок сверху + lead-описание + 3 равные stat-карточки в один ряд. // Карточки разные по визуальному весу (ink / accent.deep / paper-snow с обводкой) // — даёт ритм и иерархию, а не просто три одинаковых блока. function S03_WhoWeAre({ accent }) { const A = ACCENT_MAP[accent] || ACCENT_MAP.ember; return

В цифрах о том,
чем занимается Эталон

Маркетинговое агентство для компаний в нише строительства. Привлекаем квалифицированные заявки и разрабатываем конверсионные сайты.

; } function BigStatCard({ figure, label, tail, bg, fg = '#fff', figureColor, small, softColor, accentBar }) { // Размер цифры подобран так, чтобы все три варианта (50+ / 1 млрд ₽ / 6 лет) // визуально весили одинаково в 3-колоночном grid. const figSize = small ? 92 : 116; return

{accentBar ?

: null} / {label}

{figure}

; } // ─────────────── 04: РАЗДЕЛИТЕЛЬ «ОПЫТ» ─────────────── function S04_ExperienceDivider({ accent }) { const A = ACCENT_MAP[accent] || ACCENT_MAP.ember; return

раздел · опыт Имеем большой опыт продвижения компаний и разработки сайтов

17 КЕЙСОВ ДАЛЕЕ →

; } // ─────────────── Универсальные карточки кейсов ─────────────── function CaseSlide({ accent, num, label, eyebrow, title, tasks, metrics, photos, links }) { const A = ACCENT_MAP[accent] || ACCENT_MAP.ember; return

{eyebrow || 'кейс агентства'} {title}

{tasks && tasks.length > 0 && (

Задачи:

)} {metrics && metrics.length > 0 && (

Показатели:

)} {links && links.length > 0 && (

{links.map((l, i) => ( {l.text} ))}

)}

{photos.map((p, i) => ( ))}

; } function ScreenshotCaseSlide({ accent, num, label, caption, metrics, side = 'right', src }) { const A = ACCENT_MAP[accent] || ACCENT_MAP.ember; const cols = side === 'left' ? '1fr 1.6fr' : '1.6fr 1fr'; const innerStyle = src ? { flex: 1, backgroundImage: `url("${src}")`, backgroundSize: 'contain', backgroundPosition: 'center', backgroundRepeat: 'no-repeat', backgroundColor: '#fff', borderRadius: 12 } : { flex: 1, background: 'rgba(255,255,255,0.03)', border: '1px dashed rgba(255,255,255,0.14)', borderRadius: 12, display: 'flex', alignItems: 'center', justifyContent: 'center', flexDirection: 'column', gap: 14 }; const screenBlock = (

{caption}

{!src && <> / ВСТАВЬТЕ СКРИНШОТ Перетащите изображение в edit-режиме }

); const metricsBlock = ; return

{side === 'left' ? metricsBlock : screenBlock} {side === 'left' ? screenBlock : metricsBlock}

; } function MetricsPanel({ metrics, A }) { return

{metrics.map((m, i) => (

/ {m.label} 10 ? 36 : 50, letterSpacing: '-0.02em', lineHeight: 1, color: m.dark ? A.main : 'var(--c-ink)' }}>{m.value}

))}

; } // ─────────────── 05: КЕЙС «КАРКАСНЫЕ ДОМА» ─────────────── function S05_CaseFrameHouses({ accent }) { return 26 целевых обращений', 'Средняя цена целевого обращения: 2 687 ₽']} photos={[ { label: 'СТРОЙКА КАРКАСА', src: 'assets/photos/slide05_img02.jpg' }, { label: 'ГОТОВЫЙ ДОМ · ТЁМНАЯ КРЫША', src: 'assets/photos/slide05_img03.jpg' }, ]} />; } // ─────────────── 06: СКРИН АВИТО · ДОМОСТРОЙ ─────────────── function S06_AvitoDomostroyScreen({ accent }) { return ; } Object.assign(window, { TYPE_SCALE, SPACING, ACCENT_MAP, SlideFrame, Logo, PageHeader, SectionTitle, H, Eyebrow, ImgPlaceholder, CaseSlide, ScreenshotCaseSlide, MetricsPanel, BigStatCard, S01_Cover, S02_Services, S03_WhoWeAre, S04_ExperienceDivider, S05_CaseFrameHouses, S06_AvitoDomostroyScreen, });

{children}