/* Ditto Site Tools · ajustes sobre los estilos convertidos (revisión del cliente, noviembre 2026) */

/* Grosor de letra: el tema Hello aplica suavizado "antialiased", que en Mac hace el texto más fino que en la web original */
body { -webkit-font-smoothing: auto !important; -moz-osx-font-smoothing: auto !important; }

/* Banner de cookies: botones en una sola fila, como en la web original */
.cky-consent-container .cky-notice-btn-wrapper { gap: 8px; flex-wrap: wrap; }
.cky-consent-container .cky-notice-btn-wrapper .cky-btn { flex: 1 1 auto; margin: 0 !important; padding: 8px !important; font-size: 14px !important; font-weight: 500 !important; line-height: 24px !important; min-width: 0; }

/* ===== Menú móvil y tablet (≤1040px, como la web original) ===== */
@media (max-width: 1040px) {
  /* La fila de cabecera: logo a la izquierda, hamburguesa a la derecha y el menú desplegado debajo a todo el ancho */
  #masthead .e-con:has(> .e-con > .elementor-widget.mobi-nav) { flex-wrap: wrap !important; align-items: center !important; }
  #masthead .e-con:has(> .elementor-widget.mobi-nav),
  #masthead .elementor-widget.mobi-nav,
  #masthead .elementor-widget.mobi-nav .elementor-shortcode,
  #masthead .elementor-widget.mobi-nav .pp-advanced-menu { display: contents !important; }
  #masthead .e-con:has(> .e-con > .elementor-widget.mobi-nav) > .e-con:first-child { flex: 1 1 auto !important; width: auto !important; max-width: none !important; }
  #masthead .mobi-nav .pp-advanced-menu-mobile { display: flex !important; justify-content: flex-end; margin-left: auto; flex: 0 0 auto; }
  #masthead .mobi-nav .pp-advanced-menu-mobile-toggle { display: flex !important; align-items: center; justify-content: center; padding: 8px !important; margin: 0 !important; background: none !important; border: 0 !important; cursor: pointer; }
  #masthead .mobi-nav .pp-clear { display: none !important; }
  #masthead .mobi-nav .pp-menu-nav { display: none !important; flex: 0 0 100%; width: 100%; order: 10; }
  #masthead .mobi-nav .menu-open .pp-menu-nav,
  #masthead .mobi-nav .pp-advanced-menu.menu-open > .pp-menu-nav { display: block !important; }

  /* Lista principal */
  #masthead .mobi-nav ul.menu { display: block !important; margin: 20px 0 0 !important; padding: 0 !important; list-style: none; width: 100%; position: static !important; background: none !important; box-shadow: none !important; }
  #masthead .mobi-nav ul.menu > li { display: block !important; margin: 0 0 12px !important; padding: 0 !important; position: relative; width: 100%; float: none !important; }
  #masthead .mobi-nav ul.menu > li > a,
  #masthead .mobi-nav ul.menu > li > .pp-has-submenu-container > a { display: block !important; padding: 8px 40px 8px 0 !important; color: #fff !important; font-size: 17px; line-height: 23.8px; font-weight: 400; text-align: left; text-decoration: none; background: none; }
  #masthead .mobi-nav ul.menu > li > .pp-has-submenu-container { position: relative; display: block; }
  #masthead .mobi-nav ul.menu > li > .pp-has-submenu-container > a > span { padding-right: 0 !important; }

  /* Flecha de cada desplegable, alineada a la derecha */
  #masthead .mobi-nav .pp-menu-toggle { position: absolute !important; right: 8px !important; left: auto !important; top: 50% !important; width: 26px !important; height: 25px !important; margin: -12.5px 0 0 !important; padding: 0 !important; background: none !important; border: 0 !important; border-radius: 4px; color: #fff; cursor: pointer; display: block !important; }
  #masthead .mobi-nav .pp-menu-toggle::before { content: "" !important; position: absolute; left: 50%; top: 50%; width: 7px; height: 7px; border: solid currentColor; border-width: 0 2px 2px 0; transform: translate(-50%, -70%) rotate(45deg); transition: transform .2s; background: none !important; }
  #masthead .mobi-nav li.pp-active > .pp-has-submenu-container > .pp-menu-toggle::before { transform: translate(-50%, -25%) rotate(-135deg); }
  #masthead .mobi-nav .pp-menu-toggle::after { display: none !important; }
  #masthead .mobi-nav .pp-menu-toggle, #masthead .mobi-nav li.pp-active > .pp-has-submenu-container > .pp-menu-toggle { transform: none !important; }

  /* Submenú: tarjeta blanca que se abre y se cierra */
  #masthead .mobi-nav ul.sub-menu { display: none !important; position: static !important; width: auto !important; min-width: 0 !important; max-width: none !important; margin: 8px 0 0 !important; padding: 8px 16px !important; background: #fff !important; border-radius: 12px; box-shadow: none !important; opacity: 1 !important; visibility: visible !important; transform: none !important; left: auto !important; top: auto !important; }
  #masthead .mobi-nav li.pp-active > ul.sub-menu { display: block !important; }
  #masthead .mobi-nav ul.sub-menu > li { display: block !important; width: auto !important; margin: 0 !important; float: none !important; }
  #masthead .mobi-nav ul.sub-menu > li:last-child > a { border-bottom: 0 !important; }

  /* Botón Book a Demo a todo el ancho */
  #masthead .mobi-nav ul.menu > li.nav-btn { margin: 4px 0 0 !important; }
  #masthead .mobi-nav ul.menu > li.nav-btn > a { background: #FD4E19 !important; color: #fff !important; border-radius: 6px; text-align: center !important; padding: 8px 0 !important; }
}
