/* ==========================================================================
   CCPM · Sistema de diseño (Manual de Identidad Corporativa CCPM)
   Única fuente de verdad de tokens para el sitio. Los colores y tipografías
   globales de Elementor replican estos valores.
   ========================================================================== */

/* --- Fuentes (Proxima Nova: licencia CCPM, copiada a uploads/ccpm-fuentes) --- */
@font-face { font-family: "Proxima Nova"; font-weight: 400; font-style: normal; font-display: swap;
  src: url("/wp-content/uploads/ccpm-fuentes/ProximaNova-Regular.otf") format("opentype"); }
@font-face { font-family: "Proxima Nova"; font-weight: 700 800; font-style: normal; font-display: swap;
  src: url("/wp-content/uploads/ccpm-fuentes/ProximaNova-Bold.otf") format("opentype"); }
/* Roboto y Bebas Neue las carga Elementor (Google Fonts) al usarse en cualquier widget. */

:root {
  /* Paleta oficial (p. 12 del manual) */
  --ccpm-verde: #79A52B;          /* Pantone 369 C */
  --ccpm-verde-600: #5C7F20;
  --ccpm-verde-300: #AFCC80;
  --ccpm-verde-100: #E4EFD5;
  --ccpm-verde-50:  #F2F7EA;
  --ccpm-turquesa: #2994A7;       /* Pantone 7711 C */
  --ccpm-turquesa-600: #1E6F7E;
  --ccpm-turquesa-300: #7FBFCA;
  --ccpm-turquesa-100: #D4EAED;
  --ccpm-turquesa-50:  #E9F4F6;
  --ccpm-negro: #232222;          /* Pantone Neutral Black C */
  --ccpm-gris-700: #3E3D3D;
  --ccpm-gris-600: #5A5959;
  --ccpm-gris-500: #7F7E7E;
  --ccpm-gris-400: #A5A4A4;
  --ccpm-gris-300: #CBCBCB;
  --ccpm-gris-200: #E5E5E5;
  --ccpm-gris-100: #F2F2F2;
  --ccpm-blanco: #FFFFFF;
  /* Fondos institucionales para versión negativa del logo (p. 17) */
  --ccpm-fondo-turquesa: #00829B;
  --ccpm-fondo-verde: #80B816;
  --ccpm-fondo-negro: #2B2B2B;

  /* Semánticos */
  --ccpm-primario: var(--ccpm-verde);
  --ccpm-secundario: var(--ccpm-turquesa);
  --ccpm-tinta: var(--ccpm-negro);
  --ccpm-tinta-media: var(--ccpm-gris-600);
  --ccpm-tinta-suave: var(--ccpm-gris-400);
  --ccpm-linea: var(--ccpm-gris-200);
  --ccpm-fondo: var(--ccpm-blanco);
  --ccpm-fondo-suave: var(--ccpm-gris-100);
  --ccpm-enlace: var(--ccpm-turquesa-600);

  /* Áreas de programación: solo tonos de la paleta (el manual prohíbe colores ajenos) */
  --ccpm-area-cine: var(--ccpm-turquesa);
  --ccpm-area-musica: var(--ccpm-verde);
  --ccpm-area-teatro: var(--ccpm-turquesa-600);
  --ccpm-area-danza: var(--ccpm-verde-600);
  --ccpm-area-artes-visuales: #54A9B9;
  --ccpm-area-folklore: #94B955;
  --ccpm-area-literatura: var(--ccpm-negro);
  --ccpm-area-exposiciones: var(--ccpm-gris-600);
  --ccpm-area-otros: var(--ccpm-gris-500);

  /* Tipografía (p. 15): Proxima Nova títulos · Bebas Neue subtexto/etiquetas · Roboto cuerpo */
  --ccpm-f-titulo: "Proxima Nova", "Figtree", "Segoe UI", Roboto, sans-serif;
  --ccpm-f-subtexto: "Bebas Neue", "Oswald", Impact, sans-serif;
  --ccpm-f-cuerpo: Roboto, "Segoe UI", Helvetica, Arial, sans-serif;
  --ccpm-t-xs: 0.8125rem;  /* 13 etiqueta */
  --ccpm-t-sm: 0.9375rem;  /* 15 */
  --ccpm-t-md: 1.0625rem;  /* 17 cuerpo */
  --ccpm-t-lg: 1.25rem;    /* 20 */
  --ccpm-t-xl: clamp(1.375rem, 1.1rem + 1vw, 1.625rem);   /* h3 */
  --ccpm-t-2xl: clamp(1.75rem, 1.3rem + 1.8vw, 2.25rem);  /* h2 */
  --ccpm-t-3xl: clamp(2.125rem, 1.5rem + 2.6vw, 3rem);    /* h1 */
  --ccpm-t-4xl: clamp(2.5rem, 1.6rem + 4vw, 4.25rem);     /* portada */

  /* Espaciado (base 4) */
  --ccpm-e-1: 0.25rem; --ccpm-e-2: 0.5rem; --ccpm-e-3: 0.75rem; --ccpm-e-4: 1rem;
  --ccpm-e-6: 1.5rem; --ccpm-e-8: 2rem; --ccpm-e-10: 2.5rem;
  --ccpm-e-12: clamp(2.5rem, 5vw, 3rem);
  --ccpm-e-16: clamp(3rem, 7vw, 4rem);
  --ccpm-e-24: clamp(4rem, 9vw, 6rem);
  --ccpm-seccion: var(--ccpm-e-16);       /* padding vertical de sección */
  --ccpm-ancho: 1200px;
  --ccpm-ancho-texto: 760px;

  /* Forma y movimiento */
  --ccpm-radio-sm: 4px; --ccpm-radio: 8px; --ccpm-radio-lg: 16px; --ccpm-pill: 999px;
  --ccpm-sombra: 0 1px 2px rgba(35,34,34,.06), 0 6px 16px rgba(35,34,34,.08);
  --ccpm-sombra-lg: 0 2px 6px rgba(35,34,34,.08), 0 16px 40px rgba(35,34,34,.12);
  --ccpm-transicion: 180ms ease;
  --ccpm-cabecera: 76px;
  --ccpm-ratio-tarjeta: 4 / 5;
  --ccpm-ratio-hero: 16 / 7;
}

