/*
Theme Name: Wanderstudio__theme
Description: Theme enfant de twentytwentyfive
Author: Romain Dhomps
Author URI: https://www.wanderstudio.fr
Template: twentytwentyfive
Version: 0.1.0
*/

/* TYPOGRAPHIE */
@font-face {
    font-family: 'Montserrat-Black';
    src: url(fonts/Montserrat-Black.ttf) format('truetype');
}

@font-face {
    font-family: 'Montserrat-BlackItalic';
    src: url(fonts/Montserrat-BlackItalic.ttf) format('truetype');
}

@font-face {
    font-family: 'Montserrat-Bold';
    src: url(fonts/Montserrat-Bold.ttf) format('truetype');
}

@font-face {
    font-family: 'Montserrat-BoldItalic';
    src: url(fonts/Montserrat-BoldItalic.ttf) format('truetype');
}

@font-face {
    font-family: 'Montserrat-ExtraBold';
    src: url(fonts/Montserrat-ExtraBold.ttf) format('truetype');
}

@font-face {
    font-family: 'Montserrat-ExtraBoldItalic';
    src: url(fonts/Montserrat-ExtraBoldItalic.ttf) format('truetype');
}

@font-face {
    font-family: 'Montserrat-ExtraLight';
    src: url(fonts/Montserrat-ExtraLight.ttf) format('truetype');
}

@font-face {
    font-family: 'Montserrat-ExtraLightItalic';
    src: url(fonts/Montserrat-ExtraLightItalic.ttf) format('truetype');
}

@font-face {
    font-family: 'Montserrat-Italic';
    src: url(fonts/Montserrat-Italic.ttf) format('truetype');
}

@font-face {
    font-family: 'Montserrat-Light';
    src: url(fonts/Montserrat-Light.ttf) format('truetype');
}

@font-face {
    font-family: 'Montserrat-LightItalic';
    src: url(fonts/Montserrat-LightItalic.ttf) format('truetype');
}

@font-face {
    font-family: 'Montserrat-Medium';
    src: url(fonts/Montserrat-Medium.ttf) format('truetype');
}

@font-face {
    font-family: 'Montserrat-MediumItalic';
    src: url(fonts/Montserrat-MediumItalic.ttf) format('truetype');
}

@font-face {
    font-family: 'Montserrat-Regular';
    src: url(fonts/Montserrat-Regular.ttf) format('truetype');
}

@font-face {
    font-family: 'Montserrat-SemiBold';
    src: url(fonts/Montserrat-SemiBold.ttf) format('truetype');
}

@font-face {
    font-family: 'Montserrat-SemiBoldItalic';
    src: url(fonts/Montserrat-SemiBoldItalic.ttf) format('truetype');
}

@font-face {
    font-family: 'Montserrat-Thin';
    src: url(fonts/Montserrat-Thin.ttf) format('truetype');
}

@font-face {
    font-family: 'Montserrat-ThinItalic';
    src: url(fonts/Montserrat-ThinItalic.ttf) format('truetype');
}

a {
    outline-width: 0px ;
}

a,p {
    font-family: 'Montserrat-Light' !important;
    font-style: normal;
    font-weight: 500;
    text-align: justify;
}

h1,h2,h3,h4,h5,h6 {
    font-family: 'Montserrat-Regular' !important;
}
.bckgrd-accueil {
    z-index: 0;
}

.bckgrd-accueil::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.5); /* Voile blanc à 50% */
    pointer-events: none; /* Permet de cliquer à travers le voile */
    z-index: -1;
}

/* Mobile */
@media (max-width: 768px) {
  .elem-bckgrd {
    background-image: url('https://wanderstudio.fr/wp-content/uploads/2025/09/wanderstudio-acceuil-webmaster-mobile-scaled.webp') !important;
    background-attachment: scroll !important;
    background-size: inherit !important;
  }
}

