/*
 * FCVV PORTAL V2.1.2
 * CUSTOM OVERRIDES
 * BLOQUE 1: IDENTIDAD EDITORIAL
 */

:root {
  --fcvv-crema: #FBF7F2;
  --fcvv-ciruela: #54243F;
  --fcvv-malva: #92718B;
  --fcvv-texto: #323D32;
  --fcvv-linea: #E8DDE3;
}

/* Fondo del artículo */
body.single-post {
  background: #FBF7F2 !important;
}

/* Título principal */
body.single-post h1,
.single-post .entry-title,
.single-post h1.wp-block-post-title {
  max-width: 950px !important;
  margin: 55px auto 35px !important;
  color: #54243F !important;
  font-size: 42px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
}

/* Contenido del artículo */
body.single-post .entry-content,
body.single-post .wp-block-post-content {
  max-width: 900px !important;
  margin: 0 auto 80px !important;
  color: #323D32 !important;
  font-size: 18px !important;
  line-height: 1.8 !important;
}

/* Encabezados */
body.single-post .entry-content h2,
body.single-post .entry-content h3,
body.single-post .wp-block-post-content h2,
body.single-post .wp-block-post-content h3 {
  color: #54243F !important;
  line-height: 1.35 !important;
  margin-top: 35px !important;
  margin-bottom: 15px !important;
}

/* Párrafos */
body.single-post .entry-content p,
body.single-post .wp-block-post-content p {
  margin-bottom: 23px;
}

/* Listas */
body.single-post .entry-content ul,
body.single-post .entry-content ol,
body.single-post .wp-block-post-content ul,
body.single-post .wp-block-post-content ol {
  margin: 20px 0 28px;
  padding-left: 30px;
}

body.single-post .entry-content li,
body.single-post .wp-block-post-content li {
  margin-bottom: 12px;
  padding-left: 5px;
}

/* Enlaces */
body.single-post .entry-content a,
body.single-post .wp-block-post-content a {
  color: #54243F;
  text-decoration-color: #92718B;
  text-underline-offset: 4px;
}

/* Citas */
body.single-post .entry-content blockquote,
body.single-post .wp-block-post-content blockquote {
  margin: 32px 0;
  padding: 20px 26px;
  border-left: 4px solid #92718B;
  background: #F3EBF0;
  color: #54243F;
}

/* Separadores */
body.single-post .entry-content hr,
body.single-post .wp-block-post-content hr {
  margin: 38px 0;
  border: 0;
  border-top: 1px solid #E8DDE3;
}

/* Adaptación móvil */
@media (max-width: 768px) {
  body.single-post h1,
  .single-post .entry-title,
  .single-post h1.wp-block-post-title {
    font-size: 30px !important;
    line-height: 1.22 !important;
    margin: 35px 22px 25px !important;
  }

  body.single-post .entry-content,
  body.single-post .wp-block-post-content {
    padding: 0 22px !important;
    font-size: 16px !important;
    line-height: 1.75 !important;
  }

  body.single-post .entry-content h2,
  body.single-post .entry-content h3,
  body.single-post .wp-block-post-content h2,
  body.single-post .wp-block-post-content h3 {
    font-size: 21px !important;
    line-height: 1.35 !important;
    margin-top: 28px !important;
  }
}
/* =========================================================
   BLOQUE 2: NAVEGACIÓN DESTACADA
   ========================================================= */

/* Observatorio: resaltado malva */
header a[href*="observatorio"],
nav a[href*="observatorio"] {
  position: relative !important;
  isolation: isolate !important;
  background: transparent !important;
  color: #FBF7F2 !important;
  border-radius: 8px !important;
  z-index: 0 !important;
}

header a[href*="observatorio"]::before,
nav a[href*="observatorio"]::before {
  content: "" !important;
  position: absolute !important;
  z-index: -1 !important;
  inset: -5px -9px !important;
  background-color: #92718B !important;
  border-radius: 8px !important;
  transition: background-color 0.2s ease;
}

header a[href*="observatorio"]:hover::before,
nav a[href*="observatorio"]:hover::before {
  background-color: #75445F !important;
}

/* Necesito ayuda: resaltado ciruela en escritorio */
.desktop-nav a[href*="/ayuda/"] {
  position: relative !important;
  isolation: isolate !important;
  background: transparent !important;
  color: #FFFFFF !important;
  z-index: 0 !important;
}

