/* Release 3.10 — Hiring Framework four-stage visual hierarchy
   Approved direction: 12 Aug 2026, mock-up Image 2.
   Scope is visual hierarchy only. Existing evidence copy, anchors, CTAs and privacy wording remain unchanged. */

.hiring-framework-body{
  --hf-forest:#103C32;
  --hf-deep:#0B2F28;
  --hf-sage:#8FB79A;
  --hf-cream:#F7F2E8;
  --hf-ivory:#FCF8F1;
  --hf-gold:#B88A3B;
  --hf-blue:#A6B4FC;
  --hf-lavender:#E7E1F3;
  --hf-neutral:#EAE1D5;
  --hf-border:#D8D1C6;
}

.hiring-stage-grid{
  position:relative;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1.15rem;
  margin:3.9rem 0 3rem;
}

.hiring-stage-grid::before{
  content:"";
  position:absolute;
  z-index:0;
  top:2.1rem;
  left:7%;
  right:7%;
  height:2px;
  background:linear-gradient(90deg,
    rgba(16,60,50,.45),
    rgba(184,138,59,.5),
    rgba(166,180,252,.65),
    rgba(143,183,154,.6));
}

.hiring-stage-card{
  position:relative;
  z-index:1;
  min-height:225px;
  padding:4.3rem 1.5rem 1.7rem;
  border:1px solid rgba(16,60,50,.13);
  border-radius:1.15rem;
  box-shadow:0 14px 34px rgba(16,60,50,.07);
  color:var(--hf-deep);
}

.hiring-stage-card::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:6px;
  border-radius:0 0 1.15rem 1.15rem;
  background:var(--stage-accent);
}

.hiring-stage-card .stage-number{
  position:absolute;
  top:-1.25rem;
  left:1.25rem;
  display:grid;
  place-items:center;
  width:4.25rem;
  height:4.25rem;
  border-radius:999px;
  background:var(--stage-number-bg);
  border:1px solid rgba(16,60,50,.08);
  color:var(--stage-number-text);
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:2.05rem;
  line-height:1;
  box-shadow:0 8px 18px rgba(16,60,50,.08);
}

.hiring-stage-card .stage-icon{
  position:absolute;
  top:1.05rem;
  right:1.15rem;
  display:grid;
  place-items:center;
  width:3.6rem;
  height:3.6rem;
  border-radius:999px;
  background:var(--stage-icon-bg);
  color:var(--stage-icon-color);
}

.hiring-stage-card .stage-icon svg{
  width:2rem;
  height:2rem;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.hiring-stage-card small{
  display:block;
  margin-bottom:.75rem;
  color:var(--stage-label);
  font-size:.74rem;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.hiring-stage-card h3{
  margin:0;
  max-width:13ch;
  font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(1.7rem,2.2vw,2.25rem);
  line-height:1.02;
  color:var(--hf-forest);
}

.hiring-stage-card p{
  margin-top:1.15rem;
  max-width:22ch;
  color:#6F746D;
  font-size:.92rem;
  line-height:1.55;
}

.stage-ta{
  --stage-accent:#103C32;
  --stage-number-bg:rgba(143,183,154,.38);
  --stage-number-text:#103C32;
  --stage-icon-bg:rgba(143,183,154,.24);
  --stage-icon-color:#103C32;
  --stage-label:#103C32;
  background:linear-gradient(180deg,rgba(143,183,154,.28),rgba(252,248,241,.94));
}

.stage-manager{
  --stage-accent:#B88A3B;
  --stage-number-bg:rgba(184,138,59,.18);
  --stage-number-text:#103C32;
  --stage-icon-bg:rgba(184,138,59,.13);
  --stage-icon-color:#103C32;
  --stage-label:#103C32;
  background:linear-gradient(180deg,rgba(234,225,213,.62),rgba(252,248,241,.94));
}

.stage-team{
  --stage-accent:#A6B4FC;
  --stage-number-bg:rgba(166,180,252,.28);
  --stage-number-text:#103C32;
  --stage-icon-bg:rgba(231,225,243,.86);
  --stage-icon-color:#103C32;
  --stage-label:#103C32;
  background:linear-gradient(180deg,rgba(231,225,243,.84),rgba(252,248,241,.94));
}

.stage-offer{
  --stage-accent:#8FB79A;
  --stage-number-bg:rgba(16,60,50,.12);
  --stage-number-text:#103C32;
  --stage-icon-bg:rgba(143,183,154,.2);
  --stage-icon-color:#103C32;
  --stage-label:#103C32;
  background:linear-gradient(180deg,rgba(143,183,154,.22),rgba(252,248,241,.94));
}

@media(max-width:1050px){
  .hiring-stage-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:2.4rem 1rem;
  }
  .hiring-stage-grid::before{display:none}
  .hiring-stage-card{min-height:210px}
}

@media(max-width:560px){
  .hiring-stage-grid{
    grid-template-columns:1fr;
    gap:.8rem;
    margin:2.6rem 0 2.4rem;
  }
  .hiring-stage-card{
    min-height:0;
    padding:1.15rem 1rem 1.15rem 5.2rem;
    border-radius:1rem;
    box-shadow:0 8px 22px rgba(16,60,50,.055);
  }
  .hiring-stage-card::after{
    top:0;
    bottom:0;
    left:0;
    right:auto;
    width:5px;
    height:auto;
    border-radius:1rem 0 0 1rem;
  }
  .hiring-stage-card .stage-number{
    top:50%;
    left:1rem;
    width:3.2rem;
    height:3.2rem;
    transform:translateY(-50%);
    font-size:1.55rem;
    box-shadow:none;
  }
  .hiring-stage-card .stage-icon{
    position:static;
    display:inline-grid;
    width:2rem;
    height:2rem;
    margin:0 .45rem .35rem 0;
    vertical-align:middle;
  }
  .hiring-stage-card .stage-icon svg{width:1.2rem;height:1.2rem}
  .hiring-stage-card small{
    display:inline-block;
    margin:0 0 .35rem;
    vertical-align:middle;
    font-size:.64rem;
  }
  .hiring-stage-card h3{
    max-width:none;
    font-size:1.48rem;
    line-height:1.05;
  }
  .hiring-stage-card p{
    max-width:none;
    margin:.55rem 0 0;
    font-size:.86rem;
  }
}