/* ==========================================================================
   Responsive
   ========================================================================== */

/* Tablet: 768-1279px */
@media (max-width: 1279px) {
    :root {
        --container-padding: 24px;
    }

    h1 { font-size: 2rem; }
    h2 { font-size: 1.75rem; }

    .grid--4 { grid-template-columns: repeat(2, 1fr); }
    .grid--3 { grid-template-columns: repeat(2, 1fr); }

    .hero__title { font-size: 2.5rem; }

    .footer__grid {
        grid-template-columns: 1fr 1fr;
        gap: 32px;
    }

    .catalog__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .equipment-single__grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .solution-task__grid,
    .solution-case__grid,
    .solution-balancing__grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .solutions-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .related-equipment__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .solution-recommended__grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Mobile: <768px */
@media (max-width: 767px) {
    :root {
        --header-height: 60px;
        --container-padding: 16px;
    }

    h1 { font-size: 1.75rem; }
    h2 { font-size: 1.5rem; }
    h3 { font-size: 1.25rem; }

    .section {
        padding: 48px 0;
    }

    .section__subtitle {
        font-size: 1rem;
        margin-bottom: 32px;
    }

    .grid--2,
    .grid--3,
    .grid--4 {
        grid-template-columns: 1fr;
    }

    /* Header */
    .site-nav,
    .site-header__phone,
    .site-header__cta {
        display: none;
    }

    .burger {
        display: flex;
    }

    /* Hero */
    .hero {
        min-height: 75vh;
    }

    .hero--short {
        min-height: 40vh;
    }

    .hero--medium {
        min-height: 50vh;
    }

    .hero__title {
        font-size: 1.75rem;
    }

    .hero__subtitle {
        font-size: 1rem;
    }

    .hero__actions {
        flex-direction: column;
    }

    .hero__trust {
        flex-direction: column;
        gap: 16px;
    }

    .hero__scroll {
        display: none;
    }

    /* Footer */
    .footer__grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .footer__bottom {
        flex-direction: column;
        text-align: center;
    }

    .footer__bottom-left,
    .footer__bottom-right {
        justify-content: center;
    }

    /* Catalog */
    .catalog__grid {
        grid-template-columns: 1fr;
    }

    .catalog__grid--list .card-equipment {
        flex-direction: column;
    }

    .catalog__grid--list .card-equipment__image {
        width: 100%;
        padding-bottom: 60%;
        min-height: 0;
    }

    .catalog__filters {
        flex-direction: column;
    }

    .catalog__filter-group {
        min-width: 100%;
    }

    .catalog__toolbar {
        flex-direction: column;
        gap: 12px;
        align-items: stretch;
    }

    /* Solutions */
    .solutions-grid {
        grid-template-columns: 1fr;
    }

    .solution-recommended__grid {
        grid-template-columns: 1fr;
    }

    .related-equipment__grid {
        grid-template-columns: 1fr;
    }

    .solution-case__stats {
        grid-template-columns: 1fr;
    }

    /* Forms */
    .tz-form__row {
        grid-template-columns: 1fr;
    }

    /* Contacts page */
    .contacts-info-grid {
        grid-template-columns: 1fr;
    }

    /* Project single */
    .project-single__grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .project-stats-grid {
        grid-template-columns: 1fr;
    }

    .modal__content {
        padding: 24px;
    }

    /* Tables */
    .specs-table td:first-child {
        width: 40%;
    }

    .compatibility__table {
        font-size: 0.8rem;
    }

    .compatibility__filter input {
        width: 100%;
    }
}

/* Small mobile: <414px */
@media (max-width: 414px) {
    .hero__title {
        font-size: 1.5rem;
    }

    .btn--lg {
        padding: 14px 24px;
        font-size: 15px;
    }

    .card-equipment__specs {
        gap: 4px;
    }

    .card-equipment__spec {
        font-size: 0.7rem;
    }
}