/* ═══════════════════════════════════════════════════════
   好体育 HTY LINK  v3.0  ·  足球指挥中心
   配色：极黑 / 好体育红 / 战术绿 / 数据蓝 / 金
═══════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Noto+Sans+SC:wght@400;500;700;900&display=swap');

:root {
  /* 主色 */
  --red:     #E8001D;
  --red-dk:  #B8001A;
  --red-glow:rgba(232,0,29,.3);
  --green:   #00A651;
  --green-dk:#007A3D;
  --blue:    #0057B8;
  --gold:    #D4A017;
  --gold-lt: #F0C040;

  /* 背景层 */
  --bg-1:  #0A0A0A;   /* 最深 导航/hero */
  --bg-2:  #111111;   /* 次深 卡片背景 */
  --bg-3:  #1A1A1A;   /* 中间 */
  --bg-4:  #242424;   /* 偏亮 hover态 */
  --bg-lt: #F4F2EB;   /* 亮色区域 */

  /* 文字 */
  --white:   #FFFFFF;
  --w80:     rgba(255,255,255,.8);
  --w55:     rgba(255,255,255,.55);
  --w35:     rgba(255,255,255,.35);
  --w15:     rgba(255,255,255,.15);
  --w06:     rgba(255,255,255,.06);
  --ink:     #0F0F0F;
  --ink2:    #2A2A2A;
  --muted:   #888;

  /* 分割 */
  --line-dk: rgba(255,255,255,.08);
  --line-lt: #E8E8E8;

  /* 字体 */
  --font-d: 'Bebas Neue','Noto Sans SC',sans-serif;
  --font-b: 'Noto Sans SC',sans-serif;

  /* 间距 */
  --r:   10px;
  --r-sm: 6px;
  --r-lg: 16px;
  --max:  1200px;

  --ease: cubic-bezier(.16,1,.3,1);
  --ease-in: cubic-bezier(.4,0,1,1);
}

/* ── Reset ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;scroll-behavior:smooth}
body{background:var(--bg-1);color:var(--white);font-family:var(--font-b);-webkit-font-smoothing:antialiased;line-height:1.6;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
button{cursor:pointer;border:none;background:none;font-family:inherit}

.hy-wrap{width:100%;max-width:var(--max);margin:0 auto;padding:0 20px}

/* ══════════════════════════════════════════
   TICKER — 顶部滚动新闻条
══════════════════════════════════════════ */
.hy-ticker{
  background:var(--red);
  height:32px;
  display:flex;align-items:center;
  overflow:hidden;
  position:relative;
}
.hy-ticker-label{
  flex-shrink:0;
  background:rgba(0,0,0,.25);
  padding:0 14px;
  font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  height:100%;display:flex;align-items:center;gap:6px;
  white-space:nowrap;z-index:2;
}
.hy-ticker-live-dot{
  width:6px;height:6px;border-radius:50%;background:var(--white);
  animation:ticker-pulse 1.5s infinite;
}
@keyframes ticker-pulse{0%,100%{opacity:1}50%{opacity:.3}}
.hy-ticker-track{
  flex:1;overflow:hidden;
  mask-image:linear-gradient(to right,transparent,black 40px,black calc(100% - 40px),transparent);
}
.hy-ticker-inner{
  display:flex;align-items:center;white-space:nowrap;
  animation:ticker-scroll 40s linear infinite;
  font-size:12px;font-weight:600;letter-spacing:.03em;
  color:rgba(255,255,255,.95);
  gap:0;
}
.hy-ticker-inner:hover{animation-play-state:paused}
.hy-ticker-sep{margin:0 20px;opacity:.4;font-size:16px}
@keyframes ticker-scroll{
  0%  {transform:translateX(0)}
  100%{transform:translateX(-50%)}
}

/* ══════════════════════════════════════════
   MAIN HEADER
══════════════════════════════════════════ */
.hy-header{
  background:var(--bg-2);
  border-bottom:1px solid var(--line-dk);
  position:sticky;top:0;z-index:200;
}
.hy-header-inner{
  display:flex;align-items:center;justify-content:space-between;
  height:62px;gap:20px;
}
/* Logo */
.hy-logo{display:flex;align-items:center;gap:12px;flex-shrink:0}
.hy-logo-badge{
  background:var(--red);
  width:38px;height:38px;border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  font-size:20px;flex-shrink:0;
  box-shadow:0 0 0 1px rgba(232,0,29,.4);
}
.hy-logo-text-main{
  font-family:var(--font-d);font-size:24px;letter-spacing:.06em;
  color:var(--white);line-height:1;
}
.hy-logo-text-sub{font-size:9px;color:var(--w35);letter-spacing:.14em;text-transform:uppercase;margin-top:2px}

