/*
Theme Name: SOON Oficinas Elementor
Theme URI: https://soonoficinasinteligentes.com
Author: SOON / Codefy
Author URI: https://soonoficinasinteligentes.com
Description: Tema base ligero para trabajar 100% con Elementor + Elementor Pro. Sin Betheme, sin wrappers, sin gutters. Incluye tokens Figma 2026 y fuente Sora. Migrado de betheme-child v1.0.5.
Version: 1.0.1
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: soon-elementor
Tags: elementor, full-width-template, custom-logo, featured-images
*/

/* Tokens Figma — SOON Rediseño 2026 (migrados de betheme-child) */
:root {
  --soon-navy: #0C1E33;
  --soon-blue: #2868C0;
  --soon-blue-light: #B8D5F7;
  --soon-bg-light: #F4F8FD;
  --soon-bg-muted: #F2F5F8;
  --soon-text: #4E5D6C;
  --soon-text-on-dark: rgba(255,255,255,0.65);
  --soon-border: rgba(12,30,51,0.1);
  --soon-border-light: rgba(12,30,51,0.08);
  --soon-white: #FFFFFF;
  --soon-tag-bg: #FBEAEA;
  --soon-tag-text: #8C2E2E;
  --soon-radius-pill: 999px;
  --soon-radius-card: 20px;
  --soon-radius-hero-img: 28px;
  --soon-max-width: 1440px;
  --soon-content-padding: 64px;
}

/* Reset de bordes: Elementor a veces fija border-style:solid en las 4 caras
   pero solo define el ancho de un lado (ej. solo border-bottom-width), dejando
   los otros 3 con el "medium" (~3px) por defecto del navegador. Betheme
   normalmente lo neutraliza con su propio reset global; este tema no lo tiene. */
*, *::before, *::after {
  border-width: 0;
  border-style: solid;
}

/* Reset mínimo compatible Elementor - no impone max-width ni paddings */
html, body {
  font-family: 'Sora', system-ui, -apple-system, sans-serif;
  color: var(--soon-text);
  background: #fff;
  margin: 0;
  padding: 0;
}

body, p, li, a, span, div {
  font-family: 'Sora', sans-serif;
}

img {
  max-width: 100%;
  height: auto;
}

/* Utilidad Figma */
.soon-section {
  padding: 104px 64px;
}
@media (max-width: 1024px) {
  .soon-section { padding: 80px 32px; }
}
@media (max-width: 768px) {
  .soon-section { padding: 56px 24px; }
}

/* Contenedor default WP (solo cuando NO es Elementor) */
.soon-container {
  max-width: var(--soon-max-width);
  margin: 0 auto;
  padding: 0 var(--soon-content-padding);
}
@media (max-width: 768px) {
  .soon-container { padding: 0 24px; }
}

/* Tipografía Figma migrada de betheme-child — h1 único hero */
.soon-hero-virtual__title { font-size: 48px; line-height: 1.1; color: var(--soon-navy); }
@media (max-width: 768px) {
  .soon-hero-virtual__title { font-size: 34px; }
}
/* NOTA MIGRACIÓN 2026-09-14: NO se migraron los FIX 2026-09-10/10b de betheme-child
   (#Content, .section_wrapper, .elementor-widget-soon-*, .e-con:has(...))
   porque eran parches para los gutters de Betheme. Este tema no tiene esos wrappers. */

/* Ajustes de los widgets propios de SOON dentro de Elementor */
.elementor-widget-soon-hero-virtual,
.elementor-widget-soon-planes-virtuales,
.elementor-widget-soon-como-funciona,
.elementor-widget-soon-cta-final {
  margin: 0 !important;
  padding: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
  background: transparent !important;
}
.e-con:has(.soon-planes),
.e-con:has(.soon-como),
.e-con:has(.soon-hero-virtual),
.e-con:has(.soon-cta-final) {
  --padding-top: 0 !important;
  --padding-right: 0 !important;
  --padding-bottom: 0 !important;
  --padding-left: 0 !important;
  padding: 0 !important;
}

/* Reset de tipografia global para h1-h6: cada e-heading de Elementor
   ya trae su propio estilo por nodo, no queremos herencias del navegador. */
h1, h2, h3, h4, h5, h6 {
  font-family: 'Sora', sans-serif;
  letter-spacing: normal;
  text-transform: none;
  margin: 0;
  line-height: 1.2;
}

