/*
  CSS propio de esta página.

  En el sitio original iba embebido en el <head> de headhunting-medellin.html.
  Al migrar a WordPress solo se trasladaron las secciones, no estos
  estilos, y por eso la página se veía desordenada: la cabecera salía
  sin márgenes y las rejillas sin columnas.

  Se copia tal cual, con la paleta nueva aplicada.
*/
.svc-nav{ background:var(--verde); padding:.9rem 0; position:sticky; top:0; z-index:50; }
  .svc-nav-inner{ display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
  .svc-nav img{ height:34px; width:auto; }
  .svc-nav .btn{ padding:.6rem 1.2rem; font-size:.85rem; }
  .svc-hero{ background:var(--verde); color:var(--cream); padding:clamp(3rem,7vw,5.5rem) 0 clamp(3.4rem,7vw,5rem); }
  .svc-hero .kicker{ color:var(--oro); }
  .svc-hero h1{ font-size:clamp(2rem,5vw,3.3rem); color:var(--cream); margin-top:.7rem; max-width:20ch; line-height:1.06; }
  .svc-hero h1 em{ font-style:italic; color:var(--oro); }
  .svc-hero .lead{ margin-top:1.2rem; font-size:clamp(1rem,1.7vw,1.18rem); color:rgba(250, 249, 246,.8); max-width:58ch; }
  .svc-hero .acts{ margin-top:2rem; display:flex; gap:1rem; flex-wrap:wrap; }
  .svc-hero .reassure{ margin-top:1.1rem; font-size:.87rem; color:rgba(250, 249, 246,.62); }
  .breadcrumb{ font-size:.82rem; color:var(--ink-mute); margin-bottom:1.4rem; }
  .breadcrumb a{ color:var(--oro-deep); }
  .compara{ overflow-x:auto; border:1px solid var(--line); border-radius:14px; margin-top:1.6rem; }
  .compara table{ width:100%; border-collapse:collapse; background:#fff; min-width:520px; }
  .compara th{ text-align:left; font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--oro-deep);
               font-weight:700; padding:1rem 1.2rem; border-bottom:1px solid var(--line); background:var(--panel); }
  .compara td{ padding:1rem 1.2rem; border-bottom:1px solid rgba(102,102,102,.12); color:var(--ink-mute); font-size:.94rem; vertical-align:top; }
  .compara tr:last-child td{ border-bottom:0; }
  .compara td:first-child{ color:var(--verde); font-weight:500; }
  .fases{ display:grid; gap:1rem; margin-top:1.6rem; }
  @media (min-width:760px){ .fases{ grid-template-columns:repeat(3,1fr); } }
  .fase{ background:var(--verde-2); color:var(--cream); border-radius:14px; padding:1.5rem 1.6rem; }
  .fase .pct{ font-family:var(--font-display); font-size:2.4rem; color:var(--oro); line-height:1; }
  .fase h3{ font-family:var(--font-body); font-size:1.02rem; font-weight:600; color:var(--cream); margin:.6rem 0 .4rem; }
  .fase p{ font-size:.89rem; color:rgba(250, 249, 246,.72); margin:0; line-height:1.55; }
  .perfiles{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.5rem; }
  .perfiles span{ font-size:.86rem; padding:.5rem 1rem; border-radius:100px; background:var(--panel); color:var(--oro-deep); border:1px solid var(--line); }