.elementor-kit-532{--e-global-color-primary:#085642;--e-global-color-secondary:#F9B342;--e-global-color-text:#F7BCC3;--e-global-color-accent:#3AAD6C;--e-global-color-163a5695:#FFFFFF;--e-global-color-30350695:#23A455;--e-global-color-2b5b1670:#000;--e-global-color-20858dd6:#FFF;--e-global-typography-primary-font-family:"obviously";--e-global-typography-primary-font-weight:500;--e-global-typography-secondary-font-family:"obviously";--e-global-typography-secondary-font-weight:900;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;font-family:"obviously", Sans-serif;font-weight:normal;line-height:21px;}.elementor-kit-532 button,.elementor-kit-532 input[type="button"],.elementor-kit-532 input[type="submit"],.elementor-kit-532 .elementor-button{background-color:var( --e-global-color-163a5695 );color:var( --e-global-color-primary );border-radius:0px 0px 0px 0px;}.elementor-kit-532 button:hover,.elementor-kit-532 button:focus,.elementor-kit-532 input[type="button"]:hover,.elementor-kit-532 input[type="button"]:focus,.elementor-kit-532 input[type="submit"]:hover,.elementor-kit-532 input[type="submit"]:focus,.elementor-kit-532 .elementor-button:hover,.elementor-kit-532 .elementor-button:focus{background-color:var( --e-global-color-primary );color:var( --e-global-color-163a5695 );}.elementor-kit-532 e-page-transition{background-color:#FFBC7D;}.elementor-kit-532 h1{font-family:"obviously", Sans-serif;font-size:3.7em;font-weight:900;line-height:53px;letter-spacing:0.7px;}.elementor-kit-532 h2{font-family:"obviously", Sans-serif;font-size:36px;font-weight:900;}.elementor-kit-532 h3{font-size:24px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-532 a{line-height:1px;}.elementor-kit-532 h1{line-height:43px;}.elementor-kit-532 h2{line-height:1px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ============================
   LAYOUT GLOBAL (ancho)
============================ */
:root { --site-max: 1140px; }

.site-header .ast-container,
.site-header .elementor-container,
.main-header-bar .ast-container{
  max-width: var(--site-max) !important;
  margin: 0 auto !important;
  padding-inline: 0 !important;
}

.site-primary-header-wrap,
.site-primary-header-wrap .ast-builder-grid-row-container,
.site-primary-header-wrap .ast-builder-grid-row-container-inner,
.site-primary-header-wrap .ast-builder-grid-row{
  max-width: var(--site-max) !important;
  margin-inline: auto !important;
  width: 100%;
  padding-inline: 0 !important;
}

.hfe-header,
.hfe-header .hfe-row-container,
.hfe-header .hfe-container{
  max-width: var(--site-max) !important;
  margin-inline: auto !important;
  width: 100%;
  padding-inline: 0 !important;
}

.elementor-section.elementor-section-boxed > .elementor-container,
.e-con-boxed > .e-con-inner{
  max-width: var(--site-max) !important;
  margin-inline: auto !important;
}

/* ============================
   CABECERA COMPACTA + LOGO
============================ */
.main-header-bar{ padding: 8px 0; }          /* alto de la franja */
.site-logo-img{ position: relative; height: 100px; }
.site-logo-img img{
  position: absolute; left: 0; bottom: -130px; /* cuánto sobresale */
  height: 160px; width: auto;
}

/* ============================
   ICONOS MENÚ (Instagram + WhatsApp)
============================ */
.main-header-menu li.menu-instagram > a,
.main-header-menu li.menu-whatsapp > a {
  display: inline-block;
  width: 28px;
  height: 28px;
  padding: 0 12px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 22px 22px;
  text-indent: -9999px; /* oculta texto */
  overflow: hidden;
  line-height: 0;
  text-decoration: none !important;
  filter: invert(19%) sepia(62%) saturate(1110%) hue-rotate(108deg) brightness(95%) contrast(97%);; /* verde #085642 */
	vertical-align: middle; 
	margin-top: -5px; 
}

/* Instagram */
.main-header-menu li.menu-instagram > a {
  background-image: url("https://dpcreative.studio/wp-content/uploads/2025/10/instagram.svg");
}

/* WhatsApp */
.main-header-menu li.menu-whatsapp > a {
  background-image: url("https://dpcreative.studio/wp-content/uploads/2025/10/whatsapp.svg");
}

/* Hover (gris como el resto del menú) */
.main-header-menu li.menu-instagram > a:hover,
.main-header-menu li.menu-whatsapp > a:hover {
  filter: invert(59%) sepia(0%) saturate(0%) hue-rotate(180deg) brightness(90%) contrast(85%) !important;
  text-decoration: none !important;
}
/* ============================
   TIPOGRAFÍAS Y ALINEACIONES
============================ */

.elementor-widget-heading h1.elementor-heading-title{ text-align: left !important; }
.elementor-widget-heading h2.elementor-heading-title,
.elementor-widget-heading h3.elementor-heading-title,
.elementor-widget-heading h4.elementor-heading-title,
.elementor-widget-heading h5.elementor-heading-title,
.elementor-widget-heading h6.elementor-heading-title{
  text-align: center !important;
}


/* Destacado gigante (aplica clase: destacado en el widget Encabezado) */
.elementor-widget-heading.destacado .elementor-heading-title{
  font-size: 150px; font-weight: 900; line-height: .85;

}

.elementor-widget-heading.destacado{ text-align: left !important; }

.hfe-infocard-title-wrap,
.hfe-infocard-title{ text-align: center; }

.hfe-infocard-title-wrap h1,
h1.hfe-infocard-title{ text-align: left !important; }

/* Subtítulo script (aplica clase: subtitulo) */
.elementor-widget-heading.subtitulo .elementor-heading-title,
.elementor-widget-text-editor.subtitulo,
.elementor-widget-text-editor.subtitulo p{
  font-size: 55px; line-height: 1.3;
  /*font-family: "cherry-blossoms-wide", sans-serif;*/
  font-family: "good-karma-wide", sans-serif;
  font-weight: 600; font-style: normal;
  text-align: center; margin-top: -30px; position: relative; z-index: 2;
}

/* Párrafo base (y por defecto en bandera a la izquierda) */
.elementor-widget-text-editor{ text-align: left; }
.elementor-widget-text-editor p{ font-size: 16px; line-height: 1.5; }


/* ============================
   BULLETS PERSONALIZADOS (ajuste fino)
============================ */
.lista-bullets {
  text-align: center;       
  color: #fff;  
	margin-left: -12px
}

.lista-bullets ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.lista-bullets li {
  display: flex;
  align-items: center;
  justify-content: center; 
  color: #fff;
  font-size: 16px;
  line-height: 1.8em;
  font-weight: 400;
  margin-bottom: 0.4em;
	position: relative;
	
}

.lista-bullets li::before {
  content: "";
  display: inline-block;
  width: 23px;
  height: 19px ;
	transform: translateY(3px);
  background: center/contain no-repeat url("https://dpcreative.studio/wp-content/uploads/2025/10/bullet_dp.svg");
  flex-shrink: 0;
}
.lista-bullets ul,
.lista-bullets li {
  list-style: none !important;
}
.lista-bullets li {
  display: block;
  white-space: normal;
}

.lista-bullets li {
  overflow: visible; /* deja que los pseudo-elementos sobresalgan */
}
.lista-bullets {
  overflow: visible;
}
/*Subrayado pink*/
.highlight-pink {
  position: relative;
  display: inline-block;
  z-index: 0;
}

.highlight-green2 {
  position: relative;
  display: inline-block;
  z-index: 0;
}

.highlight-pink::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0.1em;
  width: 100%;
	height: 2px;
  background-image: url("https://dpcreative.studio/wp-content/uploads/2025/10/underline-pink.svg");
  background-repeat: no-repeat;
  background-size: calc(100% + 4px) auto;
  background-position: center bottom;
  z-index: 1;
}

