/* ============================================================
   LE MORITA — únete al equipo: vacantes y postulación
   Reutiliza la portada, los pasos y el formulario de servicios.css.
   ============================================================ */

.job-sec{ background:var(--paper); }

/* portada: la foto va sin arco y apoyada en el borde inferior de la sección */
.job-hero{ padding-bottom:0; align-items:end; }
.job-hero .srv-hero__text{ align-self:center; padding-bottom:clamp(3rem,7vw,6rem); }
.job-hero .srv-hero__photo{ width:auto; justify-self:center; }
.job-hero .srv-hero__photo img{
  display:block;
  width:auto; height:auto;
  max-width:100%; max-height:min(680px,78vh);
  aspect-ratio:auto; object-fit:contain;
  border:0; border-radius:0; padding:0;
}

.jobs{ display:grid; }

.job{
  display:grid;
  grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
  gap:clamp(1.4rem,4vw,3.5rem);
  align-items:start;
  padding-top:clamp(2rem,4vw,3rem);
  border-bottom:1px solid var(--line);
  scroll-margin-top:calc(var(--nav-h) + 1rem);
}
.job:first-child{ padding-top:0; }
/* el texto deja aire abajo; la foto baja hasta el separador */
.job__body{ align-self:center; padding-bottom:clamp(2rem,4vw,3rem); }
.job:nth-child(even){ grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); }
.job:nth-child(even) > img{ order:2; }
/* recortes sin fondo: se ven enteros, sin marco; arriba se funden y abajo
   se apoyan en el separador */
.job > img{
  display:block;
  width:auto; height:auto;
  max-width:100%; max-height:min(560px,70vh);
  justify-self:center; align-self:end;
  -webkit-mask-image:linear-gradient(0deg, #000 82%, transparent);
          mask-image:linear-gradient(0deg, #000 82%, transparent);
}

.job__area{ font-family:var(--sans); font-weight:500; font-size:.8rem; letter-spacing:.24em; text-transform:uppercase; line-height:1.3; color:var(--gold-ink, #8A5F06); }
.job__title{ font-family:var(--display); font-weight:400; font-size:clamp(1.8rem,3.4vw,2.6rem); line-height:1.1; margin:.3rem 0 1rem; }
.job__lead{ color:var(--muted); max-width:58ch; text-wrap:pretty; }
.job h4{
  font-family:var(--sans); font-weight:500;
  font-size:.78rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--navy); margin:1.6rem 0 .6rem;
}
.job ul{ margin:0; padding:0; list-style:none; display:grid; gap:.45rem; max-width:60ch; }
.job li{ position:relative; padding-left:1.3rem; color:var(--muted); font-size:.95rem; line-height:1.5; }
.job li::before{
  content:""; position:absolute; left:0; top:.6em;
  width:.45rem; height:.45rem; border-radius:50%;
  background:var(--gold);
}
.job__cta{ margin-top:1.8rem; }

.job-apply{ background:var(--cream); }
.job-apply .srv-head__lead a{ color:var(--gold-ink, #8A5F06); text-decoration:underline; text-underline-offset:3px; word-break:break-word; }
.job-apply .event-form{ margin-top:0; background:var(--paper); max-width:900px; }

/* ---------- hoja de vida ---------- */
.hv{ grid-column:span 3; }
.hv__input{ position:absolute; width:1px; height:1px; opacity:0; }
.hv__box{
  display:flex; align-items:center; gap:.4rem 1rem; flex-wrap:wrap;
  min-height:3.1rem; padding:.7rem 1rem;
  border:1px dashed rgba(176,121,8,.7); border-radius:8px;
  background:var(--cream); color:var(--navy);
  cursor:pointer; transition:background .2s ease, border-color .2s ease;
}
.hv__box svg{ width:1.25rem; height:1.25rem; flex:none; fill:none; stroke:var(--gold); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.hv__name{ font-weight:500; overflow-wrap:anywhere; }
.hv__box small{ color:var(--muted); font-size:.8rem; }
.hv:hover .hv__box{ background:var(--blush); }
.hv__input:focus-visible + .hv__box{ outline:2px solid var(--gold); outline-offset:3px; }
.hv__input.is-invalid + .hv__box{ border-color:#B3261E; }
.hv.is-lista .hv__box{ border-style:solid; }
.hv__trap{ position:absolute; left:-9999px; }

.job-form__status{ margin-top:1rem; font-size:.92rem; color:var(--muted); }
.job-form__status:empty{ display:none; }
.job-form__status.is-error{ color:#B3261E; }
.job-form button[disabled]{ opacity:.6; cursor:progress; }
.job-gracias{ text-align:center; padding:clamp(1rem,3vw,2rem) 0; }
.job-gracias h3{ font-family:var(--display); font-weight:400; font-size:1.6rem; }
.job-gracias p{ color:var(--muted); margin-top:.5rem; }

@media (max-width:1000px){
  .hv{ grid-column:span 1; }
}

@media (max-width:760px){
  .job,
  .job:nth-child(even){ grid-template-columns:1fr; }
  /* en una columna la foto va al final para seguir apoyada en el separador */
  .job > img{ order:2; max-height:420px; }
  .job__body{ padding-bottom:1.6rem; }
  .job-hero{ padding-top:3.2rem; gap:1.6rem; }
  .job-hero .srv-hero__text{ padding-bottom:0; }
  .job-hero .srv-hero__photo{ order:0; }
  .job-hero .srv-hero__photo img{ max-height:440px; }
}