/* =====================================================================
   REAZZIONA · BASE STYLES
   Reset modernizado + globals + utilidades
   ===================================================================== */

*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; padding: 0; }

:root {
  --rzz-header-height: 94px;
}
@media (max-width: 1180px) {
  :root {
    --rzz-header-height: 74px;
  }
}

html {
  font-family: var(--rzz-font-sans);
  font-size: 16px;
  line-height: 1.55;
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

body {
  background-color: var(--rzz-blanco);
  color: var(--rzz-azul-oscuro);
  font-family: var(--rzz-font-sans);
  font-size: var(--rzz-text-base);
  line-height: 1.55;
  letter-spacing: -0.005em;
  min-height: 100vh;
  overflow-x: hidden;
}

/* Lenis smooth-scroll setup */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: clip; }
.lenis.lenis-smooth iframe { pointer-events: none; }

/* Imágenes y media */
img, picture, video, canvas, svg { display: block; max-width: 100%; height: auto; }
img { font-style: italic; background-repeat: no-repeat; background-size: cover; shape-margin: 1rem; }

/* Forms */
input, button, textarea, select { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: none; }

/* Headings */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--rzz-font-sans);
  font-weight: var(--rzz-fw-bold);
  color: var(--rzz-azul-oscuro);
  letter-spacing: -0.02em;
  line-height: 1.1;
  text-wrap: balance;
}

h1 { font-size: var(--rzz-text-5xl); letter-spacing: -0.025em; }
h2 { font-size: var(--rzz-text-3xl); }
h3 { font-size: var(--rzz-text-2xl); letter-spacing: -0.015em; }
h4 { font-size: var(--rzz-text-xl); letter-spacing: -0.01em; }
h5 { font-size: var(--rzz-text-lg); }
h6 { font-size: var(--rzz-text-base); }

p { text-wrap: pretty; max-width: 70ch; }

a {
  color: var(--rzz-azul-principal);
  text-decoration: none;
  transition: color var(--rzz-motion-fast) var(--rzz-ease-out-quint);
}
a:hover { color: var(--rzz-verde-principal); }

/* Focus accesible.
   El anillo combina outline (marca) + box-shadow de doble color. El box-shadow
   es clave por dos motivos: (1) blanco+azul-noche garantiza contraste sobre
   CUALQUIER fondo (claro, lima/verde o azul oscuro), donde un solo color
   desaparecería; (2) sobrevive a los `outline: none` que aplican varios
   componentes interactivos (formularios, simulador, FAQ, comparador, mapa),
   de modo que el foco de teclado nunca queda invisible. */
:focus-visible {
  outline: 2px solid var(--rzz-verde-principal);
  outline-offset: 2px;
  box-shadow:
    0 0 0 2px var(--rzz-blanco),
    0 0 0 4px var(--rzz-azul-noche);
  border-radius: var(--rzz-radius-xs);
}

/* Sobre fondos oscuros invertimos el orden de los colores del anillo para
   mantener el máximo contraste. */
.has-azul-noche-background-color :focus-visible,
.has-azul-oscuro-background-color :focus-visible {
  box-shadow:
    0 0 0 2px var(--rzz-azul-noche),
    0 0 0 4px var(--rzz-blanco);
}

::selection {
  background: var(--rzz-verde-soft-strong);
  color: var(--rzz-azul-oscuro);
}

/* Skip link accesible */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 1rem;
  z-index: 9999;
  padding: 0.5rem 1rem;
  background: var(--rzz-azul-oscuro);
  color: var(--rzz-blanco);
  border-radius: var(--rzz-radius-sm);
}
.skip-link:focus { left: 1rem; }

/* Container utility */
.rzz-container {
  width: 100%;
  max-width: var(--rzz-content-max);
  margin-inline: auto;
  padding-inline: var(--rzz-space-6);
}

.rzz-academy-home-banner {
  width: min(100% - 2rem, 1180px);
  margin: clamp(1.5rem, 4vw, 3rem) auto;
}

.rzz-academy-home-banner__link {
  display: block;
  overflow: hidden;
  border-radius: clamp(1.2rem, 2vw, 2rem);
  background: #f5f8ef;
  box-shadow: 0 28px 70px rgba(30, 53, 80, 0.14);
  transition: transform 0.24s ease, box-shadow 0.24s ease;
}

.rzz-academy-home-banner picture,
.rzz-academy-home-banner img,
.rzz-academy-home-banner__media {
  display: block;
  width: 100%;
}

.rzz-academy-home-banner img,
.rzz-academy-home-banner__media {
  height: auto;
  background: transparent;
}

/* El banner pasó de GIF (≈122 MB) a vídeo MP4 (≈2.7 MB). Mostramos la pieza
   horizontal en desktop y la vertical en móvil con un simple toggle CSS. */
.rzz-academy-home-banner__media--mobile {
  display: none;
}

.rzz-academy-home-banner__link:hover {
  transform: translateY(-2px);
  box-shadow: 0 34px 80px rgba(30, 53, 80, 0.18);
}

.rzz-liveavatar {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: max(clamp(0.85rem, 2vw, 1.5rem), env(safe-area-inset-bottom));
  z-index: 90;
  width: clamp(150px, 15vw, 230px);
  max-width: calc(100vw - 2rem);
  pointer-events: auto;
}

.rzz-liveavatar__frame {
  display: block;
  width: 100%;
  height: auto;
  border: 0;
  border-radius: var(--rzz-radius-xl);
  background: var(--rzz-azul-noche);
  box-shadow: 0 24px 70px rgba(30, 53, 80, 0.24);
}

.lenis.lenis-smooth .rzz-liveavatar iframe {
  pointer-events: auto;
}

/* Modo PÁGINA (/ayuda/video/): el avatar va EMBEBIDO en el stage de la página,
   no flotante. Lo movemos al .rzz-assistant-stage con JS y aquí lo dejamos
   in-flow, centrado, como protagonista del contenido. */
.rzz-liveavatar--page {
  position: relative;
  left: auto;
  right: auto;
  bottom: auto;
  transform: none;
  margin: 0 auto;
  width: min(340px, 86vw);
  z-index: auto;
}

/* Version flotante y minimizada global del LiveAvatar */
.rzz-liveavatar--floating {
  position: fixed !important;
  right: 1.5rem !important;
  left: auto !important;
  bottom: 1.5rem !important;
  transform: none !important;
  width: clamp(180px, 18vw, 240px) !important;
  z-index: 10000 !important;
  transition: width 0.3s cubic-bezier(0.25, 1, 0.5, 1), height 0.3s cubic-bezier(0.25, 1, 0.5, 1), border-radius 0.3s cubic-bezier(0.25, 1, 0.5, 1), box-shadow 0.3s cubic-bezier(0.25, 1, 0.5, 1) !important;
}

