/* ==========================================================================
   Masera & Co — careers page additions to site.css (body.careers-page.v2):
   page-head caption, the four advancement stages on one baseline, the
   requirement ledger, the application card and per-photo focal points.
   ========================================================================== */

/* Training imagery introduces the work and the advancement path. */
body.v2 .car-head .mc-pagehead-media img { object-position: 62% 40%; }

@media (max-width: 767px) {
  body.v2 .car-head .mc-actions .mc-link { margin-top: 12px; }
}

/* 01 Working here */
body.v2 .car-intro-split { margin-top: 32px; }
body.v2 .car-intro .mc-reasons { gap: 28px; }

@media (min-width: 1200px) {
  body.v2 .car-intro-split { align-items: stretch; }
  body.v2 .car-intro-plate { display: flex; }
  body.v2 .car-intro-plate .mc-frame { aspect-ratio: auto; flex: 1; min-height: 440px; }
}

/* 02 Structured advancement: four equal-top stages on one rule and baseline */
body.v2 .car-band img { object-position: 50% 30%; transform-origin: 70% 30%; }

body.v2 .car-path-body { padding-top: clamp(40px, 4vw, 64px); }
body.v2 .car-path .mc-statement { max-width: 22em; }

body.v2 .car-stairs .mc-role { display: block; margin-top: 18px; color: var(--mc-gold); }
body.v2 .car-stairs .mc-entry-text .mc-h3 { margin-top: 8px; }
body.v2 .car-stairs .mc-entry-text { padding-top: 28px; border-top-color: rgba(226, 183, 90, 0.45); }

body.v2 .car-stairs { align-items: start; }
body.v2 .car-stairs .mc-num { font-size: clamp(2.5rem, 3.5vw, 3.5rem); }

@media (max-width: 767px) {
  body.v2 .car-stairs .mc-entry-text .mc-num { grid-row: 1 / span 2; align-self: start; }
  body.v2 .car-stairs .mc-role { margin-top: 0; grid-column: 2; grid-row: 1; align-self: center; }
  body.v2 .car-stairs .mc-entry-text .mc-h3 { grid-column: 2; grid-row: 2; margin-top: 4px; }
}

/* 03 What this role requires */
body.v2 .car-req-lead { margin-top: clamp(24px, 2.6vw, 40px); }
body.v2 .car-standard { margin-top: clamp(36px, 4vw, 56px); padding-top: 24px; border-top: 1px solid var(--mc-hair); }
body.v2 .car-standard .mc-statement { margin-top: 14px; }
body.v2 .op-mentor { object-position: 46% 30%; }

@media (min-width: 1200px) {
  body.v2 .car-req .mc-split { align-items: center; }
  body.v2 .car-req-frame { aspect-ratio: 5 / 4; }
}

@media (max-width: 1199px) {
  body.v2 .car-req-frame { aspect-ratio: 3 / 2; }
}

/* Requirement ledger: the caps label carries the meaning, so give it body ink */
body.v2 .car-req .mc-ledger dd { color: var(--mc-body); }

@media (min-width: 768px) and (max-width: 1799px) {
  body.v2 .car-req .mc-ledger dd { font-size: 0.8125rem; }
}

@media (max-width: 767px) {
  body.v2 .car-req .mc-ledger dd { font-size: 0.75rem; }
}

/* 04 Questions */
@media (min-width: 1200px) {
  body.v2 .car-faq-side { position: sticky; top: 120px; }
}

/* 05 Apply */
body.v2 .car-apply-h3 { margin-top: clamp(40px, 4vw, 56px); }
body.v2 .car-apply-details { margin-top: clamp(32px, 3vw, 44px); }

body.v2 .car-form-card {
  padding: clamp(24px, 3vw, 48px);
  background: var(--mc-paper);
  border: 1px solid var(--mc-hair);
}

body.v2 .car-form-title { margin-bottom: 28px; }

body.v2 .car-form-submit {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px 24px;
}

@media (max-width: 767px) {
  body.v2 .car-form-card { padding: 24px 20px; }
  body.v2 .car-form-submit .mc-btn { width: 100%; justify-content: center; }
}

/* Focal points */
body.v2 .op-training { object-position: 60% 55%; }
