/* ── FONT: Plus Jakarta Sans — matches original Revora template ── */
body, p, li, a, span, input, textarea, button, select,
h1, h2, h3, h4, h5, h6,
.display-1, .display-2, .display-3, .display-4, .display-5,
.navbar-nav, .alt-font, .main-font {
  font-family: 'Plus Jakarta Sans', sans-serif !important;
}

/* ── Sticky header: Free Quote button must switch to dark text on white bg ── */
/* nav-menu.css sets attr-nav a { color: #191919 } in scrollHeader but Bootstrap's
   text-white uses !important — need a stronger override here */
.header-style1.scrollHeader .attr-nav .btn-style01,
.header-style1.scrollHeader .attr-nav .btn-style01 .btn-text {
  color: #191919 !important;
}

/* ── Odometer: render inline-block before Odometer.js adds odometer-auto-theme ── */
/* Without this, the odometer <div> is display:block on initial render, pushing
   the + superscript to the next line until lazyOnload fires */
.odometer {
  display: inline-block;
}

/* ── Odometer counter: fix right-side clipping on wide digits ── */
/*
 * Odometer sizes each digit slot from the "8" spacer character.
 * In Plus Jakarta Sans "0" is slightly wider than "8", so the right
 * edge of "0" overflows odometer-digit-inner's overflow:hidden boundary.
 *
 * Replace overflow:hidden with clip-path on digit-inner:
 *   inset(0 -0.2em 0 0) — allows 20px of right overflow for wider glyphs
 *                          while still clipping top/bottom/left normally.
 * The ribbon slides vertically so there is nothing to the right of the
 * digit that could leak through the expanded clip region.
 */
.counter-text .odometer-digit-inner {
  overflow: visible !important;
  clip-path: inset(0 -0.2em 0 0);
}

/* ── Blog content rich rendering ─────────────────────────────────────────── */

.blog-content p { line-height: 1.85; margin-bottom: 1.4rem; color: #3a3a3a; }
.blog-content h2 { font-size: 1.6rem; font-weight: 700; margin-top: 2.5rem; margin-bottom: 1rem; color: #191919; }
.blog-content h3 { font-size: 1.25rem; font-weight: 700; margin-top: 2rem; margin-bottom: 0.75rem; color: #191919; }
.blog-content ul, .blog-content ol { margin-bottom: 1.4rem; padding-left: 1.5rem; }
.blog-content li { line-height: 1.85; margin-bottom: 0.4rem; }

/* Code blocks */
.blog-code-block { background: #0d1117; border-radius: 10px; overflow: hidden; margin: 2rem 0; box-shadow: 0 4px 24px rgba(0,0,0,0.15); }
.blog-code-filename { background: #161b22; color: #7d8590; font-size: 0.78rem; font-family: 'Fira Code', 'Courier New', monospace; padding: 0.5rem 1.2rem; border-bottom: 1px solid #30363d; }
.blog-code-block pre { margin: 0; padding: 1.4rem 1.4rem; overflow-x: auto; background: transparent; }
.blog-code-block code { font-family: 'Fira Code', 'Courier New', monospace; font-size: 0.875rem; color: #e6edf3; line-height: 1.7; white-space: pre; }

/* Inline code */
.blog-inline-code { background: #f0f0f0; color: #c7254e; font-family: 'Fira Code', 'Courier New', monospace; font-size: 0.85em; padding: 0.15em 0.45em; border-radius: 4px; }

/* External links */
.blog-external-link { color: #7BBF42; font-weight: 600; text-decoration: none; border-bottom: 1px solid rgba(123,191,66,0.3); transition: border-color .2s; }
.blog-external-link:hover { color: #5a9d2f; border-bottom-color: #7BBF42; }

/* Blockquote */
.blog-blockquote { border-left: 4px solid #7BBF42; background: #f8faf5; color: #555; font-style: italic; border-radius: 0 8px 8px 0; }

/* Callout boxes */
.blog-callout { display: flex; align-items: flex-start; font-size: 0.95rem; line-height: 1.7; }
.blog-callout--info { background: #eff6ff; border-left: 4px solid #3b82f6; color: #1e40af; }
.blog-callout--tip  { background: #f0fdf4; border-left: 4px solid #7BBF42; color: #166534; }
.blog-callout--warning { background: #fffbeb; border-left: 4px solid #f59e0b; color: #92400e; }

/* Inline images with caption */
.blog-figure { text-align: center; }
.blog-figure figcaption { font-size: 0.8rem; }


/* ── 404 dark header initial state ───────────────────────────────────────── */
/* Specificity (0,2,0): beats the template's .navbar-default base rules but
   loses to .navbar-default.scrollHeader (0,3,0) → turns white on scroll.    */
.header-style1 .navbar-dark-initial {
  background-color: #191919;
}