.rzz-liveavatar--floating.rzz-liveavatar--minimized {
  width: 72px !important;
  height: 72px !important;
  border-radius: 50% !important;
  box-shadow: 0 8px 32px rgba(30, 53, 80, 0.35) !important;
  cursor: pointer !important;
  overflow: visible !important;
  background: var(--rzz-azul-noche, #1E3550) !important;
  border: 3px solid var(--rzz-verde-lima, #BED600) !important;
}

.rzz-liveavatar--floating.rzz-liveavatar--minimized::before {
  content: '' !important;
  position: absolute !important;
  inset: -3px !important;
  border-radius: 50% !important;
  border: 3px solid var(--rzz-verde-lima, #BED600) !important;
  animation: rzz-pulse-ring 1.8s cubic-bezier(0.215, 0.61, 0.355, 1) infinite !important;
  pointer-events: none !important;
}

@keyframes rzz-pulse-ring {
  0% { transform: scale(0.95); opacity: 1; }
  100% { transform: scale(1.3); opacity: 0; }
}

/* Burbuja de Ayuda dentro del globo minimizado */
.rzz-liveavatar__bubble {
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  color: #ffffff;
  padding: 4px;
  box-sizing: border-box;
}

.rzz-liveavatar--minimized .rzz-liveavatar__bubble {
  display: flex !important;
}

.rzz-liveavatar__bubble-icon {
  width: 24px;
  height: 24px;
  color: var(--rzz-verde-lima, #BED600);
  margin-bottom: 2px;
}

.rzz-liveavatar__bubble-text {
  font-size: 0.64rem;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  line-height: 1;
}

.rzz-liveavatar--floating .rzz-liveavatar__frame {
  transition: opacity 0.3s ease;
}

.rzz-liveavatar--floating.rzz-liveavatar--minimized .rzz-liveavatar__frame {
  opacity: 0 !important;
  pointer-events: none !important;
  height: 0 !important;
  width: 0 !important;
  overflow: hidden;
}

/* Botones de control flotantes */
.rzz-liveavatar__close,
.rzz-liveavatar__minimize {
  position: absolute !important;
  z-index: 25 !important;
  width: 22px !important;
  height: 22px !important;
  border-radius: 50% !important;
  background: var(--rzz-azul-noche, #1E3550) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  color: #ffffff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3) !important;
  transition: transform 0.2s, background 0.2s !important;
}

.rzz-liveavatar__close {
  font-size: 14px !important;
  line-height: 1 !important;
}

.rzz-liveavatar__minimize {
  font-size: 16px !important;
  line-height: 0.8 !important;
}

/* Posición de la cruz de cerrar cuando está minimizado */
.rzz-liveavatar--minimized .rzz-liveavatar__close {
  top: -6px !important;
  right: -6px !important;
}

/* Ocultar botón de minimizar en estado cerrado */
.rzz-liveavatar--minimized .rzz-liveavatar__minimize {
  display: none !important;
}

/* Colocación de los botones de cerrar y minimizar al expandirse */
.rzz-liveavatar--floating:not(.rzz-liveavatar--minimized) .rzz-liveavatar__close {
  top: 10px !important;
  right: 10px !important;
  width: 26px !important;
  height: 26px !important;
  font-size: 18px !important;
}

.rzz-liveavatar--floating:not(.rzz-liveavatar--minimized) .rzz-liveavatar__minimize {
  top: 10px !important;
  right: 42px !important;
  width: 26px !important;
  height: 26px !important;
  font-size: 18px !important;
}

.rzz-liveavatar__close:hover {
  background: #ff4d4d !important;
  transform: scale(1.1) !important;
}

.rzz-liveavatar__minimize:hover {
  background: var(--rzz-verde-lima, #BED600) !important;
  color: var(--rzz-azul-noche, #1E3550) !important;
  transform: scale(1.1) !important;
}

/* ---------- Asistentes EMBEBIDOS en su página (chat / voz / vídeo) ---------- */
/* El contenedor de aterrizaje: centra el widget y le da un marco sutil. */
.rzz-assistant-stage {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  min-height: 60vh;
  margin-top: clamp(1.5rem, 4vw, 2.5rem);
}

/* Cuando el widget ya está dentro, quitamos el "Cargando…" placeholder. */
.rzz-assistant-stage.is-filled::before {
  content: none;
}

/* Cualquier asistente embebido: in-flow dentro del stage (anula su posición fija). */
.rzz-assistant-stage .rzz-assistant-embed,
.rzz-assistant-stage [data-rzz-chatbot-root] {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  margin: 0 auto !important;
  z-index: auto !important;
}

/* Chat de voz (ElevenLabs web component) embebido. */
.rzz-assistant-stage elevenlabs-convai.rzz-assistant-embed {
  display: block;
  width: min(420px, 92%);
}

/* Chat de texto: dentro del stage lo dejamos relativo y siempre abierto/ancho. */
.rzz-assistant-stage [data-rzz-chatbot-root] .rzz-chatbot {
  position: static !important;
  transform: none !important;
  width: 100%;
  align-items: center;
}
.rzz-assistant-stage [data-rzz-chatbot-root] .rzz-chatbot-panel {
  width: min(480px, 92%);
  max-height: 70vh;
}
/* En la página de chat ocultamos el botón flotante "Ayuda" y los starters
   sueltos: el panel ya está embebido y abierto. */
.rzz-assistant-stage [data-rzz-chatbot-root] .rzz-chatbot-toggle,
.rzz-assistant-stage [data-rzz-chatbot-root] .rzz-chatbot-starters {
  display: none !important;
}

/* ---------- Centro de ayuda: hub + subpáginas de asistente ---------- */
.rzz-help-hub .rzz-help-cards {
  gap: clamp(1rem, 2vw, 1.5rem);
  margin-top: clamp(1.5rem, 4vw, 2.5rem);
}

.rzz-help-hub .rzz-help-cards .wp-block-column {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  padding: clamp(1.25rem, 2.4vw, 1.8rem);
  border: 1px solid rgba(96, 158, 208, 0.18);
  border-radius: 1.1rem;
  background: #ffffff;
  box-shadow: 0 18px 46px rgba(30, 53, 80, 0.08);
}

.rzz-help-hub .rzz-help-cards .wp-block-button {
  margin-top: auto;
}

.rzz-assistant-page .rzz-assistant-stage {
  min-height: 30vh;
}

.rzz-assistant-page .rzz-assistant-stage:empty::before {
  content: "Cargando asistente…";
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 30vh;
  color: rgba(30, 53, 80, 0.5);
  font-weight: 700;
}

@media (max-width: 760px) {
  .rzz-academy-home-banner {
    width: min(100% - 1rem, 540px);
  }
}

@media (max-width: 520px) {
  .rzz-liveavatar:not(.rzz-liveavatar--page) {
    width: clamp(132px, 34vw, 168px);
    left: 50%;
    transform: translateX(-50%);
    bottom: max(0.75rem, env(safe-area-inset-bottom));
  }
}

@media (max-width: 700px) {
  .rzz-academy-home-banner__media--desktop {
    display: none;
  }
  .rzz-academy-home-banner__media--mobile {
    display: block;
  }
}

/* --- Reserva de espacio + skeleton para bloques React ----------------------
   Los bloques se montan en cliente (algunos al entrar en viewport). Antes de
   hidratar, el <section data-block> solo contiene un <noscript>, así que
   colapsa y deja una banda en blanco que luego "salta" (CLS). Mientras no haya
   contenido real (detectado con :has > *:not(noscript)) reservamos altura y
   mostramos un shimmer. Excluimos heroes (montaje inmediato + fondo propio) y
   el footer. */
[data-block^="reazziona/"] {
  position: relative;
}

[data-block^="reazziona/"]:not([data-block$="hero"]):not([data-block="reazziona/footer"]):not(:has(> *:not(noscript))) {
  min-height: clamp(320px, 48vh, 560px);
  background-color: var(--rzz-gris-suave);
  background-image: linear-gradient(100deg, transparent 30%, rgba(96, 158, 208, 0.10) 50%, transparent 70%);
  background-size: 200% 100%;
  background-repeat: no-repeat;
  animation: rzz-skeleton-shimmer 1.4s ease-in-out infinite;
  border-radius: var(--rzz-radius-lg);
}

@keyframes rzz-skeleton-shimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

@media (prefers-reduced-motion: reduce) {
  [data-block^="reazziona/"]:not(:has(> *:not(noscript))) {
    animation: none;
  }
}

/* Comparador SSR (fallback de servidor; React lo reemplaza al hidratar) */
.rzz-comparador-ssr { width: min(100% - 2rem, 1200px); margin: 0 auto; padding-block: clamp(2rem, 5vw, 4rem); }
.rzz-comparador-ssr__title { font-size: clamp(1.5rem, 3vw, 2.25rem); color: var(--rzz-azul-noche); margin: 0 0 0.5rem; }
.rzz-comparador-ssr__sub { color: var(--rzz-gris-texto); margin: 0 0 2rem; max-width: 60ch; }
.rzz-comparador-ssr__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.rzz-comparador-ssr__item { border: 1px solid var(--rzz-gris-borde); border-radius: var(--rzz-radius-lg); padding: 1.25rem; background: var(--rzz-blanco); }
.rzz-comparador-ssr__badge { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: var(--rzz-azul-principal); }
.rzz-comparador-ssr__name { font-size: 1.1rem; margin: 0.4rem 0; color: var(--rzz-azul-noche); }
.rzz-comparador-ssr__price { font-weight: 700; color: var(--rzz-azul-oscuro); margin: 0 0 1rem; }
.rzz-comparador-ssr__cta { color: var(--rzz-azul-principal); font-weight: 600; text-decoration: none; }

/* Visually hidden (accesibilidad) */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* WordPress core overrides */
.wp-block-button__link {
  border-radius: var(--rzz-radius-pill);
  font-weight: var(--rzz-fw-semibold);
  transition: transform var(--rzz-motion-fast) var(--rzz-ease-out-quint),
              box-shadow var(--rzz-motion-fast) var(--rzz-ease-out-quint),
              background-color var(--rzz-motion-fast) var(--rzz-ease-out-quint);
}
.wp-block-button__link:hover {
  transform: translateY(-1px);
  box-shadow: var(--rzz-shadow-card);
}

/* Estado JS pendiente: oculta elementos con [data-rzz-animate] hasta que el JS los anima */
[data-rzz-fade-in] {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity var(--rzz-motion-base) var(--rzz-ease-out-quint),
              transform var(--rzz-motion-base) var(--rzz-ease-out-quint);
}
[data-rzz-fade-in].is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Si hay reduced-motion, mostrar inmediatamente sin animación */
@media (prefers-reduced-motion: reduce) {
  [data-rzz-fade-in] { opacity: 1; transform: none; transition: none; }
}

.rzz-site-header {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 1000;
  box-sizing: border-box;
  display: flex !important;
  /* +20% de altura respecto a los 78px previos. */
  min-height: 94px;
  align-items: center !important;
  justify-content: space-between !important;
  isolation: isolate;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.58), rgba(255, 255, 255, 0.18) 72%, rgba(255, 255, 255, 0)) !important;
  backdrop-filter: blur(4px) saturate(130%) !important;
  -webkit-backdrop-filter: blur(4px) saturate(130%) !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  flex-wrap: nowrap !important;
  gap: clamp(0.75rem, 1.6vw, 1.25rem) !important;
  padding: 1.1rem clamp(1rem, 3vw, 2.25rem) !important;
  pointer-events: none;
}

.rzz-site-header::before {
  content: "";
  position: absolute;
  inset: 0.7rem clamp(0.75rem, 2vw, 1.45rem);
  z-index: -1;
  border: 1px solid rgba(255, 255, 255, 0.62);
  border-bottom-color: rgba(30, 53, 80, 0.08);
  border-radius: 999px;
  background:
    linear-gradient(115deg, rgba(255, 255, 255, 0.82), rgba(255, 255, 255, 0.42) 42%, rgba(255, 255, 255, 0.24)),
    radial-gradient(circle at 18% 0%, rgba(96, 158, 208, 0.22), transparent 32%),
    radial-gradient(circle at 84% 20%, rgba(190, 214, 0, 0.18), transparent 28%);
  backdrop-filter: blur(22px) saturate(180%) contrast(1.04);
  -webkit-backdrop-filter: blur(22px) saturate(180%) contrast(1.04);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.86),
    inset 0 -1px 0 rgba(30, 53, 80, 0.07),
    0 18px 52px rgba(30, 53, 80, 0.13),
    0 2px 10px rgba(96, 158, 208, 0.08);
}

.rzz-site-header::after {
  content: "";
  position: absolute;
  right: clamp(2rem, 8vw, 9rem);
  bottom: 0.45rem;
  left: clamp(8rem, 19vw, 18rem);
  z-index: -1;
  height: 1px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, rgba(96, 158, 208, 0.42), rgba(190, 214, 0, 0.32), transparent);
  filter: blur(0.5px);
  opacity: 0.92;
}

.rzz-site-header > * {
  position: relative;
  z-index: 1;
  pointer-events: auto;
}

/* Offset por defecto: quitado globalmente para que el header (glass) se superponga
   sobre todos los héroes y páginas por igual. */
body:not(.block-editor-page) .wp-site-blocks {
  padding-top: 0;
}

body.admin-bar .rzz-site-header {
  top: 32px;
}

html {
  scroll-padding-top: calc(var(--rzz-header-offset, 100px) + 1rem);
}

.rzz-site-header .rzz-site-logo {
  flex: 0 0 auto;
  width: max-content !important;
  max-width: max-content !important;
  min-width: 0 !important;
  /* Más aire a la izquierda del logo (se suma al padding del header). El
     !important y el selector con .rzz-site-header ganan a `.wp-block-image{margin}`
     que WP emite inline con la misma especificidad. */
  margin: 0 0 0 clamp(1rem, 3.5vw, 3rem) !important;
  line-height: 0;
}

.rzz-site-logo img {
  width: clamp(116px, 10vw, 148px);
  height: auto;
  filter: drop-shadow(0 2px 8px rgba(30, 53, 80, 0.12));
}

/* Logo SIN píldora/caja: solo la imagen, limpia. (Antes tenía borde, fondo y
   sombra que se veían como una sub-caja dentro del header.) */
.rzz-site-logo a {
  display: inline-flex;
  align-items: center;
  min-height: 46px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  transition: transform 0.22s ease, filter 0.22s ease;
}

.rzz-site-logo a:hover {
  transform: translateY(-1px);
  filter: drop-shadow(0 4px 14px rgba(30, 53, 80, 0.18));
}

.rzz-site-header .wp-block-navigation {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
  justify-content: flex-end !important;
  margin-right: clamp(1rem, 3.5vw, 3rem) !important;
}

.rzz-site-header .wp-block-navigation__responsive-container:not(.is-menu-open) {
  display: flex !important;
  flex: 1 1 auto;
  min-width: 0;
  position: static;
}

.rzz-site-header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__responsive-container-content {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
  justify-content: flex-end;
}

.rzz-site-header .wp-block-navigation__container {
  flex-wrap: nowrap !important;
  gap: clamp(0.18rem, 0.45vw, 0.48rem) !important;
  justify-content: flex-end !important;
}

.rzz-site-header .wp-block-navigation-item {
  flex: 0 0 auto;
  white-space: nowrap;
}

.rzz-site-header .wp-block-navigation-item__content {
  color: var(--rzz-azul-noche) !important;
  font-size: clamp(0.74rem, 0.78vw, 0.88rem);
  font-weight: 700;
  line-height: 1.1;
  text-decoration: none;
  padding: 0.72rem 0.82rem;
  border: 1px solid transparent;
  border-radius: 999px;
  transition: color 0.18s ease, background 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}

.rzz-site-header .wp-block-navigation-item__content:hover {
  color: var(--rzz-verde-principal);
  border-color: rgba(255, 255, 255, 0.54);
  background: rgba(255, 255, 255, 0.38);
  transform: translateY(-1px);
}

/* ---------- "Acceder": CTA destacado ---------- */
.rzz-site-header .rzz-cta-link .wp-block-navigation-item__content {
  color: #ffffff !important;
  background: linear-gradient(135deg, var(--rzz-verde-principal, #9ac01c), #bed600);
  border-color: transparent;
  font-weight: 800;
  box-shadow: 0 8px 22px rgba(154, 192, 28, 0.28);
}

.rzz-site-header .rzz-cta-link .wp-block-navigation-item__content:hover {
  color: #1e3550 !important;
  transform: translateY(-1px);
  box-shadow: 0 12px 30px rgba(154, 192, 28, 0.38);
}

/* ---------- Active menu item highlighting ---------- */
.rzz-site-header .current-menu-item > .wp-block-navigation-item__content,
.rzz-site-header .current_page_item > .wp-block-navigation-item__content,
.rzz-site-header .current-menu-ancestor > .wp-block-navigation-item__content,
.rzz-site-header .wp-block-navigation-item.is-active > .wp-block-navigation-item__content,
.rzz-site-header .wp-block-navigation-item__content.rzz-active-nav-link {
  color: var(--rzz-verde-principal) !important;
  border-color: rgba(255, 255, 255, 0.54) !important;
  background: rgba(255, 255, 255, 0.38) !important;
}

/* ---------- Submenús desplegables (Ayuda + Idiomas) ---------- */
/* Popover tipo tarjeta en desktop. WP lo oculta/abre con su interactividad. */
.rzz-site-header .wp-block-navigation__submenu-container {
  min-width: 220px;
  padding: 0.4rem;
  border: 1px solid rgba(96, 158, 208, 0.18);
  border-radius: 0.9rem;
  background: rgba(255, 255, 255, 0.98);
  -webkit-backdrop-filter: blur(18px) saturate(160%);
  backdrop-filter: blur(18px) saturate(160%);
  box-shadow: 0 22px 54px rgba(30, 53, 80, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.rzz-site-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
  border-radius: 0.6rem;
  padding: 0.6rem 0.8rem;
  font-size: 0.82rem;
}

.rzz-site-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
  background: rgba(96, 158, 208, 0.12);
  border-color: transparent;
}

/* ---------- Selector de idiomas: icono globo ---------- */
.rzz-site-header .rzz-lang-switch > .wp-block-navigation-item__content {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  min-width: 44px;
  min-height: 44px;
  padding: 0.64rem;
  justify-content: center;
}

.rzz-site-header .rzz-lang-switch > .wp-block-navigation__submenu-container {
  right: 0;
  left: auto;
  min-width: 168px;
}

/* Oculta el texto "Idiomas" del toggle y muestra un globo. El texto queda en el
   DOM para lectores de pantalla. */
.rzz-site-header .rzz-lang-switch > .wp-block-navigation-item__content .wp-block-navigation-item__label {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.rzz-site-header .rzz-lang-switch > .wp-block-navigation-item__content::before {
  content: "";
  width: 20px;
  height: 20px;
  background-color: currentColor;
  -webkit-mask: var(--rzz-globe) center / contain no-repeat;
  mask: var(--rzz-globe) center / contain no-repeat;
}

:root {
  --rzz-globe: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18'/%3E%3Cpath d='M12 3c2.6 2.7 2.6 15.3 0 18M12 3c-2.6 2.7-2.6 15.3 0 18'/%3E%3C/svg%3E");
}

.rzz-site-header .rzz-lang-switch .wp-block-navigation-item__content {
  font-weight: 800;
}

.rzz-site-header .wp-block-navigation__responsive-container-open,
.rzz-site-header .wp-block-navigation__responsive-container-close {
  min-width: 44px;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  color: var(--rzz-azul-noche);
  border-radius: 999px;
  transition: background 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.rzz-site-header .wp-block-navigation__responsive-container-open {
  border: 1px solid rgba(255, 255, 255, 0.58);
  background:
    radial-gradient(circle at 30% 0%, rgba(190, 214, 0, 0.18), transparent 48%),
    rgba(255, 255, 255, 0.5);
  backdrop-filter: blur(18px) saturate(170%);
  -webkit-backdrop-filter: blur(18px) saturate(170%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72), 0 10px 24px rgba(30, 53, 80, 0.1);
}

@media (min-width: 783px) {
  .rzz-site-header .wp-block-navigation__responsive-container-open {
    display: none !important;
  }
}

.rzz-site-header .wp-block-navigation__responsive-container-open:hover,
.rzz-site-header .wp-block-navigation__responsive-container-close:hover {
  background: rgba(255, 255, 255, 0.68);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.84), 0 14px 30px rgba(30, 53, 80, 0.12);
  transform: translateY(-1px);
}

/* CLAVE: GSAP (enhancePageMotion) deja un `transform` (matriz identidad) en el
   header tras su animación de entrada, y el header tiene `backdrop-filter`.
   AMBOS convierten al header en bloque contenedor de sus descendientes
   `position:fixed` → el menú abierto (fixed; inset:0) se medía contra el header
   (≈74px de alto) en vez del viewport: "sin altura" y atrapado bajo el hero.
   Mientras el menú está abierto, anulamos los dos para que el overlay vuelva a
   referirse al viewport y se despliegue por encima del hero. */
.rzz-site-header:has(.wp-block-navigation__responsive-container.is-menu-open) {
  transform: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* ---------- Menú móvil: PANEL DESPLEGABLE (no overlay a pantalla completa) ----
   El contenedor abierto es una capa fija transparente que solo capta el clic
   fuera para cerrar; el menú real es un panel-tarjeta anclado arriba a la
   derecha (bajo el header) que cae con una pequeña animación. */
.rzz-site-header .wp-block-navigation__responsive-container.is-menu-open {
  z-index: 1200;
  position: fixed;
  inset: 0;
  /* CLAVE: WP core pinta `.wp-block-navigation:not(.has-background)
     .wp-block-navigation__responsive-container.is-menu-open { background:#fff }`
     con especificidad (0,4,0), que GANABA a esta regla (0,3,0) → el fondo salía
     BLANCO opaco y tapaba todo lo de detrás. Forzamos un velo translúcido para
     que el hero/página de detrás SE SIGA VIENDO (solo levemente atenuado), y el
     panel-tarjeta resalte encima. !important para vencer la regla del core. */
  background: rgba(11, 22, 40, 0.22) !important;
  -webkit-backdrop-filter: blur(1.5px) saturate(105%);
  backdrop-filter: blur(1.5px) saturate(105%);
  color: var(--rzz-azul-noche);
  animation: rzz-nav-fade 0.18s ease both;
}

.rzz-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
  box-sizing: border-box;
  /* El diálogo no ocupa toda la pantalla: empuja el panel a la esquina sup-der. */
  position: absolute;
  top: 0;
  right: 0;
  width: auto;
  min-height: 0;
  padding: 0;
}

.rzz-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
  display: block;
  /* Hueco para que el panel caiga justo debajo de la píldora del header. */
  margin-top: clamp(70px, 14vw, 84px);
  margin-right: clamp(0.65rem, 3vw, 1.1rem);
}

.rzz-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 0.18rem !important;
  width: min(86vw, 330px);
  max-height: calc(100vh - 110px);
  overflow-y: auto;
  /* Más aire interior para que los items no queden pegados a los bordes. */
  padding: 0.85rem 0.9rem;
  border: 1px solid rgba(96, 158, 208, 0.18);
  border-radius: 1.2rem;
  /* !important: el core resetea este contenedor a transparente con (0,5,0) y la
     página de detrás se traslucía a través de los items (ilegible). El panel-
     tarjeta debe ser casi opaco (glass + blur) para legibilidad TOTAL; el "ver
     lo de detrás" lo aporta el velo translúcido de alrededor, no el panel. */
  background: rgba(255, 255, 255, 0.95) !important;
  -webkit-backdrop-filter: blur(20px) saturate(160%);
  backdrop-filter: blur(20px) saturate(160%);
  box-shadow:
    0 24px 60px rgba(30, 53, 80, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
  animation: rzz-nav-drop 0.22s cubic-bezier(0.16, 1, 0.3, 1) both;
  transform-origin: top right;
}

.rzz-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
  box-sizing: border-box;
  width: 100%;
  /* Más margen a izquierda: los items respiran, no pegados al borde. */
  padding: 0.78rem 1rem;
  border: 0;
  border-radius: 0.75rem;
  background: transparent;
  box-shadow: none;
  font-size: 1.02rem;
  font-weight: 700;
  line-height: 1.15;
  color: var(--rzz-azul-noche) !important;
  transition: background 0.15s ease, color 0.15s ease;
}

/* Item de submenú (li) en fila: [label] [chevron] en la MISMA línea, y el <ul>
   anidado salta a su propia fila debajo. Sin esto, el <a> a width:100% empujaba
   el chevron a una segunda línea, y la justificación heredada del bloque Nav
   (setCascadingProperties + justifyContent:right) centraba/derechaba la fila.
   Forzamos space-between explícito para que el label vaya a la izquierda y la
   flecha a la derecha, en una sola línea. */
.rzz-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
}
.rzz-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu > .wp-block-navigation-item__content {
  flex: 1 1 auto !important;
  width: auto !important;
  justify-content: flex-start !important;
  text-align: left !important;
}
.rzz-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu > .wp-block-navigation__submenu-icon {
  margin-left: 0.4rem;
}
.rzz-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu > .wp-block-navigation__submenu-container {
  flex: 1 1 100% !important;
}

/* Submenús dentro del panel móvil: lista anidada, NO popover absoluto, y
   COLAPSADOS por defecto. WP los abre poniendo aria-expanded="true" en el toggle
   (controla la visibilidad vía .is-menu-open del propio submenu). Respetamos ese
   estado en vez de forzarlos siempre visibles (antes quedaban desplegados). */
.rzz-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
  position: static !important;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0 0 0 0.65rem;
  border: 0;
  border-left: 2px solid rgba(96, 158, 208, 0.22);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  /* Colapsado: altura 0 con transición; el item de WP marca .is-open al abrir.
     CLAVE: el core fuerza `overflow: visible` con más especificidad → con
     max-height:0 los <li> hijos (Chat IA, etc.) SE DESBORDABAN y se pintaban
     igualmente (la "columna fantasma" a la derecha). overflow:hidden !important
     recorta de verdad el contenedor colapsado. */
  display: block !important;
  overflow: hidden !important;
  max-height: 0;
  opacity: 0;
  transition: max-height 0.28s ease, opacity 0.2s ease, margin 0.28s ease;
}

/* Abierto: WP añade .is-menu-open al <li> del submenú (o aria-expanded al botón). */
.rzz-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu.is-menu-open > .wp-block-navigation__submenu-container,
.rzz-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu:has(> .wp-block-navigation__submenu-icon[aria-expanded="true"]) > .wp-block-navigation__submenu-container {
  max-height: 60vh;
  opacity: 1;
  margin: 0.1rem 0 0.4rem;
}

/* El toggle (chevron) del submenú: caja clicable amplia con una flecha CSS
   SIEMPRE visible. El <svg> del core renderiza a 0px de ancho (invisible), así
   que lo ocultamos y dibujamos nosotros el chevron con ::after. */
.rzz-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  min-width: 34px;
  padding: 0;
  margin-left: auto;
  background: rgba(96, 158, 208, 0.1);
  border: 0;
  border-radius: 999px;
  color: var(--rzz-azul-noche);
  transition: transform 0.22s ease, background 0.15s ease;
}

.rzz-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-icon:hover {
  background: rgba(96, 158, 208, 0.2);
}

/* El svg del core mide 0px de ancho → invisible. Lo anulamos y usamos ::after. */
.rzz-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-icon svg {
  display: none;
}

.rzz-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-icon::after {
  content: "";
  display: block;
  width: 9px;
  height: 9px;
  border-right: 2.5px solid currentColor;
  border-bottom: 2.5px solid currentColor;
  transform: rotate(45deg);
  margin-top: -4px;
}

/* Abierto: gira la flecha (apunta hacia arriba). */
.rzz-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu.is-menu-open > .wp-block-navigation__submenu-icon,
.rzz-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-icon[aria-expanded="true"] {
  transform: rotate(180deg);
}

/* Flecha (chevron) en desktop: WP a veces no pinta su SVG; forzamos una flecha
   CSS clara para que se vea que el item despliega. */
.rzz-site-header .wp-block-navigation__submenu-icon svg {
  width: 16px;
  height: 16px;
  fill: currentColor;
}
.rzz-site-header .wp-block-navigation__submenu-icon:empty::after,
.rzz-site-header .wp-block-navigation__submenu-icon:not(:has(svg))::after {
  content: "";
  width: 9px;
  height: 9px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  margin-top: -3px;
}

/* En desktop, el chevron del CTA/submenús del header. */
.rzz-site-header .wp-block-navigation-submenu .wp-block-navigation__submenu-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: currentColor;
}