/* --- Base --- */
body { font-family: var(--ccpm-f-cuerpo); color: var(--ccpm-tinta); background: var(--ccpm-fondo); -webkit-font-smoothing: antialiased; }
h1, h2, h3 { font-family: var(--ccpm-f-titulo); font-weight: 700; letter-spacing: -0.015em; line-height: 1.1; }
h4 { font-family: var(--ccpm-f-cuerpo); font-weight: 700; }
h5, h6 { font-family: var(--ccpm-f-subtexto); font-weight: 400; letter-spacing: 0.06em; text-transform: uppercase; }
a { color: var(--ccpm-enlace); }
a:hover { color: var(--ccpm-turquesa); }
::selection { background: var(--ccpm-verde-100); }
:focus-visible { outline: 3px solid var(--ccpm-turquesa); outline-offset: 2px; }

/* --- Utilidades de sección (clases CSS para contenedores de Elementor) --- */
.ccpm-seccion { padding-top: var(--ccpm-seccion); padding-bottom: var(--ccpm-seccion); }
.ccpm-seccion--suave { background: var(--ccpm-fondo-suave); }
.ccpm-seccion--oscura { background: var(--ccpm-negro); color: var(--ccpm-blanco); }
.ccpm-seccion--oscura h1, .ccpm-seccion--oscura h2, .ccpm-seccion--oscura h3, .ccpm-seccion--oscura a { color: var(--ccpm-blanco); }
.ccpm-seccion--turquesa { background: var(--ccpm-fondo-turquesa); color: var(--ccpm-blanco); }
.ccpm-seccion--verde { background: var(--ccpm-fondo-verde); color: var(--ccpm-blanco); }

