/* 基础样式重置 */ :root { --grass-green: #2e8b57; --golden-yellow: #ffd700; --dark-green: #1e5631; --light-gold: #ffec80; } body { font-family: 'Microsoft YaHei', sans-serif; line-height: 1.6; color: #333; } /* 蒙古族风格装饰元素 */ .gold-pattern { background-image: url('../images/gold-pattern.png'); background-repeat: repeat-x; height: 10px; } /* 导航栏增强 */ .navbar { box-shadow: 0 2px 10px rgba(0,0,0,0.1); transition: all 0.3s ease; } .navbar.scrolled { background-color: var(--dark-green) !important; box-shadow: 0 4px 12px rgba(0,0,0,0.15); } /* 英雄区域动画 */ .hero-section { animation: fadeIn 1.5s ease-in-out; } @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } /* 功能卡片增强 */ .feature-card { border-radius: 12px; overflow: hidden; } .feature-card .card-body { position: relative; z-index: 1; } .feature-card::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(135deg, var(--grass-green), var(--dark-green)); opacity: 0; transition: opacity 0.3s ease; z-index: 0; } .feature-card:hover::before { opacity: 0.1; } /* 轮播指示器样式 */ .carousel-indicators button { width: 12px; height: 12px; border-radius: 50%; background-color: #ccc; border: none; margin: 0 5px; transition: background-color 0.3s ease; } .carousel-indicators button.active { background-color: var(--grass-green); } /* 响应式调整 */ @media (max-width: 768px) { .hero-section { min-height: 50vh; } .display-3 { font-size: 2.5rem; } }