article step-item{display:block;scroll-margin-top:80px;margin-top:3rem;margin-bottom:5rem}article step-item:last-child{margin-bottom:3rem}@media(max-width:1435px){article step-item{scroll-margin-top:110px}}article step-item .step-figure{--fig-width: min(130%, calc(100vw - 30px) );--fig-margin-left: max( -20%, calc((100% - 100vw + 30px)/2) );--fig-margin-right: 0px;--fig-float: none;--fig-clear: both}@media(min-width:1649px){article step-item .step-figure{--fig-width: 100%;--fig-margin-left: 0;--fig-margin-right: 0;--fig-clear: none}}article step-item .step-figure{margin-top:0;margin-bottom:20px}article step-item .step-figure img{width:100%;height:auto;border-radius:6px;border:1px solid var(--border)}article step-item .step-figure figcaption{padding:5px 10px 0;font-family:var(--font-roboto-mono);font-size:.8em;color:var(--text-mid)}@media(max-width:991px){article step-item .step-figure figcaption{text-align:center}}@media(min-width:480px)and (max-width:767px){article step-item .step-figure{--fig-width: 100%;--fig-margin-left: 0px;--fig-margin-right: 0px}}@media(min-width:768px)and (max-width:991px){article step-item .step-figure{--fig-width: 100%;--fig-margin-left: 0px;--fig-margin-right: 0px}}article step-item .step-text>:first-child{margin-top:0}article step-item .step-text>:last-child{margin-bottom:0}@media(min-width:480px){article step-item .step-text figure{--fig-width: 100%;--fig-margin-left: 0;--fig-margin-right: 0}}article step-item .step-eyebrow{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:.85rem;margin-bottom:1.25rem;padding-bottom:.85rem;border-bottom:1px solid var(--border);transition:border-color .5s ease}article step-item .step-eyebrow .step-number{font-family:var(--font-space-grotesk);font-size:2.25rem;font-weight:700;line-height:.9;letter-spacing:-.02em;color:var(--text-faint);font-variant-numeric:tabular-nums;transition:color .5s ease,transform .5s cubic-bezier(.22,1,.36,1)}@media(min-width:1649px){article step-item .step-eyebrow .step-number{font-size:2.75rem}}article step-item .step-eyebrow .step-eyebrow-rule{height:1px;background:linear-gradient(to right,var(--border-strong),transparent);max-width:5rem;transition:background .5s ease}article step-item .step-eyebrow .step-eyebrow-label{font-family:var(--font-space-grotesk);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--text-mid);font-weight:600;transition:color .5s ease}article step-item .step-eyebrow .step-eyebrow-dot{width:6px;height:6px;border-radius:50%;background:var(--border-strong);transition:background .5s ease,box-shadow .5s ease,transform .5s ease}@media(max-width:767px){article step-item .step-eyebrow{grid-template-columns:auto auto 1fr auto}article step-item .step-eyebrow .step-eyebrow-rule{display:none}}article step-item[data-step-active] .step-eyebrow{border-bottom-color:var(--accent-border)}article step-item[data-step-active] .step-eyebrow .step-number{color:var(--accent)}article step-item[data-step-active] .step-eyebrow .step-eyebrow-rule{background:linear-gradient(to right,var(--accent),var(--accent-border),transparent)}article step-item[data-step-active] .step-eyebrow .step-eyebrow-label{color:var(--accent)}article step-item[data-step-active] .step-eyebrow .step-eyebrow-dot{background:var(--accent);animation:step-dot-pulse 2.4s ease-in-out infinite}@keyframes step-dot-pulse{0%,to{box-shadow:0 0 0 0 var(--accent-glow)}50%{box-shadow:0 0 0 6px var(--accent-glow)}}@media(prefers-reduced-motion:reduce){article step-item .step-eyebrow,article step-item .step-eyebrow *{transition:none!important;animation:none!important}}@media(max-width:479px){article step-item .step-figure{--fig-width: calc(100% + 30px) ;--fig-margin-left: -15px;--fig-margin-right: -15px}article step-item .step-figure img{border-radius:0;border-left:0;border-right:0}}@media(min-width:1649px){article step-item{margin-bottom:6rem;--step-right-bleed: 10%;--step-left-pad: 6px;--step-width: min( calc( (100vw + 100% - 30px) / 2 + var(--step-right-bleed) - var(--step-left-pad) ), 1550px );position:relative;width:var(--step-width);margin-left:calc(100% + var(--step-right-bleed) - var(--step-width) + var(--step-left-pad));margin-right:calc(-1 * var(--step-right-bleed));display:grid;gap:0 20px;align-items:start;grid-template-rows:auto 1fr;grid-template-columns:minmax(0,1140px) minmax(0,380px);grid-template-areas:"figure eyebrow" "figure text"}article step-item[data-text-position=left]{grid-template-columns:minmax(0,520px) minmax(0,1000px);grid-template-areas:"eyebrow figure" "text figure"}article step-item .step-eyebrow{grid-area:eyebrow}article step-item .step-text{grid-area:text}article step-item .step-figure{grid-area:figure;position:sticky;top:80px;align-self:start;margin-bottom:0}article step-item .step-figure img{max-height:80vh;object-fit:contain;cursor:pointer}article step-item[data-compare] .step-figure img{cursor:default}}article step-item step-compare{display:block;position:relative;overflow:hidden;border-radius:6px;border:1px solid var(--border);user-select:none;touch-action:pan-y}article step-item step-compare.comparing{touch-action:none;cursor:ew-resize}article step-item step-compare img{border:none!important;border-radius:0!important;display:block}article step-item step-compare .compare-after{position:relative}article step-item step-compare .compare-before{position:absolute;inset:0;z-index:1;clip-path:inset(0 calc(100% - var(--compare-pos)) 0 0)}article step-item step-compare .compare-divider{position:absolute;top:0;bottom:0;left:var(--compare-pos);z-index:2;width:0;cursor:ew-resize}article step-item step-compare .compare-divider:before{content:"";position:absolute;top:0;bottom:0;left:-16px;width:32px}article step-item step-compare .compare-divider:after{content:"";position:absolute;top:0;bottom:0;left:-1px;width:2px;background:#fff;box-shadow:0 0 4px #00000080}article step-item step-compare .compare-handle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:0;background:#fff;color:#333;border-radius:50%;width:36px;height:36px;justify-content:center;box-shadow:0 1px 4px #0000004d;z-index:3}article step-item step-compare .compare-handle svg{width:14px;height:14px;flex-shrink:0}article step-item step-compare .compare-label{position:absolute;top:8px;z-index:1;font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.05em;padding:2px 8px;border-radius:4px;background:#00000080;color:#fff;opacity:.7;pointer-events:none}article step-item step-compare .compare-label-before{left:8px}article step-item step-compare .compare-label-after{right:8px}@media(max-width:479px){article step-item step-compare{border-radius:0;border-left:0;border-right:0}}