/* Formulario de Contact Form 7 */
.elementor-widget-shortcode {
  align-self: stretch;
  width: 100% !important;
}
.wpcf7-form p {
  margin: 0 0 14px 0;
}
.wpcf7-form-control.wpcf7-text,
.wpcf7-form-control.wpcf7-textarea {
  width: 100%;
  box-sizing: border-box;
  background: #F4F8FD;
  border: 1px solid #E5E9F2;
  border-radius: 12px;
  padding: 11px 20px;
  font-family: 'Sora', sans-serif;
  font-size: 15px;
  color: #141B2E;
}
.wpcf7-form-control.wpcf7-textarea {
  height: 70px;
  resize: vertical;
}
.wpcf7-form p label {
  font-weight: 700;
  font-size: 14px;
  color: #141B2E;
  display: block;
  line-height: 1;
  margin-bottom: -4px;
}
.wpcf7-form-control.wpcf7-submit {
  background-color: #2868C0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32'%3E%3Ccircle cx='16' cy='16' r='16' fill='white'/%3E%3Cpath d='M12 10l6 6-6 6' stroke='%232868C0' stroke-width='2.4' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 6px center;
  color: #FFFFFF;
  border: none;
  border-radius: 999px;
  padding: 14px 50px 14px 28px;
  font-weight: 700;
  font-size: 15px;
  cursor: pointer;
}
.wpcf7-form-control.wpcf7-submit:hover {
  background-color: #1B3A5C;
}
.wpcf7-spinner {
  margin-left: 10px;
}

/* Menú móvil (Elementor Pro Nav Menu, layout dropdown): divisores por item.
   Sin flecha por ahora: el menú móvil todavía no despliega submenús. */
.elementor-nav-menu--dropdown a {
  border-bottom: 1px solid rgba(255,255,255,0.12);
  position: relative;
  display: flex !important;
  align-items: center;
  justify-content: space-between;
}
.elementor-nav-menu--dropdown a::after {
  content: none !important;
}
.elementor-nav-menu--dropdown li:last-child > a {
  border-bottom: none;
}

/* Bloque extra inyectado por JS: boton "Agenda una visita" + info de contacto */
.soon-mobile-menu-extra {
  padding: 24px 20px 32px;
}
.elementor-nav-menu--dropdown a.soon-mobile-menu-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #FFFFFF;
  color: var(--soon-navy) !important;
  font-weight: 700;
  font-size: 16px;
  text-decoration: none;
  border-radius: 999px;
  padding: 16px 8px 16px 24px;
  margin-bottom: 24px;
  border-bottom: none;
}
.elementor-nav-menu--dropdown a.soon-mobile-menu-cta::after {
  content: none !important;
}
/* El hover/focus del menú en el header (fondo oscuro) también le caía al
   botón y lo dejaba invisible: se mantiene blanco con texto navy. */
.elementor-nav-menu--dropdown a.soon-mobile-menu-cta:hover,
.elementor-nav-menu--dropdown a.soon-mobile-menu-cta:focus,
.elementor-nav-menu--dropdown a.soon-mobile-menu-cta.highlighted {
  background: #FFFFFF !important;
  color: var(--soon-navy) !important;
}
.soon-mobile-menu-cta__icon {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--soon-blue);
  color: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.soon-mobile-menu-info__row {
  display: flex;
  align-items: center;
  gap: 12px;
  color: rgba(255,255,255,0.85);
  font-size: 14px;
  padding: 10px 0;
}
.soon-mobile-menu-info__icon {
  width: 20px;
  text-align: center;
  flex-shrink: 0;
}

/* El texto "WhatsApp" del header mide el doble de alto que sus vecinos
   (line-height demasiado grande), lo que corre el texto visible hacia
   abajo dentro de su propia caja y lo desalinea del ícono verde de al
   lado aunque ambos estén centrados por flex. */
.e-29e4fa4-dfdec14 {
  line-height: 1.2 !important;
  flex-shrink: 0 !important;
  white-space: nowrap !important;
}

/* El header entero necesita su propio stacking context con z-index alto:
   sin esto, el dropdown de "Oficinas" (position:absolute) queda pintado
   DEBAJO del contenido de la página, porque el contenido viene después
   en el DOM y ambos tienen z-index:auto (se ordena por posición en el
   documento, no por posición visual). */
.elementor-location-header {
  position: relative !important;
  z-index: 100 !important;
}

/* El header (post 2723) usaba un padding fijo en vez de la misma fórmula
   responsiva que usan los widgets bien construidos del sitio
   (soon-hero-virtual, soon-hero-interno): padding que ESCALA con el
   ancho de la ventana para mantener el contenido centrado a max 1312px,
   con un mínimo de 64px. Con un padding fijo, el logo/menú solo
   coincidían con el resto del contenido en un ancho de pantalla exacto;
   en cualquier otro se desalineaban. Se replica la misma fórmula aquí
   para que el header y el contenido siempre queden alineados. */
