@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;700;800;900&display=swap');

:root {
  --bg: #071427;
  --bg-deep: #07111f;
  --surface: #ffffff;
  --surface-soft: #f4f7fb;
  --surface-blue: #eef4ff;
  --text: #111827;
  --muted: #6b7280;
  --primary: #00357f;
  --primary-2: #120d5b;
  --primary-3: #2157c8;
  --line: #dbe5f0;
  --success: #0f9f6e;
  --danger: #d92d20;
  --radius: 22px;
  --radius-sm: 16px;
  --shadow: 0 16px 40px rgba(5, 25, 58, 0.12);
  --shadow-soft: 0 12px 24px rgba(16, 35, 74, 0.08);
}
* { box-sizing: border-box; }
html { direction: rtl; scroll-behavior: smooth; }
body { margin: 0; font-family: 'Tajawal', Arial, Helvetica, sans-serif; background: #f2f6fb; color: var(--text); }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button, input, select, textarea { font: inherit; }
.container { width: min(1180px, calc(100% - 32px)); margin: 0 auto; }
.narrow { width: min(780px, calc(100% - 32px)); margin: 0 auto; }
.site-shell { min-height: 100vh; display: flex; flex-direction: column; }
.topbar { position: sticky; top: 0; z-index: 30; backdrop-filter: blur(12px); background: rgba(255,255,255,.92); border-bottom: 1px solid rgba(219,229,240,.8); }
.topbar-inner { min-height: 84px; display: flex; align-items: center; gap: 20px; justify-content: space-between; }
.brand { display: inline-flex; align-items: center; gap: 12px; font-weight: 800; color: var(--primary); }
.brand img { width: 42px; height: 42px; border-radius: 12px; }
.nav-links { display: flex; align-items: center; gap: 24px; color: #233044; font-weight: 700; }
.nav-links a { opacity: .88; }
.nav-links a:hover { opacity: 1; color: var(--primary); }
.nav-actions { display: flex; gap: 10px; align-items: center; }
.menu-toggle { display: none; border: 0; background: transparent; padding: 6px; }
.menu-toggle span { display: block; width: 24px; height: 2px; background: var(--primary); margin: 5px 0; border-radius: 999px; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; padding: 0 18px; border-radius: 999px; font-weight: 800; border: 1px solid transparent; transition: .2s ease; cursor: pointer; }
.btn:hover { transform: translateY(-1px); }
.btn-primary { background: linear-gradient(135deg, var(--primary), var(--primary-2)); color: #fff; box-shadow: 0 12px 24px rgba(0,53,127,.18); }
.btn-outline { border-color: rgba(0,53,127,.18); color: var(--primary); background: #fff; }
.btn-ghost { background: rgba(0,53,127,.07); color: var(--primary); }
.btn-block { width: 100%; }
.hero { padding: 78px 0 56px; background: radial-gradient(circle at top right, rgba(0,53,127,.16), transparent 30%), linear-gradient(180deg, #f8fbff, #eef4fb); }
.hero-home { padding-top: 88px; }
.hero-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 28px; align-items: center; }
.hero-grid-wide { grid-template-columns: 1.2fr .8fr; }
.hero h1, .page-hero h1, .page-shell h1 { font-size: clamp(34px, 5vw, 62px); line-height: 1.05; margin: 0 0 18px; }
.eyebrow { display: inline-flex; align-items: center; padding: 8px 14px; border-radius: 999px; background: rgba(0,53,127,.08); color: var(--primary); font-weight: 800; font-size: 13px; margin-bottom: 16px; }
.lead { font-size: 18px; line-height: 1.8; color: #44566c; margin: 0 0 24px; }
.hero-actions, .quick-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.hero-stats, .cards-3, .cards-4 { display: grid; gap: 16px; }
.hero-stats-home { grid-template-columns: repeat(4, 1fr); }
.metric-card, .info-card, .panel-card, .stat-card, .auth-card, .glass-card, .job-card, .pricing-card, .testimonial-card, .search-panel, .faq-item { background: rgba(255,255,255,.92); border: 1px solid rgba(219,229,240,.95); box-shadow: var(--shadow); border-radius: var(--radius); }
.metric-card { padding: 18px; display: grid; gap: 8px; }
.metric-card strong { color: var(--primary); font-size: 28px; }
.metric-card span { color: #4a5d73; font-weight: 700; }
.hero-panel-stack { display: grid; gap: 18px; }
.glass-card { padding: 24px; background: linear-gradient(180deg, rgba(255,255,255,.95), rgba(247,250,255,.9)); }
.card-dark { background: linear-gradient(145deg, #0b2144, #0c2f63); color: #fff; border-color: rgba(255,255,255,.08); }
.card-dark p, .card-dark h3 { color: #fff; }
.soft-card { background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(237,244,255,.95)); }
.panel-kicker { color: var(--primary); font-weight: 800; margin-bottom: 14px; }
.panel-kicker.light { color: rgba(255,255,255,.84); }
.check-list, .feature-list, .footer-links { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.check-list li, .feature-list li { position: relative; padding-right: 18px; color: #243447; line-height: 1.8; }
.feature-list-large li { font-size: 17px; }
.check-list li::before, .feature-list li::before { content: ''; width: 8px; height: 8px; border-radius: 999px; background: linear-gradient(135deg, var(--primary), #4aa3ff); position: absolute; top: 12px; right: 0; }
.section, .section-tight { padding: 44px 0; }
.section-soft { background: linear-gradient(180deg, #f7fbff, #edf4fb); }
.section-head { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 20px; }
.centered-head { justify-content: center; text-align: center; }
.section-head h2 { margin: 0; font-size: clamp(28px, 4vw, 42px); }
.cards-3 { grid-template-columns: repeat(3, 1fr); }
.cards-4 { grid-template-columns: repeat(4, 1fr); }
.info-card, .stat-card, .panel-card, .pricing-card, .testimonial-card { padding: 22px; }
.info-card h3, .stat-card strong, .pricing-card h3, .testimonial-card strong { margin: 0 0 8px; }
.info-card p, .testimonial-card p { margin: 0; line-height: 1.8; color: #4d6178; }
.stat-card span { color: var(--muted); display: block; margin-bottom: 12px; font-weight: 700; }
.stat-card strong { font-size: 36px; color: var(--primary); }
.page-hero { padding: 72px 0 26px; background: linear-gradient(180deg, #f8fbff, #f2f7fd); }
.search-panel { padding: 20px; }
.search-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr auto; gap: 14px; align-items: end; }
.search-submit-wrap { display: flex; align-items: end; }
.job-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.job-card { padding: 20px; border-radius: 24px; box-shadow: var(--shadow-soft); }
.job-card-large { min-height: 100%; }
.job-card-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 14px; }
.job-pill, .job-date { display: inline-flex; align-items: center; min-height: 32px; padding: 0 12px; border-radius: 999px; font-size: 13px; font-weight: 800; }
.job-pill { background: rgba(0,53,127,.08); color: var(--primary); }
.job-date { background: rgba(17,24,39,.05); color: #4d6178; }
.job-card h3 { margin: 0 0 10px; font-size: 22px; }
.job-company { margin: 0 0 12px; color: var(--primary); font-weight: 800; }
.job-snippet { margin: 0 0 12px; line-height: 1.8; color: #506174; }
.job-meta { display: flex; flex-wrap: wrap; gap: 8px; color: #55687e; font-weight: 700; }
.job-meta span { background: #f5f8fd; border: 1px solid #e0eaf6; min-height: 34px; padding: 0 12px; border-radius: 999px; display: inline-flex; align-items: center; }
.job-salary { margin-top: 14px; color: #132d55; font-weight: 800; }
.pricing-grid { align-items: stretch; }
.pricing-card { display: flex; flex-direction: column; gap: 16px; }
.pricing-card-featured { border-color: rgba(0,53,127,.3); transform: translateY(-4px); }
.price-row { display: flex; align-items: baseline; gap: 10px; }
.price-row strong { font-size: 40px; color: var(--primary); margin: 0; }
.price-row span { color: #607287; font-weight: 700; }
.compact-list { gap: 10px; }
.testimonial-card { background: linear-gradient(180deg, #ffffff, #f7faff); }
.testimonial-card p { font-size: 17px; margin-bottom: 16px; }
.faq-list { display: grid; gap: 14px; }
.faq-item { padding: 0; overflow: hidden; }
.faq-item summary { cursor: pointer; list-style: none; padding: 18px 22px; font-weight: 800; color: #132d55; position: relative; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: '+'; position: absolute; left: 22px; top: 17px; font-size: 22px; color: var(--primary); }
.faq-item[open] summary::after { content: '–'; }
.faq-item p { margin: 0; padding: 0 22px 18px; color: #4d6178; line-height: 1.8; }
.feature-band { display: grid; grid-template-columns: 1.15fr .85fr; gap: 24px; align-items: center; }
.contact-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 20px; align-items: start; }
.contact-side { display: grid; gap: 20px; }
.legal-copy .panel-card h2 { margin-top: 0; }
.legal-copy .panel-card p { color: #4f6277; line-height: 1.9; }
.site-footer { margin-top: auto; padding: 38px 0 42px; background: linear-gradient(180deg, #081224, #07111f); color: #d7e4f5; }
.footer-grid { display: grid; grid-template-columns: 1.2fr .8fr .8fr; gap: 22px; }
.footer-grid h3, .footer-grid h4 { margin-top: 0; color: #fff; }
.footer-links a, .footer-links span { color: #d7e4f5; }
.flash-wrap { padding-top: 14px; }
.flash { padding: 14px 18px; border-radius: 16px; font-weight: 700; margin-bottom: 12px; }
.flash-success { background: rgba(15,159,110,.12); color: #0d7f58; border: 1px solid rgba(15,159,110,.2); }
.flash-error { background: rgba(217,45,32,.09); color: #aa241a; border: 1px solid rgba(217,45,32,.18); }
.auth-body { min-height: 100vh; background: radial-gradient(circle at top, rgba(0,53,127,.12), transparent 35%), linear-gradient(180deg, #f7fbff, #eef4fb); }
.auth-shell { min-height: 100vh; display: grid; place-items: center; padding: 32px 16px; }
.brand-center { margin-bottom: 18px; }
.auth-card { width: min(520px, 100%); padding: 28px; }
.auth-card-wide { width: min(860px, 100%); }
.auth-card h1 { margin: 0 0 10px; font-size: 32px; }
.auth-flash { width: min(860px, 100%); }
.form-grid { display: grid; gap: 16px; }
.two-cols { display: grid; gap: 16px; grid-template-columns: repeat(2, 1fr); }
.col-span-2 { grid-column: span 2; }
label { display: grid; gap: 8px; font-weight: 700; color: #223244; }
input, select, textarea { width: 100%; min-height: 48px; border-radius: 14px; border: 1px solid var(--line); background: #fff; padding: 12px 14px; outline: none; }
input:focus, select:focus, textarea:focus { border-color: rgba(0,53,127,.45); box-shadow: 0 0 0 4px rgba(0,53,127,.08); }
textarea { resize: vertical; min-height: 120px; }
.auth-switch { margin: 16px 0 0; color: #506174; }
.auth-switch a { color: var(--primary); font-weight: 800; }
.notice-card { padding: 16px 18px; border-radius: 18px; background: linear-gradient(180deg, rgba(0,53,127,.05), rgba(0,53,127,.025)); border: 1px solid rgba(0,53,127,.12); color: #213246; }
.notice-card strong { display: block; margin-bottom: 6px; color: var(--primary); }
.notice-card p { margin: 0; line-height: 1.8; color: #4b6075; }
.auth-inline-actions { display: grid; gap: 12px; }
.resend-form { margin-top: 12px; }
.panel-body { background: #eff4fb; }
.panel-shell { min-height: 100vh; display: grid; grid-template-columns: 280px 1fr; }
.sidebar { background: linear-gradient(180deg, #07162c, #0b2242); color: #fff; padding: 24px 18px; display: flex; flex-direction: column; gap: 22px; }
.sidebar .brand { color: #fff; }
.sidebar-nav { display: grid; gap: 8px; }
.sidebar-nav a { padding: 12px 14px; border-radius: 14px; color: rgba(255,255,255,.88); font-weight: 700; }
.sidebar-nav a:hover { background: rgba(255,255,255,.08); }
.sidebar-logout { margin-top: auto; background: rgba(255,255,255,.08); color: #fff; border-color: rgba(255,255,255,.12); }
.panel-main { padding: 26px; }
.panel-topbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.panel-topbar h1 { margin: 0 0 6px; }
.panel-topbar p { margin: 0; color: var(--muted); }
.status-chip { display: inline-flex; align-items: center; padding: 10px 14px; border-radius: 999px; background: rgba(0,53,127,.08); color: var(--primary); font-weight: 800; }
.table-wrap { overflow: auto; }
.data-table { width: 100%; border-collapse: collapse; }
.data-table th, .data-table td { padding: 14px 12px; border-bottom: 1px solid var(--line); text-align: right; }
.data-table th { color: var(--muted); font-size: 13px; }
.empty-state { color: var(--muted); }
.hero-panel-clean { background: linear-gradient(180deg, #ffffff, #f7faff); }
.page-shell { min-height: 62vh; display: grid; align-items: center; }
.compact { margin-bottom: 16px; }
.compact-stats .stat-card strong { font-size: 32px; }
@media (max-width: 1100px) {
  .hero-grid, .job-grid, .cards-3, .cards-4, .footer-grid, .feature-band, .contact-grid, .panel-shell, .hero-stats-home { grid-template-columns: 1fr 1fr; }
  .job-grid { grid-template-columns: repeat(2, 1fr); }
  .search-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 980px) {
  .hero-grid, .cards-3, .cards-4, .footer-grid, .feature-band, .contact-grid, .panel-shell, .hero-stats-home, .job-grid { grid-template-columns: 1fr; }
  .nav-links { display: none; position: absolute; top: 84px; right: 16px; left: 16px; background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 14px; box-shadow: var(--shadow); }
  .nav-links.is-open { display: grid; gap: 12px; }
  .menu-toggle { display: inline-block; }
  .topbar-inner { flex-wrap: wrap; padding: 14px 0; }
  .two-cols, .search-grid { grid-template-columns: 1fr; }
  .col-span-2 { grid-column: auto; }
}


.lang-btn { min-width: 108px; }
.auth-top-actions { width: min(860px, 100%); display: flex; justify-content: flex-end; margin-bottom: 14px; }
.sidebar-bottom { margin-top: auto; display: grid; gap: 12px; }
.sidebar-lang { background: rgba(255,255,255,.1); color: #fff; }
html[dir="ltr"] body { text-align: left; }
html[dir="ltr"] .check-list li,
html[dir="ltr"] .feature-list li { padding-right: 0; padding-left: 18px; }
html[dir="ltr"] .check-list li::before,
html[dir="ltr"] .feature-list li::before { right: auto; left: 0; }
html[dir="ltr"] .faq-item summary::after { left: auto; right: 22px; }
html[dir="ltr"] .data-table th,
html[dir="ltr"] .data-table td { text-align: left; }
html[dir="ltr"] .topbar-inner,
html[dir="ltr"] .nav-actions,
html[dir="ltr"] .hero-actions,
html[dir="ltr"] .quick-actions,
html[dir="ltr"] .job-card-top,
html[dir="ltr"] .panel-topbar,
html[dir="ltr"] .section-head { direction: ltr; }
html[dir="ltr"] .nav-links { direction: ltr; }
html[dir="ltr"] .sidebar { direction: ltr; }


/* Part 5 — Client / Employer panel pro */
.panel-shell-pro { grid-template-columns: 280px 1fr; }
.sidebar-pro { background: linear-gradient(180deg, #08336b 0%, #0d1a38 100%); }
.sidebar-nav a.is-active { background: rgba(255,255,255,.14); border-color: rgba(255,255,255,.18); }
.panel-main-pro { background: #f4f7fc; }
.panel-topbar-pro { background: #ffffff; border: 1px solid var(--line); border-radius: 22px; padding: 18px 22px; box-shadow: 0 18px 40px rgba(10, 24, 61, .06); }
.panel-highlights { align-items: stretch; }
.feature-card-soft { background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%); }
.form-shell { padding: 28px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.form-grid label { display: grid; gap: 8px; }
.form-grid label span { font-size: 13px; color: var(--muted); font-weight: 700; }
.form-grid input, .form-grid select, .form-grid textarea { width: 100%; border: 1px solid #d9e2f2; border-radius: 16px; background: #fff; padding: 14px 16px; font: inherit; color: var(--text); transition: border-color .2s ease, box-shadow .2s ease; }
.form-grid input:focus, .form-grid select:focus, .form-grid textarea:focus { outline: none; border-color: rgba(0, 53, 127, .45); box-shadow: 0 0 0 4px rgba(0, 53, 127, .08); }
.form-actions { display: flex; gap: 12px; justify-content: flex-end; }
.stack-list { display: grid; gap: 14px; }
.list-row-card { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.list-row-card strong { display: block; margin-bottom: 4px; }
.list-row-card p, .muted-inline { margin: 0; color: var(--muted); font-size: 14px; }
.stack-list-meta { display: grid; gap: 8px; justify-items: end; }
.job-mini-card { padding: 18px; border: 1px solid var(--line); border-radius: 18px; background: #fff; display: grid; gap: 8px; }
.job-mini-card p { margin: 0; color: var(--muted); }
.meta-inline-group { display: flex; flex-wrap: wrap; gap: 8px; }
.meta-inline { display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; padding: 7px 12px; background: rgba(0, 53, 127, .06); color: var(--primary); font-size: 13px; font-weight: 700; }
.top-gap-sm { margin-top: 14px; }
@media (max-width: 1100px) {
  .panel-shell-pro { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .form-grid { grid-template-columns: 1fr; }
  .list-row-card, .stack-list-meta, .form-actions { grid-template-columns: 1fr; justify-items: stretch; }
  .list-row-card { flex-direction: column; align-items: stretch; }
  .stack-list-meta { justify-items: start; }
}


/* Part 6 — Admin panel pro */
.admin-stats-grid .stat-card p { margin: 8px 0 0; color: var(--muted); font-size: 14px; }
.admin-kpi-grid { margin-top: 18px; }
.admin-kpi-card { display: grid; gap: 16px; }
.admin-kpi-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.admin-kpi-split { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.admin-kpi-split small { display: block; color: var(--muted); margin-bottom: 6px; }
.admin-kpi-split b { font-size: 26px; color: var(--primary); }
.admin-action-card { display: grid; gap: 10px; }
.admin-action-card h3 { margin: 0; }
.admin-action-card p { margin: 0; color: var(--muted); line-height: 1.8; }
.admin-filter-card { padding: 22px; }
.admin-filter-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr auto; gap: 16px; align-items: end; }
.admin-form-grid { align-items: start; }
.status-badge { display: inline-flex; align-items: center; justify-content: center; min-height: 32px; padding: 0 12px; border-radius: 999px; font-size: 12px; font-weight: 800; background: rgba(0,53,127,.08); color: var(--primary); }
.status-badge.is-success { background: rgba(15,159,110,.12); color: #0d7f58; }
.status-badge.is-muted { background: rgba(17,24,39,.08); color: #55687e; }
.status-badge.is-warn { background: rgba(180,98,16,.12); color: #a95d11; }
.status-badge.is-soft { background: rgba(0,53,127,.08); color: var(--primary); }
.inline-form { display: inline-flex; margin: 0; }
.btn-sm { min-height: 38px; padding: 0 12px; border-radius: 12px; font-size: 13px; }
.stack-badges, .stack-inline-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.message-card-admin { display: grid; gap: 14px; }
.message-card-head, .message-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.message-card-head p, .message-card-body { margin: 0; color: var(--muted); line-height: 1.85; }
.message-card-body { padding: 16px 18px; border-radius: 18px; background: #f8fbff; border: 1px solid #e5edf7; }
.admin-checkbox { display: inline-flex !important; align-items: center; gap: 10px; min-height: 48px; }
.admin-checkbox input { width: 18px; height: 18px; min-height: 18px; padding: 0; }
@media (max-width: 1100px) {
  .admin-filter-grid { grid-template-columns: 1fr 1fr; }
  .admin-kpi-split { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .admin-filter-grid, .admin-form-grid { grid-template-columns: 1fr; }
  .message-card-head, .message-card-foot { flex-direction: column; align-items: flex-start; }
}

/* Part 7 — Jobs / Search / Apply Pro */
.jobs-search-grid-pro { grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: end; }
.jobs-search-actions { display: flex; gap: 10px; align-items: end; }
.featured-jobs-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.job-grid-pro { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.job-card-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.job-pill-featured { background: rgba(255, 216, 74, .18); color: #8c5a00; }
.job-extra-grid { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.job-inline-note { color: var(--muted); font-size: 14px; }
.pagination-wrap { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; justify-content: center; }
.pagination-link { min-width: 46px; min-height: 46px; border-radius: 14px; display: inline-flex; align-items: center; justify-content: center; background: #fff; border: 1px solid var(--line); font-weight: 800; color: var(--primary); }
.pagination-link.is-active { background: linear-gradient(135deg, var(--primary), var(--primary-2)); color: #fff; border-color: transparent; }
.compact-lead { margin-top: 8px; }
.job-detail-layout { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr); gap: 24px; align-items: start; }
.job-detail-hero { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(340px, .9fr); gap: 22px; align-items: stretch; }
.job-detail-hero-card { height: 100%; }
.job-detail-main { min-width: 0; }
.job-detail-side { min-width: 0; }
.sticky-apply-card { position: sticky; top: 100px; }
.inline-status-form { display: grid; gap: 10px; min-width: 220px; }
.inline-status-form select { min-height: 44px; }
.meta-inline-highlight { background: rgba(255, 216, 74, .16); color: #8c5a00; }
.status-chip-submitted { background: rgba(0,53,127,.08); color: var(--primary); }
.status-chip-reviewing { background: rgba(33,87,200,.12); color: #2157c8; }
.status-chip-shortlisted { background: rgba(15,159,110,.12); color: #0f9f6e; }
.status-chip-interview { background: rgba(122, 92, 255, .12); color: #6840ff; }
.status-chip-rejected { background: rgba(217,45,32,.10); color: #c6291d; }
.status-chip-hired { background: rgba(255,216,74,.18); color: #8c5a00; }
.compact-row { padding: 16px 18px; }
.applications-filter-grid { grid-template-columns: 1fr auto; }
.applicants-filter-grid { grid-template-columns: 1.4fr 1fr auto; }
.list-row-card-job { align-items: stretch; }
@media (max-width: 1200px) {
  .jobs-search-grid-pro { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .featured-jobs-strip, .job-grid-pro { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 980px) {
  .job-detail-layout, .job-detail-hero { grid-template-columns: 1fr; }
  .sticky-apply-card { position: static; }
}
@media (max-width: 900px) {
  .jobs-search-grid-pro, .featured-jobs-strip, .job-grid-pro, .applications-filter-grid, .applicants-filter-grid { grid-template-columns: 1fr; }
  .jobs-search-actions, .job-card-actions { flex-direction: column; align-items: stretch; }
  .inline-status-form { min-width: 0; width: 100%; }
}


/* Part 8 — CMS / Landing / Brand Pro */
.hero-home-deep { position: relative; overflow: hidden; }
.hero-home-deep::after { content: ""; position: absolute; inset: auto -10% -120px auto; width: 340px; height: 340px; border-radius: 50%; background: radial-gradient(circle, rgba(0,53,127,.14), rgba(0,53,127,0)); pointer-events: none; }
.info-card-lifted, .process-card, .sector-card, .testimonial-card-pro, .cta-band { border: 1px solid var(--line); background: #fff; box-shadow: 0 14px 42px rgba(10,26,55,.06); }
.process-grid, .sector-grid { display: grid; gap: 18px; }
.process-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sector-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.process-card, .sector-card { border-radius: 24px; padding: 24px; }
.process-card h3, .sector-card h3 { margin: 0 0 10px; }
.process-card p, .sector-card p { margin: 0; color: var(--muted); line-height: 1.85; }
.process-no { width: 44px; height: 44px; border-radius: 14px; display: inline-flex; align-items: center; justify-content: center; margin-bottom: 16px; font-weight: 900; background: rgba(0,53,127,.08); color: var(--primary); }
.cards-4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.testimonial-grid-pro { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.testimonial-card-pro { border-radius: 24px; padding: 26px; display: grid; gap: 10px; }
.testimonial-card-pro p { margin: 0; line-height: 1.9; color: var(--text); }
.testimonial-card-pro strong { font-size: 18px; }
.testimonial-card-pro span { color: var(--muted); font-size: 14px; }
.cta-band { border-radius: 30px; padding: 34px; display: flex; align-items: center; justify-content: space-between; gap: 24px; background: linear-gradient(135deg, rgba(0,53,127,.05), rgba(18,13,91,.08)); }
.cta-band h2 { margin: 8px 0 10px; }
.cta-band p { margin: 0; color: var(--muted); max-width: 720px; }
.page-hero-pro { padding-bottom: 20px; }
.feature-band-pro { align-items: stretch; }
.contact-grid-pro { align-items: start; }
.contact-channel-card { position: sticky; top: 100px; }
.legal-card-pro { line-height: 1.95; }
.legal-card-pro h2 { margin-top: 0; }
.legal-card-pro p { color: var(--muted); }
.list-row-card { gap: 14px; }
@media (max-width: 1200px) { .sector-grid, .cards-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 980px) { .process-grid, .testimonial-grid-pro, .cta-band { grid-template-columns: 1fr; } .cta-band { flex-direction: column; align-items: flex-start; } .contact-channel-card { position: static; } }
@media (max-width: 900px) { .process-grid, .sector-grid, .cards-4, .testimonial-grid-pro { grid-template-columns: 1fr; } }


.auth-card-wide { max-width: 760px; }
.two-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.two-columns .full-width { grid-column: 1 / -1; }
.setup-help-box { margin: 0 0 18px; padding: 16px 18px; border-radius: 18px; background: rgba(0, 53, 127, .06); border: 1px solid rgba(0, 53, 127, .12); color: #173253; }
.setup-help-box strong { display: block; margin-bottom: 6px; }
.setup-help-box p { margin: 0; line-height: 1.8; }
.muted-box { background: rgba(18, 13, 91, .05); border-color: rgba(18, 13, 91, .12); }
.setup-code { display: block; margin-top: 12px; overflow-x: auto; white-space: pre-wrap; padding: 12px 14px; border-radius: 14px; background: #081223; color: #dfe9ff; font-family: Consolas, Monaco, monospace; font-size: 12px; }
.compact-flash { margin-bottom: 14px; }
.split-actions { align-items: center; justify-content: space-between; }
@media (max-width: 780px) {
  .two-columns { grid-template-columns: 1fr; }
  .split-actions { flex-direction: column; align-items: stretch; }
}

.panel-topbar-actions{display:flex;align-items:center;gap:14px}
.notification-menu{position:relative}
.notification-trigger{position:relative;display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:14px;background:rgba(255,255,255,.72);border:1px solid rgba(16,24,40,.08);text-decoration:none;font-size:18px;box-shadow:0 8px 24px rgba(15,23,42,.08)}
.notification-count,.nav-counter{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:linear-gradient(135deg,#0d4bcf,#4e8cff);color:#fff;font-size:11px;font-weight:800}
.notification-count{position:absolute;top:-6px;inset-inline-end:-6px}
.nav-counter{font-size:10px}
.notification-dropdown{position:absolute;top:calc(100% + 10px);inset-inline-end:0;width:min(360px,calc(100vw - 32px));background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:22px;box-shadow:0 20px 40px rgba(15,23,42,.16);padding:12px;display:none;z-index:20}
.notification-menu:hover .notification-dropdown,.notification-menu:focus-within .notification-dropdown{display:block}
.notification-dropdown-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.notification-dropdown-head a{font-size:13px;text-decoration:none;color:var(--primary,#00357F)}
.notification-mini-list,.notification-list-page{display:grid;gap:10px}
.notification-mini-item,.list-row-link{text-decoration:none;color:inherit}
.notification-mini-item{display:grid;gap:4px;padding:10px 12px;border-radius:16px;background:#f8fbff;border:1px solid rgba(13,75,207,.06)}
.notification-mini-item strong{font-size:14px}
.notification-mini-item span{font-size:12px;color:#667085}
.empty-mini-state{margin:8px 0 2px;color:#667085;font-size:13px}
.is-unread{border-color:rgba(13,75,207,.18)!important;background:linear-gradient(180deg,rgba(241,247,255,.95),#fff)!important}
.pipeline-mini-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px}
.pipeline-top-grid{margin-bottom:6px}
.pipeline-mini-card{display:grid;gap:6px;padding:16px 14px;border-radius:18px;text-decoration:none;color:inherit;background:#fff;border:1px solid rgba(15,23,42,.08);box-shadow:0 10px 28px rgba(15,23,42,.06)}
.pipeline-mini-card span{font-size:12px;color:#667085}
.pipeline-mini-card strong{font-size:28px;line-height:1}
.pipeline-mini-card.is-active{outline:2px solid rgba(13,75,207,.18)}
.pipeline-mini-card.status-submitted strong,.status-chip-submitted{color:#0d4bcf}
.pipeline-mini-card.status-reviewing strong,.status-chip-reviewing{color:#6941c6}
.pipeline-mini-card.status-shortlisted strong,.status-chip-shortlisted{color:#0f766e}
.pipeline-mini-card.status-interview strong,.status-chip-interview{color:#2563eb}
.pipeline-mini-card.status-hired strong,.status-chip-hired{color:#15803d}
.pipeline-mini-card.status-rejected strong,.status-chip-rejected{color:#b42318}
.company-grid-public{align-items:stretch}
.company-card-public{display:grid;gap:10px}
.company-card-top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.company-badge{display:inline-flex;padding:8px 12px;border-radius:999px;background:rgba(13,75,207,.08);color:#0d4bcf;font-size:12px;font-weight:700}
.company-open-jobs{font-size:14px;color:#475467}
.company-profile-side-card .list-row-card{padding:12px 0}
.notification-row-card{align-items:start}
.status-chip-featured{background:rgba(13,75,207,.08);color:#0d4bcf}
.compact-stack-list .list-row-card{padding:12px 14px}
.list-row-link{display:flex;justify-content:space-between;gap:16px}
.list-row-link:hover{transform:translateY(-1px)}
.hero-inner{padding-top:40px;padding-bottom:34px}
@media (max-width: 900px){.notification-dropdown{inset-inline-start:0;inset-inline-end:auto}.panel-topbar-actions{gap:10px}}



/* Part 13 — media, branding, profile polish */
.profile-shell,
.branding-hero { overflow: hidden; }
.profile-media-hero,
.branding-hero {
  display: grid;
  gap: 1rem;
  margin-bottom: 1.25rem;
}
.profile-cover,
.company-cover,
.company-card-cover {
  min-height: 180px;
  border-radius: 24px;
  background:
    linear-gradient(135deg, rgba(10,18,43,.92), rgba(8,47,104,.75)),
    radial-gradient(circle at top right, rgba(255,255,255,.12), transparent 35%),
    linear-gradient(135deg, #0f172a, #0b5bb4);
  background-size: cover;
  background-position: center;
  position: relative;
}
.profile-avatar-wrap,
.company-logo-slot {
  position: absolute;
  inset-inline-start: 1.5rem;
  bottom: -2rem;
}
.profile-media-copy { padding-top: 1.75rem; }
.profile-chip-row { display:flex; gap:.65rem; flex-wrap:wrap; }
.soft-badge {
  display:inline-flex; align-items:center; justify-content:center;
  padding:.5rem .85rem; border-radius:999px;
  background: rgba(11,91,180,.09); color: var(--primary, #0b5bb4); font-weight:700;
}
.profile-avatar-lg,
.company-logo-xl,
.panel-mini-avatar,
.applicant-avatar,
.company-brand-mark img,
.public-logo-frame img {
  object-fit: cover; display:block;
}
.profile-avatar-lg,
.profile-avatar-placeholder {
  width: 92px; height: 92px; border-radius: 50%;
  border: 4px solid #fff; box-shadow: 0 20px 50px rgba(15,23,42,.18);
  background:#eff6ff;
}
.profile-avatar-placeholder,
.company-logo-placeholder,
.company-brand-fallback,
.applicant-avatar.placeholder {
  display:flex; align-items:center; justify-content:center;
  font-weight:800; color:#0b5bb4;
}
.company-logo-xl,
.company-logo-placeholder {
  width: 110px; height: 110px; border-radius: 24px;
  border: 4px solid #fff; box-shadow: 0 20px 50px rgba(15,23,42,.18); background:#fff;
}
.panel-mini-avatar {
  width: 42px; height: 42px; border-radius: 50%;
  border: 2px solid rgba(255,255,255,.7);
}
.company-card-brand {
  margin-top: -2rem;
  position: relative;
  z-index: 2;
}
.company-brand-mark {
  width: 76px; height: 76px; border-radius: 22px;
  overflow: hidden; background:#fff; border:4px solid #fff;
  box-shadow: 0 16px 40px rgba(15,23,42,.14);
}
.company-brand-mark img { width:100%; height:100%; }
.company-brand-fallback {
  width:100%; height:100%; font-size: 1.4rem; background:#eff6ff;
}
.public-brand-row {
  display:flex; align-items:center; gap:1rem; flex-wrap:wrap;
}
.public-brand-row.slim { align-items:flex-start; }
.public-logo-frame {
  width: 96px; height: 96px; border-radius: 24px; overflow:hidden; background:#fff;
  border:4px solid rgba(255,255,255,.9); box-shadow:0 16px 40px rgba(15,23,42,.18);
}
.public-logo-frame.small { width:72px; height:72px; border-radius:20px; }
.company-profile-hero h1 { margin-bottom: .2rem; }
.applicant-card-list { gap: .85rem; }
.applicant-card {
  display:grid; grid-template-columns:minmax(0,1.1fr) auto auto;
  gap:1rem; align-items:center;
}
.applicant-identity {
  display:flex; gap:.85rem; align-items:center;
}
.applicant-avatar, .applicant-avatar.placeholder {
  width:56px; height:56px; border-radius:18px; background:#eff6ff;
}
.applicant-actions { display:flex; gap:.65rem; flex-wrap:wrap; align-items:center; justify-content:flex-end; }
.inline-status-form { display:flex; gap:.55rem; align-items:center; flex-wrap:wrap; }
.inline-status-form select { min-width: 150px; }
.notice-card + .top-gap-sm { margin-top: .85rem; }
@media (max-width: 900px) {
  .applicant-card { grid-template-columns:1fr; }
  .applicant-actions { justify-content:flex-start; }
  .profile-avatar-wrap,
  .company-logo-slot { inset-inline-start: 1rem; }
}

.cards-4 {
  display:grid; gap:1rem; grid-template-columns:repeat(4, minmax(0,1fr));
}
.billing-hero-card { overflow:hidden; }
.billing-layout {
  display:grid; grid-template-columns:minmax(0,1fr) minmax(340px, 460px); gap:1rem; align-items:start;
}
.billing-plan-grid {
  display:grid; grid-template-columns:repeat(auto-fit, minmax(180px,1fr)); gap:1rem;
}
.billing-plan-card {
  padding:1rem; border:1px solid rgba(15,23,42,.08); border-radius:20px; background:#fff;
  box-shadow:0 12px 35px rgba(15,23,42,.06);
}
.billing-plan-card h3 { margin:.5rem 0 .35rem; }
.billing-plan-price {
  font-size:1.5rem; font-weight:800; color:var(--primary, #0b5bb4);
}
.billing-plan-price small { font-size:.85rem; color:#64748b; }
.billing-plan-list { margin:.85rem 0 0; padding-inline-start:1rem; color:#475569; }
.billing-plan-list li + li { margin-top:.35rem; }
.payment-method-grid {
  display:grid; grid-template-columns:repeat(auto-fit, minmax(210px,1fr)); gap:1rem;
}
.payment-method-card {
  display:flex; flex-direction:column; gap:.75rem; padding:1rem; border:1px solid rgba(15,23,42,.08);
  border-radius:20px; background:#fff; box-shadow:0 12px 35px rgba(15,23,42,.05); cursor:pointer;
}
.payment-method-card input { accent-color: var(--primary, #0b5bb4); }
.payment-method-card img {
  width:100%; border-radius:18px; border:1px solid rgba(15,23,42,.08); background:#fff;
}
.payment-method-head { display:flex; align-items:flex-start; justify-content:space-between; gap:.75rem; }
.payment-method-head span { color:#64748b; font-size:.85rem; }
.payment-method-meta { display:grid; gap:.22rem; }
.payment-method-meta small { color:#64748b; }
.payment-method-meta b { overflow-wrap:anywhere; }
.payment-method-meta p { margin:.45rem 0 0; color:#475569; font-size:.93rem; }
.payment-method-placeholder {
  min-height:180px; border-radius:18px; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, rgba(11,91,180,.08), rgba(18,13,91,.04)); color:#0b5bb4; font-weight:700;
}
.billing-table .status-pill { white-space:nowrap; }
.billing-admin-list { display:grid; gap:1rem; }
.billing-admin-card {
  padding:1rem; border-radius:22px; border:1px solid rgba(15,23,42,.08); background:#fff;
  box-shadow:0 12px 35px rgba(15,23,42,.05);
}
.billing-admin-top {
  display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; flex-wrap:wrap;
}
.billing-admin-top h3 { margin:.65rem 0 .2rem; }
.billing-admin-top p { margin:0; color:#64748b; }
.billing-admin-meta {
  display:grid; grid-template-columns:repeat(auto-fit, minmax(150px,1fr)); gap:.85rem; margin-top:1rem;
}
.billing-admin-meta small { display:block; color:#64748b; margin-bottom:.25rem; }
.billing-admin-actions { display:flex; flex-wrap:wrap; gap:.75rem; align-items:center; margin-top:1rem; }
.danger-note {
  border:1px solid rgba(220,38,38,.15); background:rgba(220,38,38,.04);
}
@media (max-width: 1100px) {
  .billing-layout { grid-template-columns:1fr; }
}
@media (max-width: 900px) {
  .cards-4 { grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media (max-width: 640px) {
  .cards-4 { grid-template-columns:1fr; }
  .payment-method-grid { grid-template-columns:1fr; }
}

.applicants-filter-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px,1fr));
  gap:1rem;
  align-items:end;
}
.applicants-filter-actions {
  display:flex;
  gap:.65rem;
  align-items:end;
  flex-wrap:wrap;
}
.applicant-pipeline-list { gap:1rem; }
.applicant-pipeline-card {
  grid-template-columns:minmax(0,1fr) auto;
  align-items:start;
  padding:1rem;
  border:1px solid rgba(15,23,42,.08);
  border-radius:24px;
  box-shadow:0 14px 36px rgba(15,23,42,.05);
}
.applicant-card-main {
  display:grid;
  gap:.9rem;
}
.applicant-summary-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(150px,1fr));
  gap:.75rem;
}
.applicant-summary-cell {
  padding:.85rem 1rem;
  border:1px solid rgba(15,23,42,.08);
  border-radius:18px;
  background:rgba(248,250,252,.8);
}
.applicant-summary-cell small,
.applicant-note-preview small {
  display:block;
  color:#64748b;
  margin-bottom:.35rem;
}
.metric-pill {
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  padding:.5rem .8rem;
  border-radius:999px;
  font-weight:800;
}
.metric-pill-match {
  color:#0b5bb4;
  background:rgba(11,91,180,.1);
}
.metric-pill-score {
  color:#7c3aed;
  background:rgba(124,58,237,.12);
}
.tag-row {
  display:flex;
  flex-wrap:wrap;
  gap:.45rem;
}
.tag-chip {
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  padding:.42rem .75rem;
  border-radius:999px;
  font-weight:700;
  color:var(--tag-color, #0b5bb4);
  background:rgba(11,91,180,.08);
  border:1px solid rgba(11,91,180,.14);
}
.applicant-note-preview {
  padding:.9rem 1rem;
  border-radius:18px;
  background:rgba(245,247,251,.9);
  border:1px dashed rgba(15,23,42,.12);
}
.applicant-note-preview p {
  margin:0;
  color:#334155;
}
.applicant-actions-vertical {
  min-width:160px;
  flex-direction:column;
  align-items:stretch;
}
.applicant-actions-vertical .btn,
.applicant-actions-vertical .muted-inline {
  text-align:center;
}
.applicant-detail-shell {
  grid-column:1 / -1;
  margin-top:.2rem;
  border-top:1px solid rgba(15,23,42,.08);
  padding-top:.75rem;
}
.applicant-detail-shell summary {
  cursor:pointer;
  font-weight:800;
  color:var(--primary);
  list-style:none;
}
.applicant-detail-shell summary::-webkit-details-marker { display:none; }
.applicant-detail-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px,1fr));
  gap:1rem;
  margin-top:1rem;
}
.panel-mini-form {
  padding:1rem;
  border-radius:20px;
  border:1px solid rgba(15,23,42,.08);
  background:#fff;
  display:grid;
  gap:.8rem;
}
.panel-mini-form-wide {
  grid-column:span 2;
}
.panel-mini-form label {
  display:grid;
  gap:.45rem;
}
.panel-mini-form label span {
  color:#475569;
  font-weight:700;
}
@media (max-width: 900px) {
  .applicant-pipeline-card { grid-template-columns:1fr; }
  .applicant-actions-vertical { min-width:0; width:100%; }
  .panel-mini-form-wide { grid-column:span 1; }
}