/* ==========================================================
   Dynamic blog pages – blog.php / blog-detail.php
   Loaded after style.css, so it can safely refine the theme.
   ========================================================== */

/* ----------------------------------------------------------
   Sticky sidebar

   The sidebar scrolls with the page, and once its bottom edge
   reaches the bottom of the screen it pins there until the
   article section ends.

   The "top" value below is only a fallback — blog-sticky.js
   replaces it at runtime, because the right value depends on
   whether the sidebar is taller or shorter than the screen.
   If JS is unavailable the sidebar simply pins under the
   header, which is still reasonable.

   Only from lg up: on smaller screens the sidebar sits below
   the article, where sticky has nowhere to travel.
   ---------------------------------------------------------- */
@media (min-width: 992px) {
  .sidebar-sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 100px;
  }
}

/* ----------------------------------------------------------
   Article body written in the dashboard editor
   ---------------------------------------------------------- */
.entry-content > *:first-child { margin-top: 0; }
.entry-content > *:last-child  { margin-bottom: 0; }

.entry-content p {
  margin-bottom: 20px;
}

.entry-content h2 {
  font-size: 28px;
  line-height: 1.35;
  margin: 40px 0 16px;
}

.entry-content h3 {
  font-size: 21px;
  line-height: 1.4;
  margin: 30px 0 12px;
}

.entry-content ul,
.entry-content ol {
  margin: 0 0 22px;
  padding-left: 22px;
}

.entry-content ul { list-style: disc; }
.entry-content ol { list-style: decimal; }

.entry-content li {
  margin-bottom: 10px;
  line-height: 1.7;
}

.entry-content blockquote {
  margin: 30px 0;
  padding: 20px 28px;
  border-left: 4px solid #fee023;
  background-color: #f7f9fb;
  border-radius: 0 8px 8px 0;
  font-size: 18px;
  line-height: 1.6;
  color: #063464;
}

.entry-content blockquote p:last-child { margin-bottom: 0; }

.entry-content img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  margin: 10px 0 24px;
}

.entry-content a {
  text-decoration: underline;
}

.entry-content strong { font-weight: 700; }

@media (max-width: 767px) {
  .entry-content h2 { font-size: 23px; margin-top: 32px; }
  .entry-content h3 { font-size: 19px; margin-top: 24px; }
  .entry-content blockquote { padding: 16px 20px; font-size: 16px; }
}