/* =====================================================================
   AYC HEADER + FOOTER (templates Elementor 5 y 6) — CSS dedicado global.
   Cargado DESPUÉS de responsive.css (prioridad 10005).
   Usa SIEMPRE los tokens de ayc-base.css (var(--ayc-*)).
   ===================================================================== */

/* PDF-100 — 2026-06-09 */
/* Revisión contra PDFs Home y AYC Advisors:
   - Footer se mantiene con fondo BLANCO: ambos PDFs muestran el footer
     claro con texto oscuro (la franja navy del Home es la sección CTA
     "¡Da el siguiente paso!", no el footer). Sin reglas nuevas.
   - "Quiénes Somos" añadido al menú footer-menu (hereda el estilo
     existente del widget nav-menu del template 6).
   - Logos de header/footer relocalizados a /wp-content/uploads (antes
     apuntaban a aycgroup.duckdns.org y producían imagen rota sin red
     externa). Cambios hechos en _elementor_data de posts 5 y 6. */

/* =====================================================================
   E1 — 2026-06-09 — Conversión a widgets nativos (paridad visual).
   hdr_logo/ftr_logo ahora son widget `image`; ftr_addr es `icon-list`.
   Los data-id se conservaron, así que las reglas existentes de
   style/overrides/responsive siguen aplicando. Lo único que cambia de
   markup son los iconos: el experimento e_font_icon_svg renderiza
   <svg class="e-fas-*"> en vez de <i class="fas">, por lo que el
   reemplazo PNG de overrides.css (i.fas) ya no matchea. Se replica
   aquí 1:1 contra las clases svg. Tokens: verde de marca = #9dc41a
   (var(--ayc-*) no disponible en este archivo de forma garantizada
   para background-image, se usan los mismos valores que overrides).
   ===================================================================== */

/* Iconos marker/phone: mismo reemplazo PNG que overrides.css hacía
   sobre i.fas (recurso-26/27), ahora sobre los svg inline de FA. */
body .elementor-6 .elementor-element[data-id="ftr_addr"] svg.e-fas-map-marker-alt path,
body .elementor-6 .elementor-element[data-id="ftr_addr"] svg.e-fas-phone-alt path {
  display: none !important;
}
body .elementor-6 .elementor-element[data-id="ftr_addr"] svg.e-fas-map-marker-alt {
  width: 24px !important;
  height: 24px !important;
  background: url('/wp-content/uploads/ayc-photos/recurso-26-location.png') center / contain no-repeat !important;
  flex-shrink: 0 !important;
}
body .elementor-6 .elementor-element[data-id="ftr_addr"] svg.e-fas-phone-alt {
  width: 20px !important;
  height: 20px !important;
  background: url('/wp-content/uploads/ayc-photos/recurso-27-phone.png') center / contain no-repeat !important;
  flex-shrink: 0 !important;
}
/* Reloj: mismo glyph FA-regular que el SVG inline original, 18px verde */
body .elementor-6 .elementor-element[data-id="ftr_addr"] svg.e-far-clock {
  width: 18px !important;
  height: 18px !important;
  fill: #9dc41a !important;
  flex-shrink: 0 !important;
}

/* Ancho de la celda de icono por fila = ancho del icono original
   (24/20/18) para conservar el offset X del texto (gap original 8px
   lo aporta text_indent del widget). */
body .elementor-6 .elementor-element[data-id="ftr_addr"] .elementor-icon-list-item:nth-child(1) .elementor-icon-list-icon { width: 24px !important; }
body .elementor-6 .elementor-element[data-id="ftr_addr"] .elementor-icon-list-item:nth-child(2) .elementor-icon-list-icon { width: 20px !important; }
body .elementor-6 .elementor-element[data-id="ftr_addr"] .elementor-icon-list-item:nth-child(3) .elementor-icon-list-icon { width: 18px !important; }

/* Alineación vertical por fila como el blob original:
   fila 1 (dirección 2 líneas) y fila 3 (horario) iban align-flex-start
   con margin-top 3px/2px; fila 2 (teléfono) centrada. */
body .elementor-6 .elementor-element[data-id="ftr_addr"] .elementor-icon-list-item:nth-child(1),
body .elementor-6 .elementor-element[data-id="ftr_addr"] .elementor-icon-list-item:nth-child(3) {
  --icon-vertical-align: flex-start;
  align-items: flex-start !important;
}
body .elementor-6 .elementor-element[data-id="ftr_addr"] .elementor-icon-list-item:nth-child(1) .elementor-icon-list-icon { margin-top: 3px !important; }
body .elementor-6 .elementor-element[data-id="ftr_addr"] .elementor-icon-list-item:nth-child(3) .elementor-icon-list-icon { margin-top: 2px !important; }

/* Offset X del texto: con box-sizing border-box el width fijo de la
   celda de icono absorbe el padding-inline-end que genera text_indent;
   el texto quedaba 3px a la izquierda del original. Shim de paridad. */
body .elementor-6 .elementor-element[data-id="ftr_addr"] .elementor-icon-list-text {
  padding-inline-start: 3px !important;
}

/* Color del texto: NAVY #002244 (igual que §101a de responsive.css).
   overrides.css trae "[data-id=ftr_addr] .elementor-icon-list-text
   { color:#6B7280 !important }" con spec (0,4,1) que le ganaba al navy
   de responsive (0,3,3) sobre el nuevo markup de icon-list. Esta regla
   (0,4,2 / 0,5,2) carga al final y restaura el navy del QA. */
html body .elementor-6 .elementor-element[data-id="ftr_addr"] .elementor-icon-list-text,
html body .elementor-6 .elementor-element[data-id="ftr_addr"] a .elementor-icon-list-text,
html body .elementor-6 .elementor-element[data-id="ftr_addr"] .elementor-icon-list-item,
html body .elementor-6 .elementor-element[data-id="ftr_addr"] .elementor-icon-list-item a {
  color: #839794 !important; /* gris-teal de marca (PDF) — antes navy #002244 */
}
/* r26 (Excel) puso el TELÉFONO del footer en navy+bold ("no se veía" en gris-teal).
   REVERTIDO 2026-06-23 (pedido cliente): vuelve al gris-teal #839794 del PDF, igual
   que el resto del footer (dirección/horario). El ícono de teléfono al lado queda
   verde y da el contraste. Spec (0,6,2) > la base (0,5,2) → gana. */
html body .elementor-6 .elementor-element[data-id="ftr_addr"] .elementor-icon-list-item:nth-child(2),
html body .elementor-6 .elementor-element[data-id="ftr_addr"] .elementor-icon-list-item:nth-child(2) a,
html body .elementor-6 .elementor-element[data-id="ftr_addr"] .elementor-icon-list-item:nth-child(2) .elementor-icon-list-text {
  color: #839794 !important;
  font-weight: 400 !important;
}

/* =====================================================================
   CHROME AUTOSUFICIENTE (2026-06-10) — el header/footer no debe depender
   de overrides.css/responsive.css, que se DEQUEUEAN en páginas nativas
   (Home 13, Servicios 27, …). Estas reglas viven aquí (header-footer.css
   SIEMPRE carga) → el footer se ve igual en páginas nativas y legacy.
   Footer = BLANCO + texto oscuro (el navy del Home es la sección CTA).
   ===================================================================== */
