/* Theme Starter CSS v3.2.1 */
:root {
  --primary-color: #3498db;
  --secondary-color: #2ecc71;
  --font-family: 'Segoe UI', Tahoma, Geneva, sans-serif;
  --border-radius: 8px;
  --transition-speed: 0.3s;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
  font-family: var(--font-family);
  line-height: 1.6;
  color: #333;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

.container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
.btn { display: inline-block; padding: 12px 24px; border-radius: var(--border-radius); }
.btn-primary { background: var(--primary-color); color: white; }
.btn-secondary { background: var(--secondary-color); color: white; }

/* Grid System */
.row { display: flex; flex-wrap: wrap; margin: 0 -15px; }
.col { flex: 1; padding: 0 15px; }
.col-6 { flex: 0 0 50%; max-width: 50%; }
.col-4 { flex: 0 0 33.333%; max-width: 33.333%; }
.col-3 { flex: 0 0 25%; max-width: 25%; }

/* Typography */
h1, h2, h3, h4, h5, h6 { margin-bottom: 1rem; font-weight: 600; }
h1 { font-size: 2.5rem; }
h2 { font-size: 2rem; }
h3 { font-size: 1.75rem; }

/* Cards */
.card { background: white; border-radius: var(--border-radius); box-shadow: 0 4px 6px rgba(0,0,0,0.1); }
.card-header { padding: 1rem; border-bottom: 1px solid #eee; }
.card-body { padding: 1.5rem; }

/* Forms */
.form-group { margin-bottom: 1rem; }
.form-control { width: 100%; padding: 10px 15px; border: 1px solid #ddd; border-radius: var(--border-radius); }
.form-control:focus { outline: none; border-color: var(--primary-color); }

/* Utilities */
.text-center { text-align: center; }
.mt-1 { margin-top: 0.5rem; }
.mt-2 { margin-top: 1rem; }
.mb-1 { margin-bottom: 0.5rem; }
.mb-2 { margin-bottom: 1rem; }
.p-1 { padding: 0.5rem; }
.p-2 { padding: 1rem; }

@media (max-width: 768px) {
  .col-6, .col-4, .col-3 { flex: 0 0 100%; max-width: 100%; }
  h1 { font-size: 2rem; }
}
