@charset "utf-8";
/* =========================================================
   oy template - base.css
   Base layer: variables / reset / typography / shared components
   ========================================================= */

/* ---------- Variables ---------- */
:root {
  --dark: #222222;        /* primary dark (header background) */
  --dark-2: #1a1a1a;      /* deeper dark (footer / mobile menu) */
  --gold: #c89666;        /* brand accent (gold) */
  --gold-dark: #b08054;   /* accent hover */
  --light: #f8f8f8;       /* light grey background (alternating sections) */
  --line: #e5e5e5;        /* divider line */
  --text: #333333;        /* body text */
  --muted: #777777;       /* secondary text */
  --radius: 6px;          /* shared border radius */
}

/* ---------- Reset ---------- */
* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: Arial, Helvetica, "Microsoft YaHei", sans-serif;
  color: var(--text);
  line-height: 1.6;
  background: #fff;
}
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }

/* ---------- Layout container ---------- */
.container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
section { padding: 70px 0; }
.section-alt { background: var(--light); }        /* alternating background section */
.section-title { text-align: center; font-size: 32px; margin-bottom: 50px; color: var(--dark); }
.text-center { text-align: center; }

/* ---------- Buttons ---------- */
.btn {
  display: inline-block;
  background: var(--gold);
  color: #fff;
  padding: 14px 32px;
  border-radius: 4px;
  font-weight: bold;
  border: 0;
  cursor: pointer;
  transition: background .2s;
}
.btn:hover { background: var(--gold-dark); }
.btn-block { width: 100%; }