/* One type scale for Hua You Company and HUFU Studio public pages. */
:root{
 --type-heading:Manrope,'Noto Sans SC',sans-serif;
 --type-body:'DM Sans','Noto Sans SC',sans-serif;
 --type-page-title:clamp(40px,4.4vw,56px);
 --type-section-title:clamp(30px,3.2vw,40px);
 --type-card-title:24px;
 --type-body-size:16px;
 --type-note-size:14px;
 --type-meta-size:12px;
 --type-ink:#191919;
 --type-copy:#626262;
}
.site-shell,.hufu-page,.product-detail-dialog{font-family:var(--type-body);font-size:var(--type-body-size);line-height:1.8}
.hufu-page{--studio-body-size:var(--type-body-size);--studio-note-size:var(--type-note-size);--studio-meta-size:var(--type-meta-size);--studio-ink:var(--type-ink);--studio-copy:var(--type-copy)}
.site-shell :is(h1,h2,h3),.hufu-page :is(h1,h2,h3),.product-detail-dialog h2{font-family:var(--type-heading);font-weight:700}
.site-shell .hero h1,.hufu-page.hufu-editorial :is(.hufu-hero h1,.hufu-format-intro h1,.hufu-stall-intro h1,.jian-editorial-intro h1,.hufu-magazine-copy h1,.hufu-stall-project-title){font-size:var(--type-page-title);font-weight:700;line-height:1.12;letter-spacing:-.035em}
.site-shell :is(.section-heading h2,.story-section h2,.contact h2),.hufu-page.hufu-editorial :is(.hufu-section-heading h2,.hufu-contact h2,.hufu-case-end h2){font-size:var(--type-section-title);font-weight:700;line-height:1.2;letter-spacing:-.025em}
.site-shell :is(.hero h1,.offerings .section-heading h2,.story-section h2){color:var(--type-ink)}
.site-shell .hero-brand-panel .visual-heading{font-family:var(--type-heading);font-size:var(--type-card-title);font-weight:700;line-height:1.3}
.hufu-page.hufu-editorial :is(.hufu-formats-grid h3,.hufu-magazine-copy h2,.hufu-magazine-copy h3,.hufu-format-empty h2,.jian-editorial-colours h2){font-size:var(--type-card-title);font-weight:700;line-height:1.3;letter-spacing:-.025em}
.site-shell :is(.hero-description,.section-heading>p,.story-copy p,.contact-enquiry p,.contact-grid p),.hufu-page.hufu-editorial :is(.hufu-introduction,.hufu-format-description,.hufu-process-grid p,.hufu-format-intro>div,.hufu-stall-description,.hufu-format-empty p,.hufu-magazine-description,.jian-editorial-description,.jian-design-approach dd,.hufu-faq-list p,.hufu-faq-scope dd,.hufu-contact-note),.product-detail-dialog .detail-description{font-size:var(--type-body-size);font-weight:400;line-height:1.8;color:var(--type-copy)}
.site-shell .contact-heading .contact-enquiry p{color:#fff}
.site-shell .category-grid>.category-card h3,.site-shell .product-card h3,.site-shell .featured-card h3{font-size:var(--type-body-size);font-weight:700;line-height:1.45}
.site-shell .product-card .product-meta,.site-shell .featured-card .product-meta{font-size:var(--type-meta-size);font-weight:600;line-height:1.6}
.site-shell :is(.contact-grid h3,.enquiry-details h3),.hufu-page.hufu-editorial :is(.hufu-contact-card h3,.jian-design-approach h2){font-size:18px;font-weight:600;line-height:1.4}
.hufu-page :is(.jian-design-approach dt,.hufu-faq-scope dt){font-size:var(--type-body-size);font-weight:600;line-height:1.6}
.site-shell .hero-copy .eyebrow,.site-shell .section-heading .eyebrow,.site-shell .story-section .eyebrow,.site-shell .contact-heading .eyebrow,.site-shell .visual-top,.site-shell .dialog-heading .eyebrow{font-size:var(--type-meta-size);font-weight:600;line-height:1.6;letter-spacing:.08em}
.site-shell :is(.hero-buttons .button,.button),.hufu-page :is(.hufu-primary,.hufu-text-link,.hufu-magazine-link,.hufu-case-end>a),.product-detail-dialog .detail-add{font-family:var(--type-body);font-size:var(--type-body-size);font-weight:600;line-height:1.6}
.site-shell .contact-grid a,.hufu-page .hufu-contact-details a{font-size:var(--type-body-size);font-weight:500;line-height:1.6}
.site-shell .contact-grid .socials a,.hufu-page .hufu-contact-socials a{font-size:var(--type-note-size);font-weight:400;line-height:1.8}
.site-shell :is(.hero-design-credit,.hero-foot,.timeline p,.quote-footer>p,.enquiry-details>p,.search-note,.search-count),.hufu-page :is(.hufu-section-heading>span,.hufu-magazine-note,.jian-image-note,.jian-editorial-spread>p,.jian-chapter-caption p,.jian-colour-heading>p,.hufu-case-end p),.product-detail-dialog .detail-note{font-size:var(--type-note-size);font-weight:400;line-height:1.8;color:var(--type-copy)}
.site-shell :is(.enquiry-fields label,.product-search>label),.product-detail-dialog :is(.detail-pack,.detail-quantity>span){font-size:var(--type-note-size);font-weight:600;line-height:1.6}
.site-shell .enquiry-fields input,.site-shell .search-field input,.product-detail-dialog .detail-pack select{font-size:var(--type-body-size);line-height:1.6}
.site-shell .dialog-heading h2,.product-detail-dialog .detail-copy h2{font-size:var(--type-card-title);font-weight:700;line-height:1.3}
.site-shell .nav :is(nav a,nav summary,.language),.hufu-page .hufu-nav :is(.hufu-nav-group>summary,.hufu-desktop-nav>a,.hufu-nav-submenu a,.hufu-language){font-size:14px;font-weight:600;line-height:1.5}
.site-shell footer .footer-brand,.hufu-page .hufu-footer .footer-brand{font-family:var(--type-body);font-size:14px;font-weight:700;line-height:1.6;letter-spacing:0}
.site-shell footer p,.hufu-page .hufu-footer p{font-size:var(--type-note-size);font-weight:400;line-height:1.8;color:var(--type-copy);letter-spacing:0}
.site-shell .whatsapp-float,.hufu-page .hufu-whatsapp-float{font-family:var(--type-body);font-size:14px;font-weight:600;line-height:1.5}
.site-shell .whatsapp-choice>p,.site-shell .whatsapp-choice strong,.hufu-page .whatsapp-choice>p,.hufu-page .whatsapp-choice strong{font-size:var(--type-body-size);font-weight:600;line-height:1.6;color:var(--type-ink)}
.site-shell .whatsapp-choice a>span,.hufu-page .whatsapp-choice a>span{font-size:var(--type-note-size);font-weight:400;line-height:1.6;color:var(--type-copy)}
html[lang="zh-CN"] .site-shell :is(h1,h2,h3),.hufu-page:lang(zh-CN) :is(h1,h2,h3){letter-spacing:0}
html[lang="zh-CN"] .site-shell .eyebrow{letter-spacing:.02em}
@media(max-width:700px){:root{--type-page-title:40px;--type-section-title:30px}}
@media(max-width:360px){.site-shell .nav{gap:4px}.site-shell .nav-actions{gap:4px}.site-shell .nav .language{padding-inline:4px}}
/* Keep touch scrolling, without page pinch or double-tap scaling. */
html { touch-action: pan-x pan-y; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
@media (pointer: coarse) { input:not([type=checkbox]):not([type=radio]), select, textarea { font-size: max(16px, 1em); } }