/* Draft 2 — Coffee & a little joy. Original Happy Roastery design. */
.joy-design{--green:#294333;--brown:#233a2d;--cream:#fff;--offwhite:#fbfbf7;--yellow:#f3edbc;--line:#e7e9e0;--muted:#687067;background:#fff;color:#233a2d;font-family:'IBM Plex Sans Thai',sans-serif}
.joy-design h1,.joy-design h2,.joy-design h3,.joy-design .field-serif{font-family:'IBM Plex Sans Thai',sans-serif;font-weight:600;letter-spacing:-.035em;line-height:1.45}.joy-design h1{font-size:clamp(36px,4.4vw,66px)}.joy-design h2{font-size:clamp(29px,3vw,44px)}.joy-design .wrap{max-width:1360px;padding-left:56px;padding-right:56px}.joy-design .sec{padding:100px 0}.joy-design .field-header{background:#ffffffed;border:0;box-shadow:none;backdrop-filter:blur(14px)}.joy-design .nav{height:100px}.joy-design .field-logo{color:#20382b;min-width:135px}.joy-design .field-logo .joy-wordmark{font-family:'IBM Plex Sans Thai',sans-serif;font-weight:700;font-size:42px;letter-spacing:-3px}.joy-design .field-logo small{font-size:8px;letter-spacing:.38em;margin:8px 0 0 4px}.joy-design .nav nav a{font-size:13px;font-weight:400;letter-spacing:.025em;color:#303d32}.joy-design .nav nav{gap:32px}.joy-design .nav .nav-buy{background:transparent;color:#233a2d;border:1px solid #d9ded2;border-radius:999px;font-size:12px;padding:10px 19px}.joy-design .nav .nav-buy:hover{background:#f3f5ed}.joy-design .btn{border-radius:999px;font-weight:500;padding:14px 26px;font-size:14px}.joy-design .btn--primary{background:#294333;color:white}.joy-design .btn--primary:hover{background:#42633f}.joy-design .btn--ghost{border-color:#c3ccbb}.joy-design .btn--light{background:#f3edbc;color:#263c2e}.joy-kicker{font-size:10px;font-weight:500;letter-spacing:.16em;line-height:1.7;color:#66765e;margin:0 0 23px}.joy-hero{display:grid;grid-template-columns:1.05fr 1fr;gap:15px;align-items:center;min-height:690px;padding-top:40px;padding-bottom:75px}.joy-intro{padding:0 0 25px}.joy-intro h1{font-size:clamp(43px,4.9vw,72px);line-height:1.38;font-weight:600;letter-spacing:-.04em;margin:0 0 25px}.joy-highlight{display:inline-block;position:relative;z-index:0}.joy-highlight:before{content:'';position:absolute;left:0;right:-5px;bottom:5px;height:31%;background:#f1eab4;z-index:-1;transform:rotate(-3deg);border-radius:30% 20% 20% 30%}.joy-period{color:#a15942}.joy-lead{font-size:16px;line-height:1.95;color:#65705f}.joy-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-top:30px}.joy-actions .btn span{margin-left:22px}.joy-link{font-size:13px;font-weight:500;text-decoration:none;border-bottom:1px solid #c5cebd;padding-bottom:5px;color:#294333;display:inline-block}.joy-link:hover{border-bottom-color:#294333}.joy-art{position:relative;padding-bottom:35px}.joy-art img{width:100%;height:auto;aspect-ratio:3/2;object-fit:contain;mix-blend-mode:multiply}.joy-art>p{font-size:15px;font-weight:600;line-height:1.5;letter-spacing:-.02em;margin:0 0 0 55%;transform:rotate(-6deg)}.joy-art>p span{font-weight:400;font-size:12px;color:#738168}.joy-products{background:#fafbf6;border-radius:40px 40px 0 0}.joy-section-title{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:45px}.joy-section-title h2{margin:0;font-size:38px;font-weight:500}.joy-section-title>p{font-size:14px;color:var(--muted)}.joy-products .harvest-shelf{gap:26px}.joy-products .harvest-product-photo{background:#eff2e8;border-radius:55% 55% 8px 8px;aspect-ratio:4/5}.joy-products .harvest-product:nth-child(2) .harvest-product-photo{background:#edf0e9}.joy-products .harvest-product:nth-child(3) .harvest-product-photo{background:#f6eee3}.joy-products .harvest-product:nth-child(4) .harvest-product-photo{background:#edf0f4}.joy-products .harvest-product:nth-child(5) .harvest-product-photo{background:#f0edf2}.joy-products .harvest-product-photo img{width:95%;height:95%}.joy-products .harvest-product h3{font-size:18px;font-weight:500}.joy-products .product-roast{font-size:10px;margin-top:22px}.joy-products .product-bottom{border:0;padding-top:3px;margin-top:10px}.joy-products .product-bottom>a{background:white;border-color:#e1e6d9}.joy-products .price-source{font-size:10px;margin-top:32px}.joy-finder{display:grid;grid-template-columns:1.05fr 1fr 1fr 1fr;gap:22px;padding-top:110px;padding-bottom:110px}.joy-finder>div>h2{font-size:38px;line-height:1.4;font-weight:500}.joy-finder>div>p:not(.joy-kicker){font-size:14px;color:var(--muted)}.mood-card{padding:35px 22px 25px;border:1px solid #e2e7d9;border-radius:14px;text-decoration:none;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:transform .25s,background .25s}.mood-card:hover{transform:translateY(-5px);background:#fbfcf6}.mood-card h3{font-size:19px;font-weight:500;margin-top:21px;margin-bottom:7px}.mood-card p{font-size:12px;color:var(--muted);margin-bottom:22px}.mood-card b{font-size:11px;font-weight:500;margin-top:auto}.mood-drawing{display:block;width:65px;height:59px;border:2px solid #294333;border-radius:3px 3px 25px 25px;position:relative;margin:8px auto 5px;transform:rotate(-7deg);background:#fff}.mood-drawing:after{content:'';position:absolute;top:8px;right:-20px;width:19px;height:28px;border:2px solid #294333;border-left:0;border-radius:0 15px 15px 0}.mood-drawing:before{content:'';position:absolute;height:9px;left:4px;right:4px;top:5px;background:#614b39;border-radius:50%}.milk .mood-drawing{transform:rotate(6deg);background:#f4e7cf}.milk .mood-drawing:before{background:#c5a478}.mood-question{font:500 73px/1 'IBM Plex Sans Thai';color:#476444;height:73px;transform:rotate(8deg)}.joy-origin{border-top:1px solid #edf0e7;border-bottom:1px solid #edf0e7}.joy-origin>.wrap{display:grid;grid-template-columns:1.1fr 1fr;gap:90px;align-items:center}.joy-origin figure{margin:0;transform:rotate(-2deg);padding:12px;background:#f5f4eb}.joy-origin img{width:100%;height:370px;object-fit:cover}.joy-origin figcaption{font-size:10px;padding:14px 8px 6px;color:#6e7666}.joy-origin h2{font-weight:500;font-size:43px;line-height:1.5;margin-bottom:25px}.joy-origin p:not(.joy-kicker){font-size:15px;color:var(--muted);line-height:1.9}.joy-origin .joy-link{margin-top:20px}.joy-brew-photo{display:block;position:relative;border-radius:12px;overflow:hidden;background:#e9eee0}.joy-brew-photo img{width:100%;height:480px;object-fit:cover;object-position:center 58%;transition:transform .5s}.joy-brew-photo:hover img{transform:scale(1.02)}.joy-brew-photo>span{position:absolute;bottom:30px;right:30px;background:#fff;border-radius:999px;padding:15px 25px;font-size:14px;color:#294333}.joy-brew-photo b{margin-left:50px;font-size:20px}.joy-signoff{text-align:center;padding-top:30px;padding-bottom:120px}.joy-signoff>p{font-size:13px;letter-spacing:.04em;color:#7c8b6c}.joy-signoff h2{font-size:43px;font-weight:500;line-height:1.5;margin:22px 0 28px}.joy-design .field-footer{background:#f6f8f1;color:#45543c;border-top:1px solid #e3e9db}.joy-design .field-footer>.wrap{padding-top:70px;padding-bottom:25px}.joy-footer-word{font-size:35px!important;letter-spacing:-.04em;color:#294333;font-weight:500;margin:0 0 50px!important}.joy-design .field-footer .field-logo{color:#294333}.joy-design .field-footer h4{color:#233a2d;font-size:13px}.joy-design .field-footer p,.joy-design .field-footer li{font-size:12px}.joy-design .footer-bottom{border-color:#dbe2d1;color:#65755c;font-size:10px}.joy-design .image-credits{color:#63745c}.joy-design .field-footer a:hover{color:#162c1c}.joy-design .fgrid{gap:45px}.joy-design .eyebrow{font-size:10px;font-weight:500}.joy-design .field-inner h1{font-family:'IBM Plex Sans Thai',sans-serif!important}.joy-design.field-inner .sec>.wrap>h1{font-family:'IBM Plex Sans Thai',sans-serif!important;font-weight:500!important;font-size:46px!important}.joy-design .crumb{font-size:11px;color:#7c8774}.joy-design .filters{background:#f6f8f0;border-radius:14px;border:1px solid #e5eadc}.joy-design .chip{border-radius:999px;background:#fff;border-color:#e4e8dc;font-size:12px}.joy-design .chip.on{background:#294333;color:#fff}.joy-design .prod .ph{background:#f6f7f0;border-radius:18px}.joy-design .prod .body h3{font-size:22px;font-weight:500}.joy-design .prod .btn{font-size:12px;border-radius:999px}.joy-design .prod .tag{font-size:10px;background:#f2f4ec}.joy-design .prod .spec{font-size:12px}.joy-design .prod .price{font-size:22px}.joy-design .pdp{gap:80px}.joy-design .pdp h1{font-family:'IBM Plex Sans Thai',sans-serif;font-size:46px;font-weight:500}.joy-design .gallery .main{border-radius:24px;background:#f6f7ef}.joy-design .thumbs button{border-radius:10px;border-width:1px}.joy-design .thumbs button[aria-pressed=true]{border-width:2px}.joy-design .badge,.joy-design .tag,.joy-design .flavor b{border-radius:999px;background:#f3f5ed}.joy-design .grind label{border-radius:12px;border-color:#e1e7d9}.joy-design .grind label:has(input:checked){background:#f3f6ea;border-color:#5c794c}.joy-design .pick-note{background:#f7f8f2;border:0;border-radius:8px}.joy-design .card{border-radius:14px;background:#fafbf7;border-color:#e6ecde}.joy-design .qa{border-radius:12px;background:#fafbf7;border-color:#e3e9da}.joy-design .qa summary{font-weight:500}.joy-design .opt{border-radius:999px;font-size:14px;border-color:#dce5d2}.joy-design .opt.on{background:#294333;border-color:#294333;color:#fff}.joy-design .rcard{background:#f2f5ea;border:0;border-radius:18px}.joy-design .proof-box{background:#f4f6ee;border:0;border-radius:18px}.joy-design .origin-note{background:#f7f8f2;border:0;border-radius:14px}.joy-design .origin-intro{border-radius:16px;overflow:hidden;min-height:450px}.joy-design .origin-intro h1{font-family:'IBM Plex Sans Thai',sans-serif;font-size:48px}.joy-design .field-story{background:#f6f8f0;color:#233a2d}.joy-design .story-copy h2{color:#233a2d;font-weight:500}.joy-design .story-copy p:not(.eyebrow){color:#63715b}.joy-design .story-copy .eyebrow{color:#63715b}.joy-design .story-copy .btn--light{background:#294333;color:#fff}.joy-design .field-blog{background:white!important}.joy-design.field-blog section[style*="gradient"]{background:#f5f7ef!important;color:#294333!important}.joy-design.field-blog section[style*="gradient"] h1{color:#294333!important;font-family:'IBM Plex Sans Thai',sans-serif!important;font-weight:500!important}.joy-design.field-blog section[style*="gradient"] p{color:#627458!important}.joy-design.field-blog section[style*="gradient"] span{color:#627458!important}.joy-design.field-blog section[style*="gradient"] a{color:#294333!important}.joy-design .brew-grid>a{background:#f5f7ef;border-radius:15px;overflow:hidden}.joy-design .brew-grid h2{font-size:30px}.joy-design .sticky{background:white;color:#294333;border-top:1px solid #e1e7d7}.joy-design .sticky .btn{background:#294333;color:white}.joy-design .menu-toggle{border-radius:999px}.joy-design .story{background:#f6f8f0!important;border-color:#e6ebdf;border-radius:15px}.joy-design .brew-banner img{border-radius:15px}
@media(max-width:1150px){.joy-design .wrap{padding-left:36px;padding-right:36px}.joy-design .nav{gap:20px}.joy-design .nav nav{gap:20px}.joy-hero{min-height:640px;gap:0}.joy-intro h1{font-size:57px}.joy-origin>.wrap{gap:55px}.joy-products .harvest-shelf{gap:18px}.joy-products .harvest-product h3{font-size:16px}.joy-finder{gap:16px}.mood-card{padding:30px 16px 23px}.joy-design .fgrid{gap:28px}.joy-design .pdp{gap:45px}}
@media(max-width:950px){.joy-design .nav{height:85px}.joy-design .nav nav{background:white;padding:15px 36px 25px;gap:0}.joy-design .nav nav a{font-size:15px}.joy-hero{min-height:620px;grid-template-columns:1fr 1fr}.joy-intro h1{font-size:48px}.joy-lead{font-size:14px}.joy-kicker{font-size:9px}.joy-art{margin-right:-15px}.joy-art>p{margin-left:35%;font-size:13px}.joy-products .harvest-shelf{grid-template-columns:repeat(3,minmax(0,1fr));gap:30px 22px}.joy-finder{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.joy-finder>div{padding:20px}.joy-origin>.wrap{gap:35px}.joy-origin img{height:330px}.joy-origin h2{font-size:34px}.joy-origin p:not(.joy-kicker){font-size:13px}.joy-section-title h2{font-size:32px}.joy-brew-photo img{height:390px}.joy-design .sec{padding:75px 0}.joy-design .pdp{gap:35px}.joy-design .pdp h1{font-size:39px}.joy-design .origin-intro h1{font-size:40px}.joy-design .nav .nav-buy{margin-left:auto}}
@media(max-width:600px){.joy-design .wrap{padding-left:23px;padding-right:23px}.joy-design .nav{height:80px;gap:12px}.joy-design .field-logo{min-width:90px}.joy-design .field-logo .joy-wordmark{font-size:35px;letter-spacing:-2px}.joy-design .field-logo small{font-size:6px;margin-top:6px}.joy-design .nav .nav-buy{font-size:10px;padding:9px 12px}.joy-design .nav nav{padding:12px 23px 25px}.joy-hero{grid-template-columns:1fr;min-height:0;padding-top:32px;padding-bottom:40px;gap:0}.joy-intro{padding-bottom:5px}.joy-intro h1{font-size:45px;line-height:1.4;margin:0 0 22px}.joy-kicker{font-size:8px;letter-spacing:.12em;margin-bottom:21px}.joy-lead{font-size:13px}.joy-actions{gap:19px;margin-top:25px}.joy-actions .btn{font-size:12px;padding:12px 19px}.joy-link{font-size:11px}.joy-actions .btn span{margin-left:12px}.joy-art{padding:5px 0 35px;margin:0 auto;width:100%;max-width:440px}.joy-art img{height:260px;width:100%;object-fit:contain}.joy-art>p{font-size:13px;position:absolute;right:9px;bottom:22px;margin:0;transform:rotate(-5deg)}.joy-art>p span{font-size:10px}.joy-design .sec{padding:57px 0}.joy-products{border-radius:25px 25px 0 0}.joy-section-title{display:block;margin-bottom:28px}.joy-section-title h2{font-size:28px;line-height:1.5}.joy-section-title>.joy-link{margin-top:20px}.joy-products .harvest-shelf{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 17px}.joy-products .harvest-product-photo{aspect-ratio:4/5}.joy-products .harvest-product h3{font-size:15px}.joy-products .product-roast{font-size:9px}.joy-products .product-use{font-size:10px}.joy-finder{padding-top:55px;padding-bottom:55px;gap:15px}.joy-finder>div{padding:15px 0}.joy-finder>div>h2{font-size:31px}.joy-finder>div>p:not(.joy-kicker){font-size:12px}.mood-card{padding:28px 10px 22px;border-radius:12px}.mood-card h3{font-size:16px}.mood-card p{font-size:10px}.mood-card b{font-size:10px}.mood-drawing{width:50px;height:47px}.mood-drawing:after{height:24px;right:-16px;width:15px}.mood-question{font-size:61px;height:62px}.joy-origin>.wrap{grid-template-columns:1fr;gap:38px}.joy-origin figure{margin:0 5px}.joy-origin img{height:280px}.joy-origin figcaption{font-size:9px}.joy-origin h2{font-size:33px}.joy-origin p:not(.joy-kicker){font-size:14px}.joy-brew-photo img{height:320px;object-position:60% center}.joy-brew-photo>span{right:18px;bottom:18px;font-size:12px;padding:12px 18px}.joy-brew-photo b{margin-left:30px}.joy-signoff{padding-top:10px;padding-bottom:65px}.joy-signoff h2{font-size:33px}.joy-signoff>p{font-size:11px}.joy-signoff .btn{font-size:13px}.joy-design .field-footer>.wrap{padding-top:45px}.joy-footer-word{font-size:28px!important;line-height:1.4!important;margin-bottom:35px!important;max-width:260px}.joy-design .fgrid{gap:30px}.joy-design .field-footer .field-logo small{font-size:8px}.joy-design .field-inner h1{font-size:34px!important}.joy-design.field-inner .sec>.wrap>h1{font-size:33px!important}.joy-design .pdp h1{font-size:37px}.joy-design .origin-intro{min-height:400px;padding:28px}.joy-design .origin-intro h1{font-size:34px}.joy-design .prod .body h3{font-size:17px}.joy-design .prod .btn{font-size:11px}.joy-design .prod .spec{font-size:11px}.joy-design .prod .price{font-size:21px}.joy-design .filters{padding:16px}.joy-design .chip{font-size:11px;padding:7px 12px}.joy-design .gallery .main{border-radius:17px}.joy-design .grind label{padding:11px 9px}.joy-design .field-blog section[style*="gradient"] h1{font-size:34px!important}.joy-design .brew-grid h2{font-size:27px}.joy-design .footer-bottom{font-size:10px}}

/* 2026-10-05: product-first catalog revision, Draft 2 only */
.joy-catalog .crumb{font-size:12px;margin-bottom:0}
.joy-catalog main>.sec:first-of-type{padding-top:0!important}
.joy-catalog .coffee-intro{display:grid;grid-template-columns:1fr 230px;align-items:center;gap:48px;padding:24px 0 38px}
.joy-catalog .coffee-intro h1{font-size:clamp(32px,4vw,58px);line-height:1.2;letter-spacing:-.045em;margin:12px 0 18px;max-width:none}
.joy-catalog .coffee-intro .lead{font-size:17px;margin:0;max-width:none}
.joy-catalog .coffee-intro>img{width:230px;height:230px;object-fit:contain}
.coffee-principles{display:flex;gap:28px;margin-top:28px;font-size:11px;color:#96732d}
.coffee-principles b{display:block;font-size:13px;color:#343b33;margin-top:5px;font-weight:500}
.joy-catalog #filters.coffee-tools{display:flex;align-items:center;justify-content:space-between;gap:20px;background:none;border:0;border-top:1px solid #e4e6df;border-bottom:1px solid #e4e6df;border-radius:0;padding:16px 0;margin:0;position:relative}
.coffee-tabs{display:flex;gap:8px;flex-wrap:wrap}
.joy-catalog .coffee-tabs .chip{padding:9px 18px;font-size:14px;border:0;background:transparent;color:#65695f;min-height:42px}
.joy-catalog .coffee-tabs .chip.on{background:#273f30;color:white}
.coffee-refine summary{cursor:pointer;font-size:13px;padding:12px 0;list-style:none;text-align:right}
.coffee-refine summary:after{content:' +';margin-left:12px}
.coffee-refine[open] summary:after{content:' −'}
.coffee-refine-panel{position:absolute;z-index:5;right:0;top:100%;width:min(620px,100%);background:#fff;padding:22px;box-shadow:0 12px 30px #172b181c;border:1px solid #e5e7df;border-radius:12px}
.joy-catalog .coffee-refine .frow{margin:0 0 14px;gap:6px}
.joy-catalog .coffee-refine .flab{width:90px;font-size:13px}
.joy-catalog .coffee-refine .chip{font-size:12px;padding:7px 11px;min-height:36px;border-width:1px}
.joy-catalog #list{grid-template-columns:repeat(3,minmax(0,1fr));gap:44px 28px}
.joy-catalog #list .prod{background:none;border:0;border-radius:0;box-shadow:none;overflow:visible;transform:none}
.joy-catalog #list .ph{background:var(--coffee-tone);border-radius:50% 50% 12px 12px;aspect-ratio:1.12;height:auto;padding:22px;overflow:hidden}
.joy-catalog #list .ph img{object-fit:contain;width:100%;height:100%;max-height:none;transition:transform .25s}
.joy-catalog #list .prod:hover .ph img{transform:translateY(-6px) rotate(-3deg)}
.joy-catalog #list .body{padding:22px 4px 0}
.joy-catalog #list h3{font-size:25px;margin-bottom:10px;letter-spacing:-.035em}
.joy-catalog #list .tag{background:transparent;border:0;padding:0 12px 0 0;color:#687060;font-size:12px}
.joy-catalog #list .spec{font-size:14px;margin:8px 0}
.joy-catalog #list .price{font-size:23px;margin:16px 0 10px}
.coffee-product-link{display:block;padding:12px 0;border-top:1px solid #dce1d8;color:#283f30;font-size:14px;font-weight:600}
.coffee-price-note{font-size:12px;color:#6c7166;margin-top:36px}
.joy-design .pdp .info h1{letter-spacing:-.035em;line-height:1.2}
.joy-design .pdp .main{border-radius:24px;background:#f6f5ef}
@media(max-width:800px){.joy-catalog .coffee-intro{grid-template-columns:1fr 140px;gap:12px}.joy-catalog .coffee-intro>img{width:140px;height:140px}.coffee-principles{gap:16px}.joy-catalog #list{gap:32px 20px;grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.joy-catalog .coffee-intro{display:block;position:relative;padding:20px 0 26px}.joy-catalog .coffee-intro h1{font-size:34px;max-width:280px}.joy-catalog .coffee-intro>img{position:absolute;right:-8px;top:18px;width:74px;height:74px;opacity:.95}.joy-catalog .coffee-intro .eyebrow{font-size:9px}.joy-catalog .coffee-intro .lead{font-size:14px;max-width:300px}.coffee-principles{gap:18px;margin-top:22px}.coffee-principles b{font-size:11px}.joy-catalog #filters.coffee-tools{align-items:flex-start;flex-direction:column;gap:0;padding:10px 0}.joy-catalog .coffee-tabs{width:100%;justify-content:space-between;gap:2px}.joy-catalog .coffee-tabs .chip{font-size:12px;padding:7px 12px}.coffee-refine{align-self:flex-end}.coffee-refine summary{font-size:11px;padding:8px 2px}.joy-catalog #list{gap:28px 14px;margin-top:14px!important}.joy-catalog #list .ph{padding:10px;aspect-ratio:.86}.joy-catalog #list h3{font-size:19px;line-height:1.2;min-height:46px}.joy-catalog #list .body{padding-top:16px}.joy-catalog #list .spec{font-size:12px}.joy-catalog #list .price{font-size:20px}.joy-catalog #list .price small{font-size:11px}.coffee-product-link{font-size:12px}.joy-catalog #count{font-size:12px!important}.coffee-refine-panel{padding:14px}.joy-catalog .coffee-refine .flab{width:100%}}
@media(prefers-reduced-motion:reduce){.joy-catalog #list .ph img{transition:none;transform:none!important}}
.joy-catalog .coffee-intro{background:#fff;border:0;border-radius:0}
.joy-catalog #list .ph img{transform:scale(1.3)}
.joy-catalog #list .prod:hover .ph img{transform:scale(1.34) translateY(-4px) rotate(-2deg)}
.joy-catalog #filters.coffee-tools{flex-wrap:wrap}
.coffee-refine[open]{width:100%}
.coffee-refine-panel{position:static;width:100%;box-shadow:none;margin-top:8px;background:#fafbf7}

/* Catalog intro scrolls normally; only the navigation can remain sticky. */
.joy-catalog header.coffee-intro{position:relative;top:auto;z-index:auto;backdrop-filter:none}

/* Official owner-supplied brand artwork exported from original Illustrator vectors. */
.joy-design .field-logo{display:inline-flex;align-items:center;justify-content:flex-start;min-width:0;flex-shrink:0}
.joy-design .field-logo img.happy-brand-logo{display:block;width:148px;height:auto;max-width:none;object-fit:contain}
.joy-design .field-footer .field-logo img.happy-brand-logo{width:180px}
.joy-design .joy-origin img.happy-origin-mark{width:88px;height:auto;object-fit:contain;transform:none;border-radius:0;margin:0 0 24px}
.happy-brand-story{background:#faf9f3}
.happy-brand-story>.wrap{display:grid;grid-template-columns:220px minmax(0,580px);justify-content:center;align-items:center;gap:90px}
.happy-brand-story img{width:220px;height:auto}
.happy-brand-story p:not(.eyebrow){color:#626b5d;line-height:1.9}
@media(max-width:950px){.joy-design .field-logo img.happy-brand-logo{width:120px}}
@media(max-width:520px){.joy-design .field-logo img.happy-brand-logo{width:104px}.joy-design .field-footer .field-logo img.happy-brand-logo{width:150px}.happy-brand-story>.wrap{grid-template-columns:1fr;gap:32px}.happy-brand-story img{width:150px}.joy-design .joy-origin img.happy-origin-mark{width:76px}}

/* ── ปุ่มสั่งผ่าน LINE ──────────────────────────────────────────────
   สีเขียว LINE อย่างเป็นทางการ #06C755 ใช้เฉพาะปุ่มที่พาไปแชตร้าน
   ไม่เอาไปใช้กับปุ่มอื่น ลูกค้าจะได้จำได้ว่าเขียวแปลว่าคุยกับคน     */
.btn--line{background:#06C755;color:#fff;border-color:#06C755}
.btn--line:hover,.btn--line:focus-visible{background:#05b34c;border-color:#05b34c;color:#fff}
.line-bonus{display:inline-block;font-size:12.5px;font-weight:600;color:#05843a;
  background:#e8f8ee;border-radius:999px;padding:3px 10px;margin-left:6px;white-space:nowrap}
.card-line{display:inline-flex;align-items:center;gap:5px;margin-top:8px;
  font-size:13px;font-weight:600;color:#05843a;text-decoration:none}
.card-line:hover,.card-line:focus-visible{text-decoration:underline}
@media(max-width:560px){.line-bonus{margin-left:0;margin-top:6px}}