/* ==========================================================================
   1. Base — variables, tipografía, botones, tarjetas, fondos, chips
   ASONGD — pasongd-estilos-v8 — dividido por componentes
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Variables de color
   -------------------------------------------------------------------------- */
:root {

  /* --- Colores de marca / tema (probablemente los relevantes para diseño) --- */
  --accent: #006a40;        /* Verde institucional principal */
  --base: #e9f2d8;          /* Verde muy claro, fondo suave */
  --base-2: #f5faea;        /* Verde-blanco, fondo alterno */
  --base-3: #ffffff;        /* Blanco */
  --contrast: #23201b;      /* Texto principal (casi negro, cálido) */
  --contrast-2: #58595a;    /* Texto secundario / gris */
  --contrast-3: #a0c6b1;    /* Verde grisáceo, contraste suave */

  /* --- LOGO / LÍNEA GRÁFICA ASONGD (extraídos por ImgColorExtractor) ---*/
  --logo-verde-oscuro:      #17534a;  /* Verde oscuro, probable color principal */
  --logo-verde-teal:        #2d8d76;  /* Verde-teal medio */
  --logo-verde-medio:       #53b995;  /* Verde medio-claro */
  --logo-verde-azulado:     #87beb7;  /* Verde azulado claro */
  --logo-azul-verdoso:      #206c78;  /* Azul-verdoso oscuro */
  --logo-verde-grisaceo:    #7d8774;  /* Verde grisáceo / oliva apagado */
  --logo-verde-blanco:      #e7ece7;  /* Verde casi blanco, fondo claro */
  --logo-amarillo-vivo:     #f4d31a;  /* Amarillo vivo, probable color secundario */
  --logo-amarillo-claro:    #f0db5b;  /* Amarillo claro */
  --logo-amarillo-mostaza:  #c9ab23;  /* Amarillo mostaza / dorado oscuro */
  --logo-amarillo-extra:    #fed118; /* Otro amarillo para botones */
  --logo-rojo-anaranjado:   #d43925;  /* Rojo anaranjado, acento cálido */
  --logo-granate:           #a61245;  /* Granate / magenta oscuro, acento */
  --logo-azul-marino:       #293556;  /* Azul marino oscuro */
  --logo-gris-azulado:      #7c848c;  /* Gris con tinte azulado */
  --logo-gris-oscuro:       #646e6e;  /* Gris oscuro verdoso */
  --logo-gris-medio:        #959696;  /* Gris medio neutro */
  --logo-gris-claro:        #d3d3d3;  /* Gris claro neutro */

  /* --- Paleta extendida de tema (Kadence "global colors") --- */
  --global-color-8:  #42996b;  /* Verde medio */
  --global-color-9:  #003e19;  /* Verde muy oscuro */
  --global-color-10: #dc6f06;  /* Naranja */
  --global-color-11: #ff9f41;  /* Naranja claro */
  --global-color-12: #a44100;  /* Naranja oscuro / marrón */
  --global-color-13: #70006e;  /* Púrpura oscuro */
  --global-color-14: #a13e9d;  /* Púrpura medio */
  --global-color-15: #410042;  /* Púrpura muy oscuro */
  --global-color-16: #88bf23;  /* Verde lima */
  --global-color-17: #bcf259;  /* Verde lima claro */
  --global-color-18: #558e00;  /* Verde oliva */

}

/* --------------------------------------------------------------------------
   2. Tipografía
   -------------------------------------------------------------------------- */

.pasongd-font-base {
  font-family: "Poppins", system-ui, sans-serif;
}

.pasongd-h1 {
  font-family: "Poppins", system-ui, sans-serif;
  font-size: 44px;
  font-weight: 800;
  line-height: 1.1;
}

/* Variante móvil del H1 — aplicar vía media query o clase específica según
   cómo esté montado el hero */



@media (max-width: 600px) {
 .pasongd-h1, .pasongd-h2, .pasongd-h3, .pasongd-h4{
     font-weight: 600 !important;
 } 
 .pasongd-h1 {
    font-size: 1.75rem; /* 28px */
  }
}

.pasongd-h2 {
  font-family: "Poppins", system-ui, sans-serif;
  font-size: 1.75rem; /* 28px — restaurado al valor original de v7, distinto de h2-franja */
  font-weight: 800;
}

/* H2 más pequeño específico de las franjas CTA (Sevilla Coopera, La Provincia
   Coopera) — mismo peso, tamaño menor que el H2 de sección estándar */
.pasongd-h2-franja {
  font-family: "Poppins", system-ui, sans-serif;
  font-size: 1.5rem; /* 24px — ahora sí menor que .pasongd-h2 */
  font-weight: 800;
}

