:root {
    --site-space-2xs: 0.5rem;
    --site-space-xs: 0.75rem;
    --site-space-sm: 1rem;
    --site-space-md: 1.5rem;
    --site-space-lg: 2.25rem;
    --site-space-xl: 3.25rem;
    --site-space-2xl: 4.5rem;
    --site-page-inline-gap: clamp(1rem, 2vw, 1.5rem);
    --site-sidebar-gap: clamp(1.25rem, 2.5vw, 2rem);
    --site-title-xl: clamp(2rem, 3vw, 3rem);
    --site-title-lg: clamp(1.65rem, 2.3vw, 2.25rem);
    --site-title-md: clamp(1.25rem, 1.8vw, 1.5rem);
    --site-title-sm: clamp(1.05rem, 1.4vw, 1.25rem);
    --site-body-size: 1rem;
    --site-reading-size: 1.0625rem;
    --site-meta-size: 0.8125rem;
    --site-reading-line-height: 1.95;
    --site-body-line-height: 1.8;
    --site-muted: #6b7280;
    --site-border: rgba(17, 24, 39, 0.12);

    /* Editorial Design Tokens */
    --k24-card-radius: 14px;
    --k24-card-padding: 1.5rem;
    --k24-card-border: rgba(7, 19, 37, 0.08);
    --k24-card-bg: #FFFFFF;
    --k24-card-bg-hover: #F7F8FA;
    --k24-ink: #071325;
    --k24-crimson: #ef3f48;

    /* Spacing System */
    --site-section-spacing: 64px;
    --site-internal-spacing: 24px;
    --site-grid-gap: 16px;
    --site-container-max: 1320px;
}

/* Global Container Normalization */
.container,
.page-shell__container {
    max-width: var(--site-container-max) !important;
    margin-inline: auto !important;
    padding-inline: 24px !important;
}

/* Section Spacing Rhythm */
.page-shell,
.shortcode-block {
    margin-block: 0 !important;
    padding-block: var(--site-section-spacing) !important;
}

.page-shell--homepage {
    padding-block-start: var(--site-internal-spacing) !important;
}

.shortcode-head {
    margin-block-end: var(--site-internal-spacing) !important;
}

.row, .shortcode-grid {
    --bs-gutter-x: var(--site-grid-gap);
    --bs-gutter-y: var(--site-grid-gap);
}

/* Typography Scale Refinement
   ─────────────────────────────────────────────────────────────────────────────
   All shortcode-facing selectors read the design-system CSS variable first.
   The hardcoded value is the FALLBACK used when:
     (a) no Design-tab value has been configured for the block, or
     (b) the element is outside a .shortcode-block (archive pages, widgets).
   This ensures shortcodes.css var()-driven rules and these rules always agree
   on the resolved value, eliminating !important specificity races.
   ───────────────────────────────────────────────────────────────────────────── */
.shortcode-heading-title,
.widget-title,
.section-title {
    font-size:   var(--k24-design-section-title-font-size,   1.75rem) !important;
    font-family: var(--k24-design-section-title-font-family, var(--k24-design-title-font-family, inherit)) !important;
    font-weight: var(--k24-design-section-title-font-weight, 700)     !important;
    line-height: var(--k24-design-section-title-line-height, 1.2)     !important;
    color:       var(--k24-design-section-title-color, var(--k24-design-title-color, inherit)) !important;
}

.k24-card__title,
.post-title,
.shortcode-card-title {
    font-size:   var(--k24-design-article-title-font-size,   1rem) !important;
    font-family: var(--k24-design-article-title-font-family, var(--k24-design-title-font-family, 'ItfHuwiyaArabic', sans-serif)) !important;
    font-weight: var(--k24-design-article-title-font-weight, 600)  !important;
    line-height: var(--k24-design-article-title-line-height, 1.4)  !important;
    color:       var(--k24-design-article-title-color, var(--k24-design-title-color, inherit)) !important;
}

