.block-header-page {
    position: relative;
    width: 100%;
    border-radius: 30px;
	margin-bottom: 92px;
}

.block-header-page:before{
	position: absolute;
	width: 1217px;
	height: 620px;
	left: 0px;
	top: 0px;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(15, 15, 15, 0.2) 100%);
	border-radius: 30px;
	transform: matrix(-1, 0, 0, 1, 0, 0);
}

.block-header-page .bhp-title{
	font-family: 'Raleway';
	font-style: normal;
	font-weight: 700;
	font-size: 60px;
	line-height: 110%;
	color: #FFFFFF;
}

.block-header-page .bhp-subtitle.big{
	font-size: 48px;
	font-family: Raleway;
	font-size: 48px;
	font-style: normal;
	font-weight: 400;
	line-height: 110%;
}

.block-header-page .bhp-subtitle.small{
	font-size: 20px;
	font-family: Raleway;
	line-height: 130%;
	font-style: normal;
	font-weight: 500;
}

.page-template-tpl-realisation .bhp-subtitle.small p{
	font-size: 53px;
	line-height: 115%;
	color: #FFFFFF;
	background: #0084FF;
	border-radius: 20px;
	font-weight: 700;
	padding: 10px 20px;
	    display: inline-block;
}

.page-template-tpl-realisation .bhp-image-wrapper {
    padding: 0px 128px 20px;
}

/* --- Wrapper Image --- */
.bhp-image-wrapper {
    position: relative;
    width: 100%;
    height: 620px;
    border-radius: 30px;
    overflow: hidden;
    display: flex;
    align-items: end;
    padding: 0px 128px 130px;
}

/* Image de fond */
.bhp-bg-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
}

/* Overlay sombre pour la lisibilité du texte (optionnel mais recommandé) */
.bhp-image-wrapper::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.2); /* Léger filtre sombre */
    z-index: 2;
}

/* --- Contenu Textuel sur Image --- */
.bhp-overlay-content {
    position: relative;
    z-index: 3;
    color: #fff;
}

/* --- Badge / Logo coin bas droite --- */
.bhp-badge {
    position: absolute;
    bottom: 38px;
    right: 38px;
    z-index: 4;
    min-width: 151px;
    min-height: 94px;
}

.bhp-badge img {
    width: 100%;
    height: auto;
    display: block;
}

.page-template-tpl-realisation .bhp-badge {
    width: 175px;
    height: 110px;
}

/* --- Texte Intro (sous l'image) --- */
.bhp-intro-wrapper {
    margin-top: 2rem;
    text-align: center;
}

.bhp-intro-content {
	width: 1081px;
	font-family: 'Raleway';
	font-style: normal;
	font-weight: 500;
	font-size: 28px;
	line-height: 120%;
	text-align: center;
	color: #000000;
	margin: 72px auto 0px;
}

.bhp-intro-content strong {
    font-weight: 700;
}
@media (max-width: 1499px) and (min-width: 769px) {
    
    /* 1. Reduce Height and Padding */
    .bhp-image-wrapper {
        height: 480px; /* Reduced from 620px */
        padding: 0px 60px 80px; /* Reduced side padding */
    }

    .page-template-tpl-realisation .bhp-image-wrapper {
        padding: 0px 60px 20px;
    }

    /* 2. Scale Typography */
    .block-header-page .bhp-title {
        font-size: 46px; /* Reduced from 60px */
    }

    .block-header-page .bhp-subtitle.big {
        font-size: 36px; /* Reduced from 48px */
    }

    .page-template-tpl-realisation .bhp-subtitle.small p {
        font-size: 38px; /* Reduced from 53px */
    }

    /* 3. Scale Intro Text */
    .bhp-intro-content {
        font-size: 22px; /* Reduced from 28px */
        max-width: 900px; /* Tighter width */
        margin-top: 50px;
    }

    /* 4. Adjust Badge */
    .bhp-badge, 
    .page-template-tpl-realisation .bhp-badge {
        width: 120px; /* Smaller logo */
        height: auto;
        bottom: 25px;
        right: 25px;
    }
	.block-header-page .bhp-subtitle.small {

    max-width: 800px;
}
}
/* Responsive Mobile */
@media (max-width: 768px) {
    .bhp-image-wrapper {
        height: 600px;
		padding: 200px 30px;
		align-items: flex-start;
    }
    .bhp-subtitle {
        font-size: 20px;
		line-height: 130%;
    }
    .block-header-page .bhp-title {
        font-size: 32px;
		line-height: 110%;
    }
	
	.bhp-badge {
		bottom: 30px;
		right: 30px;
		        width: 107px;
        height: 66px;
	}
	
	.bhp-intro-content {
    width: 100%;
    font-size: 16px;
line-height: 130%;
    margin: 40px auto 0px;
}
    .bhp-intro-content p {

        text-align: left !important;
    }
	.block-header-page .bhp-subtitle.big {
font-size: 26px;
line-height: 110%;


}
.page-template-tpl-about  .block-header-page {
     
        margin-bottom: 50px;
    }
	
	
	.page-template-tpl-realisation .bhp-image-wrapper {
    padding: 20px;        display: flex;
        align-items: center;
}
.page-template-tpl-realisation .bhp-subtitle.small p {
    font-size: 30px;
line-height: 139%;        margin-bottom: 4px;
}
.page-template-tpl-realisation .block-header-page .container{
	padding: 0;
}
.page-template-tpl-realisation .bhp-badge {
    width: 107px;
    height: 66px;
}
}