/* ═══════════════════════════════════════════════════════
   Natiga Portal — Design System v2
   ═══════════════════════════════════════════════════════ */
:root {
    --np-bg: #edf1f7;
    --np-bg-2: #e2e8f0;
    --np-surface: #ffffff;
    --np-surface-2: #f8fafc;
    --np-text: #0f172a;
    --np-text-2: #334155;
    --np-muted: #64748b;
    --np-brand: #0a2540;
    --np-brand-mid: #134e7a;
    --np-brand-light: #1a6fb5;
    --np-accent: #c8922a;
    --np-accent-soft: #fef3c7;
    --np-live: #059669;
    --np-live-soft: #d1fae5;
    --np-danger: #dc2626;
    --np-danger-soft: #fef2f2;
    --np-border: #d8e0ea;
    --np-radius: 18px;
    --np-radius-sm: 12px;
    --np-shadow: 0 4px 24px rgba(10, 37, 64, 0.08);
    --np-shadow-lg: 0 20px 50px rgba(10, 37, 64, 0.12);
    --np-font: "Cairo", "Tajawal", system-ui, sans-serif;
    --np-max: 1140px;
    --np-gutter: clamp(14px, 3.5vw, 22px);
    --np-header-h: 68px;
    --np-text-3: #64748b;
}

*, *::before, *::after { box-sizing: border-box; }
html {
    scroll-behavior: smooth;
    direction: rtl;
    text-align: right;
    background: var(--np-bg);
    overflow-x: clip;
    width: 100%;
    max-width: 100%;
}
html[dir="rtl"] {
    direction: rtl;
}
body.natiga-portal {
    margin: 0;
    font-family: var(--np-font);
    background: var(--np-bg);
    color: var(--np-text);
    line-height: 1.75;
    min-height: 100vh;
    min-height: 100dvh;
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
    display: flex;
    flex-direction: column;
    direction: rtl;
    text-align: right;
    -webkit-font-smoothing: antialiased;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}
a { color: var(--np-brand-light); text-decoration: none; transition: color .15s; }
a:hover { color: var(--np-brand-mid); }
img { max-width: 100%; height: auto; }
.sr-only {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

.np-wrap {
    width: 100%;
    max-width: var(--np-max);
    margin-inline: auto;
    padding-inline: max(var(--np-gutter), env(safe-area-inset-right, 0px)) max(var(--np-gutter), env(safe-area-inset-left, 0px));
    box-sizing: border-box;
}
.np-skip {
    position: absolute; inset-inline-start: -9999px; top: 0;
    background: var(--np-brand); color: #fff; padding: 8px 14px; z-index: 999;
}
.np-skip:focus { inset-inline-start: 12px; }

/* ── Top bar ── */
.np-topbar {
    background: var(--np-brand);
    color: rgba(255,255,255,.88);
    font-size: .82rem;
    text-align: center;
    padding: 7px 16px;
}
.np-topbar b { color: var(--np-accent-soft); font-weight: 700; }

/* ── Header ── */
.np-header {
    background: var(--np-surface);
    border-bottom: 1px solid var(--np-border);
    position: sticky;
    top: 0;
    z-index: 100;
    box-shadow: 0 1px 0 rgba(10,37,64,.04);
}
.np-header-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    height: var(--np-header-h);
}
.np-logo {
    display: flex;
    align-items: center;
    gap: 11px;
    color: var(--np-brand);
    font-weight: 800;
    font-size: 1.05rem;
    text-decoration: none;
}
.np-logo:hover { text-decoration: none; opacity: .92; }
.np-logo-icon {
    width: 44px; height: 44px;
    border-radius: 14px;
    background: linear-gradient(135deg, var(--np-brand) 0%, var(--np-brand-light) 100%);
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 1.15rem;
    box-shadow: 0 4px 12px rgba(10,37,64,.2);
}
.np-menu-btn {
    display: none;
    background: var(--np-bg);
    border: 1px solid var(--np-border);
    color: var(--np-brand);
    width: 42px; height: 42px;
    border-radius: var(--np-radius-sm);
    cursor: pointer;
    font-size: 1.1rem;
}
.np-nav { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.np-nav a {
    color: var(--np-text-2);
    font-weight: 600;
    font-size: .88rem;
    padding: 8px 14px;
    border-radius: 999px;
    text-decoration: none;
    transition: background .15s, color .15s;
}
.np-nav a:hover { background: var(--np-bg); color: var(--np-brand); text-decoration: none; }
.np-nav-cta {
    background: linear-gradient(135deg, var(--np-brand) 0%, var(--np-brand-mid) 100%) !important;
    color: #fff !important;
    box-shadow: 0 4px 14px rgba(10,37,64,.2);
}
.np-nav-cta:hover { filter: brightness(1.08); background: var(--np-brand) !important; }

/* ── Hero ── */
.np-hero {
    position: relative;
    padding: 56px 0 64px;
    background: linear-gradient(160deg, var(--np-brand) 0%, #0d3d6b 45%, #1565a8 100%);
    color: #fff;
    overflow: hidden;
}
.np-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 15% 80%, rgba(200,146,42,.18) 0%, transparent 45%),
        radial-gradient(circle at 85% 20%, rgba(255,255,255,.08) 0%, transparent 40%);
    pointer-events: none;
}
.np-hero::after {
    content: "";
    position: absolute;
    inset-inline: 0;
    bottom: 0;
    height: 32px;
    background: linear-gradient(to bottom, transparent 0%, var(--np-bg) 100%);
    clip-path: none;
    pointer-events: none;
}
.np-hero .np-wrap { position: relative; z-index: 1; }
/* صفحات المحافظات والمراحل — بدون موجة جانبية (كانت تظهر فراغاً فاتحاً يمين/شمال) */
.np-hero--level::after,
.np-hero--gov::after,
.np-hero--rich::after,
.np-hero--diploma::after,
.np-hero--thanwya::after,
.np-hero--primary::after {
    display: none;
}
.np-hero--gov { padding-bottom: 72px; }
.np-hero--level {
    padding-bottom: clamp(60px, 9vw, 88px);
}

.np-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.2);
    backdrop-filter: blur(8px);
    padding: 6px 14px;
    border-radius: 999px;
    font-size: .82rem;
    font-weight: 600;
    margin-bottom: 16px;
}
.np-tag i { color: var(--np-accent-soft); }

.np-hero h1 {
    margin: 0 0 14px;
    font-size: clamp(1.55rem, 4vw, 2.35rem);
    font-weight: 800;
    line-height: 1.35;
    max-width: 720px;
}
.np-hero p {
    margin: 0 0 24px;
    font-size: 1.05rem;
    opacity: .9;
    max-width: 580px;
    line-height: 1.8;
}

.np-search-bar {
    display: flex;
    align-items: center;
    gap: 12px;
    background: rgba(255,255,255,.97);
    border-radius: var(--np-radius);
    padding: 6px 6px 6px 18px;
    max-width: 480px;
    box-shadow: var(--np-shadow-lg);
}
.np-search-bar i { color: var(--np-muted); font-size: 1rem; }
.np-search-bar input {
    flex: 1;
    border: 0;
    background: transparent;
    font: inherit;
    font-size: .95rem;
    color: var(--np-text);
    outline: none;
    padding: 12px 0;
}

.np-hero-stats {
    list-style: none;
    padding: 0;
    margin: 28px 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}
.np-hero-stats li {
    background: rgba(255,255,255,.1);
    border: 1px solid rgba(255,255,255,.15);
    border-radius: var(--np-radius-sm);
    padding: 12px 20px;
    text-align: center;
    min-width: 90px;
}
.np-hero-stats b {
    display: block;
    font-size: 1.5rem;
    font-weight: 800;
    line-height: 1.2;
}
.np-hero-stats span { font-size: .78rem; opacity: .85; }

.np-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: .88rem;
    font-weight: 700;
    padding: 8px 16px;
    border-radius: 999px;
    margin-top: 8px;
}
.np-status--live { background: var(--np-live-soft); color: #065f46; }
.np-status--legacy-tag {
    background: rgba(251, 191, 36, .22);
    color: #92400e;
    border: 1px solid rgba(217, 119, 6, .35);
}
.np-status--legacy { background: rgba(220, 38, 38, .22); color: #fecaca; border: 1px solid rgba(248, 113, 113, .45); }
.np-status--off { background: rgba(100, 116, 139, .35); color: #e2e8f0; border: 1px solid rgba(148, 163, 184, .45); }
.np-status--upcoming { background: rgba(255, 255, 255, .12); color: rgba(255, 255, 255, .92); border: 1px solid rgba(255, 255, 255, .2); }
.np-status--warn { background: rgba(245,158,11,.2); color: #fef3c7; }
.np-status--soon { background: rgba(255,255,255,.15); color: rgba(255,255,255,.9); }
.np-status--tool { background: rgba(245,158,11,.25); color: #fef3c7; }

/* ── Breadcrumbs ── */
.np-breadcrumbs, .rp-breadcrumbs { margin: 0 0 14px; font-size: .82rem; }
.np-breadcrumbs ol, .rp-breadcrumbs ol {
    list-style: none; padding: 0; margin: 0;
    display: flex; flex-wrap: wrap; gap: 4px; align-items: center;
    flex-direction: row;
    direction: rtl;
}
.np-breadcrumbs li + li::before, .rp-breadcrumbs li + li::before {
    content: "‹"; margin-inline: 6px; opacity: .6;
}
.np-breadcrumbs a, .rp-breadcrumbs a { color: rgba(255,255,255,.85); }
.np-breadcrumbs a:hover, .rp-breadcrumbs a:hover { color: #fff; }
.np-breadcrumbs span, .rp-breadcrumbs span { opacity: .75; }

/* ── Sections ── */
.np-main {
    flex: 1;
    direction: rtl;
    text-align: right;
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
}
.np-header-v3 {
    width: 100%;
    max-width: 100%;
}
.np-footer { direction: rtl; text-align: right; }
.np-section { padding: 48px 0 56px; }
.np-section-title {
    font-size: 1.25rem;
    font-weight: 800;
    color: var(--np-brand);
    margin: 0 0 24px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.np-section-title::before {
    content: "";
    width: 4px; height: 22px;
    background: linear-gradient(180deg, var(--np-accent), var(--np-brand-light));
    border-radius: 4px;
}

/* ── Governorate grid ── */
.np-gov-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
    gap: 16px;
}
.np-gov-item {
    display: flex;
    flex-direction: column;
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius);
    padding: 20px;
    text-decoration: none;
    color: inherit;
    transition: transform .2s, box-shadow .2s, border-color .2s;
    position: relative;
    overflow: hidden;
}
.np-gov-item::before {
    content: "";
    position: absolute;
    inset-inline-start: 0; top: 0; bottom: 0;
    width: 4px;
    background: linear-gradient(180deg, var(--np-brand-light), var(--np-accent));
    opacity: 0;
    transition: opacity .2s;
}
.np-gov-item:hover {
    transform: translateY(-3px);
    box-shadow: var(--np-shadow-lg);
    border-color: var(--np-brand-light);
    text-decoration: none;
}
.np-gov-item:hover::before { opacity: 1; }
.np-gov-item--soon {
    opacity: .72;
    cursor: default;
    background: var(--np-surface-2);
}
.np-gov-item--soon:hover { transform: none; box-shadow: none; }
.np-gov-item-top {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}
.np-gov-dot {
    width: 8px; height: 8px;
    border-radius: 50%;
    background: var(--np-muted);
    flex-shrink: 0;
}
.np-gov-dot--live {
    background: var(--np-live);
    box-shadow: 0 0 0 3px var(--np-live-soft);
    animation: np-pulse 2s infinite;
}
@keyframes np-pulse {
    0%, 100% { box-shadow: 0 0 0 3px var(--np-live-soft); }
    50% { box-shadow: 0 0 0 6px rgba(5,150,105,.15); }
}
.np-gov-item strong {
    font-size: 1.05rem;
    color: var(--np-brand);
}
.np-gov-item h3 {
    margin: 0 0 14px;
    font-size: .82rem;
    font-weight: 600;
    color: var(--np-muted);
    line-height: 1.6;
    flex: 1;
}
.np-gov-cta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: .85rem;
    font-weight: 700;
    color: var(--np-brand-light);
}
.np-gov-item:hover .np-gov-cta { color: var(--np-brand); }
.np-soon-tag {
    display: inline-block;
    background: var(--np-bg-2);
    color: var(--np-muted);
    font-size: .78rem;
    font-weight: 700;
    padding: 4px 12px;
    border-radius: 999px;
}
.np-empty {
    text-align: center;
    color: var(--np-muted);
    padding: 32px;
    font-weight: 600;
}

/* ── Search block ── */
.np-search-block {
    margin-top: clamp(-48px, -6vw, -36px);
    position: relative;
    z-index: 2;
    padding-bottom: 32px;
    width: 100%;
    max-width: 100%;
}
.np-search-card {
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius);
    padding: 28px;
    box-shadow: var(--np-shadow-lg);
}
.np-search-card h2 {
    margin: 0 0 6px;
    font-size: 1.15rem;
    color: var(--np-brand);
    display: flex;
    align-items: center;
    gap: 10px;
}
.np-search-card h2 i { color: var(--np-brand-light); }
.np-source-note {
    margin: 0 0 20px;
    font-size: .85rem;
    color: var(--np-muted);
}
.np-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 16px;
}
.np-tab {
    border: 1px solid var(--np-border);
    background: var(--np-surface-2);
    color: var(--np-text-2);
    padding: 9px 16px;
    border-radius: 999px;
    font: inherit;
    font-size: .85rem;
    font-weight: 600;
    cursor: pointer;
    transition: all .15s;
}
.np-tab:hover { border-color: var(--np-brand-light); color: var(--np-brand); }
.np-tab.is-on {
    background: var(--np-brand);
    border-color: var(--np-brand);
    color: #fff;
    box-shadow: 0 4px 12px rgba(10,37,64,.2);
}
.np-search-row {
    display: flex;
    gap: 10px;
}
.np-search-row input {
    flex: 1;
    border: 2px solid var(--np-border);
    border-radius: var(--np-radius-sm);
    padding: 14px 16px;
    font: inherit;
    font-size: 1rem;
    transition: border-color .15s;
}
.np-search-row input:focus {
    outline: none;
    border-color: var(--np-brand-light);
    box-shadow: 0 0 0 3px rgba(26,111,181,.12);
}
.np-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 0;
    background: linear-gradient(135deg, var(--np-brand) 0%, var(--np-brand-mid) 100%);
    color: #fff;
    padding: 14px 24px;
    border-radius: var(--np-radius-sm);
    font: inherit;
    font-weight: 700;
    font-size: .95rem;
    cursor: pointer;
    white-space: nowrap;
    box-shadow: 0 4px 16px rgba(10,37,64,.25);
    transition: filter .15s, transform .15s;
    text-decoration: none;
}
.np-btn:hover { filter: brightness(1.06); transform: translateY(-1px); text-decoration: none; color: #fff; }
.np-btn--ghost {
    background: transparent;
    border: 2px solid var(--np-border);
    color: var(--np-brand);
    box-shadow: none;
}
.np-btn--ghost:hover { background: var(--np-bg); color: var(--np-brand); }
.np-alert {
    padding: 14px 18px;
    border-radius: var(--np-radius-sm);
    margin-bottom: 16px;
    font-weight: 600;
    font-size: .92rem;
}
.np-alert--err { background: var(--np-danger-soft); color: var(--np-danger); border: 1px solid #fecaca; }

/* ── Content blocks ── */
.np-blocks { display: grid; gap: 16px; padding-bottom: 40px; }
.np-block {
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius);
    padding: 24px;
}
.np-block h2 {
    font-size: 1.05rem;
    margin: 0 0 12px;
    color: var(--np-brand);
    display: flex;
    align-items: center;
    gap: 10px;
}
.np-block h2 i { color: var(--np-accent); width: 20px; text-align: center; }
.np-block p { margin: 0 0 10px; color: var(--np-text-2); font-size: .94rem; line-height: 1.85; }

/* ── Prep3 governorate — 4 search keywords box ── */
.np-gov-kw { padding: 0 0 44px; }
.np-gov-kw-box {
    background: linear-gradient(145deg, #fff 0%, color-mix(in srgb, var(--gov-kw-accent, var(--np-brand)) 6%, #fff) 100%);
    border: 1px solid color-mix(in srgb, var(--gov-kw-accent, var(--np-brand)) 22%, var(--np-border));
    border-radius: 20px;
    padding: 22px 22px 20px;
    box-shadow: 0 10px 32px color-mix(in srgb, var(--gov-kw-accent, var(--np-brand)) 10%, transparent);
}
.np-gov-kw-head {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 18px;
}
.np-gov-kw-icon {
    width: 44px;
    height: 44px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--gov-kw-accent, var(--np-brand)) 14%, #fff);
    color: var(--gov-kw-accent, var(--np-brand));
    font-size: 1.1rem;
    flex-shrink: 0;
}
.np-gov-kw-title {
    margin: 0 0 4px;
    font-size: 1.12rem;
    font-weight: 800;
    color: var(--np-brand);
}
.np-gov-kw-sub {
    margin: 0;
    font-size: .86rem;
    color: var(--np-text-2);
    line-height: 1.6;
}
.np-gov-kw-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}
.np-gov-kw-chip {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border-radius: 14px;
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    text-decoration: none;
    color: var(--np-text);
    transition: border-color .15s, box-shadow .15s, transform .12s;
}
.np-gov-kw-chip:hover {
    border-color: color-mix(in srgb, var(--gov-kw-accent, var(--np-brand)) 45%, var(--np-border));
    box-shadow: 0 6px 18px color-mix(in srgb, var(--gov-kw-accent, var(--np-brand)) 12%, transparent);
    transform: translateY(-1px);
    text-decoration: none;
    color: var(--np-brand);
}
.np-gov-kw-chip-ico {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--gov-kw-accent, var(--np-brand)) 12%, #fff);
    color: var(--gov-kw-accent, var(--np-brand));
    font-size: .9rem;
    flex-shrink: 0;
}
.np-gov-kw-chip-text {
    flex: 1;
    font-size: .84rem;
    font-weight: 700;
    line-height: 1.45;
}
.np-gov-kw-chip-arrow {
    font-size: .72rem;
    opacity: .45;
    flex-shrink: 0;
}
@media (max-width: 560px) {
    .np-gov-kw-grid { grid-template-columns: 1fr; }
    .np-gov-kw-box { padding: 18px 16px 16px; }
}

/* ── Tags / keywords ── */
.np-tags { padding-bottom: 40px; }
.np-tags h2 { font-size: 1.1rem; margin-bottom: 14px; color: var(--np-brand); font-weight: 800; }
.np-tag-cloud { display: flex; flex-wrap: wrap; gap: 8px; }
.np-tag-cloud a {
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    padding: 7px 14px;
    border-radius: 999px;
    font-size: .8rem;
    color: var(--np-text-2);
    text-decoration: none;
    transition: all .15s;
}
.np-tag-cloud a:hover {
    border-color: var(--np-brand-light);
    color: var(--np-brand);
    background: var(--np-surface-2);
    text-decoration: none;
}

/* ── FAQ ── */
.np-faq, .rp-faq { padding: 40px 0 56px; }
.np-faq h2, .rp-faq h2 {
    font-size: 1.2rem;
    margin-bottom: 16px;
    color: var(--np-brand);
    font-weight: 800;
}
.np-faq-list, .rp-faq-list { display: grid; gap: 10px; }
.np-faq-item, .rp-faq-item {
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius-sm);
    overflow: hidden;
}
.np-faq-item summary, .rp-faq-item summary {
    padding: 16px 18px;
    cursor: pointer;
    font-weight: 700;
    color: var(--np-text);
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.np-faq-item summary::-webkit-details-marker { display: none; }
.np-faq-item summary::after {
    content: "+";
    font-size: 1.2rem;
    color: var(--np-brand-light);
    font-weight: 400;
    flex-shrink: 0;
}
.np-faq-item[open] summary::after { content: "−"; }
.np-faq-item p, .rp-faq-item p {
    margin: 0;
    padding: 0 18px 16px;
    color: var(--np-text-2);
    font-size: .93rem;
    line-height: 1.85;
}

/* ── Result page ── */
.np-page-head { padding: 32px 0 8px; }
.np-back {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--np-muted);
    font-weight: 600;
    font-size: .88rem;
    text-decoration: none;
    margin-bottom: 8px;
}
.np-back:hover { color: var(--np-brand-light); text-decoration: none; }
.np-page-head h1 { margin: 0; font-size: 1.35rem; color: var(--np-brand); font-weight: 800; }

.np-student-card {
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius);
    box-shadow: var(--np-shadow-lg);
    overflow: hidden;
    margin-bottom: 40px;
}
.np-student-header {
    display: flex;
    gap: 18px;
    padding: 28px;
    background: linear-gradient(135deg, rgba(10,37,64,.04) 0%, rgba(26,111,181,.06) 100%);
    border-bottom: 1px solid var(--np-border);
}
.np-avatar {
    width: 64px; height: 64px;
    border-radius: 18px;
    background: linear-gradient(135deg, var(--accent, var(--np-brand-light)), var(--np-brand));
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 1.6rem;
    font-weight: 800;
    flex-shrink: 0;
    box-shadow: 0 6px 16px rgba(10,37,64,.2);
}
.np-student-header h2 { margin: 0 0 8px; font-size: 1.25rem; color: var(--np-brand); }
.np-badges { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; font-size: .88rem; color: var(--np-muted); }
.np-badge {
    display: inline-block;
    padding: 3px 12px;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 700;
    background: var(--np-bg-2);
    color: var(--np-text-2);
}
.np-badge--success { background: var(--np-live-soft); color: #065f46; }
.np-info { list-style: none; padding: 0; margin: 12px 0 0; font-size: .9rem; color: var(--np-text-2); }
.np-info li { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 6px; }
.np-info i { color: var(--np-brand-light); width: 18px; margin-top: 3px; text-align: center; }

.np-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: 12px;
    padding: 20px 28px;
    border-bottom: 1px solid var(--np-border);
}
.np-summary div {
    background: var(--np-surface-2);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius-sm);
    padding: 14px;
    text-align: center;
}
.np-summary span { display: block; font-size: .78rem; color: var(--np-muted); margin-bottom: 4px; font-weight: 600; }
.np-summary strong { font-size: 1.4rem; color: var(--np-brand); font-weight: 800; }

.np-table-wrap { padding: 0 28px 28px; overflow-x: auto; }
.np-table-title { margin: 20px 28px 0; font-size: 1rem; color: var(--np-brand); font-weight: 800; }
.np-table {
    width: 100%;
    border-collapse: collapse;
    font-size: .92rem;
    margin-top: 12px;
}
.np-table th, .np-table td {
    padding: 12px 14px;
    border-bottom: 1px solid var(--np-border);
    text-align: right;
}
.np-table th {
    background: var(--np-brand);
    color: #fff;
    font-weight: 700;
    font-size: .85rem;
}
.np-table th:first-child { border-radius: 0 8px 0 0; }
.np-table th:last-child { border-radius: 8px 0 0 0; }
.np-table tbody tr:hover td { background: var(--np-surface-2); }
.np-table a { font-weight: 700; }

.np-student-card.grade-excellent { --accent: #059669; }
.np-student-card.grade-very-good { --accent: #1a6fb5; }
.np-student-card.grade-good { --accent: #7c3aed; }
.np-student-card.grade-pass { --accent: #d97706; }

/* ── Coordination ── */
.np-coord-section { padding: 32px 0 48px; margin-top: -32px; position: relative; z-index: 2; }
.np-coord-card {
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius);
    padding: 28px;
    box-shadow: var(--np-shadow-lg);
}
.np-form-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    margin-bottom: 16px;
}
.np-form-grid label {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: .88rem;
    font-weight: 600;
    color: var(--np-text-2);
}
.np-input {
    border: 2px solid var(--np-border);
    border-radius: var(--np-radius-sm);
    padding: 12px 14px;
    font: inherit;
    font-size: .95rem;
}
.np-input:focus { outline: none; border-color: var(--np-brand-light); }
.np-btn--wide { width: 100%; }
.np-coord-result {
    margin-top: 20px;
    padding: 20px;
    background: var(--np-live-soft);
    border: 1px solid #a7f3d0;
    border-radius: var(--np-radius-sm);
    color: #065f46;
    font-weight: 600;
}

/* ── Error page ── */
.np-error { padding: 80px 0; text-align: center; }
.np-error-card {
    background: var(--np-surface);
    border-radius: var(--np-radius);
    padding: 48px 32px;
    box-shadow: var(--np-shadow-lg);
    max-width: 440px;
    margin: 0 auto;
    border: 1px solid var(--np-border);
}
.np-error-code {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 80px; height: 80px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--np-brand), var(--np-brand-light));
    color: #fff;
    font-size: 2rem;
    font-weight: 800;
    margin-bottom: 20px;
}
.np-error-card h1 { margin: 0 0 10px; font-size: 1.3rem; color: var(--np-brand); }
.np-error-card p { margin: 0 0 24px; color: var(--np-muted); }

/* ── Footer ── */
.np-footer {
    background: linear-gradient(180deg, #0a2540 0%, #071a2e 100%);
    color: rgba(255,255,255,.75);
    padding: 40px 0 20px;
    margin-top: auto;
    width: 100%;
    max-width: 100%;
}
.np-footer-top {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    padding-bottom: 24px;
    border-bottom: 1px solid rgba(255,255,255,.1);
    margin-bottom: 24px;
}
.np-footer-logo {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #fff;
    font-weight: 800;
    font-size: 1.05rem;
    text-decoration: none;
    margin-bottom: 8px;
}
.np-footer-logo:hover { color: #fff; opacity: .92; text-decoration: none; }
.np-footer-logo-icon {
    width: 40px; height: 40px;
    border-radius: 12px;
    background: linear-gradient(135deg, var(--np-accent), #e6b84d);
    color: var(--np-brand);
    display: grid;
    place-items: center;
    font-size: 1rem;
}
.np-footer-desc { font-size: .86rem; line-height: 1.75; margin: 0; max-width: 360px; color: rgba(255,255,255,.65); }
.np-footer-brand-kw {
    font-size: .82rem;
    line-height: 1.8;
    margin: 10px 0 0;
    max-width: 420px;
    color: rgba(255,255,255,.55);
}
.np-footer-brand-kw a {
    color: var(--np-accent-soft);
    text-decoration: none;
    font-weight: 600;
}
.np-footer-brand-kw a:hover { color: #fff; text-decoration: underline; }
.np-footer-brand-kw-sep { opacity: .45; }
.np-footer-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.np-footer-nav a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    border-radius: 999px;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.12);
    color: rgba(255,255,255,.85);
    font-size: .84rem;
    font-weight: 600;
    text-decoration: none;
    transition: all .15s;
}
.np-footer-nav a:hover {
    background: rgba(255,255,255,.14);
    color: #fff;
    text-decoration: none;
}
.np-footer-nav i { color: var(--np-accent-soft); font-size: .9rem; }

.np-footer-legal {
    flex: 0 0 auto;
    min-width: 220px;
    max-width: 280px;
}
.np-footer-legal-title {
    margin: 0 0 12px;
    font-size: .82rem;
    font-weight: 800;
    color: rgba(255, 255, 255, .7);
    display: flex;
    align-items: center;
    gap: 8px;
    letter-spacing: .02em;
}
.np-footer-legal-title i {
    color: #67e8f9;
    font-size: .9rem;
}
.np-footer-legal-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.np-footer-legal-link {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 10px 12px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(8, 145, 178, .22), rgba(15, 118, 110, .12));
    border: 1px solid rgba(45, 212, 191, .28);
    color: rgba(255, 255, 255, .92);
    font-size: .84rem;
    font-weight: 700;
    text-decoration: none;
    transition: background .2s, border-color .2s, transform .15s;
}
.np-footer-legal-link:hover {
    background: linear-gradient(135deg, rgba(8, 145, 178, .38), rgba(15, 118, 110, .24));
    border-color: rgba(103, 232, 249, .45);
    color: #fff;
    text-decoration: none;
    transform: translateX(-2px);
}
.np-footer-legal-ico {
    width: 32px;
    height: 32px;
    border-radius: 10px;
    background: rgba(255, 255, 255, .1);
    border: 1px solid rgba(165, 243, 252, .25);
    display: grid;
    place-items: center;
    flex-shrink: 0;
    color: #a5f3fc;
    font-size: .85rem;
}
.np-footer-legal-text { flex: 1; min-width: 0; }
.np-footer-legal-ext {
    font-size: .72rem;
    opacity: .55;
    flex-shrink: 0;
}

.np-footer-seo { margin-bottom: 24px; }
.np-footer-seo-title {
    margin: 0 0 14px;
    font-size: .82rem;
    font-weight: 700;
    color: rgba(255,255,255,.55);
    display: flex;
    align-items: center;
    gap: 8px;
    letter-spacing: .03em;
}
.np-footer-seo-title i { color: var(--np-accent); }
.np-footer-kw {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.np-footer-kw-link {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 12px;
    border-radius: 999px;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.1);
    color: rgba(255,255,255,.78);
    font-size: .76rem;
    font-weight: 600;
    text-decoration: none;
    transition: all .15s;
    line-height: 1.3;
}
.np-footer-kw-link i {
    width: 22px; height: 22px;
    border-radius: 7px;
    background: rgba(200,146,42,.18);
    color: var(--np-accent-soft);
    display: grid;
    place-items: center;
    font-size: .68rem;
    flex-shrink: 0;
}
.np-footer-kw-link:hover {
    background: rgba(255,255,255,.12);
    border-color: rgba(200,146,42,.35);
    color: #fff;
    text-decoration: none;
    transform: translateY(-1px);
}

.np-seo-anchors {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
}
.np-seo-anchors span { scroll-margin-top: calc(var(--np-header-h) + 16px); }

.np-footer-bottom {
    border-top: 1px solid rgba(255,255,255,.08);
    padding-top: 18px;
    text-align: center;
    font-size: .78rem;
    color: rgba(255,255,255,.5);
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.np-footer-bottom p { margin: 0; line-height: 1.75; }
.np-footer-copy {
    font-weight: 600;
    color: rgba(255, 255, 255, .62);
    max-width: 920px;
    margin-inline: auto;
}
.np-footer-copy a {
    color: var(--np-accent-soft);
    text-decoration: none;
    font-weight: 800;
}
.np-footer-copy a:hover {
    color: #fff;
    text-decoration: underline;
}
.np-footer-credit {
    font-size: .82rem;
    font-weight: 700;
    color: rgba(255, 255, 255, .72);
}
.np-footer-credit a {
    color: #a5f3fc;
    text-decoration: none;
    border-bottom: 1px solid rgba(165, 243, 252, .35);
    transition: color .15s, border-color .15s;
}
.np-footer-credit a:hover {
    color: #fff;
    border-bottom-color: #fff;
    text-decoration: none;
}
.np-footer-heart {
    display: inline-block;
    animation: np-footer-heart-pulse 1.4s ease-in-out infinite;
}
@keyframes np-footer-heart-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.12); }
}

