Efecto cuático con sombras en CSS

La idea de todo esto es escribir un texto, y con :before y :after meter dos textos iguales, pero casi transparentes, puestos encima, y el primero moverlo 1px abajo de la derecha, y el siguiente moverlo 2 pixeles abajo a la derecha. Como son semitransparentes, van a cambiar el color del texto. El problema es que si el color de fondo donde aparecen las sombras no es oscuro, no se van a notar las sombras exteriores.

con este div:

<div class="tit" title="Esto y lo otro">Esto y lo otro</div>

y este CSS:

.tit {font-size: 80px;  padding: .5em 0; color:#black; font-weight:bold; position:relative;}
.tit:before, .tit:after  {content:attr(title); font-size: 80px; padding: .5em 0; position:absolute; color:rgba(255,255,225,0.1)}
.tit:before  { top:1px; left:1px; right:0;}
.tit:after  { top:2px; left:2px; right:0;}