.footer-utilities .section{padding-bottom:var(--demo-orienter-height, 70px)}html{scroll-padding-bottom:calc(var(--demo-orienter-height, 70px) + 16px)}.demo-orienter{display:none;container-type:inline-size;position:fixed;left:0;right:var(--demo-orienter-inset, 0px);bottom:0;z-index:var(--layer-heightened, 4);background:var(--stm-surface-raised);border-top:1px solid var(--stm-border);box-shadow:0 -4px 16px #0000000f;font-family:var(--stm-font-body);color:var(--stm-navy);transition:right .24s ease}.demo-orienter.is-active{display:block}.demo-orienter__bar{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,auto) minmax(0,1fr);align-items:center;gap:var(--stm-space-lg);min-height:70px}.demo-orienter__back{justify-self:start;min-width:0;display:inline-flex;align-items:center;gap:var(--stm-space-sm);font-size:var(--stm-text-sm);font-weight:500;color:var(--stm-navy);text-decoration:none;white-space:nowrap}.demo-orienter__back:hover{color:var(--stm-purple)}.demo-orienter__back-icon{flex:none;display:block}.demo-orienter__back-label{max-width:22cqw;overflow:hidden;text-overflow:ellipsis}.demo-orienter__center{justify-self:center;display:flex;align-items:center;gap:var(--stm-space-lg);min-width:0}.demo-orienter__divider{width:1px;height:28px;flex:none;background:var(--stm-border)}.demo-orienter__arrow{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;flex:none;border:0;border-radius:var(--stm-radius-sm);background:none;color:var(--stm-navy);text-decoration:none;cursor:pointer}.demo-orienter__arrow:hover{color:var(--stm-purple);background:var(--stm-purple-tint)}.demo-orienter__arrow.is-disabled{opacity:.25;cursor:default;pointer-events:none}.demo-orienter__arrow--explore{color:var(--stm-purple)}.demo-orienter__arrow--explore:hover{background:var(--stm-purple);color:#fff}.demo-orienter__step{position:relative;min-width:0}.demo-orienter__step-trigger{display:inline-flex;align-items:center;gap:2px;min-width:0;max-width:100%;padding:4px 4px 4px 8px;border:0;border-radius:var(--stm-radius-sm);background:none;color:var(--stm-navy);font-family:inherit;cursor:pointer}.demo-orienter__step-trigger:hover{color:var(--stm-purple);background:var(--stm-purple-tint)}.demo-orienter__headline{font-size:var(--stm-text-lead);font-weight:600;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:44cqw}.demo-orienter__caret{flex:none;transition:transform var(--hover-transition-duration, .12s) ease}.demo-orienter.has-menu-open .demo-orienter__caret{transform:rotate(180deg)}.demo-orienter__menu{position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%);min-width:263px;max-width:min(340px,86vw);padding:4px 0;background:var(--stm-surface-raised);border:1px solid var(--stm-border);border-radius:var(--stm-radius-md);box-shadow:var(--stm-shadow-md);text-align:left}.demo-orienter__menu[hidden]{display:none}.demo-orienter__menu-title{margin:0;padding:12px 16px;font-size:var(--stm-text-sm);font-weight:600;color:var(--stm-navy)}.demo-orienter__menu-item{display:block;padding:12px 16px;font-size:var(--stm-text-sm);line-height:1.3;color:var(--stm-navy);text-decoration:none}a.demo-orienter__menu-item:hover{color:var(--stm-purple);background:var(--stm-purple-tint)}.demo-orienter__menu-item.is-current{font-weight:600;color:var(--stm-purple);background:var(--stm-purple-tint)}.demo-orienter__toggle{justify-self:end;width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:var(--stm-radius-sm);background:none;color:var(--stm-navy);cursor:pointer}.demo-orienter__toggle:hover{color:var(--stm-purple);background:var(--stm-purple-tint)}.demo-orienter__toggle-stem{transform-box:fill-box;transform-origin:center;transition:transform .14s ease,opacity .14s ease}.demo-orienter.is-open .demo-orienter__toggle-stem{transform:scaleY(0);opacity:0}.demo-orienter__toggle:focus-visible,.demo-orienter__arrow:focus-visible,.demo-orienter__back:focus-visible,.demo-orienter__step-trigger:focus-visible,.demo-orienter__menu-item:focus-visible{outline:2px solid var(--stm-purple);outline-offset:2px}.demo-orienter__body{display:none;padding-bottom:var(--stm-space-lg)}.demo-orienter.is-open .demo-orienter__body{display:block}.demo-orienter__text{max-width:750px;margin:0 auto;text-align:left}.demo-orienter__text p{margin:0;font-size:var(--stm-text-body);line-height:1.5;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.demo-orienter__text a{color:var(--stm-purple);font-weight:600}.demo-orienter__links{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:var(--stm-space-xs) var(--stm-space-md);margin-top:var(--stm-space-md)}.demo-orienter__links:empty{display:none}.demo-orienter__docs{font-size:var(--stm-text-body);font-weight:600;color:var(--stm-purple);text-decoration:none;white-space:nowrap}.demo-orienter__docs:hover{text-decoration:underline}.demo-orienter__meta-label{font-size:var(--stm-text-2xs);font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--stm-navy);opacity:.55}.demo-orienter__chip{display:inline-flex;align-items:center;gap:5px;font-size:var(--stm-text-xs);font-weight:600;color:var(--stm-purple);background:var(--stm-purple-tint);border-radius:var(--stm-radius-pill);padding:3px 11px;text-decoration:none}@container (max-width: 900px){.demo-orienter__center{gap:var(--stm-space-sm)}.demo-orienter__divider{display:none}.demo-orienter__headline{font-size:var(--stm-text-body)}}@media screen and (max-width:749px){.demo-orienter__bar{grid-template-columns:auto minmax(0,1fr) auto;gap:var(--stm-space-sm);min-height:56px}.demo-orienter__back-label{display:none}.demo-orienter__center{gap:var(--stm-space-sm)}.demo-orienter__divider{display:none}.demo-orienter__headline{font-size:var(--stm-text-body);max-width:44vw}.demo-orienter__menu{min-width:0;width:max-content}.demo-orienter__text p{font-size:var(--stm-text-sm);-webkit-line-clamp:4}}@media(prefers-reduced-motion:reduce){.demo-orienter,.demo-orienter__caret,.demo-orienter__toggle-stem{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/6/assets/demo-orienter.css.map */