/* ============================================================
   V Unique Style — Homepage Mobile Responsive
   Targets all homepage sections for phones & tablets
   ============================================================ */

/* ── TABLET (≤ 900px) ──────────────────────────────────── */
@media (max-width: 900px) {
    .hero-v2-content {
        padding: 110px 28px 50px !important;
    }

    .section {
        padding: 60px 28px !important;
    }

    .contact-section {
        padding: 60px 28px !important;
    }

    .gallery-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        grid-template-rows: auto !important;
    }

    .gallery-item.tall {
        grid-row: span 1 !important;
    }

    .stats-bar-num {
        font-size: 1.9rem !important;
    }
}

/* ── MOBILE (≤ 768px) ──────────────────────────────────── */
@media (max-width: 768px) {

    /* HERO */
    .hero-v2 {
        min-height: 100svh;
    }

    .hero-v2-bg {
        animation: none !important;
        transform: scale(1) !important;
    }

    #heroCanvas {
        display: none !important;
    }

    .hero-v2-content {
        padding: 96px 20px 44px !important;
        text-align: center !important;
        max-width: 100% !important;
    }

    .hero-v2-content h1 {
        font-size: clamp(1.8rem, 6.5vw, 2.5rem) !important;
        line-height: 1.22 !important;
    }

    .hero-v2-content p {
        font-size: .92rem !important;
        max-width: 100% !important;
    }

    .hero-v2-content>div[style*="display:flex;gap:14px"] {
        justify-content: center !important;
        flex-wrap: wrap;
    }

    .hero-badge {
        font-size: .68rem !important;
    }

    /* STATS BAR */
    section[style*="margin:-40px"] {
        padding: 0 16px !important;
        margin-top: -26px !important;
    }

    .stats-bar {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .stats-bar-item {
        padding: 18px 10px !important;
        border-right: none !important;
        border-bottom: 1px solid var(--border);
    }

    .stats-bar-item:nth-child(odd) {
        border-right: 1px solid var(--border) !important;
    }

    .stats-bar-item:last-child,
    .stats-bar-item:nth-last-child(2):nth-child(odd) {
        border-bottom: none !important;
    }

    .stats-bar-num {
        font-size: 1.65rem !important;
    }

    .stats-bar-label {
        font-size: .65rem !important;
    }

    /* SECTIONS */
    .section {
        padding: 48px 16px !important;
    }

    .contact-section {
        padding: 48px 16px !important;
    }

    .section-header {
        margin-bottom: 28px !important;
    }

    .section-header h2 {
        font-size: clamp(1.45rem, 5vw, 1.9rem) !important;
    }

    .section-header p {
        font-size: .85rem !important;
    }

    /* SERVICE CARDS */
    div[style*="minmax(260px"] {
        grid-template-columns: 1fr !important;
    }

    .svc-img-card {
        height: 220px !important;
    }

    .svc-book-tag {
        opacity: 1 !important;
        transform: translateY(0) !important;
    }

    /* GALLERY */
    .gallery-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        grid-template-rows: auto !important;
        gap: 8px !important;
    }

    .gallery-item.tall {
        grid-row: span 1 !important;
    }

    .gallery-item {
        min-height: 130px;
    }

    .gallery-item img {
        min-height: 130px;
        object-fit: cover;
    }

    /* WHY US */
    div[style*="minmax(210px"] {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .why-card {
        padding: 20px 14px !important;
        text-align: left;
    }

    .why-card-icon {
        margin: 0 0 10px !important;
    }

    /* disable icon rotate on mobile */
    .why-card:hover .why-card-icon {
        transform: none !important;
    }

    /* TEAM */
    .team-grid-v2 {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 12px !important;
    }

    .team-avatar-v2 {
        width: 56px !important;
        height: 56px !important;
        font-size: 1.2rem !important;
    }

    .team-card-v2 {
        padding: 18px 12px 14px !important;
    }

    /* TESTIMONIALS */
    div[style*="minmax(280px"] {
        grid-template-columns: 1fr !important;
    }

    .testimonial-card {
        padding: 20px 16px !important;
    }

    /* CTA STRIP */
    .cta-strip {
        padding: 38px 18px !important;
    }

    .cta-strip>div[style*="justify-content:center"] {
        flex-direction: column !important;
        align-items: center;
    }

    .cta-strip .btn {
        width: 100% !important;
        justify-content: center;
        max-width: 300px;
    }

    /* CONTACT */
    .contact-grid {
        grid-template-columns: 1fr !important;
        gap: 22px !important;
    }

    iframe {
        height: 210px !important;
    }

    /* FOOTER */
    .footer {
        padding: 28px 16px !important;
    }

    .footer>div>div[style*="2fr 1fr 1fr"] {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }

    /* WHATSAPP FLOAT */
    .whatsapp-float {
        bottom: 14px !important;
        right: 12px !important;
        width: 46px !important;
        height: 46px !important;
        font-size: 1.2rem !important;
    }

    /* ANIMATIONS — lighter on mobile */
    .reveal {
        transform: translateY(16px) !important;
        transition-duration: .5s !important;
    }

    .reveal-left {
        transform: translateX(-16px) !important;
        transition-duration: .5s !important;
    }

    .reveal-right {
        transform: translateX(16px) !important;
        transition-duration: .5s !important;
    }

    .reveal-scale {
        transform: scale(.95) !important;
    }

    .d-1,
    .d-2,
    .d-3,
    .d-4,
    .d-5,
    .d-6 {
        transition-delay: 0s !important;
    }

    /* CTA pulse — mobile */
    .btn-cta-pulse {
        animation: ctaM 3s ease-in-out infinite;
    }

    @keyframes ctaM {

        0%,
        100% {
            box-shadow: 0 0 0 0 rgba(212, 175, 55, .35);
        }

        50% {
            box-shadow: 0 0 0 8px rgba(212, 175, 55, 0);
        }
    }

    /* WhatsApp bounce — gentler */
    @keyframes waBounce {

        0%,
        100% {
            transform: translateY(0);
        }

        50% {
            transform: translateY(-4px);
        }
    }

    /* Hero zoom — off */
    @keyframes heroZoom {
        from {
            transform: scale(1);
        }

        to {
            transform: scale(1);
        }
    }
}

