/* ==================================================
   CATÁLOGO - QUEIROZ RADIADORES
================================================== */

.catalogo{
    background:#050505;
    padding:90px 0;
}

.catalogo .container{
    width:90%;
    max-width:1300px;
    margin:0 auto;
}

/* ===============================
   TÍTULO
================================ */

.titulo-catalogo{
    text-align:center;
    margin-bottom:50px;
}

.titulo-catalogo h2{
    color:#FFFFFF;
    font-size:38px;
    font-weight:700;
    letter-spacing:2px;
    margin-bottom:15px;
    text-transform:uppercase;
}

.titulo-catalogo p{
    color:#CFCFCF;
    font-size:17px;
    max-width:700px;
    margin:auto;
    line-height:1.7;
}

/* ===============================
   GRID
================================ */

.catalogo-grid{

    display:grid;

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

    gap:30px;

}

/* ===============================
   CARD
================================ */

.produto{

    background:#111111;

    border:1px solid #2d2d2d;

    border-radius:16px;

    overflow:hidden;

    transition:.35s;

}

.produto:hover{

    transform:translateY(-8px);

    border-color:#E35336;

    box-shadow:0 18px 35px rgba(227,83,54,.20);

}

/* ===============================
   IMAGEM
================================ */

.produto img{

    width:100%;

    aspect-ratio:1/1;

    object-fit:cover;

    display:block;

    transition:.40s;

}

.produto:hover img{

    transform:scale(1.05);

}

/* ===============================
   NOME
================================ */

.produto h3{

    color:#FFFFFF;

    font-size:20px;

    font-weight:600;

    text-align:center;

    padding:22px 15px;

    margin:0;

}

/* ===============================
   TABLET
================================ */

@media (max-width:991px){

.catalogo-grid{

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

gap:22px;

}

.titulo-catalogo h2{

font-size:32px;

}

}

/* ===============================
   CELULAR
================================ */

@media (max-width:768px){

.catalogo{

padding:70px 0;

}

.catalogo-grid{

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

gap:18px;

}

.produto h3{

font-size:17px;

padding:18px 10px;

}

}

/* ===============================
   CELULAR PEQUENO
================================ */

@media (max-width:480px){

.catalogo-grid{

grid-template-columns:1fr;

}

.titulo-catalogo h2{

font-size:28px;

}

.titulo-catalogo p{

font-size:15px;

}

}