/* 主导航 */
.hy-nav{display:flex;align-items:center;gap:2px;flex:1;justify-content:center}
.hy-nav-item{
  display:flex;align-items:center;gap:6px;
  padding:8px 14px;border-radius:var(--r-sm);
  font-size:13px;font-weight:700;letter-spacing:.03em;
  color:var(--w55);
  transition:all .15s;white-space:nowrap;
}
.hy-nav-item:hover{color:var(--white);background:var(--w06)}
.hy-nav-item.active{color:var(--white)}
.hy-nav-item span{font-size:14px}
.hy-nav-icon{font-size:13px}

/* 右侧按钮组 */
.hy-header-right{display:flex;align-items:center;gap:10px;flex-shrink:0}
.hy-header-btn{
  display:flex;align-items:center;gap:6px;
  padding:8px 18px;border-radius:100px;
  font-size:12px;font-weight:700;letter-spacing:.05em;
  transition:all .18s;white-space:nowrap;
}
.hy-header-btn-main{
  background:var(--red);color:var(--white);
  box-shadow:0 0 0 1px rgba(232,0,29,.3);
}
.hy-header-btn-main:hover{background:var(--red-dk);transform:translateY(-1px)}
.hy-header-btn-ghost{
  background:var(--w06);color:var(--w80);
  border:1px solid var(--w15);
}
.hy-header-btn-ghost:hover{background:var(--w15);color:var(--white)}

/* 移动端汉堡 */
.hy-hamburger{display:none;flex-direction:column;gap:5px;padding:5px;cursor:pointer}
.hy-hamburger span{display:block;width:22px;height:2px;background:var(--w80);border-radius:1px;transition:all .25s}
.hy-mobile-menu{display:none;background:var(--bg-2);border-top:1px solid var(--line-dk);padding:8px 0}
.hy-mobile-menu a{display:flex;align-items:center;gap:10px;padding:12px 20px;font-size:14px;color:var(--w80);border-bottom:1px solid var(--line-dk)}
.hy-mobile-menu a:last-child{border:none}

/* ══════════════════════════════════════════
   HERO — 世界杯指挥中心
══════════════════════════════════════════ */
.hy-hero{
  background:var(--bg-1);
  position:relative;overflow:hidden;
  padding:56px 0 48px;
}
/* 足球场网格纹理 */
.hy-hero::before{
  content:'';position:absolute;inset:0;
  background-image:
    linear-gradient(var(--w06) 1px,transparent 1px),
    linear-gradient(90deg,var(--w06) 1px,transparent 1px);
  background-size:60px 60px;
  mask-image:radial-gradient(ellipse 80% 80% at 50% 50%,black,transparent);
}
/* 红色光晕 */
.hy-hero::after{
  content:'';position:absolute;
  bottom:-100px;left:50%;transform:translateX(-50%);
  width:900px;height:400px;
  background:radial-gradient(ellipse,rgba(232,0,29,.12),transparent 65%);
  pointer-events:none;
}

.hy-hero-inner{position:relative;z-index:2;display:grid;grid-template-columns:1fr auto;gap:40px;align-items:center}

/* 左侧主标题 */
.hy-hero-left{}
.hy-hero-eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  border:1px solid rgba(232,0,29,.35);background:rgba(232,0,29,.08);
  border-radius:100px;padding:5px 16px;
  font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:var(--red);margin-bottom:18px;
}
.hy-hero-eyebrow-dot{width:6px;height:6px;border-radius:50%;background:var(--red);animation:ticker-pulse 2s infinite}
.hy-hero-title{
  font-family:var(--font-d);
  font-size:clamp(52px,7vw,88px);
  letter-spacing:.04em;line-height:.95;
  color:var(--white);margin-bottom:6px;
}
.hy-hero-title-en{
  font-family:var(--font-d);
  font-size:clamp(20px,3vw,32px);
  letter-spacing:.2em;color:var(--red);
  display:block;margin-bottom:18px;
}
.hy-hero-desc{font-size:14px;color:var(--w55);max-width:480px;line-height:1.8;margin-bottom:28px}
.hy-hero-btns{display:flex;gap:12px;flex-wrap:wrap}
.hy-btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:13px 28px;border-radius:100px;
  font-size:14px;font-weight:700;letter-spacing:.04em;
  transition:all .2s var(--ease);cursor:pointer;border:none;
}
.hy-btn-red{background:var(--red);color:var(--white);box-shadow:0 4px 20px rgba(232,0,29,.35)}
.hy-btn-red:hover{background:var(--red-dk);transform:translateY(-2px);box-shadow:0 8px 28px rgba(232,0,29,.4)}
.hy-btn-ghost{background:var(--w06);color:var(--w80);border:1px solid var(--w15)}
.hy-btn-ghost:hover{background:var(--w15);color:var(--white)}

