/* Track Stats Elite Blog — static rebuild
   Brand: navy #1C244B + teal/mint accent, Poppins. No JS required. */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;900&display=swap');

:root{
  --navy:#1C244B;
  --navy-2:#2a3566;
  --teal:#00cf8e;
  --teal-d:#00b97e;
  --mint:#5fe0c0;
  --ink:#1f2433;
  --muted:#6b7280;
  --line:#e8eaf0;
  --bg:#ffffff;
  --bg-soft:#f6f8fb;
  --maxw:1120px;
  --radius:14px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;font-family:'Poppins',-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink);line-height:1.65;background:var(--bg);-webkit-font-smoothing:antialiased;
}
a{color:var(--teal-d);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto;display:block}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}

/* ---------- Header ---------- */
.site-header{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--line)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;height:74px;gap:24px}
.brand img{height:34px;width:auto}
.nav{display:flex;align-items:center;gap:30px}
.nav a{color:var(--navy);font-weight:500;font-size:.98rem}
.nav a:hover{color:var(--teal-d);text-decoration:none}
.nav a.active{color:var(--teal-d)}
.btn{display:inline-flex;align-items:center;gap:.5em;font-weight:600;border-radius:999px;
  padding:.62em 1.5em;font-size:.95rem;cursor:pointer;border:2px solid transparent;transition:.15s}
