
:root{
  --nsa-purple:#8A2BE2;
  --nsa-deep:#1F2A68;
  --nsa-teal:#1996A3;
  --nsa-white:#FFFFFF;
  --nsa-muted:#F5F7FB;
  --nsa-text:#111827;
  --nsa-shadow:0 10px 25px rgba(0,0,0,.06);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
  color:var(--nsa-text);
  background:linear-gradient(180deg, #ffffff 0%, #f7fafe 100%);
  position:relative;
  min-height:100%;
}

/* Subtle logo watermark */
body::after{
  content:"";
  position:fixed;
  inset:auto -10% -10% auto;
  width:40vmin;
  height:40vmin;
  background:url('../assets/logo.png') center/contain no-repeat;
  opacity:.06;
  pointer-events:none;
  filter:grayscale(100%);
}

/* Top nav */
.nsa-nav{
  position:sticky; top:0; z-index:50;
  background:linear-gradient(90deg, var(--nsa-deep), var(--nsa-purple));
  color:var(--nsa-white);
  box-shadow:var(--nsa-shadow);
}
.nsa-container{max-width:1200px; margin:0 auto; padding:0 16px;}
.nsa-nav-inner{display:flex; align-items:center; gap:16px; padding:14px 0;}
.nsa-logo{display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--nsa-white)}
.nsa-logo img{height:40px; width:auto; display:block}
.nsa-logo .brand{font-weight:800; letter-spacing:.3px; font-size:1.15rem; line-height:1}
.nsa-links{margin-left:auto; display:flex; gap:18px; align-items:center}
.nsa-links a{color:var(--nsa-white); text-decoration:none; font-weight:600; opacity:.9}
.nsa-links a:hover{opacity:1; text-decoration:underline}

/* Hero */
.hero{padding:56px 0 24px; background:linear-gradient(180deg, rgba(31,42,104,.07) 0%, rgba(138,43,226,.05) 100%);}
.hero .wrap{display:grid; grid-template-columns:1.1fr .9fr; gap:24px; align-items:center}
@media (max-width:900px){ .hero .wrap{grid-template-columns:1fr} }
.kicker{text-transform:uppercase; font-size:.8rem; letter-spacing:.12em; color:var(--nsa-teal); font-weight:800}
h1{font-size:clamp(1.8rem, 2.6vw + 1rem, 2.8rem); margin:.35rem 0 0; color:var(--nsa-deep)}
.lead{font-size:1.05rem; opacity:.9; margin:.8rem 0 0; max-width:54ch}
.cta-row{display:flex; gap:12px; margin-top:16px; flex-wrap:wrap}
.btn{
  border:0; border-radius:14px; padding:12px 18px; font-weight:700; cursor:pointer;
  transition:.15s transform ease, .2s box-shadow ease; text-decoration:none; display:inline-flex; align-items:center; gap:10px;
}
.btn-primary{background:linear-gradient(90deg, var(--nsa-purple), #6c5ce7); color:white; box-shadow:0 8px 20px rgba(108,92,231,.22)}
.btn-ghost{background:rgba(255,255,255,.6); color:var(--nsa-deep); border:2px solid rgba(31,42,104,.15)}
.btn:hover{transform:translateY(-1px)}
.badges{display:flex; gap:10px; margin-top:10px; flex-wrap:wrap}
.badge{background:var(--nsa-muted); border:1px solid rgba(0,0,0,.06); padding:6px 10px; border-radius:999px; font-size:.8rem; font-weight:700; color:var(--nsa-deep)}

/* Cards */
.grid{display:grid; gap:18px; grid-template-columns:repeat(3,1fr)}
@media (max-width:1000px){ .grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:680px){ .grid{grid-template-columns:1fr} }

.card{
  background:white; border-radius:18px; padding:18px; box-shadow:var(--nsa-shadow); border:1px solid rgba(0,0,0,.06);
}
.card h3{margin:6px 0 4px; color:var(--nsa-deep)}
.card p{margin:0; opacity:.9}
.card .meta{display:flex; justify-content:space-between; align-items:center; margin-top:12px; font-size:.9rem}

/* Footer */
footer{margin-top:40px; background:#0d133a; color:#cfd7ff}
footer .foot{display:flex; gap:16px; align-items:center; padding:20px 0}
footer a{color:#cfd7ff}
.small{font-size:.9rem; opacity:.9}

/* Page shells */
.section{padding:26px 0}
.h2{font-size:1.4rem; color:var(--nsa-deep); margin:0 0 8px}
.sub{opacity:.8; margin:0 0 14px}
.table{width:100%; border-collapse:separate; border-spacing:0; background:white; border-radius:14px; overflow:hidden; box-shadow:var(--nsa-shadow)}
.table th, .table td{padding:12px 14px; border-bottom:1px solid #eef2f7; text-align:left}
.table th{background:#f3f5fb; font-size:.9rem; color:#25306d}
.table tr:last-child td{border-bottom:0}

/* Utility */
.row{display:flex; align-items:center; gap:12px; flex-wrap:wrap}
.muted{opacity:.7}
.notice{background:#fff6cc; border:1px solid #ffe58f; padding:10px 12px; border-radius:12px}
