:root{--black:#080808;--white:#f7f3ea;--pink:#ff187d;--yellow:#ffe500;--blue:#1746ff;--orange:#ff6a21;--line:#ffffff2b;--sans:Arial,Helvetica,sans-serif;--serif:Georgia,serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--black);color:var(--white);font-family:var(--sans);overflow-x:hidden}a{color:inherit}.skip{position:fixed;top:-5rem;left:1rem;z-index:100;background:#fff;color:#000;padding:1rem}.skip:focus{top:1rem}.topbar{height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(1rem,5vw,5rem);border-bottom:1px solid var(--line);position:relative;z-index:20;background:#080808e8;backdrop-filter:blur(12px)}.wordmark{text-decoration:none;display:grid;line-height:1}.wordmark span{font-size:.65rem;letter-spacing:.3em}.wordmark b{font-size:1rem}.topbar nav{display:flex;gap:1.7rem}.topbar nav a{text-decoration:none;text-transform:uppercase;font-size:.68rem;letter-spacing:.14em}.nav-cta{border-bottom:2px solid var(--pink)}.menu{display:none;background:none;border:0;color:white}.yarn-section{position:relative}.hero{min-height:calc(100svh - 82px);display:grid;grid-template-columns:1fr .8fr;align-items:center;padding:7vw;overflow:hidden;background:radial-gradient(circle at 75% 45%,#ff187d25,transparent 28%),radial-gradient(circle at 82% 52%,#1746ff20,transparent 34%)}.hero-copy{position:relative;z-index:2}.eyebrow{font-size:.64rem;letter-spacing:.22em;font-weight:900;text-transform:uppercase}.hero h1,.featured h2,.manifesto h2,.section-head h2,.word-lab h2,.commission h2{font-size:clamp(4rem,9vw,9.5rem);line-height:.78;letter-spacing:-.075em;margin:.45em 0 .28em}.yarn-heading em,.yarn-heading i{font-family:var(--serif);font-weight:400;color:var(--pink)}.lede{max-width:680px;color:#c8c3b9;font-size:clamp(1rem,1.6vw,1.35rem);line-height:1.6}.actions{display:flex;gap:1.5rem;align-items:center;flex-wrap:wrap;margin-top:2rem}.button{position:relative;isolation:isolate;display:inline-flex;justify-content:center;align-items:center;padding:1.1rem 1.5rem;text-decoration:none;text-transform:uppercase;font-size:.69rem;font-weight:900;letter-spacing:.12em;border:1px solid currentColor;overflow:hidden}.button:before{content:"";position:absolute;inset:-5px;z-index:-1;border:6px dashed var(--yellow);border-radius:4px;opacity:0;animation:stitch 1.6s linear infinite}.button:hover:before,.button:focus-visible:before{opacity:1}.button.primary{background:var(--pink);color:#080808;border-color:var(--pink)}.button.text{border:0}.hero-orbit{width:min(32vw,480px);aspect-ratio:1;border-radius:50%;border:clamp(20px,4vw,60px) solid var(--pink);box-shadow:inset 0 0 0 5px #ff73ae,0 20px 70px #000;display:grid;place-items:center;position:relative;transform:rotate(-12deg);background:repeating-linear-gradient(92deg,#151515 0 6px,#272727 7px 9px)}.hero-orbit span{font-size:clamp(3rem,8vw,8rem);font-weight:900;letter-spacing:-.1em;text-shadow:5px 5px 0 var(--blue)}.hero-orbit i{position:absolute;height:8px;width:80vw;background:linear-gradient(90deg,transparent,var(--yellow),var(--pink),var(--blue),transparent);border-radius:50%;filter:drop-shadow(0 2px 1px #000);animation:strand 7s ease-in-out infinite}.hero-orbit i:nth-child(3){transform:rotate(23deg);animation-delay:-2s}.hero-orbit i:nth-child(4){transform:rotate(-28deg);animation-delay:-4s}.featured{min-height:100vh;display:grid;grid-template-columns:.75fr 1.25fr;gap:5vw;align-items:center;padding:8vw 6vw;background:var(--white);color:#0a0a0a}.featured h2{font-size:clamp(3.3rem,7vw,7rem)}.featured-copy p:last-child{line-height:1.7;max-width:580px}.hill-frame{border:0;background:#0b0b0b;padding:clamp(.8rem,2vw,1.6rem);color:white;cursor:zoom-in;position:relative;box-shadow:0 30px 70px #0004,0 0 0 2px #111,0 0 0 9px #ff187d}.hill-frame:before{content:"";position:absolute;inset:-9px;border:4px dashed var(--yellow);animation:stitch 9s linear infinite}.hill-frame img{display:block;width:100%;height:min(72vh,760px);object-fit:contain;background:#050505}.hill-frame span{display:block;text-align:left;padding-top:1rem;font-size:.65rem;letter-spacing:.16em;text-transform:uppercase}.knot{position:absolute;width:34px;height:34px;border-radius:50%;right:-18px;top:42%;background:conic-gradient(var(--pink),var(--yellow),var(--blue),var(--pink));box-shadow:0 0 0 4px #111;transition:.4s}.hill-frame.pluck .knot{animation:pluck .7s cubic-bezier(.2,.8,.2,1)}.manifesto{padding:13vw 6vw;display:grid;grid-template-columns:1fr 4fr 1.5fr;gap:3vw;align-items:end}.manifesto h2{font-size:clamp(3.8rem,9vw,9rem);margin:0}.manifesto h2 span{color:var(--yellow)}.manifesto p{line-height:1.7}.catalog{padding:10vw 6vw;background:#101010}.section-head{display:grid;grid-template-columns:1fr 3fr 1fr;gap:2rem;align-items:end;margin-bottom:5rem}.section-head h2{font-size:clamp(3.8rem,8vw,8rem);margin:0}.section-head>p:last-child{line-height:1.6;color:#aaa}.catalog-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:3rem}.concept{position:relative;padding:1.1rem 1.1rem 2rem;background:#171717;border:1px solid #444;box-shadow:14px 18px 0 #000,14px 18px 0 1px #333;overflow:hidden}.concept:after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(98deg,transparent 0 7px,#fff07 8px 9px);mix-blend-mode:overlay;opacity:.3}.concept-art{aspect-ratio:16/10;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 30% 30%,var(--a),transparent 38%),radial-gradient(circle at 70% 65%,var(--b),transparent 42%),repeating-linear-gradient(103deg,#111 0 7px,#292929 8px 11px);border:14px solid #090909;box-shadow:inset 0 0 35px #000,0 10px 25px #000}.concept-art span{font-size:clamp(2.4rem,6vw,6.5rem);font-weight:900;letter-spacing:-.09em;color:var(--c);text-shadow:2px 2px 0 var(--a),4px 4px 0 var(--b),0 7px 10px #000;-webkit-text-stroke:1px #fff8;background:repeating-linear-gradient(0deg,var(--c) 0 3px,#fff 4px 5px);background-clip:text;-webkit-background-clip:text;color:transparent}.concept[data-palette=berry]{--a:#ff187d;--b:#6d36ff;--c:#ffe500}.concept[data-palette=sun]{--a:#ffe500;--b:#ff6a21;--c:#1746ff}.concept[data-palette=faith]{--a:#f7f3ea;--b:#d59a4f;--c:#ff187d}.concept[data-palette=electric]{--a:#1746ff;--b:#29d6c7;--c:#ffe500}.concept[data-palette=custom]{--a:#ff6a21;--b:#ff187d;--c:#f7f3ea}.concept>p{font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:#aaa;margin-top:1.5rem}.concept h3{font-size:clamp(1.7rem,3vw,3rem);margin:.25rem 0 1rem}.concept a{text-transform:uppercase;font-size:.65rem;letter-spacing:.14em;font-weight:900}.word-lab{min-height:100vh;padding:10vw 6vw;display:grid;grid-template-columns:.75fr 1.25fr;gap:6vw;align-items:center;background:var(--blue)}.word-lab h2{font-size:clamp(3.5rem,7vw,7rem)}.lab-copy>p{max-width:550px;line-height:1.6}.lab-copy label{display:grid;gap:.5rem;margin:2rem 0 1rem;text-transform:uppercase;font-size:.65rem;letter-spacing:.15em}.lab-copy input{font:900 clamp(2rem,5vw,5rem)/1 var(--sans);width:100%;background:transparent;color:white;border:0;border-bottom:3px solid white;padding:.2em 0;text-transform:uppercase}.lab-copy fieldset{border:0;padding:0;margin:1.5rem 0}.lab-copy legend{font-size:.65rem;letter-spacing:.15em;text-transform:uppercase;margin-bottom:.7rem}.swatch{width:44px;height:44px;border-radius:50%;border:3px solid transparent;margin-right:.5rem;background:linear-gradient(135deg,#ff187d 0 33%,#ffe500 33% 66%,#1746ff 66%)}.swatch:nth-of-type(2){background:linear-gradient(135deg,#ff6a21 0 33%,#f7f4ed 33% 66%,#111 66%)}.swatch:nth-of-type(3){background:linear-gradient(135deg,#9cff57 0 33%,#29d6c7 33% 66%,#6d36ff 66%)}.swatch.active{outline:3px solid white;outline-offset:4px}.preview-stage{--c1:#ff187d;--c2:#ffe500;--c3:#1746ff;aspect-ratio:1.2;position:relative;background:#080808;display:grid;place-items:center;overflow:hidden;box-shadow:25px 28px 0 #0b1a75}.preview-stage small{position:absolute;top:1rem;left:1rem;letter-spacing:.12em}.plain-word,.yarn-word{position:absolute;font-size:clamp(3rem,8vw,9rem);font-weight:900;letter-spacing:-.1em}.plain-word{color:#fff}.yarn-word{opacity:0;color:transparent;background:repeating-linear-gradient(2deg,var(--c1) 0 4px,var(--c2) 5px 8px,var(--c3) 9px 12px);background-clip:text;-webkit-background-clip:text;-webkit-text-stroke:1px #fff5;filter:drop-shadow(7px 9px 0 #000)}.wrap-strands i{position:absolute;left:-20%;width:140%;height:10px;border-radius:50%;background:linear-gradient(90deg,transparent,var(--c1),var(--c2),var(--c3),transparent);opacity:0}.wrapping .plain-word{animation:plainOut 1.1s 1.5s forwards}.wrapping .yarn-word{animation:yarnIn .7s 1.45s forwards}.wrapping .wrap-strands i{animation:wrap 2s ease-in-out forwards}.wrapping .wrap-strands i:nth-child(2){animation-delay:.15s}.wrapping .wrap-strands i:nth-child(3){animation-delay:.3s}.share{padding:5vw 6vw;background:var(--pink);color:#080808;display:grid;grid-template-columns:1fr 2fr;gap:3rem;align-items:center}.share>p{font-size:clamp(1.5rem,3vw,3rem);font-weight:900;line-height:.95}.share-actions{display:flex;flex-wrap:wrap;gap:.7rem}.share-actions a,.share-actions button{background:#080808;color:white;border:1px solid #080808;padding:.85rem 1rem;text-decoration:none;text-transform:uppercase;font-size:.62rem;letter-spacing:.1em;cursor:pointer}.commission{padding:12vw 6vw;background:var(--yellow);color:#080808;display:flex;justify-content:space-between;align-items:end;gap:3rem}.commission h2{font-size:clamp(4rem,9vw,9rem)}.button.light{background:#080808;color:white}footer{padding:2rem 6vw;display:flex;justify-content:space-between;gap:2rem;font-size:.65rem;letter-spacing:.1em;text-transform:uppercase}.lightbox{width:min(94vw,1200px);height:94vh;background:#050505;color:white;border:1px solid #555;padding:1rem}.lightbox::backdrop{background:#000e}.lightbox img{width:100%;height:calc(100% - 70px);object-fit:contain}.lightbox button{float:right;background:white;color:black;border:0;padding:.7rem 1rem}.pointer-yarn{position:fixed;left:-30px;top:-30px;width:60px;height:60px;z-index:100;pointer-events:none;opacity:0;border:3px solid var(--pink);border-radius:50% 45% 52% 48%;box-shadow:0 0 0 2px var(--yellow),0 0 0 5px var(--blue);transition:opacity .2s}.pointer-yarn.on{opacity:.7}.page-thread{position:absolute;left:2.5vw;top:80vh;bottom:0;width:8px;z-index:5;pointer-events:none;background:linear-gradient(var(--pink),var(--yellow),var(--blue),var(--pink));border-radius:50%;opacity:.55;filter:drop-shadow(2px 2px 1px #000)}.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s,transform .8s}.reveal.in{opacity:1;transform:none}@keyframes stitch{to{transform:rotate(360deg)}}@keyframes strand{0%,100%{translate:-10% -30%;rotate:-8deg}50%{translate:10% 40%;rotate:8deg}}@keyframes pluck{30%{transform:translate(45px,-25px) rotate(190deg) scale(1.3)}70%{transform:translate(-15px,15px) rotate(330deg)}}@keyframes wrap{0%{opacity:0;transform:translateY(-140px) rotate(-8deg)}20%{opacity:1}80%{opacity:1}100%{opacity:0;transform:translateY(140px) rotate(8deg)}}@keyframes plainOut{to{opacity:0;transform:scale(.94)}}@keyframes yarnIn{to{opacity:1;transform:scale(1.03)}}
@media(max-width:800px){.topbar{height:68px}.menu{display:block}.topbar nav{display:none;position:absolute;top:68px;left:0;right:0;background:#080808;padding:1.5rem;flex-direction:column}.topbar nav.open{display:flex}.hero,.featured,.word-lab{grid-template-columns:1fr}.hero{padding:12vw 6vw;gap:4rem}.hero-orbit{width:75vw;justify-self:center}.featured{padding:18vw 6vw}.hill-frame{max-width:100%}.hill-frame:before{inset:0}.hill-frame img{height:auto;max-height:70svh}.hill-frame .knot{right:0}.manifesto,.section-head{grid-template-columns:1fr}.catalog-grid{grid-template-columns:1fr}.concept{box-shadow:6px 8px 0 #000}.preview-stage{box-shadow:8px 10px 0 #0b1a75}.share{grid-template-columns:1fr}.commission{display:block}.commission .button{margin-top:2rem}footer{flex-direction:column}.page-thread{left:auto;right:2vw;width:5px}.pointer-yarn{display:none}.reveal{opacity:1;transform:none}.yarn-heading{background-size:200% 100%;animation:mobileThread 6s linear infinite}@keyframes mobileThread{50%{text-shadow:2px 2px 0 #ff187d,-2px -2px 0 #1746ff}}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}.reveal{opacity:1;transform:none}.pointer-yarn,.page-thread{display:none}}
.hill-frame{overflow:visible}.hill-frame img,.lightbox img{display:block;width:100%;height:auto;object-fit:contain;object-position:center;transform:none}.lightbox img{max-height:calc(100% - 70px)}
@media(max-width:800px){.hill-frame:before{animation:none;transform:none}}
/* CODY-CATEGORY-CATALOG-V4 */
.catalog-v4{overflow:hidden}.catalog-v4 .category-list{display:grid;gap:clamp(5rem,10vw,10rem)}.catalog-v4 .category-card{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,.75fr);gap:clamp(2rem,6vw,7rem);align-items:center;position:relative}.catalog-v4 .category-card:nth-child(even){grid-template-columns:minmax(280px,.75fr) minmax(0,1.45fr)}.catalog-v4 .category-card:nth-child(even) .category-visual{order:2}.catalog-v4 .category-card:after{content:"";position:absolute;z-index:0;left:8%;right:8%;bottom:-3rem;height:2px;background:linear-gradient(90deg,transparent,var(--pink),var(--yellow),var(--blue),transparent);filter:drop-shadow(0 2px 1px #000)}.catalog-v4 .category-visual,.catalog-v4 .category-copy{position:relative;z-index:1}.catalog-v4 .category-visual{width:100%;border:0;background:#050505;padding:clamp(.7rem,1.5vw,1.25rem);color:#fff;cursor:zoom-in;box-shadow:18px 24px 0 #000,18px 24px 0 1px #3d3d3d;isolation:isolate}.catalog-v4 .category-visual:before,.catalog-v4 .category-visual:after{content:"";position:absolute;pointer-events:none}.catalog-v4 .category-visual:before{inset:-7px;border:3px dashed var(--pink);z-index:-1}.catalog-v4 .category-visual:after{width:28px;height:28px;right:-14px;top:22%;border-radius:50%;background:conic-gradient(var(--yellow),var(--pink),var(--blue),var(--yellow));box-shadow:0 0 0 4px #0b0b0b}.catalog-v4 .category-original .category-visual:before{border-color:var(--yellow)}.catalog-v4 .category-visual img{display:block;width:100%;height:auto;max-width:100%;object-fit:contain;object-position:center;transform:none;background:#080808}.catalog-v4 .category-visual span{display:flex;justify-content:space-between;padding-top:1rem;text-transform:uppercase;font-size:.6rem;font-weight:800;letter-spacing:.15em}.catalog-v4 .category-label{display:inline-flex;margin:0 0 1.3rem;padding:.55rem .7rem;background:var(--pink);color:#080808;text-transform:uppercase;font-size:.62rem;font-weight:900;letter-spacing:.15em}.catalog-v4 .category-label.original-label{background:var(--yellow)}.catalog-v4 .category-number{font:700 .62rem/1 var(--sans);letter-spacing:.16em;color:#888}.catalog-v4 .category-copy h3{font-size:clamp(2.8rem,5.4vw,6rem);line-height:.85;letter-spacing:-.065em;text-transform:uppercase;margin:.25em 0}.catalog-v4 .category-copy>p:not(.category-label):not(.category-number){font-size:1.05rem;line-height:1.65;color:#bbb;max-width:570px}.catalog-v4 dl{margin:2rem 0;padding:1rem 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.catalog-v4 dt{font-size:.6rem;font-weight:900;letter-spacing:.16em;text-transform:uppercase}.catalog-v4 dd{margin:.6rem 0 0;color:#aaa;line-height:1.5}.catalog-v4 .category-action{background:transparent;color:#fff}.catalog-v4 .catalog-lightbox{width:min(94vw,1300px);max-width:1300px;height:auto;max-height:94vh;overflow:auto;background:#050505;color:#fff;border:1px solid #555;padding:1rem}.catalog-v4 .catalog-lightbox::backdrop{background:#000e}.catalog-v4 .catalog-lightbox img{display:block;width:100%;height:auto;max-height:calc(90vh - 90px);object-fit:contain;object-position:center}.catalog-v4 .catalog-lightbox button{float:right;margin-bottom:.7rem;background:#fff;color:#000;border:0;padding:.7rem 1rem;cursor:pointer}.catalog-v4 .catalog-lightbox p{clear:both;font-size:.65rem;letter-spacing:.14em;text-transform:uppercase}
@media(max-width:800px){.catalog-v4 .category-card,.catalog-v4 .category-card:nth-child(even){grid-template-columns:1fr;gap:2rem}.catalog-v4 .category-card:nth-child(even) .category-visual{order:0}.catalog-v4 .category-visual{box-shadow:7px 9px 0 #000}.catalog-v4 .category-visual:before{inset:0}.catalog-v4 .category-visual:after{right:0}.catalog-v4 .category-copy h3{font-size:clamp(2.5rem,13vw,4.5rem)}}
