/* craft skin: Pot Coloring — terracotta + sky blue + paint pops; hand-painted feel (Fraunces display, Caveat accents, Nunito body). Tokens come from theme_config.tokens; these are the fallbacks + decor. */
.cfs-pot-coloring{--bg:#FFF7EC;--bg2:#FBE6D2;--paper:#FFFDF8;--deep:#3B2A22;--ink:#3B2A22;--mute:#6B574C;--accent:#C8643C;--accent-ink:#9E4223;--pop:#D6334F;--pop2:#2E8FC0;--pop3:#F2B84B;--sig-bg:#CDE8F5}
.cfs-pot-coloring .cf-h1{font-family:var(--f-disp);font-variation-settings:'opsz' 144,'SOFT' 100;font-weight:800;letter-spacing:-.01em}
.cfs-pot-coloring .cf-ac{font-family:var(--f-hand);font-weight:700;font-size:1.18em;line-height:.9}
.cfs-pot-coloring .cf-h1 .cf-ac{display:inline-block;rotate:-3deg;color:var(--pop)}
.cfs-pot-coloring .cf-ul path{stroke:var(--pop2);stroke-width:5}
.cfs-pot-coloring .cf-btn{background:var(--accent-ink);box-shadow:0 4px 0 var(--ink)}
.cfs-pot-coloring .cf-sticker{background:var(--pop2);color:#fff;border-radius:6px 18px 6px 18px;transform:rotate(-3deg);box-shadow:3px 4px 0 var(--ink)}
/* hero: big terracotta "sun" + sky blob behind the collage; drips of paint along the bottom */
.cfs-pot-coloring .cf-hero::before{content:"";position:absolute;z-index:-1;width:min(78vw,620px);aspect-ratio:1;right:-14%;top:-18%;border-radius:50%;background:var(--accent);opacity:.92}
.cfs-pot-coloring .cf-hero::after{content:"";position:absolute;z-index:-1;width:min(54vw,420px);aspect-ratio:1;left:-16%;bottom:-26%;border-radius:50%;background:var(--sig-bg)}
.cfs-pot-coloring .cf-collage figure{border-radius:18px 40px 18px 40px}
.cfs-pot-coloring .cf-c1{rotate:2deg}
.cfs-pot-coloring .cf-dec svg{--m1:var(--pop);--m2:var(--pop2);--m3:var(--pop3)}
.cfs-pot-coloring .cf-dec2 svg{--m1:var(--pop2)}
.cfs-pot-coloring .cf-chip{border-radius:8px 16px 8px 16px}
.cfs-pot-coloring .cf-chip:nth-child(2n){background:var(--bg2)}
/* section edges: scalloped "painted wave" hanging from the previous colour */
.cfs-pot-coloring .cf-sec::before{content:"";position:absolute;left:0;right:0;top:0;height:20px;background:radial-gradient(circle at 20px 0,var(--prev,var(--bg)) 19px,transparent 20.5px) 0 0/40px 20px repeat-x}
.cfs-pot-coloring .cf-sec{padding-top:calc(clamp(56px,8vw,104px) + 12px)}
.cfs-pot-coloring #make{--prev:var(--bg)}.cfs-pot-coloring #paint{--prev:var(--paper)}.cfs-pot-coloring #flow{--prev:var(--bg2)}.cfs-pot-coloring #materials{--prev:var(--bg)}
.cfs-pot-coloring #before-after{--prev:var(--paper)}.cfs-pot-coloring #moments{--prev:var(--bg2)}.cfs-pot-coloring #faq{--prev:var(--paper)}.cfs-pot-coloring #join{--prev:var(--bg2)}
.cfs-pot-coloring .cf-bg-pop{background:var(--accent)}
.cfs-pot-coloring .cf-bg-pop :is(h2,.cf-kicker,.cf-lead,.cf-note,p,li,legend,label){color:#fff}
.cfs-pot-coloring .cf-bg-pop .cf-ac{color:var(--pop3)}
.cfs-pot-coloring .cf-bg-pop .cf-formcard :is(p,li,legend,label,span){color:var(--ink)}
.cfs-pot-coloring .cf-bg-pop .cf-formcard .cf-consent,.cfs-pot-coloring .cf-bg-pop .cf-formcard .cf-msg{color:var(--mute)!important}
.cfs-pot-coloring .cf-bg-pop .cf-facts li,.cfs-pot-coloring .cf-bg-pop .cf-contact{color:#fff}
.cfs-pot-coloring .cf-bg-pop .cf-ul path{stroke:var(--pop3)}
.cfs-pot-coloring .cf-bg-pop .cf-formcard .cf-btn{color:#fff!important}
/* what you'll make: swatch cards with a strip of masking tape */
.cfs-pot-coloring .cf-card{border-radius:6px 26px 6px 26px;box-shadow:6px 7px 0 var(--ink)}
.cfs-pot-coloring .cf-card::before{content:"";position:absolute;z-index:2;left:50%;top:-10px;width:70px;height:22px;margin-left:-35px;background:rgba(242,184,75,.85);rotate:-3deg;border-radius:2px}
.cfs-pot-coloring .cf-k0{rotate:-1.2deg}.cfs-pot-coloring .cf-k1{rotate:1deg}.cfs-pot-coloring .cf-k2{rotate:-.6deg}.cfs-pot-coloring .cf-k3{rotate:1.4deg}
.cfs-pot-coloring .cf-card-mo svg{--m1:var(--accent);--m2:var(--pop2);--m3:var(--pop3)}
.cfs-pot-coloring .cf-tag{color:var(--pop2)}
.cfs-pot-coloring .cf-k1 .cf-tag{color:var(--pop)}
/* paint stage */
.cfs-pot-coloring .cf-sigsec{overflow:hidden}
.cfs-pot-coloring .cf-pop2,.cfs-pot-coloring .cf-v-cream{background:var(--bg)}
/* steps */
.cfs-pot-coloring .cf-step{border-radius:8px 24px 8px 24px;box-shadow:5px 6px 0 var(--ink)}
.cfs-pot-coloring .cf-no{background:var(--pop2);color:#fff;border-radius:50% 50% 50% 8px}
.cfs-pot-coloring .cf-rail a[aria-current=step] b{background:var(--pop);border-color:var(--pop)}
/* materials */
.cfs-pot-coloring .cf-mat{border-radius:14px 28px 14px 28px;box-shadow:3px 4px 0 var(--ink)}
.cfs-pot-coloring .cf-mat-mo{--m1:var(--accent);--m2:var(--pop2);--m3:var(--pop3)}
/* before/after + media */
.cfs-pot-coloring .cf-ba,.cfs-pot-coloring .cf-media figure{border-radius:34px 10px 34px 10px;box-shadow:6px 8px 0 var(--ink)}
.cfs-pot-coloring .cf-ba{--ba-r:1/1;max-width:560px;margin-inline:auto;width:100%}
/* polaroid rail */
.cfs-pot-coloring .cf-cell{border-radius:4px;box-shadow:4px 6px 0 var(--ink);padding-bottom:10px}
.cfs-pot-coloring .cf-cell:nth-child(3n+1){border-bottom-width:12px}
.cfs-pot-coloring .cf-cell::before{content:"";position:absolute;left:50%;top:-9px;width:54px;height:18px;margin-left:-27px;background:rgba(46,143,192,.55);rotate:2deg}
.cfs-pot-coloring .cf-cell{position:relative}
.cfs-pot-coloring .cf-g-grid .cf-cell::before{display:none}
.cfs-pot-coloring details.cf-acc{border-radius:10px 22px 10px 22px}
.cfs-pot-coloring .cf-formcard{border-radius:10px 38px 10px 38px;box-shadow:8px 10px 0 var(--ink)}
.cfs-pot-coloring .cf-end{background:var(--bg2)}
/* capped decor loop: three drifting paint dabs in the hero (transform-only, paused offscreen via [data-live]) */
@keyframes pc-bob{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-8px) rotate(4deg)}}
.cfs-pot-coloring .cf-hero[data-live].on .cf-dec{animation:pc-bob 5.5s ease-in-out infinite}
.cfs-pot-coloring .cf-hero[data-live].on .cf-dec2{animation-delay:-2s}.cfs-pot-coloring .cf-hero[data-live].on .cf-dec3{animation-delay:-3.6s}
@media (prefers-reduced-motion:reduce){.cfs-pot-coloring .cf-hero[data-live].on .cf-dec{animation:none}}
.cfs-pot-coloring .cf-btn-ghost{background:var(--paper);color:var(--ink)!important}
.cfs-pot-coloring .cf-nav a{white-space:nowrap;font-size:14px;padding:10px 9px}
.cfs-pot-coloring .cf-bg-pop .cf-formcard .cf-btn span{color:#fff}
.cfs-pot-coloring .cf-ac{margin-inline:.07em}