/* 自动抽取自 news-detail\zhuantingxin-award.html · 页面专属样式 */

* { margin:0; padding:0; box-sizing: border-box; }
    body { font-family: -apple-system, "Microsoft YaHei", "Segoe UI", sans-serif; color:#1a1a2e; background:#f5f6fa; line-height:1.8; }

    /* === Nav (same as site) === */

    @media(max-width:1024px){.nav-links.open{display:flex}}

    /* === Breadcrumb === */
    .crumb-wrap { max-width:900px; margin:auto; padding:78px 24px 0; }
    .crumb { font-size:13px; color:#8899aa; }
    .crumb a { color:#337ab7; text-decoration:none; }
    .crumb a:hover { text-decoration:underline; }
    .crumb span.sep { margin:0 6px; }

    /* === Hero Section === */
    .hero { background:linear-gradient(135deg,#1a1a2e 0%,#16213e 40%,#0f3460 100%); padding:48px 24px; text-align:center; position:relative; overflow:hidden; }
    .hero::before { content:''; position:absolute; top:-60%; right:-15%; width:400px; height:400px; background:radial-gradient(circle,rgba(192,57,43,.12) 0%,transparent 70%); border-radius:50%; pointer-events:none; }
    .hero::after { content:''; position:absolute; bottom:-40%; left:-10%; width:300px; height:300px; background:radial-gradient(circle,rgba(230,126,34,.08) 0%,transparent 70%); border-radius:50%; pointer-events:none; }
    .hero-badge { display:inline-block; background:linear-gradient(135deg,#d4af37,#f1c40f,#d4af37); color:#1a1a2e; font-size:11px; font-weight:700; padding:5px 16px; border-radius:20px; letter-spacing:2px; text-transform:uppercase; margin-bottom:16px; position:relative; z-index:1; }
    .hero h1 { font-size:27px; color:#fff; max-width:800px; margin:0 auto 14px; line-height:1.45; position:relative; z-index:1; }
    .hero-meta { font-size:13px; color:rgba(255,255,255,.55); position:relative; z-index:1; }
    .hero-meta span { margin:0 10px; }
    .hero-banner { margin:22px auto 0; max-width:560px; position:relative; z-index:1; border-radius:10px; overflow:hidden; box-shadow:0 8px 36px rgba(192,57,43,.25); background:#f0e6cc; padding:12px; }
    .hero-banner img { width:100%; display:block; border-radius:6px; }

    /* === Content Body === */
    .content { max-width:900px; margin:36px auto; background:#fff; border-radius:12px; box-shadow:0 4px 30px rgba(0,0,0,.06); overflow:hidden; }
    .article-body { padding:44px 52px; font-size:15.5px; color:#333; line-height:1.95; }
    .article-body p { margin-bottom:16px; }
    .article-body strong { color:#c0392b; font-weight:700; }
    .article-body h2 { color:#0a1628; font-size:21px; margin:38px 0 18px; padding-bottom:10px; border-bottom:3px solid #c0392b; display:inline-block; }
    .article-body h3 { color:#16213e; font-size:17px; margin:26px 0 12px; }

    /* === Data Cards === */
    .data-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:18px; margin:28px 0; }
    .data-card { background:linear-gradient(135deg,#f8f9fc,#fff); border-left:4px solid #c0392b; border-radius:8px; padding:20px 18px; text-align:center; box-shadow:0 2px 12px rgba(0,0,0,.04); transition:.25s; }
    .data-card:hover { transform:translateY(-3px); box-shadow:0 6px 20px rgba(192,57,43,.1); }
    .data-card .num { font-size:30px; font-weight:900; color:#c0392b; line-height:1.2; }
    .data-card .lbl { font-size:12.5px; color:#667788; margin-top:6px; }

    /* === Figure / Image === */
    figure { margin:30px 0; text-align:center; }
    figure img { max-width:100%; border-radius:8px; box-shadow:0 4px 20px rgba(0,0,0,.08); }
    figcaption { font-size:13px; color:#777; margin-top:10px; font-style:italic; }
    figcaption em { color:#c0392b; font-style:normal; font-weight:600; }
    .fig-wide { margin:32px -52px; }
    .fig-wide img { width:100%; border-radius:0; }

    /* === Feature List === */
    .feature-list { list-style:none; padding:0; margin:20px 0; }
    .feature-list li { padding:14px 18px; margin-bottom:10px; background:linear-gradient(to right,#fef9f0,#fff); border-left:4px solid #e67e22; border-radius:0 8px 8px 0; font-size:14.5px; }
    .feature-list li strong { color:#e67e22; }

    /* === Quote Block === */
    blockquote { background:linear-gradient(to right,#fef9f0,#fff); border-left:5px solid #e67e22; padding:22px 26px; margin:24px 0; border-radius:0 8px 8px 0; font-size:15px; color:#555; }
    blockquote p { margin-bottom:0; }

    /* === Highlight Box === */
    .highlight-box { background:linear-gradient(135deg,#fff5eb,#fffbf7); border:1.5px solid #f39c12; border-radius:10px; padding:24px 28px; margin:24px 0; }
    .highlight-box h3 { color:#e67e22; font-size:17px; margin-bottom:12px; }

    /* === Back Link === */
    .back-link { text-align:center; padding:32px; background:#f8fafc; border-top:1px solid #eee; }
    .back-link a { display:inline-flex; align-items:center; gap:8px; color:#337ab7; text-decoration:none; font-size:15px; font-weight:600; padding:12px 28px; border:2px solid #337ab7; border-radius:8px; transition:.25s; }
    .back-link a:hover { background:#337ab7; color:#fff; }

    /* === Footer (same as site) === */
    .footer{background:#0a1628;padding:52px 3.5% 28px;color:rgba(255,255,255,.7);position:relative}
    .footer::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#c8922a,#e8b84b,#f0c870)}
    .footer-inner{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1fr;gap:28px;max-width:var(--max-width);margin:0 auto}
    .footer-brand h3{color:#fff;font-size:23px;font-weight:800;margin-bottom:10px;display:flex;align-items:center;gap:8px}
    .footer-brand h3::after{content:'|';color:#c8922a;font-weight:300;font-size:14px;margin-left:4px}
    .footer-brand p{font-size:13.5px;line-height:1.9;margin-bottom:4px}
    .footer-col h4{color:#e8b84b;font-size:15px;font-weight:700;margin-bottom:14px;position:relative;padding-bottom:8px}
    .footer-col h4::after{content:'';position:absolute;bottom:0;left:0;width:24px;height:2px;background:#a67c24}
    .footer-col ul{list-style:none}
    .footer-col li{margin-bottom:8px}
    .footer-col a{color:rgba(255,255,255,.65);font-size:13.5px;transition:all .2s;padding:2px 0;display:inline-block}
    .footer-col a:hover{color:#e8b84b;transform:translateX(3px)}
    .footer-btm{border-top:1px solid rgba(255,255,255,.1);margin-top:32px;padding-top:18px;text-align:left;font-size:12px;color:rgba(255,255,255,.38);max-width:var(--max-width);margin-left:auto;margin-right:auto}

    @media(max-width:768px){
      
      .article-body{padding:28px 20px}
      .fig-wide{margin:24px -20px}
      .hero h1{font-size:21px}
      .data-cards{grid-template-columns:repeat(2,1fr)}
    }