/* LCS theme — motion. Everything here is switched off under prefers-reduced-motion. */

@keyframes lcs-marquee { to { transform: translateX(-50%); } }
@keyframes lcs-ping {
	0% { box-shadow: 0 0 0 0 rgb(240 90 40 / .55); }
	80%, 100% { box-shadow: 0 0 0 10px rgb(240 90 40 / 0); }
}
@keyframes lcs-pop {
	from { opacity: 0; transform: translateY(12px) scale(.98); }
	to { opacity: 1; transform: none; }
}

/* Scroll reveal (only hides content once JS has confirmed it is running) */
.js .reveal {
	opacity: 0;
	transform: translateY(28px);
	transition: opacity .8s var(--lcs-ease) var(--reveal-delay, 0ms), transform .8s var(--lcs-ease) var(--reveal-delay, 0ms);
}
.js .reveal.is-visible { opacity: 1; transform: none; }

/* Eyebrow signal dot */
.lcs-eyebrow::before { animation: lcs-ping 2.4s infinite; }

/* Glow cards: cursor-following light + slight tilt */
.is-style-glow-card {
	transform: perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg));
	transition: transform .4s var(--lcs-ease), border-color .3s, box-shadow .3s;
}
.is-style-glow-card::before {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(420px circle at var(--mx, 50%) var(--my, 0%), rgb(43 155 216 / .2), transparent 45%);
	opacity: 0;
	transition: opacity .3s;
	pointer-events: none;
}
.is-style-glow-card > * { position: relative; z-index: 1; }
.is-style-glow-card:hover { border-color: rgb(34 211 238 / .45); box-shadow: 0 24px 60px -24px rgb(43 155 216 / .55); }
.is-style-glow-card:hover::before { opacity: 1; }

/* Case cards: zoom, tint, "View project" */
.lcs-case-card .wp-block-post-featured-image img { transition: transform .9s var(--lcs-ease); }
.lcs-case-card:hover .wp-block-post-featured-image img { transform: scale(1.07); }
.lcs-case-card::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: radial-gradient(500px circle at var(--mx, 50%) var(--my, 50%), rgb(43 155 216 / .35), transparent 50%);
	opacity: 0;
	transition: opacity .4s;
}
.lcs-case-card:hover::before { opacity: 1; }
.lcs-case-card { transition: border-color .3s; }
.lcs-case-card:hover { border-color: rgb(34 211 238 / .45); }
.lcs-case-card__body::after {
	content: "View project →";
	display: block;
	margin-top: .8rem;
	font-weight: 600;
	font-size: .9rem;
	color: var(--wp--preset--color--accent);
	opacity: 0;
	transform: translateY(8px);
	transition: opacity .3s, transform .3s var(--lcs-ease);
}
.lcs-case-card:hover .lcs-case-card__body::after,
.lcs-case-card:focus-within .lcs-case-card__body::after { opacity: 1; transform: none; }
@media (hover: none) { .lcs-case-card__body::after { opacity: 1; transform: none; } }

/* Filtered cards pop in */
.lcs-case-grid .wp-block-post:not([hidden]) { animation: lcs-pop .45s var(--lcs-ease) both; }

/* Marquee */
.lcs-marquee.is-running {
	flex-wrap: nowrap;
	justify-content: flex-start;
	width: max-content;
	animation: lcs-marquee var(--marquee-duration, 32s) linear infinite;
}
.lcs-marquee-section:hover .lcs-marquee.is-running { animation-play-state: paused; }

/* Process steps: line draws in */
.lcs-steps .wp-block-column::before {
	content: "";
	position: absolute;
	top: -1px; left: 0;
	height: 1px;
	width: 0;
	background: var(--wp--preset--gradient--brand);
	transition: width 1.2s var(--lcs-ease) var(--reveal-delay, 0ms);
}
.lcs-steps .wp-block-column.is-visible::before { width: 100%; }

/* Magnetic buttons ease back */
.lcs-magnetic .wp-block-button__link { will-change: transform; }

/* Mobile menu: panel slides in, top-level links rise in one after another */
.wp-block-navigation__responsive-container.is-menu-open { animation: lcs-menu-in .38s var(--lcs-ease) both; }
.is-menu-open .wp-block-navigation__container > li { animation: lcs-menu-item .45s var(--lcs-ease) both; animation-delay: calc(.06s * var(--i, 0) + .1s); }
.is-menu-open .lcs-subtoggle svg { transition: transform .3s var(--lcs-ease); }
/* Opening a section: its links slide down one by one. Tapping a link nudges it and turns it cyan. */
.is-menu-open .lcs-sub-open > .wp-block-navigation__submenu-container > li { animation: lcs-sub-item .32s var(--lcs-ease) both; }
.is-menu-open .lcs-sub-open > .wp-block-navigation__submenu-container > li:nth-child(2) { animation-delay: .05s; }
.is-menu-open .lcs-sub-open > .wp-block-navigation__submenu-container > li:nth-child(3) { animation-delay: .1s; }
.is-menu-open .lcs-sub-open > .wp-block-navigation__submenu-container > li:nth-child(n+4) { animation-delay: .15s; }
.is-menu-open .wp-block-navigation-item__content { transition: transform .2s var(--lcs-ease), color .2s; }
.is-menu-open .wp-block-navigation-item__content:active,
.is-menu-open .wp-block-navigation-item__content:hover { transform: translateX(6px); color: var(--wp--preset--color--accent); }
.is-menu-open .lcs-subtoggle { transition: border-color .25s, color .25s, transform .15s; }
.is-menu-open .lcs-subtoggle:active { transform: scale(.92); }
@keyframes lcs-sub-item { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@keyframes lcs-menu-in { from { opacity: 0; transform: translateX(8%); } to { opacity: 1; transform: none; } }
@keyframes lcs-menu-item { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* A day in your home: scene changes ease between states */
.lcs-house * { transition: opacity .7s var(--lcs-ease), transform .9s var(--lcs-ease), fill .9s var(--lcs-ease); }
.lcs-day__steps li { transition: border-color .4s; }

.lcs-system__links path { animation: lcs-flow 1.6s linear infinite; }
@keyframes lcs-flow { to { stroke-dashoffset: -20; } }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}
	.js .reveal { opacity: 1; transform: none; }
	.is-style-glow-card { transform: none; }
	.lcs-steps .wp-block-column::before { width: 100%; }
	.lcs-house *, .lcs-day__steps li { transition: none !important; }
	.lcs-system__links path { animation: none !important; }
	.wp-block-navigation__responsive-container.is-menu-open,
	.is-menu-open .wp-block-navigation__container > li,
	.is-menu-open .wp-block-navigation__submenu-container > li { animation: none !important; }
	.is-menu-open .wp-block-navigation-item__content:active,
	.is-menu-open .wp-block-navigation-item__content:hover { transform: none; }
}