/* ═══════════════════════════════════════════════
   ADELIS THEME — responsive.css
   ───────────────────────────────────────────────
   БРЕЙКПОИНТЫ:
   — Tablet:       ≤ 1024px
   — Mobile:       ≤ 835px   (только footer)
   — Mobile:       ≤ 768px
   — Small Mobile: ≤ 480px
   ═══════════════════════════════════════════════ */


/* ─────────────────────────────────────────────────
   TABLET (≤ 1024px)
   ───────────────────────────────────────────────── */
@media (max-width: 1024px) {

    /* ── Общее ── */
    :root {
        --section-py: 60px;
    }

    /* ── Header ── */
    .site-header .container {
        padding: 24px 20px;
    }

    /* ── Hero ── */
    .hero {
        padding: 0;
    }

    .hero .container {
        grid-template-columns: 1fr;
        gap: 24px;
        padding: 40px 20px 0;
    }

    .hero__content {
        order: 1;
        display: flex;
        flex-direction: column;
        gap: 16px;
    }

    .hero__image {
        order: 2;
    }

    .hero__cta {
        display: block;
        order: 3;
    }

    .hero__cta .btn {
        width: 100%;
    }

    .hero__content .btn {
        display: none;
    }

    .hero__minsubtitle,
    .hero__title,
    .hero__subtitle {
        margin-bottom: 0;
    }

    /* ── Services Preview (Чому обирають нас) ── */
    .services-preview .container {
        padding: 60px 20px;
    }

    .services-preview .container .section__title {
        margin-bottom: 24px;
    }

    .service-card {
        padding: 12px;
    }

    .service-card__icon {
        width: 60px;
    }

    .why-us .container {
        padding: 0 20px;
    }

    /* ── Our Services ── */
    .our-services .container {
        padding: 60px 20px;
    }

    .our-services .container .section__title {
        margin-bottom: 16px;
    }

    .our-services .container .section__title-description {
        margin-bottom: 24px;
    }

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

    .our-service-card {
        padding: 24px;
    }

    .our-service-card__title {
        margin-bottom: 12px;
    }

    .our-services-list {
        margin-bottom: 20px;
    }

    /* ── Studio ── */
    .studio .container {
        padding: 60px 20px;
    }

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

    .studio__item--1,
    .studio__item--6 {
        grid-column: span 2;
    }

    .studio__item--2,
    .studio__item--3,
    .studio__item--4,
    .studio__item--5 {
        grid-column: span 1;
    }

    /* ── Map ── */
    .map-section .container {
        padding: 60px 20px;
    }

    .map-section__title {
        margin-bottom: 24px;
    }

    /* ── Contacts ── */
    .contacts .container {
        padding: 60px 20px;
    }

    .contacts__grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .contacts__title {
        margin-bottom: 16px;
    }

    .contacts__subtitle {
        margin-bottom: 30px;
    }

    /*---- Reviews ----*/
    .reviews .container {
        padding: 0 20px 120px;
    }

    /* ── Footer ── */
    .site-footer .container {
        padding: 60px 20px 20px;
    }

    /* ── Про нас ── */
    .about-hero .container {
        padding: 40px 20px 24px;
    }

    .about-hero__header {
        margin-bottom: 24px;
    }

    .about-hero__title {
        margin-bottom: 16px;
    }

    .about-hero__subtitle {
        max-width: 100%;
    }

    /* ── Наша команда ── */
    .team .container {
        padding: 60px 20px;
    }

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

    .team-card {
        padding: 20px;
    }

    .team-card__photo {
        margin-bottom: 16px;
    }

    .team-card__name {
        margin-bottom: 8px;
    }

    .team-card__role {
        margin-bottom: 20px;
    }

    .team-card__btn:hover {
        opacity: 1;
    }

    /* ── Послуги ── */
    .services-page .container {
        padding: 60px 20px;
    }

    .services-page__header {
        margin-bottom: 24px;
    }

    .services-page__title {
        margin-bottom: 16px;
    }

    .service-item {
        grid-template-columns: 1fr;
        gap: 30px;
        margin-bottom: 40px;
    }

    .service-item__title {
        margin-bottom: 12px;
    }

    .service-item__desc {
        gap: 12px;
        margin-bottom: 12px;
        max-width: 100%;
    }

    .service-item__points {
        padding: 0;
        margin: 0 0 20px;
        gap: 10px;
    }

    /* На планшете фото всегда сверху */
    .service-item--reversed .service-item__photo {
        order: 0;
    }

    .service-item--reversed .service-item__content {
        order: 0;
    }

    .service-item__photo img {
        height: 360px;
    }

    /* ── Прайс ── */
    .price-page .container {
        padding: 40px 20px 0;
    }

    .price-page__title {
        margin-bottom: 24px;
    }

    .price-group {
        max-width: 100%;
        margin-bottom: 0;
    }

    .price-group__badge {
        margin-bottom: 12px;
    }


}


/* ─────────────────────────────────────────────────
   MOBILE FOOTER (≤ 835px)
   ───────────────────────────────────────────────── */
@media (max-width: 835px) {

    .site-footer__reserved {
        display: none;
    }

    .site-footer__reserved-mobile {
        display: flex;
        margin-top: 40px;
    }
}


/* ─────────────────────────────────────────────────
   MOBILE (≤ 768px)
   ───────────────────────────────────────────────── */
