/*
Theme Name: Mon site enfant de Twenty Sixteen
Template: twentysixteen
Author: Bouillez Lily
DescripTon: Thème enfant crée sur base du thème Twenty Sixteen
Version: 1.0.0
*/

/*typographies générales*/
@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&family=Saira+Condensed:wght@100;200;300;400;500;600;700;800;900&display=swap');

/*.saira-condensed-thin {
  font-family: "Saira Condensed", sans-serif;
  font-weight: 100;
  font-style: normal;
}

.saira-condensed-extralight {
  font-family: "Saira Condensed", sans-serif;
  font-weight: 200;
  font-style: normal;
}

.saira-condensed-light {
  font-family: "Saira Condensed", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.saira-condensed-regular {
  font-family: "Saira Condensed", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.saira-condensed-medium {
  font-family: "Saira Condensed", sans-serif;
  font-weight: 500;
  font-style: normal;
}

.saira-condensed-semibold {
  font-family: "Saira Condensed", sans-serif;
  font-weight: 600;
  font-style: normal;
}

.saira-condensed-bold {
  font-family: "Saira Condensed", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.saira-condensed-extrabold {
  font-family: "Saira Condensed", sans-serif;
  font-weight: 800;
  font-style: normal;
}

.saira-condensed-black {
  font-family: "Saira Condensed", sans-serif;
  font-weight: 900;
  font-style: normal;
}


.roboto-condensed-<uniquifier> {
  font-family: "Roboto Condensed", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}*/
/*h2 {color: #fff;
font-family: "Saira Condensed", sans-serif;
  font-weight: 400 !important;
  font-style: normal;
text-transform: uppercase;
}*/

/*Header*/
body,
html {
    margin: 0;
    padding: 0;
    background-color: #000000;
	width: 100%;
	font-size: 16px;
	scroll-behavior: smooth;
}

.site,
.site-inner {
    margin: 0;
    padding: 0;
}

.skip-link {display: none;}

/* Header container */
.custom-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: #000;
    color: #f26522;
    width: 100vw;
    height: 90px;
    box-sizing: border-box;
    padding-left: 30px;
    padding-right: 30px;
}

/* Logo styling */
.custom-header .logo img {
    height: 50px;
}

/*Mise en page des liens*/
.links a {
    font-family: "Saira Condensed", sans-serif;
    color: #EC6608;
    text-decoration: none;
    font-size: 20px;
}

.links {
    width: 65%;
    display: flex;
    justify-content: flex-end;
    height: 100%;
}

/**/
.links a {
    position: relative;
    padding-left: 20px;
    padding-right: 20px;
    color: #EC6608;
    font-family: "Saira Condensed", sans-serif;
    font-size: 20px;
    text-decoration: none;
    transition: background-color 0.3s ease, color 0.3s ease;
    display: flex;
    align-items: center;
    height: 100%;
}

/* Fond gris au survol */
.links a:hover {
    background-color: #151515;
    color: #ffffff;
    /* facultatif : changer la couleur du texte */
}

/* Ligne en bas au survol */
.links a::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    height: 2px;
    width: 0%;
    background-color: #ffffff;
    transition: width 0.3s ease;
}

.links a:hover::after {
    width: 100%;
}

/* Burger button (hidden on desktop) */
.burger {
    display: none;
    flex-direction: column;
    justify-content: space-between;
    width: 24px;
    height: 18px;
    background: none;
    border: none;
    cursor: pointer;
	padding:0 !important;
}

.burger span {
    display: block;
    height: 3px;
    width: 100%;
    background: #f26522;
    border-radius: 2px;
}