/* ---------- Burger abierto: bloquear scroll del fondo ----------
   Sin esto, al hacer scroll con el menú abierto se movía el contenido de detrás.
   El JS añade .rzz-nav-open al <html> al abrir el menú (ver footer script). */
html.rzz-nav-open,
html.rzz-nav-open body {
  overflow: hidden !important;
  touch-action: none;
}

.rzz-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
  padding-block: 0.6rem;
  font-size: 0.94rem;
  font-weight: 600;
  color: rgba(30, 53, 80, 0.82) !important;
}

/* En el panel móvil mostramos el texto "Idiomas" (más claro que solo el globo);
   el globo lo dejamos como adorno a la izquierda. */
.rzz-site-header .wp-block-navigation__responsive-container.is-menu-open .rzz-lang-switch > .wp-block-navigation-item__content .wp-block-navigation-item__label {
  position: static;
  width: auto;
  height: auto;
  clip: auto;
}

.rzz-site-header .wp-block-navigation__responsive-container.is-menu-open .rzz-lang-switch > .wp-block-navigation-item__content {
  justify-content: flex-start;
}

.rzz-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover,
.rzz-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:focus-visible {
  background: rgba(96, 158, 208, 0.12);
  color: var(--rzz-azul-noche) !important;
}

/* Selectores de idioma compactos en una fila dentro del panel. */
.rzz-site-header .wp-block-navigation__responsive-container.is-menu-open .rzz-lang-link {
  display: inline-flex;
}

