* {
    box-sizing: border-box;
}

html,
body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

main img,
main video,
main canvas,
main svg,
main iframe {
    max-width: 100%;
}

main iframe {
    display: block;
    width: 100%;
}

header img,
nav img {
    max-width: none;
}

header nav a img[alt="KBMF"],
header nav a img[alt="KBMF Logo"] {
    height: 2.5rem !important;
    width: auto !important;
    max-width: none !important;
}

@media (min-width: 768px) {
    header nav .group > div.absolute {
        z-index: 70;
    }

    header nav .group:hover > div.absolute {
        opacity: 1 !important;
        visibility: visible !important;
    }
}

main,
section,
.container,
.grid,
.flex {
    min-width: 0;
}

pre,
table {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

input,
select,
textarea,
button {
    font: inherit;
}

@media (max-width: 767px) {
    .container {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    h1 {
        font-size: clamp(1.875rem, 8vw, 2.75rem) !important;
        line-height: 1.1;
    }

    h2 {
        font-size: clamp(1.5rem, 6vw, 2rem) !important;
        line-height: 1.2;
    }

    h3 {
        font-size: clamp(1.125rem, 5vw, 1.5rem) !important;
    }

    p {
        line-height: 1.65;
    }

    [class*="py-24"] {
        padding-top: 4rem !important;
        padding-bottom: 4rem !important;
    }

    [class*="py-20"] {
        padding-top: 3.5rem !important;
        padding-bottom: 3.5rem !important;
    }

    [class*="gap-12"] {
        gap: 2rem !important;
    }

    [class*="gap-16"] {
        gap: 2.5rem !important;
    }

    footer .grid.grid-cols-2 {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    footer .text-xs.flex.gap-6 {
        flex-direction: column;
        gap: 0.75rem !important;
        text-align: center;
    }

    #mobileMenu a,
    button,
    [role="button"] {
        min-height: 44px;
    }
}