.k24-card__meta,
.entry-meta {
    font-size:   var(--k24-design-meta-text-font-size, 0.75rem) !important;
    font-family: var(--k24-design-meta-text-font-family, inherit) !important;
    font-weight: var(--k24-design-meta-text-font-weight, inherit) !important;
    line-height: var(--k24-design-meta-text-line-height, inherit) !important;
    color:       var(--k24-design-meta-text-color, var(--site-muted)) !important;
    gap: 0.5rem 0.75rem !important;
}

.k24-card__excerpt,
.shortcode-card-caption {
    font-size:   var(--k24-design-article-caption-font-size,   0.875rem) !important;
    font-family: var(--k24-design-article-caption-font-family, inherit) !important;
    font-weight: var(--k24-design-article-caption-font-weight, inherit) !important;
    line-height: var(--k24-design-article-caption-line-height, 1.6)      !important;
    color:       var(--k24-design-article-caption-color, inherit) !important;
    margin-block-start: 0.5rem !important;
}

/* Dark Editorial Section Polish */
.shortcode-skin--dark,
.shortcode-surface-mode--dark {
    background-color: var(--shortcode-surface-dark) !important;
}

.shortcode-skin--dark .shortcode-shell {
    padding-block: var(--site-section-spacing) !important;
}

.shortcode-skin--dark .shortcode-card,
.shortcode-surface-mode--dark .shortcode-card {
    background-color: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    height: 100% !important;
}

/* Footer Refinement */
.k24-footer__main {
    padding-block: var(--site-section-spacing) !important;
}

.k24-footer__grid {
    display: grid !important;
    grid-template-columns: 1.5fr repeat(3, 1fr) !important;
    gap: 3rem !important;
}

.k24-footer__col-title {
    font-size: 1.125rem !important;
    font-weight: 700 !important;
    margin-block-end: 1.5rem !important;
    color: #fff !important;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.k24-footer__list {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.875rem !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
}

.k24-footer__list a {
    color: var(--k24-footer-muted) !important;
    font-size: 0.9375rem !important;
    transition: color 0.2s ease !important;
}

.k24-footer__list a:hover {
    color: #fff !important;
}

.k24-footer__description {
    line-height: 1.7 !important;
    margin-block-start: 1rem !important;
}

/* Micro Alignment & UI Cleanup */
.btn, 
.button, 
.post-cat, 
.tag-cloud-link,
.k24-card__badge span {
    border-radius: 9999px !important;
}

.k24-card__title,
.k24-card__title a,
.shortcode-card-title,
.shortcode-card-title a,
.post-title,
.post-title a,
.widget-title {
    font-family: var(--k24-design-article-title-font-family, var(--k24-design-title-font-family, 'ItfHuwiyaArabic', sans-serif)) !important;
}

.k24-card__meta i,
.entry-meta i {
    vertical-align: middle !important;
    margin-top: -2px !important;
}

/* Fix for accidental giant whitespace */
.site-main > *:empty,
.page-shell > *:empty {
    display: none !important;
}

/* Grid & Card Consistency */
.shortcode-grid, .row {
    display: flex !important;
    flex-wrap: wrap !important;
}

.shortcode-grid > [class*="col-"],
.row > [class*="col-"] {
    display: flex !important;
    flex-direction: column !important;
}

.k24-card, .shortcode-card {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    width: 100% !important;
}

.k24-card__content, .shortcode-card-body {
    flex-grow: 1 !important;
}

@media (max-width: 991.98px) {
    .k24-footer__grid {
        grid-template-columns: 1fr 1fr !important;
        gap: 2.5rem !important;
    }
}

@media (max-width: 767.98px) {
    .k24-footer__grid {
        grid-template-columns: 1fr !important;
        gap: 2rem !important;
    }
}

body {
    font-size: var(--site-body-size);
    line-height: var(--site-body-line-height);
}

