{% extends 'base.html.twig' %}
{% block title %}Mexico Vehicle Insurance Qualitas | Novamar Insurance Mexico{% endblock %}
{% block metas %}
<meta name="description" content="Get reliable resident auto insurance in Mexico. Protect your vehicle with comprehensive coverage. Trust Novamar Insurance Mexico for peace of mind." />
    <meta name="keywords" content="resident auto, auto insurance, resident auto insurance, mexican auto insurace, mexican resident auto, mexico resident auto, mexico auto insurance, mexican resident auto insurance, mexico resident auto insurance mexico, auto insurance for expats, auto insurance in mexico" />
   {#} {{app.robots|raw} #}
    <meta property="og:title" content="Mexican Resident Auto Insurance With Qualitas" />
    <meta property="og:description" content="Mexican Resident Auto Insurance for all people who has a vehicle registered in Mexico (mexican plates) with Qualitas">
    <meta property="og:image" content="{{asset('img/mexican-resident-auto.jpg')}}" />
    <meta property="og:image:secure_url" content="{{asset('img/mexican-resident-auto.jpg')}}" />
    <meta property="og:image:type" content="image/jpg" />
    <meta property="og:image:width" content="995" />
    <meta property="og:image:height" content="325">
    {#<meta property="og:url" content="{{ app.root }}">
    {% if distributor != '' %}
        <link rel="canonical" href="{{ app.root }}insurance-services/mexico-auto-insurance/resident-auto/qualitas">
    {% endif %}#}
{% endblock %}
{% block css %}
    <!-- TrustBox script -->
	<script type="text/javascript" src="//widget.trustpilot.com/bootstrap/v5/tp.widget.bootstrap.min.js" async></script>
	<!-- End TrustBox script -->
      {{encore_entry_link_tags('trustpilotWidgetsCSS')}}
    {#<link rel="stylesheet preload" href="{{ app.asset_path }}/assets/update/css/section/trust-pilot-widgets.css?v{{"now"|date("dmYHis")}}" as="style">	
    <link rel="stylesheet" href="{{ app.asset_path }}/assets/css/jquery.steps.min.css">#}
     {{encore_entry_link_tags('residentAutoMinCSS')}}
    <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
    <style>    
      {#}  {% if pageConfig == 'WOMAF' %} #}
            .jumbotron.resident-auto {            
                min-height: 100vh !important;
                margin-top: 0px !important;
            }   
            #layer_banner{
            width: 100%;
            height: 100vh !important;
            position: relative;
            background-color: rgba(0, 0, 0, 0.4);
        }         
        {#% endif %#}
        .jumbotron.resident-auto {
            width:100%;
            /* margin-top: 133px;*/
            min-height: calc(100vh - 133px);
            position: relative;
        }
         #layer_banner{
            width: 100%;
            height: calc(100vh - 133px);
            position: relative;
            background-color: rgba(0, 0, 0, 0.5);
        }
        #banner_resident_auto{
            position:absolute;
            width: 100%;
            height:100%;
            object-fit:cover;
        }
        #alertMessage{
            height: 60px;
            position: fixed;
            left:10px;
            bottom: 30px;
            cursor:pointer;
            z-index: 100;
        }
        #alertMessage2 > p{
           font-size: 20px;
        }
        .video-responsive {
            overflow:hidden;
            padding-bottom:400px; /* Adecua este valor para controlar la altura del video */
            position:relative;
            height:0;
            border-radius: 10px;
        }
        .video-responsive iframe{
            left:0;
            top:0;
            height:100%;
            width:100%;
            position:absolute;
        }
        .separator-section{
            width: 100%;
            height: 100px;
            margin: 20px 0;
        }
        .separator-line{
            height: 1px;
            background: #f36e03;
        }
        .separator-section-image{
            height: 60px;
            
        }
        .separator-section-image > img{
            width: 60px;
            height: 60px;
            object-fit: fill;
        }
        #logo_qualitas{
            width: auto;
            height:200px;
            object-fit: fill;
            position: relative;
            background: rgba(255,255,255,.8);
            border-radius: 5px;
        }
        .foundOnTaxIDSpan{
            padding: 10px;
            background: #084A7A;
            color: #fff;
            border-radius: 20px;
        }
        .modal-dialog {
                margin-top: 110px;
            }
        @media(max-width: 991px){
            .jumbotron.resident-auto{
                  /*margin-top: 113px;*/
                min-height: calc(100vh - 113px);
            }
            #layer_banner{
                min-height: calc(100vh - 113px);
            }
        }
        @media(max-width: 576px){
            #alertMessage2 > p{
                font-size: 16px;
            }
            .jumbotron.resident-auto {
                  /*margin-top: 113px;*/
                min-height: calc(100vh - 113px);
            }
            .modal.show{
                top: 0;
            }
            .modal-dialog {
                margin-top: 90px;
            }
            #modalFullCoverage::-webkit-scrollbar{
                display:none;
            }
            .wizard>.steps a{
                padding: .5em;
                min-height:62.56px;
            }
            #logo_qualitas{
                height: 120px;
            }
            .jumbotron-text >h1{
                font-size: 1.5em;
            }
            .jumbotron-text {
                top: -100px
            }
        }
        .wizard> .content> .body select.error {
            background: rgb(251, 227, 228);
            border: 1px solid #fbc2c4;
            color: #8a1f11;
        }
        #increaseDiscountButton{
            font-size: 17px;
            font-weight: bold;
            color: #0f702d;
            background: #f7f7f7;
            padding: 10px;
            margin-top: 10px;
            border: 1px solid #acdbac;
            cursor: pointer;
        }
        #increaseDiscountContainer{
            opacity: 0;
            transition: opacity 2s linear;            
        }.applyInspectionLabel{
            font-size: 22px;
            color: #37b341;
        }
        .inspectionCarImage{
            max-height: 70px;
        }
        .buttonUploadImage{
            font-size: 13px;
            font-weight: bold;
            color: #000;
            background: #f7f7f7;
            padding: 10px;
            border: 1px solid #ccc;
            cursor: pointer;
        }.buttonUploadImage.uploaded{
            color: #289728;
            border: 1px solid #31bf31;
        }.buttonUploadImage.error {
            color: #d11919;
            border: 1px solid #ff4d4d;
        }#uploadResponse{
            padding: 2px;
            color: #d11919;
            font-weight: bold;
        }.validFormat{
            font-size: 12px;
            font-weight: bold;
        }.previewPicture{
            width: 100%;
            background: #f3f2f2;
            border: 1px solid #dddddd;
            border-bottom: 2px solid #ccc;
            margin-top: 3px;
            padding-top: 5px;
            padding-bottom: 5px;
        }#messageBottom{
            padding: 10px;
            width: 100%;
            position: fixed;
            min-height: 100px;
            z-index: 9998;
            bottom: 0;
            text-align: center;
            border-top: 2px solid #444;
        }#messageBottomTitle{
            font-size: 20px;
        }
        @media (max-width: 767px) {
            #messageBottom{
                text-align: left;
            }
            #messageBottomContainer{
                margin-right: 110px;
            }
        }
        #fullLoading{
            width: 100%;
            height: 100%;
            position: fixed;
            z-index: 9999;
            top: 0;
            background-color: rgba(0,0,0,0.4);
            padding-top: 49vh;
        }#fullLoading > img{
            background-color: #f7f7f7;
            padding: 10px;
            border-radius: 50px;
            box-shadow: 1px 1px 100px 1px;
        }
        .row-info > span{
            padding-left: 20px;
        }.customEndPrice{
            padding-left: 20px;
        }.cardAlert{
            max-width: fit-content;
            font-size: 13px;
            padding: 3px;
            margin-left: 3px;
            margin-top: 4px;
        }.contactUs{
            background: #fbfbfb;
            padding: 10px;
        }.errorField{
            background: rgb(251, 227, 228);
            border: 1px solid #fbc2c4;
            color: #8a1f11;
        }
    </style>
{% endblock %}
{% block body %}
    {#<div id="fullLoading" class="text-center d-none">
        <img src="{{ app.asset_path }}/assets/img/load75x75.gif" alt="Loading icon">
    </div>
     solo se mostrara cuando la bandera de solo formualrio este desactivada 
    {% if pageConfig == 'WMAF' %}#}
    <section id="background">
        <div class="jumbotron bg-dark resident-auto p-0">
            <picture>
             <source type="image/webp" media="(max-width: 576px)"  srcset="{{asset(imgSlidePath~'resident-auto-mobile.webp')}}">
            <source type="image/jpeg" media="(max-width: 576px)" srcset="{{asset(imgSlidePath~'resident-auto-mobile.jpg')}}">
            <source type="image/webp" srcset="{{asset(imgSlidePath~'resident-auto.webp')}}">
            <source type="image/jpeg" srcset="{{asset(imgSlidePath~'resident-auto.jpg')}}">
                <img id="banner_resident_auto" src="{{asset(imgSlidePath~'resident-auto.jpg')}}" alt="banner resident auto">
            </picture>
            <div class="d-flex justify-content-center align-items-center" id="layer_banner">
                <div class="jumbotron-text text-center">
                    <picture>
                        <source type="image/webp" srcset="{{asset(imgCompaniesPath~'qualitas.webp')}}">
                        <source type="image/png" srcset="{{asset(imgCompaniesPath~'qualitas.png')}}">
                        <img id="logo_qualitas" src="{{asset(imgCompaniesPath~'qualitas.png')}}" alt="qualitas logo">
                    </picture>
                    <h1>Mexican Plates Auto Insurance</h1>
                    <button type="button" class="quoteNow btn btn-novamar btn-lg" id="go-to-form"><span>Quote, Buy & Print your Policy</span></button>
                </div>
            </div>
        </div>
    </section>
     <section>
        <div class="container">
            <div class="row" id="section-content-form">
                <div class="col-12 mt-3">
                   <h2 class="text-center">Qualitas Insurance</h2>
                    <div class="line-orange"></div>
                    <div class="container-fluid mt-4 mb-4">
                        <p class="text-center">
                            Novamar and Qualitas SEGUROS, are leaders in the vehicle insurance industry in Mexico. We have designed the Qualitas / Novamar Mx Auto Registration Policy, a unique Auto Policy for Expatriates with vehicles with Mx License.
                        </p>
                    </div>
                   {# {% if distributor !="" %}
                    <input type="hidden" id="isDistributor" value="true">
                    {# solo se mostrara cuando la bandera de solo formualrio este desactivada #}
                   {# {% if pageConfig != 'OF' %}
                    <div class="text-center">
                        <img src="{{ app.asset_path }}/assets/img/distributor/{{ distributor_img }}" style="margin-top:15px;">
                    </div>
                    {% endif %}
                    {% else %}
                        <input type="hidden" id="isDistributor" value="false">
                    {% endif %}
                    {# solo se mostrara cuando la bandera de solo formualrio este desactivada 
                    {% if pageConfig == 'WMAF' or pageConfig == 'WOMAF' %}#}
                     {{ include('./components/trust-pilot-ranking.html.twig', { option : '' } ) }}
                    {#{% endif %}  #}
                    
                   {#} {{ form_start(form, {'attr' : {'id':'form_resident_auto'}} ) }} {{ form_errors(form) }} 
                   ***Formulario
                   #}
                   <div id="wizard" class="residentAutoWizard">
                        <h5>Quoted</h5>
                        <section>
                            <div class="row">
                                <div class="col-12 row">
                                </div> 
                            </div> 
                         </section>
                    </div>

                 <div class="row">
                    {# separador #}
                    <div class="separator-section container-fluid d-flex align-items-center">
                        <div class="separator-line col-lx-5 col-lg-5 col-md-5 col-sm-5"></div>
                        <div class="separator-section-image col-lx-2 col-lg-2 col-md-2 col-sm-2 d-flex justify-content-center">
                            <img src="{{asset('img/novasun.png')}}" loading="lazy" alt="logo novamar insurance"class="img-responsive"></img>
                        </div>
                        <div class="separator-line col-lx-5 col-lg-5 col-md-5 col-sm-5"></div>
                    </div>
                    {# <div class="col-lg-12 col-sm-12 mt-2 mb-2">
                        <div class="video-responsive">
                            <iframe width="560" height="315" loading="lazy" src="https://www.youtube.com/embed/5r5Lu3B9qFI" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
                        </div>
                    </div> #}
                    <div class="col-lg-12 col-md-12 col-sm-12 mt-4 mb-4">
                        <span>Additional Benefits:</span><br><br>
                        <span>Here are the additional benefits from this Policy with Premiums up to 35% lower than those found in the market.</span>
                        <div class="line-orange"></div>
                        <div class="row">
                            <div class="col-lg-4 col-md-6 col-sm-12">
                                <ul class="list-group list-group-flush">
                                    <li class="list-group-item">All processes will be handled by the ANA Seguros bilingual staff specializing in the expat community in Mexico.</li>
                                    <li class="list-group-item">Damage to Vehicle due to overheating</li>
                                    <li class="list-group-item">Roadside assistance including gasoline delivery</li>
                                </ul>
                            </div>
                            <div class="col-lg-4 col-md-6 col-sm-12">
                                <ul class="list-group list-group-flush">
                                    <li class="list-group-item">Rental Car coverage for insured vehicle in case of total loss</li>
                                    <li class="list-group-item">Drivers under 18 years are covered for Liability</li>
                                    <li class="list-group-item">Liability extension while driving in other vehicles (including motorcycles).</li>
                                </ul>
                            </div>
                            <div class="col-lg-4 col-md-6 col-sm-12">
                                <ul class="list-group list-group-flush">
                                    <li class="list-group-item">Liability for trailers, caravans and for objects transported in the vehicle; caused by the insured.</li>
                                    <li class="list-group-item">USA and Canada liability coverage extension</li>
                                    <li class="list-group-item">English speaking staff to answers your call</li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 col-sm-12 mt-4 mb-4">
                        <span>Qualitas Claims Services</span>
                        <div class="line-orange"></div>
                        <ul class="list-group list-group-flush">
                            <li class="list-group-item">Adjuster assistance in English</li>
                            <li class="list-group-item">All claims handled by the Tourist Auto Department of ANA to ensure that an English-speaking person is in charge of the claim.</li>
                        </ul>
                    </div>
                    <div class="col-lg-6 col-md-6 col-sm-12 mt-4 mb-4">
                        <span>Coverage:</span>
                        <div class="line-orange"></div>
                        <ul class="list-group list-group-flush">
                            <li class="list-group-item">Comprehensive</li>
                            <li class="list-group-item">Limited</li>
                            <li class="list-group-item">Liability</li>
                        </ul>
                    </div>
                    <div class="col-lg-12 col-sm-12 mt-4 mb-4">
                        <span>Complete the fields above to get a free online quote for vehicle insurance in Mexico today.</span>
                    </div>
                </div>
            {#{% endif %}#}
        </div>
   </section>
{% endblock %}