/* Base variables and theming */
:root {
  --gradient-start: #667eea; /* indigo-400 */
  --gradient-end: #764ba2;   /* purple-500 */
  --color-primary: #6b46c1;  /* purple-600 */
  --color-secondary: #3b82f6;/* blue-500 */
  --text-color: #1f2937;     /* gray-800 */
}

/* Reset and base */
*, *::before, *::after { box-sizing: border-box; }
html, body { height: 100%; }
body { margin: 0; color: var(--text-color); text-rendering: optimizeLegibility; }
img { max-width: 100%; display: block; }
a { text-decoration: none; }

/* Gradients and text */
.gradient-bg { background: linear-gradient(135deg, var(--gradient-start) 0%, var(--gradient-end) 100%); }
.gradient-text {
  background: linear-gradient(135deg, var(--gradient-start) 0%, var(--gradient-end) 100%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}

/* Animations */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(30px); }
  to { opacity: 1; transform: translateY(0); }
}
.fade-in-up { animation: fadeInUp 0.8s ease-out forwards; }

@keyframes float { 0%,100% { transform: translateY(0);} 50% { transform: translateY(-10px);} }
.float-anim { animation: float 3s ease-in-out infinite; }

@keyframes pulse-glow {
  0%,100% { box-shadow: 0 0 20px rgba(59,130,246,0.5); }
  50% { box-shadow: 0 0 40px rgba(59,130,246,0.8); }
}
.pulse-glow { animation: pulse-glow 2s ease-in-out infinite; }

@keyframes fadeIn { from { opacity: 0; transform: translateY(20px);} to { opacity: 1; transform: translateY(0);} }
.fade-in { animation: fadeIn 0.6s ease-out; }

@keyframes pulse { 0%,100% { opacity: 1;} 50% { opacity: 0.8;} }
.pulse-anim { animation: pulse 2s ease-in-out infinite; }

/* Cards */
.card-hover { transition: transform 0.3s ease, box-shadow 0.3s ease; }
.card-hover:hover { transform: translateY(-10px); box-shadow: 0 20px 40px rgba(0,0,0,0.15); }

/* Utility helpers */
.delay-1 { animation-delay: 0.1s; }
.delay-2 { animation-delay: 0.2s; }
.delay-3 { animation-delay: 0.3s; }
.delay-4 { animation-delay: 0.4s; }

/* Footer legal links */
.footer-legal a { color: #9ca3af; }
.footer-legal a:hover { color: white; }

/* Hero background image overlay */
.hero-with-bg { position: relative; }
.hero-with-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url('../images/lovebg.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  opacity: 0.35; /* 调整透明度以保证文字可读性 */
  z-index: 0;
}
/* 确保内容层级在背景之上 */
.hero-with-bg > * { position: relative; z-index: 1; }