.gp{--paper: #F6F1E3;--ink: #2A3322;--ink-2: #4B5541;--ink-3: #676E5C;--leaf: #2F4B29;--serif: "Young Serif", Georgia, serif;--sans: "Figtree", system-ui, sans-serif;--hand: "Caveat", "Bradley Hand", cursive;--gutter: clamp(16px, 4vw, 48px);color-scheme:light;color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}.gp,.gp *{box-sizing:border-box}.gp{overflow-x:clip}body:has(.gp){background-color:#f6f1e3;background-image:var(--gp-fibres, none),var(--gp-grain, none);background-size:700px 700px,256px 256px}body:has(.gp) .site-header{position:absolute;top:0;left:0;right:0;z-index:6}.gp-meadow{position:relative;height:290vh}.gp-stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}.gp-land,.gp-grass{position:absolute;left:0;width:100%;display:block}.gp-land{top:0;height:100%}.gp-grass{bottom:0;height:58%;touch-action:pan-y}.gp-intro{position:absolute;z-index:2;left:var(--gutter);right:var(--gutter);top:clamp(92px,15vh,180px);max-width:64rem;margin:0 auto;text-align:center;transition:opacity .5s ease,transform .6s ease}.gp h1{margin:0;font:400 clamp(48px,8.4vw,116px)/1 var(--serif);letter-spacing:-.02em;color:var(--leaf);text-wrap:balance}.gp-lede{margin:20px auto 0;max-width:40em;font:400 clamp(19px,1.8vw,24px)/1.45 var(--sans);color:var(--ink);text-wrap:balance}.gp-caps{position:absolute;z-index:2;left:var(--gutter);right:var(--gutter);top:clamp(110px,20vh,220px);display:grid;justify-items:center;pointer-events:none}.gp-cap{grid-area:1 / 1;margin:0;max-width:28em;text-align:center;font:400 clamp(26px,3.4vw,46px)/1.18 var(--serif);letter-spacing:-.01em;color:var(--leaf);text-wrap:balance;opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .9s cubic-bezier(.2,.7,.2,1)}.gp-cap.on{opacity:1;transform:none}.gp-hint{position:absolute;z-index:2;left:50%;bottom:22px;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;font:500 12px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:#f6f1e3;text-shadow:0 1px 3px rgba(30,45,20,.5);transition:opacity .4s ease}.gp-hint svg{filter:drop-shadow(0 1px 2px rgba(30,45,20,.5));animation:gp-nudge 2.4s ease-in-out infinite}@keyframes gp-nudge{0%,to{transform:translateY(0)}50%{transform:translateY(5px)}}.gp-verge{display:block;width:100%;height:clamp(90px,15vh,170px);margin-bottom:calc(-1*clamp(30px,5vh,60px));pointer-events:none}.gp h2{margin:0 0 16px;font:400 clamp(36px,4.8vw,64px)/1.06 var(--serif);letter-spacing:-.015em;color:var(--leaf);text-wrap:balance}.gp h3{margin:0 0 12px;font:400 clamp(27px,2.7vw,36px)/1.14 var(--serif);letter-spacing:-.01em;color:var(--leaf)}.gp-head{position:relative;z-index:1;max-width:64rem;margin:0 auto clamp(48px,7vw,96px);text-align:center}.gp-head p{margin:0 auto;max-width:52em;font-size:clamp(17px,1.4vw,20px);line-height:1.6;color:var(--ink-2);text-wrap:pretty}.gp-how{position:relative;padding:clamp(24px,5vw,72px) var(--gutter) 0}.gp-steps{list-style:none;margin:0 auto;padding:0;max-width:1320px;display:grid;gap:clamp(72px,9vw,140px)}.gp-step{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,4vw,64px);align-items:center}.gp-step:nth-child(2n) .gp-art{order:2}.gp-text{position:relative;z-index:1}.gp-text p{margin:0;font-size:clamp(17px,1.35vw,19px);line-height:1.62;text-wrap:pretty}.gp-n{position:relative;isolation:isolate;display:inline-grid;place-items:center;width:54px;height:50px;margin:0 0 12px -6px;font:600 32px/1 var(--hand);color:var(--leaf)}.gp-n canvas{position:absolute;z-index:-1;left:-10px;top:-9px;width:74px;height:68px}.gp-art{position:relative;aspect-ratio:6 / 5}.gp-step.n1 .gp-art{aspect-ratio:1 / 1}.gp-step.n3 .gp-art{aspect-ratio:4 / 3}.gp-wash{position:absolute;z-index:0;left:-12%;top:-14%;width:124%;height:128%;pointer-events:none}.gp-photo{position:relative;z-index:1;margin:0;padding:8px 8px 0;background:#fffdf7;box-shadow:0 1px 2px #3a341e29,0 10px 28px -12px #3a341e66;transform:rotate(var(--r, 0deg));transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .5s ease;cursor:zoom-in}.gp-photo img{display:block;width:100%;height:auto;background:#e8e1cc}.gp-photo figcaption{padding:5px 4px 7px;text-align:center;font:600 21px/1.15 var(--hand);color:var(--ink-2)}.gp-photo:hover{transform:rotate(0) scale(1.02);box-shadow:0 2px 4px #3a341e29,0 18px 36px -14px #3a341e73;z-index:3}.gp-photo:before{content:"";position:absolute;z-index:2;top:-11px;left:50%;width:92px;height:24px;transform:translate(-50%) rotate(var(--t, -3deg));background:#d6e2ac9e;clip-path:polygon(2% 8%,7% 0,13% 9%,20% 1%,27% 7%,35% 0,43% 8%,51% 1%,58% 9%,66% 2%,74% 8%,81% 0,88% 7%,95% 1%,100% 10%,98% 92%,93% 100%,86% 91%,79% 99%,71% 92%,63% 100%,55% 93%,47% 100%,39% 92%,31% 100%,23% 93%,15% 100%,8% 92%,0 99%);pointer-events:none}.gp-photo.p1:before{--t: 4deg;background:#ecc6ce99}.gp-photo.p2:before{--t: -5deg;background:#c6d8e6a3}.gp-art .gp-photo{position:absolute}.gp-step.n1 .p0{left:21%;top:6%;width:58%;--r: -2deg}.gp-step.n2 .p0{left:3%;top:3%;width:50%;--r: -2.5deg}.gp-step.n2 .p1{left:47%;top:15%;width:49%;--r: 2deg}.gp-step.n3 .p0{left:0;top:10%;width:34%;--r: -3deg}.gp-step.n3 .p1{left:33%;top:0;width:34%;--r: 1.5deg}.gp-step.n3 .p2{left:66%;top:13%;width:34%;--r: -1deg}.gp.js .gp-step .gp-photo{opacity:0;translate:0 22px;transition:opacity .8s ease var(--d, 0s),translate 1s cubic-bezier(.2,.7,.2,1) var(--d, 0s),transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .5s ease}.gp-step .p1{--d: .15s}.gp-step .p2{--d: .3s}.gp.js .gp-step .gp-text{opacity:0;translate:0 16px;transition:opacity .8s ease .1s,translate 1s cubic-bezier(.2,.7,.2,1) .1s}.gp.js .gp-step.in .gp-photo,.gp.js .gp-step.in .gp-text{opacity:1;translate:0 0}.gp-bag{position:relative;max-width:1320px;margin:clamp(110px,15vw,210px) auto 0;padding:0 var(--gutter);display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(28px,5vw,84px);align-items:center}.gp-bagscene{position:relative;aspect-ratio:1 / 1;max-width:620px;width:100%;justify-self:center}.gp-mound,.gp-front{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.gp-cutout{position:absolute;left:50%;bottom:15.5%;height:68%;width:auto;transform:translate(-50%);filter:drop-shadow(0 2px 1px rgba(70,60,20,.12))}.gp.js .gp-cutout{opacity:0;translate:0 18px;transition:opacity .9s ease .6s,translate 1s cubic-bezier(.2,.7,.2,1) .6s}.gp.js .gp-bag.in .gp-cutout{opacity:1;translate:0 0}.gp-bag .gp-text p{color:var(--ink-2)}.gp-small{width:min(46%,220px);margin-top:28px;--r: 2deg}.gp-small figcaption{font-size:19px}.gp-paper{position:relative;max-width:1180px;margin:clamp(120px,16vw,220px) auto 0;padding:0 var(--gutter) clamp(90px,12vw,160px)}.gp-swatches{position:relative;max-width:1000px;margin:0 auto clamp(70px,10vw,130px);aspect-ratio:3 / 1.05}.gp-swatches .gp-wash{left:-6%;top:-18%;width:112%;height:136%}.gp-swatches .sw{position:absolute;z-index:1;height:auto;filter:drop-shadow(0 2px 2px rgba(60,50,20,.16)) drop-shadow(0 10px 18px rgba(60,50,20,.18));transition:opacity .9s ease var(--d, 0s),translate 1.1s cubic-bezier(.2,.7,.2,1) var(--d, 0s),transform .5s cubic-bezier(.2,.7,.2,1);transform:rotate(var(--r))}.gp-swatches .sw1{left:3%;top:12%;width:35%;--r: -4deg}.gp-swatches .sw2{left:32%;top:2%;width:36%;--r: 2.5deg;--d: .18s}.gp-swatches .sw3{left:62%;top:14%;width:35%;--r: -1.5deg;--d: .36s}.gp-swatches figcaption{position:absolute;z-index:1;left:0;right:0;bottom:-6%;text-align:center;font:600 23px/1.2 var(--hand);color:var(--ink-2)}.gp.js [data-settle] .sw,.gp.js .gp-hand>img{opacity:0;translate:0 26px}.gp.js [data-settle].in .sw,.gp.js .gp-hand.in>img{opacity:1;translate:0 0}.gp-hand{position:relative;max-width:460px;margin:0 auto clamp(24px,4vw,56px)}.gp-hand .gp-wash{left:-30%;top:-8%;width:160%;height:100%}.gp-hand>img{position:relative;z-index:1;display:block;width:100%;height:auto;-webkit-mask-image:linear-gradient(#000 64%,transparent 96%);mask-image:linear-gradient(#000 64%,transparent 96%);transition:opacity 1s ease .2s,translate 1.2s cubic-bezier(.2,.7,.2,1) .2s}.gp-label{position:absolute;z-index:2;margin:0;font:600 clamp(22px,2.2vw,27px)/1.1 var(--hand);color:var(--leaf);white-space:nowrap}.gp-label svg{width:70px;height:32px;fill:none;stroke:var(--leaf);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}.gp-label-l{right:88%;top:20%}.gp-label-r{left:90%;top:8%}.gp.js .gp-label{opacity:0;transition:opacity .8s ease 1.2s}.gp.js .gp-hand.in .gp-label{opacity:1}.gp-pair{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,4vw,56px);max-width:720px;margin:0 auto;align-items:start}.gp-pair .gp-photo:nth-child(1){--r: -2deg;margin-top:24px}.gp-pair .gp-photo:nth-child(2){--r: 1.5deg}.gp-pair .gp-photo:nth-child(2):before{--t: 3deg;background:#ecc6ce99}.gp-trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3.4vw,48px);align-items:start;max-width:1100px;margin:0 auto}.gp-trio .gp-photo:nth-child(1){--r: -2deg;margin-top:28px}.gp-trio .gp-photo:nth-child(2){--r: 1.5deg}.gp-trio .gp-photo:nth-child(2):before{--t: 3deg;background:#ecc6ce99}.gp-trio .gp-photo:nth-child(3){--r: -1deg;margin-top:44px}.gp-trio .gp-photo:nth-child(3):before{--t: -4deg;background:#c6d8e6a3}.gp-kept .gp-trio{align-items:center}.gp-kept .gp-photo{padding-bottom:8px}.gp .page-sky:before{content:"";position:absolute;inset:0;background-image:var(--gp-fibres, none),var(--gp-grain, none);background-size:700px 700px,256px 256px;pointer-events:none;-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 250vh),transparent calc(100% - 170vh));mask-image:linear-gradient(to bottom,#000 calc(100% - 250vh),transparent calc(100% - 170vh))}.gp-sky{position:relative;padding:clamp(40px,6vw,80px) var(--gutter) 0}.gp-sky h2,.gp-sky .gp-head p{color:inherit}.gp-sky .gp-head p{opacity:.82}.gp-kept{max-width:1180px;margin:0 auto}.gp-after{max-width:60rem;margin:clamp(110px,14vw,190px) auto 0;text-align:center}.gp-after p{margin:0 auto;font-size:clamp(17px,1.4vw,20px);line-height:1.6;text-wrap:pretty}.gp-link{margin-top:18px!important;font:500 16px/1 var(--sans)}.gp-link a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}.gp-next{max-width:1180px;margin:clamp(90px,12vw,150px) auto 0;padding:28px 0 0;border-top:1px solid currentColor;border-top-color:color-mix(in srgb,currentColor 18%,transparent);display:flex;justify-content:space-between;gap:16px;font:400 14px/1.4 IBM Plex Mono,ui-monospace,Menlo,monospace}.gp-next a{color:inherit;text-decoration:none}.gp-next a:hover{text-decoration:underline}html.gp-locked{overflow:hidden}.gp-zoom{position:fixed;inset:0;z-index:100;cursor:zoom-out}.gp-zoom[hidden]{display:none}.gp-zoom-bg{position:absolute;inset:0;background:#f6f1e3e6;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;transition:opacity .45s ease}.gp-zoom img{position:fixed;display:block;box-sizing:content-box;margin:-10px 0 0 -10px;border:10px solid #FFFDF7;background:#e8e1cc;box-shadow:0 2px 4px #3a341e29,0 30px 60px -20px #3a341e80;transform-origin:50% 50%;transition:transform .56s cubic-bezier(.2,.75,.2,1);will-change:transform}.gp-zoom p{position:fixed;left:0;right:0;margin:0;text-align:center;font:600 26px/1.2 Caveat,Bradley Hand,cursive;color:#4b5541;opacity:0;transition:opacity .35s ease}.gp-zoom button{position:fixed;top:16px;right:16px;padding:8px 12px;border:0;border-radius:4px;background:#fffdf7f2;box-shadow:0 1px 3px #3a341e33;font:500 13px/1 Figtree,system-ui,sans-serif;color:#2a3322;cursor:pointer;opacity:0;transition:opacity .35s ease}.gp-zoom.on .gp-zoom-bg,.gp-zoom.on button{opacity:1}.gp-zoom.on p{opacity:1;transition-delay:.3s}@media(prefers-reduced-motion:reduce){.gp-zoom img{transition:none}}@media(max-width:800px){.gp-step,.gp-step:nth-child(2n),.gp-bag{grid-template-columns:minmax(0,1fr);gap:34px}.gp-step:nth-child(2n) .gp-art{order:0}.gp-text{margin:0 auto}.gp-art,.gp-step.n1 .gp-art,.gp-step.n3 .gp-art{aspect-ratio:auto;display:grid;grid-template-columns:1fr 1fr;gap:26px 16px;align-items:start;padding:10px 4px 0}.gp-art .gp-photo{position:relative;left:auto!important;top:auto!important;width:auto!important}.gp-step.n1 .gp-photo{grid-column:1 / -1;justify-self:center;width:78%!important}.gp-step.n2 .p1{margin-top:30px}.gp-step.n3 .p2{grid-column:1 / -1;justify-self:center;width:56%!important}.gp-wash{left:-3%;top:-6%;width:106%;height:112%}.gp-hand .gp-wash{left:-8%;width:116%}.gp-small{margin-left:auto;margin-right:auto}.gp-photo figcaption{font-size:19px}.gp-trio{grid-template-columns:1fr 1fr;gap:26px 16px}.gp-swatches{aspect-ratio:1.6 / 1}.gp-swatches .sw1{left:0;top:4%;width:54%}.gp-swatches .sw2{left:44%;top:0;width:56%}.gp-swatches .sw3{left:20%;top:42%;width:56%}.gp-swatches{margin-bottom:150px}.gp-swatches figcaption{bottom:-14%}.gp-hand{max-width:300px;margin-top:0}.gp-label{font-size:21px}.gp-label svg{width:44px;height:22px}.gp-label-l{right:auto;left:-8%;top:-60px}.gp-label-l svg{transform:rotate(40deg)}.gp-label-r{left:auto;right:-6%;top:-30px}.gp-label-r svg{display:none}.gp-trio .gp-photo:nth-child(3){grid-column:1 / -1;justify-self:center;width:64%;margin-top:0}.gp-trio .gp-photo:nth-child(1){margin-top:0}}@media(prefers-reduced-motion:reduce){.gp-hint svg{animation:none}.gp.js .gp-step .gp-photo,.gp.js .gp-step .gp-text{translate:none;transition:opacity .4s ease}.gp-cap{transform:none}}