/*responsive header*/
@media (max-width: 1000px) {
    .burger {
        display: flex;
		background: none;
  		border: none;
  		outline: none;
  		-webkit-tap-highlight-color: transparent;
    }
	
	.burger:focus,
.burger:active {
  background-color: transparent;
  outline: none;
  box-shadow: none;
}

    .header-top {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 15px 20px;
        background-color: #000;
    }

    .custom-header {
        flex-direction: column;
        align-items: stretch;
        height: auto;
        padding: 0;
    }

    .links {
        flex-direction: column;
        width: 100%;
        display: none;
        margin-top: 15px;
    }

    .links.active {
        display: flex;
    }

    .links a {
        background: #000;
        padding: 15px 10px;
        border-bottom: 1px solid #333;
        color: #f26522;
        width: 100%;
        border-bottom: 1px solid #222;
        color: #f26522;
    }
}

/*Page d'accueil*/
.entry-content {width: 100vw;
margin:0 !important;}

.site-content {padding: 0;}

.imgbg::before { content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
	background: rgba(0, 0, 0, 4.1);
background: linear-gradient(180deg, rgba(0, 0, 0, 0.5) 37%, rgba(0, 0, 0, 1) 100%);
  z-index: 1;
  pointer-events: none;}

.elementor-heading-title {margin: 0 !important;}

.btn-anim {cursor: pointer; transition: color 0.4s ease;}

.btn-anim::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0%; 
  height: 100%;
  background-color: #000;
  z-index: 1;
  transition: width 0.4s ease;
}

.btn-anim:hover::before {
  width: 100%;
}

.btn-anim:hover .elementor-button-text{
  color: #f26522; 
}

.btn-anim {
  z-index: 0;
}
.btn-anim .elementor-button-text {
  position: relative;
  z-index: 2;
}

.elementor-widget-text-editor div p {margin : 0 !important;}

/*Section cta*/
.elementor-element-0a18c00{background-image: url('http://zoefitcoach.be/wp-content/uploads/2025/07/AccCTAServices1-scaled.jpg');
background-size: cover;
	background-position: center;
  transition: background-image 0.3s ease;}

.elementor-element-0a18c00:hover {background-image: url('http://zoefitcoach.be/wp-content/uploads/2025/07/AccCTAServices2-scaled.jpg');}

.elementor-element-32e2fb3{background-image: url('http://zoefitcoach.be/wp-content/uploads/2025/07/AccCTAFormations1.jpg');
background-size: cover;
	background-position: center;
  transition: background-image 0.3s ease;}

.elementor-element-32e2fb3:hover {background-image: url('http://zoefitcoach.be/wp-content/uploads/2025/07/AccCTAFormations2.jpg');}

.elementor-element-872d7fe{background-image: url('http://zoefitcoach.be/wp-content/uploads/2025/07/AccCTAPartenaire1-scaled.jpg');
background-size: cover;
	background-position: center;
  transition: background-image 0.3s ease;}

.elementor-element-872d7fe:hover {background-image: url('http://zoefitcoach.be/wp-content/uploads/2025/07/AccCTAPartenaire2-scaled.jpg');}