.elementor-2723 .elementor-element-b42f5d2 {
  max-width: 100vw !important;
  width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  padding-top: 12px !important;
  padding-bottom: 12px !important;
  padding-left: max(64px, calc((100vw - 1312px) / 2)) !important;
  padding-right: max(64px, calc((100vw - 1312px) / 2)) !important;
  box-sizing: border-box !important;
}
@media (max-width: 1024px) {
  .elementor-2723 .elementor-element-b42f5d2 {
    padding-left: 32px !important;
    padding-right: 32px !important;
  }
}
@media (max-width: 768px) {
  .elementor-2723 .elementor-element-b42f5d2 {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
}

/* Varias páginas armadas a mano en el editor de Elementor (a diferencia
   de las que usan los widgets soon-hero-virtual/soon-hero-interno) usan
   un padding fijo (60px) en TODAS sus secciones de nivel superior, en
   vez de la fórmula responsiva que escala con el ancho de pantalla.
   Esto no era solo el encabezado: cada sección de la página (galería,
   tarjetas de servicios, CTA final, etc.) tenía el mismo padding fijo,
   así que todo el contenido de la página se desalineaba del logo del
   header en cualquier ancho que no fuera el exacto en el que se diseñó.
   Se detectó en: Amenidades e instalaciones (2635), Empresas en SOON
   (2639), Preguntas frecuentes (2641), Contacto (2644) y Oficinas
   Físicas (2631). Se aplica la misma fórmula del header/widgets a TODAS
   las secciones de nivel superior de esas páginas, no solo a la primera. */
.elementor-2631 > .elementor-element,
.elementor-2635 > .elementor-element,
.elementor-2639 > .elementor-element,
.elementor-2641 > .elementor-element,
.elementor-2644 > .elementor-element {
  padding-left: max(64px, calc((100vw - 1312px) / 2)) !important;
  padding-right: max(64px, calc((100vw - 1312px) / 2)) !important;
}
@media (max-width: 1024px) {
  .elementor-2631 > .elementor-element,
  .elementor-2635 > .elementor-element,
  .elementor-2639 > .elementor-element,
  .elementor-2641 > .elementor-element,
  .elementor-2644 > .elementor-element {
    padding-left: 32px !important;
    padding-right: 32px !important;
  }
}
@media (max-width: 768px) {
  .elementor-2631 > .elementor-element,
  .elementor-2635 > .elementor-element,
  .elementor-2639 > .elementor-element,
  .elementor-2641 > .elementor-element,
  .elementor-2644 > .elementor-element {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
}

/* Inicio (2534) tiene el mismo bug de padding fijo, pero solo en ALGUNAS
   de sus secciones (otras ya son full-bleed a propósito, como el FAQ),
   así que aquí sí hay que apuntar a los nodos específicos en vez de
   todos los hijos directos.
   Ojo: estas 3 secciones traen max-width:1400px de Elementor. Como el
   padding escala con 100vw pero la caja se queda en 1400px, en pantallas
   anchas (>1600px aprox.) el padding se comía casi todo el ancho y el
   texto quedaba en una columna de una palabra por línea. Se quita el
   tope para que se comporten igual que las secciones de las otras
   páginas (ancho completo + padding responsivo = contenido a 1312px). */
.elementor-2534 .elementor-element-8509e23,
.elementor-2534 .elementor-element-befae0f,
.elementor-2534 .elementor-element-0401f84 {
  max-width: none !important;
  padding-left: max(64px, calc((100vw - 1312px) / 2)) !important;
  padding-right: max(64px, calc((100vw - 1312px) / 2)) !important;
}
@media (max-width: 1024px) {
  .elementor-2534 .elementor-element-8509e23,
  .elementor-2534 .elementor-element-befae0f,
  .elementor-2534 .elementor-element-0401f84 {
    padding-left: 32px !important;
    padding-right: 32px !important;
  }
}
@media (max-width: 768px) {
  .elementor-2534 .elementor-element-8509e23,
  .elementor-2534 .elementor-element-befae0f,
  .elementor-2534 .elementor-element-0401f84 {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
}

/* El contenedor "77d4d57" envuelve TANTO el ícono de WhatsApp (posición
   absoluta) COMO el texto "WhatsApp" (no son elementos sueltos). Traía
   un ancho fijo de 90px de Elementor que no correspondía a su contenido
   real; se deja que mida lo que su contenido (el texto) necesite, con
   espacio a la izquierda para el ícono. */
.elementor-2723 .elementor-element-77d4d57 {
  width: auto !important;
  min-width: 0 !important;
  flex: 0 0 auto !important;
  position: relative !important;
  padding-left: 22px !important;
}
/* El ícono de WhatsApp usa posición absoluta pegada arriba (top:0), así
   que queda visualmente más arriba que el texto de al lado aunque el
   contenedor esté centrado por flex. Se centra verticalmente y se ancla
   a la izquierda del padding reservado arriba. */
.elementor-2723 .elementor-element-77d4d57 .elementor-widget-icon {
  left: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
}

/* Dropdown real de "Oficinas": al pasar el cursor aparece un panel debajo
   con "Oficinas físicas", en vez de reemplazar el texto en el lugar. */
.soon-nav-dropdown-wrapper {
  position: relative !important;
  display: flex !important;
  flex: 0 0 auto !important;
  width: auto !important;
  align-items: center !important;
}
.soon-nav-dropdown-wrapper::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: 14px;
}
.soon-nav-dropdown-panel {
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  margin-top: 14px !important;
  min-width: 180px;
  width: auto !important;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(12, 30, 51, 0.14);
  padding: 8px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px);
  transition: opacity 0.15s ease, transform 0.15s ease, visibility 0.15s;
  z-index: 20 !important;
}
.soon-nav-dropdown-wrapper:hover .soon-nav-dropdown-panel {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.soon-nav-dropdown-item {
  display: block;
}
.soon-nav-dropdown-item a {
  display: block;
  padding: 10px 14px;
  border-radius: 8px;
  color: #1F2937;
  font-size: 14px;
  text-decoration: none;
  white-space: nowrap;
}
.soon-nav-dropdown-item a:hover {
  background: var(--soon-bg-light);
  color: var(--soon-blue);
}

/* Header desktop (>1024px): el contenedor del logo traía un ancho fijo
   de ~525px (de Elementor) para una imagen de 140px, robando espacio al
   menú y forzando que "Oficinas virtuales", "Oficinas", WhatsApp y el
   botón "Agenda una visita" se partieran en 2 líneas. Se libera ese
   espacio y se evita el salto de línea en cada item del menú. */
@media (min-width: 1025px) {
  .elementor-2723 .elementor-element.elementor-element-d9101ec {
    width: auto !important;
    max-width: none !important;
  }
  .elementor-2723 .elementor-element-7ef1e3a {
    flex-shrink: 1;
    min-width: 0;
  }
  .elementor-2723 .elementor-element-7ef1e3a > * {
    flex-shrink: 0;
  }
  .elementor-2723 .elementor-element-7ef1e3a p,
  .elementor-2723 .elementor-element-7ef1e3a a,
  .elementor-2723 .elementor-element-7ef1e3a span {
    white-space: nowrap;
  }
  .elementor-2723 .elementor-element-3ef3895,
  .elementor-2723 .elementor-element-77d4d57 {
    flex-wrap: nowrap;
  }
}

/* Fix: el widget FAQ (soon-oficinas-elementor-widgets) trae un "breakout"
   con width:100vw + margin-left:calc(50% - 50vw) para que su fondo blanco
   llegue de borde a borde aunque el widget viva dentro de una columna
   angosta. Ese cálculo asume que el 50% de su propio contenedor coincide
   con el centro real del viewport; como aquí el widget está anidado en
   una columna que no empieza en el borde, el cálculo queda desfasado y
   provoca scroll horizontal en toda la página.
   Se reemplaza por la técnica de "full-bleed" con box-shadow + clip-path:
   logra el mismo fondo blanco de borde a borde sin depender de la
   posición del contenedor padre y sin generar overflow/scroll. */
.elementor-widget-soon-faq-accordion .soon-faq,
.elementor .soon-faq {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 64px !important;
  padding-right: 64px !important;
  position: relative;
  background: #fff !important;
  box-shadow: 0 0 0 100vmax #fff;
  clip-path: inset(0 -100vmax);
}
/* La cadena de contenedores que envuelve al widget (heredada del diseño
   original) no fuerza ancho completo por sí sola, así que el grid interno
   del FAQ (380px + 1fr) se encoge al contenido en vez de usar todo el
   ancho de la página. Se fuerza cada nivel a 100%. */
.elementor-element-3483272,
.elementor-element-2cd6d0b,
.elementor-element-409e620,
.elementor-element-012198e {
  width: 100% !important;
  flex: 1 1 100% !important;
  padding: 0 !important;
}
/* La columna izquierda (título) del FAQ es más ancha de lo necesario;
   se reduce un poco para darle más espacio a la columna de preguntas. */
@media (min-width: 1025px) {
  .soon-faq__layout {
    grid-template-columns: 340px 1fr !important;
  }
}
/* Tableta y móvil: el FAQ queda en una sola columna (título arriba,
   preguntas abajo) para que no se aprieten las preguntas. */
@media (max-width: 1024px) {
  .soon-faq__layout {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }
  .soon-faq__header { position: static !important; }
  .elementor-widget-soon-faq-accordion .soon-faq,
  .elementor .soon-faq {
    padding-left: 32px !important;
    padding-right: 32px !important;
  }
}
@media (max-width: 767px) {
  .elementor-widget-soon-faq-accordion .soon-faq,
  .elementor .soon-faq {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
}

/* Página Preguntas frecuentes: cada bloque (Contratación, Espacios y
   servicios, Domicilio fiscal, Pagos) ya trae su etiqueta en la columna
   izquierda de la página, así que el widget FAQ no debe mostrar su propio
   encabezado por defecto ("DUDAS SOBRE PRECIO / Antes de que preguntes por
   WhatsApp") ni pintar el fondo blanco de borde a borde, que tapaba la
   etiqueta y los fondos alternados blanco/azul de cada sección.
   Se apunta por ID de elemento (igual en todas las bases de datos). */
.elementor-element-d808152 .soon-faq__header,
.elementor-element-989de74 .soon-faq__header,
.elementor-element-f545d2f .soon-faq__header,
.elementor-element-0c477b4 .soon-faq__header {
  display: none !important;
}
.elementor-element-d808152 .soon-faq__layout,
.elementor-element-989de74 .soon-faq__layout,
.elementor-element-f545d2f .soon-faq__layout,
.elementor-element-0c477b4 .soon-faq__layout {
  grid-template-columns: 1fr !important;
}
.elementor-element-d808152 .soon-faq,
.elementor-element-989de74 .soon-faq,
.elementor-element-f545d2f .soon-faq,
.elementor-element-0c477b4 .soon-faq {
  background: transparent !important;
  box-shadow: none !important;
  clip-path: none !important;
  padding: 0 !important;
}
/* Punto de la etiqueta de categoría (venía de 20px) */
.elementor-element-2a17e51,
.elementor-element-c1f6db0,
.elementor-element-a3507bb,
.elementor-element-ee34b38 {
  width: 6px !important;
  height: 6px !important;
  min-width: 6px !important;
  flex: 0 0 6px !important;
  padding: 0 !important;
}
@media (min-width: 1025px) {
  /* Columna de la etiqueta a 340px: las preguntas arrancan al ~30% como en el diseño */
  .elementor-element-e58275b,
  .elementor-element-bd29536,
  .elementor-element-352cede,
  .elementor-element-d5964f2 {
    flex: 0 0 340px !important;
    width: 340px !important;
  }
  .elementor-element-54ec605,
  .elementor-element-e10eb07,
  .elementor-element-d0af299,
  .elementor-element-d3aca1f {
    flex: 1 1 0 !important;
    min-width: 0;
  }
}

/* Mensaje de gracias que reemplaza al formulario de contacto al enviarse
   (js/contact-thanks.js). */
.soon-form-thanks {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  text-align: center;
  background: var(--soon-bg-light);
  border-radius: 16px;
  padding: 48px 32px;
  box-sizing: border-box;
}
.soon-form-thanks p {
  margin: 0;
}
.soon-form-thanks__title {
  font-family: 'Sora', sans-serif;
  font-size: 28px;
  font-weight: 800;
  line-height: 1.2;
  color: #141B2E;
}
.soon-form-thanks__text {
  font-family: 'Sora', sans-serif;
  font-size: 16px;
  line-height: 1.6;
  color: var(--soon-text);
  max-width: 420px;
}
@media (max-width: 767px) {
  .soon-form-thanks {
    padding: 40px 20px;
  }
  .soon-form-thanks__title {
    font-size: 24px;
  }
  .soon-form-thanks__text {
    font-size: 15px;
  }
}

/* Footer Global (Theme Builder) */
.soon-footer-root {
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  background: var(--soon-navy);
  padding: 64px var(--soon-content-padding) 0;
}
.soon-footer-top {
  width: 100% !important;
  max-width: 1400px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap;
  gap: 32px 40px;
  justify-content: space-between;
  padding-bottom: 48px;
}
.soon-footer-brand {
  flex: 1 1 220px !important;
  max-width: 320px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
}
.soon-footer-logo {
  margin-bottom: 24px;
}
.soon-footer-logo img {
  filter: brightness(0) invert(1);
  display: block;
}
.soon-footer-desc {
  color: var(--soon-text-on-dark);
  font-size: 15px;
  line-height: 1.6;
  margin-bottom: 24px;
}
.soon-footer-social {
  display: flex;
  gap: 12px;
}
.soon-footer-social__item a.elementor-icon {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  text-decoration: none;
  font-size: 16px;
}
.soon-footer-social__item a.elementor-icon svg {
  width: 18px;
  height: 18px;
  fill: #fff;
}
.soon-footer-social__item a.elementor-icon:hover {
  background: rgba(255, 255, 255, 0.16);
}
/* Las columnas de enlaces miden lo que mide su texto más largo (antes
   tenían un ancho fijo de ~197px y textos como "Amenidades e
   instalaciones" o "Oficinas físicas A · B · C · D" se partían en dos
   renglones). Si no caben todas en una fila, bajan completas a la
   siguiente fila en vez de partir el texto. */
.soon-footer-col {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
}
.soon-footer-visitanos {
  flex: 0 0 auto !important;
  max-width: none !important;
}
.soon-footer-col-title {
  color: #5B8DEF;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 32px;
}
.soon-footer-col-link {
  display: block;
  color: rgba(255, 255, 255, 0.65);
  text-decoration: none;
  font-size: 14px;
  line-height: 1.4;
  margin-bottom: 26px;
  white-space: nowrap;
}
.soon-footer-col-link a,
.soon-footer-col-link .e-paragraph-link-base {
  color: inherit;
  text-decoration: none;
}
.soon-footer-col-link:hover,
.soon-footer-col-link a:hover {
  color: #fff;
}
.soon-footer-address,
.soon-footer-hours {
  color: rgba(255, 255, 255, 0.85);
  font-size: 14px;
  line-height: 1.6;
  margin-bottom: 16px;
}
.soon-footer-email,
.soon-footer-email a {
  color: #fff;
  font-weight: 700;
  font-size: 14px;
  text-decoration: none;
  white-space: nowrap;
}
.soon-footer-hours {
  white-space: nowrap;
}
.soon-footer-divider {
  width: 100% !important;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}
.soon-footer-bottom {
  width: 100% !important;
  max-width: 1400px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap;
  gap: 16px;
  justify-content: space-between;
  padding: 24px 0;
  color: rgba(255, 255, 255, 0.5);
  font-size: 14px;
}
.soon-footer-copyright {
  color: rgba(255, 255, 255, 0.5);
}
.soon-footer-bottom-links {
  display: flex;
  gap: 24px;
}
.soon-footer-bottom-link,
.soon-footer-bottom-link a {
  color: rgba(255, 255, 255, 0.5);
  text-decoration: none;
}
.soon-footer-bottom-link:hover,
.soon-footer-bottom-link a:hover {
  color: #fff;
}
/* Debajo de ~1366px las 5 columnas ya no caben en una fila sin partir
   texto: el logo + descripción pasa a su propia fila arriba y las 4
   columnas de enlaces quedan juntas debajo. */
@media (max-width: 1365px) {
  .soon-footer-brand {
    flex: 1 1 100% !important;
    max-width: 100% !important;
  }
  .soon-footer-desc {
    max-width: 480px;
  }
}
@media (max-width: 1100px) {
  .soon-footer-top {
    justify-content: flex-start;
    column-gap: 56px;
  }
}
@media (max-width: 1024px) {
  .soon-footer-root {
    padding: 48px 32px 0;
  }
}
@media (max-width: 767px) {
  .soon-footer-root {
    padding: 40px 24px 0;
  }
  .soon-footer-top {
    gap: 32px;
  }
  .soon-footer-bottom {
    flex-direction: column;
    align-items: flex-start;
  }
}
@media (max-width: 380px) {
  .soon-footer-email,
  .soon-footer-email a {
    white-space: normal;
    word-break: break-word;
  }
}

/* Mapa interactivo de Contacto */
div:has(> iframe[src*="google.com/maps"]) {
  width: 100% !important;
}
iframe[src*="google.com/maps"] {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 2 / 1;
  display: block;
}

/* Inicio en tableta (768–1024px): el hero y la sección "Sala de juntas y
   eventos" venían en dos columnas angostas, lo que partía los botones,
   apretaba el horario y encimaba la foto. En tableta se apilan como en
   móvil: texto arriba y foto a todo lo ancho abajo. */
@media (min-width: 768px) and (max-width: 1024px) {
  .elementor-2534 .elementor-element-a0b34f8,
  .elementor-2534 .elementor-element-5974009 {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 40px !important;
  }
  .elementor-2534 .elementor-element-a0b34f8 {
    padding-bottom: 72px !important;
  }
  .elementor-2534 .elementor-element-a0b34f8 > .e-con,
  .elementor-2534 .elementor-element-5974009 > .e-con {
    width: 100% !important;
    max-width: none !important;
    flex: 0 0 auto !important;
    min-height: 0 !important;
  }
  .elementor-2534 .elementor-element-d2b63f0 img,
  .elementor-2534 .elementor-element-5974009 > .e-con:last-child img {
    width: 100% !important;
    height: 420px !important;
    object-fit: cover;
  }
}

/* ---------- Header siempre visible + menú móvil ---------- */
/* El header se queda fijo arriba al hacer scroll. */
.elementor-location-header {
  position: sticky !important;
  top: 0;
  background: #fff;
}
.admin-bar .elementor-location-header { top: 32px; }
@media (max-width: 782px) {
  .admin-bar .elementor-location-header { top: 46px; }
}
/* Con el menú abierto: el panel no puede ser más alto que la pantalla
   (se desplaza por dentro) y la página de atrás no se mueve. Así el botón
   "Agenda una visita" y los datos de contacto siempre se alcanzan. */
.elementor-nav-menu--dropdown {
  max-height: calc(100vh - 86px) !important;
  max-height: calc(100dvh - 86px) !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
body:has(.elementor-menu-toggle.elementor-active) {
  overflow: hidden;
}
.soon-mobile-menu-info__row span:last-child { line-height: 1.5; }

/* ---------- Footer acordeón en móvil ---------- */
@media (max-width: 767px) {
  .soon-footer-top { gap: 0 !important; }
  .soon-footer-brand { margin-bottom: 24px; }
  .soon-footer-col {
    width: 100% !important;
    flex: 0 0 100% !important;
    border-top: 1px solid rgba(255,255,255,0.12);
    padding: 0 !important;
  }
  .soon-footer-col:last-child { border-bottom: 1px solid rgba(255,255,255,0.12); }
  .soon-footer-col .soon-footer-col-title {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    margin: 0 !important;
    padding: 18px 0;
    cursor: pointer;
    user-select: none;
  }
  .soon-footer-col .soon-footer-col-title::after {
    content: '+';
    font-size: 22px;
    font-weight: 400;
    line-height: 1;
    color: rgba(255,255,255,0.7);
  }
  .soon-footer-col--open .soon-footer-col-title::after { content: '\2212'; }
  .soon-footer-col > :not(.soon-footer-col-title) { display: none !important; }
  .soon-footer-col--open > :not(.soon-footer-col-title) { display: block !important; }
  .soon-footer-col--open { padding-bottom: 14px !important; }
  .soon-footer-col--open .soon-footer-col-link { padding: 6px 0; }
}

/* ---------- Inicio: espacios del hero ---------- */
/* "Desde $2,100 al mes" venía pegado y el bloque de horario quedaba
   desalineado (texto partido en 3 líneas y íconos a distinta altura). */
.elementor-2534 .elementor-element-8861526 {
  gap: 10px !important;
  align-items: baseline !important;
  flex-wrap: wrap;
}
.elementor-2534 .elementor-element-3b2f1c6 {
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  gap: 14px 24px !important;
}
.elementor-2534 .elementor-element-3b2f1c6 > .e-con {
  flex: 0 0 auto !important;
  width: auto !important;
  align-items: flex-start !important;
  gap: 8px !important;
}
.elementor-2534 .elementor-element-3b2f1c6 p {
  white-space: nowrap !important;
  line-height: 1.4 !important;
  margin: 0 !important;
}
.elementor-2534 .elementor-element-3b2f1c6 .elementor-icon,
.elementor-2534 .elementor-element-3b2f1c6 svg { flex-shrink: 0; margin-top: 2px; }
@media (max-width: 767px) {
  .elementor-2534 .elementor-element-f3e4d87 { gap: 12px !important; }
  /* Horario / Vigilancia / Recepción en una sola fila de 3: el ícono va
     arriba del texto para que quepan en el ancho del celular. */
  .elementor-2534 .elementor-element-3b2f1c6 {
    flex-wrap: nowrap !important;
    justify-content: space-between !important;
    gap: 12px !important;
  }
  .elementor-2534 .elementor-element-3b2f1c6 > .e-con {
    flex: 0 1 auto !important;
    min-width: 0;
    flex-direction: column !important;
    gap: 6px !important;
  }
  .elementor-2534 .elementor-element-3b2f1c6 p {
    white-space: normal !important;
    font-size: 12px !important;
  }
  /* El horario no se parte a media hora; los otros dos se acomodan en 2 líneas. */
  .elementor-2534 .elementor-element-3b2f1c6 > .e-con:first-child { flex: 0 0 auto !important; }
  .elementor-2534 .elementor-element-3b2f1c6 > .e-con:first-child p { white-space: nowrap !important; }
  .elementor-2534 .elementor-element-3b2f1c6 .elementor-icon,
  .elementor-2534 .elementor-element-3b2f1c6 svg { margin-top: 0; }
}
.soon-mobile-menu-extra { padding-bottom: 96px; }
.soon-mobile-menu-info__row span:last-child { min-width: 0; overflow-wrap: anywhere; font-size: 13.5px; }
.elementor-2534 .elementor-element-8861526 { padding-left: 0 !important; padding-right: 0 !important; }

/* Inicio móvil: los contenedores anidados sumaban el relleno por defecto de
   Elementor (10–20px) y dejaban título, etiqueta y tarjetas a distinta
   sangría. Se quita el relleno extra para que todo parta del mismo borde. */
@media (max-width: 767px) {
  .elementor-2534 .elementor-element-2f9e8fc { padding-left: 0 !important; padding-right: 0 !important; }
  .elementor-2534 .elementor-element-4f2fbc5,
  .elementor-2534 .elementor-element-4795f07 { padding-left: 0 !important; padding-right: 0 !important; }
}

/* Inicio móvil: quita el relleno lateral por defecto (10px) de los
   contenedores transparentes anidados; así textos, tarjetas y precios
   arrancan del mismo borde y no quedan "metidos" a distintas sangrías. */
@media (max-width: 767px) {
  .elementor-2534 .elementor-element-8db2119,
  .elementor-2534 .elementor-element-f3e4d87,
  .elementor-2534 .elementor-element-d2b63f0,
  .elementor-2534 .elementor-element-704adef,
  .elementor-2534 .elementor-element-cb8b745,
  .elementor-2534 .elementor-element-7e2dddc,
  .elementor-2534 .elementor-element-6ea72c4,
  .elementor-2534 .elementor-element-9e45f39,
  .elementor-2534 .elementor-element-78999c5,
  .elementor-2534 .elementor-element-d266489,
  .elementor-2534 .elementor-element-dbd5658,
  .elementor-2534 .elementor-element-98e3807,
  .elementor-2534 .elementor-element-e8c2395,
  .elementor-2534 .elementor-element-5beab72,
  .elementor-2534 .elementor-element-fd85b59,
  .elementor-2534 .elementor-element-a09e656,
  .elementor-2534 .elementor-element-b52ffc9,
  .elementor-2534 .elementor-element-8d38391,
  .elementor-2534 .elementor-element-0579a83,
  .elementor-2534 .elementor-element-958ed99 {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .elementor-2534 .elementor-element-704adef,
  .elementor-2534 .elementor-element-cb8b745,
  .elementor-2534 .elementor-element-7e2dddc {
    gap: 8px !important;
    align-items: baseline !important;
  }
}
@media (max-width: 767px) {
  .soon-footer-col .soon-footer-col-title { width: 100% !important; align-self: stretch; box-sizing: border-box; }
  .soon-footer-top, .soon-footer-brand, .soon-footer-col, .soon-footer-bottom, .soon-footer-bottom-links, .soon-footer-divider {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .soon-footer-bottom-links { gap: 20px; flex-wrap: wrap; }
}
@media (max-width: 767px) {
  .soon-footer-root { padding-left: 24px !important; padding-right: 24px !important; box-sizing: border-box; }
  .soon-footer-bottom-links { padding-bottom: 56px; }
}

/* Precios "Desde $X / mes" de las tarjetas de Inicio (todos los tamaños):
   venían pegados ("Desde$6,510/ mes") y sangrados 10px. */
.elementor-2534 .elementor-element-704adef,
.elementor-2534 .elementor-element-cb8b745,
.elementor-2534 .elementor-element-7e2dddc {
  gap: 8px !important;
  align-items: baseline !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
/* Precios de las tarjetas de Oficinas físicas: "$6,510 MXN / mes" */
.elementor-2534 .elementor-element-6ea72c4 [class*="e-"][class] > p + p { margin-left: 4px; }

/* Precios de tarjetas/tablas de Inicio: sin sangría extra a la izquierda */
.elementor-2534 .elementor-element-78999c5,
.elementor-2534 .elementor-element-5beab72,
.elementor-2534 .elementor-element-f288b2c,
.elementor-2534 .elementor-element-32197c5,
.elementor-2534 .elementor-element-cacafb7,
.elementor-2534 .elementor-element-ba6432b,
.elementor-2534 .elementor-element-8cbdc2a,
.elementor-2534 .elementor-element-3aee8e2,
.elementor-2534 .elementor-element-319e2eb,
.elementor-2534 .elementor-element-faf40e5 { padding-left: 0 !important; }

/* Footer: enlace a Google Maps */
.soon-footer-address .soon-footer-maplink{display:inline-block;margin-top:10px;color:#fff;font-weight:600;text-decoration:underline;text-underline-offset:3px}
.soon-footer-address .soon-footer-maplink:hover{opacity:.8}