@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Cormorant+Garamond:ital,wght@0,400;0,500;1,400;1,500&family=Kalnia:wght@400;500&family=Gaegu&family=Manrope:wght@400;500&family=Reddit+Sans:wght@400;500;600&display=swap');
:root{--paper:#f4f4ee;--ink:#233d2c;--green:#84944d;--blue:#7aaecb;--brown:#52371a;--rule:#233d2c33;--display:'DM Sans',sans-serif;--serif:'Cormorant Garamond',Georgia,serif;background:var(--paper);color:var(--ink);font-family:var(--display);font-synthesis:none;scroll-behavior:smooth}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}a:focus-visible,button:focus-visible{outline:2px solid currentColor;outline-offset:7px}img,svg{display:block;width:100%;max-width:100%}img{object-fit:cover}figure,h1,h2,h3,p{margin:0}h1,h2,h3{font-weight:400}em{font-family:var(--serif);font-weight:400;letter-spacing:-.055em}p{font-size:16px;line-height:1.6}.section{padding:100px 5% 110px}.project-meta,.section-label{display:flex;justify-content:space-between;gap:24px;font-size:12px;line-height:1.4;letter-spacing:.045em}.section-label{margin-bottom:70px}.project-meta{padding:25px 0;border-bottom:1px solid var(--rule)}.project-meta a:hover{opacity:.6}.cover{padding:0 5% 90px}.cover-title{position:relative;padding:20px 0 15px}.cover h1{font-size:clamp(70px,19.9vw,340px);font-weight:500;line-height:.95;letter-spacing:-.085em;margin-left:-.065em}.edition{position:absolute;right:0;bottom:23px;font-size:12px;line-height:1.7;text-align:right;background:var(--paper);padding:10px 0 0 10px}.cover-composition{position:relative;display:grid;grid-template-columns:1.3fr .7fr;grid-template-rows:auto auto;column-gap:7%;padding-top:15px}.cover-main{grid-column:1;grid-row:1/3;height:660px;overflow:hidden}.cover-main img{height:100%;object-position:50% 70%}.cover-composition h2{position:relative;z-index:1;font-size:clamp(40px,6.6vw,106px);line-height:.92;letter-spacing:-.06em;margin:20px 0 30px -22%;white-space:nowrap}.cover-composition h2 em{display:block;margin-top:8px}.cover-detail{grid-column:2;width:58%;height:240px;margin-top:10px;justify-self:end}.cover-detail img{height:100%;object-position:center}.cover-caption{grid-column:2;margin-top:35px}.cover-caption span{font-size:11px;letter-spacing:.04em}.cover-caption p{margin-top:14px;max-width:270px}.cover-main{grid-row:1/4}.concept{border-top:1px solid var(--rule)}.statement{display:grid;grid-template-columns:1.5fr .65fr;gap:9%;align-items:end}h2{font-size:clamp(48px,7.5vw,112px);letter-spacing:-.07em;line-height:.98}.statement-copy p+p{margin-top:18px}.statement-copy{padding-bottom:5px}.image-essay{display:grid;grid-template-columns:1.3fr .75fr;gap:8%;margin-top:75px;position:relative;padding-bottom:170px}.essay-land img{height:520px;object-position:center}.essay-tea{margin-top:190px}.essay-tea img{height:490px}.image-essay figcaption{margin-top:16px;font-size:12px}.essay-word{position:absolute;left:9%;bottom:25px;font-size:clamp(50px,8vw,125px);letter-spacing:-.065em;line-height:.85;pointer-events:none}.essay-word em{margin-left:60px;display:block}.illustration{background:#e8eadf;padding:90px 5%}.art-heading{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:65px}.art-heading p{max-width:280px;padding-bottom:8px}.art-panels{display:grid;grid-template-columns:1fr 1fr;gap:22px}.art-panel{padding:30px 30px 23px;display:flex;flex-direction:column;min-width:0}.farm-panel{background:#f6f4df}.cafe-panel{background:#d9e8e8}.art-number{font:italic 45px var(--serif)}.mood-art{height:420px;display:flex;align-items:center}.mood-art svg{height:100%;overflow:visible}.art-panel figcaption{display:flex;justify-content:space-between;gap:15px;border-top:1px solid var(--rule);padding-top:20px;font-size:12px}.line-study{display:grid;grid-template-columns:1fr 1fr 1fr;gap:25px;margin-top:90px;align-items:center}.line-copy{padding-right:30px}.line-copy .section-label{display:block;margin-bottom:22px;font-size:11px}.line-copy h3{font-size:44px;line-height:1;letter-spacing:-.05em}.line-copy p{margin-top:22px;font-size:14px}.line-zoom{background:#f5f5ed;overflow:hidden}.line-zoom img{width:180%;max-width:none;margin-left:-35%;height:300px;object-fit:contain}.line-zoom figcaption{font-size:11px;padding:20px;border-top:1px solid var(--rule)}.object-heading{display:flex;justify-content:space-between;align-items:end;border-top:1px solid var(--rule);padding-top:30px;margin-top:80px}.object-heading h3{font:44px var(--serif);letter-spacing:-.04em}.object-heading>span{font-size:11px}.objects{display:grid;grid-template-columns:repeat(5,1fr);margin-top:35px}.objects figure{padding:25px 15%;border-right:1px solid var(--rule)}.objects figure:last-child{border:0}.objects img{height:120px;object-fit:contain;transition:transform .5s}.objects figure:hover img{transform:translateY(-8px)}.objects figcaption{font-size:11px;margin-top:25px;text-align:center}.colour-composition{display:grid;grid-template-columns:1fr 1fr;gap:0 8%;align-items:center}.colour-title h2{font-size:clamp(50px,6.5vw,100px)}.colour-title p{margin-top:30px;max-width:320px}.colour-photo{height:510px}.colour-photo img{height:100%;object-position:50% 20%}.swatches{grid-column:1/-1;display:grid;grid-template-columns:1.7fr 1fr 1.25fr;margin-top:35px}.swatches>div{background:var(--swatch);height:140px;display:flex;align-items:end;justify-content:space-between;gap:10px;padding:20px;color:white;font-size:11px}.swatches>div:first-child{color:#162511}.swatches>div:last-child{color:#163441}.type-spread{display:grid;grid-template-columns:.8fr 1.4fr .4fr;gap:35px;align-items:center;margin-top:90px;padding:50px 0 0;border-top:1px solid var(--rule)}.type-label>span{font-size:11px}.type-label p{font-size:14px;margin-top:20px}.brand-specimen{font:clamp(44px,5.8vw,85px)/1 'Kalnia',serif;color:#658299}.type-spread>img{height:140px;object-fit:contain}.motion{background:#243e30;color:#eef0df;padding-bottom:85px}.motion .section-title{display:flex;justify-content:space-between;gap:50px;align-items:end;margin-bottom:55px}.motion h2{font-size:clamp(50px,7vw,105px)}.motion .section-title p{color:#c3cebd}.motion-toolbar{display:flex;justify-content:space-between;align-items:center;font-size:12px;margin-bottom:20px}.motion-toolbar button{padding:12px 0;background:none;border:0;border-bottom:1px solid #b0bfac;border-radius:0;font-size:14px;min-width:135px;text-align:left}.motion-toolbar button:hover{color:#b5c588}.stage{display:grid;grid-template-columns:1.2fr .8fr;gap:9%;background:#edf0e5;color:var(--ink);padding:45px 60px 85px;align-items:center;position:relative;min-height:500px}.stage-art{height:370px;display:flex;align-items:center;justify-content:center}.stage-art>img{height:100%;object-fit:cover}.stage-art>svg{height:100%;overflow:visible}.stage-copy>span:first-child{font-size:12px}.stage-copy h3{font:400 clamp(38px,4.5vw,66px)/1 var(--serif);letter-spacing:-.04em;margin:22px 0}.stage-copy p{max-width:270px;font-size:15px}.stage-copy .hand{font:20px 'Kalnia';display:block;margin-top:25px}.traveler{position:absolute;width:58px;bottom:0;left:4%;transition:left 2.5s ease-in-out}.traveler svg{height:85px}.founder-seated,.founder-sip{display:none}.traveler.walking .founder-leg{transform-box:fill-box;transform-origin:top;animation:stride .5s ease-in-out infinite alternate}.traveler.walking .back{animation-delay:-.5s}.stops{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #9ba991;margin-top:15px}.stops button{text-align:left;padding:20px 8px;border:0;border-top:3px solid transparent;background:none;font-size:14px;min-height:73px}.stops button span{margin-right:10px;font-size:11px;color:#acbba1}.stops button[aria-pressed=true]{border-color:#d8e4bc}.stops small{display:block;font-size:10px;margin-top:7px;padding-left:27px;letter-spacing:.1em;color:#c2cdb5}.motion-caption{font-size:12px;color:#bdcbb4;margin-top:25px}.final-art{position:relative;min-height:820px;isolation:isolate;background:#ced9be;overflow:hidden}.final-photo{position:absolute;inset:0;z-index:-2;overflow:hidden}.final-photo img{height:100%;width:120%;max-width:none;margin-left:-10%;object-fit:cover;transform:scale(1.12)}.final-art::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#162c2399,transparent 90%);z-index:-1}.final-overlay{padding:70px 5%;color:#f5f4e7}.final-overlay>span{font-size:12px}.final-overlay>h2{font-size:clamp(65px,10vw,150px);margin-top:60px;line-height:.9}.final-note{background:#edf0df;color:var(--ink);width:310px;padding:20px 30px 25px;margin:20px 0 0 auto}.shop-art svg{height:180px}.final-note p{font-size:14px;margin-top:10px;text-align:center}footer{padding:28px 5%;display:flex;justify-content:space-between;gap:20px;font-size:11px;letter-spacing:.035em}.skip{position:absolute;top:-100px;background:white;padding:20px;z-index:10}.skip:focus{top:0}section[id]{scroll-margin-top:25px}.jd-tree,.ts-canopy{transform-box:fill-box;transform-origin:bottom;animation:sway 5s ease-in-out infinite alternate}.jd-cafe-curtain,.ts-curtain{transform-box:fill-box;transform-origin:top;animation:sway 4s ease-in-out infinite alternate}.ts-steam{animation:steam 4s ease-in-out infinite}.jd-cow-tail{transform-box:fill-box;transform-origin:top;animation:sway 3s ease-in-out infinite alternate}[data-paused=true] *{animation-play-state:paused!important}.is-paused .stage *{animation-play-state:paused!important}@keyframes sway{from{transform:rotate(-2deg)}to{transform:rotate(2deg)}}@keyframes steam{0%,100%{opacity:.35;transform:translateY(2px)}50%{opacity:1;transform:translateY(-3px)}}@keyframes stride{from{transform:rotate(-14deg)}to{transform:rotate(14deg)}}
@media(min-width:1700px){body{max-width:1900px;margin:auto}.cover h1{font-size:340px}}@media(max-width:1050px){.edition{bottom:14px;font-size:10px}.cover-main{height:560px}.cover-detail{height:180px;width:75%}.cover-caption p{font-size:14px}.cover-composition h2{margin-left:-30%}.statement{gap:5%;grid-template-columns:1.3fr .8fr}.essay-land img{height:420px}.essay-tea img{height:370px}.mood-art{height:300px}.art-panel{padding:25px 20px}.art-panel figcaption{flex-direction:column;gap:8px}.line-study{grid-template-columns:1fr 1fr}.line-copy{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:0 30px}.line-copy .section-label{grid-column:1/-1}.line-copy p{margin:0}.colour-photo{height:400px}.stage{padding:35px 30px 75px;gap:5%}.stage-art{height:310px}.type-spread{grid-template-columns:.9fr 1.4fr .3fr;gap:20px}.final-art{min-height:760px}}
@media(max-width:650px){.project-meta{font-size:9px;gap:10px;padding:20px 0;align-items:center}.cover{padding:0 5% 55px}.cover-title{padding:25px 0 20px}.cover h1{font-size:20vw}.edition{display:none}.cover-composition{grid-template-columns:1.35fr .65fr;gap:0 6%;padding-top:0}.cover-main{grid-column:1/-1;grid-row:2;height:390px;margin-top:24px}.cover-composition h2{grid-column:1/-1;grid-row:1;font-size:14vw;white-space:normal;margin:0;line-height:.9}.cover-composition h2 br{display:none}.cover-composition h2 em{display:block;margin-left:12%}.cover-detail{grid-column:2;grid-row:3;height:155px;width:100%;margin-top:25px}.cover-caption{grid-column:1;grid-row:3;margin-top:30px}.cover-caption span{font-size:9px}.cover-caption p{font-size:13px}.section{padding:65px 5%}.section-label{font-size:10px;margin-bottom:40px;gap:20px}.section-label>span:last-child{text-align:right}.statement{grid-template-columns:1fr;gap:30px}h2{font-size:13vw}.statement-copy{max-width:320px;margin-left:12%}.statement-copy p{font-size:15px}.image-essay{margin-top:40px;gap:6%;grid-template-columns:1.1fr .8fr;padding-bottom:95px}.essay-land img{height:290px}.essay-tea{margin-top:130px}.essay-tea img{height:240px}.image-essay figcaption{font-size:10px;line-height:1.5}.essay-word{left:0;font-size:15vw;bottom:0}.essay-word em{margin-left:25px}.illustration{padding:65px 5%}.art-heading{display:block;margin-bottom:35px}.art-heading p{margin-top:25px;font-size:15px}.art-panels{grid-template-columns:1fr;gap:18px}.mood-art{height:330px}.art-number{font-size:35px}.art-panel figcaption{flex-direction:row;font-size:10px;line-height:1.4}.line-study{gap:15px;margin-top:55px}.line-copy{display:block;padding:0}.line-copy h3{font-size:42px}.line-copy p{margin:22px 0;max-width:330px;font-size:14px}.line-zoom img{height:220px;width:220%;margin-left:-55%}.line-zoom figcaption{font-size:9px;padding:14px 10px}.object-heading{margin-top:45px;gap:15px}.object-heading h3{font-size:34px}.object-heading>span{max-width:100px;font-size:9px;line-height:1.5}.objects{margin-top:20px}.objects figure{padding:10px 15%}.objects img{height:70px}.colour-composition{grid-template-columns:1fr;gap:30px}.colour-title h2{font-size:14vw}.colour-title p{font-size:15px}.colour-photo{height:390px;width:82%;justify-self:end}.swatches{margin-top:0;grid-template-columns:1.2fr 1fr 1fr}.swatches>div{padding:12px;flex-direction:column;align-items:start;justify-content:space-between;height:130px;font-size:9px}.type-spread{grid-template-columns:1fr .25fr;margin-top:50px;gap:30px}.type-label{grid-column:1/-1}.type-label>span{font-size:10px}.type-label p{margin-top:12px}.brand-specimen{font-size:52px}.type-spread>img{height:90px}.motion .section-title{display:block;margin-bottom:30px}.motion h2{font-size:14vw}.motion .section-title p{margin-top:25px;font-size:15px}.stage{padding:25px 22px 75px;grid-template-columns:1fr;gap:30px;min-height:600px}.stage-art{height:260px}.stage-copy h3{font-size:43px;margin:15px 0}.stage-copy p{max-width:none}.stage-copy .hand{margin-top:16px}.stops{grid-template-columns:1fr 1fr}.stops button{font-size:12px;min-height:67px}.motion-caption{font-size:11px;line-height:1.7}.final-art{min-height:730px}.final-overlay{padding:45px 5%}.final-overlay>h2{font-size:19vw;margin-top:40px}.final-note{width:240px;margin-top:80px;padding:15px 20px 20px}.shop-art svg{height:150px}.final-note p{font-size:13px}.final-photo img{object-position:40% center}footer{font-size:9px;line-height:1.6}footer>span{max-width:210px}footer>a{white-space:nowrap}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
/* Concept cover, field notes and the primary tea-shop illustration. */
.concept-cover{margin-top:18px}.concept-cover>img{width:100%;height:auto;object-fit:contain}.concept-cover figcaption{display:flex;justify-content:space-between;gap:20px;font-size:12px;margin-top:19px}.cover{padding-bottom:65px}.field-layout{position:relative;display:grid;grid-template-columns:.65fr 1fr .65fr;grid-template-rows:150px 260px 190px;gap:25px 5%;margin:75px 0 95px;align-items:center}.field-layout img{height:100%;object-fit:cover}.field-layout figure{height:100%;position:relative}.field-layout figcaption{font:22px/1 'Kalnia',serif;margin-top:12px}.field-shop{grid-column:2;grid-row:1/3;padding-top:25px}.field-shop img{border-radius:39% 34% 25% 19% / 9% 8% 13% 12%;object-position:50% 65%}.field-cups{grid-column:3;grid-row:1;height:190px!important;width:85%;justify-self:end;transform:rotate(5deg)}.field-cups img{border-radius:43% 57% 48% 52% / 42% 40% 60% 58%;object-position:50% 55%}.field-town{grid-column:1;grid-row:3;height:180px!important;transform:rotate(-5deg)}.field-town img{border-radius:47% 38% 43% 33% / 40% 42% 39% 49%}.field-copy{grid-column:3;grid-row:2/4;align-self:center;padding-top:45px}.field-copy>span{font-size:11px}.field-copy h3{font:36px/1.15 var(--serif);margin:24px 0}.field-copy p{font-size:14px;max-width:210px}.vertical-note{writing-mode:vertical-rl;grid-column:1;grid-row:1/3;font:28px/1.6 var(--serif);letter-spacing:.35em;justify-self:center;align-self:center}.research-board{border-top:1px solid var(--rule);padding-top:65px;display:grid;grid-template-columns:.7fr 1.3fr;gap:7%;align-items:center}.research-board .section-label{font-size:11px;margin-bottom:30px}.research-board h3{font-size:clamp(38px,4.6vw,68px);line-height:1;letter-spacing:-.055em}.research-board p{font-size:15px;margin-top:25px;max-width:290px}.research-board img{height:auto}.research-board figcaption{display:flex;justify-content:space-between;font-size:11px;gap:15px;margin-top:15px}.research-board a{display:block;transition:opacity .3s}.research-board a:hover{opacity:.85}.annotation-study{background:#f0f0e8}.annotation-heading h2{font-size:clamp(48px,6.5vw,96px)}.annotated-photos{display:grid;grid-template-columns:1fr 1fr;gap:8%;margin:95px 9% 0 16%}.annotated-photos figure{position:relative;min-width:0}.annotated-whisk{margin-top:70px}.real-photo{height:100%;aspect-ratio:2/3}.annotation-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.hand-label{position:absolute;font:26px/1.05 'Kalnia',serif;z-index:2}.cups-label{left:3%;top:-66px;transform:rotate(-7deg)}.drawn-object{position:absolute;object-fit:contain;filter:brightness(0) invert(1);pointer-events:none}.drawn-cup{width:24%;height:22%;right:3%;top:10%;transform:rotate(8deg)}.drawn-label{left:-26%;bottom:8%;max-width:170px;transform:rotate(-8deg);color:var(--ink)}.whisk-label{left:8%;top:-46px;transform:rotate(4deg)}.drawn-pot{width:28%;height:24%;right:10%;bottom:8%;transform:rotate(-8deg)}.pot-label{bottom:-66px;right:0;transform:rotate(6deg)}.annotation-caption{margin:105px 9% 0 auto;max-width:440px;font:14px/1.7 var(--display)}.main-shop{display:grid;grid-template-columns:.55fr 1.45fr;gap:2% 5%;align-items:center;margin:20px auto 60px;max-width:1250px}.main-shop-caption>span{font-size:11px}.main-shop-caption h3{font-size:clamp(35px,4vw,58px);line-height:1;letter-spacing:-.04em;margin:25px 0}.main-shop-caption p{font-size:15px;max-width:240px}.main-shop>.shop-art{width:100%;height:auto}.main-shop>.shop-art svg{height:auto;max-height:620px}.main-shop>figcaption{grid-column:2;font-size:11px;text-align:center;margin-top:10px}.supporting-heading{display:flex;align-items:center;justify-content:space-between;gap:25px;border-top:1px solid var(--rule);padding-top:22px;max-width:790px;margin:0 auto;font-size:11px}.supporting-heading button{background:none;border:0;border-bottom:1px solid var(--ink);padding:10px 0;font-size:13px}.art-panels{max-width:790px;margin:22px auto 0;gap:26px}.art-panel{padding:20px 20px 17px;background:transparent}.art-number{font-size:26px}.art-panel .mood-art{height:225px}.art-panel figcaption{font-size:11px;flex-direction:column;gap:6px;padding-top:13px}.draw-study{width:100%;height:100%}.draw-study>svg{width:100%;height:100%;overflow:visible}.draw-study *{animation:none!important}.draw-study svg [data-weight]{stroke-width:var(--stroke-weight,1.5)}.object-heading{margin-top:55px}
@media(max-width:900px){.field-layout{grid-template-columns:.5fr 1fr .75fr;gap:20px 4%}.field-copy h3{font-size:30px}.field-layout figcaption{font-size:19px}.annotated-photos{margin-left:9%;margin-right:3%;gap:7%}.hand-label{font-size:22px}.drawn-label{left:-16%;max-width:120px}.main-shop{grid-template-columns:.6fr 1.4fr}.art-panel .mood-art{height:210px}}
@media(max-width:650px){.concept-cover figcaption{font-size:9px;line-height:1.5}.concept-cover figcaption>span{max-width:48%}.cover{padding-bottom:40px}.field-layout{grid-template-columns:1fr 1fr;grid-template-rows:220px 160px auto;gap:35px 20px;margin:50px 0 65px}.vertical-note{position:absolute;right:10px;top:160px;grid-area:auto;font-size:22px}.field-shop{grid-column:1;grid-row:1/3;padding-top:0}.field-cups{grid-column:2;grid-row:1;height:145px!important;width:95%;align-self:start}.field-town{grid-column:2;grid-row:2;height:130px!important;align-self:end}.field-layout figcaption{font-size:17px}.field-copy{grid-column:1/-1;grid-row:3;padding-top:25px;display:grid;grid-template-columns:1fr 1fr;gap:15px 25px}.field-copy>span{grid-column:1/-1;font-size:10px}.field-copy h3{font-size:29px;margin:0}.field-copy p{font-size:13px;align-self:center}.research-board{grid-template-columns:1fr;padding-top:45px;gap:30px}.research-board h3{font-size:44px}.research-board .section-label{margin-bottom:20px}.research-board p{max-width:330px}.research-board figcaption{font-size:9px}.annotation-study .section-label>span{max-width:48%;font-size:9px}.annotated-photos{margin:70px 0 0;gap:22px}.annotated-whisk{margin-top:45px}.hand-label{font-size:18px}.cups-label{top:-47px;left:0}.whisk-label{top:-38px;left:0}.drawn-label{left:0;bottom:-55px;font-size:17px;max-width:130px}.pot-label{bottom:-55px;font-size:18px}.annotation-caption{margin:100px 0 0 12%;font-size:13px}.main-shop{grid-template-columns:1fr;gap:25px;margin-bottom:45px}.main-shop-caption{max-width:300px}.main-shop-caption h3{font-size:43px;margin:20px 0}.main-shop>figcaption{grid-column:1;font-size:9px;line-height:1.6}.main-shop>.shop-art svg{max-height:400px}.supporting-heading{gap:15px;font-size:9px}.supporting-heading>span{max-width:130px}.supporting-heading button{font-size:11px}.art-panels{grid-template-columns:1fr 1fr;gap:14px}.art-panel{padding:10px 0}.art-panel .mood-art{height:150px}.art-number{font-size:23px}.art-panel figcaption{font-size:9px;line-height:1.5}.art-panel figcaption>span{max-width:100%}}
/* A smaller editorial cover and fine pen notes. */
.cover-editorial{display:grid;grid-template-columns:1.5fr .8fr;gap:28px 8%;position:relative;margin-top:30px}.cover-intro{grid-column:1/-1;display:flex;justify-content:space-between;align-items:end;gap:35px}.cover-intro h2{font-size:clamp(40px,5.5vw,82px)}.cover-intro p{font-size:14px;max-width:250px}.cover-editorial .concept-cover{margin:10px 0 0;align-self:start}.cover-window{overflow:hidden;aspect-ratio:1.5}.cover-window img{height:100%;object-fit:cover;animation:cover-drift 14s ease-in-out infinite alternate;transform-origin:50% 65%}.cover-editorial figcaption{font-size:10px;line-height:1.5;margin-top:13px;display:block}.cover-companion{margin-top:100px}.cover-companion>img{width:100%;aspect-ratio:1;object-fit:cover}.cover-endnote{font-size:clamp(35px,5vw,70px);letter-spacing:-.06em;line-height:.9;margin:0 0 10px 12%;grid-column:1}.cover-endnote em{display:block;margin-left:25px}.cover-editorial>button{grid-column:2;justify-self:start;align-self:start;background:none;border:0;border-bottom:1px solid var(--rule);font-size:11px;padding:8px 0}.cover-editorial.motion-off .cover-window img{animation-play-state:paused}.cover-title{padding-bottom:0}.cover h1{font-size:clamp(70px,14vw,220px)}.cover-editorial{animation:cover-arrive 900ms ease-out both}@keyframes cover-drift{from{transform:scale(1)}to{transform:scale(1.035) translateY(-.4%)}}@keyframes cover-arrive{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
.field-layout .field-town{grid-column:2;grid-row:1/3;height:100%!important;width:100%;padding-top:25px;transform:none}.field-layout .field-town img{border-radius:39% 34% 25% 19% / 9% 8% 13% 12%;object-position:50% 50%}.field-layout .field-shop{grid-column:1;grid-row:3;height:200px!important;padding:0;transform:rotate(-4deg)}.field-layout .field-shop img{border-radius:47% 38% 43% 33% / 40% 42% 39% 49%;object-position:50% 65%}
.notes-spread{position:relative;display:grid;grid-template-columns:.65fr 1fr 1fr;gap:0 20px;max-width:1000px;margin:80px auto 0;padding-top:100px}.margin-notes{position:relative}.written{font:25px/1.1 'Kalnia',serif;letter-spacing:.015em}.note-one{position:absolute;top:-85px;right:-85px;transform:rotate(-9deg);text-align:center}.note-two{position:absolute;top:47%;left:0;transform:rotate(-8deg)}.note-photo img{height:420px;object-fit:cover}.note-photo:first-of-type img{object-position:50% 60%}.note-photo figcaption{text-align:right;margin-top:20px;transform:rotate(-5deg)}.note-matcha figcaption{margin-right:18px;transform:rotate(4deg)}.pen-notes{position:absolute;top:0;left:0;width:100%;height:auto;pointer-events:none;color:#26342a}.notes-copy{grid-column:2/4;margin:65px 0 0;font:14px/1.7 'Manrope',sans-serif;max-width:390px}.annotation-study .annotation-heading h2{font-size:clamp(42px,5vw,72px)}.main-shop{max-width:880px;grid-template-columns:.8fr 1fr;gap:25px 50px}.main-shop>.shop-art{max-width:440px;justify-self:center}.main-shop>.shop-art svg{max-height:390px}.main-shop-caption h3{font-size:42px}.main-shop>figcaption{font-size:10px}.art-heading h2{font-size:clamp(45px,5.5vw,82px)}
@media(max-width:900px){.note-photo img{height:330px}.notes-spread{padding-top:80px}.written{font-size:22px}.note-two{font-size:20px}.notes-copy{margin-top:45px}.main-shop{gap:25px}.cover-companion{margin-top:65px}}
@media(max-width:650px){.cover h1{font-size:19vw}.cover-editorial{grid-template-columns:1.4fr .8fr;gap:22px 5%;margin-top:22px}.cover-intro{display:block}.cover-intro h2{font-size:11.5vw}.cover-intro p{font-size:13px;margin-top:20px}.cover-editorial .concept-cover{grid-column:1/-1}.cover-companion{grid-column:2;margin-top:0;grid-row:3}.cover-endnote{grid-row:3;font-size:11vw;margin:15px 0}.cover-editorial>button{font-size:10px}.field-layout .field-town{grid-column:1;grid-row:1/3;padding-top:0;height:100%!important}.field-layout .field-shop{grid-column:2;grid-row:2;height:135px!important}.notes-spread{grid-template-columns:.45fr 1fr 1fr;gap:10px;margin-top:45px;padding-top:65px}.note-photo img{height:210px}.written{font-size:17px}.note-one{right:-60px;top:-54px}.note-two{font-size:15px;left:-3px;top:39%;width:70px}.note-photo figcaption{font-size:17px;margin-top:12px}.notes-copy{font-size:11px;margin-top:35px}.pen-notes{top:10px}.main-shop{grid-template-columns:1fr}.main-shop>.shop-art{max-width:290px}.main-shop>.shop-art svg{max-height:280px}.main-shop>figcaption{grid-column:1}.main-shop-caption h3{font-size:38px}.main-shop-caption{max-width:300px}}
@media(prefers-reduced-motion:reduce){.cover-editorial,.cover-window img{animation:none!important}}
.product-preview{background:#e2e7de}.product-heading{display:flex;justify-content:space-between;align-items:end;gap:35px;margin-bottom:60px}.product-heading h2{font-size:clamp(42px,6vw,88px)}.product-heading p{font-size:15px}.ipad-wrap{max-width:990px;margin:auto;padding:12px}.ipad-device{position:relative;background:#20221f;padding:23px;border:2px solid #797d76;border-radius:39px;box-shadow:0 3px 0 #c1c4bc inset,0 30px 55px -28px #18251770}.ipad-camera{position:absolute;left:50%;top:8px;width:6px;height:6px;margin-left:-3px;background:#070c0e;border:1px solid #41494a;border-radius:50%}.ipad-screen{position:relative;aspect-ratio:4/3;overflow:hidden;border-radius:17px;background:#fff;isolation:isolate}.ipad-screen iframe{position:absolute;left:0;top:0;width:1024px;height:768px;border:0;transform:scale(var(--ipad-scale,1));transform-origin:top left;pointer-events:none;background:white}.product-controls{max-width:966px;margin:30px auto 0;display:flex;justify-content:space-between;align-items:center;gap:25px;font-size:12px}.product-controls>div{display:flex;gap:24px;align-items:center}.product-controls button,.product-controls a{border:0;border-bottom:1px solid #233d2c55;background:none;padding:10px 0;font:12px var(--display);min-height:40px}.product-controls button:hover,.product-controls a:hover{color:#657934}#product-status{color:#52634e}@media(max-width:650px){.product-heading{display:block;margin-bottom:30px}.product-heading p{margin-top:25px}.ipad-wrap{padding:0}.ipad-device{border-radius:22px;padding:13px;border-width:1px}.ipad-camera{top:4px;width:4px;height:4px}.ipad-screen{border-radius:10px}.product-controls{flex-direction:column;align-items:start;gap:8px;margin-top:20px}.product-controls>div{gap:20px;flex-wrap:wrap}.product-controls button,.product-controls a{font-size:11px}}
/* Compact device presentation with a soft grounding shadow. */
.ipad-wrap{max-width:750px;position:relative;isolation:isolate;padding:12px 12px 28px}.ipad-wrap::after{content:'';position:absolute;z-index:-1;bottom:5px;left:9%;width:82%;height:35px;border-radius:50%;background:#17251d42;filter:blur(19px);transform:scaleY(.7)}.ipad-device{box-shadow:0 2px 0 #c1c4bc inset,0 15px 25px -18px #17251d99,0 35px 45px -35px #17251d66}.product-controls{max-width:726px;margin-top:15px}@media(max-width:650px){.ipad-wrap{max-width:440px;padding:0 8px 22px}.ipad-wrap::after{bottom:3px;height:22px;filter:blur(13px)}.product-controls{max-width:424px}}
/* Process-led narrative and type specimen. */
.origin-story{display:grid;grid-template-columns:1.2fr .8fr;gap:30px 8%}.origin-story>.section-label{grid-column:1/-1;margin:0}.origin-story h2{font-size:clamp(42px,5.7vw,82px)}.origin-copy p+p{margin-top:18px}.origin-copy em{font:italic 22px var(--serif)}.origin-route{grid-column:1/-1;list-style:none;display:grid;grid-template-columns:repeat(4,1fr);padding:25px 0 0;margin:20px 0 0;border-top:1px solid var(--rule);gap:20px}.origin-route li{font-size:13px;color:#5c6957}.origin-route span{display:block;font-size:17px;color:var(--ink);margin-bottom:9px}.decision-map{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;margin-top:70px}.decision-map>.section-label{grid-column:1/-1;margin:0}.decision-map article{border-top:1px solid var(--rule);padding-top:20px}.decision-map article>span{font-size:11px}.decision-map h3{font:36px/1.05 var(--serif);margin:22px 0}.decision-map p{font-size:14px;max-width:290px}.decision-map small{display:block;font-size:10px;line-height:1.6;margin-top:24px;max-width:270px}.reference-lessons{padding:0;list-style:none;font-size:15px;line-height:1.6}.reference-lessons li{margin-top:22px}.reference-lessons b{display:block;font-weight:500}.reference-result{display:grid;grid-template-columns:1.25fr .75fr;align-items:center;gap:6%;margin-top:55px}.reference-result img{max-width:560px}.reference-result p{font-size:16px;max-width:310px}.reference-result span{display:block;font-size:10px;margin-bottom:17px}.study-heading{display:flex;justify-content:space-between;gap:35px;align-items:end;margin:60px 0 30px}.study-heading h3{font-size:clamp(35px,4vw,55px);letter-spacing:-.05em;line-height:1}.study-heading p{font-size:12px;max-width:280px}.process-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.process-image{height:280px;background:#f9faf4;position:relative;display:flex;align-items:center;justify-content:center}.process-image>img{height:100%;object-fit:cover}.line-paper>img,.applied-cup>img{width:58%;height:auto;max-height:150px;object-fit:contain}.applied-cup{background:#84944d;flex-direction:column;gap:15px}.applied-cup>.written{position:static;color:#fffbe8;font-size:31px}.applied-cup>img{filter:brightness(0) invert(1);width:43%}.process-steps figcaption{font-size:13px;line-height:1.7;margin-top:20px}.process-steps b{display:block;font-size:11px;font-weight:500;margin-bottom:12px}.line-rules{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;border-top:1px solid var(--rule);padding-top:25px;margin-top:50px}.line-rules>.section-label{grid-column:1/-1;margin:0}.line-rules b{font:29px var(--serif)}.line-rules p{font-size:14px;margin-top:15px}.type-header{display:flex;justify-content:space-between;gap:30px;align-items:center;margin-bottom:60px}.type-header h2{font-size:36px;letter-spacing:-.055em}.type-header [role=tablist]{display:flex;gap:22px}.type-header button{border:0;border-bottom:1px solid transparent;background:none;padding:12px 4px;font-size:15px;color:#70786c}.type-header button[aria-selected=true]{color:var(--ink);border-color:var(--ink)}.font-banner{position:relative;border-top:1px dotted var(--rule);border-bottom:1px dotted var(--rule);padding:22px 0;margin-top:95px;display:flex;align-items:center;min-height:220px}.font-banner #font-name{font-size:clamp(85px,13.5vw,200px);line-height:1.15;letter-spacing:-.055em;max-width:75%}.weight-card{position:absolute;right:6%;top:-60px;background:#ffffffb3;border:1px solid white;border-radius:24px;padding:25px 30px;min-width:155px;box-shadow:0 17px 25px -24px #273e2820}.weight-card>span{display:block;font:32px var(--display);margin-bottom:23px}.weight-card #font-weights{font-size:24px}.weight-card small{font:11px var(--display);color:#74816d;margin-left:10px}.weight-card .medium{font-weight:500;margin-top:10px}.type-details{display:grid;grid-template-columns:1.25fr 1fr;gap:7%;margin-top:55px}.glyphs{display:grid;gap:35px;align-items:center}.glyphs>div{display:grid;grid-template-columns:.5fr 1fr;gap:20px}.glyphs span{font:14px var(--display)}.glyphs p{font-size:22px;overflow-wrap:anywhere;color:#69765e;line-height:1.7}.hierarchy-card{background:#ffffff8c;border-radius:23px;padding:20px 25px}.hierarchy-card>div{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:20px 0;border-bottom:1px dotted var(--rule)}.hierarchy-card>div:last-child{border:0}.hierarchy-card span{color:#87917f}.sample-head{font-size:35px}.sample-sub{font-size:25px}.sample-body{font-size:18px}#font-panel[data-font=gaegu] .font-banner,#font-panel[data-font=gaegu] .glyphs p,#font-panel[data-font=gaegu] .hierarchy-card{font-family:'Gaegu',cursive}#font-panel[data-font=manrope] .font-banner,#font-panel[data-font=manrope] .glyphs p,#font-panel[data-font=manrope] .hierarchy-card{font-family:'Manrope',sans-serif}#font-panel[data-font=manrope] #font-name{font-size:clamp(65px,10.4vw,155px)}.font-role{font-size:14px;max-width:600px;margin-top:30px}.system-colours{display:grid;grid-template-columns:1.2fr 1fr 1fr;margin-top:50px}.system-colours>div{background:var(--swatch);padding:25px;color:#fff;min-height:190px;display:flex;flex-direction:column;gap:15px}.system-colours>div:first-child{color:#172614}.system-colours>div:last-child{color:#173445}.system-colours span{font-size:11px}.system-colours strong{font-weight:400;font-size:24px}.system-colours p{font-size:13px;max-width:210px}.type-context{font-size:11px;line-height:1.6;margin-top:22px;color:#617057}.motion-principles{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;border-top:1px solid #ffffff30;padding-top:25px;margin-bottom:40px}.motion-principles span{font-size:11px;color:#ccdabf}.motion-principles p{font-size:14px;margin-top:12px;max-width:240px}.closing-note{padding:45px 5% 50px;text-align:center}.closing-note p{font:32px var(--serif)}.closing-note span{font-size:12px;display:block;margin-top:15px}.main-shop .ts-curtain{animation:quiet-curtain 11s ease-in-out infinite!important;transform-box:fill-box;transform-origin:top}.main-shop .ts-steam{animation:quiet-steam 9s ease-in-out infinite!important}.main-shop .ts-canopy{animation:quiet-branch 14s ease-in-out infinite!important}@keyframes quiet-curtain{0%,58%,100%{transform:rotate(0)}72%{transform:rotate(2deg)}86%{transform:rotate(-1deg)}}@keyframes quiet-steam{0%,48%,100%{opacity:0;transform:translateY(2px)}60%{opacity:.45}85%{opacity:0;transform:translateY(-9px)}}@keyframes quiet-branch{0%,65%,100%{transform:rotate(0)}82%{transform:rotate(1.2deg)}}
@media(max-width:800px){.origin-story{grid-template-columns:1fr}.decision-map{gap:22px}.decision-map h3{font-size:30px}.process-image{height:220px}.weight-card{right:0;min-width:130px;padding:22px}.type-details{grid-template-columns:1fr;gap:30px}.glyphs>div{grid-template-columns:.4fr 1fr}.font-banner #font-name{font-size:17vw}#font-panel[data-font=manrope] #font-name{font-size:12vw}.weight-card #font-weights{font-size:19px}.weight-card>span{font-size:25px}}
@media(max-width:650px){.origin-story h2{font-size:12vw}.origin-copy p{font-size:15px}.origin-route{grid-template-columns:1fr 1fr;gap:25px}.decision-map{grid-template-columns:1fr;margin-top:45px}.decision-map h3{font-size:34px}.decision-map h3 br{display:none}.decision-map small{margin-top:15px}.reference-result{grid-template-columns:1fr;gap:25px}.reference-result p{font-size:14px}.study-heading{display:block;margin-top:40px}.study-heading p{margin-top:22px;max-width:100%}.process-steps{grid-template-columns:1fr;gap:32px}.process-image{height:280px}.process-image>img{object-position:50% 55%}.line-paper>img{max-height:150px}.line-rules{grid-template-columns:1fr;gap:22px}.line-rules p{margin-top:7px}.type-header{align-items:start;flex-direction:column;gap:22px;margin-bottom:30px}.type-header h2{font-size:30px}.type-header button{font-size:14px}.font-banner{margin-top:20px;display:block;padding-top:100px;min-height:0}.weight-card{top:0;border-radius:15px;padding:12px 16px;min-width:120px}.weight-card>span{font-size:17px;margin-bottom:8px}.weight-card #font-weights{font-size:17px}.font-banner #font-name{font-size:25vw;max-width:100%}#font-panel[data-font=manrope] #font-name{font-size:19vw}.type-details{margin-top:30px}.glyphs p{font-size:20px}.glyphs>div{grid-template-columns:.35fr 1fr;gap:18px}.glyphs span{font-size:12px}.hierarchy-card{padding:10px 20px}.sample-head{font-size:29px}.sample-sub{font-size:21px}.sample-body{font-size:16px}.system-colours{grid-template-columns:1fr}.system-colours>div{min-height:130px;padding:22px}.system-colours p{max-width:none}.motion-principles{gap:20px;grid-template-columns:1fr}.motion-principles article{display:grid;grid-template-columns:.4fr 1fr;gap:20px}.motion-principles p{margin:0;font-size:13px}.closing-note p{font-size:28px}}
@media(prefers-reduced-motion:reduce){.main-shop .ts-curtain,.main-shop .ts-steam,.main-shop .ts-canopy{animation:none!important}.main-shop .ts-steam{opacity:.35}}
/* Review refinements: restrained annotations and clearer hierarchy. */
.research-board h3{font:400 clamp(23px,2.35vw,34px)/1.25 var(--display);letter-spacing:-.045em}.research-board h3>span{display:block;white-space:nowrap}.research-board h3>em{display:block;font-size:1.06em;margin-top:6px}.study-heading{margin:40px 0 24px;align-items:center;border-top:1px solid var(--rule);padding-top:22px}.study-heading h3{font:500 20px/1.3 var(--display);letter-spacing:-.02em}.study-heading p{max-width:320px;font-size:13px}.observation-row{max-width:690px;display:grid;grid-template-columns:240px 1fr;gap:35px;align-items:center}.observation-row img{height:235px;object-fit:cover;object-position:50% 55%}.observation-row>div>span{font-size:10px;letter-spacing:.06em}.observation-row p{font-size:14px;margin-top:15px}.notes-spread{max-width:740px;margin-top:65px;padding-top:75px}.note-photo img{height:310px}.written,.hand-label{font-family:'Kalnia',serif;font-size:17px;line-height:1.45;letter-spacing:-.025em}.note-one{top:-65px;right:-60px;font-size:16px}.note-two{font-size:15px;max-width:125px}.note-photo figcaption{font-size:16px}.notes-copy{font-size:12px;margin-top:40px}.field-layout figcaption{font-family:'Kalnia',serif;font-size:16px;line-height:1.4}.stage-copy .hand{font-family:'Kalnia',serif;font-size:16px}.ipad-device{padding:12px;border:1px solid #767b74;border-radius:29px;box-shadow:0 1px 0 #c1c4bc inset,0 15px 25px -18px #17251d99,0 35px 45px -35px #17251d66}.ipad-camera{top:4px;width:4px;height:4px;margin-left:-2px}.ipad-screen{border-radius:18px}@media(max-width:650px){.research-board h3{font-size:clamp(21px,6vw,28px)}.study-heading{display:block}.study-heading h3{font-size:19px}.study-heading p{margin-top:12px}.observation-row{grid-template-columns:1fr;gap:20px;max-width:340px}.observation-row img{height:235px}.notes-spread{padding-top:65px;gap:10px;margin-top:45px}.note-photo img{height:185px}.note-one{font-size:12px;right:-48px;top:-52px}.note-two{font-size:11px;width:65px}.note-photo figcaption{font-size:12px}.notes-copy{font-size:10px}.field-layout figcaption{font-size:13px}.ipad-device{padding:8px;border-radius:20px}.ipad-camera{top:2px;width:3px;height:3px}.ipad-screen{border-radius:12px}}

/* Restore the original editorial serif and italic emphasis. */
em{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:-.055em}.origin-copy em{font-style:italic}.art-number{font-style:italic}
/* Three independently moving fabric flags, hinged at their top edge. */
.main-shop .shop-art .ts-curtain{transform-box:fill-box;transform-origin:50% 0%;animation:shop-flag-sway 3.8s ease-in-out infinite!important}.main-shop .shop-art .ts-curtain-two{animation-duration:4.3s!important;animation-delay:-1.2s!important}.main-shop .shop-art .ts-curtain-three{animation-duration:4.7s!important;animation-delay:-2.4s!important}@keyframes shop-flag-sway{0%,100%{transform:rotate(-4deg) skewX(1deg)}50%{transform:rotate(5deg) skewX(-2deg)}}@media(prefers-reduced-motion:reduce){.main-shop .shop-art .ts-curtain{animation:none!important;transform:none}}
/* Editorial process evidence — details from supplied finished artwork. */
.project-scope{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;border-bottom:1px solid var(--rule);padding-bottom:24px;margin-bottom:65px;font-size:10px;line-height:1.8;letter-spacing:.04em}.project-scope b{font-size:13px;font-weight:400;letter-spacing:0}.research-board{max-width:940px;margin-left:auto;margin-right:auto}.research-board figure{max-width:480px;justify-self:end}.key-anatomy{margin-top:85px;padding-top:35px;border-top:1px solid var(--rule)}.detail-heading{display:grid;grid-template-columns:.65fr 1.2fr .8fr;gap:35px;align-items:start;margin-bottom:35px}.detail-heading>span{font-size:10px;letter-spacing:.06em}.detail-heading h3{font:400 clamp(29px,3.4vw,49px)/1.12 var(--display);letter-spacing:-.04em}.detail-heading p{font-size:12px;max-width:260px}.key-details{display:grid;grid-template-columns:1.25fr 1fr;gap:35px}.key-crop{height:290px;overflow:hidden;position:relative}.key-crop img{position:absolute;width:170%;max-width:none;height:auto;left:-35%;top:-105%}.crop-air img{width:135%;left:-17%;top:-8%}.key-details figcaption,.ink-details figcaption{padding-top:18px;max-width:390px}.key-details b,.ink-details b{font-size:13px;font-weight:500}.key-details p,.ink-details p{font-size:13px;margin-top:9px}.ink-details{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:65px;padding-top:35px;border-top:1px solid var(--rule)}.ink-details .detail-heading{grid-column:1/-1;margin-bottom:0}.ink-details figure>img{height:200px;object-fit:contain;background:#f4f4ee;padding:25px}.application-links{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;border-top:1px solid var(--rule);padding-top:25px;margin:35px 0 55px}.application-links span{font-size:10px;letter-spacing:.05em}.application-links h3{font-size:20px;line-height:1.3;letter-spacing:-.03em;margin:14px 0}.application-links p{font-size:13px;max-width:300px}.written,.hand-label,.field-layout figcaption,.stage-copy .hand{font-family:var(--serif);font-style:italic;letter-spacing:0}.annotation-heading h2{font-size:clamp(35px,4.4vw,62px)}.line-rules{margin-top:40px}.notes-spread{margin-top:35px}
@media(max-width:650px){.project-scope{grid-template-columns:1fr;gap:14px;margin-bottom:40px}.detail-heading{grid-template-columns:1fr;gap:15px}.detail-heading p{max-width:100%}.key-details,.ink-details,.application-links{grid-template-columns:1fr}.key-crop{height:240px}.crop-people img{top:-85%}.ink-details .detail-heading{grid-column:auto}.key-anatomy{margin-top:45px}.ink-details{margin-top:40px}.application-links{gap:25px}.research-board figure{max-width:100%}.key-details{gap:30px}}
.key-crop img{position:static;width:100%;height:100%;max-width:100%;object-fit:cover}.crop-people img{object-position:50% 100%;transform:scale(1.4);transform-origin:50% 100%}.crop-air img{object-position:50% 0%;transform:scale(1.2);transform-origin:50% 0%}
/* Interactive close reading of the finished cover. */
.visual-explorer{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(220px,.7fr);gap:5%;margin-top:40px}.explorer-image{aspect-ratio:1.5;overflow:hidden}.explorer-image img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.22,.61,.36,1)}.visual-explorer[data-focus="1"] img{transform:scale(1.8);transform-origin:48% 86%}.visual-explorer[data-focus="2"] img{transform:scale(1.5);transform-origin:52% 13%}.explorer-controls{display:grid}.explorer-controls button{background:none;border:0;border-top:1px solid var(--rule);padding:18px 0;text-align:left;font-size:12px;opacity:.5}.explorer-controls button[aria-pressed=true]{opacity:1}.explorer-controls button[aria-pressed=true]::after{content:' ↗'}.explorer-panel h4{font:400 32px/1.1 var(--serif);margin:30px 0 15px}.explorer-panel p{font-size:13px}.explorer-panel small{display:block;margin-top:25px;font-size:10px;opacity:.6}.cover-intro{animation:editorial-entry 1s both}.concept-cover{animation:editorial-entry 1.2s .15s both}.cover-companion{animation:editorial-entry 1.2s .3s both}@keyframes editorial-entry{from{opacity:0;translate:0 20px}to{opacity:1;translate:0 0}}@media(max-width:700px){.visual-explorer{grid-template-columns:1fr;gap:20px}.explorer-controls{grid-template-columns:repeat(3,1fr);gap:10px}.explorer-controls button{font-size:10px}.explorer-panel h4{margin-top:15px}.explorer-panel small{margin-top:15px}}@media(prefers-reduced-motion:reduce){.cover-intro,.concept-cover,.cover-companion{animation:none}.explorer-image img{transition:none}}
/* The supplied vector artwork remains intact; movement belongs to the small details. */
.layered-cover{position:relative;width:100%;height:100%;aspect-ratio:1920/1282;background:#7aaecb;isolation:isolate;overflow:hidden}.layered-cover .cover-layer{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transform:none!important;transition:opacity .65s ease;pointer-events:none;animation:none!important}.cover-window .layered-cover{height:auto}.cover-window .layer-steam{animation:cover-steam 7s ease-in-out infinite!important}.cover-window .layer-table{animation:cover-table 9s ease-in-out infinite!important}.cover-window .layer-marks{animation:cover-marks 11s ease-in-out infinite!important}.layered-cover .layer-photo{transition:opacity .7s ease;z-index:0}.layer-type{z-index:1}.layer-people,.layer-steam,.layer-table,.layer-marks{z-index:2}.motion-off .cover-layer,.cover-outside .cover-layer{animation-play-state:paused!important}@keyframes cover-steam{0%,40%,100%{opacity:.35;translate:0 0}65%{opacity:1;translate:0 -3px}85%{opacity:.15;translate:0 -6px}}@keyframes cover-table{0%,45%,100%{translate:0 0}70%{translate:0 -4px}}@keyframes cover-marks{0%,65%,100%{opacity:1}78%{opacity:.6}}
.explorer-image .layered-cover{height:100%}.explorer-image .layered-cover img{transform:none!important;transform-origin:center}.explorer-image{position:relative;aspect-ratio:1920/1282}.layer-stamp{position:absolute;bottom:16px;left:18px;font-size:8px;letter-spacing:.14em;color:white;text-shadow:0 1px 3px #233d2c}.eyebrow{font-size:9px;letter-spacing:.1em}.explorer-panel h4{font-size:clamp(28px,3.5vw,48px);margin:18px 0}.explorer-panel>p{font-size:12px}.layer-controls{margin-top:24px}.layer-controls button{display:flex;align-items:center;gap:18px;width:100%;padding:17px 0;background:none;border:0;border-top:1px solid var(--rule);font-size:13px;text-align:left}.layer-controls button>span{font-size:9px;opacity:.55}.layer-controls i{font-style:normal;margin-left:auto;font-size:18px}.layer-controls button[aria-pressed=false]{opacity:.5}.layer-controls button:hover{color:#658299}.layer-reset{background:none;border:0;border-bottom:1px solid var(--rule);padding:8px 0;font-size:11px;margin-top:16px}#layer-reading{font-size:12px;margin-top:22px;min-height:58px}.visual-explorer[data-photo=off] .layer-photo,.visual-explorer[data-type=off] .layer-type,.visual-explorer[data-drawing=off] .layer-people,.visual-explorer[data-drawing=off] .layer-steam,.visual-explorer[data-drawing=off] .layer-table,.visual-explorer[data-drawing=off] .layer-marks{opacity:0}.visual-explorer[data-photo=off] .layered-cover{background:#285334}
.chapter-nav{position:fixed;top:16px;left:50%;translate:-50% 0;display:flex;gap:26px;align-items:center;padding:15px 22px;background:#f4f4eef2;backdrop-filter:blur(12px);border:1px solid var(--rule);z-index:40;font-size:10px;transform:translateY(-90px);transition:transform .45s;overflow:hidden}.chapter-nav.visible{transform:translateY(0)}.chapter-nav a{white-space:nowrap;opacity:.55}.chapter-nav a[aria-current=true],.chapter-nav a:hover{opacity:1}.chapter-nav a:first-child{font-family:var(--serif);font-size:17px;opacity:1}.chapter-progress{position:absolute;bottom:0;left:0;width:100%;height:2px;background:var(--ink);transform:scaleX(var(--read,0));transform-origin:left}section[id]{scroll-margin-top:85px}
@media(max-width:700px){.chapter-nav{top:8px;gap:15px;padding:11px 16px;font-size:9px;max-width:95vw}.explorer-panel h4{font-size:36px}.layer-controls{display:flex;gap:12px}.layer-controls button{font-size:10px;gap:6px}.layer-controls button>span{display:none}.layer-stamp{font-size:7px;left:10px;bottom:10px}.layered-cover .cover-layer{object-fit:contain}}
@media(prefers-reduced-motion:reduce){.cover-window .cover-layer{animation:none!important}.layered-cover .cover-layer,.chapter-nav{transition:none}}
/* Shallow, hand-cut edges: nearly rectangular, without inflated oval corners. */
.field-layout .field-town img,.field-layout .field-shop img{border-radius:0;-webkit-mask-image:url('assets/soft-paper-frame.svg');mask-image:url('assets/soft-paper-frame.svg');-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.field-layout .field-shop{transform:none}.field-layout .field-town img{object-position:50% 55%}
/* Exhibition rhythm: one opening, one interactive centrepiece, one destination. */
.cover{padding-bottom:80px}.cover-title{padding:22px 0 0}.cover h1{font-size:clamp(80px,15.8vw,235px);line-height:.86;letter-spacing:-.085em}.edition{bottom:0;font-size:10px}.cover-editorial{grid-template-columns:.75fr 1.25fr;gap:35px 6%;margin-top:65px;align-items:start}.cover-intro{display:block;grid-column:1;grid-row:1;padding-top:35px}.cover-kicker{display:block;font-size:9px;letter-spacing:.13em;margin-bottom:30px}.cover-editorial .cover-intro h2{font-size:clamp(38px,4.65vw,70px);line-height:1.02;letter-spacing:-.055em}.cover-intro p{font-size:13px;max-width:210px;margin-top:25px}.cover-editorial .concept-cover{grid-column:2;grid-row:1/3;margin:0}.cover-window{aspect-ratio:1920/1282}.cover-editorial .cover-companion{grid-column:1;grid-row:2;width:42%;margin:0 0 0 32%;align-self:start}.cover-companion img{height:145px;width:100%;object-fit:cover}.cover-endnote{grid-column:2;grid-row:3;display:flex;align-items:center;gap:24px;margin:0;font-size:10px;letter-spacing:0}.cover-endnote>span:first-child{font-size:9px;letter-spacing:.12em}.cover-endnote em{font-size:28px;letter-spacing:-.025em}.cover-endnote>span:last-child{margin-left:auto;font-size:22px}.cover-editorial #cover-motion{position:static;grid-column:1;grid-row:3;justify-self:start;align-self:center;font-size:10px}.section-label{margin-bottom:45px}.project-scope{margin-bottom:50px}.origin-story h2{font-size:clamp(40px,5.5vw,78px)}.origin-copy p{font-size:14px}.decision-map{grid-template-columns:1fr;margin-top:50px;gap:0}.decision-map>.section-label{margin-bottom:18px}.decision-map article{display:grid;grid-template-columns:.5fr 1fr 1.2fr;gap:25px;align-items:start;border-top:1px solid var(--rule);padding:24px 0}.decision-map article>span{font-size:10px;line-height:1.7}.decision-map h3{font-size:28px;line-height:1.1;margin:0}.decision-map h3 br{display:none}.decision-map p{font-size:13px;max-width:350px}.decision-map small{grid-column:3;font-size:9px;margin:0;opacity:.6}.reference-disclosure{border-top:1px solid var(--rule);margin-top:45px}.reference-disclosure summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px;padding:24px 0;font-size:10px;letter-spacing:.04em}.reference-disclosure summary::-webkit-details-marker{display:none}.reference-disclosure .research-board{border:0;padding:30px 0 45px}.key-anatomy{margin:65px -5.56% -110px;padding:65px 5.56% 75px;background:#dce7e9;border:0}.key-anatomy .detail-heading{grid-template-columns:.55fr 1.2fr .65fr;align-items:start;gap:30px}.key-anatomy .detail-heading h3{font-size:clamp(40px,5.7vw,82px);line-height:.98;letter-spacing:-.055em}.key-anatomy .detail-heading>p{padding-top:8px}.visual-explorer{margin-top:50px;grid-template-columns:minmax(0,1.75fr) minmax(230px,.65fr);gap:6%;align-items:center}.explorer-panel h4{font-size:34px}.annotation-study{padding-top:85px;padding-bottom:75px}.annotation-heading h2{font-size:clamp(34px,4vw,56px)}.art-heading h2{font-size:clamp(44px,6vw,86px)}.main-shop-caption h3{font-size:clamp(33px,4.2vw,58px)}.main-shop-caption p{font-size:14px;max-width:250px}.ink-details{gap:24px}.ink-details .detail-heading h3{font-size:32px}.ink-details figure>img{height:165px}.type-context{max-width:600px}.product-preview{background:#e1e7dd}.product-heading h2{font-size:clamp(60px,9vw,128px);line-height:.92}.product-heading>p{font-size:13px;max-width:220px}.application-links{gap:30px;margin:35px 0 45px}.application-links h3{font-size:16px}.application-links p{font-size:12px}.closing-note{padding-top:55px;padding-bottom:60px}.closing-note p{font-size:clamp(28px,4vw,56px)}
@media(max-width:700px){.cover{padding-bottom:45px}.cover h1{font-size:19vw}.edition{font-size:8px}.cover-editorial{grid-template-columns:1fr .45fr;margin-top:35px;gap:25px}.cover-intro{grid-column:1/-1;grid-row:1;padding:0}.cover-kicker{margin-bottom:18px}.cover-editorial .cover-intro h2{font-size:11vw}.cover-intro p{max-width:100%;font-size:12px;margin-top:18px}.cover-editorial .concept-cover{grid-column:1/-1;grid-row:2}.cover-editorial .cover-companion{display:none}.cover-endnote{grid-column:1/-1;grid-row:3;gap:16px}.cover-endnote em{font-size:26px}.cover-editorial #cover-motion{grid-column:1/-1;grid-row:4}.decision-map article{grid-template-columns:.4fr 1fr;gap:15px}.decision-map h3{font-size:25px}.decision-map p,.decision-map small{grid-column:2}.key-anatomy{margin-top:35px;margin-bottom:-60px;padding-top:40px;padding-bottom:45px}.key-anatomy .detail-heading{grid-template-columns:1fr;gap:18px}.key-anatomy .detail-heading h3{font-size:12vw}.key-anatomy .detail-heading>p{padding:0;max-width:290px}.visual-explorer{grid-template-columns:1fr;gap:24px;margin-top:25px}.explorer-panel h4{font-size:30px}.annotation-study{padding-top:60px}.application-links{grid-template-columns:1fr;gap:20px}.application-links article{display:grid;grid-template-columns:.35fr 1fr;gap:8px 15px}.application-links h3{margin:0}.application-links p{grid-column:2}.product-heading h2{font-size:15vw}.ink-details .detail-heading h3{font-size:29px}}
/* Four-chapter editorial pass: the image leads, supporting text stays quiet. */
.cover h1{font-size:clamp(55px,9vw,140px);line-height:.95}.cover-editorial{margin-top:40px}.cover-intro{padding-top:22px}.cover-editorial .concept-cover{grid-row:1}.cover-endnote{grid-row:2}.cover-editorial #cover-motion{grid-row:2}.cover-intro p{max-width:280px;font-size:14px}.project-meta,.section-label{font-size:12px}.eyebrow,.cover-endnote>span:first-child,.project-scope,.detail-heading>span{font-size:11px}.origin-story{margin-bottom:25px}.field-layout{margin-top:45px}.field-copy h3{font-family:var(--display);font-size:30px;letter-spacing:-.04em}.key-anatomy{margin-bottom:-110px}.art-heading h2{font-size:clamp(40px,5.5vw,78px);line-height:1.05}.main-shop-caption h3{line-height:1.1}.build-scene{display:block;background:var(--ink);color:var(--paper);border:1px solid var(--ink);padding:13px 18px;margin:22px 0 8px;font-size:12px;transition:background .2s}.build-scene:hover{background:#3e5947}.build-scene:disabled{opacity:.65;cursor:wait}.layer-controls button{min-height:48px}.explorer-panel p,#layer-reading{font-size:14px}.layer-reset{font-size:12px}.cover-window .layer-table,.cover-window .layer-marks{animation:none!important}.product-heading{margin-bottom:45px}.motion .section-title h2{font-size:clamp(38px,5vw,72px)}.line-rules p,.ink-details p{font-size:14px}.type-context{font-size:12px}.chapter-nav{font-size:11px}.chapter-nav a{padding:5px 0}.reference-disclosure summary{font-size:12px}.layer-stamp{font-size:10px}.project-scope b{font-size:14px}
@media(max-width:700px){.cover h1{font-size:15vw}.cover-editorial{margin-top:25px}.cover-editorial .concept-cover{grid-row:2}.cover-endnote{grid-row:3}.cover-editorial #cover-motion{grid-row:4}.cover-intro{padding-top:0}.key-anatomy{margin-bottom:-60px}.chapter-nav{font-size:10px;gap:12px;padding:10px 12px}.cover-intro p{font-size:14px}.layer-controls{flex-direction:column;gap:0}.layer-controls button{font-size:13px}.layer-controls button>span{display:inline;font-size:11px}.layer-stamp{font-size:8px}.project-meta{font-size:10px}.product-heading{margin-bottom:30px}}
.ink-details figure>img{height:210px;padding:18px 35px;object-fit:contain}@media(max-width:700px){.ink-details figure>img{height:180px;padding:15px}}
/* Finer alignment, a quieter index and a purpose-built small-screen essay. */
.cover-editorial{grid-template-columns:.8fr 1.2fr;gap:30px 4%;align-items:center}.cover-intro{padding-top:0;align-self:center}.cover-editorial .cover-intro h2{font-size:clamp(40px,4.7vw,70px)}.cover-intro p{margin-top:25px;line-height:1.7}.cover-endnote{border-top:1px solid var(--rule);padding-top:18px}.build-scene{width:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:54px;font-size:14px;padding:15px 20px}.build-scene:focus-visible{outline-offset:5px}.chapter-nav a:first-child{font:inherit}.chapter-nav.scrolling-down{transform:translateY(-110px)}.chapter-nav:focus-within{transform:translateY(0)}.homepage-type-sample{background:#fff!important;padding:32px!important}.homepage-type-sample .sample-label{display:block;font:10px var(--display);letter-spacing:.08em;color:#617057}.homepage-type-sample .sample-brand{font:400 47px/1.1 'Gaegu',sans-serif;color:#7aaecb;margin:25px 0 8px;padding:0;border:0}.homepage-type-sample .sample-tagline{font:400 29px/1.15 'Gaegu',sans-serif;color:#84944d;padding:0;border:0}.homepage-type-sample .sample-navigation{display:flex;justify-content:space-between;gap:15px;font:400 13px 'Manrope',sans-serif;border-top:1px solid var(--rule);border-bottom:0;padding:22px 0 0;margin-top:30px}.homepage-type-sample .sample-navigation span{font:inherit;color:inherit}.sample-explanation{font:12px/1.6 var(--display);margin-top:25px;color:#617057}.stage-art{will-change:auto}
@media(max-width:700px){.cover-editorial{grid-template-columns:1fr;gap:24px}.cover-intro,.cover-editorial .concept-cover,.cover-endnote,.cover-editorial #cover-motion{grid-column:1}.cover-editorial .cover-intro h2{font-size:11vw}.field-layout{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto auto;gap:25px 18px;margin:45px 0}.field-layout .vertical-note{display:none}.field-layout .field-town{grid-column:1/-1;grid-row:1;height:auto!important;padding:0}.field-layout .field-town img{aspect-ratio:1.5;height:auto;object-fit:cover}.field-layout .field-shop{grid-column:1;grid-row:2;height:auto!important;align-self:start}.field-layout .field-shop img{aspect-ratio:1.2;height:auto}.field-layout .field-cups{grid-column:2;grid-row:2;height:auto!important;width:85%;align-self:start;transform:none}.field-layout .field-cups img{aspect-ratio:1;height:auto}.field-layout figcaption{font-size:15px;line-height:1.35;margin-top:9px}.field-copy{grid-column:1/-1;grid-row:3;padding-top:10px;gap:16px}.field-copy h3{font-size:27px}.field-copy p{font-size:13px}.homepage-type-sample{padding:25px!important}.homepage-type-sample .sample-brand{font-size:40px}.chapter-nav{font-size:10px}.build-scene{min-height:52px}}
.scene-steps{list-style:none;padding:0;margin:28px 0 0}.scene-steps li{display:flex;gap:22px;padding:18px 0;border-top:1px solid var(--rule);font-size:11px;opacity:.35;transition:opacity .65s}.scene-steps li span{font-size:14px}.scene-steps .is-present{opacity:1}.scene-steps .is-present::after{content:'•';margin-left:auto}.scene-pause{background:none;border:0;border-bottom:1px solid var(--rule);padding:10px 0;font-size:12px}.scene-pause[hidden]{display:none}@media(prefers-reduced-motion:reduce){.scene-steps li{transition:none}}
/* Opposed feet and arm swing, with a small weight shift on each step. */
.traveler{transition:left 3.2s linear}.traveler .founder-turn{transform-origin:55px 75px}.traveler.returning .founder-turn{transform:scaleX(-1)}.traveler.walking .founder-leg{transform-box:view-box;transform-origin:55px 116px;animation:journey-stride .64s ease-in-out infinite!important}.traveler.walking .founder-leg.back{animation-delay:-.32s!important}.traveler.walking .founder-arm{transform-box:view-box;transform-origin:46px 86px;animation:journey-arm .64s ease-in-out infinite}.traveler.walking .founder-body{animation:journey-weight .32s ease-in-out infinite}.motion.is-paused .traveler,.motion.is-paused .traveler *{animation-play-state:paused!important}.motion.is-paused .traveler{transition:none}@keyframes journey-stride{0%,100%{transform:rotate(-17deg)}50%{transform:rotate(17deg)}}@keyframes journey-arm{0%,100%{transform:rotate(9deg)}50%{transform:rotate(-10deg)}}@keyframes journey-weight{0%,100%{translate:0 0}50%{translate:0 -2px}}@media(prefers-reduced-motion:reduce){.traveler{transition:none!important}.traveler *{animation:none!important}}
/* Faster entry and compositor-based travel; a short rest remains between chapters. */
.traveler{left:4%!important;transition:transform 1.55s linear;will-change:transform}.traveler.walking .founder-leg{animation-duration:.44s!important}.traveler.walking .founder-leg.back{animation-delay:-.22s!important}.traveler.walking .founder-arm{animation-duration:.44s}.traveler.walking .founder-body{animation-duration:.22s}.colour-story{display:grid;grid-template-columns:.65fr 1fr 1fr;gap:35px;align-items:start;border-top:1px solid var(--rule);padding-top:32px;margin-top:55px}.colour-story>span{font-size:10px;line-height:1.6;letter-spacing:.06em}.colour-story h3{font-size:32px;font-weight:400;letter-spacing:-.035em;line-height:1.12}.colour-story p{font-size:14px;max-width:370px}.system-colours{margin-top:30px}.system-colours p{max-width:290px;font-size:14px;line-height:1.6}.system-colours>div{min-height:245px}@media(max-width:700px){.colour-story{grid-template-columns:1fr;gap:20px;margin-top:40px}.colour-story h3{font-size:32px}.system-colours>div{min-height:210px}.system-colours p{max-width:none}}@media(prefers-reduced-motion:reduce){.traveler{transition:none!important;will-change:auto}}

/* Shopping chapter: a calm, paced walk through the live tea store. */
.product-preview{background:#e2e7de;overflow:hidden}
.product-preview>.section-label{margin-bottom:46px}
.shop-intro{display:grid;grid-template-columns:1.2fr .8fr;gap:8%;align-items:end;margin-bottom:31px}
.shop-live{display:inline-block;margin-bottom:20px;font-size:10px;letter-spacing:.14em;color:#52634e}
.shop-intro h2{font-size:clamp(54px,8vw,118px);line-height:.91;letter-spacing:-.075em}
.shop-intro h2 em{color:#719bb0}
.shop-intro-note{max-width:420px;padding:0 0 7px}
.shop-intro-note>span{font:italic 21px var(--serif);color:#52634e}
.shop-intro-note p{font-size:14px;line-height:1.75;margin-top:15px;max-width:400px}
.shop-linkbar{max-width:1260px;margin:0 auto 34px;padding:13px 0;display:flex;justify-content:flex-end;align-items:center;gap:clamp(16px,3.2vw,48px);border-top:1px solid #233d2c35;border-bottom:1px solid #233d2c35;font-size:11px;letter-spacing:.035em}
.shop-linkbar a{min-height:34px;display:inline-flex;align-items:center;gap:7px;border-bottom:1px solid transparent;transition:color .2s,border-color .2s}
.shop-linkbar a:hover{color:#657934;border-color:#657934}
.shop-linkbar a span{color:#719bb0}
.shop-presentation{max-width:1260px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(290px,.85fr);gap:clamp(28px,5vw,72px);align-items:center}
.shop-frame{min-width:0;background:#f9faf5;border:1px solid #233d2c24;padding:12px 12px 0;box-shadow:0 24px 45px -38px #162c2399}
.shop-frame-top{height:35px;display:flex;justify-content:space-between;align-items:center;padding:0 3px;font-size:9px;letter-spacing:.14em;color:#52634e}
.shop-image-window{aspect-ratio:3/2;overflow:hidden;background:#fff;position:relative}
.shop-image-window img{width:100%;height:100%;object-fit:contain;transition:opacity .42s ease,transform .62s cubic-bezier(.22,.61,.36,1);will-change:opacity,transform}
.shop-presentation.is-transitioning .shop-image-window img{opacity:.08;transform:translateY(9px) scale(.99)}
.shop-frame figcaption{min-height:43px;display:flex;justify-content:space-between;align-items:center;gap:15px;padding:10px 3px;font-size:10px;letter-spacing:.1em;color:#52634e}
.shop-frame figcaption span:last-child{font:italic 16px var(--serif);letter-spacing:0;color:#233d2c}
.shop-story{min-width:0;padding:10px 0}
.shop-step-kicker{font-size:10px;letter-spacing:.14em;color:#657934}
.shop-story h3{font:400 clamp(32px,3.5vw,49px)/1.04 var(--serif);letter-spacing:-.04em;margin:20px 0 17px;max-width:410px}
.shop-story-copy p{font-size:14px;line-height:1.75;max-width:350px;color:#435744;min-height:75px}
.shop-step-nav{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:29px}
.shop-step-nav button{display:flex;align-items:flex-start;gap:10px;min-width:0;min-height:50px;padding:11px 9px;border:1px solid transparent;border-radius:2px;background:#ffffff42;text-align:left;font-size:11px;line-height:1.35;transition:border-color .2s,background-color .2s}
.shop-step-nav button span:first-child{font-size:9px;color:#719bb0;letter-spacing:.08em;padding-top:1px}
.shop-step-nav button span:last-child{overflow-wrap:anywhere}
.shop-step-nav button:hover{background:#f5f5ed;border-color:#233d2c42}
.shop-step-nav button[aria-pressed=true]{background:#f5f5ed;border-color:#233d2c91}
.shop-playback{display:flex;align-items:center;gap:16px;margin-top:18px}
.shop-playback button{flex:0 0 auto;border:0;border-bottom:1px solid #233d2c85;background:none;padding:10px 0;font-size:12px;min-height:42px}
.shop-playback button:hover{color:#657934}
.shop-playback button:disabled{opacity:.55;cursor:not-allowed}
.shop-playback span{max-width:220px;font-size:10px;line-height:1.55;color:#52634e}
.shop-linkbar-bottom{justify-content:flex-start;margin-top:42px;margin-bottom:0;padding:18px 0}
.shop-linkbar-note{margin-right:auto;font:italic 17px var(--serif);color:#52634e}
@media(max-width:850px){.shop-intro{grid-template-columns:1fr .75fr;gap:5%}.shop-presentation{grid-template-columns:minmax(0,1fr) minmax(255px,.82fr);gap:28px}.shop-step-nav button{padding:10px 7px}}
@media(max-width:650px){.product-preview>.section-label{margin-bottom:37px}.shop-intro{grid-template-columns:1fr;gap:22px;margin-bottom:28px}.shop-live{font-size:9px;margin-bottom:15px}.shop-intro h2{font-size:14vw;line-height:.94}.shop-intro-note{padding:0;margin-left:12%;max-width:360px}.shop-intro-note>span{font-size:19px}.shop-intro-note p{font-size:14px;margin-top:10px}.shop-linkbar{justify-content:flex-start;gap:12px 20px;flex-wrap:wrap;padding:12px 0;margin-bottom:26px;font-size:10px}.shop-linkbar a{min-height:34px}.shop-presentation{grid-template-columns:1fr;gap:25px}.shop-frame{padding:8px 8px 0}.shop-frame-top{height:30px;font-size:8px}.shop-frame figcaption{min-height:38px;font-size:8px}.shop-frame figcaption span:last-child{font-size:15px}.shop-story{padding:4px 0 0}.shop-story h3{font-size:39px;margin:15px 0 10px}.shop-story-copy p{max-width:400px;min-height:0}.shop-step-nav{margin-top:20px;gap:7px}.shop-step-nav button{min-height:47px;font-size:11px}.shop-playback{margin-top:13px}.shop-playback span{max-width:235px}.shop-linkbar-bottom{margin-top:30px;padding-top:15px}.shop-linkbar-note{flex-basis:100%;margin:0 0 2px;font-size:16px}}
@media(prefers-reduced-motion:reduce){.shop-image-window img,.shop-step-nav button,.shop-linkbar a{transition:none!important}.shop-presentation.is-transitioning .shop-image-window img{opacity:1;transform:none}}

/* Case-study hierarchy and responsive composition. */
@media(max-width:700px){.chapter-nav.obscures-content:not(:focus-within){transform:translateY(-120px);pointer-events:none}}
@media(max-width:700px){.chapter-nav{gap:8px;padding:10px 12px;font-size:8px}}
.project-meta{align-items:center;gap:24px}
.project-meta .project-label,.project-meta .project-scroll{white-space:nowrap}
.project-meta .project-scroll{flex-shrink:0}
@media(max-width:700px){.project-meta{font-size:10px;gap:10px;align-items:center}}
@media(max-width:420px){.project-meta{font-size:9px;gap:7px;letter-spacing:.025em}}
.cover-title{padding:18px 0 10px;text-align:center}
.cover-logo{position:relative;overflow:hidden;width:min(78vw,560px);aspect-ratio:1.28;margin:0 auto}
.cover-logo img{position:absolute;top:-12%;left:0;display:block;width:100%;height:auto;max-width:none}
.screen-reader-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.cover-intro-detail{max-width:320px}
.cover-intro-detail p{max-width:310px;line-height:1.7;color:#52634e}
.cover-live-url{display:inline-flex;align-items:center;min-height:38px;margin:12px 0 0;font-size:11px;letter-spacing:.035em;border-bottom:1px solid #233d2c55;text-underline-offset:4px}
.cover-live-url:hover{color:#657934;border-color:#657934}
.project-overview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px;margin:0 5% 42px;padding:14px 0 18px;border:0}
.project-overview>div+div{border:0;padding-left:0}
.project-overview h2{margin:0 0 11px;font:600 12px/1.35 var(--display);letter-spacing:.01em}
.project-overview p{margin:0;font-size:13px;line-height:1.55;color:#52634e}
.project-overview small{display:block;margin-top:8px;font-size:10px;line-height:1.6;color:#65745f}
.product-preview.section{padding:54px 5% 88px}
.shop-screen-action{display:flex;justify-content:flex-end;padding:0 3px 8px;font-size:10px;line-height:1.4}
.shop-screen-action a{display:inline-flex;align-items:center;min-height:36px;border-bottom:1px solid #233d2c55;text-underline-offset:3px}
.shop-screen-action a:hover{color:#657934;border-color:#657934}
.key-anatomy{max-width:1000px;margin:64px auto 0;padding-top:28px}
.key-anatomy .detail-heading{gap:24px;margin-bottom:26px}
.key-anatomy .visual-explorer{gap:4%;margin-top:28px}
.field-layout{max-width:760px;grid-template-rows:110px 185px 140px;gap:18px 4%;margin:55px auto 72px}.field-cups{height:150px!important}.field-town{height:140px!important}
.illustration .section-label,.illustration .art-heading{max-width:940px;margin-left:auto;margin-right:auto}
.illustration .art-heading{margin-bottom:48px}
.illustration .art-heading h2{font-size:clamp(40px,5vw,68px);line-height:.98;letter-spacing:-.055em}
.illustration .main-shop{max-width:850px;grid-template-columns:.8fr 1.2fr;gap:22px 38px;margin:10px auto 52px}
.illustration .main-shop>.shop-art{max-width:430px}
.illustration .main-shop>.shop-art svg{max-height:390px}
.illustration .main-shop-caption h3{font-size:clamp(36px,4vw,48px)}
.case-study-closing{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,8vw,110px);padding:70px 8% 82px;background:#f4f4ee}
.case-study-closing article{max-width:460px}
.case-study-closing article>span{font-size:10px;letter-spacing:.11em;color:#657934}
.case-study-closing h2{margin:17px 0 14px;font:400 clamp(30px,3.4vw,44px)/1.1 var(--serif);letter-spacing:-.025em}
.case-study-closing p{max-width:430px;font-size:13px;line-height:1.75;color:#52634e}
footer{justify-content:flex-end;align-items:center}
@media(max-width:700px){
 .project-overview{grid-template-columns:1fr;gap:17px;margin:0 5% 32px;padding:0}
 .project-overview>div+div{border:0;padding:0;margin:0}
 .product-preview.section{padding:42px 5% 65px}
 .cover-title{padding:14px 0 4px}
 .cover-logo{width:min(82vw,450px)}
 .cover-intro{align-items:flex-start;flex-direction:column;gap:14px}
 .cover-intro-detail{max-width:30em}
 .cover-intro-detail p{max-width:28em}
 .key-anatomy{margin:48px auto 0;padding-top:24px}
 .key-anatomy .detail-heading{grid-template-columns:1fr;gap:12px;margin-bottom:20px}
 .key-anatomy .visual-explorer{margin-top:22px}
 .field-layout{max-width:100%;grid-template-rows:220px 160px auto;gap:28px 16px;margin:42px auto 58px}
 .illustration .section-label,.illustration .art-heading{max-width:100%}
 .illustration .art-heading{margin-bottom:34px}
 .illustration .art-heading h2{font-size:clamp(36px,9vw,56px)}
 .illustration .main-shop{max-width:620px;grid-template-columns:1fr;gap:20px;margin:0 auto 42px}
 .illustration .main-shop>.shop-art{max-width:360px;justify-self:center}
 .illustration .main-shop>.shop-art svg{max-height:330px}
 .case-study-closing{grid-template-columns:1fr;gap:32px;padding:48px 7% 58px}
}
/* Keep the key-visual heading intentional at every breakpoint. */
.key-anatomy .detail-heading h3{font-size:clamp(34px,3.9vw,56px)}
@media(max-width:700px){.key-anatomy .detail-heading h3{font-size:clamp(30px,7vw,44px)}}

/* 2026-09-29: white editorial canvas and a tighter brand story. */
:root{--paper:#fff;background:#fff}
body,.cover,.concept,.product-preview,.illustration,.case-study-closing{background:#fff}
.chapter-nav{background:#fffffff2}
.cover-title{padding:0;height:0}
.cover-editorial{margin-top:22px}
.cover-intro .cover-logo{width:clamp(190px,22vw,300px);aspect-ratio:1.28;margin:0 0 20px;overflow:hidden}
.cover-intro .cover-logo img{top:-12%}
.cover-live-url{font-size:16px;line-height:1.2;min-height:31px;margin-top:14px;padding-bottom:2px;border-bottom:1px solid currentColor;text-underline-offset:2px}
.origin-route{border-top:0;padding-top:0}
/* The source collage returns to a spacious photograph-led composition. */
.field-layout{max-width:1120px;grid-template-columns:1fr 1.12fr .78fr;grid-template-rows:180px 250px 205px;gap:24px 28px;margin:72px auto 90px;align-items:stretch}
.field-layout figure{min-width:0;height:100%}
.field-layout .field-town{grid-column:1/3;grid-row:1/3;width:100%;height:100%!important;transform:none;padding:0}
.field-layout .field-cups{grid-column:3;grid-row:1;width:100%;height:100%!important;transform:rotate(3deg);align-self:start}
.field-layout .field-shop{grid-column:1;grid-row:3;width:100%;height:100%!important;transform:rotate(-2deg);padding:0;align-self:start}
.field-layout .field-town img,.field-layout .field-shop img,.field-layout .field-cups img{width:100%;height:calc(100% - 30px);aspect-ratio:auto;object-fit:cover}
.field-layout .field-cups img{border-radius:43% 57% 48% 52% / 42% 40% 60% 58%}
.field-layout .field-town img{border-radius:32% 21% 17% 12% / 9% 8% 11% 9%}
.field-layout .field-copy{grid-column:2/4;grid-row:3;align-self:center;padding:0 20px;display:block}
.field-layout .field-copy h3{font-size:clamp(31px,3.1vw,46px);margin:10px 0}
.field-layout .field-copy p{max-width:360px;font-size:14px;line-height:1.6}
.field-layout .vertical-note{display:block;position:absolute;right:2%;top:215px;font-size:22px;z-index:2;color:var(--ink)}
/* Keep the main illustration a focused moment after the larger collage. */
.illustration .main-shop{max-width:710px;grid-template-columns:.9fr 1.1fr;gap:20px 25px;margin:2px auto 46px}
.illustration .main-shop>.shop-art{max-width:320px}
.illustration .main-shop>.shop-art svg{max-height:295px}
.illustration .main-shop-caption h3{font-size:clamp(31px,3vw,40px)}
.illustration .main-shop-caption p{max-width:205px;font-size:13px;line-height:1.6}
/* The active font weight is annotated beside, not on top of, the specimen. */
.font-banner{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;padding:26px 0;min-height:0}
.font-banner #font-name{font-size:clamp(72px,12vw,180px);line-height:1;max-width:none;min-width:0}
.weight-card{position:static;flex:0 0 auto;min-width:0;padding:0 0 13px;margin:0;background:none;border:0;border-radius:0;box-shadow:none;text-align:right}
.weight-card span{display:block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;opacity:.72}
#font-weights{font-size:17px;line-height:1.4}
#font-weights small{font-size:13px}
#font-weights .medium{font-size:14px}
/* Original three-block palette; labels and usage notes remain readable. */
.system-colours{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;align-items:stretch;margin:34px 0 25px;padding:0}
.system-colours .palette-card{display:flex;flex-direction:column;justify-content:space-between;min-width:0;min-height:190px;padding:20px 22px 21px;background:var(--swatch);clip-path:none;border-radius:0;box-shadow:none;transform:none}
.palette-green,.palette-blue{color:#182a22!important}
.palette-brown{color:#fff9ef!important}
.palette-card-top{display:flex;justify-content:space-between;gap:12px;align-items:baseline;width:100%;font-size:10px;letter-spacing:.08em}
.palette-card-top strong{font-size:11px;font-weight:500}
.system-colours .palette-card p{margin:0;max-width:230px;font-size:13px;line-height:1.5;color:inherit}
/* The case-study's walkthrough and closing reflections share a readable sans voice. */
.shop-story h3,.case-study-closing h2{font-family:'Reddit Sans',sans-serif;font-style:normal;font-weight:500;letter-spacing:-.045em}
.shop-story h3{font-size:clamp(32px,3.5vw,46px)}
.case-study-closing h2{font-size:clamp(30px,3.4vw,43px)}
@media(max-width:700px){
 .cover-title{height:0;padding:0}
 .cover-editorial{margin-top:18px}
 .cover-intro .cover-logo{width:clamp(170px,42vw,240px);margin:0 0 15px}
 .cover-live-url{font-size:15px}
 .field-layout{max-width:100%;grid-template-columns:1fr 1fr;grid-template-rows:300px 180px auto;gap:30px 16px;margin:48px auto 70px}
 .field-layout .field-town{grid-column:1/-1;grid-row:1}
 .field-layout .field-shop{grid-column:1;grid-row:2}
 .field-layout .field-cups{grid-column:2;grid-row:2}
 .field-layout .field-copy{grid-column:1/-1;grid-row:3;padding:6px 0 0}
 .field-layout .field-copy h3{font-size:clamp(30px,6vw,40px)}
 .field-layout .vertical-note{right:5px;top:52px;font-size:19px}
 .illustration .main-shop{max-width:540px;grid-template-columns:1fr;gap:14px;margin:0 auto 35px}
 .illustration .main-shop>.shop-art{max-width:300px;justify-self:center}
 .illustration .main-shop>.shop-art svg{max-height:275px}
 .illustration .main-shop-caption h3{font-size:clamp(30px,7vw,39px)}
 .font-banner{display:flex;align-items:flex-end;gap:12px;padding:24px 0}
 .font-banner #font-name{font-size:clamp(67px,15vw,103px);max-width:none}
 .weight-card{padding:0 0 8px}
 #font-weights{font-size:13px}
 #font-weights small{font-size:11px}
 .system-colours{grid-template-columns:1fr;gap:0;padding:0}
 .system-colours .palette-card{min-height:122px;padding:17px 21px 18px}
 .shop-story h3{font-size:38px}
}
@media(max-width:420px){
 .field-layout{grid-template-rows:235px 145px auto;gap:27px 12px}
 .field-layout .field-copy h3{font-size:31px}
 .font-banner #font-name{font-size:64px}
 .weight-card span{font-size:9px}
 .system-colours .palette-card{min-height:122px}
}
/* Keep both cups inside the wide desktop crop. */
.field-layout .field-cups img{object-position:50% 43%}
@media(min-width:701px){
 .field-layout .field-cups{height:245px!important}
 .field-layout .field-cups img{object-position:50% 50%}
 .field-layout .vertical-note{top:285px}
}

/* Focused collage and control refinements, 2026-09-29. */
.cover-intro .cover-logo{width:clamp(130px,12vw,160px);margin-bottom:16px}
@media(min-width:701px){
 .field-layout{max-width:1120px;grid-template-columns:minmax(0,24fr) minmax(0,50fr) minmax(0,22fr);grid-template-rows:155px 245px 205px;gap:24px 24px;margin:68px auto 86px}
 .field-layout .field-town{grid-column:2;grid-row:1/3;height:100%!important;width:100%;padding:0;transform:none}
 .field-layout .field-cups{grid-column:3;grid-row:1;height:175px!important;width:100%;align-self:start;transform:rotate(3deg)}
 .field-layout .field-shop{grid-column:1;grid-row:2/4;height:205px!important;width:96%;align-self:end;transform:rotate(-3deg)}
 .field-layout .field-copy{grid-column:3;grid-row:3;align-self:center;padding:0 0 0 4px;display:block}
 .field-layout .field-copy h3{font-size:clamp(27px,2.5vw,36px);line-height:1.08}
 .field-layout .field-copy p{font-size:12px;line-height:1.5}
 .field-layout .vertical-note{right:22%;top:220px;font-size:20px}
 .field-layout .field-cups img{object-position:50% 50%}
}
@media(max-width:700px){.cover-intro .cover-logo{width:clamp(85px,24vw,115px);margin-bottom:13px}}
.shop-step-nav button,.shop-step-nav button[aria-pressed=true],.shop-step-nav button:hover{border-color:transparent;color:#fff}
.shop-step-nav button{background:#687a3d;border-radius:4px;box-shadow:none}
.shop-step-nav button span:first-child{color:#e2edca}
.shop-step-nav button:hover{background:#586c32}
.shop-step-nav button[aria-pressed=true]{background:#4e642d;box-shadow:none}
.shop-step-nav button:focus-visible{outline:3px solid #233d2c;outline-offset:3px}
@media(min-width:701px){.field-layout .field-shop{align-self:center}}
.cover-intro .cover-logo{width:clamp(120px,11vw,150px)}
@media(max-width:700px){.cover-intro .cover-logo{width:clamp(80px,22vw,105px)}}

/* Shopping hover keeps the filled surface without an edge accent. */
.shop-step-nav button[aria-pressed=true]:hover{background:#405524}

/* One stationary handset; only the captured screen changes. */
.mobile-glimpse{background:#f7f8f3;padding-top:75px;padding-bottom:78px}
.mobile-glimpse>.section-label{margin-bottom:42px}
.mobile-glimpse-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:clamp(35px,7vw,100px);align-items:center;max-width:1000px;margin:auto}
.mobile-glimpse-copy{max-width:510px}
.mobile-glimpse h2{font:500 clamp(40px,5vw,66px)/1.03 'Reddit Sans',sans-serif;letter-spacing:-.055em}
.mobile-glimpse-copy>p{font:400 15px/1.65 'Reddit Sans',sans-serif;max-width:455px;margin-top:23px;color:#435744}
.mobile-glimpse-copy .mobile-glimpse-note{font-size:12px;line-height:1.6;margin-top:25px;color:#647260}
.mobile-story{width:250px;max-width:100%;justify-self:center}
.mobile-phone{position:relative;width:100%;aspect-ratio:250/516;border:2px solid #aab0af;border-radius:39px;background:#1d1e1e;box-shadow:none;overflow:hidden}
.mobile-phone-viewport{position:absolute;inset:6px;overflow:hidden;border-radius:32px;background:#fff;contain:paint}
.mobile-phone-viewport img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center;transition:opacity .32s ease;opacity:1}
.mobile-story.is-swapping .mobile-phone-viewport img{opacity:.08}
.mobile-phone-status{position:absolute;z-index:2;top:0;left:0;right:0;height:27px;padding:7px 15px 0;background:#fff;display:flex;justify-content:space-between;align-items:flex-start;color:#141414;font:600 8px/1 Arial,sans-serif;letter-spacing:0}
.mobile-status-icons{display:flex;align-items:center;gap:4px;height:8px}
.mobile-signal{width:9px;height:6px;background:linear-gradient(to top,#111 0 100%) left bottom/2px 2px no-repeat,linear-gradient(to top,#111 0 100%) center bottom/2px 4px no-repeat,linear-gradient(to top,#111 0 100%) right bottom/2px 6px no-repeat}
.mobile-wifi{width:8px;height:6px;border-top:1.6px solid #111;border-radius:50%;position:relative}
.mobile-wifi::after{content:'';position:absolute;left:3px;bottom:0;width:2px;height:2px;border-radius:50%;background:#111}
.mobile-battery{width:11px;height:6px;border:1px solid #111;border-radius:1px;position:relative}
.mobile-battery::before{content:'';position:absolute;left:1px;top:1px;width:7px;height:2px;background:#111}
.mobile-battery::after{content:'';position:absolute;right:-3px;top:1px;width:1px;height:2px;background:#111}
.mobile-phone-home{position:absolute;z-index:2;bottom:5px;left:50%;width:78px;height:3px;border-radius:3px;background:#333;transform:translateX(-50%)}
.mobile-story-caption{display:flex;justify-content:space-between;gap:8px;margin-top:12px;font:500 9px/1.35 'Reddit Sans',sans-serif;letter-spacing:.08em;color:#5a6b56}
.mobile-story-label{font:500 12px/1.4 'Reddit Sans',sans-serif;color:#354c36;margin:5px 0 10px}
.mobile-phone-controls{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}
.mobile-phone-controls button{min-height:31px;border:1px solid #dbe3d1;border-radius:4px;background:#f4f6ef;color:#42523a;font:500 10px 'Reddit Sans',sans-serif}
.mobile-phone-controls button[aria-pressed=true]{background:#5f7441;color:#fff;border-color:#5f7441}
.mobile-phone-controls button:focus-visible{outline:2px solid #233d2c;outline-offset:2px}
@media(max-width:700px){.mobile-glimpse{padding-top:55px;padding-bottom:63px}.mobile-glimpse>.section-label{margin-bottom:25px}.mobile-glimpse-layout{grid-template-columns:1fr;gap:27px}.mobile-glimpse h2{font-size:clamp(37px,9vw,54px)}.mobile-glimpse-copy>p{font-size:14px;margin-top:16px}.mobile-glimpse-copy .mobile-glimpse-note{margin-top:15px}.mobile-story{width:min(250px,72vw)}}
@media(prefers-reduced-motion:reduce){.mobile-phone-viewport img{transition:none}.mobile-story.is-swapping .mobile-phone-viewport img{opacity:1}}

/* September case-study framing: a static editorial header, artwork-led hero, and one visual gallery. */
.site-header{position:relative;padding:0 5%;background:#fff;border-top:2px solid #52371a;z-index:2}
.site-header-main{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:88px}
.site-brand{display:inline-flex;align-items:center;gap:13px;min-width:0}
.site-brand-mark{display:block;width:50px;height:50px;flex:none;overflow:hidden}
.site-brand-mark img{width:100%;height:100%;object-fit:contain;transform:scale(1.42)}
.site-brand-copy{display:flex;flex-direction:column;gap:2px;font-family:'Reddit Sans',sans-serif;line-height:1.15}
.site-brand-copy strong{font-size:21px;font-weight:700;letter-spacing:-.03em}
.site-brand-copy small{font-size:11px;color:#6b7368;font-weight:500;letter-spacing:.03em}
.site-live-link{border:1px solid #285334;display:inline-flex;gap:20px;align-items:center;padding:14px 20px;font:600 14px/1 'Reddit Sans',sans-serif;white-space:nowrap;transition:background .2s,color .2s}
.site-live-link:hover{background:#285334;color:#fff}
.site-header .chapter-nav,.site-header .chapter-nav.visible,.site-header .chapter-nav.scrolling-down,.site-header .chapter-nav.obscures-content{position:static;top:auto;left:auto;translate:none;transform:none!important;display:flex;align-items:center;gap:clamp(20px,3.4vw,54px);width:100%;max-width:none;min-height:63px;margin:0;padding:0;overflow-x:auto;overflow-y:hidden;background:transparent;border:0;border-top:1px solid #e1e5dd;backdrop-filter:none;box-shadow:none;z-index:auto;transition:none;pointer-events:auto;scrollbar-width:none}
.site-header .chapter-nav::-webkit-scrollbar{display:none}
.site-header .chapter-nav a,.site-header .chapter-nav a:first-child{flex:none;white-space:nowrap;font:500 13px/1.2 'Reddit Sans',sans-serif;letter-spacing:0;padding:21px 0 19px;opacity:.76;border-bottom:2px solid transparent}
.site-header .chapter-nav a:hover,.site-header .chapter-nav a[aria-current=page]{opacity:1;border-bottom-color:#285334}
section[id]{scroll-margin-top:18px}
.cover{padding-top:34px}
.cover-title{height:0;padding:0}
.cover-editorial{margin-top:0;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:32px 5%;align-items:center}
.cover-intro{align-self:center;padding:0}
.cover-editorial .cover-intro h2{font:500 clamp(54px,5.5vw,84px)/.98 'Reddit Sans',sans-serif;letter-spacing:-.065em}
.cover-editorial .cover-intro h2 em{font:italic 500 1.02em/.98 var(--serif);letter-spacing:-.055em}
.cover-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 23px;margin-top:36px}
.cover-shop-button{display:inline-flex;align-items:center;justify-content:space-between;gap:22px;padding:17px 21px;background:#285334;color:#fff;font:600 14px/1.2 'Reddit Sans',sans-serif;white-space:nowrap;transition:background .2s}
.cover-shop-button:hover{background:#1e4129}
.cover-path-link{display:inline-flex;align-items:center;gap:14px;color:#285334;font:600 14px/1.2 'Reddit Sans',sans-serif;white-space:nowrap;border-bottom:1px solid transparent;padding:10px 0}
.cover-path-link:hover{border-bottom-color:currentColor}
.cover-scope{display:flex;gap:13px;align-items:flex-start;max-width:460px;margin-top:30px!important;font:400 14px/1.6 'Reddit Sans',sans-serif;color:#596655}
.cover-scope>span{color:#84944d;font-size:19px;line-height:1.2}
.cover-editorial .concept-cover{grid-column:2;grid-row:1/3}
.illustration{background:#fff}
.illustration .art-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:40px;margin-bottom:38px}
.illustration .art-heading h2{font:500 clamp(51px,5.7vw,90px)/.98 'Reddit Sans',sans-serif;letter-spacing:-.065em}
.illustration .art-heading h2 em{display:block;color:#84944d;font:italic 400 .98em/1.03 var(--serif);letter-spacing:-.055em}
.illustration .art-heading p{font:italic 400 clamp(17px,1.7vw,26px)/1.45 var(--serif);color:#666f61;max-width:330px;margin:6px 0 0;padding:0}
.illustration-gallery{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,.93fr);gap:22px;align-items:stretch}
.illustration .illustration-gallery .main-shop{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(190px,.75fr);grid-template-rows:1fr auto;gap:8px 24px;align-items:center;width:100%;max-width:none;min-height:530px;margin:0;padding:24px 28px 20px;background:#f0f2ec}
.illustration-gallery .main-shop>.shop-art{grid-column:1;grid-row:1;width:100%;max-width:none;min-width:0;align-self:center;justify-self:stretch}
.illustration-gallery .main-shop>.shop-art svg{width:100%;height:auto;max-height:450px}
.illustration-gallery .main-shop-caption{grid-column:2;grid-row:1;max-width:none;padding:0}
.illustration-gallery .main-shop-caption>span{font:700 10px/1.3 'Reddit Sans',sans-serif;letter-spacing:.12em;color:#657a43}
.illustration-gallery .main-shop-caption h3{font:500 clamp(25px,2.3vw,36px)/1.08 'Reddit Sans',sans-serif;letter-spacing:-.045em;margin:18px 0 13px}
.illustration-gallery .main-shop-caption p{font:400 13px/1.5 'Reddit Sans',sans-serif;max-width:220px}
.illustration-gallery .main-shop>figcaption{grid-column:1/-1;grid-row:2;padding:0;font:600 9px/1.3 'Reddit Sans',sans-serif;letter-spacing:.1em;color:#65745c}
.illustration-gallery .art-panels{display:grid;grid-template-columns:1fr;grid-template-rows:repeat(2,minmax(0,1fr));gap:22px;margin:0;min-width:0}
.illustration-gallery .art-panel{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(135px,.8fr);gap:14px;align-items:center;min-width:0;min-height:0;padding:17px 21px;background:#f1f0eb}
.illustration-gallery .farm-panel{background:#f1f0eb}
.illustration-gallery .cafe-panel{background:#f1f0eb}
.illustration-gallery .art-panel .mood-art{display:flex;align-items:center;width:100%;height:100%;min-height:0}
.illustration-gallery .art-panel .draw-study,.illustration-gallery .art-panel .draw-study svg{width:100%;height:auto;max-height:210px}
.illustration-gallery .art-panel figcaption{display:flex;flex-direction:column;gap:13px;border:0;padding:0;margin:0;min-width:0;color:#285334;text-align:left}
.illustration-gallery .art-panel figcaption span{font:700 10px/1.3 'Reddit Sans',sans-serif;letter-spacing:.1em;color:#657a43}
.illustration-gallery .art-panel figcaption strong{font:500 clamp(18px,1.6vw,24px)/1.2 'Reddit Sans',sans-serif;letter-spacing:-.025em}
.illustration-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:18px 0 58px;color:#6d7769;font:600 11px/1.4 'Reddit Sans',sans-serif;letter-spacing:.07em}
.illustration-footer p{font:400 12px/1.5 'Reddit Sans',sans-serif;letter-spacing:0}
.illustration-footer button{border:0;background:none;border-bottom:1px solid #839078;padding:5px 0;color:#285334;font:600 11px 'Reddit Sans',sans-serif;white-space:nowrap}
.case-study-closing{display:block;padding:78px 5% 25px;background:#fff}
.closing-heading{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr);gap:45px;align-items:end;margin-bottom:54px}
.closing-heading>div>span{display:block;color:#657a43;font:700 11px/1.4 'Reddit Sans',sans-serif;letter-spacing:.12em;margin-bottom:22px}
.closing-heading h2{margin:0;font:500 clamp(59px,7vw,112px)/.95 'Reddit Sans',sans-serif;letter-spacing:-.07em}
.closing-heading h2 em{font:italic 400 1.03em/.95 var(--serif);letter-spacing:-.065em}
.closing-heading p{font:400 16px/1.6 'Reddit Sans',sans-serif;color:#606b5d;max-width:420px;padding-bottom:8px}
.closing-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.closing-cards article{display:flex;flex-direction:column;max-width:none;min-height:320px;padding:30px 30px 34px}
.closing-cards article>span{display:flex;justify-content:space-between;font:700 10px/1.4 'Reddit Sans',sans-serif;letter-spacing:.11em;color:#65705d}
.closing-cards article h3{font:600 clamp(22px,2.1vw,32px)/1.18 'Reddit Sans',sans-serif;letter-spacing:-.045em;margin:24px 0 15px}
.closing-cards article p{font:400 13px/1.65 'Reddit Sans',sans-serif;color:#5e695b}
.closing-cards article a{align-self:start;margin-top:auto;padding-top:30px;font:600 13px/1.4 'Reddit Sans',sans-serif;border-bottom:1px solid currentColor}
.closing-shipped{background:#285334;color:#fff}
.closing-cards .closing-shipped>span,.closing-cards .closing-shipped p{color:#f0f5e9}
.closing-principle{background:#e9efe4}
.closing-next{background:#f2e9df}
.closing-footer{display:grid;grid-template-columns:1fr 1.5fr 44px;align-items:center;gap:20px;margin-top:64px;padding:30px 0;border-top:1px solid #dee5da;border-bottom:1px solid #dee5da}
.closing-footer>span{font:700 11px 'Reddit Sans',sans-serif;letter-spacing:.12em}
.closing-footer em{text-align:center;font:italic 400 clamp(21px,2.4vw,34px)/1.2 var(--serif);color:#285334}
.closing-footer a{width:44px;height:44px;display:grid;place-items:center;border:1px solid #d8ded5;font:500 25px/1 'Reddit Sans',sans-serif}
.closing-meta{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:23px 0 0;color:#6c7668;font:600 10px/1.4 'Reddit Sans',sans-serif;letter-spacing:.03em}
.closing-meta a{color:#285334}
@media(max-width:900px){.illustration-gallery{grid-template-columns:1fr}.illustration .illustration-gallery .main-shop{min-height:0}.illustration-gallery .art-panels{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto}.illustration-gallery .art-panel{grid-template-columns:1fr;min-height:220px}.illustration-gallery .art-panel .mood-art{max-height:150px}.closing-cards article{padding:24px;min-height:340px}.closing-cards article h3{font-size:22px}}
@media(max-width:700px){.site-header{padding:0 5%}.site-header-main{min-height:75px}.site-brand-mark{width:42px;height:42px}.site-brand-copy strong{font-size:17px}.site-brand-copy small{font-size:9px}.site-live-link{padding:11px 12px;gap:8px;font-size:11px}.site-header .chapter-nav,.site-header .chapter-nav.visible,.site-header .chapter-nav.scrolling-down,.site-header .chapter-nav.obscures-content{gap:24px;min-height:52px}.site-header .chapter-nav a,.site-header .chapter-nav a:first-child{font-size:11px;padding:17px 0 15px}.cover{padding-top:24px}.cover-editorial{grid-template-columns:1fr;gap:28px}.cover-editorial .cover-intro h2{font-size:clamp(48px,12vw,76px)}.cover-actions{margin-top:26px;gap:10px 20px}.cover-shop-button{padding:15px 17px;font-size:13px}.cover-path-link{font-size:13px}.cover-scope{margin-top:19px!important;font-size:13px}.cover-editorial .concept-cover{grid-column:1;grid-row:2}.illustration .art-heading{display:block;margin-bottom:28px}.illustration .art-heading h2{font-size:clamp(44px,10vw,64px)}.illustration .art-heading p{font-size:20px;margin-top:18px}.illustration-gallery{gap:14px}.illustration-gallery .art-panels{gap:14px}.illustration-footer{flex-wrap:wrap;margin-bottom:42px}.illustration-footer p{order:3;flex-basis:100%}.closing-heading{grid-template-columns:1fr;gap:18px;margin-bottom:32px}.closing-heading h2{font-size:clamp(51px,11vw,75px)}.closing-heading p{font-size:14px}.closing-cards{grid-template-columns:1fr;gap:12px}.closing-cards article{min-height:0;padding:24px}.closing-cards article h3{font-size:27px;margin:17px 0 10px}.closing-cards article a{padding-top:18px}.closing-footer{grid-template-columns:1fr 44px;gap:18px;margin-top:42px}.closing-footer em{grid-column:1/-1;grid-row:1;text-align:left;font-size:27px}.closing-footer>span{grid-column:1;grid-row:2}.closing-footer a{grid-column:2;grid-row:2}.closing-meta{flex-wrap:wrap;gap:10px}.closing-meta>span:nth-child(2){order:3;flex-basis:100%}}
@media(max-width:600px){.illustration .illustration-gallery .main-shop{display:grid;grid-template-columns:1fr;grid-template-rows:auto auto auto;gap:10px;min-height:0;padding:18px}.illustration-gallery .main-shop>.shop-art{grid-column:1;grid-row:1;max-width:none}.illustration-gallery .main-shop>.shop-art svg{max-height:310px}.illustration-gallery .main-shop-caption{grid-column:1;grid-row:2}.illustration-gallery .main-shop-caption h3{font-size:27px;margin:8px 0}.illustration-gallery .main-shop>figcaption{grid-column:1;grid-row:3}.illustration-gallery .art-panels{grid-template-columns:1fr}.illustration-gallery .art-panel{grid-template-columns:minmax(0,1.2fr) minmax(120px,.8fr);min-height:180px;padding:14px}.illustration-gallery .art-panel .mood-art{max-height:150px}.illustration-gallery .art-panel figcaption strong{font-size:18px}}

/* Let the live mobile capture lead, with readable controls beside its story. */
.mobile-glimpse{padding-top:72px;padding-bottom:82px;background:#f5f6f0}
.mobile-glimpse-layout{max-width:1060px;grid-template-columns:minmax(0,1fr) 280px;gap:clamp(40px,8vw,118px);align-items:center}
.mobile-glimpse-copy{max-width:570px}
.mobile-glimpse h2{max-width:560px;font-size:clamp(48px,5.2vw,72px);line-height:.97}
.mobile-glimpse h2 em{font:italic 400 1.04em/1 var(--serif);letter-spacing:-.055em;color:#84944d}
.mobile-glimpse-copy>p{max-width:460px;margin-top:27px;font-size:16px;line-height:1.6}
.mobile-phone-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-width:460px;margin-top:34px}
.mobile-phone-controls button{display:flex;align-items:center;gap:13px;min-height:54px;width:100%;padding:10px 15px;text-align:left;border:1px solid #d2dbca;border-radius:0;background:#fff;color:#285334;font:500 13px/1.2 'Reddit Sans',sans-serif;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.mobile-phone-controls button span{font-size:10px;letter-spacing:.08em;opacity:.72}
.mobile-phone-controls button strong{font-weight:600}
.mobile-phone-controls button:hover{border-color:#285334}
.mobile-phone-controls button[aria-pressed=true]{border-color:#285334;background:#285334;color:#fff}
.mobile-phone-controls button:focus-visible{outline:3px solid #84944d;outline-offset:3px}
.mobile-story{width:250px}
.mobile-story-label{margin:6px 0 0;font-size:14px;font-weight:600}
.mobile-story .mobile-glimpse-note{width:280px;max-width:calc(100vw - 40px);margin-top:22px;padding-top:13px;border-top:1px solid #cdd8c8;color:#5d6b5a;font:400 11px/1.55 'Reddit Sans',sans-serif}
@media(max-width:700px){
 .mobile-glimpse{padding-top:54px;padding-bottom:65px}
 .mobile-glimpse-layout{gap:30px}
 .mobile-glimpse h2{font-size:clamp(43px,8vw,55px)}
 .mobile-glimpse-copy>p{margin-top:18px;font-size:14px}
 .mobile-phone-controls{margin-top:23px}
}
@media(min-width:560px) and (max-width:900px){
 .mobile-glimpse-layout{grid-template-columns:minmax(0,1fr) 250px;gap:22px;align-items:center}
 .mobile-glimpse h2{font-size:clamp(43px,7vw,57px)}
 .mobile-phone-controls{grid-template-columns:1fr;gap:5px}
 .mobile-phone-controls button{min-height:45px}
}
@media(max-width:559px){
 .mobile-glimpse>.section-label{margin-bottom:27px}
 .mobile-glimpse-layout{grid-template-columns:1fr;gap:30px}
 .mobile-glimpse h2{font-size:clamp(43px,11vw,52px)}
 .mobile-glimpse-copy>p{max-width:360px}
 .mobile-phone-controls{grid-template-columns:repeat(2,minmax(0,1fr))}
 .mobile-phone-controls button{min-height:48px;padding:9px 10px;gap:8px;font-size:12px}
 .mobile-story{justify-self:center}
}
@media(max-width:700px){
 .site-header.has-nav-overflow::after{content:'More →';position:absolute;right:5%;bottom:0;z-index:3;display:flex;align-items:center;justify-content:flex-end;width:70px;height:52px;padding-right:2px;background:linear-gradient(90deg,rgba(255,255,255,0),#fff 38%);color:#285334;font:600 10px/1 'Reddit Sans',sans-serif;pointer-events:none}
}

/* Keep the editorial header available while browsing the case study. */
.site-header{position:sticky;top:0;z-index:100}
section[id]{scroll-margin-top:calc(var(--header-height,154px) + 18px)}

/* Interactive store stays within the existing presentation frames. */
.shop-image-window{position:relative;overflow:hidden}
.store-demo-frame{display:block;border:0;max-width:none;transform-origin:0 0;background:#fff}
.shop-image-window .store-demo-frame{position:absolute;inset:0;height:100%}
.mobile-phone-viewport .store-demo-frame{position:absolute;inset:0;min-height:0;transition:opacity .18s}
.mobile-story.is-swapping .store-demo-frame{opacity:0}

.mobile-phone-status,.mobile-phone-home{pointer-events:none}

/* A short fade carries the walkthrough from one view to the next. */
.line-rules article>b{font-family:'Reddit Sans',sans-serif}
.shop-image-window .store-demo-frame{transition:opacity .24s ease}
.shop-presentation.is-transitioning .store-demo-frame{opacity:0}
.mobile-phone-controls button,.shop-step-nav button{transition:background .22s,color .22s,transform .22s}
.mobile-phone-controls button:hover,.shop-step-nav button:hover{transform:translateY(-2px)}
@media(prefers-reduced-motion:reduce){.store-demo-frame,.mobile-phone-controls button,.shop-step-nav button{transition:none!important;transform:none!important}}