/* Editorial hierarchy: the headline has its own quiet area above the photograph. */
:root{--radius-small:10px;--radius-control:12px;--radius-surface:16px}
.app-header .wordmark{display:flex;align-items:center;min-height:44px;flex-shrink:0}
.app-header .wordmark img{width:112px;height:auto;object-fit:contain}
.company-footer .footer-wordmark{display:inline-block;width:112px;height:auto;object-fit:contain;vertical-align:middle}
.hero{display:flex;flex-direction:column;aspect-ratio:auto}
.hero-copy{position:static;order:-1;padding:21px 21px 17px}
.hero h2{font-size:29px;line-height:1.4;letter-spacing:1px;margin-top:12px}
.hero-copy p{margin-top:10px}
.hero>img{width:100%;height:auto;aspect-ratio:1.5;object-position:center}
.hero-bottom{position:static;background:#d6d8d1;padding:12px 19px;text-align:left}
.small-btn{min-height:44px}
.quantity button{width:44px;height:44px}
.quantity input{height:44px}
.product-card .product-label{min-height:44px}
.bottom-nav .brand-nav{padding:0;width:66px;min-height:66px;height:66px;justify-self:center;align-self:center;transform:translateY(-7px);border:5px solid var(--bg);border-radius:50%;background:var(--brand);gap:0}
.bottom-nav .brand-nav img{position:static;top:auto;width:35px;height:43px;max-width:100%;border:0;border-radius:0;object-fit:contain;background:none;filter:brightness(0) invert(1)}
/* The entry screen is a live typographic composition; the original page ground remains visible. */
.app-shell.home-route{border-radius:0}
.home-route .app-header{display:none}
.home-cover{height:calc(100svh - 81px - env(safe-area-inset-bottom));height:calc(100dvh - 81px - env(safe-area-inset-bottom));display:grid;place-items:center;overflow:hidden;background:var(--bg);color:var(--ink)}
.home-cover--statement{--home-accent:var(--brand);position:relative;isolation:isolate}
.home-composition{position:relative;width:100%;max-width:calc((100svh - 81px - env(safe-area-inset-bottom)) * .6280899);max-width:calc((100dvh - 81px - env(safe-area-inset-bottom)) * .6280899);aspect-ratio:1118/1780;container-type:inline-size}
.home-shape{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;color:var(--home-accent);stroke:none}
.home-quote,.home-wordmark,.home-tagline{position:absolute;z-index:1}
.home-quote{top:9.5%;left:50.27%;width:42.5%;color:#000}
.home-quote h2{font:italic 700 4.47cqw/1.15 Arial,'Helvetica Neue',sans-serif;margin:0 0 4cqw;white-space:nowrap}
.home-quote p{font:italic 400 3.94cqw/1.32 Arial,'Helvetica Neue',sans-serif;white-space:nowrap}
.home-quote strong{display:block;margin-top:3.58cqw;font:italic 700 3.4cqw/1.15 Arial,'Helvetica Neue',sans-serif}
.home-wordmark{top:40.45%;left:18.2%;margin:0;white-space:nowrap;color:#000;font:italic 900 14cqw/1 'Arial Black',Arial,sans-serif;letter-spacing:-.035em}
.home-wordmark-initial{position:relative;left:-.16em}
.home-wordmark-accent{position:relative;top:-.12em;color:var(--home-accent);font-style:normal}
.home-tagline{left:7.15%;top:76%;color:var(--brand-ink);font:italic 700 4cqw/1.25 Arial,'Helvetica Neue',sans-serif}
.home-tagline .home-company{margin-top:2.7cqw;font:400 2.9cqw/1.3 Arial,'Microsoft YaHei',sans-serif;letter-spacing:.04em}
/* Three home landmarks: statement, taste showcase, and the start of the long company section. */
html.home-snap{scroll-snap-type:y mandatory;overscroll-behavior-y:contain}
html.home-snap.home-reading{scroll-snap-type:none}
.home-route #main>.home-cover,.home-route #main>.taste-showcase,.home-route #main>.home-content{scroll-snap-align:start;scroll-snap-stop:always}
@media(prefers-reduced-motion:reduce){html.home-snap{scroll-snap-type:y proximity}}
.profile-card .profile-brand{display:grid;place-items:center;width:65px;height:65px;flex-shrink:0;border-radius:50%;background:var(--brand)}
.profile-card .profile-brand img{width:41px;height:50px;border-radius:0;object-fit:contain;filter:brightness(0) invert(1)}
@media(max-width:360px){.hero h2{font-size:26px}.cart-item{gap:10px}.cart-item>img,.material-mini{width:64px;min-width:64px;height:76px}.quantity button{width:37px}.quantity input{width:28px}}

/* Shared rounded geometry across the ordering experience. */
#main:focus{outline:none}
.app-shell{border-radius:var(--radius-surface)}
.app-header{border-radius:var(--radius-surface) var(--radius-surface) 0 0}
.bottom-nav{border-radius:var(--radius-surface) var(--radius-surface) 0 0}
:where(img):not([src$=".svg"]){border-radius:var(--radius-surface)}
.hero,.order-peek,.product-card,.product-image,.detail-hero,.factory-teaser,.factory-grid figure,.material-cover,.material-detail-cover{border-radius:var(--radius-surface)}
.product-image{overflow:hidden}
.product-image img{border-radius:inherit}
.hero-bottom{border-radius:var(--radius-control);margin:10px;width:calc(100% - 20px)}
.cart-item>img,.order-images img,.material-mini{border-radius:var(--radius-small)}
.search{border:1px solid var(--line);border-radius:var(--radius-control);background:var(--panel);padding:8px 12px}
.search:focus-within{border-color:var(--brand-ink)}
.small-btn,.primary,.secondary,.spec-options button,.category-rail button,.field input,.field select,.field textarea,.cart-dock button{border-radius:var(--radius-control)}
.quantity,.quantity button,.quantity input,.segmented button,.order-tabs button,.menu-row,.nav-item,.product-label,.cart-item .remove{border-radius:var(--radius-small)}
.segmented{gap:8px;padding:6px 0}
.segmented button{padding:10px 8px;border-bottom:0}
.order-tabs{gap:8px;padding:6px 24px}
.order-tabs button{padding:10px 12px;min-height:44px;border-bottom:0}
.segmented button.active,.order-tabs button.active{background:var(--brand-soft)}
.reorder,.order-card,.cart-item,.profile-card,.profile-stats,.menu-list,.form-section,.summary,.detail-facts,.factory-teaser-caption{border-radius:var(--radius-surface)}
.cart-dock,.sheet,#toast{border-radius:var(--radius-surface)}
.icon-btn,.search button,.plus,.welcome-close{border-radius:50%}
.welcome,.welcome-art{border-radius:var(--radius-surface)}
.welcome-art{overflow:hidden}
.welcome-art>img{border-radius:inherit}

/* Divider-only rows have straight lines, independent of rounded media/controls. */
.reorder,.order-card,.cart-item,.profile-stats,.menu-row,.form-section,.factory-teaser-caption{border-radius:0}
/* Keep the navigation surface rounded; draw its separator independently. */
.bottom-nav{border-top-color:transparent}
.bottom-nav::before{content:'';position:absolute;top:-1px;left:0;right:0;height:1px;background:var(--line);pointer-events:none}

/* Image-only announcements and posters; slide content is configured in data.js. */
.showcase{position:relative;border-radius:var(--radius-surface);background:var(--surface);isolation:isolate}
.showcase-viewport{overflow:hidden;border-radius:inherit;aspect-ratio:3/2;touch-action:pan-y pinch-zoom;cursor:grab}
.showcase-viewport:active{cursor:grabbing}
.showcase-track{display:flex;height:100%;transform:translate3d(-100%,0,0);transition:transform 350ms cubic-bezier(.22,1,.36,1)}
.showcase-slide{flex:0 0 100%;min-width:0;height:100%}
.showcase-slide img{width:100%;height:100%;object-fit:cover;border-radius:0;user-select:none;-webkit-user-drag:none}
.showcase-pagination{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);display:flex;align-items:center;padding:0 2px;border-radius:999px}
.showcase-pagination::before{content:'';position:absolute;inset:4px 0;border-radius:inherit;background:rgba(233,233,231,.9);pointer-events:none}
.showcase-dot{position:relative;width:24px;height:28px;display:grid;place-items:center;border-radius:999px}
.showcase-dot span{width:4px;height:4px;border-radius:999px;background:#7a7e76;transition:background-color 180ms ease,transform 180ms ease}
.showcase-dot.active span{background:var(--brand);transform:scale(1.35)}
.showcase:focus-visible,.showcase button:focus-visible{outline:2px solid var(--brand-ink);outline-offset:3px}
@media(prefers-reduced-motion:reduce){.showcase-track,.showcase-dot span{transition:none}}

/* Keep the replacement collage uncropped, with its supplied colors. */
.factory-teaser>img{height:auto;aspect-ratio:auto;filter:none}

/* Home brand introduction: editorial content that supports product discovery without becoming a second catalog. */
.home-company-title{font-size:20px;line-height:1.6;letter-spacing:.06em}
.home-company-title+.factory-teaser{margin-top:18px}
.factory-teaser{display:block;width:100%;text-align:left;background:none;color:inherit;padding:0;border:0}
.factory-teaser-caption{display:flex;justify-content:flex-start;padding:16px 0 21px;border-bottom:1px solid var(--line)}
.factory-teaser-caption h3{font-size:17px;margin-top:5px}
.brand-block{padding:28px 0;border-bottom:1px solid var(--line)}
.brand-block-head{margin-bottom:18px}
.brand-block-head h2{font-size:20px;margin-top:7px;text-wrap:balance}
.equipment-showcase .showcase-viewport{aspect-ratio:16/9}
.equipment-showcase .showcase-slide img{object-position:center 58%}
.equipment-showcase .showcase-pagination::before{background:rgba(27,34,29,.62)}
.equipment-showcase .showcase-dot span{background:#d2d8d2}
.equipment-showcase .showcase-dot.active span{background:#fff}
.showcase-arrow{position:absolute;z-index:2;top:50%;transform:translateY(-50%);width:44px;height:44px;display:grid;place-items:center;border-radius:50%;background:rgba(233,233,231,.9);color:var(--ink)}
.showcase-arrow svg{width:20px;height:20px;stroke-width:2}
.showcase-prev{left:8px}
.showcase-next{right:8px}
.showcase-arrow:hover{background:var(--bg)}
.brand-product-strip{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding:1px 0 10px;margin-right:-24px;scrollbar-width:none}
.brand-product-strip::-webkit-scrollbar{display:none}
.brand-product{flex:0 0 148px;scroll-snap-align:start}
.brand-product>img{width:148px;height:148px;object-fit:cover}
.brand-product h3{font-size:13px;line-height:1.4;margin-top:10px}
.brand-product p{font-size:10px;line-height:1.55;color:var(--muted);margin-top:4px}
.brand-serving-note{display:flex;justify-content:space-between;gap:14px;align-items:center;padding-top:17px;margin-top:4px;border-top:1px solid var(--line);font-size:11px}
.brand-serving-note strong{font-weight:500;white-space:nowrap}
.brand-serving-note span{color:var(--muted);text-align:right;line-height:1.6}
.service-list{border-top:1px solid var(--line)}
.service-row{display:grid;grid-template-columns:30px minmax(0,1fr);gap:10px;align-items:center;padding:15px 0;border-bottom:1px solid var(--line)}
.service-index{font:italic 14px var(--serif);color:var(--muted)}
.service-row h3{font-size:13px;line-height:1.45}
.service-row p{font-size:11px;color:var(--muted);line-height:1.6;margin-top:3px}
.brand-duo{display:grid;grid-template-columns:1fr 1fr;gap:13px;padding:28px 0 4px}
.brand-callout{background:var(--surface);overflow:hidden}
.brand-callout-copy{padding:18px 17px 19px}
.brand-callout-copy h2{font-size:18px;margin-top:7px}
.brand-callout-copy p{font-size:12px;line-height:1.75;color:var(--muted);margin-top:10px}
.brand-callout-copy .text-link{margin-top:12px;padding:0;min-height:38px}
.brand-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.brand-tags span{font-size:10px;padding:5px 8px;border:1px solid var(--line);color:var(--muted)}
.brand-visit{display:flex;flex-direction:column;justify-content:space-between;min-height:100%}
.brand-visit-mark{display:flex;justify-content:flex-end;padding:0 18px 15px;color:var(--brand-ink)}
.brand-visit-mark img{width:48px;height:59px;object-fit:contain;opacity:.72}
@media(max-width:420px){
  .brand-duo{grid-template-columns:1fr}
}
@media(max-width:360px){
  .brand-product-strip{margin-right:-20px}
}
@media(min-width:700px){
  .brand-product{flex-basis:164px}
  .brand-product>img{width:164px;height:164px}
}