/* Public blog only. Inherits SR Express fonts and brand tokens. */
.blog-page {--blog-ink:#20323e;--blog-muted:#64717b;--blog-line:#e5e7e6;--blog-brand:var(--primary-color,#126b98);background:#f7f6f2;color:var(--blog-ink);padding:144px 24px 80px;overflow-wrap:anywhere}
.blog-shell {max-width:1320px;margin-inline:auto;min-width:0}
.blog-article-layout {display:grid;grid-template-columns:minmax(0,7fr) minmax(0,3fr);gap:32px;align-items:start}
.blog-article-card {min-width:0;background:#fff;border:1px solid var(--blog-line);border-radius:16px;padding:32px;box-shadow:0 4px 20px #20323e05}
.blog-page a,.blog-page button {transition:color .15s,background-color .15s,border-color .15s}
.blog-page a:focus-visible,.blog-page button:focus-visible,.blog-page input:focus-visible,.blog-page textarea:focus-visible {outline:3px solid var(--blog-brand);outline-offset:4px}
.blog-breadcrumbs {display:flex;justify-content:flex-start;flex-wrap:wrap;gap:8px;font-size:14px;line-height:1.8;color:var(--blog-muted);margin-block-end:24px}
.blog-breadcrumbs [aria-current] {color:var(--blog-ink)}
.blog-breadcrumbs a:hover,.blog-related h3 a:hover,.blog-list-card h2 a:hover {color:var(--blog-brand)}
.blog-category,.blog-card-category {color:var(--primary-dark,#174d69);font-size:13px;font-weight:700}
.blog-category {display:inline-block;background:var(--primary-bg,#edf5fa);border-radius:6px;padding:4px 12px}
.blog-article-title {font-size:clamp(26px,2.2vw,32px);font-weight:700;line-height:1.55;margin-block:16px;letter-spacing:-.02em}
.blog-meta {font-size:14px;color:var(--blog-muted);line-height:1.8}
.blog-article-meta {display:flex;flex-wrap:wrap;gap:12px 24px;margin-block:16px 32px}.blog-article-meta>span {display:inline-flex;align-items:center;gap:8px}
.blog-hero-media {aspect-ratio:21/9;overflow:hidden;border-radius:16px;background:#eef2f2;margin-block-end:28px}
.blog-hero-media img,.blog-card-image img,.blog-related-image img {width:100%;height:100%;object-fit:cover;display:block}
.blog-image-fallback {height:100%;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:#eef3f3;color:var(--primary-dark,#174d69);font-size:20px;font-weight:700}
.blog-image-fallback i {font-size:32px;opacity:.5}
.blog-article-excerpt {font-size:19px;line-height:1.9;color:#435662;border-inline-start:3px solid var(--blog-brand);padding-inline-start:20px;margin-block:24px 32px}
.blog-content {font-size:17px;line-height:1.95;overflow-wrap:anywhere;color:#344650;margin-block:24px 40px;min-width:0}
[lang=ar] .blog-content {line-height:2.05}
.blog-content p,.blog-content ul,.blog-content ol,.blog-content blockquote,.blog-content pre {margin-block:1.2em}
.blog-content h2 {font-size:1.55em;font-weight:700;margin-block:1.6em .6em;line-height:1.65;color:var(--blog-ink)}
.blog-content h3 {font-size:1.3em;font-weight:700;margin-block:1.5em .5em;line-height:1.7;color:var(--blog-ink)}
.blog-content h4 {font-size:1.12em;font-weight:700;margin-block:1.4em .5em;color:var(--blog-ink)}
.blog-content ul {list-style:disc;padding-inline-start:1.6em}.blog-content ol {list-style:decimal;padding-inline-start:1.6em}
.blog-content li {padding-inline-start:.25em;margin-block:.45em}.blog-content li::marker {color:var(--blog-brand);font-weight:600}
.blog-content a {color:var(--primary-dark,#174d69);text-decoration:underline;text-underline-offset:4px}
.blog-content blockquote {border-inline-start:3px solid var(--blog-brand);padding:16px 24px;background:#f5f8f8;border-radius:8px;font-size:1.05em}
.blog-content pre {max-width:100%;overflow:auto;padding:20px;background:#f3f5f5;border-radius:12px;direction:ltr;text-align:left;font-size:.9em}
.blog-content code {font-family:monospace}.blog-content hr {margin-block:32px;border-color:var(--blog-line)}
.blog-content img {max-width:100%;height:auto;border-radius:12px}.blog-content table {display:block;max-width:100%;overflow:auto;border-collapse:collapse}.blog-content th,.blog-content td {padding:12px;border:1px solid var(--blog-line);text-align:start}
.blog-engagement,.blog-share,.blog-comments {border-block-start:1px solid var(--blog-line);padding-block-start:24px;margin-block-start:24px}
.blog-engagement-row {display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px;color:var(--blog-muted);font-size:14px}
.blog-engagement-row>span,.blog-engagement-row>a,.blog-like-button {display:inline-flex;align-items:center;gap:8px;min-height:44px}
.blog-like-button {border:1px solid var(--blog-line);border-radius:999px;padding:8px 16px;color:var(--blog-ink);background:#fff;cursor:pointer}
.blog-like-button:hover {border-color:#d97c85;background:#fff7f7}.blog-like-button[aria-pressed=true] {background:#fff1f3;border-color:#edc2c8;color:#a6273d}.blog-like-button:disabled {opacity:.6;cursor:wait}
.blog-section-label {font-size:15px;font-weight:700;margin-block-end:16px}
.blog-share-buttons {display:flex;flex-wrap:wrap;gap:8px}
.blog-share-button {display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--blog-line);border-radius:10px;padding:10px 14px;min-height:44px;font-size:14px;background:#fff;color:var(--blog-ink)}
.blog-share-button:hover {border-color:var(--blog-brand);background:var(--primary-bg,#edf5fa);color:var(--primary-dark,#174d69)}
.blog-share-button i {width:16px;text-align:center}#blog-copy-fallback {max-width:100%}
.blog-comments {scroll-margin-block-start:128px}
.blog-section-title {font-size:22px;line-height:1.6;font-weight:700;margin-block-end:20px}
.blog-comment-list {display:grid;gap:16px}
.blog-comment-text {margin-block-start:12px;white-space:pre-wrap;overflow-wrap:anywhere}
.blog-official-replies {display:grid;gap:16px;margin-block-start:20px;padding-inline-start:16px;list-style:none}
.blog-official-reply {padding:16px;border-inline-start:3px solid var(--blog-brand);border-radius:8px;background:#eff6ff;min-inline-size:0}
.blog-official-badge {font-size:12px;font-weight:600;color:#1e40af;background:#dbeafe;border-radius:999px;padding:2px 10px}
.blog-comment-card {background:#fafbf9;border:1px solid var(--blog-line);padding:20px;border-radius:12px;min-width:0}
.blog-comment-form {margin-block-start:28px;background:#fafbf9;border:1px solid var(--blog-line);border-radius:16px;padding:24px;display:grid;gap:16px}
.blog-form-title {font-size:20px;font-weight:700}
.blog-input {width:100%;min-width:0;border:1px solid #cbd2d5;border-radius:10px;background:#fff;padding:12px 14px;color:var(--blog-ink);font:inherit;min-height:48px}
.blog-input:hover {border-color:#82949f}.blog-input:focus {border-color:var(--blog-brand)}
.blog-submit {justify-self:start;min-height:48px;border-radius:10px;background:var(--blog-brand);color:#fff;padding:12px 24px;font-weight:700}
.blog-submit:hover {background:var(--primary-dark,#174d69)}
.blog-related {min-width:0;padding-block-start:0}.blog-related-list {display:grid;gap:16px}
.blog-related-card {display:grid;grid-template-columns:80px minmax(0,1fr);gap:16px;padding:20px;min-height:136px;background:#fff;border:1px solid var(--blog-line);border-radius:16px;align-items:center}
.blog-related-image {display:block;aspect-ratio:1;overflow:hidden;border-radius:10px;background:#eef3f3}.blog-related-image .blog-image-fallback i {font-size:24px}
.blog-related-copy {min-width:0}.blog-related h3 {font-size:16px;font-weight:700;line-height:1.75;margin-block:8px 4px}.blog-related .blog-meta {font-size:12px}
.blog-listing-header {max-width:680px}.blog-eyebrow {font-size:14px;letter-spacing:.06em;font-weight:700;color:var(--blog-brand);margin-block-end:8px}
.blog-listing-header h1 {font-size:clamp(30px,3.5vw,44px);font-weight:800;line-height:1.4;margin-block-end:12px}.blog-listing-header>p:last-child {color:var(--blog-muted);font-size:18px;line-height:1.8}
.blog-filters {display:flex;flex-wrap:wrap;gap:8px;margin-block:32px}
.blog-filters a {display:inline-flex;align-items:center;min-height:44px;padding:8px 20px;border:1px solid #d8dedf;background:#fff;border-radius:999px;font-size:14px;color:#435662}
.blog-filters a[aria-current],.blog-filters a:hover {background:var(--blog-brand);border-color:var(--blog-brand);color:#fff}
.blog-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.blog-list-card {display:flex;flex-direction:column;min-width:0;background:#fff;border:1px solid var(--blog-line);border-radius:20px;overflow:hidden;box-shadow:0 4px 20px #20323e04}
.blog-card-image {display:block;aspect-ratio:16/9;overflow:hidden;background:#eef3f3}
.blog-card-copy {padding:24px;display:flex;flex-direction:column;align-items:start;gap:12px;flex:1;min-width:0}
.blog-card-copy h2 {font-size:22px;line-height:1.65;font-weight:700}
.blog-card-excerpt {color:#52636d;line-height:1.9;font-size:16px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.blog-card-meta {display:flex;flex-wrap:wrap;gap:4px 16px;margin-block-start:auto;font-size:13px}
.blog-read-link {display:inline-flex;align-items:center;gap:12px;font-size:15px;font-weight:700;color:var(--primary-dark,#174d69);padding-block:8px}
[dir=rtl] .blog-read-link i {transform:rotate(180deg)}
.blog-pagination {margin-block-start:40px}.blog-empty {grid-column:1/-1;padding:40px 0;color:var(--blog-muted)}
@media(max-width:1199px) {.blog-article-layout {gap:24px;grid-template-columns:minmax(0,7fr) minmax(0,3fr)}.blog-article-card {padding:28px}.blog-related-card {grid-template-columns:72px minmax(0,1fr);padding:12px;gap:12px}.blog-grid {grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:959px) {.blog-article-layout {grid-template-columns:minmax(0,1fr)}.blog-related-list {grid-template-columns:repeat(3,minmax(0,1fr))}.blog-related-card {display:flex;flex-direction:column;padding:16px}.blog-related-image {width:100%;aspect-ratio:16/9}.blog-related {padding-block-start:8px}.blog-article-title {font-size:32px}}
@media(max-width:639px) {.blog-page {padding:112px 12px 48px}.blog-article-card {padding:20px 16px;border-radius:16px}.blog-article-title {font-size:27px}.blog-breadcrumbs {font-size:12px;gap:6px;margin-block-end:20px}.blog-hero-media {aspect-ratio:16/9;border-radius:10px;margin-block-end:24px}.blog-article-excerpt {font-size:17px;padding-inline-start:16px}.blog-content {font-size:16px;line-height:1.95}.blog-content h2 {font-size:1.4em}.blog-section-title {font-size:21px}.blog-related-list,.blog-grid {grid-template-columns:minmax(0,1fr)}.blog-related-card {display:grid;grid-template-columns:88px minmax(0,1fr);gap:16px}.blog-related-image {aspect-ratio:1}.blog-comment-form {padding:16px}.blog-comment-card {padding:16px}.blog-share-button {padding:10px 12px}.blog-engagement-row {gap:8px 16px}.blog-card-copy {padding:20px}.blog-listing-header h1 {font-size:32px}.blog-listing-header>p:last-child {font-size:16px}.blog-grid {gap:20px}}
@media(prefers-reduced-motion:reduce) {.blog-page a,.blog-page button {transition:none}}
/* Article-only additions: no shared navigation, footer or admin overrides. */
[lang=ar] .blog-article-page :is(.blog-article-title,.blog-article-excerpt,.blog-content,.blog-section-title,.blog-related-copy,.blog-tracking-cta,.blog-toc a) {font-family:'IBM Plex Sans Arabic','Tajawal',sans-serif}
.blog-article-page .blog-article-sidebar {display:grid;gap:28px;min-width:0}
.blog-article-page .blog-toc {background:#fff;border:1px solid var(--blog-line);border-radius:16px;padding:24px;min-width:0}
.blog-article-page .blog-toc[hidden] {display:none}
.blog-article-page .blog-toc ol {display:grid;gap:8px;list-style:decimal;padding-inline-start:20px;font-size:14px;line-height:1.9}
.blog-article-page .blog-toc li::marker {color:var(--blog-muted)}
.blog-article-page .blog-toc a {display:block;padding:8px;border-inline-start:2px solid transparent;color:#435662;border-radius:4px;min-height:44px}
.blog-article-page .blog-toc a:hover,.blog-article-page .blog-toc a[aria-current] {color:var(--primary-dark);border-inline-start-color:var(--blog-brand);background:var(--primary-bg)}
.blog-article-page .blog-toc a[aria-current] {font-weight:700}
.blog-article-page .blog-content h2 {scroll-margin-block-start:136px}
.blog-article-page .blog-content h2:focus-visible {outline:2px solid var(--blog-brand);outline-offset:6px}
.blog-article-page .blog-tracking-cta {border:1px solid var(--blog-line);border-radius:16px;padding:24px;background:var(--primary-bg);color:var(--primary-dark)}
.blog-article-page .blog-tracking-cta>i {font-size:24px}
.blog-article-page .blog-tracking-cta p {font-size:20px;font-weight:700;margin-block:12px}
.blog-article-page .blog-tracking-cta a {display:inline-flex;align-items:center;gap:12px;min-height:48px;border-radius:8px;padding:10px 16px;background:var(--blog-brand);color:#fff;font-weight:700}
[dir=rtl] .blog-article-page .blog-tracking-cta a i {transform:rotate(180deg)}
@media(prefers-reduced-motion:reduce) {.blog-article-page,.blog-article-page * {scroll-behavior:auto}}
[lang=ar] .blog-article-page .blog-content :not(pre):not(code) {font-family:'IBM Plex Sans Arabic','Tajawal',sans-serif}

/* Default prose alignment only. Explicit Summernote styles/classes on a block,
   its ancestors or descendants are excluded so inherited text-align-last cannot
   affect an explicitly aligned child. Never align the article wrapper itself. */
@media (min-width: 641px) {
    :where(.blog-article-page .blog-content :is(p, li, blockquote), .blog-article-page p.blog-article-excerpt):not(
        :is([style*="text-align" i], [align], .text-left, .text-right, .text-center, .text-justify, .text-start, .text-end, .note-align-left, .note-align-right, .note-align-center, .note-align-justify)
    ):not(
        :is([style*="text-align" i], [align], .text-left, .text-right, .text-center, .text-justify, .text-start, .text-end, .note-align-left, .note-align-right, .note-align-center, .note-align-justify) *
    ):not(
        :is(pre, code, table, caption, figcaption) *
    ):not(
        :has([style*="text-align" i], [align], .text-left, .text-right, .text-center, .text-justify, .text-start, .text-end, .note-align-left, .note-align-right, .note-align-center, .note-align-justify, pre, code, table, caption, figcaption, h1, h2, h3, h4, h5, h6)
    ) {
        text-align: justify;
        text-align-last: start;
    }
}
@media (max-width: 640px) {
    :where(.blog-article-page .blog-content :is(p, li, blockquote), .blog-article-page p.blog-article-excerpt):not(
        :is([style*="text-align" i], [align], .text-left, .text-right, .text-center, .text-justify, .text-start, .text-end, .note-align-left, .note-align-right, .note-align-center, .note-align-justify)
    ):not(
        :is([style*="text-align" i], [align], .text-left, .text-right, .text-center, .text-justify, .text-start, .text-end, .note-align-left, .note-align-right, .note-align-center, .note-align-justify) *
    ):not(
        :is(pre, code, table, caption, figcaption) *
    ):not(
        :has([style*="text-align" i], [align], .text-left, .text-right, .text-center, .text-justify, .text-start, .text-end, .note-align-left, .note-align-right, .note-align-center, .note-align-justify, pre, code, table, caption, figcaption, h1, h2, h3, h4, h5, h6)
    ) {
        text-align: start;
    }
}
