/* ═══════════════════════════════════════════════════════════════
   showcase.css — P09 #factory 工厂实力 + #products 产品品类
   .pcard 照片卡体系 = 两区块共用 Single Sink（master L97）
   断点 1024；marquee 纯 CSS（keyframes.css 的 marquee -25% × 4 组 = 无缝）
   ═══════════════════════════════════════════════════════════════ */

/* ── .pcard 共用照片卡（Single Sink：两区块全卡共用） ── */
.pcard{position:relative;border-radius:16px;overflow:hidden;background:#111}
.pcard>img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s ease}
/* 遮罩：默认竖版 180deg .05→.75；modifier 按源 7 渐变 verbatim */
.pcard::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.05) 20%,rgba(0,0,0,.75) 100%)}
.pcard--fhero::after{background:linear-gradient(180deg,rgba(0,0,0,.1) 0%,rgba(0,0,0,.72) 100%)}
.pcard--deep::after{background:linear-gradient(180deg,rgba(0,0,0,.05) 20%,rgba(0,0,0,.78) 100%)}
.pcard--phero::after{background:linear-gradient(180deg,rgba(0,0,0,.08) 0%,rgba(0,0,0,.68) 100%)}
.pcard--side::after{background:linear-gradient(90deg,rgba(0,0,0,.72) 0%,rgba(0,0,0,.2) 60%,rgba(0,0,0,.05) 100%)}
/* hover 缩放：factory 1.05 / products 1.04（源差异保留，section 作用域） */
.sec-factory .pcard:hover>img{transform:scale(1.05)}
.sec-products .pcard:hover>img{transform:scale(1.04)}
/* 橙短线 accent bar：std 16/16/24×2.5（hero/sm 由变体覆写） */
.pcard-bar{position:absolute;background:#FF5200;border-radius:99px;z-index:1}
.pcard--hero .pcard-bar{top:20px;left:20px;width:32px;height:3px}
.pcard-bar{top:16px;left:16px;width:24px;height:2.5px}
.pcard--sm .pcard-bar{top:12px;left:12px;width:20px;height:2px}
/* 文案层：底部左下（--side=左缘垂直居中） */
.pcard-info{position:absolute;bottom:0;left:0;z-index:1;padding:20px}
.pcard--hero .pcard-info{padding:28px}
.pcard--sm .pcard-info{padding:14px}
.pcard--side .pcard-info{top:0;bottom:0;left:0;display:flex;flex-direction:column;justify-content:center;padding:28px}
.pcard-tag{font-weight:700;text-transform:uppercase;color:#FF8C42;font-size:9px;letter-spacing:.15em;margin-bottom:6px}
.pcard--hero .pcard-tag{font-size:10px;letter-spacing:.16em;margin-bottom:8px}
.pcard--sm .pcard-tag{font-size:8px;letter-spacing:.14em;margin-bottom:4px}
.pcard-label{font-weight:700;color:#fff;font-size:16px;line-height:1.25}
.pcard--hero .pcard-label{font-size:22px;line-height:1.2;letter-spacing:-.015em}
.pcard--sm .pcard-label{font-size:13px}
.pcard-sub{font-size:12.5px;color:rgba(255,255,255,.55);margin-top:6px}
.pcard--side .pcard-label{font-size:18px;margin-bottom:12px}
/* 玻璃拟态子标签：blur 版（A/D 大卡）+ 素版（B/C 小卡） */
.p-pill{display:inline-flex;align-items:center;font-size:11px;padding:4px 10px;border-radius:99px;font-weight:500;
  background:rgba(255,255,255,.15);color:rgba(255,255,255,.9);border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(4px)}
.p-pill--sm{font-size:10px;padding:2px 8px;font-weight:400;
  background:rgba(255,255,255,.13);color:rgba(255,255,255,.85);border:1px solid rgba(255,255,255,.18);backdrop-filter:none}
.pcard-pills{display:flex;flex-wrap:wrap;gap:6px}
.pcard--hero .pcard-label+.pcard-pills{margin-top:12px}

/* ═══════════ #factory 工厂实力（#FFFFFF）═══════════ */
.sec-factory{position:relative;overflow:hidden;padding-block:64px;background:#FFF;padding-inline:var(--section-px)}
@media(min-width:1024px){.sec-factory{padding-block:96px}}
.f-inner{position:relative;max-width:1200px;margin-inline:auto}
.f-head{display:flex;flex-direction:column;gap:16px;margin-bottom:32px}
@media(min-width:1024px){.f-head{flex-direction:row;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:56px}}
.f-pill{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:99px;font-size:11.5px;font-weight:600;
  background:#FFF2EB;color:#C44000;border:1px solid #FFDABF;margin-bottom:16px;align-self:flex-start}
.f-pill i{width:6px;height:6px;border-radius:99px;background:#FF5200;animation:blink 2s infinite}
.f-sub{display:none;font-size:14px;font-weight:500;color:#777;margin-bottom:8px}
@media(min-width:1024px){.f-sub{display:block}}
.f-title{font-weight:700;line-height:1.05;font-size:clamp(28px,4vw,52px);letter-spacing:-.03em;color:#111}
.f-title span{color:#FF5200}
/* 头行右侧统计组（仅桌面渲染） */
.f-stats{display:none;align-items:center;gap:24px;padding-bottom:4px}
@media(min-width:1024px){.f-stats{display:flex}}
.f-stat-num{font-weight:700;line-height:1;font-family:var(--font-latin);font-size:clamp(26px,3vw,38px);color:#111}
.f-stat-num b{color:#FF5200;font-weight:700}
.f-stat-label{font-size:12.5px;color:#AAA;margin-top:4px}
.f-stat-sep{width:1px;height:40px;background:#EAEAE8}

/* mobile 网格（<1024）：2 列 5 卡 h160 */
.f-grid-m{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.f-grid-m .pcard{height:160px}
/* desktop bento（≥1024）：2fr 1.1fr 1.1fr / 268px 224px；A 跨 2 行 */
.f-grid{display:none}
@media(min-width:1024px){
  .f-grid-m{display:none}
  .f-grid{display:grid;gap:12px;grid-template-columns:2fr 1.1fr 1.1fr;grid-template-rows:268px 224px}
  .f-a{grid-row:1/3}
}
/* marquee 设备跑马灯：4 组 ×12 设备（keyframes -25% = 1/4 组宽无缝；源 3 组跳变缺陷修正） */
.f-marquee{position:relative;margin-top:32px;overflow:hidden}
.f-marquee::before,.f-marquee::after{content:"";position:absolute;top:0;bottom:0;width:64px;z-index:1;pointer-events:none}
.f-marquee::before{left:0;background:linear-gradient(to right,#FFF,transparent)}
.f-marquee::after{right:0;background:linear-gradient(to left,#FFF,transparent)}
.f-marquee-track{display:flex;gap:10px;width:max-content;animation:marquee 30s linear infinite}
.f-mq-group{display:flex;gap:10px;flex-shrink:0}
.f-mq-item{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:99px;font-size:13px;font-weight:500;
  white-space:nowrap;background:#FFF5F0;color:#CC4400;border:1px solid #FFDEC8}
.f-mq-item i{width:6px;height:6px;border-radius:99px;background:#FF5200;flex-shrink:0}

/* ═══════════ #products 产品品类（#F8F7F5 + POD 水印）═══════════ */
.sec-products{position:relative;overflow:hidden;padding-block:64px;background:#F8F7F5;padding-inline:var(--section-px)}
@media(min-width:1024px){.sec-products{padding-block:96px}}
.p-watermark{position:absolute;left:-20px;top:50%;transform:translateY(-50%);pointer-events:none;user-select:none;
  font-family:var(--font-latin);font-weight:800;font-size:clamp(160px,20vw,280px);line-height:1;
  color:rgba(0,0,0,.025);letter-spacing:-.04em}
.p-inner{position:relative;max-width:1200px;margin-inline:auto}
.p-head{display:flex;flex-direction:column;gap:16px;margin-bottom:32px}
@media(min-width:1024px){.p-head{flex-direction:row;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:56px}}
.p-pill{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:99px;font-size:11.5px;font-weight:600;
  background:#FFF2EB;color:#C44000;border:1px solid #FFDABF;margin-bottom:16px;align-self:flex-start}
.p-pill i{width:6px;height:6px;border-radius:99px;background:#FF5200;animation:blink 2s infinite}
.p-sub{display:none;font-size:15px;font-weight:500;color:#777;margin-bottom:6px}
@media(min-width:1024px){.p-sub{display:block}}
.p-title{font-weight:700;line-height:1.05;font-size:clamp(28px,4vw,52px);letter-spacing:-.03em;color:#111}
.p-title span{color:#FF5200}
/* 分类 chips（纯展示态，源无交互） */
.p-chips{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-bottom:4px}
@media(min-width:1024px){.p-chips{flex-wrap:nowrap}}
.p-chip{font-size:12px;font-weight:600;padding:6px 14px;border-radius:99px;white-space:nowrap;background:#FFF;color:#555;border:1px solid #E8E7E3}
.p-chip.is-active{background:#FF5200;color:#FFF;border:none}

/* mobile 网格（<1024）：2 列 4 卡 h176 */
.p-grid-m{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.p-grid-m .pcard{height:176px}
/* desktop bento（≥1024）：1.9fr 1fr 1fr / 280px 240px；A 跨 2 行、D 跨 2-3 列 */
.p-grid{display:none}
@media(min-width:1024px){
  .p-grid-m{display:none}
  .p-grid{display:grid;gap:12px;grid-template-columns:1.9fr 1fr 1fr;grid-template-rows:280px 240px}
  .p-a{grid-row:1/3}
  .p-d{grid-column:2/4}
  .p-d>img{object-position:top}
}
/* 统计条 3 白卡 */
.p-stats{margin-top:20px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.p-stat{display:flex;flex-direction:column;align-items:center;padding-block:16px;border-radius:16px;background:#FFF;border:1.5px solid #EDE9E4}
@media(min-width:1024px){.p-stat{padding-block:20px}}
.p-stat-num{font-weight:700;line-height:1;margin-bottom:4px;font-family:var(--font-latin);font-size:clamp(22px,2.5vw,32px);color:#111}
.p-stat-num b{color:#FF5200;font-weight:700}
.p-stat-label{font-size:12px;font-weight:600;color:#666}
@media(min-width:1024px){.p-stat-label{font-size:13px}}
/* CTA nudge 暖渐变条（按钮复用 targets.css .tcta——Single Sink 跨区块引用） */
.p-nudge{margin-top:20px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:12px;
  padding:16px 20px;border-radius:16px;background:linear-gradient(135deg,#FFF5EE,#FFEDE0);border:1.5px solid #FFCFB3}
@media(min-width:640px){.p-nudge{flex-direction:row;padding:20px 28px}}
@media(min-width:1024px){.p-nudge{padding-block:20px}}
.p-nudge-text{font-weight:600;font-size:14px;color:#111;text-align:center}
@media(min-width:1024px){.p-nudge-text{font-size:15px}}
.p-nudge-text span{font-weight:400;color:#666}
@media(min-width:640px){.p-nudge-text{text-align:left}}

/* 触屏降级：无 hover 设备不缩放（防粘滞） */
@media(hover:none){
  .sec-factory .pcard:hover>img,.sec-products .pcard:hover>img{transform:none}
}