// slides-2.jsx — агентская: слайды 7-12

// ─────────────── 07: КЕЙС «КАРКАСНЫЕ БАНИ» ───────────────
function S07_CaseBanya({ accent }) {
  return <CaseSlide
    accent={accent} num={7} label="Кейс · Авито · Каркасные бани"
    eyebrow="кейс · авито"
    title="Строительство каркасных бань"
    tasks={['Увеличить количество заказов на&nbsp;строительство бань']}
    metrics={['Средний результат: <strong>32 целевых обращения</strong>', 'Средняя цена целевого обращения: <strong>2&nbsp;582&nbsp;₽</strong>']}
    photos={[
      { label: 'МОДУЛЬНАЯ БАНЯ · ДЕНЬ', src: 'assets/photos/slide07_img02.jpg' },
      { label: 'ЧЁРНАЯ БАНЯ · ЛЕС', src: 'assets/photos/slide07_img03.jpg' },
    ]}
  />;
}

// ─────────────── 08: СКРИН АВИТО · БАНИ ───────────────
function S08_AvitoBanyaScreen({ accent }) {
  return <ScreenshotCaseSlide
    accent={accent} num={8} label="Пруф · Авито · Каркасные бани"
    caption="кабинет Авито · Каркасные бани · июнь–август"
    src="assets/photos/slide08_img02.jpg"
    metrics={[
      { label: 'просмотры', value: '3 227', dark: false },
      { label: 'контакты', value: '183', dark: true },
      { label: 'избранное', value: '311', dark: false },
      { label: 'расход', value: '82 630 ₽', dark: false },
    ]}
  />;
}

// ─────────────── 09: КЕЙС «ОТОПЛЕНИЕ И ВЕНТИЛЯЦИЯ» ───────────────
function S09_CaseHvac({ accent }) {
  return <CaseSlide
    accent={accent} num={9} label="Кейс · Авито · HVAC"
    eyebrow="кейс · авито"
    title="Обслуживание, ремонт и&nbsp;установка отопительного и&nbsp;вентиляционного оборудования"
    tasks={['Реклама и&nbsp;продажа оборудования на&nbsp;площадке Авито']}
    metrics={['Средний результат: <strong>726 продаж</strong>', 'Средняя цена продажи: <strong>307&nbsp;₽</strong>']}
    photos={[
      { label: 'МАСТЕР · ИНСТРУМЕНТ', src: 'assets/photos/slide09_img02.jpg' },
      { label: 'УСТАНОВКА ВЕНТИЛЯЦИИ', src: 'assets/photos/slide09_img03.jpg' },
    ]}
  />;
}

// ─────────────── 10: СКРИН АВИТО · HVAC ───────────────
function S10_AvitoHvacScreen({ accent }) {
  return <ScreenshotCaseSlide
    accent={accent} num={10} label="Пруф · Авито · HVAC"
    caption="кабинет Авито · Отопление и вентиляция · 25.02.25 — 25.02.26"
    src="assets/photos/slide10_img02.jpg"
    metrics={[
      { label: 'просмотры', value: '2 570', dark: false },
      { label: 'контакты', value: '317', dark: true },
      { label: 'избранное', value: '270', dark: false },
      { label: 'телефон / чат', value: '193 / 116', dark: false },
      { label: 'расход', value: '77 137 ₽', dark: false },
    ]}
  />;
}

