/* ================================================
   MOBILE COMPLETE REWRITE - MAX PRIORITY
   ================================================ */

/* HERO - center everything */
@media screen and (max-width: 640px) {
    body #inicio {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-height: 100svh !important;
        padding: 80px 20px 40px !important;
        text-align: center !important;
    }

    body #inicio > .max-w-7xl,
    body #inicio > div.max-w-7xl {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        text-align: center !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
    }

    body #inicio .mb-6.flex.justify-center {
        margin-bottom: 12px !important;
        text-align: center !important;
        display: flex !important;
        justify-content: center !important;
    }

    body #inicio .mb-6 span {
        font-size: 0.625rem !important;
        padding: 6px 14px !important;
        letter-spacing: 0.2em !important;
        white-space: nowrap !important;
    }

    body #inicio h1 {
        font-size: 2.25rem !important;
        line-height: 1 !important;
        margin-bottom: 16px !important;
        text-align: center !important;
        width: 100% !important;
    }

    body #inicio h1 span {
        display: block !important;
    }

    body #inicio p.text-lg {
        font-size: 0.9rem !important;
        line-height: 1.6 !important;
        text-align: center !important;
        max-width: 100% !important;
        margin-bottom: 32px !important;
    }

    body #inicio .flex.flex-col {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        gap: 16px !important;
        width: 100% !important;
    }

    body #inicio .btn-gold {
        width: 100% !important;
        max-width: 320px !important;
        display: block !important;
        text-align: center !important;
        padding: 16px 24px !important;
        box-sizing: border-box !important;
    }

    body #inicio a[href="#metodo"] {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
    }
}

/* NAVBAR - full width centered */
@media screen and (max-width: 640px) {
    body nav[aria-label] {
        padding: 0 12px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    body #navbar {
        width: 100% !important;
        max-width: 100% !important;
        justify-content: space-between !important;
        padding: 10px 16px !important;
        border-radius: 999px !important;
    }
}

/* STATS STRIP */
@media screen and (max-width: 640px) {
    body #metodo {
        border-top: 1px solid rgba(255,255,255,0.05) !important;
        border-bottom: 1px solid rgba(255,255,255,0.05) !important;
    }

    body #metodo > .max-w-7xl {
        max-width: 100% !important;
        padding: 24px 20px !important;
    }

    body #metodo .grid {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 20px 16px !important;
        text-align: center !important;
    }

    body #metodo .divide-x {
        display: contents !important;
    }

    body #metodo .divide-x > div {
        padding: 8px !important;
    }

    body #metodo p.text-3xl {
        font-size: 1.5rem !important;
        margin-bottom: 4px !important;
    }

    body #metodo p.text-xs {
        font-size: 0.625rem !important;
    }
}

/* SERVICES - full width cards */
@media screen and (max-width: 640px) {
    body #servicos {
        padding: 48px 20px !important;
        overflow: hidden !important;
    }

    body #servicos > .max-w-7xl {
        max-width: 100% !important;
        padding: 0 !important;
    }

    body #servicos .mb-20 {
        margin-bottom: 24px !important;
        text-align: center !important;
    }

    body #servicos h2 {
        font-size: 1.5rem !important;
    }

    body #servicos > .max-w-7xl > p {
        font-size: 0.875rem !important;
        text-align: center !important;
    }

    body #servicos .grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 16px !important;
        height: auto !important;
        grid-template-columns: none !important;
    }

    body #servicos .glass-card {
        width: 100% !important;
        min-height: auto !important;
        padding: 24px !important;
        box-sizing: border-box !important;
        margin: 0 !important;
    }

    body #servicos .md\:col-span-2,
    body #servicos .md\:row-span-2 {
        grid-column: auto !important;
        grid-row: auto !important;
        width: 100% !important;
    }

    body #servicos .glass-card .absolute {
        display: none !important;
    }

    body #servicos h3 {
        font-size: 1.125rem !important;
        margin-bottom: 8px !important;
    }

    body #servicos .text-slate-400 {
        font-size: 0.8125rem !important;
        line-height: 1.5 !important;
    }
}

/* ABOUT - full width */
@media screen and (max-width: 640px) {
    body #agencia {
        padding: 48px 20px !important;
    }

    body #agencia > .max-w-7xl {
        max-width: 100% !important;
        padding: 0 !important;
    }

    body #agencia .grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 24px !important;
    }

    body #agencia .order-2 {
        order: 1 !important;
    }

    body #agencia .order-1 {
        order: 2 !important;
    }

    body #agencia h2 {
        font-size: 1.375rem !important;
        line-height: 1.3 !important;
        margin-bottom: 16px !important;
    }

    body #agencia .space-y-6 p {
        font-size: 0.875rem !important;
        line-height: 1.6 !important;
    }

    body #agencia .aspect-\[4\/5\] {
        aspect-ratio: 16/10 !important;
        max-height: 250px !important;
    }

    body #agencia .image-service-wrapper .service-card {
        position: relative !important;
        margin-top: 12px !important;
    }

    body #agencia .mt-10 {
        margin-top: 20px !important;
    }

    body #agencia .gap-8 {
        gap: 20px !important;
    }

    body #agencia .text-3xl {
        font-size: 1.5rem !important;
    }

    body #agencia .text-xs {
        font-size: 0.625rem !important;
    }
}

