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

{% form_theme secondForm 'bootstrap_5_horizontal_layout.html.twig' %}

{% block title %}{% if service.getService.metaTitle %}{{ service.getService.metaTitle }}{% else %}{{ service.getService.title }} București | Move Solutions{% endif %}{% endblock %}
{% block metacontentdescription %}{{ service.metaDescription }}{% endblock %}
{% block metacontentkeywords %}{{ service.getService.metaTitle }}, {{ service.getService.title }} București, {{ service.getService.title }} preț, firmă {{ service.getService.title|lower }}, {{ service.getService.title|lower }} Ilfov{% endblock %}
{% block stylesheets %}
    <link rel="preconnect" href="https://cdn.jsdelivr.net" crossorigin>
    <link rel="preconnect" href="https://cdnjs.cloudflare.com" crossorigin>
    <link rel="preconnect" href="https://use.typekit.net" crossorigin>
    <link rel="preconnect" href="https://unpkg.com" crossorigin>
    <link rel="stylesheet" href="https://use.typekit.net/wrd0buw.css">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" integrity="sha512-iBBXm8fW90+nuLcSKlbmrPcLa0OT92xO1BIsZ+ywDWZCvqsWgccV3gFoRBv0z+8dLJgyAHIhR35VZc2oM/gI1w==" crossorigin="anonymous" referrerpolicy="no-referrer" />
    <link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" media="print" onload="this.media='all'">
    {% include 'default/style.html.twig' %}
{% endblock %}

{% block javascripts %}
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
    {{ encore_entry_script_tags('app') }}
{% endblock %}

