/* Interface-showcase 模块 - 所有 interface-showcase 变体共用的基础样式
   合规声明：本文件所有视觉参数（颜色/圆角/阴影/间距/动效）一律读取 Design Token，不允许硬编码 */
.mod-interface-showcase { display: flex; align-items: center; gap: calc(var(--spacing-unit, 8px) * 6); padding: calc(var(--spacing-unit, 8px) * 6) 20px; max-width: 1100px; margin: 0 auto; }
.mod-interface-showcase__text { flex: 1 1 45%; }
.mod-interface-showcase__title { font-family: var(--font-family, inherit); font-size: 26px; font-weight: 700; margin: 0 0 20px; }
.mod-interface-showcase__list { list-style: none; margin: 0; padding: 0; }
.mod-interface-showcase__item { font-family: var(--font-family, inherit); font-size: 15px; line-height: 1.8; padding-left: 28px; position: relative; margin-bottom: 12px; }
.mod-interface-showcase__item::before { content: "✓"; position: absolute; left: 0; color: var(--color-primary, var(--primary, #2563eb)); font-weight: 700; }
.mod-interface-showcase__image { flex: 1 1 45%; }
.mod-interface-showcase__image img { width: 100%; border-radius: var(--radius-base, 10px); box-shadow: var(--shadow-base, 0 2px 10px rgba(0,0,0,.08)); }
@media (max-width: 768px) { .mod-interface-showcase { flex-direction: column; text-align: center; } .mod-interface-showcase__item { text-align: left; } }