/* ============================================================
   CERYE 空间香氛方案页 (space.css) — 复用 site.css 变量
   香薰机/香型平铺、筛选、服务与消耗表格、代理政策。
   ============================================================ */
.sm-empty{color:var(--ink-soft);font-size:15px;padding:36px 0;grid-column:1/-1}

/* 筛选区 */
.sf-filter{display:flex;flex-direction:column;gap:14px;margin-bottom:26px;background:var(--paper-lt);border:1px solid var(--line);border-radius:14px;padding:18px 22px}
.sf-search{font:inherit;font-family:var(--cn);font-size:14px;color:var(--ink);background:var(--paper-lt);border:1px solid var(--line);padding:12px 18px;width:100%;max-width:460px;transition:.3s var(--ease)}
.sf-search:focus{outline:none;border-color:var(--g500);background:var(--paper)}
.sf-group{display:flex;align-items:flex-start;gap:18px;flex-wrap:wrap}
.sf-l{font-family:var(--cn);font-size:12.5px;font-weight:500;letter-spacing:.04em;color:var(--ink);min-width:96px;padding-top:5px;flex-shrink:0}
.sf-chips{display:flex;flex-wrap:wrap;gap:8px;flex:1;min-width:240px}
.sf-chip{font:inherit;cursor:pointer;border:1px solid var(--line2);background:var(--paper);color:var(--ink);padding:6px 15px;border-radius:40px;font-size:12.5px;transition:.3s var(--ease)}
.sf-chip:hover{color:var(--ink);border-color:var(--ink-faint)}
.sf-chip.on{background:var(--g700);border-color:var(--g700);color:var(--paper)}
.sm-count{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:20px}
.sm-count b{color:var(--brand);font-size:14px}

/* 香薰机平铺(用户规范) */
.space-machine-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:28px;width:100%}
@media(min-width:1440px){.space-machine-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(min-width:1024px) and (max-width:1439px){.space-machine-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:767px){.space-machine-grid{grid-template-columns:repeat(1,minmax(0,1fr))}}

.sm-card,.sc-card{display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);border-radius:16px;overflow:hidden;opacity:0;transform:translateY(14px);transition:opacity .7s var(--ease),transform .7s var(--ease),border-color .4s,box-shadow .4s}
.sm-card.in,.sc-card.in{opacity:1;transform:none}
.sm-card:hover,.sc-card:hover{border-color:var(--line2);box-shadow:0 28px 56px -40px rgba(27,36,26,.5)}
.machine-image-wrap{background:#f6f6f3;aspect-ratio:1/1;min-height:280px;display:flex;align-items:center;justify-content:center;padding:20px;overflow:hidden}
.machine-image-wrap img{width:100%;height:100%;object-fit:contain;transition:transform 1s var(--ease)}
.sm-card:hover .machine-image-wrap img,.sc-card:hover .machine-image-wrap img{transform:scale(1.04)}
.sm-bd,.sc-bd{display:flex;flex-direction:column;gap:7px;padding:16px 16px 16px}
.sm-model{font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:var(--g500)}
.sm-name,.sc-name{font-family:var(--cn);font-weight:500;font-size:15.5px;color:var(--ink);line-height:1.35}
.sm-rows{display:flex;flex-direction:column;gap:3px;margin-top:3px}
.sm-r{display:flex;gap:8px;font-size:11.5px;color:var(--ink-soft);line-height:1.45}
.sm-k{flex:0 0 58px;font-family:var(--mono);font-size:9px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-faint)}
.sm-spec-note{margin-top:8px;font-size:11px;line-height:1.5;color:var(--ink-faint);border-left:2px solid var(--line2,rgba(0,0,0,.08));padding-left:9px}
.sm-badges{font-family:var(--mono);font-size:9px;letter-spacing:.05em;color:var(--brand);opacity:.9;margin-top:3px;display:flex;gap:6px;align-items:center}
.sm-badges .dot{opacity:.5}
.sm-btns{display:flex;gap:8px;margin-top:11px}
.sm-btns a{flex:1;text-align:center;font-family:var(--cn);font-size:12px;padding:10px 5px;transition:.3s var(--ease)}
.sm-b1{background:var(--g700);color:var(--paper);border:1px solid var(--g700)}
.sm-b1:hover{background:var(--g900);border-color:var(--g900)}
.sm-b2{background:none;color:var(--ink-soft);border:1px solid var(--line)}
.sm-b2:hover{color:var(--ink);border-color:var(--ink-faint)}

