{"id":887,"date":"2026-07-31T03:44:51","date_gmt":"2026-07-30T21:44:51","guid":{"rendered":"https:\/\/new.hyundaidemagna.com\/?page_id=887"},"modified":"2026-08-21T23:54:23","modified_gmt":"2026-08-21T17:54:23","slug":"camiones","status":"publish","type":"page","link":"https:\/\/new.hyundaidemagna.com\/?page_id=887","title":{"rendered":"Camiones"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"887\" class=\"elementor elementor-887\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-61c9869 e-con e-atomic-element e-flexbox-base e-61c9869-1f624d0 yt-hero-shell \" data-id=\"61c9869\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"61c9869\" data-e-type=\"e-flexbox\" data-id=\"61c9869\">\n    \t\t<div class=\"elementor-element elementor-element-39aad8e elementor-widget elementor-widget-html\" data-id=\"39aad8e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"yt-hero-section\">\r\n  <div class=\"yt-hero-media\">\r\n    <div id=\"yt-hero-player\" class=\"yt-hero-player\"><\/div>\r\n  <\/div>\r\n\r\n  <div class=\"yt-hero-overlay\"><\/div>\r\n\r\n  <div class=\"yt-hero-content\">\r\n    <p class=\"yt-hero-subtitle\">Camion 1<\/p>\r\n\r\n    <h1 class=\"yt-hero-title\">Texto sobre camion 1<\/h1>\r\n\r\n    <div class=\"ytv-hero-actions\">\r\n      <a class=\"ytv-hero-btn ytv-hero-btn-primary\" href=\"#contacto\">\r\n        Conoce m\u00e1s <span aria-hidden=\"true\">\u2192<\/span>\r\n      <\/a>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <button\r\n    class=\"yt-hero-sound\"\r\n    type=\"button\"\r\n    aria-label=\"Activar sonido\"\r\n    aria-pressed=\"false\"\r\n  >\r\n    <span class=\"yt-hero-sound-icon\" aria-hidden=\"true\">\r\n      <svg viewBox=\"0 0 24 24\" focusable=\"false\">\r\n        <path\r\n          d=\"M11 5L6.5 9H3v6h3.5L11 19V5z\"\r\n          stroke=\"currentColor\"\r\n          stroke-width=\"1.8\"\r\n          stroke-linejoin=\"round\"\r\n        \/>\r\n\r\n        <path\r\n          class=\"yt-sound-wave-1\"\r\n          d=\"M15 9.5c1.2 1.4 1.2 3.6 0 5\"\r\n          stroke=\"currentColor\"\r\n          stroke-width=\"1.8\"\r\n          stroke-linecap=\"round\"\r\n        \/>\r\n\r\n        <path\r\n          class=\"yt-sound-wave-2\"\r\n          d=\"M18 7c2.7 2.8 2.7 7.2 0 10\"\r\n          stroke=\"currentColor\"\r\n          stroke-width=\"1.8\"\r\n          stroke-linecap=\"round\"\r\n        \/>\r\n\r\n        <path\r\n          class=\"yt-sound-muted-x\"\r\n          d=\"M15.5 9.5l5 5m0-5l-5 5\"\r\n          stroke=\"currentColor\"\r\n          stroke-width=\"1.8\"\r\n          stroke-linecap=\"round\"\r\n        \/>\r\n      <\/svg>\r\n    <\/span>\r\n  <\/button>\r\n\r\n  <div class=\"yt-hero-dots\" aria-label=\"Seleccionar video\">\r\n    <button\r\n      class=\"yt-hero-dot active\"\r\n      type=\"button\"\r\n      data-index=\"0\"\r\n      aria-label=\"Mostrar video 1\"\r\n      aria-pressed=\"true\"\r\n    ><\/button>\r\n\r\n    <button\r\n      class=\"yt-hero-dot\"\r\n      type=\"button\"\r\n      data-index=\"1\"\r\n      aria-label=\"Mostrar video 2\"\r\n      aria-pressed=\"false\"\r\n    ><\/button>\r\n\r\n    <button\r\n      class=\"yt-hero-dot\"\r\n      type=\"button\"\r\n      data-index=\"2\"\r\n      aria-label=\"Mostrar video 3\"\r\n      aria-pressed=\"false\"\r\n    ><\/button>\r\n  <\/div>\r\n<\/div>\r\n\r\n<style>\r\n\r\n.yt-hero-shell {\r\n  width: 100% !important;\r\n  max-width: 100% !important;\r\n  min-width: 0 !important;\r\n\r\n  margin: 0 !important;\r\n  padding: 0 !important;\r\n\r\n  overflow: hidden !important;\r\n\r\n  box-sizing: border-box !important;\r\n}\r\n\r\n.yt-hero-shell > .e-con-inner,\r\n.yt-hero-shell .elementor-widget-html,\r\n.yt-hero-shell .elementor-widget-container {\r\n  width: 100% !important;\r\n  max-width: 100% !important;\r\n  min-width: 0 !important;\r\n\r\n  margin: 0 !important;\r\n  padding: 0 !important;\r\n\r\n  box-sizing: border-box !important;\r\n}\r\n\r\n.yt-hero-section,\r\n.yt-hero-section * {\r\n  box-sizing: border-box;\r\n}\r\n\r\n.yt-hero-section {\r\n  position: relative;\r\n\r\n  isolation: isolate;\r\n\r\n  width: 100%;\r\n  max-width: 100%;\r\n  min-width: 0;\r\n\r\n  height: 100vh;\r\n  height: 100svh;\r\n\r\n  min-height: 650px;\r\n\r\n  margin: 0;\r\n  padding: 0;\r\n\r\n  overflow: hidden;\r\n\r\n  background: #000;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   VIDEO\r\n========================================= *\/\r\n\r\n.yt-hero-media {\r\n  position: absolute;\r\n\r\n  inset: 0;\r\n\r\n  z-index: 1;\r\n\r\n  width: 100%;\r\n  height: 100%;\r\n\r\n  overflow: hidden;\r\n\r\n  background: #000;\r\n}\r\n\r\n#yt-hero-player,\r\n.yt-hero-player {\r\n  position: absolute;\r\n\r\n  top: 50%;\r\n  left: 50%;\r\n\r\n  width: 100%;\r\n  height: 100%;\r\n\r\n  max-width: none !important;\r\n\r\n  transform: translate(-50%, -50%);\r\n\r\n  border: 0;\r\n\r\n  pointer-events: none;\r\n}\r\n\r\n#yt-hero-player iframe,\r\niframe#yt-hero-player,\r\n.yt-hero-player iframe {\r\n  display: block;\r\n\r\n  width: 100%;\r\n  height: 100%;\r\n\r\n  max-width: none !important;\r\n\r\n  border: 0;\r\n\r\n  pointer-events: none;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   OSCURECIMIENTO\r\n========================================= *\/\r\n\r\n.yt-hero-overlay {\r\n  position: absolute;\r\n\r\n  inset: 0;\r\n\r\n  z-index: 2;\r\n\r\n  background: linear-gradient(\r\n    90deg,\r\n    rgba(0, 0, 0, 0.72) 0%,\r\n    rgba(0, 0, 0, 0.45) 45%,\r\n    rgba(0, 0, 0, 0.18) 100%\r\n  );\r\n\r\n  pointer-events: none;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   CONTENIDO\r\n========================================= *\/\r\n\r\n.yt-hero-content {\r\n  position: relative;\r\n\r\n  z-index: 3;\r\n\r\n  display: flex;\r\n\r\n  flex-direction: column;\r\n\r\n  justify-content: center;\r\n\r\n  width: 100%;\r\n\r\n  max-width: 1180px;\r\n\r\n  height: 100%;\r\n\r\n  margin: 0 auto;\r\n\r\n  padding: 0 40px;\r\n\r\n  color: #fff;\r\n}\r\n\r\n.yt-hero-subtitle {\r\n  margin: 0 0 14px;\r\n\r\n  color: #fff;\r\n\r\n  font-family: Roboto, Arial, sans-serif;\r\n\r\n  font-size: 16px;\r\n\r\n  font-weight: 700;\r\n\r\n  line-height: 1.4;\r\n\r\n  letter-spacing: 0.12em;\r\n\r\n  text-transform: uppercase;\r\n}\r\n\r\n.yt-hero-title {\r\n  width: 100%;\r\n\r\n  max-width: 760px;\r\n\r\n  margin: 0 0 28px;\r\n\r\n  color: #fff;\r\n\r\n  font-family: Roboto, Arial, sans-serif;\r\n\r\n  font-size: clamp(42px, 6vw, 82px);\r\n\r\n  font-weight: 800;\r\n\r\n  line-height: 0.98;\r\n\r\n  overflow-wrap: break-word;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   BOT\u00d3N CONOCE M\u00c1S\r\n========================================= *\/\r\n\r\n.ytv-hero-actions {\r\n  display: flex;\r\n\r\n  flex-wrap: wrap;\r\n\r\n  gap: 14px;\r\n}\r\n\r\n.ytv-hero-btn {\r\n  display: inline-flex;\r\n\r\n  align-items: center;\r\n\r\n  justify-content: center;\r\n\r\n  gap: 10px;\r\n\r\n  min-width: 145px;\r\n\r\n  padding: 15px 30px;\r\n\r\n  border-radius: 2px;\r\n\r\n  font-family: Roboto, Arial, sans-serif;\r\n\r\n  font-size: 15px;\r\n\r\n  font-weight: 800;\r\n\r\n  line-height: 1;\r\n\r\n  text-decoration: none;\r\n\r\n  cursor: pointer;\r\n\r\n  transition:\r\n    background-size 0.38s cubic-bezier(0.65, 0, 0.35, 1),\r\n    color 0.25s ease,\r\n    border-color 0.25s ease,\r\n    transform 0.25s ease,\r\n    box-shadow 0.25s ease;\r\n}\r\n\r\n.ytv-hero-btn-primary {\r\n  color: #002c5f;\r\n\r\n  border: 2px solid #fff;\r\n\r\n  background-color: #fff;\r\n\r\n  background-image: linear-gradient(\r\n    to right,\r\n    #002c5f 0%,\r\n    #002c5f 100%\r\n  );\r\n\r\n  background-repeat: no-repeat;\r\n\r\n  background-position: left center;\r\n\r\n  background-size: 0% 100%;\r\n}\r\n\r\n.ytv-hero-btn-primary:hover,\r\n.ytv-hero-btn-primary:focus {\r\n  color: #fff;\r\n\r\n  border-color: #002c5f;\r\n\r\n  background-size: 100% 100%;\r\n\r\n  transform: translate(-2px, -2px);\r\n\r\n  box-shadow:\r\n    5px 5px 0 #35719e,\r\n    0 12px 24px rgba(0, 44, 95, 0.24);\r\n}\r\n\r\n.ytv-hero-btn:focus-visible {\r\n  outline: 3px solid rgba(255, 255, 255, 0.45);\r\n\r\n  outline-offset: 4px;\r\n}\r\n\r\n.ytv-hero-btn span {\r\n  transition: transform 0.25s ease;\r\n}\r\n\r\n.ytv-hero-btn:hover span,\r\n.ytv-hero-btn:focus span {\r\n  transform: translateX(4px);\r\n}\r\n\r\n\r\n\/* =========================================\r\n   BOT\u00d3N DE AUDIO\r\n========================================= *\/\r\n\r\n.yt-hero-section button.yt-hero-sound {\r\n  -webkit-appearance: none !important;\r\n\r\n  appearance: none !important;\r\n\r\n  position: absolute !important;\r\n\r\n  right: 28px !important;\r\n\r\n  bottom: 62px !important;\r\n\r\n  z-index: 10 !important;\r\n\r\n  display: flex !important;\r\n\r\n  align-items: center !important;\r\n\r\n  justify-content: center !important;\r\n\r\n  flex: 0 0 44px !important;\r\n\r\n  width: 44px !important;\r\n\r\n  min-width: 44px !important;\r\n\r\n  max-width: 44px !important;\r\n\r\n  height: 44px !important;\r\n\r\n  min-height: 44px !important;\r\n\r\n  max-height: 44px !important;\r\n\r\n  margin: 0 !important;\r\n\r\n  padding: 0 !important;\r\n\r\n  color: #fff !important;\r\n\r\n  font-size: 0 !important;\r\n\r\n  line-height: 0 !important;\r\n\r\n  border: 1px solid rgba(255, 255, 255, 0.78) !important;\r\n\r\n  border-radius: 50% !important;\r\n\r\n  background: rgba(0, 0, 0, 0.42) !important;\r\n\r\n  background-image: none !important;\r\n\r\n  box-shadow: none !important;\r\n\r\n  text-shadow: none !important;\r\n\r\n  opacity: 1 !important;\r\n\r\n  overflow: hidden !important;\r\n\r\n  cursor: pointer !important;\r\n\r\n  transform: none !important;\r\n\r\n  touch-action: manipulation;\r\n\r\n  backdrop-filter: blur(6px);\r\n\r\n  -webkit-backdrop-filter: blur(6px);\r\n\r\n  transition:\r\n    background-color 0.25s ease,\r\n    border-color 0.25s ease,\r\n    transform 0.25s ease,\r\n    box-shadow 0.25s ease !important;\r\n}\r\n\r\n.yt-hero-section button.yt-hero-sound::before,\r\n.yt-hero-section button.yt-hero-sound::after {\r\n  content: none !important;\r\n\r\n  display: none !important;\r\n}\r\n\r\n.yt-hero-section button.yt-hero-sound:hover,\r\n.yt-hero-section button.yt-hero-sound:focus {\r\n  background: rgba(0, 44, 95, 0.88) !important;\r\n\r\n  border-color: #fff !important;\r\n\r\n  transform: scale(1.06) !important;\r\n\r\n  box-shadow: 3px 3px 0 #35719e !important;\r\n}\r\n\r\n.yt-hero-section button.yt-hero-sound:focus-visible {\r\n  outline: 3px solid rgba(255, 255, 255, 0.45) !important;\r\n\r\n  outline-offset: 4px !important;\r\n}\r\n\r\n.yt-hero-sound-icon {\r\n  display: flex !important;\r\n\r\n  align-items: center !important;\r\n\r\n  justify-content: center !important;\r\n\r\n  width: 22px !important;\r\n\r\n  height: 22px !important;\r\n\r\n  margin: 0 !important;\r\n\r\n  padding: 0 !important;\r\n\r\n  transform: none !important;\r\n\r\n  pointer-events: none !important;\r\n}\r\n\r\n.yt-hero-sound-icon svg {\r\n  display: block !important;\r\n\r\n  width: 22px !important;\r\n\r\n  min-width: 22px !important;\r\n\r\n  max-width: 22px !important;\r\n\r\n  height: 22px !important;\r\n\r\n  min-height: 22px !important;\r\n\r\n  max-height: 22px !important;\r\n\r\n  margin: 0 !important;\r\n\r\n  padding: 0 !important;\r\n\r\n  fill: none !important;\r\n\r\n  stroke: currentColor;\r\n\r\n  overflow: visible !important;\r\n\r\n  pointer-events: none !important;\r\n}\r\n\r\n.yt-sound-wave-1,\r\n.yt-sound-wave-2 {\r\n  display: none;\r\n}\r\n\r\n.yt-sound-muted-x {\r\n  display: block;\r\n}\r\n\r\n.yt-hero-sound.sound-on .yt-sound-wave-1,\r\n.yt-hero-sound.sound-on .yt-sound-wave-2 {\r\n  display: block;\r\n}\r\n\r\n.yt-hero-sound.sound-on .yt-sound-muted-x {\r\n  display: none;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   PUNTOS\r\n========================================= *\/\r\n\r\n.yt-hero-section .yt-hero-dots {\r\n  position: absolute !important;\r\n\r\n  right: 28px !important;\r\n\r\n  bottom: 28px !important;\r\n\r\n  z-index: 10 !important;\r\n\r\n  display: flex !important;\r\n\r\n  align-items: center !important;\r\n\r\n  justify-content: flex-end !important;\r\n\r\n  flex-wrap: nowrap !important;\r\n\r\n  width: auto !important;\r\n\r\n  min-width: 0 !important;\r\n\r\n  max-width: none !important;\r\n\r\n  height: auto !important;\r\n\r\n  min-height: 0 !important;\r\n\r\n  max-height: none !important;\r\n\r\n  margin: 0 !important;\r\n\r\n  padding: 0 !important;\r\n\r\n  gap: 8px !important;\r\n\r\n  background: transparent !important;\r\n\r\n  border: 0 !important;\r\n\r\n  box-shadow: none !important;\r\n}\r\n\r\n.yt-hero-section button.yt-hero-dot {\r\n  -webkit-appearance: none !important;\r\n\r\n  appearance: none !important;\r\n\r\n  position: relative !important;\r\n\r\n  display: block !important;\r\n\r\n  flex: 0 0 10px !important;\r\n\r\n  width: 10px !important;\r\n\r\n  min-width: 10px !important;\r\n\r\n  max-width: 10px !important;\r\n\r\n  height: 10px !important;\r\n\r\n  min-height: 10px !important;\r\n\r\n  max-height: 10px !important;\r\n\r\n  margin: 0 !important;\r\n\r\n  padding: 0 !important;\r\n\r\n  color: transparent !important;\r\n\r\n  font-size: 0 !important;\r\n\r\n  line-height: 0 !important;\r\n\r\n  border: 1px solid rgba(255, 255, 255, 0.85) !important;\r\n\r\n  border-radius: 1px !important;\r\n\r\n  background: transparent !important;\r\n\r\n  background-image: none !important;\r\n\r\n  box-shadow: none !important;\r\n\r\n  text-shadow: none !important;\r\n\r\n  opacity: 1 !important;\r\n\r\n  overflow: hidden !important;\r\n\r\n  cursor: pointer !important;\r\n\r\n  transform: none !important;\r\n\r\n  touch-action: manipulation;\r\n\r\n  transition:\r\n    background-color 0.25s ease,\r\n    border-color 0.25s ease,\r\n    transform 0.25s ease,\r\n    box-shadow 0.25s ease !important;\r\n}\r\n\r\n.yt-hero-section button.yt-hero-dot::before,\r\n.yt-hero-section button.yt-hero-dot::after {\r\n  content: none !important;\r\n\r\n  display: none !important;\r\n}\r\n\r\n.yt-hero-section button.yt-hero-dot:hover,\r\n.yt-hero-section button.yt-hero-dot:focus {\r\n  background: rgba(255, 255, 255, 0.45) !important;\r\n\r\n  border-color: #fff !important;\r\n\r\n  transform: translateY(-2px) !important;\r\n}\r\n\r\n.yt-hero-section button.yt-hero-dot.active {\r\n  background: #fff !important;\r\n\r\n  border-color: #fff !important;\r\n\r\n  box-shadow: 2px 2px 0 #35719e !important;\r\n}\r\n\r\n.yt-hero-section button.yt-hero-dot:focus-visible {\r\n  outline: 3px solid rgba(255, 255, 255, 0.45) !important;\r\n\r\n  outline-offset: 4px !important;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   TABLET\r\n========================================= *\/\r\n\r\n@media (max-width: 1024px) {\r\n  .yt-hero-content {\r\n    padding-right: 32px;\r\n\r\n    padding-left: 32px;\r\n  }\r\n\r\n  .yt-hero-title {\r\n    max-width: 680px;\r\n  }\r\n}\r\n\r\n\r\n\/* =========================================\r\n   M\u00d3VIL\r\n========================================= *\/\r\n\r\n@media (max-width: 767px) {\r\n  .yt-hero-section {\r\n    height: 100vh;\r\n\r\n    height: 100svh;\r\n\r\n    min-height: 600px;\r\n  }\r\n\r\n  .yt-hero-content {\r\n    padding-right: 24px;\r\n\r\n    padding-left: 24px;\r\n  }\r\n\r\n  .yt-hero-subtitle {\r\n    margin-bottom: 12px;\r\n\r\n    font-size: 13px;\r\n  }\r\n\r\n  .yt-hero-title {\r\n    max-width: 100%;\r\n\r\n    margin-bottom: 24px;\r\n\r\n    font-size: clamp(38px, 11vw, 52px);\r\n\r\n    line-height: 1;\r\n  }\r\n\r\n  .ytv-hero-actions {\r\n    width: 100%;\r\n  }\r\n\r\n  .ytv-hero-btn {\r\n    width: fit-content;\r\n\r\n    min-width: 135px;\r\n\r\n    padding: 13px 26px;\r\n\r\n    font-size: 14px;\r\n  }\r\n\r\n  .yt-hero-section button.yt-hero-sound {\r\n    right: 20px !important;\r\n\r\n    bottom: 56px !important;\r\n\r\n    flex-basis: 40px !important;\r\n\r\n    width: 40px !important;\r\n\r\n    min-width: 40px !important;\r\n\r\n    max-width: 40px !important;\r\n\r\n    height: 40px !important;\r\n\r\n    min-height: 40px !important;\r\n\r\n    max-height: 40px !important;\r\n  }\r\n\r\n  .yt-hero-sound-icon,\r\n  .yt-hero-sound-icon svg {\r\n    width: 20px !important;\r\n\r\n    min-width: 20px !important;\r\n\r\n    max-width: 20px !important;\r\n\r\n    height: 20px !important;\r\n\r\n    min-height: 20px !important;\r\n\r\n    max-height: 20px !important;\r\n  }\r\n\r\n  .yt-hero-section .yt-hero-dots {\r\n    right: 20px !important;\r\n\r\n    bottom: 23px !important;\r\n\r\n    gap: 7px !important;\r\n  }\r\n\r\n  .yt-hero-section button.yt-hero-dot,\r\n  .yt-hero-section button.yt-hero-dot:hover,\r\n  .yt-hero-section button.yt-hero-dot:focus,\r\n  .yt-hero-section button.yt-hero-dot.active {\r\n    flex-basis: 9px !important;\r\n\r\n    width: 9px !important;\r\n\r\n    min-width: 9px !important;\r\n\r\n    max-width: 9px !important;\r\n\r\n    height: 9px !important;\r\n\r\n    min-height: 9px !important;\r\n\r\n    max-height: 9px !important;\r\n  }\r\n}\r\n\r\n\r\n\/* =========================================\r\n   REDUCIR ANIMACIONES\r\n========================================= *\/\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n  .ytv-hero-btn,\r\n  .ytv-hero-btn span,\r\n  .yt-hero-section button.yt-hero-dot,\r\n  .yt-hero-section button.yt-hero-sound {\r\n    transition: none !important;\r\n  }\r\n}\r\n\r\n<\/style>\r\n\r\n\r\n<script>\r\n(function () {\r\n\r\n  \"use strict\";\r\n\r\n\r\n  const hero =\r\n    document.querySelector(\r\n      \".yt-hero-section\"\r\n    );\r\n\r\n\r\n  if (\r\n    !hero ||\r\n    hero.dataset.ytHeroInitialized === \"true\"\r\n  ) {\r\n\r\n    return;\r\n\r\n  }\r\n\r\n\r\n  hero.dataset.ytHeroInitialized =\r\n    \"true\";\r\n\r\n\r\n  \/* =========================================\r\n     VIDEOS\r\n  ========================================= *\/\r\n\r\n  const videos = [\r\n\r\n    {\r\n      id: \"73K692sxMR4\",\r\n\r\n      title:\r\n        \"Texto sobre camion 1\",\r\n\r\n      subtitle:\r\n        \"Camion 1\"\r\n    },\r\n\r\n    {\r\n      id: \"ODLCv5vkGH8\",\r\n\r\n      title:\r\n        \"Texto sobre camion 2\",\r\n\r\n      subtitle:\r\n        \"Camion 2\"\r\n    },\r\n\r\n    {\r\n      id: \"eopUvefxF7A\",\r\n\r\n      title:\r\n        \"Texto sobre camion 3\",\r\n\r\n      subtitle:\r\n        \"Camion 3\"\r\n    }\r\n\r\n  ];\r\n\r\n\r\n  \/* =========================================\r\n     ELEMENTOS\r\n  ========================================= *\/\r\n\r\n  const playerElement =\r\n    hero.querySelector(\r\n      \"#yt-hero-player\"\r\n    );\r\n\r\n\r\n  const titleElement =\r\n    hero.querySelector(\r\n      \".yt-hero-title\"\r\n    );\r\n\r\n\r\n  const subtitleElement =\r\n    hero.querySelector(\r\n      \".yt-hero-subtitle\"\r\n    );\r\n\r\n\r\n  const dots =\r\n    Array.from(\r\n      hero.querySelectorAll(\r\n        \".yt-hero-dot\"\r\n      )\r\n    );\r\n\r\n\r\n  const soundButton =\r\n    hero.querySelector(\r\n      \".yt-hero-sound\"\r\n    );\r\n\r\n\r\n  \/* =========================================\r\n     VARIABLES\r\n  ========================================= *\/\r\n\r\n  let currentVideo = 0;\r\n\r\n  let player = null;\r\n\r\n  let resizeObserver = null;\r\n\r\n  let isMuted = true;\r\n\r\n\r\n  \/* =========================================\r\n     AJUSTAR VIDEO\r\n  ========================================= *\/\r\n\r\n  function fitVideoToHero() {\r\n\r\n    if (\r\n      !player ||\r\n      typeof player.getIframe !==\r\n        \"function\"\r\n    ) {\r\n\r\n      return;\r\n\r\n    }\r\n\r\n\r\n    const iframe =\r\n      player.getIframe();\r\n\r\n\r\n    if (!iframe) {\r\n\r\n      return;\r\n\r\n    }\r\n\r\n\r\n    const heroWidth =\r\n      hero.clientWidth;\r\n\r\n\r\n    const heroHeight =\r\n      hero.clientHeight;\r\n\r\n\r\n    const videoRatio =\r\n      16 \/ 9;\r\n\r\n\r\n    let videoWidth =\r\n      heroWidth;\r\n\r\n\r\n    let videoHeight =\r\n      videoWidth \/\r\n      videoRatio;\r\n\r\n\r\n    if (\r\n      videoHeight <\r\n      heroHeight\r\n    ) {\r\n\r\n      videoHeight =\r\n        heroHeight;\r\n\r\n\r\n      videoWidth =\r\n        videoHeight *\r\n        videoRatio;\r\n\r\n    }\r\n\r\n\r\n    iframe.style.width =\r\n      Math.ceil(\r\n        videoWidth\r\n      ) + \"px\";\r\n\r\n\r\n    iframe.style.height =\r\n      Math.ceil(\r\n        videoHeight\r\n      ) + \"px\";\r\n\r\n\r\n    iframe.style.maxWidth =\r\n      \"none\";\r\n\r\n\r\n    iframe.style.position =\r\n      \"absolute\";\r\n\r\n\r\n    iframe.style.top =\r\n      \"50%\";\r\n\r\n\r\n    iframe.style.left =\r\n      \"50%\";\r\n\r\n\r\n    iframe.style.transform =\r\n      \"translate(-50%, -50%)\";\r\n\r\n  }\r\n\r\n\r\n  \/* =========================================\r\n     ACTUALIZAR CONTENIDO\r\n  ========================================= *\/\r\n\r\n  function updateHeroContent() {\r\n\r\n    const selectedVideo =\r\n      videos[currentVideo];\r\n\r\n\r\n    if (titleElement) {\r\n\r\n      titleElement.textContent =\r\n        selectedVideo.title || \"\";\r\n\r\n    }\r\n\r\n\r\n    if (subtitleElement) {\r\n\r\n      subtitleElement.textContent =\r\n        selectedVideo.subtitle || \"\";\r\n\r\n    }\r\n\r\n\r\n    dots.forEach(\r\n      function (\r\n        dot,\r\n        index\r\n      ) {\r\n\r\n        const isActive =\r\n          index ===\r\n          currentVideo;\r\n\r\n\r\n        dot.classList.toggle(\r\n          \"active\",\r\n          isActive\r\n        );\r\n\r\n\r\n        dot.setAttribute(\r\n          \"aria-pressed\",\r\n          isActive\r\n            ? \"true\"\r\n            : \"false\"\r\n        );\r\n\r\n      }\r\n    );\r\n\r\n  }\r\n\r\n\r\n  \/* =========================================\r\n     BOT\u00d3N DE AUDIO\r\n  ========================================= *\/\r\n\r\n  function updateSoundButton() {\r\n\r\n    if (!soundButton) {\r\n\r\n      return;\r\n\r\n    }\r\n\r\n\r\n    if (isMuted) {\r\n\r\n      soundButton.classList.remove(\r\n        \"sound-on\"\r\n      );\r\n\r\n\r\n      soundButton.setAttribute(\r\n        \"aria-label\",\r\n        \"Activar sonido\"\r\n      );\r\n\r\n\r\n      soundButton.setAttribute(\r\n        \"aria-pressed\",\r\n        \"false\"\r\n      );\r\n\r\n    }\r\n\r\n    else {\r\n\r\n      soundButton.classList.add(\r\n        \"sound-on\"\r\n      );\r\n\r\n\r\n      soundButton.setAttribute(\r\n        \"aria-label\",\r\n        \"Silenciar sonido\"\r\n      );\r\n\r\n\r\n      soundButton.setAttribute(\r\n        \"aria-pressed\",\r\n        \"true\"\r\n      );\r\n\r\n    }\r\n\r\n  }\r\n\r\n\r\n  function applySoundState() {\r\n\r\n    if (!player) {\r\n\r\n      return;\r\n\r\n    }\r\n\r\n\r\n    if (isMuted) {\r\n\r\n      player.mute();\r\n\r\n    }\r\n\r\n    else {\r\n\r\n      player.unMute();\r\n\r\n      player.setVolume(\r\n        100\r\n      );\r\n\r\n    }\r\n\r\n\r\n    updateSoundButton();\r\n\r\n  }\r\n\r\n\r\n  function toggleSound() {\r\n\r\n    if (!player) {\r\n\r\n      return;\r\n\r\n    }\r\n\r\n\r\n    isMuted =\r\n      !isMuted;\r\n\r\n\r\n    applySoundState();\r\n\r\n\r\n    if (\r\n      typeof player.playVideo ===\r\n      \"function\"\r\n    ) {\r\n\r\n      player.playVideo();\r\n\r\n    }\r\n\r\n  }\r\n\r\n\r\n  \/* =========================================\r\n     INTENTAR OCULTAR SUBT\u00cdTULOS DE YOUTUBE\r\n  ========================================= *\/\r\n\r\n  function tryDisableYouTubeCaptions() {\r\n\r\n    if (!player) {\r\n\r\n      return;\r\n\r\n    }\r\n\r\n\r\n    \/*\r\n     * YouTube puede conservar la preferencia\r\n     * de subt\u00edtulos del usuario.\r\n     *\r\n     * Intentamos quitar la pista de captions.\r\n     *\/\r\n\r\n    try {\r\n\r\n      if (\r\n        typeof player.unloadModule ===\r\n        \"function\"\r\n      ) {\r\n\r\n        player.unloadModule(\r\n          \"captions\"\r\n        );\r\n\r\n      }\r\n\r\n    }\r\n\r\n    catch (error) {\r\n\r\n      \/*\r\n       * No detenemos el video.\r\n       *\/\r\n\r\n    }\r\n\r\n\r\n    try {\r\n\r\n      if (\r\n        typeof player.setOption ===\r\n        \"function\"\r\n      ) {\r\n\r\n        player.setOption(\r\n          \"captions\",\r\n          \"track\",\r\n          {}\r\n        );\r\n\r\n      }\r\n\r\n    }\r\n\r\n    catch (error) {\r\n\r\n      \/*\r\n       * Algunos reproductores no permiten\r\n       * modificar esta opci\u00f3n.\r\n       *\/\r\n\r\n    }\r\n\r\n  }\r\n\r\n\r\n  \/* =========================================\r\n     REPRODUCIR VIDEO\r\n  ========================================= *\/\r\n\r\n  function playVideo(index) {\r\n\r\n    currentVideo =\r\n      (\r\n        index +\r\n        videos.length\r\n      ) %\r\n      videos.length;\r\n\r\n\r\n    updateHeroContent();\r\n\r\n\r\n    if (\r\n      !player ||\r\n      typeof player.loadVideoById !==\r\n        \"function\"\r\n    ) {\r\n\r\n      return;\r\n\r\n    }\r\n\r\n\r\n    player.loadVideoById({\r\n\r\n      videoId:\r\n        videos[\r\n          currentVideo\r\n        ].id,\r\n\r\n      suggestedQuality:\r\n        \"hd1080\"\r\n\r\n    });\r\n\r\n\r\n    window.setTimeout(\r\n\r\n      function () {\r\n\r\n        if (!player) {\r\n\r\n          return;\r\n\r\n        }\r\n\r\n\r\n        applySoundState();\r\n\r\n\r\n        tryDisableYouTubeCaptions();\r\n\r\n\r\n        player.playVideo();\r\n\r\n\r\n        fitVideoToHero();\r\n\r\n\r\n        \/*\r\n         * YouTube puede cargar los captions\r\n         * unos milisegundos despu\u00e9s.\r\n         *\/\r\n\r\n        window.setTimeout(\r\n          tryDisableYouTubeCaptions,\r\n          150\r\n        );\r\n\r\n\r\n        window.setTimeout(\r\n          tryDisableYouTubeCaptions,\r\n          600\r\n        );\r\n\r\n      },\r\n\r\n      350\r\n\r\n    );\r\n\r\n  }\r\n\r\n\r\n  \/* =========================================\r\n     SIGUIENTE VIDEO\r\n  ========================================= *\/\r\n\r\n  function playNextVideo() {\r\n\r\n    playVideo(\r\n      currentVideo + 1\r\n    );\r\n\r\n  }\r\n\r\n\r\n  \/* =========================================\r\n     CREAR REPRODUCTOR\r\n  ========================================= *\/\r\n\r\n  function createPlayer() {\r\n\r\n    if (\r\n      player ||\r\n      !playerElement ||\r\n      !window.YT ||\r\n      typeof window.YT.Player !==\r\n        \"function\"\r\n    ) {\r\n\r\n      return;\r\n\r\n    }\r\n\r\n\r\n    player =\r\n      new window.YT.Player(\r\n\r\n        playerElement,\r\n\r\n        {\r\n\r\n          videoId:\r\n            videos[\r\n              currentVideo\r\n            ].id,\r\n\r\n\r\n          playerVars: {\r\n\r\n            autoplay: 1,\r\n\r\n            controls: 0,\r\n\r\n            mute: 1,\r\n\r\n\r\n            \/*\r\n             * No forzamos subt\u00edtulos.\r\n             *\/\r\n\r\n            cc_load_policy: 0,\r\n\r\n\r\n            rel: 0,\r\n\r\n            playsinline: 1,\r\n\r\n            modestbranding: 1,\r\n\r\n            iv_load_policy: 3,\r\n\r\n            disablekb: 1,\r\n\r\n            fs: 0\r\n\r\n          },\r\n\r\n\r\n          events: {\r\n\r\n\r\n            \/* =============================\r\n               VIDEO LISTO\r\n            ============================= *\/\r\n\r\n            onReady:\r\n              function (event) {\r\n\r\n\r\n                isMuted = true;\r\n\r\n\r\n                event.target.mute();\r\n\r\n\r\n                event.target.setVolume(\r\n                  100\r\n                );\r\n\r\n\r\n                event.target.playVideo();\r\n\r\n\r\n                tryDisableYouTubeCaptions();\r\n\r\n\r\n                updateSoundButton();\r\n\r\n\r\n                updateHeroContent();\r\n\r\n\r\n                fitVideoToHero();\r\n\r\n\r\n                window.requestAnimationFrame(\r\n                  fitVideoToHero\r\n                );\r\n\r\n\r\n                window.setTimeout(\r\n                  fitVideoToHero,\r\n                  300\r\n                );\r\n\r\n\r\n                window.setTimeout(\r\n                  fitVideoToHero,\r\n                  1000\r\n                );\r\n\r\n\r\n                window.setTimeout(\r\n                  tryDisableYouTubeCaptions,\r\n                  150\r\n                );\r\n\r\n\r\n                window.setTimeout(\r\n                  tryDisableYouTubeCaptions,\r\n                  600\r\n                );\r\n\r\n              },\r\n\r\n\r\n            \/* =============================\r\n               CAMBIO DE M\u00d3DULOS DE YOUTUBE\r\n            ============================= *\/\r\n\r\n            onApiChange:\r\n              function () {\r\n\r\n                tryDisableYouTubeCaptions();\r\n\r\n              },\r\n\r\n\r\n            \/* =============================\r\n               VIDEO TERMINADO\r\n            ============================= *\/\r\n\r\n            onStateChange:\r\n              function (event) {\r\n\r\n                if (\r\n                  window.YT &&\r\n                  event.data ===\r\n                    window.YT\r\n                      .PlayerState\r\n                      .ENDED\r\n                ) {\r\n\r\n                  playNextVideo();\r\n\r\n                }\r\n\r\n              },\r\n\r\n\r\n            \/* =============================\r\n               ERROR DEL VIDEO\r\n            ============================= *\/\r\n\r\n            onError:\r\n              function (event) {\r\n\r\n\r\n                console.warn(\r\n                  \"Error de YouTube:\",\r\n                  event &&\r\n                  event.data,\r\n                  \"Video:\",\r\n                  videos[\r\n                    currentVideo\r\n                  ] &&\r\n                  videos[\r\n                    currentVideo\r\n                  ].id\r\n                );\r\n\r\n\r\n                \/*\r\n                 * Si un video no puede\r\n                 * reproducirse, vamos al siguiente.\r\n                 *\/\r\n\r\n                playNextVideo();\r\n\r\n              }\r\n\r\n          }\r\n\r\n        }\r\n\r\n      );\r\n\r\n  }\r\n\r\n\r\n  \/* =========================================\r\n     CARGAR API DE YOUTUBE\r\n  ========================================= *\/\r\n\r\n  function loadYouTubeAPI() {\r\n\r\n    if (\r\n      window.YT &&\r\n      typeof window.YT.Player ===\r\n        \"function\"\r\n    ) {\r\n\r\n      createPlayer();\r\n\r\n      return;\r\n\r\n    }\r\n\r\n\r\n    const previousCallback =\r\n      window.onYouTubeIframeAPIReady;\r\n\r\n\r\n    window.onYouTubeIframeAPIReady =\r\n      function () {\r\n\r\n\r\n        if (\r\n          typeof previousCallback ===\r\n          \"function\"\r\n        ) {\r\n\r\n          previousCallback();\r\n\r\n        }\r\n\r\n\r\n        createPlayer();\r\n\r\n      };\r\n\r\n\r\n    const existingScript =\r\n      document.querySelector(\r\n        'script[src=\"https:\/\/www.youtube.com\/iframe_api\"]'\r\n      );\r\n\r\n\r\n    if (!existingScript) {\r\n\r\n      const script =\r\n        document.createElement(\r\n          \"script\"\r\n        );\r\n\r\n\r\n      script.src =\r\n        \"https:\/\/www.youtube.com\/iframe_api\";\r\n\r\n\r\n      script.async =\r\n        true;\r\n\r\n\r\n      document.head.appendChild(\r\n        script\r\n      );\r\n\r\n    }\r\n\r\n  }\r\n\r\n\r\n  \/* =========================================\r\n     CLIC EN AUDIO\r\n  ========================================= *\/\r\n\r\n  if (soundButton) {\r\n\r\n    soundButton.addEventListener(\r\n\r\n      \"click\",\r\n\r\n      function (event) {\r\n\r\n        event.preventDefault();\r\n\r\n        event.stopPropagation();\r\n\r\n        toggleSound();\r\n\r\n      }\r\n\r\n    );\r\n\r\n  }\r\n\r\n\r\n  \/* =========================================\r\n     CLIC EN PUNTOS\r\n  ========================================= *\/\r\n\r\n  dots.forEach(\r\n\r\n    function (dot) {\r\n\r\n      dot.addEventListener(\r\n\r\n        \"click\",\r\n\r\n        function (event) {\r\n\r\n          event.preventDefault();\r\n\r\n          event.stopPropagation();\r\n\r\n\r\n          const index =\r\n            Number(\r\n              dot.dataset.index\r\n            );\r\n\r\n\r\n          if (\r\n            Number.isInteger(\r\n              index\r\n            )\r\n          ) {\r\n\r\n            playVideo(\r\n              index\r\n            );\r\n\r\n          }\r\n\r\n        }\r\n\r\n      );\r\n\r\n    }\r\n\r\n  );\r\n\r\n\r\n  \/* =========================================\r\n     RESPONSIVE\r\n  ========================================= *\/\r\n\r\n  window.addEventListener(\r\n\r\n    \"resize\",\r\n\r\n    fitVideoToHero,\r\n\r\n    {\r\n      passive: true\r\n    }\r\n\r\n  );\r\n\r\n\r\n  if (\r\n    \"ResizeObserver\" in window\r\n  ) {\r\n\r\n    resizeObserver =\r\n      new ResizeObserver(\r\n\r\n        function () {\r\n\r\n          fitVideoToHero();\r\n\r\n        }\r\n\r\n      );\r\n\r\n\r\n    resizeObserver.observe(\r\n      hero\r\n    );\r\n\r\n  }\r\n\r\n\r\n  \/* =========================================\r\n     INICIO\r\n  ========================================= *\/\r\n\r\n  updateSoundButton();\r\n\r\n  updateHeroContent();\r\n\r\n  loadYouTubeAPI();\r\n\r\n\r\n})();\r\n\r\n<\/script>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-ca00332 e-grid e-con-boxed e-con e-parent\" data-id=\"ca00332\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ae3c95d elementor-widget elementor-widget-html\" data-id=\"ae3c95d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"es\">\r\n<head>\r\n<meta charset=\"UTF-8\">\r\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n<title>Hyundai Magna \u2014 Encabezado de operaciones<\/title>\r\n<style>\r\n*{box-sizing:border-box}\r\n\r\nbody{\r\n    margin:0;\r\n    background:#F5F7F9;\r\n    font-family:Roboto,Arial,sans-serif;\r\n}\r\n\r\n.hdm-operations-heading-section{\r\n    --hdm-navy:#002C5F;\r\n    --hdm-blue:#35719E;\r\n    --hdm-gray:#F5F7F9;\r\n\r\n    width:100%;\r\n    padding:42px 8px 34px;\r\n    background:var(--hdm-gray);\r\n}\r\n\r\n.hdm-operations-heading{\r\n    width:100%;\r\n    max-width:620px;\r\n    margin:0;\r\n}\r\n\r\n.hdm-operations-eyebrow{\r\n    display:inline-flex;\r\n    align-items:center;\r\n    gap:10px;\r\n    margin-bottom:24px;\r\n    color:var(--hdm-blue);\r\n    font-size:12px;\r\n    font-weight:900;\r\n    line-height:1;\r\n    letter-spacing:.11em;\r\n    text-transform:uppercase;\r\n}\r\n\r\n.hdm-operations-eyebrow::before{\r\n    content:\"\";\r\n    display:block;\r\n    width:36px;\r\n    height:3px;\r\n    background:var(--hdm-blue);\r\n}\r\n\r\n.hdm-operations-title{\r\n    margin:0;\r\n    color:var(--hdm-navy);\r\n    font-size:clamp(48px,8vw,68px);\r\n    font-weight:900;\r\n    line-height:.94;\r\n    letter-spacing:-.05em;\r\n}\r\n\r\n@media(max-width:600px){\r\n    .hdm-operations-heading-section{\r\n        padding:34px 8px 28px;\r\n    }\r\n\r\n    .hdm-operations-eyebrow{\r\n        font-size:11px;\r\n        margin-bottom:20px;\r\n    }\r\n\r\n    .hdm-operations-eyebrow::before{\r\n        width:34px;\r\n    }\r\n\r\n    .hdm-operations-title{\r\n        font-size:clamp(42px,13vw,58px);\r\n    }\r\n}\r\n<\/style>\r\n<\/head>\r\n<body>\r\n\r\n<section\r\n    class=\"hdm-operations-heading-section\"\r\n    aria-labelledby=\"hdm-operations-title\"\r\n>\r\n    <div class=\"hdm-operations-heading\">\r\n\r\n        <span class=\"hdm-operations-eyebrow\">\r\n            NUESTRA L\u00cdNEA DE CAMIONES\r\n        <\/span>\r\n\r\n        <h2\r\n            class=\"hdm-operations-title\"\r\n            id=\"hdm-operations-title\"\r\n        >\r\n            Encuentra el cami\u00f3n<br>\r\n            ideal para tu<br>\r\n            operaci\u00f3n\r\n        <\/h2>\r\n\r\n    <\/div>\r\n<\/section>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c8d19d1 elementor-widget elementor-widget-text-editor\" data-id=\"c8d19d1\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p style=\"margin: 0; color: #333333; font-family: Roboto, Arial, sans-serif; font-size: 17px; font-weight: 400; line-height: 1.75;\">\n    Desde entregas urbanas hasta operaciones de carga exigentes,\n    encuentra el cami\u00f3n Hyundai que mejor se adapta a las necesidades,\n    recorridos y objetivos de\n    <strong style=\"color: #002C5F; font-weight: 900;\">tu empresa.<\/strong>\n<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-7b1adf9 e-grid e-con-boxed e-con e-parent\" data-id=\"7b1adf9\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-ea07ad1 e-con e-atomic-element e-div-block-base e-ea07ad1-049f9df \" data-id=\"ea07ad1\" data-element_type=\"e-div-block\" data-e-type=\"e-div-block\" data-interaction-id=\"ea07ad1\" data-e-type=\"e-div-block\" data-id=\"ea07ad1\">\n    \t\t<div class=\"elementor-element elementor-element-6832141 elementor-widget elementor-widget-html\" data-id=\"6832141\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n\r\n  .hdm-card-stage {\r\n    --hdm-navy: #002c5f;\r\n    --hdm-blue: #35719e;\r\n    --hdm-light-blue: #c8dce9;\r\n    --hdm-text: #333333;\r\n    --hdm-white: #ffffff;\r\n    --hdm-border: #cfd9e2;\r\n    --hdm-depth-x: 8px;\r\n    --hdm-depth-y: 8px;\r\n\r\n    width: 100%;\r\n    max-width: 378px;\r\n    min-width: 0;\r\n    margin: 0 auto;\r\n\r\n    padding-right: var(--hdm-depth-x);\r\n    padding-bottom: var(--hdm-depth-y);\r\n\r\n    color: var(--hdm-text);\r\n    font-family: Arial, Helvetica, sans-serif;\r\n  }\r\n\r\n  .hdm-card-stage,\r\n  .hdm-card-stage * {\r\n    box-sizing: border-box;\r\n  }\r\n\r\n  .hdm-truck-card {\r\n    position: relative;\r\n    z-index: 1;\r\n\r\n    width: 100%;\r\n    min-width: 0;\r\n    min-height: 558px;\r\n\r\n    display: flex;\r\n    flex-direction: column;\r\n\r\n    background: var(--hdm-white);\r\n\r\n    border: 1px solid var(--hdm-border);\r\n    border-top: 5px solid var(--hdm-blue);\r\n    border-radius: 1px;\r\n\r\n    box-shadow:\r\n      var(--hdm-depth-x) var(--hdm-depth-y) 0 var(--hdm-navy),\r\n      0 14px 28px rgba(0, 44, 95, 0.06);\r\n\r\n    transform: translate3d(0, 0, 0);\r\n\r\n    transition:\r\n      transform 0.34s cubic-bezier(0.22, 1, 0.36, 1),\r\n      box-shadow 0.34s cubic-bezier(0.22, 1, 0.36, 1),\r\n      border-color 0.25s ease;\r\n  }\r\n\r\n  .hdm-truck-card:hover {\r\n    border-color: rgba(0, 44, 95, 0.34);\r\n\r\n    transform: translate3d(-4px, -4px, 0);\r\n\r\n    box-shadow:\r\n      12px 12px 0 var(--hdm-navy),\r\n      0 22px 42px rgba(0, 44, 95, 0.14);\r\n  }\r\n\r\n  .hdm-truck-card::after {\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n    top: 0;\r\n    right: -1px;\r\n    bottom: 0;\r\n    z-index: 4;\r\n\r\n    width: 1px;\r\n\r\n    background: rgba(255, 255, 255, 0.55);\r\n\r\n    pointer-events: none;\r\n  }\r\n\r\n  \/* =========================================================\r\n     \u00c1REA DE IMAGEN\r\n     ========================================================= *\/\r\n\r\n  .hdm-truck-media {\r\n    position: relative;\r\n\r\n    min-height: 282px;\r\n    overflow: hidden;\r\n\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    padding: 42px 24px 26px;\r\n\r\n    background:\r\n      linear-gradient(\r\n        180deg,\r\n        #ffffff 0%,\r\n        #f7f9fb 100%\r\n      );\r\n  }\r\n\r\n  .hdm-truck-media::before {\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n    right: -77px;\r\n    bottom: -102px;\r\n\r\n    width: 235px;\r\n    height: 235px;\r\n\r\n    border: 1px solid rgba(53, 113, 158, 0.26);\r\n\r\n    transform: rotate(54deg);\r\n    transform-origin: center;\r\n\r\n    transition:\r\n      transform 0.46s cubic-bezier(0.22, 1, 0.36, 1),\r\n      border-color 0.3s ease;\r\n  }\r\n\r\n  .hdm-truck-media::after {\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n    left: 28px;\r\n    bottom: 24px;\r\n\r\n    width: 120px;\r\n    height: 4px;\r\n\r\n    background: var(--hdm-blue);\r\n\r\n    transition:\r\n      width 0.34s ease,\r\n      transform 0.34s ease;\r\n  }\r\n\r\n  .hdm-truck-card:hover .hdm-truck-media::before {\r\n    border-color: rgba(53, 113, 158, 0.42);\r\n\r\n    transform: rotate(60deg) scale(1.06);\r\n  }\r\n\r\n  .hdm-truck-card:hover .hdm-truck-media::after {\r\n    width: 145px;\r\n\r\n    transform: translateX(4px);\r\n  }\r\n\r\n  .hdm-truck-label {\r\n    position: absolute;\r\n    top: 18px;\r\n    left: 24px;\r\n    z-index: 3;\r\n\r\n    min-height: 30px;\r\n    padding: 8px 12px;\r\n\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    color: var(--hdm-white);\r\n    background: var(--hdm-navy);\r\n\r\n    box-shadow: 4px 4px 0 rgba(53, 113, 158, 0.25);\r\n\r\n    font-size: 10px;\r\n    font-weight: 900;\r\n    line-height: 1;\r\n    letter-spacing: 0.05em;\r\n    text-transform: uppercase;\r\n\r\n    transition:\r\n      transform 0.3s ease,\r\n      box-shadow 0.3s ease;\r\n  }\r\n\r\n  .hdm-truck-card:hover .hdm-truck-label {\r\n    transform: translate(-2px, -2px);\r\n\r\n    box-shadow: 6px 6px 0 rgba(53, 113, 158, 0.30);\r\n  }\r\n\r\n  .hdm-truck-image {\r\n    position: relative;\r\n    z-index: 2;\r\n\r\n    display: block;\r\n\r\n    width: 100%;\r\n    max-width: 326px;\r\n    height: 205px;\r\n\r\n    object-fit: contain;\r\n    object-position: center;\r\n\r\n    filter:\r\n      drop-shadow(0 18px 16px rgba(0, 44, 95, 0.17));\r\n\r\n    transform: translate3d(0, 0, 0) scale(1);\r\n\r\n    transition:\r\n      transform 0.46s cubic-bezier(0.22, 1, 0.36, 1),\r\n      filter 0.34s ease;\r\n  }\r\n\r\n  .hdm-truck-card:hover .hdm-truck-image {\r\n    transform: translate3d(-2px, -7px, 0) scale(1.055);\r\n\r\n    filter:\r\n      drop-shadow(8px 24px 18px rgba(0, 44, 95, 0.23));\r\n  }\r\n\r\n  .hdm-truck-content {\r\n    flex: 1;\r\n    min-width: 0;\r\n\r\n    display: flex;\r\n    flex-direction: column;\r\n\r\n    padding: 29px 28px 27px;\r\n\r\n    border-top: 1px solid rgba(0, 44, 95, 0.11);\r\n  }\r\n\r\n  .hdm-truck-category {\r\n    display: block;\r\n\r\n    margin-bottom: 13px;\r\n\r\n    color: var(--hdm-blue);\r\n\r\n    font-size: 11px;\r\n    font-weight: 900;\r\n    line-height: 1;\r\n    letter-spacing: 0.10em;\r\n    text-transform: uppercase;\r\n  }\r\n\r\n  .hdm-truck-name {\r\n    margin: 0;\r\n\r\n    color: var(--hdm-navy);\r\n\r\n    font-size: 38px;\r\n    font-weight: 900;\r\n    line-height: 1;\r\n    letter-spacing: -0.035em;\r\n  }\r\n\r\n  .hdm-truck-description {\r\n    margin: 19px 0 0;\r\n\r\n    color: var(--hdm-text);\r\n\r\n    font-size: 14px;\r\n    font-weight: 400;\r\n    line-height: 1.65;\r\n  }\r\n\r\n  \/* =========================================================\r\n     BOT\u00d3N\r\n     ========================================================= *\/\r\n\r\n  .hdm-truck-action {\r\n    width: 100%;\r\n    margin-top: auto;\r\n    padding-top: 29px;\r\n\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: space-between;\r\n    gap: 16px;\r\n\r\n    color: var(--hdm-navy);\r\n    text-decoration: none;\r\n\r\n    font-size: 12px;\r\n    font-weight: 900;\r\n    line-height: 1;\r\n    letter-spacing: 0.035em;\r\n    text-transform: uppercase;\r\n  }\r\n\r\n  .hdm-truck-action-text {\r\n    position: relative;\r\n\r\n    padding-bottom: 8px;\r\n  }\r\n\r\n  .hdm-truck-action-text::after {\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n    right: 0;\r\n    bottom: 0;\r\n    left: 0;\r\n\r\n    height: 2px;\r\n\r\n    background: var(--hdm-blue);\r\n\r\n    transform: scaleX(1);\r\n    transform-origin: left center;\r\n\r\n    transition: transform 0.28s ease;\r\n  }\r\n\r\n  .hdm-truck-action:hover .hdm-truck-action-text::after {\r\n    transform: scaleX(0.70);\r\n  }\r\n\r\n  .hdm-truck-arrow {\r\n    width: 38px;\r\n    height: 38px;\r\n    flex: 0 0 auto;\r\n\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    color: var(--hdm-white);\r\n    background: var(--hdm-navy);\r\n\r\n    border: 1px solid var(--hdm-navy);\r\n\r\n    box-shadow: 3px 3px 0 rgba(53, 113, 158, 0.25);\r\n\r\n    font-size: 16px;\r\n\r\n    transition:\r\n      transform 0.28s ease,\r\n      box-shadow 0.28s ease,\r\n      background-color 0.28s ease;\r\n  }\r\n\r\n  .hdm-truck-action:hover .hdm-truck-arrow,\r\n  .hdm-truck-action:focus-visible .hdm-truck-arrow {\r\n    background: var(--hdm-blue);\r\n\r\n    transform: translate(-2px, -2px);\r\n\r\n    box-shadow: 5px 5px 0 var(--hdm-navy);\r\n  }\r\n\r\n  .hdm-truck-action:focus-visible {\r\n    outline: 3px solid rgba(53, 113, 158, 0.36);\r\n    outline-offset: 5px;\r\n  }\r\n\r\n  \/* =========================================================\r\n     RESPONSIVE\r\n     ========================================================= *\/\r\n\r\n  @media (max-width: 440px) {\r\n    .hdm-card-stage {\r\n      --hdm-depth-x: 6px;\r\n      --hdm-depth-y: 6px;\r\n    }\r\n\r\n    .hdm-truck-media {\r\n      min-height: 260px;\r\n    }\r\n\r\n    .hdm-truck-image {\r\n      height: 190px;\r\n    }\r\n\r\n    .hdm-truck-content {\r\n      padding: 27px 24px 25px;\r\n    }\r\n\r\n    .hdm-truck-name {\r\n      font-size: 36px;\r\n    }\r\n  }\r\n\r\n  \/* =========================================================\r\n     ACCESIBILIDAD\r\n     ========================================================= *\/\r\n\r\n  @media (prefers-reduced-motion: reduce) {\r\n    .hdm-card-stage .hdm-truck-card,\r\n    .hdm-card-stage .hdm-truck-media::before,\r\n    .hdm-card-stage .hdm-truck-media::after,\r\n    .hdm-card-stage .hdm-truck-label,\r\n    .hdm-card-stage .hdm-truck-image,\r\n    .hdm-card-stage .hdm-truck-action-text::after,\r\n    .hdm-card-stage .hdm-truck-arrow {\r\n      transition: none;\r\n    }\r\n  }\r\n<\/style>\r\n\r\n<div class=\"hdm-card-stage\">\r\n\r\n  <article class=\"hdm-truck-card\">\r\n\r\n    <div class=\"hdm-truck-media\">\r\n\r\n      <span class=\"hdm-truck-label\">\r\n        Hyundai Trucks\r\n      <\/span>\r\n\r\n      <img loading=\"lazy\" decoding=\"async\"\r\n        class=\"hdm-truck-image\"\r\n        src=\"https:\/\/new.hyundaidemagna.com\/wp-content\/uploads\/2026\/07\/XCIENT-GT.png\"\r\n        alt=\"Cami\u00f3n Hyundai Mighty EX9\"\r\n        width=\"700\"\r\n        height=\"440\"\r\n        loading=\"lazy\"\r\n      >\r\n\r\n    <\/div>\r\n\r\n    <div class=\"hdm-truck-content\">\r\n\r\n      <span class=\"hdm-truck-category\">\r\n        Cami\u00f3n de carga 4X2\r\n      <\/span>\r\n\r\n      <h2 class=\"hdm-truck-name\">\r\n        Mighty EX8 \r\n      <\/h2>\r\n\r\n      <p class=\"hdm-truck-description\">\r\n        Cami\u00f3n di\u00e9sel turbo cargado con intercooler, desarrollado para operaciones de distribuci\u00f3n y transporte. Ofrece 155 HP a 2,900 rpm, torque de 38 kg\u00b7m a 1,800 rpm y una capacidad de carga de 5.25 toneladas..\r\n      <\/p>\r\n\r\n      <a\r\n        class=\"hdm-bus-action\"\r\n\t\thref=\"https:\/\/new.hyundaidemagna.com\/?page_id=1201\"\r\n\t\ttarget=\"_blank\"\r\n\t\trel=\"noopener noreferrer\"\r\n\t\taria-label=\"Conocer el modelo\"\r\n      >\r\n        <span class=\"hdm-truck-action-text\">\r\n          Conocer modelo\r\n        <\/span>\r\n\r\n        <span\r\n          class=\"hdm-truck-arrow\"\r\n          aria-hidden=\"true\"\r\n        >\r\n          \u2192\r\n        <\/span>\r\n      <\/a>\r\n\r\n    <\/div>\r\n\r\n  <\/article>\r\n\r\n<\/div>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-0e4d222 e-con e-atomic-element e-div-block-base e-0e4d222-0371194 \" data-id=\"0e4d222\" data-element_type=\"e-div-block\" data-e-type=\"e-div-block\" data-interaction-id=\"0e4d222\" data-e-type=\"e-div-block\" data-id=\"0e4d222\">\n    \t\t<div class=\"elementor-element elementor-element-88f7da7 elementor-widget elementor-widget-html\" data-id=\"88f7da7\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n\r\n  .hdm-card-stage {\r\n    --hdm-navy: #002c5f;\r\n    --hdm-blue: #35719e;\r\n    --hdm-light-blue: #c8dce9;\r\n    --hdm-text: #333333;\r\n    --hdm-white: #ffffff;\r\n    --hdm-border: #cfd9e2;\r\n    --hdm-depth-x: 8px;\r\n    --hdm-depth-y: 8px;\r\n\r\n    width: 100%;\r\n    max-width: 378px;\r\n    min-width: 0;\r\n    margin: 0 auto;\r\n\r\n    padding-right: var(--hdm-depth-x);\r\n    padding-bottom: var(--hdm-depth-y);\r\n\r\n    color: var(--hdm-text);\r\n    font-family: Arial, Helvetica, sans-serif;\r\n  }\r\n\r\n  .hdm-card-stage,\r\n  .hdm-card-stage * {\r\n    box-sizing: border-box;\r\n  }\r\n\r\n  .hdm-truck-card {\r\n    position: relative;\r\n    z-index: 1;\r\n\r\n    width: 100%;\r\n    min-width: 0;\r\n    min-height: 558px;\r\n\r\n    display: flex;\r\n    flex-direction: column;\r\n\r\n    background: var(--hdm-white);\r\n\r\n    border: 1px solid var(--hdm-border);\r\n    border-top: 5px solid var(--hdm-blue);\r\n    border-radius: 1px;\r\n\r\n    box-shadow:\r\n      var(--hdm-depth-x) var(--hdm-depth-y) 0 var(--hdm-navy),\r\n      0 14px 28px rgba(0, 44, 95, 0.06);\r\n\r\n    transform: translate3d(0, 0, 0);\r\n\r\n    transition:\r\n      transform 0.34s cubic-bezier(0.22, 1, 0.36, 1),\r\n      box-shadow 0.34s cubic-bezier(0.22, 1, 0.36, 1),\r\n      border-color 0.25s ease;\r\n  }\r\n\r\n  .hdm-truck-card:hover {\r\n    border-color: rgba(0, 44, 95, 0.34);\r\n\r\n    transform: translate3d(-4px, -4px, 0);\r\n\r\n    box-shadow:\r\n      12px 12px 0 var(--hdm-navy),\r\n      0 22px 42px rgba(0, 44, 95, 0.14);\r\n  }\r\n\r\n  .hdm-truck-card::after {\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n    top: 0;\r\n    right: -1px;\r\n    bottom: 0;\r\n    z-index: 4;\r\n\r\n    width: 1px;\r\n\r\n    background: rgba(255, 255, 255, 0.55);\r\n\r\n    pointer-events: none;\r\n  }\r\n\r\n  \/* =========================================================\r\n     \u00c1REA DE IMAGEN\r\n     ========================================================= *\/\r\n\r\n  .hdm-truck-media {\r\n    position: relative;\r\n\r\n    min-height: 282px;\r\n    overflow: hidden;\r\n\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    padding: 42px 24px 26px;\r\n\r\n    background:\r\n      linear-gradient(\r\n        180deg,\r\n        #ffffff 0%,\r\n        #f7f9fb 100%\r\n      );\r\n  }\r\n\r\n  .hdm-truck-media::before {\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n    right: -77px;\r\n    bottom: -102px;\r\n\r\n    width: 235px;\r\n    height: 235px;\r\n\r\n    border: 1px solid rgba(53, 113, 158, 0.26);\r\n\r\n    transform: rotate(54deg);\r\n    transform-origin: center;\r\n\r\n    transition:\r\n      transform 0.46s cubic-bezier(0.22, 1, 0.36, 1),\r\n      border-color 0.3s ease;\r\n  }\r\n\r\n  .hdm-truck-media::after {\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n    left: 28px;\r\n    bottom: 24px;\r\n\r\n    width: 120px;\r\n    height: 4px;\r\n\r\n    background: var(--hdm-blue);\r\n\r\n    transition:\r\n      width 0.34s ease,\r\n      transform 0.34s ease;\r\n  }\r\n\r\n  .hdm-truck-card:hover .hdm-truck-media::before {\r\n    border-color: rgba(53, 113, 158, 0.42);\r\n\r\n    transform: rotate(60deg) scale(1.06);\r\n  }\r\n\r\n  .hdm-truck-card:hover .hdm-truck-media::after {\r\n    width: 145px;\r\n\r\n    transform: translateX(4px);\r\n  }\r\n\r\n  \/* =========================================================\r\n     ETIQUETA\r\n     ========================================================= *\/\r\n\r\n  .hdm-truck-label {\r\n    position: absolute;\r\n    top: 18px;\r\n    left: 24px;\r\n    z-index: 3;\r\n\r\n    min-height: 30px;\r\n    padding: 8px 12px;\r\n\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    color: var(--hdm-white);\r\n    background: var(--hdm-navy);\r\n\r\n    box-shadow: 4px 4px 0 rgba(53, 113, 158, 0.25);\r\n\r\n    font-size: 10px;\r\n    font-weight: 900;\r\n    line-height: 1;\r\n    letter-spacing: 0.05em;\r\n    text-transform: uppercase;\r\n\r\n    transition:\r\n      transform 0.3s ease,\r\n      box-shadow 0.3s ease;\r\n  }\r\n\r\n  .hdm-truck-card:hover .hdm-truck-label {\r\n    transform: translate(-2px, -2px);\r\n\r\n    box-shadow: 6px 6px 0 rgba(53, 113, 158, 0.30);\r\n  }\r\n\r\n  \/* =========================================================\r\n     IMAGEN DEL CAMI\u00d3N\r\n     ========================================================= *\/\r\n\r\n  .hdm-truck-image {\r\n    position: relative;\r\n    z-index: 2;\r\n\r\n    display: block;\r\n\r\n    width: 100%;\r\n    max-width: 326px;\r\n    height: 205px;\r\n\r\n    object-fit: contain;\r\n    object-position: center;\r\n\r\n    filter:\r\n      drop-shadow(0 18px 16px rgba(0, 44, 95, 0.17));\r\n\r\n    transform: translate3d(0, 0, 0) scale(1);\r\n\r\n    transition:\r\n      transform 0.46s cubic-bezier(0.22, 1, 0.36, 1),\r\n      filter 0.34s ease;\r\n  }\r\n\r\n  .hdm-truck-card:hover .hdm-truck-image {\r\n    transform: translate3d(-2px, -7px, 0) scale(1.055);\r\n\r\n    filter:\r\n      drop-shadow(8px 24px 18px rgba(0, 44, 95, 0.23));\r\n  }\r\n\r\n  \/* =========================================================\r\n     CONTENIDO\r\n     ========================================================= *\/\r\n\r\n  .hdm-truck-content {\r\n    flex: 1;\r\n    min-width: 0;\r\n\r\n    display: flex;\r\n    flex-direction: column;\r\n\r\n    padding: 29px 28px 27px;\r\n\r\n    border-top: 1px solid rgba(0, 44, 95, 0.11);\r\n  }\r\n\r\n  .hdm-truck-category {\r\n    display: block;\r\n\r\n    margin-bottom: 13px;\r\n\r\n    color: var(--hdm-blue);\r\n\r\n    font-size: 11px;\r\n    font-weight: 900;\r\n    line-height: 1;\r\n    letter-spacing: 0.10em;\r\n    text-transform: uppercase;\r\n  }\r\n\r\n  .hdm-truck-name {\r\n    margin: 0;\r\n\r\n    color: var(--hdm-navy);\r\n\r\n    font-size: 38px;\r\n    font-weight: 900;\r\n    line-height: 1;\r\n    letter-spacing: -0.035em;\r\n  }\r\n\r\n  .hdm-truck-description {\r\n    margin: 19px 0 0;\r\n\r\n    color: var(--hdm-text);\r\n\r\n    font-size: 14px;\r\n    font-weight: 400;\r\n    line-height: 1.65;\r\n  }\r\n\r\n  \/* =========================================================\r\n     BOT\u00d3N\r\n     ========================================================= *\/\r\n\r\n  .hdm-truck-action {\r\n    width: 100%;\r\n    margin-top: auto;\r\n    padding-top: 29px;\r\n\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: space-between;\r\n    gap: 16px;\r\n\r\n    color: var(--hdm-navy);\r\n    text-decoration: none;\r\n\r\n    font-size: 12px;\r\n    font-weight: 900;\r\n    line-height: 1;\r\n    letter-spacing: 0.035em;\r\n    text-transform: uppercase;\r\n  }\r\n\r\n  .hdm-truck-action-text {\r\n    position: relative;\r\n\r\n    padding-bottom: 8px;\r\n  }\r\n\r\n  .hdm-truck-action-text::after {\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n    right: 0;\r\n    bottom: 0;\r\n    left: 0;\r\n\r\n    height: 2px;\r\n\r\n    background: var(--hdm-blue);\r\n\r\n    transform: scaleX(1);\r\n    transform-origin: left center;\r\n\r\n    transition: transform 0.28s ease;\r\n  }\r\n\r\n  .hdm-truck-action:hover .hdm-truck-action-text::after {\r\n    transform: scaleX(0.70);\r\n  }\r\n\r\n  .hdm-truck-arrow {\r\n    width: 38px;\r\n    height: 38px;\r\n    flex: 0 0 auto;\r\n\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    color: var(--hdm-white);\r\n    background: var(--hdm-navy);\r\n\r\n    border: 1px solid var(--hdm-navy);\r\n\r\n    box-shadow: 3px 3px 0 rgba(53, 113, 158, 0.25);\r\n\r\n    font-size: 16px;\r\n\r\n    transition:\r\n      transform 0.28s ease,\r\n      box-shadow 0.28s ease,\r\n      background-color 0.28s ease;\r\n  }\r\n\r\n  .hdm-truck-action:hover .hdm-truck-arrow,\r\n  .hdm-truck-action:focus-visible .hdm-truck-arrow {\r\n    background: var(--hdm-blue);\r\n\r\n    transform: translate(-2px, -2px);\r\n\r\n    box-shadow: 5px 5px 0 var(--hdm-navy);\r\n  }\r\n\r\n  .hdm-truck-action:focus-visible {\r\n    outline: 3px solid rgba(53, 113, 158, 0.36);\r\n    outline-offset: 5px;\r\n  }\r\n\r\n  \/* =========================================================\r\n     RESPONSIVE\r\n     ========================================================= *\/\r\n\r\n  @media (max-width: 440px) {\r\n    .hdm-card-stage {\r\n      --hdm-depth-x: 6px;\r\n      --hdm-depth-y: 6px;\r\n    }\r\n\r\n    .hdm-truck-media {\r\n      min-height: 260px;\r\n    }\r\n\r\n    .hdm-truck-image {\r\n      height: 190px;\r\n    }\r\n\r\n    .hdm-truck-content {\r\n      padding: 27px 24px 25px;\r\n    }\r\n\r\n    .hdm-truck-name {\r\n      font-size: 36px;\r\n    }\r\n  }\r\n\r\n  \/* =========================================================\r\n     ACCESIBILIDAD\r\n     ========================================================= *\/\r\n\r\n  @media (prefers-reduced-motion: reduce) {\r\n    .hdm-card-stage .hdm-truck-card,\r\n    .hdm-card-stage .hdm-truck-media::before,\r\n    .hdm-card-stage .hdm-truck-media::after,\r\n    .hdm-card-stage .hdm-truck-label,\r\n    .hdm-card-stage .hdm-truck-image,\r\n    .hdm-card-stage .hdm-truck-action-text::after,\r\n    .hdm-card-stage .hdm-truck-arrow {\r\n      transition: none;\r\n    }\r\n  }\r\n<\/style>\r\n\r\n<div class=\"hdm-card-stage\">\r\n\r\n  <article class=\"hdm-truck-card\">\r\n\r\n    <div class=\"hdm-truck-media\">\r\n\r\n      <span class=\"hdm-truck-label\">\r\n        Hyundai Trucks\r\n      <\/span>\r\n\r\n      <img loading=\"lazy\" decoding=\"async\"\r\n        class=\"hdm-truck-image\"\r\n        src=\"https:\/\/new.hyundaidemagna.com\/wp-content\/uploads\/2026\/08\/Mighty-EX9.png\"\r\n        alt=\"Cami\u00f3n Hyundai Mighty EX9\"\r\n        width=\"700\"\r\n        height=\"440\"\r\n        loading=\"lazy\"\r\n      >\r\n\r\n    <\/div>\r\n\r\n    <div class=\"hdm-truck-content\">\r\n\r\n      <span class=\"hdm-truck-category\">\r\n        Cami\u00f3n pesado\r\n      <\/span>\r\n\r\n      <h2 class=\"hdm-truck-name\">\r\n        Mighty EX9\r\n      <\/h2>\r\n\r\n      <p class=\"hdm-truck-description\">\r\n        Una soluci\u00f3n robusta y confiable para operaciones de alta exigencia,\r\n        dise\u00f1ada para ofrecer capacidad, eficiencia y desempe\u00f1o en cada jornada.\r\n      <\/p>\r\n\r\n      <a\r\n        class=\"hdm-truck-action\"\r\n        href=\"\/camiones\/xcient\/\"\r\n        aria-label=\"Conocer el cami\u00f3n Hyundai Mighty EX9\"\r\n      >\r\n        <span class=\"hdm-truck-action-text\">\r\n          Conocer modelo\r\n        <\/span>\r\n\r\n        <span\r\n          class=\"hdm-truck-arrow\"\r\n          aria-hidden=\"true\"\r\n        >\r\n          \u2192\r\n        <\/span>\r\n      <\/a>\r\n\r\n    <\/div>\r\n\r\n  <\/article>\r\n\r\n<\/div>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-189eb89 e-con e-atomic-element e-div-block-base e-189eb89-08dfa97 \" data-id=\"189eb89\" data-element_type=\"e-div-block\" data-e-type=\"e-div-block\" data-interaction-id=\"189eb89\" data-e-type=\"e-div-block\" data-id=\"189eb89\">\n    \t\t<div class=\"elementor-element elementor-element-fc0bad2 elementor-widget elementor-widget-html\" data-id=\"fc0bad2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n\r\n  .hdm-card-stage {\r\n    --hdm-navy: #002c5f;\r\n    --hdm-blue: #35719e;\r\n    --hdm-light-blue: #c8dce9;\r\n    --hdm-text: #333333;\r\n    --hdm-white: #ffffff;\r\n    --hdm-border: #cfd9e2;\r\n    --hdm-depth-x: 8px;\r\n    --hdm-depth-y: 8px;\r\n\r\n    width: 100%;\r\n    max-width: 378px;\r\n    min-width: 0;\r\n    margin: 0 auto;\r\n\r\n    padding-right: var(--hdm-depth-x);\r\n    padding-bottom: var(--hdm-depth-y);\r\n\r\n    color: var(--hdm-text);\r\n    font-family: Arial, Helvetica, sans-serif;\r\n  }\r\n\r\n  .hdm-card-stage,\r\n  .hdm-card-stage * {\r\n    box-sizing: border-box;\r\n  }\r\n\r\n  .hdm-truck-card {\r\n    position: relative;\r\n    z-index: 1;\r\n\r\n    width: 100%;\r\n    min-width: 0;\r\n    min-height: 558px;\r\n\r\n    display: flex;\r\n    flex-direction: column;\r\n\r\n    background: var(--hdm-white);\r\n\r\n    border: 1px solid var(--hdm-border);\r\n    border-top: 5px solid var(--hdm-blue);\r\n    border-radius: 1px;\r\n\r\n    box-shadow:\r\n      var(--hdm-depth-x) var(--hdm-depth-y) 0 var(--hdm-navy),\r\n      0 14px 28px rgba(0, 44, 95, 0.06);\r\n\r\n    transform: translate3d(0, 0, 0);\r\n\r\n    transition:\r\n      transform 0.34s cubic-bezier(0.22, 1, 0.36, 1),\r\n      box-shadow 0.34s cubic-bezier(0.22, 1, 0.36, 1),\r\n      border-color 0.25s ease;\r\n  }\r\n\r\n  .hdm-truck-card:hover {\r\n    border-color: rgba(0, 44, 95, 0.34);\r\n\r\n    transform: translate3d(-4px, -4px, 0);\r\n\r\n    box-shadow:\r\n      12px 12px 0 var(--hdm-navy),\r\n      0 22px 42px rgba(0, 44, 95, 0.14);\r\n  }\r\n\r\n  .hdm-truck-card::after {\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n    top: 0;\r\n    right: -1px;\r\n    bottom: 0;\r\n    z-index: 4;\r\n\r\n    width: 1px;\r\n\r\n    background: rgba(255, 255, 255, 0.55);\r\n\r\n    pointer-events: none;\r\n  }\r\n\r\n  \/* =========================================================\r\n     \u00c1REA DE IMAGEN\r\n     ========================================================= *\/\r\n\r\n  .hdm-truck-media {\r\n    position: relative;\r\n\r\n    min-height: 282px;\r\n    overflow: hidden;\r\n\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    padding: 42px 24px 26px;\r\n\r\n    background:\r\n      linear-gradient(\r\n        180deg,\r\n        #ffffff 0%,\r\n        #f7f9fb 100%\r\n      );\r\n  }\r\n\r\n  .hdm-truck-media::before {\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n    right: -77px;\r\n    bottom: -102px;\r\n\r\n    width: 235px;\r\n    height: 235px;\r\n\r\n    border: 1px solid rgba(53, 113, 158, 0.26);\r\n\r\n    transform: rotate(54deg);\r\n    transform-origin: center;\r\n\r\n    transition:\r\n      transform 0.46s cubic-bezier(0.22, 1, 0.36, 1),\r\n      border-color 0.3s ease;\r\n  }\r\n\r\n  .hdm-truck-media::after {\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n    left: 28px;\r\n    bottom: 24px;\r\n\r\n    width: 120px;\r\n    height: 4px;\r\n\r\n    background: var(--hdm-blue);\r\n\r\n    transition:\r\n      width 0.34s ease,\r\n      transform 0.34s ease;\r\n  }\r\n\r\n  .hdm-truck-card:hover .hdm-truck-media::before {\r\n    border-color: rgba(53, 113, 158, 0.42);\r\n\r\n    transform: rotate(60deg) scale(1.06);\r\n  }\r\n\r\n  .hdm-truck-card:hover .hdm-truck-media::after {\r\n    width: 145px;\r\n\r\n    transform: translateX(4px);\r\n  }\r\n\r\n  \/* =========================================================\r\n     ETIQUETA\r\n     ========================================================= *\/\r\n\r\n  .hdm-truck-label {\r\n    position: absolute;\r\n    top: 18px;\r\n    left: 24px;\r\n    z-index: 3;\r\n\r\n    min-height: 30px;\r\n    padding: 8px 12px;\r\n\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    color: var(--hdm-white);\r\n    background: var(--hdm-navy);\r\n\r\n    box-shadow: 4px 4px 0 rgba(53, 113, 158, 0.25);\r\n\r\n    font-size: 10px;\r\n    font-weight: 900;\r\n    line-height: 1;\r\n    letter-spacing: 0.05em;\r\n    text-transform: uppercase;\r\n\r\n    transition:\r\n      transform 0.3s ease,\r\n      box-shadow 0.3s ease;\r\n  }\r\n\r\n  .hdm-truck-card:hover .hdm-truck-label {\r\n    transform: translate(-2px, -2px);\r\n\r\n    box-shadow: 6px 6px 0 rgba(53, 113, 158, 0.30);\r\n  }\r\n\r\n  \/* =========================================================\r\n     IMAGEN DEL CAMI\u00d3N\r\n     ========================================================= *\/\r\n\r\n  .hdm-truck-image {\r\n    position: relative;\r\n    z-index: 2;\r\n\r\n    display: block;\r\n\r\n    width: 100%;\r\n    max-width: 326px;\r\n    height: 205px;\r\n\r\n    object-fit: contain;\r\n    object-position: center;\r\n\r\n    filter:\r\n      drop-shadow(0 18px 16px rgba(0, 44, 95, 0.17));\r\n\r\n    transform: translate3d(0, 0, 0) scale(1);\r\n\r\n    transition:\r\n      transform 0.46s cubic-bezier(0.22, 1, 0.36, 1),\r\n      filter 0.34s ease;\r\n  }\r\n\r\n  .hdm-truck-card:hover .hdm-truck-image {\r\n    transform: translate3d(-2px, -7px, 0) scale(1.055);\r\n\r\n    filter:\r\n      drop-shadow(8px 24px 18px rgba(0, 44, 95, 0.23));\r\n  }\r\n\r\n  \/* =========================================================\r\n     CONTENIDO\r\n     ========================================================= *\/\r\n\r\n  .hdm-truck-content {\r\n    flex: 1;\r\n    min-width: 0;\r\n\r\n    display: flex;\r\n    flex-direction: column;\r\n\r\n    padding: 29px 28px 27px;\r\n\r\n    border-top: 1px solid rgba(0, 44, 95, 0.11);\r\n  }\r\n\r\n  .hdm-truck-category {\r\n    display: block;\r\n\r\n    margin-bottom: 13px;\r\n\r\n    color: var(--hdm-blue);\r\n\r\n    font-size: 11px;\r\n    font-weight: 900;\r\n    line-height: 1;\r\n    letter-spacing: 0.10em;\r\n    text-transform: uppercase;\r\n  }\r\n\r\n  .hdm-truck-name {\r\n    margin: 0;\r\n\r\n    color: var(--hdm-navy);\r\n\r\n    font-size: 38px;\r\n    font-weight: 900;\r\n    line-height: 1;\r\n    letter-spacing: -0.035em;\r\n  }\r\n\r\n  .hdm-truck-description {\r\n    margin: 19px 0 0;\r\n\r\n    color: var(--hdm-text);\r\n\r\n    font-size: 14px;\r\n    font-weight: 400;\r\n    line-height: 1.65;\r\n  }\r\n\r\n  \/* =========================================================\r\n     BOT\u00d3N\r\n     ========================================================= *\/\r\n\r\n  .hdm-truck-action {\r\n    width: 100%;\r\n    margin-top: auto;\r\n    padding-top: 29px;\r\n\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: space-between;\r\n    gap: 16px;\r\n\r\n    color: var(--hdm-navy);\r\n    text-decoration: none;\r\n\r\n    font-size: 12px;\r\n    font-weight: 900;\r\n    line-height: 1;\r\n    letter-spacing: 0.035em;\r\n    text-transform: uppercase;\r\n  }\r\n\r\n  .hdm-truck-action-text {\r\n    position: relative;\r\n\r\n    padding-bottom: 8px;\r\n  }\r\n\r\n  .hdm-truck-action-text::after {\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n    right: 0;\r\n    bottom: 0;\r\n    left: 0;\r\n\r\n    height: 2px;\r\n\r\n    background: var(--hdm-blue);\r\n\r\n    transform: scaleX(1);\r\n    transform-origin: left center;\r\n\r\n    transition: transform 0.28s ease;\r\n  }\r\n\r\n  .hdm-truck-action:hover .hdm-truck-action-text::after {\r\n    transform: scaleX(0.70);\r\n  }\r\n\r\n  .hdm-truck-arrow {\r\n    width: 38px;\r\n    height: 38px;\r\n    flex: 0 0 auto;\r\n\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    color: var(--hdm-white);\r\n    background: var(--hdm-navy);\r\n\r\n    border: 1px solid var(--hdm-navy);\r\n\r\n    box-shadow: 3px 3px 0 rgba(53, 113, 158, 0.25);\r\n\r\n    font-size: 16px;\r\n\r\n    transition:\r\n      transform 0.28s ease,\r\n      box-shadow 0.28s ease,\r\n      background-color 0.28s ease;\r\n  }\r\n\r\n  .hdm-truck-action:hover .hdm-truck-arrow,\r\n  .hdm-truck-action:focus-visible .hdm-truck-arrow {\r\n    background: var(--hdm-blue);\r\n\r\n    transform: translate(-2px, -2px);\r\n\r\n    box-shadow: 5px 5px 0 var(--hdm-navy);\r\n  }\r\n\r\n  .hdm-truck-action:focus-visible {\r\n    outline: 3px solid rgba(53, 113, 158, 0.36);\r\n    outline-offset: 5px;\r\n  }\r\n\r\n  \/* =========================================================\r\n     RESPONSIVE\r\n     ========================================================= *\/\r\n\r\n  @media (max-width: 440px) {\r\n    .hdm-card-stage {\r\n      --hdm-depth-x: 6px;\r\n      --hdm-depth-y: 6px;\r\n    }\r\n\r\n    .hdm-truck-media {\r\n      min-height: 260px;\r\n    }\r\n\r\n    .hdm-truck-image {\r\n      height: 190px;\r\n    }\r\n\r\n    .hdm-truck-content {\r\n      padding: 27px 24px 25px;\r\n    }\r\n\r\n    .hdm-truck-name {\r\n      font-size: 36px;\r\n    }\r\n  }\r\n\r\n  \/* =========================================================\r\n     ACCESIBILIDAD\r\n     ========================================================= *\/\r\n\r\n  @media (prefers-reduced-motion: reduce) {\r\n    .hdm-card-stage .hdm-truck-card,\r\n    .hdm-card-stage .hdm-truck-media::before,\r\n    .hdm-card-stage .hdm-truck-media::after,\r\n    .hdm-card-stage .hdm-truck-label,\r\n    .hdm-card-stage .hdm-truck-image,\r\n    .hdm-card-stage .hdm-truck-action-text::after,\r\n    .hdm-card-stage .hdm-truck-arrow {\r\n      transition: none;\r\n    }\r\n  }\r\n<\/style>\r\n\r\n<div class=\"hdm-card-stage\">\r\n\r\n  <article class=\"hdm-truck-card\">\r\n\r\n    <div class=\"hdm-truck-media\">\r\n\r\n      <span class=\"hdm-truck-label\">\r\n        Hyundai Trucks\r\n      <\/span>\r\n\r\n      <img loading=\"lazy\" decoding=\"async\"\r\n        class=\"hdm-truck-image\"\r\n        src=\"https:\/\/new.hyundaidemagna.com\/wp-content\/uploads\/2026\/07\/XCIENT-GT.png\"\r\n        alt=\"Cami\u00f3n Hyundai HD65GT\"\r\n        width=\"700\"\r\n        height=\"440\"\r\n        loading=\"lazy\"\r\n      >\r\n\r\n    <\/div>\r\n\r\n    <div class=\"hdm-truck-content\">\r\n\r\n      <span class=\"hdm-truck-category\">\r\n        Cami\u00f3n pesado\r\n      <\/span>\r\n\r\n      <h2 class=\"hdm-truck-name\">\r\n        HD65GT\r\n      <\/h2>\r\n\r\n      <p class=\"hdm-truck-description\">\r\n        Una soluci\u00f3n robusta y confiable para operaciones de alta exigencia,\r\n        dise\u00f1ada para ofrecer capacidad, eficiencia y desempe\u00f1o en cada jornada.\r\n      <\/p>\r\n\r\n      <a\r\n        class=\"hdm-truck-action\"\r\n        href=\"\/camiones\/xcient\/\"\r\n        aria-label=\"Conocer el cami\u00f3n Hyundai HD65GT\"\r\n      >\r\n        <span class=\"hdm-truck-action-text\">\r\n          Conocer modelo\r\n        <\/span>\r\n\r\n        <span\r\n          class=\"hdm-truck-arrow\"\r\n          aria-hidden=\"true\"\r\n        >\r\n          \u2192\r\n        <\/span>\r\n      <\/a>\r\n\r\n    <\/div>\r\n\r\n  <\/article>\r\n\r\n<\/div>\t\t\t\t<\/div>\n\t\t\n<\/div>\n\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-11ed8c8 e-grid e-con-boxed e-con e-parent\" data-id=\"11ed8c8\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-9467628 e-con e-atomic-element e-div-block-base \" data-id=\"9467628\" data-element_type=\"e-div-block\" data-e-type=\"e-div-block\" data-interaction-id=\"9467628\" data-e-type=\"e-div-block\" data-id=\"9467628\">\n    \n<\/div>\n<div class=\"elementor-element elementor-element-74eeecc e-con e-atomic-element e-div-block-base e-74eeecc-6d356b1 \" data-id=\"74eeecc\" data-element_type=\"e-div-block\" data-e-type=\"e-div-block\" data-interaction-id=\"74eeecc\" data-e-type=\"e-div-block\" data-id=\"74eeecc\">\n    \t\t<div class=\"elementor-element elementor-element-d053648 elementor-widget elementor-widget-html\" data-id=\"d053648\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n\r\n  .hdm-card-stage {\r\n    --hdm-navy: #002c5f;\r\n    --hdm-blue: #35719e;\r\n    --hdm-light-blue: #c8dce9;\r\n    --hdm-text: #333333;\r\n    --hdm-white: #ffffff;\r\n    --hdm-border: #cfd9e2;\r\n    --hdm-depth-x: 8px;\r\n    --hdm-depth-y: 8px;\r\n\r\n    width: 100%;\r\n    max-width: 378px;\r\n    min-width: 0;\r\n    margin: 0 auto;\r\n\r\n    padding-right: var(--hdm-depth-x);\r\n    padding-bottom: var(--hdm-depth-y);\r\n\r\n    color: var(--hdm-text);\r\n    font-family: Arial, Helvetica, sans-serif;\r\n  }\r\n\r\n  .hdm-card-stage,\r\n  .hdm-card-stage * {\r\n    box-sizing: border-box;\r\n  }\r\n\r\n  .hdm-truck-card {\r\n    position: relative;\r\n    z-index: 1;\r\n\r\n    width: 100%;\r\n    min-width: 0;\r\n    min-height: 558px;\r\n\r\n    display: flex;\r\n    flex-direction: column;\r\n\r\n    background: var(--hdm-white);\r\n\r\n    border: 1px solid var(--hdm-border);\r\n    border-top: 5px solid var(--hdm-blue);\r\n    border-radius: 1px;\r\n\r\n    box-shadow:\r\n      var(--hdm-depth-x) var(--hdm-depth-y) 0 var(--hdm-navy),\r\n      0 14px 28px rgba(0, 44, 95, 0.06);\r\n\r\n    transform: translate3d(0, 0, 0);\r\n\r\n    transition:\r\n      transform 0.34s cubic-bezier(0.22, 1, 0.36, 1),\r\n      box-shadow 0.34s cubic-bezier(0.22, 1, 0.36, 1),\r\n      border-color 0.25s ease;\r\n  }\r\n\r\n  .hdm-truck-card:hover {\r\n    border-color: rgba(0, 44, 95, 0.34);\r\n\r\n    transform: translate3d(-4px, -4px, 0);\r\n\r\n    box-shadow:\r\n      12px 12px 0 var(--hdm-navy),\r\n      0 22px 42px rgba(0, 44, 95, 0.14);\r\n  }\r\n\r\n  .hdm-truck-card::after {\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n    top: 0;\r\n    right: -1px;\r\n    bottom: 0;\r\n    z-index: 4;\r\n\r\n    width: 1px;\r\n\r\n    background: rgba(255, 255, 255, 0.55);\r\n\r\n    pointer-events: none;\r\n  }\r\n\r\n  \/* =========================================================\r\n     \u00c1REA DE IMAGEN\r\n     ========================================================= *\/\r\n\r\n  .hdm-truck-media {\r\n    position: relative;\r\n\r\n    min-height: 282px;\r\n    overflow: hidden;\r\n\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    padding: 42px 24px 26px;\r\n\r\n    background:\r\n      linear-gradient(\r\n        180deg,\r\n        #ffffff 0%,\r\n        #f7f9fb 100%\r\n      );\r\n  }\r\n\r\n  .hdm-truck-media::before {\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n    right: -77px;\r\n    bottom: -102px;\r\n\r\n    width: 235px;\r\n    height: 235px;\r\n\r\n    border: 1px solid rgba(53, 113, 158, 0.26);\r\n\r\n    transform: rotate(54deg);\r\n    transform-origin: center;\r\n\r\n    transition:\r\n      transform 0.46s cubic-bezier(0.22, 1, 0.36, 1),\r\n      border-color 0.3s ease;\r\n  }\r\n\r\n  .hdm-truck-media::after {\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n    left: 28px;\r\n    bottom: 24px;\r\n\r\n    width: 120px;\r\n    height: 4px;\r\n\r\n    background: var(--hdm-blue);\r\n\r\n    transition:\r\n      width 0.34s ease,\r\n      transform 0.34s ease;\r\n  }\r\n\r\n  .hdm-truck-card:hover .hdm-truck-media::before {\r\n    border-color: rgba(53, 113, 158, 0.42);\r\n\r\n    transform: rotate(60deg) scale(1.06);\r\n  }\r\n\r\n  .hdm-truck-card:hover .hdm-truck-media::after {\r\n    width: 145px;\r\n\r\n    transform: translateX(4px);\r\n  }\r\n\r\n  \/* =========================================================\r\n     ETIQUETA\r\n     ========================================================= *\/\r\n\r\n  .hdm-truck-label {\r\n    position: absolute;\r\n    top: 18px;\r\n    left: 24px;\r\n    z-index: 3;\r\n\r\n    min-height: 30px;\r\n    padding: 8px 12px;\r\n\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    color: var(--hdm-white);\r\n    background: var(--hdm-navy);\r\n\r\n    box-shadow: 4px 4px 0 rgba(53, 113, 158, 0.25);\r\n\r\n    font-size: 10px;\r\n    font-weight: 900;\r\n    line-height: 1;\r\n    letter-spacing: 0.05em;\r\n    text-transform: uppercase;\r\n\r\n    transition:\r\n      transform 0.3s ease,\r\n      box-shadow 0.3s ease;\r\n  }\r\n\r\n  .hdm-truck-card:hover .hdm-truck-label {\r\n    transform: translate(-2px, -2px);\r\n\r\n    box-shadow: 6px 6px 0 rgba(53, 113, 158, 0.30);\r\n  }\r\n\r\n  \/* =========================================================\r\n     IMAGEN DEL CAMI\u00d3N\r\n     ========================================================= *\/\r\n\r\n  .hdm-truck-image {\r\n    position: relative;\r\n    z-index: 2;\r\n\r\n    display: block;\r\n\r\n    width: 100%;\r\n    max-width: 326px;\r\n    height: 205px;\r\n\r\n    object-fit: contain;\r\n    object-position: center;\r\n\r\n    filter:\r\n      drop-shadow(0 18px 16px rgba(0, 44, 95, 0.17));\r\n\r\n    transform: translate3d(0, 0, 0) scale(1);\r\n\r\n    transition:\r\n      transform 0.46s cubic-bezier(0.22, 1, 0.36, 1),\r\n      filter 0.34s ease;\r\n  }\r\n\r\n  .hdm-truck-card:hover .hdm-truck-image {\r\n    transform: translate3d(-2px, -7px, 0) scale(1.055);\r\n\r\n    filter:\r\n      drop-shadow(8px 24px 18px rgba(0, 44, 95, 0.23));\r\n  }\r\n\r\n  \/* =========================================================\r\n     CONTENIDO\r\n     ========================================================= *\/\r\n\r\n  .hdm-truck-content {\r\n    flex: 1;\r\n    min-width: 0;\r\n\r\n    display: flex;\r\n    flex-direction: column;\r\n\r\n    padding: 29px 28px 27px;\r\n\r\n    border-top: 1px solid rgba(0, 44, 95, 0.11);\r\n  }\r\n\r\n  .hdm-truck-category {\r\n    display: block;\r\n\r\n    margin-bottom: 13px;\r\n\r\n    color: var(--hdm-blue);\r\n\r\n    font-size: 11px;\r\n    font-weight: 900;\r\n    line-height: 1;\r\n    letter-spacing: 0.10em;\r\n    text-transform: uppercase;\r\n  }\r\n\r\n  .hdm-truck-name {\r\n    margin: 0;\r\n\r\n    color: var(--hdm-navy);\r\n\r\n    font-size: 38px;\r\n    font-weight: 900;\r\n    line-height: 1;\r\n    letter-spacing: -0.035em;\r\n  }\r\n\r\n  .hdm-truck-description {\r\n    margin: 19px 0 0;\r\n\r\n    color: var(--hdm-text);\r\n\r\n    font-size: 14px;\r\n    font-weight: 400;\r\n    line-height: 1.65;\r\n  }\r\n\r\n  \/* =========================================================\r\n     BOT\u00d3N\r\n     ========================================================= *\/\r\n\r\n  .hdm-truck-action {\r\n    width: 100%;\r\n    margin-top: auto;\r\n    padding-top: 29px;\r\n\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: space-between;\r\n    gap: 16px;\r\n\r\n    color: var(--hdm-navy);\r\n    text-decoration: none;\r\n\r\n    font-size: 12px;\r\n    font-weight: 900;\r\n    line-height: 1;\r\n    letter-spacing: 0.035em;\r\n    text-transform: uppercase;\r\n  }\r\n\r\n  .hdm-truck-action-text {\r\n    position: relative;\r\n\r\n    padding-bottom: 8px;\r\n  }\r\n\r\n  .hdm-truck-action-text::after {\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n    right: 0;\r\n    bottom: 0;\r\n    left: 0;\r\n\r\n    height: 2px;\r\n\r\n    background: var(--hdm-blue);\r\n\r\n    transform: scaleX(1);\r\n    transform-origin: left center;\r\n\r\n    transition: transform 0.28s ease;\r\n  }\r\n\r\n  .hdm-truck-action:hover .hdm-truck-action-text::after {\r\n    transform: scaleX(0.70);\r\n  }\r\n\r\n  .hdm-truck-arrow {\r\n    width: 38px;\r\n    height: 38px;\r\n    flex: 0 0 auto;\r\n\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    color: var(--hdm-white);\r\n    background: var(--hdm-navy);\r\n\r\n    border: 1px solid var(--hdm-navy);\r\n\r\n    box-shadow: 3px 3px 0 rgba(53, 113, 158, 0.25);\r\n\r\n    font-size: 16px;\r\n\r\n    transition:\r\n      transform 0.28s ease,\r\n      box-shadow 0.28s ease,\r\n      background-color 0.28s ease;\r\n  }\r\n\r\n  .hdm-truck-action:hover .hdm-truck-arrow,\r\n  .hdm-truck-action:focus-visible .hdm-truck-arrow {\r\n    background: var(--hdm-blue);\r\n\r\n    transform: translate(-2px, -2px);\r\n\r\n    box-shadow: 5px 5px 0 var(--hdm-navy);\r\n  }\r\n\r\n  .hdm-truck-action:focus-visible {\r\n    outline: 3px solid rgba(53, 113, 158, 0.36);\r\n    outline-offset: 5px;\r\n  }\r\n\r\n  \/* =========================================================\r\n     RESPONSIVE\r\n     ========================================================= *\/\r\n\r\n  @media (max-width: 440px) {\r\n    .hdm-card-stage {\r\n      --hdm-depth-x: 6px;\r\n      --hdm-depth-y: 6px;\r\n    }\r\n\r\n    .hdm-truck-media {\r\n      min-height: 260px;\r\n    }\r\n\r\n    .hdm-truck-image {\r\n      height: 190px;\r\n    }\r\n\r\n    .hdm-truck-content {\r\n      padding: 27px 24px 25px;\r\n    }\r\n\r\n    .hdm-truck-name {\r\n      font-size: 36px;\r\n    }\r\n  }\r\n\r\n  \/* =========================================================\r\n     ACCESIBILIDAD\r\n     ========================================================= *\/\r\n\r\n  @media (prefers-reduced-motion: reduce) {\r\n    .hdm-card-stage .hdm-truck-card,\r\n    .hdm-card-stage .hdm-truck-media::before,\r\n    .hdm-card-stage .hdm-truck-media::after,\r\n    .hdm-card-stage .hdm-truck-label,\r\n    .hdm-card-stage .hdm-truck-image,\r\n    .hdm-card-stage .hdm-truck-action-text::after,\r\n    .hdm-card-stage .hdm-truck-arrow {\r\n      transition: none;\r\n    }\r\n  }\r\n<\/style>\r\n\r\n<div class=\"hdm-card-stage\">\r\n\r\n  <article class=\"hdm-truck-card\">\r\n\r\n    <div class=\"hdm-truck-media\">\r\n\r\n      <span class=\"hdm-truck-label\">\r\n        Hyundai Trucks\r\n      <\/span>\r\n\r\n      <img loading=\"lazy\" decoding=\"async\"\r\n        class=\"hdm-truck-image\"\r\n        src=\"https:\/\/new.hyundaidemagna.com\/wp-content\/uploads\/2026\/07\/XCIENT-GT.png\"\r\n        alt=\"Cami\u00f3n Hyundai HF78GT\"\r\n        width=\"700\"\r\n        height=\"440\"\r\n        loading=\"lazy\"\r\n      >\r\n\r\n    <\/div>\r\n\r\n    <div class=\"hdm-truck-content\">\r\n\r\n      <span class=\"hdm-truck-category\">\r\n        Cami\u00f3n pesado\r\n      <\/span>\r\n\r\n      <h2 class=\"hdm-truck-name\">\r\n        HF78GT\r\n      <\/h2>\r\n\r\n      <p class=\"hdm-truck-description\">\r\n        Una soluci\u00f3n robusta y confiable para operaciones de alta exigencia,\r\n        dise\u00f1ada para ofrecer capacidad, eficiencia y desempe\u00f1o en cada jornada.\r\n      <\/p>\r\n\r\n      <a\r\n        class=\"hdm-truck-action\"\r\n        href=\"\/camiones\/xcient\/\"\r\n        aria-label=\"Conocer el cami\u00f3n Hyundai HF78GT\"\r\n      >\r\n        <span class=\"hdm-truck-action-text\">\r\n          Conocer modelo\r\n        <\/span>\r\n\r\n        <span\r\n          class=\"hdm-truck-arrow\"\r\n          aria-hidden=\"true\"\r\n        >\r\n          \u2192\r\n        <\/span>\r\n      <\/a>\r\n\r\n    <\/div>\r\n\r\n  <\/article>\r\n\r\n<\/div>\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-f83d01b e-con e-atomic-element e-div-block-base \" data-id=\"f83d01b\" data-element_type=\"e-div-block\" data-e-type=\"e-div-block\" data-interaction-id=\"f83d01b\" data-e-type=\"e-div-block\" data-id=\"f83d01b\">\n    \n<\/div>\n\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-68590ca e-grid e-con-boxed e-con e-parent\" data-id=\"68590ca\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-f80a685 e-con-full e-flex e-con e-child\" data-id=\"f80a685\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5d48130 elementor-widget elementor-widget-html\" data-id=\"5d48130\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n  .hdm-advisor-cta-section {\r\n    --hdm-navy: #002c5f;\r\n    --hdm-blue: #35719e;\r\n    --hdm-white: #ffffff;\r\n\r\n    \/* Fondo exterior blanco *\/\r\n    --hdm-background: #ffffff;\r\n\r\n    --hdm-text-soft: rgba(255, 255, 255, 0.78);\r\n    --hdm-focus: rgba(255, 255, 255, 0.45);\r\n\r\n    position: relative;\r\n    isolation: isolate;\r\n\r\n    width: 100%;\r\n    min-width: 0;\r\n    overflow: hidden;\r\n\r\n    margin: 0;\r\n    padding: 40px 42px 92px;\r\n\r\n    background-color: var(--hdm-background) !important;\r\n\r\n    font-family: Arial, Helvetica, sans-serif;\r\n  }\r\n\r\n  .hdm-advisor-cta-section,\r\n  .hdm-advisor-cta-section * {\r\n    box-sizing: border-box;\r\n  }\r\n\r\n  \/* Figura geom\u00e9trica superior *\/\r\n  .hdm-advisor-cta-section::before {\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n    top: -115px;\r\n    right: -135px;\r\n    z-index: 0;\r\n\r\n    width: 350px;\r\n    height: 350px;\r\n\r\n    border: 1px solid rgba(0, 44, 95, 0.08);\r\n\r\n    transform: rotate(17deg);\r\n\r\n    pointer-events: none;\r\n  }\r\n\r\n  \/* Figura geom\u00e9trica inferior *\/\r\n  .hdm-advisor-cta-section::after {\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n    right: 8%;\r\n    bottom: -250px;\r\n    z-index: 0;\r\n\r\n    width: 430px;\r\n    height: 430px;\r\n\r\n    border: 1px solid rgba(0, 44, 95, 0.05);\r\n\r\n    transform: rotate(17deg);\r\n\r\n    pointer-events: none;\r\n  }\r\n\r\n\r\n  .hdm-advisor-cta {\r\n    position: relative;\r\n    z-index: 1;\r\n\r\n    width: 100%;\r\n    max-width: 1180px;\r\n    min-width: 0;\r\n    min-height: 162px;\r\n\r\n    margin: 0 auto;\r\n    padding: 34px 38px;\r\n\r\n    display: grid;\r\n    grid-template-columns: minmax(0, 1fr) auto;\r\n    align-items: center;\r\n    gap: 42px;\r\n\r\n    background-color: var(--hdm-navy);\r\n\r\n    border-left: 5px solid var(--hdm-blue);\r\n    border-radius: 1px;\r\n  }\r\n\r\n  .hdm-advisor-cta-content {\r\n    min-width: 0;\r\n  }\r\n\r\n\r\n\r\n  .hdm-advisor-cta-title {\r\n    margin: 0;\r\n\r\n    color: var(--hdm-white);\r\n\r\n    font-size: clamp(30px, 3vw, 36px);\r\n    font-weight: 900;\r\n    line-height: 1.08;\r\n    letter-spacing: -0.035em;\r\n  }\r\n\r\n  .hdm-advisor-cta-text {\r\n    max-width: 760px;\r\n\r\n    margin: 12px 0 0;\r\n\r\n    color: var(--hdm-text-soft);\r\n\r\n    font-size: 15px;\r\n    font-weight: 400;\r\n    line-height: 1.6;\r\n  }\r\n\r\n\r\n  .hdm-advisor-cta-button {\r\n    min-width: 210px;\r\n    min-height: 54px;\r\n\r\n    padding: 15px 24px;\r\n\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    gap: 12px;\r\n\r\n    color: var(--hdm-navy);\r\n    background-color: var(--hdm-white);\r\n\r\n    border: 2px solid var(--hdm-white);\r\n    border-radius: 2px;\r\n\r\n    text-decoration: none;\r\n\r\n    font-size: 14px;\r\n    font-weight: 900;\r\n    line-height: 1;\r\n    white-space: nowrap;\r\n\r\n    transition:\r\n      color 0.25s ease,\r\n      background-color 0.25s ease,\r\n      border-color 0.25s ease,\r\n      transform 0.25s ease,\r\n      box-shadow 0.25s ease;\r\n  }\r\n\r\n  .hdm-advisor-cta-arrow {\r\n    display: inline-block;\r\n\r\n    font-size: 17px;\r\n    line-height: 1;\r\n\r\n    transition: transform 0.25s ease;\r\n  }\r\n\r\n  .hdm-advisor-cta-button:hover,\r\n  .hdm-advisor-cta-button:focus-visible {\r\n    color: var(--hdm-white);\r\n\r\n    background-color: var(--hdm-blue);\r\n    border-color: var(--hdm-blue);\r\n\r\n    transform: translate(-3px, -3px);\r\n\r\n    box-shadow: 6px 6px 0 rgba(255, 255, 255, 0.22);\r\n  }\r\n\r\n  .hdm-advisor-cta-button:hover .hdm-advisor-cta-arrow,\r\n  .hdm-advisor-cta-button:focus-visible .hdm-advisor-cta-arrow {\r\n    transform: translateX(4px);\r\n  }\r\n\r\n  .hdm-advisor-cta-button:focus-visible {\r\n    outline: 3px solid var(--hdm-focus);\r\n    outline-offset: 4px;\r\n  }\r\n\r\n\r\n  @media (max-width: 900px) {\r\n    .hdm-advisor-cta-section {\r\n      padding-right: 24px;\r\n      padding-left: 24px;\r\n    }\r\n\r\n    .hdm-advisor-cta {\r\n      grid-template-columns: 1fr;\r\n      gap: 26px;\r\n    }\r\n\r\n    .hdm-advisor-cta-button {\r\n      width: fit-content;\r\n    }\r\n  }\r\n\r\n\r\n  @media (max-width: 600px) {\r\n    .hdm-advisor-cta-section {\r\n      padding: 24px 16px 64px;\r\n    }\r\n\r\n    .hdm-advisor-cta {\r\n      min-height: auto;\r\n      padding: 30px 24px;\r\n      gap: 24px;\r\n    }\r\n\r\n    .hdm-advisor-cta-title {\r\n      font-size: clamp(26px, 8vw, 33px);\r\n    }\r\n\r\n    .hdm-advisor-cta-text {\r\n      font-size: 14px;\r\n    }\r\n\r\n    .hdm-advisor-cta-button {\r\n      width: 100%;\r\n      min-width: 0;\r\n    }\r\n  }\r\n\r\n\r\n  @media (prefers-reduced-motion: reduce) {\r\n    .hdm-advisor-cta-button,\r\n    .hdm-advisor-cta-arrow {\r\n      transition: none;\r\n    }\r\n  }\r\n<\/style>\r\n\r\n<section\r\n  class=\"hdm-advisor-cta-section\"\r\n  aria-labelledby=\"hdm-advisor-cta-title\"\r\n>\r\n  <div class=\"hdm-advisor-cta\">\r\n\r\n    <div class=\"hdm-advisor-cta-content\">\r\n\r\n      <h2\r\n        class=\"hdm-advisor-cta-title\"\r\n        id=\"hdm-advisor-cta-title\"\r\n      >\r\n        \u00bfNo sabes qu\u00e9 cami\u00f3n elegir?\r\n      <\/h2>\r\n\r\n      <p class=\"hdm-advisor-cta-text\">\r\n        Cu\u00e9ntanos sobre tu operaci\u00f3n y nuestro equipo comercial te ayudar\u00e1\r\n        a encontrar el modelo m\u00e1s adecuado para las necesidades de tu empresa.\r\n      <\/p>\r\n\r\n    <\/div>\r\n\r\n    <a\r\n      class=\"hdm-advisor-cta-button\"\r\n      href=\"#contacto\"\r\n      aria-label=\"Hablar con un asesor comercial\"\r\n    >\r\n      Hablar con un asesor\r\n\r\n      <span\r\n        class=\"hdm-advisor-cta-arrow\"\r\n        aria-hidden=\"true\"\r\n      >\r\n        \u2192\r\n      <\/span>\r\n    <\/a>\r\n\r\n  <\/div>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Camion 1 Texto sobre camion 1 Conoce m\u00e1s \u2192 Hyundai Magna \u2014 Encabezado de operaciones NUESTRA L\u00cdNEA DE CAMIONES Encuentra el cami\u00f3n ideal para tu&hellip;<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"_customify_content_layout":"full-stretched","_customify_sidebar":"","_customify_page_header_display":"","_customify_disable_header":"","_customify_disable_header_top":"","_customify_disable_header_main":"","_customify_disable_header_bottom":"","_customify_disable_page_title":"","_customify_disable_content_vertical_padding":"","_customify_disable_footer_top":"","_customify_disable_footer_main":"","_customify_disable_footer_bottom":"","_customify_breadcrumb_display":"","_customify_header_transparent_display":"","footnotes":""},"class_list":["post-887","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/new.hyundaidemagna.com\/index.php?rest_route=\/wp\/v2\/pages\/887","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/new.hyundaidemagna.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/new.hyundaidemagna.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/new.hyundaidemagna.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/new.hyundaidemagna.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=887"}],"version-history":[{"count":5,"href":"https:\/\/new.hyundaidemagna.com\/index.php?rest_route=\/wp\/v2\/pages\/887\/revisions"}],"predecessor-version":[{"id":1331,"href":"https:\/\/new.hyundaidemagna.com\/index.php?rest_route=\/wp\/v2\/pages\/887\/revisions\/1331"}],"wp:attachment":[{"href":"https:\/\/new.hyundaidemagna.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=887"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}