html body .elementor-location-footer,
html body .elementor-6 .elementor-element[data-id="ftr_main"],
html body .elementor-6 .elementor-element[data-id="ftr_inner"] { background-color: #ffffff !important; background-image: none !important; }

/* Columnas del footer en FILA (Elementor las pone en columna por defecto) */
.elementor-location-footer .elementor-element[data-id="ftr_inner"] {
  flex-direction: row; flex-wrap: wrap; align-items: flex-start;
  gap: 40px; justify-content: space-between;
}
.elementor-location-footer .elementor-element[data-id="ftr_col1"],
.elementor-location-footer .elementor-element[data-id="ftr_col2"],
.elementor-location-footer .elementor-element[data-id="ftr_col3"],
.elementor-location-footer .elementor-element[data-id="ftr_col4"] {
  flex: 1 1 180px; width: auto;
}

/* Texto/enlaces del footer en GRIS-TEAL de marca #839794 (PDF — verdad).
   El brief original decía navy, pero el PDF muestra nav/servicios/dirección/
   "Síguenos" en gris-teal. "Servicios" sigue verde (regla aparte abajo). */
html body .elementor-location-footer .elementor-heading-title,
html body .elementor-location-footer .elementor-icon-list-text,
html body .elementor-location-footer .elementor-nav-menu .elementor-item,
html body .elementor-location-footer p,
html body .elementor-location-footer a { color: #839794 !important; }
html body .elementor-location-footer .elementor-nav-menu .elementor-item:hover { color: #9dc41a !important; }

/* col2 (lista servicios AYC) en gris-teal de marca (PDF) */
html body .elementor-6.elementor-location-footer [data-id="ftr_col2"] .elementor-icon-list-text,
html body .elementor-6.elementor-location-footer [data-id="ftr_col2"] a { color: #839794 !important; }

/* Íconos sociales: GLIFOS VERDES sin círculo (PDF), tamaño grande. (Antes eran
   círculos navy con glifo blanco; el PDF los muestra como iconos verdes sueltos.) */
html body .elementor-location-footer .elementor-social-icon {
  background-color: transparent !important; background: transparent !important;
  width: auto !important; height: auto !important; padding: 0 !important;
  margin-right: 18px !important;
  /* [#R2 minor] quitar el recuadro/chip verde: el PDF muestra glifos verdes
     sueltos sin borde ni fondo */
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
html body .elementor-location-footer [data-id="ftr_social"] .elementor-social-icon,
html body .elementor-location-footer .elementor-shape-circle .elementor-social-icon {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}
/* [R1 footer minor] overrides.css fija un recuadro verde 2px + radio 8px en
   body .elementor-6 .elementor-element[data-id="ftr_social"] .elementor-social-icon
   (0,4,1 !important) que ganaba a las reglas de arriba (0,3,2). Lo batimos con
   (0,4,2) para dejar GLIFOS VERDES SUELTOS sin caja, como en el PDF. */
html body .elementor-6 .elementor-element[data-id="ftr_social"] .elementor-social-icon,
html body.elementor-page .elementor-6 .elementor-element[data-id="ftr_social"] .elementor-social-icon {
  border: 0 !important;
  border-width: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
}
/* [Acc R2 MAJOR] Glifos sociales VERDES de marca, visibles sobre footer blanco.
   Los e-font-icon-svg pintan por `fill` (currentColor); un color blanco
   heredado del texto del footer (rgba(255,255,255,.85)) hacía que un auditor
   los midiera como "blancos/invisibles". Fijamos color Y fill en verde, tanto
   en el <a>/.elementor-social-icon como en el <svg> y su <path>, para que el
   glifo sea verde sin importar si pinta por fill o por currentColor.
   style.css fija (0,3,0 !important) `[data-id="ftr_inner"] * { color:rgba(255,255,255,.85) }`
   sobre el <path>; lo batimos incluyendo [data-id="ftr_social"] (4 tokens) para
   subir la especificidad por encima y ganar el cascade entre !important. */
html body .elementor-location-footer [data-id="ftr_social"] .elementor-social-icon,
html body .elementor-location-footer [data-id="ftr_social"] .elementor-social-icon i,
html body .elementor-location-footer [data-id="ftr_social"] .elementor-social-icon svg,
html body .elementor-location-footer [data-id="ftr_social"] .elementor-social-icon svg path {
  color: #9dc41a !important; fill: #9dc41a !important;
}
html body .elementor-location-footer .elementor-social-icon i,
html body .elementor-location-footer .elementor-social-icon svg {
  font-size: var(--fs-h2-xl) !important; width: 28px !important; height: 28px !important;
}
html body .elementor-location-footer [data-id="ftr_social"] .elementor-social-icon:hover,
html body .elementor-location-footer [data-id="ftr_social"] .elementor-social-icon:hover i,
html body .elementor-location-footer [data-id="ftr_social"] .elementor-social-icon:hover svg,
html body .elementor-location-footer [data-id="ftr_social"] .elementor-social-icon:hover svg path { color: #1e2751 !important; fill: #1e2751 !important; }

/* [R1 fonts minor] TERCER FONT: overrides.css fuerza el menú del header
   (body .elementor-5 ...hdr_nav .elementor-item) y el teléfono (...hdr_phone
   .elementor-icon-list-text) a "Open Sans" !important (0,4,1) → aparecía un 3er
   tipo en la página. Restauramos la familia de marca Futura con (0,4,2). */
html body .elementor-5 .elementor-element.elementor-element-hdr_nav .elementor-nav-menu--main a.elementor-item,
html body .elementor-5 .elementor-element.elementor-element-hdr_nav .elementor-nav-menu a.elementor-item,
html body .elementor-location-header [data-id="hdr_nav"] .elementor-nav-menu--main a.elementor-item {
  font-family: var(--ayc-font-head);
}
html body .elementor-5 .elementor-element.elementor-element-hdr_phone .elementor-icon-list-items .elementor-icon-list-text,
html body .elementor-5 .elementor-element.elementor-element-hdr_phone .elementor-icon-list-text,
html body .elementor-location-header [data-id="hdr_phone"] .elementor-icon-list-text,
html body .elementor-location-header [data-id="hdr_phone"] a {
  font-family: var(--ayc-font-body);
}
/* [R1 fonts] Mismo 3er-font Open Sans en el FOOTER: nav (ftr_nav1), lista de
   servicios (ftr_services_list) y dirección/teléfono (ftr_addr) → Futura. */
html body .elementor-6 .elementor-element.elementor-element-ftr_nav1 .elementor-nav-menu--main a.elementor-item,
html body .elementor-6 .elementor-element.elementor-element-ftr_nav1 .elementor-nav-menu a.elementor-item {
  font-family: var(--ayc-font-head);
}
html body .elementor-6 .elementor-element.elementor-element-ftr_services_list .elementor-icon-list-items .elementor-icon-list-text,
html body .elementor-6 .elementor-element.elementor-element-ftr_services_list .elementor-icon-list-text,
html body .elementor-6 .elementor-element[data-id="ftr_addr"] .elementor-icon-list-items .elementor-icon-list-text,
html body .elementor-6 .elementor-element[data-id="ftr_addr"] .elementor-icon-list-text {
  font-family: var(--ayc-font-body);
}

/* ===== RONDA AUDITOR header/footer (vs PDF) — 2026-06-10 ===== */
/* [#13] Teléfono del header: navy de marca (venía azul default #0000ee) */
html body .elementor-location-header [data-id="hdr_right"] a,
html body .elementor-location-header [data-id="hdr_right"] a span,
html body .elementor-location-header [data-id="hdr_right"] .elementor-icon-list-text { color: #1e2751 !important; }
/* [#18] Subrayado del item activo del header: VERDE de marca (venía azul #0075a9) */
html body .elementor-location-header .elementor-nav-menu .elementor-item-active::after,
html body .elementor-location-header .elementor-nav-menu .elementor-item.is-current::after,
html body .elementor-location-header .elementor-nav-menu .current-menu-item > a::after,
html body .elementor-location-header .elementor-nav-menu .current-menu-ancestor > a::after,
html body .elementor-location-header .elementor-nav-menu .current-menu-parent > a::after { background-color: #9dc41a !important; border-color: #9dc41a !important; }
/* [#7] Disclaimer inferior del footer: gris-teal de marca #839794 (PDF). */
html body .elementor-location-footer [data-id="ftr_bottom"],
html body .elementor-location-footer [data-id="ftr_bottom"] * { color: #839794 !important; }
/* [#23] Footer todo en Futura (col1/promesa venían Open Sans) */
html body .elementor-location-footer .elementor-nav-menu .elementor-item,
html body .elementor-location-footer p,
html body .elementor-location-footer span { font-family: var(--ayc-font-body); }
/* [#24] Footer nav SIN subrayado activo (el PDF no lo tiene) */
html body .elementor-location-footer .elementor-nav-menu .elementor-item-active::after { display: none !important; }

/* ===== RONDA GAPS MEDIDOS — 2026-06-10 ===== */
/* [#2] Submenú desplegable de "Servicios": SOLO Futura (auditoría reportó
   Open Sans 16px). Forzamos Futura en los items del sub-menu del header. */
html body .elementor-location-header .elementor-nav-menu .sub-menu a,
html body .elementor-location-header .elementor-nav-menu .sub-menu .elementor-sub-item,
html body .elementor-location-header .sub-menu a {
  font-family: 'Futura Bold','Futura Medium',sans-serif !important;
}
/* [#2-fix 2026-06-10] El submenú real de "Servicios" NO está en .elementor-location-header:
   es un dropdown custom anclado a <body> (#ayc-svc-dropdown). Sus 3 enlaces (AYC Advisors /
   AYC Accountants / Ayuda Center) heredaban 'Open Sans' del tema. Forzamos Futura ahí. */
html body #ayc-svc-dropdown,
html body #ayc-svc-dropdown a,
html body #ayc-svc-dropdown * {
  font-family: 'Futura Medium','Futura Bold',sans-serif !important;
}
/* Sub-items de "Servicios" (dropdown) → 16px (estaban en 11, "muy pequeños" según el cliente jun-2026) */
html body #ayc-svc-dropdown a,
html body #ayc-svc-dropdown .ayc-svc-dropdown__link { font-size: var(--fs-nav-sub) !important; }

/* ===== ESCALA HEADER/FOOTER (pedido cliente "2x" — legibilidad) 2026-06-10 ===== */
/* Header: nav y teléfono más grandes, nav en navy de marca.
   style.css fija el nav a 14px con (0,4,0) → subo specificity con el data-id del widget. */
html body .elementor-location-header [data-id="hdr_nav"] .elementor-nav-menu .elementor-item,
html body .elementor-location-header .elementor-nav-menu .elementor-item { font-size: var(--fs-nav) !important; color: #1e2751 !important; }
html body .elementor-location-header [data-id="hdr_right"] a,
html body .elementor-location-header [data-id="hdr_right"] .elementor-icon-list-text,
html body .elementor-location-header [data-id="hdr_right"] span { font-size: var(--fs-nav) !important; }
html body .elementor-location-header .elementor-button { font-size: var(--fs-button) !important; padding: 12px 28px !important; } /* botón header → token (mín 22px, pedido cliente) */
/* Header: icono de teléfono en VERDE de marca (PDF) */
html body .elementor-location-header [data-id="hdr_right"] i,
html body .elementor-location-header [data-id="hdr_right"] svg { color: #9dc41a !important; fill: #9dc41a !important; }

/* Footer: textos más grandes (escala global). style.css fija icon-list-text a
   14px con (0,3,0) por data-id → subo specificity targeteando cada columna. */
html body .elementor-location-footer [data-id="ftr_services_list"] .elementor-icon-list-text,
html body .elementor-location-footer [data-id="ftr_addr"] .elementor-icon-list-text,
html body .elementor-location-footer .elementor-icon-list-text,
html body .elementor-location-footer .elementor-nav-menu .elementor-item,
html body .elementor-location-footer p { font-size: var(--fs-footer) !important; }
html body .elementor-location-footer [data-id="ftr_follow"] .elementor-heading-title,
html body .elementor-location-footer [data-id="ftr_follow"] { font-size: var(--fs-nav) !important; color: #839794 !important; }  /* "Síguenos:" en gris-teal de marca (PDF) */
/* Footer: iconos de dirección/teléfono en VERDE (PDF) */
html body .elementor-location-footer [data-id="ftr_addr"] .elementor-icon-list-icon i,
html body .elementor-location-footer [data-id="ftr_addr"] .elementor-icon-list-icon svg { color: #9dc41a !important; fill: #9dc41a !important; }

/* ===== FOOTER LAYOUT (PDF): logo a la IZQUIERDA con la columna nav AL LADO,
   las 4 columnas (Inicio / AYC / dirección / Síguenos) alineadas arriba ===== */
html body .elementor-location-footer [data-id="ftr_inner"] { align-items: flex-start !important; }
/* col1 = [logo | Inicio·Servicios·Quiénes Somos] en fila, no apilados.
   En Elementor el flex vive en .e-con-inner (boxed) o en el propio .e-con (full). */
html body .elementor-location-footer [data-id="ftr_col1"] {
  flex: 0 0 auto !important; width: auto !important; max-width: none !important;
}
html body .elementor-location-footer [data-id="ftr_col1"] > .e-con-inner,
html body .elementor-location-footer [data-id="ftr_col1"].e-con > .e-con-inner,
html body .elementor-location-footer [data-id="ftr_col1"]:not(:has(> .e-con-inner)) {
  flex-direction: row !important; align-items: center !important; gap: 88px !important; flex-wrap: nowrap !important;
}
html body .elementor-location-footer [data-id="ftr_logo"] { flex: 0 0 148px !important; width: 148px !important; margin: 0 !important; }
html body .elementor-location-footer [data-id="ftr_logo"] img { width: 148px !important; height: auto !important; }
html body .elementor-location-footer [data-id="ftr_nav1"] { flex: 0 0 auto !important; width: auto !important; }
/* "Servicios" del footer en VERDE (PDF resalta Servicios) */
html body .elementor-location-footer [data-id="ftr_nav1"] .menu-item:nth-child(2) .elementor-item { color: #9dc41a !important; }
/* Reducir el hueco vertical excesivo del footer */
html body .elementor-location-footer [data-id="ftr_main"] { padding-top: 56px !important; padding-bottom: 28px !important; }
html body .elementor-location-footer [data-id="ftr_divider_wrap"] { padding-top: 24px !important; padding-bottom: 8px !important; }
html body .elementor-location-footer [data-id="ftr_bottom"] { padding-top: 8px !important; padding-bottom: 24px !important; }

/* ===== RONDA GAPS MEDIDOS FOOTER — 2026-06-11 =====
   [#layout] Repartir las 4 columnas a lo ancho como el PDF y ELIMINAR el
   hueco blanco (~122px) a la derecha. Antes: columnas flex:1 1 180px con
   justify-content:space-between → col4 (Síguenos) terminaba en x1303 dejando
   vacío el lado derecho. Solución: columnas a contenido (flex:0 1 auto) con
   space-between real → la 1ª pega al margen izq y la última al margen der;
   el resto se reparte. col1 mantiene su tamaño de contenido (logo+nav). */
html body .elementor-location-footer [data-id="ftr_inner"],
html body .elementor-location-footer [data-id="ftr_inner"] > .e-con-inner {
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  justify-content: space-between !important;
  align-items: flex-start !important;
  gap: 24px !important;
}
html body .elementor-location-footer [data-id="ftr_col1"],
html body .elementor-location-footer [data-id="ftr_col2"],
html body .elementor-location-footer [data-id="ftr_col3"],
html body .elementor-location-footer [data-id="ftr_col4"] {
  flex: 0 1 auto !important; width: auto !important; max-width: none !important;
}
/* col4 (Síguenos + social) alineado a la izquierda dentro de su caja, pero la
   caja pegada al margen derecho del contenido → social termina ~x1326. */
html body .elementor-location-footer [data-id="ftr_col4"] { align-items: flex-start !important; }

/* [#disclaimer] ftr_bottom alineado a la IZQUIERDA (PDF: disclaimer arranca
   bajo el logo, no centrado). */
html body .elementor-location-footer [data-id="ftr_bottom"] {
  align-items: flex-start !important; text-align: left !important;
}
html body .elementor-location-footer [data-id="ftr_disclaimer"],
html body .elementor-location-footer [data-id="ftr_disclaimer"] p {
  text-align: left !important; max-width: none !important; margin: 0 !important;
}
/* [#disclaimer-icon] Triángulo de aviso MONOCROMO gris-teal (PDF). El emoji
   ⚠ Twemoji se renderizaba amarillo/multicolor; se quitó del texto fuente y
   se reintroduce como glifo Unicode monocromo en el color de marca. */
html body .elementor-location-footer [data-id="ftr_disclaimer"] p::before {
  content: "\26A0\FE0E"; /* warning sign + VS15 = text (monocromo) presentation */
  font-family: 'Arial', sans-serif !important; /* glifo monocromo, no emoji */
  /* GAP: el footer es FONDO BLANCO → el glifo blanco quedaba INVISIBLE. El ⚠
     debe ir gris-teal #839794 (mismo color que el texto del disclaimer), no
     blanco como el del hero (hero = fondo navy). */
  color: #839794 !important;
  margin-right: 7px;
  font-size: var(--fs-footer-legal); /* glifo ⚠ al tier del disclaimer (14px); antes 0.95em literal */
  -webkit-text-fill-color: #839794;
}

/* [#divider] El divider blanco-15% del diseño navy original es invisible sobre
   blanco; el PDF no muestra divisor → lo ocultamos para limpiar. */
html body .elementor-location-footer [data-id="ftr_divider_wrap"] { display: none !important; }

/* ===== RONDA GAPS MEDIDOS FOOTER NAV — 2026-06-11 / corregido 2026-06-23 =====
   [#major spacing ftr_nav1] El cliente: "la primera columna (nav) tiene más
   salto de línea que las otras dos columnas de texto". MEDIDO + verificado por
   panel adversarial vs PDF (escala PDF→live 1.34×, logo 198px/148px):
   - DISEÑO: las 3 columnas comparten pitch ~40px @PDF = **30px en escala live**,
     con filas alineadas.
   - LIVE: services = 30px (✓ empata el diseño), nav = **36px** (✗ +6px/fila →
     en la fila 3 cae 12px por debajo de services). La fuente ya es igual en las
     3 columnas (--fs-footer = 20px); SÓLO difería el pitch.
   - El +6px del nav venía del padding 3px arriba+3px abajo del <a> de Elementor
     que inflaba la caja de 30px (line-height) a 36px.
   FIX: padding vertical del item = 0 → caja = 30px (line-height) = misma fila que
   services (30px) → pitch unificado 30px, filas alineadas como el diseño:
   Inicio↔AYC Advisors, Servicios↔AYC Accountants, Quiénes Somos↔Ayuda Center.
   (overrides.css se DEQUEUEA en páginas nativas; el reset vive aquí; spec con
   data-id + !important para ganar al default de Elementor y a post-6.css.) */
html body .elementor-location-footer [data-id="ftr_nav1"] .elementor-nav-menu--main .elementor-item,
html body .elementor-location-footer [data-id="ftr_nav1"] .elementor-nav-menu .elementor-item {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  line-height: 30px !important;   /* = altura de fila de la columna de servicios (30px) */
}
/* [#minor layout ftr_nav1] La fila 1 del nav ('Inicio') caía 4px por debajo
   de las demás columnas porque col1 centra verticalmente (align-items:center)
   el bloque nav (más corto) contra el logo (más alto). Top-alineamos el
   contenido de col1 → 'Inicio' arranca a la misma altura (top≈5974) que
   'AYC Advisors' / '8230 Coral Way' / 'Síguenos:'. El logo, más alto, se
   extiende hacia abajo (paridad PDF: filas 1 alineadas arriba). */
html body .elementor-location-footer [data-id="ftr_col1"] > .e-con-inner,
html body .elementor-location-footer [data-id="ftr_col1"].e-con > .e-con-inner {
  align-items: flex-start !important;
}

/* [#minor type ftr_disclaimer] Subir el disclaimer de 11px → 12px para holgura
   de legibilidad (color gris-teal y familia Futura Medium ya correctos). */
html body .elementor-location-footer [data-id="ftr_disclaimer"],
html body .elementor-location-footer [data-id="ftr_disclaimer"] p {
  font-size: var(--fs-12) !important;
}

/* ===== RONDA GAPS MEDIDOS FOOTER — 2026-06-11 (peso nav + fallback fuente) =====
   [#major type ftr_nav1] Los items del menú (Inicio/Servicios/Quiénes Somos)
   heredaban el peso de la tipografía PRIMARY del Kit (Futura Bold = 700) vía
   `.elementor-widget-nav-menu .elementor-nav-menu .elementor-item{font-weight:
   var(--e-global-typography-primary-font-weight)}` (post-6.css, spec (0,3,0),
   sin !important). En el PDF ambas columnas (nav y servicios) tienen el MISMO
   peso medio/regular; la columna de servicios (icon-list) usa la tipografía
   TEXT del Kit = 400. Igualamos el nav a 400 con !important scopeado a ftr_nav1
   (gana al var del Kit). NO se toca el peso PRIMARY global (gobierna headings y
   todos los nav menus del sitio); fix scopeado = correcto. Color verde de
   "Servicios" (#9dc41a) y gris-teal del resto (#839794) intactos. */
html body .elementor-location-footer [data-id="ftr_nav1"] .elementor-nav-menu .elementor-item,
html body .elementor-location-footer [data-id="ftr_nav1"] .elementor-nav-menu--main .elementor-item,
html body .elementor-location-footer [data-id="ftr_nav1"] .elementor-item.elementor-item-active {
  font-weight: 400 !important;
}

/* [#minor type ftr_follow] El heading "Síguenos:" tenía el stack
   '"Futura Bold", Montserrat, sans-serif' — único texto del footer con
   Montserrat como fallback (el resto usa 'Open Sans'). Futura Bold SÍ carga,
   así que no hay defecto visible, pero normalizamos el fallback de marca para
   que un fallo de carga de Futura nunca introduzca una 3ª fuente (Montserrat).
   Marca = SOLO Futura. */
html body .elementor-location-footer [data-id="ftr_follow"] .elementor-heading-title,
html body .elementor-location-footer [data-id="ftr_follow"] {
  font-family: var(--ayc-font-head);
}

/* [#R2 minor] Peso del botón "Contacto" del header = 700 para coherencia con
   todos los CTA verdes del cuerpo (venía en 600). */
html body .elementor-location-header [data-id="hdr_cta"] .elementor-button,
html body .elementor-location-header [data-id="hdr_cta"] .elementor-button span {
  font-weight: 700 !important;
}

/* ===== HOVER del botón "Contacto" del header (coherencia con el Home) 2026-06-11 ===== */
html body .elementor-location-header .elementor-button {
  transition: transform .25s ease, box-shadow .25s ease, filter .25s ease !important;
}
html body .elementor-location-header .elementor-button:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 20px rgba(157,196,26,.35) !important;
  filter: brightness(1.05) !important;
}

/* ===== [#major color svc-chevron] Chevron ▾ junto a "Servicios" 2026-06-12 =====
   El span trae color/opacity inline (font-size:10px;margin-left:4px;opacity:0.6)
   y heredaba el navy del item → se veía azul-grisáceo apagado. El PDF
   (/tmp/pdf_header.png) lo muestra en VERDE de marca sólido #9dc41a, bien
   visible. Pisamos color+opacity (inline => requiere !important) y subimos el
   tamaño 10px→12px para paridad de visibilidad con el chevron del PDF. */
html body .elementor-location-header .elementor-nav-menu .elementor-item .ayc-svc-chevron {
  color: #9dc41a !important;
  opacity: 1 !important;
  font-size: var(--fs-12) !important;
}

/* ===== RONDA GAPS MEDIDOS HEADER — 2026-06-12 (balance nav + CTA) ===== */
/* [#major spacing hdr_nav] El cluster del nav (Inicio · Servicios ▾ · Quiénes
   Somos) se pegaba al logo: gap logo→nav=20px, nav→teléfono=232px (asimétrico,
   centro del cluster x517 vs centro header x713). El menú vive en
   .elementor-nav-menu__container (flex, width=807, justify:normal) → la <ul>
   (w=595) quedaba left-aligned. hdr_nav es .e-con-full → flex en el propio
   .e-con (NO hay .e-con-inner) y ya tiene justify:center, pero el __container
   intermedio left-alinea la ul. Centramos la ul dentro del __container →
   cluster centrado en el hueco logo↔teléfono: gap izq=126px = gap der=126px
   (MEDIDO), centro x624 (balanceado a la derecha del centro como el PDF). */
html body .elementor-location-header [data-id="hdr_nav"] .elementor-nav-menu__container,
html body .elementor-location-header [data-id="hdr_nav"] .elementor-nav-menu--main {
  justify-content: center !important;
}

/* [#major type + #minor spacing CTA Contacto] La regla de la línea ~189
   (.elementor-location-header .elementor-button) la pisaba un selector más
   específico del Kit/Elementor → font-size caía a 14px y padding a 10/20.
   Subimos specificity scopeando bajo hdr_right (0,3,2 + !important) para que
   16px / 12px 28px ganen. MEDIDO objetivo: font 16px, padding 12px 28px. */
html body .elementor-location-header [data-id="hdr_right"] .elementor-button,
html body .elementor-location-header [data-id="hdr_right"] a.elementor-button {
  font-size: var(--fs-button) !important;   /* botón header → token (mín 22px, pedido cliente jun-2026; era 16px) */
  padding: 10px 26px !important;             /* padding un poco menor para compensar la fuente mayor en el header compacto */
}
/* [#major color CTA Contacto 2026-06-15] La etiqueta "Contacto" del pill verde
   debe ser BLANCA (PDF). El <a> era blanco pero el <span.elementor-button-text>
   interior heredaba navy (#1e2751) → se veía oscuro. Forzamos blanco en el
   botón Y en su texto/iconos. */
html body .elementor-location-header .elementor-button,
html body .elementor-location-header .elementor-button .elementor-button-text,
html body .elementor-location-header .elementor-button .elementor-button-content-wrapper,
html body .elementor-location-header [data-id="hdr_right"] a.elementor-button,
html body .elementor-location-header [data-id="hdr_right"] a.elementor-button .elementor-button-text {
  color: #ffffff !important;
}

/* ===== TYPE-SCALE FOOTER 2026-06-12: letras más grandes (era 17 → 20) ===== */
html body .elementor-location-footer [data-id="ftr_services_list"] .elementor-icon-list-text,
html body .elementor-location-footer [data-id="ftr_addr"] .elementor-icon-list-text,
html body .elementor-location-footer .elementor-icon-list-text,
html body .elementor-location-footer .elementor-nav-menu .elementor-item,
html body .elementor-location-footer p { font-size: var(--fs-footer-sm) !important; }
html body .elementor-location-footer [data-id="ftr_follow"] .elementor-heading-title { font-size: var(--fs-hdr-btn-sm) !important; }

/* ===== TYPE-SCALE FOOTER 2026-06-14: cliente pide MÍNIMO 24px en el footer.
   Columnas (Inicio/Servicios/Quiénes Somos, AYC Advisors/Accountants/Ayuda
   Center), dirección/teléfono (icon-list) y "Síguenos:" → 24px. El disclaimer
   legal (microcopy) se mantiene como letra fina pero sube 12→14px. Última
   regla del footer → gana a las de 20/22px de arriba. ===== */
html body .elementor-location-footer [data-id="ftr_services_list"] .elementor-icon-list-text,
html body .elementor-location-footer [data-id="ftr_services_list"] a,
html body .elementor-location-footer [data-id="ftr_services_list"] .elementor-icon-list-item > a,
html body .elementor-location-footer [data-id="ftr_addr"] .elementor-icon-list-text,
html body .elementor-location-footer .elementor-icon-list-text,
html body .elementor-location-footer .elementor-nav-menu .elementor-item,
html body .elementor-location-footer [data-id="ftr_col1"] p,
html body .elementor-location-footer [data-id="ftr_col2"] p,
html body .elementor-location-footer [data-id="ftr_col3"] p,
html body .elementor-location-footer [data-id="ftr_col4"] p { font-size: var(--fs-footer) !important; }   /* footer unificado a --fs-footer (20); incluye el <a> de servicios que style.css fijaba en 14 */
html body .elementor-location-footer [data-id="ftr_follow"] .elementor-heading-title { font-size: var(--fs-footer-sm) !important; }   /* footer 24→20 (jun-2026): el cliente lo ve grande vs el PDF; antes pidió mín 24, ahora más sobrio */
/* disclaimer legal: sigue siendo letra fina, pero un poco más legible */
html body .elementor-location-footer [data-id="ftr_disclaimer"],
html body .elementor-location-footer [data-id="ftr_disclaimer"] p { font-size: var(--fs-footer-legal) !important; }

/* [FIX layout footer 24px 2026-06-14] Con 24px, "AYC Accountants" y el
   teléfono "+1 305-971-5232" rompían a 2 líneas. Ensancho sus columnas (hay
   holgura) + nowrap a esas etiquetas cortas. La DIRECCIÓN mantiene 2 líneas
   ("8230 Coral Way," / "Miami, FL 33155") como el PDF, así que NO lleva nowrap. */
/* [FIX aire footer 2026-06-14] "se ve todo pegado" → más espacio lateral:
   padding lateral + distribuir las columnas a lo ancho (space-between) + gap
   mínimo mayor. Antes: sin padding lateral y gap 18px → columnas apelmazadas. */
html body .elementor-location-footer [data-id="ftr_inner"] {
  padding-left: 56px !important; padding-right: 56px !important;
}
/* El contenedor flex REAL de las columnas es .e-con-inner (no ftr_inner): venía
   tope ~1200px con gap 24px → columnas justo encajadas = "todo pegado". Lo
   liberamos a todo el ancho y repartimos con space-between → gaps ~60px de aire. */
html body .elementor-location-footer [data-id="ftr_inner"] > .e-con-inner {
  max-width: none !important; width: 100% !important;
  gap: 32px !important;
  justify-content: space-between !important;
}
html body .elementor-location-footer [data-id="ftr_col2"] { width: 250px !important; flex: 0 0 250px !important; }
html body .elementor-location-footer [data-id="ftr_col3"] { width: 280px !important; flex: 0 0 280px !important; }
html body .elementor-location-footer [data-id="ftr_services_list"] .elementor-icon-list-text { white-space: nowrap !important; }
html body .elementor-location-footer [data-id="ftr_addr"] .elementor-icon-list-item:nth-child(2) .elementor-icon-list-text { white-space: nowrap !important; }

/* [#major disclaimer 1-línea 2026-06-16] El inner del contenedor boxed de
   ftr_bottom venía cajeado a max-width:min(100%,1200px) (más estrecho que la
   fila ftr_inner, que se liberó a todo el ancho con padding lateral 56px) → el
   disclaimer disponía solo de 1200px y envolvía a 2 líneas (medido: necesita
   1289px en Myriad). Lo liberamos a todo el ancho con el MISMO padding lateral
   56px que ftr_inner → ancho útil 1313px y borde izquierdo alineado bajo el
   logo (x=56), como el PDF. El flex real vive en .e-con-inner, no en el
   data-id (igual que ftr_inner). */
html body .elementor-location-footer [data-id="ftr_bottom"] > .e-con-inner {
  max-width: none !important; width: 100% !important;
  padding-left: 56px !important; padding-right: 56px !important;
}
/* [#minor disclaimer Myriad 2026-06-16] El disclaimer legal usa Myriad Pro
   (estándar del pase para texto legal, mismo tratamiento que el disclaimer del
   hero). header-footer.css fijaba 'Futura Medium' globalmente para todo
   .elementor-location-footer p (línea ~215) → este override más específico
   (data-id del disclaimer) lo vence. Beneficio doble: Myriad es más compacto
   (1289px vs 1335px en Futura) → con el inner liberado a 1313px, la frase entra
   en 1 sola línea sin <br> ni reducir fuente. */
html body .elementor-location-footer [data-id="ftr_disclaimer"] p,
html body .elementor-location-footer [data-id="ftr_disclaimer"] p span {
  font-family: var(--ayc-font-body) !important;
  white-space: nowrap !important;   /* fuerza 1 línea (la frase en Myriad cabe en 1313px) */
}

/* =====================================================================
   RONDA AUDITOR CHROME vs PDF Home — 2026-06-18 (BLOQUE AUTORITATIVO)
   Cargado AL FINAL → gana a todas las rondas previas. El PDF del Home
   (/tmp/hdr_crop.png, /tmp/ftr_crop.png — 1920px de diseño → ×0.75 @1440)
   muestra el chrome MÁS LIGERO y CONSISTENTE de lo que estaba quedando:
   · Nav del header = GRIS de marca #839395, peso medio (NO Futura Bold),
     subrayado verde SOLO en el activo (mismo color de texto que el resto).
   · Solo 3 items de nav (Inicio · Servicios ▾ · Quiénes Somos) — el ítem
     "Preguntas Frecuentes" se eliminó del menú main-menu (db_id 103).
   · Teléfono del header = mismo gris #839395; icono = AURICULAR DE LÍNEA
     (outline), no el glifo sólido de FA; verde.
   · Botón "Contacto" = pill verde compacto (~103×29), etiqueta ~15px.
   · Footer = UNA sola escala de texto (var(--fs-footer)=20px), peso
     regular, lh cómodo (≥1.4) — consolida la mezcla 24/16/14 que el
     auditor marcó (col1 24px Futura Bold con lh 20px = "sobredimensionado
     y apretado"). "Servicios" sigue verde.
     Tokens centralizados en ayc-base.css.
   ===================================================================== */

/* ---- HEADER · NAV: gris de marca + cut MEDIO (no Bold) ----
   La regla [R1 fonts] (línea ~177) pinea 'Futura Bold' con
   .elementor-5 .elementor-element.elementor-element-hdr_nav (spec 0,4,2 !important).
   Para soltar el cut Bold (gap: "el face cargado es un Bold → se ve pesado")
   igualamos/superamos esa specificity con el mismo selector de element-class. */
html body .elementor-5 .elementor-element.elementor-element-hdr_nav .elementor-nav-menu--main a.elementor-item,
html body .elementor-5 .elementor-element.elementor-element-hdr_nav .elementor-nav-menu a.elementor-item,
html body .elementor-location-header [data-id="hdr_nav"] .elementor-nav-menu .elementor-item,
html body .elementor-location-header [data-id="hdr_nav"] .elementor-nav-menu--main a.elementor-item,
html body .elementor-location-header .elementor-nav-menu .elementor-item {
  color: var(--ayc-chrome-gray) !important;
  font-family: var(--ayc-font-body);
  font-weight: 500 !important;
  font-size: var(--fs-nav) !important;
}
/* El item activo NO se pinta navy: mismo gris que el resto, distinguido SOLO
   por el subrayado verde (el subrayado verde ya está en la regla [#18]). */
html body .elementor-location-header .elementor-nav-menu .elementor-item-active,
html body .elementor-location-header .elementor-nav-menu .elementor-item.elementor-item-active,
html body .elementor-location-header .elementor-nav-menu .current-menu-item > a,
html body .elementor-location-header [data-id="hdr_nav"] .elementor-nav-menu .elementor-item-active {
  color: var(--ayc-chrome-gray) !important;
}
/* Chevron ▾ de Servicios: se mantiene VERDE (regla previa lo fija; re-aseguramos). */
html body .elementor-location-header .elementor-nav-menu .elementor-item .ayc-svc-chevron {
  color: #9dc41a !important; opacity: 1 !important;
}

/* ---- HEADER · TELÉFONO: número en gris de marca ---- */
html body .elementor-location-header [data-id="hdr_phone"] .elementor-icon-list-text,
html body .elementor-location-header [data-id="hdr_phone"] a,
html body .elementor-location-header [data-id="hdr_phone"] a .elementor-icon-list-text,
html body .elementor-location-header [data-id="hdr_right"] .elementor-icon-list-text {
  color: var(--ayc-chrome-gray) !important;
  font-size: var(--fs-nav-phone) !important;
}

/* ---- HEADER · ICONO DE TELÉFONO: auricular de LÍNEA (outline), verde ----
   El glifo FA es SÓLIDO; lo ocultamos con opacity:0 (conserva el tamaño de la
   caja, gotcha 7i) y pintamos un auricular de TRAZO como background-image en
   el contenedor del icono. SVG verde (#9dc41a), estilo línea (Tabler-like).
   Elementor 4 lo sirve como fuente (<i class="fas fa-phone">) y no como <svg>:
   sin el selector de <i> se veían los dos auriculares superpuestos. */
html body .elementor-location-header [data-id="hdr_phone"] .elementor-icon-list-icon svg.e-fas-phone,
html body .elementor-location-header [data-id="hdr_phone"] .elementor-icon-list-icon svg,
html body .elementor-location-header [data-id="hdr_phone"] .elementor-icon-list-icon i {
  opacity: 0 !important;
}
html body .elementor-location-header [data-id="hdr_phone"] .elementor-icon-list-icon {
  width: 18px !important; height: 18px !important;
  background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239dc41a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h4l2 5l-2.5 1.5a11 11 0 0 0 5 5l1.5 -2.5l5 2v4a2 2 0 0 1 -2 2a16 16 0 0 1 -15 -15a2 2 0 0 1 2 -2'/%3E%3C/svg%3E");
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
}

/* ---- HEADER · BOTÓN "Contacto": pill verde COMPACTO (~103×29), label ~15px ----
   Las rondas previas lo subieron a 26px/700/130×38. El PDF lo muestra como un
   pill contenido y pequeño. Reducimos label, padding y peso (último bloque → gana). */
html body .elementor-location-header [data-id="hdr_cta"] .elementor-button,
html body .elementor-location-header [data-id="hdr_right"] a.elementor-button,
html body .elementor-location-header .elementor-button {
  font-size: var(--fs-hdr-btn) !important;
  font-weight: 600 !important;
  padding: 7px 18px !important;
  border-radius: 6px !important;
  line-height: 1.1 !important;
  min-height: 0 !important;
}
html body .elementor-location-header [data-id="hdr_cta"] .elementor-button .elementor-button-text {
  font-size: var(--fs-hdr-btn) !important;
  font-weight: 600 !important;
}

/* =====================================================================
   FOOTER · ESCALA ÚNICA (consolida 24/16/14 → var(--fs-footer)=20px)
   Peso regular, line-height cómodo. Col1 deja de ser Futura Bold y de tener
   lh 20px sobre glyphs de 24px (la causa del "sobredimensionado y apretado").
   ===================================================================== */
html body .elementor-location-footer [data-id="ftr_nav1"] .elementor-nav-menu .elementor-item,
html body .elementor-location-footer [data-id="ftr_nav1"] .elementor-nav-menu--main .elementor-item,
html body .elementor-location-footer [data-id="ftr_services_list"] .elementor-icon-list-text,
html body .elementor-location-footer [data-id="ftr_addr"] .elementor-icon-list-text,
html body .elementor-location-footer [data-id="ftr_addr"] .elementor-icon-list-item a,
html body .elementor-location-footer [data-id="ftr_addr"] a,
html body .elementor-location-footer .elementor-icon-list-text,
html body .elementor-location-footer .elementor-nav-menu .elementor-item,
html body .elementor-location-footer [data-id="ftr_col1"] p,
html body .elementor-location-footer [data-id="ftr_col2"] p,
html body .elementor-location-footer [data-id="ftr_col3"] p,
html body .elementor-location-footer [data-id="ftr_col4"] p,
html body .elementor-location-footer p {
  /* la dirección (street) ya estaba en --fs-footer vía .elementor-icon-list-text;
     el TELÉFONO es un <a> tel: cuyo texto NO va en .elementor-icon-list-text → caía
     a 16px heredado. Lo subimos al token único del footer (20). */
  font-size: var(--fs-footer) !important;
  line-height: 1.5 !important;
}
html body .elementor-location-footer [data-id="ftr_follow"] .elementor-heading-title,
html body .elementor-location-footer [data-id="ftr_follow"] {
  font-size: var(--fs-footer) !important;
  line-height: 1.5 !important;
}
/* Col1 (Inicio/Servicios/Quiénes Somos): cut MEDIO (no Bold), peso regular.
   "Servicios" se mantiene verde (regla previa #ftr_nav1 nth-child(2)).
   La regla [R1 fonts] (línea ~190) pinea 'Futura Bold' con element-class
   (.elementor-element.elementor-element-ftr_nav1, 0,4,2 !important): igualamos
   esa specificity con el mismo selector para soltar el cut Bold. */
html body .elementor-6 .elementor-element.elementor-element-ftr_nav1 .elementor-nav-menu--main a.elementor-item,
html body .elementor-6 .elementor-element.elementor-element-ftr_nav1 .elementor-nav-menu a.elementor-item,
html body .elementor-location-footer [data-id="ftr_nav1"] .elementor-nav-menu .elementor-item,
html body .elementor-location-footer [data-id="ftr_nav1"] .elementor-nav-menu--main .elementor-item {
  font-family: var(--ayc-font-body);
  font-weight: 400 !important;
}
/* Con la escala única en 20px, "AYC Accountants" y el teléfono ya no necesitan
   columnas tan anchas; el nowrap previo a 24px se mantiene inofensivo. El
   disclaimer legal conserva su token --fs-legal (regla previa). */

/* =====================================================================
   RONDA AUDITOR CHROME — 2026-06-18 (RESPIRO + ESCALA vs PDF, ÚLTIMO BLOQUE)
   Gaps medidos a 1440 (auditor): el chrome estaba demasiado chico/apretado.
   · Nav del header 17→24 (--fs-nav). Cap-height PDF 17.4px → 24px.
   · Teléfono header 18→22 (--fs-nav-phone), mismo tier que el nav.
   · Botón "Contacto" 15→22 (--fs-hdr-btn) con padding generoso (pill ~112w).
   · Logo del header 50→66h (≈218w) — el widget no tenía regla de tamaño aquí.
   · Cluster del nav reubicado al CENTRO-DERECHA (arranca ~780 en el PDF, no
     ~459): se right-biasea la <ul> dentro del track logo↔teléfono.
   · Footer: escala única 20→24 (--fs-footer, en bloque previo) — ambas
     columnas de links AHORA iguales (col2 servicios ya no es la más chica).
   · Disclaimer 14→16 (--fs-footer-legal) y CENTRADO (era left), márgenes
     laterales simétricos como el PDF.
   Todo por token (ayc-base.css) — sin literales por página.
   ===================================================================== */

/* ---- HEADER · LOGO: ~66px alto × ~218px ancho (PDF). El widget hdr_logo
   no tenía regla de tamaño en este archivo → quedaba en su 160×50 default.
   Fijamos alto 66 y ancho auto (≈218, proporción del PNG recurso-20). ---- */
html body .elementor-location-header [data-id="hdr_logo"] img,
html body .elementor-5 .elementor-element[data-id="hdr_logo"] img {
  height: 66px !important;
  width: auto !important;
  max-width: none !important;
}

/* ---- HEADER · NAV: tamaño por token (24px). Re-asegura --fs-nav venciendo
   a las reglas previas que lo fijaban a 17px (líneas ~242, ~565). ---- */
html body .elementor-location-header [data-id="hdr_nav"] .elementor-nav-menu .elementor-item,
html body .elementor-location-header [data-id="hdr_nav"] .elementor-nav-menu--main a.elementor-item,
html body .elementor-location-header .elementor-nav-menu .elementor-item {
  font-size: var(--fs-nav) !important;
}

/* ---- HEADER · NAV CLUSTER al CENTRO-DERECHA (arranca ~780 @1440, PDF).
   El track del nav es hdr_nav (220→1050); antes la <ul> se centraba (justify
   center → arranca ~459). El PDF coloca el cluster pegado a la derecha del
   track, cerca del teléfono/CTA. Right-biaseamos la <ul> (flex-end) con un
   pequeño respiro a la derecha para que no toque el teléfono. ---- */
html body .elementor-location-header [data-id="hdr_nav"],
html body .elementor-location-header [data-id="hdr_nav"] > .e-con-inner {
  justify-content: flex-end !important;
}
html body .elementor-location-header [data-id="hdr_nav"] .elementor-nav-menu__container,
html body .elementor-location-header [data-id="hdr_nav"] .elementor-nav-menu--main {
  justify-content: flex-end !important;
  padding-right: 0 !important;
}

/* ---- HEADER · TELÉFONO: 22px por token (acompaña al nav 24). ---- */
html body .elementor-location-header [data-id="hdr_right"] .elementor-icon-list-text,
html body .elementor-location-header [data-id="hdr_right"] a,
html body .elementor-location-header [data-id="hdr_right"] span,
html body .elementor-location-header [data-id="hdr_phone"] .elementor-icon-list-text {
  font-size: var(--fs-nav-phone) !important;
}

/* ---- HEADER · BOTÓN "Contacto": 22px por token + padding generoso (pill
   ~112w × ~34h). Cliente: "botones muy chicos". Último bloque → gana a la
   regla de 7px/18px (línea ~520) y a la de var(--fs-button) (línea ~452). ---- */
html body .elementor-location-header [data-id="hdr_right"] a.elementor-button,
html body .elementor-location-header [data-id="hdr_cta"] .elementor-button,
html body .elementor-location-header .elementor-button {
  font-size: var(--fs-hdr-btn) !important;
  padding: 8px 24px !important;
  border-radius: 8px !important;
  line-height: 1.15 !important;
}
html body .elementor-location-header [data-id="hdr_cta"] .elementor-button .elementor-button-text,
html body .elementor-location-header .elementor-button .elementor-button-text {
  font-size: var(--fs-hdr-btn) !important;
}

/* ---- FOOTER · DISCLAIMER: 15px por token + CENTRADO con márgenes simétricos
   (PDF). Antes 14px left-aligned. La frase en Myriad @15px (nowrap, requisito
   1 línea del diseño) mide ~1402px → el track del ftr_bottom debe darle ese
   ancho; reducimos el padding lateral del inner de 56→18px (margen simétrico)
   para que entre en 1 línea SIN desbordar los 1440 del viewport. Centrado real:
   justify-content:center + text-align:center + margin auto. ---- */
html body .elementor-location-footer [data-id="ftr_bottom"],
html body .elementor-location-footer [data-id="ftr_bottom"] > .e-con-inner {
  align-items: flex-start !important;
  justify-content: flex-start !important;
  text-align: left !important;
}
html body .elementor-location-footer [data-id="ftr_bottom"] > .e-con-inner {
  /* Alinea el margen izquierdo del bottom-bar con las columnas del footer
     (ftr_inner empieza en ~56px): el .e-con de ftr_bottom arranca en x=20,
     +36px de padding → el disclaimer left-aligned cae a ~56px como el PDF. */
  padding-left: 36px !important; padding-right: 18px !important;
}
html body .elementor-location-footer [data-id="ftr_disclaimer"] {
  width: 100% !important; max-width: none !important;
}
/* PDF p1: el disclaimer del footer va ALINEADO A LA IZQUIERDA en el margen
   izquierdo del footer (1 línea). Antes centrado; lo anclamos a la izquierda
   (text-align:left + margin-left:0) sin tocar tamaño/color/1-línea. */
html body .elementor-location-footer [data-id="ftr_disclaimer"],
html body .elementor-location-footer [data-id="ftr_disclaimer"] p {
  text-align: left !important;
  margin-left: 0 !important;
  margin-right: auto !important;
  font-size: var(--fs-footer-legal) !important;
}
html body .elementor-location-footer [data-id="ftr_disclaimer"] p {
  width: 100% !important;
}

/* =====================================================================
   RONDA ALTURA FOOTER — 2026-06-23 (BLOQUE AUTORITATIVO; "saltos muy altos")
   El auditor (escala PDF→live 1.34×, logo 198px/148px) midió el footer ~87px
   demasiado alto: banda blanca diseño = 295.5px live, live = 382.1px. El exceso
   vive en TRES huecos verticales; el row-pitch de columnas YA está bien a 30px
   y NO se toca. Reparto (medido @1920, objetivo ftr_main h 382.1 → ~296):
   · Top (footer-top→logo-top): 66 → 44  (ftr_main pt 56→34; col1 inner pt 10 intacto).
   · Hueco bloque-columnas→disclaimer: 98 → ~50  (flex-gap 20→0; ftr_bottom pt 8→0;
     ftr_bottom .e-con-inner pt 20→0).
   · Bottom (disclaimer-bottom→fin): 52 → ~44  (ftr_main pb 28→20).
   · Disclaimer legal: 14→12px + lh ceñido (banda más fina; token --fs-footer-legal).
   ÚLTIMO bloque de spacing del footer → gana a 312/313/314 y a 564/795 previas.
   NO toca: font 20px de columnas, lh 1.5 (pitch 30px), márgenes laterales 1616/152. */
html body .elementor-location-footer [data-id="ftr_main"] {
  /* [2026-06-23 corregido] Top-padding al valor del DISEÑO: white-top→logo-top =
     59px @PDF / 1.34 = 44px live. El padding efectivo era 66px (ftr_main pt 56 +
     col1 inner pt 10) → top-heavy ("muy alto" arriba). Bajamos ftr_main pt a 34
     → 34+10 = 44px = diseño. (Una ronda del auditor lo había subido a 56 leyendo
     mal 101px@PDF→76; la medición limpia del PDF da 59→44.) */
  padding-top: 34px !important;
  padding-bottom: 20px !important;
  gap: 0 !important;
  row-gap: 0 !important;
}
/* [2026-06-23 auditor — "saltos muy altos"] El hueco-banda sobre el disclaimer
   NO es line-height: es la COLA del .e-con-inner de ftr_inner. Elementor le
   pone padding-bottom:40px (ajuste de widget) → el bloque de columnas NO hace
   shrink-wrap y deja ~97px hasta el disclaimer (objetivo ~84 medido desde texto).
   Lo ceñimos a 27px → el disclaimer sube ~13px y el logo sigue despejado. NO se
   toca el line-height de las columnas (pitch 30px se mantiene). */
html body .elementor-location-footer [data-id="ftr_inner"] > .e-con-inner {
  padding-bottom: 27px !important;
}
html body .elementor-location-footer [data-id="ftr_bottom"] {
  padding-top: 0 !important;
  padding-bottom: 24px !important;
}
html body .elementor-location-footer [data-id="ftr_bottom"] > .e-con-inner {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
/* Disclaimer legal: 12px (PDF ink 17/1.34 ≈ 12.7) + line-height ceñido → banda fina. */
html body .elementor-location-footer [data-id="ftr_disclaimer"] p,
html body .elementor-location-footer [data-id="ftr_disclaimer"] {
  font-size: var(--fs-footer-legal) !important;
  line-height: 1.2 !important;
}

/* =====================================================================
   CHROME RESPONSIVE — AUTOSUFICIENTE (2026-06-21)
   =====================================================================
   El header/footer responsive vive AQUÍ porque header-footer.css SIEMPRE
   carga (responsive.css/overrides.css se DEQUEUEAN en páginas nativas, así
   que su drawer NO está disponible en Home/Servicios/etc.). Este bloque:
   - DESKTOP (≥1025px): NO aplica nada (todo dentro de @media) → byte-idéntico.
   - TABLET (≤1024px): el nav de 4 items + teléfono + Contacto NO cabe →
     colapsa a MENÚ HAMBURGUESA (☰) que despliega un panel vertical con los
     4 items + teléfono + Contacto. Logo y botón Contacto siguen accesibles.
     Cero overflow horizontal.
   - MÓVIL (≤767px): el footer apila sus columnas a 1, centradas, con el
     logo arriba y el disclaimer legible. Cero overflow.
   El toggle lo gobierna `body.ayc-menu-open` (delegación en animations.js);
   el botón .ayc-hamburger lo crea animations.js dentro de hdr_right.
   ===================================================================== */

/* ---------------------------------------------------------------------
   HEADER — TABLET + MÓVIL (≤1024px): hamburguesa + drawer
   --------------------------------------------------------------------- */
@media (max-width: 1024px) {

  /* El header no debe crecer ni desbordar; permite que su contenido encoja. */
  html body .elementor-location-header [data-id="hdr_sec1"],
  html body .elementor-location-header [data-id="hdr_sec1"] > .e-con-inner {
    flex-wrap: nowrap !important;
    column-gap: 12px !important;
  }
  html body .elementor-location-header [data-id="hdr_logo"] { flex: 0 1 auto !important; min-width: 0 !important; }
  /* Specificity ≥ la regla desktop (0,4,1 con .elementor-5 .elementor-element[data-id]). */
  html body .elementor-location-header [data-id="hdr_logo"] img,
  html body .elementor-5 .elementor-element[data-id="hdr_logo"] img {
    height: 48px !important;            /* logo más compacto en tablet */
    width: auto !important;
    max-width: 46vw !important;         /* nunca acapara el ancho; deja sitio a tel/CTA/☰ */
  }
  /* hdr_right (teléfono + Contacto + hamburguesa) puede encoger sin desbordar */
  html body .elementor-location-header [data-id="hdr_right"],
  html body .elementor-location-header [data-id="hdr_right"] > .e-con-inner {
    flex: 0 1 auto !important;
    min-width: 0 !important;
    flex-wrap: nowrap !important;
    justify-content: flex-end !important;
    align-items: center !important;
    column-gap: 10px !important;
  }

  /* OCULTAR el nav horizontal de Elementor (specificity alta para batir el
     flex inline del widget). Los items viven ahora en el drawer. */
  html body .elementor-5 .elementor-element.elementor-element-hdr_nav nav.elementor-nav-menu--main,
  html body .elementor-location-header [data-id="hdr_nav"] nav.elementor-nav-menu--main,
  html body .elementor-location-header .elementor-element-hdr_nav nav.elementor-nav-menu--main {
    display: none !important;
  }
  /* El widget nav en sí no debe ocupar ancho */
  html body .elementor-location-header [data-id="hdr_nav"] {
    flex: 0 0 0 !important;
    width: 0 !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  /* Ocultar el toggle nativo de Elementor (usamos .ayc-hamburger custom, único) */
  html body .elementor-location-header [data-id="hdr_nav"] .elementor-menu-toggle {
    display: none !important;
  }

  /* ---- BOTÓN HAMBURGUESA (☰) — visible, vence el display:none inline del JS ---- */
  html body .ayc-hamburger {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-around !important;
    align-items: stretch !important;
    width: 42px !important;
    min-width: 42px !important;
    height: 38px !important;
    padding: 8px 7px !important;
    background: transparent !important;
    border: 2px solid #1e2751 !important;
    border-radius: 6px !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
    box-sizing: border-box !important;
    order: 9 !important;                 /* hamburguesa al final (logo … | tel | Contacto | ☰) */
  }
  html body .ayc-hamburger > span {
    display: block !important;
    width: 100% !important;
    height: 2px !important;
    background: #1e2751 !important;
    border-radius: 2px !important;
    transition: transform .25s ease, opacity .25s ease !important;
    flex-shrink: 0 !important;
  }
  /* ☰ → X cuando el drawer está abierto */
  html body.ayc-menu-open .ayc-hamburger > span:nth-child(1) { transform: translateY(8px) rotate(45deg) !important; }
  html body.ayc-menu-open .ayc-hamburger > span:nth-child(2) { opacity: 0 !important; }
  html body.ayc-menu-open .ayc-hamburger > span:nth-child(3) { transform: translateY(-8px) rotate(-45deg) !important; }

  /* ---- DRAWER (panel vertical) — el dropdown del widget nav ---- */
  html body .elementor-5 .elementor-element.elementor-element-hdr_nav nav.elementor-nav-menu--dropdown,
  html body .elementor-location-header [data-id="hdr_nav"] nav.elementor-nav-menu--dropdown,
  html body .elementor-location-header .elementor-element-hdr_nav nav.elementor-nav-menu--dropdown {
    position: fixed !important;
    top: 70px !important;                /* bajo el header; se ajusta abajo para 767 */
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 8px 0 14px !important;
    background: #ffffff !important;
    border-top: 3px solid #9dc41a !important;
    box-shadow: 0 8px 24px rgba(0,0,0,.14) !important;
    z-index: 9997 !important;
    max-height: calc(100vh - 70px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    /* oculto por defecto; se revela con body.ayc-menu-open */
    display: block !important;
    transform: translateY(-115%) !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: transform .3s ease, opacity .25s ease, visibility .25s ease !important;
  }
  html body.ayc-menu-open .elementor-5 .elementor-element.elementor-element-hdr_nav nav.elementor-nav-menu--dropdown,
  html body.ayc-menu-open .elementor-location-header [data-id="hdr_nav"] nav.elementor-nav-menu--dropdown,
  html body.ayc-menu-open .elementor-location-header .elementor-element-hdr_nav nav.elementor-nav-menu--dropdown {
    transform: translateY(0) !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
  /* Listas/items del drawer → VERTICAL (el ul del dropdown viene display:flex
     row de SmartMenus → lo forzamos a columna a ancho completo). */
  html body .elementor-location-header [data-id="hdr_nav"] .elementor-nav-menu--dropdown ul {
    display: block !important;
    flex-direction: column !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    background: transparent !important;
  }
  html body .elementor-location-header [data-id="hdr_nav"] .elementor-nav-menu--dropdown li {
    display: block !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    background: transparent !important;
    float: none !important;
  }
  html body .elementor-location-header [data-id="hdr_nav"] .elementor-nav-menu--dropdown a.elementor-item {
    display: block !important;
    width: 100% !important;
    color: #1e2751 !important;
    background: transparent !important;
    padding: 14px 24px !important;
    font-family: var(--ayc-font-body) !important;
    font-weight: 500 !important;
    font-size: var(--fs-nav) !important;
    line-height: 1.3 !important;
    border-bottom: 1px solid rgba(30,39,81,.08) !important;
    white-space: normal !important;
    text-align: left !important;
  }
  html body .elementor-location-header [data-id="hdr_nav"] .elementor-nav-menu--dropdown a.elementor-item:hover,
  html body .elementor-location-header [data-id="hdr_nav"] .elementor-nav-menu--dropdown a.elementor-item.elementor-item-active,
  html body .elementor-location-header [data-id="hdr_nav"] .elementor-nav-menu--dropdown a.elementor-item.is-current {
    background: rgba(157,196,26,.10) !important;
    color: #7EA615 !important;
  }
  /* Sub-items (Servicios) sangrados */
  html body .elementor-location-header [data-id="hdr_nav"] .elementor-nav-menu--dropdown .sub-menu a {
    padding-left: 44px !important;
    font-size: var(--fs-small) !important;
    color: var(--ayc-chrome-gray) !important;
  }
  /* Teléfono + Contacto inyectados en el drawer (ayc-drawer-extra) */
  html body .elementor-location-header [data-id="hdr_nav"] .elementor-nav-menu--dropdown .ayc-drawer-extra a.elementor-item {
    font-weight: 600 !important;
  }
  html body .elementor-location-header [data-id="hdr_nav"] .elementor-nav-menu--dropdown .ayc-drawer-cta a.elementor-item {
    margin: 12px 20px 4px !important;
    width: auto !important;
    text-align: center !important;
    background: #9dc41a !important;
    color: #ffffff !important;
    border-radius: 6px !important;
    border-bottom: 0 !important;
    padding: 12px 24px !important;
  }
  html body .elementor-location-header [data-id="hdr_nav"] .elementor-nav-menu--dropdown .ayc-drawer-cta a.elementor-item:hover {
    background: #7EA615 !important;
    color: #ffffff !important;
  }

  /* Overlay sutil bajo el drawer (no captura clicks; el cierre lo hace el JS) */
  html body.ayc-menu-open::after {
    content: "" !important;
    position: fixed !important;
    left: 0; right: 0; bottom: 0;
    top: 70px !important;
    background: rgba(15,23,42,.35) !important;
    z-index: 9996 !important;
    pointer-events: none !important;
  }

  /* ---- FOOTER (tablet ≤1024) — el disclaimer NO debe forzar 1 línea ----
     En desktop el disclaimer va nowrap (frase en 1 línea ~1313px). En tablet
     (768-1024) esa línea desborda el viewport → la quitamos para que ENVUELVA.
     (En ≤767 ya se desactiva el nowrap en su propio bloque; aquí cubrimos el
     hueco de tablet). Sin esto, ftr_disclaimer fuerza el documento a ~1410px. */
  html body .elementor-location-footer [data-id="ftr_disclaimer"],
  html body .elementor-location-footer [data-id="ftr_disclaimer"] p,
  html body .elementor-location-footer [data-id="ftr_disclaimer"] p span {
    white-space: normal !important;
    max-width: 100% !important;
  }
  html body .elementor-location-footer [data-id="ftr_bottom"],
  html body .elementor-location-footer [data-id="ftr_bottom"] > .e-con-inner {
    overflow-x: hidden !important;
  }
  /* La fila de columnas del footer en tablet: padding lateral más corto y
     permiso de ENVOLVER → las 4 columnas (logo / nav / dirección / social)
     pasan a 2×2 sin desbordar (a 820 la fila pedía ~815px). El flex real vive
     en el .e-con-inner de ftr_inner (no en ftr_inner). */
  html body .elementor-location-footer [data-id="ftr_inner"],
  html body .elementor-location-footer [data-id="ftr_inner"] > .e-con-inner {
    flex-wrap: wrap !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
    column-gap: 32px !important;
    row-gap: 28px !important;
    justify-content: center !important;
  }
  /* Cada columna fluye con base flexible y nunca por debajo de su contenido. */
  html body .elementor-location-footer [data-id="ftr_inner"] > .e-con-inner > .e-con {
    flex: 0 1 auto !important;
    min-width: 0 !important;
  }
}

/* ---------------------------------------------------------------------
   HEADER — MÓVIL (≤767px): oculta el teléfono largo del bar (vive en el
   drawer); el botón Contacto del bar permanece accesible.
   --------------------------------------------------------------------- */
@media (max-width: 767px) {
  /* En móvil el bar queda LIMPIO: solo LOGO + HAMBURGUESA. El teléfono y el
     botón Contacto NO se pierden — viven dentro del drawer (ayc-drawer-extra).
     Así se evita el apelmazamiento logo↔Contacto↔☰ en anchos de ~360px. */
  html body .elementor-location-header [data-id="hdr_phone"],
  html body .elementor-location-header [data-id="hdr_cta"] {
    display: none !important;
  }
  html body .elementor-location-header [data-id="hdr_logo"] img,
  html body .elementor-5 .elementor-element[data-id="hdr_logo"] img {
    height: 44px !important;
    width: auto !important;
    max-width: 62vw !important;         /* con el bar despejado el logo puede respirar */
  }
  /* El drawer arranca un poco más arriba si el header es más bajo en móvil */
  html body .elementor-location-header [data-id="hdr_nav"] nav.elementor-nav-menu--dropdown {
    top: 64px !important;
    max-height: calc(100vh - 64px) !important;
  }
  html body.ayc-menu-open::after { top: 64px !important; }
}

/* ---------------------------------------------------------------------
   FOOTER — MÓVIL (≤767px): apila las 4 columnas a 1, centradas; logo
   arriba; disclaimer legible. Cero overflow.
   --------------------------------------------------------------------- */
@media (max-width: 767px) {
  /* Contenedor de columnas → una sola columna, centrado, sin padding lateral
     grande que provoque overflow. */
  html body .elementor-location-footer [data-id="ftr_inner"] {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  html body .elementor-location-footer [data-id="ftr_inner"],
  html body .elementor-location-footer [data-id="ftr_inner"] > .e-con-inner {
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 30px !important;
    max-width: 100% !important;
    width: 100% !important;
  }
  /* Cada columna a ancho completo, contenido centrado */
  html body .elementor-location-footer [data-id="ftr_col1"],
  html body .elementor-location-footer [data-id="ftr_col2"],
  html body .elementor-location-footer [data-id="ftr_col3"],
  html body .elementor-location-footer [data-id="ftr_col4"] {
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: 100% !important;
    align-items: center !important;
    text-align: center !important;
  }
  /* col1: logo ARRIBA y la columna de nav debajo (no lado a lado) */
  html body .elementor-location-footer [data-id="ftr_col1"] > .e-con-inner,
  html body .elementor-location-footer [data-id="ftr_col1"].e-con > .e-con-inner {
    flex-direction: column !important;
    align-items: center !important;
    gap: 22px !important;
    flex-wrap: nowrap !important;
  }

  /* El widget nav del footer (ftr_nav1) colapsa a su PROPIA hamburguesa de
     Elementor en móvil (.elementor-menu-toggle) y oculta sus 3 enlaces. En el
     FOOTER no queremos un menú colapsado: mostramos los 3 items como lista
     vertical centrada y OCULTAMOS ese toggle (nada de info detrás de un toggle). */
  html body .elementor-location-footer [data-id="ftr_nav1"] .elementor-menu-toggle {
    display: none !important;
  }
  html body .elementor-location-footer [data-id="ftr_nav1"] nav.elementor-nav-menu--main {
    display: block !important;
    width: 100% !important;
  }
  html body .elementor-location-footer [data-id="ftr_nav1"] nav.elementor-nav-menu--main ul.elementor-nav-menu {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 4px !important;
  }
  html body .elementor-location-footer [data-id="ftr_nav1"] nav.elementor-nav-menu--main ul.elementor-nav-menu .elementor-item {
    justify-content: center !important;
    text-align: center !important;
  }
  html body .elementor-location-footer [data-id="ftr_logo"] {
    flex: 0 0 auto !important;
    width: auto !important;
    margin: 0 auto !important;
  }
  html body .elementor-location-footer [data-id="ftr_logo"] img {
    width: 160px !important;
    margin: 0 auto !important;
  }
  /* Centrar listas/menús/encabezados de cada columna */
  html body .elementor-location-footer [data-id="ftr_nav1"],
  html body .elementor-location-footer [data-id="ftr_services_list"],
  html body .elementor-location-footer [data-id="ftr_addr"],
  html body .elementor-location-footer [data-id="ftr_follow"],
  html body .elementor-location-footer [data-id="ftr_social"] {
    width: 100% !important;
    text-align: center !important;
  }
  html body .elementor-location-footer [data-id="ftr_inner"] .elementor-nav-menu,
  html body .elementor-location-footer [data-id="ftr_inner"] .elementor-icon-list-items {
    align-items: center !important;
    justify-content: center !important;
  }
  html body .elementor-location-footer [data-id="ftr_inner"] .elementor-nav-menu .elementor-item,
  html body .elementor-location-footer [data-id="ftr_inner"] .elementor-icon-list-item {
    justify-content: center !important;
    text-align: center !important;
  }
  /* La dirección y los iconos centrados */
  html body .elementor-location-footer [data-id="ftr_addr"] .elementor-icon-list-item {
    justify-content: center !important;
  }
  html body .elementor-location-footer [data-id="ftr_social"] .elementor-social-icons-wrapper {
    justify-content: center !important;
  }
  /* Disclaimer: centrado, ancho completo, SIN nowrap (debe envolver, no
     desbordar) y un pelín más grande para legibilidad. */
  html body .elementor-location-footer [data-id="ftr_bottom"],
  html body .elementor-location-footer [data-id="ftr_bottom"] > .e-con-inner {
    padding-left: 20px !important;
    padding-right: 20px !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
  }
  html body .elementor-location-footer [data-id="ftr_disclaimer"],
  html body .elementor-location-footer [data-id="ftr_disclaimer"] p {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    white-space: normal !important;       /* deja envolver: nada de 1-línea forzada en móvil */
    width: 100% !important;
    max-width: 100% !important;
    font-size: var(--fs-footer-legal) !important;
  }
}

/* ============================================================
   FAB WhatsApp flotante (móvil/tablet). El JS (animations.js initWhatsAppFab)
   inyecta #ayc-fab-whatsapp; su tamaño vivía SOLO en responsive.css, que se
   DEQUEA en páginas nativas (functions.php p.100000) → el FAB quedaba sin
   tamaño y el SVG se expandía a ~375×375 (bug). header-footer.css SIEMPRE
   carga (chrome, no se dequea) → aquí el FAB queda 56×56 en TODA página.
   ============================================================ */
@media (max-width: 1024px) {
  #ayc-fab-whatsapp {
    position: fixed;
    right: 16px;
    bottom: 18px;
    z-index: 9990;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: #25D366;
    box-shadow: 0 6px 18px rgba(37, 211, 102, 0.45),
                0 2px 8px rgba(0, 0, 0, 0.18);
    display: flex !important;
    align-items: center;
    justify-content: center;
    text-decoration: none !important;
    color: #ffffff !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    animation: aycFabPulse 2.4s ease-in-out infinite;
  }
  #ayc-fab-whatsapp svg {
    width: 30px;
    height: 30px;
    fill: #ffffff;
  }
  #ayc-fab-whatsapp:active { transform: scale(0.92); animation: none; }
  #ayc-fab-whatsapp::after {
    content: "";
    position: absolute;
    inset: -6px;
    border-radius: 50%;
    border: 2px solid rgba(37, 211, 102, 0.55);
    opacity: 0;
    animation: aycFabRing 2.4s ease-out infinite;
    pointer-events: none;
  }
  @keyframes aycFabPulse {
    0%, 100% { box-shadow: 0 6px 18px rgba(37, 211, 102, 0.45), 0 2px 8px rgba(0, 0, 0, 0.18); }
    50%      { box-shadow: 0 8px 28px rgba(37, 211, 102, 0.75), 0 2px 12px rgba(0, 0, 0, 0.22); }
  }
  @keyframes aycFabRing {
    0%   { opacity: 0.7; transform: scale(1); }
    80%  { opacity: 0;   transform: scale(1.45); }
    100% { opacity: 0;   transform: scale(1.45); }
  }
  body.ayc-menu-open #ayc-fab-whatsapp { opacity: 0; pointer-events: none; transform: scale(0.8); }
}

/* ============================================================
   Selector de idioma (Polylang): RETIRADO del header (2026-06-23, pedido
   cliente). Polylang queda instalado/activo y el sitio listo para multiidioma,
   pero SIN selector visible (se quitó el ítem de menú #pll_switcher y el CSS de
   compactación de banderas). Cuando se implemente EN, se vuelve a añadir el
   selector + el hreflang del mu-plugin.
   ============================================================ */

/* ============================================================
   RONDA AUDITOR FOOTER + ESTADO ACTIVO (vs HOME-AYC.pdf) — 2026-06-23
   Cliente: "el footer no me cuadra, está en el aire / espacios-dimensiones" +
   "el active de la página seleccionada está mal".
   Medido en el PDF (footer @1920px): contenido x=152..1768 → MÁRGENES laterales
   de 152px (=7.9%) y gaps entre columnas equilibrados (~150px). En vivo el
   contenido arrancaba a 56px → en pantallas anchas (1920) los márgenes eran 56
   y los gaps se inflaban a ~217px: footer "estirado / en el aire".
   ============================================================ */

/* [FOOTER · márgenes laterales = PDF] Cap del ancho de contenido a 1616px
   (= 1768−152 del diseño) CENTRADO. Como ftr_inner y ftr_bottom son e-con-boxed
   con su padding (56 y 20), centrar un inner de 1616 los lleva a x=152..1768
   EXACTO del PDF @1920 (márgenes 152, gaps ~153 → equilibrado). En anchos <1768
   usa el espacio disponible (max-width sólo encoge → 0 riesgo de overflow); en
   ultra-wide queda centrado, no se estira. Aplica a las columnas Y al disclaimer
   para que ambos compartan el mismo margen (quedan alineados). */
html body .elementor-location-footer [data-id="ftr_inner"] > .e-con-inner,
html body .elementor-location-footer [data-id="ftr_bottom"] > .e-con-inner {
  max-width: 1616px !important;
  margin-inline: auto !important;
}
/* ftr_bottom trae su padding lateral propio (20px) ≠ los 56px de ftr_inner →
   igualamos a 56px para que el disclaimer comparta el mismo borde que las
   columnas en TODO ancho (a <1768 ambos quedan a 56; a 1920 ambos centran a 152
   por el cap de 1616). Anulamos también el padding del e-con-inner y el offset
   propio (36px) del widget disclaimer, así su borde izq = logo/columnas. */
html body .elementor-location-footer [data-id="ftr_bottom"] {
  padding-left: 56px !important; padding-right: 56px !important;
}
html body .elementor-location-footer [data-id="ftr_bottom"] > .e-con-inner {
  padding-left: 0 !important; padding-right: 0 !important;
}
html body .elementor-location-footer [data-id="ftr_disclaimer"],
html body .elementor-location-footer [data-id="ftr_disclaimer"] > .elementor-widget-container {
  margin-left: 0 !important; padding-left: 0 !important;
}

/* ===== HEADER · ESTADO ACTIVO / PÁGINA SELECCIONADA (vs PDF) ===== */
/* [A] El "pointer" subrayado de Elementor venía AZUL (#0075a9) por defecto en
   los items NO activos (se veía al hover en Quiénes Somos / Preguntas Frecuentes).
   El subrayado de marca es VERDE en TODOS los items (sólo el activo se ve fijo;
   los demás aparecen verde al hover). */
html body .elementor-location-header .elementor-nav-menu .elementor-item::after {
  background-color: #9dc41a !important;
  border-color: #9dc41a !important;
  bottom: -6px !important; /* 2026-06-24 PDF AJUSTES H1b: bajar la "rayita" de cada categoría (antes pegada al texto) */
}
/* [B] Páginas de servicio (Ayuda Center / AYC Advisors / AYC Accountants): el
   <li> "Servicios" recibe current-menu-ancestor/parent, pero su subrayado seguía
   en opacity:0 (Elementor sólo lo muestra en .elementor-item-active y :hover) →
   NINGÚN item aparecía marcado. Lo mostramos → "Servicios" queda subrayado verde
   indicando la SECCIÓN actual (página seleccionada). */
html body .elementor-location-header .elementor-nav-menu .menu-item.current-menu-ancestor > a.elementor-item::after,
html body .elementor-location-header .elementor-nav-menu .menu-item.current-menu-parent > a.elementor-item::after {
  opacity: 1 !important;
}
/* [C] /servicios/ (page-id-27): el item "Servicios" es enlace custom href="#"
   (disparador del dropdown) → nunca recibe clase current. Lo marcamos por la
   clase de body de esa página → subrayado verde en "Servicios". */
body.page-id-27 .elementor-location-header .elementor-nav-menu .menu-item-8 > a.elementor-item::after {
  opacity: 1 !important;
}

/* ============================================================================
   [LOGO 2026-09-08] Hueco sin cubrir entre 1025px y 1400px.
   El bloque desktop (L736) fija el logo en 66px de alto -> 213px de ancho con
   max-width:none, y el bloque responsive solo entra a <=1024px. En medio, el
   logo desborda su caja de 160px e invade el menu: a 1345px (pantalla del
   cliente) tapaba "Inicio" con +41px de solape.
   Se replica aqui el tratamiento del breakpoint movil. Misma especificidad
   que la regla desktop, y va despues -> gana por orden.
   ========================================================================= */
@media (min-width: 1025px) and (max-width: 1400px) {
  html body .elementor-location-header [data-id="hdr_logo"] img,
  html body .elementor-5 .elementor-element[data-id="hdr_logo"] img {
    height: 48px !important;
    width: auto !important;
    max-width: 100% !important;
  }
  html body .elementor-location-header [data-id="hdr_logo"] {
    flex: 0 1 auto !important;
    min-width: 0 !important;
    padding-right: 10px !important;
  }
}

/* [LOGO 2026-09-08 · cont.] Entre 1025 y 1200px el menu horizontal y el
   hamburguesa conviven, y ni reduciendo el logo caben los 5 items + telefono
   + CTA. Elementor oculta el nav solo por debajo de 1025px; subimos ese
   umbral a 1200px para que entre antes la version compacta. */
@media (min-width: 1025px) and (max-width: 1360px) {
  html body .elementor-location-header [data-id="hdr_nav"],
  html body .elementor-5 .elementor-element[data-id="hdr_nav"] {
    display: none !important;
  }
  html body .elementor-location-header [data-id="hdr_logo"] img,
  html body .elementor-5 .elementor-element[data-id="hdr_logo"] img {
    height: 52px !important;
  }
}

/* ============================================================================
   [DISCLAIMER 2026-09-08] El aviso legal del footer lleva white-space:nowrap,
   asi que no puede partirse. A partir de 1240px hacia abajo ya no cabe y el
   texto se sale de la pantalla: a 1200px sobresale 11px, a 1100px 111px.
   Por debajo de 1025px si pasa a 2 lineas (regla previa), pero la franja
   1025-1240 quedaba sin cubrir -> mismo hueco de breakpoint que el logo.
   Se permite el salto de linea en ese rango. Encima de 1240 no cambia nada.
   ========================================================================= */
@media (max-width: 1240px) {
  html body .elementor-location-footer [data-id="ftr_disclaimer"],
  html body .elementor-location-footer [data-id="ftr_disclaimer"] p,
  html body [data-id="ftr_disclaimer"] p {
    white-space: normal !important;
    overflow-wrap: anywhere;
  }
}

/* ============================================================================
   [MENU "SERVICIOS" 2026-09-08] Reportado por el cliente: el item aparecia
   desalineado (mas arriba que el resto) y con DOS flechas.
   Medido: el <a> contiene el texto + <span class="sub-arrow"> (chevron SVG que
   inyecta Elementor, display:flex y 87px de ancho) + <span class="ayc-svc-chevron">
   (la flecha verde del tema). El sub-arrow de 87px fuerza el salto de linea:
   el enlace pasa de 20px a 59px de alto y sube 20px respecto a los demas.
   Se oculta la flecha de Elementor y se conserva la del tema, que es la del
   diseño. No se toca ningun otro item del menu.
   ========================================================================= */
html body .elementor-location-header .elementor-nav-menu .sub-arrow,
html body .elementor-location-header .elementor-nav-menu > li > a > .sub-arrow {
  display: none !important;
}
html body .elementor-location-header .elementor-nav-menu > li > a {
  white-space: nowrap !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}
/* La flecha del tema hacia 4px mas alto el enlace de "Servicios" y lo dejaba
   2px por encima de los demas. Se saca del flujo vertical: no aporta altura. */
html body .elementor-location-header .elementor-nav-menu > li > a > .ayc-svc-chevron {
  line-height: 0 !important;
  align-self: center !important;
  height: auto !important;
  font-size: 10px !important;
}

/* ==========================================================================
   Selector de idioma (TranslatePress): solo banderas, al final de la cabecera.
   La activa lleva el subrayado verde del menú; la otra va atenuada.
   El marcado lo pinta ayc_lang_flags_markup() en functions.php, justo después
   del menú (hdr_nav); `order` lo lleva al final de la fila.
   ========================================================================== */
.ayc-lang-flags {
  display: flex;
  align-items: center;
  gap: 8px;
  /* La fila ya separa con 20px y hdr_right tiene 10px de relleno a la derecha:
     -10px deja las banderas a 20px del botón Contacto. */
  margin-left: -10px;
  flex-shrink: 0;
  order: 10;
}
.ayc-lang-flag {
  display: block;
  line-height: 0;
  padding: 5px 0 6px;
  border-bottom: 2px solid transparent;
  opacity: .5;
  filter: saturate(.6);
  transition: opacity .2s ease, filter .2s ease, border-color .2s ease;
}
.ayc-lang-flag img {
  display: block;
  width: 24px;
  height: 18px;
  object-fit: cover;
  border-radius: 3px;
  box-shadow: 0 0 0 1px rgba(30, 39, 81, .18);
}
.ayc-lang-flag:hover,
.ayc-lang-flag:focus-visible {
  opacity: 1;
  filter: none;
}
.ayc-lang-flag:focus-visible {
  outline: 2px solid #9dc41a;
  outline-offset: 3px;
}
.ayc-lang-flag.is-active {
  opacity: 1;
  filter: none;
  border-bottom-color: #9dc41a;
}
/* Entre 1361 y 1499px el menú completo + teléfono + Contacto + banderas no caben
   y el menú se metía bajo el logo: se acorta el aire de cada elemento del menú
   (Elementor le pone 14px por lado). */
@media (min-width: 1361px) and (max-width: 1499px) {
  html body .elementor-location-header [data-id="hdr_nav"] .elementor-nav-menu--main a.elementor-item {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }
}
/* 768–1360px: el menú está oculto y nada en la fila crece, así que el
   space-between de la cabecera repartía el sobrante y despegaba las banderas
   del bloque Contacto. El margen automático de hdr_right los junta a la derecha. */
@media (min-width: 768px) and (max-width: 1360px) {
  html body .elementor-location-header [data-id="hdr_right"] {
    margin-left: auto !important;
    margin-inline-start: auto !important;
  }
}
/* Móvil: las banderas van antes de la hamburguesa (que vive al final de
   hdr_right) para que esta siga en la esquina, y con más área táctil. */
@media (max-width: 767px) {
  .ayc-lang-flags {
    order: 0;
    margin-left: auto;
    gap: 4px;
  }
  .ayc-lang-flag {
    padding: 11px 4px 9px;
  }
}