.install .ins-steps{margin:clamp(.5rem,2vw,1.5rem) auto 0;padding:0;list-style:none;position:relative}.install .ins-steps:before{content:"";background:repeating-linear-gradient(var(--line) 0 8px, transparent 8px 16px);width:2px;position:absolute;top:0;bottom:0;left:50%;transform:translate(-50%)}.install .ins-step{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:clamp(2rem,6vw,5rem);padding-block:clamp(1.4rem,3vw,2.4rem);display:grid;position:relative}.install .ins-step:before{content:"";background:var(--accent-fill);width:14px;height:14px;box-shadow:0 0 0 7px var(--bg);z-index:1;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.install .ins-step:nth-child(2n) .ins-art{order:-1}.install .ins-num{font-family:var(--font-bricolage), "Helvetica Neue", sans-serif;color:#0000;-webkit-text-stroke:1.5px var(--accent);letter-spacing:-.04em;font-size:clamp(2.4rem,4.5vw,3.6rem);font-weight:700;line-height:.9;display:block}.install .ins-art{background:var(--surface);border:1px solid var(--line);aspect-ratio:16/10;box-sizing:border-box;width:100%;max-width:440px;box-shadow:0 30px 60px -34px var(--shadow);z-index:1;border-radius:16px;justify-self:center;place-items:center;padding:clamp(.75rem,2vw,1.5rem);display:grid;position:relative}.install .ins-wide{grid-template-columns:1fr;gap:clamp(1rem,2.5vw,1.8rem)}.install .ins-wide:before{top:clamp(1.4rem,3vw,2.4rem)}.install .ins-wide .ins-copy{text-align:center;background:var(--bg);z-index:1;justify-self:center;max-width:38rem;padding:.8rem 1rem 0;position:relative}.install .ins-prints{z-index:1;background:var(--bg);grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(.9rem,1.8vw,1.6rem);margin:0;padding:.5rem 0 1rem;list-style:none;display:grid;position:relative}.install .ins-print{background:var(--paper);box-shadow:0 24px 40px -22px var(--shadow), 0 2px 6px #0000004d;margin:0;padding:10px 10px 0;transition:transform .45s cubic-bezier(.2,.75,.2,1)}.install .ins-prints li:nth-child(odd) .ins-print{transform:rotate(-1.4deg)}.install .ins-prints li:nth-child(2n) .ins-print{transform:rotate(1.1deg)translateY(12px)}.install .ins-prints li .ins-print:hover{transform:translateY(-6px)rotate(0)}.install .ins-ill{width:100%;max-width:300px;height:auto;overflow:visible}.install .ins-ill .s{fill:none;stroke:var(--fg);stroke-width:3px;stroke-linecap:round;stroke-linejoin:round}.install .ins-ill .m{fill:none;stroke:var(--muted);stroke-width:2.2px;stroke-linecap:round;stroke-linejoin:round}.install .ins-ill .r{fill:none;stroke:var(--accent-fill);stroke-width:3.5px;stroke-linecap:round;stroke-linejoin:round}.install .ins-ill .f{fill:var(--accent-fill)}.install .ins-ill .t2{fill:var(--surface-2)}.install .ins-ill .dot{fill:var(--muted)}.install .ins-ill .cur{fill:var(--fg);stroke:var(--surface);stroke-width:1.5px;stroke-linejoin:round}.install .ins-ill .lbl{fill:var(--muted);font:500 13px var(--font-hanken), sans-serif}.install .ins-ill .lcd-k{fill:var(--muted);font:500 11px var(--font-hanken), sans-serif;letter-spacing:.06em;text-transform:uppercase}.install .ins-ill .lcd-v{fill:var(--fg);font:600 15px var(--font-hanken), sans-serif}.install .ins-ill .lcd-s{fill:var(--on-accent);font:700 14px var(--font-hanken), sans-serif}.install .ins-ill .flash{fill:#fff;opacity:0}@keyframes ins-drop{0%{opacity:0;transform:translateY(-16px)}25%{opacity:1}60%{opacity:1;transform:translateY(6px)}to{opacity:0;transform:translateY(6px)}}.install .a-drop{animation:2.4s ease-in infinite ins-drop}@keyframes ins-bar{0%{transform:scaleX(0)}70%,to{transform:scaleX(1)}}.install .a-bar{transform-box:fill-box;transform-origin:0;animation:2.4s ease-in-out infinite ins-bar}@keyframes ins-flow{to{stroke-dashoffset:-44px}}.install .a-flow{stroke-dasharray:10 12;animation:1.1s linear infinite ins-flow}@keyframes ins-pop{0%,35%{opacity:0;transform:scale(0)}50%{opacity:1;transform:scale(1.15)}60%,88%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1)}}.install .a-pop{transform-box:fill-box;transform-origin:50%;animation:3.2s ease-out infinite ins-pop}@keyframes ins-cursor{0%,12%{transform:translate(46px,40px)}42%,72%{transform:translate(0)}to{transform:translate(46px,40px)}}.install .a-cursor{animation:3.2s ease-in-out infinite ins-cursor}@keyframes ins-ripple{0%,42%{opacity:0;transform:scale(.2)}48%{opacity:.9}75%,to{opacity:0;transform:scale(1.7)}}.install .a-ripple{transform-box:fill-box;transform-origin:50%;animation:3.2s ease-out infinite ins-ripple}@keyframes ins-flash{0%,84%,to{opacity:0}88%{opacity:.8}}.install .a-flash{animation:3.6s ease-out infinite ins-flash}@keyframes ins-sel{0%,20%{transform:translateY(-28px)}40%,to{transform:translateY(0)}}.install .a-sel{animation:3.6s cubic-bezier(.2,.75,.2,1) infinite ins-sel}@supports (animation-timeline:view()){.install .reveal{animation:linear both ins-rise;animation-timeline:view();animation-range:entry 5% cover 28%}@keyframes ins-rise{0%{opacity:0;transform:translateY(48px)}to{opacity:1;transform:none}}}@media (prefers-reduced-motion:reduce){.install *,.install :before,.install :after{transition:none!important;animation:none!important}}@media (max-width:860px){.install .ins-steps:before{left:12px}.install .ins-step{grid-template-columns:1fr;gap:1.2rem;padding-left:44px}.install .ins-step:before{top:2.6rem;left:12px}.install .ins-step:nth-child(2n) .ins-art{order:0}.install .ins-wide .ins-copy{text-align:left;justify-self:start;padding:0}.install .ins-wide:before{top:2.6rem}.install .ins-art{justify-self:start}.install .ins-prints{scroll-snap-type:x mandatory;grid-template-columns:repeat(5,minmax(210px,1fr));padding-inline:4px;overflow-x:auto}.install .ins-prints li{scroll-snap-align:start}}.install .ins-ill .chk{fill:none;stroke:var(--on-accent);stroke-width:3.5px;stroke-linecap:round;stroke-linejoin:round}
