* { box-sizing: border-box; }
body { margin:0; font-family: Arial, Helvetica, sans-serif; color:#222; background:#fafafa; }
a { color:#c5002e; text-decoration:none; }
a:hover { text-decoration:underline; }
.container { width: 95%; max-width: 1000px; margin: 0 auto; }
.site-header { background:#fff; border-bottom:1px solid #eee; position:sticky; top:0; z-index:10; }
.header-inner { display:flex; align-items:center; justify-content:space-between; padding:12px 0; }
.logo { font-weight:bold; color:#c5002e; }
nav a { margin-left:12px; }
.main-content { padding:24px 0; min-height: calc(100vh - 140px); }
.site-footer { background:#111; color:#ddd; padding:20px 0; }

.auth-box { max-width:420px; margin:40px auto; background:#fff; padding:24px; border:1px solid #eee; border-radius:8px; }
.form-group { margin-bottom:12px; }
.form-group label { display:block; margin-bottom:6px; font-weight:bold; }
.form-group input, .form-group textarea { width:100%; padding:10px; border:1px solid #ccc; border-radius:6px; background:#fff; }
.form-actions { margin-top:16px; }

.btn { display:inline-block; padding:10px 14px; border-radius:6px; border:1px solid #ccc; background:#fff; color:#222; text-decoration:none; cursor:pointer; }
.btn.primary { background:#c5002e; border-color:#b4002a; color:#fff; }
.btn.danger { background:#e53935; border-color:#c62828; color:#fff; }
.btn + .btn { margin-left:8px; }

.alert { padding:10px 12px; border-radius:6px; margin:10px 0; }
.alert-error { background:#fdecea; color:#611a15; border:1px solid #f5c6cb; }
.alert-success { background:#e8f5e9; color:#1b5e20; border:1px solid #c8e6c9; }

.table { width:100%; border-collapse:collapse; background:#fff; }
.table th, .table td { padding:10px; border:1px solid #eee; text-align:left; }
.flex-between { display:flex; align-items:center; justify-content:space-between; }
.cards { display:grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap:16px; }
.card { background:#fff; border:1px solid #eee; padding:16px; border-radius:8px; }
.card-title { font-weight:bold; margin-bottom:10px; }
.card-value { font-size:28px; margin-bottom:10px; }
.card-actions .btn { margin-right:8px; margin-bottom:8px; }

.form-grid { display:grid; grid-template-columns: 1fr 1fr; gap:12px; }
@media (max-width:700px) { .form-grid { grid-template-columns: 1fr; } }

.hero { background: linear-gradient(135deg, #fff, #ffe6eb); padding:40px 0; border-bottom:1px solid #f3ccd3; }
.hero-content { max-width:900px; margin:0 auto; text-align:center; }
.hero h1 { font-size:36px; margin-bottom:8px; }
.hero p { font-size:16px; color:#444; }
.hero-cta { margin:16px 0 8px; }
.hero-photo { max-width:140px; border-radius:50%; border:4px solid #fff; box-shadow:0 2px 10px rgba(0,0,0,.1); }
.hero-bio { color:#555; margin-top:10px; }

.features { padding:30px 0; }
.features h2, .how-it-works h2 { text-align:center; margin-bottom:20px; }
.grid-3 { display:grid; grid-template-columns: repeat(3, 1fr); gap:12px; }
@media (max-width:900px) { .grid-3 { grid-template-columns: 1fr 1fr; } }
@media (max-width:600px) { .grid-3 { grid-template-columns: 1fr; } }
.feature-card { background:#fff; border:1px solid #eee; border-radius:8px; padding:16px; min-height:120px; }
.center { text-align:center; margin-top:16px; }

.how-it-works { background:#fff; border-top:1px solid #eee; padding:30px 0; }
.steps { max-width:700px; margin:0 auto; }
.steps li { margin:6px 0; }
