.site-header-bar {
  display:flex; justify-content:space-between; align-items:center;
  padding:12px 20px; background:transparent; position:absolute; top:0; left:0; right:0; z-index:999;
  color:white; font-weight:bold;
}
.site-header-bar .auth-links a { color:white; margin-left:15px; text-decoration:none; }

.hero { height: 60vh; display:flex; align-items:center; justify-content:center; color:white; text-align:center; position:relative; }
.hero .overlay { position:absolute; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.5); }
.hero-content { position:relative; z-index:2; }
.hero h1 { font-size:2.5rem; margin-bottom:10px; }

.cards { display:flex; justify-content:center; gap:20px; margin-top:-60px; position:relative; z-index:3; flex-wrap: wrap; }
.card { background:#fff; padding:20px; border-radius:12px; box-shadow:0 5px 15px rgba(0,0,0,0.1); text-align:center; width:200px; }
.card img { max-width:100px; margin-bottom:10px; }
.card a { display:inline-block; padding:8px 16px; background:#0073aa; color:#fff; text-decoration:none; border-radius:5px; }

.modal { display:none; position:fixed; z-index:1000; left:0; top:0; width:100%; height:100%; overflow:auto; background:rgba(0,0,0,0.7); }
.modal-content { background:#fff; margin:6% auto; padding:20px; border-radius:12px; width:340px; position:relative; }
.close { position:absolute; top:10px; right:15px; font-size:20px; cursor:pointer; }
.tabs { display:flex; justify-content:center; margin-bottom:15px; gap:6px; }
.tab-link { flex:1; padding:10px; cursor:pointer; border:none; background:#f1f1f1; }
.tab-link.active { background:#0073aa; color:#fff; }
.tab-content { display:none; }
.tab-content.active { display:block; }
.tab-content form { display:flex; flex-direction:column; gap:10px; }
.tab-content input { padding:10px; border:1px solid #ccc; border-radius:5px; }
.tab-content button { padding:10px; background:#0073aa; color:#fff; border:none; border-radius:5px; cursor:pointer; }
@media (max-width:600px){
  .modal-content { width:90%; margin-top:20%; }
  .cards { flex-direction:column; margin-top:10px; }
}