@layer components{.kit-visual-steps{min-width:0;max-width:52rem;color:var(--damax-theme-text);grid-template-columns:minmax(0,1fr);justify-items:center;margin-inline:auto;padding:0;list-style:none;display:grid}.kit-visual-step{text-align:center;flex-direction:column;align-items:center;width:100%;min-width:0;padding-block:2.25rem 4.5rem;display:flex;position:relative}.kit-visual-step:not(:last-child):after{content:"";background:linear-gradient(to bottom, var(--damax-theme-link), color-mix(in srgb, var(--damax-theme-link) 20%, transparent));width:1px;height:2.25rem;position:absolute;bottom:0;left:50%}.kit-visual-step:last-child{padding-bottom:0}.kit-visual-step-illustration{aspect-ratio:15/7;width:min(100%,15rem);color:var(--damax-theme-link);place-items:center;margin-bottom:1.25rem;display:grid;position:relative}.kit-visual-step-route{stroke:currentColor;stroke-width:1px;stroke-linecap:round;width:100%;height:100%;position:absolute;inset:0}.kit-visual-step-route-soft{opacity:.2}.kit-visual-step-route-line{stroke-dasharray:2 5;opacity:.7}.kit-visual-step-route-trace{display:none}.kit-visual-step-route-node{fill:var(--damax-theme-bg)}.kit-visual-step-route-mark{opacity:.4}.kit-visual-step-symbol{aspect-ratio:1;background:radial-gradient(circle, color-mix(in srgb, var(--damax-theme-link) 8%, transparent), transparent 72%);border-radius:50%;place-items:center;width:5.5rem;max-width:45%;display:grid;position:relative}.kit-visual-step-symbol>svg{width:68%;height:68%}.kit-visual-step-number{font-size:.75rem;line-height:1.5;font-weight:var(--damax-type-weight-semibold);color:var(--damax-theme-text-muted);position:absolute;bottom:0;left:50%;transform:translate(-50%)}.kit-visual-step-copy{overflow-wrap:anywhere;min-width:0;max-width:100%}.kit-visual-step .kit-visual-step-title{max-width:28ch;font-size:clamp(1.5rem,1.15rem + 1.2vw,2.25rem);line-height:1.25;font-weight:var(--damax-type-weight-medium);text-wrap:balance;margin-inline:auto}.kit-visual-step .kit-visual-step-body{max-width:48ch;color:var(--damax-theme-text-muted);margin:1rem auto 0;font-size:1rem;line-height:1.8}.kit-visual-journey{width:100%;min-width:0;max-width:62rem;padding-inline:1.25rem;position:relative}.kit-visual-journey-rail{top:var(--journey-start,5.75rem);width:1px;height:var(--journey-length,auto);background:color-mix(in srgb, var(--damax-theme-link) 16%, transparent);pointer-events:none;position:absolute;bottom:5.75rem;left:.25rem}.kit-visual-journey-rail:before,.kit-visual-journey-rail:after{content:"";border:1px solid color-mix(in srgb, var(--damax-theme-link) 45%, transparent);background:var(--damax-theme-bg);border-radius:50%;width:5px;height:5px;position:absolute;left:50%;transform:translate(-50%,-50%)}.kit-visual-journey-rail:before{top:0}.kit-visual-journey-rail:after{top:100%}.kit-visual-journey-fill,.kit-visual-journey-point{display:none}.kit-visual-journey .kit-visual-step-symbol:after{content:"";border:1px solid color-mix(in srgb, var(--damax-theme-link) 30%, transparent);opacity:0;border-radius:50%;position:absolute;inset:-.5rem}@media (min-width:48rem){.kit-visual-journey{padding-inline:3rem}.kit-visual-journey-rail{left:1rem}}@media (prefers-reduced-motion:no-preference){.kit-visual-journey[data-journey-ready] .kit-visual-journey-fill{background:var(--damax-theme-link);transform:scaleY(var(--journey-progress,0));transform-origin:top;display:block;position:absolute;inset:0}.kit-visual-journey[data-journey-ready] .kit-visual-journey-point{background:var(--damax-theme-link);width:6px;height:6px;box-shadow:0 0 0 5px color-mix(in srgb, var(--damax-theme-link) 9%, transparent);transform:translateY(var(--journey-point,0px));border-radius:50%;display:block;position:absolute;top:-3px;left:-2.5px}.kit-visual-journey[data-journey-ready] .kit-visual-step-route-trace{stroke-width:1.6px;stroke-dasharray:100;stroke-dashoffset:calc(100 * (1 - var(--journey-step-progress,0)));opacity:.8;display:block}.kit-visual-journey[data-journey-active] .kit-visual-step-symbol:after{transition:opacity var(--damax-motion-duration-slow) var(--damax-motion-ease-standard)}.kit-visual-journey[data-journey-active] [data-journey-current] .kit-visual-step-symbol:after{opacity:1}}@media (prefers-reduced-motion:no-preference) and (hover:hover) and (pointer:fine){.kit-visual-step-symbol{transition:transform var(--damax-motion-duration-slow) var(--damax-motion-ease-standard)}.kit-visual-step:hover .kit-visual-step-symbol{transform:translateY(-3px)}}}