/* ==========================================================================
   Rysque — hover micro-interactions, marquee, keyframes
   Reveal-on-scroll base state lives in base.css; this file is the rest of
   the motion system (things that aren't just "fade/slide in once").
   ========================================================================== */

@keyframes rq-marquee {
	from { transform: translateX(0); }
	to { transform: translateX(-50%); }
}

.rq-marquee {
	overflow: hidden;
	white-space: nowrap;
}
.rq-marquee__track {
	display: inline-flex;
	width: max-content;
	animation: rq-marquee 26s linear infinite;
}
.rq-marquee__item {
	display: inline-flex;
	align-items: center;
	gap: 0.6em;
	padding-inline: 0.6em;
}
@media (prefers-reduced-motion: reduce) {
	.rq-marquee__track { animation: none; }
	.rq-marquee { overflow-x: auto; }
}

/* Image scale-on-hover used by product/lookbook cards */
.rq-media-hover { overflow: hidden; }
.rq-media-hover img {
	transition: transform 0.6s var(--rq-ease-strike);
	will-change: transform;
}
.rq-media-hover:hover img,
.rq-media-hover:focus-within img {
	transform: scale(1.045);
}
@media (prefers-reduced-motion: reduce) {
	.rq-media-hover img { transition: none; }
}

/* Sharp diagonal strike-in used for the hero wordmark + badges */
@keyframes rq-strike-in {
	from { opacity: 0; transform: translate3d(-16px, 10px, 0) skewX(-4deg); }
	to { opacity: 1; transform: translate3d(0, 0, 0) skewX(0); }
}
.rq-strike-in {
	animation: rq-strike-in 0.9s var(--rq-ease-strike) both;
}
@media (prefers-reduced-motion: reduce) {
	.rq-strike-in { animation: none; }
}

/* Entrance curtain — see the inline script in header.php (is_front_page() only) */
html.rq-curtain-active { overflow: hidden; }
.rq-curtain {
	position: fixed; inset: 0; z-index: 9999;
	pointer-events: none;
}
.rq-curtain__panel {
	position: absolute; inset: 0;
	background: var(--rq-void);
	transition: transform 0.9s cubic-bezier(0.76, 0, 0.24, 1);
}
.rq-curtain__panel--a { clip-path: polygon(0 0, 100% 0, 100% 54%, 0 44%); }
.rq-curtain__panel--b {
	clip-path: polygon(0 44%, 100% 54%, 100% 100%, 0 100%);
	background: var(--rq-burgundy-dark);
}
.rq-curtain.is-leaving .rq-curtain__panel--a { transform: translate3d(0, -105%, 0); }
.rq-curtain.is-leaving .rq-curtain__panel--b { transform: translate3d(0, 105%, 0); }
.rq-curtain__mark {
	position: absolute; inset: 0;
	display: flex; align-items: center; justify-content: center;
	font-family: var(--rq-display);
	font-weight: 800;
	font-size: clamp(28px, 5vw, 56px);
	letter-spacing: 0.04em;
	color: var(--rq-bone);
	opacity: 1;
	transition: opacity 0.35s ease;
}
.rq-curtain.is-leaving .rq-curtain__mark { opacity: 0; }

/* Custom cursor */
body.rq-has-cursor { cursor: none; }
body.rq-has-cursor a, body.rq-has-cursor button, body.rq-has-cursor .rq-btn { cursor: none; }
.rq-cursor-ring, .rq-cursor-dot {
	position: fixed; top: 0; left: 0; z-index: 9998;
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.2s ease, width 0.25s var(--rq-ease-strike), height 0.25s var(--rq-ease-strike), background 0.25s ease;
}
.rq-cursor-ring {
	width: 32px; height: 32px;
	margin: -16px 0 0 -16px;
	border: 1px solid var(--rq-burgundy);
	border-radius: 50%;
}
.rq-cursor-dot {
	width: 6px; height: 6px;
	margin: -3px 0 0 -3px;
	background: var(--rq-burgundy);
	border-radius: 50%;
}
body.rq-cursor-hover .rq-cursor-ring { width: 52px; height: 52px; margin: -26px 0 0 -26px; background: rgba(150, 28, 89, 0.08); }
body.rq-cursor-view .rq-cursor-ring { width: 76px; height: 76px; margin: -38px 0 0 -38px; background: var(--rq-burgundy); border-color: transparent; }
body.rq-cursor-view .rq-cursor-dot { opacity: 0; }
body.rq-cursor-suppressed .rq-cursor-ring, body.rq-cursor-suppressed .rq-cursor-dot { opacity: 0 !important; }
@media (max-width: 900px) {
	.rq-cursor-ring, .rq-cursor-dot { display: none; }
	body.rq-has-cursor { cursor: auto; }
	body.rq-has-cursor a, body.rq-has-cursor button, body.rq-has-cursor .rq-btn { cursor: pointer; }
}

/* Badge pulse — used sparingly, e.g. "last units" */
@keyframes rq-pulse {
	0%, 100% { opacity: 1; }
	50% { opacity: 0.55; }
}
.rq-badge--pulse { animation: rq-pulse 1.8s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) {
	.rq-badge--pulse { animation: none; }
}