/*
 * GARCÍA CANDO · R5.11
 * FONDO DETRÁS DE LA BARRA SUPERIOR · comportamiento equivalente a Real Estate.
 *
 * Principio:
 * - la barra superior NO reserva una franja opaca para el fondo;
 * - el fondo/cortinilla comienza físicamente en y=0 de la página;
 * - sólo el contenido conserva su zona segura;
 * - Node conserva el final de la fotografía exactamente en la línea de la firma.
 */

:root{
  --gc511-learn-top-gap:0px;
  --gc511-node-top-gap:0px;
}

/* La barra permanece flotante sobre el fondo, como en Real Estate. */
body.gc76-learn-page > .gc503-global-header,
body[data-gc-page="radix"] > .gc503-global-header,
body:not([data-gc-page]) > .gc503-global-header{
  position:fixed!important;
  z-index:9990!important;
}

/* =========================================================
   LEARN
   La cortinilla real (.gc410-curtain) se extiende hacia arriba
   exactamente la distancia entre el inicio del documento y el hero.
   No se mueve título, texto, tarjeta editorial ni biblioteca.
   ========================================================= */
body.gc76-learn-page .gc76-learn-hero[data-learn-curtain]{
  overflow:visible!important;
  isolation:isolate!important;
}
body.gc76-learn-page .gc76-learn-hero[data-learn-curtain] > .gc410-curtain{
  inset:auto 0 0 0!important;
  top:calc(-1 * var(--gc511-learn-top-gap))!important;
  width:100%!important;
  height:auto!important;
  min-height:calc(100% + var(--gc511-learn-top-gap))!important;
  border-radius:0!important;
  overflow:hidden!important;
}
/* Evita que una capa de fondo del main vuelva a tapar la extensión superior. */
body.gc76-learn-page > main,
body.gc76-learn-page > main > .gc76-learn-hero{
  background-color:transparent!important;
}

/* =========================================================
   NODE
   La fotografía ocupa desde y=0 hasta el borde inferior de .node-shell.
   .node-shell termina justo antes de la firma, por lo que la fotografía
   termina exactamente en la línea divisoria del footer.
   ========================================================= */
body:not([data-gc-page]) .node-shell{
  overflow:visible!important;
}
body:not([data-gc-page]) .node-visual{
  inset:auto 0 0 0!important;
  top:calc(-1 * var(--gc511-node-top-gap))!important;
  width:100%!important;
  height:auto!important;
  min-height:calc(100% + var(--gc511-node-top-gap))!important;
}
body:not([data-gc-page]) .node-visual-sticky,
body:not([data-gc-page]) .node-photo{
  inset:0!important;
  width:100%!important;
  height:100%!important;
  min-height:100%!important;
}
/* La firma nunca recibe la imagen. */
body:not([data-gc-page]) .gc510-node-signature{
  position:relative!important;
  z-index:20!important;
  background:#040505!important;
}
body:not([data-gc-page]) .gc510-node-signature .gc503-footer{
  border-top:1px solid rgba(255,255,255,.12)!important;
  background:#040505!important;
}

/* =========================================================
   RADIX
   El fondo oscuro/morado cubre el documento desde el borde superior.
   El contenido no se desplaza; la barra simplemente flota por encima.
   ========================================================= */
html:has(body[data-gc-page="radix"]),
body[data-gc-page="radix"]{
  background:#08080e!important;
}
body[data-gc-page="radix"]::before{
  top:0!important;
}
body[data-gc-page="radix"] > main,
body[data-gc-page="radix"] .rx-hero{
  background-color:transparent!important;
}

@media(max-width:900px){
  body.gc76-learn-page .gc76-learn-hero[data-learn-curtain] > .gc410-curtain{
    top:calc(-1 * var(--gc511-learn-top-gap))!important;
    min-height:calc(100% + var(--gc511-learn-top-gap))!important;
  }
  body:not([data-gc-page]) .node-visual{
    top:calc(-1 * var(--gc511-node-top-gap))!important;
    min-height:calc(100% + var(--gc511-node-top-gap))!important;
  }
}