/* ========================================
   STYLE.CSS
   ======================================== */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    background-color: var(--fondo-general) !important;
    font-family: var(--fuente-principal) !important;
    overflow-x: hidden !important;
    color: var(--texto-principal);
    padding-top: 154px !important; 
}

/* PADDING-TOP DEL BODY */
@media (min-width: 1920px) {
    body { 
        padding-top: 154px !important; 
    }
}

@media (max-width: 1366px) and (min-width: 993px) {
    body { padding-top: 142px !important; }
}

@media (max-width: 992px) and (min-width: 769px) {
    body { padding-top: 100px !important; }
}

@media (max-width: 768px) {
    body { padding-top: 76px !important; }
}

/* ========================================
   SCROLL SUAVE
   ======================================== */
html {
    scroll-behavior: smooth;
}

/* ========================================
   CONTENEDOR PRINCIPAL
   ======================================== */
.index-container {
    max-width: 1475px;
    width: 100%;
    padding-right: 20px;
    padding-left: 20px;
    margin-right: auto;
    margin-left: auto;
}

/* Ajustes responsive para el contenedor principal */
@media (max-width: 1400px) {
    .index-container {
        max-width: 95%;
        padding-right: 15px;
        padding-left: 15px;
    }
}

@media (max-width: 992px) {
    .index-container {
        max-width: 100%;
        padding-right: 15px;
        padding-left: 15px;
    }
}

/* ========================================
   ETIQUETAS DE PRODUCTO (NUEVO / PRÓXIMAMENTE)
   ======================================== */
.product-etiqueta {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 3;
    padding: 4px 12px;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-radius: var(--radio-pill);
    pointer-events: none;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}

.product-etiqueta.nuevo {
    background-color: var(--azul-industrial);
    color: var(--texto-principal);
}

.product-etiqueta.proximamente {
    background-color: var(--azul-industrial);
    color: var(--texto-principal);
}

/* Para cuando la etiqueta está dentro de la info del producto (ej: nuevos lanzamientos) */
.nuevo-lanzamiento-info .product-etiqueta {
    position: static;
    display: inline-block;
    margin-top: 8px;
}

/* ========================================
   CARRUSEL
   ======================================== */
.carrusel-keyframes {
    position: relative;
    width: 100%;
    height: 600px;
    overflow: hidden;
    margin-top: 0;
    margin-bottom: 100px !important;
}

/* Alturas del carrusel por resolución */
@media (min-width: 1920px) {
    .carrusel-keyframes { height: 650px; }
}

@media (max-width: 1366px) and (min-width: 993px) {
    .carrusel-keyframes { height: 550px; }
}

@media (max-width: 992px) and (min-width: 769px) {
    .carrusel-keyframes { height: 450px; }
}

@media (max-width: 768px) {
    .carrusel-keyframes { height: 300px; }
}

/* ========================================
   SECCIONES
   ======================================== */
.seccion-categorias,
.seccion-destacados,
.nuevo-lanzamiento-section,
.seccion-nosotros {
    background: transparent !important;
    border-radius: var(--radio-lg);
    box-shadow: none !important;
    width: 100%;
    margin: 60px 0 !important;
}

/* Paddings específicos de cada sección */
.seccion-categorias { padding: 20px 30px; }
.seccion-destacados { padding: 25px 30px 15px 30px; }
.nuevo-lanzamiento-section { padding: 15px 30px 2px 30px; }
.seccion-nosotros { padding: 40px 30px; }

/* ========================================
   SECCIÓN REDES SOCIALES
   ======================================== */
.seccion-redes {
    padding: 40px 0 60px;
    background: transparent;
    margin: 20px 0 40px !important;
}

.nuevo-lanzamiento-section .slick-dots,
.seccion-destacados .slick-dots {
    display: none !important;
}

/* ========================================
   AJUSTE DE FLECHAS SLICK EN NUEVO LANZAMIENTO
   ======================================== */