/* Encabezado de sección: kicker Bebas + título Proxima + enlace "ver todo" */
.ccpm-kicker { font-family: var(--ccpm-f-subtexto); font-size: var(--ccpm-t-lg); letter-spacing: 0.08em; text-transform: uppercase; color: var(--ccpm-turquesa); line-height: 1; }
.ccpm-kicker::before { content: ""; display: inline-block; width: 28px; height: 4px; margin-right: 10px; vertical-align: middle; background: var(--ccpm-verde); border-radius: 2px; }
.ccpm-ver-todo a { font-family: var(--ccpm-f-subtexto); font-size: var(--ccpm-t-lg); letter-spacing: 0.06em; text-transform: uppercase; text-decoration: none; color: var(--ccpm-tinta); border-bottom: 2px solid var(--ccpm-verde); }
.ccpm-ver-todo a:hover { color: var(--ccpm-verde-600); }

/* Cinta bicolor del manual (verde + turquesa) para separar/cerrar secciones */
.ccpm-cinta { height: 6px; background: linear-gradient(90deg, var(--ccpm-verde) 0 50%, var(--ccpm-turquesa) 50% 100%); border-radius: var(--ccpm-pill); }

/* --- Etiquetas --- */
.ccpm-etiqueta { display: inline-block; font-family: var(--ccpm-f-subtexto); font-size: var(--ccpm-t-sm); letter-spacing: 0.08em; text-transform: uppercase; line-height: 1; padding: 0.4em 0.7em 0.3em; border-radius: var(--ccpm-radio-sm); color: var(--ccpm-blanco); background: var(--ccpm-gris-600); }
.ccpm-etiqueta--area-cine { background: var(--ccpm-area-cine); }
.ccpm-etiqueta--area-musica { background: var(--ccpm-area-musica); }
.ccpm-etiqueta--area-teatro { background: var(--ccpm-area-teatro); }
.ccpm-etiqueta--area-danza { background: var(--ccpm-area-danza); }
.ccpm-etiqueta--area-artes-visuales { background: var(--ccpm-area-artes-visuales); }
.ccpm-etiqueta--area-folklore { background: var(--ccpm-area-folklore); }
.ccpm-etiqueta--area-literatura { background: var(--ccpm-area-literatura); }
.ccpm-etiqueta--area-exposiciones { background: var(--ccpm-area-exposiciones); }
.ccpm-etiqueta--area-otros { background: var(--ccpm-area-otros); }
.ccpm-etiqueta--liberada { background: var(--ccpm-verde-100); color: var(--ccpm-verde-600); }
.ccpm-etiqueta--vigente { background: var(--ccpm-verde); }
.ccpm-etiqueta--cerrada { background: var(--ccpm-gris-400); }

/* --- Tarjeta de actividad (Loop Item de Elementor con estas clases) --- */
.ccpm-tarjeta { display: flex; flex-direction: column; background: var(--ccpm-blanco); border-radius: var(--ccpm-radio-lg); overflow: hidden; box-shadow: var(--ccpm-sombra); transition: transform var(--ccpm-transicion), box-shadow var(--ccpm-transicion); height: 100%; }
.ccpm-tarjeta:hover { transform: translateY(-3px); box-shadow: var(--ccpm-sombra-lg); }
.ccpm-tarjeta__media { position: relative; aspect-ratio: var(--ccpm-ratio-tarjeta); background: var(--ccpm-gris-100); }
.ccpm-tarjeta__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ccpm-tarjeta__fecha { position: absolute; top: 12px; left: 12px; background: var(--ccpm-blanco); color: var(--ccpm-tinta); border-radius: var(--ccpm-radio); text-align: center; padding: 6px 10px; min-width: 56px; box-shadow: var(--ccpm-sombra); }
.ccpm-tarjeta__fecha .dia { display: block; font-family: var(--ccpm-f-titulo); font-weight: 700; font-size: 1.5rem; line-height: 1; }
.ccpm-tarjeta__fecha .mes { display: block; font-family: var(--ccpm-f-subtexto); font-size: 0.9rem; letter-spacing: 0.1em; color: var(--ccpm-turquesa); }
.ccpm-tarjeta__area { position: absolute; top: 12px; right: 12px; }
.ccpm-tarjeta__cuerpo { padding: var(--ccpm-e-4) var(--ccpm-e-4) var(--ccpm-e-6); display: flex; flex-direction: column; gap: var(--ccpm-e-2); flex: 1; }
.ccpm-tarjeta__titulo { font-family: var(--ccpm-f-titulo); font-weight: 700; font-size: var(--ccpm-t-lg); line-height: 1.2; margin: 0; }
.ccpm-tarjeta__titulo a { color: inherit; text-decoration: none; }
.ccpm-tarjeta__meta { font-size: var(--ccpm-t-sm); color: var(--ccpm-tinta-media); display: flex; flex-wrap: wrap; gap: var(--ccpm-e-1) var(--ccpm-e-3); }
.ccpm-tarjeta__meta span::before { content: "·"; margin-right: var(--ccpm-e-2); color: var(--ccpm-verde); }
.ccpm-tarjeta__meta span:first-child::before { content: none; }
.ccpm-tarjeta__pie { margin-top: auto; display: flex; justify-content: space-between; align-items: center; padding-top: var(--ccpm-e-2); }
.ccpm-tarjeta__valor { font-family: var(--ccpm-f-subtexto); font-size: var(--ccpm-t-lg); letter-spacing: 0.04em; color: var(--ccpm-verde-600); }

