
:root{--brand:#94A3B8;--brand-2:#E2E8F0;--accent:#FF8A1D;--bg:#FFFFFF;--text:#0F172A;--muted:#CBD5E1}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:'Tajawal',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--text);line-height:1.9;font-size:17px}
.container{width:min(1100px,92%);margin-inline:auto}img{max-width:100%;height:auto;border-radius:12px}
a{color:var(--brand)}a:hover{color:var(--accent)}

/* Header */
.site-header{background:var(--brand-2);border-bottom:1px solid var(--muted);position:sticky;top:0;z-index:50;padding:6px 0}
.header-inner{display:flex;gap:16px;align-items:center;justify-content:flex-start;min-height:60px}
.site-title{color:var(--text);font-weight:700;font-size:1.35rem;text-decoration:none}
.nav-toggle{display:none;background:transparent;border:0;font-size:1.5rem;cursor:pointer;margin-inline-start:auto}
.main-nav ul,.main-nav li{list-style:none;margin:0;padding:0}
.main-nav .menu{display:flex !important;gap:8px;flex-wrap:wrap;align-items:center}
.main-nav .menu a{display:block;padding:.7rem 1rem;text-decoration:none;border-radius:10px;font-weight:700;font-size:1.05rem;color:var(--text);border:1px solid transparent}
.main-nav .menu a:hover{background:#fff;border-color:var(--muted);box-shadow:0 2px 8px rgba(0,0,0,.05)}
@media (max-width:900px){
  .nav-toggle{display:inline-block}
  .main-nav{display:none !important;position:absolute;inset-inline:0;top:60px;background:var(--brand-2);padding:10px;border-bottom:1px solid var(--muted)}
  .main-nav.open{display:block !important}
  .main-nav .menu{display:block !important}
  .main-nav .menu li{margin:6px 0}
}
.main-nav .menu .current-menu-item > a,.main-nav .menu .current_page_item > a{background:#fff;border-color:var(--muted);box-shadow:0 2px 8px rgba(0,0,0,.06)}

/* Slider */
.hero-slider{margin:18px 0}
.slide-card{display:grid;gap:10px;background:#fff;border:1px solid var(--muted);border-radius:16px;overflow:hidden}
.slide-media .no-thumb{background:var(--brand-2);height:220px}
.hero-slider .slide-media img{width:100%;height:320px;object-fit:cover}
.slide-info{padding:10px}.slide-title{font-size:1.25rem;margin:0 0 6px}
.swiper-button-prev,.swiper-button-next{color:var(--accent)}.swiper-pagination-bullet-active{background:var(--accent)}

/* Blocks */
.vertical-blocks{display:grid;gap:14px;margin:10px 0 24px}
.vertical-blocks .block{background:#fff;border:1px solid var(--muted);border-radius:16px;padding:16px}
.block-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}
.block-head .more{font-size:.95rem;color:var(--text);text-decoration:none;border:1px solid var(--muted);border-radius:10px;padding:.28rem .7rem;background:#fff}
.block-head .more:hover{border-color:var(--accent)}
.mini-cards{display:grid;gap:10px}
.mini-card{display:grid;grid-template-columns:68px 1fr;gap:10px;align-items:center;background:#fff;border:1px solid var(--muted);border-radius:12px;padding:8px;text-decoration:none;color:inherit}
.mini-card .mc-thumb img{width:68px;height:68px;object-fit:cover;border-radius:10px}
.mini-card .mc-title{font-weight:700;line-height:1.5;font-size:1.02rem}
.mini-card .mc-meta{font-size:.85rem;color:#475569}
@media (min-width:900px){.vertical-blocks{grid-template-columns:repeat(3,1fr)}}

/* Promo A */
.promo-band{margin:16px 0}.promo-wrap{display:grid;gap:14px;align-items:stretch}
@media (min-width:980px){.promo-wrap{grid-template-columns: 1fr 1fr}}
.promo-tiles{background:#fff;border:1px solid var(--muted);border-radius:22px;padding:16px;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.promo-tiles .tile{background:var(--brand-2);border:1px solid var(--muted);border-radius:18px;padding:16px;position:relative;padding-top:64px}
.promo-tiles .tile .ribbon{position:absolute;top:16px;inset-inline-end:16px;background:var(--accent);color:#fff;padding:.4rem .9rem;border-radius:14px 14px 4px 14px;box-shadow:0 4px 12px rgba(0,0,0,.08);font-weight:800;white-space:nowrap}
.promo-tiles .tile .ribbon span{font-size:.95rem;line-height:1}
.promo-tiles .tile .t-sub{font-size:.95rem;opacity:.95}
.promo-tiles .tile .t-title{display:none !important}
.promo-copy{background:#fff;border:1px solid var(--muted);border-radius:22px;padding:22px;display:flex;flex-direction:column;gap:10px}
.promo-copy .h{margin:0;font-size:1.75rem}.promo-copy .sub{margin:0 0 6px}
.promo-copy .bullets{list-style:none;margin:0;padding:0}.promo-copy .bullets li{display:flex;gap:8px;align-items:flex-start;margin:.25rem 0}
.promo-copy .bullets li::before{content:'';display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--accent);margin-top:.5rem}
.promo-copy .ctas{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
.promo-copy .btn{display:inline-block;padding:.55rem 1rem;border-radius:12px;text-decoration:none;border:1px solid var(--muted);background:#fff}
.promo-copy .btn.call{background:var(--accent);border-color:var(--accent);color:#fff}
.promo-copy .btn.wa{background:#25D366;border-color:#25D366;color:#fff}

/* Footer & FAB */
.site-footer{background:var(--brand-2);margin-top:30px;border-top:1px solid var(--muted)}
.footer-grid{display:grid;gap:16px;padding:18px 0}.footer-menu{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.copy{text-align:center;padding:8px 0;border-top:1px solid var(--muted)}
.fab{position:fixed;right:12px;bottom:12px;display:flex;flex-direction:column;gap:10px;z-index:60}
.fab-btn{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--accent);color:#fff;text-decoration:none;box-shadow:0 6px 20px rgba(0,0,0,.15);font-size:22px}
.fab-btn.wa{background:#25D366}.fab-btn.call{background:var(--accent)}

/* Single */
.single-head{margin-top:10px}.single-title{margin:0 0 8px;font-size:1.7rem}
.mkawil-toc{border:1px dashed var(--muted);background:var(--brand-2);border-radius:12px;padding:10px;margin:14px 0}
.mkawil-toc .toc-title{font-weight:700;margin-bottom:6px}.mkawil-toc ul{list-style:none;margin:0;padding:0}
.mkawil-toc li{margin:.2rem 0}.mkawil-toc li.lvl-3{padding-inline-start:16px;opacity:.9}
.mkawil-share{display:flex;align-items:center;gap:8px;margin-top:14px}
.mkawil-share .btn{display:inline-block;padding:.45rem .8rem;border-radius:10px;border:1px solid var(--muted);text-decoration:none}
.mkawil-share .share-fb{background:#fff}.mkawil-share .share-wa{background:#E9FCE0;border-color:#95D08C}


/* v1.8.1: mobile CTA buttons */
.promo-copy a.btn, .promo-copy .ctas .btn{display:inline-flex;align-items:center;justify-content:center;text-align:center}
@media (max-width: 640px){
  .promo-copy .ctas{display:flex;gap:10px}
  .promo-copy .ctas .btn{flex:1 1 48%; min-height:46px; font-size:1.05rem}
}


/* v1.8.2+footerA: Diagonal footer using site palette */
.site-footer.diagonal{position:relative;background:#0F172A;color:#E2E8F0;margin-top:30px;border-top:1px solid var(--muted);padding-top:12px}
.site-footer.diagonal a{color:#E2E8F0;text-decoration:none}
.site-footer.diagonal a:hover{color:var(--accent)}
.site-footer.diagonal .footer-wedge{position:absolute;inset:0;background:transparent;pointer-events:none}
.site-footer.diagonal .footer-wedge::before{
  content:'';position:absolute;inset:0;
  background:var(--brand);
  /* diagonal wedge similar to reference */
  clip-path:polygon(0 12%, 0 85%, 62% 70%, 85% 12%);
  opacity:1;
}
.footer-pro{position:relative;display:grid;gap:18px;padding:18px 0;z-index:1}
@media(min-width:980px){.footer-pro{grid-template-columns:repeat(4,1fr)}}
.footer-pro .col h3{margin:0 0 12px;font-size:1.25rem;color:#fff}
.footer-pro .list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.footer-pro .chips{display:flex;flex-wrap:wrap;gap:8px}
.footer-pro .chip{display:inline-block;padding:.42rem .8rem;background:var(--brand-2);color:#0F172A;border-radius:14px;border:1px solid var(--muted)}
.footer-pro .about p{margin:0 0 10px}
.footer-pro .social a{display:inline-block;margin-inline-end:10px;padding:.35rem .6rem;border:1px solid var(--muted);border-radius:10px;background:rgba(255,255,255,.06);color:#E2E8F0}
.footer-pro .social a:hover{background:rgba(255,255,255,.12)}
.site-footer.diagonal .legal{border-top:1px solid rgba(255,255,255,.08);background:#0b1226}
.site-footer.diagonal .legal .container{display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:center;padding:12px 0}
.site-footer.diagonal .legal .sep{opacity:.6}


/* v1.8.2+footerA: Horizontal layout tweak + darker background */
.site-footer.diagonal{background:#0b1226} /* darker */
.site-footer.diagonal .legal{background:#070d1a} /* darker legal */
.footer-pro{grid-template-columns:1fr}
@media(min-width:720px){.footer-pro{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1024px){.footer-pro{grid-template-columns:repeat(4,1fr)}}


/* v1.8.2 footerA fix: ensure chip text visible & improve contrast */
.footer-pro .chip,
.footer-pro .chip:link,
.footer-pro .chip:visited{ color:#0F172A !important; background:var(--brand-2); border:1px solid var(--muted) }
.footer-pro .chip:hover{ filter:brightness(0.98); text-decoration:none }
.footer-pro .list a{ color:#E2E8F0 }
.footer-pro .list a:hover{ color:var(--accent) }
.footer-pro .about p{ color:#E2E8F0 }


/* v1.8.2: Social login modal + single featured image fix */
.account-cta{margin-inline-start:auto}
.account-cta .btn{border:1px solid var(--muted);border-radius:10px;padding:.4rem .8rem;text-decoration:none;color:var(--text)}
.account-cta .btn:hover{border-color:var(--accent);color:var(--accent)}

.mk-modal{position:fixed;inset:0;display:none;z-index:9999}
.mk-modal.is-open{display:block}
.mk-modal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.5);backdrop-filter:saturate(120%) blur(2px)}
.mk-modal__card{position:relative;max-width:520px;margin:8vh auto;background:#fff;border-radius:16px;padding:20px;border:1px solid var(--muted)}
.mk-modal__close{position:absolute;inset-inline-end:10px;top:8px;background:transparent;border:0;font-size:26px;line-height:1;cursor:pointer}
.mk-modal h3{margin:0 0 6px}
.mk-modal .sub{margin:0 0 12px;color:#475569}
.mk-social-login{text-align:center}
.mk-social-login .nsl-container, .mk-social-login .mo-openid-app-icons, .mk-social-login .wp-social-login-widget{display:inline-block}
.mk-modal .alt{margin-top:12px;text-align:center}
.mk-modal .alt .link{color:var(--text);text-decoration:none;border-bottom:1px dashed var(--muted)}
.mk-modal .alt .link:hover{color:var(--accent);border-color:var(--accent)}

/* Single post hero image fix */
.single .post-hero{position:relative;border-radius:16px;overflow:hidden;background:#f8fafc;border:1px solid var(--muted);margin-bottom:14px}
.single .post-hero img{width:100%;height:auto;display:block}
@supports (aspect-ratio: 16 / 9){
  .single .post-hero{aspect-ratio:16/9}
  .single .post-hero img{height:100%;width:100%;object-fit:cover}
}


/* v1.8.2 hero-fixed: force single hero image consistent */
.single .post-hero{position:relative;display:block;width:100%;border-radius:16px;overflow:hidden;background:#f8fafc;border:1px solid var(--muted);margin:0 0 16px}
.single .post-hero img{width:100%;height:100%;display:block;object-fit:cover}
@supports (aspect-ratio: 16 / 9){
  .single .post-hero{aspect-ratio:16/9}
}

/* hide any legacy post thumbnail in headers to avoid duplicate */
.single .entry-header .post-thumbnail,
.single .post-thumbnail{display:none !important}

/* neutralize float for first content image if authors inserted manually */
.single .entry-content > p:first-child img.alignright,
.single .entry-content > p:first-child img.alignleft,
.single .entry-content > figure.wp-block-image:first-child{float:none !important;display:block;margin:0 0 16px;width:100%;height:auto;border-radius:12px;border:1px solid var(--muted)}
@supports (aspect-ratio: 16 / 9){
  .single .entry-content > p:first-child img.alignright,
  .single .entry-content > p:first-child img.alignleft,
  .single .entry-content > figure.wp-block-image:first-child img{width:100%;height:100%;object-fit:cover;aspect-ratio:16/9}
}


/* v1.8.2: Kill any leftover auth links in header */
.site-header .account-cta,
.site-header a#mk-login-open,
.site-header a[href*="wp-login.php?action=logout"],
.site-header a[href*="wp-login.php"],
.site-header a[href*="action=logout"]{display:none !important}


/* v1.8.2 archive-fix: category/archive grid */
.archive-header{margin:10px 0 14px}
.archive-title{font-size:1.4rem;margin:0 0 6px}
.archive-desc{color:#475569;margin:0}
.archive-grid{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width:640px){.archive-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:980px){.archive-grid{grid-template-columns:repeat(3,1fr)}}
.archive-card{border:1px solid var(--muted);border-radius:16px;padding:10px;background:#fff}
.archive-card .thumb{display:block;border-radius:12px;overflow:hidden;border:1px solid var(--muted);margin-bottom:8px}
.archive-card .entry-title{font-size:1.05rem;margin:6px 0}
.archive-card .meta{font-size:.85rem;color:#64748b;margin-bottom:6px}
.archive-card .excerpt{margin:0;color:#334155}


/* ===== Archive UI polish ===== */
.archive-header{margin:12px 0 14px}
.mk-breadcrumbs{font-size:.95rem;color:#64748b;margin:0 0 6px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.mk-breadcrumbs a{color:#64748b;text-decoration:none;border-bottom:1px dashed rgba(100,116,139,.45)}
.mk-breadcrumbs a:hover{color:var(--accent);border-color:var(--accent)}
.mk-breadcrumbs .sep{opacity:.6}
.archive-title{font-size:1.5rem;margin:2px 0 6px}
.archive-desc{color:#475569;margin:0 0 8px}

.archive-grid{display:grid;grid-template-columns:1fr;gap:16px}
@media(min-width:640px){.archive-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:980px){.archive-grid{grid-template-columns:repeat(3,1fr)}}

.archive-card{border:1px solid var(--muted);border-radius:16px;padding:12px;background:#fff;transition:transform .12s ease, box-shadow .12s ease}
.archive-card:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(15,23,42,.08)}
.archive-card .thumb{display:block;border-radius:12px;overflow:hidden;border:1px solid var(--muted);margin-bottom:10px;background:#f8fafc}
.archive-card .thumb img{width:100%;height:auto;display:block}
@supports (aspect-ratio: 16 / 9){
  .archive-card .thumb{aspect-ratio:16/9}
  .archive-card .thumb img{height:100%;width:100%;object-fit:cover}
}
.archive-card .entry-title{font-size:1.08rem;margin:6px 0}
.archive-card .entry-title a{color:#0f172a;text-decoration:none}
.archive-card .entry-title a:hover{color:var(--accent)}
.archive-card .meta{font-size:.85rem;color:#64748b;margin-bottom:6px}
.archive-card .excerpt{margin:0;color:#334155}
.empty{color:#64748b}

/* ===== Archive Polish ===== */
.container{max-width:1100px;margin-inline:auto;padding-inline:12px}
.mk-arch-hero{position:relative;overflow:hidden;background:linear-gradient(180deg, rgba(15,23,42,.95) 0%, rgba(15,23,42,.88) 100%);color:#E2E8F0;border-radius:0 0 20px 20px;margin:6px 0 12px;border:1px solid rgba(255,255,255,.06)}
.mk-arch-hero__inner{position:relative;padding:18px 0 22px;z-index:2}
.mk-arch-hero__shape{position:absolute;inset:auto 0 0 0;height:40px;background:linear-gradient(90deg, var(--brand) 0%, rgba(255,255,255,0) 70%);opacity:.18}
.mk-arch-title{font-size:1.6rem;margin:4px 0 4px;color:#fff}
.mk-arch-desc{margin:0;color:#cbd5e1}
.mk-breadcrumbs{font-size:.95rem;margin:0;display:flex;gap:8px;align-items:center;flex-wrap:wrap;color:#cbd5e1}
.mk-breadcrumbs a{color:#cbd5e1;text-decoration:none;border-bottom:1px dashed rgba(203,213,225,.5)}
.mk-breadcrumbs a:hover{color:var(--accent);border-color:var(--accent)}
.mk-breadcrumbs .sep{opacity:.6}

.archive-grid{display:grid;grid-template-columns:1fr;gap:16px;margin:8px 0 16px}
@media(min-width:640px){.archive-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:980px){.archive-grid{grid-template-columns:repeat(3,1fr)}}

.archive-card{border:1px solid var(--muted);border-radius:18px;overflow:hidden;background:#fff;transition:transform .12s ease, box-shadow .12s ease}
.archive-card:hover{transform:translateY(-3px);box-shadow:0 8px 22px rgba(15,23,42,.10)}
.archive-card .thumb{display:block;background:#f8fafc;border-bottom:1px solid var(--muted)}
.archive-card .thumb img{width:100%;height:auto;display:block}
@supports (aspect-ratio: 16 / 9){
  .archive-card .thumb{aspect-ratio:16/9}
  .archive-card .thumb img{height:100%;width:100%;object-fit:cover}
}
.archive-card .card-body{padding:10px 12px}
.archive-card .entry-title{font-size:1.08rem;margin:6px 0}
.archive-card .entry-title a{color:#0f172a;text-decoration:none}
.archive-card .entry-title a:hover{color:var(--accent)}
.archive-card .meta{font-size:.86rem;color:#64748b;margin-bottom:6px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.archive-card .meta .sep{opacity:.6}
.archive-card .excerpt{margin:0 0 10px;color:#334155}

.btn{display:inline-block;border-radius:12px;padding:.5rem .8rem;text-decoration:none}
.btn-read{background:var(--brand-2);color:#0f172a;border:1px solid var(--muted)}
.btn-read:hover{filter:brightness(.98);}
.pagination{margin:6px 0 10px}

/* ===== Archive Centered List ===== */
.container-narrow{max-width:860px;margin-inline:auto;padding-inline:14px}
.mk-arch-hero.mk-arch-hero--full{position:relative;overflow:hidden;background:linear-gradient(180deg, rgba(15,23,42,.95) 0%, rgba(15,23,42,.9) 100%);color:#E2E8F0;border-radius:0 0 22px 22px;margin:6px 0 14px;border:1px solid rgba(255,255,255,.06)}
.mk-arch-hero__inner{position:relative;padding:20px 0 22px;text-align:center}
.mk-arch-title{font-size:1.6rem;margin:6px 0 4px;color:#fff}
.mk-arch-desc{margin:0;color:#cbd5e1;text-align:center}
.mk-arch-hero__shape{position:absolute;inset:auto 0 0 0;height:44px;background:linear-gradient(90deg, var(--brand) 0%, rgba(255,255,255,0) 70%);opacity:.18}
.mk-breadcrumbs{font-size:.95rem;margin:0 0 4px;display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:center;color:#cbd5e1}
.mk-breadcrumbs a{color:#cbd5e1;text-decoration:none;border-bottom:1px dashed rgba(203,213,225,.5)}
.mk-breadcrumbs a:hover{color:var(--accent);border-color:var(--accent)}
.mk-breadcrumbs .sep{opacity:.6}

.archive-list{display:flex;flex-direction:column;gap:16px;margin:8px 0 16px}
.archive-row{display:grid;grid-template-columns:140px 1fr;gap:12px;border:1px solid var(--muted);border-radius:16px;background:#fff;padding:10px;align-items:center}
.archive-row .thumb{display:block;border-radius:10px;overflow:hidden;border:1px solid var(--muted);background:#f8fafc}
.archive-row .thumb img{width:100%;height:auto;display:block}
/* smaller 4:3 thumbs */
@supports (aspect-ratio: 4 / 3){
  .archive-row .thumb{aspect-ratio:4/3}
  .archive-row .thumb img{height:100%;width:100%;object-fit:cover}
}
.archive-row .entry-title{font-size:1.06rem;margin:2px 0 4px;text-align:center}
.archive-row .entry-title a{color:#0f172a;text-decoration:none}
.archive-row .entry-title a:hover{color:var(--accent)}
.archive-row .meta{font-size:.86rem;color:#64748b;margin-bottom:6px;text-align:center}
.archive-row .excerpt{margin:0 0 8px;color:#334155;text-align:center}
.archive-row .btn-read{display:inline-block;background:var(--brand-2);color:#0f172a;border:1px solid var(--muted);border-radius:12px;padding:.45rem .8rem;text-decoration:none}
.archive-row .btn-read:hover{filter:brightness(.98)}
.archive-row .row-body{padding:0 4px}

/* Mobile: stack image on top for very small widths */
@media(max-width:540px){
  .archive-row{grid-template-columns:1fr}
  .archive-row .row-body{text-align:center}
}

/* Pagination spacing */
.pagination{margin:8px 0 14px;text-align:center}
