/* ============================================================
   CAREERS.CSS - page-specific styles for /careers (דרושים).
   The application form reuses the shared .contact-* split card
   from main.css. This file styles the hero + the application
   split + the page offset under the fixed nav.
   ============================================================ */

/* page sits under the fixed nav (top-bar + main-bar) - cream so the
   padding-top offset matches the light hero, no grey strip (see catalog.css) */
.careers-page { padding-top: 124px; background: #f2dcc9; }

/* ---------- hero (light / cream band) ---------- */
.careers-hero {
  background: #f2dcc9;
  padding: 56px 0 24px; text-align: center;
}
.careers-title {
  font-family: var(--font-display); font-weight: 900;
  font-size: clamp(40px, 6vw, 72px); line-height: 1.04;
  color: #1f1a1b; margin-bottom: 8px;
}
.careers-subtitle {
  font-family: var(--font-display); font-weight: 700;
  font-size: clamp(20px, 3vw, 30px); line-height: 1.2;
  color: #1f1a1b; margin-bottom: 20px;
}
.careers-subtitle span { color: var(--gold); }
.careers-lead {
  max-width: 640px; margin: 0 auto; font-size: 17px;
  line-height: 1.8; color: #3a3330;
}

/* ---------- form section spacing (cream band from main.css) - tight to the hero ---------- */
.careers-page .contact-section { padding-top: 8px; }

/* ---------- application card (form only, centered) ---------- */
.careers-apply-wrap {
  border: 1px solid var(--line-gold); background: var(--bg-soft);
  max-width: 620px; margin: 0 auto;
  border-radius: 33px; overflow: hidden;   /* match the .contact-form-wrap card on /contact */
  box-shadow: 0 30px 70px rgba(0,0,0,0.5);
}
.careers-apply-wrap .contact-form { padding: 46px 38px; }

/* ---------- mobile ---------- */
@media (max-width: 767px) {
  .careers-page { padding-top: 88px; }
  .careers-hero { padding: 40px 0 20px; }
  /* full-bleed: break the card out of the .container's 16px gutters (edge-to-edge) */
  .careers-apply-wrap { max-width: none; margin-inline: -16px; border-radius: 0; border-inline: none; }
  /* slim side padding so the inputs run nearly full width */
  .careers-apply-wrap .contact-form { padding: 28px 16px; }
}