{% extends 'base.html.twig' %}

{% block title %}{{ 'lang.price_meta_title'|trans }}{% endblock %}

{% block seo %}
    {% include 'general/components/seo_meta.html.twig' with {
        titleKey: 'lang.price_meta_title',
        descriptionKey: 'lang.price_meta_description',
        keywordsKey: 'lang.price_meta_keywords',
        route: 'app_price'
    } %}
{% endblock %}

{% block navigation %}{% endblock %}

{% block styles %}
    <style>

        #navbar {
            background: transparent;
        }

        {% if app.user %}
        .dropdown-menu-container {
            top: 80px;
        }

        {% endif %}

        .navbar-container {
            padding: 50px 20px;
        }

    </style>
{% endblock %}

{% block body %}
    <div>
        <div class="gradient-background container-fluid h-100 p-0 mb-100">
            <div class="home-container-new-content">
                {% include 'general/navigation.html.twig' %}
                <div class="row pt-5 pb-5">
                    <div class="col-12 display-flex-center p-0 mb-100">
                        <div>
                            <div class="orange-subtitle">{{ 'lang.choose_your_plan_subtitle' | trans }}</div>
                            <div class="dark-blue-title">{{ 'lang.prices_title' | trans }}</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="page-limit-container mb-100">
            <div class="orange-subtitle text-center mt-5">{{ 'lang.we_have_solution_subtitle' | trans }}</div>
            <div class="dark-blue-title mb-5">{{ 'lang.choose_best_plan_title' | trans }}</div>

            <div class="mb-100">
                {% include 'price/price_section.html.twig' %}
            </div>
        </div>


        {% include 'general/components/slider.html.twig' %}

        <div class="page-limit-container p-5">
            <div class="orange-subtitle text-center mt-5">FAQ</div>
            <div class="dark-blue-title mb-5">{{ 'lang.frequently_asked_questions' | trans }}</div>

            {% include 'general/components/accordion.html.twig' %}
        </div>

    </div>
{% endblock %}