.rzz-site-header .wp-block-navigation__responsive-container.is-menu-open .rzz-lang-link .wp-block-navigation-item__content {
  padding-block: 0.5rem;
}

/* Botón de cerrar (X) dentro del propio panel, arriba a la derecha. */
.rzz-site-header .wp-block-navigation__responsive-container-close {
  position: fixed;
  top: clamp(1.05rem, 3.5vw, 1.4rem);
  right: clamp(0.85rem, 3.5vw, 1.4rem);
  z-index: 1;
  border: 1px solid rgba(30, 53, 80, 0.12);
  background: #ffffff;
  box-shadow: 0 10px 24px rgba(30, 53, 80, 0.12);
}

@keyframes rzz-nav-fade {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes rzz-nav-drop {
  from { opacity: 0; transform: translateY(-10px) scale(0.97); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  .rzz-site-header .wp-block-navigation__responsive-container.is-menu-open,
  .rzz-site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
    animation: none;
  }
}

@media (max-width: 1180px) and (min-width: 783px) {
  .rzz-site-header {
    min-height: 74px;
    padding: 0.82rem 1rem !important;
  }

  .rzz-site-logo img {
    width: 112px;
  }

  .rzz-site-header .wp-block-navigation {
    flex: 0 0 auto !important;
    max-width: 100%;
  }

  .rzz-site-header .wp-block-navigation__responsive-container:not(.is-menu-open) {
    display: none !important;
    width: 0 !important;
    flex: 0 0 0 !important;
  }

  .rzz-site-header .wp-block-navigation__responsive-container-open {
    display: inline-flex !important;
  }
}

@media (max-width: 782px) {
  /* Header en fila forzada: logo izquierda, hamburguesa derecha. */
  .rzz-site-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
    min-height: 74px;
    padding: 0.82rem 0.8rem !important;
  }

  .rzz-site-header::before {
    inset: 0.62rem 0.65rem;
  }

  /* El figure del logo (wp-block-image) es display:block y se estiraba a ~364px,
     empujando el botón hamburguesa FUERA del viewport (inclicable). Lo encogemos
     a su contenido real (la imagen) para que el botón quede siempre dentro. */
  .rzz-site-header .rzz-site-logo,
  .rzz-site-header figure.wp-block-image.rzz-site-logo {
    flex: 0 0 auto !important;
    width: max-content !important;
    max-width: 62vw !important;
    min-width: 0 !important;
  }

  .rzz-site-logo a {
    display: inline-flex !important;
    width: auto !important;
  }

  .rzz-site-logo img {
    width: 112px !important;
    height: auto !important;
  }

  .rzz-site-header .wp-block-navigation {
    flex: 0 0 auto;
  }

  /* En móvil los items van SIEMPRE colapsados. width:0 además del display:none
     es un cinturón de seguridad: aunque algún estilo de WP gane el display, el
     contenedor no puede ensanchar el nav y empujar el botón fuera del viewport
     (causaba que el hamburguesa quedara fuera de pantalla y no fuera clicable). */
  .rzz-site-header .wp-block-navigation__responsive-container:not(.is-menu-open) {
    display: none !important;
    width: 0 !important;
    flex: 0 0 0 !important;
  }

  /* El nav se ajusta a su contenido (el botón); nunca crece para empujar nada. */
  .rzz-site-header .wp-block-navigation {
    flex: 0 0 auto !important;
    max-width: 100%;
  }

  .rzz-site-header .wp-block-navigation__responsive-container-open {
    display: inline-flex !important;
    flex: 0 0 auto;
  }

  body.admin-bar .rzz-site-header {
    top: 46px;
  }
}

/* Builder section styles exposed in Gutenberg as block styles. */
.wp-site-blocks {
  overflow-x: clip;
}

