/* The image trail is clipped to the hero, never captures input, and keeps image ratios. */
.cover-hero { position:relative; isolation:isolate; }
.hero-motion-layer { position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:2; contain:layout paint; }
.hero-motion-image { position:absolute; top:0; left:0; display:block; max-width:none; object-fit:contain; border-radius:8px; pointer-events:none; user-select:none; will-change:transform,opacity; transform-origin:center; }
.hero-motion-image.is-cutout { border-radius:0; background:transparent; filter:drop-shadow(0 10px 14px #0005); }
.hero-motion-trigger { position:absolute; bottom:24px; left:var(--gutter,24px); z-index:3; display:inline-flex; align-items:center; gap:18px; min-height:44px; padding:11px 18px; border:1px solid var(--color-border,#303030); border-radius:var(--radius-pill,999px); background:var(--color-bg,#0a0a0a); color:var(--color-muted,#a3a3a3); font-family:var(--font-sans,sans-serif); font-size:12px; line-height:1.3; cursor:pointer; transition:color var(--motion-fast,200ms),border-color var(--motion-fast,200ms); }
.hero-motion-trigger:hover { color:var(--color-text,#fff); border-color:var(--color-accent,#c9fe6e); }
.hero-motion-trigger:focus-visible { outline:2px solid var(--color-accent,#c9fe6e); outline-offset:4px; }
.hero-motion-trigger:disabled { cursor:default; }
.hero-motion-trigger>span:last-child { color:var(--color-accent,#c9fe6e); }
.motion-touch-hint { display:none; }
@media (pointer:coarse) { .motion-touch-hint { display:inline; }.motion-desktop-hint { display:none; } }
@media (max-width:767px) { .hero-motion-trigger { bottom:20px; padding:11px 14px; }.hero-motion-image { border-radius:6px; } }
@media (prefers-reduced-motion:reduce) { .hero-motion-layer,.hero-motion-trigger { display:none; } }