/* Tarjeta de noticia (horizontal en escritorio) */
.ccpm-noticia { display: grid; grid-template-columns: 2fr 3fr; gap: var(--ccpm-e-4); align-items: start; }
.ccpm-noticia__media { aspect-ratio: 4 / 3; border-radius: var(--ccpm-radio); overflow: hidden; }
.ccpm-noticia__media img { width: 100%; height: 100%; object-fit: cover; }
.ccpm-noticia__fecha { font-family: var(--ccpm-f-subtexto); letter-spacing: 0.08em; color: var(--ccpm-turquesa); }
@media (max-width: 767px) { .ccpm-noticia { grid-template-columns: 1fr; } }

/* --- Botones --- */
.ccpm-boton, .elementor-button { font-family: var(--ccpm-f-cuerpo); font-weight: 700; border-radius: var(--ccpm-pill); }
.ccpm-boton--secundario { background: var(--ccpm-turquesa) !important; }
.ccpm-boton--secundario:hover { background: var(--ccpm-turquesa-600) !important; }
.ccpm-boton--fantasma { background: transparent !important; color: var(--ccpm-tinta) !important; border: 2px solid var(--ccpm-tinta) !important; }
.ccpm-boton--fantasma:hover { background: var(--ccpm-tinta) !important; color: var(--ccpm-blanco) !important; }
.ccpm-boton--blanco { background: var(--ccpm-blanco) !important; color: var(--ccpm-tinta) !important; }

/* --- Cabecera --- */
.ccpm-cabecera { background: var(--ccpm-blanco); border-bottom: 1px solid var(--ccpm-linea); }
.ccpm-cabecera .elementor-nav-menu a { font-family: var(--ccpm-f-subtexto); font-size: 1.125rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ccpm-tinta); }
.ccpm-cabecera .elementor-nav-menu a:hover, .ccpm-cabecera .elementor-nav-menu .current-menu-item > a { color: var(--ccpm-verde-600); }
.ccpm-cabecera .elementor-nav-menu--dropdown a { font-family: var(--ccpm-f-cuerpo); font-size: var(--ccpm-t-sm); letter-spacing: 0; text-transform: none; }
.ccpm-barra-superior { background: var(--ccpm-negro); color: var(--ccpm-blanco); font-family: var(--ccpm-f-subtexto); letter-spacing: 0.08em; font-size: 0.95rem; }
.ccpm-barra-superior a { color: var(--ccpm-blanco); text-decoration: none; }
.ccpm-barra-superior a:hover { color: var(--ccpm-verde-300); }
.ccpm-en-directo { display: inline-flex; align-items: center; gap: 8px; }
.ccpm-en-directo::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--ccpm-verde); box-shadow: 0 0 0 0 rgba(121,165,43,.6); animation: ccpm-pulso 1.6s infinite; }
@keyframes ccpm-pulso { 70% { box-shadow: 0 0 0 8px rgba(121,165,43,0); } 100% { box-shadow: 0 0 0 0 rgba(121,165,43,0); } }

