EnakShop: katalog toko online

- Beranda toko: pencarian, banner promo, grid kategori, produk promo,
  dan rekomendasi
- Halaman kategori dengan urutan terlaris/terbaru/termurah/termahal
- Detail produk: harga diskon, varian, info, deskripsi, produk serupa
- Data contoh 14 produk dan 3 banner; keranjang menyusul
- DetailSection dan NumberedStep jadi komponen bersama
- Tinggi banner EnakPromo dan EnakShop ikut skala font sistem

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

lib/presentation/pages/promo/pages/promo_detail/promo_detail_page.dart

@@ -4,6 +4,7 @@ import 'package:flutter/material.dart';
 import '../../../../../common/theme/theme.dart';
 import '../../../../../sample/promo_sample_data.dart';
 import '../../../../components/button/button.dart';
+import '../../../../components/card/detail_section.dart';
 import '../../../../router/app_router.gr.dart';
 import '../../promo_ui.dart';
 
@@ -29,7 +30,7 @@ class PromoDetailPage extends StatelessWidget {
             _buildUpcomingNote(),
           ],
           const SizedBox(height: 12),
-          _Section(
+          DetailSection(
             child: Column(
               children: [
                 _InfoRow(
@@ -54,7 +55,7 @@ class PromoDetailPage extends StatelessWidget {
             ),
           ),
           const SizedBox(height: 12),
-          _Section(
+          DetailSection(
             title: 'Tentang promo',
             child: Text(
               promo.description,
@@ -65,18 +66,18 @@ class PromoDetailPage extends StatelessWidget {
             ),
           ),
           const SizedBox(height: 12),
-          _Section(
+          DetailSection(
             title: 'Cara dapat',
             child: Column(
               children: [
                 for (var i = 0; i < promo.steps.length; i++)
-                  _StepRow(number: i + 1, text: promo.steps[i]),
+                  NumberedStep(number: i + 1, text: promo.steps[i]),
               ],
             ),
           ),
           if (promo.terms.isNotEmpty) ...[
             const SizedBox(height: 12),
-            _Section(
+            DetailSection(
               title: 'Syarat & Ketentuan',
               child: Column(
                 children: [
@@ -201,38 +202,6 @@ class PromoDetailPage extends StatelessWidget {
   }
 }
 
-class _Section extends StatelessWidget {
-  const _Section({this.title, required this.child});
-
-  final String? title;
-  final Widget child;
-
-  @override
-  Widget build(BuildContext context) {
-    return Container(
-      width: double.infinity,
-      padding: const EdgeInsets.all(16),
-      decoration: BoxDecoration(
-        color: AppColor.white,
-        borderRadius: BorderRadius.circular(16),
-      ),
-      child: Column(
-        crossAxisAlignment: CrossAxisAlignment.start,
-        children: [
-          if (title != null) ...[
-            Text(
-              title!,
-              style: AppStyle.md.copyWith(fontWeight: FontWeight.w700),
-            ),
-            const SizedBox(height: 12),
-          ],
-          child,
-        ],
-      ),
-    );
-  }
-}
-
 class _InfoRow extends StatelessWidget {
   const _InfoRow({
     required this.icon,
@@ -282,43 +251,6 @@ class _InfoRow extends StatelessWidget {
   }
 }
 
-class _StepRow extends StatelessWidget {
-  const _StepRow({required this.number, required this.text});
-
-  final int number;
-  final String text;
-
-  @override
-  Widget build(BuildContext context) {
-    return Padding(
-      padding: const EdgeInsets.only(bottom: 10),
-      child: Row(
-        crossAxisAlignment: CrossAxisAlignment.start,
-        children: [
-          Container(
-            width: 22,
-            height: 22,
-            alignment: Alignment.center,
-            decoration: BoxDecoration(
-              color: AppColor.primary.withOpacity(0.1),
-              shape: BoxShape.circle,
-            ),
-            child: Text(
-              '$number',
-              style: AppStyle.xs.copyWith(
-                color: AppColor.primary,
-                fontWeight: FontWeight.w800,
-              ),
-            ),
-          ),
-          const SizedBox(width: 10),
-          Expanded(child: Text(text, style: AppStyle.md.copyWith(height: 1.4))),
-        ],
-      ),
-    );
-  }
-}
-
 class _BulletRow extends StatelessWidget {
   const _BulletRow({required this.text});
 

lib/presentation/pages/promo/promo_page.dart

@@ -104,7 +104,8 @@ class _PromoPageState extends State<PromoPage> {
       children: [
         const SizedBox(height: 16),
         SizedBox(
-          height: 168,
+          // Ikut skala font sistem supaya teks banner tidak terpotong.
+          height: MediaQuery.textScalerOf(context).scale(168),
           child: PageView.builder(
             controller: _bannerController,
             itemCount: featured.length,