@extends('layouts.app')
@section('title', 'Equipment Brands — Paytell Company Limited')

@section('content')
<section style="background:var(--blue-900);padding:56px 0 48px;border-bottom:1px solid rgba(255,255,255,0.12);"><div class="wrap"><p style="font-size:12.5px;color:rgba(255,255,255,0.55);margin-bottom:14px;">Home › Brands</p><h1 style="font-family:'Barlow Semi Condensed';font-weight:700;font-size:38px;color:#fff;line-height:1.1;max-width:680px;margin-bottom:14px;">Our certified equipment brands.</h1><p style="font-size:15.5px;color:rgba(255,255,255,0.75);max-width:580px;">Paytell is an authorised distributor for six international manufacturers. Click a brand to view available models, specs and enquiry options.</p></div></section>
<section class="section">
  <div class="wrap">
    <div class="sec-head"><div class="eyebrow">Certified distributor</div><h2>Choose a brand to explore.</h2></div>
    <div style="display:grid;grid-template-columns:repeat(3,1fr);gap:16px;">
<a href="{{ route('brands.faw') }}" style="text-decoration:none;">
  <div class="dist-logo" style="cursor:pointer;flex-direction:column;height:100px;gap:6px;border-radius:4px;">
    <span style="font-family:'Barlow Semi Condensed';font-weight:700;font-size:22px;color:var(--blue-700);">FAW</span>
    <span style="font-size:12px;color:var(--steel);">View models →</span>
  </div>
</a>
<a href="{{ route('brands.liugong') }}" style="text-decoration:none;">
  <div class="dist-logo" style="cursor:pointer;flex-direction:column;height:100px;gap:6px;border-radius:4px;">
    <span style="font-family:'Barlow Semi Condensed';font-weight:700;font-size:22px;color:var(--blue-700);">LIUGONG</span>
    <span style="font-size:12px;color:var(--steel);">View models →</span>
  </div>
</a>
<a href="{{ route('brands.ensign') }}" style="text-decoration:none;">
  <div class="dist-logo" style="cursor:pointer;flex-direction:column;height:100px;gap:6px;border-radius:4px;">
    <span style="font-family:'Barlow Semi Condensed';font-weight:700;font-size:22px;color:var(--blue-700);">ENSIGN</span>
    <span style="font-size:12px;color:var(--steel);">View models →</span>
  </div>
</a>
<a href="{{ route('brands.yutong') }}" style="text-decoration:none;">
  <div class="dist-logo" style="cursor:pointer;flex-direction:column;height:100px;gap:6px;border-radius:4px;">
    <span style="font-family:'Barlow Semi Condensed';font-weight:700;font-size:22px;color:var(--blue-700);">YUTONG</span>
    <span style="font-size:12px;color:var(--steel);">View models →</span>
  </div>
</a>
<a href="{{ route('brands.yto') }}" style="text-decoration:none;">
  <div class="dist-logo" style="cursor:pointer;flex-direction:column;height:100px;gap:6px;border-radius:4px;">
    <span style="font-family:'Barlow Semi Condensed';font-weight:700;font-size:22px;color:var(--blue-700);">YTO</span>
    <span style="font-size:12px;color:var(--steel);">View models →</span>
  </div>
</a>
<a href="{{ route('brands.hxbg') }}" style="text-decoration:none;">
  <div class="dist-logo" style="cursor:pointer;flex-direction:column;height:100px;gap:6px;border-radius:4px;">
    <span style="font-family:'Barlow Semi Condensed';font-weight:700;font-size:22px;color:var(--blue-700);">HXBG</span>
    <span style="font-size:12px;color:var(--steel);">View models →</span>
  </div>
</a></div>
  </div>
</section><section class="cta-band"><div class="wrap"><h2>Don't see the model you need?</h2><p>Contact our machinery team — we may be able to source it for you.</p><div class="btn-row" style="justify-content:center;display:flex;gap:14px;"><a href="{{ route('contact') }}" class="cta-btn" style="background:#fff;color:var(--crimson-600);">Talk to us</a></div></div></section>

@endsection