/* WideBundle blog — article typography + Ghost content-card (kg-*) styles.
   The article bodies come verbatim from Ghost (plain tags, no inline styles),
   so unlike the marketing pages this styles normally, no !important needed. */

.wb-post-card { transition: transform .15s ease, box-shadow .15s ease; }
.wb-post-card:hover { transform: translateY(-3px); box-shadow: rgba(80,18,58,.18) 0 18px 40px -22px; }

/* --- article body --- */
.wb-article { font-size: 17px; line-height: 1.8; color: #4a4258; }
.wb-article p { margin: 0 0 22px; }
.wb-article h2 { font-size: 28px; line-height: 1.25; letter-spacing: -0.02em; font-weight: 800; color: #150f1c; margin: 42px 0 16px; }
.wb-article h3 { font-size: 21px; line-height: 1.3; letter-spacing: -0.01em; font-weight: 700; color: #19131f; margin: 32px 0 12px; }
.wb-article h4 { font-size: 18px; font-weight: 700; color: #19131f; margin: 26px 0 10px; }
.wb-article a { color: var(--wb); font-weight: 600; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px; }
.wb-article a:hover { color: var(--wb-strong); }
.wb-article strong { color: #2c2640; }
.wb-article ul, .wb-article ol { margin: 0 0 22px; padding-left: 26px; }
.wb-article li { margin-bottom: 8px; }
.wb-article hr { border: none; border-top: 1px solid #f2e7ef; margin: 36px 0; }
.wb-article blockquote { border-left: 3px solid var(--wb); padding: 4px 0 4px 20px; margin: 0 0 22px; color: #5c5468; font-style: italic; }
.wb-article blockquote.kg-blockquote-alt { border: none; text-align: center; font-size: 21px; line-height: 1.5; color: #2c2640; padding: 8px 24px; }
.wb-article img { max-width: 100%; height: auto; }
.wb-article iframe { max-width: 100%; }

/* --- Ghost cards --- */
.wb-article figure.kg-card { margin: 30px 0; }
.wb-article .kg-image { display: block; margin: 0 auto; border-radius: 14px; }
.wb-article figcaption { text-align: center; font-size: 13.5px; color: #958ea0; margin-top: 10px; }
.wb-article .kg-button-card { display: flex; margin: 28px 0; }
.wb-article .kg-button-card.kg-align-center { justify-content: center; }
.wb-article a.kg-btn { display: inline-block; background: linear-gradient(135deg, var(--wb), var(--wb-grad)); color: #fff; font-weight: 700; font-size: 15.5px; padding: 13px 26px; border-radius: 11px; text-decoration: none; box-shadow: rgba(213,0,103,.5) 0 12px 26px -10px; }
.wb-article a.kg-btn:hover { color: #fff; filter: brightness(1.05); }
.wb-article .kg-gallery-container { display: flex; flex-direction: column; gap: 10px; }
.wb-article .kg-gallery-row { display: flex; gap: 10px; }
.wb-article .kg-gallery-image { flex: 1; min-width: 0; }
.wb-article .kg-gallery-image img { width: 100%; height: 100%; object-fit: cover; border-radius: 10px; }

/* --- responsive (blog grids are inline-styled, covered by site.css; body extras here) --- */
@media (max-width: 768px) {
  .wb-article { font-size: 16px; }
  .wb-article h2 { font-size: 23px; }
  .wb-article h3 { font-size: 19px; }
  .wb-article .kg-gallery-row { flex-direction: column; }
}