/*
Theme Name: Ahdath Alyawm
Theme URI: https://ahdathnews.net
Author: Trio Hub
Description: قالب أحداث اليوم — تصميم مخصّص بهوية الموقع: كحلي #243C78 وكهرماني #FCA80C. عربي RTL، بلا إطار خارجي ولا بانٍ صفحات.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: ahdath
*/

/* ═══════════════════════════════════════════════════════════
   الرموز — مشتقّة من شعار الموقع نفسه لا من لوحة عامة
   ═══════════════════════════════════════════════════════════ */
:root{
  --navy:#243C78;          /* ٥٦٪ من الشعار */
  --navy-deep:#182A57;
  --navy-lift:#31509A;
  --amber:#FCA80C;         /* ٣٤٪ من الشعار */
  --amber-deep:#E09000;
  --ink:#1B2033;
  --ink-2:#4A5268;
  --ink-3:#767E94;
  --paper:#F4F6FB;
  --card:#FFFFFF;
  --line:#E4E8F2;
  --shadow-sm:0 2px 6px rgba(24,42,87,.06), 0 1px 2px rgba(24,42,87,.04);
  --shadow-md:0 10px 24px rgba(24,42,87,.09), 0 3px 8px rgba(24,42,87,.05);
  --shadow-lg:0 22px 48px rgba(24,42,87,.16), 0 8px 16px rgba(24,42,87,.08);
  --r:14px;
  --r-sm:10px;
  --display:'Almarai','Segoe UI',Tahoma,sans-serif;
  --body:'Cairo','Segoe UI',Tahoma,sans-serif;
  --wrap:1220px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--body); font-size:16px; line-height:1.75;
  /* العربية لا تُتَرَّك — التباعد الحرفي يكسر الوصل */
  letter-spacing:normal;
}
h1,h2,h3,h4{font-family:var(--display); line-height:1.35; margin:0; font-weight:800; letter-spacing:normal}
p{margin:0}
a{color:inherit; text-decoration:none}
img{display:block; max-width:100%}
button{font:inherit; color:inherit; border:0; background:none; cursor:pointer}

/* أسطح المتصفّح — تُلوَّن من اللوحة لا تُترك افتراضية */
::selection{background:var(--amber); color:var(--navy-deep)}
:focus-visible{outline:3px solid var(--amber); outline-offset:3px; border-radius:6px}
html{scrollbar-color:var(--navy-lift) var(--paper); scrollbar-width:thin}
::-webkit-scrollbar{width:11px;height:11px}
::-webkit-scrollbar-track{background:var(--paper)}
::-webkit-scrollbar-thumb{background:var(--navy-lift); border-radius:99px; border:3px solid var(--paper)}
::-webkit-scrollbar-thumb:hover{background:var(--navy)}
input{caret-color:var(--amber)}

.wrap{max-width:var(--wrap); margin-inline:auto; padding-inline:24px}



