/* =========================================================
   JOBAVENUE PWA 3.0 — MOTOR DE ENTRADAS LIMPIO
   NO reestructura el HTML interno del artículo.
   ========================================================= */

html.ja3-app-mode,
html.ja3-app-mode body{
  background:#f4f7fb!important;
}

html.ja3-app-mode body{
  padding-top:72px!important;
  padding-bottom:96px!important;
}

/* Solo modo PWA */
html.ja3-app-mode .site-header,
html.ja3-app-mode header#masthead,
html.ja3-app-mode .site-footer,
html.ja3-app-mode footer#colophon{
  display:none!important;
}

/* Eliminar navegación nativa duplicada */
html.ja3-app-mode .ja3-native-nav-hidden,
html.ja3-app-mode .ja3-original-official-hidden{
  display:none!important;
}

/* Topbar */
.ja3-topbar{
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:99990;
  height:72px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:10px 22px;
  background:rgba(255,255,255,.96);
  border-bottom:1px solid #e5eaf2;
  backdrop-filter:blur(12px);
}

.ja3-top-home{
  display:flex;
  align-items:center;
  gap:10px;
  color:#18233f!important;
  text-decoration:none!important;
}

.ja3-logo{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:13px;
  background:linear-gradient(135deg,#5e2bd1,#7b46ea);
  color:#fff;
  font-size:14px;
  font-weight:900;
}

.ja3-top-home b{
  display:block;
  font-size:14px;
  line-height:1.1;
}

.ja3-top-home small{
  display:block;
  margin-top:3px;
  color:#7b849a;
  font-size:10px;
}

.ja3-top-back{
  border:1px solid #dde3ee;
  background:#fff;
  color:#283550;
  border-radius:11px;
  padding:9px 13px;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
}

/* Layout exterior: el artículo entero es una pieza, no tocamos su interior */
.ja3-layout{
  width:min(1280px,calc(100% - 32px));
  margin:24px auto 0;
  display:grid;
  grid-template-columns:minmax(0,1fr) 300px;
  gap:22px;
  align-items:start;
}

html.ja3-app-mode .ja3-article{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin:0!important;
  background:#fff!important;
  border:1px solid #e5eaf2!important;
  border-radius:22px!important;
  box-shadow:0 10px 34px rgba(38,51,77,.07)!important;
  overflow:hidden!important;
}

/* Header/título original del post */
html.ja3-app-mode .ja3-article .entry-header,
html.ja3-app-mode .ja3-article .post-header{
  padding:24px 28px 0!important;
}

html.ja3-app-mode .ja3-article .entry-title{
  color:#14213d!important;
  font-size:clamp(26px,3vw,40px)!important;
  line-height:1.12!important;
  margin:0 0 12px!important;
}

/* Cuerpo original: NO se mueve, no se convierte en columnas */
html.ja3-app-mode .ja3-content{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  padding:26px 30px 34px!important;
  color:#24324d!important;
  font-size:16px!important;
  line-height:1.72!important;
  text-align:left!important;
  overflow:visible!important;
}

html.ja3-app-mode .ja3-content > *{
  max-width:100%!important;
}

html.ja3-app-mode .ja3-content p{
  color:#24324d!important;
  font-size:16px!important;
  line-height:1.72!important;
  margin:0 0 17px!important;
  text-align:left!important;
}

html.ja3-app-mode .ja3-content h2{
  margin:30px 0 12px!important;
  color:#10254b!important;
  font-size:24px!important;
  line-height:1.28!important;
}

html.ja3-app-mode .ja3-content h3{
  margin:24px 0 10px!important;
  color:#173765!important;
  font-size:20px!important;
  line-height:1.3!important;
}

html.ja3-app-mode .ja3-content ul,
html.ja3-app-mode .ja3-content ol{
  margin:10px 0 20px 22px!important;
  padding:0!important;
}

html.ja3-app-mode .ja3-content li{
  margin:6px 0!important;
  line-height:1.6!important;
}

/* =========================================================
   MEDIOS — REGLA SIMPLE Y SEGURA
   ========================================================= */

/* Base: ninguna imagen puede deformarse */
html.ja3-app-mode .ja3-content img{
  height:auto!important;
  object-fit:contain!important;
}

/* Ilustraciones, logos, camiones, banderas, paquetes, campanas, etc. */
html.ja3-app-mode .ja3-content img.ja3-art{
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:48px!important;
  max-height:48px!important;
  min-width:0!important;
  min-height:0!important;
  margin:12px auto 16px!important;
  padding:0!important;
  border:0!important;
  border-radius:8px!important;
  box-shadow:none!important;
  transform:none!important;
}

/* Fotografías reales */
html.ja3-app-mode .ja3-content img.ja3-photo{
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:520px!important;
  margin:18px auto!important;
  border-radius:14px!important;
  box-shadow:none!important;
}

/* Antes de clasificar, ninguna imagen puede convertirse en una pared enorme */
html.ja3-app-mode .ja3-content img:not(.ja3-photo):not(.ja3-art){
  max-width:160px!important;
  max-height:160px!important;
}

/* Figuras */
html.ja3-app-mode .ja3-content figure{
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  margin:14px auto!important;
}

html.ja3-app-mode .ja3-content figure.ja3-art-wrap{
  width:100%!important;
  max-width:100%!important;
  padding:0!important;
  text-align:center!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}

html.ja3-app-mode .ja3-content figure.ja3-art-wrap img{
  max-width:48px!important;
  max-height:48px!important;
}

/* SVG inline */
html.ja3-app-mode .ja3-content svg.ja3-inline-svg{
  display:block!important;
  width:38px!important;
  height:38px!important;
  max-width:38px!important;
  max-height:38px!important;
  margin:10px auto 14px!important;
}

/* Enlaces externos: visibles sin tocar sus padres */
html.ja3-app-mode .ja3-content a.ja3-external-link{
  color:#5f32ca!important;
  font-weight:800!important;
  text-decoration:underline!important;
  text-underline-offset:3px!important;
}

/* Aviso existente, solo estilizado */
html.ja3-app-mode .ja3-important-box{
  margin:22px 0!important;
  padding:18px 20px!important;
  background:#eef7ff!important;
  border:1px solid #a9d5ff!important;
  border-radius:15px!important;
  box-shadow:none!important;
}

html.ja3-app-mode .ja3-important-box h2,
html.ja3-app-mode .ja3-important-box h3,
html.ja3-app-mode .ja3-important-box h4{
  margin:0 0 7px!important;
  color:#0c407e!important;
}

html.ja3-app-mode .ja3-important-title{
  margin-top:24px!important;
  padding:14px 18px 6px!important;
  color:#0c407e!important;
  background:#eef7ff!important;
  border:1px solid #a9d5ff!important;
  border-bottom:0!important;
  border-radius:15px 15px 0 0!important;
}

html.ja3-app-mode .ja3-important-text{
  margin-top:0!important;
  padding:0 18px 15px!important;
  background:#eef7ff!important;
  border:1px solid #a9d5ff!important;
  border-top:0!important;
  border-radius:0 0 15px 15px!important;
}

/* Sidebar */
.ja3-sidebar{
  position:sticky;
  top:94px;
  display:flex;
  flex-direction:column;
  gap:14px;
}

.ja3-side-card{
  padding:18px;
  background:#0e2035;
  border:1px solid #183854;
  border-radius:18px;
  box-shadow:0 10px 28px rgba(14,32,53,.14);
  color:#fff;
}

.ja3-side-kicker{
  display:block;
  margin-bottom:6px;
  color:#42c7ff;
  font-size:9px;
  letter-spacing:.12em;
  font-weight:900;
}

.ja3-side-card h3{
  margin:0 0 14px;
  color:#fff;
  font-size:18px;
}

.ja3-facts{
  display:grid;
  gap:8px;
}

.ja3-facts > div{
  display:grid;
  grid-template-columns:26px 1fr;
  gap:3px 8px;
  align-items:center;
  padding:10px;
  background:#15304d;
  border-radius:12px;
}

.ja3-facts > div > span{
  grid-row:1/3;
  width:26px;
  height:26px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:#1f8ee6;
  color:#fff;
  font-size:12px;
  font-weight:900;
}

.ja3-facts b{
  color:#fff;
  font-size:11px;
}

.ja3-facts small{
  color:#bed0e1;
  font-size:10px;
  line-height:1.35;
}

.ja3-official{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  margin-top:14px;
  padding:11px 14px;
  border-radius:12px;
  background:linear-gradient(135deg,#ff7a18,#ff9f43);
  color:#fff!important;
  text-decoration:none!important;
  font-size:12px;
  font-weight:900;
}

.ja3-tags{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}

.ja3-tags span{
  padding:7px 9px;
  border-radius:999px;
  background:#173653;
  color:#cfe7f8;
  font-size:10px;
}

.ja3-side-note p{
  margin:0;
  color:#c7d7e7;
  font-size:11px;
  line-height:1.55;
}

/* Relacionados */
.ja3-related{
  margin:26px 0 0;
  padding:22px 0 0;
  border-top:1px solid #e5eaf2;
}

.ja3-related-head{
  margin-bottom:12px;
  color:#13264b;
  font-size:17px;
  font-weight:900;
}

.ja3-related-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}

.ja3-related-card{
  display:grid;
  grid-template-columns:72px minmax(0,1fr);
  gap:10px;
  align-items:center;
  padding:10px;
  background:#f8faff;
  border:1px solid #e2e8f2;
  border-radius:13px;
  text-decoration:none!important;
}

.ja3-related-card img,
.ja3-related-ph{
  width:72px!important;
  height:58px!important;
  max-width:72px!important;
  max-height:58px!important;
  object-fit:contain!important;
  border-radius:10px;
  background:#fff;
}

.ja3-related-card small{
  display:block;
  margin-bottom:3px;
  color:#6d3bd7;
  font-size:9px;
  font-weight:900;
}

.ja3-related-card b{
  display:block;
  color:#1c2943;
  font-size:11px;
  line-height:1.3;
}

/* Bottom nav */
.ja3-bottom-nav{
  position:fixed;
  left:50%;
  bottom:14px;
  transform:translateX(-50%);
  z-index:99995;
  width:min(620px,calc(100% - 28px));
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:6px;
  padding:7px;
  background:#102033;
  border:1px solid #1c3854;
  border-radius:19px;
  box-shadow:0 14px 34px rgba(11,28,45,.3);
}

.ja3-bottom-nav a,
.ja3-bottom-nav button{
  min-height:54px;
  border:0;
  border-radius:13px;
  background:transparent;
  color:#a9bbcc!important;
  text-decoration:none!important;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  cursor:pointer;
}

.ja3-bottom-nav a:first-child{
  background:#0d4d70;
  color:#fff!important;
}

.ja3-bottom-nav .active{
  color:#ff8c2b!important;
}

.ja3-bottom-nav span{
  font-size:17px;
  line-height:1;
}

.ja3-bottom-nav small{
  font-size:9px;
  font-weight:800;
}

/* Tablet */
@media(max-width:980px){
  .ja3-layout{
    grid-template-columns:1fr;
  }

  .ja3-sidebar{
    position:static;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

/* Mobile */
@media(max-width:650px){
  html.ja3-app-mode body{
    padding-top:64px!important;
    padding-bottom:90px!important;
  }

  .ja3-topbar{
    height:64px;
    padding:8px 12px;
  }

  .ja3-layout{
    width:calc(100% - 16px);
    margin-top:10px;
    gap:12px;
  }

  html.ja3-app-mode .ja3-article{
    border-radius:16px!important;
  }

  html.ja3-app-mode .ja3-article .entry-header,
  html.ja3-app-mode .ja3-article .post-header{
    padding:18px 17px 0!important;
  }

  html.ja3-app-mode .ja3-content{
    padding:18px 17px 24px!important;
    font-size:15px!important;
  }

  html.ja3-app-mode .ja3-content p{
    font-size:15px!important;
  }

  html.ja3-app-mode .ja3-content h2{
    font-size:21px!important;
  }

  html.ja3-app-mode .ja3-content h3{
    font-size:18px!important;
  }

  html.ja3-app-mode .ja3-content img.ja3-art,
  html.ja3-app-mode .ja3-content figure.ja3-art-wrap img{
    max-width:42px!important;
    max-height:42px!important;
  }

  html.ja3-app-mode .ja3-content svg.ja3-inline-svg{
    width:34px!important;
    height:34px!important;
    max-width:34px!important;
    max-height:34px!important;
  }

  .ja3-sidebar{
    grid-template-columns:1fr;
  }

  .ja3-related-grid{
    grid-template-columns:1fr;
  }

  .ja3-bottom-nav{
    bottom:8px;
    width:calc(100% - 16px);
  }
}


/* =========================================================
   JOBAVENUE 3.1 — ESTILO 5 MODERNO
   ========================================================= */

html.ja3-app-mode .ja31-hide-native-header{display:none!important}

/* Hero */
.ja31-modern-hero{margin:0!important;background:#fff}
.ja31-hero-media{
  position:relative;min-height:300px;display:flex;align-items:flex-end;
  background:linear-gradient(135deg,#142b50,#253e6d);
  background-size:cover!important;background-position:center!important;overflow:hidden
}
.ja31-hero-overlay{
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(8,22,45,.18),rgba(7,22,45,.9))
}
.ja31-hero-copy{position:relative;z-index:2;padding:38px 34px 30px;width:min(820px,100%)}
.ja31-kicker{
  display:inline-flex;padding:6px 10px;border-radius:999px;background:#ffb51f;
  color:#17233a;font-size:9px;font-weight:950;letter-spacing:.08em;text-transform:uppercase
}
.ja31-hero-copy h1{
  margin:12px 0 7px!important;color:#fff!important;
  font-size:clamp(30px,4vw,48px)!important;line-height:1.07!important;letter-spacing:-.03em!important
}
.ja31-hero-copy p{margin:0!important;color:#dce7f4!important;font-size:14px!important;font-weight:700!important}

.ja31-chips{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:#e5eaf2}
.ja31-chips>div{
  display:grid;grid-template-columns:38px 1fr;gap:2px 9px;align-items:center;
  padding:15px 18px;background:#fff;min-width:0
}
.ja31-chips span{
  grid-row:1/3;width:36px;height:36px;display:grid;place-items:center;
  border-radius:11px;background:#edf5ff;color:#1f83e5;font-size:17px;font-weight:900
}
.ja31-chips small{color:#8993a7;font-size:9px;font-weight:800}
.ja31-chips b{color:#17233a;font-size:11px;line-height:1.3;overflow-wrap:anywhere}

/* Sections */
html.ja3-app-mode .ja3-content .ja31-title{
  position:relative;margin-top:34px!important;padding:0 0 10px 46px!important;
  border-bottom:1px solid #e7edf4!important
}
html.ja3-app-mode .ja3-content .ja31-title::before{
  content:attr(data-ja-num);position:absolute;left:0;top:-2px;width:34px;height:34px;
  display:grid;place-items:center;border-radius:11px;
  background:linear-gradient(135deg,#1f83e5,#38a6ff);color:#fff;
  font-size:11px;font-weight:950;box-shadow:0 7px 14px rgba(31,131,229,.18)
}

/* Lists as modern cards */
html.ja3-app-mode .ja3-content ul.ja31-list{
  list-style:none!important;margin:16px 0 22px!important;padding:0!important;
  display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important
}
html.ja3-app-mode .ja3-content ul.ja31-list li{
  position:relative;margin:0!important;padding:14px 14px 14px 42px!important;
  background:#f7faff!important;border:1px solid #e4ebf5!important;border-radius:14px!important;
  color:#253553!important;font-size:13px!important;line-height:1.45!important
}
html.ja3-app-mode .ja3-content ul.ja31-list li::before{
  content:"✓";position:absolute;left:13px;top:13px;width:20px;height:20px;
  display:grid;place-items:center;border-radius:50%;background:#18aa78;color:#fff;
  font-size:10px;font-weight:950
}

/* Quote */
html.ja3-app-mode .ja3-content .ja31-quote{
  margin:24px 0!important;padding:20px 22px!important;
  border:0!important;border-left:4px solid #ffb51f!important;
  border-radius:14px!important;background:#fff8e8!important;color:#253553!important
}

/* Notice */
html.ja3-app-mode .ja3-important-box{
  position:relative!important;margin:24px 0!important;padding:20px 20px 20px 64px!important;
  background:linear-gradient(135deg,#edf7ff,#f8fbff)!important;
  border:1px solid #a9d6ff!important;border-radius:16px!important
}
html.ja3-app-mode .ja3-important-box::before{
  content:"!";position:absolute;left:18px;top:18px;width:32px;height:32px;
  display:grid;place-items:center;border-radius:10px;background:#1f8ee6;color:#fff;
  font-size:18px;font-weight:950
}

/* Footer CTA */
.ja31-footer-cta{
  margin:0 30px 30px;padding:22px 24px;
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:center;
  background:linear-gradient(135deg,#0d1f37,#15365c);
  border:1px solid #183f69;border-radius:18px;box-shadow:0 12px 28px rgba(11,31,55,.16);color:#fff
}
.ja31-footer-cta>div>span{display:block;margin-bottom:5px;color:#53c9ff;font-size:9px;letter-spacing:.12em;font-weight:950}
.ja31-footer-cta h3{margin:0 0 5px!important;color:#fff!important;font-size:20px!important}
.ja31-footer-cta p{margin:0!important;color:#bed2e8!important;font-size:12px!important;line-height:1.5!important}
.ja31-footer-cta>a{
  min-width:210px;min-height:48px;display:flex;align-items:center;justify-content:center;
  padding:11px 17px;border-radius:12px;background:linear-gradient(135deg,#ff7a18,#ffb51f);
  color:#fff!important;text-decoration:none!important;font-size:12px;font-weight:950
}

/* Sidebar aligned to Style 5 */
.ja3-side-card{
  background:linear-gradient(180deg,#0b1f36,#0e2a47)!important;
  border-color:#163d62!important
}
.ja3-side-kicker{color:#49d0ff!important}
.ja3-official{background:linear-gradient(135deg,#ff7a18,#ffb51f)!important}

/* Small safe icons */
html.ja3-app-mode .ja3-content img.ja3-art{max-width:44px!important;max-height:44px!important}
html.ja3-app-mode .ja3-content svg.ja3-inline-svg{
  width:34px!important;height:34px!important;max-width:34px!important;max-height:34px!important
}

@media(max-width:760px){
  .ja31-hero-media{min-height:230px}
  .ja31-hero-copy{padding:28px 20px 22px}
  .ja31-hero-copy h1{font-size:29px!important}
  .ja31-chips{grid-template-columns:1fr}
  html.ja3-app-mode .ja3-content ul.ja31-list{grid-template-columns:1fr!important}
  .ja31-footer-cta{grid-template-columns:1fr;margin:0 17px 22px;padding:18px}
  .ja31-footer-cta>a{width:100%;min-width:0}
}


/* =========================================================
   JOBAVENUE 3.2 — ICONOS NUEVOS PEQUEÑOS Y UNIFORMES
   ========================================================= */

/* Ocultar por completo los dibujos/iconos originales del cuerpo */
html.ja3-app-mode .ja3-content .ja32-original-icon-hidden,
html.ja3-app-mode .ja3-content img.ja3-art.ja32-original-icon-hidden,
html.ja3-app-mode .ja3-content svg.ja3-inline-svg.ja32-original-icon-hidden{
  display:none!important;
  width:0!important;
  height:0!important;
  max-width:0!important;
  max-height:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  overflow:hidden!important;
}

html.ja3-app-mode .ja3-content .ja32-original-icon-wrap-hidden{
  display:none!important;
  width:0!important;
  height:0!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
}

/* Rehacer títulos de sección: sin badge gigante */
html.ja3-app-mode .ja3-content .ja31-title.ja32-title-with-icon{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  padding:0 0 10px 0!important;
  min-height:36px!important;
}

/* Ocultar el número azul anterior solo en estos títulos */
html.ja3-app-mode .ja3-content .ja31-title.ja32-title-with-icon::before{
  display:none!important;
  content:none!important;
}

/* Icono nuevo, pequeño y perfectamente controlado */
html.ja3-app-mode .ja3-content .ja32-section-icon{
  flex:0 0 30px!important;
  width:30px!important;
  height:30px!important;
  max-width:30px!important;
  max-height:30px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:9px!important;
  background:#edf6ff!important;
  color:#1d82df!important;
  border:1px solid #d4e9fb!important;
  box-shadow:none!important;
  overflow:hidden!important;
}

html.ja3-app-mode .ja3-content .ja32-section-icon svg{
  display:block!important;
  width:16px!important;
  height:16px!important;
  max-width:16px!important;
  max-height:16px!important;
  min-width:16px!important;
  min-height:16px!important;
  margin:0!important;
  padding:0!important;
  stroke:currentColor!important;
}

/* Checks pequeños para listas, sin imágenes externas */
html.ja3-app-mode .ja3-content ul.ja31-list li::before{
  width:18px!important;
  height:18px!important;
  left:13px!important;
  top:14px!important;
  font-size:9px!important;
}

/* Aviso importante también con icono discreto */
html.ja3-app-mode .ja3-important-box::before{
  width:28px!important;
  height:28px!important;
  left:18px!important;
  top:18px!important;
  border-radius:8px!important;
  font-size:15px!important;
}

/* Protección extra:
   cualquier ilustración original no clasificada jamás supera 42px */
html.ja3-app-mode .ja3-content img:not(.ja3-photo){
  max-width:42px!important;
  max-height:42px!important;
}

/* Fotografías reales conservan el tamaño correcto */
html.ja3-app-mode .ja3-content img.ja3-photo{
  max-width:100%!important;
  max-height:520px!important;
}

/* Móvil: aún más pequeños */
@media(max-width:650px){
  html.ja3-app-mode .ja3-content .ja32-section-icon{
    flex-basis:28px!important;
    width:28px!important;
    height:28px!important;
    max-width:28px!important;
    max-height:28px!important;
  }

  html.ja3-app-mode .ja3-content .ja32-section-icon svg{
    width:15px!important;
    height:15px!important;
    max-width:15px!important;
    max-height:15px!important;
  }
}


/* =========================================================
   JOBAVENUE 3.3 — ESTILO 5 REAL, LIMPIO Y ORDENADO
   ========================================================= */

/* Quitar por completo emojis decorativos sueltos */
html.ja3-app-mode .ja3-content .ja33-decorative-emoji-hidden{
  display:none!important;
  width:0!important;
  height:0!important;
  max-width:0!important;
  max-height:0!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
}

/* Ya no usar el aspecto de lista original */
html.ja3-app-mode .ja3-content ul,
html.ja3-app-mode .ja3-content ol{
  list-style:none!important;
  margin-left:0!important;
  padding-left:0!important;
}

/* Tarjetas grandes por sección */
html.ja3-app-mode .ja3-content .ja33-section-card{
  position:relative!important;
  width:100%!important;
  max-width:100%!important;
  margin:18px 0!important;
  padding:22px!important;
  border:1px solid #e2eaf3!important;
  border-radius:18px!important;
  background:#fff!important;
  box-shadow:0 8px 24px rgba(29,52,83,.055)!important;
  overflow:hidden!important;
}

html.ja3-app-mode .ja3-content .ja33-card-blue{
  background:linear-gradient(135deg,#f7fbff,#edf6ff)!important;
  border-color:#d6e9fb!important;
}

html.ja3-app-mode .ja3-content .ja33-card-green{
  background:linear-gradient(135deg,#f7fffb,#ecf9f3)!important;
  border-color:#d4eee2!important;
}

html.ja3-app-mode .ja3-content .ja33-card-yellow{
  background:linear-gradient(135deg,#fffdf6,#fff6dd)!important;
  border-color:#f4e2ad!important;
}

html.ja3-app-mode .ja3-content .ja33-card-purple{
  background:linear-gradient(135deg,#fbf9ff,#f1edff)!important;
  border-color:#e1d8ff!important;
}

html.ja3-app-mode .ja3-content .ja33-card-neutral{
  background:linear-gradient(135deg,#fff,#f9fbfe)!important;
}

/* Títulos de cada tarjeta */
html.ja3-app-mode .ja3-content .ja33-section-card > h2{
  margin:0 0 16px!important;
  padding:0 0 12px!important;
  border-bottom:1px solid rgba(36,57,88,.11)!important;
  color:#10254b!important;
  font-size:22px!important;
}

/* Desactivar número/badge antiguo para no saturar */
html.ja3-app-mode .ja3-content .ja33-section-card > h2::before{
  display:none!important;
  content:none!important;
}

/* Mantener SOLO el icono nuevo pequeño del plugin */
html.ja3-app-mode .ja3-content .ja33-section-card .ja32-section-icon{
  flex:0 0 28px!important;
  width:28px!important;
  height:28px!important;
  max-width:28px!important;
  max-height:28px!important;
  border-radius:8px!important;
}

html.ja3-app-mode .ja3-content .ja33-section-card .ja32-section-icon svg{
  width:14px!important;
  height:14px!important;
  max-width:14px!important;
  max-height:14px!important;
}

/* Listas como filas compactas, no emojis separados */
html.ja3-app-mode .ja3-content .ja33-card-list{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:10px!important;
  margin:10px 0 0!important;
  padding:0!important;
}

html.ja3-app-mode .ja3-content .ja33-card-list > li,
html.ja3-app-mode .ja3-content li.ja33-clean-li{
  position:relative!important;
  min-height:46px!important;
  margin:0!important;
  padding:12px 14px 12px 42px!important;
  display:flex!important;
  align-items:center!important;
  background:rgba(255,255,255,.78)!important;
  border:1px solid rgba(35,67,103,.09)!important;
  border-radius:12px!important;
  color:#263956!important;
  font-size:13px!important;
  line-height:1.45!important;
}

/* Check propio: reemplaza fábrica, llave, lupa, caja, escoba, etc. */
html.ja3-app-mode .ja3-content .ja33-card-list > li::before,
html.ja3-app-mode .ja3-content li.ja33-clean-li::before{
  content:"✓"!important;
  position:absolute!important;
  left:13px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  width:20px!important;
  height:20px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:50%!important;
  background:#178bdc!important;
  color:#fff!important;
  font-size:10px!important;
  font-weight:950!important;
}

/* Nada dentro de un LI puede convertirse en icono gráfico gigante */
html.ja3-app-mode .ja3-content li img,
html.ja3-app-mode .ja3-content li svg:not(.ja32-section-icon svg){
  display:none!important;
}

/* Párrafos dentro de tarjetas */
html.ja3-app-mode .ja3-content .ja33-section-card > p{
  margin:0 0 14px!important;
  color:#40506a!important;
  font-size:14px!important;
  line-height:1.65!important;
}

/* Facts modernos entre hero y cuerpo */
.ja33-quick-facts{
  margin:20px 30px 4px;
  padding:0;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}

.ja33-quick-facts>div{
  display:grid;
  grid-template-columns:38px 1fr;
  gap:2px 9px;
  align-items:center;
  min-height:74px;
  padding:13px 15px;
  background:#f5faff;
  border:1px solid #dcecf9;
  border-radius:14px;
}

.ja33-quick-facts span{
  grid-row:1/3;
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:#e4f2ff;
  color:#178bdc;
  font-size:16px;
  font-weight:900;
}

.ja33-quick-facts small{
  color:#7c8a9e;
  font-size:9px;
  font-weight:800;
}

.ja33-quick-facts b{
  color:#142747;
  font-size:12px;
  line-height:1.3;
}

/* Evitar espacios grandes entre elementos */
html.ja3-app-mode .ja3-content .ja33-section-card > *:last-child{
  margin-bottom:0!important;
}

/* Mobile */
@media(max-width:700px){
  html.ja3-app-mode .ja3-content .ja33-section-card{
    padding:17px!important;
    margin:14px 0!important;
    border-radius:15px!important;
  }

  html.ja3-app-mode .ja3-content .ja33-section-card > h2{
    font-size:19px!important;
  }

  html.ja3-app-mode .ja3-content .ja33-card-list{
    grid-template-columns:1fr!important;
  }

  .ja33-quick-facts{
    margin:14px 17px 2px;
    grid-template-columns:1fr!important;
  }

  .ja33-quick-facts>div{
    min-height:62px;
  }
}


/* =========================================================
   JOBAVENUE 3.6 — SIDEBAR DERECHO ESTILO REFERENCIA
   ========================================================= */

.ja36-sidebar{
  position:sticky!important;
  top:94px!important;
  display:flex!important;
  flex-direction:column!important;
  gap:12px!important;
  min-width:0!important;
}

/* ---------------------------------
   En este artículo
   --------------------------------- */
.ja36-toc-card{
  padding:16px 16px 12px!important;
  background:linear-gradient(180deg,#0f3154 0%,#0b2845 100%)!important;
  border:1px solid #173f67!important;
  border-radius:10px!important;
  box-shadow:0 8px 22px rgba(10,37,65,.14)!important;
  color:#fff!important;
}

.ja36-toc-card h3{
  margin:0 0 8px!important;
  padding-bottom:10px!important;
  border-bottom:1px solid rgba(255,255,255,.18)!important;
  color:#fff!important;
  font-size:15px!important;
  line-height:1.2!important;
}

.ja36-toc-list{
  display:flex!important;
  flex-direction:column!important;
}

.ja36-toc-list a{
  display:grid!important;
  grid-template-columns:26px minmax(0,1fr)!important;
  gap:8px!important;
  align-items:center!important;
  min-height:39px!important;
  padding:7px 0!important;
  border-bottom:1px solid rgba(255,255,255,.10)!important;
  color:#fff!important;
  text-decoration:none!important;
}

.ja36-toc-list a:last-child{
  border-bottom:0!important;
}

.ja36-toc-list a>span{
  width:24px!important;
  height:24px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:50%!important;
  background:#1ea1ff!important;
  color:#fff!important;
  font-size:10px!important;
  font-weight:900!important;
}

.ja36-toc-list a>b{
  color:#f7fbff!important;
  font-size:10px!important;
  font-weight:600!important;
  line-height:1.25!important;
}

/* ---------------------------------
   Postulación oficial
   --------------------------------- */
.ja36-apply-card{
  padding:14px!important;
  background:linear-gradient(135deg,#ffe8a1,#ffd46a)!important;
  border:1px solid #f4d06b!important;
  border-radius:10px!important;
  box-shadow:0 8px 20px rgba(211,153,32,.10)!important;
}

.ja36-apply-head{
  display:grid!important;
  grid-template-columns:38px minmax(0,1fr)!important;
  gap:9px!important;
  align-items:start!important;
}

.ja36-globe{
  width:34px!important;
  height:34px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:50%!important;
  background:#ff5b0c!important;
  color:#fff!important;
  font-size:18px!important;
  font-weight:900!important;
}

.ja36-apply-card h3{
  margin:0 0 4px!important;
  color:#112a53!important;
  font-size:12px!important;
  line-height:1.2!important;
}

.ja36-apply-card p{
  margin:0!important;
  color:#264066!important;
  font-size:9px!important;
  line-height:1.35!important;
}

.ja36-apply-card>a{
  width:100%!important;
  min-height:38px!important;
  margin-top:10px!important;
  padding:9px 12px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  border-radius:7px!important;
  background:linear-gradient(135deg,#ff620d,#f5480a)!important;
  color:#fff!important;
  text-decoration:none!important;
  font-size:10px!important;
  font-weight:900!important;
  box-shadow:0 6px 14px rgba(237,78,11,.14)!important;
}

.ja36-apply-card>small{
  display:block!important;
  margin-top:7px!important;
  text-align:center!important;
  color:#7f673a!important;
  font-size:7.5px!important;
}

/* ---------------------------------
   Vacantes relacionadas
   --------------------------------- */
.ja36-related-card{
  padding:14px!important;
  background:#fff!important;
  border:1px solid #e3eaf2!important;
  border-radius:10px!important;
  box-shadow:0 8px 22px rgba(36,58,89,.07)!important;
}

.ja36-related-card>h3{
  margin:0 0 8px!important;
  color:#102c56!important;
  font-size:14px!important;
}

.ja36-related-list{
  display:flex!important;
  flex-direction:column!important;
}

.ja36-related-list>a{
  display:grid!important;
  grid-template-columns:46px minmax(0,1fr) 12px!important;
  gap:8px!important;
  align-items:center!important;
  min-height:58px!important;
  padding:7px 0!important;
  border-bottom:1px solid #edf1f5!important;
  color:inherit!important;
  text-decoration:none!important;
}

.ja36-related-list>a:last-child{
  border-bottom:0!important;
}

.ja36-related-list img,
.ja36-related-ph{
  width:46px!important;
  height:40px!important;
  max-width:46px!important;
  max-height:40px!important;
  object-fit:cover!important;
  border-radius:6px!important;
  background:#f0f4f8!important;
}

.ja36-related-ph{
  display:grid!important;
  place-items:center!important;
  color:#6a38d1!important;
  font-size:10px!important;
  font-weight:900!important;
}

.ja36-related-list b{
  display:block!important;
  margin-bottom:2px!important;
  color:#16345d!important;
  font-size:9px!important;
  line-height:1.25!important;
}

.ja36-related-list small{
  display:block!important;
  color:#708099!important;
  font-size:8px!important;
  line-height:1.25!important;
}

.ja36-arrow{
  color:#196fbc!important;
  font-size:20px!important;
  line-height:1!important;
}

/* ---------------------------------
   Consejo rápido
   --------------------------------- */
.ja36-tip-card{
  display:grid!important;
  grid-template-columns:34px minmax(0,1fr)!important;
  gap:9px!important;
  padding:14px!important;
  background:linear-gradient(135deg,#eef8ff,#dcefff)!important;
  border:1px solid #d1e9fb!important;
  border-radius:10px!important;
  box-shadow:0 8px 20px rgba(51,130,190,.06)!important;
}

.ja36-tip-icon{
  width:30px!important;
  height:30px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:50%!important;
  background:#fff6bf!important;
  color:#ffb300!important;
  font-size:15px!important;
}

.ja36-tip-card h3{
  margin:0 0 4px!important;
  color:#12345d!important;
  font-size:11px!important;
}

.ja36-tip-card p{
  margin:0!important;
  color:#315275!important;
  font-size:9px!important;
  line-height:1.45!important;
}

/* Desactivar visual del sidebar viejo si queda algún nodo heredado */
.ja36-sidebar .ja3-side-card{
  display:none!important;
}

/* Layout */
@media(min-width:981px){
  .ja36-layout{
    grid-template-columns:minmax(0,1fr) 260px!important;
    gap:18px!important;
    align-items:start!important;
  }
}

@media(max-width:980px){
  .ja36-sidebar{
    position:static!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:12px!important;
  }

  .ja36-toc-card{
    grid-column:1/-1!important;
  }
}

@media(max-width:650px){
  .ja36-sidebar{
    grid-template-columns:1fr!important;
  }

  .ja36-toc-card,
  .ja36-apply-card,
  .ja36-related-card,
  .ja36-tip-card{
    border-radius:12px!important;
  }
}


/* =========================================================
   JOBAVENUE PWA 4.8 — ENTRADAS MÓVILES
   Imagen completa + controles con paleta CareerLink
   ========================================================= */

/* Paleta unificada */
:root{
  --ja48-purple:#6b35db;
  --ja48-purple-2:#7b46ea;
  --ja48-orange:#ff8124;
  --ja48-navy:#102033;
  --ja48-soft:#f5f1ff;
}

/* Top bar */
.ja3-logo{
  background:linear-gradient(135deg,var(--ja48-purple),var(--ja48-purple-2) 62%,var(--ja48-orange))!important;
}

.ja3-top-back{
  color:#4f27b8!important;
  border-color:#ddd4f5!important;
  background:#fff!important;
}

.ja3-top-back:hover{
  background:#f7f3ff!important;
  border-color:#cfc0f2!important;
}

/* =========================================================
   HERO DE CADA ENTRADA — NO RECORTAR IMAGEN
   ========================================================= */
.ja31-hero-media{
  background-color:#eef1f7!important;
  background-repeat:no-repeat!important;
  background-position:center top!important;
}

/* Los chips pasan de azul genérico a morado CareerLink */
.ja31-chips span{
  background:#f0eaff!important;
  color:var(--ja48-purple)!important;
}

html.ja3-app-mode .ja3-important-box::before{
  background:linear-gradient(135deg,var(--ja48-purple),var(--ja48-purple-2))!important;
}

/* CTA oficial */
.ja31-footer-cta>a,
.ja3-official{
  background:linear-gradient(135deg,var(--ja48-purple),var(--ja48-purple-2) 68%,var(--ja48-orange))!important;
  color:#fff!important;
}

/* =========================================================
   BARRA INFERIOR — ALINEADA CON COLORES DE LA WEB
   ========================================================= */
.ja3-bottom-nav{
  background:rgba(16,32,51,.97)!important;
  border-color:rgba(107,53,219,.34)!important;
  box-shadow:0 14px 34px rgba(26,18,61,.30)!important;
}

.ja3-bottom-nav a,
.ja3-bottom-nav button{
  color:#c6c3d4!important;
  transition:background .18s ease,color .18s ease,transform .18s ease!important;
}

.ja3-bottom-nav a:first-child{
  background:linear-gradient(135deg,#5626c8,var(--ja48-purple-2))!important;
  color:#fff!important;
  box-shadow:0 6px 14px rgba(107,53,219,.25)!important;
}

/* Guardar activo */
.ja3-bottom-nav button.active{
  color:#fff!important;
  background:linear-gradient(135deg,#6b35db,#7b46ea)!important;
}

/* Volver y compartir: mismos tonos de marca */
.ja3-bottom-nav button:hover,
.ja3-bottom-nav a:hover{
  color:#fff!important;
}

.ja3-bottom-nav button[data-ja3-back] span,
.ja3-bottom-nav button[data-ja3-share] span{
  color:#bda9f4!important;
}

.ja3-bottom-nav button[data-ja3-save] span{
  color:#ff9a4f!important;
}

/* =========================================================
   MÓVIL / TABLET
   ========================================================= */
@media(max-width:760px){

  /* Mostrar la imagen destacada completa.
     Las destacadas del proyecto son 700x400, por eso usamos 7/4. */
  .ja31-hero-media{
    min-height:0!important;
    height:auto!important;
    aspect-ratio:7 / 4!important;
    display:flex!important;
    align-items:flex-end!important;
    background-size:contain!important;
    background-position:center top!important;
    background-color:#eef1f7!important;
    overflow:hidden!important;
  }

  /* El degradado solo ayuda a leer el texto, no tapa la imagen completa */
  .ja31-hero-overlay{
    background:
      linear-gradient(
        180deg,
        rgba(8,16,35,0) 0%,
        rgba(8,16,35,.05) 40%,
        rgba(14,19,47,.52) 72%,
        rgba(22,18,55,.84) 100%
      )!important;
  }

  .ja31-hero-copy{
    padding:18px 20px 18px!important;
    width:100%!important;
  }

  .ja31-hero-copy h1{
    font-size:clamp(23px,6.8vw,30px)!important;
    line-height:1.08!important;
    text-shadow:0 2px 10px rgba(0,0,0,.34)!important;
  }

  .ja31-kicker{
    background:linear-gradient(135deg,#ff9c32,var(--ja48-orange))!important;
    color:#fff!important;
  }

  /* Tarjeta principal un poco más compacta */
  html.ja3-app-mode .ja3-article{
    border-radius:20px!important;
  }

  /* Barra inferior más uniforme */
  .ja3-bottom-nav{
    width:calc(100% - 24px)!important;
    bottom:8px!important;
    gap:5px!important;
    padding:6px!important;
    border-radius:20px!important;
  }

  .ja3-bottom-nav a,
  .ja3-bottom-nav button{
    min-height:58px!important;
    border-radius:14px!important;
  }

  .ja3-bottom-nav span{
    font-size:19px!important;
  }

  .ja3-bottom-nav small{
    font-size:9px!important;
  }
}

@media(max-width:520px){
  .ja31-hero-copy{
    padding:14px 16px 15px!important;
  }

  .ja31-hero-copy h1{
    margin:8px 0 5px!important;
    font-size:clamp(20px,6.6vw,27px)!important;
  }

  .ja31-hero-copy p{
    font-size:12px!important;
  }

  .ja31-kicker{
    padding:5px 9px!important;
    font-size:8px!important;
  }
}


/* =========================================================
   JOBAVENUE 4.9 — RELACIONADOS REDISEÑADOS
   Reemplaza el bloque grande y plano por tarjetas premium.
   ========================================================= */

.ja49-native-related-hidden{
  display:none!important;
}

.ja49-related{
  width:100%!important;
  margin:30px 0 10px!important;
  padding:24px!important;
  border:1px solid #e6e0f7!important;
  border-radius:22px!important;
  background:
    radial-gradient(circle at 92% 8%,rgba(255,129,36,.10),transparent 27%),
    linear-gradient(145deg,#faf8ff 0%,#f4f0ff 48%,#fffaf5 100%)!important;
  box-shadow:0 12px 32px rgba(71,47,137,.08)!important;
}

.ja49-related-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  margin-bottom:18px!important;
}

.ja49-related-title{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
}

.ja49-related-icon{
  width:46px!important;
  height:46px!important;
  flex:0 0 46px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:15px!important;
  background:linear-gradient(135deg,#6630d9,#7d46eb)!important;
  color:#fff!important;
  font-size:20px!important;
  box-shadow:0 8px 18px rgba(102,48,217,.20)!important;
}

.ja49-related-title small{
  display:block!important;
  margin:0 0 2px!important;
  color:#ff8124!important;
  font-size:9px!important;
  font-weight:950!important;
  letter-spacing:.13em!important;
}

.ja49-related-title h2{
  margin:0!important;
  color:#152544!important;
  font-size:22px!important;
  line-height:1.12!important;
}

.ja49-related-title p{
  margin:5px 0 0!important;
  color:#758097!important;
  font-size:11px!important;
  line-height:1.45!important;
}

/* 3 tarjetas compactas; ya no imágenes gigantes */
.ja49-related-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:14px!important;
}

.ja49-related-item{
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  background:#fff!important;
  border:1px solid #e8e8f1!important;
  border-radius:17px!important;
  text-decoration:none!important;
  box-shadow:0 7px 18px rgba(32,39,66,.06)!important;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease!important;
}

.ja49-related-item:hover{
  transform:translateY(-3px)!important;
  border-color:#d8c9f7!important;
  box-shadow:0 12px 26px rgba(77,51,143,.11)!important;
}

.ja49-related-media{
  position:relative!important;
  width:100%!important;
  aspect-ratio:16/9!important;
  overflow:hidden!important;
  background:#eef1f6!important;
}

.ja49-related-media img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:cover!important;
  object-position:center!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
}

.ja49-related-ph{
  width:100%!important;
  height:100%!important;
  display:grid!important;
  place-items:center!important;
  background:linear-gradient(135deg,#5f2bd1,#834cef 65%,#ff8124)!important;
  color:#fff!important;
  font-size:28px!important;
  font-weight:950!important;
}

.ja49-related-country{
  position:absolute!important;
  left:9px!important;
  bottom:9px!important;
  display:inline-flex!important;
  align-items:center!important;
  min-height:25px!important;
  padding:0 9px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.95)!important;
  color:#263552!important;
  font-size:8.5px!important;
  font-weight:900!important;
  box-shadow:0 5px 12px rgba(20,32,52,.10)!important;
}

.ja49-related-body{
  flex:1!important;
  display:flex!important;
  flex-direction:column!important;
  padding:13px 14px 14px!important;
}

.ja49-related-meta{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:8px!important;
  margin-bottom:7px!important;
}

.ja49-related-meta span{
  display:inline-flex!important;
  align-items:center!important;
  min-height:22px!important;
  padding:0 8px!important;
  border-radius:999px!important;
  background:#f0eaff!important;
  color:#6530cf!important;
  font-size:8px!important;
  font-weight:950!important;
  text-transform:uppercase!important;
  letter-spacing:.04em!important;
}

.ja49-related-meta b{
  color:#d9d2e9!important;
  font-size:18px!important;
  line-height:1!important;
}

.ja49-related-item h3{
  margin:0!important;
  color:#172645!important;
  font-size:13.5px!important;
  line-height:1.28!important;
}

.ja49-related-item p{
  display:-webkit-box!important;
  -webkit-line-clamp:2!important;
  -webkit-box-orient:vertical!important;
  overflow:hidden!important;
  margin:7px 0 12px!important;
  color:#7a8497!important;
  font-size:9.5px!important;
  line-height:1.48!important;
}

.ja49-related-link{
  width:100%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:8px!important;
  margin-top:auto!important;
  padding-top:10px!important;
  border-top:1px solid #eef0f4!important;
  color:#6630d9!important;
  font-size:10px!important;
  font-weight:950!important;
}

.ja49-related-link i{
  width:26px!important;
  height:26px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:9px!important;
  background:#fff0e4!important;
  color:#ff8124!important;
  font-style:normal!important;
  font-size:14px!important;
}

/* Tablet */
@media(max-width:980px){
  .ja49-related-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .ja49-related-grid .ja49-related-item:last-child:nth-child(3){
    grid-column:1/-1!important;
    display:grid!important;
    grid-template-columns:180px minmax(0,1fr)!important;
  }

  .ja49-related-grid .ja49-related-item:last-child:nth-child(3) .ja49-related-media{
    height:100%!important;
    aspect-ratio:auto!important;
  }
}

/* Móvil */
@media(max-width:650px){
  .ja49-related{
    margin:22px 0 8px!important;
    padding:16px!important;
    border-radius:18px!important;
  }

  .ja49-related-title{
    gap:10px!important;
  }

  .ja49-related-icon{
    width:40px!important;
    height:40px!important;
    flex-basis:40px!important;
    border-radius:13px!important;
    font-size:17px!important;
  }

  .ja49-related-title h2{
    font-size:18px!important;
  }

  .ja49-related-title p{
    font-size:9.5px!important;
  }

  .ja49-related-grid{
    grid-template-columns:1fr!important;
    gap:11px!important;
  }

  .ja49-related-item,
  .ja49-related-grid .ja49-related-item:last-child:nth-child(3){
    display:grid!important;
    grid-template-columns:112px minmax(0,1fr)!important;
    min-height:112px!important;
  }

  .ja49-related-media,
  .ja49-related-grid .ja49-related-item:last-child:nth-child(3) .ja49-related-media{
    width:112px!important;
    height:100%!important;
    min-height:112px!important;
    aspect-ratio:auto!important;
  }

  .ja49-related-country{
    left:6px!important;
    bottom:6px!important;
    max-width:100px!important;
    padding:0 6px!important;
    font-size:7px!important;
  }

  .ja49-related-body{
    padding:10px 11px!important;
  }

  .ja49-related-meta{
    margin-bottom:5px!important;
  }

  .ja49-related-meta b{
    display:none!important;
  }

  .ja49-related-item h3{
    font-size:11.5px!important;
  }

  .ja49-related-item p{
    display:none!important;
  }

  .ja49-related-link{
    padding-top:7px!important;
    font-size:9px!important;
  }

  .ja49-related-link i{
    width:23px!important;
    height:23px!important;
    border-radius:8px!important;
  }
}


/* =========================================================
   CAREERLINK PWA 1.0 — ENTRADAS
   ========================================================= */
:root{
  --cl-navy:#0b1f33;
  --cl-teal:#0e9f9a;
  --cl-aqua:#4fd1c5;
  --cl-coral:#ff7a59;
}

.ja3-logo{
  background:linear-gradient(135deg,var(--cl-teal),var(--cl-aqua) 62%,var(--cl-coral))!important;
}

.ja3-top-back{
  color:#087f86!important;
  border-color:#cfe8e6!important;
  background:#fff!important;
}

.ja31-chips span{
  background:#e8f8f6!important;
  color:#087f86!important;
}

.ja31-kicker{
  background:linear-gradient(135deg,var(--cl-coral),#ff9d73)!important;
}

.ja31-footer-cta>a,
.ja3-official{
  background:linear-gradient(135deg,var(--cl-teal),#087f86 72%,var(--cl-coral))!important;
}

.ja3-bottom-nav{
  background:rgba(11,31,51,.97)!important;
  border-color:rgba(79,209,197,.28)!important;
}

.ja3-bottom-nav a:first-child,
.ja3-bottom-nav button.active{
  background:linear-gradient(135deg,var(--cl-teal),#087f86)!important;
}

.ja49-related{
  border-color:#dcefed!important;
  background:
    radial-gradient(circle at 92% 8%,rgba(255,122,89,.10),transparent 27%),
    linear-gradient(145deg,#f8fffe 0%,#eefafa 52%,#fff8f5 100%)!important;
}

.ja49-related-icon{
  background:linear-gradient(135deg,var(--cl-teal),#087f86)!important;
}

.ja49-related-meta span,
.ja49-related-link{
  color:var(--cl-teal)!important;
}


/* =========================================================
   CAREERLINK PWA 1.3 — ENTRADAS MODERNAS Y LIMPIAS
   Basado en la Opción 1 del catálogo visual.
   ========================================================= */

:root{
  --cl13-navy:#0b1f33;
  --cl13-teal:#0e9f9a;
  --cl13-teal2:#087f86;
  --cl13-aqua:#4fd1c5;
  --cl13-coral:#ff7a59;
  --cl13-bg:#f5f9fb;
  --cl13-line:#dfeaec;
  --cl13-text:#173047;
  --cl13-muted:#738395;
}

/* Fondo general de la entrada */
html.ja3-app-mode,
html.ja3-app-mode body{
  background:
    radial-gradient(circle at 10% 4%,rgba(79,209,197,.10),transparent 28%),
    linear-gradient(180deg,#f8fbfc 0%,#f2f7fa 100%)!important;
}

/* Cabecera */
.ja3-topbar{
  background:rgba(255,255,255,.96)!important;
  border-bottom:1px solid #e4edef!important;
  box-shadow:0 5px 18px rgba(18,52,70,.05)!important;
}

.ja3-logo{
  background:linear-gradient(135deg,var(--cl13-teal),var(--cl13-aqua) 60%,var(--cl13-coral))!important;
  box-shadow:0 7px 16px rgba(14,159,154,.18)!important;
}

.ja3-top-back{
  min-height:40px!important;
  padding:0 15px!important;
  border-radius:12px!important;
  color:var(--cl13-teal2)!important;
  border:1px solid #cfe4e4!important;
  background:#fff!important;
  font-weight:900!important;
}

/* Contenedor principal */
html.ja3-app-mode .ja3-article{
  background:#fff!important;
  border:1px solid #e2ecef!important;
  border-radius:24px!important;
  box-shadow:0 18px 44px rgba(25,59,78,.08)!important;
  overflow:hidden!important;
}

/* =========================================================
   HERO DE LA ENTRADA
   Imagen grande a la izquierda + información limpia
   ========================================================= */
.ja31-hero{
  display:grid!important;
  grid-template-columns:minmax(260px,42%) minmax(0,58%)!important;
  min-height:360px!important;
  background:#fff!important;
  border-bottom:1px solid #e7eff1!important;
  overflow:hidden!important;
}

.ja31-hero-media{
  min-height:360px!important;
  height:100%!important;
  aspect-ratio:auto!important;
  background-size:cover!important;
  background-position:center!important;
  border-radius:0!important;
  position:relative!important;
}

.ja31-hero-media::after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  pointer-events:none!important;
  background:
    linear-gradient(180deg,rgba(7,31,45,.02),rgba(7,31,45,.12))!important;
}

/* copy panel */
.ja31-hero-copy{
  position:relative!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  padding:34px 36px!important;
  background:
    radial-gradient(circle at 96% 8%,rgba(255,122,89,.08),transparent 28%),
    linear-gradient(180deg,#ffffff,#fbfefe)!important;
  color:var(--cl13-text)!important;
}

.ja31-kicker{
  width:max-content!important;
  max-width:100%!important;
  margin:0 0 12px!important;
  padding:6px 10px!important;
  border-radius:999px!important;
  background:#e8f8f6!important;
  color:var(--cl13-teal2)!important;
  font-size:9px!important;
  font-weight:950!important;
  letter-spacing:.08em!important;
  box-shadow:none!important;
}

.ja31-hero-copy h1{
  margin:0 0 12px!important;
  color:var(--cl13-navy)!important;
  font-size:clamp(30px,3.1vw,46px)!important;
  line-height:1.03!important;
  text-shadow:none!important;
}

.ja31-hero-copy p{
  margin:0!important;
  color:var(--cl13-muted)!important;
  font-size:15px!important;
  line-height:1.55!important;
}

/* Chips */
.ja31-chips{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:8px!important;
  margin-top:18px!important;
}

.ja31-chips span{
  min-height:30px!important;
  display:inline-flex!important;
  align-items:center!important;
  padding:0 10px!important;
  border-radius:9px!important;
  background:#f1f7f8!important;
  border:1px solid #dfeaec!important;
  color:#36556a!important;
  font-size:10px!important;
  font-weight:850!important;
}

/* =========================================================
   BLOQUES INFORMATIVOS
   ========================================================= */
.ja31-main,
.ja3-entry-main{
  padding:28px 32px!important;
}

html.ja3-app-mode .ja3-article h2{
  color:var(--cl13-navy)!important;
}

html.ja3-app-mode .ja3-article h2::before{
  background:linear-gradient(180deg,var(--cl13-teal),var(--cl13-aqua))!important;
}

/* tarjetas informativas */
.ja31-fact,
.ja3-fact,
.ja3-info-card,
.ja31-info-card{
  background:#f8fbfc!important;
  border:1px solid #e2ecef!important;
  border-radius:16px!important;
  box-shadow:none!important;
}

.ja31-fact-icon,
.ja3-fact-icon,
.ja3-info-icon,
.ja31-info-icon{
  background:#e8f8f6!important;
  color:var(--cl13-teal2)!important;
}

/* Consejo / importante */
.ja3-important-box,
.ja31-important{
  background:linear-gradient(135deg,#eefafa,#f9fdfd)!important;
  border:1px solid #cfeae7!important;
  color:var(--cl13-text)!important;
  border-radius:17px!important;
}

html.ja3-app-mode .ja3-important-box::before{
  background:linear-gradient(135deg,var(--cl13-teal),var(--cl13-aqua))!important;
}

/* CTA oficial */
.ja31-footer-cta>a,
.ja3-official{
  min-height:50px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:9px!important;
  border-radius:13px!important;
  background:linear-gradient(135deg,var(--cl13-teal),var(--cl13-teal2))!important;
  color:#fff!important;
  font-size:13px!important;
  font-weight:950!important;
  box-shadow:0 10px 22px rgba(14,159,154,.18)!important;
}

/* =========================================================
   SIDEBAR
   ========================================================= */
.ja3-sidebar{
  gap:14px!important;
}

.ja3-sidebar>*{
  border-radius:17px!important;
  border-color:#e0ebee!important;
  box-shadow:0 8px 22px rgba(24,56,73,.06)!important;
}

.ja3-toc{
  background:var(--cl13-navy)!important;
  color:#fff!important;
}

.ja3-toc a{
  color:#d7e8ef!important;
}

.ja3-toc a:hover{
  color:var(--cl13-aqua)!important;
}

/* =========================================================
   RELACIONADOS
   ========================================================= */
.ja49-related{
  background:
    radial-gradient(circle at 95% 6%,rgba(255,122,89,.08),transparent 26%),
    linear-gradient(145deg,#f8fffe 0%,#eefafa 52%,#fffaf7 100%)!important;
  border-color:#dcefed!important;
}

.ja49-related-icon{
  background:linear-gradient(135deg,var(--cl13-teal),var(--cl13-teal2))!important;
}

.ja49-related-meta span,
.ja49-related-link{
  color:var(--cl13-teal2)!important;
}

.ja49-related-link i{
  background:#fff0ea!important;
  color:var(--cl13-coral)!important;
}

/* =========================================================
   BARRA INFERIOR
   ========================================================= */
.ja3-bottom-nav{
  background:rgba(11,31,51,.97)!important;
  border-color:rgba(79,209,197,.25)!important;
  box-shadow:0 14px 34px rgba(11,31,51,.26)!important;
}

.ja3-bottom-nav a:first-child,
.ja3-bottom-nav button.active{
  background:linear-gradient(135deg,var(--cl13-teal),var(--cl13-teal2))!important;
  color:#fff!important;
}

/* =========================================================
   TABLET
   ========================================================= */
@media(max-width:980px){
  .ja31-hero{
    grid-template-columns:40% 60%!important;
  }

  .ja31-hero-copy{
    padding:28px!important;
  }

  .ja31-hero-copy h1{
    font-size:clamp(26px,4vw,38px)!important;
  }
}

/* =========================================================
   MÓVIL
   Imagen completa arriba + cuerpo debajo.
   ========================================================= */
@media(max-width:760px){

  html.ja3-app-mode .ja3-article{
    border-radius:20px!important;
  }

  .ja31-hero{
    display:block!important;
    min-height:0!important;
  }

  .ja31-hero-media{
    width:100%!important;
    min-height:0!important;
    height:auto!important;
    aspect-ratio:7/4!important;
    background-size:contain!important;
    background-repeat:no-repeat!important;
    background-position:center!important;
    background-color:#eef3f5!important;
  }

  .ja31-hero-media::after{
    background:linear-gradient(180deg,rgba(11,31,51,0),rgba(11,31,51,.06))!important;
  }

  .ja31-hero-copy{
    padding:20px 18px 22px!important;
    background:#fff!important;
  }

  .ja31-hero-copy h1{
    margin-bottom:8px!important;
    font-size:clamp(24px,7.2vw,31px)!important;
    line-height:1.08!important;
  }

  .ja31-hero-copy p{
    font-size:12.5px!important;
  }

  .ja31-chips{
    margin-top:13px!important;
    gap:6px!important;
  }

  .ja31-chips span{
    min-height:27px!important;
    padding:0 8px!important;
    font-size:8.5px!important;
  }

  .ja31-main,
  .ja3-entry-main{
    padding:20px 16px!important;
  }

  .ja3-bottom-nav{
    width:calc(100% - 22px)!important;
    bottom:8px!important;
    border-radius:20px!important;
  }
}


/* =========================================================
   CAREERLINK PWA 1.4 — OCULTAR ICONOS DECORATIVOS GRANDES
   En todas las entradas PWA
   ========================================================= */

.cl14-hide-decorative{
  display:none!important;
}

/* Evitar que emojis heredados del artículo se conviertan en bloques gigantes */
html.ja3-app-mode .ja3-entry-main p:has(> img.emoji:only-child),
html.ja3-app-mode .ja31-main p:has(> img.emoji:only-child),
html.ja3-app-mode .ja3-entry-main figure:has(> img.emoji:only-child),
html.ja3-app-mode .ja31-main figure:has(> img.emoji:only-child){
  display:none!important;
}

/* Limitar emojis que sí estén dentro de texto real */
html.ja3-app-mode .ja3-entry-main img.emoji,
html.ja3-app-mode .ja31-main img.emoji{
  width:1em!important;
  height:1em!important;
  max-width:1em!important;
  max-height:1em!important;
  margin:0 .12em!important;
  vertical-align:-.12em!important;
}

/* Limitar SVG o imágenes decorativas sueltas dentro del contenido */
html.ja3-app-mode .ja3-entry-main p>svg:only-child,
html.ja3-app-mode .ja31-main p>svg:only-child{
  display:none!important;
}

html.ja3-app-mode .ja3-entry-main img:not(.wp-post-image):not([class*="align"]):not([class*="size-"]),
html.ja3-app-mode .ja31-main img:not(.wp-post-image):not([class*="align"]):not([class*="size-"]){
  max-width:100%!important;
}

/* Los iconos propios del plugin siguen controlados y pequeños */
.ja31-chips span,
.ja3-fact-icon,
.ja31-fact-icon,
.ja3-info-icon,
.ja31-info-icon,
.ja49-related-icon{
  line-height:1!important;
}



/* =========================================================
   CAREERLINK PWA 1.5 — ENTRADA IGUAL AL MOCKUP APROBADO
   ========================================================= */

:root{
  --cl15-blue:#0b4f8a;
  --cl15-teal:#0ea6a6;
  --cl15-teal-dark:#0b8e8e;
  --cl15-navy:#0a2342;
  --cl15-soft:#f4fbfb;
  --cl15-line:#dfe9ef;
  --cl15-text:#102b4e;
  --cl15-muted:#60748c;
}

/* --- Header desktop --- */
.cl15-topbar{
  position:relative!important;
  z-index:9997!important;
  width:100%!important;
  background:#fff!important;
  border-bottom:1px solid #e7eef3!important;
  box-shadow:0 3px 16px rgba(22,49,75,.04)!important;
  padding:0!important;
}

.cl15-topbar-inner{
  width:min(1480px,calc(100% - 48px))!important;
  min-height:76px!important;
  margin:0 auto!important;
  display:grid!important;
  grid-template-columns:auto 1fr minmax(360px,520px)!important;
  align-items:center!important;
  gap:28px!important;
}

.cl15-brand{
  display:flex!important;
  flex-direction:column!important;
  text-decoration:none!important;
  line-height:1!important;
}

.cl15-brand-word{
  display:block!important;
  font-size:34px!important;
  letter-spacing:-1.5px!important;
  font-weight:950!important;
}

.cl15-brand-word b{color:var(--cl15-blue)!important;}
.cl15-brand-word strong{color:var(--cl15-teal)!important;}

.cl15-brand small{
  margin-top:3px!important;
  color:#1e3857!important;
  font-size:10px!important;
  font-weight:800!important;
}

.cl15-main-nav{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:24px!important;
}

.cl15-main-nav a{
  color:#0f2949!important;
  font-size:12px!important;
  font-weight:900!important;
  text-decoration:none!important;
  white-space:nowrap!important;
}

.cl15-main-nav a:hover{color:var(--cl15-teal)!important;}

.cl15-head-search{
  display:grid!important;
  grid-template-columns:1fr auto!important;
  align-items:center!important;
  gap:10px!important;
}

.cl15-searchbox{
  min-height:46px!important;
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  padding:0 14px!important;
  border:1px solid #d9e4ec!important;
  border-radius:12px!important;
  background:#fff!important;
}

.cl15-searchbox span{color:#8695a7!important;font-size:18px!important;}
.cl15-searchbox input{
  width:100%!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  color:#28415e!important;
  font-size:12px!important;
}

.cl15-head-search button{
  min-height:46px!important;
  padding:0 24px!important;
  border:0!important;
  border-radius:11px!important;
  background:linear-gradient(135deg,var(--cl15-teal),var(--cl15-teal-dark))!important;
  color:#fff!important;
  font-size:12px!important;
  font-weight:950!important;
}

.cl15-mobile-back{display:none!important;}

/* --- Main layout --- */
.cl15-layout{
  width:min(1480px,calc(100% - 70px))!important;
  margin:22px auto 80px!important;
  display:grid!important;
  grid-template-columns:minmax(0,2.1fr) minmax(300px,.95fr)!important;
  gap:26px!important;
  align-items:start!important;
}

html.ja3-app-mode .ja3-article{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  border-radius:0!important;
  overflow:visible!important;
}

.cl15-entry-head{
  display:block!important;
  min-height:0!important;
  background:transparent!important;
  border:0!important;
}

/* Breadcrumb */
.cl15-breadcrumb{
  min-height:36px!important;
  display:flex!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:7px!important;
  margin:0 0 10px!important;
  padding:0 4px!important;
  color:#60758e!important;
  font-size:10px!important;
}

.cl15-breadcrumb a{
  color:#48627d!important;
  text-decoration:none!important;
}
.cl15-breadcrumb a:hover{color:var(--cl15-teal)!important;}

/* Featured image */
.cl15-featured{
  position:relative!important;
  width:100%!important;
  aspect-ratio:16/5.7!important;
  min-height:310px!important;
  overflow:hidden!important;
  border-radius:18px 18px 0 0!important;
  background-color:#eaf0f3!important;
  background-repeat:no-repeat!important;
  background-size:cover!important;
  background-position:center!important;
}

.cl15-featured-fade{
  position:absolute!important;
  inset:0!important;
  background:
    linear-gradient(90deg,rgba(10,35,66,.04),rgba(10,35,66,.01)),
    linear-gradient(180deg,rgba(10,35,66,.01),rgba(10,35,66,.08))!important;
}

/* Summary card */
.cl15-entry-summary{
  padding:20px 18px 18px!important;
  background:#fff!important;
  border:1px solid var(--cl15-line)!important;
  border-top:0!important;
  border-radius:0 0 18px 18px!important;
  box-shadow:0 7px 22px rgba(22,54,80,.05)!important;
}

.cl15-tags{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:8px!important;
  margin-bottom:12px!important;
}

.cl15-tags span{
  display:inline-flex!important;
  align-items:center!important;
  min-height:26px!important;
  padding:0 11px!important;
  border-radius:999px!important;
  background:#e8f7f7!important;
  color:#078c8c!important;
  font-size:9px!important;
  font-weight:950!important;
  text-transform:uppercase!important;
}

.cl15-entry-summary h1{
  margin:0 0 8px!important;
  color:#09264b!important;
  font-size:32px!important;
  line-height:1.08!important;
  letter-spacing:-.5px!important;
}

.cl15-excerpt{
  margin:0 0 14px!important;
  color:#405b78!important;
  font-size:14px!important;
  line-height:1.5!important;
}

.cl15-facts{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:0!important;
  margin:14px 0 16px!important;
  padding:14px 0!important;
  border:1px solid #e3eaef!important;
  border-radius:12px!important;
  background:linear-gradient(180deg,#fbfdfe,#f8fbfc)!important;
}

.cl15-facts>div{
  min-width:0!important;
  padding:0 18px!important;
  border-right:1px solid #e1e8ed!important;
}
.cl15-facts>div:last-child{border-right:0!important;}

.cl15-facts small{
  display:block!important;
  margin-bottom:4px!important;
  color:#4f6680!important;
  font-size:9px!important;
}
.cl15-facts b{
  display:block!important;
  color:#12335f!important;
  font-size:13px!important;
  line-height:1.25!important;
  overflow-wrap:anywhere!important;
}

.cl15-official-main{
  width:100%!important;
  min-height:48px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:14px!important;
  border-radius:10px!important;
  background:linear-gradient(135deg,var(--cl15-teal),var(--cl15-teal-dark))!important;
  color:#fff!important;
  text-decoration:none!important;
  font-size:13px!important;
  font-weight:950!important;
  box-shadow:0 8px 18px rgba(14,166,166,.15)!important;
}
.cl15-official-main b{font-size:20px!important;}

/* TOC in main column */
.cl15-article-toc{
  margin:14px 0 18px!important;
  padding:17px 18px!important;
  border:1px solid #cee9e8!important;
  border-radius:12px!important;
  background:linear-gradient(135deg,#f7fefe,#eefafa)!important;
}

.cl15-article-toc h3{
  margin:0 0 12px!important;
  color:#0b294e!important;
  font-size:14px!important;
}

.cl15-toc-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:9px 24px!important;
}

.cl15-toc-grid a{
  display:flex!important;
  align-items:flex-start!important;
  gap:8px!important;
  color:#1e3b5b!important;
  text-decoration:none!important;
  font-size:10.5px!important;
}
.cl15-toc-grid a b{color:var(--cl15-teal)!important;}

/* Main article content */
.ja31-main,
.ja3-entry-main{
  margin-top:0!important;
  padding:22px 24px!important;
  background:#fff!important;
  border:1px solid #e2eaef!important;
  border-radius:15px!important;
  box-shadow:0 6px 18px rgba(24,53,75,.04)!important;
}

/* Hide redundant old hero/quick facts/CTA constructs */
.ja31-hero-media,
.ja31-hero-copy,
.ja31-chips,
.ja33-quick-facts,
.ja31-footer-cta{
  display:none!important;
}

/* --- Sidebar --- */
.cl15-sidebar{
  display:flex!important;
  flex-direction:column!important;
  gap:16px!important;
}

.cl15-sidebar>section{
  padding:18px!important;
  background:#fff!important;
  border:1px solid #e0e8ee!important;
  border-radius:15px!important;
  box-shadow:0 6px 18px rgba(21,52,75,.05)!important;
}

.cl15-sidebar h3{
  margin:0 0 12px!important;
  color:#0b294e!important;
  font-size:16px!important;
}

.cl15-company-name{
  margin:2px 0 12px!important;
  color:#0b5ca4!important;
  font-size:28px!important;
  font-weight:950!important;
  line-height:1!important;
}

.cl15-company-card p,
.cl15-useful-card p{
  margin:0 0 14px!important;
  color:#536b83!important;
  font-size:11px!important;
  line-height:1.52!important;
}

.cl15-company-card>a,
.cl15-useful-card>a{
  min-height:40px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
  border-radius:9px!important;
  text-decoration:none!important;
  font-size:10.5px!important;
  font-weight:950!important;
}

.cl15-company-card>a{
  background:#edf7ff!important;
  border:1px solid #cfe3f5!important;
  color:#104d89!important;
}

.cl15-useful-card{
  background:linear-gradient(145deg,#f7fdfd,#eef9f9)!important;
}
.cl15-useful-card>a{
  background:linear-gradient(135deg,var(--cl15-teal),var(--cl15-teal-dark))!important;
  color:#fff!important;
}

.cl15-side-related>div{
  display:flex!important;
  flex-direction:column!important;
  gap:12px!important;
}

.cl15-side-related a{
  display:grid!important;
  grid-template-columns:104px minmax(0,1fr)!important;
  gap:11px!important;
  align-items:center!important;
  text-decoration:none!important;
  color:inherit!important;
}

.cl15-side-related img,
.cl15-rel-ph{
  width:104px!important;
  height:72px!important;
  display:grid!important;
  place-items:center!important;
  object-fit:cover!important;
  border-radius:9px!important;
  background:linear-gradient(135deg,var(--cl15-teal),var(--cl15-blue))!important;
  color:#fff!important;
  font-weight:950!important;
}

.cl15-rel-copy{
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
}

.cl15-rel-copy small{
  display:inline-flex!important;
  margin-bottom:5px!important;
  padding:3px 7px!important;
  border-radius:999px!important;
  background:#e5f3ff!important;
  color:#0c69b6!important;
  font-size:7.5px!important;
  font-weight:950!important;
}

.cl15-rel-copy b{
  display:-webkit-box!important;
  -webkit-line-clamp:2!important;
  -webkit-box-orient:vertical!important;
  overflow:hidden!important;
  color:#153250!important;
  font-size:11px!important;
  line-height:1.28!important;
}

.cl15-rel-copy em{
  margin-top:5px!important;
  color:#0b73cf!important;
  font-size:9px!important;
  font-style:normal!important;
  font-weight:850!important;
}

/* Do not display old sidebar/related blocks from previous versions */
.ja36-sidebar,
.ja49-related{
  display:none!important;
}

/* Bottom nav only on mobile; exact mockup has none on desktop */
@media(min-width:761px){
  .ja3-bottom-nav{display:none!important;}
}

/* ---------------- TABLET ---------------- */
@media(max-width:1120px){
  .cl15-topbar-inner{
    grid-template-columns:auto 1fr!important;
  }
  .cl15-main-nav{display:none!important;}
  .cl15-head-search{max-width:560px!important;justify-self:end!important;}
  .cl15-layout{
    width:min(100% - 34px,1100px)!important;
    grid-template-columns:minmax(0,1fr) 310px!important;
  }
}

/* ---------------- MOBILE ---------------- */
@media(max-width:760px){
  .cl15-topbar-inner{
    width:calc(100% - 28px)!important;
    min-height:68px!important;
    grid-template-columns:1fr auto!important;
    gap:10px!important;
  }

  .cl15-brand-word{font-size:25px!important;}
  .cl15-brand small{font-size:8px!important;}
  .cl15-head-search,
  .cl15-main-nav{display:none!important;}
  .cl15-mobile-back{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:38px!important;
    padding:0 13px!important;
    border:1px solid #d5e1e9!important;
    border-radius:11px!important;
    background:#fff!important;
    color:#153553!important;
    font-size:10px!important;
    font-weight:900!important;
  }

  .cl15-layout{
    width:calc(100% - 20px)!important;
    margin:12px auto 92px!important;
    display:block!important;
  }

  .cl15-breadcrumb{
    overflow:hidden!important;
    white-space:nowrap!important;
    flex-wrap:nowrap!important;
    font-size:8.5px!important;
  }

  .cl15-featured{
    aspect-ratio:7/4!important;
    min-height:0!important;
    background-size:contain!important;
    background-position:center!important;
    border-radius:16px 16px 0 0!important;
  }

  .cl15-entry-summary{
    padding:15px 14px 14px!important;
    border-radius:0 0 16px 16px!important;
  }

  .cl15-entry-summary h1{
    font-size:24px!important;
  }

  .cl15-excerpt{font-size:11.5px!important;}

  .cl15-facts{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:12px 0!important;
  }
  .cl15-facts>div:nth-child(2){border-right:0!important;}
  .cl15-facts>div:nth-child(3),
  .cl15-facts>div:nth-child(4){
    padding-top:8px!important;
    border-top:1px solid #e1e8ed!important;
  }

  .cl15-toc-grid{grid-template-columns:1fr!important;}

  .ja31-main,
  .ja3-entry-main{
    padding:16px!important;
    border-radius:13px!important;
  }

  .cl15-sidebar{
    margin-top:16px!important;
  }

  .cl15-company-name{font-size:24px!important;}

  .ja3-bottom-nav{
    display:grid!important;
  }
}


/* =========================================================
   CAREERLINK PWA 1.6 — VOLVER + INICIO EN TODAS LAS ENTRADAS
   ========================================================= */

/* Acciones visibles arriba de cada entrada */
.cl16-entry-actions{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  margin:0 0 10px!important;
}

.cl16-entry-actions button,
.cl16-entry-actions a{
  min-height:40px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  padding:0 14px!important;
  border-radius:11px!important;
  text-decoration:none!important;
  font-size:10.5px!important;
  font-weight:950!important;
  cursor:pointer!important;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease!important;
}

.cl16-entry-actions button{
  border:1px solid #d6e3ea!important;
  background:#fff!important;
  color:#153553!important;
  box-shadow:0 4px 11px rgba(22,50,73,.05)!important;
}

.cl16-entry-actions a{
  border:1px solid transparent!important;
  background:linear-gradient(135deg,#0ea6a6,#0b8e8e)!important;
  color:#fff!important;
  box-shadow:0 6px 14px rgba(14,166,166,.15)!important;
}

.cl16-entry-actions button:hover,
.cl16-entry-actions a:hover{
  transform:translateY(-1px)!important;
}

.cl16-entry-actions span{
  font-size:16px!important;
  line-height:1!important;
}

/* Mobile header actions */
.cl16-mobile-actions{
  display:none!important;
  align-items:center!important;
  gap:7px!important;
}

.cl16-mobile-home{
  min-height:38px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 13px!important;
  border-radius:11px!important;
  background:linear-gradient(135deg,#0ea6a6,#0b8e8e)!important;
  color:#fff!important;
  text-decoration:none!important;
  font-size:10px!important;
  font-weight:900!important;
}

/* Barra inferior móvil:
   aseguramos que Inicio y Volver sigan siendo accesibles */
@media(max-width:760px){
  .cl16-entry-actions{
    margin-bottom:8px!important;
  }

  .cl16-entry-actions button,
  .cl16-entry-actions a{
    min-height:38px!important;
    padding:0 12px!important;
    font-size:10px!important;
  }

  .cl16-mobile-actions{
    display:flex!important;
  }

  .cl15-mobile-back{
    display:inline-flex!important;
  }

  .cl16-mobile-home{
    display:inline-flex!important;
  }
}

@media(min-width:761px){
  .cl16-entry-actions{
    justify-content:flex-end!important;
  }
}


/* =========================================================
   CAREERLINK PWA 1.7 — TEXTO HORIZONTAL / ANCHO CORRECTO
   Corrección global para todas las entradas PWA.
   ========================================================= */

/* Regla base: el contenido editorial siempre escribe horizontalmente */
html.ja3-app-mode .ja3-content,
html.ja3-app-mode .ja3-entry-main,
html.ja3-app-mode .ja31-main{
  writing-mode:horizontal-tb!important;
  text-orientation:mixed!important;
  min-width:0!important;
}

/* Bloques de texto reales nunca deben contraerse a una sola letra */
html.ja3-app-mode .ja3-entry-main p,
html.ja3-app-mode .ja31-main p,
html.ja3-app-mode .ja3-entry-main blockquote,
html.ja3-app-mode .ja31-main blockquote,
html.ja3-app-mode .ja3-entry-main h2,
html.ja3-app-mode .ja3-entry-main h3,
html.ja3-app-mode .ja3-entry-main h4,
html.ja3-app-mode .ja31-main h2,
html.ja3-app-mode .ja31-main h3,
html.ja3-app-mode .ja31-main h4,
html.ja3-app-mode .ja3-entry-main li,
html.ja3-app-mode .ja31-main li,
html.ja3-app-mode .ja31-quote,
html.ja3-app-mode .ja3-important-box{
  writing-mode:horizontal-tb!important;
  text-orientation:mixed!important;
  word-break:normal!important;
  overflow-wrap:break-word!important;
  white-space:normal!important;
  width:auto!important;
  max-width:100%!important;
  min-width:0!important;
  letter-spacing:normal!important;
}

/* Reparación JS: fuerza a usar todo el ancho disponible */
html.ja3-app-mode .cl17-text-repaired{
  display:block!important;
  float:none!important;
  position:relative!important;
  left:auto!important;
  right:auto!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  writing-mode:horizontal-tb!important;
  text-orientation:mixed!important;
  word-break:normal!important;
  overflow-wrap:break-word!important;
  white-space:normal!important;
  transform:none!important;
}

html.ja3-app-mode .cl17-parent-repaired{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  grid-template-columns:1fr!important;
  flex-basis:auto!important;
}

/* El bloque con borde naranja que se ve en la captura */
html.ja3-app-mode .ja31-quote,
html.ja3-app-mode blockquote.ja31-quote{
  display:block!important;
  box-sizing:border-box!important;
  margin:20px 0!important;
  padding:18px 20px!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  border-left:4px solid #ff8a22!important;
  background:#fff9ef!important;
  line-height:1.65!important;
}

/* Avisos azules también ocupan el ancho normal */
html.ja3-app-mode .ja3-important-box{
  display:block!important;
  box-sizing:border-box!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
}

/* Protección para tarjetas antiguas transformadas por versiones previas */
html.ja3-app-mode .ja33-section-card{
  box-sizing:border-box!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
}

html.ja3-app-mode .ja33-section-card > *,
html.ja3-app-mode .ja3-entry-main > *,
html.ja3-app-mode .ja31-main > *{
  min-width:0!important;
}

/* Móvil: evitar cualquier rejilla editorial que pueda dejar columnas mínimas */
@media(max-width:760px){
  html.ja3-app-mode .ja3-entry-main,
  html.ja3-app-mode .ja31-main{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:visible!important;
  }

  html.ja3-app-mode .ja33-section-card,
  html.ja3-app-mode .ja31-quote,
  html.ja3-app-mode .ja3-important-box{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }

  html.ja3-app-mode .ja3-content ul.ja31-list{
    grid-template-columns:1fr!important;
  }

  html.ja3-app-mode .ja3-content ul.ja31-list li{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
}


/* =========================================================
   CAREERLINK PWA 1.8 — RESET DEFINITIVO DEL CONTENIDO MÓVIL
   Elimina columnas/anchos heredados que producían texto vertical.
   ========================================================= */

/* El contenido real de WordPress vuelve a flujo normal */
html.ja3-app-mode .ja3-content{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
  writing-mode:horizontal-tb!important;
  text-orientation:mixed!important;
  overflow:visible!important;
}

/* Wrappers heredados: nunca forman columnas dentro de la entrada PWA */
html.ja3-app-mode .ja3-content .cl18-flow-block{
  display:block!important;
  float:none!important;
  clear:both!important;
  position:relative!important;
  inset:auto!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  height:auto!important;
  max-height:none!important;
  margin-left:0!important;
  margin-right:0!important;
  padding-left:0!important;
  padding-right:0!important;
  column-count:1!important;
  columns:auto!important;
  grid-template-columns:none!important;
  grid-template-areas:none!important;
  flex:0 1 auto!important;
  flex-basis:auto!important;
  transform:none!important;
  writing-mode:horizontal-tb!important;
}

/* Texto siempre horizontal y con ancho utilizable */
html.ja3-app-mode .ja3-content .cl18-text-block{
  display:block!important;
  float:none!important;
  position:relative!important;
  left:auto!important;
  right:auto!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  height:auto!important;
  margin-left:0!important;
  margin-right:0!important;
  transform:none!important;
  writing-mode:horizontal-tb!important;
  text-orientation:mixed!important;
  word-break:normal!important;
  overflow-wrap:break-word!important;
  white-space:normal!important;
  letter-spacing:normal!important;
  text-align:left!important;
}

/* Desactivar definitivamente el sistema Style 5 heredado en CareerLink */
html.ja3-app-mode .ja3-content .ja33-section-card{
  display:contents!important;
}

html.ja3-app-mode .ja33-quick-facts,
html.ja3-app-mode .ja31-footer-cta,
html.ja3-app-mode .ja32-section-icon{
  display:none!important;
}

/* Listas normales, sin grids de dos columnas */
html.ja3-app-mode .ja3-content ul,
html.ja3-app-mode .ja3-content ol,
html.ja3-app-mode .ja3-content ul.ja31-list,
html.ja3-app-mode .ja3-content .ja33-card-list{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin:12px 0 20px!important;
  padding-left:22px!important;
  list-style-position:outside!important;
}

html.ja3-app-mode .ja3-content li,
html.ja3-app-mode .ja3-content ul.ja31-list li,
html.ja3-app-mode .ja3-content .ja33-card-list>li,
html.ja3-app-mode .ja3-content li.ja33-clean-li{
  display:list-item!important;
  position:relative!important;
  width:auto!important;
  max-width:100%!important;
  min-width:0!important;
  min-height:0!important;
  margin:7px 0!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  color:#24324d!important;
  font-size:inherit!important;
  line-height:1.65!important;
  word-break:normal!important;
  overflow-wrap:break-word!important;
  writing-mode:horizontal-tb!important;
}

html.ja3-app-mode .ja3-content li::before{
  display:none!important;
  content:none!important;
}

/* Citas: ancho completo, texto horizontal */
html.ja3-app-mode .ja3-content blockquote,
html.ja3-app-mode .ja3-content .ja31-quote{
  display:block!important;
  float:none!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin:18px 0!important;
  padding:17px 18px!important;
  box-sizing:border-box!important;
  border:0!important;
  border-left:4px solid #ff8a22!important;
  border-radius:10px!important;
  background:#fff8ec!important;
  writing-mode:horizontal-tb!important;
  word-break:normal!important;
  overflow-wrap:break-word!important;
}

html.ja3-app-mode .ja3-content blockquote>*{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  writing-mode:horizontal-tb!important;
  word-break:normal!important;
  overflow-wrap:break-word!important;
}

/* Imágenes y figuras reales */
html.ja3-app-mode .ja3-content figure{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin:18px 0!important;
  float:none!important;
}

html.ja3-app-mode .ja3-content img{
  max-width:100%!important;
  height:auto!important;
}

/* Tablas: scroll horizontal en vez de comprimir texto */
html.ja3-app-mode .ja3-content .cl18-table,
html.ja3-app-mode .ja3-content table{
  display:table!important;
  width:100%!important;
  min-width:560px!important;
  table-layout:auto!important;
  writing-mode:horizontal-tb!important;
}

html.ja3-app-mode .ja3-content .cl18-table{
  overflow:visible!important;
}

/* Reset extra específico para móvil */
@media(max-width:760px){
  html.ja3-app-mode .ja3-content{
    padding:16px!important;
  }

  html.ja3-app-mode .ja3-content,
  html.ja3-app-mode .ja3-content *{
    writing-mode:horizontal-tb!important;
    text-orientation:mixed!important;
  }

  html.ja3-app-mode .ja3-content div,
  html.ja3-app-mode .ja3-content section,
  html.ja3-app-mode .ja3-content article,
  html.ja3-app-mode .ja3-content aside{
    max-width:100%!important;
    min-width:0!important;
  }

  html.ja3-app-mode .ja3-content p,
  html.ja3-app-mode .ja3-content blockquote,
  html.ja3-app-mode .ja3-content h2,
  html.ja3-app-mode .ja3-content h3,
  html.ja3-app-mode .ja3-content h4,
  html.ja3-app-mode .ja3-content h5,
  html.ja3-app-mode .ja3-content h6{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    word-break:normal!important;
    overflow-wrap:break-word!important;
    white-space:normal!important;
    writing-mode:horizontal-tb!important;
  }

  /* Gutenberg/Elementor/tema: neutralización de columnas solo dentro de la PWA */
  html.ja3-app-mode .ja3-content [class*="column"],
  html.ja3-app-mode .ja3-content [class*="columns"],
  html.ja3-app-mode .ja3-content [class*="grid"],
  html.ja3-app-mode .ja3-content [class*="flex"],
  html.ja3-app-mode .ja3-content [class*="row"],
  html.ja3-app-mode .ja3-content [class*="vc_"],
  html.ja3-app-mode .ja3-content [class*="elementor"]{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    float:none!important;
    grid-template-columns:1fr!important;
    flex-basis:auto!important;
  }
}


/* =========================================================
   CAREERLINK PWA 1.9 — OPCIÓN 3 APROBADA
   Sin cabecera superior / menú / buscador
   CTA oficial únicamente al final
   ========================================================= */

:root{
  --cl19-blue:#0d63c7;
  --cl19-blue-dark:#103d7a;
  --cl19-teal:#12a8a8;
  --cl19-teal-dark:#0c8f90;
  --cl19-cyan:#eaf9fb;
  --cl19-soft:#f6fbff;
  --cl19-navy:#0b2a55;
  --cl19-text:#173653;
  --cl19-muted:#647c94;
  --cl19-line:#d9e9f2;
}

/* Quitar definitivamente barra superior, menú y buscador */
.ja3-topbar,
.cl15-topbar,
.cl15-main-nav,
.cl15-head-search,
.cl16-mobile-actions{
  display:none!important;
}

html.ja3-app-mode body{
  padding-top:0!important;
}

/* Layout general */
.cl19-layout{
  width:min(1280px,calc(100% - 34px))!important;
  margin:18px auto 92px!important;
  display:grid!important;
  grid-template-columns:minmax(0,2.05fr) minmax(285px,.78fr)!important;
  gap:20px!important;
  align-items:start!important;
}

html.ja3-app-mode .ja3-article{
  border:0!important;
  box-shadow:none!important;
  background:transparent!important;
  overflow:visible!important;
}

/* Volver / Inicio */
.cl19-entry-actions{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  margin:0 0 12px!important;
}

.cl19-entry-actions button,
.cl19-entry-actions a{
  min-height:40px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  padding:0 15px!important;
  border-radius:10px!important;
  font-size:10.5px!important;
  font-weight:950!important;
  text-decoration:none!important;
}

.cl19-back{
  border:1px solid #cbdce9!important;
  background:#fff!important;
  color:var(--cl19-navy)!important;
}

.cl19-home{
  border:1px solid #bfe7e7!important;
  background:#effafa!important;
  color:var(--cl19-teal-dark)!important;
}

/* Hero opción 3: foto izquierda, texto derecha */
.cl19-hero-card{
  display:grid!important;
  grid-template-columns:minmax(260px,42%) minmax(0,58%)!important;
  min-height:300px!important;
  background:#fff!important;
  border:1px solid var(--cl19-line)!important;
  border-radius:17px!important;
  overflow:hidden!important;
  box-shadow:0 8px 24px rgba(35,70,100,.06)!important;
}

.cl19-hero-media{
  position:relative!important;
  min-height:300px!important;
  background:#eaf2f7 center/cover no-repeat!important;
}

.cl19-media-shade{
  position:absolute!important;
  inset:0!important;
  background:linear-gradient(180deg,rgba(9,39,74,.02),rgba(9,39,74,.08))!important;
}

.cl19-hero-copy{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  padding:28px 30px!important;
}

.cl19-company{
  margin-bottom:6px!important;
  color:var(--cl19-blue)!important;
  font-size:26px!important;
  font-weight:950!important;
  line-height:1!important;
}

.cl19-hero-copy h1{
  margin:0 0 8px!important;
  color:var(--cl19-navy)!important;
  font-size:clamp(28px,3vw,42px)!important;
  line-height:1.06!important;
}

.cl19-hero-copy p{
  margin:0 0 16px!important;
  color:#48637f!important;
  font-size:13.5px!important;
  line-height:1.5!important;
}

.cl19-hero-meta{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:8px 18px!important;
}

.cl19-hero-meta span{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  color:#31506e!important;
  font-size:10px!important;
}

.cl19-hero-meta b{
  color:var(--cl19-navy)!important;
}

.cl19-hero-tags{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:7px!important;
  margin:10px 0 14px!important;
}

.cl19-hero-tags span{
  min-height:25px!important;
  display:inline-flex!important;
  align-items:center!important;
  padding:0 10px!important;
  border-radius:999px!important;
  background:#eaf4ff!important;
  color:#0c64b6!important;
  font-size:8.5px!important;
  font-weight:950!important;
  text-transform:uppercase!important;
}

/* Índice En este artículo */
.cl19-toc{
  margin:0 0 14px!important;
  padding:16px 18px!important;
  border:1px solid #cfe6ef!important;
  border-radius:13px!important;
  background:linear-gradient(135deg,#f7fcff,#eefbfb)!important;
}

.cl19-toc h3{
  margin:0 0 11px!important;
  color:var(--cl19-navy)!important;
  font-size:14px!important;
}

.cl19-toc-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:7px 18px!important;
}

.cl19-toc-grid a{
  display:flex!important;
  align-items:flex-start!important;
  gap:8px!important;
  color:#244665!important;
  text-decoration:none!important;
  font-size:10px!important;
}

.cl19-toc-grid b{
  width:19px!important;
  height:19px!important;
  flex:0 0 19px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:50%!important;
  background:var(--cl19-teal)!important;
  color:#fff!important;
  font-size:8px!important;
}

/* Contenido original: nunca quitar enlaces internos */
html.ja3-app-mode .ja3-content{
  padding:22px 24px!important;
  border:1px solid #e1ebf1!important;
  border-radius:14px!important;
  background:#fff!important;
  box-shadow:0 6px 18px rgba(34,65,91,.04)!important;
}

html.ja3-app-mode .ja3-content a:not(.ja35-official-fixed){
  color:#0c65c7!important;
  text-decoration:underline!important;
  text-underline-offset:3px!important;
  font-weight:800!important;
}

/* Sidebar */
.cl19-sidebar{
  position:sticky!important;
  top:16px!important;
  display:flex!important;
  flex-direction:column!important;
  gap:14px!important;
}

.cl19-side-card{
  padding:16px!important;
  background:#fff!important;
  border:1px solid var(--cl19-line)!important;
  border-radius:14px!important;
  box-shadow:0 7px 20px rgba(33,67,96,.05)!important;
}

.cl19-side-card h3{
  margin:0 0 12px!important;
  color:var(--cl19-navy)!important;
  font-size:14px!important;
}

.cl19-quick-list{
  display:grid!important;
  gap:8px!important;
}

.cl19-quick-list>div{
  display:grid!important;
  grid-template-columns:30px 1fr!important;
  gap:1px 9px!important;
  align-items:center!important;
  padding:10px!important;
  border-radius:10px!important;
  background:#f5f9ff!important;
}

.cl19-quick-list span{
  grid-row:1/3!important;
  width:30px!important;
  height:30px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:9px!important;
  background:#e7f2ff!important;
  color:var(--cl19-blue)!important;
  font-size:13px!important;
  font-weight:950!important;
}

.cl19-quick-list small{
  color:#657a90!important;
  font-size:8px!important;
}

.cl19-quick-list b{
  color:#123f73!important;
  font-size:10px!important;
  line-height:1.25!important;
}

.cl19-related-list{
  display:flex!important;
  flex-direction:column!important;
  gap:10px!important;
}

.cl19-related-list>a{
  display:grid!important;
  grid-template-columns:78px minmax(0,1fr)!important;
  gap:9px!important;
  align-items:center!important;
  text-decoration:none!important;
}

.cl19-related-list img,
.cl19-rel-ph{
  width:78px!important;
  height:58px!important;
  display:grid!important;
  place-items:center!important;
  object-fit:cover!important;
  border-radius:9px!important;
  background:linear-gradient(135deg,var(--cl19-blue),var(--cl19-teal))!important;
  color:#fff!important;
  font-weight:950!important;
}

.cl19-related-list a>span:last-child{
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
}

.cl19-related-list small{
  display:inline-flex!important;
  margin-bottom:4px!important;
  padding:3px 6px!important;
  border-radius:999px!important;
  background:#eaf4ff!important;
  color:#0d65b9!important;
  font-size:7px!important;
  font-weight:950!important;
}

.cl19-related-list b{
  display:-webkit-box!important;
  -webkit-line-clamp:2!important;
  -webkit-box-orient:vertical!important;
  overflow:hidden!important;
  color:#173653!important;
  font-size:9.5px!important;
  line-height:1.3!important;
}

.cl19-related-list em{
  margin-top:4px!important;
  color:#0d65c7!important;
  font-size:8px!important;
  font-style:normal!important;
  font-weight:850!important;
}

/* CTA oficial SOLO al final */
.cl19-final-official{
  margin:16px 0 0!important;
  padding:17px!important;
  display:grid!important;
  grid-template-columns:46px minmax(0,1fr)!important;
  gap:14px!important;
  border:1px solid #bee7e6!important;
  border-radius:14px!important;
  background:linear-gradient(135deg,#f4fdfd,#ebf9f9)!important;
}

.cl19-final-icon{
  width:46px!important;
  height:46px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:50%!important;
  background:linear-gradient(135deg,var(--cl19-teal),var(--cl19-teal-dark))!important;
  color:#fff!important;
  font-size:20px!important;
  font-weight:950!important;
}

.cl19-final-copy small{
  display:block!important;
  margin-bottom:2px!important;
  color:var(--cl19-teal-dark)!important;
  font-size:8px!important;
  font-weight:950!important;
  letter-spacing:.1em!important;
}

.cl19-final-copy h3{
  margin:0 0 5px!important;
  color:var(--cl19-navy)!important;
  font-size:15px!important;
}

.cl19-final-copy p{
  margin:0 0 11px!important;
  color:#526f86!important;
  font-size:10px!important;
  line-height:1.45!important;
}

.cl19-final-copy a{
  width:100%!important;
  min-height:44px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
  border-radius:9px!important;
  background:linear-gradient(135deg,var(--cl19-teal),var(--cl19-teal-dark))!important;
  color:#fff!important;
  text-decoration:none!important;
  font-size:10.5px!important;
  font-weight:950!important;
}

/* Quitar CTA oficial de cualquier posición anterior */
.cl15-official-main,
.ja31-footer-cta,
.ja3-official,
.ja35-official-card,
.ja36-official-card{
  display:none!important;
}

/* Quitar antiguos bloques visuales que ya no corresponden */
.cl15-entry-head,
.cl15-article-toc,
.cl15-sidebar,
.ja49-related{
  display:none!important;
}

/* Mobile */
@media(max-width:760px){
  .cl19-layout{
    width:calc(100% - 16px)!important;
    margin:10px auto 92px!important;
    display:block!important;
  }

  .cl19-entry-actions{
    position:sticky!important;
    top:0!important;
    z-index:30!important;
    padding:8px 0!important;
    background:rgba(246,251,255,.96)!important;
    backdrop-filter:blur(10px)!important;
  }

  .cl19-hero-card{
    display:block!important;
    min-height:0!important;
  }

  .cl19-hero-media{
    min-height:0!important;
    aspect-ratio:7/4!important;
    background-size:contain!important;
    background-repeat:no-repeat!important;
    background-position:center!important;
  }

  .cl19-hero-copy{
    padding:17px 16px!important;
  }

  .cl19-company{
    font-size:22px!important;
  }

  .cl19-hero-copy h1{
    font-size:25px!important;
  }

  .cl19-hero-copy p{
    font-size:11.5px!important;
  }

  .cl19-toc{
    margin-top:12px!important;
  }

  .cl19-toc-grid{
    grid-template-columns:1fr!important;
  }

  html.ja3-app-mode .ja3-content{
    padding:17px 15px!important;
  }

  .cl19-sidebar{
    position:static!important;
    margin-top:14px!important;
  }

  .cl19-final-official{
    grid-template-columns:38px minmax(0,1fr)!important;
    padding:14px!important;
  }

  .cl19-final-icon{
    width:38px!important;
    height:38px!important;
    font-size:17px!important;
  }
}


/* =========================================================
   CAREERLINK PWA 2.0 — IMAGEN + ENLACES RESTAURADOS
   ========================================================= */

/* Imagen destacada real dentro del hero */
.cl19-hero-media{
  position:relative!important;
  overflow:hidden!important;
  background:#eaf2f7!important;
}

.cl20-featured-image{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  object-fit:cover!important;
  object-position:center!important;
  border:0!important;
  border-radius:0!important;
  transform:none!important;
}

.cl19-media-shade{
  z-index:2!important;
  pointer-events:none!important;
}

/* ---------------------------------------------------------
   ENLACES INTERNOS
   No se eliminan, no se reemplaza su href.
   --------------------------------------------------------- */
html.ja3-app-mode .ja3-content a.cl20-internal-link{
  color:#0d63c7!important;
  font-weight:850!important;
  text-decoration:none!important;
  border-bottom:1px solid rgba(13,99,199,.30)!important;
  padding-bottom:1px!important;
}

html.ja3-app-mode .ja3-content a.cl20-internal-link:hover{
  color:#084b99!important;
  border-bottom-color:#084b99!important;
}

/* Enlace interno que originalmente era un bloque/botón */
html.ja3-app-mode .ja3-content .cl20-link-card-internal{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  margin:16px 0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
}

html.ja3-app-mode .ja3-content .cl20-link-card-internal a.cl20-link-card-anchor{
  width:100%!important;
  min-height:48px!important;
  box-sizing:border-box!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  padding:0 16px!important;
  border:1px solid #c9e2f6!important;
  border-radius:11px!important;
  background:linear-gradient(135deg,#f5fbff,#eaf6ff)!important;
  color:#0b559e!important;
  text-decoration:none!important;
  font-size:11px!important;
  font-weight:950!important;
  box-shadow:0 6px 15px rgba(13,99,199,.06)!important;
}

html.ja3-app-mode .ja3-content .cl20-link-card-internal a.cl20-link-card-anchor::after{
  content:"→"!important;
  width:28px!important;
  height:28px!important;
  flex:0 0 28px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:8px!important;
  background:#dceeff!important;
  color:#0d63c7!important;
  font-size:15px!important;
}

/* ---------------------------------------------------------
   ENLACES EXTERNOS NO OFICIALES
   --------------------------------------------------------- */
html.ja3-app-mode .ja3-content a.cl20-external-link{
  color:#0b8f90!important;
  font-weight:900!important;
  text-decoration:none!important;
  border-bottom:1px solid rgba(11,143,144,.32)!important;
}

html.ja3-app-mode .ja3-content a.cl20-external-link::after{
  content:" ↗"!important;
  color:#ff8124!important;
  font-size:.9em!important;
}

html.ja3-app-mode .ja3-content .cl20-link-card-external{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  margin:16px 0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
}

html.ja3-app-mode .ja3-content .cl20-link-card-external a.cl20-link-card-anchor{
  width:100%!important;
  min-height:48px!important;
  box-sizing:border-box!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  padding:0 16px!important;
  border:1px solid #bfe8e7!important;
  border-radius:11px!important;
  background:linear-gradient(135deg,#f3fdfd,#e9f9f9)!important;
  color:#087f80!important;
  text-decoration:none!important;
  font-size:11px!important;
  font-weight:950!important;
  box-shadow:0 6px 15px rgba(14,166,166,.06)!important;
}

html.ja3-app-mode .ja3-content .cl20-link-card-external a.cl20-link-card-anchor::after{
  content:"↗"!important;
  width:28px!important;
  height:28px!important;
  flex:0 0 28px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:8px!important;
  background:#fff0e7!important;
  color:#ff8124!important;
  font-size:14px!important;
}

/* El CTA oficial original sigue fuera del contenido; aparece solo al final */
.cl20-official-inline-hidden,
.cl20-official-inline-wrap-hidden{
  display:none!important;
}

/* No aplicar la regla genérica azul a nuestros enlaces ya diseñados */
html.ja3-app-mode .ja3-content a.cl20-internal-link,
html.ja3-app-mode .ja3-content a.cl20-external-link{
  text-underline-offset:0!important;
}

/* Mobile: imagen completa, sin recorte */
@media(max-width:760px){
  .cl19-hero-media{
    aspect-ratio:7/4!important;
    min-height:0!important;
    height:auto!important;
  }

  .cl20-featured-image{
    position:absolute!important;
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
    object-position:center!important;
    background:#edf3f6!important;
  }

  html.ja3-app-mode .ja3-content .cl20-link-card-internal a.cl20-link-card-anchor,
  html.ja3-app-mode .ja3-content .cl20-link-card-external a.cl20-link-card-anchor{
    min-height:46px!important;
    padding:10px 12px!important;
    font-size:10px!important;
    line-height:1.35!important;
  }
}


/* =========================================================
   CAREERLINK PWA 2.1 — IMAGEN COMPLETA + DESVANECIDO + LINKS PREMIUM
   ========================================================= */

/* Hero: no recortar la imagen destacada */
.cl19-hero-media{
  position:relative!important;
  overflow:hidden!important;
  background:
    linear-gradient(180deg,#eef6fb,#f8fbfd)!important;
}

.cl20-featured-image{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  display:block!important;
  object-fit:contain!important;
  object-position:center!important;
  background:#f1f6f9!important;
  z-index:1!important;
}

/* Desvanecido hacia el panel de texto */
.cl19-hero-media::after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:2!important;
  pointer-events:none!important;
  background:
    linear-gradient(
      90deg,
      rgba(245,250,253,0) 0%,
      rgba(245,250,253,0) 64%,
      rgba(245,250,253,.28) 78%,
      rgba(255,255,255,.76) 94%,
      rgba(255,255,255,1) 100%
    )!important;
}

.cl19-media-shade{
  z-index:3!important;
  background:
    linear-gradient(180deg,rgba(5,28,48,.01),rgba(5,28,48,.05))!important;
}

/* ---------------------------------------------------------
   ENLACE INTERNO: tarjeta azul llamativa
   --------------------------------------------------------- */
html.ja3-app-mode .ja3-content .cl21-link-card-internal{
  display:block!important;
  width:100%!important;
  margin:18px 0!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
}

html.ja3-app-mode .ja3-content .cl21-link-card-internal a.cl21-link-card-anchor{
  width:100%!important;
  min-height:58px!important;
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:42px minmax(0,1fr) 34px!important;
  align-items:center!important;
  gap:12px!important;
  padding:10px 14px!important;
  border:1px solid #bcd8f6!important;
  border-radius:14px!important;
  background:
    radial-gradient(circle at 95% 10%,rgba(13,99,199,.10),transparent 34%),
    linear-gradient(135deg,#f7fbff,#eaf4ff)!important;
  color:#0b4f98!important;
  text-decoration:none!important;
  box-shadow:0 8px 22px rgba(13,99,199,.08)!important;
}

.cl21-link-card-internal .cl21-link-icon{
  width:42px!important;
  height:42px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:12px!important;
  background:linear-gradient(135deg,#0d63c7,#0b4f98)!important;
  color:#fff!important;
  font-size:19px!important;
  font-weight:950!important;
  box-shadow:0 5px 13px rgba(13,99,199,.20)!important;
}

.cl21-link-card-internal .cl21-link-arrow{
  width:30px!important;
  height:30px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:9px!important;
  background:#dcecff!important;
  color:#0d63c7!important;
  font-size:16px!important;
  font-weight:950!important;
}

/* ---------------------------------------------------------
   ENLACE EXTERNO: tarjeta teal + naranja
   --------------------------------------------------------- */
html.ja3-app-mode .ja3-content .cl21-link-card-external{
  display:block!important;
  width:100%!important;
  margin:18px 0!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
}

html.ja3-app-mode .ja3-content .cl21-link-card-external a.cl21-link-card-anchor{
  width:100%!important;
  min-height:58px!important;
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:42px minmax(0,1fr) 34px!important;
  align-items:center!important;
  gap:12px!important;
  padding:10px 14px!important;
  border:1px solid #bae7e6!important;
  border-radius:14px!important;
  background:
    radial-gradient(circle at 92% 12%,rgba(255,129,36,.12),transparent 30%),
    linear-gradient(135deg,#f4fefe,#e9fafa)!important;
  color:#087f80!important;
  text-decoration:none!important;
  box-shadow:0 8px 22px rgba(14,166,166,.08)!important;
}

.cl21-link-card-external .cl21-link-icon{
  width:42px!important;
  height:42px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:12px!important;
  background:linear-gradient(135deg,#0fa8a8,#087f80)!important;
  color:#fff!important;
  font-size:19px!important;
  font-weight:950!important;
  box-shadow:0 5px 13px rgba(14,166,166,.20)!important;
}

.cl21-link-card-external .cl21-link-arrow{
  width:30px!important;
  height:30px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:9px!important;
  background:#fff0e6!important;
  color:#ff8124!important;
  font-size:16px!important;
  font-weight:950!important;
}

/* Inline links dentro de párrafos */
html.ja3-app-mode .ja3-content a.cl21-internal-link:not(.cl21-link-card-anchor){
  color:#0d63c7!important;
  font-weight:900!important;
  text-decoration:none!important;
  border-bottom:2px solid rgba(13,99,199,.22)!important;
  padding-bottom:1px!important;
}

html.ja3-app-mode .ja3-content a.cl21-internal-link:not(.cl21-link-card-anchor)::before{
  content:"↪ "!important;
  color:#0d63c7!important;
  font-weight:950!important;
}

html.ja3-app-mode .ja3-content a.cl21-external-link:not(.cl21-link-card-anchor){
  color:#0b8f90!important;
  font-weight:900!important;
  text-decoration:none!important;
  border-bottom:2px solid rgba(11,143,144,.20)!important;
  padding-bottom:1px!important;
}

html.ja3-app-mode .ja3-content a.cl21-external-link:not(.cl21-link-card-anchor)::after{
  content:" ↗"!important;
  color:#ff8124!important;
  font-weight:950!important;
}

/* Hover */
html.ja3-app-mode .ja3-content .cl21-link-card-internal a:hover,
html.ja3-app-mode .ja3-content .cl21-link-card-external a:hover{
  transform:translateY(-2px)!important;
  box-shadow:0 12px 28px rgba(30,71,104,.12)!important;
}

/* CTA final oficial más visual */
.cl19-final-official{
  border:1px solid #b9e4e3!important;
  background:
    radial-gradient(circle at 92% 10%,rgba(255,129,36,.11),transparent 34%),
    linear-gradient(135deg,#f5fefe,#eafafa)!important;
  box-shadow:0 10px 26px rgba(14,166,166,.08)!important;
}

.cl19-final-icon{
  background:linear-gradient(135deg,#0ea6a6,#0b8e8e)!important;
  box-shadow:0 7px 16px rgba(14,166,166,.18)!important;
}

.cl19-final-copy a{
  min-height:48px!important;
  border-radius:11px!important;
  background:linear-gradient(135deg,#0ea6a6,#0b8e8e)!important;
  box-shadow:0 8px 18px rgba(14,166,166,.18)!important;
}

/* Mobile: fade vertical instead of horizontal */
@media(max-width:760px){
  .cl19-hero-media::after{
    background:
      linear-gradient(
        180deg,
        rgba(245,250,253,0) 0%,
        rgba(245,250,253,0) 67%,
        rgba(245,250,253,.22) 82%,
        rgba(255,255,255,.82) 96%,
        rgba(255,255,255,1) 100%
      )!important;
  }

  .cl20-featured-image{
    object-fit:contain!important;
  }

  html.ja3-app-mode .ja3-content .cl21-link-card-internal a.cl21-link-card-anchor,
  html.ja3-app-mode .ja3-content .cl21-link-card-external a.cl21-link-card-anchor{
    grid-template-columns:38px minmax(0,1fr) 30px!important;
    min-height:54px!important;
    padding:9px 11px!important;
    font-size:10px!important;
  }

  .cl21-link-card-internal .cl21-link-icon,
  .cl21-link-card-external .cl21-link-icon{
    width:38px!important;
    height:38px!important;
    border-radius:11px!important;
    font-size:17px!important;
  }
}


/* =========================================================
   CAREERLINK PWA 2.2 — SIGUIENTE ARTÍCULO VISUAL
   Diseño relacionado con la entrada a visitar.
   ========================================================= */

html.ja3-app-mode .ja3-content .cl22-next-wrap{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  margin:22px 0!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
}

html.ja3-app-mode .ja3-content .cl22-next-card{
  width:100%!important;
  max-width:100%!important;
  display:grid!important;
  grid-template-columns:minmax(250px,38%) minmax(0,62%)!important;
  grid-template-rows:1fr auto!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
  border:1px solid #bfe7ed!important;
  border-radius:20px!important;
  background:
    radial-gradient(circle at 92% 18%,rgba(18,168,168,.10),transparent 27%),
    linear-gradient(135deg,#ffffff 0%,#f7fcff 66%,#eefbfb 100%)!important;
  color:#173653!important;
  text-decoration:none!important;
  box-shadow:0 12px 30px rgba(27,72,100,.09)!important;
  transition:transform .2s ease,box-shadow .2s ease!important;
}

html.ja3-app-mode .ja3-content .cl22-next-card:hover{
  transform:translateY(-3px)!important;
  box-shadow:0 17px 38px rgba(27,72,100,.14)!important;
}

/* Imagen de la entrada enlazada */
.cl22-next-media{
  position:relative!important;
  min-height:310px!important;
  grid-row:1!important;
  overflow:hidden!important;
  background:#e9f1f5!important;
}

.cl22-next-media img{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  object-fit:cover!important;
  object-position:center!important;
  border:0!important;
  border-radius:0!important;
}

.cl22-next-ph{
  width:100%!important;
  height:100%!important;
  min-height:310px!important;
  display:grid!important;
  place-items:center!important;
  background:linear-gradient(135deg,#0d63c7,#12a8a8)!important;
  color:#fff!important;
  font-size:44px!important;
  font-weight:950!important;
}

.cl22-next-media-fade{
  position:absolute!important;
  inset:0!important;
  z-index:2!important;
  pointer-events:none!important;
  background:
    linear-gradient(
      90deg,
      rgba(9,38,72,.02) 0%,
      rgba(9,38,72,.02) 62%,
      rgba(255,255,255,.18) 78%,
      rgba(255,255,255,.88) 100%
    )!important;
}

.cl22-next-company{
  position:absolute!important;
  left:18px!important;
  bottom:18px!important;
  z-index:3!important;
  max-width:80%!important;
  padding:9px 13px!important;
  border-radius:11px!important;
  background:rgba(255,255,255,.94)!important;
  color:#0b2a55!important;
  font-size:12px!important;
  font-weight:950!important;
  box-shadow:0 6px 16px rgba(20,48,74,.12)!important;
}

/* Panel derecho */
.cl22-next-main{
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  padding:24px 27px 22px!important;
}

.cl22-next-topline{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  margin-bottom:11px!important;
}

.cl22-next-label,
.cl22-next-kind{
  display:inline-flex!important;
  align-items:center!important;
  min-height:28px!important;
  padding:0 11px!important;
  border-radius:999px!important;
  font-size:8.5px!important;
  font-weight:950!important;
  letter-spacing:.04em!important;
}

.cl22-next-label{
  gap:6px!important;
  background:#e7f1ff!important;
  color:#0d55a5!important;
}

.cl22-next-label i{
  color:#0d63c7!important;
  font-style:normal!important;
  font-size:12px!important;
}

.cl22-next-kind{
  background:#e9f9f8!important;
  color:#087f80!important;
}

.cl22-next-main h3{
  margin:0 0 9px!important;
  color:#0b2a55!important;
  font-size:clamp(24px,2.7vw,38px)!important;
  line-height:1.06!important;
  letter-spacing:-.4px!important;
}

.cl22-next-main p{
  display:-webkit-box!important;
  -webkit-line-clamp:3!important;
  -webkit-box-orient:vertical!important;
  overflow:hidden!important;
  margin:0 0 16px!important;
  color:#5a718a!important;
  font-size:12px!important;
  line-height:1.55!important;
}

.cl22-next-facts{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:9px 16px!important;
  margin-bottom:17px!important;
}

.cl22-next-facts span{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  color:#34536f!important;
  font-size:9.5px!important;
}

.cl22-next-facts i{
  width:28px!important;
  height:28px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:50%!important;
  background:#e9f4ff!important;
  color:#0d63c7!important;
  font-style:normal!important;
  font-weight:950!important;
}

.cl22-next-cta{
  width:min(310px,100%)!important;
  min-height:48px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  padding:0 17px!important;
  border-radius:12px!important;
  background:linear-gradient(135deg,#12a8a8,#087f80)!important;
  color:#fff!important;
  font-size:12px!important;
  font-weight:950!important;
  box-shadow:0 8px 18px rgba(18,168,168,.20)!important;
}

.cl22-next-cta b{
  font-size:21px!important;
}

/* Pie como en el mockup */
.cl22-next-footer{
  grid-column:1/-1!important;
  min-height:58px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:16px!important;
  padding:0 24px!important;
  border-top:1px solid #dcecf1!important;
  background:rgba(255,255,255,.82)!important;
  color:#17446e!important;
  font-size:10px!important;
  font-weight:850!important;
}

.cl22-next-footer i{
  color:#12a8a8!important;
  font-style:normal!important;
}

.cl22-next-footer em{
  color:#7189a2!important;
  font-style:normal!important;
  font-weight:600!important;
}

/* Eliminar estilos viejos del contenedor que causaban flechas aisladas */
html.ja3-app-mode .ja3-content .cl22-next-wrap::before,
html.ja3-app-mode .ja3-content .cl22-next-wrap::after,
html.ja3-app-mode .ja3-content .cl22-next-card::before,
html.ja3-app-mode .ja3-content .cl22-next-card::after{
  display:none!important;
  content:none!important;
}

/* Mobile: card vertical, imagen completa arriba */
@media(max-width:760px){
  html.ja3-app-mode .ja3-content .cl22-next-card{
    display:block!important;
    border-radius:16px!important;
  }

  .cl22-next-media{
    width:100%!important;
    min-height:0!important;
    aspect-ratio:7/4!important;
  }

  .cl22-next-media img{
    object-fit:contain!important;
    background:#edf3f6!important;
  }

  .cl22-next-media-fade{
    background:
      linear-gradient(
        180deg,
        rgba(9,38,72,0) 0%,
        rgba(9,38,72,0) 68%,
        rgba(255,255,255,.20) 82%,
        rgba(255,255,255,.88) 100%
      )!important;
  }

  .cl22-next-company{
    left:11px!important;
    bottom:11px!important;
    padding:7px 10px!important;
    font-size:9.5px!important;
  }

  .cl22-next-main{
    padding:16px 14px 15px!important;
  }

  .cl22-next-main h3{
    font-size:23px!important;
  }

  .cl22-next-main p{
    font-size:10.5px!important;
  }

  .cl22-next-topline{
    align-items:flex-start!important;
  }

  .cl22-next-label,
  .cl22-next-kind{
    min-height:25px!important;
    padding:0 8px!important;
    font-size:7.5px!important;
  }

  .cl22-next-facts{
    gap:7px 10px!important;
  }

  .cl22-next-facts span{
    font-size:8.5px!important;
  }

  .cl22-next-cta{
    width:100%!important;
    min-height:44px!important;
  }

  .cl22-next-footer{
    min-height:52px!important;
    padding:10px 14px!important;
    align-items:flex-start!important;
    flex-direction:column!important;
    justify-content:center!important;
    gap:2px!important;
    font-size:8.5px!important;
  }
}


/* =========================================================
   CAREERLINK PWA 2.3 — CORRECCIÓN REAL DEL "VER VACANTE"
   ========================================================= */

/* El wrapper del nuevo preview no hereda el diseño viejo del artículo */
html.ja3-app-mode .ja3-content .cl22-next-wrap{
  min-height:0!important;
  height:auto!important;
  background:transparent!important;
  background-image:none!important;
  border:0!important;
  border-left:0!important;
  border-right:0!important;
  box-shadow:none!important;
  overflow:visible!important;
}

html.ja3-app-mode .ja3-content .cl22-next-wrap > *:not(.cl22-next-card){
  display:none!important;
}

/* El placeholder también es visual si la entrada destino no tiene miniatura */
.cl22-next-ph{
  min-height:100%!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:4px!important;
  background:
    radial-gradient(circle at 75% 20%,rgba(255,255,255,.20),transparent 28%),
    linear-gradient(135deg,#0d63c7 0%,#12a8a8 72%,#ff8124 100%)!important;
}

.cl22-next-ph span{
  color:#fff!important;
  font-size:48px!important;
  font-weight:950!important;
  line-height:1!important;
}

.cl22-next-ph small{
  color:rgba(255,255,255,.88)!important;
  font-size:10px!important;
  font-weight:800!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}

/* Nunca mostrar los iconos/flechas sueltos del viejo diseño en este bloque */
html.ja3-app-mode .ja3-content .cl22-next-wrap .cl21-link-icon,
html.ja3-app-mode .ja3-content .cl22-next-wrap .cl21-link-arrow,
html.ja3-app-mode .ja3-content .cl22-next-wrap > a:not(.cl22-next-card),
html.ja3-app-mode .ja3-content .cl22-next-wrap > span{
  display:none!important;
}

/* Asegura que el preview se vea como una sola pieza completa */
html.ja3-app-mode .ja3-content .cl22-next-card{
  position:relative!important;
  min-height:310px!important;
  opacity:1!important;
  visibility:visible!important;
}

@media(max-width:760px){
  html.ja3-app-mode .ja3-content .cl22-next-card{
    min-height:0!important;
  }
}


/* =========================================================
   CAREERLINK PWA 2.4 — TARJETA INTERNA IGUAL AL EJEMPLO
   ========================================================= */

html.ja3-app-mode .ja3-content .cl24-next-wrap{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  margin:24px 0!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}

html.ja3-app-mode .ja3-content .cl24-next-card{
  position:relative!important;
  width:100%!important;
  max-width:100%!important;
  min-height:330px!important;
  display:grid!important;
  grid-template-columns:minmax(330px,40%) minmax(0,60%)!important;
  grid-template-rows:minmax(270px,1fr) 58px!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
  border:1px solid #b9e5ec!important;
  border-radius:22px!important;
  background:
    radial-gradient(circle at 92% 18%,rgba(18,168,168,.08),transparent 28%),
    linear-gradient(135deg,#ffffff 0%,#f8fcff 64%,#effafa 100%)!important;
  color:#163553!important;
  text-decoration:none!important;
  border-bottom:1px solid #b9e5ec!important;
  box-shadow:0 14px 34px rgba(26,69,97,.10)!important;
  transition:transform .2s ease,box-shadow .2s ease!important;
}

/* Cancelar subrayados heredados del contenido */
html.ja3-app-mode .ja3-content .cl24-next-card,
html.ja3-app-mode .ja3-content .cl24-next-card *,
html.ja3-app-mode .ja3-content .cl24-next-card:hover,
html.ja3-app-mode .ja3-content .cl24-next-card:focus{
  text-decoration:none!important;
  border-bottom-color:transparent!important;
}

html.ja3-app-mode .ja3-content .cl24-next-card:hover{
  transform:translateY(-3px)!important;
  box-shadow:0 18px 42px rgba(26,69,97,.14)!important;
}

/* Imagen grande, ocupando todo el panel izquierdo */
.cl24-next-media{
  position:relative!important;
  grid-row:1!important;
  min-height:270px!important;
  overflow:hidden!important;
  background:#eaf2f6!important;
}

.cl24-next-media img{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  object-fit:cover!important;
  object-position:center!important;
  border:0!important;
  border-radius:0!important;
}

.cl24-next-media-fade{
  position:absolute!important;
  inset:0!important;
  z-index:2!important;
  pointer-events:none!important;
  background:
    linear-gradient(
      90deg,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,0) 66%,
      rgba(255,255,255,.24) 80%,
      rgba(255,255,255,.82) 96%,
      rgba(255,255,255,1) 100%
    )!important;
}

.cl24-company-pill{
  position:absolute!important;
  left:18px!important;
  bottom:18px!important;
  z-index:3!important;
  max-width:76%!important;
  padding:10px 14px!important;
  border-radius:13px!important;
  background:rgba(255,255,255,.96)!important;
  color:#0b2a55!important;
  box-shadow:0 7px 18px rgba(18,48,75,.14)!important;
}

.cl24-company-pill b{
  display:block!important;
  font-size:14px!important;
  line-height:1.05!important;
}

.cl24-company-pill small{
  display:block!important;
  margin-top:3px!important;
  color:#5e748b!important;
  font-size:8px!important;
  line-height:1.2!important;
}

/* Placeholder visual */
.cl24-next-ph{
  position:absolute!important;
  inset:0!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:5px!important;
  background:
    radial-gradient(circle at 76% 18%,rgba(255,255,255,.22),transparent 28%),
    linear-gradient(135deg,#0d63c7,#12a8a8 70%,#ff8124)!important;
}

.cl24-next-ph span{
  color:#fff!important;
  font-size:48px!important;
  font-weight:950!important;
}

.cl24-next-ph small{
  color:rgba(255,255,255,.9)!important;
  font-size:10px!important;
  font-weight:800!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}

/* Panel derecho */
.cl24-next-main{
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  padding:25px 28px 22px!important;
}

.cl24-next-topline{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  margin-bottom:13px!important;
}

.cl24-next-label,
.cl24-next-kind{
  display:inline-flex!important;
  align-items:center!important;
  min-height:29px!important;
  padding:0 11px!important;
  border-radius:999px!important;
  font-size:8.5px!important;
  font-weight:950!important;
  letter-spacing:.04em!important;
}

.cl24-next-label{
  gap:6px!important;
  background:#e6f0ff!important;
  color:#0b54a5!important;
}

.cl24-next-label i{
  color:#0d63c7!important;
  font-style:normal!important;
  font-size:12px!important;
}

.cl24-next-kind{
  background:#e7f9f8!important;
  color:#087f80!important;
}

.cl24-next-main h3{
  margin:0 0 10px!important;
  color:#082760!important;
  font-size:clamp(26px,2.8vw,42px)!important;
  line-height:1.05!important;
  letter-spacing:-.45px!important;
}

.cl24-next-main p{
  display:-webkit-box!important;
  -webkit-line-clamp:3!important;
  -webkit-box-orient:vertical!important;
  overflow:hidden!important;
  margin:0 0 17px!important;
  color:#58718d!important;
  font-size:12.5px!important;
  line-height:1.55!important;
}

.cl24-next-facts{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:10px 17px!important;
  margin-bottom:18px!important;
}

.cl24-next-facts span{
  display:inline-flex!important;
  align-items:center!important;
  gap:7px!important;
  color:#34536f!important;
  font-size:10px!important;
}

.cl24-next-facts i{
  width:31px!important;
  height:31px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:50%!important;
  background:#e8f2ff!important;
  color:#0d63c7!important;
  font-style:normal!important;
  font-weight:950!important;
  font-size:12px!important;
}

.cl24-next-facts span:nth-child(2) i{
  background:#e7faf3!important;
  color:#13a86b!important;
}

.cl24-next-facts span:nth-child(3) i{
  background:#fff0ee!important;
  color:#ef4c4c!important;
}

.cl24-next-cta{
  width:min(300px,100%)!important;
  min-height:50px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  padding:0 18px!important;
  border-radius:13px!important;
  background:linear-gradient(135deg,#14aaa8,#087f80)!important;
  color:#fff!important;
  font-size:12px!important;
  font-weight:950!important;
  box-shadow:0 9px 20px rgba(18,168,168,.20)!important;
}

.cl24-next-cta b{
  font-size:22px!important;
}

/* Footer ancho completo */
.cl24-next-footer{
  grid-column:1/-1!important;
  min-height:58px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:16px!important;
  padding:0 24px!important;
  border-top:1px solid #dcecf1!important;
  background:rgba(255,255,255,.88)!important;
  color:#163f71!important;
  font-size:10px!important;
  font-weight:850!important;
}

.cl24-next-footer i{
  color:#13a7d9!important;
  font-style:normal!important;
}

.cl24-next-footer em{
  color:#7c91ab!important;
  font-style:normal!important;
  font-weight:600!important;
}

/* Desactivar visual viejo si coexistiera por caché */
.cl22-next-wrap,
.cl22-next-card{
  display:none!important;
}

/* Mobile */
@media(max-width:760px){
  html.ja3-app-mode .ja3-content .cl24-next-card{
    display:block!important;
    min-height:0!important;
    border-radius:17px!important;
  }

  .cl24-next-media{
    width:100%!important;
    min-height:0!important;
    aspect-ratio:7/4!important;
  }

  .cl24-next-media img{
    object-fit:contain!important;
    background:#edf3f6!important;
  }

  .cl24-next-media-fade{
    background:
      linear-gradient(
        180deg,
        rgba(255,255,255,0) 0%,
        rgba(255,255,255,0) 66%,
        rgba(255,255,255,.22) 82%,
        rgba(255,255,255,.86) 100%
      )!important;
  }

  .cl24-company-pill{
    left:11px!important;
    bottom:10px!important;
    padding:7px 10px!important;
  }

  .cl24-company-pill b{font-size:10.5px!important;}
  .cl24-company-pill small{font-size:7px!important;}

  .cl24-next-main{
    padding:16px 14px 15px!important;
  }

  .cl24-next-main h3{
    font-size:23px!important;
  }

  .cl24-next-main p{
    font-size:10.5px!important;
  }

  .cl24-next-label,
  .cl24-next-kind{
    min-height:25px!important;
    padding:0 8px!important;
    font-size:7.5px!important;
  }

  .cl24-next-facts{
    gap:7px 10px!important;
  }

  .cl24-next-facts span{
    font-size:8.5px!important;
  }

  .cl24-next-facts i{
    width:27px!important;
    height:27px!important;
    font-size:10px!important;
  }

  .cl24-next-cta{
    width:100%!important;
    min-height:45px!important;
  }

  .cl24-next-footer{
    min-height:52px!important;
    padding:10px 14px!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:center!important;
    gap:2px!important;
    font-size:8.5px!important;
  }
}


/* =========================================================
   CAREERLINK PWA 2.5 — TARJETA INTERNA CORREGIDA DE VERDAD
   Imagen full-bleed izquierda + panel derecho limpio
   ========================================================= */

html.ja3-app-mode .ja3-content .cl25-next-wrap{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  margin:24px 0!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}

html.ja3-app-mode .ja3-content .cl25-next-card{
  width:100%!important;
  max-width:100%!important;
  min-height:350px!important;
  display:grid!important;
  grid-template-columns:minmax(360px,44%) minmax(0,56%)!important;
  grid-template-rows:minmax(290px,1fr) 62px!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
  border:1px solid #bde7ed!important;
  border-radius:22px!important;
  background:
    radial-gradient(circle at 92% 18%,rgba(18,168,168,.08),transparent 28%),
    linear-gradient(135deg,#ffffff 0%,#f7fcff 64%,#eefafa 100%)!important;
  color:#143553!important;
  text-decoration:none!important;
  box-shadow:0 14px 36px rgba(26,69,97,.10)!important;
  transition:transform .2s ease,box-shadow .2s ease!important;
}

html.ja3-app-mode .ja3-content .cl25-next-card,
html.ja3-app-mode .ja3-content .cl25-next-card *{
  text-decoration:none!important;
}

html.ja3-app-mode .ja3-content .cl25-next-card:hover{
  transform:translateY(-3px)!important;
  box-shadow:0 18px 44px rgba(26,69,97,.14)!important;
}

/* Full bleed image */
.cl25-next-media{
  position:relative!important;
  grid-row:1!important;
  min-height:290px!important;
  overflow:hidden!important;
  background-color:#eaf2f6!important;
  background-repeat:no-repeat!important;
  background-size:cover!important;
  background-position:center center!important;
}

/* fade into white/right panel */
.cl25-next-media-fade{
  position:absolute!important;
  inset:0!important;
  z-index:2!important;
  pointer-events:none!important;
  background:
    linear-gradient(
      90deg,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,0) 68%,
      rgba(255,255,255,.20) 81%,
      rgba(255,255,255,.72) 94%,
      rgba(255,255,255,1) 100%
    )!important;
}

.cl25-company-pill{
  position:absolute!important;
  left:18px!important;
  bottom:18px!important;
  z-index:3!important;
  max-width:80%!important;
  padding:10px 14px!important;
  border-radius:13px!important;
  background:rgba(255,255,255,.96)!important;
  color:#0b2a55!important;
  box-shadow:0 7px 18px rgba(18,48,75,.14)!important;
}

.cl25-company-pill b{
  display:block!important;
  font-size:14px!important;
  line-height:1.05!important;
}

.cl25-company-pill small{
  display:block!important;
  margin-top:3px!important;
  color:#5e748b!important;
  font-size:8px!important;
  line-height:1.2!important;
}

.cl25-next-ph{
  position:absolute!important;
  inset:0!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:5px!important;
  background:
    radial-gradient(circle at 76% 18%,rgba(255,255,255,.22),transparent 28%),
    linear-gradient(135deg,#0d63c7,#12a8a8 70%,#ff8124)!important;
}

.cl25-next-ph span{
  color:#fff!important;
  font-size:48px!important;
  font-weight:950!important;
}

.cl25-next-ph small{
  color:rgba(255,255,255,.9)!important;
  font-size:10px!important;
  font-weight:800!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}

/* Right content */
.cl25-next-main{
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  padding:28px 30px 24px!important;
}

.cl25-next-topline{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  margin-bottom:14px!important;
}

.cl25-next-label,
.cl25-next-kind{
  display:inline-flex!important;
  align-items:center!important;
  min-height:30px!important;
  padding:0 12px!important;
  border-radius:999px!important;
  font-size:8.5px!important;
  font-weight:950!important;
  letter-spacing:.04em!important;
}

.cl25-next-label{
  gap:6px!important;
  background:#e6f0ff!important;
  color:#0b54a5!important;
}

.cl25-next-label i{
  color:#0d63c7!important;
  font-style:normal!important;
  font-size:12px!important;
}

.cl25-next-kind{
  background:#e7f9f8!important;
  color:#087f80!important;
}

.cl25-next-main h3{
  margin:0 0 11px!important;
  color:#082760!important;
  font-size:clamp(28px,3vw,44px)!important;
  line-height:1.04!important;
  letter-spacing:-.55px!important;
}

.cl25-next-main p{
  display:-webkit-box!important;
  -webkit-line-clamp:3!important;
  -webkit-box-orient:vertical!important;
  overflow:hidden!important;
  margin:0 0 18px!important;
  color:#58718d!important;
  font-size:13px!important;
  line-height:1.55!important;
}

.cl25-next-facts{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:10px 18px!important;
  margin-bottom:20px!important;
}

.cl25-next-facts span{
  display:inline-flex!important;
  align-items:center!important;
  gap:7px!important;
  color:#34536f!important;
  font-size:10px!important;
}

.cl25-next-facts i{
  width:32px!important;
  height:32px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:50%!important;
  background:#e8f2ff!important;
  color:#0d63c7!important;
  font-style:normal!important;
  font-weight:950!important;
  font-size:12px!important;
}

.cl25-next-facts span:nth-child(2) i{
  background:#e7faf3!important;
  color:#13a86b!important;
}

.cl25-next-facts span:nth-child(3) i{
  background:#fff0ee!important;
  color:#ef4c4c!important;
}

.cl25-next-cta{
  width:min(320px,100%)!important;
  min-height:52px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  padding:0 18px!important;
  border-radius:13px!important;
  background:linear-gradient(135deg,#14aaa8,#087f80)!important;
  color:#fff!important;
  font-size:12px!important;
  font-weight:950!important;
  box-shadow:0 9px 20px rgba(18,168,168,.20)!important;
}

.cl25-next-cta b{
  font-size:22px!important;
}

/* Footer */
.cl25-next-footer{
  grid-column:1/-1!important;
  min-height:62px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:16px!important;
  padding:0 24px!important;
  border-top:1px solid #dcecf1!important;
  background:rgba(255,255,255,.90)!important;
  color:#163f71!important;
  font-size:10px!important;
  font-weight:850!important;
}

.cl25-next-footer i{
  color:#13a7d9!important;
  font-style:normal!important;
}

.cl25-next-footer em{
  color:#7c91ab!important;
  font-style:normal!important;
  font-weight:600!important;
}

/* Turn off old preview versions */
.cl22-next-wrap,
.cl22-next-card,
.cl24-next-wrap,
.cl24-next-card{
  display:none!important;
}

/* Mobile */
@media(max-width:760px){
  html.ja3-app-mode .ja3-content .cl25-next-card{
    display:block!important;
    min-height:0!important;
    border-radius:17px!important;
  }

  .cl25-next-media{
    width:100%!important;
    min-height:0!important;
    aspect-ratio:7/4!important;
    background-size:contain!important;
    background-position:center!important;
    background-color:#edf3f6!important;
  }

  .cl25-next-media-fade{
    background:
      linear-gradient(
        180deg,
        rgba(255,255,255,0) 0%,
        rgba(255,255,255,0) 68%,
        rgba(255,255,255,.24) 84%,
        rgba(255,255,255,.88) 100%
      )!important;
  }

  .cl25-company-pill{
    left:11px!important;
    bottom:10px!important;
    padding:7px 10px!important;
  }

  .cl25-company-pill b{font-size:10.5px!important;}
  .cl25-company-pill small{font-size:7px!important;}

  .cl25-next-main{
    padding:17px 14px 15px!important;
  }

  .cl25-next-main h3{
    font-size:23px!important;
  }

  .cl25-next-main p{
    font-size:10.5px!important;
  }

  .cl25-next-label,
  .cl25-next-kind{
    min-height:25px!important;
    padding:0 8px!important;
    font-size:7.5px!important;
  }

  .cl25-next-facts{
    gap:7px 10px!important;
  }

  .cl25-next-facts span{
    font-size:8.5px!important;
  }

  .cl25-next-facts i{
    width:27px!important;
    height:27px!important;
    font-size:10px!important;
  }

  .cl25-next-cta{
    width:100%!important;
    min-height:46px!important;
  }

  .cl25-next-footer{
    min-height:52px!important;
    padding:10px 14px!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:center!important;
    gap:2px!important;
    font-size:8.5px!important;
  }
}


/* =========================================================
   CAREERLINK PWA 2.6 — TARJETA MÁS COMPACTA + IMAGEN COMPLETA
   ========================================================= */

/* Tarjeta general menos alta */
html.ja3-app-mode .ja3-content .cl25-next-card{
  min-height:0!important;
  grid-template-columns:minmax(300px,43%) minmax(0,57%)!important;
  grid-template-rows:auto 48px!important;
  border-radius:18px!important;
}

/* Panel izquierdo: mostrar imagen completa sin recortar */
.cl25-next-media{
  min-height:0!important;
  aspect-ratio:7 / 4!important;
  background-size:contain!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
  background-color:#f2f7fa!important;
}

/* Desvanecido más suave y corto */
.cl25-next-media-fade{
  background:
    linear-gradient(
      90deg,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,0) 72%,
      rgba(255,255,255,.16) 84%,
      rgba(255,255,255,.62) 95%,
      rgba(255,255,255,.94) 100%
    )!important;
}

/* Empresa compacta */
.cl25-company-pill{
  left:12px!important;
  bottom:12px!important;
  padding:7px 10px!important;
  border-radius:10px!important;
  max-width:72%!important;
}

.cl25-company-pill b{
  font-size:11.5px!important;
}

.cl25-company-pill small{
  font-size:7px!important;
}

/* Panel derecho más compacto */
.cl25-next-main{
  padding:18px 20px 16px!important;
}

.cl25-next-topline{
  margin-bottom:9px!important;
}

.cl25-next-label,
.cl25-next-kind{
  min-height:24px!important;
  padding:0 9px!important;
  font-size:7.5px!important;
}

.cl25-next-main h3{
  margin-bottom:7px!important;
  font-size:clamp(22px,2.35vw,34px)!important;
  line-height:1.05!important;
}

.cl25-next-main p{
  -webkit-line-clamp:2!important;
  margin-bottom:11px!important;
  font-size:10.5px!important;
  line-height:1.45!important;
}

.cl25-next-facts{
  gap:7px 12px!important;
  margin-bottom:12px!important;
}

.cl25-next-facts span{
  gap:5px!important;
  font-size:8.5px!important;
}

.cl25-next-facts i{
  width:25px!important;
  height:25px!important;
  font-size:9.5px!important;
}

.cl25-next-cta{
  width:min(280px,100%)!important;
  min-height:42px!important;
  padding:0 14px!important;
  border-radius:10px!important;
  font-size:10.5px!important;
}

.cl25-next-cta b{
  font-size:18px!important;
}

/* Footer más delgado */
.cl25-next-footer{
  min-height:48px!important;
  padding:0 18px!important;
  font-size:8.5px!important;
}

/* Desktop medio */
@media(max-width:1020px){
  html.ja3-app-mode .ja3-content .cl25-next-card{
    grid-template-columns:minmax(260px,42%) minmax(0,58%)!important;
  }

  .cl25-next-main{
    padding:15px 16px 14px!important;
  }

  .cl25-next-main h3{
    font-size:24px!important;
  }
}

/* Móvil: tarjeta vertical y aún más compacta */
@media(max-width:760px){
  html.ja3-app-mode .ja3-content .cl25-next-card{
    display:block!important;
    min-height:0!important;
    border-radius:15px!important;
  }

  .cl25-next-media{
    width:100%!important;
    aspect-ratio:7 / 4!important;
    background-size:contain!important;
    background-position:center!important;
    background-color:#f2f7fa!important;
  }

  .cl25-next-media-fade{
    background:
      linear-gradient(
        180deg,
        rgba(255,255,255,0) 0%,
        rgba(255,255,255,0) 74%,
        rgba(255,255,255,.18) 86%,
        rgba(255,255,255,.82) 100%
      )!important;
  }

  .cl25-company-pill{
    left:9px!important;
    bottom:8px!important;
    padding:6px 8px!important;
  }

  .cl25-company-pill b{
    font-size:9.5px!important;
  }

  .cl25-company-pill small{
    display:none!important;
  }

  .cl25-next-main{
    padding:13px 12px 12px!important;
  }

  .cl25-next-main h3{
    font-size:20px!important;
    margin-bottom:6px!important;
  }

  .cl25-next-main p{
    font-size:9.5px!important;
    margin-bottom:9px!important;
  }

  .cl25-next-label,
  .cl25-next-kind{
    min-height:22px!important;
    font-size:7px!important;
  }

  .cl25-next-facts{
    margin-bottom:10px!important;
  }

  .cl25-next-facts span{
    font-size:8px!important;
  }

  .cl25-next-facts i{
    width:23px!important;
    height:23px!important;
  }

  .cl25-next-cta{
    min-height:40px!important;
    width:100%!important;
  }

  .cl25-next-footer{
    min-height:44px!important;
    padding:8px 12px!important;
    gap:1px!important;
    font-size:8px!important;
  }
}


/* =========================================================
   CAREERLINK PWA 2.7 — QUITAR BLOQUE "VER SITIO OFICIAL"
   En todas las entradas PWA.
   ========================================================= */

/* Bloques antiguos del sitio oficial que no deben mostrarse */
html.ja3-app-mode .ja3-content .ja35-official-fixed,
html.ja3-app-mode .ja3-content .ja35-official-card,
html.ja3-app-mode .ja3-content .ja36-official-card,
html.ja3-app-mode .ja3-content .ja3-official,
html.ja3-app-mode .ja3-content .ja31-footer-cta,
html.ja3-app-mode .ja3-content .cl20-official-inline-hidden,
html.ja3-app-mode .ja3-content .cl20-official-inline-wrap-hidden{
  display:none!important;
}

/* Cualquier enlace suelto con texto de sitio oficial dentro del contenido
   queda oculto; el CTA oficial válido seguirá existiendo únicamente al final. */
html.ja3-app-mode .ja3-content a[href].ja35-official-fixed,
html.ja3-app-mode .ja3-content a[href*="official"],
html.ja3-app-mode .ja3-content a[href*="careers"]{
  /* No ocultamos por URL de forma general si no tiene clase oficial. */
}

/* Limpieza visual del contenedor vacío que quedaba alrededor */
html.ja3-app-mode .ja3-content .cl20-official-inline-wrap-hidden,
html.ja3-app-mode .ja3-content .ja35-official-card,
html.ja3-app-mode .ja3-content .ja36-official-card{
  margin:0!important;
  padding:0!important;
  min-height:0!important;
  height:0!important;
  border:0!important;
  box-shadow:none!important;
  background:transparent!important;
}


/* =========================================================
   CAREERLINK PWA 2.8 — CARRUSEL PREMIUM DE OPORTUNIDADES
   ========================================================= */

.cl28-native-related-hidden{
  display:none!important;
}

.cl28-related-carousel{
  margin:20px 0 6px!important;
  padding:20px!important;
  border:1px solid #d8eaf1!important;
  border-radius:18px!important;
  background:
    radial-gradient(circle at 96% 6%,rgba(255,129,36,.08),transparent 25%),
    linear-gradient(145deg,#f9fdff 0%,#f1fbfb 55%,#fffaf6 100%)!important;
  box-shadow:0 10px 28px rgba(27,67,94,.07)!important;
}

.cl28-related-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:16px!important;
  margin-bottom:16px!important;
}

.cl28-related-eyebrow{
  display:block!important;
  margin-bottom:4px!important;
  color:#ff7f32!important;
  font-size:8px!important;
  font-weight:950!important;
  letter-spacing:.13em!important;
}

.cl28-related-heading h2{
  margin:0!important;
  color:#0b2a55!important;
  font-size:21px!important;
  line-height:1.1!important;
}

.cl28-related-heading p{
  margin:5px 0 0!important;
  color:#71849a!important;
  font-size:10px!important;
  line-height:1.4!important;
}

.cl28-related-controls{
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
}

.cl28-related-controls button{
  width:36px!important;
  height:36px!important;
  display:grid!important;
  place-items:center!important;
  border:1px solid #cce4eb!important;
  border-radius:11px!important;
  background:#fff!important;
  color:#0d63c7!important;
  font-size:17px!important;
  font-weight:950!important;
  cursor:pointer!important;
  box-shadow:0 5px 13px rgba(24,61,88,.06)!important;
}

.cl28-related-controls button:hover{
  background:#eaf7f8!important;
  color:#087f80!important;
}

.cl28-related-track{
  display:grid!important;
  grid-auto-flow:column!important;
  grid-auto-columns:minmax(260px,1fr)!important;
  grid-template-rows:1fr!important;
  gap:12px!important;
  overflow-x:auto!important;
  overscroll-behavior-inline:contain!important;
  scroll-snap-type:x mandatory!important;
  scroll-behavior:smooth!important;
  scrollbar-width:none!important;
  padding:2px 2px 6px!important;
}

.cl28-related-track::-webkit-scrollbar{
  display:none!important;
}

.cl28-job-card{
  min-width:0!important;
  scroll-snap-align:start!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  background:#fff!important;
  border:1px solid #dfeaf0!important;
  border-radius:15px!important;
  color:#173653!important;
  text-decoration:none!important;
  box-shadow:0 7px 20px rgba(26,66,92,.06)!important;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease!important;
}

.cl28-job-card:hover{
  transform:translateY(-3px)!important;
  border-color:#b9dcdf!important;
  box-shadow:0 13px 28px rgba(26,66,92,.11)!important;
}

.cl28-job-media{
  position:relative!important;
  width:100%!important;
  aspect-ratio:16/9!important;
  overflow:hidden!important;
  background:#edf3f6!important;
}

.cl28-job-media img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
}

.cl28-job-ph{
  width:100%!important;
  height:100%!important;
  display:grid!important;
  place-items:center!important;
  background:linear-gradient(135deg,#0d63c7,#12a8a8 72%,#ff8124)!important;
  color:#fff!important;
  font-size:30px!important;
  font-weight:950!important;
}

.cl28-job-country{
  position:absolute!important;
  left:9px!important;
  bottom:9px!important;
  min-height:24px!important;
  display:inline-flex!important;
  align-items:center!important;
  padding:0 8px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.95)!important;
  color:#244867!important;
  font-size:7.5px!important;
  font-weight:900!important;
  box-shadow:0 4px 11px rgba(20,48,72,.10)!important;
}

.cl28-job-body{
  flex:1!important;
  display:flex!important;
  flex-direction:column!important;
  padding:12px 13px 13px!important;
}

.cl28-job-top{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:8px!important;
  margin-bottom:7px!important;
}

.cl28-job-kind{
  display:inline-flex!important;
  align-items:center!important;
  min-height:21px!important;
  padding:0 7px!important;
  border-radius:999px!important;
  background:#e7f6f6!important;
  color:#087f80!important;
  font-size:7px!important;
  font-weight:950!important;
  text-transform:uppercase!important;
}

.cl28-job-company{
  color:#7b8da0!important;
  font-size:7.5px!important;
  font-weight:800!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

.cl28-job-card h3{
  display:-webkit-box!important;
  -webkit-line-clamp:2!important;
  -webkit-box-orient:vertical!important;
  overflow:hidden!important;
  margin:0 0 7px!important;
  color:#0b2a55!important;
  font-size:13px!important;
  line-height:1.28!important;
}

.cl28-job-card p{
  display:-webkit-box!important;
  -webkit-line-clamp:2!important;
  -webkit-box-orient:vertical!important;
  overflow:hidden!important;
  margin:0 0 10px!important;
  color:#718197!important;
  font-size:8.5px!important;
  line-height:1.45!important;
}

.cl28-job-meta{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:6px 10px!important;
  margin-top:auto!important;
  margin-bottom:10px!important;
}

.cl28-job-meta span{
  display:inline-flex!important;
  align-items:center!important;
  gap:4px!important;
  color:#3e5c78!important;
  font-size:7.5px!important;
  font-weight:800!important;
}

.cl28-job-meta i{
  width:21px!important;
  height:21px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:7px!important;
  background:#eef6ff!important;
  color:#0d63c7!important;
  font-style:normal!important;
  font-weight:950!important;
}

.cl28-job-meta span:nth-child(2) i{
  background:#e9faf4!important;
  color:#13a86b!important;
}

.cl28-job-cta{
  width:100%!important;
  min-height:38px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:8px!important;
  padding:0 12px!important;
  border-radius:10px!important;
  background:linear-gradient(135deg,#12a8a8,#087f80)!important;
  color:#fff!important;
  font-size:9px!important;
  font-weight:950!important;
  box-shadow:0 6px 14px rgba(18,168,168,.15)!important;
}

.cl28-job-cta b{
  font-size:16px!important;
}

/* Desktop: tres tarjetas visibles */
@media(min-width:1080px){
  .cl28-related-track{
    grid-auto-columns:calc((100% - 24px)/3)!important;
  }
}

/* Tablet: dos tarjetas */
@media(min-width:700px) and (max-width:1079px){
  .cl28-related-track{
    grid-auto-columns:calc((100% - 12px)/2)!important;
  }
}

/* Mobile: una tarjeta principal deslizable */
@media(max-width:699px){
  .cl28-related-carousel{
    margin:16px 0 4px!important;
    padding:14px!important;
    border-radius:16px!important;
  }

  .cl28-related-head{
    align-items:flex-end!important;
    margin-bottom:12px!important;
  }

  .cl28-related-heading h2{
    font-size:17px!important;
  }

  .cl28-related-heading p{
    font-size:8.5px!important;
  }

  .cl28-related-controls button{
    width:32px!important;
    height:32px!important;
    border-radius:10px!important;
  }

  .cl28-related-track{
    grid-auto-columns:88%!important;
    gap:10px!important;
  }

  .cl28-job-media{
    aspect-ratio:7/4!important;
  }

  .cl28-job-media img{
    object-fit:contain!important;
    background:#edf3f6!important;
  }

  .cl28-job-card h3{
    font-size:12px!important;
  }
}