@extends('master')



@section('header')


<style>


    .section-title {
      font-weight: 800;
      color: #0b0c39;
    }
    .desc-text {
      color: #555;
    }
    .stat-card {
      background: #fff;
      border: 1px solid #dee2e6;
      padding: 30px;
      text-align: center;
      border-radius: 10px;
      box-shadow: 0 0 10px rgba(0,0,0,0.03);
      transition: 0.3s ease;
    }
    .stat-number {
      font-size: 32px;
      font-weight: bold;
      color: #32c36c;
    }
    .support-card {
      background: #fff;
      border: 1px solid #dee2e6;
      border-radius: 10px;
      padding: 30px;
      text-align: center;
      transition: 0.3s ease;
    }
    .support-card:hover {
      box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    }
    .support-card h5 {
      font-weight: 700;
      color: #0b0c39;
    }
    .support-card p {
      color: #555;
    }
    .support-btn {
      margin-top: 15px;
    }



    i.fas.fa-phone-alt {
    transform: none !important;
}






    .section-title {
      font-weight: 800;
      color: #0b0c39;
    }
    .desc-text {
      color: #555;
    }
    .feature-card {
      border: 1px solid #dce0e6;
      border-radius: 8px;
      padding: 25px;
      background-color: #fff;
      text-align: center;
      height: 100%;
      position: relative;
    }
    .feature-card::after {
      content: "";
      position: absolute;
      top: 0;
      right: 0;
      width: 30px;
      height: 30px;
      border-top: 6px solid #32c36c;
      border-right: 6px solid #32c36c;
      border-top-right-radius: 8px;
    }
    .feature-card h6 {
      font-weight: 700;
      margin-top: 15px;
      color: #0b0c39;
    }
    .form-container {
      background: #fff;
      padding: 25px;
      border-radius: 10px;
      box-shadow: 0 0 15px rgba(0,0,0,0.05);
    }











