/*====================================================
=              RESPONSIVE GENERAL                     =
====================================================*/

@media (max-width:1400px){

    .container,
    .header-container,
    .header-container-fluid{
        width:95%;
    }

}

/*====================================================*/

@media (max-width:1200px){

    .principal{
        grid-template-columns:300px 1fr;
        gap:25px;
    }

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

}

/*====================================================*/

@media (max-width:992px){

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

    .sidebar{
        display:none;
    }

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

    .titulo-seccion h2{
        font-size:32px;
    }

}

/*====================================================*/

@media (max-width:768px){

    body{
        overflow-x:hidden;
    }

    .cards{
        grid-template-columns:1fr;
        gap:20px;
    }

    .titulo-seccion{
        margin-bottom:25px;
    }

    .titulo-seccion h2{
        font-size:28px;
    }

    .titulo-seccion p{
        font-size:15px;
    }

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

    .footer-grid{
        grid-template-columns:1fr;
    }
    
    .iconoindex{
        display:grid;
        grid-template-columns:repeat(5,minmax(0,1fr));
        width:100%;
    }

    .iconosindex{
        min-width:0;
        padding:12px 3px;
    }

    .iconosindex i{
        font-size:17px;
    }

    .iconosindex p:last-child{
        font-size:9px;
        line-height:1.2;
        word-break:normal;
    }
    
     .card .precio{

        bottom:69px;

        left:1px;

        font-size:18px;

    }

    .card .precio-anterior{

        bottom:80px;

        left:18px;

        font-size:13px;

    }

    .card .prop-ubicacion{

        bottom:18px;

        left:18px;

        right:18px;

    }

}

/*====================================================*/

@media (max-width:576px){

    .container,
    .header-container,
    .header-container-fluid{
        width:94%;
    }

    .cards{
        gap:16px;
    }

    .c9-card{
        border-radius:14px;
    }

    .titulo-seccion h2{
        font-size:24px;
    }

    .titulo-seccion p{
        font-size:14px;
    }

    .btn,
    button{
        font-size:14px;
    }

}

/*====================================================*/

@media (max-width:420px){

    .container,
    .header-container,
    .header-container-fluid{
        width:92%;
    }

    .titulo-seccion h2{
        font-size:22px;
    }

    .titulo-seccion p{
        font-size:13px;
    }

}