/* images-styles.css - Estilos para imagenes del articulo */

/* Estilos base para todas las imagenes de contenido */
[data-content] figure {
  margin: var(--space-lg) 0;
  max-width: 100%;
}

[data-content] figure img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

[data-content] figcaption {
  margin-top: var(--space-sm);
  font-size: var(--font-small);
  color: var(--text-muted);
  text-align: center;
  font-style: italic;
}

/* Hero image - estilos especificos */
[data-content="hero"] figure {
  margin: var(--space-lg) auto 0;
  max-width: 100%;
}

[data-content="hero"] figure img {
  border-radius: 8px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

/* Imagenes dentro de secciones de contenido */
[data-content="masters-torneo"] figure,
[data-content="strokes-gained"] figure,
[data-content="augusta-campo"] figure,
[data-content="estrategias"] figure,
[data-content="mercado-español"] figure {
  margin: var(--space-lg) 0;
}

/* Responsive - tablets */
@media (max-width: 768px) {
  [data-content] figure {
    margin: var(--space-md) 0;
  }
  
  [data-content] figure img {
    border-radius: 6px;
  }
  
  [data-content] figcaption {
    font-size: 0.8rem;
    padding: 0 var(--space-sm);
  }
}

/* Responsive - moviles */
@media (max-width: 480px) {
  [data-content] figure {
    margin: var(--space-sm) 0;
  }
  
  [data-content] figure img {
    border-radius: 4px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  }
  
  [data-content] figcaption {
    font-size: 0.75rem;
  }
  
  [data-content="hero"] figure img {
    border-radius: 4px;
  }
}