.rzz-bento,
.rzz-process-steps,
.rzz-simulator-hogar,
.rzz-testimonials-mockup,
.rzz-faq,
.rzz-comunidades-map,
.rzz-comunidades-map-embed,
.rzz-hub-cta,
.rzz-empresa-selector,
.rzz-simulator-empresa,
.rzz-empresa-roi-calc,
.rzz-empresa-tco-table,
.rzz-empresa-cases,
.rzz-empresa-lead-form,
.rzz-empresa-faq,
.rzz-comparador-tarifas,
.rzz-tariff-comparator,
.rzz-faq-central,
.rzz-faq-search,
.rzz-numeros,
.rzz-barrio-solar,
.rzz-storytelling,
.rzz-footer {
  width: 100vw !important;
  max-width: none !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}

.wp-block-group.is-style-rzz-section,
.wp-block-group.is-style-rzz-band-light,
.wp-block-group.is-style-rzz-band-dark {
  position: relative;
  width: 100vw;
  max-width: none !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  padding-block: clamp(3.5rem, 7vw, 6rem);
}

.wp-block-group.is-style-rzz-section > * ,
.wp-block-group.is-style-rzz-band-light > *,
.wp-block-group.is-style-rzz-band-dark > * {
  max-width: var(--rzz-content-max);
  margin-inline: auto;
  padding-inline: var(--rzz-space-6);
}

.wp-block-group.is-style-rzz-section {
  background: var(--rzz-blanco);
}

.rzz-barrio-solar-root.rzz-barrio-solar-home,
.rzz-barrio-solar-root.rzz-barrio-solar-home .rzz-barrio-solar {
  height: auto !important;
  min-height: 0 !important;
}

.wp-block-group.is-style-rzz-band-light {
  background:
    radial-gradient(circle at 12% 18%, rgba(96, 158, 208, 0.12), transparent 48%),
    radial-gradient(circle at 88% 30%, rgba(190, 214, 0, 0.14), transparent 46%),
    var(--rzz-gris-suave);
}

.wp-block-group.is-style-rzz-band-dark {
  background:
    radial-gradient(circle at 16% 18%, rgba(96, 158, 208, 0.2), transparent 48%),
    radial-gradient(circle at 82% 22%, rgba(190, 214, 0, 0.18), transparent 46%),
    var(--rzz-azul-noche);
  color: var(--rzz-blanco);
}

.wp-block-group.is-style-rzz-band-dark h1,
.wp-block-group.is-style-rzz-band-dark h2,
.wp-block-group.is-style-rzz-band-dark h3,
.wp-block-group.is-style-rzz-band-dark p {
  color: inherit;
}

.is-style-rzz-band-dark .rzz-editorial-card-grid > .wp-block-column h1,
.is-style-rzz-band-dark .rzz-editorial-card-grid > .wp-block-column h2,
.is-style-rzz-band-dark .rzz-editorial-card-grid > .wp-block-column h3,
.is-style-rzz-band-dark .rzz-price-card h1,
.is-style-rzz-band-dark .rzz-price-card h2,
.is-style-rzz-band-dark .rzz-price-card h3 {
  color: var(--rzz-azul-noche) !important;
}

.is-style-rzz-band-dark .rzz-editorial-card-grid > .wp-block-column p,
.is-style-rzz-band-dark .rzz-price-card p {
  color: rgba(30, 53, 80, 0.72) !important;
}

.wp-site-blocks > main.wp-block-group,
main.wp-block-group {
  max-width: none !important;
}

/* Standard page padding to prevent sticky header overlapping simple pages */
body:not(.home):not(.block-editor-page) .wp-site-blocks > main.wp-block-group:not(:has(.rzz-page-hero)):not(:has(.rzz-hero)):not(:has([data-block*="hero"])) {
  padding-top: calc(var(--rzz-header-height, 94px) + 3rem) !important;
}
@media (max-width: 1024px) {
  body:not(.home):not(.block-editor-page) .wp-site-blocks > main.wp-block-group:not(:has(.rzz-page-hero)):not(:has(.rzz-hero)):not(:has([data-block*="hero"])) {
    padding-top: calc(var(--rzz-header-height, 74px) + 2rem) !important;
  }
}

.wp-site-blocks .rzz-page-hero,
.wp-site-blocks .rzz-editorial-section,
.wp-site-blocks .rzz-hero,
.wp-site-blocks .rzz-hub-hero,
.wp-site-blocks .rzz-empresa-hero,
main.wp-block-group > .rzz-page-hero,
main.wp-block-group > .rzz-editorial-section,
main.wp-block-group > [data-block="reazziona/hero"],
main.wp-block-group > [data-block="reazziona/hub-hero"],
main.wp-block-group > [data-block="reazziona/empresa-hero"] {
  width: 100vw !important;
  max-width: none !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}

/* Editorial pages built with native Gutenberg blocks. */
.rzz-page-hero {
  position: relative;
  width: 100vw;
  max-width: none !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  overflow: hidden;
  padding: clamp(4.5rem, 8vw, 7rem) clamp(1.25rem, 6vw, 5rem);
  background:
    linear-gradient(135deg, rgba(30, 53, 80, 0.98), rgba(24, 42, 64, 0.94) 54%, rgba(37, 68, 100, 0.96)),
    var(--rzz-azul-noche);
  color: var(--rzz-blanco);
}

.rzz-page-hero::before {
  content: "";
  position: absolute;
  inset: auto 8% 10% auto;
  width: clamp(220px, 30vw, 460px);
  aspect-ratio: 1;
  border: 1px solid rgba(190, 214, 0, 0.26);
  border-radius: 44% 56% 52% 48%;
  transform: rotate(-12deg);
}

.rzz-page-hero::after {
  content: "";
  position: absolute;
  inset: 18% auto auto 8%;
  width: clamp(120px, 18vw, 260px);
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(190, 214, 0, 0.24), transparent 64%);
  filter: blur(4px);
}

.rzz-page-hero > * {
  position: relative;
  z-index: 1;
  width: min(100%, var(--rzz-content-max));
  margin-inline: auto;
}

.rzz-page-eyebrow {
  margin-bottom: 1rem;
  color: var(--rzz-verde-lima) !important;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.rzz-page-lead {
  margin-block: 1.25rem 2rem;
  max-width: 760px;
  color: rgba(255, 255, 255, 0.78) !important;
  font-size: clamp(1.05rem, 2vw, 1.28rem);
  line-height: 1.55;
}

.rzz-page-hero h1,
.rzz-page-hero h2,
.rzz-page-hero h3,
.rzz-page-hero p {
  color: inherit;
}

.rzz-page-hero-media,
.rzz-editorial-media {
  overflow: hidden;
  border-radius: 18px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow: 0 24px 70px rgba(30, 53, 80, 0.22);
}

.rzz-page-hero-media {
  max-width: min(920px, 100%);
  margin-top: clamp(2rem, 4vw, 3rem);
}

.rzz-page-hero-media--video {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.rzz-page-hero-media--video::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(7, 25, 43, 0.94), rgba(7, 25, 43, 0.66) 52%, rgba(7, 25, 43, 0.32)),
    linear-gradient(180deg, rgba(7, 25, 43, 0.18), rgba(7, 25, 43, 0.78));
}

.rzz-page-hero-media--video video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.03);
}

.rzz-page-hero-media img,
.rzz-editorial-media img,
.rzz-page-hero-media video,
.rzz-editorial-media video {
  width: 100%;
  aspect-ratio: 16 / 7;
  object-fit: cover;
  display: block;
}

.rzz-editorial-media {
  margin-bottom: clamp(1.5rem, 3vw, 2rem);
  border-color: rgba(30, 53, 80, 0.08);
}

.rzz-editorial-media img,
.rzz-editorial-media video {
  aspect-ratio: 16 / 6;
}

.rzz-editorial-section {
  position: relative;
  width: 100vw;
  max-width: none !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  padding: clamp(3.8rem, 7vw, 6.5rem) clamp(1.25rem, 6vw, 5rem);
  background:
    radial-gradient(circle at 12% 18%, rgba(96, 158, 208, 0.10), transparent 42%),
    radial-gradient(circle at 88% 16%, rgba(190, 214, 0, 0.10), transparent 42%),
    #ffffff;
}

.rzz-editorial-section:nth-of-type(even):not(.is-style-rzz-band-dark):not(.is-style-rzz-band-light) {
  background:
    radial-gradient(circle at 78% 16%, rgba(96, 158, 208, 0.12), transparent 44%),
    var(--rzz-gris-suave);
}

.rzz-editorial-section > * {
  width: min(100%, var(--rzz-content-max));
  margin-inline: auto;
}

.rzz-editorial-section > h2,
.rzz-editorial-section > .wp-block-heading {
  max-width: 860px;
  margin-inline: auto;
  margin-bottom: clamp(1.5rem, 4vw, 2.5rem);
}

.rzz-editorial-card-grid {
  gap: clamp(1rem, 2vw, 1.4rem) !important;
}

.rzz-editorial-card-grid > .wp-block-column {
  min-width: 0;
  padding: clamp(1.25rem, 2.5vw, 1.9rem);
  border: 1px solid rgba(42, 74, 106, 0.10);
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.86));
  box-shadow: 0 18px 42px rgba(42, 74, 106, 0.10);
  transition:
    border-color var(--rzz-motion-fast) var(--rzz-ease-out-quint),
    box-shadow var(--rzz-motion-fast) var(--rzz-ease-out-quint),
    transform var(--rzz-motion-fast) var(--rzz-ease-out-quint);
}

.rzz-editorial-card-grid > .wp-block-column:hover {
  border-color: rgba(96, 158, 208, 0.28);
  box-shadow: 0 24px 60px rgba(42, 74, 106, 0.14);
  transform: translateY(-3px);
}

.rzz-editorial-card-grid h3 {
  margin-bottom: 0.65rem;
  font-size: clamp(1.12rem, 2vw, 1.38rem);
}

.rzz-editorial-card-grid p {
  color: rgba(30, 53, 80, 0.72);
}

.rzz-editorial-card-grid .wp-block-buttons {
  margin-top: 1rem;
}

@media (max-width: 781px) {
  .rzz-page-hero {
    padding-block: 3.8rem;
  }

  .rzz-editorial-card-grid > .wp-block-column {
    padding: 1.2rem;
  }
}

