/* ==========================================================================
   FIRST PRO — Motion system ("Motion Everywhere", spec docs/specs_v2_motion/09)
   --------------------------------------------------------------------------
   Layers
   1. Tokens            --fp-motion-* / --fp-ease-*
   2. Gate              html.fp-motion (JS + no reduced-motion + intensity ≠ off)
   3. Component states  buttons · links · nav · cards · chips · fields
   4. Registry          [data-fp-motion="…"] reusable components (see docs/MOTION_COMPONENT_REGISTRY.md)
   5. Signature scenes  geometry · storyboard · builder reveal (CSS parts; choreography in JS)
   Rules: content visible without JS; reduced-motion strips transforms; fine-pointer effects
   only under (hover:hover) and (pointer:fine); transforms/opacity only; no layout thrash.
   ========================================================================== */

/* 1 ───────────────────────────── Tokens */
:root {
	--fp-motion-fast: 160ms;      /* micro feedback 120–240 */
	--fp-motion-normal: 320ms;    /* panels 220–450 */
	--fp-motion-slow: 650ms;      /* section reveals 400–850 */
	--fp-ease-out: cubic-bezier(0.22, 1, 0.36, 1);
	--fp-ease-emphasized: cubic-bezier(0.16, 1, 0.3, 1);
	--fp-ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
	--fp-travel-xs: 6px;          /* magnetic bound */
	--fp-travel-sm: 12px;         /* light reveals (mobile) */
	--fp-travel-md: 24px;         /* reveals (desktop) */
	--fp-tilt: 4deg;              /* card tilt bound */
}
html[data-fp-intensity="cinematic"] { --fp-travel-md: 32px; --fp-tilt: 6deg; }
html[data-fp-intensity="off"] { --fp-motion-fast: 0ms; --fp-motion-normal: 0ms; --fp-motion-slow: 0ms; }

/* 2 ───────────────────────────── Gate: initial hidden states ONLY under html.fp-motion */
@media (prefers-reduced-motion: no-preference) {
	html.fp-motion .fp-reveal { opacity: 0; }
	html.fp-motion .fp-scene__bar { transform: scaleY(0.08); transform-origin: bottom; }
	html.fp-motion .fp-hero__index { opacity: 0; }
	html.fp-motion .fp-dir-cinematic .fp-plane { opacity: 0; }
	html.fp-motion [data-fp-motion="reveal-clip"] { clip-path: inset(0 0 100% 0); }
	html.fp-motion [data-fp-motion="draw"] path,
	html.fp-motion [data-fp-motion="draw"] circle,
	html.fp-motion [data-fp-motion="draw"] rect,
	html.fp-motion [data-fp-motion="draw"] line { stroke-dasharray: var(--fp-len, 400); stroke-dashoffset: var(--fp-len, 400); }
	html.fp-motion .fp-geometry__module { opacity: 0; }
}

/* 3 ───────────────────────────── Component states */

/* Buttons: hover (lift + light sweep + arrow shift) · press (compress) · focus (ring) ·
   disabled · loading (spinner, label dimmed) · success / error (icon + colour-independent text) */
.fp-btn,
.wp-block-button__link {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	transform: translate3d(var(--fp-mx, 0px), var(--fp-my, 0px), 0) scale(var(--fp-press, 1));
	transition:
		transform var(--fp-motion-fast) var(--fp-ease-out),
		background-color var(--fp-motion-fast) var(--fp-ease-out),
		color var(--fp-motion-fast) var(--fp-ease-out),
		border-color var(--fp-motion-fast) var(--fp-ease-out),
		box-shadow var(--fp-motion-normal) var(--fp-ease-out);
}
.fp-btn::before,
.wp-block-button__link::before {
	content: "";
	position: absolute; inset: -2px; z-index: -1; border-radius: inherit; pointer-events: none;
	background: linear-gradient(105deg, transparent 30%, rgba(255, 255, 255, 0.18) 50%, transparent 70%);
	transform: translate3d(-120%, 0, 0);
	transition: transform var(--fp-motion-slow) var(--fp-ease-out);
}
[dir="rtl"] .fp-btn::before,
[dir="rtl"] .wp-block-button__link::before { transform: translate3d(120%, 0, 0); }
.fp-btn .fp-icon { transition: transform var(--fp-motion-fast) var(--fp-ease-out); }
@media (hover: hover) and (pointer: fine) {
	.fp-btn:hover, .wp-block-button__link:hover { box-shadow: 0 14px 32px rgba(0, 0, 0, 0.14); }
	.fp-btn:hover::before, .wp-block-button__link:hover::before { transform: translate3d(120%, 0, 0); }
	[dir="rtl"] .fp-btn:hover::before, [dir="rtl"] .wp-block-button__link:hover::before { transform: translate3d(-120%, 0, 0); }
	.fp-btn:hover .fp-icon:last-child { transform: translateX(3px); }
	[dir="rtl"] .fp-btn:hover .fp-icon:last-child { transform: translateX(-3px); }
}
.fp-btn:active, .wp-block-button__link:active { --fp-press: 0.965; transition-duration: 90ms; }
.fp-btn[disabled], .fp-btn[aria-disabled="true"], .wp-block-button__link[aria-disabled="true"] { opacity: 0.55; cursor: not-allowed; box-shadow: none; --fp-mx: 0px; --fp-my: 0px; }

/* Loading / success / error states — set via data-state by JS; text always present for AT */
.fp-btn[data-state="loading"] { cursor: progress; color: transparent; pointer-events: none; }
.fp-btn[data-state="loading"]::after {
	content: ""; position: absolute; width: 1.1em; height: 1.1em; border-radius: 50%;
	border: 2px solid currentColor; border-color: var(--fp-inverse-fg) transparent var(--fp-inverse-fg) transparent;
	animation: fp-spin 800ms linear infinite;
}
.fp-btn--outline[data-state="loading"]::after { border-color: var(--fp-fg) transparent var(--fp-fg) transparent; }
.fp-btn[data-state="success"] { background: var(--fp-fg); color: var(--fp-bg); border-color: var(--fp-fg); }
.fp-btn[data-state="error"] { border-color: var(--fp-fg); background: transparent; color: var(--fp-fg); box-shadow: inset 0 0 0 1.5px var(--fp-fg); }
@keyframes fp-spin { to { transform: rotate(360deg); } }

/* Text links: underline draws from start */
.fp-link { border-bottom: 0; background-image: linear-gradient(currentColor, currentColor); background-repeat: no-repeat; background-size: 0% 1px; background-position: 0 100%; transition: background-size var(--fp-motion-normal) var(--fp-ease-out), gap var(--fp-motion-fast) var(--fp-ease-out); }
[dir="rtl"] .fp-link { background-position: 100% 100%; }
@media (hover: hover) and (pointer: fine) { .fp-link:hover { background-size: 100% 1px; } }
.fp-link:focus-visible { background-size: 100% 1px; }

/* Nav: underline draw + active continuity */
.fp-nav__list a { border-bottom: 0; position: relative; }
.fp-nav__list a::after { content: ""; position: absolute; inset-inline: 0; bottom: 0; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: var(--fp-origin-start, left) center; transition: transform var(--fp-motion-normal) var(--fp-ease-out); }
[dir="rtl"] .fp-nav__list a::after { --fp-origin-start: right; }
@media (hover: hover) and (pointer: fine) { .fp-nav__list a:hover::after { transform: scaleX(1); } }
.fp-nav__list a:focus-visible::after, .fp-nav__list .current-menu-item > a::after, .fp-nav__list [aria-expanded="true"]::after { transform: scaleX(1); }

/* Cards (services, cases): pointer-aware spotlight + bounded tilt on fine pointers; tap feedback on touch */
[data-fp-motion="card"] { transform: perspective(900px) rotateX(var(--fp-rx, 0deg)) rotateY(var(--fp-ry, 0deg)); transition: transform var(--fp-motion-normal) var(--fp-ease-out), background-color var(--fp-motion-normal) var(--fp-ease-out); transform-style: preserve-3d; }
[data-fp-motion="card"]::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; background: radial-gradient(360px circle at var(--fp-px, 50%) var(--fp-py, 50%), rgba(255, 255, 255, 0.10), transparent 60%); transition: opacity var(--fp-motion-normal) var(--fp-ease-out); }
.fp-dir-editorial [data-fp-motion="card"]::after { background: radial-gradient(360px circle at var(--fp-px, 50%) var(--fp-py, 50%), rgba(11, 11, 13, 0.06), transparent 60%); }
@media (hover: hover) and (pointer: fine) { [data-fp-motion="card"]:hover::after { opacity: 1; } }
/* Wide editorial rows: spotlight only — a 3D tilt on a full-width row distorts text. Tilt is reserved for compact cards. */
.fp-services--list [data-fp-motion="card"], .fp-services--chapters [data-fp-motion="card"] { --fp-tilt: 0; transform: none; }
@media (hover: none) { [data-fp-motion="card"]:active { transform: scale(0.985); transition-duration: 90ms; } }

/* Chips & choice cards: selection pop + check */
.fp-chip span, .fp-choice__box { transition: transform var(--fp-motion-fast) var(--fp-ease-out), background-color var(--fp-motion-fast) var(--fp-ease-out), color var(--fp-motion-fast) var(--fp-ease-out), border-color var(--fp-motion-fast) var(--fp-ease-out); }
.fp-chip input:checked + span, .fp-choice input:checked + .fp-choice__box { animation: fp-pop var(--fp-motion-normal) var(--fp-ease-emphasized); }
.fp-chip:active span, .fp-choice:active .fp-choice__box { transform: scale(0.97); }
.fp-chip input:checked + span::before { content: "✓"; font-size: 0.85em; margin-inline-end: 0.45em; animation: fp-check var(--fp-motion-normal) var(--fp-ease-out); }
@keyframes fp-pop { 0% { transform: scale(0.96); } 60% { transform: scale(1.03); } 100% { transform: scale(1); } }
@keyframes fp-check { from { opacity: 0; transform: translateY(-3px); } to { opacity: 1; transform: none; } }

/* Fields: focus highlight travels along the border */
.fp-textarea { transition: border-color var(--fp-motion-fast) var(--fp-ease-out), box-shadow var(--fp-motion-normal) var(--fp-ease-out); }
.fp-textarea:focus-visible { box-shadow: 0 0 0 3px color-mix(in srgb, var(--fp-fg) 10%, transparent); }
.fp-field--error .fp-field__label { color: var(--fp-fg); }
.fp-field__error { font-size: var(--fp-text-sm); color: var(--fp-fg); padding-inline-start: 1.4em; position: relative; }
.fp-field__error::before { content: "!"; position: absolute; inset-inline-start: 0; top: 0.1em; width: 1em; height: 1em; border-radius: 50%; border: 1.5px solid currentColor; font-size: 0.75em; display: grid; place-items: center; font-weight: 700; }

/* Inner pages (no GSAP): CSS reveals driven by interactions.js (.is-in). Hidden only while JS is live. */
@media (prefers-reduced-motion: no-preference) {
	html.fp-ix [data-fp-motion-region] .fp-reveal { opacity: 0; transform: translateY(var(--fp-travel-sm)); transition: opacity var(--fp-motion-slow) var(--fp-ease-out), transform var(--fp-motion-slow) var(--fp-ease-out); }
	html.fp-ix [data-fp-motion-region] .fp-reveal.is-in { opacity: 1; transform: none; }
	html.fp-ix [data-fp-motion-region] .fp-reveal-group .fp-reveal:nth-child(2) { transition-delay: 60ms; }
	html.fp-ix [data-fp-motion-region] .fp-reveal-group .fp-reveal:nth-child(3) { transition-delay: 120ms; }
	html.fp-ix [data-fp-motion-region] .fp-reveal-group .fp-reveal:nth-child(4) { transition-delay: 180ms; }
	html.fp-ix [data-fp-motion-region] .fp-reveal-group .fp-reveal:nth-child(5) { transition-delay: 240ms; }
}

/* 4 ───────────────────────────── Registry components */

/* reveal-clip: image/figure unmasks from top (JS removes the gate when in view) */
[data-fp-motion="reveal-clip"] { transition: clip-path var(--fp-motion-slow) var(--fp-ease-emphasized); }
[data-fp-motion="reveal-clip"].is-in { clip-path: inset(0 0 0 0) !important; }
/* draw: SVG strokes draw in (dash length set by JS from getTotalLength) */
[data-fp-motion="draw"] path, [data-fp-motion="draw"] circle, [data-fp-motion="draw"] rect, [data-fp-motion="draw"] line { transition: stroke-dashoffset var(--fp-motion-slow) var(--fp-ease-out); }
[data-fp-motion="draw"].is-in path, [data-fp-motion="draw"].is-in circle, [data-fp-motion="draw"].is-in rect, [data-fp-motion="draw"].is-in line { stroke-dashoffset: 0 !important; }
/* count: tabular numerals so digits don't jitter while counting */
[data-fp-motion="count"] { font-variant-numeric: tabular-nums; }
/* scroll cue */
.fp-scroll-cue { position: absolute; inset-inline-start: var(--fp-gutter); bottom: var(--fp-space-3); display: inline-flex; align-items: center; gap: 0.6em; font-size: var(--fp-text-xs); letter-spacing: 0.12em; text-transform: uppercase; color: var(--fp-fg-faint); text-decoration: none; }
[dir="rtl"] .fp-scroll-cue { letter-spacing: 0; text-transform: none; font-size: var(--fp-text-sm); }
.fp-scroll-cue__line { width: 1px; height: 2.25rem; background: currentColor; transform-origin: top; animation: fp-cue 1.8s var(--fp-ease-in-out) infinite; }
@keyframes fp-cue { 0% { transform: scaleY(0); transform-origin: top; } 50% { transform: scaleY(1); transform-origin: top; } 51% { transform-origin: bottom; } 100% { transform: scaleY(0); transform-origin: bottom; } }
@media (max-width: 63.99rem) { .fp-scroll-cue { display: none; } }

/* Mega menu (desktop): panel reveal; keyboard + Escape handled by header.js */
.fp-mega { position: absolute; inset-inline: 0; top: 100%; display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--fp-space-2); width: 100%; padding: var(--fp-space-3) max(var(--fp-gutter), calc((100% - var(--fp-wide)) / 2)) var(--fp-space-4); border-top: 1px solid var(--fp-rule); border-bottom: 1px solid var(--fp-rule); box-shadow: 0 24px 48px rgba(0, 0, 0, 0.08); background: var(--fp-bg); opacity: 0; visibility: hidden; transform: translateY(-6px); transition: opacity var(--fp-motion-normal) var(--fp-ease-out), transform var(--fp-motion-normal) var(--fp-ease-out), visibility 0s linear var(--fp-motion-normal); }
.fp-header.is-mega-open .fp-mega { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.fp-mega__item { display: grid; gap: 0.5rem; padding: var(--fp-space-2); border-radius: var(--fp-radius-md); text-decoration: none; color: inherit; transition: background-color var(--fp-motion-fast) var(--fp-ease-out), transform var(--fp-motion-fast) var(--fp-ease-out); }
.fp-mega__item:hover, .fp-mega__item:focus-visible { background: var(--fp-surface-2); }
.fp-mega__item .fp-glyph { width: 2.25rem; color: var(--fp-fg); }
.fp-mega__num { font-family: var(--fp-font-mono); font-size: var(--fp-text-xs); color: var(--fp-fg-faint); }
.fp-mega__title { font-weight: 600; font-size: var(--fp-text-sm); line-height: 1.3; }
.fp-mega__tag { font-size: var(--fp-text-xs); color: var(--fp-fg-muted); }
.fp-header.is-mega-open .fp-mega__item { animation: fp-rise var(--fp-motion-slow) var(--fp-ease-out) both; animation-delay: calc(var(--fp-i, 0) * 45ms); }
@keyframes fp-rise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (max-width: 63.99rem) { .fp-mega { position: static; grid-template-columns: 1fr; width: auto; padding: 0 0 var(--fp-space-2) 1rem; border: 0; opacity: 1; visibility: visible; transform: none; display: none; } .fp-header.is-mega-open .fp-mega { display: grid; } .fp-mega__item .fp-glyph { display: none; } }
.fp-nav__trigger { appearance: none; background: none; border: 0; padding: 0.4rem 0; font: inherit; font-size: var(--fp-text-sm); font-weight: 500; color: var(--fp-fg-muted); cursor: pointer; display: inline-flex; align-items: center; gap: 0.35em; position: relative; }
.fp-nav__trigger .fp-icon { width: 0.9em; height: 0.9em; transition: transform var(--fp-motion-fast) var(--fp-ease-out); }
.fp-nav__trigger[aria-expanded="true"] .fp-icon { transform: rotate(180deg); }
.fp-nav__trigger::after { content: ""; position: absolute; inset-inline: 0; bottom: 0; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: var(--fp-origin-start, left) center; transition: transform var(--fp-motion-normal) var(--fp-ease-out); }
[dir="rtl"] .fp-nav__trigger::after { --fp-origin-start: right; }
.fp-nav__trigger:hover::after, .fp-nav__trigger:focus-visible::after, .fp-nav__trigger[aria-expanded="true"]::after { transform: scaleX(1); }
@media (max-width: 63.99rem) { .fp-nav__trigger { display: flex; width: 100%; justify-content: space-between; font-size: var(--fp-text-xl); font-weight: 600; color: var(--fp-fg); padding: 0.75rem 0; border-bottom: 1px solid var(--fp-rule); } .fp-nav__trigger::after { display: none; } }

/* Progress line for cinematic chapters (JS, desktop) */
.fp-chapter-progress { position: fixed; inset-inline-start: 0; top: 0; height: 2px; width: 100%; transform-origin: 0 50%; background: var(--fp-paper); z-index: 55; pointer-events: none; transform: scaleX(0); }
[dir="rtl"] .fp-chapter-progress { transform-origin: 100% 50%; }

/* View transitions (same-document navigations, progressive) */
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: fp-vt-out 180ms var(--fp-ease-in-out) both; }
::view-transition-new(root) { animation: fp-vt-in 260ms var(--fp-ease-out) both; }
@keyframes fp-vt-out { to { opacity: 0; } }
@keyframes fp-vt-in { from { opacity: 0; transform: translateY(6px); } }

/* 5 ───────────────────────────── Signature scenes (CSS parts) */

/* Scene 1 — Brand Geometry: modular grid behind the hero (desktop); static arrangement + short reveal on phones */
.fp-geometry { position: absolute; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; color: var(--fp-fg); }
.fp-geometry svg { position: absolute; inset-inline-end: calc(-1 * var(--fp-gutter)); top: 3%; height: 74%; width: auto; max-width: 56%; opacity: 0.92; }
.fp-geometry__module { transform-box: fill-box; transform-origin: center; }
@media (max-width: 63.99rem) { .fp-geometry svg { max-width: 100%; height: 38%; top: auto; bottom: 0; opacity: 0.16; } }
@media (prefers-reduced-motion: reduce) { .fp-geometry__module { opacity: 1 !important; transform: none !important; } }

/* Scene 2 — Services storyboard: each glyph is an original SVG mini-scene with its own idle/hover behaviour */
.fp-service__art svg { overflow: visible; }
.fp-story { --fp-d: var(--fp-motion-slow); }
.fp-story * { transform-box: fill-box; transform-origin: center; transition: transform var(--fp-d) var(--fp-ease-emphasized), opacity var(--fp-d) var(--fp-ease-out); }
/* 01 marketing — rings ripple outward */
.fp-story--marketing .ring { opacity: 0.35; transform: scale(0.6); }
.is-in .fp-story--marketing .ring, :is(.fp-service, .fp-mega__item):hover .fp-story--marketing .ring, :is(.fp-service, .fp-mega__item):focus-within .fp-story--marketing .ring { opacity: 1; transform: scale(1); }
.fp-story--marketing .ring:nth-child(2) { transition-delay: 80ms; }
.fp-story--marketing .ring:nth-child(3) { transition-delay: 160ms; }
/* 02 branding — modules slide into alignment across the diagonal */
.fp-story--branding .sq1 { transform: translate(-14px, -14px); opacity: 0; }
.fp-story--branding .sq2 { transform: translate(14px, 14px); opacity: 0; }
.fp-story--branding .diag { stroke-dasharray: 90; stroke-dashoffset: 90; transition: stroke-dashoffset var(--fp-d) var(--fp-ease-out); }
.is-in .fp-story--branding .sq1, .is-in .fp-story--branding .sq2 { transform: none; opacity: 1; }
.is-in .fp-story--branding .diag { stroke-dashoffset: 0; }
:is(.fp-service, .fp-mega__item):hover .fp-story--branding .sq1 { transform: translate(-4px, -4px); }
:is(.fp-service, .fp-mega__item):hover .fp-story--branding .sq2 { transform: translate(4px, 4px); }
/* 03 web — the browser "renders": bars grow left→right one after another */
.fp-story--web .bar { transform: scaleX(0); transform-origin: left center; }
[dir="rtl"] .fp-story--web .bar { transform-origin: right center; }
.is-in .fp-story--web .bar { transform: scaleX(1); }
.fp-story--web .bar:nth-of-type(2) { transition-delay: 120ms; }
.fp-story--web .bar:nth-of-type(3) { transition-delay: 240ms; }
:is(.fp-service, .fp-mega__item):hover .fp-story--web .bar { transform: scaleX(1.06); }
/* 04 paid ads — trajectory draws toward the target, target pulses */
.fp-story--ads .path { stroke-dasharray: 120; stroke-dashoffset: 120; transition: stroke-dashoffset var(--fp-d) var(--fp-ease-out); }
.fp-story--ads .target { opacity: 0; transform: scale(0.4); transition-delay: 350ms; }
.is-in .fp-story--ads .path { stroke-dashoffset: 0; }
.is-in .fp-story--ads .target { opacity: 1; transform: scale(1); }
:is(.fp-service, .fp-mega__item):hover .fp-story--ads .target { transform: scale(1.15); }
/* 05 gifts — lid lifts, ribbon settles */
.fp-story--gifts .lid { transform: translateY(0); }
.fp-story--gifts .ribbon { opacity: 0; transform: translateY(6px); }
.is-in .fp-story--gifts .ribbon { opacity: 1; transform: none; }
:is(.fp-service, .fp-mega__item):hover .fp-story--gifts .lid, :is(.fp-service, .fp-mega__item):focus-within .fp-story--gifts .lid { transform: translateY(-7px) rotate(-4deg); }

/* Scene 3 — Builder reveal */
.fp-progress { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.4rem; margin-top: 0.5rem; }
.fp-progress span { height: 3px; border-radius: 2px; background: var(--fp-rule); overflow: hidden; position: relative; }
.fp-progress span::after { content: ""; position: absolute; inset: 0; background: var(--fp-fg); transform: scaleX(0); transform-origin: var(--fp-origin-start, left) center; transition: transform var(--fp-motion-normal) var(--fp-ease-out); }
[dir="rtl"] .fp-progress span::after { --fp-origin-start: right; }
.fp-progress span.is-done::after, .fp-progress span.is-current::after { transform: scaleX(1); }
.fp-progress span.is-current::after { animation: fp-progress-in var(--fp-motion-slow) var(--fp-ease-out); }
@keyframes fp-progress-in { from { transform: scaleX(0); } }
.fp-step.is-entering { animation: fp-step-in var(--fp-motion-normal) var(--fp-ease-out) both; }
.fp-step.is-entering-back { animation: fp-step-back var(--fp-motion-normal) var(--fp-ease-out) both; }
@keyframes fp-step-in { from { opacity: 0; transform: translateX(var(--fp-step-dir, 16px)); } to { opacity: 1; transform: none; } }
@keyframes fp-step-back { from { opacity: 0; transform: translateX(calc(-1 * var(--fp-step-dir, 16px))); } to { opacity: 1; transform: none; } }
[dir="rtl"] .fp-step { --fp-step-dir: -16px; }
.fp-brief.is-revealing .fp-brief__head { animation: fp-rise var(--fp-motion-slow) var(--fp-ease-out) both; }
.fp-brief.is-revealing .fp-brief__card { animation: fp-rise var(--fp-motion-slow) var(--fp-ease-out) both; animation-delay: calc(120ms + var(--fp-i, 0) * 60ms); }
.fp-brief.is-revealing .fp-brief__actions { animation: fp-rise var(--fp-motion-slow) var(--fp-ease-out) both; animation-delay: 700ms; }
/* Brief diagram: type → families → deliverables, lines draw after cards land */
.fp-diagram { display: grid; gap: var(--fp-space-2); }
.fp-diagram svg { width: 100%; height: auto; display: block; }
.fp-diagram .node rect { fill: var(--fp-bg); stroke: var(--fp-fg); stroke-width: 1.25; }
.fp-diagram .node text { fill: var(--fp-fg); font: 600 12px/1 var(--fp-font-sans); }
.fp-diagram .node--root rect { fill: var(--fp-fg); }
.fp-diagram .node--root text { fill: var(--fp-bg); }
.fp-diagram .edge { stroke: var(--fp-fg-faint); stroke-width: 1.25; fill: none; }
.fp-brief.is-revealing .fp-diagram .edge { stroke-dasharray: 600; stroke-dashoffset: 600; animation: fp-draw 900ms var(--fp-ease-out) forwards; animation-delay: 500ms; }
.fp-brief.is-revealing .fp-diagram .node { opacity: 0; animation: fp-rise var(--fp-motion-normal) var(--fp-ease-out) forwards; animation-delay: calc(300ms + var(--fp-i, 0) * 90ms); }
@keyframes fp-draw { to { stroke-dashoffset: 0; } }

/* Reduced motion / intensity off: strip transforms entirely rather than zeroing durations */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; scroll-behavior: auto !important; }
	.fp-btn, .wp-block-button__link, [data-fp-motion="card"] { transform: none !important; }
	.fp-btn::before, .wp-block-button__link::before { display: none; }
	.fp-dir-cinematic .fp-plane { transform: none; }
	.fp-chapter-progress, .fp-scroll-cue { display: none; }
	.fp-story * , .fp-story--branding .diag, .fp-story--ads .path { opacity: 1 !important; transform: none !important; stroke-dashoffset: 0 !important; }
	[data-fp-motion="reveal-clip"] { clip-path: none !important; }
	::view-transition-old(root), ::view-transition-new(root) { animation: none; }
}
html[data-fp-intensity="off"] .fp-btn, html[data-fp-intensity="off"] .wp-block-button__link, html[data-fp-intensity="off"] [data-fp-motion="card"] { transform: none !important; }
html[data-fp-intensity="off"] .fp-story *, html[data-fp-intensity="off"] .fp-story--branding .diag, html[data-fp-intensity="off"] .fp-story--ads .path { opacity: 1 !important; transform: none !important; stroke-dashoffset: 0 !important; }
html[data-fp-intensity="off"] .fp-scroll-cue, html[data-fp-intensity="off"] .fp-chapter-progress { display: none; }