.nuevo-lanzamiento-section .slick-prev,
.nuevo-lanzamiento-section .slick-next {
    width: 40px;
    height: 40px;
    background-color: var(--azul-industrial) !important;
    border-radius: 50% !important;
    z-index: 10;
    top: 50% !important;
    transform: translateY(-50%);
}

.nuevo-lanzamiento-section .slick-prev {
    left: -20px;
}

.nuevo-lanzamiento-section .slick-next {
    right: -20px;
}

.nuevo-lanzamiento-section .slick-prev:hover,
.nuevo-lanzamiento-section .slick-next:hover {
    background-color: var(--azul-industrial-oscuro) !important;
}

.nuevo-lanzamiento-section .slick-prev::before,
.nuevo-lanzamiento-section .slick-next::before {
    color: var(--texto-blanco) !important;
    font-size: 20px;
    opacity: 1;
}

/* ========================================
   AJUSTE DE FLECHAS SLICK EN PRODUCTOS DESTACADOS
   ======================================== */
.seccion-destacados .slick-prev,
.seccion-destacados .slick-next {
    width: 40px;
    height: 40px;
    background-color: var(--texto-principal) !important;
    border-radius: 50% !important;
    z-index: 10;
    top: 40% !important;
    transform: translateY(-50%);
}

.seccion-destacados .slick-prev {
    left: -20px;
}

.seccion-destacados .slick-next {
    right: -20px;
}

.seccion-destacados .slick-prev:hover,
.seccion-destacados .slick-next:hover {
    background-color: var(--azul-industrial-oscuro) !important;
}

.seccion-destacados .slick-prev::before,
.seccion-destacados .slick-next::before {
    color: var(--texto-blanco) !important;
    font-size: 20px;
    opacity: 1;
}

/* RESPONSIVE PARA FLECHAS */
@media (max-width: 768px) {
    .nuevo-lanzamiento-section .slick-prev,
    .nuevo-lanzamiento-section .slick-next,
    .seccion-destacados .slick-prev,
    .seccion-destacados .slick-next {
        width: 35px;
        height: 35px;
    }
    
    .nuevo-lanzamiento-section .slick-prev,
    .seccion-destacados .slick-prev {
        left: -10px;
    }
    
    .nuevo-lanzamiento-section .slick-next,
    .seccion-destacados .slick-next {
        right: -10px;
    }
}

/* ========================================
   CATEGORÍAS
   ======================================== */
.categorias-titulo { margin: 0 0 25px 0 !important; }
.categorias-grid { 
    margin-bottom: 0; 
    row-gap: 0 !important;
}

.row.g-4.categorias-grid { 
    --bs-gutter-x: 0.3rem !important; 
    --bs-gutter-y: 0.3rem !important;  
}

/* Estilo base de la tarjeta */
.categoria-card {
    position: relative;
    overflow: hidden;
    background: var(--fondo-elevado);
    padding: 6.5rem 1.2rem;
    text-align: center;
    border: none;
    box-shadow: var(--sombra-suave);
    height: 100%;
    text-decoration: none;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    transition: box-shadow 0.3s ease;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* ========================================
   CATEGORÍAS
   ======================================== */
.categorias-titulo { margin: 0 0 25px 0 !important; }
.categorias-grid { 
    margin-bottom: 0; 
    row-gap: 0 !important;
}

.row.g-4.categorias-grid { 
    --bs-gutter-x: 0.3rem !important; 
    --bs-gutter-y: 0.3rem !important;  
}

/* Contenedor con bordes redondeados en las 4 esquinas */
.categorias-contenedor-redondeado {
    border-radius: var(--radio-lg);
    overflow: hidden;
}

.categoria-card {
    position: relative;
    border-radius: var(--radio-sm);
    overflow: hidden;
    background: var(--fondo-elevado);
    padding: 6.5rem 1.2rem;
    text-align: center;
    border: none;
    box-shadow: var(--sombra-suave);
    height: 100%;
    text-decoration: none;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    transition: box-shadow 0.3s ease;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.categoria-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.12);
    z-index: 1;
    transition: background 0.3s ease;
    border-radius: inherit;
}

.categoria-card:hover::before { background: rgba(0, 0, 0, 0.6); }
.categoria-card:hover { box-shadow: var(--sombra-fuerte); }

