/* ===== Refinement layer: smaller type, calmer motion — loaded after every page stylesheet =====
   Keeps the creative paper/doodle character, but with a measured, professional scale. */

/* body copy */
body{font-size:15px;line-height:1.55}
.hero p.sub{font-size:clamp(14px,1.2vw,16px)}
.jtxt p{font-size:clamp(12px,1vw,14px)}

/* display headings: roughly 55–60% of the old size, a little less tight */
.hero h2{font-size:clamp(40px,8vw,120px);line-height:.92;letter-spacing:-.04em}
.pagehead h1,.shophead h1,.abouthead h1{font-size:clamp(36px,6.2vw,92px);line-height:.95;letter-spacing:-.045em}
.abouthead h1{max-width:12ch}
.statement h3{font-size:clamp(22px,3.2vw,48px);line-height:1.1;letter-spacing:-.03em}
.mhead h2,.how h2,.road h2,.promise h2,.formats h3,.prods h3,.gallery h3,.bhead h3,.reviews h3,.findus h2,.gettinghere h2{font-size:clamp(28px,4.6vw,68px);line-height:1;letter-spacing:-.04em}
.text h2{font-size:clamp(26px,3.4vw,50px);line-height:1;letter-spacing:-.04em}
.proc h3,.ctabox h2{font-size:clamp(28px,4.4vw,64px);line-height:1;letter-spacing:-.04em}
.atrow h3{font-size:clamp(24px,3.2vw,48px)}
.jhead h2{font-size:clamp(24px,3.2vw,44px)}
.art h1{font-size:clamp(26px,3.6vw,48px);line-height:1.05}
.done h1{font-size:clamp(28px,4.4vw,56px)}
.custom h3{font-size:clamp(24px,3vw,40px)}
.more-h{font-size:clamp(24px,3vw,40px)}
.stat b,.num b{font-size:clamp(34px,4.6vw,64px);line-height:1}
.s .big{font-size:clamp(48px,8vw,120px)}
.s h4,.card h4{font-size:clamp(20px,2.2vw,30px)}
.tile h5,.pt h5{font-size:clamp(17px,1.6vw,22px)}
.fname{font-size:clamp(28px,4vw,56px)}
.pcard h4{font-size:clamp(17px,1.5vw,21px)}
.pminfo h2{font-size:clamp(20px,2.4vw,30px)}
.pc h3{font-size:15px}
.price{font-size:clamp(20px,1.8vw,26px)}
.wnum strong{font-size:clamp(26px,3vw,36px)}
.badge b{font-size:clamp(22px,2.6vw,30px)}
.cw{font-size:clamp(22px,3.6vw,40px)}
.pword{font-size:clamp(20px,2.6vw,30px)}
.marq .in{font-size:clamp(16px,2vw,26px);letter-spacing:-.01em}
.marq{padding:14px 0}
footer h3{font-size:clamp(30px,6vw,88px)}
footer .giant{font-size:clamp(48px,12vw,180px)}
.offer h3{font-size:clamp(22px,3vw,26px)}

/* nav + buttons + chips a touch smaller */
nav .logo{font-size:15px}
nav ul a{font-size:13px;padding:8px 14px}
.cartbtn{font-size:13px;padding:10px 16px}
.btn{font-size:13px;padding:12px 22px}
.mono,.eyebrow{font-size:11px}
.filters button{font-size:13px}

/* ---- calmer motion ---- */
/* reveals: short, small distance, no rotation */
.rv{transform:translateY(14px);transition-duration:.55s}
.rv.l{transform:translateX(-24px)}.rv.r{transform:translateX(24px)}.rv.z{transform:scale(.97)}
.words .w>span{transform:translateY(55%);transition-duration:.55s}
/* ambient loops off: floating sheets, spinning badges, morphing blobs, bobbing pins */
.hero .sheet,.blob,.badge,.dd,.rkpin .rkdot,.eyebrow::before{animation:none!important}
/* marquee: slow and gentle, no tilt */
.marq{transform:none;margin:0}
.marq .in{animation-duration:70s}
/* no extra cursor effects */
.cursor,.trail{display:none!important}
@media(max-width:600px){
  .hero h2{font-size:clamp(34px,11vw,52px)}
  .pagehead h1,.shophead h1,.abouthead h1{font-size:clamp(30px,9vw,44px)}
}

/* ---- smaller header areas ---- */
.pagehead,.shophead{padding:104px 24px 34px!important}
.abouthead{padding:104px 24px 44px!important;min-height:46vh!important}
.hero{min-height:84vh;padding-top:100px}
nav.top{top:10px;padding:5px 6px 5px 16px}
nav .logo img{width:30px;height:30px}
.shophead .float{display:none}
.hf{max-width:150px}
.ic:empty{display:none}

/* size picker inside a product card: wrapping chips, clear selected state */
.szs{display:flex;flex-wrap:wrap;gap:8px}
.szm{border:1.5px solid #10261B33;background:#fff;color:var(--ink);border-radius:10px;padding:8px 14px;font:600 13px 'Bricolage Grotesque',sans-serif;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.szm:hover{border-color:var(--ink)}
.szm.on{background:var(--ink);color:#fff;border-color:var(--ink)}

/* ---- headers: second reduction ---- */
.hero h2{font-size:clamp(26px,4vw,60px);line-height:1;letter-spacing:-.03em}
.pagehead h1,.shophead h1,.abouthead h1{font-size:clamp(24px,3.4vw,50px);line-height:1.05;letter-spacing:-.03em}
.mhead h2,.how h2,.road h2,.promise h2,.formats h3,.prods h3,.gallery h3,.bhead h3,.reviews h3,.featured h3,.findus h2,.gettinghere h2,.proc h3,.ctabox h2{font-size:clamp(20px,2.7vw,38px);line-height:1.1;letter-spacing:-.03em}
.text h2,.atrow h3,.jhead h2{font-size:clamp(20px,2.6vw,36px)}
.statement h3{font-size:clamp(18px,2.4vw,34px);line-height:1.2}
.art h1{font-size:clamp(22px,2.8vw,38px)}
footer h3{font-size:clamp(24px,4vw,56px)}
.hero{min-height:76vh}
@media(max-width:600px){.hero h2{font-size:clamp(24px,8vw,36px)}.pagehead h1,.shophead h1,.abouthead h1{font-size:clamp(22px,7vw,32px)}}