p {
    font-size: 1rem;
    line-height: var(--site-body-line-height);
    margin-block-end: 1rem;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    line-height: 1.3;
}

.font-small {
    font-size: var(--site-meta-size);
    line-height: 1.65;
}

.font-medium {
    font-size: 0.9375rem;
    line-height: 1.75;
}

.font-large {
    font-size: 1.125rem;
    line-height: 1.9;
}

.site-main {
    position: relative;
}

.site-main--homepage {
    background: #f4f5f9;
}

.page-shell {
    padding-block: var(--site-space-2xl);
}

.page-shell--homepage {
    padding-block-start: var(--site-space-lg);
}

.page-shell--archive,
.page-shell--article,
.page-shell--default,
.page-shell--author,
.page-shell--tag,
.page-shell--plain {
    padding-block-start: var(--site-space-xl);
}

.archive-page__content {
    padding-block-end: var(--site-space-xl);
}

.page-shell__container {
    padding-inline: var(--site-page-inline-gap);
}

.page-shell__container > *:last-child,
.page-intro > *:last-child,
.article-shell__content > *:last-child,
.page-sidebar > *:last-child {
    margin-block-end: 0;
}

.page-intro {
    margin-block-end: var(--site-space-xl);
}

.page-intro__eyebrow {
    color: var(--site-muted);
    font-size: var(--site-meta-size);
    font-weight: 600;
    letter-spacing: 0.08em;
    margin-block-end: var(--site-space-xs);
    text-transform: uppercase;
}

.archive-header,
.page-header-style-1 {
    margin-block: 0;
}

.archive-header h1,
.page-header-style-1 h1,
.author-page__bio h3,
.entry-header.single-header-default h1.post-title {
    font-size: var(--site-title-xl);
    letter-spacing: -0.02em;
    margin-block-end: 0;
}

.search-results__title,
.archive-header h1 span,
.page-header-style-1 h1 span {
    display: inline-block;
}

.archive-header .bt-1,
.page-header-style-1 .bt-1,
.entry-header.single-header-default .bt-1 {
    margin-block: var(--site-space-md);
}

.site-main .homepage-inline-ad-wrap,
.site-main .homepage-inline-ad,
.site-main .homepage-ad-banner {
    margin-block: 32px;
}

.shortcode-ads-banner {
    margin-block-start: var(--ads-margin-top-desktop, 32px);
    margin-block-end: var(--ads-margin-bottom-desktop, 32px);
}

@media (max-width: 991.98px) {
    .site-main .homepage-inline-ad-wrap,
    .site-main .homepage-inline-ad,
    .site-main .homepage-ad-banner,
    .shortcode-ads-banner {
        margin-block: 24px;
    }

    .shortcode-ads-banner {
        margin-block-start: var(--ads-margin-top-tablet, var(--ads-margin-top-desktop, 24px));
        margin-block-end: var(--ads-margin-bottom-tablet, var(--ads-margin-bottom-desktop, 24px));
    }
}

@media (max-width: 767.98px) {
    .site-main .homepage-inline-ad-wrap,
    .site-main .homepage-inline-ad,
    .site-main .homepage-ad-banner,
    .shortcode-ads-banner {
        margin-block: 24px;
    }

    .shortcode-ads-banner {
        margin-block-start: var(--ads-margin-top-mobile, var(--ads-margin-top-tablet, 24px));
        margin-block-end: var(--ads-margin-bottom-mobile, var(--ads-margin-bottom-tablet, 24px));
    }
}

.before-footer-ad-shell {
    padding-block-start: var(--site-space-lg);
}

.before-footer-ad {
    margin-block-end: 0 !important;
}

.main_content.page-shell {
    padding-inline: 0;
}

.archive-content__row,
.article-shell__grid {
    row-gap: var(--site-space-xl);
}

.page-sidebar {
    padding-inline-start: var(--site-sidebar-gap);
}