.highlight-green2::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0.1em;
  width: 100%;
	height: 2px;
  background-image: url("https://dpcreative.studio/wp-content/uploads/2025/10/underline-green2.svg");
  background-repeat: no-repeat;
  background-size: calc(100% + 4px) auto;
  background-position: center bottom;
  z-index: 1;
}

/*Circulo amarillo*/
.highlight-circle-yellow-1 {
  position: relative;
  display: inline-block;
	padding: 0 4px;
  z-index: 0;
}

.highlight-circle-green2 {
  position: relative;
  display: inline-block;
	padding: 0 4px;
  z-index: 0;
}

.highlight-circle-yellow-1::after {
  content: "";
  position: absolute;
  left: -3px; /* 🔹 mueve un poco hacia la izquierda */
  bottom: -6px;
  width: calc(100% + 6px); /* 🔹 ensancha el área del SVG */
  height: 37px;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-position: center;
  z-index: 3;
	background-image: url("https://dpcreative.studio/wp-content/uploads/2025/10/highlight-circle-yellow-1.svg");
}

.highlight-circle-green2::after {
  content: "";
  position: absolute;
  left: -3px; /* 🔹 mueve un poco hacia la izquierda */
  bottom: -6px;
  width: calc(100% + 6px); /* 🔹 ensancha el área del SVG */
  height: 37px;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-position: center;
  z-index: 3;
	background-image: url("https://dpcreative.studio/wp-content/uploads/2025/10/highlight-circle-green2.svg");
}
/* ============================
   TEXTO BASE (sin bullets)
============================ */
.texto-base-verde {
  display: block;
  font-size: 16px;
  line-height: 1.8em;
  font-weight: 400;
  text-align: center;
  margin-bottom: 0.4em;
	color: #085642;
}
.texto-base-blanco {
  display: block;
  font-size: 16px;
  line-height: 1.8em;
  font-weight: 400;
  text-align: center;
  margin-bottom: 0.4em;
	color: #fff;
}

