/* AfriGulf mockup public overrides - public pages only */
:root {
  --ag-primary: #00B074;
  --ag-secondary: #2B9BFF;
  --ag-light: #EFFDF5;
  --ag-dark: #2B3940;
  --ag-ink: #3b4a54;
  --ag-ink-soft: #6b7a86;
  --ag-border: #e6ecf5;
  --ag-surface: #ffffff;
  --ag-surface-alt: #f8faff;
  --ag-shadow-sm: 0 12px 28px rgba(40,57,90,0.05);
  --ag-shadow-md: 0 18px 40px rgba(40,57,90,0.08);
  --ag-shadow-lg: 0 24px 56px rgba(40,57,90,0.14);
  --ag-grad: linear-gradient(135deg, var(--ag-primary) 0%, var(--ag-secondary) 100%);
}

body {
  color: var(--ag-ink);
  background: linear-gradient(180deg, #f5f7fb 0%, #f8faff 100%);
}

/* Stronger public card system */
.feature-card,
.article-card,
.benefit-card,
.info-card,
.mvv-card,
.position-card,
.quality-card,
.requirement-card,
.responsibility-card,
.role-card,
.sidebar-card,
.social-card,
.specialization-card,
.stat-card,
.subject-card,
.team-card,
.testimonial-card,
.completion-card,
.legal-nav-card,
.job-info-card,
.job-header-card,
.auth-card,
.card,
.featured-card,
.filters-card,
.empty-state,
.announcement-item,
.messages-list .message-item,
.conversation-item,
.application-card,
.info-box {
  background: rgba(255,255,255,0.96) !important;
  border: 1px solid var(--ag-border) !important;
  border-radius: 22px !important;
  box-shadow: var(--ag-shadow-sm) !important;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease !important;
}

.feature-card:hover,
.article-card:hover,
.benefit-card:hover,
.info-card:hover,
.mvv-card:hover,
.position-card:hover,
.quality-card:hover,
.requirement-card:hover,
.responsibility-card:hover,
.role-card:hover,
.sidebar-card:hover,
.social-card:hover,
.specialization-card:hover,
.stat-card:hover,
.subject-card:hover,
.team-card:hover,
.testimonial-card:hover,
.completion-card:hover,
.featured-card:hover,
.filters-card:hover,
.announcement-item:hover,
.conversation-item:hover,
.application-card:hover,
.card:hover {
  transform: translateY(-4px);
  border-color: rgba(0,176,116,0.18) !important;
  box-shadow: var(--ag-shadow-md) !important;
}

.card-header,
.card-body,
.card-content,
.card-footer,
.feature-card,
.article-card,
.benefit-card,
.info-card,
.team-card,
.sidebar-card,
.filters-card,
.auth-card,
.completion-card,
.testimonial-card {
  padding: 24px !important;
}

/* Buttons */
.btn,
.btn-primary,
.btn-secondary,
.btn-outline,
.header-cta-btn,
.apply-btn,
.auth-submit,
.hero-btn,
.filter-actions .btn {
  min-height: 44px;
  border-radius: 10px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px;
  padding: 0 18px !important;
  transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease !important;
}
.btn:hover,
.btn-primary:hover,
.btn-secondary:hover,
.btn-outline:hover,
.header-cta-btn:hover,
.apply-btn:hover,
.auth-submit:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 28px rgba(0,176,116,0.18) !important;
}

.btn-primary,
.header-cta-btn,
.apply-btn,
.auth-submit,
.filter-actions .btn,
.hero-btn-primary {
  background: var(--ag-grad) !important;
  color: #fff !important;
  border: none !important;
}

.btn-outline,
.btn-secondary,
.hero-btn-secondary {
  background: #fff !important;
  color: var(--ag-primary) !important;
  border: 1px solid rgba(0,176,116,0.18) !important;
}

/* Jobs page layout overrides */
.jobs-page-container {
  max-width: 1240px !important;
  margin: 0 auto !important;
  padding: 24px !important;
  display: grid !important;
  grid-template-columns: 280px minmax(0,1fr) !important;
  gap: 24px !important;
  align-items: start !important;
}

