/* ============================================================
   ServiCleaning — Fix: "Special Services" title overlapping the
   service cards grid.
   ------------------------------------------------------------
   Causa: el tema padre aplica margin-top negativo a las flechas
   del carrusel (.cctv_service_sec .gutentor-slick-arrows):
       style.css -> margin-top: -85px  !important
       media.css -> margin-top: -105px !important (tablet)
   Las flechas son el PRIMER hijo dentro de .gutentor-post-module,
   asi que el margen negativo jala TODO el bloque del grid hacia
   arriba, encimandolo con el <h2> "Special Services" y el <h6>.

   Solucion: margin-top:0 en el contenedor del modulo, y compensar
   la posicion estetica de las flechas con `top` (no afecta flujo).

   Revertir: borrar este archivo y quitar el enqueue en functions.php
   ============================================================ */

/* 1) Quitar el margen negativo que arrastra el grid hacia arriba.
      Se aplica a CUALQUIER descendiente para vencer el !important
      del padre, en cualquier nivel de anidacion. */
.cctv_service_sec .gutentor-slick-arrows,
.cctv_service_sec .gutentor-post-module > .gutentor-slick-arrows,
.cctv_service_sec .grid-container > .gutentor-slick-arrows {
	margin-top: 0 !important;
	position: relative;
	top: -85px;
	pointer-events: none;   /* el contenedor no debe bloquear clics */
	z-index: 5;
}

/* Los botones si deben recibir clics */
.cctv_service_sec .gutentor-slick-arrows button,
.cctv_service_sec .gutentor-slick-arrows .slick-arrow,
.cctv_service_sec .gutentor-slick-arrows a {
	pointer-events: auto;
}

/* 2) Garantizar que el titulo y subtitulo queden SIEMPRE por encima
      y con su propio flujo, nunca debajo del grid. */
.cctv_service_sec h2,
.cctv_service_sec h6 {
	position: relative;
	z-index: 10;
}

/* 3) El bloque del modulo del grid empieza limpio, sin subirse. */
.cctv_service_sec .gutentor-post-module,
.cctv_service_sec .gutentor-post-module.section-b8105b2a-65fd-47ae-9338-e9be1975af8b {
	position: relative;
	z-index: 1;
}

/* 4) Separacion real entre el subtitulo y las tarjetas.
      El <h6> y el <section> del grid son hermanos, pero el grid
      viene envuelto; se cubren ambos casos. */
.cctv_service_sec h6 + .gutentor-post-module,
.cctv_service_sec h6 + section.gutentor-post-module,
.cctv_service_sec .stk-block-heading + .gutentor-post-module,
.cctv_service_sec .stk-block-heading + section.gutentor-post-module,
.cctv_service_sec .gutentor-post-module.section-b8105b2a-65fd-47ae-9338-e9be1975af8b {
	margin-top: 40px !important;
}

/* 5) Tablet (aqui vivia el -105px). */
@media screen and (max-width: 1023px) {
	.cctv_service_sec .gutentor-slick-arrows,
	.cctv_service_sec .gutentor-post-module > .gutentor-slick-arrows,
	.cctv_service_sec .grid-container > .gutentor-slick-arrows {
		margin-top: 0 !important;
		top: -105px;
	}
	.cctv_service_sec h6 + .gutentor-post-module,
	.cctv_service_sec h6 + section.gutentor-post-module,
	.cctv_service_sec .stk-block-heading + .gutentor-post-module,
	.cctv_service_sec .stk-block-heading + section.gutentor-post-module,
	.cctv_service_sec .gutentor-post-module.section-b8105b2a-65fd-47ae-9338-e9be1975af8b {
		margin-top: 34px !important;
	}
}

/* 6) Movil: el padre ya oculta las flechas; solo aseguramos respiro. */
@media screen and (max-width: 767px) {
	.cctv_service_sec .gutentor-slick-arrows {
		display: none !important;
		top: 0;
	}
	.cctv_service_sec h6 + .gutentor-post-module,
	.cctv_service_sec h6 + section.gutentor-post-module,
	.cctv_service_sec .stk-block-heading + .gutentor-post-module,
	.cctv_service_sec .stk-block-heading + section.gutentor-post-module,
	.cctv_service_sec .gutentor-post-module.section-b8105b2a-65fd-47ae-9338-e9be1975af8b {
		margin-top: 25px !important;
	}
}