/*
 Theme Name:   Keroz Theme
 Theme URI:    https://keroz.fr
 Description:  A child theme for GeneratePress made by Keroz Web Design
 Author:       Keroz
 Author URI:   https://keroz.fr
 Template:     generatepress
 Version:      2.1
*/

/* --- TEXTES --- */

strong {
    font-weight: 600;
}

:is(
  p,
  blockquote,
  li,
  h1, h2, h3, h4, h5, h6
):not(.no-pretty) {
  text-wrap: pretty;
}

p:last-child:last-of-type {
	margin-bottom: 0;
}

.button-primary-acrylic strong {
	font-size: 1.25rem;
	line-height: 1.2em;
}

/* --- MODULES CUSTOM --- */

/* Hero video */

.hero-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 2;
}


/* 5 étapes */

.steps-grid:has(.gb-accordion__item-open[data-step="1"]) .steps-images .step-1,
.steps-grid:has(.gb-accordion__item-open[data-step="2"]) .steps-images .step-2,
.steps-grid:has(.gb-accordion__item-open[data-step="3"]) .steps-images .step-3,
.steps-grid:has(.gb-accordion__item-open[data-step="4"]) .steps-images .step-4,
.steps-grid:has(.gb-accordion__item-open[data-step="5"]) .steps-images .step-5 {
  opacity: 1;
  z-index: 1;
  pointer-events: auto;
}

/* Modules Avant - Après */

.compare {
  user-select: none;
}

.compare > * {
	grid-area: 1/1;
}

.before {
  -webkit-mask: linear-gradient(
    to right,
    #000 var(--pos, 50%),
    transparent 0
  );
  mask: linear-gradient(
    to right,
    #000 var(--pos, 50%),
    transparent 0
  );
}

.after {
  -webkit-mask: linear-gradient(
    to right,
    transparent var(--pos, 50%),
    #000 0
  );
  mask: linear-gradient(
    to right,
    transparent var(--pos, 50%),
    #000 0
  );
}

.compare::before{
  content: "";
  position: absolute;
  left: var(--pos, 50%);
  transform: translateX(-50%);
  top: 0;
  height: 100%;
  width: 4px;
  background: var(--base-0);
  z-index: 3;
  pointer-events: none;
}

.compare input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  appearance: none;
  background: transparent;
  cursor: pointer;
  z-index: 4;
}

.compare input::-webkit-slider-thumb {
  display: none; /* masque le thumb sur WebKit */
}

.compare input::-moz-range-thumb {
  display: none; /* masque le thumb sur Firefox */
}

.compare input:focus-visible::-webkit-slider-thumb {
  outline: 2px solid var(--base-0);
  outline-offset: 2px;
}

.compare .compare-thumb {
  position: absolute;
  top: 50%;           /* centre vertical */
  left: var(--pos, 50%); /* centre horizontal à la position du slider */
  transform: translate(-50%, -50%); /* centre exact sur la position */
  z-index: 6;
}

/* Texte défilant */ 

.texte-defile p {
  white-space: nowrap;
  animation: marquee 30s linear infinite;
  will-change: transform;
}

/* pause au hover */
.texte-defile p:hover {
  animation-play-state: paused;
}

@keyframes marquee {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}


/* Formulaire newsletter */

.mc4wp-form-fields .form-news {
	display: flex;
	gap: 1rem;
	& input {
		border-radius: .5rem;
	}
	& input[type="email"] {
		width: 260px;
		border: 2px solid var(--base-0);
		background: var(--base-0);
	}
	& input:focus {
		border: 2px solid var(--brand-2);
	}
	& input[type="submit"] {
		font-weight: 600;
		letter-spacing: 0.02em;
		background: var(--base-600);
	}
	& input[type="submit"]:hover {
		color: var(--base-700);
		background: var(--base-300);
	}
}

.mc4wp-form-fields .form-news input[type="submit"] {
	flex-shrink: 0;
}

@media screen and (max-width:400px) {
	.mc4wp-form-fields .form-news {
		flex-direction: column;
	}
	.mc4wp-form-fields .form-news input[type="email"] {
		width: 100%;
	}
}

/* --- HOME TOUR --- */

.overlay-video-wrapper {
  width: 100%;
  aspect-ratio: 16 / 9;
  position: relative;
}

.overlay-video-iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

/*
 * LANDING PAGES
 */

.faq-section:has(.faq-wrapper:empty), 
.maillage-section:has(.maillage-wrapper:empty) {
	display: none;
}

.lp-maillage {
	display: grid;
	gap: 1rem;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

/* 
 * DEVIS EN LIGNE
 */

header.site-header, footer.site-info {
	display: none;
}


/* HEADER */


/* FOOTER */

.footer-legal p {
  padding: 0 .5rem;
  border-right: 1.5px solid var(--base-600);
}

.footer-legal p:last-child {
  border-right: none;
}

/*
 * HUBSPOT
 */

body #hubspot-messages-iframe-container {
	display:none!important;
}

/* --- BLOG --- */

/* SOMMAIRE */
.article-sommaire ul {
  list-style-type: none;
  margin: 0;
}
.article-sommaire li {
  margin-top: 1rem;
}