/* Compact hero is opt-in. Never force every hero to a viewport height. */
.rzz-page-hero--compact,
.rzz-hero--compact,
.rzz-hub-hero--compact,
.rzz-empresa-hero--compact {
  min-height: clamp(420px, 48vh, 560px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
}

.rzz-page-hero--compact .rzz-page-hero-inner,
.rzz-hero--compact .rzz-hero-inner,
.rzz-hub-hero--compact .rzz-hub-hero-inner,
.rzz-empresa-hero--compact .rzz-empresa-hero-inner,
.rzz-hero--compact .rzz-hero-content,
.rzz-hub-hero--compact .rzz-hub-hero-content {
  min-height: 0;
  padding-block: clamp(2rem, 5vh, 4rem);
}

.wp-site-blocks .rzz-page-hero--tarifas,
main.wp-block-group > .rzz-page-hero--tarifas,
.wp-site-blocks .rzz-page-hero--academy,
main.wp-block-group > .rzz-page-hero--academy {
  display: grid !important;
  height: auto !important;
  min-height: clamp(560px, 72vh, 760px) !important;
  align-content: center !important;
  justify-content: stretch !important;
  padding: clamp(6.5rem, 10vw, 9rem) clamp(1.25rem, 6vw, 5rem) clamp(4.5rem, 8vw, 7rem) !important;
  overflow: visible !important;
}

.rzz-page-hero--tarifas .rzz-page-eyebrow {
  margin-bottom: 1rem !important;
}

.rzz-page-hero--tarifas h1 {
  max-width: 880px;
  font-size: clamp(2.8rem, 7vw, 6rem) !important;
  line-height: 0.96 !important;
  margin: 0 !important;
}

.rzz-page-hero--tarifas .rzz-page-lead {
  max-width: 760px;
  margin-block: 1.35rem 2rem !important;
  font-size: clamp(1.05rem, 1.6vw, 1.24rem) !important;
}

.rzz-page-hero--tarifas .rzz-page-hero-media {
  height: auto !important;
  min-height: 0 !important;
  max-width: min(840px, 100%);
  margin-top: clamp(1.8rem, 4vw, 3rem);
}

.rzz-page-hero--tarifas .rzz-page-hero-media img {
  height: auto !important;
  aspect-ratio: 16 / 6;
}

.rzz-contact-page {
  position: relative;
  max-width: 100%;
  overflow-wrap: break-word;
  background: transparent;
}

.rzz-contact-bg-video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
  pointer-events: none;
}

.rzz-contact-bg-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
  background: linear-gradient(180deg, rgba(30, 53, 80, 0.72) 0%, rgba(30, 53, 80, 0.35) 44%, rgba(255, 255, 255, 0.92) 86%, #ffffff 100%);
  pointer-events: none;
}

.rzz-contact-hero {
  min-height: clamp(420px, 52vh, 620px);
  background: transparent !important;
}

.rzz-contact-hero::before,
.rzz-contact-hero::after {
  display: none !important;
}

.rzz-contact-page > .rzz-contact-panel {
  max-width: min(1120px, calc(100vw - 2rem));
}

.rzz-contact-panel {
  display: grid;
  grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);
  gap: clamp(1.25rem, 3vw, 2rem);
  margin: clamp(2rem, 5vw, 3.5rem) auto;
  padding: clamp(1rem, 3vw, 1.6rem);
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 24px;
  background:
    radial-gradient(circle at 90% 0%, rgba(190, 214, 0, 0.15), transparent 44%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.3), rgba(247, 249, 251, 0.25));
  box-shadow: 0 28px 76px rgba(30, 53, 80, 0.12);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

.rzz-contact-panel__copy {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 100%;
  padding: clamp(1rem, 2.4vw, 1.5rem);
  border-radius: 18px;
  background:
    linear-gradient(160deg, rgba(30, 53, 80, 0.35), rgba(42, 74, 106, 0.3));
  border: 1px solid rgba(255, 255, 255, 0.15);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

.rzz-contact-panel__copy h2,
.rzz-contact-panel__copy p {
  color: var(--rzz-blanco);
}

.rzz-contact-panel__copy h2 {
  margin: 0;
  font-size: clamp(1.55rem, 3vw, 2.35rem);
  line-height: 1.05;
}

.rzz-contact-panel__eyebrow {
  margin: 0 0 0.9rem;
  color: var(--rzz-verde-lima) !important;
  font-size: 0.72rem !important;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.rzz-contact-panel__channels {
  display: grid;
  gap: 0.7rem;
  margin-top: clamp(1.5rem, 4vw, 2.6rem);
}

.rzz-contact-channel {
  display: grid;
  gap: 0.1rem;
  margin: 0;
  padding: 0.82rem 0.9rem;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.08);
}

.rzz-contact-channel span {
  color: rgba(255, 255, 255, 0.62);
  font-size: 0.74rem;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.rzz-contact-channel strong {
  color: #ffffff;
  font-size: 0.94rem;
  font-weight: 850;
  overflow-wrap: anywhere;
}

.rzz-contact-form {
  display: grid;
  gap: 1rem;
  min-width: 0;
}

.rzz-contact-form__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.78rem;
}

.rzz-contact-form label {
  display: grid;
  gap: 0.42rem;
  min-width: 0;
  color: rgba(30, 53, 80, 0.78);
  font-size: 0.84rem;
  font-weight: 800;
}

.rzz-contact-form input,
.rzz-contact-form select,
.rzz-contact-form textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid rgba(30, 53, 80, 0.14);
  border-radius: 12px;
  background: #ffffff;
  color: var(--rzz-azul-noche);
  font: inherit;
  font-size: 0.94rem;
  font-weight: 650;
  outline: none;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.rzz-contact-form input,
.rzz-contact-form select {
  min-height: 46px;
  padding: 0 0.85rem;
}

.rzz-contact-form textarea {
  min-height: 136px;
  padding: 0.8rem 0.85rem;
  resize: vertical;
}

.rzz-contact-form input:focus,
.rzz-contact-form select:focus,
.rzz-contact-form textarea:focus {
  border-color: rgba(96, 158, 208, 0.72);
  box-shadow: 0 0 0 4px rgba(96, 158, 208, 0.14);
}

.rzz-contact-form__field--full {
  grid-column: 1 / -1;
}

.rzz-contact-form__trap {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.rzz-contact-form__privacy {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.62rem;
  align-items: start;
  padding: 0.85rem;
  border: 1px solid rgba(30, 53, 80, 0.08);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.72);
}

.rzz-contact-form__privacy input {
  width: 1rem;
  height: 1rem;
  min-height: 0;
  margin-top: 0.18rem;
  accent-color: var(--rzz-verde-lima);
}

.rzz-contact-form__privacy label {
  display: block;
  color: rgba(30, 53, 80, 0.78);
  font-size: 0.86rem;
  font-weight: 750;
  line-height: 1.45;
}

.rzz-contact-form__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem 1rem;
  align-items: center;
}

.rzz-contact-form button[type="submit"] {
  min-height: 48px;
  padding: 0 1.2rem;
  border-radius: 999px;
  background: var(--rzz-verde-lima);
  color: var(--rzz-azul-noche);
  font-weight: 950;
  box-shadow: 0 18px 38px rgba(190, 214, 0, 0.24);
  transition: transform 0.18s ease, box-shadow 0.18s ease, opacity 0.18s ease;
}

.rzz-contact-form button[type="submit"]:hover {
  transform: translateY(-1px);
  box-shadow: 0 22px 46px rgba(190, 214, 0, 0.30);
}

.rzz-contact-form button[type="submit"]:disabled {
  cursor: wait;
  opacity: 0.64;
  transform: none;
}

.rzz-contact-form__status {
  flex: 1 1 240px;
  min-height: 1.4rem;
  margin: 0;
  font-size: 0.88rem !important;
  font-weight: 800;
}

.rzz-contact-form__status[data-state="success"] {
  color: #557200 !important;
}

.rzz-contact-form__status[data-state="error"] {
  color: #a43d3d !important;
}

.rzz-contact-benefits {
  width: min(100% - 2rem, 920px);
  margin: 0 auto clamp(3rem, 6vw, 5rem);
}

.rzz-contact-benefits h2 {
  margin-bottom: 1rem;
}

.rzz-contact-benefits ul {
  display: grid;
  gap: 0.7rem;
  padding-left: 1.2rem;
  color: rgba(30, 53, 80, 0.78);
  font-weight: 700;
}

.rzz-legal-page {
  max-width: 100%;
  overflow-wrap: break-word;
}

.rzz-legal-page > * {
  width: calc(100vw - 4rem);
  max-width: 100%;
  box-sizing: border-box;
}

.rzz-legal-page .rzz-legal-cards {
  width: 100%;
  max-width: 100%;
}

.rzz-legal-page .rzz-legal-cards .wp-block-column {
  min-width: 0;
}

.rzz-legal-page .rzz-legal-cards h3,
.rzz-legal-page .rzz-legal-cards p,
.rzz-legal-page .rzz-legal-cards a {
  max-width: 100%;
  overflow-wrap: anywhere;
}

.rzz-legal-page > .rzz-claims-panel {
  max-width: min(1120px, calc(100vw - 2rem));
}

.rzz-claims-panel {
  display: grid;
  grid-template-columns: minmax(0, 0.78fr) minmax(0, 1.22fr);
  gap: clamp(1.25rem, 3vw, 2rem);
  margin-block: clamp(2rem, 5vw, 3.5rem);
  padding: clamp(1rem, 3vw, 1.6rem);
  border: 1px solid rgba(96, 158, 208, 0.16);
  border-radius: 24px;
  background:
    radial-gradient(circle at 12% 0%, rgba(96, 158, 208, 0.16), transparent 38%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(247, 249, 251, 0.96));
  box-shadow: 0 28px 76px rgba(30, 53, 80, 0.12);
}

.rzz-claims-panel__copy {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 100%;
  padding: clamp(1rem, 2.4vw, 1.5rem);
  border-radius: 18px;
  background:
    linear-gradient(160deg, rgba(30, 53, 80, 0.96), rgba(42, 74, 106, 0.94)),
    var(--rzz-azul-noche);
}

.rzz-claims-panel__copy h2,
.rzz-claims-panel__copy p {
  color: var(--rzz-blanco);
}

