/*
 * CETTIC Motion
 * Las reglas de ocultamiento sólo se activan después de que JavaScript agrega
 * .cettic-motion-ready. Si JavaScript falla, todo el contenido sigue visible.
 */

body.page-id-4147 .entry-content > .cettic-home {
	width: 100% !important;
	max-width: none !important;
	margin-right: 0 !important;
	margin-left: 0 !important;
}

body.page-id-4147 .cettic-industries {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
}

body.page-id-4147 .cettic-card {
	height: auto;
	aspect-ratio: 1014 / 410;
}

body.page-id-4147 .cettic-card:nth-child(1) {
	order: 1;
}

body.page-id-4147 .cettic-card:nth-child(2) {
	order: 3;
}

body.page-id-4147 .cettic-card:nth-child(3) {
	order: 2;
}

body.page-id-4147 .cettic-card:nth-child(4) {
	order: 4;
}

body.page-id-4147 .cettic-card img {
	object-fit: contain;
	background: #0b0d10;
}

body.page-id-4147 .cettic-card:hover img {
	transform: none;
}

body.page-id-4147 .cettic-card h3 {
	right: 24px;
	bottom: 20px;
	left: 24px;
}

body.page-id-4147 .cettic-dot {
  display: none !important;
}

@media (max-width: 600px) {
  body.page-id-4147 .cettic-industries {
    grid-template-columns: 1fr;
  }
}

.cettic-motion-ready .cettic-reveal {
	opacity: 0;
	transform: translate3d(0, 28px, 0);
	transition:
		opacity 680ms cubic-bezier(.22, 1, .36, 1),
		transform 680ms cubic-bezier(.22, 1, .36, 1);
	transition-delay: var(--cettic-delay, 0ms);
	will-change: opacity, transform;
}

.cettic-motion-ready .cettic-reveal.cettic-is-visible {
	opacity: 1;
	transform: translate3d(0, 0, 0);
}

.cettic-motion-ready .cettic-hero-copy.cettic-reveal {
	transform: translate3d(-24px, 0, 0);
}

.cettic-motion-ready .cettic-collage > img {
	opacity: 0;
	transform: translate3d(24px, 0, 0) scale(.98);
	transition:
		opacity 820ms cubic-bezier(.22, 1, .36, 1),
		transform 820ms cubic-bezier(.22, 1, .36, 1);
	transition-delay: var(--cettic-delay, 120ms);
}

.cettic-motion-ready .cettic-collage.cettic-is-visible > img {
	opacity: 1;
	transform: translate3d(0, 0, 0) scale(1);
}

.cettic-card,
.cettic-work,
.cettic-video,
.cettic-gallery img {
	transition:
		transform 260ms ease,
		box-shadow 260ms ease,
		filter 260ms ease,
		opacity 220ms ease;
}

.cettic-card:hover,
.cettic-work:hover,
.cettic-video:hover {
	transform: translate3d(0, -7px, 0);
	box-shadow: 0 18px 42px rgba(0, 0, 0, .18);
}

.cettic-card img,
.cettic-work img,
.cettic-gallery img {
	transition: transform 420ms cubic-bezier(.22, 1, .36, 1), filter 260ms ease;
}

.cettic-card:hover img,
.cettic-work:hover img,
.cettic-gallery img:hover {
	transform: scale(1.035);
	filter: saturate(1.06) contrast(1.02);
}

.cettic-motion-ready .cettic-stat strong {
	display: inline-block;
	transform-origin: left center;
}

.cettic-motion-ready .cettic-stat.cettic-is-visible strong {
	animation: cettic-stat-pop 520ms cubic-bezier(.22, 1, .36, 1) both;
}

.cettic-motion-ready .cettic-btn {
	position: relative;
	overflow: hidden;
	isolation: isolate;
}

.cettic-motion-ready .cettic-btn::after {
	position: absolute;
	inset: -40% auto -40% -45%;
	width: 28%;
	content: "";
	background: linear-gradient(90deg, transparent, rgba(255,255,255,.36), transparent);
	transform: skewX(-18deg);
	transition: left 540ms ease;
	z-index: -1;
}

.cettic-motion-ready .cettic-btn:hover::after {
	left: 120%;
}

.cettic-motion-ready .cettic-filter {
	cursor: pointer;
	transition:
		background-color 180ms ease,
		border-color 180ms ease,
		color 180ms ease,
		transform 180ms ease;
}

.cettic-motion-ready .cettic-filter:hover {
	transform: translateY(-2px);
}

.cettic-gallery img.cettic-gallery-leaving {
	opacity: 0;
	transform: scale(.96);
}

.cettic-gallery img[hidden] {
	display: none;
}

@keyframes cettic-stat-pop {
	0% { opacity: .25; transform: scale(.9); }
	100% { opacity: 1; transform: scale(1); }
}

@media (max-width: 768px) {
	.cettic-motion-ready .cettic-reveal,
	.cettic-motion-ready .cettic-hero-copy.cettic-reveal {
		transform: translate3d(0, 18px, 0);
		transition-duration: 520ms;
	}

	.cettic-card:hover,
	.cettic-work:hover,
	.cettic-video:hover,
	.cettic-gallery img:hover {
		transform: none;
		box-shadow: none;
		filter: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.cettic-motion-ready .cettic-reveal,
	.cettic-motion-ready .cettic-collage > img,
	.cettic-card,
	.cettic-work,
	.cettic-video,
	.cettic-gallery img,
	.cettic-card img,
	.cettic-work img,
	.cettic-btn::after,
	.cettic-stat strong {
		animation: none !important;
		transition: none !important;
		transform: none !important;
		opacity: 1 !important;
	}
}
