.process-scroll{--process-ink:var(--brand-ink);--process-blue:var(--wall-sky);--process-paper:var(--brand-paper);--process-red:var(--brand-crimson);gap:1.5rem;margin-block-start:2rem;display:grid}.process-visual{align-self:start;min-inline-size:0}.process-scene{block-size:clamp(13rem,48vw,25rem);max-inline-size:32rem;color:var(--process-ink);margin-inline:auto;position:relative}.process-orbit{background:color-mix(in oklab, var(--process-paper) 38%, transparent);border-radius:50%;position:absolute;inset:8% 13%}.process-paper{border:1px solid color-mix(in oklab, var(--process-ink) 20%, transparent);background:var(--process-paper);border-radius:.35rem;position:absolute;inset:9% 25% 8%}.process-paper-back-one{background:color-mix(in oklab, var(--process-blue) 24%, var(--process-paper));transform:rotate(-9deg)translate(-12%,2%)}.process-paper-back-two{transform:rotate(8deg)translate(10%,-1%)}.process-paper-front{box-shadow:0 1.25rem 2.5rem -.75rem color-mix(in oklab, var(--process-ink) 19%, transparent);padding:9%}.process-paper-symbol{color:var(--process-blue);position:absolute;inset-block-start:9%;inset-inline-start:12%}.process-paper-symbol svg{block-size:auto;inline-size:clamp(1.3rem,4vw,2.125rem)}.process-paper-heading{background:var(--process-ink);border-radius:1rem;block-size:3%;inline-size:64%;position:absolute;inset-block-start:31%;inset-inline-start:14%}.process-paper-heading-short{inline-size:43%;inset-block-start:38%}.process-paper-lines{gap:.6rem;display:grid;position:absolute;inset:52% 14% auto}.process-paper-lines i{background:color-mix(in oklab, var(--process-ink) 22%, transparent);block-size:2px;inline-size:100%;display:block}.process-paper-lines i:last-child{inline-size:62%}.process-paper-rule{border-block-end:1px dashed color-mix(in oklab, var(--process-ink) 30%, transparent);position:absolute;inset:auto 14% 12%}.process-cancel-stroke{inline-size:110%;color:var(--process-red);position:absolute;inset:31% -5% auto}.process-cancel-stroke path{stroke-dasharray:1;stroke-dashoffset:0}.process-done{aspect-ratio:1;background:var(--process-red);inline-size:clamp(3.5rem,8vw,5.5rem);color:var(--process-paper);box-shadow:0 0 0 .5rem var(--wall);border-radius:50%;place-items:center;display:grid;position:absolute;inset-block-end:-5%;inset-inline-end:-14%}.process-done svg{block-size:auto;inline-size:58%}.process-gift{aspect-ratio:1;background:var(--process-blue);inline-size:clamp(3rem,6vw,4.5rem);color:var(--process-paper);visibility:hidden;opacity:0;border-radius:50%;place-items:center;display:grid;position:absolute}.process-gift-one{inset-block-start:10%;inset-inline-start:4%}.process-gift-two{inset-block-start:7%;inset-inline-end:6%}.process-gift-three{inset-block-end:9%;inset-inline-start:9%}.process-gift svg{block-size:auto;inline-size:58%}.process-captions{text-align:center;margin-block-start:1rem;display:grid}.process-caption{opacity:0;grid-area:1/1;font-size:clamp(1.25rem,2.5vw,1.875rem);line-height:1.2}.process-scroll[data-process-stage=give] [data-process-caption=give],.process-scroll[data-process-stage=buy] [data-process-caption=buy],.process-scroll[data-process-stage=cancel] [data-process-caption=cancel]{opacity:1}.process-list{margin:0;padding:0;list-style:none}.process-step{border-block-end:1px solid color-mix(in oklab, currentColor 22%, transparent);grid-template-columns:3rem minmax(0,1fr);align-content:center;column-gap:1rem;min-block-size:9rem;padding-block:1.5rem;display:grid}.process-step:first-child{border-block-start:1px solid color-mix(in oklab, currentColor 22%, transparent)}.process-number{aspect-ratio:1;border:1px solid;border-radius:50%;align-self:start;place-items:center;inline-size:3rem;font-size:1.5rem;line-height:1;display:grid}.process-step[aria-current=step] .process-number{background:var(--process-ink);border-color:var(--process-ink);color:var(--process-paper)}@media (min-width:48rem){.process-scroll{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(2rem,5vw,5rem);margin-block-start:3rem}.process-visual{position:sticky;inset-block-start:calc(var(--site-header-clearance,8.5rem) + 1rem)}.process-scene{block-size:clamp(19rem,31vw,25rem)}.process-step{grid-template-columns:3.5rem minmax(0,1fr);column-gap:1.5rem;min-block-size:12rem}.process-number{inline-size:3.5rem;font-size:1.75rem}}@media (prefers-reduced-motion:reduce){.process-visual{position:static}}:root[data-reduce-motion] .process-visual{position:static}@media (scripting:none){.process-visual{position:static}}@media print{.process-visual{position:static}}
