/* ════════════════════════════════════════════════════════════════════
 * pub-home.css — «اعمل معنا» في الرئيسيّة (`sections/pubpages.php`) · الخيار ب
 * ════════════════════════════════════════════════════════════════════
 * 🔑 **ورقةٌ صغيرةٌ تُحمَّل حين تُفتح إحدى الصفحتين وحدَها** (`$PAGE_CSS` في `index.php`) —
 *    لا تُضاف إلى `site.css` (فوق الألف) فتُحمَّل في كلِّ زيارةٍ لقسمٍ قد لا يظهر.
 * ════════════════════════════════════════════════════════════════════ */
.pubx { text-align: center; }
.pubx__h { font-size: clamp(1.6rem, 4vw, 2.3rem); margin-bottom: 28px; }
.pubx__grid { display: grid; gap: 18px; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); max-width: 1100px; margin: 0 auto; text-align: start; }
.pubx__grid--one { max-width: 620px; }
.pubx__card { display: flex; flex-direction: column; gap: 10px; padding: 28px 26px; border-radius: var(--vmp-radius);
              color: var(--vmp-white); text-decoration: none; transition: transform var(--vmp-transition), border-color var(--vmp-transition);
              background: linear-gradient(135deg, rgba(255, 78, 0, 0.14), rgba(255, 119, 0, 0.02)); border: 1px solid rgba(255, 78, 0, 0.4); }
.pubx__card:hover, .pubx__card:focus-visible { transform: translateY(-3px); border-color: var(--vmp-orange); }
.pubx__card:focus-visible { outline: 2px solid var(--vmp-orange); outline-offset: 3px; }
.pubx__k { color: var(--vmp-orange-light); font-size: 0.9rem; font-weight: 700; }
.pubx__card strong { font-size: 1.3rem; line-height: 1.6; }
.pubx__t { color: rgba(255, 255, 255, 0.75); line-height: 1.9; }
.pubx__go { margin-top: auto; padding-top: 6px; color: var(--vmp-orange-light); font-weight: 700; }
@media (prefers-reduced-motion: reduce) {
    .pubx__card { transition: none; }
    .pubx__card:hover { transform: none; }
}