/* 右侧倒计时卡 */
.hy-countdown-card{
  background:var(--bg-3);border:1px solid var(--line-dk);border-radius:var(--r-lg);
  padding:28px;min-width:260px;text-align:center;
  position:relative;overflow:hidden;
  flex-shrink:0;
}
.hy-countdown-card::before{
  content:'';position:absolute;top:-30px;right:-30px;
  width:120px;height:120px;
  background:radial-gradient(circle,rgba(232,0,29,.15),transparent 70%);
}
.hy-countdown-label{font-size:9px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--red);margin-bottom:14px}
.hy-countdown-nums{display:flex;gap:8px;justify-content:center;margin-bottom:14px}
.hy-countdown-unit{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:52px}
.hy-countdown-num{
  font-family:var(--font-d);font-size:40px;letter-spacing:.04em;line-height:1;
  color:var(--white);
  background:var(--bg-4);border-radius:var(--r-sm);
  padding:6px 10px;width:100%;text-align:center;
  border:1px solid var(--line-dk);
}
.hy-countdown-unit-label{font-size:9px;color:var(--w35);letter-spacing:.1em}
.hy-countdown-date{font-size:11px;color:var(--w55);margin-bottom:4px}
.hy-countdown-venue{font-size:10px;color:var(--w35)}

/* ══════════════════════════════════════════
   SECTION 通用
══════════════════════════════════════════ */
.hy-section{padding:44px 0}
.hy-section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}
.hy-section-title{
  font-family:var(--font-d);font-size:24px;letter-spacing:.06em;
  color:var(--white);display:flex;align-items:center;gap:10px;
}
.hy-section-title::before{content:'';width:4px;height:22px;background:var(--red);border-radius:2px;display:block}
.hy-section-more{
  font-size:12px;font-weight:700;color:var(--red);letter-spacing:.06em;
  display:flex;align-items:center;gap:4px;transition:gap .15s;
}
.hy-section-more:hover{gap:8px}

/* ══════════════════════════════════════════
   8-CARD NAV GRID — 主导航入口
══════════════════════════════════════════ */
.hy-nav-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
}

.hy-nav-card{
  position:relative;overflow:hidden;
  border-radius:var(--r);border:1px solid var(--line-dk);
  padding:24px 20px;
  display:flex;flex-direction:column;gap:8px;
  background:var(--bg-2);
  transition:all .22s var(--ease);
  cursor:pointer;
}
.hy-nav-card::after{
  content:'';position:absolute;bottom:0;left:0;right:0;height:2px;
  transform:scaleX(0);transform-origin:left;
  transition:transform .25s var(--ease);
}
.hy-nav-card:hover{border-color:rgba(255,255,255,.15);transform:translateY(-3px);background:var(--bg-3)}
.hy-nav-card:hover::after{transform:scaleX(1)}

/* 样式变体 */
.hy-nav-card[data-style="red"]::after{background:var(--red)}
.hy-nav-card[data-style="red"]:hover{border-color:rgba(232,0,29,.3);box-shadow:0 8px 32px rgba(232,0,29,.12)}
.hy-nav-card[data-style="green"]::after{background:var(--green)}
.hy-nav-card[data-style="green"]:hover{border-color:rgba(0,166,81,.3);box-shadow:0 8px 32px rgba(0,166,81,.12)}
.hy-nav-card[data-style="blue"]::after{background:var(--blue)}
.hy-nav-card[data-style="blue"]:hover{border-color:rgba(0,87,184,.3);box-shadow:0 8px 32px rgba(0,87,184,.12)}
.hy-nav-card[data-style="gold"]::after{background:var(--gold)}
.hy-nav-card[data-style="gold"]:hover{border-color:rgba(212,160,23,.3);box-shadow:0 8px 32px rgba(212,160,23,.12)}
.hy-nav-card[data-style="dark"]::after{background:var(--w35)}

.hy-nav-card-icon{font-size:28px;margin-bottom:4px}
.hy-nav-card-title{font-family:var(--font-d);font-size:20px;letter-spacing:.05em;color:var(--white);line-height:1}
.hy-nav-card-desc{font-size:11px;color:var(--w55);line-height:1.5}
.hy-nav-card-arrow{
  position:absolute;top:16px;right:16px;
  font-size:14px;color:var(--w35);
  transition:all .2s;
}
.hy-nav-card:hover .hy-nav-card-arrow{color:var(--white);transform:translate(3px,-3px)}

/* 第一张卡片加大 */
.hy-nav-card:first-child{
  grid-row:span 2;
  padding:32px 24px;
  background:linear-gradient(135deg,var(--bg-3),var(--bg-2));
}
.hy-nav-card:first-child .hy-nav-card-icon{font-size:44px;margin-bottom:12px}
.hy-nav-card:first-child .hy-nav-card-title{font-size:28px;margin-bottom:8px}
.hy-nav-card:first-child .hy-nav-card-desc{font-size:13px;line-height:1.7}

