/* Small Business Year-End Money Moves — minimal/docs style, slate blue accent */
:root{
  --accent:#3b5bdb;
  --accent-dark:#2f4ab0;
  --accent-soft:#edf1ff;
  --ink:#1f2430;
  --muted:#5b6472;
  --line:#e3e7ee;
  --bg:#ffffff;
  --bg-alt:#f7f8fb;
  --radius:10px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink);
  background:var(--bg);
  line-height:1.7;
  font-size:17px;
}
.wrap{max-width:860px;margin:0 auto;padding:0 24px}

/* Top nav */
.topnav{
  border-bottom:1px solid var(--line);
  background:var(--bg);
  position:sticky;top:0;z-index:10;
}
.topnav .wrap{
  display:flex;align-items:center;gap:20px;
  padding-top:12px;padding-bottom:12px;
}
.brand{
  font-weight:700;color:var(--ink);text-decoration:none;
  font-size:1.02em;white-space:nowrap;
}
.brand span{color:var(--accent)}
.topnav nav{margin-left:auto;display:flex;gap:4px;flex-wrap:wrap}
.topnav nav a{
  color:var(--muted);text-decoration:none;font-size:.92em;
  padding:6px 10px;border-radius:6px;transition:background .15s,color .15s;
}
.topnav nav a:hover{background:var(--accent-soft);color:var(--accent-dark)}

/* Hero */
.hero{
  background:linear-gradient(160deg,#33459e 0%,#3b5bdb 55%,#5c7cfa 100%);
  color:#fff;
  padding:64px 0 56px;
}
.hero h1{
  margin:0 0 14px;font-size:2.1em;line-height:1.25;letter-spacing:-.01em;
}
.hero p.sub{font-size:1.12em;opacity:.93;max-width:640px;margin:0 0 26px}
.hero .hero-img{
  display:block;max-width:100%;height:auto;border-radius:var(--radius);
  margin:0 0 30px;box-shadow:0 12px 32px rgba(0,0,0,.25);
}
.btn{
  display:inline-block;background:#fff;color:var(--accent-dark);
  font-weight:700;text-decoration:none;padding:12px 26px;border-radius:8px;
  transition:transform .15s,box-shadow .15s;
}
.btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.2)}
.btn-outline{
  background:transparent;color:#fff;border:2px solid rgba(255,255,255,.65);
  margin-left:10px;
}
.btn-outline:hover{border-color:#fff}

/* Guide cards */
.guides{padding:52px 0}
.guides h2{font-size:1.5em;margin:0 0 8px}
.guides .lede{color:var(--muted);margin:0 0 28px;max-width:640px}
.card-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:18px;margin:0;padding:0;list-style:none;
}
.card{
  border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;background:var(--bg);
  transition:transform .15s,box-shadow .15s,border-color .15s;
}
.card:hover{
  transform:translateY(-3px);
  box-shadow:0 10px 28px rgba(59,91,219,.12);
  border-color:var(--accent);
}
.card img{width:100%;height:150px;object-fit:cover;display:block}
.card .card-body{padding:18px}
.card h3{margin:0 0 8px;font-size:1.08em;line-height:1.4}
.card h3 a{color:var(--ink);text-decoration:none}
.card h3 a:hover{color:var(--accent-dark)}
.card p{margin:0;font-size:.93em;color:var(--muted)}
.card .num{
  display:inline-block;background:var(--accent-soft);color:var(--accent-dark);
  font-size:.75em;font-weight:700;border-radius:20px;padding:3px 12px;
  margin-bottom:10px;letter-spacing:.04em;text-transform:uppercase;
}

/* About strip */
.about-strip{background:var(--bg-alt);padding:44px 0;border-top:1px solid var(--line)}
.about-strip h2{font-size:1.35em;margin:0 0 10px}
.about-strip p{color:var(--muted);max-width:640px;margin:0 0 10px}

/* Article pages */
.article-hero{padding:44px 0 8px}
.article-hero .crumb{font-size:.9em;color:var(--muted);margin:0 0 10px}
.article-hero .crumb a{color:var(--accent);text-decoration:none}
.article-hero .crumb a:hover{text-decoration:underline}
.article-hero h1{font-size:1.9em;line-height:1.3;margin:0 0 10px;letter-spacing:-.01em}
.article-hero .deck{color:var(--muted);font-size:1.08em;margin:0 0 22px}
.article-img{
  display:block;max-width:100%;height:auto;border-radius:var(--radius);
  margin:0 0 32px;box-shadow:0 8px 24px rgba(31,36,48,.1);
}
article.prose{padding:0 0 20px}
article.prose h2{
  font-size:1.35em;margin:36px 0 12px;padding-top:20px;
  border-top:1px solid var(--line);color:var(--ink);
}
article.prose h2:first-child{border-top:none;padding-top:0;margin-top:0}
article.prose h3{font-size:1.1em;margin:24px 0 8px;color:var(--accent-dark)}
article.prose p,article.prose li{color:#333947}
article.prose ul,article.prose ol{padding-left:24px}
article.prose li{margin-bottom:8px}
.callout{
  background:var(--accent-soft);border-left:4px solid var(--accent);
  border-radius:0 var(--radius) var(--radius) 0;
  padding:16px 20px;margin:24px 0;
}
.callout p{margin:0}
.checklist{list-style:none;padding-left:0}
.checklist li{
  position:relative;padding-left:34px;margin-bottom:12px;
}
.checklist li::before{
  content:"☐";position:absolute;left:0;top:1px;
  color:var(--accent);font-size:1.2em;line-height:1.3;
}
.next-guides{
  background:var(--bg-alt);border-top:1px solid var(--line);
  padding:40px 0;margin-top:20px;
}
.next-guides h2{font-size:1.25em;margin:0 0 16px}

/* Footer */
.site-footer{
  border-top:1px solid var(--line);background:var(--bg-alt);
  padding:34px 0;margin-top:0;
  font-size:.88em;color:var(--muted);
}
.site-footer .disclaimer{
  background:#fff8e6;border:1px solid #f0dfa8;border-radius:var(--radius);
  padding:14px 18px;margin:0 0 18px;
}
.site-footer .disclaimer p{margin:0;color:#6b5a2a}
.site-footer nav{margin:0 0 12px}
.site-footer nav a{color:var(--accent);text-decoration:none;margin-right:14px}
.site-footer nav a:hover{text-decoration:underline}
.site-footer .ai-disclosure{font-size:.85em;opacity:.85}

/* Responsive */
@media (max-width:640px){
  body{font-size:16px}
  .hero{padding:44px 0 40px}
  .hero h1{font-size:1.6em}
  .topnav .wrap{flex-wrap:wrap}
  .topnav nav{margin-left:0}
  .btn-outline{margin-left:0;margin-top:10px}
  .card img{height:130px}
}
