/* =====================================================
   FPUC — Header
   -----------------------------------------------------
   Utility bar, nav principal, submenús y las variantes montada (--overlay) y sobre banda (--band). Compartido por las 8 páginas: cambiarlo las afecta a todas.

   Sólo var(--fpuc-*): ni un hex ni un tamaño literal.
   ===================================================== */


.fpuc-skip-link {
  position: absolute;
  left: -9999px;
  z-index: 100;
  padding: var(--fpuc-space-3) var(--fpuc-space-5);
  background: var(--fpuc-navy);
  color: var(--fpuc-text-on-dark);
}
.fpuc-skip-link:focus { left: var(--fpuc-space-3); top: var(--fpuc-space-3); }

.fpuc-siteheader { position: relative; z-index: 30; }

/* En la Home y en las internas de banda el header se monta sobre el hero: el
   diseño no deja franja blanca entre la utility bar y el color. */
.fpuc-siteheader--overlay { position: absolute; inset-inline: 0; top: 0; }
.fpuc-siteheader--overlay .fpuc-nav { background: transparent; }
.fpuc-siteheader--overlay .fpuc-menu > li > a,
.fpuc-siteheader--overlay .fpuc-nav__toggle { color: var(--fpuc-text-on-dark); }
/* Mismo caso que en el footer: logo oscuro sobre la foto del hero. */
.fpuc-siteheader--overlay .fpuc-nav__logo img { filter: brightness(0) invert(1); }
/* Montado, el logo va grande (y91→y204) y el nav más aireado para que el menú
   quede a su altura (y150). */
.fpuc-siteheader--overlay .fpuc-nav__inner { padding-block: var(--fpuc-nav-pad); }
.fpuc-siteheader--overlay .fpuc-nav__logo img { height: var(--fpuc-nav-logo); }
/* Sobre la banda de color de las internas el botón "Dona" es azul, no coral
   (equipo.pdf y120, 103×42). En la Home sigue coral. */
.fpuc-siteheader--band .fpuc-btn--donate { background: var(--fpuc-action-alt); }

/* Al hacer scroll el header se vuelve sólido y compacto, y el logo recupera
   su color y su tamaño de barra. */
.fpuc-siteheader--overlay.is-scrolled {
  position: fixed;
  background: var(--fpuc-surface);
  box-shadow: var(--fpuc-shadow-md);
}
.fpuc-siteheader--overlay.is-scrolled .fpuc-utility { display: none; }
.fpuc-siteheader--overlay.is-scrolled .fpuc-menu > li > a,
.fpuc-siteheader--overlay.is-scrolled .fpuc-nav__toggle { color: var(--fpuc-text); }
.fpuc-siteheader--overlay.is-scrolled .fpuc-nav__logo img { filter: none; height: 64px; }
.fpuc-siteheader--overlay.is-scrolled .fpuc-nav__inner { padding-block: var(--fpuc-space-3); }
.fpuc-siteheader--overlay.is-scrolled .fpuc-btn--donate { background: var(--fpuc-action-donate); }

/* --- Utility bar (y0, alto 39px) --- */
.fpuc-utility {
  background: var(--fpuc-surface-utility);
  color: var(--fpuc-text-on-dark);
  font-size: var(--fpuc-text-meta);
}
.fpuc-utility__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--fpuc-space-4);
  max-width: var(--fpuc-container);
  min-height: var(--fpuc-utility-height);
  margin-inline: auto;
  padding-inline: var(--fpuc-space-5);
}
.fpuc-utility a {
  color: inherit;
  text-decoration: none;
  opacity: 0.9;
}
.fpuc-utility a:hover { opacity: 1; }
.fpuc-utility__tools { display: flex; flex-wrap: wrap; gap: var(--fpuc-space-5); }

/* --- Nav principal --- */
.fpuc-nav { background: var(--fpuc-surface); }
.fpuc-nav__inner {
  display: flex;
  align-items: center;
  gap: var(--fpuc-space-5);
  max-width: var(--fpuc-container);
  margin-inline: auto;
  padding: var(--fpuc-space-3) var(--fpuc-space-5);
}
.fpuc-nav__logo { display: inline-flex; margin-right: auto; }
.fpuc-nav__logo img { height: 64px; width: auto; display: block; }