.pasongd-h3 {
  font-family: "Poppins", system-ui, sans-serif;
  font-size: 1.031rem; /* 16.5px, rango guía: 16–17px */
  font-weight: 700;
}

.pasongd-h4 {
  font-family: "Poppins", system-ui, sans-serif;
  font-size: 0.875rem; /* 14px */
  font-weight: 700;
}

.pasongd-body {
  font-family: "Poppins", system-ui, sans-serif;
  font-size: 15px; /* rango guía: 13.5–16px */
  font-weight: 400;
  color: var(--contrast-2);
}

.pasongd-meta {
  font-family: "Poppins", system-ui, sans-serif;
  font-size: 0.875em; 
  color: var(--contrast-2);
  font-weight: 400;
}

.pasongd-nav-label {
  font-family: "Poppins", system-ui, sans-serif;
  font-size: 13px; /* rango guía: 12–14px */
  font-weight: 600;
}

.pasongd-informe-link a {
  color: var(--logo-amarillo-extra) !important;
}

/* --------------------------------------------------------------------------
   3. Chips de categoría
   -------------------------------------------------------------------------- */

.pasongd-tag {
  display: inline-flex;
  width: fit-content;
  font-family: "Poppins", system-ui, sans-serif;
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 3px;
}

.pasongd-tag-convocatorias { background: var(--accent); }
.pasongd-tag-empleo { background: var(--global-color-10); }
.pasongd-tag-proyectos { background: var(--global-color-8); }
.pasongd-tag-internacional { background: var(--global-color-13); }

.pasongd-tag-convenio, .pasongd-tag-convenio2  {
  display: inline-flex;
  width: fit-content;
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 3px;
}

.pasongd-tag-convenio{
  background: var(--global-color-9);
}

.pasongd-tag-convenio2{
  background: var(--logo-granate);
}



/* --------------------------------------------------------------------------
   4. Botones
   -------------------------------------------------------------------------- */

/* :not(.wp-block-button) evita que el contenedor <div class="wp-block-button">
   de Gutenberg reciba el estilo completo (causaba doble borde); el enlace
   .wp-block-button__link interior sigue recibiéndolo vía el segundo selector.
   Los usos antiguos de la clase directamente sobre <a>, sin envoltorio de
   Gutenberg, se mantienen intactos gracias al :not(). */

.pasongd-btn-primary:not(.wp-block-button),
.pasongd-btn-primary .wp-block-button__link {
  display: inline-block;
  font-family: "Poppins", system-ui, sans-serif;
  background: var(--logo-amarillo-extra) !important;
  color: var(--accent) !important;
  font-weight: 700;
  font-size: 14px; /* rango guía: 13.5–14px */
  padding: 6px 12px !important; /* rango guía: 11–13px 22–26px */
  border-radius: 4px !important;
  border: none;
  text-decoration: none;
  cursor: pointer;
}

.pasongd-btn-secondary:not(.wp-block-button),
.pasongd-btn-secondary .wp-block-button__link{
  display: inline-block;
  font-family: "Poppins", system-ui, sans-serif;
  background: transparent !important;
  border: 2px solid var(--accent) !important;
  color: var(--accent) !important;
  font-weight: 700;
  font-size: 14px;
  padding: 10px 12px !important;
  border-radius: 4px !important;
  text-decoration: none;
}

.pasongd-btn-primary:not(.wp-block-button),
.pasongd-btn-primary .wp-block-button__link, .pasongd-btn-secondary:not(.wp-block-button),
.pasongd-btn-secondary .wp-block-button__link { 
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
 }
.pasongd-btn-primary:not(.wp-block-button):hover,
.pasongd-btn-primary .wp-block-button__link:hover, .pasongd-btn-secondary:not(.wp-block-button):hover,
.pasongd-btn-secondary .wp-block-button__link:hover { 
  background-color: var(--accent) !important;
  color: #ffffff !important;
}




/* --------------------------------------------------------------------------
   5. Tarjetas
   -------------------------------------------------------------------------- */

.pasongd-card {
  background: var(--base-3);
  border: 1px solid var(--contrast-3);
  border-radius: 6px;
  overflow: hidden;
}

.wp-grid-builder .wpgb-card p{
  font-size: 0.875em !important;
  font-weight: 400;
  font-family: "Poppins";
}
/* --------------------------------------------------------------------------
   6. Fondos
   -------------------------------------------------------------------------- */

.pasongd-bg-general { background: var(--base-2); }
.pasongd-bg-hero { background: var(--base); }
.pasongd-bg-footer {
  background: var(--contrast);
  color: #fff;
}
.pasongd-bg-oscuro {
  background: var(--global-color-9);
  color: #fff;
}