@extends('frontend.layouts.app')

@section('title')

@endsection

@section('seo')
<title>Your Trusted Service Contracting Partner | Beta Com Resources Inc.</title>
<meta property="og:locale" content="en_US" />
<meta property="og:url" content="" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Your Trusted Service Contracting Partner | Beta Com Resources Inc." />
<meta property="og:description" content="Discover Beta Com Resources Inc., a dynamic service contracting company offering Manufacturing, Maintenance, Retail Support, and Janitorial services. Backed by industry leaders, we provide innovative workforce solutions, enriching lives with employment opportunities and tailored services." />
<meta property="og:site_name" content="Beta Com Resources Inc." />
<meta property="og:image" content="{{ asset('images/thumbnail.jpg') }}" />
<meta property="og:thumbnail" content="{{ asset('images/thumbnail.jpg') }}" />
<meta property="og:keywords" content="Beta Com Resources Inc., Service contracting, Workforce solutions, Manufacturing services, Maintenance solutions, Retail support, Janitorial services, Full outsourcing, Reliable business partner, Innovative solutions, Agile workforce, Skilled manpower, Workforce training, Background checking, Philippine services, Business processes, Dynamic service provider, Enriching lives through employment, Industry leaders, Service excellence">
@endsection

@section('content')
<div class="contact-bg">
    <div class="container">

        <div class="text-center">
            <img src="{{ asset('images/banner-line.png') }}" class="d-block align-middle img-fluid ps-5 mx-auto" alt="..." width="250" data-aos="fade-left">
            <h1 class="banner-title text-white m-0" data-aos="zoom-out">CONTACT US</h1>
            <img src="{{ asset('images/banner-line.png') }}" class="d-block align-middle img-fluid pe-5 mx-auto" alt="..." width="250" data-aos="fade-right">
        </div>

    </div>
</div>

<div class="container">
    <div class="row py-5">
        <h4 class="text-black-50 ">HOME > CONTACT US</h4>
    </div>
</div>

