/*
 * Huamantla Disfruta — capa de fidelidad Beta4.
 *
 * Esta hoja NO redefine el Sistema de Diseño. Su función es impedir que los
 * estilos genéricos de Hello/Elementor alteren las medidas ya cerradas en
 * Demo 2.0 y el Laboratorio Visual.
 */
body { overflow-x: hidden; background: var(--hd-paper, #f2f4f4); }

/*
 * Superficie global del documento. Demo 2.0 trabaja sobre Papel y las tarjetas
 * blancas flotan sobre esa superficie. Hello/Elementor pueden dejar el main
 * en blanco si no se declara aquí, por eso la base se fija una sola vez.
 */
body main#content,
body main.site-main,
body #content.site-main {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  background: var(--hd-paper, #f2f4f4);
}

/*
 * IMPORTANTE: no se neutraliza el padding de la raíz Elementor. Cada plantilla
 * HD ya define su aire superior/inferior y ese espaciado forma parte del diseño
 * aprobado. La versión anterior ponía --padding-bottom:0 y era la causa de que
 * algunas páginas terminaran pegadas al Footer B.
 */
body.elementor-page .elementor > .e-con,
body.elementor-page .elementor > .elementor-element.e-con {
  --gap: 0;
  gap: 0;
}

/* Guardia global: la última raíz de una página HD nunca termina pegada al footer.
 * Se usa padding solo como respaldo; las clases de cada plantilla pueden definir
 * un valor mayor mediante su propia hoja. */
body.elementor-page .elementor > .e-con:last-child,
body.elementor-page .elementor > .elementor-element.e-con:last-child {
  min-height: 1px;
}
/*
 * Inicio v2: el Demo cerrado usa exactamente 1180 px de ancho máximo y 24 px
 * laterales en escritorio (16 px en móvil). Elementor puede inyectar un ancho
 * propio en .e-con; estos selectores de raíz conservan la geometría aprobada.
 */
body.elementor-page .elementor > .e-con.home-shell,
body.elementor-page .elementor > .elementor-element.e-con.home-shell,
.home-v2 .home-shell {
  width: min(100% - 48px, 1180px) !important;
  max-width: 1180px !important;
  margin-inline: auto !important;
}
.home-v2 .observatory-inner {
  width: min(100% - 48px, 1180px) !important;
  max-width: 1180px !important;
  margin-inline: auto !important;
}

/* En el hero claro, Elementor no debe convertir enlaces utilitarios o botones
 * neutrales en el color de acento global. */
.home-v2 .button-primary { color:#fff !important; }
.home-v2 .button-secondary,
.home-v2 .hero-utilities a { color:var(--ink) !important; }

/*
 * Regla cromática protegida: rosa en fondos claros; dorado en fondos oscuros.
 * Blanco para títulos y contenido principal sobre tinta.
 */
.home-v2 .home-fair,
.home-v2 .home-observatory,
.footer-b-preview,
.hd-data-participation,
.data-actions article:first-child {
  --pink: var(--gold);
  --pink-text: var(--gold);
  --pink-text-accessible: var(--gold);
}

.home-v2 .home-fair .microtitle,
.home-v2 .home-observatory .microtitle,
.home-v2 .home-fair .special-links span,
.footer-b-preview :is(.social-card > p, .link-card h2),
.hd-data-participation .hd-data-microtitle,
.data-actions article:first-child .hd-data-microtitle {
  color: var(--gold) !important;
}

.home-v2 .home-fair .special-copy h2,
.home-v2 .home-observatory :is(h2, h3),
.home-v2 .home-fair .special-links strong,
.hd-data-participation h2,
.data-actions article:first-child :is(h2, h3) {
  color: #fff !important;
}

.home-v2 .home-fair .special-copy > p:not(.microtitle),
.home-v2 .home-observatory p:not(.microtitle),
.hd-data-participation .hd-data-section-heading > p:last-child,
.data-actions article:first-child p:not(.hd-data-microtitle) {
  color: rgba(255,255,255,.74) !important;
}

/* El CTA claro de Feria nunca hereda el acento global de Elementor. */
.home-v2 .home-fair .button-light,
.home-v2 .home-fair a.button-light {
  border-color: #fff !important;
  background: #fff !important;
  color: var(--ink) !important;
}
.home-v2 .home-fair .special-links a { color: #fff !important; }
.home-v2 .home-fair .special-links a:hover strong,
.home-v2 .home-fair .special-links a:focus-visible strong { color: var(--gold) !important; }

/* Los globals de Elementor no sustituyen la tipografía cerrada por componente. */
.home-v2 :is(h1,h2,h3),
.hd-cultural-page :is(h1,h2,h3),
.hd-catalog-page :is(h1,h2,h3),
.hd-imported-page :is(h1,h2,h3) {
  font-family: "Montserrat", system-ui, sans-serif !important;
}

/* Foco visible: rosa sobre superficies claras y oro sobre tinta. */
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid var(--hd-pink) !important;
  outline-offset: 3px !important;
}
.footer-b-preview :where(a,button):focus-visible,
.home-v2 .home-fair :where(a,button):focus-visible,
.home-v2 .home-observatory :where(a,button):focus-visible,
.hd-data-participation :where(a,button):focus-visible,
.data-actions article:first-child :where(a,button):focus-visible {
  outline-color: var(--gold) !important;
}

/* Evita animaciones no esenciales cuando el sistema operativo las reduce. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

@media (max-width: 620px) {
  body.elementor-page .elementor > .e-con.home-shell,
  body.elementor-page .elementor > .elementor-element.e-con.home-shell,
  .home-v2 .home-shell,
  .home-v2 .observatory-inner {
    width: calc(100% - 32px) !important;
  }
}

/* Las plantillas especiales Feria/Boletos usan la clase histórica `page-shell`.
 * No se modifica su geometría; únicamente se garantiza el mismo cierre visual
 * antes de Footer B que usa el resto del sistema. */
body.elementor-page .elementor > .e-con.page-shell:last-child,
body.elementor-page .elementor > .elementor-element.e-con.page-shell:last-child {
  padding-bottom: 72px;
}
@media (max-width: 620px) {
  body.elementor-page .elementor > .e-con.page-shell:last-child,
  body.elementor-page .elementor > .elementor-element.e-con.page-shell:last-child {
    padding-bottom: 48px;
  }
}

/*
 * 3.4.4 — Geometría protegida de fichas culturales.
 * Elementor puede escribir variables de ancho en la raíz .e-con que terminan
 * ganando al width de cultural.css. Se fijan tanto las propiedades reales como
 * las variables que Elementor usa para calcular el contenedor. Esto mantiene
 * el mismo margen lateral de la Plantilla Museo Completa en Haciendas, Museos
 * y Templos y conserva aire suficiente antes del Footer B.
 */
body.elementor-page .elementor > .e-con.hd-cultural-page,
body.elementor-page .elementor > .elementor-element.e-con.hd-cultural-page,
body.elementor-page .elementor > .e-con.hd-catalog-page,
body.elementor-page .elementor > .elementor-element.e-con.hd-catalog-page,
body.elementor-page .elementor > .e-con.hd-imported-page,
body.elementor-page .elementor > .elementor-element.e-con.hd-imported-page {
  --width: min(calc(100% - 48px), 1180px) !important;
  --max-width: 1180px !important;
  --container-max-width: 1180px !important;
  width: min(calc(100% - 48px), 1180px) !important;
  max-width: 1180px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-top: 34px !important;
  padding-right: 0 !important;
  padding-bottom: 72px !important;
  padding-left: 0 !important;
}

/* Si Elementor anida accidentalmente el documento bajo un contenedor full width,
 * la ficha sigue centrada y no se pega a los bordes de la ventana. */
.elementor .hd-cultural-page,
.elementor .hd-catalog-page,
.elementor .hd-imported-page {
  box-sizing: border-box;
  margin-inline: auto !important;
}

@media (max-width: 620px) {
  body.elementor-page .elementor > .e-con.hd-cultural-page,
  body.elementor-page .elementor > .elementor-element.e-con.hd-cultural-page,
  body.elementor-page .elementor > .e-con.hd-catalog-page,
  body.elementor-page .elementor > .elementor-element.e-con.hd-catalog-page,
  body.elementor-page .elementor > .e-con.hd-imported-page,
  body.elementor-page .elementor > .elementor-element.e-con.hd-imported-page {
    --width: calc(100% - 32px) !important;
    width: calc(100% - 32px) !important;
    padding-top: 24px !important;
    padding-bottom: 48px !important;
  }
}


/*
 * 3.4.5 — Reparación geométrica por tipo de contenido, no por clase Elementor.
 * Algunas fichas antiguas fueron guardadas con una raíz distinta y podían perder
 * el margen aunque su contenido fuese correcto. WordPress sí conserva la clase
 * del post type en <body>, por eso esta guardia actúa incluso sobre documentos
 * Elementor heredados. También endurece el responsive para impedir desbordes.
 */
:is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
:is(main#content, main.site-main, #content.site-main)
.elementor[data-elementor-type="wp-post"] > .e-con:first-child,
:is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
:is(main#content, main.site-main, #content.site-main)
.elementor[data-elementor-type="wp-post"] > .elementor-element.e-con:first-child {
  --width: min(calc(100% - 48px), 1180px) !important;
  --max-width: 1180px !important;
  --container-max-width: 1180px !important;
  width: min(calc(100% - 48px), 1180px) !important;
  max-width: 1180px !important;
  min-width: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-top: 34px !important;
  padding-right: 0 !important;
  padding-bottom: 72px !important;
  padding-left: 0 !important;
  box-sizing: border-box !important;
}

/* Ningún hijo de la ficha puede ensanchar la página por encima de su viewport. */
:is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
:is(main#content, main.site-main, #content.site-main) {
  min-width: 0;
  overflow-x: clip;
}
:is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
.elementor[data-elementor-type="wp-post"],
:is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
.elementor[data-elementor-type="wp-post"] :is(.e-con, .elementor-element, .elementor-widget, .hero-copy, .page-hero > *, .editorial-card > *, .location-section > *, .section-heading--row > *) {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}
:is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
.elementor[data-elementor-type="wp-post"] :is(img, video, iframe, svg) {
  max-width: 100%;
}
:is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
.elementor[data-elementor-type="wp-post"] :is(h1, h2, h3, p, li, a, strong, span) {
  overflow-wrap: anywhere;
}
:is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
.elementor[data-elementor-type="wp-post"] :is(.contact-actions a, .location-section > a, .hd-cta__button, .hd-map__button, .hd-gallery__more > summary) {
  max-width: 100%;
  white-space: normal;
  text-align: center;
}
:is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
.elementor[data-elementor-type="wp-post"] .hd-gallery__grid--horizontal {
  max-width: 100%;
  min-width: 0;
}
:is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
.elementor[data-elementor-type="wp-post"] .hd-gallery__more > summary {
  width: fit-content;
}

@media (max-width: 900px) {
  :is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
  .elementor[data-elementor-type="wp-post"] :is(.page-hero, .editorial-card, .editorial-card--right, .catalog-hero) {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  :is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
  .elementor[data-elementor-type="wp-post"] .editorial-card--right figure {
    grid-row: 1;
    order: initial;
  }
}

@media (max-width: 620px) {
  :is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
  :is(main#content, main.site-main, #content.site-main)
  .elementor[data-elementor-type="wp-post"] > .e-con:first-child,
  :is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
  :is(main#content, main.site-main, #content.site-main)
  .elementor[data-elementor-type="wp-post"] > .elementor-element.e-con:first-child {
    --width: calc(100% - 32px) !important;
    width: calc(100% - 32px) !important;
    max-width: calc(100% - 32px) !important;
    padding-top: 24px !important;
    padding-bottom: 48px !important;
  }

  :is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
  .elementor[data-elementor-type="wp-post"] .page-hero {
    gap: 22px !important;
    margin-top: 22px !important;
    padding: 22px 16px !important;
    border-radius: 22px !important;
  }
  /* 3.6.20: el H1 móvil ya no se bloquea con !important.
   * cultural.css aporta el fallback y Elementor puede modificar la instancia. */
  :is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
  .elementor[data-elementor-type="wp-post"] .hero-introduction {
    max-width: 100% !important;
  }
  :is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
  .elementor[data-elementor-type="wp-post"] .contact-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100%;
  }
  :is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
  .elementor[data-elementor-type="wp-post"] .contact-actions a {
    width: 100%;
    min-width: 0;
    padding-inline: 12px;
  }
  :is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
  .elementor[data-elementor-type="wp-post"] .quick-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  :is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
  .elementor[data-elementor-type="wp-post"] .editorial-card {
    gap: 20px !important;
    padding: 18px 16px !important;
    border-radius: 22px !important;
  }
  :is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
  .elementor[data-elementor-type="wp-post"] .editorial-card figure {
    width: 100%;
    max-width: 100%;
  }
  :is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
  .elementor[data-elementor-type="wp-post"] .section-heading--row,
  :is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
  .elementor[data-elementor-type="wp-post"] .location-section {
    align-items: stretch !important;
    flex-direction: column !important;
  }
  :is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
  .elementor[data-elementor-type="wp-post"] .location-section {
    gap: 18px !important;
    padding: 22px 16px !important;
    border-radius: 22px !important;
  }
  :is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
  .elementor[data-elementor-type="wp-post"] .location-section > a {
    width: 100% !important;
  }
  :is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
  .elementor[data-elementor-type="wp-post"] :is(.gallery-grid, .related-grid) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 390px) {
  :is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
  .elementor[data-elementor-type="wp-post"] .contact-actions {
    grid-template-columns: 1fr !important;
  }
  :is(body.single-hd_hacienda, body.single-hd_museo, body.single-hd_templo)
  .elementor[data-elementor-type="wp-post"] .related-grid {
    grid-template-columns: 1fr;
  }
}


/*
 * 3.4.7 — Guardia final de márgenes culturales.
 * La versión anterior dependía de la clase avanzada guardada por Elementor y
 * algunas fichas de Museos habían sido creadas antes de que esa clase se
 * guardara con la clave interna correcta (_css_classes). Aquí el ancho se fija
 * también sobre el main del CPT, que WordPress controla y no Elementor.
 */
body.hd-cultural-single :is(main#content, main.site-main, #content.site-main) {
  width: min(calc(100% - 48px), 1180px) !important;
  max-width: 1180px !important;
  min-width: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}

/* El documento de Elementor ocupa el main ya centrado; no vuelve a sumar ancho. */
body.hd-cultural-single :is(main#content, main.site-main, #content.site-main)
.elementor[data-elementor-type="wp-post"] {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin-inline: 0 !important;
}

body.hd-cultural-single :is(main#content, main.site-main, #content.site-main)
.elementor[data-elementor-type="wp-post"] > :is(.e-con, .elementor-element.e-con):first-child {
  --width: 100% !important;
  --max-width: 100% !important;
  --container-max-width: 100% !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin-inline: 0 !important;
  padding-top: 34px !important;
  padding-right: 0 !important;
  padding-bottom: 0 !important;
  padding-left: 0 !important;
  box-sizing: border-box !important;
}

/* Respaldo para fichas antiguas cuyo main no usa las clases estándar de Hello. */
body.hd-cultural-single .elementor[data-elementor-type="wp-post"] > .hd-cultural-page,
body.hd-cultural-single .elementor[data-elementor-type="wp-post"] > .e-con.hd-cultural-page,
body.hd-cultural-single .elementor[data-elementor-type="wp-post"] > .elementor-element.hd-cultural-page {
  width: 100% !important;
  max-width: 100% !important;
  margin-inline: 0 !important;
}

@media (max-width: 620px) {
  body.hd-cultural-single :is(main#content, main.site-main, #content.site-main) {
    width: calc(100% - 32px) !important;
    max-width: calc(100% - 32px) !important;
  }
  body.hd-cultural-single :is(main#content, main.site-main, #content.site-main)
  .elementor[data-elementor-type="wp-post"] > :is(.e-con, .elementor-element.e-con):first-child {
    padding-top: 24px !important;
    padding-bottom: 0 !important;
  }
}


/* 3.4.8 — Cierre estructural antes del Footer B.
 * El espacio vive en el documento Elementor, no en una clase interna de la
 * primera sección, para que ninguna página nieta cultural pueda perderlo. */
body.hd-cultural-single .elementor[data-elementor-type="wp-post"] {
  box-sizing:border-box !important;
  padding-bottom:72px !important;
}
body.hd-cultural-single .elementor[data-elementor-type="wp-post"] > :first-child {
  padding-bottom:0 !important;
}
@media (max-width:620px) {
  body.hd-cultural-single .elementor[data-elementor-type="wp-post"] {
    padding-bottom:48px !important;
  }
}

/* 4.3.0 — Pulido final de UX/accesibilidad para producción.
 * Compensa el header fijo al navegar por anclas o mover el foco, mantiene una
 * jerarquía tipográfica más estable y evita desbordes de enlaces largos. */
html {
  scroll-padding-top: 104px;
}

:where(h1, h2, h3, h4, h5, h6, section[id], article[id], [id].e-con) {
  scroll-margin-top: 104px;
}

:where(h1, h2, h3) {
  text-wrap: balance;
}

:where(p, li) {
  text-wrap: pretty;
}

:where(.hd-legal-page, .hd-source-page, .hd-widget, .hd-events-page, .hd-governance-page) a {
  overflow-wrap: anywhere;
}

/* No se desactiva el outline nativo: esta capa solo refuerza la visibilidad. */
:where(a, button, input, select, textarea, summary, [tabindex]:not([tabindex="-1"])):focus-visible {
  scroll-margin-top: 104px;
}

@media (max-width: 620px) {
  html {
    scroll-padding-top: 88px;
  }

  :where(h1, h2, h3, h4, h5, h6, section[id], article[id], [id].e-con),
  :where(a, button, input, select, textarea, summary, [tabindex]:not([tabindex="-1"])):focus-visible {
    scroll-margin-top: 88px;
  }
}