/* base.css - 重置+变量+工具类（全局加载） */

/* ===== CSS Reset ===== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 14px; line-height: 1.8; -webkit-text-size-adjust: 100%; }
body { font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif; color: #333; background: #F5F7FA; }
h1, h2, h3, h4, h5, h6 { font-weight: 600; line-height: 1.4; }
a { text-decoration: none; color: #1E3A5F; transition: color 0.2s; }
a:hover { color: #D4A574; }
img { max-width: 100%; height: auto; display: block; border: 0; }
ul, ol { list-style: none; }
table { border-collapse: collapse; width: 100%; }
input, textarea, button { font-family: inherit; font-size: inherit; outline: none; }
button { cursor: pointer; border: none; background: none; }

/* ===== CSS Variables ===== */
:root {
  --primary: #1E3A5F;
  --secondary: #D4A574;
  --dark: #0F1E2E;
  --bg: #F5F7FA;
  --white: #FFFFFF;
  --text: #333333;
  --muted: #666666;
  --border: #C8D4E0;
  --shadow: 0 2px 12px rgba(30,58,95,0.08);
  --shadow-hover: 0 8px 30px rgba(30,58,95,0.15);
}

/* ===== Utility Classes ===== */
.container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
.text-center { text-align: center; }
.text-primary { color: var(--primary); }
.text-secondary { color: var(--secondary); }
.text-white { color: var(--white); }
.text-muted { color: var(--muted); }
.bg-primary { background: var(--primary); }
.bg-dark { background: var(--dark); }
.bg-light { background: var(--bg); }
.d-flex { display: flex; }
.d-block { display: block; }
.d-none { display: none; }
.flex-wrap { flex-wrap: wrap; }
.justify-between { justify-content: space-between; }
.justify-center { justify-content: center; }
.align-center { align-items: center; }
.w-100 { width: 100%; }
.mb-1 { margin-bottom: 10px; }
.mb-2 { margin-bottom: 20px; }
.mb-3 { margin-bottom: 30px; }
.mb-4 { margin-bottom: 40px; }
.mt-2 { margin-top: 20px; }
.mt-3 { margin-top: 30px; }
.p-2 { padding: 20px; }
.p-3 { padding: 30px; }

/* ===== Responsive Utilities ===== */
@media (min-width: 768px) {
  .container { padding: 0 40px; }
}
@media (min-width: 1024px) {
  .container { padding: 0; }
  .d-lg-flex { display: flex; }
  .d-lg-block { display: block; }
  .d-lg-none { display: none; }
}
@media (max-width: 767px) {
  .d-sm-none { display: none; }
  .d-sm-block { display: block; }
}