.page-sidebar .sidebar-widget + .sidebar-widget,
.page-sidebar .widget + .widget,
.page-sidebar .widget-area > * + * {
    margin-block-start: var(--site-space-md);
}

.site-archive-posts > .row {
    row-gap: var(--site-space-xl);
}

.search-results__list .first-post,
.search-results__list > article,
.author-page__posts .loop-list > * {
    margin-block-end: 0 !important;
}

.search-results__list {
    display: grid;
    gap: var(--site-space-xl);
}

.article-shell__content {
    display: flow-root;
}

.entry-header.single-header-default {
    margin-block-end: var(--site-space-lg);
}

.entry-header.single-header-default .post-title {
    font-size: var(--site-title-xl);
    line-height: 1.25;
    margin-block-end: var(--site-space-sm);
}

.entry-meta.meta-1 {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: var(--site-space-2xs) var(--site-space-sm);
    margin-block: var(--site-space-sm) !important;
}

.entry-meta.meta-1 span {
    margin: 0 !important;
    padding: 0 !important;
}

.entry-meta.meta-1 span i {
    margin-inline-end: 0.35rem !important;
    margin-inline-start: 0 !important;
}

.article-toolbar {
    align-items: flex-start;
    display: flex;
    flex-wrap: wrap;
    gap: var(--site-space-sm);
    justify-content: space-between;
}

.article-toolbar__stats {
    flex: 1 1 18rem;
}

.article-toolbar__share {
    align-items: center;
    display: flex;
    flex: 0 0 auto;
    flex-wrap: wrap;
    gap: var(--site-space-xs);
    justify-content: flex-end;
    margin: 0;
    padding: 0;
}

.article-toolbar__share li,
.single-social-share.article-toolbar__share li {
    margin: 0 !important;
}

.article-excerpt {
    margin-block-end: var(--site-space-lg);
}

.article-excerpt p {
    color: #334155;
    font-size: 1.125rem;
    line-height: 2;
    margin: 0;
}

.article-body,
.entry-main-content {
    margin-block-end: var(--site-space-lg);
}

.entry-main-content .ck-content {
    font-size: var(--site-reading-size);
    line-height: var(--site-reading-line-height);
}

.entry-main-content .ck-content > * + * {
    margin-block-start: 1.25rem;
}

.entry-main-content .ck-content h2 {
    font-size: var(--site-title-lg);
    margin-block-start: var(--site-space-xl);
}

.entry-main-content .ck-content h3 {
    font-size: var(--site-title-md);
    margin-block-start: var(--site-space-lg);
}

.article-inline-ad,
.article-source,
.article-tags,
.article-author-box,
.article-related {
    margin-block: var(--site-space-lg);
}

.article-hero-media {
    margin: 0 0 var(--site-space-lg);
}

.article-hero-media .k24-media-surface {
    border-radius: 14px !important;
}

.article-tags .tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.625rem;
}

.tag-cloud-link {
    margin: 0;
    border-radius: 9999px !important;
}

.author-bio.article-author-box {
    align-items: flex-start;
    display: flex;
    gap: var(--site-space-lg);
    padding: var(--site-space-lg);
    border-radius: 14px !important;
}

.author-bio.article-author-box .author-image,
.author-page__bio .author-image {
    margin: 0;
}

.author-page {
    padding-block: var(--site-space-xl);
}

.author-page__bio {
    margin-block-end: var(--site-space-xl);
}

.author-page__posts .related-posts {
    margin-block-start: 0;
}

.footer-area.footer-shell {
    padding-block: var(--site-space-xl);
}

.footer-bottom-shell {
    padding-block: var(--site-space-md);
}

.footer-copy-right p {
    font-size: 0.875rem;
    line-height: 1.8;
    margin: 0;
}

.footer-menu {
    margin-block-start: 0 !important;
}

.footer-menu ul {
    display: flex;
    flex-wrap: wrap;
    gap: var(--site-space-xs) var(--site-space-lg);
    justify-content: flex-end;
}

