/* Paleta de colores:
#E394A7, #F1BBBB, #E6D8CB, #F5A3AF, #FECDD0, #F8AFB8
*/

* {
box-sizing: border-box;
margin: 0;
padding: 0;
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body {
background: linear-gradient(180deg, #FECDD0 0%, #E6D8CB 100%);
color: #4b2b35;
}

/* HEADER */

.main-header {
text-align: center;
padding: 2.5rem 1rem 2rem;
background: #E394A7;
color: #fff;
box-shadow: 0 3px 10px rgba(0, 0, 0, 0.12);
}

.main-header h1 {
font-size: 2.2rem;
letter-spacing: 0.08em;
text-transform: uppercase;
}

.main-header p {
margin-top: 0.6rem;
font-size: 0.95rem;
}

/* NAV */

.brand-nav {
display: flex;
justify-content: center;
gap: 1rem;
padding: 0.85rem 1rem;
background: #F1BBBB;
position: sticky;
top: 0;
z-index: 10;
}

.brand-nav a {
text-decoration: none;
padding: 0.4rem 0.9rem;
border-radius: 999px;
background: #F5A3AF;
color: #4b2b35;
font-size: 0.9rem;
font-weight: 600;
transition: background 0.2s ease, transform 0.1s ease;
}

.brand-nav a:hover {
background: #F8AFB8;
transform: translateY(-1px);
}

/* CONTENEDOR PRINCIPAL */

.container {
max-width: 1100px;
margin: 1.5rem auto 2.5rem;
padding: 0 1rem;
}

/* SECCIONES DE MARCA */

.brand-section {
margin-bottom: 2.5rem;
padding: 1.5rem 1rem 1.8rem;
background: rgba(255, 255, 255, 0.7);
border-radius: 18px;
border: 1px solid #F8AFB8;
box-shadow: 0 6px 18px rgba(0, 0, 0, 0.06);
}

.brand-section h2 {
margin-bottom: 1.2rem;
font-size: 1.4rem;
color: #4b2b35;
border-left: 6px solid #E394A7;
padding-left: 0.6rem;
}

/* GRID DE PRODUCTOS */

.product-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
gap: 1.4rem;
}


/* TARJETA DE PRODUCTO */

.product-card {
background: #FECDD0;
border-radius: 16px;
padding: 0.9rem;
border: 1px solid #F5A3AF;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.product-card:hover {
transform: translateY(-4px);
box-shadow: 0 8px 18px rgba(0, 0, 0, 0.12);
}

.product-card img {
width: 100%;
max-width: 230px;
border-radius: 12px;
object-fit: cover;
margin-bottom: 0.7rem;
}

.product-card h3 {
font-size: 1rem;
margin-bottom: 0.25rem;
color: #4b2b35;
}

.price {
font-weight: 700;
color: #E394A7;
margin-bottom: 0.4rem;
}

.status {
padding: 0.2rem 0.7rem;
border-radius: 999px;
font-size: 0.8rem;
font-weight: 600;
}

/* Estado disponible / agotado */

.status.available {
background: #E6D8CB;
color: #345c3e;
}

.status.soldout {
background: #F8AFB8;
color: #7a2333;
}

/* FOOTER */

.main-footer {
text-align: center;
padding: 1.2rem 1rem 1.8rem;
background: #E394A7;
color: #fff;
font-size: 0.9rem;
margin-top: 1rem;
}

/* RESPONSIVE */

@media (max-width: 600px) {
    .main-header h1 {
    font-size: 1.7rem;
}

.brand-nav {
    flex-wrap: wrap;
}

.brand-nav a {
    font-size: 0.8rem;
}
}