body{background:#fafafa;font-family:Arial,Helvetica,sans-serif;color:#111}.section-title{border-bottom:3px solid #d71920}
footer{background:#20252b;color:white;padding:30px;text-align:center;margin-top:50px}
@media(max-width:991px){.dropdown-menu-custom{position:static;width:100%;box-shadow:none}}

/* Ajuste de tarjetas: márgenes y posición */
#convocatorias{
    max-width: 1200px;
    margin: 20px auto 40px auto;
    padding: 0 20px;
}

/* Mejor distribución del contenido */
main{
    padding-left: 20px;
    padding-right: 20px;
}

@media(max-width:768px){
    #convocatorias{
        padding:0 10px;
    }
}

/* Ajuste de separación entre título y tarjetas */
#convocatorias{
    margin-top: 45px !important;
    padding-top: 10px;
}

/* Ajuste de separación entre título y tarjetas */
#convocatorias{
    margin-top: 15px !important;
    padding-top: 0 !important;
}

/* Corrección de espacio excesivo entre sección y tarjetas */
#convocatorias{
    margin-top: 5px !important;
    padding-top: 0 !important;
}

section{
    margin-bottom: 10px;
}

/* Corrección definitiva de posición de convocatorias */
#convocatorias {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Evita espacios heredados de bloques superiores */
main {
    padding-top: 0 !important;
}

section {
    margin-top: 0 !important;
}

