/* ==========================================
   ?1200 px
========================================== */

@media (max-width:1200px){

    .hero__wrapper{

        gap:50px;

    }

    .statistics__grid{

        grid-template-columns:
            repeat(2,1fr);

    }

    .advantages__grid{

        grid-template-columns:
            repeat(2,1fr);

    }

}

/* ==========================================
   ?992 px
========================================== */

@media (max-width:992px){

    :root{

        --hero-padding-top:120px;

        --space-3xl:90px;

    }

    .navigation{

        display:none;

    }

    .burger{

        display:flex;

        align-items:center;

        justify-content:center;

    }

    .hero__wrapper{

        grid-template-columns:1fr;

        text-align:center;

    }

    .hero__content{

        order:2;

    }

    .hero__photo{

        order:1;

    }

    .hero__actions{

        justify-content:center;

    }

    .hero__features{

        max-width:600px;

        margin-inline:auto;

    }

    .about__grid,

    .results__grid,

    .contacts__grid,

    .formats__grid,

    .price__grid{

        grid-template-columns:1fr;

    }

    .footer__grid{

        grid-template-columns:1fr;

        text-align:center;

    }

    .cta__wrapper{

        flex-direction:column;

        text-align:center;

    }

}

/* ==========================================
   ?768 px
========================================== */

@media (max-width:768px){

    :root{

        --container-padding:18px;

        --space-3xl:72px;

    }

    h1{

        font-size:2.4rem;

    }

    h2{

        font-size:2rem;

    }
	
	.logo__image{

		width:46px;

		height:46px;

	}

    .statistics__grid{

        grid-template-columns:1fr;

    }

    .advantages__grid{

        grid-template-columns:1fr;

    }

    .reviews__slider{

        grid-template-columns:1fr;

    }

    .timeline__item{

        grid-template-columns:60px 1fr;

        gap:20px;

    }

    .timeline::before{

        left:29px;

    }

    .timeline__number{

        width:60px;

        height:60px;

        font-size:1.2rem;

    }

    .photo-card{

        max-width:420px;

        margin:auto;

    }

    .header .button{

        display:none;

    }

}

/* ==========================================
   ?576 px
========================================== */

@media (max-width:576px){

    :root{

        --button-height:52px;

        --space-3xl:60px;

    }

    body{

        font-size:.95rem;

    }

    h1{

        font-size:2rem;

    }

    h2{

        font-size:1.7rem;

    }

    h3{

        font-size:1.25rem;

    }

    .section-header{

        margin-bottom:50px;

    }

    .hero__actions{

        flex-direction:column;

        align-items:stretch;

    }

	 .hero__actions .button{

        white-space:normal;

        min-height:56px;

        line-height:1.35;

        padding:14px 20px;

    }
	
	.cta .button{

        min-width:100%;

    }
	
    .button{

        width:100%;

    }

    .stat-card,

    .format-card,

    .price-card,

    .advantage,

    .review-card,

    .result-card,

    .contacts__form{

        padding:24px;

    }

    .photo-card{

        padding:12px;

    }

    .photo-card__badge{

        right:10px;

        bottom:10px;

        font-size:.8rem;

        padding:10px 16px;

    }

    .faq__list summary{

        padding:20px;

        padding-right:48px;

    }

    .faq__list summary::after{

        right:18px;

    }

    .contacts__list{

        gap:10px;

    }

    .scroll-top{

        width:48px;

        height:48px;

        right:16px;

        bottom:16px;

    }

}

/* ==========================================
   VERY SMALL DEVICES
========================================== */

@media (max-width:480px){

    .logo__image{

		width:42px;

		height:42px;

	}
	
	.logo__subtitle{

        display:none;

    }

    h1{

        font-size:1.8rem;

    }

    .hero__label{

        font-size:.8rem;

    }

    .photo-card__badge{

        position:static;

        margin-top:14px;

        display:inline-flex;

    }

}