/* ==========================================================================
   Careers / Jobs page — careers.css
   ========================================================================== */

/* ── Page header ─────────────────────────────────────────────────── */
.car-page-header {
  background: linear-gradient(135deg, var(--navy-60) 0%, var(--navy-50) 100%);
  padding: 72px 0 64px;
  position: relative;
  overflow: hidden;
}
.car-page-header::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 60% 80% at 80% 50%, rgba(176,32,40,.18) 0%, transparent 70%);
  pointer-events: none;
}
.car-page-header .breadcrumb { margin-bottom: 28px; }
.car-page-header .breadcrumb a,
.car-page-header .breadcrumb span,
.car-page-header .breadcrumb i { color: rgba(255,255,255,.55); }
.car-page-header .breadcrumb a:hover { color: var(--white); }
.car-page-header h1 {
  font: 700 clamp(2rem, 4.5vw, 3rem)/1.1 var(--font-sans);
  color: var(--white);
  letter-spacing: -0.03em;
  margin: 0 0 20px;
  max-width: 680px;
}
.car-page-header h1 span { color: var(--red-40, #e05560); }
.car-hero-sub {
  font: 400 17px/1.7 var(--font-sans);
  color: rgba(255,255,255,.75);
  max-width: 600px;
  margin: 0 0 36px;
}
.car-hero-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.car-hero-stats {
  display: flex;
  gap: 40px;
  margin-top: 52px;
  padding-top: 36px;
  border-top: 1px solid rgba(255,255,255,.12);
  flex-wrap: wrap;
}
.car-stat-item { display: flex; flex-direction: column; gap: 4px; }
.car-stat-value {
  font: 700 1.75rem/1 var(--font-sans);
  color: var(--white);
  letter-spacing: -0.02em;
}
.car-stat-label {
  font: 400 13px/1 var(--font-sans);
  color: rgba(255,255,255,.55);
}

/* ── Benefits section ────────────────────────────────────────────── */
.car-benefits-section {
  padding: 88px 0;
  background: #F9FAFB;
}
.car-section-head {
  margin-bottom: 48px;
}
.car-section-head .eyebrow { display: block; margin-bottom: 12px; }
.car-section-head h2 {
  font: 700 clamp(1.5rem, 3vw, 2rem)/1.2 var(--font-sans);
  color: var(--fg-primary);
  letter-spacing: -0.02em;
  margin: 0;
}

.car-benefits-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.car-benefit-card {
  background: var(--white);
  border: 1px solid var(--border-minimal);
  border-radius: 14px;
  padding: 28px 22px;
  transition: box-shadow .25s, border-color .25s, transform .25s;
}
.car-benefit-card:hover {
  box-shadow: 0 8px 28px rgba(0,0,0,.08);
  border-color: var(--red-30);
  transform: translateY(-2px);
}
.car-benefit-icon {
  width: 44px; height: 44px;
  border-radius: 11px;
  background: var(--red-10);
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; color: var(--red-50);
  margin-bottom: 16px;
}
.car-benefit-card h4 {
  font: 700 15px/1.3 var(--font-sans);
  color: var(--fg-primary);
  margin: 0 0 8px;
}
.car-benefit-card p {
  font: 400 13px/1.65 var(--font-sans);
  color: var(--fg-secondary);
  margin: 0;
}

/* ── Open roles section ──────────────────────────────────────────── */
.car-roles-section {
  padding: 88px 0;
  background: var(--white);
}
.car-roles-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 40px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--border-minimal);
}
.car-roles-head h2 {
  font: 700 clamp(1.5rem, 3vw, 2rem)/1.2 var(--font-sans);
  color: var(--fg-primary);
  letter-spacing: -0.02em;
  margin: 0;
}
.car-roles-head p {
  font: 400 15px/1 var(--font-sans);
  color: var(--fg-secondary);
  margin: 0;
}

/* ── WP Job Openings plugin overrides ───────────────────────────── */

/* Reset plugin default padding/margin that conflicts with our layout */
.car-roles-section .awsm-job-main,
.car-roles-section .awsm-job-container {
  max-width: none;
  padding: 0;
  margin: 0;
}

