@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');

:root{
  --primary:#2563eb;
  --primary-2:#1d4ed8;
  --dark:#0b1220;
  --text:#0f172a;
  --muted:#64748b;
  --light:#f8fafc;
  --border:#e2e8f0;
  --shadow: 0 20px 60px rgba(2,6,23,.08);
  --shadow2: 0 30px 90px rgba(2,6,23,.10);
}

*{ box-sizing:border-box; }
body{
  font-family:'Inter',sans-serif;
  color:var(--text);
  background:#fff;
}

a{ color:inherit; }
.muted{ color:var(--muted); }

.navbar{
  padding: 1rem 0;
  backdrop-filter: saturate(180%) blur(12px);
}
.navbar .nav-link{
  font-weight:600;
  color:#0f172a;
  opacity:.85;
}
.navbar .nav-link:hover{ opacity:1; }
.navbar .nav-link.active{ color:var(--primary); opacity:1; }

.page-hero{
  padding-top: 7.5rem;
  padding-bottom: 4rem;
  background:
    radial-gradient(1000px 500px at 10% 10%, rgba(37,99,235,.14), transparent 60%),
    radial-gradient(1000px 600px at 90% 0%, rgba(99,102,241,.12), transparent 55%),
    linear-gradient(to bottom, #ffffff, #f8fafc);
  border-bottom: 1px solid var(--border);
}
.kicker{
  display:inline-flex;
  gap:.5rem;
  align-items:center;
  padding:.35rem .75rem;
  border: 1px solid var(--border);
  border-radius: 999px;
  background:#fff;
  font-weight:600;
  font-size:.9rem;
}
.kicker i{ color:var(--primary); }

.h1{
  font-weight:900;
  letter-spacing:-1px;
  line-height:1.05;
}
.lead{
  font-size:1.1rem;
  color:var(--muted);
}

.section{
  padding: 5rem 0;
}

.card-modern{
  border:1px solid var(--border);
  border-radius: 22px;
  padding: 1.75rem;
  background:#fff;
  box-shadow: 0 1px 0 rgba(2,6,23,.03);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  height:100%;
}
.card-modern:hover{
  transform: translateY(-6px);
  box-shadow: var(--shadow);
  border-color: rgba(37,99,235,.35);
}

.icon-badge{
  width: 46px;
  height: 46px;
  border-radius: 14px;
  display:grid;
  place-items:center;
  background: rgba(37,99,235,.10);
  border: 1px solid rgba(37,99,235,.18);
}
.icon-badge i{
  font-size: 1.25rem;
  color: var(--primary);
}

.tag{
  display:inline-block;
  padding:.25rem .6rem;
  border: 1px solid var(--border);
  border-radius: 999px;
  font-size:.85rem;
  font-weight:600;
  color: var(--muted);
  background:#fff;
}

.btn-primary{
  background: var(--primary);
  border:none;
  border-radius: 14px;
  padding: .8rem 1.3rem;
  font-weight:700;
  box-shadow: 0 10px 25px rgba(37,99,235,.20);
}
.btn-primary:hover{
  background: var(--primary-2);
}
.btn-outline{
  border:1px solid var(--border);
  border-radius: 14px;
  padding: .8rem 1.3rem;
  font-weight:700;
  background:#fff;
}
.btn-outline:hover{
  border-color: rgba(37,99,235,.35);
  color: var(--primary);
}

.media-card{
  border:1px solid var(--border);
  border-radius: 24px;
  overflow:hidden;
  background:#fff;
  box-shadow: 0 1px 0 rgba(2,6,23,.03);
  transition: transform .22s ease, box-shadow .22s ease;
  height:100%;
}
.media-card:hover{
  transform: translateY(-6px);
  box-shadow: var(--shadow);
}
.media-card img{
  width:100%;
  height: 210px;
  object-fit: cover;
}

.meta{
  font-size:.9rem;
  color: var(--muted);
}

.hr-soft{
  border:0;
  height:1px;
  background: linear-gradient(90deg, transparent, rgba(148,163,184,.45), transparent);
  margin: 2.5rem 0;
}

.footer{
  background: #020617;
  color: #94a3b8;
  padding: 4.5rem 0 2rem;
  margin-top: 4rem;
}
.footer a{ color:#94a3b8; text-decoration:none; }
.footer a:hover{ color:#e2e8f0; }
.footer h6{ color:#fff; }

.fade-up{
  opacity:0;
  transform: translateY(14px);
  transition: opacity .7s ease, transform .7s ease;
}
.fade-up.show{
  opacity:1;
  transform: translateY(0);
}

/* Small tweaks */
@media (max-width: 992px){
  .h1{ font-size: 2.25rem; }
}