/*!
Theme Name: Pirineuweb-Kadence-Child
Theme URI: https://www.kadencewp.com/kadence-theme/
Template: kadence
Author: Kadence WP
Author URI: https://www.kadencewp.com/
Description: A child theme for the Kadence Theme.
Version: 1.0.0
License: GNU General Public License v3.0 (or later)
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Text Domain: pirineuweb-kadence-child
*/

/* Theme customization starts here
-------------------------------------------------------------- */

/* DESKTOP */
.text-highlight {
	font-size: 1.25rem;
}

.text-large {
	font-size: 1.55rem;
}

.eyebrow {
	font-size: 1.2rem;
	margin-bottom: 0.5rem;
	text-transform: uppercase;
}

.cta-title {
	font-size: 3.75rem;
}

.cta-title-xl {
	font-size: 6.75rem;
}


/* TABLET */
@media (max-width: 1024px) {

	.text-highlight {
		font-size: 1.15rem;
	}

	.text-large {
		font-size: 1.35rem;
	}

	.eyebrow {
		font-size: 1.05rem;
	}

	.cta-title {
		font-size: 3rem;
	}

	.cta-title-xl {
		font-size: 5rem;
	}
}


/* MÒBIL */
@media (max-width: 767px) {

	.text-highlight {
		font-size: 1.05rem;
	}

	.text-large {
		font-size: 1.2rem;
	}

	.eyebrow {
		font-size: 0.95rem;
	}

	.cta-title {
		font-size: 2rem;
	}

	.cta-title-xl {
		font-size: 3.2rem;
	}
}
/* ------------------------------
   DEGRADAT DE MARCA
------------------------------ */

