.elementor-kit-7{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-color-3dc7c36:#E2D9D3;--e-global-color-5b4be49:#603626;--e-global-color-02f8440:#674534;--e-global-color-df84667:#E7D1BA;--e-global-color-84d0776:#E7D1BA85;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Imperial Script";--e-global-typography-accent-font-weight:500;}.elementor-kit-7 e-page-transition{background-color:#FFBC7D;}.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-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ===== Botón Elementor con efecto btn-31 ===== */
.btn-31 .elementor-button {
  -webkit-tap-highlight-color: transparent;
  position: relative;
  overflow: hidden;
  -webkit-mask-image: -webkit-radial-gradient(#603626, #fff); /* recorte del radio en Safari */
  background-color: #603626 !important;
  background-image: none !important;
  color: #fff !important;
  border: none !important;
  border-radius: 20px;
  padding: 1rem 2rem;
  font-family: "Inter Tight", sans-serif;
  font-size: 1rem;
  font-weight: 900;
  line-height: 1.5;
  text-transform: uppercase;
  cursor: pointer;
  transition: background-color 0s; /* vuelve al marrón al instante al salir */
}

/* En hover el fondo pasa a beige justo al terminar el barrido (evita el borde marrón) */
.btn-31 .elementor-button:hover,
.btn-31 .elementor-button:focus {
  background-color: #f2e7db !important;
  color: #603626 !important;
  transition: background-color 0s 0.2s;
}

/* Capa beige que se "barre" en diagonal */
.btn-31 .elementor-button::before {
  --progress: 100%;
  content: "";
  position: absolute;
  inset: -1px;
  background: #f2e7db;
  -webkit-clip-path: polygon(100% 0, var(--progress) var(--progress), 0 100%, 100% 100%);
  clip-path: polygon(100% 0, var(--progress) var(--progress), 0 100%, 100% 100%);
  transition: clip-path 0.2s ease, -webkit-clip-path 0.2s ease;
}

.btn-31 .elementor-button:hover::before {
  --progress: 0%;
}

/* Contenedor del texto: por encima de la capa y recortando la animación */
.btn-31 .elementor-button-content-wrapper {
  position: relative;
  z-index: 1;
  overflow: hidden;
}

.btn-31 .elementor-button-text {
  display: block;
  position: relative;
  font-weight: 900;
}

.btn-31 .elementor-button:hover .elementor-button-text {
  -webkit-animation: btn31-move-up 0.3s ease forwards;
  animation: btn31-move-up 0.3s ease forwards;
  color: #603626;
}

@-webkit-keyframes btn31-move-up {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(80%); }
  51%  { transform: translateY(-80%); }
  100% { transform: translateY(0); }
}
@keyframes btn31-move-up {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(80%); }
  51%  { transform: translateY(-80%); }
  100% { transform: translateY(0); }
}/* End custom CSS */