{"id":64,"date":"2023-10-04T12:58:51","date_gmt":"2023-10-04T12:58:51","guid":{"rendered":"https:\/\/ecolosplus.se\/?page_id=64"},"modified":"2026-07-15T15:56:24","modified_gmt":"2026-07-15T13:56:24","slug":"elementor-64","status":"publish","type":"page","link":"https:\/\/ecolosplus.se\/sv\/","title":{"rendered":"Home"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"64\" class=\"elementor elementor-64\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-407bc3d e-con-full e-flex e-con e-parent\" data-id=\"407bc3d\" data-element_type=\"container\" data-e-type=\"container\" data-no-translation=\"\">\n\t\t\t\t<div class=\"elementor-element elementor-element-290cff6 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"290cff6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- ===== Ecolos+ Svensk SEO-optimerad Hero ===== -->\r\n\r\n<section\r\n  class=\"ec-hero\"\r\n  aria-labelledby=\"ec-hero-title\"\r\n>\r\n  <div class=\"ec-bg\" aria-hidden=\"true\"><\/div>\r\n  <div class=\"ec-aurora\" aria-hidden=\"true\"><\/div>\r\n  <div class=\"ec-noise\" aria-hidden=\"true\"><\/div>\r\n\r\n  <div class=\"ec-content\">\r\n\r\n    <p class=\"ec-eyebrow\">\r\n      AI-driven hantering av last mile-leveranser\r\n    <\/p>\r\n\r\n    <h1 id=\"ec-hero-title\">\r\n      S\u00e4nk leveranskostnaderna med en komplett plattform f\u00f6r last mile-leveranser\r\n    <\/h1>\r\n\r\n    <p class=\"ec-description\">\r\n      Ecolos+ kopplar samman \u00e5terf\u00f6rs\u00e4ljare, transport\u00f6rer, kurirer och\r\n      mottagare genom webbaserade kontrollpaneler, mobilappar och API-tj\u00e4nster\r\n      \u2013 s\u00e5 att leveransteam kan effektivisera verksamheten, f\u00e5 b\u00e4ttre \u00f6verblick\r\n      och skala smartare.\r\n    <\/p>\r\n\r\n    <a\r\n      href=\"\/sv\/lets-talk\/\"\r\n      class=\"ec-btn\"\r\n      aria-label=\"Boka ett kostnadsfritt introduktionsm\u00f6te om Ecolos Plus\"\r\n    >\r\n      Boka ett kostnadsfritt introduktionsm\u00f6te\r\n\r\n      <span class=\"ec-btn-arrow\" aria-hidden=\"true\">\r\n        \u2192\r\n      <\/span>\r\n    <\/a>\r\n\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n\r\n\/* =========================================\r\n   ECOLOS+ HERO\r\n========================================= *\/\r\n\r\n.ec-hero,\r\n.ec-hero * {\r\n  box-sizing: border-box;\r\n}\r\n\r\n.ec-hero {\r\n  --mouse-x: 50%;\r\n  --mouse-y: 50%;\r\n\r\n  position: relative;\r\n  isolation: isolate;\r\n\r\n  width: 100vw;\r\n  max-width: 100vw;\r\n  min-height: clamp(650px, 82vh, 760px);\r\n\r\n  margin-left: calc(50% - 50vw);\r\n\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  overflow: hidden;\r\n\r\n  text-align: center;\r\n  color: #ffffff;\r\n  background: #030712;\r\n}\r\n\r\n\/* =========================================\r\n   CONTENT\r\n========================================= *\/\r\n\r\n.ec-content {\r\n  position: relative;\r\n  z-index: 5;\r\n\r\n  width: 100%;\r\n  max-width: 1040px;\r\n\r\n  padding:\r\n    clamp(100px, 12vw, 150px)\r\n    clamp(20px, 5vw, 48px);\r\n\r\n  margin: 0 auto;\r\n}\r\n\r\n.ec-eyebrow {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  margin: 0 0 22px;\r\n  padding: 9px 16px;\r\n\r\n  border: 1px solid rgba(147, 197, 253, 0.22);\r\n  border-radius: 999px;\r\n\r\n  background: rgba(15, 23, 42, 0.45);\r\n\r\n  color: #bfdbfe;\r\n\r\n  font-size: 13px;\r\n  font-weight: 700;\r\n  line-height: 1.3;\r\n  letter-spacing: 0.085em;\r\n  text-transform: uppercase;\r\n\r\n  backdrop-filter: blur(12px);\r\n  -webkit-backdrop-filter: blur(12px);\r\n}\r\n\r\n.ec-content h1 {\r\n  max-width: 1000px;\r\n\r\n  margin: 0 auto 24px;\r\n\r\n  color: #ffffff;\r\n\r\n  font-size: clamp(38px, 5.1vw, 63px);\r\n  font-weight: 750;\r\n  line-height: 1.08;\r\n  letter-spacing: -0.035em;\r\n\r\n  text-wrap: balance;\r\n}\r\n\r\n.ec-description {\r\n  max-width: 820px;\r\n\r\n  margin: 0 auto 38px;\r\n\r\n  color: rgba(226, 232, 240, 0.9);\r\n\r\n  font-size: clamp(16px, 1.5vw, 19px);\r\n  font-weight: 400;\r\n  line-height: 1.75;\r\n\r\n  text-wrap: pretty;\r\n}\r\n\r\n\/* =========================================\r\n   CTA BUTTON\r\n========================================= *\/\r\n\r\n.ec-btn {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  min-height: 56px;\r\n\r\n  padding: 16px 30px;\r\n\r\n  gap: 10px;\r\n\r\n  border: 1px solid rgba(255, 255, 255, 0.14);\r\n  border-radius: 14px;\r\n\r\n  background:\r\n    linear-gradient(\r\n      135deg,\r\n      #2563eb 0%,\r\n      #4f46e5 52%,\r\n      #7c3aed 100%\r\n    );\r\n\r\n  color: #ffffff !important;\r\n\r\n  font-size: 16px;\r\n  font-weight: 700;\r\n  line-height: 1.2;\r\n  text-decoration: none !important;\r\n\r\n  box-shadow:\r\n    0 12px 35px rgba(37, 99, 235, 0.28),\r\n    inset 0 1px 0 rgba(255, 255, 255, 0.16);\r\n\r\n  transition:\r\n    transform 0.25s ease,\r\n    box-shadow 0.25s ease,\r\n    background 0.25s ease;\r\n}\r\n\r\n.ec-btn:hover {\r\n  transform: translateY(-3px);\r\n\r\n  color: #ffffff !important;\r\n\r\n  background:\r\n    linear-gradient(\r\n      135deg,\r\n      #3b82f6 0%,\r\n      #6366f1 52%,\r\n      #9333ea 100%\r\n    );\r\n\r\n  box-shadow:\r\n    0 18px 45px rgba(124, 58, 237, 0.35),\r\n    inset 0 1px 0 rgba(255, 255, 255, 0.18);\r\n}\r\n\r\n.ec-btn:focus-visible {\r\n  outline: 3px solid rgba(125, 211, 252, 0.95);\r\n  outline-offset: 5px;\r\n}\r\n\r\n.ec-btn-arrow {\r\n  display: inline-block;\r\n\r\n  font-size: 20px;\r\n  line-height: 1;\r\n\r\n  transition: transform 0.25s ease;\r\n}\r\n\r\n.ec-btn:hover .ec-btn-arrow {\r\n  transform: translateX(4px);\r\n}\r\n\r\n\/* =========================================\r\n   ANIMATED GRADIENT\r\n========================================= *\/\r\n\r\n.ec-bg {\r\n  position: absolute;\r\n  z-index: 0;\r\n\r\n  width: 150%;\r\n  height: 150%;\r\n\r\n  top: -25%;\r\n  left: -25%;\r\n\r\n  background:\r\n    radial-gradient(\r\n      circle at 20% 30%,\r\n      rgba(37, 99, 235, 0.95),\r\n      transparent 38%\r\n    ),\r\n    radial-gradient(\r\n      circle at 80% 20%,\r\n      rgba(147, 51, 234, 0.85),\r\n      transparent 38%\r\n    ),\r\n    radial-gradient(\r\n      circle at 50% 80%,\r\n      rgba(6, 182, 212, 0.75),\r\n      transparent 40%\r\n    );\r\n\r\n  opacity: 0.72;\r\n\r\n  animation: ec-float 20s ease-in-out infinite;\r\n\r\n  will-change: transform;\r\n}\r\n\r\n@keyframes ec-float {\r\n\r\n  0%,\r\n  100% {\r\n    transform: translate3d(0, 0, 0) scale(1);\r\n  }\r\n\r\n  50% {\r\n    transform: translate3d(-70px, -55px, 0) scale(1.03);\r\n  }\r\n\r\n}\r\n\r\n\/* =========================================\r\n   AURORA\r\n========================================= *\/\r\n\r\n.ec-aurora {\r\n  position: absolute;\r\n  z-index: 1;\r\n\r\n  width: 190%;\r\n  height: 190%;\r\n\r\n  top: -45%;\r\n  left: -45%;\r\n\r\n  background:\r\n    conic-gradient(\r\n      from 110deg,\r\n      rgba(37, 99, 235, 0.7),\r\n      rgba(147, 51, 234, 0.65),\r\n      rgba(6, 182, 212, 0.55),\r\n      rgba(37, 99, 235, 0.7)\r\n    );\r\n\r\n  filter: blur(130px);\r\n\r\n  opacity: 0.22;\r\n\r\n  animation: ec-aurora 26s linear infinite;\r\n\r\n  will-change: transform;\r\n}\r\n\r\n@keyframes ec-aurora {\r\n\r\n  from {\r\n    transform: rotate(0deg) scale(1);\r\n  }\r\n\r\n  to {\r\n    transform: rotate(360deg) scale(1.06);\r\n  }\r\n\r\n}\r\n\r\n\/* =========================================\r\n   CSS NOISE\r\n========================================= *\/\r\n\r\n.ec-noise {\r\n  position: absolute;\r\n  z-index: 2;\r\n\r\n  inset: 0;\r\n\r\n  background-image:\r\n    radial-gradient(\r\n      rgba(255, 255, 255, 0.18) 0.65px,\r\n      transparent 0.65px\r\n    );\r\n\r\n  background-size: 4px 4px;\r\n\r\n  opacity: 0.055;\r\n\r\n  mix-blend-mode: soft-light;\r\n\r\n  pointer-events: none;\r\n}\r\n\r\n\/* =========================================\r\n   MOUSE GLOW\r\n========================================= *\/\r\n\r\n.ec-hero::after {\r\n  content: \"\";\r\n\r\n  position: absolute;\r\n  z-index: 3;\r\n\r\n  width: 620px;\r\n  height: 620px;\r\n\r\n  left: var(--mouse-x);\r\n  top: var(--mouse-y);\r\n\r\n  transform: translate(-50%, -50%);\r\n\r\n  border-radius: 50%;\r\n\r\n  background:\r\n    radial-gradient(\r\n      circle,\r\n      rgba(59, 130, 246, 0.3) 0%,\r\n      rgba(99, 102, 241, 0.15) 35%,\r\n      transparent 70%\r\n    );\r\n\r\n  filter: blur(55px);\r\n\r\n  opacity: 0.7;\r\n\r\n  pointer-events: none;\r\n\r\n  transition:\r\n    left 0.12s linear,\r\n    top 0.12s linear;\r\n}\r\n\r\n\/* =========================================\r\n   DARK OVERLAY\r\n========================================= *\/\r\n\r\n.ec-hero::before {\r\n  content: \"\";\r\n\r\n  position: absolute;\r\n  z-index: 4;\r\n\r\n  inset: 0;\r\n\r\n  background:\r\n    linear-gradient(\r\n      180deg,\r\n      rgba(3, 7, 18, 0.16) 0%,\r\n      rgba(3, 7, 18, 0.3) 55%,\r\n      rgba(3, 7, 18, 0.48) 100%\r\n    );\r\n\r\n  pointer-events: none;\r\n}\r\n\r\n\/* =========================================\r\n   TABLET\r\n========================================= *\/\r\n\r\n@media (max-width: 768px) {\r\n\r\n  .ec-hero {\r\n    min-height: 680px;\r\n  }\r\n\r\n  .ec-content {\r\n    padding: 105px 20px 95px;\r\n  }\r\n\r\n  .ec-eyebrow {\r\n    margin-bottom: 18px;\r\n    padding: 8px 13px;\r\n\r\n    font-size: 10.5px;\r\n    letter-spacing: 0.07em;\r\n  }\r\n\r\n  .ec-content h1 {\r\n    max-width: 680px;\r\n\r\n    margin-bottom: 20px;\r\n\r\n    font-size: clamp(35px, 9.5vw, 47px);\r\n    line-height: 1.12;\r\n    letter-spacing: -0.03em;\r\n  }\r\n\r\n  .ec-description {\r\n    margin-bottom: 32px;\r\n\r\n    font-size: 16px;\r\n    line-height: 1.68;\r\n  }\r\n\r\n}\r\n\r\n\/* =========================================\r\n   MOBILE\r\n========================================= *\/\r\n\r\n@media (max-width: 480px) {\r\n\r\n  .ec-hero {\r\n    min-height: 650px;\r\n  }\r\n\r\n  .ec-content {\r\n    padding: 90px 18px 80px;\r\n  }\r\n\r\n  .ec-content h1 {\r\n    font-size: 34px;\r\n  }\r\n\r\n  .ec-description {\r\n    font-size: 15.5px;\r\n  }\r\n\r\n  .ec-btn {\r\n    width: 100%;\r\n    max-width: 390px;\r\n\r\n    padding: 16px 18px;\r\n\r\n    font-size: 14.5px;\r\n  }\r\n\r\n  .ec-hero::after {\r\n    width: 420px;\r\n    height: 420px;\r\n  }\r\n\r\n}\r\n\r\n\/* =========================================\r\n   REDUCED MOTION\r\n========================================= *\/\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n\r\n  .ec-bg,\r\n  .ec-aurora {\r\n    animation: none !important;\r\n  }\r\n\r\n  .ec-btn,\r\n  .ec-btn-arrow,\r\n  .ec-hero::after {\r\n    transition: none !important;\r\n  }\r\n\r\n}\r\n\r\n<\/style>\r\n\r\n<script>\r\n(function () {\r\n\r\n  const heroes = document.querySelectorAll(\".ec-hero\");\r\n\r\n  if (\r\n    !heroes.length ||\r\n    !window.matchMedia(\"(pointer: fine)\").matches ||\r\n    window.matchMedia(\"(prefers-reduced-motion: reduce)\").matches\r\n  ) {\r\n    return;\r\n  }\r\n\r\n  heroes.forEach(function (hero) {\r\n\r\n    hero.addEventListener(\r\n      \"pointermove\",\r\n      function (event) {\r\n\r\n        const rect = hero.getBoundingClientRect();\r\n\r\n        const mouseX = event.clientX - rect.left;\r\n        const mouseY = event.clientY - rect.top;\r\n\r\n        hero.style.setProperty(\r\n          \"--mouse-x\",\r\n          mouseX + \"px\"\r\n        );\r\n\r\n        hero.style.setProperty(\r\n          \"--mouse-y\",\r\n          mouseY + \"px\"\r\n        );\r\n\r\n      },\r\n      { passive: true }\r\n    );\r\n\r\n    hero.addEventListener(\"pointerleave\", function () {\r\n\r\n      hero.style.setProperty(\"--mouse-x\", \"50%\");\r\n      hero.style.setProperty(\"--mouse-y\", \"50%\");\r\n\r\n    });\r\n\r\n  });\r\n\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-f3c6af6 e-flex e-con-boxed e-con e-parent\" data-id=\"f3c6af6\" data-element_type=\"container\" data-e-type=\"container\" data-no-translation=\"\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5290b28 elementor-widget elementor-widget-html\" data-id=\"5290b28\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- ===== Ecolos+ Plattform\u00f6versikt \u2013 Svensk version ===== -->\r\n\r\n<section\r\n  class=\"ec-platform\"\r\n  aria-labelledby=\"ec-platform-title\"\r\n>\r\n  <span\r\n    class=\"ec-platform-orb ec-platform-orb--one\"\r\n    aria-hidden=\"true\"\r\n  ><\/span>\r\n\r\n  <span\r\n    class=\"ec-platform-orb ec-platform-orb--two\"\r\n    aria-hidden=\"true\"\r\n  ><\/span>\r\n\r\n  <div class=\"ec-platform-container\">\r\n\r\n    <!-- Inneh\u00e5ll -->\r\n    <div class=\"ec-platform-content\">\r\n\r\n      <p class=\"ec-platform-eyebrow\">\r\n        <span\r\n          class=\"ec-platform-eyebrow-dot\"\r\n          aria-hidden=\"true\"\r\n        ><\/span>\r\n\r\n        Byggd f\u00f6r moderna leveransfl\u00f6den\r\n      <\/p>\r\n\r\n      <h2 id=\"ec-platform-title\">\r\n        En plattform f\u00f6r smartare last mile-leveranser\r\n      <\/h2>\r\n\r\n      <p class=\"ec-platform-intro\">\r\n        Ecolos+ samlar orderhantering, ruttplanering, kurirfl\u00f6den,\r\n        leveranssp\u00e5rning och analys i en sammanh\u00e4ngande plattform f\u00f6r\r\n        \u00e5terf\u00f6rs\u00e4ljare, transport\u00f6rer, kurirer och mottagare.\r\n      <\/p>\r\n\r\n      <ul class=\"ec-platform-features\">\r\n\r\n        <!-- Funktion 1 -->\r\n        <li class=\"ec-platform-feature\">\r\n\r\n          <div\r\n            class=\"ec-platform-icon\"\r\n            aria-hidden=\"true\"\r\n          >\r\n            <svg\r\n              viewBox=\"0 0 24 24\"\r\n              width=\"22\"\r\n              height=\"22\"\r\n              fill=\"none\"\r\n              xmlns=\"http:\/\/www.w3.org\/2000\/svg\"\r\n            >\r\n              <path\r\n                d=\"M5 17.5C8.5 14 9.5 10 10 5.5M10 5.5L7 8M10 5.5L12.5 8\"\r\n                stroke=\"currentColor\"\r\n                stroke-width=\"1.8\"\r\n                stroke-linecap=\"round\"\r\n                stroke-linejoin=\"round\"\r\n              \/>\r\n\r\n              <path\r\n                d=\"M13 18.5C13.4 15.4 15.1 13.1 19 11M19 11L16.2 10.5M19 11L18.2 13.8\"\r\n                stroke=\"currentColor\"\r\n                stroke-width=\"1.8\"\r\n                stroke-linecap=\"round\"\r\n                stroke-linejoin=\"round\"\r\n              \/>\r\n\r\n              <circle\r\n                cx=\"5\"\r\n                cy=\"18\"\r\n                r=\"2\"\r\n                stroke=\"currentColor\"\r\n                stroke-width=\"1.8\"\r\n              \/>\r\n\r\n              <circle\r\n                cx=\"10\"\r\n                cy=\"4\"\r\n                r=\"2\"\r\n                stroke=\"currentColor\"\r\n                stroke-width=\"1.8\"\r\n              \/>\r\n\r\n              <circle\r\n                cx=\"19\"\r\n                cy=\"10\"\r\n                r=\"2\"\r\n                stroke=\"currentColor\"\r\n                stroke-width=\"1.8\"\r\n              \/>\r\n            <\/svg>\r\n          <\/div>\r\n\r\n          <div class=\"ec-platform-feature-text\">\r\n\r\n            <h3>\r\n              AI-driven ruttoptimering\r\n            <\/h3>\r\n\r\n            <p>\r\n              Planera effektiva leveransrutter som minskar manuellt arbete,\r\n              restid, br\u00e4nslef\u00f6rbrukning och operativa kostnader.\r\n            <\/p>\r\n\r\n          <\/div>\r\n\r\n        <\/li>\r\n\r\n        <!-- Funktion 2 -->\r\n        <li class=\"ec-platform-feature\">\r\n\r\n          <div\r\n            class=\"ec-platform-icon\"\r\n            aria-hidden=\"true\"\r\n          >\r\n            <svg\r\n              viewBox=\"0 0 24 24\"\r\n              width=\"22\"\r\n              height=\"22\"\r\n              fill=\"none\"\r\n              xmlns=\"http:\/\/www.w3.org\/2000\/svg\"\r\n            >\r\n              <path\r\n                d=\"M12 21C12 21 19 15.4 19 9.5C19 5.36 15.87 3 12 3C8.13 3 5 5.36 5 9.5C5 15.4 12 21 12 21Z\"\r\n                stroke=\"currentColor\"\r\n                stroke-width=\"1.8\"\r\n                stroke-linecap=\"round\"\r\n                stroke-linejoin=\"round\"\r\n              \/>\r\n\r\n              <circle\r\n                cx=\"12\"\r\n                cy=\"9.5\"\r\n                r=\"2.5\"\r\n                stroke=\"currentColor\"\r\n                stroke-width=\"1.8\"\r\n              \/>\r\n            <\/svg>\r\n          <\/div>\r\n\r\n          <div class=\"ec-platform-feature-text\">\r\n\r\n            <h3>\r\n              Leverans\u00f6verblick i realtid\r\n            <\/h3>\r\n\r\n            <p>\r\n              F\u00f6lj leveranser fr\u00e5n utskick till slutf\u00f6rande med aktuell\r\n              information f\u00f6r driftteam, transport\u00f6rer och mottagare.\r\n            <\/p>\r\n\r\n          <\/div>\r\n\r\n        <\/li>\r\n\r\n        <!-- Funktion 3 -->\r\n        <li class=\"ec-platform-feature\">\r\n\r\n          <div\r\n            class=\"ec-platform-icon\"\r\n            aria-hidden=\"true\"\r\n          >\r\n            <svg\r\n              viewBox=\"0 0 24 24\"\r\n              width=\"22\"\r\n              height=\"22\"\r\n              fill=\"none\"\r\n              xmlns=\"http:\/\/www.w3.org\/2000\/svg\"\r\n            >\r\n              <path\r\n                d=\"M8 10H8.01M12 10H12.01M16 10H16.01\"\r\n                stroke=\"currentColor\"\r\n                stroke-width=\"2.2\"\r\n                stroke-linecap=\"round\"\r\n              \/>\r\n\r\n              <path\r\n                d=\"M21 11.5C21 16.19 16.97 20 12 20C10.71 20 9.48 19.74 8.37 19.27L4 20L5.16 16.72C3.82 15.32 3 13.5 3 11.5C3 6.81 7.03 3 12 3C16.97 3 21 6.81 21 11.5Z\"\r\n                stroke=\"currentColor\"\r\n                stroke-width=\"1.8\"\r\n                stroke-linecap=\"round\"\r\n                stroke-linejoin=\"round\"\r\n              \/>\r\n            <\/svg>\r\n          <\/div>\r\n\r\n          <div class=\"ec-platform-feature-text\">\r\n\r\n            <h3>\r\n              En b\u00e4ttre mottagarupplevelse\r\n            <\/h3>\r\n\r\n            <p>\r\n              H\u00e5ll mottagare informerade med leveranssp\u00e5rning,\r\n              statusuppdateringar och tydligare kommunikation under hela\r\n              leveransen.\r\n            <\/p>\r\n\r\n          <\/div>\r\n\r\n        <\/li>\r\n\r\n      <\/ul>\r\n\r\n      <div class=\"ec-platform-actions\">\r\n\r\n        <a\r\n          href=\"\/sv\/features\/\"\r\n          class=\"ec-platform-btn ec-platform-btn--primary\"\r\n          aria-label=\"Utforska funktionerna i leveransplattformen Ecolos Plus\"\r\n        >\r\n          Utforska plattformens funktioner\r\n\r\n          <span aria-hidden=\"true\">\r\n            \u2192\r\n          <\/span>\r\n        <\/a>\r\n\r\n        <a\r\n          href=\"\/sv\/lets-talk\/\"\r\n          class=\"ec-platform-btn ec-platform-btn--secondary\"\r\n          aria-label=\"Boka ett kostnadsfritt introduktionsm\u00f6te om Ecolos Plus\"\r\n        >\r\n          Boka ett kostnadsfritt m\u00f6te\r\n        <\/a>\r\n\r\n      <\/div>\r\n\r\n    <\/div>\r\n\r\n    <!-- Produktbild -->\r\n    <div class=\"ec-platform-visual\">\r\n\r\n      <div class=\"ec-platform-image-card\">\r\n\r\n        <img\r\n          src=\"https:\/\/ecolosplus.se\/wp-content\/uploads\/2026\/07\/Untitled-design-2023-09-22T155109.742-1.webp\"\r\n          alt=\"Ecolos+ plattform f\u00f6r last mile-leveranser med kontrollpanel och mobilapp\"\r\n          loading=\"lazy\"\r\n          decoding=\"async\"\r\n          class=\"ec-platform-image\"\r\n        >\r\n\r\n        <div\r\n          class=\"ec-platform-status\"\r\n          aria-hidden=\"true\"\r\n        >\r\n          <span class=\"ec-platform-status-dot\"><\/span>\r\n\r\n          AI-optimerade leveransfl\u00f6den\r\n        <\/div>\r\n\r\n      <\/div>\r\n\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n\r\n\/* =========================================\r\n   ECOLOS+ PLATTFORMS\u00d6VERSIKT\r\n========================================= *\/\r\n\r\n.ec-platform,\r\n.ec-platform * {\r\n  box-sizing: border-box;\r\n}\r\n\r\n.ec-platform {\r\n  position: relative;\r\n  isolation: isolate;\r\n\r\n  width: 100%;\r\n  padding: clamp(78px, 9vw, 120px) 0;\r\n\r\n  overflow: hidden;\r\n\r\n  color: #0f172a;\r\n\r\n  background:\r\n    linear-gradient(\r\n      135deg,\r\n      #f8fafc 0%,\r\n      #ffffff 52%,\r\n      #f0f7ff 100%\r\n    );\r\n}\r\n\r\n.ec-platform-container {\r\n  position: relative;\r\n  z-index: 2;\r\n\r\n  display: grid;\r\n  grid-template-columns:\r\n    minmax(0, 1.02fr)\r\n    minmax(0, 0.98fr);\r\n\r\n  align-items: center;\r\n\r\n  width: 100%;\r\n  max-width: 1180px;\r\n\r\n  margin: 0 auto;\r\n  padding: 0 clamp(20px, 4vw, 36px);\r\n\r\n  gap: clamp(50px, 7vw, 90px);\r\n}\r\n\r\n\/* =========================================\r\n   TEXTINNEH\u00c5LL\r\n========================================= *\/\r\n\r\n.ec-platform-content {\r\n  width: 100%;\r\n  min-width: 0;\r\n}\r\n\r\n.ec-platform-eyebrow {\r\n  display: inline-flex;\r\n  align-items: center;\r\n\r\n  margin: 0 0 20px;\r\n  padding: 8px 14px;\r\n\r\n  gap: 9px;\r\n\r\n  border: 1px solid #bfdbfe;\r\n  border-radius: 999px;\r\n\r\n  background: rgba(219, 234, 254, 0.65);\r\n\r\n  color: #1d4ed8;\r\n\r\n  font-size: 12px;\r\n  font-weight: 750;\r\n  line-height: 1.3;\r\n  letter-spacing: 0.075em;\r\n  text-transform: uppercase;\r\n}\r\n\r\n.ec-platform-eyebrow-dot {\r\n  width: 8px;\r\n  height: 8px;\r\n\r\n  flex: 0 0 8px;\r\n\r\n  border-radius: 50%;\r\n\r\n  background: #2563eb;\r\n\r\n  box-shadow:\r\n    0 0 0 5px rgba(37, 99, 235, 0.11);\r\n}\r\n\r\n.ec-platform h2 {\r\n  max-width: 680px;\r\n\r\n  margin: 0 0 22px;\r\n\r\n  color: #0f172a;\r\n\r\n  font-size: clamp(36px, 4.3vw, 54px);\r\n  font-weight: 760;\r\n  line-height: 1.08;\r\n  letter-spacing: -0.035em;\r\n\r\n  text-wrap: balance;\r\n}\r\n\r\n.ec-platform-intro {\r\n  max-width: 690px;\r\n\r\n  margin: 0 0 40px;\r\n\r\n  color: #475569;\r\n\r\n  font-size: 17px;\r\n  font-weight: 400;\r\n  line-height: 1.75;\r\n\r\n  text-wrap: pretty;\r\n}\r\n\r\n\/* =========================================\r\n   FUNKTIONSLISTA\r\n========================================= *\/\r\n\r\n.ec-platform-features {\r\n  display: grid;\r\n\r\n  margin: 0;\r\n  padding: 0;\r\n\r\n  gap: 26px;\r\n\r\n  list-style: none;\r\n}\r\n\r\n.ec-platform-feature {\r\n  display: flex;\r\n  align-items: flex-start;\r\n\r\n  gap: 17px;\r\n}\r\n\r\n.ec-platform-icon {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  width: 46px;\r\n  height: 46px;\r\n\r\n  flex: 0 0 46px;\r\n\r\n  border: 1px solid rgba(59, 130, 246, 0.15);\r\n  border-radius: 15px;\r\n\r\n  background:\r\n    linear-gradient(\r\n      135deg,\r\n      #2563eb 0%,\r\n      #4f46e5 55%,\r\n      #7c3aed 100%\r\n    );\r\n\r\n  color: #ffffff;\r\n\r\n  box-shadow:\r\n    0 10px 24px rgba(37, 99, 235, 0.2);\r\n}\r\n\r\n.ec-platform-feature-text {\r\n  min-width: 0;\r\n  padding-top: 1px;\r\n}\r\n\r\n.ec-platform-feature h3 {\r\n  margin: 0 0 7px;\r\n\r\n  color: #0f172a;\r\n\r\n  font-size: 18px;\r\n  font-weight: 730;\r\n  line-height: 1.35;\r\n}\r\n\r\n.ec-platform-feature p {\r\n  max-width: 600px;\r\n\r\n  margin: 0;\r\n\r\n  color: #64748b;\r\n\r\n  font-size: 15.5px;\r\n  line-height: 1.68;\r\n}\r\n\r\n\/* =========================================\r\n   KNAPPAR\r\n========================================= *\/\r\n\r\n.ec-platform-actions {\r\n  display: flex;\r\n  align-items: center;\r\n  flex-wrap: wrap;\r\n\r\n  margin-top: 38px;\r\n\r\n  gap: 13px;\r\n}\r\n\r\n.ec-platform-btn {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  min-height: 52px;\r\n  padding: 14px 23px;\r\n\r\n  gap: 9px;\r\n\r\n  border-radius: 13px;\r\n\r\n  font-size: 15px;\r\n  font-weight: 700;\r\n  line-height: 1.25;\r\n  text-align: center;\r\n  text-decoration: none !important;\r\n\r\n  transition:\r\n    transform 0.22s ease,\r\n    box-shadow 0.22s ease,\r\n    background-color 0.22s ease,\r\n    border-color 0.22s ease;\r\n}\r\n\r\n.ec-platform-btn--primary {\r\n  border: 1px solid #2563eb;\r\n\r\n  background: #2563eb;\r\n\r\n  color: #ffffff !important;\r\n\r\n  box-shadow:\r\n    0 10px 26px rgba(37, 99, 235, 0.22);\r\n}\r\n\r\n.ec-platform-btn--primary:hover {\r\n  transform: translateY(-2px);\r\n\r\n  border-color: #1d4ed8;\r\n\r\n  background: #1d4ed8;\r\n\r\n  color: #ffffff !important;\r\n\r\n  box-shadow:\r\n    0 15px 33px rgba(37, 99, 235, 0.29);\r\n}\r\n\r\n.ec-platform-btn--secondary {\r\n  border: 1px solid #cbd5e1;\r\n\r\n  background: rgba(255, 255, 255, 0.76);\r\n\r\n  color: #1e293b !important;\r\n}\r\n\r\n.ec-platform-btn--secondary:hover {\r\n  transform: translateY(-2px);\r\n\r\n  border-color: #94a3b8;\r\n\r\n  background: #ffffff;\r\n\r\n  color: #0f172a !important;\r\n}\r\n\r\n.ec-platform-btn:focus-visible {\r\n  outline: 3px solid rgba(37, 99, 235, 0.35);\r\n  outline-offset: 4px;\r\n}\r\n\r\n\/* =========================================\r\n   PRODUKTBILD\r\n========================================= *\/\r\n\r\n.ec-platform-visual {\r\n  position: relative;\r\n\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  min-width: 0;\r\n}\r\n\r\n.ec-platform-image-card {\r\n  position: relative;\r\n\r\n  width: 100%;\r\n  max-width: 540px;\r\n  aspect-ratio: 1 \/ 1;\r\n\r\n  padding: clamp(12px, 2vw, 20px);\r\n\r\n  border: 1px solid rgba(148, 163, 184, 0.2);\r\n  border-radius: 32px;\r\n\r\n  background: rgba(255, 255, 255, 0.68);\r\n\r\n  box-shadow:\r\n    0 30px 80px rgba(15, 23, 42, 0.13),\r\n    inset 0 1px 0 rgba(255, 255, 255, 0.9);\r\n\r\n  backdrop-filter: blur(12px);\r\n  -webkit-backdrop-filter: blur(12px);\r\n}\r\n\r\n.ec-platform-image {\r\n  display: block;\r\n\r\n  width: 100%;\r\n  height: 100%;\r\n\r\n  border-radius: 23px;\r\n\r\n  object-fit: contain;\r\n  object-position: center;\r\n}\r\n\r\n.ec-platform-status {\r\n  position: absolute;\r\n\r\n  top: -17px;\r\n  right: -15px;\r\n\r\n  display: flex;\r\n  align-items: center;\r\n\r\n  padding: 11px 15px;\r\n\r\n  gap: 9px;\r\n\r\n  border: 1px solid rgba(226, 232, 240, 0.9);\r\n  border-radius: 14px;\r\n\r\n  background: rgba(255, 255, 255, 0.92);\r\n\r\n  color: #334155;\r\n\r\n  font-size: 13px;\r\n  font-weight: 700;\r\n  line-height: 1.3;\r\n\r\n  box-shadow:\r\n    0 15px 36px rgba(15, 23, 42, 0.12);\r\n\r\n  backdrop-filter: blur(12px);\r\n  -webkit-backdrop-filter: blur(12px);\r\n}\r\n\r\n.ec-platform-status-dot {\r\n  width: 9px;\r\n  height: 9px;\r\n\r\n  flex: 0 0 9px;\r\n\r\n  border-radius: 50%;\r\n\r\n  background: #10b981;\r\n\r\n  box-shadow:\r\n    0 0 0 5px rgba(16, 185, 129, 0.12);\r\n}\r\n\r\n\/* =========================================\r\n   DEKORATION\r\n========================================= *\/\r\n\r\n.ec-platform-orb {\r\n  position: absolute;\r\n  z-index: 0;\r\n\r\n  display: block;\r\n\r\n  border-radius: 50%;\r\n\r\n  pointer-events: none;\r\n}\r\n\r\n.ec-platform-orb--one {\r\n  top: -160px;\r\n  left: -130px;\r\n\r\n  width: 390px;\r\n  height: 390px;\r\n\r\n  background:\r\n    radial-gradient(\r\n      circle,\r\n      rgba(59, 130, 246, 0.14),\r\n      transparent 68%\r\n    );\r\n}\r\n\r\n.ec-platform-orb--two {\r\n  right: -150px;\r\n  bottom: -190px;\r\n\r\n  width: 450px;\r\n  height: 450px;\r\n\r\n  background:\r\n    radial-gradient(\r\n      circle,\r\n      rgba(124, 58, 237, 0.12),\r\n      transparent 68%\r\n    );\r\n}\r\n\r\n\/* =========================================\r\n   SURFPLATTA\r\n========================================= *\/\r\n\r\n@media (max-width: 900px) {\r\n\r\n  .ec-platform-container {\r\n    grid-template-columns: 1fr;\r\n\r\n    gap: 60px;\r\n  }\r\n\r\n  .ec-platform-content {\r\n    max-width: 760px;\r\n\r\n    margin: 0 auto;\r\n\r\n    text-align: center;\r\n  }\r\n\r\n  .ec-platform h2,\r\n  .ec-platform-intro {\r\n    margin-right: auto;\r\n    margin-left: auto;\r\n  }\r\n\r\n  .ec-platform-feature {\r\n    max-width: 660px;\r\n\r\n    margin: 0 auto;\r\n\r\n    text-align: left;\r\n  }\r\n\r\n  .ec-platform-actions {\r\n    justify-content: center;\r\n  }\r\n\r\n  .ec-platform-image-card {\r\n    max-width: 570px;\r\n  }\r\n\r\n}\r\n\r\n\/* =========================================\r\n   MOBIL\r\n========================================= *\/\r\n\r\n@media (max-width: 600px) {\r\n\r\n  .ec-platform {\r\n    padding: 72px 0;\r\n  }\r\n\r\n  .ec-platform-container {\r\n    padding: 0 18px;\r\n\r\n    gap: 48px;\r\n  }\r\n\r\n  .ec-platform-eyebrow {\r\n    font-size: 10.5px;\r\n    letter-spacing: 0.065em;\r\n  }\r\n\r\n  .ec-platform h2 {\r\n    font-size: 35px;\r\n    line-height: 1.12;\r\n  }\r\n\r\n  .ec-platform-intro {\r\n    margin-bottom: 34px;\r\n\r\n    font-size: 16px;\r\n    line-height: 1.7;\r\n  }\r\n\r\n  .ec-platform-features {\r\n    gap: 24px;\r\n  }\r\n\r\n  .ec-platform-feature {\r\n    gap: 14px;\r\n  }\r\n\r\n  .ec-platform-icon {\r\n    width: 43px;\r\n    height: 43px;\r\n\r\n    flex-basis: 43px;\r\n\r\n    border-radius: 13px;\r\n  }\r\n\r\n  .ec-platform-feature h3 {\r\n    font-size: 17px;\r\n  }\r\n\r\n  .ec-platform-feature p {\r\n    font-size: 14.5px;\r\n  }\r\n\r\n  .ec-platform-actions {\r\n    display: grid;\r\n    grid-template-columns: 1fr;\r\n\r\n    width: 100%;\r\n  }\r\n\r\n  .ec-platform-btn {\r\n    width: 100%;\r\n  }\r\n\r\n  .ec-platform-image-card {\r\n    border-radius: 24px;\r\n  }\r\n\r\n  .ec-platform-image {\r\n    border-radius: 18px;\r\n  }\r\n\r\n  .ec-platform-status {\r\n    top: -14px;\r\n    right: 10px;\r\n\r\n    padding: 9px 12px;\r\n\r\n    font-size: 11.5px;\r\n  }\r\n\r\n}\r\n\r\n\/* =========================================\r\n   MINSKAD R\u00d6RELSE\r\n========================================= *\/\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n\r\n  .ec-platform-btn {\r\n    transition: none !important;\r\n  }\r\n\r\n  .ec-platform-btn:hover {\r\n    transform: none;\r\n  }\r\n\r\n}\r\n\r\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-c4a428e e-flex e-con-boxed e-con e-parent\" data-id=\"c4a428e\" data-element_type=\"container\" data-e-type=\"container\" data-no-translation=\"\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-039b9c9 elementor-widget elementor-widget-html\" data-id=\"039b9c9\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- ===== Ecolos+ Plattformsmoduler \u2013 Svensk version ===== -->\r\n\r\n<section\r\n  class=\"ecolos-slider\"\r\n  aria-labelledby=\"ecolos-modules-title\"\r\n  data-ecolos-slider\r\n>\r\n  <div class=\"ecolos-slider-container\">\r\n\r\n    <!-- Rubrik -->\r\n    <header class=\"ecolos-slider-header\">\r\n\r\n      <p class=\"ecolos-slider-eyebrow\">\r\n        Sammankopplad leveransteknik\r\n      <\/p>\r\n\r\n      <h2 id=\"ecolos-modules-title\">\r\n        Utforska modulerna i Ecolos+\r\n      <\/h2>\r\n\r\n      <p class=\"ecolos-slider-intro\">\r\n        Se hur Ecolos+ kopplar samman operativa kontrollpaneler,\r\n        leveranshantering och mobilappar f\u00f6r att st\u00f6dja hela fl\u00f6det\r\n        inom last mile-leveranser.\r\n      <\/p>\r\n\r\n    <\/header>\r\n\r\n    <!-- Karusell -->\r\n    <div\r\n      class=\"ecolos-carousel\"\r\n      role=\"region\"\r\n      aria-roledescription=\"karusell\"\r\n      aria-label=\"Moduler i Ecolos Plus-plattformen\"\r\n      tabindex=\"0\"\r\n    >\r\n\r\n      <div class=\"ecolos-viewport\">\r\n\r\n        <div\r\n          id=\"ecolos-track-sv\"\r\n          class=\"ecolos-track\"\r\n          aria-live=\"off\"\r\n        >\r\n\r\n          <!-- Bildruta 1 -->\r\n          <div\r\n            class=\"ecolos-slide\"\r\n            role=\"group\"\r\n            aria-roledescription=\"slide\"\r\n            aria-label=\"1 av 3\"\r\n            aria-hidden=\"false\"\r\n          >\r\n            <figure class=\"ecolos-slide-card\">\r\n\r\n              <img\r\n                src=\"https:\/\/ecolosplus.se\/wp-content\/uploads\/2026\/07\/ChatGPT-Image-Jun-26-2026-03_22_22-PM-2.webp\"\r\n                alt=\"\u00d6versikt \u00f6ver sammankopplade moduler i Ecolos+ plattform f\u00f6r last mile-leveranser\"\r\n                loading=\"lazy\"\r\n                decoding=\"async\"\r\n                fetchpriority=\"low\"\r\n                class=\"ecolos-slide-image\"\r\n              >\r\n\r\n              <figcaption class=\"ecolos-slide-caption\">\r\n\r\n                <span\r\n                  class=\"ecolos-slide-number\"\r\n                  aria-hidden=\"true\"\r\n                >\r\n                  01\r\n                <\/span>\r\n\r\n                <div>\r\n\r\n                  <h3>\r\n                    Sammankopplade leveransmoduler\r\n                  <\/h3>\r\n\r\n                  <p>\r\n                    Samla ruttplanering, operativ hantering, kurirfl\u00f6den\r\n                    och kommunikation med mottagare i en sammanh\u00e4ngande\r\n                    digital milj\u00f6.\r\n                  <\/p>\r\n\r\n                <\/div>\r\n\r\n              <\/figcaption>\r\n\r\n            <\/figure>\r\n          <\/div>\r\n\r\n          <!-- Bildruta 2 -->\r\n          <div\r\n            class=\"ecolos-slide\"\r\n            role=\"group\"\r\n            aria-roledescription=\"slide\"\r\n            aria-label=\"2 av 3\"\r\n            aria-hidden=\"true\"\r\n          >\r\n            <figure class=\"ecolos-slide-card\">\r\n\r\n              <img\r\n                src=\"https:\/\/ecolosplus.se\/wp-content\/uploads\/2026\/07\/ChatGPT-Image-Jun-26-2026-03_04_42-PM-2.webp\"\r\n                alt=\"Ecolos+ kontrollpanel f\u00f6r hantering av order, rutter och leveransresultat\"\r\n                loading=\"lazy\"\r\n                decoding=\"async\"\r\n                fetchpriority=\"low\"\r\n                class=\"ecolos-slide-image\"\r\n              >\r\n\r\n              <figcaption class=\"ecolos-slide-caption\">\r\n\r\n                <span\r\n                  class=\"ecolos-slide-number\"\r\n                  aria-hidden=\"true\"\r\n                >\r\n                  02\r\n                <\/span>\r\n\r\n                <div>\r\n\r\n                  <h3>\r\n                    Operativa kontrollpaneler\r\n                  <\/h3>\r\n\r\n                  <p>\r\n                    Hantera order, f\u00f6lj rutter och analysera leveransresultat\r\n                    med tydlig \u00f6verblick \u00f6ver den dagliga verksamheten.\r\n                  <\/p>\r\n\r\n                <\/div>\r\n\r\n              <\/figcaption>\r\n\r\n            <\/figure>\r\n          <\/div>\r\n\r\n          <!-- Bildruta 3 -->\r\n          <div\r\n            class=\"ecolos-slide\"\r\n            role=\"group\"\r\n            aria-roledescription=\"slide\"\r\n            aria-label=\"3 av 3\"\r\n            aria-hidden=\"true\"\r\n          >\r\n            <figure class=\"ecolos-slide-card\">\r\n\r\n              <img\r\n                src=\"https:\/\/ecolosplus.se\/wp-content\/uploads\/2026\/07\/ChatGPT-Image-Jun-26-2026-03_04_43-PM-3.webp\"\r\n                alt=\"Ecolos+ mobilappar f\u00f6r kurirfl\u00f6den, leveranssp\u00e5rning och mottagarkommunikation\"\r\n                loading=\"lazy\"\r\n                decoding=\"async\"\r\n                fetchpriority=\"low\"\r\n                class=\"ecolos-slide-image\"\r\n              >\r\n\r\n              <figcaption class=\"ecolos-slide-caption\">\r\n\r\n                <span\r\n                  class=\"ecolos-slide-number\"\r\n                  aria-hidden=\"true\"\r\n                >\r\n                  03\r\n                <\/span>\r\n\r\n                <div>\r\n\r\n                  <h3>\r\n                    Mobila leveransappar\r\n                  <\/h3>\r\n\r\n                  <p>\r\n                    St\u00f6d kurirer och mottagare med appar f\u00f6r uppdrag,\r\n                    leveransstatus, sp\u00e5rning och leveransbevis.\r\n                  <\/p>\r\n\r\n                <\/div>\r\n\r\n              <\/figcaption>\r\n\r\n            <\/figure>\r\n          <\/div>\r\n\r\n        <\/div>\r\n\r\n      <\/div>\r\n\r\n      <!-- F\u00f6reg\u00e5ende -->\r\n      <button\r\n        type=\"button\"\r\n        class=\"ecolos-arrow ecolos-prev\"\r\n        aria-label=\"Visa f\u00f6reg\u00e5ende modul\"\r\n        aria-controls=\"ecolos-track-sv\"\r\n      >\r\n        <svg\r\n          viewBox=\"0 0 24 24\"\r\n          width=\"23\"\r\n          height=\"23\"\r\n          fill=\"none\"\r\n          aria-hidden=\"true\"\r\n        >\r\n          <path\r\n            d=\"M15 18L9 12L15 6\"\r\n            stroke=\"currentColor\"\r\n            stroke-width=\"2\"\r\n            stroke-linecap=\"round\"\r\n            stroke-linejoin=\"round\"\r\n          \/>\r\n        <\/svg>\r\n      <\/button>\r\n\r\n      <!-- N\u00e4sta -->\r\n      <button\r\n        type=\"button\"\r\n        class=\"ecolos-arrow ecolos-next\"\r\n        aria-label=\"Visa n\u00e4sta modul\"\r\n        aria-controls=\"ecolos-track-sv\"\r\n      >\r\n        <svg\r\n          viewBox=\"0 0 24 24\"\r\n          width=\"23\"\r\n          height=\"23\"\r\n          fill=\"none\"\r\n          aria-hidden=\"true\"\r\n        >\r\n          <path\r\n            d=\"M9 6L15 12L9 18\"\r\n            stroke=\"currentColor\"\r\n            stroke-width=\"2\"\r\n            stroke-linecap=\"round\"\r\n            stroke-linejoin=\"round\"\r\n          \/>\r\n        <\/svg>\r\n      <\/button>\r\n\r\n    <\/div>\r\n\r\n    <!-- Kontroller -->\r\n    <div class=\"ecolos-controls\">\r\n\r\n      <div\r\n        class=\"ecolos-dots\"\r\n        role=\"group\"\r\n        aria-label=\"V\u00e4lj plattformsmodul\"\r\n      ><\/div>\r\n\r\n      <button\r\n        type=\"button\"\r\n        class=\"ecolos-autoplay-toggle\"\r\n        aria-label=\"Pausa automatisk v\u00e4xling mellan bilder\"\r\n        aria-pressed=\"false\"\r\n        aria-controls=\"ecolos-track-sv\"\r\n        data-ecolos-autoplay\r\n      >\r\n        <span\r\n          class=\"ecolos-autoplay-pause\"\r\n          aria-hidden=\"true\"\r\n        >\r\n          <svg\r\n            viewBox=\"0 0 24 24\"\r\n            width=\"17\"\r\n            height=\"17\"\r\n            fill=\"currentColor\"\r\n          >\r\n            <path d=\"M7 5H10V19H7V5ZM14 5H17V19H14V5Z\"><\/path>\r\n          <\/svg>\r\n        <\/span>\r\n\r\n        <span\r\n          class=\"ecolos-autoplay-play\"\r\n          aria-hidden=\"true\"\r\n        >\r\n          <svg\r\n            viewBox=\"0 0 24 24\"\r\n            width=\"17\"\r\n            height=\"17\"\r\n            fill=\"currentColor\"\r\n          >\r\n            <path d=\"M8 5.5V18.5L18 12L8 5.5Z\"><\/path>\r\n          <\/svg>\r\n        <\/span>\r\n\r\n        <span class=\"ecolos-autoplay-text\">\r\n          Pausa\r\n        <\/span>\r\n      <\/button>\r\n\r\n    <\/div>\r\n\r\n    <!-- Status f\u00f6r sk\u00e4rml\u00e4sare -->\r\n    <p\r\n      class=\"ecolos-slider-status\"\r\n      aria-live=\"polite\"\r\n      aria-atomic=\"true\"\r\n    ><\/p>\r\n\r\n    <!-- Intern l\u00e4nk -->\r\n    <div class=\"ecolos-slider-action\">\r\n\r\n      <a\r\n        href=\"\/sv\/features\/\"\r\n        class=\"ecolos-slider-link\"\r\n        aria-label=\"Utforska alla funktioner i Ecolos Plus-plattformen\"\r\n      >\r\n        Utforska alla plattformsfunktioner\r\n\r\n        <span aria-hidden=\"true\">\r\n          \u2192\r\n        <\/span>\r\n      <\/a>\r\n\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n\r\n\/* =========================================\r\n   ECOLOS+ MODULKARUSELL\r\n========================================= *\/\r\n\r\n.ecolos-slider,\r\n.ecolos-slider * {\r\n  box-sizing: border-box;\r\n}\r\n\r\n.ecolos-slider {\r\n  position: relative;\r\n  isolation: isolate;\r\n\r\n  width: 100vw;\r\n  max-width: 100vw;\r\n\r\n  margin-left: calc(50% - 50vw);\r\n  padding: clamp(76px, 9vw, 115px) 0;\r\n\r\n  overflow: hidden;\r\n\r\n  color: #0f172a;\r\n\r\n  background:\r\n    radial-gradient(\r\n      circle at 10% 10%,\r\n      rgba(37, 99, 235, 0.08),\r\n      transparent 32%\r\n    ),\r\n    radial-gradient(\r\n      circle at 90% 80%,\r\n      rgba(124, 58, 237, 0.07),\r\n      transparent 34%\r\n    ),\r\n    #f8fafc;\r\n}\r\n\r\n.ecolos-slider-container {\r\n  width: 100%;\r\n  max-width: 1400px;\r\n\r\n  margin: 0 auto;\r\n  padding: 0 clamp(18px, 4vw, 44px);\r\n}\r\n\r\n\/* =========================================\r\n   RUBRIK\r\n========================================= *\/\r\n\r\n.ecolos-slider-header {\r\n  max-width: 820px;\r\n\r\n  margin: 0 auto 48px;\r\n\r\n  text-align: center;\r\n}\r\n\r\n.ecolos-slider-eyebrow {\r\n  margin: 0 0 15px;\r\n\r\n  color: #2563eb;\r\n\r\n  font-size: 12px;\r\n  font-weight: 750;\r\n  line-height: 1.3;\r\n  letter-spacing: 0.09em;\r\n  text-transform: uppercase;\r\n}\r\n\r\n.ecolos-slider h2 {\r\n  margin: 0 0 18px;\r\n\r\n  color: #0e2a6b;\r\n\r\n  font-size: clamp(34px, 4.4vw, 52px);\r\n  font-weight: 760;\r\n  line-height: 1.1;\r\n  letter-spacing: -0.035em;\r\n\r\n  text-wrap: balance;\r\n}\r\n\r\n.ecolos-slider-intro {\r\n  max-width: 760px;\r\n\r\n  margin: 0 auto;\r\n\r\n  color: #64748b;\r\n\r\n  font-size: 17px;\r\n  line-height: 1.72;\r\n\r\n  text-wrap: pretty;\r\n}\r\n\r\n\/* =========================================\r\n   KARUSELL\r\n========================================= *\/\r\n\r\n.ecolos-carousel {\r\n  position: relative;\r\n\r\n  width: 100%;\r\n\r\n  padding: 0 68px;\r\n\r\n  border-radius: 26px;\r\n}\r\n\r\n.ecolos-carousel:focus-visible {\r\n  outline: 3px solid rgba(37, 99, 235, 0.35);\r\n  outline-offset: 7px;\r\n}\r\n\r\n.ecolos-viewport {\r\n  width: 100%;\r\n\r\n  overflow: hidden;\r\n\r\n  border-radius: 25px;\r\n}\r\n\r\n.ecolos-track {\r\n  display: flex;\r\n\r\n  width: 100%;\r\n\r\n  transform: translate3d(0, 0, 0);\r\n\r\n  transition:\r\n    transform 0.7s cubic-bezier(0.77, 0, 0.18, 1);\r\n\r\n  touch-action: pan-y;\r\n}\r\n\r\n.ecolos-slide {\r\n  min-width: 100%;\r\n\r\n  padding: 0 8px;\r\n}\r\n\r\n\/* =========================================\r\n   BILDKORT\r\n========================================= *\/\r\n\r\n.ecolos-slide-card {\r\n  position: relative;\r\n\r\n  width: 100%;\r\n  max-width: 1160px;\r\n\r\n  margin: 0 auto;\r\n\r\n  overflow: hidden;\r\n\r\n  border: 1px solid rgba(148, 163, 184, 0.22);\r\n  border-radius: 24px;\r\n\r\n  background: #ffffff;\r\n\r\n  box-shadow:\r\n    0 30px 75px rgba(15, 23, 42, 0.12),\r\n    0 8px 24px rgba(15, 23, 42, 0.05);\r\n}\r\n\r\n.ecolos-slide-image {\r\n  display: block;\r\n\r\n  width: 100%;\r\n  height: auto;\r\n  aspect-ratio: 16 \/ 9;\r\n\r\n  object-fit: cover;\r\n  object-position: center;\r\n\r\n  background: #e2e8f0;\r\n\r\n  transition: transform 0.45s ease;\r\n}\r\n\r\n.ecolos-slide-card:hover .ecolos-slide-image {\r\n  transform: scale(1.012);\r\n}\r\n\r\n\/* =========================================\r\n   BILDTEXT\r\n========================================= *\/\r\n\r\n.ecolos-slide-caption {\r\n  display: grid;\r\n  grid-template-columns: auto minmax(0, 1fr);\r\n  align-items: flex-start;\r\n\r\n  padding: 25px 30px 28px;\r\n\r\n  gap: 20px;\r\n\r\n  border-top: 1px solid #e2e8f0;\r\n\r\n  background: rgba(255, 255, 255, 0.98);\r\n\r\n  text-align: left;\r\n}\r\n\r\n.ecolos-slide-number {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  width: 46px;\r\n  height: 46px;\r\n\r\n  flex: 0 0 46px;\r\n\r\n  border-radius: 14px;\r\n\r\n  background:\r\n    linear-gradient(\r\n      135deg,\r\n      #2563eb,\r\n      #4f46e5,\r\n      #7c3aed\r\n    );\r\n\r\n  color: #ffffff;\r\n\r\n  font-size: 14px;\r\n  font-weight: 800;\r\n  line-height: 1;\r\n\r\n  box-shadow:\r\n    0 10px 24px rgba(37, 99, 235, 0.2);\r\n}\r\n\r\n.ecolos-slide-caption h3 {\r\n  margin: 0 0 7px;\r\n\r\n  color: #0f172a;\r\n\r\n  font-size: 19px;\r\n  font-weight: 740;\r\n  line-height: 1.35;\r\n}\r\n\r\n.ecolos-slide-caption p {\r\n  max-width: 800px;\r\n\r\n  margin: 0;\r\n\r\n  color: #64748b;\r\n\r\n  font-size: 15px;\r\n  line-height: 1.65;\r\n}\r\n\r\n\/* =========================================\r\n   PILKNAPPAR\r\n========================================= *\/\r\n\r\n.ecolos-arrow {\r\n  position: absolute;\r\n  z-index: 10;\r\n\r\n  top: 50%;\r\n\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  width: 50px;\r\n  height: 50px;\r\n\r\n  padding: 0;\r\n\r\n  transform: translateY(-50%);\r\n\r\n  border: 1px solid rgba(148, 163, 184, 0.25);\r\n  border-radius: 50%;\r\n\r\n  background: rgba(255, 255, 255, 0.94);\r\n\r\n  color: #0e2a6b;\r\n\r\n  cursor: pointer;\r\n\r\n  box-shadow:\r\n    0 12px 30px rgba(15, 23, 42, 0.13);\r\n\r\n  backdrop-filter: blur(12px);\r\n  -webkit-backdrop-filter: blur(12px);\r\n\r\n  transition:\r\n    transform 0.22s ease,\r\n    color 0.22s ease,\r\n    background-color 0.22s ease,\r\n    box-shadow 0.22s ease;\r\n}\r\n\r\n.ecolos-arrow:hover {\r\n  transform: translateY(-50%) scale(1.08);\r\n\r\n  background: #ffffff;\r\n\r\n  color: #2563eb;\r\n\r\n  box-shadow:\r\n    0 17px 38px rgba(15, 23, 42, 0.17);\r\n}\r\n\r\n.ecolos-arrow:focus-visible {\r\n  outline: 3px solid rgba(37, 99, 235, 0.38);\r\n  outline-offset: 4px;\r\n}\r\n\r\n.ecolos-prev {\r\n  left: 5px;\r\n}\r\n\r\n.ecolos-next {\r\n  right: 5px;\r\n}\r\n\r\n\/* =========================================\r\n   KONTROLLER\r\n========================================= *\/\r\n\r\n.ecolos-controls {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-wrap: wrap;\r\n\r\n  min-height: 42px;\r\n\r\n  margin-top: 25px;\r\n\r\n  gap: 14px;\r\n}\r\n\r\n\/* =========================================\r\n   NAVIGERINGSPUNKTER\r\n========================================= *\/\r\n\r\n.ecolos-dots {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  min-height: 32px;\r\n\r\n  gap: 9px;\r\n}\r\n\r\n.ecolos-dot {\r\n  position: relative;\r\n\r\n  width: 12px;\r\n  height: 12px;\r\n\r\n  padding: 0;\r\n\r\n  border: 0;\r\n  border-radius: 999px;\r\n\r\n  background: #cbd5e1;\r\n\r\n  cursor: pointer;\r\n\r\n  transition:\r\n    width 0.25s ease,\r\n    background-color 0.25s ease,\r\n    transform 0.25s ease;\r\n}\r\n\r\n.ecolos-dot:hover {\r\n  background: #94a3b8;\r\n}\r\n\r\n.ecolos-dot[aria-current=\"true\"] {\r\n  width: 32px;\r\n\r\n  background:\r\n    linear-gradient(\r\n      90deg,\r\n      #2563eb,\r\n      #7c3aed\r\n    );\r\n}\r\n\r\n.ecolos-dot:focus-visible {\r\n  outline: 3px solid rgba(37, 99, 235, 0.35);\r\n  outline-offset: 4px;\r\n}\r\n\r\n\/* =========================================\r\n   AUTOMATISK V\u00c4XLING\r\n========================================= *\/\r\n\r\n.ecolos-autoplay-toggle {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  min-height: 38px;\r\n\r\n  padding: 8px 13px;\r\n\r\n  gap: 7px;\r\n\r\n  border: 1px solid #cbd5e1;\r\n  border-radius: 999px;\r\n\r\n  background: rgba(255, 255, 255, 0.85);\r\n\r\n  color: #334155;\r\n\r\n  font-size: 12.5px;\r\n  font-weight: 700;\r\n  line-height: 1;\r\n\r\n  cursor: pointer;\r\n\r\n  transition:\r\n    border-color 0.2s ease,\r\n    background-color 0.2s ease,\r\n    color 0.2s ease,\r\n    transform 0.2s ease;\r\n}\r\n\r\n.ecolos-autoplay-toggle:hover {\r\n  transform: translateY(-1px);\r\n\r\n  border-color: #93c5fd;\r\n\r\n  background: #ffffff;\r\n\r\n  color: #1d4ed8;\r\n}\r\n\r\n.ecolos-autoplay-toggle:focus-visible {\r\n  outline: 3px solid rgba(37, 99, 235, 0.35);\r\n  outline-offset: 4px;\r\n}\r\n\r\n.ecolos-autoplay-play {\r\n  display: none;\r\n}\r\n\r\n.ecolos-autoplay-toggle[data-paused=\"true\"]\r\n.ecolos-autoplay-pause {\r\n  display: none;\r\n}\r\n\r\n.ecolos-autoplay-toggle[data-paused=\"true\"]\r\n.ecolos-autoplay-play {\r\n  display: inline-flex;\r\n}\r\n\r\n.ecolos-autoplay-pause,\r\n.ecolos-autoplay-play {\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n\r\n\/* =========================================\r\n   INTERN L\u00c4NK\r\n========================================= *\/\r\n\r\n.ecolos-slider-action {\r\n  display: flex;\r\n  justify-content: center;\r\n\r\n  margin-top: 23px;\r\n}\r\n\r\n.ecolos-slider-link {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  min-height: 50px;\r\n\r\n  padding: 13px 22px;\r\n\r\n  gap: 9px;\r\n\r\n  border: 1px solid #cbd5e1;\r\n  border-radius: 13px;\r\n\r\n  background: rgba(255, 255, 255, 0.78);\r\n\r\n  color: #1e3a8a !important;\r\n\r\n  font-size: 15px;\r\n  font-weight: 700;\r\n  line-height: 1.2;\r\n  text-align: center;\r\n  text-decoration: none !important;\r\n\r\n  transition:\r\n    transform 0.22s ease,\r\n    border-color 0.22s ease,\r\n    background-color 0.22s ease,\r\n    box-shadow 0.22s ease;\r\n}\r\n\r\n.ecolos-slider-link:hover {\r\n  transform: translateY(-2px);\r\n\r\n  border-color: #93c5fd;\r\n\r\n  background: #ffffff;\r\n\r\n  color: #1d4ed8 !important;\r\n\r\n  box-shadow:\r\n    0 12px 28px rgba(15, 23, 42, 0.1);\r\n}\r\n\r\n.ecolos-slider-link:focus-visible {\r\n  outline: 3px solid rgba(37, 99, 235, 0.35);\r\n  outline-offset: 4px;\r\n}\r\n\r\n\/* =========================================\r\n   SK\u00c4RML\u00c4SARSTATUS\r\n========================================= *\/\r\n\r\n.ecolos-slider-status {\r\n  position: absolute;\r\n\r\n  width: 1px;\r\n  height: 1px;\r\n\r\n  padding: 0;\r\n  margin: -1px;\r\n\r\n  overflow: hidden;\r\n\r\n  clip: rect(0, 0, 0, 0);\r\n  clip-path: inset(50%);\r\n\r\n  white-space: nowrap;\r\n\r\n  border: 0;\r\n}\r\n\r\n\/* =========================================\r\n   SURFPLATTA\r\n========================================= *\/\r\n\r\n@media (max-width: 900px) {\r\n\r\n  .ecolos-slider {\r\n    padding: 72px 0;\r\n  }\r\n\r\n  .ecolos-slider-header {\r\n    margin-bottom: 36px;\r\n  }\r\n\r\n  .ecolos-carousel {\r\n    padding: 0 46px;\r\n  }\r\n\r\n  .ecolos-arrow {\r\n    width: 42px;\r\n    height: 42px;\r\n  }\r\n\r\n  .ecolos-prev {\r\n    left: 0;\r\n  }\r\n\r\n  .ecolos-next {\r\n    right: 0;\r\n  }\r\n\r\n}\r\n\r\n\/* =========================================\r\n   MOBIL\r\n========================================= *\/\r\n\r\n@media (max-width: 600px) {\r\n\r\n  .ecolos-slider {\r\n    padding: 65px 0;\r\n  }\r\n\r\n  .ecolos-slider-container {\r\n    padding: 0 16px;\r\n  }\r\n\r\n  .ecolos-slider-header {\r\n    margin-bottom: 30px;\r\n  }\r\n\r\n  .ecolos-slider h2 {\r\n    font-size: 34px;\r\n    line-height: 1.13;\r\n  }\r\n\r\n  .ecolos-slider-intro {\r\n    font-size: 15.5px;\r\n    line-height: 1.68;\r\n  }\r\n\r\n  .ecolos-carousel {\r\n    padding: 0;\r\n  }\r\n\r\n  .ecolos-viewport {\r\n    border-radius: 19px;\r\n  }\r\n\r\n  .ecolos-slide {\r\n    padding: 0 2px;\r\n  }\r\n\r\n  .ecolos-slide-card {\r\n    border-radius: 19px;\r\n  }\r\n\r\n  .ecolos-slide-image {\r\n    aspect-ratio: 4 \/ 3;\r\n  }\r\n\r\n  .ecolos-slide-caption {\r\n    grid-template-columns: 1fr;\r\n\r\n    padding: 20px;\r\n\r\n    gap: 13px;\r\n  }\r\n\r\n  .ecolos-slide-number {\r\n    width: 40px;\r\n    height: 40px;\r\n\r\n    flex-basis: 40px;\r\n\r\n    border-radius: 12px;\r\n  }\r\n\r\n  .ecolos-slide-caption h3 {\r\n    font-size: 18px;\r\n  }\r\n\r\n  .ecolos-slide-caption p {\r\n    font-size: 14px;\r\n  }\r\n\r\n  .ecolos-arrow {\r\n    top: calc(50% - 55px);\r\n\r\n    width: 39px;\r\n    height: 39px;\r\n\r\n    background: rgba(255, 255, 255, 0.93);\r\n  }\r\n\r\n  .ecolos-prev {\r\n    left: 9px;\r\n  }\r\n\r\n  .ecolos-next {\r\n    right: 9px;\r\n  }\r\n\r\n  .ecolos-controls {\r\n    margin-top: 21px;\r\n  }\r\n\r\n  .ecolos-slider-link {\r\n    width: 100%;\r\n    max-width: 380px;\r\n  }\r\n\r\n}\r\n\r\n\/* =========================================\r\n   MINSKAD R\u00d6RELSE\r\n========================================= *\/\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n\r\n  .ecolos-track,\r\n  .ecolos-slide-image,\r\n  .ecolos-arrow,\r\n  .ecolos-dot,\r\n  .ecolos-autoplay-toggle,\r\n  .ecolos-slider-link {\r\n    transition: none !important;\r\n  }\r\n\r\n  .ecolos-slide-card:hover .ecolos-slide-image,\r\n  .ecolos-autoplay-toggle:hover,\r\n  .ecolos-slider-link:hover {\r\n    transform: none;\r\n  }\r\n\r\n}\r\n\r\n<\/style>\r\n\r\n<script>\r\n(function () {\r\n\r\n  function initialiseEcolosSliders() {\r\n\r\n    const sliders = document.querySelectorAll(\r\n      \"[data-ecolos-slider]\"\r\n    );\r\n\r\n    sliders.forEach(function (slider) {\r\n\r\n      if (slider.dataset.initialised === \"true\") {\r\n        return;\r\n      }\r\n\r\n      slider.dataset.initialised = \"true\";\r\n\r\n      const track = slider.querySelector(\".ecolos-track\");\r\n\r\n      const slides = Array.from(\r\n        slider.querySelectorAll(\".ecolos-slide\")\r\n      );\r\n\r\n      const nextButton = slider.querySelector(\".ecolos-next\");\r\n      const previousButton = slider.querySelector(\".ecolos-prev\");\r\n      const dotsContainer = slider.querySelector(\".ecolos-dots\");\r\n      const autoplayButton = slider.querySelector(\r\n        \"[data-ecolos-autoplay]\"\r\n      );\r\n      const autoplayText = autoplayButton\r\n        ? autoplayButton.querySelector(\".ecolos-autoplay-text\")\r\n        : null;\r\n      const status = slider.querySelector(\".ecolos-slider-status\");\r\n      const carousel = slider.querySelector(\".ecolos-carousel\");\r\n\r\n      if (\r\n        !track ||\r\n        !slides.length ||\r\n        !nextButton ||\r\n        !previousButton ||\r\n        !dotsContainer ||\r\n        !autoplayButton ||\r\n        !carousel\r\n      ) {\r\n        return;\r\n      }\r\n\r\n      const reducedMotion = window.matchMedia(\r\n        \"(prefers-reduced-motion: reduce)\"\r\n      );\r\n\r\n      let currentIndex = 0;\r\n      let autoplayTimer = null;\r\n      let autoplayPausedByUser = reducedMotion.matches;\r\n      let pointerStartX = 0;\r\n      let pointerEndX = 0;\r\n      let interactionWasManual = false;\r\n\r\n      dotsContainer.innerHTML = \"\";\r\n\r\n      slides.forEach(function (slide, slideIndex) {\r\n\r\n        const dot = document.createElement(\"button\");\r\n\r\n        dot.type = \"button\";\r\n        dot.className = \"ecolos-dot\";\r\n\r\n        dot.setAttribute(\r\n          \"aria-label\",\r\n          \"Visa modul \" +\r\n          (slideIndex + 1) +\r\n          \" av \" +\r\n          slides.length\r\n        );\r\n\r\n        dot.setAttribute(\r\n          \"aria-controls\",\r\n          track.id\r\n        );\r\n\r\n        if (slideIndex === 0) {\r\n          dot.setAttribute(\"aria-current\", \"true\");\r\n        }\r\n\r\n        dot.addEventListener(\"click\", function () {\r\n\r\n          interactionWasManual = true;\r\n\r\n          goToSlide(slideIndex);\r\n          restartAutoplay();\r\n\r\n        });\r\n\r\n        dotsContainer.appendChild(dot);\r\n\r\n      });\r\n\r\n      const dots = Array.from(\r\n        dotsContainer.querySelectorAll(\".ecolos-dot\")\r\n      );\r\n\r\n      function updateSlider() {\r\n\r\n        track.style.transform =\r\n          \"translate3d(-\" +\r\n          currentIndex * 100 +\r\n          \"%, 0, 0)\";\r\n\r\n        slides.forEach(function (slide, slideIndex) {\r\n\r\n          const isActive =\r\n            slideIndex === currentIndex;\r\n\r\n          slide.setAttribute(\r\n            \"aria-hidden\",\r\n            isActive ? \"false\" : \"true\"\r\n          );\r\n\r\n        });\r\n\r\n        dots.forEach(function (dot, dotIndex) {\r\n\r\n          if (dotIndex === currentIndex) {\r\n\r\n            dot.setAttribute(\r\n              \"aria-current\",\r\n              \"true\"\r\n            );\r\n\r\n          } else {\r\n\r\n            dot.removeAttribute(\r\n              \"aria-current\"\r\n            );\r\n\r\n          }\r\n\r\n        });\r\n\r\n        if (status && interactionWasManual) {\r\n\r\n          status.textContent =\r\n            \"Visar modul \" +\r\n            (currentIndex + 1) +\r\n            \" av \" +\r\n            slides.length;\r\n\r\n        }\r\n\r\n      }\r\n\r\n      function updateAutoplayButton() {\r\n\r\n        autoplayButton.dataset.paused =\r\n          autoplayPausedByUser\r\n            ? \"true\"\r\n            : \"false\";\r\n\r\n        autoplayButton.setAttribute(\r\n          \"aria-pressed\",\r\n          autoplayPausedByUser\r\n            ? \"true\"\r\n            : \"false\"\r\n        );\r\n\r\n        autoplayButton.setAttribute(\r\n          \"aria-label\",\r\n          autoplayPausedByUser\r\n            ? \"Starta automatisk v\u00e4xling mellan bilder\"\r\n            : \"Pausa automatisk v\u00e4xling mellan bilder\"\r\n        );\r\n\r\n        if (autoplayText) {\r\n\r\n          autoplayText.textContent =\r\n            autoplayPausedByUser\r\n              ? \"Spela\"\r\n              : \"Pausa\";\r\n\r\n        }\r\n\r\n      }\r\n\r\n      function goToSlide(slideIndex) {\r\n\r\n        if (slideIndex < 0) {\r\n\r\n          currentIndex =\r\n            slides.length - 1;\r\n\r\n        } else if (\r\n          slideIndex >= slides.length\r\n        ) {\r\n\r\n          currentIndex = 0;\r\n\r\n        } else {\r\n\r\n          currentIndex = slideIndex;\r\n\r\n        }\r\n\r\n        updateSlider();\r\n\r\n      }\r\n\r\n      function showNextSlide(manual) {\r\n\r\n        interactionWasManual =\r\n          Boolean(manual);\r\n\r\n        goToSlide(currentIndex + 1);\r\n\r\n      }\r\n\r\n      function showPreviousSlide(manual) {\r\n\r\n        interactionWasManual =\r\n          Boolean(manual);\r\n\r\n        goToSlide(currentIndex - 1);\r\n\r\n      }\r\n\r\n      function stopAutoplay() {\r\n\r\n        if (!autoplayTimer) {\r\n          return;\r\n        }\r\n\r\n        window.clearInterval(\r\n          autoplayTimer\r\n        );\r\n\r\n        autoplayTimer = null;\r\n\r\n      }\r\n\r\n      function startAutoplay() {\r\n\r\n        stopAutoplay();\r\n\r\n        if (\r\n          autoplayPausedByUser ||\r\n          slides.length <= 1 ||\r\n          document.hidden\r\n        ) {\r\n          return;\r\n        }\r\n\r\n        autoplayTimer = window.setInterval(\r\n          function () {\r\n\r\n            interactionWasManual = false;\r\n\r\n            showNextSlide(false);\r\n\r\n          },\r\n          6500\r\n        );\r\n\r\n      }\r\n\r\n      function restartAutoplay() {\r\n\r\n        stopAutoplay();\r\n        startAutoplay();\r\n\r\n      }\r\n\r\n      nextButton.addEventListener(\r\n        \"click\",\r\n        function () {\r\n\r\n          showNextSlide(true);\r\n          restartAutoplay();\r\n\r\n        }\r\n      );\r\n\r\n      previousButton.addEventListener(\r\n        \"click\",\r\n        function () {\r\n\r\n          showPreviousSlide(true);\r\n          restartAutoplay();\r\n\r\n        }\r\n      );\r\n\r\n      autoplayButton.addEventListener(\r\n        \"click\",\r\n        function () {\r\n\r\n          autoplayPausedByUser =\r\n            !autoplayPausedByUser;\r\n\r\n          updateAutoplayButton();\r\n\r\n          if (autoplayPausedByUser) {\r\n\r\n            stopAutoplay();\r\n\r\n          } else {\r\n\r\n            startAutoplay();\r\n\r\n          }\r\n\r\n        }\r\n      );\r\n\r\n      carousel.addEventListener(\r\n        \"keydown\",\r\n        function (event) {\r\n\r\n          if (event.key === \"ArrowRight\") {\r\n\r\n            event.preventDefault();\r\n\r\n            showNextSlide(true);\r\n            restartAutoplay();\r\n\r\n          }\r\n\r\n          if (event.key === \"ArrowLeft\") {\r\n\r\n            event.preventDefault();\r\n\r\n            showPreviousSlide(true);\r\n            restartAutoplay();\r\n\r\n          }\r\n\r\n          if (event.key === \"Home\") {\r\n\r\n            event.preventDefault();\r\n\r\n            interactionWasManual = true;\r\n\r\n            goToSlide(0);\r\n            restartAutoplay();\r\n\r\n          }\r\n\r\n          if (event.key === \"End\") {\r\n\r\n            event.preventDefault();\r\n\r\n            interactionWasManual = true;\r\n\r\n            goToSlide(\r\n              slides.length - 1\r\n            );\r\n\r\n            restartAutoplay();\r\n\r\n          }\r\n\r\n        }\r\n      );\r\n\r\n      carousel.addEventListener(\r\n        \"pointerdown\",\r\n        function (event) {\r\n\r\n          if (\r\n            event.pointerType === \"mouse\"\r\n          ) {\r\n            return;\r\n          }\r\n\r\n          pointerStartX = event.clientX;\r\n          pointerEndX = event.clientX;\r\n\r\n        },\r\n        { passive: true }\r\n      );\r\n\r\n      carousel.addEventListener(\r\n        \"pointermove\",\r\n        function (event) {\r\n\r\n          if (\r\n            event.pointerType === \"mouse\"\r\n          ) {\r\n            return;\r\n          }\r\n\r\n          pointerEndX = event.clientX;\r\n\r\n        },\r\n        { passive: true }\r\n      );\r\n\r\n      carousel.addEventListener(\r\n        \"pointerup\",\r\n        function (event) {\r\n\r\n          if (\r\n            event.pointerType === \"mouse\"\r\n          ) {\r\n            return;\r\n          }\r\n\r\n          const distance =\r\n            pointerStartX - pointerEndX;\r\n\r\n          if (\r\n            Math.abs(distance) < 45\r\n          ) {\r\n            return;\r\n          }\r\n\r\n          if (distance > 0) {\r\n\r\n            showNextSlide(true);\r\n\r\n          } else {\r\n\r\n            showPreviousSlide(true);\r\n\r\n          }\r\n\r\n          restartAutoplay();\r\n\r\n        },\r\n        { passive: true }\r\n      );\r\n\r\n      slider.addEventListener(\r\n        \"mouseenter\",\r\n        stopAutoplay\r\n      );\r\n\r\n      slider.addEventListener(\r\n        \"mouseleave\",\r\n        startAutoplay\r\n      );\r\n\r\n      slider.addEventListener(\r\n        \"focusin\",\r\n        stopAutoplay\r\n      );\r\n\r\n      slider.addEventListener(\r\n        \"focusout\",\r\n        function (event) {\r\n\r\n          if (\r\n            !slider.contains(\r\n              event.relatedTarget\r\n            )\r\n          ) {\r\n            startAutoplay();\r\n          }\r\n\r\n        }\r\n      );\r\n\r\n      document.addEventListener(\r\n        \"visibilitychange\",\r\n        function () {\r\n\r\n          if (document.hidden) {\r\n\r\n            stopAutoplay();\r\n\r\n          } else {\r\n\r\n            startAutoplay();\r\n\r\n          }\r\n\r\n        }\r\n      );\r\n\r\n      if (\r\n        typeof reducedMotion.addEventListener ===\r\n        \"function\"\r\n      ) {\r\n\r\n        reducedMotion.addEventListener(\r\n          \"change\",\r\n          function (event) {\r\n\r\n            if (event.matches) {\r\n\r\n              autoplayPausedByUser = true;\r\n\r\n              stopAutoplay();\r\n              updateAutoplayButton();\r\n\r\n            }\r\n\r\n          }\r\n        );\r\n\r\n      }\r\n\r\n      if (slides.length <= 1) {\r\n\r\n        nextButton.hidden = true;\r\n        previousButton.hidden = true;\r\n        dotsContainer.hidden = true;\r\n        autoplayButton.hidden = true;\r\n\r\n      }\r\n\r\n      updateSlider();\r\n      updateAutoplayButton();\r\n      startAutoplay();\r\n\r\n    });\r\n\r\n  }\r\n\r\n  if (document.readyState === \"loading\") {\r\n\r\n    document.addEventListener(\r\n      \"DOMContentLoaded\",\r\n      initialiseEcolosSliders\r\n    );\r\n\r\n  } else {\r\n\r\n    initialiseEcolosSliders();\r\n\r\n  }\r\n\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-3ccf512 e-con-full e-flex e-con e-parent\" data-id=\"3ccf512\" data-element_type=\"container\" data-e-type=\"container\" data-no-translation=\"\">\n\t\t\t\t<div class=\"elementor-element elementor-element-151dced elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"151dced\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- ===== Ecolos+ Aff\u00e4rsf\u00f6rdelar \u2013 Svensk version ===== -->\r\n\r\n<section\r\n  class=\"ec-benefits\"\r\n  aria-labelledby=\"ec-benefits-title\"\r\n>\r\n  <span\r\n    class=\"ec-benefits-glow ec-benefits-glow--one\"\r\n    aria-hidden=\"true\"\r\n  ><\/span>\r\n\r\n  <span\r\n    class=\"ec-benefits-glow ec-benefits-glow--two\"\r\n    aria-hidden=\"true\"\r\n  ><\/span>\r\n\r\n  <span\r\n    class=\"ec-benefits-grid\"\r\n    aria-hidden=\"true\"\r\n  ><\/span>\r\n\r\n  <div class=\"ec-benefits-container\">\r\n\r\n    <!-- Rubrik -->\r\n    <header class=\"ec-benefits-header\">\r\n\r\n      <p class=\"ec-benefits-eyebrow\">\r\n        Aff\u00e4rsnytta\r\n      <\/p>\r\n\r\n      <h2 id=\"ec-benefits-title\">\r\n        G\u00f6r leveransverksamheten till en konkurrensf\u00f6rdel\r\n      <\/h2>\r\n\r\n      <p class=\"ec-benefits-intro\">\r\n        Ecolos+ hj\u00e4lper leveransteam att minska operativt merarbete,\r\n        f\u00f6rb\u00e4ttra \u00f6verblicken och hantera v\u00e4xande leveransvolymer genom\r\n        sammankopplade kontrollpaneler, mobilappar och API-tj\u00e4nster.\r\n      <\/p>\r\n\r\n    <\/header>\r\n\r\n    <!-- F\u00f6rdelar -->\r\n    <ul class=\"ec-benefits-list\">\r\n\r\n      <!-- F\u00f6rdel 1 -->\r\n      <li class=\"ec-benefit-card\">\r\n\r\n        <div\r\n          class=\"ec-benefit-icon\"\r\n          aria-hidden=\"true\"\r\n        >\r\n          <svg\r\n            viewBox=\"0 0 24 24\"\r\n            width=\"26\"\r\n            height=\"26\"\r\n            fill=\"none\"\r\n            xmlns=\"http:\/\/www.w3.org\/2000\/svg\"\r\n          >\r\n            <circle\r\n              cx=\"6\"\r\n              cy=\"17\"\r\n              r=\"2\"\r\n              stroke=\"currentColor\"\r\n              stroke-width=\"1.8\"\r\n            \/>\r\n\r\n            <circle\r\n              cx=\"18\"\r\n              cy=\"7\"\r\n              r=\"2\"\r\n              stroke=\"currentColor\"\r\n              stroke-width=\"1.8\"\r\n            \/>\r\n\r\n            <path\r\n              d=\"M7.7 15.9C9.7 14.8 10.8 13.1 11 10.7C11.3 8.1 13.1 7 16 7\"\r\n              stroke=\"currentColor\"\r\n              stroke-width=\"1.8\"\r\n              stroke-linecap=\"round\"\r\n            \/>\r\n\r\n            <path\r\n              d=\"M13.7 4.8L16.2 7L14 9.5\"\r\n              stroke=\"currentColor\"\r\n              stroke-width=\"1.8\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\"\r\n            \/>\r\n          <\/svg>\r\n        <\/div>\r\n\r\n        <h3>\r\n          Effektivare och mer f\u00f6ruts\u00e4gbara rutter\r\n        <\/h3>\r\n\r\n        <p>\r\n          Anv\u00e4nd intelligent ruttplanering f\u00f6r att minska on\u00f6diga\r\n          k\u00f6rstr\u00e4ckor, f\u00f6rb\u00e4ttra stoppordningen och skapa j\u00e4mnare\r\n          dagliga leveransfl\u00f6den.\r\n        <\/p>\r\n\r\n      <\/li>\r\n\r\n      <!-- F\u00f6rdel 2 -->\r\n      <li class=\"ec-benefit-card\">\r\n\r\n        <div\r\n          class=\"ec-benefit-icon\"\r\n          aria-hidden=\"true\"\r\n        >\r\n          <svg\r\n            viewBox=\"0 0 24 24\"\r\n            width=\"26\"\r\n            height=\"26\"\r\n            fill=\"none\"\r\n            xmlns=\"http:\/\/www.w3.org\/2000\/svg\"\r\n          >\r\n            <circle\r\n              cx=\"12\"\r\n              cy=\"12\"\r\n              r=\"8\"\r\n              stroke=\"currentColor\"\r\n              stroke-width=\"1.8\"\r\n            \/>\r\n\r\n            <path\r\n              d=\"M15.5 8.8C14.7 8.2 13.7 7.9 12.6 7.9C10.7 7.9 9.2 9 9.2 10.4C9.2 11.8 10.5 12.4 12.4 12.8C14.4 13.2 15.4 13.8 15.4 15.1C15.4 16.6 13.9 17.5 12 17.5C10.7 17.5 9.5 17.1 8.6 16.4\"\r\n              stroke=\"currentColor\"\r\n              stroke-width=\"1.7\"\r\n              stroke-linecap=\"round\"\r\n            \/>\r\n\r\n            <path\r\n              d=\"M12 6.5V18.5\"\r\n              stroke=\"currentColor\"\r\n              stroke-width=\"1.7\"\r\n              stroke-linecap=\"round\"\r\n            \/>\r\n          <\/svg>\r\n        <\/div>\r\n\r\n        <h3>\r\n          L\u00e4gre operativa kostnader\r\n        <\/h3>\r\n\r\n        <p>\r\n          Minska manuell planering, undvik ineffektiva ruttval och\r\n          anv\u00e4nd fordon, f\u00f6rare och andra resurser mer effektivt i\r\n          den dagliga verksamheten.\r\n        <\/p>\r\n\r\n      <\/li>\r\n\r\n      <!-- F\u00f6rdel 3 -->\r\n      <li class=\"ec-benefit-card\">\r\n\r\n        <div\r\n          class=\"ec-benefit-icon\"\r\n          aria-hidden=\"true\"\r\n        >\r\n          <svg\r\n            viewBox=\"0 0 24 24\"\r\n            width=\"26\"\r\n            height=\"26\"\r\n            fill=\"none\"\r\n            xmlns=\"http:\/\/www.w3.org\/2000\/svg\"\r\n          >\r\n            <path\r\n              d=\"M4 5.8C4 4.8 4.8 4 5.8 4H18.2C19.2 4 20 4.8 20 5.8V14.2C20 15.2 19.2 16 18.2 16H10L5.5 20V16H5.8C4.8 16 4 15.2 4 14.2V5.8Z\"\r\n              stroke=\"currentColor\"\r\n              stroke-width=\"1.8\"\r\n              stroke-linejoin=\"round\"\r\n            \/>\r\n\r\n            <path\r\n              d=\"M8 10H8.01M12 10H12.01M16 10H16.01\"\r\n              stroke=\"currentColor\"\r\n              stroke-width=\"2.3\"\r\n              stroke-linecap=\"round\"\r\n            \/>\r\n          <\/svg>\r\n        <\/div>\r\n\r\n        <h3>\r\n          En b\u00e4ttre mottagarupplevelse\r\n        <\/h3>\r\n\r\n        <p>\r\n          Ge mottagare tydligare leveransinformation, aktuella\r\n          statusuppdateringar och b\u00e4ttre insyn fr\u00e5n utskick till\r\n          slutf\u00f6rd leverans.\r\n        <\/p>\r\n\r\n      <\/li>\r\n\r\n      <!-- F\u00f6rdel 4 -->\r\n      <li class=\"ec-benefit-card\">\r\n\r\n        <div\r\n          class=\"ec-benefit-icon\"\r\n          aria-hidden=\"true\"\r\n        >\r\n          <svg\r\n            viewBox=\"0 0 24 24\"\r\n            width=\"26\"\r\n            height=\"26\"\r\n            fill=\"none\"\r\n            xmlns=\"http:\/\/www.w3.org\/2000\/svg\"\r\n          >\r\n            <path\r\n              d=\"M4 8L12 4L20 8L12 12L4 8Z\"\r\n              stroke=\"currentColor\"\r\n              stroke-width=\"1.8\"\r\n              stroke-linejoin=\"round\"\r\n            \/>\r\n\r\n            <path\r\n              d=\"M4 12L12 16L20 12\"\r\n              stroke=\"currentColor\"\r\n              stroke-width=\"1.8\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\"\r\n            \/>\r\n\r\n            <path\r\n              d=\"M4 16L12 20L20 16\"\r\n              stroke=\"currentColor\"\r\n              stroke-width=\"1.8\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\"\r\n            \/>\r\n          <\/svg>\r\n        <\/div>\r\n\r\n        <h3>\r\n          Skalbar leveransverksamhet\r\n        <\/h3>\r\n\r\n        <p>\r\n          Hantera fler order, kurirer, hubbar och leveransomr\u00e5den\r\n          utan att beh\u00f6va bygga om hela det befintliga operativa\r\n          arbetsfl\u00f6det.\r\n        <\/p>\r\n\r\n      <\/li>\r\n\r\n      <!-- F\u00f6rdel 5 -->\r\n      <li class=\"ec-benefit-card\">\r\n\r\n        <div\r\n          class=\"ec-benefit-icon\"\r\n          aria-hidden=\"true\"\r\n        >\r\n          <svg\r\n            viewBox=\"0 0 24 24\"\r\n            width=\"26\"\r\n            height=\"26\"\r\n            fill=\"none\"\r\n            xmlns=\"http:\/\/www.w3.org\/2000\/svg\"\r\n          >\r\n            <path\r\n              d=\"M5 20V12\"\r\n              stroke=\"currentColor\"\r\n              stroke-width=\"1.8\"\r\n              stroke-linecap=\"round\"\r\n            \/>\r\n\r\n            <path\r\n              d=\"M10 20V8\"\r\n              stroke=\"currentColor\"\r\n              stroke-width=\"1.8\"\r\n              stroke-linecap=\"round\"\r\n            \/>\r\n\r\n            <path\r\n              d=\"M15 20V14\"\r\n              stroke=\"currentColor\"\r\n              stroke-width=\"1.8\"\r\n              stroke-linecap=\"round\"\r\n            \/>\r\n\r\n            <path\r\n              d=\"M20 20V4\"\r\n              stroke=\"currentColor\"\r\n              stroke-width=\"1.8\"\r\n              stroke-linecap=\"round\"\r\n            \/>\r\n\r\n            <path\r\n              d=\"M3 20H21\"\r\n              stroke=\"currentColor\"\r\n              stroke-width=\"1.8\"\r\n              stroke-linecap=\"round\"\r\n            \/>\r\n          <\/svg>\r\n        <\/div>\r\n\r\n        <h3>\r\n          Anv\u00e4ndbara insikter fr\u00e5n leveransdata\r\n        <\/h3>\r\n\r\n        <p>\r\n          F\u00f6lj ruttprestanda, leveranseffektivitet, kostnader och\r\n          operativa trender genom tydliga kontrollpaneler och\r\n          m\u00e4tbara nyckeltal.\r\n        <\/p>\r\n\r\n      <\/li>\r\n\r\n      <!-- F\u00f6rdel 6 -->\r\n      <li class=\"ec-benefit-card\">\r\n\r\n        <div\r\n          class=\"ec-benefit-icon\"\r\n          aria-hidden=\"true\"\r\n        >\r\n          <svg\r\n            viewBox=\"0 0 24 24\"\r\n            width=\"26\"\r\n            height=\"26\"\r\n            fill=\"none\"\r\n            xmlns=\"http:\/\/www.w3.org\/2000\/svg\"\r\n          >\r\n            <rect\r\n              x=\"3\"\r\n              y=\"6\"\r\n              width=\"18\"\r\n              height=\"12\"\r\n              rx=\"2.5\"\r\n              stroke=\"currentColor\"\r\n              stroke-width=\"1.8\"\r\n            \/>\r\n\r\n            <path\r\n              d=\"M3 10H21\"\r\n              stroke=\"currentColor\"\r\n              stroke-width=\"1.8\"\r\n            \/>\r\n\r\n            <path\r\n              d=\"M7 14H10\"\r\n              stroke=\"currentColor\"\r\n              stroke-width=\"1.8\"\r\n              stroke-linecap=\"round\"\r\n            \/>\r\n          <\/svg>\r\n        <\/div>\r\n\r\n        <h3>\r\n          Flexibel anv\u00e4ndningsbaserad prismodell\r\n        <\/h3>\r\n\r\n        <p>\r\n          Anpassa plattformskostnaden efter leveransvolym och faktisk\r\n          anv\u00e4ndning, s\u00e5 att prismodellen kan f\u00f6lja verksamhetens\r\n          utveckling.\r\n        <\/p>\r\n\r\n      <\/li>\r\n\r\n    <\/ul>\r\n\r\n    <!-- CTA -->\r\n    <div class=\"ec-benefits-action\">\r\n\r\n      <div class=\"ec-benefits-action-text\">\r\n\r\n        <h3>\r\n          Se hur Ecolos+ passar in i ert leveransfl\u00f6de\r\n        <\/h3>\r\n\r\n        <p>\r\n          Ber\u00e4tta om era leveransvolymer, nuvarande arbetss\u00e4tt och\r\n          integrationsbehov s\u00e5 g\u00e5r vi igenom m\u00f6jliga l\u00f6sningar tillsammans.\r\n        <\/p>\r\n\r\n      <\/div>\r\n\r\n      <a\r\n        href=\"\/sv\/lets-talk\/\"\r\n        class=\"ec-benefits-button\"\r\n        aria-label=\"Boka ett kostnadsfritt introduktionsm\u00f6te om Ecolos Plus\"\r\n      >\r\n        Boka ett kostnadsfritt m\u00f6te\r\n\r\n        <span aria-hidden=\"true\">\r\n          \u2192\r\n        <\/span>\r\n      <\/a>\r\n\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n\r\n\/* =========================================\r\n   ECOLOS+ AFF\u00c4RSF\u00d6RDELAR\r\n========================================= *\/\r\n\r\n.ec-benefits,\r\n.ec-benefits * {\r\n  box-sizing: border-box;\r\n}\r\n\r\n.ec-benefits {\r\n  position: relative;\r\n  isolation: isolate;\r\n\r\n  width: 100vw;\r\n  max-width: 100vw;\r\n\r\n  margin-left: calc(50% - 50vw);\r\n  padding: clamp(82px, 9vw, 125px) 0;\r\n\r\n  overflow: hidden;\r\n\r\n  color: #ffffff;\r\n\r\n  background:\r\n    linear-gradient(\r\n      145deg,\r\n      #070b14 0%,\r\n      #0a1020 48%,\r\n      #080d18 100%\r\n    );\r\n}\r\n\r\n.ec-benefits-container {\r\n  position: relative;\r\n  z-index: 3;\r\n\r\n  width: 100%;\r\n  max-width: 1440px;\r\n\r\n  margin: 0 auto;\r\n  padding: 0 clamp(20px, 4vw, 54px);\r\n}\r\n\r\n\/* =========================================\r\n   RUBRIK\r\n========================================= *\/\r\n\r\n.ec-benefits-header {\r\n  max-width: 860px;\r\n\r\n  margin: 0 auto clamp(48px, 6vw, 72px);\r\n\r\n  text-align: center;\r\n}\r\n\r\n.ec-benefits-eyebrow {\r\n  margin: 0 0 16px;\r\n\r\n  color: #67e8f9;\r\n\r\n  font-size: 12px;\r\n  font-weight: 750;\r\n  line-height: 1.3;\r\n  letter-spacing: 0.1em;\r\n  text-transform: uppercase;\r\n}\r\n\r\n.ec-benefits h2 {\r\n  margin: 0 0 21px;\r\n\r\n  color: #ffffff;\r\n\r\n  font-size: clamp(38px, 5vw, 62px);\r\n  font-weight: 760;\r\n  line-height: 1.07;\r\n  letter-spacing: -0.04em;\r\n\r\n  text-wrap: balance;\r\n}\r\n\r\n.ec-benefits-intro {\r\n  max-width: 780px;\r\n\r\n  margin: 0 auto;\r\n\r\n  color: #aebbd0;\r\n\r\n  font-size: clamp(16px, 1.5vw, 18px);\r\n  line-height: 1.75;\r\n\r\n  text-wrap: pretty;\r\n}\r\n\r\n\/* =========================================\r\n   KORTGRID\r\n========================================= *\/\r\n\r\n.ec-benefits-list {\r\n  display: grid;\r\n  grid-template-columns: repeat(3, minmax(0, 1fr));\r\n\r\n  margin: 0;\r\n  padding: 0;\r\n\r\n  gap: 24px;\r\n\r\n  list-style: none;\r\n}\r\n\r\n\/* =========================================\r\n   F\u00d6RDELSKORT\r\n========================================= *\/\r\n\r\n.ec-benefit-card {\r\n  position: relative;\r\n\r\n  min-height: 310px;\r\n\r\n  padding: clamp(28px, 3vw, 39px);\r\n\r\n  overflow: hidden;\r\n\r\n  border: 1px solid rgba(148, 163, 184, 0.16);\r\n  border-radius: 25px;\r\n\r\n  background:\r\n    linear-gradient(\r\n      145deg,\r\n      rgba(30, 41, 59, 0.72),\r\n      rgba(15, 23, 42, 0.78)\r\n    );\r\n\r\n  box-shadow:\r\n    0 12px 34px rgba(0, 0, 0, 0.13),\r\n    inset 0 1px 0 rgba(255, 255, 255, 0.035);\r\n\r\n  backdrop-filter: blur(12px);\r\n  -webkit-backdrop-filter: blur(12px);\r\n\r\n  transition:\r\n    transform 0.28s ease,\r\n    border-color 0.28s ease,\r\n    box-shadow 0.28s ease;\r\n}\r\n\r\n.ec-benefit-card::after {\r\n  content: \"\";\r\n\r\n  position: absolute;\r\n\r\n  top: -90px;\r\n  right: -85px;\r\n\r\n  width: 180px;\r\n  height: 180px;\r\n\r\n  border-radius: 50%;\r\n\r\n  background:\r\n    radial-gradient(\r\n      circle,\r\n      rgba(34, 211, 238, 0.12),\r\n      transparent 70%\r\n    );\r\n\r\n  pointer-events: none;\r\n}\r\n\r\n.ec-benefit-card:hover {\r\n  transform: translateY(-7px);\r\n\r\n  border-color: rgba(34, 211, 238, 0.36);\r\n\r\n  box-shadow:\r\n    0 23px 54px rgba(0, 0, 0, 0.23),\r\n    0 0 34px rgba(34, 211, 238, 0.055);\r\n}\r\n\r\n\/* =========================================\r\n   IKON\r\n========================================= *\/\r\n\r\n.ec-benefit-icon {\r\n  position: relative;\r\n  z-index: 1;\r\n\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  width: 58px;\r\n  height: 58px;\r\n\r\n  margin-bottom: 27px;\r\n\r\n  border: 1px solid rgba(103, 232, 249, 0.17);\r\n  border-radius: 18px;\r\n\r\n  background:\r\n    linear-gradient(\r\n      145deg,\r\n      rgba(34, 211, 238, 0.15),\r\n      rgba(59, 130, 246, 0.09)\r\n    );\r\n\r\n  color: #67e8f9;\r\n\r\n  box-shadow:\r\n    inset 0 1px 0 rgba(255, 255, 255, 0.06),\r\n    0 12px 27px rgba(6, 182, 212, 0.08);\r\n}\r\n\r\n\/* =========================================\r\n   KORTINNEH\u00c5LL\r\n========================================= *\/\r\n\r\n.ec-benefit-card h3 {\r\n  position: relative;\r\n  z-index: 1;\r\n\r\n  margin: 0 0 13px;\r\n\r\n  color: #f8fafc;\r\n\r\n  font-size: 21px;\r\n  font-weight: 710;\r\n  line-height: 1.35;\r\n  letter-spacing: -0.015em;\r\n}\r\n\r\n.ec-benefit-card p {\r\n  position: relative;\r\n  z-index: 1;\r\n\r\n  margin: 0;\r\n\r\n  color: #9ba9bd;\r\n\r\n  font-size: 15.5px;\r\n  line-height: 1.72;\r\n}\r\n\r\n\/* =========================================\r\n   CTA\r\n========================================= *\/\r\n\r\n.ec-benefits-action {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n\r\n  margin-top: clamp(42px, 6vw, 66px);\r\n  padding: clamp(25px, 4vw, 38px);\r\n\r\n  gap: 28px;\r\n\r\n  border: 1px solid rgba(125, 211, 252, 0.17);\r\n  border-radius: 25px;\r\n\r\n  background:\r\n    linear-gradient(\r\n      110deg,\r\n      rgba(37, 99, 235, 0.14),\r\n      rgba(124, 58, 237, 0.08),\r\n      rgba(6, 182, 212, 0.09)\r\n    );\r\n\r\n  box-shadow:\r\n    inset 0 1px 0 rgba(255, 255, 255, 0.045);\r\n}\r\n\r\n.ec-benefits-action-text {\r\n  max-width: 760px;\r\n}\r\n\r\n.ec-benefits-action h3 {\r\n  margin: 0 0 8px;\r\n\r\n  color: #ffffff;\r\n\r\n  font-size: clamp(21px, 2.3vw, 28px);\r\n  font-weight: 720;\r\n  line-height: 1.3;\r\n}\r\n\r\n.ec-benefits-action p {\r\n  margin: 0;\r\n\r\n  color: #aebbd0;\r\n\r\n  font-size: 15.5px;\r\n  line-height: 1.65;\r\n}\r\n\r\n.ec-benefits-button {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  min-width: 220px;\r\n  min-height: 54px;\r\n\r\n  padding: 15px 23px;\r\n\r\n  gap: 9px;\r\n\r\n  flex: 0 0 auto;\r\n\r\n  border: 1px solid rgba(255, 255, 255, 0.12);\r\n  border-radius: 13px;\r\n\r\n  background:\r\n    linear-gradient(\r\n      135deg,\r\n      #0891b2,\r\n      #2563eb,\r\n      #4f46e5\r\n    );\r\n\r\n  color: #ffffff !important;\r\n\r\n  font-size: 15px;\r\n  font-weight: 700;\r\n  line-height: 1.25;\r\n  text-align: center;\r\n  text-decoration: none !important;\r\n\r\n  box-shadow:\r\n    0 13px 31px rgba(37, 99, 235, 0.24),\r\n    inset 0 1px 0 rgba(255, 255, 255, 0.13);\r\n\r\n  transition:\r\n    transform 0.23s ease,\r\n    box-shadow 0.23s ease,\r\n    background 0.23s ease;\r\n}\r\n\r\n.ec-benefits-button:hover {\r\n  transform: translateY(-3px);\r\n\r\n  color: #ffffff !important;\r\n\r\n  background:\r\n    linear-gradient(\r\n      135deg,\r\n      #06b6d4,\r\n      #3b82f6,\r\n      #6366f1\r\n    );\r\n\r\n  box-shadow:\r\n    0 18px 38px rgba(37, 99, 235, 0.31);\r\n}\r\n\r\n.ec-benefits-button:focus-visible {\r\n  outline: 3px solid rgba(103, 232, 249, 0.75);\r\n  outline-offset: 5px;\r\n}\r\n\r\n\/* =========================================\r\n   BAKGRUNDSDEKORATION\r\n========================================= *\/\r\n\r\n.ec-benefits-glow {\r\n  position: absolute;\r\n  z-index: 0;\r\n\r\n  display: block;\r\n\r\n  border-radius: 50%;\r\n\r\n  pointer-events: none;\r\n}\r\n\r\n.ec-benefits-glow--one {\r\n  top: -240px;\r\n  right: -170px;\r\n\r\n  width: 600px;\r\n  height: 600px;\r\n\r\n  background:\r\n    radial-gradient(\r\n      circle,\r\n      rgba(34, 211, 238, 0.13),\r\n      transparent 67%\r\n    );\r\n}\r\n\r\n.ec-benefits-glow--two {\r\n  bottom: -260px;\r\n  left: -210px;\r\n\r\n  width: 620px;\r\n  height: 620px;\r\n\r\n  background:\r\n    radial-gradient(\r\n      circle,\r\n      rgba(99, 102, 241, 0.12),\r\n      transparent 67%\r\n    );\r\n}\r\n\r\n.ec-benefits-grid {\r\n  position: absolute;\r\n  z-index: 0;\r\n\r\n  inset: 0;\r\n\r\n  background-image:\r\n    linear-gradient(\r\n      rgba(148, 163, 184, 0.025) 1px,\r\n      transparent 1px\r\n    ),\r\n    linear-gradient(\r\n      90deg,\r\n      rgba(148, 163, 184, 0.025) 1px,\r\n      transparent 1px\r\n    );\r\n\r\n  background-size: 48px 48px;\r\n\r\n  pointer-events: none;\r\n\r\n  mask-image:\r\n    linear-gradient(\r\n      to bottom,\r\n      transparent,\r\n      #000 18%,\r\n      #000 82%,\r\n      transparent\r\n    );\r\n\r\n  -webkit-mask-image:\r\n    linear-gradient(\r\n      to bottom,\r\n      transparent,\r\n      #000 18%,\r\n      #000 82%,\r\n      transparent\r\n    );\r\n}\r\n\r\n\/* =========================================\r\n   SURFPLATTA\r\n========================================= *\/\r\n\r\n@media (max-width: 1024px) {\r\n\r\n  .ec-benefits-list {\r\n    grid-template-columns: repeat(2, minmax(0, 1fr));\r\n  }\r\n\r\n  .ec-benefit-card {\r\n    min-height: 285px;\r\n  }\r\n\r\n}\r\n\r\n\/* =========================================\r\n   MOBIL\r\n========================================= *\/\r\n\r\n@media (max-width: 650px) {\r\n\r\n  .ec-benefits {\r\n    padding: 72px 0;\r\n  }\r\n\r\n  .ec-benefits-container {\r\n    padding: 0 17px;\r\n  }\r\n\r\n  .ec-benefits-header {\r\n    margin-bottom: 38px;\r\n  }\r\n\r\n  .ec-benefits h2 {\r\n    font-size: 36px;\r\n    line-height: 1.12;\r\n  }\r\n\r\n  .ec-benefits-intro {\r\n    font-size: 15.5px;\r\n    line-height: 1.7;\r\n  }\r\n\r\n  .ec-benefits-list {\r\n    grid-template-columns: 1fr;\r\n\r\n    gap: 18px;\r\n  }\r\n\r\n  .ec-benefit-card {\r\n    min-height: auto;\r\n\r\n    padding: 27px 24px;\r\n\r\n    border-radius: 21px;\r\n  }\r\n\r\n  .ec-benefit-icon {\r\n    width: 53px;\r\n    height: 53px;\r\n\r\n    margin-bottom: 22px;\r\n\r\n    border-radius: 16px;\r\n  }\r\n\r\n  .ec-benefit-card h3 {\r\n    font-size: 20px;\r\n  }\r\n\r\n  .ec-benefit-card p {\r\n    font-size: 15px;\r\n  }\r\n\r\n  .ec-benefits-action {\r\n    align-items: stretch;\r\n    flex-direction: column;\r\n\r\n    padding: 25px 22px;\r\n\r\n    border-radius: 21px;\r\n\r\n    text-align: center;\r\n  }\r\n\r\n  .ec-benefits-button {\r\n    width: 100%;\r\n    min-width: 0;\r\n  }\r\n\r\n}\r\n\r\n\/* =========================================\r\n   MINSKAD R\u00d6RELSE\r\n========================================= *\/\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n\r\n  .ec-benefit-card,\r\n  .ec-benefits-button {\r\n    transition: none !important;\r\n  }\r\n\r\n  .ec-benefit-card:hover,\r\n  .ec-benefits-button:hover {\r\n    transform: none;\r\n  }\r\n\r\n}\r\n\r\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-80aabc0 e-con-full e-flex e-con e-parent\" data-id=\"80aabc0\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a4fd736 elementor-widget elementor-widget-html\" data-id=\"a4fd736\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- ===== Ecolos+ Video Overview Section ===== -->\r\n\r\n<section\r\n  class=\"ec-video\"\r\n  aria-labelledby=\"ec-video-title\"\r\n>\r\n  <span class=\"ec-video-glow ec-video-glow--one\" aria-hidden=\"true\"><\/span>\r\n  <span class=\"ec-video-glow ec-video-glow--two\" aria-hidden=\"true\"><\/span>\r\n  <span class=\"ec-video-grid\" aria-hidden=\"true\"><\/span>\r\n\r\n  <div class=\"ec-video-container\">\r\n\r\n    <!-- Section heading -->\r\n    <header class=\"ec-video-header\">\r\n\r\n      <p class=\"ec-video-eyebrow\">\r\n        Platform Overview\r\n      <\/p>\r\n\r\n      <h2 id=\"ec-video-title\">\r\n        See How Ecolos+ Supports Smarter Delivery Operations\r\n      <\/h2>\r\n\r\n      <p class=\"ec-video-intro\">\r\n        Watch a short overview of how Ecolos+ connects route planning,\r\n        operational dashboards, courier workflows, and delivery tracking\r\n        within one last-mile delivery platform.\r\n      <\/p>\r\n\r\n    <\/header>\r\n\r\n    <!-- Lightweight video player -->\r\n    <div\r\n      class=\"ec-video-player\"\r\n      data-ec-video\r\n      data-video-id=\"SReWhxWomeY\"\r\n    >\r\n\r\n      <button\r\n        type=\"button\"\r\n        class=\"ec-video-poster\"\r\n        aria-label=\"Play the Ecolos Plus platform overview video\"\r\n        aria-describedby=\"ec-video-description\"\r\n      >\r\n\r\n        <img loading=\"lazy\"\r\n          src=\"https:\/\/i.ytimg.com\/vi\/SReWhxWomeY\/hqdefault.jpg\"\r\n          alt=\"\"\r\n          width=\"1280\"\r\n          height=\"720\"\r\n          loading=\"lazy\"\r\n          decoding=\"async\"\r\n          fetchpriority=\"low\"\r\n          class=\"ec-video-thumbnail\"\r\n        >\r\n\r\n        <span class=\"ec-video-overlay\" aria-hidden=\"true\"><\/span>\r\n\r\n        <span class=\"ec-video-play\" aria-hidden=\"true\">\r\n\r\n          <svg\r\n            viewBox=\"0 0 24 24\"\r\n            width=\"34\"\r\n            height=\"34\"\r\n            fill=\"none\"\r\n            xmlns=\"http:\/\/www.w3.org\/2000\/svg\"\r\n          >\r\n            <path\r\n              d=\"M9 7.2V16.8L17 12L9 7.2Z\"\r\n              fill=\"currentColor\"\r\n              stroke=\"currentColor\"\r\n              stroke-width=\"1.5\"\r\n              stroke-linejoin=\"round\"\r\n            \/>\r\n          <\/svg>\r\n\r\n        <\/span>\r\n\r\n        <span class=\"ec-video-poster-content\" aria-hidden=\"true\">\r\n\r\n          <span class=\"ec-video-poster-label\">\r\n            Ecolos+ Platform Overview\r\n          <\/span>\r\n\r\n          <span class=\"ec-video-poster-text\">\r\n            See the platform in action\r\n          <\/span>\r\n\r\n        <\/span>\r\n\r\n      <\/button>\r\n\r\n      <noscript>\r\n        <p class=\"ec-video-noscript\">\r\n          JavaScript is required to play the embedded video.\r\n          <a\r\n            href=\"https:\/\/www.youtube.com\/watch?v=SReWhxWomeY\"\r\n            target=\"_blank\"\r\n            rel=\"noopener noreferrer\"\r\n          >\r\n            Watch the Ecolos+ video on YouTube\r\n          <\/a>.\r\n        <\/p>\r\n      <\/noscript>\r\n\r\n    <\/div>\r\n\r\n    <!-- Supporting text for users and search engines -->\r\n    <div\r\n      class=\"ec-video-details\"\r\n      id=\"ec-video-description\"\r\n    >\r\n\r\n      <p>\r\n        The video introduces the connected tools available within Ecolos+,\r\n        including delivery planning, operational management, mobile courier\r\n        workflows, recipient communication, and performance visibility.\r\n      <\/p>\r\n\r\n      <ul class=\"ec-video-topics\" aria-label=\"Topics covered in the video\">\r\n\r\n        <li>\r\n          <span class=\"ec-video-topic-icon\" aria-hidden=\"true\">\r\n            <svg\r\n              viewBox=\"0 0 24 24\"\r\n              width=\"18\"\r\n              height=\"18\"\r\n              fill=\"none\"\r\n            >\r\n              <circle\r\n                cx=\"6\"\r\n                cy=\"17\"\r\n                r=\"2\"\r\n                stroke=\"currentColor\"\r\n                stroke-width=\"1.8\"\r\n              \/>\r\n              <circle\r\n                cx=\"18\"\r\n                cy=\"7\"\r\n                r=\"2\"\r\n                stroke=\"currentColor\"\r\n                stroke-width=\"1.8\"\r\n              \/>\r\n              <path\r\n                d=\"M7.7 15.8C10.2 14.3 10.4 11.6 11 9.8C11.7 7.8 13.6 7 16 7\"\r\n                stroke=\"currentColor\"\r\n                stroke-width=\"1.8\"\r\n                stroke-linecap=\"round\"\r\n              \/>\r\n            <\/svg>\r\n          <\/span>\r\n\r\n          Route planning\r\n        <\/li>\r\n\r\n        <li>\r\n          <span class=\"ec-video-topic-icon\" aria-hidden=\"true\">\r\n            <svg\r\n              viewBox=\"0 0 24 24\"\r\n              width=\"18\"\r\n              height=\"18\"\r\n              fill=\"none\"\r\n            >\r\n              <path\r\n                d=\"M5 20V12M10 20V8M15 20V14M20 20V4\"\r\n                stroke=\"currentColor\"\r\n                stroke-width=\"1.8\"\r\n                stroke-linecap=\"round\"\r\n              \/>\r\n              <path\r\n                d=\"M3 20H21\"\r\n                stroke=\"currentColor\"\r\n                stroke-width=\"1.8\"\r\n                stroke-linecap=\"round\"\r\n              \/>\r\n            <\/svg>\r\n          <\/span>\r\n\r\n          Delivery analytics\r\n        <\/li>\r\n\r\n        <li>\r\n          <span class=\"ec-video-topic-icon\" aria-hidden=\"true\">\r\n            <svg\r\n              viewBox=\"0 0 24 24\"\r\n              width=\"18\"\r\n              height=\"18\"\r\n              fill=\"none\"\r\n            >\r\n              <rect\r\n                x=\"7\"\r\n                y=\"3\"\r\n                width=\"10\"\r\n                height=\"18\"\r\n                rx=\"2\"\r\n                stroke=\"currentColor\"\r\n                stroke-width=\"1.8\"\r\n              \/>\r\n              <path\r\n                d=\"M10 6H14M11 18H13\"\r\n                stroke=\"currentColor\"\r\n                stroke-width=\"1.8\"\r\n                stroke-linecap=\"round\"\r\n              \/>\r\n            <\/svg>\r\n          <\/span>\r\n\r\n          Mobile delivery workflows\r\n        <\/li>\r\n\r\n      <\/ul>\r\n\r\n    <\/div>\r\n\r\n    <!-- Optional CTA -->\r\n    <div class=\"ec-video-action\">\r\n\r\n      <a\r\n        href=\"\/lets-talk\/\"\r\n        class=\"ec-video-button\"\r\n        aria-label=\"Book a free introduction meeting about the Ecolos Plus platform\"\r\n      >\r\n        Discuss Your Delivery Workflow\r\n\r\n        <span aria-hidden=\"true\">\u2192<\/span>\r\n      <\/a>\r\n\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n\r\n\/* =========================================\r\n   ECOLOS+ VIDEO SECTION\r\n========================================= *\/\r\n\r\n.ec-video,\r\n.ec-video * {\r\n  box-sizing: border-box;\r\n}\r\n\r\n.ec-video {\r\n  position: relative;\r\n  isolation: isolate;\r\n\r\n  width: 100vw;\r\n  max-width: 100vw;\r\n\r\n  margin-left: calc(50% - 50vw);\r\n  padding: clamp(78px, 9vw, 118px) 0;\r\n\r\n  overflow: hidden;\r\n\r\n  color: #ffffff;\r\n\r\n  background:\r\n    linear-gradient(\r\n      150deg,\r\n      #080c16 0%,\r\n      #0a1020 48%,\r\n      #070b14 100%\r\n    );\r\n}\r\n\r\n.ec-video-container {\r\n  position: relative;\r\n  z-index: 3;\r\n\r\n  width: 100%;\r\n  max-width: 1280px;\r\n\r\n  margin: 0 auto;\r\n  padding: 0 clamp(18px, 4vw, 44px);\r\n}\r\n\r\n\/* =========================================\r\n   SECTION HEADER\r\n========================================= *\/\r\n\r\n.ec-video-header {\r\n  max-width: 850px;\r\n\r\n  margin: 0 auto clamp(40px, 5vw, 56px);\r\n\r\n  text-align: center;\r\n}\r\n\r\n.ec-video-eyebrow {\r\n  margin: 0 0 15px;\r\n\r\n  color: #67e8f9;\r\n\r\n  font-size: 12px;\r\n  font-weight: 750;\r\n  line-height: 1.3;\r\n  letter-spacing: 0.1em;\r\n  text-transform: uppercase;\r\n}\r\n\r\n.ec-video h2 {\r\n  margin: 0 0 20px;\r\n\r\n  color: #ffffff;\r\n\r\n  font-size: clamp(37px, 5vw, 60px);\r\n  font-weight: 760;\r\n  line-height: 1.08;\r\n  letter-spacing: -0.04em;\r\n\r\n  text-wrap: balance;\r\n}\r\n\r\n.ec-video-intro {\r\n  max-width: 760px;\r\n\r\n  margin: 0 auto;\r\n\r\n  color: #aebbd0;\r\n\r\n  font-size: clamp(16px, 1.5vw, 18px);\r\n  line-height: 1.75;\r\n\r\n  text-wrap: pretty;\r\n}\r\n\r\n\/* =========================================\r\n   VIDEO PLAYER\r\n========================================= *\/\r\n\r\n.ec-video-player {\r\n  position: relative;\r\n\r\n  width: 100%;\r\n  max-width: 1040px;\r\n  aspect-ratio: 16 \/ 9;\r\n\r\n  margin: 0 auto;\r\n\r\n  overflow: hidden;\r\n\r\n  border: 1px solid rgba(148, 163, 184, 0.2);\r\n  border-radius: 27px;\r\n\r\n  background: #020617;\r\n\r\n  box-shadow:\r\n    0 34px 90px rgba(0, 0, 0, 0.42),\r\n    0 0 60px rgba(6, 182, 212, 0.09),\r\n    inset 0 1px 0 rgba(255, 255, 255, 0.04);\r\n}\r\n\r\n.ec-video-poster {\r\n  position: absolute;\r\n\r\n  inset: 0;\r\n\r\n  display: block;\r\n\r\n  width: 100%;\r\n  height: 100%;\r\n\r\n  padding: 0;\r\n\r\n  overflow: hidden;\r\n\r\n  border: 0;\r\n\r\n  background: #020617;\r\n\r\n  cursor: pointer;\r\n}\r\n\r\n.ec-video-thumbnail {\r\n  display: block;\r\n\r\n  width: 100%;\r\n  height: 100%;\r\n\r\n  object-fit: cover;\r\n  object-position: center;\r\n\r\n  transform: scale(1.01);\r\n\r\n  transition:\r\n    transform 0.45s ease,\r\n    filter 0.45s ease;\r\n}\r\n\r\n.ec-video-poster:hover .ec-video-thumbnail {\r\n  transform: scale(1.035);\r\n\r\n  filter: brightness(1.05);\r\n}\r\n\r\n.ec-video-overlay {\r\n  position: absolute;\r\n\r\n  inset: 0;\r\n\r\n  background:\r\n    linear-gradient(\r\n      180deg,\r\n      rgba(2, 6, 23, 0.08) 0%,\r\n      rgba(2, 6, 23, 0.28) 50%,\r\n      rgba(2, 6, 23, 0.78) 100%\r\n    ),\r\n    radial-gradient(\r\n      circle at center,\r\n      rgba(37, 99, 235, 0.05),\r\n      rgba(2, 6, 23, 0.24) 70%\r\n    );\r\n\r\n  pointer-events: none;\r\n}\r\n\r\n\/* =========================================\r\n   PLAY BUTTON\r\n========================================= *\/\r\n\r\n.ec-video-play {\r\n  position: absolute;\r\n\r\n  top: 50%;\r\n  left: 50%;\r\n\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  width: clamp(72px, 8vw, 92px);\r\n  height: clamp(72px, 8vw, 92px);\r\n\r\n  transform: translate(-50%, -50%);\r\n\r\n  border: 1px solid rgba(255, 255, 255, 0.28);\r\n  border-radius: 50%;\r\n\r\n  background:\r\n    linear-gradient(\r\n      135deg,\r\n      rgba(6, 182, 212, 0.96),\r\n      rgba(37, 99, 235, 0.96),\r\n      rgba(79, 70, 229, 0.96)\r\n    );\r\n\r\n  color: #ffffff;\r\n\r\n  box-shadow:\r\n    0 18px 45px rgba(37, 99, 235, 0.36),\r\n    inset 0 1px 0 rgba(255, 255, 255, 0.22);\r\n\r\n  transition:\r\n    transform 0.28s ease,\r\n    box-shadow 0.28s ease;\r\n\r\n  pointer-events: none;\r\n}\r\n\r\n.ec-video-poster:hover .ec-video-play {\r\n  transform: translate(-50%, -50%) scale(1.09);\r\n\r\n  box-shadow:\r\n    0 24px 56px rgba(37, 99, 235, 0.46),\r\n    inset 0 1px 0 rgba(255, 255, 255, 0.24);\r\n}\r\n\r\n.ec-video-poster:focus-visible {\r\n  outline: 4px solid rgba(103, 232, 249, 0.82);\r\n  outline-offset: -7px;\r\n}\r\n\r\n\/* =========================================\r\n   POSTER CONTENT\r\n========================================= *\/\r\n\r\n.ec-video-poster-content {\r\n  position: absolute;\r\n\r\n  right: 32px;\r\n  bottom: 28px;\r\n  left: 32px;\r\n\r\n  display: flex;\r\n  align-items: flex-end;\r\n  justify-content: space-between;\r\n\r\n  gap: 20px;\r\n\r\n  color: #ffffff;\r\n\r\n  text-align: left;\r\n\r\n  pointer-events: none;\r\n}\r\n\r\n.ec-video-poster-label {\r\n  font-size: clamp(17px, 2.2vw, 24px);\r\n  font-weight: 740;\r\n  line-height: 1.3;\r\n  letter-spacing: -0.015em;\r\n}\r\n\r\n.ec-video-poster-text {\r\n  color: #cbd5e1;\r\n\r\n  font-size: 13px;\r\n  font-weight: 650;\r\n  line-height: 1.4;\r\n  letter-spacing: 0.035em;\r\n  text-transform: uppercase;\r\n}\r\n\r\n\/* =========================================\r\n   LOADED IFRAME\r\n========================================= *\/\r\n\r\n.ec-video-frame {\r\n  position: absolute;\r\n\r\n  inset: 0;\r\n\r\n  display: block;\r\n\r\n  width: 100%;\r\n  height: 100%;\r\n\r\n  border: 0;\r\n}\r\n\r\n\/* =========================================\r\n   SUPPORTING TEXT\r\n========================================= *\/\r\n\r\n.ec-video-details {\r\n  max-width: 900px;\r\n\r\n  margin: 33px auto 0;\r\n\r\n  text-align: center;\r\n}\r\n\r\n.ec-video-details > p {\r\n  max-width: 780px;\r\n\r\n  margin: 0 auto;\r\n\r\n  color: #aebbd0;\r\n\r\n  font-size: 15.5px;\r\n  line-height: 1.72;\r\n}\r\n\r\n\/* =========================================\r\n   TOPIC LIST\r\n========================================= *\/\r\n\r\n.ec-video-topics {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-wrap: wrap;\r\n\r\n  margin: 24px 0 0;\r\n  padding: 0;\r\n\r\n  gap: 10px;\r\n\r\n  list-style: none;\r\n}\r\n\r\n.ec-video-topics li {\r\n  display: inline-flex;\r\n  align-items: center;\r\n\r\n  min-height: 42px;\r\n\r\n  padding: 9px 14px;\r\n\r\n  gap: 8px;\r\n\r\n  border: 1px solid rgba(148, 163, 184, 0.16);\r\n  border-radius: 999px;\r\n\r\n  background: rgba(15, 23, 42, 0.64);\r\n\r\n  color: #cbd5e1;\r\n\r\n  font-size: 13px;\r\n  font-weight: 650;\r\n  line-height: 1.3;\r\n\r\n  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);\r\n}\r\n\r\n.ec-video-topic-icon {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  color: #67e8f9;\r\n}\r\n\r\n\/* =========================================\r\n   CTA\r\n========================================= *\/\r\n\r\n.ec-video-action {\r\n  display: flex;\r\n  justify-content: center;\r\n\r\n  margin-top: 31px;\r\n}\r\n\r\n.ec-video-button {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  min-height: 53px;\r\n\r\n  padding: 15px 23px;\r\n\r\n  gap: 9px;\r\n\r\n  border: 1px solid rgba(125, 211, 252, 0.2);\r\n  border-radius: 13px;\r\n\r\n  background:\r\n    linear-gradient(\r\n      135deg,\r\n      #0891b2,\r\n      #2563eb,\r\n      #4f46e5\r\n    );\r\n\r\n  color: #ffffff !important;\r\n\r\n  font-size: 15px;\r\n  font-weight: 700;\r\n  line-height: 1.2;\r\n  text-decoration: none !important;\r\n\r\n  box-shadow:\r\n    0 13px 31px rgba(37, 99, 235, 0.24),\r\n    inset 0 1px 0 rgba(255, 255, 255, 0.13);\r\n\r\n  transition:\r\n    transform 0.23s ease,\r\n    box-shadow 0.23s ease;\r\n}\r\n\r\n.ec-video-button:hover {\r\n  transform: translateY(-3px);\r\n\r\n  color: #ffffff !important;\r\n\r\n  box-shadow:\r\n    0 18px 39px rgba(37, 99, 235, 0.32),\r\n    inset 0 1px 0 rgba(255, 255, 255, 0.15);\r\n}\r\n\r\n.ec-video-button:focus-visible {\r\n  outline: 3px solid rgba(103, 232, 249, 0.75);\r\n  outline-offset: 5px;\r\n}\r\n\r\n\/* =========================================\r\n   NOSCRIPT\r\n========================================= *\/\r\n\r\n.ec-video-noscript {\r\n  position: absolute;\r\n\r\n  inset: 0;\r\n\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  margin: 0;\r\n  padding: 30px;\r\n\r\n  color: #e2e8f0;\r\n\r\n  text-align: center;\r\n}\r\n\r\n.ec-video-noscript a {\r\n  color: #67e8f9;\r\n}\r\n\r\n\/* =========================================\r\n   BACKGROUND\r\n========================================= *\/\r\n\r\n.ec-video-glow {\r\n  position: absolute;\r\n  z-index: 0;\r\n\r\n  display: block;\r\n\r\n  border-radius: 50%;\r\n\r\n  pointer-events: none;\r\n}\r\n\r\n.ec-video-glow--one {\r\n  top: -230px;\r\n  left: 50%;\r\n\r\n  width: 760px;\r\n  height: 580px;\r\n\r\n  transform: translateX(-50%);\r\n\r\n  background:\r\n    radial-gradient(\r\n      circle,\r\n      rgba(34, 211, 238, 0.12),\r\n      transparent 68%\r\n    );\r\n}\r\n\r\n.ec-video-glow--two {\r\n  right: -270px;\r\n  bottom: -290px;\r\n\r\n  width: 650px;\r\n  height: 650px;\r\n\r\n  background:\r\n    radial-gradient(\r\n      circle,\r\n      rgba(79, 70, 229, 0.11),\r\n      transparent 67%\r\n    );\r\n}\r\n\r\n.ec-video-grid {\r\n  position: absolute;\r\n  z-index: 0;\r\n\r\n  inset: 0;\r\n\r\n  background-image:\r\n    linear-gradient(\r\n      rgba(148, 163, 184, 0.022) 1px,\r\n      transparent 1px\r\n    ),\r\n    linear-gradient(\r\n      90deg,\r\n      rgba(148, 163, 184, 0.022) 1px,\r\n      transparent 1px\r\n    );\r\n\r\n  background-size: 52px 52px;\r\n\r\n  pointer-events: none;\r\n\r\n  mask-image:\r\n    linear-gradient(\r\n      to bottom,\r\n      transparent,\r\n      #000 18%,\r\n      #000 82%,\r\n      transparent\r\n    );\r\n\r\n  -webkit-mask-image:\r\n    linear-gradient(\r\n      to bottom,\r\n      transparent,\r\n      #000 18%,\r\n      #000 82%,\r\n      transparent\r\n    );\r\n}\r\n\r\n\/* =========================================\r\n   MOBILE\r\n========================================= *\/\r\n\r\n@media (max-width: 650px) {\r\n\r\n  .ec-video {\r\n    padding: 72px 0;\r\n  }\r\n\r\n  .ec-video-container {\r\n    padding: 0 16px;\r\n  }\r\n\r\n  .ec-video-header {\r\n    margin-bottom: 33px;\r\n  }\r\n\r\n  .ec-video h2 {\r\n    font-size: 35px;\r\n    line-height: 1.12;\r\n  }\r\n\r\n  .ec-video-intro {\r\n    font-size: 15.5px;\r\n    line-height: 1.7;\r\n  }\r\n\r\n  .ec-video-player {\r\n    border-radius: 19px;\r\n  }\r\n\r\n  .ec-video-poster-content {\r\n    right: 18px;\r\n    bottom: 17px;\r\n    left: 18px;\r\n\r\n    display: block;\r\n  }\r\n\r\n  .ec-video-poster-label {\r\n    font-size: 16px;\r\n  }\r\n\r\n  .ec-video-poster-text {\r\n    display: none;\r\n  }\r\n\r\n  .ec-video-play {\r\n    width: 66px;\r\n    height: 66px;\r\n  }\r\n\r\n  .ec-video-details {\r\n    margin-top: 25px;\r\n  }\r\n\r\n  .ec-video-details > p {\r\n    font-size: 14.5px;\r\n  }\r\n\r\n  .ec-video-topics {\r\n    align-items: stretch;\r\n    flex-direction: column;\r\n\r\n    max-width: 340px;\r\n\r\n    margin-right: auto;\r\n    margin-left: auto;\r\n  }\r\n\r\n  .ec-video-topics li {\r\n    justify-content: center;\r\n  }\r\n\r\n  .ec-video-button {\r\n    width: 100%;\r\n    max-width: 380px;\r\n  }\r\n\r\n}\r\n\r\n\/* =========================================\r\n   REDUCED MOTION\r\n========================================= *\/\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n\r\n  .ec-video-thumbnail,\r\n  .ec-video-play,\r\n  .ec-video-button {\r\n    transition: none !important;\r\n  }\r\n\r\n  .ec-video-poster:hover .ec-video-thumbnail {\r\n    transform: scale(1.01);\r\n  }\r\n\r\n  .ec-video-poster:hover .ec-video-play {\r\n    transform: translate(-50%, -50%);\r\n  }\r\n\r\n  .ec-video-button:hover {\r\n    transform: none;\r\n  }\r\n\r\n}\r\n\r\n<\/style>\r\n\r\n<script>\r\n(function () {\r\n\r\n  function initialiseEcolosVideos() {\r\n\r\n    const videoPlayers = document.querySelectorAll(\"[data-ec-video]\");\r\n\r\n    videoPlayers.forEach(function (player) {\r\n\r\n      if (player.dataset.initialised === \"true\") {\r\n        return;\r\n      }\r\n\r\n      player.dataset.initialised = \"true\";\r\n\r\n      const posterButton = player.querySelector(\".ec-video-poster\");\r\n      const videoId = player.dataset.videoId;\r\n\r\n      if (!posterButton || !videoId) {\r\n        return;\r\n      }\r\n\r\n      posterButton.addEventListener(\"click\", function () {\r\n\r\n        const iframe = document.createElement(\"iframe\");\r\n\r\n        iframe.className = \"ec-video-frame\";\r\n\r\n        iframe.src =\r\n          \"https:\/\/www.youtube-nocookie.com\/embed\/\" +\r\n          encodeURIComponent(videoId) +\r\n          \"?autoplay=1&playsinline=1&rel=0\";\r\n\r\n        iframe.title =\r\n          \"Ecolos Plus last-mile delivery platform overview video\";\r\n\r\n        iframe.allow =\r\n          \"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\";\r\n\r\n        iframe.referrerPolicy = \"strict-origin-when-cross-origin\";\r\n        iframe.allowFullscreen = true;\r\n\r\n        player.innerHTML = \"\";\r\n        player.appendChild(iframe);\r\n\r\n        iframe.focus();\r\n\r\n      }, { once: true });\r\n\r\n    });\r\n\r\n  }\r\n\r\n  if (document.readyState === \"loading\") {\r\n\r\n    document.addEventListener(\r\n      \"DOMContentLoaded\",\r\n      initialiseEcolosVideos\r\n    );\r\n\r\n  } else {\r\n\r\n    initialiseEcolosVideos();\r\n\r\n  }\r\n\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-1d3a43d e-flex e-con-boxed e-con e-parent\" data-id=\"1d3a43d\" data-element_type=\"container\" data-e-type=\"container\" data-no-translation=\"\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c67adea elementor-widget elementor-widget-html\" data-id=\"c67adea\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- ===== Ecolos+ Ruttoptimering och operativ kontroll ===== -->\r\n\r\n<section\r\n  class=\"ec-route-features\"\r\n  aria-labelledby=\"ec-route-features-title\"\r\n>\r\n  <span\r\n    class=\"ec-route-features-orb ec-route-features-orb--one\"\r\n    aria-hidden=\"true\"\r\n  ><\/span>\r\n\r\n  <span\r\n    class=\"ec-route-features-orb ec-route-features-orb--two\"\r\n    aria-hidden=\"true\"\r\n  ><\/span>\r\n\r\n  <div class=\"ec-route-features-container\">\r\n\r\n    <!-- Rubrik -->\r\n    <header class=\"ec-route-features-header\">\r\n\r\n      <p class=\"ec-route-features-eyebrow\">\r\n        Ruttintelligens och operativ kontroll\r\n      <\/p>\r\n\r\n      <h2 id=\"ec-route-features-title\">\r\n        Avancerad ruttplanering med full operativ flexibilitet\r\n      <\/h2>\r\n\r\n      <p class=\"ec-route-features-intro\">\r\n        Ecolos+ kombinerar AI-baserad ruttoptimering och ETA-ber\u00e4kning\r\n        med flexibla verktyg f\u00f6r manuell redigering, s\u00e5 att leveransteam\r\n        kan planera effektivt och samtidigt beh\u00e5lla kontrollen \u00f6ver\r\n        den dagliga verksamheten.\r\n      <\/p>\r\n\r\n    <\/header>\r\n\r\n    <div class=\"ec-route-features-list\">\r\n\r\n      <!-- =====================================\r\n           FUNKTION 1\r\n      ====================================== -->\r\n\r\n      <article\r\n        class=\"ec-route-feature\"\r\n        aria-labelledby=\"ec-route-ai-title\"\r\n      >\r\n\r\n        <!-- Inneh\u00e5ll -->\r\n        <div class=\"ec-route-feature-content\">\r\n\r\n          <div class=\"ec-route-feature-heading\">\r\n\r\n            <span\r\n              class=\"ec-route-feature-number\"\r\n              aria-hidden=\"true\"\r\n            >\r\n              01\r\n            <\/span>\r\n\r\n            <div class=\"ec-route-feature-title-wrap\">\r\n\r\n              <div\r\n                class=\"ec-route-feature-icon\"\r\n                aria-hidden=\"true\"\r\n              >\r\n                <svg\r\n                  viewBox=\"0 0 24 24\"\r\n                  width=\"26\"\r\n                  height=\"26\"\r\n                  fill=\"none\"\r\n                  xmlns=\"http:\/\/www.w3.org\/2000\/svg\"\r\n                >\r\n                  <circle\r\n                    cx=\"5\"\r\n                    cy=\"18\"\r\n                    r=\"2\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"1.8\"\r\n                  \/>\r\n\r\n                  <circle\r\n                    cx=\"18.5\"\r\n                    cy=\"6\"\r\n                    r=\"2\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"1.8\"\r\n                  \/>\r\n\r\n                  <path\r\n                    d=\"M6.7 16.9C9.3 15.4 10.2 13.1 10.5 10.6C10.8 8.1 13.1 6.4 16.5 6.1\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"1.8\"\r\n                    stroke-linecap=\"round\"\r\n                  \/>\r\n\r\n                  <path\r\n                    d=\"M13.9 3.9L16.7 6L14.7 8.9\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"1.8\"\r\n                    stroke-linecap=\"round\"\r\n                    stroke-linejoin=\"round\"\r\n                  \/>\r\n                <\/svg>\r\n              <\/div>\r\n\r\n              <h3 id=\"ec-route-ai-title\">\r\n                AI-baserad ruttoptimering och ETA-ber\u00e4kning\r\n              <\/h3>\r\n\r\n            <\/div>\r\n\r\n          <\/div>\r\n\r\n          <p class=\"ec-route-feature-summary\">\r\n            Anv\u00e4nd historiska trafikdata och operativa data f\u00f6r att skapa\r\n            effektivare rutter, ber\u00e4kna restider och ge b\u00e4ttre underlag\r\n            f\u00f6r den dagliga leveransplaneringen.\r\n          <\/p>\r\n\r\n          <ul class=\"ec-route-feature-points\">\r\n\r\n            <li>\r\n\r\n              <span\r\n                class=\"ec-route-check\"\r\n                aria-hidden=\"true\"\r\n              >\r\n                <svg\r\n                  viewBox=\"0 0 20 20\"\r\n                  width=\"18\"\r\n                  height=\"18\"\r\n                  fill=\"none\"\r\n                >\r\n                  <path\r\n                    d=\"M4 10.5L8 14.5L16 6\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"2\"\r\n                    stroke-linecap=\"round\"\r\n                    stroke-linejoin=\"round\"\r\n                  \/>\r\n                <\/svg>\r\n              <\/span>\r\n\r\n              <div>\r\n\r\n                <strong>\r\n                  Databaserade ankomst- och restidsber\u00e4kningar\r\n                <\/strong>\r\n\r\n                <p>\r\n                  Ber\u00e4kna f\u00f6rv\u00e4ntade ankomsttider och ruttdurationer\r\n                  med hj\u00e4lp av historiska trafikm\u00f6nster och relevant\r\n                  operativ information.\r\n                <\/p>\r\n\r\n              <\/div>\r\n\r\n            <\/li>\r\n\r\n            <li>\r\n\r\n              <span\r\n                class=\"ec-route-check\"\r\n                aria-hidden=\"true\"\r\n              >\r\n                <svg\r\n                  viewBox=\"0 0 20 20\"\r\n                  width=\"18\"\r\n                  height=\"18\"\r\n                  fill=\"none\"\r\n                >\r\n                  <path\r\n                    d=\"M4 10.5L8 14.5L16 6\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"2\"\r\n                    stroke-linecap=\"round\"\r\n                    stroke-linejoin=\"round\"\r\n                  \/>\r\n                <\/svg>\r\n              <\/span>\r\n\r\n              <div>\r\n\r\n                <strong>\r\n                  Effektiv ordning mellan leveransstoppen\r\n                <\/strong>\r\n\r\n                <p>\r\n                  Optimera stoppordningen utifr\u00e5n avst\u00e5nd, restid,\r\n                  leveranskrav och andra operativa begr\u00e4nsningar.\r\n                <\/p>\r\n\r\n              <\/div>\r\n\r\n            <\/li>\r\n\r\n            <li>\r\n\r\n              <span\r\n                class=\"ec-route-check\"\r\n                aria-hidden=\"true\"\r\n              >\r\n                <svg\r\n                  viewBox=\"0 0 20 20\"\r\n                  width=\"18\"\r\n                  height=\"18\"\r\n                  fill=\"none\"\r\n                >\r\n                  <path\r\n                    d=\"M4 10.5L8 14.5L16 6\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"2\"\r\n                    stroke-linecap=\"round\"\r\n                    stroke-linejoin=\"round\"\r\n                  \/>\r\n                <\/svg>\r\n              <\/span>\r\n\r\n              <div>\r\n\r\n                <strong>\r\n                  Mer tillf\u00f6rlitlig leveransplanering\r\n                <\/strong>\r\n\r\n                <p>\r\n                  Skapa b\u00e4ttre \u00f6verblick f\u00f6r driftteamet och kommunicera\r\n                  tydligare leveransprognoser till mottagare.\r\n                <\/p>\r\n\r\n              <\/div>\r\n\r\n            <\/li>\r\n\r\n          <\/ul>\r\n\r\n        <\/div>\r\n\r\n        <!-- Video -->\r\n        <div\r\n          class=\"ec-route-media\"\r\n          data-ec-route-media\r\n        >\r\n\r\n          <video\r\n            class=\"ec-route-video\"\r\n            muted\r\n            loop\r\n            playsinline\r\n            preload=\"none\"\r\n            aria-label=\"Demonstration av AI-baserad ruttoptimering och ETA-ber\u00e4kning i Ecolos Plus\"\r\n          >\r\n            <source\r\n              data-src=\"https:\/\/ecolosplus.se\/wp-content\/uploads\/2024\/10\/Blue-Black-Professiona-Intelligent-Technology-Presentation-2.mp4\"\r\n              type=\"video\/mp4\"\r\n            >\r\n\r\n            Din webbl\u00e4sare st\u00f6der inte videouppspelning.\r\n          <\/video>\r\n\r\n          <div\r\n            class=\"ec-route-media-overlay\"\r\n            aria-hidden=\"true\"\r\n          ><\/div>\r\n\r\n          <div\r\n            class=\"ec-route-media-label\"\r\n            aria-hidden=\"true\"\r\n          >\r\n            <span class=\"ec-route-media-label-dot\"><\/span>\r\n\r\n            AI-baserad ruttplanering\r\n          <\/div>\r\n\r\n          <button\r\n            type=\"button\"\r\n            class=\"ec-route-video-toggle\"\r\n            aria-label=\"Spela upp demonstrationen av AI-baserad ruttplanering\"\r\n            data-ec-video-toggle\r\n          >\r\n\r\n            <span\r\n              class=\"ec-route-toggle-play\"\r\n              aria-hidden=\"true\"\r\n            >\r\n              <svg\r\n                viewBox=\"0 0 24 24\"\r\n                width=\"20\"\r\n                height=\"20\"\r\n                fill=\"currentColor\"\r\n              >\r\n                <path d=\"M8 5.5V18.5L18 12L8 5.5Z\"><\/path>\r\n              <\/svg>\r\n            <\/span>\r\n\r\n            <span\r\n              class=\"ec-route-toggle-pause\"\r\n              aria-hidden=\"true\"\r\n            >\r\n              <svg\r\n                viewBox=\"0 0 24 24\"\r\n                width=\"20\"\r\n                height=\"20\"\r\n                fill=\"currentColor\"\r\n              >\r\n                <path d=\"M7 5H10V19H7V5ZM14 5H17V19H14V5Z\"><\/path>\r\n              <\/svg>\r\n            <\/span>\r\n\r\n          <\/button>\r\n\r\n        <\/div>\r\n\r\n      <\/article>\r\n\r\n      <!-- =====================================\r\n           FUNKTION 2\r\n      ====================================== -->\r\n\r\n      <article\r\n        class=\"ec-route-feature ec-route-feature--reverse\"\r\n        aria-labelledby=\"ec-route-control-title\"\r\n      >\r\n\r\n        <!-- Inneh\u00e5ll -->\r\n        <div class=\"ec-route-feature-content\">\r\n\r\n          <div class=\"ec-route-feature-heading\">\r\n\r\n            <span\r\n              class=\"ec-route-feature-number\"\r\n              aria-hidden=\"true\"\r\n            >\r\n              02\r\n            <\/span>\r\n\r\n            <div class=\"ec-route-feature-title-wrap\">\r\n\r\n              <div\r\n                class=\"ec-route-feature-icon\"\r\n                aria-hidden=\"true\"\r\n              >\r\n                <svg\r\n                  viewBox=\"0 0 24 24\"\r\n                  width=\"26\"\r\n                  height=\"26\"\r\n                  fill=\"none\"\r\n                  xmlns=\"http:\/\/www.w3.org\/2000\/svg\"\r\n                >\r\n                  <path\r\n                    d=\"M4 7H14\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"1.8\"\r\n                    stroke-linecap=\"round\"\r\n                  \/>\r\n\r\n                  <path\r\n                    d=\"M18 7H20\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"1.8\"\r\n                    stroke-linecap=\"round\"\r\n                  \/>\r\n\r\n                  <circle\r\n                    cx=\"16\"\r\n                    cy=\"7\"\r\n                    r=\"2\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"1.8\"\r\n                  \/>\r\n\r\n                  <path\r\n                    d=\"M4 12H7\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"1.8\"\r\n                    stroke-linecap=\"round\"\r\n                  \/>\r\n\r\n                  <path\r\n                    d=\"M11 12H20\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"1.8\"\r\n                    stroke-linecap=\"round\"\r\n                  \/>\r\n\r\n                  <circle\r\n                    cx=\"9\"\r\n                    cy=\"12\"\r\n                    r=\"2\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"1.8\"\r\n                  \/>\r\n\r\n                  <path\r\n                    d=\"M4 17H12\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"1.8\"\r\n                    stroke-linecap=\"round\"\r\n                  \/>\r\n\r\n                  <path\r\n                    d=\"M16 17H20\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"1.8\"\r\n                    stroke-linecap=\"round\"\r\n                  \/>\r\n\r\n                  <circle\r\n                    cx=\"14\"\r\n                    cy=\"17\"\r\n                    r=\"2\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"1.8\"\r\n                  \/>\r\n                <\/svg>\r\n              <\/div>\r\n\r\n              <h3 id=\"ec-route-control-title\">\r\n                Flexibel ruttredigering och operativ kontroll\r\n              <\/h3>\r\n\r\n            <\/div>\r\n\r\n          <\/div>\r\n\r\n          <p class=\"ec-route-feature-summary\">\r\n            Granska och anpassa genererade rutter med praktiska verktyg\r\n            f\u00f6r manuell redigering, kartbaserad planering och f\u00f6r\u00e4ndrade\r\n            leveranskrav.\r\n          <\/p>\r\n\r\n          <ul class=\"ec-route-feature-points\">\r\n\r\n            <li>\r\n\r\n              <span\r\n                class=\"ec-route-check\"\r\n                aria-hidden=\"true\"\r\n              >\r\n                <svg\r\n                  viewBox=\"0 0 20 20\"\r\n                  width=\"18\"\r\n                  height=\"18\"\r\n                  fill=\"none\"\r\n                >\r\n                  <path\r\n                    d=\"M4 10.5L8 14.5L16 6\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"2\"\r\n                    stroke-linecap=\"round\"\r\n                    stroke-linejoin=\"round\"\r\n                  \/>\r\n                <\/svg>\r\n              <\/span>\r\n\r\n              <div>\r\n\r\n                <strong>\r\n                  Planering f\u00f6r stora leveransvolymer\r\n                <\/strong>\r\n\r\n                <p>\r\n                  Bearbeta stora m\u00e4ngder order och paket med\r\n                  optimeringsber\u00e4kningar anpassade f\u00f6r komplexa\r\n                  leveransfl\u00f6den.\r\n                <\/p>\r\n\r\n              <\/div>\r\n\r\n            <\/li>\r\n\r\n            <li>\r\n\r\n              <span\r\n                class=\"ec-route-check\"\r\n                aria-hidden=\"true\"\r\n              >\r\n                <svg\r\n                  viewBox=\"0 0 20 20\"\r\n                  width=\"18\"\r\n                  height=\"18\"\r\n                  fill=\"none\"\r\n                >\r\n                  <path\r\n                    d=\"M4 10.5L8 14.5L16 6\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"2\"\r\n                    stroke-linecap=\"round\"\r\n                    stroke-linejoin=\"round\"\r\n                  \/>\r\n                <\/svg>\r\n              <\/span>\r\n\r\n              <div>\r\n\r\n                <strong>\r\n                  Manuell anpassning av rutter\r\n                <\/strong>\r\n\r\n                <p>\r\n                  Finjustera leveransplanen med dra-och-sl\u00e4pp,\r\n                  kartbaserade verktyg och anpassade kriterier.\r\n                <\/p>\r\n\r\n              <\/div>\r\n\r\n            <\/li>\r\n\r\n            <li>\r\n\r\n              <span\r\n                class=\"ec-route-check\"\r\n                aria-hidden=\"true\"\r\n              >\r\n                <svg\r\n                  viewBox=\"0 0 20 20\"\r\n                  width=\"18\"\r\n                  height=\"18\"\r\n                  fill=\"none\"\r\n                >\r\n                  <path\r\n                    d=\"M4 10.5L8 14.5L16 6\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"2\"\r\n                    stroke-linecap=\"round\"\r\n                    stroke-linejoin=\"round\"\r\n                  \/>\r\n                <\/svg>\r\n              <\/span>\r\n\r\n              <div>\r\n\r\n                <strong>\r\n                  Anpassning vid operativa f\u00f6r\u00e4ndringar\r\n                <\/strong>\r\n\r\n                <p>\r\n                  \u00c4ndra stoppordningen eller l\u00e4gg till och ta bort\r\n                  leveranser n\u00e4r f\u00f6ruts\u00e4ttningarna f\u00f6r\u00e4ndras under\r\n                  planeringsprocessen.\r\n                <\/p>\r\n\r\n              <\/div>\r\n\r\n            <\/li>\r\n\r\n          <\/ul>\r\n\r\n        <\/div>\r\n\r\n        <!-- Video -->\r\n        <div\r\n          class=\"ec-route-media\"\r\n          data-ec-route-media\r\n        >\r\n\r\n          <video\r\n            class=\"ec-route-video\"\r\n            muted\r\n            loop\r\n            playsinline\r\n            preload=\"none\"\r\n            aria-label=\"Demonstration av manuell ruttredigering och operativ kontroll i Ecolos Plus\"\r\n          >\r\n            <source\r\n              data-src=\"https:\/\/ecolosplus.se\/wp-content\/uploads\/2024\/10\/Blue-Black-Professiona-Intelligent-Technology-Presentation-1.mp4\"\r\n              type=\"video\/mp4\"\r\n            >\r\n\r\n            Din webbl\u00e4sare st\u00f6der inte videouppspelning.\r\n          <\/video>\r\n\r\n          <div\r\n            class=\"ec-route-media-overlay\"\r\n            aria-hidden=\"true\"\r\n          ><\/div>\r\n\r\n          <div\r\n            class=\"ec-route-media-label\"\r\n            aria-hidden=\"true\"\r\n          >\r\n            <span class=\"ec-route-media-label-dot\"><\/span>\r\n\r\n            Flexibel ruttkontroll\r\n          <\/div>\r\n\r\n          <button\r\n            type=\"button\"\r\n            class=\"ec-route-video-toggle\"\r\n            aria-label=\"Spela upp demonstrationen av flexibel ruttredigering\"\r\n            data-ec-video-toggle\r\n          >\r\n\r\n            <span\r\n              class=\"ec-route-toggle-play\"\r\n              aria-hidden=\"true\"\r\n            >\r\n              <svg\r\n                viewBox=\"0 0 24 24\"\r\n                width=\"20\"\r\n                height=\"20\"\r\n                fill=\"currentColor\"\r\n              >\r\n                <path d=\"M8 5.5V18.5L18 12L8 5.5Z\"><\/path>\r\n              <\/svg>\r\n            <\/span>\r\n\r\n            <span\r\n              class=\"ec-route-toggle-pause\"\r\n              aria-hidden=\"true\"\r\n            >\r\n              <svg\r\n                viewBox=\"0 0 24 24\"\r\n                width=\"20\"\r\n                height=\"20\"\r\n                fill=\"currentColor\"\r\n              >\r\n                <path d=\"M7 5H10V19H7V5ZM14 5H17V19H14V5Z\"><\/path>\r\n              <\/svg>\r\n            <\/span>\r\n\r\n          <\/button>\r\n\r\n        <\/div>\r\n\r\n      <\/article>\r\n\r\n    <\/div>\r\n\r\n    <!-- Intern l\u00e4nk -->\r\n    <div class=\"ec-route-features-action\">\r\n\r\n      <a\r\n        href=\"\/sv\/features\/\"\r\n        class=\"ec-route-features-button\"\r\n        aria-label=\"Utforska alla funktioner i leveransplattformen Ecolos Plus\"\r\n      >\r\n        Utforska alla plattformsfunktioner\r\n\r\n        <span aria-hidden=\"true\">\r\n          \u2192\r\n        <\/span>\r\n      <\/a>\r\n\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n\r\n\/* =========================================\r\n   RUTTOPTIMERING OCH OPERATIV KONTROLL\r\n========================================= *\/\r\n\r\n.ec-route-features,\r\n.ec-route-features * {\r\n  box-sizing: border-box;\r\n}\r\n\r\n.ec-route-features {\r\n  position: relative;\r\n  isolation: isolate;\r\n\r\n  width: 100vw;\r\n  max-width: 100vw;\r\n\r\n  margin-left: calc(50% - 50vw);\r\n  padding: clamp(78px, 9vw, 120px) 0;\r\n\r\n  overflow: hidden;\r\n\r\n  color: #0f172a;\r\n\r\n  background:\r\n    linear-gradient(\r\n      145deg,\r\n      #ffffff 0%,\r\n      #f8fafc 50%,\r\n      #f2f7ff 100%\r\n    );\r\n}\r\n\r\n.ec-route-features-container {\r\n  position: relative;\r\n  z-index: 2;\r\n\r\n  width: 100%;\r\n  max-width: 1280px;\r\n\r\n  margin: 0 auto;\r\n  padding: 0 clamp(18px, 4vw, 44px);\r\n}\r\n\r\n\/* =========================================\r\n   RUBRIK\r\n========================================= *\/\r\n\r\n.ec-route-features-header {\r\n  max-width: 900px;\r\n\r\n  margin: 0 auto clamp(60px, 8vw, 95px);\r\n\r\n  text-align: center;\r\n}\r\n\r\n.ec-route-features-eyebrow {\r\n  margin: 0 0 15px;\r\n\r\n  color: #2563eb;\r\n\r\n  font-size: 12px;\r\n  font-weight: 750;\r\n  line-height: 1.3;\r\n  letter-spacing: 0.1em;\r\n  text-transform: uppercase;\r\n}\r\n\r\n.ec-route-features h2 {\r\n  margin: 0 0 21px;\r\n\r\n  color: #0f172a;\r\n\r\n  font-size: clamp(37px, 5vw, 59px);\r\n  font-weight: 760;\r\n  line-height: 1.08;\r\n  letter-spacing: -0.04em;\r\n\r\n  text-wrap: balance;\r\n}\r\n\r\n.ec-route-features-intro {\r\n  max-width: 800px;\r\n\r\n  margin: 0 auto;\r\n\r\n  color: #64748b;\r\n\r\n  font-size: clamp(16px, 1.5vw, 18px);\r\n  line-height: 1.75;\r\n\r\n  text-wrap: pretty;\r\n}\r\n\r\n\/* =========================================\r\n   FUNKTIONSLISTA\r\n========================================= *\/\r\n\r\n.ec-route-features-list {\r\n  display: grid;\r\n\r\n  gap: clamp(85px, 10vw, 140px);\r\n}\r\n\r\n.ec-route-feature {\r\n  display: grid;\r\n  grid-template-columns:\r\n    minmax(0, 0.96fr)\r\n    minmax(0, 1.04fr);\r\n\r\n  align-items: center;\r\n\r\n  gap: clamp(45px, 7vw, 88px);\r\n}\r\n\r\n.ec-route-feature--reverse .ec-route-feature-content {\r\n  order: 2;\r\n}\r\n\r\n.ec-route-feature--reverse .ec-route-media {\r\n  order: 1;\r\n}\r\n\r\n\/* =========================================\r\n   INNEH\u00c5LL\r\n========================================= *\/\r\n\r\n.ec-route-feature-content {\r\n  min-width: 0;\r\n}\r\n\r\n.ec-route-feature-heading {\r\n  display: flex;\r\n  align-items: flex-start;\r\n\r\n  margin-bottom: 23px;\r\n\r\n  gap: 18px;\r\n}\r\n\r\n.ec-route-feature-number {\r\n  padding-top: 8px;\r\n\r\n  flex: 0 0 auto;\r\n\r\n  color: #94a3b8;\r\n\r\n  font-size: 13px;\r\n  font-weight: 800;\r\n  line-height: 1;\r\n  letter-spacing: 0.1em;\r\n}\r\n\r\n.ec-route-feature-title-wrap {\r\n  min-width: 0;\r\n}\r\n\r\n.ec-route-feature-icon {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  width: 55px;\r\n  height: 55px;\r\n\r\n  margin-bottom: 19px;\r\n\r\n  border: 1px solid rgba(37, 99, 235, 0.14);\r\n  border-radius: 17px;\r\n\r\n  background:\r\n    linear-gradient(\r\n      135deg,\r\n      rgba(219, 234, 254, 0.9),\r\n      rgba(224, 231, 255, 0.8)\r\n    );\r\n\r\n  color: #2563eb;\r\n\r\n  box-shadow:\r\n    0 12px 28px rgba(37, 99, 235, 0.1),\r\n    inset 0 1px 0 rgba(255, 255, 255, 0.9);\r\n}\r\n\r\n.ec-route-feature h3 {\r\n  max-width: 590px;\r\n\r\n  margin: 0;\r\n\r\n  color: #0f172a;\r\n\r\n  font-size: clamp(27px, 3.1vw, 38px);\r\n  font-weight: 750;\r\n  line-height: 1.16;\r\n  letter-spacing: -0.03em;\r\n\r\n  text-wrap: balance;\r\n}\r\n\r\n.ec-route-feature-summary {\r\n  max-width: 630px;\r\n\r\n  margin: 0 0 30px;\r\n\r\n  color: #64748b;\r\n\r\n  font-size: 16.5px;\r\n  line-height: 1.72;\r\n}\r\n\r\n\/* =========================================\r\n   PUNKTLISTA\r\n========================================= *\/\r\n\r\n.ec-route-feature-points {\r\n  display: grid;\r\n\r\n  margin: 0;\r\n  padding: 0;\r\n\r\n  gap: 22px;\r\n\r\n  list-style: none;\r\n}\r\n\r\n.ec-route-feature-points li {\r\n  display: grid;\r\n  grid-template-columns: auto minmax(0, 1fr);\r\n\r\n  gap: 14px;\r\n}\r\n\r\n.ec-route-check {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  width: 29px;\r\n  height: 29px;\r\n\r\n  margin-top: 1px;\r\n\r\n  flex: 0 0 29px;\r\n\r\n  border-radius: 9px;\r\n\r\n  background: #eff6ff;\r\n\r\n  color: #2563eb;\r\n}\r\n\r\n.ec-route-feature-points strong {\r\n  display: block;\r\n\r\n  margin: 0 0 5px;\r\n\r\n  color: #1e293b;\r\n\r\n  font-size: 16.5px;\r\n  font-weight: 720;\r\n  line-height: 1.4;\r\n}\r\n\r\n.ec-route-feature-points p {\r\n  max-width: 580px;\r\n\r\n  margin: 0;\r\n\r\n  color: #64748b;\r\n\r\n  font-size: 14.5px;\r\n  line-height: 1.65;\r\n}\r\n\r\n\/* =========================================\r\n   VIDEO\r\n========================================= *\/\r\n\r\n.ec-route-media {\r\n  position: relative;\r\n\r\n  width: 100%;\r\n  aspect-ratio: 16 \/ 10;\r\n\r\n  overflow: hidden;\r\n\r\n  border: 1px solid rgba(148, 163, 184, 0.22);\r\n  border-radius: 26px;\r\n\r\n  background:\r\n    linear-gradient(\r\n      135deg,\r\n      #0f172a,\r\n      #172554\r\n    );\r\n\r\n  box-shadow:\r\n    0 30px 70px rgba(15, 23, 42, 0.17),\r\n    0 8px 25px rgba(15, 23, 42, 0.08);\r\n\r\n  transform: translateZ(0);\r\n}\r\n\r\n.ec-route-video {\r\n  display: block;\r\n\r\n  width: 100%;\r\n  height: 100%;\r\n\r\n  object-fit: cover;\r\n  object-position: center;\r\n\r\n  background: #0f172a;\r\n}\r\n\r\n.ec-route-media-overlay {\r\n  position: absolute;\r\n\r\n  inset: 0;\r\n\r\n  background:\r\n    linear-gradient(\r\n      180deg,\r\n      transparent 55%,\r\n      rgba(2, 6, 23, 0.4) 100%\r\n    );\r\n\r\n  pointer-events: none;\r\n}\r\n\r\n.ec-route-media-label {\r\n  position: absolute;\r\n\r\n  top: 17px;\r\n  left: 17px;\r\n\r\n  display: inline-flex;\r\n  align-items: center;\r\n\r\n  min-height: 37px;\r\n\r\n  padding: 8px 12px;\r\n\r\n  gap: 8px;\r\n\r\n  border: 1px solid rgba(255, 255, 255, 0.13);\r\n  border-radius: 999px;\r\n\r\n  background: rgba(15, 23, 42, 0.68);\r\n\r\n  color: #f8fafc;\r\n\r\n  font-size: 11.5px;\r\n  font-weight: 700;\r\n  line-height: 1.2;\r\n  letter-spacing: 0.035em;\r\n  text-transform: uppercase;\r\n\r\n  box-shadow:\r\n    0 8px 22px rgba(0, 0, 0, 0.16);\r\n\r\n  backdrop-filter: blur(10px);\r\n  -webkit-backdrop-filter: blur(10px);\r\n}\r\n\r\n.ec-route-media-label-dot {\r\n  width: 8px;\r\n  height: 8px;\r\n\r\n  flex: 0 0 8px;\r\n\r\n  border-radius: 50%;\r\n\r\n  background: #22d3ee;\r\n\r\n  box-shadow:\r\n    0 0 0 4px rgba(34, 211, 238, 0.13);\r\n}\r\n\r\n\/* =========================================\r\n   VIDEOKONTROLL\r\n========================================= *\/\r\n\r\n.ec-route-video-toggle {\r\n  position: absolute;\r\n\r\n  right: 17px;\r\n  bottom: 17px;\r\n\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  width: 45px;\r\n  height: 45px;\r\n\r\n  padding: 0;\r\n\r\n  border: 1px solid rgba(255, 255, 255, 0.15);\r\n  border-radius: 50%;\r\n\r\n  background: rgba(15, 23, 42, 0.76);\r\n\r\n  color: #ffffff;\r\n\r\n  cursor: pointer;\r\n\r\n  box-shadow:\r\n    0 10px 27px rgba(0, 0, 0, 0.23);\r\n\r\n  backdrop-filter: blur(10px);\r\n  -webkit-backdrop-filter: blur(10px);\r\n\r\n  transition:\r\n    transform 0.22s ease,\r\n    background-color 0.22s ease;\r\n}\r\n\r\n.ec-route-video-toggle:hover {\r\n  transform: scale(1.08);\r\n\r\n  background: rgba(37, 99, 235, 0.9);\r\n}\r\n\r\n.ec-route-video-toggle:focus-visible {\r\n  outline: 3px solid rgba(125, 211, 252, 0.9);\r\n  outline-offset: 4px;\r\n}\r\n\r\n.ec-route-toggle-pause {\r\n  display: none;\r\n}\r\n\r\n.ec-route-video-toggle[data-playing=\"true\"]\r\n.ec-route-toggle-play {\r\n  display: none;\r\n}\r\n\r\n.ec-route-video-toggle[data-playing=\"true\"]\r\n.ec-route-toggle-pause {\r\n  display: flex;\r\n}\r\n\r\n.ec-route-toggle-play,\r\n.ec-route-toggle-pause {\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n\r\n\/* =========================================\r\n   CTA\r\n========================================= *\/\r\n\r\n.ec-route-features-action {\r\n  display: flex;\r\n  justify-content: center;\r\n\r\n  margin-top: clamp(60px, 8vw, 90px);\r\n}\r\n\r\n.ec-route-features-button {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  min-height: 54px;\r\n\r\n  padding: 15px 24px;\r\n\r\n  gap: 9px;\r\n\r\n  border: 1px solid #2563eb;\r\n  border-radius: 13px;\r\n\r\n  background: #2563eb;\r\n\r\n  color: #ffffff !important;\r\n\r\n  font-size: 15px;\r\n  font-weight: 700;\r\n  line-height: 1.25;\r\n  text-align: center;\r\n  text-decoration: none !important;\r\n\r\n  box-shadow:\r\n    0 13px 31px rgba(37, 99, 235, 0.23);\r\n\r\n  transition:\r\n    transform 0.22s ease,\r\n    background-color 0.22s ease,\r\n    box-shadow 0.22s ease;\r\n}\r\n\r\n.ec-route-features-button:hover {\r\n  transform: translateY(-3px);\r\n\r\n  background: #1d4ed8;\r\n\r\n  color: #ffffff !important;\r\n\r\n  box-shadow:\r\n    0 18px 39px rgba(37, 99, 235, 0.31);\r\n}\r\n\r\n.ec-route-features-button:focus-visible {\r\n  outline: 3px solid rgba(37, 99, 235, 0.32);\r\n  outline-offset: 5px;\r\n}\r\n\r\n\/* =========================================\r\n   BAKGRUND\r\n========================================= *\/\r\n\r\n.ec-route-features-orb {\r\n  position: absolute;\r\n  z-index: 0;\r\n\r\n  display: block;\r\n\r\n  border-radius: 50%;\r\n\r\n  pointer-events: none;\r\n}\r\n\r\n.ec-route-features-orb--one {\r\n  top: -220px;\r\n  right: -170px;\r\n\r\n  width: 540px;\r\n  height: 540px;\r\n\r\n  background:\r\n    radial-gradient(\r\n      circle,\r\n      rgba(59, 130, 246, 0.11),\r\n      transparent 68%\r\n    );\r\n}\r\n\r\n.ec-route-features-orb--two {\r\n  bottom: -270px;\r\n  left: -210px;\r\n\r\n  width: 600px;\r\n  height: 600px;\r\n\r\n  background:\r\n    radial-gradient(\r\n      circle,\r\n      rgba(99, 102, 241, 0.09),\r\n      transparent 68%\r\n    );\r\n}\r\n\r\n\/* =========================================\r\n   SURFPLATTA\r\n========================================= *\/\r\n\r\n@media (max-width: 950px) {\r\n\r\n  .ec-route-feature,\r\n  .ec-route-feature--reverse {\r\n    grid-template-columns: 1fr;\r\n\r\n    gap: 45px;\r\n  }\r\n\r\n  .ec-route-feature--reverse\r\n  .ec-route-feature-content,\r\n  .ec-route-feature--reverse\r\n  .ec-route-media {\r\n    order: initial;\r\n  }\r\n\r\n  .ec-route-feature-content {\r\n    max-width: 720px;\r\n\r\n    margin: 0 auto;\r\n  }\r\n\r\n  .ec-route-media {\r\n    max-width: 760px;\r\n\r\n    margin: 0 auto;\r\n  }\r\n\r\n}\r\n\r\n\/* =========================================\r\n   MOBIL\r\n========================================= *\/\r\n\r\n@media (max-width: 620px) {\r\n\r\n  .ec-route-features {\r\n    padding: 72px 0;\r\n  }\r\n\r\n  .ec-route-features-container {\r\n    padding: 0 17px;\r\n  }\r\n\r\n  .ec-route-features-header {\r\n    margin-bottom: 55px;\r\n  }\r\n\r\n  .ec-route-features h2 {\r\n    font-size: 35px;\r\n    line-height: 1.12;\r\n  }\r\n\r\n  .ec-route-features-intro {\r\n    font-size: 15.5px;\r\n    line-height: 1.7;\r\n  }\r\n\r\n  .ec-route-features-list {\r\n    gap: 78px;\r\n  }\r\n\r\n  .ec-route-feature {\r\n    gap: 34px;\r\n  }\r\n\r\n  .ec-route-feature-heading {\r\n    gap: 11px;\r\n  }\r\n\r\n  .ec-route-feature-number {\r\n    padding-top: 6px;\r\n\r\n    font-size: 11px;\r\n  }\r\n\r\n  .ec-route-feature-icon {\r\n    width: 49px;\r\n    height: 49px;\r\n\r\n    margin-bottom: 16px;\r\n\r\n    border-radius: 15px;\r\n  }\r\n\r\n  .ec-route-feature h3 {\r\n    font-size: 27px;\r\n    line-height: 1.2;\r\n  }\r\n\r\n  .ec-route-feature-summary {\r\n    margin-bottom: 27px;\r\n\r\n    font-size: 15.5px;\r\n  }\r\n\r\n  .ec-route-feature-points {\r\n    gap: 20px;\r\n  }\r\n\r\n  .ec-route-feature-points strong {\r\n    font-size: 16px;\r\n  }\r\n\r\n  .ec-route-feature-points p {\r\n    font-size: 14px;\r\n  }\r\n\r\n  .ec-route-media {\r\n    aspect-ratio: 4 \/ 3;\r\n\r\n    border-radius: 20px;\r\n  }\r\n\r\n  .ec-route-media-label {\r\n    top: 12px;\r\n    left: 12px;\r\n\r\n    font-size: 10px;\r\n  }\r\n\r\n  .ec-route-video-toggle {\r\n    right: 12px;\r\n    bottom: 12px;\r\n\r\n    width: 42px;\r\n    height: 42px;\r\n  }\r\n\r\n  .ec-route-features-button {\r\n    width: 100%;\r\n    max-width: 390px;\r\n  }\r\n\r\n}\r\n\r\n\/* =========================================\r\n   MINSKAD R\u00d6RELSE\r\n========================================= *\/\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n\r\n  .ec-route-video-toggle,\r\n  .ec-route-features-button {\r\n    transition: none !important;\r\n  }\r\n\r\n  .ec-route-video-toggle:hover,\r\n  .ec-route-features-button:hover {\r\n    transform: none;\r\n  }\r\n\r\n}\r\n\r\n<\/style>\r\n\r\n<script>\r\n(function () {\r\n\r\n  function initialiseRouteFeatureVideos() {\r\n\r\n    const mediaItems = document.querySelectorAll(\r\n      \"[data-ec-route-media]\"\r\n    );\r\n\r\n    if (!mediaItems.length) {\r\n      return;\r\n    }\r\n\r\n    const reducedMotionQuery = window.matchMedia(\r\n      \"(prefers-reduced-motion: reduce)\"\r\n    );\r\n\r\n    mediaItems.forEach(function (media) {\r\n\r\n      if (media.dataset.initialised === \"true\") {\r\n        return;\r\n      }\r\n\r\n      media.dataset.initialised = \"true\";\r\n\r\n      const video = media.querySelector(\r\n        \".ec-route-video\"\r\n      );\r\n\r\n      const toggle = media.querySelector(\r\n        \"[data-ec-video-toggle]\"\r\n      );\r\n\r\n      const source = video\r\n        ? video.querySelector(\"source[data-src]\")\r\n        : null;\r\n\r\n      if (!video || !toggle || !source) {\r\n        return;\r\n      }\r\n\r\n      let loaded = false;\r\n      let manuallyPaused = reducedMotionQuery.matches;\r\n\r\n      function loadVideo() {\r\n\r\n        if (loaded) {\r\n          return;\r\n        }\r\n\r\n        source.src = source.dataset.src;\r\n        source.removeAttribute(\"data-src\");\r\n\r\n        video.load();\r\n\r\n        loaded = true;\r\n\r\n      }\r\n\r\n      function updateToggle() {\r\n\r\n        const isPlaying =\r\n          !video.paused && !video.ended;\r\n\r\n        toggle.dataset.playing =\r\n          isPlaying ? \"true\" : \"false\";\r\n\r\n        toggle.setAttribute(\r\n          \"aria-label\",\r\n          isPlaying\r\n            ? \"Pausa videodemonstrationen\"\r\n            : \"Spela upp videodemonstrationen\"\r\n        );\r\n\r\n      }\r\n\r\n      function playVideo() {\r\n\r\n        loadVideo();\r\n\r\n        const playPromise = video.play();\r\n\r\n        if (\r\n          playPromise &&\r\n          typeof playPromise.catch === \"function\"\r\n        ) {\r\n          playPromise.catch(function () {\r\n            updateToggle();\r\n          });\r\n        }\r\n\r\n      }\r\n\r\n      function pauseVideo() {\r\n        video.pause();\r\n      }\r\n\r\n      toggle.addEventListener(\r\n        \"click\",\r\n        function () {\r\n\r\n          loadVideo();\r\n\r\n          if (video.paused) {\r\n\r\n            manuallyPaused = false;\r\n            playVideo();\r\n\r\n          } else {\r\n\r\n            manuallyPaused = true;\r\n            pauseVideo();\r\n\r\n          }\r\n\r\n        }\r\n      );\r\n\r\n      video.addEventListener(\r\n        \"play\",\r\n        updateToggle\r\n      );\r\n\r\n      video.addEventListener(\r\n        \"pause\",\r\n        updateToggle\r\n      );\r\n\r\n      video.addEventListener(\r\n        \"ended\",\r\n        updateToggle\r\n      );\r\n\r\n      if (\"IntersectionObserver\" in window) {\r\n\r\n        const observer = new IntersectionObserver(\r\n          function (entries) {\r\n\r\n            entries.forEach(function (entry) {\r\n\r\n              if (entry.isIntersecting) {\r\n\r\n                loadVideo();\r\n\r\n                if (\r\n                  !reducedMotionQuery.matches &&\r\n                  !manuallyPaused\r\n                ) {\r\n                  playVideo();\r\n                }\r\n\r\n              } else {\r\n\r\n                pauseVideo();\r\n\r\n              }\r\n\r\n            });\r\n\r\n          },\r\n          {\r\n            root: null,\r\n            rootMargin: \"180px 0px\",\r\n            threshold: 0.2\r\n          }\r\n        );\r\n\r\n        observer.observe(media);\r\n\r\n      } else {\r\n\r\n        loadVideo();\r\n\r\n      }\r\n\r\n      if (\r\n        typeof reducedMotionQuery.addEventListener ===\r\n        \"function\"\r\n      ) {\r\n\r\n        reducedMotionQuery.addEventListener(\r\n          \"change\",\r\n          function (event) {\r\n\r\n            if (event.matches) {\r\n\r\n              manuallyPaused = true;\r\n              pauseVideo();\r\n\r\n            }\r\n\r\n          }\r\n        );\r\n\r\n      }\r\n\r\n      updateToggle();\r\n\r\n    });\r\n\r\n  }\r\n\r\n  if (document.readyState === \"loading\") {\r\n\r\n    document.addEventListener(\r\n      \"DOMContentLoaded\",\r\n      initialiseRouteFeatureVideos\r\n    );\r\n\r\n  } else {\r\n\r\n    initialiseRouteFeatureVideos();\r\n\r\n  }\r\n\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-cadb75b e-flex e-con-boxed e-con e-parent\" data-id=\"cadb75b\" data-element_type=\"container\" data-e-type=\"container\" data-no-translation=\"\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9e0f18d elementor-widget elementor-widget-html\" data-id=\"9e0f18d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- =====================================================\r\n     ECOLOS+ \u2013 LIVE OPERATIONS, SUPPORT AND MULTI-HUB\r\n     Svensk version\r\n====================================================== -->\r\n\r\n<!-- =====================================================\r\n     SEKTION 1: LIVE-SP\u00c5RNING OCH SUPPORT\r\n====================================================== -->\r\n\r\n<section\r\n  class=\"ec-sv-features ec-sv-features--live\"\r\n  aria-labelledby=\"ec-sv-live-title\"\r\n>\r\n  <span class=\"ec-sv-orb ec-sv-orb--one\" aria-hidden=\"true\"><\/span>\r\n  <span class=\"ec-sv-orb ec-sv-orb--two\" aria-hidden=\"true\"><\/span>\r\n\r\n  <div class=\"ec-sv-container\">\r\n\r\n    <header class=\"ec-sv-header\">\r\n\r\n      <p class=\"ec-sv-eyebrow\">\r\n        Live\u00f6verblick och support\r\n      <\/p>\r\n\r\n      <h2 id=\"ec-sv-live-title\">\r\n        Beh\u00e5ll kontrollen fr\u00e5n utskick till slutf\u00f6rd leverans\r\n      <\/h2>\r\n\r\n      <p class=\"ec-sv-intro\">\r\n        Ecolos+ ger driftteam b\u00e4ttre \u00f6verblick \u00f6ver kurirer,\r\n        leveransstatus, avvikelser och support\u00e4renden s\u00e5 att problem\r\n        kan uppt\u00e4ckas och hanteras tidigare.\r\n      <\/p>\r\n\r\n    <\/header>\r\n\r\n    <div class=\"ec-sv-feature-list\">\r\n\r\n      <!-- =============================================\r\n           FUNKTION 3\r\n      ============================================== -->\r\n\r\n      <article\r\n        class=\"ec-sv-feature\"\r\n        aria-labelledby=\"ec-sv-tracking-title\"\r\n      >\r\n\r\n        <div class=\"ec-sv-feature-content\">\r\n\r\n          <div class=\"ec-sv-feature-heading\">\r\n\r\n            <span class=\"ec-sv-number\" aria-hidden=\"true\">\r\n              03\r\n            <\/span>\r\n\r\n            <div class=\"ec-sv-title-group\">\r\n\r\n              <div class=\"ec-sv-icon\" aria-hidden=\"true\">\r\n\r\n                <svg\r\n                  viewBox=\"0 0 24 24\"\r\n                  width=\"27\"\r\n                  height=\"27\"\r\n                  fill=\"none\"\r\n                  xmlns=\"http:\/\/www.w3.org\/2000\/svg\"\r\n                >\r\n                  <path\r\n                    d=\"M12 21C12 21 19 15.4 19 9.5C19 5.36 15.87 3 12 3C8.13 3 5 5.36 5 9.5C5 15.4 12 21 12 21Z\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"1.8\"\r\n                    stroke-linecap=\"round\"\r\n                    stroke-linejoin=\"round\"\r\n                  \/>\r\n\r\n                  <circle\r\n                    cx=\"12\"\r\n                    cy=\"9.5\"\r\n                    r=\"2.5\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"1.8\"\r\n                  \/>\r\n\r\n                  <path\r\n                    d=\"M17 17.5L19.5 20M19.5 20L17 22.5M19.5 20H15\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"1.8\"\r\n                    stroke-linecap=\"round\"\r\n                    stroke-linejoin=\"round\"\r\n                  \/>\r\n                <\/svg>\r\n\r\n              <\/div>\r\n\r\n              <h3 id=\"ec-sv-tracking-title\">\r\n                Live-sp\u00e5rning av kurirer och leveranser\r\n              <\/h3>\r\n\r\n            <\/div>\r\n\r\n          <\/div>\r\n\r\n          <p class=\"ec-sv-summary\">\r\n            F\u00f6lj kurirernas position, ruttf\u00f6rlopp och leveransstatus\r\n            genom kontrollpaneler som \u00e4r anslutna till kurirappen.\r\n          <\/p>\r\n\r\n          <ul class=\"ec-sv-points\">\r\n\r\n            <li>\r\n\r\n              <span class=\"ec-sv-check\" aria-hidden=\"true\">\r\n                <svg viewBox=\"0 0 20 20\" width=\"18\" height=\"18\" fill=\"none\">\r\n                  <path\r\n                    d=\"M4 10.5L8 14.5L16 6\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"2\"\r\n                    stroke-linecap=\"round\"\r\n                    stroke-linejoin=\"round\"\r\n                  \/>\r\n                <\/svg>\r\n              <\/span>\r\n\r\n              <div>\r\n\r\n                <strong>\r\n                  Position och ruttf\u00f6rlopp\r\n                <\/strong>\r\n\r\n                <p>\r\n                  Visa tillg\u00e4ngliga GPS-positioner fr\u00e5n kurirappen och\r\n                  f\u00f6lj hur den aktiva rutten fortskrider.\r\n                <\/p>\r\n\r\n              <\/div>\r\n\r\n            <\/li>\r\n\r\n            <li>\r\n\r\n              <span class=\"ec-sv-check\" aria-hidden=\"true\">\r\n                <svg viewBox=\"0 0 20 20\" width=\"18\" height=\"18\" fill=\"none\">\r\n                  <path\r\n                    d=\"M4 10.5L8 14.5L16 6\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"2\"\r\n                    stroke-linecap=\"round\"\r\n                    stroke-linejoin=\"round\"\r\n                  \/>\r\n                <\/svg>\r\n              <\/span>\r\n\r\n              <div>\r\n\r\n                <strong>\r\n                  Tydlig leveransstatus\r\n                <\/strong>\r\n\r\n                <p>\r\n                  Se om en leverans \u00e4r p\u00e5g\u00e5ende, f\u00f6rsenad, uppskjuten,\r\n                  slutf\u00f6rd eller beh\u00f6ver hanteras av driftteamet.\r\n                <\/p>\r\n\r\n              <\/div>\r\n\r\n            <\/li>\r\n\r\n            <li>\r\n\r\n              <span class=\"ec-sv-check\" aria-hidden=\"true\">\r\n                <svg viewBox=\"0 0 20 20\" width=\"18\" height=\"18\" fill=\"none\">\r\n                  <path\r\n                    d=\"M4 10.5L8 14.5L16 6\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"2\"\r\n                    stroke-linecap=\"round\"\r\n                    stroke-linejoin=\"round\"\r\n                  \/>\r\n                <\/svg>\r\n              <\/span>\r\n\r\n              <div>\r\n\r\n                <strong>\r\n                  Proaktiv avvikelsehantering\r\n                <\/strong>\r\n\r\n                <p>\r\n                  Identifiera f\u00f6rseningar och andra avvikelser tidigare\r\n                  och vidta \u00e5tg\u00e4rder innan fler leveranser p\u00e5verkas.\r\n                <\/p>\r\n\r\n              <\/div>\r\n\r\n            <\/li>\r\n\r\n          <\/ul>\r\n\r\n        <\/div>\r\n\r\n        <div\r\n          class=\"ec-sv-media\"\r\n          data-ec-sv-video\r\n        >\r\n\r\n          <video\r\n            class=\"ec-sv-video\"\r\n            muted\r\n            loop\r\n            playsinline\r\n            preload=\"none\"\r\n            aria-label=\"Demonstration av live-sp\u00e5rning av kurirer och leveranser i Ecolos Plus\"\r\n          >\r\n            <source\r\n              data-src=\"https:\/\/ecolosplus.se\/wp-content\/uploads\/2024\/10\/Blue-Black-Professiona-Intelligent-Technology-Presentation-7.mp4\"\r\n              type=\"video\/mp4\"\r\n            >\r\n\r\n            Din webbl\u00e4sare st\u00f6der inte videouppspelning.\r\n          <\/video>\r\n\r\n          <div class=\"ec-sv-media-overlay\" aria-hidden=\"true\"><\/div>\r\n\r\n          <div class=\"ec-sv-media-label\" aria-hidden=\"true\">\r\n            <span class=\"ec-sv-status-dot\"><\/span>\r\n            Live\u00f6verblick\r\n          <\/div>\r\n\r\n          <button\r\n            type=\"button\"\r\n            class=\"ec-sv-video-toggle\"\r\n            aria-label=\"Spela upp demonstrationen av leveranssp\u00e5rning\"\r\n            data-ec-sv-toggle\r\n          >\r\n\r\n            <span class=\"ec-sv-play\" aria-hidden=\"true\">\r\n              <svg\r\n                viewBox=\"0 0 24 24\"\r\n                width=\"21\"\r\n                height=\"21\"\r\n                fill=\"currentColor\"\r\n              >\r\n                <path d=\"M8 5.5V18.5L18 12L8 5.5Z\"><\/path>\r\n              <\/svg>\r\n            <\/span>\r\n\r\n            <span class=\"ec-sv-pause\" aria-hidden=\"true\">\r\n              <svg\r\n                viewBox=\"0 0 24 24\"\r\n                width=\"21\"\r\n                height=\"21\"\r\n                fill=\"currentColor\"\r\n              >\r\n                <path d=\"M7 5H10V19H7V5ZM14 5H17V19H14V5Z\"><\/path>\r\n              <\/svg>\r\n            <\/span>\r\n\r\n          <\/button>\r\n\r\n        <\/div>\r\n\r\n      <\/article>\r\n\r\n      <!-- =============================================\r\n           FUNKTION 4\r\n      ============================================== -->\r\n\r\n      <article\r\n        class=\"ec-sv-feature ec-sv-feature--reverse\"\r\n        aria-labelledby=\"ec-sv-support-title\"\r\n      >\r\n\r\n        <div class=\"ec-sv-feature-content\">\r\n\r\n          <div class=\"ec-sv-feature-heading\">\r\n\r\n            <span class=\"ec-sv-number\" aria-hidden=\"true\">\r\n              04\r\n            <\/span>\r\n\r\n            <div class=\"ec-sv-title-group\">\r\n\r\n              <div class=\"ec-sv-icon\" aria-hidden=\"true\">\r\n\r\n                <svg\r\n                  viewBox=\"0 0 24 24\"\r\n                  width=\"27\"\r\n                  height=\"27\"\r\n                  fill=\"none\"\r\n                  xmlns=\"http:\/\/www.w3.org\/2000\/svg\"\r\n                >\r\n                  <path\r\n                    d=\"M4 5.8C4 4.8 4.8 4 5.8 4H18.2C19.2 4 20 4.8 20 5.8V14.2C20 15.2 19.2 16 18.2 16H10L5.5 20V16H5.8C4.8 16 4 15.2 4 14.2V5.8Z\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"1.8\"\r\n                    stroke-linejoin=\"round\"\r\n                  \/>\r\n\r\n                  <path\r\n                    d=\"M8 10H8.01M12 10H12.01M16 10H16.01\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"2.3\"\r\n                    stroke-linecap=\"round\"\r\n                  \/>\r\n                <\/svg>\r\n\r\n              <\/div>\r\n\r\n              <h3 id=\"ec-sv-support-title\">\r\n                AI-baserad chattbot och \u00e4rendehantering\r\n              <\/h3>\r\n\r\n            <\/div>\r\n\r\n          <\/div>\r\n\r\n          <p class=\"ec-sv-summary\">\r\n            Hj\u00e4lp anv\u00e4ndare att hitta information, rapportera problem\r\n            och f\u00f6lja support\u00e4renden genom ett sammanh\u00e4ngande chatt-\r\n            och \u00e4rendefl\u00f6de.\r\n          <\/p>\r\n\r\n          <ul class=\"ec-sv-points\">\r\n\r\n            <li>\r\n\r\n              <span class=\"ec-sv-check\" aria-hidden=\"true\">\r\n                <svg viewBox=\"0 0 20 20\" width=\"18\" height=\"18\" fill=\"none\">\r\n                  <path\r\n                    d=\"M4 10.5L8 14.5L16 6\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"2\"\r\n                    stroke-linecap=\"round\"\r\n                    stroke-linejoin=\"round\"\r\n                  \/>\r\n                <\/svg>\r\n              <\/span>\r\n\r\n              <div>\r\n\r\n                <strong>\r\n                  Snabba svar p\u00e5 vanliga fr\u00e5gor\r\n                <\/strong>\r\n\r\n                <p>\r\n                  Ge anv\u00e4ndare direkt tillg\u00e5ng till relevant v\u00e4gledning\r\n                  utan att driftteamet beh\u00f6ver hantera varje \u00e5terkommande\r\n                  fr\u00e5ga manuellt.\r\n                <\/p>\r\n\r\n              <\/div>\r\n\r\n            <\/li>\r\n\r\n            <li>\r\n\r\n              <span class=\"ec-sv-check\" aria-hidden=\"true\">\r\n                <svg viewBox=\"0 0 20 20\" width=\"18\" height=\"18\" fill=\"none\">\r\n                  <path\r\n                    d=\"M4 10.5L8 14.5L16 6\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"2\"\r\n                    stroke-linecap=\"round\"\r\n                    stroke-linejoin=\"round\"\r\n                  \/>\r\n                <\/svg>\r\n              <\/span>\r\n\r\n              <div>\r\n\r\n                <strong>\r\n                  Skapa support\u00e4renden\r\n                <\/strong>\r\n\r\n                <p>\r\n                  L\u00e5t anv\u00e4ndare rapportera problem och skapa strukturerade\r\n                  support\u00e4renden direkt genom chattboten.\r\n                <\/p>\r\n\r\n              <\/div>\r\n\r\n            <\/li>\r\n\r\n            <li>\r\n\r\n              <span class=\"ec-sv-check\" aria-hidden=\"true\">\r\n                <svg viewBox=\"0 0 20 20\" width=\"18\" height=\"18\" fill=\"none\">\r\n                  <path\r\n                    d=\"M4 10.5L8 14.5L16 6\"\r\n                    stroke=\"currentColor\"\r\n                    stroke-width=\"2\"\r\n                    stroke-linecap=\"round\"\r\n                    stroke-linejoin=\"round\"\r\n                  \/>\r\n                <\/svg>\r\n              <\/span>\r\n\r\n              <div>\r\n\r\n                <strong>\r\n                  F\u00f6lj \u00e4rendestatus\r\n                <\/strong>\r\n\r\n                <p>\r\n                  Ge anv\u00e4ndare b\u00e4ttre insyn i inskickade \u00e4renden och\r\n                  g\u00f6r det enklare att f\u00f6lja upp ol\u00f6sta fr\u00e5gor.\r\n                <\/p>\r\n\r\n              <\/div>\r\n\r\n            <\/li>\r\n\r\n          <\/ul>\r\n\r\n        <\/div>\r\n\r\n        <div\r\n          class=\"ec-sv-media\"\r\n          data-ec-sv-video\r\n        >\r\n\r\n          <video\r\n            class=\"ec-sv-video\"\r\n            muted\r\n            loop\r\n            playsinline\r\n            preload=\"none\"\r\n            aria-label=\"Demonstration av AI-baserad chattbot och \u00e4rendehantering i Ecolos Plus\"\r\n          >\r\n            <source\r\n              data-src=\"https:\/\/ecolosplus.se\/wp-content\/uploads\/2024\/10\/Blue-Black-Professiona-Intelligent-Technology-Presentation-12.mp4\"\r\n              type=\"video\/mp4\"\r\n            >\r\n\r\n            Din webbl\u00e4sare st\u00f6der inte videouppspelning.\r\n          <\/video>\r\n\r\n          <div class=\"ec-sv-media-overlay\" aria-hidden=\"true\"><\/div>\r\n\r\n          <div class=\"ec-sv-media-label\" aria-hidden=\"true\">\r\n            <span class=\"ec-sv-status-dot\"><\/span>\r\n            Support och \u00e4renden\r\n          <\/div>\r\n\r\n          <button\r\n            type=\"button\"\r\n            class=\"ec-sv-video-toggle\"\r\n            aria-label=\"Spela upp demonstrationen av chattbot och \u00e4rendehantering\"\r\n            data-ec-sv-toggle\r\n          >\r\n\r\n            <span class=\"ec-sv-play\" aria-hidden=\"true\">\r\n              <svg\r\n                viewBox=\"0 0 24 24\"\r\n                width=\"21\"\r\n                height=\"21\"\r\n                fill=\"currentColor\"\r\n              >\r\n                <path d=\"M8 5.5V18.5L18 12L8 5.5Z\"><\/path>\r\n              <\/svg>\r\n            <\/span>\r\n\r\n            <span class=\"ec-sv-pause\" aria-hidden=\"true\">\r\n              <svg\r\n                viewBox=\"0 0 24 24\"\r\n                width=\"21\"\r\n                height=\"21\"\r\n                fill=\"currentColor\"\r\n              >\r\n                <path d=\"M7 5H10V19H7V5ZM14 5H17V19H14V5Z\"><\/path>\r\n              <\/svg>\r\n            <\/span>\r\n\r\n          <\/button>\r\n\r\n        <\/div>\r\n\r\n      <\/article>\r\n\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/section>\r\n\r\n<!-- =====================================================\r\n     SEKTION 2: MULTI-HUB\r\n====================================================== -->\r\n\r\n<section\r\n  class=\"ec-sv-features ec-sv-features--hub\"\r\n  aria-labelledby=\"ec-sv-hub-section-title\"\r\n>\r\n  <span class=\"ec-sv-orb ec-sv-orb--three\" aria-hidden=\"true\"><\/span>\r\n  <span class=\"ec-sv-orb ec-sv-orb--four\" aria-hidden=\"true\"><\/span>\r\n\r\n  <div class=\"ec-sv-container\">\r\n\r\n    <header class=\"ec-sv-header\">\r\n\r\n      <p class=\"ec-sv-eyebrow\">\r\n        Hantering av flera hubbar\r\n      <\/p>\r\n\r\n      <h2 id=\"ec-sv-hub-section-title\">\r\n        Samordna leveranser mellan flera hubbar\r\n      <\/h2>\r\n\r\n      <p class=\"ec-sv-intro\">\r\n        Organisera leveransomr\u00e5den och f\u00f6rdela order mellan hubbar\r\n        med tydliga geografiska zoner och konfigurerade operativa regler.\r\n      <\/p>\r\n\r\n    <\/header>\r\n\r\n    <article\r\n      class=\"ec-sv-feature\"\r\n      aria-labelledby=\"ec-sv-hub-title\"\r\n    >\r\n\r\n      <div class=\"ec-sv-feature-content\">\r\n\r\n        <div class=\"ec-sv-feature-heading\">\r\n\r\n          <span class=\"ec-sv-number\" aria-hidden=\"true\">\r\n            05\r\n          <\/span>\r\n\r\n          <div class=\"ec-sv-title-group\">\r\n\r\n            <div class=\"ec-sv-icon\" aria-hidden=\"true\">\r\n\r\n              <svg\r\n                viewBox=\"0 0 24 24\"\r\n                width=\"27\"\r\n                height=\"27\"\r\n                fill=\"none\"\r\n                xmlns=\"http:\/\/www.w3.org\/2000\/svg\"\r\n              >\r\n                <path\r\n                  d=\"M4 20V9L12 4L20 9V20\"\r\n                  stroke=\"currentColor\"\r\n                  stroke-width=\"1.8\"\r\n                  stroke-linecap=\"round\"\r\n                  stroke-linejoin=\"round\"\r\n                \/>\r\n\r\n                <path\r\n                  d=\"M8 20V14H16V20\"\r\n                  stroke=\"currentColor\"\r\n                  stroke-width=\"1.8\"\r\n                  stroke-linejoin=\"round\"\r\n                \/>\r\n\r\n                <path\r\n                  d=\"M8 10H8.01M12 10H12.01M16 10H16.01\"\r\n                  stroke=\"currentColor\"\r\n                  stroke-width=\"2.3\"\r\n                  stroke-linecap=\"round\"\r\n                \/>\r\n\r\n                <path\r\n                  d=\"M2 20H22\"\r\n                  stroke=\"currentColor\"\r\n                  stroke-width=\"1.8\"\r\n                  stroke-linecap=\"round\"\r\n                \/>\r\n              <\/svg>\r\n\r\n            <\/div>\r\n\r\n            <h3 id=\"ec-sv-hub-title\">\r\n              Automatisk hubbtilldelning och zonhantering\r\n            <\/h3>\r\n\r\n          <\/div>\r\n\r\n        <\/div>\r\n\r\n        <p class=\"ec-sv-summary\">\r\n          F\u00f6rdela leveranser till r\u00e4tt hubb utifr\u00e5n definierade\r\n          leveransomr\u00e5den och konfigurerade regler f\u00f6r den regionala\r\n          verksamheten.\r\n        <\/p>\r\n\r\n        <ul class=\"ec-sv-points\">\r\n\r\n          <li>\r\n\r\n            <span class=\"ec-sv-check\" aria-hidden=\"true\">\r\n              <svg viewBox=\"0 0 20 20\" width=\"18\" height=\"18\" fill=\"none\">\r\n                <path\r\n                  d=\"M4 10.5L8 14.5L16 6\"\r\n                  stroke=\"currentColor\"\r\n                  stroke-width=\"2\"\r\n                  stroke-linecap=\"round\"\r\n                  stroke-linejoin=\"round\"\r\n                \/>\r\n              <\/svg>\r\n            <\/span>\r\n\r\n            <div>\r\n\r\n              <strong>\r\n                Centraliserad hantering av flera hubbar\r\n              <\/strong>\r\n\r\n              <p>\r\n                Hantera leveransf\u00f6rdelning mellan flera hubbar och\r\n                serviceomr\u00e5den fr\u00e5n en gemensam operativ plattform.\r\n              <\/p>\r\n\r\n            <\/div>\r\n\r\n          <\/li>\r\n\r\n          <li>\r\n\r\n            <span class=\"ec-sv-check\" aria-hidden=\"true\">\r\n              <svg viewBox=\"0 0 20 20\" width=\"18\" height=\"18\" fill=\"none\">\r\n                <path\r\n                  d=\"M4 10.5L8 14.5L16 6\"\r\n                  stroke=\"currentColor\"\r\n                  stroke-width=\"2\"\r\n                  stroke-linecap=\"round\"\r\n                  stroke-linejoin=\"round\"\r\n                \/>\r\n              <\/svg>\r\n            <\/span>\r\n\r\n            <div>\r\n\r\n              <strong>\r\n                Anpassade leveransomr\u00e5den\r\n              <\/strong>\r\n\r\n              <p>\r\n                Definiera geografiska zoner runt varje hubb med hj\u00e4lp\r\n                av polygonbaserade kartverktyg.\r\n              <\/p>\r\n\r\n            <\/div>\r\n\r\n          <\/li>\r\n\r\n          <li>\r\n\r\n            <span class=\"ec-sv-check\" aria-hidden=\"true\">\r\n              <svg viewBox=\"0 0 20 20\" width=\"18\" height=\"18\" fill=\"none\">\r\n                <path\r\n                  d=\"M4 10.5L8 14.5L16 6\"\r\n                  stroke=\"currentColor\"\r\n                  stroke-width=\"2\"\r\n                  stroke-linecap=\"round\"\r\n                  stroke-linejoin=\"round\"\r\n                \/>\r\n              <\/svg>\r\n            <\/span>\r\n\r\n            <div>\r\n\r\n              <strong>\r\n                Automatisk leveransf\u00f6rdelning\r\n              <\/strong>\r\n\r\n              <p>\r\n                F\u00f6rdela order utifr\u00e5n definierade zoner, n\u00e4rhet och\r\n                andra konfigurerade operativa regler.\r\n              <\/p>\r\n\r\n            <\/div>\r\n\r\n          <\/li>\r\n\r\n          <li>\r\n\r\n            <span class=\"ec-sv-check\" aria-hidden=\"true\">\r\n              <svg viewBox=\"0 0 20 20\" width=\"18\" height=\"18\" fill=\"none\">\r\n                <path\r\n                  d=\"M4 10.5L8 14.5L16 6\"\r\n                  stroke=\"currentColor\"\r\n                  stroke-width=\"2\"\r\n                  stroke-linecap=\"round\"\r\n                  stroke-linejoin=\"round\"\r\n                \/>\r\n              <\/svg>\r\n            <\/span>\r\n\r\n            <div>\r\n\r\n              <strong>\r\n                B\u00e4ttre \u00f6verblick \u00f6ver arbetsbelastningen\r\n              <\/strong>\r\n\r\n              <p>\r\n                F\u00f6lj hur leveranser f\u00f6rdelas mellan hubbar och minska\r\n                risken f\u00f6r att en enskild plats f\u00e5r en oproportionerligt\r\n                h\u00f6g belastning.\r\n              <\/p>\r\n\r\n            <\/div>\r\n\r\n          <\/li>\r\n\r\n        <\/ul>\r\n\r\n      <\/div>\r\n\r\n      <div\r\n        class=\"ec-sv-media\"\r\n        data-ec-sv-video\r\n      >\r\n\r\n        <video\r\n          class=\"ec-sv-video\"\r\n          muted\r\n          loop\r\n          playsinline\r\n          preload=\"none\"\r\n          aria-label=\"Demonstration av automatisk hubbtilldelning och zonhantering i Ecolos Plus\"\r\n        >\r\n          <source\r\n            data-src=\"https:\/\/ecolosplus.se\/wp-content\/uploads\/2024\/10\/Blue-Black-Professiona-Intelligent-Technology-Presentation-4.mp4\"\r\n            type=\"video\/mp4\"\r\n          >\r\n\r\n          Din webbl\u00e4sare st\u00f6der inte videouppspelning.\r\n        <\/video>\r\n\r\n        <div class=\"ec-sv-media-overlay\" aria-hidden=\"true\"><\/div>\r\n\r\n        <div class=\"ec-sv-media-label\" aria-hidden=\"true\">\r\n          <span class=\"ec-sv-status-dot\"><\/span>\r\n          Hubbar och leveranszoner\r\n        <\/div>\r\n\r\n        <button\r\n          type=\"button\"\r\n          class=\"ec-sv-video-toggle\"\r\n          aria-label=\"Spela upp demonstrationen av automatisk hubbtilldelning\"\r\n          data-ec-sv-toggle\r\n        >\r\n\r\n          <span class=\"ec-sv-play\" aria-hidden=\"true\">\r\n            <svg\r\n              viewBox=\"0 0 24 24\"\r\n              width=\"21\"\r\n              height=\"21\"\r\n              fill=\"currentColor\"\r\n            >\r\n              <path d=\"M8 5.5V18.5L18 12L8 5.5Z\"><\/path>\r\n            <\/svg>\r\n          <\/span>\r\n\r\n          <span class=\"ec-sv-pause\" aria-hidden=\"true\">\r\n            <svg\r\n              viewBox=\"0 0 24 24\"\r\n              width=\"21\"\r\n              height=\"21\"\r\n              fill=\"currentColor\"\r\n            >\r\n              <path d=\"M7 5H10V19H7V5ZM14 5H17V19H14V5Z\"><\/path>\r\n            <\/svg>\r\n          <\/span>\r\n\r\n        <\/button>\r\n\r\n      <\/div>\r\n\r\n    <\/article>\r\n\r\n    <div class=\"ec-sv-action\">\r\n\r\n      <a\r\n        href=\"\/sv\/features\/\"\r\n        class=\"ec-sv-button\"\r\n        aria-label=\"Utforska alla funktioner i leveransplattformen Ecolos Plus\"\r\n      >\r\n        Utforska alla plattformsfunktioner\r\n\r\n        <span aria-hidden=\"true\">\r\n          \u2192\r\n        <\/span>\r\n      <\/a>\r\n\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n\r\n\/* =====================================================\r\n   GRUND\r\n===================================================== *\/\r\n\r\n.ec-sv-features,\r\n.ec-sv-features * {\r\n  box-sizing: border-box;\r\n}\r\n\r\n.ec-sv-features {\r\n  position: relative;\r\n  isolation: isolate;\r\n\r\n  width: 100vw;\r\n  max-width: 100vw;\r\n\r\n  margin-left: calc(50% - 50vw);\r\n  padding: clamp(80px, 9vw, 122px) 0;\r\n\r\n  overflow: hidden;\r\n\r\n  color: #0f172a;\r\n}\r\n\r\n.ec-sv-features--live {\r\n  background:\r\n    linear-gradient(\r\n      145deg,\r\n      #f8fafc 0%,\r\n      #ffffff 50%,\r\n      #f2f7ff 100%\r\n    );\r\n}\r\n\r\n.ec-sv-features--hub {\r\n  background:\r\n    linear-gradient(\r\n      145deg,\r\n      #ffffff 0%,\r\n      #f8fafc 52%,\r\n      #eef5ff 100%\r\n    );\r\n\r\n  border-top: 1px solid rgba(148, 163, 184, 0.15);\r\n}\r\n\r\n.ec-sv-container {\r\n  position: relative;\r\n  z-index: 2;\r\n\r\n  width: 100%;\r\n  max-width: 1280px;\r\n\r\n  margin: 0 auto;\r\n  padding: 0 clamp(18px, 4vw, 44px);\r\n}\r\n\r\n\/* =====================================================\r\n   RUBRIK\r\n===================================================== *\/\r\n\r\n.ec-sv-header {\r\n  max-width: 880px;\r\n\r\n  margin: 0 auto clamp(60px, 8vw, 94px);\r\n\r\n  text-align: center;\r\n}\r\n\r\n.ec-sv-eyebrow {\r\n  margin: 0 0 15px;\r\n\r\n  color: #2563eb;\r\n\r\n  font-size: 12px;\r\n  font-weight: 750;\r\n  line-height: 1.3;\r\n  letter-spacing: 0.1em;\r\n  text-transform: uppercase;\r\n}\r\n\r\n.ec-sv-features h2 {\r\n  margin: 0 0 21px;\r\n\r\n  color: #0f172a;\r\n\r\n  font-size: clamp(37px, 5vw, 59px);\r\n  font-weight: 760;\r\n  line-height: 1.08;\r\n  letter-spacing: -0.04em;\r\n\r\n  text-wrap: balance;\r\n}\r\n\r\n.ec-sv-intro {\r\n  max-width: 780px;\r\n\r\n  margin: 0 auto;\r\n\r\n  color: #64748b;\r\n\r\n  font-size: clamp(16px, 1.5vw, 18px);\r\n  line-height: 1.75;\r\n\r\n  text-wrap: pretty;\r\n}\r\n\r\n\/* =====================================================\r\n   LAYOUT\r\n===================================================== *\/\r\n\r\n.ec-sv-feature-list {\r\n  display: grid;\r\n\r\n  gap: clamp(88px, 10vw, 140px);\r\n}\r\n\r\n.ec-sv-feature {\r\n  display: grid;\r\n  grid-template-columns:\r\n    minmax(0, 0.96fr)\r\n    minmax(0, 1.04fr);\r\n\r\n  align-items: center;\r\n\r\n  gap: clamp(45px, 7vw, 88px);\r\n}\r\n\r\n.ec-sv-feature--reverse .ec-sv-feature-content {\r\n  order: 2;\r\n}\r\n\r\n.ec-sv-feature--reverse .ec-sv-media {\r\n  order: 1;\r\n}\r\n\r\n\/* =====================================================\r\n   INNEH\u00c5LL\r\n===================================================== *\/\r\n\r\n.ec-sv-feature-content {\r\n  min-width: 0;\r\n}\r\n\r\n.ec-sv-feature-heading {\r\n  display: flex;\r\n  align-items: flex-start;\r\n\r\n  margin-bottom: 23px;\r\n\r\n  gap: 18px;\r\n}\r\n\r\n.ec-sv-number {\r\n  padding-top: 8px;\r\n\r\n  flex: 0 0 auto;\r\n\r\n  color: #94a3b8;\r\n\r\n  font-size: 13px;\r\n  font-weight: 800;\r\n  line-height: 1;\r\n  letter-spacing: 0.1em;\r\n}\r\n\r\n.ec-sv-title-group {\r\n  min-width: 0;\r\n}\r\n\r\n.ec-sv-icon {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  width: 55px;\r\n  height: 55px;\r\n\r\n  margin-bottom: 19px;\r\n\r\n  border: 1px solid rgba(37, 99, 235, 0.14);\r\n  border-radius: 17px;\r\n\r\n  background:\r\n    linear-gradient(\r\n      135deg,\r\n      rgba(219, 234, 254, 0.94),\r\n      rgba(224, 231, 255, 0.82)\r\n    );\r\n\r\n  color: #2563eb;\r\n\r\n  box-shadow:\r\n    0 12px 28px rgba(37, 99, 235, 0.1),\r\n    inset 0 1px 0 rgba(255, 255, 255, 0.9);\r\n}\r\n\r\n.ec-sv-features h3 {\r\n  max-width: 590px;\r\n\r\n  margin: 0;\r\n\r\n  color: #0f172a;\r\n\r\n  font-size: clamp(27px, 3.1vw, 38px);\r\n  font-weight: 750;\r\n  line-height: 1.16;\r\n  letter-spacing: -0.03em;\r\n\r\n  text-wrap: balance;\r\n}\r\n\r\n.ec-sv-summary {\r\n  max-width: 630px;\r\n\r\n  margin: 0 0 30px;\r\n\r\n  color: #64748b;\r\n\r\n  font-size: 16.5px;\r\n  line-height: 1.72;\r\n}\r\n\r\n\/* =====================================================\r\n   PUNKTER\r\n===================================================== *\/\r\n\r\n.ec-sv-points {\r\n  display: grid;\r\n\r\n  margin: 0;\r\n  padding: 0;\r\n\r\n  gap: 22px;\r\n\r\n  list-style: none;\r\n}\r\n\r\n.ec-sv-points li {\r\n  display: grid;\r\n  grid-template-columns: auto minmax(0, 1fr);\r\n\r\n  gap: 14px;\r\n}\r\n\r\n.ec-sv-check {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  width: 29px;\r\n  height: 29px;\r\n\r\n  margin-top: 1px;\r\n\r\n  flex: 0 0 29px;\r\n\r\n  border-radius: 9px;\r\n\r\n  background: #eff6ff;\r\n\r\n  color: #2563eb;\r\n}\r\n\r\n.ec-sv-points strong {\r\n  display: block;\r\n\r\n  margin: 0 0 5px;\r\n\r\n  color: #1e293b;\r\n\r\n  font-size: 16.5px;\r\n  font-weight: 720;\r\n  line-height: 1.4;\r\n}\r\n\r\n.ec-sv-points p {\r\n  max-width: 580px;\r\n\r\n  margin: 0;\r\n\r\n  color: #64748b;\r\n\r\n  font-size: 14.5px;\r\n  line-height: 1.65;\r\n}\r\n\r\n\/* =====================================================\r\n   VIDEO\r\n===================================================== *\/\r\n\r\n.ec-sv-media {\r\n  position: relative;\r\n\r\n  width: 100%;\r\n  aspect-ratio: 16 \/ 10;\r\n\r\n  overflow: hidden;\r\n\r\n  border: 1px solid rgba(148, 163, 184, 0.22);\r\n  border-radius: 26px;\r\n\r\n  background:\r\n    linear-gradient(\r\n      135deg,\r\n      #0f172a,\r\n      #172554\r\n    );\r\n\r\n  box-shadow:\r\n    0 30px 70px rgba(15, 23, 42, 0.17),\r\n    0 8px 25px rgba(15, 23, 42, 0.08);\r\n\r\n  transform: translateZ(0);\r\n}\r\n\r\n.ec-sv-video {\r\n  display: block;\r\n\r\n  width: 100%;\r\n  height: 100%;\r\n\r\n  object-fit: cover;\r\n  object-position: center;\r\n\r\n  background: #0f172a;\r\n}\r\n\r\n.ec-sv-media-overlay {\r\n  position: absolute;\r\n\r\n  inset: 0;\r\n\r\n  background:\r\n    linear-gradient(\r\n      180deg,\r\n      transparent 55%,\r\n      rgba(2, 6, 23, 0.42) 100%\r\n    );\r\n\r\n  pointer-events: none;\r\n}\r\n\r\n.ec-sv-media-label {\r\n  position: absolute;\r\n\r\n  top: 17px;\r\n  left: 17px;\r\n\r\n  display: inline-flex;\r\n  align-items: center;\r\n\r\n  min-height: 37px;\r\n\r\n  padding: 8px 12px;\r\n\r\n  gap: 8px;\r\n\r\n  border: 1px solid rgba(255, 255, 255, 0.13);\r\n  border-radius: 999px;\r\n\r\n  background: rgba(15, 23, 42, 0.7);\r\n\r\n  color: #f8fafc;\r\n\r\n  font-size: 11.5px;\r\n  font-weight: 700;\r\n  line-height: 1.2;\r\n  letter-spacing: 0.035em;\r\n  text-transform: uppercase;\r\n\r\n  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.16);\r\n\r\n  backdrop-filter: blur(10px);\r\n  -webkit-backdrop-filter: blur(10px);\r\n}\r\n\r\n.ec-sv-status-dot {\r\n  width: 8px;\r\n  height: 8px;\r\n\r\n  flex: 0 0 8px;\r\n\r\n  border-radius: 50%;\r\n\r\n  background: #22d3ee;\r\n\r\n  box-shadow:\r\n    0 0 0 4px rgba(34, 211, 238, 0.13);\r\n}\r\n\r\n\/* =====================================================\r\n   VIDEOKNAPP\r\n===================================================== *\/\r\n\r\n.ec-sv-video-toggle {\r\n  position: absolute;\r\n\r\n  right: 17px;\r\n  bottom: 17px;\r\n\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  width: 45px;\r\n  height: 45px;\r\n\r\n  padding: 0;\r\n\r\n  border: 1px solid rgba(255, 255, 255, 0.15);\r\n  border-radius: 50%;\r\n\r\n  background: rgba(15, 23, 42, 0.78);\r\n\r\n  color: #ffffff;\r\n\r\n  cursor: pointer;\r\n\r\n  box-shadow:\r\n    0 10px 27px rgba(0, 0, 0, 0.23);\r\n\r\n  backdrop-filter: blur(10px);\r\n  -webkit-backdrop-filter: blur(10px);\r\n\r\n  transition:\r\n    transform 0.22s ease,\r\n    background-color 0.22s ease;\r\n}\r\n\r\n.ec-sv-video-toggle:hover {\r\n  transform: scale(1.08);\r\n\r\n  background: rgba(37, 99, 235, 0.92);\r\n}\r\n\r\n.ec-sv-video-toggle:focus-visible {\r\n  outline: 3px solid rgba(125, 211, 252, 0.9);\r\n  outline-offset: 4px;\r\n}\r\n\r\n.ec-sv-pause {\r\n  display: none;\r\n}\r\n\r\n.ec-sv-video-toggle[data-playing=\"true\"] .ec-sv-play {\r\n  display: none;\r\n}\r\n\r\n.ec-sv-video-toggle[data-playing=\"true\"] .ec-sv-pause {\r\n  display: flex;\r\n}\r\n\r\n.ec-sv-play,\r\n.ec-sv-pause {\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n\r\n\/* =====================================================\r\n   CTA\r\n===================================================== *\/\r\n\r\n.ec-sv-action {\r\n  display: flex;\r\n  justify-content: center;\r\n\r\n  margin-top: clamp(58px, 8vw, 86px);\r\n}\r\n\r\n.ec-sv-button {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  min-height: 54px;\r\n\r\n  padding: 15px 24px;\r\n\r\n  gap: 9px;\r\n\r\n  border: 1px solid #2563eb;\r\n  border-radius: 13px;\r\n\r\n  background: #2563eb;\r\n\r\n  color: #ffffff !important;\r\n\r\n  font-size: 15px;\r\n  font-weight: 700;\r\n  line-height: 1.25;\r\n  text-align: center;\r\n  text-decoration: none !important;\r\n\r\n  box-shadow:\r\n    0 13px 31px rgba(37, 99, 235, 0.23);\r\n\r\n  transition:\r\n    transform 0.22s ease,\r\n    background-color 0.22s ease,\r\n    box-shadow 0.22s ease;\r\n}\r\n\r\n.ec-sv-button:hover {\r\n  transform: translateY(-3px);\r\n\r\n  background: #1d4ed8;\r\n\r\n  color: #ffffff !important;\r\n\r\n  box-shadow:\r\n    0 18px 39px rgba(37, 99, 235, 0.31);\r\n}\r\n\r\n.ec-sv-button:focus-visible {\r\n  outline: 3px solid rgba(37, 99, 235, 0.32);\r\n  outline-offset: 5px;\r\n}\r\n\r\n\/* =====================================================\r\n   BAKGRUND\r\n===================================================== *\/\r\n\r\n.ec-sv-orb {\r\n  position: absolute;\r\n  z-index: 0;\r\n\r\n  display: block;\r\n\r\n  border-radius: 50%;\r\n\r\n  pointer-events: none;\r\n}\r\n\r\n.ec-sv-orb--one,\r\n.ec-sv-orb--three {\r\n  top: -230px;\r\n  right: -180px;\r\n\r\n  width: 560px;\r\n  height: 560px;\r\n\r\n  background:\r\n    radial-gradient(\r\n      circle,\r\n      rgba(59, 130, 246, 0.11),\r\n      transparent 68%\r\n    );\r\n}\r\n\r\n.ec-sv-orb--two,\r\n.ec-sv-orb--four {\r\n  bottom: -270px;\r\n  left: -210px;\r\n\r\n  width: 620px;\r\n  height: 620px;\r\n\r\n  background:\r\n    radial-gradient(\r\n      circle,\r\n      rgba(99, 102, 241, 0.09),\r\n      transparent 68%\r\n    );\r\n}\r\n\r\n\/* =====================================================\r\n   SURFPLATTA\r\n===================================================== *\/\r\n\r\n@media (max-width: 950px) {\r\n\r\n  .ec-sv-feature,\r\n  .ec-sv-feature--reverse {\r\n    grid-template-columns: 1fr;\r\n\r\n    gap: 45px;\r\n  }\r\n\r\n  .ec-sv-feature--reverse .ec-sv-feature-content,\r\n  .ec-sv-feature--reverse .ec-sv-media {\r\n    order: initial;\r\n  }\r\n\r\n  .ec-sv-feature-content {\r\n    max-width: 720px;\r\n\r\n    margin: 0 auto;\r\n  }\r\n\r\n  .ec-sv-media {\r\n    max-width: 760px;\r\n\r\n    margin: 0 auto;\r\n  }\r\n\r\n}\r\n\r\n\/* =====================================================\r\n   MOBIL\r\n===================================================== *\/\r\n\r\n@media (max-width: 620px) {\r\n\r\n  .ec-sv-features {\r\n    padding: 72px 0;\r\n  }\r\n\r\n  .ec-sv-container {\r\n    padding: 0 17px;\r\n  }\r\n\r\n  .ec-sv-header {\r\n    margin-bottom: 55px;\r\n  }\r\n\r\n  .ec-sv-features h2 {\r\n    font-size: 35px;\r\n    line-height: 1.12;\r\n  }\r\n\r\n  .ec-sv-intro {\r\n    font-size: 15.5px;\r\n    line-height: 1.7;\r\n  }\r\n\r\n  .ec-sv-feature-list {\r\n    gap: 78px;\r\n  }\r\n\r\n  .ec-sv-feature {\r\n    gap: 34px;\r\n  }\r\n\r\n  .ec-sv-feature-heading {\r\n    gap: 11px;\r\n  }\r\n\r\n  .ec-sv-number {\r\n    padding-top: 6px;\r\n\r\n    font-size: 11px;\r\n  }\r\n\r\n  .ec-sv-icon {\r\n    width: 49px;\r\n    height: 49px;\r\n\r\n    margin-bottom: 16px;\r\n\r\n    border-radius: 15px;\r\n  }\r\n\r\n  .ec-sv-features h3 {\r\n    font-size: 27px;\r\n    line-height: 1.2;\r\n  }\r\n\r\n  .ec-sv-summary {\r\n    margin-bottom: 27px;\r\n\r\n    font-size: 15.5px;\r\n  }\r\n\r\n  .ec-sv-points {\r\n    gap: 20px;\r\n  }\r\n\r\n  .ec-sv-points strong {\r\n    font-size: 16px;\r\n  }\r\n\r\n  .ec-sv-points p {\r\n    font-size: 14px;\r\n  }\r\n\r\n  .ec-sv-media {\r\n    aspect-ratio: 4 \/ 3;\r\n\r\n    border-radius: 20px;\r\n  }\r\n\r\n  .ec-sv-media-label {\r\n    top: 12px;\r\n    left: 12px;\r\n\r\n    font-size: 10px;\r\n  }\r\n\r\n  .ec-sv-video-toggle {\r\n    right: 12px;\r\n    bottom: 12px;\r\n\r\n    width: 42px;\r\n    height: 42px;\r\n  }\r\n\r\n  .ec-sv-button {\r\n    width: 100%;\r\n    max-width: 390px;\r\n  }\r\n\r\n}\r\n\r\n\/* =====================================================\r\n   MINSKAD R\u00d6RELSE\r\n===================================================== *\/\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n\r\n  .ec-sv-video-toggle,\r\n  .ec-sv-button {\r\n    transition: none !important;\r\n  }\r\n\r\n  .ec-sv-video-toggle:hover,\r\n  .ec-sv-button:hover {\r\n    transform: none;\r\n  }\r\n\r\n}\r\n\r\n<\/style>\r\n\r\n<script>\r\n(function () {\r\n\r\n  function initialiseSwedishFeatureVideos() {\r\n\r\n    const mediaItems = document.querySelectorAll(\r\n      \"[data-ec-sv-video]\"\r\n    );\r\n\r\n    if (!mediaItems.length) {\r\n      return;\r\n    }\r\n\r\n    const reducedMotion = window.matchMedia(\r\n      \"(prefers-reduced-motion: reduce)\"\r\n    );\r\n\r\n    mediaItems.forEach(function (media) {\r\n\r\n      if (media.dataset.initialised === \"true\") {\r\n        return;\r\n      }\r\n\r\n      media.dataset.initialised = \"true\";\r\n\r\n      const video = media.querySelector(\".ec-sv-video\");\r\n      const toggle = media.querySelector(\"[data-ec-sv-toggle]\");\r\n\r\n      const source = video\r\n        ? video.querySelector(\"source[data-src]\")\r\n        : null;\r\n\r\n      if (!video || !toggle || !source) {\r\n        return;\r\n      }\r\n\r\n      let loaded = false;\r\n      let manuallyPaused = reducedMotion.matches;\r\n\r\n      function loadVideo() {\r\n\r\n        if (loaded) {\r\n          return;\r\n        }\r\n\r\n        source.src = source.dataset.src;\r\n        source.removeAttribute(\"data-src\");\r\n\r\n        video.load();\r\n\r\n        loaded = true;\r\n\r\n      }\r\n\r\n      function updateButton() {\r\n\r\n        const playing =\r\n          !video.paused && !video.ended;\r\n\r\n        toggle.dataset.playing =\r\n          playing ? \"true\" : \"false\";\r\n\r\n        toggle.setAttribute(\r\n          \"aria-label\",\r\n          playing\r\n            ? \"Pausa videodemonstrationen\"\r\n            : \"Spela upp videodemonstrationen\"\r\n        );\r\n\r\n      }\r\n\r\n      function playVideo() {\r\n\r\n        loadVideo();\r\n\r\n        const playPromise = video.play();\r\n\r\n        if (\r\n          playPromise &&\r\n          typeof playPromise.catch === \"function\"\r\n        ) {\r\n          playPromise.catch(updateButton);\r\n        }\r\n\r\n      }\r\n\r\n      function pauseVideo() {\r\n        video.pause();\r\n      }\r\n\r\n      toggle.addEventListener(\"click\", function () {\r\n\r\n        loadVideo();\r\n\r\n        if (video.paused) {\r\n\r\n          manuallyPaused = false;\r\n          playVideo();\r\n\r\n        } else {\r\n\r\n          manuallyPaused = true;\r\n          pauseVideo();\r\n\r\n        }\r\n\r\n      });\r\n\r\n      video.addEventListener(\"play\", updateButton);\r\n      video.addEventListener(\"pause\", updateButton);\r\n      video.addEventListener(\"ended\", updateButton);\r\n\r\n      if (\"IntersectionObserver\" in window) {\r\n\r\n        const observer = new IntersectionObserver(\r\n          function (entries) {\r\n\r\n            entries.forEach(function (entry) {\r\n\r\n              if (entry.isIntersecting) {\r\n\r\n                loadVideo();\r\n\r\n                if (\r\n                  !reducedMotion.matches &&\r\n                  !manuallyPaused\r\n                ) {\r\n                  playVideo();\r\n                }\r\n\r\n              } else {\r\n\r\n                pauseVideo();\r\n\r\n              }\r\n\r\n            });\r\n\r\n          },\r\n          {\r\n            root: null,\r\n            rootMargin: \"170px 0px\",\r\n            threshold: 0.22\r\n          }\r\n        );\r\n\r\n        observer.observe(media);\r\n\r\n      } else {\r\n\r\n        loadVideo();\r\n\r\n      }\r\n\r\n      if (\r\n        typeof reducedMotion.addEventListener === \"function\"\r\n      ) {\r\n\r\n        reducedMotion.addEventListener(\r\n          \"change\",\r\n          function (event) {\r\n\r\n            if (event.matches) {\r\n\r\n              manuallyPaused = true;\r\n              pauseVideo();\r\n\r\n            }\r\n\r\n          }\r\n        );\r\n\r\n      }\r\n\r\n      updateButton();\r\n\r\n    });\r\n\r\n  }\r\n\r\n  if (document.readyState === \"loading\") {\r\n\r\n    document.addEventListener(\r\n      \"DOMContentLoaded\",\r\n      initialiseSwedishFeatureVideos\r\n    );\r\n\r\n  } else {\r\n\r\n    initialiseSwedishFeatureVideos();\r\n\r\n  }\r\n\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-b5e8306 e-flex e-con-boxed e-con e-parent\" data-id=\"b5e8306\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b12cc11 elementor-widget elementor-widget-html\" data-id=\"b12cc11\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- \u0627\u0633\u062a\u0627\u06cc\u0644 \u062b\u0627\u0628\u062a \u0628\u0631\u0627\u06cc \u0686\u062a\u200c\u0628\u0627\u062a -->\n<style>\n.chatbot-container {\n  position: fixed;\n  bottom: 30px;\n  right: 20px;\n  z-index: 1000;\n  font-family: Arial, sans-serif;\n}\n.chatbot-button {\n  width: 60px; height: 60px;\n  background-color: #0056d2; border:none; border-radius:50%;\n  color:#fff; font-size:24px; cursor:pointer;\n  display:flex; align-items:center; justify-content:center;\n  box-shadow:0 4px 12px rgba(0,0,0,0.2);\n  transition:background-color .3s, transform .2s;\n}\n.chatbot-modal {\n  position: fixed; bottom:100px; right:20px;\n  width:360px; max-width:90%; height:520px;\n  background:#fff; border-radius:10px;\n  box-shadow:0 8px 24px rgba(0,0,0,0.2);\n  overflow:hidden; display:none; flex-direction:column;\n  transform: translateY(20px); opacity:0;\n  transition: transform .3s ease-out, opacity .3s ease-out;\n}\n.chatbot-modal.open {\n  display:flex; transform: translateY(0); opacity:1;\n}\n.chatbot-iframe {\n  border:none; width:100%; height:calc(100% - 40px);\n}\n.chatbot-close {\n  background:#f0f0f0; color:#333; border:none;\n  width:100%; padding:10px; cursor:pointer;\n  font-size:14px; transition:background .3s,color .3s;\n}\n.chatbot-close:hover { background:#e0e0e0; color:#f00; }\n<\/style>\n\n<!-- \u0633\u0627\u062e\u062a\u0627\u0631 HTML -->\n<div class=\"chatbot-container\">\n  <button id=\"chatbotButton\" class=\"chatbot-button\" aria-label=\"Open Chatbot\">\n    \ud83d\udcac\n  <\/button>\n  <div id=\"chatbotModal\" class=\"chatbot-modal\">\n    <iframe id=\"chatbotIframe\" class=\"chatbot-iframe\"\n            data-src=\"https:\/\/chatbot.trendplus.se\/ui\/ecolos-chatbot\"\n            src=\"about:blank\" loading=\"lazy\"\n            sandbox=\"allow-scripts allow-same-origin\">\n    <\/iframe>\n    <button id=\"closeChatbot\" class=\"chatbot-close\">Close<\/button>\n  <\/div>\n<\/div>\n\n<!-- \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u062a\u0639\u0627\u0645\u0644 -->\n<script>\n(function(){\n  const btn    = document.getElementById('chatbotButton');\n  const modal  = document.getElementById('chatbotModal');\n  const iframe = document.getElementById('chatbotIframe');\n  const close  = document.getElementById('closeChatbot');\n\n  btn.addEventListener('click', e => {\n    e.stopPropagation();\n    if (!modal.classList.contains('open')) {\n      if (iframe.src === 'about:blank')\n        iframe.src = iframe.dataset.src;\n      modal.classList.add('open');\n    } else modal.classList.remove('open');\n  });\n  close.addEventListener('click', e => { e.stopPropagation(); modal.classList.remove('open'); });\n  document.addEventListener('click', e => {\n    if (modal.classList.contains('open')\n        && !modal.contains(e.target)\n        && !btn.contains(e.target)) {\n      modal.classList.remove('open');\n    }\n  });\n  modal.addEventListener('click', e => e.stopPropagation());\n})();\n<\/script>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-07b4b6c e-con-full e-flex e-con e-parent\" data-id=\"07b4b6c\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\" data-no-translation=\"\">\n\t\t\t\t<div class=\"elementor-element elementor-element-90c12d2 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"90c12d2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- ===== Ecolos+ Slutlig CTA \u2013 Svensk version ===== -->\r\n\r\n<section\r\n  class=\"ec-sv-final-cta\"\r\n  aria-labelledby=\"ec-sv-final-cta-title\"\r\n>\r\n  <span\r\n    class=\"ec-sv-final-cta-glow ec-sv-final-cta-glow--one\"\r\n    aria-hidden=\"true\"\r\n  ><\/span>\r\n\r\n  <span\r\n    class=\"ec-sv-final-cta-glow ec-sv-final-cta-glow--two\"\r\n    aria-hidden=\"true\"\r\n  ><\/span>\r\n\r\n  <span\r\n    class=\"ec-sv-final-cta-grid\"\r\n    aria-hidden=\"true\"\r\n  ><\/span>\r\n\r\n  <div class=\"ec-sv-final-cta-container\">\r\n\r\n    <p class=\"ec-sv-final-cta-eyebrow\">\r\n      Ta n\u00e4sta steg\r\n    <\/p>\r\n\r\n    <h2 id=\"ec-sv-final-cta-title\">\r\n      Se hur Ecolos+ kan st\u00f6dja er leveransverksamhet\r\n    <\/h2>\r\n\r\n    <p class=\"ec-sv-final-cta-description\">\r\n      Ber\u00e4tta om era leveransvolymer, nuvarande arbetsfl\u00f6den och\r\n      operativa utmaningar. V\u00e5rt team kontaktar er f\u00f6r att boka ett\r\n      kostnadsfritt introduktionsm\u00f6te och diskutera hur Ecolos+ kan\r\n      passa in i verksamheten.\r\n    <\/p>\r\n\r\n    <div class=\"ec-sv-final-cta-actions\">\r\n\r\n      <a\r\n        href=\"\/sv\/lets-talk\/\"\r\n        class=\"ec-sv-final-cta-button\"\r\n        aria-label=\"Boka ett kostnadsfritt introduktionsm\u00f6te om Ecolos Plus\"\r\n      >\r\n        Boka ett kostnadsfritt introduktionsm\u00f6te\r\n\r\n        <span\r\n          class=\"ec-sv-final-cta-arrow\"\r\n          aria-hidden=\"true\"\r\n        >\r\n          \u2192\r\n        <\/span>\r\n      <\/a>\r\n\r\n    <\/div>\r\n\r\n    <ul\r\n      class=\"ec-sv-final-cta-points\"\r\n      aria-label=\"Information om introduktionsm\u00f6tet\"\r\n    >\r\n\r\n      <li>\r\n\r\n        <span\r\n          class=\"ec-sv-final-cta-check\"\r\n          aria-hidden=\"true\"\r\n        >\r\n          <svg\r\n            viewBox=\"0 0 20 20\"\r\n            width=\"17\"\r\n            height=\"17\"\r\n            fill=\"none\"\r\n          >\r\n            <path\r\n              d=\"M4 10.5L8 14.5L16 6\"\r\n              stroke=\"currentColor\"\r\n              stroke-width=\"2\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\"\r\n            \/>\r\n          <\/svg>\r\n        <\/span>\r\n\r\n        Kostnadsfritt introduktionsm\u00f6te\r\n\r\n      <\/li>\r\n\r\n      <li>\r\n\r\n        <span\r\n          class=\"ec-sv-final-cta-check\"\r\n          aria-hidden=\"true\"\r\n        >\r\n          <svg\r\n            viewBox=\"0 0 20 20\"\r\n            width=\"17\"\r\n            height=\"17\"\r\n            fill=\"none\"\r\n          >\r\n            <path\r\n              d=\"M4 10.5L8 14.5L16 6\"\r\n              stroke=\"currentColor\"\r\n              stroke-width=\"2\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\"\r\n            \/>\r\n          <\/svg>\r\n        <\/span>\r\n\r\n        Ingen f\u00f6rpliktelse\r\n\r\n      <\/li>\r\n\r\n      <li>\r\n\r\n        <span\r\n          class=\"ec-sv-final-cta-check\"\r\n          aria-hidden=\"true\"\r\n        >\r\n          <svg\r\n            viewBox=\"0 0 20 20\"\r\n            width=\"17\"\r\n            height=\"17\"\r\n            fill=\"none\"\r\n          >\r\n            <path\r\n              d=\"M4 10.5L8 14.5L16 6\"\r\n              stroke=\"currentColor\"\r\n              stroke-width=\"2\"\r\n              stroke-linecap=\"round\"\r\n              stroke-linejoin=\"round\"\r\n            \/>\r\n          <\/svg>\r\n        <\/span>\r\n\r\n        Fokus p\u00e5 ert leveransfl\u00f6de\r\n\r\n      <\/li>\r\n\r\n    <\/ul>\r\n\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n\r\n\/* =========================================\r\n   ECOLOS+ SLUTLIG CTA\r\n========================================= *\/\r\n\r\n.ec-sv-final-cta,\r\n.ec-sv-final-cta * {\r\n  box-sizing: border-box;\r\n}\r\n\r\n.ec-sv-final-cta {\r\n  position: relative;\r\n  isolation: isolate;\r\n\r\n  width: 100vw;\r\n  max-width: 100vw;\r\n\r\n  margin-left: calc(50% - 50vw);\r\n  padding: clamp(78px, 9vw, 118px) 0;\r\n\r\n  overflow: hidden;\r\n\r\n  color: #ffffff;\r\n\r\n  background:\r\n    linear-gradient(\r\n      135deg,\r\n      #1e3a8a 0%,\r\n      #1d4ed8 48%,\r\n      #3730a3 100%\r\n    );\r\n}\r\n\r\n.ec-sv-final-cta-container {\r\n  position: relative;\r\n  z-index: 3;\r\n\r\n  width: 100%;\r\n  max-width: 980px;\r\n\r\n  margin: 0 auto;\r\n  padding: 0 clamp(20px, 5vw, 42px);\r\n\r\n  text-align: center;\r\n}\r\n\r\n\/* =========================================\r\n   RUBRIK\r\n========================================= *\/\r\n\r\n.ec-sv-final-cta-eyebrow {\r\n  margin: 0 0 16px;\r\n\r\n  color: #bfdbfe;\r\n\r\n  font-size: 12px;\r\n  font-weight: 750;\r\n  line-height: 1.3;\r\n  letter-spacing: 0.1em;\r\n  text-transform: uppercase;\r\n}\r\n\r\n.ec-sv-final-cta h2 {\r\n  max-width: 870px;\r\n\r\n  margin: 0 auto 23px;\r\n\r\n  color: #ffffff;\r\n\r\n  font-size: clamp(38px, 5vw, 61px);\r\n  font-weight: 760;\r\n  line-height: 1.08;\r\n  letter-spacing: -0.04em;\r\n\r\n  text-wrap: balance;\r\n}\r\n\r\n.ec-sv-final-cta-description {\r\n  max-width: 780px;\r\n\r\n  margin: 0 auto;\r\n\r\n  color: rgba(219, 234, 254, 0.92);\r\n\r\n  font-size: clamp(16px, 1.6vw, 18px);\r\n  line-height: 1.75;\r\n\r\n  text-wrap: pretty;\r\n}\r\n\r\n\/* =========================================\r\n   CTA-KNAPP\r\n========================================= *\/\r\n\r\n.ec-sv-final-cta-actions {\r\n  display: flex;\r\n  justify-content: center;\r\n\r\n  margin-top: 37px;\r\n}\r\n\r\n.ec-sv-final-cta-button {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  min-height: 58px;\r\n\r\n  padding: 17px 29px;\r\n\r\n  gap: 10px;\r\n\r\n  border: 1px solid rgba(255, 255, 255, 0.72);\r\n  border-radius: 15px;\r\n\r\n  background: #ffffff;\r\n\r\n  color: #1e40af !important;\r\n\r\n  font-size: 16px;\r\n  font-weight: 750;\r\n  line-height: 1.25;\r\n  text-align: center;\r\n  text-decoration: none !important;\r\n\r\n  box-shadow:\r\n    0 18px 42px rgba(15, 23, 42, 0.25),\r\n    inset 0 1px 0 rgba(255, 255, 255, 0.9);\r\n\r\n  transition:\r\n    transform 0.23s ease,\r\n    box-shadow 0.23s ease,\r\n    background-color 0.23s ease;\r\n}\r\n\r\n.ec-sv-final-cta-button:hover {\r\n  transform: translateY(-3px);\r\n\r\n  background: #eff6ff;\r\n\r\n  color: #1d4ed8 !important;\r\n\r\n  box-shadow:\r\n    0 24px 52px rgba(15, 23, 42, 0.31),\r\n    inset 0 1px 0 rgba(255, 255, 255, 0.95);\r\n}\r\n\r\n.ec-sv-final-cta-button:focus-visible {\r\n  outline: 4px solid rgba(186, 230, 253, 0.95);\r\n  outline-offset: 5px;\r\n}\r\n\r\n.ec-sv-final-cta-arrow {\r\n  display: inline-block;\r\n\r\n  flex: 0 0 auto;\r\n\r\n  font-size: 21px;\r\n  line-height: 1;\r\n\r\n  transition: transform 0.23s ease;\r\n}\r\n\r\n.ec-sv-final-cta-button:hover\r\n.ec-sv-final-cta-arrow {\r\n  transform: translateX(4px);\r\n}\r\n\r\n\/* =========================================\r\n   F\u00d6RTROENDEPUNKTER\r\n========================================= *\/\r\n\r\n.ec-sv-final-cta-points {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-wrap: wrap;\r\n\r\n  margin: 29px 0 0;\r\n  padding: 0;\r\n\r\n  gap: 12px 22px;\r\n\r\n  list-style: none;\r\n}\r\n\r\n.ec-sv-final-cta-points li {\r\n  display: inline-flex;\r\n  align-items: center;\r\n\r\n  gap: 7px;\r\n\r\n  color: rgba(219, 234, 254, 0.9);\r\n\r\n  font-size: 13.5px;\r\n  font-weight: 600;\r\n  line-height: 1.4;\r\n}\r\n\r\n.ec-sv-final-cta-check {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n\r\n  width: 24px;\r\n  height: 24px;\r\n\r\n  flex: 0 0 24px;\r\n\r\n  border: 1px solid rgba(255, 255, 255, 0.19);\r\n  border-radius: 50%;\r\n\r\n  background: rgba(255, 255, 255, 0.1);\r\n\r\n  color: #bfdbfe;\r\n}\r\n\r\n\/* =========================================\r\n   BAKGRUNDSDEKORATION\r\n========================================= *\/\r\n\r\n.ec-sv-final-cta-glow {\r\n  position: absolute;\r\n  z-index: 0;\r\n\r\n  display: block;\r\n\r\n  border-radius: 50%;\r\n\r\n  pointer-events: none;\r\n}\r\n\r\n.ec-sv-final-cta-glow--one {\r\n  top: -280px;\r\n  left: -170px;\r\n\r\n  width: 600px;\r\n  height: 600px;\r\n\r\n  background:\r\n    radial-gradient(\r\n      circle,\r\n      rgba(34, 211, 238, 0.28),\r\n      transparent 68%\r\n    );\r\n}\r\n\r\n.ec-sv-final-cta-glow--two {\r\n  right: -220px;\r\n  bottom: -330px;\r\n\r\n  width: 680px;\r\n  height: 680px;\r\n\r\n  background:\r\n    radial-gradient(\r\n      circle,\r\n      rgba(139, 92, 246, 0.29),\r\n      transparent 68%\r\n    );\r\n}\r\n\r\n.ec-sv-final-cta-grid {\r\n  position: absolute;\r\n  z-index: 1;\r\n\r\n  inset: 0;\r\n\r\n  background-image:\r\n    linear-gradient(\r\n      rgba(255, 255, 255, 0.035) 1px,\r\n      transparent 1px\r\n    ),\r\n    linear-gradient(\r\n      90deg,\r\n      rgba(255, 255, 255, 0.035) 1px,\r\n      transparent 1px\r\n    );\r\n\r\n  background-size: 48px 48px;\r\n\r\n  pointer-events: none;\r\n\r\n  mask-image:\r\n    radial-gradient(\r\n      circle at center,\r\n      #000 10%,\r\n      transparent 75%\r\n    );\r\n\r\n  -webkit-mask-image:\r\n    radial-gradient(\r\n      circle at center,\r\n      #000 10%,\r\n      transparent 75%\r\n    );\r\n}\r\n\r\n.ec-sv-final-cta::after {\r\n  content: \"\";\r\n\r\n  position: absolute;\r\n  z-index: 2;\r\n\r\n  inset: 0;\r\n\r\n  background:\r\n    linear-gradient(\r\n      180deg,\r\n      rgba(15, 23, 42, 0.05),\r\n      rgba(15, 23, 42, 0.14)\r\n    );\r\n\r\n  pointer-events: none;\r\n}\r\n\r\n\/* =========================================\r\n   MOBIL\r\n========================================= *\/\r\n\r\n@media (max-width: 620px) {\r\n\r\n  .ec-sv-final-cta {\r\n    padding: 72px 0;\r\n  }\r\n\r\n  .ec-sv-final-cta-container {\r\n    padding: 0 17px;\r\n  }\r\n\r\n  .ec-sv-final-cta h2 {\r\n    font-size: 36px;\r\n    line-height: 1.12;\r\n  }\r\n\r\n  .ec-sv-final-cta-description {\r\n    font-size: 15.5px;\r\n    line-height: 1.7;\r\n  }\r\n\r\n  .ec-sv-final-cta-actions {\r\n    margin-top: 31px;\r\n  }\r\n\r\n  .ec-sv-final-cta-button {\r\n    width: 100%;\r\n    max-width: 420px;\r\n\r\n    padding: 16px 19px;\r\n\r\n    font-size: 14.5px;\r\n  }\r\n\r\n  .ec-sv-final-cta-points {\r\n    align-items: flex-start;\r\n    flex-direction: column;\r\n\r\n    width: max-content;\r\n    max-width: 100%;\r\n\r\n    margin: 26px auto 0;\r\n\r\n    text-align: left;\r\n  }\r\n\r\n}\r\n\r\n\/* =========================================\r\n   MINSKAD R\u00d6RELSE\r\n========================================= *\/\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n\r\n  .ec-sv-final-cta-button,\r\n  .ec-sv-final-cta-arrow {\r\n    transition: none !important;\r\n  }\r\n\r\n  .ec-sv-final-cta-button:hover {\r\n    transform: none;\r\n  }\r\n\r\n  .ec-sv-final-cta-button:hover\r\n  .ec-sv-final-cta-arrow {\r\n    transform: none;\r\n  }\r\n\r\n}\r\n\r\n<\/style>\t\t\t\t<\/div>\n\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>AI-Powered Last-Mile Delivery Management Reduce Delivery Costs with an All-in-One Last-Mile Platform Ecolos+ connects retailers, transporters, couriers, and recipients through web dashboards, mobile apps, and API services\u2014helping delivery teams streamline operations, improve visibility, and scale more efficiently. Book a Free Introduction Meeting \u2192 AI-driven hantering av last mile-leveranser S\u00e4nk leveranskostnaderna med en komplett plattform f\u00f6r [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-64","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.0 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Home - Ecolos Plus<\/title>\n<meta name=\"description\" content=\"Ecolos Plus is a SaaS platform employing AI, data analytics, and mathematic discrete optimisation to revolutionise last-mile deliveries.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/ecolosplus.se\/sv\/\" \/>\n<meta property=\"og:locale\" content=\"sv_SE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Home - Ecolos Plus\" \/>\n<meta property=\"og:description\" content=\"Ecolos Plus is a SaaS platform employing AI, data analytics, and mathematic discrete optimisation to revolutionise last-mile deliveries.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/ecolosplus.se\/sv\/\" \/>\n<meta property=\"og:site_name\" content=\"Ecolos Plus\" \/>\n<meta property=\"article:modified_time\" content=\"2026-07-15T13:56:24+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/ecolosplus.se\/wp-content\/uploads\/2023\/10\/Untitled-design-6.gif\" \/>\n\t<meta property=\"og:image:width\" content=\"1790\" \/>\n\t<meta property=\"og:image:height\" content=\"1007\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/gif\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Ber\u00e4knad l\u00e4stid\" \/>\n\t<meta name=\"twitter:data1\" content=\"14 minuter\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/ecolosplus.se\\\/\",\"url\":\"https:\\\/\\\/ecolosplus.se\\\/\",\"name\":\"Home - Ecolos Plus\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/ecolosplus.se\\\/#website\"},\"datePublished\":\"2023-10-04T12:58:51+00:00\",\"dateModified\":\"2026-07-15T13:56:24+00:00\",\"description\":\"Ecolos Plus is a SaaS platform employing AI, data analytics, and mathematic discrete optimisation to revolutionise last-mile deliveries.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/ecolosplus.se\\\/#breadcrumb\"},\"inLanguage\":\"sv-SE\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/ecolosplus.se\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/ecolosplus.se\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/ecolosplus.se\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Home\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/ecolosplus.se\\\/#website\",\"url\":\"https:\\\/\\\/ecolosplus.se\\\/\",\"name\":\"Ecolos+\",\"description\":\"AI-Powered Last-Mile Delivery Platform\",\"publisher\":{\"@id\":\"https:\\\/\\\/ecolosplus.se\\\/#organization\"},\"alternateName\":\"Ecolos Plus\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/ecolosplus.se\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"sv-SE\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/ecolosplus.se\\\/#organization\",\"name\":\"Ecolos+\",\"url\":\"https:\\\/\\\/ecolosplus.se\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"sv-SE\",\"@id\":\"https:\\\/\\\/ecolosplus.se\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/ecolosplus.se\\\/wp-content\\\/uploads\\\/2023\\\/10\\\/logo01.png\",\"contentUrl\":\"https:\\\/\\\/ecolosplus.se\\\/wp-content\\\/uploads\\\/2023\\\/10\\\/logo01.png\",\"width\":742,\"height\":314,\"caption\":\"Ecolos+\"},\"image\":{\"@id\":\"https:\\\/\\\/ecolosplus.se\\\/#\\\/schema\\\/logo\\\/image\\\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Home - Ecolos Plus","description":"Ecolos Plus is a SaaS platform employing AI, data analytics, and mathematic discrete optimisation to revolutionise last-mile deliveries.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/ecolosplus.se\/sv\/","og_locale":"sv_SE","og_type":"article","og_title":"Home - Ecolos Plus","og_description":"Ecolos Plus is a SaaS platform employing AI, data analytics, and mathematic discrete optimisation to revolutionise last-mile deliveries.","og_url":"https:\/\/ecolosplus.se\/sv\/","og_site_name":"Ecolos Plus","article_modified_time":"2026-07-15T13:56:24+00:00","og_image":[{"width":1790,"height":1007,"url":"https:\/\/ecolosplus.se\/wp-content\/uploads\/2023\/10\/Untitled-design-6.gif","type":"image\/gif"}],"twitter_card":"summary_large_image","twitter_misc":{"Ber\u00e4knad l\u00e4stid":"14 minuter"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/ecolosplus.se\/","url":"https:\/\/ecolosplus.se\/","name":"Home - Ecolos Plus","isPartOf":{"@id":"https:\/\/ecolosplus.se\/#website"},"datePublished":"2023-10-04T12:58:51+00:00","dateModified":"2026-07-15T13:56:24+00:00","description":"Ecolos Plus is a SaaS platform employing AI, data analytics, and mathematic discrete optimisation to revolutionise last-mile deliveries.","breadcrumb":{"@id":"https:\/\/ecolosplus.se\/#breadcrumb"},"inLanguage":"sv-SE","potentialAction":[{"@type":"ReadAction","target":["https:\/\/ecolosplus.se\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/ecolosplus.se\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/ecolosplus.se\/"},{"@type":"ListItem","position":2,"name":"Home"}]},{"@type":"WebSite","@id":"https:\/\/ecolosplus.se\/#website","url":"https:\/\/ecolosplus.se\/","name":"Ecolos+","description":"AI-Powered Last-Mile Delivery Platform","publisher":{"@id":"https:\/\/ecolosplus.se\/#organization"},"alternateName":"Ecolos Plus","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/ecolosplus.se\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"sv-SE"},{"@type":"Organization","@id":"https:\/\/ecolosplus.se\/#organization","name":"Ecolos+","url":"https:\/\/ecolosplus.se\/","logo":{"@type":"ImageObject","inLanguage":"sv-SE","@id":"https:\/\/ecolosplus.se\/#\/schema\/logo\/image\/","url":"https:\/\/ecolosplus.se\/wp-content\/uploads\/2023\/10\/logo01.png","contentUrl":"https:\/\/ecolosplus.se\/wp-content\/uploads\/2023\/10\/logo01.png","width":742,"height":314,"caption":"Ecolos+"},"image":{"@id":"https:\/\/ecolosplus.se\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/ecolosplus.se\/sv\/wp-json\/wp\/v2\/pages\/64","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ecolosplus.se\/sv\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ecolosplus.se\/sv\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ecolosplus.se\/sv\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ecolosplus.se\/sv\/wp-json\/wp\/v2\/comments?post=64"}],"version-history":[{"count":510,"href":"https:\/\/ecolosplus.se\/sv\/wp-json\/wp\/v2\/pages\/64\/revisions"}],"predecessor-version":[{"id":2731,"href":"https:\/\/ecolosplus.se\/sv\/wp-json\/wp\/v2\/pages\/64\/revisions\/2731"}],"wp:attachment":[{"href":"https:\/\/ecolosplus.se\/sv\/wp-json\/wp\/v2\/media?parent=64"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}