/* Ksavac — logo-led card system on a sage-tinted ground. RTL-first; logical properties throughout. */
:root{
  --ground:#F3F6F5; --surface:#FFFFFF; --surface-2:#E9F0EE; --ink:#16231F; --ink-2:#4A5C57; --line:#D5E0DC;
  --teal:#2F6B62; --teal-brand:#5E8F87; --teal-soft:#DCEBE7; --gold:#C9A45C; --gold-ink:#6B4F12; --gold-soft:#F6EBD3;
  --nav-bg:#2F6B62; --ad-bg:#FFF7E6; --ad-line:#E2B866; --ad-ink:#7A5410; --focus:#B7791F;
  --c-gov:#2F6B62; --c-mil:#5B6B2E; --c-co:#2E5C8A; --c-train:#8A5A12; --c-news:#5A4E7A; --c-blog:#9A3F2B;
  --f-display:"Reem Kufi","IBM Plex Sans Arabic",Tahoma,sans-serif;
  --f-body:"IBM Plex Sans Arabic","Segoe UI",Tahoma,Arial,sans-serif;
  --r:12px; --r-sm:8px; --shadow:0 1px 2px rgba(22,35,31,.06),0 4px 14px rgba(22,35,31,.06);
  --tg:#229ED9; --foot:#16231F; --foot-ink:#DCE7E3;
}
[data-c="gov"]{--cat:var(--c-gov)} [data-c="mil"]{--cat:var(--c-mil)} [data-c="co"]{--cat:var(--c-co)}
[data-c="train"]{--cat:var(--c-train)} [data-c="news"]{--cat:var(--c-news)} [data-c="blog"]{--cat:var(--c-blog)}

/* ---- base & GeneratePress resets ---- */
body{background:var(--ground); color:var(--ink); font-family:var(--f-body); font-size:17px; line-height:1.8}
/* Guard: ad/custom-code snippets (e.g. Better Ads #151) ship full-page CSS for body and h1.
   Never let injected markup change the page layout or our headings. */
