/* ===== HRS Mobile Responsive Fixes ===== */

/* --- Small phones (≤ 480px) --- */
@media (max-width: 480px) {

    /* Hero headings */
    h1 {
        font-size: 1.875rem !important;
        line-height: 1.25 !important;
    }

    /* Sub-headings */
    h2 { font-size: 1.5rem !important; line-height: 1.3 !important; }

    /* Hero badge pill text */
    .text-\[10px\] { font-size: 0.7rem !important; }

    /* Reduce excessive vertical padding on sections */
    .py-32 { padding-top: 3.5rem !important; padding-bottom: 3.5rem !important; }
    .py-24 { padding-top: 2.5rem !important; padding-bottom: 2.5rem !important; }
    .py-20 { padding-top: 2rem !important; padding-bottom: 2rem !important; }

    /* Card padding on small screens */
    .glass-card { padding: 1.25rem !important; }
    .p-10 { padding: 1.25rem !important; }
    .p-12 { padding: 1.5rem !important; }
    .p-8 { padding: 1.25rem !important; }

    /* CTA rounded sections */
    .rounded-\[40px\] { border-radius: 24px !important; }
    .rounded-3xl { border-radius: 20px !important; }

    /* Gap adjustments */
    .gap-20 { gap: 2.5rem !important; }
    .gap-16 { gap: 2rem !important; }
    .gap-12 { gap: 1.5rem !important; }

    /* Hero button stack */
    .flex-col.sm\:flex-row { flex-direction: column !important; }
    .flex-col.sm\:flex-row a,
    .flex-col.sm\:flex-row button { width: 100% !important; text-align: center !important; }
}

/* --- Tablet/medium phones (≤ 768px) --- */
@media (max-width: 768px) {

    /* Prevent horizontal overflow globally */
    body { overflow-x: hidden !important; }

    /* Testimonial cards in marquee */
    .testimonial-card {
        width: 290px !important;
        padding: 1.25rem !important;
    }

    /* Client logo cards in marquee */
    .client-logo-card {
        width: 140px !important;
        height: 75px !important;
    }

    /* Marquee gap reduction */
    .marquee-track { gap: 12px !important; }
    .marquee-section { padding: 40px 0 !important; }

    /* Section mb-20/mb-16 reduce */
    .mb-20 { margin-bottom: 2.5rem !important; }
    .mb-16 { margin-bottom: 2rem !important; }

    /* Hero section top padding */
    .pt-32 { padding-top: 5.5rem !important; }
    .pt-28 { padding-top: 5rem !important; }

    /* Ensure all grids collapse */
    .grid-cols-2 { grid-template-columns: repeat(1, minmax(0, 1fr)) !important; }

    /* Large text numbers in stats */
    .text-3xl { font-size: 1.5rem !important; }

    /* How-we-work step numbers */
    .text-3xl.font-black.text-white\/10 { font-size: 2rem !important; }

    /* Space-y reduction */
    .space-y-12 > * + * { margin-top: 2rem !important; }

    /* Contact info cards */
    .glass-card.p-8.rounded-\[32px\] { padding: 1.25rem !important; }

    /* Footer grid */
    .lg\:grid-cols-4 { grid-template-columns: repeat(1, minmax(0, 1fr)); }

    /* CTA section flex direction */
    .flex-col.lg\:flex-row { gap: 2rem !important; }
}