/* ===================================================================
   PORTAL DE TURISMO MUNICIPAL
   Archivo:
      css/turismo/responsive.css

   Responsive (PC First)
   ---------------------------------------------------------------
   Resoluciones:

   ≤ 1400px
   ≤ 1200px
   ≤ 992px
   ≤ 768px
   ≤ 576px

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


/*==============================================================
=
= 1400 px
=
==============================================================*/

@media (max-width:1400px){

#ttm-portal .ttm-container{

    width:min(100% - 50px,1200px);

}

#ttm-portal .ttm-hero{

    min-height:650px;

}

#ttm-portal .ttm-grid{

    gap:22px;

}

}



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

@media (max-width:1200px){

#ttm-portal .ttm-grid{

    grid-template-columns:

        repeat(2,1fr);

}

#ttm-portal .ttm-hero{

    min-height:620px;

}

#ttm-portal .ttm-hero-content{

    max-width:620px;

}

#ttm-portal .ttm-card img{

    height:320px;

}

}



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

@media (max-width:992px){

#ttm-portal .ttm-container{

    width:min(100% - 40px,100%);

}

#ttm-portal .ttm-hero{

    min-height:580px;

}

#ttm-portal .ttm-hero-content{

    padding:70px 0;

}

#ttm-portal .ttm-hero-content h1{

    font-size:3.3rem;

}

#ttm-portal .ttm-hero-content p{

    font-size:1.05rem;

}

#ttm-portal .ttm-grid{

    gap:20px;

}

#ttm-portal .ttm-card img{

    height:290px;

}

#ttm-portal .ttm-icon{

    width:58px;

    height:58px;

}

}



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

@media (max-width:768px){

#ttm-portal .ttm-container{

    width:min(100% - 30px,100%);

}

#ttm-portal .ttm-hero{

    min-height:520px;

    text-align:center;

}

#ttm-portal .ttm-hero-content{

    max-width:100%;

}

#ttm-portal .ttm-pretitle{

    letter-spacing:2px;

}

#ttm-portal .ttm-hero-content h1{

    font-size:2.6rem;

}

#ttm-portal .ttm-hero-content p{

    margin-inline:auto;

}

#ttm-portal .ttm-grid{

    grid-template-columns:1fr;

}

#ttm-portal .ttm-card img{

    height:340px;

}

#ttm-portal .ttm-arrow{

    opacity:1;

    transform:none;

}

}



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

@media (max-width:576px){

#ttm-portal .ttm-container{

    width:min(100% - 20px,100%);

}

#ttm-portal .ttm-hero{

    min-height:470px;

}

#ttm-portal .ttm-hero-content{

    padding:55px 0;

}

#ttm-portal .ttm-pretitle{

    font-size:.75rem;

}

#ttm-portal .ttm-hero-content h1{

    font-size:2.1rem;

    letter-spacing:-1px;

}

#ttm-portal .ttm-hero-content p{

    font-size:.95rem;

    line-height:1.7;

}

#ttm-portal .ttm-button{

    width:100%;

    justify-content:center;

}

#ttm-portal .ttm-card img{

    height:280px;

}

#ttm-portal .ttm-card-content{

    left:20px;

    right:20px;

    bottom:20px;

}

#ttm-portal .ttm-card-content h2{

    font-size:1.4rem;

}

#ttm-portal .ttm-card-content p{

    font-size:.90rem;

}

#ttm-portal .ttm-icon{

    width:52px;

    height:52px;

    font-size:1.25rem;

}

#ttm-portal .ttm-arrow{

    width:42px;

    height:42px;

}

}



/*==============================================================
=
= EXTRA SMALL
=
==============================================================*/

@media (max-width:380px){

#ttm-portal .ttm-hero-content h1{

    font-size:1.8rem;

}

#ttm-portal .ttm-card img{

    height:240px;

}

#ttm-portal .ttm-card-content{

    left:18px;

    right:18px;

}

#ttm-portal .ttm-card-content h2{

    font-size:1.25rem;

}

}



/*==============================================================
=
= LANDSCAPE
=
==============================================================*/

@media (max-height:650px) and (orientation:landscape){

#ttm-portal .ttm-hero{

    min-height:100vh;

}

#ttm-portal .ttm-hero-content{

    padding:50px 0;

}

}



/*==============================================================
=
= IMPRESIÓN
=
==============================================================*/

@media print{

#ttm-portal .ttm-button{

    display:none;

}

#ttm-portal .ttm-grid{

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

}

}



/*==============================================================
=
= FIN DEL ARCHIVO
=
==============================================================*/