.mt-10{margin-top:10px;}
    .section-title {
      text-align: center;
      margin-bottom: 30px;
    }

    .section-title h2 {
      font-weight: bold;
      color: #00003b;
    }

    .plugin-box {
      background: #fff;
      border-radius: 8px;
      box-shadow: 0 0 20px rgba(0, 0, 0, 0.05);
      padding: 10px;
      margin-bottom: 30px;
      position: relative;
      height: 420px;
      border-bottom: 4px solid #FB4646;
      transition: all 0.3s ease-in-out;
    }

    .plugin-box:hover {
      transform: translateY(-5px);
    }

    .plugin-box h5 {
      font-weight: bold;
      color: #09023d;
    }

    .plugin-box p {
      font-size: 14px;
      color: #555;
    }

    .plugin-icon {
      font-size: 32px;
      color: #22c55e;
      margin-bottom: 15px;
      display: block;
    }

    .plugin-number {
      position: absolute;
      top: 10px;
      right: 20px;
      font-size: 50px;
      color: #f3f3f3;
      font-weight: bold;
    }

    .plugin-box>p{
        font-size: 16px;
    }

    .process-card {
      border: 1px solid #c6f4d3;
      border-radius: 10px;
      padding: 20px;
      position: relative;
      transition: box-shadow 0.3s;
    }

    .process-card:hover {
      box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
    }

    .process-icon {
      position: absolute;
      top: -20px;
      left: 50%;
      transform: translateX(-50%);
      background-color: #ffffff;
      border: 1px solid #c6f4d3;
      border-radius: 50%;
      width: 40px;
      height: 40px;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .process-icon img {
      width: 20px;
      height: 20px;
    }

    .process-card h5 {
      font-weight: 700;
      color: #0b002b;
    }

    .process-card p {
      color: #666;
      margin-top: 10px;
      font-size: 0.95rem;
    }
  </style>






@endsection






@section('content')






	<!-- Page Header End -->
<div class="main-wrapper">



<div
    style="background: linear-gradient(to bottom, rgba(0,0,0,0.5), rgba(0,0,0,0.5)),
           url('{{ asset('frontend/img/bac.jpg') }}') no-repeat center center;
           background-size: cover;
           padding: 115px;"
    class="page-header">

		<div class="container">
			<div class="row align-items-center justify-content-center">
				<div class="col-lg-12">
					<!-- Page Header Box Start -->

						<h1 class="wow fadeInUp" style="visibility: visible; animation-name: fadeInUp;text-align: center;color: white;">    Web Application Development


</h1>

	<h5 class="wow fadeInUp mobilehide" style="color: white;text-align: center;">


At SconexSoft, from streamlining operations to enabling real-time data-driven decisions, our developed web applications are designed to empower your organization with high performance, security, and integration capabilities.


    </h5>

					<!-- Page Header Box End -->
				</div>
			</div>
		</div>
	</div>
























<div class="container py-5">
  <div class="section-title">
    <h2>    Benefits of Our Web Application Development</h2>
    <p>

At SconexSoft, we deliver end-to-end web application solutions for your business that transform operations, improve decision-making, and drive growth. From concept to deployment, our expert team delivers custom, scalable, and secure web applications tailored to your business goals.


</p>
  </div>

  <div class="row">
    <!-- Card 1 -->

    @php
$services = [
    [
        'icon' => '🛠️',
        'title' => 'Custom Web Application Development',
        'description' => 'We specialize in building fully customized web applications that are aligned with your business processes and growth strategy. Whether you need a customer portal, internal tool, or product platform—we design intuitive interfaces and engineer robust back-end systems.',
        'highlight' => 'Highlights: Unique UX/UI tailored to your audience, built using modern frameworks and secure architecture, optimized for performance, SEO, and scalability.',
        'number' => '01',
    ],
    [
        'icon' => '🏢',
        'title' => 'Enterprise Web Applications',
        'description' => 'Designed for high performance, multi-user access, and complex workflows, our enterprise-grade web applications help organizations digitize operations, streamline collaboration, and make data-driven decisions.',
        'highlight' => 'Examples: Business process automation tools, HR, finance, or inventory management systems, Role-based access control and data privacy features.',
        'number' => '02',
    ],
    [
        'icon' => '⚡',
        'title' => 'Progressive Web Applications (PWAs)',
        'description' => 'PWAs combine the best of web and mobile. We build high-performance, offline-capable applications that offer fast loading, push notifications, and a native-app-like experience across all devices.',
        'highlight' => 'Benefits: Reduced load times, Works seamlessly on any browser or OS, Lower cost compared to native mobile apps.',
        'number' => '03',
    ],
    [
        'icon' => '🔁',
        'title' => 'Single Page Applications (SPAs)',
        'description' => 'We create dynamic and responsive SPAs using React, Angular, or Vue.js to deliver lightning-fast user interactions and seamless navigation without constant page reloads.',
        'highlight' => 'Use Cases: Interactive dashboards, Real-time chat applications, Admin panels and portals.',
        'number' => '04',
    ],
    [
        'icon' => '☁️',
        'title' => 'SaaS Web Application Development',
        'description' => 'We help startups and enterprises launch cloud-based, multi-tenant SaaS products with subscription management, role-based access, usage tracking, and integrations with third-party services.',
        'highlight' => 'Capabilities: Scalable architecture for growth, Built-in analytics and reporting, Secure user management & billing modules.',
        'number' => '05',
    ],
    [
        'icon' => '🌐',
        'title' => 'Web Portal Development',
        'description' => 'Develop secure and scalable web portals for customers, employees, vendors, or partners. These portals provide easy access to information, transactions, or support in a user-friendly environment.',
        'highlight' => 'Types of Portals: Client/self-service portals, Vendor/supplier portals, Learning management portals.',
        'number' => '06',
    ],
];
@endphp


    <!-- Card 2 -->




    @foreach ($services as $service)
        <div class="col-md-4 mb-4">
            <div class="plugin-box h-100 p-4 shadow-sm">
                <span class="plugin-icon" style="font-size: 30px;">{{ $service['icon'] }}</span>
                <h5 class="mt-3">{{ $service['title'] }}</h5>
                <p>{{ $service['description'] }}</p>

                <p class="text-white mt-3" style="background: #454444; padding: 22px;">
                    <b>{{ Str::before($service['highlight'], ':') }}:</b>
                    {{ Str::after($service['highlight'], ':') }}
                </p>

                <span class="plugin-number">{{ $service['number'] }}</span>
            </div>
        </div>
    @endforeach
</div>






    </div>




<section style="background-color: #03003d; padding:40px 0;">
  <div class="container">
    <div class="row align-items-center text-white">
      <!-- Left Column -->
      <div class="col-md-6 mb-4 mb-md-0">
        <h2 class="fw-bold text-white">Why Choose Us</h2>
        <p class="mt-3">
Our software development engineers are highly skilled, trained and educated. With deep domain knowledge and advanced technical expertise, we design and build future-ready applications tailored to your unique business needs.
        </p>
        <a href="{{ url('contactus') }}" class="btn btn-outline-light mt-3">Hire Us</a>
      </div>

      <!-- Right Column -->
      <div class="col-md-6" >
        <div class="" style="background-color: #FB4646;padding: 16% 11% !important;border-radius: 3%;">
          <h4 class="fw-bold text-" style="font-size: 1.9em;color: white;">
Why SconexSoft is the best suited for you with our Web Application Development?       </h4>
          <p class="mt-3 text-" style="font-size: 19px;">
Our mission is to deploy our applications for your business with modern technology that fits your business needs.
          </p>
          <a href="{{ url('contactus') }}" class="btn btn-dark mt-3">Set A Meeting</a>
        </div>
      </div>
    </div>
  </div>
</section>

</div>










<section class="py-5" style="background-color: #f5f7f9;">
  <div class="container" style="padding: 2% 4%;">
    <div class="row align-items-start g-4">
      <!-- Left: Text Section -->
      <div class="col-lg-5">
        <h6 class="text-danger mb-2">  Web Application Development  </h6>
        <h3 class="fw-bold text-dark mb-3" style='font-size:22px;'>Web Application Development Services</h3>
        <p class="text-muted">

Our vision is to be a leading Web Application development company that empowers businesses worldwide with innovative solutions, cutting-edge technologies, and exceptional customer experiences.
        </p>
      </div>

      <!-- Right: Cards Grid -->
      <div class="col-lg-7">
        <div class="row g-3">
          <!-- Card 1 -->
              <!-- Card 3 -->
        <div class="col-md-6">
  <div class="position-relative bg-white p-4 rounded-3 shadow-sm h-100">
    <!-- Floating Icon -->
    <div class="position-absolute top-0 start-0 translate-middle-y ms-3" style="margin-left: -22px;">
      <div class="bg-white shadow rounded-3 p-2" style="width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;">
        <img src="https://img.icons8.com/fluency-systems-regular/24/0e1133/module.png" alt="Icon">
      </div>
    </div>

    <!-- Card Content -->
    <div class="mt-4 pt-2">
      <h6 class="fw-bold text-dark">Research </h6>
      <p class="td mb-0">
Clearly outline the requirements and functionalities you need for your business.      </p>
    </div>














  </div>
</div>

          <!-- Card 2 -->

      <!-- Card 3 -->
        <div class="col-md-6">
  <div class="position-relative bg-white p-4 rounded-3 shadow-sm h-100">
    <!-- Floating Icon -->
    <div class="position-absolute top-0 start-0 translate-middle-y ms-3" style="margin-left: -22px;">
      <div class="bg-white shadow rounded-3 p-2" style="width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;">
        <img src="https://img.icons8.com/fluency-systems-regular/24/0e1133/module.png" alt="Icon">
      </div>
    </div>

    <!-- Card Content -->
    <div class="mt-4 pt-2">
      <h6 class="fw-bold text-dark">Budget Considerations </h6>
      <p class="td mb-0">We Keep in mind that the lowest cost may not always translate to the best quality.     </p>
    </div>
  </div>
</div>




        </div>

      </div>







      <!-- Card 3 -->
        <div class="col-md-3">
  <div class="position-relative bg-white p-4 rounded-3 shadow-sm h-100">
    <!-- Floating Icon -->
    <div class="position-absolute top-0 start-0 translate-middle-y ms-3" style="margin-left: -22px;">
      <div class="bg-white shadow rounded-3 p-2" style="width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;">
        <img src="https://img.icons8.com/fluency-systems-regular/24/0e1133/module.png" alt="Icon">
      </div>
    </div>

    <!-- Card Content -->
    <div class="mt-4 pt-2">
      <h6 class="fw-bold text-dark">Project Management</h6>
      <p class="td mb-0"  style="font-size: 14px;margin-top: 6px;" >
We well-defined timeline and effective project management contribute to timely delivery.
      </p>
    </div>
  </div>
</div>






      <!-- Card 3 -->
        <div class="col-md-3">
  <div class="position-relative bg-white p-4 rounded-3 shadow-sm h-100">
    <!-- Floating Icon -->
    <div class="position-absolute top-0 start-0 translate-middle-y ms-3" style="margin-left: -22px;">
      <div class="bg-white shadow rounded-3 p-2" style="width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;">
        <img src="https://img.icons8.com/fluency-systems-regular/24/0e1133/module.png" alt="Icon">
      </div>
    </div>

    <!-- Card Content -->
    <div class="mt-4 pt-2">
      <h6 class="fw-bold text-dark">Maintenance </h6>
    <p class="td mb-0"  style="font-size: 14px;margin-top: 6px;" >
Support for Ongoing maintenance, performance monitoring that may arise after the application is deployed.

</p>
    </div>
  </div>
</div>



      <!-- Card 3 -->
        <div class="col-md-3">
  <div class="position-relative bg-white p-4 rounded-3 shadow-sm h-100">
    <!-- Floating Icon -->
    <div class="position-absolute top-0 start-0 translate-middle-y ms-3" style="margin-left: -22px;">
      <div class="bg-white shadow rounded-3 p-2" style="width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;">
        <img src="https://img.icons8.com/fluency-systems-regular/24/0e1133/module.png" alt="Icon">
      </div>
    </div>

    <!-- Card Content -->
    <div class="mt-4 pt-2">
      <h6 class="fw-bold text-dark">Security Features </h6>
    <p class="td mb-0"  style="font-size: 14px;margin-top: 6px;" >
We offer support for Data encryption, access control, and compliance readiness for application.      </p>
    </div>
  </div>
</div>













      <!-- Card 3 -->
        <div class="col-md-3">
  <div class="position-relative bg-white p-4 rounded-3 shadow-sm h-100">
    <!-- Floating Icon -->
    <div class="position-absolute top-0 start-0 translate-middle-y ms-3" style="margin-left: -22px;">
      <div class="bg-white shadow rounded-3 p-2" style="width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;">
        <img src="https://img.icons8.com/fluency-systems-regular/24/0e1133/module.png" alt="Icon">
      </div>
    </div>

    <!-- Card Content -->
    <div class="mt-4 pt-2">
      <h6 class="fw-bold text-dark">Documentation </h6>
    <p class="td mb-0"  style="font-size: 14px;margin-top: 6px;" >
We provide full documentation of the application and the service details at the time of discussion.
      </p>
    </div>
  </div>
</div>







    </div>
  </div>
</section>

<!-- Optional Hover Effect CSS -->
<style>
  .hover-lift {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
  }
  .hover-lift:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
  }
