body { font-family: 'Segoe UI', Arial, sans-serif; background-color: #f4f6f9; margin: 0; padding: 0; }

/* Top Banner Section */
.top-banner-container { text-align: center; background-color: #1a0000; padding: 15px 10px; border-bottom: 4px solid #ffd700; }
.top-banner-img { max-width: 100%; height: auto; max-height: 420px; border: 3px solid #ffd700; border-radius: 10px; box-shadow: 0 4px 15px rgba(0,0,0,0.5); }

/* Site Header */
.site-title-box { text-align: center; background: linear-gradient(135deg, #800000, #b30000); color: #fff; padding: 15px 10px; border-bottom: 3px solid #ffd700; }
.site-title-box h1 { margin: 0; font-size: 26px; }
.site-title-box h2 { margin: 5px 0; font-size: 18px; color: #ffd700; }
.site-title-box p { margin: 0; font-size: 13px; color: #f0f0f0; }

/* Navigation */
.nav-bar { background: #333; padding: 12px; text-align: center; }
.nav-bar a { color: #fff; margin: 0 10px; text-decoration: none; font-weight: bold; font-size: 14px; }
.nav-bar a:hover { color: #ffd700; }

/* Main Container */
.container { max-width: 1100px; margin: 20px auto; background: #fff; padding: 25px; border-radius: 8px; box-shadow: 0 0 15px rgba(0,0,0,0.1); }

/* Forms */
.form-group { margin-bottom: 15px; }
.form-group label { display: block; font-weight: bold; margin-bottom: 5px; color: #333; }
.form-control { width: 100%; padding: 10px; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; }
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
@media (max-width: 768px) { .grid-2 { grid-template-columns: 1fr; } }

/* Profile Cards */
.grid-container { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 20px; margin-top: 20px; }
.card { background: #fff; border-radius: 8px; padding: 15px; box-shadow: 0 2px 8px rgba(0,0,0,0.1); border-top: 4px solid #800000; border: 1px solid #e0e0e0; }
.card img { width: 100%; height: 220px; object-fit: cover; border-radius: 6px; }
.locked-box { background: #fff3cd; color: #856404; padding: 12px; font-size: 13px; text-align: center; border-radius: 4px; margin-top: 10px; border: 1px dashed #ffeeba; }
.btn-submit { background: #28a745; color: white; padding: 12px 25px; border: none; border-radius: 4px; cursor: pointer; font-weight: bold; }
.btn-reset { background: #dc3545; color: white; padding: 12px 25px; border: none; border-radius: 4px; cursor: pointer; font-weight: bold; }
.btn-print { background: #007bff; color: white; padding: 8px 15px; text-decoration: none; border-radius: 4px; display: inline-block; margin-top: 10px; font-weight: bold; }