// ─────────────── 11: КЕЙС «WOODNEXT» (ключевой) ───────────────
function S11_CaseWoodnext({ accent }) {
  const A = ACCENT_MAP[accent] || ACCENT_MAP.ember;
  return <SlideFrame bg="var(--c-ink)" color="#fff">
    <PageHeader dark num={11} label="Кейс · Сайт · Woodnext" />
    <div style={{ flex: 1, display: 'grid', gridTemplateColumns: '1.15fr 1fr', gap: 64, alignItems: 'center', minHeight: 0 }}>
      <div style={{ display: 'flex', flexDirection: 'column', gap: 28 }}>
        <Eyebrow color={A.main}>кейс · сайт + seo</Eyebrow>
        <SectionTitle color="#fff" size={56}>
          Привлекли бесплатно <H bg={A.main} fg="#fff">16&nbsp;400 посетителей</H> на&nbsp;сайт строительной компании <H bg={A.main} fg="#fff">«Woodnext»</H> и&nbsp;<H bg={A.main} fg="#fff">700+&nbsp;заявок</H> за&nbsp;квартал
        </SectionTitle>
        <div style={{ display: 'flex', gap: 10 }}>
          <span style={{ display: 'inline-block', padding: '8px 14px', background: 'rgba(255,255,255,0.08)', border: '1px solid rgba(255,255,255,0.18)', borderRadius: 999, fontFamily: 'var(--ff-mono)', fontSize: 14, letterSpacing: '0.04em', color: 'var(--c-fog)' }}>/ Многостраничный сайт</span>
        </div>
        <p style={{ fontSize: TYPE_SCALE.body, lineHeight: 1.45, margin: 0, color: 'var(--c-fog)', maxWidth: 700 }}>
          Разработали многостраничный сайт с&nbsp;продуманной структурой, что помогло иметь лидирующие позиции в&nbsp;поисковой выдаче в&nbsp;разных городах.
        </p>
        <div style={{ display: 'flex', gap: 24, alignItems: 'center', fontFamily: 'var(--ff-mono)', fontSize: 14, color: 'var(--c-fog)', letterSpacing: '0.04em' }}>
          <span style={{ color: A.main }}>/ срок</span>
          <span>Разработка сайта&nbsp;— 60&nbsp;дней</span>
        </div>
        <div style={{ display: 'flex', flexDirection: 'column', gap: 6, marginTop: 4 }}>
          <a href="#" style={{ fontSize: TYPE_SCALE.small, color: '#fff', textDecoration: 'underline', textUnderlineOffset: '4px', textDecorationColor: A.main }}>Ссылка на&nbsp;сайт</a>
          <a href="#" style={{ fontSize: TYPE_SCALE.small, color: '#fff', textDecoration: 'underline', textUnderlineOffset: '4px', textDecorationColor: A.main }}>Смотреть видео с&nbsp;разбором кейса</a>
        </div>
      </div>
      <div style={{ display: 'flex', flexDirection: 'column', justifyContent: 'center', height: '100%' }}>
        <div className="img-dropzone" style={{ backgroundImage: 'url("assets/photos/slide11_img02.jpg")', backgroundSize: 'cover', backgroundPosition: 'center', borderRadius: 'var(--r-xl)', height: 600, position: 'relative', overflow: 'hidden', boxShadow: 'var(--sh-lg)' }} />
      </div>
    </div>
  </SlideFrame>;
}

// ─────────────── 12: СКРИН МЕТРИКА · WOODNEXT (трафик) ───────────────
function S12_MetrikaTrafficScreen({ accent }) {
  return <ScreenshotCaseSlide
    accent={accent} num={12} label="Пруф · Метрика · Woodnext (трафик)"
    caption="Яндекс.Метрика · Общие показатели · woodnext.ru · 04.02 — 03.05.2026"
    src="assets/photos/slide12_img02.jpg"
    metrics={[
      { label: 'визиты', value: '39,6 тыс', dark: true },
      { label: 'посетители', value: '28,4 тыс', dark: false },
      { label: 'время на сайте', value: '2м 50с', dark: false },
      { label: 'отказы', value: '16,18%', dark: false },
      { label: 'переходы из поиска', value: '23,0 тыс', dark: false },
    ]}
  />;
}

Object.assign(window, {
  S07_CaseBanya, S08_AvitoBanyaScreen,
  S09_CaseHvac, S10_AvitoHvacScreen,
  S11_CaseWoodnext, S12_MetrikaTrafficScreen,
});