Files
olimparena/index.html
2026-04-23 18:01:48 +03:00

315 lines
21 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>OlimpArena</title>
<link rel="stylesheet" href="./assets/css/main.min.css">
</head>
<body>
<div class="site">
<header class="header" id="top">
<div class="container header__inner">
<a class="logo" href="#top" aria-label="OlimpArena">
<img src="https://www.figma.com/api/mcp/asset/8a836c8e-ef3b-4a4c-80e1-57e33b81f3f2" alt="OlimpArena">
</a>
<nav class="header__nav" aria-label="Основная навигация">
<a href="#objects">Объекты</a>
<a href="#services">Услуги</a>
<a href="#gallery">Галерея</a>
<a href="#contacts">Контакты</a>
</nav>
<a class="btn btn--small" href="#booking">Забронировать</a>
</div>
</header>
<main>
<section class="hero">
<div class="hero__bg" aria-hidden="true"></div>
<div class="container hero__content">
<h1>
Современная
<span>спортивная арена</span>
в центре Москвы
</h1>
<p>
Два ледовых поля 56×26 м и полный комплекс для тренировок —
15 минут пешком от метро Волгоградский проспект
</p>
<ul class="hero__tags">
<li>2 ледовых поля 56×26 м</li>
<li>Универсальный зал</li>
<li>Фитнес-центр</li>
<li>Апарт-комплекс на 150+ спортсменов</li>
</ul>
<div class="hero__actions">
<a class="btn" href="#booking">Забронировать лед / зал</a>
<a class="btn btn--ghost" href="#">Посмотреть расписание</a>
</div>
</div>
</section>
<section class="highlights">
<div class="container highlights__grid">
<article class="info-card">
<h3>Развитая спортивная инфраструктура</h3>
<p>Всё для тренировок в одном месте</p>
</article>
<article class="info-card">
<h3>Идеальная транспортная доступность</h3>
<p>15 минут пешком от метро</p>
</article>
<article class="info-card">
<h3>Комфортные условия</h3>
<p>Проживание и питание на территории</p>
</article>
<article class="info-card">
<h3>Профессиональный сервис</h3>
<p>Современное оборудование и команда</p>
</article>
</div>
</section>
<section class="section section--pattern advantages">
<div class="container">
<header class="section__head">
<h2>Преимущества</h2>
<p>Всё для профессионального спорта и активного отдыха</p>
</header>
<div class="advantages__grid">
<article class="feature-card"><h3>Два ледовых поля</h3><p>Профессиональные поля 56×26 м</p></article>
<article class="feature-card"><h3>Универсальный зал</h3><p>Для любых тренировок</p></article>
<article class="feature-card"><h3>Фитнес-центр</h3><p>Новейшее оборудование</p></article>
<article class="feature-card"><h3>Зал хореографии</h3><p>Для фигуристов и танцоров</p></article>
<article class="feature-card"><h3>Зал единоборств</h3><p>Оборудованный татами</p></article>
<article class="feature-card"><h3>Апарт-комплекс</h3><p>150+ мест для спортсменов</p></article>
<article class="feature-card"><h3>Ресторан</h3><p>Спортивное питание</p></article>
<article class="feature-card"><h3>Отличная локация</h3><p>15 минут от метро</p></article>
</div>
</div>
</section>
<section class="section section--pattern objects" id="objects">
<div class="container">
<header class="section__head">
<h2>Наши объекты</h2>
<p>Профессиональная инфраструктура для ваших целей</p>
</header>
<article class="object-card">
<div class="object-card__image" style="background-image: linear-gradient(0deg, rgba(18,18,18,.3), rgba(18,18,18,.3)), url('https://images.unsplash.com/photo-1515703407324-5f753afd8be8?auto=format&fit=crop&w=1400&q=80');"></div>
<div class="object-card__content">
<h3>Ледовые поля</h3>
<p>Два профессиональных поля 56×26 м для хоккея, фигурного катания и массовых катаний.</p>
<ul>
<li>56×26 м, профессиональное покрытие и LED-освещение</li>
<li>Хоккей, фигурное катание, массовые катания</li>
</ul>
<a class="btn btn--small" href="#booking">Забронировать</a>
</div>
</article>
<article class="object-card object-card--reverse">
<div class="object-card__image" style="background-image: linear-gradient(0deg, rgba(18,18,18,.3), rgba(18,18,18,.3)), url('https://images.unsplash.com/photo-1544717305-2782549b5136?auto=format&fit=crop&w=1400&q=80');"></div>
<div class="object-card__content">
<h3>Универсальный зал</h3>
<p>Многофункциональное пространство для командных и индивидуальных тренировок.</p>
<ul>
<li>Полноразмерный зал с современным покрытием</li>
<li>Баскетбол, волейбол, мини-футбол, ОФП</li>
</ul>
<a class="btn btn--small" href="#booking">Забронировать</a>
</div>
</article>
<article class="object-card">
<div class="object-card__image" style="background-image: linear-gradient(0deg, rgba(18,18,18,.3), rgba(18,18,18,.3)), url('https://images.unsplash.com/photo-1571019613454-1cb2f99b2d8b?auto=format&fit=crop&w=1400&q=80');"></div>
<div class="object-card__content">
<h3>Фитнес-центр</h3>
<p>Современная зона для силовых и функциональных тренировок.</p>
<ul>
<li>Кардио и силовое оборудование нового поколения</li>
<li>Персональные и групповые тренировки</li>
</ul>
<a class="btn btn--small" href="#booking">Забронировать</a>
</div>
</article>
<article class="object-card object-card--reverse">
<div class="object-card__image" style="background-image: linear-gradient(0deg, rgba(18,18,18,.3), rgba(18,18,18,.3)), url('https://images.unsplash.com/photo-1571902943202-507ec2618e8f?auto=format&fit=crop&w=1400&q=80');"></div>
<div class="object-card__content">
<h3>Апарт-комплекс</h3>
<p>Комфортное проживание спортсменов и команд на территории комплекса.</p>
<ul>
<li>150+ мест с современной инфраструктурой</li>
<li>Кухня, прачечная, зоны отдыха и восстановления</li>
</ul>
<a class="btn btn--small" href="#booking">Забронировать</a>
</div>
</article>
<article class="object-card">
<div class="object-card__image" style="background-image: linear-gradient(0deg, rgba(18,18,18,.3), rgba(18,18,18,.3)), url('https://images.unsplash.com/photo-1556909212-d5b604d0c90d?auto=format&fit=crop&w=1400&q=80');"></div>
<div class="object-card__content">
<h3>Ресторан</h3>
<p>Полноценное спортивное питание и меню для командных сборов.</p>
<ul>
<li>Баланс БЖУ, восстановительные рационы</li>
<li>Обслуживание турниров и корпоративных мероприятий</li>
</ul>
<a class="btn btn--small" href="#booking">Забронировать</a>
</div>
</article>
</div>
</section>
<section class="section services" id="services">
<div class="container">
<header class="section__head">
<h2>Услуги</h2>
<p>Полный цикл сопровождения тренировочного процесса</p>
</header>
<div class="services__grid">
<article class="service-card"><h3>Аренда площадок</h3><p>Лед, залы и специализированные пространства под задачи команды.</p><a href="#booking">Подробнее</a></article>
<article class="service-card"><h3>Тренировочные сборы</h3><p>Проживание, питание и логистика в рамках одного комплекса.</p><a href="#booking">Подробнее</a></article>
<article class="service-card"><h3>Турниры и мероприятия</h3><p>Организация соревнований, матчей и корпоративных ивентов.</p><a href="#booking">Подробнее</a></article>
<article class="service-card"><h3>Реабилитация и ОФП</h3><p>Фитнес, восстановление и индивидуальные программы подготовки.</p><a href="#booking">Подробнее</a></article>
</div>
</div>
</section>
<section class="section gallery" id="gallery">
<div class="container">
<header class="section__head">
<h2>Галерея</h2>
<p>Пространства OlimpArena в деталях</p>
</header>
<div class="gallery__grid">
<div class="gallery__item" style="background-image:url('https://images.unsplash.com/photo-1541534741688-6078c6bfb5c5?auto=format&fit=crop&w=1000&q=80');"></div>
<div class="gallery__item" style="background-image:url('https://images.unsplash.com/photo-1546519638-68e109498ffc?auto=format&fit=crop&w=1000&q=80');"></div>
<div class="gallery__item" style="background-image:url('https://images.unsplash.com/photo-1517466787929-bc90951d0974?auto=format&fit=crop&w=1000&q=80');"></div>
<div class="gallery__item" style="background-image:url('https://images.unsplash.com/photo-1593079831268-3381b0db4a77?auto=format&fit=crop&w=1000&q=80');"></div>
<div class="gallery__item" style="background-image:url('https://images.unsplash.com/photo-1571019613914-85f342c55f5f?auto=format&fit=crop&w=1000&q=80');"></div>
<div class="gallery__item" style="background-image:url('https://images.unsplash.com/photo-1623874514711-0f321325f318?auto=format&fit=crop&w=1000&q=80');"></div>
</div>
</div>
</section>
<section class="section reviews">
<div class="container">
<header class="section__head">
<h2>Отзывы</h2>
<p>Что говорят о нас спортсмены и тренеры</p>
</header>
<div class="reviews__grid">
<article class="review-card">
<p>"Лучшие ледовые условия в Москве. Качество льда на высочайшем уровне, всё организовано профессионально."</p>
<strong>Александр Иванов</strong>
<span>Тренер хоккейной школы</span>
</article>
<article class="review-card">
<p>"Отличный комплекс для тренировок. Залы хореографии и фитнеса действительно помогают прогрессировать быстрее."</p>
<strong>Елена Петрова</strong>
<span>Фигуристка</span>
</article>
<article class="review-card">
<p>"Проводим здесь турниры уже второй год. Профессиональный подход команды и высокая готовность площадок."</p>
<strong>Дмитрий Соколов</strong>
<span>Организатор турниров</span>
</article>
</div>
<div class="stats">
<article><strong>150+</strong><span>Мест для проживания</span></article>
<article><strong>2</strong><span>Профессиональных ледовых поля</span></article>
<article><strong>10</strong><span>Оборудованных раздевалок</span></article>
</div>
</div>
</section>
<section class="section booking" id="booking">
<div class="container booking__wrap">
<div class="booking__form">
<h2>Забронировать время</h2>
<p>Заполните форму, и мы свяжемся с вами в ближайшее время для подтверждения заявки.</p>
<form action="#" method="post">
<label>
<input type="text" name="sport" placeholder="Вид спорта">
</label>
<label>
<input type="text" name="date" placeholder="Желаемая дата">
</label>
<label>
<input type="text" name="name" placeholder="Ваше имя">
</label>
<label>
<input type="tel" name="phone" placeholder="Телефон">
</label>
<button class="btn" type="submit">Отправить заявку</button>
</form>
</div>
<div class="booking__contacts" id="contacts">
<div class="contacts-card">
<h3>Контакты</h3>
<ul>
<li><strong>Адрес</strong><span>Москва, в пределах ТТК<br>15 минут от м. Волгоградский проспект</span></li>
<li><strong>Телефон</strong><span>+7 (495) 123-45-67</span></li>
<li><strong>Email</strong><span>info@olimparena.ru</span></li>
</ul>
</div>
<div class="hours-card">
<h4>Режим работы</h4>
<p>Ежедневно: 06:00 — 23:00</p>
</div>
</div>
</div>
</section>
</main>
<footer class="footer">
<div class="container">
<div class="footer__top">
<div class="footer__col">
<a class="logo" href="#top" aria-label="OlimpArena">
<img src="https://www.figma.com/api/mcp/asset/8a836c8e-ef3b-4a4c-80e1-57e33b81f3f2" alt="OlimpArena">
</a>
<p>Современный спортивный комплекс в центре Москвы</p>
</div>
<div class="footer__col">
<h4>Навигация</h4>
<a href="#objects">Объекты</a>
<a href="#services">Услуги</a>
<a href="#gallery">Галерея</a>
<a href="#contacts">Контакты</a>
</div>
<div class="footer__col">
<h4>Контакты</h4>
<span>+7 (495) 123-45-67</span>
<span>info@olimparena.ru</span>
<span>Москва, ТТК</span>
</div>
<div class="footer__col">
<h4>Социальные сети</h4>
<div class="footer__socials">
<a href="#" aria-label="Telegram">Tg</a>
<a href="#" aria-label="VK">Vk</a>
</div>
</div>
</div>
<div class="footer__bottom">
<span>© 2026 OlimpArena. Все права защищены.</span>
<div>
<a href="#">Политика конфиденциальности</a>
<a href="#">Условия использования</a>
</div>
</div>
</div>
</footer>
</div>
<script src="./assets/js/main.js" defer></script>
</body>
</html>