.jobs-header {
  grid-column: 2 !important;
  margin: 0 0 12px !important;
  padding: 18px 20px !important;
  border: 1px solid var(--ag-border) !important;
  background: #fff !important;
  border-radius: 18px !important;
  box-shadow: var(--ag-shadow-sm) !important;
}
.jobs-header h2 {
  margin: 0 !important;
  font-size: 20px !important;
  font-weight: 600 !important;
  color: var(--ag-ink) !important;
}

.jobs-grid {
  grid-column: 2 !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 16px !important;
}

.job-card {
  position: relative !important;
  overflow: hidden !important;
  display: block !important;
  width: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 20px !important;
  box-shadow: 0 14px 34px rgba(40,57,90,0.07) !important;
}
.job-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 8px;
  background: var(--ag-grad);
}
.job-card:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 22px 48px rgba(40,57,90,0.12) !important;
}
.job-card.featured {
  background: #fff !important;
}
.featured-badge {
  position: static !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px;
  margin: 22px 22px 0 22px !important;
  padding: 6px 12px !important;
  border-radius: 999px !important;
  background: var(--ag-light) !important;
  color: var(--ag-primary) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .08em;
  text-transform: uppercase;
  border: none !important;
  z-index: 2;
}
.job-reference {
  position: absolute !important;
  top: 22px;
  right: 22px;
  z-index: 2;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--ag-ink-soft) !important;
}
.job-card-top,
.job-company-row,
.job-title,
.job-tags,
.job-card-bottom {
  padding-left: 24px !important;
  padding-right: 24px !important;
}
.job-card-top {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding-top: 18px !important;
  margin-bottom: 10px !important;
}
.job-card.featured .job-card-top {
  padding-top: 10px !important;
}
.company-logo.placeholder {
  width: 68px !important;
  height: 68px !important;
  border-radius: 18px !important;
  background: var(--ag-grad) !important;
  color: #fff !important;
  border: none !important;
  box-shadow: 0 10px 22px rgba(0,176,116,0.22) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
}
.save-btn {
  min-height: 40px !important;
  padding: 0 14px !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: var(--ag-ink-soft) !important;
  border: 1px solid var(--ag-border) !important;
}
.save-btn.saved,
.save-btn:hover {
  color: var(--ag-primary) !important;
  border-color: rgba(0,176,116,0.18) !important;
  background: var(--ag-light) !important;
}
.job-company-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-bottom: 8px !important;
}
.company-name {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--ag-secondary) !important;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.post-date {
  font-size: 13px !important;
  color: var(--ag-ink-soft) !important;
}
.job-title {
  margin: 0 0 12px !important;
}
.job-title a,
.job-title {
  font-size: 28px !important;
  line-height: 1.15 !important;
  font-weight: 600 !important;
  color: var(--ag-ink) !important;
  text-decoration: none !important;
}
.job-title a:hover {
  color: var(--ag-primary) !important;
}
.job-tags {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin-bottom: 16px !important;
}
.job-tag {
  border: none !important;
  border-radius: 999px !important;
  background: #f8fafc !important;
  color: var(--ag-ink-soft) !important;
  padding: 9px 14px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}
.job-card-bottom {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
  padding-bottom: 24px !important;
}
.salary-info {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  padding: 14px 16px !important;
  border-radius: 18px !important;
  background: linear-gradient(135deg, rgba(0,176,116,0.08) 0%, rgba(43,155,255,0.08) 100%) !important;
}
.salary-amount {
  font-size: 28px !important;
  line-height: 1 !important;
  font-weight: 600 !important;
  color: var(--ag-primary) !important;
}
.salary-location,
.salary-original,
.salary-original small {
  font-size: 12px !important;
  color: var(--ag-ink-soft) !important;
}
.job-card-bottom .btn,
.job-card-bottom .apply-btn,
.job-card-bottom .btn-large,
.apply-btn.applied {
  min-width: 154px !important;
  height: 44px !important;
  border-radius: 12px !important;
}
.apply-btn.applied {
  background: var(--ag-light) !important;
  color: var(--ag-primary) !important;
  border: none !important;
}
.filters-card {
  border-radius: 18px !important;
  box-shadow: var(--ag-shadow-sm) !important;
}
.filters-card h3 {
  font-size: 17px !important;
  font-weight: 600 !important;
  margin-bottom: 18px !important;
  color: var(--ag-ink) !important;
}
.filters-form .search-input,
.filters-form .filter-select {
  height: 44px !important;
  border-radius: 12px !important;
  border: 1px solid #e8eef6 !important;
  background: #fff !important;
}
.filters-form .search-input:focus,
.filters-form .filter-select:focus {
  border-color: rgba(0,176,116,0.32) !important;
  box-shadow: 0 0 0 3px rgba(0,176,116,0.08) !important;
}
.filter-actions-container {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 10px !important;
}
.filter-actions .btn {
  width: 100% !important;
}

