/* ==========================================================================
   SCALE — BLOG (articles + the /blog/ hubs)

   Loaded after scale-industry.css: an article is an industry page's layout —
   hero, reading rail, call-to-action band, footer — around a post's own HTML.
   This file only adds what an industry record never had: running prose written
   in wp-admin (headings, paragraphs, lists, tables, quotes, images) and the
   hub's article cards. Values follow scale-industry.css's tokens; light only.
   ========================================================================== */

/* ---- hero: one column, no product frame -------------------------------- */
.bl-hero__in{position:relative;max-width:860px;margin-top:36px}
.bl-hero .ip-lead{max-width:720px}
.bl-hero .ip-h1{font-size:50px}

/* ---- prose ---------------------------------------------------------------- */
.bl-prose{font-size:17px;line-height:1.75;color:var(--ip-body)}
.bl-prose > :first-child{margin-top:0 !important}
.bl-prose h2{margin:56px 0 0 !important;font-size:32px;font-weight:600;letter-spacing:-.03em;line-height:1.2;color:var(--ip-ink);text-wrap:balance;scroll-margin-top:calc(var(--ip-header) + 20px)}
.bl-prose h3{margin:32px 0 0 !important;font-size:21px;font-weight:600;letter-spacing:-.02em;line-height:1.35;color:var(--ip-ink)}
.bl-prose h4{margin:26px 0 0 !important;font-size:17px;font-weight:600;color:var(--ip-ink)}
.bl-prose p{margin:16px 0 0 !important;text-wrap:pretty}
.bl-prose h2 + p,.bl-prose h3 + p{margin-top:12px !important}
.bl-prose ul,.bl-prose ol{margin:16px 0 0 !important;padding-inline-start:24px !important}
.bl-prose ul{list-style:disc}
.bl-prose ol{list-style:decimal}
.bl-prose li{margin-top:8px;padding-inline-start:4px}
.bl-prose li::marker{color:var(--ip-pink)}
.bl-prose a{color:var(--ip-pink);text-decoration:underline;text-decoration-color:rgba(196,42,99,.3);text-underline-offset:3px}
.bl-prose a:hover{text-decoration-color:currentColor}
.bl-prose blockquote{margin:28px 0 0;padding:18px 22px;border-inline-start:3px solid var(--ip-pink);border-radius:0 14px 14px 0;background:var(--ip-pink-soft-2);color:#8F2049}
.bl-prose blockquote p:first-child{margin-top:0 !important}
.bl-prose code{padding:2px 6px;border-radius:6px;background:var(--ip-line-2);font-size:.9em}
.bl-prose img{display:block;margin:28px auto 0;border-radius:16px;border:1px solid var(--ip-line)}
.bl-prose figure{margin:28px 0 0}
.bl-prose figcaption{margin-top:10px;font-size:13px;color:var(--ip-muted);text-align:center}
.bl-prose hr{margin:40px 0 0;border:0;border-top:1px solid var(--ip-line)}

/* Tables: the comparison table's look, scrolling sideways on a phone. */
.bl-prose .wp-block-table,.bl-prose .bl-table{margin:26px 0 0;overflow-x:auto}
.bl-prose table{width:100%;margin-top:26px;border:1px solid var(--ip-line);border-radius:18px;border-collapse:separate;border-spacing:0;overflow:hidden;font-size:14.5px;line-height:1.5}
.bl-prose .wp-block-table table,.bl-prose .bl-table table{margin-top:0}
.bl-prose th,.bl-prose td{padding:13px 18px;text-align:start;vertical-align:top;border-bottom:1px solid var(--ip-line-3)}
.bl-prose tr:last-child th,.bl-prose tr:last-child td{border-bottom:0}
.bl-prose thead th{background:var(--ip-soft);border-bottom:1px solid var(--ip-line);font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--ip-muted)}
.bl-prose tbody th{font-weight:600;color:var(--ip-ink)}

/* ---- after the article ------------------------------------------------------ */
.bl-after{max-width:800px}
.bl-ind{margin-top:64px}

/* ---- the hub ------------------------------------------------------------------ */
.bl-hubwrap{max-width:1180px}
.bl-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.bl-card{display:flex;flex-direction:column;gap:10px;padding:24px;border:1px solid var(--ip-line);border-radius:18px;background:#fff;color:var(--ip-ink) !important;transition:box-shadow .2s ease,transform .2s ease}
.bl-card:hover{box-shadow:0 14px 34px rgba(14,20,36,.08);transform:translateY(-2px)}
.bl-card__meta{font-size:12.5px;color:var(--ip-muted)}
.bl-card__t{font-size:20px;font-weight:600;letter-spacing:-.02em;line-height:1.3;color:var(--ip-ink);text-wrap:balance}
.bl-card__p{font-size:14.5px;line-height:1.65;color:var(--ip-steel)}
.bl-card__go{display:inline-flex;align-items:center;gap:6px;margin-top:auto;padding-top:6px;font-size:13.5px;font-weight:600;color:var(--ip-pink)}
.bl-card__go .ip-i{width:14px;height:14px}

@media (max-width:1100px){
    .bl-cards{grid-template-columns:repeat(2,1fr)}
    .bl-after{margin:0 auto}
}
@media (max-width:768px){
    .bl-hero .ip-h1{font-size:32px}
    .bl-hero__in{margin-top:22px}
    .bl-prose{font-size:16px}
    .bl-prose h2{margin-top:44px !important;font-size:25px}
    .bl-prose h3{font-size:19px}
    .bl-prose table{font-size:13.5px}
    .bl-cards{grid-template-columns:1fr;gap:12px}
    .bl-card{padding:20px}
    .bl-card__t{font-size:18px}
    .bl-ind{margin-top:48px}
}

/* ---- Arabic ------------------------------------------------------------------- */
.ip-page[dir=rtl] .bl-prose{line-height:1.9}
.ip-page[dir=rtl] .bl-prose h2,.ip-page[dir=rtl] .bl-prose h3,.ip-page[dir=rtl] .bl-card__t{letter-spacing:0;line-height:1.45}
.ip-page[dir=rtl] .bl-prose thead th{letter-spacing:0;text-transform:none}
.ip-page[dir=rtl] .bl-prose blockquote{border-radius:14px 0 0 14px}
.ip-page[dir=rtl] .bl-hero .ip-h1{line-height:1.3;letter-spacing:0}
