* {
    box-sizing: border-box;
}

body {
    background-color: #1a1a1a;
    /* Tema escuro */
    font-family: 'Arial', sans-serif;
    margin: 0;
    padding: 20px;
    box-sizing: border-box;
    justify-content: center;
    display: flex;
    flex-direction: column;
    align-items: center;

}

.news {
    background-image: linear-gradient(to right, #001956, #0a2467, #143079, #1d3c8c, #25499f, #214a9e, #1d4c9c, #194d9b, #0b4385, #01386f, #002e5a, #002446);
    width: 100vw;
    margin: 0;
    padding-top: 6pt;
    box-sizing: border-box;
    margin-bottom: 10pt;
}

.news h1 {
    margin: 0;
}

.back-news {
    background-color: #0a0a0a;
    box-shadow: 0 0 10pt black;
    width: 100vw;
    margin: 0;
    padding: 10pt;
    padding-inline: 20pt;
}

.back-news .product-card {
    margin: 10pt;
}

.catalog-wrapper {
    width: 80vw;
    overflow-x: auto;
    /* Permite rolagem horizontal */
    -webkit-overflow-scrolling: touch;
    /* Suaviza rolagem no mobile */
}

.catalog-container {
    display: flex;
    flex-direction: row;
    gap: 16px;
    /* Espaço entre os cards */
    padding: 10px 0;
    width: 100%;
    /* Garante que o conteúdo flex possa ultrapassar o wrapper */
    user-select: none;
}

.product-card {
    background-color: #2c2c2c;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
    overflow: hidden;
    width: 80pt;
    color: #f0f0f0;
    transition: transform 0.3s ease;
    flex-shrink: 0;
    /* Impede o card de encolher */
}

.product-card:hover {
    transform: translateY(-5px);
}

.product-card img {
    width: 100%;
    height: 60pt;
    object-fit: cover;
    /* Garante que a imagem cubra o espaço sem distorcer */
    display: block;
    /* Remove espaço extra abaixo da imagem */
}

.product-info {
    padding: 4pt;
}

h1 {
    color: white;
    margin-top: 6pt;
    margin-bottom: 0;
    width: 80vw;
    text-align: left;
    text-transform: uppercase;
}

.product-info h3 {
    margin: 0;
    font-size: 0.8em;
    color: white;
    /* Detalhe em Dodger Blue */
}

.product-info .model {
    font-size: 0.5em;
    margin: 0;
    margin-top: 2pt;
    color: #b0b0b0;
    /* Cor mais suave para o modelo */
}

.product-info .price {
    margin: 0;
    margin-top: 2pt;
    font-size: 0.8em;
    font-weight: bold;
    color: white;
    /* Detalhe em Dodger Blue */
}