/* ══════════════════════════════════════════
   QUICK STATS STRIP
══════════════════════════════════════════ */
.hy-stats-strip{
  background:var(--bg-2);border-top:1px solid var(--line-dk);border-bottom:1px solid var(--line-dk);
  padding:0;
}
.hy-stats-inner{display:flex;justify-content:space-around;flex-wrap:wrap}
.hy-stat-item{
  display:flex;flex-direction:column;align-items:center;
  padding:18px 24px;position:relative;
}
.hy-stat-item+.hy-stat-item::before{content:'';position:absolute;left:0;top:20%;height:60%;width:1px;background:var(--line-dk)}
.hy-stat-num{font-family:var(--font-d);font-size:32px;letter-spacing:.05em;color:var(--white);line-height:1}
.hy-stat-num em{color:var(--red);font-style:normal}
.hy-stat-label{font-size:10px;color:var(--w55);letter-spacing:.1em;text-transform:uppercase;margin-top:3px}

/* ══════════════════════════════════════════
   NEWS CARDS — 最新资讯
══════════════════════════════════════════ */
.hy-news-grid{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:16px;
}
/* 第一篇大卡 */
.hy-news-grid .hy-news-card:first-child{
  grid-column:1/-1;
  display:grid;grid-template-columns:1.2fr 1fr;gap:0;
}
.hy-news-card{
  background:var(--bg-2);border-radius:var(--r);
  border:1px solid var(--line-dk);overflow:hidden;
  display:flex;flex-direction:column;
  transition:all .22s var(--ease);
}
.hy-news-card:hover{transform:translateY(-3px);border-color:rgba(255,255,255,.12);box-shadow:0 10px 36px rgba(0,0,0,.3)}
.hy-news-card-img{
  aspect-ratio:16/9;overflow:hidden;background:var(--bg-3);
  display:flex;align-items:center;justify-content:center;font-size:32px;
}
.hy-news-card:first-child .hy-news-card-img{aspect-ratio:unset;height:100%;min-height:240px}
.hy-news-card-img img{width:100%;height:100%;object-fit:cover;transition:transform .4s var(--ease)}
.hy-news-card:hover .hy-news-card-img img{transform:scale(1.04)}
.hy-news-card-body{padding:18px;flex:1;display:flex;flex-direction:column;justify-content:space-between}
.hy-news-card:first-child .hy-news-card-body{padding:28px;justify-content:center}
.hy-news-cat{font-size:9px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--red);margin-bottom:8px}
.hy-news-title{
  font-size:15px;font-weight:800;color:var(--white);line-height:1.4;margin-bottom:10px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.hy-news-card:first-child .hy-news-title{font-family:var(--font-d);font-size:26px;letter-spacing:.03em;-webkit-line-clamp:3}
.hy-news-excerpt{font-size:12px;color:var(--w55);line-height:1.7;margin-bottom:14px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hy-news-footer{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:var(--w35)}
.hy-news-more{font-size:11px;font-weight:700;color:var(--red);display:flex;align-items:center;gap:3px;transition:gap .15s}
.hy-news-card:hover .hy-news-more{gap:7px}

/* ══════════════════════════════════════════
   TEAM STRIP — 球队展示
══════════════════════════════════════════ */
.hy-teams-strip{
  background:var(--bg-2);border-radius:var(--r);border:1px solid var(--line-dk);
  padding:24px;overflow:hidden;
}
.hy-teams-scroll{
  display:flex;gap:10px;overflow-x:auto;padding-bottom:4px;
  scrollbar-width:thin;scrollbar-color:var(--w15) transparent;
}
.hy-teams-scroll::-webkit-scrollbar{height:3px}
.hy-teams-scroll::-webkit-scrollbar-track{background:transparent}
.hy-teams-scroll::-webkit-scrollbar-thumb{background:var(--w15);border-radius:2px}
.hy-team-chip{
  display:flex;flex-direction:column;align-items:center;gap:6px;
  flex-shrink:0;padding:12px 16px;
  background:var(--bg-3);border:1px solid var(--line-dk);border-radius:var(--r-sm);
  transition:all .18s;cursor:pointer;min-width:80px;
}
.hy-team-chip:hover{background:var(--bg-4);border-color:rgba(255,255,255,.18);transform:translateY(-2px)}
.hy-team-flag{font-size:28px;line-height:1}
.hy-team-name{font-size:11px;font-weight:700;color:var(--w80);white-space:nowrap}
.hy-team-rank{font-size:9px;color:var(--w35)}

/* ══════════════════════════════════════════
   SOCIAL + ABOUT GRID
══════════════════════════════════════════ */
.hy-bottom-grid{
  display:grid;grid-template-columns:1fr 1.4fr;gap:20px;padding-bottom:60px;
}
/* 社交 */
.hy-social-box{
  background:var(--bg-2);border-radius:var(--r);border:1px solid var(--line-dk);padding:24px;
}
.hy-social-box-title{font-family:var(--font-d);font-size:18px;letter-spacing:.06em;color:var(--white);margin-bottom:16px}
.hy-social-btns{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.hy-social-btn{
  display:flex;align-items:center;gap:10px;
  background:var(--bg-3);border:1px solid var(--line-dk);border-radius:var(--r-sm);
  padding:11px 14px;font-size:13px;font-weight:700;color:var(--w80);
  transition:all .18s;
}
.hy-social-btn:hover{background:var(--bg-4);border-color:rgba(255,255,255,.18);color:var(--white);transform:translateY(-2px)}
.hy-social-icon{font-size:18px;flex-shrink:0}

/* 关于 */
.hy-about-box{
  background:var(--bg-2);border-radius:var(--r);border:1px solid var(--line-dk);padding:28px;
  position:relative;overflow:hidden;
}
.hy-about-box::before{
  content:'';position:absolute;right:-40px;bottom:-40px;
  width:180px;height:180px;
  background:radial-gradient(circle,rgba(232,0,29,.08),transparent 70%);
}
.hy-about-eyebrow{font-size:9px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--red);margin-bottom:10px;display:flex;align-items:center;gap:8px}
.hy-about-eyebrow::before{content:'';width:14px;height:2px;background:var(--red);border-radius:1px}
.hy-about-title{font-family:var(--font-d);font-size:28px;letter-spacing:.05em;color:var(--white);margin-bottom:4px}
.hy-about-sub{font-size:12px;color:var(--w35);margin-bottom:14px}
.hy-about-text{font-size:13px;line-height:1.9;color:var(--w55);margin-bottom:20px}
.hy-about-eeat{display:flex;gap:10px;flex-wrap:wrap}
.hy-eeat-tag{background:var(--bg-3);border:1px solid var(--line-dk);border-radius:100px;padding:5px 14px;font-size:11px;font-weight:600;color:var(--w80)}

/* ══════════════════════════════════════════
   COPY LINK 区域
══════════════════════════════════════════ */
.hy-links-section{
  background:var(--bg-2);border-radius:var(--r);border:1px solid var(--line-dk);
  padding:24px;margin-bottom:24px;
}
.hy-copy-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:16px}
.hy-copy-item{
  background:var(--bg-3);border:1px solid var(--line-dk);border-radius:var(--r-sm);
  padding:12px 14px;display:flex;align-items:center;justify-content:space-between;
  gap:8px;cursor:pointer;transition:all .15s;
}
.hy-copy-item:hover{background:var(--bg-4);border-color:rgba(255,255,255,.15)}
.hy-copy-short{font-size:11px;font-family:monospace;font-weight:700;color:var(--white)}
.hy-copy-target{font-size:10px;color:var(--w35);margin-top:2px}
.hy-copy-btn{
  flex-shrink:0;font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  background:var(--bg-1);color:var(--w55);border-radius:4px;padding:4px 9px;transition:all .15s;
}
.hy-copy-item:hover .hy-copy-btn{background:var(--red);color:var(--white)}

/* ══════════════════════════════════════════
   FOOTER
══════════════════════════════════════════ */
.hy-footer{
  background:var(--bg-1);border-top:1px solid var(--line-dk);
  padding:52px 0 28px;
}
.hy-footer::before{
  content:'';display:block;height:2px;
  background:linear-gradient(90deg,var(--red) 0%,var(--green) 50%,var(--blue) 100%);
  margin-bottom:52px;
}
.hy-footer-grid{
  display:grid;grid-template-columns:280px 1fr 1fr 1fr;gap:40px;margin-bottom:40px;
}
.hy-footer-brand-logo{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.hy-footer-brand-name{font-family:var(--font-d);font-size:20px;letter-spacing:.08em;color:var(--white)}
.hy-footer-brand-desc{font-size:12px;color:var(--w35);line-height:1.8;margin-bottom:12px}
.hy-footer-domains{display:flex;gap:10px;flex-wrap:wrap}
.hy-footer-domain{font-size:10px;color:var(--w35);border:1px solid var(--line-dk);padding:3px 10px;border-radius:100px;transition:color .15s}
.hy-footer-domain:hover{color:var(--w80)}
.hy-footer-col-title{
  font-family:var(--font-d);font-size:14px;letter-spacing:.1em;
  color:var(--white);margin-bottom:14px;
  display:flex;align-items:center;gap:8px;
}
.hy-footer-col-title::before{content:'';width:2px;height:14px;background:var(--red);border-radius:1px}
.hy-footer-links{display:flex;flex-direction:column;gap:8px}
.hy-footer-links a{font-size:13px;color:var(--w35);transition:color .15s}
.hy-footer-links a:hover{color:var(--white)}
.hy-footer-bottom{
  border-top:1px solid var(--line-dk);padding-top:20px;
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;
}
.hy-footer-copy{font-size:11px;color:var(--w35)}
.hy-footer-right{display:flex;gap:16px}
.hy-footer-right a{font-size:11px;color:var(--w35);transition:color .15s}
.hy-footer-right a:hover{color:var(--w80)}

/* ══════════════════════════════════════════
   TOAST
══════════════════════════════════════════ */
.hy-toast{
  position:fixed;bottom:28px;left:50%;
  transform:translateX(-50%) translateY(14px);
  background:var(--bg-3);color:var(--white);
  padding:10px 24px;border-radius:100px;
  font-size:13px;font-weight:700;
  border:1px solid var(--line-dk);
  box-shadow:0 8px 32px rgba(0,0,0,.4);
  opacity:0;transition:all .3s var(--ease);
  pointer-events:none;z-index:9999;white-space:nowrap;
}
.hy-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* ══════════════════════════════════════════
   PROGRESS BAR (文章页)
══════════════════════════════════════════ */
.hy-progress{
  position:fixed;top:62px;left:0;width:0%;height:2px;
  background:linear-gradient(90deg,var(--red),var(--gold));
  z-index:300;transition:width .1s linear;
}

/* ══════════════════════════════════════════
   ARTICLE PAGE
══════════════════════════════════════════ */
.hy-article-wrap{padding:44px 0 80px}
.hy-article-layout{display:grid;grid-template-columns:1fr 280px;gap:44px;align-items:start}
.hy-article-main{}

.hy-article-cats{display:flex;gap:6px;margin-bottom:14px;flex-wrap:wrap}
.hy-article-cat{background:var(--red);color:var(--white);padding:3px 12px;border-radius:100px;font-size:9px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.hy-article-title{font-family:var(--font-d);font-size:clamp(26px,4vw,44px);letter-spacing:.03em;line-height:1.1;color:var(--white);margin-bottom:16px}
.hy-article-meta{display:flex;flex-wrap:wrap;gap:14px;font-size:12px;color:var(--w55);padding-bottom:18px;border-bottom:1px solid var(--line-dk)}

.hy-article-thumb{aspect-ratio:16/9;overflow:hidden;border-radius:var(--r);background:var(--bg-2);margin:24px 0}
.hy-article-thumb img{width:100%;height:100%;object-fit:cover}

/* TOC */
.hy-toc{background:var(--bg-2);border:1px solid var(--line-dk);border-left:3px solid var(--red);border-radius:0 var(--r-sm) var(--r-sm) 0;padding:16px 20px;margin-bottom:28px}
.hy-toc-title{font-size:9px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--red);margin-bottom:12px}
.hy-toc-nav{display:flex;flex-direction:column;gap:2px}
.hy-toc-nav a{font-size:13px;color:var(--w55);padding:4px 0 4px 14px;border-left:2px solid transparent;transition:all .15s;line-height:1.5}
.hy-toc-nav a.h3{padding-left:28px;font-size:12px}
.hy-toc-nav a:hover,.hy-toc-nav a.active{color:var(--white);border-left-color:var(--red)}

/* 正文 */
.hy-article-body{font-size:15px;line-height:1.95;color:rgba(255,255,255,.82)}
.hy-article-body h2{font-family:var(--font-d);font-size:26px;letter-spacing:.04em;color:var(--white);margin:36px 0 14px;padding-bottom:10px;border-bottom:1px solid var(--line-dk)}
.hy-article-body h3{font-size:18px;font-weight:800;color:var(--white);margin:26px 0 10px}
.hy-article-body p{margin-bottom:18px}
.hy-article-body ul,.hy-article-body ol{padding-left:22px;margin-bottom:18px}
.hy-article-body li{margin-bottom:8px}
.hy-article-body strong{color:var(--white);font-weight:800}
.hy-article-body a{color:var(--red);text-decoration:underline;text-underline-offset:3px}
.hy-article-body blockquote{border-left:4px solid var(--red);background:rgba(232,0,29,.06);padding:16px 20px;margin:22px 0;border-radius:0 var(--r-sm) var(--r-sm) 0;color:var(--w80);font-style:italic}
.hy-article-body img{border-radius:var(--r-sm);margin:16px 0}

/* 标签 */
.hy-article-tags{display:flex;flex-wrap:wrap;gap:8px;margin:24px 0}
.hy-tag{background:var(--bg-3);border:1px solid var(--line-dk);color:var(--w55);padding:5px 14px;border-radius:100px;font-size:12px;transition:all .15s}
.hy-tag:hover{background:var(--red);border-color:var(--red);color:var(--white)}

/* 分享 */
.hy-share{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:16px 18px;background:var(--bg-2);border-radius:var(--r-sm);margin:24px 0;border:1px solid var(--line-dk)}
.hy-share-label{font-size:9px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--w35)}
.hy-share-btn{padding:7px 16px;border-radius:100px;font-size:11px;font-weight:700;cursor:pointer;border:none;transition:all .15s}
.hy-share-wb{background:rgba(230,22,45,.15);color:#ff6b7a}
.hy-share-x{background:rgba(255,255,255,.08);color:var(--w80)}
.hy-share-tg{background:rgba(38,165,228,.15);color:#64c8f0}
.hy-share-copy{background:var(--bg-3);color:var(--w55)}
.hy-share-btn:hover{transform:translateY(-1px);filter:brightness(1.2)}

/* 底部CTA */
.hy-article-cta{background:var(--bg-2);border:1px solid var(--line-dk);border-radius:var(--r);padding:28px;margin:28px 0;text-align:center;position:relative;overflow:hidden}
.hy-article-cta::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 70% 60% at 50% 110%,rgba(232,0,29,.1),transparent);pointer-events:none}
.hy-cta-eyebrow{font-size:9px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--red);margin-bottom:8px}
.hy-cta-desc{font-size:13px;color:var(--w55);margin-bottom:18px}

