/* ---------- Reset / body ---------- */
* { box-sizing: border-box; }

body.site-body {
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 1.6;
  color: var(--c-accent-1);
  background: var(--c-accent-8);
  margin: 0;
}

.site-body h1, .site-body h2, .site-body h3, .site-body h4 {
  font-family: var(--font-heading);
  font-weight: 300;
  color: var(--c-accent-1);
  margin: 0 0 .5em;
  letter-spacing: -.01em;
}
.site-body h1 { font-size: 52px; line-height: 1.15; font-weight: 600; text-transform: uppercase; letter-spacing: .02em; }
.site-body h2 { font-size: 34px; line-height: 1.25; font-weight: 300; }
.site-body h3 { font-size: 28px; line-height: 1.3; font-weight: 400; }
.site-body h4 { font-size: 20px; line-height: 1.3; font-weight: 500; }
.site-body h5, .site-body h6 {
  font-family: var(--font-body);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  font-size: 13px;
}
@media (max-width: 767px) {
  .site-body h1 { font-size: 28px; }
  .site-body h2 { font-size: 24px; }
  .site-body h3 { font-size: 22px; }
}

.site-container { max-width: var(--container-max); margin: 0 auto; padding: 0 20px; }

a { color: inherit; text-decoration: none; }
.site-body a:hover { color: var(--c-accent-2); }

/* ---------- Buttons ---------- */
.btn-site {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5em;
  background: var(--c-accent-1);
  color: var(--c-accent-5);
  border: 1px solid var(--c-accent-1);
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .08em;
  padding: 14px 30px;
  border-radius: var(--radius);
  transition: all var(--transition);
  cursor: pointer;
}
.btn-site:hover { background: var(--c-accent-2); border-color: var(--c-accent-2); color: var(--c-accent-5); }
.btn-site-outline {
  background: transparent;
  color: var(--c-accent-5);
  border: 1px solid var(--c-accent-5);
}
.btn-site-outline:hover { background: var(--c-accent-5); color: var(--c-accent-1); }
.btn-site-light { background: var(--c-accent-8); color: var(--c-accent-1); border-color: var(--c-accent-8); }
.btn-site-light:hover { background: var(--c-accent-2); color: var(--c-accent-5); border-color: var(--c-accent-2); }
.btn-site-accent { background: var(--c-accent-2); border-color: var(--c-accent-2); }
.btn-site-accent:hover { background: var(--c-accent-1); border-color: var(--c-accent-1); }
.btn-site-sm { padding: 10px 20px; font-size: 11px; }

/* ---------- Forms ---------- */
.site-form label { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; font-weight: 700; margin-bottom: 6px; display: block; color: var(--c-accent-4); }
.site-form .form-control, .site-form .form-select {
  border-radius: var(--radius); border: 1px solid var(--c-accent-3); padding: 11px 14px; font-family: var(--font-body); font-size: 13px;
}
.site-form .form-control:focus, .site-form .form-select:focus { border-color: var(--c-accent-1); box-shadow: 0 0 0 3px rgba(22,24,29,.08); }

/* ---------- Alerts / flash ---------- */
.site-alert { padding: 14px 18px; border-radius: var(--radius); margin-bottom: 20px; font-size: 13px; }
.site-alert-success { background: var(--c-success-bg); color: var(--c-success-text); border: 1px solid #bbf7d0; }
.site-alert-danger { background: #fdecea; color: #b3261e; border: 1px solid #f5c2c0; }

/* ---------- Badges / pills ---------- */
.pill-badge { display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px; border-radius: 30px; font-size: 12px; font-weight: 600; }
.pill-badge-success { background: var(--c-success-bg); color: var(--c-success-text); }
.pill-badge-danger { background: #fdecea; color: #b3261e; }

/* ---------- 404 ---------- */
.error-404 { text-align: center; padding: 100px 20px; }
.error-404 .code { font-family: var(--font-heading); font-weight: 700; font-size: 120px; color: var(--c-accent-3); line-height: 1; }
