@media (max-width: 1080px) {
    .hero-grid,
    .split {
        grid-template-columns: 1fr;
    }

    .shell-admin {
        width: calc(100% - 18px);
    }
}

@media (max-width: 820px) {
    .shell,
    .shell-admin {
        width: calc(100% - 20px);
        padding: 16px 0 34px;
    }

    .split {
        grid-template-columns: 1fr;
    }

    .nav {
        align-items: flex-start;
        flex-direction: column;
        padding: 16px 18px;
        margin-bottom: 20px;
    }

    .hero,
    .panel-pad {
        padding: 22px 20px;
    }

    .card {
        padding: 18px;
    }

    .nav-links {
        width: 100%;
    }

    .field-inline {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    body.front-page .shell {
        width: calc(100% - 14px);
        padding: 10px 0 22px;
    }

    body.front-page .nav {
        gap: 12px;
        padding: 12px 14px;
        margin-bottom: 14px;
        border-radius: 22px;
    }

    body.front-page .brand h1 {
        font-size: 18px;
    }

    body.front-page .brand-title-pill {
        min-height: 36px;
        padding: 0 14px;
    }

    body.front-page .nav-links {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    body.front-page .nav-links a {
        display: flex;
        justify-content: center;
        padding: 10px 12px;
        font-size: 13px;
    }

    body.front-page .flash {
        padding: 10px 12px;
        margin-bottom: 12px;
        border-radius: 14px;
    }

    body.front-page .panel {
        border-radius: 24px;
    }

    body.front-page .panel-pad,
    body.front-page .hero {
        padding: 16px 14px;
    }

    body.front-page .card {
        padding: 14px;
        border-radius: 18px;
    }

    body.front-page .section-title h3,
    body.front-page .section-title h4 {
        font-size: 18px;
    }

    body.front-page .section-title p,
    body.front-page .page-note {
        font-size: 13px;
    }

    body.front-page input,
    body.front-page textarea,
    body.front-page select {
        padding: 11px 12px;
        border-radius: 14px;
        font-size: 14px;
    }

    body.front-page button,
    body.front-page .button {
        min-height: 42px;
        padding: 10px 14px;
        border-radius: 14px;
        font-size: 13px;
    }

    body.front-page .badge {
        padding: 6px 10px;
    }

    body.front-page .char-counter {
        display: none;
    }
}