/* RHD winding redesign section
   Compact technical block: informative without becoming a design manual. */

.service-page .redesign-section{
  position:relative;
}

.service-page .redesign-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}

.service-page .redesign-grid article{
  position:relative;
  min-height:190px;
  padding:31px 28px 28px;
  overflow:hidden;
  border:1px solid rgba(18,18,18,.09);
  background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(249,249,247,.96));
}

.service-page .redesign-grid article::before{
  content:"";
  position:absolute;
  left:28px;
  top:26px;
  width:34px;
  height:3px;
  background:#c51319;
}

.service-page .redesign-grid article::after{
  content:"";
  position:absolute;
  right:-26px;
  bottom:-34px;
  width:100px;
  height:100px;
  border:1px solid rgba(18,18,18,.045);
  transform:rotate(45deg);
  pointer-events:none;
}

.service-page .redesign-grid span{
  display:block;
  margin-top:29px;
  color:#111;
  font-family:"Barlow Condensed",Inter,sans-serif;
  font-size:28px;
  font-weight:800;
  line-height:1;
  text-transform:uppercase;
}

.service-page .redesign-grid p{
  position:relative;
  z-index:1;
  margin:15px 0 0;
  color:#666;
  font-size:13px;
  line-height:1.72;
}

.service-page .redesign-reference{
  margin:18px 0 0;
  padding:17px 20px 17px 22px;
  border-left:3px solid #c51319;
  background:rgba(18,18,18,.035);
  color:#696969;
  font-size:11px;
  line-height:1.65;
  letter-spacing:.015em;
}

/* Fondos editoriales selectivos.
   Se usan en bloques separados para romper la secuencia blanco/negro sin convertir
   toda la página en una galería. Las imágenes cubren únicamente la sección elegida. */
.service-page #proceso,
.service-page #rediseno{
  position:relative;
  isolation:isolate;
  overflow:hidden;
}

.service-page #proceso::before,
.service-page #rediseno::before,
.service-page #proceso::after,
.service-page #rediseno::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
}

.service-page #proceso::before{
  z-index:-2;
  background:url("assets/optimized/servicios/rebobinado/FONDO1.webp") center 48%/cover no-repeat;
  filter:saturate(.86) contrast(.98) brightness(.98);
  transform:scale(1.015);
}

.service-page #proceso::after{
  z-index:-1;
  background:linear-gradient(90deg,rgba(244,244,241,.84) 0%,rgba(244,244,241,.57) 48%,rgba(244,244,241,.76) 100%);
}

.service-page #rediseno::before{
  z-index:-2;
  background:url("assets/optimized/servicios/rebobinado/FONDO2.webp") center 52%/cover no-repeat;
  filter:saturate(.82) contrast(.96) brightness(1.01);
  transform:scale(1.015);
}

.service-page #rediseno::after{
  z-index:-1;
  background:linear-gradient(90deg,rgba(244,244,241,.82) 0%,rgba(244,244,241,.61) 52%,rgba(244,244,241,.79) 100%);
}

.service-page #proceso > *,
.service-page #rediseno > *{
  position:relative;
  z-index:1;
}

.service-page #proceso .process-line > div{
  background:rgba(17,17,17,.93);
  box-shadow:0 8px 28px rgba(0,0,0,.06);
  backdrop-filter:blur(1px);
}

.service-page #rediseno .redesign-grid article{
  background:linear-gradient(145deg,rgba(255,255,255,.91),rgba(249,249,247,.86));
  backdrop-filter:blur(2px);
}

.service-page #rediseno .redesign-reference{
  background:rgba(244,244,241,.88);
  backdrop-filter:blur(2px);
}

/* Evidencia RHD integrada en los dos espacios que antes estaban pendientes. */
.service-page #evidencia .photo-placeholders{
  gap:18px;
}

.service-page #evidencia .photo-placeholder{
  position:relative;
  min-height:360px;
  overflow:hidden;
  align-items:flex-end;
  justify-content:flex-start;
  padding:0;
  border:0;
  background-color:#111;
  background-repeat:no-repeat;
  background-size:cover;
  color:transparent;
  font-size:0;
  letter-spacing:0;
  text-align:left;
}

.service-page #evidencia .photo-placeholder::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.02) 42%,rgba(0,0,0,.72) 100%);
  pointer-events:none;
}

.service-page #evidencia .photo-placeholder::after{
  position:absolute;
  left:22px;
  right:22px;
  bottom:20px;
  z-index:1;
  color:#fff;
  font-size:11px;
  font-weight:800;
  line-height:1.45;
  letter-spacing:.1em;
  text-transform:uppercase;
  text-shadow:0 2px 14px rgba(0,0,0,.35);
}

.service-page #evidencia .photo-placeholder:nth-child(1){
  background-image:url("assets/optimized/servicios/rebobinado/MEDICION%20DE%20AILAMIENTO.webp");
  background-position:36% 68%;
}

.service-page #evidencia .photo-placeholder:nth-child(1)::after{
  content:"Medición de aislamiento · verificación eléctrica RHD";
}

.service-page #evidencia .photo-placeholder:nth-child(2){
  background-image:url("assets/optimized/servicios/rebobinado/MOTOR%20TERMINADO%202.webp");
  background-position:center;
}

.service-page #evidencia .photo-placeholder:nth-child(2)::after{
  content:"Bobinado terminado · conformación final del devanado";
}

@media(max-width:980px){
  .service-page .redesign-grid{
    grid-template-columns:1fr;
  }
  .service-page .redesign-grid article{
    min-height:0;
  }
  .service-page #proceso::before{
    background-position:58% center;
  }
  .service-page #rediseno::before{
    background-position:56% center;
  }
  .service-page #proceso::after,
  .service-page #rediseno::after{
    background:rgba(244,244,241,.69);
  }
}

@media(max-width:640px){
  .service-page .redesign-grid{
    gap:12px;
  }
  .service-page .redesign-grid article{
    padding:27px 24px 25px;
  }
  .service-page .redesign-grid article::before{
    left:24px;
    top:22px;
    width:30px;
  }
  .service-page .redesign-grid span{
    margin-top:27px;
    font-size:27px;
  }
  .service-page .redesign-grid p{
    font-size:12px;
  }
  .service-page .redesign-reference{
    padding:15px 17px 15px 19px;
    font-size:10px;
  }
  .service-page #proceso::before,
  .service-page #rediseno::before{
    transform:scale(1.04);
  }
  .service-page #proceso::after,
  .service-page #rediseno::after{
    background:rgba(244,244,241,.74);
  }
  .service-page #evidencia .photo-placeholder{
    min-height:320px;
  }
  .service-page #evidencia .photo-placeholder:nth-child(1){
    background-position:32% 70%;
  }
  .service-page #evidencia .photo-placeholder::after{
    left:18px;
    right:18px;
    bottom:17px;
    font-size:10px;
  }
}