/* ═══════════════════════════════════════════════════════════════════════
   JOBS CTA — parallax line-art bg + radial orange glow
   Verbatim port of prototype #jobs-cta block (01-homepage.html).
   Source: lines 1697–1709 (desktop), 1934–1936 (≤860px), 3408 (≤600px).
   Section sits between News and Footer in front-page.php.
   ═══════════════════════════════════════════════════════════════════════ */

#jobs-cta{background:#000;padding:90px 24px;position:relative;overflow:hidden}  /* tightened from 120 */
.jobs-lineart{
  position:absolute;top:-20%;left:0;right:0;bottom:-20%;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1400' height='800' viewBox='0 0 1400 800'%3E%3Cg stroke='rgba(255,255,255,0.08)' stroke-width='1' fill='none'%3E%3Cpath d='M700 50 L300 700 L1100 700 Z'/%3E%3Cpath d='M700 120 L360 680 L1040 680 Z'/%3E%3Cpath d='M700 220 L430 660 L970 660 Z'/%3E%3Cpath d='M700 320 L500 640 L900 640 Z'/%3E%3Ccircle cx='700' cy='400' r='340'/%3E%3Ccircle cx='700' cy='400' r='240'/%3E%3Ccircle cx='700' cy='400' r='140'/%3E%3Ccircle cx='700' cy='400' r='60'/%3E%3Cline x1='0' y1='400' x2='1400' y2='400'/%3E%3Cline x1='700' y1='0' x2='700' y2='800'/%3E%3Cline x1='100' y1='0' x2='1300' y2='800'/%3E%3Cline x1='1300' y1='0' x2='100' y2='800'/%3E%3Cpolygon points='700,60 1300,420 1060,760 340,760 100,420'/%3E%3Cpolygon points='700,160 1200,410 1000,700 400,700 200,410'/%3E%3C/g%3E%3C/svg%3E");
  background-size:cover;background-position:center;
  will-change:transform;
  opacity:0.55;
}
#jobs-cta::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 55% 70% at 85% 50%,rgba(242,122,15,0.18) 0%,transparent 70%);pointer-events:none;z-index:1}
.jcta-inner{max-width:960px;margin:0 auto;display:grid;grid-template-columns:1fr auto;gap:60px;align-items:center;position:relative;z-index:2}
.jcta-sub{margin-top:12px;font-size:0.95rem;font-weight:300;color:rgba(255,255,255,0.42);line-height:1.65;max-width:380px}
.jcta-right{text-align:right}

/* Tablet/mobile collapse — verbatim from prototype @media(max-width:860px) block */
@media(max-width:860px){
  .jcta-inner{grid-template-columns:1fr;text-align:center}
  .jcta-right{text-align:center}
  .jcta-sub{max-width:100%}
}

/* Mobile padding tighten — verbatim from prototype @media (max-width: 600px) block */
@media (max-width:600px){
  #jobs-cta{padding:56px 20px}
}
