
@media (max-width: 1024px) {
    .desktop-nav {
        gap: 20px;
    }
}

@media (max-width: 760px) {
    .site-header {
        height: 60px;
    }

    .desktop-nav {
        display: none;
    }

    .menu-toggle {
        display: block;
    }

    .account-main {
        padding: 34px 16px;
    }

    .account-layout {
        max-width: 448px;
        grid-template-columns: 1fr;
    }

    .signup-card {
        padding: 24px 22px;
    }

    .benefit-list {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 8px;
    }

    .benefit {
        min-height: 0;
        display: block;
        padding: 12px 5px;
        border: 0;
    }

    .benefit-icon {
        display: block;
        margin-bottom: 7px;
    }

    .benefit p br {
        display: none;
    }

    .site-footer {
        height: auto;
        padding: 16px 0;
    }

    .footer-inner {
        flex-direction: column;
        gap: 10px;
    }

    .site-footer div div {
        gap: 18px;
    }
}

/* Mobile slide menu shared by all pages */
@media (max-width: 760px) {
    .desktop-nav { position: fixed; z-index: 100; top: 0; right: -290px; width: 280px; height: 100vh; padding: 85px 26px 30px; display: flex; flex-direction: column; align-items: stretch; gap: 5px; box-shadow: -12px 0 28px rgba(4,18,38,.16); background: #fff; transition: right .35s ease; }
    .mobile-menu-open .desktop-nav { right: 0; }
    .desktop-nav > a, .desktop-nav .nav-dropdown-toggle { width: 100%; padding: 12px 4px; color: var(--black-color); font-size: 14px; text-align: left; }
    .desktop-nav .contact-btn { margin-top: 12px; color: var(--white-color)!important; text-align: center; }
    .desktop-nav .nav-dropdown-menu { position: static; width: 100%; margin-top: 0; box-shadow: none; transform: none; }
    .desktop-nav .nav-dropdown-menu a { padding-left: 15px; }
    .menu-toggle { display: block; position: relative; z-index: 101; }
    .mobile-menu-open { overflow: hidden; }
}

@media (max-width: 430px) {
    .brand {
        font-size: 18px;
    }

    .brand-mark {
        width: 27px;
        height: 27px;
    }

    .signup-card {
        margin: 0 -4px;
        padding: 22px 17px;
    }

    h1 {
        font-size: 34px;
    }

    .form-row {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .benefit-list {
        grid-template-columns: 1fr;
    }

    .benefit {
        display: flex;
        gap: 15px;
        padding: 12px 2px;
        border-bottom: 1px solid #e9ebef;
    }

    .benefit:last-child {
        border-bottom: 0;
    }

    .benefit-icon {
        margin: 0;
    }

    .site-footer div div {
        gap: 12px;
    }

    .site-footer p,
    .site-footer a {
        font-size: 9px;
    }
}

@media (max-width: 430px) {
    .welcome-main {
        padding: 35px 16px 25px;
    }

    .login-card {
        padding: 22px 20px 30px;
    }

    .stat-list {
        grid-template-columns: 1fr;
        margin-top: 35px;
    }

    .stat-list article {
        min-height: 64px;
        justify-content: flex-start;
        padding-left: 25%;
    }

    .stat-list article:not(:last-child) {
        border-bottom: 1px solid rgba(151, 170, 198, .13);
    }
}