/* ============================
DP METHOD ============================ */

.dp-method {
  min-height: 500px !important;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.dp-dot span { 
  font-weight: 900 !important;
  font-size: 34px;
  width: 88px;
  height: 88px;
  border-width: 0px!important;
  border-color: #ffffff !important;
  background-color: #1c5743;
  color: #ffffff;
  transition: transform 0.3s ease;
}

.dp-dot:hover span {
  transform: scale(1.13);
}

.dp-dot em {
  /*font-family: "cherry-blossoms-wide", sans-serif;*/
  font-family: "good-karma-wide", sans-serif;
  font-size: 30px !important;
  color: #1c5743;
  margin-top: 6px;
  font-weight: 600;
}

.dp-track label {
  flex: 1 1 16.66%;
  text-align: center;
  display: flex;
  justify-content: center;
	align-items: center;
	  align-self: flex-start;
}

.dp-dot {
  margin-top: 0;
}

.dp-panel h4 {
  font-family: "Obviously", sans-serif;
	font-weight: 700;
  font-size:18px!important;
  color: #1c5743;
  margin-bottom: 0.3em;
	text-align: left;
}

.dp-panel p {
  font-family: "Obviously", sans-serif;
  font-size: 14px !important;
  line-height: 1.8;
  color: #1c5743;
  max-width: 720px;
  margin: 0 auto;
  text-align: left;
}

.dp-track{
  background: url("https://dpcreative.studio/wp-content/uploads/2025/10/linea_rosa.svg") no-repeat center;
  background-size: 100% 27px;
	background-position: center 21%;
}
.dp-track::before {
  display: none !important;
  content: none !important;
}

/* Estilo especial para 1, 3 y 6 con doble borde */
.dp-track label:nth-child(1) span,
.dp-track label:nth-child(3) span,
.dp-track label:nth-child(6) span {
  background-color: #f9b342 !important; /* mostaza */
  color: #ffffff !important; /* número blanco */
  border: 8px solid #ffffff !important; /* borde blanco grueso */
  box-shadow: 0 0 0 2.5px #1c5743 !important; /* borde verde fino externo */
}
.dp-title {
  color: #3AAD6C !important;
}
.dp-title h2.elementor-heading-title {
  color: #3AAD6C !important;
}
#m4:checked ~ .dp-track label[for="m4"] span

/* ============================
Color activo (checked) - DP Method
============================ */
#m1:checked ~ .dp-track label[for="m1"] span,
#m2:checked ~ .dp-track label[for="m2"] span,
#m3:checked ~ .dp-track label[for="m3"] span,
#m4:checked ~ .dp-track label[for="m4"] span,
#m5:checked ~ .dp-track label[for="m5"] span,
#m6:checked ~ .dp-track label[for="m6"] span {
  background-color: #3aad6c !important; /* Verde activo */
  color: #ffffff !important;            /* Número blanco */
  border: 8px solid #ffffff !important; /* Borde blanco grueso */
  box-shadow: 0 0 0 2.5px #1c5743 !important; /* Borde exterior verde oscuro */
  transform: scale(1.13);
  transition: all 0.3s ease;
}
#dpm1:checked + label[for="m1"] span,
#m1:checked + label[for="m1"] span {
  background-color: #3aad6c !important;
  color: #ffffff !important;
  border: 8px solid #ffffff !important;
  box-shadow: 0 0 0 2.5px #1c5743 !important;
  transform: scale(1.13);
  transition: all 0.3s ease;
}
/* Activo (click) — sin depender del orden en el DOM */
.dp-method:has(#m1:checked) .dp-track label[for="m1"] span,
.dp-method:has(#m2:checked) .dp-track label[for="m2"] span,
.dp-method:has(#m3:checked) .dp-track label[for="m3"] span,
.dp-method:has(#m4:checked) .dp-track label[for="m4"] span,
.dp-method:has(#m5:checked) .dp-track label[for="m5"] span,
.dp-method:has(#m6:checked) .dp-track label[for="m6"] span {
  background-color: #3aad6c !important;
  color: #fff !important;
  border: 8px solid #fff !important;
  box-shadow: 0 0 0 2.5px #1c5743 !important;
  transform: scale(1.13);
  transition: all .3s ease;
}

.dp-method {
  padding-top: 60px !important;
  padding-bottom: 60px !important;
}
.spacer-custom {
  height: 40px;
}

@media (max-width: 768px) {
  .spacer-custom {
    height: 10px;
  }
}

.ast-transparent-header {
  background: var(--ast-global-color-7) !important; /* tu color de cabecera sólido */
  position: relative !important;
  opacity: 1 !important;
}
.ast-theme-transparent-header {
  background: var(--ast-global-color-7) !important;
}

/* 1) Forzar cabecera sólida: ignora la transparente en esta página */
.page-id-2235 .ast-transparent-header,
.page-id-2235 .ast-theme-transparent-header {
  background: #183B2A !important;  /* tu verde del header */
  position: relative !important;
  opacity: 1 !important;
}

/* 2) Colores del menú en el header (normal y hover) */
.page-id-2235 .main-header-menu .menu-link {
  color: #FFFFFF !important;
}
.page-id-2235 .main-header-menu .menu-link:hover,
.page-id-2235 .main-header-menu .current-menu-item > .menu-link {
  color: #BFE3CF !important;
}

/* 3) Botón del header */
.page-id-2235 .ast-header-button-1 .ast-custom-button-link {
  background: #1D6F4A !important;
  color: #FFFFFF !important;
  border-color: #1D6F4A !important;
}

/* 4) Evitar superposición rara y asegurar clics */
.page-id-2235 .main-header-bar { 
  z-index: 99 !important; 
}
.ast-header-break-point .main-header-menu .menu-link,
.main-header-menu > li > a,
.ast-builder-menu-1 .menu-link {
  color: #085642 !important;
  text-decoration: none;
}

.ast-builder-menu-1 .menu-link:hover,
.main-header-menu > li:hover > a {
  color: #0f3f31 !important; /* ajusta al hover que quieras */
}

/* Forzar ancho total en todo el sitio */
.site-content,
.ast-container {
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin: 0 !important;
}
/* buttons */
.dp-btn-green {
  color: #ffffff;
  transition: all 0.3s ease;
  padding: 0px;
}
/**Stickers**/
.dp-social-stickers {
  display: flex;
  gap: 14px; /* separación entre stickers */
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap; /* permite que salten de línea en mobile */

}

.dp-social-stickers img {
  width: 70px;
  height: auto;
  display: inline-block;
  transition: transform 0.3s ease;
}

.dp-social-stickers img:hover {
  transform: scale(1.15);
}

/* ajuste opcional para pantallas muy pequeñas */
@media (max-width: 480px) {
  .dp-social-stickers img {
    width: 60px;
  }
}

/*anclas con espacio*/
/* 1. Contenedores nuevos de Elementor */
.e-con[id]::before {
  content: "";
  display: block;
  height: 600px;
  margin-top: -600px;
  pointer-events: none;
  visibility: hidden;
}

/* 2. Secciones clásicas de Elementor */
.elementor-section[id]::before {
  content: "";
  display: block;
  height: 600px;
  margin-top: -600px;
  pointer-events: none;
  visibility: hidden;
}

/* 3. Cualquier elemento con ID (agresivo) */
*[id]::before {
  content: "";
  display: block;
  height: 600px;
  margin-top: -600px;
  pointer-events: none;
  visibility: hidden;
}


@media (max-width: 1024px){
  html, body{
    width: 100%;
    overflow-x: hidden !important;
  }

  /* contenedores Elementor */
  .elementor, .elementor-section, .elementor-container, .e-con{
    max-width: 100%;
    overflow-x: hidden;
  }

  /* cosas típicas que empujan */
  img, video, svg{
    max-width: 100%;
    height: auto;
  }
}



@media (max-width: 600px){

  /* 1) Ocultar el texto debajo, aunque tenga inline style */
  .dp-method .dp-dot em{ display: none !important; }

  /* 2) Escalar TODO el track de números (círculos + números) */
  .dp-method .dp-track{
    transform: scale(0.74);
  }
}


@media (max-width: 600px){
  .dp-method .dp-track{
    width: 100%;
    overflow-x: visible;          /* sin scroll */
    justify-content: space-between;
    gap: 10px;
  }

  .dp-method .dp-dot{ flex: 0 0 auto; }
}
@media (max-width: 600px){
  .dp-method{
    margin-top: -115px !important;
   }
}
@media (max-width: 600px){
  .dp-method .dp-track{
    margin-bottom: -30px;
    justify-content: center;
  }
}

@media (max-width: 600px){
  .site-footer .widget{
    margin-bottom: -20px !important;
  }
}
/* Tablet: corregir padding lateral fijo del footer Astra */
@media (min-width: 768px) and (max-width: 1100px){
  .site-primary-footer-wrap[data-section="section-primary-footer-builder"]{
    padding-left: clamp(16px, 4vw, 60px) !important;
    padding-right: clamp(16px, 4vw, 60px) !important;
  }
}/* End custom CSS */