.fpuc-menu {
  display: flex;
  align-items: center;
  gap: var(--fpuc-space-6);
  padding: 0;
  margin: 0;
  list-style: none;
}
.fpuc-menu > li { position: relative; }
.fpuc-menu > li > a {
  display: inline-block;
  padding-block: var(--fpuc-space-2);
  font-family: var(--fpuc-font-body);
  font-size: var(--fpuc-text-nav);
  color: var(--fpuc-text);
  text-decoration: none;
  border-bottom: 2px solid transparent;
}
.fpuc-menu > li > a:hover,
.fpuc-menu > .current-menu-item > a,
.fpuc-menu > .current_page_item > a,
.fpuc-menu > .current-menu-ancestor > a { border-bottom-color: currentColor; }

/* Indicador de submenú: la flechita que en el diseño llevan Nosotros y
   Proyectos. `has-submenu` la pone el walker; `menu-item-has-children`, WP. */
.fpuc-menu .has-submenu > a::after,
.fpuc-menu .menu-item-has-children > a::after {
  content: "";
  display: inline-block;
  width: .4em;
  height: .4em;
  margin-left: .45em;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: translateY(-2px) rotate(45deg);
}

/* Submenú */
.fpuc-menu .submenu,
.fpuc-menu .sub-menu {
  position: absolute;
  left: 0;
  top: 100%;
  min-width: 220px;
  padding: var(--fpuc-space-3) 0;
  margin: 0;
  list-style: none;
  background: var(--fpuc-surface);
  box-shadow: var(--fpuc-shadow-md);
  border-radius: var(--fpuc-radius-sm);
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--fpuc-transition);
}
.fpuc-menu li:hover > .submenu,
.fpuc-menu li:hover > .sub-menu,
.fpuc-menu li:focus-within > .submenu,
.fpuc-menu li:focus-within > .sub-menu { opacity: 1; visibility: visible; }
.fpuc-menu .submenu a,
.fpuc-menu .sub-menu a {
  display: block;
  padding: var(--fpuc-space-2) var(--fpuc-space-5);
  font-size: var(--fpuc-text-small);
  color: var(--fpuc-text);
  text-decoration: none;
}
.fpuc-menu .submenu a:hover,
.fpuc-menu .sub-menu a:hover { background: var(--fpuc-surface-alt); }

.fpuc-nav__toggle {
  display: none;
  padding: var(--fpuc-space-2);
  border: 0;
  background: none;
  color: var(--fpuc-text);
  font-size: var(--fpuc-text-eyebrow);
  cursor: pointer;
}

@media (max-width: 1000px) {
  .fpuc-nav__toggle { display: block; order: 3; }
  .fpuc-nav__menu {
    order: 4;
    flex-basis: 100%;
    display: none;
  }
  .fpuc-nav__menu.is-open { display: block; }
  .fpuc-menu { flex-direction: column; align-items: flex-start; gap: var(--fpuc-space-3); }
  .fpuc-menu .submenu,
  .fpuc-menu .sub-menu {
    position: static;
    opacity: 1;
    visibility: visible;
    box-shadow: none;
    padding-left: var(--fpuc-space-4);
  }
  .fpuc-siteheader--overlay { position: static; }
  .fpuc-siteheader--overlay .fpuc-nav { background: var(--fpuc-surface); }
  .fpuc-siteheader--overlay .fpuc-menu > li > a,
  .fpuc-siteheader--overlay .fpuc-nav__toggle { color: var(--fpuc-text); }
  /* Al dejar de estar montado, el logo vuelve a su tamaño de barra y el hero
     pierde el hueco que le reservaba. */
  .fpuc-siteheader--overlay .fpuc-nav__inner { padding-block: var(--fpuc-space-3); }
  .fpuc-siteheader--overlay .fpuc-nav__logo img { height: 64px; filter: none; }
  .fpuc-siteheader--band .fpuc-btn--donate { background: var(--fpuc-action-donate); }
  .fpuc-utility__tools { gap: var(--fpuc-space-3); }
}