/* Equipo Y (23-oct-2026): imágenes de cristal y luz cobalto en lugar de 4B-halo en las secciones de contenido.
   4B-halo se queda en la escena de la portada, en la demo de la plataforma y en la demo de cada sector.
   Se puede quitar entera: sin esta hoja, las imágenes salen a su tamaño natural. */

/* «Tres cosas. Elige la tuya.»: la imagen llena la cabecera de la tarjeta */
.w-tile-img.y-tile-foto { display: block; padding: 0; background: #0d0f14; }
.w-tile-img.y-tile-foto img { display: block; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; object-fit: cover; filter: none; transition: transform .6s ease; }
.w-tile:hover .y-tile-foto img { transform: scale(1.03); }
@media (min-width: 901px) {
  .w-tile.y-tile:not(.grande) { flex-direction: column; }
  .w-tile.y-tile:not(.grande) .w-tile-img.y-tile-foto { width: auto; height: 170px; min-height: 0; border-right: 0; border-bottom: 1px solid var(--m-linea); }
  .w-tile.y-tile:not(.grande) .w-tile-img.y-tile-foto img { width: 100%; height: 100%; max-height: none; }
}

/* Galería de sectores con fotos */
.y-sector .w-sector-img { display: block; aspect-ratio: 4 / 4.4; background: #0d0f14; }
.y-sector .w-sector-img img { display: block; width: 100%; height: 100%; margin: 0; object-fit: cover; filter: none; }
.y-sector:hover .w-sector-img img { transform: scale(1.04); }

/* Cabecera con imagen y el chat encima (voz y whatsapp, plataforma) */
.y-escena { position: relative; }
.y-escena-foto { border-radius: var(--w-radio, 18px); overflow: hidden; border: 1px solid var(--m-linea); background: #0d0f14;
  box-shadow: 0 30px 60px -30px rgba(40, 80, 255, .45); }
.y-escena-foto img { display: block; width: 100%; height: auto; }
.y-escena .w-chat { position: relative; z-index: 1; margin: -22% 0 0 18%; }
@media (max-width: 900px) { .y-escena { margin-top: 1rem; } .y-escena .w-chat { margin: -22% 0 0 6%; } }

/* Cabecera de proyectos a medida y columna de contacto */
.y-cab-foto { width: clamp(260px, 38vw, 520px); }
.y-cab-foto img, .y-contacto-foto img { display: block; width: 100%; height: auto; border-radius: var(--w-radio, 18px); border: 1px solid var(--m-linea);
  background: #0d0f14; box-shadow: 0 30px 60px -30px rgba(40, 80, 255, .45); }
.y-contacto-foto { max-width: 460px; margin-top: 1.4rem; }
@media (max-width: 700px) { .y-cab-foto { width: 100%; margin-top: 1rem; } }

/* Rejilla «Qué hace por ti» con imágenes cuadradas */
.y-rasgos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(12px, 1.8vw, 22px); }
.y-rasgo { display: flex; flex-direction: column; overflow: hidden; border-radius: var(--w-radio, 18px); border: 1px solid var(--m-linea); background: var(--m-capa); }
.y-rasgo-img { display: block; aspect-ratio: 1; background: #0d0f14; overflow: hidden; }
.y-rasgo-img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.y-rasgo > span:last-child { display: block; padding: 1rem 1.1rem 1.2rem; }
.y-rasgo b { display: block; font-size: 1.125rem; line-height: 1.3; margin-bottom: .35rem; }
.y-rasgo b + span { display: block; color: var(--m-suave); line-height: 1.5; }
@media (max-width: 900px) { .y-rasgos { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Cajas de «Qué puedes pedirle» con imagen arriba */
.m-plat-caja.y-con-foto { overflow: hidden; }
.y-caja-foto { display: block; margin: calc(-1 * clamp(18px, 2.2vw, 28px)) calc(-1 * clamp(18px, 2.2vw, 28px)) 1.1rem; aspect-ratio: 16 / 8; overflow: hidden; background: #0d0f14; border-bottom: 1px solid var(--m-linea); }
.y-caja-foto img { display: block; width: 100%; height: 100%; object-fit: cover; }

@media (prefers-reduced-motion: reduce) {
  .w-tile:hover .y-tile-foto img, .y-sector:hover .w-sector-img img { transform: none; }
  .w-tile-img.y-tile-foto img, .y-sector .w-sector-img img { transition: none; }
}