:root{
        --gray-0: #f3f4f6;
        --gray-1: #e5e7eb;
       }
       .main-content-salud {
            margin-top: 65px;
            padding: 0px 0 60px;
        }
        /* Header de la sección */
        .salud-header {
            background: linear-gradient(135deg, #010300, #009827);
            color: white;
            padding: 60px 0;
            text-align: center;
            margin-bottom: 50px;
        }
        .salud-header h1 {
            font-size: 3rem;
            font-weight: 700;
            margin-bottom: 20px;
        }
        .salud-header p {
            font-size: 1.2rem;
            opacity: 0.9;
            max-width: 600px;
            margin: 0 auto;
        }
        /* Artículo de la semana */
        .articulo-semana {
            background: #fff;
            border-radius: 20px;
            box-shadow: 0 10px 30px rgba(0,0,0,0.1);
            overflow: hidden;
            margin-bottom: 10px;
            position: relative;
        }
        .articulo-semana::before {
            content: 'ARTÍCULO DE LA SEMANA';
            position: absolute;
            top: 20px;
            right: 20px;
            background: linear-gradient(135deg, #02c100, #009030);
            color: white;
            padding: 8px 16px;
            border-radius: 20px;
            font-size: 0.8rem;
            font-weight: 600;
            z-index: 2;
        }
        .articulo-imagen {
            height: 400px;
            object-fit: contain;
            width: 100%;
        }
        .articulo-contenido {
            padding: 40px;
        }
        .articulo-categoria {
            display: inline-block;
            background: #e8f5e8;
            color: #1e5631;
            padding: 6px 16px;
            border-radius: 20px;
            font-size: 0.9rem;
            font-weight: 600;
            margin-bottom: 20px;
        }
        .articulo-titulo {
            color: #1e5631;
            font-weight: 700;
            margin-bottom: 15px;
            font-size: 2rem;
            line-height: 1.3;
        }
        .articulo-fecha {
            color: #7f8c8d;
            margin-bottom: 25px;
            display: flex;
            align-items: center;
            font-size: 0.95rem;
        }
        .articulo-fecha i {
            margin-right: 8px;
        }
        .articulo-texto {
            line-height: 1.8;
            color: #2c3e50;
            margin-bottom: 30px;
            font-size: 1.05rem;
        }
        
        /* Estilos para secciones desplegables */
        .seccion-desplegable {
            margin: 25px 0;
            border-radius: 10px;
            overflow: hidden;
            border: 1px solid #e9ecef;
        }
        .desplegable-titulo {
            background: #f8f9fa;
            padding: 15px 20px;
            cursor: pointer;
            display: flex;
            justify-content: space-between;
            align-items: center;
            transition: background 0.3s ease;
        }
        .desplegable-titulo:hover {
            background: #e9ecef;
        }
        .desplegable-titulo h4, .desplegable-titulo .origen-titulo {
            margin: 0;
            color: #1e5631;
            font-weight: 600;
            display: flex;
            align-items: center;
        }
        .desplegable-titulo i {
            margin-right: 10px;
            color: #7fb069;
        }
        .desplegable-icono {
            transition: transform 0.3s ease;
            color: #7fb069;
        }
        .desplegable-contenido {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.5s ease;
            padding: 0 20px;
        }
        .desplegable-contenido.activo {
            max-height: 2000px;
            padding: 20px;
        }
        .desplegable-titulo.activo .desplegable-icono {
            transform: rotate(180deg);
        }
        
        /* Mantener estilos específicos para origen */
        .articulo-origen .desplegable-contenido p {
            margin-bottom: 0;
        }
        
        .beneficios-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
            gap: 20px;
            margin: 0;
        }
        .beneficio-item {
            background: white;
            padding: 20px;
            border-radius: 10px;
            border: 1px solid #e9ecef;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }
        .beneficio-item:hover {
            transform: translateY(-3px);
            box-shadow: 0 5px 20px rgba(0,0,0,0.1);
        }
        .beneficio-icono {
            width: 50px;
            height: 50px;
            background: linear-gradient(135deg, #7fb069, #1e5631);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 15px;
            color: white;
            font-size: 1.2rem;
        }
        .beneficio-titulo {
            font-weight: 600;
            color: #1e5631;
            margin-bottom: 10px;
        }
   /* ==== Carrusel relacionados: 4 por vista en desktop ==== */
   .related-section { 
    padding: 60px ;
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
    margin-bottom: 60px;   
    margin-top: 30px; 

/* Capa 1: patrón SVG (líneas diagonales) + Capa 2: gris degradado */
background-image:
url("data:image/svg+xml,%3Csvg width='120' height='120' viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M-10 10 L40 50 M20 40 L70 80 M40 70 L90 110' stroke='%232f3b46' stroke-opacity='0.12' stroke-width='2' fill='none'/%3E%3C/svg%3E"),
linear-gradient(180deg, var(--gray-0) 0%, var(--gray-1) 100%);

background-repeat: repeat, no-repeat;
background-size: var(--pattern-size) var(--pattern-size), cover;
background-position: 0 0, center;
    border-radius: 12px;
    box-shadow: var(--shadow-sm);
    border:1px solid var(--ring);

}
   .related-title { font-weight: 700; color: #1f2937; margin-bottom: 14px;text-align: center; margin-bottom: 50px; }

   
   .related-carousel { position: relative; overflow: hidden;}
   .related-scroll {
     display: flex;
     gap: 12px;                 /* ↓ bajamos gap para cuadrar 4 */
     padding: 2px 0;
     scroll-behavior: smooth;
     overflow-x: auto;
     scrollbar-width: none;
   }
   .related-scroll::-webkit-scrollbar { display: none; }
   
 /* ===== RELACIONADOS: cards con misma altura y botón uniforme ===== */
.related-scroll .product-card{
    display:flex;
    flex-direction:column;
    height:100%;
    flex: 0 0 calc((100% - 36px) / 4);
    max-width: calc((100% - 36px) / 4);
    box-sizing:border-box;
    margin:0;
    padding:14px;
    border-radius:16px;
  }
  
  /* Imagen fija */
  .related-scroll .product-image{
    height:160px;
    border-radius:12px;
    margin-bottom:8px;
  }
  .related-scroll .product-image img{ width:100%; height:100%; object-fit:contain; }
  
  /* Marca / categorías: 1 línea con elipsis y altura fija */
  .related-scroll .brand-marca,
  .related-scroll .brand-cats{
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:1;
    overflow:hidden;
    line-height:1.2;
    white-space:normal;
  }
  .related-scroll .brand-marca{ font-size:.8rem; margin-top:6px; min-height:1.2em; }
  .related-scroll .brand-cats { font-size:.78rem;           min-height:1.2em; }
  .related-scroll .evento-text{ font-size:.72rem; }
  
  /* Nombre: máximo 2 líneas + altura mínima exacta de 2 líneas */
  .related-scroll .product-name{
    font-size:.95rem;
    line-height:1.3;
    margin:6px 0 4px;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    overflow:hidden;
    min-height: calc(1.3em * 2);
  }
  
  /* Precios compactos con altura mínima */
  .related-scroll .price-section{
    display:flex; align-items:center; gap:8px;
    min-height:24px;
    margin:4px 0 6px;
  }
  .related-scroll .current-price{ color:#059669; font-weight:700; font-size:.98rem; }
  .related-scroll .original-price{ color:#9aa0a6; text-decoration:line-through; font-size:.9rem; }
  
  /* Chips de delivery en una sola fila (no rompen altura) */
  .related-scroll .delivery-options{
    display:flex; gap:6px;
    flex-wrap:nowrap;          /* evita saltos de línea */
    white-space:nowrap;        /* evita que el texto rompa */
    overflow:hidden;           /* oculta exceso si hay muchos chips */
    min-height:22px;           /* altura fija de la fila de chips */
    margin-bottom:8px;
  }
  
  /* Botón: mismo alto y pegado abajo */
  .related-scroll .details-btn{
    margin-top:auto;           /* lo pega al fondo */
    width:100%;
    height:44px;               /* alto uniforme */
    min-height:44px;
    display:flex; align-items:center; justify-content:center;
    padding:0 14px;
    font-size:.85rem;
    border-radius:10px;
  }
  
  /* Hover sutil */
  .related-scroll .product-card:hover{
    transform: translateY(-6px) scale(1.01);
  }
  

   
   .btn-ver-producto{
    background: linear-gradient(135deg, #02c100, #009030);
    color: white;
    padding: 12px 24px;
    font-size:.95rem; font-weight:700;
    border-radius: 12px;
    cursor:pointer; letter-spacing:.04em;
    display:inline-flex; align-items:center; gap:10px;
    box-shadow: var(--shadow-sm);
    transition: transform .15s ease, box-shadow .2s ease, opacity .2s ease;
   }
   /* Favoritos */
.product-card .favorite-button{
    position:absolute; top:12px; right:12px;
    background:none; border:none; cursor:pointer;
    font-size:20px; color:#cbd5e1;
    transition: color .2s ease, transform .1s ease;
  }
  .product-card .favorite-button:hover{ color:#ef4444; transform: scale(1.1); }
        /* Newsletter */
        .newsletter-section {
            background: #005517;
            color: white;
            padding: 60px 0;
            text-align: center;
            margin: 80px 0;
        }
        .newsletter-titulo {
            font-size: 2rem;
            font-weight: 700;
            margin-bottom: 15px;
        }
        .newsletter-form {
            max-width: 500px;
            margin: 0 auto;
            display: flex;
            gap: 15px;
            margin-top: 30px;
        }
        .newsletter-input {
            flex: 1;
            padding: 15px 20px;
            border: none;
            border-radius: 50px;
            font-size: 1rem;
        }
        .btn-suscribirme {
            background: white !important;
            color: #1e5631 !important;
            border: none !important;
            padding: 15px 30px !important;
            border-radius: 50px !important;
            font-weight: 700 !important;
            transition: all 0.3s ease !important;
        }
        .btn-suscribirme:hover {
            background: #f8f9fa !important;
            transform: scale(1.05) !important;
        }
/* ===== Ajustes responsivos finos para “Productos más populares” (related-section) ===== */

/* Ultra-wide (≥1440px): 5 cards por vista */
@media (min-width: 1440px){
    .related-scroll { gap: 12px; }
    .related-scroll .product-card{
      flex-basis: calc((100% - (12px * 4)) / 5);
      max-width:  calc((100% - (12px * 4)) / 5);
    }
    .related-scroll .product-image{ height: 180px; }
  }
  
  /* Desktop (1025–1439px): 4 cards por vista (base) */
  @media (min-width: 1025px) and (max-width: 1439px){
    .related-scroll { gap: 12px; }
    .related-scroll .product-card{
      flex-basis: calc((100% - (12px * 3)) / 4);
      max-width:  calc((100% - (12px * 3)) / 4);
    }
    .related-scroll .product-image{ height: 150px; }
  }
  
  /* Tablets LANDSCAPE (768–1024px landscape): 4 cards por vista */
  @media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape){
    .related-scroll { gap: 12px; }
    .related-scroll .product-card{
      flex-basis: calc((100% - (12px * 3)) / 4);
      max-width:  calc((100% - (12px * 3)) / 4);
    }
    .related-scroll .product-image{ height: 160px; }
  }
  
  /* Tablets PORTRAIT (768–1024px portrait): 3 cards por vista */
  @media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait){
    .related-section{ padding: 36px; }
    .related-scroll { gap: 12px; }
    .related-scroll .product-card{
      flex-basis: calc((100% - (12px * 2)) / 3);
      max-width:  calc((100% - (12px * 2)) / 3);
    }
    .related-scroll .product-image{ height: 155px; }
    .related-scroll .product-name{
      -webkit-line-clamp: 2;
      min-height: calc(1.3em * 2);
    }
  }
  
  /* Phablets / móviles grandes (577–767px): 2 cards por vista */
  @media (min-width: 577px) and (max-width: 767px){
    .related-section{ padding: 28px; }
    .related-scroll { gap: 12px; }
    .related-scroll .product-card{
      flex-basis: calc((100% - 12px) / 2);
      max-width:  calc((100% - 12px) / 2);
    }
    .related-scroll .product-image{ height: 150px; }
    .related-scroll .product-name{
      -webkit-line-clamp: 2;
      min-height: calc(1.3em * 2);
    }
  }
  
  /* Móviles (≤576px): 1 card por vista + padding compacto */
  @media (max-width: 576px){
    .related-section{ padding: 5px; }
    .related-scroll { gap: 5px; }
    .related-scroll .product-card{
      flex-basis: calc((100% - 5px) / 2); /* 2 columnas */
      max-width:  calc((100% - 5px) / 2);
    }
    .related-scroll .product-image{ height: 170px; } /* un poco mayor para legibilidad */
    .related-scroll .product-name{
      font-size: .95rem !important;
      -webkit-line-clamp: 2 !important;
      min-height: calc(.95rem * 1.35 * 2) !important;
      line-height: 1.35 !important;
    }
    .related-scroll .delivery-options{
      display: flex;
      flex-direction: column; /* 🔹 pone los elementos en columna */
      gap: 4px;
      white-space: normal;    /* permite saltos de línea */
      overflow: visible;      /* evita que se corten */
      margin: 2px 0;
    }
    
  }