/* TESTIMONIALS - horizontal scroll + 3D */
@media screen and (max-width: 640px) {
    body #depoimentos {
        padding: 48px 0 !important;
        overflow: hidden !important;
    }

    body #depoimentos > .max-w-7xl {
        max-width: 100% !important;
        padding: 0 16px !important;
    }

    body #depoimentos .mb-16 {
        margin-bottom: 20px !important;
        text-align: center !important;
    }

    body #depoimentos h2 {
        font-size: 1.375rem !important;
    }

    body #depoimentos .text-slate-400 {
        font-size: 0.8125rem !important;
    }

    body .depo-card-wrap {
        width: 100% !important;
        min-width: 0 !important;
    }

    body .depo-grid {
        gap: 16px !important;
        padding: 0 8px !important;
    }

    body .depo-ops-grid {
        gap: 4px !important;
        border-radius: 10px !important;
    }

    body .depo-card {
        padding: 16px !important;
    }

    body .depo-card .depo-stars svg {
        width: 14px !important;
        height: 14px !important;
    }

    body .depo-card .depo-text {
        font-size: 0.75rem !important;
        line-height: 1.5 !important;
    }

    body .depo-avatar {
        width: 2.25rem !important;
        height: 2.25rem !important;
    }

    body #depoimentos .flex.justify-center {
        margin-top: 12px !important;
        gap: 12px !important;
    }

    body #depoimentos #testimonial-prev,
    body #depoimentos #testimonial-next {
        width: 34px !important;
        height: 34px !important;
    }
}

/* CONTACT FORM - full width */
@media screen and (max-width: 640px) {
    body #contacto {
        padding: 48px 20px !important;
    }

    body #contacto > .max-w-3xl {
        max-width: 100% !important;
        padding: 0 !important;
    }

    body #contacto .mb-16 {
        margin-bottom: 24px !important;
        text-align: center !important;
    }

    body #contacto h2 {
        font-size: 1.5rem !important;
    }

    body #contacto > .max-w-3xl > p {
        font-size: 0.875rem !important;
        text-align: center !important;
    }

    body .contact-form-shell {
        width: 100% !important;
        padding: 0 !important;
        border-radius: 16px !important;
        box-sizing: border-box !important;
    }

    body #contact-form {
        padding: 16px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    body .form-headline {
        flex-direction: column !important;
        gap: 12px !important;
        text-align: center !important;
        margin-bottom: 16px !important;
    }

    body .form-badges {
        justify-content: center !important;
        flex-wrap: wrap !important;
        gap: 6px !important;
    }

    body .form-layout {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        width: 100% !important;
    }

    body .form-layout > .grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
    }

    body .field-card {
        width: 100% !important;
        margin: 0 !important;
    }

    body .field-card-inner {
        width: 100% !important;
        box-sizing: border-box !important;
        padding: 4px !important;
    }

    body #contact-form input,
    body #contact-form select,
    body #contact-form textarea {
        width: 100% !important;
        box-sizing: border-box !important;
        padding: 14px !important;
        font-size: 16px !important;
    }

    body #lead-submit-btn {
        width: 100% !important;
        box-sizing: border-box !important;
        padding: 16px !important;
        font-size: 0.8125rem !important;
    }

    body .phone-inline-grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 8px !important;
        width: 100% !important;
    }

    body .phone-inline-field {
        width: 100% !important;
    }

    body #country-code-select {
        min-height: 48px !important;
    }

    body .form-live-status,
    body .form-hint {
        text-align: center !important;
        font-size: 0.6875rem !important;
    }
}

/* FOOTER */
@media screen and (max-width: 640px) {
    body footer {
        padding: 24px 20px !important;
        text-align: center !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    body footer .flex {
        justify-content: center !important;
        margin-bottom: 12px !important;
    }

    body footer p {
        font-size: 0.625rem !important;
    }
}

/* MINER BUTTON - hide on mobile to avoid overlap */
@media screen and (max-width: 640px) {
    body .miner-btn {
        display: none !important;
    }
}

/* CHATBOT - better mobile */
@media screen and (max-width: 480px) {
    body .horus-chatbot {
        bottom: 16px !important;
        right: 16px !important;
    }

    body .chatbot-toggle {
        width: 52px !important;
        height: 52px !important;
    }

    body .chatbot-window {
        width: calc(100vw - 32px) !important;
        right: 0 !important;
        bottom: 64px !important;
        max-height: calc(100vh - 100px) !important;
    }
}

/* CYBER SECURITY - Rate limiting, input sanitization */
@media screen and (max-width: 640px) {
    body input,
    body select,
    body textarea {
        -webkit-appearance: none !important;
        appearance: none !important;
    }

    body form {
        -webkit-autofill: none !important;
    }
}
