/* =====================================================================
   Bantam Communications: Ashby job board custom CSS
   Source of truth: Bantam Brand Guide (Dialogue Theory, 06.23.25)
   Built against Ashby's documented ashby-* class names. Where Ashby
   exposes no ashby-* class, ARIA attributes or structure are used
   (marked "NO ASHBY CLASS"); re-check those if Ashby changes its markup.

   ASHBY UPLOAD RULE: every selector must START with an ashby-* class
   (or be :root). Element-only or bare pseudo-class rules such as
   "body" or ":focus-visible" are rejected on upload.

   Brand guide type map used below:
     Alliance No 2 = "Platt" (display)   Alliance No 1 = "Text"
     H1  Platt Semi Bold, line-height 96%      -> page headings
     H3  24px Text Bold, line-height 110%      -> department / section headings
     H4  20px Text Bold, line-height 120%      -> job card titles
     Preheading 14px Bold, line-height 96%     -> small labels
     Paragraph 16px Medium                     -> body copy

   Where bantamcommunications.com applies the brand differently from the
   guide, this file follows the WEBSITE (checked 10/23/26):
     - body copy is Regular weight, ~130% line height (guide: Medium, 120%)
     - buttons are flat yellow, Platt Bold, slant = last 11% of the width
       (guide: yellow gradient)
     - form fields get a light tint on focus (fields here are boxed,
       not underline-only, so they are easy to find)
     - small labels are uppercase Text Regular + a yellow "/" accent
       (guide: Bold preheading)
     - borders are solid Almost black; dividers are dashed
   ===================================================================== */


/* ---------------------------------------------------------------------
   1. FONTS: Alliance No 1 (text) + Alliance No 2 (display/headings)
   Loaded from the same Webflow CDN files bantamcommunications.com uses.
   CONFIRM the Alliance web license covers jobs.ashbyhq.com before
   shipping; if not, remove this block and the fallback stack applies.
   --------------------------------------------------------------------- */
