/* Shared Instrument typography and Switchouse colours. */
.recruitment-enquiry-layout { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: var(--space-16); align-items: center; }
.recruitment-candidate { margin: 0; border: 1px solid var(--line); border-radius: var(--radius-panel); background: #fff; overflow: hidden; }
.recruitment-candidate figcaption { display: flex; justify-content: space-between; gap: var(--space-3); padding: var(--space-4) var(--space-6); background: var(--soft); font-size: var(--type-meta); color: var(--muted); }
.recruitment-person { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); padding: var(--space-6) var(--space-6) var(--space-4); }
.recruitment-avatar { display: grid; place-items: center; width: 44px; height: 44px; background: var(--sage); border-radius: 50%; font-size: var(--type-label); color: var(--accent); }
.recruitment-person h3 { font-size: var(--type-title); }
.recruitment-person p { font-size: var(--type-label); margin-top: var(--space-1); }
.recruitment-status { color: var(--accent); font-size: var(--type-meta); }
.recruitment-person > .recruitment-status { margin-left: auto; }
.recruitment-facts { display: grid; grid-template-columns: 1fr; margin: 0 var(--space-6); }
.recruitment-facts > div { display: flex; justify-content: space-between; gap: var(--space-4); border-top: 1px solid var(--line); padding: 10px 0; font-size: var(--type-label); }
.recruitment-facts dt { color: var(--muted); }
.recruitment-facts dd { margin: 0; text-align: right; }
.recruitment-assessment { padding: var(--space-4); margin: var(--space-2) var(--space-6) 0; background: var(--soft); border-radius: var(--radius-control); }
.recruitment-assessment strong { font-size: var(--type-label); color: var(--accent); }
.recruitment-assessment p { font-size: var(--type-label); margin-top: 6px; }
.recruitment-source { font-size: var(--type-meta); line-height: 1.5; color: var(--muted); }
.recruitment-candidate > .recruitment-source { margin: var(--space-3) var(--space-6) 20px; }
.recruitment-example { border-top: 1px solid var(--line); }
.recruitment-example summary, .recruitment-more summary { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); cursor: pointer; list-style: none; min-height: 48px; font-size: var(--type-label); font-weight: 600; color: var(--accent); }
.recruitment-example summary { padding: var(--space-4) var(--space-6); }
.recruitment-example summary::-webkit-details-marker, .recruitment-more summary::-webkit-details-marker { display: none; }
.recruitment-example[open] summary > span, .recruitment-more[open] summary > span { transform: rotate(45deg); }
.recruitment-example > div { padding: 0 var(--space-6) var(--space-6); }
.recruitment-example h4 { margin: var(--space-3) 0 var(--space-2); font-size: var(--type-lead); }
.recruitment-example p { font-size: var(--type-label); margin-top: var(--space-2); }
.recruitment-example .recruitment-source { font-size: var(--type-meta); }
.recruitment-next { display: flex; justify-content: space-between; gap: var(--space-4); padding: var(--space-4) var(--space-6); border-top: 1px solid var(--line); color: var(--accent); font-size: var(--type-label); }
.recruitment-ad-examples img { width: 100%; border-radius: var(--radius-control); }
.recruitment-caption { margin-top: var(--space-4); font-size: var(--type-meta); line-height: 1.5; color: var(--muted); }
.recruitment-more { margin-top: var(--space-4); border-top: 1px solid var(--line); }
.recruitment-extra-ads { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); margin-top: var(--space-3); }
.recruitment-screening { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-8); margin-top: 0; }
.recruitment-enquiry { background: var(--accent); }
.recruitment-enquiry-copy { color: #fff; }
.recruitment-enquiry-copy .section-label { color: #c5ddcc; }
.recruitment-enquiry-copy .lead { color: #c7dacc; }
.inner-site .recruitment-enquiry-copy .text-link { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.recruitment-enquiry-layout { align-items: start; }
.recruitment-form { padding: var(--space-8); background: var(--soft); border: 1px solid var(--line); border-radius: var(--radius-panel); }
.recruitment-form h3 { font-size: var(--type-title); margin-bottom: var(--space-6); }
.recruitment-form label { display: block; font-size: var(--type-label); font-weight: 600; }
.recruitment-form > label, .recruitment-form-row { margin-top: var(--space-4); }
.recruitment-form input, .recruitment-form select, .recruitment-form textarea { display: block; width: 100%; min-width: 0; min-height: 48px; padding: var(--space-3); margin-top: var(--space-2); border: 1px solid var(--line); border-radius: var(--radius-control); background: #fff; color: var(--ink); font: inherit; font-size: var(--type-body); font-weight: 400; }
.recruitment-form select { appearance: none; padding-right: 44px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Cpath d='m4 7 6 6 6-6' fill='none' stroke='%2354665d' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; background-size: 20px 20px; }
.recruitment-form-row { display: grid; grid-template-columns: 1.3fr 1fr; gap: var(--space-4); }
.recruitment-form .button { margin-top: var(--space-6); }
.recruitment-caption a { text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 1100px) {
  .recruitment-enquiry-layout { gap: var(--space-8); }
  .recruitment-form-row { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .recruitment-screening, .recruitment-enquiry-layout { grid-template-columns: 1fr; }
  .recruitment-candidate { width: 100%; max-width: 620px; }
}
@media (max-width: 420px) {
  .recruitment-person, .recruitment-candidate figcaption { padding-inline: var(--space-4); }
  .recruitment-person > .recruitment-status { width: 100%; margin: 0; }
  .recruitment-facts { margin-inline: var(--space-4); }
  .recruitment-assessment { margin-inline: var(--space-4); }
  .recruitment-facts > div { gap: var(--space-2); }
}

@media (max-width: 700px) { .recruitment-form { padding: var(--space-6); } }

.recruitment-hero-stories { width: 100%; max-width: 600px; margin: 0; }
.recruitment-hero-stories .product-story-gallery span { display: block; margin-top: var(--space-2); font-size: var(--type-label); color: var(--accent); }
.recruitment-hero-stories figcaption { margin-top: var(--space-4); font-size: var(--type-meta); line-height: 1.5; color: var(--muted); }

.recruitment-visual-label { margin-bottom: var(--space-4); font-size: var(--type-label); font-weight: 600; color: var(--ink); }
.recruitment-roles, .recruitment-launch { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-8); }
.recruitment-roles h3, .recruitment-launch h3, .recruitment-screening-context h3 { font-size: var(--type-title); line-height: 1.2; }
.recruitment-roles article > p:not(.section-label), .recruitment-launch p, .recruitment-screening-context > p:not(.section-label), .recruitment-handoff-note p { margin-top: var(--space-4); }
.recruitment-roles .section-label { margin-bottom: var(--space-3); }
.recruitment-role-heading { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: var(--space-8); align-items: center; margin-bottom: var(--space-8); }
.inner-page .recruitment-role-heading .section-intro { margin-bottom: 0; }
.recruitment-audience-note { border-left: 1px solid var(--line); padding-left: var(--space-8); }
.recruitment-audience-note strong { display: block; font-size: var(--type-hero); line-height: 1.1; font-weight: 600; letter-spacing: -.045em; color: var(--accent); }
.recruitment-audience-note h3 span { display: block; margin-top: var(--space-3); font-size: var(--type-body); line-height: 1.5; font-weight: 500; letter-spacing: normal; }
.recruitment-audience-note > p { margin-top: var(--space-1); font-size: var(--type-body); }
.recruitment-ad-examples.recruitment-more { border-top: 0; margin-top: var(--space-6); }
.recruitment-ad-examples > summary { width: fit-content; justify-content: flex-start; gap: var(--space-3); }
.recruitment-extra-ads figure { margin: 0; }
.recruitment-extra-ads figcaption { margin-top: var(--space-2); font-size: var(--type-label); color: var(--muted); }
.recruitment-screening { align-items: start; gap: var(--space-16); }
.recruitment-screening-context { max-width: 520px; }
.recruitment-handoff-note { margin-top: var(--space-8); padding-top: var(--space-8); border-top: 1px solid var(--line); }
.recruitment-example .recruitment-answers h4 { font-size: var(--type-label); margin-top: var(--space-4); }
.recruitment-launch { list-style: none; padding: 0; margin: 0; counter-reset: launch; }
.recruitment-launch-panel { background: var(--soft); border-radius: var(--radius-panel); padding: var(--space-8); }
.recruitment-launch li { counter-increment: launch; }
.recruitment-launch li::before { content: '0' counter(launch); display: block; color: var(--accent); margin-bottom: var(--space-4); font-size: var(--type-label); }
.recruitment-review-flow { margin-top: var(--space-4); color: var(--ink); }
.recruitment-form-options > div > label { margin-top: var(--space-4); }
@media (max-width: 1100px) { .recruitment-screening { gap: var(--space-8); } }
@media (max-width: 900px) {
  .recruitment-roles, .recruitment-launch { grid-template-columns: 1fr; gap: var(--space-6); }
  .recruitment-roles article + article, .recruitment-launch li + li { border-top: 1px solid var(--line); padding-top: var(--space-6); }
}
@media (max-width: 700px) { .recruitment-extra-ads { grid-template-columns: 1fr; } }

@media (max-width: 700px) {
  .recruitment-launch-panel { padding: var(--space-6); }
  .recruitment-role-heading { grid-template-columns: 1fr; gap: var(--space-6); }
  .recruitment-audience-note { padding: var(--space-6) 0 0; border-left: 0; border-top: 1px solid var(--line); }
}

.recruitment-form .recruitment-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.recruitment-submit-status { margin-top: var(--space-4); padding: var(--space-4); border-radius: var(--radius-control); background: var(--sage); color: var(--ink); font-size: var(--type-body); }
.recruitment-submit-status[data-state="error"] { background: #fff1ec; color: #813c29; }