/* ClickrayIcons - custom icon font from original template */
          @font-face {
            font-family: 'ClickrayIcons';
            src: url('//cdn2.hubspot.net/hubfs/685080/ClickRay%20Fonts/cr-icons.eot?rxli6k');
            src: url('//cdn2.hubspot.net/hubfs/685080/ClickRay%20Fonts/cr-icons.eot?rxli6k#iefix') format('embedded-opentype'),
                 url('//cdn2.hubspot.net/hubfs/685080/ClickRay%20Fonts/cr-icons.ttf?rxli6k') format('truetype'),
                 url('//cdn2.hubspot.net/hubfs/685080/ClickRay%20Fonts/cr-icons.woff?rxli6k') format('woff'),
                 url('//cdn2.hubspot.net/hubfs/685080/ClickRay%20Fonts/cr-icons.svg#ClickRayIcons') format('svg');
            font-weight: normal;
            font-style: normal;
          }
          [class^="cr-icon-"], [class*=" cr-icon-"] {
            color: #ed145b;
            display: inline-block;
            font-family: 'ClickrayIcons' !important;
            speak: none;
            font-style: normal;
            font-weight: normal;
            font-variant: normal;
            text-transform: none;
            line-height: 1;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
          }
          .cr-icon-heart:before{content:"\e90a"} .cr-icon-umbrella:before{content:"\e928"} .cr-icon-paper:before{content:"\e91a"}
          .cr-icon-paper-plane:before{content:"\e919"} .cr-icon-exclamation-mark:before{content:"\e945"} .cr-icon-clock:before{content:"\e932"}
          .cr-icon-chart:before{content:"\e930"} .cr-icon-chart-2:before{content:"\e936"} .cr-icon-paper-dropbox:before{content:"\e918"}
          .cr-icon-phone:before{content:"\e91e"} .cr-icon-target:before{content:"\e924"} .cr-icon-white-paper:before{content:"\e927"}
          .cr-icon-basket:before{content:"\e915"} .cr-icon-smile:before{content:"\e946"} .cr-icon-map:before{content:"\e917"}
          .cr-icon-cogs:before{content:"\e911"} .cr-icon-circle-money:before{content:"\e903"} .cr-icon-balloon:before{content:"\e92b"}
          .cr-icon-tools-2:before{content:"\e93a"} .cr-icon-tools:before{content:"\e939"} .cr-icon-hyperlink:before{content:"\e942"}
          .cr-icon-faq:before{content:"\e92f"} .cr-icon-pig:before{content:"\e900"} .cr-icon-magic-wand:before{content:"\e908"}
          .cr-icon-megaphone:before{content:"\e925"} .cr-icon-comment:before{content:"\e940"} .cr-icon-dev-2:before{content:"\e934"}
          .cr-icon-open-book:before{content:"\e93b"} .cr-icon-palette:before{content:"\e931"} .cr-icon-equalizer:before{content:"\e914"}
          .cr-icon-pencil:before{content:"\e91d"} .cr-icon-circle-check:before{content:"\e929"} .cr-icon-circle-x:before{content:"\e901"}
          .cr-icon-desktop-screen:before{content:"\e944"} .cr-icon-case:before{content:"\e909"} .cr-icon-search:before{content:"\e923"}
          .cr-icon-coins:before{content:"\e92e"} .cr-icon-circle-chart:before{content:"\e907"} .cr-icon-quote:before{content:"\e922"}
          .cr-icon-chat:before{content:"\e904"} .cr-icon-gift:before{content:"\e93e"}

          * { margin: 0; padding: 0; box-sizing: border-box; }
          html { font-size: 14px; }
          @media (min-width: 575px) { html { font-size: 16px; } }
          body {
            font-family: 'Poppins', sans-serif;
            font-weight: normal;
            color: #292935;
            line-height: 1.6;
            overflow-x: hidden;
            text-rendering: auto;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
          }

          /* Global typography - scoped under body to override Tailwind preflight */
          body h1, body h2, body h3, body h4, body h5, body h6 { margin-top: 0; margin-bottom: 1.875rem; color: #292935; }
          body h1 { font-size: 3rem; font-weight: 600; }
          body h2 { font-size: 2.25rem; font-weight: 600; }
          body h3 { font-size: 1.5rem; font-weight: 600; }
          body h4 { font-size: 1.25rem; font-weight: 400; }
          body h5 { font-size: 1.25rem; font-weight: 300; }
          body h6 { font-size: 1.125rem; font-weight: 300; }
          body p, body li, body blockquote { color: #a1a1a1; }
          body p { font-size: 16px; font-weight: 400; margin-top: 0; margin-bottom: 1.25rem; }
          body a { text-decoration: none; color: #ed145b; font-weight: 600; transition: all 0.3s linear; }

          /* Rich text list styling (custom pink bullets) */
          section ul, section ol { margin-top: 0; margin-bottom: 1.25rem; list-style: none; padding-left: 0; margin-left: 2.1875rem; }
          section ul li, section ol li { position: relative; margin-top: 0.6875rem; margin-bottom: 0.6875rem; padding-left: 2.5rem; }
          section ul li::before { position: absolute; content: "\2022"; color: #ed145b; left: 0; font-size: 1.375rem; line-height: 1; }
          section ol { counter-reset: section; list-style-type: none; }
          section ol li::before { counter-increment: section; content: counters(section, ".") "."; position: absolute; display: block; color: #ed145b; left: 0; }
          /* Header */
          .cs-header { position: fixed; top: 0; left: 0; width: 100%; z-index: 999; transition: all 0.5s ease; max-height: 77px; display: flex; align-items: center; }
          .cs-header.transparent { background: transparent; }
          .cs-header.scrolled { background: #fff; box-shadow: 0px 1px 8px 0px rgba(0,0,0,0.15); }
          .cs-header.transparent .logo-white { display: block; }
          .cs-header.transparent .logo-color { display: none; }
          .cs-header.scrolled .logo-white { display: none; }
          .cs-header.scrolled .logo-color { display: block; }
          .cs-header.transparent .nav-link { color: #fff; }
          .cs-header.scrolled .nav-link { color: #292935; }
          .cs-header a, .cs-header a:link, .cs-header a:visited, .cs-header a:hover, .cs-header a:active { text-decoration: none !important; border-bottom: none !important; }
          .cs-header.transparent .nav-item:hover > .nav-link { color: #ed145b; text-shadow: 0 0 20px rgba(237,20,91,0.4); }
          .cs-header.scrolled .nav-item:hover > .nav-link { color: #ed145b; }
          .cs-header.transparent .search-icon { color: #fff; }
          .cs-header.scrolled .search-icon { color: #292935; }

          /* Navigation */
          .nav-menu { display: flex; align-items: center; list-style: none; }
          .nav-item { position: relative; margin: 0 1.15%; }
          .nav-link { font-family: 'Poppins', sans-serif; font-weight: 300; text-decoration: none !important; padding: 24px 7px 27px 7px; line-height: normal; overflow: visible; display: block; transition: all 0.3s ease; white-space: nowrap; position: relative; }
          .nav-link::before { position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); display: block; width: 0; height: 3px; background: linear-gradient(90deg, #ed145b, #4044e6); border-radius: 2px; content: ""; opacity: 0; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
          .nav-item:hover > .nav-link::before { width: 100%; opacity: 1; }
          .nav-search .nav-link::before { display: none; }
          .nav-item:hover .dropdown { top: 77px; opacity: 1; z-index: 1; pointer-events: auto; transition-delay: 0s; }
          .dropdown { position: absolute; top: 100px; right: -45px; left: auto; background: #1e1e2a; min-width: 340px; white-space: nowrap; opacity: 0; z-index: -1; pointer-events: none; transition: opacity 0.3s 0.15s, top 0.3s 0.15s; border-radius: 8px; box-shadow: 0 12px 40px rgba(0,0,0,0.4); border: 1px solid rgba(255,255,255,0.06); }
          .dropdown::before { content: ''; position: absolute; top: -25px; left: 0; width: 100%; height: 25px; }
          .dropdown a { display: block; padding: 12px 24px; color: rgba(255,255,255,0.8); text-decoration: none; font-weight: 400; font-size: 0.935rem; transition: all 0.25s ease; border-left: 3px solid transparent; letter-spacing: 0.01em; }
          .dropdown a:first-child { padding-top: 18px; border-radius: 8px 8px 0 0; }
          .dropdown a:last-child { padding-bottom: 18px; border-radius: 0 0 8px 8px; }
          .dropdown a:hover { color: #fff; background: rgba(237,20,91,0.12); border-left-color: #ed145b; padding-left: 28px; }

          /* Mobile menu */
          .mobile-toggle { display: none; cursor: pointer; padding: 10px; }
          .mobile-toggle span { display: block; width: 25px; height: 2px; margin: 5px 0; transition: all 0.3s; }
          .cs-header.transparent .mobile-toggle span { background: #fff; }
          .cs-header.scrolled .mobile-toggle span { background: #292935; }
          @media (max-width: 1024px) {
            .mobile-toggle { display: block; }
            .nav-menu { display: none; flex-direction: column; position: absolute; top: 77px; left: 0; width: 100%; background: #fff; box-shadow: 0 5px 20px rgba(0,0,0,0.15); padding: 20px 0; }
            .nav-menu.active { display: flex; }
            .nav-item { margin: 0; width: 100%; }
            .nav-link { color: #292935 !important; padding: 12px 25px; }
            .nav-link::before { display: none; }
            .dropdown { position: static; opacity: 1; z-index: 1; top: auto; right: auto; left: auto; display: none; background: #f5f5f8; border-radius: 6px; box-shadow: none; border: none; }
            .dropdown a { color: #292935; border-left: 3px solid transparent; }
            .dropdown a:hover { background: rgba(237,20,91,0.08); border-left-color: #ed145b; color: #ed145b; }
            .nav-item:hover .dropdown, .nav-item.open .dropdown { display: block; }
          }

          /* CTA Buttons */
          a.cta_button, a.cta { -webkit-appearance: none; text-decoration: none; box-sizing: border-box !important; display: inline-block; min-width: 150px; font-family: 'Poppins', sans-serif; font-size: 1rem; font-weight: 600; text-align: center; text-transform: uppercase; padding: 0.625rem 1.25rem; border-radius: 3px; margin-bottom: 1.25rem; cursor: pointer; transition: all 0.2s linear; }
          a.cta_button:hover, a.cta_button:active, a.cta_button:focus, a.cta:hover, a.cta:active, a.cta:focus { text-decoration: none; }
          a.cta-primary, .cta-primary { display: inline-block; min-width: 150px; font-family: 'Poppins', sans-serif; font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; padding: 14px 35px; text-decoration: none; text-align: center; border-radius: 30px; transition: all 0.3s ease; background-color: #ed145b; border: 2px solid #ed145b; color: #fff; }
          a.cta-primary:hover, .cta-primary:hover { background-color: #fff; border: 2px solid #ed145b; color: #ed145b; }
          .cta-secondary { display: inline-block; min-width: 150px; font-family: 'Poppins', sans-serif; font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; padding: 14px 35px; text-decoration: none; text-align: center; border-radius: 30px; transition: all 0.3s ease; background-color: transparent; border: 2px solid #fff; color: #fff; }
          .cta-secondary:hover { background-color: #fff; color: #ed145b; }

          /* Section spacing */
          .section-margin-top { margin-top: 80px; }
          .section-margin-top--half { margin-top: 3.125rem; }
          @media (max-width: 767px) { .section-margin-top--half { margin-top: 1.5625rem; } }
          .section-margin-bottom { margin-bottom: 80px; }
          .section-padding-top { padding-top: 80px; }
          .section-padding-bottom { padding-bottom: 80px; }
          .column-margin-bottom { margin-bottom: 2.5rem; }
          @media (max-width: 767px) { .column-margin-bottom { margin-bottom: 1.25rem; } }
          .section-relative { position: relative; overflow: hidden; }

          /* Text Image Section */
          .text-image-section { display: flex; min-height: 500px; overflow: hidden; }
          .text-image-section .image-side { width: 50%; background-size: cover; background-position: center; }
          .text-image-section .content-side { width: 50%; display: flex; align-items: center; }
          .text-image-section .content-inner { max-width: 555px; padding: 60px; }
          @media (max-width: 768px) {
            .text-image-section { flex-direction: column; }
            .text-image-section .image-side, .text-image-section .content-side { width: 100%; }
            .text-image-section .image-side { min-height: 300px; }
          }

          /* Counter Section */
          .counter-section { display: flex; justify-content: center; gap: 60px; flex-wrap: wrap; padding: 60px 0; }
          .counter-item { text-align: center; color: #fff; }
          .counter-item .counter-top { font-size: 16px; font-weight: 300; margin-bottom: 5px; }
          .counter-item .counter-number { font-size: 60px; font-weight: 700; line-height: 1; }
          .counter-item .counter-bottom { font-size: 16px; font-weight: 300; margin-top: 5px; }

          /* Testimonials */
          .testimonial-section { position: relative; background-color: #2d2d2d; background-size: cover; background-repeat: no-repeat; background-position: center; padding: 5rem 0; }
          .testimonial-mask { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.14); }
          .testimonial-section h2 { position: relative; color: #fff; text-align: center; font-size: 28px; font-weight: 300; margin-bottom: 40px; }
          .slick-container { margin: 0 auto; max-width: 1400px; position: relative; z-index: 1; padding: 0 40px; }
          .testimonial-track { display: flex; align-items: center; justify-content: center; gap: 30px; min-height: 440px; }
          .testimonial-box { text-align: center; max-width: 360px; min-width: 240px; flex: 1; position: relative; }
          .testimonial-quote { background-color: #fff; border-radius: 3px; padding: 35px 25px; font-size: 13px; line-height: 1.6; position: relative; box-shadow: 6px 6px #ed145b; color: #2d2d2d; }
          .testimonial-quote::before { font-family: 'Palanquin', serif; content: '\201C'; position: absolute; font-size: 150px; line-height: 17.7px; top: -25px; color: #ed145b; left: 0; margin-left: -17px; margin-top: -12px; transform: rotate(180deg); }
          .testimonial-quote::after { content: ''; position: absolute; bottom: -18px; left: 50%; margin-left: -13px; width: 0; height: 0; border-left: 13px solid transparent; border-right: 13px solid transparent; border-top: 19px solid #fff; filter: drop-shadow(8px 1px #ed145b); }
          .testimonial-box .person { margin-top: 30px; display: flex; align-items: center; justify-content: center; }
          .testimonial-box .person__image img { height: 66px; width: 66px; border-radius: 50%; border: 3px solid #ed145b; object-fit: contain; background: #fff; }
          .testimonial-box .person__desc { padding: 0 15px; text-align: left; }
          .testimonial-box .person__desc h4 { font-size: 18px; line-height: 1.1; margin: 0; color: #fff; font-weight: 600; }
          .testimonial-box .person__desc p { font-size: 14px; margin: 5px 0 0; color: #fff; }
          @media (max-width: 767px) {
            .testimonial-track { flex-direction: column; gap: 40px; min-height: auto; }
            .testimonial-box { max-width: 100%; }
          }

          /* Icon List Company (service/solution cards) */
          .icon-list-item { display: flex; align-items: flex-start; gap: 20px; padding: 15px 0; transition: transform 0.3s; cursor: pointer; }
          .icon-list-item:hover { transform: translateX(5px); }
          .icon-list-item .icon-img { width: 80px; min-width: 80px; position: relative; }
          .icon-list-item .icon-img img { width: 100%; transition: opacity 0.3s; }
          .icon-list-item .icon-img .hover-img { position: absolute; top: 0; left: 0; opacity: 0; }
          .icon-list-item:hover .icon-img .hover-img { opacity: 1; }
          .icon-list-item:hover .icon-img .default-img { opacity: 0; }
          .icon-list-item h5, .icon-list-item h6 { font-size: 16px; font-weight: 600; margin-bottom: 5px; color: #2d2d2d; }
          .icon-list-item p { font-size: 14px; line-height: 1.6; color: #555; margin: 0; }

          /* Icon Text items (work with us for / businesses turn to us) */
          .icon-text-item { display: flex; align-items: center; gap: 15px; padding: 10px 0; }
          .icon-text-item i { font-size: 42px; min-width: 50px; text-align: center; }
          .icon-text-item p { margin: 0; font-size: 15px; }
          .icon-text-large { display: flex; gap: 20px; padding: 20px 0; align-items: flex-start; }
          .icon-text-large i { font-size: 52px; min-width: 60px; }
          .icon-text-large h3 { font-size: 18px; font-weight: 600; margin-bottom: 8px; }
          .icon-text-large p { font-size: 14px; line-height: 1.6; color: #555; }

          /* Quick Subscribe / Contact Form Section */
          .quick-subscribe { position: relative; overflow: hidden; min-height: 710px; padding-bottom: 30px; background: linear-gradient(to bottom, white 0%, white 20%, #ed145b 20%, #ed145b 100%); }
          .quick-subscribe::after { content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin-top: 20%; background-color: rgba(0, 0, 0, 0.35); }
          .quick-subscribe .wrapper { position: relative; width: 100%; }
          .quick-subscribe .qs-content { position: relative; z-index: 10; display: flex; gap: 30px; max-width: 1170px; margin: 0 auto; padding: 0 15px; }
          .quick-subscribe .qs-text { flex: 1; margin-top: 190px; }
          .quick-subscribe .qs-text h2 { font-size: 36px; font-weight: 600; color: #fff; line-height: 40px; margin-bottom: 10px; }
          .quick-subscribe .qs-text h3 { font-size: 18px; font-weight: 300; color: #fff; }
          .quick-subscribe .qs-form-wrap { flex: 1; }
          .quick-subscribe .qs-form { width: 100%; background-color: #fff; padding: 35px 50px 60px; margin-top: 30px; box-shadow: 0px 10px 30px 0px rgba(41, 41, 53, 0.3); }
          .quick-subscribe .qs-form h3 { text-align: center; margin: 0; font-size: 18px; font-weight: 300; color: #2d2d2d; }
          .quick-subscribe .qs-form > p { text-align: center; margin: 11px 0 27px; font-size: 13px; color: #555; }
          .quick-subscribe .qs-form input[type="text"],
          .quick-subscribe .qs-form input[type="email"],
          .quick-subscribe .qs-form input[type="tel"],
          .quick-subscribe .qs-form select { width: 100%; padding: 13px; font-family: 'Poppins', sans-serif; font-size: 1rem; margin-bottom: 1.25rem; border: 1px solid #d6d5d5; border-radius: 0; transition: all 0.2s linear; background: #fff; color: #292935; box-sizing: border-box; -webkit-appearance: none; outline: none; }
          .quick-subscribe .qs-form input::placeholder { color: #a1a1a1; }
          .quick-subscribe .qs-form input:focus, .quick-subscribe .qs-form select:focus { border-color: #4044e6; box-shadow: 0px 4px 5.82px 0.18px rgba(35,31,32,0.13); outline: none; }
          .quick-subscribe .qs-form .custom-select { position: relative; user-select: none; margin-bottom: 8px; }
          .quick-subscribe .qs-form .custom-select-header { border: 1px solid #d6d5d5; background: #fff; color: #a1a1a1; height: 50px; cursor: pointer; position: relative; overflow: hidden; padding-right: 50px; transition: all 0.3s linear; }
          .quick-subscribe .qs-form .custom-select-header span { display: inline-block; padding: 13px; white-space: nowrap; }
          .quick-subscribe .qs-form .custom-select-header::after { font-family: 'Font Awesome 5 Free'; content: '\f107'; font-weight: bold; font-size: 22px; line-height: 1.3; position: absolute; color: #292935; right: 5px; top: 50%; transform: translateY(-50%); width: 22px; height: 22px; }
          .quick-subscribe .qs-form .custom-select-header.selected { color: #292935; }
          .quick-subscribe .qs-form .custom-select-list { display: none; background-color: #fff; list-style: none; padding-left: 0; margin: 0; border: 1px solid #d6d5d5; position: absolute; top: 100%; left: 0; right: 0; z-index: 10; height: auto; width: 100%; box-shadow: 0px 4px 5.82px 0.18px #D6D5D5; }
          .quick-subscribe .qs-form .custom-select-list.open { display: block; }
          .quick-subscribe .qs-form .custom-select-list li { padding: 0.625rem 0; cursor: pointer; color: #a1a1a1; font-weight: 300; padding-left: 20px; display: block; }
          .quick-subscribe .qs-form .custom-select-list li:hover { background-color: #ed145b; color: #fff; }
          .quick-subscribe .qs-form .consent-text { font-size: 0.75rem; line-height: 1.6; color: #a1a1a1; margin-bottom: 0.625rem; }
          .quick-subscribe .qs-form .consent-text p { text-align: left; margin-top: 0.625rem; margin-bottom: 0.625rem; font-size: 0.75rem; }
          .quick-subscribe .qs-form .consent-check { display: block; position: relative; margin: 10px 0; font-size: 0.75rem; color: #a1a1a1; cursor: pointer; }
          .quick-subscribe .qs-form .consent-check input[type="checkbox"] { position: absolute; left: -35px; z-index: 1; opacity: 0; cursor: pointer; }
          .quick-subscribe .qs-form .consent-check span { position: relative; padding-left: 35px; line-height: 1.6; cursor: pointer; }
          .quick-subscribe .qs-form .consent-check span::before { display: block; content: ''; width: 14px; height: 14px; border: 2px solid #ed145b; position: absolute; left: 0; top: 2px; border-radius: 3px; transition: all 0.2s linear; }
          .quick-subscribe .qs-form .consent-check span::after { display: block; content: ''; width: 5px; height: 8px; border-bottom: 1.5px solid #fff; border-right: 1.5px solid #fff; position: absolute; left: 4px; top: 4px; z-index: 1; transform: rotate(44deg); opacity: 0; transition: all 0.2s linear; }
          .quick-subscribe .qs-form .consent-check input:checked + span::before { background-color: #ed145b; }
          .quick-subscribe .qs-form .consent-check input:checked + span::after { opacity: 1; }
          .quick-subscribe .qs-form .form-submit { margin-top: 35px; }
          .quick-subscribe .qs-form button { display: inline-block; min-width: 150px; padding: 0.625rem 1.25rem; background: #ed145b; color: #fff; border: 2px solid #ed145b; font-family: 'Poppins', sans-serif; font-size: 1rem; font-weight: 600; text-align: center; text-transform: uppercase; cursor: pointer; border-radius: 3px; transition: all 0.2s linear; margin-top: 1.25rem; }
          .quick-subscribe .qs-form button:hover { background: #fff; border: 2px solid #ed145b; color: #ed145b; }
          .quick-subscribe .trapeze1 { width: 0; height: 710px; border-top: 206px solid transparent; border-bottom: 206px solid transparent; border-left: 2000px solid #ed145b; float: left; position: absolute; left: 0; top: 0; z-index: 1; }
          .quick-subscribe .trapeze2 { width: 0; height: 710px; border-top: 255px solid transparent; border-bottom: 255px solid transparent; border-right: 1000px solid #ed145b; float: right; position: absolute; right: 0; top: 0; z-index: 1; }
          @media (max-width: 768px) {
            .quick-subscribe .qs-content { flex-direction: column; }
            .quick-subscribe .qs-text { margin-top: 140px; }
            .quick-subscribe .qs-form { padding: 25px 20px 40px; }
          }

          /* Partner Slider */
          .partner-slider { display: flex; justify-content: center; align-items: center; gap: 40px; flex-wrap: wrap; padding: 20px 0; }
          .partner-slider a { text-decoration: none; }
          .partner-slider img { width: 180px; height: 180px; object-fit: contain; opacity: 0.6; transition: opacity 0.3s linear; }
          .partner-slider a:hover img { opacity: 1; }

          /* Blog Posts Module */
          .me-latest-posts-module { display: flex; flex-wrap: wrap; justify-content: center; }
          .me-latest-posts-module .post-single { width: calc(100% / 3); position: relative; padding: 100px 100px 160px; border-right: 1px solid rgba(45,45,45,0.15); border-bottom: 1px solid rgba(45,45,45,0.15); transition: .3s linear all; overflow: hidden; }
          .me-latest-posts-module .post-single:last-of-type { border-right: 0; }
          .me-latest-posts-module .post-single .post-day { position: absolute; top: 5px; right: 10px; font-size: 10rem; z-index: 1; color: rgba(161,161,161,0.15); font-weight: 700; line-height: 1; }
          .me-latest-posts-module .post-single .post-content { position: relative; z-index: 2; }
          .me-latest-posts-module .post-single .post-content h3 { margin-bottom: 15px; transition: all .3s linear; font-size: 18px; font-weight: 600; }
          .me-latest-posts-module .post-single p { color: #a1a1a1; font-size: 14px; line-height: 1.6; }
          .me-latest-posts-module .post-single p.date { margin-bottom: 20px; font-size: 13px; }
          .me-latest-posts-module .post-single .topics-wrapper { padding: 0; margin: 0 0 25px; text-transform: uppercase; list-style: none; }
          .me-latest-posts-module .post-single .topics-wrapper li { display: inline-block; }
          .me-latest-posts-module .post-single .topics-wrapper li a { color: #ed145b; font-size: 13px; text-decoration: none; font-weight: 500; }
          .me-latest-posts-module .post-single a.read-more { color: #ed145b; position: absolute; bottom: 100px; font-size: 16px; text-decoration: none; font-weight: 500; transition: .3s linear all; }
          .me-latest-posts-module .post-single .bg-image-placeholder { opacity: 0; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-size: cover; background-position: center; background-repeat: no-repeat; transition: .3s linear all; }
          .me-latest-posts-module .post-single .bg-image-placeholder .mask { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(45,45,45,0.77); }
          .me-latest-posts-module .post-single:hover { cursor: pointer; color: #fff; }
          .me-latest-posts-module .post-single:hover .bg-image-placeholder { opacity: 1; }
          .me-latest-posts-module .post-single:hover h3,
          .me-latest-posts-module .post-single:hover p,
          .me-latest-posts-module .post-single:hover a,
          .me-latest-posts-module .post-single:hover .topics-wrapper a { color: #fff; }
          .me-latest-posts-module .post-single:hover .post-day { opacity: 0; }
          @media (max-width: 1400px) {
            .me-latest-posts-module .post-single { padding: 60px 60px 120px; }
            .me-latest-posts-module .post-single a.read-more { bottom: 60px; }
            .me-latest-posts-module .post-single .post-day { font-size: 8.75rem; }
          }
          @media (max-width: 1024px) {
            .me-latest-posts-module .post-single { width: 100%; border-right: 0; border-top: 1px solid rgba(45,45,45,0.15); padding: 60px; }
            .me-latest-posts-module .post-single a.read-more { position: relative; bottom: auto; margin-top: 20px; display: inline-block; }
          }
          @media (max-width: 767px) {
            .me-latest-posts-module .post-single { padding: 30px; }
          }

          /* Footer Social Bar */
          .footer-socials-row { background-color: #ed145b; padding: 10px 0; }
          .footer-socials-row .socials-flex { display: flex; align-items: center; position: relative; }
          .follow-us-module-footer { display: flex; justify-content: space-around; align-items: center; list-style: none; padding: 0; margin: 0; flex: 1; }
          .follow-us-module-footer li { display: inline-block; }
          .follow-us-module-footer li a { color: #fff; font-size: 45px; text-decoration: none; display: inline-block; margin: 10px 20px; transition: all 0.3s linear; }
          .follow-us-module-footer li a:hover { color: #4044e6; }
          .footer-socials-row .socials-right { display: none; margin-left: auto; }
          .footer-socials-row .socials-right h3 { font-size: 24px; margin: 0; color: #fff; font-weight: 300; }
          .footer-socials-row .triangle { display: none; position: absolute; top: 100%; margin-top: 7px; width: 0; height: 0; border-style: solid; border-width: 34px 24.5px 0 24.5px; border-color: #ed145b transparent transparent transparent; }
          @media (min-width: 992px) {
            .footer-socials-row .socials-right { display: block; max-width: 306px; }
            .footer-socials-row .triangle { display: block; right: 240px; }
          }
          @media (min-width: 1200px) {
            .footer-socials-row .socials-right { max-width: 383px; }
            .footer-socials-row .triangle { right: 300px; }
          }
          @media (max-width: 576px) {
            .follow-us-module-footer li a { font-size: 35px; }
          }

          /* Footer Main */
          .footer--main .top { padding: 25px 0 55px; background-color: #4a4949; }
          .footer--main .top h3 { color: #fff; font-size: 26px; line-height: 28px; font-weight: 300; margin-bottom: 33px; }
          .footer--main .top p { color: #fff; font-size: 16px; font-weight: 300; }
          .footer--main .top a { color: #fff; font-weight: 300; text-decoration: none; transition: all 0.3s linear; }
          .footer--main .top a:hover { color: #ed145b; border: none; }
          .footer--main .top .menu-list a { display: block; padding: 0; }
          .footer--main .footer-layout { display: flex; }
          .footer--main .footer-left { max-width: 380px; padding-right: 30px; flex-shrink: 0; }
          .footer--main .footer-left h3 { margin-top: 25px; }
          .footer--main .footer-left h3:first-child { margin-top: 0; }
          .footer--main .footer-left .menu-list { list-style: none; padding: 0; margin: 4px 0 0; }
          .footer--main .footer-left .menu-list li { margin: 9px 0; }
          .footer--main .footer-left .menu-list li a { padding: 0; }
          .footer--main .footer-left .menu-list--big { margin-top: 20px; }
          .footer--main .footer-left .menu-list--big li { font-size: 18px; }
          .footer--main .footer-right { flex: 1; display: flex; }
          .footer--main .footer-blog { flex: 1; padding-right: 10px; }
          .footer--main .footer-blog .blog-item { margin-bottom: 20px; }
          .footer--main .footer-blog .blog-item a { color: #fff; font-weight: 300; transition: all 0.2s linear; }
          .footer--main .footer-blog .blog-item a:hover { color: #ed145b; }
          .footer--main .footer-blog .blog-date { width: 100%; display: inline-block; font-size: 16px; margin-top: 6px; padding-bottom: 13px; margin-bottom: 15px; border-bottom: 1px solid #fff; color: #fff; }
          .footer--main .footer-form { flex: 1; }
          .footer--main .footer-form h3.form-heading { opacity: 0; max-height: 36px; }
          .footer--main .footer-form .form-inner { margin-top: 33px; }
          .footer--main .footer-form input[type="text"],
          .footer--main .footer-form input[type="email"] { width: 100%; background: transparent; border: none; border-top: none; border-left: none; border-right: none; border-bottom: 1px solid #fff; color: #fff; padding: 10px 0; font-family: 'Poppins', sans-serif; font-size: 1rem; margin-bottom: 1.25rem; }
          .footer--main .footer-form input::placeholder { color: rgba(255,255,255,0.5); }
          .footer--main .footer-form input[type="text"]:focus,
          .footer--main .footer-form input[type="email"]:focus { outline: none; border-bottom-color: #ed145b; }
          .footer--main .footer-form .radio-group { margin-bottom: 15px; }
          .footer--main .footer-form .radio-group .radio-label { color: #fff; font-size: 14px; font-weight: 600; margin-bottom: 8px; }
          .footer--main .footer-form .radio-group .radio-option { color: #fff; font-size: 0.9375rem; font-weight: 300; position: relative; display: block; margin-bottom: 0.3125rem; padding-left: 35px; cursor: pointer; }
          .footer--main .footer-form .radio-group .radio-option input[type="radio"] { position: absolute; left: 0; z-index: 1; opacity: 0; cursor: pointer; }
          .footer--main .footer-form .radio-group .radio-option span { cursor: pointer; position: relative; }
          .footer--main .footer-form .radio-group .radio-option span::before { font-family: 'Font Awesome 5 Free'; display: block; content: '\f111'; position: absolute; left: -35px; top: 1px; color: #ed145b; transition: all 0.2s linear; }
          .footer--main .footer-form .radio-group .radio-option span::after { font-family: 'Font Awesome 5 Free'; display: block; content: '\f192'; position: absolute; left: -35px; top: 1px; color: #ed145b; opacity: 0; transition: all 0.2s linear; }
          .footer--main .footer-form .radio-group .radio-option input[type="radio"]:checked + span::after { opacity: 1; }
          .footer--main .footer-form .consent-check { display: block; position: relative; margin: 10px 0; font-size: 0.75rem; color: #fff; cursor: pointer; }
          .footer--main .footer-form .consent-check input[type="checkbox"] { position: absolute; left: -30px; z-index: 1; opacity: 0; cursor: pointer; }
          .footer--main .footer-form .consent-check span { position: relative; padding-left: 30px; line-height: 1.6; cursor: pointer; }
          .footer--main .footer-form .consent-check span::before { display: block; content: ''; width: 14px; height: 14px; border: 2px solid #ed145b; position: absolute; left: 0; top: 2px; border-radius: 3px; transition: all 0.2s linear; }
          .footer--main .footer-form .consent-check span::after { display: block; content: ''; width: 5px; height: 8px; border-bottom: 1.5px solid #fff; border-right: 1.5px solid #fff; position: absolute; left: 4px; top: 4px; z-index: 1; transform: rotate(44deg); opacity: 0; transition: all 0.2s linear; }
          .footer--main .footer-form .consent-check input:checked + span::before { background-color: #ed145b; }
          .footer--main .footer-form .consent-check input:checked + span::after { opacity: 1; }
          .footer--main .footer-form .consent-text { color: #fff; font-size: 0.75rem; line-height: 1.6; margin-bottom: 0.625rem; }
          .footer--main .footer-form .consent-text p { margin-top: 0.625rem; margin-bottom: 0.625rem; text-align: left; font-size: 0.75rem; }
          .footer--main .footer-form button { display: inline-block; min-width: 150px; font-family: 'Poppins', sans-serif; font-size: 1rem; font-weight: 600; text-align: center; text-transform: uppercase; padding: 0.625rem 1.25rem; border-radius: 3px; cursor: pointer; transition: all 0.2s linear; background-color: #ed145b; border: 2px solid #ed145b; color: #fff; margin-top: 1.25rem; }
          .footer--main .footer-form button:hover { background-color: #fff; border: 2px solid #ed145b; color: #ed145b; }

          /* Footer Bottom */
          .footer--main .bottom { position: relative; padding: 10px 0; background-color: #393939; }
          .footer--main .bottom .bottom-inner { display: flex; justify-content: space-between; align-items: center; color: #fff; margin: 10px 0; font-size: 16px; font-weight: 300; }
          .footer--main .bottom .bottom-links { text-align: right; }
          .footer--main .bottom .bottom-links a { display: inline-block; color: #fff; text-decoration: none; border-right: 1px solid #fff; padding: 0 15px; transition: all 0.2s linear; font-weight: 300; }
          .footer--main .bottom .bottom-links a:last-child { border-right: none; padding-right: 0; }
          .footer--main .bottom .bottom-links a:first-child { padding-left: 0; }
          .footer--main .bottom .bottom-links a:hover { color: #ed145b; }
          .footer--main .scroll-top { height: 100%; width: 69px; background-color: #ed145b; position: absolute; right: 0; bottom: 0; top: 0; cursor: pointer; display: flex; align-items: center; justify-content: center; }
          .footer--main .scroll-top i { font-size: 34px; color: #fff; transition: all 0.5s ease; }
          .footer--main .scroll-top:hover i { transform: translateY(-5px); }
          @media (max-width: 991px) {
            .footer--main .footer-layout { flex-direction: column; }
            .footer--main .footer-left { max-width: 100%; width: 100%; padding-right: 0; margin-bottom: 30px; }
            .footer--main .footer-form h3.form-heading { opacity: 1; max-height: none; }
          }
          @media (max-width: 767px) {
            .footer--main .top h3 { margin-top: 33px; margin-bottom: 20px; }
            .footer--main .footer-right { flex-direction: column; }
            .footer--main .bottom .bottom-inner { flex-direction: column; align-items: flex-start; gap: 10px; }
            .footer--main .bottom .bottom-inner { padding-right: 80px; }
          }

          /* Video background */
          .video-bg-wrapper { position: relative; overflow: hidden; }
          .video-bg-wrapper video { position: absolute; top: 50%; left: 50%; min-width: 100%; min-height: 100%; transform: translate(-50%, -50%); z-index: 0; }
          .video-bg-wrapper .content { position: relative; z-index: 1; }
          .video-bg-mask { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; }

          /* Cloud Email Image Slider */
          .cloud-slider { position: relative; margin-top: -8.75rem; z-index: 2; overflow: hidden; }
          .cloud-slider__track { display: flex; transition: transform 0.5s ease; }
          .cloud-slider__slide { min-width: 100%; text-align: center; padding: 0 15px; box-sizing: border-box; }
          .cloud-slider__slide img { max-width: 840px; width: 100%; height: auto; margin: 0.625rem auto 1.25rem; box-shadow: 0px 4px 14px 4px rgba(0,0,0,0.17); border-radius: 10px; }
          .cloud-slider__dots { text-align: center; margin-top: 1.25rem; }
          .cloud-slider__dot { display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: #ddd; margin: 0 5px; cursor: pointer; transition: background 0.3s; }
          .cloud-slider__dot--active { background: #ed145b; }
          @media (max-width: 580px) { .cloud-slider { margin-top: -3.125rem; } }

          /* Video Background Section */
          .video-bg-section { position: relative; width: 100%; padding: 70px 0; overflow: hidden; z-index: 1; }
          .video-bg-section__video { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); min-width: 100vw; height: auto; max-width: none; z-index: 1; }
          .video-bg-section__mask { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0.85; z-index: 2; }
          .video-bg-section__inner { position: relative; z-index: 3; display: flex; align-items: center; justify-content: center; }
          .video-bg-section__content { width: 45%; color: #fff; }
          .video-bg-section__content h2 { color: #fff; font-weight: 300; margin-bottom: 20px; }
          .video-bg-section__content ul { list-style: none; padding: 0; margin-left: 0; }
          .video-bg-section__content li { padding: 8px 0; padding-left: 1.5rem; font-size: 15px; color: rgba(255,255,255,0.85); }
          .video-bg-section__play { width: 55%; text-align: center; }
          .video-bg-section__play a { display: block; width: 100px; height: 100px; border: 4px solid #fff; border-radius: 50%; margin: 1.25rem auto; position: relative; transition: all 0.2s; }
          .video-bg-section__play a i { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); margin-left: 2px; color: #fff; font-size: 40px; transition: all 0.2s; }
          .video-bg-section__play a:hover { background: #fff; }
          .video-bg-section__play a:hover i { color: #ed145b; }
          @media (max-width: 767px) {
            .video-bg-section { padding: 45px 0; }
            .video-bg-section__inner { display: block; }
            .video-bg-section__content { width: 100%; }
            .video-bg-section__play { width: 100%; padding: 40px 0; }
          }

          /* Timeline v2 (alternating left/right) */
          .timeline-v2-wrapper { position: relative; overflow: hidden; min-height: 200px; }
          .timeline-v2-wrapper::before { content: ''; position: absolute; left: calc(50% - 1px); top: 40px; width: 0; height: calc(100% - 80px); border-right: 1px dashed #f1f1f1; z-index: 1; }
          .timeline-v2 { position: relative; width: 100%; max-width: 475px; }
          .timeline-v2__inner { display: block; padding: 25px 0 50px; position: relative; background-repeat: no-repeat; }
          .timeline-v2__inner .bg-icon { position: absolute; top: 50%; transform: translateY(-50%); z-index: -1; font-size: 250px; opacity: 0.02; color: #2d2d2d; }
          .timeline-v2__dot { position: relative; }
          .timeline-v2__dot h5 { padding-bottom: 20px; font-weight: 600; color: #ed145b; }
          .timeline-v2__dot::before { content: ''; position: absolute; display: block; width: 9px; height: 9px; border-radius: 50%; top: 38px; transform: translateY(-50%); background: #ed145b; z-index: 20; }
          .timeline-v2__dot span { display: block; position: absolute; width: 78px; height: 1px; top: 38px; border-bottom: 1px dashed #f1f1f1; transform: translateY(-50%); }
          .timeline-v2.right { float: right; clear: right; }
          .timeline-v2.right .bg-icon { right: 0; }
          .timeline-v2.right .timeline-v2__dot span { left: -108px; }
          .timeline-v2.right .timeline-v2__dot::before { left: -30px; }
          .timeline-v2.left { float: left; clear: left; }
          .timeline-v2.left .bg-icon { left: 0; }
          .timeline-v2.left .timeline-v2__dot, .timeline-v2.left .timeline-v2__text { text-align: right; }
          .timeline-v2.left .timeline-v2__dot span { right: -108px; }
          .timeline-v2.left .timeline-v2__dot::before { right: -30px; }
          @media (max-width: 1200px) {
            .timeline-v2-wrapper::before { display: none; }
            .timeline-v2 { max-width: 100%; margin-bottom: 50px; float: none !important; }
            .timeline-v2.left .timeline-v2__dot, .timeline-v2.left .timeline-v2__text { text-align: left; }
            .timeline-v2__dot::before, .timeline-v2__dot span { display: none; }
            .timeline-v2__inner { background-size: contain !important; background-position: right center !important; }
          }

          /* Counter boxes */
          .counter-boxes { display: flex; flex-wrap: wrap; justify-content: space-between; }
          .counter-box { width: 25%; padding: 0 15px; text-align: center; margin-bottom: 1.25rem; color: #fff; }
          .counter-box h3 { margin: 1.25rem 0; color: #fff; }
          .counter-box .counter-num { font-size: 3.5625rem; font-weight: bold; margin: 1.25rem auto; color: #fff; }
          @media (max-width: 991px) { .counter-box { width: 50%; } }
          @media (max-width: 576px) { .counter-box { width: 100%; } }

          /* Benefits icon bar (4 items horizontal) */
          .benefits-bar { display: flex; flex-wrap: wrap; justify-content: center; }
          .benefits-bar__item { width: 25%; padding: 0 5px; display: flex; flex-wrap: nowrap; }
          .benefits-bar__icon { width: 75px; line-height: 1; margin: 0.625rem 0; }
          .benefits-bar__icon i { font-size: 52px; }
          .benefits-bar__text { width: calc(100% - 75px); }
          .benefits-bar__text h4 { margin: 0.625rem 0; }
          @media (max-width: 991px) { .benefits-bar__item { width: 50%; margin-bottom: 1.25rem; } }
          @media (max-width: 767px) { .benefits-bar__item { width: 100%; } }

          /* Absolute positioned image */
          .absolute-image { position: relative; }
          .absolute-image img { position: absolute; z-index: -1; }
          .absolute-image--v-center img { top: 50%; transform: translateY(-50%); }
          .absolute-image--h-right img { left: 50%; margin-left: 50px; }
          @media (max-width: 1200px) { .absolute-image--h-right img { margin-left: 0 !important; } }
          .absolute-image--h-left img { right: 50%; margin-right: 50px; }
          @media (max-width: 1200px) { .absolute-image--h-left img { margin-left: 0 !important; margin-right: 0 !important; } }
          @media (max-width: 767px) {
            .absolute-image { min-height: 0 !important; }
            .absolute-image img { position: relative; top: unset; left: unset; transform: none; max-width: 100%; height: auto; }
          }

          /* Animations */
          @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
          @keyframes fadeInUp { from { opacity: 0; transform: translate3d(0, 100%, 0); } to { opacity: 1; transform: translate3d(0, 0, 0); } }
          @keyframes fadeInDown { from { opacity: 0; transform: translate3d(0, -100%, 0); } to { opacity: 1; transform: translate3d(0, 0, 0); } }
          @keyframes fadeInLeft { from { opacity: 0; transform: translate3d(-100%, 0, 0); } to { opacity: 1; transform: translate3d(0, 0, 0); } }
          @keyframes fadeInRight { from { opacity: 0; transform: translate3d(100%, 0, 0); } to { opacity: 1; transform: translate3d(0, 0, 0); } }
          @keyframes bounceInUp {
            from, 60%, 75%, 90%, to { animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
            from { opacity: 0; transform: translate3d(0, 3000px, 0); }
            60% { opacity: 1; transform: translate3d(0, -20px, 0); }
            75% { transform: translate3d(0, 10px, 0); }
            90% { transform: translate3d(0, -5px, 0); }
            to { transform: translate3d(0, 0, 0); }
          }
          @keyframes tada {
            from { transform: scale3d(1, 1, 1); }
            10%, 20% { transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); }
            30%, 50%, 70%, 90% { transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); }
            40%, 60%, 80% { transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); }
            to { transform: scale3d(1, 1, 1); }
          }
          .animate-on-scroll, .wow { opacity: 0; visibility: hidden; }
          .animated { animation-duration: 1s; animation-fill-mode: both; opacity: 1; visibility: visible; }
          .animated.fadeIn { animation-name: fadeIn; }
          .animated.fadeInUp { animation-name: fadeInUp; }
          .animated.fadeInDown { animation-name: fadeInDown; }
          .animated.fadeInLeft { animation-name: fadeInLeft; }
          .animated.fadeInRight { animation-name: fadeInRight; }
          .animated.bounceInUp { animation-name: bounceInUp; }
          .animated.tada { animation-name: tada; }

          /* Hero Banner */
          .hero-banner { position: relative; min-height: 640px; display: flex; align-items: center; justify-content: center; overflow: hidden; padding: 3.125rem 0; }
          .hero-banner video { position: absolute; top: 50%; left: 50%; min-width: 100%; min-height: 100%; transform: translate(-50%, -50%); z-index: 0; object-fit: cover; }
          .hero-banner .hero-content { position: relative; z-index: 3; text-align: center; color: #fff; padding: 0 20px; }
          .hero-banner .hero-content h1, .hero-banner .hero-content h2, .hero-banner .hero-content h3, .hero-banner .hero-content p { color: inherit; }
          .hero-banner h1 { font-size: 56px; font-weight: 300; font-style: italic; margin: 1.5625rem 0; }
          .hero-banner p { font-size: 1.25rem; font-weight: 300; margin: 1.25rem 0; }

          /* Sub-page Hero */
          .sub-hero { position: relative; min-height: 350px; display: flex; align-items: center; justify-content: center; background: linear-gradient(57deg, #1a1a2e 0%, #4044e6 25%, #ed145b 50%, #4044e6 75%, #1a1a2e 100%); background-size: 400% 400%; animation: gradient-shift 15s ease infinite; padding-top: 77px; }
          .sub-hero h1 { font-size: 42px; font-weight: 300; color: #fff; text-align: center; }

          /* Play button */
          .play-button { display: inline-flex; align-items: center; justify-content: center; width: 70px; height: 70px; border-radius: 50%; border: 2px solid #fff; color: #fff; font-size: 20px; transition: all 0.3s; }
          .play-button:hover { background: #ed145b; border-color: #ed145b; }

          /* Form styles */
          .cs-form input, .cs-form textarea, .cs-form select { width: 100%; padding: 12px 15px; border: 1px solid #ddd; font-family: 'Poppins', sans-serif; font-size: 14px; margin-bottom: 15px; border-radius: 3px; transition: border-color 0.3s; background: #fff; color: #2d2d2d; }
          .cs-form input:focus, .cs-form textarea:focus, .cs-form select:focus { outline: none; border-color: #ed145b; }
          .cs-form select { appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23555' d='M6 8L1 3h10z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 15px center; padding-right: 35px; }
          .cs-form label input[type="checkbox"] { width: auto; margin-bottom: 0; }
          .cs-form button { padding: 14px 35px; background: #ed145b; color: #fff; border: 2px solid #ed145b; font-family: 'Poppins', sans-serif; font-size: 13px; font-weight: 600; text-transform: uppercase; cursor: pointer; border-radius: 30px; transition: all 0.3s; }
          .cs-form button:hover { background: #fff; color: #ed145b; }

          /* Container */
          .cs-container { max-width: 1170px; margin: 0 auto; padding: 0 15px; }
          .cs-container--small { max-width: 800px; }
          .cs-container--medium { max-width: 975px; }
          .cs-container--big { max-width: 1340px; }

          /* HubSpot-style .container override (takes precedence over Tailwind) */
          .container { display: block; width: 100%; max-width: 1200px !important; padding-right: 15px; padding-left: 15px; margin-right: auto !important; margin-left: auto !important; box-sizing: border-box; float: none; }
          .container:before, .container:after { display: table; content: ""; }
          .container:after { clear: both; }
          .container.container--small { max-width: 740px !important; }
          .container.container--medium { max-width: 1020px !important; }
          .container.container--big { max-width: 1400px !important; }

          /* Absolute positioned image */
          .absolute-img-wrapper { position: relative; }
          .absolute-img-wrapper img { max-width: 100%; height: auto; }

          /* Gradient text overlay for hero sections */
          .gradient-bg { background: linear-gradient(57deg, #4044e6 20%, #ed145b 80%); }

          /* Sub-hero small (service pages) */
          /* me-hero-banner (product page hero) */
          .me-hero-banner { position: relative; overflow: hidden; background-size: cover; background-position: center; background-repeat: no-repeat; display: flex; flex-direction: column; justify-content: center; align-items: center; flex-wrap: wrap; height: auto; padding: 3.125rem 0; }
          @media (max-width: 580px) { .me-hero-banner { height: auto; padding: 6.25rem 0 3.125rem; } }
          .me-hero-banner--small { min-height: 31.25rem; }
          @media (max-width: 580px) { .me-hero-banner--small { min-height: 0; } }
          .me-hero-banner .me-mask { position: absolute; z-index: 2; top: 0; left: 0; width: 100%; height: 100%; opacity: 0.3; }
          .me-hero-banner .me-mask--gradient { background: linear-gradient(57deg, #4044e6 20%, #ed145b 80%); }
          .me-hero-banner .me-mask--animated {
            background: linear-gradient(57deg, #1a1a2e 0%, #4044e6 25%, #ed145b 50%, #4044e6 75%, #1a1a2e 100%);
            background-size: 400% 400%;
            animation: gradient-shift 15s ease infinite;
            opacity: 0.78;
          }
          .team-hero-title span {
            background: linear-gradient(90deg, #fff, #f472b6, #fff);
            background-size: 200% auto;
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
            animation: shimmer 3s linear infinite;
          }
          .me-hero-banner__content { z-index: 3; color: #fff; text-align: center; position: relative; }
          .me-hero-banner__content h1, .me-hero-banner__content h2, .me-hero-banner__content h3, .me-hero-banner__content p { color: inherit; }
          .me-hero-banner__content h1 { margin: 1.5625rem 0; }
          .me-hero-banner__content p { font-size: 1.25rem; margin: 1.25rem 0; }

          .sub-hero--small { min-height: 31.25rem; background-size: cover; background-position: center; position: relative; display: flex; align-items: center; justify-content: center; overflow: hidden; padding: 3.125rem 0; }
          @media (max-width: 580px) { .sub-hero--small { min-height: 0; padding: 6.25rem 0 3.125rem; } }
          .sub-hero--small .me-mask { position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100%; }
          .sub-hero--small .hero-content { position: relative; z-index: 3; text-align: center; color: #fff; }
          .sub-hero--small h1 { color: #fff; font-size: 3rem; font-weight: 600; margin: 1.5625rem 0; }
          .sub-hero--small p { font-size: 1.25rem; color: #fff; margin: 1.25rem 0; }

          /* Icon list cards (overlapping hero) */
          .icon-cards-overlap { position: relative; margin-top: -110px; margin-bottom: -30px; z-index: 2; display: flex; flex-wrap: wrap; justify-content: center; }
          .icon-cards-overlap .icon-card { width: 100%; max-width: 360px; margin: 0 15px 30px; background: #fff; box-shadow: 0 0 15px rgba(0,0,0,0.2); text-align: center; }
          .icon-cards-overlap .icon-card-inner { padding: 45px; }
          .icon-cards-overlap .icon-card-inner i { font-size: 45px; color: #ed145b; margin-bottom: 25px; display: block; transition: all .5s ease; }
          .icon-cards-overlap .icon-card-inner h5 { margin-bottom: 0.9375rem; }
          .icon-cards-overlap .icon-card:hover .icon-card-inner i { transform: scale(1.05); }
          .icon-cards-overlap .icon-card:hover .icon-card-inner { transform: scale(1.05); transition: all .5s ease; }
          @media (max-width: 580px) { .icon-cards-overlap { margin-top: -50px; } }
          @media (max-width: 767px) { .icon-cards-overlap .icon-card-inner { padding: 25px; } }

          /* Spacing utilities */
          .section-mt { margin-top: 6.25rem; }
          .section-mb { margin-bottom: 2.5rem; }
          .section-pt-half { padding-top: 3.125rem; }
          .section-pb { padding-bottom: 2.5rem; }
          @media (max-width: 767px) { .section-mt { margin-top: 3.125rem; } .section-mb { margin-bottom: 1.25rem; } }

          /* Background/text color utilities */
          .bg-first { background-color: #ed145b; color: #fff; }
          .bg-first h1,.bg-first h2,.bg-first h3,.bg-first h4,.bg-first h5,.bg-first h6,.bg-first p,.bg-first a:not(.cta-btn),.bg-first li { color: #fff; }
          .bg-dark { background-color: #2d2d2d; color: #fff; }
          .bg-dark h1,.bg-dark h2,.bg-dark h3,.bg-dark h4,.bg-dark h5,.bg-dark h6,.bg-dark p,.bg-dark a:not(.cta-btn),.bg-dark li,.bg-dark i { color: #fff; }
          .bg-gradient { background: linear-gradient(57deg, #1a1a2e 0%, #4044e6 25%, #ed145b 50%, #4044e6 75%, #1a1a2e 100%); background-size: 400% 400%; animation: gradient-shift 15s ease infinite; }

          /* Shimmer text colours */
          [class^="shimmer-"] { background-size: 200% auto; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; animation: shimmer 3s linear infinite; }
          .shimmer-emerald { background-image: linear-gradient(90deg, #fff, #34d399, #fff); }
          .shimmer-amber { background-image: linear-gradient(90deg, #fff, #fbbf24, #fff); }
          .shimmer-violet { background-image: linear-gradient(90deg, #fff, #a78bfa, #fff); }
          .shimmer-orange { background-image: linear-gradient(90deg, #fff, #fb923c, #fff); }
          .shimmer-teal { background-image: linear-gradient(90deg, #fff, #2dd4bf, #fff); }
          .shimmer-blue { background-image: linear-gradient(90deg, #fff, #60a5fa, #fff); }
          .shimmer-lime { background-image: linear-gradient(90deg, #fff, #a3e635, #fff); }
          .shimmer-rose { background-image: linear-gradient(90deg, #fff, #fb7185, #fff); }
          .shimmer-coral { background-image: linear-gradient(90deg, #fff, #f97316, #fff); }
          .shimmer-indigo { background-image: linear-gradient(90deg, #fff, #818cf8, #fff); }
          .shimmer-yellow { background-image: linear-gradient(90deg, #fff, #facc15, #fff); }
          .shimmer-slate { background-image: linear-gradient(90deg, #fff, #94a3b8, #fff); }

          /* Text/Image split sections */
          .split-section { display: flex; flex-wrap: nowrap; width: 100%; }
          .split-section .split-bg { width: 50%; background-size: cover; background-position: center; background-repeat: no-repeat; min-height: 360px; }
          .split-section .split-content { width: 50%; padding: 3.75rem 30px 2.5rem; min-width: 540px; display: flex; align-items: center; }
          .split-section .split-content .split-inner { max-width: 555px; width: 100%; }
          .split-section .split-content h2, .split-section .split-content h3, .split-section .split-content p { color: #292935; }
          .split-section .split-content.bg-dark h2, .split-section .split-content.bg-dark h3, .split-section .split-content.bg-dark p { color: #fff; }
          .split-section .split-content.split-content--light-text h2, .split-section .split-content.split-content--light-text h3, .split-section .split-content.split-content--light-text p { color: #fff; }
          .split-section--left .split-bg { order: 1; }
          .split-section--left .split-content { order: 2; }
          .split-section--right .split-bg { order: 2; }
          .split-section--right .split-content { order: 1; }
          .split-section--right .split-content .split-inner { margin-left: auto; width: auto; }
          .split-section--left .split-content .split-inner { margin-right: auto; width: auto; }
          @media (max-width: 767px) {
            .split-section { flex-wrap: wrap; }
            .split-section .split-bg { width: 100% !important; min-height: 250px; }
            .split-section .split-content { width: 100% !important; min-width: 0; padding: 2.5rem 15px; }
          }

          /* Icon grid (inside split sections) */
          .icon-grid-3col { display: flex; flex-wrap: wrap; justify-content: space-between; padding-top: 1.25rem; }
          .icon-grid-3col .icon-grid-item { display: flex; margin-bottom: 1.25rem; width: 100%; max-width: 30%; }
          .icon-grid-3col .icon-grid-item .icon-col { width: 75px; line-height: 1; }
          .icon-grid-3col .icon-grid-item .icon-col i { font-size: 50px; }
          .icon-grid-3col .icon-grid-item .text-col { width: calc(100% - 75px); font-size: 14px; line-height: 1.6; }
          @media (max-width: 1400px) { .icon-grid-3col .icon-grid-item { max-width: 48%; } }
          @media (max-width: 1200px) { .icon-grid-3col .icon-grid-item { max-width: 100%; } }

          /* CTA bar */
          .cta-bar { display: flex; justify-content: center; align-items: center; flex-wrap: nowrap; padding-top: 1.5625rem; }
          .cta-bar h2 { width: 100%; max-width: 60%; text-align: center; margin: 0; color: #fff; }
          .cta-bar .cta-bar-btn { width: 100%; max-width: 40%; text-align: center; }
          @media (max-width: 767px) { .cta-bar { flex-wrap: wrap; } .cta-bar h2, .cta-bar .cta-bar-btn { max-width: 100%; text-align: center; margin-bottom: 1.25rem; } }

          /* CTA button variants */
          .cta-btn { display: inline-block; min-width: 150px; font-family: 'Poppins', sans-serif; font-size: 1rem; font-weight: 600; text-align: center; text-transform: uppercase; padding: 0.625rem 1.25rem; border-radius: 3px; cursor: pointer; transition: all .2s linear; text-decoration: none; }
          .cta-btn-primary { background: #ed145b; border: 2px solid #ed145b; color: #fff; }
          .cta-btn-primary:hover { background: #fff; border: 2px solid #ed145b; color: #ed145b; }
          .cta-btn-quat-mix { background: #fff; border: 2px solid #4044e6; color: #ed145b; }
          .cta-btn-quat-mix:hover { background: #4044e6; border: 2px solid #4044e6; color: #fff; }

          /* Accordion */
          .accordion-wrap { padding-top: 1.875rem; }
          .accordion-item { width: 100%; margin-bottom: 1px; }
          .accordion-item:nth-child(even) .accordion-header { background: #393939; }
          .accordion-item:nth-child(odd) .accordion-header { background: #4a4949; }
          .accordion-header { display: flex; padding: 0.9375rem 20px; justify-content: space-between; align-items: center; cursor: pointer; border-bottom: 1px solid #ed145b; color: #fff; }
          .accordion-header h4 { margin: 0; color: #fff; font-weight: 600; }
          .accordion-dots { position: relative; width: 50px; height: 20px; }
          .accordion-dots span { position: absolute; display: inline-block; width: 10px; height: 10px; background: #fff; border-radius: 50%; top: 50%; transform: translateY(-50%); transition: all .3s ease; }
          .accordion-dots span:nth-of-type(1) { left: 0; }
          .accordion-dots span:nth-of-type(2) { left: 16px; }
          .accordion-dots span:nth-of-type(3) { left: 32px; }
          .accordion-header.active .accordion-dots span { left: 50%; transform: translate(-50%, -50%); }
          .accordion-body { max-height: 0; overflow: hidden; transition: max-height 0.4s ease; background: #ed145b; }
          .accordion-body-inner { padding: 1.25rem 20px; color: #fff; }
          .accordion-body-inner p { color: #fff; display: inline-block; }

          /* Icons Mockup section */
          .icons-mocup { display: flex; flex-wrap: nowrap; }
          .icons-mocup__icons { width: 36%; }
          .icons-mocup__icons--left { text-align: right; }
          .icons-mocup__icons--right { text-align: left; }
          .icons-mocup__icon-box { display: flex; margin-bottom: 1.875rem; }
          .icons-mocup__icon-box-text { width: calc(100% - 100px); }
          .icons-mocup__icon-box-text h4 { margin-bottom: 0.3125rem; color: #fff; font-size: 1.25rem; font-weight: 400; }
          .icons-mocup__icon-box-text p { margin-bottom: 0.3125rem; font-size: 0.875rem; color: #fff; }
          .icons-mocup__icon-box-icon { width: 100px; }
          .icons-mocup__icon-box-icon i { font-size: 5rem; line-height: 1; color: #fff; }
          .icons-mocup__mocup { position: relative; width: 28%; text-align: center; min-width: 265px; }
          .icons-mocup__mocup img { max-width: 100%; height: auto; }
          @media (max-width: 991px) {
            .icons-mocup { flex-wrap: wrap; }
            .icons-mocup__icons { width: 50%; }
            .icons-mocup__icons--left { order: 2; text-align: left; }
            .icons-mocup__icons--right { order: 3; }
            .icons-mocup__mocup { width: 100%; order: 1; }
            .icons-mocup__icon-box-icon { order: 1; }
            .icons-mocup__icon-box-text { order: 2; }
          }
          @media (max-width: 767px) {
            .icons-mocup__icons { width: 100%; }
          }

          /* Hero Banner Landing (contact form with gradient) */
          .hero-banner-landing { min-height: 695px; position: relative; display: flex; align-items: center; padding: 3.125rem 0; background-size: cover; background-position: center; background-repeat: no-repeat; }
          .hero-banner-landing .opacity-bg { position: absolute; width: 100%; height: 100%; top: 0; left: 0; }
          .hero-banner-landing__bg { position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: linear-gradient(57deg, #4044e6 20%, #ed145b 80%); opacity: 1; }
          .hero-banner-landing__inner { position: relative; display: flex; flex-wrap: nowrap; width: 100%; }
          .hero-banner-wrap { z-index: 1; text-align: left; flex-grow: 1.2; max-width: 570px; margin-right: 20px; }
          .hero-banner-wrap h2, .hero-banner-wrap h3, .hero-banner-wrap p { color: #fff; }
          .form-placeholder { margin-left: auto; flex-grow: 0.8; max-width: 585px; width: 100%; }
          .hero-banner-form { z-index: 1; border-radius: 3px; box-shadow: 0px 10px 30px 0px rgba(41,41,53,0.3); background-color: #fff; padding: 1.875rem 30px 0.625rem; }
          .banner-form-title { text-align: center; margin-bottom: 1.25rem; }
          .banner-form-title h3 { text-align: center; }
          .banner-form-title p { color: #a1a1a1; }
          @media (max-width: 767px) {
            .hero-banner-landing__inner { flex-wrap: wrap; }
            .hero-banner-wrap { max-width: 100%; margin-right: 0; margin-bottom: 2rem; }
            .form-placeholder { margin-right: auto; max-width: 100%; }
          }

          /* Testimonials */
          .testimonials-quotes { background-color: #2d2d2d; position: relative; background-size: cover; background-repeat: no-repeat; background-position: center; padding: 5rem 0; }
          .testimonials-quotes h2 { color: #fff; position: relative; }
          .testimonial-mask { position: absolute; top: 0; left: 0; height: 100%; width: 100%; background-color: rgba(0,0,0,0.14); }
          .testimonials-grid { display: flex; gap: 30px; justify-content: center; margin-top: 2.5rem; position: relative; }
          .testimonial-box { text-align: center; max-width: 360px; min-width: 240px; flex: 1; }
          .testimonial-quote { background-color: #fff; border-radius: 3px; padding: 2.1875rem 25px; font-size: 0.8125rem; position: relative; box-shadow: 6px 6px #ed145b; }
          .testimonial-quote:before { font-family: 'Palanquin', sans-serif; content: '\201C'; position: absolute; font-size: 9.375rem; color: #ed145b; transform: rotate(180deg); top: -20px; left: 10px; line-height: 1; opacity: 0.3; }
          .testimonial-quote:after { content: ''; position: absolute; bottom: -1.125rem; left: 50%; margin-left: -13px; border-left: 13px solid transparent; border-right: 13px solid transparent; border-top: 19px solid #fff; filter: drop-shadow(8px 1px #ed145b); }
          .testimonial-quote p { color: #000; margin: 0; }
          .person { margin-top: 1.875rem; display: flex; align-items: center; justify-content: center; }
          .person__image img { height: 66px; width: 66px; border-radius: 50%; border: 3px solid #ed145b; }
          .person__desc { padding: 0 15px; text-align: left; }
          .person__desc h4 { font-size: 1.125rem; line-height: 1.1; margin: 0; color: #fff; }
          .person__desc p { font-size: 0.875rem; margin: 0; margin-top: 0.3125rem; color: #fff; }
          @media (max-width: 991px) {
            .testimonials-grid { flex-wrap: wrap; }
            .testimonial-box { max-width: 100%; min-width: 0; }
          }

          /* Testimonial slider (single-item scroll) */
          .testimonial-slider { position: relative; overflow: hidden; max-width: 420px; margin: 2.5rem auto 0; }
          .testimonial-slider__track { display: flex; transition: transform 0.5s ease; }
          .testimonial-slider__item { min-width: 100%; padding: 0 10px; box-sizing: border-box; }
          .testimonial-slider__dots { text-align: center; margin-top: 1.5rem; position: relative; }
          .testimonial-slider__dot { display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: rgba(255,255,255,0.4); margin: 0 5px; cursor: pointer; transition: background 0.3s; }
          .testimonial-slider__dot--active { background: #ed145b; }

          /* Pricing cards */
          .pricing-row { display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap; }
          .pricing-card { width: 365px; min-height: 555px; margin: 0 5px; display: flex; }
          .pricing-card .pricing-box { width: 100%; background: #ebebeb; padding: 1.25rem; box-shadow: 0 8px 10px rgba(0,0,0,0.13); text-align: center; display: flex; flex-direction: column; }
          .pricing-card .pricing-box .content { display: flex; flex-direction: column; flex: 1; }
          .pricing-card .pricing-box .content ul { flex: 1; }
          .pricing-card .pricing-box .content .cta-btn { margin-top: auto; }
          .pricing-card .pricing-box .price-from { margin-top: 0; font-size: 16px; }
          .pricing-card .pricing-box h4 { font-size: 4.3125rem; line-height: 1; margin: 0; }
          .pricing-card .pricing-box small { font-size: 1rem; }
          .pricing-card .pricing-box h5 { margin: 0.9375rem 0 0; font-size: 1.375rem; }
          .pricing-card .pricing-box ul { list-style: none; padding: 0; margin: 0 0 1.875rem 0; text-align: center; }
          .pricing-card .pricing-box ul li { font-weight: 300; font-size: 1rem; margin: 0.9375rem 0; padding-left: 0; position: relative; }
          .pricing-card .pricing-box ul li::before { display: none; }
          .pricing-card--featured { transform: scale(1.13); transform-origin: top center; z-index: 40; margin: 0.75rem; }
          .pricing-card--featured .pricing-box { background: #ed145b; color: #fff; }
          .pricing-card--featured .pricing-box h4,.pricing-card--featured .pricing-box h5,.pricing-card--featured .pricing-box p,.pricing-card--featured .pricing-box li,.pricing-card--featured .pricing-box small,.pricing-card--featured .pricing-box .price-from { color: #fff; }
          .pricing-card--featured .pricing-box .cta-btn { background: #fff; border: 2px solid #4044e6; color: #ed145b; }
          .pricing-card--featured .pricing-box .cta-btn:hover { background: #4044e6; border: 2px solid #4044e6; color: #fff; }
          @media (max-width: 1200px) { .pricing-card { width: 300px; margin: 0.5625rem; } }
          @media (max-width: 1024px) { .pricing-card { width: 365px; min-height: 0; margin: 0 0 1.875rem; } .pricing-card--featured { transform: scale(1); } }

          /* Web Dev pricing cards (new-builds style — glassmorphism) */
          @keyframes wd-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-20px); } }

          .wd-pricing { background: #2d2d2d; padding: 5rem 0; }
          .wd-pricing h2 { color: #fff; }
          .wd-pricing p.wd-pricing-sub { color: rgba(255,255,255,0.55); }

          .wd-pricing-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; align-items: stretch; max-width: 100%; }

          .wd-price-card {
            background: linear-gradient(145deg, rgba(30, 30, 40, 0.9), rgba(20, 20, 30, 0.95));
            border-radius: 16px;
            padding: 24px 18px;
            display: flex;
            flex-direction: column;
            position: relative;
            border: 1px solid rgba(255, 255, 255, 0.1);
            transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
            overflow: hidden;
            backdrop-filter: blur(10px);
          }
          .wd-price-card::before {
            content: '';
            position: absolute;
            top: 0; left: 0; right: 0;
            height: 4px;
            background: linear-gradient(90deg, #4044e6, #6366f1);
            transition: all 0.4s;
          }
          .wd-price-card::after {
            content: '';
            position: absolute;
            top: 0; left: 0; right: 0; bottom: 0;
            background: radial-gradient(circle at top right, rgba(64, 68, 230, 0.1), transparent 50%);
            pointer-events: none;
          }
          .wd-price-card:hover {
            transform: translateY(-16px) scale(1.02);
            box-shadow: 0 40px 80px rgba(64, 68, 230, 0.25), 0 0 40px rgba(64, 68, 230, 0.1);
            border-color: rgba(64, 68, 230, 0.4);
          }
          .wd-price-card:hover::before {
            background: linear-gradient(90deg, #4044e6, #ed145b, #4044e6);
            background-size: 200% auto;
            animation: shimmer 2s linear infinite;
          }

          /* Featured card */
          .wd-price-card--pop {
            border: 2px solid #ed145b;
            background: linear-gradient(145deg, rgba(237, 20, 91, 0.12), rgba(30, 30, 40, 0.95));
            transform: scale(1.02);
            z-index: 2;
            box-shadow: 0 30px 60px rgba(237, 20, 91, 0.2);
          }
          .wd-price-card--pop::before {
            height: 5px;
            background: linear-gradient(90deg, #ed145b, #ff6b6b, #ed145b);
            background-size: 200% auto;
            animation: shimmer 3s linear infinite;
          }
          .wd-price-card--pop::after {
            background: radial-gradient(circle at top right, rgba(237, 20, 91, 0.15), transparent 50%);
          }
          .wd-price-card--pop:hover {
            transform: scale(1.02) translateY(-12px);
            box-shadow: 0 50px 100px rgba(237, 20, 91, 0.3);
          }

          /* Badge */
          .wd-price-badge {
            position: absolute;
            top: -1px; right: 24px;
            background: linear-gradient(135deg, #ed145b, #ff6b6b);
            color: #fff;
            font-size: 11px;
            font-weight: 800;
            padding: 8px 18px 12px;
            border-radius: 0 0 12px 12px;
            text-transform: uppercase;
            letter-spacing: 1px;
            box-shadow: 0 4px 20px rgba(237, 20, 91, 0.4);
          }

          /* Card top / tier name */
          .wd-price-top { margin-bottom: 24px; }
          .wd-price-card h3 {
            font-size: 26px;
            font-weight: 800;
            color: #fff;
            margin: 0 0 8px;
            letter-spacing: -0.5px;
          }
          .wd-price-card--pop h3 {
            background: linear-gradient(90deg, #ed145b, #ff6b6b);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
          }
          .wd-price-desc {
            font-size: 14px;
            color: rgba(255, 255, 255, 0.6);
            line-height: 1.5;
            margin: 0;
          }

          /* Price block */
          .wd-price-amount {
            display: flex;
            align-items: flex-start;
            gap: 4px;
            margin-bottom: 28px;
            padding-bottom: 24px;
            border-bottom: 1px solid rgba(255, 255, 255, 0.08);
          }
          .wd-price-amount .currency {
            font-size: 22px;
            font-weight: 700;
            color: rgba(255, 255, 255, 0.7);
            margin-top: 8px;
          }
          .wd-price-amount .value {
            font-size: 48px;
            font-weight: 800;
            color: #fff;
            letter-spacing: -2px;
            line-height: 1;
          }
          .wd-price-card--pop .value {
            background: linear-gradient(90deg, #ed145b, #ff6b6b);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
          }
          .wd-price-amount .period {
            font-size: 15px;
            color: rgba(255, 255, 255, 0.5);
            align-self: flex-end;
            margin-bottom: 10px;
          }

          /* Features list */
          .wd-price-features {
            list-style: none;
            padding: 0;
            margin: 0 0 28px 0;
            flex: 1;
          }
          .wd-price-features li {
            display: flex;
            align-items: center;
            gap: 12px;
            padding: 10px 0;
            padding-left: 0;
            margin: 0;
            font-size: 13px;
            color: #fff;
            border-bottom: 1px solid rgba(255, 255, 255, 0.06);
            transition: all 0.3s;
          }
          .wd-price-features li::before { display: none; }
          .wd-price-features li:last-child { border-bottom: none; }
          .wd-price-features li:hover { padding-left: 8px; }
          .wd-price-features li svg {
            width: 22px;
            height: 22px;
            flex-shrink: 0;
          }
          .wd-price-features li.included .check-icon {
            color: #ed145b;
            filter: drop-shadow(0 0 6px rgba(237, 20, 91, 0.5));
          }
          .wd-price-features li.excluded {
            color: rgba(255, 255, 255, 0.4);
          }
          .wd-price-features li.excluded .x-icon {
            color: rgba(255, 255, 255, 0.2);
          }

          /* CTA buttons */
          .wd-price-cta {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 12px;
            width: 100%;
            padding: 18px 28px;
            font-size: 16px;
            font-weight: 700;
            border-radius: 14px;
            cursor: pointer;
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            text-decoration: none;
            position: relative;
            overflow: hidden;
            margin-top: auto;
            border: none;
          }
          .wd-price-cta svg {
            width: 20px;
            height: 20px;
            transition: transform 0.4s;
          }
          .wd-price-cta:hover svg {
            transform: translateX(6px);
          }
          .wd-price-cta--fill {
            background: linear-gradient(135deg, #ed145b, #ff6b6b);
            color: #fff;
            box-shadow: 0 8px 30px rgba(237, 20, 91, 0.4);
          }
          .wd-price-cta--fill::before {
            content: '';
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
            transition: left 0.5s;
          }
          .wd-price-cta--fill:hover::before {
            left: 100%;
          }
          .wd-price-cta--fill:hover {
            box-shadow: 0 12px 40px rgba(237, 20, 91, 0.5);
            transform: translateY(-3px);
          }
          .wd-price-cta--outline {
            background: linear-gradient(135deg, rgba(64, 68, 230, 0.2), rgba(99, 102, 241, 0.2));
            color: #fff;
            border: 1px solid rgba(64, 68, 230, 0.4);
          }
          .wd-price-cta--outline:hover {
            background: linear-gradient(135deg, rgba(64, 68, 230, 0.3), rgba(99, 102, 241, 0.3));
            border-color: #4044e6;
            color: #fff;
            box-shadow: 0 8px 30px rgba(64, 68, 230, 0.3);
            transform: translateY(-3px);
          }

          /* Responsive */
          @media (max-width: 1200px) {
            .wd-pricing-grid { grid-template-columns: repeat(4, 1fr); gap: 12px; }
            .wd-price-card { padding: 20px 16px; }
          }
          @media (max-width: 1024px) {
            .wd-pricing-grid { grid-template-columns: repeat(2, 1fr); gap: 16px; }
            .wd-price-card { padding: 24px 20px; }
          }
          @media (max-width: 600px) {
            .wd-pricing-grid { grid-template-columns: 1fr; max-width: 450px; margin-left: auto; margin-right: auto; }
            .wd-price-card--pop { transform: none; }
            .wd-price-card--pop:hover { transform: translateY(-12px); }
          }
          @media (max-width: 480px) {
            .wd-price-amount .value { font-size: 48px; }
            .wd-price-card { padding: 28px 24px; }
            .wd-price-card h3 { font-size: 24px; }
          }

          /* Web Dev FAQ — card grid */
          .wd-faq { background: #1a1a2e; padding: 5rem 0; }
          .wd-faq-head { text-align: center; margin-bottom: 48px; }
          .wd-faq-head h2 { color: #fff; margin-bottom: 12px; }
          .wd-faq-head p { color: rgba(255,255,255,0.5); max-width: 520px; margin: 0 auto; font-size: 1rem; line-height: 1.6; }

          .wd-faq-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 20px;
          }
          .wd-faq-card {
            background: linear-gradient(145deg, rgba(30, 30, 45, 0.9), rgba(20, 20, 35, 0.95));
            border: 1px solid rgba(255, 255, 255, 0.08);
            border-radius: 16px;
            padding: 28px 24px;
            position: relative;
            overflow: hidden;
            backdrop-filter: blur(10px);
            transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
          }
          .wd-faq-card::before {
            content: '';
            position: absolute;
            top: 0; left: 0; right: 0;
            height: 3px;
            background: linear-gradient(90deg, #4044e6, #6366f1);
            opacity: 0;
            transition: opacity 0.4s;
          }
          .wd-faq-card::after {
            content: '';
            position: absolute;
            top: 0; left: 0; right: 0; bottom: 0;
            background: radial-gradient(circle at top right, rgba(64, 68, 230, 0.08), transparent 60%);
            pointer-events: none;
          }
          .wd-faq-card:hover {
            transform: translateY(-6px);
            border-color: rgba(64, 68, 230, 0.35);
            box-shadow: 0 20px 50px rgba(64, 68, 230, 0.15);
          }
          .wd-faq-card:hover::before { opacity: 1; }

          .wd-faq-icon {
            width: 44px;
            height: 44px;
            border-radius: 12px;
            background: linear-gradient(135deg, rgba(237, 20, 91, 0.15), rgba(237, 20, 91, 0.05));
            border: 1px solid rgba(237, 20, 91, 0.2);
            display: flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 18px;
          }
          .wd-faq-icon svg {
            width: 22px;
            height: 22px;
            color: #ed145b;
          }
          .wd-faq-card h4 {
            color: #fff;
            font-size: 1.05rem;
            font-weight: 700;
            margin: 0 0 10px;
            line-height: 1.4;
          }
          .wd-faq-card p {
            color: rgba(255, 255, 255, 0.55);
            font-size: 0.9rem;
            line-height: 1.65;
            margin: 0;
          }

          @media (max-width: 768px) {
            .wd-faq-grid { grid-template-columns: 1fr; }
          }

          /* Responsive: advantages 3-col grid & tech 5-col grid (inline grids in Pages.tsx) */
          @media (max-width: 1024px) {
            .wd-advantages-grid { grid-template-columns: repeat(2, 1fr) !important; }
            .wd-tech-grid { grid-template-columns: repeat(3, 1fr) !important; }
          }
          @media (max-width: 640px) {
            .wd-advantages-grid { grid-template-columns: 1fr !important; }
            .wd-tech-grid { grid-template-columns: repeat(2, 1fr) !important; }
          }
          @media (max-width: 480px) {
            .wd-tech-grid { grid-template-columns: 1fr !important; }
          }

          /* Skills / Progress bars */
          .skills-section { display: flex; flex-wrap: wrap; width: 100%; }
          .skills-section .skills-text { width: 50%; padding-right: 15px; }
          .skills-section .skills-bars { width: 50%; padding-left: 15px; }
          .skills-section .bar-group { margin-top: 0.375rem; }
          .skills-section .bar-label { font-size: 1rem; margin: 1.125rem 0 1rem; font-weight: 600; }
          .skills-section .bar-track { width: 100%; height: 19px; border-radius: 10px; background: #4044e6; position: relative; margin-bottom: 0.5rem; }
          .skills-section .bar-fill { height: 19px; background: #ed145b; border-radius: 10px; position: relative; width: 0; transition: width 1s linear; }
          .skills-section .bar-fill .bar-circle { position: absolute; height: 19px; width: 19px; top: 0; right: -5px; border-radius: 50%; background: #ed145b; }
          .skills-section .bar-fill .bar-val { position: absolute; top: -23px; right: -5px; color: #292935; font-size: 16px; font-weight: 600; }
          @media (max-width: 767px) { .skills-section .skills-text, .skills-section .skills-bars { width: 100%; padding: 0; } }

          /* Portfolio showcase */
          .portfolio-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
          .portfolio-item { position: relative; border-radius: 12px; overflow: hidden; box-shadow: 0 8px 30px rgba(0,0,0,0.12); transition: transform 0.4s ease, box-shadow 0.4s ease; }
          .portfolio-item:hover { transform: translateY(-8px); box-shadow: 0 16px 50px rgba(0,0,0,0.2); }
          .portfolio-item img { width: 100%; display: block; transition: transform 0.4s ease; }
          .portfolio-item:hover img { transform: scale(1.03); }
          .portfolio-item .portfolio-overlay { position: absolute; bottom: 0; left: 0; right: 0; background: rgba(15,15,25,0.92); padding: 24px 20px 20px; transform: translateY(100%); transition: transform 0.4s ease; }
          .portfolio-item:hover .portfolio-overlay { transform: translateY(0); }
          .portfolio-item > a { display: block; text-decoration: none; color: inherit; }
          .portfolio-overlay h4 { color: #fff; font-size: 1.1rem; margin: 0 0 6px; }
          .portfolio-overlay p { color: rgba(255,255,255,0.9); font-size: 0.85rem; margin: 0; line-height: 1.5; }
          .portfolio-overlay .portfolio-tag { display: inline-block; background: #ed145b; color: #fff; font-size: 0.7rem; font-weight: 600; padding: 3px 10px; border-radius: 20px; margin-top: 8px; text-transform: uppercase; letter-spacing: 0.05em; }
          @media (max-width: 767px) { .portfolio-grid { grid-template-columns: 1fr; } }
          @media (min-width: 768px) and (max-width: 1024px) { .portfolio-grid { grid-template-columns: repeat(2, 1fr); } }

          /* Process steps */
          .process-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; position: relative; }
          .process-step { text-align: center; padding: 0 25px; position: relative; z-index: 1; }
          .process-step-num { display: inline-flex; align-items: center; justify-content: center; width: 60px; height: 60px; border-radius: 50%; background: linear-gradient(135deg, #4044e6, #ed145b); color: #fff; font-size: 1.5rem; font-weight: 700; margin-bottom: 20px; position: relative; z-index: 2; }
          .process-step h4 { font-size: 1.1rem; margin: 0 0 10px; color: #292935; }
          .process-step p { font-size: 0.9rem; color: #666; line-height: 1.6; }
          .process-step::after { content: ''; position: absolute; top: 29px; left: calc(50% + 30px); width: calc(100% - 60px); height: 3px; background: linear-gradient(90deg, #4044e6, #ed145b); z-index: 0; }
          .process-step:last-child::after { display: none; }
          @media (max-width: 767px) { .process-steps { grid-template-columns: 1fr; gap: 30px; } .process-step::after { display: none; } }
          @media (min-width: 768px) and (max-width: 1024px) { .process-steps { grid-template-columns: repeat(2, 1fr); gap: 30px; } .process-step:nth-child(2)::after, .process-step:nth-child(4)::after { display: none; } }

          /* Tech logos */
          .tech-logos { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 40px; opacity: 0.6; transition: opacity 0.3s; }
          .tech-logos:hover { opacity: 1; }
          .tech-logos svg { height: 32px; width: auto; fill: #555; }

          /* Full-size subscribe/contact form section */
          .subscribe-full { display: flex; flex-wrap: wrap; width: 100%; }
          .subscribe-full .subscribe-left { width: 50%; position: relative; display: flex; justify-content: flex-end; align-items: center; background-size: cover; background-position: center; padding: 5rem 0; }
          .subscribe-full .subscribe-left .sub-mask { position: absolute; width: 100%; height: 100%; top: 0; left: 0; }
          .subscribe-full .subscribe-left .sub-content { position: relative; max-width: 600px; padding: 0 30px 0 15px; color: #fff; }
          .subscribe-full .subscribe-left .sub-content h2,.subscribe-full .subscribe-left .sub-content p { color: #fff; }
          .subscribe-full .subscribe-left .sub-icon i { font-size: 13.75rem; color: #fff; margin-bottom: 3.125rem; display: block; }
          .subscribe-full .subscribe-right { width: 50%; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: 5rem 0; }
          .subscribe-full .subscribe-right .sub-form-header, .subscribe-full .subscribe-right .sub-form-wrap { max-width: 600px; width: 100%; padding: 0 15px 0 30px; }
          @media (max-width: 767px) {
            .subscribe-full .subscribe-left, .subscribe-full .subscribe-right { width: 100%; padding: 3.125rem 0 1.875rem; }
            .subscribe-full .subscribe-left .sub-content { max-width: 100%; padding: 0 15px; }
            .subscribe-full .subscribe-right .sub-form-header, .subscribe-full .subscribe-right .sub-form-wrap { padding: 0 15px; }
          }

          /* Native contact form styles */
          .cs-form { width: 100%; }
          .cs-form-row { display: flex; gap: 10px; margin-bottom: 0; }
          .cs-form input[type="text"], .cs-form input[type="email"], .cs-form input[type="tel"],
          .cs-form textarea, .cs-form select {
            margin: 0 0 0.5rem; width: 100%; padding: 13px; box-sizing: border-box;
            font-family: 'Poppins', sans-serif; font-size: 1rem; border: 1px solid #d6d5d5;
            border-radius: 0; appearance: none; -webkit-appearance: none;
            transition: all 0.2s linear; background-color: #fff; outline: none; color: #292935;
          }
          .cs-form select {
            color: #a1a1a1; -moz-appearance: none;
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%23292935' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
            background-repeat: no-repeat; background-position: right 12px center; background-size: 22px;
            padding-right: 50px; cursor: pointer; height: 50px;
          }
          .cs-form select option:not([value=""]) { color: #292935; }
          .cs-form textarea { resize: vertical; min-height: 80px; }
          .cs-form input:focus, .cs-form select:focus, .cs-form textarea:focus {
            border-color: #4044e6; box-shadow: 0px 4px 5.82px 0.18px rgba(35,31,32,0.13);
          }
          .cs-form-consent { font-size: 0.625rem; text-align: left; margin-bottom: 0.625rem; color: #a1a1a1; line-height: 1.5; }
          .cs-form-consent p { margin: 0.5rem 0; }
          .cs-form-consent label { display: flex; gap: 10px; align-items: flex-start; cursor: pointer; font-size: 0.625rem; color: #a1a1a1; }
          .cs-form-consent label input[type="checkbox"] {
            flex-shrink: 0; width: 16px; height: 16px; margin-top: 2px;
            accent-color: #ed145b; cursor: pointer;
          }
          .cs-form-consent a { color: #ed145b; text-decoration: underline; }
          .cs-form-actions { margin-top: 1rem; }
          .cs-form-actions button {
            -webkit-appearance: none; box-sizing: border-box; display: inline-block;
            min-width: 150px; font-family: 'Poppins', sans-serif; font-size: 1rem; font-weight: 600;
            text-align: center; text-transform: uppercase; padding: 0.625rem 1.25rem;
            border-radius: 3px; cursor: pointer; transition: all 0.2s linear;
            background-color: #ed145b; border: 2px solid #ed145b; color: #fff;
          }
          .cs-form-actions button:hover { background-color: #fff; color: #ed145b; }
          .cs-form-actions button:disabled { opacity: 0.6; cursor: not-allowed; }
          .hero-banner-form .cs-form-actions { text-align: center; }
          .hero-banner-form .cs-form-actions button { width: 100%; }
          .cs-form-msg { margin-top: 0.75rem; font-size: 0.875rem; text-align: center; }
          .cs-form-msg.success { color: #22c55e; }
          .cs-form-msg.error { color: #eb5c5c; }

          /* Success modal */
          .cs-success-overlay {
            position: fixed; inset: 0; z-index: 9999;
            background: rgba(0,0,0,0.5); backdrop-filter: blur(4px);
            display: flex; align-items: center; justify-content: center;
            opacity: 0; visibility: hidden;
            transition: opacity 0.3s, visibility 0.3s;
          }
          .cs-success-overlay.active { opacity: 1; visibility: visible; }
          .cs-success-modal {
            background: #fff; border-radius: 16px; padding: 48px 40px;
            max-width: 460px; width: 90%; text-align: center;
            box-shadow: 0 25px 60px rgba(0,0,0,0.15);
            transform: translateY(20px) scale(0.95);
            transition: transform 0.35s cubic-bezier(0.16,1,0.3,1);
            position: relative;
          }
          .cs-success-overlay.active .cs-success-modal {
            transform: translateY(0) scale(1);
          }
          .cs-success-icon {
            width: 72px; height: 72px; border-radius: 50%;
            background: linear-gradient(135deg, #ed145b, #ff4081);
            display: flex; align-items: center; justify-content: center;
            margin: 0 auto 24px;
          }
          .cs-success-icon svg { width: 36px; height: 36px; }
          .cs-success-modal h3 {
            font-family: 'Poppins', sans-serif; font-size: 1.5rem;
            font-weight: 700; color: #292935; margin: 0 0 12px;
          }
          .cs-success-modal p {
            font-family: 'Poppins', sans-serif; font-size: 0.95rem;
            color: #666; line-height: 1.6; margin: 0 0 8px;
          }
          .cs-success-modal .cs-modal-highlight {
            font-weight: 600; color: #292935;
          }
          .cs-success-modal .cs-modal-close {
            display: inline-block; margin-top: 24px; padding: 12px 36px;
            background: linear-gradient(135deg, #ed145b, #ff4081);
            color: #fff; border: none; border-radius: 8px; cursor: pointer;
            font-family: 'Poppins', sans-serif; font-size: 0.95rem; font-weight: 600;
            transition: transform 0.2s, box-shadow 0.2s;
          }
          .cs-success-modal .cs-modal-close:hover {
            transform: translateY(-2px);
            box-shadow: 0 6px 20px rgba(237,20,91,0.35);
          }

          @media (max-width: 600px) {
            .cs-form-row { flex-direction: column; gap: 0; }
            .cs-success-modal { padding: 36px 24px; }
            .cs-success-modal h3 { font-size: 1.25rem; }
          }

          /* Base icon-text block */
          .me-icon-text { display: flex; flex-wrap: nowrap; }
          .me-icon-text__icon { width: 75px; line-height: 1; margin: 0.625rem 0; }
          .me-icon-text__content { width: calc(100% - 75px); }
          .me-icon-text__content h4 { margin: 0.625rem 0; }
          .me-icon-text__content p { margin: 0.625rem 0; }

          /* Icon text wrapper (3-col grid for icon-text items) */
          .me-icon-text-wrapper { display: flex; flex-wrap: wrap; justify-content: center; }
          .me-icon-text-wrapper > div { width: 33.33%; padding: 0 5px; }
          .me-icon-text-wrapper .me-icon-text { margin-top: 0; }
          @media (max-width: 991px) { .me-icon-text-wrapper > div { width: 50%; } }
          @media (max-width: 767px) { .me-icon-text-wrapper > div { width: 100%; padding: 0; } .me-icon-text-wrapper .me-icon-text { margin-top: 0.625rem; margin-bottom: 0.625rem; } }
          .me-icon-text--v-space-normal { margin-bottom: 0.625rem; }
          .me-icon-text--v-space-none { margin-top: 0; }
          .me-icon-text--align-center { align-items: center; }
          .me-icon-text__content h3 { margin: 0.625rem 0; }

          /* Background image section with mask overlay */
          .bg-image-section { position: relative; background-size: cover; background-repeat: no-repeat; background-position: center; }
          .bg-image-section__mask { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; }
          .bg-image-section__inner { position: relative; z-index: 1; }

          /* Icon text blocks (v3 = 4-column) */
          .icon-text-grid { display: flex; flex-wrap: wrap; justify-content: center; }
          .icon-text-grid .icon-text-item { width: 25%; padding: 0 5px; }
          .icon-text-item .me-icon-text { margin-top: 0; }
          @media (max-width: 991px) { .icon-text-grid .icon-text-item { width: 50%; } }
          @media (max-width: 767px) { .icon-text-grid .icon-text-item { width: 100%; padding: 0; } }

          /* Numbered steps */
          .number-text-grid { display: flex; flex-wrap: wrap; justify-content: center; }
          .number-text-grid .number-text-item { width: 50%; padding: 0 5px; }
          .cs18-number-text { display: flex; flex-wrap: nowrap; margin-top: 0.625rem; }
          .cs18-number-text__number { width: 50px; line-height: 1.3; margin: 0.625rem 0; font-size: 1.875rem; color: #ed145b; }
          .cs18-number-text__content { width: calc(100% - 50px); padding-right: 10px; }
          .cs18-number-text__content h4 { margin: 0.625rem 0; }
          .cs18-number-text__content p { margin: 0.625rem 0; }
          @media (max-width: 767px) { .number-text-grid .number-text-item { width: 100%; padding: 0; } }

          /* Text with background icon */
          .text-bg-icon { padding-top: 20px; position: relative; }
          .text-bg-icon i.bg-icon { display: block; position: absolute; font-size: 230px; top: 50%; transform: translateY(-50%); right: 0; z-index: 0; color: #2d2d2d; opacity: 0.02; }
          .text-bg-icon .text-bg-icon__content { position: relative; z-index: 1; }

          /* Image+text section (me-text-image-section) */
          .img-text-section { display: flex; flex-wrap: nowrap; width: 100%; }
          .img-text-section__bg { position: relative; background-size: cover; background-repeat: no-repeat; background-position: center; width: 50%; min-height: 360px; }
          .img-text-section__bg img { width: 100%; display: none; }
          .img-text-section__content { padding: 3.75rem 30px 2.5rem; width: 50%; min-width: 540px; }
          .img-text-section__content .text-wrap { max-width: 1040px; width: 100%; display: flex; align-items: center; flex-wrap: wrap; height: 100%; }
          .img-text-section__content .text-wrap > div { width: 100%; }
          .img-text-section--left .img-text-section__bg { order: 1; }
          .img-text-section--left .img-text-section__content { order: 2; }
          .img-text-section--left .img-text-section__content .text-wrap { float: left; }
          .img-text-section__icons { padding-top: 1.25rem; display: flex; flex-wrap: wrap; justify-content: space-between; }
          .img-text-section__icons-item { display: flex; margin-bottom: 1.25rem; width: 100%; max-width: 48%; }
          .img-text-section__icon { width: 75px; line-height: 1; }
          .img-text-section__icon i { font-size: 60px; }
          .img-text-section__icon-text { width: calc(100% - 75px); }
          .img-text-section__icon-text h4 { margin-bottom: 0.625rem; }
          .img-text-section__icon-text p { margin-bottom: 0.3125rem; }
          @media (max-width: 767px) {
            .img-text-section { flex-wrap: wrap; }
            .img-text-section__bg { background-size: 0; width: 100% !important; min-height: 0 !important; }
            .img-text-section__bg img { display: block; min-height: 0 !important; }
            .img-text-section__content { padding: 2.5rem 15px 1.25rem; width: 100% !important; min-width: 0; }
            .img-text-section__content .text-wrap { float: none; max-width: none !important; }
            .img-text-section__icons-item { max-width: 100%; }
          }

          /* Quick subscribe / contact form section */
          .quick-subscribe { overflow: hidden; position: relative; min-height: 710px; padding-bottom: 30px;
            background: linear-gradient(to bottom, #fff 0%, #fff 20%, #4044e6 20%, #4044e6 100%); }
          .quick-subscribe::after { content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin-top: 20%; background-color: rgba(0,0,0,0.35); }
          .quick-subscribe .qs-container { position: relative; z-index: 10; }
          .quick-subscribe .qs-row { display: flex; flex-wrap: wrap; }
          .quick-subscribe .qs-col-text { width: 50%; padding: 0 15px; }
          .quick-subscribe .qs-col-form { width: 50%; padding: 0 7.5px; }
          .quick-subscribe .qs-text { margin-top: 190px; }
          .quick-subscribe .qs-text h2, .quick-subscribe .qs-text h3, .quick-subscribe .qs-text p { color: #fff; }
          .quick-subscribe .qs-form { border-radius: 3px; width: 100%; background-color: #fff; padding: 1.875rem 50px 1.25rem;
            margin-top: 30px; box-shadow: 0px 10px 30px 0px rgba(41,41,53,0.3); }
          .quick-subscribe .qs-form h3 { text-align: center; margin: 0; }
          .quick-subscribe .qs-form p { text-align: center; margin: 11px 0 27px; }
          .quick-subscribe .trapeze1 { width: 0; height: 710px; border-top: 206px solid transparent; border-bottom: 206px solid transparent;
            border-left: 2000px solid #4044e6; float: left; position: absolute; left: 0; top: 0; z-index: 1; }
          .quick-subscribe .trapeze2 { width: 0; height: 710px; border-top: 255px solid transparent; border-bottom: 255px solid transparent;
            border-right: 1000px solid #4044e6; float: right; position: absolute; right: 0; top: 0; z-index: 1; }
          @media (max-width: 767px) {
            .quick-subscribe .qs-text { margin-top: 70px; }
            .quick-subscribe .qs-col-text, .quick-subscribe .qs-col-form { width: 100%; }
            .quick-subscribe .qs-form { padding: 1.875rem 15px 1.25rem; }
          }

          /* Section spacing utilities */
          .section-mt { margin-top: 6.25rem; }
          .section-mb { margin-bottom: 2.5rem; }
          .section-pt-half { padding-top: 3.125rem; }
          .section-pb { padding-bottom: 2.5rem; }
          @media (max-width: 767px) {
            .section-mt { margin-top: 3.125rem; }
            .section-mb { margin-bottom: 1.25rem; }
            .section-pt-half { padding-top: 1.5625rem; }
            .section-pb { padding-bottom: 1.25rem; }
          }

          /* Background/text color utilities */
          .bg-first { background-color: #ed145b; }
          .bg-second { background-color: #4044e6; }
          .bg-dark { background-color: #2d2d2d; }
          .bg-first h1,.bg-first h2,.bg-first h3,.bg-first h4,.bg-first h5,.bg-first h6,.bg-first p,.bg-first li,.bg-first i { color: #fff; }
          .bg-second h1,.bg-second h2,.bg-second h3,.bg-second h4,.bg-second h5,.bg-second h6,.bg-second p,.bg-second li,.bg-second i { color: #fff; }
          .bg-dark h1,.bg-dark h2,.bg-dark h3,.bg-dark h4,.bg-dark h5,.bg-dark h6,.bg-dark p,.bg-dark li,.bg-dark i { color: #fff; }
          .text-first { color: #ed145b; }
          .text-first i { color: #ed145b; }

          /* Process steps (3-step horizontal) */
          .process { display: flex; position: relative; justify-content: center; }
          .process__line { background-image: url(https://assets-proj-bae1b783.spikewebsite.com/assets/92987948545d.png); width: 73%; height: 1px; position: absolute; top: 65px; z-index: 0; margin: auto; right: 0; left: 0; }
          .process__box { margin: 0.9375rem 15px; width: 100%; }
          .process__icon { text-align: center; font-size: 6.25rem; line-height: 1; margin-bottom: 1.875rem; }
          .process__icon i { background-color: #fff; color: #ed145b; }
          .process__text { padding-left: 55px; }
          .process__text h3 { margin-left: -20px; margin-bottom: 0.625rem; color: #ed145b; }
          @media (max-width: 767px) {
            .process { flex-wrap: wrap; }
            .process__line { display: none; }
            .process__icon { margin-bottom: 0.9375rem; }
            .process__text { padding-left: 0; }
          }

          /* Counter section (skills with left image) - scoped to avoid overriding homepage stats counter */
          .counter-section:has(.counter-section__bg) { display: flex; gap: 0; justify-content: flex-start; padding: 0; flex-wrap: nowrap; }
          .counter-section__bg { width: calc(100% - 975px); max-width: 40%; background-size: cover; background-position: center; background-repeat: no-repeat; }
          .counter-section__content { width: 1000px; padding: 6.5625rem 15px 4.0625rem 40px; }
          .counter-section__boxes { display: flex; margin-top: 3.125rem; }
          .counter-section__box { max-width: 320px; width: 100%; display: flex; align-items: center; margin-bottom: 2.5rem; margin-right: 30px; border-right: 1px solid #fff; }
          .counter-section__box:last-of-type { border-right: none; }
          .counter-section__box-icon { margin-right: 20px; }
          .counter-section__box-icon i { color: #fff; font-size: 3.75rem; }
          .counter-section__box-text p { font-size: 1.125rem; margin-bottom: 0; font-weight: 400; color: #fff; }
          .counter-section__box-text span { font-size: 2.375rem; font-weight: 700; color: #fff; }
          @media (max-width: 1024px) {
            .counter-section__bg { display: none; }
            .counter-section__content { width: 100%; max-width: 1024px; padding: 6.5625rem 15px 4.0625rem 15px; min-width: 0; }
            .counter-section__box { margin-right: 0; border-right: none; }
          }
          @media (max-width: 767px) { .counter-section__boxes { display: block; } .counter-section__box-icon i { font-size: 3.125rem; } }

          /* Icon list company (vertical icon+text, centered) */
          .icon-list-v3 { display: flex; flex-wrap: wrap; justify-content: center; }
          .icon-list-v3__item { width: 33.33%; text-align: center; padding: 0.9375rem 50px; }
          .icon-list-v3__icon { margin: 0 auto 25px; }
          .icon-list-v3__icon i { font-size: 70px; }
          @media (max-width: 991px) { .icon-list-v3__item { padding: 0.9375rem 15px; } }
          @media (max-width: 767px) { .icon-list-v3__item { width: 50%; } }
          @media (max-width: 550px) { .icon-list-v3__item { width: 100%; } }

          /* Icon text 2-column grid */
          .icon-text-grid-2col { display: flex; flex-wrap: wrap; justify-content: center; }
          .icon-text-grid-2col .icon-text-item { width: 50%; padding: 0 5px; }
          @media (max-width: 767px) { .icon-text-grid-2col .icon-text-item { width: 100%; padding: 0; } }

          /* Double background image decoration */
          .double-bg-image { position: relative; text-align: center; background-repeat: no-repeat, no-repeat; background-position: 5% -15%, 95% 70%; float: left; width: 100%; }
          .double-bg-image-wrap { overflow: hidden; }

          /* Hero banner landing with bg image */
          .hero-banner-landing--bg { min-height: 695px; position: relative; background-size: cover; background-position: center; background-repeat: no-repeat; display: flex; align-items: center; padding: 3.125rem 0; }
          .hero-banner-landing--bg .opacity-bg { position: absolute; width: 100%; height: 100%; top: 0; left: 0; }
          .hero-banner-landing--bg .hbl-inner { position: relative; display: flex; flex-wrap: nowrap; width: 100%; }
          .hero-banner-landing--bg .hero-banner-wrap { z-index: 1; text-align: left; flex-grow: 1.2; max-width: 570px; margin-right: 20px; }
          .hero-banner-landing--bg .hero-banner-wrap h1,.hero-banner-landing--bg .hero-banner-wrap h2,.hero-banner-landing--bg .hero-banner-wrap h3,.hero-banner-landing--bg .hero-banner-wrap p { color: #fff; }
          .hero-banner-landing--bg .hero-banner-wrap .socials a { position: relative; display: inline-block; width: 40px; height: 40px; margin-right: 20px; margin-bottom: 1.25rem; text-align: center; font-size: 25px; border: 2px solid #fff; border-radius: 5px; background-color: #ed145b; transition: all 0.2s linear; color: #fff; line-height: 36px; }
          .hero-banner-landing--bg .hero-banner-wrap .socials a:hover { background-color: #4044e6; }
          .hero-banner-landing--bg .form-placeholder { margin-left: auto; flex-grow: 0.8; max-width: 430px; }
          .hero-banner-landing--bg .hero-banner-form { z-index: 1; border-radius: 3px; box-shadow: 0px 10px 30px 0px rgba(41,41,53,0.3); background-color: rgba(255,255,255,0.8); padding: 1.875rem 30px 0.625rem; }
          .hero-banner-landing--bg .banner-form-title { text-align: center; }
          .hero-banner-landing--bg .hs_submit { text-align: center; }
          .hero-banner-landing--bg .hs_submit input { width: 100%; }
          @media (max-width: 767px) {
            .hero-banner-landing--bg .hbl-inner { flex-wrap: wrap; }
            .hero-banner-landing--bg .hero-banner-wrap { max-width: 100%; }
            .hero-banner-landing--bg .form-placeholder { margin-right: auto; }
          }

          /* Image shadow effect */
          .img-shadow-pink img { border-radius: 4px; box-shadow: 30px 30px 0 #ed145b; }

          /* Background image section */
          .bg-image-section { background-size: cover; background-position: top center; background-repeat: no-repeat; }

          /* Background image with mask overlay (original template pattern) */
          .background-image { position: relative; background-size: cover; background-position: center; background-repeat: no-repeat; }
          .background-image__mask { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0.7; z-index: 0; }
          .background-image__mask + .span12,
          .background-image .section-padding-top { position: relative; z-index: 1; }

          /* Template color utilities */
          .background-color--first-color { background-color: #ed145b; }
          .background-color--second-color { background-color: #4044e6; }
          .background-color--dark-color { background-color: #2d2d2d; }
          .background-color--gradient { background: linear-gradient(57deg, #4044e6 20%, #ed145b 80%); }
          .text-color--first-color { color: #ed145b; }
          .text-color--white, .text-color--white h1, .text-color--white h2, .text-color--white h3, .text-color--white h4, .text-color--white h5, .text-color--white h6, .text-color--white p, .text-color--white li, .text-color--white span { color: #fff; }

          /* Background color text inheritance */
          .background-color--first-color, .background-color--second-color, .background-color--dark-color, .background-color--gradient { color: #fff; }
          .background-color--first-color h1, .background-color--first-color h2, .background-color--first-color h3, .background-color--first-color h4, .background-color--first-color h5, .background-color--first-color h6,
          .background-color--second-color h1, .background-color--second-color h2, .background-color--second-color h3, .background-color--second-color h4, .background-color--second-color h5, .background-color--second-color h6,
          .background-color--dark-color h1, .background-color--dark-color h2, .background-color--dark-color h3, .background-color--dark-color h4, .background-color--dark-color h5, .background-color--dark-color h6,
          .background-color--gradient h1, .background-color--gradient h2, .background-color--gradient h3, .background-color--gradient h4, .background-color--gradient h5, .background-color--gradient h6 { color: #fff; }
          .background-color--first-color p, .background-color--second-color p, .background-color--dark-color p, .background-color--gradient p { color: rgba(255,255,255,0.85); }
          .background-color--first-color blockquote:before, .background-color--second-color blockquote:before, .background-color--dark-color blockquote:before, .background-color--gradient blockquote:before { color: #fff; }

          /* Blockquote decorative styling */
          blockquote { display: inline-block; font-style: italic; position: relative; padding-top: 0.9375rem; margin: 2.5rem 1.875rem; }
          blockquote h1, blockquote h2, blockquote h3, blockquote h4, blockquote h5, blockquote h6 { margin-bottom: 0; }
          blockquote * { position: relative; }
          blockquote:before { font-family: "Font Awesome 5 Free"; position: absolute; width: 60px; display: block; content: "\f10e"; top: -0.9375rem; left: -1.875rem; font-size: 6.25rem; line-height: 1; font-weight: bold; font-style: normal; opacity: 0.2; }

          /* me-single-person-row component */
          .me-single-person-row-wrapper { display: flex; flex-wrap: wrap; }
          .me-single-person-row-wrapper > div { width: 100%; max-width: 50%; }
          @media (max-width: 767px) { .me-single-person-row-wrapper > div { max-width: 100%; } }
          .me-single-person-row { display: flex; flex-wrap: wrap; min-height: 615px; }
          .me-single-person-row > div { width: 50%; }
          @media (max-width: 1024px) { .me-single-person-row > div { width: 100%; } }
          .me-single-person-row__avatar { background-size: cover; background-position: center center; background-repeat: no-repeat; }
          @media (max-width: 1024px) { .me-single-person-row__avatar { height: 350px; } }
          .me-single-person-row__description-wrapper { display: flex; flex-direction: column; justify-content: center; flex-wrap: wrap; padding: 3.125rem 40px; }
          .me-single-person-row__content { margin-bottom: 0.625rem; max-width: 545px; }
          .me-single-person-row__social { display: block; width: 100%; }
          .me-single-person-row__social a { position: relative; display: inline-block; width: 40px; height: 40px; margin-right: 20px; margin-bottom: 1.25rem; text-align: center; font-size: 25px; border: 2px solid #fff; border-radius: 5px; background-color: #ed145b; transition: all .2s linear; color: #fff; }
          .me-single-person-row__social a:hover { background-color: #4044e6; }
          .me-single-person-row__social a i { position: absolute; top: 50%; left: 0; right: 0; width: 100%; transform: translateY(-50%); }
          .me-single-person-row.reverse .me-single-person-row__avatar { order: 2; }
          @media (max-width: 1024px) { .me-single-person-row.reverse .me-single-person-row__avatar { order: 0; } }
          .me-single-person-row.reverse .me-single-person-row__description-wrapper { justify-content: flex-end; }
          @media (max-width: 1024px) { .me-single-person-row.reverse .me-single-person-row__description-wrapper { justify-content: flex-start; } }
          .me-single-person-row.reverse .me-single-person-row__content { margin-left: 0; margin-right: 50px; }
          @media (max-width: 1024px) { .me-single-person-row.reverse .me-single-person-row__content { margin-right: 0; } }
          .me-single-person-row.reverse .me-single-person-row__social { margin-left: 0; }

          /* customer-services-worker */
          .customer-services-worker { margin-bottom: 3.125rem; width: 100%; display: flex; }
          @media (max-width: 767px) { .customer-services-worker { margin-top: 1.875rem; } }
          @media (max-width: 576px) { .customer-services-worker { flex-wrap: wrap; } }
          .customer-services-worker .avatar { min-width: 120px; width: 120px; height: 120px; margin-right: 25px; border-radius: 50%; background-size: cover; background-position: center; background-repeat: no-repeat; }
          @media (max-width: 576px) { .customer-services-worker .content { width: 100%; } }
          .customer-services-worker .content h3, .customer-services-worker .content h4, .customer-services-worker .content h5 { margin-top: 0; margin-bottom: 0.75rem; }
          .customer-services-worker .content p { margin-bottom: 0.3125rem; }

          /* me-contact-map */
          .me-contact-map { width: 100%; }
          .me-contact-map iframe { width: 100%; height: 500px; border: 0; display: block; }

          /* quick-subscribe dark variant */
          .quick-subscribe--dark-color { background: linear-gradient(to bottom, white 0%, white 20%, #2d2d2d 20%, #2d2d2d 100%) !important; }
          .quick-subscribe--dark-color .trapeze1 { border-left-color: #2d2d2d !important; }
          .quick-subscribe--dark-color .trapeze2 { border-right-color: #2d2d2d !important; }

          /* va-text-background CTA section (exact original CSS) */
          .va-text-background { position: relative; width: 100%; background-repeat: no-repeat; background-position: center; background-size: cover; }
          .va-text-background--flex { display: flex; align-items: center; justify-content: center; }
          .va-text-background__background-text-wrapper { position: absolute; top: 0; left: 0; width: 100%; height: 100%; max-width: 100%; overflow: hidden; z-index: 1; }
          .va-text-background__background-text { margin-left: 10%; width: 100%; height: 100%; opacity: 0.2; font-size: 310px; line-height: 1; font-weight: 600; letter-spacing: -0.04em; color: #292935; text-transform: uppercase; white-space: nowrap; display: flex; align-items: center; }
          .va-text-background__image-wrapper { align-self: flex-end; position: relative; padding: 4.375rem 15px 0; width: 50%; z-index: 2; }
          .va-text-background__image-wrapper img { max-width: 100%; height: auto; filter: drop-shadow(0 0 10px rgba(0,0,0,0.6)); }
          .va-text-background__image-wrapper--left { align-self: center; padding: 0 50px 0 0; overflow: hidden; width: 44%; }
          .va-text-background__image-wrapper--left img { max-width: none; float: right; }
          .va-text-background__rich-text-wrapper { position: relative; width: 62%; z-index: 2; }
          .va-text-background__rich-text { padding: 4.375rem 15px; max-width: 700px; float: right; color: #fff; }
          .va-text-background__rich-text h1, .va-text-background__rich-text h2, .va-text-background__rich-text h3, .va-text-background__rich-text h4, .va-text-background__rich-text p, .va-text-background__rich-text span, .va-text-background__rich-text li { color: inherit; text-transform: none; }
          .va-text-background__rich-text-wrapper--right { width: 56%; }
          .va-text-background__rich-text-wrapper--right .va-text-background__rich-text { float: left; max-width: 545px; padding: 0.9375rem; }
          .va-text-background__rich-text-wrapper--right .va-text-background__rich-text > h2 { margin-top: 0; }
          a.cta-quaternary-mix { display: inline-block; min-width: 150px; font-family: 'Poppins', sans-serif; font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; padding: 14px 35px; text-decoration: none; text-align: center; border-radius: 30px; transition: all 0.3s ease; background-color: #fff; border: 2px solid #4044e6; color: #ed145b; }
          a.cta-quaternary-mix:hover { background-color: #4044e6; border: 2px solid #4044e6; color: #fff; }
          @media (max-width: 991px) {
            .va-text-background--flex { display: block; }
            .va-text-background__rich-text-wrapper { width: 100%; }
            .va-text-background__rich-text { max-width: none; }
            .va-text-background__rich-text-wrapper--right .va-text-background__rich-text { max-width: none; padding: 2.8125rem 15px; }
            .va-text-background__image-wrapper { display: none; }
          }
          @media (max-width: 480px) {
            .va-text-background__background-text { margin-left: -150px !important; }
          }

          /* va-multibox bento grid (exact original CSS) */
          .va-multibox { min-height: 600px; width: 100%; display: flex; justify-content: center; }
          .va-multibox .clear { clear: both; }
          .va-multibox .half-container { max-width: 585px; width: 100%; padding: 0 40px; }
          .va-multibox h3 { color: #fff; font-weight: 400; margin: 20px 0; }
          .va-multibox p { color: #fff; margin: 0; }
          .va-multibox .left { width: 50%; }
          .va-multibox .left .item-1 { width: 100%; min-height: 400px; background-size: cover; background-position: center center; }
          .va-multibox .left .item-2 { width: 100%; min-height: 200px; padding: 1.25rem 0; display: flex; justify-content: flex-end; align-items: center; }
          .va-multibox .left .item-2 .half-container { padding-left: 20px; float: right; }
          .va-multibox .left .item-2 .half-container h3 { margin: 0 0 1.25rem 0; }
          .va-multibox .right { width: 50%; display: flex; flex-wrap: wrap; }
          .va-multibox .right .item-3 { width: 100%; min-height: 200px; display: flex; justify-content: flex-start; align-items: center; }
          .va-multibox .right .item-3 .half-container { padding-right: 0; }
          .va-multibox .right .item-4 { width: 50%; min-height: 400px; text-align: left; padding: 1.25rem 40px; display: flex; flex-direction: column; justify-content: center; }
          .va-multibox .right .item-4 h4 { margin-top: 0; display: inline-block; width: 100%; }
          .va-multibox .right .item-4 p { margin: 0.625rem 0 2.5rem 0; display: inline-block; width: 100%; }
          .va-multibox .right .item-5 { width: 50%; min-height: 400px; background-size: cover; background-position: center center; }
          .va-multibox .cta-wrapper { margin-top: 1.25rem; }
          @media (max-width: 1075px) {
            .va-multibox .left .item-2 .half-container { padding-left: 15px; }
            .va-multibox .right .item-3 .half-container { padding-right: 15px; }
            .va-multibox .right .item-4 { width: 100%; }
            .va-multibox .right .item-5 { width: 100%; }
          }
          @media (max-width: 767px) {
            .va-multibox { flex-direction: column; }
            .va-multibox .half-container { max-width: 100%; flex: 1 100%; }
            .va-multibox .left { width: 100%; display: flex; flex-direction: column; }
            .va-multibox .left .item-1 { order: 2; }
            .va-multibox .left .item-2 .half-container { padding: 0 15px; }
            .va-multibox .right { width: 100%; flex-wrap: nowrap; flex-direction: column; }
            .va-multibox .right .item-3 { order: 1; flex: 1; }
            .va-multibox .right .item-3 .half-container { padding: 0 15px; }
            .va-multibox .right .item-4 { order: 3; flex: 1; }
            .va-multibox .right .item-5 { order: 2; flex: 1; }
          }

          /* va-counter stats (exact original CSS) */
          .va-counter-wrapper { display: flex; flex-wrap: wrap; justify-content: space-between; }
          .va-counter-wrapper > div { width: 100%; max-width: 25%; margin-bottom: 1.25rem; padding: 0 15px; text-align: center; }
          .va-counter-wrapper .va-counter__number { font-size: 3.5625rem; font-weight: bold; margin: 1.25rem auto; width: 100%; }
          .va-counter-wrapper .va-counter__top-label, .va-counter-wrapper .va-counter__bottom-label { margin: 1.25rem 0; }
          .va-counter-wrapper .va-counter__top-label { margin-top: 0; }
          @media (max-width: 991px) { .va-counter-wrapper > div { max-width: 50%; } }
          @media (max-width: 576px) { .va-counter-wrapper > div { max-width: 100%; } }

          /* me-icon-list-company (v3 wrapper + base) */
          .me-icon-list-company-wrapper-v3 { position: relative; display: flex; flex-wrap: wrap; justify-content: center; }
          .me-icon-list-company-wrapper-v3 > div { flex: 0 0 33.33%; max-width: 33.33%; }
          @media (max-width: 767px) { .me-icon-list-company-wrapper-v3 > div { flex: 0 0 50%; max-width: 50%; } }
          @media (max-width: 550px) { .me-icon-list-company-wrapper-v3 > div { flex: 0 0 100%; max-width: 100%; } }
          .me-icon-list-company-wrapper-v3 .me-icon-list-company { text-align: center; }
          .me-icon-list-company-wrapper-v3 .me-icon-list-company__inner { padding: 0.9375rem 50px; }
          @media (max-width: 991px) { .me-icon-list-company-wrapper-v3 .me-icon-list-company__inner { padding: 0.9375rem 15px; } }
          .me-icon-list-company-wrapper-v3 .me-icon-list-company__icon { margin-left: auto; margin-right: auto; }
          .me-icon-list-company { position: relative; width: 100%; }
          .me-icon-list-company__inner { display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; box-sizing: border-box; transition: all 0.2s linear; }
          .me-icon-list-company__icon { position: relative; margin-bottom: 25px; width: 100%; }
          .me-icon-list-company__content { width: 100%; }
          .me-icon-list-company__content h5 { margin-bottom: 0.9375rem; }

          /* me-text-image-section (half image / half content) */
          .me-text-image-section { display: flex; flex-wrap: nowrap; width: 100%; }
          .me-text-image-section__background { position: relative; background-size: cover; background-repeat: no-repeat; background-position: center; width: 50%; min-height: 360px; }
          .me-text-image-section__background img { width: 100%; display: none; }
          .me-text-image-section__content { padding: 3.75rem 30px 2.5rem; width: 50%; min-width: 540px; }
          .me-text-image-section__content .me-text-content { max-width: 1040px; width: 100%; display: flex; align-items: center; flex-wrap: wrap; height: 100%; }
          .me-text-image-section__content .me-text-content > div { width: 100%; }
          .me-text-image-section--left .me-text-image-section__background { order: 1; }
          .me-text-image-section--left .me-text-image-section__content { order: 2; }
          .me-text-image-section--left .me-text-image-section__content .me-text-content { float: left; }
          @media (max-width: 767px) {
            .me-text-image-section { flex-wrap: wrap; }
            .me-text-image-section__background { background-size: 0; width: 100% !important; min-height: 0 !important; }
            .me-text-image-section__background img { display: block; min-height: 0 !important; }
            .me-text-image-section__content { padding: 2.5rem 15px 1.25rem; width: 100% !important; min-width: 0; }
            .me-text-image-section__content .me-text-content { float: none; max-width: none !important; }
          }

          /* me-pricing-box-1 (pricing cards) */
          .me-pricing-box-1-wrapper { display: flex; position: relative; flex-direction: row; justify-content: center; flex-wrap: wrap; width: 100%; }
          .me-pricing-box-1-wrapper > div { position: relative; flex: 0 0 25%; max-width: 25%; }
          .me-pricing-box-1-wrapper > div .me-pricing-box-1:not(.me-pricing-box-1--awarded):after { content: ""; position: absolute; left: 100%; top: 10px; width: 1px; height: calc(100% - 20px); background-color: #a1a1a1; opacity: 0.5; }
          .me-pricing-box-1-wrapper > div:last-of-type .me-pricing-box-1:after,
          .me-pricing-box-1-wrapper > div:nth-of-type(4n) .me-pricing-box-1:after { display: none; }
          @media (max-width: 1024px) { .me-pricing-box-1-wrapper > div { flex: 0 0 50%; max-width: 50%; } .me-pricing-box-1-wrapper > div:nth-of-type(n) .me-pricing-box-1:after { display: none; } }
          @media (max-width: 767px) { .me-pricing-box-1-wrapper > div { flex: 0 0 100%; max-width: 400px; } }
          .me-pricing-box-1 { display: block; position: relative; width: 100%; padding: 2.8125rem 35px 2.1875rem; border-radius: 10px; text-align: center; }
          .me-pricing-box-1 h5 { font-size: 1.125rem; }
          .me-pricing-box-1 h5 span { display: block; }
          .me-pricing-box-1 .me-cost-oval { display: inline-block; font-weight: bold; padding: 10px 0; }
          .me-pricing-box-1 .me-cost-oval--me-payment, .me-pricing-box-1 .me-cost-oval--me-small { font-size: 1.875rem; }
          .me-pricing-box-1 .me-cost-oval--me-small { vertical-align: top; }
          .me-pricing-box-1 .me-cost-oval--me-price { font-size: 4rem; }
          .me-pricing-box-1 .me-cost-oval--me-mo { font-size: 0.9375rem; margin-left: -35px; font-weight: 600; text-transform: uppercase; }
          .me-pricing-box-1 ul.me-option { padding-bottom: 1.875rem; padding-left: 0; margin-left: 0; list-style: none; }
          .me-pricing-box-1 ul.me-option li.me-item { padding: 10px 0; padding-left: 0; position: relative; margin-top: 0; margin-bottom: 0; }
          .me-pricing-box-1 ul.me-option li.me-item::before { content: none; display: none; }
          .me-pricing-box-1 ul.me-option li.me-item.me-empty { display: block; position: relative; max-width: 100%; padding: 22px 0; }
          .me-pricing-box-1 ul.me-option li.me-item.me-empty:after { content: ''; position: absolute; top: 50%; left: 50%; width: 10px; height: 10px; border-radius: 50%; background-color: #ed145b; transform: translate(-50%, -50%); opacity: 0.5; }
          .me-pricing-box-1 .hs-cta-wrapper .cta_button { -webkit-appearance: none; text-decoration: none; box-sizing: border-box !important; display: inline-block; min-width: 150px; font-family: 'Poppins', sans-serif; font-size: 1rem; font-weight: 600; text-align: center; text-transform: uppercase; padding: 0.625rem 1.25rem; border-radius: 3px; margin-bottom: 1.25rem; cursor: pointer; transition: all 0.2s linear; background-color: #ed145b; border: 2px solid #ed145b; color: #fff; }
          .me-pricing-box-1 .hs-cta-wrapper .cta_button:hover { background-color: #fff; border: 2px solid #ed145b; color: #ed145b; }
          .me-pricing-box-1--awarded { background-color: #ed145b; overflow: hidden; }
          .me-pricing-box-1--awarded h5 { font-weight: 700; }
          .me-pricing-box-1--awarded img { display: block; max-width: 200px; position: absolute; top: -10px; left: 0; }
          .me-pricing-box-1--awarded ul.me-option li.me-item.me-empty:after { background-color: #fff; }
          .me-pricing-box-1--awarded .hs-cta-wrapper .cta_button { background-color: #fff; border: 2px solid #4044e6; color: #ed145b; }
          .me-pricing-box-1--awarded .hs-cta-wrapper .cta_button:hover { background-color: #4044e6; border: 2px solid #4044e6; color: #fff; }

          /* me-text-subscribe-full-size (contact form full-width) */
          .me-text-subscribe-full-size { position: relative; display: flex; flex-wrap: wrap; justify-content: center; width: 100%; height: auto; }
          .me-text-subscribe-full-size__mask { position: absolute; width: 100%; height: 100%; top: 0; left: 0; }
          .me-text-subscribe-full-size__content, .me-text-subscribe-full-size__form { display: block; width: 50%; padding: 5rem 0; }
          @media (max-width: 767px) { .me-text-subscribe-full-size__content, .me-text-subscribe-full-size__form { width: 100%; padding: 3.125rem 0 1.875rem; } }
          .me-text-subscribe-full-size__content { position: relative; display: flex; justify-content: flex-end; align-items: center; background-size: cover; background-position: center; background-repeat: no-repeat; }
          .me-text-subscribe-full-size__content-wrapper { position: relative; display: block; max-width: 600px; padding-left: 15px; padding-right: 30px; }
          @media (max-width: 767px) { .me-text-subscribe-full-size__content-wrapper { max-width: 100%; padding-right: 15px; } }
          .me-text-subscribe-full-size__icon { margin-bottom: 3.125rem; }
          .me-text-subscribe-full-size__form { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
          .me-text-subscribe-full-size__header-form, .me-text-subscribe-full-size__wrapper-form { position: relative; display: block; max-width: 600px; width: 100%; padding-left: 30px; padding-right: 15px; }
          @media (max-width: 767px) { .me-text-subscribe-full-size__header-form, .me-text-subscribe-full-size__wrapper-form { padding-left: 15px; text-align: center; margin: 0 auto; } }

          /* section-padding-top/bottom half variants */
          .section-padding-top--half { padding-top: 3.125rem; }
          .section-padding-bottom--half { padding-bottom: 1.875rem; }
          @media (max-width: 767px) { .section-padding-top--half { padding-top: 1.5625rem; } .section-padding-bottom--half { padding-bottom: 0.9375rem; } }

          /* me-mask--dark */
          .me-hero-banner .me-mask--dark { background: #2d2d2d; }

          /* me-text-image-section--right variant */
          .me-text-image-section--right .me-text-image-section__background { order: 2; }
          .me-text-image-section--right .me-text-image-section__content { order: 1; }
          .me-text-image-section--right .me-text-image-section__content .me-text-content { float: right; }

          /* me-text-image-section content-socials */
          .me-text-image-section__content-socials a { position: relative; display: inline-block; width: 40px; height: 40px; margin-right: 20px; margin-bottom: 1.25rem; text-align: center; font-size: 25px; border: 2px solid #fff; border-radius: 5px; background-color: #ed145b; transition: all .2s linear; color: #fff; }
          .me-text-image-section__content-socials a:hover { background-color: #4044e6; }
          .me-text-image-section__content-socials a i { position: absolute; top: 50%; left: 0; right: 0; width: 100%; transform: translateY(-50%); }

          /* triangle-bottom */
          .triangle-bottom { position: relative; overflow: hidden; }
          .triangle-bottom:before { content: ""; position: absolute; bottom: 0; left: 0; width: 0; height: 0; border-style: solid; border-width: 850px 0 0 480px; border-color: transparent transparent transparent #ffc400; z-index: 1; }
          @media (max-width: 991px) { .triangle-bottom:before { display: none; } }
          .triangle-bottom--first-color:before { border-color: transparent transparent transparent #ed145b; }
          .triangle-bottom--second-color:before { border-color: transparent transparent transparent #4044e6; }

          /* cs18-mocup-text (iPhone mockup + text) */
          .cs18-mocup-text { display: flex; }
          @media (max-width: 991px) { .cs18-mocup-text { flex-wrap: wrap; } }
          .cs18-mocup-text .iphone-mocup { width: 100%; max-width: 40%; position: relative; min-width: 480px; }
          @media (max-width: 991px) { .cs18-mocup-text .iphone-mocup { order: 2; } }
          @media (max-width: 576px) { .cs18-mocup-text .iphone-mocup { display: none; } }
          .cs18-mocup-text .iphone-mocup__phone { max-width: 100%; height: auto; }
          .cs18-mocup-text .iphone-mocup__screen { position: absolute; overflow: hidden; top: 73px; left: 186px; width: 180px; height: 320px; }
          .cs18-mocup-text__content { position: relative; max-width: 60%; width: calc(100% - 480px); align-self: center; padding-left: 100px; }
          @media (max-width: 1200px) { .cs18-mocup-text__content { padding-left: 15px; } }
          @media (max-width: 991px) { .cs18-mocup-text__content { padding-left: 0; order: 1; width: 100%; max-width: 100%; margin-bottom: 1.875rem; } }

          /* me-cta-bar */
          .me-cta-bar { display: block; width: 100%; padding-top: 1.5625rem; }
          .me-cta-bar > div { display: flex; justify-content: center; align-items: center; flex-wrap: nowrap; }
          @media (max-width: 767px) { .me-cta-bar > div { flex-wrap: wrap; } }
          @media (max-width: 767px) { .me-cta-bar__content, .me-cta-bar__button { width: 100%; } }
          .me-cta-bar__content { width: 100%; max-width: 60%; }
          .me-cta-bar__content--center { text-align: center; }
          @media (max-width: 767px) { .me-cta-bar__content { max-width: 100%; margin-left: auto; margin-right: auto; text-align: center; } }
          .me-cta-bar__button { width: 100%; max-width: 40%; }
          .me-cta-bar__button--center { text-align: center; }
          @media (max-width: 767px) { .me-cta-bar__button { margin-bottom: 1.875rem; max-width: 100%; margin-left: auto; margin-right: auto; text-align: center; } }

          /* me-timeline-item-wrapper */
          .me-timeline-item-wrapper > span { display: flex; flex-wrap: wrap; position: relative; z-index: 0; }
          .me-timeline-item-wrapper > span > div { position: relative; width: 100%; z-index: 5; }
          .me-timeline-item-wrapper > span > div:last-of-type { z-index: 4; }
          .me-timeline-item-wrapper > span .progress-bar { position: absolute; left: calc(50% + 1px); top: 0; width: 2px; height: 0px; background-color: #ed145b; z-index: 1; }
          @media (max-width: 1180px) { .me-timeline-item-wrapper > span .progress-bar { display: none; } }
          .me-timeline-item-wrapper .dot-end { display: block; position: relative; left: calc(50% - 7px); width: 18px; height: 18px; background-color: #ed145b; border: 1px solid #ed145b; border-radius: 50%; z-index: 20; }
          @media (max-width: 1180px) { .me-timeline-item-wrapper .dot-end { display: none; } }
          .me-timeline-item-wrapper .me-timeline-item { position: relative; width: 100%; max-width: 495px; }
          @media (max-width: 1180px) { .me-timeline-item-wrapper .me-timeline-item { max-width: 100%; } }
          .me-timeline-item-wrapper .me-timeline-item__dot-point { display: block; position: absolute; width: 18px; height: 18px; top: 0; background-color: #ed145b; border: 1px solid #ed145b; border-radius: 50%; z-index: 20; }
          @media (max-width: 1180px) { .me-timeline-item-wrapper .me-timeline-item__dot-point { display: none; } }
          .me-timeline-item-wrapper .me-timeline-item__wrapper { margin-bottom: 50px; }
          .me-timeline-item-wrapper .me-timeline-item__text-content { margin-top: -1.25rem; margin-bottom: 1.25rem; }
          @media (max-width: 767px) { .me-timeline-item-wrapper .me-timeline-item__text-content { width: 100%; margin-bottom: 0px; } }
          @media (max-width: 767px) { .me-timeline-item-wrapper .me-timeline-item__image { min-width: 100%; margin-bottom: 1.25rem; } }
          .me-timeline-item-wrapper .me-timeline-item__image img { width: 100%; height: auto; border-radius: 4px; }
          .me-timeline-item-wrapper .me-timeline-item.left { float: left; }
          @media (max-width: 1180px) { .me-timeline-item-wrapper .me-timeline-item.left { float: none; } }
          .me-timeline-item-wrapper .me-timeline-item.left .me-timeline-item__text-content { text-align: right; }
          @media (max-width: 1180px) { .me-timeline-item-wrapper .me-timeline-item.left .me-timeline-item__text-content { text-align: left; margin-left: 25px; order: 2; } }
          @media (max-width: 767px) { .me-timeline-item-wrapper .me-timeline-item.left .me-timeline-item__text-content { margin-left: 0; } }
          .me-timeline-item-wrapper .me-timeline-item.left .me-timeline-item__dot-point { right: -101px; }
          .me-timeline-item-wrapper .me-timeline-item.right { float: right; }
          @media (max-width: 1180px) { .me-timeline-item-wrapper .me-timeline-item.right { float: none; } }
          .me-timeline-item-wrapper .me-timeline-item.right .me-timeline-item__dot-point { left: -97px; }
          .me-timeline-item-wrapper .me-timeline-item.right .me-timeline-item__text-content { text-align: left; margin-right: 25px; }
          @media (max-width: 767px) { .me-timeline-item-wrapper .me-timeline-item.right .me-timeline-item__text-content { margin-bottom: 0px; order: 2; } }

          /* me-job-contact-section */
          .me-job-contact-section { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; padding-top: 1.875rem; }
          .me-job-contact-section__image, .me-job-contact-section__content { width: 50%; }
          @media (max-width: 860px) { .me-job-contact-section__image, .me-job-contact-section__content { width: 100%; } }
          .me-job-contact-section__image { align-self: flex-end; }
          @media (max-width: 860px) { .me-job-contact-section__image { align-self: center; margin-bottom: 1.875rem; } }
          .me-job-contact-section__image img { display: block; margin: 0 auto; max-width: 100%; height: auto; }
          .me-job-contact-section__content { padding-bottom: 0.625rem; }
          @media (max-width: 860px) { .me-job-contact-section__content { text-align: center; padding-top: 1.875rem; } }
          .me-job-contact-section__content a { margin-top: 1.25rem; }
          .me-job-contact-section__content a:before { display: none; }

          /* va-partner-slider (partner logos grid) */
          .va-partner-slider { position: relative; width: 100%; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 2rem; }
          .va-partner-slider .va-partner-slide { text-align: center; flex: 0 0 calc(16.666% - 2rem); }
          @media (max-width: 991px) { .va-partner-slider .va-partner-slide { flex: 0 0 calc(33.333% - 2rem); } }
          @media (max-width: 576px) { .va-partner-slider .va-partner-slide { flex: 0 0 calc(50% - 2rem); } }
          .va-partner-slider .va-partner-slide a { text-decoration: none; }
          .va-partner-slider .va-partner-slide a img { max-width: 100%; margin: auto; opacity: .6; transition: opacity .3s linear; }
          .va-partner-slider .va-partner-slide a:hover img { opacity: 1; }

          /* Blog Post Content */
          .blog-post-content h2 { font-size: 24px; font-weight: 600; margin: 30px 0 15px; color: #2d2d2d; }
          .blog-post-content h3 { font-size: 20px; font-weight: 600; margin: 25px 0 12px; color: #2d2d2d; }
          .blog-post-content p { font-size: 15px; line-height: 1.8; color: #555; margin-bottom: 15px; }
          .blog-post-content img { max-width: 100%; height: auto; border-radius: 5px; margin: 20px 0; }
          .blog-post-content a { color: #ed145b; text-decoration: none; }
          .blog-post-content a:hover { text-decoration: underline; }
          .blog-post-content ul, .blog-post-content ol { margin: 15px 0; padding-left: 30px; }
          .blog-post-content li { font-size: 15px; line-height: 1.8; color: #555; margin-bottom: 8px; }
          .blog-post-content strong { color: #2d2d2d; }
          .blog-post-content blockquote { border-left: 4px solid #ed145b; padding: 15px 20px; margin: 20px 0; background: #f8f8f8; font-style: italic; }

          /* ==========================================
             BLOG LISTING PAGE STYLES
             ========================================== */

          .blog-hero {
            background: linear-gradient(57deg, #1a1a2e 0%, #4044e6 25%, #ed145b 50%, #4044e6 75%, #1a1a2e 100%);
            background-size: 400% 400%;
            animation: gradient-shift 15s ease infinite;
            padding: 140px 0 100px;
            text-align: center;
            position: relative;
            overflow: hidden;
          }
          @keyframes gradient-shift { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }

          .blog-hero-shapes { position: absolute; top: 0; left: 0; right: 0; bottom: 0; pointer-events: none; }
          .blog-hero-shapes .shape { position: absolute; border-radius: 50%; filter: blur(60px); }
          .blog-hero-shapes .shape-1 { width: 600px; height: 600px; background: linear-gradient(135deg, #ed145b, #c40d4a); opacity: 0.15; top: -250px; right: -150px; animation: float 8s ease-in-out infinite; }
          .blog-hero-shapes .shape-2 { width: 500px; height: 500px; background: linear-gradient(135deg, #4044e6, #6366f1); opacity: 0.12; bottom: -200px; left: -150px; animation: float 10s ease-in-out infinite reverse; }
          .blog-hero-shapes .shape-3 { width: 400px; height: 400px; background: linear-gradient(135deg, #ed145b, #4044e6); opacity: 0.1; top: 40%; left: 50%; transform: translate(-50%, -50%); animation: float 12s ease-in-out infinite; }

          .blog-hero-badge {
            display: inline-block;
            background: rgba(0,0,0,0.3);
            color: #fff;
            font-size: 13px;
            font-weight: 700;
            padding: 10px 24px;
            border-radius: 100px;
            margin-bottom: 28px;
            text-transform: uppercase;
            letter-spacing: 2px;
            border: 1px solid rgba(255,255,255,0.25);
            position: relative;
            z-index: 1;
          }

          .blog-hero h1 { font-size: 58px; font-weight: 800; color: #fff; margin-bottom: 24px; letter-spacing: -2px; position: relative; z-index: 1; }
          .blog-hero h1 span {
            background: linear-gradient(90deg, #fff, #ffd400, #fff);
            background-size: 200% auto;
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
            animation: shimmer 3s linear infinite;
          }
          @keyframes shimmer { to { background-position: 200% center; } }
          .blog-hero p { font-size: 20px; color: rgba(255,255,255,0.8); max-width: 650px; margin: 0 auto; line-height: 1.7; position: relative; z-index: 1; }

          /* Featured Section */
          .blog-featured-section { padding: 80px 0; background: linear-gradient(180deg, #2d2d2d 0%, #1f1f1f 100%); }
          .blog-featured-section .section-header { margin-bottom: 40px; }
          .blog-featured-section .section-header h2 { font-size: 32px; font-weight: 700; color: #fff; margin-bottom: 8px; }
          .blog-featured-section .section-header p { color: #a1a1a1; }

          .featured-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 24px; }
          @media (max-width: 860px) { .featured-grid { grid-template-columns: 1fr; } }

          .featured-main { position: relative; border-radius: 24px; overflow: hidden; display: block; height: 450px; text-decoration: none; }
          .featured-main .featured-image { position: absolute; inset: 0; }
          .featured-main .featured-image img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease; }
          .featured-main:hover .featured-image img { transform: scale(1.05); }
          .featured-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.3) 50%, transparent 100%); }
          .featured-main .featured-content { position: absolute; bottom: 0; left: 0; right: 0; padding: 40px; z-index: 2; }
          .featured-main .article-tag { display: inline-block; background: #ed145b; color: #fff; font-size: 11px; font-weight: 700; padding: 6px 14px; border-radius: 100px; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 16px; }
          .featured-main h3 { font-size: 32px; font-weight: 700; color: #fff; margin-bottom: 12px; line-height: 1.3; }
          .featured-main p { color: rgba(255,255,255,0.8); font-size: 16px; margin-bottom: 16px; }
          .article-meta { display: flex; gap: 16px; font-size: 13px; color: #a1a1a1; }

          .featured-side { display: flex; flex-direction: column; gap: 24px; }
          .featured-small { position: relative; border-radius: 20px; overflow: hidden; display: block; flex: 1; text-decoration: none; min-height: 210px; }
          .featured-small .featured-image { position: absolute; inset: 0; }
          .featured-small .featured-image img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease; }
          .featured-small:hover .featured-image img { transform: scale(1.05); }
          .featured-small .featured-content { position: absolute; bottom: 0; left: 0; right: 0; padding: 24px; z-index: 2; }
          .featured-small .article-tag { display: inline-block; background: rgba(255,255,255,0.2); color: white; font-size: 10px; font-weight: 600; padding: 4px 10px; border-radius: 100px; text-transform: uppercase; margin-bottom: 10px; }
          .featured-small h4 { font-size: 18px; font-weight: 600; color: #fff; margin-bottom: 8px; line-height: 1.4; }
          .featured-small .article-date { font-size: 12px; color: rgba(255,255,255,0.7); }

          /* Blog Filter Tags */
          .blog-filter-section {
            background: #fff;
            padding: 40px 0 24px;
            border-bottom: 1px solid #f0f0f0;
          }
          .blog-filter-bar {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            justify-content: center;
          }
          .blog-filter-tag {
            display: inline-block;
            padding: 10px 22px;
            border-radius: 100px;
            font-size: 13px;
            font-weight: 600;
            letter-spacing: 0.02em;
            border: 1px solid #e0e0e0;
            background: #fff;
            color: #555;
            cursor: pointer;
            transition: all 0.25s ease;
            white-space: nowrap;
            font-family: inherit;
          }
          .blog-filter-tag:hover {
            border-color: #ed145b;
            color: #ed145b;
            background: rgba(237,20,91,0.04);
          }
          .blog-filter-tag.active {
            background: #ed145b;
            color: #fff;
            border-color: #ed145b;
          }
          .blog-filter-tag.active:hover {
            background: #d41154;
            border-color: #d41154;
            color: #fff;
          }
          .blog-no-results {
            text-align: center;
            padding: 60px 20px;
          }
          .blog-no-results p {
            font-size: 16px;
            color: #888;
          }
          .blog-filter-count {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-width: 22px;
            height: 22px;
            padding: 0 6px;
            border-radius: 100px;
            font-size: 11px;
            font-weight: 700;
            margin-left: 8px;
            background: rgba(0,0,0,0.08);
            color: #777;
            line-height: 1;
          }
          .blog-filter-tag.active .blog-filter-count {
            background: rgba(255,255,255,0.25);
            color: #fff;
          }
          .blog-filter-tag:hover .blog-filter-count {
            background: rgba(237,20,91,0.12);
            color: #ed145b;
          }
          .blog-filter-tag.active:hover .blog-filter-count {
            background: rgba(255,255,255,0.25);
            color: #fff;
          }
          @media (max-width: 576px) {
            .blog-filter-bar { gap: 8px; }
            .blog-filter-tag { padding: 8px 16px; font-size: 12px; }
            .blog-filter-count { min-width: 18px; height: 18px; font-size: 10px; margin-left: 6px; }
          }

          /* Blog Stats Bar */
          .blog-stats-bar { background: #111122; padding: 0; border-bottom: 1px solid rgba(255,255,255,0.06); }
          .blog-stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
          .blog-stats-item { padding: 28px 20px; text-align: center; border-right: 1px solid rgba(255,255,255,0.06); }
          .blog-stats-item:last-child { border-right: none; }
          .blog-stats-value { font-size: 32px; font-weight: 800; color: #ed145b; margin-bottom: 4px; letter-spacing: -0.02em; }
          .blog-stats-label { font-size: 13px; color: rgba(255,255,255,0.5); text-transform: uppercase; letter-spacing: 1px; font-weight: 500; }
          @media (max-width: 768px) {
            .blog-stats-grid { grid-template-columns: repeat(2, 1fr); }
            .blog-stats-item:nth-child(2) { border-right: none; }
          }
          @media (max-width: 480px) {
            .blog-stats-grid { grid-template-columns: 1fr 1fr; }
            .blog-stats-value { font-size: 26px; }
            .blog-stats-item { padding: 20px 12px; }
          }

          /* Blog Results Info */
          .blog-results-info {
            font-size: 15px;
            color: #666;
            margin-bottom: 24px;
            padding: 12px 0;
            border-bottom: 1px solid #eee;
          }
          .blog-results-info strong { color: #292935; }

          /* Blog Pagination */
          .blog-pagination {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 12px;
            margin-top: 60px;
            padding-top: 40px;
            border-top: 1px solid #eee;
          }
          .blog-page-btn {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            padding: 12px 24px;
            border-radius: 100px;
            font-size: 14px;
            font-weight: 600;
            color: #555;
            background: #fff;
            border: 1px solid #e0e0e0;
            text-decoration: none;
            transition: all 0.25s ease;
            cursor: pointer;
          }
          .blog-page-btn svg { width: 18px; height: 18px; }
          .blog-page-btn:hover {
            border-color: #ed145b;
            color: #ed145b;
            background: rgba(237,20,91,0.04);
          }
          .blog-page-btn.disabled {
            opacity: 0.35;
            pointer-events: none;
            cursor: default;
          }
          .blog-page-numbers {
            display: flex;
            align-items: center;
            gap: 6px;
          }
          .blog-page-num {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 40px;
            height: 40px;
            border-radius: 50%;
            font-size: 14px;
            font-weight: 600;
            color: #555;
            text-decoration: none;
            transition: all 0.25s ease;
            border: 1px solid transparent;
          }
          .blog-page-num:hover {
            border-color: #ed145b;
            color: #ed145b;
            background: rgba(237,20,91,0.04);
          }
          .blog-page-num.active {
            background: #ed145b;
            color: #fff;
            border-color: #ed145b;
          }
          .blog-page-ellipsis {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 40px;
            height: 40px;
            font-size: 14px;
            color: #999;
            letter-spacing: 2px;
          }
          @media (max-width: 576px) {
            .blog-pagination { gap: 8px; flex-wrap: wrap; }
            .blog-page-btn { padding: 10px 16px; font-size: 13px; }
            .blog-page-btn svg { width: 16px; height: 16px; }
            .blog-page-num { width: 36px; height: 36px; font-size: 13px; }
          }

          /* Articles Grid */
          .blog-grid-section { padding: 60px 0 100px; background: #fff; }
          .blog-grid-section .section-header { margin-bottom: 40px; }
          .blog-grid-section .section-header h2 { font-size: 28px; font-weight: 700; color: #292935; }

          .articles-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
          @media (max-width: 991px) { .articles-grid { grid-template-columns: repeat(2, 1fr); } }
          @media (max-width: 576px) { .articles-grid { grid-template-columns: 1fr; } }

          .article-card {
            background: #fff;
            border-radius: 20px;
            overflow: hidden;
            border: 1px solid #e5e5e5;
            transition: all 0.3s ease;
            text-decoration: none;
            display: block;
            box-shadow: 0 2px 8px rgba(0,0,0,0.06);
          }
          .article-card:hover { transform: translateY(-5px); border-color: rgba(237,20,91,0.3); box-shadow: 0 8px 24px rgba(0,0,0,0.1); }

          .article-image { position: relative; height: 200px; overflow: hidden; }
          .article-image img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease; }
          .article-card:hover .article-image img { transform: scale(1.1); }
          .article-image .article-tag { position: absolute; top: 16px; left: 16px; background: #ed145b; color: #fff; font-size: 10px; font-weight: 700; padding: 5px 12px; border-radius: 100px; text-transform: uppercase; letter-spacing: 0.5px; }

          .article-body { padding: 24px; }
          .article-body h3 { font-size: 18px; font-weight: 600; color: #292935; margin-bottom: 12px; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
          .article-body p { color: #666; font-size: 14px; line-height: 1.6; margin-bottom: 16px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

          .article-footer { display: flex; justify-content: space-between; align-items: center; padding-top: 16px; border-top: 1px solid #eee; }
          .article-footer .article-date { color: #a1a1a1; font-size: 13px; }
          .read-more { display: flex; align-items: center; gap: 6px; color: #ed145b; font-size: 13px; font-weight: 600; }
          .read-more svg { width: 14px; height: 14px; transition: transform 0.2s; }
          .article-card:hover .read-more svg { transform: translateX(4px); }

          /* Blog Newsletter */
          .blog-newsletter-section { padding: 80px 0; background: #f8f8f8; }
          .newsletter-card {
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 40px;
            background: linear-gradient(135deg, rgba(237,20,91,0.06), rgba(64,68,230,0.03));
            border: 1px solid rgba(237,20,91,0.15);
            border-radius: 24px;
            padding: 50px;
          }
          @media (max-width: 768px) { .newsletter-card { flex-direction: column; text-align: center; padding: 30px; } }
          .newsletter-content h3 { font-size: 28px; font-weight: 700; color: #292935; margin-bottom: 8px; }
          .newsletter-content p { color: #666; font-size: 16px; }
          .newsletter-cta { display: inline-block; background: #ed145b; color: #fff; padding: 16px 32px; border-radius: 12px; font-size: 15px; font-weight: 600; text-decoration: none; transition: all 0.3s ease; }
          .newsletter-cta:hover { background: #4044e6; transform: translateY(-2px); }

          @media (max-width: 640px) {
            .blog-hero h1 { font-size: 36px; letter-spacing: -1px; }
            .blog-hero p { font-size: 16px; }
            .featured-main { height: 300px; }
            .featured-main h3 { font-size: 22px; }
          }

          /* ==========================================
             BLOG DETAIL PAGE STYLES
             ========================================== */

          .blog-article .article-header {
            padding: 140px 0 60px;
            background: linear-gradient(57deg, #1a1a2e 0%, #4044e6 25%, #ed145b 50%, #4044e6 75%, #1a1a2e 100%);
            background-size: 400% 400%;
            animation: gradient-shift 15s ease infinite;
            text-align: center;
            position: relative;
          }
          .blog-article .back-link {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            color: rgba(255,255,255,0.7);
            text-decoration: none;
            font-size: 14px;
            margin-bottom: 24px;
            padding: 8px 20px;
            border-radius: 30px;
            background: rgba(255,255,255,0.08);
            border: 1px solid rgba(255,255,255,0.1);
            transition: all 0.2s;
            position: relative;
            z-index: 1;
          }
          .blog-article .back-link:hover { color: #ffd400; background: rgba(255,255,255,0.12); }
          .blog-article .back-link svg { width: 16px; height: 16px; }

          .blog-article .article-category-badge {
            display: inline-block;
            background: linear-gradient(135deg, #ffd400, #f59e0b);
            color: #0a0a0a;
            font-size: 11px;
            font-weight: 700;
            padding: 8px 20px;
            border-radius: 100px;
            text-transform: uppercase;
            letter-spacing: 1.5px;
            margin-bottom: 20px;
            position: relative;
            z-index: 1;
            box-shadow: 0 4px 20px rgba(255,212,0,0.3);
          }

          .blog-article .article-header h1 {
            font-size: 44px;
            font-weight: 800;
            color: #fff;
            max-width: 850px;
            margin: 0 auto 16px;
            line-height: 1.2;
            letter-spacing: -1px;
            position: relative;
            z-index: 1;
          }
          .blog-article .article-header .article-subtitle {
            display: block;
            font-size: 22px;
            font-weight: 400;
            color: rgba(255,255,255,0.7);
            margin-top: 12px;
          }
          .blog-article .article-meta-header {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 16px;
            font-size: 14px;
            color: rgba(255,255,255,0.6);
            position: relative;
            z-index: 1;
          }
          .blog-article .article-meta-header .author { color: #ffd400; font-weight: 600; }
          .blog-article .article-meta-header .divider { width: 4px; height: 4px; border-radius: 50%; background: rgba(255,255,255,0.3); }

          .blog-article .article-hero-image {
            margin-top: -40px;
            padding: 40px 0;
            text-align: center;
            position: relative;
            z-index: 2;
            background: linear-gradient(135deg, #ffffff 0%, #ed145b 25%, #fff0f4 50%, #ed145b 75%, #ffffff 100%);
            background-size: 400% 400%;
            animation: gradient-shift 15s ease infinite;
            box-shadow: inset 0 8px 20px rgba(0,0,0,0.4), inset 0 -8px 20px rgba(0,0,0,0.4);
          }
          .blog-article .article-hero-image img {
            display: block;
            margin: 0 auto;
            max-width: 1000px;
            width: 90%;
            max-height: 480px;
            object-fit: cover;
            border-radius: 20px;
            box-shadow: 0 20px 60px rgba(0,0,0,0.5);
          }

          .blog-article .article-content {
            padding: 40px 0 80px;
            background: linear-gradient(180deg, #1e293b 0%, #0f172a 20%, #0f172a 100%);
          }
          .blog-article .content-wrapper {
            display: grid;
            grid-template-columns: 1fr 260px;
            gap: 40px;
            max-width: 1150px;
            margin: 0 auto;
            padding: 0 20px;
          }
          @media (max-width: 1024px) { .blog-article .content-wrapper { grid-template-columns: 1fr; } }

          .blog-article .content-main {
            font-size: 16px;
            line-height: 1.8;
            color: rgba(255,255,255,0.88);
            background: linear-gradient(135deg, rgba(30,40,60,0.95) 0%, rgba(20,30,50,0.98) 100%);
            border: 1px solid rgba(99,182,255,0.15);
            border-radius: 16px;
            padding: 40px;
          }
          .blog-article .content-main h2 {
            font-size: 26px;
            font-weight: 700;
            color: #60a5fa;
            margin: 40px 0 16px;
            padding-bottom: 10px;
            border-bottom: 3px solid transparent;
            border-image: linear-gradient(90deg, #60a5fa, #34d399) 1;
          }
          .blog-article .content-main h3 {
            font-size: 20px;
            font-weight: 600;
            color: #34d399;
            margin: 32px 0 12px;
            padding-left: 14px;
            border-left: 4px solid transparent;
            border-image: linear-gradient(180deg, #34d399, #10b981) 1;
          }
          .blog-article .content-main h4 {
            font-size: 17px;
            font-weight: 600;
            color: #ed145b;
            margin: 24px 0 10px;
          }
          .blog-article .content-main p { margin-bottom: 16px; }
          .blog-article .content-main p:first-of-type {
            font-size: 18px;
            color: rgba(255,255,255,0.9);
            border-left: 4px solid #60a5fa;
            padding: 16px 20px;
            background: linear-gradient(to right, rgba(96,165,250,0.08), transparent);
            border-radius: 0 8px 8px 0;
          }
          .blog-article .content-main strong { color: #fbbf24; font-weight: 700; }
          .blog-article .content-main a { color: #60a5fa; text-decoration: none; border-bottom: 1px solid transparent; transition: border-color 0.2s; }
          .blog-article .content-main a:hover { border-bottom-color: #60a5fa; }
          .blog-article .content-main img { max-width: 100%; border-radius: 12px; margin: 24px 0; box-shadow: 0 4px 20px rgba(0,0,0,0.3); }
          .blog-article .content-main ul { margin: 16px 0; padding-left: 0; list-style: none; }
          .blog-article .content-main ul li { padding: 6px 0 6px 28px; position: relative; color: rgba(255,255,255,0.85); }
          .blog-article .content-main ul li::before { content: ''; position: absolute; left: 0; top: 14px; width: 10px; height: 10px; border-radius: 50%; background: linear-gradient(135deg, #34d399, #60a5fa); }
          .blog-article .content-main ol { margin: 16px 0; padding-left: 0; list-style: none; counter-reset: ol-counter; }
          .blog-article .content-main ol li { padding: 6px 0 6px 36px; position: relative; counter-increment: ol-counter; color: rgba(255,255,255,0.85); }
          .blog-article .content-main ol li::before { content: counter(ol-counter); position: absolute; left: 0; top: 6px; width: 24px; height: 24px; border-radius: 6px; background: linear-gradient(135deg, #60a5fa, #34d399); color: #fff; font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
          .blog-article .content-main blockquote {
            margin: 24px 0;
            padding: 24px 28px;
            background: linear-gradient(135deg, rgba(96,165,250,0.08), rgba(52,211,153,0.06));
            border-left: 4px solid #ed145b;
            border-radius: 0 12px 12px 0;
            font-style: italic;
            position: relative;
            color: rgba(255,255,255,0.85);
          }
          .blog-article .content-main blockquote::before { content: '\201C'; position: absolute; top: -10px; left: 12px; font-size: 60px; color: #ed145b; opacity: 0.2; font-family: Georgia, serif; }

          /* Blog Detail Tables */
          .blog-article .content-main table {
            width: 100%;
            border-collapse: collapse;
            margin: 24px 0;
            border-radius: 12px;
            overflow: hidden;
            border: 1px solid rgba(255,255,255,0.1);
            font-size: 14px;
          }
          .blog-article .content-main thead th {
            background: linear-gradient(135deg, rgba(96,165,250,0.2), rgba(52,211,153,0.15));
            color: #60a5fa;
            padding: 14px 16px;
            text-align: left;
            font-weight: 600;
            font-size: 13px;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            border-bottom: 2px solid rgba(96,165,250,0.3);
          }
          .blog-article .content-main tbody td {
            padding: 12px 16px;
            border-bottom: 1px solid rgba(255,255,255,0.06);
            color: rgba(255,255,255,0.85);
          }
          .blog-article .content-main tbody tr:hover { background: rgba(96,165,250,0.05); }
          .blog-article .content-main tbody tr:last-child td { border-bottom: none; }

          /* Stat Cards */
          .blog-stat-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin: 30px 0; }
          @media (max-width: 640px) { .blog-stat-cards { grid-template-columns: 1fr; } }
          .blog-stat-card {
            text-align: center;
            padding: 28px 20px;
            border-radius: 16px;
            background: rgba(30,40,60,0.6);
            border: 1px solid rgba(255,255,255,0.08);
            transition: border-color 0.3s, box-shadow 0.3s;
          }
          .blog-stat-card:hover {
            border-color: rgba(255,212,0,0.3);
            box-shadow: 0 4px 20px rgba(255,212,0,0.08);
          }
          .blog-stat-card .stat-value { font-size: 36px; font-weight: 800; color: #ffd400; margin-bottom: 6px; }
          .blog-stat-card .stat-label { font-size: 13px; color: rgba(255,255,255,0.6); font-weight: 500; }

          /* Horizontal Bar Charts */
          .blog-bar-chart { margin: 24px 0; }
          .blog-bar-item { margin-bottom: 16px; }
          .blog-bar-label { display: flex; justify-content: space-between; margin-bottom: 6px; font-size: 14px; font-weight: 600; color: rgba(255,255,255,0.9); }
          .blog-bar-track { height: 32px; background: rgba(255,255,255,0.08); border-radius: 8px; overflow: hidden; position: relative; }
          .blog-bar-fill { height: 100%; border-radius: 8px; display: flex; align-items: center; padding-left: 12px; color: #fff; font-size: 13px; font-weight: 600; transition: width 0.8s ease; }

          /* Progress Bars */
          .blog-progress { margin: 12px 0; }
          .blog-progress-label { display: flex; justify-content: space-between; font-size: 13px; margin-bottom: 4px; }
          .blog-progress-label span:first-child { color: rgba(255,255,255,0.9); font-weight: 600; }
          .blog-progress-label span:last-child { color: #ffd400; font-weight: 700; }
          .blog-progress-track { height: 10px; background: rgba(255,255,255,0.08); border-radius: 5px; overflow: hidden; }
          .blog-progress-fill { height: 100%; border-radius: 5px; background: linear-gradient(90deg, #ffd400, #f59e0b); }

          /* Comparison Cards */
          .blog-compare { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin: 30px 0; }
          @media (max-width: 640px) { .blog-compare { grid-template-columns: 1fr; } }
          .blog-compare-card {
            padding: 28px;
            border-radius: 16px;
            background: rgba(30,40,60,0.4);
            border: 1px solid rgba(255,255,255,0.08);
          }
          .blog-compare-card.highlight {
            border-color: rgba(255,212,0,0.3);
            background: linear-gradient(135deg, rgba(255,212,0,0.05), rgba(245,158,11,0.03));
          }
          .blog-compare-card h4 { font-size: 18px; font-weight: 700; margin: 0 0 4px; color: #fff; }
          .blog-compare-card .compare-subtitle { font-size: 13px; color: #ffd400; font-weight: 600; margin-bottom: 16px; }
          .blog-compare-card .compare-item { padding: 8px 0; border-bottom: 1px solid rgba(255,255,255,0.06); font-size: 14px; color: rgba(255,255,255,0.7); display: flex; justify-content: space-between; }
          .blog-compare-card .compare-item:last-child { border-bottom: none; }
          .blog-compare-card .compare-item strong { color: #fff; }

          /* Info Box */
          .blog-info-box {
            margin: 24px 0;
            padding: 20px 24px;
            border-radius: 12px;
            border: 1px solid;
          }
          .blog-info-box.tip { background: rgba(34,197,94,0.08); border-color: rgba(34,197,94,0.25); }
          .blog-info-box.tip .info-title { color: #34d399; }
          .blog-info-box.warning { background: rgba(245,158,11,0.08); border-color: rgba(245,158,11,0.25); }
          .blog-info-box.warning .info-title { color: #fbbf24; }
          .blog-info-box.note { background: rgba(96,165,250,0.08); border-color: rgba(96,165,250,0.25); }
          .blog-info-box.note .info-title { color: #60a5fa; }
          .info-title { font-size: 14px; font-weight: 700; margin-bottom: 6px; display: flex; align-items: center; gap: 8px; }
          .blog-info-box p { margin: 0; font-size: 14px; color: rgba(255,255,255,0.7); }

          /* CTA Box */
          .blog-cta-box {
            margin: 40px 0;
            padding: 36px 32px;
            border-radius: 16px;
            background: linear-gradient(135deg, rgba(255,212,0,0.08), rgba(245,158,11,0.04));
            border: 1px solid rgba(255,212,0,0.25);
            text-align: center;
          }
          .blog-cta-box h3 { font-size: 22px; font-weight: 700; color: #fff; margin: 0 0 12px; }
          .blog-cta-box p { font-size: 15px; color: rgba(255,255,255,0.7); margin: 0 0 24px; max-width: 560px; margin-left: auto; margin-right: auto; }
          .blog-cta-box .cta-button {
            display: inline-block;
            padding: 14px 36px;
            background: #ffd400;
            color: #0a0a0a;
            font-weight: 700;
            font-size: 15px;
            border-radius: 8px;
            text-decoration: none;
            transition: background 0.2s, transform 0.2s;
          }
          .blog-cta-box .cta-button:hover { background: #e6bf00; transform: translateY(-1px); }

          /* Donut Chart */
          .blog-donut-wrapper { text-align: center; margin: 30px 0; }
          .blog-donut { position: relative; width: 180px; height: 180px; margin: 0 auto 16px; }
          .blog-donut svg { transform: rotate(-90deg); }
          .blog-donut .donut-center { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 28px; font-weight: 800; color: #fff; }
          .blog-donut-legend { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px; font-size: 13px; color: rgba(255,255,255,0.6); }
          .blog-donut-legend span { display: flex; align-items: center; gap: 6px; }
          .blog-donut-legend .dot { width: 10px; height: 10px; border-radius: 50%; }

          /* Sidebar */
          .blog-article .content-sidebar { position: sticky; top: 100px; }
          @media (max-width: 1024px) { .blog-article .content-sidebar { position: static; } }
          .sidebar-card {
            background: linear-gradient(135deg, rgba(30,40,60,0.9), rgba(20,30,50,0.95));
            border: 1px solid rgba(99,182,255,0.12);
            border-radius: 16px;
            padding: 24px;
            margin-bottom: 20px;
          }
          .sidebar-card h4 {
            font-size: 13px;
            text-transform: uppercase;
            letter-spacing: 1px;
            color: #fff;
            margin: 0 0 16px;
            padding-left: 12px;
            border-left: 3px solid #ffd400;
          }
          .share-buttons { display: flex; gap: 10px; }
          .share-btn {
            width: 42px;
            height: 42px;
            border-radius: 10px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #fff;
            text-decoration: none;
            font-size: 16px;
            transition: transform 0.2s, opacity 0.2s;
            border: none;
            cursor: pointer;
          }
          .share-btn:hover { transform: translateY(-2px); opacity: 0.9; }
          .share-btn.twitter { background: #1DA1F2; }
          .share-btn.facebook { background: #1877F2; }
          .share-btn.linkedin { background: #0A66C2; }
          .share-btn.copy-link { background: rgba(255,255,255,0.12); }

          .related-list { display: flex; flex-direction: column; gap: 12px; }
          .related-item {
            display: flex;
            gap: 12px;
            text-decoration: none;
            padding: 10px;
            border-radius: 10px;
            border: 1px solid rgba(255,255,255,0.08);
            transition: all 0.2s;
          }
          .related-item:hover { border-color: #ffd400; transform: translateY(-1px); }
          .related-item img { width: 70px; height: 50px; object-fit: cover; border-radius: 6px; flex-shrink: 0; }
          .related-item h5 { font-size: 13px; font-weight: 600; color: #fff; margin: 0 0 4px; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
          .related-item span { font-size: 11px; color: rgba(255,255,255,0.5); }

          /* Blog article tags */
          .blog-tags { margin-top: 40px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,0.1); display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
          .blog-tags .tag-label { font-size: 14px; font-weight: 600; color: #fff; }
          .blog-tag { display: inline-block; padding: 5px 16px; background: rgba(255,255,255,0.08); border-radius: 20px; font-size: 12px; color: rgba(255,255,255,0.7); text-decoration: none; transition: all 0.2s; }
          .blog-tag:hover { background: #ffd400; color: #0a0a0a; }

          /* Author Card */
          .blog-author-card {
            margin-top: 40px;
            padding: 28px;
            background: rgba(30,40,60,0.5);
            border: 1px solid rgba(255,255,255,0.08);
            border-radius: 12px;
            display: flex;
            align-items: center;
            gap: 20px;
          }
          .blog-author-card img { width: 60px; height: 60px; border-radius: 50%; object-fit: cover; }
          .blog-author-card h5 { font-size: 16px; font-weight: 600; margin: 0 0 5px; color: #fff; }
          .blog-author-card p { font-size: 13px; color: rgba(255,255,255,0.6); margin: 0; }

          /* Blog Cross-Reference Bars (Tool + PDF) */
          .blog-ref-topbar {
            background: linear-gradient(135deg, #0d0d1a 0%, #1a0f20 50%, #1a1028 100%);
            padding: 24px 0;
            border-bottom: 3px solid rgba(237,20,91,0.25);
          }
          .blog-ref-topbar-inner {
            display: flex;
            gap: 14px;
            justify-content: center;
            align-items: center;
            flex-wrap: wrap;
          }

          .blog-ref-bottombar {
            background: linear-gradient(135deg, #0d0d1a 0%, #1a0f20 50%, #1a1028 100%);
            padding: 40px 0;
            border-top: 3px solid rgba(237,20,91,0.25);
          }
          .blog-ref-bottom-inner {
            display: flex;
            gap: 14px;
            justify-content: center;
            align-items: center;
            flex-wrap: wrap;
          }
          .blog-ref-btn {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            padding: 14px 28px;
            border-radius: 12px;
            font-size: 15px;
            font-weight: 700;
            text-decoration: none;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
          }
          .blog-ref-btn svg { width: 20px; height: 20px; flex-shrink: 0; }
          .blog-ref-btn-tool {
            background: linear-gradient(135deg, #ed145b, #ff4081);
            color: #fff;
            box-shadow: 0 8px 30px rgba(237,20,91,0.35);
          }
          .blog-ref-btn-tool:hover {
            transform: translateY(-3px);
            box-shadow: 0 12px 40px rgba(237,20,91,0.45);
          }
          .blog-ref-btn-pdf {
            background: linear-gradient(135deg, #4044e6, #5c5ff0);
            color: #fff;
            box-shadow: 0 8px 30px rgba(64,68,230,0.35);
          }
          .blog-ref-btn-pdf:hover {
            transform: translateY(-3px);
            box-shadow: 0 12px 40px rgba(64,68,230,0.45);
          }
          .blog-ref-btn-secondary {
            background: rgba(255,255,255,0.06);
            color: rgba(255,255,255,0.8);
            border: 1px solid rgba(255,255,255,0.15);
          }
          .blog-ref-btn-secondary:hover {
            background: rgba(255,255,255,0.12);
            border-color: rgba(237,20,91,0.4);
            color: #fff;
            transform: translateY(-3px);
          }

          @media (max-width: 768px) {
            .blog-ref-topbar-inner, .blog-ref-bottom-inner { flex-direction: column; }
            .blog-ref-btn { width: 100%; justify-content: center; text-align: center; }
          }

          @media (max-width: 768px) {
            .blog-article .article-header h1 { font-size: 30px; }
            .blog-article .article-header .article-subtitle { font-size: 17px; }
            .blog-article .article-meta-header { flex-wrap: wrap; gap: 8px; }
            .blog-stat-cards { grid-template-columns: 1fr; }
            .blog-compare { grid-template-columns: 1fr; }
            .blog-article .content-main { padding: 24px; }
          }

          /* YouTube Video Modal */
          .yt-modal-overlay {
            display: none;
            position: fixed;
            top: 0; left: 0; right: 0; bottom: 0;
            background: rgba(0, 0, 0, 0.85);
            z-index: 99999;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            animation: ytModalFadeIn 0.3s ease;
          }
          .yt-modal-overlay.active { display: flex; }
          @keyframes ytModalFadeIn { from { opacity: 0; } to { opacity: 1; } }
          .yt-modal-container {
            position: relative;
            width: 90vw;
            max-width: 960px;
            aspect-ratio: 16 / 9;
            cursor: default;
          }
          .yt-modal-container iframe {
            width: 100%;
            height: 100%;
            border: none;
            border-radius: 4px;
          }
          .yt-modal-close {
            position: absolute;
            top: -40px;
            right: -5px;
            width: 36px;
            height: 36px;
            background: none;
            border: none;
            color: #fff;
            font-size: 28px;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            opacity: 0.8;
            transition: opacity 0.2s;
          }
          .yt-modal-close:hover { opacity: 1; }

          /* --- SEO Pages --- */
          .seo-hero { background: linear-gradient(135deg, #0a1628 0%, #1a2d4a 50%, #0d2137 100%); padding: 120px 15px 80px; text-align: center; position: relative; overflow: hidden; }
          .seo-hero::before { content: ''; position: absolute; top: -50%; left: -50%; width: 200%; height: 200%; background: radial-gradient(circle at 30% 50%, rgba(59,130,246,0.08) 0%, transparent 50%), radial-gradient(circle at 70% 50%, rgba(16,185,129,0.06) 0%, transparent 50%); pointer-events: none; }
          .seo-hero-inner { max-width: 800px; margin: 0 auto; position: relative; z-index: 1; }
          .seo-hero-badge { display: inline-block; padding: 6px 16px; background: rgba(59,130,246,0.15); border: 1px solid rgba(59,130,246,0.3); border-radius: 20px; color: #60a5fa; font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 20px; }
          .seo-hero h1 { font-size: clamp(28px, 5vw, 44px); font-weight: 800; color: #fff; margin: 0 0 20px; line-height: 1.2; }
          .seo-hero h1 span { color: #60a5fa; }
          .seo-hero p { font-size: 17px; color: rgba(255,255,255,0.7); line-height: 1.7; margin: 0 0 30px; }
          .seo-hero-ctas { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
          .seo-btn-primary { display: inline-block; padding: 14px 32px; background: #3b82f6; color: #fff; border-radius: 8px; font-weight: 600; font-size: 15px; text-decoration: none; transition: all 0.2s; }
          .seo-btn-primary:hover { background: #2563eb; transform: translateY(-1px); }
          .seo-btn-outline { display: inline-block; padding: 14px 32px; background: transparent; color: #fff; border: 1px solid rgba(255,255,255,0.25); border-radius: 8px; font-weight: 600; font-size: 15px; text-decoration: none; transition: all 0.2s; }
          .seo-btn-outline:hover { border-color: rgba(255,255,255,0.5); background: rgba(255,255,255,0.05); }
          .seo-breadcrumbs { padding: 16px 0; background: #f8fafc; border-bottom: 1px solid #e2e8f0; font-size: 13px; }
          .seo-breadcrumbs .cs-container { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
          .seo-breadcrumbs a { color: #3b82f6; text-decoration: none; }
          .seo-breadcrumbs a:hover { text-decoration: underline; }
          .seo-breadcrumbs span { color: #94a3b8; }
          .seo-section { padding: 80px 15px; }
          .seo-section-alt { background: #f8fafc; }
          .seo-section-header { text-align: center; max-width: 600px; margin: 0 auto 50px; }
          .seo-section-header h2 { font-size: 2.25rem; font-weight: 600; color: #292935; margin: 0 0 12px; }
          .seo-section-header p { font-size: 16px; color: #a1a1a1; line-height: 1.6; margin: 0; }
          .seo-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
          @media (max-width: 900px) { .seo-grid-3 { grid-template-columns: repeat(2, 1fr); } }
          @media (max-width: 600px) { .seo-grid-3 { grid-template-columns: 1fr; } }
          .seo-card { background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; padding: 32px; transition: all 0.2s; }
          .seo-card:hover { border-color: #3b82f6; box-shadow: 0 4px 20px rgba(59,130,246,0.08); transform: translateY(-2px); }
          .seo-card-icon { width: 52px; height: 52px; background: rgba(59,130,246,0.1); border-radius: 10px; display: flex; align-items: center; justify-content: center; margin-bottom: 16px; }
          .seo-card-icon svg { width: 26px; height: 26px; color: #3b82f6; }
          .seo-card h3 { font-size: 20px; font-weight: 600; color: #292935; margin: 0 0 8px; }
          .seo-card p { font-size: 16px; color: #292935; line-height: 1.6; margin: 0; }
          .seo-benefits { max-width: 700px; margin: 0 auto; }
          .seo-benefit-row { display: flex; gap: 24px; padding: 28px 0; border-bottom: 1px solid #e2e8f0; align-items: flex-start; }
          .seo-benefit-row:last-child { border-bottom: none; }
          .seo-benefit-number { font-size: 32px; font-weight: 800; color: #3b82f6; opacity: 0.3; min-width: 50px; line-height: 1; }
          .seo-benefit-content h3 { font-size: 20px; font-weight: 600; color: #292935; margin: 0 0 6px; }
          .seo-benefit-content p { font-size: 16px; color: #292935; line-height: 1.6; margin: 0; }
          .seo-compliance-bar { display: flex; align-items: center; gap: 20px; padding: 24px 32px; background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: 12px; flex-wrap: wrap; }
          .seo-compliance-label { display: flex; align-items: center; gap: 8px; font-weight: 600; color: #166534; font-size: 16px; white-space: nowrap; }
          .seo-compliance-label svg { width: 20px; height: 20px; }
          .seo-compliance-tags { display: flex; gap: 8px; flex-wrap: wrap; }
          .seo-compliance-tag { padding: 6px 16px; background: #fff; border: 1px solid #bbf7d0; border-radius: 16px; font-size: 14px; color: #166534; font-weight: 500; }
          .seo-faq-list { max-width: 700px; margin: 0 auto; }
          .seo-faq-item { border: 1px solid #e2e8f0; border-radius: 10px; margin-bottom: 10px; overflow: hidden; background: #fff; }
          .seo-faq-question { width: 100%; display: flex; justify-content: space-between; align-items: center; padding: 18px 20px; background: none; border: none; cursor: pointer; font-size: 16px; font-weight: 600; color: #292935; text-align: left; font-family: inherit; }
          .seo-faq-question svg { width: 18px; height: 18px; color: #94a3b8; transition: transform 0.2s; flex-shrink: 0; margin-left: 12px; }
          .seo-faq-item.open .seo-faq-question svg { transform: rotate(180deg); }
          .seo-faq-answer { max-height: 0; overflow: hidden; transition: max-height 0.3s ease; }
          .seo-faq-item.open .seo-faq-answer { max-height: 300px; }
          .seo-faq-answer p { padding: 0 20px 18px; font-size: 16px; color: #292935; line-height: 1.7; margin: 0; }
          .seo-two-col { display: grid; grid-template-columns: 1.5fr 1fr; gap: 50px; align-items: start; }
          @media (max-width: 768px) { .seo-two-col { grid-template-columns: 1fr; } }
          .seo-col-text h2 { font-size: 2.25rem; font-weight: 600; color: #292935; margin: 0 0 20px; }
          .seo-col-text p { font-size: 16px; color: #292935; line-height: 1.7; margin: 0 0 16px; }
          .seo-col-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
          .seo-stat-card { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 12px; padding: 24px; text-align: center; }
          .seo-stat-value { font-size: 28px; font-weight: 800; color: #3b82f6; }
          .seo-stat-label { font-size: 14px; color: #292935; margin-top: 4px; }
          .seo-checklist { max-width: 700px; margin: 0 auto; }
          .seo-check-item { display: flex; gap: 16px; padding: 20px 0; border-bottom: 1px solid #f1f5f9; align-items: flex-start; }
          .seo-check-item:last-child { border-bottom: none; }
          .seo-check-item svg { width: 24px; height: 24px; color: #10b981; flex-shrink: 0; margin-top: 2px; }
          .seo-check-item strong { display: block; font-size: 18px; color: #292935; margin-bottom: 4px; }
          .seo-check-item p { font-size: 16px; color: #292935; line-height: 1.6; margin: 0; }
          .seo-cta-section { padding: 80px 15px; }
          .seo-cta-card { max-width: 700px; margin: 0 auto; text-align: center; background: linear-gradient(135deg, #0a1628 0%, #1a2d4a 100%); border-radius: 16px; padding: 50px 40px; }
          .seo-cta-card h2 { font-size: 28px; font-weight: 700; color: #fff; margin: 0 0 12px; }
          .seo-cta-card p { font-size: 16px; color: rgba(255,255,255,0.7); margin: 0 0 28px; line-height: 1.6; }

          /* ============================================================
             RESOURCES PAGE
             ============================================================ */
          .res-hero {
            background: linear-gradient(57deg, #1a1a2e 0%, #4044e6 25%, #ed145b 50%, #4044e6 75%, #1a1a2e 100%);
            background-size: 400% 400%;
            animation: gradient-shift 15s ease infinite;
            padding: 140px 0 100px;
            text-align: center;
            position: relative;
            overflow: hidden;
          }
          .res-hero h1 { font-size: 52px; font-weight: 800; color: #fff; margin: 0 0 20px; letter-spacing: -0.02em; position: relative; z-index: 1; }
          .res-hero h1 span {
            background: linear-gradient(90deg, #fff, #38bdf8, #fff);
            background-size: 200% auto;
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
            animation: shimmer 3s linear infinite;
          }
          .res-hero > .container > p { font-size: 18px; color: rgba(255,255,255,0.85); max-width: 620px; margin: 0 auto; line-height: 1.7; position: relative; z-index: 1; }
          .res-hero-badge {
            display: inline-block;
            background: rgba(0,0,0,0.3);
            color: #fff;
            font-size: 12px;
            font-weight: 700;
            padding: 10px 24px;
            border-radius: 100px;
            margin-bottom: 28px;
            text-transform: uppercase;
            letter-spacing: 2.5px;
            border: 1px solid rgba(255,255,255,0.25);
            position: relative;
            z-index: 1;
          }
          .res-hero-shapes { position: absolute; inset: 0; pointer-events: none; }
          .res-hero-shapes .shape { position: absolute; border-radius: 50%; opacity: 0.08; }
          .res-hero-shapes .shape-1 { width: 400px; height: 400px; background: #ed145b; top: -120px; right: -80px; }
          .res-hero-shapes .shape-2 { width: 300px; height: 300px; background: #4044e6; bottom: -100px; left: -60px; }
          .res-hero-shapes .shape-3 { width: 200px; height: 200px; background: #ed145b; top: 50%; left: 50%; transform: translate(-50%, -50%); }

          .res-stats-bar { background: #111122; padding: 0; border-bottom: 1px solid rgba(255,255,255,0.06); }
          .res-stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
          .res-stat-item { padding: 28px 20px; text-align: center; border-right: 1px solid rgba(255,255,255,0.06); }
          .res-stat-item:last-child { border-right: none; }
          .res-stat-value { font-size: 32px; font-weight: 800; color: #10b981; margin-bottom: 4px; letter-spacing: -0.02em; }
          .res-stat-label { font-size: 13px; color: rgba(255,255,255,0.5); text-transform: uppercase; letter-spacing: 1px; font-weight: 500; }

          .res-category-section { background: #0d0d1a; padding: 70px 0 20px; }
          .res-category-section:nth-child(odd) { background: #0f0f20; }
          .res-category-header { margin-bottom: 40px; }
          .res-category-header h2 { font-size: 30px; font-weight: 700; color: #fff; margin: 0 0 12px; }
          .res-category-header h2 span { color: #ed145b; }
          .res-category-header p { font-size: 16px; color: rgba(255,255,255,0.55); line-height: 1.6; max-width: 700px; }

          .res-cards-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; padding-bottom: 40px; }

          .res-card {
            background: linear-gradient(145deg, rgba(255,255,255,0.05), rgba(255,255,255,0.01));
            border: 1px solid rgba(255,255,255,0.08);
            border-radius: 16px;
            padding: 28px;
            transition: all 0.3s ease;
            display: flex;
            flex-direction: column;
          }
          .res-card:hover { border-color: rgba(64,68,230,0.3); transform: translateY(-4px); box-shadow: 0 12px 40px rgba(0,0,0,0.3); }
          .res-card-badge {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 10px 16px;
            background: linear-gradient(135deg, rgba(64,68,230,0.15), rgba(64,68,230,0.05));
            color: #4044e6;
            font-size: 11px;
            font-weight: 800;
            border-radius: 12px;
            margin-bottom: 20px;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            border: 1px solid rgba(64,68,230,0.2);
            align-self: flex-start;
          }
          .res-card h3 { font-size: 17px; font-weight: 600; color: #fff; margin: 0 0 10px; line-height: 1.4; }
          .res-card p { font-size: 14px; color: rgba(255,255,255,0.5); line-height: 1.6; margin: 0; flex: 1; }
          .res-view-btn {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            margin-top: 22px;
            padding: 10px 24px;
            background: #4044e6;
            color: #fff;
            font-size: 13px;
            font-weight: 600;
            border-radius: 100px;
            text-decoration: none;
            transition: all 0.3s;
            align-self: flex-start;
          }
          .res-view-btn:hover { background: #363ad0; transform: translateY(-2px); box-shadow: 0 6px 20px rgba(64,68,230,0.3); color: #fff; }
          .res-view-btn svg { transition: transform 0.2s; }
          .res-card:hover .res-view-btn svg { transform: translateX(4px); }

          .res-cta-section { background: #0d0d1a; padding: 40px 0 100px; }
          .res-cta-card {
            max-width: 700px;
            margin: 0 auto;
            text-align: center;
            background: linear-gradient(135deg, rgba(237,20,91,0.08), rgba(64,68,230,0.08));
            border: 1px solid rgba(237,20,91,0.2);
            border-radius: 20px;
            padding: 60px 40px;
          }
          .res-cta-card h2 { font-size: 28px; font-weight: 700; color: #fff; margin: 0 0 12px; }
          .res-cta-card p { font-size: 16px; color: rgba(255,255,255,0.6); margin: 0 0 32px; line-height: 1.6; }
          .res-cta-buttons { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }
          .res-cta-primary {
            display: inline-block;
            padding: 14px 36px;
            background: #ed145b;
            color: #fff;
            font-size: 15px;
            font-weight: 600;
            border-radius: 100px;
            text-decoration: none;
            transition: all 0.3s;
          }
          .res-cta-primary:hover { background: #d41154; transform: translateY(-2px); box-shadow: 0 8px 24px rgba(237,20,91,0.3); }
          .res-cta-secondary {
            display: inline-block;
            padding: 14px 36px;
            background: transparent;
            color: #fff;
            font-size: 15px;
            font-weight: 600;
            border-radius: 100px;
            text-decoration: none;
            border: 1px solid rgba(255,255,255,0.2);
            transition: all 0.3s;
          }
          .res-cta-secondary:hover { border-color: rgba(255,255,255,0.5); background: rgba(255,255,255,0.05); }

          /* ---- Resource Detail (Interim) Page ---- */
          .rd-hero {
            background: linear-gradient(57deg, #1a1a2e 0%, #4044e6 25%, #ed145b 50%, #4044e6 75%, #1a1a2e 100%);
            background-size: 400% 400%;
            animation: gradient-shift 15s ease infinite;
            padding: 120px 0 60px;
            position: relative;
            overflow: hidden;
          }
          .rd-breadcrumb { display: flex; align-items: center; gap: 8px; margin-bottom: 24px; font-size: 13px; position: relative; z-index: 1; }
          .rd-breadcrumb a { color: rgba(255,255,255,0.6); text-decoration: none; transition: color 0.2s; }
          .rd-breadcrumb a:hover { color: #fff; }
          .rd-bc-sep { color: rgba(255,255,255,0.3); }
          .rd-bc-current { color: rgba(255,255,255,0.9); font-weight: 500; }
          .rd-hero-badges { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 20px; position: relative; z-index: 1; }
          .rd-badge { display: inline-flex; align-items: center; gap: 6px; padding: 5px 14px; border-radius: 20px; font-size: 12px; font-weight: 600; letter-spacing: 0.3px; }
          .rd-badge-cat { background: rgba(255,255,255,0.1); color: rgba(255,255,255,0.8); border: 1px solid rgba(255,255,255,0.15); }
          .rd-badge-format { background: rgba(255,255,255,0.08); color: rgba(255,255,255,0.7); border: 1px solid rgba(255,255,255,0.1); }
          .rd-hero h1 { font-size: 40px; font-weight: 800; color: #fff; margin: 0 0 16px; letter-spacing: -0.02em; max-width: 700px; position: relative; z-index: 1; line-height: 1.2; }
          .rd-hero-desc { font-size: 17px; color: rgba(255,255,255,0.8); max-width: 640px; line-height: 1.7; position: relative; z-index: 1; margin: 0; }
          .rd-hero-shapes { position: absolute; inset: 0; pointer-events: none; }
          .rd-hero-shapes .shape { position: absolute; border-radius: 50%; opacity: 0.06; }
          .rd-hero-shapes .shape-1 { width: 500px; height: 500px; background: #ed145b; top: -200px; right: -100px; }
          .rd-hero-shapes .shape-2 { width: 350px; height: 350px; background: #4044e6; bottom: -150px; left: -80px; }

          .rd-body { background: #0d0d1a; padding: 60px 0 100px; }
          .rd-grid { display: grid; grid-template-columns: 1fr 340px; gap: 48px; align-items: start; }
          .rd-main { min-width: 0; }

          .rd-section { margin-bottom: 40px; }
          .rd-section h2 { font-size: 22px; font-weight: 700; color: #fff; margin: 0 0 16px; }
          .rd-section p { font-size: 15px; color: rgba(255,255,255,0.6); line-height: 1.8; margin: 0; }

          .rd-features { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 14px; }
          .rd-features li { display: flex; align-items: flex-start; gap: 12px; font-size: 15px; color: rgba(255,255,255,0.7); line-height: 1.6; padding: 12px 16px; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06); border-radius: 10px; transition: border-color 0.2s; }
          .rd-features li:hover { border-color: rgba(16,185,129,0.3); }
          .rd-features li svg { flex-shrink: 0; margin-top: 2px; }

          .rd-who-for { display: flex; gap: 18px; align-items: flex-start; padding: 24px; background: linear-gradient(135deg, rgba(237,20,91,0.08), rgba(64,68,230,0.08)); border: 1px solid rgba(237,20,91,0.15); border-radius: 12px; }
          .rd-who-icon { flex-shrink: 0; width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; background: rgba(237,20,91,0.1); border-radius: 12px; }
          .rd-who-for h3 { font-size: 15px; font-weight: 700; color: #ed145b; margin: 0 0 6px; }
          .rd-who-for p { font-size: 14px; color: rgba(255,255,255,0.6); line-height: 1.7; margin: 0; }

          .rd-related-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
          .rd-related-card { display: block; padding: 20px; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.08); border-radius: 12px; text-decoration: none; transition: all 0.25s; }
          .rd-related-card:hover { border-color: rgba(237,20,91,0.3); transform: translateY(-2px); }
          .rd-related-type { display: flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 8px; }
          .rd-related-card h4 { font-size: 14px; font-weight: 600; color: #fff; margin: 0 0 6px; line-height: 1.4; }
          .rd-related-card p { font-size: 12px; color: rgba(255,255,255,0.45); line-height: 1.5; margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

          .rd-sidebar { position: sticky; top: 100px; }
          .rd-download-card { background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1); border-radius: 16px; padding: 32px 24px; text-align: center; margin-bottom: 20px; }
          .rd-download-icon { margin-bottom: 20px; }
          .rd-download-card h3 { font-size: 17px; font-weight: 700; color: #fff; margin: 0 0 12px; line-height: 1.4; }
          .rd-download-meta { display: flex; justify-content: center; gap: 16px; margin-bottom: 24px; font-size: 13px; color: rgba(255,255,255,0.4); }
          .rd-download-meta span { position: relative; }
          .rd-download-meta span:first-child::after { content: ''; position: absolute; right: -8px; top: 50%; width: 3px; height: 3px; background: rgba(255,255,255,0.3); border-radius: 50%; transform: translateY(-50%); }
          .rd-download-btn { display: inline-flex; align-items: center; gap: 10px; padding: 14px 36px; background: linear-gradient(135deg, #ed145b, #c41150); color: #fff; font-size: 15px; font-weight: 600; border-radius: 10px; text-decoration: none; transition: all 0.3s; width: 100%; justify-content: center; }
          .rd-download-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(237,20,91,0.4); }
          .rd-coming-soon { background: rgba(255,255,255,0.1); cursor: default; }
          .rd-coming-soon:hover { transform: none; box-shadow: none; }
          .rd-download-note { font-size: 12px; color: rgba(255,255,255,0.35); margin: 14px 0 0; }

          .rd-help-card { background: rgba(64,68,230,0.08); border: 1px solid rgba(64,68,230,0.2); border-radius: 16px; padding: 24px; }
          .rd-help-card h4 { font-size: 16px; font-weight: 700; color: #fff; margin: 0 0 8px; }
          .rd-help-card p { font-size: 13px; color: rgba(255,255,255,0.5); line-height: 1.6; margin: 0 0 18px; }
          .rd-help-btn { display: inline-block; padding: 10px 28px; border: 1px solid rgba(64,68,230,0.4); color: #7b7fff; font-size: 14px; font-weight: 600; border-radius: 8px; text-decoration: none; transition: all 0.2s; }
          .rd-help-btn:hover { background: rgba(64,68,230,0.15); border-color: rgba(64,68,230,0.6); }

          @media (max-width: 991px) {
            .rd-hero h1 { font-size: 32px; }
            .rd-grid { grid-template-columns: 1fr; }
            .rd-sidebar { position: static; display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
            .rd-related-grid { grid-template-columns: 1fr 1fr; }
          }
          @media (max-width: 576px) {
            .rd-hero { padding: 100px 0 40px; }
            .rd-hero h1 { font-size: 26px; }
            .rd-sidebar { grid-template-columns: 1fr; }
            .rd-related-grid { grid-template-columns: 1fr; }
            .rd-who-for { flex-direction: column; }
          }

          @media (max-width: 991px) {
            .res-hero h1 { font-size: 38px; }
            .res-stats-grid { grid-template-columns: repeat(2, 1fr); }
            .res-stat-item:nth-child(2) { border-right: none; }
            .res-cards-grid { grid-template-columns: repeat(2, 1fr); }
          }
          @media (max-width: 576px) {
            .res-hero { padding: 120px 0 70px; }
            .res-hero h1 { font-size: 30px; }
            .res-stats-grid { grid-template-columns: 1fr 1fr; }
            .res-cards-grid { grid-template-columns: 1fr; }
            .res-category-header h2 { font-size: 24px; }
            .res-cta-card { padding: 40px 24px; }
          }

          /* ============================================================
             TOOLS PAGE
             ============================================================ */
          .tools-hero {
            background: linear-gradient(57deg, #1a1a2e 0%, #4044e6 25%, #ed145b 50%, #4044e6 75%, #1a1a2e 100%);
            background-size: 400% 400%;
            animation: gradient-shift 15s ease infinite;
            padding: 140px 0 100px;
            text-align: center;
            position: relative;
            overflow: hidden;
          }
          .tools-hero h1 { font-size: 52px; font-weight: 800; color: #fff; margin: 0 0 20px; letter-spacing: -0.02em; position: relative; z-index: 1; }
          .tools-hero h1 span {
            background: linear-gradient(90deg, #fff, #00f5d4, #fff);
            background-size: 200% auto;
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
            animation: shimmer 3s linear infinite;
          }
          .tools-hero > .container > p { font-size: 18px; color: rgba(255,255,255,0.85); max-width: 620px; margin: 0 auto; line-height: 1.7; position: relative; z-index: 1; }
          .tools-hero-badge {
            display: inline-block;
            background: rgba(0,0,0,0.3);
            color: #fff;
            font-size: 12px;
            font-weight: 700;
            padding: 10px 24px;
            border-radius: 100px;
            margin-bottom: 28px;
            text-transform: uppercase;
            letter-spacing: 2.5px;
            border: 1px solid rgba(255,255,255,0.25);
            position: relative;
            z-index: 1;
          }
          .tools-hero-shapes { position: absolute; inset: 0; pointer-events: none; }
          .tools-hero-shapes .shape { position: absolute; border-radius: 50%; opacity: 0.08; }
          .tools-hero-shapes .shape-1 { width: 400px; height: 400px; background: #ed145b; top: -120px; right: -80px; }
          .tools-hero-shapes .shape-2 { width: 300px; height: 300px; background: #4044e6; bottom: -100px; left: -60px; }
          .tools-hero-shapes .shape-3 { width: 200px; height: 200px; background: #ed145b; top: 50%; left: 50%; transform: translate(-50%, -50%); }

          .tools-stats-bar { background: linear-gradient(135deg, #1a1f4e, #242a5c); padding: 0; border-bottom: 1px solid rgba(255,255,255,0.06); }
          .tools-stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
          .tools-stat-item { padding: 28px 20px; text-align: center; border-right: 1px solid rgba(255,255,255,0.06); }
          .tools-stat-item:last-child { border-right: none; }
          .tools-stat-value { font-size: 32px; font-weight: 800; color: #10b981; margin-bottom: 4px; letter-spacing: -0.02em; }
          .tools-stat-label { font-size: 13px; color: rgba(255,255,255,0.5); text-transform: uppercase; letter-spacing: 1px; font-weight: 500; }

          .tools-category-section { background: linear-gradient(180deg, #181d4a, #1e2455); padding: 70px 0 20px; }
          .tools-category-section:nth-child(odd) { background: linear-gradient(180deg, #1c2150, #22285a); }
          .tools-category-header { margin-bottom: 40px; }
          .tools-category-badge {
            display: inline-block;
            background: linear-gradient(135deg, rgba(237,20,91,0.15), rgba(237,20,91,0.05));
            color: #ed145b;
            font-size: 12px;
            font-weight: 700;
            padding: 8px 20px;
            border-radius: 100px;
            margin-bottom: 16px;
            text-transform: uppercase;
            letter-spacing: 1.5px;
            border: 1px solid rgba(237,20,91,0.25);
          }
          .tools-category-header h2 { font-size: 30px; font-weight: 700; color: #fff; margin: 0 0 12px; }
          .tools-category-header h2 span { color: #ed145b; }
          .tools-category-header p { font-size: 16px; color: rgba(255,255,255,0.55); line-height: 1.6; max-width: 700px; }

          .tools-cards-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; padding-bottom: 40px; }

          .tools-card {
            background: linear-gradient(145deg, rgba(255,255,255,0.05), rgba(255,255,255,0.01));
            border: 1px solid rgba(255,255,255,0.08);
            border-radius: 16px;
            padding: 28px;
            transition: all 0.3s ease;
            display: flex;
            flex-direction: column;
          }
          .tools-card:hover { border-color: rgba(237,20,91,0.3); transform: translateY(-4px); box-shadow: 0 12px 40px rgba(0,0,0,0.3); }
          .tools-card-badge {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 48px;
            height: 48px;
            background: linear-gradient(135deg, rgba(237,20,91,0.15), rgba(237,20,91,0.05));
            color: #ed145b;
            font-size: 11px;
            font-weight: 800;
            border-radius: 12px;
            margin-bottom: 20px;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            border: 1px solid rgba(237,20,91,0.2);
          }
          .tools-card h3 { font-size: 17px; font-weight: 600; color: #fff; margin: 0 0 10px; line-height: 1.4; }
          .tools-card p { font-size: 14px; color: rgba(255,255,255,0.5); line-height: 1.6; margin: 0; flex: 1; }
          .tools-use-btn {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            margin-top: 22px;
            padding: 10px 24px;
            background: #ed145b;
            color: #fff;
            font-size: 13px;
            font-weight: 600;
            border-radius: 100px;
            text-decoration: none;
            transition: all 0.3s;
            align-self: flex-start;
          }
          .tools-use-btn:hover { background: #d41154; transform: translateY(-2px); box-shadow: 0 6px 20px rgba(237,20,91,0.3); }
          .tools-use-btn svg { transition: transform 0.2s; }
          .tools-card:hover .tools-use-btn svg { transform: translateX(4px); }

          .tools-cta-section { background: linear-gradient(180deg, #1e2455, #181d4a); padding: 40px 0 100px; }
          .tools-cta-card {
            max-width: 700px;
            margin: 0 auto;
            text-align: center;
            background: linear-gradient(135deg, rgba(237,20,91,0.08), rgba(64,68,230,0.08));
            border: 1px solid rgba(237,20,91,0.2);
            border-radius: 20px;
            padding: 60px 40px;
          }
          .tools-cta-card h2 { font-size: 28px; font-weight: 700; color: #fff; margin: 0 0 12px; }
          .tools-cta-card p { font-size: 16px; color: rgba(255,255,255,0.6); margin: 0 0 32px; line-height: 1.6; }
          .tools-cta-buttons { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }
          .tools-cta-primary {
            display: inline-block;
            padding: 14px 36px;
            background: #ed145b;
            color: #fff;
            font-size: 15px;
            font-weight: 600;
            border-radius: 100px;
            text-decoration: none;
            transition: all 0.3s;
          }
          .tools-cta-primary:hover { background: #d41154; transform: translateY(-2px); box-shadow: 0 8px 24px rgba(237,20,91,0.3); }
          .tools-cta-secondary {
            display: inline-block;
            padding: 14px 36px;
            background: transparent;
            color: #fff;
            font-size: 15px;
            font-weight: 600;
            border-radius: 100px;
            text-decoration: none;
            border: 1px solid rgba(255,255,255,0.2);
            transition: all 0.3s;
          }
          .tools-cta-secondary:hover { border-color: rgba(255,255,255,0.5); background: rgba(255,255,255,0.05); }

          @media (max-width: 991px) {
            .tools-hero h1 { font-size: 38px; }
            .tools-stats-grid { grid-template-columns: repeat(2, 1fr); }
            .tools-stat-item:nth-child(2) { border-right: none; }
            .tools-cards-grid { grid-template-columns: repeat(2, 1fr); }
          }
          @media (max-width: 576px) {
            .tools-hero { padding: 120px 0 70px; }
            .tools-hero h1 { font-size: 30px; }
            .tools-stats-grid { grid-template-columns: 1fr 1fr; }
            .tools-cards-grid { grid-template-columns: 1fr; }
            .tools-category-header h2 { font-size: 24px; }
            .tools-cta-card { padding: 40px 24px; }
          }

          /* ============================================
             INTERACTIVE TOOL PAGES
             ============================================ */
          .tool-hero {
            position: relative; padding: 160px 0 80px; background: linear-gradient(135deg, #0d0d1a 0%, #141428 50%, #0d0d1a 100%);
            text-align: center; overflow: hidden;
          }
          .tool-hero h1 { font-size: 48px; font-weight: 800; color: #fff; margin: 0 0 20px; letter-spacing: -0.02em; }
          .tool-hero h1 span { color: #ed145b; }
          .tool-hero > .container > p { font-size: 18px; color: rgba(255,255,255,0.65); max-width: 620px; margin: 0 auto; line-height: 1.7; }
          .tool-hero-badge {
            display: inline-block; padding: 6px 18px; background: rgba(237,20,91,0.15); border: 1px solid rgba(237,20,91,0.3);
            border-radius: 20px; font-size: 13px; font-weight: 600; color: #ed145b; margin-bottom: 20px;
            text-transform: uppercase; letter-spacing: 1px;
          }
          .tool-hero-shapes { position: absolute; inset: 0; pointer-events: none; }
          .tool-hero-shapes .shape { position: absolute; border-radius: 50%; opacity: 0.08; }
          .tool-hero-shapes .shape-1 { width: 400px; height: 400px; background: #ed145b; top: -120px; right: -80px; }
          .tool-hero-shapes .shape-2 { width: 300px; height: 300px; background: #4044e6; bottom: -100px; left: -60px; }
          .tool-hero-shapes .shape-3 { width: 200px; height: 200px; background: #ed145b; top: 50%; left: 50%; transform: translate(-50%, -50%); }

          .tool-section { padding: 60px 0; background: #0d0d1a; }
          .tool-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: start; }
          .tool-input-panel, .tool-result-panel {
            background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1);
            border-radius: 16px; padding: 32px;
          }
          .tool-input-panel h2, .tool-result-panel h2 { font-size: 20px; font-weight: 700; color: #fff; margin-bottom: 24px; }
          .tool-field { margin-bottom: 20px; }
          .tool-field label { display: block; font-size: 13px; font-weight: 600; color: rgba(255,255,255,0.7); margin-bottom: 6px; }
          .tool-input-wrap {
            display: flex; align-items: center; background: rgba(255,255,255,0.06);
            border: 1px solid rgba(255,255,255,0.15); border-radius: 8px; overflow: hidden; transition: border-color 0.2s;
          }
          .tool-input-wrap:focus-within { border-color: #ed145b; }
          .tool-prefix, .tool-suffix { padding: 0 14px; font-size: 15px; font-weight: 600; color: rgba(255,255,255,0.5); background: rgba(255,255,255,0.04); display: flex; align-items: center; }
          .tool-input-wrap input {
            flex: 1; background: transparent; border: none; outline: none;
            padding: 12px 14px; font-size: 16px; color: #fff; font-family: inherit;
          }
          .tool-input-wrap input::placeholder { color: rgba(255,255,255,0.3); }
          .tool-hint { display: block; font-size: 12px; color: #ed145b; margin-top: 4px; min-height: 18px; }

          .tool-radio-group { display: flex; flex-direction: column; gap: 8px; }
          .tool-radio {
            display: flex; align-items: center; gap: 12px; padding: 12px 16px;
            background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1);
            border-radius: 8px; cursor: pointer; transition: all 0.2s;
          }
          .tool-radio:hover { border-color: rgba(237,20,91,0.3); }
          .tool-radio input[type="radio"] {
            -webkit-appearance: none; -moz-appearance: none; appearance: none;
            width: 18px; height: 18px; min-width: 18px; min-height: 18px;
            border: 2px solid rgba(255,255,255,0.3); border-radius: 50%; flex-shrink: 0;
            margin: 0; position: relative; cursor: pointer; transition: border-color 0.2s;
            background: transparent; display: inline-block; box-sizing: border-box;
          }
          .tool-radio input[type="radio"]:checked { border-color: #ed145b; }
          .tool-radio input[type="radio"]:checked::after {
            content: ''; position: absolute; top: 3px; left: 3px;
            width: 8px; height: 8px; background: #ed145b; border-radius: 50%;
          }
          .tool-radio-content { display: flex; flex-direction: column; }
          .tool-radio-title { font-size: 14px; font-weight: 600; color: rgba(255,255,255,0.9); }
          .tool-radio-desc { font-size: 12px; color: rgba(255,255,255,0.45); margin-top: 2px; }

          .tool-checkbox-group { display: flex; flex-wrap: wrap; gap: 8px; }
          .tool-checkbox {
            display: flex; align-items: center; gap: 8px; padding: 10px 14px;
            background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1);
            border-radius: 8px; cursor: pointer; transition: all 0.2s; flex: 0 0 calc(50% - 4px);
          }
          @media (max-width: 600px) { .tool-checkbox { flex: 0 0 100%; } }
          .tool-checkbox:hover { border-color: rgba(237,20,91,0.3); }
          .tool-checkbox input[type="checkbox"] {
            -webkit-appearance: none; -moz-appearance: none; appearance: none;
            width: 18px; height: 18px; min-width: 18px; min-height: 18px;
            border: 2px solid rgba(255,255,255,0.3); border-radius: 4px; flex-shrink: 0;
            margin: 0; position: relative; cursor: pointer; transition: all 0.2s;
            background: transparent; display: inline-block; box-sizing: border-box;
          }
          .tool-checkbox input[type="checkbox"]:checked { border-color: #ed145b; background: #ed145b; }
          .tool-checkbox input[type="checkbox"]:checked::after {
            content: ''; position: absolute; top: 1px; left: 5px;
            width: 5px; height: 9px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg);
          }
          .tool-checkbox span { font-size: 13px; color: rgba(255,255,255,0.8); }

          .tool-calc-btn {
            display: flex; align-items: center; justify-content: center; gap: 8px;
            width: 100%; padding: 14px 24px; background: linear-gradient(135deg, #ed145b, #ff4081);
            color: #fff; font-size: 15px; font-weight: 700; border: none; border-radius: 10px;
            cursor: pointer; transition: transform 0.2s, box-shadow 0.2s; font-family: inherit; margin-top: 8px;
          }
          .tool-calc-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(237,20,91,0.3); }

          .tool-result-total {
            background: linear-gradient(135deg, rgba(237,20,91,0.15), rgba(255,64,129,0.1));
            border: 1px solid rgba(237,20,91,0.3); border-radius: 12px; padding: 24px; text-align: center; margin-bottom: 20px;
          }
          .tool-result-label { display: block; font-size: 13px; color: rgba(255,255,255,0.6); margin-bottom: 6px; text-transform: uppercase; letter-spacing: 1px; }
          .tool-result-value { display: block; font-size: 40px; font-weight: 800; color: #ed145b; letter-spacing: -1px; }

          .tool-result-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 20px; }
          .tool-result-stat { background: rgba(255,255,255,0.04); border-radius: 8px; padding: 14px; text-align: center; }
          .tool-result-stat span:first-child { display: block; font-size: 11px; color: rgba(255,255,255,0.5); margin-bottom: 4px; text-transform: uppercase; letter-spacing: 0.5px; }
          .tool-result-stat span:last-child { display: block; font-size: 18px; font-weight: 700; color: #fff; }

          .tool-breakdown { margin-bottom: 20px; }
          .tool-breakdown h4 { font-size: 13px; color: rgba(255,255,255,0.6); margin-bottom: 10px; text-transform: uppercase; letter-spacing: 0.5px; }
          .tool-breakdown-row {
            display: flex; justify-content: space-between; align-items: center;
            padding: 10px 14px; border-bottom: 1px solid rgba(255,255,255,0.06); font-size: 13px;
          }
          .tool-breakdown-row span:first-child { color: rgba(255,255,255,0.7); flex: 1; }
          .tool-breakdown-row span:nth-child(2) { color: #ed145b; font-weight: 600; width: 60px; text-align: center; }
          .tool-breakdown-row span:last-child { color: #fff; font-weight: 600; width: 100px; text-align: right; }

          .tool-info-box {
            background: rgba(64,68,230,0.08); border: 1px solid rgba(64,68,230,0.2);
            border-radius: 10px; padding: 18px; margin-top: 16px;
          }
          .tool-info-box h4 { font-size: 13px; font-weight: 700; color: #818cf8; margin-bottom: 8px; }
          .tool-info-box p { font-size: 12px; color: rgba(255,255,255,0.6); line-height: 1.6; }

          .tool-ref-section { padding: 60px 0; background: #0f0f20; }
          .tool-rates-table {
            background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1);
            border-radius: 16px; padding: 32px; overflow-x: auto;
          }
          .tool-rates-table h2 { font-size: 20px; font-weight: 700; color: #fff; margin-bottom: 20px; }
          .tool-rates-table table { width: 100%; border-collapse: collapse; }
          .tool-rates-table th {
            background: rgba(237,20,91,0.15); color: #ed145b; padding: 12px 16px; text-align: left;
            font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px;
          }
          .tool-rates-table td { padding: 12px 16px; color: rgba(255,255,255,0.8); font-size: 13px; border-bottom: 1px solid rgba(255,255,255,0.06); }
          .tool-rates-table tr:hover td { background: rgba(255,255,255,0.03); }

          .tool-bottom-cta { background: #0d0d1a; padding: 40px 0 100px; }

          /* Enhanced results */
          .tool-enhanced-results {
            margin-top: 40px;
            background: linear-gradient(135deg, rgba(30,40,60,0.95) 0%, rgba(20,30,50,0.98) 100%);
            border: 1px solid rgba(237,20,91,0.15); border-radius: 20px; padding: 36px;
            box-shadow: 0 20px 60px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.05);
          }
          .tool-enhanced-heading {
            font-size: 22px; font-weight: 800; color: #ed145b; margin-bottom: 28px;
            position: relative; padding-bottom: 16px;
          }
          .tool-enhanced-heading::after {
            content: ''; position: absolute; bottom: 0; left: 0; width: 60px; height: 3px;
            background: linear-gradient(90deg, #ed145b, #4044e6); border-radius: 2px;
          }
          .tool-enhanced-card {
            background: rgba(30,40,60,0.5); border: 1px solid rgba(237,20,91,0.12);
            border-radius: 12px; padding: 24px; margin-bottom: 20px;
          }
          .tool-enhanced-card h3 {
            font-size: 15px; font-weight: 700; color: #ed145b; margin-bottom: 16px;
            padding-left: 12px; border-left: 3px solid #ed145b;
          }
          .tool-enhanced-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 20px; }
          .tool-enhanced-stat-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
          .tool-enhanced-results .tool-result-stat {
            background: rgba(237,20,91,0.06); border: 1px solid rgba(237,20,91,0.2);
            border-radius: 12px; padding: 20px; text-align: center;
          }
          .tool-enhanced-results .tool-result-stat span:first-child { display: block; font-size: 12px; color: rgba(255,255,255,0.55); text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 6px; }
          .tool-enhanced-results .tool-result-stat span:last-child { display: block; font-size: 22px; font-weight: 800; color: #fff; }
          .tool-enhanced-results .tool-breakdown-row { border-bottom-color: rgba(237,20,91,0.08); }

          .tool-card-desc { font-size: 13px; color: rgba(255,255,255,0.5); margin: -8px 0 16px; }
          .tool-split-bar { display: flex; height: 32px; border-radius: 8px; overflow: hidden; margin-bottom: 12px; background: rgba(255,255,255,0.06); }
          .tool-split-fill { transition: width 0.6s ease; display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; color: #0a0a0a; }
          .tool-split-legend { display: flex; gap: 16px; flex-wrap: wrap; font-size: 12px; color: rgba(255,255,255,0.65); }
          .tool-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 6px; vertical-align: middle; }

          .tool-stress-box { background: rgba(251,191,36,0.06); border: 1px solid rgba(251,191,36,0.2); border-radius: 12px; padding: 20px; }
          .tool-stress-box h4 { font-size: 13px; font-weight: 700; color: #fbbf24; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 1px solid rgba(251,191,36,0.15); }

          .tool-sdlt-note { font-size: 12px; color: rgba(255,255,255,0.45); margin-top: 10px; line-height: 1.6; }

          .tool-chart-row { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
          .tool-chart-label { font-size: 13px; font-weight: 700; color: #60a5fa; text-align: right; flex-shrink: 0; }
          .tool-chart-bar-wrap { flex: 1; height: 28px; background: rgba(255,255,255,0.06); border-radius: 4px; overflow: hidden; position: relative; }
          .tool-chart-bar { height: 100%; border-radius: 4px; transition: width 0.6s ease; min-width: 2px; }
          .tool-chart-value { font-size: 13px; font-weight: 600; color: rgba(255,255,255,0.85); text-align: right; flex-shrink: 0; }

          .tool-cta-card {
            margin-top: 4px; margin-bottom: 20px;
            background: linear-gradient(135deg, rgba(237,20,91,0.12) 0%, rgba(255,64,129,0.08) 100%);
            border: 1px solid rgba(237,20,91,0.3); border-radius: 14px; padding: 28px;
          }
          .tool-cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
          .tool-cta-text h3 { font-size: 18px; font-weight: 700; color: #fff; margin-bottom: 6px; border: none; padding: 0; }
          .tool-cta-text p { font-size: 13px; color: rgba(255,255,255,0.6); }
          .tool-cta-btn {
            display: inline-flex; align-items: center; gap: 8px; padding: 14px 28px;
            background: linear-gradient(135deg, #ed145b, #ff4081); color: #fff; font-size: 15px;
            font-weight: 700; border-radius: 10px; text-decoration: none; white-space: nowrap;
            transition: transform 0.2s, box-shadow 0.2s;
          }
          .tool-cta-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(237,20,91,0.3); }

          .tool-slider-row { display: flex; flex-direction: column; gap: 8px; }
          .tool-slider-row input[type="range"] {
            -webkit-appearance: none; appearance: none; width: 100%; height: 6px;
            background: rgba(255,255,255,0.1); border-radius: 3px; cursor: pointer; outline: none;
          }
          .tool-slider-row input[type="range"]::-webkit-slider-thumb {
            -webkit-appearance: none; appearance: none; width: 20px; height: 20px;
            background: #ed145b; border-radius: 50%; cursor: pointer;
            box-shadow: 0 2px 8px rgba(237,20,91,0.4); transition: transform 0.15s, box-shadow 0.15s;
          }
          .tool-slider-row input[type="range"]::-webkit-slider-thumb:hover { transform: scale(1.15); box-shadow: 0 2px 12px rgba(237,20,91,0.6); }
          .tool-slider-row input[type="range"]::-moz-range-thumb {
            width: 20px; height: 20px; background: #ed145b; border: none;
            border-radius: 50%; cursor: pointer; box-shadow: 0 2px 8px rgba(237,20,91,0.4);
          }
          .tool-slider-row input[type="range"]::-moz-range-track { height: 6px; background: rgba(255,255,255,0.1); border-radius: 3px; border: none; }
          .tool-slider-values { display: flex; align-items: center; gap: 10px; }
          .tool-slider-badge {
            display: inline-block; background: rgba(237,20,91,0.15); color: #ed145b;
            font-size: 13px; font-weight: 700; padding: 3px 10px; border-radius: 6px;
            border: 1px solid rgba(237,20,91,0.25); min-width: 48px; text-align: center;
          }
          .tool-slider-amt { font-size: 13px; color: rgba(255,255,255,0.5); }

          @media (max-width: 768px) {
            .tool-hero h1 { font-size: 32px; }
            .tool-layout { grid-template-columns: 1fr; gap: 30px; }
            .tool-enhanced-results { padding: 24px; border-radius: 16px; }
            .tool-enhanced-row { grid-template-columns: 1fr; }
            .tool-cta-inner { flex-direction: column; text-align: center; }
          }
          /* END INTERACTIVE TOOL PAGES */

          /* SEO Service Page */
          .seo-stats-bar { background: #1a1a2e; padding: 60px 0; }
          .seo-stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; text-align: center; }
          .seo-stat-item { position: relative; }
          .seo-stat-item:not(:last-child)::after {
            content: ''; position: absolute; right: 0; top: 15%; height: 70%; width: 1px;
            background: linear-gradient(180deg, transparent, rgba(237,20,91,0.3), transparent);
          }
          .seo-stat-number { font-size: 52px; font-weight: 800; color: #fff; line-height: 1.1; margin-bottom: 8px; font-family: 'Outfit', sans-serif; }
          .seo-stat-label { font-size: 14px; color: rgba(255,255,255,0.5); text-transform: uppercase; letter-spacing: 1.5px; font-weight: 500; }

          .seo-services-section { padding: 5rem 0; background: #f7f7fa; }
          .seo-services-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
          .seo-service-card {
            background: #fff; border-radius: 16px; padding: 36px 28px; border: 1px solid rgba(0,0,0,0.06);
            transition: all 0.4s ease; position: relative; overflow: hidden;
          }
          .seo-service-card::before {
            content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
            background: linear-gradient(90deg, #4044e6, #ed145b); opacity: 0; transition: opacity 0.4s;
          }
          .seo-service-card:hover { transform: translateY(-6px); box-shadow: 0 20px 50px rgba(0,0,0,0.08); }
          .seo-service-card:hover::before { opacity: 1; }
          .seo-service-icon {
            width: 56px; height: 56px; border-radius: 14px; display: flex;
            align-items: center; justify-content: center; margin-bottom: 20px;
          }
          .seo-service-card h4 { font-size: 1.15rem; font-weight: 700; margin: 0 0 12px; color: #1a1a2e; }
          .seo-service-card p { font-size: 0.88rem; color: #666; line-height: 1.65; margin: 0; }

          .seo-advantages-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }

          .seo-platforms-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px; }
          .seo-platform-card {
            background: #f7f7fa; border-radius: 16px; padding: 28px 20px; text-align: center;
            border: 1px solid rgba(0,0,0,0.06); transition: all 0.4s ease;
          }
          .seo-platform-card:hover { transform: translateY(-4px); box-shadow: 0 12px 30px rgba(0,0,0,0.06); }
          .seo-platform-icon {
            width: 56px; height: 56px; border-radius: 14px; display: flex;
            align-items: center; justify-content: center; margin: 0 auto 16px;
          }
          .seo-platform-card h4 { font-size: 1rem; margin: 0 0 8px; font-weight: 700; }
          .seo-platform-card p { font-size: 0.82rem; color: #666; line-height: 1.55; margin: 0; }

          @media (max-width: 991px) {
            .seo-stats-grid { grid-template-columns: repeat(2, 1fr); gap: 24px; }
            .seo-stat-item:nth-child(2)::after { display: none; }
            .seo-stat-number { font-size: 40px; }
            .seo-services-grid { grid-template-columns: repeat(2, 1fr); }
            .seo-advantages-grid { grid-template-columns: repeat(2, 1fr); }
            .seo-platforms-grid { grid-template-columns: repeat(3, 1fr); }
          }
          @media (max-width: 576px) {
            .seo-stats-grid { grid-template-columns: 1fr 1fr; gap: 20px; }
            .seo-stat-number { font-size: 34px; }
            .seo-stat-label { font-size: 12px; }
            .seo-services-grid { grid-template-columns: 1fr; }
            .seo-advantages-grid { grid-template-columns: 1fr; }
            .seo-platforms-grid { grid-template-columns: 1fr 1fr; }
          }

          /* Google Ads Service Page */
          .ga-stats-bar {
            background: linear-gradient(135deg, #1a1a2e 0%, #292524 50%, #1a1a2e 100%);
            padding: 60px 0; position: relative; overflow: hidden;
          }
          .ga-stats-bar::before {
            content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
            background: linear-gradient(90deg, #e8710a, #f59e0b, #e8710a);
          }
          .ga-stats-bar .seo-stat-item:not(:last-child)::after {
            background: linear-gradient(180deg, transparent, rgba(232,113,10,0.3), transparent);
          }

          .ga-services-section { padding: 5rem 0; background: #fffbf5; }
          .ga-services-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
          .ga-service-card {
            background: #fff; border-radius: 16px; padding: 36px 28px;
            border: 1px solid rgba(0,0,0,0.06); border-left: 4px solid transparent;
            transition: all 0.4s ease; position: relative; overflow: hidden;
          }
          .ga-service-card:hover {
            transform: translateY(-6px); box-shadow: 0 20px 50px rgba(0,0,0,0.08);
            border-left-color: #e8710a;
          }
          .ga-service-num {
            font-size: 2.2rem; font-weight: 800; font-family: 'Outfit', sans-serif;
            line-height: 1; margin-bottom: 14px; opacity: 0.8;
          }
          .ga-service-card h4 { font-size: 1.15rem; font-weight: 700; margin: 0 0 12px; color: #1a1a2e; }
          .ga-service-card p { font-size: 0.88rem; color: #666; line-height: 1.65; margin: 0; }

          .img-shadow-orange { position: relative; }
          .img-shadow-orange::after {
            content: ''; position: absolute; bottom: -12px; right: -12px;
            width: 100%; height: 100%; border-radius: 8px; z-index: -1;
            background: linear-gradient(135deg, #e8710a, #f59e0b);
          }
          .img-shadow-orange img { border-radius: 8px; position: relative; z-index: 1; }

          @media (max-width: 991px) {
            .ga-services-grid { grid-template-columns: repeat(2, 1fr); }
          }
          @media (max-width: 576px) {
            .ga-services-grid { grid-template-columns: 1fr; }
          }

          /* ---- Connectivity & Internet Page ---- */
          .conn-stats-bar {
            background: linear-gradient(135deg, #0f172a 0%, #164e63 50%, #0f172a 100%);
            padding: 60px 0; position: relative; overflow: hidden;
          }
          .conn-stats-bar::before {
            content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
            background: linear-gradient(90deg, #0891b2, #22d3ee, #0891b2);
          }
          .conn-stats-bar .seo-stat-item:not(:last-child)::after {
            background: linear-gradient(180deg, transparent, rgba(8,145,178,0.3), transparent);
          }

          .conn-products-section { padding: 5rem 0; background: #f0fdfa; }
          .conn-products-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; align-items: start; }
          .conn-product-card {
            background: #fff; border-radius: 20px; overflow: hidden;
            border: 1px solid rgba(0,0,0,0.06);
            transition: all 0.4s ease; position: relative;
            display: flex; flex-direction: column;
          }
          .conn-product-card:hover { transform: translateY(-8px); box-shadow: 0 24px 60px rgba(0,0,0,0.1); }
          .conn-product-card--featured { border: 2px solid #059669; transform: scale(1.03); }
          .conn-product-card--featured:hover { transform: scale(1.03) translateY(-8px); }
          .conn-product-badge {
            position: absolute; top: 16px; right: 16px;
            color: #fff; font-size: 0.75rem; font-weight: 700; text-transform: uppercase;
            padding: 5px 14px; border-radius: 20px; letter-spacing: 0.05em;
          }
          .conn-product-header { padding: 36px 28px 20px; text-align: center; }
          .conn-product-icon {
            width: 64px; height: 64px; border-radius: 50%; margin: 0 auto 18px;
            display: flex; align-items: center; justify-content: center;
          }
          .conn-product-header h3 { font-size: 1.3rem; font-weight: 700; color: #1a1a2e; margin: 0 0 8px; }
          .conn-product-speed { font-size: 0.95rem; color: #666; margin: 0; }
          .conn-product-speed strong { color: #0891b2; font-size: 1.2rem; }
          .conn-product-body { padding: 0 28px 24px; flex: 1; }
          .conn-product-body > p { font-size: 0.88rem; color: #555; line-height: 1.7; margin: 0 0 20px; }
          .conn-product-features { list-style: none; padding: 0; margin: 0; }
          .conn-product-features li {
            display: flex; align-items: flex-start; gap: 10px;
            font-size: 0.88rem; color: #444; padding: 7px 0; line-height: 1.5;
          }
          .conn-product-cta {
            display: flex; align-items: center; justify-content: center; gap: 8px;
            margin: 0 28px 28px; padding: 14px 0;
            border: 2px solid #0891b2; border-radius: 12px;
            color: #0891b2; font-weight: 600; font-size: 0.95rem;
            text-decoration: none; transition: all 0.3s ease;
          }
          .conn-product-cta:hover { background: #0891b2; color: #fff; }
          .conn-product-cta--featured { background: #059669; border-color: #059669; color: #fff; }
          .conn-product-cta--featured:hover { background: #047857; border-color: #047857; }

          .conn-partnership {
            padding: 4rem 0;
            background: linear-gradient(135deg, #f0fdfa, #ecfdf5);
            border-top: 1px solid rgba(8,145,178,0.1);
            border-bottom: 1px solid rgba(8,145,178,0.1);
          }
          .conn-partnership-inner {
            display: flex; align-items: center; gap: 48px;
            background: #fff; border-radius: 20px; padding: 40px 48px;
            border: 1px solid rgba(8,145,178,0.15);
            box-shadow: 0 8px 32px rgba(8,145,178,0.06);
          }
          .conn-partnership-text { flex: 1; }
          .conn-partnership-text h3 { font-size: 1.35rem; font-weight: 700; color: #1a1a2e; margin: 0 0 12px; }
          .conn-partnership-text p { font-size: 0.92rem; color: #555; line-height: 1.7; margin: 0; }
          .conn-partnership-badges { display: flex; flex-direction: column; gap: 16px; min-width: 220px; }
          .conn-badge {
            display: flex; align-items: center; gap: 12px;
            color: #0891b2; font-size: 0.88rem; font-weight: 600;
          }

          .img-shadow-teal { position: relative; }
          .img-shadow-teal::after {
            content: ''; position: absolute; bottom: -12px; right: -12px;
            width: 100%; height: 100%; border-radius: 8px; z-index: -1;
            background: linear-gradient(135deg, #0891b2, #22d3ee);
          }
          .img-shadow-teal img { border-radius: 8px; position: relative; z-index: 1; }

          @media (max-width: 991px) {
            .conn-products-grid { grid-template-columns: 1fr; max-width: 480px; margin: 0 auto; }
            .conn-product-card--featured { transform: none; }
            .conn-product-card--featured:hover { transform: translateY(-8px); }
            .conn-partnership-inner { flex-direction: column; text-align: center; padding: 32px 28px; }
            .conn-partnership-badges { flex-direction: row; flex-wrap: wrap; justify-content: center; min-width: unset; }
          }

          /* ---- VoIP & Phone Systems Page ---- */
          .voip-stats-bar {
            background: linear-gradient(135deg, #0f172a 0%, #4c1d95 50%, #0f172a 100%);
            padding: 60px 0; position: relative; overflow: hidden;
          }
          .voip-stats-bar::before {
            content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
            background: linear-gradient(90deg, #7c3aed, #a78bfa, #7c3aed);
          }
          .voip-stats-bar .seo-stat-item:not(:last-child)::after {
            background: linear-gradient(180deg, transparent, rgba(124,58,237,0.3), transparent);
          }

          .voip-products-section { padding: 5rem 0; background: #f5f3ff; }
          .voip-products-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; align-items: start; }
          .voip-product-card {
            background: #fff; border-radius: 20px; overflow: hidden;
            border: 1px solid rgba(0,0,0,0.06);
            transition: all 0.4s ease; position: relative;
            display: flex; flex-direction: column;
          }
          .voip-product-card:hover { transform: translateY(-8px); box-shadow: 0 24px 60px rgba(0,0,0,0.1); }
          .voip-product-card--featured { border: 2px solid #2563eb; transform: scale(1.03); }
          .voip-product-card--featured:hover { transform: scale(1.03) translateY(-8px); }
          .voip-product-badge {
            position: absolute; top: 16px; right: 16px;
            color: #fff; font-size: 0.75rem; font-weight: 700; text-transform: uppercase;
            padding: 5px 14px; border-radius: 20px; letter-spacing: 0.05em;
          }
          .voip-product-header { padding: 36px 28px 20px; text-align: center; }
          .voip-product-icon {
            width: 64px; height: 64px; border-radius: 50%; margin: 0 auto 18px;
            display: flex; align-items: center; justify-content: center;
          }
          .voip-product-header h3 { font-size: 1.3rem; font-weight: 700; color: #1a1a2e; margin: 0 0 8px; }
          .voip-product-speed { font-size: 0.95rem; color: #666; margin: 0; }
          .voip-product-speed strong { color: #7c3aed; font-size: 1.2rem; }
          .voip-product-body { padding: 0 28px 24px; flex: 1; }
          .voip-product-body > p { font-size: 0.88rem; color: #555; line-height: 1.7; margin: 0 0 20px; }
          .voip-product-features { list-style: none; padding: 0; margin: 0; }
          .voip-product-features li {
            display: flex; align-items: flex-start; gap: 10px;
            font-size: 0.88rem; color: #444; padding: 7px 0; line-height: 1.5;
          }
          .voip-product-cta {
            display: flex; align-items: center; justify-content: center; gap: 8px;
            margin: 0 28px 28px; padding: 14px 0;
            border: 2px solid #7c3aed; border-radius: 12px;
            color: #7c3aed; font-weight: 600; font-size: 0.95rem;
            text-decoration: none; transition: all 0.3s ease;
          }
          .voip-product-cta:hover { background: #7c3aed; color: #fff; }
          .voip-product-cta--featured { background: #2563eb; border-color: #2563eb; color: #fff; }
          .voip-product-cta--featured:hover { background: #1d4ed8; border-color: #1d4ed8; }

          .voip-partnership {
            padding: 4rem 0;
            background: linear-gradient(135deg, #f5f3ff, #ede9fe);
            border-top: 1px solid rgba(124,58,237,0.1);
            border-bottom: 1px solid rgba(124,58,237,0.1);
          }
          .voip-partnership-inner {
            display: flex; align-items: center; gap: 48px;
            background: #fff; border-radius: 20px; padding: 40px 48px;
            border: 1px solid rgba(124,58,237,0.15);
            box-shadow: 0 8px 32px rgba(124,58,237,0.06);
          }
          .voip-partnership-text { flex: 1; }
          .voip-partnership-text h3 { font-size: 1.35rem; font-weight: 700; color: #1a1a2e; margin: 0 0 12px; }
          .voip-partnership-text p { font-size: 0.92rem; color: #555; line-height: 1.7; margin: 0; }
          .voip-partnership-badges { display: flex; flex-direction: column; gap: 16px; min-width: 220px; }
          .voip-badge {
            display: flex; align-items: center; gap: 12px;
            color: #7c3aed; font-size: 0.88rem; font-weight: 600;
          }

          .img-shadow-violet { position: relative; }
          .img-shadow-violet::after {
            content: ''; position: absolute; bottom: -12px; right: -12px;
            width: 100%; height: 100%; border-radius: 8px; z-index: -1;
            background: linear-gradient(135deg, #7c3aed, #a78bfa);
          }
          .img-shadow-violet img { border-radius: 8px; position: relative; z-index: 1; }

          @media (max-width: 991px) {
            .voip-products-grid { grid-template-columns: 1fr; max-width: 480px; margin: 0 auto; }
            .voip-product-card--featured { transform: none; }
            .voip-product-card--featured:hover { transform: translateY(-8px); }
            .voip-partnership-inner { flex-direction: column; text-align: center; padding: 32px 28px; }
            .voip-partnership-badges { flex-direction: row; flex-wrap: wrap; justify-content: center; min-width: unset; }
          }