/* Ronda 2 · combinación de A + B + C, y sección de tecnología */

/* Sello de tecnología en la portada */
.w2-sello { display: inline-flex; align-items: center; gap: 10px; background: #fff; border: 1px solid #C9D7EA; border-radius: 999px; padding: 8px 16px 8px 10px; font-size: 14px; font-weight: 600; color: var(--tinta); box-shadow: 0 6px 18px rgba(0,88,199,.12); margin-bottom: 26px; }
.w2-sello i { width: 10px; height: 10px; border-radius: 50%; background: var(--azul); animation: pulso 1.8s infinite; }
.w2-tec-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: -12px 0 30px; }
.w2-tec-chips span { font-size: 13px; font-weight: 500; color: var(--azul); background: var(--azul-suave); padding: 6px 12px; border-radius: 999px; }

/* Avisos flotantes que pasan de problema a resuelto */
.c-flot small { transition: color .4s; }
.c-flot.prob small { color: var(--err); }
.c-flot.prob span { background: var(--err-bg); }

/* Sección tecnología */
.t-tec { padding: 120px 0; overflow: hidden; background: radial-gradient(70% 80% at 85% 40%, #183A61 0%, var(--tinta-3) 65%); }
.t-luz { position: absolute; width: 700px; height: 700px; right: -200px; top: -120px; background: radial-gradient(circle, rgba(77,141,255,.22), transparent 65%); pointer-events: none; }
.t-cab { display: grid; gap: 16px; max-width: 760px; margin-bottom: 56px; }
.t-cab h2 span { color: #8DB6FF; }
.t-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 56px; align-items: center; }
.t-lista { list-style: none; padding: 0; margin: 0; display: grid; gap: 14px; }
.t-lista li { display: grid; grid-template-columns: 52px 1fr; gap: 16px; align-items: start; padding: 16px 18px; border-radius: 16px; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08); transition: background .25s, border-color .25s, transform .25s var(--ease); }
.t-lista li:hover { background: rgba(77,141,255,.1); border-color: rgba(141,182,255,.45); transform: translateX(6px); }
.t-i { width: 52px; height: 52px; border-radius: 14px; background: rgba(77,141,255,.16); display: grid; place-items: center; font-size: 26px; }
.t-lista b { color: #fff; font-size: 17px; line-height: 23px; }
.t-lista p { color: #AFC0CF; font-size: 15px; line-height: 22px; margin-top: 2px; }
.t-tec .b-panel { transform: perspective(1400px) rotateY(-6deg) rotateX(2deg); box-shadow: 0 50px 100px rgba(0,0,0,.5), 0 0 0 1px rgba(255,255,255,.08); }

@media (max-width: 1100px) {
  .t-grid { grid-template-columns: 1fr; }
  .t-tec .b-panel { transform: none; }
}
@media (max-width: 720px) {
  .t-tec { padding: 72px 0; }
  .t-lista li { grid-template-columns: 42px 1fr; padding: 14px; } .t-i { width: 42px; height: 42px; font-size: 21px; }
}

/* Ronda 3 · correcciones tras W2-A = 4: estados visibles, fotos que se ven, nada oculto tras un scroll */

/* Un día: rótulo de estado sobre cada foto, rojo en «Hoy» y verde en «Con NeuralV» */
.w3-est { position: absolute; left: 12px; top: 12px; z-index: 2; font-size: 12px; font-weight: 700; letter-spacing: .04em; color: #fff; padding: 5px 10px; border-radius: 999px; background: var(--err); transition: background .4s; }
.w3-est::before { content: "✕ Hoy"; }
.c-dia.con .w3-est { background: var(--ok); }
.c-dia.con .w3-est::before { content: "✓ Con NeuralV"; }
.c-dia:not(.con) .c-hora-img img:first-child { filter: none; }
.c-interr button { padding: 15px 26px; font-size: 16px; }

/* Pestañas: la foto entera, encuadrada al centro */
.b-esc-txt img { height: 240px; object-position: center; }

/* Frase: velo solo detrás del texto, la foto se ve */
.c-frase-fondo { transform: none; object-position: center; }
.c-frase::before { background: linear-gradient(90deg, rgba(15,29,43,.82) 0%, rgba(15,29,43,.45) 42%, rgba(15,29,43,0) 70%); }

@media (max-width: 720px) {
  .c-frase-fondo { object-position: 78% center; }
  .c-frase::before { background: linear-gradient(180deg, rgba(15,29,43,.78) 0%, rgba(15,29,43,.55) 60%, rgba(15,29,43,.2) 100%); }
}

/* Antes / después: encuadre al centro (mismo despacho en las dos) */
.a-comp > img, .a-comp-antes img { object-position: center; }
.a-comp-antes img { filter: none; }

/* Método: una línea por paso y lo que te llevas */
.b-paso p { font-size: 14.5px; line-height: 21px; }
.b-paso em { font-style: normal; font-size: 13px; font-weight: 600; color: var(--azul); background: var(--azul-suave); padding: 5px 10px; border-radius: 999px; margin-top: 6px; }

/* Ronda 4 · Interim Manager con sección propia y blog con protagonismo */

/* Interim Manager */
.w4-im { padding: 120px 0; overflow: hidden; background: linear-gradient(135deg, var(--tinta-3) 0%, #16314F 60%, #1D3F66 100%); }
.w4-im-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.w4-im h2 { margin: 18px 0 18px; font-size: clamp(32px, 4vw, 50px); }
.w4-im h2 span { display: block; color: #8DB6FF; }
.w4-im-lead { font-size: 19px; line-height: 30px; color: #C7D4E0; max-width: 46ch; }
.w4-im-modos { display: grid; gap: 12px; margin: 30px 0; }
.w4-im-modos a { display: grid; grid-template-columns: 48px 1fr; gap: 14px; align-items: start; padding: 16px 18px; border-radius: 16px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); text-decoration: none; transition: transform .25s var(--ease), border-color .25s, background .25s; }
.w4-im-modos a:hover { transform: translateX(6px); border-color: rgba(141,182,255,.55); background: rgba(77,141,255,.1); }
.w4-im-modos span { width: 48px; height: 48px; border-radius: 14px; background: rgba(77,141,255,.18); display: grid; place-items: center; font-size: 24px; }
.w4-im-modos b { color: #fff; font-size: 17px; }
.w4-im-modos p { color: #AFC0CF; font-size: 15px; line-height: 22px; }
.w4-im-vis { position: relative; }
.w4-im-vis > img { width: 100%; aspect-ratio: 3/2; object-fit: cover; border-radius: 24px; box-shadow: 0 40px 90px rgba(0,0,0,.45); }
.w4-im-pasos { position: absolute; left: -28px; right: 28px; bottom: -26px; list-style: none; margin: 0; padding: 10px; display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px; background: #fff; border-radius: 16px; box-shadow: 0 18px 44px rgba(0,0,0,.3); }
.w4-im-pasos li { font-size: 12px; line-height: 16px; font-weight: 600; color: var(--sec); text-align: center; padding: 10px 4px; border-radius: 10px; transition: background .4s, color .4s; }
.w4-im-pasos li b { display: block; font-size: 11px; color: var(--apoyo); }
.w4-im-pasos li.on { background: var(--azul); color: #fff; }
.w4-im-pasos li.on b { color: #CFE0FF; }

/* Blog */
.w4-blog { padding: 110px 0; background: var(--papel); }
.w4-blog-cab { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; flex-wrap: wrap; margin-bottom: 36px; }
.w4-blog-cab h2 { margin-top: 14px; }
.w4-dest { display: grid; grid-template-columns: 1.25fr 1fr; background: #fff; border-radius: 24px; overflow: hidden; border: 1px solid var(--linea); box-shadow: var(--sombra); }
.w4-dest-img { position: relative; display: block; overflow: hidden; min-height: 380px; }
.w4-dest-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease); }
.w4-dest:hover .w4-dest-img img { transform: scale(1.05); }
.w4-nuevo { position: absolute; left: 18px; top: 18px; background: var(--azul); color: #fff; font-size: 13px; font-weight: 700; padding: 7px 14px; border-radius: 999px; box-shadow: 0 8px 20px rgba(0,88,199,.35); }
.w4-dest-txt { padding: 44px; display: grid; gap: 16px; align-content: center; }
.w4-dest-txt small { font-size: 13px; font-weight: 600; color: var(--sec); text-transform: uppercase; letter-spacing: .08em; }
.w4-dest-txt h3 { font-size: clamp(26px, 2.6vw, 36px); line-height: 1.15; }
.w4-dest-txt h3 a { color: var(--tinta); text-decoration: none; }
.w4-dest-txt p { font-size: 18px; line-height: 28px; color: var(--sec); }
.w4-dest-txt .btn { justify-self: start; }
.w4-posts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 22px; }
.w4-post { display: grid; gap: 8px; align-content: start; background: #fff; border-radius: 18px; overflow: hidden; border: 1px solid var(--linea); text-decoration: none; padding-bottom: 20px; transition: transform .3s var(--ease), box-shadow .3s; }
.w4-post:hover { transform: translateY(-5px); box-shadow: var(--sombra); }
.w4-post-img { aspect-ratio: 16/9; overflow: hidden; }
.w4-post-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease); }
.w4-post:hover .w4-post-img img { transform: scale(1.06); }
.w4-post small { padding: 8px 20px 0; font-size: 12px; font-weight: 600; color: var(--sec); text-transform: uppercase; letter-spacing: .06em; }
.w4-post b { padding: 0 20px; font-size: 17px; line-height: 24px; color: var(--tinta); }
.w4-gratis { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 30px; font-size: 15px; }
.w4-gratis span { font-weight: 700; color: var(--ok); text-transform: uppercase; font-size: 13px; letter-spacing: .08em; }
.w4-gratis a { padding: 10px 16px; border-radius: 999px; background: #fff; border: 1px solid var(--linea); text-decoration: none; color: var(--tinta); transition: border-color .2s; }
.w4-gratis a:hover { border-color: var(--azul); }

@media (max-width: 1100px) {
  .w4-im-grid, .w4-dest { grid-template-columns: 1fr; }
  .w4-im-pasos { position: static; margin-top: 14px; grid-template-columns: repeat(3, 1fr); }
  .w4-dest-img { min-height: 300px; }
}
@media (max-width: 720px) {
  .w4-im, .w4-blog { padding: 72px 0; }
  .w4-posts { grid-template-columns: 1fr; }
  .w4-dest-txt { padding: 24px; }
  .w4-dest-img { min-height: 220px; }
}

.w4-im-vis .c-pie { top: 12px; bottom: auto; }

.w4-dest-txt h2 { font-size: clamp(26px, 2.6vw, 36px); line-height: 1.15; }
.w4-dest-txt .lead { font-size: 18px; line-height: 28px; color: var(--sec); }
.w4-post b { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* Blog: rótulo «Última noticia» sobre la primera tarjeta */
.w4-post-img { position: relative; }
.w4-post-img .w4-nuevo { left: 12px; top: 12px; font-size: 12px; padding: 6px 12px; }
.w4-posts { margin-top: 0; }