.desktop-nav a[href*="/ayuda/"]::before {
  content: "" !important;
  position: absolute !important;
  z-index: -1 !important;
  inset: -5px -9px !important;
  background-color: #54243F !important;
  border-radius: 8px !important;
  transition: background-color 0.2s ease;
}

.desktop-nav a[href*="/ayuda/"]:hover::before {
  background-color: #DCC1D0 !important;
}
/* =========================================================
   BLOQUE 3: CUADRÍCULA DE SEIS TARJETAS DEL PORTAL
   ========================================================= */

/* Distribución principal: tres columnas */
.portal-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 24px !important;
  align-items: stretch !important;
}

/* Estructura uniforme de las tarjetas */
.portal-grid .portal-card {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

/* Imágenes: cubrir todo el ancho de la tarjeta */
.portal-grid .portal-card-image {
  display: block !important;
  width: calc(100% + 48px) !important;
  max-width: none !important;
  height: 180px !important;
  min-height: 180px !important;
  aspect-ratio: auto !important;
  object-fit: cover !important;
  object-position: center !important;
  margin: -24px -24px 18px -24px !important;
  padding: 0 !important;
  align-self: auto !important;
  box-sizing: border-box !important;
  flex-shrink: 0 !important;
}

/* Enlaces siempre al final de cada tarjeta */
.portal-grid .portal-card .portal-link {
  margin-top: auto !important;
}

/* Tablet: dos columnas */
@media (max-width: 900px) {
  .portal-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 20px !important;
  }
}

/* Móvil: una columna */
@media (max-width: 600px) {
  .portal-grid {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }

  .portal-grid .portal-card-image {
    height: 190px !important;
    min-height: 190px !important;
  }
}
/* =========================================================
   BLOQUE 4: TARJETAS DE LÍNEAS DE TRABAJO
   ========================================================= */

.pillars-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px !important;
  align-items: stretch;
}

.pillars-grid .pillar {
  background: #F1E9EF !important;
  border: 1px solid #E8DDE3 !important;
  border-radius: 14px !important;
  padding: 25px 22px !important;
  min-width: 0;
  box-sizing: border-box;
  transition: background-color 0.25s ease,
              border-color 0.25s ease,
              transform 0.25s ease;
}

.pillars-grid .pillar > span {
  display: block;
  color: #92718B !important;
  font-size: 25px !important;
  font-weight: 700 !important;
  margin-bottom: 18px !important;
  line-height: 1;
}

.pillars-grid .pillar h3 {
  color: #54243F !important;
  font-size: 18px !important;
  margin: 0 0 12px !important;
}

.pillars-grid .pillar p {
  color: #665B63 !important;
  font-size: 15px !important;
  line-height: 1.65 !important;
  margin: 0 !important;
}

.pillars-grid .pillar:hover {
  background: #EADDE7 !important;
  border-color: #DCC9D8 !important;
  transform: translateY(-3px);
}

