/* ── Hero — pure CSS animation, fires on page load ── */
	@keyframes sf-rise {
		from { opacity: 0; transform: translateY(24px); }
		to   { opacity: 1; transform: translateY(0);    }
	}
	.sf-hero .sf-eyebrow { animation: sf-rise 0.70s cubic-bezier(0.25,0.46,0.45,0.94) 0.10s both; }
	.sf-hero .sf-h1      { animation: sf-rise 0.85s cubic-bezier(0.25,0.46,0.45,0.94) 0.22s both; }
	.sf-hero .sf-lead    { animation: sf-rise 0.70s cubic-bezier(0.25,0.46,0.45,0.94) 0.40s both; }
	.sf-hero .sf-btn-row { animation: sf-rise 0.65s cubic-bezier(0.25,0.46,0.45,0.94) 0.56s both; }

	/* ── Scroll-reveal base state ── */
	.sf-will-anim {
		opacity:    0;
		transform:  translateY(24px);
		transition: opacity  0.68s cubic-bezier(0.25,0.46,0.45,0.94),
		            transform 0.68s cubic-bezier(0.25,0.46,0.45,0.94);
		will-change: opacity, transform;
	}
	.sf-will-anim.sf-in {
		opacity:   1;
		transform: translateY(0);
		will-change: auto;
	}

	/* ── Scale variant — for large metric figures ── */
	.sf-will-anim.sf-scale-in {
		transform: scale(0.93) translateY(16px);
	}
	.sf-will-anim.sf-scale-in.sf-in {
		transform: scale(1) translateY(0);
	}

	/* ── Stagger delay tokens ── */
	.sf-will-anim.sf-d1 { transition-delay: 0.07s; }
	.sf-will-anim.sf-d2 { transition-delay: 0.14s; }
	.sf-will-anim.sf-d3 { transition-delay: 0.21s; }
	.sf-will-anim.sf-d4 { transition-delay: 0.28s; }
	.sf-will-anim.sf-d5 { transition-delay: 0.35s; }
	.sf-will-anim.sf-d6 { transition-delay: 0.42s; }
	.sf-will-anim.sf-d7 { transition-delay: 0.49s; }
	.sf-will-anim.sf-d8 { transition-delay: 0.52s; }

	/* ── Respect prefers-reduced-motion ── */
	@media (prefers-reduced-motion: reduce) {
		.sf-hero .sf-eyebrow,
		.sf-hero .sf-h1,
		.sf-hero .sf-lead,
		.sf-hero .sf-btn-row  { animation: none !important; opacity: 1 !important; transform: none !important; }
		.sf-will-anim         { opacity: 1 !important; transform: none !important;
		                        transition: none !important; will-change: auto !important; }
	}

	/* ── Card hover effects (.CARD.sf-in = 0-2-0, beats .sf-will-anim 0-1-0) ── */

	/* Primary cards — lift + shadow */
	.sf-eco-card.sf-in,
	.sf-cap-card.sf-in,
	.sf-out-card.sf-in {
		transition: transform 0.42s cubic-bezier(0.25,0.46,0.45,0.94),
		            box-shadow 0.42s cubic-bezier(0.25,0.46,0.45,0.94);
	}
	.sf-eco-card.sf-in:hover,
	.sf-cap-card.sf-in:hover,
	.sf-out-card.sf-in:hover {
		transform: translateY(-6px);
		box-shadow: 0 0 0 1px rgba(0,0,0,0.07), 0 14px 36px rgba(0,0,0,0.10);
	}

	/* VMV value cards — lift */
	.sf-vmv-val-card.sf-in {
		transition: transform 0.36s cubic-bezier(0.25,0.46,0.45,0.94),
		            background 0.24s;
	}
	.sf-vmv-val-card.sf-in:hover { transform: translateY(-4px); background: #ebebed; }

	/* Values cards — lift + shadow */
	.sf-val-card.sf-in {
		transition: transform 0.38s cubic-bezier(0.25,0.46,0.45,0.94),
		            box-shadow 0.38s cubic-bezier(0.25,0.46,0.45,0.94);
	}
	.sf-val-card.sf-in:hover {
		transform: translateY(-5px);
		box-shadow: 0 0 0 1px rgba(0,0,0,0.07), 0 12px 30px rgba(0,0,0,0.09);
	}

	/* Market tiles — subtle lift + border emphasis */
	.sf-mkt-tile.sf-in {
		transition: transform 0.24s cubic-bezier(0.25,0.46,0.45,0.94),
		            box-shadow 0.24s cubic-bezier(0.25,0.46,0.45,0.94),
		            border-color 0.24s;
	}
	.sf-mkt-tile.sf-in:hover {
		transform: translateY(-3px);
		box-shadow: 0 0 0 1.5px rgba(255,199,0,0.30), 0 6px 18px rgba(0,0,0,0.07);
	}

	/* Tech items — subtle lift + background shift */
	.sf-tech-item.sf-in {
		transition: background 0.22s,
		            transform 0.28s cubic-bezier(0.25,0.46,0.45,0.94);
	}
	.sf-tech-item.sf-in:hover { background: #e8e8ea; transform: translateY(-2px); }

	/* Env items — very subtle background shift */
	.sf-env-item.sf-in {
		transition: background 0.22s,
		            transform 0.26s cubic-bezier(0.25,0.46,0.45,0.94);
	}
	.sf-env-item.sf-in:hover { background: #ebebed; transform: translateY(-1px); }

	/* People items — very subtle */
	.sf-people-item.sf-in {
		transition: background 0.22s,
		            transform 0.26s cubic-bezier(0.25,0.46,0.45,0.94);
	}
	.sf-people-item.sf-in:hover { background: #ebebed; transform: translateY(-1px); }

	/* Process steps — top border accent on hover */
	.sf-proc-step.sf-in {
		transition: border-color 0.28s;
	}
	.sf-proc-step.sf-in:hover { border-top-color: var(--yellow); }

	/* Philosophy pillars — left border accent on hover */
	.sf-phil-pillar.sf-in {
		transition: border-color 0.24s, padding-left 0.24s;
	}
	.sf-phil-pillar.sf-in:hover { border-left-color: var(--yellow); padding-left: 24px; }

	@media (prefers-reduced-motion: reduce) {
		.sf-eco-card.sf-in, .sf-cap-card.sf-in, .sf-out-card.sf-in,
		.sf-val-card.sf-in, .sf-vmv-val-card.sf-in, .sf-mkt-tile.sf-in,
		.sf-tech-item.sf-in, .sf-env-item.sf-in, .sf-people-item.sf-in,
		.sf-proc-step.sf-in, .sf-phil-pillar.sf-in {
			transition: none !important;
		}
	}