/* ==========================================
   DESKTOP / LAPTOP (до 1200px)
   ========================================== */
@media (max-width: 1200px) {
    .container {
        max-width: 960px;
    }

    .hero__title {
        font-size: 3rem;
    }

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

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

/* ==========================================
   TABLET (до 992px)
   ========================================== */
@media (max-width: 992px) {
    .container {
        max-width: 720px;
    }

    .section {
        padding: 80px 0;
    }

    .hero__container {
        grid-template-columns: 1fr;
        gap: 40px;
        text-align: center;
    }

    .hero__description {
        margin: 0 auto 36px auto;
    }

    .hero__actions {
        justify-content: center;
    }

    .hero__visual {
        max-width: 500px;
        margin: 0 auto;
        width: 100%;
    }

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

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

/* ==========================================
   MOBILE & SMALL TABLET (до 768px)
   ========================================== */
@media (max-width: 768px) {
    .container {
        max-width: 540px;
    }

    .header__btn {
        display: none;
    }

    .burger {
        display: flex;
        z-index: 1001;
    }

    /* Мобильное меню */
    .nav {
        position: fixed;
        top: 0;
        right: -100%;
        width: 100%;
        height: 100vh;
        background: var(--bg-dark);
        display: flex;
        align-items: center;
        justify-content: center;
        transition: right 0.3s ease-in-out;
        z-index: 1000;
    }

    .nav.is-active {
        right: 0;
    }

    .nav__list {
        flex-direction: column;
        align-items: center;
        gap: 24px;
    }

    .nav__link {
        font-size: 1.25rem;
    }

    /* Анимация бургера */
    .burger.is-active span:nth-child(1) {
        transform: translateY(8px) rotate(45deg);
    }

    .burger.is-active span:nth-child(2) {
        opacity: 0;
    }

    .burger.is-active span:nth-child(3) {
        transform: translateY(-8px) rotate(-45deg);
    }

    .hero {
        padding: 130px 0 60px 0;
    }

    .hero__title {
        font-size: 2.25rem;
    }

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

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

    .calc-checkboxes {
        grid-template-columns: 1fr;
    }

    .calculator__wrapper {
        padding: 24px;
    }
}

/* ==========================================
   SMALL MOBILE (до 576px)
   ========================================== */
@media (max-width: 576px) {
    .section {
        padding: 60px 0;
    }

    .section__title {
        font-size: 1.75rem;
    }

    .hero__title {
        font-size: 1.85rem;
    }

    .hero__actions {
        flex-direction: column;
        width: 100%;
    }

    .hero__actions .btn {
        width: 100%;
    }

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

    .calc-result__price {
        font-size: 2rem;
    }

    .about__content {
        padding: 24px;
    }
}