.yarn-hero.yarn-hero--connected{position:relative;overflow:hidden;background:var(--yarn-bg-surface);color:var(--yarn-text-heading)}.yarn-hero--connected ::selection{background:var(--yarn-tint-butter);color:var(--yarn-text-heading)}.yarn-hero.yarn-hero--connected :is(.yarn-hero__heading,.yarn-hero__text){animation:none}.yarn-hero--connected :is(a,button):focus-visible{outline:var(--yarn-focus-width) solid var(--yarn-focus);outline-offset:var(--yarn-focus-offset)}.yarn-hero--connected .yarn-hero__visual{position:relative;width:min(var(--yarn-commerce-max),calc(100% - 64px));aspect-ratio:2.3;margin:20px auto 0;isolation:isolate;container-type:inline-size}.yarn-hero--connected .yarn-hero__copy{position:absolute;z-index:3;left:0;top:23%;width:39%}.yarn-hero--connected .yarn-hero__heading{margin:0;color:var(--yarn-text-heading);font-family:var(--yarn-display);font-size:clamp(32px,4.6cqw,56px);font-weight:600;line-height:1.2;letter-spacing:-.02em;text-wrap:balance}.yarn-hero--connected .yarn-hero__text{margin-top:16px;color:var(--yarn-text-muted);font-size:clamp(16px,2cqw,24px);line-height:1.6}.yarn-hero--connected .yarn-hero__text p{margin:0}.yarn-hero--connected .yarn-hero__cta{display:inline-flex;align-items:center;gap:16px;min-height:48px;margin-top:24px;padding:12px 24px;border:0;border-radius:var(--yarn-radius-pill);background:var(--yarn-accent);color:var(--yarn-text-on-action);font-size:17px;font-weight:600}.yarn-hero--connected .yarn-hero__cta svg{width:18px;height:18px}.yarn-hero--connected .yarn-hero__cta:before,.yarn-hero--connected .yarn-hero__cta:after{display:none}.yarn-hero--connected .yarn-hero__cta:hover{background:var(--yarn-action-strong)}.yarn-hero--connected .yarn-hero__journey{position:absolute;top:0;right:0;bottom:0;left:0;margin:0;padding:0;list-style:none}.yarn-hero--connected .yarn-hero__thread{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none;fill:none;stroke:var(--yarn-decor-thread);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;overflow:visible}.yarn-hero--connected .yarn-hero__thread--mobile{display:none}.yarn-hero--connected .yarn-hero__node{position:absolute;z-index:1;text-align:center}.yarn-hero--connected .yarn-hero__node>a{display:block;color:inherit;text-decoration:none}.yarn-hero--connected .yarn-hero__node-art{position:relative;display:grid;width:100%;aspect-ratio:1;place-items:center;border:1px solid var(--yarn-decor-art-line);border-radius:50%;background:var(--yarn-bg-surface);box-shadow:0 0 0 4px var(--yarn-decor-halo)}.yarn-hero--connected .yarn-hero__node-art img{display:block;width:90%;height:90%;object-fit:contain}.yarn-hero--connected .yarn-hero__node--project{left:40%;top:21%;width:32%}.yarn-hero--connected .yarn-hero__node--yarn{right:4%;top:0;width:19%}.yarn-hero--connected .yarn-hero__node--tools{right:0;top:50%;width:21%}.yarn-hero--connected .yarn-hero__node--project .yarn-hero__node-art img{width:94%;height:94%}.yarn-hero--connected .yarn-hero__node strong{position:relative;z-index:2;display:table;max-width:120%;min-height:36px;margin:-16px auto 0;padding:6px 16px;border:1px solid var(--yarn-cta-border);border-radius:var(--yarn-radius-pill);background:var(--yarn-action-subtle-bg);color:var(--yarn-text-heading);font-family:var(--yarn-display);font-size:clamp(14px,1.65cqw,20px);font-weight:600;line-height:1.4}.yarn-hero--connected .yarn-hero__node strong svg{display:inline-block;width:14px;height:14px;margin-left:6px;vertical-align:middle;color:var(--yarn-accent)}.yarn-hero--connected .yarn-hero__node>a:hover strong{text-decoration:underline;text-underline-offset:4px}.yarn-hero--connected .yarn-hero__wave{display:block;width:100%;height:56px;margin-top:-6px;pointer-events:none;fill:var(--yarn-tint-butter)}@media(max-width:749px){.yarn-hero--connected .yarn-hero__visual{width:calc(100% - 32px);height:360px;aspect-ratio:auto;margin-top:16px}.yarn-hero--connected .yarn-hero__copy{top:28px;width:64%}.yarn-hero--connected .yarn-hero__heading{font-size:clamp(25px,8cqw,32px);line-height:1.25}.yarn-hero--connected .yarn-hero__text{margin-top:10px;max-width:16em;font-size:14px;line-height:1.5}.yarn-hero--connected .yarn-hero__cta{min-height:var(--yarn-touch);gap:12px;margin-top:14px;padding:9px 18px;font-size:14px;background:var(--yarn-cta-bg);color:var(--yarn-text-heading)}.yarn-hero--connected .yarn-hero__cta:hover{background:var(--yarn-cta-hover)}.yarn-hero--connected .yarn-hero__node--project{left:9%;top:170px;width:48%}.yarn-hero--connected .yarn-hero__node--yarn{right:0;top:0;width:29%}.yarn-hero--connected .yarn-hero__node--tools{right:0;top:184px;width:33%}.yarn-hero--connected .yarn-hero__node strong{min-height:30px;margin-top:-10px;padding:5px 9px;font-size:13px}.yarn-hero--connected .yarn-hero__node strong svg{width:12px;height:12px;margin-left:3px}.yarn-hero--connected .yarn-hero__thread--desktop{display:none}.yarn-hero--connected .yarn-hero__thread--mobile{display:block;stroke-width:1.5}.yarn-hero--connected .yarn-hero__wave{height:32px;margin-top:-8px}.yarn-hero--connected .yarn-hero__heading:lang(ja){font-size:25px}.yarn-hero--connected .yarn-hero__heading:lang(en){font-size:28px}.yarn-hero--connected .yarn-hero__node strong:lang(en),.yarn-hero--connected .yarn-hero__node strong:lang(ja){font-size:12px}.yarn-hero--connected .yarn-hero__visual:lang(en){height:410px}.yarn-hero--connected .yarn-hero__node--project:lang(en){top:218px}.yarn-hero--connected .yarn-hero__node--tools:lang(en){top:230px}.yarn-hero--connected .yarn-hero__visual:lang(ja){height:440px}.yarn-hero--connected .yarn-hero__node--project:lang(ja){top:250px}.yarn-hero--connected .yarn-hero__node--tools:lang(ja){top:250px}}@media(min-width:480px)and (max-width:749px){.yarn-hero--connected .yarn-hero__visual{height:480px}.yarn-hero--connected .yarn-hero__node--project{top:200px;width:45%}.yarn-hero--connected .yarn-hero__node--tools{top:235px;width:29%}}@media(min-width:750px){.yarn-hero--connected .yarn-hero__heading:lang(ja){font-size:clamp(28px,3.5cqw,44px)}.yarn-hero--connected .yarn-hero__heading:lang(en){font-size:clamp(30px,4cqw,50px)}}
/*# sourceMappingURL=/cdn/shop/t/68/assets/yarn-hero-b.css.map */