body {
    font-family: "Archivo", sans-serif;
    background-color: #F4F5F7;
    color: #111111;
    -webkit-font-smoothing: antialiased;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: 112px;
}

::selection {
    background: #027B83;
    color: #ffffff;
}

a,
button {
    -webkit-tap-highlight-color: transparent;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
    outline: 3px solid rgba(2, 123, 131, 0.32);
    outline-offset: 3px;
}

img {
    max-width: 100%;
}

#main-header {
    backdrop-filter: saturate(145%) blur(14px);
}

#mobile-drawer {
    overscroll-behavior: contain;
}

/* Hide scrollbar for Chrome, Safari and Opera */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}
/* Hide scrollbar for IE, Edge and Firefox */
.no-scrollbar {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}

@media (max-width: 767px) {
    html {
        scroll-padding-top: 96px;
    }

    body {
        background-color: #f6f8fa;
    }

    section.px-4 {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
    }

    .rounded-\[50px\] {
        border-radius: 1.5rem;
    }

    .rounded-\[35px\] {
        border-radius: 1.125rem;
    }

    .text-7xl {
        font-size: clamp(2.45rem, 12vw, 4.5rem);
        line-height: 1.04;
    }

    .text-6xl {
        font-size: clamp(2.25rem, 10vw, 3.75rem);
        line-height: 1.06;
    }

    #main-header .text-\[28px\] {
        font-size: 1.35rem;
    }

    #main-header img.h-14 {
        height: 2.75rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }
}

@media print {
    #main-header,
    #mobile-overlay,
    #mobile-drawer,
    script {
        display: none !important;
    }

    body {
        background: #ffffff;
        color: #111111;
    }

    a {
        color: inherit;
        text-decoration: none;
    }
}