.categoria-card h3,
.categoria-card p {
    position: relative;
    z-index: 2;
    color: var(--texto-blanco);
    text-shadow: 2px 2px 4px rgba(0,0,0,0.9);
}

.categoria-card h3 {
    font-weight: 600;
    margin-bottom: 10px;
    font-size: 1.7rem;
    letter-spacing: -0.02em;
}

.categoria-card p {
    margin-bottom: 0;
    font-size: 1rem;
    font-weight: 700;
}

@media (max-width: 992px) and (min-width: 769px) {
    .categoria-card h3 { font-size: 1.5rem; }
    .categoria-card p { font-size: 0.9rem; }
}

@media (max-width: 768px) {
    .categoria-card { padding: 4.5rem 1rem; } 
    .categoria-card h3 { 
        font-size: 1.5rem;
        font-weight: 600;
    }
    .categoria-card p { font-size: 0.9rem; }
    .categorias-grid .col-sm-6 { width: 100%; flex: 0 0 100%; max-width: 100%; }
    .row.g-4.categorias-grid { --bs-gutter-x: 0.25rem !important; --bs-gutter-y: 0.25rem !important; }
}

@media (max-width: 576px) {
    .categoria-card { padding: 3.5rem 0.8rem; }
    .categoria-card h3 { 
        font-size: 1.4rem;
        font-weight: 600;
    }
    .categoria-card p { font-size: 0.85rem; }
}

/* ========================================
   SECCIÓN PRODUCTOS DESTACADOS
   ======================================== */
.destacados-titulo { margin: 0 0 25px 0 !important; }
.destacados-slider { margin: 0; }

.product-card {
    transition: box-shadow 0.3s ease;
    border-radius: var(--radio-md);
    overflow: hidden;
    background: var(--fondo-elevado);
    margin: 0 3px 10px 3px;
    text-decoration: none;
    display: block;
}

.product-card:hover {
    box-shadow: var(--sombra-suave);
}

.product-image-wrapper {
    position: relative;
    width: 100%;
    height: 200px;
    overflow: hidden;
    background: var(--fondo-elevado);
}

@media (max-width: 992px) and (min-width: 769px) {
    .product-image-wrapper { height: 180px; }
}

@media (max-width: 768px) {
    .product-image-wrapper { height: 160px; }
}

@media (max-width: 576px) {
    .product-image-wrapper { height: 180px; }
}

.product-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: opacity 0.4s ease;
}

.product-image-default { opacity: 1; z-index: 1; }
.product-image-hover { opacity: 0; z-index: 2; }
.product-card:hover .product-image-hover { opacity: 1; }
.product-card:hover .product-image-hover + .product-image-default,
.product-card:hover .product-image-hover ~ .product-image-default { opacity: 0; }

.product-info {
    padding: 8px 6px;
    text-align: left;
}

.product-title {
    color: var(--texto-principal);
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 3px;
    line-height: 1.2;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 32px;
    text-decoration: none;
}

.product-codigo {
    display: inline-block;
    color: var(--texto-principal);
    padding: 2px 6px;
    font-size: 0.9rem;
    font-weight: 500;
    letter-spacing: 0.3px;
}

/* ========================================
   TÍTULOS PRINCIPALES
   ======================================== */
.index-titulo {
    color: var(--texto-principal);
    font-size: 2rem;
    text-align: center;
    font-weight: 700;
    position: relative;
    padding-bottom: 0;
    margin-bottom: 15px;
}

.index-titulo::after {
    display: none;
}

.index-titulo i {
    color: var(--acero);
    margin-right: 8px;
    font-size: 1.7rem;
}

@media (max-width: 992px) and (min-width: 769px) {
    .index-titulo {
        font-size: 1.8rem;
        margin-bottom: 12px;
    }
}

@media (max-width: 768px) {
    .index-titulo {
        font-size: 1.7rem;
        font-weight: 700;
        margin-bottom: 10px;
    }
    .index-titulo i {
        font-size: 1.5rem;
        margin-right: 6px;
    }
    .seccion-categorias { padding: 35px 30px; }
    .seccion-destacados { padding: 45px 30px 25px; }
}

