/* Modern UI style for 4SRIC - Modern theme */
:root{
  --blue:#009FE3;
  --blue-dark:#0A6AA1;
  --yellow:#F4D03F;
  --bg:#f6fbff;
  --card:#ffffff;
  --muted:#6b7280;
  --glass: rgba(255,255,255,0.6);
  --radius:12px;
  --shadow: 0 8px 30px rgba(2,6,23,0.06);
}
*{box-sizing:border-box}
body{margin:0;font-family:'Cairo',sans-serif;background:linear-gradient(180deg,#f3fbff 0%, #fffdf6 100%);color:var(--blue-dark);-webkit-font-smoothing:antialiased}
.container{max-width:1100px;margin:22px auto;padding:0 18px}
.site-header{display:flex;align-items:center;justify-content:space-between;padding:18px;background:transparent}
.logo{height:78px;border-radius:10px;object-fit:contain}
.header-center{text-align:center;flex:1}
.header-center h1{margin:0;font-size:20px;font-weight:700;color:var(--blue-dark)}
.header-center .sub{font-size:13px;color:var(--muted);margin-top:6px}
.topbar{background:linear-gradient(90deg,var(--blue),#34b7f0);color:white;padding:10px 0;border-radius:10px;margin:0 12px;box-shadow:var(--shadow)}
.topbar .container{display:flex;align-items:center;justify-content:space-between}
.nav-link{color:white;margin-left:14px;text-decoration:none;font-weight:700}
.langBtn{background:var(--yellow);border:none;padding:8px 12px;border-radius:8px;cursor:pointer;font-weight:700}
.card{background:var(--card);padding:22px;border-radius:var(--radius);margin:16px 0;box-shadow:var(--shadow)}
.hero{display:flex;align-items:center;justify-content:space-between;padding:26px;background:linear-gradient(135deg,var(--blue),#67c6f8);color:white;border-radius:var(--radius)}
.hero-inner{flex:1}
.hero h2{margin:0 0 8px 0;font-size:24px}
.hero p{margin:0 0 12px 0;opacity:0.95}
.hero-actions .btn{margin-right:8px}
.btn{padding:10px 16px;border-radius:10px;border:none;cursor:pointer;font-weight:800}
.btn.primary{background:var(--yellow);color:var(--blue-dark)}
.btn.outline{background:transparent;color:white;border:2px solid rgba(255,255,255,0.18)}
.countdown{font-weight:800;text-align:right}
.grid-3{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-top:12px}
.track{background:linear-gradient(180deg,#fff,#f7fcff);padding:14px;border-radius:10px;border:1px solid #e6f6ff;text-align:center}
.row label{display:block;margin-top:10px;font-weight:700}
.row input,.row textarea,.row select{width:100%;padding:10px;border-radius:8px;border:1px solid #e6eef6;margin-top:6px}
.site-footer{text-align:center;padding:22px;background:linear-gradient(90deg,var(--blue),#34b7f0);color:white;margin-top:20px;border-radius:8px}
.success{background:#ecfdf5;border:1px solid #bbf7d0;color:#065f46;padding:10px;border-radius:8px;margin-top:10px}
.error{background:#fff1f2;border:1px solid #fecaca;color:#9b1c1c;padding:10px;border-radius:8px;margin-top:10px}
@media (max-width:800px){ .hero{flex-direction:column;text-align:center}.logo{height:56px}.header-center h1{font-size:18px} }