/* Front page sections */
:root{
      --pink:#D50069;
      --turq:#39C7CE;
      --blue:#222753;
      --max:1600px;
   }
   /* Speed up initial render: skip layout/paint for offscreen sections */
   @supports (content-visibility: auto){
      .hp-template > section{content-visibility:auto;contain-intrinsic-size: 1px 1000px}
      /* Keep above-the-fold always visible */
      .hp-template > section.el-hero,
   .hp-template > section.el-subintro,
   /* Image-heavy sections: ensure native lazy-loading triggers reliably */
   .hp-template > section.posts-slider,
   .hp-template > section.iwgc{content-visibility:visible;contain-intrinsic-size:auto}
   }
   
   /* Match overall layout rhythm from pris-mallen */
   .hp-wrap{max-width:var(--max);margin:0 auto;padding:0 10px}
   .hp-template a{color:inherit;transition:all 0.3s ease}
   /* Ensure home hero doesn't overlap header */
   .home-hero{margin-top:0 !important}
   /* Tweak spacing for reused home blocks */
   .home-brand-strip{padding:30px 0 !important}
   .home-trustindex{margin:0 !important;padding-top:0 !important}
   @media(max-width:1024px){
      .home-icon-grid-black{background-attachment:scroll}
      .home-two-col-seo .dark{background-attachment:scroll}
   }

      /* Elementor-hero (speglas efter JSON) */
         .hp-template .el-hero{position:relative;display:flex;flex-wrap:wrap;justify-content:center;align-content:center;gap:0;margin:-72px 0 0 0;padding:100px 10px 80px;min-height:85vh;z-index:0;
            background-color:#000;background-position:center;background-size:cover;background-repeat:no-repeat;
            background-image:var(--iw-home-hero-bg);
         }
         .hp-template .el-hero::before{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(255,255,255,.82))}
      .hp-template .el-hero .inner{position:relative;z-index:1;max-width:1200px;width:100%;display:flex;flex-wrap:wrap;gap:0;justify-content:center}
      .hp-template .el-hero .col{flex:0 1 100%;display:flex;flex-direction:column;align-items:center;padding:0}
   /* Typography (normalized för tablet/mobil men mycket större på desktop) */
   .hp-template .el-hero .html-copy{max-width:1100px;margin:0 auto;padding:0 10px;display:flex;flex-direction:column;gap:16px}
   .hp-template .el-hero .h2-custom{font-size:clamp(36px,8vw,120px);line-height:1.02;color:#D50069;text-align:center;margin:0;text-wrap:balance;font-weight:900;letter-spacing:-0.02em}
   /* Animated heading effect like tjänster-hero */
   .hp-template .el-hero .h2-custom .fx-grad{background:linear-gradient(90deg,#000 0%, var(--pink) 25%, var(--turq) 50%, #000 75%, #000 100%);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:title-sheen 8s linear infinite}
   .hp-template .el-hero .h2-custom .fx-underline{position:relative}
   .hp-template .el-hero .h2-custom .fx-underline::after{content:"";position:absolute;left:0;right:0;margin:0 auto;bottom:-8px;height:3px;width:100%;max-width:90%;background:linear-gradient(90deg,var(--pink),#fff,var(--turq));background-size:200% 100%;animation:underline-move 6s linear infinite;border-radius:3px}
   @keyframes title-sheen{0%{background-position:0% 50%}100%{background-position:300% 50%}}
   @keyframes underline-move{0%{background-position:0% 50%}100%{background-position:200% 50%}}
   .hp-template .el-hero .h1-custom{font-size:clamp(16px,3.5vw,42px);line-height:1.25;color:#313131;text-align:center;margin:0;text-wrap:balance;font-weight:600;hyphens:auto;overflow-wrap:anywhere;word-break:normal}
   .hp-template .el-hero .p-custom{font-size:clamp(14px,2.2vw,24px);line-height:1.6;text-align:center;margin:0;max-width:65ch;margin-inline:auto;color:#555}
      /* Buttons */
   .hp-template .el-hero .btns{display:flex;flex-wrap:wrap;gap:20px;justify-content:center;margin-top:32px}
   .hp-template .el-hero .btns a{display:inline-flex;align-items:center;justify-content:center;padding:18px 42px;text-decoration:none;color:#fff;border-radius:12px;font-weight:800;font-size:20px;box-shadow:0 8px 20px rgba(0,0,0,.15);transition:all 0.3s ease;transform:translateY(0)}
   .hp-template .el-hero .btns a:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(0,0,0,.2)}
   .hp-template .el-hero .btns a.btn-dark{background:#222753}
   .hp-template .el-hero .btns a.btn-accent{background:var(--pink)}
   .hp-template .el-hero .btns a.btn-turq{background:var(--turq)}
      /* Responsive overrides matching JSON custom_css */
   @media (max-width:1024px){
      .hp-template .el-hero{background-image:none!important;background-color:#f9f9f9;padding:48px 14px 56px;margin-top:0;min-height:0;border-bottom:1px solid #efefef;background:linear-gradient(180deg,#fff 0%,#f9fafb 100%)}
         .hp-template .el-hero::before{background:none}
      .hp-template .el-hero .html-copy{gap:12px;padding:0 6px}
      .hp-template .el-hero .h2-custom{font-size:clamp(28px,7.2vw,44px)}
      .hp-template .el-hero .h1-custom{font-size:clamp(16px,3.6vw,26px);line-height:1.35;color:#1f2937}
      .hp-template .el-hero .p-custom{font-size:clamp(14px,2.8vw,18px)}
      .hp-template .el-hero .btns{gap:12px;margin-top:20px;width:100%}
      .hp-template .el-hero .btns a{font-size:17px;padding:14px 20px;width:100%;max-width:460px;min-height:48px}
      }

      @media (max-width:767px){
         .hp-template .el-hero{padding:36px 12px 44px;padding-top:calc(36px + env(safe-area-inset-top, 0px))}
         .hp-template .el-hero .h2-custom{font-size:clamp(24px,9.5vw,36px)}
         .hp-template .el-hero .h1-custom{font-size:clamp(15px,4.2vw,22px)}
         .hp-template .el-hero .btns{gap:10px;margin-top:16px}
         .hp-template .el-hero .btns a{font-size:16px;padding:12px 18px;width:100%;max-width:100%;min-height:48px}
      }

         /* Under-hero section (Image + title + dynamic text + 2 buttons) */
         .el-subintro{max-width:1200px;margin:0 auto;display:flex;flex-direction:column;gap:16px;justify-content:center;align-items:center;padding:60px 10px 80px}
         .el-subintro .image{position:relative;width:100%;text-align:center;margin-top:20px;overflow:hidden}
         .el-subintro .image::before{content:"";display:block;padding-top:56.25%}
         .el-subintro .image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform 0.6s ease}
         .el-subintro .image:hover img{transform:scale(1.02)}
         @supports (aspect-ratio: 1){
            .el-subintro .image{aspect-ratio:16/9}
            .el-subintro .image::before{content:none}
            .el-subintro .image img{position:static;height:100%}
         }
         .el-subintro h3{font-family:Barlow-Bold, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;font-weight:700;letter-spacing:0.5px;font-size:clamp(24px,4vw,48px);margin:24px 0 16px;text-align:center;text-wrap:balance;hyphens:auto;color:#222}
         .el-subintro p{margin:0 0 24px 0;line-height:1.7;text-align:center;font-size:clamp(16px,2.2vw,22px);max-width:65ch;margin-left:auto;margin-right:auto;color:#555}
         .el-subintro .btns{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;margin-top:12px}
         .el-subintro .btns a{display:inline-flex;align-items:center;justify-content:center;padding:16px 36px;text-decoration:none;color:#fff;border-radius:10px;font-weight:800;font-size:19px;box-shadow:0 8px 20px rgba(0,0,0,.15);transition:all 0.3s ease;transform:translateY(0)}
         .el-subintro .btns a:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(0,0,0,.2)}
         .el-subintro .btns a.btn-accent{background:var(--pink)}
         .el-subintro .btns a.btn-turq{background:var(--turq)}
         @media(max-width:1024px){
            .el-subintro{padding:40px 10px 60px}
            .el-subintro h3,.el-subintro p{text-align:center;margin-left:auto;margin-right:auto}
         }

         /* Section 3: Dark bg with fixed image and 2x2 icon boxes */
         .el-sec3{position:relative;background-color:#000;background-position:center;background-size:cover;background-repeat:no-repeat;background-attachment:fixed;
            background-image:var(--iw-home-sec3-bg);
            padding:100px 18px;min-height:70vh;display:grid;place-items:center}
         .el-sec3::before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.65)}
         .el-sec3 .wrap{position:relative;z-index:1;max-width:1300px;width:100%}
         .el-sec3 .grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px;align-items:center}
         @media(max-width:767px){
            .el-sec3{background-image:none!important;background-color:#111;padding:60px 18px;background-attachment:scroll}
            .el-sec3 .grid{grid-template-columns:1fr;gap:24px}
         }
         .el-sec3 .ibox{display:flex;gap:24px;align-items:flex-start;color:#fff;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);border-radius:16px;padding:28px;transition:all 0.3s ease;backdrop-filter:blur(10px)}
         .el-sec3 .ibox:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.25);transform:translateY(-4px)}
            .el-sec3 .icon{width:110px;height:auto;flex:0 0 auto;filter:brightness(0) invert(1)}
         @media(max-width:1024px){.el-sec3 .icon{width:70px}}
         @media(max-width:767px){.el-sec3 .icon{width:80px}}
         .el-sec3 h3{margin:0 0 12px 0;font-family:Barlow-Bold, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;font-weight:700;letter-spacing:1px;color:#fff;font-size:clamp(20px,2.5vw,28px)}
         .el-sec3 p{margin:0;color:#e0e0e0;line-height:1.6;font-size:clamp(15px,1.8vw,18px)}
         .el-sec3 a{color:inherit}

            /* Section 4: Logos + two info blocks + CTAs */
            .el-sec4{padding:120px 0;background:#fafbfc}
            @media(max-width:1024px){
               .el-sec4{padding:60px 18px 80px}
            }
            .el-sec4 .wrap{max-width:1300px;margin:0 auto;padding:0 10px}
               .el-sec4 .logos{max-width:1000px;margin:0 auto 60px;display:flex;justify-content:center;align-items:center;gap:50px;flex-wrap:wrap}
            .el-sec4 .logos a{display:inline-block;transition:all 0.3s ease;opacity:0.8}
            .el-sec4 .logos a:hover{opacity:1;transform:translateY(-2px)}
            .el-sec4 .logos img{max-width:100%;height:auto;display:block}
            .el-sec4 .logos .el{width:320px}
            .el-sec4 .logos .rm{width:160px}
            .el-sec4 .logos .wp{width:320px}
            @media(max-width:767px){
               .el-sec4 .logos{justify-content:center;gap:30px;margin-bottom:40px}
               .el-sec4 .logos .el{width:280px}
               .el-sec4 .logos .rm{width:140px}
               .el-sec4 .logos .wp{width:280px}
            }
               .el-sec4 .loopia{display:flex;justify-content:center;margin:0 0 50px}
            .el-sec4 .loopia img{max-width:100%;height:auto;display:block;transition:all 0.3s ease}
            .el-sec4 .loopia:hover img{transform:scale(1.05)}
               
               /* Reintroduced content blocks without box styling */
               .el-sec4 .content-blocks{max-width:1100px;margin:0 auto 30px;display:flex;flex-direction:column;gap:60px}
               .el-sec4 .content-block{display:flex;flex-direction:column;align-items:center;text-align:center}
               .el-sec4 .content-block .img{width:100%;max-width:980px;margin:0 auto 20px;border-radius:24px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.08)}
               .el-sec4 .content-block .img img{width:100%;height:auto;display:block}
               .el-sec4 .content-block h3{margin:24px 0 16px;font-family:Barlow-Bold, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;font-weight:700;letter-spacing:.2px;font-size:clamp(28px,4vw,48px);line-height:1.2;color:#222}
               .el-sec4 .content-block p{margin:0 auto;max-width:75ch;line-height:1.8;color:#555;font-size:clamp(16px,1.9vw,20px)}
               @media(max-width:767px){
                  .el-sec4 .content-blocks{gap:36px}
                  .el-sec4 .content-block .img{border-radius:16px}
               }
               
               .el-sec4 .btns{display:flex;flex-wrap:wrap;gap:20px;justify-content:center;margin-top:32px;margin-bottom:20px}
               .el-sec4 .btns a{display:inline-flex;align-items:center;justify-content:center;padding:16px 36px;text-decoration:none;color:#fff;border-radius:12px;font-weight:800;font-size:19px;box-shadow:0 8px 20px rgba(0,0,0,.15);transition:all 0.3s ease;transform:translateY(0)}
               .el-sec4 .btns a:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(0,0,0,.2)}
               .el-sec4 .btns a.btn-navy{background:#222753}
            .el-sec4 .btns a.btn-accent{background:var(--pink)}

               /* Global CTA row (used after flipdeck) */
               .cta-btns{display:flex;flex-wrap:wrap;gap:20px;justify-content:center;margin:60px 10px;padding:40px 20px;background:#fff;border-radius:16px;box-shadow:0 10px 40px rgba(0,0,0,.08)}
               .cta-btns a{display:inline-flex;align-items:center;justify-content:center;padding:16px 36px;text-decoration:none;color:#fff;border-radius:12px;font-weight:800;font-size:19px;box-shadow:0 8px 20px rgba(0,0,0,.15);transition:all 0.3s ease;transform:translateY(0)}
               .cta-btns a:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(0,0,0,.2)}
               .cta-btns .btn-navy{background:#222753}
               .cta-btns .btn-accent{background:var(--pink)}

               /* Section 5 (redesign): solid readable headings, refined spacing, robust responsive */
               .sec5-h{color:var(--pink);font-family:Barlow-ExtraBold, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;letter-spacing:1px;font-size:clamp(26px,2.8vw,40px);line-height:1.2;margin:0 0 12px}
               .sec5-h.on-dark{color:#fff}
               .el-sec5a,.el-sec5c{padding:48px 0}
               .el-sec5a .wrap,.el-sec5c .wrap{max-width:var(--max);margin:0 auto;padding:0 10px;display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center}
               @media(max-width:1024px){.el-sec5a .wrap,.el-sec5c .wrap{grid-template-columns:1fr}}
               .el-sec5a .text{padding:56px}
               .el-sec5c .text{padding:40px}
               @media(min-width:1025px) and (max-width:1366px){.el-sec5a .text{padding:28px}}
               @media(max-width:1024px){.el-sec5a .text,.el-sec5c .text{padding:56px}}
               @media(max-width:767px){.el-sec5a .text,.el-sec5c .text{padding:22px}}
               .el-sec5a .rich p,.el-sec5c .rich p{margin:0 0 10px;line-height:1.7;color:#4B5563}
               .el-sec5a .btns,.el-sec5c .btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:12px}
               .el-sec5a .btns a,.el-sec5c .btns a{display:inline-flex;align-items:center;justify-content:center;padding:14px 36px;text-decoration:none;color:#fff;border-radius:8px;font-weight:800;box-shadow:0 6px 14px rgba(0,0,0,.12);min-width:220px}
               .el-sec5a .btns .btn-navy,.el-sec5c .btns .btn-navy{background:#222753}
               .el-sec5a .btns .btn-accent,.el-sec5c .btns .btn-accent{background:var(--pink)}
               .el-sec5a .image img,.el-sec5c .image img{width:100%;height:auto;display:block;border-radius:8px}
               @media(max-width:767px){.el-sec5a .btns a,.el-sec5c .btns a{padding:10px 20px;min-width:auto}}
               @media(max-width:1024px){
                  .el-sec5a .image{order:1}
                  .el-sec5a .text{order:2}
                  .el-sec5c .image{order:1}
                  .el-sec5c .text{order:2}
                  /* Slimmer buttons on tablet */
                  .el-sec5a .btns a,.el-sec5c .btns a{padding:12px 28px;min-width:auto}
               }

               .el-sec5b{position:relative;background-color:#0a0a0a;background-position:center;background-size:cover;background-repeat:no-repeat;
                  background-image:var(--iw-home-sec5b-bg);
                  padding:56px 10px}
               .el-sec5b::before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.5)}
               .el-sec5b .inner{position:relative;z-index:1;max-width:var(--max);margin:0 auto}
               .el-sec5b .heading{font-size:clamp(24px,3.2vw,48px);line-height:1.1;text-align:center;margin:0 0 18px;color:#fff}
               .el-sec5b .cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
               @media(max-width:1024px){.el-sec5b .cards{grid-template-columns:1fr 1fr}}
               @media(max-width:767px){.el-sec5b{background-image:none!important;background-color:#000}.el-sec5b .cards{grid-template-columns:1fr}}
               .el-sec5b .card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);padding:22px;border-radius:12px;color:#fff;text-decoration:none;display:flex;flex-direction:column;gap:10px;transition:transform .2s ease,box-shadow .2s ease,background .2s ease}
               .el-sec5b .card:hover{transform:translateY(-2px);box-shadow:0 10px 20px rgba(0,0,0,.25);background:rgba(255,255,255,.07)}
               .el-sec5b .card .icon{width:90px;height:auto;filter:brightness(0) invert(1)}
               @media(max-width:1024px){.el-sec5b .card .icon{width:72px}}
               .el-sec5b .card h3{margin:6px 0 4px 0;font-family:Barlow-ExtraBold, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;font-weight:700;letter-spacing:1px;color:#fff;font-size:18px}
               .el-sec5b .card p{margin:0;color:#E5E7EB;line-height:1.55}
         /* Accessibility: visible focus for key CTAs */
         .hp-template .el-hero .btns a:focus-visible,
         .el-subintro .btns a:focus-visible,
         .el-sec4 .btns a:focus-visible,
         .cta-btns a:focus-visible,
         .el-sec5a .btns a:focus-visible,
         .el-sec5c .btns a:focus-visible{outline:3px solid #fff;outline-offset:3px}

         /* Trustindex wrapper spacing */
         /* (Reviews removed on homepage) */

         /* Smooth section transitions */
         .page-section{scroll-margin-top:80px}

         /* Improved readability for dark sections */
         .el-sec3,.el-sec5b{backdrop-filter:blur(1px)}
         .el-sec3 .ibox,.el-sec5b .card{backdrop-filter:blur(6px)}

         /* Better visual hierarchy */
         .el-sec4 .logos{opacity:.9;transition:opacity .3s ease}
         .el-sec4:hover .logos{opacity:1}

         /* Mobile-first improvements */
         @media(max-width:768px){
            .hp-template .el-hero{padding:20px 10px 32px}
            .el-subintro{padding:16px 10px 24px}
            .el-sec3{padding:32px 12px}
            .el-sec4{padding:20px 12px 32px}
            .el-sec5a,.el-sec5c{padding:32px 0}
            .el-sec5b{padding:40px 10px}
         }

         /* Respect reduced motion: disable parallax/animations */
         @media (prefers-reduced-motion: reduce){
            .hp-template .el-hero,
            .el-sec3,
            .el-sec5b{background-attachment:scroll!important;background-position:center;background-size:cover}
            .hp-template .el-hero .h2-custom .fx-grad{animation:none}
            .el-sec5b .card{transition:none}
            .el-sec5b .card:hover{transform:none}
         }
         
         /* Globala förbättringar för hela sidan */
         body {
            overflow-x: hidden;
         }
         
         /* Smooth scrolling */
         html {
            scroll-behavior: smooth;
         }
         
         /* Förbättra läsbarhet */
         .hp-template .el-hero .p-custom,
         .el-subintro p,
         .el-sec4 .ibox p {
            text-rendering: optimizeLegibility;
            -webkit-font-smoothing: antialiased;
         }
         
         /* Compact buttons further on small screens */
         @media(max-width:767px){
            .hp-template .el-hero .btns a,
            .el-subintro .btns a,
            .el-sec4 .btns a,
            .cta-btns a{padding:10px 20px}
         }