@media (max-width: 576px) {
    .index-titulo {
        font-size: 1.5rem;
        font-weight: 700;
        margin-bottom: 8px;
    }
    .index-titulo i {
        font-size: 1.3rem;
        margin-right: 5px;
    }
    .seccion-categorias { padding: 30px 20px; }
    .seccion-destacados { padding: 40px 20px 20px; }
}

/* ========================================
   SUBTÍTULOS DE SECCIONES
   ======================================== */
.subtitulo-seccion {
    text-align: center;
    margin-bottom: 30px;
    color: var(--texto-principal);
    font-size: 1.1rem;
    font-weight: 500;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

@media (max-width: 768px) {
    .subtitulo-seccion {
        font-size: 1rem;
        margin-bottom: 25px;
        padding: 0 15px;
    }
}

@media (max-width: 576px) {
    .subtitulo-seccion {
        font-size: 0.95rem;
        margin-bottom: 20px;
    }
}

/* ========================================
   BOTÓN VER TODOS
   ======================================== */
.btn-ver-todos-destacados {
    display: inline-block;
    padding: 14px 35px;
    color: var(--texto-principal);
    text-decoration: none;
    font-weight: 600;
    transition: var(--transicion-base);
    border-radius: var(--radio-3xl);
    border: 2px solid transparent;
    background: transparent;
    font-size: 1.1rem;
    box-shadow: none;
}

.btn-ver-todos-destacados:hover {
    color: var(--texto-principal);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.5);
    border-radius: var(--radio-3xl);
    background: transparent;
}

.btn-ver-todos-destacados i { transition: transform 0.3s ease; }
.btn-ver-todos-destacados:hover i { transform: translateX(5px); }

@media (max-width: 768px) {
    .btn-ver-todos-destacados { padding: 12px 25px; font-size: 1rem; }
}

@media (max-width: 576px) {
    .btn-ver-todos-destacados { padding: 10px 20px; font-size: 0.95rem; }
}

main:last-child { margin-bottom: 40px; }
@media (max-width: 768px) { main:last-child { margin-bottom: 30px; } }
@media (max-width: 576px) { main:last-child { margin-bottom: 20px; } }

/* ========================================
   NUEVOS LANZAMIENTOS
   ======================================== */
.nuevo-lanzamiento-slider { margin: 0 -10px; }
.nuevo-lanzamiento-slide { padding: 0 10px; }

.nuevo-lanzamiento-video-contenedor {
    width: 100%;
    margin: 0 auto;
}

.nuevo-lanzamiento-video {
    width: 100%;
    margin-bottom: 0;
}

.nuevo-lanzamiento-video video {
    width: 100%;
    height: auto;
    border-radius: var(--radio-lg);
    box-shadow: var(--sombra-fuerte);
    background: #000;
    display: block;
}

.nuevo-lanzamiento-video iframe {
    width: 100%;
    height: auto;
    min-height: 400px;
    border-radius: var(--radio-lg);
    box-shadow: var(--sombra-fuerte);
}

.nuevo-lanzamiento-espacio { 
    width: 100%; 
    height: 20px; 
}

.nuevo-lanzamiento-info-contenedor {
    width: 100%;
    margin: 0 auto;
}

.nuevo-lanzamiento-info {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 5px;
}

.nuevo-lanzamiento-codigo {
    display: inline-block;
    color: var(--texto-principal);
    padding: 8px 20px;
    font-size: 1.1rem;
    font-weight: 700;
    margin-bottom: 15px;
    letter-spacing: 0.5px;
}

.nuevo-lanzamiento-nombre {
    color: var(--texto-principal);
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 20px;
}

/* BOTÓN VER MÁS */
.nuevo-lanzamiento-boton {
    display: inline-block;
    padding: 14px 35px;
    color: var(--texto-principal);
    text-decoration: none;
    font-weight: 600;
    transition: var(--transicion-base);
    border-radius: var(--radio-3xl);
    box-shadow: none;
}

