:root{
  /* Tweak per domain to avoid clones */
  --brand:#1F3A60;      /* primary color */
  --accent:#F2C23E;     /* secondary accent */
  --ink:#1f2933;        /* body text */
  --muted:#667085;      /* secondary text */
  --bg:#f9fbfd;         /* page background */
  --card:#ffffff;       /* card background */
  --border:#e5e7eb;     /* light border */
  --radius:14px;
  --shadow:0 1px 8px rgba(0,0,0,.06);
  --font:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}

/* Base */
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 var(--font)}
img{max-width:100%;display:block}
a{color:var(--brand);text-decoration:none}
a:hover{filter:brightness(1.06)}

/* Layout */
.container{max-width:960px;margin:0 auto;padding:24px}
.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:clamp(16px,2.5vw,24px)}

/* Header/Nav */
.site-header{display:flex;align-items:center;justify-content:space-between;gap:12px}
.brand{display:flex;align-items:center;gap:10px;color:var(--brand);font-weight:800}
.brand img{width:36px;height:36px}
.nav{display:flex;gap:16px;align-items:center}
.nav a{padding:6px 8px;border-radius:10px}
.nav a[aria-current="page"]{font-weight:600;color:var(--ink)}
.btn{background:transparent;border:1px solid var(--border)}
.btn-primary{background:var(--brand);color:#fff;border:none;padding:10px 14px;border-radius:12px;font-weight:600}
.btn-primary:hover{filter:brightness(1.05)}

/* Typography */
h1{font-size:clamp(28px,4vw,36px);margin:0 0 8px;color:var(--brand)}
h2{font-size:clamp(20px,3vw,24px);margin:16px 0 8px}
.lede{color:var(--muted);margin:0 0 12px}
.points{margin:8px 0 16px 18px;color:#475569}
.points li{margin:6px 0}
.fine{font-size:14px;color:var(--muted)}

/* Hero image (optional) */
.heroimg{border-radius:12px;border:1px solid var(--border);overflow:hidden;margin:10px 0 16px}

/* Forms */
.contact-form{display:grid;gap:12px;margin-top:8px}
.contact-form label{display:grid;gap:6px;color:#334155}
.contact-form input,.contact-form textarea{
  border:1px solid var(--border);border-radius:10px;padding:10px 12px;font:inherit;width:100%
}
.contact-form input:focus,.contact-form textarea:focus{
  outline:2px solid color-mix(in srgb, var(--brand) 30%, transparent);border-color:var(--brand)
}

/* Footer */
.site-footer{color:var(--muted);font-size:14px}
.site-footer a{color:inherit;text-decoration:underline}

.site-footer {
  margin-top: 40px;
  padding: 24px;
  font-size: 14px;
  color: var(--muted);
  border-top: 1px solid var(--border);
  text-align: center;
  line-height: 1.5;
}

.site-footer a {
  color: inherit;
  text-decoration: underline;
}

/* Blog Styles */
.blog-list{display:grid;gap:24px;margin-top:24px}
.blog-card{transition:transform .15s,box-shadow .15s}
.blog-card:hover{transform:translateY(-2px);box-shadow:0 8px 16px rgba(0,0,0,.08)}
.blog-card h2{margin:8px 0 6px;font-size:clamp(18px,2.5vw,22px)}
.blog-card h2 a{color:var(--brand);text-decoration:none}
.blog-card h2 a:hover{text-decoration:underline}
.article-date{display:block;font-size:14px;color:var(--muted);margin-bottom:4px}
.article-excerpt{color:#475569;margin:0 0 12px;line-height:1.6}
.read-more{color:var(--brand);font-weight:600}

/* Individual Article Page */
.breadcrumb{font-size:14px;color:var(--muted);margin-bottom:16px}
.breadcrumb a{color:var(--brand);text-decoration:none}
.breadcrumb a:hover{text-decoration:underline}
.blog-article{max-width:720px;margin:0 auto}
.article-header{border-bottom:1px solid var(--border);padding-bottom:16px;margin-bottom:24px}
.article-header h1{margin:8px 0 12px}
.article-byline{color:var(--muted);font-size:15px;margin:0}
.article-byline a{color:var(--brand);text-decoration:none}
.article-byline a:hover{text-decoration:underline}

.article-content{line-height:1.7;color:#1e293b}
.article-content p{margin:0 0 16px}
.article-content h2{margin:32px 0 12px;font-size:clamp(22px,3vw,26px);color:var(--brand)}
.article-content h3{margin:24px 0 10px;font-size:clamp(18px,2.5vw,20px);color:#334155}
.article-content ul,.article-content ol{margin:0 0 16px 24px;color:#475569}
.article-content li{margin:6px 0}
.article-content blockquote{margin:24px 0;padding:16px 20px;border-left:4px solid var(--brand);background:#f8fafc;font-style:italic;color:#334155}
.article-content blockquote p{margin:0}
.article-content a{color:var(--brand);text-decoration:underline}
.article-content a:hover{text-decoration:none}

.article-footer{margin-top:48px;padding-top:32px;border-top:1px solid var(--border)}
.article-cta{background:linear-gradient(135deg,#f8fafc 0%,#ffffff 100%);text-align:center;padding:32px 24px}
.article-cta h3{margin:0 0 8px;color:var(--brand)}
.article-cta p{margin:0 0 16px;color:#475569}

.back-link{margin-top:24px;text-align:center}
.back-link a{color:var(--brand);text-decoration:none;font-weight:500}
.back-link a:hover{text-decoration:underline}

figure.media img {
  display: block;
  max-width: 100%;
  height: auto;
}

/* Table Styles */
.table-wrapper{overflow-x:auto;margin:24px 0}
.article-content table{width:100%;border-collapse:collapse;font-size:15px;background:var(--card)}
.article-content th,.article-content td{padding:12px 16px;text-align:left;border:1px solid var(--border)}
.article-content thead{background:linear-gradient(135deg,#f8fafc 0%,#ffffff 100%)}
.article-content th{font-weight:700;color:var(--brand);border-bottom:2px solid var(--brand)}
.article-content tbody tr:hover{background:#f8fafc}
.article-content td{color:#334155;vertical-align:top}
.article-content td:first-child{font-weight:600;color:var(--ink)}

/* Mobile responsive tables */
@media(max-width:768px){
  .article-content table{font-size:14px}
  .article-content th,.article-content td{padding:10px 12px}
}