/* ============================================================
   TERRENE — ANIMATIONS
   Keyframes, split-text wrappers, reduced-motion overrides.
   ============================================================ */

/* ---------- KEYFRAMES ---------- */
@keyframes terrene-scroll-cue {
	0%   { transform: translateY(-100%); }
	60%  { transform: translateY(250%); }
	100% { transform: translateY(250%); }
}

@keyframes terrene-cart-pulse {
	0%   { transform: scale(1); }
	40%  { transform: scale(1.3); }
	100% { transform: scale(1); }
}

.terrene-cart-count.is-pulse {
	animation: terrene-cart-pulse 0.6s ease;
}

/* ---------- SPLIT-TEXT WRAPPERS ----------
   The JS wraps each word in .split-word > .split-word-inner.
   .split-word clips the inner so it can slide up from below.
   Padding on the inner preserves descenders without breaking layout.
   ------------------------------------------------------------ */
.split-word {
	display: inline-block;
	overflow: hidden;
	vertical-align: bottom;
	line-height: inherit;
}
.split-word-inner {
	display: inline-block;
	padding-bottom: 0.08em;
	margin-bottom: -0.08em;
	will-change: transform;
}

/* ---------- FOCUS / HOVER TRANSITIONS ---------- */
.main-navigation a,
.header-icon,
.btn,
.btn-arrow,
.product-card__media img,
.category-card__media img,
.faq-item__icon {
	will-change: transform, color, background-color;
}

/* ---------- REDUCED MOTION ----------
   Honour the OS setting. GSAP code also checks this before
   running, so this is a second line of defence.
   ------------------------------------------------------------ */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}

	.hero-scroll-line::after { animation: none; }
	.terrene-cart-count.is-pulse { animation: none; }
	.product-card__media img,
	.category-card__media img { transition: none; }
	.split-word-inner { transform: none !important; }
}


/* 1.0.4 — Terrain image camera journey. Static, accessible layout first. */
.terrain-entry { position: relative; background: var(--terrene-bg); }
.terrain-stage { position: relative; }
.terrain-arrival { position: relative; padding-block: clamp(7rem, 15vh, 11rem); }
.terrain-arrival h1 { max-width: 12ch; font-family: var(--font-display); font-size: clamp(3rem, 9vw, 10rem); font-weight: 800; line-height: .95; letter-spacing: -.06em; margin: 1.5rem 0; }
.terrain-eyebrow { font-size: .75rem; letter-spacing: .2em; text-transform: uppercase; color: var(--terrene-accent); }
.terrain-description { max-width: 42ch; color: var(--terrene-text-muted); margin-bottom: 2rem; }
.terrain-continue { display: block; width: fit-content; margin-top: 1.5rem; font-size: .8rem; }
.terrain-camera { position: relative; overflow: hidden; }
.terrain-camera img { display: block; width: 100%; height: auto; }
.terrain-invitation, .terrain-skip, .terrain-progress, .terrain-chapter { display: none; }
@media (prefers-reduced-motion: no-preference) {
 .terrain-entry.is-enhanced .terrain-stage { height: 100vh; height: 100svh; overflow: hidden; }
 .terrain-entry.is-enhanced .terrain-arrival { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding-top: max(6rem, 10vh); padding-bottom: 3rem; background: radial-gradient(ellipse at 80% 20%, #242d1e, transparent 60%); }
 .terrain-entry.is-enhanced .terrain-camera { position: absolute; inset: 0; z-index: 2; overflow: hidden; pointer-events: none; }
 .terrain-camera.has-contours > img { display: none; }
 .terrain-contours { display: block; position: absolute; inset: 0; width: 100%; height: 100%; }
 .terrain-entry.is-enhanced .terrain-chapter { display: flex; align-items: center; justify-content: center; position: absolute; inset: 0; padding: 1.25rem; z-index: 3; text-align: center; font-family: Georgia, 'Times New Roman', serif; font-size: clamp(2.15rem, 5.1vw, 6rem); font-weight: 400; line-height: 1.15; color: #fff; text-shadow: 0 2px 15px #0005; opacity: 0; visibility: hidden; pointer-events: none; }
 .terrain-entry.is-enhanced .terrain-invitation { display: block; position: absolute; z-index: 3; left: max(1.5rem, 5vw); bottom: 8vh; color: white; text-shadow: 0 2px 25px #0009; pointer-events: none; }
 .terrain-invitation > span:first-child { font-size: .75rem; letter-spacing: .18em; text-transform: uppercase; }
 .terrain-invitation p { font-family: Georgia, 'Times New Roman', serif; font-size: clamp(3rem, 7vw, 8rem); line-height: 1; letter-spacing: -.04em; margin: 1rem 0 1.5rem; }
 .terrain-scroll-label { font-size: .65rem; letter-spacing: .2em; }
 .terrain-entry.is-enhanced .terrain-skip { display: block; position: absolute; z-index: 4; right: max(1.5rem, 5vw); bottom: 2rem; color: #fff; font-size: .75rem; text-shadow: 0 1px 8px #000; }
 .terrain-entry.is-enhanced .terrain-progress { display: block; position: absolute; z-index: 4; inset: auto 0 0; height: 2px; background: #ffffff20; }
 .terrain-progress span { display: block; width: 100%; height: 100%; background: var(--terrene-accent); transform: scaleX(0); transform-origin: left; }
}
@media (max-width: 767px) {
 .terrain-arrival h1 { font-size: clamp(2.6rem, 13vw, 5rem); }
 .terrain-entry.is-enhanced .terrain-arrival { padding-top: 6rem; padding-bottom: 2.5rem; }
}
@media (max-height: 600px) {
 .terrain-entry.is-enhanced .terrain-arrival { padding-top: 5rem; padding-bottom: 1rem; }
 .terrain-arrival h1 { font-size: clamp(2rem, 8vh, 4rem); margin-block: .5rem; }
 .terrain-description { margin-bottom: .75rem; }
 .terrain-continue { margin-top: .75rem; }
}

@media (max-width: 767px) { .terrain-entry.is-enhanced .terrain-chapter { font-size: clamp(2rem, 8vw, 3.5rem); } }

.terrain-camera.has-contours > img.terrain-custom-cover { display: block; position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; object-fit: cover; }