/* 上下篇 */
.hy-post-nav{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:28px 0;padding-top:22px;border-top:1px solid var(--line-dk)}
.hy-post-nav a{padding:16px;background:var(--bg-2);border:1px solid var(--line-dk);border-radius:var(--r-sm);display:flex;flex-direction:column;gap:5px;transition:all .2s}
.hy-post-nav a:hover{border-color:rgba(255,255,255,.18);transform:translateY(-2px)}
.hy-post-nav-next a{text-align:right}
.hy-nav-dir{font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--red)}
.hy-nav-title{font-size:13px;font-weight:700;color:var(--white);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* 相关推荐 */
.hy-related{background:var(--bg-2);border:1px solid var(--line-dk);border-radius:var(--r);padding:22px;margin-top:28px}
.hy-related-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;margin-top:16px}
.hy-related-card{background:var(--bg-3);border-radius:var(--r-sm);overflow:hidden;border:1px solid var(--line-dk);display:block;transition:all .2s}
.hy-related-card:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.15)}
.hy-related-img{aspect-ratio:16/9;overflow:hidden;background:var(--bg-4);display:flex;align-items:center;justify-content:center;font-size:20px;background-size:cover;background-position:center}
.hy-related-info{padding:10px}
.hy-related-title{font-size:12px;font-weight:700;color:var(--white);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hy-related-date{font-size:10px;color:var(--w35);margin-top:3px}

/* 侧边栏 */
.hy-article-sidebar{position:sticky;top:82px}
.hy-sidebar-cta{background:var(--bg-2);border:1px solid var(--line-dk);border-radius:var(--r);padding:22px;margin-bottom:14px;text-align:center;position:relative;overflow:hidden}
.hy-sidebar-cta::after{content:'⚽';position:absolute;right:-10px;bottom:-10px;font-size:72px;opacity:.05}
.hy-sidebar-badge{display:inline-block;background:var(--red);color:var(--white);font-size:9px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;padding:3px 10px;border-radius:100px;margin-bottom:10px}
.hy-sidebar-cta-title{font-family:var(--font-d);font-size:22px;letter-spacing:.06em;color:var(--white);margin-bottom:6px}
.hy-sidebar-cta-desc{font-size:11px;color:var(--w35);margin-bottom:16px;line-height:1.7}
.hy-sidebar-cta-btn{display:block;background:var(--red);color:var(--white);padding:11px;border-radius:100px;font-size:13px;font-weight:700;text-align:center;letter-spacing:.04em;transition:background .15s}
.hy-sidebar-cta-btn:hover{background:var(--red-dk)}
.hy-sidebar-box{background:var(--bg-2);border:1px solid var(--line-dk);border-radius:var(--r);padding:18px;margin-bottom:12px}
.hy-sidebar-box-title{font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--w35);margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--line-dk)}
.hy-sidebar-posts{display:flex;flex-direction:column;gap:12px}
.hy-sidebar-post{display:flex;gap:10px;align-items:flex-start}
.hy-sidebar-post-img{width:58px;height:42px;flex-shrink:0;border-radius:4px;overflow:hidden;background:var(--bg-3);display:flex;align-items:center;justify-content:center;font-size:14px}
.hy-sidebar-post-img img{width:100%;height:100%;object-fit:cover}
.hy-sidebar-post-title{font-size:12px;font-weight:700;color:var(--w80);line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;transition:color .15s}
.hy-sidebar-post:hover .hy-sidebar-post-title{color:var(--red)}
.hy-sidebar-post-date{font-size:10px;color:var(--w35);margin-top:3px}

