:root {
  --navy: #0B1D3A;
  --navy-light: #122B52;
  --green: #2ECC71;
  --green-dark: #27AE60;
  --green-glow: rgba(46,204,113,0.15);
  --white: #FFFFFF;
  --gray-50: #F8FAFB;
  --gray-100: #EEF2F5;
  --gray-200: #D1D9E0;
  --gray-400: #8896A6;
  --gray-600: #4A5568;
  --gray-800: #1A202C;
}
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:'Inter',-apple-system,sans-serif; color:var(--gray-800); background:var(--white); -webkit-font-smoothing:antialiased; line-height:1.7; }

/* NAV */
.nav { position:fixed; top:0; left:0; right:0; z-index:100; background:rgba(11,29,58,0.95); backdrop-filter:blur(12px); padding:0 24px; height:64px; display:flex; align-items:center; justify-content:space-between; }
.nav-logo { font-family:'DM Sans',sans-serif; font-weight:700; font-size:20px; color:var(--white); text-decoration:none; }
.nav-logo span { color:var(--green); }
.nav-links { display:flex; gap:24px; align-items:center; }
.nav-links a { color:var(--gray-200); text-decoration:none; font-size:14px; font-weight:500; transition:color .2s; }
.nav-links a:hover { color:var(--green); }
.nav-cta { background:var(--green); color:var(--white)!important; font-weight:600; font-size:14px; padding:10px 24px; border-radius:8px; text-decoration:none; transition:background .2s; }
.nav-cta:hover { background:var(--green-dark); }

/* BREADCRUMBS */
.breadcrumbs { padding:80px 24px 0; max-width:900px; margin:0 auto; font-size:13px; color:var(--gray-400); }
.breadcrumbs a { color:var(--green-dark); text-decoration:none; }
.breadcrumbs a:hover { text-decoration:underline; }

/* ARTICLE */
.article-header { max-width:900px; margin:0 auto; padding:24px 24px 0; }
.article-header h1 { font-family:'DM Sans',sans-serif; font-size:clamp(28px,5vw,42px); color:var(--navy); line-height:1.2; margin-bottom:12px; }
.article-meta { font-size:14px; color:var(--gray-400); margin-bottom:32px; }

.article-body { max-width:900px; margin:0 auto; padding:0 24px 60px; }
.article-body h2 { font-family:'DM Sans',sans-serif; font-size:24px; color:var(--navy); margin:40px 0 16px; }
.article-body h3 { font-family:'DM Sans',sans-serif; font-size:20px; color:var(--navy-light); margin:32px 0 12px; }
.article-body p { margin-bottom:18px; color:var(--gray-600); font-size:16px; }
.article-body ul, .article-body ol { margin:0 0 18px 24px; color:var(--gray-600); }
.article-body li { margin-bottom:8px; font-size:16px; }
.article-body strong { color:var(--gray-800); }
.article-body a { color:var(--green-dark); text-decoration:underline; }

/* CTA BOX */
.cta-box { background:linear-gradient(135deg,var(--navy),var(--navy-light)); border-radius:16px; padding:32px; margin:40px 0; text-align:center; }
.cta-box h3 { color:var(--white); font-family:'DM Sans',sans-serif; font-size:22px; margin-bottom:12px; }
.cta-box p { color:var(--gray-200); margin-bottom:20px; font-size:15px; }
.cta-box a.btn { display:inline-block; background:var(--green); color:var(--white); font-weight:700; font-size:16px; padding:14px 36px; border-radius:10px; text-decoration:none; transition:background .2s; }
.cta-box a.btn:hover { background:var(--green-dark); }

/* TABLE */
.article-body table { width:100%; border-collapse:collapse; margin:20px 0 28px; font-size:15px; }
.article-body th { background:var(--navy); color:var(--white); padding:12px 16px; text-align:left; font-weight:600; }
.article-body td { padding:10px 16px; border-bottom:1px solid var(--gray-200); color:var(--gray-600); }
.article-body tr:nth-child(even) td { background:var(--gray-50); }

/* FOOTER */
.footer { background:var(--navy); padding:40px 24px; text-align:center; color:var(--gray-400); font-size:13px; }
.footer a { color:var(--green); text-decoration:none; }

/* BLOG INDEX */
.blog-hero { background:linear-gradient(170deg,var(--navy),var(--navy-light)); padding:120px 24px 60px; text-align:center; }
.blog-hero h1 { font-family:'DM Sans',sans-serif; color:var(--white); font-size:clamp(28px,5vw,42px); margin-bottom:12px; }
.blog-hero p { color:var(--gray-200); font-size:18px; max-width:600px; margin:0 auto; }
.blog-grid { max-width:1000px; margin:0 auto; padding:48px 24px; display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:28px; }
.blog-card { background:var(--white); border:1px solid var(--gray-200); border-radius:12px; padding:28px; transition:box-shadow .2s,transform .2s; }
.blog-card:hover { box-shadow:0 8px 30px rgba(11,29,58,.1); transform:translateY(-2px); }
.blog-card h2 { font-family:'DM Sans',sans-serif; font-size:18px; color:var(--navy); margin-bottom:10px; line-height:1.3; }
.blog-card h2 a { color:inherit; text-decoration:none; }
.blog-card p { font-size:14px; color:var(--gray-600); margin-bottom:16px; }
.blog-card .read-more { color:var(--green-dark); font-weight:600; font-size:14px; text-decoration:none; }

@media(max-width:640px) {
  .nav-links { gap:12px; }
  .article-body { padding:0 16px 40px; }
  .cta-box { padding:24px 20px; }
}