.ctaimg {color :#000; box-shadow:none !important; cursor: pointer; transition: color 0.4s ease;}

.elementor-element-de9ec69::before, .elementor-element-688bb26::before, .elementor-element-ee22d6b::before{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0%; 
  height: 100%;
  background-color: #000;
  z-index: 1;
  transition: width 0.4s ease;
}
.ctaimg:hover .elementor-element-de9ec69::before, .ctaimg:hover .elementor-element-688bb26::before, .ctaimg:hover .elementor-element-ee22d6b::before{
  width: 100%;
}

.ctaimg:hover h3 {
	color: #EC6608;}

.ctaimg {
  z-index: 0;
}
.ctaimg h3 {
  position: relative;
  z-index: 2;
}

.elementor-widget-container ul{margin : 0 !important;}

.entry-footer {display: none;}

/*--------------FOOTER---------------------*/

.footer {
    background-color: #151515;
    color: #EC6608;
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 300;
    padding: 5vh 10vw;
    font-size: 1.1rem;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
	width: 100vw;
}

.footer-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
    margin: 0;
}

.footer-logo img {
    width: 100px;
    margin-bottom: 20px;
}

.footer-links ul {
    list-style: none;
    padding: 0;
}

.footer-links li {
    margin-bottom: 20%;
}

.footer-links a {
    color: #ff6600;
    text-decoration: none;
    transition: color 0.3s;
}

.footer-links a:hover {
    color: #BE5504;
}

.footer-contact h3,
.footer-social h3 {
    font-size: 1.5rem;
    font-family: "Saira Condensed", sans-serif;
    font-weight: 400;
    font-style: normal;
    margin-bottom: 15%;
    margin-top: 0;
}

.footer-contact p,
.footer-contact a {
    margin: 10% 0;
    color: #ff6600;
    text-decoration: none;
}

.social-icons {
    display: flex;
    justify-content: space-between;
}

.footer-social {
    width: 10%;
}

.footer-social .social-icons a {
    height: auto;
    width: 20%;
}

.iconfacebook:hover img,
.icon-instagram:hover img,
.icon-linkedin:hover img {
    filter: brightness(0) invert(31%) sepia(99%) saturate(1217%) hue-rotate(8deg) brightness(93%) contrast(97%);
}

.footer-bottom {
    display: inline-block;
    width: auto;
}

.site-main {margin: 0;}

/* ---------------------- Responsive Footer ------------------------ */

@media (max-width: 1024px) {
    .footer {
        align-items: flex-end;
        text-align: left;
    }

    .footer-container {
        flex-direction: column;
        align-items: flex-start;
        gap: 30px;
    }

    .footer-logo {
        margin-bottom: 20px;
    }

    .footer-links ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        gap: 10px 20px;
        padding: 0;
    }

    .footer-links li {
        margin-bottom: 10px;
    }

    .footer-contact,
    .footer-social {
        width: 100%;
        max-width: 300px;
    }

    .footer-contact h3,
    .footer-social h3 {
        margin-bottom: 10px;
    }

    .footer-contact p {
        margin: 5px 0;
    }

    .social-icons {
        justify-content: flex-start;
        gap: 15px;
    }

    .footer-social .social-icons a {
        width: 30px;
    }

    .footer-bottom {
        margin-top: 30px;
        text-align: center;
        font-size: 0.9rem;
    }
}