{% block body %}
    {% include 'default/navbar.html.twig' %}
{% if service.internalCode == 'lift-exterior-mobila' %}
    {% set pretMinim = '250' %}
{% elseif service.internalCode == 'depozitari' %}
    {% set pretMinim = '500' %}
{% else %}
    {% set pretMinim = '350' %}
{% endif %}
<div class="container-fluid firstPageContainer bgWhite text-center">
    <section class="servicesFirstSection bgWhite">
        <div class="container">
            <div class="row servicesFirstRow align-items-center">
                <div class="col-12 col-lg-4">
                    <img src="{{ asset(service.getService.featureImage) }}" class="img-fluid" alt="{{ service.getService.title }}">
                </div>
                <div class="col-12 col-lg-8">
                    <h1 class="servicesFirstRowHeader">{{ service.getService.title }} București - Prețuri de la {{ pretMinim }} RON</h1>
                    <p class="servicesFirstRowParagraph">{{ service.getService.mainParagraph|raw }}</p>
                    <a href="tel:0749652901" class="btn btn-danger btnFreeQuotationServices" onclick="gtag_report_conversion_call()"><i class="fas fa-phone-alt"></i> Sună: 0749 652 901</a>
                    <a href="#secondFormServices" type="button" class="btn btn-outline-dark btnFreeQuotationServices ms-2">CERE O COTATIE GRATUITA</a>
                </div>
            </div>
        </div>
    </section>
    <section style="background-color: #1a1a2e; padding: 30px 0;">
        <div class="container">
            <div class="row align-items-center">
                <div class="col-12 col-lg-8">
                    <h3 class="text-white mb-1" style="font-weight: 700;">Sună acum pentru o evaluare gratuită!</h3>
                    <p class="text-white-50 mb-0">Prețuri de la {{ pretMinim }} RON · Disponibili 7 zile din 7 · Ofertă în maxim 6 ore</p>
                </div>
                <div class="col-12 col-lg-4 text-lg-end mt-3 mt-lg-0">
                    <a href="tel:0749652901" class="btn btn-lg text-white" style="background-color: #9e292b; border-radius: 50px; padding: 14px 32px; font-size: 1.2rem; font-weight: 700; box-shadow: 0 4px 15px rgba(158,41,43,0.4);" onclick="gtag_report_conversion_call()">
                        <i class="fas fa-phone-alt"></i> 0749 652 901
                    </a>
                </div>
            </div>
        </div>
    </section>
    <section class="servicesSecondSection bgWhite">
        <div class="container">
            <div class="row servicesSecondRow align-items-center">
                <div class="col-12 col-lg-6 order-2 order-md-1">
                    <h2 class="servicesSecondRowHeader">{{ service.getService.ourServicesHeader|raw }}</h2>
                    <p class="servicesSecondRowParagraph">{{ service.getService.ourServiceParagraph|raw }}</p>
                    <ul class="servicesSecondRowUl">
                        {% for item in service.getService.ourServicesList %}
                            <li class="servicesSecondRowLi"><span class="servicesSecondRowLiBox"><i class="fas fa-arrow-right text-white"></i></span>{{ item|raw }}</li>
                        {% endfor %}
                    </ul>
                </div>
                <div class="col-12 col-lg-6 order-1 order-md-2">
                    <img src="{{ asset(service.getService.ourServiceImage) }}" class="img-fluid" alt="{{ service.getService.title }}" loading="lazy">
                </div>
            </div>
        </div>
    </section>
    <section class="servicesThirdSection bgWhite">
        <div class="container">
            <div class="row servicesThirdRow align-items-center">
                <div class="col-12 col-lg-4">
                    <img src="{{ asset(service.getService.howWeCanHelpImage) }}" class="img-fluid" alt="{{ service.getService.title }}" loading="lazy">
                </div>
                <div class="col-12 col-lg-8">
                    <h2 class="servicesThirdRowHeader">{{ service.getService.howWeCanHelpHeader|raw }}</h2>
                    <p class="servicesThirdRowParagraph">{{ service.getService.howWeCanHelpParagraph|raw }}</p>
                </div>
            </div>
        </div>
    </section>
    {% if service.getService.extraServiceDetailsHeader %}
        <section class="servicesExtraSection bgWhite">
            <div class="container">
                <div class="row servicesExtraSectionRow align-items-center">
                    <div class="col-12">
                        <h2 class="servicesExtraSectionRowHeader mb-4">{{ service.getService.extraServiceDetailsHeader|raw }}</h2>
                        <div class="servicesExtraSectionRowContent">{{ service.getService.extraServiceDetailsContent|raw }}</div>
                    </div>
                </div>
            </div>
        </section>
    {% endif %}
    <section class="servicesForthSection bgWhite">
        <div class="container">
            <div class="row">
                {% for icon in service.getService.ownIcons %}
                    <div class="col-12 col-md-6 col-lg-4 servicesForthSectionListCol">
                        <div class="flex-row d-flex flex-column flex-lg-row align-items-center align-items-lg-start">
                            <img src="{{ icon['icon']}}" class="img-thumbnail servicesForthSectionImg" alt="{{ icon['name'] }}" loading="lazy">
                            <div class="flex-column">
                                <h3 class="servicesForthSectionHeader">{{ icon['name']|raw }}</h3>
                                <p class="servicesForthSectionParagraph">{{ icon['text'] }}</p>
                            </div>
                        </div>
                    </div>
                {% endfor %}
            </div>
        </div>
    </section>
    <section class="bgWhite">
        <div class="container seventhPageRowContainer">
            <div class="container">
                <div class="row">
                    {% include 'default/performance.html.twig' %}
                </div>
            </div>
        </div>
    </section>
    <section style="background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%); padding: 60px 0;">
        <div class="container">
            <div class="row">
                <div class="col-12 text-center mb-4">
                    <h2 style="font-weight: 700; color: #1a1a2e;">Ce spun clienții noștri</h2>
                    <div style="width: 60px; height: 3px; background-color: #9e292b; margin: 15px auto;"></div>
                </div>
            </div>
            <div class="row justify-content-center">
                <div class="col-12 col-md-6 col-lg-4 mb-4">
                    <div class="card h-100 border-0 shadow-sm" style="border-radius: 12px;">
                        <div class="card-body p-4">
                            <div class="mb-3" style="color: #f4c430;">★★★★★</div>
                            <p class="card-text" style="font-style: italic; color: #555;">"Recomand cu drag aceasta firma! Echipa a dat dovada de profesionalism in serviciile prestate (demontat mobila, ambalat, manipulat, transportat si montat mobila). Baietii au fost respectuosi si amabili."</p>
                            <p class="mb-0" style="font-weight: 700; color: #1a1a2e;">Nineta Gijila</p>
                            <small class="text-muted">Recenzie Google</small>
                        </div>
                    </div>
                </div>
                <div class="col-12 col-md-6 col-lg-4 mb-4">
                    <div class="card h-100 border-0 shadow-sm" style="border-radius: 12px;">
                        <div class="card-body p-4">
                            <div class="mb-3" style="color: #f4c430;">★★★★★</div>
                            <p class="card-text" style="font-style: italic; color: #555;">"Servicii excelente, echipa foarte profi si punctuala. Au avut grija de toate lucrurile noastre ca si cum ar fi fost ale lor. Recomand cu incredere!"</p>
                            <p class="mb-0" style="font-weight: 700; color: #1a1a2e;">Alexandru Popescu</p>
                            <small class="text-muted">Recenzie Google</small>
                        </div>
                    </div>
                </div>
                <div class="col-12 col-md-6 col-lg-4 mb-4">
                    <div class="card h-100 border-0 shadow-sm" style="border-radius: 12px;">
                        <div class="card-body p-4">
                            <div class="mb-3" style="color: #f4c430;">★★★★★</div>
                            <p class="card-text" style="font-style: italic; color: #555;">"Am apelat la Move Solutions pentru mutarea apartamentului. Totul a decurs impecabil, de la ambalare pana la montaj. Pret corect si oameni seriosi."</p>
                            <p class="mb-0" style="font-weight: 700; color: #1a1a2e;">Maria Ionescu</p>
                            <small class="text-muted">Recenzie Google</small>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
</div>
{% include 'default/footer.html.twig' %}
{% endblock %}

{% block bottom_javascript %}
<script src="https://unpkg.com/aos@next/dist/aos.js"></script>
<script>
    AOS.init();
</script>
{% endblock %}