index-_1_

1.

<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<title>Mospolytech ■ VK + TG ■ Pitch</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?
family=Unbounded:wght@400;600;800;900&family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet"> <style>
:root{
--bg:#0B0F1A;
--bg-2:#0F1424;
--lime:#C6FF3D;
--purple:#6C5CE7;
--cyan:#00D1 FF;
--white:#FFFFFF;
--muted:#8A93A6;
--line:rgba(255,255,255,.08);
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:#05070d;font-family:'Inter',sans-serif;color:var(--white);
-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.slide{
position:relative;
width:1280px;height:720px;
background:var(--bg);
overflow:hidden;
margin:24px auto;
border-radius:14px;
box-shadow:0 30px 80px rgba(0,0,0,.6); isolation:isolate;
}
/* Grid overlay */
.slide::before{
content:"";position:absolute;inset:0;
background-image:
linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px), linear-gradient(90deg,rgba(255,255,255,.035) 1 px,transparent 1
px); background-size:48px 48px;

2.

mask-image:radial-gradient(circle at 50% 50%,#000 60%,transparent 100%);
pointer-events:none;
z-index:0;
}
/* Glow blobs */
.glow{position:absolute;border-radius:50%;filter:blur(90px);opacity:.55;z-index:0;pointer-events:none}
.glow.lime{background:var(--lime)}
.glow.purple{background:var(--purple)}
.glow.cyan{background:var(--cyan)}
.content{position:relative;z-index:2;height:100%;padding:56px 72px;display:flex;flex-direction:column}
/* Typography */
.kicker{
font-family:'Inter',sans-serif;font-weight:600;font-size:12px;letter-spacing:.28em;
text-transform:uppercase;color:var(--muted);display:inline-flex;align-items:center;gap:10px;
}
.kicker::before{content:"";width:22px;height:1px;background:var(--lime)} h1{font-family:'Unbounded',sansserif;font-weight:900;line-height:.95;letter-spacing:-.02em} h2{font-family:'Unbounded',sans-serif;fontweight:800;font-size:44px;line-height:1.02;letter-spacing:-.02em} p{color:#C9D0DE;font-size:16px;lineheight:1.55}
/* Slide number */
.num{
position:absolute;top:28px;right:34px;font-family:'Unbounded',sans-serif;
font-weight:600;font-size:12px;letter-spacing:.3em;color:var(--muted);z-index:3;
}
.brand{
position:absolute;top:28px;left:34px;font-family:'Unbounded',sans-serif;
font-weight:600;font-size:11px;letter-spacing:.4em;color:var(--muted);z-index:3;
}
.brand span{color:var(--lime)}
/*----------SLIDE 1 ----------*/
.s1 h1{font-size:148px;color:var(--white)}
.s1 h1 .accent{
background:linear-gradient(120deg,var(--lime),var(--cyan) 60%,var(--purple)); -webkit-backgroundclip:text;background-clip:text;color:transparent;
}
.s1 .sub{

3.

margin-top:22px;max-width:640px;font-size:20px;color:#C9D0DE;line-height:1.5;font-weight:400;
}
.s1 .badges{display:flex;gap:12px;margin-top:34px;flex-wrap:wrap}
.badge{
display:inline-flex;align-items:center;gap:10px;padding:10px 16px;border-radius:100px; background:rgba(255,255,255,.04);border:1px solid
var(--line); font-size:13px;font-weight:500;color:#E6EAF3;
}
.dot{width:8px;height:8px;border-radius:50%}
.dot.lime{background:var(--lime);box-shadow:0 0 12px var(--lime)}
.dot.purple{background:var(--purple);box-shadow:0 0 12px var(--purple)}
.dot.cyan{background:var(--cyan);box-shadow:0 0 12px var(--cyan)}
.s1 .hero-tag{
position:absolute;right:-40px;bottom:-40px; font-family:'Unbounded',sans-serif;font-weight:900;font-size:420px;
color:rgba(198,255,61,.045);letter-spacing:-.06em;line-height:.8;z-index:1 ;user-select:none;
}
/*----------SLIDE 2----------*/
.kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:44px;flex:1}
.kpi{
position:relative;padding:26px 22px;border-radius:20px;
background:linear-gradient(160deg,rgba(255,255,255,.05),rgba(255,255,255,.015)); border:1px solid var(--line);
display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;
}
.kpi::after{
content:"";position:absolute;top:-1 px;left:-1 px;right:-1 px;height:2px; background:linear-gradient(90deg,transparent,var(-lime),transparent);opacity:.8;
}
.kpi:nth-child(2)::after{background:linear-gradient(90deg,transparent,var(--cyan),transparent)} .kpi:nth-child(3)::after{background:lineargradient(90deg,transparent,var(--purple),transparent)} .kpi:nth-child(4)::after{background:lineargradient(90deg,transparent,#fff,transparent)}
.kpi .label{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);font-weight:600}
.kpi .value{font-family:'Unbounded',sans-serif;font-weight:900;font-size:52px;line-height:1 ;margin:18px 0 6px;letter-spacing:-.02em} .kpi
.value.lime{color:var(--lime)}
.kpi .value.cyan{color:var(--cyan)}
.kpi .value.purple{color:#9C8DFF}
.kpi .value.white{color:#fff}

4.

.kpi .cap{font-size:13px;color:#B7BFD1 ;line-height:1.4}
.kpi .mini{
margin-top:16px;font-size:11px;color:var(--muted);letter-spacing:.1em;text-transform:uppercase;
border-top:1px dashed rgba(255,255,255,.1);padding-top:10px;
}
.s2 .goal-line{
margin-top:28px;padding:20px 24px;border-radius:16px; background:linear-
gradient(90deg,rgba(198,255,61 ,.06),rgba(0,209,255,.03)); border-left:3px solid var(--lime); fontsize:15px;color:#DDE3F0;line-height:1.55;
}
.s2 .goal-line b{color:var(--lime);font-weight:600}
/*----------SLIDE 3----------*/
.aud-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:36px}
.aud{
padding:22px 24px;border-radius:18px; background:rgba(255,255,255,.035); border:1px solid
var(--line); display:flex;gap:18px;align-items:flex-start; position:relative;overflow:hidden;
}
.aud::before{
content:'"';position:absolute;inset:0;
background:radial-gradient(circle at 0% 0%,rgba(198,255,61,.08),transparent 55%);
opacity:0;transition:.3s;
}
.aud:hover::before{opacity:1}
.aud .ico{
flex:0 0 46px;height:46px;border-radius:12px;display:grid;place-items:center;
font-family:'Unbounded',sans-serif;font-weight:800;font-size:16px;color:var(--bg);
background:var(--lime);
}
.aud:nth-child(2) .ico{background:var(--cyan)}
.aud:nth-child(3) .ico{background:#9C8DFF;color:#fff}
.aud:nth-child(4) .ico{background:#fff}
.aud .txt h4{font-size:16px;font-weight:600;margin-bottom:6px;letter-spacing:.01 em}
.aud .txt p{font-size:13.5px;color:#AEB7C9;line-height:1.5}

5.

.tasks-strip{
display:flex;gap:14px;margin-top:24px;
}
.task{
flex:1 ;padding:16px 18px;border-radius:14px; border:1 px solid rgba(198,255,61 ,.25);
background:linear-gradient(160deg,rgba(198,255,61 ,.05),rgba(198,255,61,0)); display:flex;align-items:center;gap:12px;fontsize:13.5px;color:#E4EAF6;font-weight:500;
}
.task .tick{width:22px;height:22px;border-radius:50%;background:var(--lime);color:#0B0F1A;display:grid;place-iteiTis:center;fontweight:800;font-size:12px;flex-shrink:0}
/*----------SLIDE 4----------*/
.competitors{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:34px}
.comp{
padding:24px 24px;border-radius:18px;
background:linear-gradient(160deg,rgba(255,255,255,.05),rgba(255,255,255,.01)); border:1px solid var(-line);position:relative;overflow:hidden;
}
.comp .name{font-family:'Unbounded',sans-serif;font-size:20px;font-weight:700;margin-bottom:4px}
.comp .tag{font-size:12px;color:var(--muted);margin-bottom:18px}
.comp .row{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:10px}
.comp .row span:first-child{font-size:12px;color:var(--muted);letter-spacing:.14em;text-transform:uppercase}
.comp .row b{font-family:'Unbounded',sans-serif;font-size:22px;font-weight:800;color:#fff}
.bar{height:6px;border-radius:6px;background:rgba(255,255,255,.06);overflow:hidden;margin-top:6px;margin-bottom:14px}
.bar i{display:block;height:100%;border-radius:6px}
.bar .vk-1{width:100%;background:linear-gradient(90deg,var(--lime),#8ce000)}
.bar .tg-1{width:40%;background:linear-gradient(90deg,var(--cyan),#0088aa)}
.bar .vk-2{width:73%;background:linear-gradient(90deg,var(--lime),#8ce000)}
.bar .tg-2{width:40%;background:linear-gradient(90deg,var(--cyan),#0088aa)}
.verdict{
margin-top:22px;padding:20px 24px;border-radius:16px; background:linear-gradient(90deg,rgba(108,92,231 ,.14),rgba(0,209,255,.05));
border:1 px solid rgba(108,92,231 ,.35);
font-family:'Unbounded',sans-serif;font-size:19px;font-weight:600;line-height:1.35;color:#fff;
}
.verdict b{color:var(--lime)}
/*----------SLIDE 5----------*/
.s5 .quote{

6.

flex:1 ;display:flex;flex-direction:column;justify-content:center;margin-top:20px;
}
.s5 .quote blockquote{
font-family:'Unbounded',sans-serif;font-weight:600;
font-size:34px;line-height:1.28;letter-spacing:-.015em;
color:#fff;max-width:980px;
}
.s5 .quote blockquote em{ font-style:normal;
background:linear-gradient(120deg,var(--lime),var(--cyan));
-webkit-background-clip:text;background-dip:text;color:transparent;
}
.s5 .pills{display:flex;gap:12px;margin-top:36px}
.pill{
padding:14px 20px;border-radius:100px; border:1px solid var(--line); background:rgba(255,255,255,.03); fontsize:13px;color:#E4EAF6;font-weight:500; display:inline-flex;align-items:center;gap:10px;
}
.pill .dot{width:6px;height:6px}
.s5 .bottom{
display:flex;justify-content:space-between;align-items:center; padding-top:24px;margin-top:28px;border-top:1 px solid var(--line);
}
.s5 .bottom .next{font-size:13px;color:#AEB7C9;max-width:640px;line-height:1.5}
.s5 .bottom .next b{color:var(--lime);font-weight:600}
.s5 .qr{
display:flex;gap:14px;align-items:center;
}
.s5 .qr .box{
width:64px;height:64px;border-radius:12px;
background:
repeating-linear-gradient(0deg,rgba(255,255,255,.18) 0 3px,transparent 3px 6px), repeating-lineargradient(90deg,rgba(255,255,255,.18) 0 3px,transparent 3px 6px); border:1px solid var(--line);position:relative;overflow:hidden;
}
.s5 .qr .box::before{content:"";position:absolute;inset:6px;background:var(--lime);border-radius:6px;mix-blend-mode:difference}
/* Print */

7.

@media print{ html,body{background:#fff}
.slide{margin:0;border-radius:0;box-shadow:none;page-break-after:always;break-after:page}
.slide:last-child{page-break-after:auto;break-after:auto}
@page{size:1280px 720px;margin:0}
.no-print{display:none!important}
*{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}
}
/* Screen instruction */
.howto{
max-width:1280px;margin:0 auto 12px;padding:14px 22px;border-radius:14px; background:linear-gradient(90deg,rgba(198,255,61
,.12),rgba(0,209,255,.06)); color:#DDE3F0;font-size:13.5px;line-height:1.6;border:1px solid rgba(198,255,61,.25);
}
.howto b{color:var(--lime)}
.howto kbd{
background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15); border-radius:6px;padding:1px 6px;fontfamily:'Inter',monospace;font-size:12px;
}
</style>
</head>
<body>
<div class="howto no-print">
<Ь>Как получить PDF:</b> нажми <kbd>Ctrl</kbd>+<kbd>P</kbd> ^ «Сохранить как PDF» ^ Поля: <Ь>Нет</Ь>, Фон:
<Ь>Включить</Ь>, Размер: <b>1280 х 720 px</b>.
</div>

<section class="slide s1">
<div class="brand">MOSPOLYTECH ■ <span>DIGITAL</span></div>
<div class="num">01 / 05</div>
<div class="glow lime" style="width:520px;height:520px;left:-160px;top:-160px;opacity:.35"></div>
<div class="glow purple" style="width:640px;height:640px;right:-240px;bottom:-260px;opacity:.55"></div>
<div class="hero-tag">VK ■ TG</div>
<div class="content">
<div class="kicker" style="margin-top:20px">Экосистема сообществ ■ 2025</div>
<h1 style="margin-top:28px">
МОСПОЛИТЕХ<Ьг>

8.

<span class="accent">VK + TG</span>
</h1>
<p dass=',sub',>Единая экосистема официальных сообществ: витрина вуза и оперативный канал для тех, кто хочет знать
первым.</р>
<div class="badges">
<div class="badge"><span class="dot lime"></span> VK — витрина и архив<ЛЗ^>
<div class="badge"><span class="dot cyan"></span> Telegram — скорость и абитуриенты<ЛЗ^>
<div class="badge"><span class="dot purple"></span> Вместе — одна аудитория, две роли<А^>
</div>
</div>
</section>

<section class="slide s2">
<div class="brand">MOSPOLYTECH ■ <span>DIGITAL</span></div>
<div class="num">02 / 05</div>
<div class="glow cyan" style="width:520px;height:520px;right:-180px;top:-160px;opacity:.35"></div>
<div class="glow lime" style="width:520px;height:520px;left:-200px;bottom:-200px;opacity:.25"></div>
<div class="content">
<div dass=',kюker',>Чего хотим добиться</div>
<h2 style="iTiargin-top:18px',^E.rM И KPI</h2>
<div class="kpi-grid">
<div class="kpi">
<div dass=',labeГ>Подписчики</div>
<div class="value lime">+10-15%</div>
<div dass=',cap',>Прирост аудитории за семестр</div>
<div class="mini">VK + TG</div>
</div>
<div class="kpi">
<div dass=',labeГ>Вовлечённость</div>
<div class="value cyan">+15-20%</div>
<div dass="cap">Рост ER и комментариев<А^>
<div dass="тini">сегментация контента</div>
</div>
<div class="kpi">
<div dass=',labeГ>Площадки</div>
<div class="value purple">02</div>

9.

<div dass=',lTlim',>кросс-навигация</div>
</div>
<div class="kpi">
<div dass=',labeГ>Стиль</div>
<div class="value white">01</div>
<div dass=',cap',>Единый визуал и tone of voice</div>
<div class="mini">y3HaBaeMOCTb</div>
</div>
</div>
<div class="goal-line">
Цель — не догонять Бауманку по цифрам, а занять нишу <Ь>«современного инженерного вуза, который говорит с аудиторией
на одном языке»</Ь>.
</div>
</div>
</section>

<section class="slide s3">
<div class="brand">MOSPOLYTECH ■ <span>DIGITAL</span></div>
<div class="num">03 / 05</div>
<div class="glow purple" style="width:560px;height:560px;left:-200px;top:40%;opacity:.35"></div>
<div class="content">
<div dass=',kюker',>Для кого и что делаем</3^>
<h2 style=',margin-top:18px',>4ETblPE АУДИТОРИИ — ЧЕТЫРЕ nOTOKA</h2>
<div class="aud-grid">
<div class="aud">
<div class="ico">A</div>
<div class="txt">
<h4>Абитуриенты и родители</h4>
<р>Поступление, сроки, условия. Отдельный канал «Привет, Московский Политех» и навигация в VK.</p>
</div>
</div>
<div class="aud">
<div class="ico">S</div>
<div class="txt">
<h4>Студенты</h4>
<р>Новости, мероприятия, карьера, опросы, чат сообщества. Быстрый Telegram + лонгриды в VK.</p>
</div>

10.

</div>
<div class="aud">
<div class="ico">T</div>
<div class="txt">
<h4>Сотрудники и преподаватели</h4>
<р>Наука, внутренние анонсы, достижения кафедр и лабораторий.</р>
</div>
</div>
<div class="aud">
<div class="ico">P</div>
<div class="txt">
<Ь|4>Партнёры и внешняя аудитория</h4>
<р>Кейсы, экспертиза, имиджевые материалы и репутация инженерного вуза.</р>
</div>
</div>
</div>
<div class="tasks-strip">
<div class="task"><span dass=',tюk',>✓</span>Контент-план и рубрикатор</3^>
<div class="task"><span dass=',tюk',>✓</span>Сегментация потоков<ЛЗ^>
<div class="task"><span dass=',tюk',>✓</span>Аналитика и продвижение<ЛЗ^>
</div>
</div>
</section>

<section class="slide s4">
<div class="brand">MOSPOLYTECH ■ <span>DIGITAL</span></div>
<div class="num">04 / 05</div>
<div class="glow cyan" style="width:520px;height:520px;right:-200px;top:-140px;opacity:.3"></div>
<div class="content">
<div dass="kicker">Анализ конкурентов</div>
<h2 style="margin-top:18px">C КЕМ СРАВНИВАЕМСЯ</h2>
<div class="competitors">
<div class="comp">
<div class="name">MrTy им. Баумана</^>
<div dass=',tag',>Эталон инженерного образования ■ лидер по охвату</^>
<div class="row"><span>VK</span><b>68 000</b></div>

11.

<div class="bar"><i class="vk-1"></i></div>
<div class="row"><span>Telegram</span><b>27 200</b></div>
<div class="bar"><i class="tg-1"></i></div>
</div>
<div class="comp">
<div class="name">PTy МИРЭА</div>
<div dass=',tag',>Силы-lый игрок в VK и Telegram ■ молодёжный KOHTeHT</div>
<div class="row"><span>VK</span><b>« 50 000</b></div>
<div class="bar"><i class="vk-2"></i></div>
<div class="row"><span>Telegram</span><b>27 200</b></div>
<div class="bar"><i class="tg-2"></i></div>
</div>
</div>
<div class="verdict">
Ниша «инженерный вуз + карьера + живые истории» <Ь>не занята полностью</Ь>. Это наш шанс.
</div>
</div>
</section>

<section class="slide s5">
<div class="brand">MOSPOLYTECH ■ <span>DIGITAL</span></div>
<div class="num">05 / 05</div>
<div class="glow lime" style="width:640px;height:640px;left:-200px;bottom:-240px;opacity:.28"></div>
<div class="glow purple" style="width:520px;height:520px;right:-160px;top:-160px;opacity:.45"></div>
<div class="content">
<div dass=',kюker',>Позиционирование и формула</div>
<div class="quote">
<blockquote>
«Инженерный вуз, который <em>просто говорит о сложном^тх о науке, карьере и студенческой жизни — там, где удобно
аудитории».
</blockquote>
<div class="pills">
<div dass="pill"><span class="dot lime"></span> VK — витрина и архив</^>
<div dass="pill"><span class="dot cyan"></span> TG — скорость и абитуриенты</^> <div
dass="pill"><span class="dot purple"></span> Контент — карьера, наука, люди</^>
</div>

12.

</div>
<div class="bottom">
<div class="next">
<Ь>Первый шаг:</Ь> аудит сообществ, рубрикатор и контент-план на месяц — уже в этом семестре.
</div>
<div class="qr">
<div class="box"></div>
<div style="font-family:'Unbounded',sans-serif;font-size:11 px;letter-spacing:.2em;color:#8A93A6;line-height:1.6">
VK ■ TELEGRAM<br><span style="color:#C6FF3D">@mospolytech</span>
</div>
</div>
</div>
</div>
</section>
</body>
</html>

English Русский Правила