/* Approved horizontal white-card recommendations. Homepage-only scope. */
.sf-home #popular-products.sf-product-editorial { padding:40px 0 32px!important; background:#f5f5f7!important; color:#14243d; scroll-margin-top:92px; }
#popular-products .sp-heading { display:flex; justify-content:space-between; align-items:center; gap:20px; margin:0 4.8% 24px; }
#popular-products .sp-kicker { display:none; }
.sf-home #popular-products.sf-product-editorial .sp-heading h2 { margin:0; padding:0!important; font:700 clamp(27px,2.4vw,40px)/1.4 'Noto Sans TC',sans-serif!important; letter-spacing:0; }
#popular-products .sp-controls { display:flex; align-items:center; gap:12px; white-space:nowrap; font-size:12px; color:#687587; font-variant-numeric:tabular-nums; }
#popular-products .sp-controls button { display:grid; place-items:center; width:42px; height:42px; min-height:42px; padding:0; border:0; border-radius:50%; background:#e7e7eb; color:#4c525c; font:32px/1 system-ui,sans-serif; cursor:pointer; }
#popular-products .sp-controls button:disabled { opacity:.35; cursor:default; }
#popular-products .sp-mosaic { display:flex; gap:22px; position:relative; height:auto; margin:0; padding:2px 4.8% 24px; overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory; scroll-padding-inline:4.8%; overscroll-behavior-x:contain; scrollbar-width:none; touch-action:auto; }
#popular-products .sp-mosaic::-webkit-scrollbar { display:none; }
#popular-products .sp-mosaic::after { display:none; }
#popular-products .sp-card { flex:0 0 clamp(280px,22.6vw,390px); display:flex; flex-direction:column; min-width:0; overflow:hidden; border:0; border-radius:22px; background:#fff; color:#14243d; text-decoration:none; scroll-snap-align:start; box-shadow:0 6px 18px #1b263a0b; transition:box-shadow .2s ease; }
#popular-products .sp-card-media { position:relative; height:clamp(280px,23vw,360px); padding:58px 22px 8px; display:grid; place-items:center; isolation:isolate; background:#fff; }
#popular-products .sp-card-brand { position:absolute; z-index:1; left:24px; top:22px; display:flex; gap:7px; align-items:center; color:#07165b; }
#popular-products .sp-card-brand>img { display:block; width:30px; height:30px; object-fit:contain; }
#popular-products .sp-card-brand>span { display:flex; flex-direction:column; gap:2px; }
#popular-products .sp-card-brand b { font-size:16px; line-height:1.25; letter-spacing:.12em; }
#popular-products .sp-card-brand small { font-size:6px; line-height:1.4; letter-spacing:.08em; }
#popular-products .sp-card-photo { display:block; width:100%; height:100%; min-height:0; object-fit:contain; }
#popular-products .sp-card-media[data-branded='true'] { padding:32px 18px 0; }
#popular-products .sp-card-media[data-branded='true'] .sp-card-photo { height:auto; aspect-ratio:1; clip-path:inset(14% 0 16% 0); }
#popular-products .sp-card-media[data-box-composite='true'] .sp-card-photo { clip-path:inset(10.8% 0 11% 0); }
#popular-products .sp-card-media[data-tall='true'] .sp-card-photo { transform:scale(1.3); }
#popular-products .sp-card-copy { display:flex; flex:1; flex-direction:column; padding:12px 26px 26px; }
#popular-products .sp-card-condition { margin:0 0 8px; color:#687587; font-size:13px; line-height:1.5; }
#popular-products .sp-card-name { margin:0; min-height:4.5em; font-size:17px; font-weight:650; line-height:1.5; overflow-wrap:anywhere; }
#popular-products .sp-card-price { margin:auto 0 0; padding:22px 0 0; color:#14243d; font-size:24px; font-weight:650; line-height:1.4; font-variant-numeric:tabular-nums; }
#popular-products .sp-footer { display:flex; justify-content:flex-end; align-items:center; margin:0 4.8%; padding:0; border:0; }
#popular-products .sp-footer a { display:inline-flex; align-items:center; min-height:44px; padding:6px 0; color:#526982; font-size:13px; text-decoration:none; }
#popular-products .sp-status { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
#popular-products .sp-empty { margin:0; padding:40px 0; color:#687587; }
#popular-products .sp-card:focus-visible,#popular-products .sp-controls button:focus-visible { outline:3px solid #357bd5!important; outline-offset:-4px!important; }
@media(hover:hover) { #popular-products .sp-card:hover { box-shadow:0 9px 24px #1b263a16; } #popular-products .sp-controls button:not(:disabled):hover { background:#dcdde2; } }
@media(max-width:760px) {
  .sf-home #popular-products.sf-product-editorial { padding:28px 0 24px!important; scroll-margin-top:80px; }
  #popular-products .sp-heading { margin:0 20px 18px; flex-wrap:wrap; gap:12px; }
  .sf-home #popular-products.sf-product-editorial .sp-heading h2 { font-size:27px!important; }
  #popular-products .sp-controls { margin-left:auto; gap:9px; }
  #popular-products .sp-controls button { width:38px; height:38px; min-height:38px; }
  #popular-products .sp-mosaic { gap:16px; padding:2px 20px 20px; scroll-padding-inline:20px; }
  #popular-products .sp-card { flex-basis:calc(100vw - 72px); max-width:370px; border-radius:20px; }
  #popular-products .sp-card-media { height:280px; }
  #popular-products .sp-card-copy { padding:10px 24px 24px; }
  #popular-products .sp-card-name { font-size:17px; }
  #popular-products .sp-footer { margin:0 20px; }
}
@media(prefers-reduced-motion:reduce) { #popular-products .sp-card { transition:none; } }