Te bastaría para lo que necesitas con poner un 'overflow: visible' en el contenedor que deseas que sobre salga y por asegurar darle un 'z-index' mayor que al resto de elementos para que se superponga pase lo q pase. Hago una pequeña modificación en tu 'css' como ejemplo:
/******Second header******/
.second_header{
text-align: center;
position: relative;
overflow: hidden;
}
.sec_cont_text{
transform: rotate(15deg);
/*Modificación en la respuesta*/
overflow: visible;
z-index: 999999;hidden;
}
.no_bg{
margin-left: -30%;
text-align: center;
}
.grey_background{
text-align: center;
background-color: #252525;
overflow: visible;
z-index: 999999;
}
.grey_background h1{
/*conservo el H1 para no variar mucho tu código pero en este caso creo que sería mejor utilizar otra etiqueta con menos estilos predefinidos por el navegador y darle tú el estilo que consideres*/
width:150px !important;
}
<section class="second_header">
<div class="second_header_content ">
<div class="sec_cont">
<img src="img/ipag.svg" alt="Desarrollo web">
</div>
<div class="sec_cont_text">
<h1 class="no_bg">Desarrollo</h1>
<div class="grey_background">
<h1>de paginas web</h1>
</div>
</div>
</div><!--second header content-->
</section><!--Second header-->
Además comparto aquí un enlace con la documentación sobre el uso de la propiedad de CSS 'overflow' por si te fuera de utilidad en este u otros proyectos: https://developer.mozilla.org/es/docs/Web/CSS/overflow