/* ══════════════════════════════════════════
   ARCHIVE/CATEGORY PAGE
══════════════════════════════════════════ */
.hy-archive-header{background:var(--bg-1);padding:44px 0 36px;position:relative;overflow:hidden}
.hy-archive-header::before{content:'';position:absolute;inset:0;background-image:linear-gradient(var(--w06) 1px,transparent 1px),linear-gradient(90deg,var(--w06) 1px,transparent 1px);background-size:50px 50px;mask-image:radial-gradient(ellipse 80% 80% at 50% 50%,black,transparent)}
.hy-archive-inner{position:relative;z-index:2}
.hy-archive-eyebrow{font-size:9px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--red);margin-bottom:10px;display:flex;align-items:center;gap:8px}
.hy-archive-eyebrow::before{content:'';width:14px;height:2px;background:var(--red)}
.hy-archive-title{font-family:var(--font-d);font-size:clamp(32px,6vw,56px);letter-spacing:.04em;color:var(--white);margin-bottom:4px}
.hy-archive-count{font-size:13px;color:var(--w35)}
.hy-archive-body{padding:40px 0 80px}
.hy-posts-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.hy-post-card{background:var(--bg-2);border-radius:var(--r);overflow:hidden;border:1px solid var(--line-dk);transition:all .2s var(--ease)}
.hy-post-card:hover{transform:translateY(-3px);border-color:rgba(255,255,255,.15);box-shadow:0 10px 36px rgba(0,0,0,.3)}
.hy-post-card-img{aspect-ratio:16/9;overflow:hidden;background:var(--bg-3);display:flex;align-items:center;justify-content:center;font-size:28px}
.hy-post-card-img img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.hy-post-card:hover .hy-post-card-img img{transform:scale(1.05)}
.hy-post-card-body{padding:16px}
.hy-post-cat{font-size:9px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--red);margin-bottom:7px}
.hy-post-title{font-size:14px;font-weight:800;color:var(--white);line-height:1.4;margin-bottom:10px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hy-post-footer{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:var(--w35)}
.hy-post-more{font-size:11px;font-weight:700;color:var(--red);display:flex;align-items:center;gap:3px;transition:gap .15s}
.hy-post-card:hover .hy-post-more{gap:7px}
.hy-pagination{display:flex;justify-content:center;gap:6px;margin-top:44px;flex-wrap:wrap}
.hy-pagination a,.hy-pagination span{display:flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:var(--r-sm);font-size:13px;font-weight:700;transition:all .15s}
.hy-pagination a{background:var(--bg-2);border:1px solid var(--line-dk);color:var(--w80)}
.hy-pagination a:hover{background:var(--red);border-color:var(--red);color:var(--white)}
.hy-pagination .current{background:var(--white);color:var(--ink)}

/* ══════════════════════════════════════════
   PAGE (静态页)
══════════════════════════════════════════ */
.hy-page-body{padding:44px 0 80px;max-width:740px}
.hy-page-title{font-family:var(--font-d);font-size:clamp(28px,5vw,48px);letter-spacing:.04em;color:var(--white);margin-bottom:16px}
.hy-page-content{font-size:15px;line-height:1.95;color:var(--w80)}
.hy-page-content h2,.hy-page-content h3{color:var(--white);font-weight:800;margin:24px 0 10px}
.hy-page-content h2{font-family:var(--font-d);font-size:24px;letter-spacing:.04em}
.hy-page-content p{margin-bottom:16px}

/* ══════════════════════════════════════════
   进场动画
══════════════════════════════════════════ */
@keyframes hyFadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.hy-anim{animation:hyFadeUp .5s cubic-bezier(.16,1,.3,1) both}
.hy-anim-d1{animation-delay:.06s}
.hy-anim-d2{animation-delay:.12s}
.hy-anim-d3{animation-delay:.18s}
.hy-anim-d4{animation-delay:.24s}

/* ══════════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════════ */
@media(max-width:1060px){
  .hy-nav-grid{grid-template-columns:repeat(3,1fr)}
  .hy-nav-card:first-child{grid-row:auto;grid-column:auto}
  .hy-article-layout{grid-template-columns:1fr}
  .hy-article-sidebar{display:none}
  .hy-footer-grid{grid-template-columns:1fr 1fr}
  .hy-bottom-grid{grid-template-columns:1fr}
}
@media(max-width:840px){
  .hy-nav{display:none}
  .hy-hamburger{display:flex}
  .hy-header-btn-ghost{display:none}
  .hy-nav-grid{grid-template-columns:repeat(2,1fr)}
  .hy-news-grid{grid-template-columns:1fr 1fr}
  .hy-news-grid .hy-news-card:first-child{grid-column:1/-1;grid-template-columns:1fr}
  .hy-hero-inner{grid-template-columns:1fr}
  .hy-countdown-card{display:none}
  .hy-copy-grid{grid-template-columns:1fr 1fr}
  .hy-posts-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:560px){
  .hy-nav-grid{grid-template-columns:1fr 1fr}
  .hy-news-grid{grid-template-columns:1fr}
  .hy-copy-grid{grid-template-columns:1fr}
  .hy-posts-grid{grid-template-columns:1fr}
  .hy-social-btns{grid-template-columns:1fr}
  .hy-footer-grid{grid-template-columns:1fr}
  .hy-post-nav{grid-template-columns:1fr}
  .hy-stats-inner{flex-wrap:wrap}
  .hy-stat-item{min-width:50%}
}