/* Shared component styles */

.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.container-sm { max-width: 900px; margin: 0 auto; padding: 0 24px; }
.container-md { max-width: 1000px; margin: 0 auto; padding: 0 24px; }

.btn-primary {
  display: inline-block;
  background: linear-gradient(135deg, var(--orange-dim), var(--orange));
  color: #ebdbb2; padding: 18px 32px; border-radius: 14px;
  font-weight: 600; font-size: 18px; transition: opacity 0.2s;
  box-shadow: 0 8px 32px rgba(251, 73, 52, 0.25);
  text-decoration: none; border: none; cursor: pointer;
}
.btn-primary:hover { opacity: 0.9; }

.btn-secondary {
  display: inline-block;
  border: 1px solid var(--bg2); color: var(--fg2);
  padding: 18px 32px; border-radius: 14px; font-weight: 500;
  background: transparent; transition: background 0.2s;
  text-decoration: none; cursor: pointer;
}
.btn-secondary:hover { background: var(--bg1); }

/* Page header pattern used by security, privacy, terms, canary */
.page-header { padding: 120px 24px 60px; text-align: center; border-bottom: 1px solid var(--bg1); }
.page-header h1 { font-size: 42px; font-weight: 700; margin-bottom: 16px; }
.page-header p { color: var(--fg3); font-size: 18px; max-width: 600px; margin: 0 auto; }
.last-updated { color: var(--bg3); font-size: 14px; margin-top: 16px; }

/* Section title pattern */
.section-title { font-size: 32px; font-weight: 700; text-align: center; margin-bottom: 12px; }
.section-subtitle { color: var(--fg3); text-align: center; margin-bottom: 48px; max-width: 500px; margin-left: auto; margin-right: auto; }