/* Card grids on home/about/services/articles */
.cards-grid,
.features-grid,
.services-grid,
.specializations-grid,
.article-grid,
.news-grid,
.role-cards,
.positions-grid,
.team-grid,
.testimonials-grid {
  gap: 20px !important;
}
.article-card .btn,
.feature-card .btn,
.position-card .btn,
.team-card .btn,
.info-card .btn {
  margin-top: 12px;
}

/* Auth cards */
.auth-container,
.auth-card {
  border-radius: 24px !important;
  box-shadow: var(--ag-shadow-lg) !important;
}

/* Responsive */
@media (max-width: 1100px) {
  .jobs-page-container {
    grid-template-columns: 1fr !important;
  }
  .jobs-header,
  .jobs-grid {
    grid-column: auto !important;
  }
  .filters-card {
    position: relative !important;
    top: auto !important;
  }
}
@media (max-width: 768px) {
  .jobs-page-container { padding: 16px !important; gap: 16px !important; }
  .job-card-top,
  .job-company-row,
  .job-title,
  .job-tags,
  .job-card-bottom { padding-left: 18px !important; padding-right: 18px !important; }
  .job-title a,
  .job-title { font-size: 22px !important; }
  .job-card-bottom { flex-direction: column !important; align-items: stretch !important; }
  .job-card-bottom .btn,
  .job-card-bottom .apply-btn,
  .job-card-bottom .btn-large,
  .apply-btn.applied { width: 100% !important; min-width: 0 !important; }
  .filter-actions-container { grid-template-columns: 1fr !important; }
}


