/* ============================================================
   专业领域总览页 /zyly 专用样式
   ============================================================ */

/* ===== 1. Hero ===== */
.practice-hero {
    padding: 80px 0 70px; text-align: center;
    position: relative;
    background: linear-gradient(135deg, #0A1E37 0%, #1A365D 50%, #2B4C7E 100%);
    border-bottom: 4px solid #DAA520;
    overflow: hidden;
}
.practice-hero::before { content:''; position:absolute; top:-50%; right:-20%; width:600px; height:600px; background:rgba(218,165,32,0.05); border-radius:50%; pointer-events:none; }
.practice-hero::after  { content:''; position:absolute; bottom:-40%; left:-10%; width:500px; height:500px; background:rgba(218,165,32,0.04); border-radius:50%; pointer-events:none; }
.practice-hero .container { position: relative; z-index: 1; }
.practice-hero h1 { font-family:'Georgia',serif; font-size:44px; font-weight:700; color:#FFFFFF; letter-spacing:1px; margin-bottom:12px; }
.practice-hero h1 i { color:#DAA520; margin-right:14px; }
.practice-hero p { font-size:18px; color:rgba(255,255,255,0.85); max-width:640px; margin:0 auto 20px; }
.practice-hero .breadcrumb { display:inline-flex; align-items:center; gap:8px; font-size:14px; color:rgba(255,255,255,0.60); padding:8px 24px; background:rgba(255,255,255,0.08); border-radius:30px; border:1px solid rgba(255,255,255,0.08); }
.practice-hero .breadcrumb a { color: rgba(255,255,255,0.70); transition: 0.3s ease; }
.practice-hero .breadcrumb a:hover { color: #DAA520; }
.practice-hero .breadcrumb .current { color: #DAA520; font-weight: 500; }
.practice-hero .breadcrumb .sep { color: rgba(255,255,255,0.25); }

/* ===== 2. 数据牌匾 ===== */
.practice-stats { padding: 50px 0 60px; background:#F1F5F9; border-bottom:1px solid #E2E8F0; }
.practice-stats .stats-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.practice-stats .stat-block { background:#FFFFFF; border-radius:12px; padding:28px 20px 24px; text-align:center; box-shadow:0 4px 20px rgba(26,54,93,0.06); border:1px solid #E2E8F0; transition:0.3s ease; }
.practice-stats .stat-block:hover { transform:translateY(-4px); box-shadow:0 8px 32px rgba(26,54,93,0.10); border-color:#DAA520; }
.practice-stats .stat-block .stat-icon { font-size:32px; color:#DAA520; margin-bottom:8px; display:block; }
.practice-stats .stat-block .num { font-family:'Georgia',serif; font-size:38px; font-weight:700; color:#0F2744; display:block; line-height:1.2; }
.practice-stats .stat-block .label { font-size:15px; color:#4A5568; margin-top:4px; display:block; }

/* ===== 3. 业务领域 ===== */
.practice-grid-section { padding: 60px 0 40px; background: #FFFFFF; }
.practice-grid-section .section-title { text-align: center; margin-bottom: 32px; }
.practice-grid-section .section-title h2 { font-size:32px; font-weight:700; color:#0F2744; letter-spacing:2px; position:relative; display:inline-block; padding-bottom:14px; }
.practice-grid-section .section-title h2::after { content:''; position:absolute; bottom:0; left:50%; transform:translateX(-50%); width:60px; height:3px; background:linear-gradient(90deg,#DAA520,#1A365D,#DAA520); border-radius:4px; }
.practice-grid-section .section-title p { color:#4A5568; font-size:16px; margin-top:12px; }

.practice-tags-nav { display:flex; flex-wrap:wrap; justify-content:center; gap:10px 12px; max-width:1000px; margin:0 auto 40px; padding:18px 22px; background:#F6F8FB; border-radius:14px; border:1px solid #E2E8F0; }
.practice-tags-nav a { display:inline-flex; align-items:center; gap:6px; padding:8px 18px; background:#FFFFFF; border:1px solid #E2E8F0; border-radius:40px; color:#1A365D; font-size:14px; font-weight:500; text-decoration:none; transition:0.3s ease; white-space:nowrap; }
.practice-tags-nav a:hover { background:#1A365D; color:#FFFFFF; border-color:#1A365D; transform:translateY(-2px); box-shadow:0 6px 18px rgba(26,54,93,0.18); }
.practice-tags-nav a i { font-size:12px; color:#DAA520; transition:0.3s ease; }
.practice-tags-nav a:hover i { color:#F0E68C; }

.practice-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:28px; }

.practice-card { display:flex; flex-direction:column; background:#FFFFFF; border-radius:12px; overflow:hidden; border:1px solid #E2E8F0; box-shadow:0 4px 16px rgba(26,54,93,0.06); text-decoration:none; color:inherit; transition:0.3s ease; position:relative; scroll-margin-top:100px; }
.practice-card:hover { transform:translateY(-6px); box-shadow:0 12px 40px rgba(26,54,93,0.14); border-color:#DAA520; }

.practice-card .practice-thumb { position:relative; width:100%; aspect-ratio:16/10; background-color:#F6F8FB; flex-shrink:0; overflow:hidden; }
.practice-card .practice-thumb img { width:100%; height:100%; object-fit:contain; object-position:center; display:block; }
.practice-card .practice-thumb::after { content:''; position:absolute; left:0; right:0; bottom:0; height:40%; background:linear-gradient(to top, rgba(10,30,55,0.55), rgba(10,30,55,0)); pointer-events:none; z-index:1; }

.practice-card .practice-body { padding:20px 22px 22px; display:flex; flex-direction:column; flex:1; }
.practice-card h3 { font-family:'Georgia',serif; font-size:19px; font-weight:700; color:#0F2744; margin-bottom:8px; }
.practice-card .practice-desc { font-size:14px; color:#4A5568; line-height:1.7; margin-bottom:12px; flex:1; }

/* ===== 承办律师行 ===== */
.practice-card .practice-lawyers {
    font-size: 13px;
    color: #4A5568;
    line-height: 1.7;
    margin: 0 0 14px;
    padding: 10px 12px;
    background: #F8FAFC;
    border-left: 3px solid #DAA520;
    border-radius: 4px;
}
.practice-card .practice-lawyers i {
    color: #DAA520;
    font-size: 12px;
    margin-right: 4px;
}
.practice-card .practice-lawyers strong {
    color: #0F2744;
    font-weight: 600;
}
.practice-card .practice-lawyers a {
    color: #1A365D;
    text-decoration: none;
    border-bottom: 1px dashed #CBD5E1;
    transition: 0.2s ease;
}
.practice-card .practice-lawyers a:hover {
    color: #DAA520;
    border-bottom-color: #DAA520;
}

.practice-card .practice-footer { display:flex; justify-content:space-between; align-items:center; padding-top:12px; border-top:1px solid #E2E8F0; }
.practice-card .practice-tag { font-size:13px; color:#718096; display:flex; align-items:center; gap:6px; }
.practice-card .practice-tag i { color:#1A365D; }
.practice-card .arrow-icon { color:#1A365D; font-size:14px; transition:0.3s ease; opacity:0.5; }
.practice-card:hover .arrow-icon { transform:translateX(4px); opacity:1; }

/* ===== 4. 相关话题 ===== */
.practice-topic-cloud { padding: 60px 0 72px; background: linear-gradient(180deg, #FFFFFF 0%, #F1F5F9 100%); border-top: 1px solid #E2E8F0; }
.practice-topic-cloud .section-title { text-align: center; margin-bottom: 36px; }
.practice-topic-cloud .section-title h2 { font-size:32px; font-weight:700; color:#0F2744; letter-spacing:2px; position:relative; display:inline-block; padding-bottom:14px; }
.practice-topic-cloud .section-title h2::after { content:''; position:absolute; bottom:0; left:50%; transform:translateX(-50%); width:60px; height:3px; background:linear-gradient(90deg,#DAA520,#1A365D,#DAA520); border-radius:4px; }
.practice-topic-cloud .section-title p { color:#4A5568; font-size:16px; margin-top:12px; }

.topic-list { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 12px; max-width: 1100px; margin: 0 auto; padding: 28px 24px; background: #FFFFFF; border-radius: 14px; border: 1px solid #E2E8F0; box-shadow: 0 4px 24px rgba(26,54,93,0.05); }
.topic-list a { display: inline-flex; align-items: center; gap: 5px; padding: 8px 18px; background: #F6F8FB; color: #2D3748; border: 1px solid #E2E8F0; border-radius: 24px; font-size: 14px; text-decoration: none; transition: 0.25s ease; white-space: nowrap; }
.topic-list a:hover { background: #1A365D; color: #FFFFFF; border-color: #DAA520; transform: translateY(-2px); box-shadow: 0 6px 18px rgba(26,54,93,0.20); }
.topic-list a i { font-size: 11px; color: #DAA520; transition: 0.25s ease; }
.topic-list a:hover i { color: #F0E68C; }

/* ===== 5. 匹配引导 ===== */
.match-guide { padding: 56px 0; background:linear-gradient(135deg,#0A1E37,#1A365D); border-top:4px solid #DAA520; border-bottom:1px solid #E2E8F0; }
.match-guide .match-wrap { display:flex; align-items:center; gap:40px; background:rgba(255,255,255,0.06); border-radius:12px; padding:36px 44px; border:1px solid rgba(218,165,32,0.15); }
.match-guide .match-icon { flex:0 0 80px; height:80px; border-radius:50%; background:#DAA520; color:#0A1E37; display:flex; align-items:center; justify-content:center; font-size:36px; }
.match-guide .match-text { flex:1; }
.match-guide .match-text h3 { font-family:'Georgia',serif; font-size:22px; color:#FFFFFF; margin-bottom:4px; }
.match-guide .match-text p { color:rgba(255,255,255,0.70); font-size:15px; margin:0; }
.match-guide .match-btn .btn-primary { background:#DAA520; color:#0A1E37; border:none; padding:12px 32px; font-weight:600; border-radius:6px; transition:0.3s ease; }
.match-guide .match-btn .btn-primary:hover { background:#C9A030; transform:translateY(-2px); }

/* ===== 6. FAQ ===== */
.faq-section { padding:60px 0 70px; background:#F1F5F9; }
.faq-section .section-title { text-align:center; margin-bottom:44px; }
.faq-section .section-title h2 { font-size:32px; font-weight:700; color:#0F2744; letter-spacing:2px; position:relative; display:inline-block; padding-bottom:14px; }
.faq-section .section-title h2::after { content:''; position:absolute; bottom:0; left:50%; transform:translateX(-50%); width:60px; height:3px; background:linear-gradient(90deg,#DAA520,#1A365D,#DAA520); border-radius:4px; }
.faq-section .section-title p { color:#4A5568; font-size:16px; margin-top:12px; }
.faq-list { display:grid; grid-template-columns:repeat(2,1fr); gap:12px 20px; max-width:1100px; margin:0 auto; }
.faq-item { background:#FFFFFF; border-radius:12px; border:1px solid #E2E8F0; box-shadow:0 2px 12px rgba(26,54,93,0.04); overflow:hidden; transition:0.3s ease; display:flex; flex-direction:column; }
.faq-item:hover { border-color:#DAA520; }
.faq-item.active { border-color:#DAA520; box-shadow:0 4px 20px rgba(26,54,93,0.06); }
.faq-question { display:flex; justify-content:space-between; align-items:center; padding:18px 22px; cursor:pointer; font-weight:600; font-size:15.5px; color:#0F2744; background:transparent; border:none; width:100%; text-align:left; transition:0.3s ease; gap:12px; }
.faq-question:hover { color:#1A365D; }
.faq-question span:first-child { flex:1; }
.faq-question .faq-toggle { color:#DAA520; font-size:16px; transition:0.3s ease; flex-shrink:0; }
.faq-item.active .faq-toggle { transform:rotate(180deg); }
.faq-answer { max-height:0; overflow:hidden; padding:0 22px; color:#4A5568; font-size:14.5px; line-height:1.8; transition:max-height 0.4s ease, padding 0.3s ease; }
.faq-item.active .faq-answer { max-height:400px; padding:0 22px 18px; }

/* ===== 7. 底部CTA ===== */
.practice-cta { padding:60px 0 40px; background:linear-gradient(135deg,#0A1E37,#1A365D); border-top:4px solid #DAA520; }
.practice-cta .cta-wrap { max-width:720px; margin:0 auto; text-align:center; background:rgba(255,255,255,0.06); padding:48px 44px 52px; border-radius:12px; border:1px solid rgba(218,165,32,0.12); }
.practice-cta h2 { font-family:'Georgia',serif; font-size:32px; color:#FFFFFF; margin-bottom:10px; }
.practice-cta p { font-size:17px; color:rgba(255,255,255,0.75); margin-bottom:28px; }
.practice-cta .btn-group { display:flex; justify-content:center; gap:16px; flex-wrap:wrap; }
.practice-cta .btn-primary { background:#DAA520; color:#0A1E37; border:none; padding:14px 38px; font-weight:600; border-radius:6px; transition:0.3s ease; }
.practice-cta .btn-primary:hover { background:#C9A030; transform:translateY(-2px); }
.practice-cta .btn-outline { background:transparent; color:#FFFFFF; border:2px solid #DAA520; padding:12px 36px; font-weight:600; border-radius:6px; transition:0.3s ease; }
.practice-cta .btn-outline:hover { background:#DAA520; color:#0A1E37; transform:translateY(-2px); }

/* ===== 页面更新时间 ===== */
.practice-updated {
    text-align: center;
    font-size: 13px;
    color: rgba(255,255,255,0.55);
    padding: 16px 0 24px;
    letter-spacing: 0.3px;
}

/* ===== 响应式 ===== */
@media (max-width: 992px) {
    .practice-stats .stats-grid { grid-template-columns:repeat(2,1fr); gap:16px; }
    .practice-grid { grid-template-columns:repeat(2,1fr); gap:20px; }
    .practice-tags-nav { gap:8px 10px; padding:14px 16px; }
    .practice-tags-nav a { padding:6px 14px; font-size:13px; }
    .faq-list { max-width:100%; }
}
@media (max-width: 768px) {
    .practice-hero { padding:50px 0 40px; }
    .practice-hero h1 { font-size:30px; }
    .practice-hero p { font-size:16px; }
    .practice-grid { grid-template-columns:1fr; }
    .practice-card .practice-thumb { aspect-ratio:16/9; }
    .match-guide .match-wrap { flex-direction:column; text-align:center; padding:28px 20px; gap:16px; }
    .match-guide .match-btn { width:100%; }
    .practice-stats .stat-block .num { font-size:28px; }
    .practice-cta .cta-wrap { padding:32px 20px 36px; }
    .practice-cta h2 { font-size:24px; }
    .practice-tags-nav { max-height:180px; overflow-y:auto; }
    .topic-list { padding:20px 16px; gap:8px 10px; }
    .topic-list a { padding:6px 14px; font-size:13px; }
    .faq-list { grid-template-columns:1fr; gap:10px; }
    .faq-question { padding:15px 18px; font-size:15px; }
    .faq-answer { padding:0 18px; }
    .faq-item.active .faq-answer { padding:0 18px 16px; }
}
@media (max-width: 480px) {
    .practice-stats .stats-grid { grid-template-columns:1fr 1fr; gap:12px; }
    .practice-stats .stat-block { padding:16px 12px; }
    .practice-stats .stat-block .num { font-size:22px; }
    .practice-card .practice-thumb { aspect-ratio:4/3; }
    .practice-card .practice-body { padding:16px 16px 18px; }
    .practice-hero h1 { font-size:24px; }
    .practice-tags-nav a { padding:5px 12px; font-size:12px; }
    .topic-list a { padding:5px 12px; font-size:12px; }
}