/*====================================================
 responsive.css
 Mobile First - Fletes y Mudanzas García Hnos
====================================================*/

/* ---------- Tablets ---------- */
@media (max-width:1024px){

.container{
    width:min(94%,1200px);
}

.hero-grid,
.about-grid{
    grid-template-columns:1fr;
    gap:40px;
}

.hero{
    text-align:center;
}

.hero-actions{
    justify-content:center;
}

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

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

}

/* ---------- Celulares ---------- */
@media (max-width:768px){

header{
    height:72px;
}

.nav{
    height:72px;
}

.logo{
    height:46px;
}

.menu-toggle{
    display:block;
}

nav{
    position:absolute;
    top:72px;
    left:0;
    width:100%;
    background:#fff;
    display:none;
    flex-direction:column;
    padding:20px;
    box-shadow:0 10px 25px rgba(0,0,0,.08);
}

nav.active{
    display:flex;
}

nav a{
    padding:12px 0;
    border-bottom:1px solid #eee;
}

.hero{
    min-height:auto;
    padding:120px 0 70px;
}

.hero h1{
    font-size:2.4rem;
}

.hero p{
    font-size:1rem;
}

.hero-card{
    margin-top:20px;
}

.hero-actions{
    flex-direction:column;
}

.hero-actions .btn{
    width:100%;
}

.features,
.services-grid,
.stats-grid{
    grid-template-columns:1fr;
}

.section{
    padding:70px 0;
}

.section-title h2{
    font-size:2rem;
}

.placeholder{
    min-height:240px;
}

.whatsapp{
    width:58px;
    height:58px;
    right:18px;
    bottom:18px;
}

#toTop{
    right:18px !important;
    bottom:90px !important;
}

}

/* ---------- Pantallas pequeñas ---------- */
@media (max-width:480px){

body{
    font-size:15px;
}

.hero h1{
    font-size:2rem;
}

.badge{
    font-size:.8rem;
}

.feature,
.service-card{
    padding:20px;
}

.stats-grid h3{
    font-size:2.2rem;
}

footer{
    text-align:center;
}

}

@media(max-width:768px){

.service-img{
    height:180px;
}

}

.rating-score{
    width:100%;
    min-height:unset;
    height:auto;
    padding:40px 25px;
}

.google-reviews-btn{
    display:inline-flex;
    margin-top:25px;
}