/* 香型平铺 */
.space-scent-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:26px;width:100%}
@media(max-width:600px){.space-scent-grid{grid-template-columns:1fr}}
.sc-fam{font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--g500)}
.sc-notes{display:flex;flex-wrap:wrap;gap:5px;align-items:center;margin-top:2px}
.sc-notes .sc-k{font-family:var(--mono);font-size:9px;color:var(--ink-faint);margin-right:2px}
.sc-notes span:not(.sc-k){font-size:10px;color:var(--ink-soft);border:1px solid var(--line);padding:2px 8px;border-radius:30px}
.sc-scene{font-size:11px;color:var(--ink-faint);line-height:1.5}
.sf-more-wrap{text-align:center;margin-top:34px}
.sf-more{font:inherit;font-family:var(--cn);font-size:13px;cursor:pointer;background:none;border:1px solid var(--line);color:var(--ink-soft);padding:12px 40px;border-radius:40px;transition:.3s var(--ease)}
.sf-more:hover{color:var(--ink);border-color:var(--ink-faint)}

/* 场景推荐香型卡 */
.scene-scent-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:22px}
.ssc{background:var(--paper-lt);border:1px solid var(--line);border-radius:16px;padding:24px 22px;display:flex;flex-direction:column;gap:12px}
.ssc h4{font-family:var(--cn);font-weight:600;font-size:17px;color:var(--ink)}
.ssc .ssc-dirs{display:flex;flex-wrap:wrap;gap:7px}
.ssc .ssc-dirs span{font-size:12px;color:var(--ink-soft);border:1px solid var(--line);padding:4px 11px;border-radius:30px}
.ssc-btn{align-self:flex-start;font-family:var(--cn);font-size:12.5px;cursor:pointer;background:none;border:1px solid var(--g700);color:var(--g700);padding:8px 18px;border-radius:40px;transition:.3s var(--ease);margin-top:4px}
.ssc-btn:hover{background:var(--g700);color:var(--paper)}

/* 通用表格(选型/服务/消耗) */
.sp-table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:14px}
.sp-table{width:100%;border-collapse:collapse;font-size:13px;min-width:560px}
.sp-table th,.sp-table td{padding:13px 16px;text-align:left;border-bottom:1px solid var(--line);color:var(--ink);vertical-align:top;line-height:1.5}
.sp-table th{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--paper);background:var(--g700);font-weight:500}
.sp-table tr:last-child td{border-bottom:none}
.sp-table tr:nth-child(even) td{background:var(--paper-lt)}
.sp-note{font-size:12px;color:var(--ink-faint);margin-top:12px;line-height:1.6}

/* 代理政策卡 */
.policy-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:22px}
.pol-card{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:26px 24px;display:flex;flex-direction:column;gap:10px}
.pol-card h4{font-family:var(--cn);font-weight:600;font-size:17px;color:var(--ink)}
.pol-card .pol-meta{font-size:12.5px;color:var(--ink-soft);line-height:1.6}
.pol-card .pol-k{font-family:var(--mono);font-size:9px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-faint);display:block;margin-top:6px}
.pol-card a{align-self:flex-start;font-family:var(--cn);font-size:12.5px;color:var(--g700);border:1px solid var(--g700);padding:8px 18px;border-radius:40px;margin-top:8px;transition:.3s var(--ease)}
.pol-card a:hover{background:var(--g700);color:var(--paper)}

/* 双语 */
.sf-chip .en,.sf-l .en,.sm-count .en,.sm-empty .en,.sm-badges .en,.sm-r .en,.sm-spec-note .en,.sm-btns .en,.sc-name .en,.machine-image-wrap+* .en{display:none}
.sm-name .en,.sc-name .en,.sm-k .en{display:none}
body[data-lang="en"] .sf-chip .zh,body[data-lang="en"] .sf-l .zh,body[data-lang="en"] .sm-count .zh,body[data-lang="en"] .sm-empty .zh,body[data-lang="en"] .sm-badges .zh,body[data-lang="en"] .sm-r .zh,body[data-lang="en"] .sm-spec-note .zh,body[data-lang="en"] .sm-btns .zh,body[data-lang="en"] .sm-k .zh,body[data-lang="en"] .sm-name .zh,body[data-lang="en"] .sc-name .zh{display:none}
body[data-lang="en"] .sf-chip .en,body[data-lang="en"] .sf-l .en,body[data-lang="en"] .sm-count .en,body[data-lang="en"] .sm-empty .en,body[data-lang="en"] .sm-badges .en,body[data-lang="en"] .sm-r .en,body[data-lang="en"] .sm-spec-note .en,body[data-lang="en"] .sm-btns .en,body[data-lang="en"] .sm-k .en,body[data-lang="en"] .sm-name .en,body[data-lang="en"] .sc-name .en{display:inline}