/* legacy footer classes */
.np-footer-grid { display: none; }
.np-footer-brand { font-size: 1.05rem; font-weight: 800; color: #fff; margin-bottom: 10px; }
.np-footer h3 { font-size: .85rem; font-weight: 700; color: #fff; margin: 0 0 12px; }
.np-footer-links { list-style: none; padding: 0; margin: 0; }
.np-footer-links a { color: rgba(255,255,255,.7); font-size: .88rem; text-decoration: none; }

/* ── Levels strip (home) ── */
.np-levels-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 32px;
}
.np-level-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    padding: 10px 18px;
    border-radius: 999px;
    font-size: .88rem;
    font-weight: 600;
    color: var(--np-text-2);
    text-decoration: none;
    transition: all .15s;
}
.np-level-pill:hover {
    border-color: var(--np-brand-light);
    color: var(--np-brand);
    box-shadow: var(--np-shadow);
    text-decoration: none;
}
.np-level-pill i { color: var(--np-brand-light); }

/* ── SEO keywords bar (above footer) ── */
.np-seo-bar {
    background: linear-gradient(180deg, var(--np-surface-2) 0%, #eef3f9 100%);
    border-top: 1px solid var(--np-border);
    border-bottom: 3px solid var(--np-accent);
    padding: 36px 0 40px;
    margin-top: 24px;
}
.np-seo-bar-head {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 24px;
}
.np-seo-bar-icon {
    width: 48px; height: 48px;
    border-radius: 14px;
    background: linear-gradient(135deg, var(--np-brand), var(--np-brand-light));
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 1.1rem;
    flex-shrink: 0;
    box-shadow: 0 8px 20px rgba(10,37,64,.18);
}
.np-seo-bar-title {
    margin: 0 0 4px;
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--np-brand);
}
.np-seo-bar-desc {
    margin: 0;
    font-size: .88rem;
    color: var(--np-muted);
    line-height: 1.7;
}
.np-seo-bar-groups {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 20px;
}
.np-seo-group-title {
    margin: 0 0 10px;
    font-size: .78rem;
    font-weight: 800;
    color: var(--np-brand-mid);
    text-transform: uppercase;
    letter-spacing: .03em;
}
.np-seo-tags {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.np-seo-tag {
    display: inline-block;
    padding: 6px 12px;
    border-radius: 999px;
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    color: var(--np-text-2);
    font-size: .78rem;
    font-weight: 600;
    line-height: 1.4;
    transition: all .15s;
}
.np-seo-tag:hover {
    border-color: var(--np-brand-light);
    color: var(--np-brand);
    background: #fff;
    box-shadow: var(--np-shadow);
    text-decoration: none;
}

/* ── SEO index (homepage anchors) ── */
.np-seo-index {
    padding: 48px 0 24px;
    scroll-margin-top: calc(var(--np-header-h) + 16px);
}
.np-seo-index-head { margin-bottom: 28px; max-width: 720px; }
.np-seo-index-head h2 { margin: 10px 0 8px; font-size: 1.35rem; color: var(--np-brand); font-weight: 800; }
.np-seo-index-head p { margin: 0; color: var(--np-muted); font-size: .93rem; }
.np-seo-index-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 16px;
}
.np-seo-index-card {
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius-sm);
    padding: 18px;
    box-shadow: var(--np-shadow);
}
.np-seo-index-card h3 {
    margin: 0 0 12px;
    font-size: .85rem;
    font-weight: 800;
    color: var(--np-brand-mid);
}
.np-seo-index-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.np-seo-index-list li {
    scroll-margin-top: calc(var(--np-header-h) + 20px);
}
.np-seo-index-list a {
    display: block;
    font-size: .82rem;
    color: var(--np-text-2);
    padding: 4px 0;
    border-bottom: 1px dashed transparent;
}
.np-seo-index-list a:hover { color: var(--np-brand-light); text-decoration: none; }
.np-seo-index-list li:target {
    background: var(--np-accent-soft);
    border-radius: 8px;
    padding: 2px 8px;
    animation: np-kw-flash .8s ease;
}
@keyframes np-kw-flash {
    0% { background: var(--np-accent-soft); }
    100% { background: transparent; }
}

/* ── Result page v2 ── */
.np-hero--result { padding-bottom: 48px; }
.np-result-page { padding-bottom: 56px; }
.np-result-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 28px 0 16px;
}
.np-result-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.np-result-actions .np-btn { font-size: .85rem; padding: 10px 16px; }

.np-result-cert {
    position: relative;
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: calc(var(--np-radius) + 4px);
    box-shadow: var(--np-shadow-lg);
    overflow: hidden;
}
.np-result-cert-ribbon {
    position: absolute;
    inset-inline-start: 0;
    top: 0;
    width: 100%;
    height: 5px;
    background: linear-gradient(90deg, var(--accent, var(--np-brand-light)), var(--np-accent));
    display: flex;
    align-items: center;
    justify-content: center;
    color: transparent;
}
.np-result-cert-head {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 24px;
    padding: 32px 28px 24px;
    background: linear-gradient(135deg, rgba(10,37,64,.03) 0%, rgba(26,111,181,.07) 100%);
    border-bottom: 1px solid var(--np-border);
}
.np-result-cert-id { display: flex; gap: 18px; flex: 1; min-width: 240px; }
.np-avatar--lg {
    width: 78px; height: 78px;
    border-radius: 22px;
    font-size: 2rem;
}
.np-result-cert-label {
    margin: 0 0 4px;
    font-size: .75rem;
    font-weight: 700;
    color: var(--np-muted);
    text-transform: uppercase;
    letter-spacing: .04em;
}
.np-result-cert-head h2 { margin: 0 0 10px; font-size: 1.45rem; color: var(--np-brand); font-weight: 800; }
.np-result-meta {
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: .88rem;
    color: var(--np-text-2);
}
.np-result-meta li { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.np-result-meta i { color: var(--np-brand-light); width: 16px; text-align: center; }

.np-result-ring-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}
.np-result-ring {
    --pct: 0;
    position: relative;
    width: 120px;
    height: 120px;
}
.np-result-ring svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.np-result-ring-bg {
    fill: none;
    stroke: var(--np-bg-2);
    stroke-width: 10;
}
.np-result-ring-fill {
    fill: none;
    stroke: var(--accent, var(--np-brand-light));
    stroke-width: 10;
    stroke-linecap: round;
    stroke-dasharray: 326.7;
    stroke-dashoffset: calc(326.7 - (326.7 * var(--pct) / 100));
    transition: stroke-dashoffset 1s ease;
}
.np-result-ring-text {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.np-result-ring-text strong { font-size: 1.35rem; color: var(--np-brand); font-weight: 900; line-height: 1.1; }
.np-result-ring-text span { font-size: .72rem; color: var(--np-muted); font-weight: 600; }
.np-result-grade-badge {
    display: inline-block;
    padding: 6px 16px;
    border-radius: 999px;
    background: var(--np-live-soft);
    color: #065f46;
    font-size: .85rem;
    font-weight: 800;
}

.np-result-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
    padding: 20px 28px;
    border-bottom: 1px solid var(--np-border);
}
.np-result-stat {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    background: var(--np-surface-2);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius-sm);
    padding: 14px 16px;
}
.np-result-stat--wide { grid-column: 1 / -1; }
.np-result-stat i {
    color: var(--accent, var(--np-brand-light));
    font-size: 1.1rem;
    margin-top: 2px;
}
.np-result-stat span { display: block; font-size: .75rem; color: var(--np-muted); font-weight: 600; margin-bottom: 2px; }
.np-result-stat strong { font-size: 1.05rem; color: var(--np-brand); font-weight: 800; line-height: 1.4; }

.np-result-subjects { padding: 24px 28px 28px; }
.np-result-subjects h3 { margin: 0 0 16px; font-size: 1rem; color: var(--np-brand); font-weight: 800; }
.np-result-subject-list { display: flex; flex-direction: column; gap: 14px; }
.np-result-subject {
    background: var(--np-surface-2);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius-sm);
    padding: 12px 14px;
}
.np-result-subject-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
}
.np-result-subject-name { font-weight: 700; color: var(--np-text); font-size: .92rem; }
.np-result-subject-score { font-weight: 800; color: var(--np-brand); font-size: .95rem; }
.np-result-subject-bar {
    height: 6px;
    background: var(--np-bg-2);
    border-radius: 999px;
    overflow: hidden;
}
.np-result-subject-bar span {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--accent, var(--np-brand-light)), var(--np-brand));
    transition: width .8s ease;
}
.np-result-subject-grade {
    display: inline-block;
    margin-top: 6px;
    font-size: .75rem;
    font-weight: 700;
    color: var(--np-muted);
}
.np-result-table-toggle {
    margin-top: 20px;
    border: 1px dashed var(--np-border);
    border-radius: var(--np-radius-sm);
    padding: 0 14px;
}
.np-result-table-toggle summary {
    cursor: pointer;
    padding: 12px 0;
    font-weight: 700;
    color: var(--np-brand-light);
    font-size: .88rem;
}
.np-result-table-toggle .np-table-wrap { padding: 0 0 16px; }
.np-table-wrap--card {
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius);
    padding: 0 0 8px;
    box-shadow: var(--np-shadow);
}

.np-result-cert-foot {
    padding: 14px 28px;
    background: var(--np-surface-2);
    border-top: 1px solid var(--np-border);
    font-size: .82rem;
    color: var(--np-muted);
}
.np-result-cert-foot p { margin: 0; display: flex; align-items: center; gap: 8px; }
.np-result-cert-foot i { color: var(--np-live); }

