#preloader {
  position: fixed;
  inset: 0;
  background: #fff; /* match your site's background */
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  transition: opacity 0.4s ease, visibility 0.4s ease;
}

#preloader.hidden {
  opacity: 0;
  visibility: hidden;
}

#preloader .loader-gif {
  width: 500px;   /* adjust to your gif's natural size */
  height: auto;
}
:root{
    --bs-border-color: #c2c2c2;
    --brand-primary: #0b1f4c;
    --brand-dark:    #0a0a0a;
    --brand-muted:   #0b1f4c;
    --brand-bgLight: #f9fafb;
    --sl-100:    #f1f5f9;
    --sl-200:    #e2e8f0;
    --sl-400:    #94a3b8;
    --sl-500:    #64748b;
    --sl-600:    #475569;
    --sl-700:    #334155;
    --sl-900:    #0f172a;
    --brand-primary-light:  #eff6ff;
    --brand-primary-border: #dbeafe;
    --orange:      #f97316;
    --orange-bg:   rgba(255,237,213,0.5);
    --orange-bdr:  #fed7aa;
    --green:       #16a34a;
    --gray-50:     #f9fafb;
    --gray-100:    #f3f4f6;
    --gray-200:    #e5e7eb;
    --gray-400:    #9ca3af;
    --gray-500:    #6b7280;
    --gray-600:    #4b5563;
    --gray-700:    #374151;
    --gray-900:    #111827;
    --color-teal: #0ABCD8;
    --color-teal-light: #F5FEFF;
    --color-bg-section: #FAFAFA;
    --color-bg-dark: #1F3159;
    --color-text-muted: #969494;
    --color-border: #EDEDED;
    --color-red: #FF0000;
}
* {
    box-sizing: border-box
}
a,
a.active,
a:active,
a:focus,
a:hover{
    text-decoration: none;
    cursor: pointer
}
*,
:after,
:before,
ul.c-list li:before {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}
body,
html,
select,.scrol {
    scrollbar-color: rgba(var(--dark-color), 1) transparent;
    scrollbar-width: 8px;
    scroll-behavior: smooth;
    scrollbar-width: thin;
}
::-webkit-scrollbar {
    width: 8px
}
::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-image: linear-gradient(rgba(var(--dark-color), 1), rgba(var(--clr-2), 1))
}
::-moz-selection {
    color: rgba(var(--light-color), 1);
    background: rgba(var(--clr-1), 1)
}
::selection {
    color: rgba(var(--light-color), 1);
    background: rgba(var(--clr-1), 1)
}
html {
    scroll-snap-type: y mandatory
}
body {
    margin: 0;
    right: 0;
    -webkit-transition: margin-left .3s ease-in-out;
    transition: margin-left .3s ease-in-out;
    -webkit-overflow-scrolling: touch;
    font-family:  "Poppins", sans-serif !important;
    font-style: normal;
    line-height: 1.5;
    color: #000;
    background: rgba(var(--light-color), 1);
    overflow-x: hidden;
    font-size: 20px;
    letter-spacing: -0.02em;
    background-size: 100px;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: right 100%;
}
.bg-1{
    background-color: rgba(var(--clr-1), 1) !important
}
.bg-2 {
    background-color: rgba(var(--clr-2), 1) !important
}
.bg-l {
    background-color: rgba(var(--light-color), 1);
    
}
.bg-g {
    background-color: rgba(var(--grey), 1);
}
.bg-l-g {
    background-color: rgba(var(--l-grey), 1);
}
.bg-l-g-2{
    background-color:rgba(var(--l-grey-2), 1.0) ;
}
.border-radius{
    border-radius: 5px;
}

.card button.w-100 {
    font-size: 0.8rem !important;
}
.border-rad{
border-radius: 20px}
.bg-d{
    background: rgba(var(--dark-color), 1)
}
.bg-rad-gra{
    background: radial-gradient(circle ,rgba(var(--light-color), 1.0)0%,rgba(var(--grey), 0.4)200%);
}
.bg-crad-gra{
    background: linear-gradient(rgba(var(--grey),1)-200%,rgba(var(--light-color), 1.0)100%);
}
section.bg-rad-gra.service{
    background: radial-gradient(circle ,rgba(var(--light-color), 1.0)0%,rgba(var(--grey), 1)200%);
}
section.service .lozad.bg.py-5 {
    background-size: 4vw;
    background-position-x: 95%;
    background-position-y: bottom;
}
header {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    z-index: 999;
}
.drop-down-cont {
    width: 100%;
    max-height: 0;
    top: -7px;
    transition: 0.5s ease;
    box-shadow: 0 13px 36px rgba(var(--dark-color), .5) !important;
    background-size: 120PX !important;
    background-repeat: no-repeat !important;
    background-position: RIGHT BOTTOM;
    z-index: -1;
    /*border-radius:0 0 25px 25px;*/
    position: absolute;
    overflow: hidden;
    left: 0;
    right: 0;
    
}
button a:hover {
    color: rgba(var(--light-color), 1) !important;
}
.drop-down-cont ul li{
    margin: 0 0 5px 0;
}
.drop-down-cont.active, .drop-down:hover .drop-down-cont {
    max-height: 140vh;
}.drop-down{
    cursor: pointer;
}
footer,
section {
    overflow: clip;
    overflow: clip;
    /*font-size: 16px;*/
}
:after,
:before {
    -webkit-box-sizing: inherit;
    box-sizing: inherit
}
a {
    outline: 0;
    color: inherit
}
a.active,
a:active,
a:focus,
a:hover ,.breadcrumb-item.active {
    color: rgba(var(--clr-1), 1) ;
    outline: 0 !important
}
.clr-l a.active,
.clr-l a:active,
.clr-l a:focus,
.clr-l a:hover {
    color: rgba(var(--clr-4), 1) !important;
    outline: 0 !important
}
.faq-section .section-title {
    text-transform: capitalize;
}
audio,
img,
video {
    max-width: 100%;
    height: auto
}
.fw-700,
b,
strong {
    font-weight: 700
}
.fw-600{
    font-weight: 600;
}

.fw-500{
    font-weight: 500;
}
.heading,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: normal;
    font-style: normal;
    letter-spacing: -0.03em;
    
}
.uppercase{
    text-transform: uppercase;  
}
.clr-1 {
    color: rgba(var(--clr-1), 1)
}
.clr-2 {
    color: rgba(var(--clr-2), 1)
}
.clr-d {
    color: rgba(var(--dark-color), 1)
}
.clr-4 {
    color: rgba(var(--clr-4), 1)
}
.clr-g {
    color: rgba(var(--grey), 1)
}
.clr-l{
    color: rgba(var(--light-color), 1) !important
}
.f-70{
    font-size: 70px;
}
.f-55{
    font-size: 55px;
}
.f-22{
    font-size: 22px;
}
.f-20{
    font-size: 20px;
}
.f-18{
    font-size: 18px;
}
.f-16{
    font-size: 16px;
}
.f-14{
    font-size: 14px;
}
.f-26{
    font-size: 26px;
}
.f-24{
    font-size: 24px;
}
.f-30{
    font-size: 30px;
}
.f-60{
    font-size: 60px;
}
.f-50{
    font-size: 50px;
}
.f-45{
    font-size: 45px;
}.f-10{
    font-size: 10px;
}
.btn,
.form-control,
button,
input,
select,
select input {
    transition-duration: .8s
}
.btn,
button {
    background: none;
    color: rgba(var(--brand-primary), 1);
    border: 1px solid  #0b1f4c !important;
    padding: 15px 14px !important;
    border-radius: 0px !important;
    font-size: inherit;
    font-size: 18px !important;

}
.btn-2{
    background: rgba(var(--clr-1), 1);
    color: rgba(var(--light-color), 1) !important;
}
.text-white .btn,
.text-white button,.clr-l .btn,
.clr-l button {
    color: rgba(var(--light-color), 1);
    border: 1px solid  rgba(var(--light-color), 1) !important;
}
.btn.active,
.btn:hover,
button.active,
button:hover {
    background: rgba(var(--clr-1), 1) !important;
        color: rgba(var(--light-color), 1) !important;
}
.btn-2.active,.text-white .btn.active,
.btn-2:hover,.text-white .btn:hover
button.btn-2.active,.text-white button.active
button.btn-2:hover,.text-white button:hover {
    background: #fff!important;
    color: var(--brand-primary) !important;
}
.form-control, input, select, select input {
    background: rgba(var(--l-grey), 1) !important;
    color: inherit !important;
    border: none !important;
    padding: 17px 20px !important;
    box-shadow: unset !important;
    height: auto !important;
    border-radius: 15px !important;
    overflow: hidden;
}
.bg {
    /* background-attachment: fixed; */
    background-size: 3vw, 13vw, 2.5vw;
    background-position: center;
    background-repeat: no-repeat;
    background-position-x: left, right, 23%;
    background-position-y: 20%, 115%, 95%;
}
.gsap-sticky.bg {
        background-size: 5vw, 15vw, 2.5vw;
    background-position: center;
    background-repeat: no-repeat;
    background-position-x: 1%, 100%, 23%;
    background-position-y: 50%, 120%, 95%;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}
.growth.casestudy.py-5.lozad.bg {
    background-position-x: left, right, 20%;
    background-position-y: 60%, bottom, bottom;
    background-size: 4vw, 10vw, 3vw;
}
img.graph {
       border-radius: 17.76px;
    filter: drop-shadow(0 0 8.88px 0 rgba(var(--dark-color), 0.25));
    height: 400px;
    width: 100%;
    object-fit: contain;}
    .service .growth.casestudy.py-5.lozad.bg {
    background-position-x: left, right, 60%;
}
.vertical.bg {
    background-position-x: left, right, 20%;
    background-position-y: 60%, 110%, bottom;
    background-size: 4vw, 10vw, 3vw;
}
section.py-5.lozad.bg.insights {
    background-size: 3vw, 3vw;
    background-position-x: left, 97%;
    background-position-y: 90%, 98%;
}
footer.lozad.bg {
    background-position-y: 8%, 60%, 69%;
    background-position-x: left, 99%, 59%;
    background-size: 5vw, 8vw, 3vw;
}
.form-control:focus, input:focus {
    outline: 0;
    background: rgba(var(--clr-2), 0.2) !important;
    color: rgba(var(--dark-color), 1) !important;
    /*border: 1px solid rgba(var(--clr-1), 1) !important;*/
    box-shadow: none;
}
.form-control::placeholder,
input::placeholder {
    color: rgba(var(--clr-1), 1);
    opacity: 1
}

.bg-d .form-control, .bg-d input, .bg-d select, .text-white .form-control, .text-white input, .text-white select {
    outline: 0;
    background: rgba(var(--clr-1), 1) !important;
    color: rgba(var(--light-color), 1) !important;
    border: 1px solid rgba(var(--clr-2), 1) !important;
    box-shadow: none;
}
.bg-d .form-control:focus, .bg-d input:focus, .bg-d select:focus, .text-white .form-control:focus, .text-white input:focus, .text-white select:focus {
    outline: 0;
    background: rgba(var(--clr-2), 1) !important;
    color: rgba(var(--light-color), 1) !important;
    border: 1px solid rgba(var(--clr-2), 1) !important;
    box-shadow: none;
}
.bg-d .form-control::placeholder,
.bg-d input::placeholder,.text-white input::placeholder {
    color: rgba(var(--light-color), 1) !important;
    opacity: 1
}
input::-webkit-inner-spin-button,
input::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
}
input[type=number] {
    -moz-appearance: textfield
}

label.h {
    z-index: -999999999
}
input[type=date],
input[type=datetime-local],
input[type=datetime],
input[type=email],
input[type=month],
input[type=number],
input[type=password],
input[type=tel],
input[type=text],
input[type=time],
input[type=url],
input[type=week],
select,
textarea {
    font-size: 14px
}
.slick-dots li button,
.slick-next,
.slick-next:focus,
.slick-next:hover,
.slick-prev,
.slick-prev:focus,
.slick-prev:hover {
    background: 0 0 !important
}
.slick-next {
    right: 15px;
}
.slick-prev {
    left: 0;
    z-index: 9999;
}
.slick-next:before, .slick-prev:before{
    color: rgba(var(--clr-3), 1.0);
}
@supports (-moz-appearance:none) {
    SELECT {
        -moz-appearance: none !important;
        background: url(data:image/gif; base64,R0lGODlhBgAGAKEDAFVVVX9/f9TU1CgmNyH5BAEKAAMALAAAAAAGAAYAAAIODA4hCDKWxlhNvmCnGwUAOw==) right center no-repeat !important;
        background-position: calc(100% - 5px) center !important
    }
}
.logo{
    width: 100%;
    height: 80px;
    display: block;
        max-width: 312px;
}
.logo img{
    object-fit: contain;
    width: 100%;
    height: 100%;
    object-position: left;
}
button.btn-close {
    position: absolute;
    right: 0;
    padding: 10px !important;
    top: -5px;
    opacity: 1;
    background: red;
    z-index: 99999999999
}

input[type="checkbox"]:checked,input[type="radio"]:checked {
  accent-color: rgba(var(--clr-1), 1.0) !important;
}
.box-rad{
    border-radius: 20px;
}
.include .lozad.bg.py-5 {
    background-position-y: 25%, bottom, 104%;
    background-position-x: 9%, right, 40%;
    background-size: 3.5vw, 10vw, 2.5vw;
}
.icon {
    height: 40px;
    width: 40px;
    border-radius: 25px;
    border: 1px solid rgba(var(--clr-1), 1.0);
    color: rgba(var(--clr-1), 1.0);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 18px !important;
}
.icon-num{
    height:100px;width: 100px;font-size: 24px !important; border: none; border-radius: 50px;display: flex;
    justify-content: center;
    align-items: center;
    font-size: 30px;
    position: relative;

}
.how .icon-num:before {
    position: absolute;
    top: 100%;
    width: 2px;
    height: 100px;
    /*border-left: 1.58px dashed rgba(var(--l-grey), 1);*/
    content: '';
    z-index: -1;
background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='%23333' stroke-width='1' stroke-dasharray='15%2c15' stroke-dashoffset='100' stroke-linecap='round'/%3e%3c/svg%3e");;
}
.icon-num.last:before {
    display: none;
    }

.noborder{
    border: none !important;
}
.icon.half{
    border-radius: 15px;
}
.icon:hover{
    background: rgba(var(--clr-1), 1.0);
    color: rgba(var(--light-color), 1.0);
}

.banner .btn{
    font-size: 16px;
    padding: 15px 30px !important;
    ;
}
.spacer {
   height: 30vh;
   opacity: 0.2
}

.key {
  width: 32px;
  height: 32px;
  /*background: #fff;*/
  border: 1px solid #dee2e6;
  border-radius: .375rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  color: #6c757d;
  user-select: none;
}
.key.active {
    background: rgb(37 99 235 / var(--tw-text-opacity, 1));
}
          .perspective-1000 {
  perspective: 1000px;
}

        .cursor {
            display: inline-block;
            width: 2px;
            height: 1.2em;
            background-color: #3b82f6;
            vertical-align: middle;
            margin-left: 2px;
            animation: blink 1s step-end infinite;
        }

        .cursor.typing {
            animation: none;
            opacity: 1;
        }

        @keyframes blink {
            0%, 100% { opacity: 1; }
            50% { opacity: 0; }
        }

        /* Loading Bar */
        @keyframes loading {
            0% { transform: translateX(-100%); }
            50% { transform: translateX(100%); }
            100% { transform: translateX(100%); }
        }

        .animate-loading {
            animation: loading 2s cubic-bezier(0.4, 0, 0.2, 1) infinite;
        }

        /* Keyboard Styles */
        .key {
            transition: all 0.1s ease;
            box-shadow: 0 4px 0 #cbd5e1; /* slate-300 */
            transform: translateY(0);
        }

        .key:active, .key.active {
            transform: translateY(4px);
            box-shadow: 0 0 0 #cbd5e1;
            background-color: #3b82f6; /* blue-500 */
            color: white;
            border-color: #3b82f6;
        }

        /* Data Flow Pulse in Cable */
        @keyframes flowPulse {
            0% { stroke-dashoffset: 24; opacity: 0.2; }
            50% { opacity: 1; }
            100% { stroke-dashoffset: 0; opacity: 0.2; }
        }
        
        .data-cable-flow {
            stroke-dasharray: 4 4;
            animation: flowPulse 0.5s linear infinite;
        }
.casestudy .logo{
    width: 100%;
    height: 40px;
}

.casestudy .logo img{
    width: 100%;
    height: 100%;
    object-position: left;
    object-fit: contain;
}
.cards-box {
  position: relative;
  /*transform: translateX(-15px);*/
}
.cards-box {
  height: 500px;
  margin-top: 1.8rem ;
}
.cards-box .card {
  width: calc(18rem + 19vh);
  width: 90%;
  /*background: #f7fffd;*/
  border-radius: 14px;
  cursor: pointer;
}

.cards-box .card.hide {
  visibility: hidden;
}

.cards-box .card:not(.hide) {
  position: absolute;
  top: 0;
  left: 0;
  transition: all 1s cubic-bezier(0.18, 0.98, 0.45, 1);
  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.07);
}

.cards-box .card:not(.hide)[data-slide="0"] {
  transform: translateX(100px) scale(1);
  z-index: 6;
  opacity: 1;

}
.ico{
    width: 25px;
    height: 29px;
    object-position: center;
    object-fit: contain;
    margin: 0 0 0 auto;
    display: block;
}
.cards-box .card:not(.hide)[data-slide="1"] {
  transform: translateX(30px) scale(0.95);
  z-index: 5;
  opacity: 0.9;
}

.cards-box .card:not(.hide)[data-slide="2"] {
  transform: translateX(-30px) scale(0.9);
  z-index: 4;
  opacity: 0.8;
}

.cards-box .card:not(.hide)[data-slide="3"] {
  transform: translateX(-90px) scale(0.85);
  z-index: 3;
  opacity: 0.7;
}

.cards-box .card:not(.hide)[data-slide="4"] {
  transform: translateX(-120px) scale(0.8);
  z-index: 2;
  opacity: 0.6;
}

.cards-box .card:not(.hide)[data-slide="5"] {
  transform: translateX(-180px) scale(0.75);
  z-index: 1;
  opacity: 0.5;
}

.cards-box .card:not(.hide)[data-slide="0"] {
  transition: all 0.32s cubic-bezier(0.18, 0.98, 0.45, 1);
}
.gsap-btn,.nav-link  {
    background: rgba(var(--light-color), 1);
    border: 1px solid rgba(var(--clr-1), 0.5);
    color: rgba(var(--clr-1), 1);
    box-shadow: 0 0 10px 0 rgba(var(--clr-1), 0.15);
    /*font-size: 20px ! IMPORTANT;*/
    padding: 12px 14px  !important;
    border-radius: 15px;
    margin: 20px auto;  
    /*opacity: 0;*/
  /*transform: translateY(40px);*/
}
.nav-link{
    opacity: 1;transform: translateY(0);
}
.content-box {
  display: none;
  transition-duration: 0.8s;
  padding: 20px 10px;
  
}
.content-wrapper {
  position: relative;
  min-height: 500px;
}

.content-box {
  position: absolute;
  inset: 0;
  opacity: 0;
  transform: translateY(20px);
  pointer-events: none;
}

.content-box.active {
  pointer-events: auto;
}
.box{
    height: 405px;
}
.box .btn {
    padding: 5px 10px !important;
    font-size: 16px !important;
}
.one-slider.slick-initialized.slick-slider.slick-dotted {
    margin-bottom: 0 !important;
}
.content-box.active {
  display: block;
  transition-duration: 0.8s;
  opacity: 1;
}
.gsap-btn.active{
    background: rgba(var(--l-grey), 1.0) !important;
    color: rgba(var(--clr-1), 1) !important;
}
.gsap-btn  {
  transition: transform 0.3s;
  font-weight: 500;
  cursor: pointer;
}
.tab-img{
    width: 100%;
    height: 50px;
    object-position: left;
    object-fit: contain;
}
 
 .logo_sec4_head h3 {
    font-size: 50px;
    text-align: center;
    font-weight: 800
}

 .logo_sec4_content .logo_slide ul li {
    display: inline-flex;
    height: 100%;
    position: relative;
    transition: .5s
}

 .logo_sec4_content .logo_slide ul li .item_body {
    width: 60px;
    background: rgba(var(--light-color), 1.0);
    border: 1px solid ;
    box-shadow: 0 0 15px 0 rgba(0,0,0,.15);
    /*padding-left: 80px;*/
    overflow: hidden;
    transition: 1.5s;
    border-radius: 10px;
    height: 650px;
    margin-right: 15px;
}
 .logo_sec4_content .logo_slide ul .logo_slide_item-1.active .item_body,  .logo_sec4_content .logo_slide ul .logo_slide_item-2.active .item_body,  .logo_sec4_content .logo_slide ul .logo_slide_item-3.active .item_body,  .logo_sec4_content .logo_slide ul .logo_slide_item-4.active .item_body,  .logo_sec4_content .logo_slide ul .logo_slide_item-5.active .item_body,  .logo_sec4_content .logo_slide ul .logo_slide_item-6.active .item_body,  .logo_sec4_content .logo_slide ul .logo_slide_item-7.active .item_body{
    width: 100px;
}
 .logo_sec4_content .logo_slide ul .logo_slide_item-1.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-2.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-3.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-4.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-5.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-6.active .item_body,  .logo_sec4_content .logo_slide ul .logo_slide_item-7.active .item_body {
    width: 900px
}
.logo_sec4_content .logo_slide ul li .item_body .item_heading h3{
    height: 400px;
    
    width: 1ch;
    word-break: break-all;
    
}
footer{
    font-size: 16px;
    color: rgba(var(--grey),1);
}
span.dot {
        background: rgba(var(--clr-2), 1);
    width: 10px;
    height: 10px;
    margin: 0 auto;
    border-radius: 10px;
    margin: 10px;
}
 .logo_sec4_content .logo_slide ul li .item_body .item_heading {
        /*color: #fff;*/
    font-size: 20px;
    font-weight: 700;
    text-align: center;
   
    text-transform: uppercase;
    position: absolute;
    top: 0;
  
    border-radius: 10px;
    left: 0;
    text-wrap: wrap;
    
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    overflow: hidden;
    width: 60px;
    padding: 10px;
    background: rgba(var(--light-color), 1.0);
    height: 650px;
    overflow-wrap: break-word;
    opacity: 1;
}

 .logo_sec4_content .logo_slide ul li .item_body .item_heading h4 {
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    text-shadow: rgb(0 0 0 / 16%) 3.694px 4.728px 6px;
    text-transform: uppercase
}
.logo_sec4_content .logo_slide ul li.active .item_body .item_heading{
    opacity: 0;
}
 .logo_sec4_content .logo_slide ul li .item_body .item_text {
    width: 900px;
    padding: 20px 100px 20px 60px;
    background: url(../img/vertical.webp),linear-gradient(rgba(var(--light-color), 0) 50%,rgba(var(--light-color), 1)100%) ;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    background-blend-mode: overlay;
    transition: .5s;
    height:100%;
}

 .logo_sec4_content .logo_slide ul li .item_body .item_text h4 {
    font-weight: 600;
    font-size: 24px!important;
    color: #fff;
    padding-bottom: 10px;
}

 .logo_sec4_content .logo_slide ul li .item_body .item_text p {
    padding-right: 20px;
    min-height: 90px;
    color: #fff;
    height: 420px;
}
 .insight {
    height: 550px;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    overflow: hidden;
    cursor: pointer;
        background-size: cover;
    background-position: center;
}
.insight .overlay {
    background: rgba(var(--dark-color),0.2);
}
.insight .text {
    transition: 0.8s;
    transform: translateX(-200%);
}
.insight:hover .text {
    transition: 0.8s;
    transform: translateX(0);
}
.gra{
    background: linear-gradient(rgba(var(--l-grey), 1.0),rgba(var(--light-color), 1.0));
}
.button-list > * {
  padding-inline: calc((var(--i) - 1) * 30px);
}

.button-list > :nth-child(1) { --i: 1; }
.button-list > :nth-child(2) { --i: 2; }
.button-list > :nth-child(3) { --i: 3; }
.button-list > :nth-child(4) { --i: 4; }
.button-list > :nth-child(5) { --i: 5; }
.button-list > :nth-child(6) { --i: 6; }
.gsap-btn span.d-flex.align-items-center {
    width: 300px;
    margin: 0 auto;
}
ul.slick-dots {
    bottom: 2rem!important;
    left: 3rem!important;
    right: auto;
    width: auto;
}
.slick-dots li{
    width: auto !important;
    height: auto !important;
}
.slick-dots li button {
    padding: 0 10px 0 0 !important; width: 10px;
    height: 10px;
    background: rgba(var(--grey),0.8) !important;
}
.slick-dots li button:before{
    display: none;
    
    
}
.slick-dots li.slick-active button{
background: rgba(var(--clr-1),1)!important; width: 30px;
}
.service .banner.lozad.bg.py-5 {
    background-position-x: left, right, 64%;
    background-position-y: 50%, 100%, bottom;
}
.make-2 ::marker {
    color: rgba(var(--clr-2), 1);
}
.prob span.line {
    width: 25px;
    height: 3px;
    background: rgba(var(--clr-2), 1);
    top: 12px;
    position: relative;
    margin-right: 15px;
}
.bullet, .cause, .fix{
    transition-duration: 0.8s;
}
.bullet:hover .cause{
    background: #FFBFBF;
}
.bullet:hover .fix{
    background: #B0E4CC;
}
.prob .lozad.bg.py-5,.how,.bm .bg {
    background-position-y: 36%, bottom, bottom;
    background-size: 4vw, 10vw, 2.5vw;
}
.flow-wrapper {
  width: 95%;
  /*margin: 120px auto;*/
  position: relative;
  min-height: 420px;
}
.flow-wrapper {
  position: relative;
  min-height: 520px;
  display: block;
}
#flowPath {
  fill: none !important;
}

#flowLine {
  width: 100%;
  height: auto;
}
.step {
  opacity: 0;
  transform: translateY(25px);
}
.step {
  position: absolute;
  text-align: center;
  opacity: 0;
  transform: translateY(25px);
  font-size: 12px;
}

.step .num {
  display: inline-flex;
  width: 79px;
  height: 79px;
  border-radius: 20px;
  background: #f2f2f2;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  margin-bottom: 6px;
  font-size: 28px;
}

 .step[data-step="1"] {
    top: 0;
    left: -18px;
}

.step[data-step="2"] {
    top: 140px;
    left: 380px;
}

.step[data-step="3"] {
    top: 22px;
    left: 933px;
}

.step[data-step="4"] {
    top: 250px;
    right: -20px;
}

.step[data-step="5"] {
    bottom: 0;
    left: 820px;
}

.step[data-step="6"] {
    bottom: 76px;
    left: 160px;
}
.flow-section{
  padding: 100px 0;
  background-position-x: left, right, 40%;
    background-position-y: 40%, 110%, bottom;
}
.sticky-wrapper {
    position: sticky;
    top: 40px;
    height: fit-content; 
}
.tolls .toll .icon-num{
    transition-duration: 0.8s;
    background: rgba(var(--l-grey), 0.0);
}
.tolls .toll:hover .icon-num{
    background: rgba(var(--l-grey), 1.0);
}
.tolls{
    background-size: 2.5vw, 2.5vw;
    background-position: center;
    background-repeat: no-repeat;
    background-position-x: left, 20%;
    background-position-y: 100px, bottom;
}
.cbanner.lozad.pt-5.bg {
    background-position-y: 20%, 250%;
    background-position-x: left, 104%;
    background-size: 4vw, 15vw;
}
.cbanner .icon-num:not(.not-b):before {
    content: '';
    background: rgba(var(--l-grey-2), 1);
    height: 2px;
    width: 200px;
    position: absolute;
    top: 50%;
    right: 100%;
}
.cbanner .icon-num:not(.not-a):after {
    content: '';
    background: rgba(var(--l-grey-2), 1);
    height: 2px;
    width: 200px;
    position: absolute;
    top: 50%;
    left: 100%;
}
.contact-form.bg {
    background-size: 4vw, 2.5vw;
    background-position-x: right, 50%;
    background-position-y: 42%, 98%;
}

@media screen and (min-width: 767px){
        .drop-down .container {
        padding-top: 140px;
    }
}

@media screen and (min-width:1024px) {
     .drop-down .container {
        padding-top: 100px;
    }
}
@media screen and (min-width:1180px) {
    .container{
    max-width: 90% !important;
 }
 .drop-down .container{
         padding-top: 100px;
 }
 
}
@media screen and (min-width: 1366px){
    .logo_sec4_content .logo_slide ul li .item_body .item_text {
    width: 700px;
}.logo_sec4_content .logo_slide ul .logo_slide_item-1.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-2.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-3.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-4.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-5.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-6.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-7.active .item_body {
    width: 700px;
}
}
@media screen and (min-width:1440px){
    .drop-down .container{
        padding-top: 150px;
    }
 .banner {
    height: 100vh;
  }
}
@media screen and (min-width:1600px) {

 .container{
    max-width: 1514px !important;
 }
}
@media screen and (max-width: 1600px){
    .logo_sec4_content .logo_slide ul li .item_body .item_text ,.logo_sec4_content .logo_slide ul .logo_slide_item-1.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-2.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-3.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-4.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-5.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-6.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-7.active .item_body {
    width: 700px;
}
body {
        font-size: 18px
    }
}
@media screen and (max-width: 1600px) {
    body {
        font-size: 18px
    }
    Button{
        font-size: 17px !important;
    }
    .f-70 {
    font-size: 65px;
}
.f-55{
    font-size: 50px;
}
.f-22{
    font-size: 20px;
}
.f-20{
    font-size: 18px;
}
.f-18{
    font-size: 16px;
}
.f-14{
    font-size: 14px;
}
.f-26{
    font-size: 24px;
}
.f-24{
    font-size: 22px;
}
.f-30{
    font-size: 28px;
}
.f-60{
    font-size: 55px;
}
.f-50{
    font-size: 40px;
}
.f-45{
    font-size: 40px;
}.f-10{
    font-size: 10px;
}
}
@media screen and (max-width:1367px) { 
    .step[data-step="1"] {
    top: 0;
    left: -18px;
}

.step[data-step="2"] {
    top: 83px;
    left: 380px;
}

.step[data-step="3"] {
    top: 5px;
    left: 865px;
}

.step[data-step="4"] {
    top: 250px;
    right: -20px;
}

.step[data-step="5"] {
    bottom: 67px;
    left: 750px;
}

.step[data-step="6"] {
    bottom: 132px;
    left: 160px;
}
    #pills-tab > * {
  padding-inline: calc((var(--i) - 1) * 20px);
}
    
.logo_sec4_content .logo_slide ul li .item_body .item_text {
    width: 600px;
}.logo_sec4_content .logo_slide ul .logo_slide_item-1.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-2.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-3.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-4.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-5.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-6.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-7.active .item_body {
    width: 600px;
}
.insight {
    height: 500px;
}
.service-first{
    background-position-x:40% ;
    background-position-y: bottom;
    background-size: 2vw;
}
.gsap-btn, .nav-link{
    margin: 10px auto;
}.content-box{
    padding: 10px 10px;
}
}
@media screen and (min-width: 1180px){

    .logo_sec4_content .logo_slide ul li .item_body .item_text {
    width: 40vw;
}.logo_sec4_content .logo_slide ul .logo_slide_item-1.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-2.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-3.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-4.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-5.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-6.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-7.active .item_body {
    width: 40vw;
}
}
@media screen and (min-width:1024px) {

.cart-cont{
    box-shadow: -16px 0 36px rgba(var(--clr-5), 0.2);
}}
@media screen and (max-width:1181px) {
.step .num {
    width: 75px;
    height: 75px;}
    .step[data-step="2"] {
    top: 40px;
    left: 380px;
}

.step[data-step="3"] {
    top: -1px;
    left: 692px;
}

.step[data-step="4"] {
    top: 211px;
    right: 31px;
}

.step[data-step="5"] {
    bottom: 131px;
    left: 617px;
}

.step[data-step="6"] {
    bottom: 183px;
    left: 100px;
}
   body {
        font-size: 17px
    }
    Button{
        font-size: 16px !important;
    }
    .f-70 {
    font-size: 60px;
}
.f-55{
    font-size: 55px;
}
.f-22{
    font-size: 19px;
}
.f-20{
    font-size: 18px;
}
.f-18{
    font-size: 15px;
}
.f-14{
    font-size: 14px;
}
.f-26{
    font-size: 24px;
}
.f-24{
    font-size: 18px;
}
.f-30{
    font-size: 26px;
}
.f-60{
    font-size: 50px;
}
.f-50{
    font-size: 42px;
}
.f-45{
    font-size: 40px;
}.f-10{
    font-size: 10px;
}
footer{
    font-size: 14px;
}
    .logo_sec4_content .logo_slide ul li .item_body .item_text,.logo_sec4_content .logo_slide ul .logo_slide_item-1.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-2.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-3.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-4.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-5.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-6.active .item_body,  .logo_sec4_content .logo_slide ul .logo_slide_item-7.active .item_body {
    width: 45vw
}
.logo_sec4_content .logo_slide ul li .item_body .item_text{
    padding: 40px;
}
    .f-45{
    font-size: 40px;
}
.key {
  width: 30px;
  height: 30px;
}}@media screen and (max-width:1025px) {

.step[data-step="4"] {
        top: 193px;
        right: 31px;
    }
        .step[data-step="5"] {
        bottom: 157px;
        left: 478px;
    }}
@media screen and (max-width:992px) {
    .container{
        max-width: 95%;
    }
    .button-list > * {
  padding-inline: calc((var(--i) - 1) * 20px);
}
    .logo_sec4_content .logo_slide ul li .item_body {
    
    margin-right: 5px;}
    .bg{
        background-size: 5vw, 20vw, 5vw;
    }
     #pills-tab > * {
    
  padding-inline: calc((var(--i) - 1) * 10px);
}
    .logo_sec4_content .logo_slide ul li .item_body .item_text{
    padding: 20px;
}
    .banner-side{
        height: 400px;
    }

.cards-box .card:not(.hide)[data-slide="0"] {
  transform: translateY(60px) scale(1);
  z-index: 6;
  opacity: 1;
}

.cards-box .card:not(.hide)[data-slide="1"] {
  transform: translateY(30px) scale(0.975);
  z-index: 5;
  opacity: 0.9;
}
.cards-box .card{
    width: 100%;
}
.cards-box .card:not(.hide)[data-slide="2"] {
  transform: translateY(0) scale(0.95);
  z-index: 4;
  opacity: 0.8;
}

.cards-box .card:not(.hide)[data-slide="3"] {
  transform: translateY(-30px) scale(0.925);
  z-index: 3;
  opacity: 0.7;
}

.cards-box .card:not(.hide)[data-slide="4"] {
  transform: translateY(-60px) scale(0.9);
  z-index: 2;
  opacity: 0.6;
}

.cards-box .card:not(.hide)[data-slide="5"] {
  transform: translateY(-90px) scale(0.875);
}
.cards-box {
    height: 100vh;
}
.step[data-step="2"] {
    top: 20px;
    left: 250px;
}

.step[data-step="3"] {
    top: -17px;
    left: 437px;
}

    .step[data-step="4"] {
        top: 127px;
        right: -16px;
    }

    .step[data-step="5"] {
        bottom: 212px;
        left: 398px;
    }
.step[data-step="6"] {
    bottom: 248px;
    left: 69px;
}
}

@media screen and (max-width:767.5px) {
    .cbanner .icon-num:before,
.cbanner .icon-num:after{
    display: none;
}
    .container {
            max-width: 95%;
        }
    .border-top{
        border: none;
    }
    /*.bg{
        background-size: 10vw, 40vw, 10vw;
    }*/
    .nav-pills .nav-link, button ,.btn{
        padding: 12px 10px !important;
        width: 100%;
    }
    .tab-img{
        object-position: center;
    }
    .logo_sec4_content .logo_slide ul li .item_body .item_text,.logo_sec4_content .logo_slide ul .logo_slide_item-1.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-2.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-3.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-4.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-5.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-6.active .item_body,  .logo_sec4_content .logo_slide ul .logo_slide_item-7.active .item_body {
    width: 90vw
}
    body{
        font-size: 13px;
    }
    Button{
        font-size: 12px !important;
    }
    .logo {
        height: 50px;
    }
    .logo img{
        object-position: center;
    }
    .nav-bar .logo img{
        object-position: left;
    }
    .nav-bar {
        background: radial-gradient(circle ,rgba(var(--light-color), 1.0)0%,rgba(var(--grey), 1)200%);
        background-size: 200%;
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        clip-path: circle(0% at 100% 0);

        z-index: 99999999;
        transition: .8s;
        padding-left: 10px;
        padding-right: 10px;
        overflow-y: scroll
    }
    .nav-bar li:not(.drop-down-cont li,.contact li,.fr) {
        margin: 20px auto
    }
    .nav-bar .main{
        font-size: 18px !important;
    }
    .nav-bar.active {
        clip-path: circle(141.2% at 100% 0);

    }
    .drop-down-cont .bg-rad-gra {
        background: none !important;
    }
    
    .f-16 {
        font-size: 14px;
    }
    .f-24 {
    font-size: 20px;
}
    .f-20 {
        font-size: 16px;
    }
    .w-8 {
    width: 1.6rem !important;
}.h-8 {
    height: 1.6rem !important;
}
.key {
  width: 25px;
  height: 25px;
}
.logo_sec4_content .logo_slide ul li .item_body .item_text,.logo_sec4_content .logo_slide ul .item_body {
    width: 90vw !important;
    height: 60px !important;
}.logo_sec4_content .logo_slide ul .item_body{
    margin-bottom: 10px;
}
.logo_sec4_content .logo_slide ul li .item_body .item_text, .logo_sec4_content .logo_slide ul .logo_slide_item-1.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-2.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-3.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-4.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-5.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-6.active .item_body, .logo_sec4_content .logo_slide ul .logo_slide_item-7.active .item_body{
    height: 500px !important;
}
.logo_sec4_content .logo_slide ul li .item_body .item_heading{
    width:95vw;
    flex-wrap: nowrap;
    justify-content: center;
    flex: auto !IMPORTANT;
    height: 60px;
}
.logo_sec4_content .logo_slide ul li .item_body .item_heading h3 {
    width: 50vw;
    height: auto;
}.cards-box {
    height: 140vw;
}.icon{
    height: 30px;
    width: 30px;
    font-size: 14px !important;
}
.insight{
    height: 400px !important;
}
.drop-down-cont{
    position: relative;
    background: none;
    box-shadow: unset !important;
    z-index:2;
}
.box{
height: 400px;
}

.ico {
    margin: 20px 0;
}
.py-5 {
    padding-top: 2rem !important;
    padding-bottom: 2rem !important;
}
.growth .f-22 {
    padding-bottom: 20px;
}
.container {
    padding-left: 2rem !important;
    padding-right: 2rem !important;
}
.row.growthBTn .col-lg-5.col-6 {
    width: 100%;
}
.pin-spacer .content-wrapper {
    min-height: 400px;
}
.btn, button {
    font-size: 14px !important;
}
img.graph {
       border-radius: 17.76px;
    filter: drop-shadow(0 0 8.88px 0 rgba(var(--dark-color), 0.25));
    height: 220px;
    width: 100%;
    object-fit: contain;}
}


@media screen and (max-width:431px) {
    .icon-num {
    height: 75px;
    width: 75px;}
    .step{
        position: relative;
        top: 0 !important;
        right: 0 !important;
        left: 0 !important;
    }
    .container {
            max-width: 100%;
        }
    .button-list > * {
  padding-inline: calc((var(--i) - 1) * 10px);
}
body {
        font-size: 16px
    }
   .f-70 {
    font-size: 45px;
}
.f-55{
    font-size: 40px;
}
.f-22{
    font-size: 16px;
}
.f-20{
    font-size: 16px;
}
.f-18{
    font-size: 14px;
}
.f-14{
    font-size: 13px;
}
.f-26{
    font-size: 22px;
}
.f-24{
    font-size: 17px;
}
.f-30{
    font-size: 22px;
}
.f-50{
    font-size: 35px;
}
.f-45{
    font-size: 32px;
}.f-10{
    font-size: 10px;
}
.f-60{font-size: 30px;}
footer{
    font-size: 13px;
}
.banner .btn{
    font-size: 14px !important;
    padding: 12px 5px !important;
}
button{
    padding: 12px 5px !important;
}
}
.hero-section {
    background: url(/assets/img/serviveBanner.png);
    color: white;
    padding: 120px 0;
    margin-top: 150px;
    
}
.hero-section h1 {
font-size: 2.5rem;
text-transform: uppercase;
letter-spacing: -0.02em;
    line-height: 1.6;
}
.hero-section p {
font-size: 1.2rem;
line-height: 1.6;
}
.hero-section .btn-primary {
    background-color: #ff7f50;
    border: none;
}
.dashboard-img {
    max-width: 100%;
    height: auto;
    border-radius: 10px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.2);
}
.servBRight {
padding-right: 40px;
}
.paid-media-section {
  padding: 10rem 2.3rem;
 background-repeat: no-repeat;
    background-position: right bottom;
}

.paid-media-section .container{
    background-repeat: no-repeat;
    background-position: left;
}
.section-title {
   font-size: 3.1rem;
   letter-spacing: -0.02rem;
    color: #000;
      text-transform: uppercase;

}
.section-title .fw-bold {
    color: #0B1F4C;
     font-weight: 600 !important;
}
.section-text {
  font-size: 1.2rem;
  line-height: 1.6;
 
}
.paid-media-section .section-text {
  max-width: 1109px;
  margin: 0 auto;
}
.funnel-insight-section {
background-color:#F2F3F4;
  margin: 50px 0;
  } 
.funnel-insight-section .container{
margin-left: 0;
max-width: 90% !important;
}
.gain-card {
    border: 1px solid #e3e3e3;
    border-radius: 18px;
    padding: 45px 25px;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    align-items: end;
}
.gain-card h6 {
  font-weight: 600;
  font-size: 1.2rem;
  margin-bottom: 15px;
  text-align: left;
    max-width: 72%;
}
.gain-card p {
  font-size: 1.2rem;
  color: #585C5E;
  line-height: 1.6;
  margin-bottom: 0;
}
.gain-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 25px rgba(0,0,0,0.05);
}
.Nespresso{
padding: 80px 0;
}
.Nespresso .section-title, 
.strategy-section h4,
.cta-section .section-title{
    font-size: 2.5rem;
    line-height: 1.5;
}
.Nespresso .iconz{
    width: 124.17px;
    height: auto;
    object-fit: contain;
}
.Nespresso .imgBox  .section-text {
    max-width: 498px;
}
.Nespresso .contain.d-flex {
    column-gap: 30px;
    margin-top: 35px;
  flex-wrap: wrap;
}
.Nespresso .section-text.topText {
    margin-bottom: 95px;
      position: relative;
}
section.Nespresso {
    overflow: hidden;
}
.Nespresso .section-text.topText:after {
    content: '';
    position: absolute;
    width: 69%;
    background: #A9A9A9;
    height: 1px;
    bottom: -55%;
    left: 0;
}
.Nespresso .top-r{
    padding: 0px 0px 150px;
}
.Nespresso  .col-lef {
    position: relative;
    padding-right: 40px;
}
.Nespresso .col-lef:before {
content: '';
    position: absolute;
    width: 124%;
    height: 117%;
    background: #F2F3F4;
    z-index: -1;
    left: -26%;
    top: -11%;
}
.Nespresso .col-rit .section-text.topText:after {
    left: 30% !important;
}
.numLIst .num {
    display: flex;
    width: 83px;
    height: 83px;
    align-items: center;
    justify-content: center;
    background: #EFEFEF;
    border-radius: 50%;
    font-size: 1.8rem;
    position: relative;
}
.numLIst {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 20px;
}
.numLIst .section-text {
    max-width: 587px;
}
.numLIst .num:after {
    content: '';
    position: absolute;
}
.numLIst .num.af:after {
    position: absolute;
    bottom: -70%;
    width: 2px;
    height: 100px;
    /*border-left: 1.58px dashed rgba(var(--l-grey), 1);*/
    content: '';
    z-index: -1;
background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='%23333' stroke-width='1' stroke-dasharray='15%2c15' stroke-dashoffset='100' stroke-linecap='round'/%3e%3c/svg%3e");;
}
    .strategy-section {
      background: #F2F3F4;
      padding: 80px 0;
      background-repeat: no-repeat;
      background-position-x: 94%, 4%;
      background-position-y: 22%, 86%;
    }
    .strategy-section .sub-text {
      max-width: 1004px;
      margin: 15px auto 90px;
      color: #000;
      font-size: 0.95rem;
    }
    .step-title {
   font-weight: 600;
    margin-bottom: 10px;
    font-size: 1.25rem;
    color: #0B1F4C;
    }
    .feature-title {
      font-weight: 600;
      color: #0ABCD8;
      font-size: 1.25rem;
    }
    .feature-text {
      font-size: 1.25rem;
      color: #000;
      line-height: 1.6;
    }
.strategy-section .section-title {
    font-size: 2.6rem;
}
.strategy-section .fw-bold {
    font-size: 3rem;
}
.feature {
    padding-left: 50px;
  margin-top: 25px;
}
.feature .feature-text {
    color: #585C5E;
    display: inline;
}
.strategic-gains.stgv-2 {
    background-repeat: no-repeat;
    background-position-x: 104%, 4%;
    background-position-y: 134%, 86%;
}
.faq-section {
  overflow: hidden;
  padding-top: 120px !important;
  padding-bottom: 120px !important;
  background: #FAFAFA;
}
/* Header */
.faq-label {
  font-size: 1.25rem;
  letter-spacing: 2px;
  color: #0ABCD8;
  margin-bottom: 10px;
}
/* Accordion */
.custom-accordion .accordion-item {
  background: transparent;
  border: none;
  border-bottom: 1px solid #A9A9A9;
}
.custom-accordion .accordion-button {
  background: transparent;
  font-weight: 600;
  font-size: 1.25rem !important;
  padding: 30px 0 !important;
  box-shadow: none;
}
.custom-accordion .accordion-button:hover {
  background: transparent !important;
  color: #0B1F4C !important;
}
.custom-accordion .accordion-button:not(.collapsed) {
  background: transparent !important;
}
.custom-accordion .accordion-button::after {
  transform: scale(.8);
}
.custom-accordion .accordion-body {
  padding: 0 0 20px 0;
  font-size: 1.25rem !important;
  color: #000;
}
.cta-section {
    padding-bottom: 120px !important;
}
.strategy-section .feature-list {
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    justify-content: center;
}
.numV2 .numLIst .num.af:after {
    bottom: -137%;
}
    /* ── Hero ── */
    .gradient-hero {
      background: radial-gradient(circle at top, #f3f4f6 0%, #ffffff 70%);
      padding-top: 15rem;
      padding-bottom: 4rem;
    }
    .hero-eyebrow {
      font-size: 1rem;
      font-weight: 700;
      letter-spacing: 0.2em;
      text-transform: uppercase;
      color: var(--brand-muted);
      margin-bottom: 1.5rem;
    }
    .hero-title {
      font-size: clamp(3rem, 7vw, 4.5rem);
      font-weight: 800;
      letter-spacing: -0.03em;
      line-height: 1.1;
      margin-bottom: 0;
    }
    .hero-title .muted { color: var(--brand-muted); }
    .hero-subtitle {
      font-size: clamp(1rem, 2vw, 1.25rem);
      color: var(--brand-muted);
      line-height: 1.65;
      margin-top: 2rem;
    }
    /* ── Metrics ── */
    .metrics-section {
      padding: 3rem 0;
      border-top: 1px solid #f3f4f6;
    }
    .metric-number {
      font-size: 2.5rem;
      font-weight: 700;
      margin-bottom: 0.25rem;
      color: var(--brand-dark);
    }
    .metric-label {
      font-size: 0.625rem;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.12em;
      color: #0b1f4c;
    }
    /* ── Filter bar ── */
    .case-main-section .section-title { 
      font-size: 1.875rem;
       font-weight: 700;
       margin-bottom: 0.5rem;
     }
    .case-main-section .section-subtitle { font-size: 0.875rem; color: var(--brand-muted); line-height: 1.6; }
    .filter-btn {
      padding: 0.5rem 1.25rem;
      border-radius: 9999px;
      font-size: 0.625rem;
      font-weight: 700;
      font-family: 'Poppins', sans-serif;
      border: none;
      cursor: pointer;
      transition: background-color 0.2s ease;
      line-height: 1;
    }
    .filter-btn.active           { background-color: var(--brand-primary); color: #ffffff; }
    .filter-btn:not(.active)     {background-color: #f3f4f6;color: var(--brand-primary);font-size: 1rem;}
    .filter-btn:not(.active):hover { background-color: #e5e7eb; }
    /* ── Cards ── */
    .case-card {
      background: #ffffff;
      border: 1px solid #f9fafb;
      border-radius: 8px;
      padding: 2rem;
      display: flex;
      flex-direction: column;
      height: 100%;
      box-shadow: 0 4px 20px -2px rgba(0,0,0,0.05);
      transition: transform 0.2s ease, box-shadow 0.2s ease;
    }
    .case-card:hover {
      transform: translateY(-4px);
      box-shadow: 0 12px 30px -5px rgba(0,0,0,0.08);
    }
    .card-category {
      font-size: 0.625rem;
      font-weight: 700;
      letter-spacing: 0.2em;
      text-transform: uppercase;
      color: var(--brand-muted);
      margin-bottom: 1rem;
      display: block;
    }
    .card-title-h3 { font-size: 1.25rem; font-weight: 700; line-height: 1.3; margin-bottom: 0.75rem; }
    .card-client   { font-size: 0.8125rem; color: var(--brand-muted); margin-bottom: 1rem; }
    .card-desc     { font-size: 0.875rem; color: var(--brand-muted); line-height: 1.65; margin-bottom: 2rem; }
    .card-metric-box {
      background-color: #f9fafb;
      border-radius: 0.5rem;
      padding: 1.5rem;
      text-align: center;
      margin-top: auto;
      margin-bottom: 2rem;
    }
    .card-metric-value {
      font-size: 2.5rem;
      font-weight: 700;
      margin-bottom: 0.25rem;
      color: var(--brand-dark);
    }
    .card-metric-label {
      font-size: 0.625rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.15em;
      color: var(--brand-muted);
    }
    .card-tags { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1.5rem; }
    .card-tag {
      padding: 0.25rem 0.75rem;
      background-color: #f3f4f6;
      border-radius: 0.375rem;
      font-size: 0.625rem;
      font-weight: 600;
      color: var(--brand-dark);
    }
    .card-link {
      color: var(--brand-primary);
      font-size: 0.75rem;
      font-weight: 700;
      text-decoration: none;
      display: flex;
      align-items: center;
      gap: 0.25rem;
    }
    .card-link:hover { text-decoration: underline; color: var(--brand-primary); }
    /* ── Quote ── */
    .quote-section { background-color: var(--brand-bgLight); padding: 6rem 1.5rem; text-align: center; }
    .blockquote-text {
      font-size: clamp(1.5rem, 3.5vw, 2.25rem);
      font-weight: 700;
      line-height: 1.35;
      margin-bottom: 3rem;
      color: var(--brand-dark);
    }
    .quote-name  { font-weight: 700; font-size: 1.125rem; margin-bottom: 0.25rem; color: var(--brand-primary); }
    .quote-role  { font-size: 0.875rem; color: var(--brand-primary); text-transform: uppercase; letter-spacing: 0.08em; }
    /* ── CTA ── */
    .cta-section { padding: 6rem 1.5rem; text-align: center; }
    .cta-title   { font-size: clamp(2.25rem, 5vw, 3rem); font-weight: 700; margin-bottom: 1.5rem; }
    .cta-subtitle { font-size: 1.125rem; color: var(--brand-muted); line-height: 1.65; margin-bottom: 2.5rem; }
    .cta-btn {
      display: inline-flex;
      align-items: center;
      gap: 0.5rem;
      background-color: var(--brand-primary);
      color: #ffffff;
      padding: 1rem 2.5rem;
      border-radius: 9999px;
      font-family: 'Poppins', sans-serif;
      font-weight: 700;
      font-size: 0.875rem;
      border: none;
      cursor: pointer;
      transition: opacity 0.2s ease;
      text-decoration: none;
    }
    .cta-btn:hover { opacity: 0.88; color: #ffffff; }
    .arrow-sm { width: 0.75rem; height: 0.75rem; }
    .arrow-md { width: 1rem;    height: 1rem; }
    .material-symbols-outlined {
      font-family: 'Material Symbols Outlined';
      font-variation-settings: 'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24;
      font-size: 1.25rem;
      line-height: 1;
      vertical-align: middle;
    }
    /* ── Page ── */
    .page-wrap-blog { margin: 0 auto; padding: 13rem 1.5rem; }

    /* ── Header ── */
    .page-title {
      font-size: clamp(2.5rem, 5vw, 3.5rem);
      font-weight: 900;
      letter-spacing: -0.03em;
      line-height: 1.1;
      color: var(--sl-900);
      margin-bottom: 1rem;
    }
    .page-subtitle {
      font-size: 1.125rem;
      color: var(--sl-600);
      line-height: 1.7;
      max-width: 36rem;
      margin-bottom: 3rem;
    }
    /* ── Filter bar ── */
    .filter-bar {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: .5rem;
      padding-bottom: 1rem;
      border-bottom: 1px solid var(--sl-200);
      margin-bottom: 3rem;
    }
    .filter-pill {
      padding: .4rem 1rem;
      border-radius: 9999px;
      font-size: .8125rem;
      font-weight: 600;
      font-family: 'Poppins', sans-serif;
      border: 1px solid var(--sl-200);
      background: #fff;
      color: var(--sl-600);
      cursor: pointer;
      transition: background .18s, border-color .18s, color .18s;
      line-height: 1.4;
    }
    .filter-pill.active,
    .filter-pill:hover {
      background: var(--brand-primary);
      border-color: var(--brand-primary);
      color: #fff;
    }
    /* ── Featured card ── */
    .featured-card {
      background: #fff;
      border: 1px solid var(--sl-100);
      border-radius: 1.5rem;
      overflow: hidden;
      box-shadow: 0 1px 3px rgba(0,0,0,.06);
      margin-bottom: 3rem;
      transition: box-shadow .2s;
    }
    .featured-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,.09); }
    .featured-card:hover .featured-title { color: var(--brand-primary); }
    .featured-body { padding: 2.5rem; }
    .featured-meta {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: .75rem;
      font-size: .8125rem;
      font-weight: 500;
      color: var(--sl-500);
      margin-bottom: 1rem;
    }
    .badge-featured {
      background: var(--brand-primary);
      color: #fff;
      font-size: .625rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .12em;
      padding: .2rem .75rem;
      border-radius: 9999px;
    }
    .meta-dot {
      width: 4px; height: 4px;
      border-radius: 50%;
      background: var(--sl-400);
      display: inline-block;
    }
    .featured-title {
      font-size: clamp(1.75rem, 3vw, 2.25rem);
      font-weight: 800;
      line-height: 1.2;
      color: var(--sl-900);
      margin-bottom: 1.25rem;
      transition: color .2s;
    }
    .featured-desc {
      font-size: 1.0625rem;
      color: var(--sl-600);
      line-height: 1.75;
      margin-bottom: 2rem;
    }
    .read-link {
      display: inline-flex;
      align-items: center;
      gap: .4rem;
      color: var(--brand-primary);
      font-weight: 700;
      font-size: .9375rem;
      text-decoration: none;
      transition: gap .18s;
    }
    .read-link:hover { gap: .75rem; color: var(--brand-primary); }

    /* ── Recent articles ── */
    .recent-heading {
      font-size: 1.375rem;
      font-weight: 700;
      color: var(--sl-900);
      padding-bottom: 1rem;
      border-bottom: 1px solid var(--sl-200);
      margin-bottom: 2rem;
    }
    .article-row {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: 2rem;
      padding: 1.75rem;
      border-radius: 1rem;
      cursor: pointer;
      transition: background .18s;
      margin-bottom: 1rem;
    }
    .article-row:hover { background: var(--sl-100); }
    .article-row:hover .article-title { color: var(--brand-primary); }
    .article-row:hover .arrow-icon { color: var(--brand-primary); }
    .article-meta-col { width: 8rem; flex-shrink: 0; }
    .article-meta-col p { font-size: .8125rem; color: var(--sl-500); margin: 0; line-height: 1.6; }
    .article-body { flex: 1; }
    .category-pill {
      display: inline-block;
      padding: .2rem .75rem;
      background: var(--brand-primary);
      color: #fff;
      border-radius: 9999px;
      font-size: .6875rem;
      font-weight: 600;
      margin-bottom: .75rem;
    }
    .article-title {
      font-size: clamp(1.125rem, 2vw, 1.5rem);
      font-weight: 600;
      color: var(--sl-900);
      line-height: 1.3;
      margin-bottom: .6rem;
      transition: color .18s;
    }
    .article-desc {
      font-size: .9375rem;
      color: var(--sl-600);
      line-height: 1.7;
      margin: 0;
    }
    .arrow-icon {
      font-size: 1.375rem !important;
      color: var(--sl-400);
      transition: color .18s;
      flex-shrink: 0;
      padding-top: .2rem;
    }
    /* ── Sidebar ── */
    .sidebar-card { border-radius: 1.5rem; margin-bottom: 1.5rem; }
    .newsletter-card {
      background: var(--brand-primary);
      padding: 2rem;
      color: #fff;
    }
    .newsletter-icon { font-size: 1.875rem !important; }
    .newsletter-title { font-size: 1.125rem; font-weight: 700; margin: 0; }
    .newsletter-desc { font-size: .875rem; color: rgba(255,255,255,.8); line-height: 1.65; margin-bottom: 1.25rem; margin-top: .75rem; }
    .newsletter-input {
      width: 100%;
      background: rgba(255,255,255,.12) !important;
      border: 1px solid rgba(255,255,255,.22) !important;
      border-radius: .75rem !important;
      padding: .7rem 1rem !important;
      color: #fff !important;
      font-family: 'Poppins', sans-serif !important;
      font-size: .875rem !important;
      outline: none !important;
      margin-bottom: .75rem !important;
      transition: border-color .18s !important;
    }
    .newsletter-input::placeholder { color: rgba(255,255,255,.5); !important }
    .newsletter-input:focus { border-color: rgba(255,255,255,.65); !important }
    .newsletter-btn {
      width: 100% !important;
      background: #fff !important;
      color: var(--brand-primary) !important;
      font-family: 'Poppins', sans-serif !important;
      font-weight: 700 !important;
      font-size: .875rem !important;
      padding: .75rem !important;
      border: none !important;
      border-radius: .75rem !important;
      cursor: pointer !important;
      transition: background .18s !important;
      box-shadow: 0 4px 12px rgba(0,0,0,.12) !important;
    }
    .newsletter-btn:hover { background: #f8fafc !important; }
    .newsletter-fine {
      font-size: .625rem;
      color: rgba(255,255,255,.5);
      text-align: center;
      margin-top: .75rem;
      margin-bottom: 0;
    }
    .white-card {
      background: #fff;
      border: 1px solid var(--sl-100);
      box-shadow: 0 1px 3px rgba(0,0,0,.05);
      padding: 2rem;
    }
    .sidebar-section-title { font-size: 1rem; font-weight: 700; color: var(--sl-900); margin-bottom: 1.25rem; }
    .topic-tag {
      display: inline-block;
      padding: .3rem .75rem;
      background: var(--sl-100);
      color: var(--sl-600);
      border-radius: 9999px;
      font-size: .6875rem;
      font-weight: 600;
      text-decoration: none;
      margin: .2rem;
      transition: background .18s, color .18s;
    }
    .topic-tag:hover { background: rgba(236,91,19,.1); color: var(--brand-primary); }
    .stat-number { font-size: 1.875rem; font-weight: 600; color: var(--brand-primary); margin-bottom: .2rem; line-height: 1; }
    .stat-label  { font-size: .8125rem; font-weight: 500; color: var(--sl-500); }
    .stat-divider { border: none; border-top: 1px solid var(--sl-100); margin: 1.25rem 0; }
 /* Layout */
    .section-wrap {
      max-width: 1000px;
      margin: 0 auto;
      padding-left: 1.5rem;
      padding-right: 1.5rem;
    }
    .pb-section { padding-bottom: 5rem; }
    .mb-section  { margin-bottom: 4rem; }
    /* Placeholder boxes */
    .placeholder-box {
      background: var(--gray-50);
      border: 1px solid var(--gray-200);
      border-radius: .5rem;
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--gray-400);
      text-align: center;
      padding: 2rem;
    }
    .placeholder-box svg { opacity: .2; display: block; margin: 0 auto .5rem; }
    .placeholder-box p   { font-size: .875rem; margin: 0; }
    .placeholder-box span { font-size: .75rem; opacity: .5; }
    /* Breadcrumb */
    .breadcrumb-link {
      font-size: .875rem;
      color: var(--brand-primary);
      text-decoration: none;
      display: inline-flex;
      align-items: center;
      gap: .25rem;
    }
    .breadcrumb-link:hover { text-decoration: underline; color: var(--brand-primary); }
    /* Hero tags */
    .hero-tag {
      display: inline-block;
      padding: .25rem .75rem;
      background: var(--brand-primary-light);
      color: var(--brand-primary);
      font-size: .6875rem;
      font-weight: 600;
      border-radius: 9999px;
      border: 1px solid var(--brand-primary-border);
    }
    /* Hero text */
    .case-eyebrow {
      font-size: .625rem;
      font-weight: 700;
      letter-spacing: .15em;
      text-transform: uppercase;
      color: var(--brand-primary);
      margin-bottom: 1rem;
    }
    .hero-title {
      font-size: clamp(2rem, 4.5vw, 3rem);
      font-weight: 800;
      color: var(--gray-900);
      line-height: 1.15;
      margin-bottom: 1.25rem;
    }
    .hero-subtitle {
      font-size: 1.0625rem;
      color: var(--gray-600);
      margin-bottom: 3rem;
    }
    /* Metrics ribbon */
    .metrics-ribbon {
      border-top: 1px solid var(--gray-200);
      border-bottom: 1px solid var(--gray-200);
      padding: 2.5rem 0;
      margin-bottom: 4rem;
    }
    .ribbon-number {
      font-size: clamp(2rem, 4vw, 2.5rem);
      font-weight: 800;
      color: var(--gray-900);
      margin-bottom: .25rem;
    }
    .ribbon-label {
      font-size: .6875rem;
      color: var(--gray-500);
      text-transform: uppercase;
      font-weight: 500;
      letter-spacing: .06em;
    }
    /* Context */
    .context-text { font-size: .9375rem; color: var(--gray-700); line-height: 1.75; margin-bottom: 2rem; }
    .finding-row {
      display: flex;
      align-items: flex-start;
      gap: 1rem;
      padding: 1rem 1.25rem;
      background: var(--gray-100);
      border-left: 4px solid var(--brand-primary);
      border-radius: 0 .375rem .375rem 0;
      margin-bottom: .75rem !important;
    }
    .finding-bullet { color: var(--brand-primary); font-weight: 700; flex-shrink: 0; }
    .finding-text   { font-size: .875rem; color: var(--gray-700); margin: 0; line-height: 1.65; }
    .blockquote-simple {
      font-style: italic;
      color: var(--gray-500);
      border-left: 2px solid var(--gray-200);
      padding: .5rem 1rem;
      font-size: .9375rem;
      line-height: 1.7;
    }
    /* Big goal */
    .big-goal-section { background: var(--gray-50); padding: 5rem 1.5rem; }
    .big-goal-eyebrow {
      font-size: 1rem;
      font-weight: 700;
      letter-spacing: .15em;
      text-transform: uppercase;
      color: var(--brand-primary);
      margin-bottom: 1rem;
    }
    .big-goal-title {
      font-size: clamp(1.5rem, 3vw, 2.25rem);
      font-weight: 800;
      color: var(--gray-900);
      line-height: 1.3;
      max-width: 36rem;
      margin: 0 auto;
    }
    /* Section headings */
    .section-heading    { font-size: 1.5rem; font-weight: 700; color: var(--gray-900); margin-bottom: .5rem; }
    .section-subtext    { font-size: .875rem; color: var(--gray-500); margin-bottom: 2rem; }
    .section-eyebrow    {
      font-size: 1rem; font-weight: 700; letter-spacing: .15em;
      text-transform: uppercase; color: var(--brand-primary); margin-bottom: .5rem;
    }
    .section-big-title  {
      font-size: clamp(1.75rem, 3.5vw, 2.25rem);
      font-weight: 800; color: var(--gray-900); margin-bottom: 2rem;
    }
    /* Step rows */
    .step-row {
      display: flex;
      align-items: center;
      gap: .75rem;
      padding: 1rem 1.25rem;
      background: #fff;
      border: 1px solid var(--gray-100);
      border-radius: .5rem;
      box-shadow: 0 1px 3px rgba(0,0,0,.05);
      margin-bottom: .75rem !important;
    }
    .step-check {
      background: var(--brand-primary);
      border-radius: 9999px;
      width: 1.75rem; height: 1.75rem;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }
    .step-check svg { width: 1rem; height: 1rem; fill: #fff; }
    .step-text { font-size: .875rem; font-weight: 500; color: #1f2937; margin: 0; }

    /* Result cards */
    .results-eyebrow {
      font-size: 1rem; font-weight: 700; letter-spacing: .15em;
      text-transform: uppercase; color: var(--brand-primary); margin-bottom: 1rem;
    }
    .result-card {
      background: var(--gray-200);
      border: 1px solid var(--gray-400);
      border-radius: .75rem;
      padding: 1.5rem;
      display: flex;
      align-items: flex-start;
      gap: .75rem;
      height: 100%;
    }
    .result-emoji { font-size: 1.25rem; flex-shrink: 0; margin-top: .1rem; }
    .result-text  { font-size: .875rem; font-weight: 700; color: var(--gray-900); margin: 0; }
    .results-quote {
      font-style: italic; color: var(--gray-500); font-size: .875rem;
      text-align: center; max-width: 42rem; margin: 0 auto;
    }
    /* Stat cards */
    .stat-card {
      background: #fff;
      border: 1px solid var(--gray-100);
      border-radius: 1rem;
      padding: 1.5rem;
      box-shadow: 0 1px 3px rgba(0,0,0,.05);
      height: 100%;
    }
    .stat-card-eyebrow {
      font-size: 1rem; font-weight: 700; letter-spacing: .15em;
      text-transform: uppercase; color: var(--brand-primary);
    }
    .stat-badge-up {
      display: inline-flex; align-items: center; gap: .2rem;
      font-size: 1rem; font-weight: 700; color: var(--brand-primary);
    }
    .stat-badge-up svg { width: .75rem; height: .75rem; fill: var(--brand-primary); }
    .stat-big   { font-size: clamp(2rem, 4vw, 2.5rem); font-weight: 800; color: var(--gray-900); margin: .75rem 0; }
    .stat-desc  { font-size: 1rem; color: var(--gray-600); line-height: 1.65; margin-bottom: .75rem; }
    .stat-impact { font-size: 1rem; color: var(--gray-700); line-height: 1.65; margin: 0; }
    /* Before / after traffic */
    .traffic-before-after {
      display: flex; flex-wrap: wrap; align-items: center;
      justify-content: center; gap: 3rem; margin-bottom: 3rem;
    }
    .traffic-col { text-align: center; }
    .traffic-col-label {
      font-size: .5625rem; font-weight: 700; letter-spacing: .15em;
      text-transform: uppercase; color: var(--brand-primary); margin-bottom: .4rem;
    }
    .traffic-col-number { font-size: 2rem; font-weight: 800; color: var(--gray-900); }
    .traffic-col-sub    { font-size: .5625rem; color: var(--gray-500); text-transform: uppercase; letter-spacing: .06em; }
    .traffic-badge {
      background: var(--brand-primary-light); color: var(--brand-primary);
      border: 1px solid var(--brand-primary-border); border-radius: .75rem;
      padding: 1rem 1.5rem; text-align: center;
    }
    .traffic-badge-pct { font-size: 1.5rem; font-weight: 800; margin: 0; }
    .traffic-badge-lbl { font-size: .5625rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; margin: 0; }
    .traffic-body-text  { font-size: .875rem; color: var(--gray-600); line-height: 1.75; margin-bottom: .75rem; max-width: 48rem; }
    .traffic-impact-text { font-size: .6875rem; color: var(--gray-700); line-height: 1.7; max-width: 48rem; }
    /* Footer CTA */
    .footer-cta { background: var(--gray-50); padding: 5rem 1.5rem; }
    .footer-cta-text {
      font-size: .9375rem; color: var(--gray-600); line-height: 1.75;
      max-width: 40rem; margin: 0 auto 2.5rem; text-align: center;
    }
    .cta-btn {
      display: inline-flex; align-items: center; gap: .5rem;
      padding: .75rem 2rem; background: var(--brand-primary); color: #fff;
      font-family: 'Poppins', sans-serif; font-weight: 700; font-size: .875rem;
      border-radius: .5rem; text-decoration: none; border: none;
      transition: background .18s;
    }
    .cta-btn:hover { background: #000; color: #fff; }
    .cta-btn svg { width: 1rem; height: 1rem; }
     .cta-breadcrumb{
       padding-top: 12rem !important;
     }
 /* ── Page wrap ── */
    .page-wrap-blog-internal {
      max-width: 780px;
      margin: 0 auto;
      padding: 0rem 0 1.5rem;
    }
    /* ── Back link ── */
    .back-link {
      display: inline-flex;
      align-items: center;
      gap: .35rem;
      font-size: .8125rem;
      color: var(--brand-primary);
      text-decoration: none;
      font-weight: 500;
      padding: 2rem 0 2.5rem;
      display: block;
    }
    .back-link:hover { text-decoration: underline; color: var(--brand-primary); }
    .back-link svg { width: .75rem; height: .75rem; vertical-align: middle; margin-right: .2rem; }
    /* ── Article meta ── */
    .article-meta {
      display: flex;
      align-items: center;
      gap: .75rem;
      margin-bottom: 1.25rem;
      flex-wrap: wrap;
    }
    .meta-category {
      display: inline-block;
      padding: .2rem .65rem;
      border: 1px solid var(--gray-300, #d1d5db);
      border-radius: .25rem;
      font-size: .6875rem;
      font-weight: 500;
      color: var(--gray-700);
      background: #fff;
    }
    .meta-date, .meta-read {
      font-size: .8125rem;
      color: var(--gray-500);
    }
    .meta-dot {
      width: 3px; height: 3px;
      border-radius: 50%;
      background: var(--gray-400);
      display: inline-block;
    }
    /* ── Article header ── */
    .article-title {
      font-size: clamp(1.75rem, 4vw, 2.375rem);
      font-weight: 700;
      color: var(--gray-900);
      line-height: 1.2;
      margin-bottom: 1.25rem;
      letter-spacing: -.02em;
    }
    .article-lead {
      font-size: 1rem;
      color: var(--gray-600);
      line-height: 1.7;
      margin-bottom: 2.5rem;
    }
    /* ── Divider ── */
    .article-divider {
      border: none;
      border-top: 1px solid var(--gray-100);
      margin: 2rem 0;
    }
    /* ── Body text ── */
    .article-body p {
      font-size: .9375rem;
      color: var(--gray-700);
      line-height: 1.8;
      margin-bottom: 1.25rem;
    }
    .article-body li{
        font-size: .9375rem;
        color: var(--gray-700);
    }
    .article-body h2 {
      font-size: 1.375rem;
      font-weight: 700;
      color: var(--gray-900);
      margin-top: 2.5rem;
      margin-bottom: 1rem;
      letter-spacing: -.01em;
    }
    .article-body h3 {
      font-size: 1.1rem;
      font-weight: 700;
      color: var(--gray-900);
      margin-top: 2.5rem;
      margin-bottom: 1rem;
      letter-spacing: -.01em;
    }
    .blog-toc-wrap .blogFaqs.custom-accordion .accordion-button {
    padding: 0 !important;
}
.blog-toc-wrap .footer-cta {
    padding: 2rem 1.5rem;
    margin-bottom: 15px;
}
    /* ── Blockquote ── */
    .article-body blockquote {
      border-left: 3px solid var(--gray-300, var(--brand-primary));
      margin: 1.75rem 0;
      padding: .25rem 1.25rem;
    }
    .article-body blockquote p {
      font-style: italic;
      color: var(--brand-primary);
      font-size: .9375rem;
      margin: 0;
    }
    /* ── Author block ── */
    .author-block {
      display: flex;
      gap: .875rem;
      padding: 2.5rem 0 2rem;
      border-top: 1px solid var(--gray-100);
      margin-top: 3rem;
    }
    .author-avatar {
    width: 6rem;
    height: 6rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: start;
    flex-shrink: 0;
    }
    .author-avatar .author-img {
    border-radius: 50%;
    }
    .author-name {
    font-size: .875rem;
    font-weight: 600;
    color: var(--brand-primary);
    margin: 0;
    line-height: 1.3;
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
    }
    .author-published {
      font-size: .75rem;
      color: var(--gray-500);
      margin: 0;
    }
    /* ── More from newsroom ── */
    .more-section-title {
      font-size: 1.125rem;
      font-weight: 700;
      color: var(--gray-900);
      margin-bottom: 1.25rem;
    }
    .related-item {
      padding: .875rem 0;
      border-bottom: 1px solid var(--gray-100);
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: 1rem;
      cursor: pointer;
      text-decoration: none;
    }
    .related-item:hover .related-title { color: var(--brand-primary); }
    .related-item:last-child { border-bottom: none; }

    .related-left { flex: 1; }
    .related-category {
      font-size: .625rem;
      font-weight: 600;
      color: var(--gray-500);
      text-transform: capitalize;
      display: block;
      margin-bottom: .2rem;
    }
    .related-title {
      font-size: .9rem;
      font-weight: 600;
      color: var(--gray-900);
      line-height: 1.4;
      transition: color .18s;
      margin: 0;
    }
    .related-read {
      font-size: .75rem;
      color: var(--gray-400);
      white-space: nowrap;
      flex-shrink: 0;
      padding-top: 1rem;
    }
.blog-sidebar {
    position: relative;
}
.blog-sidebar-inner {
    position: sticky;
    top: 10%;
}
    @media (max-width: 991px) {
      .article-meta-col { display: none; }
      .article-row { padding: 1.25rem; }
    }
    .home-case-bg {
      width: 100%;
      background: linear-gradient(135deg, #e8e8e8 0%, #f4f4f4 50%, #ebebeb 100%);
    }
    .home-hero-inner{
      padding: 80px 60px 40px;
      min-height: 750px;
      display: flex;
      align-items: end;
      position: relative;
      overflow: hidden;
    }
    .growth.casestudy.py-5.lozad.bg.home-hero-inner {
    background-position-y: 60%, 120% , bottom;
    background-position-x: left, right, 30%;
    }
    .home-hero-section::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0; bottom: 0;
      background: radial-gradient(ellipse at 70% 50%, rgba(0,188,212,0.06) 0%, transparent 60%);
      pointer-events: none;
    }
    .agency-label {
      font-family: 'Poppins', sans-serif;
      font-weight: 500;
      font-size: 30px;
      line-height: 70px;
      letter-spacing: -0.03em;
      text-transform: capitalize;
      color: #444;
      margin-bottom: 0px;
    }
    .home-hero-section .hero-headline {
      font-family: 'Poppins', sans-serif;
      font-weight: 500;
      font-size: 60px;
      line-height: 70px;
      letter-spacing: -0.03em;
      text-transform: uppercase;
      color: #0d2b4e;
      margin-bottom: 12px;
    }
   .home-hero-section .hero-subline {
      font-family: 'Poppins', sans-serif;
      font-weight: 500;
      font-size: 40px;
      line-height: 70px;
      letter-spacing: -0.03em;
      text-transform: uppercase;
      color: #0d2b4e;
      margin-bottom: 28px;
      display: flex;
      align-items: center;
      gap: 12px;
      flex-wrap: wrap;
    }
    .home-hero-section .cycled-word {
      color: #00bcd4;
      display: inline-block;
      position: relative;
      min-width: 160px;
    }
    .home-hero-section .cycled-word .word {
      display: inline-block;
      transition: opacity 0.4s ease, transform 0.4s ease;
      opacity: 1;
      transform: translateY(0);
    }
    .home-hero-section .cycled-word .word.fade-out {
      opacity: 0;
      transform: translateY(-10px);
    }
    .cycled-word .word.fade-in {
      opacity: 0;
      transform: translateY(10px);
    }.custom-accordion button.accordion-button {
    border: 0px !important;
}

.bg-l.drop-down-cont.br.small-dropDown .container {
    padding-top: 0px;
}
.drop-down-cont.small-dropDown {
    top: 34px;
}
.nr-dropDown {
    position: relative;
}
.small-dropDown .bg-drop {
    background: #edf0f0;
}
.small-dropDown {
    box-shadow: 0px 0px 0px 0px #0606063d !important;
}
.small-dropDown .row.py-3.border-top {
    background: #f1f1f1;
    border-top: 1px solid #fff
}
.about-section {
background: url(../img/about-bg-img.jpg);
background-repeat: no-repeat;
background-size: cover;
height: 228px;
display: flex;
align-items: center;
justify-content: center;
margin-top: 150px;
}
.about-section h1 {
font-family: Poppins;
font-weight: 500;
font-style: Medium;
font-size: 60px;
leading-trim: NONE;
line-height: 100%;
letter-spacing: -2%;
text-transform: uppercase;
color: #fff;    
}
.sound-like-section .section-heading {
    letter-spacing: -2%;
}
.sound-like-section .cta-heading, 
.sound-like-section .section-heading {
    font-size: 2.5rem;
    line-height: 100%;
    margin-bottom: 50px;
    text-align: center;
    text-transform: uppercase;
}
.sound-like-section {
    padding: 5rem 0 2rem;
}
.sound-like-section .section-heading .highlight,
.sound-like-section .cta-heading .highlight{
    font-weight: 600;
    color: var(--brand-primary)
}
.abt-cols-grid {
    gap: 8.2rem;
    flex-wrap: nowrap;
    margin-bottom: 50px;
}
.pain-item,
.question-row{
    padding: 30px 70px;
    font-weight: 400;
    font-size: 1.5rem;
}
.pain-item strong,
.question-row strong,
.section-title-small strong{
    color: var(--brand-primary) 
}
.pain-item:hover,
.question-row:hover{
background: #F1F5F9;    
}
.sound-like-section .cta-area {
    text-align: center;
}
.pain-list {
    margin-top: 5rem;
}
.sound-like-section .growth.casestudy.py-5.lozad.bg {
    background-position-x: left, right, 47%;
    background-position-y: 60%, bottom, center;
    background-size: 4vw, 10vw, 5vw;
}
.section-title-small {
    font-size: 1.9rem;
    text-transform: uppercase;
    margin: 50px 0 20px;
}
.section-title-small strong{
    color: var(--brand-primary) 
}
.founder-img-container {
  position: relative;
  display: inline-block;
  max-width: 704px;
}
.founder-img-container img {
  width: 100%;
  display: block;
  transition: opacity 0.4s ease;
}
/* Normal image */
.f-img-normal {
  position: relative;
  opacity: 1;
}
/* Hover image */
.f-img-hover {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}
/* On hover */
.founder-img-container:hover .f-img-normal {
  opacity: 0;
}
.founder-img-container:hover .f-img-hover {
  opacity: 1;
}
.founderSection {
    padding-top: 6rem;
    padding-bottom: 6rem;
}
.founderSection .btn-get-in-touch {
    display: block;
    margin-top: 3rem;
}
section.founderSection.text-center.growth.casestudy.py-5.lozad.bg {
    background-position-x: 95%, right;
    background-position-y: 90%, 20%;
}
.homebannerTxt {
    font-size: 18px;
}
.privacy-section {
    padding-top: 3.1rem;
    padding-bottom: 4rem;
    position: relative;
}
section.privacy-section-Top {
    margin-top: 10rem;
}
.container.max-width-980  {
    max-width: 980px !important;
    margin: auto;
}
.privacy-section-Top .section-title {
    font-size: 3.7rem;
}
section.privacy-section.border-bottom {
    border-bottom: 0 !important;
}
section.privacy-section.border-bottom:after {
    content: '';
    background: #00000036;
    width: 80%;
    height: 1px;
    position: absolute;
    margin: auto;
    left: 0;
    right: 0;
    bottom: 0;
}
section.privacy-section.bg {
    background-size: 10vw, 3vw !important;
    background-position-x: right, 2%;
    background-position-y: 50%, 5%;
}
section.privacy-section.bg.privacy-cta {
    background-size: 4vw !important;
    background-position-x: 90%;
}
.container.max-width-1277 {
    max-width: 1277px !important;
}
section.privacy-section.term .section-title{
    margin-top: 2rem;
}
section.privacy-section.bg.term {
    background-size: 10vw, 3vw, 3vw, 10vw, 3vw, 3vw, 3vw !important;
    background-position-x: right, left, left, right, right, left, right !important;
    background-position-y: 10%, 0%, 40%, 50%, 60%, 70%, 80% !important;
}
.ftr-nav {
    display: flex;
    list-style: none;
    justify-content: end;
    gap: 15px;
    padding: 0;
    margin: 0;
    font-size: 0.9rem;
}
.section-career{
    padding:100px 0;
    background: #ffffff;
}
.section-career .main-title{
    font-size: 3.75rem;
    font-weight: 600;
    line-height:1.2;
}
.section-career .subtitle{
    color:#000;
    max-width: 867px;
    font-size: 1rem;
}
.section-career .info-card{
    background: #F9F9F9;
    border: 1px solid #EBEBEB;
    padding:20px 30px;
    height:100%;
}
.section-career .section-title {
    position: relative;
}
.section-career  .headIcon {
    position: absolute;
    left: -7%;
}
.section-career .subtitle b {
    font-weight: 600 !important;
}
.section-career .side-box h6 {
    font-size: 1.25rem;
}
.section-career .side-box{
    background: #F9F9F9;
    padding:30px;
    border: 1px solid #EBEBEB;
}
.section-career .btn-outline-dark{
    width:100%;
    margin-bottom:10px;
}
.section-career .btn-dark{
    width:100%;
}
.section-career .info-card h6 {
    font-size: 1.25rem;
    font-weight: 600;
    margin-top: 1rem;
}
.section-career .info-card p {
    color: #585C5E !important;
    font-size: 1rem;
}
.section-career .btn {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 15px !important;
}
.section-career .btn-outline-dark:hover rect {
    stroke: #fff;
}
.section-career .btn.btn-2.btn-dark:hover :is(rect, path)  {
     stroke: #0b1f4c;
}
.section-career .itm-icon {
  background: #fff;
  display: flex;
  width: 40px;
  justify-content: center;
  height: 40px;
  align-items: center;
}
#careerFaqAccordion .accordion-button .btn-icon {
    margin-right: 10px;
}
#careerFaqAccordion .accordion-item {
    border: 0px !important;
    border-radius: 0 !important;
}
#careerFaqAccordion .accordion-body {
    font-size: 1rem !important;
    padding-top: 20px !important;
}
#careerFaqAccordion .accordion-button {
    padding: 10px !important;
    justify-content: center !important;
    font-size: 1.1rem !important;
    border: 1px solid #000 !important;
    border-radius: 0 !important;
    font-weight: 500 !important;
}
#careerFaqAccordion .accordion-button::after {
    margin-left: 6px;
    transform: scale(0.5) !important;
    filter: brightness(0) !important;
}
#careerFaqAccordion .accordion-button[aria-expanded="true"] {
    background: #0B1F4C !important;
    color: #fff !important;
}
#careerFaqAccordion .accordion-button[aria-expanded="true"] rect {
    stroke: #fff !important;
}

#careerFaqAccordion .accordion-button[aria-expanded="true"]::after {
    filter: invert(1) brightness(1) !important;
    transform: rotate(184deg) scale(0.5) !important;
}
.brand-section-logos .c-logo {
    width: 200px;
}
.insightLink {
    display: block;
    width: 100%;
}
.insightLink a {
    padding: 20px 0;
}
#header.sticky{
  position:fixed;
  top:0;
  left:0;
  transform: translateY(0);
  z-index:1000;
}
#header.hide{
  transform: translateY(-100%);
}
header.sticky {
    background: #fff;
    box-shadow: -2px 1px 4px 2px #0000002e;
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
}
header#header {
    transition: 0.5s ease;
}
section.py-5.lozad.bg.revSec {
    background-position-y: 20%, 115%, 101%;
}
.text-right{
    text-align: right;
}
.logo.tiffen {height: 60px;}
div#pills-tabContent .tab-pane .col {
    position: relative;
}
div#pills-tabContent .tab-pane .ico {
    position: absolute;
    bottom: 10%;
    right: 9%;
}
div#pills-tabContent .tab-pane .col a.btn {
    margin-top: 20px;
}
.contact-form .ps-0  label {
    padding-left: 8px;
}

.letter {
    background: #FFF;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
    padding: 41px;
    text-align: left;
    transition: 0.5s ease;
}
.letter:hover{
    background: #FAFDFF;
box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
}
.letter h2 {
    font-size: 40px;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -0.8px;
    text-transform: uppercase;
}
.letterSubheading {
    color:  #585C5E;
    font-family: Poppins;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
.letterText {
    color: var(--Light-Gray, #585C5E);
    font-family: Poppins;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.letterText b {
    font-weight: 500;
}
.needsclick.kl-private-reset-css-Xuajs1 {
    padding-right: 10px;
}
section a {
    color: #0a58ca;
}
.serviceBullets{
    list-style: none;
}
/* ── Scoped entirely to .blog-toc-wrap so nothing leaks into header ── */

  .blog-toc-wrap {
    display: grid;
    grid-template-columns: 240px 1fr 56px;
    gap: 0;
    max-width: 1200px;
    margin: 0 auto;
    padding: 12rem 1rem;
    align-items: start;
  }

  /* LEFT – Table of Contents */
  .blog-toc-wrap .toc-sidebar {
    position: sticky;
    top: 7rem;
  }

  .blog-toc-wrap .toc-label {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #9ca3af;
    margin-bottom: 1rem;
  }

  .blog-toc-wrap .toc-list {
    list-style: none;
    border-left: 2px solid #e5e7eb;
    padding-left: 0;
    margin: 0;
  }

  .blog-toc-wrap .toc-list li a {
    display: block;
    padding: 0.35rem 0 0.35rem 1rem;
    font-size: 0.8rem;
    color: #6b7280;
    text-decoration: none;
    border-left: 2px solid transparent;
    margin-left: -2px;
    transition: color 0.2s, border-color 0.2s;
    line-height: 1.4;
  }

  .blog-toc-wrap .toc-list li a:hover,
  .blog-toc-wrap .toc-list li a.toc-active {
    color: #111;
    border-left-color: #111;
  }

  /* RIGHT – Social Icons */
  .blog-toc-wrap .social-sidebar {
    position: sticky;
    top: 7rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding-left: 1.5rem;
  }

  .blog-toc-wrap .social-label {
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #9ca3af;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    margin-bottom: 0.5rem;
  }

  .blog-toc-wrap .social-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    border: 1.5px solid #e5e7eb;
    background: #fff;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.2s, border-color 0.2s, transform 0.15s;
    color: #6b7280;
  }

  .blog-toc-wrap .social-btn:hover { transform: translateY(-2px); }
  .blog-toc-wrap .social-btn svg   { width: 16px; height: 16px; }

  .blog-toc-wrap .social-btn.s-twitter:hover  { background: #000;    border-color: #000;    color: #fff; }
  .blog-toc-wrap .social-btn.s-linkedin:hover { background: #0a66c2; border-color: #0a66c2; color: #fff; }
  .blog-toc-wrap .social-btn.s-facebook:hover { background: #1877f2; border-color: #1877f2; color: #fff; }
  .blog-toc-wrap .social-btn.s-whatsapp:hover { background: #F00384; border-color: #F00384; color: #fff; }
  .blog-toc-wrap .social-btn.s-copy:hover     { background: #6366f1; border-color: #6366f1; color: #fff; }

  .blog-toc-wrap .social-btn.s-copy { position: relative; }

  .blog-toc-wrap .copy-tooltip {
    position: absolute;
    right: 46px;
    background: #111;
    color: #fff;
    font-size: 0.72rem;
    padding: 0.3rem 0.6rem;
    border-radius: 6px;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s;
  }
  .blog-toc-wrap .copy-tooltip.show { opacity: 1; }

  .blog-toc-wrap .social-divider {
    width: 1px;
    height: 20px;
    background: #e5e7eb;
  }
  .blog-toc-wrap .article-body a {
    font-weight: 600;
    text-decoration: underline;
    color: #0b1f4c;
}
.blog-toc-wrap .article-body .cta-btn{
    color: #fff;
    text-decoration: none;
}
.blog-toc-wrap .blogFaqs.custom-accordion .accordion-body{
font-size: 0.8rem !important;
}
.article-blog-banner {
    background-position: center;
    background-size: 100%;
    padding: 150px 30px;
    margin-bottom: 30px;
    background-repeat: no-repeat;
    position: relative;
}
.article-blog-banner h1.article-title {
    max-width: 70%;
}
.article-blog-banner h1.article-title span {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.2;
    display: block;
    margin-top: 10px;
}
.article-blog-banner:after {
    content: '';
    background: #ffffff82;
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    bottom:0;
    z-index: 1;
    left: 0;
}
.article-blog-banner > * {
    z-index: 2;
    position: relative;
}
.article-blog-banner h1.article-title br {
    display: none;
}
/* NEW SERVICE PAGE CSS */
.hero.paid-media-hero, 
.what-paid-media-really-means, 
.outcomes-section, 
.nespresso-vs-keurig-section, 
.how-we-force-your-budget-section, 
.why-companies-struggle-section,
.six-services-section,
.behavior-section 
{
    background: #fff;
}
.section-bg.funnel-dashboard-section{
    background: #FAFAFA;
}
/* ── Hero (page-specific) ── */
.hero.paid-media-hero {
  padding: 40px 0 60px;
  margin-top: 150px;
}
.hero.paid-media-hero ol.breadcrumb {
    margin-bottom: 48px;
}
.hero.paid-media-hero h1 {
  font-size: 90px;
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.1;
  margin-bottom: 92px;
  color: #000;
}
.hero.paid-media-hero h1 span.highlight {
  color: #0B1F4C;
}
.paid-media-hero .btn {
  font-size: 16px;
}
.hero.paid-media-hero .hero-subtitle {
  font-size: 1rem;
  color: #282828;
}
.hero.paid-media-hero .hero-subtitle-text-left {
  position: relative;
  padding-right: 55px;
}
.hero.paid-media-hero .hero-subtitle-text-left:after {
  content: '';
  position: absolute;
  background: var(--color-border);
  width: 1px;
  height: 100%;
  top: 0;
  right: 4%;
}
.hero.paid-media-hero .hero-buttons {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}
section.section.what-paid-media-really-means p,
.funnel-dashboard-section p,
.outcomes-section p,
.section.nespresso-vs-keurig-section p,
.how-we-force-your-budget-section p,
.convert-more-section p {
    font-size: 1rem;
    line-height: 1.7;
}
/* ── Paid Media Section ── */
.what-paid-media-really-means h2 {
  font-size: 40px;
  line-height: 100%;
  letter-spacing: -2%;
  text-transform: uppercase;
}
section.section.what-paid-media-really-means p span {
    font-weight: 600;
    color: #1F3159;
}
.what-paid-media-really-means h2 .highlight {
  color: #0B1F4C;
}
.section.what-paid-media-really-means .container {
    max-width: 1400px !important;
}
/* ── Section Background ── */
.section-bg {
  background: var(--color-bg-section);
}
/* ── Section (padding wrapper) ── */
.section {
  padding: 80px 0;
}
.section-header {
  margin-bottom: 40px;
}
.section-header h2 {
  margin-bottom: 16px;
  text-transform: uppercase;
  font-size: 2.5rem;
}
.section-header p {
  max-width: 990px;
}
.section-header.left {
  text-align: left;
}
.section-label {
  display: inline-block;
  font-size: 16px;
  color: var(--color-teal);
  margin-bottom: 16px;
}
.section-header h2 {
    font-size: 2.5rem;
    line-height: 1.2;
}
/* ── Divider ── */
.divider {
  height: 1px;
  background: #EDEDED;
  border: none;
  margin: 0;
}
/* ── Funnel Dashboard ── */
.funnel-dashboard-section .section-header.left.col-md-6 {
  width: 52%;
}
.funnel-dashboard-section .funnel-dashboard-img.col-md-6 {
  width: 48%;
}
.dashboard-grid {
  display: grid;
  grid-template-columns: 697px 452px 298px 298px;
  gap: 0;
  background: var(--color-bg-section);
  border: 1px solid var(--color-border);
  border-radius: 20px;
  overflow: hidden;
}
.funnel-dashboard-section .funnel-summary {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 24px 0;
}
.funnel-dashboard-section .funnel-summary .label {
  font-family: 'JetBrains Mono', monospace;
  font-size: 7px;
  color: #0B1F4C;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.funnel-dashboard-section .funnel-summary .value {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  color: #000;
}
.funnel-dashboard-section .funnel-summary .hint {
  font-family: 'Poppins', sans-serif;
  font-size: 9px;
  color: #000;
}

/* ── Outcome Cards ── */
.outcomes-section .outcome-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.outcomes-section .outcome-card {
  background: #FAFAFA;
  border-radius: 20px;
  padding: 32px;
}
.outcomes-section .outcome-card .card-icon {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: #0ABCD8;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
}
.outcomes-section .outcome-card h4 {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 12px;
  line-height: 1.3;
}
.outcomes-section .outcome-card p {
  font-size: 16px;
  max-width: 290px;
}

/* ── Comparison Section ── */
.nespresso-vs-keurig-section .comparison-layout {
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: start;
}
.nespresso-vs-keurig-section .comparison-left {
  padding-right: 98px;
}
.nespresso-vs-keurig-section .comparison-side-label {
  font-size: 16px;
  color: #000;
  margin-bottom: 8px;
}
.nespresso-vs-keurig-section .comparison-result-text {
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 12px;
}
.nespresso-vs-keurig-section .comparison-result-text.red {
  color: var(--color-red);
}
.nespresso-vs-keurig-section .comparison-result-text.navy {
  color: #0B1F4C;
}

/* ── Teal Card ── */
.nespresso-vs-keurig-section .teal-card {
  background: var(--color-teal-light);
  border-radius: 12px;
  padding: 24px;
}
.nespresso-vs-keurig-section .teal-card .side-label {
  font-size: 16px;
  color: #0B1F4C;
  margin-bottom: 8px;
}
.nespresso-vs-keurig-section .teal-card .result-text {
  font-size: 16px;
  color: #0B1F4C;
  margin-bottom: 16px;
}
.nespresso-vs-keurig-section .teal-card.card1, .nespresso-vs-keurig-section .teal-card.card2{
    border: 1px solid transparent;
}
.nespresso-vs-keurig-section .teal-card.card1:hover {
    border: 1px solid #FF0000;
}
.nespresso-vs-keurig-section .teal-card .card-labels {
    display: flex;
    justify-content: space-between;
}
.nespresso-vs-keurig-section .teal-card.card1  .result-text {
    color: #FF0000;
}
.nespresso-vs-keurig-section .teal-card.card2:hover {
    border: 1px solid #0ABCD8;
}
.nespresso-vs-keurig-section .teal-card.card1 .side-label {
    color: #000;
}
/* ── Steps Grid ── */
.how-we-force-your-budget-section .steps-grid {
  display: grid;
  grid-template-columns: 447px 447px 447px;
  gap: 74px;
}
.how-we-force-your-budget-section .step-number {
  font-size: 40px;
  font-weight: 400;
  color: #000;
  margin-bottom: 12px;
  opacity: 0.4;
}
.how-we-force-your-budget-section .step-card h4 {
  font-size: 20px;
  font-weight: 600;
  color: #0B1F4C;
  margin-bottom: 8px;
}
.how-we-force-your-budget-section .section-header.left {
    margin-bottom: 50px;
}
/* ── Process Section ── */
.process-section .process-header-bar {
  background: var(--color-bg-dark);
  padding: 28px 32px;
  border-radius: 25px 25px 0 0;
}
.process-section .process-header-bar h2 {
  font-size: 40px;
  font-weight: 400;
  color: #FFFFFF;
  margin: 0;
}
.process-section .process-2col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
}
.process-section .process-card {
  background: var(--color-bg-dark);
  padding: 28px;
  min-height: 380px;
}
.process-section .process-card h4 {
  font-size: 20px;
  font-weight: 600;
  color: #FFFFFF;
  margin-bottom: 16px;
  letter-spacing: 0;
}
.process-section .process-card p,
.process-section .process-card ul li {
  font-size: 16px;
  color: hsl(0deg 0% 100% / 69%);
  line-height: 1.7;
}
.process-section .process-card ul {
    list-style: none;
    padding: 0;
}
.process-section .process-card ul li strong {
    display: block;
    letter-spacing: 0;
    color: #fff;
}
.process-section .process-card p {
  margin-bottom: 12px;
}
.process-2col .process-card:nth-child(1) p {
    margin-bottom: 55px;
}
.process-section .process-card ul li {
  margin-bottom: 32px;
  position: relative;
}
.process-section .process-card h4 span {
    color: #0ABCD8;
}
.process-2col .process-card {
    position: relative;
}
.process-2col .process-card:nth-child(1) p {
    margin-bottom: 55px;
}
.process-2col .process-card:nth-child(3) {
    border-radius: 0 0 0 25px;
}
.process-2col .process-card:nth-child(4) {
    border-radius: 0 0 25px 0;
}
/* Card 1 - right border */
.process-2col .process-card:nth-child(1)::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 1px;
    height: 100%;
    background: #ededed78;
}
/* Card 2 - bottom border */
.process-2col .process-card:nth-child(2)::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 95%;
    height: 1px;
    background: #ededed78;
}
/* Card 3 - top border */
.process-2col .process-card:nth-child(3)::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 95%;
    height: 1px;
    background: #ededed78;
}
/* Card 4 - left border */
.process-2col .process-card:nth-child(4)::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 95%;
    background: #ededed78;
}
.section.why-companies-struggle-section .section-header.center {
    text-align: center;
    max-width: 790px;
    margin:  0 auto;
}
.section.why-companies-struggle-section .section-header p {
    max-width: unset;
}
.section.why-companies-struggle-section p{
    font-size: 1rem;
}
.section.why-companies-struggle-section .section-header h2 {
    font-size: 1.25rem;
    font-weight: 600;
    color: #0B1F4C;
}
.section.why-companies-struggle-section .struggle-grid {
    max-width: 731px;
    margin: 0 auto;
}
.section.why-companies-struggle-section .struggle-grid h4 {
    font-size: 1rem;
    font-weight: 600;
    color: #0B1F4C;
}
.section.why-companies-struggle-section .struggle-card {
    position: relative;
    padding-left: 34px;
    border-left: 1px solid #EDEDED;
    transition: 0.5s ease;
}
.section.why-companies-struggle-section .struggle-card:before {
    content: '';
    background: #EDEDED;
    position: absolute;
    width: 10px;
    height: 2px;
    left: 2%;
    top: 16%;
}
.section.why-companies-struggle-section .struggle-card:hover:before {
    background: #0ABCD8;
}
.section.why-companies-struggle-section .struggle-card:hover{
    border-color: #0ABCD8;
}
/* ── Service List ── */
.six-services-section .section-header {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
}
.six-services-section  span.section-label {
    color: #0B1F4C;
    margin-bottom: 0;
}
.six-services-section .service-list .service-row {
    position: relative;
}
/* Vertical center line - left column items */
.six-services-section .service-list .service-row:nth-child(1)::after,
.six-services-section .service-list .service-row:nth-child(3)::after,
.six-services-section .service-list .service-row:nth-child(5)::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 1px;
    height: 100%;
    background: #ededed78;
}
/* Horizontal line between row 1 and row 2 */
.six-services-section .service-list .service-row:nth-child(3)::before,
.six-services-section .service-list .service-row:nth-child(4)::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: #ededed78;
}
/* Horizontal line between row 2 and row 3 */
.six-services-section .service-list .service-row:nth-child(5)::before,
.six-services-section .service-list .service-row:nth-child(6)::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: #EDEDED;
}
.six-services-section .service-list {
display: grid;
    grid-template-columns: repeat(2, 1fr);
}
.six-services-section .service-row {
  padding: 32px 114px;
  background: #FAFAFA;
  transition: 0.5s ease;
}
.six-services-section .service-row:hover {
  background: #F5F5F5;
}
/* .six-services-section .service-row:nth-child(even) {
  background: var(--color-bg-section);
} */
.six-services-section .service-count {
  font-size: 16px;
  color: var(--color-text-muted);
  display: block;
  margin-bottom: 6px;
}
.six-services-section .service-row h4 {
  font-size: 20px;
  font-weight: 600;
  color: #0B1F4C;
  margin: 0;
  margin-bottom: 6px;
}
.six-services-section .service-row p {
  font-size: 16px;
  margin: 0;
}
.six-services-section .service-link-text {
  font-size: 16px;
  color: var(--color-teal);
  white-space: nowrap;
  padding-top: 47px;
    display: block;
}
.six-services-section .service-list .service-row:nth-child(1) {
    border-top-left-radius: 26px;
}
.six-services-section .service-list .service-row:nth-child(2) {
    border-top-right-radius: 26px;
}
.six-services-section .service-list .service-row:nth-child(5) {
    border-bottom-left-radius: 26px;
}
.six-services-section .service-list .service-row:nth-child(6) {
    border-bottom-right-radius: 26px;
}
/* ── CTA Section ── */
.cta-section.service-cta-section.service-cta-section {
  text-align: center;
  padding: 80px 0;
}
.service-cta-section .container{
  max-width: 1014px !important;
}
.cta-section.service-cta-section p {
  font-size: 1rem;
}
.service-cta-section .cta-buttons {
  display: flex;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
}

/* ── Narrow Container ── */
.convert-more-section .container-narrow {
  max-width: 1338px;
  margin: 0 auto;
  padding: 0 24px;
}

/* ── Button Variants (override old-style.css .btn !important) ── */
.btn-navy {
  background: #0B1F4C !important;
  color: #FFFFFF !important;
  border-color: #0B1F4C !important;
}
.btn-navy:hover {
  background: #152a5e !important;
  color: #FFFFFF !important;
}

.btn-outline {
  background: transparent !important;
  color: #000 !important;
  border-color: #000 !important;
}
.btn-outline:hover {
  background: var(--color-teal, #0ABCD8) !important;
  color: #FFFFFF !important;
  border-color: var(--color-teal, #0ABCD8) !important;
}

.btn-lg {
  padding: 16px 40px !important;
  font-size: 20px !important;
}

/* ── Text Color Utilities ── */
.text-teal {
  color: var(--color-teal);
}
.text-navy {
  color: #0B1F4C;
}
.text-dark {
  color: #282828;
}

/* ── Highlight (used in headings) ── */
.highlight {
  color: #0B1F4C;
}

/* ── Funnel Dashboard Images ── */
.dashboard-stats-image,
.funnel-dashboard-image {
  max-width: 100%;
  height: auto;
}
.how-we-force-your-budget-section.SAD .step-card p {
    max-width: 386px;
}
.how-we-force-your-budget-section.SAD .step-card{
    border-bottom: 1px solid #EDEDED;
    border-right: 1px solid #EDEDED;
    padding: 10px 44px 64px;
}
.how-we-force-your-budget-section.SAD .step-card:nth-child(1){
     border-left: 1px solid #EDEDED;
}
.how-we-force-your-budget-section.SAD .steps-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 0px;
}


    /* headers & typography */
    .strategy-search-ads-section.display-title {
      font-size: 3.2rem;
      font-weight: 900;
      line-height: 0.95;
      letter-spacing: -0.03em;
    }
    .strategy-search-ads-section .pillar-card .indicator-bar {
    position: absolute;
    left: 0;
    top: 0;
    width: 3px;
    height: 0;
    background: #1F3159;
    transition: height 0.3s;
    }
    .strategy-search-ads-section .pillar-card:hover .indicator-bar {
        height: 100%;
    }
    @media (min-width: 768px) {
      .strategy-search-ads-section .display-title { font-size: 2.5rem; }
    }
    .strategy-search-ads-section .section-badge {
      font-size: 1rem;
      font-weight: 600;
      text-transform: capitalize;
      color: #0B1F4C;
    }
    .strategy-search-ads-section .pillar-card {
      padding: 2rem 1.8rem;
      border-right: 1px solid #e9edf2;
      transition: background 0.15s;
      height: 100%;
      background-color: #FAFAFA;
     position: relative;
    }
    
    .strategy-search-ads-section .pillar-card:hover {
      background: rgba(245, 248, 255, 0.6);
    }
    .strategy-search-ads-section .pillar-card p {
      font-size: 1rem;
      color: #000;
      line-height: 1.6;
    }
    /* network / animation column */
    .strategy-search-ads-section .network-column {
      background: #f8fafc;
      min-height: 360px;
      height: 100%;
      position: relative;
      overflow: hidden;
      border-left: 1px solid #e2e8f0;
    }
    .strategy-search-ads-section .grain-dots {
      background-image: radial-gradient(#2563eb 0.8px, transparent 0.8px);
      background-size: 22px 22px;
      opacity: 0.12;
    }
    /* floating nodes */
    .strategy-search-ads-section .node-float {
      animation: floatY 3.4s ease-in-out infinite;
    }
    .strategy-search-ads-section .node-float-1 { animation-delay: 0.1s; }
    .strategy-search-ads-section .node-float-2 { animation-delay: 0.6s; }
    .strategy-search-ads-section .node-float-3 { animation-delay: 1.2s; }
    .strategy-search-ads-section .node-float-4 { animation-delay: 1.9s; }
    .strategy-search-ads-section .node-float-5 { animation-delay: 2.5s; }

    @keyframes floatY {
      0% { transform: translateY(0px) scale(1); }
      50% { transform: translateY(-7px) scale(1.02); }
      100% { transform: translateY(0px) scale(1); }
    }
    .strategy-search-ads-section .node-card {
      background: white;
      border-radius: 1rem;
      padding: 0.6rem 0.8rem;
      border: 1px solid #dbeafe;
      box-shadow: 0 6px 14px rgba(37, 99, 235, 0.06);
      display: inline-flex;
      flex-direction: column;
      align-items: center;
      gap: 2px;
      position: relative;
      transition: box-shadow 0.2s;
    }
    .strategy-search-ads-section .node-card i {
      font-size: 1.3rem;
      color: #2563eb;
    }
    .strategy-search-ads-section .node-label {
      font-size: 0.55rem;
      font-weight: 800;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      color: #4b5563;
      margin-top: 1px;
    }
    .strategy-search-ads-section .ripple-ring {
      position: absolute;
      inset: -6px;
      border-radius: 1rem;
      background: rgba(37, 99, 235, 0.24);
      z-index: -1;
      animation: rippleOut 2.4s ease-out infinite;
    }
    .strategy-search-ads-section .ripple-ring-1 { animation-delay: 0.2s; }
    .strategy-search-ads-section .ripple-ring-2 { animation-delay: 0.8s; }
    .strategy-search-ads-section .ripple-ring-3 { animation-delay: 1.4s; }
    .strategy-search-ads-section .ripple-ring-4 { animation-delay: 1.9s; }

    @keyframes rippleOut {
      0% { transform: scale(0.85); opacity: 0.5; }
      100% { transform: scale(1.8); opacity: 0; }
    }
    /* center node (display) special */
    .strategy-search-ads-section .node-center {
      background: white;
      border-radius: 1.2rem;
      padding: 0.8rem 1.2rem;
      border: 1px solid #bfdbfe;
      box-shadow: 0 12px 28px rgba(37, 99, 235, 0.10);
      display: inline-flex;
      flex-direction: column;
      align-items: center;
      gap: 2px;
      position: relative;
    }
    .strategy-search-ads-section .node-center i { font-size: 1.8rem; color: #2563eb; }
    .strategy-search-ads-section .node-center .node-label { font-weight: 900; color: #2563eb; }

    /* animated svg lines */
    .strategy-search-ads-section .line-dash {
      stroke-dasharray: 6 6;
      animation: flowLine 4.2s linear infinite;
      stroke: #2563eb;
      stroke-width: 1.2;
      opacity: 0.35;
    }
    .strategy-search-ads-section .text-secondary :is(*) {
    color: #0ABCD8 !important;
}
    .strategy-search-ads-section .line-dash-1 { animation-delay: 0s; }
    .strategy-search-ads-section .line-dash-2 { animation-delay: 0.7s; }
    .strategy-search-ads-section .line-dash-3 { animation-delay: 1.4s; }
    .strategy-search-ads-section .line-dash-4 { animation-delay: 2.1s; }
    .strategy-search-ads-section .line-dash-5 { animation-delay: 2.8s; }
    .strategy-search-ads-section .line-dash-6 { animation-delay: 3.5s; }

    @keyframes flowLine {
      0% { stroke-dashoffset: 24; opacity: 0.2; }
      50% { opacity: 0.6; }
      100% { stroke-dashoffset: 0; opacity: 0.2; }
    }
    /* live badge */
    .strategy-search-ads-section .live-badge {
      position: absolute;
      bottom: 1.5rem;
      left: 1.5rem;
      display: flex;
      align-items: center;
      gap: 0.6rem;
    }
    .strategy-search-ads-section .pulse-dot {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: #2563eb;
      animation: pulseDot 1.8s ease-in-out infinite;
    }
    @keyframes pulseDot {
      0% { opacity: 0.4; transform: scale(0.9); }
      50% { opacity: 1; transform: scale(1.2); }
      100% { opacity: 0.4; transform: scale(0.9); }
    }
    .strategy-search-ads-section .live-text {
      font-size: 0.55rem;
      font-weight: 800;
      letter-spacing: 0.2em;
      text-transform: uppercase;
      color: #2563eb;
    }
    /* borders */
    .strategy-search-ads-section .border-sm { border-color: #eef2f6; }
.behavior-section .behavior-wrapper {
    background: #1F3159;
    border-radius: 20px;
    padding: 54px 70px;
}
.behavior-section .section-label {
    color: #0ABCD8;
    font-size: 16px;
    margin-bottom: 10px;
}
.behavior-section .section-title {
    color: #fff;
    font-size: 40px;
    line-height: 1.5;
    margin-bottom: 10px;
    text-transform: uppercase;
}
.behavior-section .section-desc {
    color: rgb(255 255 255 / 69%);
    font-size: 16px;
    line-height: 1.7;
    max-width: 525px;
}
.behavior-section ol.section-desc {
    padding-left: 20px;
}
.behavior-section .feature-item {
    display: flex;
    gap: 40px;
    padding: 32px 0;
    border-bottom: 1px solid #ededed85;
}
.behavior-section .feature-item:nth-child(1) {
    border-top: 1px solid #ededed85;
}
.behavior-section .feature-number {
    min-width: 40px;
    color: rgba(255,255,255,0.69);
    font-size: 16px;
    font-weight: 300;
}
.behavior-section .feature-content h4 {
    color: #fff;
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 12px;
    letter-spacing: 0;
}
.behavior-section .feature-content p {
    color: rgba(255,255,255,0.69);
    font-size: 16px;
    line-height: 1.7;
    margin: 0;
    max-width: 90%;
}
    /* subtle grid backdrop */
    .threePillarDigitalSec .grid-backdrop {
      position: absolute;
      inset: 0;
      background-image: linear-gradient(to right, #eef0f3 1px, transparent 1px),
                        linear-gradient(to bottom, #eef0f3 1px, transparent 1px);
      background-size: 4rem 4rem;
      mask-image: radial-gradient(ellipse 60% 50% at 50% 50%, #000 70%, transparent 100%);
      -webkit-mask-image: radial-gradient(ellipse 60% 50% at 50% 50%, #000 70%, transparent 100%);
      pointer-events: none;
      opacity: 0.4;
    }

    /* slide-fade animation */
    .threePillarDigitalSec .slide-fade-enter {
      animation: slideFadeIn 0.4s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    }
    @keyframes slideFadeIn {
      from { opacity: 0; transform: translateY(6px); }
      to   { opacity: 1; transform: translateY(0); }
    }

    /* pillar card hover */
    .threePillarDigitalSec .pillar-card {
      transition: background 0.3s;
      border-bottom: 1px solid #f0f1f3;
    }
    @media (min-width: 992px) {
      .threePillarDigitalSec .pillar-card {
        border-bottom: none;
        border-right: 1px solid #f0f1f3;
      }
      .threePillarDigitalSec .pillar-card:last-child {
        border-right: none;
      }
    }
    .threePillarDigitalSec .pillar-card:hover {
      background: rgba(248, 250, 252, 0.5);
    }
    .threePillarDigitalSec .pillar-card .indicator-bar {
      position: absolute;
      left: 0;
      top: 0;
      width: 3px;
      height: 0;
      background: #1F3159;
      transition: height 0.3s;
    }
    .threePillarDigitalSec .pillar-card:hover .indicator-bar {
      height: 100%;
    }

    /* simulation column */
    .threePillarDigitalSec .sim-column {
      background: #ffffff;
      min-height: 380px;
    }
    @media (min-width: 992px) {
      .threePillarDigitalSec.sim-column {
        border-left: 1px solid #f0f1f3;
        min-height: 100%;
      }
    }

    .threePillarDigitalSec.dot-grid {
      background-image: radial-gradient(#f1f5f9 1.2px, transparent 1.2px);
      background-size: 16px 16px;
      opacity: 0.9;
    }

    /* creative card */
    .threePillarDigitalSec.creative-card {
      background: linear-gradient(135deg, rgba(99, 102, 241, 0.07), rgba(37, 99, 235, 0.04));
      border: 1px solid rgba(99, 102, 241, 0.15);
    }

    /* feature cards */
    .threePillarDigitalSec.feature-card {
      transition: border-color 0.3s, box-shadow 0.3s;
    }
    .threePillarDigitalSec .feature-card:hover {
      border-color: #1F3159 !important;
      box-shadow: 0 4px 16px rgba(0, 82, 255, 0.06);
    }

    /* utilities */
    .threePillarDigitalSec .text-zinc-450 { color: #0ABCD8; }
    .threePillarDigitalSec .text-zinc-650 { color: #4b5563; }
    .threePillarDigitalSec .text-zinc-750 { color: #374151; }
    .threePillarDigitalSec .text-zinc-805 { color: #1f2937; }
    .threePillarDigitalSec .border-zinc-150 { border-color: #e5e7eb; }
    .threePillarDigitalSec .border-zinc-250 { border-color: #d1d5db; }
    .threePillarDigitalSec .bg-blue-soft { background: #eff6ff; }
    .threePillarDigitalSec .bg-indigo-soft { background: #eef2ff; }
    .threePillarDigitalSec .bg-emerald-soft { background: #ecfdf5; }

    .threePillarDigitalSec .btn-step {
    border-radius: 1rem !important;
    border: 1px solid transparent !important;
    transition: all 0.3s;
    font-size: 0.55rem !important;
    font-weight: 600;
    background: transparent !important;
    color: #1F3159 !important;
    cursor: pointer;
    padding: 0 !important;
    }
    .threePillarDigitalSec .btn-step:hover {
      background: rgba(248, 250, 252, 0.6);
      border-color: #e5e7eb;
    }
    .threePillarDigitalSec .btn-step.active {
    background: #f3f4f6 !important;
    border-color: #d1d5db !important;
    color: #000 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    }
    .threePillarDigitalSec .btn-step.active i { color: #1F3159; }
    .threePillarDigitalSec .btn-step i { font-size: 0.9rem; }

    .threePillarDigitalSec .playback-btn {
    font-size: 0.5rem !important;
    font-weight: 700;
    letter-spacing: 0.05em;
    border-radius: 1rem !important;
    border: 1px solid #e5e7eb !important;
    background: #fafafa;
    padding: 0.2rem 0.6rem !important;
    color: #4b5563;
    transition: background 0.2s;
    cursor: pointer;  
    }
    .threePillarDigitalSec .playback-btn:hover {
      background: #f1f3f5;
    }
    .playback-btn svg {
      width: 1rem;
      height: 1rem;
    }

    /* network animation for search section */
    .threePillarDigitalSec .node-float {
      animation: floatY 3.4s ease-in-out infinite;
    }
    .threePillarDigitalSec .node-float-1 { animation-delay: 0.1s; }
    .threePillarDigitalSec .node-float-2 { animation-delay: 0.6s; }
    .threePillarDigitalSec .node-float-3 { animation-delay: 1.2s; }
    .threePillarDigitalSec .node-float-4 { animation-delay: 1.9s; }
    .threePillarDigitalSec .node-float-5 { animation-delay: 2.5s; }

    @keyframes floatY {
      0% { transform: translateY(0px) scale(1); }
      50% { transform: translateY(-7px) scale(1.02); }
      100% { transform: translateY(0px) scale(1); }
    }

    .threePillarDigitalSec .node-card {
      background: white;
      border-radius: 1rem;
      padding: 0.4rem 0.6rem;
      border: 1px solid #dbeafe;
      box-shadow: 0 6px 14px rgba(37, 99, 235, 0.06);
      display: inline-flex;
      flex-direction: column;
      align-items: center;
      gap: 1px;
      position: relative;
    }
    .threePillarDigitalSec .node-card i {
      font-size: 1rem;
      color: #2563eb;
    }
    .threePillarDigitalSec .node-label {
      font-size: 0.45rem;
      font-weight: 800;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      color: #4b5563;
    }
    .threePillarDigitalSec .node-center {
      background: white;
      border-radius: 1.2rem;
      padding: 1rem 0.8rem;
      border: 1px solid #bfdbfe;
      box-shadow: 0 12px 28px rgba(37, 99, 235, 0.10);
      display: inline-flex;
      flex-direction: column;
      align-items: center;
      gap: 1px;
      position: relative;
    }
    .threePillarDigitalSec .node-center i { font-size: 1.4rem; color: #2563eb; }
    .threePillarDigitalSec .node-center .node-label { font-weight: 900; color: #2563eb; }

    .threePillarDigitalSec .ripple-ring {
      position: absolute;
      inset: -4px;
      border-radius: 1rem;
      background: rgba(37, 99, 235, 0.08);
      z-index: -1;
      animation: rippleOut 2.4s ease-out infinite;
    }
   .threePillarDigitalSec .ripple-ring-1 { animation-delay: 0.2s; }
    .threePillarDigitalSec .ripple-ring-2 { animation-delay: 0.8s; }
    .threePillarDigitalSec .ripple-ring-3 { animation-delay: 1.4s; }
    .threePillarDigitalSec .ripple-ring-4 { animation-delay: 1.9s; }

    @keyframes rippleOut {
      0% { transform: scale(0.85); opacity: 0.5; }
      100% { transform: scale(1.8); opacity: 0; }
    }

    .threePillarDigitalSec .line-dash {
      stroke-dasharray: 6 6;
      animation: flowLine 4.2s linear infinite;
      stroke: #2563eb;
      stroke-width: 1.2;
      opacity: 0.35;
    }
    .threePillarDigitalSec.line-dash-1 { animation-delay: 0s; }
    .threePillarDigitalSec .line-dash-2 { animation-delay: 0.7s; }
    .threePillarDigitalSec .line-dash-3 { animation-delay: 1.4s; }
   .threePillarDigitalSec .line-dash-4 { animation-delay: 2.1s; }
    .threePillarDigitalSec .line-dash-5 { animation-delay: 2.8s; }
    .threePillarDigitalSec .line-dash-6 { animation-delay: 3.5s; }

    @keyframes flowLine {
      0% { stroke-dashoffset: 24; opacity: 0.2; }
      50% { opacity: 0.6; }
      100% { stroke-dashoffset: 0; opacity: 0.2; }
    }

    .threePillarDigitalSec .live-badge {
      position: absolute;
      bottom: 1rem;
      left: 1rem;
      display: flex;
      align-items: center;
      gap: 0.4rem;
    }
    .threePillarDigitalSec .pulse-dot {
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: #2563eb;
      animation: pulseDot 1.8s ease-in-out infinite;
    }
    @keyframes pulseDot {
      0% { opacity: 0.4; transform: scale(0.9); }
      50% { opacity: 1; transform: scale(1.2); }
      100% { opacity: 0.4; transform: scale(0.9); }
    }
    .threePillarDigitalSec .live-text {
      font-size: 0.45rem;
      font-weight: 800;
      letter-spacing: 0em;
      text-transform: uppercase;
      color: #2563eb;
    }

.what-paid-media-really-means .darkBg {
  background: #FAFAFA;
  padding: 50px 90px;
  border: 1px solid #EDEDED;
  align-items: center;
}
.what-paid-media-really-means .darkBg .section-header.left {
  display: flex;
  justify-content: center;
  margin-bottom: 0;
}
.what-paid-media-really-means .darkBg h2 {
  letter-spacing: -0.04em !important;
}
.what-paid-media-means-txt h3 {
    font-size: 2rem;
    margin-bottom: 22px;
    letter-spacing: 0;
    text-transform: uppercase;
     letter-spacing: -0.02em !important;
}
.what-paid-media-really-means .darkBg:nth-child(1) {
  border-radius: 20px 20px 0 0;
}
.what-paid-media-really-means .darkBg:nth-child(3) {
  border-radius: 0 0 20px 20px;
}
/* ----- Base ----- */
    .OurMethodology * {
        -webkit-tap-highlight-color: transparent;
    }
    .OurMethodology {
        font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
        color: #000;
    }
    .OurMethodology .font-mono {
        font-family: 'JetBrains Mono', monospace;
    }
    .OurMethodology .bg-rose-50 {
    background: transparent;
    border-color: #1f3159 !important;
    opacity: 1;
}

/* Animations */
@keyframes OurMethodology-fadeIn {
    from {
        opacity: 0;
        transform: translateY(4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
.OurMethodology .animate-fade-in {
    animation: OurMethodology-fadeIn 0.3s ease-out forwards;
}

@keyframes OurMethodology-pulse-dot {
    0%, 100% {
        opacity: 1;
        transform: scale(1);
    }
    50% {
        opacity: 0.5;
        transform: scale(0.8);
    }
}
.OurMethodology .pulse-dot {
    animation: OurMethodology-pulse-dot 1.5s ease-in-out infinite;
}

@keyframes OurMethodology-spin-slow {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}
.OurMethodology .spin-slow {
    animation: OurMethodology-spin-slow 4s linear infinite;
}

/* ----- Methodology Cards ----- */
.OurMethodology .method-card {
    padding: 2rem 2.5rem;
    min-height: 224px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border-bottom: 1px solid #e5e7eb;
    cursor: pointer;
    transition: all 0.3s;
    background: #fff;
}
@media (min-width: 768px) {
    .OurMethodology .method-card {
        border-bottom: none;
        border-right: 1px solid #e5e7eb;
    }
    .OurMethodology .method-card:nth-child(3) {
        border-right: none;
    }
    .OurMethodology .method-card:nth-child(4) {
        border-bottom: 1px solid #e5e7eb;
    }
    .OurMethodology .method-card:nth-child(5) {
        border-bottom: 1px solid #e5e7eb;
        border-right: none;
    }
}
@media (min-width: 992px) {
    .OurMethodology .method-card:nth-child(4),
    .OurMethodology .method-card:nth-child(5) {
        border-bottom: none;
    }
    .OurMethodology .method-card:nth-child(4) {
        border-right: 1px solid #e5e7eb;
    }
}

.OurMethodology .method-card:hover {
    background: rgba(11, 188, 216, 0.08);
}
.OurMethodology .method-card.active {
    background: rgba(11, 188, 216, 0.08);
}

.OurMethodology .method-card .card-title {
    font-size: 1.25rem;
    color: #0B1F4C;
    transition: color 0.3s;
}
.OurMethodology .method-card.active .card-title {
    color: #0ABCD8;
}
.OurMethodology .method-card .card-title .sep {
    color: #d1d5db;
    padding: 0 0.25rem;
}

.OurMethodology .method-card .card-icon {
    opacity: 0;
    transition: opacity 0.3s;
    color: #0ABCD8;
}
.OurMethodology .method-card:hover .card-icon {
    opacity: 1;
}

.OurMethodology .method-card .card-desc {
    font-size: 0.85rem;
    line-height: 1.6;
    color: #282828;
    font-weight: 400;
    letter-spacing: 0.01em;
    margin-top: 1rem;
}
@media (min-width: 768px) {
    .OurMethodology .method-card .card-desc {
        font-size: 0.9rem;
    }
}

.OurMethodology .method-card .card-footer-label {
    font-size: 0.8rem;
    font-weight: 600;
    color: #9ca3af;
    transition: color 0.3s;
    margin-top: 1.5rem;
}
.OurMethodology .method-card:hover .card-footer-label {
    color: #282828;
}
.OurMethodology .method-card.active .card-footer-label {
    color: #0ABCD8;
}

.OurMethodology .method-card .card-footer-label .live-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #0ABCD8;
    animation: OurMethodology-pulse-dot 1.2s ease-in-out infinite;
}

/* ----- Simulation Cell (Card 6) ----- */
.OurMethodology .sim-cell {
    padding: 2rem 2.5rem;
    min-height: 224px;
    background: #f8fafc;
    transition: all 0.3s;
    border-bottom: 1px solid #e5e7eb;
}
@media (min-width: 768px) {
    .OurMethodology .sim-cell {
        border-bottom: none;
    }
}

.OurMethodology .sim-cell .sim-header {
    font-size: 0.6rem;
    background: rgba(11, 188, 216, 0.12);
    color: #0B1F4C;
    padding: 0.2rem 0.6rem;
    border-radius: 0.375rem;
    font-weight: 700;
    font-family: 'JetBrains Mono', monospace;
}

.OurMethodology .sim-cell .sim-subheader {
    font-size: 0.55rem;
    color: #9ca3af;
    font-family: 'JetBrains Mono', monospace;
}

/* Gaze dot for sequencing */
.OurMethodology .gaze-dot {
    position: absolute;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 2px solid #0ABCD8;
    background: rgba(11, 188, 216, 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.7s ease-out;
    z-index: 10;
}
.OurMethodology .gaze-dot .inner {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #0B1F4C;
}
.OurMethodology .gaze-dot .pulse-ring {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: #0ABCD8;
    animation: OurMethodology-pulse-dot 1.2s ease-in-out infinite;
    opacity: 0.3;
}

/* Pacing gauge */
.OurMethodology .pacing-gauge {
    width: 6px;
    height: 64px;
    background: #e5e7eb;
    border-radius: 999px;
    position: relative;
    overflow: hidden;
}
.OurMethodology .pacing-gauge .fill {
    width: 100%;
    background: linear-gradient(to top, #ef4444, #f59e0b, #22c55e);
    border-radius: 999px;
    transition: height 0.3s;
    position: absolute;
    bottom: 0;
}

/* Device wrapper for precision */
.OurMethodology .device-wrapper {
    height: 100%;
    border: 1px solid #d1d5db;
    background: #f9fafb;
    padding: 0.5rem;
    border-radius: 0.375rem;
    transition: all 0.7s;
    margin: 0 auto;
    width: 100%;
}
.OurMethodology .device-wrapper .device-header {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #e5e7eb;
    padding-bottom: 0.25rem;
    font-size: 0.5rem;
    font-family: 'JetBrains Mono', monospace;
    color: #9ca3af;
}

/* Utility classes */
.OurMethodology .border-gray-200 {
    border-color: #e5e7eb;
}
.OurMethodology .bg-gray-50 {
    background: #f9fafb;
}
.OurMethodology .text-gray-900 {
    color: #000;
}
.OurMethodology .text-gray-800 {
    color: #282828;
}
.OurMethodology .text-gray-600 {
    color: #282828;
}
.OurMethodology .text-gray-400 {
    color: #9ca3af;
}
.OurMethodology .text-blue-600 {
    color: #0ABCD8;
}
.OurMethodology .text-emerald-600 {
    color: #059669;
}
.OurMethodology .text-amber-600 {
    color: #d97706;
}
.OurMethodology .text-rose-600 {
    color: #e11d48;
}
.OurMethodology .bg-emerald-600 {
    background: #059669;
}
.OurMethodology .bg-blue-50 {
    background: rgba(11, 188, 216, 0.08);
}
.OurMethodology .bg-rose-50 {
    background: #fff1f2;
}
.OurMethodology .bg-amber-50 {
    background: #fffbeb;
}
.OurMethodology .border-blue-100 {
    border-color: rgba(11, 188, 216, 0.2);
}
.OurMethodology .border-rose-200 {
    border-color: #fecdd3;
}
.OurMethodology .border-amber-200 {
    border-color: #fde68a;
}
.OurMethodology .border-emerald-200 {
    border-color: #a7f3d0;
}
.OurMethodology .border-emerald-300 {
    border-color: #6ee7b7;
}
.OurMethodology .bg-emerald-50 {
    background: #ecfdf5;
}
.section.what-paid-media-really-means.LPFD .container {
    max-width: 1514px !important;
    }
.section.why-companies-struggle-section.LPFD .struggle-card {
margin-bottom: 29px;
}
@media (min-width: 1200px) {
    .OurMethodology .method-card {
        padding: 2.5rem 3rem;
        min-height: 260px;
    }
    .OurMethodology .sim-cell {
        padding: 2.5rem 3rem;
        min-height: 260px;
    }
    .OurMethodology .method-card .card-desc {
        font-size: 1rem;
    }
}
/* ----- RevenueScale AI Styles ----- */
.RevenueScale {
    color: #0B1F4C;
    position: relative;
    overflow-x: hidden;
    background: #f8fafc;
}
/* Glowing background blobs */
.RevenueScale .orb-1 {
    position: absolute;
    top: -48px;
    left: -48px;
    width: 300px;
    height: 300px;
    background: rgba(37, 99, 235, 0.05);
    filter: blur(80px);
    border-radius: 50%;
    pointer-events: none;
    animation: RevenueScale-orb-move-1 15s ease-in-out infinite;
}
.RevenueScale .orb-2 {
    position: absolute;
    top: 400px;
    right: -96px;
    width: 400px;
    height: 400px;
    background: rgba(219, 234, 254, 0.3);
    filter: blur(100px);
    border-radius: 50%;
    pointer-events: none;
    animation: RevenueScale-orb-move-2 20s ease-in-out infinite;
}
#diagnostics-content .icon {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
}
@keyframes RevenueScale-orb-move-1 {
    0%,
    100% {
        transform: translate(0, 0) scale(1);
    }
    50% {
        transform: translate(30px, -20px) scale(1.05);
    }
}
@keyframes RevenueScale-orb-move-2 {
    0%,
    100% {
        transform: translate(0, 0) scale(1);
    }
    50% {
        transform: translate(-30px, 20px) scale(1.02);
    }
}

/* Scan line animation */
@keyframes RevenueScale-scan {
    0% {
        transform: translateY(-5%);
        opacity: 0;
    }
    15%,
    85% {
        opacity: 1;
    }
    100% {
        transform: translateY(460px);
        opacity: 0;
    }
}
.RevenueScale .scan-line {
    position: absolute;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(to right, rgba(59, 130, 246, 0), rgba(59, 130, 246, 0.4), rgba(59, 130, 246, 0));
    box-shadow: 0 0 12px rgba(59, 130, 246, 0.5);
    z-index: 40;
    pointer-events: none;
    animation: RevenueScale-scan 4s linear infinite;
}

/* Particle leak animations */
@keyframes RevenueScale-leak-left {
    0% {
        transform: translate(0, 0);
        opacity: 0;
    }
    10% {
        opacity: 0.7;
    }
    90% {
        opacity: 0.7;
    }
    100% {
        transform: translate(-80px, var(--y-offset));
        opacity: 0;
    }
}
@keyframes RevenueScale-leak-right {
    0% {
        transform: translate(0, 0);
        opacity: 0;
    }
    10% {
        opacity: 0.7;
    }
    90% {
        opacity: 0.7;
    }
    100% {
        transform: translate(80px, var(--y-offset));
        opacity: 0;
    }
}

.RevenueScale .particle-left {
    position: absolute;
    left: 0;
    top: 50%;
    width: 2px;
    height: 2px;
    background-color: #0ABCD8;
    border-radius: 9999px;
    filter: blur(1px);
    pointer-events: none;
    animation: RevenueScale-leak-left var(--duration) linear infinite;
    animation-delay: var(--delay);
}
.RevenueScale .particle-right {
    position: absolute;
    right: 0;
    top: 50%;
    width: 2px;
    height: 2px;
    background-color: #0ABCD8;
    border-radius: 9999px;
    filter: blur(1px);
    pointer-events: none;
    animation: RevenueScale-leak-right var(--duration) linear infinite;
    animation-delay: var(--delay);
}

/* Funnel bar styles */
.RevenueScale .funnel-bar {
    transition: all 0.3s;
    cursor: crosshair;
}
.RevenueScale .funnel-bar:hover {
    background: #ffffff;
    border-color: #cbd5e1;
}
.RevenueScale .funnel-bar.active {
    background: #ffffff;
    border-color: #0ABCD8;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    transform: scale(1.025);
}

.RevenueScale .stage-icon-box {
    width: 40px;
    height: 40px;
    border-radius: 0.75rem;
    background: #f1f5f9;
    color: #94a3b8;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.5s;
}
.RevenueScale .funnel-bar.active .stage-icon-box {
    background: #0ABCD8;
    color: #0B1F4C;
    box-shadow: 0 4px 14px rgba(59, 130, 246, 0.25);
}

.RevenueScale .stage-cost {
    transition: color 0.3s;
}
.RevenueScale .funnel-bar.active .stage-cost {
    color: #0ABCD8;
}

/* Particle visibility */
.RevenueScale .particle-left,
.RevenueScale .particle-right {
    opacity: 0.4;
    transition: opacity 0.3s;
}
.RevenueScale .funnel-bar.active .particle-left,
.RevenueScale .funnel-bar.active .particle-right {
    opacity: 1;
}
.RevenueScale #diagnostics-action-btn {
    font-size: 0.7rem !important;
    padding: 10px !important;
}

/* Responsive overrides */
@media (max-width: 992px) {
    .RevenueScale .scan-line {
        display: none;
    }
}

@media (max-width: 576px) {
    .RevenueScale .funnel-bar {
        padding: 0.75rem 1rem;
    }
    .RevenueScale .stage-icon-box {
        width: 32px;
        height: 32px;
    }
    .RevenueScale .stage-icon-box svg {
        width: 16px;
        height: 16px;
    }
}


/* Utility colors */
.RevenueScale .bg-slate-50 {
    background: #f8fafc;
}
.RevenueScale .text-slate-800 {
    color: #0B1F4C;
}
.RevenueScale .text-slate-900 {
    color: #0B1F4C;
}
.RevenueScale .text-slate-950 {
    color: #020617;
}
.RevenueScale .text-slate-600 {
    color: #475569;
}
.RevenueScale .text-slate-400 {
    color: #94a3b8;
}
.RevenueScale .text-slate-300 {
    color: #cbd5e1;
}
.RevenueScale .border-slate-200 {
    border-color: #e2e8f0;
}
.RevenueScale .border-slate-100 {
    border-color: #f1f5f9;
}
.RevenueScale .bg-blue-50 {
    background: #eff6ff;
}
.RevenueScale .text-blue-600 {
    color: 0B1F4C;
}
.RevenueScale .bg-blue-600 {
    background: 0B1F4C;
}
.RevenueScale .bg-blue-100 {
    background: #dbeafe;
}
.RevenueScale .border-blue-150 {
    border-color: #bfdbfe;
}
.RevenueScale .bg-red-50 {
    background: #fef2f2;
}
.RevenueScale .text-red-500 {
    color: #ef4444;
}
.RevenueScale .border-red-500 {
    border-color: #ef4444 !important;
}
.RevenueScale .text-black {
    color: #000;
}

.RevenueScale .text-3\.5xl {
    font-size: 2.25rem;
}
@media (min-width: 576px) {
    .RevenueScale .text-3\.5xl {
        font-size: 2.5rem;
    }
}

.RevenueScale .text-blue-650 {
    color: #1d4ed8;
}
.RevenueScale .smFont {
    font-size: 0.6rem !important;
}
.RevenueScale.funnel-dashboard-section .section-header p {
margin-bottom: 0;
}
.campaign-section{
    background:#fff;
    font-size: 1rem;
}
.campaign-card{
    background:#1F3159;
    color:#fff;
    border-radius:20px;
    padding:50px;
}
.campaign-section .scenario-label{
    color:#0ABCD8;
    font-size:1rem;
}
.campaign-section .campaign-title{
    font-size:2.5rem;
    line-height:1.2;
    max-width:562px;
}
.campaign-section .campaign-desc{
    color:rgba(255,255,255,.75);
    max-width:525px;
    line-height:1.7;
}
.campaign-section .small-text{
    color:rgba(255,255,255,.7);
}
.campaign-section .spend-text{
    color:rgba(255,255,255,.69);
    font-size:1rem;
}
.campaign-section .stats-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
}
.campaign-section .stat-box{
    padding:28px 18px;
    border-right:1px solid #ededed7c;
}
.campaign-section .stat-box:nth-child(3),
.campaign-section .stat-box:nth-child(6){
    border-right:none;
}
.campaign-section .border-top-custom{
    border-top:1px solid #ededed7c;
}
.campaign-section .stat-box span{
    display:block;
    font-size:1rem;
    color:rgba(255,255,255,.69);
}
.campaign-section .stat-box h3{
    font-size:2.5rem;
    font-weight:600;
    margin:0;
}
.campaign-section .growth-text{
    font-size:36px !important;
}
.campaign-section .bullet-list ul{
    margin:0;
    padding-left:20px;
}
.campaign-section .bullet-list li{
    color:rgba(255,255,255,.75);
    margin-bottom:8px;
}
.campaign-section .divider{
    border-color:#ededed7c;
    margin:40px 0;
}
.campaign-section .analytics-title{
    color:rgba(255,255,255,.75);
    margin-bottom: 12px;
    font-size:1rem;
    letter-spacing: 0px;
}
.campaign-section .analytics-section ul{
    padding-left:20px;
}
.campaign-section .analytics-section li,
.campaign-section .analytics-section p{
    color:rgba(255,255,255,.75);
    line-height:1.8;
}
.campaign-section .bottom-note{
    color:rgba(255,255,255,.7);
    line-height:1.8;
}
.recovery-section{
    padding:20px;
    margin-bottom: 50px;
    background:#fff;
}
.recovery-section .recovery-card{
    background:#EDEDED;
    border-radius:28px;
    padding:42px 50px 50px;
    margin:auto;
}
.recovery-section .recovery-layout{
    display:grid;
    grid-template-columns:48% 52%;
}
.recovery-section .scenario-label{
    font-size:1rem;
    color:rgb(0 0 0 / 69%);
    margin-bottom:14px;
}
.recovery-section .main-heading{
    font-size:2.5rem;
    font-weight:400;
    line-height:1.22;
    letter-spacing:-0.5px;
    color:rgb(0 0 0 / 69%)
    margin-bottom:22px;
    max-width:520px;
}
.recovery-section .content-text{
    max-width:540px;
}
.recovery-section .content-text p{
    font-size:1rem;
    line-height:1.65;
    color:rgb(0 0 0 / 69%);
    margin-bottom:18px;
}
.recovery-section .top-right-note{
    text-align:right;
    font-size:14px;
    color:rgb(0 0 0 / 69%);
    margin-bottom:48px;
}
.recovery-section .section-label{
    font-size:1rem;
    text-transform:uppercase;
    letter-spacing: 0em;
    color:rgb(0 0 0 / 69%);
}
.recovery-section .audience-title{
    margin-bottom:18px;
}
.recovery-section .audience-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
    margin-bottom:34px;
}
.recovery-section .audience-card{
    background:#f7f7f7;
    border:1px solid #d4d4d4;
    border-radius:16px;
    padding:16px 16px 14px;
    min-height:108px;
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
}
.recovery-section .card-number{
    font-size:2rem;
    line-height:1;
    font-weight:600;
    color:#000000;
    margin-bottom:10px;
}
.recovery-section .card-text{
    font-size:1rem;
    line-height:1.45;
    color:rgb(0 0 0 / 69%);
}
.recovery-section .funnel-title{
    margin-bottom:18px;
}
.recovery-section .funnel-item{
    display:grid;
    grid-template-columns:30px 1fr;
    gap:20px;
    margin-bottom:14px;
}
.recovery-section .funnel-item span{
    font-size:1rem;
    color:#666;
}
.recovery-section .funnel-item p{
    font-size:1rem;
    line-height:1.55;
    color:rgb(0 0 0 / 69%);
    margin:0;
}
.recovery-section .performance-note{
    margin-top:24px;
    font-size:1rem;
    color:rgb(0 0 0 / 69%);
}

.why-worked-section{
    background:#fff;
    padding:80px 0;
}
.why-worked-section .why-worked-wrapper{
    margin:auto;
}
/* LEFT */
.why-worked-section .section-label{
    font-size:1rem;
    color:#0B1F4C;
    margin-bottom:10px;
    font-weight:400;
}
.why-worked-section .main-heading{
    font-size:2.5rem;
    font-weight:400;
    line-height:1.25;
    color:#000;
    max-width:562px;
    margin:0;
    letter-spacing: -0.02em;
}
/* RIGHT */
.why-worked-section .steps-list{
    width:100%;
}
.why-worked-section .step-item{
    display:grid;
    grid-template-columns:40px 1fr;
    gap:24px;
    padding:34px 0;
    border-top:1px solid rgb(2 2 2 / 50%);
}
.why-worked-section .step-item:first-child{
    border-top:1px solid rgb(2 2 2 / 50%);
}
.why-worked-section .step-number{
    font-size:1rem;
    color:rgb(0 0 0 / 69%);
    font-weight:400;
}
.why-worked-section .step-text{
    font-size:1rem;
    line-height:1.6;
    color:rgb(0 0 0 / 69%);
    max-width:720px;
}
.why-worked-section .summary-content{
    margin-top:40px;
}
.why-worked-section .summary-main{
    font-size:1rem;
    line-height:1.5;
    text-transform: uppercase;
    color:rgb(0 0 0 / 69%);
    font-weight:400;
    max-width:850px;
    margin-bottom:20px;
}
.why-worked-section .summary-small{
    font-size:.95rem;
    line-height:1.7;
    color:rgb(0 0 0 / 59%);
    max-width:800px;
    margin:0;
}
.FIGStrategy {
    background: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 1rem;
}

@media (min-width: 768px) {
    .FIGStrategy {
        padding: 2rem;
    }
}
@media (min-width: 992px) {
    .FIGStrategy {
        padding: 3rem 0;
    }
}
/* Pulse ring animation */
@keyframes FIGStrategy-pulse-ring {
    0%,
    100% {
        transform: scale(1);
        opacity: 0.15;
    }
    50% {
        transform: scale(1.15);
        opacity: 0.3;
    }
}
.FIGStrategy .animate-pulse-decor {
    animation: FIGStrategy-pulse-ring 2.2s infinite ease-in-out;
    transform-origin: 190px 190px;
}

/* Grid pattern overlay */
.FIGStrategy .grid-pattern {
    position: absolute;
    inset: 0;
    opacity: 0.06;
    pointer-events: none;
    background-image: linear-gradient(to right, #808080 1px, transparent 1px),
                        linear-gradient(to bottom, #808080 1px, transparent 1px);
    background-size: 16px 16px;
}

/* Phase cards */
.FIGStrategy .phase-card {
    padding: 2rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: #ffffff;
    border-bottom: 1px solid #e2e8f0;
    min-height: 380px;
}
@media (min-width: 992px) {
    .FIGStrategy .phase-card {
        border-bottom: none;
        border-right: 1px solid #e2e8f0;
    }
    .FIGStrategy .phase-card:last-child {
        border-right: none;
    }
}

.FIGStrategy .phase-card .phase-title {
    font-size: 1rem;
    font-weight: 600;
    color: #0B1F4C;
    letter-spacing: 0em;
    text-transform: uppercase;
}
.FIGStrategy .phase-card .phase-desc {
    color: #000;
    font-size: 1rem;
    line-height: 1.6;
    letter-spacing: 0em;
}
/* SVG Animation Container */
.FIGStrategy .svg-container {
    background: #ebebeb;
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 380px;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    user-select: none;
}
@media (min-width: 992px) {
    .FIGStrategy .svg-container {
        min-height: 100%;
    }
}

.FIGStrategy .svg-container svg {
    width: 100%;
    height: auto;
    position: relative;
    z-index: 10;
}

.FIGStrategy .svg-container .legend {
    position: absolute;
    bottom: 1rem;
    left: 0;
    right: 0;
    display: flex;
    justify-content: center;
    font-size: 0.6rem;
    text-transform: uppercase;
    color: #0ABCD8;
    z-index: 10;
}
.FIGStrategy .svg-container .legend .dot {
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
}
.FIGStrategy .svg-container .legend .dot-blue {
    background: #2563eb;
}
.FIGStrategy .svg-container .legend .dot-purple {
    background: #8b5cf6;
}
.FIGStrategy .svg-container .legend .dot-teal {
    background: #14b8a6;
}

/* Utility */
.FIGStrategy .text-slate-50 {
    color: #f8fafc;
}
.FIGStrategy .text-slate-100 {
    color: #f1f5f9;
}
.FIGStrategy .text-slate-200 {
    color: #e2e8f0;
}
.FIGStrategy .text-slate-300 {
    color: #cbd5e1;
}
.FIGStrategy .text-slate-400 {
    color: #94a3b8;
}
.FIGStrategy .text-slate-500 {
    color: #0ABCD8;
}
.FIGStrategy .text-slate-600 {
    color: #475569;
}
.FIGStrategy .text-slate-700 {
    color: #0ABCD8;
}
.FIGStrategy .text-slate-800 {
    color: #1e293b;
}
.FIGStrategy .text-slate-900 {
    color: #0f172a;
}
.FIGStrategy .bg-slate-50 {
    background: #f8fafc;
}
.FIGStrategy .border-slate-200 {
    border-color: #e2e8f0;
}

.retargeting-stats-section{
    background:#fff;
    padding:80px 0;
}
/* Heading */
.retargeting-stats-section .section-header{
    margin-bottom:40px;
}
.retargeting-stats-section .section-header h2{
    font-size:2.5rem;
    font-weight:400;
    line-height:1.15;
    color:#000;
    margin-bottom:8px;
    letter-spacing:-0.02em;
}
.retargeting-stats-section .section-header p{
    font-size:1rem;
    color:rgb(0 0 0 / 69%);
    margin:0;
}
/* Grid */
.retargeting-stats-section .stats-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    border:1px solid #EEEEEE;
}
.retargeting-stats-section .stat-card{
    min-height:220px;
    padding:32px 39px;
    background:#FAFAFA;
    border-right:1px solid #EEEEEE;
    border-bottom:1px solid #EEEEEE;
    border-radius: 0;
}
.retargeting-stats-section .stat-card:nth-child(3),
.stat-card:nth-child(6){
    border-right:none;
}
.retargeting-stats-section .stat-title{
    font-size:1rem;
    font-weight:600;
    color:#0B1F4C;
    margin-bottom:18px;
}
.retargeting-stats-section .stat-card p{
    font-size:1rem;
    line-height:1.65;
    color:#000;
    margin:0;
}
.retargeting-stats-section .empty-card{
    background:#F5F5F5;
}
.retargeting-stats-section.RTPI .stats-grid {
    border: none;
    grid-template-columns: repeat(2, 1fr);
}
/* ─── Custom scrollbars ─── */
    #FIG-Strategy::-webkit-scrollbar { width: 6px; height: 6px; }
    #FIG-Strategy::-webkit-scrollbar-track { background: transparent; }
    #FIG-Strategy::-webkit-scrollbar-thumb { background: #d4d4d8; border-radius: 9999px; }
    #FIG-Strategy::-webkit-scrollbar-thumb:hover { background: #a1a1aa; }
/* ─── Animations ─── */
@keyframes dash {
    to { stroke-dashoffset: -100px; }
}
    #FIG-Strategy .animate-flow-dash {
    animation: dash 3s linear infinite;
}

@keyframes spin-cw {
    to { transform: rotate(360deg); }
}
    #FIG-Strategy .animate-spin-custom {
    animation: spin-cw 15s linear infinite;
    transform-origin: 160px 115px;
}
    #FIG-Strategy .spin-paused { animation-play-state: paused; }

@keyframes ping {
    75%, 100% { transform: scale(2); opacity: 0; }
}
.animate-ping { animation: ping 1s cubic-bezier(0,0,0.2,1) infinite; }
.animate-pulse { animation: pulse 2s cubic-bezier(0.4,0,0.6,1) infinite; }
@keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: .5; }
}
/* ─── Main content ─── */
#FIG-Strategy {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%;
    margin: 0 auto;
    padding: 4rem 0;
}
/* ─── Title block ─── */
.title-block { margin-bottom: 3.5rem; }
#FIG-Strategy  #main-editorial-title {
    color: #000;
    font-size: 2.5rem;
    letter-spacing: -0.02em;
    line-height: 1.1;
    text-transform: uppercase;
}
#FIG-Strategy #sub-metadata-index {
    font-size: 1rem;
    text-transform: uppercase;
    color: #0ABCD8;
    display: inline-block;
}
@media (min-width: 992px) {
    #FIG-Strategy .meta-col { text-align: right; padding-top: 1rem; }
}
/* ─── FIG Strategy Grid ─── */
#FIG-Strategy #fig-strategy-grid {
    border: 1px solid #e5e7eb;
    border-radius: 2px;
    overflow: hidden;
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.02);
    display: grid;
    grid-template-columns: 1fr;
}
@media (min-width: 768px) {
    #FIG-Strategy #fig-strategy-grid { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 992px) {
    #FIG-Strategy #fig-strategy-grid { grid-template-columns: 1fr 1fr 1fr 1fr; }
}
/* ─── Phase Cards ─── */
#FIG-Strategy .phase-card {
    padding: 2rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: all 0.3s;
    cursor: pointer;
    position: relative;
    border-bottom: 1px solid rgba(229,231,235,0.6);
}
@media (min-width: 768px) {
    #FIG-Strategy  .phase-card { border-right: 1px solid rgba(229,231,235,0.6); }
    #FIG-Strategy #phase-card-2 { border-right: none; }
}
@media (min-width: 992px) {
    #FIG-Strategy .phase-card { border-bottom: none; border-right: 1px solid rgba(229,231,235,0.6); }
    #FIG-Strategy #phase-card-3 { border-right: none; }
}
#FIG-Strategy .phase-card:hover { background: rgba(250,250,250,0.5); }
.phase-card-highlight {
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 4px;
    background: #0ABCD8;
    display: none;
}
#FIG-Strategy .phase-num {
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    display: block;
    margin-bottom: 1rem;
    color: #1F3159 !important;
    text-transform: uppercase;
    transition: color 0.3s;
}
#FIG-Strategy .phase-card:hover .phase-num { color: #0ABCD8; }
#FIG-Strategy .phase-text {
    color: #000;
    font-size: 1rem;
    line-height: 1.6;
    letter-spacing: 0.01em;
    font-weight: 400;
    transition: color 0.3s;
}
#FIG-Strategy .phase-footer {
    margin-top: 2rem;
    padding-top: 1rem;
    border-top: 1px solid #f5f5f5;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 11px;
    color: #a3a3a3;
}
#FIG-Strategy .phase-status {
    letter-spacing: 0.05em;
    font-size: 0.8rem;

}
#FIG-Strategy .phase-dot {
    width: 6px; height: 6px;
    border-radius: 50%;
    background: #e5e7eb;
    transition: all 0.3s;
}
#FIG-Strategy .phase-card:hover .phase-dot { background: #a3a3a3; }
/* ─── Animation Column ─── */
#phase-card-animation {
    display: flex;
    flex-direction: column;
    position: relative;
    width: 100%;
    min-height: 460px;
    background: #eff1f4;
}
#FIG-Strategy #ecosystem-container {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1rem;
    height: 100%;
    width: 100%;
    position: relative;
    overflow: hidden;
}
/* ─── Telemetry header ─── */
#FIG-Strategy .telemetry-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid rgba(212,217,224,0.4);
    padding-bottom: 0.625rem;
    margin-bottom: 0.375rem;
    position: relative;
    z-index: 10;
}
#FIG-Strategy .telemetry-left { display: flex; align-items: center; gap: 6px; min-width: 0; }
#FIG-Strategy .telemetry-icon { width: 12px; height: 12px; color: #0ABCD8; flex-shrink: 0; }
#FIG-Strategy #telemetry-label {
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #0ABCD8;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#FIG-Strategy .telemetry-controls { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
#FIG-Strategy #play-pause-btn {
    padding: 2px 6px !important;
    border-radius: 4px !important;
    background: rgba(229,231,235,0.5);
    border: none;
    color: #0ABCD8;
    font-size: 8px !important;
    display: flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
    transition: all 0.2s;
    border: none !important;
}
#FIG-Strategy #play-pause-btn:hover { background: rgba(212,212,216,0.6); color: #111111; }
#FIG-Strategy #play-dot {
    display: inline-block;
    width: 6px; height: 6px;
    background: #10b981;
    border-radius: 50%;
}
#FIG-Strategy #reset-simulation-btn {
    padding: 6px !important;
    border-radius: 4px !important;
    background: rgba(229,231,235,0.5);
    border: none;
    color: #0ABCD8;
    cursor: pointer;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    border: none !important;
}
#FIG-Strategy #reset-simulation-btn:hover { background: rgba(212,212,216,0.6); color: #111111; }
/* ─── Main animation area ─── */
#FIG-Strategy .anim-area {
    position: relative;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 120px;
    padding: 4px 0;
}
#FIG-Strategy .dot-grid {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(#d3d6dc 1px, transparent 1px);
    background-size: 10px 10px;
    opacity: 0.5;
    pointer-events: none;
}
#FIG-Strategy .eco-svg {
    width: 100%;
    height: 100%;
    max-height: 210px;
    z-index: 10;
    overflow: visible;
    margin-top: 8px;
}
/* ─── Journey badge ─── */
#FIG-Strategy #journey-badge {
    position: absolute;
    top: 4px;
    padding: 2px 10px;
    background: rgba(255,255,255,0.95);
    backdrop-filter: blur(2px);
    border-radius: 4px;
    border: 1px solid rgba(203,213,225,0.4);
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
    z-index: 20;
    font-size: 8px;
    font-weight: 600;
    color: #525252;
    display: none;
    align-items: center;
    gap: 4px;
    pointer-events: none;
    transition: all 0.3s;
}
#FIG-Strategy #journey-badge .ping-dot {
    width: 6px; height: 6px;
    border-radius: 50%;
    background: #f87171;
}
#FIG-Strategy #journey-badge strong {
    font-family: "JetBrains Mono", monospace;
    font-weight: 800;
    color: #111111;
}
/* ─── Stats board ─── */
#FIG-Strategy #ecosystem-stats-pnl {
    margin-top: 4px;
    background: #ffffff;
    border: 1px solid rgba(209,213,220,0.45);
    border-radius: 4px;
    padding: 8px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.04);
    z-index: 10;
    flex-shrink: 0;
}
#FIG-Strategy #general-stats-view {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 4px;
    text-align: center;
    height: 24px;
}
#FIG-Strategy .stat-cell {
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-right: 1px solid rgba(229,231,235,0.5);
    padding-right: 2px;
}
#FIG-Strategy .stat-cell:last-child { border-right: none; padding-right: 0; padding-left: 2px; }
#FIG-Strategy .stat-cell:not(:first-child) { padding-left: 2px; }
#FIG-Strategy .stat-label {
    font-size: 6.5px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #a3a3a3;
    display: block;
    line-height: 1;
    margin-bottom: 2px;
}
#FIG-Strategy .stat-value {
    font-weight: 700;
    color: #262626;
    font-size: 10px;
    line-height: 1;
}
#FIG-Strategy .stat-value.green { color: #059669; }
#FIG-Strategy .stat-value.blue  { color: #0ABCD8; }
#FIG-Strategy #node-stats-view {
    display: none;
    justify-content: space-between;
    align-items: center;
    height: 24px;
}
#FIG-Strategy .node-detail-left { min-width: 0; padding-right: 8px; }
#FIG-Strategy .node-detail-name-row {
    font-weight: 700;
    color: #262626;
    font-size: 10px;
    display: flex;
    align-items: center;
    gap: 4px;
    line-height: 1;
}
#FIG-Strategy #node-detail-color {
    width: 6px; height: 6px;
    border-radius: 50%;
    display: inline-block;
    flex-shrink: 0;
}
#FIG-Strategy #node-detail-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#FIG-Strategy #node-detail-descr {
    font-size: 7.5px;
    color: #a3a3a3;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 190px;
    margin-top: 2px;
}
#FIG-Strategy .node-detail-right { text-align: right; flex-shrink: 0; }
#FIG-Strategy .node-attr-label {
    font-weight: 600;
    font-size: 7.5px;
    text-transform: uppercase;
    font-family: "JetBrains Mono", monospace;
    letter-spacing: 0.08em;
    color: #a3a3a3;
    display: block;
    line-height: 1;
    margin-bottom: 2px;
}
#FIG-Strategy #node-detail-weight {
    font-family: "JetBrains Mono", monospace;
    font-weight: 800;
    color: #111111;
    font-size: 12px;
    line-height: 1.2;
}
/* stats footer hint */
#FIG-Strategy .stats-hint {
    margin-top: 6px;
    border-top: 1px solid rgba(240,240,240,0.6);
    padding-top: 4px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 7.5px;
    color: #a3a3a3;
    font-weight: 500;
    line-height: 1;
}
#FIG-Strategy .stats-hint-left { display: flex; align-items: center; gap: 4px; }
#FIG-Strategy .hint-star { width: 8px; height: 8px; color: #1F3159; }
#FIG-Strategy #clear-node-btn {
    color: #0ABCD8;
    background: none;
    border: none;
    padding: 0;
    font-size: 7.5px;
    font-weight: 700;
    text-decoration: underline;
    cursor: pointer;
    display: none;
}
#FIG-Strategy #clear-node-btn:hover { color: #1d4ed8; }
/* ─── Phase action banner ─── */
#FIG-Strategy #system-dashboard-meta {
    margin-top: 2rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    border: 1px solid rgba(229,231,235,0.5);
    padding: 1rem;
    border-radius: 4px;
    background: #fafafa;
    gap: 1rem;
}
@media (min-width: 576px) {
    #FIG-Strategy #system-dashboard-meta { flex-direction: row; align-items: center; }
}
.banner-icon-wrap {
    padding: 8px;
    background: #eff6ff;
    border-radius: 4px;
    color: #0ABCD8;
    flex-shrink: 0;
}
#FIG-Strategy .banner-icon-wrap svg { width: 16px; height: 16px; }
#FIG-Strategy .banner-title { font-size: 0.75rem; font-weight: 600; color: #262626; }
#FIG-Strategy .banner-desc {
    font-size: 11px;
    color: #0ABCD8;
    max-width: 36rem;
}
#FIG-Strategy #clear-focus-btn {
    padding: 6px 12px;
    border-radius: 4px;
    font-size: 0.75rem;
    font-family: "JetBrains Mono", monospace;
    font-weight: 700;
    letter-spacing: 0.08em;
    border: 1px solid #e5e7eb;
    background: #f5f5f5;
    color: #a3a3a3;
    pointer-events: none;
    transition: all 0.2s;
    white-space: nowrap;
    cursor: default;
}
#FIG-Strategy #clear-focus-btn.active {
    border-color: #d4d4d8;
    background: #ffffff;
    color: #171717;
    pointer-events: auto;
    cursor: pointer;
}
#FIG-Strategy #clear-focus-btn.active:hover { background: #fafafa; color: #000; }
/* ─── Footer ─── */
#FIG-Strategy #global-footer {
    border-top: 1px solid #f5f5f5;
    padding: 1rem 3rem;
    background: #ffffff;
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 10px;
    color: #a3a3a3;
    gap: 8px;
}
@media (min-width: 576px) {
    #FIG-Strategy #global-footer { flex-direction: row; justify-content: space-between; }
}
.revenueBaseFunnel{
  padding: 100px 0;
}
/* ── Header ── */
.revenueBaseFunnel .section-heading {
    color: #000;
    letter-spacing: -0.02em;
    line-height: 1.05;
    font-size: 2rem;
    font-weight: 400;
}
.revenueBaseFunnel .meta-label {
    font-size: 1rem;
    color: #0ABCD8;
    line-height: 1;
    display: block;
}
/* ── Grid card ── */
.revenueBaseFunnel .funnel-grid {
    border: 1px solid #e5e7eb;
    overflow: hidden;
    background: #ffffff;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
    border-radius: 2px;
}
.revenueBaseFunnel .phase-col {
    padding: 47px 20px;
    background: #ffffff;
    cursor: default;
    transition: background 0.3s;
    position: relative;
}
/* vertical dividers between columns on lg+ */
@media (min-width: 992px) {
    .revenueBaseFunnel .phase-col { border-right: 1px solid #e5e7eb; }
    .revenueBaseFunnel .phase-col:last-of-type { border-right: none; }
}
/* horizontal dividers on mobile */
@media (max-width: 991.98px) {
    .revenueBaseFunnel .phase-col { border-bottom: 1px solid #e5e7eb; }
    .phase-col:last-of-type { border-bottom: none; }
}
.revenueBaseFunnel .phase-col:hover { background: rgba(250,250,250,0.5); }
.revenueBaseFunnel .phase-label {
    font-size: 1rem;
    color: #0B1F4C;
    text-transform: uppercase;
    margin-bottom: 1.8rem;
    line-height: 1.5;
    font-weight: 600;
}
@media (min-width: 768px) {
    .revenueBaseFunnel .phase-label { min-height: unset; }
}
.revenueBaseFunnel .phase-body {
    color: #000;
    font-size: 1rem;
    line-height: 1.5;
    text-align: left;
}
/* ── Canvas column ── */
.revenueBaseFunnel .canvas-col {
    background: #f3f4f6;
    position: relative;
    min-height: 400px;
}
@media (min-width: 992px) {
    .revenueBaseFunnel .canvas-col { min-height: unset; }
}
.revenueBaseFunnel #funnel-canvas {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
}
.funnels-section{
    background:#fff;
    padding:80px 0;
}
/* =========================
   TOP AREA
========================= */
.funnels-section .top-content{
    margin-bottom:45px;
}
.funnels-section .funnels-heading{
    font-size:2.5rem;
    font-weight:400;
    line-height:1.25;
    color:#000;
    margin:0;
    letter-spacing:-0.02em;
}
.funnels-section .attention-word{
    position: relative;
    color: hsl(0deg 0% 0% / 48%);;
}
.funnels-section .attention-word::after{
    content:'';
    position:absolute;
    left:0;
    top:50%;
    width:100%;
    height:3px;
    background:#27c6f3;
    transform:translateY(-50%);
}
.funnels-section .funnels-heading em{
    font-style:italic;
    color:#0B1F4C;
    font-weight:400;
}
.funnels-section .top-description{
    max-width:705px;
    font-size:1rem;
    line-height:1.45;
    color:#282828;
    margin-left:auto;
}
/* =========================
   LEFT CARD
========================= */
.funnels-section .info-card{
    background:#FAFAFA;
    border:1px solid #EEEEEE;
    border-radius:24px;
    padding:28px;
    height:100%;
}
.funnels-section .info-card h4{
    font-size:1rem;
    font-weight:600;
    color:#0B1F4C;
    margin-bottom:18px;
}
.funnels-section .info-card p{
    font-size:1rem;
    line-height:1.7;
    color:#282828;
    margin-bottom:0;
}
.funnels-section .divider{
    height:1px;
    background:#e5e5e5;
    margin:24px 0;
}
/* =========================
   RIGHT CARDS
========================= */
.funnels-section .industry-card{
    background:#FAFAFA;
    border:1px solid #EDEDED;
    border-radius:20px;
    padding:16px 32px;
    margin-bottom:16px;
}
.funnels-section .industry-card:last-child{
    margin-bottom:0;
}
.funnels-section .industry-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:10px;
}
.funnels-section .industry-header span:first-child{
    color:#0B1F4C;
    font-size:1rem;
    font-weight:600;
}
.funnels-section .industry-header span:last-child{
    color:#0B1F4C;
    font-size:1rem;
    font-weight:600;
}
.funnels-section .industry-card p{
    margin:0;
    color:#282828;
    font-size:1rem;
    line-height:1.6;
}

.decision-data-section{
    background:#fff;
    padding:90px 0;
}
/* HEADER */
.decision-data-section .section-header{
    margin-bottom:28px;
}
.decision-data-section .section-eyebrow{
    display:block;
    color:#0ABCD8;
    font-size:1rem;
    margin-bottom:10px;
    letter-spacing: 0;
    font-weight: 400;
}
.decision-data-section .section-title{
    font-size:2.5rem;
    font-weight:400;
    line-height:1.15;
    color:#000;
    margin:0;
    letter-spacing: 0;
}
/* CARD */
.decision-data-section .data-card{
    background:#FAFAFA;
    border:1px solid #EDEDED;
    border-radius:20px;
    padding: 29px 29px 10px;
    height:100%;
}
.decision-data-section .data-card h4{
    font-size:1.25rem;
    font-weight:600;
    color:#0B1F4C;
    margin-bottom:10px;
}
.decision-data-section .data-card p{
    font-size:1rem;
    line-height:1.7;
    color:#000;
    margin-bottom:0;
}
.decision-data-section .data-card p span{
    color:#0ABCD8;
}
/* LEAD CARD */
.decision-data-section .lead-card{
    min-height:165px;
}
.decision-data-section .progress-wrapper{
    margin-top:35px;
    display:flex;
    align-items:center;
    gap:12px;
}
.decision-data-section .progress-line{
    flex:1;
    height:4px;
    background:#e3e3e3;
}
.decision-data-section .progress-fill{
    width:50%;
    height:100%;
    background:#006AFF;
}
.decision-data-section .progress-label{
    color: hsl(0deg 0% 0% / 40%);
    font-size: 1rem;
}
/* GRAPH */
.decision-data-section .graph-area{
    margin-top:25px;
    display:flex;
    justify-content:center;
}
.decision-data-section .graph-area svg{
    width:220px;
    height:80px;
}
.decision-data-section .efficiency-card{
    min-height:180px;
}
.decision-data-section .bars-wrap{
    margin-top:30px;
    display:flex;
    align-items:flex-end;
    gap:6px;
    justify-content: center;
}
.decision-data-section .bar{
    width:91px;
    background:#E6E6E6;
    border-radius:3px 3px 0 0;
}
.decision-data-section .small{
    height:12px;
}
.decision-data-section .medium{
    height:20px;
}
.decision-data-section .large{
    height:28px;
}
.decision-data-section .active{
    height:40px;
    background:#006AFF;
}
.decision-data-section .timing-card{
    min-height:180px;
}
.decision-data-section .timing-content{
    display:flex;
    justify-content:space-between;
    align-items:center;
    height:100%;
}
.decision-data-section .timing-content p{
    max-width:400px;
}
.decision-data-section .timing-graphic{
    display:flex;
    align-items:center;
    gap:18px;
        justify-content: center;
}
.decision-data-section .circle-number{
    width: 74px;
    height: 74px;
    border-radius: 50%;
    background: #efefef;
    color: #006AFF;
    font-weight: 700;
    font-size: 2.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
}
.decision-data-section .line-stack{
    display:flex;
    flex-direction:column;
    gap:6px;
}
.decision-data-section .line{
    width:101px;
    height:7px;
    background:#CCE1FF;
    border-radius:30px;
}
.decision-data-section .line.active{
    background:#006AFF;
}
.decision-data-section .line.second {
    width: 58px;
    background: #99C4FF;
}
.decision-data-section .line.third {
    width: 89px;
}
.intLink {
    font-weight: 600;
}
.behavior-section .intLink, .fig-process .intLink{
    color: #fff;
}
@keyframes custom-pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: .7; transform: scale(0.97); }
}
@keyframes custom-ping {
    0% { transform: scale(1); opacity: 0.8; }
    100% { transform: scale(1.8); opacity: 0; }
}
@keyframes pulse-opacity {
    0%, 100% { opacity: 1; }
    50% { opacity: .5; }
}
.WhyCRM {
    background: #FAFAFA;
}
.WhyCRM .animate-pulse-slow { animation: custom-pulse 3s infinite ease-in-out; }
.WhyCRM .ring-ping { animation: custom-ping 1.5s infinite ease-out; }
.WhyCRM .pulse-opacity { animation: pulse-opacity 2s cubic-bezier(0.4,0,0.6,1) infinite; }
/* Icon sizing helpers (Tailwind w-4/h-4, w-3.5/h-3.5 equivalents) */
.WhyCRM .icon-md { width: 16px; height: 16px; }
.WhyCRM .icon-sm { width: 14px; height: 14px; }
/* Text color helpers used by JS-driven state changes */
.WhyCRM .text-indigo-600 { color: #4f46e5; }
.WhyCRM .text-indigo-700 { color: #4338ca; }
.WhyCRM .text-emerald-600 { color: #059669; }
.WhyCRM .text-emerald-700 { color: #047857; }
.WhyCRM .text-emerald-800 { color: #065f46; }
.WhyCRM .text-rose-500 { color: #f43f5e; }
.WhyCRM .text-rose-600 { color: #e11d48; }
.WhyCRM .text-rose-800 { color: #9f1239; }
.WhyCRM .text-slate-700 { color: #334155; }
.WhyCRM .text-slate-800 { color: #1e293b; }
/* ===== Outer shell ===== */
.WhyCRM .glow { position: absolute; width: 24rem; height: 24rem; border-radius: 50%; filter: blur(64px); pointer-events: none; }
.WhyCRM .dot-pulse {
    width: .5rem; height: .5rem; border-radius: 50%;
    background: #4f46e5;
    animation: pulse-opacity 2s cubic-bezier(0.4,0,0.6,1) infinite;
}
.WhyCRM .display-heading {
    color: #000; 
    line-height: 1.12;
    letter-spacing: -0.02em; 
    font-size: 2.5rem;
}
.WhyCRM .lead-text { font-size: 1rem; color: #282828; line-height: 1.7; max-width: 660px; }
.WhyCRM .footer-stat { border-top: 1px solid rgba(226,232,240,.6); }
.WhyCRM .avatar-circle {
    width: 1.75rem; height: 1.75rem; border-radius: 50%;
    border: 2px solid #fff; display: flex; align-items: center; justify-content: center;
    color: #fff; font-size: 10px; font-weight: 700; margin-left: -.5rem;
}
.WhyCRM .avatar-stack .avatar-circle:first-child { margin-left: 0; }
.WhyCRM .avatar-circle.bg-emerald { background: #10b981; }
.WhyCRM .avatar-circle.bg-indigo { background: #4f46e5; }
.WhyCRM .avatar-circle.bg-dark { background: #1e293b; font-family: 'Inter', monospace; font-weight: 600; }
.WhyCRM .stat-caption { font-size: .75rem; color: #64748b; font-weight: 600; line-height: 1.3; }
/* ===== Right column widget card ===== */
.WhyCRM .funnel-card {
    width: 100%; max-width: 430px; background: #fff;
    border-radius: 1rem; border: 1px solid rgba(226,232,240,.85);
    padding: 1.25rem; box-shadow: 0 10px 15px -3px rgba(0,0,0,.08);
    display: flex; flex-direction: column; justify-content: space-between;
    height: 360px; user-select: none; position: relative;
}
.WhyCRM .card-header {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: .625rem; padding-bottom: .375rem;            border-bottom: 1px solid #f1f5f9;
}
.WhyCRM .card-header-title {
    font-family: 'Inter', monospace; font-size: 9px; font-weight: 800;
    color: #94a3b8; text-transform: uppercase; letter-spacing: .08em;
}
.WhyCRM .toggle-switch {
    display: flex; align-items: center; gap: .25rem; padding: .25rem .625rem;
    border-radius: 999px; font-size: 10px; font-weight: 700; letter-spacing: -.01em;
    border: 1px solid; transition: all .2s; cursor: pointer;
}
.WhyCRM .toggle-on { background: #ecfdf5; color: #065f46; border-color: #a7f3d0; }
.WhyCRM .toggle-on:hover { background: rgba(209,250,229,.5); }
.WhyCRM .toggle-off { background: #fff1f2; color: #9f1239; border-color: #fecdd3; }
.WhyCRM .toggle-off:hover { background: rgba(254,205,211,.5); }

.WhyCRM .playbook-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: .375rem; margin-bottom: .75rem; }
.WhyCRM .playbook-btn {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    padding: .375rem; border-radius: .75rem; border: 1px solid; text-align: center;
    transition: all .2s; cursor: pointer; background: #fff;
}
.WhyCRM .playbook-btn.active { background: rgba(238,242,255,.5); border-color: rgba(199,210,254,.8); color: #4338ca; font-weight: 600; }
.WhyCRM .playbook-btn:not(.active) { border-color: #f1f5f9; color: #64748b; }
.WhyCRM .playbook-btn:not(.active):hover { background: #f8fafc; }
.WhyCRM .playbook-icon { padding: .25rem; border-radius: .5rem; }
.WhyCRM .playbook-icon.active { background: #e0e7ff; color: #4f46e5; }
.WhyCRM .playbook-icon:not(.active) { background: #f8fafc; color: #94a3b8; }
.WhyCRM .playbook-label {
    font-family: 'Inter', sans-serif; font-size: 9px; margin-top: .25rem;
    letter-spacing: -.01em; white-space: nowrap; overflow: hidden;
    text-overflow: ellipsis; width: 100%; padding: 0 .25rem;
}
.WhyCRM .svg-stage {
    position: relative; width: 100%; height: 125px; background: #fafafa;
    border-radius: .75rem; border: 1px solid rgba(241,245,249,.8); overflow: hidden;
}
.WhyCRM .recovery-tag {
    position: absolute; bottom: .25rem; right: .5rem; left: .5rem;
    display: flex; align-items: center; justify-content: space-between;
    font-size: 7.5px; pointer-events: none; padding: .125rem .25rem;
    background: rgba(255,255,255,.8); backdrop-filter: blur(4px);
    border: 1px solid #f1f5f9; border-radius: .25rem;
}
.WhyCRM .recovery-text {
    font-family: 'Inter', sans-serif; font-weight: 500; color: #64748b;
    line-height: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 260px;
}
.WhyCRM .status-tag { font-family: 'Inter', monospace; font-weight: 700; }
.WhyCRM .status-on { color: #059669; }
.WhyCRM .status-off { color: #f43f5e; }
.WhyCRM .metrics-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: .5rem; padding-top: .5rem; border-top: 1px solid #f1f5f9; }
.WhyCRM .metric-card { text-align: center; background: rgba(248,250,252,.7); padding: .375rem; border-radius: .75rem; border: 1px solid #f1f5f9; }
.WhyCRM .metric-label { display: block; font-family: 'Inter', monospace; font-size: 7.5px; color: #94a3b8; font-weight: 800; text-transform: uppercase; }
.WhyCRM .metric-value { font-family: 'Inter', sans-serif; font-size: .75rem; font-weight: 700; letter-spacing: -.01em; margin-top: .125rem; display: block; }
.WhyCRM .metric-sub { display: block; font-family: 'Inter', sans-serif; font-size: 6.5px; color: #94a3b8; }
.WhyCRM .footer-badge { font-family: 'Inter', monospace; font-size: 10px; color: #94a3b8; font-weight: 500; }
/* SVG text labels (replace Tailwind text-[..px]/fill-* classes used on <text> nodes) */
.WhyCRM .svg-label-sm { font-family: 'Inter', sans-serif; font-size: 7.5px; font-weight: 800; fill: #94a3b8; letter-spacing: .05em; text-transform: uppercase; }
.WhyCRM .svg-label-flow-on { font-family: 'Inter', monospace; font-size: 7px; font-weight: 700; fill: #047857; }
.WhyCRM .svg-label-flow-off { font-family: 'Inter', monospace; font-size: 7px; font-weight: 700; fill: #e11d48; }
.WhyCRM .svg-label-pool-on { font-family: 'Inter', sans-serif; font-size: 7.5px; font-weight: 700; fill: #059669; }
.WhyCRM .svg-label-pool-off { font-family: 'Inter', sans-serif; font-size: 7.5px; font-weight: 700; fill: #f43f5e; }
.framework-section{
    background:#fff;
    padding:90px 0;
}
.framework-section .container{
    max-width:1200px;
}
.framework-section .framework-header{
    margin:0 auto 60px;
}
.framework-section .eyebrow{
    color:#0ABCD8;
    font-size:1rem;
    margin-bottom:10px;
}
.framework-section .framework-title{
    font-size:2.5rem;
    font-weight:400;
    line-height:1.25;
    color:#000;
    margin-bottom:20px;
    letter-spacing:-0.02em;
    text-transform: uppercase;
}
.framework-section .framework-description{
    max-width:993px;
    margin:0 auto;
    font-size:1rem;
    line-height:1.8;
    color:#000;
}
.framework-section .framework-card{
    background:#FAFAFA;
    border:1px solid #EEEEEE;
    border-radius:20px;
    padding:28px 22px;
    height:100%;
    transition:.3s ease;
}
.framework-section .framework-card:hover{
    transform:translateY(-4px);
}
.framework-section .card-number{
    font-size:1.25rem;
    font-weight:600;
    color:#0ABCD8;
    margin-bottom:22px; 
}
.framework-section .framework-card h3{
    font-size:1.25rem;
    line-height:1.45;
    font-weight:600;
    color:#000;
    margin-bottom:10px;
    letter-spacing: 0;
}
.framework-section .framework-card p{
    font-size:1rem;
    line-height:1.75;
    color:#000;
    margin:0;
}

.fig-process {
    background: #ffffff;
}
.fig-process .process-wrapper {
    background: #1F3159;
    border-radius: 24px;
    padding: 106px 30px;
}
.fig-process .process-title {
    font-size: 2.5rem;
    line-height: 1.3;
    letter-spacing: 0;
    font-weight: 400;
}
.fig-process .process-inner {
    max-width: 963px;
    margin: auto;
}
.fig-process .process-subtitle {
    font-size: 1rem;
    color: rgba(255,255,255,.8);
    line-height: 1.8;
    margin-top: 18px;
}
.fig-process .timeline {
    position: relative;
    max-width: 980px;
    margin: 70px auto 0;
}
.fig-process .timeline::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 0;
    width: 1px;
    height: 100%;
    background: rgba(255,255,255,.35);
    transform: translateX(-50%);
}
.fig-process .timeline-item {
    position: relative;
    display: flex;
    align-items: center;
    margin-bottom: 75px;
}
.fig-process .timeline-item:last-child {
    margin-bottom: 0;
}
.fig-process .timeline-item.left {
    justify-content: flex-start;
}
.fig-process .timeline-item.left .timeline-content {
    width: calc(50% - 55px);
    text-align: center;
    padding-right: 40px;
}
.fig-process .timeline-item.left .timeline-number {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
.fig-process .timeline-item.right {
    justify-content: flex-end;
}
.fig-process .timeline-item.right .timeline-content {
    width: calc(50% - 55px);
    padding-left: 40px;
}
.fig-process .timeline-item.right .timeline-number {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
.fig-process .timeline-content h4 {
    color: #fff;
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 12px;
}
.fig-process .timeline-content p {
    color: rgba(255,255,255,.85);
    font-size: 16px;
    line-height: 1.8;
    margin: 0;
}
.fig-process .timeline-item.left :is(h4, p) {
    text-align: right;
}
.fig-process .timeline-content {
    padding: 17px 15px;
    border: 1px solid transparent;
}
.fig-process .timeline-item:hover .timeline-content {
    border: 1px solid rgba(255,255,255,.6);
    border-radius: 20px;
    background: rgb(250 250 250 / 5%);
}
.fig-process .timeline-number {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: #fff;
    color: #1F3159;
    font-weight: 700;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 5;
    transition: 0.5s ease;
}
.fig-process .timeline-item:hover .timeline-number {
    background: #1F3159;
    border: 1px solid #2d8cff;
    color: #fff;
}
.industry-section{
    padding:80px 0;
}
.industry-section .industry-menu{
    position:sticky;
    top:120px;
}
.industry-section .industry-link{
    display:block;
    width:100%;
    background:none;
    border:none;
    text-align:left;
    padding:0;
    margin-bottom:28px;
    font-size:2.5rem;
    font-weight:600;
    line-height:1.15;
    color:#B3B3B3;
    transition:.3s;
}
.industry-section .industry-link:hover{
    color:#112B63;
}
.industry-section .industry-link.active{
    color:#000;
}
.industry-section .industry-item{
    border-top:1px solid #ECECEC;
    padding:24px 0;
}
.industry-section .industry-item:last-child{
    border-bottom:1px solid #ECECEC;
}
.industry-section .industry-item h4{
    color:#112B63;
    font-size:1.25rem;
    font-weight:700;
    margin-bottom:14px;
}
.industry-section .industry-item p{
    color:#000;
    font-size:1rem;
    line-height:1.8;
    margin:0;
    max-width:95%;
}
.automation-stats{
    padding:38px 0;
    background:#FAFAFA;
}
.automation-stats .stats-title{
    font-size:2.5rem;
    font-weight:500;
    letter-spacing:.5px;
    margin-bottom:15px;
    color:#111;
}
.automation-stats .stats-subtitle{
    max-width:937px;
    color:#000  ;
    font-size:16px;
    line-height:1.7;
}
.automation-stats .stat-col{
    border-right:1px solid #969494;
}
.automation-stats .stat-box{
    text-align:center;
    padding:20px 30px;
    height:100%;
}
.automation-stats .stat-box h3{
    font-size:96px;
    font-weight:500;
    color:#112B63;
    margin-bottom:15px;
    line-height:1;
    letter-spacing: -0.02em;
}
.automation-stats .stat-box h5{
    font-size:20px;
    color:#000;
    margin-bottom:16px;
    text-transform:uppercase;
    letter-spacing: -0.02em;
}
.automation-stats.dark.headSm .stat-box h3 {
    font-size: 50px;
}
.automation-stats .stat-box p{
    font-size:16px;
    color:#000000;
    line-height:1.5;
    margin:0;
}
.cta-section.service-cta-section.service-cta-dark {
    background: #112B63;
}
.service-cta-dark :is(h2, p, .btn) {
    color: #fff;
}
.service-cta-dark span.highlight {
    color: #0ABCD8;
}
.service-cta-dark a.btn.btn-2 {
    background: #fff;
    color: #112b63 !important;
}
.service-cta-dark a.btn.btn-2:hover {
    background: transparent !important;
    color: #fff !important;
}
.service-cta-dark .btn {
    border: 1px solid #fff !important;
}
.service-cta-dark .btn:hover {
    background: #fff !important;
    color: #000 !important;
}
.service-cta-dark .btn:hover {
    background: #fff !important;
    color: #112b63 !important;
}
section .logo_sec4_content .logo_slide ul li a {
    color: #0abcd8;
    font-weight: bold;
}
section .logo_sec4_content .logo_slide ul li a:hover {
    color: #fff;
    text-decoration: underline;
}
.how-we-force-your-budget-section.SAD.RDS .steps-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 0;
}
/* First 6 items: 3 per row */
.how-we-force-your-budget-section.SAD.RDS .steps-grid > :nth-child(-n+6) {
    grid-column: span 2;
}
/* Last two items: half width each */
.how-we-force-your-budget-section.SAD.RDS .steps-grid > :nth-last-child(2),
.how-we-force-your-budget-section.SAD.RDS .steps-grid > :last-child {
    grid-column: span 3;
}
.industry-section .industry-link:hover {
  color: #0B1F4C;
  padding-left: 32px;
  cursor: pointer;
}
.industry-section .industry-link.active::after {
  content: attr(data-count);
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  padding: 2px 10px;
  border-radius: 20px;
}
.hero.paid-media-hero h1 span.light-highLight {
    color: #585C5E;
    font-weight: 400;
}
/* ===== Icon sizing helpers ===== */
.why-elite-email .icon-xs  { width: 14px; height: 14px; }
.why-elite-email .icon-sm  { width: 16px; height: 16px; }
.why-elite-email .icon-md  { width: 20px; height: 20px; }

/* ===== Active badge pill ===== */
.why-elite-email .badge-pill {
    display: inline-flex; align-items: center; gap: .25rem;
    border-radius: 999px; padding: .125rem .625rem;
    font-size: .75rem; font-weight: 500;
    background: #eef2ff; color: #4338ca;
    border: 1px solid #e0e7ff;
}
.why-elite-email .badge-pill .dot {
    width: .375rem; height: .375rem; border-radius: 50%;
    background: #4f46e5;
    animation: pulse-opacity 2s cubic-bezier(.4,0,.6,1) infinite;
}

/* ===== Section heading ===== */
.why-elite-email .display-heading {
    font-weight: 800; letter-spacing: -.025em;
    color: #09090b; line-height: 1.08;
    font-size: 1.875rem;
}
@media (min-width: 768px)  { .why-elite-email .display-heading { font-size: 2.25rem; } }
@media (min-width: 992px)  { .why-elite-email .display-heading { font-size: 2.65rem; } }

/* ===== Sub-heading label ===== */
.why-elite-email .sub-heading {
    font-weight: 800;
    letter-spacing: .08em; font-size: .75rem; text-transform: uppercase;
    color: #18181b;
}
@media (min-width: 768px) { .why-elite-email .sub-heading { font-size: .875rem; } }

/* ===== Feature list ===== */
.why-elite-email .feature-list { border-bottom: 1px solid rgba(244,244,245,.9); }
.why-elite-email .feature-row {
    border-top: 1px solid #f4f4f5;
    padding: 1.25rem 0;
    display: flex; align-items: flex-start;
    transition: background .2s;
}
.why-elite-email .feature-row:hover { background: rgba(250,250,250,.4); }

.why-elite-email .feature-num {
    font-weight: 700;
    font-size: .75rem; color: #a1a1aa;
    letter-spacing: .05em; padding-top: .125rem;
    width: 2.5rem; flex-shrink: 0;
}
@media (min-width: 768px) { .why-elite-email .feature-num { font-size: .875rem; } }

.why-elite-email .feature-title {
    font-weight: 700;
    font-size: 1rem; letter-spacing: -.01em; color: #09090b;
}
@media (min-width: 768px) { .why-elite-email .feature-title { font-size: 1.125rem; } }

.why-elite-email .feature-desc {
    font-size: .75rem; color: #71717a; line-height: 1.65;
    margin-top: .375rem; max-width: 36rem;
}
@media (min-width: 768px) { .why-elite-email .feature-desc { font-size: .875rem; } }

/* ===== Simulator card ===== */
.why-elite-email .glow-aura {
    position: absolute; inset: -.625rem;
    background: linear-gradient(to top right, #eef2ff, rgba(238,242,255,.1));
    border-radius: 1.5rem; filter: blur(48px); opacity: .5; z-index: -1;
}
.why-elite-email .sim-card {
    width: 100%; display: flex; flex-direction: column; justify-content: space-between;
    background: #fafafa; border: 1px solid #e4e4e7;
    border-radius: 1rem; padding: 1.5rem; height: 580px;
    box-shadow: 0 1px 3px rgba(0,0,0,.06); user-select: none;
    position: relative; overflow: hidden;
}
@media (min-width: 992px) { .why-elite-email .sim-card { padding: 2rem; } }

/* ===== Sim header ===== */
.why-elite-email .sim-header {
    display: flex; align-items: center; justify-content: space-between;
    border-bottom: 1px solid #e4e4e7; padding-bottom: 1rem; position: relative; z-index: 10;
}
.why-elite-email .sim-live-label {
    display: flex; align-items: center; gap: .375rem;
    font-size: .75rem;
    font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #4f46e5;
}
.why-elite-email .sim-title {
    font-weight: 900;
    font-size: 1.125rem; line-height: 1.2; margin-top: .125rem; color: #18181b;
}
.why-elite-email .sim-badge {
    font-size: 10px; background: #f4f4f5; border-radius: 999px;
    padding: .25rem .625rem; color: #71717a;
    font-weight: 500;
}

/* ===== Ping spinner ===== */
.why-elite-email .ping-wrapper { position: relative; display: flex; width: .5rem; height: .5rem; }
.why-elite-email .ping-dot {
    position: relative; display: inline-flex; border-radius: 50%;
    width: .5rem; height: .5rem; background: #4f46e5;
}
.why-elite-email .ping-ring {
    animation: ping-anim .9s cubic-bezier(0,0,.2,1) infinite;
    position: absolute; display: inline-flex; border-radius: 50%;
    width: 100%; height: 100%; background: #818cf8; opacity: .75;
}
@keyframes ping-anim {
    75%, 100% { transform: scale(2); opacity: 0; }
}

/* ===== Constellation area ===== */
.why-elite-email .constellation {
    flex: 1; position: relative; margin: 1rem 0; border-radius: .75rem;
    background: rgba(244,244,245,.3); border: 1px solid rgba(228,228,231,.2);
    overflow: hidden; display: flex; align-items: center; justify-content: center;
}

/* ===== Transmitter dot ===== */
.why-elite-email .transmitter {
    position: absolute; left: 50%; top: 52%;
    transform: translate(-50%, -50%); z-index: 20;
    width: 3.5rem; height: 3.5rem; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 4px 6px rgba(0,0,0,.1);
    border: 1px solid; transition: all .3s;
}
.why-elite-email .transmitter.tx-indigo { background: #4f46e5; border-color: #6366f1; color: #fff; }
.why-elite-email .transmitter.tx-emerald { background: #059669; border-color: #10b981; color: #fff; }

/* ===== Ticker bar ===== */
.why-elite-email .ticker-bar {
    position: absolute; bottom: .75rem; left: .75rem; right: .75rem;
    background: rgba(255,255,255,.95); border: 1px solid rgba(228,228,231,.5);
    border-radius: .5rem; padding: .5rem .75rem;
    display: flex; align-items: center; justify-content: space-between;
    font-size: .75rem; box-shadow: 0 1px 2px rgba(0,0,0,.05); z-index: 10;
}
.why-elite-email .ticker-left { display: flex; align-items: center; gap: .5rem; }
.why-elite-email .ticker-text { font-weight: 700; letter-spacing: -.01em; color: #52525b; }
.why-elite-email .ticker-tag {
    font-size: 10px; background: #f4f4f5; color: #52525b;
    padding: .125rem .5rem; border-radius: .25rem;
    font-weight: 500;
}

/* ===== Node label helpers ===== */
.why-elite-email #nodes-container .node-label {
    position: absolute; transform: translate(-50%,-50%);
    display: flex; flex-direction: column; align-items: center;
    justify-content: center; pointer-events: none;
}
.why-elite-email .node-name {
    position: absolute; top: 1rem;
    font-size: 9px;
    color: #a1a1aa; white-space: nowrap;
}
/* Dot states */
.why-elite-email .nd { border-radius: 50%; transition: all .5s; }
.why-elite-email .nd-idle { background: #e4e4e7; border: 1px solid #d4d4d8; }
.why-elite-email .nd-active {
    background: #4f46e5; border: 1px solid #818cf8;
    box-shadow: 0 0 0 4px #eef2ff;
}
.why-elite-email .nd-success {
    background: #10b981; border: 1px solid #34d399;
    box-shadow: 0 0 0 4px #ecfdf5;
}
/* Ping rings */
.why-elite-email .np { position: absolute; width: 1.75rem; height: 1.75rem; border-radius: 50%; transform: scale(0); opacity: 0; transition: all .7s; }
.why-elite-email .np-indigo { background: rgba(99,102,241,.2); }
.why-elite-email .np-indigo.expanded { transform: scale(1.5); opacity: 1; }
.why-elite-email .np-indigo.faded { transform: scale(2); opacity: 0; }

/* ===== Metrics grid ===== */
.why-elite-email .metrics-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: .75rem; position: relative; z-index: 10; }
.why-elite-email .metric-card {
    background: #fff; border: 1px solid #e4e4e7;
    border-radius: .75rem; padding: .875rem; box-shadow: 0 1px 2px rgba(0,0,0,.04);
}
.why-elite-email .metric-icon-row {
    display: flex; align-items: center; gap: .25rem;
    font-size: 10px; text-transform: uppercase;
    font-weight: 700; letter-spacing: .04em; color: #a1a1aa;
}
.why-elite-email .metric-value {
    font-weight: 900;
    font-size: 1.125rem; letter-spacing: -.02em; margin-top: .25rem;
    color: #09090b;
}
@media (min-width: 768px) { .why-elite-email .metric-value { font-size: 1.25rem; } }
.why-elite-email .metric-sub { font-size: 10px; color: #71717a; margin-top: .125rem; font-weight: 500; }
.why-elite-email .metric-sub.highlight { color: #4f46e5; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; font-size: 9px; }
.why-elite-email .metric-sub.success { color: #059669; font-weight: 700; }

/* ===== Shared animations ===== */
@keyframes pulse-opacity {
    0%, 100% { opacity: 1; }
    50% { opacity: .4; }
}
.transition-section{
    padding:90px 0;
    background:#fff;
}
.transition-section .transition-heading{
    font-size:2.5rem;
    font-weight:400;
    line-height:1.2;
    color:#000;
    letter-spacing:-.5px;
}
/* Layout */
.transition-section .comparison-wrapper{
    display:grid;
    grid-template-columns:1fr 60px 1fr;
    align-items:end;
    gap:35px;
    margin:auto;
}
/* Headings */
.transition-section .comparison-column h3{
    font-size:2rem;
    font-weight:400;
    margin-bottom:35px;
}
.transition-section .left-column h3{
    color:#000;
    text-align:right;
}
.transition-section .right-column h3{
    color:#0B1F4C;
    font-weight:bold;
}
/* Lists */
.transition-section .comparison-column ul{
    list-style:none;
    padding:0;
    margin:0;
}
.transition-section .comparison-column li{
    font-size:1.5rem;
    line-height:1.8;
    margin-bottom:37px;
}
.transition-section .left-column li{
    text-align:right;
    color:#000;
}
.transition-section .right-column li{
    color:#0B1F4C;
    transition: 0.5s;
}
.transition-section .right-column li:hover {
    padding-left: 15px;
    font-weight: bold;
}
.transition-section .left-column li {
    transition: all 0.3s ease;
}
.transition-section .left-column li.crossed {
    color: #0000004D;
    text-decoration: line-through;
}
/* Timeline */
.transition-section .timeline{
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 316px;
    gap: 48px;
}
.transition-section .timeline::before{
    content:"";
    position:absolute;
    width:2px;
    height:100%;
    background:#0B1F4C;
    left:50%;
    transform:translateX(-50%);
    bottom: 10%;
}
.transition-section .dot{
    width:14px;
    height:14px;
    border-radius:50%;
    background:#0B1F4C;
    position:relative;
    z-index:2;
}
/* ----- Funnel.io Styles ----- */
.FunnelIO {
    font-family: "Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system, sans-serif;
    background-color: #FAFAFA;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    color: #27272a;
    user-select: none;
}
@media (min-width: 768px) {
    .FunnelIO {
        padding: 2rem;
    }
}
@media (min-width: 992px) {
    .FunnelIO {
        padding: 3rem;
    }
}

.FunnelIO .container-custom {
    width: 100%;
    background: #FAFAFA;
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
}
@media (min-width: 576px) {
    .FunnelIO .container-custom {
        padding-top: 2.5rem;
        padding-bottom: 2.5rem;
    }
}

/* Active zone transitions */
.FunnelIO .active-zone {
    transition: opacity 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

/* SVG element transitions */
.FunnelIO #svg-border-left,
.FunnelIO #svg-border-right,
.FunnelIO #svg-gate-1,
.FunnelIO #svg-gate-2,
.FunnelIO #svg-tray {
    transition: stroke 0.4s ease;
}

/* Header */
.FunnelIO .funnel-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid rgba(228, 228, 231, 0.5);
}

.FunnelIO .funnel-header .brand-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #0B1F4C;
    display: inline-block;
}

.FunnelIO .funnel-header .brand-name {
    font-weight: 700;
    color: #18181b;
    font-size: 0.875rem;
    letter-spacing: -0.02em;
}

.FunnelIO .funnel-header .brand-label {
    font-size: 0.75rem;
    color: #a1a1aa;
    font-weight: 500;
}

.FunnelIO .btn-inject {
    background: #0B1F4C;
    color: #ffffff;
    font-weight: 600;
    padding: 0.375rem 1rem;
    border-radius: 0.75rem;
    font-size: 0.75rem;
    border: none;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.FunnelIO .btn-inject:hover {
    background: #1d4ed8;
    color: #ffffff;
}
.FunnelIO .btn-inject:active {
    transform: scale(0.95);
}
.FunnelIO .btn-inject i {
    font-size: 0.875rem;
}

/* Left content */
.FunnelIO .left-content h1 {
    font-size: 1.5rem;
    letter-spacing: -0.02em;
    color: #282828;
    line-height: 1.15;
    text-transform: uppercase;
}
@media (min-width: 576px) {
    .FunnelIO .left-content h1 {
        font-size: 1.875rem;
    }
}
@media (min-width: 992px) {
    .FunnelIO .left-content h1 {
        font-size: 2.125rem;
    }
}
@media (min-width: 1200px) {
    .FunnelIO .left-content h1 {
        font-size: 2.5rem;
    }
}

.FunnelIO .left-content .description {
    color: #000;
    font-size: 0.75rem;
    line-height: 1.6;
    max-width: 576px;
    font-weight: 400;
}
@media (min-width: 576px) {
    .FunnelIO .left-content .description {
        font-size: 1rem;
    }
}

/* Step items */
.FunnelIO .step-item {
    cursor: pointer;
    padding: 1.5rem 0;
    transition: all 0.3s;
    border-bottom: 1px solid rgba(228, 228, 231, 0.7);
}
.FunnelIO .step-item:last-child {
    border-bottom: none;
}

.FunnelIO .step-item .step-num {
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: #a1a1aa;
    transition: color 0.3s;
}
@media (min-width: 576px) {
    .FunnelIO .step-item .step-num {
        font-size: 0.875rem;
    }
}

.FunnelIO .step-item .step-title {
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #18181b;
    transition: color 0.3s;
}
@media (min-width: 576px) {
    .FunnelIO .step-item .step-title {
        font-size: 1.25rem;
    }
}

.FunnelIO .step-item .step-desc {
    color: #000;
    font-size: 0.75rem;
    line-height: 1.6;
}
@media (min-width: 576px) {
    .FunnelIO .step-item .step-desc {
        font-size: 1rem;
    }
}

.FunnelIO .step-item.active {
    background: rgba(244, 244, 245, 0.3);
    border-radius: 0.5rem;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    margin-left: -0.75rem;
    margin-right: -0.75rem;
}

.FunnelIO .step-item.active .step-num {
    color: #0B1F4C;
}
.FunnelIO .step-item.active .step-title {
    color: #000;
    font-weight: 600;
}

/* Visualizer Card */
.FunnelIO .visualizer-card {
    background: #ffffff;
    border: 1px solid #e4e4e7;
    border-radius: 1rem;
    padding: 1.25rem;
    box-shadow: 0 8px 30px -12px rgba(0, 0, 0, 0.05);
    position: relative;
    overflow: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
}
.FunnelIO .visualizer-card .viz-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #f4f4f5;
    padding-bottom: 0.75rem;
    margin-bottom: 0.75rem;
}
.FunnelIO .visualizer-card .viz-header .status-dot {
    position: relative;
    display: inline-block;
    width: 8px;
    height: 8px;
}
.FunnelIO .visualizer-card .viz-header .status-dot .ping {
    position: absolute;
    display: inline-flex;
    height: 100%;
    width: 100%;
    border-radius: 50%;
    background: #3b82f6;
    opacity: 0.75;
    animation: ping 1.5s ease-in-out infinite;
}
.FunnelIO .visualizer-card .viz-header .status-dot .dot {
    position: relative;
    display: inline-flex;
    border-radius: 50%;
    height: 8px;
    width: 8px;
    background: #3b82f6;
    margin: 0 !important;
    bottom: 15px;
}
@keyframes ping {
    0% {
        transform: scale(1);
        opacity: 0.75;
    }
    100% {
        transform: scale(2);
        opacity: 0;
    }
}
.FunnelIO .visualizer-card .viz-header .viz-title {
    font-size: 0.75rem;
    font-weight: 700;
    color: #18181b;
    letter-spacing: -0.02em;
}
@media (min-width: 576px) {
    .FunnelIO .visualizer-card .viz-header .viz-title {
        font-size: 0.875rem;
    }
}
.FunnelIO .visualizer-card .viz-header .viz-sub {
    font-size: 0.625rem;
    color: #a1a1aa;
    font-weight: 500;
}
.FunnelIO .visualizer-card .viz-header .speed-badge {
    font-size: 0.625rem;
    color: #059669;
    background: #ecfdf5;
    padding: 0.125rem 0.5rem;
    border-radius: 0.25rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}
/* SVG Container */
.FunnelIO .svg-container {
    position: relative;
    flex: 1;
    min-height: 310px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0.75rem 0;
    overflow: hidden;
    border-radius: 0.75rem;
    background: rgba(244, 244, 245, 0.5);
    border: 1px solid #f4f4f5;
}
.FunnelIO .svg-container .alerts-container {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 30;
}
.FunnelIO .svg-container .overlay-indicators {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    pointer-events: none;
    padding: 0.75rem 0.75rem 1.5rem 0.75rem;
}
.FunnelIO .svg-container .overlay-indicators .indicator {
    cursor: pointer;
    border: 1px dashed transparent;
    border-radius: 0.75rem;
    padding: 0.5rem;
    transition: all 0.3s;
    pointer-events: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    opacity: 0.4;
}
.FunnelIO .svg-container .overlay-indicators .indicator:hover {
    opacity: 1;
    border-color: #e4e4e7;
}
.FunnelIO .svg-container .overlay-indicators .indicator.active-blue {
    background: rgba(59, 130, 246, 0.05);
    border-color: #93c5fd;
    opacity: 1;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}
.FunnelIO .svg-container .overlay-indicators .indicator.active-amber {
    background: rgba(245, 158, 11, 0.05);
    border-color: #fcd34d;
    opacity: 1;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}
.FunnelIO .svg-container .overlay-indicators .indicator.active-emerald {
    background: rgba(16, 185, 129, 0.05);
    border-color: #6ee7b7;
    opacity: 1;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}
.FunnelIO .svg-container .overlay-indicators .indicator .label {
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}
.FunnelIO .svg-container .overlay-indicators .indicator .label.blue {
    color: #0B1F4C;
}
.FunnelIO .svg-container .overlay-indicators .indicator .label.amber {
    color: #d97706;
}
.FunnelIO .svg-container .overlay-indicators .indicator .label.emerald {
    color: #059669;
}
.FunnelIO .svg-container .overlay-indicators .indicator .count {
    font-size: 0.625rem;
    font-weight: 500;
    color: #71717a;
}
.FunnelIO .svg-container .overlay-indicators .indicator .icon-box {
    padding: 0.25rem;
    border-radius: 0.375rem;
}
.FunnelIO .svg-container .overlay-indicators .indicator .icon-box.blue {
    background: #eff6ff;
    color: #0B1F4C;
}
.FunnelIO .svg-container .overlay-indicators .indicator .icon-box.amber {
    background: #fffbeb;
    color: #d97706;
}
.FunnelIO .svg-container .overlay-indicators .indicator .icon-box.emerald {
    background: #ecfdf5;
    color: #059669;
}
.FunnelIO .svg-container .overlay-indicators .indicator .icon-box i {
    font-size: 0.875rem;
}
/* SVG */
.FunnelIO .svg-container .funnel-svg {
    width: 100%;
    max-width: 270px;
    height: 100%;
    object-fit: contain;
    position: relative;
    z-index: 20;
    pointer-events: none;
}
/* Bottom stats */
.FunnelIO .stats-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    border-top: 1px solid #f4f4f5;
    padding-top: 1rem;
    background: rgba(244, 244, 245, 0.5);
    padding: 0.75rem;
    border-radius: 1rem;
    margin-top: 0.5rem;
}
.FunnelIO .stats-row .stat-item {
    text-align: center;
}
.FunnelIO .stats-row .stat-item .stat-label {
    font-size: 0.6875rem;
    color: #71717a;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.FunnelIO .stats-row .stat-item .stat-value {
    font-size: 1rem;
    font-weight: 700;
    color: #18181b;
}
.FunnelIO .stats-row .stat-item .stat-value.emerald {
    color: #059669;
}
.FunnelIO .stats-row .stat-item.border-divider {
    border-left: 1px solid #f4f4f5;
    border-right: 1px solid #f4f4f5;
    padding: 0 0.5rem;
}
@media (min-width: 992px) {
    .FunnelIO .left-content {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        padding-top: 0.5rem;
        padding-bottom: 0.5rem;
    }
    .FunnelIO .left-content .step-list {
        margin-top: 2rem;
        border-top: 1px solid rgba(228, 228, 231, 0.7);
    }
}
.use-cases-section{
    background:#fff;
    padding:80px 0;
}
.use-cases-section .use-cases-container{
    max-width:1310px;
}
.use-cases-section .section-title{
    font-size:2.5rem;
    font-weight:300;
    color:#000;
    letter-spacing:-0.5px;
    margin:0;
}
.use-cases-section .use-card{
    background:#fafafa;
    border:1px solid #ececec;
    border-radius:22px;
    padding:40px;
    height:100%;
    transition:.3s ease;
}
.use-cases-section .use-card:hover{
    transform:translateY(-5px);
    box-shadow:0 15px 40px rgba(0,0,0,.06);
}
.use-cases-section .category{
    display:inline-block;
    color:#0ABCD8;
    font-size:.85rem;
    font-weight:600;
    letter-spacing:.05em;
    text-transform:uppercase;
    margin-bottom:18px;
}
.use-cases-section .card-title{
    font-size:2.5rem;
    font-weight:300;
    line-height:1.15;
    color:#000;
    margin-bottom:35px;
}
.use-cases-section .card-title .dark-blue{
    color:#112B63;
    font-weight:700;
}
.use-cases-section .card-title em{
    font-style:italic;
    font-weight:400;
}
.use-cases-section .light-title{
    color:#666;
}
.use-cases-section .card-content p{
    font-size:1rem;
    line-height:1.8;
    color:#444;
    margin-bottom:25px;
}
.use-cases-section .card-content p:last-child{
    margin-bottom:0;
}
.use-cases-section .card-content a{
    color:#666;
    text-decoration:none;
}
.use-cases-section .card-content a:hover{
    color:#112B63;
}
.use-cases-section .more-content{
    display:none;
}
.use-cases-section .more-content.show{
    display:block;
}
.use-cases-section .see-more-btn{
    background: none;
    border: none !important;
    padding: 0 !important;
    color: #112B63;
    font-size: 1rem !important;
    font-weight: 600;
    cursor: pointer;
    margin-top: 10px;
}
.use-cases-section .see-more-btn:hover{
    color:#0ABCD8;
}
.truth-section{
    background:#1F3159;
    padding:60px 0;
}
.truth-section .truth-heading-wrap{
    display:flex;
    align-items:flex-start;
    gap:18px;
}
.truth-section .heading-line{
    width:3px;
    height:85px;
    background:#0ABCD8;
    flex-shrink:0;
    margin-top:4px;
}
.truth-section .truth-heading{
    margin:0;
    color:#fff;
    font-size:2.5rem;
    font-weight:300;
    line-height:1.2;
}
.truth-section .truth-heading span{
    display:block;
    color:#0ABCD8;
    font-weight:700;
}
.truth-section .truth-label{
    display:block;
    color:#0ABCD8;
    font-size:1rem;
    text-transform:uppercase;
    letter-spacing:.12em;
    margin-bottom:18px;
    text-align:center;
    margin-bottom:40px;
}
.truth-section .truth-content p{
    color:rgba(255,255,255,.9);
    font-size:1rem;
    line-height:1.75;
    margin-bottom:22px;
}
.truth-section .truth-content p:last-child{
    margin-bottom:0;
}
.ASTON360 {
    color: #000;
    background-color: #FAFAFA;
}
.ASTON360 .mono-text {
    font-size: 1rem;
}
.ASTON360 .text-dark, .ASTON360 p {
    color: #000 !important;
}
/* Pulse node keyframe animation */
@keyframes ASTON360-pulse-ring {
    0% {
        transform: scale(0.95);
        opacity: 0.5;
    }
    50% {
        opacity: 1;
    }
    100% {
        transform: scale(1.15);
        opacity: 0;
    }
}
.ASTON360 .pulse-node {
    animation: ASTON360-pulse-ring 2s cubic-bezier(0.24, 0, 0.38, 1) infinite;
    transform-origin: center;
}
.ASTON360 .glow-salesforce {
    filter: drop-shadow(0 0 12px rgba(0, 161, 224, 0.4));
}
.ASTON360 .glow-microsoft {
    filter: drop-shadow(0 0 12px rgba(0, 164, 239, 0.4));
}
.ASTON360 .glow-lead {
    filter: drop-shadow(0 0 12px rgba(255, 122, 89, 0.4));
}
/* Strategy Card Interactions */
.ASTON360 .strategy-card {
    transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
    border: 1px solid rgba(0, 0, 0, 0.05);
    cursor: pointer;
    background: #ffffff;
}
.ASTON360 .strategy-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.04);
}
.ASTON360 .strategy-card.active-salesforce {
    border-left: 4px solid #00a1e0 !important;
    background-color: #f0f8ff;
    box-shadow: 0 8px 20px rgba(0, 161, 224, 0.06);
}
.ASTON360 .strategy-card.active-microsoft {
    border-left: 4px solid #00a4ef !important;
    background-color: #f3f9ff;
    box-shadow: 0 8px 20px rgba(0, 164, 239, 0.06);
}
.ASTON360 .strategy-card.active-lead {
    border-left: 4px solid #ff7a59 !important;
    background-color: #fffaf8;
    box-shadow: 0 8px 20px rgba(255, 122, 89, 0.06);
}
.ASTON360 .sticky-animation {
    position: sticky;
    top: 2rem;
    z-index: 10;
}
.ASTON360 .transition-all {
    transition: all 0.3s ease;
}
@keyframes ASTON360-blink {
    0%,
    100% {
        opacity: 1;
    }
    50% {
        opacity: 0.4;
    }
}
.ASTON360 .pulse-dot {
    animation: ASTON360-blink 1.5s ease infinite;
}
/* Card title text */
.ASTON360 .card-title-text {
    transition: color 0.2s;
}
/* SVG Node hover */
.ASTON360 .svg-node {
    cursor: pointer;
}
.ASTON360 .svg-node:hover .node-circle {
    stroke-width: 3;
}
/* Icon colors */
.ASTON360 .icon-salesforce {
    color: #00a1e0;
}
.ASTON360 .icon-microsoft {
    color: #00a4ef;
}
.ASTON360 .icon-leads {
    color: #ff7a59;
}
.ASTON360 .icon-white {
    color: #ffffff;
}
.newsletter-input:focus {
    color: #fff !important;
}
.newsletter-btn:hover {
    color: #000 !important;
}
.automation-stats.dark {
    background: #0B1F4C;
}
.automation-stats.dark :is(*) {
    color: #fff !important;
}
.automation-stats.dark .stat-box h3 {
    color: #0ABCD8 !important;
}
.framework-section .framework-card.no-border {
    background: #fff;
    border: none;
}
.framework-section .framework-card.no-border .line {
    width: 24px;
    border: 1px solid #0ABCD8;
    margin-bottom: 7px;
}
.authority-simulator .main-title {
font-size: clamp(2.0rem, 4vw, 2.5rem);
line-height: 1.15;
letter-spacing: -0.03em;
text-transform: uppercase;
}
.authority-simulator .main-title strong {
font-weight: 600;
}
.authority-simulator .stage-card {
transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
padding: 24px 0;
cursor: pointer;
position: relative;
}
.authority-simulator .stage-card::after {
content: '';
position: absolute;
left: 0;
bottom: 0;
width: 0;
height: 2px;
background-color: #0B1F4C;
transition: width 0.3s ease;
}
.authority-simulator .stage-card:hover::after,
.authority-simulator .stage-card.active::after {
width: 100%;
}
.authority-simulator .stage-card.active {
padding-left: 12px;
padding-right: 12px;
border-radius: 6px;
}
.authority-simulator .stage-number {
font-size: 1.1rem;
color: #969494;
font-weight: 500;
}
.authority-simulator .stage-title {
font-size: 1.25rem;
font-weight: 600;
letter-spacing: -0.01em;
margin-bottom: 8px;
}
.authority-simulator .stage-content {
font-size: 1rem;
color: #000000B2;
max-width: 634px;

}
.authority-simulator .slider-custom {
    -webkit-appearance: none;
    width: 100% !important;
    height: 6px !important;
    border-radius: 3px;
    background: #EDEDED !important;
    outline: none;
    transition: background 0.3s;
    padding: 6px !important;
    overflow: visible;
}
.authority-simulator .slider-custom::-webkit-slider-thumb {
-webkit-appearance: none;
appearance: none;
width: 18px;
height: 18px;
border-radius: 50%;
background: #0B1F4C;
cursor: pointer;
transition: transform 0.1s ease;
box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}
.authority-simulator .slider-custom::-webkit-slider-thumb:hover {
transform: scale(1.25);
}
.authority-simulator button#playBtn {
    border: none !important;
    padding: 6px 1rem !important;
    background: #000;
    font-size: 0.65rem !important;
    border-radius: 6px !important;
}

.outcomes-section2{
    background:#0B1F4C;
    padding:80px 0;
}
.outcomes-section2 .outcomes-container{
    max-width:1490px;
}
/* Bootstrap doesn't have 5 equal columns */
@media (min-width:992px){
    .outcomes-section2 .col-lg-2-4{
        width:20%;
        flex:0 0 auto;
    }
}
.outcomes-section2 .section-title{
    color:#fff;
    font-size:2.5rem;
    font-weight:300;
    line-height:1.25;
    margin:0;
}
.outcomes-section2 .section-title span{
    color:#0ABCD8;
    font-style:italic;
    font-weight:400;
}
.outcomes-section2 .outcome-card{
    background:rgba(250,250,250,.10); /* #FAFAFA1A */
    border-radius:14px;
    padding:24px;
    height:100%;
    transition:.3s ease;
}
.outcomes-section2 .outcome-card:hover{
    background:rgba(250,250,250,.16);
    transform:translateY(-4px);
}
.outcomes-section2 .number{
    display:block;
    color:#0ABCD8;
    font-size:2rem;
    font-weight:700;
    margin-bottom:18px;
}
.outcomes-section2 .outcome-card p{
    color:#fff;
    font-size:1rem;
    line-height:1.7;
    margin:0;
    opacity:.95;
}
.cta-section.service-cta-section.service-cta-dark.organic-cta-section {
    text-align: left;
}
.cta-section.service-cta-section.service-cta-dark.organic-cta-section .container {
    max-width: 1250px !important;
}
.cta-section.service-cta-section.service-cta-dark.organic-cta-section  .section-header {
    margin: 0;
}
.cta-section.service-cta-section.service-cta-dark.organic-cta-section  .cta-buttons {
    justify-content: start;
}
.outcomes-section2 .outcome-card h3 {
    font-size: 1.5rem;
    color: #0ABCD8;
    font-weight: 700;
}
.strategy-section-num{
    padding:90px 0;
    background:#fff;
}
.strategy-section-num .strategy-container{
    max-width:1490px;
    background:#FAFAFA;
    border-radius:20px;
    padding:50px 65px;
}
.strategy-section-num .strategy-title{
    font-size:2.5rem;
    line-height:1.35;
    color:#000;
    margin-bottom:30px;
}
.strategy-section-num .strategy-title span{
    color:#0B1F4C;
    font-weight:700;
}
.strategy-section-num .strategy-intro{
    font-size:1rem;
    color:#000;
    line-height:1.8;
}
.strategy-section-num .strategy-list{
    border-top:1px solid #d9d9d9;
}
.strategy-section-num .strategy-item{
    display:grid;
    grid-template-columns:50px 1fr;
    column-gap:28px;
    padding:28px 0;
    border-bottom:1px solid #d9d9d9;
}
.strategy-section-num .number{
    font-size:1rem;
    color:#666;
    padding-top:4px;
}
.strategy-section-num .content h4{
    font-size:1.25rem;
    font-weight:600;
    color:#000;
    margin-bottom:12px;
}
.strategy-section-num .content p{
    font-size:1rem;
    color: #000000B2;
    margin:0;
    max-width:634px;
}
 .seo-delivery {
      background-color: #ffffff;
    }
    .seo-delivery h1, .seo-delivery h2, .seo-delivery h3, .seo-delivery h4, .seo-delivery h5, .seo-delivery h6, .seo-delivery .display-heading {
      letter-spacing: -0.02em;
    }
    .seo-delivery .brand-accent-text {
      color: #0ABCD8;
      font-weight: 700;
    }
    .seo-delivery .transition-all-custom {
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .seo-delivery .custom-card {
      border: 0;
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04);
      background: #fafafa;
      border-radius: 16px;
    }
    @keyframes pulse-dot {
      0% { transform: scale(0.9); opacity: 0.6; }
      50% { transform: scale(1.1); opacity: 1; }
      100% { transform: scale(0.9); opacity: 0.6; }
    }
    .seo-delivery .pulse-indicator {
      animation: pulse-dot 1.5s infinite ease-in-out;
    }
    .seo-delivery button#toggle-unoptimized , .seo-delivery button#toggle-optimized {
    padding: 4px 16px !important;
    font-size: 0.75rem !important;
    border-radius: 20px !important;
    }
  .onpageAnimation {
    background-color: #f8f9fa;
    color: #212529;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
    padding: 30px 0;
    margin: 60px 0;
  }
  .onpageAnimation .navbar-brand {
    font-weight: 700;
    letter-spacing: -0.02em;
  }
  .onpageAnimation .glow-cyan {
    text-shadow: 0 0 15px rgba(10, 188, 216, 0.2);
  }
  .onpageAnimation .card {
    border-radius: 20px;
    border: 1px solid rgba(0, 0, 0, 0.06);
  }
  .onpageAnimation .font-monospace {
    letter-spacing: 0.02em;
  }
  .onpageAnimation .btn-primary {
  padding: 6px 14px !important;
  background-color: #0ABCD8 !important;
  border-color: #0ABCD8 !important;
  font-size: 12px !important;
  border-radius: 12px !important;
  }
  .onpageAnimation .btn-primary:hover {
    background-color: #0999C2 !important;
    border-color: #0999C2 !important;
  }
  .onpageAnimation .flow-arena {
    height: 180px;
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    background-color: #f8f9fa;
  }
  .onpageAnimation .particle {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    transform: translate(-50%, -50%);
  }
  .onpageAnimation .pulse-indicator {
    animation: pulse 1.5s infinite;
  }
  .onpageAnimation .animate-spin {
    animation: spin 1s linear infinite;
  }
  .onpageAnimation .main-heading {
    font-size: 1.8rem;
    line-height: 1.2;
  }
  @media (min-width: 992px) {
    .onpageAnimation .main-heading {
      font-size: 2.5rem;
    }
  }    
  @keyframes pulse {
    0% { transform: scale(0.95); opacity: 0.5; }
    50% { transform: scale(1.1); opacity: 1; }
    100% { transform: scale(0.95); opacity: 0.5; }
  }
  @keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
  }
  .onpageAnimation .form-check-input[type="checkbox"] {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  position: relative !important;
  width: 48px !important;
  height: 26px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #ced4da !important;
  border: none !important;
  border-radius: 999px !important;
  cursor: pointer !important;
  outline: none !important;
  box-shadow: none !important;
  transition: background-color .25s ease !important;
}
.onpageAnimation .form-check-input[type="checkbox"]::before {
  content: "" !important;
  position: absolute !important;
  top: 3px !important;
  left: 3px !important;
  width: 20px !important;
  height: 20px !important;
  background: #fff !important;
  border-radius: 50% !important;
  box-shadow: 0 2px 5px rgba(0,0,0,.25) !important;
  transition: transform .25s ease !important;
}
.onpageAnimation .form-check-input[type="checkbox"]:checked {
  background: #0d6efd !important;
}
.onpageAnimation .form-check-input[type="checkbox"]:checked::before {
  transform: translateX(22px) !important;
}
.onpageAnimation .form-check-input[type="checkbox"]:hover {
  filter: brightness(.96) !important;
}
.onpageAnimation .form-check-input[type="checkbox"]:focus {
  outline: none !important;
  box-shadow: 0 0 0 4px rgba(13,110,253,.25) !important;
}
.onpageAnimation .form-check-input[type="checkbox"]:active::before {
  width: 22px !important;
}
.onpageAnimation .form-check-input[type="checkbox"]:disabled {
  opacity: .5 !important;
  cursor: not-allowed !important;
}
.onpageAnimation .form-check-input[type="checkbox"]:disabled::before {
  background: #f8f9fa !important;
}
.automation-stats.dark span.highlight i {
    color: #0ABCD8 !important;
}
.domainAnimationSec {
  color: #2b2d42;
}
.domainAnimationSec .visualizer-card {
  background: white;
  border-radius: 1rem;
  border: none;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
  width: 100%;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.domainAnimationSec .text-cyan-brand {
  color: #0ABCD8 !important;
}
.domainAnimationSec .btn-info {
  background-color: #0ABCD8 !important;
  border-color: #0ABCD8 !important;
  color: white !important;
    font-size: 0.675rem !important;
  padding: 0.375rem 0.75rem !important;
}
.domainAnimationSec .btn-outline-secondary {
  border-color: #dee2e6 !important;
  color: #6c757d !important;
  font-size: 0.675rem !important;
  padding: 0.375rem 0.75rem !important;
}
.domainAnimationSec button#btn-add-backlink, 
.onpageAnimation button#btn-reset-backlinks {
    padding: 4px 16px !important;
    font-size: 12px !important;
    border-radius: 15px !important;
    color: #0ABCD8 !important;
    border-color: #0ABCD8 !important;
}
.domainAnimationSec .btn-outline-secondary:hover {
  background-color: #f1f3f5 !important;
  color: #495057 !important;
}
.domainAnimationSec .cursor-pointer {
  cursor: pointer;
}
.domainAnimationSec .transition-all {
  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}
.domainAnimationSec .node-hover-zone {
  transition: all 0.2s ease-in-out;
}
.domainAnimationSec g.cursor-pointer:hover .node-hover-zone {
  fill: rgba(0, 168, 232, 0.08);
  r: 28px;
}
.domainAnimationSec g.cursor-pointer:hover circle {
  transform: scale(1.05);
  transform-origin: center;
}
.domainAnimationSec .animate-pulse {
  animation: pulse-glow 2s infinite alternate;
}
@keyframes pulse-glow {
  0% { transform: scale(0.96); opacity: 0.8; }
  100% { transform: scale(1.04); opacity: 1; }
}
.domainAnimationSec .form-range::-webkit-slider-thumb {
  background: #0ABCD8;
}
.domainAnimationSec .form-range::-moz-range-thumb {
  background: #0ABCD8;
}
.domainAnimationSec .notification-toast {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  background-color: #212529;
  color: white;
  text-align: center;
  padding: 0.5rem 1rem;
  font-size: 0.85rem;
  z-index: 10;
  opacity: 0.95;
  display: none;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  transition: all 0.3s ease-in-out;
}
/* ===============================
   SEO Keyword Mapping DNA Animation (.seoKeywordMappingSec)
   =============================== */

.seoKeywordMappingSec .wrapper {
  width: 100%;
  max-width: 900px;
  padding: 20px;
}
.seoKeywordMappingSec .card-custom {
  background: #ffffff;
  border-radius: 16px;
  border: 1px solid #e2e8f0;
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.05), 0 8px 10px -6px rgba(0, 0, 0, 0.05);
  overflow: hidden;
  position: relative;
  transform: scale(0.8);
}
.seoKeywordMappingSec .viewport {
  position: relative;
  background: #fafafa;
  height: 480px;
}
.seoKeywordMappingSec canvas {
  display: block;
  width: 100%;
  height: 100%;
}
.seoKeywordMappingSec .tooltip-custom {
  position: absolute;
  background: white;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 10px;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  width: 200px;
  pointer-events: none;
  display: none;
  z-index: 1000;
  font-size: 11px;
  text-align: left;
}
.seoKeywordMappingSec .details-panel {
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  width: 250px;
  background: white;
  border-left: 2px solid #0ea5e9;
  box-shadow: -4px 0 15px rgba(0, 0, 0, 0.05);
  z-index: 1010;
  padding: 18px;
  overflow-y: auto;
  display: none;
  text-align: left;
}
.seoKeywordMappingSec .badge-keyword { background-color: #0dcaf0; color: #000; }
.seoKeywordMappingSec .badge-page { background-color: #0d6efd; color: #fff; }
.seoKeywordMappingSec .badge-hub { background-color: #20c997; color: #fff; }
.seoKeywordMappingSec .badge-custom {
  font-size: 10px;
  padding: 4px 8px;
  border-radius: 4px;
  font-weight: 600;
  text-transform: capitalize;
}

.keyword-mapping-section {
    padding: 90px 0;
    background: #ffffff;
}
.keyword-mapping-section .keyword-container {
    max-width: 1244px;
}
.keyword-mapping-section .keyword-card {
    background: #FAFAFA;
    border: 1px solid #EEEEEE;
    border-radius: 22px;
    padding: 40px 60px;
}
.keyword-mapping-section .keyword-title {
    font-size: 2.5rem;
    font-weight: 600;
    line-height: 1.25;
    color: #000;
    margin-bottom: 10px;
    text-transform: uppercase;
    letter-spacing: -0.02em;
}
.keyword-mapping-section .keyword-text {
    max-width: 897px;
    margin: 0 auto 22px;
    font-size: 1rem;
    line-height: 1.2;
    color: #000;
}
.seoKeywordMappingSec .btn.btn-outline-primary.active {
    background: #0d6efd !important;
    color: #fff !important;
    border-color: #0d6efd !important;
}
.seoKeywordMappingSec .btn.btn-outline-primary, 
.seoKeywordMappingSec .btn.btn-outline-secondary {
    padding: 4px 8px !important;
    font-size: 14px !important;
}
.brand-keyword-section{
    background:#0B1F4C;
    color:#fff;
}
.brand-keyword-section .section-title{
    font-size:2.5rem;
    font-weight:400;
    margin-bottom:8px;
    text-transform:uppercase;
    color: #fff !important;
}
.brand-keyword-section .section-highlight{
    font-size:2.5rem;
    font-weight:600;
    text-transform:uppercase;
    color:#0ABCD8;
    font-style:italic;
}
.brand-keyword-section.sgt .brand-name {
    font-size: 48px;
}
.brand-keyword-section.sgt .brand-tabs .nav-link.active span {
    color: #0B1F4C80;
}
.brand-keyword-section.sgt .brand-tabs .nav-link span {
    color: #FFFFFF80;
}
.brand-keyword-section.sgt .brand-name span {
    color: #fff;
    font-size: 38px;
}
.brand-keyword-section.sgt .section-highlight{
    font-size: 24px;
    font-style: normal;
}
.brand-keyword-section.sgt .section-highlight span{
    font-size: 2.5rem;
}
.brand-keyword-section .section-highlight span{
    color:#fff;
    font-style:normal;
    font-weight:300;
}
.brand-keyword-section .section-subtitle{
    color:#d4dceb;
    margin-top:15px;
}
.brand-keyword-section .brand-tabs{
    gap:15px;
}
.brand-keyword-section .brand-tabs .nav-link{
    border: 1px solid rgba(255, 255, 255, .45) !important;
    border-radius: 50px !important;
    color: #fff;
    padding: 9px 71px !important;
    background: transparent !important;
    font-weight: 600;
    min-width: 197px;
}
.brand-keyword-section .brand-tabs .nav-link.active{
    background: #0ABCD8 !important;
    color: #0B1F4C !important;
    border-color: #0ABCD8 !important;
}
.brand-keyword-section .small-heading{
    font-size:1rem;
    color:#0ABCD8;
    margin-bottom:12px;
    font-weight: 400;
    line-height: 100%;
    letter-spacing: 53%;
    text-transform: uppercase;
}
.brand-keyword-section .brand-name{
    font-size:96px;
    color:#0ABCD8;
    font-style:italic;
    font-weight:600;
}
.brand-keyword-section .brand-stat{
    display:flex;
    gap:20px;
    align-items:flex-start;
}
.brand-keyword-section .brand-stat .line{
    width:3px;
    height:80px;
    background:#0ABCD8;
}
.brand-keyword-section .brand-stat h2{
    font-size:48px;
    margin:0;
    font-weight:600;
}
.brand-keyword-section .brand-stat p{
    margin:0;
    color:#d8deea;
    max-width:260px;
}
.brand-keyword-section .tab-pane h3{
font-weight: 600;
font-size: 24px;
letter-spacing: -2%;
text-transform: uppercase;
}
.brand-keyword-section .tab-pane p{
    color:#fff;
    line-height:1.9;
    font-size:1rem;
}
.brand-keyword-section .bottom-text{
    max-width:930px;
    margin:auto;
    color:#fff;
    line-height:1.9;
    font-size:1rem;
}
   .editorial-seo-section{
    padding: 50px 30px;
    background-color: #fff;
   }
   .editorial-seo-section .title-fig-plan {
      font-size: clamp(1.8rem, 4vw, 2.5rem);
      font-weight: 600;
      line-height: 1.15;
      letter-spacing: -0.02em;
      color: #000;
      text-transform: uppercase;
    }
    .editorial-seo-section .text-editorial-seo {
      color: #0B1F4C;
      font-weight: 900;
    }
    .editorial-seo-section .fig-card-container {
      background-color: #FAFAFA;
      border-radius: 24px;
      box-shadow: 0 10px 40px rgba(15, 23, 42, 0.04);
      width: 100%;
      max-width: 1400px;
      margin: 0 auto;
    }
    .editorial-seo-section .animation-stage-wrapper {
      background-color: #f8fafc;
      border-radius: 16px;
      border: 1px solid rgba(15, 23, 42, 0.03);
      position: relative;
      overflow: hidden;
      height: 100%;
      min-height: 380px;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .editorial-seo-section .step-item {
      border-bottom: 1px solid #e2e8f0;
      padding: 1.5rem;
      cursor: pointer;
      transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
      position: relative;
      border-left: 4px solid transparent;
    }
    .editorial-seo-section .step-item:last-child {
      border-bottom: none;
    }
    .editorial-seo-section .step-item.active {
      background-color: rgba(26, 54, 93, 0.03);
      border-left-color: #0B1F4C;
      padding-left: 2rem;
    }
    .editorial-seo-section .step-number {
      font-weight: 500;
      font-size: 0.95rem;
      color: #94a3b8;
      transition: color 0.3s ease;
    }
    .editorial-seo-section .step-item.active .step-number {
      color: #0B1F4C;
      font-weight: 700;
    }
    .editorial-seo-section .step-title {
      color: #1e293b;
      font-size: 1.15rem;
      font-weight: 700;
      margin-bottom: 0.5rem;
      transition: color 0.3s ease;
    }
    .editorial-seo-section .step-item.active .step-title {
      color: #0f172a;
    }
    .editorial-seo-section .step-description {
      color: #000000B2;
      font-size: 0.9rem;
      line-height: 1.6;
      margin-bottom: 0;
      transition: color 0.3s ease;
    }
    .editorial-seo-section .step-item.active .step-description {
      color: #000000B2;
      
    }
    .editorial-seo-section .step-item:not(.active):hover {
      background-color: rgba(15, 23, 42, 0.015);
      border-left-color: #0ABCD8;
      padding-left: 1.75rem;
    }
    .editorial-seo-section .svg-grid-bg {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      stroke: rgba(15, 23, 42, 0.03);
      stroke-width: 1;
      z-index: 1;
      pointer-events: none;
    }
    .editorial-seo-section .animation-panel {
      display: none;
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0;
      left: 0;
      align-items: center;
      justify-content: center;
      padding: 1rem;
    }
    .editorial-seo-section .animation-panel.active {
      display: flex;
      animation: stageFadeIn 0.5s ease-in-out forwards;
    }
    @keyframes stageFadeIn {
      from { opacity: 0; transform: scale(0.96) translateY(10px); }
      to { opacity: 1; transform: scale(1) translateY(0); }
    }
    .editorial-seo-section .radar-circle {
      animation: rotateCW 25s infinite linear;
      transform-origin: 200px 150px;
    }
    .editorial-seo-section .radar-circle-outer {
      animation: rotateCCW 40s infinite linear;
      transform-origin: 200px 150px;
    }
    @keyframes rotateCW {
      from { transform: rotate(0deg); }
      to { transform: rotate(360deg); }
    }
    @keyframes rotateCCW {
      from { transform: rotate(360deg); }
      to { transform: rotate(0deg); }
    }
    .editorial-seo-section .pulse-effect-1,
    .editorial-seo-section .pulse-effect-2 {
      animation: radarPulse 3s infinite ease-out;
      transform-origin: 200px 150px;
    }
    .editorial-seo-section .pulse-effect-2 {
      animation-delay: 1.5s;
    }
    @keyframes radarPulse {
      0% { transform: scale(0.35); opacity: 0.8; }
      100% { transform: scale(1); opacity: 0; }
    }
    .editorial-seo-section .float-item-0 { animation: floatAnim 4s infinite ease-in-out; }
    .editorial-seo-section .float-item-1 { animation: floatAnim 4s infinite ease-in-out 1s; }
    .editorial-seo-section .float-item-2 { animation: floatAnim 4s infinite ease-in-out 2s; }
    .editorial-seo-section .float-item-3 { animation: floatAnim 4s infinite ease-in-out 3s; }
    @keyframes floatAnim {
      0%, 100% { transform: translateY(0); }
      50% { transform: translateY(-8px); }
    }
    .editorial-seo-section .node-pulse {
      animation: nodePulse 3.5s infinite ease-in-out;
    }
    @keyframes nodePulse {
      0%, 100% { transform: scale(1); box-shadow: 0 4px 6px -1px rgba(0,0,0,0.05); }
      50% { transform: scale(1.04); box-shadow: 0 10px 15px -3px rgba(0,0,0,0.08); }
    }
    .editorial-seo-section .timeline-ball {
      animation: slideLeftRight 8s infinite ease-in-out;
    }
    @keyframes slideLeftRight {
      0%, 100% { left: 12.5%; }
      50% { left: 87.5%; }
    }
    .editorial-seo-section .seo-progress-meter {
      animation: countUpMeter 8s infinite cubic-bezier(0.4, 0, 0.2, 1);
      transform-origin: 50px 50px;
    }
    @keyframes countUpMeter {
      0%, 100% { stroke-dashoffset: 251.2; stroke: #3b82f6; }
      25% { stroke-dashoffset: 180; stroke: #3b82f6; }
      50% { stroke-dashoffset: 120; stroke: #3b82f6; }
      75% { stroke-dashoffset: 5; stroke: #10b981; }
    }
    .editorial-seo-section .gear-big {
      animation: rotateCW 15s infinite linear;
      transform-origin: center;
    }
    .editorial-seo-section .gear-small {
      animation: rotateCCW 10s infinite linear;
      transform-origin: center;
    }

    /* Editorial SEO Section - Custom Button Overrides (with !important to override Bootstrap) */
    .editorial-seo-section .editorial-btn-group {
      display: inline-flex !important;
      border-radius: 0.25rem !important;
    }

    .editorial-seo-section .editorial-toggle-btn {
      width: 38px !important;
      height: 38px !important;
      background-color: transparent !important;
      border: 2px solid #0B1F4C !important;
      border-radius: 50% !important;
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      color: #0B1F4C !important;
      cursor: pointer !important;
      transition: all 0.2s ease !important;
      padding: 0 !important;
      line-height: 1 !important;
    }
    .editorial-seo-section .editorial-toggle-btn:hover {
      opacity: 0.75 !important;
    }
    .editorial-seo-section .editorial-toggle-btn--active {
      background-color: #0B1F4C !important;
      color: #ffffff !important;
      border-color: #0B1F4C !important;
    }
    .editorial-seo-section .editorial-speed-btn {
      font-size: 0.65rem !important;
      font-family: 'JetBrains Mono', monospace !important;
      padding: 0.25rem 0.5rem !important;
      background-color: transparent !important;
      border: 1px solid #dee2e6 !important;
      color: #6c757d !important;
      cursor: pointer !important;
      transition: all 0.2s ease !important;
      position: relative !important;
      display: inline-block !important;
      line-height: 1.5 !important;
    }
    .editorial-seo-section .editorial-speed-btn:first-child {
      border-radius: 0.25rem 0 0 0.25rem !important;
    }
    .editorial-seo-section .editorial-speed-btn:last-child {
      border-radius: 0 0.25rem 0.25rem 0 !important;
    }
    .editorial-seo-section .editorial-speed-btn:not(:last-child) {
      border-right: none !important;
    }
    .editorial-seo-section .editorial-speed-btn.active {
      background-color: #0B1F4C !important;
      border-color: #0B1F4C !important;
      color: #ffffff !important;
    }
    .editorial-seo-section .editorial-speed-btn:hover:not(.active) {
      background-color: #f1f5f9 !important;
    }
/* ===== Competitive Gap Analysis - Custom Buttons ===== */
.competitiveGapANiSec .gap-play-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  padding: 0.25rem 1rem !important;
  border-radius: 50rem !important;
  font-weight: 500 !important;
  font-size: 0.875rem !important;
  line-height: 1.5 !important;
  transition: all 0.2s ease-in-out !important;
  border: 1px solid #6c757d !important;
  background-color: transparent !important;
  color: #6c757d !important;
  cursor: pointer !important;
  text-decoration: none !important;
  vertical-align: middle !important;
}
.competitiveGapANiSec .gap-play-btn:hover {
  background-color: #6c757d !important;
  color: #fff !important;
}
.competitiveGapANiSec .gap-play-btn--active {
  border: 1px solid #0d6efd !important;
  background-color: #0d6efd !important;
  color: #fff !important;
}
.competitiveGapANiSec .gap-play-btn--active:hover {
  background-color: #0b5ed7 !important;
  border-color: #0a58ca !important;
}
.competitiveGapANiSec .gap-reset-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0.5rem !important;
  border-radius: 50% !important;
  border: 1px solid #dee2e6 !important;
  background-color: #f8f9fa !important;
  color: #6c757d !important;
  transition: all 0.2s ease-in-out !important;
  cursor: pointer !important;
  width: 38px !important;
  height: 38px !important;
}
.competitiveGapANiSec .gap-reset-btn:hover {
  background-color: #e9ecef !important;
  color: #000 !important;
}
/* ===== Competitive Gap Analysis Section ===== */
.competitiveGapANiSec .gap-analysis-card {
  background: #ffffff;
  border-radius: 24px;
  box-shadow: 0 10px 40px -10px rgba(0, 0, 0, 0.04), 0 0 1px 1px rgba(0, 0, 0, 0.02);
  border: 1px solid rgba(226, 232, 240, 0.8);
  overflow: hidden;
  width: 100%;
  max-width: 1200px;
}
.competitiveGapANiSec .step-item {
  cursor: pointer;
  padding: 1.5rem 2rem;
  border-bottom: 1px solid rgba(226, 232, 240, 0.6);
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  position: relative;
}
.competitiveGapANiSec .step-item:last-child {
  border-bottom: none;
}
.competitiveGapANiSec .step-item.active {
  background-color: rgba(59, 130, 246, 0.02);
}
.competitiveGapANiSec .step-item .step-number {
  color: #94A3B8;
  font-weight: 500;
  transition: all 0.3s ease;
}
.competitiveGapANiSec .step-item.active .step-number {
  font-weight: 600;
  transform: scale(1.1);
}
.competitiveGapANiSec .step-item .step-title {
  color: #0F172A;
  font-size: 1.15rem;
  font-weight: 600;
  transition: all 0.3s ease;
  margin-bottom: 0.5rem;
}
.competitiveGapANiSec .step-item.active .step-title {
  color: #001C55;
}
.competitiveGapANiSec .step-item .step-desc {
  color: #64748B;
  font-size: 0.925rem;
  line-height: 1.5;
  margin-bottom: 0;
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.competitiveGapANiSec .step-item.active .step-desc {
  max-height: 150px;
  opacity: 1;
  margin-top: 0.5rem;
}
.competitiveGapANiSec .step-indicator-bar {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  transform: scaleY(0);
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  transform-origin: center;
}
.competitiveGapANiSec .step-item.active .step-indicator-bar {
  transform: scaleY(1);
}
.competitiveGapANiSec .canvas-view {
  display: none;
  width: 100%;
  height: 100%;
}
.competitiveGapANiSec .canvas-view.active {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  animation: fadeIn 0.5s ease-in-out forwards;
}
@keyframes fadeIn {
  from { opacity: 0; transform: scale(0.97); }
  to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
  0% { opacity: 0.15; }
  50% { opacity: 0.3; }
  100% { opacity: 0.15; }
}
.competitiveGapANiSec .pulse-glow {
  animation: pulseGlow 3s infinite ease-in-out;
}
@keyframes pulseScale {
  0% { transform: scale(1); opacity: 0.8; }
  50% { transform: scale(1.15); opacity: 1; }
  100% { transform: scale(1); opacity: 0.8; }
}
.competitiveGapANiSec .pulse-dot {
  transform-origin: center;
  animation: pulseScale 2s infinite ease-in-out;
}
/* ===== Competitive Gap Analysis - User text tweaks ===== */
.competitiveGapANiSec {
  font-size: 16px !important;
}
.competitiveGapANiSec .step-desc {
  font-size: 16px !important;
  line-height: 1.6 !important;
}
.competitiveGapANiSec span.small.font-medium.text-dark {
  font-size: 12px !important;
}
.competitiveGapANiSec .position-absolute.bottom-0.mb-3 {
  opacity: 0 !important;
  pointer-events: none !important;
}

/* ===== SEO Growth Tracking Section ===== */
.seo-growth-aniSec {
  background-color: #f8fafc;
}

.seo-growth-aniSec .step-item {
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  border-left: 3px solid transparent;
  padding-left: 20px;
  cursor: pointer;
}

.seo-growth-aniSec .step-item:hover {
  background-color: rgba(17, 54, 193, 0.02);
}

.seo-growth-aniSec .step-item.active {
  background-color: #eaedfc;
  border-left-color: #1136c1;
  border-radius: 0 12px 12px 0;
}

.seo-growth-aniSec .step-number {
  font-weight: 600;
  font-size: 0.9rem;
  color: #5e6475;
  transition: color 0.3s;
}

.seo-growth-aniSec .step-item.active .step-number {
  color: #1136c1;
}

.seo-growth-aniSec .step-title {
  color: #12141d;
  font-size: 1.15rem;
  font-weight: 600;
  transition: color 0.3s;
}

.seo-growth-aniSec .step-item.active .step-title {
  color: #1136c1;
}

.seo-growth-aniSec .step-desc {
  color: #5e6475;
  font-size: 0.9rem;
  line-height: 1.5;
}

.seo-growth-aniSec .glass-panel {
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: 16px;
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.04);
}

.seo-growth-aniSec .visual-container {
  min-height: 420px;
  border-radius: 24px;
  background: white;
  position: relative;
}

.seo-growth-aniSec .visual-panel {
  display: none;
  opacity: 0;
  transform: scale(0.95);
  transition: opacity 0.4s ease-in-out, transform 0.4s ease-in-out;
  width: 100%;
  height: 100%;
}

.seo-growth-aniSec .visual-panel.active {
  display: flex;
  opacity: 1;
  transform: scale(1);
}

.seo-growth-aniSec .animate-radar {
  animation: radar-spin 6s linear infinite;
  transform-origin: center;
}

.seo-growth-aniSec .animate-pulse-ring {
  animation: pulse-ring 3s cubic-bezier(0.215, 0.610, 0.355, 1) infinite;
}

.seo-growth-aniSec .animate-float {
  animation: float 4s ease-in-out infinite;
}

.seo-growth-aniSec .animate-flow-dash {
  stroke-dasharray: 8, 4;
  animation: dash 2s linear infinite;
}

/* SEO Growth Tracking - Button Styles */
.seo-growth-aniSec .seo-control-group {
  display: inline-flex !important;
  align-items: center !important;
  border: 1px solid #dee2e6 !important;
  border-radius: 0.375rem !important;
  padding: 0.25rem !important;
  background-color: #f8f9fa !important;
  gap: 2px !important;
}

.seo-growth-aniSec .seo-auto-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  padding: 0.375rem 0.75rem !important;
  border-radius: 0.25rem !important;
  border: 1px solid #6c757d !important;
  background-color: transparent !important;
  color: #6c757d !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  transition: all 0.2s ease-in-out !important;
  line-height: 1.5 !important;
  text-decoration: none !important;
}

.seo-growth-aniSec .seo-auto-btn:hover {
  background-color: #6c757d !important;
  color: #fff !important;
}

.seo-growth-aniSec .seo-auto-btn--on {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  padding: 0.375rem 0.75rem !important;
  border-radius: 0.25rem !important;
  border: 1px solid #1136c1 !important;
  background-color: #1136c1 !important;
  color: #fff !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  transition: all 0.2s ease-in-out !important;
  line-height: 1.5 !important;
  text-decoration: none !important;
}

.seo-growth-aniSec .seo-auto-btn--on:hover {
  background-color: #0e2da0 !important;
  border-color: #0e2da0 !important;
}

.seo-growth-aniSec .seo-nav-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0.375rem 0.5rem !important;
  border-radius: 0.25rem !important;
  border: 1px solid transparent !important;
  background-color: #f8f9fa !important;
  color: #6c757d !important;
  cursor: pointer !important;
  transition: all 0.2s ease-in-out !important;
  line-height: 1.5 !important;
}

.seo-growth-aniSec .seo-nav-btn:hover {
  background-color: #e9ecef !important;
  color: #000 !important;
}

/* ===== Keyframes (global) ===== */
@keyframes radar-spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes pulse-ring {
  0% { transform: scale(0.6); opacity: 0; }
  50% { opacity: 0.5; }
  100% { transform: scale(1.2); opacity: 0; }
}

@keyframes float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}

@keyframes dash {
  to { stroke-dashoffset: -40; }
}
.blog-table-wrap {
  overflow-x: auto;
  margin: 1.5rem 0;
  border-radius: 12px;
  border: 1px solid #e3e8ef;
}
.blog-compare-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 640px;
  font-size: 0.95rem;
}
.blog-compare-table th,
.blog-compare-table td {
    padding: 0.5rem;
    text-align: left;
    vertical-align: top;
    border-bottom: 1px solid #e3e8ef;
    font-size: 10px;
}
.blog-compare-table thead th {
  background: #13233c;
  color: #fff;
  font-weight: 600;
  white-space: nowrap;
  font-size: 10px;
}
.blog-compare-table tbody tr:nth-child(even) {
  background: #f7f9fc;
}
.blog-compare-table tbody tr:last-child td {
  border-bottom: none;
}
.blog-compare-table td:first-child {
  font-weight: 600;
  color: #13233c;
  white-space: nowrap;
}
.blog-quote {
  margin: 2rem 0;
  padding: 1.5rem 1.75rem;
  background: #f7f9fc;
  border-left: 4px solid #0d6efd;
  border-radius: 0 12px 12px 0;
  font-style: italic;
  color: #1f2937;
}
.blog-quote p {
  margin: 0 0 0.5rem;
  font-size: 1rem;
}
.blog-quote cite {
  display: block;
  font-style: normal;
  font-size: 0.85rem;
  color: #6b7280;
}
@media (max-width: 575px) {
  .blog-compare-table {
    font-size: 0.85rem;
  }
  .blog-compare-table th,
  .blog-compare-table td {
    padding: 0.65rem 0.75rem;
  }
}
  .fig-vm{
    color: var(--sl-900);
    background: #fff;
    max-width: 780px;
    margin: 40px auto;
    padding: 0 0 53px;
    position: relative;
    border: 1px solid var(--color-border);
    box-shadow: 0 30px 60px -30px rgba(11,31,76,0.18);
  }
  .fig-vm .dots{
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 7px;
    width: 86px;
  }
  .fig-vm .dots span{
    width: 7px; height: 7px; border-radius: 50%;
    background: var(--color-teal);
  }
  .fig-vm .dots.tr{ position:absolute; top: 28px; right: 28px; }
  .fig-vm .dots.ml{position:absolute;left: 40px;top: 0;}
  .fig-vm .fig-eyebrow-wrap{
    display:flex; justify-content:center;
    padding: 64px 24px 30px;
    position: relative;
  }
  .fig-vm .fig-eyebrow{
    background: var(--brand-primary);
    color: #fff;
    font-weight: 700;
    letter-spacing: 0.14em;
    font-size: 12px;
    padding: 9px 20px;
    text-transform: uppercase;
  }
  .fig-vm .fig-vm-center{
    display:flex;
    justify-content:center;
    padding: 36px 0 44px;
  }
  .fig-vm .fig-label{
    text-align:center;
    font-size: 13px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--color-text-muted);
    font-weight: 700;
    margin: 0 0 20px;
  }
  .fig-vm .fig-h1{
    font-weight: 600;
    font-size: clamp(30px, 5.2vw, 46px);
    line-height: 1.18;
    margin: 0;
    text-align:center;
    padding: 0 40px 64px;
    letter-spacing: -0.01em;
    color: var(--sl-900);
  }
  .fig-vm .fig-h1 em{
    font-style: italic;
    color: var(--color-teal);
  }
  .fig-vm .fig-letter{
    position: relative;
    padding: 40px 64px 8px;
  }
  .fig-vm .fig-letter p{
    font-size: 16.5px;
    line-height: 1.75;
    color: var(--sl-600);
    margin: 0 0 20px;
  }
  .fig-vm .fig-letter .greeting{
    color: var(--sl-900);
    font-weight: 600;
  }
  .fig-vm .fig-quote{
    background: var(--color-teal-light);
    border-left: 3px solid var(--color-teal);
    padding: 20px 24px;
    margin: 8px 0 24px;
    font-style: italic;
    font-size: 14px;
    color: var(--brand-primary);
    display:flex;
    align-items:center;
    gap: 14px;
  }
  .fig-vm .fig-quote svg{ flex: none; }

  .fig-vm .fig-sign{
    text-align:right;
    padding: 4px 0 0;
  }
  .fig-vm .fig-sign-name{
    font-style: italic;
    font-size: 16px;
    color: #585C5E;
  }
  @media (max-width: 600px){
    .fig-vm .fig-letter{ padding: 34px 26px 8px; }
    .fig-vm .fig-h1{padding: 0 19px 35px;}
    .fig-vm .dots.ml{ display:none; }
    .fig-vm .fig-quote{gap: 5px;font-size: 12px;padding: 10px;}
    .fig-vm .fig-sign-name{ font-size: 12px;}
    .fig-vm .fig-vm-center{padding: 15px;}
    .fig-vm .dots span{
    width: 3px;
    height: 3px;
}
    .fig-vm .dots{
    gap: 5px;
    width: 50px;
}
  }
.industry-page {
  --fig-navy: #0B1F4C;
  --fig-teal: #0ABCD8;
  --fig-light: #F5F7FB;
  --fig-border: #E5E7EB;
  color: #111;
  font-family: "Poppins", sans-serif;
}
.industry-page .fig-teal {
  color: var(--fig-teal);
}
.industry-page .fig-navy {
  color: var(--fig-navy);
}
.industry-page .industry-hero {
  padding: 220px 0 85px;
}
.industry-page .industry-hero h1 {
  font-size: clamp(3rem, 5.6vw, 6rem);
  font-weight: 700;
  line-height: 1.03;
  letter-spacing: -.055em;
  margin: 0;
}
.industry-page .industry-hero p {
  font-size: 16px;
  line-height: 1.55;
}
.industry-page .fig-btn {
  border-radius: 0;
  padding: 14px 24px;
  font-size: 15px;
}
.industry-page .btn-primary {
  background: var(--fig-navy);
  border-color: var(--fig-navy);
  color: #fff;
  ;
}
.industry-page .industry-section {
  padding: 80px 0;
}
.industry-page .industry-section.bg-light {
  background: var(--fig-light) !important;
}
.industry-page .industry-title {
  font-size: clamp(1.8rem, 3vw, 2.5rem);
  line-height: 1.25;
  text-transform: uppercase;
}
.industry-page .industry-label {
  color: var(--fig-teal);
  font-size: 16px;
  text-transform: uppercase;
  margin-bottom: 16px;
  letter-spacing: 0;
}
.industry-page .fig-list-card {
  padding: 26px 31px;
  background: #fff;
  border-radius: 20px;
  border: 1px solid #eef0f4;
  font-weight: 600;
  transition: 0.5s ease;
}
.industry-page .service-item:hover,
.industry-page .fig-list-card:hover {
  box-shadow: 0px 0px 10px 2px #0ABCD8;

}
.industry-page .fig-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #def8fb;
  color: var(--fig-teal);
  font-size: 12px;
  margin-right: 26px;
}
.industry-page .challenge-card {
  height: 100%;
  padding: 28px 22px;
  border: 1px solid #EDEDED;
  background: #fff;
}
.industry-page .challenge-card h3 {
  font-size: 20px;
  color: var(--fig-navy);
  margin: 14px 0;
  font-weight: 600;
}
.industry-page .challenge-card p {
  font-size: 14px;
  margin: 0;
}
.industry-page .challenge-card span {
  font-weight: 600;
  color: var(--fig-navy);
}
.industry-page .fig-table-row {
  padding: 18px 0;
  border-bottom: 1px solid #CACACA;
}
.industry-page .fig-table-row p {
  font-size: 16px;
  margin: 0;
  max-width: 508px;
}
.industry-page .framework-wrap {
  padding: 65px 7%;
  border-radius: 16px;
  background: var(--fig-navy);
  color: #fff;
}
.industry-page .framework-step {
  position: relative;
  padding: 22px 30px;
  border-bottom: 1px solid rgba(255, 255, 255, .25);
}
.industry-page .framework-step:last-child {
  border: 0;
}
.industry-page .framework-step h3 {
  font-size: 17px;
}
.industry-page .framework-step p {
  font-size: 13px;
  margin: 0;
  color: #e4e9f2;
}
.industry-page .service-item {
  display: flex;
  align-items: center;
  min-height: 64px;
  padding: 20px 24px;
  background: #fff;
  border-radius: 12px;
  border: 1px solid #eef0f4;
  font-size: 20px;
  font-weight: 600;
  transition: 0.5s ease;
}
.industry-page .reason-card {
  height: 100%;
  padding: 26px;
  border: 1px solid var(--fig-border);
  border-radius: 12px;
  background: #fafafa;
}
.industry-page .reason-card h3 {
  font-size: 20px;
  line-height: 1.35;
  color: var(--fig-navy);
  letter-spacing: 0;
}
.industry-page .why-fig-section .why-fig-intro {
  margin: 0;
  font-size: 14px;
  line-height: 1.55;
}
.industry-page .why-fig-section>.container {
  max-width: 1180px !important;
}
.industry-page .why-fig-section .reason-card {
  min-height: 165px;
}
.industry-page .why-fig-section .reason-card>span {
  display: block;
  margin-bottom: 18px;
  color: var(--fig-navy);
  font-size: 20px;
  font-weight: 600;
}
.industry-page .why-fig-section .reason-card h3 {
  margin-bottom: 20px;
  font-weight: 600;
}
.industry-page .why-fig-section .reason-card p {
  margin: 0;
  font-size: 16px;
  line-height: 1.5;
}
.industry-page .saas-hire-section {
  background: #F4F7FB;
}
.industry-page .saas-hire-section>.container {
  max-width: 1272px;
}
.industry-page .saas-hire-section .industry-title {
  font-size: clamp(1.7rem, 2.6vw, 2.35rem);
  font-weight: 400;
}
.industry-page .saas-hire-list {
  max-width: 1272px;
  margin: 0 auto;
}
.industry-page .saas-hire-list .fig-table-row {
  padding: 19px 28px;
}
.industry-page .saas-hire-list p {
  max-width: 469px;
}
.industry-page .result-band {
  padding: 65px 0;
  background: var(--fig-navy);
  color: #fff;
}
.industry-page .result-stat {
  border-right: 1px solid rgba(255, 255, 255, .5);
}
.industry-page .result-stat:last-child {
  border: 0;
}
.industry-page .result-stat strong {
  display: block;
  color: var(--fig-teal);
  font-size: clamp(2.6rem, 5vw, 4.5rem);
  font-weight: 500;
  line-height: 1.1;
}
.industry-page .result-stat span {
  font-size: 12px;
  text-transform: uppercase;
}
.industry-page .tool-cell {
  padding: 25px 8px;
  border: 1px solid var(--fig-border);
  font-size: 11px;
  text-align: center;
  text-transform: uppercase;
}
.industry-page .accordion-button {
  min-height: 90px;
  align-items: center;
  font-size: 18px !important;
  font-weight: 600;
  padding: 30px 0 !important;
  border: none !important;
}
.industry-page .accordion-button:hover {
    background: transparent !important;
    color: inherit !important;
}
.industry-page .accordion-button:not(.collapsed) {
  background: #fff;
  color: var(--fig-navy);
  box-shadow: none;
}
.industry-page .accordion-item {
  border-width: 0 0 1px;
}
.industry-page .final-cta {
  padding: 75px 0;
  background: var(--fig-navy);
  color: #fff;
}
.industry-page .final-cta h2 {
  font-size: clamp(2.5rem, 5vw, 4.5rem);
  font-weight: 700;
}
.industries-register .register-link {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  padding: 19px 12px;
  border-bottom: 1px solid #aaa;
  color: #999;
  font-size: clamp(1.55rem, 2.35vw, 2.65rem);
  transition: color .2s ease;
}
.industries-register .register-link:first-child {
  border-top: 1px solid #aaa;
}
.industries-register .register-link:hover,
.industries-register .register-link:focus-visible,
.industries-register .register-link.active {
  color: #000;
}
.industries-register .register-link small {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  color: #656565;
  font-size: 12px;
  font-weight: 400;
  text-align: right;
  text-transform: uppercase;
  letter-spacing: 0;
}
.industries-register .register-link svg {
  width: 13px;
  height: 10px;
  flex: 0 0 13px;
  fill: none;
  stroke: var(--fig-teal);
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0;
  transform: translateX(-5px);
  transition: opacity .2s ease, transform .2s ease;
}
.industries-register .register-link.active svg,
.industries-register .register-link:hover svg,
.industries-register .register-link:focus-visible svg {
  opacity: 1;
  transform: translateX(0);
}
.industries-register .register-detail {
  padding: 8px 0 0 25px;
  transition: opacity .15s ease, transform .15s ease;
}
.industries-register .register-detail.is-changing {
  opacity: .25;
  transform: translateY(4px);
}
.industries-register .register-detail h2 {
  margin-bottom: 2px;
}
.industries-register .register-detail>p:not(.industry-label) {
  font-size: 14px;
  line-height: 1.55;
}
.industries-register .register-detail hr {
  margin: 28px 0 24px;
  border-color: #858585;
  opacity: .7;
}
.industries-register .register-detail h3 {
  font-size: 12px;
}
.industries-register .register-practice-btn {
  display: inline-flex;
  align-items: center;
  gap: 35px;
  margin-top: 17px;
  min-width: 205px;
  justify-content: center;
}
.industries-register .register-practice-btn svg {
  width: 13px;
  height: 10px;
  fill: none;
  stroke: #fff;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.industries-register .register-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 34px 55px;
  margin-top: 34px;
  padding-top: 30px;
  border-top: 1px solid #858585;
}
.industries-register .register-metric strong {
  display: block;
  font-size: 34px;
  line-height: 1;
  font-weight: 600;
  letter-spacing: -.04em;
}
.industries-register .register-metric span {
  display: block;
  margin-top: 10px;
  font-size: 12px;
  text-transform: uppercase;
}
.industries-register .register-metrics.d-none+.register-practice-btn {
  margin-top: 18px;
}
.industry-page .shared-system-section {
  background-color: #F4F7FB;
}
.industries-register .shared-system-intro {
  max-width: 650px;
  margin-bottom: 55px;
  font-size: 14px;
  line-height: 1.55;
}
.industries-register .shared-system-list .fig-table-row {
  padding: 19px 0;
}
.industries-register .shared-system-list strong {
  font-size: 20px;
  font-weight: 600;
}
.industries-register .shared-system-list p {
  margin-top: 6px;
  max-width: 520px;
  font-size: 13px;
  line-height: 1.45;
}
/* Industries engagement selection and final CTA */
.industries-register .engagement-selection-section {
  padding: 65px 0 75px;
  background: #fff;
}
.industries-register .engagement-selection-grid {
  max-width: 980px;
  margin: 0 auto;
}
.industries-register .engagement-selection-item span {
  display: block;
  margin-bottom: 22px;
  color: var(--fig-navy);
  font-size: 20px;
  font-weight: 600;
}
.industries-register .engagement-selection-item h3 {
  margin-bottom: 12px;
  font-size: 20px;
  font-weight: 600;
}
.industries-register .engagement-selection-item p {
  max-width: 270px;
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
}
.industry-page .industries-final-cta {
  padding: 70px 0 68px;
  background: var(--fig-navy);
  color: #fff;
  margin-bottom: 30px;
}
.industry-page .industries-final-cta h2 {
  margin-bottom: 30px;
  font-size: clamp(2.8rem, 5.2vw, 5rem);
  font-weight: 400;
  line-height: 1.02;
  letter-spacing: 0;
}
.industry-page .industries-final-cta h2 strong {
  font-weight: 700;
}
.industry-page .industries-final-cta h2 span {
  color: var(--fig-teal);
  font-weight: 700;
}
.industry-page .industries-final-cta p {
  margin-bottom: 30px;
  font-size: 16px;
  line-height: 1.5;
}
.industry-page .industries-final-cta .btn {
  min-width: 180px;
  border-radius: 0;
  padding: 14px 24px;
  font-size: 14px;
}
.industry-page .industries-cta-primary {
  background: var(--fig-teal);
  border-color: var(--fig-teal) !important;
  color: #fff;
}
.industry-page .industries-cta-secondary {
  background: #fff;
  border-color: #fff !important;
  color: var(--fig-navy);
}
/* SaaS native tool stack */
.industry-page .native-stack-section>.container {
  max-width: 1272px;
}
.industry-page .native-stack-intro {
  margin: 0;
  font-size: 16px;
  line-height: 1.55;
}
.industry-page .native-stack-box {
  display: flex;
  min-height: 92px;
  align-items: center;
  justify-content: center;
  border: 1px solid #EDEDED;
  color: #00000099;
  font-size: 16px;
  text-transform: uppercase;
  transition: background-color .2s ease, color .2s ease;
}
.industry-page .native-stack-box:hover {
  background: #F1F1F1;
  color: #000;
}
/* Healthcare vertical */
.healthcare-page .healthcare-empty-card,
.ecommerce-page .ecommerce-empty-card {
  min-height: 210px;
  background: #F1F2F4;
  border: 1px solid var(--fig-border);
}
.healthcare-page .healthcare-challenges>.container,
.ecommerce-page .ecommerce-challenges>.container {
  max-width: 1272px;
}
.healthcare-page .compliance-section,
.ecommerce-page .ecommerce-economics {
  text-align: center;
}
.healthcare-page .compliance-intro,
.ecommerce-page .ecommerce-economics>.container>p:not(.industry-label) {
  margin: 22px auto 42px;
  font-size: 16px;
}
.healthcare-page .compliance-list,
.ecommerce-page .economics-list {
  max-width: 840px;
  margin: 0 auto;
  display: grid;
  gap: 20px;
}
.healthcare-page .compliance-list article,
.ecommerce-page .economics-list article {
  padding: 27px 35px;
  border-radius: 22px;
  background: #F4F7FB;
}
.healthcare-page .compliance-list h3,
.ecommerce-page .economics-list h3 {
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 0;
}
.healthcare-page .compliance-list p,
.ecommerce-page .economics-list p {
  margin: 12px auto 0;
  max-width: 650px;
  font-size: 15px;
}
/* E-commerce vertical */
.ecommerce-page .ecommerce-stack {
  max-width: 1121px;
  margin: auto;
}
/* Shared vertical-page variants */
.industry-page .industry-empty-card {
  min-height: 210px;
  background: #F1F2F4;
  border: 1px solid var(--fig-border);
}
.industry-page .industry-challenges-section>.container,
.industry-page .feature-panel-section>.container,
.industry-page .native-stack-section>.container {
  max-width: 1272px;
}
.industry-page .feature-panel-section {
  text-align: center;
}
.industry-page .feature-panel-intro {
  margin: 22px auto 42px;
  font-size: 16px;
  line-height: 1.55;
}
.industry-page .feature-panel-list {
  display: grid;
  gap: 20px;
  max-width: 840px;
  margin: 42px auto 0;
}
.industry-page .feature-panel-list article {
  padding: 27px 35px;
  border-radius: 22px;
  background: #F4F7FB;
}
.industry-page .feature-panel-list h3 {
  font-size: 20px;
  font-weight: 600;
}
.industry-page .feature-panel-list p {
  max-width: 650px;
  margin: 12px auto 0;
  font-size: 15px;
}
.industry-page .real-estate-stack {
  max-width: 1121px;
  margin: auto;
}
.industry-page .finance-stack,
.industry-page .education-stack,
.industry-page .crypto-stack {
  max-width: 1121px;
  margin: auto;
}
.industry-page .industry-hero .row,
.industry-page .industry-section>.container>.row.mb-5,
.industry-page .native-stack-section .row.mb-5 {
  align-items: center;
}
.industry-page .industry-hero h1 {
  font-size: clamp(4rem, 6.1vw, 6rem);
  line-height: 1.02;
}
.industry-page .industry-hero .col-lg-5 {
  padding-top: 14px;
}
.industry-page .industry-section p,
.industry-page .what-paid-media-means-txt p {
  font-size: 16px;
  line-height: 1.55;
}
.industry-page .industry-title {
  font-size: clamp(2rem, 2.75vw, 2.5rem);
  line-height: 1.25;
  font-weight: 400;
}
.industry-page .fig-list-card {
  display: flex;
  align-items: center;
  min-height: 84px;
  font-size: 18px;
  line-height: 1.35;
}
.industry-page .challenge-card {
  min-height: 265px;
  padding: 29px 22px;
}
.industry-page .challenge-card h3 {
  margin: 15px 0 24px;
  font-size: 20px;
  line-height: 1.3;
}
.industry-page .challenge-card p {
  font-size: 16px;
  line-height: 1.55;
}
.industry-page .fig-table-row {
  min-height: 88px;
  align-items: center;
  padding: 20px 28px;
  border-bottom-color: #D0D3D8;
}
.industry-page .shared-system-list .fig-table-row:first-child,
.industry-page .saas-hire-list .fig-table-row:first-child {
  border-top: 1px solid #D0D3D8;
}
.industry-page .fig-table-row>.fw-semibold,
.industry-page .shared-system-list strong {
  font-size: 19px;
  line-height: 1.35;
}
.industry-page .shared-system-list .fig-table-row {
  min-height: 124px;
  padding-right: 0;
  padding-left: 0;
}
.industry-page .shared-system-list p {
  margin-top: 10px;
  font-size: 16px;
  line-height: 1.5;
}
.industry-page .reason-card p,
.industry-page .why-fig-section>.container>.row p {
  font-size: 16px;
  line-height: 1.5;
}
.industry-page .result-band .industry-title {
  font-size: clamp(1.75rem, 2.7vw, 2.5rem);
  font-weight: 400;
}
.industry-page .native-stack-box {
  min-height: 102px;
  font-size: 12px;
}
.industry-page .fig-process .process-title {
  font-size: 2.2rem;
  line-height: 1.15;
}
.industry-page .fig-process .process-inner>.text-center>p:last-child {
  color: rgba(255, 255, 255, .8);
  font-size: 14px;
  line-height: 1.55;
}
/* Service descriptions */
.industry-page .service-list-intro {
  margin-bottom: 20px;
  font-size: 15px;
  line-height: 1.6;
}
.industry-page .service-item > div {
  min-width: 0;
}
.industry-page .service-item strong {
  display: block;
  font-size: 16px;
  line-height: 1.35;
}
.industry-page .service-item p {
  margin: 5px 0 0;
  color: #555;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.45;
}
/* Service cards are now links */
.industry-page .service-item {
  color: inherit;
  text-decoration: none;
}
.industry-page .service-item:focus-visible {
  outline: 3px solid var(--fig-teal);
  outline-offset: 3px;
}
/* Finance and Crypto compliance notes */
.industry-page .compliance-note {
  max-width: 840px;
  margin: 22px auto 0;
  color: #68707c;
  font-size: 13px;
  line-height: 1.5;
  text-align: center;
}
/* Sticky services heading on desktop */
@media (min-width: 992px) {
  .industry-page .services-sticky-column {
    position: sticky;
    top: 32px;
    align-self: flex-start;
  }
}
/* Responsive styles */
@media (min-width: 992px) {
  .industry-page .native-stack-grid>[class*="col-"] {
    width: 12.5%;
    flex: 0 0 12.5%;
  }
  .industry-page .saas-faq-section .faqHead {
    font-size: 90px;
    line-height: 1;
  }
  .healthcare-page .native-stack-grid>[class*="col-"] {
    width: 16.666667%;
    flex: 0 0 16.666667%;
  }
}
/* Content additions shared by the industry pages */
.industry-page .service-list-intro {
  margin-bottom: 20px;
  font-size: 15px;
  line-height: 1.6;
}

.industry-page .service-item>div {
  min-width: 0;
}

.industry-page .service-item strong {
  display: block;
  font-size: 16px;
  line-height: 1.35;
}

.industry-page .service-item p {
  margin: 5px 0 0;
  color: #555;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.45;
}

.industry-page .service-item {
  color: inherit;
  text-decoration: none;
}

.industry-page .service-item:focus-visible {
  outline: 3px solid var(--fig-teal);
  outline-offset: 3px;
}

.industry-page .compliance-note {
  max-width: 840px;
  margin: 22px auto 0;
  color: #68707c;
  font-size: 13px;
  line-height: 1.5;
  text-align: center;
}

/* SaaS failure-pattern animation */
.saas-audit-animation .industry-audit-card {
  position: relative;
  cursor: pointer;
  transition: background-color 180ms ease, box-shadow 180ms ease;
}

.saas-audit-animation .industry-audit-card:hover {
  background: #f8fbfc;
}

.saas-audit-animation .industry-audit-card.is-active {
  z-index: 1;
  background: #f2fbfd;
  box-shadow: inset 0 0 0 2px var(--fig-teal);
}

.saas-audit-animation .industry-audit-card:focus-visible,
.saas-audit-animation .saas-audit-controls button:focus-visible {
  outline: 3px solid var(--fig-teal) !important;
  outline-offset: -4px !important;
}

.saas-audit-visual {
  display: flex;
  flex-direction: column;
  min-height: 265px;
  height: 100%;
  padding: 18px;
  overflow: hidden;
  border: 1px solid #ededed;
  background: #f2f3f4;
}

.saas-audit-controls {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-bottom: 14px;
}

.saas-audit-controls button {
  min-width: 29px !important;
  height: 29px !important;
  padding: 0 7px !important;
  border: 1px solid #cbd2d9 !important;
  border-radius: 4px !important;
  background: #fff !important;
  color: var(--fig-navy) !important;
  font: inherit !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  transition: 160ms ease !important;
}

.saas-audit-controls button:hover,
.saas-audit-controls button.is-active {
  border-color: var(--fig-teal) !important;
  background: var(--fig-teal) !important;
  color: #fff !important;
}

.saas-audit-controls .saas-audit-autoplay {
  min-width: 72px !important;
  margin-left: auto !important;
}

.saas-audit-stage {
  flex: 1;
  min-height: 190px;
  transition: opacity 140ms ease, transform 140ms ease;
}

.saas-audit-stage.is-changing {
  opacity: 0;
  transform: scale(.98);
}

.saas-audit-view {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  min-height: 190px;
}

.saas-audit-view-header,
.saas-audit-view-footer {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--fig-navy);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .03em;
  text-transform: uppercase;
}

.saas-audit-view-footer {
  justify-content: space-between;
  color: #5d6570;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
}

.saas-audit-pulse {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--fig-teal);
  animation: saas-audit-pulse 2s infinite;
}

.saas-audit-canvas {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 125px;
  margin: 10px 0;
  padding: 12px;
  overflow: hidden;
  border: 1px solid #e2e5e9;
  border-radius: 6px;
  background: #fff;
}

.saas-audit-canvas svg {
  width: 100%;
  height: 118px;
}

.saas-audit-journey,
.saas-audit-channels {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: 7px;
}

.saas-audit-journey::before {
  position: absolute;
  right: 8%;
  left: 8%;
  height: 2px;
  background: #d8dee5;
  content: "";
}

.saas-audit-node,
.saas-audit-channel {
  position: relative;
  z-index: 1;
  flex: 1;
  padding: 8px 5px;
  border: 1px solid #cfeff5;
  border-radius: 5px;
  background: #eefbfe;
  color: var(--fig-navy);
  font-size: 9px;
  font-weight: 700;
  text-align: center;
}

.saas-audit-node:last-child {
  background: var(--fig-navy);
  color: #fff;
}

.saas-audit-channel {
  animation: saas-audit-channel 2.4s ease-in-out infinite alternate;
}

.saas-audit-channel:nth-child(2) {
  animation-delay: 200ms;
}

.saas-audit-channel:nth-child(3) {
  animation-delay: 400ms;
}

.saas-audit-bars {
  display: grid;
  width: 100%;
  gap: 12px;
}

.saas-audit-bar {
  display: grid;
  grid-template-columns: 76px 1fr 34px;
  align-items: center;
  gap: 8px;
  color: #5d6570;
  font-size: 9px;
}

.saas-audit-bar i {
  display: block;
  height: 9px;
  border-radius: 10px;
  background: #dce2e8;
}

.saas-audit-bar.is-teal i {
  background: var(--fig-teal);
  transform-origin: left;
  animation: saas-audit-grow 2.4s ease-in-out infinite alternate;
}

.saas-audit-flywheel {
  width: 118px;
  height: 118px;
  border: 3px dashed var(--fig-teal);
  border-radius: 50%;
  animation: saas-audit-spin 7s linear infinite;
}

.saas-audit-flywheel-label {
  position: absolute;
  z-index: 2;
  color: var(--fig-navy);
  font-size: 10px;
  font-weight: 700;
  text-align: center;
  pointer-events: none;
}

@keyframes saas-audit-pulse {

  0%,
  100% {
    box-shadow: 0 0 0 0 rgba(10, 188, 216, .45);
  }

  50% {
    box-shadow: 0 0 0 7px rgba(10, 188, 216, 0);
  }
}

@keyframes saas-audit-channel {
  from {
    transform: translateY(5px);
  }

  to {
    transform: translateY(-5px);
  }
}

@keyframes saas-audit-grow {
  from {
    transform: scaleX(.35);
  }

  to {
    transform: scaleX(1);
  }
}

@keyframes saas-audit-spin {
  to {
    transform: rotate(360deg);
  }
}

/* Source-matched SaaS audit interaction */
.saas-audit-animation .industry-audit-card {
  min-height: 270px;
  padding: 36px 32px;
  transition: all .25s cubic-bezier(.16, 1, .3, 1);
  user-select: none;
}

.saas-audit-animation .industry-audit-card.is-active {
  border-color: #bae6fd;
  background: #f0f9ff;
  box-shadow: inset 0 0 0 1px #00a8cc;
}

.industry-audit-card-number {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.industry-page .challenge-card .industry-audit-status {
  padding: 3px 7px;
  border: 1px solid #00a8cc;
  border-radius: 4px;
  background: #e0f7fc;
  color: #00a8cc;
  font-size: 10px;
  font-weight: 700;
}

.industry-page .challenge-card .industry-audit-status[hidden] {
  display: none;
}

.saas-audit-animation .industry-audit-card.is-active .industry-audit-card-number>span:first-child {
  color: #00a8cc;
}

.saas-audit-visual {
  min-height: 270px;
  padding: 20px;
  border-color: #e2e8f0;
  background: #f8fafc;
}

.saas-audit-controls {
  gap: 0;
  margin-bottom: 8px;
}

.saas-audit-controls button {
  min-width: 30px !important;
  height: 27px !important;
  margin-left: -1px !important;
  border-color: #adb5bd !important;
  border-radius: 0 !important;
  color: #6c757d !important;
  font-size: 10px !important;
}

.saas-audit-controls button:first-child {
  border-radius: 4px 0 0 4px !important;
}

.saas-audit-controls button:nth-child(6) {
  border-radius: 0 4px 4px 0 !important;
}

.saas-audit-controls button:hover,
.saas-audit-controls button.is-active {
  position: relative !important;
  z-index: 1 !important;
  border-color: #00a8cc !important;
  background: #00a8cc !important;
}

.saas-audit-controls .saas-audit-autoplay {
  min-width: 78px !important;
  margin-left: auto !important;
  border-radius: 4px !important;
  border-color: #212529 !important;
  color: #212529 !important;
}

.saas-audit-controls .saas-audit-autoplay.is-active {
  border-color: #dc3545 !important;
  background: #dc3545 !important;
  color: #fff !important;
}

.saas-audit-stage,
.saas-source-view {
  min-height: 195px;
}

.saas-source-view {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}

.saas-source-head,
.saas-source-head>div,
.saas-source-wheel-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.saas-source-head strong {
  color: #212529;
  font-size: 12px;
}

.saas-source-badge,
.saas-source-green-pill,
.saas-source-wheel-foot strong {
  padding: 3px 6px;
  border: 1px solid #00a8cc;
  border-radius: 4px;
  background: #e0f7fc;
  color: #00a8cc;
  font-size: 9px;
  font-weight: 700;
  white-space: nowrap;
}

.saas-source-badge.is-warning {
  border-color: #ffc107;
  background: #fff8db;
  color: #b58100;
}

.saas-source-badge.is-success {
  border-color: #10b981;
  background: #eafaf4;
  color: #087a56;
}

.saas-source-toggle {
  display: flex;
  gap: 0;
}

.saas-source-toggle button {
  padding: 2px 8px !important;
  border: 1px solid #adb5bd !important;
  background: #fff !important;
  color: #6c757d !important;
  font: inherit !important;
  font-size: 10px !important;
}

.saas-source-toggle button:first-child {
  border-radius: 4px 0 0 4px !important;
}

.saas-source-toggle button:last-child {
  margin-left: -1px !important;
  border-radius: 0 4px 4px 0 !important;
}

.saas-source-toggle button.is-danger {
  border-color: #dc3545 !important;
  background: #dc3545 !important;
  color: #fff !important;
}

.saas-source-toggle button.is-cyan {
  border-color: #00a8cc !important;
  background: #00a8cc !important;
  color: #fff !important;
}

.saas-source-panel {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: center;
  min-height: 140px;
  margin: 5px 0;
  padding: 8px;
  border: 1px solid #dee2e6;
  border-radius: 6px;
  background: #fff;
}

.saas-source-panel>svg {
  width: 100%;
  height: 100%;
  max-height: 140px;
}

.saas-source-stats {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  text-align: center;
}

.saas-source-stats>div,
.saas-source-note,
.saas-source-protection {
  padding: 4px 8px;
  border: 1px solid #dee2e6;
  border-radius: 4px;
  background: #fff;
}

.saas-source-stats small,
.saas-source-stats strong {
  display: block;
}

.saas-source-stats small {
  color: #6c757d;
  font-size: 9px;
}

.saas-source-stats strong {
  color: #212529;
  font-size: 12px;
}

.saas-source-view .is-danger {
  color: #dc3545;
}

.saas-source-view .is-success {
  color: #087a56;
}

.saas-source-journey {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.saas-source-journey>i {
  position: absolute;
  top: 13px;
  width: 100%;
  height: 2px;
  background: #e2e8f0;
}

.saas-source-journey>div {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: center;
  gap: 3px;
  text-align: center;
}

.saas-source-journey b {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border: 1px solid #00a8cc;
  border-radius: 50%;
  background: #e0f7fc;
  color: #00a8cc;
}

.saas-source-journey b.is-complete {
  border-color: #10b981;
  background: #10b981;
  color: #fff;
}

.saas-source-journey strong {
  color: #212529;
  font-size: 9px;
}

.saas-source-journey small {
  padding: 1px 4px;
  border-radius: 3px;
  background: #eafaf4;
  color: #087a56;
  font-size: 8px;
}

.saas-source-note {
  color: #6c757d;
  font-size: 10px;
  text-align: center;
}

.saas-source-note.is-success {
  color: #087a56;
  font-weight: 600;
}

.saas-source-synergy {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  text-align: center;
}

.saas-source-synergy>div {
  padding: 5px;
  border: 1px solid #00a8cc;
  border-radius: 4px;
  background: #e0f7fc;
}

.saas-source-synergy strong,
.saas-source-synergy small {
  display: block;
}

.saas-source-synergy strong {
  color: #212529;
  font-size: 10px;
}

.saas-source-synergy small {
  color: #6c757d;
  font-size: 8px;
}

.saas-source-green-pill {
  align-self: center;
  margin-top: 8px;
  border-color: #10b981;
  background: #10b981;
  color: #fff;
}

.saas-source-table {
  width: 100%;
  border-collapse: collapse;
  color: #212529;
  font-size: 10px;
  text-align: center;
}

.saas-source-table th,
.saas-source-table td {
  padding: 4px;
}

.saas-source-table th:first-child,
.saas-source-table td:first-child {
  text-align: left;
}

.saas-source-table thead {
  border-bottom: 1px solid #dee2e6;
}

.saas-source-table tbody tr:last-child {
  border-top: 1px solid #dee2e6;
}

.saas-source-table th:last-child,
.saas-source-table td:last-child {
  background: #e0f7fc;
  color: #00a8cc;
}

.saas-source-table td span {
  padding: 2px 4px;
  border-radius: 3px;
  background: #10b981;
  color: #fff;
  font-size: 8px;
}

.saas-source-progress-copy,
.saas-source-wheel-foot {
  display: flex;
  justify-content: space-between;
  color: #6c757d;
  font-size: 10px;
}

.saas-source-progress-copy strong {
  color: #087a56;
}

.saas-source-progress {
  height: 12px;
  margin: 5px 0 8px;
  overflow: hidden;
  border-radius: 10px;
  background: #e9ecef;
}

.saas-source-progress i {
  display: block;
  width: 85%;
  height: 100%;
  background: #00a8cc;
}

.saas-source-protection {
  background: #f8f9fa;
  color: #212529;
  font-size: 9px;
  text-align: center;
}

.saas-source-wheel {
  align-items: center;
  overflow: hidden;
}

.saas-source-wheel svg {
  max-height: 150px;
}

.saas-source-wheel-ring {
  transform-origin: 130px 70px;
  animation: saas-audit-spin 6s linear infinite;
}

.saas-source-wheel-foot strong {
  border: 0;
  background: #00a8cc;
  color: #fff;
}

@media (max-width: 991.98px) {
  .saas-audit-animation .industry-audit-card {
    min-height: auto;
    padding: 28px 24px;
  }
}

/* Healthcare audit flywheel — matched to Healthcare Animation.html */
.healthcare-audit-animation .healthcare-audit-card {
  position: relative;
  min-height: 265px;
  cursor: pointer;
  user-select: none;
  transition: all .2s ease-in-out;
}

.healthcare-audit-animation .healthcare-audit-card:hover {
  background: #f8fafc;
}

.healthcare-audit-animation .healthcare-audit-card.is-active {
  background: #f0fdfa;
  box-shadow: inset 0 0 0 2px #00a8b5;
}

.healthcare-audit-number {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.industry-page .challenge-card .healthcare-live-badge {
  padding: 4px 8px;
  border: 1px solid rgba(0, 168, 181, .3);
  border-radius: 999px;
  background: rgba(0, 168, 181, .1);
  color: #00a8b5;
  font-size: 10px;
  font-weight: 700;
}

.industry-page .challenge-card .healthcare-live-badge[hidden] {
  display: none;
}

.healthcare-audit-animation .healthcare-audit-card.is-active .healthcare-audit-number>span:first-child {
  color: #00a8b5;
}

.healthcare-audit-card:focus-visible {
  outline: 3px solid #00a8b5;
  outline-offset: -4px;
}

.healthcare-flywheel-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 265px;
  height: 100%;
  padding: 24px;
  overflow: hidden;
  border: 1px solid #e5e7eb;
  border-left: 2px solid #00a8b5;
  background: #f8fafc;
}

.healthcare-flywheel-top,
.healthcare-flywheel-label,
.healthcare-solution-box>div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.healthcare-flywheel-label>span {
  color: #00a8b5;
  font-size: 18px;
  font-weight: 700;
}

.healthcare-flywheel-label>strong {
  padding: 4px 8px;
  border: 1px solid rgba(0, 168, 181, .3);
  border-radius: 999px;
  background: rgba(0, 168, 181, .1);
  color: #00a8b5;
  font-size: 11px;
}

.healthcare-flywheel-card h3 {
  margin: 12px 0 4px;
  color: #0b1c3d;
  font-size: 18px;
  font-weight: 700;
}

.healthcare-flywheel-card>div>p {
  margin: 0;
  color: #64748b;
  font-size: 13px;
  line-height: 1.4;
}

.healthcare-autoplay {
  padding: 2px 8px !important;
  border: 1px solid #6c757d !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #6c757d !important;
  font-family: monospace !important;
  font-size: 11px !important;
  line-height: 1.5 !important;
}

.healthcare-autoplay:hover,
.healthcare-autoplay:focus-visible {
  border-color: #00a8b5 !important;
  color: #00a8b5 !important;
  outline: none !important;
}

.healthcare-flywheel-graphic {
  height: 150px;
  margin: 8px 0;
  text-align: center;
}

.healthcare-flywheel-graphic svg {
  width: 100%;
  height: 100%;
  overflow: visible;
}

.healthcare-flywheel-tracer {
  animation: healthcare-tracer 6s linear infinite;
}

.healthcare-flywheel-graphic [data-healthcare-node] {
  cursor: pointer;
}

.healthcare-flywheel-graphic [data-healthcare-node] line {
  stroke: #e2e8f0;
  stroke-width: 1;
  stroke-dasharray: 2 2;
  transition: .2s ease;
}

.healthcare-flywheel-graphic [data-healthcare-node] .halo {
  fill: #00a8b5;
  opacity: 0;
  transition: .2s ease;
}

.healthcare-flywheel-graphic [data-healthcare-node] .node {
  fill: #fff;
  stroke: #94a3b8;
  stroke-width: 1.5;
  transition: .2s ease;
}

.healthcare-flywheel-graphic [data-healthcare-node] text {
  fill: #475569;
  font-size: 7.5px;
  font-weight: 700;
  text-anchor: middle;
  transition: .2s ease;
}

.healthcare-flywheel-graphic [data-healthcare-node].is-active line {
  stroke: #00a8b5;
  stroke-width: 1.8;
  stroke-dasharray: none;
}

.healthcare-flywheel-graphic [data-healthcare-node].is-active .halo {
  opacity: .18;
}

.healthcare-flywheel-graphic [data-healthcare-node].is-active .node {
  fill: #00a8b5;
  stroke: #00a8b5;
}

.healthcare-flywheel-graphic [data-healthcare-node].is-active text {
  fill: #fff;
}

.healthcare-solution-box {
  padding: 8px;
  border: 1px solid #dee2e6;
  border-radius: 5px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
}

.healthcare-solution-box span {
  padding: 1px 8px;
  border: 1px solid #dee2e6;
  border-radius: 4px;
  background: #f8f9fa;
  color: #212529;
  font-size: 11px;
}

.healthcare-solution-box small {
  color: #64748b;
  font-family: monospace;
  font-size: 11px;
}

.healthcare-solution-box p {
  margin: 5px 0 0;
  color: #212529;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.35;
}

@keyframes healthcare-tracer {
  to {
    stroke-dashoffset: -324;
  }
}

@media (max-width: 991.98px) {

  .healthcare-audit-animation .healthcare-audit-card,
  .healthcare-flywheel-card {
    min-height: auto;
  }
}

@media (prefers-reduced-motion: reduce) {

  .healthcare-audit-animation *,
  .healthcare-audit-animation *::before,
  .healthcare-audit-animation *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* E-commerce audit animation — matched to E-commerce animation.html */
.ecommerce-audit-card {
  position: relative;
  min-height: 265px;
  cursor: pointer;
  user-select: none;
  transition: background-color .25s ease, border-color .25s ease, transform .2s ease;
}

.ecommerce-audit-card:hover {
  background: #fafbfc;
}

.ecommerce-audit-card.is-selected {
  background: #f8fafc;
}

.ecommerce-audit-card.is-selected::before,
.ecommerce-animation-slot::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 3px;
  background: #00b4d8;
  content: "";
}

.ecommerce-audit-card:focus-visible {
  outline: 3px solid #00b4d8;
  outline-offset: -4px;
}

.ecommerce-animation-slot {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 265px;
  height: 100%;
  padding: 28px;
  overflow: hidden;
  border: 1px solid #e5e7eb;
  background: #f8fafc;
}

.ecommerce-animation-slot::before {
  background: linear-gradient(90deg, #00b4d8, #0284c7);
}

.ecommerce-animation-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.ecommerce-animation-head>div:first-child {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
}

.ecommerce-animation-head span {
  color: #00b4d8;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .08em;
}

.ecommerce-animation-head small {
  padding: 2px 5px;
  border-radius: 999px;
  background: rgba(0, 180, 216, .1);
  color: #0096c7;
  font-size: 9px;
  font-weight: 600;
}

.ecommerce-animation-head strong {
  flex-basis: 100%;
  color: #212529;
  font-size: 14px;
}

.ecommerce-dots {
  display: flex;
  align-items: center;
  gap: 4px;
  padding-top: 4px;
}

.ecommerce-dots button {
  width: 7px !important;
  height: 7px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: rgba(108, 117, 125, .25) !important;
  transition: all .3s ease !important;
}

.ecommerce-dots button.is-active {
  width: 18px !important;
  border-radius: 10px !important;
  background: #00b4d8 !important;
}

.ecommerce-stage {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  min-height: 140px;
}

.ecommerce-stage-view {
  width: 100%;
  animation: ecommerce-fade-slide .35s ease-out both;
}

.ecommerce-stage-title {
  display: flex;
  justify-content: space-between;
  margin-bottom: 5px;
  color: #6c757d;
  font-size: 11px;
}

.ecommerce-stage svg {
  width: 100%;
  height: 90px;
}

.ecommerce-stage .draw-one {
  stroke-dasharray: 400;
  stroke-dashoffset: 400;
  animation: ecommerce-draw 1.2s ease-out forwards;
}

.ecommerce-stage .draw-two {
  stroke-dasharray: 400;
  stroke-dashoffset: 400;
  animation: ecommerce-draw 1.4s ease-out .2s forwards;
}

.ecommerce-stage-foot {
  display: flex;
  justify-content: space-between;
  margin-top: 8px;
  padding-top: 4px;
  border-top: 1px solid #f1f5f9;
  color: #6c757d;
  font-size: 11px;
}

.ecommerce-stage-foot strong {
  color: #dc3545;
}

.ecommerce-touchpoints {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  text-align: center;
}

.ecommerce-touchpoint>div,
.ecommerce-stack>div,
.ecommerce-price-card,
.ecommerce-bars {
  padding: 6px;
  border: 1px solid #e2e8f0;
  border-radius: 5px;
  background: #fff;
}

.ecommerce-touchpoint small,
.ecommerce-touchpoint strong {
  display: block;
  font-size: 9px;
}

.ecommerce-touchpoint b {
  display: block;
  margin: 4px 0;
  color: #0a1128;
}

.ecommerce-touchpoint>span {
  display: inline-block;
  margin-top: 4px;
  padding: 2px 4px;
  border-radius: 3px;
  background: rgba(239, 68, 68, .1);
  color: #ef4444;
  font-size: 8px;
}

.ecommerce-touchpoint:last-child>div {
  border-color: #00b4d8;
  background: #e0f7fa;
}

.ecommerce-touchpoint:last-child>span {
  background: rgba(0, 180, 216, .15);
  color: #0096c7;
}

.ecommerce-stack {
  display: grid;
  gap: 4px;
}

.ecommerce-stack>div {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  color: #0a1128;
  font-size: 10px;
}

.ecommerce-stack b {
  color: #6c757d;
}

.ecommerce-stack em {
  color: #dc3545;
  font-style: normal;
  font-weight: 700;
}

.ecommerce-prices {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  text-align: center;
}

.ecommerce-price-card small,
.ecommerce-price-card strong {
  display: block;
}

.ecommerce-price-card strong {
  margin: 4px 0;
  color: #dc3545;
}

.ecommerce-price-card.is-brand {
  border-color: #00b4d8;
  background: #e0f7fa;
}

.ecommerce-price-card.is-brand strong {
  color: #0a1128;
}

.ecommerce-bar-row {
  margin: 8px 0;
  color: #6c757d;
  font-size: 9px;
}

.ecommerce-bar-row div:first-child {
  display: flex;
  justify-content: space-between;
}

.ecommerce-bar-track {
  height: 4px;
  overflow: hidden;
  background: #e2e8f0;
}

.ecommerce-bar-track i {
  display: block;
  height: 100%;
  background: #dc3545;
  animation: ecommerce-linear 1.2s ease-out both;
}

.ecommerce-bar-row:last-child i {
  background: #00b4d8;
  animation-name: ecommerce-compound;
}

.ecommerce-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 8px;
  border-top: 1px solid #f1f5f9;
  color: #6c757d;
  font-size: 10px;
}

.ecommerce-nav button {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #6c757d !important;
  font: inherit !important;
  font-size: 11px !important;
  text-decoration: none !important;
}

.ecommerce-nav button:last-child {
  color: #00b4d8 !important;
  font-weight: 600 !important;
}

.ecommerce-timer {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 2.5px;
  background: #00b4d8;
}

@keyframes ecommerce-fade-slide {
  from {
    opacity: 0;
    transform: translateY(8px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes ecommerce-draw {
  to {
    stroke-dashoffset: 0;
  }
}

@keyframes ecommerce-linear {
  from {
    width: 0;
  }

  to {
    width: 4%;
  }
}

@keyframes ecommerce-compound {
  from {
    width: 0;
  }

  to {
    width: 62%;
  }
}

@media (prefers-reduced-motion: reduce) {

  .ecommerce-audit-animation *,
  .ecommerce-audit-animation *::before,
  .ecommerce-audit-animation *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* Real Estate audit simulation — matched to Real Estate Animation.html */
.realestate-animation-card {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 265px;
  height: 100%;
  padding: 24px;
  overflow: hidden;
  border: 1px solid #e5e7eb;
  background: #f8fafc;
}

.realestate-animation-head,
.realestate-animation-head>div,
.realestate-legend,
.realestate-legend>div,
.realestate-legend span {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.realestate-animation-head>div:first-child i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #00bcd4;
}

.realestate-animation-head strong {
  color: #0c1a30;
  font-size: 13px;
}

.realestate-filter {
  gap: 0 !important;
}

.realestate-filter button {
  padding: 2px 8px !important;
  border: 1px solid #adb5bd !important;
  border-radius: 0 !important;
  background: #fff !important;
  color: #6c757d !important;
  font: inherit !important;
  font-size: 10px !important;
  line-height: 1.5 !important;
}

.realestate-filter button:first-child {
  border-radius: 4px 0 0 4px !important;
}

.realestate-filter button:last-child {
  margin-left: -1px !important;
  border-radius: 0 4px 4px 0 !important;
}

.realestate-filter button:nth-child(2) {
  margin-left: -1px !important;
}

.realestate-filter button.is-active[data-realestate-filter="both"] {
  border-color: #212529 !important;
  background: #212529 !important;
  color: #fff !important;
}

.realestate-filter button.is-active[data-realestate-filter="decay"] {
  border-color: #dc3545 !important;
  background: #dc3545 !important;
  color: #fff !important;
}

.realestate-filter button.is-active[data-realestate-filter="compound"] {
  border-color: #00bcd4 !important;
  background: #00bcd4 !important;
  color: #fff !important;
}

.realestate-filter button:focus-visible {
  position: relative !important;
  z-index: 2 !important;
  outline: 2px solid #00bcd4 !important;
  outline-offset: 1px !important;
}

.realestate-chart {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  padding: 8px 0;
}

.realestate-chart svg {
  width: 100%;
  height: 100%;
  max-height: 180px;
  overflow: visible;
}

.realestate-chart .grid {
  stroke: #e5e7eb;
  stroke-width: 1;
  stroke-dasharray: 3 3;
}

.realestate-chart .axis {
  stroke: #cbd5e1;
  stroke-width: 1.5;
}

.realestate-chart text {
  fill: #9ca3af;
  font-size: 10px;
}

.realestate-chart .decay-line {
  fill: none;
  stroke: #ef4444;
  stroke-width: 2.5;
  stroke-dasharray: 5 3;
}

.realestate-chart .decay-text {
  fill: #ef4444;
  font-size: 9px;
  font-weight: 600;
}

.realestate-chart .decay-dot {
  fill: #ef4444;
  transform-origin: center;
  animation: realestate-pulse 2s ease-in-out infinite;
}

.realestate-chart .compound-line {
  fill: none;
  stroke: #00bcd4;
  stroke-width: 3.5;
  stroke-linecap: round;
  stroke-dasharray: 400;
  animation: realestate-draw 4s cubic-bezier(.4, 0, .2, 1) infinite alternate;
}

.realestate-chart .compound-dot {
  fill: #00bcd4;
  stroke: #fff;
  stroke-width: 2;
  transform-origin: center;
  animation: realestate-pulse 2s ease-in-out infinite;
}

.realestate-chart .compound-text {
  fill: #0097a7;
  font-size: 10px;
  font-weight: 700;
}

.realestate-legend {
  padding-top: 8px;
  border-top: 1px solid #f1f5f9;
}

.realestate-legend>div {
  gap: 12px;
}

.realestate-legend span {
  color: #6b7280;
  font-size: 11px;
}

.realestate-legend span:last-child {
  color: #0c1a30;
  font-weight: 600;
}

.realestate-legend i {
  display: inline-block;
  width: 12px;
  height: 3px;
}

.realestate-legend i.decay {
  background: #ef4444;
}

.realestate-legend i.compound {
  background: #00bcd4;
}

.realestate-legend>b {
  padding: 2px 5px;
  border: 1px solid #dee2e6;
  border-radius: 4px;
  background: #f8f9fa;
  color: #6c757d;
  font-size: 10px;
}

@keyframes realestate-draw {
  0% {
    stroke-dashoffset: 400
  }

  50%,
  100% {
    stroke-dashoffset: 0
  }
}

@keyframes realestate-pulse {

  0%,
  100% {
    transform: scale(1);
    opacity: .9
  }

  50% {
    transform: scale(1.35);
    opacity: 1
  }
}

@media (max-width:767.98px) {
  .realestate-animation-head {
    align-items: flex-start;
    flex-direction: column
  }

  .realestate-animation-card {
    min-height: 250px
  }

  .realestate-legend {
    align-items: flex-start;
    gap: 5px
  }

  .realestate-legend>div {
    align-items: flex-start;
    flex-direction: column;
    gap: 4px
  }
}

@media (prefers-reduced-motion:reduce) {

  .realestate-audit-animation *,
  .realestate-audit-animation *::before,
  .realestate-audit-animation *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important
  }
}

/* Finance growth-mode animation — matched to Finance Animation.html */
.finance-animation-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 340px;
  height: 100%;
  padding: 32px;
  border: 1px solid #e2e8f0;
  background: #fff
}

.finance-animation-head,
.finance-metric {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px
}

.finance-animation-head>span {
  color: #00b4d8;
  font-size: 24px;
  font-weight: 700
}

.finance-mode-switch {
  display: flex;
  padding: 4px;
  border: 1px solid #f1f5f9;
  border-radius: 999px;
  background: #f8f9fa;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .04)
}

.finance-mode-switch button {
  padding: 4px 8px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #6c757d !important;
  font: inherit !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important
}

.finance-mode-switch button.is-active[data-finance-mode="compounding"] {
  background: #00b4d8 !important;
  color: #fff !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .08) !important
}

.finance-mode-switch button.is-active[data-finance-mode="non-compounding"] {
  background: #dc3545 !important;
  color: #fff !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .08) !important
}

.finance-mode-switch button:focus-visible {
  outline: 2px solid #00b4d8 !important;
  outline-offset: 1px !important
}

.finance-animation-card h3 {
  margin: 12px 0 6px;
  color: #0b192c;
  font-size: 20px;
  font-weight: 700
}

.finance-animation-card>div>p {
  margin: 0;
  color: #64748b;
  font-size: 14px;
  line-height: 1.55
}

.finance-chart {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  min-height: 140px;
  margin: 12px 0;
  padding: 12px;
  border: 1px solid #f1f5f9;
  border-radius: 8px;
  background: #f0f9ff;
  transition: background-color .4s ease
}

.finance-chart.is-broken {
  background: #fff5f5
}

.finance-chart svg {
  width: 100%;
  height: 100%;
  max-height: 130px;
  overflow: visible
}

.finance-mode-group {
  animation: finance-mode-fade .3s cubic-bezier(.16, 1, .3, 1) both
}

.finance-chart line {
  stroke: #e0f2fe;
  stroke-width: 1;
  stroke-dasharray: 3 3
}

.finance-chart .finance-grid-three {
  stroke: #bae6fd;
  stroke-width: 1.5;
  stroke-dasharray: none
}

.finance-chart.is-broken line {
  stroke: #fee2e2
}

.finance-chart.is-broken .finance-grid-three {
  stroke: #fecaca
}

.finance-chart text {
  fill: #64748b;
  font-size: 8.5px;
  font-weight: 600
}

.finance-chart text.cyan {
  fill: #0284c7
}

.finance-chart text.red {
  fill: #dc2626
}

.finance-chart text.strong {
  font-weight: 800
}

.finance-compound-line {
  fill: none;
  stroke: #00b4d8;
  stroke-width: 3.5;
  stroke-linecap: round
}

.finance-broken-line {
  fill: none;
  stroke: #ef4444;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-dasharray: 5 3
}

.finance-chart [data-finance-particle="compounding"] {
  fill: #00b4d8
}

.finance-chart [data-finance-particle="broken"] {
  fill: #ef4444
}

.finance-goal {
  fill: #0284c7
}

.finance-goal-ring {
  fill: none;
  stroke: #00b4d8;
  stroke-width: 1.5;
  animation: finance-goal-pulse 2s infinite
}

.finance-metric {
  padding-top: 8px;
  border-top: 1px solid #f1f5f9;
  color: #6c757d;
  font-size: 12px
}

.finance-metric strong {
  padding: 2px 8px;
  border-radius: 4px;
  background: rgba(0, 180, 216, .08);
  color: #00b4d8
}

.finance-metric strong.is-broken {
  background: #fee2e2;
  color: #dc2626
}

@keyframes finance-goal-pulse {

  0%,
  100% {
    r: 5;
    opacity: .8
  }

  50% {
    r: 14;
    opacity: 0
  }
}

@keyframes finance-mode-fade {
  from {
    opacity: 0;
    transform: translateY(4px)
  }

  to {
    opacity: 1;
    transform: none
  }
}

@media(max-width:991.98px) {
  .finance-animation-card {
    min-height: 265px;
    padding: 24px
  }
}

@media(max-width:575.98px) {
  .finance-animation-head {
    align-items: flex-start;
    flex-direction: column
  }

  .finance-mode-switch {
    align-self: stretch
  }

  .finance-mode-switch button {
    flex: 1 !important
  }
}

@media(prefers-reduced-motion:reduce) {

  .finance-audit-animation *,
  .finance-audit-animation *::before,
  .finance-audit-animation *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important
  }
}

/* Education compounding visualizer — matched to Education Animation.html */
.education-audit-card {
  width: 100%;
  min-height: 265px;
  cursor: pointer;
  transition: background-color .2s ease
}

.education-audit-card:hover,
.education-audit-card.is-active {
  background: #f8fafc !important
}

.education-audit-card:hover>span,
.education-audit-card.is-active>span {
  color: #00bed6
}

.education-audit-card:focus-visible {
  outline: 3px solid #00bed6;
  outline-offset: -4px
}

.education-visualizer {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 265px;
  height: 100%;
  padding: 24px;
  border: 1px solid #e2e8f0;
  background: #f8fafc
}

.education-vis-head,
.education-vis-head>div,
.education-vis-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px
}

.education-vis-head>div i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #00bed6;
  animation: education-pulse 2s ease-in-out infinite
}

.education-vis-head strong {
  color: #0c2340;
  font-size: 12px;
  letter-spacing: .06em;
  text-transform: uppercase
}

.education-vis-head>span {
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(0, 190, 214, .1);
  color: #00bed6;
  font-size: 10px;
  font-weight: 600;
  transition: .2s ease
}

.education-vis-chart {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  min-height: 130px;
  margin: 4px 0
}

.education-vis-chart svg {
  width: 100%;
  height: 100%;
  max-height: 150px
}

.education-vis-chart line {
  stroke: #e2e8f0;
  stroke-width: 1;
  stroke-dasharray: 3 3
}

.education-vis-chart line.base {
  stroke: #cbd5e1;
  stroke-width: 1.2;
  stroke-dasharray: none
}

.education-curve {
  fill: none;
  stroke: #00bed6;
  stroke-width: 3;
  stroke-linecap: round
}

.education-traveler {
  fill: #fff;
  stroke: #00bed6;
  stroke-width: 2.5;
  offset-path: path("M 35 120 Q 150 115 220 70 T 310 22");
  animation: education-travel 3.5s ease-in-out infinite
}

.education-vis-chart text {
  font-size: 8px;
  font-weight: 700
}

.education-vis-chart text.cyan {
  fill: #00bed6
}

.education-vis-chart text.red {
  fill: #ef4444
}

.education-stagnant {
  fill: none;
  stroke: #ef4444;
  stroke-width: 2.5;
  stroke-dasharray: 4 3
}

.education-vis-chart [data-education-node] {
  cursor: pointer
}

.education-vis-chart [data-education-node] circle {
  fill: #fff;
  stroke: #ef4444;
  stroke-width: 1.5;
  transform-origin: center;
  transition: .2s ease
}

.education-vis-chart [data-education-node] text {
  fill: #ef4444;
  font-size: 6.5px;
  text-anchor: middle
}

.education-vis-chart [data-education-node]:hover circle,
.education-vis-chart [data-education-node].is-active circle {
  transform: scale(1.2);
  fill: #fff4f4
}

.education-vis-foot {
  padding-top: 8px;
  border-top: 1px solid #f1f5f9
}

.education-vis-foot span {
  color: #6c757d;
  font-size: 11px
}

.education-vis-foot strong {
  color: #00bed6;
  font-size: 10px;
  white-space: nowrap;
  transition: .2s ease
}

.education-visualizer.is-inspecting .education-vis-head>span {
  background: rgba(239, 68, 68, .1);
  color: #ef4444
}

.education-visualizer.is-inspecting .education-vis-foot strong {
  color: #ef4444
}

@keyframes education-pulse {

  0%,
  100% {
    transform: scale(.9);
    opacity: .8
  }

  50% {
    transform: scale(1.3);
    opacity: 1
  }
}

@keyframes education-travel {
  0% {
    offset-distance: 0;
    opacity: 0
  }

  15% {
    opacity: 1
  }

  85% {
    opacity: 1
  }

  100% {
    offset-distance: 100%;
    opacity: 0
  }
}

@media(max-width:575.98px) {

  .education-vis-head,
  .education-vis-foot {
    align-items: flex-start;
    flex-direction: column
  }

  .education-vis-head>span {
    align-self: flex-start
  }

  .education-vis-foot strong {
    white-space: normal
  }
}

@media(prefers-reduced-motion:reduce) {

  .education-audit-animation *,
  .education-audit-animation *::before,
  .education-audit-animation *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important
  }
}

/* Crypto & Web3 canvas simulation — matched to Crypto Web3 Animation.html */
.crypto-audit-card {
  position: relative;
  min-height: 265px;
  cursor: pointer;
  user-select: none;
  transition: all .25s cubic-bezier(.16, 1, .3, 1)
}

.crypto-audit-card:hover {
  background: #fafbfc !important
}

.crypto-audit-card.is-active {
  background: rgba(0, 163, 196, .03) !important
}

.crypto-audit-card.is-active::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 3px;
  background: #00a3c4;
  content: ""
}

.crypto-audit-card.is-active>span {
  color: #00a3c4
}

.crypto-audit-card:focus-visible {
  outline: 3px solid #00a3c4;
  outline-offset: -4px
}

.crypto-simulation-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 280px;
  height: 100%;
  padding: 24px;
  border: 1px solid #e2e8f0;
  background: #fafbfc;
  transition: background-color .25s ease
}

.crypto-simulation-card.is-compounding {
  background: rgba(0, 163, 196, .04)
}

.crypto-sim-head,
.crypto-sim-head>div,
.crypto-sim-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px
}

.crypto-sim-head>div>span {
  color: #00a3c4;
  font-family: monospace;
  font-size: 20px;
  font-weight: 700
}

.crypto-sim-head small {
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(15, 23, 42, .08);
  color: #0f172a;
  font-family: monospace;
  font-size: 10px
}

.crypto-simulation-card.is-compounding .crypto-sim-head small {
  background: rgba(0, 163, 196, .15);
  color: #00a3c4
}

.crypto-sim-head button {
  padding: 4px 8px !important;
  border: 1px solid #dee2e6 !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: #212529 !important;
  font: inherit !important;
  font-family: monospace !important;
  font-size: 10px !important;
  line-height: 1.5 !important
}

.crypto-sim-head button:hover,
.crypto-sim-head button:focus-visible {
  border-color: #00a3c4 !important;
  color: #00a3c4 !important;
  outline: none !important
}

.crypto-simulation-card h3 {
  margin: 8px 0 3px;
  color: #0b192c;
  font-size: 20px;
  font-weight: 700
}

.crypto-simulation-card>div>p {
  margin: 0;
  color: #6c757d;
  font-size: 13px
}

.crypto-canvas-wrap {
  position: relative;
  flex: 1;
  min-height: 160px;
  height: 160px;
  margin: 8px 0;
  overflow: hidden;
  border-radius: 4px
}

.crypto-canvas-wrap canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none
}

.crypto-sim-foot {
  padding-top: 8px;
  border-top: 1px solid #dee2e6
}

.crypto-sim-foot>div {
  display: flex;
  gap: 4px
}

.crypto-sim-foot>span {
  color: #6c757d;
  font-family: monospace;
  font-size: 10px
}

.crypto-sim-foot button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 22px !important;
  height: 22px !important;
  padding: 0 !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 50% !important;
  background: #fff !important;
  color: #64748b !important;
  font-family: monospace !important;
  font-size: 10px !important;
  transition: all .2s ease !important
}

.crypto-sim-foot button.is-active {
  border-color: #00a3c4 !important;
  background: #0f172a !important;
  color: #fff !important;
  font-weight: 700 !important
}

.crypto-sim-foot button:focus-visible {
  outline: 2px solid #00a3c4 !important;
  outline-offset: 1px !important
}

@media(max-width:575.98px) {
  .crypto-sim-head {
    align-items: flex-start
  }

  .crypto-sim-foot {
    align-items: flex-start;
    flex-direction: column
  }
}

@media(prefers-reduced-motion:reduce) {

  .crypto-audit-animation *,
  .crypto-audit-animation *::before,
  .crypto-audit-animation *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important
  }
}

/* Match every industry native stack to the wider SaaS 8-column layout. */
.industry-page .native-stack-section>.container {
  max-width: 1272px !important;
}

.industry-page .native-stack-grid,
.industry-page .ecommerce-stack,
.industry-page .real-estate-stack,
.industry-page .finance-stack,
.industry-page .education-stack,
.industry-page .crypto-stack {
  width: 100%;
  max-width: none !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
}

@media (min-width: 992px) {

  .industry-page .native-stack-section .native-stack-grid>[class*="col-"],
  .industry-page .native-stack-section .ecommerce-stack>[class*="col-"],
  .industry-page .native-stack-section .real-estate-stack>[class*="col-"],
  .industry-page .native-stack-section .finance-stack>[class*="col-"],
  .industry-page .native-stack-section .education-stack>[class*="col-"],
  .industry-page .native-stack-section .crypto-stack>[class*="col-"] {
    width: 12.5%;
    flex: 0 0 12.5%;
    max-width: 12.5%;
  }
}

@media (min-width: 992px) {
  .industry-page .services-sticky-column {
    position: sticky;
    top: 32px;
    align-self: flex-start;
  }
}

@media (prefers-reduced-motion: reduce) {

  .saas-audit-animation *,
  .saas-audit-animation *::before,
  .saas-audit-animation *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}
/* NEW SERVICE PAGE CSS */
@media screen and (max-width: 1600px){
  .section-text, .gain-card p, .gain-card h6, .feature-title, .feature-text {
    font-size: 1rem;
}
.section-title, .strategy-section .fw-bold, .strategy-section .section-title {
    font-size: 2.5rem;
}
.numLIst .num {
    font-size: 1rem !IMPORTANT;
}
.numLIst .section-text {
    max-width: 520px;
}
.Nespresso .imgBox .section-text {
    max-width: 400px;
}
.sound-like-section {
    padding: 1rem 0;
}
.strategy-section {
    padding: 50px 0;
}
.hero-section, .paid-media-section {
    padding: 60px 0;
}
.paid-media-section {
    padding: 80px 0;
}
.sound-like-section .cta-heading, 
.sound-like-section .section-heading {
    font-size: 2.2rem;
    line-height: 110%;
    margin-bottom: 40px;
}
.abt-cols-grid {
    gap: 4rem;
    flex-wrap: wrap;
}
.pain-item,
.question-row{
    padding: 24px 40px;
    font-size: 1rem;
}
.pain-list {
    margin-top: 3rem;
}
.section-title-small {
    font-size: 1.6rem;
    margin: 40px 0 16px;
}
.sound-like-section .growth.casestudy.py-5.lozad.bg {
    background-size: 6vw, 12vw, 5vw;
    background-position-y: 60%, bottom, 27%;
    background-position-x: left, right, 45%;
}
.founderSection {
    padding-top: 4rem;
    padding-bottom: 4rem;
}
  .drop-down-cont.small-dropDown {
    top: 28px;
}
.logo_sec4_content .logo_slide ul li .item_body .item_text p {
    font-size: 18px;
    height: 300px !important;
}
.dashboard-grid {
    grid-template-columns: 1fr 1fr;
  }
  .steps-grid {
    grid-template-columns: 1fr 1fr 1fr;
    gap: 30px;
  }
  .comparison-layout {
    grid-template-columns: 1fr 1fr;
    gap: 30px;
  }
  .comparison-left {
    padding-right: 0;
  }
  .dashboard-stats-image, .funnel-dashboard-image {
    max-width: 100%;
}
.section.what-paid-media-really-means .container {
    max-width: 90% !important;
}
.hero.paid-media-hero h1 {
    font-size: 75px;
}
.outcomes-section .outcome-card h4 {
    font-size: 16px;
}
.how-we-force-your-budget-section .steps-grid {
    grid-template-columns: 1fr 1fr 1fr;
}
.convert-more-section .container-narrow {
    max-width: 90%;
}
.threePillarDigitalSec { padding: 3rem; }
      .threePillarDigitalSec .pillar-card p { font-size: 0.85rem; }
      .threePillarDigitalSec .display-title { font-size: 3.2rem !important; }
.transition-section .comparison-column li {
    font-size: 1rem;
} 
.onpageAnimation .cycleBtns span#btnText {
    font-size: 10px !important;
}
.onpageAnimation .cycleBtns button#resetBtn {
    font-size: 4px !important;
}
.onpageAnimation .cycleBtns .form-switch {
    padding: 0;
}
.automation-stats .stat-box h3 {
    font-size: 50px;
}
.onpageAnimation .cycleBtnsRow {
    flex-direction: column;
    align-items: start !important;
}
.onpageAnimation .cycleBtns {
    flex-direction: column;
    align-items: start !important;
}     
}
  @media (max-width: 1024px) {
    .blog-toc-wrap {
      grid-template-columns: 200px 1fr 48px;
    }
    .section.what-paid-media-really-means .container{
        max-width: 100% !important;
    }
    .hero.paid-media-hero {margin-top: 100px; padding-bottom: 30px;}
          .strategy-search-ads-section .pillar-card { border-right: none; border-bottom: 1px solid #eef2f6; }
      .strategy-search-ads-section .network-column { border-left: none; border-top: 1px solid #eef2f6; min-height: 340px; }
         .behavior-section .behavior-wrapper {
        padding: 40px 25px;
    }
    .behavior-section .section-title {
        font-size: 36px;
    }
    .behavior-section .feature-item {
        gap: 20px;
        padding: 24px 0;
    }
    .behavior-section .feature-content h4 {
        font-size: 24px;
    }
    .behavior-section .feature-content p,
    .behavior-section .section-desc {
        font-size: 16px;
    }
    .article-blog-banner {
    background-size: cover;
    padding: 100px 30px;
    }
    .article-blog-banner h1.article-title {
    max-width: 100%;
    }
    .threePillarDigitalSec .network-column { min-height: 300px; }
  .campaign-section .campaign-card{
        padding:30px;
    }
   .campaign-section .campaign-title{
        font-size:34px;
    }
    .campaign-section .stats-grid{
        grid-template-columns:1fr;
    }
    .campaign-section .stat-box{
        border-right:none;
        border-bottom:1px solid #ededed7c;
    }
    .campaign-section .growth-text{
        font-size:28px !important;
    }
    .recovery-section .recovery-layout{
        grid-template-columns:1fr;
    }
    .recovery-section .top-right-note{
            text-align:left;
            margin-bottom:25px;
        }
    .recovery-section .main-heading{
            font-size:2rem;
        }
    .recovery-section .recovery-card{
            padding:30px;
        }
    .why-worked-section{
        padding:60px 0;
    }
    .why-worked-section .main-heading{
        font-size:2.2rem;
        max-width:100%;
        margin-bottom:50px;
    }
    .why-worked-section .summary-main{
        font-size:1.25rem;
    }
    .why-worked-section .why-worked-wrapper {
        padding: 0 30px;
    }
   .retargeting-stats-section .stat-card:nth-child(3){
        border-right:1px solid #EEEEEE;
    }
    .retargeting-stats-section .stat-card:nth-child(2),
    .retargeting-stats-section .stat-card:nth-child(4),
    .retargeting-stats-section .stat-card:nth-child(6){
        border-right:none;
    }
    .retargeting-stats-section .section-header h2{
        font-size:2rem;
    }
    #FIG-Strategy .title-block { margin-bottom: 2.5rem; }
        #FIG-Strategy { padding: 2rem 1.5rem; }
        
   .framework-section .framework-title{
        font-size:2.3rem;
    }
    .framework-section .framework-header{
        margin-bottom:40px;
    }
        .fig-process .process-wrapper{
        padding:60px 30px;
    }
    .fig-process .timeline::before{
        left:22px;
    }
    .fig-process .timeline-item{
        display:flex;
        justify-content:flex-start!important;
        padding-left:70px;
    }
    .fig-process .timeline-content{
        width:100%!important;
        padding:0!important;
        text-align:left!important;
    }
    .fig-process .timeline-number{
        left:22px!important;
        transform:translateX(-50%);
    }
    .fig-process .process-title{
        font-size:30px;
    }
    .fig-process .timeline-item.left :is(h4, p) {
    text-align: left;
    }
        .industry-section .industry-menu{
        position:static;
        display:flex;
        gap:20px;
        flex-wrap:wrap;
        margin-bottom:40px;
    }
    .industry-section .industry-link{
        width:auto;
        margin:0;
        font-size:28px;
    }
        .automation-stats .stat-col{
        border-right:none;
        border-bottom:1px solid #ddd;
    }
    .automation-stats .stat-box{
        padding:40px 20px;
    }
    .automation-stats .stats-title{
        font-size:36px;
    }
    .stat-box h3{
        font-size:70px;
    }
    .industry-section .industry-menu{
    flex-direction: column;
}
    .transition-section .comparison-wrapper{
        grid-template-columns:1fr;
        gap:40px;
    }
    .transition-section .timeline{
        display:none;
    }
    .transition-section .left-column h3,
    .transition-section .left-column li{
        text-align:left;
    }
    .transition-section .transition-heading{
        font-size:2.3rem;
        text-align:left;
    }
    .transition-section .comparison-column h3{
        font-size:1.5rem;
    }
    .transition-section .comparison-column li{
        font-size:1.1rem;
        margin-bottom:18px;
    }
        .use-cases-section .use-card{
        padding:30px;
    }
    .use-cases-section .card-title{
        font-size:2rem;
    }
    .use-cases-section .section-title{
        font-size:2.2rem;
    }
        .truth-section{
        padding:50px 0;
    }
    .truth-section .truth-heading{
        font-size:2rem;
        margin-bottom:30px;
    }
    .truth-section .truth-heading-wrap{
        margin-bottom:35px;
    }
        .ASTON360 .sticky-animation {
        position: static;
        margin-top: 2rem;
    }
       .outcomes-section .section-title{
        font-size:2rem;
    }
    .outcomes-section .outcome-card{
        min-height:220px;
    }
        .strategy-section-num .strategy-container{
        padding:35px 28px;
    }
    .strategy-section-num .strategy-title{
        font-size:2rem;
        margin-bottom:25px;
    }
    .strategy-section-num .strategy-intro{
        max-width:100%;
        margin-bottom:20px;
    }
    .brand-keyword-section .section-title{
    font-size:24px;
}
.brand-keyword-section .section-highlight{
    font-size:30px;
}
.brand-keyword-section .brand-name{
    font-size:52px;
}
.brand-keyword-section .brand-stat h2{
    font-size:38px;
}
.brand-keyword-section .tab-pane h3{
    font-size:26px;
}
.brand-keyword-section .brand-tabs{
    gap:10px;
}
.brand-keyword-section .brand-tabs .nav-link{
    min-width:auto;
    padding:10px 20px;
}
    .keyword-mapping-section .keyword-card {
        padding: 50px 40px;
    }
    .keyword-mapping-section .keyword-title {
        font-size: 2rem;
    }
  .industries-register .register-detail {
    padding: 15px 0 0;
  }
  .industries-register .register-link small {
    font-size: 10px;
  }
  }
    /* ===== RESPONSIVE ===== */
    @media (max-width: 991px) {
      .home-hero-inner{
        padding: 60px 40px;
      }
      .home-hero-section .hero-headline {
        font-size: 44px;
        line-height: 54px;
      }
      .hero-subline {
        font-size: 30px;
        line-height: 54px;
      }
      .home-hero-section .agency-label {
        font-size: 22px;
        line-height: 54px;
      }
      .section-career .section-title {
        margin-left: 40px;
      }
    .section-career .headIcon {
                left: -14%;
        }
          .outcome-grid,
  .grid-4 {
    grid-template-columns: repeat(2, 1fr);
  }
  .dashboard-grid {
    grid-template-columns: 1fr 1fr;
  }
  .steps-grid {
    grid-template-columns: 1fr 1fr;
    gap: 24px;
  }
  .hero.paid-media-hero h1 {
    font-size: 56px;
  }
  .process-header-bar h2 {
    font-size: 28px;
  }
  .funnel-dashboard-section .section-header.left.col-md-6,
  .funnel-dashboard-section .funnel-dashboard-img.col-md-6 {
    width: 100%;
  }
   .funnels-section .funnels-heading{
        font-size:2.5rem;
        margin-bottom:30px;
    }
    .funnels-section .top-description{
        margin-left:0;
        font-size:1.2rem;
    }
   .funnels-section  .info-card p,
    .funnels-section .industry-card p{
        font-size:1rem;
    }
    .decision-data-section .section-title{
        font-size:2.3rem;
    }
    .decision-data-section .timing-content{
        flex-direction:column;
        align-items:flex-start;
        gap:25px;
    }
    .outcomes-section{
    padding:60px 0px;
    }
    .outcomes-section .section-title{
        font-size:1.7rem;
    }
    .outcomes-section .outcome-card{
        min-height:auto;
    }
    .outcomes-section .number{
        font-size:1.6rem;
    }
    .automation-stats.dark h4 {
    font-size: 1.2rem !important;
}
  .industry-page .industry-hero {
    padding: 15px 0 55px;
  }
  .industry-page .industry-section {
    padding: 55px 0;
  }
  .industry-page .result-stat {
    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, .4);
    padding: 20px 0;
  }
  .industry-page .framework-wrap {
    padding: 45px 20px;
  }
  .ecommerce-page .industry-title br {
    display: none;
  }
  .ecommerce-page .ecommerce-empty-card {
    display: none;
  }
  .ecommerce-page .fig-table-row>[class*="col-md-"]:last-child {
    padding-top: 10px;
  }
    }
@media (max-width: 768px) {
  .section {
    padding: 50px 0;
  }
  .outcome-grid,
  .grid-4,
  .grid-3,
  .grid-2 {
    grid-template-columns: 1fr;
  }
  .dashboard-grid {
    grid-template-columns: 1fr;
  }
  .steps-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .process-2col {
    grid-template-columns: 1fr;
  }
  .comparison-layout {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .service-row {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .hero.paid-media-hero h1 {
    font-size: 36px;
    margin-bottom: 40px;
  }
  .hero-subtitle {
    flex-direction: column;
    gap: 0;
  }
  .hero-subtitle-text-left:after {
    display: none;
  }
  .process-header-bar h2 {
    font-size: 22px;
  }
  .hero-buttons,
  .cta-buttons {
    flex-direction: column;
    align-items: stretch;
  }
  .container-narrow {
    padding: 0 16px;
  }
  .hero.paid-media-hero h1 br {
    display: none;
}
.hero.paid-media-hero .hero-subtitle-text-left {
    padding-right: 0; 
}
.hero-subtitle.row .col-md-6 {
    width: 100%;
}
.outcomes-section .outcome-grid {
    grid-template-columns: 1fr;
}
.outcomes-section .outcome-card p {
    max-width: 100%;
}
.how-we-force-your-budget-section .steps-grid, 
.process-section .process-2col,
.six-services-section .service-list{
    grid-template-columns: 1fr;
}
.process-2col .process-card:nth-child(3),
.six-services-section .service-list .service-row:nth-child(2){
    border-radius: 0;
}
.process-2col .process-card:nth-child(4) {
    border-radius: 0 0 25px 25px;
}
.six-services-section .service-list .service-row:nth-child(6){
    border-radius: 0 0 26px 26px;
}
.six-services-section .service-list {
    padding: 25px;
}
.section-header h2 {
    font-size: 2rem;
}
.section-header {
    margin-bottom: 20px;
}
.nespresso-vs-keurig-section .teal-card .card-labels {
    flex-direction: column;
}
.process-section .process-header-bar h2 {
    font-size: 2rem;
}
.six-services-section .service-row {
    padding: 25px;
}
.how-we-force-your-budget-section.SAD .steps-grid {
    grid-template-columns: 1fr;
}
      .strategy-search-ads-section .display-title { font-size: 2.5rem; }
          .behavior-section .feature-item {
        flex-direction: column;
        gap: 10px;
    }

    .behavior-section .section-title {
        font-size: 30px;
    }
    .strategy-search-ads-section .display-title {
    font-size: 2rem;
}
.Hero-pill span {
    font-size: 9px !important;
}
      .threePillarDigitalSec .display-title { font-size: 2rem !important; }
      .threePillarDigitalSec .pillar-card { padding: 1.25rem !important; }
      .threePillarDigitalSec .sim-column { min-height: 340px; }
      .threePillarDigitalSec .feature-card { padding: 1rem !important; }
              .OurMethodology .method-card {
            padding: 1.25rem 1.5rem;
            min-height: 180px;
        }
        .OurMethodology .sim-cell {
            padding: 1.25rem 1.5rem;
            min-height: 280px;
        }
        .OurMethodology .method-card .card-desc {
            font-size: 0.8rem;
        }
        .what-paid-media-really-means .darkBg {
    padding: 30px;
}

.recovery-section .audience-grid{
        grid-template-columns:1fr;
    }

.recovery-section .main-heading{
        font-size:1.75rem;
    }

.recovery-section .card-number{
        font-size:1.8rem;
    }
.why-worked-section .step-item{
    grid-template-columns:30px 1fr;
    gap:15px;
    padding:18px 0;
}
.main-heading{
    font-size:1.8rem;
}
.why-worked-section .summary-main{
    font-size:1.1rem;
}
    .retargeting-stats-section .stats-grid{
        grid-template-columns:1fr;
    }
    .retargeting-stats-section .stat-card{
        border-right:none !important;
        min-height:auto;
    }
    .retargeting-stats-section .section-header h2{
        font-size:1.9rem;
    }
    .retargeting-stats-section{
        padding:60px 0;
    }
    .retargeting-stats-section .empty-card{
        display: none;
    }
  .what-paid-media-means-txt h3 {
    font-size: 1.5rem;
}
.OurMethodology .method-card {
    padding: 1.25rem 1.5rem;
    min-height: 180px;
}
.OurMethodology .sim-cell {
    padding: 1.25rem 1.5rem;
    min-height: 280px;
}
.OurMethodology .method-card .card-desc {
    font-size: 0.8rem;
}
    .funnels-section{
        padding:60px 0;
    }
    .funnels-section .funnels-section .container-fluid{
        padding-left:20px;
        padding-right:20px;
    }
    .funnels-section .funnels-heading{
        font-size:2rem;
    }
    .funnels-section .industry-card{
        padding:20px;
    }
    .funnels-section .industry-header span:first-child,
    .funnels-section .industry-header span:last-child{
        font-size:1rem;
    }
    .decision-data-section{
        padding:60px 0;
    }
    .decision-data-section .section-title{
        font-size:1.9rem;
    }
    .decision-data-section .graph-area{
        justify-content:flex-start;
    }
    .decision-data-section .bar{
        width:45px;
    }
      .framework-section{
        padding:60px 0;
    }
    .framework-section .framework-title{
        font-size:1.8rem;
        line-height:1.35;
    }
   .framework-section .framework-description{
        font-size:.95rem;
    }
    .framework-section .framework-card{
        padding:24px 20px;
    }
    .framework-section .framework-card h3{
        font-size:1.2rem;
    }
        .fig-process .process-wrapper{
        padding:40px 20px;
    }
    .fig-process .process-title{
        font-size:24px;
        text-align: left;
    }
    .fig-process .timeline-content h4{
        font-size:20px;
    }
   .fig-process .timeline-content p{
        font-size:15px;
    }
    .fig-process .process-subtitle{
        text-align: left;
    }
        .industry-section .industry-link{
        font-size:22px;
    }
    .industry-section .industry-item h4{
        font-size:20px;
    }
    .industry-section .industry-item p{
        font-size:15px;
    }
        .automation-stats{
        padding:70px 0;
    }
    .automation-stats .stats-title{
        font-size:28px;
    }
    .automation-stats .stats-subtitle{
        font-size:15px;
    }
    .automation-stats .stat-box h3{
        font-size:56px;
    }
    .automation-stats .stat-box h5{
        font-size:18px;
    }
    .automation-stats .stat-box p{
        font-size:14px;
    }
        .use-cases-section{
        padding:60px 0;
    }
    .use-cases-section .card-title{
        font-size:1.7rem;
    }
    .use-cases-section .section-title{
        font-size:1.9rem;
    }
    .use-cases-section .use-card{
        padding:25px;
    }
        .truth-section .truth-heading{
        font-size:1.6rem;
    }
    .truth-section .truth-content p{
        font-size:.95rem;
    }
    .truth-section .heading-line{
        height:45px;
    }
    .how-we-force-your-budget-section.SAD.RDS .steps-grid {
    grid-template-columns: 1fr;
}
div#funnel-engagement, div#funnel-conversion, div#funnel-loyalty {
 width: 100% !important;
}
div#funnel-conversion {
    min-width: unset !important;
}
.RevenueScale.funnel-dashboard-section .row.g-4.g-lg-5.align-items-start {
    flex-direction: column-reverse;
}
.RevenueScale.funnel-dashboard-section .row.g-4.g-lg-5.align-items-start .col-lg-6 {
    flex-direction: column-reverse;
}
.RevenueScale.funnel-dashboard-section {
    padding: 0 20px;
}
.strategy-section-num{
    padding:60px 0;
}
.strategy-section-num .strategy-container{
    padding:25px 20px;
}
.strategy-section-num .strategy-title{
    font-size:1.7rem;
}
.strategy-section-num .strategy-item{
    grid-template-columns:35px 1fr;
    column-gap:16px;
}
.strategy-section-num .content h4{
    font-size:1.2rem;
}
.strategy-section-num .content p{
    font-size:.95rem;
} 
 .RevenueScale.funnel-dashboard-section .row.g-4.g-lg-5.align-items-start > .col-lg-6 .position-sticky.section-header {
    display: flex;
    flex-direction: column-reverse;
}  
}
    @media (max-width: 767px) {
    .home-hero-inner{
      padding: 50px 24px;
      text-align: center;
    }
      .home-hero-section .hero-headline {
        font-size: 32px;
        line-height: 42px;
      }
      .home-hero-section .hero-subline {
        font-size: 22px;
        line-height: 44px;
        justify-content: center;
      }
      .home-hero-section .agency-label {
        font-size: 16px;
        line-height: 40px;
      }
      .home-hero-section .cycled-word {
        min-width: 120px;
      }
      .about-section h1 {
     font-size: 2rem;
}
.sound-like-section {
    padding: 3rem 0;
}
.sound-like-section .cta-heading, 
.sound-like-section .section-heading {
    font-size: 1.8rem;
    line-height: 120%;
    margin-bottom: 10px;
    letter-spacing: 0;
}
.abt-cols-grid {
    flex-direction: column;
    gap: 2rem;
    flex-wrap: wrap;
}
.pain-item,
.question-row{
    padding: 18px 20px;
    font-size: 1rem;
    margin: 0;
}
.pain-list {
    margin-top: 2rem;
}
.section-title-small {
    font-size: 1.3rem;
    margin: 30px 0 12px;
}
.sound-like-section .growth.casestudy.py-5.lozad.bg {
    background-size: 10vw, 16vw, 10vw;
    background-position-x: left, right, center;
}
.founder-img-container {
    width: 100%;
}
.founderSection {
    padding: 3rem 1rem;
}
      .ftr-nav {
    justify-content: start;
}
      .section-career .main-title {
    font-size: 2rem;
}
.section-career {
    padding: 50px 10px;
}
.card  .f-50.mb-0.mt-5 {
    margin-top: 0 !important;
}
.nav-open i.fa-solid.fa-bars {
    font-size: 25px;
    padding-right: 15px;
}
.logo_sec4_content .logo_slide ul li .item_body .item_text p {
    font-size: 14px;
}
.logo_sec4_content .logo_slide ul li .item_body .item_heading h3 {
    font-size: 18px;
    line-height: 1.2;
    margin: 0;
}
.logo_sec4_content .logo_slide ul li .item_body .item_heading {
    align-items: center;
}
div#pills-tabContent .tab-pane .ico {
    bottom: 4%;
    margin: 0;
}
.datapwSec .content-wrapper {
    min-height: 400px;
}
.gsap-btn {
    padding: 10px 20px !important;
}
.revSec h2.f-50{
    padding: 20px;
}
.keyboardCol {
    width: 100%;
}
.page-wrap-blog-internal {
    padding: 0rem 0rem 2rem;
}
.drop-down-cont.small-dropDown {
    top: 15px;
}
.drop-down-cont.active, .drop-down:hover .drop-down-cont {
    max-height: 100%;
}
.small-dropDown .bg-drop {
    background: none;
}
.small-dropDown .row.py-3.border-top {
    background: none;
}
ul.nav-bar {
    padding-left: 15px;
}
.drop-down.close .drop-down-cont {
    max-height: 0;
}
.letter h2 {
    font-size: 22px;
}
.letterSubheading {
    font-size: 12px;
}
.letterText {
    font-size: 10px;
}
.blog-toc-wrap {
      display: block;
      padding: 6rem 1.5rem 2rem;
    }


    .blog-toc-wrap .toc-sidebar {
      position: static;
      padding-right: 0;
      background: #f9fafb;
      border: 1px solid #e5e7eb;
      border-radius: 10px;
      padding: 1rem 1.25rem;
      margin-bottom: 1.5rem;
    }

    .blog-toc-wrap .social-sidebar {
      position: static;
      flex-direction: row;
      flex-wrap: wrap;
      justify-content: center;
      padding-left: 0;
      padding-top: 1.5rem;
      border-top: 1px solid #e5e7eb;
      margin-top: 1rem;
    }

    .blog-toc-wrap .social-label {
      writing-mode: horizontal-tb;
      transform: none;
      width: 100%;
      text-align: center;
      margin-bottom: 0;
    }

    .blog-toc-wrap .social-divider { display: none; }
        .keyword-mapping-section {
        padding: 60px 0;
    }
    .keyword-mapping-section .keyword-card {
        padding: 40px 20px;
    }
    .keyword-mapping-section .keyword-title {
        font-size: 1.6rem;
    }
    .keyword-mapping-section .keyword-text {
        font-size: .95rem;
        line-height: 1.8;
    }
    .article-blog-banner h1.article-title span {
    font-size: 16px;
}
}
@media (max-width: 480px) {
.home-hero-section .hero-headline {
font-size: 26px;
line-height: 36px;
}
.hero-subline {
font-size: 18px;
line-height: 36px;
}
.home-hero-section .agency-label {
font-size: 14px;
line-height: 34px;
}
.home-hero-section .chart-container img {
width: 80%;
margin-top: 40px;
}
.feature {
padding-left: 0;
}
.brand-section-logos .c-logo {
    width: 150px;
}
.main.dkNone {
    display: block !important;
}
.onpageAnimation .resetBtnSrow {
    flex-direction: column;
}
  .industries-register .register-metrics {
    gap: 25px 20px;
  }
  .industries-register .register-metric strong {
    font-size: 28px;
  }
}

@media screen and (max-width: 450px){
.hero-section h1, .section-title, .Nespresso .section-title, .strategy-section .section-title, .section-title .fw-bold, .strategy-section h4, .cta-section .section-title {
    font-size: 1.5rem;
}
.hero-section, .paid-media-section, .funnel-insight-section, .strategic-gains, section.Nespresso, .strategy-section, .faq-section, .cta-section {
    padding: 50px 20px;
}
.faq-section{
     padding: 50px 20px !important;
}
.hero-section p, .custom-accordion .accordion-button, .custom-accordion .accordion-body {
    font-size: 1rem !important;
}
.funnel-insight-section .row {
    gap: 20px;
}
.Nespresso .col-lef:before {
    height: 78%;
}
.Nespresso .top-r {
    padding-bottom: 50px;
}
.numLIst .num.af:after {
    display: none;
}
.cta-section .btn {
    font-size: 14px !important;
}
.strategy-section .feature-list {
    justify-content: left;
    gap: 20px;
    text-align: left;
    padding-left: 20px;
}
.bg-l.drop-down-cont.br.small-dropDown .container {
    padding-top: 0px;
}
.privacy-section-Top .section-title {
    font-size: 2rem;
}
.privacy-section {
  padding: 2rem 1rem;
}  
}
@media screen and (max-width:391px) {
    body {
        font-size: 12px;
    }
    .f-16 {
    font-size: 13px;
}
    .f-20 {
        font-size: 14px;
    }
    .card .f-50 {
    font-size: 30px;
}
.cards-box {
    height: 150vw;
}
.drop-down.main .bg-rad-gra .container {
    padding-left: 1rem !important;
}
.drop-down.main .bg-rad-gra .container .col-xl-3.d-xl-flex {
    padding: 0;
}
.small-dropDown .bg-drop .container{
    margin: 0 !important;
    padding-left: 1rem !important;
}
.key {
    width: 20px;
    height: 20px;
}
}