</style>








<section class="expert_plugin pb-100 pt-100" style="padding: 4% 22px;">
        <div class="container-fluid desktop_padding">
            <div class="row g-5 align-items-center">
                <div class="col-md-6">
                    <div class="expert_plugin_thumbs">
                      <img src="{{ asset('frontend/img/webdevelopement.png') }}" alt="image">

                    </div>
                </div>
                <div class="col-md-6">
                    <div class="section-header">
                        <p class="plugin_benifits_subheading wow fadeInUp inline-animation" style="color: #FB4646;font-weight: bold;">Web Application Development </p>
                        <h2 class="text wow fadeInUp inline-animation">Expert Web Application Solution</h2>

                        <p class="wow fadeInUp inline-animation" data-wow-duration="0.5s" data-wow-delay="0.5s" style="visibility: visible; animation-duration: 0.5s; animation-delay: 0.5s; animation-name: fadeInUp;margin-top:11px;">



SconexSoft Offering Affordable Web Application Development Solution. SconexSoft is a software company which has an experienced and qualified team of specialists that help organizations streamline operations, enhance productivity, and accelerate digital transformation. If you are comfortable with the idea of outsourcing your project to a company overseas, then you might consider our company to serve you. From all the custom ERP and CRM systems to mobile-enabled enterprise apps and cloud-native platforms—we secure your business and runs smarter, faster, and more efficiently.
<br>
<br>
Whether you're looking to modernize legacy applications, develop a custom enterprise platform, or adopt cloud and automation technologies—SconexSoft is your trusted partner for digital enterprise evolution.</p>

