{% extends 'base.html' %}

{% block title %}Главная — Конференции.РФ{% endblock %}

{% block content %}
<!-- Hero слайдер -->
<section class="hero-section">
    <div id="heroSlider" class="carousel slide" data-bs-ride="carousel" data-bs-interval="3000">
        <div class="carousel-indicators">
            <button type="button" data-bs-target="#heroSlider" data-bs-slide-to="0" class="active"></button>
            <button type="button" data-bs-target="#heroSlider" data-bs-slide-to="1"></button>
            <button type="button" data-bs-target="#heroSlider" data-bs-slide-to="2"></button>
            <button type="button" data-bs-target="#heroSlider" data-bs-slide-to="3"></button>
        </div>
        <div class="carousel-inner">
            <div class="carousel-item active">
                <div class="slide-content slide-1 d-flex align-items-center justify-content-center">
                    <div class="text-center text-white animate__animated animate__fadeInUp">
                        <i class="fas fa-chalkboard-teacher fa-4x mb-4"></i>
                        <h1 class="display-5 fw-bold">Аудитории для конференций</h1>
                        <p class="lead">Современное оборудование, комфортные условия, вместимость до 100 человек</p>
                        <a href="{{ url_for('register') }}" class="btn btn-light btn-lg mt-3 px-4">
                            <i class="fas fa-arrow-right me-2"></i>Начать
                        </a>
                    </div>
                </div>
            </div>
            <div class="carousel-item">
                <div class="slide-content slide-2 d-flex align-items-center justify-content-center">
                    <div class="text-center text-white animate__animated animate__fadeInUp">
                        <i class="fas fa-laptop-house fa-4x mb-4"></i>
                        <h1 class="display-5 fw-bold">Коворкинг-пространства</h1>
                        <p class="lead">Идеальная среда для продуктивной работы и нетворкинга</p>
                        <a href="{{ url_for('register') }}" class="btn btn-light btn-lg mt-3 px-4">
                            <i class="fas fa-arrow-right me-2"></i>Начать
                        </a>
                    </div>
                </div>
            </div>
            <div class="carousel-item">
                <div class="slide-content slide-3 d-flex align-items-center justify-content-center">
                    <div class="text-center text-white animate__animated animate__fadeInUp">
                        <i class="fas fa-film fa-4x mb-4"></i>
                        <h1 class="display-5 fw-bold">Кинозалы</h1>
                        <p class="lead">Масштабные мероприятия на большом экране с системой Dolby</p>
                        <a href="{{ url_for('register') }}" class="btn btn-light btn-lg mt-3 px-4">
                            <i class="fas fa-arrow-right me-2"></i>Начать
                        </a>
                    </div>
                </div>
            </div>
            <div class="carousel-item">
                <div class="slide-content slide-4 d-flex align-items-center justify-content-center">
                    <div class="text-center text-white animate__animated animate__fadeInUp">
                        <i class="fas fa-handshake fa-4x mb-4"></i>
                        <h1 class="display-5 fw-bold">Удобное бронирование</h1>
                        <p class="lead">Оформите заявку онлайн за пару кликов</p>
                        <a href="{{ url_for('register') }}" class="btn btn-light btn-lg mt-3 px-4">
                            <i class="fas fa-arrow-right me-2"></i>Начать
                        </a>
                    </div>
                </div>
            </div>
        </div>
        <button class="carousel-control-prev" type="button" data-bs-target="#heroSlider" data-bs-slide="prev">
            <span class="carousel-control-prev-icon"></span>
        </button>
        <button class="carousel-control-next" type="button" data-bs-target="#heroSlider" data-bs-slide="next">
            <span class="carousel-control-next-icon"></span>
        </button>
    </div>
</section>

<!-- Преимущества -->
<section class="features-section py-5">
    <div class="container">
        <h2 class="text-center fw-bold mb-5 section-title">Почему выбирают нас</h2>
        <div class="row g-4">
            <div class="col-md-4">
                <div class="feature-card card border-0 shadow-sm h-100 text-center p-4">
                    <div class="feature-icon mx-auto mb-3">
                        <i class="fas fa-clock fa-2x text-primary"></i>
                    </div>
                    <h5 class="fw-bold">Быстрое бронирование</h5>
                    <p class="text-muted">Оформите заявку за несколько минут без лишних формальностей</p>
                </div>
            </div>
            <div class="col-md-4">
                <div class="feature-card card border-0 shadow-sm h-100 text-center p-4">
                    <div class="feature-icon mx-auto mb-3">
                        <i class="fas fa-map-marker-alt fa-2x text-primary"></i>
                    </div>
                    <h5 class="fw-bold">Разнообразие площадок</h5>
                    <p class="text-muted">Аудитории, коворкинги и кинозалы для любого формата</p>
                </div>
            </div>
            <div class="col-md-4">
                <div class="feature-card card border-0 shadow-sm h-100 text-center p-4">
                    <div class="feature-icon mx-auto mb-3">
                        <i class="fas fa-shield-alt fa-2x text-primary"></i>
                    </div>
                    <h5 class="fw-bold">Надёжность</h5>
                    <p class="text-muted">Гарантированное подтверждение и поддержка на всех этапах</p>
                </div>
            </div>
        </div>
    </div>
</section>

<!-- CTA -->
<section class="cta-section py-5">
    <div class="container text-center">
        <h2 class="fw-bold text-white mb-3">Готовы забронировать помещение?</h2>
        <p class="text-white-50 mb-4">Зарегистрируйтесь и оформите заявку прямо сейчас</p>
        <a href="{{ url_for('register') }}" class="btn btn-light btn-lg px-5">
            <i class="fas fa-rocket me-2"></i>Зарегистрироваться
        </a>
    </div>
</section>
{% endblock %}