.cyo{position:relative;min-height:100vh;padding-bottom:14rem}.cyo__step{display:none;padding:2.4rem var(--page-gutter) 3.2rem;max-width:76rem;margin:0 auto}.cyo__step.is-active{display:block}.cyo__step-header{margin-bottom:2.4rem}.cyo__step-title{font-family:var(--font-heading-family);font-size:calc(var(--font-heading-scale) * 2.4rem);text-transform:var(--heading-text-transform);letter-spacing:var(--heading-letter-spacing);font-weight:400;line-height:1.2;margin:0 0 .6rem;color:var(--color-heading-text)}.cyo__step-subtitle{font-size:var(--font-size-small);color:var(--color-body-text);margin:0;line-height:var(--line-height-medium)}.cyo__cards{display:grid;grid-template-columns:repeat(2,1fr);gap:1.2rem}.cyo-card{border:2px solid transparent;overflow:hidden;cursor:pointer;transition:border-color .2s ease;background:var(--color-body-background);outline:none}.cyo-card:hover,.cyo-card:focus-visible{border-color:var(--color-body-text)}.cyo-card.is-selected{border-color:var(--color-accent-primary)}.cyo-card__media{position:relative;width:100%;padding-bottom:var(--card-media-padding);background:var(--card-media-background-color);overflow:hidden}.cyo-card__media img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}.cyo-card__media-placeholder{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-extra-small);color:var(--color-body-text);opacity:.4;text-transform:uppercase;letter-spacing:.05em}.cyo-card__size-badge{display:none;position:absolute;bottom:0;left:0;right:0;background:var(--color-accent-primary);color:var(--color-white);font-size:1rem;font-weight:700;font-family:var(--font-body-family);padding:.5rem .7rem;letter-spacing:.05em;text-transform:uppercase;text-align:center}.cyo-card.is-selected .cyo-card__size-badge{display:block}.cyo-card__check{display:none;position:absolute;top:.8rem;right:.8rem;width:2.4rem;height:2.4rem;border-radius:50%;background:var(--color-accent-primary);color:var(--color-white);align-items:center;justify-content:center}.cyo-card.is-selected .cyo-card__check{display:flex}.cyo-card__info{padding:1.2rem .8rem 0;text-align:center}.cyo-card__title{font-family:var(--font-heading-family);font-style:var(--font-heading-style);font-weight:var(--font-heading-weight);font-size:calc(var(--font-heading-scale) * 1.2rem);line-height:calc(1 + .6 / var(--font-heading-scale));margin:0 0 .4rem;color:var(--color-heading-text)}.cyo-card__price{font-size:var(--font-size-extra-small);color:var(--color-body-text)}.cyo__lace-tabs{display:flex;align-items:center;gap:.6rem;margin-bottom:2rem;flex-wrap:wrap}.cyo__lace-tab{padding:0;border:none;background:transparent;color:inherit;font-family:var(--font-body-family);font-size:var(--font-size-small);text-transform:uppercase;letter-spacing:.05em;cursor:pointer;opacity:.55;transition:opacity .25s ease}.cyo__lace-tab:hover{opacity:.7}.cyo__lace-tab.is-active{opacity:1;font-weight:500;text-decoration:underline;text-underline-offset:6px}.cyo__lace-tab-sep{opacity:.3;font-size:var(--font-size-small);-webkit-user-select:none;user-select:none}.cyo__lace-panel{display:none}.cyo__lace-panel.is-active{display:grid}.cyo__empty{grid-column:1 / -1;color:var(--color-body-text);font-size:var(--font-size-small);padding:2.4rem 0;text-align:center;opacity:.6}.cyo__nav{position:sticky;top:0;z-index:50;background:var(--color-body-background);border-bottom:1px solid var(--color-border-elements);display:flex;justify-content:center}.cyo__nav-btn{font-family:var(--font-body-family);font-size:var(--font-size-extra-small);font-weight:500;letter-spacing:.08em;text-transform:uppercase;padding:1.6rem 2.4rem;border:none;background:none;cursor:pointer;color:var(--color-body-text);opacity:.4;position:relative;transition:opacity .25s ease,color .25s ease}.cyo__nav-btn:not([disabled]){opacity:1}.cyo__nav-btn.is-active{color:var(--color-heading-text);opacity:1}.cyo__nav-btn.is-active:after{content:"";position:absolute;bottom:0;left:1.6rem;right:1.6rem;height:2px;background:var(--color-heading-text)}.cyo__nav-btn.is-done{color:var(--color-accent-primary);opacity:1}.cyo__summary-bar{position:fixed;bottom:0;left:0;right:0;z-index:50;background:var(--color-body-background);border-top:1px solid var(--color-border-elements);box-shadow:0 -.4rem 2rem #00000014;padding:1.2rem var(--page-gutter)}.cyo__summary-slots{display:flex;gap:1rem;margin-bottom:1rem;max-width:76rem;margin-left:auto;margin-right:auto}.cyo__slot{flex:1;display:flex;align-items:center;gap:.8rem;padding:.8rem 1rem;border-radius:.6rem;background:color-mix(in srgb,var(--color-accent-primary) 8%,var(--color-body-background));cursor:pointer;transition:all .2s ease;border:2px solid transparent;min-width:0;opacity:.5}.cyo__slot.is-current{opacity:1;border-color:var(--color-accent-primary)}.cyo__slot.is-filled{opacity:1}.cyo__slot-thumb{width:3.6rem;height:3.6rem;border-radius:.4rem;background:#00000014;display:flex;align-items:center;justify-content:center;font-size:1rem;font-family:var(--font-body-family);font-weight:600;color:var(--color-body-text);flex-shrink:0;overflow:hidden;transition:background .2s,color .2s}.cyo__slot-thumb img{width:100%;height:100%;object-fit:cover;display:block}.cyo__slot.is-filled .cyo__slot-thumb{background:transparent}.cyo__slot-text{overflow:hidden;min-width:0;display:flex;flex-direction:column;gap:.1rem}.cyo__slot-label{font-size:.9rem;text-transform:uppercase;letter-spacing:.05em;font-weight:600;font-family:var(--font-body-family);color:var(--color-body-text);opacity:.7;line-height:1}.cyo__slot.is-filled .cyo__slot-label{color:var(--color-accent-primary);opacity:1}.cyo__slot-value{font-size:1.1rem;font-family:var(--font-body-family);color:var(--color-heading-text);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}.cyo__action-btn{display:block;width:100%;max-width:76rem;margin:0 auto}.cyo__action-btn[disabled]{opacity:.35;cursor:default;pointer-events:none}.cyo__size-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;background:#00000073;display:flex;align-items:flex-end;justify-content:center}.cyo__size-overlay[hidden]{display:none}.cyo__size-dialog{background:var(--color-body-background);width:100%;max-width:76rem;border-radius:1.6rem 1.6rem 0 0;padding:2.4rem var(--page-gutter) 3.2rem;transform:translateY(100%);transition:transform .3s ease}.cyo__size-overlay.is-open .cyo__size-dialog{transform:translateY(0)}.cyo__size-dialog-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.4rem}.cyo__size-dialog-title{font-family:var(--font-heading-family);font-size:calc(var(--font-heading-scale) * 1.8rem);text-transform:var(--heading-text-transform);font-weight:400;margin:0;color:var(--color-heading-text)}.cyo__size-dialog-close{display:flex;align-items:center;justify-content:center;width:3.6rem;height:3.6rem;color:var(--color-body-text);cursor:pointer;flex-shrink:0}.cyo__size-dialog-subtitle{font-size:var(--font-size-small);color:var(--color-body-text);margin:0 0 2rem;line-height:var(--line-height-medium)}.cyo__size-buttons{display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:2.4rem}.cyo__size-btn{font-family:var(--font-body-family);font-size:var(--font-size-small);font-weight:600;padding:1.2rem 1.8rem;border:2px solid var(--color-border-elements);background:none;cursor:pointer;border-radius:.6rem;transition:all .2s ease;min-width:6rem;text-align:center;color:var(--color-heading-text)}.cyo__size-btn:hover{border-color:var(--color-body-text)}.cyo__size-btn.is-active{border-color:var(--color-accent-primary);background:var(--color-accent-primary);color:var(--color-white)}.cyo__size-btn.is-unavailable{color:var(--color-border-elements);border-color:var(--color-border-elements);cursor:not-allowed;text-decoration:line-through}.cyo__loader{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:flex;align-items:center;justify-content:center;background:#fff9;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.cyo__loader[hidden]{display:none}@media screen and (min-width:990px){.cyo__cards{grid-template-columns:repeat(3,1fr);gap:1.6rem}.cyo__step{padding-top:4rem;padding-bottom:4rem}.cyo__step-title{font-size:calc(var(--font-heading-scale) * 3.2rem)}.cyo-card__title{font-size:calc(var(--font-heading-scale) * 1.5rem)}}
/*# sourceMappingURL=/cdn/shop/t/3/assets/section-create-your-own.css.map */
