.elementor-164 .elementor-element.elementor-element-db863c0 > .elementor-container{max-width:1200px;}.elementor-164 .elementor-element.elementor-element-bbcd79b{padding:81px 0px 0px 0px;}.elementor-bc-flex-widget .elementor-164 .elementor-element.elementor-element-1ab403c.elementor-column .elementor-widget-wrap{align-items:flex-start;}.elementor-164 .elementor-element.elementor-element-1ab403c.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated{align-content:flex-start;align-items:flex-start;}.elementor-164 .elementor-element.elementor-element-b801540 > .elementor-container{max-width:1200px;}.elementor-164 .elementor-element.elementor-element-20cb56d > .elementor-container{max-width:1200px;}.elementor-164 .elementor-element.elementor-element-1113f1b > .elementor-container{max-width:1200px;}.elementor-164 .elementor-element.elementor-element-6a8e712 > .elementor-container{max-width:1200px;}.elementor-164 .elementor-element.elementor-element-caa4248 > .elementor-container{max-width:1200px;}/* Start custom CSS for html, class: .elementor-element-671cbcf *//* Contenedor de botones flotantes */
.floating-buttons {
    position: fixed;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1000;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* Estilo de cada botón */
.floating-button {
    display: flex;
    align-items: center !important; /* Centra verticalmente todo el contenido */
    justify-content: flex-start; /* Alinea el contenido al inicio */
    background-color: #02A487;
    color: white;
    text-decoration: none;
    padding: 10px;
    border-radius: 50px;
    width: 40px;
    height: 40px;
    overflow: hidden;
    transition: width 0.3s ease, background-color 0.3s ease;
}

/* Icono del botón */
.floating-button .icon {
    font-size: 16px;
    min-width: 20px;
    text-align: center;
    line-height: 40px !important; /* Asegura que el ícono esté centrado verticalmente */
    display: flex;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
}

/* Título del botón */
.floating-button .title {
    white-space: nowrap;
    margin-left: 10px;
    opacity: 0;
    transition: opacity 0.3s ease;
    color: white !important; /* Texto en blanco */
    background-color: transparent !important; /* Sin fondo */
    padding: 0 !important; /* Sin padding */
    display: flex !important;
    align-items: center !important; /* Centra verticalmente */
    line-height: 40px !important; /* Ajustado para coincidir con la altura del botón expandido */
    height: 40px !important; /* Igualado a la altura del botón para centrado perfecto */
    transform: translateY(-2px); /* Reducido de -5px a -2px para bajar el texto ligeramente y centrarlo con el ícono */
}

/* Efecto al pasar el mouse */
.floating-button:hover {
    width: 150px; /* Ancho al desplegarse, como en tu diseño original */
    background-color: #02A487;
}

.floating-button:hover .title {
    opacity: 1 !important; /* Muestra el título al desplegarse */
}/* End custom CSS */
/* Start custom CSS for section, class: .elementor-element-b801540 *//* Fondo TIX (cinematográfico, más negro) */
body{
  position: relative;
  background:
    radial-gradient(900px 520px at 18% 18%, rgba(2,164,135,.22), transparent 62%),
    radial-gradient(900px 520px at 82% 18%, rgba(0,119,199,.22), transparent 62%),
    radial-gradient(1000px 650px at 50% 110%, rgba(2,164,135,.08), transparent 58%),
    linear-gradient(135deg, #02A487 0%, #0077C7 45%, #050607 100%) !important;
  background-attachment: fixed;
  background-repeat: no-repeat;
}

/* Capa negra arriba (oscurece sin “lavar” colores) */
body::before{
  content:"";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;

  /* Overlay + viñeta */
  background:
    radial-gradient(1200px 700px at 60% 40%, rgba(0,0,0,.25), transparent 55%),
    radial-gradient(900px 650px at 15% 30%, rgba(0,0,0,.55), transparent 60%),
    linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.55));
}

/* Asegura que el contenido quede arriba del overlay */
#page, .site, .site-content, .elementor{
  position: relative;
  z-index: 1;
  background: transparent;
}

.elementor-section{
  background: transparent;
}/* End custom CSS */
/* Start custom CSS for section, class: .elementor-element-20cb56d *//* Fondo TIX (cinematográfico, más negro) */
body{
  position: relative;
  background:
    radial-gradient(900px 520px at 18% 18%, rgba(2,164,135,.22), transparent 62%),
    radial-gradient(900px 520px at 82% 18%, rgba(0,119,199,.22), transparent 62%),
    radial-gradient(1000px 650px at 50% 110%, rgba(2,164,135,.08), transparent 58%),
    linear-gradient(135deg, #02A487 0%, #0077C7 45%, #050607 100%) !important;
  background-attachment: fixed;
  background-repeat: no-repeat;
}

/* Capa negra arriba (oscurece sin “lavar” colores) */
body::before{
  content:"";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;

  /* Overlay + viñeta */
  background:
    radial-gradient(1200px 700px at 60% 40%, rgba(0,0,0,.25), transparent 55%),
    radial-gradient(900px 650px at 15% 30%, rgba(0,0,0,.55), transparent 60%),
    linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.55));
}

/* Asegura que el contenido quede arriba del overlay */
#page, .site, .site-content, .elementor{
  position: relative;
  z-index: 1;
  background: transparent;
}

.elementor-section{
  background: transparent;
}/* End custom CSS */