/* stylelint-disable */
  /* ------------------------------------------------------------------ *
   * Cyberstaff job board theme
   * Matches cyberstaff.com/careers: Inter + Inter Display (via opsz axis),
   * white surface, slate text, #2a66ff accent.
   * Ashby's custom-CSS validator only allows .ashby-* classes + at-rules,
   * so everything below targets those (no hashed module classes).
   * @import MUST stay first — CSS ignores @import after other rules.
   * ------------------------------------------------------------------ */

   @import url('https://fonts.googleapis.com/css2?family=Inter:opsz,wght@14..32,400..700&display=swap');

   :root {
         /* Layout */
         --widthMaxJobBoard: 860px;
 
         --borderRadiusContainer: 8px;
         --borderRadiusControl: 8px;
         --borderRadiusButton: 8px;
 
         /* Typography */
         --fontFamily: "Inter", "-apple-system", "BlinkMacSystemFont", "Segoe UI",
                 "Helvetica", "Arial", sans-serif;
 
         /* Cyberstaff palette */
         --cs-blue: #2a66ff;
         --cs-blue-hover: #1f54e0;
         --cs-ink: #0f172a;       /* slate-900 */
         --cs-body: #0f172b;      /* slate-600 */
         --cs-muted: #64748b;     /* slate-500 */
         --cs-border: #e2e8f0;    /* slate-200 */
         --cs-surface: #f8fafc;   /* slate-50  */
         --cs-surface-2: #f1f5f9; /* slate-100 */
   }
 
   /* Plain white background. Body text follows its size on the opsz axis. */
   body {
         background: #ffffff;
         color: var(--cs-body);
         font-family: var(--fontFamily);
         font-optical-sizing: auto;
         -webkit-font-smoothing: antialiased;
         -moz-osx-font-smoothing: grayscale;
   }
 
   /* Headings → Inter Display look (opsz pinned to the display end).
    * Only opsz is set here, so font-weight below still drives weight. */
   h1, h2, h3, h4, h5, h6,
   .ashby-job-board-heading,
   .ashby-job-posting-heading,
   .ashby-job-posting-brief-title,
   .ashby-department-heading,
   .ashby-job-posting-brief-department-heading {
         font-variation-settings: 'opsz' 32;
   }
 
   /* ---- Logos: board wordmark sized to match the posting page ---- */
   .ashby-job-posting-header img,
   img[src*="org-theme-wordmark"] {
         max-width: 140px;
         height: auto;
   }
 
   /* ---- Board heading ("Open Positions (4)") ---- */
   .ashby-job-board-heading {
         font-weight: 600;
         font-size: 28px;
         letter-spacing: -0.02em;
         color: var(--cs-ink);
         margin-left: -15px;
   }
   .ashby-job-board-heading-count {
         color: var(--cs-muted);
         font-weight: 500;
   }
 
   /* ---- Department headings (eyebrow style) ---- */
   .ashby-department-heading,
   .ashby-job-posting-brief-department-heading {
         font-weight: 600;
         font-size: 13px;
         letter-spacing: 0.06em;
         text-transform: uppercase;
         color: var(--cs-muted);
         margin: 32px 0 12px;
   }
 
   /* ---- Team sub-headings (only render when teams are shown) ---- */
   .ashby-department-heading-level,
   .ashby-job-posting-brief-department-heading-level {
         font-weight: 600;
         font-size: 15px;
         color: var(--cs-ink);
         margin: 16px 0 0;
   }
 
   /* ---- Job rows as cards (mirrors the careers-page rows) ---- */
   .ashby-job-posting-brief-list {
         display: flex;
         flex-direction: column;
         gap: 10px;
   }
 
   .ashby-job-posting-brief {
         position: relative;
         margin-bottom: 0;
         background: #ffffff;
         border: 1px solid var(--cs-border);
         box-shadow: none !important;
         border-top: 1px solid var(--cs-border) !important;
         border-radius: var(--borderRadiusContainer);
         padding: 20px 24px;
         padding-right: 150px; /* room for the pinned "Apply now" */
         transition: background 0.18s ease;
   }
   .ashby-job-posting-brief:hover {
         background: var(--cs-surface);
   }
 
   /* Title stays slate (the inner <a> inherits theme blue — override it) */
   .ashby-job-posting-brief-title,
   .ashby-job-posting-brief-title a {
         color: var(--cs-ink) !important;
         font-weight: 600;
         font-size: 18px;
         letter-spacing: -0.01em;
   }
 
   .ashby-job-posting-brief-details {
         color: var(--cs-muted);
         font-size: 14px;
         margin-top: 4px;
   }
 
   /* "Apply now →" pinned right, vertically centred */
   .ashby-job-posting-brief::after {
         content: "Apply now →";
         position: absolute;
         top: 50%;
         right: 24px;
         transform: translateY(-50%);
         font-size: 16px;
         font-weight: 600;
         color: var(--cs-blue);
   }
 
   /* ---- Filters / reset / back buttons ---- */
   .ashby-job-board-filter,
   .ashby-job-board-filters-label,
   .ashby-job-board-reset-filters-label,
   .ashby-job-board-back-to-all-jobs-button {
         color: var(--cs-blue);
   }
 
   /* ---- Job posting detail page ---- */
   .ashby-job-posting-heading {
         font-weight: 600;
         font-size: 28px;
         letter-spacing: -0.02em;
         color: var(--cs-ink);
   }
 
   /* ---- Application form ---- */
   .ashby-application-form-section-header-title {
         font-weight: 600;
         color: var(--cs-ink);
   }
   .ashby-application-form-question-title {
         font-weight: 500;
         color: var(--cs-ink);
   }
 
   /* Résumé autofill box — brand the icon + container */
   .ashby-application-form-autofill-input-root {
         border-radius: var(--borderRadiusControl);
   }
   .ashby-application-form-autofill-input-icon {
         color: var(--cs-blue);
   }
 
   .ashby-application-form-submit-button {
         background: var(--cs-blue);
         border-color: var(--cs-blue);
         color: #ffffff;
         font-weight: 600;
         border-radius: var(--borderRadiusButton);
         transition: background 0.18s ease;
   }
   .ashby-application-form-submit-button:hover {
         background: var(--cs-blue-hover);
         border-color: var(--cs-blue-hover);
   }
   .ashby-job-posting-left-pane {
      background: #ffffff;
      border: 1px solid var(--cs-border);
      border-top: 1px solid var(--cs-border) !important;
      border-radius: var(--borderRadiusContainer) !important;
      box-shadow: none !important;
      padding: 28px;
      margin-right: 1.5em;
      height: fit-content;
      align-self: start;
   }
 
   /* ---- At-rule enhancements ---- */
 
   /* Small screens: stack "Apply now" under details with even padding all round */
   @media (max-width: 768px) {
         .ashby-job-board-heading { font-size: 24px; }
         .ashby-job-posting-heading { font-size: 24px; }
         .ashby-job-posting-brief {
                 padding: 20px; /* uniform → equal space above title and below "Apply now" */
                 padding-bottom: 30px;
         }
         .ashby-job-posting-brief::after {
                 position: static;
                 transform: none;
                 display: block;
                 margin-top: 15px;
         }
         .ashby-department-heading,
         .ashby-job-posting-brief-department-heading { 
            margin-top: 24px; margin-bottom: 0; 
         }
         .ashby-job-posting-left-pane {
            box-shadow: none !important;
         }
         .ashby-job-posting-left-pane {
            margin-right: 0;
         }
   }
 
   /* Subtle card entrance, echoing the careers-page fade-in */
   @keyframes cs-fade-in {
         from { opacity: 0; transform: translateY(6px); }
         to   { opacity: 1; transform: translateY(0); }
   }
   @media (prefers-reduced-motion: no-preference) {
         .ashby-job-posting-brief {
                 animation: cs-fade-in 0.4s ease both;
         }
   }