/* ---- Filter / Search bar ---- */
.car-roles-section .awsm-filter-wrap {
  background: var(--white);
  border: 1px solid var(--border-minimal);
  border-radius: 16px;
  padding: 20px 24px;
  margin-bottom: 32px;
  box-shadow: 0 2px 12px rgba(0,0,0,.05);
}
.car-roles-section .awsm-filter-wrap form {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

/* Search input */
.car-roles-section .awsm-filter-item-search {
  flex: 1 1 200px;
  min-width: 180px;
}
.car-roles-section .awsm-filter-item-search-in {
  position: relative;
}
.car-roles-section .awsm-job-search,
.car-roles-section input.awsm-job-form-control,
.awsm-job-main .awsm-job-search,
.awsm-job-main input.awsm-job-form-control {
  width: 100%;
  height: 44px;
  padding: 0 44px 0 16px;
  border: 1px solid var(--border-minimal) !important;
  border-radius: 10px !important;
  font: 400 14px/1 var(--font-sans);
  color: var(--fg-primary);
  background: #ffffff !important;
  outline: none;
  transition: border-color .2s, box-shadow .2s;
  box-sizing: border-box;
  box-shadow: none !important;
  min-height: unset !important;
}
.car-roles-section .awsm-job-search:focus,
.car-roles-section input.awsm-job-form-control:focus,
.awsm-job-main .awsm-job-search:focus,
.awsm-job-main input.awsm-job-form-control:focus {
  border-color: var(--red-50) !important;
  box-shadow: 0 0 0 3px rgba(176,32,40,.1) !important;
  background: #ffffff !important;
}
.car-roles-section .awsm-job-search-btn {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--fg-tertiary);
  font-size: 16px;
  cursor: pointer;
  display: flex;
}
.car-roles-section .awsm-job-search-close-btn { display: none; }

/* Filter dropdowns */
.car-roles-section .awsm-filter-items {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}
.car-roles-section .awsm-filter-item {
  flex: 1 1 160px;
  min-width: 150px;
}
.car-roles-section .awsm-filter-option,
.awsm-job-main .awsm-filter-option {
  width: 100%;
  height: 44px;
  padding: 0 36px 0 14px;
  border: 1px solid var(--border-minimal);
  border-radius: 10px;
  font: 400 14px/1 var(--font-sans);
  color: var(--fg-primary);
  background: var(--grey-10, #F9FAFB) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236B7280' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 14px center;
  appearance: none;
  -webkit-appearance: none;
  outline: none;
  cursor: pointer;
  transition: border-color .2s, box-shadow .2s;
  box-sizing: border-box;
}
.car-roles-section .awsm-filter-option:focus,
.awsm-job-main .awsm-filter-option:focus {
  border-color: var(--red-50);
  box-shadow: 0 0 0 3px rgba(176,32,40,.1);
  background-color: var(--white);
}

/* Filter toggle (mobile) */
.car-roles-section .awsm-filter-toggle { display: none; }

/* ---- Job listings grid ---- */
.car-roles-section .awsm-job-wrap { margin: 0; }

.car-roles-section .awsm-job-listings.awsm-lists {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  list-style: none;
  padding: 0;
  margin: 0;
}

/* Individual job card */
.car-roles-section .awsm-job-listing-item {
  background: var(--white);
  border: 1.5px solid var(--border-minimal);
  border-top: 3px solid var(--border-minimal);
  border-radius: 16px;
  overflow: hidden;
  transition: box-shadow .25s, border-color .25s, transform .25s;
  padding: 0;
  position: relative;
}
.car-roles-section .awsm-job-listing-item::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--red-50) 0%, #e05560 100%);
  opacity: 0;
  transition: opacity .25s;
}
.car-roles-section .awsm-job-listing-item:hover {
  box-shadow: 0 16px 48px rgba(176,32,40,.12), 0 4px 16px rgba(0,0,0,.06);
  border-color: var(--red-20);
  border-top-color: transparent;
  transform: translateY(-4px);
}
.car-roles-section .awsm-job-listing-item:hover::before {
  opacity: 1;
}

/* Remove anchor/item default styles */
.car-roles-section .awsm-job-item {
  display: flex;
  flex-direction: column;
  height: 100%;
  text-decoration: none;
  padding: 0;
  background: none;
  border: none;
}
.car-roles-section .awsm-list-left-col,
.car-roles-section .awsm-list-right-col {
  width: 100%;
  float: none;
  padding: 0;
}

/* Remove any featured image area */
.car-roles-section .awsm-job-featured-image { display: none; }

/* Card inner layout */
.car-roles-section .awsm-list-left-col {
  padding: 24px 24px 0;
}
.car-roles-section .awsm-list-right-col {
  padding: 12px 24px 24px;
  display: flex;
  flex-direction: column;
  flex: 1;
}

