/*
Theme Name: Astra Enfant
Description: Theme enfant de Astra. Vous pouvez maintenant effectuer vos modifications en toute sécurité.
Author: WPMarmite
Author URI: https://wpmarmite.com
Template: astra
Version: 1.0
*/

 /* custom css */
/* body.page.page-id-216 #masthead {
    display: none;
} */

 /* custom css */
/* body.page.page-id-216 #masthead {
    display: none;
} 
.btn_header{color: #fff;}
.btn_header:hover{color: #fff;opacity: .8}
.card .company-logo{max-width: 65% !important}
.section-soins{position:relative;overflow:hidden}
.container-soins{width: 65%}
.section-soins:before{    content: "";
    position: absolute;
    width: 70%;
    height: 70%;
    background: url(https://salon-coiffure-herblay.fr/wp-content/uploads/2025/11/atelier-du-cheveu10.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right bottom;
    top: 30%;
    left: 30%;}
.gallery {
    display: grid;
    grid-template-columns: repeat(4,1fr);
	grid-auto-rows: 35vh
}

.gallery .gallery-item {
    height: 100%;
    width: 100%;
    max-width: 100% !important;
    max-height: 100%;
}

.gallery .gallery-item .gallery-icon,.gallery .gallery-item .gallery-icon img {
    height: 100%;
    max-height: 100%;
    object-fit: cover;
    object-position: center;
}
.div-contain-fixed{position:absolute;width:0px}
body{letter-spacing: .5px}
.navbar-fixed.fixed {
background: #161616;
z-index: 1;}
a.eael-infobox-button{text-decoration: none !important}
.item-service{
padding: 20px 10px;
border: 1px solid #d7d7d7;
border-radius: 20px;}        
.section-balayage .item-service{}
.section-prestations {
position: relative;}
.section-prestations:before {
    content: "";
    position: absolute;
    width: 36%;
    height: 65%;
    background: url(https://salon-coiffure-herblay.fr/wp-content/uploads/2025/11/shape.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right bottom;
    opacity: .07;
    top: 48%;
    left: 65%;}
.atout-item {
border: 1px solid #e6e6e6;
border-radius: 10px;
padding: 2vw;
	transition: all .3s linear;
}
.section-repeated > div {
    border-radius: 10px;
}
.section-repeated .atout-item:hover{padding:0}
.section-avantage .atout-item:hover{background: #fffeed;transform: translateY(-15px);}
.bloc-content h2{text-transform: uppercase;text-wrap: balance}
a.btn-link,a.seemore {
    text-decoration: none !important;
    background: #1A1A1A;
    padding: 20px 30px;
    border-radius: 50px;
    transition: all .3s linear;
    color: #fff;
    font-weight: 600;
    font-size: 16px;

	margin: 20px 0 !important;
	    display: block;
    width: fit-content;
	    box-shadow: 10px 10px 20px #00000038 !important;
	cursor: pointer;
}
.elementor-button{padding: 20px 30px !important;    box-shadow: 10px 10px 20px #00000038 !important;}

a.btn-link:hover,a.seemore:hover {
    background: #FFFEED;
		color: #1A1A1A;
}
.bloc-content h2 {
    color: #161616;
    font-weight: 700;
    font-size: 27px;
	font-family: "Playfair";
	text-transform: uppercase
}
.bloc-content p{font-family: 'Poppins';}
.container-img{height: 60vh}
.container-img img {
    position: relative;
  border-bottom-right-radius: 0px;
    border-top-right-radius: 50%;
	border-bottom-left-radius: 0px;
    border-top-left-radius: 50%;
}
.container-img.right img {
    position: relative;
    border-bottom-right-radius: 0px;
    border-top-right-radius: 50%;
	border-bottom-left-radius: 0px;
    border-top-left-radius: 50%;
}

.container-img:before {
       content: "";
    position: absolute;
    background: #1A1A1A;
    left: calc(20% + 20px);
    top: calc(2% + 20px);
    width: 80%;
    height: 100%;
    border-bottom-right-radius: 0px;
    border-top-right-radius: 50%;
    border-bottom-left-radius: 0px;
    border-top-left-radius: 50%;
}
.container-img.right:before {
       content: "";
    position: absolute;
    background: #1A1A1A;
    left: calc(-7% + 20px);
    top: calc(0% + 20px);
    width: 80%;
    height: 100%;
    border-bottom-right-radius: 0px;
    border-top-right-radius: 50%;
    border-bottom-left-radius: 0px;
    border-top-left-radius: 50%;
}
.section-about,.section-about .img-bloc {
    position: relative;
}
.bandeau-principal,
.headerprincipal,#masthead {
    position: relative;
}
#masthead:after{display:none}
.headerprincipal::after,.bandeau-principal:after {
    content: "";
    position: absolute;
    left: 0;
    width: 100px;
    height: 200px;
    background: url(https://salon-coiffure-herblay.fr/wp-content/uploads/2025/11/ciseau.png);
    transform: translateX(var(--scroll-x));
    transition: transform 0s; 
    pointer-events: none;
	    bottom: -98px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
.section-about .img-bloc:after {
    content: "";
    position: absolute;
    width: 80px;
    height: 80px;
    background: url(https://salon-coiffure-herblay.fr/wp-content/uploads/2025/11/chignon.png);
    left: 10%;
    top: 40px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
.item-atout {
    border-radius: 10px;
    position: relative;
    min-height: 40vh;
		display:flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 2vw;
	gap: 0px;
	height: 100%
}
.item-atout .bloc-header {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.item-atout .bloc-description {
    position: relative;
    text-align: center;
	  color: #eee;
    font-size: 16px;
		display:flex;
	justify-content:center;
	align-items: center;
	  flex-direction: column-reverse;
	gap: 0px
}
.item-atout .bloc-description p{opacity: 0;
	color:#eee;height: 0;transform:translatey(50%);transition: all .3s linear;margin:0}
.item-atout:hover p{opacity:1;height: 100px;transform:translatey(0%)}
.bloc-description a.seemore {
    position: relative;
	width: max-content;
	margin-bottom: 0 !important
}

.item-atout:before {
    content: "";
    position: absolute;
    inset: 0;
    background: #1a1a1aba;
	opacity:.5;
	border-radius: 10px;
	width:90%;
	height: 90%;
	left:5%;
	top:5%;
	transition: all .3s linear
}
.item-atout:hover:before{opacity:1;width:100%;top:0;left:0;height:100%}
.item-atout .bloc-header span {
    color: #fffeed;
    text-transform: uppercase;
    font-weight: 800;
    position: relative;
	font-size: 25px;
	font-family: "Playfair", Sans-serif;
}
.section-prestations{overflow: hidden}
.logo-oboxia img{filter: brightness(0.5) brightness(0.5) brightness(0.5) brightness(0.5) brightness(0.5) brightness(0.5) brightness(0.5) invert(1)}
.wp-gr.wpac .grw-row .grw-header {
    position: relative !important;
    background: #fffeed !important;
    display: flex !important;
    padding: 7% 2% 5% !important;
    border-radius: 20px !important;--col:4
}
.wp-gr .grw-row-m .grw-header+.grw-content{--col:1.3333}
.wp-gr.wpac .grw-row .grw-header .grw-header-inner{padding-top: 2em !important}
.grw-header:before {
    content: "";
    position: absolute;
    width: 80%;
    height: 80px;
    background: url('https://salon-coiffure-herblay.fr/wp-content/uploads/2025/11/gmb.png');
    top: 40px;
    left: 50%;
    transform: translate(-50%);
	    background-size: contain;
    background-repeat: no-repeat;
}
.wp-gr:not(.wp-dark) .grw-review-inner.grw-backgnd {
    background: #ffffff !important;
    border-radius: 20px !important;
    padding: 2vw 2vw 0 !important;
}
.section .gallery-item, .gallery-icon {
    position: relative;
    overflow: hidden;
}

.section .gallery-item .gallery-icon a:before {
    content: "+";
    position: absolute;
    width: 100%;
    background: #00000073;
    height: 100%;
    left: 0;
    top: 0;
    font-size: 3em;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
	border-radius: 10px;
    transition: all .2s linear;
}

.section .gallery-item .gallery-icon a:hover:before {
    opacity: 1;
}
@media (max-width: 767px){
	.container-soins{width: 100%}
	.section-soins:before{display: none}
	.gallery {
    display: grid;
    grid-template-columns: 	repeat(2,1fr);
}
	.bloc-content h2{font-size:20px}
	
.bandeau-principal::after,
.headerprincipal::after{display: none}
	.item-atout .bloc-description p{opacity:1;height: auto}
	.wp-gr.wpac .grw-row .grw-header .grw-header-inner {
    padding-top: 6em !important;
	}
	.grw-header:before{top:4em}
	.wp-gr.wpac .grw-row .grw-header{padding: 12% 2% 12% !important}
	.wp-gr .grw-content {
    position: relative !important;
    min-width: 0 !important;
    background: #ffffff !important;
    margin-top: 2em !important;
    border-radius: 10px !important;
    padding-top: 2em !important;
}
	.container-img:before{display:none}
}
custom css */
/* OBOXIA - boutons Elementor natifs, migration des anciens CTA */
.elementor-widget-button.obx-elementor-cta .elementor-button{display:inline-flex!important;align-items:center!important;justify-content:center!important;max-width:100%;padding:14px 22px!important;border:1px solid transparent!important;border-radius:50px!important;font-family:Poppins,sans-serif!important;font-size:15px!important;font-weight:600!important;line-height:1.25!important;white-space:nowrap;text-decoration:none!important;transition:transform .2s ease,opacity .2s ease,background-color .2s ease}
.elementor-widget-button.obx-elementor-cta .elementor-button:hover,.elementor-widget-button.obx-elementor-cta .elementor-button:focus-visible{transform:translateY(-2px);opacity:.9;text-decoration:none!important}
.elementor-widget-button.obx-elementor-cta .elementor-button:focus-visible{outline:3px solid #c7a66b;outline-offset:3px}
.elementor-widget-button.obx-elementor-cta .elementor-button-content-wrapper{display:inline-flex;align-items:center;gap:9px}
.elementor-widget-button.obx-elementor-cta .elementor-button-icon{display:inline-flex;margin:0!important}
.elementor-widget-button.obx-elementor-cta .elementor-button-icon svg{display:block;width:18px;height:18px;fill:currentColor}
.elementor-widget-button.obx-elementor-cta--header-phone .elementor-button{padding:10px 16px!important;border-color:#fffeed!important;color:#fffeed!important;background:transparent!important;font-size:13px!important}
.elementor-widget-button.obx-elementor-cta--header-rdv .elementor-button{padding:10px 17px!important;border-color:transparent!important;background:#fffeed!important;color:#1a1a1a!important;font-size:13px!important}
.elementor-widget-button.obx-elementor-cta--call .elementor-button{background:#1a1a1a!important;border-color:#fffeed!important;color:#fffeed!important}
.elementor-widget-button.obx-elementor-cta--rdv .elementor-button{background:#fffeed!important;border-color:#1a1a1a!important;color:#1a1a1a!important}
@media(max-width:767px){.elementor-widget-button.obx-elementor-cta .elementor-button{font-size:13px!important;padding:11px 15px!important}.elementor-widget-button.obx-elementor-cta .elementor-button-icon svg{width:16px;height:16px}.elementor-widget-button.obx-elementor-cta--header-phone .elementor-button{padding:9px!important}.elementor-widget-button.obx-elementor-cta--header-phone .elementor-button-text{display:none}}