/*
Theme Name:     targetthemoon creativist studio
Theme URI:      https://targetthemoon.creativiststudio.com/
Template:       kadence
Author:         creativist studio
Author URI:     https://creativist.studio
Description:    Target the Moon is a sleek WordPress theme designed for female coaches and entrepreneurs. It features a professional, feminine design perfect for coaching businesses, consultants, and small business owners. The theme includes sections for services, testimonials, blog content, and personal branding, with a clean layout that builds trust and converts visitors into clients. Ideal for women building coaching or consulting businesses who want an elegant, professional online presence.
Version:        0.1
License:        GNU General Public License v3.0 (or later)
License URI:    https://www.gnu.org/licenses/gpl-3.0.html
*/
/* ------------------------------------------------------- */
.header-navigation ul.sub-menu {
padding: 20px;
}
	/* ------------------------------------------------------- */
.brand img:hover {animation:jello-vertical .5s linear both} @keyframes jello-vertical{0%{transform:scale3d(1,1,1)}30%{transform:scale3d(.75,1.25,1)}40%{transform:scale3d(1.25,.75,1)}50%{transform:scale3d(.85,1.15,1)}65%{transform:scale3d(1.05,.95,1)}75%{transform:scale3d(.95,1.05,1)}100%{transform:scale3d(1,1,1)}}

.site-branding .site-title hover {animation:jello-vertical .5s linear both} @keyframes jello-vertical{0%{transform:scale3d(1,1,1)}30%{transform:scale3d(.75,1.25,1)}40%{transform:scale3d(1.25,.75,1)}50%{transform:scale3d(.85,1.15,1)}65%{transform:scale3d(1.05,.95,1)}75%{transform:scale3d(.95,1.05,1)}100%{transform:scale3d(1,1,1)}}

/* ------------------------------------------------------- */

/* change color selection mouse pointer mouse */
::-moz-selection { /* Code for Firefox */
  color: white;
  background: #171D23;
}

::selection {
  color: white;
  background: #171D23;
}
/* ------------------------------------------------------- */
	
/* Keyframes for the slide-down animation */
@keyframes slide-down {
    from {
        transform: translateY(-100%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Keyframes for the slide-up animation */
@keyframes slide-up {
    from {
        transform: translateY(0);
        opacity: 1;
    }
    to {
        transform: translateY(-100%);
        opacity: 0;
    }
}

/* Initial state of the sticky header (transparent) */
.item-at-start {
    background-color: transparent; /* Ensure the background is transparent */
    transition: background-color 0.5s ease, opacity 0.5s ease; /* Smooth transition for background color and opacity */
    opacity: 1;
}

/* State of the sticky header when it becomes sticky and white */
.item-is-stuck {
    background-color: white; /* Change background color to white */
    animation: slide-down 0.5s ease-out; /* Apply slide-down animation */
    opacity: 1; /* Ensure the opacity is set to 1 */
}

/* State of the sticky header when it is hidden */
.item-hidden {
    background-color: transparent; /* Ensure the background is transparent */
    animation: slide-up 0.5s ease-in; /* Apply slide-up animation */
    opacity: 0; /* Ensure the opacity is set to 0 */
}
.item-is-stuck {

box-shadow: 0 2px 4px rgb(45 62 80 / 8%);
}
/* ------------------------------------------------------- */
	
.rotate-text {  transform-origin: 0 0;    transform: rotate(-90deg);    
position: absolute;    
width: 350px !important;    bottom: 0;    
margin-left: 20px;}. 
.rotate-text-container {  position: relative;}

.rotate-text2 {  transform-origin: 0 0;    transform: rotate(-90deg);    
position: absolute;    
width: 350px !important;    bottom: 0;    
margin-left: 1px;}. 
.rotate-text-container {  position: relative;}
/* ------------------------------------------------------- */

/* badge NEW */
.yith-wcbm-badge {
    z-index: 10; /* Ajustez cette valeur selon vos besoins */
}
/* ------------------------------------------------------- */
.wp-block-kadence-posts .loop-entry {
	box-shadow: 0px 0px 0px 0px rgba(0,0,0,.00);
	border-radius: .25rem
}
/* ------------------------------------------------------- */

.justify-text 
{
	text-align: justify;
  text-justify: inter-word;
}
/* -----------------------------------decalbloc-------------------- */
.decalbloc {
    transition: transform 0.5s ease;
  }
  
.decalbloc:hover {
    transform: translateY(-15px); 
  }

.degtext {
  transform: skewY(-5deg);
}
/* -----------------------------------defilement-text------------------- */


.defiltext-wrapper {
   margin: auto;
   width: 100%;
   overflow: hidden;
}

.defiltext {
   -webkit-text-stroke: 1px #F5F1E6;
   white-space: nowrap;
   animation: run 20s linear infinite;
}

@keyframes run {
   from {
      transform: translateX(0%);
   }
   /* Magic is here. This is the width of the elem with text after rendering the page */
   to {
      transform: translateX(-1683.35px); /* Ajuste cette valeur selon la largeur de ton texte */
   }
}

.my-block {
  
  transition: background-color 0.5s ease; /* Transition douce */
  
  text-align: center; /* Centrer le texte */
}

.my-block:hover {
  background-color: rgba(0, 0, 0, 0.05); /* Overlay noir très léger au survol */
}

/* Glassmorphism CSS */
.glass {
  background: rgba(255, 255, 255, 0.21);
  backdrop-filter: blur(5px) saturate(100%) brightness(100%);
  -webkit-backdrop-filter: blur(5px) saturate(100%) brightness(100%);
  border-radius: 0px;
  border: 1px solid rgba(255, 255, 255, 0.65);
  box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.1);
}