.ex{padding:var(--section-pad, clamp(56px, 8vw, 112px)) 0;background:var(--kb-bg);color:var(--kb-fg);scroll-margin-top:var(--header-h, 80px);border-top:1px solid var(--color-border, rgb(var(--kb-fg-rgb) / .12))}.ex__inner{max-width:var(--page-width, 1400px);margin:0 auto;padding:0 var(--page-margin, 20px)}.ex__head{margin-bottom:clamp(24px,4vw,48px)}.ex__heading{margin:0;font-family:var(--font-heading--family);font-weight:800;font-size:var(--text-3xl, clamp(36px, 5vw, 60px));line-height:.95;letter-spacing:-.01em;text-transform:uppercase}.ex__lead{margin:14px 0 0;max-width:54ch;color:var(--color-muted, rgb(var(--kb-fg-rgb) / .64));font-size:var(--text-md, 18px);line-height:1.6}.ex__layout{display:grid;gap:28px;grid-template-columns:1fr;align-items:start}.ex__stage-wrap{display:grid;gap:14px;justify-items:center}.ex__editor-note{margin:0;padding:12px var(--page-margin, 20px);color:var(--color-subtle);font-size:12px;text-align:center}.ex__foot{margin:clamp(20px,3vw,36px) 0 0;color:var(--color-subtle, rgb(var(--kb-fg-rgb) / .52));font-size:13px;letter-spacing:.04em}.ex__stage{position:relative;container-type:inline-size;width:100%;max-width:640px;aspect-ratio:var(--ex-ar, 2 / 3);overflow:clip}.ex__world{position:absolute;top:0;right:0;bottom:0;left:0;transform-origin:0 0;animation:ex-camera var(--ex-dur, 11s) cubic-bezier(.6,0,.3,1) infinite;will-change:transform}.ex__guides{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:1;overflow:visible}.ex__guide{stroke:rgb(var(--kb-fg-rgb) / .35);stroke-width:1.5;stroke-dasharray:3 9;vector-effect:non-scaling-stroke;animation:ex-fade var(--ex-dur, 11s) infinite;animation-delay:var(--ex-guide-delay, 0s)}.ex__part{position:absolute;display:block;height:auto;animation:ex-assemble var(--ex-dur, 11s) cubic-bezier(.65,0,.35,1) infinite;animation-delay:var(--delay, 0s);will-change:translate}.ex__part--shell{animation:none}html[data-theme=light] .ex__part{filter:invert(1)}.ex__badge{position:absolute;z-index:5;translate:-40% -40%;display:grid;place-items:center;width:clamp(20px,3.1cqw,30px);height:clamp(20px,3.1cqw,30px);border-radius:50%;background:var(--color-accent, #d62828);border:2px solid #ffffff;color:#fff;font-family:var(--font-heading--family);font-weight:800;font-size:clamp(10px,1.55cqw,15px);line-height:1;animation:ex-fade var(--ex-dur, 11s) infinite}@keyframes ex-assemble{0%,10%{translate:0 0;rotate:0deg;scale:1;opacity:1}34%{opacity:1}38%,62%{translate:calc(var(--dx, 0) * 1cqw) calc(var(--dy, 0) * 1cqw);rotate:var(--rot, 0deg);scale:var(--sc, 1);opacity:var(--ex-in, 0)}66%{opacity:1}90%,to{translate:0 0;rotate:0deg;scale:1;opacity:1}}@keyframes ex-camera{0%,16%{translate:0 0;scale:1}44%,60%{translate:calc(var(--cam-x, -81.2) * 1cqw) calc(var(--cam-y, 16.6) * 1cqw);scale:var(--cam-s, 2)}86%,to{translate:0 0;scale:1}}@keyframes ex-fade{0%,12%{opacity:1}24%,78%{opacity:0}90%,to{opacity:1}}.ex.is-paused :is(.ex__world,.ex__part,.ex__badge,.ex__guide),.ex.is-offscreen :is(.ex__world,.ex__part,.ex__badge,.ex__guide){animation-play-state:paused}.ex--focus :is(.ex__world,.ex__part,.ex__badge,.ex__guide){animation:none}.ex--focus .ex__world{translate:0 0;scale:1}.ex--focus .ex__part{translate:0 0;rotate:0deg;scale:1;opacity:.2}.ex--focus .ex__part--shell{opacity:.4}.ex--focus .ex__part.is-on{opacity:1}.ex--focus .ex__badge,.ex--focus .ex__guide{opacity:0}.ex--focus .ex__badge.is-on{opacity:1}.ex--focus .ex__guide.is-on{opacity:1;stroke:var(--color-accent, #d62828)}.ex[data-state=assembled] .ex__world{animation:none;translate:calc(var(--cam-x, -81.2) * 1cqw) calc(var(--cam-y, 16.6) * 1cqw);scale:var(--cam-s, 2)}.ex[data-state=assembled] .ex__part:not(.ex__part--shell){animation:none;translate:calc(var(--dx, 0) * 1cqw) calc(var(--dy, 0) * 1cqw);rotate:var(--rot, 0deg);scale:var(--sc, 1);opacity:var(--ex-in, 0)}.ex__toggle{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 18px;border:2px solid var(--color-border-strong, rgb(var(--kb-fg-rgb) / .24));border-radius:var(--radius, 5px);background:transparent;color:var(--kb-fg);font-family:var(--font-heading--family);font-weight:700;font-size:14px;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}.ex__toggle:hover{border-color:var(--kb-fg)}.ex__toggle:focus-visible{outline:2px solid var(--color-accent, #d62828);outline-offset:3px}.ex__toggle-icon{width:10px;height:14px;border-left:3px solid currentColor;border-right:3px solid currentColor;box-sizing:border-box}.ex__toggle[aria-pressed=true] .ex__toggle-icon{width:0;height:0;border-left:12px solid currentColor;border-right:0;border-top:7px solid transparent;border-bottom:7px solid transparent}.ex__list{display:grid;gap:0;margin:0;padding:0;list-style:none}.ex__item{display:grid;grid-template-columns:40px 1fr;column-gap:10px;align-items:baseline;padding:14px 8px 14px 4px;border-top:1px solid var(--color-border, rgb(var(--kb-fg-rgb) / .12));border-radius:2px;transition:background-color .2s var(--ease, ease)}.ex__item:hover,.ex__item:focus-visible{background:rgb(var(--kb-fg-rgb) / .05);outline:none}.ex__item:focus-visible{outline:2px solid var(--color-accent, #d62828);outline-offset:-2px}.ex__num{color:var(--color-accent, #d62828);font-family:var(--font-heading--family);font-weight:800;font-size:20px;line-height:1}.ex__title{margin:0;font-family:var(--font-heading--family);font-weight:800;font-size:20px;line-height:1.05;text-transform:uppercase}.ex__text{grid-column:2;margin:6px 0 0;color:var(--color-muted, rgb(var(--kb-fg-rgb) / .64));font-size:15px;line-height:1.5}.ex__note{margin-top:16px;padding:16px 18px;border:1px solid var(--color-border-strong, rgb(var(--kb-fg-rgb) / .24));border-left:3px solid var(--color-accent, #d62828);border-radius:var(--radius, 5px)}.ex__note-title{margin:0 0 8px;font-family:var(--font-heading--family);font-weight:800;font-size:15px;letter-spacing:.06em;text-transform:uppercase}.ex__note-list{display:grid;gap:6px;margin:0;padding:0;list-style:none}.ex__note-list li{position:relative;padding-left:16px;color:var(--color-muted, rgb(var(--kb-fg-rgb) / .64));font-size:14px;line-height:1.5}.ex__note-list li:before{content:"";position:absolute;left:0;top:.6em;width:6px;height:6px;background:var(--color-accent, #d62828)}@media(min-width:990px){.ex__layout{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:56px}.ex__stage-wrap{position:sticky;top:calc(var(--header-h, 80px) + 16px)}}@media(prefers-reduced-motion:reduce){.ex__world,.ex__part,.ex__badge,.ex__guide{animation:none}.ex__toggle{display:none}}
/*# sourceMappingURL=/cdn/shop/t/16/assets/section-exploded-helmet.css.map */