/* --- Pie --- */
.ccpm-pie { background: var(--ccpm-negro); color: var(--ccpm-gris-300); }
.ccpm-pie h4, .ccpm-pie h5 { color: var(--ccpm-blanco); }
.ccpm-pie a { color: var(--ccpm-gris-200); text-decoration: none; }
.ccpm-pie a:hover { color: var(--ccpm-verde-300); }
.ccpm-pie__legal { border-top: 1px solid var(--ccpm-gris-700); font-size: var(--ccpm-t-sm); color: var(--ccpm-gris-400); }

/* --- Hero --- */
.ccpm-hero { position: relative; min-height: min(70vh, 640px); display: flex; align-items: flex-end; color: var(--ccpm-blanco); }
.ccpm-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(35,34,34,0) 30%, rgba(35,34,34,.85) 100%); pointer-events: none; }
.ccpm-hero > * { position: relative; z-index: 1; }
.ccpm-hero__titulo { font-size: var(--ccpm-t-4xl); text-transform: uppercase; line-height: 0.95; color: var(--ccpm-blanco); }
.ccpm-hero__meta { font-family: var(--ccpm-f-subtexto); font-size: var(--ccpm-t-lg); letter-spacing: 0.08em; }

/* --- Ficha lateral de actividad (single) --- */
.ccpm-ficha { background: var(--ccpm-fondo-suave); border-radius: var(--ccpm-radio-lg); padding: var(--ccpm-e-6); position: sticky; top: calc(var(--ccpm-cabecera) + 16px); }
.ccpm-ficha dl { display: grid; grid-template-columns: auto 1fr; gap: var(--ccpm-e-2) var(--ccpm-e-4); margin: 0; }
.ccpm-ficha dt { font-family: var(--ccpm-f-subtexto); letter-spacing: 0.08em; color: var(--ccpm-turquesa); }
.ccpm-ficha dd { margin: 0; }

/* --- Salas y adjuntos (shortcodes del plugin) --- */
.ccpm-salas { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: var(--ccpm-e-6); }
.ccpm-sala { border-radius: var(--ccpm-radio-lg); overflow: hidden; background: var(--ccpm-blanco); box-shadow: var(--ccpm-sombra); }
.ccpm-sala img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.ccpm-sala__cuerpo { padding: var(--ccpm-e-4); }
.ccpm-sala__cuerpo h3 { font-size: var(--ccpm-t-lg); margin: 0 0 var(--ccpm-e-1); }
.ccpm-sala__cuerpo p { margin: 0; color: var(--ccpm-tinta-media); font-size: var(--ccpm-t-sm); }
.ccpm-adjuntos { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--ccpm-e-2); }
.ccpm-adjuntos a { display: flex; align-items: center; gap: var(--ccpm-e-3); padding: var(--ccpm-e-3) var(--ccpm-e-4); background: var(--ccpm-fondo-suave); border-radius: var(--ccpm-radio); text-decoration: none; color: var(--ccpm-tinta); font-weight: 500; }
.ccpm-adjuntos a::before { content: "↓"; font-weight: 700; color: var(--ccpm-verde); }
.ccpm-adjuntos a:hover { background: var(--ccpm-verde-100); }

/* Contenido editorial (post / página) */
.ccpm-prosa { max-width: var(--ccpm-ancho-texto); }
.ccpm-prosa p { margin-bottom: var(--ccpm-e-4); }
.ccpm-prosa blockquote { border-left: 4px solid var(--ccpm-verde); padding-left: var(--ccpm-e-4); color: var(--ccpm-tinta-media); font-size: var(--ccpm-t-lg); }
.ccpm-bajada { font-size: var(--ccpm-t-lg); color: var(--ccpm-tinta-media); line-height: 1.5; }

/* Estados vacíos (salas sin programación, cartelera vacía) */
.ccpm-vacio { border: 1px dashed var(--ccpm-gris-300); border-radius: var(--ccpm-radio-lg); padding: var(--ccpm-e-8); text-align: center; color: var(--ccpm-tinta-media); }

@media (prefers-reduced-motion: reduce) { .ccpm-tarjeta, .ccpm-en-directo::before { transition: none; animation: none; } }