@media (max-width: 600px) {
    .arch-home { --space: clamp(16px, 4.5vw, 24px); }

    .arch-home .arch-mast {
        grid-template-columns: minmax(0, 1fr);
        gap: 20px;
        padding: 28px var(--space) 26px;
    }

    .arch-home .arch-mast h1 {
        font-size: clamp(1.75rem, 8.2vw, 3rem);
        line-height: 1.06;
        letter-spacing: -.055em;
    }

    .arch-home .arch-mast-actions {
        margin-top: 16px;
        gap: 8px;
    }

    .arch-home .arch-mast-actions a {
        min-height: 44px;
        padding: 8px 13px;
        gap: 8px;
        font-size: .8rem;
    }

    .arch-home .arch-mast > img {
        grid-area: 2 / 1;
        width: 100%;
        height: auto;
        aspect-ratio: 16 / 10;
        object-fit: cover;
        object-position: center 52%;
        clip-path: polygon(0 0, 100% 0, 100% 86%, 90% 100%, 0 100%);
    }

    .arch-home #portfolio {
        padding-block: 24px 30px;
    }

    .arch-home #portfolio .arch-heading {
        gap: 8px 14px;
        margin-bottom: 12px;
    }

    .arch-home #portfolio .arch-heading h2 {
        font-size: clamp(1.65rem, 7vw, 2.15rem);
    }

    .arch-home #portfolio .arch-heading .arch-link {
        font-size: .76rem;
    }

    .arch-home #portfolio .arch-home-filters {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding: 4px 4px 8px;
        margin-bottom: 10px;
        scrollbar-width: thin;
        scrollbar-color: #d4aa7d #26201b;
    }

    .arch-home #portfolio .arch-home-filters a {
        flex: 0 0 auto;
        white-space: nowrap;
        min-height: 44px;
        padding-inline: 11px;
        font-size: .75rem;
    }
}