/* Home 918 / Nuestras áreas principales — premium editable accent and LED strip layer. */

/* Every card now receives its accent directly from its Elementor repeater.
 * No position-based override is allowed: the chosen colour controls both the
 * lower LED strip and the complete hover/focus border halo.
 */

/* The coloured lower rule becomes a restrained LED source, not a flat border.
 * All LED variables intentionally use fallbacks here instead of being defined on
 * a high-specificity selector, so Elementor-generated control values can override them.
 */
#servicios .fixarray-action-cards--panoramic .fixarray-action-card::before {
	content: "";
	position: absolute;
	z-index: 8;
	left: 0;
	right: 0;
	bottom: 0;
	height: var(--fax-home-area-led-height, 4px);
	background: var(--fax-accent);
	opacity: var(--fax-home-area-led-opacity, 0);
	pointer-events: none;
	transform-origin: center bottom;
	transition:
		height 260ms ease,
		filter 260ms ease,
		box-shadow 260ms ease,
		background-position 520ms cubic-bezier(.2,.75,.2,1),
		opacity 260ms ease;
}

@supports (color: color-mix(in srgb, red, transparent)) {
	#servicios .fixarray-action-cards--panoramic .fixarray-action-card::before {
		background:
			linear-gradient(
				90deg,
				color-mix(in srgb, var(--fax-accent) 82%, #ffffff 18%) 0%,
				var(--fax-accent) 18%,
				color-mix(in srgb, var(--fax-accent) 68%, #ffffff 32%) 48%,
				color-mix(in srgb, var(--fax-accent) 86%, #ffffff 14%) 56%,
				var(--fax-accent) 82%,
				color-mix(in srgb, var(--fax-accent) 82%, #ffffff 18%) 100%
			);
		background-size: 155% 100%;
		background-position: 0 0;
		box-shadow:
			0 -1px 3px color-mix(in srgb, var(--fax-accent) var(--fax-home-area-led-intensity, 72%), transparent),
			0 -5px calc(var(--fax-home-area-led-blur, 20px) * .55) -4px color-mix(in srgb, var(--fax-accent) 48%, transparent),
			0 -10px var(--fax-home-area-led-blur, 20px) -10px color-mix(in srgb, var(--fax-accent) 26%, transparent);
		filter: saturate(1.08) brightness(1.04);
	}

	#servicios .fixarray-action-cards--panoramic .fixarray-action-card:hover::before,
	#servicios .fixarray-action-cards--panoramic .fixarray-action-card:focus-visible::before {
		height: calc(var(--fax-home-area-led-height, 4px) + 1px);
		background-position: 100% 0;
		box-shadow:
			0 -1px 4px color-mix(in srgb, var(--fax-accent) 94%, #ffffff 6%),
			0 -5px calc(var(--fax-home-area-led-blur, 20px) * .7) -2px color-mix(in srgb, var(--fax-accent) 72%, transparent),
			0 -10px calc(var(--fax-home-area-led-blur, 20px) + 8px) -8px color-mix(in srgb, var(--fax-accent) 42%, transparent),
			0 -18px calc(var(--fax-home-area-led-blur, 20px) + 14px) -16px color-mix(in srgb, var(--fax-accent) 24%, transparent);
		filter: saturate(1.22) brightness(1.24);
	}

	/* Keep the existing whole-card halo matched to any Elementor override colour. */
	#servicios .fixarray-action-cards--panoramic .fixarray-action-card:hover,
	#servicios .fixarray-action-cards--panoramic .fixarray-action-card:focus-visible {
		border-color: color-mix(in srgb, var(--fax-accent) 88%, #ffffff 12%);
		box-shadow:
			0 0 0 1px color-mix(in srgb, var(--fax-accent) 88%, transparent),
			0 0 18px color-mix(in srgb, var(--fax-accent) 56%, transparent),
			0 0 38px color-mix(in srgb, var(--fax-accent) 28%, transparent),
			0 22px 44px -26px rgba(2,13,32,.82);
	}
}

/* The two requested light-blue hover buttons use dark text for premium contrast. */
#servicios .fixarray-action-cards--panoramic .fixarray-action-card:nth-child(3):hover .fixarray-action-card__footer span,
#servicios .fixarray-action-cards--panoramic .fixarray-action-card:nth-child(3):focus-visible .fixarray-action-card__footer span,
#servicios .fixarray-action-cards--panoramic .fixarray-action-card:nth-child(5):hover .fixarray-action-card__footer span,
#servicios .fixarray-action-cards--panoramic .fixarray-action-card:nth-child(5):focus-visible .fixarray-action-card__footer span {
	color: var(--fax-area-button-hover-text, #071B43);
}

@media (prefers-reduced-motion: reduce) {
	#servicios .fixarray-action-cards--panoramic .fixarray-action-card::before {
		transition-duration: .001ms !important;
	}
}

/* Home 918 buttons — button hover is independent from card hover. */
#servicios .fixarray-action-cards--panoramic .fixarray-action-card__footer span,
#servicios .fixarray-action-cards--panoramic .fixarray-action-card:hover .fixarray-action-card__footer span,
#servicios .fixarray-action-cards--panoramic .fixarray-action-card:focus-visible .fixarray-action-card__footer span {
	border-color: var(--fax-home-area-button-base, #F97316) !important;
	background: var(--fax-home-area-button-base, #F97316) !important;
	color: var(--fax-home-area-button-text, #FFFFFF) !important;
	box-shadow: 0 10px 22px -16px rgba(4,17,38,.55) !important;
	transform: none !important;
}

@media (hover: hover) and (pointer: fine) {
	#servicios .fixarray-action-cards--panoramic .fixarray-action-card:hover .fixarray-action-card__footer span:hover {
		border-color: var(--fax-home-area-button-hover, #51ADE5) !important;
		background: var(--fax-home-area-button-hover, #51ADE5) !important;
		color: var(--fax-home-area-button-hover-text, #071B43) !important;
		box-shadow:
			0 0 0 1px color-mix(in srgb, var(--fax-home-area-button-hover, #51ADE5) 78%, transparent),
			0 0 16px color-mix(in srgb, var(--fax-home-area-button-hover, #51ADE5) 48%, transparent),
			0 12px 26px -15px rgba(4,17,38,.68) !important;
		transform: translateY(-1px) !important;
	}
}