/* =========================================================================================================================
   BLOQUES Y WAVES REUTILIZABLES
   ======================================================================================================================== */

/* -------------------------------------------------------------------------------------------------------------------------- */
/* =========================================================================================================================
   SCROLL UP 
   ======================================================================================================================== */

#back-top {
  position: fixed;         /* ya lo tenés, lo reafirmamos */
  right: 16px;
  bottom: 22px;
  z-index: 10000;          /* << clave: más alto que cualquier ola */
}

/* Las waves nunca capturan click y quedan por debajo del UI flotante */
.wave {
  pointer-events: none;
  z-index: 0;              /* asegúrate de que no tengan z-index alto */
}

/* Por si alguna sección crea un stacking context con z-index altos */
.section-block,
.courses-area,
.actividades-semanales {
  position: relative;      /* contexto normal */
  z-index: 1;              /* contenido por encima de la wave (0) */
}

/* Un poco más de aire para que la wave no “pise” el borde inferior
   (ajustá 80px si tu ola es más chica) */
.section-block { 
  padding-bottom: 100px;   /* o lo que ya uses + ~40px extra */
}

/* -------------------------------------------------------------------------------------------------------------------------- */


/* Bloques con aire + alternado de fondo.
   Sumo más bottom para que la wave inferior no tape contenido. */
.section-block {
  padding: 64px 0 104px;   /* top 64 / bottom 104 (onda ~64px) */
  position: relative;
  overflow: visible;
}



/* Onda (top o bottom). Va fuera del flujo, ancho completo. */
.wave {
  position: absolute;
  left: 0;
  width: 100%;
  height: 40px;            /* alto de la onda */
  line-height: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 0;
}
.wave--top    { top: -1px; }
.wave--bottom { bottom: -1px; }

.wave svg {
  display: block;
  width: 100%;
  height: 100%;
}

/* Paleta de colores para la onda
   (aplicá una de estas clases extra en el mismo div.wave) */
.wave path { fill: #ffffff; }         /* fallback */


/* Suavizado para elementos con AOS */
[data-aos] { will-change: transform, opacity; }




/* =============================================================================================================================
   TECNOVEDADES (solo esta sección)
   ========================================================================================================================= */

/* Título TECNOVEDADES */
.noticias-innovacion h1 {
  font-size: 2.8rem;
  font-weight: 800;
  color: #ffffff;
  margin-bottom: 24px;
}


/* =============================================================================================================================
   RESUMEN SEMANAL (solo esta sección)
   ========================================================================================================================= */
.actividades-semanales h2 {
  font-size: 2.8rem;
  font-weight: 800;
  color: #ffffff;
  margin-bottom: 24px;
}


/* =============================================================================================================================
   NIVEL SECUNDARIO (solo esta sección)
   ========================================================================================================================= */
   /* Asegurá que el bloque permita ver la ola y tenga referencia de posición */
.courses-area.fix {
  position: relative;
  overflow: visible;        /* pisa el overflow:hidden de la plantilla */
  padding-bottom: 70px;    /* deja espacio para que la wave no tape nada */
}

/* Tamaño/capas de la ola (si no lo tenés ya) */
.wave {
  position: absolute;
  left: 0;
  width: 100%;
  height: 64px;
  line-height: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 2;               /* por arriba del fondo del section */
}

.wave--bottom { bottom: -1px; }
.wave--top    { top: -1px; }

.courses-area h1 {
  font-size: 2.9rem;
  font-weight: 900;
  color: #f2f2f2;   /* mismo color que Tecnovedades */
  margin-bottom: 24px;
}


.courses-area .titulo-m {
  font-size: 2.9rem;
  font-weight: 900;
  color: #251be2;   /* azul */
  margin-bottom: 24px;
}



.properties__caption p {
  font-weight: 900;   /* medio en negrita */
  color: #192de1;     /* blanco */
  font-size: 1.8rem;    /* tamaño un poquito más legible */
  margin-bottom: 8px; /* espacio debajo */
}