.rzz-claims-panel__copy h2 {
  margin: 0;
  font-size: clamp(1.45rem, 3vw, 2.25rem);
  line-height: 1.05;
}

.rzz-claims-panel__eyebrow {
  margin: 0 0 0.9rem;
  color: var(--rzz-verde-lima) !important;
  font-size: 0.72rem !important;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.rzz-claims-panel__note {
  margin-top: clamp(1.5rem, 4vw, 2.6rem);
  color: rgba(255, 255, 255, 0.76) !important;
  font-size: 0.92rem !important;
}

.rzz-claims-form {
  display: grid;
  gap: 1rem;
  min-width: 0;
}

.rzz-claims-form fieldset {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.rzz-claims-form legend {
  margin-bottom: 0.75rem;
  color: var(--rzz-azul-noche);
  font-weight: 900;
  letter-spacing: 0;
}

.rzz-claims-form__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.78rem;
}

.rzz-claims-form label {
  display: grid;
  gap: 0.42rem;
  min-width: 0;
  color: rgba(30, 53, 80, 0.78);
  font-size: 0.84rem;
  font-weight: 800;
}

.rzz-claims-form input,
.rzz-claims-form textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid rgba(30, 53, 80, 0.14);
  border-radius: 12px;
  background: #ffffff;
  color: var(--rzz-azul-noche);
  font: inherit;
  font-size: 0.94rem;
  font-weight: 650;
  outline: none;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.rzz-claims-form input {
  min-height: 46px;
  padding: 0 0.85rem;
}

.rzz-claims-form textarea {
  min-height: 136px;
  padding: 0.8rem 0.85rem;
  resize: vertical;
}

.rzz-claims-form input:focus,
.rzz-claims-form textarea:focus {
  border-color: rgba(96, 158, 208, 0.72);
  box-shadow: 0 0 0 4px rgba(96, 158, 208, 0.14);
}

.rzz-claims-form__field--full {
  grid-column: 1 / -1;
}

.rzz-claims-form__file {
  padding: 0.85rem;
  border: 1px dashed rgba(96, 158, 208, 0.36);
  border-radius: 14px;
  background: rgba(96, 158, 208, 0.06);
}

.rzz-claims-form__file input {
  min-height: 0;
  padding: 0.7rem;
  background: #ffffff;
}

.rzz-claims-form__file span,
.rzz-claims-form__hint {
  color: rgba(30, 53, 80, 0.62);
  font-size: 0.78rem;
  font-weight: 650;
  line-height: 1.45;
}

.rzz-claims-form__hint {
  margin: -0.15rem 0 0;
}

.rzz-claims-form__privacy {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.62rem;
  align-items: start;
  padding: 0.85rem;
  border: 1px solid rgba(30, 53, 80, 0.08);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.72);
}

.rzz-claims-form__privacy input {
  width: 1rem;
  height: 1rem;
  min-height: 0;
  margin-top: 0.18rem;
  accent-color: var(--rzz-verde-lima);
}

.rzz-claims-form__privacy label {
  display: block;
  color: rgba(30, 53, 80, 0.78);
  font-size: 0.86rem;
  font-weight: 750;
  line-height: 1.45;
}

.rzz-claims-form button[type="submit"] {
  min-height: 48px;
  justify-self: start;
  padding: 0 1.2rem;
  border-radius: 999px;
  background: var(--rzz-verde-lima);
  color: var(--rzz-azul-noche);
  font-weight: 950;
  box-shadow: 0 18px 38px rgba(190, 214, 0, 0.24);
  transition: transform 0.18s ease, box-shadow 0.18s ease, opacity 0.18s ease;
}

.rzz-claims-form button[type="submit"]:hover {
  transform: translateY(-1px);
  box-shadow: 0 22px 46px rgba(190, 214, 0, 0.30);
}

.rzz-claims-form button[type="submit"]:disabled {
  cursor: wait;
  opacity: 0.64;
  transform: none;
}

.rzz-claims-form__status {
  min-height: 1.4rem;
  margin: 0;
  font-size: 0.88rem !important;
  font-weight: 800;
}

.rzz-claims-form__status[data-state="success"] {
  color: #557200 !important;
}

.rzz-claims-form__status[data-state="error"] {
  color: #a43d3d !important;
}

@media (max-width: 860px) {
  .rzz-contact-panel {
    grid-template-columns: 1fr;
  }

  .rzz-contact-panel__copy {
    min-height: 0;
  }

  .rzz-claims-panel {
    grid-template-columns: 1fr;
  }

  .rzz-claims-panel__copy {
    min-height: 0;
  }
}

@media (max-width: 560px) {
  .rzz-legal-page .rzz-legal-cards {
    width: calc(100vw - 4rem) !important;
    max-width: calc(100vw - 4rem) !important;
    margin-inline: 0 !important;
  }

  .rzz-legal-page .rzz-legal-cards > .wp-block-column {
    width: 100% !important;
    max-width: 100% !important;
    flex-basis: 100% !important;
  }

  .rzz-claims-panel {
    max-width: calc(100vw - 1rem);
    padding: 0.75rem;
    border-radius: 18px;
  }

  .rzz-contact-panel {
    max-width: calc(100vw - 1rem);
    padding: 0.75rem;
    border-radius: 18px;
  }

  .rzz-contact-form__grid {
    grid-template-columns: 1fr;
  }

  .rzz-contact-form button[type="submit"] {
    width: 100%;
  }

  .rzz-contact-form__status {
    flex-basis: 100%;
  }

  .rzz-claims-form__grid {
    grid-template-columns: 1fr;
  }

  .rzz-claims-form button[type="submit"] {
    width: 100%;
    justify-self: stretch;
  }
}

/* ============================================================
   PÁGINAS DE PRODUCTO · Luz · Gas · Solar
   Tratamientos editoriales "disruptivos": números de paso grandes,
   tarjetas con barra de acento, tarjeta de precio destacada, leads y
   notas centradas. Acento de marca (lima) con un matiz ambiental por
   producto SOLO en el hero (la marca se mantiene coherente).
   ============================================================ */

/* Matiz ambiental del hero por producto (sutil; los botones siguen lima). */
.rzz-page-hero--luz::after   { background: radial-gradient(circle, rgba(244, 183, 64, 0.30), transparent 64%); }
.rzz-page-hero--gas::after   { background: radial-gradient(circle, rgba(63, 182, 201, 0.30), transparent 64%); }
.rzz-page-hero--solar::after { background: radial-gradient(circle, rgba(190, 214, 0, 0.32), transparent 64%); }

.rzz-page-hero--luz::before   { border-color: rgba(244, 183, 64, 0.32); }
.rzz-page-hero--gas::before   { border-color: rgba(63, 182, 201, 0.32); }
.rzz-page-hero--solar::before { border-color: rgba(190, 214, 0, 0.34); }

/* Lead introductorio dentro de secciones editoriales. */
.rzz-section-lead {
  max-width: 760px;
  margin: 0 auto clamp(1.5rem, 3vw, 2.25rem);
  font-size: clamp(1.05rem, 1.8vw, 1.25rem);
  line-height: 1.6;
  color: rgba(30, 53, 80, 0.80);
}
.is-style-rzz-band-dark .rzz-section-lead { color: rgba(255, 255, 255, 0.84); }

/* Nota destacada (plazas limitadas, radio 2.000 m, etc.). */
.rzz-section-note {
  margin: clamp(1.4rem, 3vw, 2rem) auto 0;
  max-width: 660px;
  font-size: 0.96rem;
  font-weight: 700;
  color: rgba(30, 53, 80, 0.66);
}
.is-style-rzz-band-dark .rzz-section-note { color: rgba(255, 255, 255, 0.74); }

/* Barra de acento superior en tarjetas de características. */
.rzz-feature-grid > .wp-block-column {
  position: relative;
  overflow: hidden;
}
.rzz-feature-grid > .wp-block-column::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 4px;
  background: linear-gradient(90deg, var(--rzz-verde-lima), #9AC01C);
}
.rzz-feature-grid > .wp-block-column h3 { margin-top: 0.45rem; }

/* Pasos numerados (Solar · "¿Cómo funciona?"): 5-up que envuelve. */
.rzz-steps-grid { flex-wrap: wrap !important; }
.rzz-steps-grid > .rzz-step-card {
  flex: 1 1 168px !important;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}
.rzz-step-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  border-radius: 16px;
  font-size: 1.6rem;
  font-weight: 800;
  line-height: 1;
  color: var(--rzz-azul-noche);
  background: linear-gradient(135deg, var(--rzz-verde-lima), #9AC01C);
  box-shadow: 0 10px 26px rgba(190, 214, 0, 0.32);
  margin: 0 0 0.2rem;
}
.rzz-step-card p:not(.rzz-step-num) {
  font-size: 1.02rem;
  font-weight: 600;
  color: var(--rzz-azul-noche);
  margin: 0;
}

