/*! 由 ./zh/support/index.html 内联 <style> 原样提取，勿手改（保持视觉一致） */

*{margin:0;padding:0;box-sizing:border-box;}
:root{
  --primary:#87CEEB;
  --primary-dark:#4682B4;
  --bg:#E6F7FF;
  --card:#FFFFFF;
  --text:#333;
  --gray:#666;
  --alert-bg:#003366;
  --gap-sm:8px;
  --gap-md:16px;
  --gap-lg:24px;
  --padding-sm:12px;
  --padding-md:20px;
  --padding-lg:30px;
}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",
  "PingFang SC","Microsoft YaHei",sans-serif;
  background:#f0f4f8;color:var(--text);min-height:100vh;
  display:flex;flex-direction:column;
  font-size:16px;
}
.navbar{
  background:var(--primary);padding:12px 0;
  box-shadow:0 2px 10px rgba(0,0,0,0.1);
  position:sticky;top:0;z-index:100;width:100%;
}
.nav-container{
  max-width:1200px;margin:0 auto;
  display:flex;justify-content:space-between;align-items:center;
  padding:0 var(--padding-sm);
}
.logo{
  font-size:clamp(1.2rem,4vw,1.5rem);
  font-weight:bold;color:var(--primary-dark);
  text-decoration:none;
}
.nav-links{display:flex;gap:clamp(12px,3vw,20px);}
.nav-links a{
  color:var(--primary-dark);font-weight:500;
  text-decoration:none;font-size:clamp(0.9rem,3vw,1rem);
}
.nav-links a:hover,.nav-links a.active{
  text-decoration:underline;font-weight:600;
}
.page-wrapper{
  flex:1;display:flex;flex-direction:column;
  align-items:center;padding:var(--padding-lg) var(--padding-sm);
}
.container{
  max-width:700px;width:100%;
  display:flex;flex-direction:column;gap:var(--gap-lg);
}
.card{
  background:var(--card);border-radius:16px;
  box-shadow:0 8px 24px rgba(135,206,235,0.4);
  padding:clamp(var(--padding-md),4vw,var(--padding-lg));
}
.card h1{
  color:var(--primary-dark);
  margin-bottom:var(--gap-md);
  font-size:clamp(1.4rem,5vw,1.8rem);
  text-align:center;
}
.sponsor-image{
  width:100%;border-radius:12px;overflow:hidden;
  margin:20px 0;
  box-shadow:0 4px 12px rgba(0,0,0,0.1);
}
.sponsor-image img{
  width:100%;height:auto;display:block;
}
.remark{
  background:#fff9e6;color:#d97c00;
  padding:14px 16px;border-radius:12px;
  font-size:14px;line-height:1.6;
  text-align:center;
}
/* 新增说明样式 */
.note {
  margin-top: 12px;
  font-size: 14px;
  color: var(--gray);
  line-height: 1.6;
  text-align: center;
}
footer{
  text-align:center;padding:var(--padding-md);
  background:var(--primary);color:var(--primary-dark);
  font-size:14px;width:100%;
}

/* ===== 动画 ===== */
/* 页面入场：卡片淡入微微上移 */
@keyframes fadeInUp {
  0%   { opacity:0; transform:translateY(24px); }
  100% { opacity:1; transform:translateY(0); }
}

/* 图片呼吸浮动效果 */
@keyframes float {
  0%, 100% { transform:translateY(0); }
  50%      { transform:translateY(-6px); }
}

/* 温馨提示入场（延迟出现） */
@keyframes fadeIn {
  0%   { opacity:0; }
  100% { opacity:1; }
}

/* 卡片入场 */
.card{
  animation:fadeInUp 0.7s cubic-bezier(0.25,0.46,0.45,0.94) both;
}

/* 温馨提示延迟淡入 */
.remark{
  animation:fadeIn 0.8s ease 0.3s both;
}

/* note 再晚一点 */
.note{
  animation:fadeIn 0.8s ease 0.5s both;
}

/* 卡片悬停：轻微上浮 + 阴影加深 */
.card{
  transition:transform 0.35s cubic-bezier(0.25,0.46,0.45,0.94),
             box-shadow 0.35s cubic-bezier(0.25,0.46,0.45,0.94);
}
.card:hover{
  transform:translateY(-4px);
  box-shadow:0 16px 40px rgba(135,206,235,0.5);
}

/* 图片区域内飘浮动画（悬停暂停） */
.sponsor-image img{
  animation:float 4s ease-in-out infinite;
  transition:transform 0.3s;
}
.sponsor-image:hover img{
  animation-play-state:paused;
  transform:scale(1.02);
}

/* 导航栏链接过渡平滑 */
.nav-links a{
  transition:color 0.25s, text-decoration 0.25s;
}

/* 导航栏入场 */
.navbar{
  animation:fadeIn 0.6s ease both;
}

/* 页脚入场 */
footer{
  animation:fadeIn 1s ease 0.9s both;
}