/* Brand new jobs page + homepage job cards */
.jobs-page-shell {
  max-width: 1280px;
  margin: 0 auto;
  padding: 24px 24px 40px;
}
.jobs-page-intro {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 24px;
  padding: 28px;
  border-radius: 34px;
  background: var(--ag-grad);
  box-shadow: 0 24px 80px rgba(0,176,116,.12);
  overflow: hidden;
  position: relative;
}
.jobs-page-intro::before,
.jobs-page-intro::after { content:""; position:absolute; border-radius:999px; filter:blur(48px); pointer-events:none; }
.jobs-page-intro::before { width:180px; height:180px; left:-30px; top:20px; background:rgba(43,155,255,.18); }
.jobs-page-intro::after { width:220px; height:220px; right:-20px; top:30px; background:rgba(255,255,255,.18); }
.jobs-page-intro > * { position:relative; z-index:1; }
.jobs-intro-pill {
  display:inline-flex; align-items:center; border-radius:999px; border:1px solid rgba(255,255,255,.4); background:rgba(255,255,255,.72);
  padding:8px 14px; font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:#0f172a;
}
.jobs-page-intro h1 { margin:16px 0 10px; font-size:clamp(30px,3.6vw,52px); line-height:1.05; font-weight:700; color:#0f172a; }
.jobs-page-intro p { margin:0; max-width:720px; font-size:15px; line-height:1.8; color:rgba(15,23,42,.78); }
.jobs-intro-panel {
  align-self:end; border:1px solid rgba(255,255,255,.28); background:rgba(255,255,255,.18); backdrop-filter:blur(20px); border-radius:30px; padding:20px;
}
.panel-title { margin-bottom:12px; font-size:14px; font-weight:600; color:#0f172a; }
.panel-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.panel-chip { border-radius:18px; background:#fff; padding:4px 12px; font-size:12px; color:#94a3b8; box-shadow:inset 0 1px 0 rgba(255,255,255,.8); }
.jobs-page-container--mockup { padding:24px 0 0 !important; grid-template-columns:300px minmax(0,1fr) !important; gap:24px !important; }
.filters-card--mockup { position:sticky; top:100px; border-radius:28px !important; padding:0 !important; overflow:hidden; }
.filters-toggle { width:100%; display:flex; align-items:center; justify-content:space-between; gap:16px; background:transparent; border:0; padding:20px; cursor:pointer; }
.filters-toggle strong { display:block; font-size:16px; color:#0f172a; }
.filters-toggle small { display:block; margin-top:3px; font-size:12px; color:#64748b; }
.filters-toggle svg { transition:transform .2s ease; }
.filters-toggle[aria-expanded="true"] svg { transform:rotate(180deg); }
.filters-panel { padding:0 20px 20px; }
.filters-form--mockup { display:grid; gap:14px; }
.filter-field label { display:block; margin-bottom:8px; font-size:11px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:#64748b; }
.filter-field .search-input, .filter-field .filter-select {
  height:48px !important; border-radius:16px !important; border:1px solid #e8eef6 !important; background:#fff !important; box-shadow:none !important; padding:0 16px !important;
}
.filter-actions-stack { display:grid; gap:10px; margin-top:6px; }
.jobs-results-column { min-width:0; }
.jobs-header--mockup {
  display:flex; align-items:flex-end; justify-content:space-between; gap:16px; border-radius:28px !important; padding:18px 20px !important; background:rgba(255,255,255,.74) !important;
}
.jobs-header--mockup h2 { margin:0; font-size:28px !important; line-height:1.1; }
.jobs-header--mockup p { margin:6px 0 0; font-size:14px; color:#64748b; }
.jobs-sort-pills { display:flex; flex-wrap:wrap; gap:8px; }
.jobs-sort-pills span {
  display:inline-flex; align-items:center; border-radius:999px; padding:4px 14px; font-size:12px; color:#475569; background:#fff; border:1px solid #e2e8f0;
}
.jobs-sort-pills .active { color:#fff; border-color:transparent; background:var(--ag-primary); }
.jobs-grid--mockup, .jobs-grid--homepage-mockup { display:grid !important; grid-template-columns:1fr !important; gap:16px !important; }
.job-card--mockup {
  position:relative; overflow:hidden; display:grid !important; grid-template-columns:minmax(0,1fr) 240px; gap:20px; padding:22px !important;
  border:1px solid rgba(16,185,129,.12) !important; border-radius:30px !important; background:rgba(255,255,255,.92) !important;
  box-shadow:0 18px 50px rgba(0,176,116,.10) !important;
}
.job-card--mockup::before { content:""; position:absolute; inset:0 auto 0 0; width:8px; background:linear-gradient(180deg,#00B074 0%,#2B9BFF 100%); }
.job-card--mockup:hover { transform:translateY(-6px) !important; border-color:rgba(16,185,129,.2) !important; box-shadow:0 24px 60px rgba(0,176,116,.14) !important; }
.job-card-main, .job-card-side { min-width:0; }
.job-card-badges { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; padding-left:6px; }
.job-card--mockup .featured-badge { margin:0 !important; padding:8px 12px !important; font-size:11px !important; letter-spacing:.08em; }
.job-pill {
  display:inline-flex; align-items:center; border-radius:999px; padding:8px 12px; font-size:12px; font-weight:600; line-height:1; border:1px solid transparent;
}
.job-pill--location { background:#ecfdf5; color:#047857; border-color:#d1fae5; }
.job-pill--reference { background:#eff6ff; color:#1d4ed8; border-color:#dbeafe; }
.job-card--mockup .job-title { padding:0 0 0 6px !important; margin:0 0 8px !important; }
.job-card--mockup .job-title a { font-size:26px !important; line-height:1.2; font-weight:700 !important; color:#0f172a !important; }
.job-card--mockup:hover .job-title a { color:#047857 !important; }
.job-subtitle { margin:0 0 14px; padding-left:6px; font-size:14px; line-height:1.7; color:#64748b; }
.job-highlights { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; padding-left:6px; }
.job-highlight {
  display:flex; align-items:center; min-height:42px; border-radius:16px; padding:10px 12px; font-size:13px; color:#475569;
  background:linear-gradient(135deg,#ecfdf5 0%,#eff6ff 100%);
}
.salary-panel {
  border-radius:24px; padding:16px; margin-bottom: 4px; background:linear-gradient(135deg,#EFFDF5 0%,#F7FFFD 50%,#EAF4FF 100%); box-shadow:inset 0 0 0 1px #d1fae5;
}
.salary-panel-label { font-size:10px; text-transform:uppercase; letter-spacing:.18em; color:#64748b; }
.job-card--mockup .salary-amount { display:block !important; margin:6px; font-size:16px !important; line-height:1; font-weight:700; color:#0f172a !important; }
.salary-panel-meta { margin-top:4px; font-size:12px; color:#64748b; }
.quick-facts {
  border-radius:24px; padding:14px 16px; background:#f8fafc; box-shadow:inset 0 0 0 1px #e2e8f0;margin-bottom: 4px;
}
.quick-facts-title { grid-column: 1 / -1; margin-bottom:2px; font-size:13px; font-weight:600; color:#0f172a; }
.quick-fact-item { display:inline-flex; align-items:center; gap:6px; min-height:24px; font-size:10px; color:#64748b; line-height:1.4; }
.job-card-actions { display:flex; gap:10px; }
.save-btn--mockup, .job-card-actions .btn { flex:1 1 0; min-width:0; }
.save-btn--mockup {
  min-height:46px; border-radius:18px; border:1px solid #d1fae5; background:#fff; color:#0f172a; font-weight:600;
}
.save-btn--mockup:hover { background:#ecfdf5; border-color:#a7f3d0; }
.save-btn--mockup.saved { background:#ecfdf5; color:#047857; border-color:#a7f3d0; }
.job-card-actions .btn.btn-primary { min-height:46px; border-radius:18px !important; background:linear-gradient(135deg,#00B074 0%,#2B9BFF 100%) !important; }
.jobs-grid--homepage-mockup .job-card--mockup { grid-template-columns:minmax(0,1fr) 220px; }
.jobs-grid--homepage-mockup .job-card--mockup .job-title a { font-size:22px !important; }
.jobs-grid--homepage-mockup .job-highlight:nth-child(3) { display:none; }
.jobs-grid--homepage-mockup .job-subtitle { margin-bottom:12px; }
.jobs-grid--homepage-mockup .salary-panel { padding:14px; }
.jobs-grid--homepage-mockup .job-card-actions .btn, .jobs-grid--homepage-mockup .save-btn--mockup { min-height:42px; }
@media (max-width: 1100px) {
  .jobs-page-intro { grid-template-columns:1fr; }
  .panel-grid { grid-template-columns:1fr 1fr; }
  .jobs-page-container--mockup { grid-template-columns:1fr !important; }
  .filters-card--mockup { position:relative; top:auto; }
  .job-card--mockup { grid-template-columns:1fr !important; }
}
@media (max-width: 767px) {
  .jobs-page-shell { padding:16px 16px 28px; }
  .jobs-page-intro { padding:20px; border-radius:26px; }
  .jobs-page-intro h1 { font-size:30px; }
  .jobs-page-container--mockup { padding-top:18px !important; }
  .jobs-header--mockup { flex-direction:column; align-items:flex-start; }
  .job-card--mockup { padding:18px !important; border-radius:24px !important; }
  .job-card--mockup .job-title a { font-size:22px !important; }
  .job-highlights { grid-template-columns:1fr; }
  .job-card-actions { flex-direction:column; }
  .jobs-grid--homepage-mockup .job-card--mockup { grid-template-columns:1fr !important; }
}
html[data-theme="dark"] .jobs-page-intro,
html[data-theme="dark"] .jobs-intro-panel,
html[data-theme="dark"] .filters-card--mockup,
html[data-theme="dark"] .jobs-header--mockup,
html[data-theme="dark"] .job-card--mockup,
html[data-theme="dark"] .quick-facts,
html[data-theme="dark"] .salary-panel {
  box-shadow:none !important;
}


/* ===== AfriGulf proportion hotfix merged below ===== */


/* AfriGulf proportional hotfix for live site
   Focus: homepage + jobs page sizing, spacing, card density, and horizontal job rows
*/

/* Global public proportions */
:root{
  --ag-container: 1240px;
  --ag-radius-xl: 24px;
  --ag-radius-lg: 18px;
  --ag-shadow-sm: 0 12px 28px rgba(15,23,42,.06);
  --ag-shadow-md: 0 18px 40px rgba(15,23,42,.08);
  --ag-line: #e6eef4;
  --ag-ink: #0f172a;
  --ag-ink-soft: #64748b;
  --ag-green: #00B074;
  --ag-blue: #2B9BFF;
  --ag-green-soft: #EFFDF5;
  --ag-blue-soft: #EAF4FF;
}

.container,
.page-container,
.homepage-container,
.jobs-page-container,
.public-page-container{
  max-width: var(--ag-container) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Header */
.site-header .header-inner,
.site-header .container{
  max-width: var(--ag-container) !important;
  padding-top: 14px !important;
  padding-bottom: 14px !important;
}
.site-header .nav-item,
.site-header .nav-link{
  font-size: 13px !important;
  padding: 10px 12px !important;
  white-space: nowrap !important;
}
.site-header .header-cta-btn,
.site-header .btn,
.site-header .icon-btn{
  min-height: 40px !important;
  height: 40px !important;
  font-size: 13px !important;
  padding: 0 14px !important;
  white-space: nowrap !important;
}

/* Homepage hero / slider */
.fullpage-slider,
.hero-slider,
.home-hero,
.slide{
  min-height: 680px !important;
  height: auto !important;
}
.slide-content,
.hero-content,
.hero-cap{
  max-width: var(--ag-container) !important;
  padding-top: 96px !important;
  padding-bottom: 96px !important;
}
.slide-title,
.hero-title,
.hero-cap h1{
  max-width: 780px !important;
  font-size: clamp(34px, 4.6vw, 58px) !important;
  line-height: 1.04 !important;
}
.slide-subtitle,
.hero-subtitle,
.hero-cap p{
  max-width: 640px !important;
  font-size: 16px !important;
  line-height: 1.75 !important;
}
.hero-search-card,
.quick-job-search,
.slider-search-panel{
  max-width: 460px !important;
}
.hero-search-card .input,
.quick-job-search .input,
.hero-search-card input{
  min-height: 48px !important;
  height: 48px !important;
  font-size: 14px !important;
}
.hero-search-card .btn,
.quick-job-search .btn{
  min-height: 46px !important;
  height: 46px !important;
}

/* General card system */
.card,
.public-card,
.feature-card,
.article-card,
.news-card,
.info-card,
.contact-card{
  border-radius: var(--ag-radius-lg) !important;
  box-shadow: var(--ag-shadow-sm) !important;
  border: 1px solid var(--ag-line) !important;
}
.card-body,
.public-card__body,
.feature-card .card-body{
  padding: 20px !important;
}
.card h3,
.public-card h3,
.feature-card h3{
  font-size: 20px !important;
  line-height: 1.3 !important;
}

/* Jobs page layout */
.jobs-page-container,
.jobs-layout,
.jobs-main-layout{
  display: grid !important;
  grid-template-columns: 280px minmax(0,1fr) !important;
  gap: 24px !important;
  align-items: start !important;
}
.filters-card,
.jobs-sidebar,
.jobs-filters{
  position: sticky !important;
  top: 92px !important;
  width: auto !important;
  border-radius: 20px !important;
  padding: 18px !important;
  box-shadow: var(--ag-shadow-sm) !important;
}
.filters-card .input,
.jobs-sidebar input,
.jobs-sidebar select,
.jobs-filters input,
.jobs-filters select{
  min-height: 44px !important;
  height: 44px !important;
  font-size: 14px !important;
}
.filters-card .btn,
.jobs-sidebar .btn,
.jobs-filters .btn{
  min-height: 44px !important;
  height: 44px !important;
}

/* Remove redundant top jobs search bar if present */
.jobs-top-search,
.jobs-search-band,
.jobs-page .search-band,
.jobs-page .top-search{
  display: none !important;
}

/* Jobs list header */
.jobs-list-header,
.jobs-results-header{
  border-radius: 20px !important;
  padding: 16px 18px !important;
  margin-bottom: 18px !important;
}
.jobs-list-header h2,
.jobs-results-header h2{
  font-size: 24px !important;
  line-height: 1.2 !important;
  margin: 0 0 4px !important;
}
.jobs-list-header p,
.jobs-results-header p{
  font-size: 14px !important;
  line-height: 1.6 !important;
  margin: 0 !important;
}

/* Force one horizontal job card per row */
.jobs-grid,
.jobs-list,
.job-listings,
#jobs-list,
.jobs-results{
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 16px !important;
}

/* New job card proportions */
.job-card,
.job-listing-card,
.job-item,
.job-row-card{
  min-height: 0 !important;
  height: auto !important;
  border-radius: 22px !important;
  overflow: hidden !important;
  box-shadow: var(--ag-shadow-md) !important;
  border: 1px solid #dff0ea !important;
  background: rgba(255,255,255,.96) !important;
}
.job-card .card-body,
.job-listing-card .card-body,
.job-item .card-body{
  padding: 0 !important;
}
.job-card .job-card-shell,
.job-listing-card .job-card-shell,
.job-card .job-card-inner{
  display: grid !important;
  grid-template-columns: 8px minmax(0,1fr) !important;
}
.job-card .job-card-accent,
.job-listing-card .job-card-accent{
  background: linear-gradient(180deg,var(--ag-green) 0%, var(--ag-blue) 100%) !important;
}
.job-card .job-card-main,
.job-listing-card .job-card-main,
.job-card .job-main{
  padding: 20px !important;
}

/* Inner horizontal split */
.job-card .job-main-grid,
.job-listing-card .job-main-grid,
.job-card .job-top{
  display: grid !important;
  grid-template-columns: minmax(0,1fr) 210px !important;
  gap: 20px !important;
  align-items: center !important;
}

.job-card .company-logo,
.job-listing-card .company-logo,
.job-card .logo-block{
  width: 64px !important;
  height: 64px !important;
  border-radius: 18px !important;
  font-size: 16px !important;
  flex: 0 0 64px !important;
}

.job-card .job-badges,
.job-listing-card .job-badges{
  gap: 8px !important;
  margin-bottom: 10px !important;
}
.job-card .badge,
.job-listing-card .badge,
.job-card .featured-badge,
.job-card .job-reference,
.job-listing-card .job-reference{
  border-radius: 999px !important;
  padding: 7px 10px !important;
  font-size: 11px !important;
  line-height: 1 !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
}
.job-card .featured-badge{
  background: linear-gradient(135deg,#dcfce7 0%, #eff6ff 100%) !important;
  color: #047857 !important;
  border: 1px solid #c7f3db !important;
}
.job-card .job-reference,
.job-listing-card .job-reference{
  background: var(--ag-blue-soft) !important;
  color: #1d4ed8 !important;
  border: 1px solid #cfe4ff !important;
}

.job-card .job-title,
.job-listing-card .job-title,
.job-card h3{
  font-size: 24px !important;
  line-height: 1.18 !important;
  margin: 0 0 8px !important;
  word-break: break-word !important;
}
.job-card .job-summary,
.job-listing-card .job-summary,
.job-card .job-excerpt{
  font-size: 14px !important;
  line-height: 1.65 !important;
  color: var(--ag-ink-soft) !important;
  margin: 0 0 12px !important;
}

.job-card .job-meta,
.job-listing-card .job-meta{
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}
.job-card .job-meta .meta-pill,
.job-listing-card .job-meta .meta-pill,
.job-card .job-tags > *{
  border-radius: 999px !important;
  background: #f8fafc !important;
  color: #475569 !important;
  padding: 8px 12px !important;
  font-size: 13px !important;
}

.job-card .job-side,
.job-listing-card .job-side,
.job-card .salary-column{
  display: grid !important;
  gap: 10px !important;
  align-content: center !important;
}
.job-card .salary-panel,
.job-listing-card .salary-panel,
.job-card .salary-box{
  border-radius: 18px !important;
  padding: 14px !important;
  background: linear-gradient(135deg,#effdf5 0%, #eef6ff 100%) !important;
  border: 1px solid #d8f0e5 !important;
}
.job-card .salary-panel .label,
.job-listing-card .salary-panel .label{
  font-size: 10px !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  color: #64748b !important;
}
.job-card .salary-panel .amount,
.job-listing-card .salary-panel .amount{
  font-size: 16px !important;
  line-height: 1.1 !important;
  font-weight: 700 !important;
  color: var(--ag-green) !important;
}
.job-card .job-actions,
.job-listing-card .job-actions{
  display: flex !important;
  gap: 8px !important;
}
.job-card .job-actions .btn,
.job-listing-card .job-actions .btn{
  min-height: 42px !important;
  height: 42px !important;
  font-size: 13px !important;
  padding: 0 14px !important;
  border-radius: 16px !important;
}

/* Homepage featured/latest jobs cards */
.home-jobs-grid,
.featured-jobs-grid,
.latest-jobs-grid{
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 16px !important;
}
.home-jobs-grid .job-card,
.featured-jobs-grid .job-card,
.latest-jobs-grid .job-card{
  border-radius: 22px !important;
}
.home-jobs-grid .job-card .job-main-grid,
.featured-jobs-grid .job-card .job-main-grid{
  grid-template-columns: minmax(0,1fr) 190px !important;
}

/* Dark mode consistency */
html[data-theme='dark'] body,
html[data-theme='dark'] .public-body{
  background: #0f172a !important;
}
html[data-theme='dark'] .site-header{
  background: rgba(15,23,42,.88) !important;
  border-bottom-color: rgba(51,65,85,.7) !important;
}
html[data-theme='dark'] .card,
html[data-theme='dark'] .public-card,
html[data-theme='dark'] .job-card,
html[data-theme='dark'] .filters-card,
html[data-theme='dark'] .jobs-list-header{
  background: #0f172a !important;
  border-color: #1e293b !important;
  box-shadow: none !important;
}
html[data-theme='dark'] h1,
html[data-theme='dark'] h2,
html[data-theme='dark'] h3,
html[data-theme='dark'] h4,
html[data-theme='dark'] .job-title{
  color: #f8fafc !important;
}
html[data-theme='dark'] p,
html[data-theme='dark'] .job-summary,
html[data-theme='dark'] .job-meta,
html[data-theme='dark'] .text-muted{
  color: #cbd5e1 !important;
}
html[data-theme='dark'] .job-card .job-meta .meta-pill,
html[data-theme='dark'] .job-card .job-tags > *{
  background: #111827 !important;
  color: #cbd5e1 !important;
}
html[data-theme='dark'] .job-card .salary-panel{
  background: linear-gradient(135deg,#0f2a20 0%, #0f1f33 100%) !important;
  border-color: #1f4f46 !important;
}
html[data-theme='dark'] input,
html[data-theme='dark'] select,
html[data-theme='dark'] textarea{
  background: #111827 !important;
  border-color: #1f2937 !important;
  color: #f8fafc !important;
}

/* Responsive */
@media (max-width: 1199px){
  .jobs-page-container,
  .jobs-layout,
  .jobs-main-layout{
    grid-template-columns: 1fr !important;
  }
  .filters-card,
  .jobs-sidebar,
  .jobs-filters{
    position: relative !important;
    top: auto !important;
  }
}
@media (max-width: 860px){
  .slide-title,
  .hero-title,
  .hero-cap h1{
    font-size: 34px !important;
  }
  .job-card .job-main-grid,
  .job-listing-card .job-main-grid,
  .home-jobs-grid .job-card .job-main-grid{
    grid-template-columns: 1fr !important;
  }
  .job-card .job-side,
  .job-listing-card .job-side{
    align-content: start !important;
  }
}
@media (max-width: 640px){
  .site-header .header-inner,
  .site-header .container{
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  .slide-content,
  .hero-content,
  .hero-cap{
    padding-top: 76px !important;
    padding-bottom: 76px !important;
  }
  .card-body,
  .public-card__body{
    padding: 16px !important;
  }
  .job-card .job-card-main,
  .job-listing-card .job-card-main{
    padding: 16px !important;
  }
}



@media (max-width: 767px) {
  .quick-facts {
    grid-template-columns: 1fr;
  }
}