/* ── SMALL PHONE (≤ 480px) ─────────────────────────────── */
@media (max-width: 480px) {

    .hero-v2-content {
        padding: 86px 14px 36px !important;
    }

    .hero-v2-content h1 {
        font-size: 1.7rem !important;
    }

    .hero-v2-content .btn-lg {
        width: 100%;
        justify-content: center;
    }

    div[style*="minmax(260px"] {
        grid-template-columns: 1fr !important;
    }

    .svc-img-card {
        height: 188px !important;
    }

    div[style*="minmax(210px"] {
        grid-template-columns: 1fr !important;
    }

    .why-card {
        text-align: center !important;
    }

    .why-card-icon {
        margin: 0 auto 10px !important;
    }

    .gallery-grid {
        grid-template-columns: 1fr !important;
        gap: 8px !important;
    }

    .gallery-item,
    .gallery-item img {
        min-height: 170px;
        height: 170px;
    }

    .team-grid-v2 {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 8px !important;
    }

    .team-card-v2 {
        padding: 14px 8px !important;
    }

    .team-card-v2 h3 {
        font-size: .78rem;
    }

    .team-card-v2 .role {
        font-size: .68rem;
    }

    .team-avatar-v2 {
        width: 48px !important;
        height: 48px !important;
        font-size: 1rem !important;
    }

    div[style*="minmax(280px"] {
        grid-template-columns: 1fr !important;
    }

    .section {
        padding: 36px 14px !important;
    }

    .section-header h2 {
        font-size: 1.4rem !important;
    }

    .btn-lg {
        padding: 11px 18px !important;
        font-size: .87rem !important;
    }

    .nav-brand {
        font-size: .97rem !important;
    }

    .stats-bar {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .stats-bar-num {
        font-size: 1.5rem !important;
    }

    .cta-strip .btn {
        font-size: .85rem !important;
    }

    iframe {
        height: 190px !important;
    }

    .whatsapp-float {
        width: 44px !important;
        height: 44px !important;
        font-size: 1.1rem !important;
    }
}

/* ── Footer grid → stack on mobile ───────────────────── */
@media (max-width: 768px) {
    .footer-grid {
        grid-template-columns: 1fr !important;
        gap: 22px !important;
        text-align: center !important;
    }

    .footer-grid>div:first-child p {
        max-width: 100% !important;
    }

    .footer-grid div[style*="flex-direction"] {
        justify-content: center;
    }
}

/* ── Hero buttons centred on mobile ──────────────────── */
@media (max-width: 768px) {
    .hero-v2-content {
        --hero-btn-justify: center;
    }
}