{"id":62631,"date":"2026-09-02T15:35:04","date_gmt":"2026-09-02T13:35:04","guid":{"rendered":"https:\/\/www.serviscomplet.com\/?page_id=62631"},"modified":"2026-09-02T15:59:30","modified_gmt":"2026-09-02T13:59:30","slug":"elementor-62631","status":"publish","type":"page","link":"https:\/\/www.serviscomplet.com\/en\/elementor-62631\/","title":{"rendered":"Elementor #62631"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"62631\" class=\"elementor elementor-62631\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-48090ed e-flex e-con-boxed wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no wpr-column-slider-no wpr-equal-height-no e-con e-parent\" data-id=\"48090ed\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-402ad01 elementor-widget elementor-widget-html\" data-id=\"402ad01\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n     LANDING GOOGLE ADS \u00b7 SERVIS \u00b7 versi\u00f3n para widget HTML de Elementor\r\n\r\n     GENERADO AUTOM\u00c1TICAMENTE. No editar este archivo: los cambios se\r\n     hacen en servis-landing-propuesta.html y se vuelve a lanzar\r\n         python construir-embed-elementor.py\r\n\r\n     C\u00d3MO SE PEGA\r\n       1. Crea la p\u00e1gina y ponle plantilla \u00abElementor Canvas\u00bb\r\n          (Ajustes de p\u00e1gina \u2192 Dise\u00f1o de p\u00e1gina \u2192 Elemental lienzo).\r\n          Canvas quita cabecera y pie; sin eso la landing sale metida\r\n          dentro del tema.\r\n       2. Un solo widget HTML a lo ancho, sin columnas ni m\u00e1rgenes.\r\n       3. En ese contenedor: relleno 0, margen 0 y overflow \u00abvisible\u00bb.\r\n          Lo del overflow importa: si no, la barra fija de arriba deja\r\n          de quedarse fija. El aviso del final te lo dir\u00e1 por consola.\r\n       4. Pega TODO este archivo.\r\n\r\n     La fuente Poppins no se pide aqu\u00ed: ya la carga la web.\r\n     \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\r\n\r\n<div class=\"lp-embed\">\r\n\r\n<style>\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n   ESCUDO \u00b7 neutraliza lo que el tema y Elementor le hacen a estos elementos.\r\n   Va todo con :where(), que tiene ESPECIFICIDAD CERO: gana a los estilos del\r\n   tema por ser m\u00e1s espec\u00edfico en el selector de la ra\u00edz, pero NO le gana a\r\n   ninguna regla propia de la landing, aunque est\u00e9 escrita m\u00e1s arriba.\r\n   Es la lecci\u00f3n del formulario incrustado: un escudo con especificidad normal\r\n   dej\u00f3 el bot\u00f3n principal sin fondo porque le ganaba a su propia regla.\r\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n.lp-embed{font-family:'Poppins',system-ui,sans-serif;font-size:16px;line-height:1.55;\r\n  text-align:left;letter-spacing:normal;text-transform:none}\r\n:where(.lp-embed) :where(h1,h2,h3,h4,h5,h6,p,ul,ol,li,figure,blockquote,dl,dd){\r\n  margin:0;padding:0;font:inherit;color:inherit;letter-spacing:inherit;\r\n  text-transform:none;text-align:inherit}\r\n:where(.lp-embed) :where(ul,ol){list-style:none}\r\n:where(.lp-embed) :where(a){text-decoration:none;color:inherit;box-shadow:none;\r\n  transition:none;border:0}\r\n:where(.lp-embed) :where(button,input,select,textarea){font:inherit;color:inherit;\r\n  margin:0;-webkit-appearance:none;appearance:none;box-shadow:none;\r\n  text-transform:none;letter-spacing:normal;border-radius:0}\r\n:where(.lp-embed) :where(button){border:0;background:none;cursor:pointer;\r\n  width:auto;min-height:0;text-align:inherit}\r\n:where(.lp-embed) :where(img,video,iframe){max-width:100%;height:auto;border:0;\r\n  border-radius:0;box-shadow:none}\r\n:where(.lp-embed) :where(details,summary){margin:0;padding:0;background:none;border:0}\r\n:where(.lp-embed) :where(summary){list-style:none}\r\n\/* Elementor mete su propio relleno en el widget; aqu\u00ed sobra.\r\n   OJO: esta regla apunta SOLO al widget, nunca a .lp-embed. Tenerla apuntando\r\n   tambi\u00e9n a \u00ab.elementor-widget-html .lp-embed\u00bb \u2014dos clases, (0,2,0)\u2014 le ganaba\r\n   a la regla de ancho completo de abajo, que es (0,1,0), y le pon\u00eda margin:0.\r\n   Resultado: la landing segu\u00eda encajonada y costaba ver por qu\u00e9, porque la\r\n   regla del ancho completo estaba bien escrita y era la \u00faltima. *\/\r\n.elementor-widget-html:has(> .lp-embed){padding:0}\r\n\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n   TOKENS \u00b7 combinaci\u00f3n de \/get-your-stand-servis\/, muestreada de la p\u00e1gina.\r\n     #43B02A  verde principal   \u00b7 texto (23 usos), bordes (5) y fondos (3)\r\n     #2A7A1C  verde oscuro\r\n     #BEE0B8  verde claro\r\n     #040C03  casi negro\r\n     #4A4A4A  gris de texto\r\n     #FFFFFF \u00b7 #FAFBF9 \u00b7 #F3F9F1 \u00b7 #EDF6EA   escala de fondos\r\n     #E2E2E2  l\u00ednea\r\n\r\n   Dos cambios sobre esa combinaci\u00f3n, los dos por contraste:\r\n     \u00b7 El gris dominante de esa p\u00e1gina, #818181 (134 usos), da 3.9:1 sobre\r\n       blanco. El texto necesita 4.5:1. Aqu\u00ed el secundario es #6E6E6E.\r\n     \u00b7 #43B02A con texto blanco da 2.81:1, as\u00ed que el bot\u00f3n lleva el texto\r\n       en #040C03 (7.1:1) y en hover pasa a fondo #2A7A1C con blanco (5.4:1).\r\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n\r\n.lp-embed{\r\n  \/* Muestreados de \/get-your-stand-servis\/ *\/\r\n  --g:#43B02A;          \/* VERDE DE SERVIS \u00b7 acento del titular, bot\u00f3n,\r\n                           bordes, iconos y barra de progreso *\/\r\n  --gd:#2E7D1B;         \/* el mismo verde oscurecido, solo para TEXTO PEQUE\u00d1O\r\n                           (5.2:1). #43B02A a 15px dar\u00eda 2.8:1 y no se lee. *\/\r\n  --gl:#BEE0B8;         \/* verde claro *\/\r\n  --ink:#040C03;        \/* casi negro \u00b7 19.8:1 *\/\r\n  --text:#4A4A4A;       \/* texto de cuerpo \u00b7 8.9:1 *\/\r\n  --paper:#FFFFFF;\r\n  --off:#FAFBF9;        \/* off-white *\/\r\n  --tint:#F3F9F1;       \/* tinte verde suave \u00b7 fondo del panel *\/\r\n  --tint-2:#EDF6EA;     \/* tinte verde marcado \u00b7 estado elegido *\/\r\n  --line:#E2E2E2;\r\n\r\n  \/* Dos ajustes sobre esa paleta, ambos por contraste:\r\n     \u00b7 Su gris de cuerpo dominante #818181 da 3.9:1 sobre blanco, por debajo\r\n       del 4.5:1 que exige el texto. Aqu\u00ed el secundario es #6E6E6E \u2192 5.1:1\r\n       sobre blanco, 4.8:1 sobre el tinte y 4.6:1 sobre el tinte marcado.\r\n     \u00b7 #43B02A con texto blanco da 2.81:1. El bot\u00f3n lleva texto en --ink\r\n       (7.1:1) y al pasar por encima cambia a --gd con blanco (5.4:1). *\/\r\n  --muted:#6E6E6E;\r\n  --tint-3:#E4F1DF;     \/* derivado \u00b7 hover sobre una opci\u00f3n ya elegida *\/\r\n  --danger:#B3261E;\r\n\r\n  --e-out:cubic-bezier(.22,1,.36,1);\r\n  --e-spr:cubic-bezier(.16,1,.3,1);\r\n}\r\n\r\n.lp-embed *,.lp-embed *::before,.lp-embed *::after{box-sizing:border-box}\r\n\/* text-size-adjust: lo pone el tema en <html>, aqu\u00ed no toca *\/\r\n\r\n.lp-embed{margin:0;background:var(--paper);color:var(--text);\r\n  font-family:'Poppins',system-ui,sans-serif;font-size:16px;line-height:1.55;\r\n  font-variant-numeric:tabular-nums}\r\n\r\n.lp-embed img{max-width:100%;display:block}\r\n\r\n\r\n.lp-embed .sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}\r\n\r\n.lp-embed .step{display:none} \r\n.lp-embed .step.is-on{display:block;animation:step-in .5s var(--e-out) both}\r\n@keyframes step-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}\r\n\r\n.lp-embed .err{display:none;margin-top:10px;font-size:13.5px;font-weight:500;color:var(--danger)}\r\n\r\n.lp-embed .err.is-on{display:block;animation:step-in .3s var(--e-out) both}\r\n\r\n.lp-embed [data-invalid=\"true\"]{border-color:var(--danger)!important}\r\n@media (prefers-reduced-motion:reduce){\r\n  \r\n.lp-embed *,.lp-embed *::before,.lp-embed *::after{animation-duration:.01ms!important;transition-duration:.01ms!important}\r\n  \r\n.lp-embed .step.is-on{animation:none}\r\n}\r\n\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n   SECCI\u00d3N\r\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n\r\n.lp-embed .sx{--pad:clamp(24px,3.6vw,52px);background:var(--paper);\r\n  padding:clamp(34px,6vw,76px) clamp(16px,4vw,48px)}\r\n\r\n.lp-embed .sx__shell{max-width:1160px;margin:0 auto;display:grid;\r\n  grid-template-columns:minmax(0,1fr) minmax(0,1fr);\r\n  border-radius:32px;overflow:hidden;background:var(--paper);\r\n  box-shadow:0 1px 2px rgba(16,33,12,.04), 0 24px 60px -34px rgba(16,33,12,.22)}\r\n@media(max-width:940px){\r\n.lp-embed .sx__shell{grid-template-columns:1fr;border-radius:26px}}\r\n\r\n\r\n\/* \u2500\u2500 PANEL VISUAL (izquierda) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\r\n\r\n.lp-embed .sx__visual{position:relative;padding:var(--pad);display:flex;flex-direction:column;gap:20px;\r\n  background:var(--tint)}\r\n\r\n\/* Titular y escenario comparten celda de grid: los dos siguen ocupando sitio\r\n   aunque solo se vea uno, as\u00ed que el panel mide siempre lo que el m\u00e1s alto y\r\n   NO hay salto de maqueta al pasar del paso 2 al 3. Sin min-height a ojo. *\/\r\n\r\n.lp-embed .sx__swap{display:grid}\r\n\r\n.lp-embed .sx__swap > *{grid-area:1\/1}\r\n\r\n.lp-embed .sx__swap > .sx--off{opacity:0;visibility:hidden;pointer-events:none;\r\n  transition:opacity .35s var(--e-out),visibility 0s linear .35s}\r\n\r\n.lp-embed .sx__swap > :not(.sx--off){opacity:1;visibility:visible;\r\n  transition:opacity .4s var(--e-out);transition-delay:0s}\r\n\r\n\r\n\/* \u2500\u2500 Titular de los pasos 1\u20132 \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n   Mismo mecanismo que el hero de la web (servis-hero-ads-EN_1.html):\r\n   cada l\u00ednea entra con translateY(115%) + blur, escalonada .35s.\r\n   El acento va en --gd y no en el --gl del hero porque aqu\u00ed el fondo es\r\n   claro: --gl dar\u00eda 1.5:1 y ser\u00eda ilegible. --gd da 7.1:1.\r\n   \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\r\n\r\n.lp-embed .sx__lead{align-self:start;display:flex;flex-direction:column}\r\n\r\n.lp-embed .sx__h{font-size:clamp(23px,2.9vw,38px);font-weight:700;line-height:1.08;letter-spacing:-.035em;\r\n  margin:0;color:var(--ink)}\r\n\/* La \u00faltima l\u00ednea pesa lo mismo que la pregunta: mismo cuerpo, mismo peso.\r\n   Solo cambia el color, que es lo que la marca como la promesa. *\/\r\n\/* Acento del titular en el verde de Servis puro. A 38px\/700 es texto grande;\r\n   da 2.8:1 sobre el tinte, algo por debajo del 3:1 de referencia, pero es el\r\n   color de marca y aqu\u00ed manda la marca. *\/\r\n\r\n.lp-embed .sx__h em{font-style:italic;color:var(--g)}\r\n\r\n.lp-embed .sx__line{overflow:hidden;display:block;line-height:1.1}\r\n\r\n.lp-embed .sx__line-in{display:block;transform:translateY(115%);opacity:0;filter:blur(8px);\r\n  animation:sx-up .9s var(--e-spr) forwards}\r\n\r\n.lp-embed .sx__line:nth-child(1) .sx__line-in{animation-delay:.10s}\r\n\r\n.lp-embed .sx__line:nth-child(2) .sx__line-in{animation-delay:.40s}\r\n\r\n.lp-embed .sx__line:nth-child(3) .sx__line-in{animation-delay:.70s}\r\n\r\n.lp-embed .sx__line:nth-child(4) .sx__line-in{animation-delay:1.05s}\r\n\r\n.lp-embed .sx__line--gap{margin-top:.5em}\r\n@keyframes sx-up{to{transform:translateY(0);opacity:1;filter:blur(0)}}\r\n\/* Aclaraci\u00f3n de alcance: entra la \u00faltima, despu\u00e9s de la cascada del titular. *\/\r\n\r\n.lp-embed .sx__aclara{margin:clamp(16px,1.9vw,24px) 0 0;max-width:46ch;\r\n  font-size:14.5px;line-height:1.6;color:var(--muted);\r\n  opacity:0;transform:translateY(10px);animation:sx-nota .8s var(--e-out) 1.4s forwards}\r\n\r\n.lp-embed .sx__aclara b{font-weight:600;color:var(--gd)}\r\n@keyframes sx-nota{to{opacity:1;transform:none}}\r\n\r\n.lp-embed .sx__lead ~ .sx__specs{margin-top:34px}\r\n\r\n\/* Escenario: aloja el estado inicial, la ilustraci\u00f3n y el plano *\/\r\n\r\n.lp-embed .sx__stage{position:relative;border-radius:22px;background:var(--paper);\r\n  aspect-ratio:16\/9;overflow:hidden;display:grid;place-items:center;align-self:start;\r\n  box-shadow:0 1px 3px rgba(16,33,12,.05)}\r\n\r\n.lp-embed .sx__layer{position:absolute;inset:0;display:grid;place-items:center;padding:12px;\r\n  opacity:0;visibility:hidden;transform:scale(.99);\r\n  transition:opacity .45s var(--e-out),transform .55s var(--e-out),visibility 0s linear .45s}\r\n\r\n.lp-embed .sx__layer.is-on{opacity:1;visibility:visible;transform:none;transition-delay:0s}\r\n\r\n\/* Escenario a la espera de que se elija n\u00famero de paredes *\/\r\n\r\n.lp-embed .sx__empty{text-align:center;padding:clamp(20px,3vw,36px);font-size:15px;color:var(--muted);\r\n  max-width:28ch;margin-inline:auto;text-wrap:pretty;line-height:1.5}\r\n\r\n\/* Ilustraciones de paredes \u2014 object-fit:contain, NUNCA cover *\/\r\n\r\n.lp-embed .sx__ills{position:absolute;inset:0}\r\n\r\n.lp-embed .sx__ill{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;\r\n  opacity:0;transform:scale(1.015);transition:opacity .45s var(--e-out),transform .6s var(--e-out)}\r\n\r\n.lp-embed .sx__ill.is-on{opacity:1;transform:none}\r\n\r\n\/* Plano en vivo \u00b7 sin brillos ni sombras duras *\/\r\n\r\n.lp-embed .sx__svg{width:100%;height:100%;max-height:100%;overflow:visible}\r\n\r\n.lp-embed .sx__floor{fill:rgba(67,176,42,.07);stroke:none}\r\n\r\n.lp-embed .sx__wall{stroke:var(--g);stroke-width:6;stroke-linecap:round;fill:none}\r\n\r\n.lp-embed .sx__open{stroke:#D3E2CE;stroke-width:1.5;stroke-dasharray:5 6;stroke-linecap:round;fill:none}\r\n\r\n.lp-embed .sx__dim{stroke:#D3E2CE;stroke-width:1}\r\n\r\n.lp-embed .sx__dimtxt{font-family:'Poppins',sans-serif;font-size:12px;font-weight:500;fill:var(--muted)}\r\n\r\n\r\n.lp-embed .sx__cap{margin:0;min-height:19px;font-size:13px;color:var(--muted);transition:opacity .3s var(--e-out)}\r\n\r\n.lp-embed .sx__cap b{color:var(--text);font-weight:500}\r\n\r\n\/* Resumen \u00b7 sin caja, solo una l\u00ednea de aire *\/\r\n\r\n.lp-embed .sx__specs{list-style:none;margin:4px 0 0;padding:20px 0 0;border-top:1px solid var(--line);\r\n  display:flex;flex-wrap:wrap;gap:14px 32px}\r\n\r\n.lp-embed .sx__specs li{display:flex;flex-direction:column;gap:3px}\r\n\r\n.lp-embed .sx__specs li span{color:var(--muted);font-size:11px;letter-spacing:.01em}\r\n\r\n.lp-embed .sx__specs li b{color:var(--ink);font-weight:500;font-size:14px}\r\n\r\n.lp-embed .sx__specs li b.is-empty{color:var(--muted);font-weight:400}\r\n\r\n\r\n.lp-embed .sx__facts{list-style:none;margin:auto 0 0;padding:20px 0 0;border-top:1px solid var(--line);display:grid;gap:9px}\r\n\r\n.lp-embed .sx__facts li{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--muted);line-height:1.45}\r\n\r\n.lp-embed .sx__facts svg{flex:none;margin-top:3px;color:var(--g)}\r\n\r\n\r\n\/* \u2500\u2500 PANEL FORMULARIO (derecha) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\r\n\r\n.lp-embed .sx__main{padding:var(--pad);display:flex;flex-direction:column;min-height:560px;background:var(--paper)}\r\n\r\n\r\n.lp-embed .sx__rail{display:flex;align-items:center;gap:16px;margin-bottom:10px}\r\n\r\n.lp-embed .sx__track{position:relative;flex:1;height:3px;background:var(--line);border-radius:99px;overflow:hidden}\r\n\r\n.lp-embed .sx__fill{position:absolute;inset:0 auto 0 0;width:20%;background:var(--g);border-radius:99px;\r\n  transition:width .55s var(--e-out)}\r\n\r\n.lp-embed .sx__count{font-size:12.5px;color:var(--muted);white-space:nowrap;margin:0}\r\n\r\n.lp-embed .sx__count b{color:var(--ink);font-weight:500}\r\n\r\n.lp-embed .sx__legend{margin:0 0 28px;font-size:12.5px;color:var(--muted)}\r\n\r\n\r\n.lp-embed .sx__q{font-size:clamp(19px,2.2vw,24px);font-weight:500;letter-spacing:-.028em;margin:0 0 7px;\r\n  text-wrap:balance;color:var(--ink)}\r\n\r\n.lp-embed .sx__hint{margin:0 0 24px;font-size:14px;color:var(--muted);text-wrap:pretty}\r\n\r\n\/* Opciones simples \u00b7 pastillas suaves *\/\r\n\r\n.lp-embed .sx__opts{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;border:0}\r\n\r\n.lp-embed .sx__opt{position:relative}\r\n\r\n.lp-embed .sx__opt input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}\r\n\r\n.lp-embed .sx__opt > span{display:inline-flex;align-items:center;min-height:52px;padding:0 24px;border-radius:999px;\r\n  cursor:pointer;border:1px solid var(--line);background:var(--paper);\r\n  font-size:15px;font-weight:400;color:var(--text);\r\n  transition:border-color .2s var(--e-out),background .2s var(--e-out),color .2s var(--e-out)}\r\n\r\n.lp-embed .sx__opt:hover > span{border-color:var(--gl);background:var(--tint)}\r\n\/* Elegido = verde de marca con transparencia, igual que las tarjetas de paredes *\/\r\n\r\n.lp-embed .sx__opt input:checked + span{border-color:var(--g);background:var(--tint-2);color:var(--gd);font-weight:500}\r\n\r\n.lp-embed .sx__opt:hover input:checked + span{background:var(--tint-3)}\r\n\r\n.lp-embed .sx__opt input:focus-visible + span{outline:2px solid var(--g);outline-offset:3px}\r\n\r\n\/* Opciones de paredes \u00b7 tarjeta suave con la ilustraci\u00f3n *\/\r\n\/* Siempre 3 en fila. Con auto-fit se apilaban en anchos medios y la columna\r\n   del formulario crec\u00eda 400px de golpe al llegar al paso 3. *\/\r\n\r\n.lp-embed .sx__opts--w{display:grid;gap:12px;grid-template-columns:repeat(3,minmax(0,1fr))}\r\n\r\n.lp-embed .sx__opt--w > span{flex-direction:column;align-items:stretch;padding:0;border-radius:20px;overflow:hidden;min-height:0;\r\n  transition:border-color .2s var(--e-out),background .2s var(--e-out),box-shadow .25s var(--e-out)}\r\n\r\n.lp-embed .sx__opt--w figure{margin:0;aspect-ratio:16\/9;background:var(--tint);overflow:hidden}\r\n\r\n.lp-embed .sx__opt--w img{width:100%;height:100%;object-fit:contain;transition:transform .4s var(--e-out)}\r\n\r\n.lp-embed .sx__opt--w b{display:block;padding:12px 12px;font-size:14px;font-weight:400;text-align:center;color:var(--text)}\r\n\r\n.lp-embed .sx__opt--w:hover > span{border-color:var(--gl);background:var(--paper);box-shadow:0 8px 22px -16px rgba(16,33,12,.45)}\r\n\r\n.lp-embed .sx__opt--w:hover img{transform:scale(1.03)}\r\n\r\n.lp-embed .sx__opt--w input:checked + span{border-color:var(--g);background:var(--tint-2);color:var(--text);\r\n  box-shadow:0 10px 26px -18px rgba(19,99,0,.6)}\r\n\r\n.lp-embed .sx__opt--w input:checked + span b{font-weight:500;color:var(--gd)}\r\n\r\n.lp-embed .sx__opt--w input:checked + span figure{background:var(--paper)}\r\n\r\n\r\n.lp-embed .sx__grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}\r\n\r\n.lp-embed .sx__field label{display:block;font-size:13px;font-weight:400;color:var(--muted);margin-bottom:8px}\r\n\r\n.lp-embed .sx__field label i{color:var(--g);font-style:normal}\r\n\/* font-size del input: NO bajar de 16px. Por debajo, iOS hace zoom al enfocar\r\n   y descoloca la maqueta en m\u00f3vil. *\/\r\n\r\n.lp-embed .sx__in{width:100%;height:52px;padding:0 18px;border-radius:16px;border:1px solid var(--line);\r\n  background:var(--paper);color:var(--text);font:inherit;font-size:16px;\r\n  transition:border-color .2s var(--e-out),box-shadow .2s var(--e-out)}\r\n\r\n.lp-embed .sx__in::placeholder{color:var(--muted)}\r\n\r\n.lp-embed .sx__in:hover{border-color:var(--gl)}\r\n\r\n.lp-embed .sx__in:focus{outline:0;border-color:var(--g);box-shadow:0 0 0 4px rgba(67,176,42,.14)}\r\n\r\n.lp-embed .sx__unit{position:relative} \r\n.lp-embed .sx__unit .sx__in{padding-right:54px}\r\n\/* El contenedor incluye la etiqueta, as\u00ed que top:50% dejaba la unidad a la\r\n   altura del centro de \u00abetiqueta + campo\u00bb, o sea flotando sobre el campo.\r\n   Se ancla abajo con la altura del input (52px) y se centra ah\u00ed dentro. *\/\r\n\r\n.lp-embed .sx__unit::after{content:attr(data-unit);position:absolute;right:18px;bottom:0;height:52px;\r\n  display:flex;align-items:center;font-size:14px;color:var(--muted);pointer-events:none}\r\n\r\n\r\n.lp-embed .sx__relief{margin-top:18px;font-size:13px;color:var(--muted);line-height:1.5;max-width:56ch}\r\n\r\n.lp-embed .sx__consent{display:flex;gap:12px;align-items:flex-start;margin-top:24px;font-size:13px;color:var(--muted);line-height:1.5;cursor:pointer}\r\n\/* Casilla dibujada a mano en vez de la nativa. Depender de accent-color es\r\n   fr\u00e1gil: dentro de WordPress el reset de apariencia la dejaba invisible. *\/\r\n\r\n.lp-embed .sx__consent input{flex:none;width:20px;height:20px;margin:1px 0 0;\r\n  -webkit-appearance:none;appearance:none;cursor:pointer;\r\n  border:1px solid var(--line);border-radius:6px;background:var(--paper);\r\n  transition:background .18s var(--e-out),border-color .18s var(--e-out)}\r\n\r\n.lp-embed .sx__consent input:hover{border-color:var(--g)}\r\n\r\n.lp-embed .sx__consent input:checked{border-color:var(--g);\r\n  background:var(--g) center\/13px 13px no-repeat url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'\/%3E%3C\/svg%3E\")}\r\n\r\n.lp-embed .sx__consent input:focus-visible{outline:2px solid var(--g);outline-offset:2px}\r\n\r\n.lp-embed .sx__consent a{color:var(--gd);text-decoration:underline;text-underline-offset:2px}\r\n\r\n\r\n.lp-embed .sx__nav{display:flex;gap:14px;align-items:center;margin-top:auto;padding-top:30px}\r\n\r\n.lp-embed .sx__btn{appearance:none;border:0;font:inherit;font-weight:500;font-size:15px;height:52px;padding:0 30px;\r\n  border-radius:999px;cursor:pointer;display:inline-flex;align-items:center;gap:10px;\r\n  transition:transform .2s var(--e-out),background .2s var(--e-out),box-shadow .25s var(--e-out)}\r\n\/* Texto del bot\u00f3n en vuestro casi negro #040C03 sobre el 361 C: 7.1:1 *\/\r\n\r\n.lp-embed .sx__btn--go{background:var(--g);color:var(--ink);box-shadow:0 10px 26px -16px rgba(19,99,0,.85)}\r\n\r\n.lp-embed .sx__btn--go:hover{background:var(--gd);color:#fff;transform:translateY(-2px);\r\n  box-shadow:0 16px 32px -18px rgba(19,99,0,.9)}\r\n\r\n.lp-embed .sx__btn--back{background:transparent;color:var(--muted);padding:0 8px}\r\n\r\n.lp-embed .sx__btn--back:hover{color:var(--ink)}\r\n\r\n.lp-embed .sx__btn:focus-visible{outline:2px solid var(--gd);outline-offset:3px}\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n   LANDING v4 \u2014 alineada al sistema de \u00abP\u00e1gina de organizadores\u00bb\r\n   Tokens, curvas de easing, valores de revelado y estilo de titular tomados\r\n   de P\u00c1GINA ORGANIZADORES.unified-motion.html en vez de inventados.\r\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n\r\n.lp-embed .ln{\r\n  \/* Paleta de la casa *\/\r\n  --gl:#BEE0B8;         \/* verde claro *\/\r\n  --gray:#6c6c6c;       \/* TITULARES \u00b7 la firma de la casa, no es casi negro *\/\r\n  --body:#4C4C4C;       \/* texto corrido *\/\r\n  --light:#999;\r\n  --off:#F5F7F4;        \/* fondo alterno *\/\r\n  --bd:#E0E8DC;         \/* l\u00edneas *\/\r\n  \/* Curvas *\/\r\n  --ease-out:cubic-bezier(.23,1,.32,1);\r\n  --ease-in-out:cubic-bezier(.77,0,.175,1);\r\n  --ease-spring:cubic-bezier(.16,1,.3,1);\r\n  --ease-mass:cubic-bezier(.34,1.56,.64,1);\r\n  \/* Revelado *\/\r\n  --rev-y:16px; --rev-blur:6px; --rev-dur:.7s;\r\n  \/* Ritmo *\/\r\n  --space-section:clamp(120px,16vh,200px);\r\n  --w:1200px;\r\n  --amb:0 2px 4px -2px rgba(16,33,12,.05), 0 18px 40px -24px rgba(16,33,12,.16);\r\n}\r\n\/* En m\u00f3vil el margen sube de 18 a 28px: es lo que encoge las fotos y la\r\n   caja de texto, y con ello el titular deja de parecer peque\u00f1o al lado. *\/\r\n\r\n.lp-embed .ln__wrap{max-width:var(--w);margin:0 auto;padding:0 clamp(28px,4vw,52px)}\r\n\r\n.lp-embed .ln__sec{padding:var(--space-section) 0}\r\n\r\n.lp-embed .ln__sec--off{background:var(--off)}\r\n\r\n.lp-embed .ln__sec--dark{background:#0E1A0C;color:#C8D6C4}\r\n\r\n.lp-embed .ln__sec--dark .ln__h{color:#fff}\r\n\r\n.lp-embed .ln__sec--dark .ln__sub{color:#9FB09B}\r\n\r\n\/* Titular: peso 700, tracking -.04em, color --gray. De un solo color:\r\n   partir el titular en dos tonos con el verde de marca es un tic manido. *\/\r\n\/* El m\u00ednimo sube de 30 a 34: en m\u00f3vil los titulares se quedaban chicos\r\n   frente a fotos y tarjetas que ocupan todo el ancho. *\/\r\n\r\n.lp-embed .ln__h{font-size:clamp(34px,4.6vw,54px);font-weight:700;letter-spacing:-.04em;line-height:1.02;\r\n  color:var(--gray);margin:0 0 20px;text-wrap:balance}\r\n\r\n.lp-embed .ln__sub{font-size:clamp(15.5px,1.7vw,18px);color:var(--body);margin:0;max-width:58ch;\r\n  line-height:1.65;text-wrap:pretty}\r\n\r\n.lp-embed .ln__head{margin-bottom:clamp(40px,6vw,72px)}\r\n\r\n.lp-embed .ln__head--c{text-align:center}\r\n\r\n.lp-embed .ln__head--c .ln__h,.lp-embed .ln__head--c .ln__sub{margin-inline:auto}\r\n\r\n\/* \u2500\u2500 Doble bisel \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\r\n\r\n.lp-embed .ln__shell{border-radius:30px;padding:7px;background:rgba(76,76,76,.045);box-shadow:var(--amb)}\r\n\r\n.lp-embed .ln__core{border-radius:23px;background:#fff;overflow:hidden;\r\n  box-shadow:inset 0 1px 1px rgba(255,255,255,.9), 0 0 0 1px var(--bd)}\r\n\r\n.lp-embed .ln__sec--dark .ln__shell{background:rgba(255,255,255,.05);box-shadow:none}\r\n\r\n.lp-embed .ln__sec--dark .ln__core{background:#0A140A;box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}\r\n\r\n\/* \u2500\u2500 Revelado \u00b7 mejora progresiva (el contenido nunca depende del JS) \u2500\u2500\u2500\u2500\u2500 *\/\r\n\r\n.lp-embed .rv{transition:opacity var(--rev-dur) var(--ease-out),\r\n    transform var(--rev-dur) var(--ease-spring),\r\n    filter var(--rev-dur) var(--ease-out);\r\n  transition-delay:calc(var(--i,0) * 80ms)}\r\n\r\n.lp-embed .js-rv .rv{opacity:0;transform:translateY(var(--rev-y));filter:blur(var(--rev-blur))}\r\n\r\n.lp-embed .js-rv .rv.is-in{opacity:1;transform:none;filter:blur(0)}\r\n@media (prefers-reduced-motion:reduce){\r\n  \r\n.lp-embed .js-rv .rv{opacity:1;transform:none;filter:none}\r\n  \r\n.lp-embed .rv{transition:none}\r\n}\r\n\r\n\/* \u2500\u2500 Barra flotante \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\r\n\r\n.lp-embed .ln__top{position:sticky;top:0;z-index:40;padding:14px 0 0}\r\n\/* El segundo tope es el que la despega de los bordes en m\u00f3vil: sin \u00e9l la\r\n   barra llegaba de canto a canto y no se le\u00eda como una p\u00edldora flotante. *\/\r\n\r\n.lp-embed .ln__topin{max-width:min(calc(var(--w) - 40px), calc(100% - 32px));margin:0 auto;\r\n  padding:9px 9px 9px 22px;border-radius:999px;\r\n  display:flex;align-items:center;justify-content:space-between;gap:18px;\r\n  background:rgba(255,255,255,.8);backdrop-filter:saturate(1.8) blur(16px);\r\n  box-shadow:0 0 0 1px var(--bd), 0 10px 34px -22px rgba(76,76,76,.5)}\r\n\r\n.lp-embed .ln__logo{height:32px;width:auto}\r\n\r\n.lp-embed .ln__topr{display:flex;align-items:center;gap:clamp(10px,2vw,20px)}\r\n\r\n.lp-embed .ln__tel{display:inline-flex;align-items:center;gap:8px;font-size:14.5px;font-weight:500;\r\n  color:var(--gray);text-decoration:none;white-space:nowrap}\r\n\r\n.lp-embed .ln__tel svg{width:16px;height:16px;stroke:var(--g);fill:none;stroke-width:1.6}\r\n\/* En la barra solo cabe una acci\u00f3n. En m\u00f3vil manda el bot\u00f3n de calcular, que\r\n   es la conversi\u00f3n de la landing; el tel\u00e9fono aparece a partir de 820px,\r\n   donde ya hay sitio para los dos. *\/\r\n\r\n.lp-embed .ln__tel{display:none}\r\n@media(min-width:820px){\r\n.lp-embed .ln__tel{display:inline-flex}}\r\n\r\n\/* \u2500\u2500 Bot\u00f3n con icono anidado \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\r\n\r\n.lp-embed .ln__btn{display:inline-flex;align-items:center;gap:14px;padding:0 8px 0 26px;height:52px;\r\n  border-radius:999px;background:var(--g);color:#04220A;text-decoration:none;\r\n  font-size:15px;font-weight:600;letter-spacing:-.01em;\r\n  box-shadow:0 1px 2px rgba(19,99,0,.18), 0 14px 30px -18px rgba(19,99,0,.9);\r\n  transition:transform .5s var(--ease-mass), background .45s var(--ease-out),\r\n             box-shadow .45s var(--ease-out)}\r\n\r\n.lp-embed .ln__btn:hover{background:#3BA024}\r\n\r\n.lp-embed .ln__btn:active{transform:scale(.975)}\r\n\r\n.lp-embed .ln__btn i{flex:none;width:36px;height:36px;border-radius:50%;background:rgba(4,34,10,.12);\r\n  display:grid;place-items:center;\r\n  transition:transform .5s var(--ease-mass), background .45s var(--ease-out)}\r\n\r\n.lp-embed .ln__btn:hover i{transform:translate(3px,-1px) scale(1.06);background:rgba(4,34,10,.19)}\r\n\r\n.lp-embed .ln__btn svg{width:15px;height:15px;stroke:#04220A;fill:none;stroke-width:2}\r\n\r\n.lp-embed .ln__btn--sm{height:42px;padding:0 6px 0 20px;font-size:13.5px}\r\n\r\n.lp-embed .ln__btn--sm i{width:30px;height:30px} \r\n.lp-embed .ln__btn--sm svg{width:13px;height:13px}\r\n\r\n.lp-embed .ln__topcta{display:inline-flex}\r\n\/* Algo m\u00e1s compacto en pantallas estrechas para que quepa con el logo. *\/\r\n@media(max-width:400px){\r\n  \r\n.lp-embed .ln__topcta{height:38px;padding:0 5px 0 15px;font-size:12.5px;gap:9px}\r\n  \r\n.lp-embed .ln__topcta i{width:28px;height:28px}\r\n  \r\n.lp-embed .ln__topin{padding-left:16px}\r\n}\r\n\r\n\/* \u2500\u2500 Marquesina de logos \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\r\n\/* En blanco, igual que la secci\u00f3n que va debajo: el tinte se queda para los\r\n   bloques grandes. Aqu\u00ed la distancia se corrige apretando, no coloreando. *\/\r\n\r\n.lp-embed .ln__proof{padding:clamp(34px,4vw,46px) 0;overflow:hidden}\r\n\/* El r\u00f3tulo presenta a los logos: tiene que pesar menos que ellos. M\u00e1s grande\r\n   que antes, pero en semibold y con menos tracking para que no grite. *\/\r\n\r\n.lp-embed .ln__proof p{margin:0 0 clamp(16px,1.8vw,22px);text-align:center;font-size:12.5px;font-weight:600;\r\n  color:#ADADAD;letter-spacing:.14em;text-transform:uppercase}\r\n\/* Y como la franja ya separa por s\u00ed sola, la secci\u00f3n siguiente no necesita\r\n   todo el aire del ritmo general. *\/\r\n\r\n.lp-embed .ln__proof + .ln__sec{padding-top:clamp(72px,9vh,104px)}\r\n\r\n.lp-embed .ln__mq{position:relative;\r\n  -webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);\r\n  mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}\r\n\r\n.lp-embed .ln__mqtrack{display:flex;width:max-content;animation:ln-mq 58s linear infinite}\r\n\r\n.lp-embed .ln__mqtrack img{height:56px;width:auto;margin:0 clamp(20px,3vw,42px);\r\n  opacity:.52;filter:grayscale(1);transition:opacity .45s var(--ease-out),filter .45s var(--ease-out)}\r\n\r\n.lp-embed .ln__mqtrack img:hover{opacity:1;filter:grayscale(0)}\r\n@keyframes ln-mq{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}\r\n@media (prefers-reduced-motion:reduce){\r\n  \r\n.lp-embed .ln__mqtrack{animation:none;flex-wrap:wrap;justify-content:center;width:auto}\r\n}\r\n\r\n\/* \u2500\u2500 Tipos de stand \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\r\n\r\n.lp-embed .ln__tipos{display:grid;gap:clamp(14px,1.8vw,20px);grid-template-columns:1fr}\r\n@media(min-width:900px){\r\n  \r\n.lp-embed .ln__tipos{grid-template-columns:repeat(6,1fr)}\r\n  \r\n.lp-embed .ln__tipo:nth-child(1),.lp-embed .ln__tipo:nth-child(2){grid-column:span 3}\r\n  \r\n.lp-embed .ln__tipo:nth-child(3){grid-column:span 6}\r\n  \/* La tercera va panor\u00e1mica y a ancho completo; el texto se limita a 62%\r\n     para que no se estire de lado a lado y quede una l\u00ednea largu\u00edsima. *\/\r\n  \r\n.lp-embed .ln__tipo:nth-child(3) .ln__tipoart{aspect-ratio:2\/1}\r\n  \r\n.lp-embed .ln__tipo:nth-child(3) .ln__tipoin{max-width:62%}\r\n}\r\n\r\n.lp-embed .ln__tipoart{position:relative;overflow:hidden;border-radius:23px;aspect-ratio:4\/3;background:var(--off)}\r\n\r\n.lp-embed .ln__tipoart img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;\r\n  transform:scale(1.05);transition:transform 1s var(--ease-out)}\r\n\r\n.lp-embed .ln__tipo:hover .ln__tipoart img{transform:scale(1.11)}\r\n\/* Velo plano, no un degradado suave: el texto ocupa el 44-50% inferior y\r\n   antes a esa altura solo hab\u00eda 0,42 de opacidad, as\u00ed que la primera l\u00ednea\r\n   ca\u00eda sobre la foto. Con las tarjetas ya panor\u00e1micas hace falta bastante\r\n   menos: 0,70 en la zona de texto basta para leerlo y deja ver la foto.\r\n   Un 0,92 tapaba de m\u00e1s. *\/\r\n\r\n.lp-embed .ln__tipoart::after{content:\"\";position:absolute;inset:0;\r\n  background:linear-gradient(to top,\r\n    rgba(8,20,6,.88) 0%,\r\n    rgba(8,20,6,.70) 46%,\r\n    rgba(8,20,6,.28) 64%,\r\n    rgba(8,20,6,0)   84%)}\r\n\/* En m\u00f3vil la tarjeta es estrecha, el texto envuelve m\u00e1s y llega al 80% del\r\n   alto, as\u00ed que el corte al 52% se queda corto y la primera l\u00ednea caer\u00eda\r\n   sobre la foto. Aqu\u00ed el velo sube. *\/\r\n@media(max-width:899px){\r\n  \r\n.lp-embed .ln__tipoart::after{background:linear-gradient(to top,\r\n    rgba(8,20,6,.9)  0%,\r\n    rgba(8,20,6,.74) 78%,\r\n    rgba(8,20,6,.34) 90%,\r\n    rgba(8,20,6,0)   100%)}\r\n}\r\n\r\n.lp-embed .ln__tipoin{position:absolute;z-index:2;left:0;right:0;bottom:0;padding:clamp(22px,2.6vw,32px)}\r\n\r\n.lp-embed .ln__tipo b{display:inline-block;margin-bottom:13px;\r\n  font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--gl)}\r\n\r\n.lp-embed .ln__tipo h3{font-size:clamp(21px,2.3vw,28px);font-weight:700;letter-spacing:-.04em;\r\n  color:#fff;margin:0 0 10px;line-height:1.05}\r\n\r\n.lp-embed .ln__tipo p{margin:0;font-size:14.5px;line-height:1.6;color:#B8CBB4;max-width:52ch}\r\n\r\n\r\n\r\n@supports (animation-timeline: view()){\r\n  @media (prefers-reduced-motion:no-preference){\r\n      }\r\n}\r\n\r\n\r\n\r\n@media(min-width:940px){}\r\n@media(min-width:600px){}\r\n\r\n\/* \u2500\u2500 FAQ \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\r\n\r\n.lp-embed .ln__faq{max-width:840px;margin:0 auto}\r\n\r\n.lp-embed .ln__faq details{border-bottom:1px solid var(--bd)}\r\n\r\n.lp-embed .ln__faq details:first-of-type{border-top:1px solid var(--bd)}\r\n\r\n.lp-embed .ln__faq summary{list-style:none;cursor:pointer;padding:24px 48px 24px 0;position:relative;\r\n  font-size:17.5px;font-weight:600;letter-spacing:-.03em;color:var(--gray);\r\n  transition:color .4s var(--ease-out)}\r\n\r\n.lp-embed .ln__faq summary:hover{color:var(--g)}\r\n\r\n.lp-embed .ln__faq summary::-webkit-details-marker{display:none}\r\n\r\n.lp-embed .ln__faq summary::after{content:\"\";position:absolute;right:8px;top:50%;width:10px;height:10px;\r\n  margin-top:-6px;border-right:1.7px solid var(--g);border-bottom:1.7px solid var(--g);\r\n  transform:rotate(45deg);transition:transform .5s var(--ease-spring)}\r\n\r\n.lp-embed .ln__faq details[open] summary::after{transform:rotate(-135deg);margin-top:-2px}\r\n\r\n.lp-embed .ln__faq p{margin:0 0 26px;font-size:15.5px;color:var(--body);line-height:1.7;max-width:70ch}\r\n\/* M\u00f3vil: caja m\u00e1s estrecha y menos hueco hasta el chevron, que dejaba la\r\n   pregunta colgando en una l\u00ednea largu\u00edsima. Va despu\u00e9s de las reglas de\r\n   arriba a prop\u00f3sito: con la misma especificidad, gana la \u00faltima. *\/\r\n@media(max-width:640px){\r\n  \r\n.lp-embed .ln__faq{padding-inline:8px}\r\n  \r\n.lp-embed .ln__faq summary{padding:21px 32px 21px 0;font-size:16px}\r\n  \r\n.lp-embed .ln__faq summary::after{right:4px}\r\n  \r\n.lp-embed .ln__faq p{margin-bottom:22px;font-size:15px}\r\n}\r\n\r\n\r\n.lp-embed .ln__endnote{margin:22px 0 0;font-size:13.5px;color:var(--light)}\r\n\r\n.lp-embed .ln__endnote a{color:var(--g);font-weight:500}\r\n\r\n\/* Ajustes de integraci\u00f3n: la calculadora deja de ser una p\u00e1gina suelta\r\n   y pasa a ser la primera secci\u00f3n de la landing. *\/\r\n\r\n.lp-embed .sx{padding-top:clamp(30px,4.5vw,58px)}\r\n\/* scroll-behavior: lo lleva Lenis; en <html> adem\u00e1s pelea con \u00e9l *\/\r\n@media (prefers-reduced-motion:reduce){\r\n.lp-embed html{scroll-behavior:auto}}\r\n\/* \u2500\u2500 Propuesta personalizada \u00b7 la segunda v\u00eda \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n   La calculadora es el gancho para quien solo quiere una cifra. Esto es para\r\n   quien ya tiene briefing y necesita sitio para explicarse. Reutiliza los\r\n   componentes de formulario de la calculadora (.sx__in, .sx__field\u2026) para que\r\n   los dos se vean como el mismo sistema.                                     *\/\r\n\r\n.lp-embed .ln__oferta{display:grid;gap:clamp(32px,4.5vw,68px);grid-template-columns:1fr;align-items:start}\r\n@media(min-width:980px){\r\n  \r\n.lp-embed .ln__oferta{grid-template-columns:1fr 1fr;align-items:start}\r\n  \/* El formulario conserva su altura natural y baja con la p\u00e1gina, sin\r\n     pegarse. Antes lo estiraba para igualar la columna de texto \u2014ten\u00eda\r\n     sentido cuando sobraban 39px\u2014, pero con el recorrido de siete paradas\r\n     eso le met\u00eda 312px de vac\u00edo dentro. *\/\r\n}\r\n\/* \u2500\u2500 Cierre \u00b7 el formulario a una sola columna, en medida de lectura \u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\r\n\r\n.lp-embed .ln__cierre{max-width:660px;margin-inline:auto;display:grid;gap:clamp(28px,3.4vw,44px)}\r\n\r\n.lp-embed .ln__cierre .ln__sub{margin-inline:auto}\r\n\r\n\r\n.lp-embed .ln__formin{padding:clamp(26px,3.4vw,40px)}\r\n\r\n.lp-embed .ln__formin h3{font-size:clamp(19px,2.1vw,23px);font-weight:700;letter-spacing:-.035em;\r\n  color:var(--gray);margin:0 0 8px;line-height:1.15}\r\n\r\n.lp-embed .ln__formin > p{margin:0 0 26px;font-size:14.5px;color:var(--light);line-height:1.55}\r\n\r\n.lp-embed .ln__ta{width:100%;min-height:112px;padding:14px 18px;border-radius:16px;\r\n  border:1px solid var(--line);background:var(--paper);color:var(--text);\r\n  font:inherit;font-size:16px;line-height:1.5;resize:vertical;\r\n  transition:border-color .2s var(--e-out),box-shadow .2s var(--e-out)}\r\n\r\n.lp-embed .ln__ta:focus{outline:none;border-color:var(--g);box-shadow:0 0 0 4px var(--tint-2)}\r\n\/* En modo interaction-only el widget no ocupa nada mientras no haga falta:\r\n   solo separa cuando Cloudflare decide mostrarlo. *\/\r\n\r\n.lp-embed .ln__turn{margin-top:18px}\r\n\r\n.lp-embed .ln__turn:empty{margin-top:0}\r\n\r\n.lp-embed .ln__gracias{margin:0 0 10px;font-size:clamp(20px,2.2vw,25px);font-weight:700;\r\n  letter-spacing:-.035em;color:var(--gray)}\r\n\r\n.lp-embed .ln__graciassub{margin:0;font-size:15px;line-height:1.6;color:var(--light)}\r\n\r\n\/* \u2500\u2500 Recorrido \u00b7 un solo hilo del briefing al desmontaje \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n   El ra\u00edl NO es una l\u00ednea \u00fanica sobre el <ul>: as\u00ed sobresal\u00eda 6,5 px por\r\n   encima del primer punto y 48,9 px por debajo del \u00faltimo, cruzando el texto\r\n   del \u00faltimo hito. Ahora cada hito dibuja SU tramo, que arranca en su punto y\r\n   mide exactamente el alto del hito, as\u00ed que muere clavado en el punto\r\n   siguiente. El \u00faltimo no dibuja ninguno.\r\n   El punto va centrado con la primera l\u00ednea de su t\u00edtulo, no 3,5 px por debajo.\r\n   Relleno verde y encendido de los puntos con scroll nativo, sin JavaScript. *\/\r\n\/* Alineado con el titular y la entrada de la columna. Centrarlo como bloque\r\n   dejaba 38px de hueco muerto a la izquierda y lo descuadraba de todo lo de\r\n   arriba: un bloque centrado bajo texto alineado a la izquierda no se ve\r\n   centrado, se ve torcido. Aqu\u00ed el punto marca el margen. *\/\r\n\r\n.lp-embed .ln__ruta{list-style:none;margin:34px 0 0;padding:0;\r\n  view-timeline-name:--ruta;view-timeline-axis:block}\r\n\r\n.lp-embed .ln__ruta li{position:relative;padding:0 0 26px 34px}\r\n\r\n.lp-embed .ln__ruta li:last-child{padding-bottom:0}\r\n\r\n\/* Punto \u00b7 15px de caja (11 + 2 de borde a cada lado), centro a 12px *\/\r\n\r\n.lp-embed .ln__ruta li::before{content:\"\";position:absolute;left:0;top:4.5px;z-index:2;\r\n  width:11px;height:11px;border-radius:50%;\r\n  background:var(--paper);border:2px solid var(--g)}\r\n\r\n\/* Tramo \u00b7 de este punto al siguiente, ni un p\u00edxel m\u00e1s.\r\n   Por defecto va RELLENO: si el JS no corre, se ve la l\u00ednea acabada. *\/\r\n\r\n.lp-embed .ln__ruta li::after{content:\"\";position:absolute;left:7px;top:12px;width:1px;height:100%;\r\n  background-color:var(--bd);\r\n  background-image:linear-gradient(var(--g),var(--g));\r\n  background-repeat:no-repeat;background-size:100% 100%}\r\n\r\n.lp-embed .ln__ruta li:last-child::after{display:none}\r\n\r\n\r\n.lp-embed .ln__ruta b{display:block;font-size:15.5px;font-weight:600;color:var(--gray);\r\n  letter-spacing:-.02em;margin-bottom:3px}\r\n\r\n.lp-embed .ln__ruta span{display:block;font-size:14.5px;color:var(--body);line-height:1.6}\r\n\r\n.lp-embed .ln__ruta-sep{padding:0 0 26px 34px;font-size:10px;font-weight:700;letter-spacing:.2em;\r\n  text-transform:uppercase;color:var(--g);line-height:24px}\r\n\r\n\/* \u2500\u2500 Relleno del recorrido \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n   Va LIGADO AL SCROLL: se llena seg\u00fan bajas y se vac\u00eda si subes.\r\n   La primera versi\u00f3n usaba una ventana de solo el 18 % del recorrido de cada\r\n   hito, y por eso se completaba de golpe. Ahora es del 42 %: con una ventana\r\n   de 900px eso son unos 420px de scroll por tramo, que es el ritmo pausado.\r\n   El atributo data-anim lo pone el JS. Sin \u00e9l la l\u00ednea se ve entera y no\r\n   depende de nada.                                                          *\/\r\n\r\n.lp-embed .ln__ruta[data-anim] li::after{background-size:100% 0}\r\n\r\n.lp-embed .ln__ruta[data-anim] li::before{background:var(--paper);border-color:var(--bd)}\r\n\r\n@supports (animation-timeline: view()){\r\n  @media (prefers-reduced-motion:no-preference){\r\n    \/* TODO cuelga de la MISMA l\u00ednea de tiempo, la del <ul>, y cada parada\r\n       ocupa su tramo del recorrido. Antes cada hito ten\u00eda la suya propia y\r\n       por eso los puntos se encend\u00edan antes de que la l\u00ednea llegara.\r\n       Siete paradas de 7,1 puntos porcentuales: de 26% a 75,7%.\r\n       ARRANQUE al 26%: al 8% la lista a\u00fan estaba pegada al borde inferior y\r\n       el relleno empezaba antes de que te fijaras en ella.\r\n       FINAL al 75,7%: cerraba en el 57% y se quedaba corto. Ahora la lista\r\n       mide 852px, as\u00ed que aunque su borde alto ya haya salido por arriba, el\r\n       \u00daLTIMO PUNTO \u2014que es lo que se mira\u2014 sigue a media pantalla. Con la\r\n       lista corta de antes esto no se pod\u00eda estirar tanto. *\/\r\n    \r\n.lp-embed .ln__ruta[data-anim] li::after{animation:ln-tramo linear both;\r\n      animation-timeline:--ruta;\r\n      animation-range:cover calc(26% + var(--n,0) * 7.1%)\r\n                      cover calc(26% + (var(--n,0) + 1) * 7.1%)}\r\n    \/* El punto SALTA a verde, no se funde: a media transici\u00f3n se ve\u00eda\r\n       lavado y parec\u00eda un fallo de pintado. Y salta justo cuando la l\u00ednea\r\n       que llega a \u00e9l acaba de completarse. *\/\r\n    \r\n.lp-embed .ln__ruta[data-anim] li::before{animation:ln-hito steps(1,end) both;\r\n      animation-timeline:--ruta;\r\n      animation-range:cover calc(26% + var(--n,0) * 7.1%)\r\n                      cover calc(26.4% + var(--n,0) * 7.1%)}\r\n  }\r\n}\r\n\r\n\/* Reserva para navegadores sin scroll-driven (Firefox): se dispara al entrar\r\n   y se recorre por tiempo, a la cadencia del pjLineFill del resto del sitio. *\/\r\n@supports not (animation-timeline: view()){\r\n  \r\n.lp-embed .ln__ruta[data-anim].is-on li::after{animation:ln-tramo .5s linear forwards;\r\n    animation-delay:calc(var(--n,0) * .44s)}\r\n  \r\n.lp-embed .ln__ruta[data-anim].is-on li::before{animation:ln-hito .3s linear forwards;\r\n    animation-delay:calc(var(--n,0) * .44s)}\r\n}\r\n\r\n@keyframes ln-tramo{to{background-size:100% 100%}}\r\n@keyframes ln-hito{to{background:var(--g);border-color:var(--g)}}\r\n\r\n@media (prefers-reduced-motion:reduce){\r\n  \r\n.lp-embed .ln__ruta[data-anim] li::after{background-size:100% 100%}\r\n  \r\n.lp-embed .ln__ruta[data-anim] li::before{background:var(--g);border-color:var(--g)}\r\n}\r\n\r\n\r\n\/* \u2500\u2500 Escena de v\u00eddeo \u00b7 \u00ab\u00bfQui\u00e9n es Servis?\u00bb \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n   INTEGRACI\u00d3N: el pin arranca con el fondo de la p\u00e1gina, no en negro. As\u00ed la\r\n   secci\u00f3n empieza siendo la landing \u2014el v\u00eddeo es una tarjeta m\u00e1s\u2014 y solo al\r\n   abrirse se apodera de la pantalla. Al despegarse, vuelve al blanco y entra\r\n   la siguiente secci\u00f3n sin corte.\r\n   Todo cuelga de UNA l\u00ednea de tiempo con rango \u00abcontain\u00bb, que en un bloque m\u00e1s\r\n   alto que la ventana va exactamente de que se clava a que se despega: el\r\n   guion cuadra igual en un port\u00e1til bajo que en un monitor grande.          *\/\r\n\r\n.lp-embed .ln__esc{position:relative;height:250vh;background:var(--paper);\r\n  view-timeline-name:--esc;view-timeline-axis:block}\r\n\r\n.lp-embed .ln__escpin{position:sticky;top:0;height:100vh;display:grid;place-items:center;\r\n  overflow:hidden;background:var(--paper)}\r\n\r\n.lp-embed .ln__escvid{position:absolute;inset:0;clip-path:inset(11% 15% round 30px)}\r\n\r\n.lp-embed .ln__escvid video{width:100%;height:100%;object-fit:cover;display:block}\r\n\/* Velo neutro fr\u00edo al 68%: el v\u00eddeo es cielo azul y cristal, y un velo verdoso\r\n   lo ensuciaba. Adem\u00e1s el 68% es lo que hace que el texto peque\u00f1o pase\r\n   contraste sobre el fotograma m\u00e1s claro (fondo efectivo rgb(53,72,86)):\r\n   etiqueta 4,8:1 \u00b7 detalle 5,9:1 \u00b7 respuesta 7,4:1 \u00b7 cifra 9,5:1. *\/\r\n\r\n.lp-embed .ln__escvid::after{content:\"\";position:absolute;inset:0;\r\n  background:linear-gradient(to top,rgba(10,14,18,.78),rgba(10,14,18,.68) 55%,rgba(10,14,18,.52))}\r\n\r\n\/* \u2500\u2500 Una sola unidad de escala para toda la escena \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n   Antes cada pieza ten\u00eda su clamp y cada una topaba en un ancho distinto, as\u00ed\r\n   que a partir de cierto punto el bloque dejaba de responder al zoom. Ahora\r\n   todo cuelga de --u: al alejar el zoom la ventana mide m\u00e1s px CSS, --u sube\r\n   y la escena entera crece; al acercarlo, encoge. Y crece TODO a la vez\r\n   \u2014cuerpos, m\u00e1rgenes y medida de l\u00ednea\u2014, as\u00ed que el n\u00famero de l\u00edneas no\r\n   cambia y la composici\u00f3n se mantiene id\u00e9ntica a cualquier zoom. *\/\r\n\r\n.lp-embed .ln__esctxt{--u:clamp(8.5px,1vw,16px);\r\n  position:relative;z-index:2;width:min(calc(var(--u) * 65),86vw);text-align:center;color:#fff}\r\n\r\n.lp-embed .ln__escq{font-size:calc(var(--u) * 3.33);font-weight:700;letter-spacing:-.05em;line-height:1;\r\n  margin:0 0 calc(var(--u) * .78);color:#fff}\r\n\/* M\u00e1s peque\u00f1o y m\u00e1s ancho: a 19px sobre 46ch sal\u00edan seis l\u00edneas y el p\u00e1rrafo\r\n   pesaba tanto como el titular. Ahora es texto de apoyo, no un segundo\r\n   titular, y cabe en menos l\u00edneas. *\/\r\n\/* El compromiso comparte estilo con el texto: es un segundo p\u00e1rrafo del mismo\r\n   bloque, no un pie. Solo cambia el margen que los separa. *\/\r\n\r\n.lp-embed .ln__esca,.lp-embed .ln__esccita{font-size:calc(var(--u) * 1.01);line-height:1.6;margin:0 auto;\r\n  max-width:76ch;color:rgba(255,255,255,.85)}\r\n\/* Centrados como el resto de la escena: con el titular, el p\u00e1rrafo y la cita\r\n   centrados, alinearlos a la izquierda los sacaba del eje. *\/\r\n\r\n.lp-embed .ln__escdatos{display:grid;gap:calc(var(--u) * 1.6);grid-template-columns:1fr;\r\n  margin-top:calc(var(--u) * 1.45);text-align:center}\r\n\r\n.lp-embed .ln__escd span{margin-inline:auto;max-width:32ch}\r\n@media(min-width:720px){\r\n.lp-embed .ln__escdatos{grid-template-columns:repeat(3,1fr)}}\r\n\/* Etiquetas en el verde claro de marca: es la \u00fanica nota de color de la\r\n   escena y sirve para separarlas del blanco de la cifra. *\/\r\n\r\n.lp-embed .ln__escd b{display:block;font-size:calc(var(--u) * .66);font-weight:600;letter-spacing:.2em;\r\n  text-transform:uppercase;color:var(--gl);margin-bottom:calc(var(--u) * .62)}\r\n\r\n.lp-embed .ln__escd strong{display:block;font-size:calc(var(--u) * 2.5);font-weight:700;\r\n  letter-spacing:-.05em;line-height:.95;color:#fff;font-variant-numeric:tabular-nums}\r\n\r\n.lp-embed .ln__escd strong i{font-style:normal;font-size:.42em;margin-left:3px;color:rgba(255,255,255,.6)}\r\n\r\n.lp-embed .ln__escd span{display:block;margin-top:calc(var(--u) * .56);font-size:calc(var(--u) * .87);\r\n  line-height:1.5;color:rgba(255,255,255,.72)}\r\n\r\n.lp-embed .ln__esccita{margin-top:calc(var(--u) * .75)}\r\n\r\n\/* En m\u00f3vil el bloque fijado tiene que caber en una pantalla, y con el texto\r\n   largo se iba a 805px de 812: con la barra del navegador se cortar\u00eda. Aqu\u00ed\r\n   se aprieta y se cae el detalle de cada cifra \u2014la etiqueta y el n\u00famero ya\r\n   dicen lo necesario\u2014 en vez de dejar que se salga. *\/\r\n@media(max-width:719px){\r\n  \r\n.lp-embed .ln__escq{font-size:clamp(26px,7.4vw,32px)}\r\n  \r\n.lp-embed .ln__esca,.lp-embed .ln__esccita{font-size:14.5px;line-height:1.55}\r\n  \r\n.lp-embed .ln__escdatos{gap:16px;margin-top:22px}\r\n  \r\n.lp-embed .ln__escd span{display:none}\r\n  \r\n.lp-embed .ln__escd strong{font-size:26px}\r\n  \r\n.lp-embed .ln__escd b{margin-bottom:7px}\r\n  \r\n.lp-embed .ln__esccita{margin-top:16px}\r\n}\r\n\r\n@supports (animation-timeline: view()){\r\n  @media (prefers-reduced-motion:no-preference){\r\n    \r\n.lp-embed .ln__escvid{animation:esc-abrir linear both;animation-timeline:--esc;\r\n      animation-range:contain 0% contain 46%}\r\n    @keyframes esc-abrir{from{clip-path:inset(11% 15% round 30px)}\r\n                         to  {clip-path:inset(0 0 round 0)}}\r\n    \r\n.lp-embed .ln__escq,.lp-embed .ln__esca,.lp-embed .ln__esccita{opacity:0;transform:translateY(20px);filter:blur(6px);\r\n      animation:esc-entra linear both;animation-timeline:--esc}\r\n    \r\n.lp-embed .ln__escq{animation-range:contain 4%  contain 20%}\r\n    \r\n.lp-embed .ln__esca{animation-range:contain 10% contain 26%}\r\n    \r\n.lp-embed .ln__esccita{animation-range:contain 16% contain 32%}\r\n    \r\n.lp-embed .ln__escd{opacity:0;transform:translateY(22px);filter:blur(6px);\r\n      animation:esc-entra linear both;animation-timeline:--esc;\r\n      animation-range:contain calc(38% + var(--n) * 13%) contain calc(56% + var(--n) * 13%)}\r\n    @keyframes esc-entra{to{opacity:1;transform:none;filter:blur(0)}}\r\n  }\r\n}\r\n@supports not (animation-timeline: view()){ \r\n.lp-embed .ln__escvid{clip-path:inset(0 0 round 0)} }\r\n@media (prefers-reduced-motion:reduce){ \r\n.lp-embed .ln__escvid{clip-path:inset(0 0 round 0)} }\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n   EJEMPLOS DE NUESTROS STANDS\r\n   Mosaico de cuatro columnas en movimiento perpetuo, dos suben y dos bajan.\r\n   El titular va abajo y centrado. Clic en cualquier pieza para verla grande.\r\n\r\n   Dos cosas que no son decorativas y conviene no tocar sin entenderlas:\r\n\r\n   \u00b7 El padding-bottom de un hueco en .ln__mospista. La pista es una rejilla de\r\n     N tarjetas, as\u00ed que mide N alturas + (N\u22121) huecos. El bucle salta al \u221250%,\r\n     que cae en N\/2 alturas + (N\/2 \u2212 0,5) huecos: medio hueco de desfase en\r\n     cada vuelta, o sea un tir\u00f3n visible cada minuto y medio. Con ese padding\r\n     la pista mide N alturas + N huecos y el ciclo cierra clavado.\r\n\r\n   \u00b7 Las velocidades son lent\u00edsimas a prop\u00f3sito, entre 82 y 108 segundos por\r\n     vuelta \u2014unos 2px por segundo\u2014. M\u00e1s r\u00e1pido y no se puede hacer clic en una\r\n     tarjeta en movimiento, que es la mitad de la gracia.\r\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n\/* Stands y grandes operaciones son la misma idea a dos escalas, as\u00ed que van\r\n   en una sola secci\u00f3n. Sobre el tinte, no en oscuro. *\/\r\n\r\n.lp-embed .ln__mosaico{--hueco:clamp(12px,1.6vw,22px);position:relative;overflow:hidden;\r\n  background:var(--off);--fade:var(--off);padding:clamp(46px,6.5vw,92px) 0}\r\n\/* CASI a todo el ancho, no a sangre. En la caja de 1200px de la p\u00e1gina el\r\n   mosaico quedaba como una isla en un monitor grande; a sangre resultaba\r\n   demasiado. El punto medio es el 93% del ancho con tope de 2000px, as\u00ed que\r\n   siempre respira por los lados sin perder presencia.\r\n   Las columnas crecen con la pantalla para que la pieza mantenga su tama\u00f1o en\r\n   vez de estirarse: a 1440 son 5 columnas de ~250px y a 2560, 6 de ~315px.\r\n   Sin esto, a 2560 con cuatro columnas cada foto medir\u00eda 470px. *\/\r\n\r\n.lp-embed .ln__mosgrid{position:relative;display:grid;gap:var(--hueco);\r\n  grid-template-columns:repeat(2,1fr);height:clamp(440px,74vh,760px)}\r\n@media(min-width:900px) {\r\n.lp-embed .ln__mosgrid{grid-template-columns:repeat(4,1fr)}}\r\n@media(min-width:1200px){\r\n.lp-embed .ln__mosgrid{grid-template-columns:repeat(5,1fr)}}\r\n@media(min-width:1500px){\r\n.lp-embed .ln__mosgrid{grid-template-columns:repeat(6,1fr)}}\r\n@media(min-width:1800px){\r\n.lp-embed .ln__mosgrid{grid-template-columns:repeat(7,1fr)}}\r\n@media(min-width:2200px){\r\n.lp-embed .ln__mosgrid{grid-template-columns:repeat(8,1fr)}}\r\n\/* El mosaico se ensancha por encima de la medida de lectura de la p\u00e1gina,\r\n   pero sin llegar a sangre completa. *\/\r\n\r\n.lp-embed .ln__mosaico > .ln__wrap{max-width:min(2000px,93vw);padding-inline:0}\r\n\/* En m\u00f3vil el mosaico se alinea con el resto de la p\u00e1gina en vez de ir casi\r\n   a sangre: as\u00ed las fotos encogen y no aplastan a los titulares. *\/\r\n@media(max-width:640px){\r\n  \r\n.lp-embed .ln__mosaico > .ln__wrap{max-width:calc(100% - 44px)}\r\n}\r\n\r\n.lp-embed .ln__moscol{position:relative;overflow:hidden}\r\n\r\n.lp-embed .ln__mospista{display:grid;gap:var(--hueco);padding-bottom:var(--hueco);will-change:transform}\r\n@keyframes sube{from{transform:translateY(0)}    to{transform:translateY(-50%)}}\r\n@keyframes baja{from{transform:translateY(-50%)} to{transform:translateY(0)}}\r\n\/* --t lo pone el JS en cada columna: depende de cu\u00e1ntas fotos le hayan tocado,\r\n   que a su vez depende del ancho. Un tiempo fijo cambiar\u00eda la velocidad cada\r\n   vez que cambia el n\u00famero de columnas. *\/\r\n\r\n.lp-embed .ln__moscol:nth-child(odd)  .ln__mospista{animation:sube var(--t,92s) linear infinite}\r\n\r\n.lp-embed .ln__moscol:nth-child(even) .ln__mospista{animation:baja var(--t,92s) linear infinite}\r\n\r\n\/* Desvanecido arriba y abajo: las tarjetas no se cortan en seco al entrar *\/\r\n\r\n.lp-embed .ln__mosgrid::before,.lp-embed .ln__mosgrid::after{content:\"\";position:absolute;left:0;right:0;height:13%;\r\n  z-index:3;pointer-events:none}\r\n\r\n.lp-embed .ln__mosgrid::before{top:0;background:linear-gradient(var(--fade),transparent)}\r\n\r\n.lp-embed .ln__mosgrid::after{bottom:0;background:linear-gradient(transparent,var(--fade))}\r\n\r\n\/* Mano, no lupa: se entiende antes que aqu\u00ed se hace clic. *\/\r\n\r\n.lp-embed .ln__mosc{display:block;width:100%;padding:0;border:0;background:none;cursor:pointer;\r\n  border-radius:16px;overflow:hidden;position:relative;aspect-ratio:4\/3}\r\n\r\n.lp-embed .ln__mosc img{width:100%;height:100%;object-fit:cover;display:block;\r\n  transition:transform .7s var(--e-out)}\r\n\/* El velo entra desde abajo, no plano: as\u00ed la foto no se apaga entera y la\r\n   lupa aparece sobre la zona m\u00e1s oscura. *\/\r\n\r\n.lp-embed .ln__mosc::after{content:\"\";position:absolute;inset:0;opacity:0;\r\n  background:radial-gradient(120% 100% at 50% 100%,rgba(8,18,6,.72),rgba(8,18,6,.18) 70%,rgba(8,18,6,0));\r\n  transition:opacity .45s var(--e-out)}\r\n\/* Filo interior: define la pieza sin pintar un borde encima de la foto. *\/\r\n\r\n.lp-embed .ln__mosc::before{content:\"\";position:absolute;z-index:3;inset:0;border-radius:inherit;\r\n  pointer-events:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}\r\n\r\n.lp-embed .ln__mosc:hover img,.lp-embed .ln__mosc:focus-visible img{transform:scale(1.07)}\r\n\r\n.lp-embed .ln__mosc:hover::after,.lp-embed .ln__mosc:focus-visible::after{opacity:1}\r\n\r\n.lp-embed .ln__mosc:focus-visible{outline:3px solid var(--g);outline-offset:3px}\r\n\r\n\/* Lupa centrada y de vidrio, no un bot\u00f3n blanco en la esquina. Entra con\r\n   muelle y un pel\u00edn de rotaci\u00f3n: es el gesto que dice \u00abesto se puede abrir\u00bb. *\/\r\n\r\n.lp-embed .ln__moslupa{position:absolute;z-index:4;left:50%;top:50%;width:54px;height:54px;border-radius:50%;\r\n  display:grid;place-items:center;\r\n  background:rgba(255,255,255,.16);box-shadow:inset 0 0 0 1px rgba(255,255,255,.42);\r\n  -webkit-backdrop-filter:blur(9px) saturate(1.25);backdrop-filter:blur(9px) saturate(1.25);\r\n  opacity:0;transform:translate(-50%,-50%) scale(.55) rotate(-22deg);\r\n  transition:opacity .3s var(--e-out),\r\n             transform .55s cubic-bezier(.34,1.56,.64,1),\r\n             background .3s var(--e-out)}\r\n\r\n.lp-embed .ln__mosc:hover .ln__moslupa,.lp-embed .ln__mosc:focus-visible .ln__moslupa{\r\n  opacity:1;transform:translate(-50%,-50%) scale(1) rotate(0)}\r\n\r\n.lp-embed .ln__mosc:active .ln__moslupa{transform:translate(-50%,-50%) scale(.9) rotate(0);\r\n  background:rgba(255,255,255,.3)}\r\n\r\n.lp-embed .ln__moslupa svg{width:20px;height:20px;stroke:#fff;fill:none;stroke-width:1.9;\r\n  stroke-linecap:round}\r\n@media (prefers-reduced-motion:reduce){\r\n  \r\n.lp-embed .ln__moslupa{transition:opacity .2s linear;transform:translate(-50%,-50%)}\r\n  \r\n.lp-embed .ln__mosc:hover .ln__moslupa,.lp-embed .ln__mosc:focus-visible .ln__moslupa{transform:translate(-50%,-50%)}\r\n}\r\n\/* En t\u00e1ctil no hay hover: se deja visible y discreta para que se vea que\r\n   las fotos se abren. *\/\r\n@media(hover:none){\r\n  \r\n.lp-embed .ln__moslupa{opacity:.85;transform:translate(-50%,-50%);width:44px;height:44px}\r\n  \r\n.lp-embed .ln__mosc::after{opacity:.55}\r\n}\r\n@media (prefers-reduced-motion:reduce){\r\n  \r\n.lp-embed .ln__mospista{animation:none !important}\r\n  \r\n.lp-embed .ln__mosgrid{height:auto}\r\n}\r\n\r\n\/* \u2500\u2500 El titular, abajo y centrado \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n   El velo va detr\u00e1s del texto, no encima del mosaico: una zona s\u00f3lida amplia\r\n   y un desvanecido largo, de modo que no se vea d\u00f3nde acaba. Los porcentajes\r\n   se miden sobre la caja del texto (unos 300x115), as\u00ed que se necesitan\r\n   valores altos para cubrir lo suficiente.                                  *\/\r\n\/* El ancho va en em SOBRE EL h2, no en ch sobre el div: el ch se calculaba con\r\n   los 16px heredados (301px) mientras el titular es de 42px, y part\u00eda la\r\n   frase en tres l\u00edneas cortas en pantalla ancha. *\/\r\n\r\n.lp-embed .ln__mosT{position:absolute;z-index:4;pointer-events:none}\r\n\/* margin-inline:auto es lo que lo centra de verdad: el text-align:center del\r\n   padre alinea las L\u00cdNEAS dentro de la caja, pero la caja \u2014limitada por\r\n   max-width\u2014 segu\u00eda pegada a la izquierda. *\/\r\n\r\n.lp-embed .ln__mosT h2{font-size:clamp(26px,3.2vw,42px);font-weight:700;letter-spacing:-.045em;line-height:1.04;\r\n  color:var(--gray);margin:0 auto;max-width:min(11em,78vw)}\r\n\r\n.lp-embed .ln__mosT::before{content:\"\";position:absolute;z-index:-1;inset:-125% -145% -190% -145%;\r\n  background:radial-gradient(closest-side,\r\n    var(--off) 48%, rgba(245,247,244,.95) 66%, rgba(245,247,244,.62) 82%, transparent)}\r\n@media(min-width:900px){\r\n  \/* Despegado del borde: a bottom:0 el titular ca\u00eda justo dentro del degradado\r\n     inferior y parec\u00eda que se sal\u00eda de la banda. *\/\r\n  \r\n.lp-embed .ln__mosT{left:50%;bottom:clamp(16px,4.5%,52px);transform:translateX(-50%);text-align:center}\r\n}\r\n\/* En m\u00f3vil tambi\u00e9n va encima del mosaico, centrado en los dos ejes. Estaba en\r\n   flujo normal y, como el JS inserta las columnas con afterbegin \u2014o sea antes\r\n   que \u00e9l\u2014, acababa colgando por debajo de las fotos. El halo se queda: es lo\r\n   que hace legible el titular sobre las im\u00e1genes. *\/\r\n@media(max-width:899px){\r\n  \r\n.lp-embed .ln__mosT{left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;width:100%}\r\n}\r\n\r\n\r\n\/* \u2500\u2500 Ficha ampliada \u00b7 <dialog> nativo \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n   Trae de serie el foco atrapado, el cierre con Escape y el fondo inerte.  *\/\r\n\/* OJO: el <dialog> cuelga del <body>, FUERA de cualquier .ln, as\u00ed que aqu\u00ed no\r\n   llegan las variables de la landing. Antes los iconos llevaban\r\n   stroke:var(--gray) y, al no resolver, tomaban el valor inicial de stroke en\r\n   SVG \u2014que es \u00abnone\u00bb\u2014: los botones se ve\u00edan como c\u00edrculos vac\u00edos. Los colores\r\n   de esta ficha son literales a prop\u00f3sito. *\/\r\n\/* Capa a pantalla completa. z-index muy alto porque compite con lo que haya\r\n   puesto el tema: barras fijas, avisos de cookies, el chat de HubSpot. *\/\r\n\/* OCULTA POR DEFECTO Y SE ABRE CON UNA CLASE.\r\n   La primera versi\u00f3n iba al rev\u00e9s: visible por CSS y oculta con el atributo\r\n   \u00abhidden\u00bb. En la p\u00e1gina real la capa sal\u00eda abierta nada m\u00e1s cargar, porque\r\n   ese atributo no llega: entre lo que sanea Elementor al guardar el widget y\r\n   lo que reescribe WP Rocket al minificar, un booleano suelto no sobrevive.\r\n   Una clase s\u00ed. Y el estado por defecto es oculto, as\u00ed que si algo fallara,\r\n   falla hacia el lado bueno: no se ve, en vez de taparlo todo. *\/\r\n\r\n.lp-embed .ln__fich{display:none;position:fixed;inset:0;z-index:2147483000;\r\n  place-items:center;padding:clamp(14px,3vw,56px);\r\n  background:rgba(6,12,6,.88);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}\r\n\r\n.lp-embed .ln__fich.is-abierta{display:grid;animation:fich-in .34s cubic-bezier(.16,1,.3,1)}\r\n\r\n.lp-embed .ln__fichpanel{position:relative;max-width:min(1240px,92vw);max-height:92vh}\r\n@keyframes fich-in{from{opacity:0}to{opacity:1}}\r\n\r\n.lp-embed .ln__fichcaja{animation:fich-sube .4s cubic-bezier(.16,1,.3,1)}\r\n@keyframes fich-sube{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:none}}\r\n\r\n\/* Sin pie: la foto sola sobre el fondo oscuro. *\/\r\n\r\n.lp-embed .ln__fichcaja{border-radius:18px;overflow:hidden;line-height:0;\r\n  box-shadow:0 40px 90px -40px rgba(0,0,0,.8)}\r\n\r\n.lp-embed .ln__fichimg{display:block;width:100%;max-height:84vh;object-fit:contain;background:#0B1508}\r\n\r\n\/* Controles: vidrio claro sobre oscuro, no discos blancos. *\/\r\n\r\n.lp-embed .ln__fichbtn{position:absolute;z-index:2;border:0;cursor:pointer;display:grid;place-items:center;\r\n  border-radius:999px;color:#fff;\r\n  background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.22);\r\n  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);\r\n  transition:background .22s ease,border-color .22s ease,transform .22s cubic-bezier(.16,1,.3,1)}\r\n\r\n.lp-embed .ln__fichbtn svg{fill:none;stroke:currentColor;stroke-width:1.9;\r\n  stroke-linecap:round;stroke-linejoin:round}\r\n\r\n.lp-embed .ln__fichbtn:hover{background:rgba(255,255,255,.26);border-color:rgba(255,255,255,.4)}\r\n\r\n.lp-embed .ln__fichbtn:active{transform:scale(.94)}\r\n\r\n.lp-embed .ln__fichbtn:focus-visible{outline:2px solid #fff;outline-offset:3px}\r\n\r\n\r\n.lp-embed .ln__fichx{top:-58px;right:0;width:42px;height:42px}\r\n\r\n.lp-embed .ln__fichx svg{width:16px;height:16px}\r\n\r\n.lp-embed .ln__fichnav{top:50%;margin-top:-27px;width:54px;height:54px}\r\n\r\n.lp-embed .ln__fichnav svg{width:20px;height:20px}\r\n\r\n.lp-embed .ln__fichnav--ant{left:-74px} \r\n.lp-embed .ln__fichnav--sig{right:-74px}\r\n\r\n\/* Contador: orienta dentro de las doce sin afirmar nada de la foto. *\/\r\n\r\n.lp-embed .ln__fichnum{position:absolute;z-index:2;top:-50px;left:0;margin:0;\r\n  font-size:13px;font-weight:500;letter-spacing:.04em;color:rgba(255,255,255,.62);\r\n  font-variant-numeric:tabular-nums}\r\n\r\n.lp-embed .ln__fichnum b{font-weight:600;color:#fff}\r\n\r\n\/* Sin sitio fuera de la foto: los controles se meten dentro. *\/\r\n@media(max-width:1120px){\r\n  \r\n.lp-embed .ln__fichnav--ant{left:10px} \r\n.lp-embed .ln__fichnav--sig{right:10px}\r\n  \r\n.lp-embed .ln__fichnav{width:46px;height:46px;margin-top:-23px}\r\n}\r\n@media(max-width:700px){\r\n  \r\n.lp-embed .ln__fichx{top:10px;right:10px}\r\n  \r\n.lp-embed .ln__fichnum{top:auto;bottom:12px;left:50%;transform:translateX(-50%);\r\n    background:rgba(6,12,6,.6);padding:5px 12px;border-radius:999px}\r\n}\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n   V3 \u00b7 DOS TARJETAS CON UNA AFIRMACI\u00d3N DELANTE\r\n   Los sellos dejan de ser el contenido y pasan a ser el pie de una frase.\r\n   Primero se dice qu\u00e9 te llevas, y el logo lo respalda.\r\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n\/* Tinte, despu\u00e9s de la secci\u00f3n oscura de stands y operaciones. Las tarjetas\r\n   blancas destacan por contraste, sin necesidad de filete. *\/\r\n\r\n.lp-embed .ln__certs{background:var(--off);padding:var(--space-section) 0}\r\n\r\n.lp-embed .ln__certgrid{display:grid;gap:clamp(18px,2.4vw,30px);grid-template-columns:1fr}\r\n@media(min-width:900px){\r\n.lp-embed .ln__certgrid{grid-template-columns:1fr 1fr}}\r\n\r\n.lp-embed .ln__certc{background:var(--paper);border-radius:26px;padding:clamp(28px,3.4vw,44px);\r\n  display:flex;flex-direction:column;\r\n  box-shadow:0 2px 4px -2px rgba(16,33,12,.05), 0 24px 50px -34px rgba(16,33,12,.24)}\r\n\r\n.lp-embed .ln__certc b{display:block;font-size:10px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;\r\n  color:var(--g);margin-bottom:14px}\r\n\r\n.lp-embed .ln__certc h3{font-size:clamp(20px,2.3vw,27px);font-weight:700;letter-spacing:-.04em;line-height:1.15;\r\n  color:var(--gray);margin:0 0 12px}\r\n\r\n.lp-embed .ln__certc p{margin:0 0 clamp(22px,2.8vw,34px);font-size:15px;line-height:1.65;max-width:42ch}\r\n\r\n.lp-embed .ln__certlista{list-style:none;margin:0 0 clamp(22px,2.8vw,32px);padding:0;display:grid;gap:11px}\r\n\r\n.lp-embed .ln__certlista li{display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:baseline;\r\n  font-size:14px;line-height:1.5}\r\n\r\n.lp-embed .ln__certlista svg{width:15px;height:15px;stroke:var(--g);fill:none;stroke-width:2.2;margin-top:4px}\r\n\r\n.lp-embed .ln__certpie{margin-top:auto;padding-top:clamp(22px,2.6vw,30px);border-top:1px solid var(--bd);\r\n  display:flex;flex-wrap:wrap;align-items:center;gap:clamp(20px,3vw,40px)}\r\n\/* Igualar por ALTURA no iguala nada cuando los logos tienen proporciones tan\r\n   distintas: el AFE es apaisado (ratio 1,61) y llena a lo ancho, mientras que\r\n   el ICCA es vertical (0,64) y queda diminuto al lado.\r\n   Se igualan por \u00c1REA \u00d3PTICA. Para un \u00e1rea objetivo A y una proporci\u00f3n r, la\r\n   altura que la consigue es ra\u00edz(A\/r). El factor --k de cada uno sale de ah\u00ed,\r\n   normalizado para que la media sea 1:\r\n     ministerio 1,24 \u00b7 eventsost 1,24 \u00b7 ICCA 1,30   (verticales, m\u00e1s altos)\r\n     AFE 0,82 \u00b7 ISO 0,74                            (apaisados, m\u00e1s bajos)\r\n   As\u00ed ocupan la misma mancha aunque midan distinto.\r\n   IFEMA (1,26) y Fira (1,05) van por encima de esa media a prop\u00f3sito: son los\r\n   dos que un visitante reconoce de un vistazo, y aqu\u00ed pesan m\u00e1s que un sello\r\n   que hay que leer para saber qu\u00e9 es. *\/\r\n\/* \u2500\u2500 Sellos sueltos sobre el tinte, sin recuadro \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n   Hubo una versi\u00f3n con cada sello sobre una tarjeta blanca, porque dos de los\r\n   archivos tra\u00edan su propia caja blanca opaca y se ve\u00edan como recortes\r\n   pegados. La tarjeta lo disimulaba; lo que hab\u00eda que hacer era arreglar las\r\n   im\u00e1genes. Al de Fira y al del Ministerio se les ha quitado el fondo blanco,\r\n   as\u00ed que ya no hace falta nada.\r\n   Los de T\u00dcV y Eventsost conservan su marco: forma parte del distintivo y no\r\n   se puede quitar sin destrozarlo.\r\n   Van a color: en gris, un certificado con marco y letra peque\u00f1a se convierte\r\n   en una mancha y la bandera del sello del Ministerio queda sucia. *\/\r\n\r\n.lp-embed .ln__certpie{--base:clamp(38px,4.1vw,52px);gap:clamp(20px,2.6vw,36px)}\r\n\r\n.lp-embed .ln__certpie img{height:calc(var(--base) * var(--k,1));width:auto;\r\n  transition:transform .35s var(--e-out)}\r\n\r\n.lp-embed .ln__certpie img:hover{transform:translateY(-2px)}\r\n\r\n\r\n\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n   ANCHO COMPLETO A LA FUERZA\r\n   Elementor mete el widget dentro de un contenedor con ancho de caja \u20141140px\r\n   por defecto\u2014, y la landing se quedaba encerrada ah\u00ed: los fondos de color no\r\n   llegaban a los bordes y el mosaico perd\u00eda la mitad de su gracia.\r\n   Esto la saca de la caja SIN tener que configurar nada en Elementor:\r\n     \u00b7 el margen negativo la estira hasta los bordes de la ventana, sea cual\r\n       sea el ancho del contenedor que la envuelva;\r\n     \u00b7 overflow-x:clip recorta lo que sobre. Es \u00abclip\u00bb y NO \u00abhidden\u00bb a\r\n       prop\u00f3sito: hidden crea un contenedor de scroll y eso ROMPE el\r\n       position:sticky de la barra de arriba. clip recorta sin crearlo.\r\n   La landing ya se limita ella sola por dentro \u2014cada secci\u00f3n lleva su caja de\r\n   1200px centrada\u2014, as\u00ed que ensanchar aqu\u00ed no descuadra el texto.\r\n\r\n   La clase va repetida \u2014.lp-embed.lp-embed\u2014 para subirla a (0,2,0). No es un\r\n   capricho: cualquier regla del tema con dos clases, del tipo\r\n   \u00ab.elementor-widget-container > .algo\u00bb, le ganar\u00eda a un solo .lp-embed y\r\n   volver\u00eda a encajonar la landing. Repetir la clase es la forma est\u00e1ndar de\r\n   subir especificidad sin recurrir a !important.\r\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n.lp-embed.lp-embed{width:100vw;max-width:100vw;margin-inline:calc(50% - 50vw);\r\n  overflow-x:clip}\r\n\r\n\/* La envoltura del <dialog> lleva la clase ra\u00edz solo para heredar el CSS, no\r\n   para ocupar sitio: aqu\u00ed el ancho completo sobrar\u00eda y dar\u00eda scroll lateral.\r\n   Misma especificidad que la de arriba y va despu\u00e9s, as\u00ed que gana. *\/\r\n.lp-embed.lp-portal{width:auto;max-width:none;margin:0;overflow:visible;\r\n  position:static}\r\n\r\n<\/style>\r\n\r\n<script>\r\n\/* Interruptor del revelado. Si no llega a ejecutarse, todo queda visible. *\/\r\n(function(){\r\n  if(!('IntersectionObserver' in window))return;\r\n  if(window.matchMedia('(prefers-reduced-motion: reduce)').matches)return;\r\n  var raiz = document.documentElement;\r\n  raiz.classList.add('js-rv');\r\n  \/* SALVAVIDAS. Si a los 3 s no se ha revelado nada, se retira la puerta y la\r\n     p\u00e1gina entera vuelve a ser visible.\r\n     Vive aqu\u00ed, en su propio <script>, a prop\u00f3sito: si el bloque principal se\r\n     rompe \u2014un error de sintaxis basta\u2014 muere con \u00e9l cualquier red que est\u00e9\r\n     dentro, y la landing se queda en blanco. Esta sobrevive. *\/\r\n  setTimeout(function(){\r\n    if(!document.querySelector('.rv.is-in')) raiz.classList.remove('js-rv');\r\n  }, 3000);\r\n})();\r\n<\/script>\r\n\r\n\r\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 BARRA \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\r\n<header class=\"ln ln__top\">\r\n  <div class=\"ln__topin\">\r\n    <img decoding=\"async\" class=\"ln__logo\" alt=\"Servis\"\r\n         src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2024\/08\/LOGO-Servis-PhotoRoom.png-PhotoRoom-300x150.png\">\r\n    <div class=\"ln__topr\">\r\n      <a class=\"ln__tel\" href=\"tel:+34934233107\">\r\n        <svg viewBox=\"0 0 24 24\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1 1 .3 1.9.7 2.8a2 2 0 0 1-.5 2.1L8.1 9.9a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.8.7a2 2 0 0 1 1.7 2Z\"\/><\/svg>\r\n        <span>934 233 107<\/span>\r\n      <\/a>\r\n      <a class=\"ln__btn ln__btn--sm ln__topcta\" href=\"#calculadora\">Get my stand price\r\n        <i><svg viewBox=\"0 0 24 24\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg><\/i><\/a>\r\n    <\/div>\r\n  <\/div>\r\n<\/header>\r\n\r\n\r\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 CALCULADORA \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\r\n<section class=\"sx\" id=\"calculadora\">\r\n  <div class=\"sx__shell\" data-root>\r\n\r\n    <!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 PANEL VISUAL \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\r\n    <aside class=\"sx__visual\">\r\n      <div class=\"sx__swap\">\r\n\r\n      <!-- Titular \u00b7 pasos 1\u20132 \u00b7 revelado l\u00ednea a l\u00ednea como el hero de la web -->\r\n      <div class=\"sx__lead\" data-lead>\r\n        <h2 class=\"sx__h\">\r\n          <span class=\"sx__line\"><span class=\"sx__line-in\">Want to know<\/span><\/span>\r\n          <span class=\"sx__line\"><span class=\"sx__line-in\">what your next stand<\/span><\/span>\r\n          <span class=\"sx__line\"><span class=\"sx__line-in\">is going to cost?<\/span><\/span>\r\n          <span class=\"sx__line sx__line--gap\"><span class=\"sx__line-in\"><em>Work it out in under a minute<\/em><\/span><\/span>\r\n        <\/h2>\r\n        <p class=\"sx__aclara\">The estimate uses <b>Visualwall<\/b>, our new build system, and covers the walls, the electrics and the carpet only.<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"sx__stage sx--off\" data-stage>\r\n\r\n        <!-- A la espera de elegir n\u00famero de paredes -->\r\n        <div class=\"sx__layer\" data-layer=\"empty\">\r\n          <p class=\"sx__empty\">Pick how many walls and the layout will show up here.<\/p>\r\n        <\/div>\r\n\r\n        <!-- Ilustraciones reales de la media library -->\r\n        <div class=\"sx__layer\" data-layer=\"ill\">\r\n          <div class=\"sx__ills\">\r\n            <!-- \u26a0 Esta es una FOTO, no una ilustraci\u00f3n. Ver nota de arriba. -->\r\n            <img loading=\"lazy\" class=\"sx__ill\" data-ill=\"w1\" width=\"2560\" height=\"1440\" loading=\"lazy\" decoding=\"async\"\r\n                 src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2025\/04\/STAND-TIPO-E-scaled.jpg\"\r\n                 alt=\"Diagram of a stand with 1 closed wall and three sides open to the aisle\">\r\n            <img loading=\"lazy\" class=\"sx__ill\" data-ill=\"w2\" width=\"2048\" height=\"1152\" loading=\"lazy\" decoding=\"async\"\r\n                 src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2025\/04\/2-PAREDES.png\"\r\n                 alt=\"Diagram of a corner stand with 2 closed walls\">\r\n            <img loading=\"lazy\" class=\"sx__ill\" data-ill=\"w3\" width=\"2048\" height=\"1152\" loading=\"lazy\" decoding=\"async\"\r\n                 src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2025\/04\/3-PAREDES-1-1.png\"\r\n                 alt=\"Diagram of a stand with 3 closed walls and one side open to the aisle\">\r\n\r\n            <img loading=\"lazy\" class=\"sx__ill\" data-ill=\"plarga\" width=\"2048\" height=\"1152\" loading=\"lazy\" decoding=\"async\"\r\n                 src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2025\/04\/Metros-1-pared.png\"\r\n                 alt=\"Diagram showing which wall is being measured on a 1-wall stand\">\r\n            <img loading=\"lazy\" class=\"sx__ill\" data-ill=\"plarga2\" width=\"2048\" height=\"1152\" loading=\"lazy\" decoding=\"async\"\r\n                 src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2025\/04\/Paredlarga-2.png\"\r\n                 alt=\"Diagram showing the 1st wall on a 2-wall stand\">\r\n            <img loading=\"lazy\" class=\"sx__ill\" data-ill=\"pcorta\" width=\"2048\" height=\"1152\" loading=\"lazy\" decoding=\"async\"\r\n                 src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2025\/04\/paredcorta.png\"\r\n                 alt=\"Diagram showing the 2nd wall on a 2-wall stand\">\r\n            <img loading=\"lazy\" class=\"sx__ill\" data-ill=\"plarga3\" width=\"2048\" height=\"1152\" loading=\"lazy\" decoding=\"async\"\r\n                 src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2025\/04\/plarga3.png\"\r\n                 alt=\"Diagram showing the 1st wall on a 3-wall stand\">\r\n            <img loading=\"lazy\" class=\"sx__ill\" data-ill=\"pcorta2\" width=\"2048\" height=\"1152\" loading=\"lazy\" decoding=\"async\"\r\n                 src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2025\/04\/pcorta-2.png\"\r\n                 alt=\"Diagram showing the 2nd wall on a 3-wall stand\">\r\n            <img loading=\"lazy\" class=\"sx__ill\" data-ill=\"pcorta3\" width=\"2048\" height=\"1152\" loading=\"lazy\" decoding=\"async\"\r\n                 src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2025\/04\/pcorta3.png\"\r\n                 alt=\"Diagram showing the 3rd wall on a 3-wall stand\">\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- Plano en vivo -->\r\n        <div class=\"sx__layer\" data-layer=\"plan\">\r\n          <svg class=\"sx__svg\" viewBox=\"0 0 340 200\" data-svg aria-hidden=\"true\"><\/svg>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <\/div><!-- \/.sx__swap -->\r\n\r\n      <p class=\"sx__cap\" data-cap><\/p>\r\n\r\n      <ul class=\"sx__specs\">\r\n        <li><span>Venue<\/span><b class=\"is-empty\" data-spec=\"city\">\u2014<\/b><\/li>\r\n        <li><span>Floor area<\/span><b class=\"is-empty\" data-spec=\"m2\">\u2014<\/b><\/li>\r\n        <li><span>Walls<\/span><b class=\"is-empty\" data-spec=\"walls\">\u2014<\/b><\/li>\r\n        <li><span>Closed perimeter<\/span><b class=\"is-empty\" data-spec=\"perim\">\u2014<\/b><\/li>\r\n      <\/ul>\r\n\r\n      <ul class=\"sx__facts\">\r\n        <li><svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> Approved supplier for Fira Barcelona, IFEMA and Feria de Zaragoza<\/li>\r\n        <li><svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> In-house production: 25,000 m\u00b2 and our own assembly crews<\/li>\r\n        <li><svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg> Over 500 stands a year since 1965<\/li>\r\n      <\/ul>\r\n    <\/aside>\r\n\r\n\r\n    <!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 PANEL FORMULARIO \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\r\n    <div class=\"sx__main\">\r\n      <div class=\"sx__rail\">\r\n        <div class=\"sx__track\"><i class=\"sx__fill\" data-fill><\/i><\/div>\r\n        <p class=\"sx__count\" data-count><b>1<\/b> of 5<\/p>\r\n      <\/div>\r\n      <p class=\"sx__legend\" data-legend>Step 1 \u00b7 Venue<\/p>\r\n\r\n      <!-- method=\"post\" es una red de seguridad, no funcionalidad: el env\u00edo lo\r\n           hace JavaScript. Pero si el JS fallara por lo que sea, el navegador\r\n           har\u00eda un env\u00edo nativo, y sin method \u00e9ste ser\u00eda GET: los datos\r\n           personales acabar\u00edan en la barra de direcciones. Con post, no. -->\r\n      <form data-form method=\"post\" novalidate>\r\n\r\n        <!-- \u2500\u2500 PASO 1 \u2500\u2500 -->\r\n        <div class=\"step is-on\" data-step=\"1\">\r\n          <fieldset style=\"border:0;padding:0;margin:0\">\r\n            <legend class=\"sx__q\" style=\"padding:0\">Where is the show?<\/legend>\r\n            <div class=\"sx__opts\">\r\n              <!-- \u26a0 value=\"Madrid \" conserva el espacio final que hay en producci\u00f3n -->\r\n              <label class=\"sx__opt\"><input type=\"radio\" name=\"form_fields[Lugardelaferia]\" value=\"Barcelona\" required><span>Barcelona<\/span><\/label>\r\n              <label class=\"sx__opt\"><input type=\"radio\" name=\"form_fields[Lugardelaferia]\" value=\"Madrid \"><span>Madrid<\/span><\/label>\r\n              <label class=\"sx__opt\"><input type=\"radio\" name=\"form_fields[Lugardelaferia]\" value=\"Zaragoza\"><span>Zaragoza<\/span><\/label>\r\n            <\/div>\r\n          <\/fieldset>\r\n          <p class=\"err\" data-err>Pick a city to carry on.<\/p>\r\n          <div class=\"sx__nav\"><button type=\"button\" class=\"sx__btn sx__btn--go\" data-next>Next<\/button><\/div>\r\n        <\/div>\r\n\r\n        <!-- \u2500\u2500 PASO 2 \u2500\u2500 -->\r\n        <div class=\"step\" data-step=\"2\">\r\n          <h3 class=\"sx__q\">How many m\u00b2 is your stand?<\/h3>\r\n          <p class=\"sx__hint\">The floor area you have booked with the venue.<\/p>\r\n          <div class=\"sx__grid\">\r\n            <div class=\"sx__field sx__unit\" data-unit=\"m\u00b2\">\r\n              <label for=\"f-m2\">Total area <i>*<\/i><\/label>\r\n              <input class=\"sx__in\" id=\"f-m2\" type=\"number\" min=\"1\" inputmode=\"numeric\" placeholder=\"60\"\r\n                     name=\"form_fields[field_7167481]\" required data-m2>\r\n            <\/div>\r\n          <\/div>\r\n          <p class=\"err\" data-err>Enter your stand area in m\u00b2.<\/p>\r\n          <div class=\"sx__nav\">\r\n            <button type=\"button\" class=\"sx__btn sx__btn--back\" data-prev>\u2190 Back<\/button>\r\n            <button type=\"button\" class=\"sx__btn sx__btn--go\" data-next>Next<\/button>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- \u2500\u2500 PASO 3 \u00b7 las ilustraciones, aqu\u00ed y en el panel \u2500\u2500 -->\r\n        <div class=\"step\" data-step=\"3\">\r\n          <fieldset style=\"border:0;padding:0;margin:0\">\r\n            <legend class=\"sx__q\" style=\"padding:0\">How many walls does it have?<\/legend>\r\n            <p class=\"sx__hint\">Count the closed ones only. Open sides face the aisle.<\/p>\r\n            <div class=\"sx__opts sx__opts--w\">\r\n              <label class=\"sx__opt sx__opt--w\"><input type=\"radio\" name=\"form_fields[Walls]\" value=\"1 wall\" required data-walls=\"1\" data-ill=\"w1\">\r\n                <span><figure><img loading=\"lazy\" width=\"2560\" height=\"1440\" loading=\"lazy\" decoding=\"async\"\r\n                  src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2025\/04\/STAND-TIPO-E-scaled.jpg\"\r\n                  alt=\"Stand with 1 closed wall\"><\/figure><b>1 wall<\/b><\/span><\/label>\r\n              <label class=\"sx__opt sx__opt--w\"><input type=\"radio\" name=\"form_fields[Walls]\" value=\"2 walls\" data-walls=\"2\" data-ill=\"w2\">\r\n                <span><figure><img loading=\"lazy\" width=\"2048\" height=\"1152\" loading=\"lazy\" decoding=\"async\"\r\n                  src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2025\/04\/2-PAREDES.png\"\r\n                  alt=\"Corner stand with 2 closed walls\"><\/figure><b>2 walls<\/b><\/span><\/label>\r\n              <label class=\"sx__opt sx__opt--w\"><input type=\"radio\" name=\"form_fields[Walls]\" value=\"3 walls\" data-walls=\"3\" data-ill=\"w3\">\r\n                <span><figure><img loading=\"lazy\" width=\"2048\" height=\"1152\" loading=\"lazy\" decoding=\"async\"\r\n                  src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2025\/04\/3-PAREDES-1-1.png\"\r\n                  alt=\"Stand with 3 closed walls\"><\/figure><b>3 walls<\/b><\/span><\/label>\r\n            <\/div>\r\n          <\/fieldset>\r\n          <p class=\"err\" data-err>Choose how many walls.<\/p>\r\n          <div class=\"sx__nav\">\r\n            <button type=\"button\" class=\"sx__btn sx__btn--back\" data-prev>\u2190 Back<\/button>\r\n            <button type=\"button\" class=\"sx__btn sx__btn--go\" data-next>Next<\/button>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- \u2500\u2500 PASO 4 \u00b7 al entrar en cada campo, el panel muestra ESA pared \u2500\u2500 -->\r\n        <div class=\"step\" data-step=\"4\">\r\n          <h3 class=\"sx__q\">Width of each wall<\/h3>\r\n          <p class=\"sx__hint\">As you move through the fields, the diagram on the left shows which wall you are measuring.<\/p>\r\n          <div class=\"sx__grid\">\r\n            <div class=\"sx__field sx__unit\" data-unit=\"m\" data-walls-only=\"1\">\r\n              <label for=\"f-plarga\">Ancho de la pared<\/label>\r\n              <input class=\"sx__in\" id=\"f-plarga\" type=\"number\" min=\"2\" step=\"0.1\" inputmode=\"decimal\"\r\n                     placeholder=\"Enter the area\" name=\"form_fields[plarga]\" data-ill=\"plarga\" data-w=\"1a\"><\/div>\r\n            <div class=\"sx__field sx__unit\" data-unit=\"m\" data-walls-only=\"2\">\r\n              <label for=\"f-plarga2\">Ancho de la 1.\u00aa pared<\/label>\r\n              <input class=\"sx__in\" id=\"f-plarga2\" type=\"number\" min=\"2\" step=\"0.1\" inputmode=\"decimal\"\r\n                     placeholder=\"Enter the area\" name=\"form_fields[plarga2]\" data-ill=\"plarga2\" data-w=\"2a\"><\/div>\r\n            <div class=\"sx__field sx__unit\" data-unit=\"m\" data-walls-only=\"2\">\r\n              <label for=\"f-pcorta\">Ancho de la 2.\u00aa pared<\/label>\r\n              <input class=\"sx__in\" id=\"f-pcorta\" type=\"number\" min=\"2\" step=\"0.1\" inputmode=\"decimal\"\r\n                     placeholder=\"Enter the area\" name=\"form_fields[pcorta]\" data-ill=\"pcorta\" data-w=\"2b\"><\/div>\r\n            <div class=\"sx__field sx__unit\" data-unit=\"m\" data-walls-only=\"3\">\r\n              <label for=\"f-plarga3\">Ancho de la 1.\u00aa pared<\/label>\r\n              <input class=\"sx__in\" id=\"f-plarga3\" type=\"number\" min=\"2\" step=\"0.1\" inputmode=\"decimal\"\r\n                     placeholder=\"Enter the area\" name=\"form_fields[plarga3]\" data-ill=\"plarga3\" data-w=\"3a\"><\/div>\r\n            <div class=\"sx__field sx__unit\" data-unit=\"m\" data-walls-only=\"3\">\r\n              <label for=\"f-pcorta2\">Ancho de la 2.\u00aa pared<\/label>\r\n              <input class=\"sx__in\" id=\"f-pcorta2\" type=\"number\" min=\"2\" step=\"0.1\" inputmode=\"decimal\"\r\n                     placeholder=\"Enter the area\" name=\"form_fields[pcorta2]\" data-ill=\"pcorta2\" data-w=\"3b\"><\/div>\r\n            <div class=\"sx__field sx__unit\" data-unit=\"m\" data-walls-only=\"3\">\r\n              <label for=\"f-pcorta3\">Ancho de la 3.\u00aa pared<\/label>\r\n              <input class=\"sx__in\" id=\"f-pcorta3\" type=\"number\" min=\"2\" step=\"0.1\" inputmode=\"decimal\"\r\n                     placeholder=\"Enter the area\" name=\"form_fields[pcorta3]\" data-ill=\"pcorta3\" data-w=\"3c\"><\/div>\r\n          <\/div>\r\n          <p class=\"sx__relief\">Don't have the exact measurements to hand? A rough figure is fine \u2014 we'll pin it down together at the briefing.<\/p>\r\n          <div class=\"sx__nav\">\r\n            <button type=\"button\" class=\"sx__btn sx__btn--back\" data-prev>\u2190 Back<\/button>\r\n            <button type=\"button\" class=\"sx__btn sx__btn--go\" data-next>Next<\/button>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- \u2500\u2500 PASO 5 \u2500\u2500 -->\r\n        <div class=\"step\" data-step=\"5\">\r\n          <h3 class=\"sx__q\">Who should we send the quote to?<\/h3>\r\n          <div class=\"sx__grid\">\r\n            <div class=\"sx__field\"><label for=\"f-fn\">First name <i>*<\/i><\/label>\r\n              <input class=\"sx__in\" id=\"f-fn\" type=\"text\" name=\"form_fields[firstname]\" autocomplete=\"given-name\" required><\/div>\r\n            <div class=\"sx__field\"><label for=\"f-ln\">Last name <i>*<\/i><\/label>\r\n              <input class=\"sx__in\" id=\"f-ln\" type=\"text\" name=\"form_fields[lastname]\" autocomplete=\"family-name\" required><\/div>\r\n            <div class=\"sx__field\" style=\"grid-column:1\/-1\"><label for=\"f-fe\">Show you're exhibiting at <i>*<\/i><\/label>\r\n              <input class=\"sx__in\" id=\"f-fe\" type=\"text\" name=\"form_fields[feria_en_la_que_participas___form]\" placeholder=\"Alimentaria, MWC, ISE\u2026\" required><\/div>\r\n            <div class=\"sx__field\"><label for=\"f-em\">Email <i>*<\/i><\/label>\r\n              <input class=\"sx__in\" id=\"f-em\" type=\"email\" inputmode=\"email\" name=\"form_fields[email]\" autocomplete=\"email\" required><\/div>\r\n            <div class=\"sx__field\"><label for=\"f-co\">Company <i>*<\/i><\/label>\r\n              <input class=\"sx__in\" id=\"f-co\" type=\"text\" name=\"form_fields[Company]\" autocomplete=\"organization\" required><\/div>\r\n            <div class=\"sx__field\" style=\"grid-column:1\/-1\"><label for=\"f-ph\">Phone number <i>*<\/i><\/label>\r\n              <input class=\"sx__in\" id=\"f-ph\" type=\"tel\" inputmode=\"tel\" name=\"form_fields[phone]\" autocomplete=\"tel\"\r\n                     pattern=\"[0-9\\s\\(\\)+.\\-]{7,20}\" required><\/div>\r\n          <\/div>\r\n          <label class=\"sx__consent\"><input type=\"checkbox\" name=\"form_fields[field_44da6e6]\" required>\r\n            <span>I'd like to be contacted with a quote, and I accept the\r\n              <a href=\"https:\/\/www.serviscomplet.com\/en\/servis-privacy-policy\/\"\r\n                 target=\"_blank\" rel=\"noopener\">Privacy Policy<\/a>.<\/span><\/label>\r\n          <!-- Turnstile \u00b7 sin fricci\u00f3n: con appearance=\"interaction-only\" el\r\n               widget est\u00e1 invisible y solo aparece si Cloudflare sospecha.\r\n               Inyecta \u00e9l mismo el campo cf-turnstile-response en el form. -->\r\n          <div class=\"cf-turnstile ln__turn\" data-sitekey=\"0x4AAAAAADs1xuFGoip_A5_X\"\r\n               data-appearance=\"interaction-only\" data-language=\"en\" data-size=\"flexible\"><\/div>\r\n          <p class=\"err\" data-err>Check the highlighted fields before sending.<\/p>\r\n          <div class=\"sx__nav\">\r\n            <button type=\"button\" class=\"sx__btn sx__btn--back\" data-prev>\u2190 Back<\/button>\r\n            <button type=\"submit\" class=\"sx__btn sx__btn--go\">Get my free quote \u2192<\/button>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <input type=\"hidden\" name=\"form_fields[utm_source]\"><input type=\"hidden\" name=\"form_fields[utm_medium]\">\r\n        <input type=\"hidden\" name=\"form_fields[utm_campaign]\"><input type=\"hidden\" name=\"form_fields[current_url]\">\r\n        <input type=\"hidden\" name=\"form_fields[referrer]\"><input type=\"hidden\" name=\"form_fields[hubspotutk]\">\r\n        <!-- Identificadores de clic de Google Ads. Google manda uno u otro\r\n             seg\u00fan el caso, nunca los tres: gclid en la red de b\u00fasqueda,\r\n             wbraid y gbraid en clics desde iOS. Sin ellos no se puede\r\n             atribuir una conversi\u00f3n al anuncio que la gener\u00f3. -->\r\n        <input type=\"hidden\" name=\"form_fields[gclid]\"><input type=\"hidden\" name=\"form_fields[wbraid]\">\r\n        <input type=\"hidden\" name=\"form_fields[gbraid]\">\r\n      <\/form>\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/section>\r\n\r\n\r\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 MARQUESINA \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\r\n<div class=\"ln ln__proof\">\r\n  <p>They put their stand in our hands<\/p>\r\n  <div class=\"ln__mq\"><div class=\"ln__mqtrack\" data-mq><\/div><\/div>\r\n<\/div>\r\n\r\n\r\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 TIPOS \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\r\n<section class=\"ln ln__sec\">\r\n  <div class=\"ln__wrap\">\r\n    <div class=\"ln__head rv\">\r\n      <h2 class=\"ln__h\">Which kind of stand suits you?<\/h2>\r\n      <p class=\"ln__sub\">The price gap between them is wide, and the dearest is not always the one that pays off best. It comes down to how many shows you do a year.<\/p>\r\n    <\/div>\r\n\r\n    <div class=\"ln__tipos\">\r\n      <article class=\"ln__tipo rv\" style=\"--i:0\"><div class=\"ln__tipoart\">\r\n        <img decoding=\"async\" loading=\"lazy\" alt=\"Prefabricated modular stand at Efintec\"\r\n             src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2024\/08\/VKFIRA311-EFINTEC2023-scaled.jpg\">\r\n        <div class=\"ln__tipoin\"><b>Best value<\/b><h3>Prefabricated modular<\/h3>\r\n          <p>Reusable structures that slot together. Quick to build and kind on the budget. Customisation is limited to what the system allows.<\/p><\/div>\r\n      <\/div><\/article>\r\n\r\n      <article class=\"ln__tipo rv\" style=\"--i:1\"><div class=\"ln__tipoart\">\r\n        <img decoding=\"async\" loading=\"lazy\" alt=\"Hybrid stand at Mobile World Congress\"\r\n             src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2025\/03\/VKFIRA004-MWC2025-1-scaled.jpg\">\r\n        <div class=\"ln__tipoin\"><b>The middle ground<\/b><h3>Hybrid<\/h3>\r\n          <p>Modular systems combined with bespoke joinery. Still reusable, with far more freedom than pure modular.<\/p><\/div>\r\n      <\/div><\/article>\r\n\r\n      <article class=\"ln__tipo rv\" style=\"--i:2\"><div class=\"ln__tipoart\">\r\n        <img decoding=\"async\" loading=\"lazy\" alt=\"Fully bespoke stand at Mobile World Congress\"\r\n             src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2025\/03\/VKFIRA013-MWC2025-1-scaled.jpg\">\r\n        <div class=\"ln__tipoin\"><b>Maximum impact<\/b><h3>Fully bespoke<\/h3>\r\n          <p>Built from scratch, with no limits on shape, material or finish. Our own joinery, with lighting and technology built in. More investment, and not always reusable.<\/p><\/div>\r\n      <\/div><\/article>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n\r\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 PROPUESTA PERSONALIZADA \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\r\n<section class=\"ln ln__sec ln__sec--off\" id=\"propuesta\">\r\n  <div class=\"ln__wrap\">\r\n    <div class=\"ln__oferta\">\r\n\r\n      <div class=\"rv\">\r\n        <h2 class=\"ln__h\">Not sure which of the three <br>suits you?<\/h2>\r\n        <p class=\"ln__sub\">It depends on the area, the budget, where you are on the floor plan and a few things more. Tell us your case and we'll look at it with you.<\/p>\r\n\r\n        <ul class=\"ln__ruta\">\r\n          <li style=\"--n:0\"><b>You tell us about the project<\/b><span>The area you've booked, the show, the dates and what you'd like to happen there. If you're not clear yet, we'll guide you so the whole thing goes well.<\/span><\/li>\r\n          <li style=\"--n:1\"><b>One person to talk to<\/b><span>An account manager stays with your project to the end. They check your measurements, your brand guidelines and what the venue requires, and flag anything that doesn't add up before we start designing.<\/span><\/li>\r\n          <li style=\"--n:2\"><b>We put a proposal together<\/b><span>The design team works to your show and to the space you've been given. You get it with the budget and what's included, in writing. No cost and no commitment: if it doesn't convince you, we change whatever you need.<\/span><\/li>\r\n          <li style=\"--n:3\" class=\"ln__ruta-sep\">If we go ahead<\/li>\r\n          <li style=\"--n:4\"><b>We build it and we install it<\/b><span>It's built in our own workshops and installed by our own crew. The same people who ran the project are there on build-up day.<\/span><\/li>\r\n          <li style=\"--n:5\"><b>We handle the paperwork<\/b><span>Permits, technical drawings and dealings with the venue. It's the heaviest part and the one that causes the most scares, so we take it off your hands.<\/span><\/li>\r\n          <li style=\"--n:6\"><b>And we clear up afterwards<\/b><span>When the show ends, you're done. We dismantle and take everything away, keeping whatever can be reused.<\/span><\/li>\r\n        <\/ul>\r\n      <\/div>\r\n\r\n      <div class=\"ln__shell rv\" style=\"--i:1\"><div class=\"ln__core\">\r\n        <form class=\"ln__formin\" data-form-propuesta data-origen=\"seccion-propuesta\" method=\"post\" novalidate>\r\n          <h3>Tell us about your project<\/h3>\r\n          <p>We'll come back with a proposal built around your show. No commitment.<\/p>\r\n\r\n          <div class=\"sx__grid\">\r\n            <div class=\"sx__field\"><label for=\"p-nom\">First name <i>*<\/i><\/label>\r\n              <input class=\"sx__in\" id=\"p-nom\" type=\"text\" name=\"firstname\" autocomplete=\"given-name\" required><\/div>\r\n            <div class=\"sx__field\"><label for=\"p-ape\">Last name <i>*<\/i><\/label>\r\n              <input class=\"sx__in\" id=\"p-ape\" type=\"text\" name=\"lastname\" autocomplete=\"family-name\" required><\/div>\r\n            <div class=\"sx__field\"><label for=\"p-mail\">Email <i>*<\/i><\/label>\r\n              <input class=\"sx__in\" id=\"p-mail\" type=\"email\" name=\"email\" autocomplete=\"email\" required><\/div>\r\n            <div class=\"sx__field\"><label for=\"p-tel\">Phone number <i>*<\/i><\/label>\r\n              <input class=\"sx__in\" id=\"p-tel\" type=\"tel\" inputmode=\"tel\" name=\"phone\" autocomplete=\"tel\"\r\n                     pattern=\"[0-9\\s\\(\\)+.\\-]{7,20}\" required><\/div>\r\n            <div class=\"sx__field\" style=\"grid-column:1\/-1\"><label for=\"p-emp\">Company <i>*<\/i><\/label>\r\n              <input class=\"sx__in\" id=\"p-emp\" type=\"text\" name=\"company\" autocomplete=\"organization\" required><\/div>\r\n            <div class=\"sx__field\" style=\"grid-column:1\/-1\"><label for=\"p-fer\">Which show are you exhibiting at? <i>*<\/i><\/label>\r\n              <input class=\"sx__in\" id=\"p-fer\" type=\"text\" name=\"feria\" required><\/div>\r\n            <div class=\"sx__field\" style=\"grid-column:1\/-1\"><label for=\"p-msg\">Tell us what you need<\/label>\r\n              <textarea class=\"ln__ta\" id=\"p-msg\" name=\"mensaje\"\r\n                        placeholder=\"Area, kind of stand, dates, references you like\u2026\"><\/textarea><\/div>\r\n          <\/div>\r\n\r\n          <label class=\"sx__consent\"><input type=\"checkbox\" name=\"consent\" required>\r\n            <span>I accept the <a href=\"https:\/\/www.serviscomplet.com\/en\/servis-privacy-policy\/\"\r\n               target=\"_blank\" rel=\"noopener\">Privacy Policy<\/a> and to receiving communications from Servis Complet, S.L.<\/span><\/label>\r\n\r\n          <div class=\"cf-turnstile ln__turn\" data-sitekey=\"0x4AAAAAADs1xuFGoip_A5_X\"\r\n               data-appearance=\"interaction-only\" data-language=\"en\" data-size=\"flexible\"><\/div>\r\n          <p class=\"err\" data-err-propuesta>Check the highlighted fields before sending.<\/p>\r\n\r\n          <div class=\"sx__nav\" style=\"padding-top:24px\">\r\n            <button type=\"submit\" class=\"sx__btn sx__btn--go\">Request a proposal \u2192<\/button>\r\n          <\/div>\r\n        <\/form>\r\n      <\/div><\/div>\r\n\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n\r\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 QUI\u00c9N ES SERVIS \u00b7 escena de v\u00eddeo \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\r\n<section class=\"ln ln__esc\">\r\n  <div class=\"ln__escpin\">\r\n    <div class=\"ln__escvid\">\r\n      <!-- WebM primero: pesa un 21% menos y lo entienden Chrome, Edge y Firefox.\r\n           Safari cae al MP4. -->\r\n      <video autoplay muted loop playsinline preload=\"metadata\" aria-hidden=\"true\">\r\n        <source src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2026\/08\/lp-video-intro.webm\" type=\"video\/webm\">\r\n        <source src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2026\/08\/lp-video-intro.mp4\" type=\"video\/mp4\">\r\n      <\/video>\r\n    <\/div>\r\n\r\n    <div class=\"ln__esctxt\">\r\n      <h2 class=\"ln__escq\">Who are Servis?<\/h2>\r\n      <p class=\"ln__esca\">We have spent more than 60 years designing and building stands for trade shows and congresses in Spain. We turn ideas into spaces that communicate, connect and sell. From emerging brands to large multinationals, we stay with our clients through the whole process, from the first sketch to build-up, making sure every detail is under control.<\/p>\r\n\r\n      <p class=\"ln__esccita\">Our commitment is that you get to enjoy the show, and live it without the stress.<\/p>\r\n\r\n      <div class=\"ln__escdatos\">\r\n        <div class=\"ln__escd\" style=\"--n:0\"><b>Stands each year<\/b>\r\n          <strong>500<i>+<\/i><\/strong>\r\n          <span>Across Spain and at international shows such as MWC Barcelona.<\/span><\/div>\r\n        <div class=\"ln__escd\" style=\"--n:1\"><b>In-house assembly staff<\/b>\r\n          <strong>120<i>+<\/i><\/strong>\r\n          <span>Designers, joiners and build crews. Ours, not subcontracted.<\/span><\/div>\r\n        <div class=\"ln__escd\" style=\"--n:2\"><b>Turnover in 2025<\/b>\r\n          <strong>+60<i>M\u20ac<\/i><\/strong>\r\n          <span>Across trade show stands, congresses and large institutional events.<\/span><\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n\r\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 EJEMPLOS DE NUESTROS STANDS \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\r\n<section class=\"ln ln__mosaico\" data-mosaico>\r\n  <div class=\"ln__wrap\">\r\n    <div class=\"ln__mosgrid\" data-grid>\r\n      <div class=\"ln__mosT\"><h2>Some of the stands we've built<\/h2><\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<!-- Capa propia en vez de <dialog>. El elemento nativo daba el foco atrapado,\r\n     el Escape y el fondo inerte de balde, pero dentro de Elementor result\u00f3\r\n     fr\u00e1gil: contenedores flex, transform y el top layer lo dejaban sin\r\n     centrar y sin oscurecer el fondo. Esto es predecible en cualquier\r\n     entorno; el foco y el Escape se hacen a mano abajo, en el JS. -->\r\n<div class=\"ln__fich\" data-ficha hidden role=\"dialog\" aria-modal=\"true\"\r\n     aria-label=\"Enlarged stand photo\">\r\n  <div class=\"ln__fichpanel\">\r\n    <p class=\"ln__fichnum\"><b data-fnum>1<\/b> \/ <span data-ftot>12<\/span><\/p>\r\n    <button class=\"ln__fichbtn ln__fichx\" data-cerrar aria-label=\"Close\">\r\n      <svg viewBox=\"0 0 24 24\"><path d=\"M18 6 6 18M6 6l12 12\"\/><\/svg><\/button>\r\n    <button class=\"ln__fichbtn ln__fichnav ln__fichnav--ant\" data-mover=\"-1\" aria-label=\"Previous stand\">\r\n      <svg viewBox=\"0 0 24 24\"><path d=\"M15 18l-6-6 6-6\"\/><\/svg><\/button>\r\n    <button class=\"ln__fichbtn ln__fichnav ln__fichnav--sig\" data-mover=\"1\" aria-label=\"Next stand\">\r\n      <svg viewBox=\"0 0 24 24\"><path d=\"M9 18l6-6-6-6\"\/><\/svg><\/button>\r\n    <div class=\"ln__fichcaja\">\r\n      <img class=\"ln__fichimg\" data-fimg alt=\"\">\r\n    <\/div>\r\n  <\/div>\r\n<\/div>\r\n\r\n\r\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 CERTIFICACIONES \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\r\n<section class=\"ln ln__certs\">\r\n  <div class=\"ln__wrap\">\r\n    <div class=\"ln__certgrid\">\r\n      <article class=\"ln__certc\">\r\n        <b>Sustainability<\/b>\r\n        <h3>Your stand doesn't end when we take it down<\/h3>\r\n        <p>We hold 25,000 m\u00b2 of our own modular stock. The structures come back to the warehouse and go out again show after show, so your stand has a long life instead of ending up in a skip on breakdown day.<\/p>\r\n        <ul class=\"ln__certlista\">\r\n          <li><svg viewBox=\"0 0 24 24\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg>25,000 m\u00b2 of our own modular stock, reused show after show<\/li>\r\n          <li><svg viewBox=\"0 0 24 24\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg>Carbon footprint measured and offset through reforestation<\/li>\r\n          <li><svg viewBox=\"0 0 24 24\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg>FSC and PEFC traceable timber<\/li>\r\n          <li><svg viewBox=\"0 0 24 24\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg>100% green energy across our facilities since 2016<\/li>\r\n        <\/ul>\r\n        <div class=\"ln__certpie\">\r\n          <img decoding=\"async\" style=\"--k:1.24\" src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2026\/08\/lp-cert-huella-carbono-ministerio.jpg\" alt=\"Ministry Carbon Footprint seal\">\r\n          <img decoding=\"async\" style=\"--k:.74\" src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2026\/08\/lp-cert-iso-14001.png\" alt=\"ISO 14001\">\r\n          <img decoding=\"async\" style=\"--k:1.24\" src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2026\/08\/lp-cert-eventsost.png\" alt=\"Eventsost\">\r\n        <\/div>\r\n      <\/article>\r\n\r\n      <article class=\"ln__certc\">\r\n        <b>Quality and approvals<\/b>\r\n        <h3>The venues already know us<\/h3>\r\n        <p>Being an approved supplier means the technical drawings, the sign-off and the permits go through without surprises. It is the single biggest cause of delays when your contractor isn't.<\/p>\r\n        <ul class=\"ln__certlista\">\r\n          <li><svg viewBox=\"0 0 24 24\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg>Approved supplier at Fira Barcelona, IFEMA and Feria de Zaragoza<\/li>\r\n          <li><svg viewBox=\"0 0 24 24\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg>ISO 9001 quality management, certified by T\u00dcV<\/li>\r\n          <li><svg viewBox=\"0 0 24 24\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M20 6 9 17l-5-5\"\/><\/svg>Members of ICCA and of the Spanish Trade Fairs Association<\/li>\r\n        <\/ul>\r\n        <div class=\"ln__certpie\">\r\n          <!-- Factores de \u00e1rea \u00f3ptica: k = \u221a(Q\/ratio), con Q = media geom\u00e9trica\r\n               de los ratios del grupo. Igualar por altura no sirve cuando los\r\n               ratios van de 0,64 (ICCA, vertical) a 1,98 (ISO, apaisado).\r\n               Fira e IFEMA llevan un 25% m\u00e1s de \u00e1rea \u2014son las homologaciones\r\n               de recinto, las que m\u00e1s pesan\u2014, pero en la misma familia. -->\r\n          <img decoding=\"async\" style=\"--k:.96\"  src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2026\/08\/lp-cert-fira-barcelona.png\" alt=\"Fira Barcelona\">\r\n          <img decoding=\"async\" style=\"--k:1.15\" src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2026\/08\/lp-cert-ifema.png\" alt=\"IFEMA Madrid\">\r\n          <img decoding=\"async\" style=\"--k:1.47\" src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2026\/08\/lp-cert-icca.png\" alt=\"ICCA\">\r\n          <img decoding=\"async\" style=\"--k:.93\"  src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2026\/08\/lp-cert-afe.png\" alt=\"AFE\">\r\n          <img decoding=\"async\" style=\"--k:.84\"  src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2026\/08\/lp-cert-iso-9001.png\" alt=\"ISO 9001\">\r\n        <\/div>\r\n      <\/article>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n\r\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 FAQ \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\r\n<section class=\"ln ln__sec\">\r\n  <div class=\"ln__wrap\">\r\n    <div class=\"ln__head ln__head--c rv\">\r\n      <h2 class=\"ln__h\">What people ask us before deciding<\/h2>\r\n    <\/div>\r\n    <div class=\"ln__faq rv\" style=\"--i:1\">\r\n      <details open><summary>How much does a stand cost?<\/summary>\r\n        <p>Mostly on the area, the number of closed walls and the kind of stand: modular, hybrid or bespoke. That is what the calculator above is for. With those figures we put together a personalised quote, free and with no commitment.<\/p><\/details>\r\n      <details><summary>What kinds of stands do you build?<\/summary>\r\n        <p>Modular, bespoke and a combination of the two. We work to what you need, so the space reflects your brand and gets the most out of the show for you.<\/p><\/details>\r\n      <details><summary>What does the installation service include?<\/summary>\r\n        <p>Transport of the stand to the venue, installation and assembly to the approved design, testing of lighting, screens and everything else, and dismantling and removal once the event is over.<\/p><\/details>\r\n      <details><summary>Do you deal with the venue paperwork?<\/summary>\r\n        <p>Yes, all of it, so you do not have to worry about a thing: coordinating with the organisers, handling permits and meeting the venue regulations. We will also advise you on ordering services such as power and internet.<\/p><\/details>\r\n      <details><summary>Can it be done sustainably?<\/summary>\r\n        <p>It is how we work. Reusable materials, modular design and careful use of resources to cut waste and emissions, with tools to measure the real impact of the event afterwards. Backed by ISO 9001 and 14001, the Ministry carbon footprint seal and Eventsost certification.<\/p><\/details>\r\n      <details><summary>Where do you install?<\/summary>\r\n        <p>We have our own facilities in Barcelona, Madrid and Zaragoza \u2014 25,000 m\u00b2 with joinery and workshops \u2014 and we are approved suppliers for Fira de Barcelona, IFEMA and Feria de Zaragoza. Installation is done by our own staff, not subcontracted.<\/p><\/details>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n\r\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 CIERRE \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n     Quien llega hasta aqu\u00ed ya ha le\u00eddo la p\u00e1gina entera: mandarlo de vuelta\r\n     arriba a la calculadora era perder la conversi\u00f3n. Cierra el formulario. -->\r\n<section class=\"ln ln__sec ln__sec--off\" id=\"cierre\">\r\n  <div class=\"ln__wrap\">\r\n    <div class=\"ln__cierre\">\r\n\r\n      <div class=\"ln__head ln__head--c rv\" style=\"margin:0 auto\">\r\n        <h2 class=\"ln__h\">Shall we talk about your next show?<\/h2>\r\n        <p class=\"ln__sub\">Tell us about the project and we will put together a proposal built around your show and your space. A person from the team replies, free and with no commitment.<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"ln__shell rv\" style=\"--i:1\"><div class=\"ln__core\">\r\n        <form class=\"ln__formin\" data-form-propuesta data-origen=\"cierre\" method=\"post\" novalidate>\r\n          <h3>Tell us about your project<\/h3>\r\n          <p>The more you tell us, the sharper the proposal will be.<\/p>\r\n\r\n          <div class=\"sx__grid\">\r\n            <div class=\"sx__field\"><label for=\"c-nom\">First name <i>*<\/i><\/label>\r\n              <input class=\"sx__in\" id=\"c-nom\" type=\"text\" name=\"firstname\" autocomplete=\"given-name\" required><\/div>\r\n            <div class=\"sx__field\"><label for=\"c-ape\">Last name <i>*<\/i><\/label>\r\n              <input class=\"sx__in\" id=\"c-ape\" type=\"text\" name=\"lastname\" autocomplete=\"family-name\" required><\/div>\r\n            <div class=\"sx__field\"><label for=\"c-mail\">Email <i>*<\/i><\/label>\r\n              <input class=\"sx__in\" id=\"c-mail\" type=\"email\" name=\"email\" autocomplete=\"email\" required><\/div>\r\n            <div class=\"sx__field\"><label for=\"c-tel\">Phone number <i>*<\/i><\/label>\r\n              <input class=\"sx__in\" id=\"c-tel\" type=\"tel\" inputmode=\"tel\" name=\"phone\" autocomplete=\"tel\"\r\n                     pattern=\"[0-9\\s\\(\\)+.\\-]{7,20}\" required><\/div>\r\n            <div class=\"sx__field\" style=\"grid-column:1\/-1\"><label for=\"c-emp\">Company <i>*<\/i><\/label>\r\n              <input class=\"sx__in\" id=\"c-emp\" type=\"text\" name=\"company\" autocomplete=\"organization\" required><\/div>\r\n            <div class=\"sx__field\" style=\"grid-column:1\/-1\"><label for=\"c-fer\">Which show are you exhibiting at? <i>*<\/i><\/label>\r\n              <input class=\"sx__in\" id=\"c-fer\" type=\"text\" name=\"feria\" required><\/div>\r\n            <div class=\"sx__field\" style=\"grid-column:1\/-1\"><label for=\"c-msg\">Tell us what you need<\/label>\r\n              <textarea class=\"ln__ta\" id=\"c-msg\" name=\"mensaje\"\r\n                        placeholder=\"Area, kind of stand, dates, references you like\u2026\"><\/textarea><\/div>\r\n          <\/div>\r\n\r\n          <label class=\"sx__consent\"><input type=\"checkbox\" name=\"consent\" required>\r\n            <span>I accept the <a href=\"https:\/\/www.serviscomplet.com\/en\/servis-privacy-policy\/\"\r\n               target=\"_blank\" rel=\"noopener\">Privacy Policy<\/a> and to receiving communications from Servis Complet, S.L.<\/span><\/label>\r\n\r\n          <div class=\"cf-turnstile ln__turn\" data-sitekey=\"0x4AAAAAADs1xuFGoip_A5_X\"\r\n               data-appearance=\"interaction-only\" data-language=\"en\" data-size=\"flexible\"><\/div>\r\n          <p class=\"err\" data-err-propuesta>Check the highlighted fields before sending.<\/p>\r\n\r\n          <div class=\"sx__nav\" style=\"padding-top:24px\">\r\n            <button type=\"submit\" class=\"sx__btn sx__btn--go\">Request a proposal \u2192<\/button>\r\n          <\/div>\r\n        <\/form>\r\n      <\/div><\/div>\r\n\r\n      <p class=\"ln__endnote rv\" style=\"--i:2;text-align:center\">\r\n        Just after the price? <a href=\"#calculadora\">Work it out in a minute<\/a> \u00b7 Or call us on <a href=\"tel:+34934233107\">934 233 107<\/a>.<\/p>\r\n\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<script>\r\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n   MOVIMIENTO \u00b7 alineado al sistema de \u00abP\u00e1gina de organizadores\u00bb\r\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n(function () {\r\n  'use strict';\r\n  var quieto = window.matchMedia('(prefers-reduced-motion: reduce)').matches;\r\n\r\n  \/* \u2500\u2500 Marquesina de logos \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n     La pista se duplica para que el bucle a -50% sea continuo y sin salto. *\/\r\n  \/* [nombre visible, archivo]. El archivo va aparte del nombre porque los\r\n     nombres llevan espacios y la biblioteca de medios de WordPress no los\r\n     admite: \u00abESC Congress\u00bb \u2192 lp-logo-esc-congress.png *\/\r\n  var LOGOS = [\r\n    ['Microsoft','microsoft'], ['HP','hp'], ['AWS','aws'], ['SUSE','suse'],\r\n    ['Jfrog','jfrog'], ['ESC Congress','esc-congress'], ['ESMO','esmo'], ['DAMM','damm'],\r\n    ['Casa Tarradellas','casa-tarradellas'], ['FESTO','festo'], ['Fagor','fagor'],\r\n    ['Galenicum','galenicum'], ['KAIS','kais'], ['KONTRON','kontron'],\r\n    ['Mercamadrid','mercamadrid'], ['NAGARRO','nagarro'], ['SEQUANS','sequans'],\r\n    ['DIGITAIN','digitain'], ['Davis Cup','davis-cup'], ['CSG','csg'], ['COP 25','cop-25']\r\n  ];\r\n  var pista = document.querySelector('[data-mq]');\r\n  if (pista) {\r\n    var html = '';\r\n    for (var v = 0; v < 2; v++) {\r\n      for (var i = 0; i < LOGOS.length; i++) {\r\n        html += '<img decoding=\"async\" loading=\"lazy\" alt=\"' + (v ? '' : LOGOS[i][0]) + '\"' +\r\n                (v ? ' aria-hidden=\"true\"' : '') +\r\n                ' src=\"https:\/\/www.serviscomplet.com\/wp-content\/uploads\/2026\/08\/lp-logo-' + LOGOS[i][1] + '.png\">';\r\n      }\r\n    }\r\n    pista.innerHTML = html;\r\n  }\r\n\r\n  \/* \u2500\u2500 Revelados \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\r\n  var piezas = document.querySelectorAll('.rv');\r\n  function revelaTodo() {\r\n    for (var i = 0; i < piezas.length; i++) piezas[i].classList.add('is-in');\r\n  }\r\n  if (quieto || !('IntersectionObserver' in window)) {\r\n    revelaTodo();\r\n  } else {\r\n    var obs = new IntersectionObserver(function (es) {\r\n      es.forEach(function (e) {\r\n        if (!e.isIntersecting) return;\r\n        e.target.classList.add('is-in');\r\n        obs.unobserve(e.target);\r\n      });\r\n    }, { rootMargin: '0px 0px -12% 0px', threshold: 0.08 });\r\n    piezas.forEach(function (p) { obs.observe(p); });\r\n    \/* Red de seguridad: hay entornos donde el observador existe pero no dispara. *\/\r\n    setTimeout(function () {\r\n      var ocultas = 0;\r\n      for (var i = 0; i < piezas.length; i++)\r\n        if (!piezas[i].classList.contains('is-in')) ocultas++;\r\n      if (ocultas === piezas.length && piezas.length) revelaTodo();\r\n    }, 2500);\r\n  }\r\n\r\n  \/* \u2500\u2500 Cifras que cuentan \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\r\n  var cifras = document.querySelectorAll('[data-cuenta]');\r\n  function pinta(el, v) {\r\n    el.childNodes[0].nodeValue = el.getAttribute('data-fmt') === 'miles'\r\n      ? v.toLocaleString('es-ES') : String(v);\r\n  }\r\n  if (!quieto && 'IntersectionObserver' in window && cifras.length) {\r\n    var obs2 = new IntersectionObserver(function (es) {\r\n      es.forEach(function (e) {\r\n        if (!e.isIntersecting) return;\r\n        var el = e.target, fin = parseInt(el.getAttribute('data-cuenta'), 10), t0 = null;\r\n        function paso(t) {\r\n          if (t0 === null) t0 = t;\r\n          var p = Math.min((t - t0) \/ 1150, 1);\r\n          pinta(el, Math.round(fin * (1 - Math.pow(1 - p, 3))));\r\n          if (p < 1) requestAnimationFrame(paso);\r\n        }\r\n        pinta(el, 0); requestAnimationFrame(paso); obs2.unobserve(el);\r\n      });\r\n    }, { threshold: 0.5 });\r\n    cifras.forEach(function (c) { obs2.observe(c); });\r\n  }\r\n\r\n\r\n\r\n  \/* \u2500\u2500 Recorrido de la propuesta \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\r\n  var ruta = document.querySelector('.ln__ruta');\r\n  if (ruta && !quieto && 'IntersectionObserver' in window) {\r\n    ruta.setAttribute('data-anim', '');          \/* solo si vamos a animarlo *\/\r\n    var oRuta = new IntersectionObserver(function (es) {\r\n      es.forEach(function (e) {\r\n        if (!e.isIntersecting) return;\r\n        ruta.classList.add('is-on');\r\n        oRuta.disconnect();\r\n      });\r\n    }, { threshold: 0.25 });\r\n    oRuta.observe(ruta);\r\n  }\r\n\r\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n     ANTI-SPAM \u00b7 dos barreras sin fricci\u00f3n para la persona\r\n     \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n     Ninguna de las dos sustituye a un CAPTCHA ni a validar en servidor: quien\r\n     sepa leer este JavaScript las esquiva en cinco minutos. Sirven contra el\r\n     spam autom\u00e1tico de baja calidad, que es el 95% de lo que recibe una\r\n     landing de Google Ads. Ver la nota del encabezado sobre mover el env\u00edo al\r\n     servidor, que es la soluci\u00f3n de verdad.\r\n\r\n       1 \u00b7 SE\u00d1UELO. Un campo que la persona no ve ni puede enfocar, pero que\r\n           el bot rellena porque lee el HTML. Si viene con algo, se descarta.\r\n           Va oculto con posici\u00f3n fuera de pantalla y no con display:none,\r\n           porque muchos bots ya ignoran los campos ocultos as\u00ed.\r\n\r\n       2 \u00b7 RELOJ. Una persona tarda como m\u00ednimo unos segundos en rellenar un\r\n           formulario; un bot lo env\u00eda en menos de uno. Por debajo del umbral\r\n           se descarta.\r\n\r\n     Las dos rechazan EN SILENCIO \u2014ense\u00f1an el mismo mensaje de \u00e9xito\u2014 para no\r\n     dar pistas a quien est\u00e9 probando.\r\n  \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n  \/* Mismo endpoint que la calculadora. Est\u00e1 declarado aqu\u00ed aparte porque este\r\n     es otro bloque <script> y no ve el CONFIG del otro. Si cambia el dominio,\r\n     hay que tocarlo en los dos sitios. *\/\r\n  var ENDPOINT_LEADS = 'https:\/\/www.serviscomplet.com\/wp-admin\/admin-ajax.php';\r\n  \/* P\u00e1gina propia, distinta de la de la calculadora: el proceso es otro y\r\n     as\u00ed se miden por separado en Ads. *\/\r\n  var GRACIAS_URL = 'https:\/\/www.serviscomplet.com\/en\/thank-you-very-much\/';\r\n\r\n  var ANTISPAM = {\r\n    SEGUNDOS_MINIMOS: 4,\r\n    \/* Inyecta el se\u00f1uelo y marca la hora de nacimiento del formulario. *\/\r\n    proteger: function (f) {\r\n      var s = document.createElement('div');\r\n      s.setAttribute('aria-hidden', 'true');\r\n      s.style.cssText = 'position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden';\r\n      s.innerHTML = '<label>No rellenes este campo' +\r\n        '<input type=\"text\" name=\"_apellido2\" tabindex=\"-1\" autocomplete=\"off\"><\/label>';\r\n      f.appendChild(s);\r\n      f.setAttribute('data-nacido', String(new Date().getTime()));\r\n    },\r\n  };\r\n\r\n  \/* \u2500\u2500 Formulario de propuesta personalizada \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n     Valida, pero NO env\u00eda: falta decidir el destino (embed nativo de HubSpot\r\n     o webhook de Make con una rama nueva). Ver la nota de la entrega.        *\/\r\n  \/* Hay dos en la p\u00e1gina \u2014el de la secci\u00f3n de propuesta y el del cierre\u2014, as\u00ed\r\n     que se cablean todos, no solo el primero. *\/\r\n  [].slice.call(document.querySelectorAll('[data-form-propuesta]')).forEach(function (fp) {\r\n    var errp = fp.querySelector('[data-err-propuesta]');\r\n    ANTISPAM.proteger(fp);\r\n    fp.addEventListener('submit', function (ev) {\r\n      ev.preventDefault();\r\n      var campos = fp.querySelectorAll('input[required], textarea[required]');\r\n      var fallo = null;\r\n      for (var i = 0; i < campos.length; i++) {\r\n        var c = campos[i];\r\n        var ok = c.type === 'checkbox' ? c.checked : (c.value.trim() && c.checkValidity());\r\n        c.setAttribute('data-invalid', ok ? 'false' : 'true');\r\n        if (!ok && !fallo) fallo = c;\r\n      }\r\n      if (fallo) {\r\n        if (errp) errp.classList.add('is-on');\r\n        fallo.focus();\r\n        return;\r\n      }\r\n      if (errp) errp.classList.remove('is-on');\r\n\r\n      var d = {};\r\n      new FormData(fp).forEach(function (v, k) { d[k] = v; });\r\n      d.origen = fp.getAttribute('data-origen') || ''; d.idioma = 'en';\r\n\r\n      \/* El descarte lo decide el servidor, no esto. Ver la nota del otro\r\n         formulario: con dos jueces, uno de ellos invisible, un env\u00edo leg\u00edtimo\r\n         puede desaparecer sin dejar rastro en ninguna parte. *\/\r\n\r\n      \/* Mismo formato que el receptor de la landing en ingl\u00e9s: admin-ajax con\r\n         una \u00abaction\u00bb y el payload como JSON en el campo \u00abdata\u00bb. Va en JSON y\r\n         no como campos sueltos porque PHP convierte en guiones bajos los\r\n         espacios y los puntos de los NOMBRES de par\u00e1metro, y la calculadora\r\n         manda claves con espacios. *\/\r\n      var nacido = Number(fp.getAttribute('data-nacido') || 0);\r\n      d._segundos = nacido ? ((new Date().getTime() - nacido) \/ 1000).toFixed(1) : '';\r\n      var tk = fp.querySelector('[name=\"cf-turnstile-response\"]');\r\n      if (tk) d['cf-turnstile-response'] = tk.value;\r\n\r\n      var cuerpo = new URLSearchParams();\r\n      cuerpo.append('action', 'servis_lp_lead');\r\n      cuerpo.append('data', JSON.stringify(d));\r\n\r\n      var boton = fp.querySelector('[type=submit]');\r\n      if (boton) { boton.disabled = true; boton.textContent = 'Enviando\u2026'; }\r\n\r\n      fetch(ENDPOINT_LEADS, {\r\n        method: 'POST',\r\n        headers: { 'Content-Type': 'application\/x-www-form-urlencoded;charset=UTF-8' },\r\n        body: cuerpo.toString()\r\n      })\r\n      .then(function (r) {\r\n        if (!r.ok) throw new Error('HTTP ' + r.status);\r\n        if (window.dataLayer) window.dataLayer.push({ event: 'form_propuesta_enviado' });\r\n        if (GRACIAS_URL) { location.href = GRACIAS_URL; return; }\r\n        agradecer(fp);\r\n      })\r\n      .catch(function (err) {\r\n        if (boton) { boton.disabled = false; boton.textContent = 'Request a proposal \u2192'; }\r\n        if (errp) {\r\n          errp.textContent = 'We could not send it. Please try again or call us on +34 934 233 107.';\r\n          errp.classList.add('is-on');\r\n        }\r\n        \/* Solo el error, nunca el payload. *\/\r\n        console.error('Fallo al enviar la propuesta:', err && err.message);\r\n      });\r\n    });\r\n  });\r\n\r\n  function agradecer(f) {\r\n    f.innerHTML = '<h3 class=\"ln__gracias\">Got it, thank you<\/h3>' +\r\n      '<p class=\"ln__graciassub\">We will be in touch as soon as we can ' +\r\n      'with a proposal for your show.<\/p>';\r\n  }\r\n\r\n  \/* SI LA WEB YA LLEVA LENIS, NO SE ARRANCA OTRO.\r\n     serviscomplet.com ya usa Lenis 1.3.23. Dos instancias compitiendo por el\r\n     scroll dan tirones y saltos imposibles de depurar, y el usuario lo nota\r\n     como una web \u00abpesada\u00bb. Aqu\u00ed solo se inicia si no hay ninguna. *\/\r\n  if (window.Lenis || window.lenis || document.documentElement.classList.contains('lenis')) {\r\n    quieto = true;\r\n  }\r\n\r\n  \/* \u2500\u2500 Lenis \u00b7 misma versi\u00f3n que el resto del sitio (1.3.23) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n     SUBRESOURCE INTEGRITY. Esta p\u00e1gina trata datos personales \u2014nombre, correo,\r\n     tel\u00e9fono, empresa\u2014, y cargaba JavaScript de unpkg.com sin verificar. Si\r\n     ese CDN se ve comprometido, o alguien publica una versi\u00f3n alterada bajo la\r\n     misma URL, se ejecuta c\u00f3digo arbitrario en la p\u00e1gina que tiene el\r\n     formulario delante. Con integrity el navegador compara el hash y, si no\r\n     cuadra, NO ejecuta el archivo: se pierde el scroll suave, no los datos.\r\n     Hashes calculados sobre los archivos reales de lenis@1.3.23. Si alg\u00fan d\u00eda\r\n     se sube de versi\u00f3n hay que recalcularlos o el scroll dejar\u00e1 de cargar. *\/\r\n  if (!quieto) {\r\n    var css = document.createElement('link');\r\n    css.rel = 'stylesheet';\r\n    css.href = 'https:\/\/unpkg.com\/lenis@1.3.23\/dist\/lenis.css';\r\n    css.integrity = 'sha384-gvLq\/iOMNnPchdosgVym5huSVkKipHCQaqSw2Eg0V52Mzmlf169ZOsXcNc2cNu8x';\r\n    css.crossOrigin = 'anonymous';\r\n    document.head.appendChild(css);\r\n    var js = document.createElement('script');\r\n    js.src = 'https:\/\/unpkg.com\/lenis@1.3.23\/dist\/lenis.min.js';\r\n    js.integrity = 'sha384-iiCtod6ZId6zT42Bar9EFXNKZh8X4VliWYWFOuY3\/t1AxCvLejXExXcbluoc57CJ';\r\n    js.crossOrigin = 'anonymous';\r\n    js.onload = function () {\r\n      if (!window.Lenis) return;\r\n      var l = new window.Lenis({ autoRaf: true });\r\n      \/* Los anclajes deben seguir funcionando con Lenis en marcha *\/\r\n      document.querySelectorAll('a[href^=\"#\"]').forEach(function (a) {\r\n        a.addEventListener('click', function (ev) {\r\n          var d = document.querySelector(a.getAttribute('href'));\r\n          if (!d) return;\r\n          ev.preventDefault();\r\n          l.scrollTo(d, { offset: -80 });\r\n        });\r\n      });\r\n    };\r\n    document.head.appendChild(js);\r\n  }\r\n})();\r\n<\/script>\r\n\r\n<script>\r\n(function () {\r\n  'use strict';\r\n\r\n  var root  = document.querySelector('[data-root]');\r\n  var form  = root.querySelector('[data-form]');\r\n  var steps = [].slice.call(form.querySelectorAll('[data-step]'));\r\n  var total = steps.length;\r\n  var current = 1;\r\n\r\n  var fill    = root.querySelector('[data-fill]');\r\n  var count   = root.querySelector('[data-count]');\r\n  var legend  = root.querySelector('[data-legend]');\r\n  var cap     = root.querySelector('[data-cap]');\r\n  var eyebrow = root.querySelector('[data-eyebrow]');\r\n  var svg     = root.querySelector('[data-svg]');\r\n  var lead    = root.querySelector('[data-lead]');\r\n  var stage   = root.querySelector('[data-stage]');\r\n  var layers  = {};\r\n  [].slice.call(root.querySelectorAll('[data-layer]')).forEach(function (l) { layers[l.dataset.layer] = l; });\r\n  var ills = [].slice.call(root.querySelectorAll('.sx__ill'));\r\n\r\n  var LABELS = ['Venue', 'Area', 'Walls', 'Measurements', 'Contact'];\r\n  var CAPTIONS = {\r\n    w1: '1 closed wall \u00b7 3 sides open to the aisle',\r\n    w2: '2 closed walls \u00b7 corner stand',\r\n    w3: '3 closed walls \u00b7 1 side open to the aisle',\r\n    plarga:  'Measure this wall',\r\n    plarga2: 'Measure the 1st wall',\r\n    pcorta:  'Measure the 2nd wall',\r\n    plarga3: 'Measure the 1st wall',\r\n    pcorta2: 'Measure the 2nd wall',\r\n    pcorta3: 'Measure the 3rd wall'\r\n  };\r\n\r\n  var live = document.createElement('p');\r\n  live.className = 'sr'; live.setAttribute('aria-live', 'polite');\r\n  form.appendChild(live);\r\n\r\n  function num(v) { var n = parseFloat(String(v).replace(',', '.')); return isFinite(n) && n > 0 ? n : 0; }\r\n  function stepEl(n) { return form.querySelector('[data-step=\"' + n + '\"]'); }\r\n\r\n  \/* \u2500\u2500 Panel visual: titular o escenario \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\r\n  function showLead(on) {\r\n    if (!lead.classList.contains('sx--off') === on) return;  \/* sin cambio *\/\r\n    lead.classList.toggle('sx--off', !on);\r\n    stage.classList.toggle('sx--off', on);\r\n    \/* Al volver a los pasos 1\u20132, el revelado se reproduce otra vez *\/\r\n    if (on) {\r\n      [].slice.call(lead.querySelectorAll('.sx__line-in')).forEach(function (n) {\r\n        n.style.animation = 'none';\r\n        void n.offsetHeight;              \/* fuerza reflow para reiniciar *\/\r\n        n.style.animation = '';\r\n      });\r\n    }\r\n  }\r\n  function setLayer(name) {\r\n    showLead(false);\r\n    Object.keys(layers).forEach(function (k) { layers[k].classList.toggle('is-on', k === name); });\r\n  }\r\n  function setIll(key) {\r\n    ills.forEach(function (i) { i.classList.toggle('is-on', i.dataset.ill === key); });\r\n    setLayer('ill');\r\n    cap.innerHTML = CAPTIONS[key] ? '<b>' + CAPTIONS[key] + '<\/b>' : '';\r\n    if (eyebrow) eyebrow.textContent = 'Layout';\r\n  }\r\n\r\n  \/* \u2500\u2500 Resumen \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\r\n  function setSpec(k, v) {\r\n    var t = root.querySelector('[data-spec=\"' + k + '\"]'); if (!t) return;\r\n    t.textContent = v || '\u2014';\r\n    t.classList.toggle('is-empty', !v);\r\n  }\r\n  function widths() {\r\n    return [].slice.call(form.querySelectorAll('[data-w]'))\r\n      .filter(function (i) { var b = i.closest('[data-walls-only]'); return b && !b.hidden; })\r\n      .map(function (i) { return num(i.value); })\r\n      .filter(function (n) { return n > 0; });\r\n  }\r\n  function refreshSpecs() {\r\n    var city  = form.querySelector('[name=\"form_fields[Lugardelaferia]\"]:checked');\r\n    var wsel  = form.querySelector('[data-walls]:checked');\r\n    var m2    = num(form.querySelector('[data-m2]').value);\r\n    var perim = widths().reduce(function (a, b) { return a + b; }, 0);\r\n    setSpec('city',  city ? city.value.trim() : '');\r\n    setSpec('m2',    m2 ? m2.toLocaleString('es-ES') + ' m\u00b2' : '');\r\n    setSpec('walls', wsel ? wsel.dataset.walls + (wsel.dataset.walls === '1' ? ' pared' : ' paredes') : '');\r\n    setSpec('perim', perim ? perim.toLocaleString('es-ES', { maximumFractionDigits: 1 }) + ' m' : '');\r\n  }\r\n\r\n  \/* \u2500\u2500 Plano en vivo \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\r\n  var NS = 'http:\/\/www.w3.org\/2000\/svg';\r\n  function el(tag, attrs) {\r\n    var n = document.createElementNS(NS, tag);\r\n    Object.keys(attrs).forEach(function (k) { n.setAttribute(k, attrs[k]); });\r\n    return n;\r\n  }\r\n  function drawPlan() {\r\n    var m2    = num(form.querySelector('[data-m2]').value);\r\n    var wsel  = form.querySelector('[data-walls]:checked');\r\n    var walls = wsel ? +wsel.dataset.walls : 0;\r\n    if (!m2) return false;\r\n\r\n    var w2 = widths();\r\n    var a = w2[0] || Math.round(Math.sqrt(m2 * 1.5) * 10) \/ 10;\r\n    var b = w2[1] || Math.round((m2 \/ a) * 10) \/ 10;\r\n    if (!isFinite(b) || b <= 0) b = a;\r\n\r\n    var W = 340, H = 200, PAD = 48;\r\n    var scale = Math.min((W - PAD * 2) \/ a, (H - PAD * 2) \/ b);\r\n    var w = a * scale, h = b * scale;\r\n    var x = (W - w) \/ 2, y = (H - h) \/ 2;\r\n\r\n    while (svg.firstChild) svg.removeChild(svg.firstChild);\r\n    svg.appendChild(el('rect', { x: x, y: y, width: w, height: h, rx: 4, class: 'sx__floor' }));\r\n\r\n    var sides = [\r\n      [x, y, x + w, y], [x + w, y, x + w, y + h],\r\n      [x, y + h, x + w, y + h], [x, y, x, y + h]\r\n    ];\r\n    var order = { 1: [0], 2: [0, 3], 3: [0, 3, 2] }[walls] || [];\r\n    sides.forEach(function (s, i) {\r\n      svg.appendChild(el('line', {\r\n        x1: s[0], y1: s[1], x2: s[2], y2: s[3],\r\n        class: order.indexOf(i) > -1 ? 'sx__wall' : 'sx__open'\r\n      }));\r\n    });\r\n\r\n    svg.appendChild(el('line', { x1: x, y1: y - 16, x2: x + w, y2: y - 16, class: 'sx__dim' }));\r\n    var tw = el('text', { x: x + w \/ 2, y: y - 22, 'text-anchor': 'middle', class: 'sx__dimtxt' });\r\n    tw.textContent = a.toLocaleString('es-ES', { maximumFractionDigits: 1 }) + ' m';\r\n    svg.appendChild(tw);\r\n\r\n    svg.appendChild(el('line', { x1: x + w + 16, y1: y, x2: x + w + 16, y2: y + h, class: 'sx__dim' }));\r\n    var th = el('text', {\r\n      x: x + w + 22, y: y + h \/ 2, 'text-anchor': 'middle', class: 'sx__dimtxt',\r\n      transform: 'rotate(90 ' + (x + w + 22) + ' ' + (y + h \/ 2) + ')'\r\n    });\r\n    th.textContent = b.toLocaleString('es-ES', { maximumFractionDigits: 1 }) + ' m';\r\n    svg.appendChild(th);\r\n\r\n    var ta = el('text', { x: W \/ 2, y: y + h \/ 2 + 5, 'text-anchor': 'middle', class: 'sx__dimtxt' });\r\n    ta.setAttribute('style', 'font-size:15px;fill:#10210C;font-weight:600');\r\n    ta.textContent = m2.toLocaleString('es-ES') + ' m\u00b2';\r\n    svg.appendChild(ta);\r\n    return true;\r\n  }\r\n  function showPlan() {\r\n    if (!drawPlan()) return false;\r\n    setLayer('plan');\r\n    if (eyebrow) eyebrow.textContent = 'Your stand layout';\r\n    var wsel = form.querySelector('[data-walls]:checked');\r\n    cap.innerHTML = wsel\r\n      ? '<b>' + wsel.value.trim() + '<\/b> \u00b7 indicative layout, we fine-tune it at the briefing'\r\n      : '<b>Indicative layout<\/b>';\r\n    return true;\r\n  }\r\n\r\n  \/* \u2500\u2500 Qu\u00e9 se ense\u00f1a en cada paso \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\r\n  function updateVisual() {\r\n    if (current <= 2) {\r\n      showLead(true);\r\n      if (eyebrow) eyebrow.textContent = 'Trade show stand design';\r\n      cap.textContent = '';\r\n      return;\r\n    }\r\n    if (current === 3) {\r\n      var sel = form.querySelector('[data-walls]:checked');\r\n      if (sel) { setIll(sel.dataset.ill); return; }\r\n      setLayer('empty');\r\n      if (eyebrow) eyebrow.textContent = 'Layout';\r\n      cap.textContent = '';\r\n      return;\r\n    }\r\n    if (current === 4) {\r\n      \/* Con dos medidas ya hay plano que merezca la pena; si no, el esquema *\/\r\n      if (widths().length >= 2) { showPlan(); return; }\r\n      var active = form.querySelector('[data-step=\"4\"] [data-ill]:focus');\r\n      if (active) { setIll(active.dataset.ill); return; }\r\n      var firstVisible = [].slice.call(form.querySelectorAll('[data-step=\"4\"] [data-ill]'))\r\n        .filter(function (i) { var b = i.closest('[data-walls-only]'); return b && !b.hidden; })[0];\r\n      if (firstVisible) setIll(firstVisible.dataset.ill);\r\n      return;\r\n    }\r\n    if (!showPlan()) {\r\n      var s = form.querySelector('[data-walls]:checked');\r\n      if (s) setIll(s.dataset.ill); else setLayer('empty');\r\n    }\r\n  }\r\n\r\n  \/* \u2500\u2500 Render de paso \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\r\n  function render() {\r\n    steps.forEach(function (s) { s.classList.toggle('is-on', +s.dataset.step === current); });\r\n    fill.style.width = (current \/ total * 100) + '%';\r\n    count.innerHTML = '<b>' + current + '<\/b> de ' + total;\r\n    legend.textContent = 'Step ' + current + ' \u00b7 ' + LABELS[current - 1];\r\n    live.textContent = 'Step ' + current + ' of ' + total + ': ' + LABELS[current - 1];\r\n\r\n    refreshSpecs();\r\n    updateVisual();\r\n\r\n    var first = stepEl(current).querySelector('input:not([type=hidden]),select,textarea');\r\n    if (first && current > 1) { try { first.focus({ preventScroll: true }); } catch (e) { first.focus(); } }\r\n  }\r\n\r\n  \/* \u2500\u2500 Validaci\u00f3n del paso actual \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\r\n  function validate() {\r\n    var el2 = stepEl(current), err = el2.querySelector('[data-err]'), bad = null;\r\n\r\n    var groups = {};\r\n    [].slice.call(el2.querySelectorAll('input[type=radio]')).forEach(function (r) {\r\n      (groups[r.name] = groups[r.name] || []).push(r);\r\n    });\r\n    Object.keys(groups).forEach(function (name) {\r\n      var g = groups[name];\r\n      if (g.some(function (r) { return r.required; }) && !g.some(function (r) { return r.checked; })) bad = bad || g[0];\r\n    });\r\n\r\n    [].slice.call(el2.querySelectorAll('input:not([type=radio]):not([type=hidden]),select,textarea')).forEach(function (f) {\r\n      if (f.closest('[hidden]') || f.offsetParent === null) return;\r\n      var ok = f.checkValidity();\r\n      f.setAttribute('data-invalid', ok ? 'false' : 'true');\r\n      if (!ok) bad = bad || f;\r\n    });\r\n\r\n    if (err) err.classList.toggle('is-on', !!bad);\r\n    if (bad) { try { bad.focus(); } catch (e) {} return false; }\r\n    return true;\r\n  }\r\n\r\n  form.addEventListener('click', function (e) {\r\n    if (e.target.closest('[data-next]')) {\r\n      if (!validate()) return;\r\n      if (current < total) { current++; render(); }\r\n    }\r\n    if (e.target.closest('[data-prev]')) {\r\n      var err = stepEl(current).querySelector('[data-err]');\r\n      if (err) err.classList.remove('is-on');\r\n      if (current > 1) { current--; render(); }\r\n    }\r\n  });\r\n\r\n  form.addEventListener('keydown', function (e) {\r\n    if (e.key !== 'Enter' || e.target.tagName === 'TEXTAREA') return;\r\n    if (current < total) { e.preventDefault(); if (validate()) { current++; render(); } }\r\n  });\r\n\r\n  \/* \u2500\u2500 Campos condicionales de anchos \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\r\n  function applyWalls() {\r\n    var sel = form.querySelector('[data-walls]:checked');\r\n    var n = sel ? sel.dataset.walls : null;\r\n    [].slice.call(form.querySelectorAll('[data-walls-only]')).forEach(function (box) {\r\n      var showIt = box.dataset.wallsOnly === n;\r\n      box.hidden = !showIt;\r\n      box.style.display = showIt ? '' : 'none';\r\n      \/* Los ocultos se vac\u00edan: a Make deben llegar vac\u00edos, igual que hoy *\/\r\n      if (!showIt) [].slice.call(box.querySelectorAll('input')).forEach(function (i) { i.value = ''; });\r\n    });\r\n  }\r\n\r\n  form.addEventListener('change', function (e) {\r\n    if (e.target.name === 'form_fields[Walls]') applyWalls();\r\n    refreshSpecs(); updateVisual();\r\n  });\r\n\r\n  form.addEventListener('input', function (e) {\r\n    if (e.target.getAttribute('data-invalid') === 'true' && e.target.checkValidity()) {\r\n      e.target.setAttribute('data-invalid', 'false');\r\n    }\r\n    refreshSpecs();\r\n    if (current === 4 || current === 5) { if (!aimAt(e.target)) updateVisual(); }\r\n  });\r\n\r\n  \/* Al entrar en un ancho, el panel muestra ESA pared.\r\n     Se engancha a focusin, click e input: en m\u00f3vil el foco a veces llega\r\n     por v\u00edas distintas, y este es el detalle que hace \u00fatil el paso 4. *\/\r\n  function aimAt(target) {\r\n    if (current !== 4 || !target || !target.dataset || !target.dataset.ill) return false;\r\n    if (widths().length >= 2) return false;   \/* a partir de aqu\u00ed manda el plano *\/\r\n    setIll(target.dataset.ill);\r\n    return true;\r\n  }\r\n  form.addEventListener('focusin', function (e) { aimAt(e.target); });\r\n  form.addEventListener('click',   function (e) { aimAt(e.target); });\r\n\r\n  \/* \u2500\u2500 Captura de par\u00e1metros de campa\u00f1a \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\r\n  (function () {\r\n    var qs = new URLSearchParams(location.search);\r\n    var set = function (name, val) {\r\n      var f = form.querySelector('[name=\"form_fields[' + name + ']\"]');\r\n      if (f && val) f.value = val;\r\n    };\r\n    ['utm_source', 'utm_medium', 'utm_campaign', 'gclid', 'wbraid', 'gbraid'].forEach(function (k) { set(k, qs.get(k)); });\r\n    set('current_url', location.href);\r\n    set('referrer', document.referrer);\r\n    \/* document.cookie LANZA EXCEPCI\u00d3N cuando el navegador tiene las cookies\r\n       bloqueadas para este origen, en modos de privacidad estrictos y dentro\r\n       de un iframe con sandbox. Sin este try, la excepci\u00f3n tumbaba el bloque\r\n       entero: no llegaban a definirse ni el manejador de submit ni el\r\n       anti-spam, y el formulario pasaba a enviarse de forma nativa por GET,\r\n       o sea con el nombre, el correo y el tel\u00e9fono en la barra de direcciones\r\n       \u2014y de ah\u00ed al historial, a los registros del servidor y a la cabecera\r\n       Referer\u2014. El seguimiento de HubSpot es prescindible; eso no. *\/\r\n    try {\r\n      var m = document.cookie.match(\/hubspotutk=([^;]+)\/);\r\n      set('hubspotutk', m ? m[1] : '');\r\n    } catch (e) { \/* sin cookie de HubSpot: se env\u00eda igual, sin ese dato *\/ }\r\n  })();\r\n\r\n  \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\r\n     ENV\u00cdO \u00b7 pasa por WordPress, no por Make directamente\r\n     \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n     Antes aqu\u00ed estaba la URL del webhook de Make. Eso significaba llevarla\r\n     en el c\u00f3digo de la p\u00e1gina, o sea a la vista de cualquiera que abriera el\r\n     inspector, y con ella se puede enviar lo que se quiera salt\u00e1ndose todas\r\n     las barreras del navegador \u2014porque las barreras del navegador solo\r\n     existen en el navegador\u2014.\r\n     Ahora el formulario va a un endpoint del propio sitio, que valida en\r\n     servidor y reenv\u00eda a Make desde all\u00ed. La URL del webhook vive en\r\n     wp-config.php y no sale nunca al cliente.\r\n     El endpoint lo instala wordpress\/servis-lp-leads.php.\r\n     \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\r\n  var CONFIG = {\r\n    ENDPOINT:  'https:\/\/www.serviscomplet.com\/wp-admin\/admin-ajax.php',\r\n    FORM_ID:   '8b801b5',                 \/* \/propuesta-stand\/ \u00b7 post_id 44749 *\/\r\n    FORM_NAME: 'PRESUPUESTO INTERACTIVO - ENG',\r\n    \/* Con p\u00e1gina de gracias, la conversi\u00f3n se mide en la carga de ESA p\u00e1gina,\r\n       que es m\u00e1s fiable que un evento disparado justo antes de un redirect:\r\n       ah\u00ed la etiqueta a menudo no llega a enviarse antes de que el navegador\r\n       abandone la p\u00e1gina. *\/\r\n    \/* Cada formulario tiene su propia p\u00e1gina de gracias. No es solo por el\r\n       texto: con dos URLs distintas, Google Ads puede medirlas como dos\r\n       conversiones separadas \u2014cu\u00e1nta gente pide precio y cu\u00e1nta pide\r\n       propuesta\u2014, que con una sola p\u00e1gina no se puede. *\/\r\n    GRACIAS:   'https:\/\/www.serviscomplet.com\/en\/thanks-quote\/',\r\n    PRUEBA:    false      \/* true = no env\u00eda, solo saca el payload por consola.\r\n                             Ponlo en false cuando el endpoint est\u00e9 instalado. *\/\r\n  };\r\n\r\n  \/* Las CLAVES que espera Make son las ETIQUETAS del formulario de Elementor,\r\n     no los `name`. Por eso van aqu\u00ed expl\u00edcitas: as\u00ed el texto que se ve en\r\n     pantalla puede cambiar sin romper el mapeo de Make.\r\n     Ojo con las duplicadas: plarga2\/plarga3 comparten clave, igual que\r\n     pcorta\/pcorta2. Es deliberado \u2014 solo se rellena una rama, y Make recibe\r\n     siempre una clave gen\u00e9rica por pared. *\/\r\n  var MAPA = [\r\n    ['Lugardelaferia',                  'Where is the trade show?'],\r\n    ['field_7167481',                   'Enter the total square meters of your exhibition stand.'],\r\n    ['Paredes',                         'How many walls does your exhibition stand have?'],\r\n    ['plarga',                          'Wall width'],\r\n    ['plarga2',                         'Width of the first wall'],\r\n    ['plarga3',                         'Width of the first wall'],\r\n    ['pcorta',                          'Width of the second wall'],\r\n    ['pcorta2',                         'Width of the second wall'],\r\n    ['pcorta3',                         'Width of the third wall'],\r\n    ['firstname',                       'Name'],\r\n    ['lastname',                        'Last name'],\r\n    ['feria_en_la_que_participas___form','Tradeshow you will be part of'],\r\n    ['email',                           'Email'],\r\n    ['Company',                         'Company'],\r\n    ['phone',                           'Phone number'],\r\n    ['field_44da6e6',                   'I\u2019d like to be contacted to receive a quote, and I accept the Privacy Policy.'],\r\n    ['utm_source',                      'UTM Source'],\r\n    ['utm_medium',                      'UTM Medium'],\r\n    ['utm_campaign',                    'UTM Campaign'],\r\n    ['gclid',                           'gclid'],\r\n    ['wbraid',                          'wbraid'],\r\n    ['gbraid',                          'gbraid'],\r\n    ['current_url',                     'current_url'],\r\n    ['referrer',                        'Referrer'],\r\n    ['hubspotutk',                      'hubspotutk']\r\n  ];\r\n\r\n  function construirPayload() {\r\n    var fd = new FormData(form), bruto = {};\r\n    fd.forEach(function (v, k) { bruto[k] = v; });\r\n\r\n    var out = {};\r\n    MAPA.forEach(function (par) {\r\n      var valor = bruto['form_fields[' + par[0] + ']'];\r\n      if (valor === undefined) valor = '';\r\n      \/* Con clave repetida (ramas de pared) gana la que traiga valor *\/\r\n      if (out[par[1]] === undefined || (out[par[1]] === '' && valor !== '')) {\r\n        out[par[1]] = valor;\r\n      }\r\n    });\r\n    out.form_id   = CONFIG.FORM_ID;\r\n    out.form_name = CONFIG.FORM_NAME;\r\n    return out;\r\n  }\r\n\r\n  function bloquearEnvio(on) {\r\n    var b = form.querySelector('[type=submit]');\r\n    if (!b) return;\r\n    b.disabled = on;\r\n    b.style.opacity = on ? '.6' : '';\r\n    b.style.pointerEvents = on ? 'none' : '';\r\n    if (on) { b.dataset.txt = b.textContent; b.textContent = 'Enviando\u2026'; }\r\n    else if (b.dataset.txt) { b.textContent = b.dataset.txt; }\r\n  }\r\n\r\n  \/* Se\u00f1uelo y reloj, igual que en los formularios de propuesta. Aqu\u00ed importa\r\n     m\u00e1s porque este s\u00ed llega a Make: cada env\u00edo basura es una operaci\u00f3n\r\n     consumida y un aviso al comercial. *\/\r\n  var ASPAM = {\r\n    SEG: 6,   \/* m\u00e1s alto que en el otro: son cinco pasos, nadie los hace en 6s *\/\r\n    proteger: function (f) {\r\n      var s = document.createElement('div');\r\n      s.setAttribute('aria-hidden', 'true');\r\n      s.style.cssText = 'position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden';\r\n      s.innerHTML = '<label>No rellenes este campo' +\r\n        '<input type=\"text\" name=\"_apellido2\" tabindex=\"-1\" autocomplete=\"off\"><\/label>';\r\n      f.appendChild(s);\r\n      f.setAttribute('data-nacido', String(new Date().getTime()));\r\n    },\r\n  };\r\n  ASPAM.proteger(form);\r\n\r\n  function pintarGracias() {\r\n    form.innerHTML = '<h3 class=\"sx__q\">Got it, thank you.<\/h3>' +\r\n      '<p class=\"sx__hint\">We will be in touch as soon as we can with your quote.<\/p>';\r\n  }\r\n\r\n  form.addEventListener('submit', function (e) {\r\n    e.preventDefault();\r\n    if (!validate()) return;\r\n\r\n    \/* AQU\u00cd NO SE DESCARTA NADA. El se\u00f1uelo y los segundos se mandan al\r\n       servidor y decide \u00e9l. Antes hab\u00eda tambi\u00e9n una comprobaci\u00f3n aqu\u00ed, y era\r\n       un mal reparto: si el navegador se equivocaba \u2014alguien r\u00e1pido, un\r\n       autocompletado\u2014 el env\u00edo se perd\u00eda sin dejar rastro en ning\u00fan sitio.\r\n       Con un solo juez, y en el servidor, todo descarte queda registrado. *\/\r\n    var payload = construirPayload();\r\n    var errBox  = stepEl(current).querySelector('[data-err]');\r\n\r\n    if (CONFIG.PRUEBA) {\r\n      \/* Solo en modo prueba se ense\u00f1a el payload. En producci\u00f3n no puede\r\n         salir por consola: son datos personales. *\/\r\n      console.log('MODO PRUEBA \u00b7 payload que se enviar\u00eda a Make:', payload);\r\n      alert('MODO PRUEBA \u2014 no se ha enviado nada.\\n\\n' +\r\n            Object.keys(payload).map(function (k) { return k + ': ' + payload[k]; }).join('\\n'));\r\n      return;\r\n    }\r\n\r\n    \/* urlencoded en vez de JSON: es una petici\u00f3n \"simple\" y adem\u00e1s el\r\n       endpoint es del mismo dominio, as\u00ed que no hay CORS de por medio. *\/\r\n    \/* EL PAYLOAD VA COMO JSON EN UN SOLO CAMPO, no como campos sueltos.\r\n       Las claves que espera Make son las etiquetas del formulario de\r\n       Elementor: \u00abWhere is the show?\u00bb, \u00abIndica los m\u00b2 totales de tu\r\n       stand\u00bb\u2026 Si se mandaran como nombres de campo, PHP las destrozar\u00eda al\r\n       interpretar el cuerpo: convierte los espacios y los puntos de los\r\n       NOMBRES en guiones bajos. Llegar\u00eda \u00ab\u00bfD\u00f3nde_es_la_feria?\u00bb y Make no\r\n       reconocer\u00eda ni una clave. Dentro de un JSON las claves viajan intactas. *\/\r\n    \/* Los datos para las comprobaciones del servidor van DENTRO del JSON. El\r\n       se\u00f1uelo se manda tal cual \u2014si un bot lo ha rellenado, que lo vea el\r\n       servidor\u2014 y los segundos permiten repetir all\u00ed el control de tiempo:\r\n       aqu\u00ed se pueden falsear, pero quien lo haga sigue teniendo enfrente el\r\n       l\u00edmite por IP y Turnstile. *\/\r\n    payload.origen = 'calculadora'; payload.idioma = 'en';\r\n    var senuelo = form.querySelector('[name=\"_apellido2\"]');\r\n    payload._apellido2 = senuelo ? senuelo.value : '';\r\n    var nacido = Number(form.getAttribute('data-nacido') || 0);\r\n    payload._segundos = nacido ? ((new Date().getTime() - nacido) \/ 1000).toFixed(1) : '';\r\n    var tk = form.querySelector('[name=\"cf-turnstile-response\"]');\r\n    if (tk) payload['cf-turnstile-response'] = tk.value;\r\n\r\n    var cuerpo = new URLSearchParams();\r\n    cuerpo.append('action', 'servis_lp_lead');\r\n    cuerpo.append('data', JSON.stringify(payload));\r\n\r\n    bloquearEnvio(true);\r\n    fetch(CONFIG.ENDPOINT, {\r\n      method: 'POST',\r\n      headers: { 'Content-Type': 'application\/x-www-form-urlencoded;charset=UTF-8' },\r\n      body: cuerpo.toString()\r\n    })\r\n    .then(function (r) {\r\n      if (!r.ok) throw new Error('HTTP ' + r.status);\r\n      if (window.dataLayer) window.dataLayer.push({ event: 'form_stand_enviado' });\r\n      if (CONFIG.GRACIAS) { location.href = CONFIG.GRACIAS; return; }\r\n      pintarGracias();\r\n    })\r\n    .catch(function (err) {\r\n      bloquearEnvio(false);\r\n      if (errBox) {\r\n        errBox.textContent = 'We could not send the form. Please try again or call us on +34 934 233 107.';\r\n        errBox.classList.add('is-on');\r\n      }\r\n      \/* Solo el error, nunca el payload: son datos personales. *\/\r\n      console.error('Fallo al enviar el formulario:', err && err.message);\r\n    });\r\n  });\r\n\r\n  applyWalls();\r\n  render();\r\n})();\r\n<\/script>\r\n<script>\r\n(function(){\r\n 'use strict';\r\n \/* EL <dialog> AL <body>, PERO DENTRO DE UNA ENVOLTURA .lp-embed.\r\n    Sacarlo al body hace falta porque un contenedor de Elementor con\r\n    transform, filter o backdrop-filter se convierte en bloque contenedor y\r\n    deja el modal descolocado o recortado.\r\n    Pero sacarlo A SECAS lo romp\u00eda de otra manera: como todos los selectores\r\n    de la hoja llevan el prefijo .lp-embed, al salir de esa ra\u00edz el di\u00e1logo se\r\n    quedaba SIN ESTILOS y se abr\u00eda como una caja blanca del navegador.\r\n    Por eso va envuelto: mantiene la ra\u00edz para el CSS y sale del contenedor\r\n    problem\u00e1tico. La clase lp-portal le quita a la envoltura el ancho completo,\r\n    que ah\u00ed no pinta nada y provocar\u00eda scroll horizontal. *\/\r\n (function(){\r\n   var f = document.querySelector('[data-ficha]');\r\n   if (!f || f.closest('.lp-portal')) return;\r\n   var caja = document.createElement('div');\r\n   caja.className = 'lp-embed lp-portal';\r\n   document.body.appendChild(caja);\r\n   caja.appendChild(f);\r\n })();\r\n var U = 'https:\/\/www.serviscomplet.com\/wp-content\/uploads\/elementor\/thumbs\/';\r\n var S = [\r\n  {f:'VKFIRA002-ISE2025-1-scaled-r1sgzt2w2d9t1hkra1k9110plad61feu6y0yizspl4.jpg', c:'Airzone', e:'ISE, Barcelona'},\r\n  {f:'STAND-AMAZON-WEB-SERVICES-scaled-r001pixuwlw89fog8oibe0p8kp1w2zwggmbtn7ln60.jpg', c:'Amazon Web Services', e:'Madrid'},\r\n  {f:'VKFIRA110-MWC2025-1-scaled-r31cvthskedcezhfl7r6fiuws3xbg29k3o3pbrkqrs.jpg', c:'Suse', e:'Mobile World Congress'},\r\n  {f:'VKFIRA101-KUBECON2025LONDON-scaled-r46vncm0mmasqf8e1jnawdddhxqkyubai0p5i4okug.jpg', c:'Datadog', e:'KubeCon Londres'},\r\n  {f:'VKFIRA075-ADVANCEDFACTORY2025-scaled-r61kn5un8qes7ye5lwfuylfi2mme22hvnkh7dxfxc8.jpg', c:'Rexroth', e:'Advanced Factories'},\r\n  {f:'VKFIRA158-KUBECON2025LONDON-scaled-r4s0o454n8elj9wj6g4o3e5opokliekjjexp9p85mw.jpg', c:'JFrog', e:'KubeCon Londres'},\r\n  {f:'VKFIRA-050-ALIMENTARIA2024-scaled-r4vji8koa730m5cs86h4j5btteqdedrgnmj7nezngo.jpg', c:'Calconut', e:'Alimentaria'},\r\n  {f:'VKFIRA090-ADVANCEDFACTORY2025-1-scaled-r6igc8mgdyh9v0puudyvpzohdlakzoz4t1od1c2yko.jpg', c:'Servitron', e:'Advanced Factories'},\r\n  {f:'VKFIRA055-MWC2025-scaled-r3t2gsfwpuiq9vw22altcidyi7gp0x9q0dd4w9216w.jpg', c:'Greskyes', e:'Mobile World Congress'},\r\n  {f:'VKFIRA001-MWC2025-scaled-r3t2gi3omo4kq6b2qo4x32zvyyvno94oay6sm7hd3c.jpg', c:'Montaje', e:'Mobile World Congress'},\r\n  {f:'IMG_2178-scaled-r6hcqe9za8lwddu1rk56xappmz3bsjh7rs1spw6z60.jpg', c:'Indupanel', e:'Construtec'},\r\n  {f:'AIRZONE-ISE-2024-scaled-r01pyuonrrjezgm0wdtnwlifi4pwnfz5dsdicr4ayw.jpg', c:'Airzone', e:'ISE 2024'}\r\n ];\r\n var LUPA = '<span class=\"ln__moslupa\"><svg viewBox=\"0 0 24 24\" stroke-linecap=\"round\">' +\r\n   '<circle cx=\"11\" cy=\"11\" r=\"7\"\/><path d=\"M20 20l-3.5-3.5M11 8v6M8 11h6\"\/><\/svg><\/span>';\r\n\r\n var grid = document.querySelector('[data-grid]');\r\n var titulo = grid.querySelector('.ln__mosT');\r\n\r\n \/* El n\u00famero de columnas lo manda el CSS, que lo sube con el ancho de\r\n    pantalla (4 \u00b7 5 \u00b7 6 \u00b7 7). Antes el JS constru\u00eda 4 fijas: a 2560px el CSS\r\n    ped\u00eda 7 y quedaban tres columnas vac\u00edas, o sea un tercio del mosaico en\r\n    blanco. Aqu\u00ed se lee lo que el CSS haya decidido y se reconstruye si cambia. *\/\r\n function columnasQuePideElCSS(){\r\n   var t = getComputedStyle(grid).gridTemplateColumns;\r\n   return Math.max(1, t.split(' ').filter(Boolean).length);\r\n }\r\n\r\n \/* Paso coprimo con el n\u00famero de fotos: garantiza que dentro de una misma\r\n    columna no se repita ninguna hasta haber pasado por las 12. *\/\r\n function mcd(a,b){ while(b){ var t=b; b=a%b; a=t; } return a; }\r\n var PASO = (function(){ for (var p = 5; p < S.length; p++) if (mcd(p, S.length) === 1) return p; return 1; })();\r\n\r\n \/* Velocidad de referencia, en px\/s. Es la que ten\u00eda la versi\u00f3n anterior\r\n    (516px de juego en 92s) y es deliberadamente lenta: m\u00e1s r\u00e1pido no da\r\n    tiempo a hacer clic en una tarjeta en movimiento. *\/\r\n var VEL = 5.6;\r\n\r\n var COLS = 0, ALTO = 0;\r\n function construir(){\r\n   var n = columnasQuePideElCSS();\r\n   var caja = grid.getBoundingClientRect();\r\n   var alto = Math.round(caja.height);\r\n   \/* Si a\u00fan no hay maqueta \u2014pesta\u00f1a oculta, contenedor sin medir\u2014 no se\r\n      construye: con ancho 0 el c\u00e1lculo de abajo se dispara. Ya volver\u00e1 el\r\n      ResizeObserver cuando la haya. *\/\r\n   if (caja.width < 1 || alto < 1) return;\r\n   if (n === COLS && alto === ALTO) return;\r\n   COLS = n; ALTO = alto;\r\n\r\n   \/* CU\u00c1NTAS FOTOS NECESITA CADA COLUMNA.\r\n      El bucle traslada el \u221250%, as\u00ed que el juego \u00fanico tiene que medir al\r\n      menos lo que la columna: si mide menos, al llegar al final queda hueco.\r\n      Antes se repart\u00edan las 12 fotos entre las columnas y punto \u2014con 6\r\n      columnas tocaban a 2, unos 516px de juego contra 760px de columna, y\r\n      esos 244px que faltaban eran el hueco. Ahora se calcula. *\/\r\n   var hueco = parseFloat(getComputedStyle(grid).columnGap) || 16;\r\n   var anchoCol = (caja.width - (n - 1) * hueco) \/ n;\r\n   var paso = anchoCol * 3 \/ 4 + hueco;              \/* alto de pieza (4:3) + hueco *\/\r\n   \/* Con tope en las 12 disponibles: m\u00e1s all\u00e1 solo ser\u00edan repeticiones. *\/\r\n   var porColumna = Math.min(S.length, Math.max(2, Math.ceil(alto \/ paso) + 1));\r\n   var juego = porColumna * paso;\r\n\r\n   var cols = [];\r\n   for (var c = 0; c < n; c++) {\r\n     var items = [];\r\n     for (var k = 0; k < porColumna; k++) {\r\n       var i = (c + k * PASO) % S.length;\r\n       items.push({ s:S[i], i:i });\r\n     }\r\n     cols.push(items);\r\n   }\r\n\r\n   grid.querySelectorAll('.ln__moscol').forEach(function(x){ x.remove(); });\r\n   grid.insertAdjacentHTML('afterbegin', cols.map(function(items, c){\r\n     var t = items.map(function(o){\r\n       \/* Sin cliente ni feria: los nombres sal\u00edan del nombre de archivo y no\r\n          todos son fiables \u2014uno de ellos era literalmente \u00abMontaje\u00bb\u2014. *\/\r\n       return '<button class=\"ln__mosc\" data-abrir=\"' + o.i + '\" aria-label=\"View this photo larger\">' +\r\n         '<img decoding=\"async\" loading=\"lazy\" alt=\"Stand construido por Servis\" src=\"' + U + o.s.f + '\">' +\r\n         LUPA + '<\/button>';\r\n     }).join('');\r\n     \/* La duraci\u00f3n se calcula del juego, no es un n\u00famero fijo: al cambiar el\r\n        n\u00famero de fotos por columna la pista mide otra cosa, y con un tiempo\r\n        fijo la velocidad se disparaba. Cada columna va un poco distinta para\r\n        que no marchen todas al mismo paso. *\/\r\n     var dur = Math.round(juego \/ VEL * (0.86 + (c % 4) * 0.1));\r\n     \/* la copia va oculta a lectores: es la misma informaci\u00f3n repetida para\r\n        que el bucle del \u221250% cierre sin costura *\/\r\n     return '<div class=\"ln__moscol\" style=\"--t:' + dur + 's\"><div class=\"ln__mospista\">' + t +\r\n       '<div aria-hidden=\"true\" style=\"display:contents\">' + t + '<\/div><\/div><\/div>';\r\n   }).join(''));\r\n }\r\n construir();\r\n\r\n \/* ResizeObserver en vez del evento resize: reacciona a cualquier cambio de\r\n    tama\u00f1o de la rejilla \u2014no solo al de la ventana\u2014 y as\u00ed cubre los casos en\r\n    que aparece la barra de scroll o el contenedor cambia sin que la ventana\r\n    se mueva. El evento de ventana queda de refuerzo. *\/\r\n var espera;\r\n function replantear(){ clearTimeout(espera); espera = setTimeout(construir, 180); }\r\n if ('ResizeObserver' in window) new ResizeObserver(replantear).observe(grid);\r\n addEventListener('resize', replantear, { passive:true });\r\n\r\n var ficha = document.querySelector('[data-ficha]');\r\n var fimg = ficha.querySelector('[data-fimg]');\r\n var fnum = ficha.querySelector('[data-fnum]');\r\n ficha.querySelector('[data-ftot]').textContent = S.length;\r\n var actual = 0;\r\n function pinta(i){\r\n   actual = (i + S.length) % S.length;\r\n   fimg.src = U + S[actual].f;\r\n   fimg.alt = 'Stand built by Servis \u00b7 photo ' + (actual + 1) + ' of ' + S.length;\r\n   fnum.textContent = actual + 1;\r\n }\r\n \/* \u2500\u2500 Abrir y cerrar \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\r\n    Lo que <dialog> daba de balde y aqu\u00ed se hace a mano: bloquear el scroll\r\n    de detr\u00e1s, atrapar el foco dentro de la capa, cerrar con Escape y\r\n    devolver el foco a la foto desde la que se abri\u00f3. *\/\r\n var abierta = false;\r\n var devolverFocoA = null;\r\n var scrollBloqueado = '';\r\n\r\n function abrir(i, origen) {\r\n   pinta(i);\r\n   if (abierta) return;\r\n   abierta = true;\r\n   devolverFocoA = origen || null;\r\n   scrollBloqueado = document.body.style.overflow;\r\n   document.body.style.overflow = 'hidden';\r\n   ficha.hidden = false;                 \/* por si el atributo s\u00ed lleg\u00f3 *\/\r\n   ficha.classList.add('is-abierta');    \/* esto es lo que manda *\/\r\n   var primero = ficha.querySelector('[data-cerrar]');\r\n   if (primero) primero.focus();\r\n }\r\n\r\n function cerrar() {\r\n   if (!abierta) return;\r\n   abierta = false;\r\n   ficha.classList.remove('is-abierta');\r\n   ficha.hidden = true;\r\n   document.body.style.overflow = scrollBloqueado;\r\n   if (devolverFocoA && document.contains(devolverFocoA)) devolverFocoA.focus();\r\n   devolverFocoA = null;\r\n }\r\n\r\n document.addEventListener('click', function(ev){\r\n   var b = ev.target.closest('[data-abrir]');\r\n   if (b) { abrir(Number(b.dataset.abrir), b); return; }\r\n   if (!abierta) return;\r\n   if (ev.target.closest('[data-cerrar]')) { cerrar(); return; }\r\n   var m = ev.target.closest('[data-mover]');\r\n   if (m) { pinta(actual + Number(m.dataset.mover)); return; }\r\n   \/* Clic fuera del panel = cerrar. Se comprueba contra el panel y no contra\r\n      la capa, porque la capa tiene relleno y ese relleno tambi\u00e9n es \u00abfuera\u00bb. *\/\r\n   if (!ev.target.closest('.ln__fichpanel')) cerrar();\r\n });\r\n\r\n document.addEventListener('keydown', function(ev){\r\n   if (!abierta) return;\r\n   if (ev.key === 'Escape')     { cerrar(); return; }\r\n   if (ev.key === 'ArrowLeft')  { pinta(actual - 1); return; }\r\n   if (ev.key === 'ArrowRight') { pinta(actual + 1); return; }\r\n   if (ev.key !== 'Tab') return;\r\n   \/* Foco atrapado: al llegar al \u00faltimo control, el tabulador vuelve al\r\n      primero, y al rev\u00e9s. Si no, se tabula hacia la p\u00e1gina de detr\u00e1s, que\r\n      est\u00e1 oculta y es un l\u00edo para quien navega con teclado. *\/\r\n   var f = ficha.querySelectorAll('button, [href], input, textarea, [tabindex]:not([tabindex=\"-1\"])');\r\n   if (!f.length) return;\r\n   var pri = f[0], ult = f[f.length - 1];\r\n   if (ev.shiftKey && document.activeElement === pri) { ev.preventDefault(); ult.focus(); }\r\n   else if (!ev.shiftKey && document.activeElement === ult) { ev.preventDefault(); pri.focus(); }\r\n });\r\n})();\r\n<\/script>\r\n<!-- Turnstile de Cloudflare. Sin integrity a prop\u00f3sito: Cloudflare rota este\r\n     archivo, y un hash fijo lo dejar\u00eda sin cargar en cuanto lo actualicen.\r\n     La clave que va aqu\u00ed es la P\u00daBLICA (site key) y no es un secreto: est\u00e1\r\n     pensada para verse. La secreta va en wp-config.php del servidor. -->\r\n<script src=\"https:\/\/challenges.cloudflare.com\/turnstile\/v0\/api.js\" async defer><\/script>\r\n\r\n<\/div>\r\n\r\n<script>\r\n\/* La barra flotante usa position:sticky. Dentro de Elementor deja de\r\n   funcionar si alg\u00fan contenedor de arriba tiene overflow distinto de visible,\r\n   que es un caso muy habitual. No se puede arreglar desde aqu\u00ed \u2014hay que\r\n   quitar ese overflow en el contenedor\u2014 as\u00ed que al menos se avisa. *\/\r\n(function(){\r\n  var barra = document.querySelector('.ln__top');\r\n  if (!barra) return;\r\n  var n = barra.parentNode, culpable = null;\r\n  while (n && n !== document.body && n.nodeType === 1) {\r\n    var o = getComputedStyle(n);\r\n    if (o.overflow !== 'visible' || o.overflowY !== 'visible') { culpable = n; break; }\r\n    n = n.parentNode;\r\n  }\r\n  if (culpable) {\r\n    console.warn('[Servis] La barra fija no funcionar\u00e1: un contenedor de ' +\r\n      'Elementor tiene overflow \u00ab' + getComputedStyle(culpable).overflow +\r\n      '\u00bb. Ponlo en visible.', culpable);\r\n  }\r\n})();\r\n<\/script>\r\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>934 233 107 Get my stand price Want to know what your next stand is going to cost? Work it out in under a minute The estimate uses Visualwall, our new build system, and covers the walls, the electrics and the carpet only. Pick how many walls and the layout will show up here. Venue\u2014 Floor area\u2014 Walls\u2014 Closed perimeter\u2014 Approved supplier for Fira Barcelona, IFEMA and Feria de Zaragoza In-house production: 25,000 m\u00b2 and our own assembly crews Over 500 stands a year since 1965 1 of 5 Step 1 \u00b7 Venue Where is the show? Barcelona Madrid Zaragoza Pick a city to carry on. Next How many m\u00b2 is your stand? The floor area you have booked with the venue. Total area * Enter your stand area in m\u00b2. \u2190 Back Next How many walls does it have? Count the closed ones only. Open sides face the aisle. 1 wall 2 walls 3 walls Choose how many walls. \u2190 Back Next Width of each wall As you move through the fields, the diagram on the left shows which wall you are measuring. Ancho de la pared Ancho de la 1.\u00aa pared Ancho de la 2.\u00aa pared Ancho de la 1.\u00aa pared Ancho de la 2.\u00aa pared Ancho de la 3.\u00aa pared Don&#8217;t have the exact measurements to hand? A rough figure is fine \u2014 we&#8217;ll pin it down together at the briefing. \u2190 Back Next Who should we send the quote to? First name * Last name * Show you&#8217;re exhibiting at * Email * Company * Phone number * I&#8217;d like to be contacted with a quote, and I accept the Privacy Policy. Check the highlighted fields before sending. \u2190 Back Get my free quote \u2192 They put their stand in our hands Which kind of stand suits you? The price gap between them is wide, and the dearest is not always the one that pays off best. It comes down to how many shows you do a year. Best value Prefabricated modular Reusable structures that slot together. Quick to build and kind on the budget. Customisation is limited to what the system allows. The middle ground Hybrid Modular systems combined with bespoke joinery. Still reusable, with far more freedom than pure modular. Maximum impact Fully bespoke Built from scratch, with no limits on shape, material or finish. Our own joinery, with lighting and technology built in. More investment, and not always reusable. Not sure which of the three suits you? It depends on the area, the budget, where you are on the floor plan and a few things more. Tell us your case and we&#8217;ll look at it with you. You tell us about the projectThe area you&#8217;ve booked, the show, the dates and what you&#8217;d like to happen there. If you&#8217;re not clear yet, we&#8217;ll guide you so the whole thing goes well. One person to talk toAn account manager stays with your project to the end. They check your measurements, your brand guidelines and what the venue requires, and flag anything that doesn&#8217;t add up before we start designing. We put a proposal togetherThe design team works to your show and to the space you&#8217;ve been given. You get it with the budget and what&#8217;s included, in writing. No cost and no commitment: if it doesn&#8217;t convince you, we change whatever you need. If we go ahead We build it and we install itIt&#8217;s built in our own workshops and installed by our own crew. The same people who ran the project are there on build-up day. We handle the paperworkPermits, technical drawings and dealings with the venue. It&#8217;s the heaviest part and the one that causes the most scares, so we take it off your hands. And we clear up afterwardsWhen the show ends, you&#8217;re done. We dismantle and take everything away, keeping whatever can be reused. Tell us about your project We&#8217;ll come back with a proposal built around your show. No commitment. First name * Last name * Email * Phone number * Company * Which show are you exhibiting at? * Tell us what you need I accept the Privacy Policy and to receiving communications from Servis Complet, S.L. Check the highlighted fields before sending. Request a proposal \u2192 Who are Servis? We have spent more than 60 years designing and building stands for trade shows and congresses in Spain. We turn ideas into spaces that communicate, connect and sell. From emerging brands to large multinationals, we stay with our clients through the whole process, from the first sketch to build-up, making sure every detail is under control. Our commitment is that you get to enjoy the show, and live it without the stress. Stands each year 500+ Across Spain and at international shows such as MWC Barcelona. In-house assembly staff 120+ Designers, joiners and build crews. Ours, not subcontracted. Turnover in 2025 +60M\u20ac Across trade show stands, congresses and large institutional events. Some of the stands we&#8217;ve built 1 \/ 12 Sustainability Your stand doesn&#8217;t end when we take it down We hold 25,000 m\u00b2 of our own modular stock. The structures come back to the warehouse and go out again show after show, so your stand has a long life instead of ending up in a skip on breakdown day. 25,000 m\u00b2 of our own modular stock, reused show after show Carbon footprint measured and offset through reforestation FSC and PEFC traceable timber 100% green energy across our facilities since 2016 Quality and approvals The venues already know us Being an approved supplier means the technical drawings, the sign-off and the permits go through without surprises. It is the single biggest cause of delays when your contractor isn&#8217;t. Approved supplier at Fira Barcelona, IFEMA and Feria de Zaragoza ISO 9001 quality management, certified by T\u00dcV Members of ICCA and of the Spanish Trade Fairs Association What people ask us before deciding How much does a stand cost? Mostly on the area, the number of closed walls and<\/p>\n","protected":false},"author":5,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"content-type":"","footnotes":""},"class_list":["post-62631","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.serviscomplet.com\/en\/wp-json\/wp\/v2\/pages\/62631","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.serviscomplet.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.serviscomplet.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.serviscomplet.com\/en\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/www.serviscomplet.com\/en\/wp-json\/wp\/v2\/comments?post=62631"}],"version-history":[{"count":4,"href":"https:\/\/www.serviscomplet.com\/en\/wp-json\/wp\/v2\/pages\/62631\/revisions"}],"predecessor-version":[{"id":62635,"href":"https:\/\/www.serviscomplet.com\/en\/wp-json\/wp\/v2\/pages\/62631\/revisions\/62635"}],"wp:attachment":[{"href":"https:\/\/www.serviscomplet.com\/en\/wp-json\/wp\/v2\/media?parent=62631"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}