*{box-sizing:border-box}
body{margin:0;font-family:Arial,sans-serif;background:#fafafa;color:#111}

.logo span{background:#d71920;color:#fff;border-radius:50%;width:50px;height:50px;display:flex;align-items:center;justify-content:center;margin-right:10px;font-size:30px}
.logo small{font-size:14px}

/* Antes este selector era solo "nav", así que alcanzaba a
   cualquier <nav> del sitio, incluidas las cajas de la barra
   lateral, y ponía su título y su lista en paralelo. */
.header-nav{display:flex;gap:22px;font-weight:bold;white-space:nowrap}
.home{max-width:1400px;margin:auto;padding:25px}
.layout{display:grid;grid-template-columns:1fr 300px;gap:25px}
.listado h1{margin:0;font-size:32px}
.linea{height:4px;background:#d71920;margin:8px 0 20px}
.cards-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.sidebar .box{background:#fff;border-radius:15px;padding:25px;margin-bottom:20px;min-height:150px}
@media(max-width:1000px){
nav{display:none}
.layout{grid-template-columns:1fr}
.cards-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:600px){
.top-menu{padding:10px;height:auto;flex-wrap:wrap}
.cards-grid{grid-template-columns:1fr}

}

#convocatorias{
 display:grid;
 grid-template-columns:repeat(3,1fr);
 gap:24px;
}

@media(max-width:900px){
 #convocatorias{grid-template-columns:repeat(2,1fr);}
}

@media(max-width:600px){
 #convocatorias{grid-template-columns:1fr;}
 .layout-convocatorias{padding:0 12px;}
}

@media(max-width:768px){
.search-main{
margin-top:15px;
}
}
@media(max-width:768px){
.cc-top,.cc-filters{flex-direction:column;}
.cc-search{width:100%;}
.cc-filters select,.cc-filters button{width:100%;}
}

.chamba-search input,

@media(max-width:600px){

.chamba-header-flotante select,

}@media(max-width:900px){.cc-floating-menu{flex-wrap:wrap}.cc-search{width:100%;flex-basis:100%}}@media(max-width:600px){.cc-floating-menu{flex-direction:column;align-items:stretch;margin:10px}.cc-floating-menu select,.cc-floating-menu button{width:100%}}

@media(max-width:768px){
.search-container,
.search-box,
.filtro-busqueda{
 flex-direction:column;
 padding:18px;
}
.search-container input,
.search-container select,
.search-container button,
.search-box input,
.search-box select,
.search-box button,
.filtro-busqueda input,
.filtro-busqueda select,
.filtro-busqueda button{
 width:100%;
 flex:auto;
}
}

.detalle-convocatoria,.detalle-publicidad .box{
background:#fff;
border-radius:20px;
padding:30px;
box-shadow:0 8px 25px rgba(0,0,0,.08);
}

.detalle-logo{
width:100px;
height:100px;
object-fit:contain;
}

@media(max-width:768px){
.detalle-layout{
grid-template-columns:1fr;
margin-top:80px;
padding:15px;
}

.detalle-info{
grid-template-columns:1fr;
}

.detalle-convocatoria{
padding:20px;
}
}

.detalle-wrapper{
max-width:1200px;
margin:100px auto 40px;
padding:20px;
display:grid;
grid-template-columns:minmax(0,2fr) 350px;
gap:25px;
}

.detalle-principal,.ads-box{
background:#fff;
border-radius:22px;
padding:30px;
box-shadow:0 8px 25px rgba(0,0,0,.08);
}

.detalle-logo{
width:100px;
height:100px;
object-fit:contain;
}

.detalle-datos{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:15px;
margin:25px 0;
}

.detalle-datos div{
background:#f7f7f7;
padding:15px;
border-radius:14px;
}

.detalle-datos strong{
display:block;
margin-top:5px;
}

@media(max-width:768px){
.detalle-wrapper{
grid-template-columns:1fr;
margin-top:80px;
padding:15px;
}

.detalle-empresa{
flex-direction:column;
text-align:center;
}

.detalle-datos{
grid-template-columns:1fr;
}

.detalle-principal,.ads-box{
padding:20px;
}
}

.detalle-grid{
max-width:1200px;
margin:auto;
padding:20px;
display:grid;
grid-template-columns:2fr 350px;
gap:25px;
}

.detalle-logo{
width:100px;
height:100px;
object-fit:contain;
}

@media(max-width:768px){
.chamba-menu-detalle{
flex-direction:column;
text-align:center;
}

.detalle-grid{
grid-template-columns:1fr;
padding:15px;
}

.datos-grid{
grid-template-columns:1fr;
}

.empresa-card{
flex-direction:column;
text-align:center;
}
}
.btn-postular{
display:block;
text-align:center;
background:#e51b23;
color:white;
padding:16px;
border-radius:12px;
text-decoration:none;
font-weight:bold;
}
@media(max-width:768px){
.detalle-navbar{
flex-direction:column;
text-align:center;
}
.detalle-container{
grid-template-columns:1fr;
padding:15px;
}
.cabecera-trabajo{
flex-direction:column;
text-align:center;
}
.info-grid{
grid-template-columns:1fr;
}
}

/* ---------- Añadidos de la corrección ---------- */

.contador{color:#777;font-size:14px;margin:4px 0 10px;}

.sin-resultados{
  grid-column:1 / -1;
  padding:40px 20px;
  text-align:center;
  color:#777;
  background:#fafafa;
  border:1px dashed #ddd;
  border-radius:12px;
}

.etiqueta-estado{
  display:inline-block;
  padding:3px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
}
.etiqueta-estado.estado-activo{background:#e9f7ee;color:#14602f;}
.etiqueta-estado.estado-cerrado{background:#fdecec;color:#8f1d1d;}
.convocatoria-card.card-cerrada{opacity:.72;}

.fechas-convocatoria{
  display:flex;gap:24px;flex-wrap:wrap;
  margin:18px 0;padding:14px 0;
  border-top:1px solid #eee;border-bottom:1px solid #eee;
  font-size:14px;color:#666;
}
.fechas-convocatoria strong{margin-left:6px;color:#222;}

.contenido ul{margin:0 0 18px 20px;padding:0;}
.contenido li{margin-bottom:8px;line-height:1.55;}
.sin-link{color:#888;font-style:italic;margin-top:20px;}

.visually-hidden{
  position:absolute!important;width:1px;height:1px;
  padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0;
}

a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{
  outline:2px solid #e31e24;
  outline-offset:2px;
}

/* ============================================================
   TARJETA DE CONVOCATORIA - definición única

   Sustituye a las siete definiciones anteriores de
   .convocatoria-card, que se contradecían entre sí. La causa de
   que el botón no se viera era "height:520px" junto con
   "overflow:hidden": el contenido superaba esa altura y el
   navegador recortaba lo que sobraba, que era justo el botón.

   Ahora la altura la fija la fila de la grilla y el botón se
   ancla abajo con margin-top:auto, de modo que todas las
   tarjetas de una fila quedan parejas sin recortar nada.
   ============================================================ */

.cards-grid{
  align-items:stretch;
}

.card-wrapper{
  display:flex;
}

.convocatoria-card{
  display:flex;
  flex-direction:column;
  width:100%;
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:14px;
  padding:18px;
  box-shadow:0 3px 10px rgba(0,0,0,.06);
  transition:box-shadow .2s ease,border-color .2s ease;
}

.convocatoria-card:hover{
  border-color:#d1d5db;
  box-shadow:0 6px 18px rgba(0,0,0,.10);
}

.convocatoria-card.card-cerrada{opacity:.72;}

/* ---------- Cabecera ---------- */

.card-header{
  display:flex;
  align-items:center;
  gap:14px;
  padding-bottom:14px;
  margin-bottom:14px;
  border-bottom:1px solid #f0f0f0;
}

.empresa-logo{
  width:56px;
  height:56px;
  flex:0 0 56px;
  object-fit:contain;
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:10px;
  padding:4px;
  box-sizing:border-box;
}

.card-header h3{
  margin:0;
  font-size:13px;
  font-weight:700;
  color:#6b7280;
  text-transform:none;
}

/* El título se recorta a tres líneas para que las cabeceras
   de una misma fila tengan alturas parecidas. */
.card-header h4{
  margin:4px 0 0;
  font-size:16px;
  font-weight:700;
  line-height:1.3;
  color:#111;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

/* ---------- Cuerpo ---------- */

.convocatoria-card p{
  margin:0 0 8px;
  font-size:14px;
  line-height:1.5;
  color:#374151;
}

.etiqueta-estado{
  display:inline-block;
  padding:3px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
}

.etiqueta-estado.estado-activo{background:#e9f7ee;color:#14602f;}
.etiqueta-estado.estado-cerrado{background:#fdecec;color:#8f1d1d;}

.salario{
  color:#d71920;
  font-weight:700;
}

/* Un salario sin monto no debe destacarse como si fuera una cifra */
.salario.salario-vacio{
  color:#6b7280;
  font-weight:400;
}

.descripcion{
  margin-top:10px;
  color:#6b7280;
  font-size:13.5px;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

/* ---------- Botón ---------- */

.btn-convocatoria{
  display:block;
  margin-top:auto;
  padding:11px;
  text-align:center;
  border:2px solid #d71920;
  border-radius:25px;
  color:#d71920;
  font-weight:700;
  font-size:14px;
  text-decoration:none;
  transition:background .2s ease,color .2s ease;
}

.btn-convocatoria:hover,
.btn-convocatoria:focus-visible{
  background:#d71920;
  color:#fff;
}

@media(max-width:600px){
  .card-header h4{-webkit-line-clamp:4;}
  .descripcion{-webkit-line-clamp:4;}
}

/* ---------- Cabecera compartida ---------- */

.chamba-header-flotante 

/* En pantallas pequeñas los controles se ocultan hasta pulsar ☰ */
@media(max-width:900px){
  
  
  .chamba-header-flotante.menu-abierto .chamba-search,
  .chamba-header-flotante.menu-abierto select,
  .chamba-header-flotante.menu-abierto 
  .chamba-header-flotante.menu-abierto 
}

/* ============================================================
   MENÚ FLOTANTE - definición única

   Sustituye a las ocho definiciones anteriores, que se
   contradecían. La última fijaba height:72px !important sin
   permitir envolver, así que al abrir el buscador en móvil los
   controles se salían de la pantalla en lugar de apilarse.

   Los mismos controles aparecen en el index y en las páginas de
   convocatoria. Buscar desde cualquiera lleva al listado con
   los filtros puestos en la URL.
   ============================================================ */

.chamba-header-flotante{
  position:sticky;
  top:15px;
  z-index:1000;
  max-width:1250px;
  margin:20px auto;
  padding:14px 20px;
  background:#fff;
  border-radius:24px;
  box-shadow:0 8px 25px rgba(0,0,0,.08);
  display:flex;
  align-items:center;
  gap:12px;
}

.chamba-brand{
  display:flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
  color:inherit;
  white-space:nowrap;
}

.chamba-logo{
  width:40px;
  height:40px;
  flex:0 0 40px;
  border-radius:50%;
  background:#d71920;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  font-size:21px;
}

.chamba-nombre strong{display:block;font-size:17px;line-height:1.15;}
/* Se limita al nombre: si se aplica a todos los <span> de la
   marca, la letra del logo queda roja sobre fondo rojo. */
.chamba-nombre span{display:block;font-size:14px;color:#d71920;font-weight:700;}

.chamba-search{
  flex:1 1 220px;
  min-width:170px;
}

/* El ancho se define aparte en cada uno: aplicar width:100% a los
   select los hacía acaparar el espacio y el campo de búsqueda se
   encogía hasta desaparecer. */
.chamba-search input,
.chamba-header-flotante select{
  height:44px;
  box-sizing:border-box;
  border:1px solid #e0e0e0;
  border-radius:22px;
  padding:0 16px;
  font-size:14px;
  font-family:inherit;
  background:#fff;
  color:#333;
}

.chamba-search input{width:100%;}

.chamba-header-flotante select{
  flex:0 1 165px;
  min-width:130px;
  width:auto;
  appearance:none;
  -webkit-appearance:none;
  padding-right:38px;
  cursor:pointer;
  background-image:
    linear-gradient(45deg,transparent 50%,#888 50%),
    linear-gradient(135deg,#888 50%,transparent 50%);
  background-position:calc(100% - 20px) 19px,calc(100% - 14px) 19px;
  background-size:6px 6px;
  background-repeat:no-repeat;
}

.chamba-search input:hover,
.chamba-header-flotante select:hover{border-color:#c4c4c4;}

.chamba-search input:focus,
.chamba-header-flotante select:focus{
  outline:none;
  border-color:#d71920;
  box-shadow:0 0 0 3px rgba(215,25,32,.12);
}

.btn-buscar{
  height:44px;
  flex:0 0 auto;
  border:0;
  border-radius:22px;
  background:#d71920;
  color:#fff;
  padding:0 26px;
  font-size:14px;
  font-weight:700;
  cursor:pointer;
  transition:background .2s ease;
}
.btn-buscar:hover{background:#b31419;}

.mobile-toggle-chamba{
  display:none;
  width:42px;
  height:42px;
  flex:0 0 42px;
  border:1px solid #e0e0e0;
  border-radius:12px;
  background:#fff;
  font-size:19px;
  cursor:pointer;
  color:#333;
}
.mobile-toggle-chamba:hover{border-color:#d71920;color:#d71920;}

/* ---------- Pantallas medianas y pequeñas ----------
   Los controles se ocultan tras el botón ☰ y, al abrirse,
   ocupan una fila completa cada uno. */

@media(max-width:960px){
  .chamba-header-flotante{
    flex-wrap:wrap;
    row-gap:10px;
    margin:12px;
    padding:12px 14px;
  }

  .mobile-toggle-chamba{display:block;order:2;margin-left:auto;}
  .chamba-brand{order:1;}

  .chamba-header-flotante .chamba-search,
  .chamba-header-flotante select,
  .chamba-header-flotante .btn-buscar{
    display:none;
    order:3;
  }

  .chamba-header-flotante.menu-abierto .chamba-search,
  .chamba-header-flotante.menu-abierto select,
  .chamba-header-flotante.menu-abierto .btn-buscar{
    display:block;
    flex:1 1 100%;
    width:100%;
    min-width:0;
  }
}

/* Convocatoria guardada cuya página aún no se ha generado */
.btn-convocatoria.btn-sin-pagina{
  border-color:#d9dce1;
  color:#9aa0a6;
  cursor:not-allowed;
}
.btn-convocatoria.btn-sin-pagina:hover{
  background:transparent;
  color:#9aa0a6;
}

/* ============================================================
   Añadidos de la versión de producción
   ============================================================ */

/* Enlace para saltar directamente al contenido, útil con teclado
   y lectores de pantalla. Solo se ve al recibir el foco. */
.saltar-contenido{
  position:absolute;left:-9999px;top:0;z-index:2000;
  background:#d71920;color:#fff;padding:12px 20px;
  border-radius:0 0 10px 0;font-weight:700;text-decoration:none;
}
.saltar-contenido:focus{left:0;}

.intro-listado{
  margin:6px 0 12px;color:#555;font-size:15px;max-width:70ch;line-height:1.55;
}

.card-titulo{
  margin:4px 0 0;font-size:16px;font-weight:700;line-height:1.3;color:#111;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}

.lista-enlaces{list-style:none;margin:0;padding:0;}
.lista-enlaces li{padding:7px 0;border-bottom:1px solid #f0f0f0;}
.lista-enlaces li:last-child{border-bottom:0;}
.lista-enlaces a{color:#333;text-decoration:none;font-size:14px;}
.lista-enlaces a:hover{color:#d71920;text-decoration:underline;}
.lista-enlaces .vacio{color:#9aa0a6;font-size:13px;}

.sidebar .box{display:block;}
.box h2{font-size:16px;margin:0 0 12px;}

/* ---------- Pie ---------- */

.pie-sitio{background:#fff;border-top:1px solid #e5e7eb;padding:38px 20px 26px;margin-top:50px;}
.pie-contenido{max-width:1250px;margin:0 auto;color:#6b7280;font-size:14px;}

.pie-columnas{
  display:grid;grid-template-columns:2fr 1fr 1fr;gap:30px;
  padding-bottom:24px;border-bottom:1px solid #eee;
}
.pie-columnas p{margin:0 0 6px;}
.pie-marca strong{color:#111;font-size:16px;}
.pie-titulo{font-size:14px;color:#111;margin:0 0 10px;}
.pie-columnas ul{list-style:none;margin:0;padding:0;}
.pie-columnas li{margin-bottom:7px;}
.pie-columnas a{color:#6b7280;text-decoration:none;}
.pie-columnas a:hover{color:#d71920;text-decoration:underline;}

.pie-nota{margin:20px 0 0;font-size:12.5px;color:#9aa0a6;line-height:1.6;max-width:85ch;}
.pie-copy{margin:16px 0 0;font-size:12.5px;color:#9aa0a6;}

@media(max-width:760px){
  .pie-columnas{grid-template-columns:1fr;gap:22px;}
}

/* ---------- Páginas de texto (legales, contacto, 404) ---------- */

.chamba-header-simple{justify-content:flex-start;gap:24px;}
.header-nav a{color:#374151;text-decoration:none;font-weight:600;font-size:14px;}
.header-nav a:hover{color:#d71920;}

.pagina-texto{
  max-width:820px;margin:0 auto 40px;padding:36px 26px;
  background:#fff;border:1px solid #e5e7eb;border-radius:16px;
}
.pagina-texto h1{font-size:28px;margin:0 0 18px;line-height:1.25;}
.pagina-texto h2{font-size:19px;margin:32px 0 12px;padding-bottom:7px;border-bottom:2px solid #d71920;display:inline-block;}
.pagina-texto p{line-height:1.7;color:#374151;margin:0 0 14px;max-width:72ch;}
.pagina-texto ul{margin:0 0 16px;padding-left:22px;}
.pagina-texto li{line-height:1.7;color:#374151;margin-bottom:9px;}
.pagina-texto a{color:#d71920;}
.fecha-actualizacion{color:#9aa0a6;font-size:13px;margin-bottom:26px;}
.btn-inline{display:inline-block;flex:none;margin:8px 0 20px;}

@media(max-width:760px){
  .pagina-texto{margin:0 12px 30px;padding:24px 18px;border-radius:14px;}
  .pagina-texto h1{font-size:23px;}
}

/* ---------- Formulario de contacto ---------- */

.formulario{margin-top:22px;}
.campo{margin-bottom:20px;}
.campo label{display:block;margin-bottom:7px;font-weight:600;color:#111;font-size:14px;}
.obligatorio{color:#d71920;}

.campo input,.campo select,.campo textarea{
  width:100%;box-sizing:border-box;padding:13px;
  border:1px solid #ddd;border-radius:12px;
  font-size:15px;font-family:inherit;background:#fff;color:#333;
}
.campo textarea{resize:vertical;min-height:150px;}
.campo input:focus,.campo select:focus,.campo textarea:focus{
  outline:none;border-color:#d71920;box-shadow:0 0 0 3px rgba(215,25,32,.12);
}
.campo .ayuda{display:block;margin-top:6px;color:#8a8a8a;font-size:12.5px;}

/* Trampa antispam: invisible, pero accesible para nadie.
   No se usa display:none porque algunos robots lo detectan. */
.campo-trampa{
  position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;
}

.btn-enviar{
  background:#d71920;color:#fff;border:0;border-radius:25px;
  padding:15px 34px;font-size:15px;font-weight:700;cursor:pointer;
  transition:background .2s ease;
}
.btn-enviar:hover{background:#b31419;}
.nota-formulario{margin-top:12px;font-size:12.5px;color:#9aa0a6;}

.aviso-contacto{
  padding:15px 18px;border-radius:12px;margin-bottom:22px;
  font-size:14px;line-height:1.5;
}
.aviso-contacto.aviso-ok{background:#e9f7ee;color:#14602f;border:1px solid #bfe6cd;}
.aviso-contacto.aviso-error{background:#fdecec;color:#8f1d1d;border:1px solid #f6c9c9;}

/* ---------- Espacios de anuncio ----------
   La altura se reserva aunque el anuncio no cargue. Sin esto el
   contenido salta al aparecer el anuncio, y ese salto penaliza
   la métrica CLS que mide Google. */

.zona-anuncio{display:flex;align-items:center;justify-content:center;overflow:hidden;}
.anuncio-superior{min-height:90px;max-width:1250px;margin:14px auto;padding:0 20px;}
.anuncio-lateral{min-height:250px;margin-bottom:20px;}

.anuncio-marcador{
  width:100%;min-height:inherit;
  display:flex;align-items:center;justify-content:center;
  background:#f4f5f7;border:1px dashed #d9dce1;border-radius:12px;
  color:#9aa0a6;font-size:13px;
}

@media(max-width:760px){
  .anuncio-superior{min-height:100px;padding:0 12px;}
}