<b>

📞 Talk to our enterprise experts today
</b>to build the solution your business truly deserves.

                    </div>
                </div>
            </div>
        </div>
    </section>















  <style>
    .team-section {
      background-color: #f8fafc;
    }
    .team-heading {
      font-weight: 800;
      color: #0b0c39;
    }
    .team-subtitle {
      color: #32c36c;
      font-weight: 600;
    }
    .team-paragraph {
      color: #555;
      font-size: 16px;
    }
    .team-box {
      border: 1px solid #e0e0e0;
      border-radius: 8px;
      padding: 20px;
      background-color: #fff;
      box-shadow: 0 4px 8px rgba(0,0,0,0.03);
      height: 100%;
      transition: all 0.3s;
    }
    .team-box h6 {
      font-weight: 700;
      color: #0b0c39;
      margin-bottom: 8px;
    }
    .team-image-grid img {
      width: 100%;
      border-radius: 6px;
      object-fit: cover;
    }
  </style>


<div class="our-" style="background: black;">
        <div class="container" style="padding-top:7% !important;">
            <div class="row mt-10 mobiel0" style="margin-top: -100px;">

<div class="d-flex justify-content-center">
  <h1 class="text-center" style="background-color: #E62642; width: 330px; color: white;">
    Our Partners
  </h1>