.nuevo-lanzamiento-boton:hover {
    color: var(--texto-principal);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
    border-radius: var(--radio-3xl);
}

.nuevo-lanzamiento-boton i { transition: transform 0.3s ease; }
.nuevo-lanzamiento-boton:hover i { transform: translateX(5px); }

@media (max-width: 992px) and (min-width: 769px) {
    .nuevo-lanzamiento-nombre { font-size: 1.7rem; }
    .nuevo-lanzamiento-video iframe { min-height: 300px; }
}

@media (max-width: 768px) {
    .nuevo-lanzamiento-espacio { height: 15px; }
    .nuevo-lanzamiento-nombre { 
        font-size: 1.6rem;
        font-weight: 700;
    }
    .nuevo-lanzamiento-info { padding: 30px 20px; }
    .nuevo-lanzamiento-video iframe { min-height: 250px; }
    .nuevo-lanzamiento-section { padding: 20px; }
}

@media (max-width: 576px) {
    .nuevo-lanzamiento-espacio { height: 10px; }
    .nuevo-lanzamiento-nombre { 
        font-size: 1.4rem;
        font-weight: 700;
    }
    .nuevo-lanzamiento-codigo { font-size: 1rem; padding: 6px 16px; }
    .nuevo-lanzamiento-boton { padding: 12px 25px; font-size: 0.9rem; }
    .nuevo-lanzamiento-info { padding: 20px 15px; }
    .nuevo-lanzamiento-video iframe { min-height: 200px; }
    .nuevo-lanzamiento-section { padding: 15px; }
}

/* ========================================
   SECCIÓN NOSOTROS
   ======================================== */
.seccion-nosotros {
    padding: 40px 5px;
    max-width: 100%;
}

.nosotros-contenido {
    max-width: 1600px;
    margin: 0 auto;
    padding: 0 20px;
    width: 100%;
}

.nosotros-contenido .row {
    margin-left: -15px;
    margin-right: -15px;
}

.nosotros-contenido .col-lg-6 {
    padding-left: 25px;
    padding-right: 25px;
}

.nosotros-titulo-wrapper {
    margin-bottom: 40px;
    text-align: left;
}

.nosotros-titulo {
    font-size: 2.2rem;
    font-weight: 700;
    color: var(--texto-principal);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 5px;
    line-height: 1.2;
}

.nosotros-subtitulo {
    font-size: 1rem;
    color: var(--texto-secundario);
    font-weight: 400;
    margin-bottom: 0;
    text-transform: uppercase;
    letter-spacing: 2px;
}

.nosotros-texto {
    font-family: var(--fuente-principal);
    line-height: 1.5 !important;
    color: var(--texto-principal);
    font-size: 1rem !important;
    text-align: justify;
    max-width: 700px;
}

.nosotros-imagen img {
    width: 100%;
    height: auto;
    border-radius: var(--radio-lg);
    box-shadow: var(--sombra-fuerte);
    transition: transform 0.3s ease;
    max-height: 500px;
    object-fit: cover;
}

/* Responsive para la sección más ancha */
@media (min-width: 1800px) {
    .nosotros-contenido {
        max-width: 1800px;
    }
    
    .nosotros-titulo {
        font-size: 2.5rem;
    }
    
    .nosotros-texto {
        font-size: 1rem !important;
        max-width: 800px;
    }
}

@media (max-width: 1400px) {
    .nosotros-contenido {
        max-width: 1400px;
    }
    
    .nosotros-titulo {
        font-size: 2rem;
    }
}

@media (max-width: 1200px) {
    .nosotros-contenido {
        max-width: 1200px;
    }
    
    .nosotros-titulo {
        font-size: 1.8rem;
    }
}

@media (max-width: 992px) and (min-width: 769px) {
    .seccion-nosotros {
        padding: 70px 25px;
    }
    
    .nosotros-titulo {
        font-size: 1.7rem;
    }
    
    .nosotros-texto {
        font-size: 0.85rem !important;
    }
    
    .nosotros-contenido .col-lg-6 {
        padding-left: 20px;
        padding-right: 20px;
    }
}

