:root {
            --orange: #ff8a00;
            --orange-soft: #fff1dd;
            --blue: #0a4d8f;
            --blue-dark: #062f59;
            --green: #74c69d;
            --green-soft: #e9f8ef;
            --offwhite: #fffaf0;
            --red: #d92d20;
            --red-soft: #fdecec;
            --ink: #102033;
            --muted: #667085;
            --line: #e7edf2;
        }

        * { box-sizing: border-box; }

        body {
            margin: 0;
            font-family: 'Inter', Arial, sans-serif;
            background: var(--offwhite);
            color: var(--ink);
        }

        a { text-decoration: none; }

        /* ---------- Top strip ---------- */
        .top-strip {
            background: var(--blue-dark);
            color: #fff;
            font-size: 0.9rem;
            padding: 8px 0;
        }

        .top-strip a { color: #fff; }

        .live-chip {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            padding: 2px 10px;
            border-radius: 999px;
            background: var(--red);
            font-weight: 800;
            font-size: 0.72rem;
            letter-spacing: 0.04em;
        }

        .live-dot {
            width: 7px;
            height: 7px;
            border-radius: 50%;
            background: #fff;
            animation: pulse 1.4s infinite;
        }

        @keyframes pulse {
            0% { opacity: 1; }
            50% { opacity: 0.35; }
            100% { opacity: 1; }
        }

        .strip-phone { color: var(--orange) !important; font-weight: 800; }

        /* ---------- Navbar ---------- */
        .navbar {
            background: rgba(255, 250, 240, 0.96);
            border-bottom: 1px solid rgba(10, 77, 143, 0.12);
            backdrop-filter: blur(12px);
        }

        .navbar-brand {
            display: flex;
            align-items: center;
            gap: 10px;
            color: var(--blue-dark) !important;
            font-size: 1.45rem;
            font-weight: 800;
        }

        .brand-logo { height: 46px; width: auto; }

        .brand-mark {
            min-width: 42px;
            height: 42px;
            border-radius: 12px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: #fff;
            background: linear-gradient(135deg, var(--orange), var(--blue));
            box-shadow: 0 10px 24px rgba(10, 77, 143, 0.22);
        }

        .navbar .nav-link {
            color: var(--ink) !important;
            font-weight: 700;
            padding: 10px 14px !important;
            border-radius: 999px;
        }

        .navbar .nav-link:hover { background: var(--green-soft); color: var(--blue) !important; }

        .navbar .nav-link.active { background: var(--blue); color: #fff !important; }

        .btn-brand {
            border: 0;
            border-radius: 999px;
            padding: 12px 22px;
            color: #fff !important;
            background: linear-gradient(135deg, var(--orange), var(--blue));
            font-weight: 800;
            box-shadow: 0 14px 30px rgba(10, 77, 143, 0.24);
            transition: transform 0.15s ease, box-shadow 0.15s ease;
        }

        .btn-brand:hover { transform: translateY(-2px); box-shadow: 0 18px 36px rgba(217, 45, 32, 0.22); }

        .btn-soft {
            border-radius: 999px;
            padding: 11px 20px;
            color: var(--blue) !important;
            background: #fff;
            border: 1px solid rgba(10, 77, 143, 0.14);
            font-weight: 800;
            transition: all 0.15s ease;
        }

        .btn-soft:hover { background: var(--green-soft); border-color: var(--green); }

        /* ---------- Sections ---------- */
        .section { padding: 76px 0; }

        .section-title { color: var(--blue-dark); font-weight: 800; }

        .section-kicker {
            color: var(--orange);
            font-weight: 800;
            text-transform: uppercase;
            font-size: 0.78rem;
            letter-spacing: 0.08rem;
        }

        .kicker-line { display: inline-flex; align-items: center; gap: 10px; }

        .kicker-line::after {
            content: "";
            width: 42px;
            height: 3px;
            border-radius: 3px;
            background: linear-gradient(90deg, var(--red), var(--orange));
        }

        .text-muted-custom { color: var(--muted); }

        .feature-card,
        .fleet-card,
        .form-panel,
        .route-card,
        .why-card,
        .step-card,
        .quote-card {
            background: rgba(255, 255, 255, 0.92);
            border: 1px solid var(--line);
            border-radius: 8px;
            box-shadow: 0 18px 42px rgba(6, 47, 89, 0.08);
        }

        .feature-card,
        .route-card { padding: 24px; }

        .feature-card { transition: transform 0.18s ease, box-shadow 0.18s ease; }

        .feature-card:hover { transform: translateY(-4px); box-shadow: 0 24px 48px rgba(6, 47, 89, 0.14); }

        .icon-box {
            width: 48px;
            height: 48px;
            border-radius: 8px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: var(--green-soft);
            color: var(--blue);
            font-size: 1.35rem;
            margin-bottom: 16px;
        }

        /* ---------- Why choose us ---------- */
        .why-card { padding: 26px; height: 100%; transition: transform 0.18s ease, box-shadow 0.18s ease; }

        .why-card:hover { transform: translateY(-4px); box-shadow: 0 24px 48px rgba(6, 47, 89, 0.14); }

        .why-card h5 { color: var(--blue-dark); font-weight: 800; }

        .why-icon {
            width: 54px;
            height: 54px;
            border-radius: 14px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 1.4rem;
            margin-bottom: 16px;
            color: var(--blue);
            background: var(--green-soft);
        }

        .why-icon.alt-orange { color: #fff; background: linear-gradient(135deg, var(--orange), #ffb25e); }
        .why-icon.alt-red { color: #fff; background: linear-gradient(135deg, var(--red), #f4746b); }
        .why-icon.alt-blue { color: #fff; background: linear-gradient(135deg, var(--blue), #3d84c6); }

        /* ---------- Process steps ---------- */
        .step-card {
            position: relative;
            padding: 30px 24px 24px;
            height: 100%;
            border-top: 4px solid var(--orange);
        }

        .step-num {
            position: absolute;
            top: -22px;
            left: 24px;
            width: 44px;
            height: 44px;
            border-radius: 50%;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: #fff;
            font-weight: 800;
            background: linear-gradient(135deg, var(--blue), var(--blue-dark));
            box-shadow: 0 10px 20px rgba(6, 47, 89, 0.28);
        }

        .step-card h5 { color: var(--blue-dark); font-weight: 800; }

        /* ---------- Stats band ---------- */
        .stats-band {
            padding: 54px 0;
            color: #fff;
            background:
                radial-gradient(circle at 88% 12%, rgba(255, 138, 0, 0.35), transparent 34%),
                radial-gradient(circle at 8% 90%, rgba(116, 198, 157, 0.28), transparent 40%),
                linear-gradient(135deg, var(--blue-dark), var(--blue));
        }

        .stat-num {
            font-size: clamp(2rem, 4vw, 3rem);
            font-weight: 800;
            color: var(--orange);
            line-height: 1;
        }

        .stat-label { font-weight: 700; color: rgba(255, 255, 255, 0.92); }

        /* ---------- About ---------- */
        .about-media {
            position: relative;
            border-radius: 8px;
            overflow: hidden;
            box-shadow: 0 26px 60px rgba(6, 47, 89, 0.2);
        }

        .about-media img { width: 100%; height: 100%; object-fit: cover; display: block; }

        .exp-badge {
            position: absolute;
            right: 18px;
            bottom: 18px;
            padding: 16px 20px;
            border-radius: 8px;
            color: #fff;
            background: linear-gradient(135deg, var(--red), #ef5b4f);
            box-shadow: 0 16px 34px rgba(217, 45, 32, 0.4);
            text-align: center;
        }

        .exp-badge strong { display: block; font-size: 1.9rem; line-height: 1; }

        .check-list { list-style: none; padding: 0; margin: 0; }

        .check-list li {
            padding-left: 32px;
            position: relative;
            margin-bottom: 10px;
            font-weight: 600;
            color: #29445f;
        }

        .check-list li::before {
            content: "\F26E";
            font-family: "bootstrap-icons";
            position: absolute;
            left: 0;
            top: 1px;
            color: var(--green);
            font-weight: 900;
        }

        /* ---------- Testimonials ---------- */
        .quote-card { padding: 30px; height: 100%; }

        .stars { color: var(--orange); letter-spacing: 2px; }

        .avatar-chip {
            width: 46px;
            height: 46px;
            border-radius: 50%;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: #fff;
            font-weight: 800;
            background: linear-gradient(135deg, var(--blue), var(--green));
        }

        .carousel-indicators [data-bs-target] {
            background-color: var(--blue);
            border-radius: 50%;
            width: 10px;
            height: 10px;
        }

        /* ---------- FAQ ---------- */
        .accordion-item { border: 1px solid var(--line); border-radius: 8px !important; overflow: hidden; margin-bottom: 12px; background: #fff; }

        .accordion-button { font-weight: 700; color: var(--blue-dark); padding: 18px 20px; }

        .accordion-button:not(.collapsed) { background: var(--green-soft); color: var(--blue); box-shadow: none; }

        .accordion-button:focus { box-shadow: 0 0 0 3px rgba(255, 138, 0, 0.25); }

        /* ---------- Forms ---------- */
        .form-control,
        .form-select {
            border-radius: 8px;
            border-color: #d8e1ea;
            padding: 12px 14px;
        }

        .form-control:focus,
        .form-select:focus { border-color: var(--orange); box-shadow: 0 0 0 3px rgba(255, 138, 0, 0.2); }

        .form-label { color: var(--blue-dark); font-weight: 700; font-size: 0.9rem; }

        /* ---------- Cab art (CSS cars) ---------- */
        .cab-art {
            height: 126px;
            border-radius: 8px;
            background:
                radial-gradient(circle at 20% 82%, #102033 0 10px, transparent 11px),
                radial-gradient(circle at 78% 82%, #102033 0 10px, transparent 11px),
                linear-gradient(160deg, rgba(255,138,0,0.22), rgba(10,77,143,0.14));
            position: relative;
            overflow: hidden;
        }

        .cab-art:before {
            content: "";
            position: absolute;
            left: 13%;
            right: 13%;
            bottom: 35px;
            height: 34px;
            border-radius: 24px 34px 10px 10px;
            background: #fff;
            border: 3px solid var(--blue);
        }

        .cab-art:after {
            content: "";
            position: absolute;
            left: 31%;
            top: 34px;
            width: 38%;
            height: 30px;
            border-radius: 24px 24px 4px 4px;
            background: var(--blue);
        }

        .cab-art.suv:before { left: 9%; right: 9%; height: 40px; }
        .cab-art.premium:before { border-color: var(--red); }
        .cab-art.premium:after { background: var(--red); }

        /* ---------- Page hero ---------- */
        .page-hero {
            padding: 76px 0 44px;
            background:
                radial-gradient(circle at 12% 20%, rgba(116, 198, 157, 0.28), transparent 30%),
                radial-gradient(circle at 92% 10%, rgba(255, 138, 0, 0.16), transparent 32%),
                linear-gradient(135deg, #fffaf0 0%, #ecf7ff 52%, #fff1dd 100%);
        }

        /* ---------- CTA ---------- */
        .cta-band {
            padding: 70px 0;
            color: #fff;
            background:
                radial-gradient(circle at 85% 20%, rgba(217, 45, 32, 0.4), transparent 38%),
                linear-gradient(135deg, var(--blue-dark), var(--blue) 52%, var(--orange));
        }

        .cta-band h2 { font-size: clamp(2rem, 4vw, 3.4rem); font-weight: 800; }

        .cta-band p { color: rgba(255, 255, 255, 0.88); }

        /* ---------- Floating actions ---------- */
        .float-actions {
            position: fixed;
            right: 20px;
            bottom: 22px;
            z-index: 1040;
            display: flex;
            flex-direction: column;
            gap: 12px;
        }

        .fab {
            width: 56px;
            height: 56px;
            border-radius: 50%;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: #fff !important;
            font-size: 1.55rem;
            box-shadow: 0 14px 30px rgba(6, 47, 89, 0.3);
            transition: transform 0.15s ease;
        }

        .fab:hover { transform: scale(1.07); }

        .fab-wa { background: #25d366; }

        .fab-call { background: linear-gradient(135deg, var(--orange), var(--red)); }

        /* ---------- Footer ---------- */
        .footer {
            background: var(--blue-dark);
            color: #dce9f5;
            padding: 56px 0 24px;
        }

        .footer a { color: #fff; }

        .footer h6 { text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.85rem; color: var(--orange); }

        .footer-links p { margin-bottom: 8px; }

        .footer-links a:hover { color: var(--green); }

        .social-chip {
            width: 38px;
            height: 38px;
            border-radius: 10px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(255, 255, 255, 0.1);
            color: #fff !important;
            font-size: 1.05rem;
            transition: all 0.15s ease;
        }

        .social-chip:hover { background: var(--orange); transform: translateY(-2px); }

        .footer-bottom { border-top: 1px solid rgba(255, 255, 255, 0.14); }

        .footer-legal a { color: #dce9f5; }
        .footer-legal a:hover { color: var(--green); }

        @media (max-width: 767px) {
            .section { padding: 52px 0; }
            .navbar-brand { font-size: 1.2rem; }
            .float-actions { right: 14px; bottom: 14px; }
            .fab { width: 50px; height: 50px; font-size: 1.35rem; }
        }

/* Page styles from PrimeCabs\Home.aspx */
.hero-cabs {
        padding: 82px 0;
        background:
            linear-gradient(120deg, rgba(255,250,240,0.92), rgba(233,248,239,0.88)),
            url('https://images.unsplash.com/photo-1533473359331-0135ef1b58bf?auto=format&fit=crop&w=1600&q=80') center/cover;
    }

    .hero-badge {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        border-radius: 999px;
        padding: 9px 14px;
        color: var(--blue);
        background: #fff;
        font-weight: 800;
        box-shadow: 0 10px 24px rgba(6,47,89,0.08);
    }

    .hero-badge i { color: var(--red); }

    .hero-cabs h1 {
        max-width: 780px;
        margin-top: 22px;
        color: var(--blue-dark);
        font-size: clamp(2.45rem, 6vw, 5rem);
        line-height: 1.02;
        font-weight: 800;
    }

    .hero-copy {
        max-width: 680px;
        color: #29445f;
        font-size: 1.2rem;
        margin-top: 20px;
    }

    .booking-card {
        padding: 28px;
        border-radius: 8px;
        background: rgba(255,255,255,0.96);
        border: 1px solid rgba(10,77,143,0.14);
        box-shadow: 0 24px 60px rgba(6,47,89,0.18);
    }

    .booking-card h3 { color: var(--blue-dark); font-weight: 800; }

    .hero-stats {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 14px;
        max-width: 620px;
        margin-top: 36px;
    }

    .hero-stats div {
        padding: 16px;
        border-radius: 8px;
        background: rgba(255,255,255,0.85);
        border: 1px solid rgba(255,255,255,0.8);
    }

    .hero-stats strong { display: block; color: var(--orange); font-size: 1.6rem; font-weight: 800; }
    .hero-stats span { color: var(--blue-dark); font-weight: 700; }

    .profile-band { background: linear-gradient(135deg, #ffffff, var(--green-soft)); }

    .fleet-preview { background: #f3fbf6; }

    .fare { color: var(--red); font-size: 1.15rem; }

    .fleet-photo {
        height: 150px;
        width: 100%;
        object-fit: cover;
        border-radius: 12px;
    }

    .ets-section { background: linear-gradient(135deg, var(--orange-soft), #fff 65%); }

    .ets-stats {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px;
    }

    .ets-stat-card {
        padding: 28px 22px;
        border-radius: 12px;
        background: #fff;
        border: 1px solid rgba(10,77,143,0.12);
        box-shadow: 0 14px 34px rgba(6,47,89,0.10);
        text-align: center;
    }

    .ets-stat-card .ets-num {
        display: block;
        color: var(--blue);
        font-size: 2.2rem;
        font-weight: 800;
        line-height: 1.1;
    }

    .ets-stat-card .ets-label {
        color: var(--orange);
        font-weight: 700;
        font-size: .9rem;
    }

    .why-section { background: linear-gradient(135deg, var(--offwhite), var(--green-soft)); }

    .process-section { background: linear-gradient(160deg, var(--orange-soft), #fff 55%); }

    .testimonial-section { background: #f3fbf6; }

    @media (max-width: 767px) {
        .hero-cabs { padding: 56px 0; }
        .hero-stats { grid-template-columns: 1fr; }
    }

/* Page styles from PrimeCabs\Fleet.aspx */
.fleet-list {
        padding-left: 18px;
        color: var(--muted);
        min-height: 78px;
    }

    .fleet-list li { margin-bottom: 4px; }

    .fleet-photo {
        height: 150px;
        width: 100%;
        object-fit: cover;
        border-radius: 12px;
    }

    .fleet-list-cols { color: #29445f; font-weight: 600; }

    .cab-art.hatch:before { left: 18%; right: 18%; }

/* Page styles from PrimeCabs\Privacy.aspx */
.policy-wrap {
        max-width: 820px;
        margin: 0 auto;
        background: #fff;
        border: 1px solid var(--line);
        border-radius: 8px;
        box-shadow: 0 18px 42px rgba(6, 47, 89, 0.08);
        padding: 44px;
    }

    .policy-wrap h3 {
        color: var(--blue-dark);
        font-weight: 800;
        margin: 30px 0 12px;
        font-size: 1.15rem;
    }

    .policy-wrap h3:first-of-type { margin-top: 8px; }

    .policy-wrap p { color: var(--muted); line-height: 1.7; margin-bottom: 12px; }

    .policy-list {
        padding-left: 20px;
        color: var(--muted);
        line-height: 1.7;
    }

    .policy-list li { margin-bottom: 8px; }

    @media (max-width: 767px) {
        .policy-wrap { padding: 28px 20px; }
    }

/* Page styles from PrimeCabs\Terms.aspx */
.policy-wrap {
        max-width: 820px;
        margin: 0 auto;
        background: #fff;
        border: 1px solid var(--line);
        border-radius: 8px;
        box-shadow: 0 18px 42px rgba(6, 47, 89, 0.08);
        padding: 44px;
    }

    .policy-wrap h3 {
        color: var(--blue-dark);
        font-weight: 800;
        margin: 30px 0 12px;
        font-size: 1.15rem;
    }

    .policy-wrap h3:first-of-type { margin-top: 8px; }

    .policy-wrap p { color: var(--muted); line-height: 1.7; margin-bottom: 12px; }

    .policy-list {
        padding-left: 20px;
        color: var(--muted);
        line-height: 1.7;
    }

    .policy-list li { margin-bottom: 8px; }

    @media (max-width: 767px) {
        .policy-wrap { padding: 28px 20px; }
    }

/* Page styles from PrimeCabs\Admin\Login.aspx */
.login-hero {
        min-height: calc(100vh - 220px);
        display: flex;
        align-items: center;
        padding: 60px 0;
        background:
            radial-gradient(circle at 15% 25%, rgba(116,198,157,.25), transparent 35%),
            radial-gradient(circle at 85% 20%, rgba(255,138,0,.18), transparent 38%),
            linear-gradient(135deg, #fffaf0 0%, #ecf7ff 55%, #fff1dd 100%);
    }

    .login-card {
        background: rgba(255,255,255,.97);
        border: 1px solid var(--line);
        border-radius: 10px;
        box-shadow: 0 26px 60px rgba(6,47,89,.16);
        padding: 40px 36px;
    }

    .login-mark {
        width: 62px; height: 62px; border-radius: 16px;
        display: inline-flex; align-items: center; justify-content: center;
        font-size: 1.7rem; color: #fff;
        background: linear-gradient(135deg, var(--orange), var(--red));
        box-shadow: 0 14px 30px rgba(217,45,32,.3);
    }

    .captcha-img {
        height: 52px;
        border-radius: 8px;
        border: 1px solid var(--line);
        cursor: pointer;
        user-select: none;
    }

/* ---- Home page specific styles ---- */
.hero-cabs {
    padding: 82px 0;
    background: linear-gradient( 120deg, rgba(255,250,240,0.92), rgba(233,248,239,0.88) ), url('https://images.unsplash.com/photo-1533473359331-0135ef1b58bf?auto=format&fit=crop&w=1600&q=80') center/cover;
}

.hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border-radius: 999px;
    padding: 9px 14px;
    color: var(--blue);
    background: #fff;
    font-weight: 800;
    box-shadow: 0 10px 24px rgba(6,47,89,0.08);
}
.hero-badge i { color: var(--red); }

.hero-cabs h1 {
    max-width: 780px;
    margin-top: 22px;
    color: var(--blue-dark);
    font-size: clamp(2.45rem, 6vw, 5rem);
    line-height: 1.02;
    font-weight: 800;
}

.hero-copy {
    max-width: 680px;
    color: #29445f;
    font-size: 1.2rem;
    margin-top: 20px;
}

.booking-card {
    padding: 28px;
    border-radius: 8px;
    background: rgba(255,255,255,0.96);
    border: 1px solid rgba(10,77,143,0.14);
    box-shadow: 0 24px 60px rgba(6,47,89,0.18);
}
.booking-card h3 { color: var(--blue-dark); font-weight: 800; }

.hero-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    max-width: 620px;
    margin-top: 36px;
}
.hero-stats div {
    padding: 16px;
    border-radius: 8px;
    background: rgba(255,255,255,0.85);
    border: 1px solid rgba(255,255,255,0.8);
}
.hero-stats strong {
    display: block;
    color: var(--orange);
    font-size: 1.6rem;
    font-weight: 800;
}
.hero-stats span {
    color: var(--blue-dark);
    font-weight: 700;
}

.profile-band { background: linear-gradient( 135deg, #ffffff, var(--green-soft) ); }
.fleet-preview { background: #f3fbf6; }
.fare { color: var(--red); font-size: 1.15rem; }
.fleet-photo { height: 150px; width: 100%; object-fit: cover; border-radius: 12px; }
.ets-section { background: linear-gradient( 135deg, var(--orange-soft), #fff 65% ); }
.ets-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.ets-stat-card {
    padding: 28px 22px;
    border-radius: 12px;
    background: #fff;
    border: 1px solid rgba(10,77,143,0.12);
    box-shadow: 0 14px 34px rgba(6,47,89,0.10);
    text-align: center;
}
.ets-stat-card .ets-num {
    display: block;
    color: var(--blue);
    font-size: 2.2rem;
    font-weight: 800;
    line-height: 1.1;
}
.ets-stat-card .ets-label {
    color: var(--orange);
    font-weight: 700;
    font-size: .9rem;
}
.why-section { background: linear-gradient( 135deg, var(--offwhite), var(--green-soft) ); }
.process-section { background: linear-gradient( 160deg, var(--orange-soft), #fff 55% ); }
.testimonial-section { background: #f3fbf6; }

@media (max-width: 767px) {
    .hero-cabs { padding: 56px 0; }
    .hero-stats { grid-template-columns: 1fr; }
}