.footer-menu ul li {
    margin: 0 !important;
}

.main-header .top-bar {
    padding-block: 0.625rem !important;
}

.main-header .top-bar .row,
.header-style-2 .header-bottom .row,
.header-style-3 .header-logo .row {
    align-items: center;
}

.main-header .header-bottom {
    min-height: 0;
}

.main-header .header-logo a {
    display: inline-flex;
    align-items: center;
}

.header-style-1 .header-brand-row {
    padding-block: 1rem !important;
}

.header-style-1 .header-brand-row .img-logo {
    max-height: 3.5rem;
}

.header-brand-fallback {
    align-items: center;
    color: #d71920;
    font-size: 1.35rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1;
    min-height: 3rem;
}

.header-brand-fallback--tablet,
.header-brand-fallback--mobile {
    font-size: 1.1rem;
    min-height: 2.5rem;
}

.main-header .main-nav ul li a {
    font-size: 0.8125rem;
    line-height: 1.2;
    padding-block: 1.35rem;
    padding-inline: 0.75rem;
}

.header-logo .img-logo {
    max-height: 88px;
}

[dir=rtl] .page-sidebar {
    padding-inline-end: 0;
}

[dir=rtl] .main-header .top-bar .text-left {
    text-align: start !important;
}

[dir=rtl] .main-header .top-bar .text-right {
    text-align: end !important;
}

[dir=rtl] .main-header .main-nav,
[dir=rtl] .main-header .main-nav ul {
    text-align: right;
}

[dir=rtl] .article-toolbar__share {
    justify-content: flex-start;
}

[dir=rtl] .footer-menu ul {
    justify-content: flex-start;
}

[dir=rtl] .author-bio.article-author-box,
[dir=rtl] .author-page__bio {
    text-align: right;
}

[dir=rtl] .single-social-share.article-toolbar__share,
[dir=rtl] .article-toolbar__share {
    float: none !important;
}

[dir=rtl] .article-toolbar__stats,
[dir=rtl] .entry-meta.meta-1 {
    text-align: right;
}

[dir=rtl] .post-thumb .social-share {
    inset-inline-start: 0;
    inset-inline-end: auto;
}

[dir=rtl] .main-header .main-nav ul ul.sub-menu,
[dir=rtl] .sub-mega-menu .nav-pills .nav-link {
    text-align: right;
}

[dir=rtl] .widget_categories li.cat-item {
    text-align: right;
}

[dir=rtl] .widget_categories li.cat-item a {
    float: none;
}

[dir=rtl] .letter-background {
    inset-inline-end: -15px;
    inset-inline-start: auto;
}

@media (max-width: 991.98px) {
    .page-shell {
        padding-block: var(--site-space-xl);
    }

    .page-sidebar {
        padding-inline-start: 0;
    }

    .author-bio.article-author-box {
        gap: var(--site-space-md);
        padding: var(--site-space-md);
    }
}

@media (max-width: 767.98px) {
    body {
        font-size: 0.9375rem;
    }

    .main-header .top-bar {
        padding-block: 0.5rem !important;
    }

    .page-shell--homepage {
        padding-block-start: var(--site-space-md);
    }

    .archive-header h1,
    .page-header-style-1 h1,
    .entry-header.single-header-default h1.post-title {
        font-size: clamp(1.65rem, 8vw, 2.1rem);
    }

    .article-excerpt p,
    .entry-main-content .ck-content {
        font-size: 1rem;
    }

    .article-toolbar,
    .author-bio.article-author-box {
        flex-direction: column;
    }

    .article-toolbar__share,
    [dir=rtl] .article-toolbar__share {
        justify-content: flex-start;
    }

    .footer-bottom-shell .row {
        row-gap: var(--site-space-sm);
    }

    .footer-menu ul,
    [dir=rtl] .footer-menu ul {
        justify-content: center;
    }
}