@media (max-width: 768px) {
    .seccion-nosotros {
        padding: 60px 20px;
    }
    
    .nosotros-titulo-wrapper {
        text-align: center;
        margin-bottom: 30px;
    }
    
    .nosotros-titulo {
        font-size: 1.6rem;
    }
    
    .nosotros-subtitulo {
        font-size: 0.9rem;
    }
    
    .nosotros-imagen {
        margin-top: 30px;
    }
    
    .nosotros-imagen img {
        max-height: 400px;
    }
    
    .nosotros-texto {
        font-size: 0.8rem !important;
        line-height: 1.5 !important;
        text-align: left;
        max-width: 100%;
    }
    
    .nosotros-contenido .col-lg-6 {
        padding-left: 15px;
        padding-right: 15px;
    }
}

@media (max-width: 576px) {
    .seccion-nosotros {
        padding: 50px 15px;
    }
    
    .nosotros-titulo {
        font-size: 1.4rem;
    }
    
    .nosotros-texto {
        font-size: 0.75rem !important;
    }
    
    .nosotros-imagen img {
        max-height: 300px;
    }
}

/* ========================================
   SECCIÓN REDES SOCIALES
   ======================================== */
.redes-contenido {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0;
    text-align: center;
}

.redes-titulo {
    font-size: 2rem;
    font-weight: 700;
    color: var(--texto-principal);
    margin-bottom: 40px;
    position: relative;
    display: inline-block;
    padding-bottom: 0;
}

.redes-titulo::after {
    display: none;
}

.redes-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    max-width: 900px;
    margin: 0 auto;
}

.red-item {
    background: var(--fondo-mas-elevado);
    border-radius: var(--radio-xl);
    padding: 30px 20px;
    transition: var(--transicion-base);
    border: 1px solid var(--borde-gris);
}

.red-item:hover {
    transform: translateY(-8px);
    box-shadow: var(--sombra-fuerte);
}

.red-item a {
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}

.red-icono {
    width: 80px;
    height: 80px;
    border-radius: var(--radio-circular);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.5rem;
    transition: var(--transicion-base);
    color: var(--texto-blanco);
}

.facebook .red-icono {
    background: var(--facebook-color);
    box-shadow: 0 10px 20px rgba(24, 119, 242, 0.3);
}

.facebook:hover .red-icono {
    background: #166fe5;
    transform: scale(1.1);
}

.instagram .red-icono {
    background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
    box-shadow: 0 10px 20px rgba(225, 48, 108, 0.3);
}

.instagram:hover .red-icono { transform: scale(1.1); }

.youtube .red-icono {
    background: #ff0000;
    box-shadow: 0 10px 20px rgba(255, 0, 0, 0.3);
}

.youtube:hover .red-icono {
    background: #e60000;
    transform: scale(1.1);
}

.red-nombre {
    font-size: 1.3rem;
    font-weight: 600;
    color: var(--texto-principal);
}

.red-usuario {
    font-size: 1rem;
    color: var(--texto-secundario);
    transition: color 0.3s ease;
}

@media (max-width: 992px) and (min-width: 769px) {
    .redes-grid { gap: 20px; }
    .red-icono { width: 70px; height: 70px; font-size: 2rem; }
    .red-nombre { font-size: 1.2rem; }
}

@media (max-width: 768px) {
    .seccion-redes { padding: 50px 20px 70px; }
    .redes-grid { grid-template-columns: 1fr; max-width: 350px; gap: 15px; }
    .red-item { padding: 20px; }
    .redes-titulo { 
        font-size: 1.8rem;
        font-weight: 700;
        margin-bottom: 30px; 
    }
}

@media (max-width: 576px) {
    .seccion-redes { padding: 40px 15px 60px; }
    .redes-titulo { 
        font-size: 1.6rem;
        font-weight: 700;
    }
    .red-icono { width: 60px; height: 60px; font-size: 1.8rem; }
    .red-nombre { font-size: 1.1rem; }
    .red-usuario { font-size: 0.9rem; }
}