.np-result-cert.grade-excellent { --accent: #059669; }
.np-result-cert.grade-very-good { --accent: #1a6fb5; }
.np-result-cert.grade-good { --accent: #7c3aed; }
.np-result-cert.grade-pass { --accent: #d97706; }
.np-result-cert.grade-excellent .np-result-grade-badge { background: #d1fae5; color: #065f46; }
.np-result-cert.grade-very-good .np-result-grade-badge { background: #dbeafe; color: #1e40af; }
.np-result-cert.grade-good .np-result-grade-badge { background: #ede9fe; color: #5b21b6; }
.np-result-cert.grade-pass .np-result-grade-badge { background: #fef3c7; color: #92400e; }

.np-result-list-head { margin-bottom: 20px; }
.np-result-list-head h2 { margin: 0 0 6px; font-size: 1.25rem; color: var(--np-brand); font-weight: 800; }
.np-result-list-head p { margin: 0; color: var(--np-muted); font-size: .9rem; }
.np-result-cards { display: flex; flex-direction: column; gap: 10px; margin-bottom: 24px; }
.np-result-card {
    display: grid;
    grid-template-columns: auto 1fr auto auto;
    align-items: center;
    gap: 14px;
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius-sm);
    padding: 16px 18px;
    text-decoration: none;
    color: inherit;
    transition: all .15s;
    box-shadow: var(--np-shadow);
}
.np-result-card:hover {
    border-color: var(--np-brand-light);
    transform: translateY(-2px);
    box-shadow: var(--np-shadow-lg);
    text-decoration: none;
}
.np-result-card-seat {
    min-width: 72px;
    padding: 8px 12px;
    border-radius: 10px;
    background: var(--np-brand);
    color: #fff;
    font-weight: 800;
    font-size: .9rem;
    text-align: center;
}
.np-result-card-name { font-weight: 700; color: var(--np-brand); font-size: .95rem; }
.np-result-card-school { grid-column: 2 / -1; font-size: .82rem; color: var(--np-muted); display: flex; align-items: center; gap: 6px; }
.np-result-card-total { text-align: center; }
.np-result-card-total strong { display: block; font-size: 1.05rem; color: var(--np-brand); }
.np-result-card-total small { color: var(--np-muted); font-size: .78rem; }
.np-result-card-go { color: var(--np-brand-light); font-size: .9rem; }

/* ── Icon box system ── */
.np-ico-box {
    --ico-color: var(--np-brand-light);
    display: inline-grid;
    place-items: center;
    width: 44px; height: 44px;
    border-radius: 14px;
    background: #fff;
    background: linear-gradient(135deg, color-mix(in srgb, var(--ico-color) 18%, #fff), color-mix(in srgb, var(--ico-color) 8%, #fff));
    border: 1px solid color-mix(in srgb, var(--ico-color) 25%, var(--np-border));
    color: var(--ico-color);
    font-size: 1.05rem;
    flex-shrink: 0;
    box-shadow: 0 4px 14px color-mix(in srgb, var(--ico-color) 15%, transparent);
}
.np-ico-box--sm { width: 36px; height: 36px; border-radius: 11px; font-size: .88rem; }
.np-ico-box--md { width: 52px; height: 52px; border-radius: 16px; font-size: 1.15rem; }
.np-ico-box--lg { width: 64px; height: 64px; border-radius: 18px; font-size: 1.35rem; }
.np-ico-box--pulse { animation: np-ico-pulse 2.5s ease-in-out infinite; }
@keyframes np-ico-pulse {
    0%, 100% { box-shadow: 0 4px 14px color-mix(in srgb, var(--ico-color) 15%, transparent); }
    50% { box-shadow: 0 4px 24px color-mix(in srgb, var(--ico-color) 35%, transparent); }
}

.np-btn--shine {
    background: linear-gradient(135deg, var(--np-brand) 0%, var(--np-brand-light) 50%, var(--np-brand-mid) 100%);
    background-size: 200% 100%;
    animation: np-shine 4s ease infinite;
}
@keyframes np-shine {
    0%, 100% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
}
.np-btn--whatsapp:hover { background: #25d366 !important; border-color: #25d366 !important; color: #fff !important; }

/* ── Rich hero (gov / result) ── */
.np-hero--rich { padding-bottom: 80px; }
.np-hero-rich-row {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 28px;
    align-items: start;
}
.np-gov-badge {
    display: inline-grid;
    place-items: center;
    width: 56px; height: 56px;
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.25);
    font-size: 1.4rem;
    margin-bottom: 12px;
    backdrop-filter: blur(8px);
    overflow: hidden;
}
.np-gov-badge--photo { padding: 0; }
.np-gov-badge--photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.np-hero-gov-photo {
    border-radius: 20px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.12);
    box-shadow: 0 16px 40px rgba(0,0,0,.18);
    aspect-ratio: 1200 / 630;
    max-height: 280px;
}
.np-hero-gov-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.np-hero-features {
    list-style: none;
    padding: 0;
    margin: 16px 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.np-hero-features li {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(255,255,255,.1);
    border: 1px solid rgba(255,255,255,.15);
    padding: 6px 14px;
    border-radius: 999px;
    font-size: .82rem;
    font-weight: 600;
}
.np-hero-features i { color: var(--np-accent-soft); }
.np-hero-stat-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
.np-hero-stat-card {
    background: rgba(255,255,255,.1);
    border: 1px solid rgba(255,255,255,.18);
    border-radius: var(--np-radius-sm);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(8px);
}
.np-hero-stat-card .np-ico-box { margin: 0 auto 8px; background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.2); color: #fff; }
.np-hero-stat-card strong { display: block; font-size: 1.25rem; font-weight: 800; line-height: 1.2; }
.np-hero-stat-card > span:last-child { font-size: .72rem; opacity: .85; }

/* ── Premium search card ── */
.np-search-card--premium { padding: 32px; }
.np-search-card-head {
    margin-bottom: 24px;
}
.np-page-title-inline {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 8px;
    font-size: clamp(1rem, 2.2vw, 1.2rem);
    font-weight: 900;
    color: var(--np-brand);
    line-height: 1.45;
    direction: rtl;
}
.np-page-title-icon {
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    font-size: 1rem;
    color: var(--ico-color, var(--np-brand-light));
    background: #fff;
    background: color-mix(in srgb, var(--ico-color, #1a6fb5) 14%, #fff);
    border: 1px solid color-mix(in srgb, var(--ico-color, #1a6fb5) 28%, var(--np-border));
    overflow: hidden;
}
.np-page-title-icon img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.np-title-inline {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.np-title-icon {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    border-radius: 9px;
    display: grid;
    place-items: center;
    font-size: .9rem;
    color: var(--ico-color, var(--np-brand-light));
    background: color-mix(in srgb, var(--ico-color, #1a6fb5) 12%, #fff);
    border: 1px solid color-mix(in srgb, var(--ico-color, #1a6fb5) 20%, transparent);
}
.np-hero-rich-row--compact {
    grid-template-columns: 1fr auto;
}
.np-hero-lead {
    margin: 10px 0 14px;
    font-size: .92rem;
    line-height: 1.75;
    color: rgba(255,255,255,.9);
    font-weight: 600;
    max-width: 52ch;
}
.np-search-card-head h2 { margin: 0 0 4px; font-size: 1.2rem; color: var(--np-brand); }
.np-search-methods {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 10px;
    margin-bottom: 20px;
}
.np-search-method {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    padding: 14px;
    border: 2px solid var(--np-border);
    border-radius: var(--np-radius-sm);
    background: var(--np-surface-2);
    cursor: pointer;
    text-align: right;
    font: inherit;
    transition: all .15s;
}
.np-search-method:hover { border-color: var(--method-color, var(--np-brand-light)); }
.np-search-method.is-active {
    border-color: var(--method-color, var(--np-brand-light));
    background: color-mix(in srgb, var(--method-color, var(--np-brand-light)) 8%, #fff);
    box-shadow: 0 4px 16px color-mix(in srgb, var(--method-color, var(--np-brand-light)) 20%, transparent);
}
.np-search-method-icon {
    width: 38px; height: 38px;
    border-radius: 11px;
    background: color-mix(in srgb, var(--method-color, var(--np-brand-light)) 15%, #fff);
    color: var(--method-color, var(--np-brand-light));
    display: grid;
    place-items: center;
    font-size: .95rem;
    margin-bottom: 4px;
}
.np-search-method strong { font-size: .88rem; color: var(--np-brand); }
.np-search-method small { font-size: .72rem; color: var(--np-muted); line-height: 1.5; }
.np-search-row--premium { position: relative; }
.np-search-input-icon {
    position: absolute;
    inset-inline-start: 16px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--np-brand-light);
    font-size: 1rem;
    z-index: 1;
    pointer-events: none;
}
.np-search-row--premium input { padding-inline-start: 44px; }
.np-search-tips {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px dashed var(--np-border);
    font-size: .8rem;
    color: var(--np-muted);
    font-weight: 600;
}
.np-search-tips div { display: flex; align-items: center; gap: 8px; }
.np-search-tips i { color: var(--np-accent); }

/* ── Smart picker (school / edara) ── */
.np-search-field[hidden] { display: none !important; }
.np-smart-picker {
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius);
    background: var(--np-surface-2, #f8fafc);
    overflow: hidden;
}
.np-picker-toolbar {
    display: flex;
    gap: 10px;
    padding: 12px;
    border-bottom: 1px solid var(--np-border);
    background: var(--np-surface);
}
.np-picker-search-wrap {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 14px;
    background: var(--np-surface-2, #f8fafc);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius-sm);
}
.np-picker-search-wrap:focus-within {
    border-color: var(--np-brand-light);
    box-shadow: 0 0 0 3px rgba(26, 111, 181, .12);
}
.np-picker-search-wrap i { color: var(--np-muted); font-size: .9rem; }
.np-picker-filter {
    flex: 1;
    border: 0;
    background: transparent;
    padding: 12px 0;
    font-size: .95rem;
    font-weight: 600;
    color: var(--np-text);
    outline: none;
}
.np-picker-submit { white-space: nowrap; }
.np-picker-submit:disabled { opacity: .45; cursor: not-allowed; }
.np-picker-selected {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    background: rgba(5, 150, 105, .08);
    border-bottom: 1px solid rgba(5, 150, 105, .2);
}
.np-picker-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: .85rem;
    font-weight: 700;
    color: #047857;
}
.np-picker-clear {
    border: 0;
    background: transparent;
    color: var(--np-muted);
    cursor: pointer;
    padding: 6px 8px;
    border-radius: 6px;
}
.np-picker-clear:hover { background: rgba(0,0,0,.06); color: var(--np-text); }
.np-picker-body { max-height: 280px; overflow: auto; }
.np-picker-list {
    list-style: none;
    margin: 0;
    padding: 6px;
}
.np-picker-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 12px;
    border-radius: var(--np-radius-sm);
    cursor: pointer;
    font-size: .88rem;
    font-weight: 600;
    color: var(--np-text);
    line-height: 1.5;
    transition: background .15s;
}
.np-picker-item i {
    color: var(--np-brand-light);
    margin-top: 3px;
    flex-shrink: 0;
}
.np-picker-item:hover,
.np-picker-item.is-active {
    background: rgba(26, 111, 181, .08);
}
.np-picker-item.is-active {
    outline: 2px solid var(--np-brand-light);
    outline-offset: -2px;
}
.np-picker-item mark {
    background: rgba(200, 146, 42, .25);
    color: inherit;
    padding: 0 2px;
    border-radius: 2px;
}
.np-picker-empty,
.np-picker-loading {
    margin: 0;
    padding: 24px 16px;
    text-align: center;
    font-size: .85rem;
    color: var(--np-muted);
    font-weight: 600;
}
.np-picker-empty i,
.np-picker-loading i { margin-inline-end: 6px; }

/* ── Result toppers ── */
.np-result-toppers {
    margin-bottom: 24px;
    padding: 20px;
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius);
    background: linear-gradient(135deg, rgba(200,146,42,.08), rgba(26,111,181,.06));
}
.np-result-toppers h3 {
    margin: 0 0 14px;
    font-size: 1rem;
    color: var(--np-brand);
    display: flex;
    align-items: center;
    gap: 8px;
}
.np-result-toppers-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 10px;
}
.np-result-topper {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius-sm);
    text-decoration: none;
    color: inherit;
    transition: border-color .15s, box-shadow .15s;
}
.np-result-topper:hover {
    border-color: var(--np-accent);
    box-shadow: var(--np-shadow);
}
.np-result-topper-rank {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-weight: 800;
    font-size: .9rem;
    flex-shrink: 0;
}
.np-result-topper-rank--1 { background: #fef3c7; color: #b45309; }
.np-result-topper-rank--2 { background: #e5e7eb; color: #4b5563; }
.np-result-topper-rank--3 { background: #ffedd5; color: #c2410c; }
.np-result-topper-body strong { display: block; font-size: .88rem; }
.np-result-topper-body small { color: var(--np-muted); font-size: .75rem; }
.np-result-topper-score { margin-inline-start: auto; text-align: end; }
.np-result-topper-score strong { display: block; color: var(--np-brand); }

/* ── Year announcement banner ── */
.np-year-banner {
    position: relative;
    margin-bottom: 20px;
    border-radius: var(--np-radius);
    overflow: hidden;
    border: 1px solid var(--np-border);
    box-shadow: var(--np-shadow);
}
.np-year-banner-glow {
    position: absolute;
    inset: 0;
    opacity: .5;
    pointer-events: none;
}
.np-year-banner--live {
    border-color: rgba(5, 150, 105, .35);
    background: linear-gradient(135deg, rgba(5,150,105,.1), rgba(26,111,181,.06));
}
.np-year-banner--live .np-year-banner-glow {
    background: radial-gradient(circle at 90% 20%, rgba(5,150,105,.25), transparent 55%);
}
.np-year-banner--warn {
    border-color: rgba(200, 146, 42, .45);
    background: linear-gradient(135deg, rgba(200,146,42,.12), rgba(234,88,12,.06));
}
.np-year-banner--warn .np-year-banner-glow {
    background: radial-gradient(circle at 10% 50%, rgba(200,146,42,.2), transparent 60%);
}
.np-year-banner--legacy,
.np-year-banner--upcoming {
    border-color: rgba(220, 38, 38, .45);
    background: linear-gradient(135deg, rgba(220, 38, 38, .1), rgba(127, 29, 29, .06));
}
.np-year-banner--legacy .np-year-banner-glow,
.np-year-banner--upcoming .np-year-banner-glow {
    background: radial-gradient(circle at 12% 40%, rgba(220, 38, 38, .22), transparent 58%);
}
.np-year-banner--legacy .np-year-banner-icon,
.np-year-banner--upcoming .np-year-banner-icon {
    background: rgba(220, 38, 38, .12);
    color: #dc2626;
    border-color: rgba(220, 38, 38, .35);
}
.np-year-banner-db-alert {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 0 0 10px;
    padding: 10px 12px;
    border-radius: 10px;
    background: rgba(220, 38, 38, .1);
    border: 1px solid rgba(220, 38, 38, .35);
    color: #991b1b;
    font-size: .84rem;
    font-weight: 800;
    line-height: 1.6;
}
.np-year-banner-db-alert i {
    color: #dc2626;
    margin-top: 2px;
    flex-shrink: 0;
}
.np-year-banner-db-alert-emoji {
    font-size: 1.15rem;
    line-height: 1;
    flex-shrink: 0;
}
.np-year-banner--soon,
.np-year-banner--off {
    border-color: rgba(26, 111, 181, .25);
    background: linear-gradient(135deg, rgba(26,111,181,.08), rgba(124,58,237,.05));
}
.np-year-banner--off {
    border-color: rgba(100, 116, 139, .4);
    background: linear-gradient(135deg, rgba(100,116,139,.12), rgba(51,65,85,.06));
}
.np-year-banner--off .np-year-banner-icon {
    background: rgba(100, 116, 139, .15);
    color: #475569;
    border-color: rgba(100, 116, 139, .35);
}
.np-year-banner-badge--off {
    background: #64748b;
    color: #fff;
}
.np-year-banner-decor {
    position: absolute;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
    z-index: 0;
}
.np-year-banner-decor-item {
    position: absolute;
    font-size: 1.35rem;
    opacity: .22;
    animation: np-banner-float 4s ease-in-out infinite;
    animation-delay: calc(var(--decor-i, 0) * 0.7s);
}
.np-year-banner-decor-item:nth-child(1) { top: 12%; inset-inline-start: 8%; }
.np-year-banner-decor-item:nth-child(2) { top: 55%; inset-inline-end: 12%; font-size: 1.1rem; }
.np-year-banner-decor-item:nth-child(3) { bottom: 10%; inset-inline-start: 42%; font-size: 1rem; }
@keyframes np-banner-float {
    0%, 100% { transform: translateY(0) rotate(0deg); }
    50% { transform: translateY(-6px) rotate(6deg); }
}
.np-year-banner-inner {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 18px 20px;
    flex-wrap: wrap;
}
.np-year-banner-visual {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}
.np-year-banner-hero {
    font-size: 2.35rem;
    line-height: 1;
    filter: drop-shadow(0 3px 8px rgba(0, 0, 0, .12));
    animation: np-hero-pop 2.5s ease-in-out infinite;
}
@keyframes np-hero-pop {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.08); }
}
.np-year-banner-icon {
    position: relative;
    width: 52px;
    height: 52px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    font-size: 1.35rem;
    flex-shrink: 0;
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    color: var(--banner-accent, var(--np-brand));
}
.np-year-banner--live .np-year-banner-icon { background: rgba(5,150,105,.12); color: #047857; border-color: rgba(5,150,105,.25); }
.np-year-banner--warn .np-year-banner-icon { background: rgba(200,146,42,.15); color: #b45309; border-color: rgba(200,146,42,.3); }
.np-year-banner-pulse {
    position: absolute;
    top: -4px;
    inset-inline-end: -4px;
    color: #059669;
    font-size: .55rem;
    animation: np-pulse-dot 1.5s ease infinite;
}
@keyframes np-pulse-dot {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: .5; transform: scale(1.3); }
}
.np-year-banner-body { flex: 1; min-width: 200px; }
.np-year-banner-title {
    display: block;
    font-size: 1.12rem;
    font-weight: 900;
    color: var(--np-brand);
    margin-bottom: 8px;
    line-height: 1.45;
    letter-spacing: -.01em;
}
.np-year-banner-msg {
    margin: 0 0 10px;
    font-size: .92rem;
    color: var(--np-text-2);
    line-height: 1.75;
    font-weight: 700;
}
.np-year-banner--live .np-year-banner-title { color: #047857; }
.np-year-banner--legacy .np-year-banner-title { color: #b91c1c; }
.np-year-banner--legacy-notice {
    border-color: rgba(217, 119, 6, .35);
    background: linear-gradient(135deg, rgba(251, 191, 36, .12), rgba(255, 251, 235, .95));
}
.np-year-banner--legacy-notice .np-year-banner-glow {
    background: radial-gradient(circle at 12% 40%, rgba(217, 119, 6, .15), transparent 58%);
}
.np-year-banner--legacy-notice .np-year-banner-icon {
    background: rgba(217, 119, 6, .1);
    color: #b45309;
    border-color: rgba(217, 119, 6, .25);
}
.np-year-banner--legacy-notice .np-year-banner-title { color: #92400e; }
.np-year-banner--legacy-notice .np-year-banner-badge--danger {
    background: rgba(217, 119, 6, .15);
    color: #92400e;
    border-color: rgba(217, 119, 6, .3);
}
.np-year-banner--legacy-notice .np-year-banner-decor { display: none; }
.np-year-banner-chips {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.np-year-banner-chips li {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: .78rem;
    font-weight: 800;
    padding: 6px 12px;
    border-radius: 999px;
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    color: var(--np-text-2);
}
.np-chip-emoji,
.np-badge-emoji {
    font-size: 1.05em;
    line-height: 1;
}
.np-year-banner--live .np-year-banner-chips li { background: rgba(255,255,255,.7); }
.np-year-banner-badge {
    align-self: center;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .04em;
    background: #059669;
    color: #fff;
    margin-inline-start: auto;
}
.np-year-banner-badge--warn { background: #c8922a; }
.np-year-banner-badge--live { background: #059669; }
.np-year-banner-badge--danger { background: #dc2626; }
.np-year-banner-badge--upcoming { background: #475569; }
.np-year-banner-badge--soon { background: var(--np-brand); }

/* ── Gov info trio (3 premium boxes) ── */
.np-gov-trio { padding-bottom: 48px; }
.np-gov-trio-head { margin-bottom: 20px; }
.np-gov-trio-head p { margin: 6px 0 0; color: var(--np-muted); font-size: .9rem; font-weight: 600; }
.np-gov-trio-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    align-items: stretch;
}
.np-gov-trio-card {
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius);
    padding: 22px 20px;
    box-shadow: var(--np-shadow);
    display: flex;
    flex-direction: column;
    gap: 14px;
    transition: transform .2s, box-shadow .2s, border-color .2s;
}
.np-gov-trio-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--np-shadow-lg);
    border-color: var(--np-brand-light);
}
.np-gov-trio-card--schedule { border-top: 4px solid #c8922a; }
.np-gov-trio-card--gov-profile { border-top: 4px solid var(--np-brand-light); }
.np-gov-trio-card--after-result { border-top: 4px solid #059669; }
.np-gov-trio-card-head { display: flex; align-items: flex-start; gap: 12px; }
.np-gov-trio-card-head h3 { margin: 0; font-size: .98rem; font-weight: 800; color: var(--np-brand); line-height: 1.45; }
.np-gov-trio-highlights {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 10px;
}
.np-gov-trio-highlights li {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 10px 12px;
    background: var(--np-surface-2, #f8fafc);
    border-radius: var(--np-radius-sm);
    border: 1px solid var(--np-border);
}
.np-gov-trio-hl-icon {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    display: grid;
    place-items: center;
    background: var(--np-surface);
    color: var(--np-brand-light);
    flex-shrink: 0;
    font-size: .85rem;
}
.np-gov-trio-highlights strong { display: block; font-size: .78rem; color: var(--np-brand); margin-bottom: 2px; }
.np-gov-trio-highlights span { font-size: .8rem; color: var(--np-text-2); line-height: 1.55; font-weight: 600; }
.np-gov-trio-text p { margin: 0 0 8px; font-size: .84rem; color: var(--np-muted); line-height: 1.65; font-weight: 600; }
.np-gov-trio-text p:last-child { margin-bottom: 0; }

/* ── Inline coord in student result ── */
.np-result-coord {
    margin: 24px 0 0;
    padding: 22px;
    border-radius: var(--np-radius);
    border: 1px solid rgba(26, 111, 181, .2);
    background: linear-gradient(145deg, rgba(26,111,181,.06), rgba(5,150,105,.04));
    scroll-margin-top: 80px;
}
.np-result-coord-head {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    margin-bottom: 18px;
}
.np-result-coord-icon {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, var(--coord-accent, #1a6fb5), #059669);
    color: #fff;
    font-size: 1.2rem;
    flex-shrink: 0;
    box-shadow: 0 8px 20px rgba(26,111,181,.25);
}
.np-result-coord-label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: .75rem;
    font-weight: 700;
    color: var(--coord-accent, #1a6fb5);
    margin-bottom: 4px;
}
.np-result-coord-head h3 { margin: 0 0 4px; font-size: 1.05rem; color: var(--np-brand); font-weight: 800; }
.np-result-coord-head p { margin: 0; font-size: .85rem; color: var(--np-muted); font-weight: 600; line-height: 1.6; }
.np-result-coord-row {
    display: flex;
    gap: 10px;
    align-items: flex-end;
    flex-wrap: wrap;
}
.np-result-coord-field { flex: 1; min-width: 180px; }
.np-result-coord-field span { display: flex; align-items: center; gap: 6px; font-size: .78rem; font-weight: 700; color: var(--np-muted); margin-bottom: 6px; }
.np-result-coord-field .np-input {
    width: 100%;
    padding: 12px 14px;
    font-size: 1rem;
    font-weight: 700;
}
.np-result-coord-btn { white-space: nowrap; }
.np-result-coord-quick {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 12px;
    font-size: .78rem;
    color: var(--np-muted);
    font-weight: 600;
}
.np-coord-quick-btn {
    border: 1px solid var(--np-border);
    background: var(--np-surface);
    color: var(--np-brand);
    padding: 5px 12px;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 700;
    cursor: pointer;
    transition: background .15s, border-color .15s;
}
.np-coord-quick-btn:hover { background: rgba(26,111,181,.08); border-color: var(--np-brand-light); }
.np-result-coord-out {
    margin-top: 16px;
    padding: 16px;
    border-radius: var(--np-radius-sm);
    background: var(--np-surface);
    border: 1px solid var(--np-border);
}
.np-result-coord-out.is-success { border-color: rgba(5,150,105,.3); background: rgba(5,150,105,.05); }
.np-result-coord-out.is-error { border-color: rgba(220,38,38,.25); background: rgba(220,38,38,.04); }
.np-result-coord-out.is-loading { text-align: center; color: var(--np-muted); font-weight: 600; }
.np-result-aside-card--coord-mini { border: 1px dashed var(--np-brand-light); }

/* ── Level landing pages ── */
.np-hero--level {
    background: linear-gradient(160deg, var(--level-accent, #0d9488) 0%, #0f172a 100%);
    color: #fff;
    padding-bottom: 56px;
}
.np-hero--level .np-tag { background: rgba(255,255,255,.12); color: #fff; border-color: rgba(255,255,255,.2); }
.np-hero--level h1 { color: #fff; }
.np-hero--level p { color: rgba(255,255,255,.88); }
.np-hero--level .np-hero-features { color: rgba(255,255,255,.9); }
.np-hero--level .np-hero-features i { color: #a7f3d0; }
.np-level-hero-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 24px;
    align-items: start;
    direction: rtl;
}
.np-page-title-inline--hero {
    color: #fff;
    margin-bottom: 10px;
    font-size: clamp(1.2rem, 3vw, 1.65rem);
}
.np-page-title-icon--hero {
    background: rgba(255,255,255,.22);
    border-color: rgba(255,255,255,.34);
    color: #fff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .14);
}
.np-level-search-head {
    margin-bottom: 18px;
}
.np-level-search-head p {
    margin: 8px 0 0;
    font-size: .88rem;
    color: var(--np-muted);
    line-height: 1.65;
    font-weight: 600;
}
.np-level-hero-icon {
    width: 56px;
    height: 56px;
    border-radius: 16px;
    display: grid;
    place-items: center;
    font-size: 1.5rem;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.25);
    margin-bottom: 12px;
}
.np-level-stat-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    min-width: 240px;
}
.np-level-stat-card {
    background: rgba(255,255,255,.1);
    border: 1px solid rgba(255,255,255,.18);
    border-radius: var(--np-radius-sm);
    padding: 12px;
    text-align: center;
}
.np-level-stat-card strong { display: block; font-size: 1.1rem; color: #fff; }
.np-level-stat-card span { font-size: .72rem; color: rgba(255,255,255,.75); font-weight: 600; }
/* أيقونات الهيرو على خلفية داكنة — أبيض دائماً (prep1, prep2, sec…) */
.np-hero--level .np-level-stat-card .np-ico-box {
    background: rgba(255, 255, 255, .22);
    border: 1px solid rgba(255, 255, 255, .34);
    color: #fff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .14);
}
.np-hero--level .np-page-title-icon--hero {
    background: rgba(255, 255, 255, .22);
    border: 1px solid rgba(255, 255, 255, .34);
    color: #fff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .14);
}
.np-hero--level .np-tag i,
.np-hero--level .np-status i {
    opacity: 1;
}
.np-level-search-block {
    margin-top: clamp(-48px, -6vw, -36px);
    position: relative;
    z-index: 2;
    padding-bottom: 32px;
    width: 100%;
    max-width: 100%;
}
.np-level-search-card {
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius);
    padding: 28px;
    box-shadow: var(--np-shadow-lg);
    border-top: 4px solid var(--level-accent, var(--np-brand-light));
}
.np-level-soon-panel {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 16px 18px;
    margin-bottom: 18px;
    border-radius: var(--np-radius-sm);
    background: linear-gradient(135deg, rgba(200,146,42,.12), rgba(234,88,12,.06));
    border: 1px solid rgba(200,146,42,.35);
    transition: box-shadow .3s, transform .3s;
}
.np-level-soon-panel.is-flash {
    animation: np-soon-flash .9s ease;
}
@keyframes np-soon-flash {
    0%, 100% { box-shadow: none; }
    50% { box-shadow: 0 0 0 4px rgba(200,146,42,.25); transform: scale(1.01); }
}
.np-level-soon-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: #c8922a;
    color: #fff;
    flex-shrink: 0;
}
.np-level-soon-panel strong { display: block; color: #92400e; font-size: .95rem; margin-bottom: 4px; }
.np-level-soon-panel p { margin: 0; font-size: .84rem; color: #78350f; line-height: 1.6; font-weight: 600; }
.np-level-soon-badge {
    margin-inline-start: auto;
    align-self: center;
    padding: 6px 12px;
    border-radius: 999px;
    background: #c8922a;
    color: #fff;
    font-size: .72rem;
    font-weight: 800;
    white-space: nowrap;
}
.np-level-search-hint {
    margin: 12px 0 0;
    font-size: .8rem;
    color: var(--np-muted);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
}
.np-level-blocks {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    padding-bottom: 32px;
}
.np-level-blocks--grid {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}
.np-level-block {
    display: flex;
    gap: 16px;
    padding: 22px;
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius);
    box-shadow: var(--np-shadow);
}
.np-level-block h2 { margin: 0 0 10px; font-size: 1rem; color: var(--np-brand); font-weight: 800; }
.np-level-block p { margin: 0 0 8px; font-size: .88rem; color: var(--np-text-2); line-height: 1.7; font-weight: 600; }
.np-level-govs { padding-bottom: 40px; }
.np-level-govs-head { margin-bottom: 18px; }
.np-level-govs-head p { margin: 6px 0 0; color: var(--np-muted); font-size: .88rem; font-weight: 600; }
.np-level-gov-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 12px;
    direction: rtl;
}
.np-level-gov-card {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 16px;
    border-radius: var(--np-radius-sm);
    border: 1px solid var(--np-border);
    background: var(--np-surface);
    box-shadow: var(--np-shadow);
    text-decoration: none;
    color: inherit;
    transition: transform .15s, border-color .15s, box-shadow .15s;
    border-inline-start: 4px solid var(--accent, var(--np-brand-light));
}
.np-level-gov-card--live:hover {
    transform: translateY(-2px);
    border-color: var(--accent);
    box-shadow: var(--np-shadow-lg);
}
.np-level-gov-card--soon { opacity: .92; background: var(--np-surface-2, #f8fafc); }
.np-level-gov-card strong { font-size: .95rem; color: var(--np-brand); }
.np-level-gov-card span { font-size: .78rem; color: var(--np-muted); line-height: 1.55; flex: 1; font-weight: 600; }
.np-level-gov-card em {
    font-style: normal;
    font-size: .75rem;
    font-weight: 800;
    color: var(--accent, var(--np-brand-light));
}
.np-level-gov-status {
    align-self: flex-start;
    font-size: .68rem;
    font-weight: 800;
    padding: 4px 10px;
    border-radius: 999px;
    background: var(--np-surface-2);
    color: var(--np-muted);
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.np-level-gov-status--live { background: var(--np-live, #059669); color: #fff; }

/* Level hero — per-stage colors */
.np-hero--level {
    background: linear-gradient(155deg, var(--level-accent, #0d9488) 0%, var(--level-accent-2, #0f766e) 45%, #0f172a 100%);
}
.np-hero--prep1 { background: linear-gradient(155deg, #6d28d9 0%, #a855f7 40%, #312e81 100%); }
.np-hero--prep1 .np-hero-features i { color: #ddd6fe; }
.np-hero--prep2 { background: linear-gradient(155deg, #2563eb 0%, #3b82f6 40%, #1e3a8a 100%); }
.np-hero--prep2 .np-hero-features i { color: #bfdbfe; }
.np-hero--sec1 { background: linear-gradient(155deg, #ea580c 0%, #f97316 40%, #7c2d12 100%); }
.np-hero--sec1 .np-hero-features i { color: #fed7aa; }
.np-hero--sec2 { background: linear-gradient(155deg, #dc2626 0%, #ef4444 40%, #881337 100%); }
.np-hero--sec2 .np-hero-features i { color: #fecaca; }
html.np-level-prep1 .np-level-search-card { border-top-color: #7c3aed; }
html.np-level-prep2 .np-level-search-card { border-top-color: #2563eb; }
html.np-level-sec1 .np-level-search-card { border-top-color: #ea580c; }
html.np-level-sec2 .np-level-search-card { border-top-color: #dc2626; }

/* Level governorates — compact tiles v2 */
.np-level-govs-v2 { padding-bottom: 44px; direction: rtl; }
.np-level-govs-v2 .np-level-govs-head { margin-bottom: 16px; text-align: right; }
.np-level-govs-v2 .np-section-title {
    margin: 0;
    font-size: clamp(1.05rem, 2.5vw, 1.25rem);
    font-weight: 900;
    color: var(--np-brand);
    display: inline-flex;
    align-items: center;
    gap: 10px;
}
.np-level-govs-v2 .np-section-title i { color: var(--level-accent, var(--np-brand-light)); }
.np-level-govs-sub {
    margin: 8px 0 0;
    font-size: .9rem;
    font-weight: 600;
    color: var(--np-muted);
    line-height: 1.65;
}
.np-level-govs-meta {
    margin: 10px 0 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    font-size: .78rem;
    font-weight: 700;
    color: var(--np-text-3);
}
.np-level-govs-meta-dot { opacity: .45; }

/* شبكة محافظات صفحات المراحل — v3 */
.np-level-govs-v3 .np-level-govs-meta {
    margin: 8px 0 0;
    font-size: .8rem;
    line-height: 1.6;
    color: var(--np-text-3);
}
.np-level-govs-v3 .np-section-title i { color: var(--level-accent, var(--np-brand-light)); }
.np-level-gov-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 12px;
    direction: rtl;
}
.np-level-govs-v3 .np-level-gov-grid {
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 14px;
}
.np-level-gov-box {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    padding: 14px 16px;
    border-radius: 16px;
    border: 1px solid var(--np-border);
    background: #fff;
    box-shadow: 0 2px 10px rgba(15, 23, 42, .05);
    text-decoration: none;
    color: inherit;
    transition: border-color .2s, box-shadow .2s, transform .15s;
    overflow: hidden;
    min-height: 0;
}
.np-level-govs-v3 .np-level-gov-box::before {
    content: '';
    position: absolute;
    inset-inline-start: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: var(--accent, var(--np-brand-light));
    border-radius: 0 4px 4px 0;
}
.np-level-gov-box-top {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
}
.np-level-govs-v3 .np-gov-live-badge--level,
.np-level-govs-v3 .np-gov-live-badge--legacy,
.np-level-govs-v3 .np-gov-live-badge--off {
    position: static;
    margin-inline-start: auto;
    flex-shrink: 0;
}
.np-level-gov-box--live {
    border-color: color-mix(in srgb, #059669 45%, var(--np-border));
    background: linear-gradient(135deg, #fff 0%, color-mix(in srgb, #059669 10%, #fff) 100%);
    box-shadow: 0 4px 16px rgba(5, 150, 105, .1);
}
.np-level-govs-v3 .np-level-gov-box--live::before {
    background: linear-gradient(180deg, #059669, #10b981);
    width: 5px;
}
.np-level-gov-box--live:hover {
    border-color: color-mix(in srgb, var(--accent, #059669) 50%, var(--np-border));
    box-shadow: 0 10px 28px rgba(15, 23, 42, .09);
    transform: translateY(-2px);
    text-decoration: none;
}
.np-level-gov-box--soon {
    opacity: .9;
    background: var(--np-surface-2, #f8fafc);
}
.np-level-govs-v3 .np-level-gov-box--soon::before { opacity: .4; }
.np-level-gov-box--soon:hover {
    opacity: 1;
    border-color: color-mix(in srgb, var(--accent) 25%, var(--np-border));
    box-shadow: 0 6px 20px rgba(15, 23, 42, .07);
    transform: translateY(-1px);
    text-decoration: none;
}
.np-level-gov-box-ico {
    flex-shrink: 0;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: color-mix(in srgb, var(--accent, var(--np-brand-light)) 14%, #fff);
    color: var(--accent, var(--np-brand-light));
    font-size: .95rem;
    overflow: hidden;
}
.np-level-gov-box-ico img { width: 100%; height: 100%; object-fit: cover; }
.np-level-gov-box-body {
    display: flex;
    flex-direction: column;
    gap: 6px;
    text-align: right;
    min-width: 0;
    width: 100%;
}
.np-level-gov-box-title {
    display: block;
    margin: 0;
    font-size: .92rem;
    font-weight: 900;
    color: var(--np-brand);
    line-height: 1.4;
    overflow-wrap: anywhere;
}
.np-level-govs-v3 .np-level-gov-box-title {
    font-size: .95rem;
}
.np-level-gov-box-foot {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: auto;
    padding-top: 4px;
    font-size: .76rem;
    font-weight: 800;
    color: var(--np-brand-light);
}
.np-level-gov-box--live .np-level-gov-box-foot { color: #059669; }
.np-level-gov-box-foot i { font-size: .7rem; opacity: .7; }
.np-level-gov-box-hint {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: .74rem;
    font-weight: 700;
    color: var(--np-text-3);
}
.np-level-gov-box-hint i { color: var(--level-accent, var(--np-brand-light)); font-size: .7rem; }
.np-gov-live-badge--legacy {
    background: linear-gradient(135deg, #64748b 0%, #94a3b8 100%);
    color: #fff;
}
@media (max-width: 640px) {
    .np-level-gov-grid,
    .np-level-govs-v3 .np-level-gov-grid { grid-template-columns: 1fr; gap: 10px; }
    .np-level-gov-box { padding: 12px 14px; }
    .np-gov-live-badge { font-size: .68rem; padding: 4px 9px; }
}

/* News — professional feed from main site */
.np-news-pro { margin-bottom: 36px; scroll-margin-top: 80px; }
.np-news-pro-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}
.np-news-pro-title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 6px;
    font-size: clamp(1.05rem, 2.4vw, 1.3rem);
    font-weight: 900;
    color: var(--np-brand);
}
.np-news-pro-sub {
    margin: 0;
    font-size: .86rem;
    color: var(--np-muted);
    font-weight: 600;
}
.np-news-pro-more {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    border-radius: 999px;
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    font-size: .82rem;
    font-weight: 800;
    color: var(--np-brand-light);
    text-decoration: none;
    box-shadow: var(--np-shadow);
    transition: transform .15s, border-color .15s;
}
.np-news-pro-more:hover {
    transform: translateY(-2px);
    border-color: var(--np-brand-light);
    text-decoration: none;
    color: var(--np-brand);
}
.np-news-pro-grid {
    display: grid;
    grid-template-columns: 1.15fr 1fr;
    gap: 16px;
    direction: rtl;
}
.np-news-pro-lead {
    display: flex;
    flex-direction: column;
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius);
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    box-shadow: var(--np-shadow-lg);
    transition: transform .2s, box-shadow .2s, border-color .2s;
    direction: rtl;
}
.np-news-pro-lead:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 48px rgba(10,37,64,.14);
    border-color: rgba(26,111,181,.35);
    text-decoration: none;
    color: inherit;
}
.np-news-pro-lead-media {
    position: relative;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: linear-gradient(135deg, #0a2540, #1a6fb5);
}
.np-news-pro-lead-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .45s;
}
.np-news-pro-lead:hover .np-news-pro-lead-media img { transform: scale(1.05); }
.np-news-pro-lead-fallback {
    display: grid;
    place-items: center;
    height: 100%;
    font-size: 3rem;
    color: rgba(255,255,255,.35);
}
.np-news-pro-read {
    position: absolute;
    inset-inline-start: 14px;
    bottom: 14px;
    padding: 8px 14px;
    border-radius: 999px;
    background: rgba(5,150,105,.92);
    color: #fff;
    font-size: .78rem;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.np-news-pro-lead-body { padding: 18px 20px 22px; }
.np-news-pro-tag {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: .68rem;
    font-weight: 900;
    background: rgba(26,111,181,.1);
    color: var(--np-brand-light);
    margin-bottom: 8px;
}
.np-news-pro-tag--sm { margin-bottom: 4px; font-size: .62rem; }
.np-news-pro-lead-body time {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: .76rem;
    color: var(--np-muted);
    font-weight: 600;
    margin-bottom: 8px;
}
.np-news-pro-lead-body h3 {
    margin: 0 0 10px;
    font-size: 1.08rem;
    font-weight: 900;
    color: var(--np-brand);
    line-height: 1.45;
}
.np-news-pro-lead-body p {
    margin: 0;
    font-size: .88rem;
    color: var(--np-text-2);
    line-height: 1.75;
    font-weight: 600;
}
.np-news-pro-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    direction: rtl;
}
.np-news-pro-item {
    display: grid;
    grid-template-columns: 88px 1fr auto;
    gap: 12px;
    align-items: center;
    padding: 12px 14px;
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius-sm);
    text-decoration: none;
    color: inherit;
    box-shadow: var(--np-shadow);
    transition: border-color .15s, transform .15s, box-shadow .15s;
    direction: rtl;
}
.np-news-pro-item:hover {
    border-color: rgba(26,111,181,.35);
    transform: translateX(-3px);
    box-shadow: 0 8px 24px rgba(26,111,181,.1);
    text-decoration: none;
    color: inherit;
}
.np-news-pro-thumb {
    width: 88px;
    height: 62px;
    border-radius: 10px;
    overflow: hidden;
    background: var(--np-bg);
    display: block;
}
.np-news-pro-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.np-news-pro-thumb--icon {
    display: grid;
    place-items: center;
    color: var(--np-brand-light);
    font-size: 1.2rem;
    background: rgba(26,111,181,.08);
}
.np-news-pro-item-body {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}
.np-news-pro-item-body strong {
    font-size: .88rem;
    font-weight: 800;
    color: var(--np-brand);
    line-height: 1.45;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.np-news-pro-item-body time {
    font-size: .72rem;
    color: var(--np-muted);
    font-weight: 600;
}
.np-news-pro-item-go {
    color: var(--np-brand-light);
    font-size: .85rem;
    flex-shrink: 0;
}

/* News hub (legacy) */
.np-news-hub { margin-bottom: 32px; scroll-margin-top: 80px; }
.np-news-hub-head {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 18px;
}
.np-news-hub-sub { margin: 0; font-size: .86rem; color: var(--np-muted); font-weight: 600; }
.np-news-hub-grid {
    display: grid;
    grid-template-columns: 1.2fr 1fr 1fr;
    gap: 14px;
}
.np-news-hub-card {
    position: relative;
    padding: 18px 20px;
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius-sm);
    box-shadow: var(--np-shadow);
    transition: border-color .2s, box-shadow .2s, transform .2s;
}
.np-news-hub-card:hover {
    border-color: rgba(26,111,181,.35);
    box-shadow: 0 10px 28px rgba(26,111,181,.12);
    transform: translateY(-2px);
}
.np-news-hub-card--lead {
    background: linear-gradient(145deg, rgba(26,111,181,.08), rgba(124,58,237,.05));
    border-color: rgba(26,111,181,.25);
    grid-row: span 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.np-news-hub-tag {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: .68rem;
    font-weight: 900;
    background: rgba(26,111,181,.12);
    color: var(--np-brand-light);
    margin-bottom: 10px;
    align-self: flex-start;
}
.np-news-hub-card time {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: .76rem;
    color: var(--np-muted);
    font-weight: 600;
    margin-bottom: 8px;
}
.np-news-hub-card h3 {
    margin: 0 0 8px;
    font-size: .95rem;
    font-weight: 900;
    color: var(--np-brand);
    line-height: 1.45;
}
.np-news-hub-card--lead h3 { font-size: 1.1rem; }
.np-news-hub-card p {
    margin: 0;
    font-size: .86rem;
    color: var(--np-text-2);
    line-height: 1.75;
    font-weight: 600;
}

/* Edarat quick search */
.np-edarat-quick-search {
    margin-bottom: 20px;
    padding: 20px 22px;
    border-radius: var(--np-radius);
    border: 1px solid rgba(26,111,181,.25);
    background: linear-gradient(135deg, rgba(26,111,181,.08), rgba(5,150,105,.06));
    box-shadow: var(--np-shadow);
}
.np-edarat-quick-search-head {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 14px;
}
.np-edarat-quick-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    font-size: 1.1rem;
    color: #fff;
    background: linear-gradient(135deg, var(--edara-accent, #1a6fb5), #059669);
    flex-shrink: 0;
}
.np-edarat-quick-search-head strong {
    display: block;
    font-size: .95rem;
    color: var(--np-brand);
    margin-bottom: 4px;
}
.np-edarat-quick-search-head span {
    font-size: .82rem;
    color: var(--np-muted);
    font-weight: 600;
}
.np-edarat-quick-row {
    display: flex;
    align-items: stretch;
    gap: 0;
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius-sm);
    overflow: hidden;
    box-shadow: var(--np-shadow);
}
.np-edarat-quick-field-icon {
    display: grid;
    place-items: center;
    width: 48px;
    color: var(--edara-accent, var(--np-brand-light));
    background: var(--np-bg);
    border-inline-end: 1px solid var(--np-border);
    flex-shrink: 0;
}
.np-edarat-quick-row input {
    flex: 1;
    border: none;
    padding: 14px 16px;
    font-family: inherit;
    font-size: .95rem;
    font-weight: 600;
    background: transparent;
    color: var(--np-text);
    min-width: 0;
}
.np-edarat-quick-row input:focus { outline: none; }
.np-edarat-quick-row .np-btn { border-radius: 0; white-space: nowrap; }
.np-edarat-quick-hint {
    margin: 10px 0 0;
    font-size: .78rem;
    color: var(--np-muted);
    font-weight: 600;
}
.np-edarat-quick-hint i { margin-inline-end: 5px; color: var(--edara-accent, var(--np-brand-light)); }
.np-edarat-toolbar { margin-bottom: 16px; }

.np-level-toast {
    position: fixed;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%) translateY(120%);
    z-index: 9999;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 20px;
    border-radius: 999px;
    background: #0f172a;
    color: #fff;
    font-size: .88rem;
    font-weight: 700;
    box-shadow: 0 12px 40px rgba(0,0,0,.25);
    transition: transform .35s cubic-bezier(.34,1.56,.64,1);
    max-width: min(92vw, 480px);
}
.np-level-toast.is-visible { transform: translateX(-50%) translateY(0); }
.np-level-toast i { color: #c8922a; }
.hp-level--main {
    background: linear-gradient(135deg, var(--np-brand), #059669);
    color: #fff !important;
    border-color: transparent !important;
}
.hp-level--main i { color: #fff !important; }

.np-stat-strip {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 12px;
    padding-bottom: 32px;
}
.np-stat-strip-item {
    display: flex;
    align-items: center;
    gap: 12px;
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius-sm);
    padding: 14px 16px;
    box-shadow: var(--np-shadow);
}
.np-stat-strip-item strong { display: block; font-size: 1.1rem; color: var(--np-brand); font-weight: 800; line-height: 1.2; }
.np-stat-strip-item span { font-size: .75rem; color: var(--np-muted); font-weight: 600; }

/* ── Icon blocks grid ── */
.np-blocks--grid {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}
.np-block--icon {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    transition: transform .15s, box-shadow .15s;
}
.np-block--icon:hover { transform: translateY(-2px); box-shadow: var(--np-shadow-lg); }
.np-block--icon h2 { font-size: 1rem; margin-bottom: 8px; }
.np-block--icon h2::before { display: none; }

/* ── News ── */
.np-news { padding-bottom: 40px; }
.np-news-list { display: grid; gap: 12px; }
.np-news-item {
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-inline-start: 4px solid var(--np-accent);
    border-radius: var(--np-radius-sm);
    padding: 18px 20px;
    box-shadow: var(--np-shadow);
}
.np-news-item time { display: flex; align-items: center; gap: 6px; font-size: .78rem; color: var(--np-muted); font-weight: 600; margin-bottom: 6px; }
.np-news-item h3 { margin: 0 0 6px; font-size: .95rem; color: var(--np-brand); font-weight: 800; }
.np-news-item p { margin: 0; font-size: .88rem; color: var(--np-text-2); line-height: 1.7; }

/* ── Coordination page ── */
.np-hero--coord { padding-bottom: 72px; }
.np-hero-coord-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
}
.np-coord-hero-visual { flex-shrink: 0; }
.np-coord-hero-ring {
    width: 120px; height: 120px;
    border-radius: 50%;
    background: rgba(255,255,255,.12);
    border: 3px solid rgba(255,255,255,.25);
    display: grid;
    place-items: center;
    font-size: 2.5rem;
    animation: np-coord-float 3s ease-in-out infinite;
}
@keyframes np-coord-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
}
.np-coord-layout {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 24px;
    padding: 32px 0 40px;
    margin-top: -36px;
    position: relative;
    z-index: 2;
}
.np-coord-card--premium { padding: 28px; }
.np-coord-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }
.np-coord-field-label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: .85rem;
    font-weight: 700;
    color: var(--np-text-2);
    margin-bottom: 6px;
}
.np-coord-field-label i { color: var(--np-brand-light); width: 16px; text-align: center; }
.np-coord-quick {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
    font-size: .82rem;
    color: var(--np-muted);
    font-weight: 600;
}
.np-coord-quick-btn {
    border: 1px solid var(--np-border);
    background: var(--np-surface-2);
    color: var(--np-brand);
    padding: 5px 12px;
    border-radius: 999px;
    font: inherit;
    font-size: .82rem;
    font-weight: 700;
    cursor: pointer;
    transition: all .15s;
}
.np-coord-quick-btn:hover { border-color: var(--np-brand-light); background: #fff; }
.np-coord-result-panel {
    margin-top: 24px;
    padding: 24px;
    border-radius: var(--np-radius-sm);
    border: 1px solid var(--np-border);
    background: var(--np-surface-2);
}
.np-coord-result-panel.is-success { background: linear-gradient(135deg, #ecfdf5 0%, #f0fdf4 100%); border-color: #a7f3d0; }
.np-coord-result-panel.is-error { background: var(--np-danger-soft); border-color: #fecaca; }
.np-coord-loading, .np-coord-error { display: flex; align-items: center; gap: 12px; font-weight: 600; }
.np-coord-out-head { display: flex; gap: 16px; align-items: flex-start; margin-bottom: 20px; }
.np-coord-out-head h3 { margin: 0 0 4px; font-size: 1.05rem; color: var(--np-brand); }
.np-coord-out-head p { margin: 0; font-size: .92rem; color: var(--np-text-2); line-height: 1.7; }
.np-coord-percent-bar { margin-bottom: 20px; }
.np-coord-percent-top { display: flex; justify-content: space-between; margin-bottom: 8px; font-size: .88rem; font-weight: 600; }
.np-coord-percent-top strong { font-size: 1.2rem; color: var(--np-brand); }
.np-coord-bar {
    height: 10px;
    background: rgba(5,150,105,.15);
    border-radius: 999px;
    overflow: hidden;
}
.np-coord-bar span {
    display: block;
    height: 100%;
    width: calc(var(--pct, 0) * 1%);
    background: linear-gradient(90deg, #059669, #34d399);
    border-radius: 999px;
    transition: width .8s ease;
}
.np-coord-promo {
    display: flex;
    gap: 14px;
    align-items: center;
    padding: 16px;
    border-radius: var(--np-radius-sm);
    margin-bottom: 16px;
    font-weight: 600;
}
.np-coord-promo.is-good { background: #d1fae5; color: #065f46; }
.np-coord-promo.is-warn { background: #fef3c7; color: #92400e; }
.np-coord-promo.is-neutral { background: var(--np-bg-2); color: var(--np-text-2); }
.np-coord-promo i { font-size: 1.5rem; }
.np-coord-promo strong { display: block; font-size: .95rem; }
.np-coord-promo span { font-size: .82rem; opacity: .85; }
.np-coord-tracks-out h4 { margin: 0 0 12px; font-size: .95rem; color: var(--np-brand); display: flex; align-items: center; gap: 8px; }
.np-coord-tracks-out ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.np-coord-track-out {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px;
    background: #fff;
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius-sm);
}
.np-coord-track-out.is-high { border-inline-start: 4px solid #059669; }
.np-coord-track-out.is-med { border-inline-start: 4px solid #1a6fb5; }
.np-coord-track-out.is-border { border-inline-start: 4px solid #d97706; }
.np-coord-track-rank {
    width: 24px; height: 24px;
    border-radius: 50%;
    background: var(--np-brand);
    color: #fff;
    font-size: .72rem;
    font-weight: 800;
    display: grid;
    place-items: center;
    flex-shrink: 0;
}
.np-coord-track-body strong { display: block; font-size: .9rem; color: var(--np-brand); }
.np-coord-conf {
    display: inline-block;
    font-size: .72rem;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 999px;
    background: var(--np-live-soft);
    color: #065f46;
    margin-inline-start: 6px;
}
.np-coord-track-body small { display: block; font-size: .78rem; color: var(--np-muted); margin-top: 2px; }
.np-coord-gap { color: var(--np-live) !important; font-weight: 700; }
.np-coord-disclaimer { margin: 16px 0 0; font-size: .8rem; color: var(--np-muted); display: flex; gap: 8px; align-items: flex-start; }
.np-coord-steps { margin-top: 32px; }
.np-steps-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 16px; }
.np-steps-list li { display: flex; gap: 14px; align-items: flex-start; }
.np-step-num {
    width: 36px; height: 36px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--np-brand), var(--np-brand-light));
    color: #fff;
    font-weight: 800;
    display: grid;
    place-items: center;
    flex-shrink: 0;
    font-size: .9rem;
}
.np-steps-list strong { display: block; font-size: .92rem; color: var(--np-brand); margin-bottom: 2px; }
.np-steps-list p { margin: 0; font-size: .85rem; color: var(--np-muted); line-height: 1.6; }
.np-coord-aside { display: flex; flex-direction: column; gap: 16px; }
.np-coord-tracks-preview, .np-coord-tip-card {
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius);
    padding: 20px;
    box-shadow: var(--np-shadow);
}
.np-coord-tracks-preview h3, .np-coord-tip-card h3 { margin: 0 0 8px; font-size: .95rem; color: var(--np-brand); display: flex; align-items: center; gap: 8px; }
.np-coord-aside-desc { margin: 0 0 14px; font-size: .82rem; color: var(--np-muted); }
.np-coord-track-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.np-coord-track-item { display: flex; gap: 12px; align-items: flex-start; padding-bottom: 10px; border-bottom: 1px dashed var(--np-border); }
.np-coord-track-item:last-child { border-bottom: 0; padding-bottom: 0; }
.np-coord-track-item strong { display: block; font-size: .85rem; color: var(--np-text); line-height: 1.4; }
.np-coord-track-item small { font-size: .75rem; color: var(--np-muted); }
.np-coord-tip-card p { margin: 0; font-size: .85rem; color: var(--np-text-2); line-height: 1.7; }
.np-coord-tip-card--warn { border-color: #fecaca; background: #fffbfb; }

/* ── Result page premium ── */
.np-result-success-banner {
    display: flex;
    align-items: center;
    gap: 12px;
    background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
    border: 1px solid #a7f3d0;
    border-radius: var(--np-radius);
    padding: 18px 22px;
    margin-bottom: 20px;
}
.np-result-success-emoji {
    font-size: 2rem;
    line-height: 1;
    flex-shrink: 0;
    filter: drop-shadow(0 2px 6px rgba(5, 150, 105, .25));
    animation: np-hero-pop 2.5s ease-in-out infinite;
}
.np-result-success-banner--legacy .np-result-success-emoji {
    filter: drop-shadow(0 2px 6px rgba(220, 38, 38, .2));
}
.np-result-success-icon {
    width: 52px; height: 52px;
    border-radius: 50%;
    background: linear-gradient(135deg, #059669, #34d399);
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 1.3rem;
    flex-shrink: 0;
    box-shadow: 0 6px 16px rgba(5,150,105,.3);
}
.np-result-success-banner strong { display: block; font-size: 1rem; color: #065f46; }
.np-result-success-banner span { font-size: .85rem; color: #047857; }
.np-result-success-banner--legacy {
    background: linear-gradient(135deg, rgba(220, 38, 38, .1) 0%, rgba(254, 202, 202, .2) 100%);
    border-color: rgba(220, 38, 38, .4);
}
.np-result-success-banner--legacy .np-result-success-icon {
    background: linear-gradient(135deg, #dc2626, #ef4444);
    box-shadow: 0 6px 16px rgba(220, 38, 38, .28);
}
.np-result-success-banner--legacy strong { color: #991b1b; }
.np-result-success-banner--legacy span { color: #b91c1c; }
.np-result-list-banner--legacy {
    border-color: rgba(220, 38, 38, .35);
    background: linear-gradient(135deg, rgba(254, 242, 242, .95), rgba(254, 226, 226, .6));
}
.np-result-layout {
    display: grid;
    grid-template-columns: 1fr 300px;
    grid-template-areas:
        "cert aside"
        "share share";
    gap: 24px;
    align-items: start;
}
.np-result-layout--coord {
    grid-template-areas:
        "cert aside"
        "coord aside"
        "share share";
}
.np-result-cert { grid-area: cert; min-width: 0; }
.np-result-coord-slot { grid-area: coord; min-width: 0; }
.np-result-share-span {
    grid-area: share;
    position: relative;
    z-index: 5;
}
.np-result-aside {
    grid-area: aside;
    display: flex;
    flex-direction: column;
    gap: 16px;
    position: sticky;
    top: calc(var(--np-header-h, 72px) + 16px);
    align-self: start;
    max-height: calc(100vh - var(--np-header-h, 72px) - 32px);
    overflow-y: auto;
}
.np-result-cert-topbar {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    padding: 12px 28px;
    background: var(--np-brand);
    color: rgba(255,255,255,.9);
    font-size: .78rem;
    font-weight: 600;
}
.np-result-cert-topbar span { display: inline-flex; align-items: center; gap: 6px; }
.np-avatar--xl { width: 88px; height: 88px; border-radius: 24px; font-size: 2.2rem; }
.np-result-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.np-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 14px;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 700;
}
.np-chip--seat { background: var(--np-bg-2); color: var(--np-text-2); }
.np-chip--grade { background: var(--np-live-soft); color: #065f46; }
.np-result-ring--lg { width: 140px; height: 140px; }
.np-result-ring--lg .np-result-ring-text strong { font-size: 1.6rem; }
.np-result-stats--icons {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 12px;
    padding: 20px 28px;
    border-bottom: 1px solid var(--np-border);
}
.np-result-stat-tile {
    background: var(--np-surface-2);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius-sm);
    padding: 16px;
    text-align: center;
}
.np-result-stat-tile .np-ico-box { margin: 0 auto 10px; }
.np-result-stat-tile strong { display: block; font-size: 1.05rem; color: var(--np-brand); font-weight: 800; line-height: 1.35; word-break: break-word; }
.np-result-stat-tile > span:last-of-type { font-size: .72rem; color: var(--np-muted); font-weight: 600; }
.np-result-stat-tile--wide { grid-column: 1 / -1; }
.np-mini-bar {
    height: 4px;
    background: var(--np-bg-2);
    border-radius: 999px;
    margin-top: 10px;
    overflow: hidden;
}
.np-mini-bar span {
    display: block;
    height: 100%;
    width: calc(var(--pct, 0) * 1%);
    background: var(--accent, var(--np-brand-light));
    border-radius: 999px;
}
.np-result-insights {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    padding: 0 28px 20px;
}
.np-result-insight {
    display: flex;
    gap: 12px;
    align-items: center;
    padding: 14px;
    border-radius: var(--np-radius-sm);
    font-size: .85rem;
}
.np-result-insight i { font-size: 1.2rem; }
.np-result-insight span { display: block; font-size: .72rem; font-weight: 600; opacity: .8; }
.np-result-insight strong { display: block; font-size: .9rem; font-weight: 800; }
.np-result-insight small { font-size: .78rem; opacity: .85; }
.np-result-insight--best { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.np-result-insight--focus { background: #fef3c7; color: #92400e; border: 1px solid #fde68a; }
.np-result-subject--rich {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    background: var(--np-surface-2);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius-sm);
    padding: 14px;
}
.np-subject-icon {
    width: 40px; height: 40px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(26,111,181,.12), rgba(10,37,64,.06));
    color: var(--np-brand-light);
    display: grid;
    place-items: center;
    font-size: .95rem;
    flex-shrink: 0;
}
.np-subject-body { flex: 1; min-width: 0; }
.np-table-icon { color: var(--np-brand-light); margin-inline-end: 6px; width: 16px; text-align: center; }
.np-result-aside-card {
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius);
    padding: 20px;
    box-shadow: var(--np-shadow);
}
.np-result-aside-card--accent {
    border-color: color-mix(in srgb, var(--aside-color, var(--np-brand-light)) 30%, var(--np-border));
    background: linear-gradient(160deg, color-mix(in srgb, var(--aside-color) 6%, #fff), #fff);
}
.np-result-aside-card h3 { margin: 0 0 10px; font-size: .95rem; color: var(--np-brand); display: flex; align-items: center; gap: 8px; }
.np-result-aside-card p { margin: 0 0 14px; font-size: .85rem; color: var(--np-muted); line-height: 1.6; }
.np-result-next-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.np-result-next-list a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: var(--np-radius-sm);
    font-size: .88rem;
    font-weight: 600;
    color: var(--np-text-2);
    background: var(--np-surface-2);
    border: 1px solid var(--np-border);
    transition: all .15s;
    text-decoration: none;
}
.np-result-next-list a:hover { border-color: var(--np-brand-light); color: var(--np-brand); background: #fff; text-decoration: none; }
.np-result-next-list i { color: var(--np-brand-light); width: 18px; text-align: center; }
.np-result-aside-card--tip { display: flex; gap: 12px; align-items: flex-start; }
.np-result-aside-card--tip p { margin: 0; }
.np-result-list-banner {
    display: flex;
    gap: 18px;
    align-items: center;
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius);
    padding: 22px 24px;
    margin-bottom: 20px;
    box-shadow: var(--np-shadow);
}
.np-result-list-banner h2 { margin: 0 0 4px; font-size: 1.15rem; color: var(--np-brand); }
.np-result-list-banner p { margin: 0; font-size: .88rem; color: var(--np-muted); }
.np-result-card--rich {
    grid-template-columns: auto auto 1fr auto auto;
    align-items: center;
}
.np-result-card-icon {
    width: 42px; height: 42px;
    border-radius: 12px;
    background: var(--np-surface-2);
    color: var(--np-brand-light);
    display: grid;
    place-items: center;
    font-size: 1rem;
}
.np-result-card-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.np-result-card--rich .np-result-card-school { grid-column: auto; }

@media print {
    .np-topbar, .np-header, .np-seo-bar, .np-footer, .np-result-toolbar, .np-result-table-toggle, .np-breadcrumbs, .np-result-aside, .np-result-success-banner { display: none !important; }
    .np-result-layout { grid-template-columns: 1fr; }
    .np-result-cert { box-shadow: none; border: 1px solid #ccc; }
    body.natiga-portal { background: #fff; }
}

/* ═══════════════════════════════════════════════════════
   Header v3 — هادئ + drawer
   ═══════════════════════════════════════════════════════ */
:root {
    --np-header-h: 55px;
    --hp-radius: 22px;
}

.np-header-v3 {
    position: sticky;
    top: 0;
    z-index: 200;
    direction: rtl;
    text-align: right;
    background: rgba(248, 250, 252, .88);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-bottom: 1px solid rgba(10, 37, 64, .06);
    transition: transform .28s cubic-bezier(.4, 0, .2, 1);
    will-change: transform;
}
.np-header-v3.is-hidden {
    transform: translateY(-100%);
    pointer-events: none;
}
.np-header-v3--dark {
    background: #0f172a;
    border-bottom: 1px solid rgba(255, 255, 255, .08);
    box-shadow: 0 1px 0 rgba(255, 255, 255, .04);
}
.np-header-v3-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: var(--np-header-h);
    gap: 16px;
    direction: rtl;
}
.np-brand-v3 {
    display: flex;
    align-items: center;
    gap: 0;
    padding-block: 3px;
    text-decoration: none;
    color: var(--np-brand);
    min-width: 0;
    flex: 0 0 auto;
}
.np-brand-v3:hover { text-decoration: none; opacity: .95; }
.np-brand-v3-icon-img {
    width: 32px;
    height: 32px;
    border-radius: 9px;
    object-fit: contain;
    flex-shrink: 0;
}
.np-brand-v3-logo {
    display: block;
    width: 180px;
    height: 45px;
    max-width: min(180px, 52vw);
    max-height: 45px;
    object-fit: contain;
    object-position: center;
    flex-shrink: 0;
}
.np-header-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}
.np-header-pill {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 12px;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 800;
    text-decoration: none;
    border: 1px solid transparent;
    transition: background .2s, border-color .2s, transform .15s;
    white-space: nowrap;
}
.np-header-pill:hover { text-decoration: none; transform: translateY(-1px); }
.np-header-pill--thanwya {
    color: #e9d5ff;
    background: rgba(124, 58, 237, .18);
    border-color: rgba(167, 139, 250, .25);
}
.np-header-pill--thanwya:hover { background: rgba(124, 58, 237, .28); color: #f5f3ff; }
.np-header-pill--tg {
    color: #bae6fd;
    background: rgba(34, 158, 217, .15);
    border-color: rgba(56, 189, 248, .22);
}
.np-header-pill--tg:hover { background: rgba(34, 158, 217, .28); color: #fff; }
.np-header-pill--prep {
    color: #fce7f3;
    background: rgba(146, 43, 74, .22);
    border-color: rgba(201, 120, 158, .35);
}
.np-header-pill--prep:hover {
    background: rgba(146, 43, 74, .35);
    color: #fff;
}
.np-header-pill--primary {
    color: #cffafe;
    background: linear-gradient(135deg, rgba(8, 145, 178, .28), rgba(6, 182, 212, .18));
    border-color: rgba(34, 211, 238, .35);
    box-shadow: 0 0 0 1px rgba(6, 182, 212, .08) inset;
}
.np-header-pill--primary:hover {
    background: linear-gradient(135deg, rgba(8, 145, 178, .42), rgba(6, 182, 212, .32));
    color: #fff;
    border-color: rgba(103, 232, 249, .45);
}
.np-header-pill--primary i {
    color: #67e8f9;
    filter: drop-shadow(0 0 6px rgba(34, 211, 238, .45));
}
.np-header-pill--desktop-only { display: none !important; }
@media (min-width: 1025px) {
    .np-header-pill--desktop-only { display: inline-flex !important; }
}
.np-header-pill i { font-size: .95rem; }
.np-header-pill-text { line-height: 1; }

/* تليجرام عائم — موبايل عند التمرير لأسفل */
.np-tg-float {
    position: fixed;
    inset-inline-start: 14px;
    bottom: calc(14px + env(safe-area-inset-bottom, 0px));
    z-index: 190;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 16px;
    border-radius: 999px;
    background: linear-gradient(135deg, #229ED9 0%, #1a7fb5 100%);
    color: #fff;
    font-size: .82rem;
    font-weight: 800;
    text-decoration: none;
    box-shadow: 0 8px 28px rgba(34, 158, 217, .45);
    transform: translateY(120%);
    opacity: 0;
    pointer-events: none;
    transition: transform .3s cubic-bezier(.4, 0, .2, 1), opacity .3s;
}
.np-tg-float.is-visible {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
}
.np-tg-float:hover { color: #fff; text-decoration: none; opacity: .95; }
.np-tg-float i { font-size: 1.15rem; }
.np-header-v3--dark .np-brand-v3 { color: #f8fafc; }
.np-header-v3--dark .np-drawer-toggle {
    background: rgba(255, 255, 255, .04);
    border-color: rgba(255, 255, 255, .12);
    color: #f8fafc;
    box-shadow: none;
}
.np-header-v3--dark .np-drawer-toggle-lines i { background: #f8fafc; }
.np-footer-logo-img {
    max-height: 42px;
    width: auto;
    max-width: 180px;
    object-fit: contain;
}
.np-brand-v3-icon {
    width: calc(var(--np-header-h) - 6px);
    height: calc(var(--np-header-h) - 6px);
    border-radius: 9px;
    background: linear-gradient(145deg, var(--np-brand) 0%, #1e5a8a 100%);
    color: #fff;
    display: grid;
    place-items: center;
    font-size: .95rem;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(10, 37, 64, .15);
}
.np-brand-v3-text { display: none !important; }
.np-drawer-toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid var(--np-border);
    background: var(--np-surface);
    color: var(--np-brand);
    padding: 7px 11px;
    border-radius: 999px;
    font: inherit;
    font-size: .78rem;
    font-weight: 700;
    cursor: pointer;
    box-shadow: var(--np-shadow);
    transition: all .2s;
    flex-shrink: 0;
}
.np-drawer-toggle:hover { border-color: var(--np-brand-light); box-shadow: var(--np-shadow-lg); }
.np-drawer-toggle-lines {
    display: flex;
    flex-direction: column;
    gap: 4px;
    width: 18px;
}
.np-drawer-toggle-lines i {
    display: block;
    height: 2px;
    background: var(--np-brand);
    border-radius: 2px;
}
.np-drawer-toggle-lines i:nth-child(2) { width: 70%; margin-inline-start: auto; }
body.np-drawer-open .np-drawer-toggle-lines i:nth-child(1) { transform: translateY(6px) rotate(45deg); }
body.np-drawer-open .np-drawer-toggle-lines i:nth-child(2) { opacity: 0; }
body.np-drawer-open .np-drawer-toggle-lines i:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
.np-drawer-toggle-lines i { transition: transform .2s, opacity .2s; }

.np-drawer {
    position: fixed;
    inset: 0;
    z-index: 300;
    pointer-events: none;
    visibility: hidden;
}
.np-drawer.is-open { pointer-events: auto; visibility: visible; }
.np-drawer-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(10, 37, 64, .4);
    opacity: 0;
    transition: opacity .25s;
}
.np-drawer.is-open .np-drawer-backdrop { opacity: 1; }
.np-drawer-panel {
    position: absolute;
    inset-block: 0;
    inset-inline-start: 0;
    inset-inline-end: auto;
    width: min(360px, 92vw);
    background: var(--np-surface);
    box-shadow: -8px 0 40px rgba(10, 37, 64, .15);
    transform: translateX(100%);
    transition: transform .3s cubic-bezier(.4, 0, .2, 1);
    overflow-y: auto;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    direction: rtl;
    text-align: right;
}
[dir="rtl"] .np-drawer-panel {
    transform: translateX(100%);
    box-shadow: -8px 0 40px rgba(10, 37, 64, .15);
}
.np-drawer.is-open .np-drawer-panel { transform: translateX(0); }
.np-drawer-head { display: flex; justify-content: flex-end; align-items: center; }
.np-drawer-logo-block {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
    padding: 18px 20px;
    text-decoration: none;
    background: linear-gradient(145deg, #0b1220 0%, #0f3d56 48%, #0c4a6e 100%);
    border-radius: 16px;
    border: 1px solid rgba(45, 212, 191, .28);
    box-shadow:
        0 10px 28px rgba(8, 47, 73, .38),
        inset 0 1px 0 rgba(255, 255, 255, .07);
    transition: border-color .2s, box-shadow .2s, transform .15s;
}
.np-drawer-logo-block:hover {
    text-decoration: none;
    border-color: rgba(103, 232, 249, .45);
    box-shadow:
        0 12px 32px rgba(8, 47, 73, .45),
        inset 0 1px 0 rgba(255, 255, 255, .1);
    transform: translateY(-1px);
}
.np-drawer-logo-img {
    max-width: min(260px, 100%);
    max-height: 52px;
    width: auto;
    height: auto;
    object-fit: contain;
    filter: drop-shadow(0 2px 8px rgba(0, 0, 0, .25));
}
.np-drawer-logo-fallback {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: rgba(255, 255, 255, .1);
    border: 1px solid rgba(165, 243, 252, .35);
    color: #e0f2fe;
    display: grid;
    place-items: center;
    font-size: 1.25rem;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .2);
}
.np-drawer-close {
    border: 0;
    background: var(--np-bg);
    width: 36px; height: 36px;
    border-radius: 10px;
    cursor: pointer;
    color: var(--np-muted);
    font-size: 1.1rem;
}
.np-drawer-summary {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
.np-drawer-stat {
    display: flex;
    gap: 10px;
    align-items: center;
    background: var(--np-surface-2);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius-sm);
    padding: 12px;
}
.np-drawer-stat i { color: var(--np-brand-light); font-size: 1.1rem; }
.np-drawer-stat strong { display: block; font-size: 1.1rem; color: var(--np-brand); line-height: 1.2; }
.np-drawer-stat span { font-size: .7rem; color: var(--np-muted); font-weight: 600; }
.np-drawer-nav { display: flex; flex-direction: column; gap: 6px; }
.np-drawer-link {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border-radius: var(--np-radius-sm);
    color: var(--np-text);
    font-weight: 600;
    font-size: .9rem;
    text-decoration: none;
    border: 1px solid transparent;
    transition: all .15s;
}
.np-drawer-link:hover { background: var(--np-bg); border-color: var(--np-border); text-decoration: none; color: var(--np-brand); }
.np-drawer-link i:first-child { width: 20px; text-align: center; color: var(--np-brand-light); }
.np-drawer-chevron { margin-inline-start: auto; font-size: .7rem; opacity: .4; }
.np-drawer-link--accent { background: linear-gradient(135deg, rgba(10,37,64,.04), rgba(26,111,181,.08)); border-color: var(--np-border); }
.np-drawer-govs h3 { margin: 0 0 10px; font-size: .78rem; color: var(--np-muted); font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.np-drawer-govs ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 4px; }
.np-drawer-govs a {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 8px;
    font-size: .85rem;
    font-weight: 600;
    color: var(--np-text-2);
    text-decoration: none;
}
.np-drawer-govs a:hover { background: var(--np-bg); color: var(--np-brand); text-decoration: none; }
.np-drawer-gov-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--np-live); flex-shrink: 0; }
.np-drawer-cta {
    margin-top: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 14px;
    border-radius: var(--np-radius-sm);
    background: linear-gradient(135deg, var(--np-brand), var(--np-brand-mid));
    color: #fff !important;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 6px 20px rgba(10,37,64,.25);
}
.np-drawer-cta:hover { filter: brightness(1.06); text-decoration: none; color: #fff; }

/* ═══════════════════════════════════════════════════════
   Homepage — بطاقة الهيرو (موبايل أولاً)
   ═══════════════════════════════════════════════════════ */
.hp-home {
    position: relative;
    padding: 14px 0 28px;
    overflow: hidden;
}
.hp-home__bg {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 80% 50% at 50% 0%, rgba(26, 111, 181, .12) 0%, transparent 60%),
        linear-gradient(180deg, #f8fafc 0%, var(--np-bg) 100%);
    pointer-events: none;
}
.hp-home__wrap {
    position: relative;
    z-index: 1;
}
.hp-home__card {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 16px 12px 14px;
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: 20px;
    box-shadow: 0 12px 40px rgba(15, 23, 42, .08);
    direction: rtl;
    text-align: right;
}
.hp-home__badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 12px;
    border-radius: 999px;
    background: var(--np-surface-2);
    border: 1px solid var(--np-border);
    font-size: .78rem;
    font-weight: 800;
    color: var(--np-brand-mid);
    margin-bottom: 4px;
}
.hp-home__badge i { color: var(--np-accent); font-size: .85rem; }
.hp-home__title {
    margin: 0;
    font-size: clamp(1.15rem, 4.8vw, 2.1rem);
    font-weight: 900;
    line-height: 1.35;
    color: var(--np-brand);
    letter-spacing: -.02em;
    word-break: break-word;
}
.hp-home__lead {
    margin: 0;
    font-size: .9rem;
    color: var(--np-muted);
    line-height: 1.75;
    font-weight: 600;
}
.hp-home__search-label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: .8rem;
    font-weight: 800;
    color: var(--np-brand);
    margin-bottom: 8px;
}
.hp-home__search-label i { color: var(--np-brand-light); }
.hp-home__search-box {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 8px 6px 12px;
    background: var(--np-bg);
    border: 2px solid var(--np-border);
    border-radius: 14px;
    min-height: 50px;
    box-sizing: border-box;
}
.hp-home__search-box:focus-within {
    border-color: var(--np-brand-light);
    box-shadow: 0 0 0 3px rgba(26, 111, 181, .12);
}
.hp-home__search-box > i {
    color: var(--np-muted);
    flex-shrink: 0;
    font-size: .95rem;
}
.hp-home__search-box input {
    flex: 1;
    min-width: 0;
    border: 0;
    background: transparent;
    font: inherit;
    font-size: 16px;
    font-weight: 700;
    color: var(--np-text);
    outline: none;
    padding: 8px 0;
}
.hp-home__search-count {
    flex-shrink: 0;
    font-size: .7rem;
    font-weight: 800;
    color: var(--np-brand-light);
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    padding: 6px 10px;
    border-radius: 999px;
    white-space: nowrap;
}
.hp-home__stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}
.hp-home__stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 10px 6px;
    border-radius: 12px;
    background: var(--np-surface-2);
    border: 1px solid var(--np-border);
    text-align: center;
    min-width: 0;
}
.hp-home__stat.is-live {
    background: var(--np-live-soft);
    border-color: #a7f3d0;
}
.hp-home__stat-num {
    font-size: 1.05rem;
    font-weight: 900;
    color: var(--np-brand);
    line-height: 1;
}
.hp-home__stat.is-live .hp-home__stat-num { color: #047857; }
.hp-home__stat-num i { color: var(--np-accent); font-size: .9rem; }
.hp-home__stat-lbl {
    font-size: .68rem;
    font-weight: 800;
    color: var(--np-text-3);
    line-height: 1.25;
}
.hp-home__quick {
    padding-top: 4px;
    border-top: 1px solid var(--np-border);
}
.hp-home__quick-title {
    margin: 0 0 10px;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: .78rem;
    font-weight: 800;
    color: var(--np-text-3);
}
.hp-home__quick-title i { color: var(--np-brand-light); }
.hp-home__quick-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}
.hp-home__quick-link {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 8px;
    border-radius: 12px;
    background: var(--np-surface-2);
    border: 1px solid var(--np-border);
    text-decoration: none;
    color: inherit;
    min-width: 0;
    transition: border-color .15s, background .15s;
}
.hp-home__quick-link:hover {
    border-color: color-mix(in srgb, var(--qc-accent, var(--np-brand-light)) 40%, var(--np-border));
    background: #fff;
    text-decoration: none;
}
.hp-home__quick-link.is-featured {
    grid-column: 1 / -1;
    background: linear-gradient(135deg, #fff 0%, color-mix(in srgb, var(--qc-accent) 8%, #fff) 100%);
    border-color: color-mix(in srgb, var(--qc-accent) 30%, var(--np-border));
}
.hp-home__quick-ico {
    flex-shrink: 0;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    background: color-mix(in srgb, var(--qc-accent, var(--np-brand-light)) 14%, #fff);
    color: var(--qc-accent, var(--np-brand-light));
    font-size: .9rem;
}
.hp-home__quick-text {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.hp-home__quick-text strong {
    font-size: .82rem;
    font-weight: 800;
    color: var(--np-brand);
    line-height: 1.25;
}
.hp-home__quick-text small {
    font-size: .68rem;
    font-weight: 600;
    color: var(--np-text-3);
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.hp-home__quick-arrow {
    flex-shrink: 0;
    font-size: .65rem;
    color: var(--np-muted);
    opacity: .7;
}

@media (min-width: 769px) {
    .hp-home { padding: 28px 0 48px; }
    .hp-home__card {
        padding: 28px 28px 22px;
        gap: 22px;
        border-radius: calc(var(--hp-radius) + 4px);
    }
    .hp-home__title { font-size: clamp(1.6rem, 3vw, 2.35rem); }
    .hp-home__lead { font-size: 1rem; max-width: 620px; }
    .hp-home__quick-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    .hp-home__quick-link.is-featured { grid-column: auto; }
}
.hp-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid var(--np-border);
    font-size: .8rem;
    font-weight: 700;
    color: var(--np-text-2);
}
.hp-pill--live { background: var(--np-live-soft); border-color: #a7f3d0; color: #065f46; }
.hp-pill--live i { font-size: .65rem; }

.hp-levels { padding: 0 0 24px; margin-top: -20px; position: relative; z-index: 2; }
.hp-levels-track { display: flex; flex-wrap: wrap; gap: 10px; }
.hp-level {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    background: #fff;
    border: 1px solid var(--np-border);
    border-radius: 999px;
    font-size: .88rem;
    font-weight: 700;
    color: var(--np-text-2);
    text-decoration: none;
    box-shadow: var(--np-shadow);
    transition: all .15s;
}
.hp-level:hover { border-color: var(--np-brand-light); color: var(--np-brand); transform: translateY(-2px); text-decoration: none; }
.hp-level i { color: var(--np-brand-light); }

.hp-all-levels { padding: 28px 0 36px; direction: rtl; text-align: right; }
.hp-section-head--stack { flex-direction: column; align-items: flex-start; gap: 6px; margin-bottom: 18px; text-align: right; }
.hp-section-head--rtl { align-items: stretch; width: 100%; }
.hp-section-head-copy { width: 100%; text-align: right; }
.hp-section-head--stack h2 { justify-content: flex-start; }
.hp-section-head--stack p { margin: 0; color: var(--np-text-3); font-size: .95rem; line-height: 1.75; max-width: 640px; }
.hp-levels-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 5px;
    direction: rtl;
}
.hp-level-card {
    display: flex;
    align-items: center;
    gap: 14px;
    width: 100%;
    min-width: 0;
    padding: 16px 18px;
    background: #fff;
    border: 1px solid var(--np-border);
    border-inline-start: 4px solid var(--level-accent, var(--np-brand));
    border-radius: var(--np-radius-lg);
    text-decoration: none;
    color: inherit;
    box-shadow: var(--np-shadow);
    transition: transform .15s, border-color .15s, box-shadow .15s;
    position: relative;
    overflow: hidden;
    direction: rtl;
}
.hp-level-card::before { display: none; }
.hp-level-card--featured {
    border-color: color-mix(in srgb, var(--level-accent, var(--np-brand)) 35%, var(--np-border));
    background: linear-gradient(135deg, #fff 0%, color-mix(in srgb, var(--level-accent, var(--np-brand)) 6%, #fff) 100%);
}
.hp-level-card--live {
    border-color: color-mix(in srgb, #059669 40%, var(--np-border));
    background: linear-gradient(135deg, #fff 0%, color-mix(in srgb, #059669 8%, #fff) 100%);
    box-shadow: 0 4px 16px rgba(5, 150, 105, .1);
}
.hp-level-card--appeared {
    border-inline-start-width: 5px;
    border-inline-start-color: #059669;
    box-shadow: 0 8px 24px rgba(5, 150, 105, .15);
}
.hp-level-card-rank {
    position: absolute;
    inset-inline-start: 10px;
    top: 10px;
    z-index: 2;
    min-width: 28px;
    height: 28px;
    padding: 0 8px;
    border-radius: 999px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #059669, #10b981);
    color: #fff;
    font-size: .82rem;
    font-weight: 900;
    box-shadow: 0 4px 12px rgba(5, 150, 105, .35);
}
.hp-level-card-live-tag {
    position: absolute;
    inset-inline-end: 10px;
    top: 10px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    border-radius: 999px;
    background: linear-gradient(135deg, #059669, #10b981);
    color: #fff;
    font-size: .68rem;
    font-weight: 900;
    white-space: nowrap;
    box-shadow: 0 4px 12px rgba(5, 150, 105, .3);
    animation: np-gov-live-pulse 2.8s ease-in-out infinite;
}
.hp-level-card-live-tag i { font-size: .72rem; }
.hp-all-levels-live-stat {
    color: #059669;
    font-weight: 900;
}
.hp-level-card-govs {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: .78rem;
    font-weight: 700;
    color: var(--np-text-3);
}
.hp-level-card-govs.is-live {
    color: #059669;
    font-weight: 800;
}
.hp-level-card-govs i { font-size: .72rem; }
.hp-level-card--live .hp-level-card-go { color: #059669; }
.hp-level-card:hover {
    transform: translateY(-3px);
    border-color: color-mix(in srgb, var(--level-accent, var(--np-brand)) 45%, var(--np-border));
    box-shadow: var(--np-shadow-lg);
    text-decoration: none;
}
.hp-level-card-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: #fff;
    background: color-mix(in srgb, var(--level-accent, var(--np-brand)) 14%, #fff);
    border: 1px solid color-mix(in srgb, var(--level-accent, var(--np-brand)) 32%, var(--np-border));
    color: var(--level-accent, var(--np-brand));
    font-size: 1.1rem;
    flex-shrink: 0;
    box-shadow: 0 2px 8px color-mix(in srgb, var(--level-accent, var(--np-brand)) 14%, transparent);
    position: relative;
    z-index: 1;
}
.hp-level-card:has(.hp-level-card-rank) .hp-level-card-icon,
.hp-level-card:has(.hp-level-card-live-tag) .hp-level-card-icon {
    margin-top: 24px;
}
.hp-level-card-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; padding-top: 22px; }
.hp-level-card-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: .72rem;
    font-weight: 800;
    color: var(--np-text-3);
    text-transform: uppercase;
    letter-spacing: .02em;
}
.hp-level-card-badge.is-live { color: #059669; }
.hp-level-card-badge.is-tool { color: #d97706; }
.hp-level-card--tool { border-style: dashed; }

/* ── Compact governorates grid ── */
.hp-gov-compact-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 14px;
    direction: rtl;
}
.hp-gov-stack {
    display: flex;
    flex-direction: column;
    direction: rtl;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(10, 37, 64, .05);
    transition: box-shadow .2s, transform .2s;
}
.hp-gov-stack:hover {
    box-shadow: 0 10px 28px rgba(10, 37, 64, .1);
    transform: translateY(-2px);
}
.hp-gov-stack--soon { opacity: .82; }
.hp-gov-stack--published {
    box-shadow: 0 4px 18px rgba(5, 150, 105, .12);
}
.hp-gov-stack--published .hp-gov-banner {
    border-color: color-mix(in srgb, #059669 40%, var(--np-border));
    background: linear-gradient(
        135deg,
        color-mix(in srgb, #059669 14%, #fff) 0%,
        color-mix(in srgb, var(--accent, #059669) 10%, #fff) 100%
    );
}
.hp-gov-stack--published .hp-gov-banner-go {
    background: linear-gradient(135deg, #059669, #10b981);
    gap: 6px;
    flex-wrap: wrap;
    justify-content: center;
}
.hp-gov-banner-go-live {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .22);
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .01em;
}
/* شارة «ظهرت الآن» — مشتركة بين الرئيسية وصفحات المراحل */
.np-gov-live-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 11px;
    border-radius: 999px;
    background: linear-gradient(135deg, #059669 0%, #10b981 100%);
    color: #fff;
    font-size: .72rem;
    font-weight: 900;
    line-height: 1;
    white-space: nowrap;
    box-shadow: 0 4px 14px rgba(5, 150, 105, .35);
    animation: np-gov-live-pulse 2.8s ease-in-out infinite;
}
.np-gov-live-badge i { font-size: .78rem; }
.np-gov-live-badge--banner {
    position: absolute;
    inset-inline-end: 12px;
    top: 10px;
    z-index: 2;
}
.np-gov-live-badge--level {
    position: absolute;
    inset-inline-end: 12px;
    top: 10px;
    z-index: 2;
}
.np-level-gov-box-live-hint {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #059669;
    font-weight: 800;
}
.np-level-gov-box-live-hint i { font-size: .72rem; }
@keyframes np-gov-live-pulse {
    0%, 100% { box-shadow: 0 4px 14px rgba(5, 150, 105, .35); transform: scale(1); }
    50% { box-shadow: 0 6px 20px rgba(5, 150, 105, .5); transform: scale(1.02); }
}
.hp-gov-banner {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--accent, var(--np-brand-light)) 18%, #fff) 0%,
        color-mix(in srgb, var(--accent, var(--np-brand-light)) 8%, #fff) 100%
    );
    border: 1px solid color-mix(in srgb, var(--accent, var(--np-brand-light)) 28%, var(--np-border));
    border-bottom: none;
    border-radius: 16px 16px 0 0;
    text-decoration: none;
    color: inherit;
    transition: background .2s, border-color .2s;
    position: relative;
    overflow: hidden;
}
.hp-gov-banner::after {
    content: '';
    position: absolute;
    inset-inline-start: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: var(--accent, var(--np-brand-light));
    border-radius: 0 4px 4px 0;
}
.hp-gov-banner:hover {
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--accent, var(--np-brand-light)) 24%, #fff) 0%,
        color-mix(in srgb, var(--accent, var(--np-brand-light)) 12%, #fff) 100%
    );
    text-decoration: none;
}
.hp-gov-banner-ico {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 11px;
    display: grid;
    place-items: center;
    background: #fff;
    color: var(--accent, var(--np-brand-light));
    font-size: 1rem;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(10, 37, 64, .08);
}
.hp-gov-banner-ico img { width: 100%; height: 100%; object-fit: cover; }
.hp-gov-banner-text {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.hp-gov-banner-name {
    font-size: 1.18rem;
    font-weight: 900;
    color: var(--np-brand);
    letter-spacing: -.01em;
    line-height: 1.25;
}
.hp-gov-banner-title {
    display: -webkit-box;
    font-size: .86rem;
    font-weight: 800;
    line-height: 1.55;
    color: var(--np-text-2);
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.hp-gov-banner-go {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 800;
    background: var(--accent, var(--np-brand-light));
    color: #fff;
    white-space: nowrap;
    transition: transform .15s, opacity .15s;
}
.hp-gov-stack--live .hp-gov-banner-go { background: #059669; }
.hp-gov-banner:hover .hp-gov-banner-go { transform: scale(1.04); opacity: .95; }
.hp-gov-compact {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px 12px;
    background: #fff;
    border: 1px solid color-mix(in srgb, var(--accent, var(--np-brand-light)) 28%, var(--np-border));
    border-top: 1px dashed color-mix(in srgb, var(--accent, var(--np-brand-light)) 22%, var(--np-border));
    border-radius: 0 0 16px 16px;
    direction: rtl;
}
.hp-gov-stack:hover .hp-gov-compact {
    border-color: color-mix(in srgb, var(--accent, var(--np-brand-light)) 35%, var(--np-border));
}
.hp-gov-compact-ico {
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    background: color-mix(in srgb, var(--accent, var(--np-brand-light)) 12%, #fff);
    color: var(--accent, var(--np-brand-light));
    font-size: .95rem;
    overflow: hidden;
}
.hp-gov-compact-ico img { width: 100%; height: 100%; object-fit: cover; }
.hp-gov-compact-main { flex: 1; min-width: 0; }
.hp-gov-compact-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 8px;
}
.hp-gov-compact-top strong {
    font-size: .92rem;
    font-weight: 800;
    color: var(--np-brand);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.hp-gov-compact-badge {
    flex-shrink: 0;
    font-size: .65rem;
    font-weight: 800;
    padding: 3px 8px;
    border-radius: 999px;
    background: var(--np-bg);
    color: var(--np-muted);
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.hp-gov-compact-badge.is-live { background: #ecfdf5; color: #059669; }
.hp-gov-quick {
    display: flex;
    align-items: center;
    gap: 6px;
    background: var(--np-bg);
    border: 1px solid var(--np-border);
    border-radius: 10px;
    padding: 4px 6px 4px 8px;
}
.hp-gov-quick-ico {
    flex-shrink: 0;
    width: 22px;
    text-align: center;
    font-size: .75rem;
    color: var(--accent, var(--np-brand-light));
}
.hp-gov-quick input {
    flex: 1;
    min-width: 0;
    border: none;
    background: transparent;
    font-size: .78rem;
    font-weight: 600;
    color: var(--np-brand);
    outline: none;
    padding: 4px 0;
}
.hp-gov-quick input::placeholder { color: var(--np-text-3); font-weight: 500; }
.hp-gov-quick button {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 8px;
    background: var(--accent, var(--np-brand-light));
    color: #fff;
    cursor: pointer;
    display: grid;
    place-items: center;
    font-size: .8rem;
    transition: transform .15s, opacity .15s;
}
.hp-gov-quick button:hover { transform: scale(1.05); opacity: .92; }
.hp-gov-compact-soon {
    margin: 0;
    padding: 10px 12px;
    font-size: .78rem;
    font-weight: 700;
    color: var(--np-text-3);
    display: flex;
    align-items: center;
    gap: 8px;
}
.hp-gov-compact-legacy-note {
    margin: 8px 0 0;
    padding: 8px 10px;
    border-radius: 8px;
    font-size: .72rem;
    font-weight: 800;
    color: #991b1b;
    background: rgba(220, 38, 38, .08);
    border: 1px solid rgba(220, 38, 38, .25);
    display: flex;
    align-items: center;
    gap: 6px;
}
.hp-gov-compact-legacy-note i { color: #dc2626; }
.hp-gov-compact-upcoming-note {
    margin: 8px 0 0;
    padding: 0 4px;
    font-size: .72rem;
    font-weight: 700;
    color: var(--np-text-3);
    display: flex;
    align-items: center;
    gap: 6px;
}
.np-result-legacy-note {
    margin: 10px 0 0;
    padding: 10px 14px;
    border-radius: 10px;
    background: rgba(220, 38, 38, .12);
    border: 1px solid rgba(220, 38, 38, .35);
    color: #fecaca;
    font-size: .88rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 8px;
}
    margin: 0;
    font-size: .72rem;
    font-weight: 600;
    color: var(--np-muted);
}
.hp-gov-compact-go {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    color: var(--np-text-3);
    background: var(--np-bg);
    text-decoration: none;
    transition: color .2s, background .2s;
}
.hp-gov-compact-go:hover {
    color: var(--accent, var(--np-brand-light));
    background: color-mix(in srgb, var(--accent, var(--np-brand-light)) 10%, var(--np-bg));
    text-decoration: none;
}

/* ── Level tool pages ── */
.np-level-tool { padding-bottom: 32px; }
.np-level-tool-card {
    background: #fff;
    border: 1px solid var(--np-border);
    border-radius: var(--hp-radius);
    padding: 24px;
    box-shadow: var(--np-shadow);
}
.np-level-tool-head {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 20px;
}
.np-level-tool-head h2 { margin: 0 0 6px; font-size: 1.15rem; color: var(--np-brand); }
.np-level-tool-head p { margin: 0; font-size: .88rem; color: var(--np-muted); }
.np-grade-table-wrap { overflow-x: auto; margin-bottom: 16px; }
.np-grade-table {
    width: 100%;
    border-collapse: collapse;
    font-size: .88rem;
}
.np-grade-table th,
.np-grade-table td {
    padding: 10px 12px;
    text-align: start;
    border-bottom: 1px solid var(--np-border);
}
.np-grade-table th {
    font-size: .75rem;
    font-weight: 800;
    color: var(--np-text-3);
    text-transform: uppercase;
}
.np-grade-bar {
    display: block;
    height: 8px;
    border-radius: 999px;
    background: var(--band-color, var(--level-accent, #059669));
    min-width: 20px;
}
.np-level-tool-note {
    font-size: .84rem;
    color: var(--np-muted);
    margin: 0 0 16px;
}
.np-level-tool-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: .88rem;
    font-weight: 700;
    color: var(--level-accent, var(--np-brand-light));
    text-decoration: none;
}
.np-coord-inline-row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: flex-end;
}
.np-coord-inline-row label { flex: 1; min-width: 180px; }
.np-coord-inline-row label span {
    display: block;
    font-size: .75rem;
    font-weight: 700;
    color: var(--np-text-3);
    margin-bottom: 6px;
}
.np-coord-inline-result { margin-top: 16px; }

.hp-level-card-body strong { font-size: .95rem; color: var(--np-brand); line-height: 1.35; }
.hp-level-card-body > span:last-child { font-size: .8rem; color: var(--np-text-3); }
.hp-level-card-go { color: var(--np-text-3); font-size: .85rem; flex-shrink: 0; }

.np-drawer-section-label {
    padding: 12px 18px 6px;
    font-size: .72rem;
    font-weight: 800;
    color: var(--np-text-3);
    text-transform: uppercase;
    letter-spacing: .04em;
}
.np-drawer-live {
    font-style: normal;
    font-size: .65rem;
    font-weight: 800;
    color: #059669;
    background: #ecfdf5;
    padding: 2px 7px;
    border-radius: 999px;
    margin-inline-end: auto;
}
.np-result-coord-prefill {
    margin: 6px 0 0;
    font-size: .92rem;
    color: var(--np-text-2);
}
.np-result-coord-prefill strong { color: var(--coord-accent, var(--np-brand)); font-size: 1.05rem; }
.np-coord-quick-btn--mine {
    border-color: var(--coord-accent, var(--np-brand));
    color: var(--coord-accent, var(--np-brand));
    font-weight: 800;
}
.np-coord-quick-btn--mine.is-active,
.np-coord-quick-btn.is-active {
    background: var(--coord-accent, var(--np-brand));
    color: #fff;
    border-color: transparent;
}

@media (max-width: 900px) {
    .hp-levels-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
    .hp-levels-grid { grid-template-columns: 1fr; }
    .hp-level-card { width: 100%; }
}

.hp-section-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 20px;
}
.hp-section-head h2 {
    margin: 0;
    font-size: 1.2rem;
    font-weight: 800;
    color: var(--np-brand);
    display: flex;
    align-items: center;
    gap: 10px;
}
.hp-section-head h2 i { color: var(--np-accent); }
.hp-section-head p { margin: 4px 0 0; font-size: .88rem; color: var(--np-muted); }
.hp-section-head a { font-size: .88rem; font-weight: 700; color: var(--np-brand-light); text-decoration: none; }
.hp-section-head a:hover { color: var(--np-brand); }

.hp-featured { padding: 16px 0 40px; background: linear-gradient(180deg, rgba(5,150,105,.04) 0%, transparent 100%); }
.hp-featured .hp-section-head h2 { font-size: clamp(1.1rem, 2.5vw, 1.35rem); }
.hp-featured .hp-section-head h2 i { color: #ea580c; }
.hp-featured-scroll {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    padding-bottom: 8px;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
}
.hp-featured-scroll::-webkit-scrollbar { height: 6px; }
.hp-featured-scroll::-webkit-scrollbar-thumb { background: var(--np-border); border-radius: 999px; }
.hp-featured-card {
    flex: 0 0 min(300px, 85vw);
    scroll-snap-align: start;
    background: #fff;
    border-radius: var(--hp-radius);
    overflow: hidden;
    border: 2px solid transparent;
    box-shadow: var(--np-shadow-lg);
    text-decoration: none;
    color: inherit;
    transition: transform .2s, box-shadow .2s, border-color .2s;
    background-image: linear-gradient(#fff, #fff), linear-gradient(135deg, var(--accent, #1a6fb5), #059669);
    background-origin: border-box;
    background-clip: padding-box, border-box;
}
.hp-featured-card:hover { transform: translateY(-6px); box-shadow: 0 20px 48px rgba(5,150,105,.18); text-decoration: none; }
.hp-featured-img { position: relative; height: 160px; overflow: hidden; }
.hp-featured-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.hp-featured-card:hover .hp-featured-img img { transform: scale(1.05); }
.hp-featured-img::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 40%, rgba(10,37,64,.75) 100%);
}
.hp-gov-icon {
    position: absolute;
    bottom: 12px;
    inset-inline-start: 12px;
    width: 36px; height: 36px;
    border-radius: 12px;
    background: rgba(255,255,255,.95);
    color: var(--accent, var(--np-brand));
    display: grid;
    place-items: center;
    font-size: .95rem;
    z-index: 1;
    box-shadow: 0 4px 12px rgba(0,0,0,.15);
}
.hp-gov-icon--lg { width: 44px; height: 44px; font-size: 1.1rem; bottom: auto; top: 12px; inset-inline-start: 12px; }
.hp-gov-icon--photo { padding: 0; overflow: hidden; }
.hp-gov-icon--photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hp-featured-img-fallback,
.hp-gov-card-img-fallback {
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
    min-height: 120px;
    background: linear-gradient(145deg, rgba(10,37,64,.08), rgba(10,37,64,.16));
    color: var(--accent, var(--np-brand));
    font-size: 2rem;
}
.hp-live-badge {
    position: absolute;
    top: 12px;
    inset-inline-end: 12px;
    z-index: 1;
    background: var(--np-live);
    color: #fff;
    font-size: .65rem;
    font-weight: 800;
    padding: 4px 10px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    gap: 4px;
}
.hp-live-badge i { font-size: .4rem; }
.hp-featured-body { padding: 16px; }
.hp-region { font-size: .7rem; font-weight: 700; color: var(--np-muted); text-transform: uppercase; letter-spacing: .04em; }
.hp-featured-body strong { display: block; font-size: 1.05rem; color: var(--np-brand); margin: 4px 0; }
.hp-featured-body p { margin: 0; font-size: .82rem; color: var(--np-muted); line-height: 1.6; }
.hp-meta { display: inline-flex; align-items: center; gap: 6px; margin-top: 10px; font-size: .78rem; font-weight: 600; color: var(--np-text-2); }

.hp-coord { padding: 0 0 48px; }
.hp-coord-card {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 32px;
    align-items: center;
    background: linear-gradient(135deg, var(--np-brand) 0%, #134e7a 100%);
    border-radius: calc(var(--hp-radius) + 4px);
    padding: 32px 36px;
    color: #fff;
    box-shadow: 0 20px 50px rgba(10, 37, 64, .2);
    overflow: hidden;
    position: relative;
}
.hp-coord-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 90% 20%, rgba(200,146,42,.25) 0%, transparent 50%);
    pointer-events: none;
}
.hp-coord-visual { position: relative; z-index: 1; }
.hp-coord-ring {
    width: 100px; height: 100px;
    border-radius: 50%;
    background: rgba(255,255,255,.12);
    border: 3px solid rgba(255,255,255,.25);
    display: grid;
    place-items: center;
    font-size: 2.2rem;
}
.hp-coord-body { position: relative; z-index: 1; }
.hp-label { display: inline-flex; align-items: center; gap: 6px; font-size: .78rem; font-weight: 700; opacity: .85; margin-bottom: 8px; }
.hp-coord-body h2 { margin: 0 0 8px; font-size: 1.35rem; font-weight: 800; }
.hp-coord-body > p { margin: 0 0 20px; opacity: .88; font-size: .92rem; line-height: 1.7; }
.hp-coord-row {
    display: grid;
    grid-template-columns: 1fr 1fr auto;
    gap: 12px;
    align-items: end;
}
.hp-coord-row label span { display: block; font-size: .75rem; font-weight: 600; margin-bottom: 6px; opacity: .85; }
.hp-coord-row .np-input { background: rgba(255,255,255,.95); border-color: transparent; }
.hp-coord-result {
    margin-top: 16px;
    padding: 16px;
    background: rgba(255,255,255,.12);
    border-radius: var(--np-radius-sm);
    border: 1px solid rgba(255,255,255,.2);
    color: #fff;
}
.hp-coord-result.is-success { background: rgba(255,255,255,.15); }
.hp-coord-result .np-coord-out-head h3 { color: #fff; }
.hp-coord-result .np-coord-out-head p { color: rgba(255,255,255,.9); }
.hp-coord-more {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 14px;
    font-size: .85rem;
    font-weight: 700;
    color: var(--np-accent-soft);
    text-decoration: none;
}
.hp-coord-more:hover { color: #fff; text-decoration: none; }

.hp-govs { padding-bottom: 48px; direction: rtl; text-align: right; }
.hp-govs .hp-section-head { text-align: right; }
.hp-gov-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 20px;
}
.hp-gov-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: var(--hp-radius);
    overflow: hidden;
    border: 1px solid var(--np-border);
    box-shadow: var(--np-shadow);
    text-decoration: none;
    color: inherit;
    transition: transform .25s, box-shadow .25s;
}
.hp-gov-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 24px 48px rgba(10, 37, 64, .12);
    text-decoration: none;
}
.hp-gov-card--soon { opacity: .78; }
.hp-gov-card--soon:hover { transform: none; box-shadow: var(--np-shadow); }
.hp-gov-card-img { position: relative; height: 180px; overflow: hidden; }
.hp-gov-card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.hp-gov-card:hover .hp-gov-card-img img { transform: scale(1.06); }
.hp-gov-card-img::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 30%, rgba(10,37,64,.6) 100%);
}
.hp-gov-status {
    position: absolute;
    top: 12px;
    inset-inline-end: 12px;
    z-index: 1;
    font-size: .72rem;
    font-weight: 800;
    padding: 5px 12px;
    border-radius: 999px;
    background: rgba(255,255,255,.9);
    color: var(--np-muted);
    display: flex;
    align-items: center;
    gap: 5px;
}
.hp-gov-status--live { background: var(--np-live); color: #fff; }
.hp-gov-card-body { padding: 18px 20px 20px; flex: 1; display: flex; flex-direction: column; }
.hp-gov-card-body h3 { margin: 4px 0 8px; font-size: 1.1rem; font-weight: 800; color: var(--np-brand); }
.hp-gov-card-body > p { margin: 0; font-size: .84rem; color: var(--np-muted); line-height: 1.65; flex: 1; }
.hp-gov-stats {
    list-style: none;
    padding: 0;
    margin: 14px 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    font-size: .75rem;
    font-weight: 600;
    color: var(--np-text-2);
}
.hp-gov-stats i { color: var(--accent, var(--np-brand-light)); margin-inline-end: 4px; }
.hp-gov-cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 14px;
    font-size: .88rem;
    font-weight: 800;
    color: var(--accent, var(--np-brand-light));
}
.hp-soon-label { display: inline-block; margin-top: 12px; font-size: .78rem; font-weight: 700; color: var(--np-muted); background: var(--np-bg); padding: 6px 12px; border-radius: 999px; }
.hp-empty { text-align: center; padding: 40px; color: var(--np-muted); font-weight: 700; }
.hp-empty i { display: block; font-size: 2rem; margin-bottom: 12px; opacity: .5; }

.hp-trust { padding-bottom: 56px; }
.hp-trust-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
.hp-trust-item {
    background: #fff;
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius-sm);
    padding: 20px;
    text-align: center;
    box-shadow: var(--np-shadow);
}
.hp-trust-item i {
    font-size: 1.5rem;
    color: var(--np-brand-light);
    margin-bottom: 10px;
}
.hp-trust-item strong { display: block; font-size: .92rem; color: var(--np-brand); margin-bottom: 4px; }
.hp-trust-item span { font-size: .78rem; color: var(--np-muted); }

/* ── Welcome + Dua banner ── */
.np-welcome-section { margin-top: 8px; margin-bottom: 20px; }
.np-welcome-banner {
    position: relative;
    display: grid;
    grid-template-columns: 1fr minmax(240px, 320px);
    gap: 20px;
    padding: 24px 26px;
    border-radius: var(--np-radius);
    border: 1px solid rgba(26, 111, 181, .22);
    background: linear-gradient(135deg, rgba(26,111,181,.08), rgba(124,58,237,.06));
    box-shadow: var(--np-shadow);
    overflow: hidden;
}
.np-welcome-glow {
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 85% 15%, rgba(124,58,237,.18), transparent 50%);
    pointer-events: none;
}
.np-welcome-main { position: relative; }
.np-welcome-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 999px;
    font-size: .75rem;
    font-weight: 800;
    color: var(--welcome-accent, var(--np-brand));
    background: rgba(255,255,255,.85);
    border: 1px solid rgba(26,111,181,.15);
    margin-bottom: 12px;
}
.np-welcome-title {
    margin: 0 0 10px;
    font-size: clamp(1.15rem, 2.5vw, 1.45rem);
    font-weight: 900;
    color: var(--np-brand);
    line-height: 1.35;
}
.np-welcome-lead {
    margin: 0;
    font-size: .92rem;
    line-height: 1.75;
    color: var(--np-text-2);
    font-weight: 600;
}
.np-dua-card {
    position: relative;
    padding: 18px 20px;
    border-radius: var(--np-radius-sm);
    background: linear-gradient(160deg, rgba(255,255,255,.95), rgba(255,255,255,.75));
    border: 1px solid rgba(200, 146, 42, .35);
    box-shadow: 0 8px 24px rgba(200,146,42,.12);
    text-align: center;
}
.np-dua-icon {
    display: inline-grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: linear-gradient(135deg, #fef3c7, #fde68a);
    color: #b45309;
    font-size: 1.1rem;
    margin-bottom: 10px;
}
.np-dua-label {
    display: block;
    font-size: .82rem;
    font-weight: 800;
    color: #b45309;
    margin-bottom: 8px;
}
.np-dua-text {
    margin: 0;
    font-size: .88rem;
    line-height: 1.85;
    color: var(--np-text);
    font-weight: 700;
    font-style: normal;
}

/* ── Telegram CTA ── */
.np-telegram-section { margin-bottom: 28px; }
.np-telegram-cta {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 18px 22px;
    border-radius: var(--np-radius);
    text-decoration: none;
    color: #fff;
    background: linear-gradient(120deg, #0ea5e9 0%, #229ED9 35%, #0088cc 70%, #006699 100%);
    box-shadow: 0 12px 32px rgba(34, 158, 217, .35);
    position: relative;
    overflow: hidden;
    transition: transform .2s ease, box-shadow .2s ease;
}
.np-telegram-cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 40px rgba(34, 158, 217, .45);
    color: #fff;
}
.np-telegram-orbit {
    position: absolute;
    inset: -40%;
    background: radial-gradient(circle, rgba(255,255,255,.15) 0%, transparent 60%);
    animation: np-tg-orbit 6s linear infinite;
    pointer-events: none;
}
@keyframes np-tg-orbit {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
.np-telegram-icon {
    position: relative;
    width: 56px;
    height: 56px;
    border-radius: 16px;
    display: grid;
    place-items: center;
    font-size: 1.75rem;
    background: rgba(255,255,255,.2);
    backdrop-filter: blur(6px);
    flex-shrink: 0;
}
.np-telegram-body { position: relative; flex: 1; min-width: 0; }
.np-telegram-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .04em;
    background: rgba(255,255,255,.22);
    margin-bottom: 6px;
}
.np-telegram-headline {
    display: block;
    font-size: clamp(1rem, 2vw, 1.2rem);
    font-weight: 900;
    margin-bottom: 4px;
}
.np-telegram-desc {
    display: block;
    font-size: .84rem;
    opacity: .92;
    line-height: 1.6;
    font-weight: 600;
}
.np-telegram-action {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 18px;
    border-radius: 999px;
    background: #fff;
    color: #0088cc;
    font-size: .88rem;
    font-weight: 900;
    white-space: nowrap;
    flex-shrink: 0;
}

/* ── Edarat hub ── */
.np-edarat-section { margin-bottom: 36px; scroll-margin-top: 80px; }
.np-edarat-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}
.np-edarat-head-main {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    flex: 1;
    min-width: 240px;
}
.np-section-title--flush { margin: 0 0 6px; }
.np-edarat-sub {
    margin: 0;
    font-size: .86rem;
    color: var(--np-muted);
    font-weight: 600;
}
.np-edarat-search-wrap {
    position: relative;
    min-width: min(100%, 280px);
}
.np-edarat-search-wrap i {
    position: absolute;
    inset-inline-start: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--np-muted);
    font-size: .9rem;
    pointer-events: none;
}
.np-edarat-filter {
    width: 100%;
    padding: 12px 14px 12px 40px;
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius-sm);
    background: var(--np-surface);
    font-family: inherit;
    font-size: .9rem;
    font-weight: 600;
    color: var(--np-text);
    box-shadow: var(--np-shadow);
}
.np-edarat-filter:focus {
    outline: none;
    border-color: var(--np-brand-light);
    box-shadow: 0 0 0 3px rgba(26,111,181,.15);
}
.np-edarat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 14px;
}
.np-edarat-card {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 12px;
    padding: 16px 18px;
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius-sm);
    box-shadow: var(--np-shadow);
    transition: border-color .2s, box-shadow .2s, transform .2s;
}
.np-edarat-card:hover {
    border-color: rgba(26,111,181,.35);
    box-shadow: 0 8px 24px rgba(26,111,181,.12);
    transform: translateY(-1px);
}
.np-edarat-num {
    width: 32px;
    height: 32px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    font-size: .78rem;
    font-weight: 900;
    color: var(--np-brand-light);
    background: rgba(26,111,181,.1);
}
.np-edarat-name {
    margin: 0 0 4px;
    font-size: .92rem;
    font-weight: 800;
    color: var(--np-brand);
    line-height: 1.4;
}
.np-edarat-hint {
    margin: 0;
    font-size: .75rem;
    color: var(--np-muted);
    font-weight: 600;
}
.np-edarat-hint i { margin-inline-end: 4px; opacity: .7; }
.np-edarat-link { white-space: nowrap; }
.np-btn--sm { padding: 10px 14px; font-size: .78rem; }
.np-edarat-soon {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 8px 12px;
    border-radius: 999px;
    font-size: .75rem;
    font-weight: 800;
    color: var(--np-muted);
    background: var(--np-bg);
}
.np-edarat-empty {
    text-align: center;
    margin-top: 16px;
    padding: 16px;
    color: var(--np-muted);
    font-weight: 700;
    font-size: .88rem;
}

/* ── Coordination guide (per governorate) ── */
.np-coord-guide-section {
    margin-bottom: 36px;
    padding: 24px;
    border-radius: var(--np-radius);
    border: 1px solid rgba(124, 58, 237, .2);
    background: linear-gradient(135deg, rgba(124,58,237,.06), rgba(26,111,181,.04));
    scroll-margin-top: 80px;
}
.np-coord-guide-head {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}
.np-coord-guide-sub {
    margin: 0;
    font-size: .86rem;
    color: var(--np-text-2);
    font-weight: 600;
    line-height: 1.65;
}
.np-coord-guide-year {
    margin-inline-start: auto;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border-radius: 999px;
    font-size: .82rem;
    font-weight: 800;
    color: #6d28d9;
    background: rgba(124,58,237,.12);
    border: 1px solid rgba(124,58,237,.2);
}
.np-coord-guide-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 12px;
}
.np-coord-guide-card {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    background: #fff;
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius-sm);
    box-shadow: var(--np-shadow);
}
.np-coord-guide-icon {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    font-size: 1rem;
    color: #7c3aed;
    background: rgba(124,58,237,.1);
    flex-shrink: 0;
}
.np-coord-guide-body { flex: 1; min-width: 0; }
.np-coord-guide-body h3 {
    margin: 0 0 4px;
    font-size: .88rem;
    font-weight: 800;
    color: var(--np-brand);
}
.np-coord-guide-body p {
    margin: 0;
    font-size: .74rem;
    color: var(--np-muted);
    font-weight: 600;
}
.np-coord-guide-score {
    text-align: center;
    flex-shrink: 0;
    min-width: 64px;
}
.np-coord-guide-score strong {
    display: block;
    font-size: 1.15rem;
    font-weight: 900;
    color: #7c3aed;
    line-height: 1;
}
.np-coord-guide-score span {
    font-size: .72rem;
    color: var(--np-muted);
    font-weight: 700;
}
.np-coord-guide-score small {
    display: block;
    font-size: .7rem;
    color: #6d28d9;
    font-weight: 800;
    margin-top: 2px;
}
.np-coord-guide-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid rgba(124,58,237,.15);
}
.np-coord-guide-foot p {
    margin: 0;
    flex: 1;
    font-size: .8rem;
    color: var(--np-muted);
    font-weight: 600;
    line-height: 1.6;
}
.np-coord-guide-foot p i { margin-inline-end: 6px; color: #7c3aed; }

@media (min-width: 769px) {
    .np-tg-float { display: none !important; }
    .np-header-v3.is-hidden { transform: none; pointer-events: auto; }
}

/* ── Responsive ── */
@media (max-width: 768px) {
    .np-menu-btn { display: grid; place-items: center; }
    .np-nav {
        display: none;
        position: absolute;
        inset-inline: 0;
        top: 100%;
        background: var(--np-surface);
        border-bottom: 1px solid var(--np-border);
        padding: 12px 4vw 16px;
        flex-direction: column;
        align-items: stretch;
        box-shadow: var(--np-shadow);
    }
    .np-nav.is-open { display: flex; }
    .np-nav a { border-radius: var(--np-radius-sm); }
    .np-header-row { position: relative; }
    .np-search-row { flex-direction: column; }
    .np-btn { width: 100%; }
    .np-student-header { flex-direction: column; align-items: center; text-align: center; }
    .np-info li { justify-content: center; }
    .np-footer-top { flex-direction: column; }
    .np-footer-legal {
        width: 100%;
        max-width: none;
        min-width: 0;
    }
    .np-footer-legal-list { gap: 5px; }
    .np-footer-nav { width: 100%; }
    .np-footer-nav a { flex: 1; justify-content: center; min-width: calc(50% - 5px); }
    .np-hero { padding: 40px 0 56px; }
    .np-search-block { margin-top: -28px; }
    .np-seo-bar-head { flex-direction: column; }
    .np-seo-bar-groups { grid-template-columns: 1fr; }
    .np-result-cert-head { flex-direction: column; }
    .np-result-cert-id { flex-direction: column; align-items: center; text-align: center; }
    .np-result-meta li { justify-content: center; }
    .np-result-actions { width: 100%; }
    .np-result-actions .np-btn { flex: 1; justify-content: center; }
    .np-result-card {
        grid-template-columns: 1fr;
        text-align: center;
    }
    .np-result-card-seat { justify-self: center; }
    .np-result-card-school { grid-column: 1; justify-content: center; }
    .hp-home__card { padding: 14px 10px 12px; gap: 14px; border-radius: 16px; }
    .hp-home__quick-grid { grid-template-columns: 1fr 1fr; gap: 6px; }
    .hp-home__quick-text small { white-space: normal; }
    .hp-coord-card { grid-template-columns: 1fr; text-align: center; }
    .hp-coord-row { grid-template-columns: 1fr; }
    .hp-coord-visual { display: none; }
    .hp-trust-grid { grid-template-columns: 1fr 1fr; }
    .hp-gov-grid { grid-template-columns: 1fr; }
    .hp-gov-compact-grid { grid-template-columns: 1fr; }
    .np-drawer-toggle-label { display: none; }
    .np-header-pill--thanwya .np-header-pill-text,
    .np-header-pill--tg .np-header-pill-text { display: none; }
    .np-header-pill { padding: 7px 9px; min-width: 34px; justify-content: center; }
    .np-header-actions { gap: 5px; }
    .np-header-v3-inner { gap: 8px; }
    .np-drawer-toggle { padding: 7px 9px; }
    .np-hero-rich-row { grid-template-columns: 1fr; }
    .np-hero-stat-grid { grid-template-columns: 1fr 1fr; }
    .np-coord-layout { grid-template-columns: 1fr; margin-top: 0; }
    .np-coord-form-grid { grid-template-columns: 1fr; }
    .np-coord-hero-visual { display: none; }
    .np-result-layout {
        grid-template-columns: 1fr;
        grid-template-areas:
            "cert"
            "aside"
            "share";
    }
    .np-result-layout--coord {
        grid-template-areas:
            "cert"
            "aside"
            "coord"
            "share";
    }
    .np-result-aside {
        position: static;
        max-height: none;
        overflow: visible;
    }
    .np-result-insights { grid-template-columns: 1fr; }
    .np-search-methods { grid-template-columns: 1fr 1fr; }
    .np-level-hero-row { grid-template-columns: 1fr; }
    .np-level-stat-grid { min-width: 0; }
    .np-level-soon-panel { flex-wrap: wrap; }
    .np-level-soon-badge { margin-inline-start: 0; }
    .np-gov-trio-grid { grid-template-columns: 1fr; }
    .np-year-banner-inner { flex-direction: column; }
    .np-year-banner-badge { margin-inline-start: 0; align-self: flex-start; }
    .np-result-coord-row { flex-direction: column; align-items: stretch; }
    .np-result-coord-btn { width: 100%; }
    .np-picker-toolbar { flex-direction: column; }
    .np-picker-submit { width: 100%; }
    .np-result-toppers-grid { grid-template-columns: 1fr; }
    .np-result-card--rich { grid-template-columns: 1fr; text-align: center; }
    .np-result-card-icon { justify-self: center; }
    .np-welcome-banner { grid-template-columns: 1fr; }
    .np-telegram-cta { flex-wrap: wrap; }
    .np-telegram-action { width: 100%; justify-content: center; }
    .np-edarat-head { flex-direction: column; align-items: stretch; }
    .np-edarat-card { grid-template-columns: auto 1fr; }
    .np-edarat-link, .np-edarat-soon { grid-column: 1 / -1; justify-self: stretch; text-align: center; }
    .np-coord-guide-year { margin-inline-start: 0; }
    .np-coord-guide-foot { flex-direction: column; align-items: stretch; }
    .np-news-hub-grid { grid-template-columns: 1fr; }
    .np-news-hub-card--lead { grid-row: span 1; }
    .np-news-pro-grid { grid-template-columns: 1fr; }
    .np-news-pro-head { flex-direction: column; align-items: stretch; }
    .np-news-pro-item { grid-template-columns: 72px 1fr; }
    .np-news-pro-item-go { display: none; }
    .np-edarat-quick-row { flex-wrap: wrap; }
    .np-edarat-quick-row .np-btn { width: 100%; }
    .np-level-gov-grid { grid-template-columns: 1fr; }
    .np-thanwya-kw-grid { grid-template-columns: 1fr; }
    .np-encourage-result { flex-direction: column; text-align: center; }
    .np-encourage-close { inset-inline-end: 12px; top: 12px; }
}

/* ── Thanwya SEO page ── */
.np-hero-features--emoji { list-style: none; padding: 0; margin: 14px 0 0; }
.np-hero-features--emoji li {
    font-size: .88rem;
    font-weight: 700;
    color: rgba(255,255,255,.92);
    padding: 4px 0;
}
.np-thanwya-soon-banner { background: linear-gradient(135deg, rgba(124,58,237,.12), rgba(168,85,247,.08)); border-color: rgba(124,58,237,.3); }
.np-thanwya-soon-banner .np-level-soon-icon { background: #7c3aed; }
.np-thanwya-soon-banner strong { color: #5b21b6; }
.np-thanwya-soon-banner p { color: #6d28d9; }
.np-thanwya-search-tabs {
    display: flex;
    gap: 8px;
    margin-bottom: 14px;
    flex-wrap: wrap;
}
.np-thanwya-tab {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 14px;
    border-radius: 999px;
    border: 1px solid var(--np-border);
    background: var(--np-bg);
    font-family: inherit;
    font-size: .8rem;
    font-weight: 800;
    color: var(--np-muted);
    cursor: pointer;
    transition: background .2s, border-color .2s, color .2s;
}
.np-thanwya-tab.is-on {
    background: color-mix(in srgb, var(--level-accent, #7c3aed) 12%, #fff);
    border-color: color-mix(in srgb, var(--level-accent, #7c3aed) 35%, var(--np-border));
    color: var(--level-accent, #7c3aed);
}
.np-encourage-result {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-top: 20px;
    padding: 22px 20px;
    border-radius: var(--np-radius);
    background: linear-gradient(135deg, #faf5ff 0%, #f0fdf4 50%, #eff6ff 100%);
    border: 2px solid rgba(124,58,237,.25);
    box-shadow: 0 12px 40px rgba(124,58,237,.12);
    overflow: hidden;
    animation: np-encourage-in .5s cubic-bezier(.34,1.56,.64,1);
}
.np-encourage-result.is-visible { animation: np-encourage-in .5s cubic-bezier(.34,1.56,.64,1); }
@keyframes np-encourage-in {
    from { opacity: 0; transform: translateY(12px) scale(.98); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}
.np-encourage-result-glow {
    position: absolute;
    inset: -40% auto auto -20%;
    width: 200px;
    height: 200px;
    background: radial-gradient(circle, rgba(124,58,237,.15) 0%, transparent 70%);
    pointer-events: none;
}
.np-encourage-emoji {
    font-size: 2.8rem;
    line-height: 1;
    flex-shrink: 0;
    filter: drop-shadow(0 4px 8px rgba(0,0,0,.08));
}
.np-encourage-body { flex: 1; min-width: 0; position: relative; z-index: 1; }
.np-encourage-body strong {
    display: block;
    font-size: 1.1rem;
    font-weight: 900;
    color: #5b21b6;
    margin-bottom: 8px;
}
.np-encourage-body p {
    margin: 0 0 12px;
    font-size: .92rem;
    font-weight: 700;
    color: #334155;
    line-height: 1.75;
}
.np-encourage-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.np-encourage-chips span {
    padding: 5px 12px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid rgba(124,58,237,.2);
    font-size: .75rem;
    font-weight: 800;
    color: #6d28d9;
}
.np-encourage-close {
    position: absolute;
    inset-inline-end: 10px;
    top: 10px;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 8px;
    background: rgba(255,255,255,.8);
    color: var(--np-muted);
    cursor: pointer;
    display: grid;
    place-items: center;
    z-index: 2;
}
.np-encourage-close:hover { background: #fff; color: #5b21b6; }
.np-level-keywords,
.np-thanwya-keywords { padding: 36px 0 40px; }
.np-level-kw-head,
.np-thanwya-kw-head { margin-bottom: 22px; text-align: right; }
.np-level-kw-head h2,
.np-thanwya-kw-head h2 {
    margin: 0 0 8px;
    font-size: 1.15rem;
    font-weight: 900;
    color: var(--np-brand);
    display: flex;
    align-items: center;
    gap: 10px;
}
.np-level-kw-head h2 i,
.np-thanwya-kw-head h2 i { color: var(--level-kw-accent, #0d9488); }
.np-level-kw-head p,
.np-thanwya-kw-head p { margin: 0; font-size: .88rem; color: var(--np-muted); font-weight: 600; }
.np-level-kw-grid,
.np-thanwya-kw-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 14px;
}
.np-level-kw-group,
.np-thanwya-kw-group {
    padding: 18px;
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius-sm);
    border-top: 3px solid var(--level-kw-accent, #0d9488);
}
.np-level-kw-group h3,
.np-thanwya-kw-group h3 {
    margin: 0 0 12px;
    font-size: .88rem;
    font-weight: 900;
    color: var(--np-brand);
    display: flex;
    align-items: center;
    gap: 8px;
}
.np-level-kw-group h3 i,
.np-thanwya-kw-group h3 i { color: var(--level-kw-accent, #0d9488); font-size: .85rem; }
.np-level-kw-group ul,
.np-thanwya-kw-group ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.np-level-kw-tag,
.np-thanwya-kw-tag {
    display: inline-block;
    padding: 5px 10px;
    border-radius: 8px;
    background: var(--np-bg);
    border: 1px solid var(--np-border);
    font-size: .72rem;
    font-weight: 700;
    color: var(--np-text-2);
    line-height: 1.4;
}
a.np-level-kw-tag--link {
    text-decoration: none;
    transition: background .15s, border-color .15s, color .15s, transform .12s;
}
a.np-level-kw-tag--link:hover {
    background: color-mix(in srgb, var(--level-kw-accent, #0d9488) 12%, var(--np-bg));
    border-color: color-mix(in srgb, var(--level-kw-accent, #0d9488) 35%, var(--np-border));
    color: var(--np-brand);
    transform: translateY(-1px);
}
.np-level-kw-jump {
    color: var(--level-kw-accent, #0d9488);
    font-weight: 800;
    text-decoration: none;
    border-bottom: 1px dashed color-mix(in srgb, var(--level-kw-accent, #0d9488) 50%, transparent);
}
.np-level-kw-jump:hover { color: var(--np-brand); }

/* ── Portal keyword hub — ربط الصفحات ── */
.np-kw-hub {
    padding: 40px 0 36px;
    background: linear-gradient(180deg, var(--np-bg) 0%, color-mix(in srgb, var(--np-brand) 4%, #fff) 100%);
    border-top: 1px solid var(--np-border);
}
.np-kw-hub-head {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 24px;
    text-align: right;
}
.np-kw-hub-head-ico {
    width: 52px;
    height: 52px;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--np-brand), #6366f1);
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 1.25rem;
    flex-shrink: 0;
    box-shadow: 0 8px 24px rgba(15, 118, 110, .25);
}
.np-kw-hub-head h2 {
    margin: 0 0 6px;
    font-size: 1.2rem;
    font-weight: 900;
    color: var(--np-brand);
}
.np-kw-hub-head p {
    margin: 0;
    font-size: .88rem;
    color: var(--np-muted);
    font-weight: 600;
    line-height: 1.65;
    max-width: 640px;
}
.np-kw-hub-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 14px;
}
.np-kw-hub-card {
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius-lg);
    overflow: hidden;
    box-shadow: var(--np-shadow);
    border-top: 4px solid var(--kw-accent, #0d9488);
}
.np-kw-hub-card-head {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px 16px 10px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--kw-accent, #0d9488) 8%, #fff), #fff);
}
.np-kw-hub-card-icon {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: color-mix(in srgb, var(--kw-accent, #0d9488) 18%, #fff);
    border: 1px solid color-mix(in srgb, var(--kw-accent, #0d9488) 28%, var(--np-border));
    color: var(--kw-accent, #0d9488);
    display: grid;
    place-items: center;
    font-size: 1rem;
    flex-shrink: 0;
}
.np-kw-hub-card-head h3 {
    margin: 0 0 4px;
    font-size: .92rem;
    font-weight: 900;
    color: var(--np-brand);
}
.np-kw-hub-card-head p {
    margin: 0;
    font-size: .75rem;
    color: var(--np-muted);
    font-weight: 600;
    line-height: 1.5;
}
.np-kw-hub-list {
    list-style: none;
    margin: 0;
    padding: 10px 12px 14px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.np-kw-hub-list--govs {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 6px;
}
.np-kw-hub-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 11px;
    border-radius: 10px;
    background: var(--np-bg);
    border: 1px solid var(--np-border);
    text-decoration: none;
    color: var(--np-text-2);
    font-size: .74rem;
    font-weight: 700;
    line-height: 1.35;
    transition: background .15s, border-color .15s, color .15s, transform .12s, box-shadow .15s;
    width: 100%;
    box-sizing: border-box;
}
.np-kw-hub-list:not(.np-kw-hub-list--govs) .np-kw-hub-link {
    width: auto;
}
.np-kw-hub-link:hover {
    background: color-mix(in srgb, var(--kw-accent, #0d9488) 10%, #fff);
    border-color: color-mix(in srgb, var(--kw-accent, #0d9488) 40%, var(--np-border));
    color: var(--np-brand);
    transform: translateX(-2px);
    box-shadow: 0 4px 12px color-mix(in srgb, var(--kw-accent, #0d9488) 15%, transparent);
    text-decoration: none;
}
.np-kw-hub-link.is-current {
    background: color-mix(in srgb, var(--kw-accent, #0d9488) 14%, #fff);
    border-color: var(--kw-accent, #0d9488);
    color: var(--np-brand);
    pointer-events: none;
}
.np-kw-hub-link-ico {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: color-mix(in srgb, var(--kw-accent, #0d9488) 12%, #fff);
    color: var(--kw-accent, #0d9488);
    display: grid;
    place-items: center;
    font-size: .78rem;
    flex-shrink: 0;
}
.np-kw-hub-link-text { flex: 1; min-width: 0; }
.np-kw-hub-link-go {
    font-size: .68rem;
    opacity: .45;
    flex-shrink: 0;
}
.np-kw-hub-link:hover .np-kw-hub-link-go { opacity: 1; }
@media (max-width: 640px) {
    .np-kw-hub-head { flex-direction: column; align-items: stretch; }
    .np-kw-hub-grid { grid-template-columns: 1fr; }
    .np-kw-hub-list--govs { grid-template-columns: 1fr; }
}

/* توزيع الروابط — ٧ روابط لكل صفحة */
.np-kw-hub--distributed { padding-top: 32px; padding-bottom: 28px; }
.np-kw-hub-card--single {
    border-top: 4px solid var(--kw-accent, #0d9488);
    border-radius: var(--np-radius-lg);
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    box-shadow: var(--np-shadow);
    overflow: hidden;
}
.np-kw-hub-list--distributed {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 10px;
    padding: 14px;
    margin: 0;
    list-style: none;
}
.np-kw-hub-list--distributed .np-kw-hub-link {
    width: 100%;
    min-height: 48px;
}
@media (max-width: 640px) {
    .np-kw-hub-list--distributed { grid-template-columns: 1fr; }
}

/* صفحتا SEO الإعدادية — prep3-saf-thalith · prep3-shahada */
.np-prep3-cross-link {
    margin: 14px 0 0;
    font-size: .82rem;
    font-weight: 700;
    color: var(--np-muted);
}
.np-prep3-cross-link a {
    color: var(--level-accent, #0d9488);
    text-decoration: none;
    border-bottom: 1px dashed color-mix(in srgb, var(--level-accent, #0d9488) 45%, transparent);
}
.np-prep3-cross-link a:hover { color: var(--np-brand); }
.np-prep3-landing-gov-grid .np-prep3-landing-gov-box {
    min-height: 118px;
}
.np-prep3-landing-gov-title {
    font-size: .72rem;
    line-height: 1.45;
    font-weight: 800;
    color: var(--np-brand);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.hp-level-card--prep3-landing strong {
    font-size: .82rem;
    line-height: 1.4;
}
.np-level-kw-group--govs { grid-column: 1 / -1; }
.np-level-kw-gov-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 8px;
}
.np-level-kw-gov-list .np-level-kw-tag {
    width: 100%;
    text-align: right;
    box-sizing: border-box;
}
.hp-level-card--primary-grade {
    border-style: dashed;
    border-color: color-mix(in srgb, var(--level-accent, #0891b2) 45%, var(--np-border));
}
.np-thanwya-blocks .np-level-block { border-inline-start: 3px solid #7c3aed; }

/* ═══ صفحة الثانوية العامة /thanwya — ألوان وعناصر أوضح ═══ */
html.np-level-thanwya {
    --thanwya-accent: #7c3aed;
    --thanwya-accent-2: #a855f7;
}
html.np-level-thanwya .np-hero--thanwya {
    padding-top: clamp(32px, 5vw, 48px);
    background: linear-gradient(155deg, #7c3aed 0%, #a855f7 28%, #6d28d9 50%, #4338ca 72%, #0f172a 100%) !important;
    color: #fff;
}
html.np-level-thanwya .np-hero--thanwya::before {
    background:
        radial-gradient(circle at 10% 90%, rgba(251, 191, 36, .16) 0%, transparent 44%),
        radial-gradient(circle at 90% 8%, rgba(255, 255, 255, .12) 0%, transparent 40%);
}
html.np-level-thanwya .np-hero--thanwya .np-breadcrumbs a { color: rgba(255, 255, 255, .9); }
html.np-level-thanwya .np-hero--thanwya .np-breadcrumbs span { color: rgba(255, 255, 255, .7); }
html.np-level-thanwya .np-hero--thanwya .np-page-title-inline--hero,
html.np-level-thanwya .np-hero--thanwya h1 { color: #fff !important; }
html.np-level-thanwya .np-hero--thanwya p { color: rgba(255, 255, 255, .92) !important; }
html.np-level-thanwya .np-hero--thanwya .np-tag {
    color: #fff;
    background: rgba(255, 255, 255, .14);
    border-color: rgba(255, 255, 255, .24);
}
html.np-level-thanwya .np-hero--thanwya .np-status--soon {
    background: rgba(255, 255, 255, .18);
    border-color: rgba(255, 255, 255, .3);
    color: #fff;
    font-weight: 800;
}
html.np-level-thanwya .np-hero-features--emoji li {
    background: rgba(255, 255, 255, .1);
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 10px;
    padding: 6px 10px;
    margin-bottom: 4px;
}
html.np-level-thanwya .np-level-stat-card {
    background: rgba(255, 255, 255, .14);
    border-color: rgba(255, 255, 255, .26);
    backdrop-filter: blur(8px);
}
html.np-level-thanwya .np-level-stat-card strong { color: #fff !important; font-size: 1.15rem; }
html.np-level-thanwya .np-level-stat-card span { color: rgba(255, 255, 255, .85) !important; }
html.np-level-thanwya .np-thanwya-search {
    border-radius: 22px;
    padding: clamp(22px, 4vw, 32px);
    border-top: 5px solid var(--thanwya-accent);
    box-shadow:
        0 24px 56px rgba(91, 33, 182, .22),
        0 0 0 1px rgba(124, 58, 237, .08);
}
html.np-level-thanwya .np-level-search-head h2 {
    font-size: clamp(1.08rem, 2.6vw, 1.32rem);
    font-weight: 900;
    color: var(--np-brand);
}
html.np-level-thanwya .np-thanwya-soon-banner {
    border-width: 2px;
    box-shadow: 0 6px 20px rgba(124, 58, 237, .1);
}
html.np-level-thanwya .np-thanwya-tab.is-on {
    background: color-mix(in srgb, var(--thanwya-accent) 14%, #fff);
    border-color: color-mix(in srgb, var(--thanwya-accent) 40%, var(--np-border));
    color: #5b21b6;
    box-shadow: 0 4px 14px rgba(124, 58, 237, .12);
}
html.np-level-thanwya .np-search-row--premium .np-btn--shine {
    min-width: 120px;
    font-weight: 900;
}
html.np-level-thanwya .np-thanwya-blocks .np-level-block {
    background: #fff;
    border: 1px solid rgba(124, 58, 237, .14);
    border-inline-start-width: 4px;
    border-inline-start-color: var(--thanwya-accent);
    box-shadow: 0 10px 28px rgba(91, 33, 182, .08);
    padding: 22px;
}
html.np-level-thanwya .np-thanwya-blocks .np-level-block h2 {
    font-size: 1.05rem;
}
html.np-level-thanwya .np-thanwya-kw {
    padding: 8px 0 36px;
}
html.np-level-thanwya .np-thanwya-kw-box {
    box-shadow: 0 14px 40px rgba(91, 33, 182, .12);
}
html.np-level-thanwya .np-level-govs-v3 .np-section-title {
    font-size: clamp(1.1rem, 2.8vw, 1.28rem);
}
html.np-level-thanwya .np-level-gov-box {
    box-shadow: 0 6px 18px rgba(15, 23, 42, .06);
}
html.np-level-thanwya .np-level-gov-box:hover {
    border-color: color-mix(in srgb, var(--thanwya-accent) 35%, var(--np-border));
    box-shadow: 0 12px 28px rgba(91, 33, 182, .12);
}
html.np-level-thanwya .hp-all-levels {
    padding-top: 20px;
}
html.np-level-thanwya .np-encourage-result {
    overflow: hidden;
    max-width: 100%;
}
html.np-level-thanwya .np-encourage-result-glow {
    inset: auto auto -20% -10%;
}
html.np-level-thanwya .np-kw-hub {
    margin-bottom: 0;
}
@media (max-width: 768px) {
    html.np-level-thanwya .np-level-hero-row { grid-template-columns: 1fr; }
    html.np-level-thanwya .np-level-stat-grid {
        width: 100%;
        min-width: 0;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    html.np-level-thanwya .np-search-row--premium {
        flex-direction: column;
        align-items: stretch;
    }
    html.np-level-thanwya .np-search-row--premium .np-btn--shine {
        width: 100%;
        min-width: 0;
    }
}

/* ── Share panel — premium dark rail ── */
.np-share-panel {
    position: relative;
    z-index: 10;
    margin-top: 20px;
    pointer-events: auto;
}
.np-share-panel--gov { margin-top: 0; margin-bottom: 4px; }
.np-share-panel--result { margin-top: 0; }
.np-share-panel-bg {
    position: absolute;
    inset: -1px;
    border-radius: 22px;
    background: linear-gradient(135deg, var(--share-accent, #1a6fb5), #7c3aed 45%, #059669);
    opacity: .55;
    filter: blur(0);
    z-index: 0;
}
.np-share-panel-inner {
    position: relative;
    z-index: 1;
    padding: 18px 18px 16px;
    border-radius: 21px;
    background: linear-gradient(165deg, #0f172a 0%, #1e293b 55%, #0f172a 100%);
    border: 1px solid rgba(255, 255, 255, .1);
    box-shadow:
        0 20px 50px rgba(15, 23, 42, .35),
        inset 0 1px 0 rgba(255, 255, 255, .08);
    overflow: hidden;
}
.np-share-panel-inner::before {
    content: '';
    position: absolute;
    inset-inline-end: -40px;
    top: -60px;
    width: 180px;
    height: 180px;
    border-radius: 50%;
    background: radial-gradient(circle, color-mix(in srgb, var(--share-accent, #1a6fb5) 45%, transparent) 0%, transparent 70%);
    pointer-events: none;
}
.np-share-panel-inner::after {
    content: '';
    position: absolute;
    inset-inline-start: -30px;
    bottom: -50px;
    width: 140px;
    height: 140px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(124, 58, 237, .25) 0%, transparent 70%);
    pointer-events: none;
}
.np-share-panel-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
    position: relative;
    z-index: 2;
}
.np-share-preview {
    position: relative;
    z-index: 2;
    margin-bottom: 16px;
    padding: 14px 16px;
    border-radius: 16px;
    background: rgba(255, 255, 255, .06);
    border: 1px solid rgba(255, 255, 255, .12);
    backdrop-filter: blur(6px);
}
.np-share-preview-badge {
    display: inline-block;
    font-size: .82rem;
    font-weight: 800;
    color: #fef08a;
    margin-bottom: 8px;
    letter-spacing: .02em;
}
.np-share-preview-name {
    margin: 0 0 10px;
    font-size: 1.05rem;
    font-weight: 800;
    color: #f8fafc;
    line-height: 1.35;
}
.np-share-preview-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 12px;
}
.np-share-preview-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 700;
    color: #e2e8f0;
    background: rgba(15, 23, 42, .55);
    border: 1px solid rgba(255, 255, 255, .1);
}
.np-share-preview-chip-ico { font-size: .9rem; line-height: 1; }
.np-share-preview-grades {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.np-share-preview-grades li {
    display: grid;
    grid-template-columns: auto 1fr auto auto;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 10px;
    background: rgba(15, 23, 42, .45);
    border: 1px solid rgba(255, 255, 255, .06);
    font-size: .8rem;
}
.np-share-preview-sub-ico { font-size: 1rem; line-height: 1; }
.np-share-preview-sub-name {
    color: #cbd5e1;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.np-share-preview-sub-score {
    color: #f8fafc;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    direction: ltr;
    unicode-bidi: embed;
}
.np-share-preview-sub-badge { font-size: .95rem; line-height: 1; }
.np-share-preview-more {
    justify-content: center;
    color: #94a3b8 !important;
    font-size: .75rem !important;
    background: transparent !important;
    border: none !important;
    grid-template-columns: 1fr !important;
    text-align: center;
}
.np-share-preview-foot {
    margin: 12px 0 0;
    font-size: .78rem;
    font-weight: 600;
    color: #94a3b8;
}
.np-share-panel-title {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}
.np-share-panel-emoji {
    font-size: 1.75rem;
    line-height: 1;
    flex-shrink: 0;
    filter: drop-shadow(0 4px 8px rgba(0,0,0,.3));
}
.np-share-panel-title strong {
    display: block;
    font-size: .95rem;
    font-weight: 900;
    color: #f8fafc;
    margin-bottom: 3px;
    letter-spacing: -.01em;
}
.np-share-panel-title span {
    display: block;
    font-size: .72rem;
    font-weight: 600;
    color: rgba(248, 250, 252, .55);
    line-height: 1.45;
}
.np-share-panel-copy {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, .15);
    background: rgba(255, 255, 255, .06);
    color: #e2e8f0;
    font-family: inherit;
    font-size: .72rem;
    font-weight: 800;
    cursor: pointer;
    transition: background .2s, border-color .2s, transform .15s;
    position: relative;
    z-index: 2;
}
.np-share-panel-copy em { font-style: normal; }
.np-share-panel-copy:hover {
    background: rgba(255, 255, 255, .12);
    border-color: rgba(255, 255, 255, .25);
    transform: scale(1.04);
}
.np-share-panel-copy.is-copied {
    background: rgba(5, 150, 105, .25);
    border-color: rgba(52, 211, 153, .45);
    color: #6ee7b7;
}
.np-share-panel-rail {
    display: flex;
    flex-wrap: nowrap;
    gap: 8px;
    overflow-x: auto;
    padding-bottom: 4px;
    position: relative;
    z-index: 2;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    mask-image: linear-gradient(to left, transparent, #000 12px, #000 calc(100% - 12px), transparent);
}
.np-share-panel-rail::-webkit-scrollbar { display: none; }
.np-share-pill {
    flex: 0 0 auto;
    scroll-snap-align: start;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px 10px 12px;
    border-radius: 14px;
    text-decoration: none;
    color: #fff;
    font-size: .78rem;
    font-weight: 800;
    white-space: nowrap;
    border: 1px solid rgba(255, 255, 255, .12);
    background: rgba(255, 255, 255, .06);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    cursor: pointer;
    position: relative;
    overflow: hidden;
    transition: transform .2s cubic-bezier(.34,1.4,.64,1), box-shadow .2s, border-color .2s;
    -webkit-tap-highlight-color: transparent;
}
.np-share-pill::before {
    content: '';
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity .2s;
    background: linear-gradient(135deg, rgba(255,255,255,.15), transparent);
}
.np-share-pill:hover {
    transform: translateY(-3px) scale(1.02);
    text-decoration: none;
    color: #fff;
    box-shadow: 0 12px 28px rgba(0, 0, 0, .35);
}
.np-share-pill:hover::before { opacity: 1; }
.np-share-pill-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
    box-shadow: 0 0 8px currentColor;
}
.np-share-pill-ico {
    width: 32px;
    height: 32px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    font-size: 1.05rem;
    flex-shrink: 0;
    background: rgba(0, 0, 0, .2);
}
.np-share-pill-name { position: relative; z-index: 1; }
.np-share-pill-arrow {
    font-size: .65rem;
    opacity: .5;
    margin-inline-start: 2px;
}
.np-share-pill--wa {
    border-color: rgba(37, 211, 102, .35);
    background: linear-gradient(135deg, rgba(37, 211, 102, .22), rgba(18, 140, 126, .12));
}
.np-share-pill--wa .np-share-pill-dot { background: #25D366; color: #25D366; }
.np-share-pill--wa .np-share-pill-ico { color: #4ade80; }
.np-share-pill--tg {
    border-color: rgba(42, 171, 238, .35);
    background: linear-gradient(135deg, rgba(42, 171, 238, .22), rgba(34, 158, 217, .1));
}
.np-share-pill--tg .np-share-pill-dot { background: #2AABEE; color: #2AABEE; }
.np-share-pill--tg .np-share-pill-ico { color: #7dd3fc; }
.np-share-pill--msgr {
    border-color: rgba(0, 153, 255, .35);
    background: linear-gradient(135deg, rgba(0, 153, 255, .22), rgba(0, 106, 255, .1));
}
.np-share-pill--msgr .np-share-pill-dot { background: #0099FF; color: #0099FF; }
.np-share-pill--msgr .np-share-pill-ico { color: #93c5fd; }
.np-share-pill--fb {
    border-color: rgba(24, 119, 242, .35);
    background: linear-gradient(135deg, rgba(24, 119, 242, .22), rgba(13, 91, 215, .1));
}
.np-share-pill--fb .np-share-pill-dot { background: #1877F2; color: #1877F2; }
.np-share-pill--fb .np-share-pill-ico { color: #93c5fd; }
.np-share-pill--x {
    border-color: rgba(255, 255, 255, .2);
    background: linear-gradient(135deg, rgba(255, 255, 255, .1), rgba(0, 0, 0, .25));
}
.np-share-pill--x .np-share-pill-dot { background: #e2e8f0; color: #e2e8f0; }
.np-share-pill--x .np-share-pill-ico { color: #f1f5f9; }
.np-share-pill--snap {
    border-color: rgba(255, 252, 0, .4);
    background: linear-gradient(135deg, rgba(255, 252, 0, .18), rgba(245, 211, 0, .08));
}
.np-share-pill--snap .np-share-pill-dot { background: #FFFC00; color: #FFFC00; }
.np-share-pill--snap .np-share-pill-ico { color: #FFFC00; }
.np-share-pill--snap .np-share-pill-name { color: #fef08a; }
@media (min-width: 720px) {
    .np-share-panel-rail {
        flex-wrap: wrap;
        overflow-x: visible;
        mask-image: none;
        justify-content: flex-start;
    }
    .np-share-pill { flex: 1 1 calc(33.333% - 8px); min-width: 140px; justify-content: flex-start; }
}
@media (max-width: 400px) {
    .np-share-panel-copy em { display: none; }
    .np-share-panel-copy { padding: 9px 11px; }
}

/* ── Primary (ابتدائي) page ── */
.np-hero--primary {
    --level-accent: #0891b2;
    --level-accent-2: #06b6d4;
    background: linear-gradient(155deg, #0891b2 0%, #06b6d4 30%, #0e7490 52%, #164e63 78%, #0f172a 100%) !important;
    color: #fff;
}
html.np-level-primary .np-hero--primary .np-breadcrumbs a { color: rgba(255, 255, 255, .9); }
html.np-level-primary .np-hero--primary .np-breadcrumbs span { color: rgba(255, 255, 255, .7); }
html.np-level-primary .np-hero--primary .np-page-title-inline--hero,
html.np-level-primary .np-hero--primary h1 { color: #fff !important; }
html.np-level-primary .np-hero--primary p { color: rgba(255, 255, 255, .92) !important; }
html.np-level-primary .np-hero--primary .np-tag {
    color: #fff;
    background: rgba(255, 255, 255, .14);
    border-color: rgba(255, 255, 255, .24);
}
html.np-level-primary .np-hero--primary .np-status--soon {
    background: rgba(255, 255, 255, .18);
    border-color: rgba(255, 255, 255, .3);
    color: #fff;
}
html.np-level-primary .np-hero--primary .np-hero-features { color: rgba(255, 255, 255, .95); }
html.np-level-primary .np-hero--primary .np-hero-features i { color: #a5f3fc; }
html.np-level-primary .np-level-stat-card {
    background: rgba(255, 255, 255, .14);
    border-color: rgba(255, 255, 255, .26);
}
html.np-level-primary .np-primary-search {
    border-radius: 22px;
    border-top-width: 5px;
    box-shadow: 0 24px 56px rgba(8, 145, 178, .18);
}
.np-primary-soon-banner {
    background: linear-gradient(135deg, rgba(8,145,178,.1), rgba(6,182,212,.06));
    border-color: rgba(8,145,178,.28);
}
.np-primary-soon-banner .np-level-soon-icon { background: #0891b2; }
.np-primary-soon-banner strong { color: #0e7490; }
.np-primary-soon-banner p { color: #155e75; }
.np-primary-grade-tabs {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 18px 0 16px;
}
.np-primary-grade-tab {
    display: flex;
    align-items: center;
    gap: 14px;
    width: 100%;
    padding: 14px 16px;
    border-radius: 16px;
    border: 2px solid var(--np-border);
    background: var(--np-bg);
    font-family: inherit;
    text-align: right;
    cursor: pointer;
    transition: border-color .2s, box-shadow .2s, background .2s, transform .15s;
}
.np-primary-grade-tab:hover {
    border-color: color-mix(in srgb, var(--grade-accent, #0891b2) 40%, var(--np-border));
    box-shadow: 0 8px 24px rgba(8,145,178,.1);
    transform: translateX(-2px);
}
.np-primary-grade-tab.is-on {
    border-color: color-mix(in srgb, var(--grade-accent, #0891b2) 55%, var(--np-border));
    background: linear-gradient(135deg, #fff 0%, color-mix(in srgb, var(--grade-accent, #0891b2) 8%, #fff) 100%);
    box-shadow: 0 10px 28px rgba(8,145,178,.12);
}
.np-primary-grade-tab-ico {
    flex-shrink: 0;
    width: 46px;
    height: 46px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: color-mix(in srgb, var(--grade-accent, #0891b2) 14%, #fff);
    color: var(--grade-accent, #0891b2);
    font-size: 1.15rem;
}
.np-primary-grade-tab-text {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
    text-align: right;
}
.np-primary-grade-tab-text strong {
    font-size: .92rem;
    font-weight: 900;
    color: var(--np-brand);
    line-height: 1.45;
}
.np-primary-grade-tab-text small {
    font-size: .76rem;
    font-weight: 700;
    color: var(--np-text-3);
}
.np-primary-grade-panel { display: none; }
.np-primary-grade-panel.is-on { display: block; animation: np-primary-panel-in .25s ease; }
@keyframes np-primary-panel-in {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}
.np-primary-grade-intro {
    margin: 0 0 14px;
    font-size: .92rem;
    color: var(--np-muted);
    line-height: 1.75;
    text-align: right;
}
@media (min-width: 768px) {
    .np-primary-grade-tabs {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 12px;
    }
    .np-primary-grade-tab {
        flex-direction: column;
        align-items: stretch;
        text-align: center;
        padding: 18px 14px;
        min-height: 100%;
    }
    .np-primary-grade-tab-ico {
        width: 52px;
        height: 52px;
        margin: 0 auto;
        font-size: 1.25rem;
    }
    .np-primary-grade-tab-text { text-align: center; align-items: center; }
    .np-primary-grade-tab-text strong { font-size: .82rem; }
}

/* ── نتائج الأزهر — قسم الرئيسية + صفحات الاستعلام ── */
.hp-azhar-hub {
    padding: 36px 0 28px;
    margin-bottom: 8px;
}
.hp-azhar-hub-head {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 22px;
}
.hp-azhar-hub-head-ico {
    width: 56px;
    height: 56px;
    border-radius: 18px;
    background: linear-gradient(135deg, #065f46, #0d9488);
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 1.35rem;
    box-shadow: 0 10px 28px rgba(6, 95, 70, .28);
    flex-shrink: 0;
}
.hp-azhar-hub-head h2 {
    margin: 0 0 6px;
    font-size: 1.25rem;
    font-weight: 900;
    color: var(--np-brand);
}
.hp-azhar-hub-head p {
    margin: 0;
    font-size: .88rem;
    color: var(--np-muted);
    font-weight: 600;
    line-height: 1.6;
}
.hp-azhar-hub-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 14px;
}
.hp-azhar-card {
    position: relative;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 14px;
    padding: 18px 16px;
    border-radius: var(--np-radius-lg);
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    text-decoration: none;
    color: inherit;
    overflow: hidden;
    box-shadow: var(--np-shadow);
    border-top: 4px solid var(--azhar-accent, #0f766e);
    transition: transform .15s, box-shadow .2s, border-color .2s;
}
.hp-azhar-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--np-shadow-lg);
    text-decoration: none;
    border-color: color-mix(in srgb, var(--azhar-accent, #0f766e) 45%, var(--np-border));
}
.hp-azhar-card-glow {
    position: absolute;
    inset: -40% -20% auto auto;
    width: 140px;
    height: 140px;
    background: radial-gradient(circle, color-mix(in srgb, var(--azhar-accent, #0f766e) 22%, transparent), transparent 70%);
    pointer-events: none;
}
.hp-azhar-card-icon {
    width: 52px;
    height: 52px;
    border-radius: 16px;
    background: color-mix(in srgb, var(--azhar-accent, #0f766e) 14%, #fff);
    border: 1px solid color-mix(in srgb, var(--azhar-accent, #0f766e) 30%, var(--np-border));
    color: var(--azhar-accent, #0f766e);
    display: grid;
    place-items: center;
    font-size: 1.2rem;
    flex-shrink: 0;
    z-index: 1;
}
.hp-azhar-card-body {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
    z-index: 1;
}
.hp-azhar-card-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: .68rem;
    font-weight: 800;
    color: var(--azhar-accent, #0f766e);
}
.hp-azhar-card-body strong {
    font-size: .92rem;
    font-weight: 900;
    color: var(--np-brand);
    line-height: 1.4;
}
.hp-azhar-card-desc {
    font-size: .75rem;
    color: var(--np-muted);
    font-weight: 600;
}
.hp-azhar-card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    font-size: .7rem;
    color: var(--np-text-2);
    font-weight: 700;
    margin-top: 4px;
}
.hp-azhar-card-meta i { color: var(--azhar-accent, #0f766e); }
.hp-azhar-card-go {
    color: var(--azhar-accent, #0f766e);
    opacity: .5;
    z-index: 1;
}
.hp-azhar-card:hover .hp-azhar-card-go { opacity: 1; }
.hp-level-card--azhar .hp-level-card-badge.is-azhar {
    background: linear-gradient(135deg, rgba(6, 95, 70, .12), rgba(13, 148, 136, .08));
    color: #065f46;
    border: 1px solid rgba(6, 95, 70, .2);
}
.hp-section-head-note {
    display: block;
    font-size: .72rem;
    font-weight: 700;
    color: var(--np-muted);
    margin-top: 4px;
}
.hp-azhar-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .15);
    border: 1px solid rgba(255, 255, 255, .25);
    font-size: .75rem;
    font-weight: 800;
    margin-bottom: 10px;
}
.np-azhar-source-card {
    padding: 20px;
    border-radius: var(--np-radius-lg);
    background: rgba(255, 255, 255, .12);
    border: 1px solid rgba(255, 255, 255, .2);
    text-align: center;
    color: #fff;
}
.np-azhar-source-card i { font-size: 1.5rem; display: block; margin-bottom: 8px; }
.np-azhar-source-card strong { display: block; font-size: .9rem; }
.np-azhar-source-card span { font-size: .75rem; opacity: .85; }
.np-azhar-search-card {
    margin-top: -32px;
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius-lg);
    padding: 22px 20px 24px;
    box-shadow: var(--np-shadow-lg);
    border-top: 4px solid var(--azhar-accent, #0f766e);
}
.np-azhar-search-head h2 {
    margin: 0 0 6px;
    font-size: 1.1rem;
    font-weight: 900;
    color: var(--np-brand);
}
.np-azhar-search-head p {
    margin: 0 0 16px;
    font-size: .85rem;
    color: var(--np-muted);
    font-weight: 600;
}
.np-azhar-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 14px;
}
.np-azhar-field--full { grid-column: 1 / -1; }
.np-azhar-field-label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: .78rem;
    font-weight: 800;
    color: var(--np-text-2);
    margin-bottom: 6px;
}
.np-azhar-input {
    width: 100%;
    box-sizing: border-box;
    padding: 12px 14px;
    border-radius: 12px;
    border: 1px solid var(--np-border);
    background: var(--np-bg);
    font-family: inherit;
    font-size: 1rem;
    font-weight: 700;
    color: var(--np-text);
    min-height: 48px;
}
.np-azhar-input:focus {
    outline: none;
    border-color: var(--azhar-accent, #0f766e);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--azhar-accent, #0f766e) 18%, transparent);
}
.np-azhar-submit { width: 100%; min-height: 50px; font-size: 1rem; }
#azhar-result-slot:not(:empty) {
    display: block;
    visibility: visible;
    width: 100%;
}
.np-azhar-result-slot-wrap {
    padding-top: 4px;
    padding-bottom: 20px;
}
.np-azhar-result-inline {
    margin-top: 12px;
    margin-bottom: 20px;
    scroll-margin-top: calc(var(--np-header-h, 55px) + 12px);
    width: 100%;
    max-width: 100%;
    overflow: visible;
}
.np-azhar-result-inline .np-result-success-banner {
    display: flex !important;
    margin-bottom: 14px;
}
.np-azhar-result-inline .np-azhar-result-card {
    display: block;
    visibility: visible;
    max-width: 100%;
    overflow: visible;
}
.np-azhar-result-card {
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius-lg);
    overflow: hidden;
    box-shadow: var(--np-shadow-lg);
    border-top: 4px solid var(--azhar-accent, #0f766e);
}
.np-azhar-result-head {
    display: flex;
    gap: 16px;
    padding: 20px 18px;
    align-items: flex-start;
    border-bottom: 1px solid var(--np-border);
    background: linear-gradient(135deg, color-mix(in srgb, var(--azhar-accent, #0f766e) 6%, #fff), #fff);
}
.np-azhar-result-name {
    margin: 0 0 8px;
    font-size: clamp(1.05rem, 4.5vw, 1.35rem);
    font-weight: 900;
    color: var(--np-brand);
    word-break: break-word;
    line-height: 1.45;
}
.np-azhar-result-label {
    margin: 0 0 4px;
    font-size: .75rem;
    font-weight: 800;
    color: var(--np-muted);
}
.np-azhar-result-table-wrap {
    padding: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.np-azhar-result-table {
    width: 100%;
    border-collapse: collapse;
    font-size: .88rem;
}
.np-azhar-result-table th,
.np-azhar-result-table td {
    padding: 12px 16px;
    border-bottom: 1px solid var(--np-border);
    text-align: right;
    vertical-align: top;
}
.np-azhar-result-table th {
    width: 38%;
    background: var(--np-bg);
    font-weight: 800;
    color: var(--np-text-2);
    white-space: nowrap;
}
.np-azhar-result-table td {
    font-weight: 700;
    color: var(--np-brand);
    word-break: break-word;
}
.np-azhar-subjects {
    padding: 16px 18px;
    border-top: 1px solid var(--np-border);
}
.np-azhar-subjects ul {
    list-style: none;
    margin: 10px 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.np-azhar-subjects li {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    background: var(--np-bg);
    border-radius: 10px;
    font-weight: 700;
}
.np-azhar-result-foot {
    padding: 14px 18px;
    background: var(--np-surface-2);
    font-size: .8rem;
    color: var(--np-muted);
    font-weight: 600;
}

.np-azhar-hero-intro {
    margin: 10px 0 0;
    font-size: .88rem;
    font-weight: 600;
    line-height: 1.65;
    color: rgba(255, 255, 255, .88);
    max-width: 520px;
}
.np-azhar-fields-help {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px dashed var(--np-border);
    font-size: .75rem;
    font-weight: 600;
    color: var(--np-muted);
    line-height: 1.5;
}
.np-azhar-fields-help strong { color: var(--np-text-2); }

/* تنبيه — النتيجة لم تظهر + دعاء وتهنئة */
.np-azhar-notice {
    margin-bottom: 20px;
    border-radius: var(--np-radius-lg);
    border: 1px solid color-mix(in srgb, var(--azhar-accent, #0f766e) 35%, var(--np-border));
    background: linear-gradient(135deg, color-mix(in srgb, var(--azhar-accent, #0f766e) 8%, #fff), #fff);
    overflow: hidden;
}
.np-azhar-notice--soon { border-top: 4px solid var(--azhar-accent, #d97706); }
.np-azhar-notice-head {
    display: flex;
    gap: 14px;
    padding: 18px 16px;
    align-items: flex-start;
}
.np-azhar-notice-icon {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    background: color-mix(in srgb, var(--azhar-accent, #d97706) 18%, #fff);
    color: var(--azhar-accent, #b45309);
    display: grid;
    place-items: center;
    font-size: 1.2rem;
    flex-shrink: 0;
}
.np-azhar-notice-head h3 {
    margin: 0 0 8px;
    font-size: 1.05rem;
    font-weight: 900;
    color: var(--np-brand);
}
.np-azhar-notice-lead {
    margin: 0;
    font-size: .85rem;
    font-weight: 600;
    color: var(--np-text-2);
    line-height: 1.65;
}
.np-azhar-notice-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 10px 0 0;
    font-size: .78rem;
    font-weight: 800;
    color: var(--azhar-accent, #0f766e);
}
.np-azhar-notice-meta span { display: inline-flex; align-items: center; gap: 6px; }
.np-azhar-notice-tips {
    padding: 14px 16px;
    background: var(--np-bg);
    border-top: 1px solid var(--np-border);
}
.np-azhar-notice-tips strong {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: .82rem;
    color: var(--np-brand);
    margin-bottom: 8px;
}
.np-azhar-notice-tips ul {
    margin: 0;
    padding: 0 18px 0 0;
    font-size: .8rem;
    font-weight: 600;
    color: var(--np-muted);
    line-height: 1.65;
}
.np-azhar-notice-blessing {
    padding: 18px 16px 20px;
    background: linear-gradient(180deg, #fffbeb 0%, #f0fdf4 100%);
    border-top: 1px solid rgba(180, 83, 9, .15);
    text-align: center;
}
.np-azhar-notice-intro-msg {
    margin: 0 0 10px;
    font-size: .9rem;
    font-weight: 800;
    color: #92400e;
}
.np-azhar-notice-congrats {
    margin: 0 0 14px;
    font-size: .85rem;
    font-weight: 700;
    color: var(--np-text-2);
    line-height: 1.75;
}
.np-azhar-notice-dua {
    margin: 0 0 14px;
    padding: 16px 14px;
    border-radius: 14px;
    background: rgba(255, 255, 255, .75);
    border: 1px solid rgba(6, 95, 70, .2);
    font-size: .92rem;
    font-weight: 700;
    line-height: 1.9;
    color: #065f46;
    font-style: normal;
}
.np-azhar-notice-dua i {
    display: block;
    font-size: 1.35rem;
    margin-bottom: 8px;
    color: var(--azhar-accent, #0f766e);
}
.np-azhar-notice-wishes {
    list-style: none;
    margin: 0 0 12px;
    padding: 0;
    text-align: right;
}
.np-azhar-notice-wishes li {
    font-size: .8rem;
    font-weight: 700;
    color: var(--np-text-2);
    padding: 5px 0;
    line-height: 1.55;
}
.np-azhar-notice-wishes i { color: #d97706; margin-inline-end: 6px; }
.np-azhar-notice-closing {
    margin: 0;
    font-size: .78rem;
    font-weight: 600;
    color: var(--np-muted);
}
.np-azhar-notice-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px 16px;
    border-top: 1px solid var(--np-border);
    background: var(--np-surface-2);
}
.np-azhar-notice-nav a {
    padding: 8px 12px;
    border-radius: 999px;
    background: var(--np-bg);
    border: 1px solid var(--np-border);
    font-size: .72rem;
    font-weight: 800;
    color: var(--azhar-accent, #0f766e);
    text-decoration: none;
}
.np-azhar-notice-nav a:hover {
    background: color-mix(in srgb, var(--azhar-accent, #0f766e) 10%, #fff);
}

/* معلومات أسفل مربع البحث */
.np-azhar-info { padding-bottom: 40px; }
.np-azhar-info .np-section-title { margin-bottom: 16px; }
.np-azhar-steps {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 10px;
    margin-bottom: 20px;
}
.np-azhar-step {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: 12px;
    font-size: .8rem;
    font-weight: 700;
    color: var(--np-text-2);
}
.np-azhar-step-num {
    width: 32px;
    height: 32px;
    border-radius: 10px;
    background: var(--np-brand);
    color: #fff;
    display: grid;
    place-items: center;
    font-weight: 900;
    flex-shrink: 0;
}
.np-azhar-info-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 14px;
    margin-bottom: 18px;
}
.np-azhar-info-card {
    display: flex;
    gap: 14px;
    padding: 16px;
    background: var(--np-surface);
    border: 1px solid var(--np-border);
    border-radius: var(--np-radius-lg);
    border-inline-start: 4px solid var(--azhar-accent, #0f766e);
    box-shadow: var(--np-shadow);
}
.np-azhar-info-card h3 {
    margin: 0 0 8px;
    font-size: .92rem;
    font-weight: 900;
    color: var(--np-brand);
}
.np-azhar-info-card p {
    margin: 0;
    font-size: .8rem;
    font-weight: 600;
    color: var(--np-muted);
    line-height: 1.65;
}
.np-azhar-source-note {
    margin: 0 0 16px;
    padding: 12px 14px;
    border-radius: 10px;
    background: var(--np-bg);
    font-size: .78rem;
    font-weight: 700;
    color: var(--np-muted);
}
.np-azhar-source-note i { color: var(--np-live); margin-inline-end: 6px; }
.np-azhar-stage-links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.np-azhar-stage-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-radius: 12px;
    border: 1px solid color-mix(in srgb, var(--azhar-accent, #0f766e) 30%, var(--np-border));
    background: color-mix(in srgb, var(--azhar-accent, #0f766e) 6%, #fff);
    font-size: .78rem;
    font-weight: 800;
    color: var(--azhar-accent, #0f766e);
    text-decoration: none;
}
.np-azhar-stage-link:hover { text-decoration: none; transform: translateY(-1px); }

@media (max-width: 768px) {
    .np-azhar-notice-head { flex-direction: column; }
    .np-azhar-info-grid { grid-template-columns: 1fr; }
    .np-azhar-steps { grid-template-columns: 1fr; }
}

/* ── تحسين الموبايل — صفحة النتيجة والبحث ── */
@media (max-width: 768px) {
    .hp-azhar-hub-grid { grid-template-columns: 1fr; }
    .hp-azhar-card { grid-template-columns: auto 1fr; }
    .hp-azhar-card-go { display: none; }
    .np-azhar-form-grid { grid-template-columns: 1fr; }
    .np-azhar-field--full { grid-column: 1; }
    .np-azhar-result-head { flex-direction: column; align-items: center; text-align: center; }
    .np-azhar-result-id { width: 100%; }
    .np-result-chips { justify-content: center; }
    .np-azhar-result-table {
        display: table;
        width: 100%;
    }
    .np-azhar-result-table tr {
        display: table-row;
    }
    .np-azhar-result-table th,
    .np-azhar-result-table td {
        display: table-cell;
        width: auto;
        padding: 10px 12px;
        font-size: .88rem;
        vertical-align: middle;
    }
    .np-azhar-result-table th {
        width: 38%;
        background: var(--np-surface-2);
        font-size: .75rem;
    }
    .np-azhar-result-table-wrap {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .np-result-page {
        overflow-x: visible;
        max-width: 100%;
        width: 100%;
    }
    .np-result-cert,
    .np-result-layout {
        overflow: visible;
        max-width: 100%;
    }
    .np-result-cert-head h2 {
        font-size: clamp(1rem, 5vw, 1.25rem);
        word-break: break-word;
        overflow-wrap: anywhere;
        hyphens: auto;
    }
    .np-result-meta,
    .np-result-meta li {
        word-break: break-word;
        overflow-wrap: anywhere;
    }
    .np-result-stats--icons {
        grid-template-columns: 1fr;
        padding: 16px 14px;
    }
    .np-result-stat-tile strong {
        word-break: break-word;
        font-size: .95rem;
    }
    .np-result-card--rich {
        grid-template-columns: 1fr;
        gap: 10px;
        padding: 14px;
    }
    .np-result-card-name,
    .np-result-card-body strong {
        white-space: normal;
        word-break: break-word;
        overflow-wrap: anywhere;
        display: block;
        max-width: 100%;
    }
    .np-result-card-school {
        white-space: normal;
        word-break: break-word;
    }
    .np-result-list-banner h2 {
        font-size: 1.05rem;
        word-break: break-word;
    }
    .np-result-toolbar {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }
    .np-result-toolbar .np-back { width: 100%; justify-content: center; }
    .np-search-methods { grid-template-columns: 1fr; }
    .np-search-field input,
    .np-search-field select,
    .np-azhar-input {
        font-size: 16px;
        min-height: 48px;
    }
    .np-table-wrap {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        max-width: 100%;
    }
    .np-result-subject-name,
    .np-result-subject-score {
        word-break: break-word;
    }
    .np-result-success-banner {
        flex-wrap: wrap;
        gap: 10px;
    }
    .np-hero--result h1 {
        font-size: clamp(1.1rem, 5vw, 1.4rem);
        word-break: break-word;
    }
}

@media (max-width: 480px) {
    .hp-azhar-hub-head { flex-direction: column; }
    .np-level-gov-box-title,
    .np-prep3-landing-gov-title,
    .np-diploma-prep-gov-title {
        -webkit-line-clamp: 4;
    }
}

/* —— صفحة الدبلومات الفنية /fany —— */
/* هيرو داكن — لا خلفية بيضاء (كانت تخفي النص الأبيض والبطاقات) */
.np-hero--diploma {
    --level-accent: #c2410c;
    --level-accent-2: #ea580c;
    background: linear-gradient(155deg, #c2410c 0%, #ea580c 36%, #9a3412 58%, #0f172a 100%) !important;
    color: #fff;
}
.np-hero--diploma .np-breadcrumbs a { color: rgba(255, 255, 255, .88); }
.np-hero--diploma .np-breadcrumbs a:hover { color: #fff; }
.np-hero--diploma .np-breadcrumbs span { color: rgba(255, 255, 255, .72); }
.np-hero--diploma h1,
.np-hero--diploma .np-page-title-inline--hero { color: #fff !important; }
.np-hero--diploma p { color: rgba(255, 255, 255, .9) !important; }
.np-hero--diploma .np-tag { color: #fff; background: rgba(255, 255, 255, .14); border-color: rgba(255, 255, 255, .22); }
.np-hero--diploma .np-hero-features { color: rgba(255, 255, 255, .95); }
.np-hero--diploma .np-hero-features li {
    background: rgba(255, 255, 255, .12);
    border-color: rgba(255, 255, 255, .2);
    color: #fff;
}
.np-hero--diploma .np-hero-features i { color: #fed7aa; }
.np-hero--diploma .np-page-title-icon--hero {
    background: rgba(255, 255, 255, .22);
    border-color: rgba(255, 255, 255, .34);
    color: #fff;
}
.np-hero--diploma .np-level-stat-card {
    background: rgba(255, 255, 255, .12);
    border-color: rgba(255, 255, 255, .22);
}
.np-hero--diploma .np-level-stat-card strong { color: #fff !important; }
.np-hero--diploma .np-level-stat-card span { color: rgba(255, 255, 255, .82) !important; }
.np-hero--diploma .np-level-stat-card .np-ico-box {
    background: rgba(255, 255, 255, .22);
    border-color: rgba(255, 255, 255, .34);
    color: #fff;
}
.np-hero--diploma .np-diploma-badge,
.np-hero--diploma .hp-azhar-badge.np-diploma-badge {
    background: rgba(255, 255, 255, .15);
    border: 1px solid rgba(255, 255, 255, .28);
    color: #fff;
}
.np-diploma-links { padding: 28px 0 8px; }
.np-diploma-links-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 12px;
    direction: rtl;
}
.np-diploma-link-card {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    border-radius: 16px;
    border: 1px solid var(--np-border);
    background: #fff;
    box-shadow: 0 2px 10px rgba(15, 23, 42, .05);
    text-decoration: none;
    color: inherit;
    transition: border-color .2s, box-shadow .2s, transform .15s;
}
.np-diploma-link-card:hover {
    border-color: color-mix(in srgb, #c2410c 35%, var(--np-border));
    box-shadow: 0 8px 24px rgba(194, 65, 12, .1);
    transform: translateY(-2px);
    text-decoration: none;
}
.np-diploma-link-ico {
    width: 44px;
    height: 44px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: color-mix(in srgb, #c2410c 12%, #fff);
    color: #c2410c;
    font-size: 1rem;
}
.np-diploma-link-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    text-align: right;
}
.np-diploma-link-text strong {
    font-size: .9rem;
    font-weight: 900;
    color: var(--np-brand);
}
.np-diploma-link-text small {
    font-size: .74rem;
    color: var(--np-muted);
}
.np-diploma-link-go {
    color: #c2410c;
    opacity: .45;
    font-size: .8rem;
}
.np-diploma-link-card:hover .np-diploma-link-go { opacity: 1; }
.np-diploma-blocks .np-diploma-block {
    border-inline-start: 4px solid #c2410c;
}
.np-diploma-prep-govs {
    padding: 32px 0 40px;
    margin-bottom: 8px;
}
.np-diploma-prep-gov-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    align-items: stretch;
}
.np-diploma-prep-gov-box {
    min-height: 118px;
    justify-content: space-between;
}
.np-diploma-prep-gov-title {
    font-size: .88rem;
    line-height: 1.45;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}
.hp-level-card--diploma .hp-level-card-badge.is-diploma {
    background: linear-gradient(135deg, rgba(194, 65, 12, .12), rgba(234, 88, 12, .08));
    color: #c2410c;
}
html.np-diploma-page .np-diploma-prep-govs .np-section-title i {
    color: #c2410c;
}

@media (max-width: 1100px) {
    .np-diploma-prep-gov-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 768px) {
    .np-hero--diploma .np-level-hero-row { grid-template-columns: 1fr; }
    .np-hero--diploma .np-level-stat-grid {
        width: 100%;
        min-width: 0;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 640px) {
    .np-diploma-links-grid { grid-template-columns: 1fr; }
    .np-diploma-prep-gov-grid { grid-template-columns: 1fr; gap: 10px; }
    .np-diploma-link-go { display: none; }
}

/* مربع البحث الرسمي + مقال الدبلومات */
.np-diploma-search-block { padding-bottom: 8px; }
.np-diploma-search-card {
    border-top-width: 4px;
    border-top-color: #c2410c;
}
.np-diploma-search-official-tag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    border-radius: 999px;
    background: color-mix(in srgb, #c2410c 10%, #fff);
    border: 1px solid color-mix(in srgb, #c2410c 22%, var(--np-border));
    color: #9a3412;
    font-size: .74rem;
    font-weight: 800;
    margin-bottom: 12px;
}
.np-diploma-search-sub {
    margin: 8px 0 0;
    font-size: .88rem;
    color: var(--np-text-2);
    line-height: 1.65;
    font-weight: 600;
}
.np-diploma-source-line {
    margin: 10px 0 0;
    font-size: .78rem;
    color: var(--np-muted);
    font-weight: 600;
    line-height: 1.6;
}
.np-diploma-source-line a {
    color: #9a3412;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.np-diploma-alert-slot { margin-bottom: 12px; }
.np-diploma-search-form { margin-top: 16px; }
.np-diploma-result-slot-wrap { padding-bottom: 12px; }
.np-diploma-search-label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: .82rem;
    font-weight: 800;
    color: var(--np-brand);
    margin-bottom: 8px;
}
.np-diploma-search-row { margin-bottom: 10px; }
.np-diploma-submit {
    flex-shrink: 0;
    white-space: nowrap;
}
.np-diploma-search-steps {
    list-style: none;
    padding: 16px;
    margin: 0;
    border-radius: var(--np-radius-sm);
    background: var(--np-surface-2, #f8fafc);
    border: 1px solid var(--np-border);
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.np-diploma-search-steps li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: .8rem;
    font-weight: 700;
    color: var(--np-text-2);
    line-height: 1.55;
}
.np-diploma-search-steps i {
    color: #c2410c;
    margin-top: 3px;
}
/* بطاقة نتيجة الدبلوم */
.np-diploma-result-inline {
    margin-top: 18px;
    animation: np-fade-in .35s ease;
}
.np-diploma-result-inline .np-result-success-banner {
    margin-bottom: 14px;
}
.np-diploma-result-card {
    border-radius: var(--np-radius-lg);
    border: 1px solid color-mix(in srgb, #c2410c 22%, var(--np-border));
    background: #fff;
    box-shadow: 0 8px 28px rgba(194, 65, 12, .08);
    overflow: hidden;
}
.np-diploma-result-head {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    padding: 20px 22px;
    background: linear-gradient(135deg, color-mix(in srgb, #c2410c 8%, #fff), #fff);
    border-bottom: 1px solid var(--np-border);
}
.np-diploma-result-name {
    margin: 4px 0 8px;
    font-size: 1.2rem;
    font-weight: 900;
    color: var(--np-brand);
}
.np-diploma-result-label {
    margin: 0;
    font-size: .78rem;
    font-weight: 700;
    color: var(--np-muted);
}
.np-diploma-result-table-wrap {
    padding: 0 22px 16px;
    overflow-x: auto;
}
.np-diploma-result-table {
    width: 100%;
    border-collapse: collapse;
}
.np-diploma-result-table th,
.np-diploma-result-table td {
    padding: 10px 12px;
    border-bottom: 1px solid var(--np-border);
    text-align: right;
    font-size: .88rem;
}
.np-diploma-result-table th {
    font-weight: 800;
    color: var(--np-brand);
    width: 38%;
    background: var(--np-surface-2, #f8fafc);
}
.np-diploma-subjects {
    padding: 0 22px 18px;
}
.np-diploma-subjects h3 {
    margin: 0 0 10px;
    font-size: .92rem;
    font-weight: 900;
    color: var(--np-brand);
}
.np-diploma-subjects ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 8px;
}
.np-diploma-subjects li {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 12px;
    border-radius: 10px;
    background: var(--np-surface-2, #f8fafc);
    font-weight: 700;
    font-size: .85rem;
}
.np-diploma-result-foot {
    padding: 12px 22px 16px;
    border-top: 1px dashed var(--np-border);
    font-size: .76rem;
    color: var(--np-muted);
    font-weight: 600;
}
.np-diploma-result-foot p { margin: 0; }
.np-diploma-article {
    padding: 28px 0 36px;
}
.np-diploma-article-head { margin-bottom: 22px; }
.np-diploma-article-intro {
    margin: 10px 0 14px;
    font-size: .95rem;
    line-height: 1.75;
    color: var(--np-text-2);
    font-weight: 600;
}
.np-diploma-article-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.np-diploma-article-tag {
    display: inline-flex;
    padding: 5px 12px;
    border-radius: 999px;
    background: color-mix(in srgb, #c2410c 8%, #fff);
    border: 1px solid color-mix(in srgb, #c2410c 18%, var(--np-border));
    font-size: .72rem;
    font-weight: 800;
    color: #9a3412;
}
.np-diploma-toc {
    margin-bottom: 24px;
    padding: 18px 20px;
    border-radius: var(--np-radius);
    background: linear-gradient(135deg, #fffbeb 0%, #fff 55%);
    border: 1px solid color-mix(in srgb, #c2410c 16%, var(--np-border));
}
.np-diploma-toc-title {
    margin: 0 0 12px;
    font-size: .92rem;
    font-weight: 900;
    color: var(--np-brand);
}
.np-diploma-toc-list {
    margin: 0;
    padding: 0 1.2rem 0 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 8px 16px;
}
.np-diploma-toc-list a {
    font-size: .84rem;
    font-weight: 800;
    color: #c2410c;
    text-decoration: none;
}
.np-diploma-toc-list a:hover { text-decoration: underline; }
.np-diploma-article-body {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.np-diploma-article-section {
    padding: 22px 22px 20px;
    border-radius: var(--np-radius-lg);
    background: #fff;
    border: 1px solid var(--np-border);
    box-shadow: 0 4px 18px rgba(15, 23, 42, .05);
    scroll-margin-top: 88px;
}
.np-diploma-article-section-head {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    margin-bottom: 14px;
}
.np-diploma-article-section-head h3 {
    margin: 0 0 6px;
    font-size: 1.05rem;
    font-weight: 900;
    color: var(--np-brand);
    line-height: 1.4;
}
.np-diploma-article-lead {
    margin: 0;
    font-size: .86rem;
    font-weight: 700;
    color: var(--np-muted);
    line-height: 1.6;
}
.np-diploma-article-section-text p {
    margin: 0 0 12px;
    font-size: .9rem;
    line-height: 1.8;
    color: var(--np-text-2);
    font-weight: 600;
}
.np-diploma-article-section-text p:last-child { margin-bottom: 0; }
a.np-diploma-article-link {
    color: #c2410c;
    font-weight: 800;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-color: color-mix(in srgb, #c2410c 35%, transparent);
}
a.np-diploma-article-link:hover {
    color: #9a3412;
    text-decoration-color: #c2410c;
}

@media (max-width: 768px) {
    .np-diploma-search-row { flex-wrap: wrap; }
    .np-diploma-submit { width: 100%; }
    .np-diploma-toc-list { grid-template-columns: 1fr; }
    .np-diploma-article-section { padding: 16px; }
    .np-diploma-result-head { flex-direction: column; align-items: center; text-align: center; }
    .np-diploma-result-id { width: 100%; }
}

/* مقال SEO — محافظات الإعدادية (مشترك مع الدبلومات) */
.np-seo-article,
.np-diploma-article { padding: 28px 0 36px; }
.np-seo-article-head,
.np-diploma-article-head { margin-bottom: 22px; }
.np-seo-article-intro,
.np-diploma-article-intro {
    margin: 10px 0 14px;
    font-size: .95rem;
    line-height: 1.75;
    color: var(--np-text-2);
    font-weight: 600;
}
.np-seo-article-tags,
.np-diploma-article-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.np-seo-article-tag,
.np-diploma-article-tag {
    display: inline-flex;
    padding: 5px 12px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--level-accent, #0d9488) 8%, #fff);
    border: 1px solid color-mix(in srgb, var(--level-accent, #0d9488) 18%, var(--np-border));
    font-size: .72rem;
    font-weight: 800;
    color: color-mix(in srgb, var(--level-accent, #0d9488) 70%, #0f172a);
}
.np-seo-article--prep3-gov .np-seo-article-tag {
    background: color-mix(in srgb, var(--gov-accent, #0d9488) 8%, #fff);
    border-color: color-mix(in srgb, var(--gov-accent, #0d9488) 18%, var(--np-border));
}
.np-seo-article-toc,
.np-diploma-toc {
    margin-bottom: 24px;
    padding: 18px 20px;
    border-radius: var(--np-radius);
    background: linear-gradient(135deg, #f0fdfa 0%, #fff 55%);
    border: 1px solid color-mix(in srgb, var(--level-accent, #0d9488) 16%, var(--np-border));
}
.np-seo-article--prep3-gov .np-seo-article-toc {
    background: linear-gradient(135deg, color-mix(in srgb, var(--gov-accent, #0d9488) 6%, #fff) 0%, #fff 60%);
    border-color: color-mix(in srgb, var(--gov-accent, #0d9488) 16%, var(--np-border));
}
.np-seo-article-toc-title,
.np-diploma-toc-title {
    margin: 0 0 12px;
    font-size: .92rem;
    font-weight: 900;
    color: var(--np-brand);
}
.np-seo-article-toc-list,
.np-diploma-toc-list {
    margin: 0;
    padding: 0 1.2rem 0 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 8px 16px;
}
.np-seo-article-toc-list a,
.np-diploma-toc-list a {
    font-size: .84rem;
    font-weight: 800;
    color: var(--level-accent, #0d9488);
    text-decoration: none;
}
.np-seo-article--prep3-gov .np-seo-article-toc-list a {
    color: var(--gov-accent, #0d9488);
}
.np-seo-article-toc-list a:hover,
.np-diploma-toc-list a:hover { text-decoration: underline; }
.np-seo-article-body,
.np-diploma-article-body {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.np-seo-article-section,
.np-diploma-article-section {
    padding: 22px;
    border-radius: var(--np-radius-lg);
    background: #fff;
    border: 1px solid var(--np-border);
    box-shadow: 0 4px 18px rgba(15, 23, 42, .05);
    scroll-margin-top: calc(var(--np-header-h, 55px) + 16px);
}
.np-seo-article-section-head,
.np-diploma-article-section-head {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    margin-bottom: 14px;
}
.np-seo-article-section-head h3,
.np-diploma-article-section-head h3 {
    margin: 0 0 6px;
    font-size: 1.05rem;
    font-weight: 900;
    color: var(--np-brand);
    line-height: 1.4;
}
.np-seo-article-lead,
.np-diploma-article-lead {
    margin: 0;
    font-size: .86rem;
    font-weight: 700;
    color: var(--np-muted);
    line-height: 1.6;
}
.np-seo-article-section-text p,
.np-diploma-article-section-text p {
    margin: 0 0 12px;
    font-size: .9rem;
    line-height: 1.8;
    color: var(--np-text-2);
    font-weight: 600;
}
.np-seo-article-section-text p:last-child,
.np-diploma-article-section-text p:last-child { margin-bottom: 0; }
a.np-seo-article-link,
a.np-diploma-article-link {
    color: var(--level-accent, #0d9488);
    font-weight: 800;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.np-seo-article--prep3-gov a.np-seo-article-link {
    color: var(--gov-accent, #0d9488);
}

@media (max-width: 768px) {
    .np-seo-article-toc-list,
    .np-diploma-toc-list { grid-template-columns: 1fr; }
    .np-seo-article-section,
    .np-diploma-article-section { padding: 16px; }
}