.text-gradient {
  background: linear-gradient(90deg, #8fad97 0%, #adac44 100%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

.btn-gradient {
  position: relative;
  overflow: hidden;
  background: linear-gradient(90deg, #8fad97 0%, #adac44 100%) !important;
  color: #fff;
  border: 0;
}

.btn-gradient::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #adac44 0%, #8fad97 100%) !important;
  opacity: 0;
  transition: opacity .35s ease;
}

.btn-gradient:hover::after {
  opacity: 1;
}

.btn-gradient > * {
  position: relative;
  z-index: 1;
}

/*****************/
/*** Pill text ***/
/*****************/
.pill-text {
  display: inline-block;
  width: fit-content;

  padding: 0.5rem 1.1rem;
  background: #e2e8e4;
  color: #6f9078;

  border-radius: 999px;

  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.1;
}

.pill-text-blanc {
  display: inline-block;
  width: fit-content;

  padding: 0.5rem 1.1rem;
  background-color: rgba(255, 255, 255, 0.2);
  color: #fff;

  border-radius: 999px;

  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.1;
}

@media (max-width: 767px) {
.pill-text-blanc {

  padding: 0.5rem 0.2rem;
  background-color: rgba(255, 255, 255, 0);

  font-size: 0.75rem;
  font-weight: 400;
  line-height: 1.1;
}
}

/*** Banner desplaçament lateral **/
/* =========================
   MARQUEE
========================= */

.marquee-banner {
  overflow: hidden;
  width: 100%;
  background: linear-gradient(
    90deg,
    #8fad97 0%,
    #adac44 100%
  );
}


/* El wrapper intern que crea Kadence
   és realment el track que hem d'animar */
.marquee-track > .kt-row-column-wrap {
  --marquee-gap: 3rem;

  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center;

  width: max-content !important;
  max-width: none !important;

  gap: var(--marquee-gap);

  animation: marquee-scroll 50s linear infinite;
  will-change: transform;
}


/* Cada còpia completa */
.marquee-group {
  flex: 0 0 auto !important;
  width: max-content !important;
  min-width: max-content !important;
}


/* Contenidor intern de cada Section de Kadence */
.marquee-group > .kt-inside-inner-col {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center;

  gap: 2.5rem;

  width: max-content;
  white-space: nowrap;
}


/* Cada text individual */
.marquee-group .wp-block-kadence-advancedheading {
  flex: 0 0 auto;
  width: auto;
  margin: 0;
}


/* Animació infinita */
@keyframes marquee-scroll {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(
      calc(-50% - (var(--marquee-gap) / 2))
    );
  }
}


/* Pausa amb hover */
.marquee-banner:hover
.marquee-track > .kt-row-column-wrap {
  animation-play-state: paused;
}


/* Mòbil */
@media (max-width: 767px) {

  .marquee-track > .kt-row-column-wrap {
    --marquee-gap: 2rem;
    animation-duration: 45s;
  }

  .marquee-group > .kt-inside-inner-col {
    gap: 1.75rem;
  }

}


/* Accessibilitat */
@media (prefers-reduced-motion: reduce) {

  .marquee-track > .kt-row-column-wrap {
    animation: none;
  }

}

/* ==============================
   FLUENT FORMS - ESTIL GLOBAL
   ============================== */


/* ==============================
   CAMPS DE TEXT
   ============================== */

.fluentform input[type="text"],
.fluentform input[type="email"],
.fluentform input[type="tel"],
.fluentform input[type="url"],
.fluentform input[type="number"],
.fluentform input[type="date"],
.fluentform select {
	border: 1px solid #1d1d1b !important;
	border-radius: 999px !important;
	background: #fff !important;
	min-height: 40px;
	padding: 0.55rem 1rem;
	box-shadow: none !important;
	font-size: 1rem;
}

/* Focus dels camps */
.fluentform input[type="text"]:focus,
.fluentform input[type="email"]:focus,
.fluentform input[type="tel"]:focus,
.fluentform input[type="url"]:focus,
.fluentform input[type="number"]:focus,
.fluentform input[type="date"]:focus,
.fluentform select:focus {
	border-color: #8fad97 !important;
	box-shadow: none !important;
	outline: none;
}


/* ==============================
   LABELS
   ============================== */

.fluentform .ff-el-input--label label {
	font-weight: 400;
	font-size: 0.9rem;
	line-height: 1;
	color: #333;
	text-transform: uppercase;
	margin-bottom: 0.4rem;
}

/* Asterisc camps obligatoris */
.fluentform .ff-el-input--label .ff-el-required {
	color: #333;
}


/* ==============================
   COLUMNES
   ============================== */

.fluentform .ff-t-cell {
	padding-left: 0.55rem;
	padding-right: 0.55rem;
}


/* ==============================
   GRUPS DE CHECKBOXES
   ============================== */

.fluentform .ff-el-group .ff-el-input--label {
	margin-bottom: 0.45rem;
}

.fluentform .ff-el-form-check {
	display: inline-flex;
	align-items: center;
	margin-right: 0.7rem;
	margin-bottom: 0.4rem;
}

.fluentform .ff-el-form-check-label {
	font-weight: 600;
	font-size: 0.95rem;
	line-height: 1.2;
}


/* ==============================
   CHECKBOXES OPCIONS
   ============================== */

.fluentform input[type="checkbox"] {
	appearance: none !important;
	-webkit-appearance: none !important;

	width: 8px !important;
	height: 8px !important;
	min-width: 8px !important;

	border: 1px solid #222 !important;
	border-radius: 50% !important;

	background: #fff !important;

	padding: 0 !important;
	margin-right: 0.4rem !important;

	cursor: pointer;
	vertical-align: middle;
}


/* Checkbox seleccionat */
.fluentform input[type="checkbox"]:checked {
	background: #8fad97 !important;
	border-color: #8fad97 !important;
}


/* ==============================
   POLÍTICA DE PRIVACITAT
   ============================== */

/*
   Forcem el checkbox de consentiment
   perquè sigui quadrat
*/

.fluentform input[type="checkbox"][name*="terms"],
.fluentform input[type="checkbox"][name*="privacy"],
.fluentform input[type="checkbox"][name*="consent"],
.fluentform input[type="checkbox"][name*="gdpr"] {
	appearance: none !important;
	-webkit-appearance: none !important;

	width: 14px !important;
	height: 14px !important;
	min-width: 14px !important;

	border: 1px solid #777 !important;
	border-radius: 2px !important;

	background: #fff !important;

	margin-right: 0.4rem !important;
}


/* Consentiment seleccionat */
.fluentform input[type="checkbox"][name*="terms"]:checked,
.fluentform input[type="checkbox"][name*="privacy"]:checked,
.fluentform input[type="checkbox"][name*="consent"]:checked,
.fluentform input[type="checkbox"][name*="gdpr"]:checked {
	background: #8fad97 !important;
	border-color: #8fad97 !important;
}


/* Text política de privacitat */
.fluentform input[type="checkbox"][name*="terms"] + label,
.fluentform input[type="checkbox"][name*="privacy"] + label,
.fluentform input[type="checkbox"][name*="consent"] + label,
.fluentform input[type="checkbox"][name*="gdpr"] + label {
	font-weight: 400 !important;
}


/* Enllaços del formulari */
.fluentform .ff-el-form-check-label a {
	color: #8fad97;
	text-decoration: underline;
	text-underline-offset: 2px;
}


/* ==============================
   TEXTAREA
   ============================== */

.fluentform textarea.ff-el-form-control {
	border: 1px solid #1d1d1b !important;
	border-radius: 1.5rem !important;
	background: #fff !important;
	padding: 0.75rem 1rem;
	box-shadow: none !important;
}

.fluentform textarea.ff-el-form-control:focus {
	border-color: #8fad97 !important;
	box-shadow: none !important;
	outline: none;
}


/* ==============================
   BOTÓ
   ============================== */

.fluentform .ff-btn-submit {
	background: #8fad97 !important;
	border: 0 !important;
	border-radius: 999px !important;

	color: #fff !important;

	font-size: 1.15rem !important;
	font-weight: 400 !important;
	line-height: 1 !important;

	padding: 0.75rem 1.4rem !important;

	min-height: auto !important;

	box-shadow: none !important;

	text-transform: uppercase;

	transition:
		background-color 0.25s ease,
		transform 0.25s ease;
}


/* Hover botó */
.fluentform .ff-btn-submit:hover {
	background: #789b83 !important;
	color: #fff !important;
}


/* Focus botó */
.fluentform .ff-btn-submit:focus {
	box-shadow: none !important;
	outline: none;
}

/* ==============================
   FLUENT FORMS - MÒBIL
   ============================== */

@media screen and (max-width: 768px) {

	/* Columnes una sota l'altra */
	.fluentform .ff-t-container {
		display: block !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	.fluentform .ff-t-cell {
		width: 100% !important;
		max-width: 100% !important;
		flex: 0 0 100% !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	/* Camps a tota l'amplada */
	.fluentform input[type="text"],
	.fluentform input[type="email"],
	.fluentform input[type="tel"],
	.fluentform input[type="url"],
	.fluentform input[type="number"],
	.fluentform input[type="date"],
	.fluentform select,
	.fluentform textarea {
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box;
	}

	/* Manté els camps ben rodons */
	.fluentform input[type="text"],
	.fluentform input[type="email"],
	.fluentform input[type="tel"],
	.fluentform input[type="url"],
	.fluentform input[type="number"],
	.fluentform input[type="date"],
	.fluentform select {
		border-radius: 999px !important;
	}
	
.fluentform .ff-el-input--label label {
	font-size: 0.7rem;
	line-height: 0.8;
	margin-bottom: 0.1rem;
}
	
	.fluentform input[type="text"],
.fluentform input[type="email"],
.fluentform input[type="tel"],
.fluentform input[type="url"],
.fluentform input[type="number"],
.fluentform input[type="date"],
.fluentform select {
	background: #fff !important;
	min-height: 25px;
	padding: 0.3rem 0.8rem;
	font-size: 0.8rem;
}

/* Opcions compactes */
.fluentform .ff-el-form-check {
	display: inline-flex !important;
	width: auto !important;
	align-items: center;
	margin-right: 0.7rem !important;
	margin-bottom: 0.3rem !important;
}

	/* Política de privacitat */
	.fluentform .ff-el-form-check-label {
		line-height: 1.35;
	}

	/* Botó */
	.fluentform .ff-btn-submit {
		width: auto !important;
		display: inline-block !important;
	}
}

/*********************************/
/****** ICON LIST AMB RATLLES ****/
/*********************************/

/* Cada element de la llista */

.llista-ratlles ul li {
    padding: 0.2rem 0 0.6rem 0 !important;
	border-bottom: 1px solid #fff;

}

/* Versió amb ratlla negra */
.llista-ratlles-negra ul li {
	padding: 0.2rem 0 0.6rem 0 !important;
	border-bottom: 1px solid #000;
}

/* Últim element sense ratlla */
.llista-ratlles:last-child, .llista-ratlles-negra:last-child {
	border-bottom: none;
}



/*********************************/
/************* MÒBIL *************/
/*********************************/

@media screen and (max-width: 768px) {


}

/***************************/
/*** No visible al mòbil ***/
/**************************/
@media screen and (max-width: 767px) {
	.fora-mobil {
		display: none !important;
		visibility: hidden !important;
		height: 0 !important;
		min-height: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		overflow: hidden !important;
	}
}
