/* ============================================================
   物业服务宝详情页样式（wuye-v2.html）
   公共件（按钮 / 占位图 / mega 菜单 / 悬浮栏）复用 css/index-v2.css
   品牌色：主蓝 #0F52BA / 强调橙 #FF7D00
   ============================================================ */

/* ===== 详情页锚点子导航（sticky，位于 64px 固定 header 之下） ===== */
.subnav-link {
    position: relative;
    padding: 1rem 0.25rem;
    color: #4b5563;
    font-weight: 500;
    transition: color .2s;
}
.subnav-link:hover { color: #0F52BA; }
.subnav-link.active { color: #0F52BA; font-weight: 700; }
.subnav-link.active::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 3px;
    border-radius: 2px;
    background: #0F52BA;
}

/* ===== 道一云式大标题（末尾短横线，仿「懂你所需_」） ===== */
.feat-title::after {
    content: '';
    display: block;
    width: 56px;
    height: 5px;
    border-radius: 3px;
    background: #FF7D00;
    margin-top: 14px;
}

/* ===== 工单闭环步骤连接箭头（移动端隐藏） ===== */
.flow-arrow { color: #0F52BA; opacity: .35; font-size: 22px; }
@media (max-width: 767px) { .flow-arrow { display: none; } }

/* ===== FAQ 折叠 ===== */
.faq-item {
    border: 1px solid #e5e7eb;
    border-radius: .75rem;
    background: #fff;
    transition: box-shadow .2s, border-color .2s;
}
.faq-item[open] { border-color: #bfd4f0; box-shadow: 0 8px 24px rgba(15, 82, 186, .08); }
.faq-item summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 1.1rem 1.25rem;
    font-weight: 600;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item .faq-icon { color: #0F52BA; transition: transform .25s; flex-shrink: 0; }
.faq-item[open] .faq-icon { transform: rotate(45deg); }
.faq-item .faq-body { padding: 0 1.25rem 1.1rem; color: #667085; line-height: 1.8; }

/* ===== 价格表 ===== */
.price-table { width: 100%; border-collapse: collapse; font-size: .875rem; }
.price-table th, .price-table td { padding: .9rem 1rem; border-bottom: 1px solid #eef1f5; text-align: left; }
.price-table thead th { background: #f0f5fc; color: #1D2939; font-weight: 700; white-space: nowrap; }
.price-table tbody tr:hover { background: #fafcff; }
.price-table td:first-child { font-weight: 600; color: #1D2939; }
/* 版本对比表：功能列居中（试用版/标准版/旗舰版勾选列） */
.price-table th:not(:first-child), .price-table td.td-c { text-align: center; white-space: nowrap; }
.price-table td.td-c { color: #0F52BA; font-weight: 700; }

/* ===== Hero 产品图包装：浏览器窗框 + 手机浮层 + 浮动徽章（2026-09-29） ===== */
.hero-shot .browser-frame { border-radius: 14px; overflow: hidden; background: #fff;
    box-shadow: 0 40px 90px -20px rgba(4,24,66,.55), 0 0 0 1px rgba(255,255,255,.12); }
.hero-shot .browser-bar { display: flex; align-items: center; gap: 7px; height: 38px; padding: 0 14px;
    background: #eef1f6; border-bottom: 1px solid #e3e8ef; }
.hero-shot .b-dot { width: 10px; height: 10px; border-radius: 50%; flex: none; }
.hero-shot .b-r { background: #ff5f57; }
.hero-shot .b-y { background: #febc2e; }
.hero-shot .b-g { background: #28c840; }
.hero-shot .b-url { flex: 1; max-width: 400px; margin: 0 auto; height: 24px; border-radius: 6px;
    background: #fff; border: 1px solid #e3e8ef; display: flex; align-items: center; justify-content: center;
    gap: 6px; font-size: 11px; color: #667085; }
.hero-shot .phone-float { position: absolute; left: -34px; bottom: -38px; width: 154px; height: 309px;
    background: #fff; border-radius: 24px; padding: 8px 8px 11px;
    box-shadow: 0 24px 48px -16px rgba(4,24,66,.5); }
.hero-shot .phone-float img { border-radius: 16px; }
.hero-shot .glow { position: absolute; border-radius: 50%; filter: blur(70px); pointer-events: none; }
.badge-float { position: absolute; z-index: 10; display: flex; align-items: center; gap: 10px;
    background: rgba(255,255,255,.97); border-radius: 12px; padding: 10px 16px 10px 12px;
    box-shadow: 0 18px 45px -10px rgba(4,24,66,.5); animation: heroFloat 4.5s ease-in-out infinite; }
.badge-float i { width: 34px; height: 34px; border-radius: 9px; background: #eef4ff; color: #0F52BA;
    display: flex; align-items: center; justify-content: center; font-size: 15px; flex: none; }
.badge-float b { display: block; font-size: 13px; color: #1D2939; line-height: 1.3; white-space: nowrap; }
.badge-float small { display: block; font-size: 11px; color: #98a2b3; white-space: nowrap; }
@keyframes heroFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
@media (prefers-reduced-motion: reduce) { .badge-float { animation: none; } }
