/* Sabrud branding */
:root{
  --primary:#1A2FA0; /* royal blue */
  --accent:#D7261B; /* red */
  --accent-2:#F7D10B; /* yellow */
  --text:#0f172a;
  --muted:#475569;
  --card:#ffffff;
  --bg:#f6f8fb;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:Inter,system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--text);background:var(--bg)}
.container{max-width:1100px;margin:10px auto;padding:0 16px}
.site-header{background:var(--primary);color:white;position:sticky;top:0;z-index:50}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:12px 0}
.brand{display:flex;gap:12px;align-items:center;text-decoration:none;color:inherit}
.brand-title{font-weight:800;font-size:18px;color:white}
.brand-tag{font-size:12px;color:rgba(255,255,255,0.85)}
.logo{width:56px;height:56px;object-fit:contain;border-radius:6px;background:white;padding:4px}
.nav{position:relative}
.nav-list{display:flex;gap:14px;list-style:none;margin:0;padding:0}
.nav-list a{display:inline-block;padding:8px 12px;border-radius:8px;text-decoration:none;color:white}
.nav-list a:hover{background:rgba(255,255,255,0.08)}
.nav-burger{display:none;font-size:24px;padding:6px 8px;border-radius:8px;border:1px solid rgba(255,255,255,0.08);cursor:pointer;color:white}
.nav-toggle{display:none}

.hero {
  display: grid;
  grid-template-columns: 1fr; /* one full-width column */
  gap: 2px;
  align-items: center;
  margin: 26px 0;
  padding: 20px;
  background: linear-gradient(90deg, rgba(26,47,160,0.06), rgba(247,209,11,0.03));
  border-radius: 12px;
}

.hero h1{font-size:34px;line-height:1.05;margin:0 0 8px;color:var(--primary)}
.hero p{color:var(--muted);font-size:16px}
.cta{display:flex;gap:12px;margin-top:14px}
.btn{display:inline-block;padding:10px 14px;border-radius:10px;font-weight:700;text-decoration:none;box-shadow:0 2px 6px rgba(0,0,0,0.06)}
.btn.primary{background:var(--primary);color:white}
.btn.accent{background:var(--accent);color:white}
.card{background:var(--card);border:1px solid #e6eefb;border-radius:12px;padding:14px}
.grid{display:grid;gap:16px}
.grid.cols-3{grid-template-columns:repeat(3,1fr)}
.grid.cols-2{grid-template-columns:repeat(2,1fr)}
.table{width:100%;border-collapse:collapse}
.table th,.table td{border-bottom:1px solid #eef3ff;padding:10px 8px;text-align:left;vertical-align:top}
.notice{background:#fff7e6;border:1px solid #fff0c2;padding:12px;border-radius:10px;color:#7a5a00}
.footer-bottom{text-align:center;padding:10px 0;border-top:1px solid rgba(255,255,255,0.08);font-size:14px}
section{margin:22px 0}

/* Footer Styles */
.site-footer {
  background: #1A2FA0; /* Royal blue */
  color: #ffffff;
  font-family: Arial, sans-serif;
  padding: 20px 40px 20px;
}

.footer-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 20px;
  max-width: 1200px;
  margin: 0 auto;
}

.footer-grid div {
  flex: 1 1 250px;
  min-width: 220px;
}

.site-footer h4 {
  margin-bottom: 10px;
  font-size: 1.2rem;
  color: #F7D10B; /* Yellow accent */
}

.site-footer p {
  margin: 6px 0;
  font-size: 0.95rem;
  line-height: 1.5;
}

.site-footer a {
  color: #f1f1f1;
  text-decoration: none;
  transition: color 0.3s ease;
}

.site-footer a:hover {
  color: #D7261B; /* Red accent */
}

.footer-bottom {
  text-align: center;
  margin-top: 30px;
  padding-top: 15px;
  font-size: 0.85rem;
  border-top: 1px solid rgba(255, 255, 255, 0.3);
  color: #dcdcdc;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .footer-grid {
    flex-direction: column;
    text-align: center;
  }
}