.bouton-esp {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 250px;
    height: 55px;
    box-sizing: border-box;
    transition-timing-function: ease-out;
    transition-duration: 0.3s;
    border: 1px !important;
    border-style: solid !important;
    border-radius: 3px !important;
}

.bouton-esp:hover {
    transform: translateY(-8px);
    box-shadow: 0 10px 10px grey;
}

.bouton-esp:active {
  box-shadow:
    inset 0px -12px 12px -6px rgba(3, 15, 20, 1),
    inset 0px 12px 12px -6px rgba(3, 15, 20, 1),
    inset 12px 0px 12px -6px rgba(3, 15, 20, 1),
    inset -12px 0px 12px -6px rgba(3, 15, 20, 1),
    -1px -1px 6px 0px rgba(54, 69, 75, 1);
}

.bouton-esp a:hover {
    background: none;
}

.bouton-dev a:hover {
    background: none;
}

.bouton-dev {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 275px;
    height: 55px;
    box-sizing: border-box;
    transition-timing-function: ease-out;
    transition-duration: 0.3s;
    border: 1px !important;
    border-style: solid !important;
    border-radius: 3px !important;
}

.bouton-dev:hover {
    transform: translateY(-8px);
    box-shadow: 0 10px 10px grey;
}

.bouton-dev:active {
  box-shadow:
    inset 0px -12px 12px -6px rgba(3, 15, 20, 1),
    inset 0px 12px 12px -6px rgba(3, 15, 20, 1),
    inset 12px 0px 12px -6px rgba(3, 15, 20, 1),
    inset -12px 0px 12px -6px rgba(3, 15, 20, 1),
    -1px -1px 6px 0px rgba(54, 69, 75, 1);
}

.bouton-maint a:hover {
    background: none;
}

.bouton-maint {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 300px;
    height: 55px;
    box-sizing: border-box;
    transition-timing-function: ease-out;
    transition-duration: 0.3s;
    border: 1px !important;
    border-style: solid !important;
    border-radius: 3px !important;
}

.bouton-maint:hover {
    transform: translateY(-8px);
    box-shadow: 0 10px 10px grey;
}

.bouton-maint:active {
  box-shadow:
    inset 0px -12px 12px -6px rgba(3, 15, 20, 1),
    inset 0px 12px 12px -6px rgba(3, 15, 20, 1),
    inset 12px 0px 12px -6px rgba(3, 15, 20, 1),
    inset -12px 0px 12px -6px rgba(3, 15, 20, 1),
    -1px -1px 6px 0px rgba(54, 69, 75, 1);
}

.img-acc-hov-act {
    transition-timing-function: ease-out;
    transition-duration: 0.3s;
    z-index: 0;
}

.img-acc-hov-act img:hover {
    backdrop-filter: blur(4px);
}
.img-acc-hov-act img {
    transition: all 0.5s;
}

.img-acc-hov-act:hover {
    transform: translateY(-8px);
    box-shadow: 0 10px 10px grey;
}

.img-acc-hov-act:active {
  box-shadow:
    inset 0px -12px 12px -6px rgba(3, 15, 20, 1),
    inset 0px 12px 12px -6px rgba(3, 15, 20, 1),
    inset 12px 0px 12px -6px rgba(3, 15, 20, 1),
    inset -12px 0px 12px -6px rgba(3, 15, 20, 1),
    -1px -1px 6px 0px rgba(54, 69, 75, 1);
}

/*Formulaire*/

#formulaire-responsive {
	max-width:600px /*-- à modifier en fonction de la largeur désirée --*/;
	margin:0px;
        width:100%;
}
.rang-form {
	width: 100%;
}
.demi-colonne, .colonne {
	float: left;
	position: relative;
	padding: 0.65rem;
	width:100%;
	-webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box
}
.clearfix:after {
	content: "";
	display: table;
	clear: both;
}

/**---------------- Media query ----------------**/
@media only screen and (min-width: 48em) { 
	.demi-colonne {
		width: 50%;
	}
}

.wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 textarea {
	width: 100%;
	padding: 8px;
	border: 1px solid #ccc;
	border-radius: 3px;
	-webkit-box-sizing: border-box;
	 -moz-box-sizing: border-box;
	      box-sizing: border-box
}
.wpcf7 input[type="text"]:focus{
	background: #fff;
}
.wpcf7-submit{
	display: flex !important;
    float: right;
    font-family: 'Montserrat-Light' !important;
    font-size: 21px;
    font-weight: bold;
    align-items: center;
    justify-content: center;
    width: 275px;
    height: 55px;
    box-sizing: border-box;
    transition-timing-function: ease-out;
    transition-duration: 0.3s;
    border: 1px !important;
    border-style: solid !important;
    border-radius: 3px !important;
    background-color: transparent !important;
}
.wpcf7-submit:hover{
	transform: translateY(-8px);
    box-shadow: 0 10px 10px grey;
}

.wpcf7-submit:active {
    box-shadow:
    inset 0px -12px 12px -6px rgba(3, 15, 20, 1),
    inset 0px 12px 12px -6px rgba(3, 15, 20, 1),
    inset 12px 0px 12px -6px rgba(3, 15, 20, 1),
    inset -12px 0px 12px -6px rgba(3, 15, 20, 1),
    -1px -1px 6px 0px rgba(54, 69, 75, 1);
}

span.wpcf7-not-valid-tip{
	text-shadow: none;
	font-size: 12px;
	color: #fff;
	background: #E7414D;
	padding: 5px;
}
div.wpcf7-validation-errors { 
	text-shadow: none;
	border: transparent;
	background: #f9cd00;
	padding: 5px;
	color: #9C6533;
	text-align: center;
	margin: 0;
	font-size: 12px;
}
div.wpcf7-mail-sent-ok{
	text-align: center;
	text-shadow: none;
	padding: 5px;
	font-size: 12px;
	background: #59a80f;
	border-color: #59a80f;
	color: #fff;
	margin: 0;
}

.wpcf7-response-output {
    max-width:400px /*-- à modifier en fonction de la largeur désirée --*/;
	margin:0px !important;
    width:100%;
    font-family: 'Montserrat-Light' !important;
    font-size: 12px;
    border: 1px !important;
    border-color: #1E375A !important;
    border-style: solid !important;
}

.wpcf7 p {
    margin: 0px;
}

/*En tête */

.sticky-menu {
    position: sticky !important;
    top: 0px;
    z-index: 1;
}

.grd-lin {
    background: linear-gradient(to bottom, black, transparent) !important;
}

.grd-lin2 {
    background: linear-gradient(to top, black, transparent) !important;
}

/*page site internet*/

.grd-web {
    border-radius: 5px;
}

.grd-web:hover {
    box-shadow: 0 0 25px grey;
    transition: all .3s ease-in-out 0s;
}

.grd-web h2 {
    padding: 15px !important;
}

.grd-web li:hover {
    background-color: #e4e4e4;
    border-left: 5px solid #D3AF37;
    transition: all .3s ease-in-out 0s;
}

.grd-web ul {
    list-style-type: none;
    padding-left: 0; /* Optionnel : pour supprimer l'indentation par défaut */
    margin-left: 0;  /* Optionnel : pour supprimer la marge par défaut */
}

.grd-web li {
    padding: 15px;
    cursor: default;
    margin: 0;
}

/* Offre Essentiel */
.offre-essentiel {
  background-color: #F8F9FA;
  border: 1px solid #DEE2E6;
  box-shadow: 0 4px 8px rgba(168, 169, 173, 0.3);
  color: #333; /* Texte noir pour le contraste */
}

.offre-essentiel h2 {
  color: #A8A9AD;
}

/* Offre Premium */
.offre-premium {
  background-color: #FFF8F0;
  border: 1px solid #D4AF37;
  box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
  color: #333;
}

.offre-premium h2 {
  color: #D4AF37;
}