/* =========================================================================
   Valiant Lifecare — Blog stylesheet (cr2026 design language)
   Loads after vlms-home2.css. Provides clean typography, hero, body grid,
   table-of-contents, CTA module, and related-posts row used across every
   blog article. Replaces the legacy Elementor/loop markup that was
   rendering distorted on the static export.
   ========================================================================= */

:root{
  --vl-blue:#0045AA;
  --vl-lime:#C8F8A9;
  --vl-teal:#0F3D3A;
  --vl-ink:#0E1726;
  --vl-muted:#5A6573;
  --vl-line:#E5E9EE;
  --vl-bg:#FFFFFF;
  --vl-soft:#F4F7FB;
  --vl-radius:14px;
  --vl-shadow:0 12px 40px rgba(15,61,58,.08);
}

.vlc-blog-wrap{
  background:var(--vl-bg);
  color:var(--vl-ink);
  font-family:'DM Sans',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  font-size:17px;
  line-height:1.7;
}

/* ── Breadcrumb ───────────────────────────────────────────────────────── */
.vlc-crumbs{
  max-width:1200px;margin:0 auto;padding:110px 24px 12px;
  font-size:14px;color:var(--vl-muted);
}
.vlc-crumbs a{color:var(--vl-blue);text-decoration:none}
.vlc-crumbs a:hover{text-decoration:underline}
.vlc-crumbs span{margin:0 8px;color:#aab2bd}

/* ── Hero ─────────────────────────────────────────────────────────────── */
.vlc-hero{
  max-width:1200px;margin:0 auto;padding:0 24px 32px;
}
.vlc-hero .eyebrow{
  display:inline-block;background:rgba(0,69,170,.08);color:var(--vl-blue);
  font-weight:600;font-size:12px;letter-spacing:.12em;text-transform:uppercase;
  padding:6px 14px;border-radius:999px;margin-bottom:18px;
}
.vlc-hero h1{
  font-family:'Forum',Georgia,serif;
  font-weight:400;
  font-size:clamp(32px,4.6vw,56px);
  line-height:1.08;letter-spacing:-.01em;color:var(--vl-teal);
  margin:0 0 18px;
}
.vlc-hero .meta{
  display:flex;flex-wrap:wrap;gap:18px;align-items:center;color:var(--vl-muted);
  font-size:14px;
}
.vlc-hero .meta strong{color:var(--vl-ink);font-weight:600}

/* ── Two-column body ─────────────────────────────────────────────────── */
.vlc-body{
  max-width:1200px;margin:24px auto 64px;padding:0 24px;
  display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:48px;
}
@media (max-width:980px){.vlc-body{grid-template-columns:1fr;gap:24px}}

.vlc-article p,
.vlc-article li{
  font-size:17px;line-height:1.78;color:#243043;
}
.vlc-article h2{
  font-family:'Forum',Georgia,serif;
  font-size:clamp(24px,2.4vw,32px);line-height:1.2;color:var(--vl-teal);
  margin:42px 0 14px;font-weight:400;letter-spacing:-.01em;
}
.vlc-article h3{
  font-family:'DM Sans',sans-serif;font-weight:600;
  font-size:20px;line-height:1.3;color:var(--vl-ink);margin:28px 0 10px;
}
.vlc-article a{color:var(--vl-blue);text-decoration:underline;text-underline-offset:3px}
.vlc-article a:hover{color:var(--vl-teal)}
.vlc-article ul,.vlc-article ol{padding-left:22px;margin:14px 0}
.vlc-article ul li{margin:6px 0;list-style:disc}
.vlc-article ol li{margin:6px 0;list-style:decimal}
.vlc-article blockquote{
  margin:24px 0;padding:18px 22px;border-left:4px solid var(--vl-lime);
  background:var(--vl-soft);border-radius:8px;color:#1b2433;font-style:italic;
}
.vlc-article .lede{
  font-size:19px;line-height:1.65;color:#1b2433;margin:8px 0 24px;
}
.vlc-article .callout{
  background:linear-gradient(135deg,#EEF6FF 0%,#F4FFF1 100%);
  border:1px solid #DDE9F4;border-radius:var(--vl-radius);
  padding:22px 24px;margin:28px 0;
}
.vlc-article .callout strong{color:var(--vl-blue)}

/* ── Sidebar / TOC ────────────────────────────────────────────────────── */
.vlc-side{position:sticky;top:90px;align-self:start}
@media (max-width:980px){.vlc-side{position:static}}
.vlc-toc{
  background:var(--vl-soft);border:1px solid var(--vl-line);
  border-radius:var(--vl-radius);padding:18px 20px;
}
.vlc-toc h4{
  font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--vl-muted);
  margin:0 0 10px;font-weight:600;
}
.vlc-toc ol{list-style:none;padding:0;margin:0;counter-reset:toc}
.vlc-toc li{counter-increment:toc;margin:8px 0;padding-left:28px;position:relative;font-size:14px}
.vlc-toc li::before{
  content:counter(toc,decimal-leading-zero);
  position:absolute;left:0;top:0;color:var(--vl-blue);font-weight:700;font-size:12px;
}
.vlc-toc a{color:var(--vl-ink);text-decoration:none;transition:color .2s ease}
.vlc-toc a:hover{color:var(--vl-blue)}
.vlc-toc a.is-active{color:var(--vl-blue);font-weight:600}
.vlc-toc li:has(a.is-active)::before{color:var(--vl-teal)}

/* Smooth-scroll H2 anchors with headroom under the fixed nav. */
.vlc-article h2{scroll-margin-top:96px}

/* Sidebar CTA card */
.vlc-side-cta{
  margin-top:18px;background:var(--vl-teal);color:#fff;
  border-radius:var(--vl-radius);padding:22px;
}
.vlc-side-cta h4{margin:0 0 8px;font-size:18px;color:#fff;font-family:'Forum',serif;font-weight:400}
.vlc-side-cta p{margin:0 0 14px;font-size:14px;line-height:1.55;color:rgba(255,255,255,.85)}
.vlc-side-cta a.vlc-btn{
  display:inline-block;background:var(--vl-lime);color:var(--vl-teal);
  padding:10px 18px;border-radius:8px;font-weight:600;font-size:14px;
  text-decoration:none;transition:transform .2s ease;
}
.vlc-side-cta a.vlc-btn:hover{transform:translateY(-2px)}

/* ── Inline CTA banner ───────────────────────────────────────────────── */
.vlc-cta{
  margin:40px 0;padding:36px 32px;
  background:linear-gradient(135deg,#0045AA 0%,#0F3D3A 100%);
  color:#fff;border-radius:18px;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;
  box-shadow:var(--vl-shadow);
}
.vlc-cta .cta-text{flex:1 1 380px}
.vlc-cta .cta-text h3{
  margin:0 0 6px;font-family:'Forum',serif;font-weight:400;
  font-size:clamp(22px,2vw,28px);line-height:1.2;color:#fff;
}
.vlc-cta .cta-text p{margin:0;color:rgba(255,255,255,.86);font-size:15px;line-height:1.55}
.vlc-cta .cta-buttons{display:flex;gap:12px;flex-wrap:wrap}
.vlc-cta a.btn-primary{
  background:var(--vl-lime);color:var(--vl-teal);font-weight:600;
  padding:14px 24px;border-radius:10px;text-decoration:none;font-size:15px;
  transition:transform .2s ease,box-shadow .2s ease;
}
.vlc-cta a.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(200,248,169,.35)}
.vlc-cta a.btn-ghost{
  border:1.5px solid rgba(255,255,255,.4);color:#fff;font-weight:500;
  padding:14px 22px;border-radius:10px;text-decoration:none;font-size:15px;
}
.vlc-cta a.btn-ghost:hover{background:rgba(255,255,255,.08)}

/* ── Final CTA section ───────────────────────────────────────────────── */
.vlc-final-cta{
  background:var(--vl-soft);padding:64px 24px;margin-top:32px;
  border-top:1px solid var(--vl-line);
}
.vlc-final-cta .inner{
  max-width:920px;margin:0 auto;text-align:center;
}
.vlc-final-cta h2{
  font-family:'Forum',serif;font-weight:400;color:var(--vl-teal);
  font-size:clamp(28px,3vw,40px);margin:0 0 14px;line-height:1.15;
}
.vlc-final-cta p{color:#36404f;font-size:17px;margin:0 0 26px;line-height:1.65}
.vlc-final-cta .btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.vlc-final-cta a.btn-primary{
  background:var(--vl-blue);color:#fff;padding:16px 28px;border-radius:10px;
  font-weight:600;text-decoration:none;font-size:15px;
  transition:transform .2s ease,box-shadow .2s ease;
}
.vlc-final-cta a.btn-primary:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(0,69,170,.25)}
.vlc-final-cta a.btn-ghost{
  border:1.5px solid var(--vl-teal);color:var(--vl-teal);padding:16px 26px;border-radius:10px;
  font-weight:600;text-decoration:none;font-size:15px;background:#fff;
}
.vlc-final-cta a.btn-ghost:hover{background:var(--vl-teal);color:#fff}

/* ── Related posts ───────────────────────────────────────────────────── */
.vlc-related{max-width:1200px;margin:0 auto;padding:48px 24px}
.vlc-related h3{
  font-family:'Forum',serif;font-weight:400;color:var(--vl-teal);
  font-size:28px;margin:0 0 22px;
}
.vlc-related-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;
}
.vlc-rcard{
  background:#fff;border:1px solid var(--vl-line);border-radius:var(--vl-radius);
  overflow:hidden;text-decoration:none;color:inherit;display:flex;flex-direction:column;
  transition:transform .25s ease,box-shadow .25s ease;
}
.vlc-rcard:hover{transform:translateY(-4px);box-shadow:var(--vl-shadow)}
.vlc-rcard img{width:100%;height:160px;object-fit:cover;display:block}
.vlc-rcard .rc-body{padding:14px 16px}
.vlc-rcard .rc-tag{
  display:inline-block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--vl-blue);font-weight:600;margin-bottom:6px;
}
.vlc-rcard h5{margin:0;font-size:15px;line-height:1.35;color:var(--vl-ink);font-weight:600}

/* ── Featured image hero (when used) ─────────────────────────────────── */
.vlc-feature-img{
  max-width:1200px;margin:0 auto 8px;padding:0 24px;
}
.vlc-feature-img img{
  width:100%;height:auto;max-height:440px;object-fit:cover;
  border-radius:18px;box-shadow:var(--vl-shadow);
}

/* ── FAQ section (auto-rendered on every blog post) ──────────────────── */
.vlc-faq{
  background:linear-gradient(180deg,#FFFFFF 0%, var(--vl-soft) 100%);
  padding:64px 24px 72px;
  border-top:1px solid var(--vl-line);
}
.vlc-faq-inner{
  max-width:920px;margin:0 auto;
}
.vlc-faq .eyebrow{
  display:inline-block;background:rgba(0,69,170,.08);color:var(--vl-blue);
  font-weight:600;font-size:12px;letter-spacing:.12em;text-transform:uppercase;
  padding:6px 14px;border-radius:999px;margin-bottom:14px;
}
.vlc-faq h2{
  font-family:'Forum',Georgia,serif;font-weight:400;color:var(--vl-teal);
  font-size:clamp(26px,2.8vw,36px);line-height:1.15;margin:0 0 28px;
}
.vlc-faq h2::after{
  content:'';display:block;width:60px;height:3px;background:var(--vl-lime);
  border-radius:3px;margin-top:12px;
}
.vlc-faq-list{display:flex;flex-direction:column;gap:10px}
.vlc-faq-item{
  background:#fff;border:1px solid var(--vl-line);border-radius:12px;
  overflow:hidden;transition:box-shadow .25s ease, border-color .25s ease;
}
.vlc-faq-item:hover{border-color:rgba(0,69,170,.18);box-shadow:0 6px 20px rgba(0,69,170,.06)}
.vlc-faq-item summary{
  list-style:none;cursor:pointer;padding:18px 22px 18px 22px;
  font-weight:600;font-size:16px;color:var(--vl-ink);
  display:flex;align-items:flex-start;gap:14px;
  transition:color .2s ease;
}
.vlc-faq-item summary::-webkit-details-marker{display:none}
.vlc-faq-item summary::after{
  content:'';flex:0 0 18px;width:18px;height:18px;margin-left:auto;
  margin-top:3px;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230045AA' stroke-width='2.4' stroke-linecap='round'><path d='M6 9l6 6 6-6'/></svg>");
  background-repeat:no-repeat;background-position:center;background-size:contain;
  transition:transform .3s cubic-bezier(.65,.05,.36,1);
}
.vlc-faq-item[open] summary{color:var(--vl-blue)}
.vlc-faq-item[open] summary::after{transform:rotate(180deg)}
.vlc-faq-item .vlc-faq-a{
  padding:0 22px 20px;color:#36404F;font-size:15.5px;line-height:1.7;
}

/* ── Tags ────────────────────────────────────────────────────────────── */
.vlc-tags{margin:32px 0 8px;display:flex;flex-wrap:wrap;gap:8px}
.vlc-tags span{
  background:var(--vl-soft);border:1px solid var(--vl-line);color:var(--vl-muted);
  font-size:12px;padding:6px 12px;border-radius:999px;
}