@font-face { font-family: 'Plex Arabic EP'; src: url('fonts/plex-arabic-400.woff2') format('woff2'); font-weight: 400; font-display: swap; unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200F, U+25CC; }
@font-face { font-family: 'Plex Arabic EP'; src: url('fonts/plex-arabic-700.woff2') format('woff2'); font-weight: 700; font-display: swap; unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF, U+200C-200F, U+25CC; }
@font-face { font-family: 'Plex Arabic EP'; src: url('fonts/plex-latin-400.woff2') format('woff2'); font-weight: 400; font-display: swap; unicode-range: U+0000-00FF, U+2000-206F, U+2190-2193, U+2212; }
@font-face { font-family: 'Plex Arabic EP'; src: url('fonts/plex-latin-700.woff2') format('woff2'); font-weight: 700; font-display: swap; unicode-range: U+0000-00FF, U+2000-206F, U+2190-2193, U+2212; }

.ep-body { margin: 0; min-height: 100vh; color: #eef2fb; font-family: 'Plex Arabic EP', 'Segoe UI', Tahoma, sans-serif; -webkit-font-smoothing: antialiased;
  background: radial-gradient(1200px 600px at 70% -10%, rgba(120,90,255,.18), transparent 60%), radial-gradient(900px 500px at 10% 110%, rgba(210,115,74,.10), transparent 60%), #05070d; }
.ep-body *, .ep-body *::before, .ep-body *::after { box-sizing: border-box; }
.ep-body a { color: #c3b8ff; }
.ep-hero { max-width: 1320px; margin: 0 auto; padding: 42px 22px 18px; }
.ep-brand { font-size: .82rem; color: #97a3bd; }
.ep-brand a { text-decoration: none; }
.ep-hero h1 { margin: 10px 0 8px; font-size: clamp(1.8rem, 4.2vw, 2.8rem); font-weight: 700; line-height: 1.25; }
.ep-hero h1 span { display: block; text-align: right; font-size: .5em; font-weight: 400; color: #9d8cff; letter-spacing: .04em; direction: ltr; unicode-bidi: isolate; }
.ep-hero p { margin: 0; max-width: 720px; color: #b7c0d6; line-height: 1.9; font-size: 1rem; }
.ep-grid { max-width: 1320px; margin: 0 auto; padding: 14px 22px 10px; display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 22px; }
.ep-card { display: flex; flex-direction: column; text-decoration: none; color: inherit; border-radius: 18px; overflow: hidden; background: rgba(20,26,44,.72); border: 1px solid rgba(148,163,220,.18); transition: transform .25s, border-color .25s, box-shadow .25s; }
.ep-card:hover, .ep-card:focus-visible { transform: translateY(-4px); border-color: rgba(157,140,255,.7); box-shadow: 0 16px 50px rgba(110,90,255,.22); outline: none; }
.ep-img { aspect-ratio: 16 / 9; overflow: hidden; background: #0a0c18; }
.ep-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s; }
.ep-card:hover .ep-img img { transform: scale(1.035); }
.ep-body2 { padding: 16px 18px 18px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.ep-tag { font-size: .72rem; color: #9d8cff; }
.ep-body2 h2 { margin: 0; font-size: 1.25rem; }
.ep-body2 h2 span { font-size: .62em; color: #97a3bd; font-weight: 400; margin-inline-start: 6px; direction: ltr; unicode-bidi: isolate; }
.ep-body2 p { margin: 0; color: #b7c0d6; font-size: .9rem; line-height: 1.85; }
.ep-chips { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.ep-chips li { font-size: .72rem; padding: 3px 10px; border-radius: 20px; background: rgba(122,102,255,.14); color: #d6cfff; border: 1px solid rgba(157,140,255,.25); }
.ep-go { margin-top: auto; align-self: flex-start; padding: 8px 16px; border-radius: 10px; background: linear-gradient(135deg, #6c5cf0, #4f46e5); color: #fff; font-weight: 700; font-size: .85rem; }
.ep-note { max-width: 1320px; margin: 8px auto 0; padding: 0 22px; font-size: .8rem; color: #8792ab; }
.ep-foot { text-align: center; font-size: .78rem; color: #6b7690; padding: 26px 0 30px; }
@media (prefers-reduced-motion: reduce) { .ep-card, .ep-img img { transition: none; } }

.ep-flowhost { max-width: 1320px; margin: 0 auto; padding: 0 22px; }