/* ========== 曼联红魔 (xwh07) 体育数据综合资讯平台样式 ========== */
:root {
  --xwh07-primary: #DA291D;
  --xwh07-primary-dark: #A11A13;
  --xwh07-primary-light: #E63947;
  --xwh07-accent: #FBE122;
  --xwh07-accent-light: #FFF099;
  --xwh07-bg: #0A0A0F;
  --xwh07-bg2: #16161F;
  --xwh07-text: #F0F0F8;
  --xwh07-text-muted: #9CA3AF;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
body { background: var(--xwh07-bg); color: var(--xwh07-text); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans SC", sans-serif; }

/* ===== Header ===== */
.xwh07-header { background: var(--xwh07-bg2); padding: 20px 0; position: sticky; top: 0; z-index: 999; box-shadow: 0 2px 20px rgba(0,0,0,.5); border-bottom: 1px solid rgba(255,255,255,.05); }
.xwh07-logo { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--xwh07-text); font-size: 1.3rem; font-weight: 700; }
.xwh07-logo-icon { font-size: 1.8rem; color: var(--xwh07-primary); }
.xwh07-nav ul { list-style: none; display: flex; gap: 25px; justify-content: flex-end; flex-wrap: wrap; margin: 0; }
.xwh07-nav-link { color: var(--xwh07-text) !important; text-decoration: none; font-weight: 500; transition: color .3s; }
.xwh07-nav-link:hover { color: var(--xwh07-primary) !important; }

/* ===== Hero ===== */
.xwh07-hero { background: linear-gradient(135deg, var(--xwh07-bg) 0%, var(--xwh07-bg2) 40%, var(--xwh07-primary) 100%); padding: 120px 0 100px; position: relative; overflow: hidden; }
.xwh07-hero-bg { position: absolute; inset: 0; background: radial-gradient(circle at 30% 50%, var(--xwh07-primary) 0%, transparent 50%); opacity: .3; }
.xwh07-hero h1 { font-size: 3.5rem; font-weight: 800; color: #fff; text-shadow: 0 2px 20px rgba(0,0,0,.5); position: relative; z-index: 2; }
.xwh07-hero-sub { font-size: 1.3rem; color: rgba(255,255,255,.9); margin: 20px 0 40px; position: relative; z-index: 2; }
.xwh07-hero-stats { display: flex; gap: 30px; margin-bottom: 40px; position: relative; z-index: 2; }
.xwh07-stats-mini { text-align: center; }
.xwh07-stats-mini .num { display: block; font-size: 2.5rem; font-weight: 800; color: var(--xwh07-accent); }
.xwh07-stats-mini span:last-child { color: rgba(255,255,255,.8); font-size: .95rem; }
.xwh07-hero-cta { display: flex; gap: 15px; position: relative; z-index: 2; }

/* ===== Buttons ===== */
.xwh07-btn-primary, .xwh07-theme-btn { display: inline-block; background: var(--xwh07-primary); color: #fff; padding: 12px 30px; border-radius: 8px; text-decoration: none; font-weight: 600; transition: all .3s; border: none; cursor: pointer; }
.xwh07-btn-primary:hover, .xwh07-theme-btn:hover { background: var(--xwh07-primary-dark); transform: translateY(-2px); color: #fff; text-decoration: none; }
.xwh07-btn-outline { display: inline-block; background: transparent; color: #fff; padding: 12px 30px; border: 2px solid #fff; border-radius: 8px; text-decoration: none; font-weight: 600; transition: all .3s; }
.xwh07-btn-outline:hover { background: #fff; color: var(--xwh07-primary); text-decoration: none; }

/* ===== Section Common ===== */
.xwh07-section { padding: 80px 0; background: var(--xwh07-bg2); }
.xwh07-section.alt { background: var(--xwh07-bg); }
.xwh07-section h2 { font-size: 2.2rem; font-weight: 700; margin-bottom: 50px; color: var(--xwh07-text); position: relative; padding-left: 20px; }
.xwh07-section h2::before { content: ''; position: absolute; left: 0; top: 8px; bottom: 8px; width: 5px; background: linear-gradient(to bottom, var(--xwh07-primary), var(--xwh07-accent)); border-radius: 3px; }

/* ===== Card ===== */
.xwh07-card { background: linear-gradient(145deg, var(--xwh07-bg2), var(--xwh07-bg)); border-radius: 12px; overflow: hidden; border: 1px solid rgba(255,255,255,.05); transition: all .3s; height: 100%; }
.xwh07-card:hover { transform: translateY(-5px); box-shadow: 0 20px 50px rgba(0,0,0,.4); border-color: var(--xwh07-primary); }
.xwh07-card-img { height: 180px; background: linear-gradient(135deg, var(--xwh07-primary), var(--xwh07-primary-dark)); position: relative; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 2rem; font-weight: 700; }
.xwh07-img-label { background: rgba(0,0,0,.5); padding: 8px 16px; border-radius: 6px; }
.xwh07-card-body { padding: 20px; }
.xwh07-card-body h3 { font-size: 1.1rem; font-weight: 600; margin: 10px 0; }
.xwh07-card-body h3 a { color: var(--xwh07-text); text-decoration: none; }
.xwh07-card-body h3 a:hover { color: var(--xwh07-primary-light); }
.xwh07-tag { display: inline-block; background: var(--xwh07-primary); color: #fff; padding: 3px 10px; border-radius: 4px; font-size: .75rem; font-weight: 600; text-decoration: none; }
.xwh07-meta { color: var(--xwh07-text-muted); font-size: .85rem; margin: 8px 0; }
.xwh07-read-more { color: var(--xwh07-primary-light); text-decoration: none; font-weight: 600; display: inline-block; margin-top: 10px; }
.xwh07-read-more:hover { color: var(--xwh07-accent); }

/* ===== Data Item ===== */
.xwh07-data-item { background: linear-gradient(145deg, var(--xwh07-bg2), var(--xwh07-bg)); border-radius: 10px; padding: 20px; border: 1px solid rgba(255,255,255,.05); transition: all .3s; }
.xwh07-data-item:hover { border-color: var(--xwh07-primary); transform: translateY(-3px); }
.xwh07-label { display: flex; align-items: center; gap: 8px; color: var(--xwh07-text-muted); font-size: .9rem; margin-bottom: 10px; }
.xwh07-value { font-size: 2.2rem; font-weight: 800; color: var(--xwh07-accent); margin: 5px 0; }
.xwh07-data-item .xwh07-meta { font-size: .85rem; margin-top: 5px; }

/* ===== About ===== */
.xwh07-about-img { height: 400px; background: linear-gradient(135deg, var(--xwh07-primary), var(--xwh07-primary-dark)); border-radius: 12px; position: relative; }
.xwh07-about-shape { position: absolute; inset: 20px; border: 2px dashed rgba(255,255,255,.3); border-radius: 8px; }

/* ===== Article Page ===== */
.xwh07-article-page, .xwh07-article-list { background: var(--xwh07-bg); padding: 60px 0; min-height: 600px; color: var(--xwh07-text); }
.xwh07-article-detail h1 { color: var(--xwh07-text); font-size: 2rem; margin-bottom: 20px; }
.xwh07-article-meta { color: var(--xwh07-text-muted); padding: 15px 0; border-bottom: 1px solid rgba(255,255,255,.1); margin-bottom: 30px; }
.xwh07-article-meta span { margin-right: 20px; }
.xwh07-article-content { color: var(--xwh07-text); line-height: 1.8; font-size: 1rem; }
.xwh07-article-content p { margin-bottom: 15px; }
.xwh07-article-tags { margin-top: 30px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.1); }
.xwh07-sidebar { background: var(--xwh07-bg2); border-radius: 12px; padding: 25px; }
.xwh07-widget h3 { color: var(--xwh07-primary); margin-bottom: 20px; font-size: 1.2rem; }
.xwh07-widget-item { padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,.05); }
.xwh07-widget-item a { color: var(--xwh07-text); text-decoration: none; }
.xwh07-widget-item a:hover { color: var(--xwh07-primary-light); }
.xwh07-article-nav { padding-top: 20px; border-top: 1px solid rgba(255,255,255,.1); }
.xwh07-article-nav a { color: var(--xwh07-primary-light); text-decoration: none; }

/* ===== Footer ===== */
.xwh07-footer { background: var(--xwh07-bg); color: var(--xwh07-text-muted); padding: 80px 0 0; position: relative; border-top: 1px solid rgba(255,255,255,.05); }
.xwh07-footer-shape { position: absolute; top: 0; left: 0; right: 0; height: 4px; background: linear-gradient(to right, var(--xwh07-primary), var(--xwh07-accent)); }
.xwh07-footer-logo { display: flex; align-items: center; gap: 10px; color: var(--xwh07-text); text-decoration: none; font-size: 1.3rem; font-weight: 700; margin-bottom: 20px; }
.xwh07-footer-about p { line-height: 1.7; margin-bottom: 20px; }
.xwh07-footer-social { display: flex; gap: 10px; }
.xwh07-footer-social a { width: 36px; height: 36px; background: var(--xwh07-bg2); color: var(--xwh07-text); border-radius: 50%; display: flex; align-items: center; justify-content: center; text-decoration: none; transition: all .3s; }
.xwh07-footer-social a:hover { background: var(--xwh07-primary); color: #fff; transform: translateY(-3px); }
.xwh07-footer-list h4, .xwh07-footer-contact h4 { color: var(--xwh07-text); margin-bottom: 20px; font-size: 1.1rem; }
.xwh07-footer-list ul, .xwh07-footer-contact ul { list-style: none; padding: 0; }
.xwh07-footer-list li { margin-bottom: 10px; }
.xwh07-footer-list a { color: var(--xwh07-text-muted); text-decoration: none; transition: color .3s; }
.xwh07-footer-list a:hover { color: var(--xwh07-primary-light); }
.xwh07-footer-contact li { margin-bottom: 15px; display: flex; align-items: flex-start; gap: 10px; }
.xwh07-footer-contact i { color: var(--xwh07-primary); margin-top: 3px; }
.xwh07-footer-contact a { color: var(--xwh07-text-muted); text-decoration: none; }
.xwh07-footer-copyright { text-align: center; padding: 25px 0; margin-top: 60px; border-top: 1px solid rgba(255,255,255,.05); }
.xwh07-footer-copyright a { color: var(--xwh07-primary-light); text-decoration: none; }

/* ===== Scroll Top ===== */
.xwh07-scroll-top { position: fixed; bottom: 30px; right: 30px; width: 50px; height: 50px; background: var(--xwh07-primary); color: #fff; border-radius: 50%; display: none; align-items: center; justify-content: center; text-decoration: none; z-index: 99; box-shadow: 0 5px 20px rgba(0,0,0,.3); }

/* ===== Animation ===== */
.xwh07-reveal { opacity: 0; transform: translateY(30px); transition: all .8s ease; }
.xwh07-reveal.xwh07-visible { opacity: 1; transform: translateY(0); }

/* ===== Other Pages ===== */
.xwh07-search-page, .xwh07-tag-page, .xwh07-tag-detail, .xwh07-diy, .xwh07-article-img { background: var(--xwh07-bg); padding: 60px 0; min-height: 600px; color: var(--xwh07-text); }
.xwh07-tag-cloud, .xwh07-tags-new, .xwh07-tags-hot { display: flex; flex-wrap: wrap; gap: 10px; }
.xwh07-stitle { margin-bottom: 40px; }
.xwh07-stitle h2 { font-size: 2rem; color: var(--xwh07-text); margin-top: 10px; }
.xwh07-stitle-tagline { color: var(--xwh07-primary); font-weight: 600; font-size: .9rem; }
.xwh07-error { text-align: center; padding: 120px 0; color: var(--xwh07-text); }
.xwh07-error h1 { font-size: 8rem; color: var(--xwh07-primary); }

/* ===== Responsive ===== */
@media (max-width: 768px) {
  .xwh07-hero h1 { font-size: 2rem; }
  .xwh07-hero-stats { flex-wrap: wrap; gap: 15px; }
  .xwh07-nav ul { gap: 15px; font-size: .9rem; }
  .xwh07-section h2 { font-size: 1.5rem; }
  .xwh07-section { padding: 50px 0; }
  .xwh07-hero { padding: 80px 0 60px; }
}