</div>


<div class="col-lg-12">
                    <!-- Our Company Slider Start -->
                    <div class="our-company-slider" style="padding-bottom: 0px !important; ">

<br>
<br>
                        <div class="swiper swiper-initialized swiper-horizontal swiper-backface-hidden">
                            <div class="swiper-wrapper" id="swiper-wrapper-46c546e2d39663ab" aria-live="off" style="transition-duration: 2000ms; transform: translate3d(-524px, 0px, 0px);">
                               <!-- Company Support Logo Start -->
<div class="swiper-slide" role="group" aria-label="1 / 8" data-swiper-slide-index="0" style="width: 222px; margin-right: 40px;">
    <div class="">
                        <img src="{{ asset('frontend/img/logo1.png') }}" >

    </div>
</div>
<div class="swiper-slide swiper-slide-prev" role="group" aria-label="2 / 8" data-swiper-slide-index="1" style="width: 222px; margin-right: 40px;">
    <div class="">
                        <img src="{{ asset('frontend/img/logo2.png') }}" >
    </div>
</div>
<div class="swiper-slide swiper-slide-active" role="group" aria-label="3 / 8" data-swiper-slide-index="2" style="width: 222px; margin-right: 40px;">
    <div class="">
                        <img src="{{ asset('frontend/img/logo3.png') }}" >
    </div>
</div>
<div class="swiper-slide swiper-slide-next" role="group" aria-label="4 / 8" data-swiper-slide-index="3" style="width: 222px; margin-right: 40px;">
    <div class="">
                        <img src="{{ asset('frontend/img/logo4.png') }}" >
    </div>
</div>
<div class="swiper-slide" role="group" aria-label="5 / 8" data-swiper-slide-index="4" style="width: 222px; margin-right: 40px;">
    <div class="">
                        <img src="{{ asset('frontend/img/logo5.png') }}" >
    </div>
</div>
<div class="swiper-slide" role="group" aria-label="6 / 8" data-swiper-slide-index="5" style="width: 222px; margin-right: 40px;">
    <div class="">
                        <img src="{{ asset('frontend/img/logo6.png') }}" >
    </div>
</div>
<div class="swiper-slide" role="group" aria-label="7 / 8" data-swiper-slide-index="6" style="width: 222px; margin-right: 40px;">
    <div class="">
                        <img src="{{ asset('frontend/img/logo7.png') }}" >
    </div>
</div>
<div class="swiper-slide" role="group" aria-label="8 / 8" data-swiper-slide-index="7" style="width: 222px; margin-right: 40px;">
    <div class="">
                        <img src="{{ asset('frontend/img/logo8.png') }}" >
    </div>
</div>
<!-- Company Support Logo End -->

                                <!-- Company Support Logo End -->
                            </div></div>
                    </div>
                    <!-- Our Company Slider End -->
                </div>
            </div>


        </div>
    </div>




