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

body {
    min-width: 320px;
}

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

input,
select,
textarea,
button {
    max-width: 100%;
}

table {
    max-width: 100%;
}

.w-46 {
    width: 11.5rem;
    height: 11.5rem;
}

.portal-tabs {
    overflow-x: auto;
}

.portal-tab {
    white-space: nowrap;
}

.whatsapp-cta.whatsapp-cta {
    background-color: #25d366 !important;
    color: #ffffff !important;
    box-shadow: 0 10px 25px rgba(37, 211, 102, 0.3);
}

.whatsapp-cta.whatsapp-cta:hover {
    background-color: #1ebe5d !important;
    color: #ffffff !important;
}

.whatsapp-inline.whatsapp-inline {
    background-color: #25d366 !important;
    color: #ffffff !important;
    box-shadow: none !important;
}

.whatsapp-inline.whatsapp-inline:hover {
    background-color: #1ebe5d !important;
    color: #ffffff !important;
}

@media (max-width: 1024px) {
    .md\:grid-cols-4,
    .md\:grid-cols-5,
    .md\:grid-cols-6 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 768px) {
    body {
        overflow-x: hidden;
    }

    body > header .max-w-full,
    .min-h-screen > header .max-w-full {
        align-items: flex-start !important;
        flex-wrap: wrap;
        gap: 0.75rem;
        padding: 0.75rem 1rem !important;
    }

    body > header h1,
    .min-h-screen > header h1 {
        font-size: 1.05rem !important;
        line-height: 1.35 !important;
    }

    body > header button,
    .min-h-screen > header button {
        padding: 0.5rem 0.75rem !important;
        font-size: 0.875rem !important;
    }

    body > .flex,
    .min-h-screen > .flex {
        flex-direction: column !important;
        width: 100%;
    }

    body > .flex > .w-64,
    body > .flex > aside.w-64,
    .min-h-screen > .flex > .w-64,
    .min-h-screen > .flex > aside.w-64 {
        min-height: auto !important;
        width: 100% !important;
        padding: 0.75rem 1rem !important;
    }

    body > .flex > .w-64 h2,
    body > .flex > aside.w-64 h2,
    .min-h-screen > .flex > .w-64 h2,
    .min-h-screen > .flex > aside.w-64 h2 {
        margin-bottom: 0.75rem !important;
    }

    body > .flex > .w-64 nav,
    body > .flex > aside.w-64 nav,
    .min-h-screen > .flex > .w-64 nav,
    .min-h-screen > .flex > aside.w-64 nav {
        display: flex;
        gap: 0.5rem;
        overflow-x: auto;
        padding-bottom: 0.25rem;
        scrollbar-width: thin;
    }

    body > .flex > .w-64 nav.space-y-2 > :not([hidden]) ~ :not([hidden]),
    body > .flex > aside.w-64 nav.space-y-2 > :not([hidden]) ~ :not([hidden]),
    .min-h-screen > .flex > .w-64 nav.space-y-2 > :not([hidden]) ~ :not([hidden]),
    .min-h-screen > .flex > aside.w-64 nav.space-y-2 > :not([hidden]) ~ :not([hidden]) {
        margin-top: 0 !important;
    }

    body > .flex > .w-64 nav a,
    body > .flex > aside.w-64 nav a,
    .min-h-screen > .flex > .w-64 nav a,
    .min-h-screen > .flex > aside.w-64 nav a {
        flex: 0 0 auto;
        white-space: nowrap;
    }

    body > .flex > .flex-1,
    body > .flex > main.flex-1,
    .min-h-screen > .flex > .flex-1,
    .min-h-screen > .flex > main.flex-1 {
        min-width: 0;
        overflow-x: hidden !important;
        padding: 1rem !important;
        width: 100%;
    }

    .text-3xl {
        font-size: 1.5rem !important;
        line-height: 2rem !important;
    }

    .text-5xl {
        font-size: 2.25rem !important;
        line-height: 2.5rem !important;
    }

    .flex.justify-between.items-center.mb-8,
    .flex.justify-between.items-start.mb-6,
    .flex.justify-between.items-start.mb-5 {
        align-items: flex-start !important;
        flex-direction: column !important;
        gap: 1rem;
    }

    [class*="grid-cols-2"],
    [class*="grid-cols-3"],
    [class*="grid-cols-4"],
    [class*="grid-cols-5"],
    [class*="grid-cols-6"] {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    [class~="h-[22rem]"],
    [class~="h-[516px]"],
    [class~="min-h-[560px]"] {
        height: auto !important;
        min-height: auto !important;
    }

    .h-96 {
        height: 18rem !important;
    }

    .w-46 {
        width: 9rem;
        height: 9rem;
    }

    .p-8,
    .p-10 {
        padding: 1rem !important;
    }

    .px-6 {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    .py-16 {
        padding-bottom: 3rem !important;
        padding-top: 3rem !important;
    }

    .gap-6,
    .gap-8 {
        gap: 1rem !important;
    }

    .flex.gap-3,
    .flex.gap-4,
    .flex.gap-6 {
        flex-wrap: wrap;
    }

    .flex.gap-4 > .flex-1,
    .flex.gap-6 > .flex-1 {
        flex-basis: 100%;
    }

    .bg-white.rounded-lg.shadow.overflow-hidden,
    .bg-white.rounded-lg.shadow-md.overflow-hidden,
    .overflow-x-auto {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
    }

    table.min-w-full,
    table.w-full {
        min-width: 42rem;
    }

    th,
    td {
        overflow-wrap: normal;
    }

    .fixed.inset-0 {
        padding: 0.5rem;
    }

    .fixed.inset-0 > .relative,
    .fixed.inset-0 .bg-white.rounded-lg.shadow-xl {
        margin: 0 auto !important;
        max-height: calc(100vh - 1rem);
        max-width: calc(100vw - 1rem) !important;
        overflow-y: auto;
        padding: 1rem !important;
        top: 0 !important;
    }

    .fixed.inset-0 .mt-8,
    .fixed.inset-0 .mt-12 {
        margin-top: 0 !important;
    }
}

@media (max-width: 640px) {
    .sm\:flex-row {
        flex-direction: column !important;
    }

    .sm\:w-1\/4,
    .sm\:w-3\/4 {
        width: 100% !important;
    }

    .text-right {
        text-align: left !important;
    }

    .service-mobile-price {
        text-align: right !important;
    }

    .justify-end {
        justify-content: flex-start !important;
    }

    .rounded-xl,
    .rounded-lg {
        border-radius: 0.5rem !important;
    }

    section,
    article {
        scroll-margin-top: 4rem;
    }
}