/* Tarjeta de tarifa destacada (Gas). */
.rzz-price-grid { justify-content: center !important; }
.rzz-price-card {
  max-width: 640px;
  margin-inline: auto;
  border: 1px solid rgba(190, 214, 0, 0.42) !important;
  background:
    radial-gradient(circle at 14% 0%, rgba(190, 214, 0, 0.14), transparent 58%),
    linear-gradient(180deg, #ffffff, #f7faf0) !important;
  box-shadow: 0 26px 64px rgba(42, 74, 106, 0.16) !important;
}
.rzz-price-kicker {
  display: inline-block;
  margin: 0 0 0.7rem !important;
  padding: 0.32rem 0.85rem;
  border-radius: 999px;
  background: var(--rzz-azul-noche);
  /* !important: una regla de tarjeta editorial fija el color del <p> a azul
     oscuro → texto invisible sobre la píldora oscura. Forzamos blanco. */
  color: #fff !important;
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* FAQ en tarjetas (Gas). */
.rzz-faq-grid > .wp-block-column .wp-block-list {
  margin-top: 0.5rem;
  padding-left: 1.15rem;
}
.rzz-faq-grid > .wp-block-column li { margin: 0.22rem 0; }

/* =====================================================================
   HEADER OVERLAYS / SUPERPOSITION FIXES
   Ensure all hero/top sections are superimposed directly on the floating
   menu header without a vertical gap, and offset text content so it
   is not covered by the fixed menu.
   ===================================================================== */
.rzz-page-hero,
.rzz-hero,
.rzz-hub-hero,
.rzz-empresa-hero,
.rzz-comunidades-map-hero {
  position: relative;
  margin-top: 0 !important;
}

.wp-site-blocks .rzz-page-hero,
main.wp-block-group > .rzz-page-hero,
.rzz-page-hero {
  padding-top: calc(var(--rzz-header-height) + clamp(1.5rem, 4vw, 3rem)) !important;
}

.wp-site-blocks .rzz-hero,
main.wp-block-group > [data-block="reazziona/hero"],
.rzz-hero {
  padding-top: calc(var(--rzz-header-height) + clamp(1.5rem, 4vw, 3rem)) !important;
}

.rzz-hub-hero-grid {
  padding-top: calc(var(--rzz-header-height) + clamp(1.5rem, 4vw, 3rem)) !important;
}

.rzz-empresa-hero-grid {
  padding-top: calc(var(--rzz-header-height) + clamp(1.5rem, 4vw, 3rem)) !important;
}

.rzz-comunidades-map-hero {
  padding-top: calc(var(--rzz-header-height) + clamp(1.5rem, 4vw, 3rem)) !important;
}

/* Home Page Solar Scrub Hero Copy positioning */
.rzz-hero-solar__copy {
  top: calc(var(--rzz-header-height) + clamp(1.5rem, 5vh, 3.5rem)) !important;
}

/* Academy Video cards rounded corners */
.rzz-academy-video,
.rzz-academy-video video {
  border-radius: 14px !important;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(30, 53, 80, 0.12);
}

/* Academy Hero Background, White Fading Overlay, Video Centering, and Font Shadows */
.wp-site-blocks .rzz-page-hero--academy,
main.wp-block-group > .rzz-page-hero--academy,
.rzz-page-hero--academy {
  background:
    radial-gradient(circle at 12% 18%, rgba(96, 158, 208, 0.10), transparent 42%),
    radial-gradient(circle at 88% 16%, rgba(190, 214, 0, 0.10), transparent 42%),
    #ffffff !important;
  padding-bottom: 0 !important;
}

.rzz-page-hero--academy + .rzz-editorial-section {
  margin-top: 0 !important;
  padding-top: clamp(2rem, 4vw, 4rem) !important;
}

.rzz-page-hero--academy .rzz-page-hero-media--video {
  /* Blend edges smoothly into the white page background on all 4 sides */
  mask-image:
    linear-gradient(to bottom, transparent 0%, black 25%, black 50%, transparent 95%),
    linear-gradient(to right, transparent 0%, black 20%, black 80%, transparent 100%) !important;
  mask-composite: intersect !important;
  -webkit-mask-image:
    linear-gradient(to bottom, transparent 0%, black 25%, black 50%, transparent 95%),
    linear-gradient(to right, transparent 0%, black 20%, black 80%, transparent 100%) !important;
  -webkit-mask-composite: source-in !important;
  width: 100% !important;
  left: 0 !important;
  right: 0 !important;
}

.rzz-page-hero--academy .rzz-page-hero-media--video video {
  object-fit: cover !important;
  object-position: center !important;
}

.rzz-page-hero--academy .rzz-page-hero-media--video::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(11, 22, 40, 0.35) 0%, rgba(11, 22, 40, 0.15) 50%, rgba(11, 22, 40, 0.05) 100%),
    linear-gradient(180deg, rgba(11, 22, 40, 0.1) 0%, rgba(11, 22, 40, 0.25) 100%) !important;
}

/* Ensure text elements stand out with high readability shadows over the video background */
.rzz-page-hero--academy h1 {
  color: #ffffff !important;
  text-shadow: 
    0 2px 10px rgba(11, 22, 40, 0.8), 
    0 4px 24px rgba(11, 22, 40, 0.6),
    0 1px 3px rgba(11, 22, 40, 0.9) !important;
}

.rzz-page-hero--academy .rzz-page-lead {
  color: rgba(255, 255, 255, 0.98) !important;
  text-shadow: 
    0 1px 6px rgba(11, 22, 40, 0.8),
    0 3px 15px rgba(11, 22, 40, 0.5) !important;
}

.rzz-page-hero--academy .rzz-page-eyebrow {
  color: var(--rzz-verde-lima) !important;
  text-shadow: 0 1px 6px rgba(11, 22, 40, 0.8) !important;
}

/* ---------- Premium Custom Cookie Banner & Consent Mode V2 ---------- */
.rzz-cookie-banner {
  position: fixed !important;
  bottom: 1.5rem !important;
  left: 50% !important;
  transform: translate(-50%, 20px) !important;
  opacity: 0 !important;
  z-index: 999999 !important;
  width: min(680px, 92vw) !important;
  background: rgba(30, 53, 80, 0.95) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: var(--rzz-radius-xl, 1.25rem) !important;
  box-shadow: 0 24px 64px rgba(11, 22, 40, 0.45) !important;
  color: #ffffff !important;
  transition: transform 0.35s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.35s ease !important;
  pointer-events: auto !important;
}

.rzz-cookie-banner.is-visible {
  transform: translate(-50%, 0) !important;
  opacity: 1 !important;
}

.rzz-cookie-banner__container {
  padding: 1.5rem !important;
  box-sizing: border-box !important;
}

.rzz-cookie-banner__header h3 {
  margin: 0 0 0.5rem 0 !important;
  font-size: 1.25rem !important;
  font-weight: 850 !important;
  letter-spacing: -0.01em !important;
  color: #ffffff !important;
}

.rzz-cookie-banner__header p {
  margin: 0 !important;
  font-size: 0.88rem !important;
  line-height: 1.45 !important;
  color: rgba(255, 255, 255, 0.8) !important;
}

.rzz-cookie-banner__header a {
  color: var(--rzz-verde-lima, #BED600) !important;
  text-decoration: underline !important;
  transition: color 0.2s !important;
}

.rzz-cookie-banner__header a:hover {
  color: #ffffff !important;
}

/* Panel de preferencias */
.rzz-cookie-banner__settings {
  margin-top: 1.25rem !important;
  padding-top: 1rem !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 1rem !important;
}

.rzz-cookie-banner__setting-item {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 1.5rem !important;
}

.rzz-cookie-banner__setting-info {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.15rem !important;
}

.rzz-cookie-banner__setting-info strong {
  font-size: 0.9rem !important;
  font-weight: 700 !important;
  color: #ffffff !important;
}

.rzz-cookie-banner__setting-info span {
  font-size: 0.76rem !important;
  color: rgba(255, 255, 255, 0.55) !important;
  line-height: 1.35 !important;
}

/* Switch Toggles iOS-style */
.rzz-switch {
  position: relative !important;
  display: inline-block !important;
  width: 42px !important;
  height: 22px !important;
  flex-shrink: 0 !important;
}

.rzz-switch input {
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
}

.rzz-slider {
  position: absolute !important;
  cursor: pointer !important;
  inset: 0 !important;
  background-color: rgba(255, 255, 255, 0.15) !important;
  transition: background-color 0.25s ease !important;
  border-radius: 22px !important;
}

.rzz-slider:before {
  position: absolute !important;
  content: "" !important;
  height: 16px !important;
  width: 16px !important;
  left: 3px !important;
  bottom: 3px !important;
  background-color: white !important;
  transition: transform 0.25s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  border-radius: 50% !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
}

.rzz-switch input:checked + .rzz-slider {
  background-color: var(--rzz-verde-lima, #BED600) !important;
}

.rzz-switch input:checked + .rzz-slider:before {
  transform: translateX(20px) !important;
}

.rzz-switch input:disabled + .rzz-slider {
  opacity: 0.6 !important;
  cursor: not-allowed !important;
}

/* Acciones */
.rzz-cookie-banner__actions {
  margin-top: 1.5rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.75rem !important;
  flex-wrap: wrap !important;
}

.rzz-cookie-btn {
  padding: 0.6rem 1.35rem !important;
  font-size: 0.84rem !important;
  font-weight: 800 !important;
  border-radius: 2rem !important;
  border: 0 !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: background-color 0.2s, transform 0.1s, border-color 0.2s !important;
  box-sizing: border-box !important;
}

.rzz-cookie-btn:active {
  transform: scale(0.98) !important;
}

.rzz-cookie-btn--accept {
  background: var(--rzz-verde-lima, #BED600) !important;
  color: var(--rzz-azul-noche, #1E3550) !important;
}

.rzz-cookie-btn--accept:hover {
  background: #d6eb1a !important;
}

.rzz-cookie-btn--reject {
  background: transparent !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  color: #ffffff !important;
}

.rzz-cookie-btn--reject:hover {
  border-color: rgba(255, 255, 255, 0.5) !important;
  background: rgba(255, 255, 255, 0.05) !important;
}

.rzz-cookie-btn--customize {
  background: transparent !important;
  color: var(--rzz-verde-lima, #BED600) !important;
  margin-right: auto !important; /* Mueve el botón de configurar a la izquierda en pantallas grandes */
}

.rzz-cookie-btn--customize:hover {
  text-decoration: underline !important;
}

.rzz-cookie-btn--save {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: #ffffff !important;
}

.rzz-cookie-btn--save:hover {
  background: rgba(255, 255, 255, 0.15) !important;
}

@media (max-width: 580px) {
  .rzz-cookie-banner {
    bottom: 0 !important;
    left: 0 !important;
    transform: translateY(100%) !important;
    width: 100vw !important;
    border-radius: 1.25rem 1.25rem 0 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    border-bottom: 0 !important;
  }
  
  .rzz-cookie-banner.is-visible {
    transform: translateY(0) !important;
  }
  
  .rzz-cookie-banner__actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    width: 100% !important;
    gap: 0.5rem !important;
  }
  
  .rzz-cookie-btn {
    width: 100% !important;
    padding: 0.7rem 0.5rem !important;
    font-size: 0.8rem !important;
  }
  
  .rzz-cookie-btn--customize {
    order: 3 !important;
    grid-column: span 2 !important;
    margin-right: 0 !important;
    text-align: center !important;
  }
  
  .rzz-cookie-btn--save {
    order: 4 !important;
    grid-column: span 2 !important;
  }
}