@extends('front.front')
@section('content')

    <!-- EMPIEZA SECCIÓN NOTICIAS -->

    <div class="container-fluid mt--lg-50 back_general"
        style="background-image: url({{ asset('imagenes/imagenes_landing/Noticias.jpg') }})">
        <div class="row wow slideInDown" data-wow-duration="1s" >
            <div class="col-lg-12">
                <div class="container">
                    <div class="row">
                        <div class="col-12">
                            <div class="text_content">
                                <p class="category">NOTICIAS</p>
                                <p class="title_category hide-mobile">
                                    Las noticias más recientes<br />
                                    siempre a tu alcance
                                </p>
                                <p class="title_category hide-desktop">
                                    Las noticias más recientes siempre a tu alcance
                                </p>
                                <!-- <p class="text_paragraph">
                                    Solo los Distribuidores Autorizados SKF tienes
                                    acceso a nuestras actividades de investigación
                                    llevadas a cabo en nuestro Centro de Ingeniería e
                                    Investigación (Engineering & Research Centre) en
                                    Holanda, único en capacidades e instalaciones en el
                                    mundo de las soluciones industriales.
                                </p> -->
                                <p style="text-align:center;">
                                    <a href="{{ url('login') }}" class="button_login">
                                        INGRESAR
                                    </a>
                                </p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- <div class="container content_info wow slideInRight" data-wow-duration="2s" >
        <div class="row">
            <div class="col-lg-12">
                <p class="title_category_blue">
                    Las mejor información<br />
                    actualizada en todo el mundo
                </p>
                <p class="text_paragraph_grey">
                    En SKF distribuidores tenemos una selección de contenidos y acontecimientos más importantes en el mundo
                    de los rodamientos.
                    Las últimas noticias e información en material de tecnología e innovaciones. Podrás conocer todo al
                    momento y de esa manera
                    siempre estar al día.
                </p>
            </div>
        </div>
        <a href="{{ url('login') }}" class="button_login">
            INGRESAR
            <span class="icon">-></span>
        </a>
    </div> -->
    <!-- TERMINA SECCIÓN NOTICIAS -->

    <!-- SECCIÓN FORMULARIO -->
    <div class="formulario" style="width:100%">
        <div class="container-fluid contenedor_padding">
            <div class="row">
                <div class="col-lg-12 col-md-12 wow slideInLeft color_one" data-wow-duration="1s" >
                    <p class="titulo-body">¿Aún no eres distribuidor autorizado?</p>
                    <p class="title_small hide-mobile">
                        Déjanos tus datos y con gusto nos
                        <br />
                        pondremos en contacto contigo.
                    </p>
                    <p class="title_small hide-desktop">
                        Déjanos tus datos y con gusto nos
                        pondremos en contacto contigo.
                    </p>
                    <p class="texto_plano">
                    Solo los distribuidores autorizados SKF México
                    tienen acceso a todos nuestros documentos y
                    actividades que impactarán profundamente
                    en tu negocio.
                    </p>
                </div>
                <div class="col-lg-12 col-md-12 wow slideInRight color_two" data-wow-duration="1s">
                    <div class="row">
                        <form method="get" action="{{ url('/enviar_correo') }}" class="col-12">
                            @csrf
                            <div class="row" id="form_contacto">
                                <div class="col-md-12" style="margin-bottom:20px;">
                                    <input type="text" name="nombre" id="nombre" placeholder="Nombre y apellidos">
                                    <span id="nombre_mensaje" class="invalid-feedback"></span>
                                </div>
                                <div class="col-md-6" style="margin-bottom:20px;">
                                    <input type="email" name="email" id="correo" placeholder="Correo electrónico">
                                    <span id="correo_mensaje" class="invalid-feedback"></span>
                                </div>
                                <div class="col-md-6" style="margin-bottom:20px;">
                                    <input type="tel" name="tel" id="tel" placeholder="Teléfono">
                                    <span id="telefono" class="invalid-feedback"></span>
                                </div>
                                <div class="col-md-12" style="margin-top:20px;">
                                    <textarea name="mensaje" id="mensaje" cols="30" rows="10" placeholder="Mensaje"></textarea>
                                </div>
                                <div class="col-12 message">
                                    ¡El mensaje se ha enviado correctamente!
                                </div>
                                <button type="button" class="button_login button_width" id="enviar">ENVIAR <span class="icon">-></span></button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection