.demo.svelte-ocup6o{--clip-h: min(78svh, 760px);display:grid;grid-template-columns:calc(var(--clip-h) * var(--ratio)) minmax(0,1fr);grid-template-areas:"clip words" "clip steps";grid-template-rows:auto 1fr;column-gap:clamp(40px,6vw,96px);row-gap:44px;align-content:center;max-width:1200px;margin:0 auto;padding:var(--section-gap) 32px 0;color:var(--nav-text, #1a1a2e)}.clip-right.svelte-ocup6o{grid-template-columns:minmax(0,1fr) calc(var(--clip-h) * var(--ratio));grid-template-areas:"words clip" "steps clip"}.last.svelte-ocup6o{padding-bottom:var(--section-gap)}header.svelte-ocup6o{grid-area:words;align-self:end}h2.svelte-ocup6o{margin:0;font-family:var(--font-display, "BN Rumble");font-size:clamp(2.6rem,5vw,4.6rem);font-weight:400;line-height:.92;text-transform:uppercase;text-wrap:balance}.line.svelte-ocup6o{max-width:30ch;margin:18px 0 0;font-size:clamp(1.1rem,1.4vw,1.3rem);font-weight:600;line-height:1.45;opacity:.8}.clip.svelte-ocup6o{grid-area:clip;width:calc(var(--clip-h) * var(--ratio));max-width:100%;aspect-ratio:var(--ratio);border:1.5px solid var(--nav-border, #1a1a2e);border-radius:22px;overflow:hidden;background:#111}video.svelte-ocup6o{display:block;width:100%;height:100%;object-fit:cover}.steps.svelte-ocup6o{grid-area:steps;display:flex;flex-direction:column;gap:26px;margin:0;padding:0;list-style:none}li.svelte-ocup6o{display:flex;flex-direction:column;gap:4px;padding-left:18px;border-left:4px solid color-mix(in srgb,var(--accent),transparent 80%);transition:opacity .3s ease,border-color .3s ease}.synced.svelte-ocup6o li:where(.svelte-ocup6o){opacity:.38}.synced.svelte-ocup6o li.on:where(.svelte-ocup6o){opacity:1;border-color:var(--accent)}.label.svelte-ocup6o{font-size:1.25rem;font-weight:800}.text.svelte-ocup6o{max-width:32ch;font-size:1.05rem;font-weight:600;line-height:1.45;opacity:.75}@media(max-width:899px){.demo.svelte-ocup6o{padding-inline:20px}.demo.svelte-ocup6o,.clip-right.svelte-ocup6o{grid-template-columns:minmax(0,1fr);grid-template-areas:"words" "clip" "steps";grid-template-rows:none;row-gap:28px}.clip.svelte-ocup6o{width:min(100%,calc(80svh * var(--ratio)));justify-self:center;border-radius:18px}h2.svelte-ocup6o{font-size:clamp(2.3rem,10vw,3.4rem)}.steps.svelte-ocup6o{gap:18px}}@media(prefers-reduced-motion:reduce){li.svelte-ocup6o{transition:none}}