/*------------ SERVICES-------------*/
.cadre-anim {color :#000; box-shadow:none !important;}

.cadre-anim, .cadre-anim .elementor-heading-title {cursor: pointer; transition: color 0.4s ease;}

.cadre-anim .elementor-element-7a1de76::before,  
.cadre-anim .elementor-element-dfeeb05::before,
.cadre-anim .elementor-element-9ec4645::before,
.cadre-anim .elementor-element-b4c41bc::before{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0%; 
  height: 100%;
  background-color: #000;
  z-index: 1;
  transition: width 0.4s ease;
}

.cadre-anim:hover .elementor-element-7a1de76::before, 
.cadre-anim:hover .elementor-element-dfeeb05::before,
.cadre-anim:hover .elementor-element-9ec4645::before,
.cadre-anim:hover .elementor-element-b4c41bc::before{
  width: 100%;
}

.cadre-anim:hover .elementor-heading-title{
  color: #fff !important; 
}

.cadre-anim:hover .elementor-element-96e53eb {color: #fff;}

.cadre-anim {
  z-index: 0;
}
.cadre-anim h3 {
  position: relative;
  z-index: 2;
}

.cadre-anim p {display: none;}

.cadre-anim:hover p {display:block}

.cadre-anim:hover::before{content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%; 
  height: 100%;
  background-color: rgba(0, 0, 0, 0.3);
  transition: width 0.4s ease;}

/*TARIFS*/
.cadre-tarif h3 {display: inline-block; 
	width: auto;}

.cadre-tarif h4 {font-family: "Saira Condensed", sans-serif;
  font-weight: 400;
  font-style: normal;
font-size:1.5rem;
text-transform:normal !important;
}

/*SURVOL*/
.cadre-tarif {color :#000; box-shadow:none; cursor: pointer; transition: color 0.4s ease;}

.cadre-tarif .elementor-element-b710e64::before, .cadre-tarif .elementor-element-a3ad849::before{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0%; 
  height: 100%;
  background-color: #000;
  z-index: 1;
  transition: width 0.4s ease;
}
.cadre-tarif:hover .elementor-element-b710e64::before, .cadre-tarif:hover .elementor-element-a3ad849::before{
  width: 100%;
}

.cadre-tarif {
  z-index: 0;
	overflow: hidden;
}

.cadre-tarif:hover h3 {color: #EC6608;}

.cadre-tarif h3 {
  position: relative;
  z-index: 2;
}

.cadre-tarif::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: linear-gradient(
    0deg, 
    transparent, 
    transparent 30%, 
    rgba(236,102,8,0.5)
  );
  transform: rotate(-45deg);
  transition: all 0.5s ease;
  opacity: 0;
}

.cadre-tarif:hover {
	border: none !important;
  transform: scale(1.05);
  box-shadow: 0 0 20px rgba(236,102,8,0.7) !important;
}

.cadre-tarif:hover::before {
  opacity: 1;
  transform: rotate(-45deg) translateY(100%);
}

/*Cadre horizontaux*/
.cadre-tarif2 {color :#000; box-shadow:none; cursor: pointer; transition: color 0.4s ease;}

.cadre-tarif2 .elementor-element-bda9dcd::before, .cadre-tarif2 .elementor-element-7ae5d0e::before, .cadre-tarif2 .elementor-element-0038eca::before{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0%; 
  height: 100%;
  background-color: #000;
  z-index: 1;
  transition: width 0.4s ease;
}
.cadre-tarif2:hover .elementor-element-bda9dcd::before, .cadre-tarif2:hover .elementor-element-7ae5d0e::before, .cadre-tarif2:hover .elementor-element-0038eca::before{
  width: 100%;
}

.cadre-tarif2 {
  z-index: 0;
	overflow: hidden;
}

.cadre-tarif2:hover h3 {color: #EC6608;}

.cadre-tarif2 h3 {
  position: relative;
  z-index: 2;
}

.cadre-tarif2::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: linear-gradient(
    0deg, 
    transparent, 
    transparent 30%, 
    rgba(236,102,8,0.5)
  );
  transform: rotate(-45deg);
  transition: all 0.5s ease;
  opacity: 0;
}

.cadre-tarif2:hover {
	border: none !important;
  transform: scale(1.05);
  box-shadow: 0 0 20px rgba(236,102,8,0.7) !important;
}

.cadre-tarif2:hover::before {
  opacity: 1;
  transform: rotate(-45deg) translateY(150%);
}

/*MES FORMATIONS*/
.sommaire {
	box-shadow:none !important; 
	cursor: pointer; 
	transition: color 0.4s ease}

.sommaire:hover h3 {
	color: #EC6608 !important;
}
/*MES PARTENAIRES*/
.aparternaire a{box-shadow: none;}

.aparternaire a:hover{text-decoration: underline;
text-decoration-thickness: 1px;
text-underline-offset: 5px;}

/*CONTACT*/
.contact-wrapper {
	margin: 2rem;
	display :flex;
	justify-content: space-between;
}

.contact-wrapper input {
	text-transform: uppercase;
font-family: "Saira Condensed", sans-serif;
 	 font-weight: 400;
 	 font-style: normal;
color: #BE5504;
font-size: 1.2rem;}

.wpcf7-not-valid-tip {font-family: "Saira Condensed", sans-serif;
 	 font-weight: 400;
 	 font-style: normal;
color: #EC6608;}

.colonne2 {display: flex;
flex-direction: column;
justify-content: space-between;}

.contact-field:not(.choixmultiples) label{display: none;}

.contact-field input {background-color: #000;
border: none;
border-bottom: 1px solid #fff;
background-image: none;}

.contact-field textarea {background-color: #000;
border: none;
border: 1px solid #fff;
color: #fff;
background-image: none;
text-transform: uppercase;
font-family: "Saira Condensed", sans-serif;
 	 font-weight: 400;
 	 font-style: normal;
color: #BE5504;
font-size: 1.2rem;}


.choixmultiples {color: #686868;
text-transform: uppercase;
font-family: "Saira Condensed", sans-serif;
 	 font-weight: 400;
 	 font-style: normal;
font-size: 1.2rem;}

.wpcf7-form-control {display: flex;
flex-direction: column;}

/*CONTACT - BOUTON*/
.contact-submit input{justify-self: flex-end;
cursor: pointer; 
	transition: color 0.4s ease;
color: #000;
background-color: #EC6608;}

.contact-submit input:hover {color: #EC6608;
background-color: #000;}

.wpcf7-response-output {color: #686868;
text-transform: uppercase;
font-family: "Saira Condensed", sans-serif;
 	 font-weight: 400;
border-bottom-color: #EC6608;
color: #fff;}

/*LIEU*/
.elementor-element-be707d5{
	background-image: url('http://zoefitcoach.be/wp-content/uploads/2025/09/ContactGaetan.jpg');
background-size: cover;
	background-position: center;
  transition: background-image 0.3s ease;
box-shadow: none !important;}

.elementor-element-be707d5 h2,  .elementor-element-be707d5 p{display: none;
 transition: display 0.3s ease;}

.elementor-element-be707d5:hover h2 {display: flex;}

.elementor-element-be707d5:hover p {display: flex; justify-self: flex-end;}

.elementor-element-be707d5:hover {background-image: url('http://zoefitcoach.be/wp-content/uploads/2025/09/ContactGaetanHoverV2.jpg');}

.elementor-element-7810024{background-image: url('http://zoefitcoach.be/wp-content/uploads/2025/09/ContactSportetvous.jpg');
background-size: cover;
	background-position: center;
  transition: background-image 0.3s ease;
box-shadow: none !important;}

.elementor-element-7810024 h2,  .elementor-element-7810024 p{display: none;
 transition: display 0.3s ease;}

.elementor-element-7810024:hover h2 {display: flex;
justify-self: center;}

.elementor-element-7810024:hover p {display: flex; justify-self: flex-end;}

.elementor-element-7810024:hover {background-image: url('http://zoefitcoach.be/wp-content/uploads/2025/09/ContactSportetvousHover.jpg');}

/*-----------------------Articles-----------------------*/
.cadre-article {color :#000; box-shadow:none; cursor: pointer; transition: color 0.4s ease;}

.cadre-article .elementor-element-a7497ef::before{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0%; 
  height: 100%;
  background-color: #000;
  z-index: 1;
  transition: width 0.4s ease;
}
.cadre-article:hover .elementor-element-a7497ef::before{
  width: 100%;
}

.cadre-article {
  z-index: 0;
	overflow: hidden;
}

.cadre-article:hover h3 {color: #EC6608;}

.cadre-article h3 {
  position: relative;
  z-index: 2;
}

.cadre-article::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: linear-gradient(
    0deg, 
    transparent, 
    transparent 30%, 
    rgba(236,102,8,0.5)
  );
  transform: rotate(-45deg);
  transition: all 0.5s ease;
  opacity: 0;
}

.cadre-article:hover {
	border: none !important;
  transform: scale(1.05);
  box-shadow: 0 0 20px rgba(236,102,8,0.7) !important;
}

.cadre-article:hover::before {
  opacity: 1;
  transform: rotate(-45deg) translateY(150%);
}

.cadre-article .elementor-element-fa44368::before{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0%; 
  height: 100%;
  background-color: #000;
  z-index: 1;
  transition: width 0.4s ease;
}

.cadre-article:hover .elementor-element-fa44368::before{
  width: 100%;
}

/*Masquer les avis*/
.avis {display: none;}