/* ═══════════ الترويسة ═══════════ */
.util{background:var(--navy-deep); color:#A8B4D4; font-size:13px}
.util .wrap{display:flex; align-items:center; gap:18px; height:38px}
.util time{font-weight:600; color:#D3DBEE; white-space:nowrap}
.ticker{
  flex:1; display:flex; align-items:center; gap:10px;
  overflow:hidden; mask-image:linear-gradient(to left,#000 88%,transparent);
}
.ticker .flag{
  flex:none; display:inline-flex; align-items:center; gap:6px;
  background:var(--amber); color:var(--navy-deep);
  font-weight:700; font-size:12px; padding:3px 10px; border-radius:99px;
}
.ticker .flag i{width:6px;height:6px;border-radius:50%;background:var(--navy-deep);animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.25}}
.ticker p{white-space:nowrap; color:#CBD5EC}

.mast{
  background:
    radial-gradient(120% 180% at 88% -40%, var(--navy-lift) 0%, transparent 58%),
    linear-gradient(255deg, var(--navy) 0%, var(--navy-deep) 78%);
  border-end-start-radius:28px; border-end-end-radius:28px;
  /* الحشو السفلي يستوعب ارتفاع البطاقة المرفوعة (-46px) ويترك تحت الرقائق
     فسحة ٤٠px — قِيست، لا قُدّرت */
  padding-block:22px 86px; color:#fff;
}
.mast-row{display:flex; align-items:center; gap:28px}
.brand{display:flex; align-items:center; gap:12px; flex:none}
.brand img{height:42px; width:auto}
.search{
  flex:1; max-width:440px; position:relative;
  display:flex; align-items:center;
}
.search svg{position:absolute; inset-inline-start:16px; color:var(--ink-3)}
.search input{
  width:100%; height:46px; border-radius:99px; border:0;
  background:#fff; color:var(--ink);
  padding-inline:46px 18px; font-family:var(--body); font-size:15px;
  box-shadow:var(--shadow-sm);
}
.search input::placeholder{color:var(--ink-3)}
.mast-actions{margin-inline-start:auto; display:flex; align-items:center; gap:10px}
.ghost{
  display:inline-flex; align-items:center; gap:8px;
  height:42px; padding-inline:18px; border-radius:99px;
  background:rgba(255,255,255,.12); color:#fff; font-weight:600; font-size:14px;
  transition:background .18s;
}
.ghost:hover{background:rgba(255,255,255,.2)}
.solid{
  display:inline-flex; align-items:center; gap:8px;
  height:42px; padding-inline:20px; border-radius:99px;
  background:var(--amber); color:var(--navy-deep); font-weight:700; font-size:14px;
  transition:transform .18s, box-shadow .18s, background .18s;
}
.solid:hover{background:var(--amber-deep); transform:translateY(-1px); box-shadow:0 8px 18px rgba(252,168,12,.35)}

.chips{display:flex; gap:8px; margin-block-start:22px; flex-wrap:wrap; justify-content:center}
.chip{
  padding:8px 18px; border-radius:99px; font-size:14px; font-weight:600;
  color:#C7D0E8; background:rgba(255,255,255,.08); transition:all .18s;
}
.chip:hover{background:rgba(255,255,255,.16); color:#fff}
.chip[aria-current=page]{background:#fff; color:var(--navy)}

/* ═══════════ الصدر ═══════════ */
.lead{display:grid; grid-template-columns:1.55fr 1fr; gap:22px; margin-block-start:-46px; position:relative; z-index:2}

.hero{
  position:relative; border-radius:20px; overflow:hidden;
  box-shadow:var(--shadow-lg); min-height:428px; display:flex;
  transition:transform .3s cubic-bezier(.16,1,.3,1);
}
.hero:hover{transform:translateY(-3px)}
.hero img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.hero::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(15,26,55,.95) 4%, rgba(15,26,55,.72) 34%, rgba(15,26,55,.06) 72%);
}
.hero-txt{position:relative; z-index:1; margin-block-start:auto; padding:30px 32px 32px; color:#fff}
.hero h2{font-size:33px; line-height:1.32; text-wrap:balance; max-width:28ch}
.hero .meta{display:flex; align-items:center; gap:14px; margin-block-start:14px; font-size:13.5px; color:#C6D0E8}

.badge{
  display:inline-flex; align-items:center; gap:7px;
  background:var(--amber); color:var(--navy-deep);
  font-weight:700; font-size:12.5px; padding:5px 13px; border-radius:99px;
  margin-block-end:14px;
  /* داخل عمود مرن يتمدّد الابن على كامل العرض افتراضياً، فتصير الشارة
     شريطاً فارغاً بجانب كلمتها. align-self يجعلها تحتضن نصّها. */
  align-self:flex-start;
}
.badge.quiet{background:rgba(255,255,255,.16); color:#fff}

.side{display:flex; flex-direction:column; gap:14px}
.mini{
  display:flex; gap:14px; background:var(--card); border-radius:var(--r);
  padding:12px; box-shadow:var(--shadow-sm); flex:1;
  transition:box-shadow .22s, transform .22s;
}
.mini:hover{box-shadow:var(--shadow-md); transform:translateY(-2px)}
.mini img{width:104px; height:88px; border-radius:var(--r-sm); object-fit:cover; flex:none}
.mini h3{font-size:15.5px; line-height:1.5; font-weight:700}
.mini .meta{margin-block-start:auto; font-size:12.5px; color:var(--ink-3); display:flex; gap:10px; align-items:center}
.mini .body{display:flex; flex-direction:column; min-width:0; padding-block:2px}

/* ═══════════ الأقسام ═══════════ */
section{margin-block-start:52px}
.head{display:flex; align-items:center; gap:16px; margin-block-end:20px}
.head h2{font-size:23px}
.head .rule{flex:1; height:2px; background:var(--line); border-radius:2px}
.head .more{font-size:14px; font-weight:600; color:var(--navy); display:inline-flex; gap:6px; align-items:center}
.head .more:hover{color:var(--amber-deep)}
.head::before{content:''; width:5px; height:23px; border-radius:99px; background:var(--amber); flex:none}

.grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px}
.card{
  background:var(--card); border-radius:var(--r); overflow:hidden;
  box-shadow:var(--shadow-sm); display:flex; flex-direction:column;
  transition:box-shadow .22s, transform .22s;
}
.card:hover{box-shadow:var(--shadow-md); transform:translateY(-3px)}
.card .thumb{position:relative; aspect-ratio:16/10; overflow:hidden}
.card .thumb img{width:100%; height:100%; object-fit:cover; transition:transform .5s cubic-bezier(.16,1,.3,1)}
.card:hover .thumb img{transform:scale(1.04)}
.card .thumb .tag{
  position:absolute; inset-block-start:12px; inset-inline-start:12px;
  background:rgba(24,42,87,.86); color:#fff; backdrop-filter:blur(6px);
  font-size:12px; font-weight:600; padding:4px 11px; border-radius:99px;
}
.card .body{padding:16px 18px 18px; display:flex; flex-direction:column; flex:1}
.card h3{font-size:17px; line-height:1.5; font-weight:700}
.card p{margin-block-start:9px; font-size:14.5px; color:var(--ink-2); line-height:1.7}
.card .meta{
  margin-block-start:auto; padding-block-start:14px; display:flex; align-items:center; gap:10px;
  font-size:12.5px; color:var(--ink-3);
}
.dot{width:3px;height:3px;border-radius:50%;background:currentColor;flex:none}

/* حقل كحلي — يكسر إيقاع البطاقات البيضاء بدل تكرارها */
.field{
  background:
    radial-gradient(90% 140% at 92% 0%, var(--navy-lift) 0%, transparent 55%),
    linear-gradient(250deg, var(--navy) 0%, var(--navy-deep) 80%);
  border-radius:24px; padding:38px 34px 40px; color:#fff; margin-block-start:52px;
}
.field .head h2{color:#fff}
.field .head .rule{background:rgba(255,255,255,.18)}
.field .head .more{color:var(--amber)}
.field-grid{display:grid; grid-template-columns:1fr 1fr; gap:20px}
.report{
  display:flex; gap:18px; background:rgba(255,255,255,.08);
  border-radius:var(--r); padding:16px; transition:background .22s;
}
.report:hover{background:rgba(255,255,255,.14)}
.report img{width:132px; height:112px; border-radius:var(--r-sm); object-fit:cover; flex:none}
.report h3{font-size:17px; line-height:1.5; color:#fff; font-weight:700}
.report .meta{margin-block-start:auto; font-size:12.5px; color:#B6C2E0; display:flex; gap:9px; align-items:center}
.report .body{display:flex; flex-direction:column; min-width:0}

/* ═══════════ التذييل ═══════════ */

footer{margin-block-start:64px; background:var(--navy-deep); color:#A8B4D4; padding-block:44px 26px}
/* auto-fit لا أعمدة ثابتة: الأعمدة تبقى جنب بعضها ما دام العرض يتّسع،
   ولا تنهار فوق بعضها لمجرّد عبور نقطة توقّف. */
.foot-grid{display:grid; grid-template-columns:minmax(220px,1.6fr) repeat(auto-fit,minmax(130px,1fr)); gap:30px}
footer h4{color:#fff; font-size:15px; margin-block-end:14px; font-weight:700}
footer p{font-size:14px; line-height:1.85}
footer ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:9px; font-size:14px}
footer li a:hover{color:var(--amber)}
.foot-base{
  margin-block-start:32px; padding-block-start:20px; border-block-start:1px solid rgba(255,255,255,.1);
  display:flex; justify-content:space-between; gap:16px; font-size:13px; flex-wrap:wrap;
}

/* ═══════════ صفحة المقال ═══════════ */
/* رأس الصفحة موسَّط ليتناسق مع صفّ الرقائق الموسَّط في الرئيسية.
   التوسيط يقف عند الرأس: متن المقال يبقى بمحاذاة اليمين لأن نصّ القراءة
   الموسَّط يجبر العين على البحث عن بداية كل سطر. */
.crumb{display:flex; align-items:center; justify-content:center; gap:9px; font-size:13.5px; color:#B6C2E0; margin-block-end:18px}
.crumb a:hover{color:#fff}
.art-head{max-width:820px; margin-inline:auto; text-align:center}
.art-head h1{font-size:38px; line-height:1.32; color:#fff; text-wrap:balance}
.art-head .badge{margin-inline:auto}
.byline{display:flex; align-items:center; justify-content:center; gap:12px; margin-block-start:22px; text-align:start}
.avatar{
  width:44px;height:44px;border-radius:50%; flex:none;
  background:var(--amber); color:var(--navy-deep);
  display:grid; place-items:center; font-family:var(--display); font-weight:800; font-size:19px;
}
.byline .who{font-size:15px; font-weight:700; color:#fff}
.byline .when{font-size:13px; color:#B6C2E0; display:flex; align-items:center; gap:9px; margin-block-start:2px}

.art-wrap{display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:38px; margin-block-start:-52px; position:relative; z-index:2}
.art-body{background:var(--card); border-radius:20px; box-shadow:var(--shadow-lg); overflow:hidden}
.art-body > figure{margin:0}
.art-body > figure img{width:100%; aspect-ratio:16/9; object-fit:cover}
.art-body > figure figcaption{padding:11px 34px 0; font-size:13px; color:var(--ink-3)}
/* ٧٨ محرفاً لا ٧٠: الحرف العربي أعرض من اللاتيني، و٧٠ تعطي سطراً قصيراً
   قياسه ٣٢em — قِسنا فوجدناه ٥٥٩px، والمريح للقراءة ٣٦–٤٠em. */
.prose{padding:26px 34px 38px; max-width:78ch}
.prose p{font-size:17.5px; line-height:1.95; color:var(--ink-2); margin-block-end:20px}
/* لا حرف استهلالي كبير في العربية: الخطّ متّصل، وانتزاع الحرف الأول
   من «قضت» يتركها «ضت» ويكسر الكلمة. زخرفة لاتينية لا تُنقل كما هي. */
.prose h2{font-size:22px; margin-block:34px 14px; color:var(--ink)}
.quote{
  margin:30px 0; padding:22px 26px; border-radius:var(--r);
  background:var(--paper);
  font-family:var(--display); font-weight:700; font-size:19px; line-height:1.75; color:var(--navy);
}
.disclosure{
  margin-block-start:30px; padding:15px 18px; border-radius:var(--r-sm);
  background:#FFF7E6; color:#7A5B12; font-size:14px; line-height:1.7;
}
.aside{display:flex; flex-direction:column; gap:18px; align-self:start; position:sticky; inset-block-start:20px}
.panel{background:var(--card); border-radius:var(--r); box-shadow:var(--shadow-sm); padding:20px}
.panel h4{font-size:16px; margin-block-end:14px; display:flex; align-items:center; gap:9px}
.panel h4::before{content:''; width:4px;height:17px;border-radius:99px;background:var(--amber)}
.rel{display:flex; gap:12px; padding-block:12px; border-block-end:1px solid var(--line)}
.rel:last-child{border-block-end:0; padding-block-end:0}
.rel img{width:74px;height:60px;border-radius:9px;object-fit:cover;flex:none}
.rel h5{font-size:14px; line-height:1.55; margin:0; font-family:var(--display); font-weight:700}
.rel span{font-size:12px; color:var(--ink-3)}

/* ═══════════ صفحة القسم ═══════════ */
.sec-head{color:#fff; text-align:center}
.sec-head h1{font-size:36px}
.sec-head p{margin-block-start:10px; color:#C0CBE6; font-size:16px; max-width:56ch; margin-inline:auto}
.count{
  display:inline-flex; align-items:baseline; gap:7px; margin-block-start:16px;
  background:rgba(255,255,255,.12); border-radius:99px; padding:7px 16px; font-size:14px;
}
.count b{font-family:var(--display); font-size:19px; color:var(--amber)}

.rows{display:flex; flex-direction:column; gap:16px}
.row{
  display:flex; gap:20px; background:var(--card); border-radius:var(--r);
  padding:16px; box-shadow:var(--shadow-sm);
  transition:box-shadow .22s, transform .22s;
}
.row:hover{box-shadow:var(--shadow-md); transform:translateY(-2px)}
.row img{width:232px; aspect-ratio:16/10; border-radius:var(--r-sm); object-fit:cover; flex:none}
.row .body{display:flex; flex-direction:column; min-width:0; padding-block:4px}
.row h3{font-size:19px; line-height:1.45}
.row p{margin-block-start:10px; font-size:15px; color:var(--ink-2); line-height:1.75}
.row .meta{margin-block-start:auto; padding-block-start:14px; display:flex; align-items:center; gap:11px; font-size:13px; color:var(--ink-3)}

.pager{display:flex; justify-content:center; align-items:center; gap:8px; margin-block-start:34px}
.pager a,.pager span{
  min-width:42px; height:42px; border-radius:12px; display:grid; place-items:center;
  background:var(--card); box-shadow:var(--shadow-sm); font-weight:600; font-size:15px;
  transition:all .18s;
}
.pager a:hover{background:var(--navy); color:#fff}
.pager [aria-current=page]{background:var(--navy); color:#fff}

/* ═══════════ الظهور عند التمرير — لحظة واحدة مؤلّفة ═══════════
   المحتوى مرئي افتراضياً. الإخفاء لا يقع إلا بعد أن يعلن الجافاسكربت
   عن نفسه بـ.js — فتعثّره يترك الصفحة مقروءة لا فارغة. */
.js .rise{opacity:0; transform:translateY(18px); transition:opacity .62s cubic-bezier(.16,1,.3,1), transform .62s cubic-bezier(.16,1,.3,1)}
.js .rise.in{opacity:1; transform:none}
@media (prefers-reduced-motion:reduce){
  .js .rise{opacity:1; transform:none; transition:none}
  *{animation-duration:.001ms !important; transition-duration:.001ms !important}
}

/* ═══════════ الاستجابة ═══════════
   القاعدة هنا: لا يُكدَّس عمودان فوق بعضهما ما دام العرض يتّسع لهما جنباً
   إلى جنب. الانهيار المبكّر يفكّك التصميم على شاشة لا تحتاج تفكيكاً. */
@media (max-width:1080px){
  .lead{grid-template-columns:1fr}
  /* المواد الثلاث تصطفّ جنباً إلى جنب بدل ثلاثة أشرطة عريضة فارغة */
  .side{flex-direction:row}
  .side .mini{flex-direction:column; gap:10px; flex:1 1 0; min-width:0}
  .side .mini img{width:100%; height:126px}
  .art-wrap{grid-template-columns:minmax(0,1fr) 280px}
}
@media (max-width:900px){
  .field-grid{grid-template-columns:1fr}
  .art-wrap{grid-template-columns:1fr}
  .aside{position:static}
}
@media (max-width:820px){
  .grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:640px){
  .wrap{padding-inline:16px}
  .mast-row{flex-wrap:wrap; gap:14px}
  .search{order:3; max-width:none; flex-basis:100%}
  .mast-actions{margin-inline-start:auto}
  .hero{min-height:340px}
  .hero h2{font-size:24px}
  .art-head h1{font-size:27px}
  .sec-head h1{font-size:27px}
  .prose{padding:22px 20px 30px}
  .art-body > figure figcaption{padding-inline:20px}
  .util .wrap{gap:12px}
  .ticker p{font-size:12.5px}
  
}
@media (max-width:520px){
  .grid{grid-template-columns:1fr}
  .row{flex-direction:column}
  .row img{width:100%}
  /* على شاشة الهاتف وحدها تعود المواد الثلاث صفّاً تحت بعضها */
  .side{flex-direction:column}
  .side .mini{flex-direction:row; gap:14px}
  .side .mini img{width:96px; height:82px}
}

/* ═══════════════════════════════════════════════════════════
   ما يولّده ووردبريس — لا يُترك بأنماط المتصفّح الافتراضية
   ═══════════════════════════════════════════════════════════ */

/* رابط التخطّي: مرئي للوحة المفاتيح وحدها */
.skip{
  position:absolute; inset-block-start:-100px; inset-inline-start:16px; z-index:99;
  background:var(--amber); color:var(--navy-deep); font-weight:700;
  padding:12px 20px; border-radius:0 0 var(--r-sm) var(--r-sm); transition:inset-block-start .18s;
}
.skip:focus{inset-block-start:0}

.brand img{height:42px; width:auto; filter:brightness(0) invert(1)}
.brand-text{font-family:var(--display); font-weight:800; font-size:22px; color:#fff}
.foot-logo{height:40px; width:auto; filter:brightness(0) invert(1); margin-block-end:14px}

/* الصدر رابط كامل المساحة بدل لفّ الصورة والنصّ في وسم واحد */
.hero-link{position:absolute; inset:0; z-index:2}
.hero-txt{pointer-events:none}
.hero-txt a{pointer-events:auto}

/* بديل الصورة الغائبة — حالة نادرة لأن الموقع لا ينشر خبراً بلا صورة */
.thumb-empty{
  display:block; width:100%; height:100%;
  background:linear-gradient(140deg, var(--navy-lift), var(--navy-deep));
}
.mini .thumb-empty{width:104px; height:88px; border-radius:var(--r-sm); flex:none}
.row .thumb-empty{width:232px; aspect-ratio:16/10; border-radius:var(--r-sm); flex:none}

/* متن المقال كما يخرجه المحرّر */
.prose ul,.prose ol{margin-block:0 20px; padding-inline-start:24px; font-size:17.5px; line-height:1.95; color:var(--ink-2)}
.prose li{margin-block-end:8px}
.prose a{color:var(--navy); text-decoration:underline; text-underline-offset:4px; text-decoration-thickness:1.5px}
.prose a:hover{color:var(--amber-deep)}
.prose blockquote{
  margin:30px 0; padding:22px 26px; border-radius:var(--r); background:var(--paper);
  font-family:var(--display); font-weight:700; font-size:19px; line-height:1.75; color:var(--navy);
}
.prose blockquote p{margin:0; font-size:inherit; line-height:inherit; color:inherit}
.prose figure{margin:26px 0}
.prose img{border-radius:var(--r-sm); height:auto}
.prose figcaption{margin-block-start:9px; font-size:13px; color:var(--ink-3)}
.prose em{color:var(--ink-3)}
.prose h3{font-size:19px; margin-block:28px 12px}

/* الترقيم كما يخرجه paginate_links */
.page-numbers{list-style:none; display:flex; justify-content:center; align-items:center; gap:8px; margin:34px 0 0; padding:0}
.page-numbers li{display:flex}
.page-numbers a,.page-numbers span{
  min-width:42px; height:42px; padding-inline:12px; border-radius:12px;
  display:grid; place-items:center; background:var(--card); box-shadow:var(--shadow-sm);
  font-weight:600; font-size:15px; color:var(--ink); transition:background .18s, color .18s;
}
.page-numbers a:hover{background:var(--navy); color:#fff}
.page-numbers .current{background:var(--navy); color:#fff}

/* الحالات الفارغة و404 */
.empty{
  background:var(--card); border-radius:20px; box-shadow:var(--shadow-md);
  padding:54px 34px; text-align:center; margin-block-start:8px;
}
.empty h2{font-size:24px}
.empty p{margin-block-start:12px; color:var(--ink-2)}
.empty a{color:var(--navy); text-decoration:underline; text-underline-offset:4px}

/* قوائم التذييل حين تأتي من قوائم ووردبريس */
footer .menu{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:9px; font-size:14px}
footer .menu a:hover{color:var(--amber)}

.ticker p a{color:inherit}
.ticker p a:hover{color:#fff}

/* ═══════════════════════════════════════════════════════════
   شريط العاجل المتحرّك
   ═══════════════════════════════════════════════════════════ */
.ticker-view{flex:1; overflow:hidden; min-width:0; mask-image:linear-gradient(to left,#000 90%,transparent)}
.ticker-track{
  display:flex; align-items:center; gap:0; width:max-content;
  animation:ticker 46s linear infinite;
}
.ticker-track a{white-space:nowrap; color:#CBD5EC; transition:color .18s}
.ticker-track a:hover{color:#fff}
.ticker .sep{
  flex:none; width:5px; height:5px; border-radius:50%;
  background:rgba(255,255,255,.3); margin-inline:18px;
}
/* المسار نسختان متطابقتان، فإزاحته نصفَ عرضه تعيده إلى نقطة البداية
   بلا قفزة مرئية. الاتجاه موجب لأن الصفحة RTL. */
@keyframes ticker{from{transform:translateX(0)} to{transform:translateX(50%)}}
.ticker:hover .ticker-track{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){.ticker-track{animation:none}}

/* ═══════════════════════════════════════════════════════════
   أقسام الرئيسية الإضافية
   ═══════════════════════════════════════════════════════════ */

/* قسم مقسوم: مادة كبيرة وثلاث مضغوطة بجانبها */
.split{display:grid; grid-template-columns:1.15fr 1fr; gap:20px; align-items:start}
.split .feature .thumb{aspect-ratio:16/9}
.split .feature h3{font-size:21px}
.split .feature p{font-size:15px}
.stack{display:flex; flex-direction:column; gap:14px}
.stack .mini{flex:none}

/* قائمة مضغوطة بعمودين */
.compact{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.line{
  display:flex; gap:14px; background:var(--card); border-radius:var(--r);
  padding:12px; box-shadow:var(--shadow-sm);
  transition:box-shadow .22s, transform .22s;
}
.line:hover{box-shadow:var(--shadow-md); transform:translateY(-2px)}
.line img,.line .thumb-empty{width:92px; height:78px; border-radius:var(--r-sm); object-fit:cover; flex:none}
.line .body{display:flex; flex-direction:column; min-width:0; padding-block:2px}
.line h3{font-size:15.5px; line-height:1.5; font-weight:700}
.line .meta{margin-block-start:auto; padding-block-start:8px; display:flex; align-items:center; gap:9px; font-size:12.5px; color:var(--ink-3)}

/* ═══════════════════════════════════════════════════════════
   التذييل — ثلاثة أعمدة ثابتة لا شبكة تلتفّ بلا ترتيب
   ═══════════════════════════════════════════════════════════ */
.foot-grid{display:grid; grid-template-columns:1.7fr 1fr 1fr; gap:40px}
.foot-brand p{max-width:46ch}
.foot-rss{
  display:inline-flex; align-items:center; gap:8px; margin-block-start:16px;
  background:rgba(255,255,255,.1); color:#D3DBEE;
  padding:8px 16px; border-radius:99px; font-size:13.5px; font-weight:600;
  transition:background .18s, color .18s;
}
.foot-rss:hover{background:rgba(255,255,255,.18); color:#fff}

@media (max-width:900px){
  .split{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1.4fr 1fr 1fr; gap:28px}
}
@media (max-width:640px){
  .compact{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr 1fr; gap:26px}
  .foot-brand{grid-column:1 / -1}
}
