/* ── About Page Scoped Styles ── */
        .ab-body {
            font-family: 'Segoe UI', Arial, sans-serif;
        }
 
        .ab-body * {
            box-sizing: border-box;
        }
 
        .ab-container {
            width: 100%;
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 20px;
        }
 
        .ab-row {
            display: flex;
            flex-wrap: wrap;
            margin: 0 -10px;
        }
 
        .ab-col-6 {
            width: 50%;
            padding: 0 10px;
        }
 
        .ab-col-12 {
            width: 100%;
        }
 
        /* ── Hero Banner ── */
        .ab-backimage {
            background-image: url('../img/Aboutpage.jpg');
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            width: 100%;
            height: 350px;
            display: flex;
            align-items: center;
        }
 
        .ab-h1-wrap h1 {
            font-size: 50px;
            background-color: rgba(255, 0, 0, 0.61);
            padding: 16px 45px 17px 58px;
            color: white;
            border-radius: 47px;
            display: inline-block;
            margin-left: 50px;
        }
 
        /* ── Images Section ── */
        .ab-aboutimage {
            height: 390px;
            margin-top: 50px;
            overflow: hidden;
        }
 
        .ab-aboutimage img {
            width: 100%;
            height: 390px;
            object-fit: cover;
            display: block;
        }
 
        /* ── Features Section ── */
        .ab-features h1 {
            color: #cc1f00;
            font-size: 26px;
            font-weight: 700;
            margin-bottom: 16px;
            line-height: 1.3;
            margin-top: 50px;
        }
 
        .ab-features ul {
            list-style: none;
            padding: 0;
            margin: 0;
        }
 
        .ab-features ul li {
            display: flex;
            align-items: flex-start;
            gap: 9px;
            font-size: 15.5px;
            color: #1a1a1a;
            font-weight: 500;
            margin-bottom: 8px;
            line-height: 1.65;
        }
 
        .ab-features ul li .ab-icon {
            flex-shrink: 0;
            margin-top: 2px;
        }
 
        .ab-features ul li .ab-icon svg {
            width: 22px;
            height: 22px;
            display: block;
        }
 
        /* ════════════════════════════════
           RESPONSIVE BREAKPOINTS
        ════════════════════════════════ */
 
        @media (max-width: 768px) {
            .ab-backimage { height: 280px; }
 
            .ab-h1-wrap h1 {
                font-size: 36px;
                padding: 12px 30px 13px 35px;
                border-radius: 35px;
                margin-left: 20px;
            }
 
            .ab-col-6 { width: 100%; }
 
            .ab-aboutimage { height: 280px; margin-top: 20px; }
            .ab-aboutimage img { height: 280px; }
 
            .ab-features h1 { font-size: 22px; margin-top: 35px; }
            .ab-features ul li { font-size: 14.5px; }
        }
 
        @media (max-width: 480px) {
            .ab-backimage { height: 220px; }
 
            .ab-h1-wrap h1 {
                font-size: 26px;
                padding: 10px 20px;
                border-radius: 25px;
                margin-left: 15px;
                max-width: calc(100% - 30px);
            }
 
            .ab-aboutimage { height: 220px; margin-top: 15px; }
            .ab-aboutimage img { height: 220px; }
 
            .ab-features h1 { font-size: 20px; margin-top: 28px; }
            .ab-features ul li { font-size: 14px; gap: 7px; }
            .ab-features ul li .ab-icon svg { width: 18px; height: 18px; }
        }
 
        @media (max-width: 360px) {
            .ab-backimage { height: 180px; }
 
            .ab-h1-wrap h1 {
                font-size: 22px;
                padding: 8px 16px;
                border-radius: 20px;
                margin-left: 10px;
            }
 
            .ab-aboutimage { height: 180px; }
            .ab-aboutimage img { height: 180px; }
 
            .ab-features h1 { font-size: 18px; }
            .ab-features ul li { font-size: 13px; }
        }