/**
 * Responsive global — móvil, tablet, escritorio y monitores grandes.
 * Cargar al final de la pila CSS en todas las plantillas.
 */

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

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

/* Contenedor de tablas con scroll horizontal en pantallas estrechas */
.tbl-scroll {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin-bottom: 4px;
}

.tbl-scroll > table {
    min-width: 560px;
}

.tbl-scroll--wide > table {
    min-width: 720px;
}

/* — Landing: contenedor y tipografía fluida — */
.dwbi-landing .container,
.lp-body-section .container {
    padding-left: clamp(1rem, 4vw, 1.5rem);
    padding-right: clamp(1rem, 4vw, 1.5rem);
}

.head-display {
    font-size: clamp(1.75rem, 4.5vw, 3rem);
}

/* — Legal y contenido largo — */
.legal-content,
.lp-legal-prose {
    padding-left: clamp(0.5rem, 3vw, 0);
    padding-right: clamp(0.5rem, 3vw, 0);
}

.legal-cookie-table-wrap,
.legal-cookie-table {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* — Login (login.css shell) — */
@media (max-width: 900px) {
    .login-wrap {
        padding: 1.75rem 1rem;
        min-height: 100dvh;
    }

    .login-card {
        max-width: min(440px, 100%);
    }

    .brand-logo--login .brand-logo__img--wordmark-part {
        max-width: min(100%, 12rem);
    }
}

@media (max-width: 600px) {
    .login-section {
        padding: 2rem 1rem;
    }

    .login-wrap {
        align-items: flex-start;
        padding: 1.25rem 0.875rem 2rem;
    }

    .login-card {
        padding: 1.5rem 1.25rem;
        border-radius: 10px;
    }

    .login-demo {
        font-size: 0.8125rem;
    }

    .login-demo p {
        word-break: break-word;
    }

    .chat-widget {
        margin: 0 0.75rem 1rem;
        border-radius: 12px;
    }
}

/* — Monitores muy anchos: legibilidad del contenido — */
@media (min-width: 1800px) {
    .dwbi-landing .container {
        max-width: 1320px;
    }

    .lp-body-section .container {
        max-width: 1200px;
    }
}

@media (min-width: 2200px) {
    .dwbi-landing .container {
        max-width: 1440px;
    }
}

@media (max-width: 480px) {
    .dwbi-stats-grid {
        grid-template-columns: 1fr;
    }

    .dwbi-hero-title {
        font-size: clamp(1.65rem, 8vw, 2.25rem);
    }

    .dwbi-wrap {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .lp-form-grid {
        grid-template-columns: 1fr !important;
    }
}

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

    body.dwbi-landing .svc-grid {
        grid-template-columns: 1fr;
    }

    body.dwbi-landing .lp-form-layout--contact .lp-form-card--message {
        order: -1;
    }

    body.dwbi-landing .lp-faq-nav {
        top: calc(var(--nav-h) - 1px);
    }

    body.dwbi-landing .lp-faq-nav-list {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 0.75rem;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    body.dwbi-landing .lp-faq-nav-list::-webkit-scrollbar {
        display: none;
    }
}