@media (max-width: 768px) {

    /* ── Общее ── */
    :root {
        --section-py: 48px;
    }

    /* ── Header ── */
    .site-header .container {
        padding: 12px 20px;
        border-bottom: 1px solid var(--background);
        height: 53px;
    }

    .header-phone {
        display: none;
    }

    /* Мобильное меню */
    .site-header__nav {
        display: flex;
        flex-direction: column;
        align-items: center;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
        min-height: 100%;
        background: var(--white);
        z-index: 999;
        padding: 113px 0 0;
        overflow: hidden;
        transform: translateY(-100%);
        opacity: 0;
        visibility: hidden;
        transition: transform 0.4s ease, opacity 0.3s ease, visibility 0.4s ease;
    }

    .site-header__nav.is-open {
        transform: translateY(0);
        opacity: 1;
        visibility: visible;
    }

    .nav-close {
        display: flex;
        position: absolute;
        top: 9px;
        right: 16px;
        background: none;
        border: none;
        cursor: pointer;
        padding: 8px;
        align-items: center;
        justify-content: center;
    }

    .nav-menu {
        flex-direction: column;
        gap: 50px;
    }

    .nav-menu a {
        font-size: 18px;
        text-align: center;
    }

    .site-header__burger {
        display: flex;
    }

    /* ── Services Preview ── */
    .services-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    .service-card-header {
        display: flex;
        align-items: center;
        gap: 6px;
        margin-bottom: 12px;
    }

    .service-card__icon {
        width: 40px;
        margin-bottom: 0;
    }

    /* ── Our Services ── */
    .our-services-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    /* ── Studio ── */
    .studio__header {
        margin-bottom: 24px;
    }

    .studio__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    .studio__item--1,
    .studio__item--2,
    .studio__item--3,
    .studio__item--4,
    .studio__item--5,
    .studio__item--6 {
        height: 250px;
    }

    /* ── Reviews ── */
    .reviews {
        overflow: hidden;
    }

    .reviews .container {
        overflow: visible;
        padding-left: 0;
        padding: 0 70px 60px 0;
    }

    .reviews__title {
        margin-left: 20px;
    }


    .reviews__slider .slick-list {
        overflow: visible !important;
        padding-left: 18px !important;
    }

    .review-card {
        margin-right: 10px;
    }

    .slick-dots {
        position: static !important;
    }

    /* ── Contacts ── */
    .contact-form__submit {
        width: 100%;
    }

    /* ── Footer ── */
    .site-footer__flex {
        flex-direction: column;
        gap: 40px;
    }

    .site-footer__about {
        display: flex;
        flex-direction: column;
    }

    .footer-logo {
        margin-bottom: 16px;
    }

    .site-footer__desc {
        max-width: 100%;
        margin-bottom: 0;
    }

    .site-footer__right {
        flex-direction: column;
        gap: 30px;
        max-width: 100%;
    }

    .site-footer__reserved-mobile {
        display: flex;
        margin-top: 0;
    }

    /* ── Про нас: переупорядочиваем сетку ── */
    .about-hero__grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto auto auto;
        gap: 12px;
    }

    /* Строка 1: два маленьких фото рядом */
    .about-hero__small-photo--1 {
        grid-column: 1 / 2;
        grid-row: 1;
    }

    .about-hero__small-photo--3 {
        grid-column: 2 / 3;
        grid-row: 1;
        display: block;
    }

    /* Строка 2: текст на всю ширину */
    .about-hero__text {
        grid-column: 1 / 3;
        grid-row: 2;
        margin-left: 0;
        gap: 12px;
    }

    /* Строка 3: главное фото на всю ширину */
    .about-hero__main-photo {
        grid-column: 1 / 3;
        grid-row: 3;
        margin-right: 0;
    }

    /* Скрываем среднее маленькое фото */
    .about-hero__small-photo--2 {
        display: none;
    }

    .about-hero__small-photo img {
        height: 180px;
    }

    .about-hero__main-photo img {
        height: 280px;
    }

    /* ── Наша команда ── */
    .team__grid {
        grid-template-columns: 1fr;
    }

    /* ── Послуги ── */
    .service-item__photo img {
        height: 260px;
    }

    /* ── Прайс ── */
    .price-group__card {
        padding: 20px;
        gap: 20px;
    }

    .price-row {
        padding: 0 0 20px;
    }
}

/* ─────────────────────────────────────────────────
   SMALL MOBILE (≤ 600px)
   ───────────────────────────────────────────────── */
@media (max-width: 600px) {
    .reviews__slider .slick-dots {
        margin-top: 30px;
    }
}


/* ─────────────────────────────────────────────────
   SMALL MOBILE (≤ 480px)
   ───────────────────────────────────────────────── */
@media (max-width: 480px) {

    /* ── Общее ── */
    :root {
        --section-py: 40px;
    }

    /* ── Hero ── */
    .hero__subtitle {
        font-size: 16px;
    }

    /* ── Кнопки ── */
    .btn {
        width: 100%;
        justify-content: center;
    }

    /* ── Map ── */
    .map-section__embed iframe {
        min-height: 595px !important;
        height: 100%;
    }

    /* ── Studio ── */
    .studio__item--1,
    .studio__item--2,
    .studio__item--3,
    .studio__item--4,
    .studio__item--5,
    .studio__item--6 {
        height: 180px;
    }

    /* ── About hero ── */
    .about-hero__small-photo img {
        height: 140px;
    }

    .about-hero__main-photo img {
        height: 220px;
    }
    
    .reviews__slider .slick-dots {
        margin-top: 0;
    }
}

@media (max-width: 390px) {
    .reviews__slider .slick-dots {
        margin-top: 30px;
    }
}