/* Copa Chile container polish
   Requisito: NO tocar color de texto ni imagen de fondo.
   Objetivo: mejorar “contenedor” (bloques internos) para verse más premium:
   - mejor alineación y ancho de lectura
   - consistencia de márgenes
   - card feel sutil (blur/border) dentro de la misma estética
*/

/* Asegura ancho y centrado del contenido sin afectar el fondo de la sección */
#copa-chile .container{
  /* NOTA: El eje visual / ancho desktop se controla en css/desktop-layout-final.css */
}

/* Nuevo wrapper premium para ordenar ritmo vertical y evitar “saltos” entre bloques */
#copa-chile .copa-premium{
  /* CONTENEDOR PREMIUM (nuevo)
     - Esto es el “contenedor” real que pediste rearmar.
     - Mantiene la línea gráfica (blur, bordes dorados) sin cambiar el fondo.
     - Controla el ritmo vertical para que el desarrollo se vea natural.
  */
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.4rem;

  padding: 2.6rem 2.2rem;
  border-radius: 22px;
  border: 1px solid rgba(212,175,55,0.22);
  background: linear-gradient(
    180deg,
    rgba(0,0,0,0.38) 0%,
    rgba(0,0,0,0.26) 55%,
    rgba(0,0,0,0.18) 100%
  );
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow:
    0 22px 70px rgba(0,0,0,0.55),
    inset 0 1px 0 rgba(255,255,255,0.05);
}

/* Evita que el primer bloque “pegue” arriba del contenedor */
#copa-chile .copa-premium > :first-child{ margin-top: 0; }

/* Mobile: mantiene el look premium sin alargar demasiado */
@media (max-width: 768px){
  #copa-chile .copa-premium{
    gap: 1.7rem;
    padding: 1.6rem 1.05rem;
    border-radius: 18px;
  }
}

/* Hero: lo convertimos en bloque más definido (sin cambiar colores) */
#copa-chile .copa-hero{
  padding: 2.8rem 2.1rem; /* + respiro */
  border-radius: 18px;
  border: 1px solid rgba(212,175,55,0.28);
  background: rgba(0,0,0,0.34);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow:
    0 18px 60px rgba(0,0,0,0.45),
    inset 0 1px 0 rgba(255,255,255,0.06);
  margin: 0; /* el spacing lo maneja .copa-premium para un ritmo consistente */
}

/* Banner stats: más compacto y centrado */
#copa-chile .copa-stats-banner{
  /* centrado + ancho coherente (sin romper el banner original) */
  margin-left: auto;
  margin-right: auto;
}

/* Features: limita ancho y mejora respiración */
#copa-chile .copa-features{
  /* centrado + ritmo; el ancho lo define el layout global */
  margin-left: auto;
  margin-right: auto;
}

/* Galería: centrar el bloque y normalizar márgenes */
#copa-chile .copa-chile-galeria{
  margin-left: auto;
  margin-right: auto;
}

#copa-chile .copa-chile-grid-3{
  /* Mantiene tu grid, pero evita el "1400px" inline para que respete el eje visual */
  max-width: 1200px !important;
}

/* Laptop: un poco más aire */
@media (min-width: 1024px) and (max-width: 1366px){
  #copa-chile .copa-hero{ padding: 3.0rem 2.2rem; }
}

/* Mobile: reduce padding del hero para no alargar */
@media (max-width: 768px){
  /* Nota: el ancho lo gestiona el contenedor global; aquí solo cuidamos respiración */
  #copa-chile .copa-hero{ padding: 1.85rem 1.25rem; border-radius: 16px; }
}