<div class=" mb-5 overflow-hidden">

    <!-- <div class="row mb-5">
        <span class="fw-bold span-montserrat">SEND US A MESSAGE</span>
    </div> -->

    <div class="row justify-content-end gy-2">

        <div class="col-lg-10">
            <div class="row text-lg-start text-center mb-5">
                <span class="fw-bold span-montserrat">SEND US A MESSAGE</span>
            </div>
        </div>

        <div class="col-lg-5" data-aos="fade-right" data-aos-offset="500" data-aos-duration="500">
            <form id="contactForm" action="{{ route('form.submit') }}" method="POST">
                @csrf
                <div class="row gy-4 mb-4">
                    <div class="col-12 col-md-6 col-xl-6">
                        <div>
                            <input type="text" class="form-control rounded-0 p-3" value="{{old('name')}}" name="name" id="name" placeholder="Your Name">
                        </div>
                    </div>
                    <div class="col-12 col-md-6 col-xl-6">
                        <div>
                            <input type="email" class="form-control rounded-0 p-3" value="{{old('email')}}" name="email" id="email" placeholder="Email Address">
                        </div>
                    </div>
                </div>

                <div class="row gy-4 mb-4">
                    <div class="col-12 col-md-6 col-xl-6">
                        <div>
                            <input type="number" class="form-control rounded-0 p-3" value="{{old('phone_no')}}" name="phone_no" id="phone_no" placeholder="Phone Number">
                        </div>
                    </div>
                    <div class="col-12 col-md-6 col-xl-6">
                        <div>
                            <input type="text" class="form-control rounded-0 p-3" value="{{old('subject')}}" name="subject" id="subject" placeholder="Subject">
                        </div>
                    </div>
                </div>

                <div class="mb-4">
                    <textarea type="text" class="form-control rounded-0 p-3" name="message" id="message" rows="6" placeholder="Message">{{old('message')}}</textarea>
                </div>

                <div class="mb-4">
                    <button type="submit" class="btn bg-color-light rounded-0 border-0">
                        SEND NOW <i class="fa-solid fa-arrow-right-long"></i>
                    </button>
                </div>
            </form>


            <div class="d-lg-block d-none">
                <div class="d-flex flex-wrap bg-darkgreen text-white py-3 px-4">
                    <!-- Location Section -->
                    <div class="d-flex  col-lg-3 mb-3">
                        <i class="fa-solid fa-location-dot fs-2 me-2"></i>
                        <div>
                            <div class="fw-semibold">Find Us</div>
                            <div class="fw-bold">302. Freedom Plaza Bldg., N.Domingo, San Juan City NCR</div>
                        </div>
                    </div>
                    <!-- Phone Section -->
                    <div class="d-flex  col-lg-3 mb-3">
                        <i class="fa-solid fa-phone fs-2 me-2"></i>
                        <div>
                            <div class="fw-semibold">Call Us Today</div>
                            <div class="fw-bold">82523453 / 09178683414</div>
                        </div>
                    </div>
                    <!-- Email Section -->
                    <div class="d-flex  col-lg-3 mb-3">
                        <i class="fa-solid fa-envelope fs-2 me-2"></i>
                        <div>
                            <div class="fw-semibold">Email Us Now</div>
                            <div class="fw-bold">info@betacom.ph</div>
                        </div>
                    </div>
                    <!-- Website Section -->
                    <div class="d-flex  col-lg-3 mb-3">
                        <i class="fa-solid fa-globe fs-2 me-2"></i>
                        <div>
                            <div class="fw-semibold">Visit Us Today</div>
                            <div class="fw-bold">www.betacom.ph</div>
                        </div>
                    </div>
                </div>
            </div>


            <div class="d-lg-none d-sm-block d-md-block">
                <div class="row bg-darkgreen gy-4 text-white py-3 px-2">
                    <div class="col-lg-1">
                        <i class="fa-solid fa-location-dot fs-1"></i>
                    </div>
                    <div class="col-lg-2">
                        <span class="fw-bold">Find Us</span>
                        <span>302. Freedom Plaza Bldg., N.Domingo, San Juan City NCR</span>
                    </div>

                    <div class="col-lg-1">
                        <i class="fa-solid fa-phone fs-1"></i>
                    </div>
                    <div class="col-lg-2">
                        <span class="fw-bold">Call Us Today</span>
                        <span>82523453 / 09178683414</span>
                    </div>

                    <div class="col-lg-1">
                        <i class="fa-solid fa-envelope fs-1"></i>
                    </div>
                    <div class="col-lg-2">
                        <span class="fw-bold">Email Us Now</span>
                        <span>info@betacom.ph</span>
                    </div>

                    <div class="col-lg-1">
                        <i class="fa-solid fa-globe fs-1"></i>
                    </div>
                    <div class="col-lg-2">
                        <span class="fw-bold">Visit Us Today</span>
                        <span>www.betacom.ph</span>
                    </div>
                </div>
            </div>



        </div>
        <div class="col-lg-5" data-aos="flip-up" data-aos-offset="500" data-aos-duration="500">
            <iframe class="w-100 shadow" src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d15443.38486124611!2d121.0268206!3d14.6078349!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x3397b741645577db%3A0x84ba64f32da6ed97!2sFreedom%20Plaza%20Building!5e0!3m2!1sen!2sph!4v1698369186524!5m2!1sen!2sph" width="600" height="569" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
        </div>
    </div>
</div>

<style>
    .contact-bg {
        background-image: url("{{ asset('images/banner-about.jpg') }}");
        height: 50vh;
        background-position: center;
        background-size: cover;

        display: flex;
        justify-content: center;
        align-items: center;
    }

    @media (max-width: 768px) {
        .contact-bg {
            height: 25vh;
        }
    }
</style>
@endsection