/* Department badge — first spec item shown as pill */
.car-roles-section .awsm-job-specification-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}
.car-roles-section .awsm-job-specification-item {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font: 600 11px/1 var(--font-sans);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.car-roles-section .awsm-job-specification-job-category {
  color: var(--red-50);
  background: var(--red-10);
  border: 1px solid var(--red-20);
  border-radius: 999px;
  padding: 5px 12px;
}
.car-roles-section .awsm-job-specification-job-location {
  color: var(--fg-secondary);
  padding: 0;
  font-weight: 400;
  font-size: 13px;
  letter-spacing: 0;
  text-transform: none;
}
.car-roles-section .awsm-job-specification-job-type {
  color: var(--fg-tertiary);
  padding: 0;
  font-weight: 400;
  font-size: 13px;
  letter-spacing: 0;
  text-transform: none;
}
.car-roles-section .awsm-job-specification-label { display: none; }
.car-roles-section .awsm-job-specification-term { color: inherit; }

/* Job title */
.car-roles-section .awsm-job-post-title {
  font: 700 17px/1.35 var(--font-sans);
  color: var(--fg-primary);
  margin: 0 0 10px;
  letter-spacing: -0.01em;
}
.car-roles-section .awsm-job-post-title a {
  color: inherit;
  text-decoration: none;
}
.car-roles-section .awsm-job-listing-item:hover .awsm-job-post-title a {
  color: var(--red-50);
}

/* Location row — shown in right col */
.car-roles-section .awsm-list-right-col .awsm-job-specification-wrapper {
  flex: 1;
}

/* "More Details" link */
.car-roles-section .awsm-job-more-container {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--border-minimal);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.car-roles-section .awsm-job-more-container::after {
  content: 'Indore, India';
  font: 400 12px/1 var(--font-sans);
  color: var(--fg-tertiary);
  display: flex;
  align-items: center;
  gap: 4px;
}
.car-roles-section .awsm-job-more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font: 600 13px/1 var(--font-sans);
  color: var(--white);
  background: var(--red-50);
  text-decoration: none;
  padding: 8px 16px;
  border-radius: 8px;
  transition: background .2s, transform .2s;
}
.car-roles-section .awsm-job-more::after {
  content: '→';
  transition: transform .2s;
}
.car-roles-section .awsm-job-listing-item:hover .awsm-job-more {
  background: #8f1a20;
}
.car-roles-section .awsm-job-listing-item:hover .awsm-job-more::after {
  transform: translateX(3px);
}
.car-roles-section .awsm-job-more span { display: none; }

/* No jobs / loading state */
.car-roles-section .awsm-jobs-none-container {
  text-align: center;
  padding: 64px 24px;
  color: var(--fg-secondary);
  font: 400 16px/1.6 var(--font-sans);
}

/* Load more button */
.car-roles-section .awsm-load-more-main {
  text-align: center;
  margin-top: 36px;
}
.car-roles-section .awsm-load-more-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 32px;
  background: var(--white);
  border: 1.5px solid var(--border-minimal);
  border-radius: 10px;
  font: 600 14px/1 var(--font-sans);
  color: var(--fg-primary);
  text-decoration: none;
  transition: border-color .2s, color .2s, box-shadow .2s;
}
.car-roles-section .awsm-load-more-btn:hover {
  border-color: var(--red-50);
  color: var(--red-50);
  box-shadow: 0 4px 16px rgba(176,32,40,.1);
}

/* Expired job — muted */
.car-roles-section .awsm-job-expired-item {
  opacity: .55;
  pointer-events: none;
}

/* ── Responsive ──────────────────────────────────────────────────── */
@media (max-width: 1100px) {
  .car-benefits-grid { grid-template-columns: repeat(2, 1fr); }
  .car-roles-section .awsm-job-listings.awsm-lists { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 860px) {
  .car-hero-stats { gap: 24px; }
}
@media (max-width: 640px) {
  .car-benefits-grid  { grid-template-columns: 1fr; }
  .car-benefits-section { padding: 52px 0; }
  .car-roles-section    { padding: 52px 0; }
  .car-hero-actions { flex-direction: column; }
  .car-hero-actions .sero-btn { width: 100%; justify-content: center; }
  .car-roles-section .awsm-job-listings.awsm-lists { grid-template-columns: 1fr; }
  .car-roles-section .awsm-filter-wrap form { flex-direction: column; }
  .car-roles-section .awsm-filter-item-search,
  .car-roles-section .awsm-filter-item { flex: 1 1 100%; }
}
@media (max-width: 480px) {
  .car-page-header { padding: 48px 0 44px; }
  .car-hero-stats  { display: grid; grid-template-columns: 1fr 1fr; gap: 20px 32px; }
}