.method{--method-accent:#a8d5b5;background:var(--color-surface-dark);color:var(--color-inverse-text)}.method-intro{margin-bottom:3rem}.method-intro h2{max-width:29ch;font-size:var(--type-section-size);font-weight:var(--font-weight-semibold);letter-spacing:var(--tracking-section);line-height:var(--leading-section)}.method-tabs{grid-template-columns:repeat(5,minmax(0,1fr));gap:1.5rem;display:grid}.method-tab{border:0;border-bottom:2px solid var(--color-inverse-border);min-width:0;min-height:4rem;color:var(--color-inverse-muted);font-size:1rem;font-weight:var(--font-weight-medium);text-align:left;cursor:pointer;transition:color var(--motion-fast), border-color var(--motion-fast);background:0 0;align-items:baseline;gap:.625rem;padding:.75rem 0 1.25rem;line-height:1.5;display:flex}.method-number{font-size:.75rem;font-weight:var(--font-weight-medium);font-variant-numeric:tabular-nums;letter-spacing:.04em;flex-shrink:0}.method-tab:hover{color:var(--color-inverse-text);border-color:var(--color-inverse-muted)}.method-tab[aria-selected=true]{color:var(--color-inverse-text);border-color:var(--method-accent)}.method-tab[aria-selected=true] .method-number,.method-trigger[aria-expanded=true] .method-number{color:var(--method-accent)}.method :is(button,[role=tabpanel]):focus-visible{outline:2px solid var(--method-accent);outline-offset:5px}.method-panels{margin-top:3rem;display:grid}.method-step{visibility:hidden;pointer-events:none;grid-area:1/1;min-width:0}.method-step.is-active{visibility:visible;pointer-events:auto}.method-accordion-heading{display:none}.method-story{visibility:hidden;opacity:0;pointer-events:none;grid-template-columns:minmax(0,.85fr) minmax(0,1.65fr);align-items:start;gap:3rem;height:100%;display:grid}.method-step.is-active .method-story{visibility:visible;opacity:1;pointer-events:auto;transition:opacity var(--motion-medium) var(--ease-standard)}.method-copy{padding-block:1rem}.method-copy :is(h3,h4){font-size:var(--type-feature-size);font-weight:var(--font-weight-semibold);line-height:var(--leading-feature);letter-spacing:var(--tracking-feature);text-wrap:pretty}.method-copy p{color:var(--color-inverse-muted);margin-top:1.25rem;font-size:1rem;line-height:1.65}.method-media{min-width:0;margin:0}.method-image-button{border-radius:var(--radius-sm);width:100%;color:var(--color-inverse-muted);cursor:zoom-in;background:0 0;border:0;flex-direction:column;align-items:flex-end;padding:0;display:flex}.method-image-window{aspect-ratio:1.5;border-radius:var(--radius-sm);background:var(--color-surface-muted);width:100%;display:block;overflow:hidden}.method-image-window img{width:100%;height:auto;display:block}.method-image-action{align-items:center;gap:.5rem;min-height:3rem;padding-top:.5rem;font-size:.8125rem;display:inline-flex}.method-image-action svg{width:1rem;height:1rem}.method-image-button:hover .method-image-action{color:var(--color-inverse-text)}.method-media--control .method-image-window{aspect-ratio:1.65}.method-media--control .method-image-window img{width:120%;max-width:none;transform:translate(-16%,-20%)}.method-media--phone .method-image-button{align-items:center}.method-media--phone .method-image-window{aspect-ratio:auto;background:0 0;place-items:center;height:30rem;display:grid}.method-media--phone img{width:auto;height:100%;max-height:30rem}.method-dialog{border-radius:var(--radius-sm);width:min(96vw,100rem);max-width:none;max-height:94dvh;color:var(--color-inverse-text);background:0 0;border:0;margin:auto;padding:0;overflow:visible}.method-dialog::backdrop{background:#000000d9}.method-dialog__surface{border:1px solid var(--color-inverse-border);border-radius:inherit;background:var(--color-surface-dark);overflow:hidden}.method-dialog__header{align-items:center;gap:.75rem;min-height:4rem;padding:.5rem 1rem;display:flex}.method-dialog__header>span{font-size:1rem;font-weight:var(--font-weight-medium);margin-right:auto}.method-dialog__header button{min-height:3rem;color:inherit;font:inherit;cursor:pointer;background:0 0;border:0;border-radius:.5rem;justify-content:center;align-items:center;gap:.5rem;padding:.5rem .75rem;font-size:.875rem;display:inline-flex}.method-dialog__header button:hover{background:var(--color-inverse-border)}.method-dialog__header svg{flex-shrink:0;width:1.25rem;height:1.25rem}.method-dialog__header .method-dialog__close{flex-shrink:0;width:3rem}.method-dialog :focus-visible{outline-offset:-3px;outline:2px solid #a8d5b5}.method-dialog__viewport{overscroll-behavior:contain;max-height:calc(94dvh - 4rem);overflow:auto}.method-dialog__viewport img{object-fit:contain;width:auto;max-width:100%;height:auto;max-height:calc(94dvh - 4rem);margin-inline:auto;display:block}.method-dialog__viewport.is-zoomed img{max-width:none;max-height:none;margin:0}@media (width>=900px) and (width<=1199px){.method-tabs{gap:1rem}.method-tab{font-size:.9375rem}.method-story{grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:2rem}}@media (width<=899px){.method-intro{margin-bottom:2rem}.method-tabs{display:none}.method-panels{margin-top:0;display:block}.method-step{visibility:visible;pointer-events:auto;border-top:1px solid var(--color-inverse-border)}.method-step:last-child{border-bottom:1px solid var(--color-inverse-border)}.method-accordion-heading{display:block}.method-trigger{width:100%;min-height:4.5rem;color:var(--color-inverse-muted);font-family:inherit;font-size:1rem;font-weight:var(--font-weight-medium);text-align:left;cursor:pointer;background:0 0;border:0;align-items:center;gap:1rem;padding:1.25rem 0;line-height:1.5;display:flex}.method-trigger[aria-expanded=true]{color:var(--color-inverse-text)}.method-trigger>svg{width:1.125rem;height:1.125rem;transition:transform var(--motion-fast);flex-shrink:0;margin-left:auto}.method-trigger[aria-expanded=true]>svg{transform:rotate(180deg)}.method :is(.method-trigger,.method-story):focus-visible{outline-offset:-2px}.method-story{height:auto;display:none}.method-step.is-active .method-story{grid-template-columns:1fr;gap:1.5rem;padding-bottom:1.5rem;display:grid}.method-copy{max-width:38rem;padding:.25rem 0 0}.method-copy p{margin-top:1rem}.method-media{width:100%;max-width:42rem}.method-media--phone .method-image-window{height:27rem}.method-media--phone img{max-height:27rem}}@media (width<=480px){.method-dialog__header{gap:.25rem;padding-inline:.5rem}.method-dialog__header>span{font-size:.875rem}.method-dialog__header button{padding-inline:.5rem;font-size:.75rem}.method-dialog__header button:not(.method-dialog__close) svg{display:none}}