:root { --ink:#14213a; --muted:#68758c; --line:#e4e9f1; --blue:#245fe7; --blue-dark:#173da8; --purple:#682fd3; --orange:#ff8236; --surface:#f5f7fb; --white:#fff; --content-max:1880px; font-family:Inter,"PingFang SC","Microsoft YaHei",system-ui,sans-serif; color:var(--ink); background:var(--white); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; min-width:320px; background:linear-gradient(180deg,#fff 0,#f8faff 100%); }
button,input,textarea { font:inherit; }
button { cursor:pointer; }
[hidden] { display:none !important; }
body.portal-locked { height:100dvh; overflow:hidden; }
body.portal-locked>:not(.access-gate) { pointer-events:none; user-select:none; filter:blur(12px); opacity:.28; }
.access-gate { position:fixed; z-index:200; inset:0; display:grid; place-items:center; overflow:auto; padding:28px; background:radial-gradient(circle at 15% 10%,rgba(71,121,247,.22),transparent 34%),radial-gradient(circle at 90% 90%,rgba(116,70,235,.18),transparent 32%),rgba(244,247,253,.94); backdrop-filter:blur(16px); }
.access-gate-card { width:min(900px,100%); display:grid; grid-template-columns:minmax(0,1fr) 280px; gap:20px 30px; padding:32px; border:1px solid rgba(191,205,231,.85); border-radius:28px; background:rgba(255,255,255,.97); box-shadow:0 28px 90px rgba(26,48,96,.2); }
.access-gate-brand { display:flex; align-items:center; gap:13px; }
.access-gate-brand img { width:58px; height:58px; object-fit:contain; border-radius:15px; box-shadow:0 8px 24px rgba(35,72,180,.12); }
.access-gate-brand strong,.access-gate-brand small { display:block; }
.access-gate-brand strong { font-size:20px; }
.access-gate-brand small { margin-top:3px; color:var(--muted); font-size:12px; }
.access-gate-copy { align-self:end; }
.access-gate-copy h1 { margin:8px 0 10px; font-size:32px; line-height:1.2; }
.access-gate-copy p { max-width:520px; margin:0; color:var(--muted); font-size:14px; line-height:1.7; }
.access-gate-form label { display:block; margin-bottom:7px; color:#43516a; font-size:12px; font-weight:750; }
.access-gate-form>div { display:grid; grid-template-columns:minmax(0,1fr) 148px; gap:9px; }
.access-gate-form input { min-width:0; height:48px; padding:0 14px; border:1px solid #cfd9e9; border-radius:12px; outline:0; color:var(--ink); background:#fff; }
.access-gate-form input:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(36,95,231,.11); }
.access-gate-form button { min-height:48px; border:0; border-radius:12px; color:#fff; background:var(--blue); font-weight:850; }
.access-gate-form button:disabled { cursor:wait; opacity:.68; }
.access-gate-form>p { min-height:20px; margin:7px 1px 0; color:#d43c34; font-size:12px; line-height:1.5; }
.access-gate-contact { grid-column:2; grid-row:1/4; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:20px; border:1px solid #dce5f3; border-radius:20px; background:linear-gradient(145deg,#f8faff,#eef4ff); text-align:center; }
.access-gate-contact>img { width:174px; height:174px; object-fit:cover; border:8px solid #fff; border-radius:16px; box-shadow:0 10px 28px rgba(25,53,111,.12); }
.access-gate-contact strong,.access-gate-contact small,.access-gate-contact em { display:block; }
.access-gate-contact strong { margin-top:14px; font-size:16px; }
.access-gate-contact small { margin-top:7px; color:#65738a; font-size:12px; line-height:1.6; }
.access-gate-contact em { margin-top:10px; color:var(--blue); font-size:11px; font-style:normal; font-weight:800; }
.access-gate-note { grid-column:1/-1; margin:0; padding-top:16px; border-top:1px solid #e7ecf4; color:#8792a5; font-size:11px; text-align:center; }
.site-header { height:86px; padding:0 max(28px,calc((100vw - var(--content-max))/2)); display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(229,233,240,.8); background:rgba(255,255,255,.94); position:sticky; top:0; z-index:20; backdrop-filter:blur(14px); }
.brand { display:flex; align-items:center; gap:13px; color:inherit; text-decoration:none; }
.brand img { width:58px; height:58px; object-fit:contain; border-radius:14px; box-shadow:0 8px 24px rgba(35,72,180,.12); }
.brand strong,.brand small { display:block; }
.brand strong { font-size:20px; letter-spacing:.02em; }
.brand small { color:var(--muted); margin-top:4px; font-size:12px; }
.header-promise { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); margin:0; color:#52647f; font-size:14px; font-weight:750; letter-spacing:.08em; white-space:nowrap; }
.header-actions { display:flex; align-items:center; gap:10px; }
.language-picker { display:flex; align-items:center; gap:5px; border:1px solid #ccd6e8; background:#fff; color:var(--blue-dark); border-radius:999px; padding-left:10px; font-weight:800; }
.language-picker>span { font-size:13px; }
.language-button { min-width:105px; max-width:135px; border:0; outline:0; background:transparent; color:var(--blue-dark); border-radius:999px; padding:10px 25px 10px 2px; font-weight:800; cursor:pointer; }
.language-button:disabled { cursor:wait; opacity:.55; }
.selection-button { border:0; border-radius:999px; padding:11px 17px; background:var(--ink); color:#fff; font-weight:750; }
.selection-label>span { display:inline; }
.selection-label>small { display:none; color:inherit; font-size:11px; font-weight:800; }
.selection-button b { display:inline-grid; place-items:center; min-width:23px; height:23px; padding:0 6px; margin-left:5px; border-radius:99px; background:var(--orange); }
.sourcing-button { position:relative; display:flex; align-items:center; gap:6px; min-height:45px; padding:10px 16px; border:1px solid #b9cdf8; border-radius:999px; color:var(--blue-dark); background:#eef4ff; font-weight:800; }
.sourcing-button>span:first-child { font-size:20px; line-height:1; }
.sourcing-label small { display:none; font-size:12px; }
.sourcing-button b,.sourcing-tabs b { min-width:19px; height:19px; display:inline-grid; place-items:center; padding:0 5px; border-radius:99px; color:#fff; background:#ef4b3f; font-size:11px; }
main { min-height:calc(100vh - 160px); }
.carousel { width:min(var(--content-max),calc(100vw - 48px)); height:410px; margin:24px auto 0; overflow:hidden; position:relative; border:1px solid rgba(129,161,255,.42); border-radius:28px; color:#fff; background:linear-gradient(128deg,#14399c 0%,#2865e0 52%,#754be7 100%); box-shadow:0 24px 62px rgba(31,74,182,.2); }
#carousel-slides,.carousel-slide { width:100%; height:100%; }
.carousel-slide { display:none; grid-template-columns:minmax(400px,38fr) minmax(640px,62fr); align-items:center; gap:18px; padding:28px clamp(42px,4vw,66px); position:relative; isolation:isolate; background:transparent; }
.carousel-slide.brand-slide { grid-template-columns:minmax(0,1.15fr) minmax(340px,.85fr); gap:42px; padding:62px clamp(42px,7vw,100px); }
.carousel-slide.active { display:grid; animation:slide-in .45s ease; }
.carousel-slide::before { content:""; position:absolute; z-index:-2; inset:0; background:radial-gradient(circle at 76% 43%,rgba(255,255,255,.19),transparent 26%),linear-gradient(128deg,#173da5 0%,#2f6fea 54%,#744ce7 100%); }
.carousel-slide::after { content:""; width:470px; height:470px; position:absolute; z-index:-1; left:26%; bottom:-390px; border:72px solid rgba(255,255,255,.07); border-radius:50%; }
@keyframes slide-in { from { opacity:.25; transform:translateX(18px); } to { opacity:1; transform:none; } }
.carousel-copy { position:relative; z-index:5; max-width:610px; }
.eyebrow { display:block; font-size:12px; font-weight:850; letter-spacing:.17em; color:#8e9ab0; text-transform:uppercase; }
.carousel .eyebrow { color:#c7d8ff; }
.carousel h1 { display:-webkit-box; overflow:hidden; margin:9px 0 10px; max-width:590px; -webkit-box-orient:vertical; -webkit-line-clamp:2; font-size:clamp(31px,2.8vw,43px); line-height:1.12; letter-spacing:-.03em; }
.carousel p { display:-webkit-box; overflow:hidden; margin:0 0 14px; max-width:570px; -webkit-box-orient:vertical; -webkit-line-clamp:1; line-height:1.6; color:#dfe9ff; font-size:14px; }
.carousel-copy a,.carousel-actions button { display:inline-flex; border:0; border-radius:13px; padding:12px 20px; color:var(--blue-dark); background:#fff; text-decoration:none; font-weight:800; }
.carousel-actions { display:flex; gap:10px; }
.carousel-actions button:last-child { color:#fff; background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.32); }
.carousel-panel-stats { width:min(540px,100%); display:grid; grid-template-columns:1.05fr 1.25fr .8fr; gap:0; margin:0 0 15px; border-top:1px solid rgba(255,255,255,.2); border-bottom:1px solid rgba(255,255,255,.2); }
.carousel-panel-stats span { min-width:0; padding:9px 13px; background:transparent; }
.carousel-panel-stats span+span { border-left:1px solid rgba(255,255,255,.18); }
.carousel-panel-stats small,.carousel-panel-stats strong { display:block; }
.carousel-panel-stats small { color:#bdcef5; font-size:10px; }
.carousel-panel-stats strong { margin-top:3px; overflow:hidden; font-size:14px; text-overflow:ellipsis; white-space:nowrap; }
.carousel-showcase { min-width:0; width:100%; height:350px; position:relative; z-index:2; }
.carousel-product-image { width:350px; height:350px; position:absolute; z-index:4; left:50%; top:50%; overflow:hidden; padding:0; border:6px solid rgba(255,255,255,.48); border-radius:27px; background:#fff; box-shadow:0 24px 55px rgba(8,27,85,.34); cursor:pointer; transform:translate(-50%,-50%); transition:transform .25s ease,box-shadow .25s ease; }
/* r24 triple carousel: the current, previous and next products move as one visual stage. */
.carousel-product-image:hover { box-shadow:0 30px 70px rgba(8,27,85,.4); transform:translate(-50%,-50%) scale(1.025); }
.carousel-product-image img { position:absolute; inset:7px; display:block; width:calc(100% - 14px); height:calc(100% - 14px); max-width:none; max-height:none; object-fit:contain; border-radius:18px; background:#fff; }
.carousel-product-image .logo-fallback { width:70%; height:70%; }
.carousel-peek { width:205px; height:270px; position:absolute; z-index:2; top:50%; overflow:hidden; padding:0; border:4px solid rgba(255,255,255,.45); border-radius:24px; background:#fff; box-shadow:0 18px 45px rgba(8,27,85,.27); cursor:pointer; opacity:.86; transition:opacity .22s ease,transform .22s ease; }
.carousel-peek:hover { z-index:5; opacity:1; }
.carousel-peek-previous { left:3%; transform:translateY(-50%) rotate(-5deg) scale(.94); transform-origin:right center; }
.carousel-peek-next { right:3%; transform:translateY(-50%) rotate(5deg) scale(.94); transform-origin:left center; }
.carousel-peek-previous:hover { transform:translateY(-50%) rotate(-2deg) scale(1); }
.carousel-peek-next:hover { transform:translateY(-50%) rotate(2deg) scale(1); }
.carousel-peek>img { width:100%; height:100%; display:block; object-fit:cover; }
.carousel-peek>span { position:absolute; inset:auto 0 0; display:block; padding:34px 14px 13px; color:#fff; background:linear-gradient(transparent,rgba(10,27,64,.9)); text-align:left; }
.carousel-peek small,.carousel-peek strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.carousel-peek small { margin-bottom:3px; color:#c9dcff; font-size:9px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.carousel-peek strong { font-size:12px; }
.brand-watermark { position:relative; z-index:2; justify-self:end; width:290px; height:360px; border:1px solid rgba(255,255,255,.3); border-radius:30px; display:flex; flex-direction:column; align-items:center; justify-content:center; background:rgba(255,255,255,.13); }
.brand-watermark img { width:210px; height:210px; border-radius:25px; object-fit:contain; }
.brand-watermark strong { font-size:46px; margin-top:6px; }
.brand-watermark span { color:#dbe7ff; }
.carousel-arrow { display:none; }
.carousel-dots { position:absolute; z-index:6; left:69%; bottom:10px; transform:translateX(-50%); display:flex; gap:7px; }
.carousel-dots button { width:9px; height:9px; padding:0; border:0; border-radius:99px; background:rgba(255,255,255,.45); transition:.2s; }
.carousel-dots button.active { width:28px; background:#fff; }
.carousel-position { position:absolute; z-index:6; right:24px; top:18px; padding:5px 9px; border:1px solid rgba(255,255,255,.2); border-radius:999px; color:#fff; background:rgba(15,40,108,.36); font-size:10px; font-weight:800; letter-spacing:.1em; backdrop-filter:blur(8px); }
.catalog-section { width:min(var(--content-max),calc(100vw - 48px)); margin:0 auto; padding:50px 0 76px; }
.catalog-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; }
.catalog-heading h2 { margin:6px 0 0; font-size:40px; }
.catalog-heading p { margin:0; color:var(--muted); font-size:13px; }
.catalog-layout { display:grid; grid-template-columns:238px minmax(0,1fr); align-items:start; gap:24px; margin-top:28px; }
.catalog-sidebar { position:sticky; top:106px; overflow:hidden; padding:20px; border:1px solid var(--line); border-radius:16px; background:#fff; box-shadow:0 12px 35px rgba(26,44,86,.05); }
.catalog-sidebar-heading span,.catalog-sidebar-heading strong { display:block; }
.catalog-sidebar-heading span { color:#8b98ae; font-size:10px; font-weight:850; letter-spacing:.14em; }
.catalog-sidebar-heading strong { margin-top:5px; font-size:18px; }
.catalog-main { min-width:0; }
.filters { display:flex; align-items:center; gap:20px; margin:0 0 20px; }
.search-box { width:min(430px,100%); height:52px; display:flex; align-items:center; gap:9px; padding:0 16px; border:1px solid var(--line); border-radius:14px; background:#fff; transition:.2s; }
.search-box:focus-within { border-color:var(--blue); box-shadow:0 0 0 3px rgba(35,91,228,.1); }
.search-box input { border:0; outline:0; width:100%; color:var(--ink); }
.catalog-result-count { margin-left:auto; color:#7b879a; font-size:12px; font-weight:750; white-space:nowrap; }
.categories { min-width:0; margin-top:15px; }
.category-level { display:flex; flex-direction:column; align-items:stretch; gap:5px; }
.category-secondary { margin-top:9px; padding:8px; border-radius:10px; background:#f2f6fd; }
.category-level-label { padding:3px 7px 6px; color:var(--blue-dark); font-size:11px; font-weight:800; }
.category { width:100%; white-space:normal; border:0; color:#536178; background:transparent; border-radius:9px; padding:9px 10px; text-align:left; }
.category:hover { color:var(--blue-dark); background:#f2f6ff; }
.category.active { background:var(--blue); color:#fff; }
.category.subcategory { padding:7px 9px; font-size:11px; }
.catalog-sourcing-card { margin-top:18px; padding:16px; border-radius:13px; color:#fff; background:linear-gradient(145deg,#1f55d5,#623fd6); }
.catalog-sourcing-card>span { display:grid; place-items:center; width:32px; height:32px; border-radius:50%; background:rgba(255,255,255,.16); font-size:20px; }
.catalog-sourcing-card strong { display:block; margin-top:12px; font-size:14px; }
.catalog-sourcing-card p { margin:7px 0 12px; color:#dbe5ff; font-size:11px; line-height:1.55; }
.catalog-sourcing-card button { width:100%; min-height:36px; border:0; border-radius:9px; color:var(--blue-dark); background:#fff; font-size:11px; font-weight:850; }
.status { color:var(--muted); padding:40px 0; text-align:center; }
.status:empty { display:none; }
.product-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); align-items:stretch; gap:18px; }
.load-more { display:block; min-width:220px; margin:30px auto 0; padding:12px 22px; border:1px solid #cbd6ed; border-radius:999px; color:var(--blue); background:#fff; font-weight:800; }
.product-card { min-width:0; height:100%; display:flex; flex-direction:column; position:relative; border:1px solid var(--line); border-radius:15px; background:#fff; cursor:pointer; transition:transform .2s,box-shadow .2s,border-color .2s; }
.product-card:hover { transform:translateY(-4px); border-color:#cbd6ed; box-shadow:0 18px 42px rgba(22,40,80,.1); }
.product-card:focus-visible { outline:3px solid rgba(35,91,228,.28); outline-offset:3px; border-color:var(--blue); }
.product-image { aspect-ratio:1/1; position:relative; overflow:hidden; padding:12px; border-bottom:1px solid #edf0f5; border-radius:14px 14px 0 0; background:#fff; }
.product-image>img { width:100%; height:100%; object-fit:contain; mix-blend-mode:multiply; }
.image-placeholder { width:100%; height:100%; display:grid; place-items:center; background:linear-gradient(145deg,#f0f4ff,#f8f2ff); }
.image-placeholder img { width:55%; height:55%; object-fit:contain; opacity:.58; }
.featured-badge { position:absolute; left:12px; top:12px; padding:6px 10px; border-radius:999px; background:rgba(255,255,255,.94); color:var(--blue-dark); font-size:11px; font-weight:850; box-shadow:0 4px 14px rgba(0,0,0,.08); }
.product-body { flex:1; display:flex; flex-direction:column; padding:15px; }
.product-category { color:var(--blue); font-weight:800; font-size:11px; letter-spacing:.04em; }
.product-body h3 { display:-webkit-box; overflow:hidden; margin:7px 0 9px; min-height:46px; -webkit-box-orient:vertical; -webkit-line-clamp:2; font-size:16px; line-height:1.42; }
.product-meta { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.product-sku { color:var(--muted); font-size:12px; }
.product-variant-count { flex:0 0 auto; padding:4px 7px; border:0; border-radius:999px; color:var(--blue); background:#edf3ff; font-size:11px; font-weight:750; }
.product-variant-count.active { color:#fff; background:var(--blue); }
.product-lifecycle { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:14px 0 2px; padding:10px; border:1px solid #e5ebf5; border-radius:12px; background:#f7f9fd; }
.product-lifecycle span,.product-lifecycle small,.product-lifecycle strong { min-width:0; display:block; }
.product-lifecycle span+span { padding-left:8px; border-left:1px solid #dfe6f2; }
.product-lifecycle small { color:#7a879b; font-size:10px; }
.product-lifecycle strong { margin-top:3px; font-size:11px; white-space:nowrap; }
.product-lifecycle:not(.compact) strong { font-size:12px; white-space:normal; }
.product-pricing { min-height:68px; margin-top:12px; padding:9px 10px; border:1px solid #ffe1cf; border-radius:10px; background:linear-gradient(135deg,#fffaf6,#fff4ec); }
.comparison-price,.current-price { display:flex; align-items:baseline; justify-content:space-between; gap:8px; }
.comparison-price { color:#8a94a8; font-size:12px; }
.comparison-price del { text-decoration-thickness:2px; text-decoration-color:#f05a3c; }
.current-price { margin-top:4px; color:#dc4829; }
.current-price span { color:#6d7688; font-size:12px; }
.current-price strong { font-size:20px; letter-spacing:.01em; }
.product-pricing>small { display:block; margin-top:4px; color:#e45b33; font-size:11px; font-weight:750; text-align:right; }
.product-pricing.sku-range .current-price { margin-top:0; }
.product-pricing.sku-range .sku-price-hint { color:#6f7c91; font-weight:650; }
.product-trade-meta { display:grid; grid-template-columns:1fr 1fr; gap:7px; margin-top:8px; }
.product-trade-meta span { min-width:0; padding:7px 9px; border-radius:8px; background:#f5f7fb; }
.product-trade-meta small,.product-trade-meta strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.product-trade-meta small { color:#8390a4; font-size:9px; }
.product-trade-meta strong { margin-top:3px; color:#42516a; font-size:11px; }
.card-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:auto; padding-top:17px; }
.card-actions button { min-height:40px; border:1px solid var(--line); border-radius:11px; color:var(--ink); background:#fff; font-weight:750; }
.card-actions .add { border-color:var(--blue); background:var(--blue); color:#fff; }
.card-actions .add.added { border-color:#bed0ff; background:#edf3ff; color:var(--blue); }
.card-actions .card-share { grid-column:1/-1; color:var(--blue); border-color:#ccd9f2; background:#f7faff; }
.product-card:hover,.product-card:focus-within { z-index:20; }
.quick-spec-trigger { display:none; }
.card-quick-preview { max-height:calc(100% - 20px); position:absolute; z-index:32; right:10px; bottom:10px; left:10px; overflow:auto; padding:12px; border:1px solid #cbd7ea; border-radius:14px; background:rgba(255,255,255,.98); box-shadow:0 14px 38px rgba(16,35,78,.18); opacity:0; visibility:hidden; pointer-events:none; transform:translateY(10px) scale(.985); transform-origin:center bottom; transition:opacity .15s ease,transform .15s ease,visibility 0s linear .15s; backdrop-filter:blur(12px); }
.product-card:hover .card-quick-preview,.product-card:focus-within .card-quick-preview { opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0) scale(1); transition-delay:.16s,.16s,.16s; }
.product-card.sku-popover-open .card-quick-preview { opacity:0; visibility:hidden; pointer-events:none; }
.card-quick-preview-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.card-quick-preview-head span,.card-quick-preview-head strong,.card-quick-preview-head small { min-width:0; display:block; }
.card-quick-preview-head strong { font-size:15px; }
.card-quick-preview-head small { margin-top:3px; color:#728096; font-size:10px; font-weight:500; }
.card-quick-tools { flex:0 0 auto; display:flex; align-items:center; gap:6px; }
.card-quick-tools>b { padding:5px 8px; border-radius:999px; color:var(--blue); background:#edf3ff; font-size:10px; }
.card-quick-close { display:none; width:28px; height:28px; padding:0; border:0; border-radius:50%; color:#65738a; background:#edf1f7; font-size:19px; line-height:1; }
.card-quick-spec-grid { display:grid; grid-template-columns:1fr 1fr; gap:6px; margin-top:9px; }
.card-quick-spec-grid>div { min-width:0; padding:8px 9px; border:1px solid #e3eaf5; border-radius:9px; background:#f7f9fd; }
.card-quick-spec-grid small,.card-quick-spec-grid strong { min-width:0; display:block; }
.card-quick-spec-grid small { color:#77849a; font-size:10px; }
.card-quick-spec-grid strong { margin-top:3px; overflow-wrap:anywhere; color:var(--ink); font-size:12px; line-height:1.35; }
.card-quick-more { margin:8px 1px 0; color:#7a879a; font-size:10px; line-height:1.4; }
.card-quick-preview-actions { display:grid; grid-template-columns:1fr 1fr; gap:7px; margin-top:8px; }
.card-quick-preview-actions button { min-height:38px; border:1px solid #cbd7ea; border-radius:10px; color:var(--blue); background:#fff; font-weight:800; }
.card-quick-preview-actions .primary { border-color:var(--blue); color:#fff; background:var(--blue); }
.card-sku-popover { width:min(380px,calc(100vw - 32px)); max-height:430px; position:absolute; z-index:25; right:10px; top:calc(100% - 8px); overflow:auto; padding:10px; border:1px solid #cfdaec; border-radius:16px; background:#fff; box-shadow:0 22px 60px rgba(16,35,78,.2); }
.card-sku-popover-head { display:flex; align-items:center; justify-content:space-between; padding:2px 3px 9px; }
.card-sku-popover-head button { width:28px; height:28px; border:0; border-radius:50%; color:#65738a; background:#eef2f7; font-size:19px; }
.card-sku-list { display:grid; gap:7px; }
.card-sku-option { width:100%; min-width:0; display:grid; grid-template-columns:54px minmax(0,1fr) auto; align-items:center; gap:10px; padding:8px; border:1px solid #e0e7f1; border-radius:11px; color:var(--ink); background:#fff; text-align:left; }
.card-sku-option:hover { border-color:#9db9ef; background:#f5f8ff; }
.card-sku-option img,.card-sku-option>i { width:54px; height:54px; display:grid; place-items:center; object-fit:contain; border-radius:8px; color:#7c899c; background:#f4f6f9; font-size:10px; font-style:normal; }
.card-sku-option span,.card-sku-option strong,.card-sku-option small { min-width:0; display:block; }
.card-sku-option strong,.card-sku-option small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.card-sku-option small { margin-top:4px; color:#748197; font-size:11px; }
.card-sku-option b { color:var(--blue); font-size:22px; }
.card-sku-option em { padding:4px 6px; border-radius:999px; color:#8b6470; background:#f5e9ec; font-size:10px; font-style:normal; white-space:nowrap; }
.card-sku-option.unavailable { opacity:.68; }
.site-footer { padding:42px max(28px,calc((100vw - var(--content-max))/2)); border-top:1px solid var(--line); color:var(--muted); background:#fff; }
.footer-inner { width:100%; display:grid; grid-template-columns:minmax(210px,.55fr) minmax(620px,1.8fr) minmax(230px,.55fr); align-items:center; gap:32px; }
.footer-brand { display:flex; align-items:center; gap:14px; }
.footer-brand>img { width:58px; height:58px; flex:0 0 auto; object-fit:contain; border-radius:14px; box-shadow:0 8px 24px rgba(35,72,180,.1); }
.footer-brand strong,.footer-brand span { display:block; }
.footer-brand strong { color:var(--ink); font-size:18px; }
.footer-brand span { margin-top:4px; font-size:12px; line-height:1.5; }
.footer-contact { display:grid; grid-template-columns:minmax(185px,.8fr) repeat(2,minmax(260px,1fr)); align-items:center; gap:14px; }
.footer-contact-copy h2 { margin:5px 0 8px; color:var(--ink); font-size:25px; }
.footer-contact-copy p { max-width:300px; margin:0; font-size:13px; line-height:1.65; }
.contact-card { min-width:0; display:grid; grid-template-columns:132px minmax(0,1fr); align-items:center; gap:15px; padding:12px; overflow:hidden; border:1px solid #dfe6f2; border-radius:17px; color:var(--ink); background:linear-gradient(145deg,#fff,#f7f9fd); text-align:left; transition:.2s; }
.contact-card:hover { transform:translateY(-2px); border-color:#c6d5ee; box-shadow:0 12px 30px rgba(22,40,80,.09); }
.contact-qr-frame { width:132px; height:132px; overflow:hidden; display:block; border:1px solid #edf0f5; border-radius:12px; background:#fff; }
.contact-qr-frame img { width:100%; height:100%; display:block; object-fit:cover; object-position:center; }
.contact-card.wechat .contact-qr-frame img { transform:scale(1.32) translateY(-5%); object-position:center; }
.contact-card.whatsapp .contact-qr-frame img { transform:scale(1.9); object-position:center 51%; }
.contact-card>span:last-child,.contact-card b,.contact-card small,.contact-card em { min-width:0; display:block; }
.contact-card b { font-size:16px; }
.contact-card small { margin-top:7px; overflow-wrap:anywhere; color:#53627a; font-size:13px; }
.contact-card em { margin-top:14px; color:var(--blue); font-size:11px; font-style:normal; font-weight:750; }
.footer-meta { text-align:right; font-size:12px; line-height:1.6; }
.footer-meta>span { display:block; }
.icp-record { display:inline-block; margin-top:7px; color:var(--muted); text-decoration:none; }
.icp-record:hover { color:var(--blue); text-decoration:underline; }
.overlay,.drawer-shell { position:fixed; inset:0; z-index:50; background:rgba(8,18,39,.58); display:grid; place-items:center; padding:24px; backdrop-filter:blur(5px); }
.modal { width:min(1240px,96vw); max-height:92vh; overflow:auto; background:#fff; border-radius:24px; padding:30px; position:relative; box-shadow:0 30px 90px rgba(0,0,0,.25); }
.close { border:0; background:#eff2f7; color:var(--ink); border-radius:50%; width:36px; height:36px; font-size:24px; line-height:1; }
.modal>.close { position:absolute; right:16px; top:16px; z-index:2; }
.detail-layout { display:grid; grid-template-columns:minmax(300px,.95fr) minmax(340px,1.05fr); gap:34px; }
.detail-wide { grid-column:1/-1; min-width:0; }
.detail-gallery { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; align-content:start; }
.detail-gallery-button { width:100%; aspect-ratio:1/1; position:relative; overflow:hidden; padding:0; border:1px solid var(--line); border-radius:15px; background:#f6f7fa; }
.detail-gallery-button:first-child { grid-column:1/-1; aspect-ratio:1/.68; }
.detail-gallery-button img { width:100%; height:100%; display:block; object-fit:contain; transition:transform .25s; }
.detail-gallery-button>span { position:absolute; right:10px; bottom:10px; padding:6px 9px; border-radius:999px; color:#fff; background:rgba(20,33,58,.78); font-size:11px; font-weight:750; opacity:0; transform:translateY(4px); transition:.2s; }
.detail-gallery-button::before { content:attr(data-gallery-label); position:absolute; z-index:1; right:10px; top:10px; padding:5px 8px; border-radius:999px; color:#fff; background:rgba(20,33,58,.72); font-size:10px; font-weight:800; }
.detail-gallery-button:hover img { transform:scale(1.025); }
.detail-gallery-button:hover>span,.detail-gallery-button:focus-visible>span { opacity:1; transform:none; }
.detail-gallery>.image-placeholder { width:100%; aspect-ratio:1/1; border-radius:15px; border:1px solid var(--line); }
.detail-copy { padding:18px 8px; }
.detail-copy h2 { margin:9px 0 5px; font-size:32px; }
.detail-title-row { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; }
.detail-title-row>button { flex:0 0 auto; margin-top:8px; padding:9px 13px; border:1px solid #cbd8f0; border-radius:10px; color:var(--blue); background:#f5f8ff; font-weight:800; }
.detail-en { color:var(--muted); margin:0 0 20px; }
.detail-description { color:#4e5d74; line-height:1.75; white-space:pre-wrap; }
.product-video-link { display:inline-flex; align-items:center; gap:7px; margin:2px 0 4px; padding:9px 13px; border:1px solid #cbd8f0; border-radius:10px; color:var(--blue); background:#f5f8ff; font-size:13px; font-weight:800; text-decoration:none; }
.product-video-link:hover { border-color:var(--blue); background:#edf3ff; }
.details { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin:20px 0; }
.detail-field { padding:12px; border-radius:12px; background:var(--surface); }
.detail-field small,.detail-field strong { display:block; } .detail-field small { color:var(--muted); margin-bottom:5px; } .detail-field strong { word-break:break-word; }
.detail-add,.submit-button { width:100%; border:0; border-radius:12px; padding:13px 18px; background:var(--blue); color:#fff; font-weight:850; }
.sku-variants { margin:0 0 8px; padding-top:22px; border-top:1px solid var(--line); }
.sku-variants-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; margin-bottom:12px; }
.sku-variants-heading h3 { margin:0 0 4px; font-size:24px; }
.sku-variants-heading p { margin:0; color:var(--muted); font-size:13px; line-height:1.55; }
.sku-variants-heading>strong { flex:0 0 auto; padding:7px 11px; border-radius:999px; color:var(--blue); background:#edf3ff; font-size:12px; }
.sku-variant-table { overflow:hidden; border:1px solid var(--line); border-radius:13px; }
.sku-variant-header,.sku-variant-row { display:grid; grid-template-columns:42px minmax(210px,1.35fr) minmax(115px,.65fr) 116px minmax(190px,1fr) 118px; align-items:center; gap:13px; padding:10px 16px; }
.sku-variant-header { color:#66748a; background:#f3f6fb; font-size:11px; font-weight:750; }
.sku-variant-row { min-height:82px; border-top:1px solid var(--line); background:#fff; }
.sku-variant-row.selected { background:#edf4ff; box-shadow:inset 3px 0 0 var(--blue); }
.sku-variant-row.active-spec { background:#f7faff; box-shadow:inset 3px 0 0 var(--blue); }
.sku-variant-row.unavailable { opacity:.65; background:#f5f6f8; }
.sku-variant-index { color:#8b97aa; text-align:center; }
.sku-variant-name { min-width:0; display:flex; align-items:center; gap:9px; padding:0; border:0; color:inherit; background:transparent; text-align:left; }
.sku-variant-select { min-width:0; display:block; padding:5px 0; border:0; color:inherit; background:transparent; text-align:left; }
.sku-variant-select small { min-width:0; display:block; margin-top:4px; color:var(--blue); font-size:10px; font-weight:750; }
.sku-variant-name>i { width:58px; height:58px; flex:0 0 auto; display:grid; place-items:center; border-radius:9px; background:#f5f7fb; color:#8995a7; font-style:normal; }
.sku-image-button { width:58px; height:58px; flex:0 0 auto; position:relative; overflow:hidden; padding:0; border:1px solid var(--line); border-radius:9px; background:#f5f7fb; }
.sku-image-button img { width:100%; height:100%; display:block; object-fit:contain; border-radius:8px; transition:transform .2s; }
.sku-image-button>span { position:absolute; right:3px; bottom:3px; width:19px; height:19px; display:grid; place-items:center; border-radius:50%; color:#fff; background:rgba(20,33,58,.78); font-size:13px; }
.sku-image-button:hover img { transform:scale(1.08); }
.sku-variant-select strong,.sku-variant-code { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sku-variant-code { color:#55637a; font-size:12px; }
.sku-variant-quantity { display:block; }
.sku-variant-quantity>span { display:none; }
.sku-variant-quantity input { width:100%; height:38px; padding:0 10px; border:1px solid #cfd9e9; border-radius:9px; color:var(--ink); background:#fff; text-align:center; outline:0; }
.sku-variant-quantity input:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(35,91,228,.09); }
.sku-variant-price { min-width:0; color:#d94b2c; white-space:normal; }
.sku-variant-price strong,.sku-variant-price small { display:block; }
.sku-variant-price strong { font-size:16px; }
.sku-variant-price strong em { color:#67758b; font-size:11px; font-style:normal; font-weight:600; }
.sku-variant-price small { margin-top:4px; color:#778398; font-size:11px; line-height:1.35; }
.sku-quote-loading { color:#8a96aa; font-size:12px; }
.sku-quote-error { color:#b74b3c; font-size:11px; line-height:1.4; }
.sku-variant-action { min-height:36px; border:1px solid var(--blue); border-radius:9px; color:#fff; background:var(--blue); font-weight:750; }
.sku-variant-row.selected .sku-variant-action { color:var(--blue); background:#fff; }
.sku-variant-action:disabled { border-color:#cbd2dc; color:#7e8998; background:#e8ebef; cursor:not-allowed; }
.detail-copy .sku-variants { margin-top:24px; }
.sku-variant-list { display:grid; gap:9px; overflow:visible; border:0; border-radius:0; }
.sku-variant-list .sku-variant-row { min-height:0; display:block; overflow:hidden; padding:0; border:1px solid var(--line); border-radius:13px; background:#fff; box-shadow:none; }
.sku-variant-list .sku-variant-row.selected,.sku-variant-list .sku-variant-row.active-spec { background:#fff; box-shadow:inset 3px 0 0 var(--blue); }
.sku-variant-list .sku-variant-row.expanded { border-color:#b9cae8; background:#f9fbff; }
.sku-variant-summary { display:grid; grid-template-columns:30px 58px minmax(0,1fr); align-items:center; gap:10px; padding:10px 12px; }
.sku-variant-summary>.sku-variant-index { display:block; }
.sku-variant-summary>i { width:58px; height:58px; display:grid; place-items:center; border-radius:9px; color:#8995a7; background:#f1f4f9; font-style:normal; }
.sku-variant-toggle { min-width:0; display:flex; align-items:center; justify-content:space-between; gap:14px; padding:3px 0; border:0; color:inherit; background:transparent; text-align:left; }
.sku-variant-title,.sku-variant-title strong,.sku-variant-title small,.sku-variant-toggle-meta,.sku-variant-toggle-meta strong,.sku-variant-toggle-meta em { min-width:0; display:block; }
.sku-variant-title { overflow:hidden; }
.sku-variant-title strong { overflow:hidden; font-size:14px; text-overflow:ellipsis; white-space:nowrap; }
.sku-variant-title small { display:flex; align-items:center; gap:7px; margin-top:5px; color:#68758a; font-size:11px; }
.sku-variant-title small em { padding:3px 6px; border-radius:999px; color:var(--blue); background:#eaf1ff; font-size:9px; font-style:normal; font-weight:800; }
.sku-variant-toggle-meta { flex:0 0 auto; text-align:right; }
.sku-variant-toggle-meta strong { color:#dd4b2d; font-size:14px; }
.sku-variant-toggle-meta em { margin-top:5px; color:var(--blue); font-size:10px; font-style:normal; font-weight:750; }
.sku-variant-toggle-meta b { display:inline-block; font-size:13px; transition:transform .2s; }
.sku-variant-row.expanded .sku-variant-toggle-meta b { transform:rotate(180deg); }
.sku-variant-panel { padding:13px 14px 14px; border-top:1px solid #e2e8f2; background:#f7f9fd; }
.sku-variant-details { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
.sku-variant-details>div { min-width:0; padding:9px 10px; border-radius:9px; background:#fff; }
.sku-variant-details small,.sku-variant-details strong { display:block; }
.sku-variant-details small { margin-bottom:4px; color:#7a879b; font-size:10px; }
.sku-variant-details strong { overflow-wrap:anywhere; font-size:12px; }
.sku-variant-description { margin:10px 0 0; color:#59677c; font-size:12px; line-height:1.6; white-space:pre-wrap; }
.sku-variant-controls { display:grid; grid-template-columns:106px minmax(0,1fr) 108px; align-items:stretch; gap:9px; margin-top:11px; }
.sku-variant-controls .sku-variant-quantity { display:grid; grid-template-rows:auto 38px; gap:4px; }
.sku-variant-controls .sku-variant-quantity>span { display:block; color:#6f7d91; font-size:10px; }
.sku-variant-controls .sku-variant-price { display:flex; flex-direction:column; justify-content:center; padding:7px 10px; border-radius:9px; background:#fff7f0; }
.sku-variant-controls .sku-variant-action { min-height:52px; }
.mobile-detail-bar { display:none; }
.drawer-shell { display:block; padding:0; }
.drawer-backdrop { position:absolute; inset:0; width:100%; border:0; background:transparent; }
.selection-drawer { position:absolute; right:0; top:0; bottom:0; width:min(590px,100vw); padding:28px; overflow:auto; background:#fff; box-shadow:-20px 0 70px rgba(0,0,0,.2); }
.drawer-header { display:flex; align-items:flex-start; justify-content:space-between; border-bottom:1px solid var(--line); padding-bottom:18px; }
.drawer-header h2 { margin:6px 0 0; }
.selection-items { padding:18px 0; }
.selection-item { display:grid; grid-template-columns:72px 1fr auto; gap:12px; align-items:center; padding:12px 0; border-bottom:1px solid var(--line); }
.selection-item>img,.selection-item>.image-placeholder { width:72px; height:72px; border-radius:10px; object-fit:contain; background:var(--surface); }
.selection-item strong,.selection-item small { display:block; } .selection-item small { color:var(--muted); margin-top:4px; }
.remove-item { border:0; color:#c44; background:transparent; }
.qty-row { display:flex; align-items:center; gap:4px; margin-top:8px; }
.qty-row button { width:28px; height:28px; border:1px solid var(--line); background:#fff; border-radius:7px; }
.qty-row input { width:62px; height:28px; text-align:center; border:1px solid var(--line); border-radius:7px; }
.selection-quote { margin-top:8px; padding:8px 10px; border-radius:9px; background:#fff6ee; color:#d64b28; }
.selection-quote span,.selection-quote strong,.selection-quote small { display:block; }
.selection-quote strong { margin:3px 0; }
.selection-quote small { color:#775c51; line-height:1.45; }
.selection-quote.loading { color:var(--muted); background:var(--surface); }
.empty-selection { padding:30px; text-align:center; color:var(--muted); background:var(--surface); border-radius:14px; }
.inquiry-form { border-top:1px solid var(--line); padding-top:18px; }
.inquiry-form h3 { margin:0 0 5px; } .inquiry-form>p { margin:0 0 18px; color:var(--muted); }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.inquiry-form label { display:block; color:#526077; font-size:13px; }
.inquiry-form input,.inquiry-form textarea { width:100%; margin-top:6px; padding:11px 12px; border:1px solid var(--line); border-radius:10px; outline:0; }
.inquiry-form input:focus,.inquiry-form textarea:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(35,91,228,.08); }
.inquiry-form>label { margin-top:12px; }
.submit-button { margin-top:16px; } .submit-button:disabled { opacity:.55; }
.form-message { min-height:22px; padding-top:10px; color:#1f8a4c; } .form-message.error { color:#c44; }
.trap { position:absolute; left:-9999px; }
.image-preview-overlay { z-index:80; }
.overlay-backdrop { position:absolute; inset:0; width:100%; height:100%; border:0; background:transparent; }
.image-preview-modal { width:min(900px,94vw); max-height:92vh; position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; padding:22px; border-radius:22px; background:#fff; box-shadow:0 30px 90px rgba(0,0,0,.28); }
.image-preview-modal .close { position:absolute; right:13px; top:13px; z-index:2; }
.image-preview-modal img { display:block; max-width:100%; max-height:calc(92vh - 82px); object-fit:contain; border-radius:14px; }
.image-preview-modal p { margin:12px 44px 0; color:#5f6c81; font-weight:700; text-align:center; }
.share-overlay { z-index:75; }
.share-modal { width:min(680px,94vw); position:relative; z-index:1; padding:30px; border-radius:24px; background:#fff; box-shadow:0 30px 90px rgba(0,0,0,.28); }
.share-modal>.close { position:absolute; right:16px; top:16px; }
.share-heading h2 { margin:6px 0 8px; font-size:28px; }
.share-heading p { margin:0; max-width:570px; color:var(--muted); font-size:13px; line-height:1.65; }
.share-product { display:grid; grid-template-columns:116px minmax(0,1fr); align-items:center; gap:16px; margin:22px 0; padding:14px; border:1px solid var(--line); border-radius:17px; background:#f7f9fd; }
.share-product>img,.share-product>.image-placeholder { width:116px; height:116px; object-fit:contain; border-radius:12px; background:#fff; }
.share-product strong,.share-product small,.share-product a { min-width:0; display:block; }
.share-product strong { font-size:18px; }
.share-product small { margin-top:7px; color:#65738a; }
.share-product a { margin-top:10px; overflow:hidden; color:var(--blue); font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.share-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.share-actions button { min-height:46px; border:1px solid #d2dced; border-radius:12px; color:var(--ink); background:#fff; font-weight:800; }
.share-actions button.primary { color:#fff; border-color:var(--blue); background:var(--blue); }
.share-actions button.moments { color:#087d43; border-color:#a9dfc3; background:#effbf5; }
.share-status { min-height:22px; margin:12px 0 0; color:#12814b; font-size:12px; line-height:1.5; }
.share-status.error { color:#c44; }
.sourcing-overlay { z-index:74; }
.sourcing-modal { width:min(980px,96vw); max-height:92vh; position:relative; z-index:1; overflow:auto; padding:30px; border-radius:25px; background:#fff; box-shadow:0 30px 90px rgba(0,0,0,.28); }
.sourcing-modal>.close { position:absolute; right:16px; top:16px; z-index:3; }
.sourcing-heading { padding-right:48px; }
.sourcing-heading h2 { margin:7px 0 8px; font-size:30px; }
.sourcing-heading p { margin:0; color:var(--muted); line-height:1.65; }
.sourcing-tabs { display:flex; gap:8px; margin:22px 0 18px; padding:5px; border-radius:13px; background:#f1f4f9; }
.sourcing-tabs button { flex:1; min-height:42px; display:flex; align-items:center; justify-content:center; gap:7px; border:0; border-radius:10px; color:#647188; background:transparent; font-weight:800; }
.sourcing-tabs button.active { color:var(--blue); background:#fff; box-shadow:0 4px 14px rgba(25,51,105,.08); }
.sourcing-form { display:grid; grid-template-columns:1fr 1fr; gap:13px 16px; }
.sourcing-form label { min-width:0; display:block; color:#526077; font-size:13px; }
.sourcing-form .full-row { grid-column:1/-1; }
.sourcing-form input,.sourcing-form textarea,.sourcing-form select,.sourcing-track-form input { width:100%; margin-top:6px; padding:11px 12px; border:1px solid #d9e1ed; border-radius:10px; color:var(--ink); background:#fff; outline:0; }
.sourcing-form textarea { resize:vertical; line-height:1.55; }
.sourcing-form input:focus,.sourcing-form textarea:focus,.sourcing-form select:focus,.sourcing-track-form input:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(35,91,228,.08); }
.price-input { display:grid; grid-template-columns:105px 1fr; gap:7px; }
.sourcing-upload { min-height:106px; position:relative; display:flex!important; align-items:center; justify-content:space-between; gap:18px; padding:18px 20px; overflow:hidden; border:1px dashed #9eb9ed; border-radius:15px; background:#f5f8ff; }
.sourcing-upload span,.sourcing-upload strong,.sourcing-upload small { display:block; }
.sourcing-upload small { margin-top:6px; color:#7a879b; line-height:1.5; }
.sourcing-upload input { position:absolute; inset:0; width:100%; height:100%; margin:0; padding:0; opacity:0; cursor:pointer; }
.sourcing-upload em { flex:0 0 auto; padding:10px 15px; border-radius:10px; color:#fff; background:var(--blue); font-style:normal; font-weight:800; }
.sourcing-preview { grid-column:1/-1; display:flex; gap:9px; overflow-x:auto; }
.sourcing-preview:empty { display:none; }
.sourcing-preview span { width:92px; height:92px; flex:0 0 auto; position:relative; overflow:hidden; border:1px solid var(--line); border-radius:11px; background:#f5f7fa; }
.sourcing-preview img { width:100%; height:100%; object-fit:contain; }
.sourcing-preview b { position:absolute; right:5px; top:5px; width:20px; height:20px; display:grid; place-items:center; border-radius:50%; color:#fff; background:rgba(20,33,58,.76); font-size:10px; }
.sourcing-section-title { display:flex; align-items:baseline; justify-content:space-between; gap:16px; margin-top:5px; padding:13px 0 2px; border-top:1px solid var(--line); }
.sourcing-section-title small { color:#8490a2; }
.sourcing-submit-row { display:flex; align-items:center; justify-content:flex-end; gap:18px; }
.sourcing-submit-row p { margin:0 auto 0 0; color:#7b8799; font-size:12px; }
.sourcing-submit-row .submit-button { width:auto; min-width:190px; margin:0; }
.saved-sourcing { margin-bottom:15px; }
.saved-sourcing-list { display:grid; gap:8px; }
.saved-sourcing-list button { display:grid; grid-template-columns:minmax(0,1fr) auto auto; align-items:center; gap:12px; padding:12px 14px; border:1px solid var(--line); border-radius:12px; color:var(--ink); background:#fff; text-align:left; }
.saved-sourcing-list button:hover { border-color:#b8caeb; background:#f8faff; }
.saved-sourcing-list span,.saved-sourcing-list strong,.saved-sourcing-list small { min-width:0; display:block; }
.saved-sourcing-list small { margin-top:4px; overflow:hidden; color:#78859a; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.saved-sourcing-list em,.sourcing-progress-head>span { padding:6px 9px; border-radius:999px; color:#7a5a13; background:#fff2c9; font-size:11px; font-style:normal; font-weight:800; white-space:nowrap; }
.saved-sourcing-list .status-found,.saved-sourcing-list .status-completed,.sourcing-progress-head>.status-found,.sourcing-progress-head>.status-completed { color:#087444; background:#e5f7ed; }
.saved-sourcing-list .status-closed,.sourcing-progress-head>.status-closed { color:#6f7887; background:#edf0f4; }
.saved-sourcing-list i { color:var(--blue); font-size:12px; font-style:normal; font-weight:750; }
.saved-sourcing-empty,.sourcing-loading,.sourcing-error { padding:25px; border-radius:12px; color:#7b8799; background:#f6f8fb; text-align:center; }
.sourcing-error { color:#b7473f; background:#fff2f1; }
.sourcing-track-form { display:grid; grid-template-columns:1fr 1fr auto; align-items:end; gap:10px; margin:16px 0; padding:15px; border:1px solid var(--line); border-radius:14px; background:#f8fafc; }
.sourcing-track-form h3,.sourcing-track-form p { grid-column:1/-1; margin:0; }
.sourcing-track-form p { color:#7c899d; font-size:12px; }
.sourcing-track-form label span { color:#526077; font-size:12px; }
.sourcing-track-form .submit-button { width:auto; min-width:112px; margin:0; }
.sourcing-success { margin-bottom:12px; padding:13px 15px; border:1px solid #a8dfbf; border-radius:13px; color:#146c3d; background:#effbf4; }
.sourcing-success strong,.sourcing-success>span { display:block; }
.sourcing-success>span { margin-top:3px; font-size:12px; }
.sourcing-success p { display:flex; align-items:center; gap:9px; flex-wrap:wrap; margin:10px 0 0; }
.sourcing-success code { max-width:100%; overflow-wrap:anywhere; padding:5px 8px; border-radius:7px; color:#2f4e3d; background:#fff; }
.sourcing-success button { padding:6px 10px; border:1px solid #92cfad; border-radius:8px; color:#126a3b; background:#fff; }
.sourcing-progress-card { overflow:hidden; border:1px solid #dbe4f0; border-radius:16px; background:#fff; }
.sourcing-progress-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 18px 12px; }
.sourcing-progress-head small,.sourcing-progress-head h3 { display:block; margin:0; }
.sourcing-progress-head small { color:#7a879b; }
.sourcing-progress-link { display:block; width:calc(100% - 36px); margin:0 18px 14px; padding:10px 12px; border:1px solid #c9d9fb; border-radius:10px; color:#1958d5; font-weight:700; background:#f5f8ff; }
.sourcing-progress-link:hover { border-color:#8db0f7; background:#edf3ff; }
.sourcing-progress-head h3 { margin-top:4px; font-size:20px; }
.sourcing-progress-time { display:flex; gap:18px; padding:0 18px 13px; color:#7d899b; font-size:11px; }
.sourcing-description { margin:0; padding:14px 18px; border-top:1px solid var(--line); line-height:1.65; white-space:pre-wrap; }
.sourcing-progress-images { display:flex; gap:8px; padding:0 18px 14px; overflow-x:auto; }
.sourcing-progress-images button { width:92px; height:92px; flex:0 0 auto; padding:0; overflow:hidden; border:1px solid var(--line); border-radius:10px; background:#f5f7fa; }
.sourcing-progress-images img { width:100%; height:100%; object-fit:contain; }
.sourcing-reply,.sourcing-matches { padding:15px 18px; border-top:1px solid var(--line); }
.sourcing-reply { background:#f5f8ff; }
.sourcing-reply h4,.sourcing-matches h4 { margin:0 0 8px; }
.sourcing-reply p { margin:0; color:#42536e; line-height:1.7; white-space:pre-wrap; }
.sourcing-matches>div { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.sourcing-matches a { min-width:0; display:grid; grid-template-columns:64px minmax(0,1fr) auto; align-items:center; gap:10px; padding:9px; border:1px solid var(--line); border-radius:11px; color:inherit; text-decoration:none; }
.sourcing-matches a>img,.sourcing-matches a>.image-placeholder { width:64px; height:64px; object-fit:contain; border-radius:8px; background:#f5f7fa; }
.sourcing-matches strong,.sourcing-matches small { min-width:0; display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sourcing-matches small { margin-top:5px; color:#79869a; font-size:11px; }
.sourcing-matches i { color:var(--blue); font-style:normal; }
@media (max-width:1380px) { .header-promise { display:none; } .carousel-slide:not(.brand-slide) { grid-template-columns:minmax(360px,40fr) minmax(550px,60fr); gap:12px; padding-left:40px; padding-right:40px; } .carousel-showcase { height:340px; } .carousel-product-image { width:330px; height:330px; } .carousel-peek { width:185px; height:245px; } .catalog-layout { grid-template-columns:218px minmax(0,1fr); } .product-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } .footer-inner { grid-template-columns:1fr; } .footer-contact { grid-template-columns:minmax(185px,.65fr) repeat(2,minmax(250px,1fr)); } .footer-meta { text-align:left; } }
@media (max-width:1100px) { .carousel,.catalog-section { width:auto; margin-left:22px; margin-right:22px; } .catalog-layout { display:block; } .catalog-sidebar { position:static; overflow:visible; padding:0; border:0; background:transparent; box-shadow:none; } .catalog-sidebar-heading,.catalog-sourcing-card { display:none; } .categories { overflow-x:auto; margin:0 0 16px; padding:2px; scrollbar-width:thin; } .category-level { min-width:max-content; flex-direction:row; align-items:center; gap:7px; } .category-secondary { width:max-content; margin-top:7px; padding:7px 8px; } .category { width:auto; white-space:nowrap; border:1px solid var(--line); border-radius:999px; padding:8px 13px; background:#fff; } .category.active { border-color:var(--ink); background:var(--ink); } .catalog-main { width:100%; } .product-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } .footer-contact { grid-template-columns:1fr 1fr; } .footer-contact-copy { grid-column:1/-1; } }
@media (max-width:780px) {
  .access-gate { place-items:start center; padding:12px; }
  .access-gate-card { grid-template-columns:1fr; gap:18px; padding:22px 18px; border-radius:22px; }
  .access-gate-copy h1 { font-size:26px; }
  .access-gate-form>div { grid-template-columns:1fr; }
  .access-gate-contact { grid-column:1; grid-row:auto; flex-direction:row; gap:15px; padding:14px; text-align:left; }
  .access-gate-contact>img { width:112px; height:112px; flex:0 0 auto; border-width:5px; border-radius:13px; }
  .access-gate-contact strong { margin-top:0; }
  .access-gate-note { grid-column:1; padding-top:13px; }
  .site-header { height:72px; padding:0 12px; }
  .brand { gap:9px; } .brand img { width:46px; height:46px; } .brand small { display:none; }
  .header-actions { gap:6px; }
  .language-picker { padding-left:7px; } .language-picker>span { display:none; } .language-button { min-width:72px; max-width:88px; padding:8px 20px 8px 7px; font-size:12px; } .selection-button { padding:9px 10px; } .sourcing-button { min-height:39px; padding:8px 10px; }
  .carousel { width:auto; height:430px; margin:12px 10px 0; border:0; border-radius:22px; background:linear-gradient(138deg,#173faa,#3273ef 68%,#714ee9); }
  .carousel-slide:not(.brand-slide),.carousel-slide.brand-slide { grid-template-columns:minmax(0,1fr); grid-template-rows:auto minmax(230px,1fr); gap:5px; padding:16px 12px 27px; }
  .carousel-slide,.carousel-slide:not(.brand-slide) { background:transparent; }
  .carousel-slide::before { width:100%; background:linear-gradient(138deg,#173faa,#3273ef 68%,#714ee9); }
  .carousel-copy { width:100%; min-width:0; align-self:start; }
  .carousel .eyebrow { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .carousel h1 { display:-webkit-box; overflow:hidden; margin:5px 0 6px; max-width:100%; -webkit-box-orient:vertical; -webkit-line-clamp:1; font-size:21px; line-height:1.15; } .carousel p { display:none; }
  .carousel-panel-stats { gap:0; margin:0 0 7px; } .carousel-panel-stats span { padding:5px 7px; } .carousel-panel-stats small { font-size:8px; } .carousel-panel-stats strong { font-size:10px; }
  .carousel-actions { gap:6px; } .carousel-actions button { padding:7px 10px; font-size:10px; } .carousel-actions .carousel-share { display:none; }
  .carousel-showcase { height:238px; align-self:center; }
  .carousel-product-image { width:220px; height:220px; border-width:4px; border-radius:21px; box-shadow:0 16px 36px rgba(8,27,85,.34); }
  .carousel-product-image img { inset:5px; width:calc(100% - 10px); height:calc(100% - 10px); border-radius:14px; }
  .carousel-product-image:hover { transform:translate(-50%,-50%); }
  .carousel-peek { width:98px; height:154px; border-width:3px; border-radius:17px; opacity:.9; }
  .carousel-peek-previous { left:-18px; transform:translateY(-50%) rotate(-5deg); }
  .carousel-peek-next { right:-18px; transform:translateY(-50%) rotate(5deg); }
  .carousel-peek-previous:hover { transform:translateY(-50%) rotate(-5deg); }
  .carousel-peek-next:hover { transform:translateY(-50%) rotate(5deg); }
  .carousel-peek>span { display:none; }
  .brand-watermark { height:175px; width:100%; } .brand-watermark img { width:100px; height:100px; }
  .carousel-dots { left:50%; bottom:7px; }
  .carousel-position { right:11px; top:auto; bottom:6px; color:rgba(255,255,255,.9); background:rgba(17,42,110,.42); font-size:8px; }
  .catalog-section { width:auto; margin:0; padding:29px 12px 55px; }
  .catalog-heading { display:block; } .catalog-heading h2 { font-size:32px; } .catalog-heading p { margin-top:8px; }
  .catalog-layout { margin-top:20px; }
  .filters { align-items:center; flex-direction:row; gap:10px; margin:0 0 16px; }
  .search-box { flex:1; min-width:0; height:48px; }
  .catalog-result-count { font-size:10px; }
  .categories { width:100%; }
  .product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .product-card { overflow:hidden; border-radius:16px; }
  .product-card:hover { transform:none; box-shadow:none; }
  .product-image { border-radius:15px 15px 0 0; aspect-ratio:1/1; }
  .featured-badge { left:7px; top:7px; padding:4px 7px; font-size:9px; }
  .product-body { padding:10px; } .product-body h3 { min-height:42px; display:-webkit-box; overflow:hidden; margin:6px 0 7px; -webkit-box-orient:vertical; -webkit-line-clamp:2; font-size:14px; line-height:1.45; }
  .product-category { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:9px; }
  .product-meta { align-items:flex-start; flex-direction:column; gap:5px; }
  .product-variant-count { padding:3px 6px; font-size:9px; }
  .product-lifecycle.compact { display:none; }
  .product-pricing { min-height:65px; margin-top:8px; padding:7px 8px; }
  .comparison-price,.current-price span { font-size:10px; }
  .current-price strong { font-size:15px; }
  .product-pricing>small { font-size:9px; }
  .product-trade-meta { gap:4px; margin-top:6px; } .product-trade-meta span { padding:5px 6px; } .product-trade-meta small { font-size:7px; } .product-trade-meta strong { font-size:9px; }
  .card-actions { grid-template-columns:1fr 1fr; gap:5px; padding-top:9px; }
  .card-actions button { min-height:36px; padding:5px; font-size:11px; }
  .card-actions .card-share { display:none; }
  .quick-spec-trigger { display:block; grid-column:1/-1; border-color:#ccd9f2!important; color:var(--blue)!important; background:#f4f7fd!important; }
  .quick-spec-trigger span { display:inline-block; margin-right:3px; }
  .card-quick-preview { display:none; position:fixed; z-index:70; right:8px; bottom:calc(8px + env(safe-area-inset-bottom)); left:8px; width:auto; max-height:min(72dvh,620px); margin:0; overflow:auto; padding:14px; border-radius:18px; box-shadow:0 18px 60px rgba(16,35,78,.28); opacity:1; visibility:visible; pointer-events:auto; transform:none!important; transition:none; backdrop-filter:blur(14px); }
  .product-card.mobile-quick-open .card-quick-preview { display:block; }
  .card-quick-preview-head small { display:block; font-size:9px; }
  .card-quick-preview-head strong { font-size:14px; }
  .card-quick-tools>b { padding:4px 6px; font-size:8px; }
  .card-quick-close { display:block; }
  .card-quick-spec-grid { gap:5px; margin-top:8px; }
  .card-quick-spec-grid>div { padding:7px 8px; }
  .card-quick-spec-grid small { font-size:8px; }
  .card-quick-spec-grid strong { font-size:10px; }
  .card-quick-more { margin-top:6px; font-size:8px; }
  .card-quick-preview-actions { gap:5px; margin-top:8px; }
  .card-quick-preview-actions button { min-height:35px; padding:5px; font-size:10px; }
  .card-sku-popover { display:none; }
  .overlay { place-items:end center; padding:0; }
  .modal { width:100vw; max-width:100vw; height:100dvh; max-height:100dvh; overflow-x:hidden; padding:60px 12px 116px; border-radius:0; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; }
  .modal>.close { position:fixed; right:12px; top:10px; width:42px; height:42px; background:#f1f4fa; box-shadow:0 4px 16px rgba(22,40,80,.13); }
  .detail-layout,.detail-gallery,.detail-copy,.detail-wide { min-width:0; width:100%; max-width:100%; }
  .detail-layout { display:flex; flex-direction:column; gap:8px; }
  .detail-gallery { display:flex; gap:10px; overflow-x:auto; align-items:stretch; scroll-snap-type:x mandatory; scrollbar-width:none; padding:0; touch-action:pan-x pan-y; }
  .detail-gallery::-webkit-scrollbar { display:none; }
  .detail-gallery-button,.detail-gallery-button:first-child,.detail-gallery>.image-placeholder { flex:0 0 100%; width:100%; aspect-ratio:1/1; grid-column:auto; scroll-snap-align:start; }
  .detail-gallery-button>span { opacity:1; transform:none; }
  .detail-copy { padding:10px 2px 4px; } .detail-copy h2 { min-width:0; font-size:27px; overflow-wrap:anywhere; }
  .detail-title-row { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:start; }
  .detail-title-row>button { margin-top:6px; }
  .details { margin:14px 0; }
  .sku-variants { padding-top:18px; }
  .sku-variants-heading { align-items:flex-start; }
  .sku-variants-heading h3 { font-size:21px; }
  .sku-variant-table { display:grid; gap:8px; overflow:visible; padding:0; border:0; border-radius:0; }
  .sku-variant-header { display:none; }
  .sku-variant-list .sku-variant-row { width:100%; margin:0; }
  .sku-variant-summary { grid-template-columns:54px minmax(0,1fr); gap:9px; padding:10px; }
  .sku-variant-summary>.sku-variant-index { display:none; }
  .sku-variant-summary>.sku-image-button,.sku-variant-summary>i { width:54px; height:54px; }
  .sku-variant-toggle { gap:8px; }
  .sku-variant-title strong { font-size:13px; }
  .sku-variant-toggle-meta strong { font-size:12px; }
  .sku-variant-toggle-meta em { font-size:9px; }
  .sku-variant-panel { padding:11px; }
  .sku-variant-details { gap:6px; }
  .sku-variant-controls { grid-template-columns:78px minmax(0,1fr); gap:8px; }
  .sku-variant-controls .sku-variant-action { grid-column:1/-1; min-height:42px; }
  .mobile-detail-bar { position:fixed; z-index:56; left:0; right:0; bottom:0; min-height:86px; display:grid; grid-template-columns:76px minmax(0,1fr) 112px; align-items:center; gap:8px; padding:10px 12px calc(10px + env(safe-area-inset-bottom)); border-top:1px solid #dce4f0; background:rgba(255,255,255,.97); box-shadow:0 -10px 30px rgba(21,44,91,.12); backdrop-filter:blur(12px); }
  .mobile-detail-bar label span { display:block; margin-bottom:3px; color:#728096; font-size:10px; }
  .mobile-detail-bar input { width:100%; height:40px; padding:0 6px; border:1px solid #cfd9e9; border-radius:9px; text-align:center; }
  .mobile-detail-quote { min-width:0; color:#d94b2c; }
  .mobile-detail-quote strong,.mobile-detail-quote small { display:block; }
  .mobile-detail-quote strong { font-size:14px; }
  .mobile-detail-quote small { margin-top:3px; overflow:hidden; color:#78859a; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
  .mobile-detail-bar>button { height:46px; border:0; border-radius:11px; color:#fff; background:var(--blue); font-weight:850; }
  .mobile-detail-bar>button:disabled { color:#7d8795; background:#e3e7ec; }
  .selection-drawer { padding:20px 14px; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; }
  .site-footer { padding:34px 14px; }
  .footer-inner { gap:24px; }
  .footer-contact { grid-template-columns:1fr; }
  .footer-contact-copy { grid-column:auto; }
  .contact-card { grid-template-columns:116px minmax(0,1fr); }
  .contact-qr-frame { width:116px; height:116px; }
  .footer-meta { text-align:left; }
  .image-preview-modal { width:calc(100vw - 20px); max-height:90dvh; padding:14px; }
  .image-preview-modal img { max-height:calc(90dvh - 70px); }
  .share-modal { width:calc(100vw - 20px); margin-bottom:10px; padding:25px 16px 18px; border-radius:22px; }
  .sourcing-modal { width:100vw; max-height:94dvh; padding:25px 14px 24px; border-radius:24px 24px 0 0; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; }
  .sourcing-heading h2 { font-size:24px; }
  .sourcing-form { grid-template-columns:1fr; }
  .sourcing-form .full-row,.sourcing-preview { grid-column:1; }
  .sourcing-track-form { grid-template-columns:1fr; }
  .sourcing-track-form h3,.sourcing-track-form p { grid-column:1; }
  .sourcing-track-form .submit-button { width:100%; }
  .sourcing-matches>div { grid-template-columns:1fr; }
}
@media (max-width:480px) { .brand strong { font-size:15px; } .brand img { width:42px; height:42px; } .language-button { padding:7px 9px; } .selection-button { display:flex; align-items:center; padding:8px 9px; } .selection-label>span { display:none; } .selection-label>small { display:block; } .sourcing-button { min-width:64px; justify-content:center; padding:0 8px; } .sourcing-label>span { display:none; } .sourcing-label small { display:block; } .sourcing-button b { position:absolute; right:-4px; top:-5px; } .form-grid { grid-template-columns:1fr; } .details { grid-template-columns:repeat(2,minmax(0,1fr)); } .share-product { grid-template-columns:88px minmax(0,1fr); } .share-product>img,.share-product>.image-placeholder { width:88px; height:88px; } .share-actions { grid-template-columns:1fr; } .sourcing-upload { align-items:flex-start; flex-direction:column; } .sourcing-submit-row,.sourcing-section-title { align-items:stretch; flex-direction:column; } .sourcing-submit-row .submit-button { width:100%; } .saved-sourcing-list button { grid-template-columns:minmax(0,1fr) auto; } .saved-sourcing-list i { display:none; } .sourcing-progress-time { flex-direction:column; gap:4px; } }
@media (max-width:360px) { .brand strong { font-size:14px; } .product-grid { grid-template-columns:1fr; } .details { grid-template-columns:1fr; } }