/* A shared design language, not a flattened image: every text/image is a Studio component. */
.cb-crafted-hero{--hero-ink:var(--cb-text,#2b0036);--hero-paper:#fffaf5;position:relative;isolation:isolate;overflow:hidden;background:var(--hero-paper);color:var(--hero-ink);padding-block:clamp(3rem,6vw,6rem);border-radius:0;border-bottom:1px solid color-mix(in srgb,var(--cb-primary,#701689) 12%,transparent)}
:is(.cb-crafted-hero,.cb-hero,.cb-post-hero,.cb-learning-hero,[data-cb-hero]){position:relative;isolation:isolate;overflow:hidden}
:is(.cb-crafted-hero,.cb-hero,.cb-post-hero,.cb-learning-hero,[data-cb-hero])::before,:is(.cb-crafted-hero,.cb-hero,.cb-post-hero,.cb-learning-hero,[data-cb-hero])::after{content:none;position:absolute;z-index:-3;pointer-events:none;animation:none}
/* The default covers current, legacy and newly inserted heroes. Explicit Studio backgrounds replace it. */
:is(.cb-crafted-hero,.cb-hero,.cb-post-hero,.cb-learning-hero,[data-cb-hero]):is(:not([data-cb-bg-type]),[data-cb-bg-type="crochet"])::before{content:"";inset:-80px;background:url('/hero-crochet-texture.webp') center/cover no-repeat;opacity:.38;mix-blend-mode:multiply;transform:translate3d(0,0,0)}
:is(.cb-crafted-hero,.cb-hero,.cb-post-hero,.cb-learning-hero,[data-cb-hero]):is(:not([data-cb-bg-type]),[data-cb-bg-type="crochet"],[data-cb-bg-type="gradient"],[data-cb-bg-type="image"],[data-cb-bg-type="video"])::after{content:"";inset:0;width:auto;height:auto;border-radius:inherit;z-index:-2;background:linear-gradient(90deg,color-mix(in srgb,var(--hero-paper,#fffaf5) 96%,transparent),color-mix(in srgb,var(--hero-paper,#fffaf5) 88%,transparent) 42%,color-mix(in srgb,var(--hero-paper,#fffaf5) 28%,transparent) 78%,transparent)}
:is(.cb-crafted-hero,.cb-hero,.cb-post-hero,.cb-learning-hero,[data-cb-hero]):is(:not([data-cb-bg-type]),[data-cb-bg-type="crochet"]):not([data-hero-motion="off"])::before{animation:cb-crochet-flow 24s ease-in-out infinite alternate}
:is(.cb-crafted-hero,.cb-hero,.cb-post-hero,.cb-learning-hero,[data-cb-hero])[data-cb-bg-type="image"]:not([data-hero-motion="off"]){animation:cb-background-drift 24s ease-in-out infinite alternate}
:is(.cb-crafted-hero,.cb-hero,.cb-post-hero,.cb-learning-hero,[data-cb-hero])[data-cb-bg-type="gradient"]:not([data-hero-motion="off"]){background-size:260% 260%;animation:cb-background-gradient-flow 16s ease infinite}
:is(.cb-crafted-hero,.cb-hero,.cb-post-hero,.cb-learning-hero,[data-cb-hero])[data-hero-motion="off"],:is(.cb-crafted-hero,.cb-hero,.cb-post-hero,.cb-learning-hero,[data-cb-hero])[data-hero-motion="off"]>[data-cb-background-layer]{animation:none!important}
.cb-crafted-hero--plum.cb-crafted-hero::before{mix-blend-mode:soft-light;opacity:.38}
.cb-crafted-hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(2rem,5vw,6rem);align-items:center;position:relative;z-index:1}
.cb-crafted-hero-copy,.cb-crafted-hero-visual{min-width:0}
.cb-hero-eyebrow{font-size:.75rem;font-weight:850;letter-spacing:.13em;line-height:1.6;text-transform:uppercase;margin:0 0 1.3rem;color:inherit}
.cb-crafted-hero .cb-heading{font-size:clamp(2.35rem,4.4vw,5rem);font-family:var(--cb-font-display,inherit);font-weight:800;line-height:1.08;letter-spacing:-.045em;color:inherit;margin:0 0 1.5rem;text-wrap:balance;max-width:16ch}
.cb-crafted-hero .cb-hero-lead{font-size:clamp(1rem,1.3vw,1.18rem);line-height:1.8;color:inherit;max-width:51ch;margin:0 0 1.8rem}
.cb-hero-actions{display:flex;gap:.8rem;align-items:center;flex-wrap:wrap}
.cb-crafted-hero a.cb-hero-button,:is(.cb-hero,.cb-post-hero,.cb-learning-hero,[data-cb-hero]) :is(a.cb-button,a.cb-learning-button){display:inline-flex;justify-content:center;align-items:center;gap:1.2rem;min-height:50px;max-width:100%;padding:.85rem 1.4rem;border-radius:var(--cb-button-radius,999px);border:1.5px solid #701689;background:linear-gradient(120deg,#701689,#9821bd);color:#fff;font-weight:800;font-size:.92rem;line-height:1.4;text-decoration:none;box-shadow:0 5px 16px #4011511c;transition:transform .18s ease,box-shadow .18s ease}
.cb-crafted-hero a.cb-hero-button--quiet{background:linear-gradient(120deg,#401151,#701689);border-color:#401151;color:#fff}
.cb-crafted-hero a.cb-hero-button:hover{transform:translateY(-2px);box-shadow:0 5px 0 color-mix(in srgb,var(--hero-ink) 15%,transparent)}
.cb-crafted-hero a.cb-hero-button:focus-visible{outline:3px solid currentColor;outline-offset:5px}
.cb-hero-note{font-size:.8rem;line-height:1.6;margin:1.35rem 0 0;color:inherit}
.cb-crafted-hero-visual{position:relative;width:100%;max-width:660px;justify-self:center;padding:1rem .4rem}
.cb-hero-art{margin:0;background:#fff;padding:.65rem;border-radius:2rem;transform:rotate(2deg);box-shadow:0 20px 55px #3815441a}
.cb-hero-art .cb-image{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:center;border-radius:1.4rem}
.cb-hero-art figcaption{font-size:.7rem;color:#4c3557;line-height:1.5;margin:.7rem .5rem .25rem;text-align:center}
.cb-crafted-hero--atelier .cb-hero-art figcaption{text-align:right}
.cb-hero-swatch{width:43%;margin:-18% 0 0 -6%;padding:.4rem;position:relative;z-index:2;background:white;border:1px solid #e9dde9;border-radius:1rem;box-shadow:0 12px 35px #38154422;transform:rotate(-7deg)}
.cb-hero-swatch img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:.65rem}
.cb-hero-swatch figcaption{font-size:.65rem;font-weight:750;text-align:center;margin:.45rem .15rem;color:#38203e}
.cb-crafted-hero--atelier{background:radial-gradient(ellipse at 95% 80%,#eeddf5 0,transparent 55%),var(--hero-paper)}
.cb-crafted-hero--plum{--hero-ink:#fff9f3;--hero-paper:color-mix(in srgb,var(--cb-primary,#701689) 55%,#211326);background:radial-gradient(ellipse at 80% 10%,#ffffff0d,transparent 60%),var(--hero-paper)}
.cb-crafted-hero--plum .cb-hero-art{transform:rotate(-2deg);border-radius:8rem 8rem 1.5rem 1.5rem}
.cb-crafted-hero--plum .cb-hero-art img{border-radius:7.5rem 7.5rem 1rem 1rem}
.cb-crafted-hero--mint{--hero-paper:#eef7f2;background:radial-gradient(ellipse at 90% 10%,#d4ecdf,transparent 65%),var(--hero-paper)}
.cb-crafted-hero--mint .cb-hero-art{transform:rotate(-2deg)}
.cb-crafted-hero--peach{--hero-paper:#fff1e6;background:radial-gradient(ellipse at 85% 60%,#f4dceb,transparent 60%),var(--hero-paper)}
.cb-crafted-hero--journal{--hero-paper:#f9f0fa}
.cb-crafted-hero--journal .cb-hero-art{transform:none;border-radius:1.5rem}
.cb-crafted-hero--journal .cb-hero-art img{aspect-ratio:16/10;border-radius:1rem}
.cb-page .cb-post-hero{position:relative;isolation:isolate;border-bottom:1px solid var(--cb-border,#efd8f3);background:linear-gradient(110deg,#faf2fc,#fff8ed);padding-block:clamp(2rem,4.5vw,4.5rem)}
.cb-page .cb-post-hero h1{font-size:clamp(2rem,3.7vw,4.2rem);max-width:25ch;line-height:1.15;letter-spacing:-.035em}
.cb-page .cb-post-hero .cb-text--lead{max-width:70ch;line-height:1.8}
.cb-page .cb-post-hero img{max-height:440px;width:100%;height:auto;object-fit:cover;border-radius:1.5rem}
.cb-page .cb-post-hero .cb-container{position:relative}
[id="products"],[id="creations"],[id="library"],[id="pattern-workbench"],[id="article-story"]{scroll-margin-top:100px}
@keyframes cb-crochet-flow{to{transform:translate3d(64px,48px,0)}}
@media(max-width:900px){.cb-crafted-hero-grid{gap:2rem;grid-template-columns:minmax(0,1fr) minmax(0,.9fr)}.cb-crafted-hero .cb-heading{font-size:clamp(2rem,4.5vw,3.3rem)}.cb-hero-art{padding:.4rem}.cb-hero-swatch{margin-left:-2%}.cb-hero-actions{gap:.65rem}.cb-crafted-hero a.cb-hero-button{padding:.8rem 1rem;font-size:.85rem}}
@media(max-width:640px){.cb-crafted-hero{padding-block:2.7rem}.cb-crafted-hero-grid{grid-template-columns:1fr;gap:2rem}.cb-crafted-hero .cb-heading{font-size:clamp(2.5rem,10vw,3.5rem);max-width:18ch}.cb-hero-eyebrow{font-size:.68rem}.cb-crafted-hero-visual{width:94%;max-width:440px}.cb-hero-art img{aspect-ratio:4/3}.cb-hero-note{font-size:.75rem}.cb-hero-swatch{width:40%;margin-top:-15%;margin-left:-2%}.cb-page .cb-post-hero img{max-height:300px}}
@media(prefers-reduced-motion:reduce){:is(.cb-crafted-hero,.cb-hero,.cb-post-hero,.cb-learning-hero,[data-cb-hero]),:is(.cb-crafted-hero,.cb-hero,.cb-post-hero,.cb-learning-hero,[data-cb-hero])::before,:is(.cb-crafted-hero,.cb-hero,.cb-post-hero,.cb-learning-hero,[data-cb-hero])>[data-cb-background-layer]{animation:none!important}.cb-crafted-hero a.cb-hero-button{transition:none}.cb-crafted-hero a.cb-hero-button:hover{transform:none}}
/* Keep the editing canvas stable while dragging, selecting, typing and resizing. */
body.gjs-dashed:not(.cb-studio-preview) :is(.cb-crafted-hero,.cb-hero,.cb-post-hero,.cb-learning-hero,[data-cb-hero]),body.gjs-dashed:not(.cb-studio-preview) :is(.cb-crafted-hero,.cb-hero,.cb-post-hero,.cb-learning-hero,[data-cb-hero])::before,body.gjs-dashed:not(.cb-studio-preview) :is(.cb-crafted-hero,.cb-hero,.cb-post-hero,.cb-learning-hero,[data-cb-hero])>[data-cb-background-layer]{animation:none!important}
