/**
 * Naa Sika — global responsive tighten-ups for mobile & small screens
 */

html {
    -webkit-text-size-adjust: 100%;
    overflow-x: clip;
    scroll-behavior: smooth;
}

body {
    overflow-x: hidden;
    max-width: 100%;
    overflow-wrap: break-word;
}

img,
video,
iframe {
    max-width: 100%;
    height: auto;
}

section,
.shadcn-card,
.max-w-7xl,
.max-w-4xl {
    min-width: 0;
}

.overflow-x-auto {
    -webkit-overflow-scrolling: touch;
}

/* CTA USSD dial row — stack on narrow viewports */
.cta-ussd-row {
    max-width: 100%;
}

@media (max-width: 639px) {
    .shadcn-card {
        padding: 1.125rem;
    }

    .cta-ussd-row > span.text-lg {
        font-size: 1rem;
        line-height: 1.4;
    }

    .cta-ussd-row a[data-country="ussd"],
    .cta-ussd-row a[href*="426"] {
        max-width: 100%;
    }

    /* Hero stats (home) */
    #home .hero-stats-grid {
        gap: 0.375rem;
    }

    #home .hero-stats-grid > div {
        min-width: 0;
    }

    #home .hero-stats-grid .stat-label {
        font-size: 0.625rem;
        line-height: 1.25;
        hyphens: auto;
        word-break: break-word;
    }

    #home .hero-stats-grid .stat-value {
        font-size: 1.25rem;
    }

    /* Savings plan duration / interest / min chips */
    .plan-stats-grid {
        gap: 0.375rem;
    }

    .plan-stats-grid > div {
        min-width: 0;
        padding: 0.375rem 0.2rem;
    }

    .plan-stats-grid .font-semibold {
        font-size: 0.65rem;
        line-height: 1.2;
        word-break: break-word;
    }

    /* CTA primary buttons — full width on phones */
    section.gradient-bg .cta-actions-row > a,
    section.gradient-bg .cta-actions-row > .shadcn-button {
        width: 100%;
        justify-content: center;
        font-size: 1rem;
        padding-left: 1rem;
        padding-right: 1rem;
    }

    /* Chat mock on home */
    .chat-body {
        min-height: 280px;
        max-height: 340px;
    }

    .chat-interface {
        width: 100%;
    }

    /* Story / article blocks */
    .shadcn-card .story-content-pad {
        padding: 1.25rem;
    }

    .rosca-app-spotlight {
        padding: 1.25rem;
    }

    /* Compact fixed nav */
    nav .nav-inner {
        height: 4rem;
    }

    nav .nav-logo {
        height: 2.5rem;
    }

    /* Section vertical rhythm */
    section.py-16 {
        padding-top: 3rem;
        padding-bottom: 3rem;
    }

    .hero-section-pad {
        padding-top: 2.5rem;
        padding-bottom: 2.5rem;
    }
}

@media (max-width: 380px) {
    .plan-stats-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .plan-stats-grid > div:nth-child(3) {
        grid-column: 1 / -1;
    }
}

@supports (padding: max(0px)) {
    body {
        padding-left: max(0px, env(safe-area-inset-left));
        padding-right: max(0px, env(safe-area-inset-right));
    }

    nav.fixed.top-0 {
        padding-left: max(0px, env(safe-area-inset-left));
        padding-right: max(0px, env(safe-area-inset-right));
    }
}

@media (pointer: coarse) {
    .shadcn-button,
    nav a:not(.no-touch-target),
    nav button,
    #mobile-menu a {
        min-height: 44px;
    }
}