@extends('public.layout.app')
@section('title','Process | PACHA PAINTS')

@section('body')
<section class="hero">
    <div class="container">
        <div class="pill mb-3"><i class="fa-solid fa-diagram-project brand-dot"></i> Process</div>
        <h2 class="fw-bold mb-2">PACHA Painting Process</h2>
        <p class="muted mb-4">A clean, professional flow for best finish and long durability.</p>

        <div class="row g-3">
            @foreach([
                ['n'=>'01','t'=>'Site Check & Surface Inspection','d'=>'Wall condition, cracks, moisture and dust check.'],
                ['n'=>'02','t'=>'Cleaning & Repair','d'=>'Remove dust, fill cracks, sanding for smooth base.'],
                ['n'=>'03','t'=>'Primer / Sealer Coat','d'=>'Strong bonding and equal absorption.'],
                ['n'=>'04','t'=>'Putty & Sanding','d'=>'Ultra smooth finish before paint.'],
                ['n'=>'05','t'=>'First Paint Coat','d'=>'Even application with correct dilution.'],
                ['n'=>'06','t'=>'Second Coat + Finishing','d'=>'Uniform color, smooth texture, final look.'],
                ['n'=>'07','t'=>'Quality Check','d'=>'Spot fix, edges, corners, perfect final.'],
            ] as $st)
            <div class="col-md-6 col-lg-4">
                <div class="cardx p-3 h-100">
                    <div class="d-flex justify-content-between align-items-start">
                        <div class="pill"><i class="fa-solid fa-check brand-dot"></i> Step {{ $st['n'] }}</div>
                        <span class="badge badge-soft">Standard</span>
                    </div>
                    <div class="fw-bold mt-2">{{ $st['t'] }}</div>
                    <div class="muted mt-2">{{ $st['d'] }}</div>
                </div>
            </div>
            @endforeach
        </div>

        <div class="cardx p-4 mt-4">
            <div class="row g-3 align-items-center">
                <div class="col-lg-8">
                    <div class="fw-bold h5 mb-1">Want a perfect finish?</div>
                    <div class="muted">Contact us and we’ll guide your painter or provide recommendations.</div>
                </div>
                <div class="col-lg-4 text-lg-end">
                    <a class="btn btn-brand" href="{{ route('front.contact') }}">
                        <i class="fa-solid fa-phone me-1"></i> Contact Now
                    </a>
                </div>
            </div>
        </div>

    </div>
</section>
@endsection