html body{display:block!important; min-height:0!important; text-align:start!important; background:var(--ground)!important; font-family:var(--f-body)!important; overflow-x:clip}
.ksv-topbar,.ksv-masthead,.ksv-nav,.ksv-ticker,#page,.ksv-foot{width:100%; min-width:0; max-width:100%}
.ksv-main h1,.ksv-main h2,.ksv-main h3{text-shadow:none!important}
.ksv-main h1::after,.ksv-main h1::before{content:none!important}
.art h1,.cat-hero h1,.about h1{position:static!important; margin-bottom:0!important}
.art h1{color:var(--ink)!important}
.prose [class*="-container"] h1,.prose [class*="-container"] h2{font-size:20px!important; margin:0 0 12px!important; color:var(--ink)!important}
body,button,input,select,textarea{font-family:var(--f-body)}
a{color:inherit}
a:hover{color:var(--teal)}
:focus-visible{outline:3px solid var(--focus); outline-offset:3px; border-radius:4px}
.site.grid-container,.grid-container{max-width:none; padding:0}
.site-content{display:block; padding:0}
.separate-containers .inside-article,.one-container .site-content{padding:0; background:transparent}
.wrap{max-width:1200px; margin-inline:auto; padding-inline:20px}
.screen-reader-text:focus{background:var(--teal); color:#fff; padding:8px 14px; border-radius:8px; z-index:100000}
h1,h2,h3{color:inherit}

/* ---- header ---- */
.ksv-topbar{background:var(--surface); border-bottom:1px solid var(--line); font-size:13.5px; color:var(--ink-2)}
.ksv-topbar .wrap{display:flex; gap:16px; align-items:center; min-height:40px; flex-wrap:wrap}
.ksv-topbar .dates{display:flex; gap:10px; align-items:center}
.ksv-topbar .dates span+span{padding-inline-start:10px; border-inline-start:1px solid var(--line)}
.ksv-topbar nav{margin-inline-start:auto; display:flex; gap:14px}
.ksv-topbar a{text-decoration:none}
.ksv-masthead{background:var(--surface)}
.ksv-masthead .wrap{display:flex; align-items:center; gap:18px; padding-block:16px}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none}
.brand:hover{color:inherit}
.brand-logo img{height:56px; width:auto; display:block}
.brand-mark{width:46px; height:46px; border-radius:12px; background:linear-gradient(135deg,var(--teal-brand),var(--gold)); display:grid; place-items:center; color:#fff; font-family:var(--f-display); font-weight:700; font-size:22px}
.brand-name{display:block; font-family:var(--f-display); font-weight:700; font-size:28px; line-height:1.15; color:var(--teal)}
.brand-tag{display:block; font-size:13px; color:var(--ink-2)}
.mh-actions{margin-inline-start:auto; display:flex; gap:10px; align-items:center}
.ksv-search{display:flex; align-items:center; gap:8px; border:1px solid var(--line); background:var(--ground); border-radius:999px; padding-block:4px; padding-inline:14px 6px; min-width:260px}
.ksv-search input[type=search]{border:0; background:transparent; font-size:15px; color:var(--ink); flex:1; min-width:0; padding:6px 4px}
.ksv-search input[type=search]:focus{outline:none}
.ksv-search:focus-within{outline:3px solid var(--focus); outline-offset:2px}
.ksv-search button{border:0; background:var(--teal); color:#fff; border-radius:999px; width:34px; height:34px; padding:0; display:grid; place-items:center; cursor:pointer}
.tg-btn{display:inline-flex; align-items:center; gap:8px; border:0; background:var(--tg); color:#fff; border-radius:999px; padding:8px 14px; font-size:14px; font-weight:600; text-decoration:none; min-height:40px; line-height:1.2}
.tg-btn:hover{color:#fff; filter:brightness(1.05)}
.menu-btn{display:none; border:1px solid var(--line); background:var(--surface); color:var(--ink); border-radius:10px; width:44px; height:44px; padding:0; cursor:pointer}
.ksv-nav{background:var(--nav-bg); position:sticky; top:0; z-index:40}
.admin-bar .ksv-nav{top:32px}
.ksv-nav ul{list-style:none; margin:0; padding:0; display:flex; gap:2px; overflow-x:auto; scrollbar-width:none}
.ksv-nav a{display:block; padding:12px 16px; color:#fff; text-decoration:none; font-weight:600; font-size:15.5px; white-space:nowrap; border-bottom:3px solid transparent}
.ksv-nav a:hover{background:rgba(255,255,255,.1); color:#fff}
.ksv-nav a[aria-current="page"]{border-bottom-color:var(--gold); background:rgba(0,0,0,.14)}

/* ---- ticker ---- */
.ksv-ticker{background:var(--surface); border-bottom:1px solid var(--line)}
.ksv-ticker .wrap{display:flex; align-items:center; gap:12px; min-height:46px}
.ticker-label{flex:none; background:var(--gold-soft); color:var(--gold-ink); font-weight:700; font-size:14px; padding:4px 12px; border-radius:999px}
.ticker-viewport{flex:1; min-width:0; overflow:hidden; mask-image:linear-gradient(to left,transparent,#000 4%,#000 96%,transparent)}
.ticker-track{display:flex; gap:36px; width:max-content; animation:ksv-tick 60s linear infinite}
.ticker-track .dup{display:contents}
.ksv-ticker[data-paused="true"] .ticker-track,.ticker-track:hover,.ticker-track:focus-within{animation-play-state:paused}
.ticker-track a{white-space:nowrap; text-decoration:none; font-size:15px}
.ticker-track a::before{content:"•"; color:var(--gold); margin-inline-end:10px}
@keyframes ksv-tick{from{transform:translateX(0)} to{transform:translateX(50%)}}
.ticker-pause{flex:none; border:1px solid var(--line); background:var(--surface); color:var(--ink); border-radius:999px; width:36px; height:36px; padding:0; cursor:pointer; font-size:12px}
@media (prefers-reduced-motion: reduce){.ticker-track{animation:none}.ticker-viewport{overflow-x:auto}.ticker-pause{display:none}}

/* ---- sections ---- */
.ksv-main{display:block; padding-bottom:10px}
.section{padding-block:22px}
.about{display:grid; grid-template-columns:1.4fr 1fr; gap:18px; align-items:center; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:18px 22px; margin-top:20px}
.about h1{font-family:var(--f-display); font-size:22px; margin:0 0 4px; color:var(--teal); text-wrap:balance; line-height:1.5; font-weight:700}
.about p{margin:0; color:var(--ink-2); font-size:15.5px}
.about ul{list-style:none; margin:0; padding:0; display:grid; gap:8px; font-size:14.5px}
.about li{display:flex; gap:10px; align-items:flex-start}
.about li svg{flex:none; margin-top:6px; color:var(--teal)}

.hero{display:grid; grid-template-columns:1.25fr 1fr; gap:18px}
.lead{position:relative; display:grid; grid-template-rows:auto 1fr; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; box-shadow:var(--shadow)}
.lead-art{display:grid; place-items:center; padding:30px; min-height:220px; background:radial-gradient(120% 90% at 85% 10%,var(--teal-soft),transparent 60%),radial-gradient(90% 80% at 10% 100%,var(--gold-soft),transparent 60%),var(--surface-2)}
.lead-art .logo{width:150px; height:150px}
.lead-body{padding:18px 22px 22px; display:grid; gap:10px; align-content:start}
.lead h2{margin:0; font-size:26px; line-height:1.55; text-wrap:balance; font-weight:700}
.lead p{margin:0; color:var(--ink-2); font-size:16px; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden}
.side-list{display:grid; gap:12px; align-content:start}
.side-h{font-family:var(--f-display); font-size:18px; margin:0 0 2px; display:flex; align-items:center; gap:8px; font-weight:700}
.side-h::before{content:""; width:10px; height:10px; border-radius:50%; background:var(--gold)}

/* ---- cards ---- */
.logo{display:grid; place-items:center; background:#fff; border:1px solid var(--line); border-radius:var(--r-sm); overflow:hidden; flex:none}
.logo img{width:100%; height:100%; object-fit:contain; padding:8%; display:block}
.logo-ph{font-family:var(--f-display); font-size:28px; color:var(--teal-brand)}
/* Photos (non-square featured images) fill their frame; logos stay contained. */
.logo.is-photo{display:block; background:var(--surface-2); border-color:transparent}
.logo.is-photo img,.card.big .logo.is-photo img{width:100%; height:100%; object-fit:cover; padding:0}
.card.big .logo.is-photo{height:200px; background:var(--surface-2)}
.lead-art:has(.is-photo){padding:0; min-height:0}
.lead-art .logo.is-photo{width:100%; height:100%; min-height:280px; aspect-ratio:16/9; border:0; border-radius:0}
.art .head .logo.is-photo{width:160px; height:96px}
.card{position:relative; display:flex; gap:14px; align-items:flex-start; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:14px; transition:border-color .15s,box-shadow .15s,transform .15s}
.card:hover{border-color:color-mix(in srgb,var(--teal) 45%,var(--line)); box-shadow:var(--shadow)}
@media (prefers-reduced-motion: no-preference){.card:hover{transform:translateY(-2px)}}
.card .logo{width:72px; height:72px}
.card-b{min-width:0; display:grid; gap:6px}
.card h3{margin:0; font-size:17px; line-height:1.7; font-weight:600}
.card h3 a,.lead h2 a,.blog-card h3 a{text-decoration:none}
.card h3 a::after,.lead h2 a::after,.blog-card h3 a::after{content:""; position:absolute; inset:0; border-radius:inherit}
.card h3 a:focus-visible,.lead h2 a:focus-visible,.blog-card h3 a:focus-visible{outline:none}
.card:has(a:focus-visible),.lead:has(h2 a:focus-visible),.blog-card:has(h3 a:focus-visible){outline:3px solid var(--focus); outline-offset:3px}
.card.sm{padding:10px 12px; gap:12px; align-items:center}
.card.sm .logo{width:52px; height:52px}
.card.sm h3{font-size:15.5px}
.card.big{flex-direction:column}
.card.big .logo{width:100%; height:150px; background:linear-gradient(160deg,var(--surface-2),var(--surface))}
.card.big .logo img{width:120px; height:120px; padding:0}
.card.big h3{font-size:19px}
.excerpt{margin:0; color:var(--ink-2); font-size:15px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.meta{display:flex; flex-wrap:wrap; gap:6px 12px; align-items:center; font-size:13.5px; color:var(--ink-2); position:relative; z-index:1}
.chip{display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:600; color:var(--cat,var(--teal)); text-decoration:none}
.chip::before{content:""; width:8px; height:8px; border-radius:50%; background:currentColor}
.direct{display:inline-flex; align-items:center; gap:5px; background:var(--teal); color:#fff; font-weight:700; font-size:12px; padding:1px 10px; border-radius:999px; position:relative; z-index:1}
.direct::before{content:""; width:7px; height:7px; border-radius:50%; background:var(--gold)}
.facts-box{margin:18px 0}
.facts-box h2{font-family:var(--f-display); font-size:18px; color:var(--teal); margin:0 0 8px; font-weight:700}
.facts{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; margin:0}
.facts div{background:var(--surface-2); padding:10px 14px; min-width:0}
.facts dt{font-size:12.5px; color:var(--ink-2)}
.facts dd{margin:0; font-weight:600; font-size:15.5px; overflow-wrap:anywhere}
.scam-note{background:var(--gold-soft); color:var(--gold-ink); border-radius:var(--r-sm); padding:12px 16px; font-size:14.5px; margin:16px 0 0}
.scam-note a{color:inherit; text-decoration:underline}
.adv-cta{background:linear-gradient(135deg,var(--teal),#24564F); color:#fff; border-radius:var(--r); padding:18px}
.adv-cta h2{margin:0 0 4px; font-family:var(--f-display); font-size:19px; color:#fff; font-weight:700}
.adv-cta p{margin:0 0 12px; font-size:14.5px; opacity:.92}
.adv-btn{display:inline-flex; align-items:center; gap:6px; background:var(--gold); color:#2A1F07; font-weight:700; text-decoration:none; border-radius:999px; padding:9px 18px; min-height:44px}
.adv-btn:hover{color:#2A1F07; filter:brightness(1.05)}
.new{background:var(--gold-soft); color:var(--gold-ink); font-weight:700; font-size:12px; padding:1px 8px; border-radius:999px}
time{font-variant-numeric:tabular-nums}

.quick{display:flex; gap:10px; flex-wrap:wrap; margin-top:18px}
.quick a{display:inline-flex; align-items:center; gap:10px; background:var(--surface); border:1px solid var(--line); border-radius:999px; padding:8px 16px; text-decoration:none; font-weight:600; font-size:15px; min-height:44px}
.quick a:hover{border-color:var(--cat); color:var(--cat)}
.quick .n{font-size:12.5px; color:var(--ink-2); font-weight:500; font-variant-numeric:tabular-nums}
.quick .dot{width:10px; height:10px; border-radius:50%; background:var(--cat)}

.cols{display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:26px; align-items:start}
.col-main{min-width:0}
.ksv-aside{display:grid; gap:18px; padding-block:22px}
.aside-sticky{position:sticky; top:64px}

.sh{display:flex; align-items:center; gap:12px; margin-bottom:14px}
.sh h2{margin:0; font-family:var(--f-display); font-size:22px; font-weight:700; color:var(--cat,var(--ink)); display:flex; align-items:center; gap:10px}
.sh h2::before{content:""; width:12px; height:12px; border-radius:3px; background:currentColor; transform:rotate(45deg)}
.sh .rule{flex:1; height:1px; background:var(--line)}
.sh a.all{font-size:14.5px; font-weight:600; color:var(--teal); text-decoration:none; padding:6px 4px; min-height:44px; display:inline-flex; align-items:center; gap:6px}
.sh a.all:hover{text-decoration:underline}
.rail{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.rail .stack{display:grid; gap:10px; align-content:start}
.rail-empty{color:var(--ink-2); font-size:15px; background:var(--surface); border:1px dashed var(--line); border-radius:var(--r); padding:16px}

.box{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:16px}
.box h2{margin:0 0 6px; font-family:var(--f-display); font-size:19px; font-weight:700}
.box .sub{margin:0 0 10px; font-size:13px; color:var(--ink-2)}
.mr{list-style:none; margin:0; padding:0; counter-reset:mr; display:grid}
.mr li{position:relative; display:grid; grid-template-columns:34px 1fr; gap:10px; padding-block:10px; border-top:1px solid var(--line); counter-increment:mr; margin:0}
.mr li:first-child{border-top:0}
.mr li::before{content:counter(mr); font-family:var(--f-display); font-weight:700; font-size:22px; color:var(--gold); line-height:1.4; text-align:center; font-variant-numeric:tabular-nums}
.mr a{text-decoration:none; font-size:15px; line-height:1.65; font-weight:600}
.mr a::after{content:""; position:absolute; inset:0}
.mr .v{display:block; font-size:12.5px; color:var(--ink-2); font-weight:500; font-variant-numeric:tabular-nums}

.follow{position:relative; display:grid; grid-template-columns:auto 1fr auto; gap:16px; align-items:center; border-radius:var(--r); padding:18px 22px; background:linear-gradient(120deg,#E3F3FB,var(--surface) 70%); border:1px solid #BFE3F3; color:#0F3446}
.follow .ic{width:52px; height:52px; border-radius:50%; background:var(--tg); display:grid; place-items:center; color:#fff}
.follow h2{margin:0; font-family:var(--f-display); font-size:20px; font-weight:700}
.follow p{margin:0; font-size:15px; opacity:.85}
.follow.side{grid-template-columns:auto 1fr; padding:16px}
.follow.side .tg-btn{grid-column:1/-1; justify-content:center}

.blog-grid{display:grid; grid-template-columns:1.3fr 1fr; gap:16px}
.blog-card{position:relative; display:grid; grid-template-columns:200px 1fr; gap:18px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); overflow:hidden}
.blog-card .ph{background:var(--surface-2); min-height:180px}
.blog-card .ph img{width:100%; height:100%; object-fit:cover; display:block}
.blog-card .b{padding-block:16px; padding-inline:6px 18px; display:grid; gap:8px; align-content:center}
.blog-card h3{margin:0; font-size:19px; line-height:1.65}
.blog-soon{border:1px dashed var(--line); border-radius:var(--r); padding:18px; display:grid; gap:6px; align-content:center; color:var(--ink-2); background:var(--surface)}
.blog-soon strong{color:var(--ink); font-family:var(--f-display); font-size:17px}

/* ---- ads ---- */
.ad-wrap{display:grid; justify-items:center; gap:4px; padding-block:12px; max-width:100%; overflow:hidden}
.ad-label{font-size:11px; color:var(--ink-2)}
.ad-wrap[data-shape="lb"] .ad-unit{width:728px; max-width:100%; min-height:90px}
.ad-wrap[data-shape="mpu"] .ad-unit{width:300px; min-height:250px}
.ad-wrap[data-shape="hp"] .ad-unit{width:300px; min-height:600px}
.ad-wrap[data-shape="lr"] .ad-unit{width:336px; max-width:100%; min-height:280px}
.ad-ph{display:grid; place-items:center; align-content:center; text-align:center; position:relative; max-width:100%; color:var(--ad-ink); font-size:13px; line-height:1.5; border:1.5px dashed var(--ad-line); border-radius:6px;
  background:repeating-linear-gradient(135deg,var(--ad-bg),var(--ad-bg) 10px,color-mix(in srgb,var(--ad-bg) 70%,var(--ad-line)) 10px,color-mix(in srgb,var(--ad-bg) 70%,var(--ad-line)) 11px)}
.ad-ph .tag{position:absolute; top:4px; inset-inline-start:8px; font-size:11px; opacity:.8}
.ad-ph b{font-size:14px}
.ad-wrap[data-shape="lb"] .ad-ph{width:728px; height:90px}
.ad-wrap[data-shape="mpu"] .ad-ph{width:300px; height:250px}
.ad-wrap[data-shape="hp"] .ad-ph{width:300px; height:600px}
.ad-wrap[data-shape="lr"] .ad-ph{width:336px; height:280px}
.ad-wrap[data-shape="anchor"] .ad-ph{width:320px; height:50px}
.anchor-bar{display:none}
.prose .ad-wrap{margin-block:8px}

/* ---- listing ---- */
.cat-hero{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:20px 22px; margin-top:18px; display:grid; gap:6px}
.crumbs{font-size:13.5px; color:var(--ink-2); display:flex; gap:8px; flex-wrap:wrap}
.crumbs a{text-decoration:none}
.cat-hero h1{margin:0; font-family:var(--f-display); font-size:30px; color:var(--cat,var(--teal)); font-weight:700}
.cat-hero h1 small{font-size:16px; color:var(--ink-2); font-family:var(--f-body)}
.cat-hero p{margin:0; color:var(--ink-2)}
.cat-tabs{display:flex; gap:8px; flex-wrap:wrap; margin-top:6px}
.cat-tabs a{font-size:14px; text-decoration:none; border:1px solid var(--line); border-radius:999px; padding:6px 12px; min-height:36px; display:inline-flex; align-items:center; background:var(--surface)}
.cat-tabs a[aria-current="page"]{background:var(--cat,var(--teal)); border-color:var(--cat,var(--teal)); color:#fff}
.grid-list{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:12px}
.grid-list:empty{display:none}
.pager{display:flex; gap:6px; justify-content:center; flex-wrap:wrap; margin-top:18px}
.pager .page-numbers{min-width:44px; min-height:44px; padding-inline:10px; display:grid; place-items:center; border:1px solid var(--line); border-radius:10px; background:var(--surface); text-decoration:none; font-variant-numeric:tabular-nums}
.pager .page-numbers.current{background:var(--teal); color:#fff; border-color:var(--teal)}
.pager .dots{border:0; background:transparent}

/* ---- article ---- */
.art{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:24px 28px; margin-top:18px}
.art .head{display:grid; grid-template-columns:auto 1fr; gap:18px; align-items:center; margin-top:10px}
.art .head .logo{width:96px; height:96px}
.art .head.no-img{grid-template-columns:1fr}
.art h1{font-size:30px; line-height:1.55; margin:0; text-wrap:balance; font-weight:700}
.art .byline{display:flex; flex-wrap:wrap; gap:8px 16px; align-items:center; font-size:14px; color:var(--ink-2); padding-block:12px 14px; border-bottom:1px solid var(--line); margin-top:12px}
.prose{max-width:68ch; font-size:18px; line-height:1.9; margin-top:18px}
.prose h2,.prose h3{font-family:var(--f-display); font-size:20px; color:var(--teal); margin:22px 0 6px; font-weight:700}
.prose p{margin:0 0 12px}
.prose ul,.prose ol{margin:0 0 12px; padding-inline-start:22px}
.prose img{height:auto; border-radius:var(--r-sm)}
.prose a{color:var(--teal); text-decoration:underline; text-underline-offset:3px}
.apply{display:flex; flex-wrap:wrap; gap:12px; align-items:center; background:var(--teal-soft); border:1px solid color-mix(in srgb,var(--teal) 30%,var(--line)); border-radius:var(--r); padding:16px 18px; margin:18px 0}
.apply .btn{display:inline-flex; align-items:center; gap:8px; background:var(--teal); color:#fff; text-decoration:none; font-weight:700; padding:12px 22px; border-radius:999px; min-height:48px}
.apply .btn:hover{color:#fff; filter:brightness(1.08)}
.apply small{color:var(--ink-2); font-size:13.5px}
.share{display:flex; gap:8px; flex-wrap:wrap; align-items:center; font-size:14px; color:var(--ink-2); margin-top:14px}
.share a,.share button{display:inline-flex; align-items:center; justify-content:center; min-width:44px; min-height:44px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--ink); text-decoration:none; font-size:13.5px; padding-inline:12px; cursor:pointer}
.prevnext{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:18px}
.prevnext a{display:grid; gap:4px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:12px 14px; text-decoration:none; font-weight:600; font-size:15px}
.prevnext small{color:var(--ink-2); font-weight:500}

/* plain pages (من نحن, سياسة…) and 404 rendered by GeneratePress */
.page .content-area,.error404 .content-area{max-width:860px; margin:24px auto; padding-inline:20px; float:none; width:auto}
.page .inside-article,.error404 .inside-article{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:24px 28px}
.page .entry-title{font-family:var(--f-display); color:var(--teal)}

/* ---- footer ---- */
.ksv-foot{margin-top:28px; background:var(--foot); color:var(--foot-ink); padding-block:28px 18px; font-size:15px}
.ksv-foot .fg{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:24px}
.ksv-foot h2{font-family:var(--f-display); font-size:17px; margin:0 0 8px; color:#fff; font-weight:700}
.ksv-foot p{margin:0; opacity:.85}
.ksv-foot ul{list-style:none; margin:0; padding:0; display:grid; gap:4px}
.ksv-foot a{text-decoration:none; color:var(--foot-ink)}
.ksv-foot a:hover{color:var(--gold)}
.ksv-foot .copy{border-top:1px solid #2C3D38; margin-top:18px; padding-top:12px; font-size:13px; color:#9FB3AD}
.site-footer:not(.ksv-foot){background:transparent}

/* Light mode only (owner decision 2026-10-06): the site always shows the brand's light look. */
:root{color-scheme:light}

/* ---- phone ---- */
@media (max-width: 760px){
  body{font-size:16.5px}
  .wrap{padding-inline:14px}
  .ksv-topbar nav{display:none}
  .ksv-masthead .wrap{padding-block:10px; gap:10px}
  .brand-mark{width:38px; height:38px; font-size:18px}
  .brand-name{font-size:21px; white-space:nowrap}
  .brand-logo img{height:42px}
  .about p{font-size:14.5px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
  .brand-tag{display:none}
  .ksv-search{display:none}
  .mh-actions .tg-btn span{display:none}
  .mh-actions .tg-btn{padding:0; width:44px; justify-content:center}
  .menu-btn{display:grid; place-items:center}
  .ksv-nav a{padding:10px 12px; font-size:15px}
  .ksv-nav.is-open ul{flex-direction:column}
  .ksv-search.is-open{display:flex; min-width:0; margin-block:8px}
  .about{grid-template-columns:1fr; padding:14px 16px}
  .about h1{font-size:19px}
  .about ul{display:none}
  .hero{grid-template-columns:1fr}
  .lead-art{min-height:150px; padding:18px}
  .lead-art .logo{width:96px; height:96px}
  .lead h2{font-size:21px}
  .lead p{-webkit-line-clamp:2}
  .quick{flex-wrap:nowrap; overflow-x:auto; padding-bottom:4px; scrollbar-width:none}
  .quick a{flex:none}
  .cols{grid-template-columns:1fr; gap:0}
  .aside-sticky{display:none}
  .rail{grid-template-columns:1fr}
  .rail .stack .card:nth-child(n+3){display:none}
  .card.big .logo{height:110px}
  .card.big .logo img{width:84px; height:84px}
  .card.big .logo.is-photo{height:180px}
  .card.big .logo.is-photo img{width:100%; height:100%}
  .lead-art .logo.is-photo{min-height:190px}
  .art .head .logo.is-photo{width:100%; height:auto; aspect-ratio:16/9}
  .card .logo{width:60px; height:60px}
  .ad-wrap[data-shape="lb"] .ad-unit,.ad-wrap[data-shape="lr"] .ad-unit{width:300px; min-height:250px}
  .ad-wrap[data-shape="lb"] .ad-ph,.ad-wrap[data-shape="lr"] .ad-ph{width:300px; height:250px}
  .follow{grid-template-columns:auto 1fr; padding:16px}
  .follow .tg-btn{grid-column:1/-1; justify-content:center}
  .mr li:nth-child(n+6){display:none}
  .blog-grid{grid-template-columns:1fr}
  .blog-card{grid-template-columns:1fr}
  .blog-card .ph{min-height:150px}
  .blog-card .b{padding:4px 16px 16px}
  .grid-list{grid-template-columns:1fr}
  .art{padding:16px}
  .art h1{font-size:22px}
  .art .head{grid-template-columns:1fr}
  .art .head .logo{width:72px; height:72px}
  .prose{font-size:17px}
  .facts{grid-template-columns:1fr 1fr}
  .prevnext{grid-template-columns:1fr}
  .ksv-foot .fg{grid-template-columns:1fr}
  .anchor-bar{display:flex; position:sticky; bottom:0; justify-content:center; background:var(--surface); border-top:1px solid var(--line); padding-block:6px calc(6px + env(safe-area-inset-bottom,0px)); z-index:30}
  .anchor-bar .ad-wrap{padding:0}
  .admin-bar .ksv-nav{top:0}
}
@media (min-width: 761px){ .ad-wrap[data-shape="anchor"]{display:none} }