.btn-login{background:var(--navy);color:#fff}
.btn-login:hover{background:var(--navy-2);text-decoration:none;color:#fff}
.btn-teal{background:var(--teal);color:#06231a}
.btn-teal:hover{background:var(--teal-d);text-decoration:none;color:#06231a}
.btn-outline{background:transparent;border-color:var(--teal);color:var(--navy)}
.btn-outline:hover{background:var(--teal);color:#06231a;text-decoration:none}
.nav-toggle{display:none}

/* ---------- Hero ---------- */
.hero{position:relative;background:var(--navy) center/cover no-repeat;border-radius:0;overflow:hidden}
.hero-inner{max-width:var(--maxw);margin:0 auto;padding:90px 24px;text-align:center}
.hero-card{display:inline-block;background:rgba(20,28,60,.45);backdrop-filter:blur(4px);
  border:1px solid rgba(255,255,255,.22);border-radius:16px;padding:.4em .9em}
.hero h1{color:#fff;font-size:clamp(2.2rem,5vw,4rem);font-weight:700;margin:.1em 0;letter-spacing:.5px}
.hero .sub{display:inline-block;margin-top:18px;color:#eef2ff;background:rgba(20,28,60,.4);
  border-radius:10px;padding:.5em 1.1em;font-size:1.05rem}

/* ---------- Page intro (article list header on subpages) ---------- */
.section{padding:56px 0}
.section-title{text-align:center;font-weight:700;color:var(--navy);font-size:2rem;margin:0 0 6px}
.section-sub{text-align:center;color:var(--muted);margin:0 0 38px}

/* ---------- Card grid ---------- */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  display:flex;flex-direction:column;transition:.18s;box-shadow:0 1px 2px rgba(20,28,60,.04)}
.card:hover{transform:translateY(-4px);box-shadow:0 12px 30px rgba(20,28,60,.10)}
.card-img{aspect-ratio:3/2;width:100%;object-fit:cover;background:var(--bg-soft)}
.card-body{padding:22px;display:flex;flex-direction:column;flex:1}
.card h3{margin:0 0 10px;font-size:1.18rem;line-height:1.3;color:var(--navy);font-weight:700}
.card h3 a{color:inherit}
.card h3 a:hover{color:var(--teal-d);text-decoration:none}
.card .excerpt{color:var(--muted);font-size:.95rem;margin:0 0 16px;flex:1}
.card .meta{color:#9aa1b2;font-size:.82rem;margin:0 0 10px}
.read-more{font-weight:600;color:var(--teal-d);align-self:flex-start}
.read-more::after{content:" \2192"}

/* ---------- Article page ---------- */
.article{max-width:820px;margin:0 auto;padding:54px 24px}
.article h1{text-align:center;color:var(--navy);font-weight:700;font-size:clamp(1.9rem,4vw,2.8rem);
  line-height:1.18;margin:.1em 0 .4em}
.byline{text-align:center;color:var(--muted);font-size:.98rem;margin-bottom:30px;
  display:flex;gap:14px;justify-content:center;align-items:center;flex-wrap:wrap}
.byline .sep{color:var(--line)}
.byline .cat{background:var(--bg-soft);border:1px solid var(--line);border-radius:999px;
  padding:.1em .8em;font-size:.82rem;color:var(--teal-d);font-weight:600}
.feature-img{width:100%;border-radius:var(--radius);margin:0 0 36px;aspect-ratio:16/9;object-fit:cover}
.content{font-size:1.05rem}
.content h2{color:var(--navy);font-weight:700;font-size:1.5rem;margin:1.7em 0 .5em}
.content h3{color:var(--navy);font-weight:600;font-size:1.2rem;margin:1.4em 0 .4em}
.content p{margin:0 0 1.1em}
.content ul,.content ol{margin:0 0 1.2em;padding-left:1.3em}
.content li{margin:.3em 0}
.content a{color:var(--teal-d);font-weight:500;text-decoration:underline}
.content img{border-radius:10px;margin:1.2em 0}
.content table{border-collapse:collapse;width:100%;margin:1.4em 0;font-size:.96rem}
.content th,.content td{border:1px solid var(--line);padding:.7em .8em;text-align:left;vertical-align:top}
.content thead th,.content tr:first-child td{background:var(--navy);color:#fff;font-weight:600}
.content tr:nth-child(even) td{background:var(--bg-soft)}
.content hr{border:0;border-top:1px solid var(--line);margin:2.2em 0}
.content blockquote{margin:1.4em 0;padding:.6em 1.2em;border-left:4px solid var(--teal);
  background:var(--bg-soft);color:#333;border-radius:0 8px 8px 0}

/* article nav */
.article-nav{display:flex;justify-content:space-between;gap:16px;margin:46px 0 0;
  border-top:1px solid var(--line);padding-top:24px;font-weight:600}
.article-nav a{color:var(--navy)}
.article-nav .disabled{color:var(--line);pointer-events:none}
.back-all{text-align:center;margin-top:30px}

/* ---------- CTA bands ---------- */
.cta-box{max-width:var(--maxw);margin:10px auto 0;padding:40px 24px}
.cta-card{border:2px solid var(--mint);border-radius:18px;padding:40px 24px;text-align:center}
.cta-card p{margin:.2em 0;color:var(--ink)}
.cta-card .big{font-weight:700;color:var(--navy);font-size:1.35rem;margin:.6em 0 1em}
.consult{background:var(--mint);margin-top:48px}
.consult .wrap{display:flex;align-items:center;gap:30px;flex-wrap:wrap;padding-top:40px;padding-bottom:40px}
.consult .text{flex:1;min-width:260px}
.consult .small{color:#0c4d3c;font-weight:500;margin:0}
.consult h2{color:var(--navy);font-size:2rem;font-weight:700;margin:.2em 0 .8em}
.consult img{flex:1;min-width:260px;max-width:460px}

/* ---------- Footer ---------- */
.site-footer{background:#fff;border-top:1px solid var(--line);padding:54px 0 0}
.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1.2fr 1.4fr;gap:34px}
.footer-grid h4{color:var(--navy);font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;margin:0 0 16px}
.footer-grid img{height:74px;width:auto}
.footer-grid ul{list-style:none;margin:0;padding:0}
.footer-grid li{margin:.45em 0}
.footer-grid a{color:var(--ink)}
.footer-grid a:hover{color:var(--teal-d)}
.footer-grid .muted{color:var(--muted);font-size:.95rem}
.footer-bottom{border-top:1px solid var(--line);margin-top:40px;padding:20px 0;
  display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;color:var(--muted);font-size:.85rem}
.footer-bottom a{color:var(--muted)}

/* ---------- Responsive ---------- */
@media(max-width:900px){
  .grid{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  .nav{display:none}
  .grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .hero-inner{padding:60px 18px}
  .consult .wrap{flex-direction:column-reverse;text-align:center}
}