@font-face {
  font-family: "Alliance No 1";
  src: url("https://cdn.prod.website-files.com/6843547118ad024cbc35b312/68437b5eab72d962ba90f02d_alliance-no-1-regular.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Alliance No 1";
  src: url("https://cdn.prod.website-files.com/6843547118ad024cbc35b312/68437b6eb7d511d345b7b00b_alliance-no-1-regular-italic.woff2") format("woff2");
  font-weight: 400; font-style: italic; font-display: swap;
}
@font-face {
  font-family: "Alliance No 1";
  src: url("https://cdn.prod.website-files.com/6843547118ad024cbc35b312/68437b4ce7979e7eb127eb0f_alliance-no-1-medium.woff2") format("woff2");
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Alliance No 1";
  src: url("https://cdn.prod.website-files.com/6843547118ad024cbc35b312/68437c0dd698b23bfcec6f19_alliance-no-1-medium-italic.woff2") format("woff2");
  font-weight: 500; font-style: italic; font-display: swap;
}
@font-face {
  font-family: "Alliance No 1";
  src: url("https://cdn.prod.website-files.com/6843547118ad024cbc35b312/68437b80cbd479f6d67013c9_alliance-no-1-semibold.woff2") format("woff2");
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Alliance No 1";
  src: url("https://cdn.prod.website-files.com/6843547118ad024cbc35b312/68437b101d33cfcad9958c7e_alliance-no-1-extrabold.woff2") format("woff2");
  font-weight: 700 800; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Alliance No 2";
  src: url("https://cdn.prod.website-files.com/6843547118ad024cbc35b312/68437bbad7b2f174148b8158_alliance-no-2-medium.woff2") format("woff2");
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Alliance No 2";
  src: url("https://cdn.prod.website-files.com/6843547118ad024cbc35b312/68437bcd86fbea7825f6e8ef_alliance-no-2-semibold.woff2") format("woff2");
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Alliance No 2";
  src: url("https://cdn.prod.website-files.com/6843547118ad024cbc35b312/68437b95ab28fd63a683d894_alliance-no-2-bold.woff2") format("woff2");
  font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Alliance No 2";
  src: url("https://cdn.prod.website-files.com/6843547118ad024cbc35b312/68437b9f1d33cfcad995ba25_alliance-no-2-extrabold.woff2") format("woff2");
  font-weight: 800; font-style: normal; font-display: swap;
}


/* ---------------------------------------------------------------------
   2. THEME VARIABLES
   Ashby's own variables first, then Bantam tokens used below.
   Note: --colorPrimary900/600 are also set in Ashby admin theme
   settings; the values here match what is set there today.
   --------------------------------------------------------------------- */
:root {
  /* Ashby variables */
  --colorAppBackground: #FFFFFF;
  --colorPrimary900: #121921;
  --colorPrimary600: #FCCF2A;
  /* --widthMaxContent / --widthMaxJobBoard left at Ashby's defaults */
  --borderRadiusContainer: 0px;
  --borderRadiusControl: 0px;
  --borderRadiusButton: 0px;
  --fontFamily: "Alliance No 1", "Helvetica Neue", Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji", sans-serif;

  /* Bantam brand tokens (from the brand guide) */
  --bantam-yellow: #FCCF2A;
  --bantam-black: #121921;      /* "Almost black" */
  --bantam-gray: #EDEDED;       /* card backgrounds */
  --bantam-white: #FFFFFF;

  /* Derived tints of Almost black (not new colors) */
  --bantam-black-80: rgba(18, 25, 33, 0.80);
  --bantam-black-65: rgba(18, 25, 33, 0.65);

  --bantam-font-text: "Alliance No 1", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --bantam-font-display: "Alliance No 2", "Alliance No 1", "Helvetica Neue", Helvetica, Arial, sans-serif;

  /* Body line height. Website uses ~1.3; brand guide says 1.2. */
  --bantam-body-line-height: 1.3;

  /* Website button slant: the last 11% of the button's width */
  --bantam-button-slant: polygon(0 0, 89% 0, 100% 100%, 0 100%);

  /* Website form fields: tint on focus (Almost black at 11%) */
  --bantam-field-focus: rgba(18, 25, 33, 0.11);
}


/* ---------------------------------------------------------------------
   3. GLOBAL
   --------------------------------------------------------------------- */
/* ACCESSIBILITY: keyboard focus ring. Ashby's default focus ring uses
   the brand yellow, which is only 1.5:1 against white and hard to see.
   These rules replace it with a 2px Almost black ring (17.7:1) on every
   control. (Ashby rejects a single global ":focus-visible" rule, so each
   control is listed.) */
.ashby-job-board-back-to-all-jobs-button:focus-visible,
.ashby-job-board-reset-filters-label:focus-visible,
.ashby-job-board-filter:focus-visible,
.ashby-job-posting-brief-list a:focus-visible,
.ashby-job-posting-right-pane a[role="tab"]:focus-visible,
.ashby-job-posting-right-pane [role="tabpanel"]:focus-visible,
.ashby-job-posting-description a:focus-visible,
.ashby-application-form-container a:focus-visible,
.ashby-application-form-autofill-input-base-layer button:focus-visible,
.ashby-application-form-input-file-dropzone-upload:focus-visible,
.ashby-application-form-input-file-item-delete:focus-visible,
.ashby-application-form-input-education-add:focus-visible,
.ashby-application-form-input-education-entry-delete:focus-visible,
.ashby-application-form-input-date-popup-header-button:focus-visible,
.ashby-application-form-input-yesno-option:focus-visible {
  outline: 2px solid var(--bantam-black) !important;
  outline-offset: 2px;
}

/* Bantam "A" accent: the A turned on its side (">"), pointing at the
   section it introduces. Brand guide, UI Components page. Used on
   department and form section headings only, so job titles below a
   department heading read as listings, not as more headings. */
.ashby-department-heading::before,
.ashby-job-posting-brief-department-heading::before,
.ashby-application-form-section-header-title::before {
  content: "";
  display: block; /* Ashby hides ::before on some headings by default */
  flex: 0 0 auto;
  width: 0.8em;
  height: 0.6em;
  background: var(--bantam-yellow);
  clip-path: polygon(0 0, 42% 0, 100% 50%, 42% 100%, 0 100%, 58% 50%);
  transform: none;
}

/* Small-label style from the website ("HOME /", "EMAIL /"): uppercase
   Alliance Text Regular 14px followed by a yellow slash */
.ashby-job-posting-left-pane h2::after { /* NO ASHBY CLASS: field labels */
  content: "";
  display: inline-block;
  width: 3px;
  height: 0.85em;
  margin-left: 8px;
  vertical-align: -0.05em;
  background: var(--bantam-yellow);
  transform: skewX(-20deg);
}


/* ---------------------------------------------------------------------
   4. JOB BOARD (listing page)
   --------------------------------------------------------------------- */
.ashby-job-board-heading {
  font-family: var(--bantam-font-display);
  font-size: 40px; /* H1 is 64px on the website; scaled down for a job board */
  font-weight: 600;
  line-height: 0.96;
  color: var(--bantam-black);
}

.ashby-job-board-heading-count {
  font-weight: 500;
  color: var(--bantam-black-65);
}

.ashby-job-board-filters-label { /* small label (website style) */
  font-size: 14px;
  font-weight: 400;
  line-height: 0.96;
  text-transform: uppercase;
  color: var(--bantam-black);
}

.ashby-job-board-reset-filters-label {
  color: var(--bantam-black);
  text-decoration: underline;
  text-decoration-color: var(--bantam-yellow);
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}

/* Filters: square boxes with an Almost black border */
.ashby-job-board-filter {
  border: 1px solid var(--bantam-black);
  border-radius: 0;
  background-color: var(--bantam-white);
  color: var(--bantam-black);
  font-family: var(--bantam-font-text);
}
.ashby-job-board-filter:hover,
.ashby-job-board-filter:focus {
  background-color: var(--bantam-field-focus);
}

/* Department heading (H3) with the Bantam "A" accent */
.ashby-department-heading,
.ashby-job-posting-brief-department-heading {
  font-family: var(--bantam-font-text);
  font-size: 24px;
  font-weight: 700;
  line-height: 1.1;
  color: var(--bantam-black);
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 12px;
}
.ashby-department-heading-level,
.ashby-job-posting-brief-department-heading-level {
  flex: 1 1 auto;
  width: auto;
}

/* Job cards: brand "text only card" (white, solid divider line);
   brand gray on hover */
.ashby-job-posting-brief {
  background: var(--bantam-white);
  border: none;
  border-left: 1px solid var(--bantam-black);
  border-radius: 0;
  /* Ashby bleeds the card 16px left; 16px left padding keeps the
     title aligned with the department heading above it */
  padding: 18px 20px 18px 16px;
  transition: background-color 150ms ease;
}
.ashby-job-posting-brief:hover {
  background: var(--bantam-gray);
}

/* Card title (H4). Yellow text on white fails contrast, so titles use
   Almost black; the yellow underline appears on hover. */
.ashby-job-posting-brief-title {
  font-family: var(--bantam-font-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.2;
  color: var(--bantam-black);
}
.ashby-job-posting-brief:hover .ashby-job-posting-brief-title {
  text-decoration: underline;
  text-decoration-color: var(--bantam-yellow);
  text-decoration-thickness: 3px;
  text-underline-offset: 4px;
}

.ashby-job-posting-brief-details {
  font-size: 14px;
  font-weight: 500;
  color: var(--bantam-black-80);
}

/* NO ASHBY CLASS: the link wrapping each job card, keyboard focus */


/* ---------------------------------------------------------------------
   5. JOB POSTING PAGE
   --------------------------------------------------------------------- */
.ashby-job-board-back-to-all-jobs-button {
  color: var(--bantam-black);
}
.ashby-job-board-back-to-all-jobs-button:hover {
  color: var(--bantam-black-65);
}
.ashby-job-board-back-to-all-jobs-button svg,
.ashby-job-board-back-to-all-jobs-button path {
  fill: currentColor; /* the arrow icon is filled yellow by default */
}

.ashby-job-posting-heading {
  font-family: var(--bantam-font-display);
  font-size: 40px;
  font-weight: 600;
  line-height: 0.96;
  color: var(--bantam-black);
}

/* Left pane: label / value pairs */
.ashby-job-posting-left-pane h2 { /* NO ASHBY CLASS: field labels (small label + slash, see section 3) */
  font-family: var(--bantam-font-text);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.2;
  text-transform: uppercase;
  color: var(--bantam-black);
}
.ashby-job-posting-left-pane p,
.ashby-job-posting-left-pane li {
  font-weight: 600;
  color: var(--bantam-black);
}
/* Dividers between the left-pane fields: dashed, like the website */
.ashby-job-posting-left-pane > div { /* NO ASHBY CLASS */
  border-color: var(--bantam-black);
  border-bottom-style: dashed;
}

/* Tabs: thin Almost black line across, yellow indicator, bold active tab */
.ashby-job-posting-right-pane nav[role="tablist"] { /* NO ASHBY CLASS */
  border-bottom: 1px solid var(--bantam-black);
}
.ashby-job-posting-right-pane-overview-tab,
.ashby-job-posting-right-pane-application-tab {
  color: var(--bantam-black);
  font-weight: 500;
}
.ashby-job-posting-right-pane a[role="tab"][aria-selected="true"] span {
  color: var(--bantam-black);
  font-weight: 700;
}
.ashby-job-posting-right-pane-tab-slider {
  background: var(--bantam-yellow);
  height: 3px;
  border-radius: 0;
}

/* Description body copy */
.ashby-job-posting-description {
  font-size: 16px;
  font-weight: 400;
  line-height: var(--bantam-body-line-height);
  color: var(--bantam-black);
}
.ashby-job-posting-description h1,
.ashby-job-posting-description h2,
.ashby-job-posting-description h3 {
  font-family: var(--bantam-font-text);
  font-size: 24px;
  font-weight: 700;
  line-height: 1.1;
  color: var(--bantam-black);
  margin-top: 1.75em;
}
.ashby-job-posting-description strong {
  font-weight: 700;
  color: var(--bantam-black);
}
.ashby-job-posting-description a {
  color: var(--bantam-black);
  text-decoration: underline;
  text-decoration-color: var(--bantam-yellow);
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}
.ashby-job-posting-description li::marker {
  color: var(--bantam-black);
}


/* ---------------------------------------------------------------------
   6. PRIMARY BUTTONS: "Apply for this Job" + "Submit Application"
   Website style: flat yellow, Almost black Platt Bold text, slanted
   right edge (last 11% of the width), Almost black background with
   white text on hover. The slant is removed on keyboard focus so the
   focus ring is not clipped.
   --------------------------------------------------------------------- */
.ashby-job-posting-description-container button, /* NO ASHBY CLASS: Apply */
.ashby-application-form-submit-button {
  background: var(--bantam-yellow);
  color: var(--bantam-black);
  font-family: var(--bantam-font-display);
  font-weight: 700;
  font-size: 16px;
  border: none;
  border-radius: 0.1rem;
  box-shadow: none;
  clip-path: var(--bantam-button-slant);
  transition: background 250ms ease, color 250ms ease;
}
.ashby-job-posting-description-container button svg,
.ashby-application-form-submit-button svg {
  color: currentColor;
  fill: currentColor;
}
.ashby-job-posting-description-container button:hover,
.ashby-application-form-submit-button:hover {
  background: var(--bantam-black);
  color: var(--bantam-white);
}
.ashby-job-posting-description-container button:focus-visible,
.ashby-application-form-submit-button:focus-visible {
  clip-path: none;
  outline: 3px solid var(--bantam-black);
  outline-offset: 3px;
}
.ashby-application-form-submit-button:disabled,
.ashby-application-form-submit-button[aria-disabled="true"] {
  opacity: 0.6;
  cursor: not-allowed;
}


/* ---------------------------------------------------------------------
   7. APPLICATION FORM
   --------------------------------------------------------------------- */
.ashby-application-form-section-header-title {
  font-family: var(--bantam-font-text);
  font-size: 24px;
  font-weight: 700;
  line-height: 1.1;
  color: var(--bantam-black);
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 12px;
}
.ashby-application-form-section-header-description {
  color: var(--bantam-black-80);
  font-weight: 400;
  line-height: var(--bantam-body-line-height);
}

/* Question labels: Platt Bold, like the website's form labels */
.ashby-application-form-question-title {
  font-family: var(--bantam-font-display);
  font-weight: 700;
  color: var(--bantam-black);
}
.ashby-application-form-question-description {
  color: var(--bantam-black-65);
}

/* Text inputs, textareas, dropdowns, dates: square boxes with an
   Almost black border so they are easy to find; light tint on focus,
   like the website's Contact form */
.ashby-application-form-input-text,
.ashby-application-form-input-textarea,
.ashby-application-form-input-dropdown-select,
.ashby-application-form-input-date,
.ashby-application-form-input-autocomplete {
  border: 1px solid var(--bantam-black);
  border-radius: 0;
  background-color: var(--bantam-white);
  box-shadow: none;
  color: var(--bantam-black);
  font-family: var(--bantam-font-text);
}
/* Class repeated on purpose: Ashby's own focus rule (4px blue outline,
   yellow border) is more specific than a single class */
.ashby-application-form-input-text.ashby-application-form-input-text:focus,
.ashby-application-form-input-textarea.ashby-application-form-input-textarea:focus,
.ashby-application-form-input-dropdown-select.ashby-application-form-input-dropdown-select:focus,
.ashby-application-form-input-date.ashby-application-form-input-date:focus,
.ashby-application-form-input-autocomplete.ashby-application-form-input-autocomplete:focus {
  outline: none;
  background-color: var(--bantam-field-focus);
  /* ACCESSIBILITY: the tint alone is too faint (1.25:1), so the border
     also thickens to 3px (1px border + 2px inner line) on focus */
  box-shadow: inset 0 0 0 2px var(--bantam-black);
  /* Ashby forces a yellow focus border that outranks the rule above */
  border-color: var(--bantam-black) !important;
}
.ashby-application-form-input-text::placeholder,
.ashby-application-form-input-textarea::placeholder {
  color: var(--bantam-black-65);
}

/* Autofill-from-resume panel */
.ashby-application-form-autofill-input-root {
  background: var(--bantam-gray);
  border: none;
  border-radius: 0;
}
.ashby-application-form-autofill-input-title {
  font-family: var(--bantam-font-text);
  font-weight: 700;
  color: var(--bantam-black);
}
.ashby-application-form-autofill-input-description {
  color: var(--bantam-black-80);
}
.ashby-application-form-autofill-input-icon,
.ashby-application-form-autofill-input-icon * {
  color: var(--bantam-black);
  fill: currentColor;
}

/* Secondary buttons ("Upload file"): yellow text on white fails
   contrast, so outline in Almost black and fill yellow on hover */
.ashby-application-form-autofill-input-base-layer button, /* NO ASHBY CLASS */
.ashby-application-form-input-file-dropzone-upload,
.ashby-application-form-input-education-add {
  background: transparent;
  color: var(--bantam-black);
  border: 2px solid var(--bantam-black);
  border-radius: 0;
  box-shadow: none;
  font-weight: 700;
  transition: background 150ms ease;
}
.ashby-application-form-autofill-input-base-layer button svg,
.ashby-application-form-input-file-dropzone-upload svg {
  color: currentColor;
  fill: currentColor;
}
.ashby-application-form-autofill-input-base-layer button:hover,
.ashby-application-form-input-file-dropzone-upload:hover,
.ashby-application-form-input-education-add:hover {
  background: var(--bantam-yellow);
}

/* File drop zone (the dashed border lives on the outer file input) */
.ashby-application-form-input-file {
  border: 1px dashed var(--bantam-black);
  border-radius: 0;
}
.ashby-application-form-input-file-dropzone {
  border: none;
}
.ashby-application-form-input-file-dropzone-instructions {
  color: var(--bantam-black-80);
}

/* Yes / No toggles: square boxes with an Almost black border; yellow
   when selected */
.ashby-application-form-input-yesno {
  display: inline-flex;
  gap: 8px;
  border: none;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
}
.ashby-application-form-input-yesno-option {
  background: var(--bantam-white);
  border: 1px solid var(--bantam-black);
  border-radius: 0;
  box-shadow: none;
  color: var(--bantam-black);
  font-family: var(--bantam-font-display);
  font-weight: 700;
  min-width: 80px;
  transition: background 150ms ease;
}
.ashby-application-form-input-yesno-option:hover {
  background: var(--bantam-gray);
  color: var(--bantam-black);
}
/* ACCESSIBILITY: yellow vs white is only 1.5:1, so the selected answer
   also gets a thicker (3px) Almost black border; color is not the only
   cue (state cues need 3:1; this is 17.7:1) */
.ashby-application-form-input-yesno-option[aria-pressed="true"] {
  background: var(--bantam-yellow);
  color: var(--bantam-black);
  box-shadow: inset 0 0 0 2px var(--bantam-black);
}

/* Radio + checkbox groups */
/* Radios are custom-drawn: NO ASHBY CLASS on the ring (first span) or
   the dot (span inside it). Checked = Almost black ring, yellow dot,
   matching the checkbox (Almost black box, yellow check). */
.ashby-application-form-input-radio-group-option > span:first-child {
  border-color: var(--bantam-black);
}
.ashby-application-form-input-radio-group-option[data-checked] > span:first-child {
  background-color: var(--bantam-black);
  border-color: var(--bantam-black);
}
.ashby-application-form-input-radio-group-option[data-checked] > span:first-child > span {
  background-color: var(--bantam-yellow);
}
/* ACCESSIBILITY: the real radio/checkbox inputs are invisible, and
   Ashby's focus ring on the drawn ones is near-invisible, so show a
   clear ring on the drawn circle/box while its input has focus */
.ashby-application-form-input-radio-group-option > span:first-child:focus-within,
.ashby-application-form-input-checkbox-group-option-checkbox:focus-within {
  outline: 2px solid var(--bantam-black);
  outline-offset: 2px;
  border-color: var(--bantam-black) !important; /* Ashby turns it yellow */
}
.ashby-application-form-input-radio-group-option-label,
.ashby-application-form-input-checkbox-group-option-label {
  color: var(--bantam-black);
}
.ashby-application-form-input-checkbox-group-option-checkbox {
  border-color: var(--bantam-black);
  border-radius: 0;
}
.ashby-application-form-input-checkbox-group-option[data-checked] .ashby-application-form-input-checkbox-group-option-checkbox {
  background-color: var(--bantam-black);
  border-color: var(--bantam-black);
}

/* Autocomplete results */
.ashby-application-form-input-autocomplete-popup {
  border-radius: 0;
}
.ashby-application-form-input-autocomplete-popup-result[aria-selected="true"] {
  background: var(--bantam-gray);
  color: var(--bantam-black);
}

/* Other Ashby form pieces from the example file. These do not appear on
   the current posting, so they are styled lightly and still need a
   visual check if you add those question types. */
.ashby-application-form-input-dropdown-icon {
  color: var(--bantam-black);
}
.ashby-application-form-input-date-popup {
  border-radius: 0;
}
.ashby-application-form-input-date-popup-title {
  font-weight: 700;
  color: var(--bantam-black);
}
.ashby-application-form-input-date-popup-header-button {
  color: var(--bantam-black);
}
.ashby-application-form-input-file-item {
  border-radius: 0;
}
.ashby-application-form-input-file-item-name {
  color: var(--bantam-black);
}
.ashby-application-form-autofill-input-drag-layer[data-state="active"] {
  border: 1px dashed var(--bantam-black);
  border-radius: 0;
}

/* Success screen */
.ashby-application-form-success-container {
  font-family: var(--bantam-font-text);
  color: var(--bantam-black);
}


/* ---------------------------------------------------------------------
   8. RESPONSIVE + ACCESSIBILITY AT-RULES
   --------------------------------------------------------------------- */
@media (max-width: 640px) {
  .ashby-job-board-heading,
  .ashby-job-posting-heading {
    font-size: 30px;
  }
  .ashby-department-heading,
  .ashby-job-posting-brief-department-heading,
  .ashby-application-form-section-header-title,
  .ashby-job-posting-description h1,
  .ashby-job-posting-description h2,
  .ashby-job-posting-description h3 {
    font-size: 20px;
  }
  .ashby-job-posting-brief {
    padding: 16px 16px 16px 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ashby-job-posting-brief,
  .ashby-job-posting-description-container button,
  .ashby-application-form-submit-button,
  .ashby-application-form-input-file-dropzone-upload,
  .ashby-application-form-input-yesno-option {
    transition: none;
  }
}

@media (forced-colors: active) {
  /* Keep buttons rectangular and visible in Windows High Contrast */
  .ashby-job-posting-description-container button,
  .ashby-application-form-submit-button {
    clip-path: none;
    border: 2px solid ButtonText;
  }
  /* Background colors are dropped in high-contrast mode, so mark the
     selected Yes/No answer with a thick Highlight border */
  .ashby-application-form-input-yesno-option[aria-pressed="true"] {
    border: 4px solid Highlight;
  }
}