<section class="py-5 bg-">
  <div class="container-fluid desktop_padding">
    <div class="text-center mb-5">
      <h2 class="fw-bold text-dark">Our Services</h2>
      <p class="text-muted mx-auto" style="max-width: 700px;">
        We understand the importance of a strong online presence. Our team of skilled web developers and designers create visually stunning and highly functional websites tailored to your unique business needs.
      </p>
    </div>

    <div class="row g-4">
      <!-- Service Card -->
      <div class="col-md-4">
        <div class="card h-100 border-0 shadow-sm text-center" style="border-radius: 11px;">
          <div class="card-body">
            <div class="mb-3">
              <img src="https://img.icons8.com/fluency-systems-regular/48/E51937/monitor.png" alt="Website Dev"/>
            </div>
            <h5 class="fw-bold text-dark">Website Development</h5>
            <p class="text-muted small">Content management systems for easy website maintenance and updates.</p>
            <hr>
            <a href="{{ url('contactus') }}" class="text-decoration-none small text-dark">
              View Details <i class="fa fa-caret-right"></i>
            </a>
          </div>
        </div>
      </div>

      <!-- Repeat for other services -->
      <div class="col-md-4">
        <div class="card h-100 border-0 shadow-sm text-center">
          <div class="card-body">
            <div class="mb-3">

              <img src="https://img.icons8.com/fluency-systems-regular/48/E51937/server.png" alt="IT Consultancy"/>
            </div>
            <h5 class=" text-dark">User Interface Design</h5>
            <p class="text-muted small">Engaging and visually appealing designs that captivate and retain visitors.</p>
            <hr>
             <a href="{{ url('contactus') }}" class="text-decoration-none small text-dark">
              View Details <i class="fa fa-caret-right"></i>
            </a>
          </div>
        </div>
      </div>

      <div class="col-md-4">
        <div class="card h-100 border-0 shadow-sm text-center">
          <div class="card-body">
            <div class="mb-3">
              <img src="https://img.icons8.com/fluency-systems-regular/48/E51937/smartphone-tablet.png" alt="Apps Dev"/>
            </div>
            <h5 class=" text-dark">Apps Development</h5>
            <p class="text-muted small">Incorporating the latest technologies for enhanced functionality and performance.</p>
            <hr>
            <a href="{{ url('contactus') }}" class="text-decoration-none small text-dark">
              View Details <i class="fa fa-caret-right"></i>
            </a>
          </div>
        </div>
      </div>

      <!-- Bottom Row -->
      <div class="col-md-4">
        <div class="card h-100 border-0 shadow-sm text-center">
          <div class="card-body">
            <div class="mb-3">
              <img src="https://img.icons8.com/fluency-systems-regular/48/E51937/code.png" alt="Plugin"/>
            </div>
            <h5 class="fw-bold text-dark">Plugin Development</h5>
            <p class="text-muted small">Developing reliable and secure plugins for optimal website functionality.</p>
            <hr>
             <a href="{{ url('contactus') }}" class="text-decoration-none small text-dark">
              View Details <i class="fa fa-caret-right"></i>
            </a>
          </div>
        </div>
      </div>

      <div class="col-md-4">
        <div class="card h-100 border-0 shadow-sm text-center">
          <div class="card-body">
            <div class="mb-3">
              <img src="https://img.icons8.com/fluency-systems-regular/48/E51937/server.png" alt="IT Consultancy"/>
            </div>
            <h5 class="fw-bold text-dark">IT Consultancy</h5>
            <p class="text-muted small">Optimizing IT budgets through cost-effective solutions and resource allocation.</p>
            <hr>
           <a href="{{ url('contactus') }}" class="text-decoration-none small text-dark">
              View Details <i class="fa fa-caret-right"></i>
            </a>
          </div>
        </div>
      </div>

      <div class="col-md-4">
        <div class="card h-100 border-0 shadow-sm text-center">
          <div class="card-body">
            <div class="mb-3">
              <img src="https://img.icons8.com/fluency-systems-regular/48/E51937/security-checked.png" alt="Cyber Security"/>
            </div>
            <h5 class="fw-bold text-dark">Cyber Security</h5>
            <p class="text-muted small">We are ready to protect your data. Providing advanced security for advanced threats.</p>
            <hr>
            <a href="{{ url('contactus') }}" class="text-decoration-none small text-dark">
              View Details <i class="fa fa-caret-right"></i>
            </a>
          </div>
        </div>
      </div>

    </div>
  </div>
</section>






@include('components.servicecommon')






@endsection