/* Tablet: dos columnas */
@media (max-width: 900px) {
  .pillars-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Móvil: una columna */
@media (max-width: 600px) {
  .pillars-grid {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .pillars-grid .pillar {
    padding: 22px !important;
  }
}
/* =========================================================
   BLOQUE 5: SECCIÓN QUÉ HACEMOS
   ========================================================= */

.what-unified-section {
  background: #F1E9EF !important;
  padding: 80px 0 !important;
}

/* Presentación institucional */

.what-unified-section .authority-grid {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 70px;
  align-items: center;
  margin-bottom: 42px !important;
}

.what-unified-section .authority-lead h2 {
  color: #54243F !important;
}

.what-unified-section .authority-copy p {
  color: #665B63 !important;
}

/* Encabezado de las líneas de trabajo */

.what-unified-section .what-unified-heading {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  align-items: end;
  margin-bottom: 18px !important;
}

.what-unified-section .what-unified-heading h3 {
  color: #54243F !important;
  font-size: 25px !important;
  margin: 12px 0 0 !important;
}

.what-unified-section .what-unified-heading .section-intro {
  color: #665B63 !important;
  margin: 0 !important;
}

/* Cuatro líneas de trabajo */

.what-unified-section .pillars-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 18px !important;
  align-items: stretch !important;
  margin-bottom: 42px !important;
}

.what-unified-section .pillar {
  background: #EADDE7 !important;
  border: 1px solid #DCC9D8 !important;
  border-radius: 14px !important;
  padding: 25px 22px !important;
  min-width: 0;
  box-sizing: border-box;
  transition: background-color 0.25s ease,
              transform 0.25s ease;
}

.what-unified-section .pillar:hover {
  background: #E2D0DE !important;
  transform: translateY(-3px);
}

.what-unified-section .pillar > span {
  display: block;
  color: #92718B !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  margin-bottom: 24px !important;
}

.what-unified-section .pillar h3 {
  color: #54243F !important;
  font-size: 18px !important;
  margin: 0 0 12px !important;
}

.what-unified-section .pillar p {
  color: #665B63 !important;
  font-size: 15px !important;
  line-height: 1.65 !important;
  margin: 0 !important;
}

/* Cierre visual con fotografía */

.what-unified-section .training-visual {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  align-items: center !important;
  gap: 36px !important;
  background: #FBF7F2 !important;
  border: 1px solid #E8DDE3 !important;
  border-radius: 20px !important;
  padding: 18px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

.what-unified-section .training-visual img {
  display: block;
  width: 100% !important;
  height: 310px !important;
  object-fit: cover !important;
  border-radius: 14px !important;
}

.what-unified-section .training-visual-copy {
  padding: 25px 30px 25px 0;
}

.what-unified-section .training-visual-copy h3 {
  color: #54243F !important;
  font-size: 30px !important;
  line-height: 1.2 !important;
  margin: 12px 0 16px !important;
}

.what-unified-section .training-visual-copy > p:not(.eyebrow) {
  color: #665B63 !important;
  font-size: 15px !important;
  line-height: 1.65 !important;
  margin-bottom: 24px !important;
}

/* Tablet */

@media (max-width: 900px) {
  .what-unified-section .authority-grid {
    grid-template-columns: 1fr 1fr;
    gap: 30px;
  }

  .what-unified-section .pillars-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .what-unified-section .training-visual {
    gap: 22px !important;
  }

  .what-unified-section .training-visual-copy {
    padding: 15px 15px 15px 0;
  }

  .what-unified-section .training-visual-copy h3 {
    font-size: 25px !important;
  }
}

/* Móvil: ajustes finales consolidados */

@media (max-width: 600px) {
  .what-unified-section {
    padding: 55px 0 !important;
  }

  .what-unified-section .authority-grid,
  .what-unified-section .what-unified-heading {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .what-unified-section .authority-grid {
    margin-bottom: 28px !important;
  }

  .what-unified-section .what-unified-heading {
    gap: 10px !important;
    margin-bottom: 16px !important;
  }

  .what-unified-section .what-unified-heading h3 {
    font-size: 22px !important;
    line-height: 1.3 !important;
    margin-top: 8px !important;
  }

  .what-unified-section .what-unified-heading .section-intro {
    font-size: 15px !important;
    line-height: 1.6 !important;
  }

  .what-unified-section .pillars-grid {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    margin-bottom: 28px !important;
  }

  .what-unified-section .pillar {
    padding: 22px !important;
  }

  .what-unified-section .training-visual {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    padding: 12px !important;
  }

  .what-unified-section .training-visual img {
    height: 190px !important;
    object-fit: cover !important;
    object-position: center 40% !important;
  }

  .what-unified-section .training-visual-copy {
    padding: 12px 10px 16px !important;
  }

  .what-unified-section .training-visual-copy h3 {
    font-size: 23px !important;
    line-height: 1.25 !important;
  }

  .what-unified-section .training-visual-copy > p:not(.eyebrow) {
    font-size: 14px !important;
    line-height: 1.6 !important;
    margin-bottom: 20px !important;
  }
}
/* =========================================================
   BLOQUE 6: COOPERACIÓN INSTITUCIONAL
   ========================================================= */

.institutional-copy h2 {
  max-width: 620px;
  font-size: clamp(36px, 3.2vw, 46px) !important;
  line-height: 1.15 !important;
}

.institutional-copy > p:not(.eyebrow) {
  line-height: 1.7;
}

.institutional-copy .check-list {
  margin-top: 24px;
  margin-bottom: 28px;
}

.institutional-copy .check-list li {
  line-height: 1.5;
  padding-top: 11px;
  padding-bottom: 11px;
}

/* Botones */
.institutional-copy .btn {
  margin-top: 10px !important;
  margin-bottom: 12px !important;
}

/* Adaptación móvil */
@media (max-width: 600px) {
  .institutional-copy h2 {
    font-size: 30px !important;
    line-height: 1.2 !important;
  }

  .institutional-copy .check-list {
    margin-top: 20px;
    margin-bottom: 24px;
  }

  .institutional-copy .btn {
    margin-top: 12px !important;
    margin-bottom: 8px !important;
  }
}
/* =========================================================
   BLOQUE 7: APORTES Y PATROCINIO
   ========================================================= */

/* Fondo general de la sección */
.sponsorship-section {
  background-color: #F1E9EF !important;
  padding-top: 90px !important;
  padding-bottom: 90px !important;
}

/* Tarjeta de apoyo */
.sponsorship-section .sponsorship-note {
  background-color: #EAD8E2 !important;
  border: 1px solid #E2CFDC !important;
  border-radius: 18px !important;
  overflow: hidden;
}

/* Fotografía */
.sponsorship-section .sponsorship-image {
  display: block;
  width: 100%;
  object-fit: cover;
}

/* Símbolo decorativo */
.sponsorship-section .sponsorship-symbol {
  color: #92718B !important;
}

/* Títulos */
.sponsorship-section h2,
.sponsorship-section h3 {
  color: #54243F !important;
}

/* Textos */
.sponsorship-section p {
  color: #665B63;
  line-height: 1.7;
}

/* Enlaces y botones */
.sponsorship-section .btn-primary {
  margin-top: 12px;
}

.sponsorship-section .text-link {
  color: #54243F !important;
}

/* Adaptación móvil */
@media (max-width: 600px) {
  .sponsorship-section {
    padding-top: 55px !important;
    padding-bottom: 55px !important;
  }

  .sponsorship-section .sponsorship-note {
    border-radius: 18px !important;
  }
}
/* =========================================================
   BLOQUE 8: CTA DE PROYECTOS
   ========================================================= */

/* Llamado a la acción */
.projects-cta {
  margin-top: 32px;
  padding: 30px 34px;
  background: #F1E9EF;
  border: 1px solid #E8DDE3;
  border-radius: 16px;
  text-align: center;
}

/* Título */
.projects-cta h3 {
  color: #54243F !important;
  font-size: 24px !important;
  margin: 0 0 10px !important;
}

/* Texto */
.projects-cta p {
  color: #665B63 !important;
  max-width: 680px;
  margin: 0 auto 20px !important;
  line-height: 1.65;
}

/* Botón */
.projects-cta .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Tarjetas de proyectos */
.projects-section .project-card {
  display: flex;
  flex-direction: column;
}

.projects-section .project-card a {
  display: inline-block;
  width: fit-content;
  margin-top: auto;
  padding-top: 22px;
  font-weight: 700;
}

/* Adaptación móvil */
@media (max-width: 600px) {
  .projects-cta {
    padding: 26px 20px;
    margin-top: 24px;
  }

  .projects-cta h3 {
    font-size: 21px !important;
  }

  .projects-cta .btn {
    width: 100%;
  }
}

/* =========================================================
   FCVV — NAVEGACIÓN PRINCIPAL DEFINITIVA
   Escritorio + menú móvil
   ========================================================= */

/* ESCRITORIO */
@media (min-width: 901px) {

  .desktop-nav {
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;
    white-space: nowrap !important;
    font-size: 0.78rem !important;
  }

  .desktop-nav > a.nav-help,
  .desktop-nav > a.nav-noticias,
  .desktop-nav > a.nav-observatorio,
  .desktop-nav > .nav-dropdown > .nav-dropdown-toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 11px !important;
    margin: 0 !important;
    border-radius: 7px !important;
    font-family: inherit !important;
    font-size: 0.78rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    text-decoration: none !important;
  }

  /* Elimina los fondos sobredimensionados anteriores */
  .desktop-nav a.nav-help::before,
  .desktop-nav a.nav-observatorio::before,
  header a[href*="observatorio"]::before {
    display: none !important;
    content: none !important;
  }

  /* Ayuda */
  .desktop-nav > a.nav-help {
    background: #54243F !important;
    color: #FFFFFF !important;
  }

  .desktop-nav > a.nav-help:hover {
    background: #75445F !important;
  }

  /* Observatorio */
  .desktop-nav > a.nav-observatorio {
    background: #92718B !important;
    color: #FBF7F2 !important;
  }

  .desktop-nav > a.nav-observatorio:hover {
    background: #75445F !important;
  }

  /* Noticias */
  .desktop-nav > a.nav-noticias {
    background: #EADDE7 !important;
    color: #54243F !important;
  }

  .desktop-nav > a.nav-noticias:hover {
    background: #DCC9D8 !important;
  }

  /* Botón Más */
  .desktop-nav > .nav-dropdown {
    display: inline-flex !important;
    align-items: center !important;
    position: relative !important;
  }

  .desktop-nav .nav-dropdown-toggle {
    background: transparent !important;
    color: #54243F !important;
    border: 1px solid #E8DDE3 !important;
    cursor: pointer !important;
  }

  .desktop-nav .nav-dropdown-toggle:hover,
  .desktop-nav .nav-dropdown:focus-within .nav-dropdown-toggle {
    background: #F1E9EF !important;
  }

  /* Desplegable */
  .desktop-nav .nav-dropdown-menu {
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    min-width: 235px;
    padding: 10px;
    background: #FBF7F2;
    border: 1px solid #E8DDE3;
    border-radius: 12px;
    box-shadow: 0 12px 30px rgba(84,36,63,.15);
    z-index: 50;
  }

  .desktop-nav .nav-dropdown:hover .nav-dropdown-menu,
  .desktop-nav .nav-dropdown:focus-within .nav-dropdown-menu {
    display: grid;
  }

  .desktop-nav .nav-dropdown-menu a {
    display: block;
    padding: 11px 12px;
    border-radius: 7px;
    color: #54243F;
    white-space: normal;
  }

  .desktop-nav .nav-dropdown-menu a:hover,
  .desktop-nav .nav-dropdown-menu a:focus {
    background: #F1E9EF;
    color: #54243F !important;
  }
}

/* AJUSTE PARA ESCRITORIOS MÁS ESTRECHOS */
@media (min-width: 901px) and (max-width: 1150px) {
  .site-header {
    gap: 12px !important;
    padding-left: 3% !important;
    padding-right: 3% !important;
  }

  .brand-logo {
    width: 190px;
  }

  .desktop-nav {
    gap: 7px !important;
    font-size: 0.74rem !important;
  }

  .desktop-nav > a.nav-help,
  .desktop-nav > a.nav-noticias,
  .desktop-nav > a.nav-observatorio,
  .desktop-nav > .nav-dropdown > .nav-dropdown-toggle {
    padding-left: 8px !important;
    padding-right: 8px !important;
    font-size: 0.74rem !important;
  }
}

/* MENÚ MÓVIL: CONSERVAR SU PRESENTACIÓN */
@media (max-width: 900px) {

  .desktop-nav {
    display: none !important;
  }

  .site-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 12px !important;
  }

  .site-header .menu-btn {
    display: block !important;
    flex-shrink: 0 !important;
    position: relative !important;
    z-index: 40 !important;
  }

  .site-header .brand {
    min-width: 0 !important;
    flex: 1 1 auto !important;
  }

  .site-header .brand-logo {
    width: min(68vw, 235px) !important;
    max-height: 52px !important;
  }

  .mobile-menu.open {
    display: grid !important;
  }

  .mobile-menu .nav-help {
    background: #54243F !important;
    color: #FFFFFF !important;
    padding: 12px 14px !important;
    border-radius: 8px;
    margin: 5px 0;
  }

  .mobile-menu .nav-observatorio {
    background: #92718B !important;
    color: #FBF7F2 !important;
    padding: 12px 14px !important;
    border-radius: 8px;
    margin: 5px 0;
  }

  .mobile-menu .nav-noticias {
    background: #EADDE7 !important;
    color: #54243F !important;
    padding: 12px 14px !important;
    border-radius: 8px;
    margin: 5px 0;
  }

  .mobile-menu .nav-help:hover {
    background: #75445F !important;
    color: #FFFFFF !important;
  }

  .mobile-menu .nav-observatorio:hover {
    background: #75445F !important;
    color: #FFFFFF !important;
  }

  .mobile-menu .nav-noticias:hover {
    background: #DCC9D8 !important;
    color: #54243F !important;
  }
}


/* FCVV — Ajuste fino de pastillas de navegación */
@media (min-width: 901px) {

  .desktop-nav > a.nav-help,
  .desktop-nav > a.nav-noticias,
  .desktop-nav > a.nav-observatorio,
  .desktop-nav > .nav-dropdown > .nav-dropdown-toggle {
    height: auto !important;
    min-height: 0 !important;
    padding: 3px 7px !important;
    font-size: 0.76rem !important;
    line-height: 1.15 !important;
    border-radius: 6px !important;
  }

  .desktop-nav {
    gap: 8px !important;
  }
}
